openproject-primer_view_components 0.71.0 → 0.72.0

data/app/components/primer/{open_project → alpha}/file_tree_view/directory_node.rb

@@ -1,7 +1,7 @@
 # frozen_string_literal: true
 
 module Primer
-  module OpenProject
+  module Alpha
     class FileTreeView
       class DirectoryNode < TreeView::SubTreeNode
         def initialize(icon_arguments: nil, expanded_icon_arguments: nil, collapsed_icon_arguments: nil, **system_arguments)

data/app/components/primer/{open_project → alpha}/file_tree_view/file_node.rb

@@ -1,7 +1,7 @@
 # frozen_string_literal: true
 
 module Primer
-  module OpenProject
+  module Alpha
     class FileTreeView
       class FileNode < TreeView::LeafNode
         def initialize(icon_arguments: {}, **system_arguments)

data/app/components/primer/{open_project → alpha}/file_tree_view.rb

@@ -1,7 +1,7 @@
 # frozen_string_literal: true
 
 module Primer
-  module OpenProject
+  module Alpha
     class FileTreeView < TreeView
       def with_file(**system_arguments, &block)
         with_leaf(**system_arguments, component_klass: FileNode, &block)

data/app/components/primer/{open_project → alpha}/skeleton_box.css.json

@@ -1,5 +1,5 @@
 {
-  "name": "open_project/skeleton_box",
+  "name": "alpha/skeleton_box",
   "selectors": [
     ".SkeletonBox"
   ]

data/app/components/primer/{open_project → alpha}/skeleton_box.css.map

@@ -1 +1 @@
-{"version":3,"sources":["skeleton_box.pcss"],"names":[],"mappings":"AAAA,mBACE,GACE,kBACF,CAEA,GACE,eACF,CACF,CAEA,aAKE,iBAAkB,CAFlB,qCAAsC,CACtC,uCAAwC,CAHxC,aAAc,CACd,WAiBF,CAZE,8CAPF,aAUI,iBAAkB,CAClB,qBAAsB,CACtB,kCAAmC,CAJnC,wDAAqE,CACrE,cAUJ,CANE,CAEA,8BAfF,aAgBI,uBAA8B,CAC9B,mBAEJ,CADE","file":"skeleton_box.css","sourcesContent":["@keyframes shimmer {\n  from {\n    mask-position: 200%;\n  }\n\n  to {\n    mask-position: 0%;\n  }\n}\n\n.SkeletonBox {\n  display: block;\n  height: 1rem;\n  background-color: var(--bgColor-muted);\n  border-radius: var(--borderRadius-small);\n  animation: shimmer;\n\n  @media (prefers-reduced-motion: no-preference) {\n    mask-image: linear-gradient(75deg, #000 30%, rgba(0, 0, 0, 0.65) 80%);\n    mask-size: 200%;\n    animation: shimmer;\n    animation-duration: 1s;\n    animation-iteration-count: infinite;\n  }\n\n  @media (forced-colors: active) {\n    outline: 1px solid transparent;\n    outline-offset: -1px;\n  }\n}\n"]}
+{"version":3,"sources":["skeleton_box.pcss"],"names":[],"mappings":"AAAA,mBACE,GACE,kBACF,CAEA,GACE,eACF,CACF,CAEA,aAKE,iBAAkB,CAFlB,qCAAsC,CACtC,uCAAwC,CAHxC,aAAc,CACd,WAiBF,CAZE,8CAPF,aAUI,iBAAkB,CAClB,qBAAsB,CACtB,kCAAmC,CAJnC,wDAAoE,CACpE,cAUJ,CANE,CAEA,8BAfF,aAgBI,uBAA8B,CAC9B,mBAEJ,CADE","file":"skeleton_box.css","sourcesContent":["@keyframes shimmer {\n  from {\n    mask-position: 200%;\n  }\n\n  to {\n    mask-position: 0%;\n  }\n}\n\n.SkeletonBox {\n  display: block;\n  height: 1rem;\n  background-color: var(--bgColor-muted);\n  border-radius: var(--borderRadius-small);\n  animation: shimmer;\n\n  @media (prefers-reduced-motion: no-preference) {\n    mask-image: linear-gradient(75deg, #000 30%, rgb(0, 0, 0, 0.65) 80%);\n    mask-size: 200%;\n    animation: shimmer;\n    animation-duration: 1s;\n    animation-iteration-count: infinite;\n  }\n\n  @media (forced-colors: active) {\n    outline: 1px solid transparent;\n    outline-offset: -1px;\n  }\n}\n"]}

data/app/components/primer/{open_project → alpha}/skeleton_box.pcss

@@ -16,7 +16,7 @@
   animation: shimmer;
 
   @media (prefers-reduced-motion: no-preference) {
-    mask-image: linear-gradient(75deg, #000 30%, rgba(0, 0, 0, 0.65) 80%);
+    mask-image: linear-gradient(75deg, #000 30%, rgb(0, 0, 0, 0.65) 80%);
     mask-size: 200%;
     animation: shimmer;
     animation-duration: 1s;

data/app/components/primer/{open_project → alpha}/skeleton_box.rb

@@ -1,10 +1,12 @@
 # frozen_string_literal: true
 
 module Primer
-  module OpenProject
+  module Alpha
     # A SkeletonBox provides a placeholder for non-text, non-Avatar elements (e.g., hero images)
     # that are still loading. You can adjust width and height to match the content's dimensions.
     class SkeletonBox < Primer::Component
+      status :alpha
+
       # @param height [String] Any valid CSS height.
       # @param width [String] Any valid CSS width.
       # @param system_arguments [Hash] <%= link_to_system_arguments_docs %>

data/app/components/primer/{open_project → alpha}/tree_view/icon.rb

@@ -1,11 +1,11 @@
 # frozen_string_literal: true
 
 module Primer
-  module OpenProject
+  module Alpha
     class TreeView
       # An icon for a `TreeView` node.
       #
-      # This component is part of the <%= link_to_component(Primer::OpenProject::TreeView) %> component and should
+      # This component is part of the <%= link_to_component(Primer::Alpha::TreeView) %> component and should
       # not be used directly.
       class Icon < Primer::Component
         # @param system_arguments [Hash] The arguments accepted by <%= link_to_component(Primer::Beta::Octicon) %>.

data/app/components/primer/{open_project → alpha}/tree_view/icon_pair.rb

@@ -1,24 +1,24 @@
 # frozen_string_literal: true
 
 module Primer
-  module OpenProject
+  module Alpha
     class TreeView
       # A pair of icons for a `TreeView` sub-tree that displays distinct icons when the sub-tree is
       # expanded and collapsed.
       #
-      # This component is part of the <%= link_to_component(Primer::OpenProject::TreeView) %> component and should
+      # This component is part of the <%= link_to_component(Primer::Alpha::TreeView) %> component and should
       # not be used directly.
       class IconPair < Primer::Component
         # The expanded icon.
         #
-        # @param system_arguments [Hash] The arguments accepted by <%= link_to_component(Primer::OpenProject::TreeView::Icon) %>.
+        # @param system_arguments [Hash] The arguments accepted by <%= link_to_component(Primer::Alpha::TreeView::Icon) %>.
         renders_one :expanded_icon, lambda { |**system_arguments|
           Icon.new(**system_arguments)
         }
 
         # The collapsed icon.
         #
-        # @param system_arguments [Hash] The arguments accepted by <%= link_to_component(Primer::OpenProject::TreeView::Icon) %>.
+        # @param system_arguments [Hash] The arguments accepted by <%= link_to_component(Primer::Alpha::TreeView::Icon) %>.
         renders_one :collapsed_icon, lambda { |**system_arguments|
           Icon.new(**system_arguments)
         }

data/app/components/primer/{open_project → alpha}/tree_view/leading_action.rb

@@ -1,11 +1,11 @@
 # frozen_string_literal: true
 
 module Primer
-  module OpenProject
+  module Alpha
     class TreeView
       # The leading action for `TreeView` nodes.
       #
-      # This component is part of the <%= link_to_component(Primer::OpenProject::TreeView) %> component and should
+      # This component is part of the <%= link_to_component(Primer::Alpha::TreeView) %> component and should
       # not be used directly.
       class LeadingAction < Primer::Component
         # @param action [ViewComponent::Base] A component or other renderable to use as the action button etc.

data/app/components/primer/{open_project → alpha}/tree_view/leaf_node.rb

@@ -1,18 +1,18 @@
 # frozen_string_literal: true
 
 module Primer
-  module OpenProject
+  module Alpha
     class TreeView
       # A `TreeView` leaf node.
       #
-      # This component is part of the <%= link_to_component(Primer::OpenProject::TreeView) %> component and should
+      # This component is part of the <%= link_to_component(Primer::Alpha::TreeView) %> component and should
       # not be used directly.
       class LeafNode < Primer::Component
         # @!parse
         #   # Adds a leading visual icon rendered to the left of the node's label.
         #   #
         #   # @param label [String] A label describing the visual, displayed only to screen readers.
-        #   # @param system_arguments [Hash] The arguments accepted by <%= link_to_component(Primer::OpenProject::TreeView::Icon) %>.
+        #   # @param system_arguments [Hash] The arguments accepted by <%= link_to_component(Primer::Alpha::TreeView::Icon) %>.
         #   def with_leading_visual_icon(label: nil, **system_arguments, &block)
         #   end
 
@@ -52,7 +52,7 @@ module Primer
         #   # Adds a trailing visual icon rendered to the right of the node's label.
         #   #
         #   # @param label [String] A label describing the visual, displayed only to screen readers.
-        #   # @param system_arguments [Hash] The arguments accepted by <%= link_to_component(Primer::OpenProject::TreeView::Icon) %>.
+        #   # @param system_arguments [Hash] The arguments accepted by <%= link_to_component(Primer::Alpha::TreeView::Icon) %>.
         #   def with_trailing_visual_icon(label: nil, **system_arguments, &block)
         #   end
 
@@ -69,7 +69,7 @@ module Primer
         delegate :current?, :merge_system_arguments!, to: :@node
 
         # @param label [String] The node's label, i.e. it's textual content.
-        # @param system_arguments [Hash] The arguments accepted by <%= link_to_component(Primer::OpenProject::TreeView::Node) %>.
+        # @param system_arguments [Hash] The arguments accepted by <%= link_to_component(Primer::Alpha::TreeView::Node) %>.
         def initialize(label:, **system_arguments)
           @label = label
           @system_arguments = system_arguments
@@ -78,7 +78,7 @@ module Primer
             data: { "node-type": "leaf" }
           )
 
-          @node = Primer::OpenProject::TreeView::Node.new(**@system_arguments)
+          @node = Primer::Alpha::TreeView::Node.new(**@system_arguments)
         end
 
         private

data/app/components/primer/{open_project → alpha}/tree_view/loading_failure_message.rb

@@ -1,11 +1,11 @@
 # frozen_string_literal: true
 
 module Primer
-  module OpenProject
+  module Alpha
     class TreeView
       # A `TreeView` loading failure message.
       #
-      # This component is part of the <%= link_to_component(Primer::OpenProject::TreeView) %> component and should
+      # This component is part of the <%= link_to_component(Primer::Alpha::TreeView) %> component and should
       # not be used directly.
       class LoadingFailureMessage < Primer::Component
         DEFAULT_TEXT = "Something went wrong"

data/app/components/primer/{open_project → alpha}/tree_view/node.rb

@@ -1,14 +1,14 @@
 # frozen_string_literal: true
 
 module Primer
-  module OpenProject
+  module Alpha
     class TreeView
       # A generic `TreeView` node.
       #
-      # This component is part of the <%= link_to_component(Primer::OpenProject::TreeView) %> component and should
+      # This component is part of the <%= link_to_component(Primer::Alpha::TreeView) %> component and should
       # not be used directly.
       class Node < Primer::Component
-        DEFAULT_NODE_VARIANT = Primer::OpenProject::TreeView::DEFAULT_NODE_VARIANT
+        DEFAULT_NODE_VARIANT = Primer::Alpha::TreeView::DEFAULT_NODE_VARIANT
         NODE_VARIANT_TAG_MAP = { DEFAULT_NODE_VARIANT => :div, :button => :button, :anchor => :a }.freeze
         NODE_VARIANT_TAG_OPTIONS = NODE_VARIANT_TAG_MAP.keys.freeze
 
@@ -68,11 +68,11 @@ module Primer
         ]
 
         # @param path [Array<String>] The node's "path," i.e. this node's label and the labels of all its ancestors. This node should be reachable by traversing the tree following this path.
-        # @param node_variant [Symbol] The node variant to use for the node's content, i.e. the `:button` or `:div`. <%= one_of(Primer::OpenProject::TreeView::NODE_VARIANT_OPTIONS) %>
+        # @param node_variant [Symbol] The node variant to use for the node's content, i.e. the `:button` or `:div`. <%= one_of(Primer::Alpha::TreeView::NODE_VARIANT_OPTIONS) %>
         # @param href [String] The URL to use as the `href` attribute for this node. If set to a truthy value, the `tag:` parameter is ignored and assumed to be `:a`.
         # @param current [Boolean] Whether or not this node is the current node. The current node is styled differently than regular nodes and is the first element that receives focus when tabbing to the `TreeView` component.
-        # @param select_variant [Symbol] Controls the type of checkbox that appears. <%= one_of(Primer::OpenProject::TreeView::Node::SELECT_VARIANT_OPTIONS) %>
-        # @param checked [Boolean | String] The checked state of the node's checkbox. <%= one_of(Primer::OpenProject::TreeView::Node::CHECKED_STATES) %>
+        # @param select_variant [Symbol] Controls the type of checkbox that appears. <%= one_of(Primer::Alpha::TreeView::Node::SELECT_VARIANT_OPTIONS) %>
+        # @param checked [Boolean | String] The checked state of the node's checkbox. <%= one_of(Primer::Alpha::TreeView::Node::CHECKED_STATES) %>
         # @param disabled [Boolean] Whether or not the node can be activated. Passing `false` here will cause the node to appear visually disabled but it is still keyboard-focusable.
         # @param value [String] If this node is checked, this value will be sent to the server on form submission.
         # @param content_arguments [Hash] Arguments attached to the node's content, i.e the `<button>` or `<a>` element. <%= link_to_system_arguments_docs %>
@@ -114,23 +114,23 @@ module Primer
 
           @content_arguments[:aria] = merge_aria(
             @content_arguments, {
-              aria: {
-                level: level,
-                selected: false,
-                checked: checked,
-                labelledby: content_id,
-                disabled: disabled?
-              }
+            aria: {
+              level: level,
+              selected: false,
+              checked: checked,
+              labelledby: content_id,
+              disabled: disabled?
             }
+          }
           )
 
           @content_arguments[:data] = merge_data(
             @content_arguments, {
-              data: {
-                value: value,
-                path: @path.to_json
-              }
+            data: {
+              value: value,
+              path: @path.to_json
             }
+          }
           )
 
           return unless current?

data/app/components/primer/{open_project → alpha}/tree_view/skeleton_loader.html.erb

@@ -4,13 +4,13 @@
 
 <%= render(Primer::BaseComponent.new(tag: :"tree-view-include-fragment", src: @src, loading: :lazy, data: { target: "tree-view-sub-tree-node.subTree tree-view-sub-tree-node.includeFragment", path: @container.path.to_json }, hidden: @container.expanded?, accept: "text/fragment+html")) do %>
   <%= render(@container) do %>
-    <%= render(Primer::OpenProject::TreeView::Node.new(path: [*@container.path, :loader], node_variant: :div)) do |node| %>
+    <%= render(Primer::Alpha::TreeView::Node.new(path: [*@container.path, :loader], node_variant: :div)) do |node| %>
       <% node.with_text_content do %>
         <div data-target="tree-view-sub-tree-node.loadingIndicator">
           <% @count.times do %>
             <span class="TreeViewSkeletonItemContainerStyle TreeViewItemSkeleton">
-              <%= render(Primer::OpenProject::SkeletonBox.new(width: "16px")) %>
-              <%= render(Primer::OpenProject::SkeletonBox.new(width: "100%", classes: "TreeItemSkeletonTextStyles")) %>
+              <%= render(Primer::Alpha::SkeletonBox.new(width: "16px")) %>
+              <%= render(Primer::Alpha::SkeletonBox.new(width: "100%", classes: "TreeItemSkeletonTextStyles")) %>
             </span>
           <% end %>
         </div>

data/app/components/primer/{open_project → alpha}/tree_view/skeleton_loader.rb

@@ -1,16 +1,16 @@
 # frozen_string_literal: true
 
 module Primer
-  module OpenProject
+  module Alpha
     class TreeView
       # Renders a loading skeleton for a `TreeView` sub-tree node.
       #
-      # This component is part of the <%= link_to_component(Primer::OpenProject::TreeView) %> component and should
+      # This component is part of the <%= link_to_component(Primer::Alpha::TreeView) %> component and should
       # not be used directly.
       class SkeletonLoader < Primer::Component
         # The failure message that appears if loading nodes from the server fails.
         #
-        # @param system_arguments [Hash] The arguments accepted by <%= link_to_component(Primer::OpenProject::TreeView::LoadingFailureMessage) %>.
+        # @param system_arguments [Hash] The arguments accepted by <%= link_to_component(Primer::Alpha::TreeView::LoadingFailureMessage) %>.
         renders_one :loading_failure_message, lambda { |**system_arguments|
           system_arguments[:retry_button_arguments] ||= {}
           system_arguments[:retry_button_arguments][:data] = merge_data(
@@ -23,7 +23,7 @@ module Primer
 
         # @param src [String] The URL to fetch nodes from.
         # @param count [Integer] The number of skeleton nodes to render.
-        # @param system_arguments [Hash] The arguments accepted by <%= link_to_component(Primer::OpenProject::TreeView::SubTreeContainer) %>.
+        # @param system_arguments [Hash] The arguments accepted by <%= link_to_component(Primer::Alpha::TreeView::SubTreeContainer) %>.
         def initialize(src:, count: 3, **system_arguments)
           @src = src
           @count = count

data/app/components/primer/{open_project → alpha}/tree_view/spinner_loader.html.erb

@@ -4,14 +4,14 @@
 
 <%= render(Primer::BaseComponent.new(tag: :"tree-view-include-fragment", src: @src, loading: :lazy, data: { target: "tree-view-sub-tree-node.subTree tree-view-sub-tree-node.includeFragment", path: @container.path.to_json }, hidden: @container.expanded?, accept: "text/fragment+html")) do %>
   <%= render(@container) do %>
-    <%= render(Primer::OpenProject::TreeView::Node.new(path: [*@container.path, :loader], data: { target: "tree-view-sub-tree-node.loadingIndicator" }, node_variant: :div)) do |node| %>
+    <%= render(Primer::Alpha::TreeView::Node.new(path: [*@container.path, :loader], data: { target: "tree-view-sub-tree-node.loadingIndicator" }, node_variant: :div)) do |node| %>
       <% node.with_text_content { "Loading..." } %>
       <% node.with_leading_visual do %>
         <%= render(Primer::Beta::Spinner.new(size: :small, wrapper_arguments: { classes: "TreeViewItemVisual" })) %>
       <% end %>
     <% end %>
 
-    <%= render(Primer::OpenProject::TreeView::Node.new(path: [*@container.path, :failure_msg], data: { target: "tree-view-sub-tree-node.loadingFailureMessage" }, hidden: true, node_variant: :div)) do |node| %>
+    <%= render(Primer::Alpha::TreeView::Node.new(path: [*@container.path, :failure_msg], data: { target: "tree-view-sub-tree-node.loadingFailureMessage" }, hidden: true, node_variant: :div)) do |node| %>
       <% node.with_text_content do %>
         <%= loading_failure_message %>
       <% end %>

data/app/components/primer/{open_project → alpha}/tree_view/spinner_loader.rb

@@ -1,16 +1,16 @@
 # frozen_string_literal: true
 
 module Primer
-  module OpenProject
+  module Alpha
     class TreeView
       # Renders a loading spinner for a `TreeView` sub-tree node.
       #
-      # This component is part of the <%= link_to_component(Primer::OpenProject::TreeView) %> component and should
+      # This component is part of the <%= link_to_component(Primer::Alpha::TreeView) %> component and should
       # not be used directly.
       class SpinnerLoader < Primer::Component
         # The failure message that appears if loading nodes from the server fails.
         #
-        # @param system_arguments [Hash] The arguments accepted by <%= link_to_component(Primer::OpenProject::TreeView::LoadingFailureMessage) %>.
+        # @param system_arguments [Hash] The arguments accepted by <%= link_to_component(Primer::Alpha::TreeView::LoadingFailureMessage) %>.
         renders_one :loading_failure_message, lambda { |**system_arguments|
           system_arguments[:retry_button_arguments] ||= {}
           system_arguments[:retry_button_arguments][:data] = merge_data(
@@ -22,7 +22,7 @@ module Primer
         }
 
         # @param src [String] The URL to fetch nodes from.
-        # @param system_arguments [Hash] The arguments accepted by <%= link_to_component(Primer::OpenProject::TreeView::SubTreeContainer) %>.
+        # @param system_arguments [Hash] The arguments accepted by <%= link_to_component(Primer::Alpha::TreeView::SubTreeContainer) %>.
         def initialize(src:, **system_arguments)
           @src = src
           @container = SubTreeContainer.new(**system_arguments, expanded: true)

data/app/components/primer/{open_project → alpha}/tree_view/sub_tree.html.erb

@@ -7,7 +7,7 @@
 
   <%= render(@container) do %>
     <% if nodes.empty? %>
-      <%= render(Primer::OpenProject::TreeView::Node.new(path: path, data: { "no-items": true }, node_variant: :div)) do |node| %>
+      <%= render(Primer::Alpha::TreeView::Node.new(path: path, data: { "no-items": true }, node_variant: :div)) do |node| %>
         <% node.with_text_content do %>
           <%= no_items_message %>
         <% end %>

data/app/components/primer/{open_project → alpha}/tree_view/sub_tree.rb

@@ -1,26 +1,26 @@
 # frozen_string_literal: true
 
 module Primer
-  module OpenProject
+  module Alpha
     class TreeView
       # A `TreeView` sub-tree.
       #
-      # This component is part of the <%= link_to_component(Primer::OpenProject::TreeView) %> component and should
+      # This component is part of the <%= link_to_component(Primer::Alpha::TreeView) %> component and should
       # not be used directly.
       class SubTree < Primer::Component
         # @!parse
         #   # Adds an leaf node to the tree. Leaf nodes are nodes that do not have children.
         #   #
-        #   # @param component_klass [Class] The class to use instead of the default <%= link_to_component(Primer::OpenProject::TreeView::LeafNode) %>
-        #   # @param system_arguments [Hash] These arguments are forwarded to <%= link_to_component(Primer::OpenProject::TreeView::LeafNode) %>, or whatever class is passed as the `component_klass` argument.
+        #   # @param component_klass [Class] The class to use instead of the default <%= link_to_component(Primer::Alpha::TreeView::LeafNode) %>
+        #   # @param system_arguments [Hash] These arguments are forwarded to <%= link_to_component(Primer::Alpha::TreeView::LeafNode) %>, or whatever class is passed as the `component_klass` argument.
         #   def with_leaf(**system_arguments, &block)
         #   end
 
         # @!parse
         #   # Adds a sub-tree node to the tree. Sub-trees are nodes that have children, which can be both leaf nodes and other sub-trees.
         #   #
-        #   # @param component_klass [Class] The class to use instead of the default <%= link_to_component(Primer::OpenProject::TreeView::SubTreeNode) %>
-        #   # @param system_arguments [Hash] These arguments are forwarded to <%= link_to_component(Primer::OpenProject::TreeView::SubTreeNode) %>, or whatever class is passed as the `component_klass` argument.
+        #   # @param component_klass [Class] The class to use instead of the default <%= link_to_component(Primer::Alpha::TreeView::SubTreeNode) %>
+        #   # @param system_arguments [Hash] These arguments are forwarded to <%= link_to_component(Primer::Alpha::TreeView::SubTreeNode) %>, or whatever class is passed as the `component_klass` argument.
         #   def with_sub_tree(**system_arguments, &block)
         #   end
 
@@ -55,14 +55,14 @@ module Primer
         # @!parse
         #   # Adds a loader to this sub-tree that displays a spinner animation while nodes are fetched from the server.
         #   #
-        #   # @param system_arguments [Hash] The arguments accepted by <%= link_to_component(Primer::OpenProject::TreeView::SpinnerLoader) %>.
+        #   # @param system_arguments [Hash] The arguments accepted by <%= link_to_component(Primer::Alpha::TreeView::SpinnerLoader) %>.
         #   def with_loading_spinner(**system_arguments, &block)
         #   end
 
         # @!parse
         #   # Adds a loader to this sub-tree that displays a skeleton animation while nodes are fetched from the server.
         #   #
-        #   # @param system_arguments [Hash] The arguments accepted by <%= link_to_component(Primer::OpenProject::TreeView::SkeletonLoader) %>.
+        #   # @param system_arguments [Hash] The arguments accepted by <%= link_to_component(Primer::Alpha::TreeView::SkeletonLoader) %>.
         #   def with_loading_spinner(**system_arguments, &block)
         #   end
 
@@ -91,8 +91,8 @@ module Primer
 
         attr_reader :node_variant
 
-        # @param node_variant [Symbol] The variant to use for this node. <%= one_of(Primer::OpenProject::TreeView::NODE_VARIANT_OPTIONS) %>
-        # @param system_arguments [Hash] The arguments accepted by <%= link_to_component(Primer::OpenProject::TreeView::SubTreeContainer) %>.
+        # @param node_variant [Symbol] The variant to use for this node. <%= one_of(Primer::Alpha::TreeView::NODE_VARIANT_OPTIONS) %>
+        # @param system_arguments [Hash] The arguments accepted by <%= link_to_component(Primer::Alpha::TreeView::SubTreeContainer) %>.
         def initialize(node_variant:, **system_arguments)
           @node_variant = node_variant
 

data/app/components/primer/{open_project → alpha}/tree_view/sub_tree_container.rb

@@ -1,9 +1,9 @@
 # frozen_string_literal: true
 
 module Primer
-  module OpenProject
+  module Alpha
     class TreeView
-      # This component is part of the <%= link_to_component(Primer::OpenProject::TreeView) %> component and should
+      # This component is part of the <%= link_to_component(Primer::Alpha::TreeView) %> component and should
       # not be used directly.
       class SubTreeContainer < Primer::Component
         # The path to this node

data/app/components/primer/{open_project → alpha}/tree_view/sub_tree_node.rb

@@ -1,11 +1,11 @@
 # frozen_string_literal: true
 
 module Primer
-  module OpenProject
+  module Alpha
     class TreeView
       # A `TreeView` sub-tree node.
       #
-      # This component is part of the <%= link_to_component(Primer::OpenProject::TreeView) %> component and should
+      # This component is part of the <%= link_to_component(Primer::Alpha::TreeView) %> component and should
       # not be used directly.
       class SubTreeNode < Primer::Component
         DEFAULT_SELECT_STRATEGY = :mixed_descendants
@@ -19,7 +19,7 @@ module Primer
         #   # Adds a leading visual icon rendered to the left of the node's label.
         #   #
         #   # @param label [String] A label describing the visual, displayed only to screen readers.
-        #   # @param system_arguments [Hash] The arguments accepted by <%= link_to_component(Primer::OpenProject::TreeView::Icon) %>.
+        #   # @param system_arguments [Hash] The arguments accepted by <%= link_to_component(Primer::Alpha::TreeView::Icon) %>.
         #   def with_leading_visual_icon(label: nil, **system_arguments, &block)
         #   end
 
@@ -27,7 +27,7 @@ module Primer
         #   # Adds a pair of leading visual icon rendered to the left of the node's label.
         #   #
         #   # @param label [String] A label describing the visual, displayed only to screen readers.
-        #   # @param system_arguments [Hash] The arguments accepted by <%= link_to_component(Primer::OpenProject::TreeView::IconPair) %>.
+        #   # @param system_arguments [Hash] The arguments accepted by <%= link_to_component(Primer::Alpha::TreeView::IconPair) %>.
         #   def with_leading_visual_icons(label: nil, **system_arguments, &block)
         #   end
 
@@ -60,7 +60,7 @@ module Primer
               visual: IconPair.new(
                 **system_arguments,
                 expanded: @sub_tree.expanded?,
-              )
+                )
             )
           }
         }
@@ -87,7 +87,7 @@ module Primer
         #   # Adds a trailing visual icon rendered to the right of the node's label.
         #   #
         #   # @param label [String] A label describing the visual, displayed only to screen readers.
-        #   # @param system_arguments [Hash] The arguments accepted by <%= link_to_component(Primer::OpenProject::TreeView::Icon) %>.
+        #   # @param system_arguments [Hash] The arguments accepted by <%= link_to_component(Primer::Alpha::TreeView::Icon) %>.
         #   def with_trailing_visual_icon(label: nil, **system_arguments, &block)
         #   end
 
@@ -108,11 +108,11 @@ module Primer
 
         # @param label [String] The node's label, i.e. it's textual content.
         # @param path [Array<String>] The node's "path," i.e. this node's label and the labels of all its ancestors. This node should be reachable by traversing the tree following this path.
-        # @param node_variant [Symbol] The variant to use for this node. <%= one_of(Primer::OpenProject::TreeView::NODE_VARIANT_OPTIONS) %>
-        # @param sub_tree_component_klass [Class] The class to use for the sub-tree instead of the default <%= link_to_component(Primer::OpenProject::TreeView::SubTree) %>
+        # @param node_variant [Symbol] The variant to use for this node. <%= one_of(Primer::Alpha::TreeView::NODE_VARIANT_OPTIONS) %>
+        # @param sub_tree_component_klass [Class] The class to use for the sub-tree instead of the default <%= link_to_component(Primer::Alpha::TreeView::SubTree) %>
         # @param expanded [Boolean] Whether or not this sub-tree should be rendered expanded.
-        # @param select_strategy [Symbol] What should happen when this sub-tree node is checked. <%= one_of(Primer::OpenProject::TreeView::SubTreeNode::SELECT_STRATEGIES) %>
-        # @param system_arguments [Hash] The arguments accepted by <%= link_to_component(Primer::OpenProject::TreeView::Node) %>.
+        # @param select_strategy [Symbol] What should happen when this sub-tree node is checked. <%= one_of(Primer::Alpha::TreeView::SubTreeNode::SELECT_STRATEGIES) %>
+        # @param system_arguments [Hash] The arguments accepted by <%= link_to_component(Primer::Alpha::TreeView::Node) %>.
         def initialize(
           label:,
           path:,
@@ -133,11 +133,11 @@ module Primer
 
           @system_arguments[:data] = merge_data(
             @system_arguments, {
-              data: {
-                target: "tree-view-sub-tree-node.node",
-                "node-type": "sub-tree"
-              }
+            data: {
+              target: "tree-view-sub-tree-node.node",
+              "node-type": "sub-tree"
             }
+          }
           )
 
           sub_tree_arguments = @system_arguments.delete(:sub_tree_arguments) || {}
@@ -149,7 +149,7 @@ module Primer
             **sub_tree_arguments
           )
 
-          @node = Primer::OpenProject::TreeView::Node.new(
+          @node = Primer::Alpha::TreeView::Node.new(
             **@system_arguments,
             path: @sub_tree.path,
             node_variant: node_variant

data/app/components/primer/{open_project → alpha}/tree_view/tree_view_include_fragment_element.js

@@ -24,6 +24,5 @@ TreeViewIncludeFragmentElement = __decorate([
 export { TreeViewIncludeFragmentElement };
 if (!window.customElements.get('tree-view-include-fragment')) {
     window.TreeViewIncludeFragmentElement = TreeViewIncludeFragmentElement;
-    // eslint-disable-next-line custom-elements/extends-correct-class
     window.customElements.define('tree-view-include-fragment', TreeViewIncludeFragmentElement);
 }

data/app/components/primer/{open_project → alpha}/tree_view/tree_view_include_fragment_element.ts

@@ -18,7 +18,6 @@ export class TreeViewIncludeFragmentElement extends IncludeFragmentElement {
 
 if (!window.customElements.get('tree-view-include-fragment')) {
   window.TreeViewIncludeFragmentElement = TreeViewIncludeFragmentElement
-  // eslint-disable-next-line custom-elements/extends-correct-class
   window.customElements.define('tree-view-include-fragment', TreeViewIncludeFragmentElement)
 }
 

data/app/components/primer/{open_project → alpha}/tree_view/visual.rb

@@ -1,11 +1,11 @@
 # frozen_string_literal: true
 
 module Primer
-  module OpenProject
+  module Alpha
     class TreeView
       # A `TreeView` visual, either leading or trailing.
       #
-      # This component is part of the <%= link_to_component(Primer::OpenProject::TreeView) %> component and should
+      # This component is part of the <%= link_to_component(Primer::Alpha::TreeView) %> component and should
       # not be used directly.
       class Visual < Primer::Component
         # @param id [String] This visual's HTML ID.

data/app/components/primer/{open_project → alpha}/tree_view.css

@@ -1 +1 @@
-.TreeViewRootUlStyles{list-style:none;margin:0;padding:0}.TreeViewRootUlStyles .TreeViewItem{outline:none}:is(.TreeViewRootUlStyles .TreeViewItem):focus-visible>div{box-shadow:var(--boxShadow-thick) var(--fgColor-accent)}@media (forced-colors:active){:is(.TreeViewRootUlStyles .TreeViewItem):focus-visible>div{outline:2px solid HighlightText;outline-offset:-2}}[data-has-leading-action]:is(.TreeViewRootUlStyles .TreeViewItem){--has-leading-action:1}.TreeViewRootUlStyles .TreeViewItemContainer{--level:1;--toggle-width:1rem;--min-item-height:2rem;border-radius:var(--borderRadius-medium);color:var(--fgColor-default);display:grid;font-size:var(--text-body-size-medium);grid-template-areas:"spacer leadingAction toggle content";grid-template-columns:var(--spacer-width) var(--leading-action-width) var(--toggle-width) 1fr;position:relative;width:100%;--leading-action-width:calc(var(--has-leading-action, 0)*1.5rem);--spacer-width:calc((var(--level) - 1)*(var(--toggle-width)/2))}:is(.TreeViewRootUlStyles .TreeViewItemContainer):hover{background-color:var(--control-transparent-bgColor-hover)}@media (forced-colors:active){:is(.TreeViewRootUlStyles .TreeViewItemContainer):hover{outline:2px solid #0000;outline-offset:-2px}}@media (pointer:coarse){.TreeViewRootUlStyles .TreeViewItemContainer{--toggle-width:1.5rem;--min-item-height:2.75rem}}:is(.TreeViewRootUlStyles .TreeViewItemContainer):has(.TreeViewFailureMessage):hover{background-color:initial;cursor:default}@media (forced-colors:active){:is(.TreeViewRootUlStyles .TreeViewItemContainer):has(.TreeViewFailureMessage):hover{outline:none}}:is(.TreeViewRootUlStyles .TreeViewItemContainer):has([role=treeitem]:focus-visible){box-shadow:var(--boxShadow-thick) var(--fgColor-accent)}.TreeViewRootUlStyles:where([data-omit-spacer=true]) .TreeViewItemContainer{grid-template-columns:0 0 0 1fr}.TreeViewRootUlStyles .TreeViewItem>.TreeViewItemContainer:has(.TreeViewItemContent[aria-current=true]){background-color:var(--control-transparent-bgColor-selected)}:is(.TreeViewRootUlStyles .TreeViewItem>.TreeViewItemContainer:has(.TreeViewItemContent[aria-current=true])):after{background-color:var(--fgColor-accent);border-radius:var(--borderRadius-medium);content:"";height:1.5rem;left:calc(var(--base-size-8)*-1);position:absolute;top:calc(50% - var(--base-size-12));width:.25rem}@media (forced-colors:active){:is(.TreeViewRootUlStyles .TreeViewItem>.TreeViewItemContainer:has(.TreeViewItemContent[aria-current=true])):after{background-color:HighlightText}}.TreeViewRootUlStyles .TreeViewItemToggle{align-items:flex-start;color:var(--fgColor-muted);cursor:pointer;display:flex;grid-area:toggle;height:100%;justify-content:center;padding-top:calc(var(--min-item-height)/2 - var(--base-size-12)/2)}.TreeViewRootUlStyles .TreeViewItemToggleHover:hover{background-color:var(--control-transparent-bgColor-hover)}.TreeViewRootUlStyles .TreeViewItemToggleEnd{border-bottom-left-radius:var(--borderRadius-medium);border-top-left-radius:var(--borderRadius-medium)}.TreeViewRootUlStyles a.TreeViewItemContent:hover,.TreeViewRootUlStyles button.TreeViewItemContent:hover{-webkit-text-decoration:underline;text-decoration:underline;text-decoration-color:var(--control-fgColor-rest)}.TreeViewRootUlStyles :has(.TreeViewItemContent[aria-disabled=true]){cursor:not-allowed}.TreeViewRootUlStyles .TreeViewItemContent{cursor:pointer;display:flex;gap:var(--stack-gap-condensed);grid-area:content;height:100%;line-height:var(--custom-line-height,var(--text-body-lineHeight-medium,1.4285));outline:none;padding:0 var(--base-size-8);padding-bottom:calc((var(--min-item-height) - var(--custom-line-height, 1.3rem))/2);padding-top:calc((var(--min-item-height) - var(--custom-line-height, 1.3rem))/2)}.TreeViewRootUlStyles .TreeViewItemContent,:is(.TreeViewRootUlStyles .TreeViewItemContent) .TreeViewItemCheckbox{background-color:initial;border:none;text-align:left;touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}:is(.TreeViewRootUlStyles .TreeViewItemContent) .TreeViewItemCheckbox{border-radius:var(--borderRadius-medium);color:var(--control-fgColor-rest);position:relative;transition:background 33.333ms linear}[aria-checked=true]:is(.TreeViewRootUlStyles .TreeViewItemContent) .FormControl-checkbox{background:var(--control-checked-bgColor-rest);border-color:var(--control-checked-borderColor-rest);transition:background-color,border-color 80ms cubic-bezier(.32,0,.67,0) 0s}:is([aria-checked=true]:is(.TreeViewRootUlStyles .TreeViewItemContent) .FormControl-checkbox):before{animation:checkmarkIn 80ms cubic-bezier(.65,0,.35,1) 80ms forwards;transition:visibility 0s linear 0s;visibility:visible}[aria-checked=mixed]:is(.TreeViewRootUlStyles .TreeViewItemContent) .FormControl-checkbox{background:var(--control-checked-bgColor-rest);border-color:var(--control-checked-borderColor-rest);transition:background-color,border-color 80ms cubic-bezier(.32,0,.67,0) 0s}:is([aria-checked=mixed]:is(.TreeViewRootUlStyles .TreeViewItemContent) .FormControl-checkbox):before{animation:checkmarkIn 80ms cubic-bezier(.65,0,.35,1) 80ms forwards;clip-path:none;mask-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMCIgaGVpZ2h0PSIyIiBmaWxsPSJub25lIiB2aWV3Qm94PSIwIDAgMTAgMiI+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNMCAxYTEgMSAwIDAgMSAxLTFoOGExIDEgMCAxIDEgMCAySDFhMSAxIDAgMCAxLTEtMSIgY2xpcC1ydWxlPSJldmVub2RkIi8+PC9zdmc+");visibility:visible}[aria-disabled=true]:is(.TreeViewRootUlStyles .TreeViewItemContent){pointer-events:none}[aria-disabled=true]:is(.TreeViewRootUlStyles .TreeViewItemContent) .TreeViewItemContentText{color:var(--control-fgColor-disabled)}:is([aria-disabled=true]:is(.TreeViewRootUlStyles .TreeViewItemContent) .TreeViewItemVisual) svg,[aria-disabled=true]:is(.TreeViewRootUlStyles .TreeViewItemContent) .TreeViewItemVisual{fill:var(--control-fgColor-disabled)}@media (hover:hover){:is([aria-disabled=true]:is(.TreeViewRootUlStyles .TreeViewItemContent) .FormControl-checkbox):hover{cursor:not-allowed}[aria-disabled=true]:is(.TreeViewRootUlStyles .TreeViewItemContent):hover{background-color:initial;cursor:not-allowed}}:is(.TreeViewRootUlStyles .TreeViewItemContent) ::highlight(primer-filterable-tree-view-search-results){background-color:var(--label-yellow-bgColor-active);color:var(--fgColor-default)}:is(.TreeViewRootUlStyles .TreeViewItemContent) mark{background-color:var(--label-yellow-bgColor-active);color:var(--fgColor-default)}.TreeViewRootUlStyles .TreeViewItemContentText{color:var(--control-fgColor-rest);flex:1 1 auto;-webkit-user-select:auto;width:0}.TreeViewRootUlStyles:where([data-truncate-text=true]) .TreeViewItemContentText{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.TreeViewRootUlStyles:where([data-truncate-text=false]) .TreeViewItemContentText{word-break:break-word}.TreeViewRootUlStyles .TreeViewItemVisual{align-items:center;color:var(--fgColor-muted);display:flex;height:var(--custom-line-height,1.3rem)}.TreeViewRootUlStyles .TreeViewItemLeadingAction{color:var(--fgColor-muted);display:flex;grid-area:leadingAction}:is(.TreeViewRootUlStyles .TreeViewItemLeadingAction)>button{flex-shrink:1}.TreeViewRootUlStyles .TreeViewItemLevelLine{border-color:var(--borderColor-muted);border-right:var(--borderWidth-thin) solid;height:100%;width:100%}@media (hover:hover){.TreeViewRootUlStyles .TreeViewItemLevelLine{border-color:#0000}.TreeViewRootUlStyles:focus-within .TreeViewItemLevelLine,.TreeViewRootUlStyles:hover .TreeViewItemLevelLine{border-color:var(--borderColor-muted)}}.TreeViewRootUlStyles .TreeViewVisuallyHidden{height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;clip:rect(0,0,0,0);border-width:0;white-space:nowrap}.TreeViewSkeletonItemContainerStyle{align-items:center;column-gap:.5rem;display:flex;height:2rem}@media (pointer:coarse){.TreeViewSkeletonItemContainerStyle{height:2.75rem}}.TreeViewSkeletonItemContainerStyle:nth-of-type(5n+1){--tree-item-loading-width:67%}.TreeViewSkeletonItemContainerStyle:nth-of-type(5n+2){--tree-item-loading-width:47%}.TreeViewSkeletonItemContainerStyle:nth-of-type(5n+3){--tree-item-loading-width:73%}.TreeViewSkeletonItemContainerStyle:nth-of-type(5n+4){--tree-item-loading-width:64%}.TreeViewSkeletonItemContainerStyle:nth-of-type(5n+5){--tree-item-loading-width:50%}.TreeItemSkeletonTextStyles{width:var(--tree-item-loading-width,67%)}.TreeViewFailureMessage{align-items:center;display:grid;gap:.5rem;grid-template-columns:auto 1fr;width:100%}
+.TreeViewRootUlStyles{list-style:none;margin:0;padding:0}.TreeViewRootUlStyles .TreeViewItem{outline:none}:is(.TreeViewRootUlStyles .TreeViewItem):focus-visible>div{box-shadow:var(--boxShadow-thick) var(--fgColor-accent)}@media (forced-colors:active){:is(.TreeViewRootUlStyles .TreeViewItem):focus-visible>div{outline:2px solid HighlightText;outline-offset:-2}}[data-has-leading-action]:is(.TreeViewRootUlStyles .TreeViewItem){--has-leading-action:1}.TreeViewRootUlStyles .TreeViewItemContainer{--level:1;--toggle-width:1rem;--min-item-height:2rem;border-radius:var(--borderRadius-medium);color:var(--fgColor-default);display:grid;font-size:var(--text-body-size-medium);grid-template-areas:"spacer leadingAction toggle content";grid-template-columns:var(--spacer-width) var(--leading-action-width) var(--toggle-width) 1fr;position:relative;width:100%;--leading-action-width:calc(var(--has-leading-action, 0)*1.5rem);--spacer-width:calc((var(--level) - 1)*(var(--toggle-width)/2))}:is(.TreeViewRootUlStyles .TreeViewItemContainer):hover{background-color:var(--control-transparent-bgColor-hover)}@media (forced-colors:active){:is(.TreeViewRootUlStyles .TreeViewItemContainer):hover{outline:2px solid #0000;outline-offset:-2px}}@media (pointer:coarse){.TreeViewRootUlStyles .TreeViewItemContainer{--toggle-width:1.5rem;--min-item-height:2.75rem}}:is(.TreeViewRootUlStyles .TreeViewItemContainer):has(.TreeViewFailureMessage):hover{background-color:initial;cursor:default}@media (forced-colors:active){:is(.TreeViewRootUlStyles .TreeViewItemContainer):has(.TreeViewFailureMessage):hover{outline:none}}:is(.TreeViewRootUlStyles .TreeViewItemContainer):has([role=treeitem]:focus-visible){box-shadow:var(--boxShadow-thick) var(--fgColor-accent)}.TreeViewRootUlStyles:where([data-omit-spacer=true]) .TreeViewItemContainer{grid-template-columns:0 0 0 1fr}.TreeViewRootUlStyles .TreeViewItem>.TreeViewItemContainer:has(.TreeViewItemContent[aria-current=true]){background-color:var(--control-transparent-bgColor-selected)}:is(.TreeViewRootUlStyles .TreeViewItem>.TreeViewItemContainer:has(.TreeViewItemContent[aria-current=true])):after{background-color:var(--fgColor-accent);border-radius:var(--borderRadius-medium);content:"";height:1.5rem;left:calc(var(--base-size-8)*-1);position:absolute;top:calc(50% - var(--base-size-12));width:.25rem}@media (forced-colors:active){:is(.TreeViewRootUlStyles .TreeViewItem>.TreeViewItemContainer:has(.TreeViewItemContent[aria-current=true])):after{background-color:HighlightText}}.TreeViewRootUlStyles .TreeViewItemToggle{align-items:flex-start;color:var(--fgColor-muted);cursor:pointer;display:flex;grid-area:toggle;height:100%;justify-content:center;padding-top:calc(var(--min-item-height)/2 - var(--base-size-12)/2)}.TreeViewRootUlStyles .TreeViewItemToggleHover:hover{background-color:var(--control-transparent-bgColor-hover)}.TreeViewRootUlStyles .TreeViewItemToggleEnd{border-bottom-left-radius:var(--borderRadius-medium);border-top-left-radius:var(--borderRadius-medium)}.TreeViewRootUlStyles a.TreeViewItemContent:hover,.TreeViewRootUlStyles button.TreeViewItemContent:hover{-webkit-text-decoration:underline;text-decoration:underline;text-decoration-color:var(--control-fgColor-rest)}.TreeViewRootUlStyles :has(.TreeViewItemContent[aria-disabled=true]){cursor:not-allowed}.TreeViewRootUlStyles .TreeViewItemContent{cursor:pointer;display:flex;gap:var(--stack-gap-condensed);grid-area:content;height:100%;line-height:var(--custom-line-height,var(--text-body-lineHeight-medium,1.4285));outline:none;padding:0 var(--base-size-8);padding-bottom:calc((var(--min-item-height) - var(--custom-line-height, 1.3rem))/2);padding-top:calc((var(--min-item-height) - var(--custom-line-height, 1.3rem))/2)}.TreeViewRootUlStyles .TreeViewItemContent,:is(.TreeViewRootUlStyles .TreeViewItemContent) .TreeViewItemCheckbox{background-color:initial;border:none;text-align:left;touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}:is(.TreeViewRootUlStyles .TreeViewItemContent) .TreeViewItemCheckbox{border-radius:var(--borderRadius-medium);color:var(--control-fgColor-rest);position:relative;transition:background 33.333ms linear}[aria-checked=true]:is(.TreeViewRootUlStyles .TreeViewItemContent) .FormControl-checkbox{background:var(--control-checked-bgColor-rest);border-color:var(--control-checked-borderColor-rest);transition:background-color,border-color 80ms cubic-bezier(.32,0,.67,0) 0s}:is([aria-checked=true]:is(.TreeViewRootUlStyles .TreeViewItemContent) .FormControl-checkbox):before{animation:checkmarkIn 80ms cubic-bezier(.65,0,.35,1) 80ms forwards;transition:visibility 0s linear 0s;visibility:visible}[aria-checked=mixed]:is(.TreeViewRootUlStyles .TreeViewItemContent) .FormControl-checkbox{background:var(--control-checked-bgColor-rest);border-color:var(--control-checked-borderColor-rest);transition:background-color,border-color 80ms cubic-bezier(.32,0,.67,0) 0s}:is([aria-checked=mixed]:is(.TreeViewRootUlStyles .TreeViewItemContent) .FormControl-checkbox):before{animation:checkmarkIn 80ms cubic-bezier(.65,0,.35,1) 80ms forwards;clip-path:none;mask-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMCIgaGVpZ2h0PSIyIiBmaWxsPSJub25lIiB2aWV3Qm94PSIwIDAgMTAgMiI+PHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNMCAxYTEgMSAwIDAgMSAxLTFoOGExIDEgMCAxIDEgMCAySDFhMSAxIDAgMCAxLTEtMSIgY2xpcC1ydWxlPSJldmVub2RkIi8+PC9zdmc+");visibility:visible}[aria-disabled=true]:is(.TreeViewRootUlStyles .TreeViewItemContent){pointer-events:none}[aria-disabled=true]:is(.TreeViewRootUlStyles .TreeViewItemContent) .TreeViewItemContentText{color:var(--control-fgColor-disabled)}:is([aria-disabled=true]:is(.TreeViewRootUlStyles .TreeViewItemContent) .TreeViewItemVisual) svg,[aria-disabled=true]:is(.TreeViewRootUlStyles .TreeViewItemContent) .TreeViewItemVisual{fill:var(--control-fgColor-disabled)}@media (hover:hover){:is([aria-disabled=true]:is(.TreeViewRootUlStyles .TreeViewItemContent) .FormControl-checkbox):hover{cursor:not-allowed}[aria-disabled=true]:is(.TreeViewRootUlStyles .TreeViewItemContent):hover{background-color:initial;cursor:not-allowed}}.TreeViewRootUlStyles .TreeViewItemContentText{color:var(--control-fgColor-rest);flex:1 1 auto;width:0}.TreeViewRootUlStyles:where([data-truncate-text=true]) .TreeViewItemContentText{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.TreeViewRootUlStyles:where([data-truncate-text=false]) .TreeViewItemContentText{word-break:break-word}.TreeViewRootUlStyles .TreeViewItemVisual{align-items:center;color:var(--fgColor-muted);display:flex;height:var(--custom-line-height,1.3rem)}.TreeViewRootUlStyles .TreeViewItemLeadingAction{color:var(--fgColor-muted);display:flex;grid-area:leadingAction}:is(.TreeViewRootUlStyles .TreeViewItemLeadingAction)>button{flex-shrink:1}.TreeViewRootUlStyles .TreeViewItemLevelLine{border-color:var(--borderColor-muted);border-right:var(--borderWidth-thin) solid;height:100%;width:100%}@media (hover:hover){.TreeViewRootUlStyles .TreeViewItemLevelLine{border-color:#0000}.TreeViewRootUlStyles:focus-within .TreeViewItemLevelLine,.TreeViewRootUlStyles:hover .TreeViewItemLevelLine{border-color:var(--borderColor-muted)}}.TreeViewRootUlStyles .TreeViewVisuallyHidden{height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;clip:rect(0,0,0,0);border-width:0;white-space:nowrap}.TreeViewSkeletonItemContainerStyle{align-items:center;column-gap:.5rem;display:flex;height:2rem}@media (pointer:coarse){.TreeViewSkeletonItemContainerStyle{height:2.75rem}}.TreeViewSkeletonItemContainerStyle:nth-of-type(5n+1){--tree-item-loading-width:67%}.TreeViewSkeletonItemContainerStyle:nth-of-type(5n+2){--tree-item-loading-width:47%}.TreeViewSkeletonItemContainerStyle:nth-of-type(5n+3){--tree-item-loading-width:73%}.TreeViewSkeletonItemContainerStyle:nth-of-type(5n+4){--tree-item-loading-width:64%}.TreeViewSkeletonItemContainerStyle:nth-of-type(5n+5){--tree-item-loading-width:50%}.TreeItemSkeletonTextStyles{width:var(--tree-item-loading-width,67%)}.TreeViewFailureMessage{align-items:center;display:grid;gap:.5rem;grid-template-columns:auto 1fr;width:100%}

data/app/components/primer/{open_project → alpha}/tree_view.css.json

@@ -1,5 +1,5 @@
 {
-  "name": "open_project/tree_view",
+  "name": "alpha/tree_view",
   "selectors": [
     ".TreeViewRootUlStyles",
     ".TreeViewRootUlStyles .TreeViewItem",
@@ -30,8 +30,6 @@
     "[aria-disabled=true]:is(.TreeViewRootUlStyles .TreeViewItemContent) .TreeViewItemVisual",
     ":is([aria-disabled=true]:is(.TreeViewRootUlStyles .TreeViewItemContent) .FormControl-checkbox):hover",
     "[aria-disabled=true]:is(.TreeViewRootUlStyles .TreeViewItemContent):hover",
-    ":is(.TreeViewRootUlStyles .TreeViewItemContent) ::highlight(primer-filterable-tree-view-search-results)",
-    ":is(.TreeViewRootUlStyles .TreeViewItemContent) mark",
     ".TreeViewRootUlStyles .TreeViewItemContentText",
     ".TreeViewRootUlStyles:where([data-truncate-text=true]) .TreeViewItemContentText",
     ".TreeViewRootUlStyles:where([data-truncate-text=false]) .TreeViewItemContentText",