@warp-ds/elements 2.9.1-next.2 → 2.9.1-next.4

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 (168) hide show
  1. package/dist/custom-elements.json +91 -262
  2. package/dist/docs/affix/affix.md +9 -10
  3. package/dist/docs/affix/api.md +9 -10
  4. package/dist/docs/alert/alert.md +4 -2
  5. package/dist/docs/alert/api.md +4 -2
  6. package/dist/docs/attention/api.md +21 -16
  7. package/dist/docs/attention/attention.md +21 -16
  8. package/dist/docs/badge/api.md +5 -6
  9. package/dist/docs/badge/badge.md +5 -6
  10. package/dist/docs/box/api.md +3 -4
  11. package/dist/docs/box/box.md +3 -4
  12. package/dist/docs/breadcrumbs/accessibility.md +46 -0
  13. package/dist/docs/breadcrumbs/api.md +8 -8
  14. package/dist/docs/breadcrumbs/breadcrumbs.md +127 -9
  15. package/dist/docs/breadcrumbs/examples.md +35 -0
  16. package/dist/docs/breadcrumbs/usage.md +36 -0
  17. package/dist/docs/button/api.md +15 -13
  18. package/dist/docs/button/button.md +15 -13
  19. package/dist/docs/card/api.md +5 -6
  20. package/dist/docs/card/card.md +5 -6
  21. package/dist/docs/combobox/api.md +18 -19
  22. package/dist/docs/combobox/combobox.md +18 -19
  23. package/dist/docs/datepicker/api.md +38 -39
  24. package/dist/docs/datepicker/datepicker.md +38 -39
  25. package/dist/docs/expandable/api.md +11 -12
  26. package/dist/docs/expandable/expandable.md +11 -12
  27. package/dist/docs/link/api.md +8 -6
  28. package/dist/docs/link/link.md +8 -6
  29. package/dist/docs/page-indicator/api.md +7 -8
  30. package/dist/docs/page-indicator/page-indicator.md +7 -8
  31. package/dist/docs/pagination/api.md +17 -9
  32. package/dist/docs/pagination/pagination.md +17 -9
  33. package/dist/docs/pill/api.md +30 -17
  34. package/dist/docs/pill/pill.md +30 -17
  35. package/dist/docs/select/api.md +17 -9
  36. package/dist/docs/select/select.md +17 -9
  37. package/dist/docs/slider/api.md +37 -116
  38. package/dist/docs/slider/examples.md +331 -0
  39. package/dist/docs/slider/slider.md +378 -118
  40. package/dist/docs/slider/usage.md +10 -0
  41. package/dist/docs/slider-thumb/api.md +26 -79
  42. package/dist/docs/slider-thumb/slider-thumb.md +26 -81
  43. package/dist/docs/step/api.md +3 -4
  44. package/dist/docs/step/step.md +3 -4
  45. package/dist/docs/step-indicator/api.md +3 -4
  46. package/dist/docs/step-indicator/step-indicator.md +3 -4
  47. package/dist/docs/switch/api.md +13 -5
  48. package/dist/docs/switch/switch.md +13 -5
  49. package/dist/docs/tab/api.md +9 -62
  50. package/dist/docs/tab/tab.md +9 -70
  51. package/dist/docs/tab-panel/api.md +7 -11
  52. package/dist/docs/tab-panel/tab-panel.md +7 -19
  53. package/dist/docs/tabs/accessibility.md +11 -0
  54. package/dist/docs/tabs/api.md +10 -18
  55. package/dist/docs/tabs/examples.md +68 -0
  56. package/dist/docs/tabs/tabs.md +97 -20
  57. package/dist/docs/tabs/usage.md +8 -0
  58. package/dist/docs/textarea/api.md +15 -16
  59. package/dist/docs/textarea/textarea.md +15 -16
  60. package/dist/docs/textfield/api.md +14 -15
  61. package/dist/docs/textfield/textfield.md +14 -15
  62. package/dist/index.d.ts +124 -242
  63. package/dist/packages/affix/affix.js +11 -12
  64. package/dist/packages/affix/affix.js.map +4 -4
  65. package/dist/packages/alert/alert.d.ts +1 -1
  66. package/dist/packages/alert/alert.js.map +1 -1
  67. package/dist/packages/attention/attention.d.ts +3 -2
  68. package/dist/packages/attention/attention.js +27 -28
  69. package/dist/packages/attention/attention.js.map +4 -4
  70. package/dist/packages/breadcrumbs/breadcrumbs.d.ts +7 -1
  71. package/dist/packages/breadcrumbs/breadcrumbs.js +7 -8
  72. package/dist/packages/breadcrumbs/breadcrumbs.js.map +4 -4
  73. package/dist/packages/button/button.d.ts +4 -2
  74. package/dist/packages/button/button.js +14 -15
  75. package/dist/packages/button/button.js.map +4 -4
  76. package/dist/packages/card/card.js +8 -9
  77. package/dist/packages/card/card.js.map +4 -4
  78. package/dist/packages/checkbox/checkbox.d.ts +2 -0
  79. package/dist/packages/checkbox-group/checkbox-group.d.ts +2 -0
  80. package/dist/packages/checkbox-group/checkbox-group.js +15 -16
  81. package/dist/packages/checkbox-group/checkbox-group.js.map +4 -4
  82. package/dist/packages/checkbox-group/locales/da/messages.mjs +1 -1
  83. package/dist/packages/checkbox-group/locales/en/messages.mjs +1 -1
  84. package/dist/packages/checkbox-group/locales/fi/messages.mjs +1 -1
  85. package/dist/packages/checkbox-group/locales/nb/messages.mjs +1 -1
  86. package/dist/packages/checkbox-group/locales/sv/messages.mjs +1 -1
  87. package/dist/packages/combobox/combobox.js +13 -14
  88. package/dist/packages/combobox/combobox.js.map +4 -4
  89. package/dist/packages/combobox/locales/da/messages.mjs +1 -1
  90. package/dist/packages/combobox/locales/en/messages.mjs +1 -1
  91. package/dist/packages/combobox/locales/fi/messages.mjs +1 -1
  92. package/dist/packages/combobox/locales/nb/messages.mjs +1 -1
  93. package/dist/packages/combobox/locales/sv/messages.mjs +1 -1
  94. package/dist/packages/datepicker/datepicker.d.ts +2 -0
  95. package/dist/packages/datepicker/datepicker.js +51 -52
  96. package/dist/packages/datepicker/datepicker.js.map +4 -4
  97. package/dist/packages/datepicker/locales/da/messages.mjs +1 -1
  98. package/dist/packages/datepicker/locales/en/messages.mjs +1 -1
  99. package/dist/packages/datepicker/locales/fi/messages.mjs +1 -1
  100. package/dist/packages/datepicker/locales/nb/messages.mjs +1 -1
  101. package/dist/packages/datepicker/locales/sv/messages.mjs +1 -1
  102. package/dist/packages/link/link.d.ts +2 -0
  103. package/dist/packages/modal-header/modal-header.js +13 -14
  104. package/dist/packages/modal-header/modal-header.js.map +4 -4
  105. package/dist/packages/page-indicator/page-indicator.js +7 -8
  106. package/dist/packages/page-indicator/page-indicator.js.map +4 -4
  107. package/dist/packages/pagination/locales/da/messages.mjs +1 -1
  108. package/dist/packages/pagination/locales/en/messages.mjs +1 -1
  109. package/dist/packages/pagination/locales/fi/messages.mjs +1 -1
  110. package/dist/packages/pagination/locales/nb/messages.mjs +1 -1
  111. package/dist/packages/pagination/locales/sv/messages.mjs +1 -1
  112. package/dist/packages/pagination/pagination.js +31 -32
  113. package/dist/packages/pagination/pagination.js.map +4 -4
  114. package/dist/packages/pagination/pagination.test.js +38 -0
  115. package/dist/packages/pill/pill.js +11 -12
  116. package/dist/packages/pill/pill.js.map +4 -4
  117. package/dist/packages/radio/radio.d.ts +2 -0
  118. package/dist/packages/radio-group/radio-group.d.ts +2 -0
  119. package/dist/packages/radio-group/radio-group.js +17 -18
  120. package/dist/packages/radio-group/radio-group.js.map +4 -4
  121. package/dist/packages/select/select.js +19 -20
  122. package/dist/packages/select/select.js.map +4 -4
  123. package/dist/packages/slider/locales/da/messages.mjs +1 -1
  124. package/dist/packages/slider/locales/en/messages.mjs +1 -1
  125. package/dist/packages/slider/locales/fi/messages.mjs +1 -1
  126. package/dist/packages/slider/locales/nb/messages.mjs +1 -1
  127. package/dist/packages/slider/locales/sv/messages.mjs +1 -1
  128. package/dist/packages/slider/slider.d.ts +36 -45
  129. package/dist/packages/slider/slider.js +22 -23
  130. package/dist/packages/slider/slider.js.map +4 -4
  131. package/dist/packages/slider-thumb/slider-thumb.d.ts +41 -31
  132. package/dist/packages/slider-thumb/slider-thumb.js +33 -34
  133. package/dist/packages/slider-thumb/slider-thumb.js.map +4 -4
  134. package/dist/packages/step/locales/da/messages.mjs +1 -1
  135. package/dist/packages/step/locales/en/messages.mjs +1 -1
  136. package/dist/packages/step/locales/fi/messages.mjs +1 -1
  137. package/dist/packages/step/locales/nb/messages.mjs +1 -1
  138. package/dist/packages/step/locales/sv/messages.mjs +1 -1
  139. package/dist/packages/step/step.js +11 -12
  140. package/dist/packages/step/step.js.map +4 -4
  141. package/dist/packages/switch/switch.d.ts +2 -0
  142. package/dist/packages/tab/tab.d.ts +31 -24
  143. package/dist/packages/tab/tab.js +3 -3
  144. package/dist/packages/tab/tab.js.map +2 -2
  145. package/dist/packages/tab-panel/tab-panel.d.ts +9 -8
  146. package/dist/packages/tab-panel/tab-panel.js +3 -3
  147. package/dist/packages/tab-panel/tab-panel.js.map +2 -2
  148. package/dist/packages/tabs/index.d.ts +1 -0
  149. package/dist/packages/tabs/index.js +0 -1
  150. package/dist/packages/tabs/react.d.ts +4 -3
  151. package/dist/packages/tabs/tabs.d.ts +9 -3
  152. package/dist/packages/tabs/tabs.js +1 -1
  153. package/dist/packages/tabs/tabs.js.map +3 -3
  154. package/dist/packages/tabs/tabs.react.stories.d.ts +2 -2
  155. package/dist/packages/textarea/textarea.d.ts +2 -0
  156. package/dist/packages/textarea/textarea.js +20 -21
  157. package/dist/packages/textarea/textarea.js.map +4 -4
  158. package/dist/packages/textfield/textfield.d.ts +2 -0
  159. package/dist/packages/toast/toast.js +13 -14
  160. package/dist/packages/toast/toast.js.map +4 -4
  161. package/dist/web-types.json +206 -98
  162. package/package.json +20 -19
  163. package/dist/docs/tab/accessibility.md +0 -1
  164. package/dist/docs/tab/examples.md +0 -1
  165. package/dist/docs/tab/usage.md +0 -1
  166. package/dist/docs/tab-panel/accessibility.md +0 -1
  167. package/dist/docs/tab-panel/examples.md +0 -1
  168. package/dist/docs/tab-panel/usage.md +0 -1
