primer_view_components 0.0.67 → 0.0.70

Sign up to get free protection for your applications and to get access to all the features.
Files changed (46) hide show
  1. checksums.yaml +4 -4
  2. data/CHANGELOG.md +133 -2
  3. data/README.md +1 -1
  4. data/app/assets/javascripts/primer_view_components.js +1 -1
  5. data/app/assets/javascripts/primer_view_components.js.map +1 -1
  6. data/app/components/primer/alpha/tooltip.d.ts +24 -0
  7. data/app/components/primer/alpha/tooltip.js +381 -0
  8. data/app/components/primer/alpha/tooltip.rb +103 -0
  9. data/app/components/primer/alpha/tooltip.ts +383 -0
  10. data/app/components/primer/base_component.rb +2 -2
  11. data/app/components/primer/beta/auto_complete/auto_complete.html.erb +22 -4
  12. data/app/components/primer/beta/auto_complete.rb +86 -99
  13. data/app/components/primer/beta/blankslate.html.erb +6 -2
  14. data/app/components/primer/beta/blankslate.rb +4 -9
  15. data/app/components/primer/beta/truncate.rb +1 -0
  16. data/app/components/primer/button_component.html.erb +1 -0
  17. data/app/components/primer/button_component.rb +29 -0
  18. data/app/components/primer/component.rb +9 -2
  19. data/app/components/primer/details_component.rb +1 -1
  20. data/app/components/primer/icon_button.rb +1 -1
  21. data/app/components/primer/link_component.erb +4 -0
  22. data/app/components/primer/link_component.rb +29 -4
  23. data/app/components/primer/markdown.rb +1 -1
  24. data/app/components/primer/popover_component.rb +5 -9
  25. data/app/components/primer/primer.d.ts +1 -0
  26. data/app/components/primer/primer.js +1 -0
  27. data/app/components/primer/primer.ts +1 -0
  28. data/app/components/primer/subhead_component.html.erb +1 -1
  29. data/app/components/primer/subhead_component.rb +1 -1
  30. data/app/components/primer/tooltip.rb +1 -1
  31. data/app/lib/primer/test_selector_helper.rb +1 -1
  32. data/lib/primer/classify/utilities.yml +28 -0
  33. data/lib/primer/view_components/linters/button_component_migration_counter.rb +1 -1
  34. data/lib/primer/view_components/version.rb +1 -1
  35. data/lib/rubocop/cop/primer/component_name_migration.rb +35 -0
  36. data/lib/rubocop/cop/primer/primer_octicon.rb +1 -1
  37. data/lib/tasks/docs.rake +12 -7
  38. data/lib/tasks/utilities.rake +1 -1
  39. data/static/arguments.yml +52 -1
  40. data/static/audited_at.json +1 -1
  41. data/static/classes.yml +9 -4
  42. data/static/constants.json +18 -8
  43. data/static/statuses.json +2 -2
  44. metadata +13 -9
  45. data/app/components/primer/auto_complete/auto_complete.d.ts +0 -1
  46. data/app/components/primer/auto_complete/auto_complete.js +0 -1
@@ -26,20 +26,19 @@ module Primer
26
26
  # @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
