@warp-ds/elements 2.2.0-next.20 → 2.2.0-next.21

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 (238) hide show
  1. package/dist/api.js.map +1 -1
  2. package/dist/custom-elements.json +1219 -1078
  3. package/dist/index.d.ts +194 -173
  4. package/dist/packages/affix/affix.react.stories.d.ts +9 -0
  5. package/dist/packages/affix/affix.react.stories.js +10 -0
  6. package/dist/packages/affix/affix.stories.js +1 -1
  7. package/dist/packages/affix/index.js +1 -1
  8. package/dist/packages/affix/index.js.map +4 -4
  9. package/dist/packages/affix/react.d.ts +1 -1
  10. package/dist/packages/affix/react.js +10 -3
  11. package/dist/packages/alert/alert.react.stories.d.ts +13 -0
  12. package/dist/packages/alert/alert.react.stories.js +44 -0
  13. package/dist/packages/alert/alert.stories.js +1 -1
  14. package/dist/packages/alert/alert.test.js +3 -1
  15. package/dist/packages/alert/index.d.ts +1 -1
  16. package/dist/packages/alert/index.js +1 -1
  17. package/dist/packages/alert/index.js.map +4 -4
  18. package/dist/packages/alert/react.d.ts +1 -1
  19. package/dist/packages/alert/react.js +6 -3
  20. package/dist/packages/attention/attention.react.stories.d.ts +15 -0
  21. package/dist/packages/attention/attention.react.stories.js +92 -0
  22. package/dist/packages/attention/attention.stories.js +17 -32
  23. package/dist/packages/attention/attention.test.js +1 -1
  24. package/dist/packages/attention/index.d.ts +3 -2
  25. package/dist/packages/attention/index.js +238 -17
  26. package/dist/packages/attention/index.js.map +4 -4
  27. package/dist/packages/attention/react.d.ts +15 -1
  28. package/dist/packages/attention/react.js +13 -5
  29. package/dist/packages/badge/badge.react.stories.d.ts +18 -0
  30. package/dist/packages/badge/badge.react.stories.js +60 -0
  31. package/dist/packages/badge/badge.stories.js +1 -1
  32. package/dist/packages/badge/index.js +1 -1
  33. package/dist/packages/badge/index.js.map +4 -4
  34. package/dist/packages/badge/react.d.ts +1 -1
  35. package/dist/packages/badge/react.js +6 -3
  36. package/dist/packages/box/box.react.stories.d.ts +15 -0
  37. package/dist/packages/box/box.react.stories.js +45 -0
  38. package/dist/packages/box/box.stories.js +1 -1
  39. package/dist/packages/box/index.js +3 -3
  40. package/dist/packages/box/index.js.map +4 -4
  41. package/dist/packages/box/react.d.ts +1 -1
  42. package/dist/packages/box/react.js +6 -3
  43. package/dist/packages/breadcrumbs/breadcrumbs.react.stories.d.ts +13 -0
  44. package/dist/packages/breadcrumbs/breadcrumbs.react.stories.js +40 -0
  45. package/dist/packages/breadcrumbs/breadcrumbs.stories.js +1 -1
  46. package/dist/packages/breadcrumbs/index.js +6 -6
  47. package/dist/packages/breadcrumbs/index.js.map +4 -4
  48. package/dist/packages/breadcrumbs/react.d.ts +1 -1
  49. package/dist/packages/breadcrumbs/react.js +6 -3
  50. package/dist/packages/button/button.react.stories.d.ts +22 -0
  51. package/dist/packages/button/button.react.stories.js +102 -0
  52. package/dist/packages/button/button.stories.js +1 -1
  53. package/dist/packages/button/index.js +2 -2
  54. package/dist/packages/button/index.js.map +4 -4
  55. package/dist/packages/button/react.d.ts +1 -1
  56. package/dist/packages/button/react.js +6 -3
  57. package/dist/packages/card/card.react.stories.d.ts +16 -0
  58. package/dist/packages/card/card.react.stories.js +63 -0
  59. package/dist/packages/card/card.stories.js +2 -2
  60. package/dist/packages/card/index.d.ts +1 -1
  61. package/dist/packages/card/index.js +2 -2
  62. package/dist/packages/card/index.js.map +4 -4
  63. package/dist/packages/card/react.d.ts +1 -1
  64. package/dist/packages/card/react.js +6 -3
  65. package/dist/packages/combobox/combobox.react.stories.d.ts +28 -0
  66. package/dist/packages/combobox/combobox.react.stories.js +90 -0
  67. package/dist/packages/combobox/combobox.stories.d.ts +5 -1
  68. package/dist/packages/combobox/combobox.stories.js +47 -25
  69. package/dist/packages/combobox/index.d.ts +1 -1
  70. package/dist/packages/combobox/index.js +4 -4
  71. package/dist/packages/combobox/index.js.map +4 -4
  72. package/dist/packages/combobox/react.d.ts +7 -0
  73. package/dist/packages/combobox/react.js +17 -0
  74. package/dist/packages/datepicker/DatePicker.test.d.ts +1 -0
  75. package/dist/packages/datepicker/DatePicker.test.js +3 -2
  76. package/dist/packages/datepicker/datepicker.d.ts +1 -1
  77. package/dist/packages/datepicker/datepicker.js +105 -105
  78. package/dist/packages/datepicker/datepicker.js.map +4 -4
  79. package/dist/packages/datepicker/datepicker.react.stories.d.ts +18 -0
  80. package/dist/packages/datepicker/datepicker.react.stories.js +26 -0
  81. package/dist/packages/datepicker/datepicker.stories.js +1 -1
  82. package/dist/packages/datepicker/datepicker.test.js +1 -1
  83. package/dist/packages/datepicker/index.js +105 -105
  84. package/dist/packages/datepicker/index.js.map +4 -4
  85. package/dist/packages/datepicker/react.d.ts +5 -2
  86. package/dist/packages/datepicker/react.js +10 -3
  87. package/dist/packages/dead-toggle/dead-toggle.react.stories.d.ts +15 -0
  88. package/dist/packages/dead-toggle/dead-toggle.react.stories.js +34 -0
  89. package/dist/packages/dead-toggle/dead-toggle.stories.d.ts +5 -1
  90. package/dist/packages/dead-toggle/dead-toggle.stories.js +25 -3
  91. package/dist/packages/dead-toggle/index.js +1 -1
  92. package/dist/packages/dead-toggle/index.js.map +2 -2
  93. package/dist/packages/dead-toggle/react.d.ts +1 -1
  94. package/dist/packages/dead-toggle/react.js +6 -3
  95. package/dist/packages/expandable/expandable.react.stories.d.ts +18 -0
  96. package/dist/packages/expandable/expandable.react.stories.js +103 -0
  97. package/dist/packages/expandable/expandable.stories.js +1 -1
  98. package/dist/packages/expandable/index.js +2 -2
  99. package/dist/packages/expandable/index.js.map +4 -4
  100. package/dist/packages/expandable/react.d.ts +1 -1
  101. package/dist/packages/expandable/react.js +6 -3
  102. package/dist/packages/i18n.js +2 -1
  103. package/dist/packages/link/index.js +1 -1
  104. package/dist/packages/link/index.js.map +4 -4
  105. package/dist/packages/link/link.react.stories.d.ts +21 -0
  106. package/dist/packages/link/link.react.stories.js +96 -0
  107. package/dist/packages/link/link.stories.js +1 -12
  108. package/dist/packages/link/link.test.js +1 -1
  109. package/dist/packages/link/react.d.ts +1 -1
  110. package/dist/packages/link/react.js +6 -3
  111. package/dist/packages/modal/index.js +8 -8
  112. package/dist/packages/modal/index.js.map +4 -4
  113. package/dist/packages/modal/modal-footer.js +3 -3
  114. package/dist/packages/modal/modal-footer.js.map +3 -3
  115. package/dist/packages/modal/modal-header.js +4 -4
  116. package/dist/packages/modal/modal-header.js.map +4 -4
  117. package/dist/packages/modal/modal-main.js.map +1 -1
  118. package/dist/packages/modal/modal.react.stories.d.ts +14 -0
  119. package/dist/packages/modal/modal.react.stories.js +27 -0
  120. package/dist/packages/modal/modal.stories.d.ts +1 -1
  121. package/dist/packages/modal/modal.stories.js +1 -1
  122. package/dist/packages/modal/react.d.ts +11 -3
  123. package/dist/packages/modal/react.js +19 -6
  124. package/dist/packages/pageindicator/pageindicator.react.stories.d.ts +19 -0
  125. package/dist/packages/pageindicator/pageindicator.react.stories.js +20 -0
  126. package/dist/packages/pageindicator/pageindicator.stories.d.ts +1 -1
  127. package/dist/packages/pageindicator/pageindicator.stories.js +1 -1
  128. package/dist/packages/pageindicator/react.d.ts +1 -1
  129. package/dist/packages/pageindicator/react.js +6 -3
  130. package/dist/packages/pagination/index.js +9 -3
  131. package/dist/packages/pagination/index.js.map +3 -3
  132. package/dist/packages/pagination/pagination.react.stories.d.ts +21 -0
  133. package/dist/packages/pagination/pagination.react.stories.js +45 -0
  134. package/dist/packages/pagination/pagination.stories.js +6 -6
  135. package/dist/packages/pagination/pagination.test.js +1 -1
  136. package/dist/packages/pagination/react.d.ts +5 -2
  137. package/dist/packages/pagination/react.js +10 -3
  138. package/dist/packages/pill/index.js.map +2 -2
  139. package/dist/packages/pill/pill.react.stories.d.ts +23 -0
  140. package/dist/packages/pill/pill.react.stories.js +22 -0
  141. package/dist/packages/pill/pill.stories.js +1 -1
  142. package/dist/packages/pill/pill.test.js +3 -1
  143. package/dist/packages/pill/react.d.ts +7 -0
  144. package/dist/packages/pill/react.js +17 -0
  145. package/dist/packages/rip-and-tear-checkbox/checkbox.js +5 -5
  146. package/dist/packages/rip-and-tear-checkbox/checkbox.js.map +3 -3
  147. package/dist/packages/rip-and-tear-checkbox/checkbox.stories.d.ts +8 -0
  148. package/dist/packages/rip-and-tear-checkbox/checkbox.stories.js +11 -0
  149. package/dist/packages/rip-and-tear-checkbox/index.js +5 -5
  150. package/dist/packages/rip-and-tear-checkbox/index.js.map +3 -3
  151. package/dist/packages/rip-and-tear-checkbox/react.d.ts +5 -0
  152. package/dist/packages/rip-and-tear-checkbox/react.js +15 -0
  153. package/dist/packages/rip-and-tear-checkbox/rip-and-tear-checkbox.react.stories.d.ts +12 -0
  154. package/dist/packages/rip-and-tear-checkbox/rip-and-tear-checkbox.react.stories.js +10 -0
  155. package/dist/packages/rip-and-tear-radio/index.js +8 -8
  156. package/dist/packages/rip-and-tear-radio/index.js.map +3 -3
  157. package/dist/packages/rip-and-tear-radio/radio-group.js +8 -8
  158. package/dist/packages/rip-and-tear-radio/radio-group.js.map +3 -3
  159. package/dist/packages/rip-and-tear-radio/radio.js.map +2 -2
  160. package/dist/packages/rip-and-tear-radio/radio.stories.js +9 -9
  161. package/dist/packages/rip-and-tear-radio/radio.stories.js.map +3 -3
  162. package/dist/packages/rip-and-tear-radio/react.d.ts +9 -0
  163. package/dist/packages/rip-and-tear-radio/react.js +22 -0
  164. package/dist/packages/rip-and-tear-radio/rip-and-tear-radio.react.stories.d.ts +9 -0
  165. package/dist/packages/rip-and-tear-radio/rip-and-tear-radio.react.stories.js +10 -0
  166. package/dist/packages/rip-and-tear-radio/slot.js +3 -3
  167. package/dist/packages/select/index.d.ts +4 -4
  168. package/dist/packages/select/index.js +12 -12
  169. package/dist/packages/select/index.js.map +3 -3
  170. package/dist/packages/select/react.d.ts +6 -2
  171. package/dist/packages/select/react.js +15 -3
  172. package/dist/packages/select/select.react.stories.d.ts +18 -0
  173. package/dist/packages/select/select.react.stories.js +28 -0
  174. package/dist/packages/select/select.stories.js +2 -2
  175. package/dist/packages/select/select.test.js +1 -1
  176. package/dist/packages/slider/Slider.js +1 -1
  177. package/dist/packages/slider/SliderThumb.js +1 -1
  178. package/dist/packages/slider/index.js +6 -6
  179. package/dist/packages/slider/index.js.map +4 -4
  180. package/dist/packages/slider/react.d.ts +8 -0
  181. package/dist/packages/slider/react.js +20 -0
  182. package/dist/packages/slider/slider-thumb.js +2 -2
  183. package/dist/packages/slider/slider-thumb.js.map +4 -4
  184. package/dist/packages/slider/slider.js +2 -2
  185. package/dist/packages/slider/slider.js.map +4 -4
  186. package/dist/packages/slider/slider.react.stories.d.ts +18 -0
  187. package/dist/packages/slider/slider.react.stories.js +119 -0
  188. package/dist/packages/slider/slider.stories.js +2 -2
  189. package/dist/packages/slider/slider.test.js +1 -1
  190. package/dist/packages/steps/index.js +2 -2
  191. package/dist/packages/steps/index.js.map +4 -4
  192. package/dist/packages/steps/react.d.ts +1 -1
  193. package/dist/packages/steps/react.js +7 -4
  194. package/dist/packages/steps/steps.react.stories.d.ts +15 -0
  195. package/dist/packages/steps/steps.react.stories.js +112 -0
  196. package/dist/packages/switch/index.js +1 -1
  197. package/dist/packages/switch/index.js.map +4 -4
  198. package/dist/packages/switch/react.d.ts +5 -2
  199. package/dist/packages/switch/react.js +10 -3
  200. package/dist/packages/switch/switch.react.stories.d.ts +15 -0
  201. package/dist/packages/switch/switch.react.stories.js +29 -0
  202. package/dist/packages/tabs/index.d.ts +1 -1
  203. package/dist/packages/tabs/index.js +12 -12
  204. package/dist/packages/tabs/index.js.map +4 -4
  205. package/dist/packages/tabs/react.d.ts +11 -3
  206. package/dist/packages/tabs/react.js +18 -5
  207. package/dist/packages/tabs/tab-panel.js.map +2 -2
  208. package/dist/packages/tabs/tab.js +1 -1
  209. package/dist/packages/tabs/tab.js.map +4 -4
  210. package/dist/packages/tabs/tabs.d.ts +2 -0
  211. package/dist/packages/tabs/tabs.js +4 -4
  212. package/dist/packages/tabs/tabs.js.map +4 -4
  213. package/dist/packages/tabs/tabs.react.stories.d.ts +15 -0
  214. package/dist/packages/tabs/tabs.react.stories.js +51 -0
  215. package/dist/packages/tabs/tabs.stories.js +12 -12
  216. package/dist/packages/tabs/tabs.stories.js.map +4 -4
  217. package/dist/packages/textfield/index.js +1 -1
  218. package/dist/packages/textfield/index.js.map +4 -4
  219. package/dist/packages/textfield/react.d.ts +11 -2
  220. package/dist/packages/textfield/react.js +16 -3
  221. package/dist/packages/textfield/textfield.react.stories.d.ts +37 -0
  222. package/dist/packages/textfield/textfield.react.stories.js +88 -0
  223. package/dist/packages/textfield/textfield.stories.js +1 -1
  224. package/dist/packages/textfield/textfield.test.js +1 -1
  225. package/dist/packages/toast/api.d.ts +1 -1
  226. package/dist/packages/toast/index.d.ts +1 -1
  227. package/dist/packages/toast/index.js +14 -14
  228. package/dist/packages/toast/index.js.map +4 -4
  229. package/dist/packages/toast/toast-container.d.ts +1 -1
  230. package/dist/packages/toast/toast-container.js +2454 -149
  231. package/dist/packages/toast/toast-container.js.map +7 -0
  232. package/dist/packages/toast/toast.js +2459 -193
  233. package/dist/packages/toast/toast.js.map +7 -0
  234. package/dist/packages/toast/toast.stories.js +1 -1
  235. package/dist/packages/utils/expand-transition.js +1 -1
  236. package/dist/vscode.html-custom-data.json +90 -85
  237. package/dist/web-types.json +147 -139
  238. package/package.json +22 -21
