openproject-primer_view_components 0.60.0 → 0.61.1

data/previews/primer/open_project/collapsible_section_preview/with_additional_information.html.erb

@@ -0,0 +1,16 @@
+<%= render(Primer::OpenProject::CollapsibleSection.new) do |section| %>
+  <% section.with_title { "Wednesday 11" } %>
+
+  <% section.with_additional_information do %>
+    <%= render(Primer::Beta::Text.new) { "6h 30min" } %>
+  <% end %>
+
+  <% section.with_collapsible_content do %>
+    <%= render(Primer::Beta::BorderBox.new) do |component|
+      component.with_header { "Header" }
+      component.with_body { "Body" }
+      component.with_row { "Row one" }
+      component.with_row { "Row two" }
+    end %>
+  <% end %>
+<% end %>

data/previews/primer/open_project/collapsible_section_preview/with_caption.html.erb

@@ -0,0 +1,14 @@
+<%= render(Primer::OpenProject::CollapsibleSection.new) do |section| %>
+  <% section.with_title { "Wednesday 11" } %>
+
+  <% section.with_caption { "Today" } %>
+
+  <% section.with_collapsible_content do %>
+    <%= render(Primer::Beta::BorderBox.new) do |component|
+      component.with_header { "Header" }
+      component.with_body { "Body" }
+      component.with_row { "Row one" }
+      component.with_row { "Row two" }
+    end %>
+  <% end %>
+<% end %>

data/previews/primer/open_project/collapsible_section_preview.rb

@@ -0,0 +1,57 @@
+# frozen_string_literal: true
+
+# Setup Playground to use all available component props
+# Setup Features to use individual component props and combinations
+
+module Primer
+  module OpenProject
+    # @label CollapsibleSection
+    class CollapsibleSectionPreview < ViewComponent::Preview
+      # @label Playground
+      # @param caption [String] text
+      # @param show_additional_information [Boolean] toggle
+      def playground(caption: "(optional)", show_additional_information: false)
+        render_with_template(
+          template: "primer/open_project/collapsible_section_preview/playground",
+          locals: { caption: caption, show_additional_information: show_additional_information}
+        )
+      end
+
+      # @label Default
+      # @snapshot
+      def default
+        render_with_template(
+          template: "primer/open_project/collapsible_section_preview/default",
+          locals: { }
+        )
+      end
+
+      # @label With additional information
+      # @snapshot
+      def with_additional_information
+        render_with_template(
+          template: "primer/open_project/collapsible_section_preview/with_additional_information",
+          locals: { }
+        )
+      end
+
+      # @label With caption
+      # @snapshot
+      def with_caption
+        render_with_template(
+          template: "primer/open_project/collapsible_section_preview/with_caption",
+          locals: { }
+        )
+      end
+
+      # @label Collapsed
+      # @snapshot
+      def collapsed
+        render_with_template(
+          template: "primer/open_project/collapsible_section_preview/collapsed",
+          locals: { }
+        )
+      end
+    end
+  end
+end

data/static/arguments.json

@@ -5128,6 +5128,12 @@
     "source": "https://github.com/primer/view_components/tree/main/app/components/primer/open_project/border_box/collapsible_header.rb",
     "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/open_project/border_box/collapsible_header/default/",
     "parameters": [
+      {
+        "name": "collapsed",
+        "type": "Boolean",
+        "default": "`false`",
+        "description": "Whether the header is collapsed on initial render."
+      },
       {
         "name": "system_arguments",
         "type": "Hash",
@@ -5174,6 +5180,28 @@
       }
     ]
   },
