openproject-primer_view_components 0.62.0 → 0.64.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 4929f92b5de2ff7680b004eda5619b18549a1205583b53e152d3ca1b53699238
-  data.tar.gz: f41e2230548ff1bd6dfe7e1560a78b3470c082e36d295c648f993745956dfa9c
+  metadata.gz: c14efbdaa174fe50a4ab8910f0d4d15b7395e9cb13f10c437a733205f31a713a
+  data.tar.gz: '06395f1e3999aad177aed7b3312f0ce397fdc02893cca1ed55b8788d58ba915f'
 SHA512:
-  metadata.gz: 9541c3e5adb821cb65525fd20ad425cedad0235f3aaeca2dd0ceb8fc77b1b890e10602b30aa9d7e91628376f52d5112421afc17e3ffb5b883380474e61675a8d
-  data.tar.gz: 81d3002af641bd143d1decad9d0ca419fe5b83103102caa79d1dc407b5a5809886a29cc1bdf1ef9a05874876127645b1056611d07bd6aaa520b8ee1dad15ecdc
+  metadata.gz: 2c24a2a4acee0ffe10644fa9d1195b2640fac91f77159c9919359b0585e72931d4b541676f3021dcc921c0523a829f21963eda4fb62024fb72d9be700540985b
+  data.tar.gz: 8785b506bc36848f1251bff3d7e85631fa9a5b9dd3a4c6b21e1d2333bf79ae8dcef228b6d023b9909a7b051dfb430e1815273b4370618b81e19d7ce9a7b02989

data/CHANGELOG.md

@@ -1,5 +1,27 @@
 # CHANGELOG
 
