primer_view_components 0.0.62 → 0.0.63

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: adce588d18cdf5a429f1cfbf22474252e3bfb96e929c7a991590069b38d7a8c6
-  data.tar.gz: d7c0ada1fa78d39d82b7beb6ef90b1900b923a4fcc0a401f5dc14a0f7e8d157e
+  metadata.gz: 3512259d91cf17fa6a17c0cb75037b3bc438d14ea16da0d8190d6fa7988d4c6e
+  data.tar.gz: d0a59b08f193f263b5261c94923d48f613090128e898588b3f1a8132ae7cff63
 SHA512:
-  metadata.gz: 1d7a91266039e243395f6a630a1fa7838e1ca8cc6a038e66f22ad286e2b80e7c937408ce6f2f71bd3c2474680818d2a6fd0017a1ccc390432a83a331564309c8
-  data.tar.gz: 4f9d8101365c03c8fe01cd9b18da13ea6d602e93469511dd3d8b0792861f8d9f34a78b4a6137e6d80ebfa67c0387e46dd3fd391c6547cf232accc24536310b21
+  metadata.gz: 20ff155c9aad794c3712b478cedfba3abf2d83888a5b4c20af97600cfc4a2000173582585d1c9656806636f499b2c57505ab609352bc00cfa678bb980030fef7
+  data.tar.gz: 0da39969c71bcf2c102606f633d31ff213ade782744df47022c7a09d1178d0c4dc161d4b9c5f03848f5f8ec3c6cac63acc43b3e8d3563b106429800a02147667

data/CHANGELOG.md

@@ -30,6 +30,34 @@ The category for changes related to documentation, testing and tooling. Also, fo
 
 ## main
 
+## 0.0.63
+
+### Breaking Changes
+
+* Rename `caret` argument to `dropdown` in `ButtonComponent`.
+
+    *Manuel Puyol*
+
+* Remove `:large` variant from `ButtonComponent`.
+
+    *Manuel Puyol*
+
+* Update `Spinner` to add system arguments to outermost element
+
+    *Charlotte Dann*
+
+### Deprecations
+
+* Deprecate `icon` and `counter` slots in `ButtonComponent` in favor of `leading_visual` and `trailing_visual`.
+
+    *Manuel Puyol*
+
+### Bug Fixes
+
+* Fix `PopoverComponent`, allowing to reset `left` and `right` positioning.
+
+    *Manuel Puyol*
+
 ## 0.0.62
 
 ### New
@@ -60,11 +88,11 @@ The category for changes related to documentation, testing and tooling. Also, fo
 
 ### Breaking Changes
 
-* Add a warning to users if they try to use `tag:` parameters on a component where the tag is fixed
+* Add a warning to users if they try to use `tag:` parameters on a component where the tag is fixed.
 
     *Owen Niblock*
 
-* Updating to @primer/css@19.0.0 and @primer/primitives@7.1.0. Which removes support for deprecated system color arguments
+* Updating to @primer/css@19.0.0 and @primer/primitives@7.1.0. Which removes support for deprecated system color arguments.
 
     *Jon Rohan*
 

data/app/components/primer/beta/blankslate.rb

@@ -9,8 +9,6 @@ module Primer
     #   - `secondary_action` can be set to provide more information that is relevant in the context of the `Blankslate`.
     #   - `secondary_action` text should be meaningful out of context and clearly describe the destination. Avoid using vague text like, "Learn more" or "Click here".
     class Blankslate < Primer::Component
-      include ViewComponent::PolymorphicSlots
-
       status :beta
 
       VISUAL_OPTIONS = %i[icon spinner image].freeze

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

@@ -1,3 +1,3 @@
 <%= render Primer::BaseButton.new(**@system_arguments) do -%>
-  <%= icon %><%= trimmed_content %><%= counter %><%= primer_octicon("triangle-down", mr: -1) if @caret %>
+  <%= leading_visual %><%= trimmed_content %><%= trailing_visual %><%= primer_octicon("triangle-down", mr: -1) if @dropdown %>
 <% end -%>

data/app/components/primer/button_component.rb

@@ -20,28 +20,41 @@ module Primer
     DEFAULT_VARIANT = :medium
     VARIANT_MAPPINGS = {
       :small => "btn-sm",
-      DEFAULT_VARIANT => "",
-      :large => "btn-large"
+      DEFAULT_VARIANT => ""
     }.freeze
     VARIANT_OPTIONS = VARIANT_MAPPINGS.keys
 
