primer_view_components 0.0.31 → 0.0.36

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (65) hide show
  1. checksums.yaml +4 -4
  2. data/CHANGELOG.md +94 -0
  3. data/README.md +2 -2
  4. data/app/components/primer/{auto_complete_component.rb → auto_complete.rb} +12 -12
  5. data/app/components/primer/{auto_complete_component.d.ts → auto_complete/auto_complete.d.ts} +0 -0
  6. data/app/components/primer/{auto_complete_component.html.erb → auto_complete/auto_complete.html.erb} +0 -0
  7. data/app/components/primer/{auto_complete_component.js → auto_complete/auto_complete.js} +0 -0
  8. data/app/components/primer/{auto_complete_component.ts → auto_complete/auto_complete.ts} +0 -0
  9. data/app/components/primer/auto_complete/auto_component.d.ts +1 -0
  10. data/app/components/primer/auto_complete/auto_component.js +1 -0
  11. data/app/components/primer/auto_complete/item.rb +42 -0
  12. data/app/components/primer/avatar_stack_component.rb +1 -1
  13. data/app/components/primer/base_component.rb +115 -85
  14. data/app/components/primer/blankslate_component.html.erb +1 -1
  15. data/app/components/primer/blankslate_component.rb +0 -2
  16. data/app/components/primer/border_box_component.rb +0 -2
  17. data/app/components/primer/breadcrumb_component.rb +0 -1
  18. data/app/components/primer/button_component.rb +37 -16
  19. data/app/components/primer/button_group_component.rb +3 -5
  20. data/app/components/primer/button_marketing_component.rb +12 -12
  21. data/app/components/primer/close_button.rb +30 -0
  22. data/app/components/primer/component.rb +3 -0
  23. data/app/components/primer/details_component.rb +0 -1
  24. data/app/components/primer/dropdown/menu_component.rb +0 -2
  25. data/app/components/primer/dropdown_component.rb +1 -3
  26. data/app/components/primer/dropdown_menu_component.rb +1 -1
  27. data/app/components/primer/flash_component.html.erb +2 -2
  28. data/app/components/primer/flash_component.rb +10 -12
  29. data/app/components/primer/foo_bar.d.ts +1 -0
  30. data/app/components/primer/foo_bar.js +1 -0
  31. data/app/components/primer/hidden_text_expander.rb +43 -0
  32. data/app/components/primer/layout_component.rb +0 -2
  33. data/app/components/primer/link_component.rb +9 -9
  34. data/app/components/primer/menu_component.rb +2 -4
  35. data/app/components/primer/navigation/tab_component.html.erb +11 -0
  36. data/app/components/primer/navigation/tab_component.rb +126 -0
  37. data/app/components/primer/octicon_component.rb +5 -8
  38. data/app/components/primer/popover_component.rb +0 -1
  39. data/app/components/primer/primer.d.ts +1 -1
  40. data/app/components/primer/primer.js +1 -1
  41. data/app/components/primer/primer.ts +1 -1
  42. data/app/components/primer/progress_bar_component.rb +0 -1
  43. data/app/components/primer/spinner_component.html.erb +1 -3
  44. data/app/components/primer/spinner_component.rb +1 -0
  45. data/app/components/primer/state_component.rb +13 -13
  46. data/app/components/primer/subhead_component.rb +1 -3
  47. data/app/components/primer/tab_nav_component.html.erb +8 -10
  48. data/app/components/primer/tab_nav_component.rb +63 -76
  49. data/app/components/primer/time_ago_component.rb +2 -1
  50. data/app/components/primer/timeline_item_component.rb +1 -2
  51. data/app/components/primer/{truncate_component.rb → truncate.rb} +8 -6
  52. data/app/components/primer/underline_nav_component.html.erb +19 -7
  53. data/app/components/primer/underline_nav_component.rb +114 -16
  54. data/app/lib/primer/classify.rb +5 -14
  55. data/app/lib/primer/classify/cache.rb +14 -4
  56. data/app/lib/primer/classify/spacing.rb +63 -0
  57. data/app/lib/primer/tabbed_component_helper.rb +39 -0
  58. data/app/lib/primer/view_helper.rb +2 -2
  59. data/lib/primer/view_components/version.rb +1 -1
  60. data/static/statuses.json +1 -1
  61. metadata +110 -31
  62. data/app/assets/javascripts/primer_view_components.js.map.orig +0 -5
  63. data/app/assets/javascripts/primer_view_components.js.orig +0 -6
  64. data/app/components/primer/auto_complete_item_component.rb +0 -40
  65. data/app/components/primer/slot.rb +0 -10