@@ -1,116 +1,63 @@
1
- ## API Documentation
1
+ ### `<w-slider-thumb>` API
2
2
 
3
- ### Properties
3
+ #### Properties
4
4
 
5
5
  | Name | Type | Default | Summary |
6
6
  |-|-|-|-|
7
- | ariaDescription | `string` | `-` | - |
8
- | ariaDescriptionText | `unknown` | `-` | - |
9
- | ariaLabel | `string` | `-` | - |
10
- | boundaryValue | `string` | `-` | - |
11
- | name | `string` | `-` | - |
12
- | placeholder | `string` | `-` | - |
13
- | range | `HTMLInputElement` | `-` | - |
14
- | shadowRootOptions | `object` | `{ ...LitElement.shadowRootOptions, delegatesFocus: true, }` | - |
15
- | textFieldDisplayValue | `unknown` | `-` | Value to display in the textfield (shows boundary when focused on empty value) |
16
- | textfield | `WarpTextField` | `-` | - |
17
- | tooltipDisplayValue | `string \| number` | `-` | Value to display in the tooltip |
18
- | tooltipTarget | `HTMLOutputElement` | `-` | - |
19
- | value | `string` | `-` | - |
7
+ | aria-description | `string` | `-` | Contextual information for assistive technology, should it be needed |
8
+ | aria-label | `string` | ``label` from `w-slider`` | Label for the range input. |
9
+ | name | `string` | `-` | The name of this input field in the form. The canonical source of the value is the text field. |
10
+ | placeholder | `string` | `-` | Placeholder in empty text fields |
11
+ | value | `string` | `-` | The initial value, if any |
20
12
 
