primer_view_components 0.0.33 → 0.0.38

data/app/components/primer/subhead_component.rb

@@ -71,7 +71,7 @@ module Primer
     #     <% component.actions do %>
     #       <%= render(
     #         Primer::ButtonComponent.new(
-    #           tag: :a, href: "http://www.google.com", button_type: :danger
+    #           tag: :a, href: "http://www.google.com", scheme: :danger
     #         )
     #       ) { "Action" } %>
     #     <% end %>

data/app/components/primer/tab_nav_component.html.erb

@@ -1,10 +1,10 @@
 <%= wrapper do %>
   <%= render Primer::BaseComponent.new(**@system_arguments) do %>
-    <nav role="tablist" aria-label="<%= @aria_label %>" class="tabnav-tabs">
+    <%= render Primer::BaseComponent.new(**@body_arguments) do %>
       <% tabs.each do |tab| %>
         <%= tab %>
       <% end %>
-    </nav>
+    <% end %>
   <% end %>
 
   <% if @with_panel %>

data/app/components/primer/tab_nav_component.rb

@@ -14,18 +14,23 @@ module Primer
         "tabnav-tab",
         system_arguments[:classes]
       )
-      Primer::Navigation::TabComponent.new(selected: selected, with_panel: @with_panel, **system_arguments)
+
+      Primer::Navigation::TabComponent.new(
+        selected: selected,
+        with_panel: @with_panel,
+        **system_arguments
+      )
     }
 
     # @example Default
-    #   <%= render(Primer::TabNavComponent.new) do |c| %>
+    #   <%= render(Primer::TabNavComponent.new(label: "Default")) do |c| %>
     #     <% c.tab(selected: true, href: "#") { "Tab 1" }%>
     #     <% c.tab(href: "#") { "Tab 2" } %>
     #     <% c.tab(href: "#") { "Tab 3" } %>
     #   <% end %>
     #
     # @example With icons and counters
-    #   <%= render(Primer::TabNavComponent.new) do |component| %>
+    #   <%= render(Primer::TabNavComponent.new(label: "With icons and counters")) do |component| %>
     #     <% component.tab(href: "#", selected: true) do |t| %>
     #       <% t.icon(icon: :star) %>
     #       <% t.text { "Item 1" } %>
@@ -42,7 +47,7 @@ module Primer
     #   <% end %>
     #
     # @example With panels
-    #   <%= render(Primer::TabNavComponent.new(with_panel: true)) do |c| %>
+    #   <%= render(Primer::TabNavComponent.new(label: "With panels", with_panel: true)) do |c| %>
     #     <% c.tab(selected: true) do |t| %>
     #       <% t.text { "Tab 1" } %>
     #       <% t.panel do %>
@@ -63,19 +68,28 @@ module Primer
     #     <% end %>
     #   <% end %>
     #
-    # @param aria_label [String] Used to set the `aria-label` on the top level `<nav>` element.
+    # @param label [String] Used to set the `aria-label` on the top level `<nav>` element.
     # @param with_panel [Boolean] Whether the TabNav should navigate through pages or panels.
     # @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
-    def initialize(aria_label: nil, with_panel: false, **system_arguments)
-      @aria_label = aria_label
+    def initialize(label:, with_panel: false, **system_arguments)
       @with_panel = with_panel
       @system_arguments = system_arguments
-      @system_arguments[:tag] ||= :div
 
+      @system_arguments[:tag] ||= :div
       @system_arguments[:classes] = class_names(
         "tabnav",
         system_arguments[:classes]
       )
+
+      @body_arguments = {
+        tag: navigation_tag(with_panel),
+        classes: "tabnav-tabs",
+        aria: {
+          label: label
+        }
+      }
+
+      @body_arguments[:role] = :tablist if @with_panel
     end
   end
 end

data/app/components/primer/{truncate_component.rb → truncate.rb}

@@ -1,21 +1,23 @@
 # frozen_string_literal: true
 
 module Primer
-  # Use TruncateComponent to shorten overflowing text with an ellipsis.
-  class TruncateComponent < Primer::Component
+  # Use Truncate to shorten overflowing text with an ellipsis.
+  class Truncate < Primer::Component
+    status :beta
+
     # @example Default
     #   <div class="col-2">
