openproject-primer_view_components 0.86.1 → 0.87.0

data/previews/primer/alpha/dropdown_preview.rb

@@ -54,6 +54,8 @@ module Primer
       # @!group Direction
       #
       # @label Direction e
+      #
+      # @snapshot interactive
       def direction_e
         render(Primer::Alpha::Dropdown.new(display: :inline_block)) do |component|
           component.with_button { "Dropdown" }
@@ -66,6 +68,8 @@ module Primer
       end
 
       # @label Direction ne
+      #
+      # @snapshot interactive
       def direction_ne
         render(Primer::Alpha::Dropdown.new(display: :inline_block)) do |component|
           component.with_button { "Dropdown" }
@@ -78,6 +82,8 @@ module Primer
       end
 
       # @label Direction s
+      #
+      # @snapshot interactive
       def direction_s
         render(Primer::Alpha::Dropdown.new(display: :inline_block)) do |component|
           component.with_button { "Dropdown" }
@@ -90,6 +96,8 @@ module Primer
       end
 
       # @label Direction se
+      #
+      # @snapshot interactive
       def direction_se
         render(Primer::Alpha::Dropdown.new(display: :inline_block)) do |component|
           component.with_button { "Dropdown" }
@@ -102,6 +110,8 @@ module Primer
       end
 
       # @label Direction sw
+      #
+      # @snapshot interactive
       def direction_sw
         render(Primer::Alpha::Dropdown.new(display: :inline_block)) do |component|
           component.with_button { "Dropdown" }
@@ -114,6 +124,8 @@ module Primer
       end
 
       # @label Direction w
+      #
+      # @snapshot interactive
       def direction_w
         render(Primer::Alpha::Dropdown.new(display: :inline_block)) do |component|
           component.with_button { "Dropdown" }

data/previews/primer/alpha/select_panel_preview/with_dynamic_label.html.erb

@@ -4,7 +4,7 @@
   data: { interaction_subject: subject_id },
   id: "with_avatar_items",
   title: "Select users",
-  select_variant: :single,
+  select_variant: select_variant,
   fetch_strategy: :local,
   dynamic_label: true,
   dynamic_label_prefix: "Item",

data/previews/primer/alpha/select_panel_preview/with_dynamic_label_and_aria_prefix.html.erb

@@ -4,7 +4,7 @@
   data: { interaction_subject: subject_id },
   id: "with_avatar_items",
   title: "Select users",
-  select_variant: :single,
+  select_variant: select_variant,
   fetch_strategy: :local,
   dynamic_label: true,
   dynamic_label_prefix: "Item",

data/previews/primer/alpha/select_panel_preview.rb

@@ -144,15 +144,25 @@ module Primer
       # @label With dynamic label
       #
       # @param open_on_load toggle
-      def with_dynamic_label(open_on_load: false)
-        render_with_template(locals: { open_on_load: open_on_load })
+      # @param select_variant [Symbol] select [single, multiple]
+      def with_dynamic_label(open_on_load: false, select_variant: :single)
+        render_with_template(locals: {
+          open_on_load: open_on_load,
+          # .to_sym workaround for https://github.com/lookbook-hq/lookbook/issues/640
+          select_variant: select_variant.to_sym
+        })
       end
 
       # @label With dynamic label and aria prefix
       #
       # @param open_on_load toggle
-      def with_dynamic_label_and_aria_prefix(open_on_load: false)
-        render_with_template(locals: { open_on_load: open_on_load })
+      # @param select_variant [Symbol] select [single, multiple]
+      def with_dynamic_label_and_aria_prefix(open_on_load: false, select_variant: :single)
+        render_with_template(locals: {
+          open_on_load: open_on_load,
+          # .to_sym workaround for https://github.com/lookbook-hq/lookbook/issues/640
+          select_variant: select_variant.to_sym
+        })
       end
 
       # @!endgroup

data/previews/primer/open_project/filterable_tree_view_preview/custom_no_results_text.html.erb

@@ -1,5 +1,5 @@
 <%= render(Primer::OpenProject::FilterableTreeView.new(
-  filter_input_arguments: {placeholder: "Search me!", name: "filter", label: "Filter", visually_hide_label: true},
+  filter_input_arguments: {placeholder: "Search me!", visually_hide_label: true},
   no_results_node_arguments: { label: "All wizards and witches have left the building" })) do |tree| %>
   <% tree.with_sub_tree(label: "Students", expanded: expanded) do |hogwarts| %>
     <% hogwarts.with_sub_tree(label: "Ravenclaw", expanded: expanded) do |ravenclaw| %>