21
- ### Property Details
22
-
23
- #### ariaDescription
13
+ #### Property Details
24
14
 
15
+ ##### aria-description
25
16
 
17
+ Contextual information for assistive technology, should it be needed
26
18
 
27
19
  - Type: `string`
28
20
  - Default: `-`
29
21
 
30
- #### ariaDescriptionText
31
-
32
-
33
-
34
- - Type: `unknown`
35
- - Default: `-`
36
-
37
- #### ariaLabel
38
-
22
+ ##### aria-label
39
23
 
24
+ Label for the range input.
40
25
 
41
26
  - Type: `string`
42
- - Default: `-`
43
-
44
- #### boundaryValue
27
+ - Default: ``label` from `w-slider``
45
28
 
29
+ ##### name
46
30
 
31
+ The name of this input field in the form. The canonical source of the value is the text field.
47
32
 
48
33
  - Type: `string`
49
34
  - Default: `-`
50
35
 
51
- #### name
52
-
36
+ ##### placeholder
53
37
 
38
+ Placeholder in empty text fields
54
39
 
55
40
  - Type: `string`
56
41
  - Default: `-`
57
42
 
58
- #### placeholder
59
-
43
+ ##### value
60
44
 
45
+ The initial value, if any
61
46
 
62
47
  - Type: `string`