@@ -3,7 +3,8 @@
3
3
  module Primer
4
4
  # Use Primer::TimeAgoComponent to display a time relative to how long ago it was. This component requires JavaScript.
5
5
  class TimeAgoComponent < Primer::Component
6
- #
6
+ status :beta
7
+
7
8
  # @example Default
8
9
  # <%= render(Primer::TimeAgoComponent.new(time: Time.at(628232400))) %>
9
10
  #
@@ -3,7 +3,6 @@
3
3
  module Primer
4
4
  # Use `TimelineItem` to display items on a vertical timeline, connected by badge elements.
5
5
  class TimelineItemComponent < Primer::Component
6
- include ViewComponent::SlotableV2
7
6
  status :beta
8
7
 
9
8
  # Avatar to be rendered to the left of the Badge.
@@ -78,7 +77,7 @@ module Primer
78
77
 
79
78
  def call
80
79
  render(Primer::BaseComponent.new(**@system_arguments)) do
81
- render(Primer::OcticonComponent.new(icon: @icon))
80
+ render(Primer::OcticonComponent.new(@icon))
82
81
  end
83
82
  end
84
83
  end
@@ -1,21 +1,23 @@
1
1
  # frozen_string_literal: true
2
2
 
3
3
  module Primer
4
- # Use TruncateComponent to shorten overflowing text with an ellipsis.
5
- class TruncateComponent < Primer::Component
4
+ # Use Truncate to shorten overflowing text with an ellipsis.
5
+ class Truncate < Primer::Component
6
+ status :beta
7
+
6
8
  # @example Default
7
9
  # <div class="col-2">
8
- # <%= render(Primer::TruncateComponent.new(tag: :p)) { "branch-name-that-is-really-long" } %>
10
+ # <%= render(Primer::Truncate.new(tag: :p)) { "branch-name-that-is-really-long" } %>
9
11
  # </div>
10
12
  #
11
13
  # @example Inline
12
- # <%= render(Primer::TruncateComponent.new(tag: :span, inline: true)) { "branch-name-that-is-really-long" } %>
14
+ # <%= render(Primer::Truncate.new(tag: :span, inline: true)) { "branch-name-that-is-really-long" } %>
13
15
  #
14
16
  # @example Expandable
15
- # <%= render(Primer::TruncateComponent.new(tag: :span, inline: true, expandable: true)) { "branch-name-that-is-really-long" } %>
17
+ # <%= render(Primer::Truncate.new(tag: :span, inline: true, expandable: true)) { "branch-name-that-is-really-long" } %>
16
18
  #
17
19
  # @example Custom size
18
- # <%= render(Primer::TruncateComponent.new(tag: :span, inline: true, expandable: true, max_width: 100)) { "branch-name-that-is-really-long" } %>
20
+ # <%= render(Primer::Truncate.new(tag: :span, inline: true, expandable: true, max_width: 100)) { "branch-name-that-is-really-long" } %>
19
21
  #
20
22
  # @param inline [Boolean] Whether the element is inline (or inline-block).
21
23
  # @param expandable [Boolean] Whether the entire string should be revealed on hover. Can only be used in conjunction with `inline`.
@@ -1,11 +1,23 @@
1
- <%= render Primer::BaseComponent.new(**@system_arguments) do %>
2
- <% if @align == :right %>
3
- <%= actions %>
4
- <% end %>
1
+ <%= wrapper do %>
2
+ <%= render Primer::BaseComponent.new(**@system_arguments) do %>
3
+ <% if @align == :right %>
4
+ <%= actions %>
5
+ <% end %>
6
+
7
+ <%= render body do %>
8
+ <% tabs.each do |tab| %>
9
+ <%= tab %>
10
+ <% end %>
11
+ <% end %>
5
12
 
6
- <%= body %>
13
+ <% if @align == :left %>
14
+ <%= actions %>
15
+ <% end %>
16
+ <% end %>
7
17
 
8
- <% if @align == :left %>
9
- <%= actions %>
18
+ <% if @with_panel %>
19
+ <% tabs.each do |tab| %>
20
+ <%= tab.panel %>
21
+ <% end %>
10
22
  <% end %>
11
23
  <% end %>
