primer_view_components 0.0.68 → 0.0.71

data/app/components/primer/link_component.erb

@@ -0,0 +1,4 @@
+<%= render Primer::BaseComponent.new(**@system_arguments) do %>
+  <%= content %>
+  <%= tooltip %>
+<% end %>

data/app/components/primer/link_component.rb

@@ -15,6 +15,23 @@ module Primer
     DEFAULT_TAG = :a
     TAG_OPTIONS = [DEFAULT_TAG, :span].freeze
 
+    # `Tooltip` that appears on mouse hover or keyboard focus over the link. Use tooltips sparingly and as a last resort.
+    # **Important:** This tooltip defaults to `type: :description`. In a few scenarios, `type: :label` may be more appropriate.
+    # Consult the <%= link_to_component(Primer::Alpha::Tooltip) %> documentation for more information.
+    #
+    # @param type [Symbol] (:description) <%= one_of(Primer::Alpha::Tooltip::TYPE_OPTIONS) %>
+    # @param system_arguments [Hash] Same arguments as <%= link_to_component(Primer::Alpha::Tooltip) %>.
+    renders_one :tooltip, lambda { |**system_arguments|
+      raise ArgumentError, "Links with a tooltip must have a unique `id` set on the `LinkComponent`." if @id.blank? && !Rails.env.production?
+
+      @system_arguments = system_arguments
+
+      @system_arguments[:for_id] = @id
+      @system_arguments[:type] ||= :description
+
+      Primer::Alpha::Tooltip.new(**@system_arguments)
+    }
+
     # @example Default
     #   <%= render(Primer::LinkComponent.new(href: "#")) { "Link" } %>
     #
@@ -31,6 +48,15 @@ module Primer
     # @example Span as link
     #   <%= render(Primer::LinkComponent.new(tag: :span)) { "Span as a link" } %>
     #
+    # @example With tooltip
+    #   @description
+    #     Use tooltips sparingly and as a last resort. Consult the <%= link_to_component(Primer::Alpha::Tooltip) %> documentation for more information.
+    #   @code
+    #     <%= render(Primer::LinkComponent.new(href: "#", id: "link-with-tooltip")) do |c| %>
+    #       <% c.tooltip(text: "Tooltip text") %>
+    #       Link
+    #     <% end %>
+    #
     # @param tag [String]  <%= one_of(Primer::LinkComponent::TAG_OPTIONS) %>
     # @param href [String] URL to be used for the Link. Required if tag is `:a`. If the requirements are not met an error will be raised in non production environments. In production, an empty link element will be rendered.
     # @param scheme [Symbol] <%= one_of(Primer::LinkComponent::SCHEME_MAPPINGS.keys) %>
@@ -39,6 +65,9 @@ module Primer
     # @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
     def initialize(href: nil, tag: DEFAULT_TAG, scheme: DEFAULT_SCHEME, muted: false, underline: true, **system_arguments)
       @system_arguments = system_arguments
+
+      @id = @system_arguments[:id]
+
       @system_arguments[:tag] = fetch_or_fallback(TAG_OPTIONS, tag, DEFAULT_TAG)
       @system_arguments[:href] = href
       @system_arguments[:classes] = class_names(
@@ -50,10 +79,6 @@ module Primer
       )
     end
 
-    def call
-      render(Primer::BaseComponent.new(**@system_arguments)) { content }
-    end
-
     def before_render
       raise ArgumentError, "href is required when using <a> tag" if @system_arguments[:tag] == :a && @system_arguments[:href].nil? && !Rails.env.production?
     end

data/app/components/primer/markdown.rb

@@ -93,7 +93,7 @@ module Primer
     #     <ol>
     #       <li>Michael Jackson</li>
     #       <li>Michael Bolton</li>
-    #       <li>Michael Buble</li>
+    #       <li>Michael Bublé</li>
     #     </ol>
     #
     #     <p>And an unordered task list:</p>

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

@@ -5,3 +5,4 @@ import './time_ago_component';
 import './local_time';
 import './image_crop';
 import './dropdown';
+import './alpha/tooltip';

data/app/components/primer/primer.js

@@ -5,3 +5,4 @@ import './time_ago_component';
 import './local_time';
 import './image_crop';
 import './dropdown';
+import './alpha/tooltip';

data/app/components/primer/primer.ts

@@ -5,3 +5,4 @@ import './time_ago_component'
 import './local_time'
 import './image_crop'
 import './dropdown'
+import './alpha/tooltip'

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

@@ -1,5 +1,5 @@
 <%= render Primer::BaseComponent.new(**@system_arguments) do %>
   <%= heading %>
-  <%= actions %>
   <%= description %>
+  <%= actions %>
 <% end %>