63
48
  - Default: `-`
64
49
 
65
- #### range
66
-
67
-
68
-
69
- - Type: `HTMLInputElement`
70
- - Default: `-`
71
-
72
- #### shadowRootOptions
73
-
74
-
75
-
76
- - Type: `object`
77
- - Default: `{ ...LitElement.shadowRootOptions, delegatesFocus: true, }`
78
-
79
- #### textFieldDisplayValue
80
-
81
- Value to display in the textfield (shows boundary when focused on empty value)
82
-
83
- - Type: `unknown`
84
- - Default: `-`
85
-
86
- #### textfield
50
+ #### Events
87
51
 
52
+ ##### slidervalidity
88
53
 
54
+ Internal event used by (and stopped by) `w-slider`.
89
55
 
90
- - Type: `WarpTextField`
91
- - Default: `-`
92
-
93
- #### tooltipDisplayValue
94
-
95
- Value to display in the tooltip
96
-
97
- - Type: `string \| number`
98
- - Default: `-`
56
+ - Type: `CustomEvent`
57
+ ##### thumbreset
99
58
 
100
- #### tooltipTarget
59
+ Internal event used by (and stopped by) `w-slider`.
101
60
 
61
+ - Type: `CustomEvent`
102
62
 
103
63
 
104
- - Type: `HTMLOutputElement`
105
- - Default: `-`
106
-
107
- #### value
108
-
109
-
110
-
111
- - Type: `string`
112
- - Default: `-`
113
-
114
- ### Types
115
-
116
- No types documented.
@@ -4,127 +4,72 @@
4
4
 
5
5
  Component to place inside a `<w-slider>`.
6
6
 
7
- [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/forms-slider-and-range-slider--docs)
8
-
9
7
  ## Usage
10
8
 
11
9
  ## Accessibility
12
10
 
13
11
  ## Examples
14
12
 
15
- ## API Documentation
13
+ ### `<w-slider-thumb>` API
16
14
 
17
- ### Properties
15
+ #### Properties
18
16
 
19
17
  | Name | Type | Default | Summary |
20
18
  |-|-|-|-|