-    # Icon to be rendered in the button.
+    # Leading visuals appear to the left of the button text.
+    #
+    # Use:
+    #
+    # - `leading_visual_icon` for a <%= link_to_component(Primer::OcticonComponent) %>.
     #
     # @param system_arguments [Hash] Same arguments as <%= link_to_component(Primer::OcticonComponent) %>.
-    renders_one :icon, lambda { |**system_arguments|
-      system_arguments[:mr] = 2
+    renders_one :leading_visual, types: {
+      icon: lambda { |**system_arguments|
+        system_arguments[:mr] = 2
 
-      Primer::OcticonComponent.new(**system_arguments)
+        Primer::OcticonComponent.new(**system_arguments)
+      }
     }
+    alias icon leading_visual_icon # remove alias when all buttons are migrated to new slot names
 
-    # Counter to be rendered in the button.
+    # Trailing visuals appear to the right of the button text.
+    #
+    # Use:
+    #
+    # - `trailing_visual_counter` for a <%= link_to_component(Primer::CounterComponent) %>.
     #
     # @param system_arguments [Hash] Same arguments as <%= link_to_component(Primer::CounterComponent) %>.
-    renders_one :counter, lambda { |**system_arguments|
-      system_arguments[:ml] = 2
+    renders_one :trailing_visual, types: {
+      counter: lambda { |**system_arguments|
+        system_arguments[:ml] = 2
 
-      Primer::CounterComponent.new(**system_arguments)
+        Primer::CounterComponent.new(**system_arguments)
+      }
     }
+    alias counter trailing_visual_counter # remove alias when all buttons are migrated to new slot names
 
     # @example Schemes
     #   <%= render(Primer::ButtonComponent.new) { "Default" } %>
@@ -54,33 +67,32 @@ module Primer
     # @example Variants
     #   <%= render(Primer::ButtonComponent.new(variant: :small)) { "Small" } %>
     #   <%= render(Primer::ButtonComponent.new(variant: :medium)) { "Medium" } %>
-    #   <%= render(Primer::ButtonComponent.new(variant: :large)) { "Large" } %>
     #
     # @example Block
     #   <%= render(Primer::ButtonComponent.new(block: :true)) { "Block" } %>
     #   <%= render(Primer::ButtonComponent.new(block: :true, scheme: :primary)) { "Primary block" } %>
     #
-    # @example With icons
+    # @example With leading visual
     #   <%= render(Primer::ButtonComponent.new) do |c| %>
-    #     <% c.icon(icon: :star) %>
+    #     <% c.leading_visual_icon(icon: :star) %>
     #     Button
     #   <% end %>
     #
-    # @example With counter
+    # @example With trailing visual
     #   <%= render(Primer::ButtonComponent.new) do |c| %>
-    #     <% c.counter(count: 15) %>
+    #     <% c.trailing_visual_counter(count: 15) %>
     #     Button
     #   <% end %>
     #
-    # @example With icons and counter
+    # @example With leading and trailing visuals
     #   <%= render(Primer::ButtonComponent.new) do |c| %>
-    #     <% c.icon(icon: :star) %>
-    #     <% c.counter(count: 15) %>
+    #     <% c.leading_visual_icon(icon: :star) %>
+    #     <% c.trailing_visual_counter(count: 15) %>
     #     Button
     #   <% end %>
     #
-    # @example With caret
-    #   <%= render(Primer::ButtonComponent.new(caret: true)) do %>
+    # @example With dropdown caret
+    #   <%= render(Primer::ButtonComponent.new(dropdown: true)) do %>
     #     Button
     #   <% end %>
     #
@@ -90,18 +102,18 @@ module Primer
     # @param type [Symbol] (Primer::BaseButton::DEFAULT_TYPE) <%= one_of(Primer::BaseButton::TYPE_OPTIONS) %>
     # @param group_item [Boolean] Whether button is part of a ButtonGroup.
     # @param block [Boolean] Whether button is full-width with `display: block`.
-    # @param caret [Boolean] Whether or not to render a caret.
+    # @param dropdown [Boolean] Whether or not to render a dropdown caret.
     # @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
     def initialize(
       scheme: DEFAULT_SCHEME,
       variant: DEFAULT_VARIANT,
       group_item: false,
       block: false,
-      caret: false,
+      dropdown: false,
       **system_arguments
     )
       @scheme = scheme
-      @caret = caret
+      @dropdown = dropdown
 
       @system_arguments = system_arguments
       @system_arguments[:classes] = class_names(

data/app/components/primer/button_group.rb

@@ -34,13 +34,6 @@ module Primer
     #     <% component.button(scheme: :outline) { "Outline" } %>
     #   <% end %>
     #
-    #   <%= render(Primer::ButtonGroup.new(variant: :large)) do |component| %>
-    #     <% component.button { "Default" } %>
-    #     <% component.button(scheme: :primary) { "Primary" } %>
-    #     <% component.button(scheme: :danger) { "Danger" } %>
-    #     <% component.button(scheme: :outline) { "Outline" } %>
-    #   <% end %>
-    #
     # @param variant [Symbol] <%= one_of(Primer::ButtonComponent::VARIANT_OPTIONS) %>
     # @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
     def initialize(variant: Primer::ButtonComponent::DEFAULT_VARIANT, **system_arguments)

data/app/components/primer/component.rb

@@ -6,6 +6,7 @@ module Primer
   # @private
   class Component < ViewComponent::Base
     include ViewComponent::SlotableV2 unless ViewComponent::Base < ViewComponent::SlotableV2
+    include ViewComponent::PolymorphicSlots
     include ClassNameHelper
     include FetchOrFallbackHelper
     include TestSelectorHelper

data/app/components/primer/dropdown.rb

@@ -9,7 +9,7 @@ module Primer
     renders_one :button, lambda { |**system_arguments, &block|
       @button_arguments = system_arguments
       @button_arguments[:button] = true
-      @button_arguments[:caret] = @with_caret
+      @button_arguments[:dropdown] = @with_caret
 
       view_context.capture { block&.call }
     }

data/app/components/primer/popover_component.rb

@@ -115,8 +115,8 @@ module Primer
         "Popover"
       )
       @system_arguments[:position] ||= :relative
-      @system_arguments[:right] = false unless system_arguments.key?(:right)
-      @system_arguments[:left] = false unless system_arguments.key?(:left)
+      @system_arguments[:right] = false unless @system_arguments.delete(:right)
+      @system_arguments[:left] = false unless @system_arguments.delete(:left)
     end
 
     def render?

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

@@ -1,7 +1,15 @@
-<span role="status">
+<%= render Primer::BaseComponent.new(**@system_arguments) do %>
   <span class="sr-only">Loading</span>
-  <%= render Primer::BaseComponent.new(**@system_arguments) do %>
+  <%= render Primer::BaseComponent.new(
+    tag: :svg,
+    viewBox: '0 0 16 16',
+    fill: :none,
+    animation: :rotate,
+    width: @size,
+    height: @size,
+    vertical_align: :bottom
+  ) do %>
     <circle cx="8" cy="8" r="7" stroke="currentColor" stroke-opacity="0.25" stroke-width="2" vector-effect="non-scaling-stroke" />
     <path d="M15 8a7.002 7.002 0 00-7-7" stroke="currentColor" stroke-width="2" stroke-linecap="round" vector-effect="non-scaling-stroke" />
   <% end %>
-</span>
+<% end %>

data/app/components/primer/spinner_component.rb

@@ -31,13 +31,12 @@ module Primer
     # @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
     def initialize(size: DEFAULT_SIZE, style: DEFAULT_STYLE, **system_arguments)
       @system_arguments = deny_tag_argument(**system_arguments)
-      @system_arguments[:tag] = :svg
+      @system_arguments[:tag] = :span
+      @system_arguments[:role] = :status
+      @system_arguments[:display] = :inline_block
       @system_arguments[:style] ||= style
-      @system_arguments[:animation] = :rotate
-      @system_arguments[:width] = SIZE_MAPPINGS[fetch_or_fallback(SIZE_OPTIONS, size, DEFAULT_SIZE)]
-      @system_arguments[:height] = SIZE_MAPPINGS[fetch_or_fallback(SIZE_OPTIONS, size, DEFAULT_SIZE)]
-      @system_arguments[:viewBox] = "0 0 16 16"
-      @system_arguments[:fill] = :none
+
+      @size = SIZE_MAPPINGS[fetch_or_fallback(SIZE_OPTIONS, size, DEFAULT_SIZE)]
     end
   end
 end

data/lib/primer/classify/utilities.yml

@@ -1497,15 +1497,23 @@
   :normal:
   - text-normal
 :top:
+  0:
+  - top-0
   false:
   - top-0
 :bottom:
+  0:
+  - bottom-0
   false:
   - bottom-0
 :left:
+  0:
+  - left-0
   false:
   - left-0
 :right:
+  0:
+  - right-0
   false:
   - right-0
 :underline:

data/lib/primer/view_components/version.rb

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

data/lib/tasks/custom_utilities.yml

@@ -18,17 +18,25 @@
   :normal:
   - text-normal
 :top:
+  0:
+  - top-0
   false:
   - top-0
 :bottom:
+  0:
+  - bottom-0
   false:
   - bottom-0
 :left:
+  0:
+  - left-0
   false:
   - left-0
 :right:
+  0:
+  - right-0
   false:
-    - right-0
+  - right-0
 :underline:
   true:
   - text-underline

data/static/arguments.yml

@@ -326,7 +326,7 @@
   - name: variant
     type: Symbol
     default: "`:medium`"
-    description: One of `:large`, `:medium`, or `:small`.
+    description: One of `:medium` and `:small`.
   - name: tag
     type: Symbol
     default: "`:button`"
@@ -343,10 +343,10 @@
     type: Boolean
     default: "`false`"
     description: 'Whether button is full-width with `display: block`.'
-  - name: caret
+  - name: dropdown
     type: Boolean
     default: "`false`"
-    description: Whether or not to render a caret.
+    description: Whether or not to render a dropdown caret.
   - name: system_arguments
     type: Hash
     default: N/A
@@ -357,7 +357,7 @@
   - name: variant
     type: Symbol
     default: "`:medium`"
-    description: One of `:large`, `:medium`, or `:small`.
+    description: One of `:medium` and `:small`.
   - name: system_arguments
     type: Hash
     default: N/A

data/static/classes.yml

@@ -96,7 +96,6 @@
 - ".btn-block"
 - ".btn-danger"
 - ".btn-invisible"
-- ".btn-large"
 - ".btn-large-mktg"
 - ".btn-link"
 - ".btn-mktg"
@@ -203,3 +202,4 @@
 - ".tooltipped-n"
 - ".tooltipped-no-delay"
 - ".tooltipped-s"
+- ".v-align-bottom"

data/static/constants.json

@@ -299,13 +299,11 @@
     ],
     "VARIANT_MAPPINGS": {
       "small": "btn-sm",
-      "medium": "",
-      "large": "btn-large"
+      "medium": ""
     },
     "VARIANT_OPTIONS": [
       "small",
-      "medium",
-      "large"
+      "medium"
     ]
   },
   "Primer::ButtonGroup": {

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: primer_view_components
 version: !ruby/object:Gem::Version
-  version: 0.0.62
+  version: 0.0.63
 platform: ruby
 authors:
 - GitHub Open Source
-autorequire:
+autorequire: 
 bindir: bin
 cert_chain: []
-date: 2021-12-02 00:00:00.000000000 Z
+date: 2021-12-03 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: actionview
@@ -366,7 +366,7 @@ dependencies:
     - - "~>"
       - !ruby/object:Gem::Version
         version: 0.9.25
-description:
+description: 
 email:
 - opensource+primer_view_components@github.com
 executables: []
@@ -391,10 +391,6 @@ files:
 - app/components/primer/alpha/underline_nav.rb
 - app/components/primer/alpha/underline_panels.html.erb
 - app/components/primer/alpha/underline_panels.rb
-- app/components/primer/auto_complete/auto_complete.d.ts
-- app/components/primer/auto_complete/auto_complete.js
-- app/components/primer/auto_complete/auto_component.d.ts
-- app/components/primer/auto_complete/auto_component.js
 - app/components/primer/base_button.rb
 - app/components/primer/base_component.rb
 - app/components/primer/beta/auto_complete.rb
@@ -573,7 +569,7 @@ licenses:
 - MIT
 metadata:
   allowed_push_host: https://rubygems.org
-post_install_message:
+post_install_message: 
 rdoc_options: []
 require_paths:
 - lib
@@ -588,8 +584,8 @@ required_rubygems_version: !ruby/object:Gem::Requirement
     - !ruby/object:Gem::Version
       version: '0'
 requirements: []
-rubygems_version: 3.1.2
-signing_key:
+rubygems_version: 3.1.6
+signing_key: 
 specification_version: 4
 summary: ViewComponents for the Primer Design System
 test_files: []

data/app/components/primer/auto_complete/auto_complete.d.ts

@@ -1 +0,0 @@
-import '@github/auto-complete-element';

data/app/components/primer/auto_complete/auto_complete.js

@@ -1 +0,0 @@
-import '@github/auto-complete-element';

data/app/components/primer/auto_complete/auto_component.d.ts

@@ -1 +0,0 @@
-import '@github/auto-complete-element';

data/app/components/primer/auto_complete/auto_component.js

@@ -1 +0,0 @@
-import '@github/auto-complete-element';