primer_view_components 0.0.112 → 0.0.113

data/app/components/primer/primer.ts

@@ -7,7 +7,7 @@ import './alpha/toggle_switch'
 import './alpha/tool_tip'
 import './alpha/x_banner'
 import './beta/auto_complete/auto_complete'
-import './clipboard_copy'
+import './beta/clipboard_copy'
 import './local_time'
 import './tab_container_component'
 import './time_ago_component'

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

@@ -1 +1 @@
-import '@github/time-elements';
+import '@github/relative-time-element';

data/app/components/primer/time_ago_component.js

@@ -1 +1 @@
-import '@github/time-elements';
+import '@github/relative-time-element';

data/app/components/primer/time_ago_component.rb

@@ -15,7 +15,8 @@ module Primer
       @system_arguments = deny_tag_argument(**system_arguments)
       @system_arguments[:datetime] = time.utc.iso8601
       @system_arguments[:classes] = class_names("no-wrap", @system_arguments[:classes])
-      @system_arguments[:tag] = "time-ago"
+      @system_arguments[:tag] = "relative-time"
+      @system_arguments[:tense] = "past"
       @system_arguments[:format] = "micro" if micro
       @time = time
       @micro = micro

data/app/components/primer/time_ago_component.ts

@@ -1 +1 @@
-import '@github/time-elements'
+import '@github/relative-time-element'

data/app/forms/submit_button_form.rb

@@ -13,8 +13,14 @@ class SubmitButtonForm < ApplicationForm
       color: :success
     )
 
-    my_form.submit(name: :submit, label: "Submit", scheme: :primary, mr: 3) do |c|
-      c.with_leading_visual_icon(icon: :"check-circle")
+    my_form.group(layout: :horizontal) do |button_group|
+      button_group.submit(name: :submit, label: "Submit", scheme: :primary, mb: 3) do |c|
+        c.with_leading_visual_icon(icon: :"check-circle")
+      end
+
+      button_group.button(name: :button, label: "Click me", mb: 3) do |c|
+        c.with_leading_visual_icon(icon: :alert)
+      end
     end
   end
 end

data/app/helpers/primer/form_helper.rb

@@ -7,5 +7,17 @@ module Primer
     def primer_form_with(**kwargs, &block)
       form_with(**kwargs, skip_default_ids: false, builder: Primer::Forms::Builder, &block)
     end
+
+    def primer_fields_for(record_name, record_object = nil, options = {}, &block)
+      fields_for(
+        record_name,
+        record_object,
+        options.merge(
+          skip_default_ids: false,
+          builder: Primer::Forms::Builder
+        ),
+        &block
+      )
+    end
   end
 end

data/lib/postcss_mixins/clearfix.pcss

@@ -0,0 +1,12 @@
+@define-mixin clearfix {
+  &::before {
+    display: table;
+    content: '';
+  }
+
+  &::after {
+    display: table;
+    clear: both;
+    content: '';
+  }
+}

data/lib/primer/deprecations.rb

@@ -1,35 +1,105 @@
 # frozen_string_literal: true
 
+require "yaml"
+
 module Primer
   # :nodoc:
-  module Deprecations
-    # If there is no alternative to suggest, set the value to nil
-    DEPRECATED_COMPONENTS = {
-      "Primer::LabelComponent" => "Primer::Beta::Label",
-      "Primer::LinkComponent" => "Primer::Beta::Link",
-      "Primer::Alpha::AutoComplete" => "Primer::Beta::AutoComplete",
-      "Primer::Alpha::AutoComplete::Item" => "Primer::Beta::AutoComplete::Item",
-      "Primer::BlankslateComponent" => "Primer::Beta::Blankslate",
-      "Primer::BoxComponent" => "Primer::Box",
-      "Primer::DropdownMenuComponent" => nil,
-      "Primer::Dropdown" => "Primer::Alpha::Dropdown",
-      "Primer::Dropdown::Menu" => "Primer::Alpha::Dropdown::Menu",
-      "Primer::Dropdown::Menu::Item" => "Primer::Alpha::Dropdown::Menu::Item",
-      "Primer::IconButton" => "Primer::Beta::IconButton",
-      "Primer::Tooltip" => "Primer::Alpha::Tooltip",
-      "Primer::PopoverComponent" => "Primer::Beta::Popover"
-    }.freeze
-
-    def self.deprecated?(name)
-      DEPRECATED_COMPONENTS.key?(name)
-    end
+  class Deprecations
+    class << self
+      def register(file_path)
+        data = YAML.load_file(file_path)
+        data["deprecations"].each do |dep|
+          register_deprecation(dep["component"], {
+                                 autocorrect: dep["autocorrect"],
+                                 guide: dep["guide"],
+                                 replacement: dep["replacement"]
+                               })
+        end
+      end
 
