Undo rubocop changes which messed up the preview

lookbook/docs/components/border-box-table.md.erb

@@ -4,19 +4,19 @@
 
 ## Anatomy
 
-**Note:** The BorderBoxTable is based on the `Primer::Beta::BorderBox` with a CSS grid applied inside to align the individual rows and make it look like a table. Please note, that it is technically not a table and has therefore none of the benefits a normal HTML table would have (e.g  automatic column width adjustments or accessibility support). If you want or need that, please use the [TableComponent docs](./tables))
+**Note:** The BorderBoxTable is based on the `Primer::Beta::BorderBox` with a CSS grid applied inside to align the individual rows and make it look like a table. Please note, that it is technically not a table and has therefore none of the benefits a normal HTML table would have (e.g  automatic column width adjustments or accessibility short cuts). If you want or need that, please use the [TableComponent docs](./tables))
 
 ## Best practices
 
 **Do**
 
-- Use a BorderBox table if you have a *few* entries of unsorted data, that does not require pagination
+- Use a BorderBoxTable if you have a *few* entries of unsorted data, that does not require pagination
 - Use up to two actions using the `:secondary` scheme of `Primer::Beta::Button` and `Primer::Beta::IconButton`.
 - OR: Use an action menu with `:invisible` scheme
 
 **Don't**
 
-- Use the BorderBox table for a lot of items that require sorting or pagination
+- Use the BorderBoxTable for a lot of items that require sorting or pagination
 
 ## Technical notes
 
@@ -79,3 +79,6 @@ end
 <%= embed OpPrimer::BorderBoxTableComponentPreview, :default, panels: %i[source] %>
 
 For detailed examples have a look at the other [preview examples](/lookbook/inspect/OpenProject/Primer/border_box_table/default) of the component.
+
+Note for Henriette:
+Example with CollapsibleHeader???

lookbook/docs/components/border-box.md.erb

@@ -1,7 +1,7 @@
 The Border Box element is used to display structured items in a list, each with a set of actions. It is used for example:
 
-- to display a list of meetings 
-- to display individual meeting agenda items in a meeting 
+- to display a list of meetings
+- to display individual meeting agenda items in a meeting
 - to display the a list of project attributes
 - to display a list of configured OAuth applications
 
@@ -14,12 +14,15 @@ The Border Box element is made up of
 
 If a page uses a Border Box with a header, all sections must use headers.
 
-## Options
+## Header
+
+Note for Parimal:
+You can chose between a collapsibleHeader and a free-chosen Header. The collapsible Header consists of Title, counter(optional) and description(optional).
 
 - **Collapsible header**: A collapsible header has an arrow next to the title and allows collapsing and expanding the contents below. When collapsed, the bottom border is slightly thicker to indicate something is hidden.
-- **Header description**: When collapsed, the optional header description is hidden.
-- **Header counter**: The counter can display the number of items that that particular section contains.
-- **Draggable**: Both header and items can have drag handles. Individual items can be dragged up and down and into other sections. The sections themselves can also be moved up and down.
+  - **Header description**: When collapsed, the optional header description is hidden.
+  - **Header counter**: The counter can display the number of items that that particular section contains.
+
 - **More button**: A more button can have contextual actions such as edit, delete and move (move up, move to top, move down, move to the end).
 
 ## Best practices
@@ -27,11 +30,12 @@ If a page uses a Border Box with a header, all sections must use headers.
 **Do**
 
 - Use sections (with headers) to better organise content if they have logical categories (eg. Open and Planned meetings).
+- - **Draggable**: Both header and items can have drag handles. Individual items can be dragged up and down and into other sections. The sections themselves can also be moved up and down.
 
 **Don't**
 
 - Don't mix sections with and without headers. If one section has a header, they must all have headers.
-- Don't make sections collapsible if they do not need to be. 
+- Don't make sections collapsible if they do not need to be.
 
 
 ## Technical notes

lookbook/docs/components/tables.md.erb

@@ -41,6 +41,39 @@ Define the columns of the table as class method:
 
 ```ruby
 module ModuleA
-  class TableComponent <::TableComponent
-    columns :name
+  class TableComponent < ::TableComponent
+    columns :name, :description, :sort
+    # ...
+  end
+end
+```
+
+**Headers**
+
+Define the headers of the component as a method retu
+
+```ruby
+module ModuleA
+  class TableComponent < ::TableComponent
+    # ...
+
+    def headers
+      [
+        [:a, { caption: 'Column A' }],
+        [:b, { caption: 'Column B' }],
+        [:c, { caption: 'Column C' }]
+      ]
+    end
+
+  # ...
+  end
+end
+```
+
+**Actions**
+
+Define the actions in the row component as `button_links`. See the example code
+
+### Full example
+
 <%= embed OpenProject::Deprecated::TablePreview, :default, panels: %i[source] %>

lookbook/previews/open_project/deprecated/table_preview/default.html.erb

@@ -28,11 +28,11 @@
         end
 
         def foo
-          render(Primer::Beta::Text.new(tag: :p)) { "Hello there" }
+          render(Primer::Beta::Text.new(tag: :p)) { "Lorem ipsum dolor sit amet, consetetur sadipscing elitr" }
         end
 
         def bar
-          "bar"
+          "At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum."
         end
       end
     end