package/dist/index.d.ts CHANGED
@@ -1,12 +1,12 @@
1
1
 
2
- import type { ccSuffix, ccPrefix, WarpAffix } from "./packages/affix/index.ts";
3
2
  import type { WarpAlert } from "./packages/alert/index.ts";
3
+ import type { ccSuffix, ccPrefix, WarpAffix } from "./packages/affix/index.ts";
4
+ import type { WarpLink } from "./packages/link/index.ts";
5
+ import type { ccButton, WarpButton } from "./packages/button/index.ts";
4
6
  import type { ccAttention, WarpAttention } from "./packages/attention/index.ts";
5
7
  import type { WarpBadge } from "./packages/badge/index.ts";
6
8
  import type { WarpBox } from "./packages/box/index.ts";
7
9
  import type { ccBreadcrumbs, WarpBreadcrumbs } from "./packages/breadcrumbs/index.ts";
8
- import type { WarpLink } from "./packages/link/index.ts";
9
- import type { ccButton, WarpButton } from "./packages/button/index.ts";
10
10
  import type { ccCard, WarpCard } from "./packages/card/index.ts";
11
11
  import type { ccCombobox, WarpCombobox } from "./packages/combobox/index.ts";
12
12
  import type { WarpDatepicker } from "./packages/datepicker/datepicker.ts";