+## 0.64.0
+
+### Minor Changes
+
+- [#3466](https://github.com/primer/view_components/pull/3466) [`57f6c41`](https://github.com/opf/primer_view_components/commit/57f6c41025de70dfcd6880dab7e881d182e3cbd9) Thanks [@manuelpuyol](https://github.com/manuelpuyol)! - Create Primer::CurrentAttributes allowing apps to set request specific context to components. Update IncludeFragment to add data-nonce when a current nonce is present.
+
+### Patch Changes
+
+- [#3447](https://github.com/primer/view_components/pull/3447) [`c2b88cb`](https://github.com/opf/primer_view_components/commit/c2b88cb1d75e86fc0b410e3fc597e48326f471a5) Thanks [@bsatarnejad](https://github.com/bsatarnejad)! - Add a new custom label for close button in dialog header
+
+- [#3450](https://github.com/primer/view_components/pull/3450) [`5e86bf4`](https://github.com/opf/primer_view_components/commit/5e86bf422b13a3818def5ceab464f8e362f9021b) Thanks [@francinelucca](https://github.com/francinelucca)! - Fix(SelectPanel): incorrect padding when no filter
+
+## 0.63.0
+
+### Minor Changes
+
+- [#3428](https://github.com/primer/view_components/pull/3428) [`1ab1b06`](https://github.com/opf/primer_view_components/commit/1ab1b06509763ea60fc89770754edf06229b4f63) Thanks [@manuelpuyol](https://github.com/manuelpuyol)! - Create IncludeFragment component. Allow ConditionalWrapper to render components other than BaseComponent
+
+### Patch Changes
+
+- [#3429](https://github.com/primer/view_components/pull/3429) [`6ea9fd5`](https://github.com/opf/primer_view_components/commit/6ea9fd5dc90c1964ab3882faf1733c6b49c80e21) Thanks [@manuelpuyol](https://github.com/manuelpuyol)! - Create IncludeFragment linter to migrate <include-fragment> uses
+
 ## 0.62.0
 
 ### Minor Changes

data/app/components/primer/alpha/action_menu.html.erb

@@ -3,7 +3,7 @@
     <%= render(@overlay) do |overlay| %>
       <% overlay.with_body(padding: :none) do %>
         <% if @src.present? %>
-          <include-fragment src="<%= @src %>" loading="<%= preload? ? "eager" : "lazy" %>" data-target="action-menu.includeFragment">
+          <%= render(Primer::Alpha::IncludeFragment.new(src: @src, loading: preload? ? :eager : :lazy, "data-target": "action-menu.includeFragment")) do %>
             <%= render(Primer::Alpha::ActionMenu::List.new(id: "#{@menu_id}-list", menu_id: @menu_id)) do |list| %>
               <% list.with_item(
                 aria: { disabled: true },
@@ -18,7 +18,7 @@
                 <%= render Primer::Beta::Spinner.new(aria: { label: "Loading content..." }) %>
               <% end %>
             <% end %>
-          </include-fragment>
+          <% end %>
         <% else %>
           <%= render(@list) %>
         <% end %>

data/app/components/primer/alpha/dialog/header.html.erb

@@ -13,7 +13,7 @@
       <% end %>
     </div>
     <div class="Overlay-actionWrap">
-      <%= render Primer::Beta::CloseButton.new(classes: "Overlay-closeButton", "data-close-dialog-id": @id) %>
+      <%= render Primer::Beta::CloseButton.new(classes: "Overlay-closeButton", "data-close-dialog-id": @id, aria: { label: @close_label }) %>
     </div>
   </div>
   <%= filter %>

data/app/components/primer/alpha/dialog/header.rb

@@ -16,6 +16,8 @@ module Primer
         }.freeze
         VARIANT_OPTIONS = VARIANT_MAPPINGS.keys
 
+        DEFAULT_CLOSE_LABEL = "Close"
+
         # Optional filter slot for adding a filter input to the header.
         #
         # @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
@@ -48,6 +50,7 @@ module Primer
         # @param show_divider [Boolean] Show a divider between the header and body.
         # @param visually_hide_title [Boolean] Visually hide the `title` while maintaining a label for assistive technologies.
         # @param variant [Symbol] <%= one_of(Primer::Alpha::Dialog::Header::VARIANT_OPTIONS) %>
+        # @param close_label [String] The aria-label text of the close "x" button.
         # @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
         def initialize(
           id:,
@@ -56,12 +59,14 @@ module Primer
           show_divider: false,
           visually_hide_title: false,
           variant: DEFAULT_VARIANT,
+          close_label: DEFAULT_CLOSE_LABEL,
           **system_arguments
         )
           @id = id
           @title = title
           @subtitle = subtitle
           @visually_hide_title = visually_hide_title
+          @close_label = close_label
           @system_arguments = deny_tag_argument(**system_arguments)
           @system_arguments[:tag] = :div
 

data/app/components/primer/alpha/include_fragment.rb

@@ -0,0 +1,39 @@
+# frozen_string_literal: true
+
+module Primer
+  module Alpha
+    # Use `IncludeFragment` to load HTML elements from the server.
+    # Add additional usage considerations or best practices that may aid the user to use the component correctly.
+    # @accessibility Add any accessibility considerations
+    class IncludeFragment < Primer::Component
+      status :alpha
+
+      ALLOWED_LOADING_VALUES = [:lazy, :eager].freeze
+      DEFAULT_LOADING = :eager
+
+      # @param src [String] The URL  from which to retrieve an HTML element fragment.
+      # @param loading [Symbol] <%= one_of([:lazy, :eager]) %>
+      # @param accept [String] What to send as the Accept header.
+      # @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
+      def initialize(src: nil, loading: nil, accept: nil, **system_arguments)
+        @system_arguments = system_arguments
+        @system_arguments[:tag] = "include-fragment"
+        @system_arguments[:loading] = loading
+        @system_arguments[:src] = src
+        @system_arguments[:accept] = accept if accept
+
+        if loading
+          @system_arguments[:loading] = fetch_or_fallback(ALLOWED_LOADING_VALUES, loading.to_sym, DEFAULT_LOADING)
+        end
+
+        if Primer::CurrentAttributes.nonce
+          @system_arguments[:"data-nonce"] = Primer::CurrentAttributes.nonce
+        end
+      end
+
+      def call
+        render(Primer::BaseComponent.new(**@system_arguments)) { content }
+      end
+    end
+  end
+end

data/app/components/primer/alpha/select_panel.html.erb

@@ -50,7 +50,7 @@
           <% end %>
         <% end %>
       <% end %>
-      <%= render Primer::Alpha::Dialog::Body.new(mt: show_filter? ? 0 : 2, p: 0) do %>
+      <%= render Primer::Alpha::Dialog::Body.new(p: 0) do %>
         <focus-group direction="vertical" mnemonics retain>
           <live-region data-target="select-panel.liveRegion"></live-region>
           <%= render(Primer::BaseComponent.new(
@@ -62,7 +62,7 @@
           )) do %>
             <div id="<%= @body_id %>">
               <% if @src.present? %>
-                <%= render(Primer::ConditionalWrapper.new(condition: @fetch_strategy == :eventually_local, tag: "include-fragment", data: { target: "select-panel.includeFragment" }, src: @src, loading: preload? ? "eager" : "lazy", accept: "text/fragment+html")) do %>
+                <%= render(Primer::ConditionalWrapper.new(condition: @fetch_strategy == :eventually_local, component: Primer::Alpha::IncludeFragment, data: { target: "select-panel.includeFragment" }, src: @src, loading: preload? ? "eager" : "lazy", accept: "text/fragment+html")) do %>
                   <%= render(Primer::BaseComponent.new(
                     tag: :div,
                     id: "#{@panel_id}-list",

data/app/components/primer/conditional_wrapper.rb

@@ -1,14 +1,16 @@
 # frozen_string_literal: true
 
 module Primer
-  # Conditionally renders a `Primer::BaseComponent` around the given content. If the given condition
-  # is true, a `Primer::BaseComponent` will render around the content. If the condition is false, only
+  # Conditionally renders a component around the given content. If the given condition
+  # is true, the component will render around the content. If the condition is false, only
   # the content is rendered.
   class ConditionalWrapper < Primer::Component
-    # @param condition [Boolean] Whether or not to wrap the content in a `Primer::BaseComponent`.
-    # @param base_component_arguments [Hash] The arguments to pass to `Primer::BaseComponent`.
-    def initialize(condition:, **base_component_arguments)
+    # @param condition [Boolean] Whether or not to wrap the content in a component.
+    # @param component [Class] The component class to use as a wrapper, defaults to `Primer::BaseComponent`
+    # @param base_component_arguments [Hash] The arguments to pass to the component.
+    def initialize(condition:, component: Primer::BaseComponent, **base_component_arguments)
       @condition = condition
+      @component = component
       @base_component_arguments = base_component_arguments
       @trim = !!@base_component_arguments.delete(:trim)
     end
@@ -18,7 +20,7 @@ module Primer
         return @trim ? trimmed_content : content
       end
 
-      BaseComponent.new(trim: @trim, **@base_component_arguments).render_in(self) { content }
+      @component.new(trim: @trim, **@base_component_arguments).render_in(self) { content }
     end
   end
 end

data/app/lib/primer/current_attributes.rb

@@ -0,0 +1,9 @@
+# frozen_string_literal: true
+
+module Primer
+  # `Primer::CurrentAttributes` can be used by controllers to set request-bound data
+  # that can be propagated to components.
+  class CurrentAttributes < ActiveSupport::CurrentAttributes
+    attribute :nonce
+  end
+end

data/lib/primer/view_components/linters/argument_mappers/include_fragment.rb

@@ -0,0 +1,21 @@
+# frozen_string_literal: true
+
+require_relative "base"
+
+module ERBLint
+  module Linters
+    module ArgumentMappers
+      # Maps attributes in the include-fragment element to arguments for the IncludeFragment component.
+      class IncludeFragment < Base
+        DEFAULT_TAG = "include-fragment"
+        ATTRIBUTES = %w[loading src accept role preload tabindex autofocus hidden].freeze
+
+        def attribute_to_args(attribute)
+          attr_name = attribute.name
+
+          { attr_name.to_sym => erb_helper.convert(attribute) }
+        end
+      end
+    end
+  end
+end

data/lib/primer/view_components/linters/include_fragment_component_migration_counter.rb

@@ -0,0 +1,20 @@
+# frozen_string_literal: true
+
+require_relative "base_linter"
+require_relative "autocorrectable"
+require_relative "argument_mappers/include_fragment"
+
+module ERBLint
+  module Linters
+    # Counts the number of times a HTML include-fragment is used instead of the component.
+    class IncludeFragmentComponentMigrationCounter < BaseLinter
+      include Autocorrectable
+
+      TAGS = %w[include-fragment].freeze
+      REQUIRED_ARGUMENTS = [].freeze
+      MESSAGE = "We are migrating include-fragment to use [Primer::Alpha::IncludeFragment](https://primer.style/view-components/lookbook/inspect/primer/alpha/include_fragment/default), please try to use that instead of raw HTML."
+      ARGUMENT_MAPPER = ArgumentMappers::IncludeFragment
+      COMPONENT = "Primer::Alpha::IncludeFragment"
+    end
+  end
+end

data/lib/primer/view_components/version.rb

@@ -5,7 +5,7 @@ module Primer
   module ViewComponents
     module VERSION
       MAJOR = 0
-      MINOR = 62
+      MINOR = 64
       PATCH = 0
 
       STRING = [MAJOR, MINOR, PATCH].join(".")

data/previews/primer/alpha/dialog_preview/with_header_close_button_label.html.erb

@@ -0,0 +1,5 @@
+<%= render(Primer::Alpha::Dialog.new(id: "my-dialog", title: title, subtitle: subtitle, visually_hide_title: false)) do |dialog| %>
+  <% dialog.with_header(show_divider: show_divider, close_label: close_label) %>
+  <% dialog.with_show_button_content(button_text) %>
+  <% dialog.with_body_content("Hello World") %>
+<% end %>

data/previews/primer/alpha/dialog_preview/without_header_close_button_label.html.erb

@@ -0,0 +1,8 @@
+<%= render(Primer::Alpha::Dialog.new(id: "my-dialog", title: title, subtitle: subtitle, visually_hide_title: false)) do |dialog| %>
+  <% dialog.with_header(show_divider: show_divider, close_scheme: :none) %>
+  <% dialog.with_show_button_content(button_text) %>
+  <% dialog.with_body_content("Hello World") %>
+  <% dialog.with_footer do %>
+    <%= render(Primer::Beta::Button.new(data: { "close-dialog-id": "my-dialog" })) { "Close" } %>
+  <% end %>
+<% end %>

data/previews/primer/alpha/dialog_preview.rb

@@ -302,6 +302,38 @@ module Primer
       def with_header_filter
         render_with_template(locals: {})
       end
+
+      # @label With custom label for close button of header
+      #
+      # @param title [String] text
+      # @param subtitle [String] text
+      # @param button_text [String] text
+      # @param show_divider [Boolean] toggle
+      # @param close_label [String] text
+      def with_header_close_button_label(title: "Test Dialog", subtitle: nil, button_text: "Show Dialog", show_divider: true, close_label: "Close me!")
+        render_with_template(locals: {
+          title: title,
+          subtitle: subtitle,
+          button_text: button_text,
+          show_divider: show_divider,
+          close_label: close_label
+        })
+      end
+
+      # @label Without custom label for close button of header
+      #
+      # @param title [String] text
+      # @param subtitle [String] text
+      # @param button_text [String] text
+      # @param show_divider [Boolean] toggle
+      def without_header_close_button_label(title: "Test Dialog", subtitle: nil, button_text: "Show Dialog", show_divider: true)
+        render_with_template(locals: {
+          title: title,
+          subtitle: subtitle,
+          button_text: button_text,
+          show_divider: show_divider
+        })
+      end
     end
   end
 end

data/previews/primer/alpha/include_fragment_preview.rb

@@ -0,0 +1,22 @@
+# frozen_string_literal: true
+
+# Setup Playground to use all available component props
+# Setup Features to use individual component props and combinations
+
+module Primer
+  module Alpha
+    # @label IncludeFragment
+    class IncludeFragmentPreview < ViewComponent::Preview
+      # @label Playground
+      # @param loading select [eager, lazy]
+      def playground(loading: :eager)
+        render(Primer::Alpha::IncludeFragment.new(loading: loading, src: UrlHelpers.include_fragment_deferred_path)) { "Loading..." }
+      end
+
+      # @label Default options
+      def default
+        render(Primer::Alpha::IncludeFragment.new(loading: :eager, src: UrlHelpers.include_fragment_deferred_path)) { "Loading..." }
+      end
+    end
+  end
+end

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

@@ -10,7 +10,7 @@
   <%= header.with_breadcrumbs(breadcrumb_items) %>
   <% if with_actions %>
     <% header.with_action_icon_button(icon: 'pencil', mobile_icon: 'pencil', label: 'Edit') %>
-    <% header.with_action_menu(menu_arguments: { anchor_align: :end }, button_arguments: { icon: "op-kebab-vertical", "aria-label": "Menu" }) do |menu, button| %>
+    <% header.with_action_menu(menu_arguments: { anchor_align: :end }, button_arguments: { icon: "kebab-horizontal", "aria-label": "Menu" }) do |menu, button| %>
       <% menu.with_item(label: "Subitem 1") do |item| %>
         <% item.with_leading_visual_icon(icon: :unlock) %>
       <% end %>

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

@@ -3,7 +3,7 @@
 
   <% component.with_action_component do %>
     <%= render Primer::Alpha::ActionMenu.new(menu_id: "menu-1") do |menu|
-      menu.with_show_button(icon: :"op-kebab-vertical", "aria-label": "Menu")
+      menu.with_show_button(icon: :"kebab-horizontal", "aria-label": "Menu")
       menu.with_item(label: "Subitem 1") do |item|
         item.with_leading_visual_icon(icon: :paste)
       end

data/static/arguments.json

@@ -1070,6 +1070,12 @@
         "default": "`:medium`",
         "description": "One of `:large` or `:medium`."
       },
+      {
+        "name": "close_label",
+        "type": "String",
+        "default": "`Close`",
+        "description": "The aria-label text of the close \"x\" button."
+      },
       {
         "name": "system_arguments",
         "type": "Hash",
@@ -1357,6 +1363,40 @@
       }
     ]
   },
+  {
+    "component": "IncludeFragment",
+    "status": "alpha",
+    "a11y_reviewed": false,
+    "short_name": "IncludeFragment",
+    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/include_fragment.rb",
+    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/include_fragment/default/",
+    "parameters": [
+      {
+        "name": "src",
+        "type": "String",
+        "default": "`nil`",
+        "description": "The URL from which to retrieve an HTML element fragment."
+      },
+      {
+        "name": "loading",
+        "type": "Symbol",
+        "default": "`nil`",
+        "description": "One of `:eager` or `:lazy`."
+      },
+      {
+        "name": "accept",
+        "type": "String",
+        "default": "`nil`",
+        "description": "What to send as the Accept header."
+      },
+      {
+        "name": "system_arguments",
+        "type": "Hash",
+        "default": "N/A",
+        "description": "[System arguments](/system-arguments)"
+      }
+    ]
+  },
   {
     "component": "Layout",
     "status": "alpha",
@@ -4949,13 +4989,19 @@
         "name": "condition",
         "type": "Boolean",
         "default": "N/A",
-        "description": "Whether or not to wrap the content in a `Primer::BaseComponent`."
+        "description": "Whether or not to wrap the content in a component."
+      },
+      {
+        "name": "component",
+        "type": "Class",
+        "default": "`Primer::BaseComponent`",
+        "description": "The component class to use as a wrapper, defaults to `Primer::BaseComponent`"
       },
       {
         "name": "base_component_arguments",
         "type": "Hash",
         "default": "N/A",
-        "description": "The arguments to pass to `Primer::BaseComponent`."
+        "description": "The arguments to pass to the component."
       }
     ]
   },

data/static/audited_at.json

@@ -30,6 +30,7 @@
   "Primer::Alpha::HellipButton": "",
   "Primer::Alpha::HiddenTextExpander": "",
   "Primer::Alpha::Image": "",
+  "Primer::Alpha::IncludeFragment": "",
   "Primer::Alpha::Layout": "",
   "Primer::Alpha::Layout::Main": "",
   "Primer::Alpha::Layout::Sidebar": "",

data/static/constants.json

@@ -323,6 +323,7 @@
     "GeneratedSlotMethods": "Primer::Alpha::Dialog::Footer::GeneratedSlotMethods"
   },
   "Primer::Alpha::Dialog::Header": {
+    "DEFAULT_CLOSE_LABEL": "Close",
     "DEFAULT_VARIANT": "medium",
     "GeneratedSlotMethods": "Primer::Alpha::Dialog::Header::GeneratedSlotMethods",
     "VARIANT_MAPPINGS": {
@@ -391,6 +392,14 @@
   "Primer::Alpha::Image": {
     "GeneratedSlotMethods": "Primer::Alpha::Image::GeneratedSlotMethods"
   },
+  "Primer::Alpha::IncludeFragment": {
+    "ALLOWED_LOADING_VALUES": [
+      "lazy",
+      "eager"
+    ],
+    "DEFAULT_LOADING": "eager",
+    "GeneratedSlotMethods": "Primer::Alpha::IncludeFragment::GeneratedSlotMethods"
+  },
   "Primer::Alpha::Layout": {
     "FIRST_IN_SOURCE_DEFAULT": "sidebar",
     "FIRST_IN_SOURCE_OPTIONS": [

data/static/info_arch.json

@@ -3646,6 +3646,32 @@
             "color-contrast"
           ]
         }
+      },
+      {
+        "preview_path": "primer/alpha/dialog/with_header_close_button_label",
+        "name": "with_header_close_button_label",
+        "snapshot": "false",
+        "skip_rules": {
+          "wont_fix": [
+            "region"
+          ],
+          "will_fix": [
+            "color-contrast"
+          ]
+        }
+      },
+      {
+        "preview_path": "primer/alpha/dialog/without_header_close_button_label",
+        "name": "without_header_close_button_label",
+        "snapshot": "false",
+        "skip_rules": {
+          "wont_fix": [
+            "region"
+          ],
+          "will_fix": [
+            "color-contrast"
+          ]
+        }
       }
     ],
     "subcomponents": [
@@ -3699,6 +3725,12 @@
             "default": "`:medium`",
             "description": "One of `:large` or `:medium`."
           },
+          {
+            "name": "close_label",
+            "type": "String",
+            "default": "`Close`",
+            "description": "The aria-label text of the close \"x\" button."
+          },
           {
             "name": "system_arguments",
             "type": "Hash",
@@ -4679,6 +4711,83 @@
 
     ]
   },