21
- | ariaDescription | `string` | `-` | - |
22
- | ariaDescriptionText | `unknown` | `-` | - |
23
- | ariaLabel | `string` | `-` | - |
24
- | boundaryValue | `string` | `-` | - |
25
- | name | `string` | `-` | - |
26
- | placeholder | `string` | `-` | - |
27
- | range | `HTMLInputElement` | `-` | - |
28
- | shadowRootOptions | `object` | `{ ...LitElement.shadowRootOptions, delegatesFocus: true, }` | - |
29
- | textFieldDisplayValue | `unknown` | `-` | Value to display in the textfield (shows boundary when focused on empty value) |
30
- | textfield | `WarpTextField` | `-` | - |
31
- | tooltipDisplayValue | `string \| number` | `-` | Value to display in the tooltip |
32
- | tooltipTarget | `HTMLOutputElement` | `-` | - |
33
- | value | `string` | `-` | - |
34
-
35
- ### Property Details
19
+ | aria-description | `string` | `-` | Contextual information for assistive technology, should it be needed |
20
+ | aria-label | `string` | ``label` from `w-slider`` | Label for the range input. |
21
+ | name | `string` | `-` | The name of this input field in the form. The canonical source of the value is the text field. |
22
+ | placeholder | `string` | `-` | Placeholder in empty text fields |
23
+ | value | `string` | `-` | The initial value, if any |
36
24
 
37
- #### ariaDescription
25
+ #### Property Details
38
26
 
27
+ ##### aria-description
39
28
 
29
+ Contextual information for assistive technology, should it be needed
40
30
 
41
31
  - Type: `string`
42
32
  - Default: `-`
43
33
 
44
- #### ariaDescriptionText
45
-
46
-
47
-
48
- - Type: `unknown`
49
- - Default: `-`
50
-
51
- #### ariaLabel
52
-
34
+ ##### aria-label
53
35
 
36
+ Label for the range input.
54
37
 
55
38
  - Type: `string`
56
- - Default: `-`
57
-
58
- #### boundaryValue
39
+ - Default: ``label` from `w-slider``
59
40
 
41
+ ##### name
60
42
 
43
+ The name of this input field in the form. The canonical source of the value is the text field.
61
44
 
62
45
  - Type: `string`
63
46
  - Default: `-`
64
47
 
65
- #### name
66
-
48
+ ##### placeholder
67
49
 
50
+ Placeholder in empty text fields
68
51
 
69
52
  - Type: `string`
70
53
  - Default: `-`
71
54
 
72
- #### placeholder
73
-
55
+ ##### value
74
56
 
57
+ The initial value, if any
75
58
 
76
59
  - Type: `string`
77
60
  - Default: `-`
78
61
 
79
- #### range
80
-
81
-
82
-
83
- - Type: `HTMLInputElement`
84
- - Default: `-`
85
-
86
- #### shadowRootOptions
87
-
62
+ #### Events
88
63
 
64
+ ##### slidervalidity
89
65
 
90
- - Type: `object`
91
- - Default: `{ ...LitElement.shadowRootOptions, delegatesFocus: true, }`
66
+ Internal event used by (and stopped by) `w-slider`.
92
67
 
93
- #### textFieldDisplayValue
68
+ - Type: `CustomEvent`
69
+ ##### thumbreset
94
70
 
95
- Value to display in the textfield (shows boundary when focused on empty value)
96
-
97
- - Type: `unknown`
98
- - Default: `-`
71
+ Internal event used by (and stopped by) `w-slider`.
99
72
 
100
- #### textfield
101
-
102
-
103
-
104
- - Type: `WarpTextField`
105
- - Default: `-`
106
-
107
- #### tooltipDisplayValue
108
-
109
- Value to display in the tooltip
110
-
111
- - Type: `string \| number`
112
- - Default: `-`
113
-
114
- #### tooltipTarget
115
-
116
-
117
-
118
- - Type: `HTMLOutputElement`
119
- - Default: `-`
120
-
121
- #### value
122
-
123
-
124
-
125
- - Type: `string`
126
- - Default: `-`
73
+ - Type: `CustomEvent`
127
74
 
128
- ### Types
129
75
 
130
- No types documented.
@@ -1,4 +1,6 @@
1
- ## API Documentation
1
+ ## `<w-step>` API
2
+
3
+ Unless otherwise noted all properties are HTML attributes (as opposed to JavaScript object properties).
2
4
 
3
5
  ### Properties
4
6
 
@@ -23,6 +25,3 @@
23
25
  - Type: `boolean`