27
27
  renders_one :visual, types: {
28
28
  icon: lambda { |**system_arguments|
29
- system_arguments[:mb] = 3
30
29
  system_arguments[:size] ||= :medium
31
30
  system_arguments[:classes] = class_names("blankslate-icon", system_arguments[:classes])
32
31
 
33
32
  Primer::OcticonComponent.new(**system_arguments)
34
33
  },
35
34
  spinner: lambda { |**system_arguments|
36
- system_arguments[:mb] = 3
35
+ system_arguments[:classes] = class_names("blankslate-image", system_arguments[:classes])
37
36
 
38
37
  Primer::SpinnerComponent.new(**system_arguments)
39
38
  },
40
39
  image: lambda { |**system_arguments|
41
- system_arguments[:mb] = 3
42
40
  system_arguments[:size] = "56x56"
41
+ system_arguments[:classes] = class_names("blankslate-image", system_arguments[:classes])
43
42
 
44
43
  Primer::Image.new(**system_arguments)
45
44
  }
@@ -52,8 +51,7 @@ module Primer
52
51
  renders_one :heading, lambda { |tag:, **system_arguments|
53
52
  deny_tag_argument(**system_arguments)
54
53
  system_arguments[:tag] = tag
55
- system_arguments[:mb] = 1
56
- system_arguments[:classes] = class_names("h2", system_arguments[:classes])
54
+ system_arguments[:classes] = class_names("blankslate-heading", system_arguments[:classes])
57
55
 
58
56
  Primer::HeadingComponent.new(**system_arguments)
59
57
  }
@@ -66,7 +64,7 @@ module Primer
66
64
  # @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
67
65
  renders_one :description, lambda { |**system_arguments|
68
66
  deny_tag_argument(**system_arguments)
69
- system_arguments[:tag] = :div
67
+ system_arguments[:tag] = :p
70
68
 
71
69
  Primer::BaseComponent.new(**system_arguments)
72
70
  }
@@ -82,7 +80,6 @@ module Primer
82
80
  deny_tag_argument(**system_arguments)
83
81
  system_arguments[:tag] = :a
84
82
  system_arguments[:href] = href
85
- system_arguments[:mt] = 5
86
83
  system_arguments[:size] = :medium
87
84
  system_arguments[:scheme] ||= :primary
88
85
 
@@ -98,8 +95,6 @@ module Primer
98
95
  # @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
99
96
  renders_one :secondary_action, lambda { |href:, **system_arguments|
100
97
  system_arguments[:href] = href
101
- # Padding is needed to increase touch area.
102
- system_arguments[:p] = 3
103
98
 
104
99
  Primer::LinkComponent.new(**system_arguments)
105
100
  }
@@ -92,6 +92,7 @@ module Primer
92
92
  @system_arguments[:tag] = system_arguments[:tag] || :span
93
93
  @system_arguments[:classes] = class_names(
94
94
  "Truncate-text",
95
+ system_arguments[:classes],
95
96
  "Truncate-text--primary": priority,
96
97
  "Truncate-text--expandable": expandable
97
98
  )
@@ -1,3 +1,4 @@
1
1
  <%= render Primer::BaseButton.new(**@system_arguments) do -%>
2
2
  <%= leading_visual %><%= trimmed_content %><%= trailing_visual %><%= primer_octicon("triangle-down", ml: 2, mr: -1) if @dropdown %>
3
+ <%= tooltip %>
3
4
  <% end -%>
@@ -56,6 +56,23 @@ module Primer
56
56
  }
57
57
  alias counter trailing_visual_counter # remove alias when all buttons are migrated to new slot names
58
58
 
59
+ # `Tooltip` that appears on mouse hover or keyboard focus over the button. Use tooltips sparingly and as a last resort.
60
+ # **Important:** This tooltip defaults to `type: :description`. In a few scenarios, `type: :label` may be more appropriate.
61
+ # Consult the <%= link_to_component(Primer::Alpha::Tooltip) %> documentation for more information.
62
+ #
63
+ # @param type [Symbol] (:description) <%= one_of(Primer::Alpha::Tooltip::TYPE_OPTIONS) %>
64
+ # @param system_arguments [Hash] Same arguments as <%= link_to_component(Primer::Alpha::Tooltip) %>.
65
+ renders_one :tooltip, lambda { |**system_arguments|
66
+ raise ArgumentError, "Buttons with a tooltip must have a unique `id` set on the `Button`." if @id.blank? && !Rails.env.production?
67
+
68
+ @system_arguments = system_arguments
69
+
70
+ @system_arguments[:for_id] = @id
71
+ @system_arguments[:type] ||= :description
72
+
73
+ Primer::Alpha::Tooltip.new(**@system_arguments)
74
+ }
75
+
59
76
  # @example Schemes
