primer_view_components 0.0.47 → 0.0.48

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 1b0ba62c9f5f11df09d24b40ca5e61e7d618046aba651ad733c8db06c482fe26
-  data.tar.gz: 34c0b8066b85d5392dd241baeb3b654ba47d7de1f360b793ac893750989d99dd
+  metadata.gz: 2c751bc60362c19e97ba5fbe22227e19186efa799862932a6f7b8541ad8e1eaa
+  data.tar.gz: 4efd584159e4883f8bcc72954fff356c753b0b8980056ee0c58b7a3bd650cb90
 SHA512:
-  metadata.gz: 47e1bca34582e4406fcc268ac786a322cc3f99a62789aeece262b91e1ca26a15c145835ad60afbcd85a13b3a37da7a54541aedf8e2af5b60c43d7d6cf6767072
-  data.tar.gz: 2edfb035e82896ea22bec576a98b34eb2e3c18cccf2d3ba18744f7b77135f6a1310b466179025c216d396708fdf5fbe802a2dc436c57d1510632eb9567776df1
+  metadata.gz: c6169f90241d046f9cee4faf1fb971cac34360c8ebb116e2c2e39fdd0aeff5e8cca17e899bdd8a97f94ebefa4c3705d6929b0978a96f0264dcab3fa96342faaf
+  data.tar.gz: 8576857a521647f43ccb3fe413b0e24b5d65a8c06e9036dd3035b37d8fb5989aa43a7ac2d33863f5faa022c099c6a8386d30de8b764e19cf93b9dcb207fd4eef

data/CHANGELOG.md

@@ -30,6 +30,24 @@ The category for changes related to documentation, testing and tooling. Also, fo
 
 ## main
 
+## 0.0.48
+
+### Breaking changes
+
+* Ensure panels in `Navigation::Tab` have a label.
+
+    *Kate Higa*
+
+### Misc
+
+* Expose custom cops and default config for erblint.
+
+    *Manuel Puyol*
+
+* Fix double constant assign.
+
+    *Manuel Puyol*
+
 ## 0.0.47
 
 ### Breaking changes

data/app/components/primer/avatar_stack_component.rb

@@ -12,7 +12,7 @@ module Primer
     TAG_OPTIONS = [DEFAULT_TAG, :span].freeze
 
     DEFAULT_BODY_TAG = :div
-    BODY_TAG_OPTIONS = TAG_OPTIONS = [DEFAULT_TAG, :span].freeze
+    BODY_TAG_OPTIONS = [DEFAULT_BODY_TAG, :span].freeze
     # Required list of stacked avatars.
     #
     # @param kwargs [Hash] The same arguments as <%= link_to_component(Primer::Beta::Avatar) %>.

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

