@warp-ds/elements 2.9.0-next.4 → 2.9.0-next.6

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.
Files changed (99) hide show
  1. package/dist/custom-elements.json +3554 -3442
  2. package/dist/docs/affix/accessibility.md +7 -0
  3. package/dist/docs/affix/affix.md +174 -10
  4. package/dist/docs/affix/api.md +28 -10
  5. package/dist/docs/affix/examples.md +92 -0
  6. package/dist/docs/affix/usage.md +47 -0
  7. package/dist/docs/alert/alert.md +12 -12
  8. package/dist/docs/alert/api.md +12 -12
  9. package/dist/docs/attention/api.md +46 -46
  10. package/dist/docs/attention/attention.md +46 -46
  11. package/dist/docs/badge/accessibility.md +44 -0
  12. package/dist/docs/badge/api.md +12 -8
  13. package/dist/docs/badge/badge.md +191 -10
  14. package/dist/docs/badge/examples.md +82 -0
  15. package/dist/docs/badge/usage.md +53 -0
  16. package/dist/docs/button/api.md +46 -42
  17. package/dist/docs/button/button.md +46 -42
  18. package/dist/docs/card/api.md +11 -11
  19. package/dist/docs/card/card.md +11 -11
  20. package/dist/docs/combobox/api.md +62 -62
  21. package/dist/docs/combobox/combobox.md +62 -62
  22. package/dist/docs/datepicker/api.md +74 -66
  23. package/dist/docs/datepicker/datepicker.md +74 -66
  24. package/dist/docs/expandable/api.md +26 -26
  25. package/dist/docs/expandable/expandable.md +26 -26
  26. package/dist/docs/link/api.md +28 -28
  27. package/dist/docs/link/link.md +28 -28
  28. package/dist/docs/page-indicator/api.md +6 -6
  29. package/dist/docs/page-indicator/page-indicator.md +6 -6
  30. package/dist/docs/pagination/api.md +3 -3
  31. package/dist/docs/pagination/pagination.md +3 -3
  32. package/dist/docs/pill/api.md +19 -15
  33. package/dist/docs/pill/pill.md +19 -15
  34. package/dist/docs/select/api.md +44 -44
  35. package/dist/docs/select/select.md +44 -44
  36. package/dist/docs/slider/api.md +80 -78
  37. package/dist/docs/slider/slider.md +80 -78
  38. package/dist/docs/slider-thumb/api.md +28 -76
  39. package/dist/docs/slider-thumb/slider-thumb.md +28 -76
  40. package/dist/docs/switch/api.md +16 -16
  41. package/dist/docs/switch/switch.md +16 -16
  42. package/dist/docs/tab/api.md +26 -40
  43. package/dist/docs/tab/tab.md +26 -40
  44. package/dist/docs/tab-panel/api.md +1 -17
  45. package/dist/docs/tab-panel/tab-panel.md +1 -17
  46. package/dist/docs/tabs/api.md +3 -3
  47. package/dist/docs/tabs/tabs.md +3 -3
  48. package/dist/docs/textarea/api.md +42 -40
  49. package/dist/docs/textarea/textarea.md +42 -40
  50. package/dist/docs/textfield/accessibility.md +15 -0
  51. package/dist/docs/textfield/api.md +86 -83
  52. package/dist/docs/textfield/examples.md +147 -0
  53. package/dist/docs/textfield/textfield.md +279 -86
  54. package/dist/docs/textfield/usage.md +30 -0
  55. package/dist/index.d.ts +343 -319
  56. package/dist/packages/affix/affix.d.ts +23 -14
  57. package/dist/packages/affix/affix.js +24 -11
  58. package/dist/packages/affix/affix.js.map +4 -4
  59. package/dist/packages/affix/affix.stories.d.ts +3 -0
  60. package/dist/packages/affix/affix.stories.js +16 -0
  61. package/dist/packages/affix/affix.test.js +7 -0
  62. package/dist/packages/affix/locales/da/messages.d.mts +1 -0
  63. package/dist/packages/affix/locales/da/messages.mjs +1 -0
  64. package/dist/packages/affix/locales/en/messages.d.mts +1 -0
  65. package/dist/packages/affix/locales/en/messages.mjs +1 -0
  66. package/dist/packages/affix/locales/fi/messages.d.mts +1 -0
  67. package/dist/packages/affix/locales/fi/messages.mjs +1 -0
  68. package/dist/packages/affix/locales/nb/messages.d.mts +1 -0
  69. package/dist/packages/affix/locales/nb/messages.mjs +1 -0
  70. package/dist/packages/affix/locales/sv/messages.d.mts +1 -0
  71. package/dist/packages/affix/locales/sv/messages.mjs +1 -0
  72. package/dist/packages/badge/badge.d.ts +7 -5
  73. package/dist/packages/badge/badge.js.map +2 -2
  74. package/dist/packages/badge/badge.react.stories.d.ts +1 -1
  75. package/dist/packages/box/box.react.stories.d.ts +1 -1
  76. package/dist/packages/breadcrumbs/breadcrumbs.react.stories.d.ts +1 -1
  77. package/dist/packages/button/button.react.stories.d.ts +1 -1
  78. package/dist/packages/card/card.react.stories.d.ts +1 -1
  79. package/dist/packages/combobox/combobox.react.stories.d.ts +1 -1
  80. package/dist/packages/datepicker/datepicker.js +1 -1
  81. package/dist/packages/datepicker/datepicker.js.map +2 -2
  82. package/dist/packages/datepicker/datepicker.react.stories.d.ts +9 -1
  83. package/dist/packages/datepicker/react.d.ts +4 -0
  84. package/dist/packages/datepicker/react.js +4 -0
  85. package/dist/packages/expandable/expandable.react.stories.d.ts +1 -1
  86. package/dist/packages/link/link.react.stories.d.ts +1 -1
  87. package/dist/packages/page-indicator/page-indicator.react.stories.d.ts +1 -1
  88. package/dist/packages/pagination/pagination.react.stories.d.ts +1 -1
  89. package/dist/packages/pill/pill.react.stories.d.ts +1 -1
  90. package/dist/packages/select/select.react.stories.d.ts +1 -1
  91. package/dist/packages/textarea/textarea.react.stories.d.ts +1 -1
  92. package/dist/packages/textfield/textfield.d.ts +57 -60
  93. package/dist/packages/textfield/textfield.js +5 -5
  94. package/dist/packages/textfield/textfield.js.map +2 -2
  95. package/dist/packages/textfield/textfield.react.stories.d.ts +1 -1
  96. package/dist/packages/textfield/textfield.stories.d.ts +3 -0
  97. package/dist/packages/textfield/textfield.stories.js +45 -0
  98. package/dist/web-types.json +452 -147
  99. package/package.json +2 -2