24
26
  - Default: `false`
25
27
 
26
- ### Types
27
-
28
- No types documented.
@@ -10,7 +10,9 @@ Individual step component that shows a single step in a process
10
10
 
11
11
  ## Examples
12
12
 
13
- ## API Documentation
13
+ ## `<w-step>` API
14
+
15
+ Unless otherwise noted all properties are HTML attributes (as opposed to JavaScript object properties).
14
16
 
15
17
  ### Properties
16
18
 
@@ -35,6 +37,3 @@ Individual step component that shows a single step in a process
35
37
  - Type: `boolean`
36
38
  - Default: `false`
37
39
 
38
- ### Types
39
-
40
- No types documented.
@@ -1,4 +1,6 @@
1
- ## API Documentation
1
+ ## `<w-step-indicator>` API
2
+
3
+ Unless otherwise noted all properties are HTML attributes (as opposed to JavaScript object properties).
2
4
 
3
5
  ### Properties
4
6
 
@@ -23,6 +25,3 @@
23
25
  - Type: `boolean`
24
26
  - Default: `false`
25
27
 
26
- ### Types
27
-
28
- No types documented.
@@ -12,7 +12,9 @@ Steps are used to show progress through a process or to guide users through a mu
12
12
 
13
13
  ## Examples
14
14
 
15
- ## API Documentation
15
+ ## `<w-step-indicator>` API
16
+
17
+ Unless otherwise noted all properties are HTML attributes (as opposed to JavaScript object properties).
16
18
 
17
19
  ### Properties
18
20
 
@@ -37,6 +39,3 @@ Steps are used to show progress through a process or to guide users through a mu
37
39
  - Type: `boolean`
38
40
  - Default: `false`
39
41
 
40
- ### Types
41
-
42
- No types documented.
@@ -1,4 +1,6 @@
1
- ## API Documentation
1
+ ## `<w-switch>` API
2
+
3
+ Unless otherwise noted all properties are HTML attributes (as opposed to JavaScript object properties).
2
4
 
3
5
  ### Properties
4
6
 
@@ -7,7 +9,7 @@
7
9
  | checked | `boolean` | `false` | - |
8
10
  | disabled | `boolean` | `false` | - |
9
11
  | name | `string` | `-` | - |
10
- | shadowRootOptions | `object` | `{ ...LitElement.shadowRootOptions, delegatesFocus: true, }` | - |
12
+ | shadowRootOptions (JS only) | `object` | `{ ...LitElement.shadowRootOptions, delegatesFocus: true, }` | - |
11
13
  | value | `string` | `-` | - |
12
14
 
13
15
  ### Property Details
@@ -33,7 +35,7 @@
33
35
  - Type: `string`
34
36
  - Default: `-`
35
37
 
36
- #### shadowRootOptions
38
+ #### shadowRootOptions (JS only)
37
39
 
38
40
 
39
41
 
@@ -47,6 +49,12 @@
47
49
  - Type: `string`
48
50
  - Default: `-`
49
51
 
50
- ### Types
52
+ ### Events
53
+
54
+ #### change
55
+
56
+
57
+
58
+ - Type: `CustomEvent`
59
+
51
60
 
52
- No types documented.
@@ -10,7 +10,9 @@
10
10
 
11
11
  ## Examples
12
12
 
13
- ## API Documentation
13
+ ## `<w-switch>` API
14
+
15
+ Unless otherwise noted all properties are HTML attributes (as opposed to JavaScript object properties).
14
16
 
15
17
  ### Properties
16
18
 
@@ -19,7 +21,7 @@
19
21
  | checked | `boolean` | `false` | - |
20
22
  | disabled | `boolean` | `false` | - |
21
23
  | name | `string` | `-` | - |
22
- | shadowRootOptions | `object` | `{ ...LitElement.shadowRootOptions, delegatesFocus: true, }` | - |
24
+ | shadowRootOptions (JS only) | `object` | `{ ...LitElement.shadowRootOptions, delegatesFocus: true, }` | - |
23
25
  | value | `string` | `-` | - |
24
26
 
25
27
  ### Property Details
@@ -45,7 +47,7 @@
45
47
  - Type: `string`
46
48
  - Default: `-`
47
49
 
