openproject-primer_view_components 0.21.0 → 0.22.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/previews/primer/forms_preview/custom_width_fields_form.html.erb +2 -0
- 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
@@ -3186,6 +3186,19 @@
|
|
3186
3186
|
"color-contrast"
|
3187
3187
|
]
|
3188
3188
|
}
|
3189
|
+
},
|
3190
|
+
{
|
3191
|
+
"preview_path": "primer/alpha/dialog/dialog_inside_overlay",
|
3192
|
+
"name": "dialog_inside_overlay",
|
3193
|
+
"snapshot": "false",
|
3194
|
+
"skip_rules": {
|
3195
|
+
"wont_fix": [
|
3196
|
+
"region"
|
3197
|
+
],
|
3198
|
+
"will_fix": [
|
3199
|
+
"color-contrast"
|
3200
|
+
]
|
3201
|
+
}
|
3189
3202
|
}
|
3190
3203
|
]
|
3191
3204
|
},
|
@@ -5569,19 +5582,6 @@
|
|
5569
5582
|
]
|
5570
5583
|
}
|
5571
5584
|
},
|
5572
|
-
{
|
5573
|
-
"preview_path": "primer/alpha/segmented_control/full_width_large",
|
5574
|
-
"name": "full_width_large",
|
5575
|
-
"snapshot": "true",
|
5576
|
-
"skip_rules": {
|
5577
|
-
"wont_fix": [
|
5578
|
-
"region"
|
5579
|
-
],
|
5580
|
-
"will_fix": [
|
5581
|
-
"color-contrast"
|
5582
|
-
]
|
5583
|
-
}
|
5584
|
-
},
|
5585
5585
|
{
|
5586
5586
|
"preview_path": "primer/alpha/segmented_control/icons_and_text_small",
|
5587
5587
|
"name": "icons_and_text_small",
|
@@ -5608,19 +5608,6 @@
|
|
5608
5608
|
]
|
5609
5609
|
}
|
5610
5610
|
},
|
5611
|
-
{
|
5612
|
-
"preview_path": "primer/alpha/segmented_control/icons_and_text_large",
|
5613
|
-
"name": "icons_and_text_large",
|
5614
|
-
"snapshot": "true",
|
5615
|
-
"skip_rules": {
|
5616
|
-
"wont_fix": [
|
5617
|
-
"region"
|
5618
|
-
],
|
5619
|
-
"will_fix": [
|
5620
|
-
"color-contrast"
|
5621
|
-
]
|
5622
|
-
}
|
5623
|
-
},
|
5624
5611
|
{
|
5625
5612
|
"preview_path": "primer/alpha/segmented_control/trailing_label_width_small",
|
5626
5613
|
"name": "trailing_label_width_small",
|
@@ -5647,19 +5634,6 @@
|
|
5647
5634
|
]
|
5648
5635
|
}
|
5649
5636
|
},
|
5650
|
-
{
|
5651
|
-
"preview_path": "primer/alpha/segmented_control/trailing_label_width_large",
|
5652
|
-
"name": "trailing_label_width_large",
|
5653
|
-
"snapshot": "true",
|
5654
|
-
"skip_rules": {
|
5655
|
-
"wont_fix": [
|
5656
|
-
"region"
|
5657
|
-
],
|
5658
|
-
"will_fix": [
|
5659
|
-
"color-contrast"
|
5660
|
-
]
|
5661
|
-
}
|
5662
|
-
},
|
5663
5637
|
{
|
5664
5638
|
"preview_path": "primer/alpha/segmented_control/icon_only_small",
|
5665
5639
|
"name": "icon_only_small",
|
@@ -5686,19 +5660,6 @@
|
|
5686
5660
|
]
|
5687
5661
|
}
|
5688
5662
|
},
|
5689
|
-
{
|
5690
|
-
"preview_path": "primer/alpha/segmented_control/icon_only_large",
|
5691
|
-
"name": "icon_only_large",
|
5692
|
-
"snapshot": "true",
|
5693
|
-
"skip_rules": {
|
5694
|
-
"wont_fix": [
|
5695
|
-
"region"
|
5696
|
-
],
|
5697
|
-
"will_fix": [
|
5698
|
-
"color-contrast"
|
5699
|
-
]
|
5700
|
-
}
|
5701
|
-
},
|
5702
5663
|
{
|
5703
5664
|
"preview_path": "primer/alpha/segmented_control/icon_only_full_width_small",
|
5704
5665
|
"name": "icon_only_full_width_small",
|
@@ -5725,19 +5686,6 @@
|
|
5725
5686
|
]
|
5726
5687
|
}
|
5727
5688
|
},
|
5728
|
-
{
|
5729
|
-
"preview_path": "primer/alpha/segmented_control/icon_only_full_width_large",
|
5730
|
-
"name": "icon_only_full_width_large",
|
5731
|
-
"snapshot": "false",
|
5732
|
-
"skip_rules": {
|
5733
|
-
"wont_fix": [
|
5734
|
-
"region"
|
5735
|
-
],
|
5736
|
-
"will_fix": [
|
5737
|
-
"color-contrast"
|
5738
|
-
]
|
5739
|
-
}
|
5740
|
-
},
|
5741
5689
|
{
|
5742
5690
|
"preview_path": "primer/alpha/segmented_control/with_link_as_tag",
|
5743
5691
|
"name": "with_link_as_tag",
|
metadata
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: openproject-primer_view_components
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 0.
|
4
|
+
version: 0.22.1
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- GitHub Open Source
|
@@ -9,7 +9,7 @@ authors:
|
|
9
9
|
autorequire:
|
10
10
|
bindir: bin
|
11
11
|
cert_chain: []
|
12
|
-
date: 2024-
|
12
|
+
date: 2024-02-05 00:00:00.000000000 Z
|
13
13
|
dependencies:
|
14
14
|
- !ruby/object:Gem::Dependency
|
15
15
|
name: actionview
|
@@ -760,6 +760,7 @@ files:
|
|
760
760
|
- previews/primer/alpha/dialog_preview/autofocus_element.html.erb
|
761
761
|
- previews/primer/alpha/dialog_preview/body_has_scrollbar_overflow.html.erb
|
762
762
|
- previews/primer/alpha/dialog_preview/custom_header.html.erb
|
763
|
+
- previews/primer/alpha/dialog_preview/dialog_inside_overlay.html.erb
|
763
764
|
- previews/primer/alpha/dialog_preview/nested_dialog.html.erb
|
764
765
|
- previews/primer/alpha/dialog_preview/scroll_container.html.erb
|
765
766
|
- previews/primer/alpha/dialog_preview/test.html.erb
|