-    def self.suggested_component(name)
-      DEPRECATED_COMPONENTS[name]
-    end
+      def register_deprecation(component, options)
+        registered_deprecations[component] = {
+          autocorrect: options[:autocorrect],
+          guide: options[:guide],
+          replacement: options[:replacement]
+        }
+      end
+
+      def deprecated_components
+        registered_deprecations.keys.sort
+      end
+
+      def deprecated?(component_name)
+        # if the component is registered, it is deprecated
+        registered_deprecations.key?(component_name)
+      end
+
+      def replacement?(component_name)
+        !replacement(component_name).nil?
+      end
+
+      def replacement(component_name)
+        dep = registered_deprecations[component_name]
+        return nil if dep.nil?
+
+        dep[:replacement]
+      end
+
+      def correctable?(component_name)
+        dep = registered_deprecations[component_name]
+        return false if dep.nil?
+
+        dep[:autocorrect]
+      end
 
-    def self.correctable?(name)
-      !suggested_component(name).nil?
+      def guide?(component_name)
+        !guide(component_name).nil?
+      end
+
+      def guide(component_name)
+        dep = registered_deprecations[component_name]
+        return nil if dep.nil?
+
+        dep[:guide]
+      end
+
+      def deprecation_message(component_name)
+        return nil unless deprecated?(component_name)
+
+        msg = ["'#{component_name}' has been deprecated."]
+
+        # this nested structure is complex, because it has to
+        # match all of the valid scenarios for a component being
+        # replaceable, auto-correctable, and having a guide. for
+        # more information on what is and is not valid, see the
+        # documentation here: docs/contributors/deprecations.md
+
+        if replacement?(component_name) # has replacement
+          if correctable?(component_name) # is autocorrectable
+            msg << "Please update your code to use '#{replacement(component_name)}'"
+            msg << "or use rubocop's auto-correct option to do it for you."
+            msg << "See #{guide(component_name)} for more information." if guide?(component_name) # has a guide
+          elsif guide?(component_name) # not autocorrectable
+            msg << "See #{guide(component_name)} for information on replacing this component in your code." # has a guide
+          end
+        elsif !correctable?(component_name) # no replacement
+          if guide?(component_name) # has a guide
+            msg << "Unfortunately, there is no direct replacement."
+            msg << "See #{guide(component_name)} for available options to update your code."
+            end
+        end
+
+        msg.join(" ")
+      end
+
+      private
+
+      def registered_deprecations
+        @registered_deprecations ||= {}
+      end
     end
+
+    # auto-load PVC's deprecations
+    register(File.expand_path("deprecations.yml", __dir__))
   end
 end

data/lib/primer/deprecations.yml