-    #     <%= render(Primer::TruncateComponent.new(tag: :p)) { "branch-name-that-is-really-long" } %>
+    #     <%= render(Primer::Truncate.new(tag: :p)) { "branch-name-that-is-really-long" } %>
     #   </div>
     #
     # @example Inline
-    #   <%= render(Primer::TruncateComponent.new(tag: :span, inline: true)) { "branch-name-that-is-really-long" } %>
+    #   <%= render(Primer::Truncate.new(tag: :span, inline: true)) { "branch-name-that-is-really-long" } %>
     #
     # @example Expandable
-    #   <%= render(Primer::TruncateComponent.new(tag: :span, inline: true, expandable: true)) { "branch-name-that-is-really-long" } %>
+    #   <%= render(Primer::Truncate.new(tag: :span, inline: true, expandable: true)) { "branch-name-that-is-really-long" } %>
     #
     # @example Custom size
-    #   <%= render(Primer::TruncateComponent.new(tag: :span, inline: true, expandable: true, max_width: 100)) { "branch-name-that-is-really-long" } %>
+    #   <%= render(Primer::Truncate.new(tag: :span, inline: true, expandable: true, max_width: 100)) { "branch-name-that-is-really-long" } %>
     #
     # @param inline [Boolean] Whether the element is inline (or inline-block).
     # @param expandable [Boolean] Whether the entire string should be revealed on hover. Can only be used in conjunction with `inline`.

data/app/components/primer/underline_nav_component.rb

@@ -10,6 +10,9 @@ module Primer
     ALIGN_DEFAULT = :left
     ALIGN_OPTIONS = [ALIGN_DEFAULT, :right].freeze
 
+    BODY_TAG_DEFAULT = :div
+    BODY_TAG_OPTIONS = [BODY_TAG_DEFAULT, :ul].freeze
+
     # Use the tabs to list navigation items. For more information, refer to <%= link_to_component(Primer::Navigation::TabComponent) %>.
     #
     # @param selected [Boolean] Whether the tab is selected.
@@ -19,7 +22,9 @@ module Primer
         "UnderlineNav-item",
         system_arguments[:classes]
       )
+
       Primer::Navigation::TabComponent.new(
+        list: list?,
         selected: selected,
         with_panel: @with_panel,
         icon_classes: "UnderlineNav-octicon",
@@ -38,7 +43,7 @@ module Primer
     }
 
     # @example Default
-    #   <%= render(Primer::UnderlineNavComponent.new) do |component| %>
+    #   <%= render(Primer::UnderlineNavComponent.new(label: "Default")) do |component| %>
     #     <% component.tab(href: "#", selected: true) { "Item 1" } %>
     #     <% component.tab(href: "#") { "Item 2" } %>
     #     <% component.actions do %>
@@ -47,7 +52,7 @@ module Primer
     #   <% end %>
     #
     # @example With icons and counters
-    #   <%= render(Primer::UnderlineNavComponent.new) do |component| %>
+    #   <%= render(Primer::UnderlineNavComponent.new(label: "With icons and counters")) do |component| %>
     #     <% component.tab(href: "#", selected: true) do |t| %>
     #       <% t.icon(icon: :star) %>
     #       <% t.text { "Item 1" } %>
@@ -67,7 +72,20 @@ module Primer
     #   <% end %>
     #
     # @example Align right
-    #   <%= render(Primer::UnderlineNavComponent.new(align: :right)) do |component| %>
+    #   <%= render(Primer::UnderlineNavComponent.new(label: "Align right", align: :right)) do |component| %>
+    #     <% component.tab(href: "#", selected: true) do |t| %>
+    #       <% t.text { "Item 1" } %>
+    #     <% end %>
+    #     <% component.tab(href: "#") do |t| %>
+    #       <% t.text { "Item 2" } %>
+    #     <% end %>
+    #     <% component.actions do %>
+    #       <%= render(Primer::ButtonComponent.new) { "Button!" } %>
+    #     <% end %>
+    #   <% end %>
+    #
+    # @example As a list
+    #   <%= render(Primer::UnderlineNavComponent.new(label: "As a list", body_arguments: { tag: :ul })) do |component| %>
     #     <% component.tab(href: "#", selected: true) do |t| %>
     #       <% t.text { "Item 1" } %>
     #     <% end %>
@@ -80,7 +98,7 @@ module Primer
     #   <% end %>
     #
     # @example With panels