60
77
  # <%= render(Primer::ButtonComponent.new) { "Default" } %>
61
78
  # <%= render(Primer::ButtonComponent.new(scheme: :primary)) { "Primary" } %>
@@ -96,6 +113,15 @@ module Primer
96
113
  # Button
97
114
  # <% end %>
98
115
  #
116
+ # @example With tooltip
117
+ # @description
118
+ # Use tooltips sparingly and as a last resort. Consult the <%= link_to_component(Primer::Alpha::Tooltip) %> documentation for more information.
119
+ # @code
120
+ # <%= render(Primer::ButtonComponent.new(id: "button-with-tooltip")) do |c| %>
121
+ # <% c.tooltip(text: "Tooltip text") %>
122
+ # Button
123
+ # <% end %>
124
+ #
99
125
  # @param scheme [Symbol] <%= one_of(Primer::ButtonComponent::SCHEME_OPTIONS) %>
100
126
  # @param variant [Symbol] DEPRECATED. <%= one_of(Primer::ButtonComponent::SIZE_OPTIONS) %>
101
127
  # @param size [Symbol] <%= one_of(Primer::ButtonComponent::SIZE_OPTIONS) %>
@@ -118,6 +144,9 @@ module Primer
118
144
  @dropdown = dropdown
119
145
 
120
146
  @system_arguments = system_arguments
