primer_view_components 0.1.3 → 0.1.5

data/lib/primer/classify/utilities.yml

@@ -1606,45 +1606,105 @@
 :border:
   :left:
   - border-left
+  - border-sm-left
+  - border-md-left
+  - border-lg-left
+  - border-xl-left
   :top:
   - border-top
+  - border-sm-top
+  - border-md-top
+  - border-lg-top
+  - border-xl-top
   :bottom:
   - border-bottom
+  - border-sm-bottom
+  - border-md-bottom
+  - border-lg-bottom
+  - border-xl-bottom
   :right:
   - border-right
+  - border-sm-right
+  - border-md-right
+  - border-lg-right
+  - border-xl-right
   :y:
   - border-y
   :x:
   - border-x
   true:
   - border
+  - border-sm
+  - border-md
+  - border-lg
+  - border-xl
   0:
   - border-0
+  - border-sm-0
+  - border-md-0
+  - border-lg-0
+  - border-xl-0
   false:
   - border-0
+  - border-sm-0
+  - border-md-0
+  - border-lg-0
+  - border-xl-0
   :dashed:
   - border-dashed
 :border_top:
   0:
   - border-top-0
+  - border-sm-top-0
+  - border-md-top-0
+  - border-lg-top-0
+  - border-xl-top-0
 :border_bottom:
   0:
   - border-bottom-0
+  - border-sm-bottom-0
+  - border-md-bottom-0
+  - border-lg-bottom-0
+  - border-xl-bottom-0
 :border_left:
   0:
   - border-left-0
+  - border-sm-left-0
+  - border-md-left-0
+  - border-lg-left-0
+  - border-xl-left-0
 :border_right:
   0:
   - border-right-0
+  - border-sm-right-0
+  - border-md-right-0
+  - border-lg-right-0
+  - border-xl-right-0
 :border_radius:
   0:
   - rounded-0
+  - rounded-sm-0
+  - rounded-md-0
+  - rounded-lg-0
+  - rounded-xl-0
   1:
   - rounded-1
+  - rounded-sm-1
+  - rounded-md-1
+  - rounded-lg-1
+  - rounded-xl-1
   2:
   - rounded-2
+  - rounded-sm-2
+  - rounded-md-2
+  - rounded-lg-2
+  - rounded-xl-2
   3:
   - rounded-3
+  - rounded-sm-3
+  - rounded-md-3
+  - rounded-lg-3
+  - rounded-xl-3
 :justify_content:
   :flex_start:
   - flex-justify-start

data/lib/primer/forms/form_control.html.erb

@@ -1,5 +1,5 @@
 <% if @input.form_control? %>
-  <%= content_tag(:div, **@form_group_arguments) do %>
+  <%= content_tag(@tag, **@form_group_arguments) do %>
     <% if @input.label %>
       <%= builder.label(@input.name, **@input.label_arguments) do %>
         <%= @input.label %>

data/lib/primer/forms/form_control.rb

@@ -6,11 +6,15 @@ module Primer
     class FormControl < BaseComponent
       delegate :builder, :form, to: :@input
 
-      def initialize(input:)
+      def initialize(input:, tag: :div, **system_arguments)
         @input = input