-    #   <%= render(Primer::UnderlineNavComponent.new(with_panel: true)) do |component| %>
+    #   <%= render(Primer::UnderlineNavComponent.new(label: "With panels", with_panel: true)) do |component| %>
     #     <% component.tab(selected: true) do |t| %>
     #       <% t.text { "Item 1" } %>
     #       <% t.panel do %>
@@ -98,33 +116,47 @@ module Primer
     #     <% end %>
     #   <% end %>
     #
+    # @param label [String] The `aria-label` on top level `<nav>` element.
     # @param with_panel [Boolean] Whether the TabNav should navigate through pages or panels.
     # @param align [Symbol] <%= one_of(Primer::UnderlineNavComponent::ALIGN_OPTIONS) %> - Defaults to <%= Primer::UnderlineNavComponent::ALIGN_DEFAULT %>
+    # @param body_arguments [Hash] <%= link_to_system_arguments_docs %> for the body wrapper.
     # @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
-    def initialize(with_panel: false, align: ALIGN_DEFAULT, body_classes: "", **system_arguments)
+    def initialize(label:, with_panel: false, align: ALIGN_DEFAULT, body_arguments: { tag: BODY_TAG_DEFAULT }, **system_arguments)
       @with_panel = with_panel
       @align = fetch_or_fallback(ALIGN_OPTIONS, align, ALIGN_DEFAULT)
 
       @system_arguments = system_arguments
-      @system_arguments[:tag] = :nav
-      @system_arguments[:role] = :tablist
+      @system_arguments[:tag] = navigation_tag(with_panel)
       @system_arguments[:classes] = class_names(
         @system_arguments[:classes],
         "UnderlineNav",
         "UnderlineNav--right" => @align == :right
       )
 
-      @body_arguments = {
-        tag: :div,
-        classes: class_names(
-          "UnderlineNav-body",
-          body_classes
-        )
-      }
+      @body_arguments = body_arguments
+      @body_tag = fetch_or_fallback(BODY_TAG_OPTIONS, body_arguments[:tag]&.to_sym, BODY_TAG_DEFAULT)
+
+      @body_arguments[:tag] = @body_tag
+      @body_arguments[:classes] = class_names(
+        "UnderlineNav-body",
+        @body_arguments[:classes],
+        "list-style-none" => list?
+      )
+
+      if with_panel
+        @body_arguments[:role] = :tablist
+        @body_arguments[:"aria-label"] = label
+      else
+        @system_arguments[:"aria-label"] = label
+      end
     end
 
     private
 
+    def list?
+      @body_tag == :ul
+    end
+
     def body
       Primer::BaseComponent.new(**@body_arguments)
     end

data/app/lib/primer/classify.rb

@@ -3,12 +3,11 @@
 module Primer
   # :nodoc:
   class Classify
-    MARGIN_DIRECTION_KEYS = %i[mt ml mb mr].freeze
-    SPACING_KEYS = (%i[m my mx p py px pt pl pb pr] + MARGIN_DIRECTION_KEYS).freeze
     DIRECTION_KEY = :direction
     JUSTIFY_CONTENT_KEY = :justify_content
     ALIGN_ITEMS_KEY = :align_items
     DISPLAY_KEY = :display
+    SPACING_KEYS = Primer::Classify::Spacing::KEYS
     RESPONSIVE_KEYS = ([DISPLAY_KEY, DIRECTION_KEY, JUSTIFY_CONTENT_KEY, ALIGN_ITEMS_KEY, :col, :float] + SPACING_KEYS).freeze
     BREAKPOINTS = ["", "-sm", "-md", "-lg", "-xl"].freeze
 
@@ -16,7 +15,7 @@ module Primer
     CONCAT_KEYS = SPACING_KEYS + %i[hide position v float col text box_shadow].freeze
 
     INVALID_CLASS_NAME_PREFIXES =
-      (["bg-", "color-", "text-", "d-", "v-align-", "wb-", "text-", "box-shadow-"] + CONCAT_KEYS.map { |k| "#{k}-" }).freeze
+      (["bg-", "color-", "text-", "d-", "v-align-", "wb-", "box-shadow-"] + CONCAT_KEYS.map { |k| "#{k}-" }).freeze
 
     COLOR_KEY = :color
     BG_KEY = :bg
@@ -184,14 +183,8 @@ module Primer
         return if val.nil? || val == ""
 
         if SPACING_KEYS.include?(key)