+  {
+    "component": "OpenProject::CollapsibleSection",
+    "status": "open_project",
+    "a11y_reviewed": false,
+    "short_name": "OpenProjectCollapsibleSection",
+    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/open_project/collapsible_section.rb",
+    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/open_project/collapsible_section/default/",
+    "parameters": [
+      {
+        "name": "collapsed",
+        "type": "Boolean",
+        "default": "`false`",
+        "description": "Whether the section is collapsed on initial render."
+      },
+      {
+        "name": "system_arguments",
+        "type": "Hash",
+        "default": "N/A",
+        "description": "[System arguments](/system-arguments)"
+      }
+    ]
+  },
   {
     "component": "OpenProject::DangerDialog",
     "status": "open_project",

data/static/audited_at.json

@@ -120,6 +120,7 @@
   "Primer::OpenProject::BorderBox::CollapsibleHeader": "",
   "Primer::OpenProject::BorderGrid": "",
   "Primer::OpenProject::BorderGrid::Cell": "",
+  "Primer::OpenProject::CollapsibleSection": "",
   "Primer::OpenProject::DangerDialog": "",
   "Primer::OpenProject::DangerDialog::ConfirmationCheckBox": "",
   "Primer::OpenProject::DangerDialog::FormWrapper": "",

data/static/classes.json

@@ -243,6 +243,9 @@
   "CollapsibleHeader": [
     "Primer::OpenProject::BorderBox::CollapsibleHeader"
   ],
+  "CollapsibleSection--triggerArea": [
+    "Primer::OpenProject::CollapsibleSection"
+  ],
   "Counter": [
     "Primer::Beta::Counter"
   ],

data/static/constants.json

@@ -1574,6 +1574,19 @@
   "Primer::OpenProject::BorderGrid::Cell": {
     "GeneratedSlotMethods": "Primer::OpenProject::BorderGrid::Cell::GeneratedSlotMethods"
   },
+  "Primer::OpenProject::CollapsibleSection": {
+    "GeneratedSlotMethods": "Primer::OpenProject::CollapsibleSection::GeneratedSlotMethods",
+    "TITLE_TAG_FALLBACK": "h2",
+    "TITLE_TAG_OPTIONS": [
+      "h1",
+      "h2",
+      "h3",
+      "h4",
+      "h5",
+      "h6",
+      "span"
+    ]
+  },
   "Primer::OpenProject::DangerDialog": {
     "ConfirmationCheckBox": "Primer::OpenProject::DangerDialog::ConfirmationCheckBox",
     "FormWrapper": "Primer::OpenProject::DangerDialog::FormWrapper",

data/static/info_arch.json

@@ -17575,6 +17575,12 @@
     "source": "https://github.com/primer/view_components/tree/main/app/components/primer/open_project/border_box/collapsible_header.rb",
     "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/open_project/border_box/collapsible_header/default/",
     "parameters": [
+      {
+        "name": "collapsed",
+        "type": "Boolean",
+        "default": "`false`",
+        "description": "Whether the header is collapsed on initial render."
+      },
       {
         "name": "system_arguments",
         "type": "Hash",
@@ -17583,7 +17589,42 @@
       }
     ],
     "slots": [
-
+      {
+        "name": "title",
+        "description": "Required title",
+        "parameters": [
+          {
+            "name": "system_arguments",
+            "type": "Hash",
+            "default": "N/A",
+            "description": "{{link_to_system_arguments_docs}}"
+          }
+        ]
+      },
+      {
+        "name": "count",
+        "description": "Optional count",
+        "parameters": [
+          {
+            "name": "system_arguments",
+            "type": "Hash",
+            "default": "N/A",
+            "description": "{{link_to_system_arguments_docs}}"
+          }
+        ]
+      },
+      {
+        "name": "description",
+        "description": "Optional description",
+        "parameters": [
+          {
+            "name": "system_arguments",
+            "type": "Hash",
+            "default": "N/A",
+            "description": "{{link_to_system_arguments_docs}}"
+          }
+        ]
+      }
     ],
     "methods": [
 
@@ -17782,6 +17823,163 @@
 
     ]
   },
+  {
+    "fully_qualified_name": "Primer::OpenProject::CollapsibleSection",
+    "description": "A component consisting of a title and collapsible content.\nClicking the title will hide the collapsible content",
+    "accessibility_docs": null,
+    "is_form_component": false,
+    "is_published": true,
+    "requires_js": false,
+    "component": "OpenProject::CollapsibleSection",
+    "status": "open_project",
+    "a11y_reviewed": false,
+    "short_name": "OpenProjectCollapsibleSection",
+    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/open_project/collapsible_section.rb",
+    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/open_project/collapsible_section/default/",
+    "parameters": [
+      {
+        "name": "collapsed",
+        "type": "Boolean",
+        "default": "`false`",
+        "description": "Whether the section is collapsed on initial render."
+      },
+      {
+        "name": "system_arguments",
+        "type": "Hash",
+        "default": "N/A",
+        "description": "{{link_to_system_arguments_docs}}"
+      }
+    ],
+    "slots": [
+      {
+        "name": "title",
+        "description": "Required Title",
+        "parameters": [
+          {
+            "name": "tag",
+            "type": "Symbol",
+            "default": "N/A",
+            "description": "Customize the element type of the rendered title container."
+          },
+          {
+            "name": "system_arguments",
+            "type": "Hash",
+            "default": "N/A",
+            "description": "{{link_to_system_arguments_docs}}"
+          }
+        ]
+      },
+      {
+        "name": "caption",
+        "description": "Optional caption",
+        "parameters": [
+          {
+            "name": "system_arguments",
+            "type": "Hash",
+            "default": "N/A",
+            "description": "{{link_to_system_arguments_docs}}"
+          }
+        ]
+      },
+      {
+        "name": "additional_information",
+        "description": "Optional right-side content",
+        "parameters": [
+          {
+            "name": "system_arguments",
+            "type": "Hash",
+            "default": "N/A",
+            "description": "{{link_to_system_arguments_docs}}"
+          }
+        ]
+      },
+      {
+        "name": "collapsible_content",
+        "description": "Required collapsible content",
+        "parameters": [
+          {
+            "name": "system_arguments",
+            "type": "Hash",
+            "default": "N/A",
+            "description": "{{link_to_system_arguments_docs}}"
+          }
+        ]
+      }
+    ],
+    "methods": [
+
+    ],
+    "previews": [
+      {
+        "preview_path": "primer/open_project/collapsible_section/playground",
+        "name": "playground",
+        "snapshot": "false",
+        "skip_rules": {
+          "wont_fix": [
+            "region"
+          ],
+          "will_fix": [
+            "color-contrast"
+          ]
+        }
+      },
+      {
+        "preview_path": "primer/open_project/collapsible_section/default",
+        "name": "default",
+        "snapshot": "true",
+        "skip_rules": {
+          "wont_fix": [
+            "region"
+          ],
+          "will_fix": [
+            "color-contrast"
+          ]
+        }
+      },
+      {
+        "preview_path": "primer/open_project/collapsible_section/with_additional_information",
+        "name": "with_additional_information",
+        "snapshot": "true",
+        "skip_rules": {
+          "wont_fix": [
+            "region"
+          ],
+          "will_fix": [
+            "color-contrast"
+          ]
+        }
+      },
+      {
+        "preview_path": "primer/open_project/collapsible_section/with_caption",
+        "name": "with_caption",
+        "snapshot": "true",
+        "skip_rules": {
+          "wont_fix": [
+            "region"
+          ],
+          "will_fix": [
+            "color-contrast"
+          ]
+        }
+      },
+      {
+        "preview_path": "primer/open_project/collapsible_section/collapsed",
+        "name": "collapsed",
+        "snapshot": "true",
+        "skip_rules": {
+          "wont_fix": [
+            "region"
+          ],
+          "will_fix": [
+            "color-contrast"
+          ]
+        }
+      }
+    ],
+    "subcomponents": [
+
+    ]
+  },
   {
     "fully_qualified_name": "Primer::OpenProject::DangerDialog",
     "description": "A pre-configured dialog for destructive/\"potentially dangerous\" actions",

data/static/previews.json

@@ -3043,6 +3043,79 @@
       }
     ]
   },
