@warp-ds/elements 2.9.0-next.5 → 2.9.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (79) hide show
  1. package/dist/custom-elements.json +221 -118
  2. package/dist/docs/affix/affix.md +49 -61
  3. package/dist/docs/affix/api.md +25 -23
  4. package/dist/docs/affix/examples.md +24 -38
  5. package/dist/docs/alert/accessibility.md +4 -9
  6. package/dist/docs/alert/alert.md +36 -51
  7. package/dist/docs/alert/api.md +12 -12
  8. package/dist/docs/alert/examples.md +20 -30
  9. package/dist/docs/attention/accessibility.md +50 -0
  10. package/dist/docs/attention/api.md +72 -59
  11. package/dist/docs/attention/attention.md +305 -56
  12. package/dist/docs/attention/examples.md +91 -0
  13. package/dist/docs/attention/usage.md +91 -0
  14. package/dist/docs/badge/accessibility.md +44 -0
  15. package/dist/docs/badge/api.md +12 -8
  16. package/dist/docs/badge/badge.md +178 -10
  17. package/dist/docs/badge/examples.md +69 -0
  18. package/dist/docs/badge/usage.md +53 -0
  19. package/dist/docs/button/api.md +46 -42
  20. package/dist/docs/button/button.md +46 -42
  21. package/dist/docs/card/api.md +11 -11
  22. package/dist/docs/card/card.md +11 -11
  23. package/dist/docs/combobox/api.md +62 -62
  24. package/dist/docs/combobox/combobox.md +62 -62
  25. package/dist/docs/datepicker/api.md +74 -66
  26. package/dist/docs/datepicker/datepicker.md +74 -66
  27. package/dist/docs/expandable/api.md +26 -26
  28. package/dist/docs/expandable/expandable.md +26 -26
  29. package/dist/docs/link/api.md +28 -28
  30. package/dist/docs/link/link.md +28 -28
  31. package/dist/docs/page-indicator/api.md +6 -6
  32. package/dist/docs/page-indicator/page-indicator.md +6 -6
  33. package/dist/docs/pagination/api.md +3 -3
  34. package/dist/docs/pagination/pagination.md +3 -3
  35. package/dist/docs/pill/api.md +19 -15
  36. package/dist/docs/pill/pill.md +19 -15
  37. package/dist/docs/select/api.md +44 -44
  38. package/dist/docs/select/select.md +44 -44
  39. package/dist/docs/slider/api.md +80 -78
  40. package/dist/docs/slider/slider.md +80 -78
  41. package/dist/docs/slider-thumb/api.md +28 -76
  42. package/dist/docs/slider-thumb/slider-thumb.md +28 -76
  43. package/dist/docs/switch/api.md +16 -16
  44. package/dist/docs/switch/switch.md +16 -16
  45. package/dist/docs/tab/api.md +26 -40
  46. package/dist/docs/tab/tab.md +26 -40
  47. package/dist/docs/tab-panel/api.md +1 -17
  48. package/dist/docs/tab-panel/tab-panel.md +1 -17
  49. package/dist/docs/tabs/api.md +3 -3
  50. package/dist/docs/tabs/tabs.md +3 -3
  51. package/dist/docs/textarea/accessibility.md +5 -0
  52. package/dist/docs/textarea/api.md +52 -65
  53. package/dist/docs/textarea/examples.md +81 -0
  54. package/dist/docs/textarea/textarea.md +151 -65
  55. package/dist/docs/textarea/usage.md +9 -0
  56. package/dist/docs/textfield/accessibility.md +15 -0
  57. package/dist/docs/textfield/api.md +86 -83
  58. package/dist/docs/textfield/examples.md +130 -0
  59. package/dist/docs/textfield/textfield.md +258 -86
  60. package/dist/docs/textfield/usage.md +26 -0
  61. package/dist/index.d.ts +456 -330
  62. package/dist/packages/attention/attention.d.ts +46 -37
  63. package/dist/packages/attention/attention.js +20 -20
  64. package/dist/packages/attention/attention.js.map +3 -3
  65. package/dist/packages/badge/badge.d.ts +7 -5
  66. package/dist/packages/badge/badge.js.map +2 -2
  67. package/dist/packages/datepicker/datepicker.js +1 -1
  68. package/dist/packages/datepicker/datepicker.js.map +2 -2
  69. package/dist/packages/datepicker/datepicker.react.stories.d.ts +9 -1
  70. package/dist/packages/datepicker/react.d.ts +4 -0
  71. package/dist/packages/datepicker/react.js +4 -0
  72. package/dist/packages/textarea/textarea.d.ts +38 -29
  73. package/dist/packages/textarea/textarea.js.map +2 -2
  74. package/dist/packages/textfield/textfield.d.ts +57 -60
  75. package/dist/packages/textfield/textfield.js +5 -5
  76. package/dist/packages/textfield/textfield.js.map +2 -2
  77. package/dist/packages/textfield/textfield.react.stories.d.ts +1 -1
  78. package/dist/web-types.json +573 -153
  79. package/package.json +1 -2