@@ -20,99 +20,105 @@ Uses the `lang` attribute on either the element or on `<html>` to determine the
20
20
 
21
21
  | Name | Type | Default | Summary |
22
22
  |-|-|-|-|
23
- | shadowRootOptions | `object` | `{ ...LitElement.shadowRootOptions, delegatesFocus: true, }` | - |
23
+ | calendar | `HTMLDivElement` | `-` | - |
24
+ | dayFormat | `string` | `'PPPP'` | Decides the format of the day in the calendar as read to screen readers. |
25
+ | headerFormat | `string` | `'MMMM yyyy'` | Decides the format of the date as shown in the calendar header. |
26
+ | input | `HTMLInputElement` | `-` | - |
27
+ | isCalendarOpen | `boolean` | `false` | - |
28
+ | isDayDisabled | `(day: Date) => boolean` | `-` | Lets you control if a date in the calendar should be disabled. |
24
29
  | label | `string` | `-` | - |
25
- | lang | `string` | `-` | - |
30
+ | lang | `string` | `-` | Takes precedence over the `<html>` lang attribute. |
31
+ | month | `unknown` | `-` | - |
26
32
  | name | `string` | `-` | - |
27
- | value | `string` | `-` | - |
28
- | headerFormat | `string` | `'MMMM yyyy'` | - |
29
- | weekdayFormat | `string` | `'EEEEEE'` | - |
30
- | isDayDisabled | `(day: Date) => boolean` | `-` | - |
31
- | dayFormat | `string` | `'PPPP'` | - |
32
- | isCalendarOpen | `boolean` | `false` | - |
33
33
  | navigationDate | `Date` | `-` | - |