48
- #### shadowRootOptions
50
+ #### shadowRootOptions (JS only)
49
51
 
50
52
 
51
53
 
@@ -59,6 +61,12 @@
59
61
  - Type: `string`
60
62
  - Default: `-`
61
63
 
62
- ### Types
64
+ ### Events
65
+
66
+ #### change
67
+
68
+
69
+
70
+ - Type: `CustomEvent`
71
+
63
72
 
64
- No types documented.
@@ -1,78 +1,25 @@
1
- ## API Documentation
1
+ ### `<w-tab>` API
2
2
 
3
- ### Properties
3
+ #### Properties
4
4
 
5
5
  | Name | Type | Default | Summary |
6
6
  |-|-|-|-|
7
- | _computedAriaSelected | `'true' \| 'false' \| undefined` | `-` | Computed aria-selected: prefers parent-managed, falls back to own property |
8
- | active | `boolean` | `false` | **Deprecated**: Use `aria-selected="true"` instead |
9
- | ariaSelected | `'true' \| 'false'` | `-` | - |
10
- | for | `string` | `-` | - |
11
- | id | `string` | `-` | - |
12
- | over | `boolean` | `false` | - |
13
- | shadowRootOptions | `object` | `{ ...LitElement.shadowRootOptions, delegatesFocus: true, }` | - |
14
- | tabIndex | `number` | `-` | Override tabIndex setter to set _parentTabIndex (for backwards compatibility). |
7
+ | for | `string` | `-` | The `id` of the `<w-tab-panel>` this tab controls. |
8
+ | over | `boolean` | `false` | Whether to show the `icon` slot over the tab title instead of inline. |
15
9
 
16
- ### Property Details
17
-
18
- #### _computedAriaSelected
19
-
20
- Computed aria-selected: prefers parent-managed, falls back to own property
21
-
22
- - Type: `'true' \| 'false' \| undefined`
23
- - Default: `-`
24
-
25
- #### active
26
-
27
- **Deprecated**: Use `aria-selected="true"` instead
28
-
29
-
30
-
31
- - Type: `boolean`
32
- - Default: `false`
33
-
34
- #### ariaSelected
35
-
36
-
37
-
38
- - Type: `'true' \| 'false'`
39
- - Default: `-`
40
-
41
- #### for
10
+ #### Property Details
42
11
 
12
+ ##### for
43
13
 
14
+ The `id` of the `<w-tab-panel>` this tab controls.
44
15
 
45
16
  - Type: `string`
46
17
  - Default: `-`
47
18
 
48
- #### id
49
-
50
-
51
-
52
- - Type: `string`
53
- - Default: `-`
54
-
55
- #### over
56
-
19
+ ##### over
57
20
 
21
+ Whether to show the `icon` slot over the tab title instead of inline.
58
22
 
59
23
  - Type: `boolean`
60
24
  - Default: `false`
61
25
 
62
- #### shadowRootOptions
63
-
64
-
65
-
66
- - Type: `object`
67
- - Default: `{ ...LitElement.shadowRootOptions, delegatesFocus: true, }`
68
-
69
- #### tabIndex
70
-
71
- Override tabIndex setter to set _parentTabIndex (for backwards compatibility).
72
-
73
- - Type: `number`
74
- - Default: `-`
75
-
76
- ### Types
77
-
78
- No types documented.
@@ -4,89 +4,28 @@
4
4
 
5
5
  Individual tab component used within w-tabs container.
6
6
 
7
- [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/tabs--docs)
7
+ ### `<w-tab>` API
8
8
 
9
- ## Usage
10
-
11
- ## Accessibility
12
-
13
- ## Examples
14
-
15
- ## API Documentation
16
-
17
- ### Properties
9
+ #### Properties
18
10
 
19
11
  | Name | Type | Default | Summary |
20
12
  |-|-|-|-|