data/previews/primer/open_project/pagination_preview.rb

@@ -23,6 +23,10 @@ module Primer
         margin_page_count = (margin_page_count.presence || 1).to_i
         surrounding_page_count = (surrounding_page_count.presence || 2).to_i
 
+        # Ensure current_page doesn't exceed page_count
+        current_page = [current_page, page_count].min
+        current_page = [current_page, 1].max # Ensure at least 1
+
         render(
           Primer::OpenProject::Pagination.new(
             current_page: current_page,
@@ -46,6 +50,7 @@ module Primer
           )
         )
       end
+
       #
       # @!endgroup
     end

data/previews/primer/open_project/sub_header_preview/playground.html.erb

@@ -0,0 +1,31 @@
+<%= render(Primer::OpenProject::SubHeader.new(collapsed_search: collapsed_search)) do |component|
+  component.with_filter_input(name: "filter",
+                              label: "Filter",
+                              show_clear_button: show_clear_button,
+                              value: value) if show_filter_input
+
+  component.with_filter_button(mobile_label: "All filters") do
+    "All filters"
+  end if show_filter_button
+
+  component.with_text { text } unless text.nil?
+
+  component.with_action_button(leading_icon: :plus, label: "Create", scheme: :primary) do
+    "Create"
+  end if show_action_button
+
+  if show_quick_filter
+    component.with_quick_filter do
+      render(Primer::Alpha::SelectPanel.new(title: "Version",
+                                            select_variant: :single,
+                                            fetch_strategy: :local,
+                                            dynamic_label: true,
+                                            dynamic_label_prefix: "Version")) do |panel|
+        panel.with_show_button { "Version" }
+        panel.with_item(label: "1.0")
+        panel.with_item(label: "2.0")
+        panel.with_item(label: "2.1")
+      end
+    end
+  end
+end %>

data/previews/primer/open_project/sub_header_preview/quick_filters.html.erb

@@ -5,6 +5,21 @@
     "All filters"
   end
 
+  component.with_quick_sort do
+    render(Primer::Beta::IconButton.new(icon: :"sort-desc", "aria-label": "Sort"))
+  end
+
+  component.with_quick_group do
+    render(Primer::Beta::IconButton.new(icon: :rows, "aria-label": "Group"))
+  end
+
+  component.with_quick_filter do
+    render(Primer::Alpha::SegmentedControl.new("aria-label": "File view")) do |component|
+      component.with_item(label: "Monthly", selected: true)
+      component.with_item(label: "Yearly")
+    end
+  end
+
   component.with_quick_filter do
     render(Primer::Alpha::SelectPanel.new(title: "Version",
                                           select_variant: :single,

data/previews/primer/open_project/sub_header_preview.rb

@@ -10,6 +10,7 @@ module Primer
       # @label Playground
       # @param show_filter_input toggle
       # @param show_filter_button toggle
+      # @param show_quick_filter toggle
       # @param show_action_button toggle
       # @param show_clear_button toggle
       # @param collapsed_search toggle
@@ -19,28 +20,20 @@ module Primer
         show_filter_input: true,
         show_clear_button: true,
         show_filter_button: true,
+        show_quick_filter: true,
         show_action_button: true,
         collapsed_search: false,
         text: nil,
         value: nil
       )
-        render(Primer::OpenProject::SubHeader.new(collapsed_search: collapsed_search)) do |component|
-          component.with_filter_input(
-            name: "filter",
-            label: "Filter",
-            show_clear_button: show_clear_button,
-            value: value) if show_filter_input
-          component.with_filter_button do |button|
-            button.with_trailing_visual_counter(count: "15")
-            "Filter"
-          end if show_filter_button
-
-          component.with_text { text } unless text.nil?
-
-          component.with_action_button(leading_icon: :plus, label: "Create", scheme: :primary) do
-            "Create"
-          end if show_action_button
-        end
+        render_with_template(locals: {show_filter_input: show_filter_input,
+                                      show_clear_button: show_clear_button,
+                                      show_filter_button: show_filter_button,
+                                      show_quick_filter: show_quick_filter,
+                                      show_action_button: show_action_button,
+                                      collapsed_search: collapsed_search,
+                                      text: text,
+                                      value: value})
       end
 
       # @label Default

data/static/arguments.json

@@ -6599,6 +6599,15 @@
       }
     ]
   },