34
- | selectedDate | `Date | null` | `-` | - |
35
- | month | `unknown` | `-` | - |
36
- | weeks | `unknown` | `-` | - |
37
- | calendar | `HTMLDivElement` | `-` | - |
38
- | input | `HTMLInputElement` | `-` | - |
34
+ | previousMonthButton | `HTMLButtonElement` | `-` | This is the first focusable element, needed for the modal focus trap. |
35
+ | selectedCell | `HTMLTableCellElement` | `-` | - |
36
+ | selectedDate | `Date \| null` | `-` | - |
37
+ | shadowRootOptions | `object` | `{ ...LitElement.shadowRootOptions, delegatesFocus: true, }` | - |
38
+ | todayCell | `HTMLTableCellElement` | `-` | - |
39
39
  | toggleButton | `HTMLButtonElement` | `-` | - |
40
+ | value | `string` | `-` | - |
41
+ | weekdayFormat | `string` | `'EEEEEE'` | Decides the format of the weekday as shown above the grid of dates in the calendar. |
42
+ | weeks | `unknown` | `-` | - |
40
43
  | wrapper | `HTMLDivElement` | `-` | - |
41
- | previousMonthButton | `HTMLButtonElement` | `-` | - |
42
- | todayCell | `HTMLTableCellElement` | `-` | - |
43
- | selectedCell | `HTMLTableCellElement` | `-` | - |
44
44
 
45
45
  ### Property Details
46
46
 
47
- #### shadowRootOptions
47
+ #### calendar
48
48
 
49
49
 
50
50
 
51
- - Type: `object`
52
- - Default: `{ ...LitElement.shadowRootOptions, delegatesFocus: true, }`
51
+ - Type: `HTMLDivElement`
52
+ - Default: `-`
53
53
 
54
- #### label
54
+ #### dayFormat
55
55
 
56
+ Decides the format of the day in the calendar as read to screen readers.
56
57
 