21
- | _computedAriaSelected | `'true' \| 'false' \| undefined` | `-` | Computed aria-selected: prefers parent-managed, falls back to own property |
22
- | active | `boolean` | `false` | **Deprecated**: Use `aria-selected="true"` instead |
23
- | ariaSelected | `'true' \| 'false'` | `-` | - |
24
- | for | `string` | `-` | - |
25
- | id | `string` | `-` | - |
26
- | over | `boolean` | `false` | - |
27
- | shadowRootOptions | `object` | `{ ...LitElement.shadowRootOptions, delegatesFocus: true, }` | - |
28
- | tabIndex | `number` | `-` | Override tabIndex setter to set _parentTabIndex (for backwards compatibility). |
29
-
30
- ### Property Details
31
-
32
- #### _computedAriaSelected
33
-
34
- Computed aria-selected: prefers parent-managed, falls back to own property
35
-
36
- - Type: `'true' \| 'false' \| undefined`
37
- - Default: `-`
38
-
39
- #### active
13
+ | for | `string` | `-` | The `id` of the `<w-tab-panel>` this tab controls. |
14
+ | over | `boolean` | `false` | Whether to show the `icon` slot over the tab title instead of inline. |
40
15
 
41
- **Deprecated**: Use `aria-selected="true"` instead
42
-
43
-
44
-
45
- - Type: `boolean`
46
- - Default: `false`
47
-
48
- #### ariaSelected
49
-
50
-
51
-
52
- - Type: `'true' \| 'false'`
53
- - Default: `-`
54
-
55
- #### for
16
+ #### Property Details
56
17
 
18
+ ##### for
57
19
 
20
+ The `id` of the `<w-tab-panel>` this tab controls.
58
21
 
59
22
  - Type: `string`
60
23
  - Default: `-`
61
24
 
62
- #### id
63
-
64
-
65
-
66
- - Type: `string`
67
- - Default: `-`
68
-
69
- #### over
70
-
25
+ ##### over
71
26
 
27
+ Whether to show the `icon` slot over the tab title instead of inline.
72
28
 
73
29
  - Type: `boolean`
74
30
  - Default: `false`
75
31
 
76
- #### shadowRootOptions
77
-
78
-
79
-
80
- - Type: `object`
81
- - Default: `{ ...LitElement.shadowRootOptions, delegatesFocus: true, }`
82
-
83
- #### tabIndex
84
-
85
- Override tabIndex setter to set _parentTabIndex (for backwards compatibility).
86
-
87
- - Type: `number`
88
- - Default: `-`
89
-
90
- ### Types
91
-
92
- No types documented.
@@ -1,21 +1,17 @@
1
- ## API Documentation
1
+ ### `<w-tab-panel>` API
2
2
 
3
- ### Properties
3
+ #### Properties
4
4
 
5
5
  | Name | Type | Default | Summary |
6
6
  |-|-|-|-|
7
- | active | `boolean` | `-` | Whether this panel is active (visible). |
7
+ | id | `string` | `-` | Required so `<w-tab>` has something to target. |
8
8
 
9
- ### Property Details
9
+ #### Property Details
10
10
 
11
- #### active
11
+ ##### id
12
12
 
13
- Whether this panel is active (visible).
14
- Set by parent w-tabs via the _parentActive property.
13
+ Required so `<w-tab>` has something to target.
15
14
 
16
- - Type: `boolean`
15
+ - Type: `string`
17
16
  - Default: `-`
18
17
 
19
- ### Types
20
-
21
- No types documented.
@@ -5,32 +5,20 @@
5
5
  Tab panel component that holds content for individual tabs.
6
6
  Each tab panel should have a name that matches a corresponding tab.
7
7
 
8
- [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/tabs--docs)
8
+ ### `<w-tab-panel>` API
9
9
 
10
- ## Usage
11
-
12
- ## Accessibility
13
-
14
- ## Examples
15
-
16
- ## API Documentation
17
-
18
- ### Properties
10
+ #### Properties
19
11
 
20
12
  | Name | Type | Default | Summary |
21
13
  |-|-|-|-|
22
- | active | `boolean` | `-` | Whether this panel is active (visible). |
14
+ | id | `string` | `-` | Required so `<w-tab>` has something to target. |
23
15
 
24
- ### Property Details
16
+ #### Property Details
25
17
 
26
- #### active
18
+ ##### id
27
19
 
28
- Whether this panel is active (visible).
29
- Set by parent w-tabs via the _parentActive property.
20
+ Required so `<w-tab>` has something to target.
30
21
 
31
- - Type: `boolean`
22
+ - Type: `string`
32
23
  - Default: `-`
33
24
 
34
- ### Types
35
-
36
- No types documented.