primer_view_components 0.17.0 → 0.18.1
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/CHANGELOG.md +20 -0
- data/app/assets/javascripts/primer_view_components.js +1 -1
- data/app/assets/javascripts/primer_view_components.js.map +1 -1
- data/app/assets/styles/primer_view_components.css +1 -1
- data/app/assets/styles/primer_view_components.css.map +1 -1
- data/app/components/primer/alpha/action_list.css +1 -1
- data/app/components/primer/alpha/action_list.css.map +1 -1
- data/app/components/primer/alpha/action_list.pcss +11 -33
- data/app/components/primer/alpha/segmented_control.css +1 -1
- data/app/components/primer/alpha/segmented_control.css.json +0 -4
- data/app/components/primer/alpha/segmented_control.css.map +1 -1
- data/app/components/primer/alpha/segmented_control.pcss +1 -18
- data/app/components/primer/alpha/segmented_control.rb +0 -1
- data/app/components/primer/dialog_helper.js +18 -5
- data/app/components/primer/dialog_helper.ts +17 -4
- data/lib/primer/view_components/version.rb +2 -2
- data/previews/primer/alpha/dialog_preview/dialog_inside_overlay.html.erb +9 -0
- data/previews/primer/alpha/dialog_preview/nested_dialog.html.erb +7 -0
- data/previews/primer/alpha/dialog_preview.rb +23 -0
- data/previews/primer/alpha/segmented_control_preview.rb +1 -52
- data/static/classes.json +0 -3
- data/static/constants.json +2 -4
- data/static/info_arch.json +13 -65
- data/static/previews.json +13 -65
- metadata +3 -2
@@ -11,7 +11,7 @@ module Primer
|
|
11
11
|
# @param full_width [Boolean] toggle
|
12
12
|
# @param hide_labels [Boolean] toggle
|
13
13
|
# @param icon [Symbol] octicon
|
14
|
-
# @param size select [small, medium
|
14
|
+
# @param size select [small, medium]
|
15
15
|
def playground(full_width: false, hide_labels: false, size: :medium, icon: :none)
|
16
16
|
if icon == :none
|
17
17
|
icon = hide_labels ? :zap : nil
|
@@ -55,17 +55,6 @@ module Primer
|
|
55
55
|
component.with_item(label: "Blame")
|
56
56
|
end
|
57
57
|
end
|
58
|
-
|
59
|
-
# @label Size large
|
60
|
-
# @param hide_labels [Boolean] toggle
|
61
|
-
# @snapshot
|
62
|
-
def full_width_large(hide_labels: false)
|
63
|
-
render(Primer::Alpha::SegmentedControl.new("aria-label": "File view", hide_labels: hide_labels, full_width: true, size: :large)) do |component|
|
64
|
-
component.with_item(label: "Preview", selected: true)
|
65
|
-
component.with_item(label: "Raw")
|
66
|
-
component.with_item(label: "Blame")
|
67
|
-
end
|
68
|
-
end
|
69
58
|
# @!endgroup
|
70
59
|
|
71
60
|
# @!group Icons and text
|
@@ -88,16 +77,6 @@ module Primer
|
|
88
77
|
component.with_item(label: "Blame", icon: :people)
|
89
78
|
end
|
90
79
|
end
|
91
|
-
|
92
|
-
# @label Size large
|
93
|
-
# @snapshot
|
94
|
-
def icons_and_text_large
|
95
|
-
render(Primer::Alpha::SegmentedControl.new("aria-label": "File view", size: :large)) do |component|
|
96
|
-
component.with_item(label: "Preview", icon: :eye, selected: true)
|
97
|
-
component.with_item(label: "Raw", icon: :"file-code")
|
98
|
-
component.with_item(label: "Blame", icon: :people)
|
99
|
-
end
|
100
|
-
end
|
101
80
|
# @!endgroup
|
102
81
|
|
103
82
|
# @!group Trailing Label
|
@@ -122,17 +101,6 @@ module Primer
|
|
122
101
|
end
|
123
102
|
end
|
124
103
|
end
|
125
|
-
|
126
|
-
# @label Size large
|
127
|
-
# @snapshot
|
128
|
-
def trailing_label_width_large
|
129
|
-
render(Primer::Alpha::SegmentedControl.new("aria-label": "Billing duration", size: :large)) do |component|
|
130
|
-
component.with_item(label: "Monthly")
|
131
|
-
component.with_item(label: "Yearly", selected: true) do |button|
|
132
|
-
button.with_trailing_visual_label(scheme: :accent) { "-8%" }
|
133
|
-
end
|
134
|
-
end
|
135
|
-
end
|
136
104
|
# @!endgroup
|
137
105
|
|
138
106
|
# @!group Icons only
|
@@ -156,16 +124,6 @@ module Primer
|
|
156
124
|
end
|
157
125
|
end
|
158
126
|
|
159
|
-
# @label Size large
|
160
|
-
# @snapshot
|
161
|
-
def icon_only_large
|
162
|
-
render(Primer::Alpha::SegmentedControl.new("aria-label": "File view", hide_labels: true, size: :large)) do |component|
|
163
|
-
component.with_item(label: "Preview", icon: :eye, selected: true)
|
164
|
-
component.with_item(label: "Raw", icon: :"file-code")
|
165
|
-
component.with_item(label: "Blame", icon: :people)
|
166
|
-
end
|
167
|
-
end
|
168
|
-
|
169
127
|
# @label Full width, size small
|
170
128
|
def icon_only_full_width_small
|
171
129
|
render(Primer::Alpha::SegmentedControl.new("aria-label": "File view", hide_labels: true, full_width: true, size: :small)) do |component|
|
@@ -183,15 +141,6 @@ module Primer
|
|
183
141
|
component.with_item(label: "Blame", icon: :people)
|
184
142
|
end
|
185
143
|
end
|
186
|
-
|
187
|
-
# @label Full width, size large
|
188
|
-
def icon_only_full_width_large
|
189
|
-
render(Primer::Alpha::SegmentedControl.new("aria-label": "File view", hide_labels: true, full_width: true, size: :large)) do |component|
|
190
|
-
component.with_item(label: "Preview", icon: :eye, selected: true)
|
191
|
-
component.with_item(label: "Raw", icon: :"file-code")
|
192
|
-
component.with_item(label: "Blame", icon: :people)
|
193
|
-
end
|
194
|
-
end
|
195
144
|
# @!endgroup
|
196
145
|
|
197
146
|
# NOTE: this preview uses a group to force it's display below the other groups
|
data/static/classes.json
CHANGED
data/static/constants.json
CHANGED
@@ -565,13 +565,11 @@
|
|
565
565
|
"Item": "Primer::Alpha::SegmentedControl::Item",
|
566
566
|
"SIZE_MAPPINGS": {
|
567
567
|
"small": "SegmentedControl--small",
|
568
|
-
"medium": "SegmentedControl--medium"
|
569
|
-
"large": "SegmentedControl--large"
|
568
|
+
"medium": "SegmentedControl--medium"
|
570
569
|
},
|
571
570
|
"SIZE_OPTIONS": [
|
572
571
|
"small",
|
573
|
-
"medium"
|
574
|
-
"large"
|
572
|
+
"medium"
|
575
573
|
]
|
576
574
|
},
|
577
575
|
"Primer::Alpha::SegmentedControl::Item": {
|
data/static/info_arch.json
CHANGED
@@ -3375,6 +3375,19 @@
|
|
3375
3375
|
"color-contrast"
|
3376
3376
|
]
|
3377
3377
|
}
|
3378
|
+
},
|
3379
|
+
{
|
3380
|
+
"preview_path": "primer/alpha/dialog/dialog_inside_overlay",
|
3381
|
+
"name": "dialog_inside_overlay",
|
3382
|
+
"snapshot": "false",
|
3383
|
+
"skip_rules": {
|
3384
|
+
"wont_fix": [
|
3385
|
+
"region"
|
3386
|
+
],
|
3387
|
+
"will_fix": [
|
3388
|
+
"color-contrast"
|
3389
|
+
]
|
3390
|
+
}
|
3378
3391
|
}
|
3379
3392
|
],
|
3380
3393
|
"subcomponents": [
|
@@ -6657,19 +6670,6 @@
|
|
6657
6670
|
]
|
6658
6671
|
}
|
6659
6672
|
},
|
6660
|
-
{
|
6661
|
-
"preview_path": "primer/alpha/segmented_control/full_width_large",
|
6662
|
-
"name": "full_width_large",
|
6663
|
-
"snapshot": "true",
|
6664
|
-
"skip_rules": {
|
6665
|
-
"wont_fix": [
|
6666
|
-
"region"
|
6667
|
-
],
|
6668
|
-
"will_fix": [
|
6669
|
-
"color-contrast"
|
6670
|
-
]
|
6671
|
-
}
|
6672
|
-
},
|
6673
6673
|
{
|
6674
6674
|
"preview_path": "primer/alpha/segmented_control/icons_and_text_small",
|
6675
6675
|
"name": "icons_and_text_small",
|
@@ -6696,19 +6696,6 @@
|
|
6696
6696
|
]
|
6697
6697
|
}
|
6698
6698
|
},
|
6699
|
-
{
|
6700
|
-
"preview_path": "primer/alpha/segmented_control/icons_and_text_large",
|
6701
|
-
"name": "icons_and_text_large",
|
6702
|
-
"snapshot": "true",
|
6703
|
-
"skip_rules": {
|
6704
|
-
"wont_fix": [
|
6705
|
-
"region"
|
6706
|
-
],
|
6707
|
-
"will_fix": [
|
6708
|
-
"color-contrast"
|
6709
|
-
]
|
6710
|
-
}
|
6711
|
-
},
|
6712
6699
|
{
|
6713
6700
|
"preview_path": "primer/alpha/segmented_control/trailing_label_width_small",
|
6714
6701
|
"name": "trailing_label_width_small",
|
@@ -6735,19 +6722,6 @@
|
|
6735
6722
|
]
|
6736
6723
|
}
|
6737
6724
|
},
|
6738
|
-
{
|
6739
|
-
"preview_path": "primer/alpha/segmented_control/trailing_label_width_large",
|
6740
|
-
"name": "trailing_label_width_large",
|
6741
|
-
"snapshot": "true",
|
6742
|
-
"skip_rules": {
|
6743
|
-
"wont_fix": [
|
6744
|
-
"region"
|
6745
|
-
],
|
6746
|
-
"will_fix": [
|
6747
|
-
"color-contrast"
|
6748
|
-
]
|
6749
|
-
}
|
6750
|
-
},
|
6751
6725
|
{
|
6752
6726
|
"preview_path": "primer/alpha/segmented_control/icon_only_small",
|
6753
6727
|
"name": "icon_only_small",
|
@@ -6774,19 +6748,6 @@
|
|
6774
6748
|
]
|
6775
6749
|
}
|
6776
6750
|
},
|
6777
|
-
{
|
6778
|
-
"preview_path": "primer/alpha/segmented_control/icon_only_large",
|
6779
|
-
"name": "icon_only_large",
|
6780
|
-
"snapshot": "true",
|
6781
|
-
"skip_rules": {
|
6782
|
-
"wont_fix": [
|
6783
|
-
"region"
|
6784
|
-
],
|
6785
|
-
"will_fix": [
|
6786
|
-
"color-contrast"
|
6787
|
-
]
|
6788
|
-
}
|
6789
|
-
},
|
6790
6751
|
{
|
6791
6752
|
"preview_path": "primer/alpha/segmented_control/icon_only_full_width_small",
|
6792
6753
|
"name": "icon_only_full_width_small",
|
@@ -6813,19 +6774,6 @@
|
|
6813
6774
|
]
|
6814
6775
|
}
|
6815
6776
|
},
|
6816
|
-
{
|
6817
|
-
"preview_path": "primer/alpha/segmented_control/icon_only_full_width_large",
|
6818
|
-
"name": "icon_only_full_width_large",
|
6819
|
-
"snapshot": "false",
|
6820
|
-
"skip_rules": {
|
6821
|
-
"wont_fix": [
|
6822
|
-
"region"
|
6823
|
-
],
|
6824
|
-
"will_fix": [
|
6825
|
-
"color-contrast"
|
6826
|
-
]
|
6827
|
-
}
|
6828
|
-
},
|
6829
6777
|
{
|
6830
6778
|
"preview_path": "primer/alpha/segmented_control/with_link_as_tag",
|
6831
6779
|
"name": "with_link_as_tag",
|
data/static/previews.json
CHANGED
@@ -3139,6 +3139,19 @@
|
|
3139
3139
|
"color-contrast"
|
3140
3140
|
]
|
3141
3141
|
}
|
3142
|
+
},
|
3143
|
+
{
|
3144
|
+
"preview_path": "primer/alpha/dialog/dialog_inside_overlay",
|
3145
|
+
"name": "dialog_inside_overlay",
|
3146
|
+
"snapshot": "false",
|
3147
|
+
"skip_rules": {
|
3148
|
+
"wont_fix": [
|
3149
|
+
"region"
|
3150
|
+
],
|
3151
|
+
"will_fix": [
|
3152
|
+
"color-contrast"
|
3153
|
+
]
|
3154
|
+
}
|
3142
3155
|
}
|
3143
3156
|
]
|
3144
3157
|
},
|
@@ -5209,19 +5222,6 @@
|
|
5209
5222
|
]
|
5210
5223
|
}
|
5211
5224
|
},
|
5212
|
-
{
|
5213
|
-
"preview_path": "primer/alpha/segmented_control/full_width_large",
|
5214
|
-
"name": "full_width_large",
|
5215
|
-
"snapshot": "true",
|
5216
|
-
"skip_rules": {
|
5217
|
-
"wont_fix": [
|
5218
|
-
"region"
|
5219
|
-
],
|
5220
|
-
"will_fix": [
|
5221
|
-
"color-contrast"
|
5222
|
-
]
|
5223
|
-
}
|
5224
|
-
},
|
5225
5225
|
{
|
5226
5226
|
"preview_path": "primer/alpha/segmented_control/icons_and_text_small",
|
5227
5227
|
"name": "icons_and_text_small",
|
@@ -5248,19 +5248,6 @@
|
|
5248
5248
|
]
|
5249
5249
|
}
|
5250
5250
|
},
|
5251
|
-
{
|
5252
|
-
"preview_path": "primer/alpha/segmented_control/icons_and_text_large",
|
5253
|
-
"name": "icons_and_text_large",
|
5254
|
-
"snapshot": "true",
|
5255
|
-
"skip_rules": {
|
5256
|
-
"wont_fix": [
|
5257
|
-
"region"
|
5258
|
-
],
|
5259
|
-
"will_fix": [
|
5260
|
-
"color-contrast"
|
5261
|
-
]
|
5262
|
-
}
|
5263
|
-
},
|
5264
5251
|
{
|
5265
5252
|
"preview_path": "primer/alpha/segmented_control/trailing_label_width_small",
|
5266
5253
|
"name": "trailing_label_width_small",
|
@@ -5287,19 +5274,6 @@
|
|
5287
5274
|
]
|
5288
5275
|
}
|
5289
5276
|
},
|
5290
|
-
{
|
5291
|
-
"preview_path": "primer/alpha/segmented_control/trailing_label_width_large",
|
5292
|
-
"name": "trailing_label_width_large",
|
5293
|
-
"snapshot": "true",
|
5294
|
-
"skip_rules": {
|
5295
|
-
"wont_fix": [
|
5296
|
-
"region"
|
5297
|
-
],
|
5298
|
-
"will_fix": [
|
5299
|
-
"color-contrast"
|
5300
|
-
]
|
5301
|
-
}
|
5302
|
-
},
|
5303
5277
|
{
|
5304
5278
|
"preview_path": "primer/alpha/segmented_control/icon_only_small",
|
5305
5279
|
"name": "icon_only_small",
|
@@ -5326,19 +5300,6 @@
|
|
5326
5300
|
]
|
5327
5301
|
}
|
5328
5302
|
},
|
5329
|
-
{
|
5330
|
-
"preview_path": "primer/alpha/segmented_control/icon_only_large",
|
5331
|
-
"name": "icon_only_large",
|
5332
|
-
"snapshot": "true",
|
5333
|
-
"skip_rules": {
|
5334
|
-
"wont_fix": [
|
5335
|
-
"region"
|
5336
|
-
],
|
5337
|
-
"will_fix": [
|
5338
|
-
"color-contrast"
|
5339
|
-
]
|
5340
|
-
}
|
5341
|
-
},
|
5342
5303
|
{
|
5343
5304
|
"preview_path": "primer/alpha/segmented_control/icon_only_full_width_small",
|
5344
5305
|
"name": "icon_only_full_width_small",
|
@@ -5365,19 +5326,6 @@
|
|
5365
5326
|
]
|
5366
5327
|
}
|
5367
5328
|
},
|
5368
|
-
{
|
5369
|
-
"preview_path": "primer/alpha/segmented_control/icon_only_full_width_large",
|
5370
|
-
"name": "icon_only_full_width_large",
|
5371
|
-
"snapshot": "false",
|
5372
|
-
"skip_rules": {
|
5373
|
-
"wont_fix": [
|
5374
|
-
"region"
|
5375
|
-
],
|
5376
|
-
"will_fix": [
|
5377
|
-
"color-contrast"
|
5378
|
-
]
|
5379
|
-
}
|
5380
|
-
},
|
5381
5329
|
{
|
5382
5330
|
"preview_path": "primer/alpha/segmented_control/with_link_as_tag",
|
5383
5331
|
"name": "with_link_as_tag",
|
metadata
CHANGED
@@ -1,14 +1,14 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: primer_view_components
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 0.
|
4
|
+
version: 0.18.1
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- GitHub Open Source
|
8
8
|
autorequire:
|
9
9
|
bindir: bin
|
10
10
|
cert_chain: []
|
11
|
-
date: 2024-
|
11
|
+
date: 2024-02-02 00:00:00.000000000 Z
|
12
12
|
dependencies:
|
13
13
|
- !ruby/object:Gem::Dependency
|
14
14
|
name: actionview
|
@@ -728,6 +728,7 @@ files:
|
|
728
728
|
- previews/primer/alpha/dialog_preview/autofocus_element.html.erb
|
729
729
|
- previews/primer/alpha/dialog_preview/body_has_scrollbar_overflow.html.erb
|
730
730
|
- previews/primer/alpha/dialog_preview/custom_header.html.erb
|
731
|
+
- previews/primer/alpha/dialog_preview/dialog_inside_overlay.html.erb
|
731
732
|
- previews/primer/alpha/dialog_preview/nested_dialog.html.erb
|
732
733
|
- previews/primer/alpha/dialog_preview/scroll_container.html.erb
|
733
734
|
- previews/primer/alpha/dialog_preview/test.html.erb
|