+  {
+    "name": "collapsible_section",
+    "component": "OpenProject::CollapsibleSection",
+    "status": "open_project",
+    "lookup_path": "primer/open_project/collapsible_section",
+    "examples": [
+      {
+        "preview_path": "primer/open_project/collapsible_section/playground",
+        "name": "playground",
+        "snapshot": "false",
+        "skip_rules": {
+          "wont_fix": [
+            "region"
+          ],
+          "will_fix": [
+            "color-contrast"
+          ]
+        }
+      },
+      {
+        "preview_path": "primer/open_project/collapsible_section/default",
+        "name": "default",
+        "snapshot": "true",
+        "skip_rules": {
+          "wont_fix": [
+            "region"
+          ],
+          "will_fix": [
+            "color-contrast"
+          ]
+        }
+      },
+      {
+        "preview_path": "primer/open_project/collapsible_section/with_additional_information",
+        "name": "with_additional_information",
+        "snapshot": "true",
+        "skip_rules": {
+          "wont_fix": [
+            "region"
+          ],
+          "will_fix": [
+            "color-contrast"
+          ]
+        }
+      },
+      {
+        "preview_path": "primer/open_project/collapsible_section/with_caption",
+        "name": "with_caption",
+        "snapshot": "true",
+        "skip_rules": {
+          "wont_fix": [
+            "region"
+          ],
+          "will_fix": [
+            "color-contrast"
+          ]
+        }
+      },
+      {
+        "preview_path": "primer/open_project/collapsible_section/collapsed",
+        "name": "collapsed",
+        "snapshot": "true",
+        "skip_rules": {
+          "wont_fix": [
+            "region"
+          ],
+          "will_fix": [
+            "color-contrast"
+          ]
+        }
+      }
+    ]
+  },
   {
     "name": "counter",
     "component": "Counter",

data/static/statuses.json

@@ -120,6 +120,7 @@
   "Primer::OpenProject::BorderBox::CollapsibleHeader": "open_project",
   "Primer::OpenProject::BorderGrid": "open_project",
   "Primer::OpenProject::BorderGrid::Cell": "open_project",
+  "Primer::OpenProject::CollapsibleSection": "open_project",
   "Primer::OpenProject::DangerDialog": "open_project",
   "Primer::OpenProject::DangerDialog::ConfirmationCheckBox": "open_project",
   "Primer::OpenProject::DangerDialog::FormWrapper": "open_project",

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: openproject-primer_view_components
 version: !ruby/object:Gem::Version
-  version: 0.60.0
+  version: 0.61.1
 platform: ruby
 authors:
 - GitHub Open Source
@@ -9,7 +9,7 @@ authors:
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2025-04-07 00:00:00.000000000 Z
+date: 2025-04-15 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: actionview
@@ -105,6 +105,8 @@ files:
 - app/assets/javascripts/components/primer/dialog_helper.d.ts
 - app/assets/javascripts/components/primer/focus_group.d.ts
 - app/assets/javascripts/components/primer/open_project/border_box/collapsible_header.d.ts
+- app/assets/javascripts/components/primer/open_project/collapsible.d.ts
+- app/assets/javascripts/components/primer/open_project/collapsible_section.d.ts
 - app/assets/javascripts/components/primer/open_project/danger_dialog_form_helper.d.ts
 - app/assets/javascripts/components/primer/open_project/page_header_element.d.ts
 - app/assets/javascripts/components/primer/open_project/sub_header_element.d.ts
@@ -508,6 +510,18 @@ files:
 - app/components/primer/open_project/border_grid.rb
 - app/components/primer/open_project/border_grid/cell.html.erb
 - app/components/primer/open_project/border_grid/cell.rb
+- app/components/primer/open_project/collapsible.d.ts
+- app/components/primer/open_project/collapsible.js
+- app/components/primer/open_project/collapsible.ts
+- app/components/primer/open_project/collapsible_section.css
+- app/components/primer/open_project/collapsible_section.css.json
+- app/components/primer/open_project/collapsible_section.css.map
+- app/components/primer/open_project/collapsible_section.d.ts
+- app/components/primer/open_project/collapsible_section.html.erb
+- app/components/primer/open_project/collapsible_section.js
+- app/components/primer/open_project/collapsible_section.pcss
+- app/components/primer/open_project/collapsible_section.rb
+- app/components/primer/open_project/collapsible_section.ts
 - app/components/primer/open_project/danger_dialog.html.erb
 - app/components/primer/open_project/danger_dialog.rb
 - app/components/primer/open_project/danger_dialog/confirmation_check_box.rb
@@ -1045,6 +1059,12 @@ files:
 - previews/primer/open_project/border_box/collapsible_header_preview.rb
 - previews/primer/open_project/border_box/collapsible_header_preview/playground.html.erb
 - previews/primer/open_project/border_grid_preview.rb
+- previews/primer/open_project/collapsible_section_preview.rb
+- previews/primer/open_project/collapsible_section_preview/collapsed.html.erb
+- previews/primer/open_project/collapsible_section_preview/default.html.erb
+- previews/primer/open_project/collapsible_section_preview/playground.html.erb
+- previews/primer/open_project/collapsible_section_preview/with_additional_information.html.erb
+- previews/primer/open_project/collapsible_section_preview/with_caption.html.erb
 - previews/primer/open_project/danger_dialog_preview.rb
 - previews/primer/open_project/danger_dialog_preview/deletion_form.rb
 - previews/primer/open_project/danger_dialog_preview/playground.html.erb