@@ -27,9 +27,10 @@ import type { WarpSliderThumb } from "./packages/slider/slider-thumb.ts";
27
27
  import type { WarpSlider } from "./packages/slider/slider.ts";
28
28
  import type { WarpSteps, WarpStep } from "./packages/steps/index.ts";
29
29
  import type { WarpSwitch } from "./packages/switch/index.ts";
30
- import type { WarpTabs } from "./packages/tabs/tabs.ts";
31
30
  import type { WarpTab } from "./packages/tabs/tab.ts";
32
31
  import type { WarpTabPanel } from "./packages/tabs/tab-panel.ts";
32
+ import type { WarpTabs } from "./packages/tabs/tabs.ts";
33
+ import type { WarpToastContainer } from "./packages/toast/toast-container.ts";
33
34
 
34
35
  /**
35
36
  * This type can be used to create scoped tags for your components.
@@ -110,6 +111,18 @@ type BaseEvents = {
110
111
 
111
112
 
112
113
 
114
+ export type WarpAlertProps = {
115
+ /** */
116
+ "variant"?: WarpAlert['variant'];
117
+ /** */
118
+ "show"?: WarpAlert['show'];
119
+ /** */
120
+ "role"?: WarpAlert['role'];
121
+
122
+
123
+ }
124
+
125
+
113
126
  export type WarpAffixProps = {
114
127
  /** */
115
128
  "aria-label"?: WarpAffix['ariaLabel'];
@@ -130,13 +143,73 @@ Set an `aria-label` that explains the action when using this. */
130
143
  }