-          if MARGIN_DIRECTION_KEYS.include?(key)
-            raise ArgumentError, "value of #{key} must be between -6 and 6" if val < -6 || val > 6
-          elsif !((key == :mx || key == :my) && val == :auto)
-            raise ArgumentError, "value of #{key} must be between 0 and 6" if val.negative? || val > 6
-          end
-        end
-
-        if BOOLEAN_MAPPINGS.key?(key)
+          memo[:classes] << Primer::Classify::Spacing.spacing(key, val, breakpoint)
+        elsif BOOLEAN_MAPPINGS.key?(key)
           BOOLEAN_MAPPINGS[key][:mappings].each do |m|
             memo[:classes] << m[:css_class] if m[:value] == val && m[:css_class].present?
           end
@@ -248,8 +241,6 @@ module Primer
           memo[:classes] << "text-#{val.to_s.dasherize}"
         elsif TYPOGRAPHY_KEYS.include?(key)
           memo[:classes] << "f#{val.to_s.dasherize}"
-        elsif MARGIN_DIRECTION_KEYS.include?(key) && val.negative?
-          memo[:classes] << "#{key.to_s.dasherize}#{breakpoint}-n#{val.abs}"
         elsif key == BOX_SHADOW_KEY
           memo[:classes] << if val == true
                               "color-shadow-small"

data/app/lib/primer/classify/cache.rb