data/app/components/primer/subhead_component.rb

@@ -4,7 +4,7 @@ module Primer
   # Use `Subhead` as the start of a section. The `:heading` slot will render an `<h2>` font-sized text.
   #
   # - Optionally set the `:description` slot to render a short description and the `:actions` slot for a related action.
-  # - Use a succint, one-line description for the `:description` slot. For longer descriptions, omit the description slot and render a paragraph below the `Subhead`.
+  # - Use a succinct, one-line description for the `:description` slot. For longer descriptions, omit the description slot and render a paragraph below the `Subhead`.
   # - Use the actions slot to render a related action to the right of the heading. Use <%= link_to_component(Primer::ButtonComponent) %> or <%= link_to_component(Primer::LinkComponent) %>.
   #
   # @accessibility

data/lib/primer/classify/utilities.yml

@@ -39,6 +39,10 @@
   - color-fg-severe
   :danger:
   - color-fg-danger
+  :open:
+  - color-fg-open
+  :closed:
+  - color-fg-closed
   :done:
   - color-fg-done
   :sponsors:
@@ -78,6 +82,14 @@
   - color-bg-danger
   :danger_emphasis:
   - color-bg-danger-emphasis
+  :open:
+  - color-bg-open
+  :open_emphasis:
+  - color-bg-open-emphasis
+  :closed:
+  - color-bg-closed
+  :closed_emphasis:
+  - color-bg-closed-emphasis
   :done:
   - color-bg-done
   :done_emphasis:
@@ -86,6 +98,8 @@
   - color-bg-sponsors
   :sponsors_emphasis:
   - color-bg-sponsors-emphasis
+  :transparent:
+  - color-bg-transparent
 :border_color:
   :default:
   - color-border-default
@@ -113,6 +127,14 @@
   - color-border-danger
   :danger_emphasis:
   - color-border-danger-emphasis
+  :open:
+  - color-border-open
+  :open_emphasis:
+  - color-border-open-emphasis
+  :closed:
+  - color-border-closed
+  :closed_emphasis:
+  - color-border-closed-emphasis
   :done:
   - color-border-done
   :done_emphasis:
@@ -1395,6 +1417,12 @@
   - hide-lg
   :xl:
   - hide-xl
+  :whenNarrow:
+  - hide-whenNarrow
+  :whenRegular:
+  - hide-whenRegular
+  :whenWide:
+  - hide-whenWide
 :container:
   :sm:
   - container-sm
@@ -1533,10 +1561,22 @@
 :text_align:
   :right:
   - text-right
+  - text-sm-right
+  - text-md-right
+  - text-lg-right
+  - text-xl-right
   :left:
   - text-left
+  - text-sm-left
+  - text-md-left
+  - text-lg-left
+  - text-xl-left
   :center:
   - text-center
+  - text-sm-center
+  - text-md-center
+  - text-lg-center
+  - text-xl-center
 :font_weight:
   :light:
   - text-light

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

@@ -15,7 +15,7 @@ module ERBLint
         constant: "TAG_OPTIONS"
       ).freeze
 
-      # CloseButton component has preference when this class is seen in conjuction with `btn`.
+      # CloseButton component has preference when this class is seen in conjunction with `btn`.
       DISALLOWED_CLASSES = %w[close-button].freeze
       CLASSES = %w[btn btn-link].freeze
       MESSAGE = "We are migrating buttons to use [Primer::ButtonComponent](https://primer.style/view-components/components/button), please try to use that instead of raw HTML."

data/lib/primer/view_components/version.rb

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

data/lib/rubocop/cop/primer/primer_octicon.rb

@@ -207,7 +207,7 @@ module RuboCop
           return node.source unless node.type == :str
           return ":#{node.value}" unless node.value.include?("-")
 
-          # If the icon contains `-` we need to cast the string as a symbole
+          # If the icon contains `-` we need to cast the string as a symbol
           # E.g: `arrow-down` becomes `:"arrow-down"`
           ":#{node.source}"
         end

data/lib/tasks/custom_utilities.yml

@@ -54,10 +54,22 @@
 :text_align:
   :right:
   - text-right
+  - text-sm-right
+  - text-md-right
+  - text-lg-right
+  - text-xl-right
   :left:
   - text-left
+  - text-sm-left
+  - text-md-left
+  - text-lg-left
+  - text-xl-left
   :center:
   - text-center
+  - text-sm-center
+  - text-md-center
+  - text-lg-center
+  - text-xl-center
 :font_weight:
   :light:
   - text-light

data/lib/tasks/docs.rake

@@ -82,7 +82,8 @@ namespace :docs do
       Primer::Alpha::UnderlineNav,
       Primer::Alpha::UnderlinePanels,
       Primer::Alpha::TabNav,
