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
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: b3251ede218a760e400098f3aab65c1f4bb91dedcc780efa32d0f7b814f35a7c
|
4
|
+
data.tar.gz: 32676c086a6e0ad4c585fa5cc5ddbe6b5296451974f4f892afb24786886bd8e0
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: b67005b172fc5b314bcd8f18a4340ca4b7c33e6eb88d4b469714fac0c25a5ca82819205c70e3bd3bdd21edb6c3a3bf56870bea68eb61a09c931a7cada5614f5c
|
7
|
+
data.tar.gz: b84b0c68ed718fdb8af16748215c763c87a3f26bea3d5e6ecd0e15d682f50d7849bac2290ebb0023d4770aa5ef47211b31f2f94f5590401410afa6ea2cda193a
|
data/CHANGELOG.md
CHANGED
@@ -2,6 +2,72 @@
|
|
2
2
|
|
3
3
|
## main
|
4
4
|
|
5
|
+
## 0.0.34
|
6
|
+
|
7
|
+
* Add `p: :responsive` and `m: :auto` system arguments.
|
8
|
+
|
9
|
+
*Manuel Puyol*
|
10
|
+
|
11
|
+
* Remove `my: :auto` and negative `m:` system arguments.
|
12
|
+
|
13
|
+
*Manuel Puyol*
|
14
|
+
|
15
|
+
* **Breaking change**: Rename `FlashComponent` `variant` argument to `scheme`.
|
16
|
+
|
17
|
+
*Manuel Puyol*
|
18
|
+
|
19
|
+
* **Breaking change**: Rename `LinkComponent` `variant` argument to `scheme`.
|
20
|
+
|
21
|
+
*Manuel Puyol*
|
22
|
+
|
23
|
+
* **Breaking change**: Rename `ButtonComponent` `button_type` argument to `scheme`.
|
24
|
+
|
25
|
+
*Manuel Puyol*
|
26
|
+
|
27
|
+
* **Breaking change**: Rename `ButtonMarketingComponent` `button_type` argument to `scheme`.
|
28
|
+
|
29
|
+
*Manuel Puyol*
|
30
|
+
|
31
|
+
* **Breaking change**: Rename `StateComponent` `color` argument to `scheme`.
|
32
|
+
|
33
|
+
*Manuel Puyol*
|
34
|
+
|
35
|
+
## 0.0.33
|
36
|
+
|
37
|
+
* Remove `TabbedComponent` validation requiring a tab to be selected.
|
38
|
+
|
39
|
+
*Manuel Puyol*
|
40
|
+
|
41
|
+
## 0.0.32
|
42
|
+
|
43
|
+
* Allow passing the icon name as a positional argument to `OcticonComponent`.
|
44
|
+
|
45
|
+
*Manuel Puyol*
|
46
|
+
|
47
|
+
* Promote `TimeAgoComponent` to beta.
|
48
|
+
|
49
|
+
*Manuel Puyol*
|
50
|
+
|
51
|
+
* **Breaking change**: Update `TabNav#tab` API to accept the tab content as a block and panel content as a slot.
|
52
|
+
|
53
|
+
*Manuel Puyol*
|
54
|
+
|
55
|
+
* **Breaking change**: Update `UnderlineNavComponent` API be more strict and support `TabContainer`.
|
56
|
+
|
57
|
+
*Manuel Puyol*
|
58
|
+
|
59
|
+
## 0.0.31
|
60
|
+
|
61
|
+
* Fix `Popover` bug where body was only returning the last line of the HTML.
|
62
|
+
|
63
|
+
*Manuel Puyol, Blake Williams*
|
64
|
+
|
65
|
+
## 0.0.30
|
66
|
+
|
67
|
+
* Make `color:`, `bg:` and `border_color:` accept string values.
|
68
|
+
|
69
|
+
*Manuel Puyol*
|
70
|
+
|
5
71
|
## 0.0.29
|
6
72
|
|
7
73
|
* Add `primer_time_ago` helper.
|
data/README.md
CHANGED
@@ -1,12 +1,12 @@
|
|
1
1
|
<p align="center">
|
2
|
-
<img width="300px" src="/static/assets/
|
2
|
+
<img width="300px" src="/static/assets/view-components.svg">
|
3
3
|
</p>
|
4
4
|
|
5
5
|
<h1 align="center">Primer ViewComponents</h1>
|
6
6
|
|
7
7
|
<p align="center">ViewComponents for the Primer Design System</p>
|
8
8
|
|
9
|
-
_Note: This library is
|
9
|
+
_Note: This library is under active pre-1.0 development. Breaking changes are likely in patch releases._
|
10
10
|
|
11
11
|
## Documentation
|
12
12
|
|
@@ -3,8 +3,6 @@
|
|
3
3
|
module Primer
|
4
4
|
# Use AutoComplete to populate input values from server search results.
|
5
5
|
class AutoCompleteComponent < Primer::Component
|
6
|
-
include ViewComponent::SlotableV2
|
7
|
-
|
8
6
|
DEFAULT_INPUT_TYPE = :text
|
9
7
|
INPUT_TYPE_OPTIONS = [DEFAULT_INPUT_TYPE, :search].freeze
|
10
8
|
|
@@ -3,8 +3,6 @@
|
|
3
3
|
module Primer
|
4
4
|
# Use AutoCompleteItem to list results of an auto-completed search.
|
5
5
|
class AutoCompleteItemComponent < Primer::Component
|
6
|
-
include ViewComponent::SlotableV2
|
7
|
-
|
8
6
|
# @example Default
|
9
7
|
# <%= render(Primer::AutoCompleteItemComponent.new(selected: true, value: "value")) do |c| %>
|
10
8
|
# Selected
|
@@ -22,94 +22,126 @@ module Primer
|
|
22
22
|
# ```html
|
23
23
|
# <h1 class="mt-0 mt-lg-4 mt-xl-2">Hello world</h1>
|
24
24
|
# ```
|
25
|
-
#
|
26
|
-
# ## HTML attributes
|
27
|
-
#
|
28
|
-
# System arguments include most HTML attributes. For example:
|
29
|
-
#
|
30
|
-
# | Name | Type | Description |
|
31
|
-
# | :- | :- | :- |
|
32
|
-
# | `width` | `Integer` | Width. |
|
33
|
-
# | `height` | `Integer` | Height. |
|
34
|
-
# | `data` | `Hash` | Data attributes: `data: { foo: :bar }` renders `data-foo='bar'`. |
|
35
|
-
# | `aria` | `Hash` | Aria attributes: `aria: { label: "foo" }` renders `aria-label='foo'`. |
|
36
|
-
# | `title` | `String` | The `title` attribute. |
|
37
|
-
# | `style` | `String` | Inline styles. |
|
38
|
-
# | `hidden` | `Boolean` | Whether to assign the `hidden` attribute. |
|
39
25
|
class BaseComponent < Primer::Component
|
40
26
|
status :beta
|
41
27
|
|
42
28
|
include TestSelectorHelper
|
43
29
|
|
44
|
-
#
|
45
|
-
#
|
46
|
-
#
|
47
|
-
#
|
48
|
-
#
|
49
|
-
#
|
50
|
-
#
|
51
|
-
#
|
52
|
-
#
|
53
|
-
#
|
54
|
-
#
|
55
|
-
#
|
56
|
-
#
|
57
|
-
#
|
58
|
-
#
|
59
|
-
#
|
60
|
-
#
|
61
|
-
#
|
62
|
-
#
|
63
|
-
#
|
64
|
-
#
|
65
|
-
#
|
66
|
-
#
|
67
|
-
#
|
68
|
-
#
|
69
|
-
#
|
70
|
-
#
|
71
|
-
#
|
72
|
-
#
|
73
|
-
#
|
74
|
-
#
|
75
|
-
#
|
76
|
-
#
|
77
|
-
#
|
78
|
-
#
|
79
|
-
#
|
80
|
-
#
|
81
|
-
#
|
82
|
-
#
|
83
|
-
#
|
84
|
-
#
|
85
|
-
#
|
86
|
-
#
|
87
|
-
#
|
88
|
-
#
|
89
|
-
#
|
90
|
-
#
|
91
|
-
#
|
92
|
-
#
|
93
|
-
#
|
94
|
-
#
|
95
|
-
#
|
96
|
-
#
|
97
|
-
#
|
98
|
-
#
|
99
|
-
#
|
100
|
-
#
|
101
|
-
#
|
102
|
-
#
|
103
|
-
#
|
104
|
-
#
|
105
|
-
#
|
106
|
-
#
|
107
|
-
#
|
108
|
-
#
|
109
|
-
#
|
110
|
-
#
|
111
|
-
#
|
112
|
-
#
|
30
|
+
# ## HTML attributes
|
31
|
+
#
|
32
|
+
# System arguments include most HTML attributes. For example:
|
33
|
+
#
|
34
|
+
# | Name | Type | Description |
|
35
|
+
# | :- | :- | :- |
|
36
|
+
# | `aria` | `Hash` | Aria attributes: `aria: { label: "foo" }` renders `aria-label='foo'`. |
|
37
|
+
# | `data` | `Hash` | Data attributes: `data: { foo: :bar }` renders `data-foo='bar'`. |
|
38
|
+
# | `height` | `Integer` | Height. |
|
39
|
+
# | `hidden` | `Boolean` | Whether to assign the `hidden` attribute. |
|
40
|
+
# | `style` | `String` | Inline styles. |
|
41
|
+
# | `title` | `String` | The `title` attribute. |
|
42
|
+
# | `width` | `Integer` | Width. |
|
43
|
+
#
|
44
|
+
# ## Animation
|
45
|
+
#
|
46
|
+
# | Name | Type | Description |
|
47
|
+
# | :- | :- | :- |
|
48
|
+
# | `animation` | Symbol | <%= one_of([:fade_in, :fade_out, :fade_up, :fade_down, :scale_in, :pulse, :grow_x, :grow]) %> |
|
49
|
+
#
|
50
|
+
# ## Border
|
51
|
+
#
|
52
|
+
# | Name | Type | Description |
|
53
|
+
# | :- | :- | :- |
|
54
|
+
# | `border_bottom` | Integer | Set to `0` to remove the bottom border. |
|
55
|
+
# | `border_left` | Integer | Set to `0` to remove the left border. |
|
56
|
+
# | `border_radius` | Integer | <%= one_of([0, 1, 2, 3]) %> |
|
57
|
+
# | `border_right` | Integer | Set to `0` to remove the right border. |
|
58
|
+
# | `border_top` | Integer | Set to `0` to remove the top border. |
|
59
|
+
# | `border` | Symbol | <%= one_of([:left, :top, :bottom, :right, :y, :x, true]) %> |
|
60
|
+
# | `box_shadow` | Boolean, Symbol | Box shadow. <%= one_of([true, :medium, :large, :extra_large, :none]) %> |
|
61
|
+
#
|
62
|
+
# ## Color
|
63
|
+
#
|
64
|
+
# | Name | Type | Description |
|
65
|
+
# | :- | :- | :- |
|
66
|
+
# | `bg` | String, Symbol | Background color. Accepts either a hex value as a String or <%= one_of(Primer::Classify::FunctionalBorderColors::OPTIONS, lower: true) %> |
|
67
|
+
# | `border_color` | Symbol | Border color. <%= one_of(Primer::Classify::FunctionalBorderColors::OPTIONS) %> |
|
68
|
+
# | `color` | Symbol | Text color. <%= one_of(Primer::Classify::FunctionalTextColors::OPTIONS) %> |
|
69
|
+
#
|
70
|
+
# ## Flex
|
71
|
+
#
|
72
|
+
# | Name | Type | Description |
|
73
|
+
# | :- | :- | :- |
|
74
|
+
# | `align_items` | Symbol | <%= one_of([:flex_start, :flex_end, :center, :baseline, :stretch]) %> |
|
75
|
+
# | `align_self` | Symbol | <%= one_of([:auto, :start, :end, :center, :baseline, :stretch]) %> |
|
76
|
+
# | `flex_grow` | Integer | To enable, set to `0`. |
|
77
|
+
# | `flex_shrink` | Integer | To enable, set to `0`. |
|
78
|
+
# | `flex` | Integer, Symbol | <%= one_of([1, :auto]) %> |
|
79
|
+
# | `justify_content` | Symbol | <%= one_of([:flex_start, :flex_end, :center, :space_between, :space_around]) %> |
|
80
|
+
# | `width` | Symbol | <%= one_of([:fit, :fill]) %> |
|
81
|
+
#
|
82
|
+
# ## Grid
|
83
|
+
#
|
84
|
+
# | Name | Type | Description |
|
85
|
+
# | :- | :- | :- |
|
86
|
+
# | `col` | Integer | Number of columns. |
|
87
|
+
#
|
88
|
+
# ## Layout
|
89
|
+
#
|
90
|
+
# | Name | Type | Description |
|
91
|
+
# | :- | :- | :- |
|
92
|
+
# | `display` | Symbol | <%= one_of([:none, :block, :flex, :inline, :inline_block, :table, :table_cell]) %> |
|
93
|
+
# | `height` | Symbol | <%= one_of([:fit, :fill]) %> |
|
94
|
+
# | `hide` | Symbol | Hide the element at a specific breakpoint. <%= one_of([:sm, :md, :lg, :xl]) %> |
|
95
|
+
# | `v` | Symbol | Visibility. <%= one_of([:hidden, :visible]) %> |
|
96
|
+
# | `vertical_align` | Symbol | <%= one_of([:baseline, :top, :middle, :bottom, :text_top, :text_bottom]) %> |
|
97
|
+
#
|
98
|
+
# ## Position
|
99
|
+
#
|
100
|
+
# | Name | Type | Description |
|
101
|
+
# | :- | :- | :- |
|
102
|
+
# | `bottom` | Boolean | If `false`, sets `bottom: 0`. |
|
103
|
+
# | `float` | Symbol | <%= one_of([:left, :right]) %> |
|
104
|
+
# | `left` | Boolean | If `false`, sets `left: 0`. |
|
105
|
+
# | `position` | Symbol | <%= one_of([:relative, :absolute, :fixed]) %> |
|
106
|
+
# | `right` | Boolean | If `false`, sets `right: 0`. |
|
107
|
+
# | `top` | Boolean | If `false`, sets `top: 0`. |
|
108
|
+
#
|
109
|
+
# ## Spacing
|
110
|
+
#
|
111
|
+
# | Name | Type | Description |
|
112
|
+
# | :- | :- | :- |
|
113
|
+
# | `m` | Integer | Margin. <%= one_of(Primer::Classify::Spacing::MAPPINGS[:m]) %> |
|
114
|
+
# | `mb` | Integer | Margin bottom. <%= one_of(Primer::Classify::Spacing::MAPPINGS[:mb]) %> |
|
115
|
+
# | `ml` | Integer | Margin left. <%= one_of(Primer::Classify::Spacing::MAPPINGS[:ml]) %> |
|
116
|
+
# | `mr` | Integer | Margin right. <%= one_of(Primer::Classify::Spacing::MAPPINGS[:mr]) %> |
|
117
|
+
# | `mt` | Integer | Margin top. <%= one_of(Primer::Classify::Spacing::MAPPINGS[:mt]) %> |
|
118
|
+
# | `mx` | Integer | Horizontal margins. <%= one_of(Primer::Classify::Spacing::MAPPINGS[:mx]) %> |
|
119
|
+
# | `my` | Integer | Vertical margins. <%= one_of(Primer::Classify::Spacing::MAPPINGS[:my]) %> |
|
120
|
+
# | `p` | Integer | Padding. <%= one_of(Primer::Classify::Spacing::MAPPINGS[:p]) %> |
|
121
|
+
# | `pb` | Integer | Padding bottom. <%= one_of(Primer::Classify::Spacing::MAPPINGS[:pb]) %> |
|
122
|
+
# | `pl` | Integer | Padding left. <%= one_of(Primer::Classify::Spacing::MAPPINGS[:pl]) %> |
|
123
|
+
# | `pr` | Integer | Padding right. <%= one_of(Primer::Classify::Spacing::MAPPINGS[:pr]) %> |
|
124
|
+
# | `pt` | Integer | Padding left. <%= one_of(Primer::Classify::Spacing::MAPPINGS[:pt]) %> |
|
125
|
+
# | `px` | Integer | Horizontal padding. <%= one_of(Primer::Classify::Spacing::MAPPINGS[:px]) %> |
|
126
|
+
# | `py` | Integer | Vertical padding. <%= one_of(Primer::Classify::Spacing::MAPPINGS[:py]) %> |
|
127
|
+
#
|
128
|
+
# ## Typography
|
129
|
+
#
|
130
|
+
# | Name | Type | Description |
|
131
|
+
# | :- | :- | :- |
|
132
|
+
# | `font_size` | String, Integer | <%= one_of(["00", 0, 1, 2, 3, 4, 5, 6]) %> |
|
133
|
+
# | `font_weight` | Symbol | Font weight. <%= one_of([:light, :normal, :bold]) %> |
|
134
|
+
# | `text_align` | Symbol | Text alignment. <%= one_of([:left, :right, :center]) %> |
|
135
|
+
# | `underline` | Boolean | Whether text should be underlined. |
|
136
|
+
# | `word_break` | Symbol | Whether to break words on line breaks. Can only be `:break_all`. |
|
137
|
+
#
|
138
|
+
# ## Other
|
139
|
+
#
|
140
|
+
# | Name | Type | Description |
|
141
|
+
# | :- | :- | :- |
|
142
|
+
# | classes | String | CSS class name value to be concatenated with generated Primer CSS classes. |
|
143
|
+
# | tag | Symbol | HTML tag name to be passed to `content_tag`. |
|
144
|
+
# | test_selector | String | Adds `data-test-selector='given value'` in non-Production environments for testing purposes. |
|
113
145
|
def initialize(tag:, classes: nil, **system_arguments)
|
114
146
|
@tag = tag
|
115
147
|
@result = Primer::Classify.call(**system_arguments.merge(classes: classes))
|
@@ -2,7 +2,7 @@
|
|
2
2
|
<% if spinner.present? %>
|
3
3
|
<%= spinner %>
|
4
4
|
<% elsif @icon.present? %>
|
5
|
-
<%= primer_octicon
|
5
|
+
<%= primer_octicon @icon, size: @icon_size, classes: "blankslate-icon" %>
|
6
6
|
<% elsif @image_src.present? && @image_alt.present? %>
|
7
7
|
<%= image_tag "#{@image_src}", class: "mb-3", size: "56x56", alt: "#{@image_alt}" %>
|
8
8
|
<% end %>
|
@@ -3,7 +3,6 @@
|
|
3
3
|
module Primer
|
4
4
|
# Use breadcrumbs to display page hierarchy within a section of the site. All of the items in the breadcrumb "trail" are links except for the final item, which is a plain string indicating the current page.
|
5
5
|
class BreadcrumbComponent < Primer::Component
|
6
|
-
include ViewComponent::SlotableV2
|
7
6
|
status :beta
|
8
7
|
|
9
8
|
# _Note: if both `href` and `selected: true` are passed in, `href` will be ignored and the item will not be rendered as a link._
|
@@ -3,14 +3,14 @@
|
|
3
3
|
module Primer
|
4
4
|
# Use buttons for actions (e.g. in forms). Use links for destinations, or moving from one page to another.
|
5
5
|
class ButtonComponent < Primer::Component
|
6
|
-
|
7
|
-
|
8
|
-
|
6
|
+
DEFAULT_SCHEME = :default
|
7
|
+
SCHEME_MAPPINGS = {
|
8
|
+
DEFAULT_SCHEME => "",
|
9
9
|
:primary => "btn-primary",
|
10
10
|
:danger => "btn-danger",
|
11
11
|
:outline => "btn-outline"
|
12
12
|
}.freeze
|
13
|
-
|
13
|
+
SCHEME_OPTIONS = SCHEME_MAPPINGS.keys
|
14
14
|
|
15
15
|
DEFAULT_VARIANT = :medium
|
16
16
|
VARIANT_MAPPINGS = {
|
@@ -26,24 +26,24 @@ module Primer
|
|
26
26
|
DEFAULT_TYPE = :button
|
27
27
|
TYPE_OPTIONS = [DEFAULT_TYPE, :reset, :submit].freeze
|
28
28
|
|
29
|
-
# @example
|
29
|
+
# @example Schemes
|
30
30
|
# <%= render(Primer::ButtonComponent.new) { "Default" } %>
|
31
|
-
# <%= render(Primer::ButtonComponent.new(
|
32
|
-
# <%= render(Primer::ButtonComponent.new(
|
33
|
-
# <%= render(Primer::ButtonComponent.new(
|
31
|
+
# <%= render(Primer::ButtonComponent.new(scheme: :primary)) { "Primary" } %>
|
32
|
+
# <%= render(Primer::ButtonComponent.new(scheme: :danger)) { "Danger" } %>
|
33
|
+
# <%= render(Primer::ButtonComponent.new(scheme: :outline)) { "Outline" } %>
|
34
34
|
#
|
35
35
|
# @example Variants
|
36
36
|
# <%= render(Primer::ButtonComponent.new(variant: :small)) { "Small" } %>
|
37
37
|
# <%= render(Primer::ButtonComponent.new(variant: :medium)) { "Medium" } %>
|
38
38
|
# <%= render(Primer::ButtonComponent.new(variant: :large)) { "Large" } %>
|
39
39
|
#
|
40
|
-
# @param
|
40
|
+
# @param scheme [Symbol] <%= one_of(Primer::ButtonComponent::SCHEME_OPTIONS) %>
|
41
41
|
# @param variant [Symbol] <%= one_of(Primer::ButtonComponent::VARIANT_OPTIONS) %>
|
42
42
|
# @param tag [Symbol] <%= one_of(Primer::ButtonComponent::TAG_OPTIONS) %>
|
43
43
|
# @param type [Symbol] <%= one_of(Primer::ButtonComponent::TYPE_OPTIONS) %>
|
44
44
|
# @param group_item [Boolean] Whether button is part of a ButtonGroup.
|
45
45
|
def initialize(
|
46
|
-
|
46
|
+
scheme: DEFAULT_SCHEME,
|
47
47
|
variant: DEFAULT_VARIANT,
|
48
48
|
tag: DEFAULT_TAG,
|
49
49
|
type: DEFAULT_TYPE,
|
@@ -62,7 +62,7 @@ module Primer
|
|
62
62
|
@system_arguments[:classes] = class_names(
|
63
63
|
"btn",
|
64
64
|
system_arguments[:classes],
|
65
|
-
|
65
|
+
SCHEME_MAPPINGS[fetch_or_fallback(SCHEME_OPTIONS, scheme, DEFAULT_SCHEME)],
|
66
66
|
VARIANT_MAPPINGS[fetch_or_fallback(VARIANT_OPTIONS, variant, DEFAULT_VARIANT)],
|
67
67
|
"BtnGroup-item" => group_item
|
68
68
|
)
|
@@ -3,8 +3,6 @@
|
|
3
3
|
module Primer
|
4
4
|
# Use ButtonGroupComponent to render a series of buttons.
|
5
5
|
class ButtonGroupComponent < Primer::Component
|
6
|
-
include ViewComponent::SlotableV2
|
7
|
-
|
8
6
|
# Required list of buttons to be rendered.
|
9
7
|
#
|
10
8
|
# @param kwargs [Hash] The same arguments as <%= link_to_component(Primer::ButtonComponent) %>.
|
@@ -13,9 +11,9 @@ module Primer
|
|
13
11
|
# @example Default
|
14
12
|
# <%= render(Primer::ButtonGroupComponent.new) do |component|
|
15
13
|
# component.button { "Default" }
|
16
|
-
# component.button(
|
17
|
-
# component.button(
|
18
|
-
# component.button(
|
14
|
+
# component.button(scheme: :primary) { "Primary" }
|
15
|
+
# component.button(scheme: :danger) { "Danger" }
|
16
|
+
# component.button(scheme: :outline) { "Outline" }
|
19
17
|
# component.button(classes: "my-class") { "Custom class" }
|
20
18
|
# end %>
|
21
19
|
#
|