+  {
+    "component": "OpenProject::SubHeader::QuickActionComponent",
+    "status": "open_project",
+    "a11y_reviewed": false,
+    "short_name": "OpenProjectSubHeaderQuickActionComponent",
+    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/open_project/sub_header/quick_filter.rb",
+    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/open_project/sub_header/quick_filter/default/",
+    "parameters": []
+  },
   {
     "component": "OpenProject::SubHeader::SegmentedControl",
     "status": "open_project",

data/static/audited_at.json

@@ -173,6 +173,7 @@
   "Primer::OpenProject::SubHeader::Button": "",
   "Primer::OpenProject::SubHeader::ButtonGroup": "",
   "Primer::OpenProject::SubHeader::Menu": "",
+  "Primer::OpenProject::SubHeader::QuickActionComponent": "",
   "Primer::OpenProject::SubHeader::SegmentedControl": "2023-02-01",
   "Primer::OpenProject::ZenModeButton": "",
   "Primer::Tooltip": "",

data/static/constants.json

@@ -1984,16 +1984,19 @@
     "Button": "Primer::OpenProject::SubHeader::Button",
     "ButtonGroup": "Primer::OpenProject::SubHeader::ButtonGroup",
     "DESKTOP_ACTIONS_DISPLAY": [
+      "none",
       "none",
       "flex"
     ],
     "FILTER_EXPAND_BUTTON_TARGET_SELECTOR": "sub-header.filterExpandButton",
     "GeneratedSlotMethods": "Primer::OpenProject::SubHeader::GeneratedSlotMethods",
     "MOBILE_ACTIONS_DISPLAY": [
+      "flex",
       "flex",
       "none"
     ],
     "Menu": "Primer::OpenProject::SubHeader::Menu",
+    "QuickActionComponent": "Primer::OpenProject::SubHeader::QuickActionComponent",
     "SHOWN_FILTER_TARGET_SELECTOR": "sub-header.shownItemsOnExpandedFilter",
     "SegmentedControl": "Primer::OpenProject::SubHeader::SegmentedControl"
   },
@@ -2006,6 +2009,9 @@
   "Primer::OpenProject::SubHeader::Menu": {
     "GeneratedSlotMethods": "Primer::OpenProject::SubHeader::Menu::GeneratedSlotMethods"
   },
+  "Primer::OpenProject::SubHeader::QuickActionComponent": {
+    "GeneratedSlotMethods": "Primer::OpenProject::SubHeader::QuickActionComponent::GeneratedSlotMethods"
+  },
   "Primer::OpenProject::SubHeader::SegmentedControl": {
     "GeneratedSlotMethods": "Primer::OpenProject::SubHeader::SegmentedControl::GeneratedSlotMethods"
   },

data/static/info_arch.json