-      Primer::Alpha::TabPanels
+      Primer::Alpha::TabPanels,
+      Primer::Alpha::Tooltip
     ]
 
     js_components = [
@@ -94,7 +95,10 @@ namespace :docs do
       Primer::TabContainerComponent,
       Primer::TimeAgoComponent,
       Primer::Alpha::UnderlinePanels,
-      Primer::Alpha::TabPanels
+      Primer::Alpha::TabPanels,
+      Primer::Alpha::Tooltip,
+      Primer::ButtonComponent,
+      Primer::LinkComponent
     ]
 
     all_components = Primer::Component.descendants - [Primer::BaseComponent]
@@ -168,12 +172,12 @@ namespace :docs do
         f.puts("| Name | Type | Default | Description |")
         f.puts("| :- | :- | :- | :- |")
 
-        docummented_params = params.map(&:name)
+        documented_params = params.map(&:name)
         component_params = component.instance_method(:initialize).parameters.map { |p| p.last.to_s }
 
-        if (docummented_params & component_params).size != component_params.size
+        if (documented_params & component_params).size != component_params.size
           err = { arguments: {} }
-          (component_params - docummented_params).each do |arg|
+          (component_params - documented_params).each do |arg|
             err[:arguments][arg] = "Not documented"
           end
 

data/lib/tasks/utilities.rake

@@ -86,7 +86,7 @@ namespace :utilities do
         classname.sub!(/^[^-]+-/, "")
       end
 
-      # Change the rest from hypens to underscores
+      # Change the rest from hyphens to underscores
       classname.sub!(/-/, "_")
 
       # convert padding/margin negative values ie n7 to -7

data/static/arguments.yml

@@ -95,6 +95,30 @@
     type: Hash
     default: N/A
     description: "[System arguments](/system-arguments)"
+- component: Tooltip
+  source: https://github.com/primer/view_components/tree/main/app/components/primer/alpha/tooltip.rb
+  parameters:
+  - name: for_id
+    type: String
+    default: N/A
+    description: The ID of the element that the tooltip should be attached to.
+  - name: type
+    type: Symbol
+    default: N/A
+    description: One of `:description` and `:label`.
+  - name: direction
+    type: Symbol
+    default: "`:s`"
+    description: One of `:e`, `:n`, `:ne`, `:nw`, `:s`, `:se`, `:sw`, or `:w`.
+  - name: text
+    type: String
+    default: N/A
+    description: The text content of the tooltip. This should be brief and no longer
+      than a sentence.
+  - name: system_arguments
+    type: Hash
+    default: N/A
+    description: "[System arguments](/system-arguments)"
 - component: UnderlineNav
   source: https://github.com/primer/view_components/tree/main/app/components/primer/alpha/underline_nav.rb
   parameters:
@@ -177,15 +201,33 @@
     type: String
     default: N/A
     description: Id of the input element.
+  - name: input_name
+    type: String
+    default: "`nil`"
+    description: Optional name of the input element, defaults to `input_id` when not
+      set.
   - name: list_id
     type: String
     default: N/A
     description: Id of the list element.
+  - name: with_icon
+    type: Boolean
+    default: "`false`"
+    description: Controls if a search icon is visible, defaults to `false`.
   - name: is_label_visible
     type: Boolean
     default: "`true`"
     description: Controls if the label is visible. If `false`, screen reader only
       text will be added.
+  - name: is_clearable
+    type: Boolean
+    default: "`false`"
+    description: Adds optional clear button.
+  - name: is_label_inline
+    type: Boolean
+    default: "`false`"
+    description: Controls if the label is inline. On smaller screens, label will always
+      become stacked.
   - name: system_arguments
     type: Hash
     default: N/A
@@ -453,7 +495,7 @@
   - name: reset
     type: Boolean
     default: "`false`"
-    description: Defatuls to false. If set to true, it will remove the default caret
+    description: Defaults to false. If set to true, it will remove the default caret
       and remove style from the summary element
   - name: system_arguments
     type: Hash

data/static/audited_at.json

@@ -6,6 +6,7 @@
   "Primer::Alpha::Layout::Sidebar": "",
   "Primer::Alpha::TabNav": "",
   "Primer::Alpha::TabPanels": "",
+  "Primer::Alpha::Tooltip": "",
   "Primer::Alpha::UnderlineNav": "",
   "Primer::Alpha::UnderlinePanels": "",
   "Primer::BaseButton": "",

data/static/classes.yml

@@ -82,7 +82,11 @@
 - ".UnderlineNav-item"
 - ".UnderlineNav-octicon"
 - ".anim-rotate"
+- ".autocomplete-body"
+- ".autocomplete-embedded-icon-wrap"
 - ".autocomplete-item"