131
144
 
132
145
 
133
- export type WarpAlertProps = {
146
+ export type WarpLinkProps = {
134
147
  /** */
135
- "variant"?: WarpAlert['variant'];
148
+ "autofocus"?: WarpLink['autofocus'];
136
149
  /** */
137
- "show"?: WarpAlert['show'];
150
+ "variant"?: WarpLink['variant'];
138
151
  /** */
139
- "role"?: WarpAlert['role'];
152
+ "quiet"?: WarpLink['quiet'];
153
+ /** */
154
+ "small"?: WarpLink['small'];
155
+ /** */
156
+ "href"?: WarpLink['href'];
157
+ /** */
158
+ "disabled"?: WarpLink['disabled'];
159
+ /** */
160
+ "target"?: WarpLink['target'];
161
+ /** */
162
+ "rel"?: WarpLink['rel'];
163
+ /** */
164
+ "full-width"?: WarpLink['fullWidth'];
165
+ /** */
166
+ "fullWidth"?: WarpLink['fullWidth'];
167
+ /** */
168
+ "button-class"?: WarpLink['buttonClass'];
169
+ /** */
170
+ "buttonClass"?: WarpLink['buttonClass'];
171
+ /** */
172
+ "name"?: WarpLink['name'];
173
+ /** */
174
+ "classes"?: WarpLink['classes'];
175
+
176
+
177
+ }
178
+
179
+
180
+ export type WarpButtonProps = {
181
+ /** */
182
+ "type"?: WarpButton['type'];
183
+ /** */
184
+ "autofocus"?: WarpButton['autofocus'];
185
+ /** */
186
+ "variant"?: WarpButton['variant'];
187
+ /** */
188
+ "quiet"?: WarpButton['quiet'];
189
+ /** */
190
+ "small"?: WarpButton['small'];
191
+ /** */
192
+ "loading"?: WarpButton['loading'];
193
+ /** */
194
+ "href"?: WarpButton['href'];
195
+ /** */
196
+ "target"?: WarpButton['target'];
197
+ /** */
198
+ "rel"?: WarpButton['rel'];
199
+ /** */
200
+ "full-width"?: WarpButton['fullWidth'];
201
+ /** */
202
+ "fullWidth"?: WarpButton['fullWidth'];
203
+ /** */
204
+ "button-class"?: WarpButton['buttonClass'];
205
+ /** */
206
+ "buttonClass"?: WarpButton['buttonClass'];
207
+ /** */
208
+ "name"?: WarpButton['name'];
209
+ /** */
210
+ "value"?: WarpButton['value'];
211
+ /** */
212
+ "ariaValueTextLoading"?: WarpButton['ariaValueTextLoading'];
140
213
 
141
214
 
142
215
  }
@@ -222,78 +295,6 @@ export type WarpBreadcrumbsProps = {
222
295
  }
223
296
 
224
297
 
225
- export type WarpLinkProps = {
226
- /** */
227
- "autofocus"?: WarpLink['autofocus'];
228
- /** */
229
- "variant"?: WarpLink['variant'];
230
- /** */
231
- "quiet"?: WarpLink['quiet'];
232
- /** */
233
- "small"?: WarpLink['small'];
234
- /** */
235
- "href"?: WarpLink['href'];
236
- /** */
237
- "disabled"?: WarpLink['disabled'];
238
- /** */
239
- "target"?: WarpLink['target'];
240
- /** */
241
- "rel"?: WarpLink['rel'];
242
- /** */
243
- "full-width"?: WarpLink['fullWidth'];
244
- /** */
245
- "fullWidth"?: WarpLink['fullWidth'];
246
- /** */
247
- "button-class"?: WarpLink['buttonClass'];
248
- /** */
249
- "buttonClass"?: WarpLink['buttonClass'];
250
- /** */
251
- "name"?: WarpLink['name'];
252
- /** */
253
- "classes"?: WarpLink['classes'];
254
-
255
-
256
- }
257
-
258
-
259
- export type WarpButtonProps = {
260
- /** */
261
- "type"?: WarpButton['type'];
262
- /** */
263
- "autofocus"?: WarpButton['autofocus'];
264
- /** */
265
- "variant"?: WarpButton['variant'];
266
- /** */
267
- "quiet"?: WarpButton['quiet'];
268
- /** */
269
- "small"?: WarpButton['small'];
270
- /** */
271
- "loading"?: WarpButton['loading'];
272
- /** */
273
- "href"?: WarpButton['href'];
274
- /** */
275
- "target"?: WarpButton['target'];
276
- /** */
277
- "rel"?: WarpButton['rel'];
278
- /** */
279
- "full-width"?: WarpButton['fullWidth'];
280
- /** */
281
- "fullWidth"?: WarpButton['fullWidth'];
282
- /** */
283
- "button-class"?: WarpButton['buttonClass'];
284
- /** */
285
- "buttonClass"?: WarpButton['buttonClass'];
286
- /** */
287
- "name"?: WarpButton['name'];
288
- /** */
289
- "value"?: WarpButton['value'];
290
- /** */
291
- "ariaValueTextLoading"?: WarpButton['ariaValueTextLoading'];
292
-
293
-
294
- }
295
-
296
-
297
298
  export type WarpCardProps = {
298
299
  /** */
299
300
  "selected"?: WarpCard['selected'];
@@ -707,8 +708,6 @@ export type WarpSelectProps = {
707
708
  /** Renders the field in a readonly state. */
708
709
  "readOnly"?: WarpSelect['readOnly'];
709
710
  /** */
710
- "_options"?: WarpSelect['_options'];
711
- /** */
712
711
  "name"?: WarpSelect['name'];
713
712
  /** */
714
713
  "value"?: WarpSelect['value'];
@@ -873,19 +872,6 @@ export type WarpSwitchProps = {
873
872
  }
874
873
 
875
874
 
876
- export type WarpTabsProps = {
877
- /** */
878
- "active"?: WarpTabs['active'];
879
- /** */
880
- "tab-class"?: WarpTabs['tabClass'];
881
- /** */
882
- "tabClass"?: WarpTabs['tabClass'];
883
-
884
- /** */
885
- "onchange"?: (e: CustomEvent<CustomEvent>) => void;
886
- }
887
-
888
-
889
875
  export type WarpTabProps = {
890
876
  /** */
891
877
  "name"?: WarpTab['name'];
@@ -911,11 +897,48 @@ export type WarpTabPanelProps = {
911
897
  "hidden"?: WarpTabPanel['hidden'];
912
898
 
913
899
 
900
+ }
901
+
902
+
903
+ export type WarpTabsProps = {
904
+ /** */
905
+ "active"?: WarpTabs['active'];
906
+ /** */
907
+ "tab-class"?: WarpTabs['tabClass'];
908
+ /** */
909
+ "tabClass"?: WarpTabs['tabClass'];
910
+
911
+ /** */
912
+ "onchange"?: (e: CustomEvent<CustomEvent>) => void;
913
+ }
914
+
915
+
916
+ export type WarpToastContainerProps = {
917
+
918
+
914
919
  }
915
920
 
916
921
  export type CustomElements = {
917
922
 
918
923
 
924
+ /**
925
+ * Alert is an inline component used for displaying different types of messages.
926
+ *
927
+ * For accessibility reasons, alert should appear close to the element that triggered it.
928
+ *
929
+ * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/feedback-alert--docs)
930
+ *
931
+ * ## Attributes & Properties
932
+ *
933
+ * Component attributes and properties that can be applied to the element or by using JavaScript.
934
+ *
935
+ * - `variant`: undefined
936
+ * - `show`: undefined
937
+ * - `role`: undefined
938
+ */
939
+ "w-alert": Partial<WarpAlertProps & BaseProps<WarpAlert> & BaseEvents>;
940
+
941
+
919
942
  /**
920
943
  * This component is usually used in other components like form elements to show a prefix or suffix. See for example `w-textfield`.
921
944
  *
@@ -938,21 +961,55 @@ export type WarpTabPanelProps = {
938
961
 
939
962
 
940
963
  /**
941
- * Alert is an inline component used for displaying different types of messages.
964
+ * Buttons are used to perform actions, with different visuals for different needs.
942
965
  *
943
- * For accessibility reasons, alert should appear close to the element that triggered it.
966
+ * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/buttons-link--docs)
944
967
  *
945
- * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/feedback-alert--docs)
968
+ * ## Attributes & Properties
969
+ *
970
+ * Component attributes and properties that can be applied to the element or by using JavaScript.
971
+ *
972
+ * - `autofocus`: undefined
973
+ * - `variant`: undefined
974
+ * - `quiet`: undefined
975
+ * - `small`: undefined
976
+ * - `href`: undefined
977
+ * - `disabled`: undefined
978
+ * - `target`: undefined
979
+ * - `rel`: undefined
980
+ * - `full-width`/`fullWidth`: undefined
981
+ * - `button-class`/`buttonClass`: undefined
982
+ * - `name`: undefined
983
+ * - `classes`: undefined (property only)
984
+ */
985
+ "w-link": Partial<WarpLinkProps & BaseProps<WarpLink> & BaseEvents>;
986
+
987
+
988
+ /**
989
+ * Buttons are used to perform actions, widh different visuals for different needs.
990
+ *
991
+ * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/buttons-button--docs)
946
992
  *
947
993
  * ## Attributes & Properties
948
994
  *
949
995
  * Component attributes and properties that can be applied to the element or by using JavaScript.
950
996
  *
997
+ * - `type`: undefined
998
+ * - `autofocus`: undefined
951
999
  * - `variant`: undefined
952
- * - `show`: undefined
953
- * - `role`: undefined
1000
+ * - `quiet`: undefined
1001
+ * - `small`: undefined
1002
+ * - `loading`: undefined
1003
+ * - `href`: undefined
1004
+ * - `target`: undefined
1005
+ * - `rel`: undefined
1006
+ * - `full-width`/`fullWidth`: undefined
1007
+ * - `button-class`/`buttonClass`: undefined
1008
+ * - `name`: undefined
1009
+ * - `value`: undefined
1010
+ * - `ariaValueTextLoading`: undefined (property only)
954
1011
  */
955
- "w-alert": Partial<WarpAlertProps & BaseProps<WarpAlert> & BaseEvents>;
1012
+ "w-button": Partial<WarpButtonProps & BaseProps<WarpButton> & BaseEvents>;
956
1013
 
957
1014
 
958
1015
  /**
@@ -1040,58 +1097,6 @@ export type WarpTabPanelProps = {
1040
1097
  "w-breadcrumbs": Partial<WarpBreadcrumbsProps & BaseProps<WarpBreadcrumbs> & BaseEvents>;
1041
1098
 
1042
1099
 
1043
- /**
1044
- * Buttons are used to perform actions, with different visuals for different needs.
1045
- *
1046
- * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/buttons-link--docs)
1047
- *
1048
- * ## Attributes & Properties
1049
- *
1050
- * Component attributes and properties that can be applied to the element or by using JavaScript.
1051
- *
1052
- * - `autofocus`: undefined
1053
- * - `variant`: undefined
1054
- * - `quiet`: undefined
1055
- * - `small`: undefined
1056
- * - `href`: undefined
1057
- * - `disabled`: undefined
1058
- * - `target`: undefined
1059
- * - `rel`: undefined
1060
- * - `full-width`/`fullWidth`: undefined
1061
- * - `button-class`/`buttonClass`: undefined
1062
- * - `name`: undefined
1063
- * - `classes`: undefined (property only)
1064
- */
1065
- "w-link": Partial<WarpLinkProps & BaseProps<WarpLink> & BaseEvents>;
1066
-
1067
-
1068
- /**
1069
- * Buttons are used to perform actions, widh different visuals for different needs.
1070
- *
1071
- * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/buttons-button--docs)
1072
- *
1073
- * ## Attributes & Properties
1074
- *
1075
- * Component attributes and properties that can be applied to the element or by using JavaScript.
1076
- *
1077
- * - `type`: undefined
1078
- * - `autofocus`: undefined
1079
- * - `variant`: undefined
1080
- * - `quiet`: undefined
1081
- * - `small`: undefined
1082
- * - `loading`: undefined
1083
- * - `href`: undefined
1084
- * - `target`: undefined
1085
- * - `rel`: undefined
1086
- * - `full-width`/`fullWidth`: undefined
1087
- * - `button-class`/`buttonClass`: undefined
1088
- * - `name`: undefined
1089
- * - `value`: undefined
1090
- * - `ariaValueTextLoading`: undefined (property only)
1091
- */
1092
- "w-button": Partial<WarpButtonProps & BaseProps<WarpButton> & BaseEvents>;
1093
-
1094
-
1095
1100
  /**
1096
1101
  * Card is a layout component used for separating content areas on a page.
1097
1102
  *
@@ -1528,7 +1533,6 @@ export type WarpTabPanelProps = {
1528
1533
  * - `optional`: Whether to show optional text
1529
1534
  * - `disabled`: Renders the field in a disabled state.
1530
1535
  * - `read-only`/`readOnly`: Renders the field in a readonly state.
1531
- * - `_options`: undefined
1532
1536
  * - `name`: undefined
1533
1537
  * - `value`: undefined
1534
1538
  *
@@ -1717,7 +1721,7 @@ export type WarpTabPanelProps = {
1717
1721
 
1718
1722
 
1719
1723
  /**
1720
- * Tabs are used to organize content by grouping similar information on the same page.
1724
+ * Individual tab component used within w-tabs container.
1721
1725
  *
1722
1726
  * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/tabs--docs)
1723
1727
  *
@@ -1725,20 +1729,18 @@ export type WarpTabPanelProps = {
1725
1729
  *
1726
1730
  * Component attributes and properties that can be applied to the element or by using JavaScript.
1727
1731
  *
1732
+ * - `name`: undefined
1733
+ * - `label`: undefined
1728
1734
  * - `active`: undefined
1735
+ * - `over`: undefined
1729
1736
  * - `tab-class`/`tabClass`: undefined
1730
- *
1731
- * ## Events
1732
- *
1733
- * Events that will be emitted by the component.
1734
- *
1735
- * - `change`: undefined
1736
1737
  */
1737
- "w-tabs": Partial<WarpTabsProps & BaseProps<WarpTabs> & BaseEvents>;
1738
+ "w-tab": Partial<WarpTabProps & BaseProps<WarpTab> & BaseEvents>;
1738
1739
 
1739
1740
 
1740
1741
  /**
1741
- * Individual tab component used within w-tabs container.
1742
+ * Tab panel component that holds content for individual tabs.
1743
+ * Each tab panel should have a name that matches a corresponding tab.
1742
1744
  *
1743
1745
  * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/tabs--docs)
1744
1746
  *
@@ -1747,17 +1749,13 @@ export type WarpTabPanelProps = {
1747
1749
  * Component attributes and properties that can be applied to the element or by using JavaScript.
1748
1750
  *
1749
1751
  * - `name`: undefined
1750
- * - `label`: undefined
1751
- * - `active`: undefined
1752
- * - `over`: undefined
1753
- * - `tab-class`/`tabClass`: undefined
1752
+ * - `hidden`: undefined
1754
1753
  */
1755
- "w-tab": Partial<WarpTabProps & BaseProps<WarpTab> & BaseEvents>;
1754
+ "w-tab-panel": Partial<WarpTabPanelProps & BaseProps<WarpTabPanel> & BaseEvents>;
1756
1755
 
1757
1756
 
1758
1757
  /**
1759
- * Tab panel component that holds content for individual tabs.
1760
- * Each tab panel should have a name that matches a corresponding tab.
1758
+ * Tabs are used to organize content by grouping similar information on the same page.
1761
1759
  *
1762
1760
  * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/tabs--docs)
1763
1761
  *
@@ -1765,10 +1763,33 @@ export type WarpTabPanelProps = {
1765
1763
  *
1766
1764
  * Component attributes and properties that can be applied to the element or by using JavaScript.
1767
1765
  *
1768
- * - `name`: undefined
1769
- * - `hidden`: undefined
1766
+ * - `active`: undefined
1767
+ * - `tab-class`/`tabClass`: undefined
1768
+ * - `tabs`: undefined (property only) (readonly)
1769
+ * - `activeTab`: undefined (property only) (readonly)
1770
+ *
1771
+ * ## Events
1772
+ *
1773
+ * Events that will be emitted by the component.
1774
+ *
1775
+ * - `change`: undefined
1770
1776
  */
1771
- "w-tab-panel": Partial<WarpTabPanelProps & BaseProps<WarpTabPanel> & BaseEvents>;
1777
+ "w-tabs": Partial<WarpTabsProps & BaseProps<WarpTabs> & BaseEvents>;
1778
+
1779
+
1780
+ /**
1781
+ *
1782
+ *
1783
+ * ## Methods
1784
+ *
1785
+ * Methods that can be called to access component functionality.
1786
+ *
1787
+ * - `init() => void`: undefined
1788
+ * - `get(id: string | number) => ToastInternal | undefined`: undefined
1789
+ * - `set(toast: ToastOptions) => Map<string | number, ToastInternal>`: undefined
1790
+ * - `del(id: string | number) => Promise<boolean>`: undefined
1791
+ */
1792
+ "w-toast-container": Partial<WarpToastContainerProps & BaseProps<WarpToastContainer> & BaseEvents>;
1772
1793
  }
1773
1794
 
1774
1795
  export type CustomCssProperties = {
@@ -0,0 +1,9 @@
1
+ import { StoryObj } from '@storybook/react';
2
+ import { Affix } from './react';
3
+ declare const _default: {
4
+ title: string;
5
+ component: import("@lit/react").ReactWebComponent<import(".").WarpAffix, {}>;
6
+ };
7
+ export default _default;
8
+ export type Story = StoryObj<typeof Affix>;
9
+ export declare const Default: Story;
@@ -0,0 +1,10 @@
1
+ import { Affix } from './react';
2
+ export default {
3
+ title: 'Forms/Affix',
4
+ component: Affix,
5
+ };
6
+ export const Default = {
7
+ args: {
8
+ label: 'kr',
9
+ },
10
+ };
@@ -1,6 +1,6 @@
1
- import { html } from 'lit';
2
1
  import { spread } from '@open-wc/lit-helpers';
3
2
  import { getStorybookHelpers } from '@wc-toolkit/storybook-helpers';
3
+ import { html } from 'lit';
4
4
  import { prespread } from '../../.storybook/utilities.js';
5
5
  import './index.js';
6
6
  const { events, args, argTypes } = getStorybookHelpers('w-affix');
@@ -1,5 +1,5 @@
1
1
  var be=Object.create;var S=Object.defineProperty;var A=Object.getOwnPropertyDescriptor;var pe=Object.getOwnPropertyNames;var ue=Object.getPrototypeOf,ge=Object.prototype.hasOwnProperty;var R=(r,e)=>()=>(e||r((e={exports:{}}).exports,e),e.exports);var he=(r,e,o,t)=>{if(e&&typeof e=="object"||typeof e=="function")for(let a of pe(e))!ge.call(r,a)&&a!==o&&S(r,a,{get:()=>e[a],enumerable:!(t=A(e,a))||t.enumerable});return r};var me=(r,e,o)=>(o=r!=null?be(ue(r)):{},he(e||!r||!r.__esModule?S(o,"default",{value:r,enumerable:!0}):o,r));var x=(r,e,o,t)=>{for(var a=t>1?void 0:t?A(e,o):e,s=r.length-1,i;s>=0;s--)(i=r[s])&&(a=(t?i(e,o,a):i(a))||a);return t&&a&&S(e,o,a),a};var H=R(v=>{"use strict";Object.defineProperty(v,"__esModule",{value:!0});v.errorMessages=v.ErrorType=void 0;var w;(function(r){r.MalformedUnicode="MALFORMED_UNICODE",r.MalformedHexadecimal="MALFORMED_HEXADECIMAL",r.CodePointLimit="CODE_POINT_LIMIT",r.OctalDeprecation="OCTAL_DEPRECATION",r.EndOfString="END_OF_STRING"})(w=v.ErrorType||(v.ErrorType={}));v.errorMessages=new Map([[w.MalformedUnicode,"malformed Unicode character escape sequence"],[w.MalformedHexadecimal,"malformed hexadecimal character escape sequence"],[w.CodePointLimit,"Unicode codepoint must not be greater than 0x10FFFF in escape sequence"],[w.OctalDeprecation,'"0"-prefixed octal literals and octal escape sequences are deprecated; for octal literals use the "0o" prefix instead'],[w.EndOfString,"malformed escape sequence at end of string"]])});var K=R(p=>{"use strict";Object.defineProperty(p,"__esModule",{value:!0});p.unraw=p.errorMessages=p.ErrorType=void 0;var c=H();Object.defineProperty(p,"ErrorType",{enumerable:!0,get:function(){return c.ErrorType}});Object.defineProperty(p,"errorMessages",{enumerable:!0,get:function(){return c.errorMessages}});function fe(r){return!r.match(/[^a-f0-9]/i)?parseInt(r,16):NaN}function _(r,e,o){let t=fe(r);if(Number.isNaN(t)||o!==void 0&&o!==r.length)throw new SyntaxError(c.errorMessages.get(e));return t}function we(r){let e=_(r,c.ErrorType.MalformedHexadecimal,2);return String.fromCharCode(e)}function J(r,e){let o=_(r,c.ErrorType.MalformedUnicode,4);if(e!==void 0){let t=_(e,c.ErrorType.MalformedUnicode,4);return String.fromCharCode(o,t)}return String.fromCharCode(o)}function xe(r){return r.charAt(0)==="{"&&r.charAt(r.length-1)==="}"}function ke(r){if(!xe(r))throw new SyntaxError(c.errorMessages.get(c.ErrorType.MalformedUnicode));let e=r.slice(1,-1),o=_(e,c.ErrorType.MalformedUnicode);try{return String.fromCodePoint(o)}catch(t){throw t instanceof RangeError?new SyntaxError(c.errorMessages.get(c.ErrorType.CodePointLimit)):t}}function ye(r,e=!1){if(e)throw new SyntaxError(c.errorMessages.get(c.ErrorType.OctalDeprecation));let o=parseInt(r,8);return String.fromCharCode(o)}var _e=new Map([["b","\b"],["f","\f"],["n",`
2
- `],["r","\r"],["t"," "],["v","\v"],["0","\0"]]);function ze(r){return _e.get(r)||r}var Ee=/\\(?:(\\)|x([\s\S]{0,2})|u(\{[^}]*\}?)|u([\s\S]{4})\\u([^{][\s\S]{0,3})|u([\s\S]{0,4})|([0-3]?[0-7]{1,2})|([\s\S])|$)/g;function q(r,e=!1){return r.replace(Ee,function(o,t,a,s,i,n,l,d,h){if(t!==void 0)return"\\";if(a!==void 0)return we(a);if(s!==void 0)return ke(s);if(i!==void 0)return J(i,n);if(l!==void 0)return J(l);if(d==="0")return"\0";if(d!==void 0)return ye(d,!e);if(h!==void 0)return ze(h);throw new SyntaxError(c.errorMessages.get(c.ErrorType.EndOfString))})}p.unraw=q;p.default=q});import{html as L,LitElement as cr}from"lit";var N=function(){for(var r=[],e=arguments.length;e--;)r[e]=arguments[e];return r.reduce(function(o,t){return o.concat(typeof t=="string"?t:Array.isArray(t)?N.apply(void 0,t):typeof t=="object"&&t?Object.keys(t).map(function(a){return t[a]?a:""}):"")},[]).join(" ")};import{property as C}from"lit/decorators.js";import{ifDefined as le}from"lit/directives/if-defined.js";import{css as U}from"lit";var X=U`
2
+ `],["r","\r"],["t"," "],["v","\v"],["0","\0"]]);function ze(r){return _e.get(r)||r}var Ee=/\\(?:(\\)|x([\s\S]{0,2})|u(\{[^}]*\}?)|u([\s\S]{4})\\u([^{][\s\S]{0,3})|u([\s\S]{0,4})|([0-3]?[0-7]{1,2})|([\s\S])|$)/g;function q(r,e=!1){return r.replace(Ee,function(o,t,a,s,i,n,l,d,h){if(t!==void 0)return"\\";if(a!==void 0)return we(a);if(s!==void 0)return ke(s);if(i!==void 0)return J(i,n);if(l!==void 0)return J(l);if(d==="0")return"\0";if(d!==void 0)return ye(d,!e);if(h!==void 0)return ze(h);throw new SyntaxError(c.errorMessages.get(c.ErrorType.EndOfString))})}p.unraw=q;p.default=q});var N=function(){for(var r=[],e=arguments.length;e--;)r[e]=arguments[e];return r.reduce(function(o,t){return o.concat(typeof t=="string"?t:Array.isArray(t)?N.apply(void 0,t):typeof t=="object"&&t?Object.keys(t).map(function(a){return t[a]?a:""}):"")},[]).join(" ")};import{html as L,LitElement as cr}from"lit";import{property as C}from"lit/decorators.js";import{ifDefined as le}from"lit/directives/if-defined.js";import{css as U}from"lit";var X=U`
3
3
  *,
4
4
  :before,
5
5
  :after {