+  {
+    "fully_qualified_name": "Primer::Alpha::IncludeFragment",
+    "description": "Use `IncludeFragment` to load HTML elements from the server.\nAdd additional usage considerations or best practices that may aid the user to use the component correctly.",
+    "accessibility_docs": "Add any accessibility considerations",
+    "is_form_component": false,
+    "is_published": true,
+    "requires_js": false,
+    "component": "IncludeFragment",
+    "status": "alpha",
+    "a11y_reviewed": false,
+    "short_name": "IncludeFragment",
+    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/include_fragment.rb",
+    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/include_fragment/default/",
+    "parameters": [
+      {
+        "name": "src",
+        "type": "String",
+        "default": "`nil`",
+        "description": "The URL from which to retrieve an HTML element fragment."
+      },
+      {
+        "name": "loading",
+        "type": "Symbol",
+        "default": "`nil`",
+        "description": "One of `:eager` or `:lazy`."
+      },
+      {
+        "name": "accept",
+        "type": "String",
+        "default": "`nil`",
+        "description": "What to send as the Accept header."
+      },
+      {
+        "name": "system_arguments",
+        "type": "Hash",
+        "default": "N/A",
+        "description": "{{link_to_system_arguments_docs}}"
+      }
+    ],
+    "slots": [
+
+    ],
+    "methods": [
+
+    ],
+    "previews": [
+      {
+        "preview_path": "primer/alpha/include_fragment/playground",
+        "name": "playground",
+        "snapshot": "false",
+        "skip_rules": {
+          "wont_fix": [
+            "region"
+          ],
+          "will_fix": [
+            "color-contrast"
+          ]
+        }
+      },
+      {
+        "preview_path": "primer/alpha/include_fragment/default",
+        "name": "default",
+        "snapshot": "false",
+        "skip_rules": {
+          "wont_fix": [
+            "region"
+          ],
+          "will_fix": [
+            "color-contrast"
+          ]
+        }
+      }
+    ],
+    "subcomponents": [
+
+    ]
+  },
   {
     "fully_qualified_name": "Primer::Alpha::Layout",
     "description": "`Layout` provides foundational patterns for responsive pages.\n`Layout` can be used for simple two-column pages, or it can be nested to provide flexible 3-column experiences.\n On smaller screens, `Layout` uses vertically stacked rows to display content.\n\n`Layout` flows as both column, when there's enough horizontal space to render both `Main` and `Sidebar`side-by-side (on a desktop of tablet device, per instance);\nor it flows as a row, when `Main` and `Sidebar` are stacked vertically (e.g. on a mobile device).\n`Layout` should always work in any screen size.",
@@ -17220,7 +17329,7 @@
   },
   {
     "fully_qualified_name": "Primer::ConditionalWrapper",
-    "description": "Conditionally renders a `Primer::BaseComponent` around the given content. If the given condition\nis true, a `Primer::BaseComponent` will render around the content. If the condition is false, only\nthe content is rendered.",
+    "description": "Conditionally renders a component around the given content. If the given condition\nis true, the component will render around the content. If the condition is false, only\nthe content is rendered.",
     "accessibility_docs": null,
     "is_form_component": false,
     "is_published": true,
@@ -17236,13 +17345,19 @@
         "name": "condition",
         "type": "Boolean",
         "default": "N/A",
-        "description": "Whether or not to wrap the content in a `Primer::BaseComponent`."
+        "description": "Whether or not to wrap the content in a component."
+      },
+      {
+        "name": "component",
+        "type": "Class",
+        "default": "`Primer::BaseComponent`",
+        "description": "The component class to use as a wrapper, defaults to `Primer::BaseComponent`"
       },
       {
         "name": "base_component_arguments",
         "type": "Hash",
         "default": "N/A",
-        "description": "The arguments to pass to `Primer::BaseComponent`."
+        "description": "The arguments to pass to the component."
       }
     ],
     "slots": [

data/static/previews.json

@@ -3717,6 +3717,32 @@
             "color-contrast"
           ]
         }