+- ".autocomplete-label-inline"
+- ".autocomplete-label-stacked"
 - ".autocomplete-results"
 - ".avatar"
 - ".avatar-more"
@@ -171,6 +175,7 @@
 - ".left-0"
 - ".lh-0"
 - ".list-style-none"
+- ".m-2"
 - ".markdown-body"
 - ".mb-0"
 - ".mb-2"

data/static/constants.json

@@ -138,6 +138,24 @@
       "div"
     ]
   },
+  "Primer::Alpha::Tooltip": {
+    "DIRECTION_DEFAULT": "s",
+    "DIRECTION_OPTIONS": [
+      "s",
+      "n",
+      "e",
+      "w",
+      "ne",
+      "nw",
+      "se",
+      "sw"
+    ],
+    "TYPE_FALLBACK": "description",
+    "TYPE_OPTIONS": [
+      "label",
+      "description"
+    ]
+  },
   "Primer::Alpha::UnderlineNav": {
     "BODY_TAG_DEFAULT": "ul",
     "TAG_DEFAULT": "nav",

data/static/statuses.json

@@ -6,6 +6,7 @@
   "Primer::Alpha::Layout::Sidebar": "alpha",
   "Primer::Alpha::TabNav": "alpha",
   "Primer::Alpha::TabPanels": "alpha",
+  "Primer::Alpha::Tooltip": "alpha",
   "Primer::Alpha::UnderlineNav": "alpha",
   "Primer::Alpha::UnderlinePanels": "alpha",
   "Primer::BaseButton": "beta",

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: primer_view_components
 version: !ruby/object:Gem::Version
-  version: 0.0.68
+  version: 0.0.71
 platform: ruby
 authors:
 - GitHub Open Source
-autorequire: 
+autorequire:
 bindir: bin
 cert_chain: []
-date: 2022-02-23 00:00:00.000000000 Z
+date: 2022-03-31 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: actionview
@@ -42,16 +42,16 @@ dependencies:
   name: octicons
   requirement: !ruby/object:Gem::Requirement
     requirements:
-    - - "~>"
+    - - ">="
       - !ruby/object:Gem::Version
-        version: '16'
+        version: 17.0.0
   type: :runtime
   prerelease: false
   version_requirements: !ruby/object:Gem::Requirement
     requirements:
-    - - "~>"
+    - - ">="
       - !ruby/object:Gem::Version
-        version: '16'
+        version: 17.0.0
 - !ruby/object:Gem::Dependency
   name: view_component
   requirement: !ruby/object:Gem::Requirement
@@ -366,7 +366,7 @@ dependencies:
     - - "~>"
       - !ruby/object:Gem::Version
         version: 0.9.25
-description: 
+description:
 email:
 - opensource+primer_view_components@github.com
 executables: []
@@ -383,10 +383,16 @@ files:
 - app/components/primer/alpha/button_marketing.rb
 - app/components/primer/alpha/layout.html.erb
 - app/components/primer/alpha/layout.rb
+- app/components/primer/alpha/navigation_list_element.d.ts
+- app/components/primer/alpha/navigation_list_element.js
 - app/components/primer/alpha/tab_nav.html.erb
 - app/components/primer/alpha/tab_nav.rb
 - app/components/primer/alpha/tab_panels.html.erb
 - app/components/primer/alpha/tab_panels.rb
+- app/components/primer/alpha/tooltip.d.ts
+- app/components/primer/alpha/tooltip.js
+- app/components/primer/alpha/tooltip.rb
+- app/components/primer/alpha/tooltip.ts
 - app/components/primer/alpha/underline_nav.html.erb
 - app/components/primer/alpha/underline_nav.rb
 - app/components/primer/alpha/underline_panels.html.erb
@@ -458,6 +464,7 @@ files:
 - app/components/primer/label_component.rb
 - app/components/primer/layout_component.html.erb
 - app/components/primer/layout_component.rb
+- app/components/primer/link_component.erb
 - app/components/primer/link_component.rb
 - app/components/primer/local_time.d.ts
 - app/components/primer/local_time.js
@@ -573,7 +580,7 @@ licenses:
 - MIT
 metadata:
   allowed_push_host: https://rubygems.org
-post_install_message: 
+post_install_message:
 rdoc_options: []
 require_paths:
 - lib
@@ -588,8 +595,8 @@ required_rubygems_version: !ruby/object:Gem::Requirement
     - !ruby/object:Gem::Version
       version: '0'
 requirements: []
-rubygems_version: 3.1.6
-signing_key: 
+rubygems_version: 3.2.22
+signing_key:
 specification_version: 4
 summary: ViewComponents for the Primer Design System
 test_files: []