@@ -5,34 +5,66 @@ module Primer
5
5
  # underlined selected state, typically used for navigation placed at the top
6
6
  # of the page.
7
7
  class UnderlineNavComponent < Primer::Component
8
- include ViewComponent::SlotableV2
8
+ include Primer::TabbedComponentHelper
9
9
 
10
10
  ALIGN_DEFAULT = :left
11
11
  ALIGN_OPTIONS = [ALIGN_DEFAULT, :right].freeze
12
12
 
13
- # Use the body for the navigation items
13
+ BODY_TAG_DEFAULT = :div
14
+ BODY_TAG_OPTIONS = [BODY_TAG_DEFAULT, :ul].freeze
15
+
16
+ # Use the tabs to list navigation items. For more information, refer to <%= link_to_component(Primer::Navigation::TabComponent) %>.
14
17
  #
18
+ # @param selected [Boolean] Whether the tab is selected.
15
19
  # @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
16
- renders_one :body, lambda { |**system_arguments|
17
- system_arguments[:classes] = class_names("UnderlineNav-body", "list-style-none", system_arguments[:classes])
18
- system_arguments[:tag] ||= :ul
20
+ renders_many :tabs, lambda { |selected: false, **system_arguments|
21
+ system_arguments[:classes] = class_names(
22
+ "UnderlineNav-item",
23
+ system_arguments[:classes]
24
+ )
19
25
 
20
- Primer::BaseComponent.new(**system_arguments) { content }
26
+ Primer::Navigation::TabComponent.new(
27
+ list: list?,
28
+ selected: selected,
29
+ with_panel: @with_panel,
30
+ icon_classes: "UnderlineNav-octicon",
31
+ **system_arguments
32
+ )
21
33
  }
22
34
 
23
- # Use actions for a call to action
35
+ # Use actions for a call to action.
24
36
  #
25
37
  # @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
26
38
  renders_one :actions, lambda { |**system_arguments|
27
39
  system_arguments[:tag] ||= :div
28
40
  system_arguments[:classes] = class_names("UnderlineNav-actions", system_arguments[:classes])
29
- Primer::BaseComponent.new(**system_arguments) { content }
41
+
42
+ Primer::BaseComponent.new(**system_arguments)
30
43
  }
31
44
 
32
45
  # @example Default
33
- # <%= render(Primer::UnderlineNavComponent.new) do |component| %>
34
- # <% component.body do %>
35
- # <%= render(Primer::LinkComponent.new(href: "#url")) { "Item 1" } %>
46
+ # <%= render(Primer::UnderlineNavComponent.new(label: "Default")) do |component| %>
47
+ # <% component.tab(href: "#", selected: true) { "Item 1" } %>
48
+ # <% component.tab(href: "#") { "Item 2" } %>
49
+ # <% component.actions do %>
50
+ # <%= render(Primer::ButtonComponent.new) { "Button!" } %>
51
+ # <% end %>
52
+ # <% end %>
53
+ #
54
+ # @example With icons and counters
55
+ # <%= render(Primer::UnderlineNavComponent.new(label: "With icons and counters")) do |component| %>
56
+ # <% component.tab(href: "#", selected: true) do |t| %>
57
+ # <% t.icon(icon: :star) %>
58
+ # <% t.text { "Item 1" } %>
59
+ # <% end %>
60
+ # <% component.tab(href: "#") do |t| %>
61
+ # <% t.icon(icon: :star) %>
62
+ # <% t.text { "Item 2" } %>
63
+ # <% t.counter(count: 10) %>
64
+ # <% end %>
65
+ # <% component.tab(href: "#") do |t| %>
66
+ # <% t.text { "Item 3" } %>
67
+ # <% t.counter(count: 10) %>
36
68
  # <% end %>
37
69
  # <% component.actions do %>
38
70
  # <%= render(Primer::ButtonComponent.new) { "Button!" } %>
@@ -40,27 +72,93 @@ module Primer
40
72
  # <% end %>
41
73
  #
42
74
  # @example Align right
43
- # <%= render(Primer::UnderlineNavComponent.new(align: :right)) do |component| %>
44
- # <% component.body do %>
45
- # <%= render(Primer::LinkComponent.new(href: "#url")) { "Item 1" } %>
75
+ # <%= render(Primer::UnderlineNavComponent.new(label: "Align right", align: :right)) do |component| %>
76
+ # <% component.tab(href: "#", selected: true) do |t| %>
77
+ # <% t.text { "Item 1" } %>
78
+ # <% end %>
79
+ # <% component.tab(href: "#") do |t| %>
80
+ # <% t.text { "Item 2" } %>
46
81
  # <% end %>
47
82
  # <% component.actions do %>
48
83
  # <%= render(Primer::ButtonComponent.new) { "Button!" } %>
49
84
  # <% end %>
50
85
  # <% end %>
51
86
  #
87
+ # @example As a list
88
+ # <%= render(Primer::UnderlineNavComponent.new(label: "As a list", body_arguments: { tag: :ul })) do |component| %>
89
+ # <% component.tab(href: "#", selected: true) do |t| %>
90
+ # <% t.text { "Item 1" } %>
91
+ # <% end %>
92
+ # <% component.tab(href: "#") do |t| %>
93
+ # <% t.text { "Item 2" } %>
94
+ # <% end %>
95
+ # <% component.actions do %>
96
+ # <%= render(Primer::ButtonComponent.new) { "Button!" } %>
97
+ # <% end %>
98
+ # <% end %>
99
+ #
100
+ # @example With panels
101
+ # <%= render(Primer::UnderlineNavComponent.new(label: "With panels", with_panel: true)) do |component| %>
102
+ # <% component.tab(selected: true) do |t| %>
103
+ # <% t.text { "Item 1" } %>
104
+ # <% t.panel do %>
105
+ # Panel 1
106
+ # <% end %>
107
+ # <% end %>
108
+ # <% component.tab do |t| %>
109
+ # <% t.text { "Item 2" } %>
110
+ # <% t.panel do %>
111
+ # Panel 2
112
+ # <% end %>
113
+ # <% end %>
114
+ # <% component.actions do %>
115
+ # <%= render(Primer::ButtonComponent.new) { "Button!" } %>
116
+ # <% end %>
117
+ # <% end %>
118
+ #
119
+ # @param label [String] The `aria-label` on top level `<nav>` element.
120
+ # @param with_panel [Boolean] Whether the TabNav should navigate through pages or panels.
52
121
  # @param align [Symbol] <%= one_of(Primer::UnderlineNavComponent::ALIGN_OPTIONS) %> - Defaults to <%= Primer::UnderlineNavComponent::ALIGN_DEFAULT %>
122
+ # @param body_arguments [Hash] <%= link_to_system_arguments_docs %> for the body wrapper.
53
123
  # @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
54
- def initialize(align: ALIGN_DEFAULT, **system_arguments)
124
+ def initialize(label:, with_panel: false, align: ALIGN_DEFAULT, body_arguments: { tag: BODY_TAG_DEFAULT }, **system_arguments)
125
+ @with_panel = with_panel
55
126
  @align = fetch_or_fallback(ALIGN_OPTIONS, align, ALIGN_DEFAULT)
56
127
 
57
128
  @system_arguments = system_arguments
58
- @system_arguments[:tag] = :nav
129
+ @system_arguments[:tag] = navigation_tag(with_panel)
59
130
  @system_arguments[:classes] = class_names(
60
131
  @system_arguments[:classes],
61
132
  "UnderlineNav",
62
133
  "UnderlineNav--right" => @align == :right
63
134
  )
135
+
136
+ @body_arguments = body_arguments
137
+ @body_tag = fetch_or_fallback(BODY_TAG_OPTIONS, body_arguments[:tag]&.to_sym, BODY_TAG_DEFAULT)
138
+
139
+ @body_arguments[:tag] = @body_tag
140
+ @body_arguments[:classes] = class_names(
141
+ "UnderlineNav-body",
142
+ @body_arguments[:classes],
143
+ "list-style-none" => list?
144
+ )
145
+
146
+ if with_panel
147
+ @body_arguments[:role] = :tablist
148
+ @body_arguments[:"aria-label"] = label
149
+ else
150
+ @system_arguments[:"aria-label"] = label
151
+ end
152
+ end
153
+
154
+ private
155
+
156
+ def list?
157
+ @body_tag == :ul
158
+ end
159
+
160
+ def body
161
+ Primer::BaseComponent.new(**@body_arguments)
64
162
  end
65
163
  end
66
164
  end
@@ -3,12 +3,11 @@
3
3
  module Primer
4
4
  # :nodoc:
5
5
  class Classify
6
- MARGIN_DIRECTION_KEYS = %i[mt ml mb mr].freeze
7
- SPACING_KEYS = (%i[m my mx p py px pt pl pb pr] + MARGIN_DIRECTION_KEYS).freeze
8
6
  DIRECTION_KEY = :direction
9
7
  JUSTIFY_CONTENT_KEY = :justify_content
10
8
  ALIGN_ITEMS_KEY = :align_items
11
9
  DISPLAY_KEY = :display
10
+ SPACING_KEYS = Primer::Classify::Spacing::KEYS
12
11
  RESPONSIVE_KEYS = ([DISPLAY_KEY, DIRECTION_KEY, JUSTIFY_CONTENT_KEY, ALIGN_ITEMS_KEY, :col, :float] + SPACING_KEYS).freeze
13
12
  BREAKPOINTS = ["", "-sm", "-md", "-lg", "-xl"].freeze
14
13
 
@@ -184,16 +183,10 @@ module Primer
184
183
  return if val.nil? || val == ""
185
184
 
186
185
  if SPACING_KEYS.include?(key)
187
- if MARGIN_DIRECTION_KEYS.include?(key)
188
- raise ArgumentError, "value of #{key} must be between -6 and 6" if val < -6 || val > 6
189
- elsif !((key == :mx || key == :my) && val == :auto)
190
- raise ArgumentError, "value of #{key} must be between 0 and 6" if val.negative? || val > 6
191
- end
192
- end
193
-
194
- if BOOLEAN_MAPPINGS.key?(key)
195
- BOOLEAN_MAPPINGS[key][:mappings].map { |m| m[:css_class] if m[:value] == val }.compact.each do |css_class|
196
- memo[:classes] << css_class
186
+ memo[:classes] << Primer::Classify::Spacing.spacing(key, val, breakpoint)
187
+ elsif BOOLEAN_MAPPINGS.key?(key)
188
+ BOOLEAN_MAPPINGS[key][:mappings].each do |m|
189
+ memo[:classes] << m[:css_class] if m[:value] == val && m[:css_class].present?
197
190
  end
198
191
  elsif key == BG_KEY
199
192
  if val.to_s.start_with?("#")
@@ -248,8 +241,6 @@ module Primer
248
241
  memo[:classes] << "text-#{val.to_s.dasherize}"
249
242
  elsif TYPOGRAPHY_KEYS.include?(key)
250
243
  memo[:classes] << "f#{val.to_s.dasherize}"
251
- elsif MARGIN_DIRECTION_KEYS.include?(key) && val.negative?
252
- memo[:classes] << "#{key.to_s.dasherize}#{breakpoint}-n#{val.abs}"
253
244
  elsif key == BOX_SHADOW_KEY
254
245
  memo[:classes] << if val == true
255
246
  "color-shadow-small"
@@ -20,13 +20,23 @@ module Primer
20
20
 
21
21
  def preload!
22
22
  preload(
23
- keys: Primer::Classify::MARGIN_DIRECTION_KEYS,
24
- values: [-6, -5, -4, -3, -2, -1, 0, 1, 2, 3, 4, 5, 6]
23
+ keys: Primer::Classify::Spacing::MARGIN_DIRECTION_MAPPINGS.keys,
24
+ values: Primer::Classify::Spacing::MARGIN_DIRECTION_OPTIONS
25
25
  )
26
26
 
27
27
  preload(
28
- keys: (Primer::Classify::SPACING_KEYS - Primer::Classify::MARGIN_DIRECTION_KEYS),
29
- values: [0, 1, 2, 3, 4, 5, 6]
28
+ keys: Primer::Classify::Spacing::BASE_MAPPINGS.keys,
29
+ values: Primer::Classify::Spacing::BASE_OPTIONS
30
+ )
31
+
32
+ preload(
33
+ keys: Primer::Classify::Spacing::AUTO_MAPPINGS.keys,
34
+ values: Primer::Classify::Spacing::AUTO_OPTIONS
35
+ )
36
+
37
+ preload(
38
+ keys: Primer::Classify::Spacing::RESPONSIVE_MAPPINGS.keys,
39
+ values: Primer::Classify::Spacing::RESPONSIVE_OPTIONS
30
40
  )
31
41
 
32
42
  preload(
@@ -0,0 +1,63 @@
1
+ # frozen_string_literal: true
2
+
3
+ module Primer
4
+ class Classify
5
+ # Handler for PrimerCSS spacing classes.
6
+ class Spacing
7
+ BASE_OPTIONS = (0..6).to_a.freeze
8
+ BASE_MAPPINGS = {
9
+ my: BASE_OPTIONS,
10
+ pb: BASE_OPTIONS,
11
+ pl: BASE_OPTIONS,
12
+ pr: BASE_OPTIONS,
13
+ pt: BASE_OPTIONS,
14
+ px: BASE_OPTIONS,
15
+ py: BASE_OPTIONS
16
+ }.freeze
17
+
18
+ MARGIN_DIRECTION_OPTIONS = [*(-6..-1), *BASE_OPTIONS].freeze
19
+ MARGIN_DIRECTION_MAPPINGS = {
20
+ mb: MARGIN_DIRECTION_OPTIONS,
21
+ ml: MARGIN_DIRECTION_OPTIONS,
22
+ mr: MARGIN_DIRECTION_OPTIONS,
23
+ mt: MARGIN_DIRECTION_OPTIONS
24
+ }.freeze
25
+
26
+ AUTO_OPTIONS = [*BASE_OPTIONS, :auto].freeze
27
+ AUTO_MAPPINGS = {
28
+ m: AUTO_OPTIONS,
29
+ mx: AUTO_OPTIONS
30
+ }.freeze
31
+
32
+ RESPONSIVE_OPTIONS = [*BASE_OPTIONS, :responsive].freeze
33
+ RESPONSIVE_MAPPINGS = {
34
+ p: RESPONSIVE_OPTIONS
35
+ }.freeze
36
+
37
+ MAPPINGS = {
38
+ **BASE_MAPPINGS,
39
+ **MARGIN_DIRECTION_MAPPINGS,
40
+ **AUTO_MAPPINGS,
41
+ **RESPONSIVE_MAPPINGS
42
+ }.freeze
43
+ KEYS = MAPPINGS.keys.freeze
44
+
45
+ class << self
46
+ def spacing(key, val, breakpoint)
47
+ validate(key, val) unless Rails.env.production?
48
+
49
+ return "#{key.to_s.dasherize}#{breakpoint}-n#{val.abs}" if val.is_a?(Numeric) && val.negative?
50
+
51
+ "#{key.to_s.dasherize}#{breakpoint}-#{val.to_s.dasherize}"
52
+ end
53
+
54
+ private
55
+
56
+ def validate(key, val)
57
+ raise ArgumentError, "#{key} is not a spacing key" unless KEYS.include?(key)
58
+ raise ArgumentError, "#{val} is not a valid value for :#{key}. Use one of #{MAPPINGS[key]}" unless MAPPINGS[key].include?(val)
59
+ end
60
+ end
61
+ end
62
+ end
63
+ end
@@ -0,0 +1,39 @@
1
+ # frozen_string_literal: true
2
+
3
+ require "active_support/concern"
4
+
5
+ module Primer
6
+ # Helper to share tab validation logic between components.
7
+ # The component will raise an error if there are 0 or 2+ selected tabs.
8
+ module TabbedComponentHelper
9
+ extend ActiveSupport::Concern
10
+
11
+ class MultipleSelectedTabsError < StandardError; end
12
+
13
+ def before_render
14
+ validate_single_selected_tab unless Rails.env.production?
15
+ end
16
+
17
+ private
18
+
19
+ def navigation_tag(with_panel)
20
+ with_panel ? :div : :nav
21
+ end
22
+
23
+ def wrapper
24
+ return yield unless @with_panel
25
+
26
+ render Primer::TabContainerComponent.new do
27
+ yield
28
+ end
29
+ end
30
+
31
+ def validate_single_selected_tab
32
+ raise MultipleSelectedTabsError, "only one tab can be selected" if selected_tabs_count > 1
33
+ end
34
+
35
+ def selected_tabs_count
36
+ @selected_tabs_count ||= tabs.count(&:selected)
37
+ end
38
+ end
39
+ end
@@ -12,8 +12,8 @@ module Primer
12
12
  }.freeze
13
13
 
14
14
  HELPERS.each do |name, component|
15
- define_method "primer_#{name}" do |**component_args, &block|
16
- render component.constantize.new(**component_args), &block
15
+ define_method "primer_#{name}" do |*args, **kwargs, &block|
16
+ render component.constantize.new(*args, **kwargs), &block
17
17
  end
18
18
  end
19
19
  end