147
+
148
+ @id = @system_arguments[:id]
149
+
121
150
  @system_arguments[:classes] = class_names(
122
151
  system_arguments[:classes],
123
152
  SCHEME_MAPPINGS[fetch_or_fallback(SCHEME_OPTIONS, scheme, DEFAULT_SCHEME)],
@@ -102,10 +102,17 @@ module Primer
102
102
  def deny_aria_label(tag:, arguments:)
103
103
  return arguments.except!(:skip_aria_label_check) if arguments[:skip_aria_label_check]
104
104
  return if arguments[:role]
105
- return unless aria(:label, arguments)
106
105
  return unless INVALID_ARIA_LABEL_TAGS.include?(tag)
107
106
 
108
- raise ArgumentError, "Don't use `aria-label` on `#{tag}` elements. See https://www.tpgi.com/short-note-on-aria-label-aria-labelledby-and-aria-describedby/" if should_raise_aria_error?
107
+ deny_aria_key(
108
+ :label,
109
+ "Don't use `aria-label` on `#{tag}` elements. See https://www.tpgi.com/short-note-on-aria-label-aria-labelledby-and-aria-describedby/",
110
+ **arguments
111
+ )
112
+ end
113
+
114
+ def deny_aria_key(key, help_text, **arguments)
115
+ raise ArgumentError, help_text if should_raise_aria_error? && aria(key, arguments)
109
116
  end
110
117
 
111
118
  def deny_tag_argument(**arguments)
@@ -49,7 +49,7 @@ module Primer
49
49
  # <% end %>
50
50
  #
51
51
  # @param overlay [Symbol] Dictates the type of overlay to render with. <%= one_of(Primer::DetailsComponent::OVERLAY_MAPPINGS.keys) %>
52
- # @param reset [Boolean] Defatuls to false. If set to true, it will remove the default caret and remove style from the summary element
52
+ # @param reset [Boolean] Defaults to false. If set to true, it will remove the default caret and remove style from the summary element
53
53
  # @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
54
54
  def initialize(overlay: NO_OVERLAY, reset: false, **system_arguments)
55
55
  @system_arguments = deny_tag_argument(**system_arguments)
@@ -6,7 +6,7 @@ module Primer
6
6
  # @accessibility
7
7
  # `IconButton` requires an `aria-label`, which will provide assistive technologies with an accessible label.
8
8
  # The `aria-label` should describe the action to be invoked rather than the icon itself. For instance,
9
- # if your `IconButton` renders a magnifying glass icon and invokves a search action, the `aria-label` should be
9
+ # if your `IconButton` renders a magnifying glass icon and invokes a search action, the `aria-label` should be
10
10
  # `"Search"` instead of `"Magnifying glass"`.
11
11
  # [Learn more about best functional image practices (WAI Images)](https://www.w3.org/WAI/tutorials/images/functional)
12
12
  class IconButton < Primer::Component
@@ -0,0 +1,4 @@
1
+ <%= render Primer::BaseComponent.new(**@system_arguments) do %>
2
+ <%= content %>
3
+ <%= tooltip %>
4
+ <% end %>
@@ -15,6 +15,23 @@ module Primer
15
15
  DEFAULT_TAG = :a
16
16
  TAG_OPTIONS = [DEFAULT_TAG, :span].freeze
17
17
 
18
+ # `Tooltip` that appears on mouse hover or keyboard focus over the link. Use tooltips sparingly and as a last resort.
19
+ # **Important:** This tooltip defaults to `type: :description`. In a few scenarios, `type: :label` may be more appropriate.
20
+ # Consult the <%= link_to_component(Primer::Alpha::Tooltip) %> documentation for more information.
21
+ #
22
+ # @param type [Symbol] (:description) <%= one_of(Primer::Alpha::Tooltip::TYPE_OPTIONS) %>
23
+ # @param system_arguments [Hash] Same arguments as <%= link_to_component(Primer::Alpha::Tooltip) %>.
24
+ renders_one :tooltip, lambda { |**system_arguments|
25
+ raise ArgumentError, "Links with a tooltip must have a unique `id` set on the `LinkComponent`." if @id.blank? && !Rails.env.production?
26
+
27
+ @system_arguments = system_arguments
28
+
29
+ @system_arguments[:for_id] = @id
30
+ @system_arguments[:type] ||= :description
31
+
32
+ Primer::Alpha::Tooltip.new(**@system_arguments)
33
+ }
34
+
18
35
  # @example Default
19
36
  # <%= render(Primer::LinkComponent.new(href: "#")) { "Link" } %>
20
37
  #
@@ -31,6 +48,15 @@ module Primer
31
48
  # @example Span as link
32
49
  # <%= render(Primer::LinkComponent.new(tag: :span)) { "Span as a link" } %>
33
50
  #
51
+ # @example With tooltip
52
+ # @description
53
+ # Use tooltips sparingly and as a last resort. Consult the <%= link_to_component(Primer::Alpha::Tooltip) %> documentation for more information.
54
+ # @code
55
+ # <%= render(Primer::LinkComponent.new(href: "#", id: "link-with-tooltip")) do |c| %>
56
+ # <% c.tooltip(text: "Tooltip text") %>
57
+ # Link
58
+ # <% end %>
59
+ #
34
60
  # @param tag [String] <%= one_of(Primer::LinkComponent::TAG_OPTIONS) %>
35
61
  # @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.
36
62
  # @param scheme [Symbol] <%= one_of(Primer::LinkComponent::SCHEME_MAPPINGS.keys) %>
@@ -39,6 +65,9 @@ module Primer
39
65
  # @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
40
66
  def initialize(href: nil, tag: DEFAULT_TAG, scheme: DEFAULT_SCHEME, muted: false, underline: true, **system_arguments)
41
67
  @system_arguments = system_arguments
68
+
69
+ @id = @system_arguments[:id]
70
+
42
71
  @system_arguments[:tag] = fetch_or_fallback(TAG_OPTIONS, tag, DEFAULT_TAG)
43
72
  @system_arguments[:href] = href
44
73
  @system_arguments[:classes] = class_names(
@@ -50,10 +79,6 @@ module Primer
50
79
  )
51
80
  end
52
81
 
53
- def call
54
- render(Primer::BaseComponent.new(**@system_arguments)) { content }
55
- end
56
-
57
82
  def before_render
58
83
  raise ArgumentError, "href is required when using <a> tag" if @system_arguments[:tag] == :a && @system_arguments[:href].nil? && !Rails.env.production?
59
84
  end
@@ -93,7 +93,7 @@ module Primer
93
93
  # <ol>
94
94
  # <li>Michael Jackson</li>
95
95
  # <li>Michael Bolton</li>
96
- # <li>Michael Buble</li>
96
+ # <li>Michael Bublé</li>
97
97
  # </ol>
98
98
  #
99
99
  # <p>And an unordered task list:</p>
@@ -88,20 +88,16 @@ module Primer
88
88
  # <% end %>
89
89
  # <% end %>
90
90
  #
91
- # @example With HTML body
91
+ # @example With multiple elements in the body
92
92
  # <%= render Primer::PopoverComponent.new do |component| %>
93
93
  # <% component.heading do %>
94
94
  # Activity feed
95
95
  # <% end %>
96
96
  # <% component.body(caret: :left) do %>
97
- # <p> This is the Popover body.</p>
98
- # <div>
99
- # This is using HTML.
100
- # <ul>
101
- # <li>Thing #1</li>
102
- # <li>Thing #2</li>
103
- # </ul>
104
- # </div>
97
+ # <p>This is the Popover body.</p>
98
+ # <%= render Primer::ButtonComponent.new(type: :submit) do %>
99
+ # Got it!
100
+ # <% end %>
105
101
  # <% end %>
106
102
  # <% end %>
107
103
  #
@@ -5,3 +5,4 @@ import './time_ago_component';
5
5
  import './local_time';
6
6
  import './image_crop';
7
7
  import './dropdown';
8
+ import './alpha/tooltip';
@@ -5,3 +5,4 @@ import './time_ago_component';
5
5
  import './local_time';
6
6
  import './image_crop';
7
7
  import './dropdown';
8
+ import './alpha/tooltip';
@@ -5,3 +5,4 @@ import './time_ago_component'
5
5
  import './local_time'
6
6
  import './image_crop'
7
7
  import './dropdown'
8
+ import './alpha/tooltip'
@@ -1,5 +1,5 @@
1
1
  <%= render Primer::BaseComponent.new(**@system_arguments) do %>
2
2
  <%= heading %>
3
- <%= actions %>
4
3
  <%= description %>
4
+ <%= actions %>
5
5
  <% end %>
@@ -4,7 +4,7 @@ module Primer
4
4
  # Use `Subhead` as the start of a section. The `:heading` slot will render an `<h2>` font-sized text.
5
5
  #
6
6
  # - Optionally set the `:description` slot to render a short description and the `:actions` slot for a related action.
7
- # - Use a succint, one-line description for the `:description` slot. For longer descriptions, omit the description slot and render a paragraph below the `Subhead`.
7
+ # - Use a succinct, one-line description for the `:description` slot. For longer descriptions, omit the description slot and render a paragraph below the `Subhead`.
8
8
  # - 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) %>.
9
9
  #
10
10
  # @accessibility
@@ -3,7 +3,7 @@
3
3
  module Primer
4
4
  # `Tooltip` is a wrapper component that will apply a tooltip to the provided content.
5
5
  class Tooltip < Primer::Component
6
- status :beta
6
+ status :deprecated
7
7
 
8
8
  DIRECTION_DEFAULT = :n
9
9
  ALIGN_DEFAULT = :default
@@ -4,7 +4,7 @@ module Primer
4
4
  # Module to allow components to deal with the `test_selector` argument.
5
5
  # It will only add the selector if env is not Production.
6
6
  #
7
- # test_selecotr: "foo" => data-test-selector="foo"
7
+ # test_selector: "foo" => data-test-selector="foo"
8
8
  module TestSelectorHelper
9
9
  TEST_SELECTOR_TAG = :test_selector
10
10
 
@@ -39,6 +39,10 @@
39
39
  - color-fg-severe
40
40
  :danger:
41
41
  - color-fg-danger
42
+ :open:
43
+ - color-fg-open
44
+ :closed:
45
+ - color-fg-closed
42
46
  :done:
43
47
  - color-fg-done
44
48
  :sponsors:
@@ -78,6 +82,14 @@
78
82
  - color-bg-danger
79
83
  :danger_emphasis:
80
84
  - color-bg-danger-emphasis
85
+ :open:
86
+ - color-bg-open
87
+ :open_emphasis:
88
+ - color-bg-open-emphasis
89
+ :closed:
90
+ - color-bg-closed
91
+ :closed_emphasis:
92
+ - color-bg-closed-emphasis
81
93
  :done:
82
94
  - color-bg-done
83
95
  :done_emphasis:
@@ -86,6 +98,8 @@
86
98
  - color-bg-sponsors
87
99
  :sponsors_emphasis:
88
100
  - color-bg-sponsors-emphasis
101
+ :transparent:
102
+ - color-bg-transparent
89
103
  :border_color:
90
104
  :default:
91
105
  - color-border-default
@@ -113,6 +127,14 @@
113
127
  - color-border-danger
114
128
  :danger_emphasis:
115
129
  - color-border-danger-emphasis
130
+ :open:
131
+ - color-border-open
132
+ :open_emphasis:
133
+ - color-border-open-emphasis
134
+ :closed:
135
+ - color-border-closed
136
+ :closed_emphasis:
137
+ - color-border-closed-emphasis
116
138
  :done:
117
139
  - color-border-done
118
140
  :done_emphasis:
@@ -1395,6 +1417,12 @@
1395
1417
  - hide-lg
1396
1418
  :xl:
1397
1419
  - hide-xl
1420
+ :whenNarrow:
1421
+ - hide-whenNarrow
1422
+ :whenRegular:
1423
+ - hide-whenRegular
1424
+ :whenWide:
1425
+ - hide-whenWide
1398
1426
  :container:
1399
1427
  :sm:
1400
1428
  - container-sm
@@ -15,7 +15,7 @@ module ERBLint
15
15
  constant: "TAG_OPTIONS"
16
16
  ).freeze