+      },
+      {
+        "preview_path": "primer/alpha/dialog/with_header_close_button_label",
+        "name": "with_header_close_button_label",
+        "snapshot": "false",
+        "skip_rules": {
+          "wont_fix": [
+            "region"
+          ],
+          "will_fix": [
+            "color-contrast"
+          ]
+        }
+      },
+      {
+        "preview_path": "primer/alpha/dialog/without_header_close_button_label",
+        "name": "without_header_close_button_label",
+        "snapshot": "false",
+        "skip_rules": {
+          "wont_fix": [
+            "region"
+          ],
+          "will_fix": [
+            "color-contrast"
+          ]
+        }
       }
     ]
   },
@@ -4682,6 +4708,40 @@
       }
     ]
   },
+  {
+    "name": "include_fragment",
+    "component": "IncludeFragment",
+    "status": "alpha",
+    "lookup_path": "primer/alpha/include_fragment",
+    "examples": [
+      {
+        "preview_path": "primer/alpha/include_fragment/playground",
+        "name": "playground",
+        "snapshot": "false",
+        "skip_rules": {
+          "wont_fix": [
+            "region"
+          ],
+          "will_fix": [
+            "color-contrast"
+          ]
+        }
+      },
+      {
+        "preview_path": "primer/alpha/include_fragment/default",
+        "name": "default",
+        "snapshot": "false",
+        "skip_rules": {
+          "wont_fix": [
+            "region"
+          ],
+          "will_fix": [
+            "color-contrast"
+          ]
+        }
+      }
+    ]
+  },
   {
     "name": "input_group",
     "component": "OpenProject::InputGroup",

data/static/statuses.json

@@ -30,6 +30,7 @@
   "Primer::Alpha::HellipButton": "alpha",
   "Primer::Alpha::HiddenTextExpander": "alpha",
   "Primer::Alpha::Image": "alpha",
+  "Primer::Alpha::IncludeFragment": "alpha",
   "Primer::Alpha::Layout": "alpha",
   "Primer::Alpha::Layout::Main": "alpha",
   "Primer::Alpha::Layout::Sidebar": "alpha",

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: openproject-primer_view_components
 version: !ruby/object:Gem::Version
-  version: 0.62.0
+  version: 0.64.0
 platform: ruby
 authors:
 - GitHub Open Source
@@ -9,7 +9,7 @@ authors:
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2025-04-17 00:00:00.000000000 Z
+date: 2025-04-29 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: actionview
@@ -45,14 +45,14 @@ dependencies:
     requirements:
     - - ">="
       - !ruby/object:Gem::Version
-        version: 19.23.0
+        version: 19.25.0
   type: :runtime
   prerelease: false
   version_requirements: !ruby/object:Gem::Requirement
     requirements:
     - - ">="
       - !ruby/object:Gem::Version
-        version: 19.23.0
+        version: 19.25.0
 - !ruby/object:Gem::Dependency
   name: view_component
   requirement: !ruby/object:Gem::Requirement
@@ -209,6 +209,7 @@ files:
 - app/components/primer/alpha/hellip_button.rb
 - app/components/primer/alpha/hidden_text_expander.rb
 - app/components/primer/alpha/image.rb
+- app/components/primer/alpha/include_fragment.rb
 - app/components/primer/alpha/layout.css
 - app/components/primer/alpha/layout.css.json
 - app/components/primer/alpha/layout.css.map
@@ -652,6 +653,7 @@ files:
 - app/lib/primer/css/layout.css.json
 - app/lib/primer/css/utilities.css
 - app/lib/primer/css/utilities.css.json
+- app/lib/primer/current_attributes.rb
 - app/lib/primer/experimental_render_helpers.rb
 - app/lib/primer/experimental_slot_helpers.rb
 - app/lib/primer/fetch_or_fallback_helper.rb
@@ -789,6 +791,7 @@ files:
 - lib/primer/view_components/linters/argument_mappers/conversion_error.rb
 - lib/primer/view_components/linters/argument_mappers/flash.rb
 - lib/primer/view_components/linters/argument_mappers/helpers/erb_block.rb
+- lib/primer/view_components/linters/argument_mappers/include_fragment.rb
 - lib/primer/view_components/linters/argument_mappers/label.rb
 - lib/primer/view_components/linters/argument_mappers/system_arguments.rb
 - lib/primer/view_components/linters/autocorrectable.rb
@@ -807,6 +810,7 @@ files:
 - lib/primer/view_components/linters/helpers/deprecated_components_helpers.rb
 - lib/primer/view_components/linters/helpers/rubocop_helpers.rb
 - lib/primer/view_components/linters/helpers/rule_helpers.rb
+- lib/primer/view_components/linters/include_fragment_component_migration_counter.rb
 - lib/primer/view_components/linters/label_component_migration_counter.rb
 - lib/primer/view_components/linters/migrate_deprecated_flash_arguments.rb
 - lib/primer/view_components/linters/migrations/iconbutton_component.rb
@@ -887,13 +891,16 @@ files:
 - previews/primer/alpha/dialog_preview/with_footer.html.erb
 - previews/primer/alpha/dialog_preview/with_form.html.erb
 - previews/primer/alpha/dialog_preview/with_header.html.erb
+- previews/primer/alpha/dialog_preview/with_header_close_button_label.html.erb
 - previews/primer/alpha/dialog_preview/with_header_filter.html.erb
 - previews/primer/alpha/dialog_preview/with_text_input.html.erb
+- previews/primer/alpha/dialog_preview/without_header_close_button_label.html.erb
 - previews/primer/alpha/dropdown_preview.rb
 - previews/primer/alpha/form_control_preview.rb
 - previews/primer/alpha/form_control_preview/playground.html.erb
 - previews/primer/alpha/hellip_button_preview.rb
 - previews/primer/alpha/hidden_text_expander_preview.rb
+- previews/primer/alpha/include_fragment_preview.rb
 - previews/primer/alpha/layout_preview.rb
 - previews/primer/alpha/menu_preview.rb
 - previews/primer/alpha/menu_preview/default.html.erb