primer_view_components 0.0.29 → 0.0.34
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.
- checksums.yaml +4 -4
- data/CHANGELOG.md +66 -0
- data/README.md +2 -2
- data/app/components/primer/auto_complete_component.rb +0 -2
- data/app/components/primer/auto_complete_item_component.rb +0 -2
- data/app/components/primer/avatar_stack_component.rb +0 -2
- data/app/components/primer/base_component.rb +115 -83
- data/app/components/primer/blankslate_component.html.erb +1 -1
- data/app/components/primer/blankslate_component.rb +0 -2
- data/app/components/primer/border_box_component.rb +0 -2
- data/app/components/primer/breadcrumb_component.rb +0 -1
- data/app/components/primer/button_component.rb +11 -11
- data/app/components/primer/button_group_component.rb +3 -5
- data/app/components/primer/button_marketing_component.rb +12 -12
- data/app/components/primer/component.rb +2 -0
- data/app/components/primer/details_component.rb +0 -1
- data/app/components/primer/dropdown/menu_component.rb +0 -2
- data/app/components/primer/dropdown_component.rb +0 -2
- data/app/components/primer/flash_component.html.erb +2 -2
- data/app/components/primer/flash_component.rb +10 -12
- data/app/components/primer/layout_component.rb +0 -2
- data/app/components/primer/link_component.rb +9 -9
- data/app/components/primer/menu_component.rb +2 -4
- data/app/components/primer/navigation/tab_component.html.erb +9 -0
- data/app/components/primer/navigation/tab_component.rb +102 -0
- data/app/components/primer/octicon_component.rb +5 -4
- data/app/components/primer/popover_component.rb +19 -3
- data/app/components/primer/progress_bar_component.rb +0 -1
- data/app/components/primer/spinner_component.html.erb +1 -3
- data/app/components/primer/spinner_component.rb +1 -0
- data/app/components/primer/state_component.rb +13 -13
- data/app/components/primer/subhead_component.rb +1 -3
- data/app/components/primer/tab_nav_component.html.erb +9 -11
- data/app/components/primer/tab_nav_component.rb +46 -73
- data/app/components/primer/time_ago_component.rb +2 -1
- data/app/components/primer/timeline_item_component.rb +1 -2
- data/app/components/primer/underline_nav_component.html.erb +19 -7
- data/app/components/primer/underline_nav_component.rb +80 -14
- data/app/lib/primer/classify.rb +5 -14
- data/app/lib/primer/classify/cache.rb +14 -4
- data/app/lib/primer/classify/functional_colors.rb +8 -6
- data/app/lib/primer/classify/spacing.rb +63 -0
- data/app/lib/primer/tabbed_component_helper.rb +35 -0
- data/app/lib/primer/view_helper.rb +2 -2
- data/lib/primer/view_components/version.rb +1 -1
- data/static/statuses.json +1 -1
- metadata +6 -3
- data/app/components/primer/slot.rb +0 -10
@@ -31,6 +31,7 @@ module Primer
|
|
31
31
|
@system_arguments = system_arguments
|
32
32
|
@system_arguments[:tag] = :svg
|
33
33
|
@system_arguments[:style] ||= DEFAULT_STYLE
|
34
|
+
@system_arguments[:animation] = :rotate
|
34
35
|
@system_arguments[:width] = SIZE_MAPPINGS[fetch_or_fallback(SIZE_OPTIONS, size, DEFAULT_SIZE)]
|
35
36
|
@system_arguments[:height] = SIZE_MAPPINGS[fetch_or_fallback(SIZE_OPTIONS, size, DEFAULT_SIZE)]
|
36
37
|
@system_arguments[:viewBox] = "0 0 16 16"
|
@@ -5,21 +5,21 @@ module Primer
|
|
5
5
|
class StateComponent < Primer::Component
|
6
6
|
status :beta
|
7
7
|
|
8
|
-
|
9
|
-
|
8
|
+
SCHEME_DEFAULT = :default
|
9
|
+
NEW_SCHEME_MAPPINGS = {
|
10
10
|
open: "State--open",
|
11
11
|
closed: "State--closed",
|
12
12
|
merged: "State--merged"
|
13
13
|
}.freeze
|
14
14
|
|
15
|
-
|
16
|
-
|
15
|
+
DEPRECATED_SCHEME_MAPPINGS = {
|
16
|
+
SCHEME_DEFAULT => "",
|
17
17
|
:green => "State--open",
|
18
18
|
:red => "State--closed",
|
19
19
|
:purple => "State--merged"
|
20
20
|
}.freeze
|
21
|
-
|
22
|
-
|
21
|
+
SCHEME_MAPPINGS = NEW_SCHEME_MAPPINGS.merge(DEPRECATED_SCHEME_MAPPINGS)
|
22
|
+
SCHEME_OPTIONS = SCHEME_MAPPINGS.keys
|
23
23
|
|
24
24
|
SIZE_DEFAULT = :default
|
25
25
|
SIZE_MAPPINGS = {
|
@@ -34,24 +34,24 @@ module Primer
|
|
34
34
|
# @example Default
|
35
35
|
# <%= render(Primer::StateComponent.new(title: "title")) { "State" } %>
|
36
36
|
#
|
37
|
-
# @example
|
37
|
+
# @example Schemes
|
38
38
|
# <%= render(Primer::StateComponent.new(title: "title")) { "Default" } %>
|
39
|
-
# <%= render(Primer::StateComponent.new(title: "title",
|
40
|
-
# <%= render(Primer::StateComponent.new(title: "title",
|
41
|
-
# <%= render(Primer::StateComponent.new(title: "title",
|
39
|
+
# <%= render(Primer::StateComponent.new(title: "title", scheme: :open)) { "Open" } %>
|
40
|
+
# <%= render(Primer::StateComponent.new(title: "title", scheme: :closed)) { "Closed" } %>
|
41
|
+
# <%= render(Primer::StateComponent.new(title: "title", scheme: :merged)) { "Merged" } %>
|
42
42
|
#
|
43
43
|
# @example Sizes
|
44
44
|
# <%= render(Primer::StateComponent.new(title: "title")) { "Default" } %>
|
45
45
|
# <%= render(Primer::StateComponent.new(title: "title", size: :small)) { "Small" } %>
|
46
46
|
#
|
47
47
|
# @param title [String] `title` HTML attribute.
|
48
|
-
# @param
|
48
|
+
# @param scheme [Symbol] Background color. <%= one_of(Primer::StateComponent::SCHEME_OPTIONS) %>
|
49
49
|
# @param tag [Symbol] HTML tag for element. <%= one_of(Primer::StateComponent::TAG_OPTIONS) %>
|
50
50
|
# @param size [Symbol] <%= one_of(Primer::StateComponent::SIZE_OPTIONS) %>
|
51
51
|
# @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
|
52
52
|
def initialize(
|
53
53
|
title:,
|
54
|
-
|
54
|
+
scheme: SCHEME_DEFAULT,
|
55
55
|
tag: TAG_DEFAULT,
|
56
56
|
size: SIZE_DEFAULT,
|
57
57
|
**system_arguments
|
@@ -62,7 +62,7 @@ module Primer
|
|
62
62
|
@system_arguments[:classes] = class_names(
|
63
63
|
@system_arguments[:classes],
|
64
64
|
"State",
|
65
|
-
|
65
|
+
SCHEME_MAPPINGS[fetch_or_fallback(SCHEME_OPTIONS, scheme, SCHEME_DEFAULT)],
|
66
66
|
SIZE_MAPPINGS[fetch_or_fallback(SIZE_OPTIONS, size, SIZE_DEFAULT)]
|
67
67
|
)
|
68
68
|
end
|
@@ -5,8 +5,6 @@ module Primer
|
|
5
5
|
class SubheadComponent < Primer::Component
|
6
6
|
status :beta
|
7
7
|
|
8
|
-
include ViewComponent::SlotableV2
|
9
|
-
|
10
8
|
# The heading
|
11
9
|
#
|
12
10
|
# @param danger [Boolean] Whether to style the heading as dangerous.
|
@@ -73,7 +71,7 @@ module Primer
|
|
73
71
|
# <% component.actions do %>
|
74
72
|
# <%= render(
|
75
73
|
# Primer::ButtonComponent.new(
|
76
|
-
# tag: :a, href: "http://www.google.com",
|
74
|
+
# tag: :a, href: "http://www.google.com", scheme: :danger
|
77
75
|
# )
|
78
76
|
# ) { "Action" } %>
|
79
77
|
# <% end %>
|
@@ -1,17 +1,15 @@
|
|
1
|
-
<%=
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
|
6
|
-
|
1
|
+
<%= wrapper do %>
|
2
|
+
<%= render Primer::BaseComponent.new(**@system_arguments) do %>
|
3
|
+
<nav role="tablist" aria-label="<%= @aria_label %>" class="tabnav-tabs">
|
4
|
+
<% tabs.each do |tab| %>
|
5
|
+
<%= tab %>
|
6
|
+
<% end %>
|
7
|
+
</nav>
|
8
|
+
<% end %>
|
7
9
|
|
8
10
|
<% if @with_panel %>
|
9
11
|
<% tabs.each do |tab| %>
|
10
|
-
|
11
|
-
<div role="tabpanel" <%= "hidden" if tab.hidden? %>>
|
12
|
-
<%= tab.panel %>
|
13
|
-
</div>
|
14
|
-
<% end %>
|
12
|
+
<%= tab.panel %>
|
15
13
|
<% end %>
|
16
14
|
<% end %>
|
17
15
|
<% end %>
|
@@ -3,34 +3,64 @@
|
|
3
3
|
module Primer
|
4
4
|
# Use TabNav to style navigation with a tab-based selected state, typically used for navigation placed at the top of the page.
|
5
5
|
class TabNavComponent < Primer::Component
|
6
|
-
include
|
6
|
+
include Primer::TabbedComponentHelper
|
7
7
|
|
8
|
-
|
9
|
-
class NoSelectedTabsError < StandardError; end
|
10
|
-
|
11
|
-
# Tabs to be rendered.
|
8
|
+
# Tabs to be rendered. For more information, refer to <%= link_to_component(Primer::Navigation::TabComponent) %>.
|
12
9
|
#
|
13
|
-
# @param title [String] Text to be rendered by the tab.
|
14
10
|
# @param selected [Boolean] Whether the tab is selected.
|
15
11
|
# @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
|
16
|
-
renders_many :tabs, lambda {
|
17
|
-
|
18
|
-
|
19
|
-
|
12
|
+
renders_many :tabs, lambda { |selected: false, **system_arguments|
|
13
|
+
system_arguments[:classes] = class_names(
|
14
|
+
"tabnav-tab",
|
15
|
+
system_arguments[:classes]
|
16
|
+
)
|
17
|
+
Primer::Navigation::TabComponent.new(selected: selected, with_panel: @with_panel, **system_arguments)
|
20
18
|
}
|
21
19
|
|
22
20
|
# @example Default
|
23
21
|
# <%= render(Primer::TabNavComponent.new) do |c| %>
|
24
|
-
# <% c.tab(selected: true,
|
25
|
-
# <% c.tab(
|
26
|
-
# <% c.tab(
|
22
|
+
# <% c.tab(selected: true, href: "#") { "Tab 1" }%>
|
23
|
+
# <% c.tab(href: "#") { "Tab 2" } %>
|
24
|
+
# <% c.tab(href: "#") { "Tab 3" } %>
|
25
|
+
# <% end %>
|
26
|
+
#
|
27
|
+
# @example With icons and counters
|
28
|
+
# <%= render(Primer::TabNavComponent.new) do |component| %>
|
29
|
+
# <% component.tab(href: "#", selected: true) do |t| %>
|
30
|
+
# <% t.icon(icon: :star) %>
|
31
|
+
# <% t.text { "Item 1" } %>
|
32
|
+
# <% end %>
|
33
|
+
# <% component.tab(href: "#") do |t| %>
|
34
|
+
# <% t.icon(icon: :star) %>
|
35
|
+
# <% t.text { "Item 2" } %>
|
36
|
+
# <% t.counter(count: 10) %>
|
37
|
+
# <% end %>
|
38
|
+
# <% component.tab(href: "#") do |t| %>
|
39
|
+
# <% t.text { "Item 3" } %>
|
40
|
+
# <% t.counter(count: 10) %>
|
41
|
+
# <% end %>
|
27
42
|
# <% end %>
|
28
43
|
#
|
29
44
|
# @example With panels
|
30
45
|
# <%= render(Primer::TabNavComponent.new(with_panel: true)) do |c| %>
|
31
|
-
# <% c.tab(selected: true
|
32
|
-
#
|
33
|
-
#
|
46
|
+
# <% c.tab(selected: true) do |t| %>
|
47
|
+
# <% t.text { "Tab 1" } %>
|
48
|
+
# <% t.panel do %>
|
49
|
+
# Panel 1
|
50
|
+
# <% end %>
|
51
|
+
# <% end %>
|
52
|
+
# <% c.tab do |t| %>
|
53
|
+
# <% t.text { "Tab 2" } %>
|
54
|
+
# <% t.panel do %>
|
55
|
+
# Panel 2
|
56
|
+
# <% end %>
|
57
|
+
# <% end %>
|
58
|
+
# <% c.tab do |t| %>
|
59
|
+
# <% t.text { "Tab 3" } %>
|
60
|
+
# <% t.panel do %>
|
61
|
+
# Panel 3
|
62
|
+
# <% end %>
|
63
|
+
# <% end %>
|
34
64
|
# <% end %>
|
35
65
|
#
|
36
66
|
# @param aria_label [String] Used to set the `aria-label` on the top level `<nav>` element.
|
@@ -47,62 +77,5 @@ module Primer
|
|
47
77
|
system_arguments[:classes]
|
48
78
|
)
|
49
79
|
end
|
50
|
-
|
51
|
-
def before_render
|
52
|
-
validate_single_selected_tab
|
53
|
-
end
|
54
|
-
|
55
|
-
private
|
56
|
-
|
57
|
-
def wrapper
|
58
|
-
@with_panel ? Primer::TabContainerComponent : Primer::BaseComponent
|
59
|
-
end
|
60
|
-
|
61
|
-
def validate_single_selected_tab
|
62
|
-
raise MultipleSelectedTabsError, "only one tab can be selected" if selected_tabs_count > 1
|
63
|
-
raise NoSelectedTabsError, "a tab must be selected" if selected_tabs_count != 1
|
64
|
-
end
|
65
|
-
|
66
|
-
def selected_tabs_count
|
67
|
-
@selected_tabs_count ||= tabs.count(&:selected)
|
68
|
-
end
|
69
|
-
|
70
|
-
# Tabs to be rendered.
|
71
|
-
class TabComponent < Primer::Component
|
72
|
-
attr_reader :selected
|
73
|
-
|
74
|
-
def initialize(title:, selected: false, **system_arguments)
|
75
|
-
@title = title
|
76
|
-
@selected = selected
|
77
|
-
@system_arguments = system_arguments
|
78
|
-
@system_arguments[:tag] ||= :a
|
79
|
-
@system_arguments[:role] = :tab
|
80
|
-
|
81
|
-
if selected
|
82
|
-
if @system_arguments[:tag] == :a
|
83
|
-
@system_arguments[:"aria-current"] = :page
|
84
|
-
else
|
85
|
-
@system_arguments[:"aria-selected"] = true
|
86
|
-
end
|
87
|
-
end
|
88
|
-
|
89
|
-
@system_arguments[:classes] = class_names(
|
90
|
-
"tabnav-tab",
|
91
|
-
system_arguments[:classes]
|
92
|
-
)
|
93
|
-
end
|
94
|
-
|
95
|
-
def call
|
96
|
-
render(Primer::BaseComponent.new(**@system_arguments)) { @title }
|
97
|
-
end
|
98
|
-
|
99
|
-
def panel
|
100
|
-
content
|
101
|
-
end
|
102
|
-
|
103
|
-
def hidden?
|
104
|
-
!@selected
|
105
|
-
end
|
106
|
-
end
|
107
80
|
end
|
108
81
|
end
|
@@ -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(
|
80
|
+
render(Primer::OcticonComponent.new(@icon))
|
82
81
|
end
|
83
82
|
end
|
84
83
|
end
|
@@ -1,11 +1,23 @@
|
|
1
|
-
<%=
|
2
|
-
|
3
|
-
|
4
|
-
|
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
|
-
|
13
|
+
<% if @align == :left %>
|
14
|
+
<%= actions %>
|
15
|
+
<% end %>
|
16
|
+
<% end %>
|
7
17
|
|
8
|
-
<% if @
|
9
|
-
|
18
|
+
<% if @with_panel %>
|
19
|
+
<% tabs.each do |tab| %>
|
20
|
+
<%= tab.panel %>
|
21
|
+
<% end %>
|
10
22
|
<% end %>
|
11
23
|
<% end %>
|
@@ -5,34 +5,61 @@ 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
|
8
|
+
include Primer::TabbedComponentHelper
|
9
9
|
|
10
10
|
ALIGN_DEFAULT = :left
|
11
11
|
ALIGN_OPTIONS = [ALIGN_DEFAULT, :right].freeze
|
12
12
|
|
13
|
-
#
|
13
|
+
# Use the tabs to list navigation items. For more information, refer to <%= link_to_component(Primer::Navigation::TabComponent) %>.
|
14
14
|
#
|
15
|
+
# @param selected [Boolean] Whether the tab is selected.
|
15
16
|
# @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
|
16
|
-
|
17
|
-
system_arguments[:classes] = class_names(
|
18
|
-
|
19
|
-
|
20
|
-
|
17
|
+
renders_many :tabs, lambda { |selected: false, **system_arguments|
|
18
|
+
system_arguments[:classes] = class_names(
|
19
|
+
"UnderlineNav-item",
|
20
|
+
system_arguments[:classes]
|
21
|
+
)
|
22
|
+
Primer::Navigation::TabComponent.new(
|
23
|
+
selected: selected,
|
24
|
+
with_panel: @with_panel,
|
25
|
+
icon_classes: "UnderlineNav-octicon",
|
26
|
+
**system_arguments
|
27
|
+
)
|
21
28
|
}
|
22
29
|
|
23
|
-
#
|
30
|
+
# Use actions for a call to action.
|
24
31
|
#
|
25
32
|
# @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
|
26
33
|
renders_one :actions, lambda { |**system_arguments|
|
27
34
|
system_arguments[:tag] ||= :div
|
28
35
|
system_arguments[:classes] = class_names("UnderlineNav-actions", system_arguments[:classes])
|
29
|
-
|
36
|
+
|
37
|
+
Primer::BaseComponent.new(**system_arguments)
|
30
38
|
}
|
31
39
|
|
32
40
|
# @example Default
|
33
41
|
# <%= render(Primer::UnderlineNavComponent.new) do |component| %>
|
34
|
-
# <% component.
|
35
|
-
#
|
42
|
+
# <% component.tab(href: "#", selected: true) { "Item 1" } %>
|
43
|
+
# <% component.tab(href: "#") { "Item 2" } %>
|
44
|
+
# <% component.actions do %>
|
45
|
+
# <%= render(Primer::ButtonComponent.new) { "Button!" } %>
|
46
|
+
# <% end %>
|
47
|
+
# <% end %>
|
48
|
+
#
|
49
|
+
# @example With icons and counters
|
50
|
+
# <%= render(Primer::UnderlineNavComponent.new) do |component| %>
|
51
|
+
# <% component.tab(href: "#", selected: true) do |t| %>
|
52
|
+
# <% t.icon(icon: :star) %>
|
53
|
+
# <% t.text { "Item 1" } %>
|
54
|
+
# <% end %>
|
55
|
+
# <% component.tab(href: "#") do |t| %>
|
56
|
+
# <% t.icon(icon: :star) %>
|
57
|
+
# <% t.text { "Item 2" } %>
|
58
|
+
# <% t.counter(count: 10) %>
|
59
|
+
# <% end %>
|
60
|
+
# <% component.tab(href: "#") do |t| %>
|
61
|
+
# <% t.text { "Item 3" } %>
|
62
|
+
# <% t.counter(count: 10) %>
|
36
63
|
# <% end %>
|
37
64
|
# <% component.actions do %>
|
38
65
|
# <%= render(Primer::ButtonComponent.new) { "Button!" } %>
|
@@ -41,26 +68,65 @@ module Primer
|
|
41
68
|
#
|
42
69
|
# @example Align right
|
43
70
|
# <%= render(Primer::UnderlineNavComponent.new(align: :right)) do |component| %>
|
44
|
-
# <% component.
|
45
|
-
#
|
71
|
+
# <% component.tab(href: "#", selected: true) do |t| %>
|
72
|
+
# <% t.text { "Item 1" } %>
|
73
|
+
# <% end %>
|
74
|
+
# <% component.tab(href: "#") do |t| %>
|
75
|
+
# <% t.text { "Item 2" } %>
|
76
|
+
# <% end %>
|
77
|
+
# <% component.actions do %>
|
78
|
+
# <%= render(Primer::ButtonComponent.new) { "Button!" } %>
|
79
|
+
# <% end %>
|
80
|
+
# <% end %>
|
81
|
+
#
|
82
|
+
# @example With panels
|
83
|
+
# <%= render(Primer::UnderlineNavComponent.new(with_panel: true)) do |component| %>
|
84
|
+
# <% component.tab(selected: true) do |t| %>
|
85
|
+
# <% t.text { "Item 1" } %>
|
86
|
+
# <% t.panel do %>
|
87
|
+
# Panel 1
|
88
|
+
# <% end %>
|
89
|
+
# <% end %>
|
90
|
+
# <% component.tab do |t| %>
|
91
|
+
# <% t.text { "Item 2" } %>
|
92
|
+
# <% t.panel do %>
|
93
|
+
# Panel 2
|
94
|
+
# <% end %>
|
46
95
|
# <% end %>
|
47
96
|
# <% component.actions do %>
|
48
97
|
# <%= render(Primer::ButtonComponent.new) { "Button!" } %>
|
49
98
|
# <% end %>
|
50
99
|
# <% end %>
|
51
100
|
#
|
101
|
+
# @param with_panel [Boolean] Whether the TabNav should navigate through pages or panels.
|
52
102
|
# @param align [Symbol] <%= one_of(Primer::UnderlineNavComponent::ALIGN_OPTIONS) %> - Defaults to <%= Primer::UnderlineNavComponent::ALIGN_DEFAULT %>
|
53
103
|
# @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
|
54
|
-
def initialize(align: ALIGN_DEFAULT, **system_arguments)
|
104
|
+
def initialize(with_panel: false, align: ALIGN_DEFAULT, body_classes: "", **system_arguments)
|
105
|
+
@with_panel = with_panel
|
55
106
|
@align = fetch_or_fallback(ALIGN_OPTIONS, align, ALIGN_DEFAULT)
|
56
107
|
|
57
108
|
@system_arguments = system_arguments
|
58
109
|
@system_arguments[:tag] = :nav
|
110
|
+
@system_arguments[:role] = :tablist
|
59
111
|
@system_arguments[:classes] = class_names(
|
60
112
|
@system_arguments[:classes],
|
61
113
|
"UnderlineNav",
|
62
114
|
"UnderlineNav--right" => @align == :right
|
63
115
|
)
|
116
|
+
|
117
|
+
@body_arguments = {
|
118
|
+
tag: :div,
|
119
|
+
classes: class_names(
|
120
|
+
"UnderlineNav-body",
|
121
|
+
body_classes
|
122
|
+
)
|
123
|
+
}
|
124
|
+
end
|
125
|
+
|
126
|
+
private
|
127
|
+
|
128
|
+
def body
|
129
|
+
Primer::BaseComponent.new(**@body_arguments)
|
64
130
|
end
|
65
131
|
end
|
66
132
|
end
|