17
17
 
18
- # CloseButton component has preference when this class is seen in conjuction with `btn`.
18
+ # CloseButton component has preference when this class is seen in conjunction with `btn`.
19
19
  DISALLOWED_CLASSES = %w[close-button].freeze
20
20
  CLASSES = %w[btn btn-link].freeze
21
21
  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."
@@ -5,7 +5,7 @@ module Primer
5
5
  module VERSION
6
6
  MAJOR = 0
7
7
  MINOR = 0
8
- PATCH = 67
8
+ PATCH = 70
9
9
 
10
10
  STRING = [MAJOR, MINOR, PATCH].join(".")
11
11
  end
@@ -0,0 +1,35 @@
1
+ # frozen_string_literal: true
2
+
3
+ require "rubocop"
4
+
5
+ # :nocov:
6
+ module RuboCop
7
+ module Cop
8
+ module Primer
9
+ # This cop ensures that components don't use deprecated component names
10
+ #
11
+ # bad
12
+ # Primer::ComponentNameComponent.new()
13
+ #
14
+ # good
15
+ # Primer::Beta::ComponentName.new()
16
+ class ComponentNameMigration < BaseCop
17
+ DEPRECATIONS = {
18
+ "Primer::TestComponent" => "Primer::Beta::Test"
19
+ }.freeze
20
+
21
+ def on_send(node)
22
+ return unless node.method_name == :new && !node.receiver.nil? && DEPRECATIONS.key?(node.receiver.const_name)
23
+
24
+ add_offense(node.receiver, message: "Don't use deprecated names")
25
+ end
26
+
27
+ def autocorrect(node)
28
+ lambda do |corrector|
29
+ corrector.replace(node, DEPRECATIONS[node.const_name])
30
+ end
31
+ end
32
+ end
33
+ end
34
+ end
35
+ end
@@ -207,7 +207,7 @@ module RuboCop
207
207
  return node.source unless node.type == :str