58
+ The syntax is defined by [date-fns/format](https://date-fns.org/v4.1.0/docs/format).
57
59
 
58
60
  - Type: `string`
59
- - Default: `-`
61
+ - Default: `'PPPP'`
60
62
 
61
- #### lang
63
+ #### headerFormat
62
64
 
65
+ Decides the format of the date as shown in the calendar header.
63
66
 
67
+ The syntax is defined by [date-fns/format](https://date-fns.org/v4.1.0/docs/format).
64
68
 
65
69
  - Type: `string`
66
- - Default: `-`
70
+ - Default: `'MMMM yyyy'`
67
71
 
68
- #### name
72
+ #### input
69
73
 
70
74
 
71
75
 
72
- - Type: `string`
76
+ - Type: `HTMLInputElement`
73
77
  - Default: `-`
74
78
 
75
- #### value
79
+ #### isCalendarOpen
76
80
 
77
81
 
78
82
 
79
- - Type: `string`
80
- - Default: `-`
83
+ - Type: `boolean`
84
+ - Default: `false`
81
85
 
82
- #### headerFormat
86
+ #### isDayDisabled
83
87
 
88
+ Lets you control if a date in the calendar should be disabled.
84
89
 
90
+ This needs to be set on the element instance in JavaScript, not as an HTML attribute.
85
91
 
86
- - Type: `string`
87
- - Default: `'MMMM yyyy'`
92
+ - Type: `(day: Date) => boolean`
93
+ - Default: `-`
88
94
 
89
- #### weekdayFormat
95
+ #### label
90
96
 
91
97
 
92
98
 
93
99
  - Type: `string`
94
- - Default: `'EEEEEE'`
95
-
96
- #### isDayDisabled
100
+ - Default: `-`
97
101
 
102
+ #### lang
98
103
 
104
+ Takes precedence over the `<html>` lang attribute.
99
105
 
100
- - Type: `(day: Date) => boolean`
106
+ - Type: `string`
101
107
  - Default: `-`
102
108
 
103
- #### dayFormat
109
+ #### month
104
110
 
105
111
 
106
112
 
107
- - Type: `string`
108
- - Default: `'PPPP'`
113
+ - Type: `unknown`
114
+ - Default: `-`
109
115
 
110
- #### isCalendarOpen
116
+ #### name
111
117
 
112
118
 
113
119
 
114
- - Type: `boolean`
115
- - Default: `false`
120
+ - Type: `string`
121
+ - Default: `-`
116
122
 
117
123
  #### navigationDate
118
124
 
@@ -121,39 +127,43 @@ Uses the `lang` attribute on either the element or on `<html>` to determine the
121
127
  - Type: `Date`
122
128
  - Default: `-`
123
129
 
124
- #### selectedDate
130
+ #### previousMonthButton
125
131
 
132
+ This is the first focusable element, needed for the modal focus trap.
126
133
 
134
+ Don't cache this and other `@query` fields from inside the calendar modal.
135
+ They work the first time, but once the calendar is closed and reopened
136
+ the query will point to an element that doesn't exist anymore.
127
137
 
128
- - Type: `Date | null`
138
+ - Type: `HTMLButtonElement`
129
139
  - Default: `-`
130
140
 
131
- #### month
141
+ #### selectedCell
132
142
 
133
143
 
134
144
 
135
- - Type: `unknown`
145
+ - Type: `HTMLTableCellElement`
136
146
  - Default: `-`
137
147
 
138
- #### weeks
148
+ #### selectedDate
139
149
 
140
150
 
141
151
 
142
- - Type: `unknown`
152
+ - Type: `Date \| null`
143
153
  - Default: `-`
144
154
 
145
- #### calendar
155
+ #### shadowRootOptions
146
156
 
147
157
 
148
158
 
149
- - Type: `HTMLDivElement`
150
- - Default: `-`
159
+ - Type: `object`
160
+ - Default: `{ ...LitElement.shadowRootOptions, delegatesFocus: true, }`
151
161
 
152
- #### input
162
+ #### todayCell
153
163
 
154
164
 
155
165
 
156
- - Type: `HTMLInputElement`
166
+ - Type: `HTMLTableCellElement`
157
167
  - Default: `-`
158
168
 
159
169
  #### toggleButton
@@ -163,36 +173,34 @@ Uses the `lang` attribute on either the element or on `<html>` to determine the
163
173
  - Type: `HTMLButtonElement`
164
174
  - Default: `-`
165
175
 
166
- #### wrapper
176
+ #### value
167
177
 
168
178
 
169
179
 
170
- - Type: `HTMLDivElement`
180
+ - Type: `string`
171
181
  - Default: `-`
172
182
 
173
- #### previousMonthButton
183
+ #### weekdayFormat
174
184
 
175
- This is the first focusable element, needed for the modal focus trap.
185
+ Decides the format of the weekday as shown above the grid of dates in the calendar.
176
186
 
177
- Don't cache this and other `@query` fields from inside the calendar modal.
178
- They work the first time, but once the calendar is closed and reopened
179
- the query will point to an element that doesn't exist anymore.
187
+ The syntax is defined by [date-fns/format](https://date-fns.org/v4.1.0/docs/format).
180
188
 
181
- - Type: `HTMLButtonElement`
182
- - Default: `-`
189
+ - Type: `string`
190
+ - Default: `'EEEEEE'`
183
191
 
184
- #### todayCell
192
+ #### weeks
185
193
 
186
194
 
187
195
 
188
- - Type: `HTMLTableCellElement`
196
+ - Type: `unknown`
189
197
  - Default: `-`
190
198
 
191
- #### selectedCell
199
+ #### wrapper
192
200
 
193
201
 
194
202
 
195
- - Type: `HTMLTableCellElement`
203
+ - Type: `HTMLDivElement`
196
204
  - Default: `-`
197
205
 
198
206
  ### Types
@@ -4,35 +4,35 @@
4
4
 
5
5
  | Name | Type | Default | Summary |
6
6
  |-|-|-|-|
7
- | expanded | `boolean` | `false` | - |
8
- | title | `string` | `-` | - |
9
- | box | `boolean` | `false` | - |
7
+ | _hasTitle | `boolean` | `true` | - |
8
+ | _showChevronUp | `boolean` | `false` | - |
9
+ | animated | `boolean` | `false` | - |
10
10
  | bleed | `boolean` | `false` | - |
11
+ | box | `boolean` | `false` | - |
11
12
  | buttonClass | `string` | `-` | - |
12
13
  | contentClass | `string` | `-` | - |
13
- | noChevron | `boolean` | `false` | - |
14
- | animated | `boolean` | `false` | - |
14
+ | expanded | `boolean` | `false` | - |
15
15
  | headingLevel | `number` | `-` | - |
16
- | _hasTitle | `boolean` | `true` | - |
17
- | _showChevronUp | `boolean` | `false` | - |
16
+ | noChevron | `boolean` | `false` | - |
17
+ | title | `string` | `-` | - |
18
18
 
19
19
  ### Property Details
20
20
 
21
- #### expanded
21
+ #### _hasTitle
22
22
 
23
23
 
24
24
 
25
25
  - Type: `boolean`
26
- - Default: `false`
26
+ - Default: `true`
27
27
 
28
- #### title
28
+ #### _showChevronUp
29
29
 
30
30
 
31
31
 
32
- - Type: `string`
33
- - Default: `-`
32
+ - Type: `boolean`
33
+ - Default: `false`
34
34
 
35
- #### box
35
+ #### animated
36
36
 
37
37
 
38
38
 
@@ -46,28 +46,28 @@
46
46
  - Type: `boolean`
47
47
  - Default: `false`
48
48
 
49
- #### buttonClass
49
+ #### box
50
50
 
51
51
 
52
52
 
53
- - Type: `string`
54
- - Default: `-`
53
+ - Type: `boolean`
54
+ - Default: `false`
55
55
 
56
- #### contentClass
56
+ #### buttonClass
57
57
 
58
58
 
59
59
 
60
60
  - Type: `string`
61
61
  - Default: `-`
62
62
 
63
- #### noChevron
63
+ #### contentClass
64
64
 
65
65
 
66
66
 
67
- - Type: `boolean`
68
- - Default: `false`
67
+ - Type: `string`
68
+ - Default: `-`
69
69
 
70
- #### animated
70
+ #### expanded
71
71
 
72
72
 
73
73
 
@@ -81,19 +81,19 @@
81
81
  - Type: `number`
82
82
  - Default: `-`
83
83
 
84
- #### _hasTitle
84
+ #### noChevron
85
85
 
86
86
 
87
87
 
88
88
  - Type: `boolean`
89
- - Default: `true`
89
+ - Default: `false`
90
90
 
91
- #### _showChevronUp
91
+ #### title
92
92
 
93
93
 
94
94
 
95
- - Type: `boolean`
96
- - Default: `false`
95
+ - Type: `string`
96
+ - Default: `-`
97
97
 
98
98
  ### Types
99
99
 
@@ -18,35 +18,35 @@ Expandable is a layout component used for creating expandable content areas on a
18
18
 
19
19
  | Name | Type | Default | Summary |
20
20
  |-|-|-|-|
21
- | expanded | `boolean` | `false` | - |
22
- | title | `string` | `-` | - |
23
- | box | `boolean` | `false` | - |
21
+ | _hasTitle | `boolean` | `true` | - |
22
+ | _showChevronUp | `boolean` | `false` | - |
23
+ | animated | `boolean` | `false` | - |
24
24
  | bleed | `boolean` | `false` | - |
25
+ | box | `boolean` | `false` | - |
25
26
  | buttonClass | `string` | `-` | - |
26
27
  | contentClass | `string` | `-` | - |
27
- | noChevron | `boolean` | `false` | - |
28
- | animated | `boolean` | `false` | - |
28
+ | expanded | `boolean` | `false` | - |
29
29
  | headingLevel | `number` | `-` | - |
30
- | _hasTitle | `boolean` | `true` | - |
31
- | _showChevronUp | `boolean` | `false` | - |
30
+ | noChevron | `boolean` | `false` | - |
31
+ | title | `string` | `-` | - |
32
32
 
33
33
  ### Property Details
34
34
 
35
- #### expanded
35
+ #### _hasTitle
36
36
 
37
37
 
38
38
 
39
39
  - Type: `boolean`
40
- - Default: `false`
40
+ - Default: `true`
41
41
 
42
- #### title
42
+ #### _showChevronUp
43
43
 
44
44
 
45
45
 
46
- - Type: `string`
47
- - Default: `-`
46
+ - Type: `boolean`
47
+ - Default: `false`
48
48
 
49
- #### box
49
+ #### animated
50
50
 
51
51
 
52
52
 
@@ -60,28 +60,28 @@ Expandable is a layout component used for creating expandable content areas on a
60
60
  - Type: `boolean`
61
61
  - Default: `false`
62
62
 
63
- #### buttonClass
63
+ #### box
64
64
 
65
65
 
66
66
 
67
- - Type: `string`
68
- - Default: `-`
67
+ - Type: `boolean`
68
+ - Default: `false`
69
69
 
70
- #### contentClass
70
+ #### buttonClass
71
71
 
72
72
 
73
73
 
74
74
  - Type: `string`
75
75
  - Default: `-`
76
76
 
77
- #### noChevron
77
+ #### contentClass
78
78
 
79
79
 
80
80
 
81
- - Type: `boolean`
82
- - Default: `false`
81
+ - Type: `string`
82
+ - Default: `-`
83
83
 
84
- #### animated
84
+ #### expanded
85
85
 
86
86
 
87
87
 
@@ -95,19 +95,19 @@ Expandable is a layout component used for creating expandable content areas on a
95
95
  - Type: `number`
96
96
  - Default: `-`
97
97
 
98
- #### _hasTitle
98
+ #### noChevron
99
99
 
100
100
 
101
101
 
102
102
  - Type: `boolean`
103
- - Default: `true`
103
+ - Default: `false`
104
104
 
105
- #### _showChevronUp
105
+ #### title
106
106
 
107
107
 
108
108
 
109
- - Type: `boolean`
110
- - Default: `false`
109
+ - Type: `string`
110
+ - Default: `-`
111
111
 
112
112
  ### Types
113
113
 
@@ -4,25 +4,18 @@
4
4
 
5
5
  | Name | Type | Default | Summary |
6
6
  |-|-|-|-|
7
- | shadowRootOptions | `object` | `{ ...LitElement.shadowRootOptions, delegatesFocus: true, }` | - |
8
7
  | autofocus | `boolean` | `false` | - |
9
- | variant | [`ButtonVariant`](#buttonvariant) | `-` | - |
10
- | small | `boolean` | `false` | - |
11
- | href | `string` | `-` | - |
12
8
  | disabled | `boolean` | `false` | - |
13
- | target | `string` | `-` | - |
14
- | rel | `string` | `-` | - |
15
9
  | fullWidth | `boolean` | `false` | - |
10
+ | href | `string` | `-` | - |
11
+ | rel | `string` | `-` | - |
12
+ | shadowRootOptions | `object` | `{ ...LitElement.shadowRootOptions, delegatesFocus: true, }` | - |
13
+ | small | `boolean` | `false` | - |
14
+ | target | `string` | `-` | - |
15
+ | variant | [`ButtonVariant`](#buttonvariant) | `-` | - |
16
16
 
17
17
  ### Property Details
18
18
 
19
- #### shadowRootOptions
20
-
21
-
22
-
23
- - Type: `object`
24
- - Default: `{ ...LitElement.shadowRootOptions, delegatesFocus: true, }`
25
-
26
19
  #### autofocus
27
20
 
28
21
 
@@ -30,14 +23,14 @@
30
23
  - Type: `boolean`
31
24
  - Default: `false`
32
25
 
33
- #### variant
26
+ #### disabled
34
27
 
35
28
 
36
29
 
37
- - Type: [`ButtonVariant`](#buttonvariant)
38
- - Default: `-`
30
+ - Type: `boolean`
31
+ - Default: `false`
39
32
 
40
- #### small
33
+ #### fullWidth
41
34
 
42
35
 
43
36
 
@@ -51,37 +44,44 @@
51
44
  - Type: `string`
52
45
  - Default: `-`
53
46
 
54
- #### disabled
47
+ #### rel
55
48
 
56
49
 
57
50
 
58
- - Type: `boolean`
59
- - Default: `false`
51
+ - Type: `string`
52
+ - Default: `-`
60
53
 
61
- #### target
54
+ #### shadowRootOptions
62
55
 
63
56
 
64
57
 
65
- - Type: `string`
66
- - Default: `-`
58
+ - Type: `object`
59
+ - Default: `{ ...LitElement.shadowRootOptions, delegatesFocus: true, }`
67
60
 
68
- #### rel
61
+ #### small
62
+
63
+
64
+
65
+ - Type: `boolean`
66
+ - Default: `false`
67
+
68
+ #### target
69
69
 
70
70
 
71
71
 
72
72
  - Type: `string`
73
73
  - Default: `-`
74
74
 
75
- #### fullWidth
75
+ #### variant
76
76
 
77
77
 
78
78
 
79
- - Type: `boolean`
80
- - Default: `false`
79
+ - Type: [`ButtonVariant`](#buttonvariant)
80
+ - Default: `-`
81
81
 
82
82
  ### Types
83
83
 
84
84
  #### ButtonVariant
85
85
 
86
- `'negative' | 'primary' | 'secondary' | 'negativeQuiet' | 'utility' | 'quiet' | 'utilityQuiet' | 'overlay' | 'overlayInverted' | 'overlayQuiet' | 'overlayInvertedQuiet'`
86
+ `'negative' \| 'primary' \| 'secondary' \| 'negativeQuiet' \| 'utility' \| 'quiet' \| 'utilityQuiet' \| 'overlay' \| 'overlayInverted' \| 'overlayQuiet' \| 'overlayInvertedQuiet'`
87
87
 
@@ -18,25 +18,18 @@ Buttons are used to perform actions, with different visuals for different needs.
18
18
 
19
19
  | Name | Type | Default | Summary |
20
20
  |-|-|-|-|
21
- | shadowRootOptions | `object` | `{ ...LitElement.shadowRootOptions, delegatesFocus: true, }` | - |
22
21
  | autofocus | `boolean` | `false` | - |
23
- | variant | [`ButtonVariant`](#buttonvariant) | `-` | - |
24
- | small | `boolean` | `false` | - |
25
- | href | `string` | `-` | - |
26
22
  | disabled | `boolean` | `false` | - |
27
- | target | `string` | `-` | - |
28
- | rel | `string` | `-` | - |
29
23
  | fullWidth | `boolean` | `false` | - |
24
+ | href | `string` | `-` | - |
25
+ | rel | `string` | `-` | - |
26
+ | shadowRootOptions | `object` | `{ ...LitElement.shadowRootOptions, delegatesFocus: true, }` | - |
27
+ | small | `boolean` | `false` | - |
28
+ | target | `string` | `-` | - |
29
+ | variant | [`ButtonVariant`](#buttonvariant) | `-` | - |
30
30
 
31
31
  ### Property Details
32
32
 
33
- #### shadowRootOptions
34
-
35
-
36
-
37
- - Type: `object`
38
- - Default: `{ ...LitElement.shadowRootOptions, delegatesFocus: true, }`
39
-
40
33
  #### autofocus
41
34
 
42
35
 
@@ -44,14 +37,14 @@ Buttons are used to perform actions, with different visuals for different needs.
44
37
  - Type: `boolean`
45
38
  - Default: `false`
46
39
 
47
- #### variant
40
+ #### disabled
48
41
 
49
42
 
50
43
 
51
- - Type: [`ButtonVariant`](#buttonvariant)
52
- - Default: `-`
44
+ - Type: `boolean`
45
+ - Default: `false`
53
46
 
54
- #### small
47
+ #### fullWidth
55
48
 
56
49
 
57
50
 
@@ -65,37 +58,44 @@ Buttons are used to perform actions, with different visuals for different needs.
65
58
  - Type: `string`
66
59
  - Default: `-`
67
60
 
68
- #### disabled
61
+ #### rel
69
62
 
70
63
 
71
64
 
72
- - Type: `boolean`
73
- - Default: `false`
65
+ - Type: `string`
66
+ - Default: `-`
74
67
 
75
- #### target
68
+ #### shadowRootOptions
76
69
 
77
70
 
78
71
 
79
- - Type: `string`
80
- - Default: `-`
72
+ - Type: `object`
73
+ - Default: `{ ...LitElement.shadowRootOptions, delegatesFocus: true, }`
81
74
 
82
- #### rel
75
+ #### small
76
+
77
+
78
+
79
+ - Type: `boolean`
80
+ - Default: `false`
81
+
82
+ #### target
83
83
 
84
84
 
85
85
 
86
86
  - Type: `string`
87
87
  - Default: `-`
88
88
 
89
- #### fullWidth
89
+ #### variant
90
90
 
91
91
 
92
92
 
93
- - Type: `boolean`
94
- - Default: `false`
93
+ - Type: [`ButtonVariant`](#buttonvariant)
94
+ - Default: `-`
95
95
 
96
96
  ### Types
97
97
 
98
98
  #### ButtonVariant
99
99
 
100
- `'negative' | 'primary' | 'secondary' | 'negativeQuiet' | 'utility' | 'quiet' | 'utilityQuiet' | 'overlay' | 'overlayInverted' | 'overlayQuiet' | 'overlayInvertedQuiet'`
100
+ `'negative' \| 'primary' \| 'secondary' \| 'negativeQuiet' \| 'utility' \| 'quiet' \| 'utilityQuiet' \| 'overlay' \| 'overlayInverted' \| 'overlayQuiet' \| 'overlayInvertedQuiet'`
101
101