@primer/view-components 0.0.122-rc.00d67457 → 0.0.122-rc.6fc0bda9
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.
- package/package.json +1 -1
- package/static/arguments.json +1354 -1354
package/static/arguments.json
CHANGED
|
@@ -1,111 +1,33 @@
|
|
|
1
1
|
[
|
|
2
2
|
{
|
|
3
|
-
"component": "
|
|
4
|
-
"status": "
|
|
5
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/
|
|
6
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/
|
|
3
|
+
"component": "ActionList",
|
|
4
|
+
"status": "alpha",
|
|
5
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/action_list.rb",
|
|
6
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/action_list/default/",
|
|
7
7
|
"parameters": [
|
|
8
8
|
{
|
|
9
|
-
"name": "
|
|
10
|
-
"type": "
|
|
11
|
-
"default": "
|
|
12
|
-
"description": "
|
|
13
|
-
},
|
|
14
|
-
{
|
|
15
|
-
"name": "tense",
|
|
16
|
-
"type": "Symbol",
|
|
17
|
-
"default": "`:auto`",
|
|
18
|
-
"description": "Which tense to use. One of `:auto`, `:future`, or `:past`."
|
|
19
|
-
},
|
|
20
|
-
{
|
|
21
|
-
"name": "prefix",
|
|
22
|
-
"type": "sring",
|
|
23
|
-
"default": "`nil`",
|
|
24
|
-
"description": "What to prefix the relative ime display with."
|
|
25
|
-
},
|
|
26
|
-
{
|
|
27
|
-
"name": "second",
|
|
28
|
-
"type": "Symbol",
|
|
29
|
-
"default": "`SECOND_DEFAULT`",
|
|
30
|
-
"description": "What format seconds should take. One of `nil`, `:numeric`, or `:two_digit`."
|
|
31
|
-
},
|
|
32
|
-
{
|
|
33
|
-
"name": "minute",
|
|
34
|
-
"type": "Symbol",
|
|
35
|
-
"default": "`MINUTE_DEFAULT`",
|
|
36
|
-
"description": "What format minues should take. One of `nil`, `:numeric`, or `:two_digit`."
|
|
37
|
-
},
|
|
38
|
-
{
|
|
39
|
-
"name": "hour",
|
|
40
|
-
"type": "Symbol",
|
|
41
|
-
"default": "`HOUR_DEFAULT`",
|
|
42
|
-
"description": "What format hours should take. One of `nil`, `:numeric`, or `:two_digit`."
|
|
43
|
-
},
|
|
44
|
-
{
|
|
45
|
-
"name": "weekday",
|
|
46
|
-
"type": "Symbol",
|
|
47
|
-
"default": "`WEEKDAY_DEFAULT`",
|
|
48
|
-
"description": "What format weekdays should take. One of `nil`, `:long`, `:narrow`, or `:short`."
|
|
49
|
-
},
|
|
50
|
-
{
|
|
51
|
-
"name": "day",
|
|
52
|
-
"type": "Symbol",
|
|
53
|
-
"default": "`DAY_DEFAULT`",
|
|
54
|
-
"description": "What format days should take. One of `nil`, `:numeric`, or `:two_digit`."
|
|
55
|
-
},
|
|
56
|
-
{
|
|
57
|
-
"name": "month",
|
|
58
|
-
"type": "Symbol",
|
|
59
|
-
"default": "`MONTH_DEFAULT`",
|
|
60
|
-
"description": "What format months should take. One of `nil`, `:long`, `:narrow`, `:numeric`, `:short`, or `:two_digit`."
|
|
61
|
-
},
|
|
62
|
-
{
|
|
63
|
-
"name": "year",
|
|
64
|
-
"type": "Symbol",
|
|
65
|
-
"default": "`YEAR_DEFAULT`",
|
|
66
|
-
"description": "What format years should take. One of `nil`, `:numeric`, or `:two_digit`."
|
|
67
|
-
},
|
|
68
|
-
{
|
|
69
|
-
"name": "time_zone_name",
|
|
70
|
-
"type": "Symbol",
|
|
71
|
-
"default": "`TIMEZONENAME_DEFAULT`",
|
|
72
|
-
"description": "What format the time zone should take. One of `nil`, `:long`, `:long_generic`, `:long_offset`, `:short`, `:short_generic`, or `:short_offset`."
|
|
73
|
-
},
|
|
74
|
-
{
|
|
75
|
-
"name": "threshold",
|
|
76
|
-
"type": "string",
|
|
77
|
-
"default": "`nil`",
|
|
78
|
-
"description": "The threshold, in ISO-8601 'durations' format, at which relative time displays become absolute."
|
|
79
|
-
},
|
|
80
|
-
{
|
|
81
|
-
"name": "precision",
|
|
82
|
-
"type": "Symbol",
|
|
83
|
-
"default": "`PRECISION_DEFAULT`",
|
|
84
|
-
"description": "The precision elapsed time should display. One of `nil`, `:day`, `:hour`, `:minute`, `:month`, `:second`, or `:year`."
|
|
9
|
+
"name": "role",
|
|
10
|
+
"type": "Boolean",
|
|
11
|
+
"default": "`:list`",
|
|
12
|
+
"description": "ARIA role describing the function of the list. listbox and menu are a common values."
|
|
85
13
|
},
|
|
86
14
|
{
|
|
87
|
-
"name": "
|
|
88
|
-
"type": "
|
|
15
|
+
"name": "item_classes",
|
|
16
|
+
"type": "String",
|
|
89
17
|
"default": "`nil`",
|
|
90
|
-
"description": "
|
|
18
|
+
"description": "Additional CSS classes to attach to items."
|
|
91
19
|
},
|
|
92
20
|
{
|
|
93
|
-
"name": "
|
|
21
|
+
"name": "scheme",
|
|
94
22
|
"type": "Symbol",
|
|
95
|
-
"default": "`
|
|
96
|
-
"description": "
|
|
97
|
-
},
|
|
98
|
-
{
|
|
99
|
-
"name": "lang",
|
|
100
|
-
"type": "string",
|
|
101
|
-
"default": "`nil`",
|
|
102
|
-
"description": "The language to use."
|
|
23
|
+
"default": "`:full`",
|
|
24
|
+
"description": "One of `:full` or `:inset`.. `inset` children are offset (vertically and horizontally) from list edges. `full` (default) children are flush (vertically and horizontally) with list edges."
|
|
103
25
|
},
|
|
104
26
|
{
|
|
105
|
-
"name": "
|
|
106
|
-
"type": "
|
|
107
|
-
"default": "`
|
|
108
|
-
"description": "
|
|
27
|
+
"name": "show_dividers",
|
|
28
|
+
"type": "Boolean",
|
|
29
|
+
"default": "`false`",
|
|
30
|
+
"description": "Display a divider above each item in the list when it does not follow a header or divider."
|
|
109
31
|
},
|
|
110
32
|
{
|
|
111
33
|
"name": "system_arguments",
|
|
@@ -116,70 +38,60 @@
|
|
|
116
38
|
]
|
|
117
39
|
},
|
|
118
40
|
{
|
|
119
|
-
"component": "
|
|
120
|
-
"status": "
|
|
121
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/
|
|
122
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/
|
|
41
|
+
"component": "ActionList::Divider",
|
|
42
|
+
"status": "alpha",
|
|
43
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/action_list/divider.rb",
|
|
44
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/action_list/divider/default/",
|
|
123
45
|
"parameters": [
|
|
124
|
-
{
|
|
125
|
-
"name": "icon",
|
|
126
|
-
"type": "String",
|
|
127
|
-
"default": "N/A",
|
|
128
|
-
"description": "Name of [Octicon](https://primer.style/octicons/) to use."
|
|
129
|
-
},
|
|
130
|
-
{
|
|
131
|
-
"name": "wrapper_arguments",
|
|
132
|
-
"type": "Hash",
|
|
133
|
-
"default": "`{}`",
|
|
134
|
-
"description": "Optional keyword arguments to be passed to the wrapper `<div>` tag."
|
|
135
|
-
},
|
|
136
46
|
{
|
|
137
47
|
"name": "scheme",
|
|
138
48
|
"type": "Symbol",
|
|
139
|
-
"default": "`:
|
|
140
|
-
"description": "
|
|
141
|
-
},
|
|
142
|
-
{
|
|
143
|
-
"name": "size",
|
|
144
|
-
"type": "Symbol",
|
|
145
|
-
"default": "`:medium`",
|
|
146
|
-
"description": "One of `:large`, `:medium`, or `:small`."
|
|
49
|
+
"default": "`:subtle`",
|
|
50
|
+
"description": "Display a background color if scheme is `filled`."
|
|
147
51
|
},
|
|
148
52
|
{
|
|
149
|
-
"name": "
|
|
150
|
-
"type": "
|
|
53
|
+
"name": "system_arguments",
|
|
54
|
+
"type": "Hash",
|
|
151
55
|
"default": "N/A",
|
|
152
|
-
"description": "
|
|
153
|
-
}
|
|
56
|
+
"description": "[System arguments](/system-arguments)"
|
|
57
|
+
}
|
|
58
|
+
]
|
|
59
|
+
},
|
|
60
|
+
{
|
|
61
|
+
"component": "ActionList::Heading",
|
|
62
|
+
"status": "alpha",
|
|
63
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/action_list/heading.rb",
|
|
64
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/action_list/heading/default/",
|
|
65
|
+
"parameters": [
|
|
154
66
|
{
|
|
155
|
-
"name": "
|
|
156
|
-
"type": "
|
|
67
|
+
"name": "list_id",
|
|
68
|
+
"type": "String",
|
|
157
69
|
"default": "N/A",
|
|
158
|
-
"description": "
|
|
70
|
+
"description": "The unique identifier of the sub list the heading belongs to. Used internally."
|
|
159
71
|
},
|
|
160
72
|
{
|
|
161
|
-
"name": "
|
|
73
|
+
"name": "title",
|
|
162
74
|
"type": "String",
|
|
163
75
|
"default": "N/A",
|
|
164
|
-
"description": "
|
|
76
|
+
"description": "Sub list title."
|
|
165
77
|
},
|
|
166
78
|
{
|
|
167
|
-
"name": "
|
|
79
|
+
"name": "subtitle",
|
|
168
80
|
"type": "String",
|
|
169
|
-
"default": "
|
|
170
|
-
"description": "
|
|
81
|
+
"default": "`nil`",
|
|
82
|
+
"description": "Optional sub list description."
|
|
171
83
|
},
|
|
172
84
|
{
|
|
173
|
-
"name": "
|
|
174
|
-
"type": "
|
|
175
|
-
"default": "`
|
|
176
|
-
"description": "
|
|
85
|
+
"name": "scheme",
|
|
86
|
+
"type": "Symbol",
|
|
87
|
+
"default": "`:subtle`",
|
|
88
|
+
"description": "Display a background color if scheme is `filled`."
|
|
177
89
|
},
|
|
178
90
|
{
|
|
179
|
-
"name": "
|
|
91
|
+
"name": "tag",
|
|
180
92
|
"type": "Symbol",
|
|
181
|
-
"default": "`:
|
|
182
|
-
"description": "
|
|
93
|
+
"default": "`:h3`",
|
|
94
|
+
"description": "Semantic tag for the heading."
|
|
183
95
|
},
|
|
184
96
|
{
|
|
185
97
|
"name": "system_arguments",
|
|
@@ -190,130 +102,100 @@
|
|
|
190
102
|
]
|
|
191
103
|
},
|
|
192
104
|
{
|
|
193
|
-
"component": "
|
|
194
|
-
"status": "
|
|
195
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/
|
|
196
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/
|
|
105
|
+
"component": "ActionList::Item",
|
|
106
|
+
"status": "alpha",
|
|
107
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/action_list/item.rb",
|
|
108
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/action_list/item/default/",
|
|
197
109
|
"parameters": [
|
|
198
110
|
{
|
|
199
|
-
"name": "
|
|
200
|
-
"type": "
|
|
201
|
-
"default": "
|
|
202
|
-
"description": "
|
|
203
|
-
},
|
|
204
|
-
{
|
|
205
|
-
"name": "size",
|
|
206
|
-
"type": "Symbol",
|
|
207
|
-
"default": "`:medium`",
|
|
208
|
-
"description": "One of `:large`, `:medium`, or `:small`."
|
|
209
|
-
},
|
|
210
|
-
{
|
|
211
|
-
"name": "block",
|
|
212
|
-
"type": "Boolean",
|
|
213
|
-
"default": "`false`",
|
|
214
|
-
"description": "Whether button is full-width with `display: block`."
|
|
111
|
+
"name": "list",
|
|
112
|
+
"type": "Primer::Alpha::ActionList",
|
|
113
|
+
"default": "N/A",
|
|
114
|
+
"description": "The list that contains this item. Used internally."
|
|
215
115
|
},
|
|
216
116
|
{
|
|
217
|
-
"name": "
|
|
218
|
-
"type": "
|
|
219
|
-
"default": "
|
|
220
|
-
"description": "
|
|
117
|
+
"name": "parent",
|
|
118
|
+
"type": "Primer::Alpha::ActionList::Item",
|
|
119
|
+
"default": "`nil`",
|
|
120
|
+
"description": "This item's parent item. `nil` if this item is at the root. Used internally."
|
|
221
121
|
},
|
|
222
122
|
{
|
|
223
|
-
"name": "
|
|
224
|
-
"type": "
|
|
225
|
-
"default": "
|
|
226
|
-
"description": "
|
|
123
|
+
"name": "label",
|
|
124
|
+
"type": "String",
|
|
125
|
+
"default": "N/A",
|
|
126
|
+
"description": "Item label."
|
|
227
127
|
},
|
|
228
128
|
{
|
|
229
|
-
"name": "
|
|
230
|
-
"type": "
|
|
231
|
-
"default": "
|
|
232
|
-
"description": "
|
|
129
|
+
"name": "label_classes",
|
|
130
|
+
"type": "String",
|
|
131
|
+
"default": "`nil`",
|
|
132
|
+
"description": "CSS classes that will be added to the label."
|
|
233
133
|
},
|
|
234
134
|
{
|
|
235
|
-
"name": "
|
|
135
|
+
"name": "content_arguments",
|
|
236
136
|
"type": "Hash",
|
|
237
|
-
"default": "
|
|
238
|
-
"description": "[System arguments](/system-arguments)"
|
|
239
|
-
}
|
|
240
|
-
]
|
|
241
|
-
},
|
|
242
|
-
{
|
|
243
|
-
"component": "SegmentedControl",
|
|
244
|
-
"status": "alpha",
|
|
245
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/segmented_control.rb",
|
|
246
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/segmented_control/default/",
|
|
247
|
-
"parameters": [
|
|
137
|
+
"default": "`{}`",
|
|
138
|
+
"description": "[System arguments](/system-arguments) used to construct the item's anchor or button tag."
|
|
139
|
+
},
|
|
248
140
|
{
|
|
249
|
-
"name": "
|
|
141
|
+
"name": "truncate_label",
|
|
250
142
|
"type": "Boolean",
|
|
251
143
|
"default": "`false`",
|
|
252
|
-
"description": "
|
|
144
|
+
"description": "Truncate label with ellipsis."
|
|
253
145
|
},
|
|
254
146
|
{
|
|
255
|
-
"name": "
|
|
256
|
-
"type": "
|
|
257
|
-
"default": "`
|
|
258
|
-
"description": "
|
|
147
|
+
"name": "href",
|
|
148
|
+
"type": "String",
|
|
149
|
+
"default": "`nil`",
|
|
150
|
+
"description": "Link URL."
|
|
151
|
+
},
|
|
152
|
+
{
|
|
153
|
+
"name": "role",
|
|
154
|
+
"type": "String",
|
|
155
|
+
"default": "`:listitem`",
|
|
156
|
+
"description": "ARIA role describing the function of the item."
|
|
259
157
|
},
|
|
260
158
|
{
|
|
261
159
|
"name": "size",
|
|
262
160
|
"type": "Symbol",
|
|
263
161
|
"default": "`:medium`",
|
|
264
|
-
"description": "
|
|
162
|
+
"description": "Controls block sizing of the item."
|
|
265
163
|
},
|
|
266
164
|
{
|
|
267
|
-
"name": "
|
|
268
|
-
"type": "Hash",
|
|
269
|
-
"default": "N/A",
|
|
270
|
-
"description": "[System arguments](/system-arguments)"
|
|
271
|
-
}
|
|
272
|
-
]
|
|
273
|
-
},
|
|
274
|
-
{
|
|
275
|
-
"component": "Layout",
|
|
276
|
-
"status": "alpha",
|
|
277
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/layout.rb",
|
|
278
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/layout/default/",
|
|
279
|
-
"parameters": [
|
|
280
|
-
{
|
|
281
|
-
"name": "stacking_breakpoint",
|
|
165
|
+
"name": "scheme",
|
|
282
166
|
"type": "Symbol",
|
|
283
|
-
"default": "`:
|
|
284
|
-
"description": "
|
|
167
|
+
"default": "`:default`",
|
|
168
|
+
"description": "Controls color/style based on behavior."
|
|
285
169
|
},
|
|
286
170
|
{
|
|
287
|
-
"name": "
|
|
288
|
-
"type": "
|
|
289
|
-
"default": "
|
|
290
|
-
"description": "
|
|
171
|
+
"name": "disabled",
|
|
172
|
+
"type": "Boolean",
|
|
173
|
+
"default": "`false`",
|
|
174
|
+
"description": "Disabled items are not clickable and visually dim."
|
|
291
175
|
},
|
|
292
176
|
{
|
|
293
|
-
"name": "
|
|
177
|
+
"name": "description_scheme",
|
|
294
178
|
"type": "Symbol",
|
|
295
|
-
"default": "`:
|
|
296
|
-
"description": "
|
|
179
|
+
"default": "`:block`",
|
|
180
|
+
"description": "Display description inline with label, or block on the next line."
|
|
297
181
|
},
|
|
298
182
|
{
|
|
299
|
-
"name": "
|
|
300
|
-
"type": "Hash",
|
|
301
|
-
"default": "N/A",
|
|
302
|
-
"description": "[System arguments](/system-arguments)"
|
|
303
|
-
}
|
|
304
|
-
]
|
|
305
|
-
},
|
|
306
|
-
{
|
|
307
|
-
"component": "HellipButton",
|
|
308
|
-
"status": "alpha",
|
|
309
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/hellip_button.rb",
|
|
310
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/hellip_button/default/",
|
|
311
|
-
"parameters": [
|
|
312
|
-
{
|
|
313
|
-
"name": "inline",
|
|
183
|
+
"name": "active",
|
|
314
184
|
"type": "Boolean",
|
|
315
185
|
"default": "`false`",
|
|
316
|
-
"description": "
|
|
186
|
+
"description": "Sets an active state on navigational items."
|
|
187
|
+
},
|
|
188
|
+
{
|
|
189
|
+
"name": "on_click",
|
|
190
|
+
"type": "String",
|
|
191
|
+
"default": "`nil`",
|
|
192
|
+
"description": "JavaScript to execute when the item is clicked."
|
|
193
|
+
},
|
|
194
|
+
{
|
|
195
|
+
"name": "id",
|
|
196
|
+
"type": "String",
|
|
197
|
+
"default": "`self.class.generate_id`",
|
|
198
|
+
"description": "Used internally."
|
|
317
199
|
},
|
|
318
200
|
{
|
|
319
201
|
"name": "system_arguments",
|
|
@@ -324,68 +206,52 @@
|
|
|
324
206
|
]
|
|
325
207
|
},
|
|
326
208
|
{
|
|
327
|
-
"component": "
|
|
209
|
+
"component": "Banner",
|
|
328
210
|
"status": "alpha",
|
|
329
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/
|
|
330
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/
|
|
211
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/banner.rb",
|
|
212
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/banner/default/",
|
|
331
213
|
"parameters": [
|
|
332
214
|
{
|
|
333
|
-
"name": "
|
|
334
|
-
"type": "
|
|
335
|
-
"default": "
|
|
336
|
-
"description": "
|
|
215
|
+
"name": "full",
|
|
216
|
+
"type": "Boolean",
|
|
217
|
+
"default": "`false`",
|
|
218
|
+
"description": "Whether the component should take up the full width of the screen."
|
|
337
219
|
},
|
|
338
220
|
{
|
|
339
|
-
"name": "
|
|
340
|
-
"type": "
|
|
341
|
-
"default": "
|
|
342
|
-
"description": "
|
|
221
|
+
"name": "full_when_narrow",
|
|
222
|
+
"type": "Boolean",
|
|
223
|
+
"default": "`false`",
|
|
224
|
+
"description": "Whether the component should take up the full width of the screen when rendered inside smaller viewports."
|
|
343
225
|
},
|
|
344
226
|
{
|
|
345
|
-
"name": "
|
|
227
|
+
"name": "dismissible",
|
|
346
228
|
"type": "Boolean",
|
|
347
229
|
"default": "`false`",
|
|
348
|
-
"description": "Whether
|
|
230
|
+
"description": "Whether the component can be dismissed with an \"x\" button."
|
|
349
231
|
},
|
|
350
232
|
{
|
|
351
|
-
"name": "
|
|
352
|
-
"type": "
|
|
353
|
-
"default": "
|
|
354
|
-
"description": "
|
|
355
|
-
}
|
|
356
|
-
]
|
|
357
|
-
},
|
|
358
|
-
{
|
|
359
|
-
"component": "OcticonSymbols",
|
|
360
|
-
"status": "alpha",
|
|
361
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/octicon_symbols.rb",
|
|
362
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/octicon_symbols/default/",
|
|
363
|
-
"parameters": [
|
|
233
|
+
"name": "description",
|
|
234
|
+
"type": "String",
|
|
235
|
+
"default": "`nil`",
|
|
236
|
+
"description": "Description text rendered underneath the message."
|
|
237
|
+
},
|
|
364
238
|
{
|
|
365
|
-
"name": "
|
|
366
|
-
"type": "
|
|
367
|
-
"default": "`
|
|
368
|
-
"description": "
|
|
369
|
-
}
|
|
370
|
-
]
|
|
371
|
-
},
|
|
372
|
-
{
|
|
373
|
-
"component": "ImageCrop",
|
|
374
|
-
"status": "alpha",
|
|
375
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/image_crop.rb",
|
|
376
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/image_crop/default/",
|
|
377
|
-
"parameters": [
|
|
239
|
+
"name": "icon",
|
|
240
|
+
"type": "Symbol",
|
|
241
|
+
"default": "`nil`",
|
|
242
|
+
"description": "The name of an [Octicon](https://primer.style/octicons/) icon to use. If no icon is provided, a default one will be chosen based on the scheme."
|
|
243
|
+
},
|
|
378
244
|
{
|
|
379
|
-
"name": "
|
|
380
|
-
"type": "
|
|
381
|
-
"default": "
|
|
382
|
-
"description": "
|
|
245
|
+
"name": "scheme",
|
|
246
|
+
"type": "Symbol",
|
|
247
|
+
"default": "`:default`",
|
|
248
|
+
"description": "One of `:danger`, `:default`, `:success`, or `:warning`."
|
|
383
249
|
},
|
|
384
250
|
{
|
|
385
|
-
"name": "
|
|
251
|
+
"name": "reappear",
|
|
386
252
|
"type": "Boolean",
|
|
387
|
-
"default": "`
|
|
388
|
-
"description": "
|
|
253
|
+
"default": "`false`",
|
|
254
|
+
"description": "Whether or not the flash banner should reappear after being dismissed. Only for use in test and preview environments."
|
|
389
255
|
},
|
|
390
256
|
{
|
|
391
257
|
"name": "system_arguments",
|
|
@@ -396,58 +262,34 @@
|
|
|
396
262
|
]
|
|
397
263
|
},
|
|
398
264
|
{
|
|
399
|
-
"component": "
|
|
400
|
-
"status": "
|
|
401
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/
|
|
402
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/
|
|
265
|
+
"component": "ButtonMarketing",
|
|
266
|
+
"status": "alpha",
|
|
267
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/button_marketing.rb",
|
|
268
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/button_marketing/default/",
|
|
403
269
|
"parameters": [
|
|
404
270
|
{
|
|
405
271
|
"name": "scheme",
|
|
406
272
|
"type": "Symbol",
|
|
407
273
|
"default": "`:default`",
|
|
408
|
-
"description": "One of `:
|
|
274
|
+
"description": "One of `:default`, `:outline`, `:primary`, or `:transparent`."
|
|
409
275
|
},
|
|
410
276
|
{
|
|
411
|
-
"name": "
|
|
412
|
-
"type": "
|
|
413
|
-
"default": "
|
|
414
|
-
"description": "
|
|
277
|
+
"name": "variant",
|
|
278
|
+
"type": "Symbol",
|
|
279
|
+
"default": "`:default`",
|
|
280
|
+
"description": "One of `:default` or `:large`."
|
|
415
281
|
},
|
|
416
282
|
{
|
|
417
283
|
"name": "tag",
|
|
418
284
|
"type": "Symbol",
|
|
419
|
-
"default": "
|
|
420
|
-
"description": "One of `:a
|
|
285
|
+
"default": "`:button`",
|
|
286
|
+
"description": "One of `:a` or `:button`."
|
|
421
287
|
},
|
|
422
288
|
{
|
|
423
289
|
"name": "type",
|
|
424
290
|
"type": "Symbol",
|
|
425
|
-
"default": "
|
|
426
|
-
"description": "One of `:button
|
|
427
|
-
},
|
|
428
|
-
{
|
|
429
|
-
"name": "aria-label",
|
|
430
|
-
"type": "String",
|
|
431
|
-
"default": "N/A",
|
|
432
|
-
"description": "String that can be read by assistive technology. A label should be short and concise. See the accessibility section for more information."
|
|
433
|
-
},
|
|
434
|
-
{
|
|
435
|
-
"name": "aria-description",
|
|
436
|
-
"type": "String",
|
|
437
|
-
"default": "N/A",
|
|
438
|
-
"description": "String that can be read by assistive technology. A description can be longer as it is intended to provide more context and information. See the accessibility section for more information."
|
|
439
|
-
},
|
|
440
|
-
{
|
|
441
|
-
"name": "tooltip_direction",
|
|
442
|
-
"type": "Symbol",
|
|
443
|
-
"default": "`:s`",
|
|
444
|
-
"description": "One of `:e`, `:n`, `:ne`, `:nw`, `:s`, `:se`, `:sw`, or `:w`."
|
|
445
|
-
},
|
|
446
|
-
{
|
|
447
|
-
"name": "box",
|
|
448
|
-
"type": "Boolean",
|
|
449
|
-
"default": "`false`",
|
|
450
|
-
"description": "Whether the button is in a [BorderBox](/components/beta/borderbox). If `true`, the button will have the `Box-btn-octicon` class."
|
|
291
|
+
"default": "`:button`",
|
|
292
|
+
"description": "One of `:button` or `:submit`."
|
|
451
293
|
},
|
|
452
294
|
{
|
|
453
295
|
"name": "system_arguments",
|
|
@@ -458,138 +300,124 @@
|
|
|
458
300
|
]
|
|
459
301
|
},
|
|
460
302
|
{
|
|
461
|
-
"component": "
|
|
462
|
-
"status": "
|
|
463
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/
|
|
464
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/
|
|
303
|
+
"component": "Dialog",
|
|
304
|
+
"status": "alpha",
|
|
305
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/dialog.rb",
|
|
306
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/dialog/default/",
|
|
465
307
|
"parameters": [
|
|
466
308
|
{
|
|
467
|
-
"name": "
|
|
309
|
+
"name": "id",
|
|
468
310
|
"type": "String",
|
|
469
|
-
"default": "
|
|
470
|
-
"description": "The
|
|
311
|
+
"default": "`self.class.generate_id`",
|
|
312
|
+
"description": "The id of the dialog."
|
|
471
313
|
},
|
|
472
314
|
{
|
|
473
|
-
"name": "
|
|
315
|
+
"name": "title",
|
|
474
316
|
"type": "String",
|
|
475
317
|
"default": "N/A",
|
|
476
|
-
"description": "
|
|
318
|
+
"description": "Describes the content of the dialog."
|
|
477
319
|
},
|
|
478
320
|
{
|
|
479
|
-
"name": "
|
|
321
|
+
"name": "subtitle",
|
|
480
322
|
"type": "String",
|
|
481
|
-
"default": "
|
|
482
|
-
"description": "
|
|
323
|
+
"default": "`nil`",
|
|
324
|
+
"description": "Provides additional context for the dialog, also setting the `aria-describedby` attribute."
|
|
483
325
|
},
|
|
484
326
|
{
|
|
485
|
-
"name": "
|
|
486
|
-
"type": "
|
|
487
|
-
"default": "`
|
|
488
|
-
"description": "
|
|
327
|
+
"name": "size",
|
|
328
|
+
"type": "Symbol",
|
|
329
|
+
"default": "`:medium`",
|
|
330
|
+
"description": "The size of the dialog. One of `:auto`, `:large`, `:medium`, `:medium_portrait`, `:small`, or `:xlarge`."
|
|
489
331
|
},
|
|
490
332
|
{
|
|
491
|
-
"name": "
|
|
492
|
-
"type": "
|
|
493
|
-
"default": "
|
|
494
|
-
"description": "
|
|
333
|
+
"name": "position",
|
|
334
|
+
"type": "Symbol",
|
|
335
|
+
"default": "`:center`",
|
|
336
|
+
"description": "The position of the dialog. One of `:center`, `:left`, or `:right`."
|
|
495
337
|
},
|
|
496
338
|
{
|
|
497
|
-
"name": "
|
|
498
|
-
"type": "
|
|
499
|
-
"default": "`
|
|
500
|
-
"description": "
|
|
339
|
+
"name": "position_narrow",
|
|
340
|
+
"type": "Symbol",
|
|
341
|
+
"default": "`:inherit`",
|
|
342
|
+
"description": "The position of the dialog when narrow. One of `:bottom`, `:fullscreen`, `:inherit`, `:left`, or `:right`."
|
|
501
343
|
},
|
|
502
344
|
{
|
|
503
|
-
"name": "
|
|
345
|
+
"name": "visually_hide_title",
|
|
504
346
|
"type": "Boolean",
|
|
505
347
|
"default": "`false`",
|
|
506
|
-
"description": "
|
|
348
|
+
"description": "If true will hide the heading title, while still making it available to Screen Readers."
|
|
507
349
|
},
|
|
508
350
|
{
|
|
509
351
|
"name": "system_arguments",
|
|
510
352
|
"type": "Hash",
|
|
511
353
|
"default": "N/A",
|
|
512
354
|
"description": "[System arguments](/system-arguments)"
|
|
513
|
-
}
|
|
514
|
-
|
|
515
|
-
|
|
516
|
-
|
|
517
|
-
|
|
518
|
-
|
|
519
|
-
|
|
520
|
-
|
|
521
|
-
|
|
522
|
-
"type": "Boolean",
|
|
523
|
-
"default": "`false`",
|
|
524
|
-
"description": "Input can be full-width or fit to content"
|
|
525
|
-
},
|
|
355
|
+
}
|
|
356
|
+
]
|
|
357
|
+
},
|
|
358
|
+
{
|
|
359
|
+
"component": "Dropdown",
|
|
360
|
+
"status": "alpha",
|
|
361
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/dropdown.rb",
|
|
362
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/dropdown/default/",
|
|
363
|
+
"parameters": [
|
|
526
364
|
{
|
|
527
|
-
"name": "
|
|
528
|
-
"type": "
|
|
529
|
-
"default": "`
|
|
530
|
-
"description": "
|
|
365
|
+
"name": "overlay",
|
|
366
|
+
"type": "Symbol",
|
|
367
|
+
"default": "`:default`",
|
|
368
|
+
"description": "One of `:dark`, `:default`, or `:none`."
|
|
531
369
|
},
|
|
532
370
|
{
|
|
533
|
-
"name": "
|
|
371
|
+
"name": "with_caret",
|
|
534
372
|
"type": "Boolean",
|
|
535
373
|
"default": "`false`",
|
|
536
|
-
"description": "
|
|
374
|
+
"description": "Whether or not a caret should be rendered in the button."
|
|
537
375
|
},
|
|
538
376
|
{
|
|
539
|
-
"name": "
|
|
540
|
-
"type": "
|
|
541
|
-
"default": "
|
|
542
|
-
"description": "
|
|
543
|
-
}
|
|
377
|
+
"name": "system_arguments",
|
|
378
|
+
"type": "Hash",
|
|
379
|
+
"default": "N/A",
|
|
380
|
+
"description": "[System arguments](/system-arguments)"
|
|
381
|
+
}
|
|
382
|
+
]
|
|
383
|
+
},
|
|
384
|
+
{
|
|
385
|
+
"component": "HellipButton",
|
|
386
|
+
"status": "alpha",
|
|
387
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/hellip_button.rb",
|
|
388
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/hellip_button/default/",
|
|
389
|
+
"parameters": [
|
|
544
390
|
{
|
|
545
|
-
"name": "
|
|
391
|
+
"name": "inline",
|
|
546
392
|
"type": "Boolean",
|
|
547
393
|
"default": "`false`",
|
|
548
|
-
"description": "
|
|
394
|
+
"description": "Whether or not the button is inline."
|
|
549
395
|
},
|
|
550
396
|
{
|
|
551
|
-
"name": "
|
|
552
|
-
"type": "
|
|
553
|
-
"default": "
|
|
554
|
-
"description": "
|
|
397
|
+
"name": "system_arguments",
|
|
398
|
+
"type": "Hash",
|
|
399
|
+
"default": "N/A",
|
|
400
|
+
"description": "[System arguments](/system-arguments)"
|
|
555
401
|
}
|
|
556
402
|
]
|
|
557
403
|
},
|
|
558
404
|
{
|
|
559
|
-
"component": "
|
|
560
|
-
"status": "
|
|
561
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/
|
|
562
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/
|
|
405
|
+
"component": "HiddenTextExpander",
|
|
406
|
+
"status": "alpha",
|
|
407
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/hidden_text_expander.rb",
|
|
408
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/hidden_text_expander/default/",
|
|
563
409
|
"parameters": [
|
|
564
410
|
{
|
|
565
|
-
"name": "
|
|
566
|
-
"type": "String",
|
|
567
|
-
"default": "N/A",
|
|
568
|
-
"description": "Value of the item."
|
|
569
|
-
},
|
|
570
|
-
{
|
|
571
|
-
"name": "selected",
|
|
572
|
-
"type": "Boolean",
|
|
573
|
-
"default": "`false`",
|
|
574
|
-
"description": "Whether the item is selected."
|
|
575
|
-
},
|
|
576
|
-
{
|
|
577
|
-
"name": "disabled",
|
|
411
|
+
"name": "inline",
|
|
578
412
|
"type": "Boolean",
|
|
579
413
|
"default": "`false`",
|
|
580
|
-
"description": "Whether the
|
|
414
|
+
"description": "Whether or not the expander is inline."
|
|
581
415
|
},
|
|
582
416
|
{
|
|
583
|
-
"name": "
|
|
417
|
+
"name": "button_arguments",
|
|
584
418
|
"type": "Hash",
|
|
585
|
-
"default": "
|
|
586
|
-
"description": "
|
|
587
|
-
},
|
|
588
|
-
{
|
|
589
|
-
"name": "description",
|
|
590
|
-
"type": "String",
|
|
591
|
-
"default": "N/A",
|
|
592
|
-
"description": "Display description text below label"
|
|
419
|
+
"default": "`{}`",
|
|
420
|
+
"description": "[System arguments](/system-arguments) for the button element."
|
|
593
421
|
},
|
|
594
422
|
{
|
|
595
423
|
"name": "system_arguments",
|
|
@@ -600,40 +428,54 @@
|
|
|
600
428
|
]
|
|
601
429
|
},
|
|
602
430
|
{
|
|
603
|
-
"component": "
|
|
604
|
-
"status": "
|
|
605
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/
|
|
606
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/
|
|
431
|
+
"component": "Image",
|
|
432
|
+
"status": "alpha",
|
|
433
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/image.rb",
|
|
434
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/image/default/",
|
|
607
435
|
"parameters": [
|
|
608
436
|
{
|
|
609
437
|
"name": "src",
|
|
610
438
|
"type": "String",
|
|
611
439
|
"default": "N/A",
|
|
612
|
-
"description": "The source url of the
|
|
440
|
+
"description": "The source url of the image."
|
|
613
441
|
},
|
|
614
442
|
{
|
|
615
443
|
"name": "alt",
|
|
616
444
|
"type": "String",
|
|
617
445
|
"default": "N/A",
|
|
618
|
-
"description": "
|
|
446
|
+
"description": "Specifies an alternate text for the image."
|
|
619
447
|
},
|
|
620
448
|
{
|
|
621
|
-
"name": "
|
|
622
|
-
"type": "
|
|
623
|
-
"default": "`
|
|
624
|
-
"description": "
|
|
449
|
+
"name": "lazy",
|
|
450
|
+
"type": "Boolean",
|
|
451
|
+
"default": "`false`",
|
|
452
|
+
"description": "Whether or not to lazily load the image."
|
|
625
453
|
},
|
|
626
454
|
{
|
|
627
|
-
"name": "
|
|
628
|
-
"type": "
|
|
629
|
-
"default": "
|
|
630
|
-
"description": "
|
|
455
|
+
"name": "system_arguments",
|
|
456
|
+
"type": "Hash",
|
|
457
|
+
"default": "N/A",
|
|
458
|
+
"description": "[System arguments](/system-arguments)"
|
|
459
|
+
}
|
|
460
|
+
]
|
|
461
|
+
},
|
|
462
|
+
{
|
|
463
|
+
"component": "ImageCrop",
|
|
464
|
+
"status": "alpha",
|
|
465
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/image_crop.rb",
|
|
466
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/image_crop/default/",
|
|
467
|
+
"parameters": [
|
|
468
|
+
{
|
|
469
|
+
"name": "src",
|
|
470
|
+
"type": "String",
|
|
471
|
+
"default": "N/A",
|
|
472
|
+
"description": "The path of the image to crop."
|
|
631
473
|
},
|
|
632
474
|
{
|
|
633
|
-
"name": "
|
|
634
|
-
"type": "
|
|
635
|
-
"default": "`
|
|
636
|
-
"description": "
|
|
475
|
+
"name": "rounded",
|
|
476
|
+
"type": "Boolean",
|
|
477
|
+
"default": "`true`",
|
|
478
|
+
"description": "If the crop mask should be a circle. Defaults to true."
|
|
637
479
|
},
|
|
638
480
|
{
|
|
639
481
|
"name": "system_arguments",
|
|
@@ -644,35 +486,43 @@
|
|
|
644
486
|
]
|
|
645
487
|
},
|
|
646
488
|
{
|
|
647
|
-
"component": "
|
|
648
|
-
"status": "
|
|
649
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/
|
|
650
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/
|
|
489
|
+
"component": "Layout",
|
|
490
|
+
"status": "alpha",
|
|
491
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/layout.rb",
|
|
492
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/layout/default/",
|
|
651
493
|
"parameters": [
|
|
652
494
|
{
|
|
653
|
-
"name": "
|
|
495
|
+
"name": "stacking_breakpoint",
|
|
654
496
|
"type": "Symbol",
|
|
655
|
-
"default": "`:
|
|
656
|
-
"description": "One of `:
|
|
497
|
+
"default": "`:md`",
|
|
498
|
+
"description": "When the `Layout` should change from rows into columns. One of `:lg`, `:md`, or `:sm`."
|
|
657
499
|
},
|
|
658
500
|
{
|
|
659
|
-
"name": "
|
|
501
|
+
"name": "first_in_source",
|
|
660
502
|
"type": "Symbol",
|
|
661
|
-
"default": "`:
|
|
662
|
-
"description": "One of `:
|
|
503
|
+
"default": "`:sidebar`",
|
|
504
|
+
"description": "Which element to render first in the HTML. This will change the keyboard navigation order. One of `:main` or `:sidebar`."
|
|
663
505
|
},
|
|
664
506
|
{
|
|
665
|
-
"name": "
|
|
666
|
-
"type": "
|
|
667
|
-
"default": "`
|
|
668
|
-
"description": "
|
|
507
|
+
"name": "gutter",
|
|
508
|
+
"type": "Symbol",
|
|
509
|
+
"default": "`:default`",
|
|
510
|
+
"description": "The amount of space between the main section and the sidebar. One of `:condensed`, `:default`, `:none`, or `:spacious`."
|
|
669
511
|
},
|
|
670
512
|
{
|
|
671
|
-
"name": "
|
|
513
|
+
"name": "system_arguments",
|
|
672
514
|
"type": "Hash",
|
|
673
|
-
"default": "
|
|
674
|
-
"description": "
|
|
675
|
-
}
|
|
515
|
+
"default": "N/A",
|
|
516
|
+
"description": "[System arguments](/system-arguments)"
|
|
517
|
+
}
|
|
518
|
+
]
|
|
519
|
+
},
|
|
520
|
+
{
|
|
521
|
+
"component": "Menu",
|
|
522
|
+
"status": "alpha",
|
|
523
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/menu.rb",
|
|
524
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/menu/default/",
|
|
525
|
+
"parameters": [
|
|
676
526
|
{
|
|
677
527
|
"name": "system_arguments",
|
|
678
528
|
"type": "Hash",
|
|
@@ -682,28 +532,16 @@
|
|
|
682
532
|
]
|
|
683
533
|
},
|
|
684
534
|
{
|
|
685
|
-
"component": "
|
|
686
|
-
"status": "
|
|
687
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/
|
|
688
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/
|
|
535
|
+
"component": "NavList",
|
|
536
|
+
"status": "alpha",
|
|
537
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/nav_list.rb",
|
|
538
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/nav_list/default/",
|
|
689
539
|
"parameters": [
|
|
690
540
|
{
|
|
691
|
-
"name": "
|
|
692
|
-
"type": "Symbol",
|
|
693
|
-
"default": "`:button`",
|
|
694
|
-
"description": "One of `:a`, `:button`, or `:summary`."
|
|
695
|
-
},
|
|
696
|
-
{
|
|
697
|
-
"name": "type",
|
|
541
|
+
"name": "selected_item_id",
|
|
698
542
|
"type": "Symbol",
|
|
699
|
-
"default": "
|
|
700
|
-
"description": "
|
|
701
|
-
},
|
|
702
|
-
{
|
|
703
|
-
"name": "block",
|
|
704
|
-
"type": "Boolean",
|
|
705
|
-
"default": "`false`",
|
|
706
|
-
"description": "Whether button is full-width with `display: block`."
|
|
543
|
+
"default": "`nil`",
|
|
544
|
+
"description": "The ID of the currently selected item. The default is `nil`, meaning no item is selected."
|
|
707
545
|
},
|
|
708
546
|
{
|
|
709
547
|
"name": "system_arguments",
|
|
@@ -714,52 +552,34 @@
|
|
|
714
552
|
]
|
|
715
553
|
},
|
|
716
554
|
{
|
|
717
|
-
"component": "
|
|
555
|
+
"component": "NavList::Item",
|
|
718
556
|
"status": "alpha",
|
|
719
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/
|
|
720
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/
|
|
557
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/nav_list/item.rb",
|
|
558
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/nav_list/item/default/",
|
|
721
559
|
"parameters": [
|
|
722
560
|
{
|
|
723
|
-
"name": "
|
|
724
|
-
"type": "
|
|
725
|
-
"default": "`
|
|
726
|
-
"description": "
|
|
561
|
+
"name": "selected_item_id",
|
|
562
|
+
"type": "Symbol",
|
|
563
|
+
"default": "`nil`",
|
|
564
|
+
"description": "The ID of the currently selected list item. Used internally."
|
|
727
565
|
},
|
|
728
566
|
{
|
|
729
|
-
"name": "
|
|
730
|
-
"type": "
|
|
731
|
-
"default": "`
|
|
732
|
-
"description": "
|
|
567
|
+
"name": "selected_by_ids",
|
|
568
|
+
"type": "Array<Symbol>",
|
|
569
|
+
"default": "`[]`",
|
|
570
|
+
"description": "The list of IDs that select this item. In other words, if the `selected_item_id` attribute on the parent `NavList` is set to one of these IDs, the item will appear selected."
|
|
733
571
|
},
|
|
734
572
|
{
|
|
735
|
-
"name": "
|
|
573
|
+
"name": "expanded",
|
|
736
574
|
"type": "Boolean",
|
|
737
575
|
"default": "`false`",
|
|
738
|
-
"description": "Whether
|
|
739
|
-
},
|
|
740
|
-
{
|
|
741
|
-
"name": "description",
|
|
742
|
-
"type": "String",
|
|
743
|
-
"default": "`nil`",
|
|
744
|
-
"description": "Description text rendered underneath the message."
|
|
745
|
-
},
|
|
746
|
-
{
|
|
747
|
-
"name": "icon",
|
|
748
|
-
"type": "Symbol",
|
|
749
|
-
"default": "`nil`",
|
|
750
|
-
"description": "The name of an [Octicon](https://primer.style/octicons/) icon to use. If no icon is provided, a default one will be chosen based on the scheme."
|
|
751
|
-
},
|
|
752
|
-
{
|
|
753
|
-
"name": "scheme",
|
|
754
|
-
"type": "Symbol",
|
|
755
|
-
"default": "`:default`",
|
|
756
|
-
"description": "One of `:danger`, `:default`, `:success`, or `:warning`."
|
|
576
|
+
"description": "Whether this item shows (expands) or hides (collapses) its list of sub items."
|
|
757
577
|
},
|
|
758
578
|
{
|
|
759
|
-
"name": "
|
|
579
|
+
"name": "sub_item",
|
|
760
580
|
"type": "Boolean",
|
|
761
581
|
"default": "`false`",
|
|
762
|
-
"description": "Whether or not
|
|
582
|
+
"description": "Whether or not this item is nested under a parent item. Used internally."
|
|
763
583
|
},
|
|
764
584
|
{
|
|
765
585
|
"name": "system_arguments",
|
|
@@ -770,28 +590,16 @@
|
|
|
770
590
|
]
|
|
771
591
|
},
|
|
772
592
|
{
|
|
773
|
-
"component": "
|
|
774
|
-
"status": "
|
|
775
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/
|
|
776
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/
|
|
593
|
+
"component": "NavList::Section",
|
|
594
|
+
"status": "alpha",
|
|
595
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/nav_list/section.rb",
|
|
596
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/nav_list/section/default/",
|
|
777
597
|
"parameters": [
|
|
778
598
|
{
|
|
779
|
-
"name": "
|
|
780
|
-
"type": "
|
|
781
|
-
"default": "`
|
|
782
|
-
"description": "
|
|
783
|
-
},
|
|
784
|
-
{
|
|
785
|
-
"name": "spacious",
|
|
786
|
-
"type": "Boolean",
|
|
787
|
-
"default": "`false`",
|
|
788
|
-
"description": "Increases the padding from `32px` to `80px 40px`."
|
|
789
|
-
},
|
|
790
|
-
{
|
|
791
|
-
"name": "border",
|
|
792
|
-
"type": "Boolean",
|
|
793
|
-
"default": "`false`",
|
|
794
|
-
"description": "Adds a border around the Blankslate."
|
|
599
|
+
"name": "selected_item_id",
|
|
600
|
+
"type": "Symbol",
|
|
601
|
+
"default": "`nil`",
|
|
602
|
+
"description": "The ID of the currently selected item. Used internally."
|
|
795
603
|
},
|
|
796
604
|
{
|
|
797
605
|
"name": "system_arguments",
|
|
@@ -802,16 +610,42 @@
|
|
|
802
610
|
]
|
|
803
611
|
},
|
|
804
612
|
{
|
|
805
|
-
"component": "
|
|
806
|
-
"status": "
|
|
807
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/
|
|
808
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/
|
|
613
|
+
"component": "OcticonSymbols",
|
|
614
|
+
"status": "alpha",
|
|
615
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/octicon_symbols.rb",
|
|
616
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/octicon_symbols/default/",
|
|
809
617
|
"parameters": [
|
|
810
618
|
{
|
|
811
|
-
"name": "
|
|
619
|
+
"name": "icons",
|
|
620
|
+
"type": "Array<Hash>",
|
|
621
|
+
"default": "`[]`",
|
|
622
|
+
"description": "List of icons to render, in the format { symbol: :icon_name, size: :small }"
|
|
623
|
+
}
|
|
624
|
+
]
|
|
625
|
+
},
|
|
626
|
+
{
|
|
627
|
+
"component": "SegmentedControl",
|
|
628
|
+
"status": "alpha",
|
|
629
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/segmented_control.rb",
|
|
630
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/segmented_control/default/",
|
|
631
|
+
"parameters": [
|
|
632
|
+
{
|
|
633
|
+
"name": "hide_labels",
|
|
634
|
+
"type": "Boolean",
|
|
635
|
+
"default": "`false`",
|
|
636
|
+
"description": "Whether to hide the labels and only show the icons"
|
|
637
|
+
},
|
|
638
|
+
{
|
|
639
|
+
"name": "full_width",
|
|
640
|
+
"type": "Boolean",
|
|
641
|
+
"default": "`false`",
|
|
642
|
+
"description": "If the component should be full width"
|
|
643
|
+
},
|
|
644
|
+
{
|
|
645
|
+
"name": "size",
|
|
812
646
|
"type": "Symbol",
|
|
813
|
-
"default": "`:
|
|
814
|
-
"description": "One of `:
|
|
647
|
+
"default": "`:medium`",
|
|
648
|
+
"description": "One of `:large`, `:medium`, or `:small`."
|
|
815
649
|
},
|
|
816
650
|
{
|
|
817
651
|
"name": "system_arguments",
|
|
@@ -822,10 +656,10 @@
|
|
|
822
656
|
]
|
|
823
657
|
},
|
|
824
658
|
{
|
|
825
|
-
"component": "
|
|
826
|
-
"status": "
|
|
827
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/
|
|
828
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/
|
|
659
|
+
"component": "TabContainer",
|
|
660
|
+
"status": "alpha",
|
|
661
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/tab_container.rb",
|
|
662
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/tab_container/default/",
|
|
829
663
|
"parameters": [
|
|
830
664
|
{
|
|
831
665
|
"name": "system_arguments",
|
|
@@ -836,11 +670,29 @@
|
|
|
836
670
|
]
|
|
837
671
|
},
|
|
838
672
|
{
|
|
839
|
-
"component": "
|
|
840
|
-
"status": "
|
|
841
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/
|
|
842
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/
|
|
673
|
+
"component": "TabNav",
|
|
674
|
+
"status": "alpha",
|
|
675
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/tab_nav.rb",
|
|
676
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/tab_nav/default/",
|
|
843
677
|
"parameters": [
|
|
678
|
+
{
|
|
679
|
+
"name": "tag",
|
|
680
|
+
"type": "Symbol",
|
|
681
|
+
"default": "`:nav`",
|
|
682
|
+
"description": "One of `:div` or `:nav`."
|
|
683
|
+
},
|
|
684
|
+
{
|
|
685
|
+
"name": "label",
|
|
686
|
+
"type": "String",
|
|
687
|
+
"default": "N/A",
|
|
688
|
+
"description": "Sets an `aria-label` that helps assistive technology users understand the purpose of the links, and distinguish it from similar elements."
|
|
689
|
+
},
|
|
690
|
+
{
|
|
691
|
+
"name": "body_arguments",
|
|
692
|
+
"type": "Hash",
|
|
693
|
+
"default": "`{}`",
|
|
694
|
+
"description": "[System arguments](/system-arguments) for the body wrapper."
|
|
695
|
+
},
|
|
844
696
|
{
|
|
845
697
|
"name": "system_arguments",
|
|
846
698
|
"type": "Hash",
|
|
@@ -850,11 +702,35 @@
|
|
|
850
702
|
]
|
|
851
703
|
},
|
|
852
704
|
{
|
|
853
|
-
"component": "
|
|
854
|
-
"status": "
|
|
855
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/
|
|
856
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/
|
|
705
|
+
"component": "TabPanels",
|
|
706
|
+
"status": "alpha",
|
|
707
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/tab_panels.rb",
|
|
708
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/tab_panels/default/",
|
|
857
709
|
"parameters": [
|
|
710
|
+
{
|
|
711
|
+
"name": "label",
|
|
712
|
+
"type": "String",
|
|
713
|
+
"default": "N/A",
|
|
714
|
+
"description": "Sets an `aria-label` that helps assistive technology users understand the purpose of the tabs."
|
|
715
|
+
},
|
|
716
|
+
{
|
|
717
|
+
"name": "align",
|
|
718
|
+
"type": "Symbol",
|
|
719
|
+
"default": "N/A",
|
|
720
|
+
"description": "One of `:left` or `:right`. - Defaults to left"
|
|
721
|
+
},
|
|
722
|
+
{
|
|
723
|
+
"name": "body_arguments",
|
|
724
|
+
"type": "Hash",
|
|
725
|
+
"default": "`{}`",
|
|
726
|
+
"description": "[System arguments](/system-arguments) for the body wrapper."
|
|
727
|
+
},
|
|
728
|
+
{
|
|
729
|
+
"name": "wrapper_arguments",
|
|
730
|
+
"type": "Hash",
|
|
731
|
+
"default": "`{}`",
|
|
732
|
+
"description": "[System arguments](/system-arguments) for the `TabContainer` wrapper."
|
|
733
|
+
},
|
|
858
734
|
{
|
|
859
735
|
"name": "system_arguments",
|
|
860
736
|
"type": "Hash",
|
|
@@ -864,154 +740,186 @@
|
|
|
864
740
|
]
|
|
865
741
|
},
|
|
866
742
|
{
|
|
867
|
-
"component": "
|
|
868
|
-
"status": "
|
|
869
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/
|
|
870
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/
|
|
743
|
+
"component": "TextField",
|
|
744
|
+
"status": "alpha",
|
|
745
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/text_field.rb",
|
|
746
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/text_field/default/",
|
|
871
747
|
"parameters": [
|
|
872
748
|
{
|
|
873
|
-
"name": "
|
|
874
|
-
"type": "
|
|
875
|
-
"default": "
|
|
876
|
-
"description": "
|
|
749
|
+
"name": "name",
|
|
750
|
+
"type": "String",
|
|
751
|
+
"default": "N/A",
|
|
752
|
+
"description": "Value for the HTML name attribute."
|
|
877
753
|
},
|
|
878
754
|
{
|
|
879
|
-
"name": "
|
|
880
|
-
"type": "
|
|
881
|
-
"default": "
|
|
882
|
-
"description": "
|
|
755
|
+
"name": "id",
|
|
756
|
+
"type": "String",
|
|
757
|
+
"default": "N/A",
|
|
758
|
+
"description": "Value for the HTML id attribute."
|
|
759
|
+
},
|
|
760
|
+
{
|
|
761
|
+
"name": "class",
|
|
762
|
+
"type": "String",
|
|
763
|
+
"default": "N/A",
|
|
764
|
+
"description": "A list of CSS classes to add to the input. Exists for compatibility with Rails form builders."
|
|
765
|
+
},
|
|
766
|
+
{
|
|
767
|
+
"name": "classes",
|
|
768
|
+
"type": "String",
|
|
769
|
+
"default": "N/A",
|
|
770
|
+
"description": "A list of CSS classes to add to the input. Combined with the `:class` argument."
|
|
771
|
+
},
|
|
772
|
+
{
|
|
773
|
+
"name": "caption",
|
|
774
|
+
"type": "String",
|
|
775
|
+
"default": "N/A",
|
|
776
|
+
"description": "Caption text to render below the input."
|
|
777
|
+
},
|
|
778
|
+
{
|
|
779
|
+
"name": "label",
|
|
780
|
+
"type": "String",
|
|
781
|
+
"default": "N/A",
|
|
782
|
+
"description": "Label text displayed above the input."
|
|
783
|
+
},
|
|
784
|
+
{
|
|
785
|
+
"name": "visually_hide_label",
|
|
786
|
+
"type": "Boolean",
|
|
787
|
+
"default": "N/A",
|
|
788
|
+
"description": "Whether or not to visually hide the label. If `true` the label will be hidden visually but still available to screen readers."
|
|
883
789
|
},
|
|
884
790
|
{
|
|
885
791
|
"name": "size",
|
|
886
792
|
"type": "Symbol",
|
|
887
|
-
"default": "
|
|
888
|
-
"description": "One of `:medium
|
|
793
|
+
"default": "N/A",
|
|
794
|
+
"description": "The size of the field. One of `:large`, `:medium`, or `:small`."
|
|
889
795
|
},
|
|
890
796
|
{
|
|
891
|
-
"name": "
|
|
892
|
-
"type": "
|
|
893
|
-
"default": "
|
|
894
|
-
"description": "
|
|
797
|
+
"name": "show_clear_button",
|
|
798
|
+
"type": "Boolean",
|
|
799
|
+
"default": "N/A",
|
|
800
|
+
"description": "Whether or not to include a clear button inside the input that clears the input's contents when clicked."
|
|
895
801
|
},
|
|
896
802
|
{
|
|
897
|
-
"name": "
|
|
898
|
-
"type": "
|
|
899
|
-
"default": "
|
|
900
|
-
"description": "
|
|
803
|
+
"name": "clear_button_id",
|
|
804
|
+
"type": "String",
|
|
805
|
+
"default": "N/A",
|
|
806
|
+
"description": "The HTML id attribute of the clear button."
|
|
901
807
|
},
|
|
902
808
|
{
|
|
903
|
-
"name": "
|
|
809
|
+
"name": "full_width",
|
|
904
810
|
"type": "Boolean",
|
|
905
|
-
"default": "
|
|
906
|
-
"description": "
|
|
811
|
+
"default": "N/A",
|
|
812
|
+
"description": "Controls whether or not the input takes the full width of its container."
|
|
907
813
|
},
|
|
908
814
|
{
|
|
909
|
-
"name": "
|
|
815
|
+
"name": "disabled",
|
|
910
816
|
"type": "Boolean",
|
|
911
|
-
"default": "
|
|
912
|
-
"description": "Whether
|
|
817
|
+
"default": "N/A",
|
|
818
|
+
"description": "Whether or not the input should accept keyboard and mouse input."
|
|
913
819
|
},
|
|
914
820
|
{
|
|
915
|
-
"name": "
|
|
821
|
+
"name": "invalid",
|
|
916
822
|
"type": "Boolean",
|
|
917
|
-
"default": "
|
|
918
|
-
"description": "
|
|
823
|
+
"default": "N/A",
|
|
824
|
+
"description": "If `true`, renders the input in a visually invalid state."
|
|
919
825
|
},
|
|
920
826
|
{
|
|
921
|
-
"name": "
|
|
922
|
-
"type": "
|
|
827
|
+
"name": "placeholder",
|
|
828
|
+
"type": "String",
|
|
923
829
|
"default": "N/A",
|
|
924
|
-
"description": "
|
|
925
|
-
}
|
|
926
|
-
]
|
|
927
|
-
},
|
|
928
|
-
{
|
|
929
|
-
"component": "ButtonGroup",
|
|
930
|
-
"status": "beta",
|
|
931
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/button_group.rb",
|
|
932
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/button_group/default/",
|
|
933
|
-
"parameters": [
|
|
830
|
+
"description": "Placeholder text."
|
|
831
|
+
},
|
|
934
832
|
{
|
|
935
|
-
"name": "
|
|
936
|
-
"type": "
|
|
937
|
-
"default": "
|
|
938
|
-
"description": "
|
|
833
|
+
"name": "inset",
|
|
834
|
+
"type": "Boolean",
|
|
835
|
+
"default": "N/A",
|
|
836
|
+
"description": "If `true`, renders the input in a visually inset state."
|
|
939
837
|
},
|
|
940
838
|
{
|
|
941
|
-
"name": "
|
|
942
|
-
"type": "
|
|
943
|
-
"default": "
|
|
944
|
-
"description": "
|
|
839
|
+
"name": "monospace",
|
|
840
|
+
"type": "Boolean",
|
|
841
|
+
"default": "N/A",
|
|
842
|
+
"description": "If `true`, uses a monospace font for the input field."
|
|
945
843
|
},
|
|
946
844
|
{
|
|
947
|
-
"name": "
|
|
845
|
+
"name": "leading_visual",
|
|
948
846
|
"type": "Hash",
|
|
949
847
|
"default": "N/A",
|
|
950
|
-
"description": "[
|
|
951
|
-
}
|
|
952
|
-
]
|
|
953
|
-
},
|
|
954
|
-
{
|
|
955
|
-
"component": "ButtonMarketing",
|
|
956
|
-
"status": "alpha",
|
|
957
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/button_marketing.rb",
|
|
958
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/button_marketing/default/",
|
|
959
|
-
"parameters": [
|
|
960
|
-
{
|
|
961
|
-
"name": "scheme",
|
|
962
|
-
"type": "Symbol",
|
|
963
|
-
"default": "`:default`",
|
|
964
|
-
"description": "One of `:default`, `:outline`, `:primary`, or `:transparent`."
|
|
848
|
+
"description": "Renders a leading visual icon before the text field's cursor. The hash will be passed to Primer's [Octicon component](https://primer.style/view-components/components/octicon)."
|
|
965
849
|
},
|
|
966
850
|
{
|
|
967
|
-
"name": "
|
|
968
|
-
"type": "
|
|
969
|
-
"default": "
|
|
970
|
-
"description": "
|
|
851
|
+
"name": "validation_message",
|
|
852
|
+
"type": "String",
|
|
853
|
+
"default": "N/A",
|
|
854
|
+
"description": "A validation message to display beneath the input. Implicitly sets `invalid` to `true`."
|
|
971
855
|
},
|
|
972
856
|
{
|
|
973
|
-
"name": "
|
|
974
|
-
"type": "
|
|
975
|
-
"default": "
|
|
976
|
-
"description": "
|
|
857
|
+
"name": "label_arguments",
|
|
858
|
+
"type": "Hash",
|
|
859
|
+
"default": "N/A",
|
|
860
|
+
"description": "System arugments passed to the Rails builder's `#label` method. These arguments will appear as HTML attributes on the `<label>` tag."
|
|
977
861
|
},
|
|
978
862
|
{
|
|
979
|
-
"name": "
|
|
980
|
-
"type": "
|
|
981
|
-
"default": "
|
|
982
|
-
"description": "
|
|
863
|
+
"name": "auto_check_src",
|
|
864
|
+
"type": "String",
|
|
865
|
+
"default": "N/A",
|
|
866
|
+
"description": "When provided, makes a request to the given URL whenever the contents of the text field changes. If the server responds with a non-2xx status code, the response body is used as the validation message."
|
|
983
867
|
},
|
|
984
868
|
{
|
|
985
869
|
"name": "system_arguments",
|
|
986
870
|
"type": "Hash",
|
|
987
871
|
"default": "N/A",
|
|
988
872
|
"description": "[System arguments](/system-arguments)"
|
|
873
|
+
},
|
|
874
|
+
{
|
|
875
|
+
"name": "block",
|
|
876
|
+
"type": "Proc",
|
|
877
|
+
"default": "N/A",
|
|
878
|
+
"description": "Unused."
|
|
989
879
|
}
|
|
990
880
|
]
|
|
991
881
|
},
|
|
992
882
|
{
|
|
993
|
-
"component": "
|
|
994
|
-
"status": "
|
|
995
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/
|
|
996
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/
|
|
883
|
+
"component": "ToggleSwitch",
|
|
884
|
+
"status": "alpha",
|
|
885
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/toggle_switch.rb",
|
|
886
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/toggle_switch/default/",
|
|
997
887
|
"parameters": [
|
|
998
888
|
{
|
|
999
|
-
"name": "
|
|
889
|
+
"name": "src",
|
|
1000
890
|
"type": "String",
|
|
1001
|
-
"default": "
|
|
1002
|
-
"description": "
|
|
891
|
+
"default": "`nil`",
|
|
892
|
+
"description": "The URL to POST to when the toggle switch is toggled. If `nil`, the toggle switch will not make any requests."
|
|
1003
893
|
},
|
|
1004
894
|
{
|
|
1005
|
-
"name": "
|
|
895
|
+
"name": "csrf_token",
|
|
1006
896
|
"type": "String",
|
|
1007
897
|
"default": "`nil`",
|
|
1008
|
-
"description": "
|
|
898
|
+
"description": "A CSRF token that will be sent to the server as \"authenticity_token\" when the toggle switch is toggled. Unused if `src` is `nil`."
|
|
1009
899
|
},
|
|
1010
900
|
{
|
|
1011
|
-
"name": "
|
|
1012
|
-
"type": "
|
|
1013
|
-
"default": "
|
|
1014
|
-
"description": "
|
|
901
|
+
"name": "checked",
|
|
902
|
+
"type": "Boolean",
|
|
903
|
+
"default": "`false`",
|
|
904
|
+
"description": "Whether the toggle switch is on or off."
|
|
905
|
+
},
|
|
906
|
+
{
|
|
907
|
+
"name": "enabled",
|
|
908
|
+
"type": "Boolean",
|
|
909
|
+
"default": "`true`",
|
|
910
|
+
"description": "Whether or not the toggle switch responds to user input."
|
|
911
|
+
},
|
|
912
|
+
{
|
|
913
|
+
"name": "size",
|
|
914
|
+
"type": "Symbol",
|
|
915
|
+
"default": "`:medium`",
|
|
916
|
+
"description": "What size toggle switch to render. One of `:end` or `:start`."
|
|
917
|
+
},
|
|
918
|
+
{
|
|
919
|
+
"name": "status_label_position",
|
|
920
|
+
"type": "Symbol",
|
|
921
|
+
"default": "`:start`",
|
|
922
|
+
"description": "Which side of the toggle switch to render the status label. One of `:medium` or `:small`."
|
|
1015
923
|
},
|
|
1016
924
|
{
|
|
1017
925
|
"name": "system_arguments",
|
|
@@ -1022,16 +930,34 @@
|
|
|
1022
930
|
]
|
|
1023
931
|
},
|
|
1024
932
|
{
|
|
1025
|
-
"component": "
|
|
1026
|
-
"status": "
|
|
1027
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/
|
|
1028
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/
|
|
933
|
+
"component": "Tooltip",
|
|
934
|
+
"status": "alpha",
|
|
935
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/tooltip.rb",
|
|
936
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/tooltip/default/",
|
|
1029
937
|
"parameters": [
|
|
938
|
+
{
|
|
939
|
+
"name": "for_id",
|
|
940
|
+
"type": "String",
|
|
941
|
+
"default": "N/A",
|
|
942
|
+
"description": "The ID of the element that the tooltip should be attached to."
|
|
943
|
+
},
|
|
1030
944
|
{
|
|
1031
945
|
"name": "type",
|
|
1032
946
|
"type": "Symbol",
|
|
1033
|
-
"default": "
|
|
1034
|
-
"description": "One of `:
|
|
947
|
+
"default": "N/A",
|
|
948
|
+
"description": "One of `:description` or `:label`."
|
|
949
|
+
},
|
|
950
|
+
{
|
|
951
|
+
"name": "direction",
|
|
952
|
+
"type": "Symbol",
|
|
953
|
+
"default": "`:s`",
|
|
954
|
+
"description": "One of `:e`, `:n`, `:ne`, `:nw`, `:s`, `:se`, `:sw`, or `:w`."
|
|
955
|
+
},
|
|
956
|
+
{
|
|
957
|
+
"name": "text",
|
|
958
|
+
"type": "String",
|
|
959
|
+
"default": "N/A",
|
|
960
|
+
"description": "The text content of the tooltip. This should be brief and no longer than a sentence."
|
|
1035
961
|
},
|
|
1036
962
|
{
|
|
1037
963
|
"name": "system_arguments",
|
|
@@ -1042,46 +968,34 @@
|
|
|
1042
968
|
]
|
|
1043
969
|
},
|
|
1044
970
|
{
|
|
1045
|
-
"component": "
|
|
1046
|
-
"status": "
|
|
1047
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/
|
|
1048
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/
|
|
971
|
+
"component": "UnderlineNav",
|
|
972
|
+
"status": "alpha",
|
|
973
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/underline_nav.rb",
|
|
974
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/underline_nav/default/",
|
|
1049
975
|
"parameters": [
|
|
1050
976
|
{
|
|
1051
|
-
"name": "
|
|
1052
|
-
"type": "Integer, Float::INFINITY, nil",
|
|
1053
|
-
"default": "`0`",
|
|
1054
|
-
"description": "The number to be displayed (e.x. # of issues, pull requests)"
|
|
1055
|
-
},
|
|
1056
|
-
{
|
|
1057
|
-
"name": "scheme",
|
|
977
|
+
"name": "tag",
|
|
1058
978
|
"type": "Symbol",
|
|
1059
|
-
"default": "`:
|
|
1060
|
-
"description": "
|
|
1061
|
-
},
|
|
1062
|
-
{
|
|
1063
|
-
"name": "limit",
|
|
1064
|
-
"type": "Integer, nil",
|
|
1065
|
-
"default": "`5_000`",
|
|
1066
|
-
"description": "Maximum value to display. Pass `nil` for no limit. (e.x. if `count` == 6,000 and `limit` == 5000, counter will display \"5,000+\")"
|
|
979
|
+
"default": "`:nav`",
|
|
980
|
+
"description": "One of `:div` or `:nav`."
|
|
1067
981
|
},
|
|
1068
982
|
{
|
|
1069
|
-
"name": "
|
|
1070
|
-
"type": "
|
|
1071
|
-
"default": "
|
|
1072
|
-
"description": "
|
|
983
|
+
"name": "label",
|
|
984
|
+
"type": "String",
|
|
985
|
+
"default": "N/A",
|
|
986
|
+
"description": "Sets an `aria-label` that helps assistive technology users understand the purpose of the links, and distinguish it from similar elements."
|
|
1073
987
|
},
|
|
1074
988
|
{
|
|
1075
|
-
"name": "
|
|
1076
|
-
"type": "
|
|
1077
|
-
"default": "
|
|
1078
|
-
"description": "
|
|
989
|
+
"name": "align",
|
|
990
|
+
"type": "Symbol",
|
|
991
|
+
"default": "`:left`",
|
|
992
|
+
"description": "One of `:left` or `:right`. - Defaults to left"
|
|
1079
993
|
},
|
|
1080
994
|
{
|
|
1081
|
-
"name": "
|
|
1082
|
-
"type": "
|
|
1083
|
-
"default": "`
|
|
1084
|
-
"description": "
|
|
995
|
+
"name": "body_arguments",
|
|
996
|
+
"type": "Hash",
|
|
997
|
+
"default": "`{}`",
|
|
998
|
+
"description": "[System arguments](/system-arguments) for the body wrapper."
|
|
1085
999
|
},
|
|
1086
1000
|
{
|
|
1087
1001
|
"name": "system_arguments",
|
|
@@ -1092,22 +1006,34 @@
|
|
|
1092
1006
|
]
|
|
1093
1007
|
},
|
|
1094
1008
|
{
|
|
1095
|
-
"component": "
|
|
1096
|
-
"status": "
|
|
1097
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/
|
|
1098
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/
|
|
1009
|
+
"component": "UnderlinePanels",
|
|
1010
|
+
"status": "alpha",
|
|
1011
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/underline_panels.rb",
|
|
1012
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/underline_panels/default/",
|
|
1099
1013
|
"parameters": [
|
|
1100
1014
|
{
|
|
1101
|
-
"name": "
|
|
1015
|
+
"name": "label",
|
|
1016
|
+
"type": "String",
|
|
1017
|
+
"default": "N/A",
|
|
1018
|
+
"description": "Sets an `aria-label` that helps assistive technology users understand the purpose of the tabs."
|
|
1019
|
+
},
|
|
1020
|
+
{
|
|
1021
|
+
"name": "align",
|
|
1102
1022
|
"type": "Symbol",
|
|
1103
|
-
"default": "`:
|
|
1104
|
-
"description": "
|
|
1023
|
+
"default": "`:left`",
|
|
1024
|
+
"description": "One of `:left` or `:right`. - Defaults to left"
|
|
1105
1025
|
},
|
|
1106
1026
|
{
|
|
1107
|
-
"name": "
|
|
1108
|
-
"type": "
|
|
1109
|
-
"default": "`
|
|
1110
|
-
"description": "
|
|
1027
|
+
"name": "body_arguments",
|
|
1028
|
+
"type": "Hash",
|
|
1029
|
+
"default": "`{}`",
|
|
1030
|
+
"description": "[System arguments](/system-arguments) for the body wrapper."
|
|
1031
|
+
},
|
|
1032
|
+
{
|
|
1033
|
+
"name": "wrapper_arguments",
|
|
1034
|
+
"type": "Hash",
|
|
1035
|
+
"default": "`{}`",
|
|
1036
|
+
"description": "[System arguments](/system-arguments) for the `TabContainer` wrapper."
|
|
1111
1037
|
},
|
|
1112
1038
|
{
|
|
1113
1039
|
"name": "system_arguments",
|
|
@@ -1118,122 +1044,138 @@
|
|
|
1118
1044
|
]
|
|
1119
1045
|
},
|
|
1120
1046
|
{
|
|
1121
|
-
"component": "
|
|
1122
|
-
"status": "
|
|
1123
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/
|
|
1124
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/
|
|
1047
|
+
"component": "AutoComplete",
|
|
1048
|
+
"status": "beta",
|
|
1049
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/auto_complete.rb",
|
|
1050
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/auto_complete/default/",
|
|
1125
1051
|
"parameters": [
|
|
1126
1052
|
{
|
|
1127
|
-
"name": "
|
|
1053
|
+
"name": "label_text",
|
|
1128
1054
|
"type": "String",
|
|
1129
|
-
"default": "
|
|
1130
|
-
"description": "The
|
|
1055
|
+
"default": "N/A",
|
|
1056
|
+
"description": "The label of the input."
|
|
1131
1057
|
},
|
|
1132
1058
|
{
|
|
1133
|
-
"name": "
|
|
1059
|
+
"name": "src",
|
|
1134
1060
|
"type": "String",
|
|
1135
1061
|
"default": "N/A",
|
|
1136
|
-
"description": "
|
|
1062
|
+
"description": "The route to query."
|
|
1137
1063
|
},
|
|
1138
1064
|
{
|
|
1139
|
-
"name": "
|
|
1065
|
+
"name": "input_id",
|
|
1140
1066
|
"type": "String",
|
|
1141
|
-
"default": "
|
|
1142
|
-
"description": "
|
|
1067
|
+
"default": "N/A",
|
|
1068
|
+
"description": "Id of the input element."
|
|
1143
1069
|
},
|
|
1144
1070
|
{
|
|
1145
|
-
"name": "
|
|
1146
|
-
"type": "
|
|
1147
|
-
"default": "
|
|
1148
|
-
"description": "
|
|
1071
|
+
"name": "input_name",
|
|
1072
|
+
"type": "String",
|
|
1073
|
+
"default": "`nil`",
|
|
1074
|
+
"description": "Optional name of the input element, defaults to `input_id` when not set."
|
|
1149
1075
|
},
|
|
1150
1076
|
{
|
|
1151
|
-
"name": "
|
|
1152
|
-
"type": "
|
|
1153
|
-
"default": "
|
|
1154
|
-
"description": "
|
|
1077
|
+
"name": "list_id",
|
|
1078
|
+
"type": "String",
|
|
1079
|
+
"default": "N/A",
|
|
1080
|
+
"description": "Id of the list element."
|
|
1155
1081
|
},
|
|
1156
1082
|
{
|
|
1157
|
-
"name": "
|
|
1158
|
-
"type": "
|
|
1159
|
-
"default": "
|
|
1160
|
-
"description": "
|
|
1083
|
+
"name": "visually_hide_label",
|
|
1084
|
+
"type": "Boolean",
|
|
1085
|
+
"default": "`false`",
|
|
1086
|
+
"description": "Controls if the label is visible. If `true`, screen reader only text will be added."
|
|
1161
1087
|
},
|
|
1162
1088
|
{
|
|
1163
|
-
"name": "
|
|
1089
|
+
"name": "show_clear_button",
|
|
1164
1090
|
"type": "Boolean",
|
|
1165
1091
|
"default": "`false`",
|
|
1166
|
-
"description": "
|
|
1092
|
+
"description": "Adds optional clear button."
|
|
1167
1093
|
},
|
|
1168
1094
|
{
|
|
1169
1095
|
"name": "system_arguments",
|
|
1170
1096
|
"type": "Hash",
|
|
1171
1097
|
"default": "N/A",
|
|
1172
1098
|
"description": "[System arguments](/system-arguments)"
|
|
1173
|
-
}
|
|
1174
|
-
]
|
|
1175
|
-
},
|
|
1176
|
-
{
|
|
1177
|
-
"component": "Dropdown",
|
|
1178
|
-
"status": "alpha",
|
|
1179
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/dropdown.rb",
|
|
1180
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/dropdown/default/",
|
|
1181
|
-
"parameters": [
|
|
1099
|
+
},
|
|
1182
1100
|
{
|
|
1183
|
-
"name": "
|
|
1184
|
-
"type": "
|
|
1185
|
-
"default": "`:
|
|
1186
|
-
"description": "
|
|
1101
|
+
"name": "size",
|
|
1102
|
+
"type": "Hash",
|
|
1103
|
+
"default": "`:medium`",
|
|
1104
|
+
"description": "Input size can be small, medium (default), or large"
|
|
1187
1105
|
},
|
|
1188
1106
|
{
|
|
1189
|
-
"name": "
|
|
1107
|
+
"name": "full_width",
|
|
1190
1108
|
"type": "Boolean",
|
|
1191
1109
|
"default": "`false`",
|
|
1192
|
-
"description": "
|
|
1110
|
+
"description": "Input can be full-width or fit to content"
|
|
1193
1111
|
},
|
|
1194
1112
|
{
|
|
1195
|
-
"name": "
|
|
1196
|
-
"type": "
|
|
1197
|
-
"default": "
|
|
1198
|
-
"description": "
|
|
1113
|
+
"name": "disabled",
|
|
1114
|
+
"type": "Boolean",
|
|
1115
|
+
"default": "`false`",
|
|
1116
|
+
"description": "Disabled input"
|
|
1117
|
+
},
|
|
1118
|
+
{
|
|
1119
|
+
"name": "invalid",
|
|
1120
|
+
"type": "Boolean",
|
|
1121
|
+
"default": "`false`",
|
|
1122
|
+
"description": "Invalid input"
|
|
1123
|
+
},
|
|
1124
|
+
{
|
|
1125
|
+
"name": "placeholder",
|
|
1126
|
+
"type": "String",
|
|
1127
|
+
"default": "`nil`",
|
|
1128
|
+
"description": "The placeholder text displayed within the input"
|
|
1129
|
+
},
|
|
1130
|
+
{
|
|
1131
|
+
"name": "inset",
|
|
1132
|
+
"type": "Boolean",
|
|
1133
|
+
"default": "`false`",
|
|
1134
|
+
"description": "subtle input background color"
|
|
1135
|
+
},
|
|
1136
|
+
{
|
|
1137
|
+
"name": "monospace",
|
|
1138
|
+
"type": "Boolean",
|
|
1139
|
+
"default": "`false`",
|
|
1140
|
+
"description": "monospace input font family"
|
|
1199
1141
|
}
|
|
1200
1142
|
]
|
|
1201
1143
|
},
|
|
1202
1144
|
{
|
|
1203
|
-
"component": "
|
|
1145
|
+
"component": "AutoComplete::Item",
|
|
1204
1146
|
"status": "beta",
|
|
1205
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/
|
|
1206
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/
|
|
1147
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/auto_complete/item.rb",
|
|
1148
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/auto_complete/item/default/",
|
|
1207
1149
|
"parameters": [
|
|
1208
1150
|
{
|
|
1209
|
-
"name": "
|
|
1210
|
-
"type": "
|
|
1211
|
-
"default": "
|
|
1212
|
-
"description": "
|
|
1151
|
+
"name": "value",
|
|
1152
|
+
"type": "String",
|
|
1153
|
+
"default": "N/A",
|
|
1154
|
+
"description": "Value of the item."
|
|
1213
1155
|
},
|
|
1214
1156
|
{
|
|
1215
|
-
"name": "
|
|
1157
|
+
"name": "selected",
|
|
1216
1158
|
"type": "Boolean",
|
|
1217
1159
|
"default": "`false`",
|
|
1218
|
-
"description": "Whether
|
|
1160
|
+
"description": "Whether the item is selected."
|
|
1219
1161
|
},
|
|
1220
1162
|
{
|
|
1221
|
-
"name": "
|
|
1163
|
+
"name": "disabled",
|
|
1222
1164
|
"type": "Boolean",
|
|
1223
1165
|
"default": "`false`",
|
|
1224
|
-
"description": "Whether the
|
|
1166
|
+
"description": "Whether the item is disabled."
|
|
1225
1167
|
},
|
|
1226
1168
|
{
|
|
1227
|
-
"name": "
|
|
1228
|
-
"type": "
|
|
1229
|
-
"default": "`
|
|
1230
|
-
"description": "
|
|
1169
|
+
"name": "description_variant",
|
|
1170
|
+
"type": "Hash",
|
|
1171
|
+
"default": "`:block`",
|
|
1172
|
+
"description": "Changes the description style. Allowed values are :inline, :block"
|
|
1231
1173
|
},
|
|
1232
1174
|
{
|
|
1233
|
-
"name": "
|
|
1234
|
-
"type": "
|
|
1235
|
-
"default": "
|
|
1236
|
-
"description": "
|
|
1175
|
+
"name": "description",
|
|
1176
|
+
"type": "String",
|
|
1177
|
+
"default": "N/A",
|
|
1178
|
+
"description": "Display description text below label"
|
|
1237
1179
|
},
|
|
1238
1180
|
{
|
|
1239
1181
|
"name": "system_arguments",
|
|
@@ -1244,16 +1186,40 @@
|
|
|
1244
1186
|
]
|
|
1245
1187
|
},
|
|
1246
1188
|
{
|
|
1247
|
-
"component": "
|
|
1189
|
+
"component": "Avatar",
|
|
1248
1190
|
"status": "beta",
|
|
1249
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/
|
|
1250
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/
|
|
1191
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/avatar.rb",
|
|
1192
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/avatar/default/",
|
|
1251
1193
|
"parameters": [
|
|
1252
1194
|
{
|
|
1253
|
-
"name": "
|
|
1195
|
+
"name": "src",
|
|
1196
|
+
"type": "String",
|
|
1197
|
+
"default": "N/A",
|
|
1198
|
+
"description": "The source url of the avatar image."
|
|
1199
|
+
},
|
|
1200
|
+
{
|
|
1201
|
+
"name": "alt",
|
|
1202
|
+
"type": "String",
|
|
1203
|
+
"default": "N/A",
|
|
1204
|
+
"description": "Passed through to alt on img tag."
|
|
1205
|
+
},
|
|
1206
|
+
{
|
|
1207
|
+
"name": "size",
|
|
1208
|
+
"type": "Integer",
|
|
1209
|
+
"default": "`20`",
|
|
1210
|
+
"description": "One of `16`, `20`, `24`, `32`, `40`, `48`, or `80`."
|
|
1211
|
+
},
|
|
1212
|
+
{
|
|
1213
|
+
"name": "shape",
|
|
1214
|
+
"type": "Symbol",
|
|
1215
|
+
"default": "`:circle`",
|
|
1216
|
+
"description": "Shape of the avatar. One of `:circle` or `:square`."
|
|
1217
|
+
},
|
|
1218
|
+
{
|
|
1219
|
+
"name": "href",
|
|
1254
1220
|
"type": "String",
|
|
1255
|
-
"default": "
|
|
1256
|
-
"description": "
|
|
1221
|
+
"default": "`nil`",
|
|
1222
|
+
"description": "The URL to link to. If used, component will be wrapped by an `<a>` tag."
|
|
1257
1223
|
},
|
|
1258
1224
|
{
|
|
1259
1225
|
"name": "system_arguments",
|
|
@@ -1264,22 +1230,34 @@
|
|
|
1264
1230
|
]
|
|
1265
1231
|
},
|
|
1266
1232
|
{
|
|
1267
|
-
"component": "
|
|
1268
|
-
"status": "
|
|
1269
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/
|
|
1270
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/
|
|
1233
|
+
"component": "AvatarStack",
|
|
1234
|
+
"status": "beta",
|
|
1235
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/avatar_stack.rb",
|
|
1236
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/avatar_stack/default/",
|
|
1271
1237
|
"parameters": [
|
|
1272
1238
|
{
|
|
1273
|
-
"name": "
|
|
1239
|
+
"name": "tag",
|
|
1240
|
+
"type": "Symbol",
|
|
1241
|
+
"default": "`:div`",
|
|
1242
|
+
"description": "One of `:div` or `:span`."
|
|
1243
|
+
},
|
|
1244
|
+
{
|
|
1245
|
+
"name": "align",
|
|
1246
|
+
"type": "Symbol",
|
|
1247
|
+
"default": "`:left`",
|
|
1248
|
+
"description": "One of `:left` or `:right`."
|
|
1249
|
+
},
|
|
1250
|
+
{
|
|
1251
|
+
"name": "tooltipped",
|
|
1274
1252
|
"type": "Boolean",
|
|
1275
1253
|
"default": "`false`",
|
|
1276
|
-
"description": "Whether
|
|
1254
|
+
"description": "Whether to add a tooltip to the stack or not."
|
|
1277
1255
|
},
|
|
1278
1256
|
{
|
|
1279
|
-
"name": "
|
|
1257
|
+
"name": "body_arguments",
|
|
1280
1258
|
"type": "Hash",
|
|
1281
1259
|
"default": "`{}`",
|
|
1282
|
-
"description": "
|
|
1260
|
+
"description": "Parameters to add to the Body. If `tooltipped` is set, has the same arguments as [Tooltip](/components/tooltip). The default tag is `:div` but can be changed using `tag:` to one of `:div` or `:span`."
|
|
1283
1261
|
},
|
|
1284
1262
|
{
|
|
1285
1263
|
"name": "system_arguments",
|
|
@@ -1290,40 +1268,28 @@
|
|
|
1290
1268
|
]
|
|
1291
1269
|
},
|
|
1292
1270
|
{
|
|
1293
|
-
"component": "
|
|
1271
|
+
"component": "BaseButton",
|
|
1294
1272
|
"status": "beta",
|
|
1295
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/
|
|
1296
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/
|
|
1273
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/base_button.rb",
|
|
1274
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/base_button/default/",
|
|
1297
1275
|
"parameters": [
|
|
1298
1276
|
{
|
|
1299
1277
|
"name": "tag",
|
|
1300
1278
|
"type": "Symbol",
|
|
1301
|
-
"default": "`:
|
|
1302
|
-
"description": "One of `:a`, `:
|
|
1303
|
-
},
|
|
1304
|
-
{
|
|
1305
|
-
"name": "scheme",
|
|
1306
|
-
"type": "Symbol",
|
|
1307
|
-
"default": "`:default`",
|
|
1308
|
-
"description": "One of `:accent`, `:attention`, `:danger`, `:default`, `:done`, `:info`, `:orange`, `:primary`, `:purple`, `:secondary`, `:severe`, `:sponsors`, `:success`, or `:warning`."
|
|
1279
|
+
"default": "`:button`",
|
|
1280
|
+
"description": "One of `:a`, `:button`, or `:summary`."
|
|
1309
1281
|
},
|
|
1310
1282
|
{
|
|
1311
|
-
"name": "
|
|
1283
|
+
"name": "type",
|
|
1312
1284
|
"type": "Symbol",
|
|
1313
|
-
"default": "`:
|
|
1314
|
-
"description": "One of `:
|
|
1285
|
+
"default": "`:button`",
|
|
1286
|
+
"description": "One of `:button`, `:reset`, or `:submit`."
|
|
1315
1287
|
},
|
|
1316
1288
|
{
|
|
1317
|
-
"name": "
|
|
1289
|
+
"name": "block",
|
|
1318
1290
|
"type": "Boolean",
|
|
1319
1291
|
"default": "`false`",
|
|
1320
|
-
"description": "Whether
|
|
1321
|
-
},
|
|
1322
|
-
{
|
|
1323
|
-
"name": "variant",
|
|
1324
|
-
"type": "Symbol",
|
|
1325
|
-
"default": "`:none`",
|
|
1326
|
-
"description": "One of `:inline`, `:large`, or `:none`."
|
|
1292
|
+
"description": "Whether button is full-width with `display: block`."
|
|
1327
1293
|
},
|
|
1328
1294
|
{
|
|
1329
1295
|
"name": "system_arguments",
|
|
@@ -1334,28 +1300,28 @@
|
|
|
1334
1300
|
]
|
|
1335
1301
|
},
|
|
1336
1302
|
{
|
|
1337
|
-
"component": "
|
|
1338
|
-
"status": "
|
|
1339
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/
|
|
1340
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/
|
|
1303
|
+
"component": "Blankslate",
|
|
1304
|
+
"status": "beta",
|
|
1305
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/blankslate.rb",
|
|
1306
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/blankslate/default/",
|
|
1341
1307
|
"parameters": [
|
|
1342
1308
|
{
|
|
1343
|
-
"name": "
|
|
1309
|
+
"name": "narrow",
|
|
1344
1310
|
"type": "Boolean",
|
|
1345
1311
|
"default": "`false`",
|
|
1346
|
-
"description": "
|
|
1312
|
+
"description": "Adds a maximum width of `485px` to the Blankslate."
|
|
1347
1313
|
},
|
|
1348
1314
|
{
|
|
1349
|
-
"name": "
|
|
1350
|
-
"type": "
|
|
1351
|
-
"default": "
|
|
1352
|
-
"description": "
|
|
1315
|
+
"name": "spacious",
|
|
1316
|
+
"type": "Boolean",
|
|
1317
|
+
"default": "`false`",
|
|
1318
|
+
"description": "Increases the padding from `32px` to `80px 40px`."
|
|
1353
1319
|
},
|
|
1354
1320
|
{
|
|
1355
|
-
"name": "
|
|
1356
|
-
"type": "
|
|
1357
|
-
"default": "`
|
|
1358
|
-
"description": "
|
|
1321
|
+
"name": "border",
|
|
1322
|
+
"type": "Boolean",
|
|
1323
|
+
"default": "`false`",
|
|
1324
|
+
"description": "Adds a border around the Blankslate."
|
|
1359
1325
|
},
|
|
1360
1326
|
{
|
|
1361
1327
|
"name": "system_arguments",
|
|
@@ -1366,40 +1332,16 @@
|
|
|
1366
1332
|
]
|
|
1367
1333
|
},
|
|
1368
1334
|
{
|
|
1369
|
-
"component": "
|
|
1335
|
+
"component": "BorderBox",
|
|
1370
1336
|
"status": "beta",
|
|
1371
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/
|
|
1372
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/
|
|
1337
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/border_box.rb",
|
|
1338
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/border_box/default/",
|
|
1373
1339
|
"parameters": [
|
|
1374
1340
|
{
|
|
1375
|
-
"name": "
|
|
1376
|
-
"type": "String",
|
|
1377
|
-
"default": "`:a`",
|
|
1378
|
-
"description": "One of `:a` or `:span`."
|
|
1379
|
-
},
|
|
1380
|
-
{
|
|
1381
|
-
"name": "href",
|
|
1382
|
-
"type": "String",
|
|
1383
|
-
"default": "`nil`",
|
|
1384
|
-
"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."
|
|
1385
|
-
},
|
|
1386
|
-
{
|
|
1387
|
-
"name": "scheme",
|
|
1341
|
+
"name": "padding",
|
|
1388
1342
|
"type": "Symbol",
|
|
1389
1343
|
"default": "`:default`",
|
|
1390
|
-
"description": "One of `:
|
|
1391
|
-
},
|
|
1392
|
-
{
|
|
1393
|
-
"name": "muted",
|
|
1394
|
-
"type": "Boolean",
|
|
1395
|
-
"default": "`false`",
|
|
1396
|
-
"description": "Uses light gray for Link color, and blue on hover."
|
|
1397
|
-
},
|
|
1398
|
-
{
|
|
1399
|
-
"name": "underline",
|
|
1400
|
-
"type": "Boolean",
|
|
1401
|
-
"default": "`true`",
|
|
1402
|
-
"description": "Whether or not to underline the link."
|
|
1344
|
+
"description": "One of `:condensed`, `:default`, or `:spacious`."
|
|
1403
1345
|
},
|
|
1404
1346
|
{
|
|
1405
1347
|
"name": "system_arguments",
|
|
@@ -1410,17 +1352,11 @@
|
|
|
1410
1352
|
]
|
|
1411
1353
|
},
|
|
1412
1354
|
{
|
|
1413
|
-
"component": "
|
|
1355
|
+
"component": "BorderBox::Header",
|
|
1414
1356
|
"status": "beta",
|
|
1415
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/
|
|
1416
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/
|
|
1357
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/border_box/header.rb",
|
|
1358
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/border_box/header/default/",
|
|
1417
1359
|
"parameters": [
|
|
1418
|
-
{
|
|
1419
|
-
"name": "tag",
|
|
1420
|
-
"type": "Symbol",
|
|
1421
|
-
"default": "`:div`",
|
|
1422
|
-
"description": "One of `:article`, `:div`, or `:td`."
|
|
1423
|
-
},
|
|
1424
1360
|
{
|
|
1425
1361
|
"name": "system_arguments",
|
|
1426
1362
|
"type": "Hash",
|
|
@@ -1430,10 +1366,10 @@
|
|
|
1430
1366
|
]
|
|
1431
1367
|
},
|
|
1432
1368
|
{
|
|
1433
|
-
"component": "
|
|
1434
|
-
"status": "
|
|
1435
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/
|
|
1436
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/
|
|
1369
|
+
"component": "Breadcrumbs",
|
|
1370
|
+
"status": "beta",
|
|
1371
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/breadcrumbs.rb",
|
|
1372
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/breadcrumbs/default/",
|
|
1437
1373
|
"parameters": [
|
|
1438
1374
|
{
|
|
1439
1375
|
"name": "system_arguments",
|
|
@@ -1444,46 +1380,46 @@
|
|
|
1444
1380
|
]
|
|
1445
1381
|
},
|
|
1446
1382
|
{
|
|
1447
|
-
"component": "
|
|
1448
|
-
"status": "
|
|
1449
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/
|
|
1450
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/
|
|
1383
|
+
"component": "Button",
|
|
1384
|
+
"status": "beta",
|
|
1385
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/button.rb",
|
|
1386
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/button/default/",
|
|
1451
1387
|
"parameters": [
|
|
1452
1388
|
{
|
|
1453
|
-
"name": "
|
|
1454
|
-
"type": "
|
|
1455
|
-
"default": "`
|
|
1456
|
-
"description": "
|
|
1389
|
+
"name": "scheme",
|
|
1390
|
+
"type": "Symbol",
|
|
1391
|
+
"default": "`:default`",
|
|
1392
|
+
"description": "One of `:danger`, `:default`, `:invisible`, `:link`, `:primary`, or `:secondary`."
|
|
1457
1393
|
},
|
|
1458
1394
|
{
|
|
1459
|
-
"name": "
|
|
1460
|
-
"type": "
|
|
1461
|
-
"default": "`
|
|
1462
|
-
"description": "
|
|
1395
|
+
"name": "size",
|
|
1396
|
+
"type": "Symbol",
|
|
1397
|
+
"default": "`:medium`",
|
|
1398
|
+
"description": "One of `:large`, `:medium`, or `:small`."
|
|
1463
1399
|
},
|
|
1464
1400
|
{
|
|
1465
|
-
"name": "
|
|
1401
|
+
"name": "block",
|
|
1466
1402
|
"type": "Boolean",
|
|
1467
1403
|
"default": "`false`",
|
|
1468
|
-
"description": "Whether
|
|
1404
|
+
"description": "Whether button is full-width with `display: block`."
|
|
1469
1405
|
},
|
|
1470
1406
|
{
|
|
1471
|
-
"name": "
|
|
1472
|
-
"type": "
|
|
1473
|
-
"default": "
|
|
1474
|
-
"description": "
|
|
1407
|
+
"name": "align_content",
|
|
1408
|
+
"type": "Symbol",
|
|
1409
|
+
"default": "`:center`",
|
|
1410
|
+
"description": "One of `:center` or `:start`."
|
|
1475
1411
|
},
|
|
1476
1412
|
{
|
|
1477
|
-
"name": "
|
|
1478
|
-
"type": "
|
|
1479
|
-
"default": "
|
|
1480
|
-
"description": "
|
|
1413
|
+
"name": "tag",
|
|
1414
|
+
"type": "Symbol",
|
|
1415
|
+
"default": "`:button`",
|
|
1416
|
+
"description": "One of `:a`, `:button`, or `:summary`."
|
|
1481
1417
|
},
|
|
1482
1418
|
{
|
|
1483
|
-
"name": "
|
|
1484
|
-
"type": "
|
|
1485
|
-
"default": "`
|
|
1486
|
-
"description": "
|
|
1419
|
+
"name": "type",
|
|
1420
|
+
"type": "Symbol",
|
|
1421
|
+
"default": "`:button`",
|
|
1422
|
+
"description": "One of `:button`, `:reset`, or `:submit`."
|
|
1487
1423
|
},
|
|
1488
1424
|
{
|
|
1489
1425
|
"name": "system_arguments",
|
|
@@ -1494,34 +1430,22 @@
|
|
|
1494
1430
|
]
|
|
1495
1431
|
},
|
|
1496
1432
|
{
|
|
1497
|
-
"component": "
|
|
1433
|
+
"component": "ButtonGroup",
|
|
1498
1434
|
"status": "beta",
|
|
1499
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/
|
|
1500
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/
|
|
1435
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/button_group.rb",
|
|
1436
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/button_group/default/",
|
|
1501
1437
|
"parameters": [
|
|
1502
1438
|
{
|
|
1503
|
-
"name": "
|
|
1504
|
-
"type": "Symbol
|
|
1505
|
-
"default": "`nil`",
|
|
1506
|
-
"description": "Name of [Octicon](https://primer.style/octicons/) to use."
|
|
1507
|
-
},
|
|
1508
|
-
{
|
|
1509
|
-
"name": "icon",
|
|
1510
|
-
"type": "Symbol, String",
|
|
1439
|
+
"name": "variant",
|
|
1440
|
+
"type": "Symbol",
|
|
1511
1441
|
"default": "`nil`",
|
|
1512
|
-
"description": "
|
|
1442
|
+
"description": "DEPRECATED. One of `:medium` or `:small`."
|
|
1513
1443
|
},
|
|
1514
1444
|
{
|
|
1515
1445
|
"name": "size",
|
|
1516
1446
|
"type": "Symbol",
|
|
1517
|
-
"default": "`:
|
|
1518
|
-
"description": "One of `:
|
|
1519
|
-
},
|
|
1520
|
-
{
|
|
1521
|
-
"name": "use_symbol",
|
|
1522
|
-
"type": "Boolean",
|
|
1523
|
-
"default": "`false`",
|
|
1524
|
-
"description": "EXPERIMENTAL (May change or be removed) - Set to true when using with [OcticonSymbols](/components/alpha/octiconsymbols)."
|
|
1447
|
+
"default": "`:medium`",
|
|
1448
|
+
"description": "One of `:medium` or `:small`."
|
|
1525
1449
|
},
|
|
1526
1450
|
{
|
|
1527
1451
|
"name": "system_arguments",
|
|
@@ -1532,11 +1456,29 @@
|
|
|
1532
1456
|
]
|
|
1533
1457
|
},
|
|
1534
1458
|
{
|
|
1535
|
-
"component": "
|
|
1459
|
+
"component": "ClipboardCopy",
|
|
1536
1460
|
"status": "beta",
|
|
1537
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/
|
|
1538
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/
|
|
1461
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/clipboard_copy.rb",
|
|
1462
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/clipboard_copy/default/",
|
|
1539
1463
|
"parameters": [
|
|
1464
|
+
{
|
|
1465
|
+
"name": "aria-label",
|
|
1466
|
+
"type": "String",
|
|
1467
|
+
"default": "N/A",
|
|
1468
|
+
"description": "String that will be read to screenreaders when the component is focused"
|
|
1469
|
+
},
|
|
1470
|
+
{
|
|
1471
|
+
"name": "value",
|
|
1472
|
+
"type": "String",
|
|
1473
|
+
"default": "`nil`",
|
|
1474
|
+
"description": "Text to copy into the users clipboard when they click the component."
|
|
1475
|
+
},
|
|
1476
|
+
{
|
|
1477
|
+
"name": "for",
|
|
1478
|
+
"type": "String",
|
|
1479
|
+
"default": "N/A",
|
|
1480
|
+
"description": "Element id from where to get the copied value."
|
|
1481
|
+
},
|
|
1540
1482
|
{
|
|
1541
1483
|
"name": "system_arguments",
|
|
1542
1484
|
"type": "Hash",
|
|
@@ -1546,16 +1488,16 @@
|
|
|
1546
1488
|
]
|
|
1547
1489
|
},
|
|
1548
1490
|
{
|
|
1549
|
-
"component": "
|
|
1491
|
+
"component": "CloseButton",
|
|
1550
1492
|
"status": "beta",
|
|
1551
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/
|
|
1552
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/
|
|
1493
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/close_button.rb",
|
|
1494
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/close_button/default/",
|
|
1553
1495
|
"parameters": [
|
|
1554
1496
|
{
|
|
1555
|
-
"name": "
|
|
1497
|
+
"name": "type",
|
|
1556
1498
|
"type": "Symbol",
|
|
1557
|
-
"default": "`:
|
|
1558
|
-
"description": "One of `:
|
|
1499
|
+
"default": "`:button`",
|
|
1500
|
+
"description": "One of `:button` or `:submit`."
|
|
1559
1501
|
},
|
|
1560
1502
|
{
|
|
1561
1503
|
"name": "system_arguments",
|
|
@@ -1566,34 +1508,46 @@
|
|
|
1566
1508
|
]
|
|
1567
1509
|
},
|
|
1568
1510
|
{
|
|
1569
|
-
"component": "
|
|
1511
|
+
"component": "Counter",
|
|
1570
1512
|
"status": "beta",
|
|
1571
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/
|
|
1572
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/
|
|
1513
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/counter.rb",
|
|
1514
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/counter/default/",
|
|
1573
1515
|
"parameters": [
|
|
1574
1516
|
{
|
|
1575
|
-
"name": "
|
|
1576
|
-
"type": "
|
|
1577
|
-
"default": "
|
|
1578
|
-
"description": "
|
|
1517
|
+
"name": "count",
|
|
1518
|
+
"type": "Integer, Float::INFINITY, nil",
|
|
1519
|
+
"default": "`0`",
|
|
1520
|
+
"description": "The number to be displayed (e.x. # of issues, pull requests)"
|
|
1579
1521
|
},
|
|
1580
1522
|
{
|
|
1581
1523
|
"name": "scheme",
|
|
1582
1524
|
"type": "Symbol",
|
|
1583
1525
|
"default": "`:default`",
|
|
1584
|
-
"description": "
|
|
1526
|
+
"description": "Color scheme. One of `:default`, `:primary`, or `:secondary`."
|
|
1585
1527
|
},
|
|
1586
1528
|
{
|
|
1587
|
-
"name": "
|
|
1588
|
-
"type": "
|
|
1589
|
-
"default": "
|
|
1590
|
-
"description": "
|
|
1529
|
+
"name": "limit",
|
|
1530
|
+
"type": "Integer, nil",
|
|
1531
|
+
"default": "`5_000`",
|
|
1532
|
+
"description": "Maximum value to display. Pass `nil` for no limit. (e.x. if `count` == 6,000 and `limit` == 5000, counter will display \"5,000+\")"
|
|
1591
1533
|
},
|
|
1592
1534
|
{
|
|
1593
|
-
"name": "
|
|
1594
|
-
"type": "
|
|
1595
|
-
"default": "
|
|
1596
|
-
"description": "
|
|
1535
|
+
"name": "hide_if_zero",
|
|
1536
|
+
"type": "Boolean",
|
|
1537
|
+
"default": "`false`",
|
|
1538
|
+
"description": "If true, a `hidden` attribute is added to the counter if `count` is zero."
|
|
1539
|
+
},
|
|
1540
|
+
{
|
|
1541
|
+
"name": "text",
|
|
1542
|
+
"type": "String",
|
|
1543
|
+
"default": "`\"\"`",
|
|
1544
|
+
"description": "Text to display instead of count."
|
|
1545
|
+
},
|
|
1546
|
+
{
|
|
1547
|
+
"name": "round",
|
|
1548
|
+
"type": "Boolean",
|
|
1549
|
+
"default": "`false`",
|
|
1550
|
+
"description": "Whether to apply our standard rounding logic to value."
|
|
1597
1551
|
},
|
|
1598
1552
|
{
|
|
1599
1553
|
"name": "system_arguments",
|
|
@@ -1604,22 +1558,22 @@
|
|
|
1604
1558
|
]
|
|
1605
1559
|
},
|
|
1606
1560
|
{
|
|
1607
|
-
"component": "
|
|
1561
|
+
"component": "Details",
|
|
1608
1562
|
"status": "beta",
|
|
1609
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/
|
|
1610
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/
|
|
1563
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/details.rb",
|
|
1564
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/details/default/",
|
|
1611
1565
|
"parameters": [
|
|
1612
1566
|
{
|
|
1613
|
-
"name": "
|
|
1567
|
+
"name": "overlay",
|
|
1614
1568
|
"type": "Symbol",
|
|
1615
|
-
"default": "`:
|
|
1616
|
-
"description": "
|
|
1569
|
+
"default": "`:none`",
|
|
1570
|
+
"description": "Dictates the type of overlay to render with. One of `:dark`, `:default`, or `:none`."
|
|
1617
1571
|
},
|
|
1618
1572
|
{
|
|
1619
|
-
"name": "
|
|
1620
|
-
"type": "
|
|
1621
|
-
"default": "`
|
|
1622
|
-
"description": "
|
|
1573
|
+
"name": "reset",
|
|
1574
|
+
"type": "Boolean",
|
|
1575
|
+
"default": "`false`",
|
|
1576
|
+
"description": "Defaults to false. If set to true, it will remove the default caret and remove style from the summary element"
|
|
1623
1577
|
},
|
|
1624
1578
|
{
|
|
1625
1579
|
"name": "system_arguments",
|
|
@@ -1630,22 +1584,40 @@
|
|
|
1630
1584
|
]
|
|
1631
1585
|
},
|
|
1632
1586
|
{
|
|
1633
|
-
"component": "
|
|
1587
|
+
"component": "Flash",
|
|
1634
1588
|
"status": "beta",
|
|
1635
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/
|
|
1636
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/
|
|
1589
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/flash.rb",
|
|
1590
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/flash/default/",
|
|
1637
1591
|
"parameters": [
|
|
1592
|
+
{
|
|
1593
|
+
"name": "full",
|
|
1594
|
+
"type": "Boolean",
|
|
1595
|
+
"default": "`false`",
|
|
1596
|
+
"description": "Whether the component should take up the full width of the screen."
|
|
1597
|
+
},
|
|
1638
1598
|
{
|
|
1639
1599
|
"name": "spacious",
|
|
1640
1600
|
"type": "Boolean",
|
|
1641
1601
|
"default": "`false`",
|
|
1642
|
-
"description": "Whether to add
|
|
1602
|
+
"description": "Whether to add margin to the bottom of the component."
|
|
1643
1603
|
},
|
|
1644
1604
|
{
|
|
1645
|
-
"name": "
|
|
1605
|
+
"name": "dismissible",
|
|
1646
1606
|
"type": "Boolean",
|
|
1647
1607
|
"default": "`false`",
|
|
1648
|
-
"description": "Whether
|
|
1608
|
+
"description": "Whether the component can be dismissed with an X button."
|
|
1609
|
+
},
|
|
1610
|
+
{
|
|
1611
|
+
"name": "icon",
|
|
1612
|
+
"type": "Symbol",
|
|
1613
|
+
"default": "`nil`",
|
|
1614
|
+
"description": "Name of Octicon icon to use."
|
|
1615
|
+
},
|
|
1616
|
+
{
|
|
1617
|
+
"name": "scheme",
|
|
1618
|
+
"type": "Symbol",
|
|
1619
|
+
"default": "`:default`",
|
|
1620
|
+
"description": "One of `:danger`, `:default`, `:success`, or `:warning`."
|
|
1649
1621
|
},
|
|
1650
1622
|
{
|
|
1651
1623
|
"name": "system_arguments",
|
|
@@ -1656,11 +1628,17 @@
|
|
|
1656
1628
|
]
|
|
1657
1629
|
},
|
|
1658
1630
|
{
|
|
1659
|
-
"component": "
|
|
1660
|
-
"status": "
|
|
1661
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/
|
|
1662
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/
|
|
1631
|
+
"component": "Heading",
|
|
1632
|
+
"status": "beta",
|
|
1633
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/heading.rb",
|
|
1634
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/heading/default/",
|
|
1663
1635
|
"parameters": [
|
|
1636
|
+
{
|
|
1637
|
+
"name": "tag",
|
|
1638
|
+
"type": "String",
|
|
1639
|
+
"default": "N/A",
|
|
1640
|
+
"description": "One of `:h1`, `:h2`, `:h3`, `:h4`, `:h5`, or `:h6`."
|
|
1641
|
+
},
|
|
1664
1642
|
{
|
|
1665
1643
|
"name": "system_arguments",
|
|
1666
1644
|
"type": "Hash",
|
|
@@ -1670,36 +1648,70 @@
|
|
|
1670
1648
|
]
|
|
1671
1649
|
},
|
|
1672
1650
|
{
|
|
1673
|
-
"component": "
|
|
1651
|
+
"component": "IconButton",
|
|
1674
1652
|
"status": "beta",
|
|
1675
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/
|
|
1676
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/
|
|
1653
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/icon_button.rb",
|
|
1654
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/icon_button/default/",
|
|
1677
1655
|
"parameters": [
|
|
1656
|
+
{
|
|
1657
|
+
"name": "icon",
|
|
1658
|
+
"type": "String",
|
|
1659
|
+
"default": "N/A",
|
|
1660
|
+
"description": "Name of [Octicon](https://primer.style/octicons/) to use."
|
|
1661
|
+
},
|
|
1662
|
+
{
|
|
1663
|
+
"name": "wrapper_arguments",
|
|
1664
|
+
"type": "Hash",
|
|
1665
|
+
"default": "`{}`",
|
|
1666
|
+
"description": "Optional keyword arguments to be passed to the wrapper `<div>` tag."
|
|
1667
|
+
},
|
|
1668
|
+
{
|
|
1669
|
+
"name": "scheme",
|
|
1670
|
+
"type": "Symbol",
|
|
1671
|
+
"default": "`:default`",
|
|
1672
|
+
"description": "One of `:danger`, `:default`, or `:invisible`."
|
|
1673
|
+
},
|
|
1674
|
+
{
|
|
1675
|
+
"name": "size",
|
|
1676
|
+
"type": "Symbol",
|
|
1677
|
+
"default": "`:medium`",
|
|
1678
|
+
"description": "One of `:large`, `:medium`, or `:small`."
|
|
1679
|
+
},
|
|
1678
1680
|
{
|
|
1679
1681
|
"name": "tag",
|
|
1680
1682
|
"type": "Symbol",
|
|
1681
|
-
"default": "
|
|
1682
|
-
"description": ""
|
|
1683
|
+
"default": "N/A",
|
|
1684
|
+
"description": "One of `:a`, `:button`, or `:summary`."
|
|
1683
1685
|
},
|
|
1684
1686
|
{
|
|
1685
|
-
"name": "
|
|
1686
|
-
"type": "
|
|
1687
|
+
"name": "type",
|
|
1688
|
+
"type": "Symbol",
|
|
1687
1689
|
"default": "N/A",
|
|
1688
|
-
"description": "
|
|
1689
|
-
}
|
|
1690
|
-
]
|
|
1691
|
-
},
|
|
1692
|
-
{
|
|
1693
|
-
"component": "TimelineItem",
|
|
1694
|
-
"status": "beta",
|
|
1695
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/timeline_item.rb",
|
|
1696
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/timeline_item/default/",
|
|
1697
|
-
"parameters": [
|
|
1690
|
+
"description": "One of `:button`, `:reset`, or `:submit`."
|
|
1691
|
+
},
|
|
1698
1692
|
{
|
|
1699
|
-
"name": "
|
|
1693
|
+
"name": "aria-label",
|
|
1694
|
+
"type": "String",
|
|
1695
|
+
"default": "N/A",
|
|
1696
|
+
"description": "String that can be read by assistive technology. A label should be short and concise. See the accessibility section for more information."
|
|
1697
|
+
},
|
|
1698
|
+
{
|
|
1699
|
+
"name": "aria-description",
|
|
1700
|
+
"type": "String",
|
|
1701
|
+
"default": "N/A",
|
|
1702
|
+
"description": "String that can be read by assistive technology. A description can be longer as it is intended to provide more context and information. See the accessibility section for more information."
|
|
1703
|
+
},
|
|
1704
|
+
{
|
|
1705
|
+
"name": "show_tooltip",
|
|
1700
1706
|
"type": "Boolean",
|
|
1701
|
-
"default": "`
|
|
1702
|
-
"description": "
|
|
1707
|
+
"default": "`true`",
|
|
1708
|
+
"description": "Whether or not to show a tooltip when this button is hovered. Tooltips should only be hidden if the aria label is redundant, i.e. if the icon has a widely understood definition."
|
|
1709
|
+
},
|
|
1710
|
+
{
|
|
1711
|
+
"name": "tooltip_direction",
|
|
1712
|
+
"type": "Symbol",
|
|
1713
|
+
"default": "`:s`",
|
|
1714
|
+
"description": "One of `:e`, `:n`, `:ne`, `:nw`, `:s`, `:se`, `:sw`, or `:w`."
|
|
1703
1715
|
},
|
|
1704
1716
|
{
|
|
1705
1717
|
"name": "system_arguments",
|
|
@@ -1710,40 +1722,40 @@
|
|
|
1710
1722
|
]
|
|
1711
1723
|
},
|
|
1712
1724
|
{
|
|
1713
|
-
"component": "
|
|
1714
|
-
"status": "
|
|
1715
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/
|
|
1716
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/
|
|
1725
|
+
"component": "Label",
|
|
1726
|
+
"status": "beta",
|
|
1727
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/label.rb",
|
|
1728
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/label/default/",
|
|
1717
1729
|
"parameters": [
|
|
1718
1730
|
{
|
|
1719
|
-
"name": "
|
|
1720
|
-
"type": "
|
|
1721
|
-
"default": "
|
|
1722
|
-
"description": "
|
|
1731
|
+
"name": "tag",
|
|
1732
|
+
"type": "Symbol",
|
|
1733
|
+
"default": "`:span`",
|
|
1734
|
+
"description": "One of `:a`, `:div`, `:span`, or `:summary`."
|
|
1723
1735
|
},
|
|
1724
1736
|
{
|
|
1725
|
-
"name": "
|
|
1726
|
-
"type": "
|
|
1727
|
-
"default": "`:
|
|
1728
|
-
"description": "
|
|
1737
|
+
"name": "scheme",
|
|
1738
|
+
"type": "Symbol",
|
|
1739
|
+
"default": "`:default`",
|
|
1740
|
+
"description": "One of `:accent`, `:attention`, `:danger`, `:default`, `:done`, `:info`, `:orange`, `:primary`, `:purple`, `:secondary`, `:severe`, `:sponsors`, `:success`, or `:warning`."
|
|
1729
1741
|
},
|
|
1730
1742
|
{
|
|
1731
|
-
"name": "
|
|
1732
|
-
"type": "
|
|
1733
|
-
"default": "`:
|
|
1734
|
-
"description": "
|
|
1743
|
+
"name": "size",
|
|
1744
|
+
"type": "Symbol",
|
|
1745
|
+
"default": "`:medium`",
|
|
1746
|
+
"description": "One of `:large` or `:medium`."
|
|
1735
1747
|
},
|
|
1736
1748
|
{
|
|
1737
|
-
"name": "
|
|
1749
|
+
"name": "inline",
|
|
1738
1750
|
"type": "Boolean",
|
|
1739
1751
|
"default": "`false`",
|
|
1740
|
-
"description": "
|
|
1752
|
+
"description": "Whether or not to render this label inline."
|
|
1741
1753
|
},
|
|
1742
1754
|
{
|
|
1743
|
-
"name": "
|
|
1744
|
-
"type": "
|
|
1745
|
-
"default": "`
|
|
1746
|
-
"description": "
|
|
1755
|
+
"name": "variant",
|
|
1756
|
+
"type": "Symbol",
|
|
1757
|
+
"default": "`:none`",
|
|
1758
|
+
"description": "One of `:inline`, `:large`, or `:none`."
|
|
1747
1759
|
},
|
|
1748
1760
|
{
|
|
1749
1761
|
"name": "system_arguments",
|
|
@@ -1754,34 +1766,40 @@
|
|
|
1754
1766
|
]
|
|
1755
1767
|
},
|
|
1756
1768
|
{
|
|
1757
|
-
"component": "
|
|
1769
|
+
"component": "Link",
|
|
1758
1770
|
"status": "beta",
|
|
1759
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/
|
|
1760
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/
|
|
1771
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/link.rb",
|
|
1772
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/link/default/",
|
|
1761
1773
|
"parameters": [
|
|
1762
1774
|
{
|
|
1763
1775
|
"name": "tag",
|
|
1764
|
-
"type": "
|
|
1765
|
-
"default": "`:
|
|
1766
|
-
"description": "One of `:
|
|
1776
|
+
"type": "String",
|
|
1777
|
+
"default": "`:a`",
|
|
1778
|
+
"description": "One of `:a` or `:span`."
|
|
1767
1779
|
},
|
|
1768
1780
|
{
|
|
1769
|
-
"name": "
|
|
1770
|
-
"type": "
|
|
1771
|
-
"default": "`
|
|
1772
|
-
"description": "
|
|
1781
|
+
"name": "href",
|
|
1782
|
+
"type": "String",
|
|
1783
|
+
"default": "`nil`",
|
|
1784
|
+
"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."
|
|
1785
|
+
},
|
|
1786
|
+
{
|
|
1787
|
+
"name": "scheme",
|
|
1788
|
+
"type": "Symbol",
|
|
1789
|
+
"default": "`:default`",
|
|
1790
|
+
"description": "One of `:default`, `:primary`, or `:secondary`."
|
|
1773
1791
|
},
|
|
1774
1792
|
{
|
|
1775
|
-
"name": "
|
|
1793
|
+
"name": "muted",
|
|
1776
1794
|
"type": "Boolean",
|
|
1777
1795
|
"default": "`false`",
|
|
1778
|
-
"description": "
|
|
1796
|
+
"description": "Uses light gray for Link color, and blue on hover."
|
|
1779
1797
|
},
|
|
1780
1798
|
{
|
|
1781
|
-
"name": "
|
|
1782
|
-
"type": "
|
|
1783
|
-
"default": "`
|
|
1784
|
-
"description": "
|
|
1799
|
+
"name": "underline",
|
|
1800
|
+
"type": "Boolean",
|
|
1801
|
+
"default": "`true`",
|
|
1802
|
+
"description": "Whether or not to underline the link."
|
|
1785
1803
|
},
|
|
1786
1804
|
{
|
|
1787
1805
|
"name": "system_arguments",
|
|
@@ -1792,11 +1810,17 @@
|
|
|
1792
1810
|
]
|
|
1793
1811
|
},
|
|
1794
1812
|
{
|
|
1795
|
-
"component": "
|
|
1813
|
+
"component": "Markdown",
|
|
1796
1814
|
"status": "beta",
|
|
1797
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/
|
|
1798
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/
|
|
1815
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/markdown.rb",
|
|
1816
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/markdown/default/",
|
|
1799
1817
|
"parameters": [
|
|
1818
|
+
{
|
|
1819
|
+
"name": "tag",
|
|
1820
|
+
"type": "Symbol",
|
|
1821
|
+
"default": "`:div`",
|
|
1822
|
+
"description": "One of `:article`, `:div`, or `:td`."
|
|
1823
|
+
},
|
|
1800
1824
|
{
|
|
1801
1825
|
"name": "system_arguments",
|
|
1802
1826
|
"type": "Hash",
|
|
@@ -1806,34 +1830,34 @@
|
|
|
1806
1830
|
]
|
|
1807
1831
|
},
|
|
1808
1832
|
{
|
|
1809
|
-
"component": "
|
|
1810
|
-
"status": "
|
|
1811
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/
|
|
1812
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/
|
|
1833
|
+
"component": "Octicon",
|
|
1834
|
+
"status": "beta",
|
|
1835
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/octicon.rb",
|
|
1836
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/octicon/default/",
|
|
1813
1837
|
"parameters": [
|
|
1814
1838
|
{
|
|
1815
|
-
"name": "
|
|
1816
|
-
"type": "Symbol",
|
|
1817
|
-
"default": "
|
|
1818
|
-
"description": "
|
|
1839
|
+
"name": "icon_name",
|
|
1840
|
+
"type": "Symbol, String",
|
|
1841
|
+
"default": "`nil`",
|
|
1842
|
+
"description": "Name of [Octicon](https://primer.style/octicons/) to use."
|
|
1819
1843
|
},
|
|
1820
1844
|
{
|
|
1821
|
-
"name": "
|
|
1822
|
-
"type": "String",
|
|
1823
|
-
"default": "
|
|
1824
|
-
"description": "
|
|
1845
|
+
"name": "icon",
|
|
1846
|
+
"type": "Symbol, String",
|
|
1847
|
+
"default": "`nil`",
|
|
1848
|
+
"description": "Name of [Octicon](https://primer.style/octicons/) to use."
|
|
1825
1849
|
},
|
|
1826
1850
|
{
|
|
1827
|
-
"name": "
|
|
1851
|
+
"name": "size",
|
|
1828
1852
|
"type": "Symbol",
|
|
1829
|
-
"default": "`:
|
|
1830
|
-
"description": "One of `:
|
|
1853
|
+
"default": "`:small`",
|
|
1854
|
+
"description": "One of `:xsmall` (`12`), `:small` (`16`), or `:medium` (`24`)."
|
|
1831
1855
|
},
|
|
1832
1856
|
{
|
|
1833
|
-
"name": "
|
|
1834
|
-
"type": "
|
|
1835
|
-
"default": "`
|
|
1836
|
-
"description": "
|
|
1857
|
+
"name": "use_symbol",
|
|
1858
|
+
"type": "Boolean",
|
|
1859
|
+
"default": "`false`",
|
|
1860
|
+
"description": "EXPERIMENTAL (May change or be removed) - Set to true when using with [OcticonSymbols](/components/alpha/octiconsymbols)."
|
|
1837
1861
|
},
|
|
1838
1862
|
{
|
|
1839
1863
|
"name": "system_arguments",
|
|
@@ -1844,35 +1868,11 @@
|
|
|
1844
1868
|
]
|
|
1845
1869
|
},
|
|
1846
1870
|
{
|
|
1847
|
-
"component": "
|
|
1848
|
-
"status": "
|
|
1849
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/
|
|
1850
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/
|
|
1871
|
+
"component": "Popover",
|
|
1872
|
+
"status": "beta",
|
|
1873
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/popover.rb",
|
|
1874
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/popover/default/",
|
|
1851
1875
|
"parameters": [
|
|
1852
|
-
{
|
|
1853
|
-
"name": "label",
|
|
1854
|
-
"type": "String",
|
|
1855
|
-
"default": "N/A",
|
|
1856
|
-
"description": "Sets an `aria-label` that helps assistive technology users understand the purpose of the tabs."
|
|
1857
|
-
},
|
|
1858
|
-
{
|
|
1859
|
-
"name": "align",
|
|
1860
|
-
"type": "Symbol",
|
|
1861
|
-
"default": "`:left`",
|
|
1862
|
-
"description": "One of `:left` or `:right`. - Defaults to left"
|
|
1863
|
-
},
|
|
1864
|
-
{
|
|
1865
|
-
"name": "body_arguments",
|
|
1866
|
-
"type": "Hash",
|
|
1867
|
-
"default": "`{}`",
|
|
1868
|
-
"description": "[System arguments](/system-arguments) for the body wrapper."
|
|
1869
|
-
},
|
|
1870
|
-
{
|
|
1871
|
-
"name": "wrapper_arguments",
|
|
1872
|
-
"type": "Hash",
|
|
1873
|
-
"default": "`{}`",
|
|
1874
|
-
"description": "[System arguments](/system-arguments) for the `TabContainer` wrapper."
|
|
1875
|
-
},
|
|
1876
1876
|
{
|
|
1877
1877
|
"name": "system_arguments",
|
|
1878
1878
|
"type": "Hash",
|
|
@@ -1882,28 +1882,16 @@
|
|
|
1882
1882
|
]
|
|
1883
1883
|
},
|
|
1884
1884
|
{
|
|
1885
|
-
"component": "
|
|
1886
|
-
"status": "
|
|
1887
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/
|
|
1888
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/
|
|
1885
|
+
"component": "ProgressBar",
|
|
1886
|
+
"status": "beta",
|
|
1887
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/progress_bar.rb",
|
|
1888
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/progress_bar/default/",
|
|
1889
1889
|
"parameters": [
|
|
1890
1890
|
{
|
|
1891
|
-
"name": "
|
|
1891
|
+
"name": "size",
|
|
1892
1892
|
"type": "Symbol",
|
|
1893
|
-
"default": "`:
|
|
1894
|
-
"description": "One of `:
|
|
1895
|
-
},
|
|
1896
|
-
{
|
|
1897
|
-
"name": "label",
|
|
1898
|
-
"type": "String",
|
|
1899
|
-
"default": "N/A",
|
|
1900
|
-
"description": "Sets an `aria-label` that helps assistive technology users understand the purpose of the links, and distinguish it from similar elements."
|
|
1901
|
-
},
|
|
1902
|
-
{
|
|
1903
|
-
"name": "body_arguments",
|
|
1904
|
-
"type": "Hash",
|
|
1905
|
-
"default": "`{}`",
|
|
1906
|
-
"description": "[System arguments](/system-arguments) for the body wrapper."
|
|
1893
|
+
"default": "`:default`",
|
|
1894
|
+
"description": "One of `:default`, `:large`, or `:small`. Increases height."
|
|
1907
1895
|
},
|
|
1908
1896
|
{
|
|
1909
1897
|
"name": "system_arguments",
|
|
@@ -1914,122 +1902,112 @@
|
|
|
1914
1902
|
]
|
|
1915
1903
|
},
|
|
1916
1904
|
{
|
|
1917
|
-
"component": "
|
|
1918
|
-
"status": "
|
|
1919
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/
|
|
1920
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/
|
|
1905
|
+
"component": "RelativeTime",
|
|
1906
|
+
"status": "beta",
|
|
1907
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/relative_time.rb",
|
|
1908
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/relative_time/default/",
|
|
1921
1909
|
"parameters": [
|
|
1922
1910
|
{
|
|
1923
|
-
"name": "
|
|
1924
|
-
"type": "
|
|
1911
|
+
"name": "datetime",
|
|
1912
|
+
"type": "Time",
|
|
1925
1913
|
"default": "N/A",
|
|
1926
|
-
"description": "
|
|
1914
|
+
"description": "The time to be formatted."
|
|
1927
1915
|
},
|
|
1928
1916
|
{
|
|
1929
|
-
"name": "
|
|
1917
|
+
"name": "tense",
|
|
1930
1918
|
"type": "Symbol",
|
|
1931
|
-
"default": "
|
|
1932
|
-
"description": "One of `:
|
|
1919
|
+
"default": "`:auto`",
|
|
1920
|
+
"description": "Which tense to use. One of `:auto`, `:future`, or `:past`."
|
|
1933
1921
|
},
|
|
1934
1922
|
{
|
|
1935
|
-
"name": "
|
|
1936
|
-
"type": "
|
|
1937
|
-
"default": "`
|
|
1938
|
-
"description": "
|
|
1923
|
+
"name": "prefix",
|
|
1924
|
+
"type": "sring",
|
|
1925
|
+
"default": "`nil`",
|
|
1926
|
+
"description": "What to prefix the relative ime display with."
|
|
1939
1927
|
},
|
|
1940
1928
|
{
|
|
1941
|
-
"name": "
|
|
1942
|
-
"type": "
|
|
1943
|
-
"default": "`
|
|
1944
|
-
"description": "
|
|
1929
|
+
"name": "second",
|
|
1930
|
+
"type": "Symbol",
|
|
1931
|
+
"default": "`SECOND_DEFAULT`",
|
|
1932
|
+
"description": "What format seconds should take. One of `nil`, `:numeric`, or `:two_digit`."
|
|
1945
1933
|
},
|
|
1946
1934
|
{
|
|
1947
|
-
"name": "
|
|
1948
|
-
"type": "
|
|
1949
|
-
"default": "
|
|
1950
|
-
"description": "
|
|
1951
|
-
}
|
|
1952
|
-
]
|
|
1953
|
-
},
|
|
1954
|
-
{
|
|
1955
|
-
"component": "Tooltip",
|
|
1956
|
-
"status": "alpha",
|
|
1957
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/tooltip.rb",
|
|
1958
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/tooltip/default/",
|
|
1959
|
-
"parameters": [
|
|
1935
|
+
"name": "minute",
|
|
1936
|
+
"type": "Symbol",
|
|
1937
|
+
"default": "`MINUTE_DEFAULT`",
|
|
1938
|
+
"description": "What format minues should take. One of `nil`, `:numeric`, or `:two_digit`."
|
|
1939
|
+
},
|
|
1960
1940
|
{
|
|
1961
|
-
"name": "
|
|
1962
|
-
"type": "
|
|
1963
|
-
"default": "
|
|
1964
|
-
"description": "
|
|
1941
|
+
"name": "hour",
|
|
1942
|
+
"type": "Symbol",
|
|
1943
|
+
"default": "`HOUR_DEFAULT`",
|
|
1944
|
+
"description": "What format hours should take. One of `nil`, `:numeric`, or `:two_digit`."
|
|
1965
1945
|
},
|
|
1966
1946
|
{
|
|
1967
|
-
"name": "
|
|
1947
|
+
"name": "weekday",
|
|
1968
1948
|
"type": "Symbol",
|
|
1969
|
-
"default": "
|
|
1970
|
-
"description": "One of
|
|
1949
|
+
"default": "`WEEKDAY_DEFAULT`",
|
|
1950
|
+
"description": "What format weekdays should take. One of `nil`, `:long`, `:narrow`, or `:short`."
|
|
1971
1951
|
},
|
|
1972
1952
|
{
|
|
1973
|
-
"name": "
|
|
1953
|
+
"name": "day",
|
|
1974
1954
|
"type": "Symbol",
|
|
1975
|
-
"default": "
|
|
1976
|
-
"description": "
|
|
1955
|
+
"default": "`DAY_DEFAULT`",
|
|
1956
|
+
"description": "What format days should take. One of `nil`, `:numeric`, or `:two_digit`."
|
|
1977
1957
|
},
|
|
1978
1958
|
{
|
|
1979
|
-
"name": "
|
|
1980
|
-
"type": "
|
|
1981
|
-
"default": "
|
|
1982
|
-
"description": "
|
|
1959
|
+
"name": "month",
|
|
1960
|
+
"type": "Symbol",
|
|
1961
|
+
"default": "`MONTH_DEFAULT`",
|
|
1962
|
+
"description": "What format months should take. One of `nil`, `:long`, `:narrow`, `:numeric`, `:short`, or `:two_digit`."
|
|
1983
1963
|
},
|
|
1984
1964
|
{
|
|
1985
|
-
"name": "
|
|
1986
|
-
"type": "
|
|
1987
|
-
"default": "
|
|
1988
|
-
"description": "
|
|
1989
|
-
}
|
|
1990
|
-
]
|
|
1991
|
-
},
|
|
1992
|
-
{
|
|
1993
|
-
"component": "ToggleSwitch",
|
|
1994
|
-
"status": "alpha",
|
|
1995
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/toggle_switch.rb",
|
|
1996
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/toggle_switch/default/",
|
|
1997
|
-
"parameters": [
|
|
1965
|
+
"name": "year",
|
|
1966
|
+
"type": "Symbol",
|
|
1967
|
+
"default": "`YEAR_DEFAULT`",
|
|
1968
|
+
"description": "What format years should take. One of `nil`, `:numeric`, or `:two_digit`."
|
|
1969
|
+
},
|
|
1998
1970
|
{
|
|
1999
|
-
"name": "
|
|
2000
|
-
"type": "
|
|
2001
|
-
"default": "`
|
|
2002
|
-
"description": "
|
|
1971
|
+
"name": "time_zone_name",
|
|
1972
|
+
"type": "Symbol",
|
|
1973
|
+
"default": "`TIMEZONENAME_DEFAULT`",
|
|
1974
|
+
"description": "What format the time zone should take. One of `nil`, `:long`, `:long_generic`, `:long_offset`, `:short`, `:short_generic`, or `:short_offset`."
|
|
2003
1975
|
},
|
|
2004
1976
|
{
|
|
2005
|
-
"name": "
|
|
2006
|
-
"type": "
|
|
1977
|
+
"name": "threshold",
|
|
1978
|
+
"type": "string",
|
|
2007
1979
|
"default": "`nil`",
|
|
2008
|
-
"description": "
|
|
1980
|
+
"description": "The threshold, in ISO-8601 'durations' format, at which relative time displays become absolute."
|
|
2009
1981
|
},
|
|
2010
1982
|
{
|
|
2011
|
-
"name": "
|
|
2012
|
-
"type": "
|
|
2013
|
-
"default": "`
|
|
2014
|
-
"description": "
|
|
1983
|
+
"name": "precision",
|
|
1984
|
+
"type": "Symbol",
|
|
1985
|
+
"default": "`PRECISION_DEFAULT`",
|
|
1986
|
+
"description": "The precision elapsed time should display. One of `nil`, `:day`, `:hour`, `:minute`, `:month`, `:second`, or `:year`."
|
|
2015
1987
|
},
|
|
2016
1988
|
{
|
|
2017
|
-
"name": "
|
|
2018
|
-
"type": "
|
|
2019
|
-
"default": "`
|
|
2020
|
-
"description": "
|
|
1989
|
+
"name": "format",
|
|
1990
|
+
"type": "Symbol",
|
|
1991
|
+
"default": "`nil`",
|
|
1992
|
+
"description": "The format the display should take. One of `:auto`, `:elapsed`, or `:micro`."
|
|
1993
|
+
},
|
|
1994
|
+
{
|
|
1995
|
+
"name": "format_style",
|
|
1996
|
+
"type": "Symbol",
|
|
1997
|
+
"default": "`nil`",
|
|
1998
|
+
"description": "The format the display should take. One of `nil`, `:long`, `:narrow`, or `:short`."
|
|
2021
1999
|
},
|
|
2022
2000
|
{
|
|
2023
|
-
"name": "
|
|
2024
|
-
"type": "
|
|
2025
|
-
"default": "
|
|
2026
|
-
"description": "
|
|
2001
|
+
"name": "lang",
|
|
2002
|
+
"type": "string",
|
|
2003
|
+
"default": "`nil`",
|
|
2004
|
+
"description": "The language to use."
|
|
2027
2005
|
},
|
|
2028
2006
|
{
|
|
2029
|
-
"name": "
|
|
2030
|
-
"type": "
|
|
2031
|
-
"default": "
|
|
2032
|
-
"description": "
|
|
2007
|
+
"name": "title",
|
|
2008
|
+
"type": "string",
|
|
2009
|
+
"default": "`nil`",
|
|
2010
|
+
"description": "Provide a custom title to the element."
|
|
2033
2011
|
},
|
|
2034
2012
|
{
|
|
2035
2013
|
"name": "system_arguments",
|
|
@@ -2040,16 +2018,22 @@
|
|
|
2040
2018
|
]
|
|
2041
2019
|
},
|
|
2042
2020
|
{
|
|
2043
|
-
"component": "
|
|
2044
|
-
"status": "
|
|
2045
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/
|
|
2046
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/
|
|
2021
|
+
"component": "Spinner",
|
|
2022
|
+
"status": "beta",
|
|
2023
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/spinner.rb",
|
|
2024
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/spinner/default/",
|
|
2047
2025
|
"parameters": [
|
|
2048
2026
|
{
|
|
2049
|
-
"name": "
|
|
2027
|
+
"name": "size",
|
|
2050
2028
|
"type": "Symbol",
|
|
2051
|
-
"default": "`
|
|
2052
|
-
"description": "
|
|
2029
|
+
"default": "`:medium`",
|
|
2030
|
+
"description": "One of `[:large, 64]`, `[:medium, 32]`, or `[:small, 16]`."
|
|
2031
|
+
},
|
|
2032
|
+
{
|
|
2033
|
+
"name": "style",
|
|
2034
|
+
"type": "String",
|
|
2035
|
+
"default": "`box-sizing: content-box; color: var(--color-icon-primary);`",
|
|
2036
|
+
"description": "Custom element styles."
|
|
2053
2037
|
},
|
|
2054
2038
|
{
|
|
2055
2039
|
"name": "system_arguments",
|
|
@@ -2060,34 +2044,60 @@
|
|
|
2060
2044
|
]
|
|
2061
2045
|
},
|
|
2062
2046
|
{
|
|
2063
|
-
"component": "
|
|
2064
|
-
"status": "
|
|
2065
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/
|
|
2066
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/
|
|
2047
|
+
"component": "State",
|
|
2048
|
+
"status": "beta",
|
|
2049
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/state.rb",
|
|
2050
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/state/default/",
|
|
2067
2051
|
"parameters": [
|
|
2068
2052
|
{
|
|
2069
|
-
"name": "
|
|
2053
|
+
"name": "title",
|
|
2054
|
+
"type": "String",
|
|
2055
|
+
"default": "N/A",
|
|
2056
|
+
"description": "`title` HTML attribute."
|
|
2057
|
+
},
|
|
2058
|
+
{
|
|
2059
|
+
"name": "scheme",
|
|
2070
2060
|
"type": "Symbol",
|
|
2071
|
-
"default": "`
|
|
2072
|
-
"description": "
|
|
2061
|
+
"default": "`:default`",
|
|
2062
|
+
"description": "Background color. One of `:closed`, `:default`, `:green`, `:merged`, `:open`, `:purple`, or `:red`."
|
|
2073
2063
|
},
|
|
2074
2064
|
{
|
|
2075
|
-
"name": "
|
|
2076
|
-
"type": "
|
|
2077
|
-
"default": "`
|
|
2078
|
-
"description": "
|
|
2065
|
+
"name": "tag",
|
|
2066
|
+
"type": "Symbol",
|
|
2067
|
+
"default": "`:span`",
|
|
2068
|
+
"description": "HTML tag for element. One of `:div` or `:span`."
|
|
2079
2069
|
},
|
|
2080
2070
|
{
|
|
2081
|
-
"name": "
|
|
2071
|
+
"name": "size",
|
|
2072
|
+
"type": "Symbol",
|
|
2073
|
+
"default": "`:default`",
|
|
2074
|
+
"description": "One of `:default` or `:small`."
|
|
2075
|
+
},
|
|
2076
|
+
{
|
|
2077
|
+
"name": "system_arguments",
|
|
2078
|
+
"type": "Hash",
|
|
2079
|
+
"default": "N/A",
|
|
2080
|
+
"description": "[System arguments](/system-arguments)"
|
|
2081
|
+
}
|
|
2082
|
+
]
|
|
2083
|
+
},
|
|
2084
|
+
{
|
|
2085
|
+
"component": "Subhead",
|
|
2086
|
+
"status": "beta",
|
|
2087
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/subhead.rb",
|
|
2088
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/subhead/default/",
|
|
2089
|
+
"parameters": [
|
|
2090
|
+
{
|
|
2091
|
+
"name": "spacious",
|
|
2082
2092
|
"type": "Boolean",
|
|
2083
2093
|
"default": "`false`",
|
|
2084
|
-
"description": "Whether
|
|
2094
|
+
"description": "Whether to add spacing to the Subhead."
|
|
2085
2095
|
},
|
|
2086
2096
|
{
|
|
2087
|
-
"name": "
|
|
2097
|
+
"name": "hide_border",
|
|
2088
2098
|
"type": "Boolean",
|
|
2089
2099
|
"default": "`false`",
|
|
2090
|
-
"description": "Whether
|
|
2100
|
+
"description": "Whether to hide the border under the heading."
|
|
2091
2101
|
},
|
|
2092
2102
|
{
|
|
2093
2103
|
"name": "system_arguments",
|
|
@@ -2098,16 +2108,16 @@
|
|
|
2098
2108
|
]
|
|
2099
2109
|
},
|
|
2100
2110
|
{
|
|
2101
|
-
"component": "
|
|
2102
|
-
"status": "
|
|
2103
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/
|
|
2104
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/
|
|
2111
|
+
"component": "Text",
|
|
2112
|
+
"status": "beta",
|
|
2113
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/text.rb",
|
|
2114
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/text/default/",
|
|
2105
2115
|
"parameters": [
|
|
2106
2116
|
{
|
|
2107
|
-
"name": "
|
|
2117
|
+
"name": "tag",
|
|
2108
2118
|
"type": "Symbol",
|
|
2109
|
-
"default": "`
|
|
2110
|
-
"description": "
|
|
2119
|
+
"default": "`:span`",
|
|
2120
|
+
"description": ""
|
|
2111
2121
|
},
|
|
2112
2122
|
{
|
|
2113
2123
|
"name": "system_arguments",
|
|
@@ -2118,34 +2128,16 @@
|
|
|
2118
2128
|
]
|
|
2119
2129
|
},
|
|
2120
2130
|
{
|
|
2121
|
-
"component": "
|
|
2122
|
-
"status": "
|
|
2123
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/
|
|
2124
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/
|
|
2131
|
+
"component": "TimelineItem",
|
|
2132
|
+
"status": "beta",
|
|
2133
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/timeline_item.rb",
|
|
2134
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/timeline_item/default/",
|
|
2125
2135
|
"parameters": [
|
|
2126
2136
|
{
|
|
2127
|
-
"name": "
|
|
2128
|
-
"type": "Boolean",
|
|
2129
|
-
"default": "`:list`",
|
|
2130
|
-
"description": "ARIA role describing the function of the list. listbox and menu are a common values."
|
|
2131
|
-
},
|
|
2132
|
-
{
|
|
2133
|
-
"name": "item_classes",
|
|
2134
|
-
"type": "String",
|
|
2135
|
-
"default": "`nil`",
|
|
2136
|
-
"description": "Additional CSS classes to attach to items."
|
|
2137
|
-
},
|
|
2138
|
-
{
|
|
2139
|
-
"name": "scheme",
|
|
2140
|
-
"type": "Symbol",
|
|
2141
|
-
"default": "`:full`",
|
|
2142
|
-
"description": "One of `:full` or `:inset`.. `inset` children are offset (vertically and horizontally) from list edges. `full` (default) children are flush (vertically and horizontally) with list edges."
|
|
2143
|
-
},
|
|
2144
|
-
{
|
|
2145
|
-
"name": "show_dividers",
|
|
2137
|
+
"name": "condensed",
|
|
2146
2138
|
"type": "Boolean",
|
|
2147
2139
|
"default": "`false`",
|
|
2148
|
-
"description": "
|
|
2140
|
+
"description": "Reduce the vertical padding and remove the background from the badge item. Most commonly used in commits."
|
|
2149
2141
|
},
|
|
2150
2142
|
{
|
|
2151
2143
|
"name": "system_arguments",
|
|
@@ -2156,17 +2148,11 @@
|
|
|
2156
2148
|
]
|
|
2157
2149
|
},
|
|
2158
2150
|
{
|
|
2159
|
-
"component": "
|
|
2160
|
-
"status": "
|
|
2161
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/
|
|
2162
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/
|
|
2151
|
+
"component": "Truncate",
|
|
2152
|
+
"status": "beta",
|
|
2153
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/truncate.rb",
|
|
2154
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/truncate/default/",
|
|
2163
2155
|
"parameters": [
|
|
2164
|
-
{
|
|
2165
|
-
"name": "scheme",
|
|
2166
|
-
"type": "Symbol",
|
|
2167
|
-
"default": "`:subtle`",
|
|
2168
|
-
"description": "Display a background color if scheme is `filled`."
|
|
2169
|
-
},
|
|
2170
2156
|
{
|
|
2171
2157
|
"name": "system_arguments",
|
|
2172
2158
|
"type": "Hash",
|
|
@@ -2176,41 +2162,11 @@
|
|
|
2176
2162
|
]
|
|
2177
2163
|
},
|
|
2178
2164
|
{
|
|
2179
|
-
"component": "
|
|
2180
|
-
"status": "
|
|
2181
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/
|
|
2182
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/
|
|
2165
|
+
"component": "Box",
|
|
2166
|
+
"status": "stable",
|
|
2167
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/box.rb",
|
|
2168
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/box/default/",
|
|
2183
2169
|
"parameters": [
|
|
2184
|
-
{
|
|
2185
|
-
"name": "list_id",
|
|
2186
|
-
"type": "String",
|
|
2187
|
-
"default": "N/A",
|
|
2188
|
-
"description": "The unique identifier of the sub list the heading belongs to. Used internally."
|
|
2189
|
-
},
|
|
2190
|
-
{
|
|
2191
|
-
"name": "title",
|
|
2192
|
-
"type": "String",
|
|
2193
|
-
"default": "N/A",
|
|
2194
|
-
"description": "Sub list title."
|
|
2195
|
-
},
|
|
2196
|
-
{
|
|
2197
|
-
"name": "subtitle",
|
|
2198
|
-
"type": "String",
|
|
2199
|
-
"default": "`nil`",
|
|
2200
|
-
"description": "Optional sub list description."
|
|
2201
|
-
},
|
|
2202
|
-
{
|
|
2203
|
-
"name": "scheme",
|
|
2204
|
-
"type": "Symbol",
|
|
2205
|
-
"default": "`:subtle`",
|
|
2206
|
-
"description": "Display a background color if scheme is `filled`."
|
|
2207
|
-
},
|
|
2208
|
-
{
|
|
2209
|
-
"name": "tag",
|
|
2210
|
-
"type": "Symbol",
|
|
2211
|
-
"default": "`:h3`",
|
|
2212
|
-
"description": "Semantic tag for the heading."
|
|
2213
|
-
},
|
|
2214
2170
|
{
|
|
2215
2171
|
"name": "system_arguments",
|
|
2216
2172
|
"type": "Hash",
|
|
@@ -2220,100 +2176,58 @@
|
|
|
2220
2176
|
]
|
|
2221
2177
|
},
|
|
2222
2178
|
{
|
|
2223
|
-
"component": "
|
|
2224
|
-
"status": "
|
|
2225
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/
|
|
2226
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/
|
|
2179
|
+
"component": "Button",
|
|
2180
|
+
"status": "deprecated",
|
|
2181
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/button_component.rb",
|
|
2182
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/button/default/",
|
|
2227
2183
|
"parameters": [
|
|
2228
2184
|
{
|
|
2229
|
-
"name": "
|
|
2230
|
-
"type": "
|
|
2231
|
-
"default": "
|
|
2232
|
-
"description": "
|
|
2233
|
-
},
|
|
2234
|
-
{
|
|
2235
|
-
"name": "parent",
|
|
2236
|
-
"type": "Primer::Alpha::ActionList::Item",
|
|
2237
|
-
"default": "`nil`",
|
|
2238
|
-
"description": "This item's parent item. `nil` if this item is at the root. Used internally."
|
|
2239
|
-
},
|
|
2240
|
-
{
|
|
2241
|
-
"name": "label",
|
|
2242
|
-
"type": "String",
|
|
2243
|
-
"default": "N/A",
|
|
2244
|
-
"description": "Item label."
|
|
2245
|
-
},
|
|
2246
|
-
{
|
|
2247
|
-
"name": "label_classes",
|
|
2248
|
-
"type": "String",
|
|
2249
|
-
"default": "`nil`",
|
|
2250
|
-
"description": "CSS classes that will be added to the label."
|
|
2251
|
-
},
|
|
2252
|
-
{
|
|
2253
|
-
"name": "content_arguments",
|
|
2254
|
-
"type": "Hash",
|
|
2255
|
-
"default": "`{}`",
|
|
2256
|
-
"description": "[System arguments](/system-arguments) used to construct the item's anchor or button tag."
|
|
2257
|
-
},
|
|
2258
|
-
{
|
|
2259
|
-
"name": "truncate_label",
|
|
2260
|
-
"type": "Boolean",
|
|
2261
|
-
"default": "`false`",
|
|
2262
|
-
"description": "Truncate label with ellipsis."
|
|
2185
|
+
"name": "scheme",
|
|
2186
|
+
"type": "Symbol",
|
|
2187
|
+
"default": "`:default`",
|
|
2188
|
+
"description": "One of `:danger`, `:default`, `:invisible`, `:link`, `:outline`, or `:primary`."
|
|
2263
2189
|
},
|
|
2264
2190
|
{
|
|
2265
|
-
"name": "
|
|
2266
|
-
"type": "
|
|
2191
|
+
"name": "variant",
|
|
2192
|
+
"type": "Symbol",
|
|
2267
2193
|
"default": "`nil`",
|
|
2268
|
-
"description": "
|
|
2269
|
-
},
|
|
2270
|
-
{
|
|
2271
|
-
"name": "role",
|
|
2272
|
-
"type": "String",
|
|
2273
|
-
"default": "`:listitem`",
|
|
2274
|
-
"description": "ARIA role describing the function of the item."
|
|
2194
|
+
"description": "DEPRECATED. One of `:medium` or `:small`."
|
|
2275
2195
|
},
|
|
2276
2196
|
{
|
|
2277
2197
|
"name": "size",
|
|
2278
2198
|
"type": "Symbol",
|
|
2279
|
-
"default": "`:medium`",
|
|
2280
|
-
"description": "
|
|
2281
|
-
},
|
|
2282
|
-
{
|
|
2283
|
-
"name": "scheme",
|
|
2284
|
-
"type": "Symbol",
|
|
2285
|
-
"default": "`:default`",
|
|
2286
|
-
"description": "Controls color/style based on behavior."
|
|
2199
|
+
"default": "`:medium`",
|
|
2200
|
+
"description": "One of `:medium` or `:small`."
|
|
2287
2201
|
},
|
|
2288
2202
|
{
|
|
2289
|
-
"name": "
|
|
2290
|
-
"type": "
|
|
2291
|
-
"default": "`
|
|
2292
|
-
"description": "
|
|
2203
|
+
"name": "tag",
|
|
2204
|
+
"type": "Symbol",
|
|
2205
|
+
"default": "`:button`",
|
|
2206
|
+
"description": "One of `:a`, `:button`, or `:summary`."
|
|
2293
2207
|
},
|
|
2294
2208
|
{
|
|
2295
|
-
"name": "
|
|
2209
|
+
"name": "type",
|
|
2296
2210
|
"type": "Symbol",
|
|
2297
|
-
"default": "`:
|
|
2298
|
-
"description": "
|
|
2211
|
+
"default": "`:button`",
|
|
2212
|
+
"description": "One of `:button`, `:reset`, or `:submit`."
|
|
2299
2213
|
},
|
|
2300
2214
|
{
|
|
2301
|
-
"name": "
|
|
2215
|
+
"name": "group_item",
|
|
2302
2216
|
"type": "Boolean",
|
|
2303
2217
|
"default": "`false`",
|
|
2304
|
-
"description": "
|
|
2218
|
+
"description": "Whether button is part of a ButtonGroup."
|
|
2305
2219
|
},
|
|
2306
2220
|
{
|
|
2307
|
-
"name": "
|
|
2308
|
-
"type": "
|
|
2309
|
-
"default": "`
|
|
2310
|
-
"description": "
|
|
2221
|
+
"name": "block",
|
|
2222
|
+
"type": "Boolean",
|
|
2223
|
+
"default": "`false`",
|
|
2224
|
+
"description": "Whether button is full-width with `display: block`."
|
|
2311
2225
|
},
|
|
2312
2226
|
{
|
|
2313
|
-
"name": "
|
|
2314
|
-
"type": "
|
|
2315
|
-
"default": "`
|
|
2316
|
-
"description": "
|
|
2227
|
+
"name": "dropdown",
|
|
2228
|
+
"type": "Boolean",
|
|
2229
|
+
"default": "`false`",
|
|
2230
|
+
"description": "Whether or not to render a dropdown caret."
|
|
2317
2231
|
},
|
|
2318
2232
|
{
|
|
2319
2233
|
"name": "system_arguments",
|
|
@@ -2324,142 +2238,228 @@
|
|
|
2324
2238
|
]
|
|
2325
2239
|
},
|
|
2326
2240
|
{
|
|
2327
|
-
"component": "
|
|
2328
|
-
"status": "
|
|
2329
|
-
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/
|
|
2330
|
-
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/
|
|
2241
|
+
"component": "IconButton",
|
|
2242
|
+
"status": "deprecated",
|
|
2243
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/icon_button.rb",
|
|
2244
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/icon_button/default/",
|
|
2331
2245
|
"parameters": [
|
|
2332
2246
|
{
|
|
2333
|
-
"name": "
|
|
2334
|
-
"type": "
|
|
2335
|
-
"default": "
|
|
2336
|
-
"description": "
|
|
2247
|
+
"name": "scheme",
|
|
2248
|
+
"type": "Symbol",
|
|
2249
|
+
"default": "`:default`",
|
|
2250
|
+
"description": "One of `:danger` or `:default`."
|
|
2337
2251
|
},
|
|
2338
2252
|
{
|
|
2339
|
-
"name": "
|
|
2253
|
+
"name": "icon",
|
|
2340
2254
|
"type": "String",
|
|
2341
2255
|
"default": "N/A",
|
|
2342
|
-
"description": "
|
|
2256
|
+
"description": "Name of [Octicon](https://primer.style/octicons/) to use."
|
|
2343
2257
|
},
|
|
2344
2258
|
{
|
|
2345
|
-
"name": "
|
|
2346
|
-
"type": "
|
|
2259
|
+
"name": "tag",
|
|
2260
|
+
"type": "Symbol",
|
|
2347
2261
|
"default": "N/A",
|
|
2348
|
-
"description": "
|
|
2262
|
+
"description": "One of `:a`, `:button`, or `:summary`."
|
|
2349
2263
|
},
|
|
2350
2264
|
{
|
|
2351
|
-
"name": "
|
|
2352
|
-
"type": "
|
|
2265
|
+
"name": "type",
|
|
2266
|
+
"type": "Symbol",
|
|
2353
2267
|
"default": "N/A",
|
|
2354
|
-
"description": "
|
|
2268
|
+
"description": "One of `:button`, `:reset`, or `:submit`."
|
|
2355
2269
|
},
|
|
2356
2270
|
{
|
|
2357
|
-
"name": "
|
|
2271
|
+
"name": "aria-label",
|
|
2358
2272
|
"type": "String",
|
|
2359
2273
|
"default": "N/A",
|
|
2360
|
-
"description": "
|
|
2274
|
+
"description": "String that can be read by assistive technology. A label should be short and concise. See the accessibility section for more information."
|
|
2361
2275
|
},
|
|
2362
2276
|
{
|
|
2363
|
-
"name": "
|
|
2277
|
+
"name": "aria-description",
|
|
2364
2278
|
"type": "String",
|
|
2365
2279
|
"default": "N/A",
|
|
2366
|
-
"description": "
|
|
2280
|
+
"description": "String that can be read by assistive technology. A description can be longer as it is intended to provide more context and information. See the accessibility section for more information."
|
|
2367
2281
|
},
|
|
2368
2282
|
{
|
|
2369
|
-
"name": "
|
|
2283
|
+
"name": "tooltip_direction",
|
|
2284
|
+
"type": "Symbol",
|
|
2285
|
+
"default": "`:s`",
|
|
2286
|
+
"description": "One of `:e`, `:n`, `:ne`, `:nw`, `:s`, `:se`, `:sw`, or `:w`."
|
|
2287
|
+
},
|
|
2288
|
+
{
|
|
2289
|
+
"name": "box",
|
|
2370
2290
|
"type": "Boolean",
|
|
2291
|
+
"default": "`false`",
|
|
2292
|
+
"description": "Whether the button is in a [BorderBox](/components/beta/borderbox). If `true`, the button will have the `Box-btn-octicon` class."
|
|
2293
|
+
},
|
|
2294
|
+
{
|
|
2295
|
+
"name": "system_arguments",
|
|
2296
|
+
"type": "Hash",
|
|
2371
2297
|
"default": "N/A",
|
|
2372
|
-
"description": "
|
|
2298
|
+
"description": "[System arguments](/system-arguments)"
|
|
2299
|
+
}
|
|
2300
|
+
]
|
|
2301
|
+
},
|
|
2302
|
+
{
|
|
2303
|
+
"component": "Layout",
|
|
2304
|
+
"status": "alpha",
|
|
2305
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/layout_component.rb",
|
|
2306
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/layout/default/",
|
|
2307
|
+
"parameters": [
|
|
2308
|
+
{
|
|
2309
|
+
"name": "responsive",
|
|
2310
|
+
"type": "Boolean",
|
|
2311
|
+
"default": "`false`",
|
|
2312
|
+
"description": "Whether to collapse layout to a single column at smaller widths."
|
|
2373
2313
|
},
|
|
2374
2314
|
{
|
|
2375
|
-
"name": "
|
|
2315
|
+
"name": "side",
|
|
2376
2316
|
"type": "Symbol",
|
|
2377
|
-
"default": "
|
|
2378
|
-
"description": "
|
|
2317
|
+
"default": "`:right`",
|
|
2318
|
+
"description": "Which side to display the sidebar on. One of `:left` or `:right`."
|
|
2379
2319
|
},
|
|
2380
2320
|
{
|
|
2381
|
-
"name": "
|
|
2382
|
-
"type": "
|
|
2383
|
-
"default": "
|
|
2384
|
-
"description": "
|
|
2321
|
+
"name": "sidebar_col",
|
|
2322
|
+
"type": "Integer",
|
|
2323
|
+
"default": "`3`",
|
|
2324
|
+
"description": "Sidebar column width."
|
|
2385
2325
|
},
|
|
2386
2326
|
{
|
|
2387
|
-
"name": "
|
|
2388
|
-
"type": "
|
|
2327
|
+
"name": "system_arguments",
|
|
2328
|
+
"type": "Hash",
|
|
2389
2329
|
"default": "N/A",
|
|
2390
|
-
"description": "
|
|
2391
|
-
}
|
|
2330
|
+
"description": "[System arguments](/system-arguments)"
|
|
2331
|
+
}
|
|
2332
|
+
]
|
|
2333
|
+
},
|
|
2334
|
+
{
|
|
2335
|
+
"component": "Navigation::Tab",
|
|
2336
|
+
"status": "alpha",
|
|
2337
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/navigation/tab_component.rb",
|
|
2338
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/navigation/tab/default/",
|
|
2339
|
+
"parameters": [
|
|
2392
2340
|
{
|
|
2393
|
-
"name": "
|
|
2341
|
+
"name": "list",
|
|
2394
2342
|
"type": "Boolean",
|
|
2395
|
-
"default": "
|
|
2396
|
-
"description": "
|
|
2343
|
+
"default": "`false`",
|
|
2344
|
+
"description": "Whether the Tab is an item in a `<ul>` list."
|
|
2397
2345
|
},
|
|
2398
2346
|
{
|
|
2399
|
-
"name": "
|
|
2347
|
+
"name": "selected",
|
|
2400
2348
|
"type": "Boolean",
|
|
2401
|
-
"default": "
|
|
2402
|
-
"description": "Whether
|
|
2349
|
+
"default": "`false`",
|
|
2350
|
+
"description": "Whether the Tab is selected or not."
|
|
2403
2351
|
},
|
|
2404
2352
|
{
|
|
2405
|
-
"name": "
|
|
2353
|
+
"name": "with_panel",
|
|
2406
2354
|
"type": "Boolean",
|
|
2407
|
-
"default": "
|
|
2408
|
-
"description": "
|
|
2355
|
+
"default": "`false`",
|
|
2356
|
+
"description": "Whether the Tab has an associated panel."
|
|
2409
2357
|
},
|
|
2410
2358
|
{
|
|
2411
|
-
"name": "
|
|
2359
|
+
"name": "panel_id",
|
|
2412
2360
|
"type": "String",
|
|
2413
|
-
"default": "
|
|
2414
|
-
"description": "
|
|
2361
|
+
"default": "`\"\"`",
|
|
2362
|
+
"description": "Only applies if `with_panel` is `true`. Unique id of panel."
|
|
2415
2363
|
},
|
|
2416
2364
|
{
|
|
2417
|
-
"name": "
|
|
2365
|
+
"name": "icon_classes",
|
|
2418
2366
|
"type": "Boolean",
|
|
2419
|
-
"default": "
|
|
2420
|
-
"description": "
|
|
2367
|
+
"default": "`\"\"`",
|
|
2368
|
+
"description": "Classes that must always be applied to icons."
|
|
2421
2369
|
},
|
|
2422
2370
|
{
|
|
2423
|
-
"name": "
|
|
2424
|
-
"type": "
|
|
2425
|
-
"default": "
|
|
2426
|
-
"description": "
|
|
2371
|
+
"name": "wrapper_arguments",
|
|
2372
|
+
"type": "Hash",
|
|
2373
|
+
"default": "`{}`",
|
|
2374
|
+
"description": "[System arguments](/system-arguments) to be used in the `<li>` wrapper when the tab is an item in a list."
|
|
2427
2375
|
},
|
|
2428
2376
|
{
|
|
2429
|
-
"name": "
|
|
2377
|
+
"name": "system_arguments",
|
|
2430
2378
|
"type": "Hash",
|
|
2431
2379
|
"default": "N/A",
|
|
2432
|
-
"description": "
|
|
2433
|
-
}
|
|
2380
|
+
"description": "[System arguments](/system-arguments)"
|
|
2381
|
+
}
|
|
2382
|
+
]
|
|
2383
|
+
},
|
|
2384
|
+
{
|
|
2385
|
+
"component": "Tooltip",
|
|
2386
|
+
"status": "deprecated",
|
|
2387
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/tooltip.rb",
|
|
2388
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/tooltip/default/",
|
|
2389
|
+
"parameters": [
|
|
2434
2390
|
{
|
|
2435
|
-
"name": "
|
|
2391
|
+
"name": "label",
|
|
2436
2392
|
"type": "String",
|
|
2437
2393
|
"default": "N/A",
|
|
2438
|
-
"description": "
|
|
2394
|
+
"description": "the text to appear in the tooltip"
|
|
2439
2395
|
},
|
|
2440
2396
|
{
|
|
2441
|
-
"name": "
|
|
2442
|
-
"type": "
|
|
2443
|
-
"default": "
|
|
2444
|
-
"description": "
|
|
2397
|
+
"name": "direction",
|
|
2398
|
+
"type": "String",
|
|
2399
|
+
"default": "`:n`",
|
|
2400
|
+
"description": "Direction of the tooltip. One of `:e`, `:n`, `:ne`, `:nw`, `:s`, `:se`, `:sw`, or `:w`."
|
|
2445
2401
|
},
|
|
2446
2402
|
{
|
|
2447
|
-
"name": "
|
|
2403
|
+
"name": "align",
|
|
2448
2404
|
"type": "String",
|
|
2449
|
-
"default": "
|
|
2450
|
-
"description": "
|
|
2405
|
+
"default": "`:default`",
|
|
2406
|
+
"description": "Align tooltips to the left or right of an element, combined with a `direction` to specify north or south. One of `:default`, `:left_1`, `:left_2`, `:right_1`, or `:right_2`."
|
|
2407
|
+
},
|
|
2408
|
+
{
|
|
2409
|
+
"name": "multiline",
|
|
2410
|
+
"type": "Boolean",
|
|
2411
|
+
"default": "`false`",
|
|
2412
|
+
"description": "Use this when you have long content"
|
|
2413
|
+
},
|
|
2414
|
+
{
|
|
2415
|
+
"name": "no_delay",
|
|
2416
|
+
"type": "Boolean",
|
|
2417
|
+
"default": "`false`",
|
|
2418
|
+
"description": "By default the tooltips have a slight delay before appearing. Set true to override this"
|
|
2451
2419
|
},
|
|
2452
2420
|
{
|
|
2453
2421
|
"name": "system_arguments",
|
|
2454
2422
|
"type": "Hash",
|
|
2455
2423
|
"default": "N/A",
|
|
2456
2424
|
"description": "[System arguments](/system-arguments)"
|
|
2425
|
+
}
|
|
2426
|
+
]
|
|
2427
|
+
},
|
|
2428
|
+
{
|
|
2429
|
+
"component": "Truncate",
|
|
2430
|
+
"status": "beta",
|
|
2431
|
+
"source": "https://github.com/primer/view_components/tree/main/app/components/primer/truncate.rb",
|
|
2432
|
+
"lookbook": "https://primer.style/view-components/lookbook/inspect/primer/truncate/default/",
|
|
2433
|
+
"parameters": [
|
|
2434
|
+
{
|
|
2435
|
+
"name": "tag",
|
|
2436
|
+
"type": "Symbol",
|
|
2437
|
+
"default": "`:div`",
|
|
2438
|
+
"description": "One of `:div`, `:p`, `:span`, or `:strong`."
|
|
2457
2439
|
},
|
|
2458
2440
|
{
|
|
2459
|
-
"name": "
|
|
2460
|
-
"type": "
|
|
2441
|
+
"name": "inline",
|
|
2442
|
+
"type": "Boolean",
|
|
2443
|
+
"default": "`false`",
|
|
2444
|
+
"description": "Whether the element is inline (or inline-block)."
|
|
2445
|
+
},
|
|
2446
|
+
{
|
|
2447
|
+
"name": "expandable",
|
|
2448
|
+
"type": "Boolean",
|
|
2449
|
+
"default": "`false`",
|
|
2450
|
+
"description": "Whether the entire string should be revealed on hover. Can only be used in conjunction with `inline`."
|
|
2451
|
+
},
|
|
2452
|
+
{
|
|
2453
|
+
"name": "max_width",
|
|
2454
|
+
"type": "Integer",
|
|
2455
|
+
"default": "`nil`",
|
|
2456
|
+
"description": "Sets the max-width of the text."
|
|
2457
|
+
},
|
|
2458
|
+
{
|
|
2459
|
+
"name": "system_arguments",
|
|
2460
|
+
"type": "Hash",
|
|
2461
2461
|
"default": "N/A",
|
|
2462
|
-
"description": "
|
|
2462
|
+
"description": "[System arguments](/system-arguments)"
|
|
2463
2463
|
}
|
|
2464
2464
|
]
|
|
2465
2465
|
}
|