208
208
  return ":#{node.value}" unless node.value.include?("-")
209
209
 
210
- # If the icon contains `-` we need to cast the string as a symbole
210
+ # If the icon contains `-` we need to cast the string as a symbol
211
211
  # E.g: `arrow-down` becomes `:"arrow-down"`
212
212
  ":#{node.source}"
213
213
  end
data/lib/tasks/docs.rake CHANGED
@@ -82,7 +82,8 @@ namespace :docs do
82
82
  Primer::Alpha::UnderlineNav,
83
83
  Primer::Alpha::UnderlinePanels,
84
84
  Primer::Alpha::TabNav,
85
- Primer::Alpha::TabPanels
85
+ Primer::Alpha::TabPanels,
86
+ Primer::Alpha::Tooltip
86
87
  ]
87
88
 
88
89
  js_components = [
@@ -94,7 +95,10 @@ namespace :docs do
94
95
  Primer::TabContainerComponent,
95
96
  Primer::TimeAgoComponent,
96
97
  Primer::Alpha::UnderlinePanels,
97
- Primer::Alpha::TabPanels
98
+ Primer::Alpha::TabPanels,
99
+ Primer::Alpha::Tooltip,
100
+ Primer::ButtonComponent,
101
+ Primer::LinkComponent
98
102
  ]
