@primer/view-components 0.4.0-rc.af710032 → 0.4.0

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.
@@ -1 +1 @@
1
- .Link{color:var(--color-accent-fg)}.Link:hover{cursor:pointer;text-decoration:underline}.Link:focus,.Link:focus-visible{outline-offset:0}.Link--primary{color:var(--color-fg-default)!important}.Link--primary:hover{color:var(--color-accent-fg)!important}.Link--secondary{color:var(--color-fg-muted)!important}.Link--secondary:hover{color:var(--color-accent-fg)!important}.Link--muted{color:var(--color-fg-muted)!important}.Link--muted:hover{text-decoration:none}.Link--muted:hover,.Link--onHover:hover{color:var(--color-accent-fg)!important}.Link--onHover:hover{cursor:pointer;text-decoration:underline}.Link--muted:hover [class*=color-fg],.Link--primary:hover [class*=color-fg],.Link--secondary:hover [class*=color-fg]{color:inherit!important}
1
+ .Link{color:var(--color-accent-fg)}.Link:hover{cursor:pointer}.Link:focus,.Link:hover{text-decoration:underline}.Link:focus,.Link:focus-visible{outline-offset:0}.Link--primary{color:var(--color-fg-default)!important}.Link--primary:hover{color:var(--color-accent-fg)!important}.Link--secondary{color:var(--color-fg-muted)!important}.Link--secondary:hover{color:var(--color-accent-fg)!important}.Link--muted{color:var(--color-fg-muted)!important}.Link--muted:hover{text-decoration:none}.Link--muted:hover,.Link--onHover:hover{color:var(--color-accent-fg)!important}.Link--onHover:hover{cursor:pointer;text-decoration:underline}.Link--muted:hover [class*=color-fg],.Link--primary:hover [class*=color-fg],.Link--secondary:hover [class*=color-fg]{color:inherit!important}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@primer/view-components",
3
- "version": "0.4.0-rc.af710032",
3
+ "version": "0.4.0",
4
4
  "description": "ViewComponents for the Primer Design System",
5
5
  "main": "app/assets/javascripts/primer_view_components.js",
6
6
  "module": "app/components/primer/primer.js",
@@ -86,7 +86,7 @@
86
86
  "postcss-mixins": "^9.0.3",
87
87
  "postcss-preset-env": "^7.8.0",
88
88
  "prettier": "2.7.1",
89
- "primer-changesets-cli": "2.1.0",
89
+ "primer-changesets-cli": "2.2.0",
90
90
  "rollup": "^2.77.1",
91
91
  "rollup-plugin-terser": "^7.0.2",
92
92
  "stylelint": "^14.13.0",
