@warp-ds/elements 2.9.0-next.1 → 2.9.0-next.3

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