99
103
 
100
104
  all_components = Primer::Component.descendants - [Primer::BaseComponent]
@@ -106,7 +110,8 @@ namespace :docs do
106
110
  errors = []
107
111
 
108
112
  # Deletes docs before regenerating them, guaranteeing that we don't keep stale docs.
109
- FileUtils.rm_rf(Dir.glob("docs/content/components/**/*.md"))
113
+ components_content_glob = File.join(*%w[docs content components ** *.md])
114
+ FileUtils.rm_rf(components_content_glob)
110
115
 
111
116
  components.sort_by(&:name).each do |component|
112
117
  documentation = registry.get(component.name)
@@ -114,7 +119,7 @@ namespace :docs do
114
119
  data = docs_metadata(component)
115
120
 
116
121
  path = Pathname.new(data[:path])
117
- path.dirname.mkdir unless path.dirname.exist?
122
+ path.dirname.mkpath unless path.dirname.exist?
118
123
  File.open(path, "w") do |f|
119
124
  f.puts("---")
120
125
  f.puts("title: #{data[:title]}")
@@ -167,12 +172,12 @@ namespace :docs do
167
172
  f.puts("| Name | Type | Default | Description |")
168
173
  f.puts("| :- | :- | :- | :- |")
169
174
 
170
- docummented_params = params.map(&:name)
175
+ documented_params = params.map(&:name)
171
176
  component_params = component.instance_method(:initialize).parameters.map { |p| p.last.to_s }
172
177
 
173
- if (docummented_params & component_params).size != component_params.size
178
+ if (documented_params & component_params).size != component_params.size
174
179
  err = { arguments: {} }
175
- (component_params - docummented_params).each do |arg|
180
+ (component_params - documented_params).each do |arg|
176
181
  err[:arguments][arg] = "Not documented"
177
182
  end
178
183
 
@@ -86,7 +86,7 @@ namespace :utilities do
86
86
  classname.sub!(/^[^-]+-/, "")
87
87
  end
88
88
 
89
- # Change the rest from hypens to underscores
89
+ # Change the rest from hyphens to underscores
90
90
  classname.sub!(/-/, "_")
91
91
 
92
92
  # convert padding/margin negative values ie n7 to -7
data/static/arguments.yml CHANGED
@@ -95,6 +95,30 @@
95
95
  type: Hash
96
96
  default: N/A