@@ -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
 
@@ -4,21 +4,21 @@
4
4
 
5
5
  | Name | Type | Default | Summary |
6
6
  |-|-|-|-|
7
- | selectedPage | `number` | `-` | - |
8
- | pageCount | `number` | `-` | - |
7
+ | pageCount | `number` | `-` | Total number of pages (minimum 1) |
8
+ | selectedPage | `number` | `-` | Currently selected page (1-based index, clamped to valid range) |
9
9
 
10
10
  ### Property Details
11
11
 
12
- #### selectedPage
13
-
12
+ #### pageCount
14
13
 
14
+ Total number of pages (minimum 1)
15
15
 
16
16
  - Type: `number`
17
17
  - Default: `-`
18
18
 
19
- #### pageCount
20
-
19
+ #### selectedPage
21
20
 
21
+ Currently selected page (1-based index, clamped to valid range)
22
22
 
23
23
  - Type: `number`
24
24
  - Default: `-`
@@ -17,21 +17,21 @@ One dot is highlighted to indicate the currently selected page.
17
17
 
18
18
  | Name | Type | Default | Summary |
19
19
  |-|-|-|-|
20
- | selectedPage | `number` | `-` | - |
21
- | pageCount | `number` | `-` | - |
20
+ | pageCount | `number` | `-` | Total number of pages (minimum 1) |
21
+ | selectedPage | `number` | `-` | Currently selected page (1-based index, clamped to valid range) |
22
22
 
23
23
  ### Property Details
24
24
 
25
- #### selectedPage
26
-
25
+ #### pageCount
27
26
 
27
+ Total number of pages (minimum 1)
28
28
 
29
29
  - Type: `number`
30
30
  - Default: `-`
31
31
 
32
- #### pageCount
33
-
32
+ #### selectedPage
34
33
 
34
+ Currently selected page (1-based index, clamped to valid range)
35
35
 
36
36
  - Type: `number`
37
37
  - Default: `-`
@@ -5,8 +5,8 @@
5
5
  | Name | Type | Default | Summary |
6
6
  |-|-|-|-|
7
7
  | baseUrl | `string` | `-` | - |
8
- | pages | `number` | `-` | - |
9
8
  | currentPageNumber | `number` | `-` | - |
9
+ | pages | `number` | `-` | - |
10
10
  | visiblePages | `number` | `-` | - |
11
11
 
12
12
  ### Property Details
@@ -18,14 +18,14 @@
18
18
  - Type: `string`
19
19
  - Default: `-`
20
20
 
21
- #### pages
21
+ #### currentPageNumber
22
22
 
23
23
 
24
24
 
25
25
  - Type: `number`
26
26
  - Default: `-`
27
27
 
28
- #### currentPageNumber
28
+ #### pages
29
29
 
30
30
 
31
31
 
@@ -19,8 +19,8 @@ Pagination allows users to navigate through multiple pages of content by providi
19
19
  | Name | Type | Default | Summary |
20
20
  |-|-|-|-|
21
21
  | baseUrl | `string` | `-` | - |
22
- | pages | `number` | `-` | - |
23
22
  | currentPageNumber | `number` | `-` | - |
23
+ | pages | `number` | `-` | - |
24
24
  | visiblePages | `number` | `-` | - |
25
25
 
26
26
  ### Property Details
@@ -32,14 +32,14 @@ Pagination allows users to navigate through multiple pages of content by providi
32
32
  - Type: `string`
33
33
  - Default: `-`
34
34
 
35
- #### pages
35
+ #### currentPageNumber
36
36
 
37
37
 
38
38
 
39
39
  - Type: `number`
40
40
  - Default: `-`
41
41
 
42
- #### currentPageNumber
42
+ #### pages
43
43
 
44
44
 
45
45
 
@@ -5,13 +5,13 @@
5
5
  | Name | Type | Default | Summary |
6
6
  |-|-|-|-|
7
7
  | canClose | `boolean` | `false` | - |
8
- | suggestion | `boolean` | `false` | - |
9
- | openSrLabel | `string` | `-` | - |
10
- | openAriaLabel | `string` | `-` | - |
11
- | closeSrLabel | `string` | `-` | - |
12
8
  | closeAriaLabel | `string` | `-` | - |
9
+ | closeSrLabel | `string` | `-` | **Deprecated**: Used "close-arial-label" instead. |
10
+ | openAriaLabel | `string` | `-` | - |
13
11
  | openFilterSrText | `unknown` | `-` | - |