@@ -0,0 +1,68 @@
+# PVC Component Deprecations
+# --------------------------
+#
+# All component deprecations for PVC must be listed here, and must have valid configurations.
+# See 'docs/contributors/deprecations.md' for information on configuration options.
+
+deprecations:
+  - component: "Primer::Alpha::AutoComplete"
+    autocorrect: true
+    replacement: "Primer::Beta::AutoComplete"
+
+  - component: "Primer::Alpha::AutoComplete::Item"
+    autocorrect: true
+    replacement: "Primer::Beta::AutoComplete::Item"
+
+  - component: "Primer::BlankslateComponent"
+    autocorrect: true
+    replacement: "Primer::Beta::Blankslate"
+
+  - component: "Primer::BoxComponent"
+    autocorrect: true
+    replacement: "Primer::Box"
+
+  - component: "Primer::ButtonComponent"
+    autocorrect: false
+    replacement: "Primer::Beta::Button"
+    guide: "https://primer.style/view-components/guides/primer_button_component"
+
+  - component: "Primer::ClipboardCopy"
+    autocorrect: true
+    replacement: "Primer::Beta::ClipboardCopy"
+
+  - component: "Primer::DropdownMenuComponent"
+    autocorrect: false
+    replacement: "Primer::Beta::Dropdown"
+    guide: "https://primer.style/view-components/guides/primer_dropdown_menu_component"
+
+  - component: "Primer::Dropdown"
+    autocorrect: true
+    replacement: "Primer::Alpha::Dropdown"
+
+  - component: "Primer::Dropdown::Menu"
+    autocorrect: true
+    replacement: "Primer::Alpha::Dropdown::Menu"
+
+  - component: "Primer::Dropdown::Menu::Item"
+    autocorrect: true
+    replacement: "Primer::Alpha::Dropdown::Menu::Item"
+
+  - component: "Primer::IconButton"
+    autocorrect: true
+    replacement: "Primer::Beta::IconButton"
+
+  - component: "Primer::LabelComponent"
+    autocorrect: true
+    replacement: "Primer::Beta::Label"
+
+  - component: "Primer::LinkComponent"
+    autocorrect: true
+    replacement: "Primer::Beta::Link"
+
+  - component: "Primer::PopoverComponent"
+    autocorrect: true
+    replacement: "Primer::Beta::Popover"
+
+  - component: "Primer::Tooltip"
+    autocorrect: true
+    replacement: "Primer::Alpha::Tooltip"

data/lib/primer/forms/base.rb

@@ -29,7 +29,7 @@ module Primer
         end
 
         def inherited(base)
-          form_path = const_source_location(base.name)
+          form_path = Utils.const_source_location(base.name)
           return unless form_path
 
           base.template_root_path = File.join(File.dirname(form_path), base.name.demodulize.underscore)
@@ -54,25 +54,6 @@ module Primer
         def sanitize_field_name_for_template_path(field_name)
           field_name.to_s.delete_suffix("?").to_sym
         end
-
-        private
-
-        # Unfortunately this bug (https://github.com/ruby/ruby/pull/5646) prevents us from using
-        # Ruby's native Module.const_source_location. Instead we have to fudge it by searching
-        # for the file in the configured autoload paths. Doing so relies on Rails' autoloading
-        # conventions, so it should work ok. Zeitwerk also has this information but lacks a
-        # public API to map constants to source files.
-        def const_source_location(class_name)
-          # NOTE: underscore respects namespacing, i.e. will convert Foo::Bar to foo/bar.
-          class_path = "#{class_name.underscore}.rb"
-
-          ActiveSupport::Dependencies.autoload_paths.each do |autoload_path|
-            absolute_path = File.join(autoload_path, class_path)
-            return absolute_path if File.exist?(absolute_path)
-          end
-
-          nil
-        end
       end
 
       def inputs
@@ -124,12 +105,18 @@ module Primer
       end
 
       def perform_render(&_block)
+        return "" unless render?
+
         Base.compile!
         self.class.compile!
 
         render_base_form
       end
 
+      def render?
+        true
+      end
+
       private
 
       def form_object

data/lib/primer/forms/base_component.rb

@@ -10,12 +10,22 @@ module Primer
       extend ActsAsComponent
 
       def self.inherited(base)
-        base.renders_template File.join(__dir__, "#{base.name.demodulize.underscore}.html.erb"), :render_template
+        base_path = Utils.const_source_location(base.name)
+
+        unless base_path
+          warn "Could not identify the template for #{base}"
+          return
+        end
+
+        dir = File.dirname(base_path)
+        base.renders_template File.join(dir, "#{base.name.demodulize.underscore}.html.erb"), :render_template
       end
 
       delegate :required?, :disabled?, :hidden?, to: :@input
 
       def perform_render(&block)
+        return "" unless render?
+
         @__prf_content_block = block
         compile_and_render_template
       end
@@ -43,6 +53,10 @@ module Primer
         self
       end
 
+      def render?
+        true
+      end
+
       private
 
       def compile_and_render_template

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

@@ -0,0 +1,4 @@
+<%= render(Primer::Beta::Button.new(**input_arguments)) do |c| %>
+  <% @input.block.call(c) if @input.block %>
+  <%= @input.label %>
+<% end %>

data/lib/primer/forms/button.rb