@@ -1,4 +1,54 @@
1
1
  [
2
+ {
3
+ "component": "ActionBar",
4
+ "status": "alpha",
5
+ "a11y_reviewed": false,
6
+ "short_name": "ActionBar",
7
+ "source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/action_bar.rb",
8
+ "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/action_bar/default/",
9
+ "parameters": [
10
+ {
11
+ "name": "size",
12
+ "type": "Symbol",
13
+ "default": "`:medium`",
14
+ "description": "One of `:large`, `:medium`, or `:small`."
15
+ },
16
+ {
17
+ "name": "overflow_menu",
18
+ "type": "Boolean",
19
+ "default": "`true`",
20
+ "description": "Whether to render the overflow menu."
21
+ },
22
+ {
23
+ "name": "system_arguments",
24
+ "type": "Hash",
25
+ "default": "N/A",
26
+ "description": "[System arguments](/system-arguments)"
27
+ }
28
+ ]
29
+ },
30
+ {
31
+ "component": "ActionBar::Divider",
32
+ "status": "alpha",
33
+ "a11y_reviewed": false,
34
+ "short_name": "ActionBarDivider",
35
+ "source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/action_bar/divider.rb",
36
+ "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/action_bar/divider/default/",
37
+ "parameters": [
38
+
39
+ ]
40
+ },
41
+ {
42
+ "component": "ActionBar::Item",
43
+ "status": "alpha",
44
+ "a11y_reviewed": false,
45
+ "short_name": "ActionBarItem",
46
+ "source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/action_bar/item.rb",
47
+ "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/action_bar/item/default/",
48
+ "parameters": [
49
+
50
+ ]
51
+ },
2
52
  {
3
53
  "component": "ActionList",
4
54
  "status": "alpha",
@@ -3582,17 +3632,11 @@
3582
3632
  "source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/link.rb",
3583
3633
  "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/link/default/",
3584
3634
  "parameters": [
3585
- {
3586
- "name": "tag",
3587
- "type": "String",
3588
- "default": "`:a`",
3589
- "description": "One of `:a` or `:span`."
3590
- },
3591
3635
  {
3592
3636
  "name": "href",
3593
3637
  "type": "String",
3594
3638
  "default": "`nil`",
3595
- "description": "URL to be used for the Link. Required if tag is `:a`. If the requirements are not met an error will be raised in non production environments. In production, an empty link element will be rendered."
3639
+ "description": "URL to be used for the Link. Required. If the requirements are not met an error will be raised in non production environments. In production, an empty link element will be rendered."
3596
3640
  },
3597
3641
  {
3598
3642
  "name": "scheme",
@@ -1,4 +1,7 @@
1
1
  {
2
+ "Primer::Alpha::ActionBar": "",
3
+ "Primer::Alpha::ActionBar::Divider": "",
4
+ "Primer::Alpha::ActionBar::Item": "",
2
5
  "Primer::Alpha::ActionList": "",
3
6
  "Primer::Alpha::ActionList::Divider": "",
4
7
  "Primer::Alpha::ActionList::FormWrapper": "",
@@ -1,4 +1,23 @@
1
1
  {
2
+ "Primer::Alpha::ActionBar": {
3
+ "DEFAULT_SIZE": "medium",
4
+ "Divider": "Primer::Alpha::ActionBar::Divider",
5
+ "Item": "Primer::Alpha::ActionBar::Item",
6
+ "SIZE_MAPPINGS": {
7
+ "medium": null,
8
+ "small": "ActionBar--small",
9
+ "large": "ActionBar--large"
10
+ },
11
+ "SIZE_OPTIONS": [
12
+ "medium",
13
+ "small",
14
+ "large"
15
+ ]
16
+ },
17
+ "Primer::Alpha::ActionBar::Divider": {
18
+ },
19
+ "Primer::Alpha::ActionBar::Item": {
20
+ },
2
21
  "Primer::Alpha::ActionList": {
3
22
  "DEFAULT_MENU_ITEM_ROLE": "menuitem",
4
23
  "DEFAULT_ROLE": "list",
@@ -929,16 +948,11 @@
929
948
  },
930
949
  "Primer::Beta::Link": {
931
950
  "DEFAULT_SCHEME": "default",
932
- "DEFAULT_TAG": "a",
933
951
  "SCHEME_MAPPINGS": {
934
952
  "default": "",
935
953
  "primary": "Link--primary",
936
954
  "secondary": "Link--secondary"
937
- },
938
- "TAG_OPTIONS": [
939
- "a",
940
- "span"
941
- ]
955
+ }
942
956
  },
943
957
  "Primer::Beta::Markdown": {
944
958
  "DEFAULT_TAG": "div",
@@ -1,4 +1,187 @@
1
1
  [
2
+ {
3
+ "fully_qualified_name": "Primer::Alpha::ActionBar",
4
+ "description": "Add a general description of component here\nAdd additional usage considerations or best practices that may aid the user to use the component correctly.",
5
+ "is_form_component": false,
6
+ "is_published": true,
7
+ "requires_js": false,
8
+ "component": "ActionBar",
9
+ "status": "alpha",
10
+ "a11y_reviewed": false,
11
+ "short_name": "ActionBar",
12
+ "source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/action_bar.rb",
13
+ "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/action_bar/default/",
14
+ "parameters": [
15
+ {
16
+ "name": "size",
17
+ "type": "Symbol",
18
+ "default": "`:medium`",
19
+ "description": "One of `:large`, `:medium`, or `:small`."
20
+ },
21
+ {
22
+ "name": "overflow_menu",
23
+ "type": "Boolean",
24
+ "default": "`true`",
25
+ "description": "Whether to render the overflow menu."
26
+ },
27
+ {
28
+ "name": "system_arguments",
29
+ "type": "Hash",
30
+ "default": "N/A",
31
+ "description": "{{link_to_system_arguments_docs}}"
32
+ }
33
+ ],
34
+ "slots": [
35
+ {
36
+ "name": "items",
37
+ "description": null,
38
+ "parameters": [
39
+
40
+ ]
41
+ }
42
+ ],
43
+ "methods": [
44
+
45
+ ],
46
+ "previews": [
47
+ {
48
+ "preview_path": "primer/alpha/action_bar/default",
49
+ "name": "default",
50
+ "snapshot": "true",
51
+ "skip_rules": {
52
+ "wont_fix": [
53
+ "region"
54
+ ],
55
+ "will_fix": [
56
+ "color-contrast"
57
+ ]
58
+ }
59
+ },
60
+ {
61
+ "preview_path": "primer/alpha/action_bar/inline",
62
+ "name": "inline",
63
+ "snapshot": "false",
64
+ "skip_rules": {
65
+ "wont_fix": [
66
+ "region"
67
+ ],
68
+ "will_fix": [
69
+ "color-contrast"
70
+ ]
71
+ }
72
+ },
73
+ {
74
+ "preview_path": "primer/alpha/action_bar/playground",
75
+ "name": "playground",
76
+ "snapshot": "false",
77
+ "skip_rules": {
78
+ "wont_fix": [
79
+ "region"
80
+ ],
81
+ "will_fix": [
82
+ "color-contrast"
83
+ ]
84
+ }
85
+ },
86
+ {
87
+ "preview_path": "primer/alpha/action_bar/small",
88
+ "name": "small",
89
+ "snapshot": "false",
90
+ "skip_rules": {
91
+ "wont_fix": [
92
+ "region"
93
+ ],
94
+ "will_fix": [
95
+ "color-contrast"
96
+ ]
97
+ }
98
+ },
99
+ {
100
+ "preview_path": "primer/alpha/action_bar/medium",
101
+ "name": "medium",
102
+ "snapshot": "false",
103
+ "skip_rules": {
104
+ "wont_fix": [
105
+ "region"
106
+ ],
107
+ "will_fix": [
108
+ "color-contrast"
109
+ ]
110
+ }
111
+ },
112
+ {
113
+ "preview_path": "primer/alpha/action_bar/large",
114
+ "name": "large",
115
+ "snapshot": "false",
116
+ "skip_rules": {
117
+ "wont_fix": [
118
+ "region"
119
+ ],
120
+ "will_fix": [
121
+ "color-contrast"
122
+ ]
123
+ }
124
+ }
125
+ ],
126
+ "subcomponents": [
127
+ {
128
+ "fully_qualified_name": "Primer::Alpha::ActionBar::Item",
129
+ "description": "ActionBar::Item is an internal component that wraps the items in a div with the `ActionBar-item` class.",
130
+ "is_form_component": false,
131
+ "is_published": true,
132
+ "requires_js": false,
133
+ "component": "ActionBar::Item",
134
+ "status": "alpha",
135
+ "a11y_reviewed": false,
136
+ "short_name": "ActionBarItem",
137
+ "source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/action_bar/item.rb",
138
+ "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/action_bar/item/default/",
139
+ "parameters": [
140
+
141
+ ],
142
+ "slots": [
143
+
144
+ ],
145
+ "methods": [
146
+
147
+ ],
148
+ "previews": [
149
+
150
+ ],
151
+ "subcomponents": [
152
+
153
+ ]
154
+ },
155
+ {
156
+ "fully_qualified_name": "Primer::Alpha::ActionBar::Divider",
157
+ "description": "ActionBar::Item is an internal component that wraps the items in a div with the `ActionBar-item` class.",
158
+ "is_form_component": false,
159
+ "is_published": true,
160
+ "requires_js": false,
161
+ "component": "ActionBar::Divider",
162
+ "status": "alpha",
163
+ "a11y_reviewed": false,
164
+ "short_name": "ActionBarDivider",
165
+ "source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/action_bar/divider.rb",
166
+ "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/action_bar/divider/default/",
167
+ "parameters": [
168
+
169
+ ],
170
+ "slots": [
171
+
172
+ ],
173
+ "methods": [
174
+
175
+ ],
176
+ "previews": [
177
+
178
+ ],
179
+ "subcomponents": [
180
+
181
+ ]
182
+ }
183
+ ]
184
+ },
2
185
  {
3
186
  "fully_qualified_name": "Primer::Alpha::ActionList",
4
187
  "description": "An ActionList is a styled list of links. It acts as the base component for many\nother menu-type components, including `ActionMenu` and `SelectPanel`, as well as\nthe navigational component `NavList`.\n\nEach item in an action list can be augmented by specifying corresponding leading\nand/or trailing visuals.",
@@ -986,7 +1169,7 @@
986
1169
  {
987
1170
  "preview_path": "primer/alpha/action_menu/default",
988
1171
  "name": "default",
989
- "snapshot": "false",
1172
+ "snapshot": "interactive",
990
1173
  "skip_rules": {
991
1174
  "wont_fix": [
992
1175
  "region"
@@ -999,7 +1182,7 @@
999
1182
  {
1000
1183
  "preview_path": "primer/alpha/action_menu/wide",
1001
1184
  "name": "wide",
1002
- "snapshot": "false",
1185
+ "snapshot": "interactive",
1003
1186
  "skip_rules": {
1004
1187
  "wont_fix": [
1005
1188
  "region"
@@ -1064,7 +1247,7 @@
1064
1247
  {
1065
1248
  "preview_path": "primer/alpha/action_menu/single_selected_item",
1066
1249
  "name": "single_selected_item",
1067
- "snapshot": "false",
1250
+ "snapshot": "interactive",
1068
1251
  "skip_rules": {
1069
1252
  "wont_fix": [
1070
1253
  "region"
@@ -1077,7 +1260,7 @@
1077
1260
  {
1078
1261
  "preview_path": "primer/alpha/action_menu/single_select_with_internal_label",
1079
1262
  "name": "single_select_with_internal_label",
1080
- "snapshot": "false",
1263
+ "snapshot": "interactive",
1081
1264
  "skip_rules": {
1082
1265
  "wont_fix": [
1083
1266
  "region"
@@ -1090,7 +1273,7 @@
1090
1273
  {
1091
1274
  "preview_path": "primer/alpha/action_menu/multiple_selected_items",
1092
1275
  "name": "multiple_selected_items",
1093
- "snapshot": "false",
1276
+ "snapshot": "interactive",
1094
1277
  "skip_rules": {
1095
1278
  "wont_fix": [
1096
1279
  "region"
@@ -2540,7 +2723,7 @@
2540
2723
  {
2541
2724
  "preview_path": "primer/alpha/dialog/default",
2542
2725
  "name": "default",
2543
- "snapshot": "false",
2726
+ "snapshot": "interactive",
2544
2727
  "skip_rules": {
2545
2728
  "wont_fix": [
2546
2729
  "region"
@@ -2871,7 +3054,7 @@
2871
3054
  {
2872
3055
  "preview_path": "primer/alpha/dropdown/default",
2873
3056
  "name": "default",
2874
- "snapshot": "false",
3057
+ "snapshot": "interactive",
2875
3058
  "skip_rules": {
2876
3059
  "wont_fix": [
2877
3060
  "region"
@@ -11498,17 +11681,11 @@
11498
11681
  "source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/link.rb",
11499
11682
  "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/link/default/",
11500
11683
  "parameters": [
11501
- {
11502
- "name": "tag",
11503
- "type": "String",
11504
- "default": "`:a`",
11505
- "description": "One of `:a` or `:span`."
11506
- },
11507
11684
  {
11508
11685
  "name": "href",
11509
11686
  "type": "String",
11510
11687
  "default": "`nil`",
11511
- "description": "URL to be used for the Link. Required if tag is `:a`. If the requirements are not met an error will be raised in non production environments. In production, an empty link element will be rendered."
11688
+ "description": "URL to be used for the Link. Required. If the requirements are not met an error will be raised in non production environments. In production, an empty link element will be rendered."
11512
11689
  },
11513
11690
  {
11514
11691
  "name": "scheme",
@@ -1,4 +1,90 @@
1
1
  [
2
+ {
3
+ "name": "action_bar",
4
+ "component": "ActionBar",
5
+ "status": "alpha",
6
+ "lookup_path": "primer/alpha/action_bar",
7
+ "examples": [
8
+ {
9
+ "preview_path": "primer/alpha/action_bar/default",
10
+ "name": "default",
11
+ "snapshot": "true",
12
+ "skip_rules": {
13
+ "wont_fix": [
14
+ "region"
15
+ ],
16
+ "will_fix": [
17
+ "color-contrast"
18
+ ]
19
+ }
20
+ },
21
+ {
22
+ "preview_path": "primer/alpha/action_bar/inline",
23
+ "name": "inline",
24
+ "snapshot": "false",
25
+ "skip_rules": {
26
+ "wont_fix": [
27
+ "region"
28
+ ],
29
+ "will_fix": [
30
+ "color-contrast"
31
+ ]
32
+ }
33
+ },
34
+ {
35
+ "preview_path": "primer/alpha/action_bar/playground",
36
+ "name": "playground",
37
+ "snapshot": "false",
38
+ "skip_rules": {
39
+ "wont_fix": [
40
+ "region"
41
+ ],
42
+ "will_fix": [
43
+ "color-contrast"
44
+ ]
45
+ }
46
+ },
47
+ {
48
+ "preview_path": "primer/alpha/action_bar/small",
49
+ "name": "small",
50
+ "snapshot": "false",
51
+ "skip_rules": {
52
+ "wont_fix": [
53
+ "region"
54
+ ],
55
+ "will_fix": [
56
+ "color-contrast"
57
+ ]
58
+ }
59
+ },
60
+ {
61
+ "preview_path": "primer/alpha/action_bar/medium",
62
+ "name": "medium",
63
+ "snapshot": "false",
64
+ "skip_rules": {
65
+ "wont_fix": [
66
+ "region"
67
+ ],
68
+ "will_fix": [
69
+ "color-contrast"
70
+ ]
71
+ }
72
+ },
73
+ {
74
+ "preview_path": "primer/alpha/action_bar/large",
75
+ "name": "large",
76
+ "snapshot": "false",
77
+ "skip_rules": {
78
+ "wont_fix": [
79
+ "region"
80
+ ],
81
+ "will_fix": [
82
+ "color-contrast"
83
+ ]
84
+ }
85
+ }
86
+ ]
87
+ },
2
88
  {
3
89
  "name": "action_list",
4
90
  "component": "ActionList",
@@ -315,7 +401,7 @@
315
401
  {
316
402
  "preview_path": "primer/alpha/action_menu/default",
317
403
  "name": "default",
318
- "snapshot": "false",
404
+ "snapshot": "interactive",
319
405
  "skip_rules": {
320
406
  "wont_fix": [
321
407
  "region"
@@ -328,7 +414,7 @@
328
414
  {
329
415
  "preview_path": "primer/alpha/action_menu/wide",
330
416
  "name": "wide",
331
- "snapshot": "false",
417
+ "snapshot": "interactive",
332
418
  "skip_rules": {
333
419
  "wont_fix": [
334
420
  "region"
@@ -393,7 +479,7 @@
393
479
  {
394
480
  "preview_path": "primer/alpha/action_menu/single_selected_item",
395
481
  "name": "single_selected_item",
396
- "snapshot": "false",
482
+ "snapshot": "interactive",
397
483
  "skip_rules": {
398
484
  "wont_fix": [
399
485
  "region"
@@ -406,7 +492,7 @@
406
492
  {
407
493
  "preview_path": "primer/alpha/action_menu/single_select_with_internal_label",
408
494
  "name": "single_select_with_internal_label",
409
- "snapshot": "false",
495
+ "snapshot": "interactive",
410
496
  "skip_rules": {
411
497
  "wont_fix": [
412
498
  "region"
@@ -419,7 +505,7 @@
419
505
  {
420
506
  "preview_path": "primer/alpha/action_menu/multiple_selected_items",
421
507
  "name": "multiple_selected_items",
422
- "snapshot": "false",
508
+ "snapshot": "interactive",
423
509
  "skip_rules": {
424
510
  "wont_fix": [
425
511
  "region"
@@ -2685,7 +2771,7 @@
2685
2771
  {
2686
2772
  "preview_path": "primer/alpha/dialog/default",
2687
2773
  "name": "default",
2688
- "snapshot": "false",
2774
+ "snapshot": "interactive",
2689
2775
  "skip_rules": {
2690
2776
  "wont_fix": [
2691
2777
  "region"
@@ -2810,7 +2896,7 @@
2810
2896
  {
2811
2897
  "preview_path": "primer/alpha/dropdown/default",
2812
2898
  "name": "default",
2813
- "snapshot": "false",
2899
+ "snapshot": "interactive",
2814
2900
  "skip_rules": {
2815
2901
  "wont_fix": [
2816
2902
  "region"
@@ -1,4 +1,7 @@
1
1
  {
2
+ "Primer::Alpha::ActionBar": "alpha",
3
+ "Primer::Alpha::ActionBar::Divider": "alpha",
4
+ "Primer::Alpha::ActionBar::Item": "alpha",
2
5
  "Primer::Alpha::ActionList": "alpha",
3
6
  "Primer::Alpha::ActionList::Divider": "alpha",
4
7
  "Primer::Alpha::ActionList::FormWrapper": "alpha",