@@ -4270,7 +4270,7 @@
       {
         "preview_path": "primer/alpha/dropdown/direction_e",
         "name": "direction_e",
-        "snapshot": "false",
+        "snapshot": "interactive",
         "skip_rules": {
           "wont_fix": [
             "region"
@@ -4283,7 +4283,7 @@
       {
         "preview_path": "primer/alpha/dropdown/direction_ne",
         "name": "direction_ne",
-        "snapshot": "false",
+        "snapshot": "interactive",
         "skip_rules": {
           "wont_fix": [
             "region"
@@ -4296,7 +4296,7 @@
       {
         "preview_path": "primer/alpha/dropdown/direction_s",
         "name": "direction_s",
-        "snapshot": "false",
+        "snapshot": "interactive",
         "skip_rules": {
           "wont_fix": [
             "region"
@@ -4309,7 +4309,7 @@
       {
         "preview_path": "primer/alpha/dropdown/direction_se",
         "name": "direction_se",
-        "snapshot": "false",
+        "snapshot": "interactive",
         "skip_rules": {
           "wont_fix": [
             "region"
@@ -4322,7 +4322,7 @@
       {
         "preview_path": "primer/alpha/dropdown/direction_sw",
         "name": "direction_sw",
-        "snapshot": "false",
+        "snapshot": "interactive",
         "skip_rules": {
           "wont_fix": [
             "region"
@@ -4335,7 +4335,7 @@
       {
         "preview_path": "primer/alpha/dropdown/direction_w",
         "name": "direction_w",
-        "snapshot": "false",
+        "snapshot": "interactive",
         "skip_rules": {
           "wont_fix": [
             "region"
@@ -22107,6 +22107,25 @@
     "previews": [],
     "subcomponents": []
   },
+  {
+    "fully_qualified_name": "Primer::OpenProject::SubHeader::QuickActionComponent",
+    "description": "Thin wrapper for quick filter slots that defers BaseComponent construction to render time,\nallowing system arguments (e.g. display) to be mutated in before_render.\nDo not use standalone",
+    "accessibility_docs": null,
+    "is_form_component": false,
+    "is_published": true,
+    "requires_js": false,
+    "component": "OpenProject::SubHeader::QuickActionComponent",
+    "status": "open_project",
+    "a11y_reviewed": false,
+    "short_name": "OpenProjectSubHeaderQuickActionComponent",
+    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/open_project/sub_header/quick_filter.rb",
+    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/open_project/sub_header/quick_filter/default/",
+    "parameters": [],
+    "slots": [],
+    "methods": [],
+    "previews": [],
+    "subcomponents": []
+  },
   {
     "fully_qualified_name": "Primer::OpenProject::SubHeader::SegmentedControl",
     "description": "A Helper class to create SegmentedControls inside the SubHeader action slot\nDo not use standalone",

data/static/previews.json

@@ -4057,7 +4057,7 @@
       {
         "preview_path": "primer/alpha/dropdown/direction_e",
         "name": "direction_e",
-        "snapshot": "false",
+        "snapshot": "interactive",
         "skip_rules": {
           "wont_fix": [
             "region"
@@ -4070,7 +4070,7 @@
       {
         "preview_path": "primer/alpha/dropdown/direction_ne",
         "name": "direction_ne",
-        "snapshot": "false",
+        "snapshot": "interactive",
         "skip_rules": {
           "wont_fix": [
             "region"
@@ -4083,7 +4083,7 @@
       {
         "preview_path": "primer/alpha/dropdown/direction_s",
         "name": "direction_s",
-        "snapshot": "false",
+        "snapshot": "interactive",
         "skip_rules": {
           "wont_fix": [
             "region"
@@ -4096,7 +4096,7 @@
       {
         "preview_path": "primer/alpha/dropdown/direction_se",
         "name": "direction_se",
-        "snapshot": "false",
+        "snapshot": "interactive",
         "skip_rules": {
           "wont_fix": [
             "region"
@@ -4109,7 +4109,7 @@
       {
         "preview_path": "primer/alpha/dropdown/direction_sw",
         "name": "direction_sw",
-        "snapshot": "false",
+        "snapshot": "interactive",
         "skip_rules": {
           "wont_fix": [
             "region"
@@ -4122,7 +4122,7 @@
       {
         "preview_path": "primer/alpha/dropdown/direction_w",
         "name": "direction_w",
-        "snapshot": "false",
+        "snapshot": "interactive",
         "skip_rules": {
           "wont_fix": [
             "region"

data/static/statuses.json

@@ -173,6 +173,7 @@
   "Primer::OpenProject::SubHeader::Button": "open_project",
   "Primer::OpenProject::SubHeader::ButtonGroup": "open_project",
   "Primer::OpenProject::SubHeader::Menu": "open_project",
+  "Primer::OpenProject::SubHeader::QuickActionComponent": "open_project",
   "Primer::OpenProject::SubHeader::SegmentedControl": "open_project",
   "Primer::OpenProject::ZenModeButton": "open_project",
   "Primer::Tooltip": "deprecated",

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: openproject-primer_view_components
 version: !ruby/object:Gem::Version
-  version: 0.86.1
+  version: 0.87.0
 platform: ruby
 authors:
 - GitHub Open Source
@@ -689,6 +689,7 @@ files:
 - app/components/primer/open_project/sub_header/button.rb
 - app/components/primer/open_project/sub_header/button_group.rb
 - app/components/primer/open_project/sub_header/menu.rb
+- app/components/primer/open_project/sub_header/quick_action_component.rb
 - app/components/primer/open_project/sub_header/segmented_control.rb
 - app/components/primer/open_project/sub_header_element.d.ts
 - app/components/primer/open_project/sub_header_element.js
@@ -1313,6 +1314,7 @@ files:
 - previews/primer/open_project/sub_header_preview/button_group.html.erb
 - previews/primer/open_project/sub_header_preview/custom_filter_button.html.erb
 - previews/primer/open_project/sub_header_preview/dialog_buttons.html.erb
+- previews/primer/open_project/sub_header_preview/playground.html.erb
 - previews/primer/open_project/sub_header_preview/quick_filters.html.erb
 - previews/primer/open_project/zen_mode_button_preview.rb
 - previews/primer/url_helpers.rb