@@ -0,0 +1,68 @@
+# frozen_string_literal: true
+
+module Primer
+  module Forms
+    # :nodoc:
+    class Button < BaseComponent
+      # :nodoc:
+      module ButtonAttributeGenerator
+        extend ActionView::Helpers::FormTagHelper
+
+        class << self
+          alias submit_tag_attributes submit_tag
+          alias button_tag_attributes button_tag
+
+          private
+
+          # FormTagHelper#submit_tag ultimately calls the #tag method. We return the options hash here instead
+          # of returning a string so it can be merged into the hash of options we pass to the Primer::ButtonComponent.
+          def tag(_name, options)
+            options
+          end
+
+          # FormTagHelper#button_tag ultimately calls the #content_tag method. We return the options hash here instead
+          # of returning a string so it can be merged into the hash of options we pass to the Primer::ButtonComponent.
+          def content_tag(_name, _content, options)
+            options
+          end
+        end
+      end
+
+      delegate :builder, :form, to: :@input
+
+      def initialize(input:, type: :button)
+        @input = input
+        @type = type
+
+        @input.add_input_classes("FormField-input flex-self-start")
+        @input.merge_input_arguments!(tag_attributes.deep_symbolize_keys)
+
+        # rails uses a string for this, but PVC wants a symbol
+        @input.merge_input_arguments!(type: type.to_sym)
+
+        # Never disable buttons. This overrides the global
+        # ActionView::Base.automatically_disable_submit_tag setting.
+        # Disabling buttons is not accessible.
+        @input.remove_input_data(:disable_with)
+      end
+
+      def input_arguments
+        @input_arguments ||= @input.input_arguments.deep_dup.tap do |args|
+          # rails uses :class but PVC wants :classes
+          args[:classes] = args.delete(:class)
+        end
+      end
+
+      private
+
+      def tag_attributes
+        case @type
+        when :submit
+          ButtonAttributeGenerator.submit_tag_attributes(@input.label, name: @input.name)
+        else
+          ButtonAttributeGenerator.button_tag_attributes(@input.label, name: @input.name)
+        end
+      end
+    end
+  end
+end

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

@@ -1,4 +1,4 @@
-<div class="FormControl-checkbox-wrap">
+<%= content_tag(:div, class: "FormControl-checkbox-wrap", hidden: @input.hidden?) do %>
   <%= builder.check_box(@input.name, @input.input_arguments, checked_value, unchecked_value) %>
   <span class="FormControl-checkbox-labelWrap">
     <%= builder.label(@input.name, **@input.label_arguments) do %>
@@ -6,7 +6,7 @@
     <% end %>
     <%= render(Caption.new(input: @input)) %>
   </span>
-</div>
+<% end %>
 <% if @input.nested_form_block %>
   <%= content_tag(:div, nested_form_arguments) do %>
     <%= render(@input.nested_form_block.call(builder)) %>

data/lib/primer/forms/check_box.rb

@@ -20,7 +20,7 @@ module Primer
       def nested_form_arguments
         return @nested_form_arguments if defined?(@nested_form_arguments)
 
