openproject-primer_view_components 0.21.0 → 0.22.1
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 +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
|