+        @tag = tag
         @input.add_label_classes("FormControl-label")
         @form_group_arguments = {
+          **system_arguments,
           class: class_names(
+            system_arguments[:class],
+            system_arguments[:classes],
             "FormControl",
             "width-full",
             "FormControl--fullWidth" => @input.full_width?

data/lib/primer/forms/multi.html.erb

@@ -1,9 +1,7 @@
-<%= content_tag(:div, **@input.input_arguments) do %>
-  <%= render(FormControl.new(input: @input)) do %>
-    <primer-multi-input data-name="<%= @input.name %>">
-      <% @input.inputs.each do |child_input| %>
-        <%= render(child_input.to_component) %>
-      <% end %>
-    </primer-multi-input>
-  <% end %>
+<%= render(FormControl.new(input: @input, **@input.input_arguments)) do %>
+  <primer-multi-input data-name="<%= @input.name %>">
+    <% @input.inputs.each do |child_input| %>
+      <%= render(child_input.to_component) %>
+    <% end %>
+  </primer-multi-input>
 <% end %>

data/lib/primer/forms/text_field.html.erb

@@ -1,19 +1,17 @@
-<primer-text-field>
-  <%= render(FormControl.new(input: @input)) do %>
-    <%= content_tag(:div, **@field_wrap_arguments) do %>
-      <% if @input.leading_visual %>
-        <span class="FormControl-input-leadingVisualWrap">
-          <%= render(Primer::Beta::Octicon.new(**@input.leading_visual)) %>
-        </span>
-      <% end %>
-      <%= render Primer::ConditionalWrapper.new(condition: @input.auto_check_src, tag: "auto-check", csrf: auto_check_authenticity_token, src: @input.auto_check_src) do %>
-        <%= builder.text_field(@input.name, **@input.input_arguments) %>
-      <% end %>
-      <% if @input.show_clear_button? %>
-        <button type="button" id="<%= @input.clear_button_id %>" class="FormControl-input-trailingAction" aria-label="Clear" data-action="click:primer-text-field#clearContents">
-          <%= render(Primer::Beta::Octicon.new(icon: :"x-circle-fill")) %>
-        </button>
-      <% end %>
+<%= render(FormControl.new(input: @input, tag: :"primer-text-field")) do %>
+  <%= content_tag(:div, **@field_wrap_arguments) do %>
+    <% if @input.leading_visual %>
+      <span class="FormControl-input-leadingVisualWrap">
+        <%= render(Primer::Beta::Octicon.new(**@input.leading_visual)) %>
+      </span>
+    <% end %>
+    <%= render Primer::ConditionalWrapper.new(condition: @input.auto_check_src, tag: "auto-check", csrf: auto_check_authenticity_token, src: @input.auto_check_src) do %>
+      <%= builder.text_field(@input.name, **@input.input_arguments) %>
+    <% end %>
+    <% if @input.show_clear_button? %>
+      <button type="button" id="<%= @input.clear_button_id %>" class="FormControl-input-trailingAction" aria-label="Clear" data-action="click:primer-text-field#clearContents">
+        <%= render(Primer::Beta::Octicon.new(icon: :"x-circle-fill")) %>
+      </button>
     <% end %>
   <% end %>
-</primer-text-field>
+<% end %>

data/lib/primer/static/generate_arguments.rb

@@ -0,0 +1,55 @@
+# frozen_string_literal: true
+
+# :nocov:
+
+require "json"
+
+module Primer
+  module Static
+    # :nodoc:
+    module GenerateArguments
+      class << self
+        def call(view_context: self.view_context)
+          Primer::Component.descendants.sort_by(&:name).map do |component|
+            docs = registry.find(component)
+            ref = Primer::Yard::ComponentManifest.ref_for(component)
+
+            args = docs.params.map do |tag|
+              default_value = Primer::Yard::DocsHelper.pretty_default_value(tag, component)
+
+              {
+                "name" => tag.name,
+                "type" => tag.types.join(", "),
+                "default" => default_value,
+                "description" => view_context.render(inline: tag.text.squish)
+              }
+            end
+
+            {
+              "component" => docs.metadata[:title],
+              "status" => component.status.to_s,
+              "a11y_reviewed" => docs.metadata[:a11y_reviewed] == "true",
+              "short_name" => docs.short_name,
+              "source" => ref.source_url,
+              "lookbook" => ref.lookbook_url,
+              "parameters" => args
+            }
+          end
+        end
+
+        private
+
+        def view_context
+          @view_context ||= ApplicationController.new.tap { |c| c.request = ActionDispatch::TestRequest.create }.view_context.tap do |vc|
+            vc.singleton_class.include(Primer::Yard::DocsHelper)
+            vc.singleton_class.include(Primer::ViewHelper)
+          end
+        end
+
+        def registry
+          @registry ||= Primer::Yard::Registry.make
+        end
+      end
+    end
+  end
+end

data/lib/primer/static/generate_audited_at.rb

@@ -0,0 +1,17 @@
+# frozen_string_literal: true
+
+# :nocov:
+module Primer
+  module Static
+    # :nodoc:
+    module GenerateAuditedAt
+      class << self
+        def call
+          Primer::Component.descendants.sort_by(&:name).each_with_object({}) do |component, mem|
+            mem[component.to_s] = component.audited_at.to_s
+          end
+        end
+      end
+    end
+  end
+end

data/lib/primer/static/generate_constants.rb

@@ -0,0 +1,19 @@
+# frozen_string_literal: true
+
+# :nocov:
+module Primer
+  module Static
+    # :nodoc:
+    module GenerateConstants
+      class << self
+        def call
+          Primer::Component.descendants.sort_by(&:name).each_with_object({}) do |component, mem|
+            mem[component.to_s] = component.constants(false).sort.each_with_object({}) do |constant, h|
+              h[constant] = component.const_get(constant)
+            end
+          end
+        end
+      end
+    end
+  end
+end

data/lib/primer/static/generate_info_arch.rb

@@ -0,0 +1,156 @@
+# frozen_string_literal: true
+
+# :nocov:
+
+require "json"
+
+module Primer
+  module Static
+    # :nodoc:
+    module GenerateInfoArch
+      SKIP_METHODS = %i[call before_render].freeze
+
+      class << self
+        def call
+          components = Primer::Component.descendants.sort_by(&:name) - [Primer::BaseComponent]
+
+          component_docs = components.each_with_object({}) do |component, memo|
+            docs = registry.find(component)
+
+            preview_data = previews.find do |preview|
+              preview["component"] == docs.metadata[:title] &&
+                preview["status"] == component.status.to_s
+            end
+
+            arg_data = args.find do |component_args|
+              component_args["component"] == docs.metadata[:title] &&
+                component_args["status"] == component.status.to_s
+            end
+
+            slot_docs = docs.slot_methods.map do |slot_method|
+              param_tags = slot_method.tags(:param)
+
+              {
+                "name" => slot_method.name,
+                # rubocop:disable Style/IfUnlessModifier
+                "description" =>
+                  if slot_method.base_docstring.to_s.present?
+                    view_context.render(inline: slot_method.base_docstring)
+                  end,
+                # rubocop:enable Style/IfUnlessModifier
+                "parameters" => serialize_params(param_tags, component)
+              }
+            end
+
+            mtds = docs.non_slot_methods.select do |mtd|
+              next false if mtd.base_docstring.to_s.blank?
+              next false if SKIP_METHODS.include?(mtd.name)
+
+              method_location, = mtd.files.first
+              class_location, = docs.docs.files.first
+
+              method_location == class_location
+            end
+
+            method_docs = mtds.map do |mtd|
+              param_tags = mtd.tags(:param)
+
+              {
+                "name" => mtd.name,
+                "description" => view_context.render(inline: mtd.base_docstring),
+                "parameters" => serialize_params(param_tags, component)
+              }
+            end
+
+            description =
+              if component == Primer::BaseComponent
+                docs.base_docstring
+              else
+                view_context.render(inline: docs.base_docstring)
+              end
+
+            memo[component] = {
+              "fully_qualified_name" => component.name,
+              "description" => description,
+              **arg_data,
+              "slots" => slot_docs,
+              "methods" => method_docs,
+              "previews" => (preview_data || {}).fetch("examples", []),
+              "subcomponents" => []
+            }
+          end
+
+          statuses = Primer::Status::Dsl::STATUSES.keys.map(&:to_s).map(&:capitalize)
+
+          Primer::Component.descendants.each do |component|
+            fq_class = component.name.to_s.split("::")
+            fq_class.shift # remove Primer::
+            status = fq_class.shift if statuses.include?(fq_class.first) # remove Status::
+
+            parent, *child = *fq_class
+
+            next if child.empty?
+
+            parent_class = Primer
+            parent_class = parent_class.const_get(status) if status
+            parent_class = parent_class.const_get(parent)
+
+            parent_docs = component_docs[parent_class]
+            next unless parent_docs
+
+            if (child_docs = component_docs.delete(component))
+              parent_docs["subcomponents"] << child_docs
+            end
+          end
+
+          component_docs.values + [system_args_docs]
+        end
+
+        private
+
+        def system_args_docs
+          docs = registry.find(Primer::BaseComponent)
+
+          {
+            component: "BaseComponent",
+            fully_qualified_name: "Primer::BaseComponent",
+            description_md: docs.base_docstring,
+            args_md: view_context.render(inline: docs.constructor.base_docstring)
+          }
+        end
+
+        def serialize_params(param_tags, component)
+          param_tags.map do |tag|
+            default_value = Primer::Yard::DocsHelper.pretty_default_value(tag, component)
+
+            {
+              "name" => tag.name,
+              "type" => tag.types&.join(", ") || "",
+              "default" => default_value,
+              "description" => view_context.render(inline: tag.text.squish)
+            }
+          end
+        end
+
+        def previews
+          @previews ||= JSON.parse(Static.read(:previews))
+        end
+
+        def args
+          @args ||= Primer::Static::GenerateArguments.call(view_context: view_context)
+        end
+
+        def view_context
+          @view_context ||= ApplicationController.new.tap { |c| c.request = ActionDispatch::TestRequest.create }.view_context.tap do |vc|
+            vc.singleton_class.include(Primer::Yard::InfoArchDocsHelper)
+            vc.singleton_class.include(Primer::ViewHelper)
+          end
+        end
+
+        def registry
+          @registry ||= Primer::Yard::Registry.make
+        end
+      end
+    end
+  end
+end

data/lib/primer/static/generate_previews.rb

@@ -0,0 +1,45 @@
+# frozen_string_literal: true
+
+# :nocov:
+
+require "json"
+
+module Primer
+  module Static
+    # :nodoc:
+    module GeneratePreviews
+      class << self
+        def call
+          Lookbook.previews.filter_map do |preview|
+            next if preview.preview_class.name.start_with?("Docs::")
+            next if preview.preview_class == Primer::Forms::FormsPreview
+
+            component = preview.components.first&.component_class
+
+            # rubocop:disable Style/IfUnlessModifier
+            unless component
+              raise "Could not determine which component `#{preview.preview_class}` is designed to preview. Please add a `@component` annotation."
+            end
+            # rubocop:enable Style/IfUnlessModifier
+
+            _, _, class_name = Primer::Yard::DocsHelper.status_module_and_short_name(component)
+
+            {
+              name: preview.name,
+              component: class_name,
+              status: component.status.to_s,
+              lookup_path: preview.lookup_path,
+              examples: preview.examples.map do |example|
+                {
+                  inspect_path: example.url_path,
+                  preview_path: example.url_path.sub("/inspect/", "/preview/"),
+                  name: example.name
+                }
+              end
+            }
+          end
+        end
+      end
+    end
+  end
+end

data/lib/primer/static/generate_statuses.rb

@@ -0,0 +1,17 @@
+# frozen_string_literal: true
+
+# :nocov:
+module Primer
+  module Static
+    # :nodoc:
+    module GenerateStatuses
+      class << self
+        def call
+          Primer::Component.descendants.sort_by(&:name).each_with_object({}) do |component, mem|
+            mem[component.to_s] = component.status.to_s
+          end
+        end
+      end
+    end
+  end
+end

data/lib/primer/static.rb

@@ -0,0 +1,72 @@
+# frozen_string_literal: true
+
+# :nocov:
+
+require "json"
+
+module Primer
+  # :nodoc:
+  module Static
+    DEFAULT_STATIC_PATH = File.expand_path("static").freeze
+
+    FILE_NAMES = {
+      statuses: "statuses.json",
+      constants: "constants.json",
+      audited_at: "audited_at.json",
+      arguments: "arguments.json",
+      previews: "previews.json",
+      info_arch: "info_arch.json"
+    }.freeze
+
+    # Returns a hash mapping component names to component statuses (alpha, beta, etc),
+    # sorted alphabetically by the component name.
+    def self.generate_statuses
+      Static::GenerateStatuses.call
+    end
+
+    # Returns a hash mapping component names to the date on which the component passed
+    # an accessibility audit.
+    def self.generate_audited_at
+      Static::GenerateAuditedAt.call
+    end
+
+    # Returns a hash mapping component names to an array of the constants defined inside
+    # the component's class.
+    def self.generate_constants
+      Static::GenerateConstants.call
+    end
+
+    # Returns an array of hashes, one per Primer component, that contains some metadata and
+    # a list of the arguments accepted by the component's constructor. Arguments are enumerated
+    # with their value, data type, and docstring.
+    def self.generate_arguments
+      Static::GenerateArguments.call
+    end
+
+    # Returns an array of hashes, one per Primer component, that contains some metadata and
+    # an array of all the component's previews. The preview data contains the Lookbook URL
+    # to each preview and its name.
+    def self.generate_previews
+      Static::GeneratePreviews.call
+    end
+
+    # Returns an array of hashes, one per Primer component, that contains all the data needed
+    # for the new primer.style docsite.
+    def self.generate_info_arch
+      Static::GenerateInfoArch.call
+    end
+
+    # Generates the requested stat hash and outputs it to a file.
+    def self.dump(stats)
+      File.open(File.join(DEFAULT_STATIC_PATH, FILE_NAMES[stats]), "w") do |f|
+        f.write(JSON.pretty_generate(send("generate_#{stats}")))
+        f.write($INPUT_RECORD_SEPARATOR)
+      end
+    end
+
+    # Returns the contents of the stat file.
+    def self.read(stats)
+      File.read(File.join(DEFAULT_STATIC_PATH, FILE_NAMES[stats]))
+    end
+  end
+end

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

@@ -13,18 +13,57 @@ module ERBLint
   module Linters
     # Counts the number of times a class reserved for ViewComponents is used
     class DisallowComponentCssCounter < BaseLinter
+      CLASSES_COVERED_BY_OTHER_LINTERS =
+        BaseLinter.subclasses.reduce([]) do |html_classes, klass|
+          html_classes.concat(klass.const_get(:CLASSES))
+        end
+
       CLASSES = (
         JSON.parse(
           File.read(
             File.join(__dir__, "..", "..", "..", "..", "static", "classes.json")
           )
-        ) - BaseLinter.subclasses.reduce([]) do |html_classes, klass|
-          html_classes.concat(klass.const_get(:CLASSES))
+        ).reject do |html_class, _ruby_classes|
+          CLASSES_COVERED_BY_OTHER_LINTERS.include?(html_class)
         end
       ).freeze
 
-      TAGS = nil
-      MESSAGE = "Primer ViewComponents defines some HTML classes with associated styles that should not be used outside those components. (These classes might have their styles changed or even disappear in the future.) Instead of using this class directly, please use its component if appropriate or define the styles you need some other way."
+      def run(processed_source)
+        @total_offenses = 0
+        @offenses_not_corrected = 0
+
+        processed_source
+          .parser
+          .nodes_with_type(:tag)
+          .each do |node|
+            tag = BetterHtml::Tree::Tag.from_node(node)
+
+            tag.attributes["class"]&.value&.split(/\s+/)&.each do |class_name|
+              if CLASSES.key? class_name
+                @total_offenses += 1
+                @offenses_not_corrected += 1
+                add_offense(
+                  processed_source.to_source_range(tag.loc),
+                  format_message(class_name)
+                )
+              end
+            end
+          end
+
+        counter_correct?(processed_source)
+
+        dump_data(processed_source) if ENV["DUMP_LINT_DATA"] == "1"
+      end
+
+      private
+
+      def format_message(class_name)
+        "DisallowComponentCssCounter:HTML class \"#{class_name}\" is reserved for Primer ViewComponents. It might disappear or have different styles in the future. You might want to use #{ruby_classes_sentence_string(class_name)} from Primer ViewComponents instead."
+      end
+
+      def ruby_classes_sentence_string(class_name)
+        CLASSES[class_name].to_sentence(last_word_connector: ", or ", two_words_connector: " or ")
+      end
     end
   end
 end

data/lib/primer/view_components/version.rb

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