-        @nested_form_arguments = { **@input.nested_form_arguments }
+        @nested_form_arguments = { hidden: @input.hidden?, **@input.nested_form_arguments }
         @nested_form_arguments[:class] = class_names(
           @nested_form_arguments[:class],
           @nested_form_arguments.delete(:classes),

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

@@ -1,4 +1,4 @@
-<fieldset>
+<%= content_tag(:fieldset, hidden: @input.hidden?) do %>
   <% if @input.label %>
     <%= content_tag(:legend, **@input.label_arguments) do %>
       <%= @input.label %>
@@ -9,4 +9,4 @@
       <%= render(check_box.to_component) %>
     <% end %>
   <% end %>
-</fieldset>
+<% end %>

data/lib/primer/forms/dsl/button_input.rb

@@ -0,0 +1,29 @@
+# frozen_string_literal: true
+
+module Primer
+  module Forms
+    module Dsl
+      # :nodoc:
+      class ButtonInput < Input
+        attr_reader :name, :label, :block
+
+        def initialize(name:, label:, **system_arguments, &block)
+          @name = name
+          @label = label
+          @block = block
+
+          super(**system_arguments)
+        end
+
+        def to_component
+          Button.new(input: self)
+        end
+
+        # :nocov:
+        def type
+          :button
+        end
+      end
+    end
+  end
+end

data/lib/primer/forms/dsl/input_methods.rb

@@ -17,8 +17,8 @@ module Primer
           add_input HiddenInput.new(builder: builder, form: form, **options)
         end
 
-        def check_box(**options)
-          add_input CheckBoxInput.new(builder: builder, form: form, **options)
+        def check_box(**options, &block)
+          add_input CheckBoxInput.new(builder: builder, form: form, **options, &block)
         end
 
         def radio_button_group(**options, &block)
@@ -63,6 +63,11 @@ module Primer
           add_input SubmitButtonInput.new(builder: builder, form: form, **options, &block)
         end
 
+        def button(**options, &block)
+          options = decorate_options(**options)
+          add_input ButtonInput.new(builder: builder, form: form, **options, &block)
+        end
+
         # END button input methods
 
         def inputs

data/lib/primer/forms/dsl/submit_button_input.rb

@@ -19,6 +19,7 @@ module Primer
           SubmitButton.new(input: self)
         end
 
+        # :nocov:
         def type
           :submit_button
         end

data/lib/primer/forms/dsl/text_field_input.rb

@@ -31,13 +31,6 @@ module Primer
 
           add_input_classes("FormControl-inset") if inset?
           add_input_classes("FormControl-monospace") if monospace?
-
-          @field_wrap_classes = class_names(
-            "FormControl-input-wrap",
-            Primer::Forms::Dsl::Input::SIZE_MAPPINGS[size],
-            "FormControl-input-wrap--trailingAction": show_clear_button?,
-            "FormControl-input-wrap--leadingVisual": leading_visual?
-          )
         end
 
         alias show_clear_button? show_clear_button

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

@@ -1,4 +1,4 @@
-<div class="FormControl-radio-wrap">
+<%= content_tag(:div, class: "FormControl-radio-wrap", hidden: @input.hidden?) do %>
   <%= builder.radio_button(@input.name, @input.value, **@input.input_arguments) %>
   <span class="FormControl-radio-labelWrap">
     <%= builder.label(@input.name, value: @input.value, **@input.label_arguments) do %>
@@ -6,7 +6,7 @@
     <% end %>
     <%= render(Caption.new(input: @input)) %>
   </span>
-</div>
+<% end %>
 <% if @input.nested_form_block %>
   <%= content_tag(:div, nested_form_arguments) do %>
     <%= render(@input.nested_form_block.call(builder)) %>

data/lib/primer/forms/radio_button.rb

@@ -15,7 +15,7 @@ module Primer
       def nested_form_arguments
         return @nested_form_arguments if defined?(@nested_form_arguments)
 
-        @nested_form_arguments = { **@input.nested_form_arguments }
+        @nested_form_arguments = { hidden: @input.hidden?, **@input.nested_form_arguments }
         @nested_form_arguments[:class] = class_names(
           @nested_form_arguments[:class],
           @nested_form_arguments.delete(:classes),

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

@@ -1,4 +1,4 @@
-<fieldset>
+<%= content_tag(:fieldset, hidden: @input.hidden?) do %>
   <% if @input.label %>
     <%= content_tag(:legend, **@input.label_arguments) do %>
       <%= @input.label %>
@@ -9,4 +9,4 @@
       <%= render(radio_button.to_component) %>
     <% end %>
   <% end %>
-</fieldset>
+<% end %>

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

@@ -1,5 +1,5 @@
 <%= render(FormControl.new(input: @input)) do %>
-  <%= content_tag(:div, class: @field_wrap_classes) do %>
+  <%= content_tag(:div, **@field_wrap_arguments) do %>
     <%= builder.select(@input.name, options, @input.select_arguments, **@input.input_arguments) %>
   <% end %>
 <% end %>

data/lib/primer/forms/select_list.rb

@@ -13,7 +13,10 @@ module Primer
           "FormControl--medium"
         )
 
-        @field_wrap_classes = class_names("FormControl-select-wrap")
+        @field_wrap_arguments = {
+          class: "FormControl-select-wrap",
+          hidden: @input.hidden?
+        }
       end
 
       def options

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

@@ -1,4 +1 @@
-<%= render(Primer::ButtonComponent.new(**input_arguments)) do |c| %>
-  <% @input.block.call(c) if @input.block %>
-  <%= @input.label %>
-<% end %>
+<%= render(@button) %>