@@ -29,7 +29,7 @@ module Primer
       # @param type [Symbol] <%= one_of(Primer::Beta::AutoComplete::Input::TYPE_OPTIONS) %>
       # @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
       renders_one :input, lambda { |**system_arguments|
-        aria_label = system_arguments[:"aria-label"] || system_arguments.dig(:aria, :label) || @aria_label
+        aria_label = aria("label", system_arguments) || @aria_label
         if aria_label.present?
           system_arguments[:"aria-label"] = aria_label
           system_arguments[:aria]&.delete(:label)
@@ -106,7 +106,7 @@ module Primer
       def initialize(src:, list_id:, input_id:, **system_arguments)
         @list_id = list_id
         @input_id = input_id
-        @aria_label = system_arguments[:"aria-label"] || system_arguments.dig(:aria, :label)
+        @aria_label = aria("label", system_arguments)
 
         system_arguments.delete(:"aria-label") && system_arguments[:aria]&.delete(:label)
 

data/app/components/primer/component.rb

@@ -29,8 +29,12 @@ module Primer
       ActiveSupport::Deprecation.warn(message)
     end
 
+    def aria(val, system_arguments)
+      system_arguments[:"aria-#{val}"] || system_arguments.dig(:aria, val.to_sym)
+    end
+
     def validate_aria_label
-      aria_label = @system_arguments[:"aria-label"] || @system_arguments.dig(:aria, :label)
+      aria_label = aria("label", @system_arguments)
       raise ArgumentError, "`aria-label` is required." if aria_label.nil? && !Rails.env.production?
     end
 

data/app/components/primer/navigation/tab_component.rb

@@ -18,10 +18,22 @@ module Primer
       #
       # @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
       renders_one :panel, lambda { |**system_arguments|
+        return unless @with_panel
+
         system_arguments[:tag] = :div
         system_arguments[:role] ||= :tabpanel
+        system_arguments[:tabindex] = 0
         system_arguments[:hidden] = true unless @selected
 
+        label_present = aria("label", system_arguments) || aria("labelledby", system_arguments)
+        unless label_present
+          if @id.present?
+            system_arguments[:"aria-labelledby"] = @id
+          elsif !Rails.env.production?
+            raise ArgumentError, "Panels must be labelled. Either set a unique `id` on the tab, or set an `aria-label` directly on the panel"
+          end
+        end
+
         Primer::BaseComponent.new(**system_arguments)
       }
 
@@ -93,8 +105,10 @@ module Primer
         @selected = selected
         @icon_classes = icon_classes
         @list = list
+        @with_panel = with_panel
 
         @system_arguments = system_arguments
+        @id = @system_arguments[:id]
 
         if with_panel || @system_arguments[:tag] == :button
           @system_arguments[:tag] = :button
@@ -111,7 +125,7 @@ module Primer
         return unless @selected
 
         if @system_arguments[:tag] == :a
-          aria_current = @system_arguments[:"aria-current"] || @system_arguments.dig(:aria, :current) || DEFAULT_ARIA_CURRENT_FOR_ANCHOR
+          aria_current = aria("current", system_arguments) || DEFAULT_ARIA_CURRENT_FOR_ANCHOR
           @system_arguments[:"aria-current"] = fetch_or_fallback(ARIA_CURRENT_OPTIONS_FOR_ANCHOR, aria_current, DEFAULT_ARIA_CURRENT_FOR_ANCHOR)
         else
           @system_arguments[:"aria-selected"] = true

data/app/components/primer/tab_nav_component.rb

@@ -63,19 +63,19 @@ module Primer
     #
     # @example With panels
     #   <%= render(Primer::TabNavComponent.new(label: "With panels", with_panel: true)) do |c| %>
-    #     <% c.tab(selected: true) do |t| %>
+    #     <% c.tab(selected: true, id: "tab-1") do |t| %>
     #       <% t.text { "Tab 1" } %>
     #       <% t.panel do %>
     #         Panel 1
     #       <% end %>
     #     <% end %>
-    #     <% c.tab do |t| %>
+    #     <% c.tab(id: "tab-2") do |t| %>
     #       <% t.text { "Tab 2" } %>
     #       <% t.panel do %>
     #         Panel 2
     #       <% end %>
     #     <% end %>
-    #     <% c.tab do |t| %>
+    #     <% c.tab(id: "tab-3") do |t| %>
     #       <% t.text { "Tab 3" } %>
     #       <% t.panel do %>
     #         Panel 3

data/app/components/primer/underline_nav_component.rb

@@ -104,13 +104,13 @@ module Primer
     #
     # @example With panels
     #   <%= render(Primer::UnderlineNavComponent.new(label: "With panels", with_panel: true)) do |component| %>
-    #     <% component.tab(selected: true) do |t| %>
+    #     <% component.tab(selected: true, id: "tab-1") do |t| %>
     #       <% t.text { "Item 1" } %>
     #       <% t.panel do %>
     #         Panel 1
     #       <% end %>
     #     <% end %>
-    #     <% component.tab do |t| %>
+    #     <% component.tab(id: "tab-2") do |t| %>
     #       <% t.text { "Item 2" } %>
     #       <% t.panel do %>
     #         Panel 2

data/lib/primer/view_components/version.rb

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

data/lib/rubocop/config/default.yml

@@ -0,0 +1,12 @@
+require:
+  - rubocop/cop/primer
+
+AllCops:
+  DisabledByDefault: true
+
+Primer/SystemArgumentInsteadOfClass:
+  Enabled: true
+
+Primer/NoTagMemoize:
+  Enabled: false
+

data/lib/rubocop/cop/primer.rb

@@ -0,0 +1,4 @@
+# frozen_string_literal: true
+
+require "rubocop/cop/primer/no_tag_memoize"
+require "rubocop/cop/primer/system_argument_instead_of_class"

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

@@ -0,0 +1,42 @@
+# frozen_string_literal: true
+
+require "rubocop"
+
+module RuboCop
+  module Cop
+    module Primer
+      # This cop ensures that tags are not set with ||=
+      #
+      # bad
+      # @system_arguments[:tag] ||= :h1
+      #
+      # good
+      # @system_arguments[:tag] = fetch_or_fallback(TAG_OPTIONS, tag, DEFAULT_TAG)
+      #
+      # good
+      # @system_arguments[:tag] = :h2
+      class NoTagMemoize < RuboCop::Cop::Cop
+        INVALID_MESSAGE = <<~STR
+          Avoid `[:tag] ||=`. Instead, try one of the following:
+            - Don't allow consumers to update the tag by having a fixed tag (e.g. `system_arguments[:tag] = :div`)
+            - Use the `fetch_or_fallback` helper to only allow a tag from a restricted list.
+        STR
+
+        def_node_search :tag_memoized?, <<~PATTERN
+          (or-asgn
+            (send
+              _
+              _
+              (sym :tag)
+            )
+            _
+          )
+        PATTERN
+
+        def on_or_asgn(node)
+          add_offense(node, message: INVALID_MESSAGE) if tag_memoized?(node)
+        end
+      end
+    end
+  end
+end

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

@@ -0,0 +1,75 @@
+# frozen_string_literal: true
+
+require "rubocop"
+require "primer/classify/utilities"
+require "primer/view_components/statuses"
+
+module RuboCop
+  module Cop
+    module Primer
+      # This cop ensures that components use System Arguments instead of CSS classes.
+      #
+      # bad
+      # Component.new(classes: "mr-1")
+      #
+      # good
+      # Component.new(mr: 1)
+      class SystemArgumentInsteadOfClass < RuboCop::Cop::Cop
+        INVALID_MESSAGE = <<~STR
+          Avoid using CSS classes when you can use System Arguments: https://primer.style/view-components/system-arguments.
+        STR
+
+        def on_send(node)
+          return unless node.method_name == :new
+          return unless ::Primer::ViewComponents::STATUSES.key?(node.receiver.const_name)
+          return unless node.arguments?
+
+          # we are looking for hash arguments and they are always last
+          kwargs = node.arguments.last
+
+          return unless kwargs.type == :hash
+
+          # find classes pair
+          classes_arg = kwargs.pairs.find { |kwarg| kwarg.key.value == :classes }
+
+          return if classes_arg.nil?
+          return unless classes_arg.value.type == :str
+
+          # get actual classes
+          classes = classes_arg.value.value
+
+          system_arguments = ::Primer::Classify::Utilities.classes_to_hash(classes)
+
+          # no classes are fixable
+          return if system_arguments[:classes] == classes
+
+          add_offense(classes_arg, message: INVALID_MESSAGE)
+        end
+
+        def autocorrect(node)
+          lambda do |corrector|
+            system_arguments = ::Primer::Classify::Utilities.classes_to_hash(node.value.value)
+            corrector.replace(node.loc.expression, arguments_as_string(system_arguments))
+          end
+        end
+
+        private
+
+        def arguments_as_string(system_arguments)
+          system_arguments.map do |key, value|
+            val = case value
+                  when Symbol
+                    ":#{value}"
+                  when String
+                    value.to_json
+                  else
+                    value
+                  end
+
+            "#{key}: #{val}"
+          end.join(", ")
+        end
+      end
+    end
+  end
+end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: primer_view_components
 version: !ruby/object:Gem::Version
-  version: 0.0.47
+  version: 0.0.48
 platform: ruby
 authors:
 - GitHub Open Source
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2021-07-20 00:00:00.000000000 Z
+date: 2021-07-21 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: actionview
@@ -487,6 +487,10 @@ files:
 - lib/primer/view_components/linters/helpers.rb
 - lib/primer/view_components/statuses.rb
 - lib/primer/view_components/version.rb
+- lib/rubocop/config/default.yml
+- lib/rubocop/cop/primer.rb
+- lib/rubocop/cop/primer/no_tag_memoize.rb
+- lib/rubocop/cop/primer/system_argument_instead_of_class.rb
 - lib/tasks/coverage.rake
 - lib/tasks/docs.rake
 - lib/tasks/statuses.rake