97
97
  description: "[System arguments](/system-arguments)"
98
+ - component: Tooltip
99
+ source: https://github.com/primer/view_components/tree/main/app/components/primer/alpha/tooltip.rb
100
+ parameters:
101
+ - name: for_id
102
+ type: String
103
+ default: N/A
104
+ description: The ID of the element that the tooltip should be attached to.
105
+ - name: type
106
+ type: Symbol
107
+ default: N/A
108
+ description: One of `:description` and `:label`.
109
+ - name: direction
110
+ type: Symbol
111
+ default: "`:s`"
112
+ description: One of `:e`, `:n`, `:ne`, `:nw`, `:s`, `:se`, `:sw`, or `:w`.
113
+ - name: text
114
+ type: String
115
+ default: N/A
116
+ description: The text content of the tooltip. This should be brief and no longer
117
+ than a sentence.
118
+ - name: system_arguments
119
+ type: Hash
120
+ default: N/A
121
+ description: "[System arguments](/system-arguments)"
98
122
  - component: UnderlineNav
99
123
  source: https://github.com/primer/view_components/tree/main/app/components/primer/alpha/underline_nav.rb
100
124
  parameters:
@@ -165,6 +189,10 @@
165
189
  - component: AutoComplete
166
190
  source: https://github.com/primer/view_components/tree/main/app/components/primer/beta/auto_complete.rb
167
191
  parameters:
192
+ - name: label_text
193
+ type: String
194
+ default: N/A
195
+ description: The label of the input.
168
196
  - name: src
169
197
  type: String
170
198
  default: N/A
@@ -173,10 +201,33 @@
173
201
  type: String
174
202
  default: N/A
175
203
  description: Id of the input element.
204
+ - name: input_name
205
+ type: String
206
+ default: "`nil`"
207
+ description: Optional name of the input element, defaults to `input_id` when not
208
+ set.
176
209
  - name: list_id
177
210
  type: String
178
211
  default: N/A
179
212
  description: Id of the list element.
213
+ - name: with_icon
214
+ type: Boolean
215
+ default: "`false`"
216
+ description: Controls if a search icon is visible, defaults to `false`.
217
+ - name: is_label_visible
218
+ type: Boolean
219
+ default: "`true`"
220
+ description: Controls if the label is visible. If `false`, screen reader only
221
+ text will be added.
222
+ - name: is_clearable
223
+ type: Boolean
224
+ default: "`false`"
225
+ description: Adds optional clear button.
226
+ - name: is_label_inline
227
+ type: Boolean
228
+ default: "`false`"
229
+ description: Controls if the label is inline. On smaller screens, label will always
230
+ become stacked.
180
231
  - name: system_arguments
181
232
  type: Hash
182
233
  default: N/A
@@ -444,7 +495,7 @@
444
495
  - name: reset
445
496
  type: Boolean
446
497
  default: "`false`"
447
- description: Defatuls to false. If set to true, it will remove the default caret
498
+ description: Defaults to false. If set to true, it will remove the default caret
448
499
  and remove style from the summary element
449
500
  - name: system_arguments
450
501
  type: Hash
@@ -6,12 +6,12 @@
6
6
  "Primer::Alpha::Layout::Sidebar": "",
7
7
  "Primer::Alpha::TabNav": "",
8
8
  "Primer::Alpha::TabPanels": "",
9
+ "Primer::Alpha::Tooltip": "",
9
10
  "Primer::Alpha::UnderlineNav": "",
10
11
  "Primer::Alpha::UnderlinePanels": "",
11
12
  "Primer::BaseButton": "",
12
13
  "Primer::BaseComponent": "",
13
14
  "Primer::Beta::AutoComplete": "",
14
- "Primer::Beta::AutoComplete::Input": "",
15
15
  "Primer::Beta::AutoComplete::Item": "",
16
16
  "Primer::Beta::Avatar": "",
17
17
  "Primer::Beta::AvatarStack": "",