12
+ | openSrLabel | `string` | `-` | **Deprecated**: Used "open-arial-label" instead. |
14
13
  | removeFilterSrText | `unknown` | `-` | - |
14
+ | suggestion | `boolean` | `false` | - |
15
15
 
16
16
  ### Property Details
17
17
 
@@ -22,14 +22,16 @@
22
22
  - Type: `boolean`
23
23
  - Default: `false`
24
24
 
25
- #### suggestion
25
+ #### closeAriaLabel
26
26
 
27
27
 
28
28
 
29
- - Type: `boolean`
30
- - Default: `false`
29
+ - Type: `string`
30
+ - Default: `-`
31
31
 
32
- #### openSrLabel
32
+ #### closeSrLabel
33
+
34
+ **Deprecated**: Used "close-arial-label" instead.
33
35
 
34
36
 
35
37
 
@@ -43,33 +45,35 @@
43
45
  - Type: `string`
44
46
  - Default: `-`
45
47
 
46
- #### closeSrLabel
48
+ #### openFilterSrText
47
49
 
48
50
 
49
51
 
50
- - Type: `string`
52
+ - Type: `unknown`
51
53
  - Default: `-`
52
54
 
53
- #### closeAriaLabel
55
+ #### openSrLabel
56
+
57
+ **Deprecated**: Used "open-arial-label" instead.
54
58
 
55
59
 
56
60
 
57
61
  - Type: `string`
58
62
  - Default: `-`
59
63
 
60
- #### openFilterSrText
64
+ #### removeFilterSrText
61
65
 
62
66
 
63
67
 
64
68
  - Type: `unknown`
65
69
  - Default: `-`
66
70
 
67
- #### removeFilterSrText
71
+ #### suggestion
68
72
 
69
73
 
70
74
 
71
- - Type: `unknown`
72
- - Default: `-`
75
+ - Type: `boolean`
76
+ - Default: `false`
73
77
 
74
78
  ### Types
75
79
 
@@ -19,13 +19,13 @@ Pill is a type of button that is often used as a filter, but can also be used as
19
19
  | Name | Type | Default | Summary |
20
20
  |-|-|-|-|
21
21
  | canClose | `boolean` | `false` | - |
22
- | suggestion | `boolean` | `false` | - |
23
- | openSrLabel | `string` | `-` | - |
24
- | openAriaLabel | `string` | `-` | - |
25
- | closeSrLabel | `string` | `-` | - |
26
22
  | closeAriaLabel | `string` | `-` | - |
23
+ | closeSrLabel | `string` | `-` | **Deprecated**: Used "close-arial-label" instead. |
24
+ | openAriaLabel | `string` | `-` | - |
27
25
  | openFilterSrText | `unknown` | `-` | - |
26
+ | openSrLabel | `string` | `-` | **Deprecated**: Used "open-arial-label" instead. |
28
27
  | removeFilterSrText | `unknown` | `-` | - |
28
+ | suggestion | `boolean` | `false` | - |
29
29
 
30
30
  ### Property Details
31
31
 
@@ -36,14 +36,16 @@ Pill is a type of button that is often used as a filter, but can also be used as
36
36
  - Type: `boolean`
37
37
  - Default: `false`
38
38
 
39
- #### suggestion
39
+ #### closeAriaLabel
40
40
 
41
41
 
42
42
 
43
- - Type: `boolean`
44
- - Default: `false`
43
+ - Type: `string`
44
+ - Default: `-`
45
45
 
46
- #### openSrLabel
46
+ #### closeSrLabel
47
+
48
+ **Deprecated**: Used "close-arial-label" instead.
47
49
 
48
50
 
49
51
 
@@ -57,33 +59,35 @@ Pill is a type of button that is often used as a filter, but can also be used as
57
59
  - Type: `string`
58
60
  - Default: `-`
59
61
 
60
- #### closeSrLabel
62
+ #### openFilterSrText
61
63
 
62
64
 
63
65
 
64
- - Type: `string`
66
+ - Type: `unknown`
65
67
  - Default: `-`
66
68
 
67
- #### closeAriaLabel
69
+ #### openSrLabel
70
+
71
+ **Deprecated**: Used "open-arial-label" instead.
68
72
 
69
73
 
70
74
 
71
75
  - Type: `string`
72
76
  - Default: `-`
73
77
 
74
- #### openFilterSrText
78
+ #### removeFilterSrText
75
79
 
76
80
 
77
81
 
78
82
  - Type: `unknown`
79
83
  - Default: `-`
80
84
 
81
- #### removeFilterSrText
85
+ #### suggestion
82
86
 
83
87
 
84
88
 
85
- - Type: `unknown`
86
- - Default: `-`
89
+ - Type: `boolean`
90
+ - Default: `false`
87
91
 
88
92
  ### Types
89
93