@@ -20,13 +20,23 @@ module Primer
 
         def preload!
           preload(
-            keys: Primer::Classify::MARGIN_DIRECTION_KEYS,
-            values: [-6, -5, -4, -3, -2, -1, 0, 1, 2, 3, 4, 5, 6]
+            keys: Primer::Classify::Spacing::MARGIN_DIRECTION_MAPPINGS.keys,
+            values: Primer::Classify::Spacing::MARGIN_DIRECTION_OPTIONS
           )
 
           preload(
-            keys: (Primer::Classify::SPACING_KEYS - Primer::Classify::MARGIN_DIRECTION_KEYS),
-            values: [0, 1, 2, 3, 4, 5, 6]
+            keys: Primer::Classify::Spacing::BASE_MAPPINGS.keys,
+            values: Primer::Classify::Spacing::BASE_OPTIONS
+          )
+
+          preload(
+            keys: Primer::Classify::Spacing::AUTO_MAPPINGS.keys,
+            values: Primer::Classify::Spacing::AUTO_OPTIONS
+          )
+
+          preload(
+            keys: Primer::Classify::Spacing::RESPONSIVE_MAPPINGS.keys,
+            values: Primer::Classify::Spacing::RESPONSIVE_OPTIONS
           )
 
           preload(

data/app/lib/primer/classify/spacing.rb

@@ -0,0 +1,63 @@
+# frozen_string_literal: true
+
+module Primer
+  class Classify
+    # Handler for PrimerCSS spacing classes.
+    class Spacing
+      BASE_OPTIONS = (0..6).to_a.freeze
+      BASE_MAPPINGS = {
+        my: BASE_OPTIONS,
+        pb: BASE_OPTIONS,
+        pl: BASE_OPTIONS,
+        pr: BASE_OPTIONS,
+        pt: BASE_OPTIONS,
+        px: BASE_OPTIONS,
+        py: BASE_OPTIONS
+      }.freeze
+
+      MARGIN_DIRECTION_OPTIONS = [*(-6..-1), *BASE_OPTIONS].freeze
+      MARGIN_DIRECTION_MAPPINGS = {
+        mb: MARGIN_DIRECTION_OPTIONS,
+        ml: MARGIN_DIRECTION_OPTIONS,
+        mr: MARGIN_DIRECTION_OPTIONS,
+        mt: MARGIN_DIRECTION_OPTIONS
+      }.freeze
+
+      AUTO_OPTIONS = [*BASE_OPTIONS, :auto].freeze
+      AUTO_MAPPINGS = {
+        m: AUTO_OPTIONS,
+        mx: AUTO_OPTIONS
+      }.freeze
+
+      RESPONSIVE_OPTIONS = [*BASE_OPTIONS, :responsive].freeze
+      RESPONSIVE_MAPPINGS = {
+        p: RESPONSIVE_OPTIONS
+      }.freeze
+
+      MAPPINGS = {
+        **BASE_MAPPINGS,
+        **MARGIN_DIRECTION_MAPPINGS,
+        **AUTO_MAPPINGS,
+        **RESPONSIVE_MAPPINGS
+      }.freeze
+      KEYS = MAPPINGS.keys.freeze
+
+      class << self
+        def spacing(key, val, breakpoint)
+          validate(key, val) unless Rails.env.production?
+
+          return "#{key.to_s.dasherize}#{breakpoint}-n#{val.abs}" if val.is_a?(Numeric) && val.negative?
+
+          "#{key.to_s.dasherize}#{breakpoint}-#{val.to_s.dasherize}"
+        end
+
+        private
+
+        def validate(key, val)
+          raise ArgumentError, "#{key} is not a spacing key" unless KEYS.include?(key)
+          raise ArgumentError, "#{val} is not a valid value for :#{key}. Use one of  #{MAPPINGS[key]}" unless MAPPINGS[key].include?(val)
+        end
+      end
+    end
+  end
+end

data/app/lib/primer/tabbed_component_helper.rb

@@ -16,6 +16,10 @@ module Primer
 
     private
 
+    def navigation_tag(with_panel)
+      with_panel ? :div : :nav
+    end
+
     def wrapper
       return yield unless @with_panel
 

data/lib/primer/view_components/version.rb

@@ -5,7 +5,7 @@ module Primer
     module VERSION
       MAJOR = 0
       MINOR = 0
-      PATCH = 33
+      PATCH = 38
 
       STRING = [MAJOR, MINOR, PATCH].join(".")
     end

data/static/statuses.json

@@ -1 +1 @@
-{"Primer::AutoCompleteComponent":"alpha","Primer::AutoCompleteItemComponent":"alpha","Primer::AvatarComponent":"beta","Primer::AvatarStackComponent":"alpha","Primer::BaseComponent":"beta","Primer::BlankslateComponent":"beta","Primer::BorderBoxComponent":"beta","Primer::BoxComponent":"stable","Primer::BreadcrumbComponent":"beta","Primer::BreadcrumbComponent::ItemComponent":"alpha","Primer::ButtonComponent":"alpha","Primer::ButtonGroupComponent":"alpha","Primer::ButtonMarketingComponent":"alpha","Primer::CounterComponent":"beta","Primer::DetailsComponent":"beta","Primer::Dropdown::MenuComponent":"alpha","Primer::DropdownComponent":"alpha","Primer::DropdownMenuComponent":"deprecated","Primer::FlashComponent":"beta","Primer::FlexComponent":"alpha","Primer::FlexItemComponent":"alpha","Primer::HeadingComponent":"beta","Primer::LabelComponent":"beta","Primer::LayoutComponent":"alpha","Primer::LinkComponent":"beta","Primer::MarkdownComponent":"alpha","Primer::MenuComponent":"alpha","Primer::Navigation::TabComponent":"alpha","Primer::OcticonComponent":"beta","Primer::PopoverComponent":"beta","Primer::ProgressBarComponent":"beta","Primer::SpinnerComponent":"beta","Primer::StateComponent":"beta","Primer::SubheadComponent":"beta","Primer::TabContainerComponent":"alpha","Primer::TabNavComponent":"alpha","Primer::TextComponent":"beta","Primer::TimeAgoComponent":"beta","Primer::TimelineItemComponent":"beta","Primer::TimelineItemComponent::BadgeComponent":"alpha","Primer::TooltipComponent":"alpha","Primer::TruncateComponent":"alpha","Primer::UnderlineNavComponent":"alpha"}
+{"Primer::AutoComplete":"beta","Primer::AutoComplete::Item":"beta","Primer::AvatarComponent":"beta","Primer::AvatarStackComponent":"beta","Primer::BaseButton":"beta","Primer::BaseComponent":"beta","Primer::BlankslateComponent":"beta","Primer::BorderBoxComponent":"beta","Primer::BoxComponent":"stable","Primer::BreadcrumbComponent":"beta","Primer::BreadcrumbComponent::ItemComponent":"alpha","Primer::ButtonComponent":"beta","Primer::ButtonGroup":"beta","Primer::ButtonMarketingComponent":"alpha","Primer::ClipboardCopy":"alpha","Primer::CloseButton":"alpha","Primer::CounterComponent":"beta","Primer::DetailsComponent":"beta","Primer::Dropdown::MenuComponent":"alpha","Primer::DropdownComponent":"alpha","Primer::DropdownMenuComponent":"deprecated","Primer::FlashComponent":"beta","Primer::FlexComponent":"alpha","Primer::FlexItemComponent":"alpha","Primer::HeadingComponent":"beta","Primer::HiddenTextExpander":"alpha","Primer::LabelComponent":"beta","Primer::LayoutComponent":"alpha","Primer::LinkComponent":"beta","Primer::MarkdownComponent":"alpha","Primer::MenuComponent":"alpha","Primer::Navigation::TabComponent":"alpha","Primer::OcticonComponent":"beta","Primer::PopoverComponent":"beta","Primer::ProgressBarComponent":"beta","Primer::SpinnerComponent":"beta","Primer::StateComponent":"beta","Primer::SubheadComponent":"beta","Primer::TabContainerComponent":"alpha","Primer::TabNavComponent":"alpha","Primer::TextComponent":"beta","Primer::TimeAgoComponent":"beta","Primer::TimelineItemComponent":"beta","Primer::TimelineItemComponent::BadgeComponent":"alpha","Primer::TooltipComponent":"alpha","Primer::Truncate":"beta","Primer::UnderlineNavComponent":"alpha"}

metadata

@@ -1,45 +1,36 @@
 --- !ruby/object:Gem::Specification
 name: primer_view_components
 version: !ruby/object:Gem::Version
-  version: 0.0.33
+  version: 0.0.38
 platform: ruby
 authors:
 - GitHub Open Source
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2021-03-26 00:00:00.000000000 Z
+date: 2021-04-26 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
-  name: octicons_helper
+  name: actionview
   requirement: !ruby/object:Gem::Requirement
     requirements:
     - - ">="
       - !ruby/object:Gem::Version
-        version: 9.0.0
-    - - "<"
-      - !ruby/object:Gem::Version
-        version: 13.0.0
+        version: 5.0.0
   type: :runtime
   prerelease: false
   version_requirements: !ruby/object:Gem::Requirement
     requirements:
     - - ">="
       - !ruby/object:Gem::Version
-        version: 9.0.0
-    - - "<"
-      - !ruby/object:Gem::Version
-        version: 13.0.0
+        version: 5.0.0
 - !ruby/object:Gem::Dependency
-  name: rails
+  name: activesupport
   requirement: !ruby/object:Gem::Requirement
     requirements:
     - - ">="
       - !ruby/object:Gem::Version
         version: 5.0.0
-    - - "<"
-      - !ruby/object:Gem::Version
-        version: '7.0'
   type: :runtime
   prerelease: false
   version_requirements: !ruby/object:Gem::Requirement
@@ -47,9 +38,20 @@ dependencies:
     - - ">="
       - !ruby/object:Gem::Version
         version: 5.0.0
-    - - "<"
+- !ruby/object:Gem::Dependency
+  name: octicons_helper
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
       - !ruby/object:Gem::Version
-        version: '7.0'
+        version: 13.0.0
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: 13.0.0
 - !ruby/object:Gem::Dependency
   name: view_component
   requirement: !ruby/object:Gem::Requirement
@@ -98,6 +100,34 @@ dependencies:
     - - "~>"
       - !ruby/object:Gem::Version
         version: 2.8.4
+- !ruby/object:Gem::Dependency
+  name: capybara
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '3'
+  type: :development
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '3'
+- !ruby/object:Gem::Dependency
+  name: cuprite
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - '='
+      - !ruby/object:Gem::Version
+        version: '0.11'
+  type: :development
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - '='
+      - !ruby/object:Gem::Version
+        version: '0.11'
 - !ruby/object:Gem::Dependency
   name: listen
   requirement: !ruby/object:Gem::Requirement
@@ -116,16 +146,16 @@ dependencies:
   name: minitest
   requirement: !ruby/object:Gem::Requirement
     requirements:
-    - - '='
+    - - "~>"
       - !ruby/object:Gem::Version
-        version: 5.6.0
+        version: '5.0'
   type: :development
   prerelease: false
   version_requirements: !ruby/object:Gem::Requirement
     requirements:
-    - - '='
+    - - "~>"
       - !ruby/object:Gem::Version
-        version: 5.6.0
+        version: '5.0'
 - !ruby/object:Gem::Dependency
   name: mocha
   requirement: !ruby/object:Gem::Requirement
@@ -224,6 +254,48 @@ dependencies:
     - - "~>"
       - !ruby/object:Gem::Version
         version: 0.7.2
+- !ruby/object:Gem::Dependency
+  name: sprockets
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '0'
+  type: :development
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '0'
+- !ruby/object:Gem::Dependency
+  name: sprockets-rails
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '0'
+  type: :development
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '0'
+- !ruby/object:Gem::Dependency
+  name: thor
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '0'
+  type: :development
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '0'
 - !ruby/object:Gem::Dependency
   name: yard
   requirement: !ruby/object:Gem::Requirement
@@ -250,17 +322,18 @@ files:
 - README.md
 - app/assets/javascripts/primer_view_components.js
 - app/assets/javascripts/primer_view_components.js.map
-- app/assets/javascripts/primer_view_components.js.map.orig
-- app/assets/javascripts/primer_view_components.js.orig
-- app/components/primer/auto_complete_component.d.ts
-- app/components/primer/auto_complete_component.html.erb
-- app/components/primer/auto_complete_component.js
-- app/components/primer/auto_complete_component.rb
-- app/components/primer/auto_complete_component.ts
-- app/components/primer/auto_complete_item_component.rb
+- app/components/primer/auto_complete.rb
+- app/components/primer/auto_complete/auto_complete.d.ts
+- app/components/primer/auto_complete/auto_complete.html.erb
+- app/components/primer/auto_complete/auto_complete.js
+- app/components/primer/auto_complete/auto_complete.ts
+- app/components/primer/auto_complete/auto_component.d.ts
+- app/components/primer/auto_complete/auto_component.js
+- app/components/primer/auto_complete/item.rb
 - app/components/primer/avatar_component.rb
 - app/components/primer/avatar_stack_component.html.erb
 - app/components/primer/avatar_stack_component.rb
+- app/components/primer/base_button.rb
 - app/components/primer/base_component.rb
 - app/components/primer/blankslate_component.html.erb
 - app/components/primer/blankslate_component.rb
@@ -270,9 +343,16 @@ files:
 - app/components/primer/breadcrumb_component.html.erb
 - app/components/primer/breadcrumb_component.rb
 - app/components/primer/button_component.rb
-- app/components/primer/button_group_component.html.erb
-- app/components/primer/button_group_component.rb
+- app/components/primer/button_component.rb.orig
+- app/components/primer/button_group.html.erb
+- app/components/primer/button_group.rb
 - app/components/primer/button_marketing_component.rb
+- app/components/primer/clipboard_copy.html.erb
+- app/components/primer/clipboard_copy.rb
+- app/components/primer/clipboard_copy_component.d.ts
+- app/components/primer/clipboard_copy_component.js
+- app/components/primer/clipboard_copy_component.ts
+- app/components/primer/close_button.rb
 - app/components/primer/component.rb
 - app/components/primer/counter_component.rb
 - app/components/primer/details_component.html.erb
@@ -287,7 +367,10 @@ files:
 - app/components/primer/flash_component.rb
 - app/components/primer/flex_component.rb
 - app/components/primer/flex_item_component.rb
+- app/components/primer/foo_bar.d.ts
+- app/components/primer/foo_bar.js
 - app/components/primer/heading_component.rb
+- app/components/primer/hidden_text_expander.rb
 - app/components/primer/label_component.rb
 - app/components/primer/layout_component.html.erb
 - app/components/primer/layout_component.rb
@@ -324,7 +407,7 @@ files:
 - app/components/primer/timeline_item_component.html.erb
 - app/components/primer/timeline_item_component.rb
 - app/components/primer/tooltip_component.rb
-- app/components/primer/truncate_component.rb
+- app/components/primer/truncate.rb
 - app/components/primer/underline_nav_component.html.erb
 - app/components/primer/underline_nav_component.rb
 - app/lib/primer/class_name_helper.rb
@@ -334,6 +417,7 @@ files:
 - app/lib/primer/classify/functional_border_colors.rb
 - app/lib/primer/classify/functional_colors.rb
 - app/lib/primer/classify/functional_text_colors.rb
+- app/lib/primer/classify/spacing.rb
 - app/lib/primer/fetch_or_fallback_helper.rb
 - app/lib/primer/join_style_arguments_helper.rb
 - app/lib/primer/status/dsl.rb