@warp-ds/elements 2.10.0-next.2 → 2.10.0-next.20

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 (743) hide show
  1. package/README.md +4 -0
  2. package/dist/.storybook/utilities.js +4 -4
  3. package/dist/api.js +1 -1
  4. package/dist/api.js.map +2 -2
  5. package/dist/custom-elements.json +1303 -619
  6. package/dist/docs/affix/affix.md +120 -3
  7. package/dist/docs/affix/api.md +2 -2
  8. package/dist/docs/affix/styling.md +108 -0
  9. package/dist/docs/alert/alert.md +6 -6
  10. package/dist/docs/alert/api.md +4 -4
  11. package/dist/docs/alert/styling.md +1 -0
  12. package/dist/docs/attention/api.md +50 -2
  13. package/dist/docs/attention/attention.md +52 -2
  14. package/dist/docs/attention/styling.md +1 -0
  15. package/dist/docs/badge/api.md +50 -4
  16. package/dist/docs/badge/badge.md +52 -4
  17. package/dist/docs/badge/styling.md +1 -0
  18. package/dist/docs/box/api.md +2 -2
  19. package/dist/docs/box/box.md +24 -42
  20. package/dist/docs/box/examples.md +20 -38
  21. package/dist/docs/box/styling.md +1 -0
  22. package/dist/docs/breadcrumb-item/api.md +27 -0
  23. package/dist/docs/breadcrumb-item/breadcrumb-item.md +34 -0
  24. package/dist/docs/breadcrumbs/accessibility.md +8 -18
  25. package/dist/docs/breadcrumbs/breadcrumbs.md +128 -36
  26. package/dist/docs/breadcrumbs/examples.md +15 -9
  27. package/dist/docs/breadcrumbs/styling.md +97 -0
  28. package/dist/docs/breadcrumbs/usage.md +8 -8
  29. package/dist/docs/button/api.md +32 -24
  30. package/dist/docs/button/button.md +105 -26
  31. package/dist/docs/button/styling.md +72 -0
  32. package/dist/docs/card/api.md +8 -0
  33. package/dist/docs/card/card.md +10 -2
  34. package/dist/docs/card/styling.md +1 -0
  35. package/dist/docs/checkbox/api.md +176 -0
  36. package/dist/docs/checkbox/checkbox.md +356 -0
  37. package/dist/docs/checkbox/styling.md +173 -0
  38. package/dist/docs/checkbox-group/accessibility.md +71 -0
  39. package/dist/docs/checkbox-group/api.md +103 -0
  40. package/dist/docs/checkbox-group/checkbox-group.md +529 -0
  41. package/dist/docs/checkbox-group/examples.md +105 -0
  42. package/dist/docs/checkbox-group/styling.md +134 -0
  43. package/dist/docs/checkbox-group/usage.md +95 -0
  44. package/dist/docs/combobox/accessibility.md +71 -0
  45. package/dist/docs/combobox/api.md +74 -36
  46. package/dist/docs/combobox/combobox.md +219 -38
  47. package/dist/docs/combobox/examples.md +44 -0
  48. package/dist/docs/combobox/styling.md +1 -0
  49. package/dist/docs/combobox/usage.md +28 -0
  50. package/dist/docs/datepicker/accessibility.md +25 -0
  51. package/dist/docs/datepicker/api.md +37 -21
  52. package/dist/docs/datepicker/datepicker.md +223 -23
  53. package/dist/docs/datepicker/examples.md +75 -0
  54. package/dist/docs/datepicker/styling.md +1 -0
  55. package/dist/docs/datepicker/usage.md +84 -0
  56. package/dist/docs/expandable/api.md +23 -35
  57. package/dist/docs/expandable/examples.md +54 -0
  58. package/dist/docs/expandable/expandable.md +77 -35
  59. package/dist/docs/expandable/styling.md +1 -0
  60. package/dist/docs/icon/accessibility.md +5 -0
  61. package/dist/docs/icon/api.md +43 -0
  62. package/dist/docs/icon/examples.md +45 -0
  63. package/dist/docs/icon/icon.md +115 -0
  64. package/dist/docs/icon/styling.md +1 -0
  65. package/dist/docs/icon/usage.md +11 -0
  66. package/dist/docs/index.md +49 -0
  67. package/dist/docs/link/api.md +24 -28
  68. package/dist/docs/link/examples.md +75 -0
  69. package/dist/docs/link/link.md +119 -30
  70. package/dist/docs/link/styling.md +1 -0
  71. package/dist/docs/link/usage.md +18 -0
  72. package/dist/docs/modal/api.md +18 -2
  73. package/dist/docs/modal/modal.md +20 -2
  74. package/dist/docs/modal/styling.md +1 -0
  75. package/dist/docs/modal-footer/modal-footer.md +0 -6
  76. package/dist/docs/modal-header/modal-header.md +0 -6
  77. package/dist/docs/page-indicator/page-indicator.md +2 -0
  78. package/dist/docs/page-indicator/styling.md +1 -0
  79. package/dist/docs/pagination/api.md +4 -4
  80. package/dist/docs/pagination/pagination.md +6 -4
  81. package/dist/docs/pagination/styling.md +1 -0
  82. package/dist/docs/pill/api.md +8 -8
  83. package/dist/docs/pill/pill.md +10 -8
  84. package/dist/docs/pill/styling.md +1 -0
  85. package/dist/docs/radio/radio.md +1 -7
  86. package/dist/docs/radio-group/api.md +4 -4
  87. package/dist/docs/radio-group/radio-group.md +183 -68
  88. package/dist/docs/radio-group/styling.md +179 -64
  89. package/dist/docs/select/api.md +10 -10
  90. package/dist/docs/select/select.md +103 -10
  91. package/dist/docs/select/styling.md +92 -0
  92. package/dist/docs/slider/api.md +22 -22
  93. package/dist/docs/slider/slider.md +24 -22
  94. package/dist/docs/slider/styling.md +1 -0
  95. package/dist/docs/slider-thumb/api.md +28 -12
  96. package/dist/docs/slider-thumb/slider-thumb.md +30 -12
  97. package/dist/docs/slider-thumb/styling.md +1 -0
  98. package/dist/docs/snackbar/accessibility.md +20 -0
  99. package/dist/docs/snackbar/api.md +30 -0
  100. package/dist/docs/snackbar/examples.md +191 -0
  101. package/dist/docs/snackbar/snackbar.md +385 -0
  102. package/dist/docs/snackbar/styling.md +72 -0
  103. package/dist/docs/snackbar/usage.md +60 -0
  104. package/dist/docs/snackbar-item/api.md +41 -0
  105. package/dist/docs/snackbar-item/snackbar-item.md +49 -0
  106. package/dist/docs/step/api.md +16 -0
  107. package/dist/docs/step/step.md +16 -0
  108. package/dist/docs/step-indicator/step-indicator.md +2 -0
  109. package/dist/docs/step-indicator/styling.md +1 -0
  110. package/dist/docs/switch/api.md +8 -0
  111. package/dist/docs/switch/styling.md +1 -0
  112. package/dist/docs/switch/switch.md +10 -0
  113. package/dist/docs/tabs/api.md +2 -2
  114. package/dist/docs/tabs/styling.md +1 -0
  115. package/dist/docs/tabs/tabs.md +4 -2
  116. package/dist/docs/textarea/api.md +54 -14
  117. package/dist/docs/textarea/styling.md +92 -0
  118. package/dist/docs/textarea/textarea.md +147 -14
  119. package/dist/docs/textfield/api.md +74 -34
  120. package/dist/docs/textfield/styling.md +96 -0
  121. package/dist/docs/textfield/textfield.md +171 -34
  122. package/dist/index.d.ts +1359 -368
  123. package/dist/packages/affix/affix-styles.d.ts +8 -0
  124. package/dist/packages/affix/affix-styles.js +108 -0
  125. package/dist/packages/affix/affix.d.ts +16 -13
  126. package/dist/packages/affix/affix.hydration.test.d.ts +1 -1
  127. package/dist/packages/affix/affix.hydration.test.js +15 -15
  128. package/dist/packages/affix/affix.js +451 -320
  129. package/dist/packages/affix/affix.js.map +4 -4
  130. package/dist/packages/affix/affix.react.stories.d.ts +3 -3
  131. package/dist/packages/affix/affix.react.stories.js +3 -3
  132. package/dist/packages/affix/affix.react.test.js +5 -3
  133. package/dist/packages/affix/affix.stories.d.ts +3 -3
  134. package/dist/packages/affix/affix.stories.js +10 -10
  135. package/dist/packages/affix/affix.test.d.ts +1 -1
  136. package/dist/packages/affix/affix.test.js +10 -10
  137. package/dist/packages/affix/react.d.ts +3 -3
  138. package/dist/packages/affix/react.js +6 -6
  139. package/dist/packages/affix/styles.js +2 -2
  140. package/dist/packages/alert/alert.d.ts +3 -3
  141. package/dist/packages/alert/alert.hydration.test.d.ts +1 -1
  142. package/dist/packages/alert/alert.hydration.test.js +21 -21
  143. package/dist/packages/alert/alert.js +349 -324
  144. package/dist/packages/alert/alert.js.map +3 -3
  145. package/dist/packages/alert/alert.react.stories.d.ts +2 -2
  146. package/dist/packages/alert/alert.react.stories.js +13 -13
  147. package/dist/packages/alert/alert.stories.d.ts +4 -4
  148. package/dist/packages/alert/alert.stories.js +29 -27
  149. package/dist/packages/alert/alert.test.d.ts +1 -1
  150. package/dist/packages/alert/alert.test.js +34 -21
  151. package/dist/packages/alert/react.d.ts +1 -1
  152. package/dist/packages/alert/react.js +4 -4
  153. package/dist/packages/alert/styles.js +2 -2
  154. package/dist/packages/attention/attention.d.ts +11 -6
  155. package/dist/packages/attention/attention.hydration.test.d.ts +1 -1
  156. package/dist/packages/attention/attention.hydration.test.js +29 -29
  157. package/dist/packages/attention/attention.js +1795 -1781
  158. package/dist/packages/attention/attention.js.map +4 -4
  159. package/dist/packages/attention/attention.react.stories.d.ts +3 -3
  160. package/dist/packages/attention/attention.react.stories.js +13 -13
  161. package/dist/packages/attention/attention.react.test.js +11 -7
  162. package/dist/packages/attention/attention.stories.d.ts +4 -4
  163. package/dist/packages/attention/attention.stories.js +126 -117
  164. package/dist/packages/attention/attention.test.d.ts +1 -1
  165. package/dist/packages/attention/attention.test.js +18 -10
  166. package/dist/packages/attention/layout-styles.js +900 -900
  167. package/dist/packages/attention/react.d.ts +4 -4
  168. package/dist/packages/attention/react.js +13 -11
  169. package/dist/packages/attention/styles.js +2 -2
  170. package/dist/packages/badge/badge.d.ts +3 -3
  171. package/dist/packages/badge/badge.hydration.test.d.ts +1 -1
  172. package/dist/packages/badge/badge.hydration.test.js +25 -25
  173. package/dist/packages/badge/badge.js +281 -281
  174. package/dist/packages/badge/badge.js.map +3 -3
  175. package/dist/packages/badge/badge.react.stories.d.ts +3 -3
  176. package/dist/packages/badge/badge.react.stories.js +17 -17
  177. package/dist/packages/badge/badge.stories.d.ts +3 -3
  178. package/dist/packages/badge/badge.stories.js +22 -20
  179. package/dist/packages/badge/badge.test.d.ts +1 -1
  180. package/dist/packages/badge/badge.test.js +13 -11
  181. package/dist/packages/badge/react.d.ts +1 -1
  182. package/dist/packages/badge/react.js +4 -4
  183. package/dist/packages/badge/styles.js +2 -2
  184. package/dist/packages/box/box.d.ts +1 -1
  185. package/dist/packages/box/box.hydration.test.d.ts +1 -1
  186. package/dist/packages/box/box.hydration.test.js +14 -14
  187. package/dist/packages/box/box.js +288 -288
  188. package/dist/packages/box/box.js.map +3 -3
  189. package/dist/packages/box/box.react.stories.d.ts +3 -3
  190. package/dist/packages/box/box.react.stories.js +8 -8
  191. package/dist/packages/box/box.stories.d.ts +3 -3
  192. package/dist/packages/box/box.stories.js +25 -19
  193. package/dist/packages/box/box.test.d.ts +1 -1
  194. package/dist/packages/box/box.test.js +6 -6
  195. package/dist/packages/box/react.d.ts +1 -1
  196. package/dist/packages/box/react.js +4 -4
  197. package/dist/packages/box/slot.test.d.ts +1 -1
  198. package/dist/packages/box/slot.test.js +6 -6
  199. package/dist/packages/box/styles.js +2 -2
  200. package/dist/packages/breadcrumb-item/breadcrumb-item.d.ts +29 -0
  201. package/dist/packages/breadcrumb-item/breadcrumb-item.js +2529 -0
  202. package/dist/packages/breadcrumb-item/breadcrumb-item.js.map +7 -0
  203. package/dist/packages/breadcrumb-item/react.d.ts +2 -0
  204. package/dist/packages/breadcrumb-item/react.js +11 -0
  205. package/dist/packages/breadcrumb-item/styles.d.ts +4 -0
  206. package/dist/packages/breadcrumb-item/styles.js +81 -0
  207. package/dist/packages/breadcrumbs/breadcrumbs.d.ts +4 -3
  208. package/dist/packages/breadcrumbs/breadcrumbs.hydration.test.d.ts +1 -1
  209. package/dist/packages/breadcrumbs/breadcrumbs.hydration.test.js +57 -50
  210. package/dist/packages/breadcrumbs/breadcrumbs.js +287 -283
  211. package/dist/packages/breadcrumbs/breadcrumbs.js.map +4 -4
  212. package/dist/packages/breadcrumbs/breadcrumbs.react.stories.d.ts +4 -4
  213. package/dist/packages/breadcrumbs/breadcrumbs.react.stories.js +17 -16
  214. package/dist/packages/breadcrumbs/breadcrumbs.stories.d.ts +7 -8
  215. package/dist/packages/breadcrumbs/breadcrumbs.stories.js +30 -26
  216. package/dist/packages/breadcrumbs/breadcrumbs.test.d.ts +1 -1
  217. package/dist/packages/breadcrumbs/breadcrumbs.test.js +19 -17
  218. package/dist/packages/breadcrumbs/react.d.ts +1 -1
  219. package/dist/packages/breadcrumbs/react.js +4 -4
  220. package/dist/packages/breadcrumbs/styles.js +2 -2
  221. package/dist/packages/button/button.d.ts +20 -15
  222. package/dist/packages/button/button.hydration.test.d.ts +1 -1
  223. package/dist/packages/button/button.hydration.test.js +19 -19
  224. package/dist/packages/button/button.js +809 -811
  225. package/dist/packages/button/button.js.map +4 -4
  226. package/dist/packages/button/button.react.stories.d.ts +5 -5
  227. package/dist/packages/button/button.react.stories.js +30 -30
  228. package/dist/packages/button/button.react.test.js +13 -13
  229. package/dist/packages/button/button.stories.d.ts +33 -4
  230. package/dist/packages/button/button.stories.js +353 -70
  231. package/dist/packages/button/button.test.d.ts +1 -1
  232. package/dist/packages/button/button.test.js +36 -35
  233. package/dist/packages/button/react.d.ts +3 -3
  234. package/dist/packages/button/react.js +7 -7
  235. package/dist/packages/button/styles.d.ts +22 -1
  236. package/dist/packages/button/styles.js +433 -2
  237. package/dist/packages/card/card.d.ts +1 -1
  238. package/dist/packages/card/card.hydration.test.d.ts +1 -1
  239. package/dist/packages/card/card.hydration.test.js +14 -14
  240. package/dist/packages/card/card.js +311 -296
  241. package/dist/packages/card/card.js.map +4 -4
  242. package/dist/packages/card/card.react.stories.d.ts +3 -3
  243. package/dist/packages/card/card.react.stories.js +11 -11
  244. package/dist/packages/card/card.stories.d.ts +3 -3
  245. package/dist/packages/card/card.stories.js +36 -24
  246. package/dist/packages/card/card.test.d.ts +1 -1
  247. package/dist/packages/card/card.test.js +6 -6
  248. package/dist/packages/card/react.d.ts +1 -1
  249. package/dist/packages/card/react.js +4 -4
  250. package/dist/packages/card/styles.js +2 -2
  251. package/dist/packages/checkbox/checkbox.a11y.test.d.ts +1 -1
  252. package/dist/packages/checkbox/checkbox.a11y.test.js +47 -33
  253. package/dist/packages/checkbox/checkbox.d.ts +48 -17
  254. package/dist/packages/checkbox/checkbox.hydration.test.d.ts +1 -1
  255. package/dist/packages/checkbox/checkbox.hydration.test.js +21 -21
  256. package/dist/packages/checkbox/checkbox.js +481 -430
  257. package/dist/packages/checkbox/checkbox.js.map +3 -3
  258. package/dist/packages/checkbox/checkbox.react.stories.d.ts +3 -3
  259. package/dist/packages/checkbox/checkbox.react.stories.js +3 -3
  260. package/dist/packages/checkbox/checkbox.stories.d.ts +5 -5
  261. package/dist/packages/checkbox/checkbox.stories.js +99 -91
  262. package/dist/packages/checkbox/checkbox.test.d.ts +1 -1
  263. package/dist/packages/checkbox/checkbox.test.js +64 -64
  264. package/dist/packages/checkbox/react.d.ts +2 -2
  265. package/dist/packages/checkbox/react.js +6 -6
  266. package/dist/packages/checkbox/styles.js +183 -132
  267. package/dist/packages/checkbox-group/checkbox-group.a11y.test.d.ts +2 -2
  268. package/dist/packages/checkbox-group/checkbox-group.a11y.test.js +83 -73
  269. package/dist/packages/checkbox-group/checkbox-group.d.ts +54 -13
  270. package/dist/packages/checkbox-group/checkbox-group.hydration.test.d.ts +2 -2
  271. package/dist/packages/checkbox-group/checkbox-group.hydration.test.js +36 -19
  272. package/dist/packages/checkbox-group/checkbox-group.js +62 -57
  273. package/dist/packages/checkbox-group/checkbox-group.js.map +4 -4
  274. package/dist/packages/checkbox-group/checkbox-group.react.test.js +4 -4
  275. package/dist/packages/checkbox-group/checkbox-group.test.d.ts +2 -2
  276. package/dist/packages/checkbox-group/checkbox-group.test.js +96 -90
  277. package/dist/packages/checkbox-group/react.d.ts +4 -4
  278. package/dist/packages/checkbox-group/react.js +6 -6
  279. package/dist/packages/combobox/combobox.a11y.test.d.ts +2 -2
  280. package/dist/packages/combobox/combobox.a11y.test.js +80 -33
  281. package/dist/packages/combobox/combobox.d.ts +67 -47
  282. package/dist/packages/combobox/combobox.hydration.test.d.ts +1 -1
  283. package/dist/packages/combobox/combobox.hydration.test.js +73 -35
  284. package/dist/packages/combobox/combobox.js +338 -339
  285. package/dist/packages/combobox/combobox.js.map +4 -4
  286. package/dist/packages/combobox/combobox.react.stories.d.ts +29 -13
  287. package/dist/packages/combobox/combobox.react.stories.js +29 -29
  288. package/dist/packages/combobox/combobox.react.test.js +8 -8
  289. package/dist/packages/combobox/combobox.stories.d.ts +4 -4
  290. package/dist/packages/combobox/combobox.stories.js +104 -85
  291. package/dist/packages/combobox/combobox.test.d.ts +2 -2
  292. package/dist/packages/combobox/combobox.test.js +194 -69
  293. package/dist/packages/combobox/react.d.ts +15 -7
  294. package/dist/packages/combobox/react.js +14 -14
  295. package/dist/packages/combobox/styles.js +2 -3
  296. package/dist/packages/datepicker/DatePicker.test.d.ts +2 -2
  297. package/dist/packages/datepicker/DatePicker.test.js +49 -42
  298. package/dist/packages/datepicker/datepicker.d.ts +30 -38
  299. package/dist/packages/datepicker/datepicker.hydration.test.d.ts +1 -1
  300. package/dist/packages/datepicker/datepicker.hydration.test.js +21 -21
  301. package/dist/packages/datepicker/datepicker.js +673 -632
  302. package/dist/packages/datepicker/datepicker.js.map +4 -4
  303. package/dist/packages/datepicker/datepicker.react.stories.d.ts +17 -17
  304. package/dist/packages/datepicker/datepicker.react.stories.js +9 -9
  305. package/dist/packages/datepicker/datepicker.react.test.js +6 -6
  306. package/dist/packages/datepicker/datepicker.stories.d.ts +4 -4
  307. package/dist/packages/datepicker/datepicker.stories.js +32 -32
  308. package/dist/packages/datepicker/datepicker.test.d.ts +2 -2
  309. package/dist/packages/datepicker/datepicker.test.js +77 -79
  310. package/dist/packages/datepicker/react.d.ts +9 -9
  311. package/dist/packages/datepicker/react.js +16 -14
  312. package/dist/packages/datepicker/styles/w-datepicker-calendar.styles.js +13 -12
  313. package/dist/packages/datepicker/styles/w-datepicker-day.styles.js +58 -55
  314. package/dist/packages/datepicker/styles/w-datepicker-month.styles.js +60 -57
  315. package/dist/packages/datepicker/styles/w-datepicker.styles.js +87 -87
  316. package/dist/packages/datepicker/utils.d.ts +3 -0
  317. package/dist/packages/datepicker/utils.js +40 -1
  318. package/dist/packages/datepicker/utils.test.d.ts +1 -0
  319. package/dist/packages/datepicker/utils.test.js +29 -0
  320. package/dist/packages/expandable/expandable.d.ts +18 -39
  321. package/dist/packages/expandable/expandable.hydration.test.d.ts +1 -1
  322. package/dist/packages/expandable/expandable.hydration.test.js +21 -21
  323. package/dist/packages/expandable/expandable.js +359 -332
  324. package/dist/packages/expandable/expandable.js.map +4 -4
  325. package/dist/packages/expandable/expandable.react.stories.d.ts +5 -5
  326. package/dist/packages/expandable/expandable.react.stories.js +7 -7
  327. package/dist/packages/expandable/expandable.react.test.js +15 -7
  328. package/dist/packages/expandable/expandable.stories.d.ts +5 -5
  329. package/dist/packages/expandable/expandable.stories.js +51 -45
  330. package/dist/packages/expandable/expandable.test.d.ts +1 -1
  331. package/dist/packages/expandable/expandable.test.js +19 -17
  332. package/dist/packages/expandable/react.d.ts +3 -3
  333. package/dist/packages/expandable/react.js +9 -9
  334. package/dist/packages/expandable/styles.js +2 -2
  335. package/dist/packages/global.d.ts +1 -0
  336. package/dist/packages/global.js +5 -0
  337. package/dist/packages/i18n.d.ts +1 -1
  338. package/dist/packages/i18n.js +37 -29
  339. package/dist/packages/icon/icon.d.ts +22 -5
  340. package/dist/packages/icon/icon.hydration.test.d.ts +1 -1
  341. package/dist/packages/icon/icon.hydration.test.js +25 -25
  342. package/dist/packages/icon/icon.js +31 -26
  343. package/dist/packages/icon/icon.js.map +3 -3
  344. package/dist/packages/icon/icon.react.stories.d.ts +4 -3
  345. package/dist/packages/icon/icon.react.stories.js +284 -283
  346. package/dist/packages/icon/icon.stories.d.ts +7 -30
  347. package/dist/packages/icon/icon.stories.js +307 -297
  348. package/dist/packages/icon/icon.test.d.ts +1 -1
  349. package/dist/packages/icon/icon.test.js +36 -28
  350. package/dist/packages/icon/react.d.ts +2 -2
  351. package/dist/packages/icon/react.js +4 -4
  352. package/dist/packages/icon/style.js +24 -25
  353. package/dist/packages/interaction-type-detection.d.ts +22 -0
  354. package/dist/packages/interaction-type-detection.js +38 -0
  355. package/dist/packages/link/link.d.ts +22 -23
  356. package/dist/packages/link/link.hydration.test.d.ts +1 -1
  357. package/dist/packages/link/link.hydration.test.js +27 -27
  358. package/dist/packages/link/link.js +775 -498
  359. package/dist/packages/link/link.js.map +4 -4
  360. package/dist/packages/link/link.react.stories.d.ts +3 -3
  361. package/dist/packages/link/link.react.stories.js +42 -42
  362. package/dist/packages/link/link.react.test.js +5 -3
  363. package/dist/packages/link/link.stories.d.ts +3 -3
  364. package/dist/packages/link/link.stories.js +51 -51
  365. package/dist/packages/link/link.test.d.ts +1 -1
  366. package/dist/packages/link/link.test.js +11 -7
  367. package/dist/packages/link/react.d.ts +2 -2
  368. package/dist/packages/link/react.js +6 -6
  369. package/dist/packages/link/styles.d.ts +5 -0
  370. package/dist/packages/link/styles.js +85 -0
  371. package/dist/packages/modal/index.d.ts +7 -7
  372. package/dist/packages/modal/index.js +7 -7
  373. package/dist/packages/modal/modal.d.ts +3 -2
  374. package/dist/packages/modal/modal.hydration.test.d.ts +1 -1
  375. package/dist/packages/modal/modal.hydration.test.js +12 -12
  376. package/dist/packages/modal/modal.js +409 -409
  377. package/dist/packages/modal/modal.js.map +3 -3
  378. package/dist/packages/modal/modal.react.stories.d.ts +7 -7
  379. package/dist/packages/modal/modal.react.stories.js +15 -6
  380. package/dist/packages/modal/modal.react.test.js +5 -5
  381. package/dist/packages/modal/modal.stories.d.ts +6 -6
  382. package/dist/packages/modal/modal.stories.js +253 -238
  383. package/dist/packages/modal/react.d.ts +38 -8
  384. package/dist/packages/modal/react.js +43 -13
  385. package/dist/packages/modal/util.js +3 -1
  386. package/dist/packages/modal-footer/modal-footer.d.ts +1 -1
  387. package/dist/packages/modal-footer/modal-footer.js +296 -296
  388. package/dist/packages/modal-footer/modal-footer.js.map +3 -3
  389. package/dist/packages/modal-footer/react.d.ts +1 -1
  390. package/dist/packages/modal-footer/react.js +4 -4
  391. package/dist/packages/modal-header/modal-header.d.ts +2 -2
  392. package/dist/packages/modal-header/modal-header.js +443 -422
  393. package/dist/packages/modal-header/modal-header.js.map +4 -4
  394. package/dist/packages/modal-header/modal-header.react.test.js +5 -3
  395. package/dist/packages/modal-header/react.d.ts +4 -4
  396. package/dist/packages/modal-header/react.js +8 -8
  397. package/dist/packages/page-indicator/page-indicator.d.ts +1 -5
  398. package/dist/packages/page-indicator/page-indicator.hydration.test.d.ts +1 -1
  399. package/dist/packages/page-indicator/page-indicator.hydration.test.js +22 -22
  400. package/dist/packages/page-indicator/page-indicator.js +29 -29
  401. package/dist/packages/page-indicator/page-indicator.js.map +4 -4
  402. package/dist/packages/page-indicator/page-indicator.react.stories.d.ts +3 -3
  403. package/dist/packages/page-indicator/page-indicator.react.stories.js +11 -11
  404. package/dist/packages/page-indicator/page-indicator.react.test.js +5 -5
  405. package/dist/packages/page-indicator/page-indicator.stories.d.ts +9 -27
  406. package/dist/packages/page-indicator/page-indicator.stories.js +63 -32
  407. package/dist/packages/page-indicator/page-indicator.test.d.ts +1 -1
  408. package/dist/packages/page-indicator/page-indicator.test.js +110 -70
  409. package/dist/packages/page-indicator/react.d.ts +2 -2
  410. package/dist/packages/page-indicator/react.js +7 -7
  411. package/dist/packages/page-indicator/style.js +21 -21
  412. package/dist/packages/pagination/pagination.a11y.test.d.ts +1 -1
  413. package/dist/packages/pagination/pagination.a11y.test.js +59 -25
  414. package/dist/packages/pagination/pagination.d.ts +10 -11
  415. package/dist/packages/pagination/pagination.hydration.test.d.ts +1 -1
  416. package/dist/packages/pagination/pagination.hydration.test.js +19 -19
  417. package/dist/packages/pagination/pagination.js +385 -354
  418. package/dist/packages/pagination/pagination.js.map +4 -4
  419. package/dist/packages/pagination/pagination.react.stories.d.ts +11 -11
  420. package/dist/packages/pagination/pagination.react.stories.js +8 -8
  421. package/dist/packages/pagination/pagination.react.test.js +6 -6
  422. package/dist/packages/pagination/pagination.stories.d.ts +3 -3
  423. package/dist/packages/pagination/pagination.stories.js +18 -18
  424. package/dist/packages/pagination/pagination.test.d.ts +1 -1
  425. package/dist/packages/pagination/pagination.test.js +146 -72
  426. package/dist/packages/pagination/react.d.ts +6 -6
  427. package/dist/packages/pagination/react.js +12 -10
  428. package/dist/packages/pagination/styles.js +2 -2
  429. package/dist/packages/pill/pill.d.ts +6 -6
  430. package/dist/packages/pill/pill.hydration.test.d.ts +1 -1
  431. package/dist/packages/pill/pill.hydration.test.js +14 -14
  432. package/dist/packages/pill/pill.js +337 -314
  433. package/dist/packages/pill/pill.js.map +4 -4
  434. package/dist/packages/pill/pill.react.stories.d.ts +11 -11
  435. package/dist/packages/pill/pill.react.stories.js +3 -3
  436. package/dist/packages/pill/pill.react.test.js +8 -8
  437. package/dist/packages/pill/pill.stories.d.ts +3 -3
  438. package/dist/packages/pill/pill.stories.js +8 -8
  439. package/dist/packages/pill/pill.test.d.ts +1 -1
  440. package/dist/packages/pill/pill.test.js +17 -15
  441. package/dist/packages/pill/react.d.ts +6 -6
  442. package/dist/packages/pill/react.js +18 -14
  443. package/dist/packages/pill/styles.js +2 -2
  444. package/dist/packages/radio/base-element.d.ts +3 -3
  445. package/dist/packages/radio/base-element.js +3 -3
  446. package/dist/packages/radio/custom-error-validator.d.ts +1 -1
  447. package/dist/packages/radio/custom-error-validator.js +3 -3
  448. package/dist/packages/radio/form-associated-element.d.ts +9 -9
  449. package/dist/packages/radio/form-associated-element.js +27 -26
  450. package/dist/packages/radio/host-styles.js +9 -9
  451. package/dist/packages/radio/invalid.d.ts +1 -1
  452. package/dist/packages/radio/invalid.js +1 -1
  453. package/dist/packages/radio/radio-styles.js +199 -160
  454. package/dist/packages/radio/radio.a11y.test.d.ts +2 -2
  455. package/dist/packages/radio/radio.a11y.test.js +60 -58
  456. package/dist/packages/radio/radio.d.ts +4 -4
  457. package/dist/packages/radio/radio.hydration.test.d.ts +1 -1
  458. package/dist/packages/radio/radio.hydration.test.js +23 -14
  459. package/dist/packages/radio/radio.js +491 -452
  460. package/dist/packages/radio/radio.js.map +3 -3
  461. package/dist/packages/radio/radio.react.stories.d.ts +2 -2
  462. package/dist/packages/radio/radio.react.stories.js +3 -3
  463. package/dist/packages/radio/radio.stories.d.ts +4 -4
  464. package/dist/packages/radio/radio.stories.js +152 -136
  465. package/dist/packages/radio/radio.test.d.ts +1 -1
  466. package/dist/packages/radio/radio.test.js +74 -73
  467. package/dist/packages/radio/react.d.ts +1 -1
  468. package/dist/packages/radio/react.js +4 -4
  469. package/dist/packages/radio/required-validator.d.ts +1 -1
  470. package/dist/packages/radio/required-validator.js +12 -7
  471. package/dist/packages/radio/slot.d.ts +1 -1
  472. package/dist/packages/radio/slot.js +11 -8
  473. package/dist/packages/radio/watch.d.ts +1 -1
  474. package/dist/packages/radio/watch.js +3 -1
  475. package/dist/packages/radio-group/radio-group-styles.js +121 -88
  476. package/dist/packages/radio-group/radio-group.a11y.test.d.ts +2 -2
  477. package/dist/packages/radio-group/radio-group.a11y.test.js +83 -77
  478. package/dist/packages/radio-group/radio-group.d.ts +16 -7
  479. package/dist/packages/radio-group/radio-group.hydration.test.d.ts +2 -2
  480. package/dist/packages/radio-group/radio-group.hydration.test.js +30 -15
  481. package/dist/packages/radio-group/radio-group.js +655 -567
  482. package/dist/packages/radio-group/radio-group.js.map +4 -4
  483. package/dist/packages/radio-group/radio-group.react.test.js +4 -4
  484. package/dist/packages/radio-group/radio-group.test.d.ts +2 -2
  485. package/dist/packages/radio-group/radio-group.test.js +234 -229
  486. package/dist/packages/radio-group/react.d.ts +7 -7
  487. package/dist/packages/radio-group/react.js +10 -10
  488. package/dist/packages/select/input-styles.d.ts +11 -0
  489. package/dist/packages/select/input-styles.js +88 -0
  490. package/dist/packages/select/react.d.ts +5 -5
  491. package/dist/packages/select/react.js +11 -11
  492. package/dist/packages/select/select.a11y.test.d.ts +1 -1
  493. package/dist/packages/select/select.a11y.test.js +100 -89
  494. package/dist/packages/select/select.d.ts +10 -11
  495. package/dist/packages/select/select.hydration.test.d.ts +1 -1
  496. package/dist/packages/select/select.hydration.test.js +16 -16
  497. package/dist/packages/select/select.js +432 -336
  498. package/dist/packages/select/select.js.map +4 -4
  499. package/dist/packages/select/select.react.stories.d.ts +10 -10
  500. package/dist/packages/select/select.react.stories.js +19 -14
  501. package/dist/packages/select/select.react.test.js +6 -6
  502. package/dist/packages/select/select.stories.d.ts +3 -3
  503. package/dist/packages/select/select.stories.js +51 -48
  504. package/dist/packages/select/select.test.d.ts +1 -1
  505. package/dist/packages/select/select.test.js +178 -179
  506. package/dist/packages/select/styles.js +2 -2
  507. package/dist/packages/slider/Slider.d.ts +1 -1
  508. package/dist/packages/slider/Slider.js +4 -4
  509. package/dist/packages/slider/index.d.ts +2 -2
  510. package/dist/packages/slider/index.js +2 -2
  511. package/dist/packages/slider/react.d.ts +4 -4
  512. package/dist/packages/slider/react.js +9 -9
  513. package/dist/packages/slider/slider.d.ts +17 -17
  514. package/dist/packages/slider/slider.hydration.test.d.ts +1 -1
  515. package/dist/packages/slider/slider.hydration.test.js +40 -16
  516. package/dist/packages/slider/slider.js +485 -467
  517. package/dist/packages/slider/slider.js.map +4 -4
  518. package/dist/packages/slider/slider.react.stories.d.ts +4 -4
  519. package/dist/packages/slider/slider.react.stories.js +29 -32
  520. package/dist/packages/slider/slider.react.test.js +6 -6
  521. package/dist/packages/slider/slider.stories.d.ts +7 -7
  522. package/dist/packages/slider/slider.stories.js +333 -340
  523. package/dist/packages/slider/slider.test.d.ts +5 -5
  524. package/dist/packages/slider/slider.test.js +367 -334
  525. package/dist/packages/slider/styles/w-slider.styles.js +166 -148
  526. package/dist/packages/slider/styles.js +2 -2
  527. package/dist/packages/slider-thumb/SliderThumb.d.ts +1 -1
  528. package/dist/packages/slider-thumb/SliderThumb.js +4 -4
  529. package/dist/packages/slider-thumb/oddbird-css-anchor-positioning.d.ts +1 -1
  530. package/dist/packages/slider-thumb/oddbird-css-anchor-positioning.js +1 -1
  531. package/dist/packages/slider-thumb/react.d.ts +5 -5
  532. package/dist/packages/slider-thumb/react.js +11 -9
  533. package/dist/packages/slider-thumb/slider-thumb.d.ts +17 -17
  534. package/dist/packages/slider-thumb/slider-thumb.hydration.test.d.ts +1 -1
  535. package/dist/packages/slider-thumb/slider-thumb.hydration.test.js +26 -17
  536. package/dist/packages/slider-thumb/slider-thumb.js +550 -553
  537. package/dist/packages/slider-thumb/slider-thumb.js.map +4 -4
  538. package/dist/packages/slider-thumb/slider-thumb.react.test.js +9 -5
  539. package/dist/packages/slider-thumb/styles/w-slider-thumb.styles.js +189 -188
  540. package/dist/packages/slider-thumb/styles.js +2 -0
  541. package/dist/packages/snackbar/locales/da/messages.d.mts +1 -0
  542. package/dist/packages/snackbar/locales/da/messages.mjs +1 -0
  543. package/dist/packages/snackbar/locales/en/messages.d.mts +1 -0
  544. package/dist/packages/snackbar/locales/en/messages.mjs +1 -0
  545. package/dist/packages/snackbar/locales/fi/messages.d.mts +1 -0
  546. package/dist/packages/snackbar/locales/fi/messages.mjs +1 -0
  547. package/dist/packages/snackbar/locales/nb/messages.d.mts +1 -0
  548. package/dist/packages/snackbar/locales/nb/messages.mjs +1 -0
  549. package/dist/packages/snackbar/locales/sv/messages.d.mts +1 -0
  550. package/dist/packages/snackbar/locales/sv/messages.mjs +1 -0
  551. package/dist/packages/snackbar/react.d.ts +2 -0
  552. package/dist/packages/snackbar/react.js +11 -0
  553. package/dist/packages/snackbar/snackbar.d.ts +132 -0
  554. package/dist/packages/snackbar/snackbar.hydration.test.d.ts +1 -0
  555. package/dist/packages/snackbar/snackbar.hydration.test.js +13 -0
  556. package/dist/packages/snackbar/snackbar.js +2665 -0
  557. package/dist/packages/snackbar/snackbar.js.map +7 -0
  558. package/dist/packages/snackbar/snackbar.react.stories.d.ts +12 -0
  559. package/dist/packages/snackbar/snackbar.react.stories.js +160 -0
  560. package/dist/packages/snackbar/snackbar.stories.d.ts +20 -0
  561. package/dist/packages/snackbar/snackbar.stories.js +363 -0
  562. package/dist/packages/snackbar/snackbar.test.d.ts +4 -0
  563. package/dist/packages/snackbar/snackbar.test.js +17 -0
  564. package/dist/packages/snackbar/styles.d.ts +1 -0
  565. package/dist/packages/snackbar/styles.js +35 -0
  566. package/dist/packages/snackbar-item/react.d.ts +5 -0
  567. package/dist/packages/snackbar-item/react.js +16 -0
  568. package/dist/packages/snackbar-item/snackbar-item.d.ts +69 -0
  569. package/dist/packages/snackbar-item/snackbar-item.js +2620 -0
  570. package/dist/packages/snackbar-item/snackbar-item.js.map +7 -0
  571. package/dist/packages/snackbar-item/snackbar-item.react.test.d.ts +1 -0
  572. package/dist/packages/snackbar-item/snackbar-item.react.test.js +5 -0
  573. package/dist/packages/snackbar-item/styles.d.ts +1 -0
  574. package/dist/packages/snackbar-item/styles.js +133 -0
  575. package/dist/packages/step/react.d.ts +1 -1
  576. package/dist/packages/step/react.js +4 -4
  577. package/dist/packages/step/step.d.ts +2 -2
  578. package/dist/packages/step/step.hydration.test.d.ts +1 -1
  579. package/dist/packages/step/step.hydration.test.js +10 -10
  580. package/dist/packages/step/step.js +337 -315
  581. package/dist/packages/step/step.js.map +4 -4
  582. package/dist/packages/step-indicator/index.d.ts +2 -2
  583. package/dist/packages/step-indicator/index.js +2 -2
  584. package/dist/packages/step-indicator/react.d.ts +2 -2
  585. package/dist/packages/step-indicator/react.js +5 -5
  586. package/dist/packages/step-indicator/step-indicator.a11y.test.d.ts +2 -2
  587. package/dist/packages/step-indicator/step-indicator.a11y.test.js +48 -46
  588. package/dist/packages/step-indicator/step-indicator.d.ts +1 -1
  589. package/dist/packages/step-indicator/step-indicator.hydration.test.d.ts +1 -1
  590. package/dist/packages/step-indicator/step-indicator.hydration.test.js +10 -10
  591. package/dist/packages/step-indicator/step-indicator.js +285 -281
  592. package/dist/packages/step-indicator/step-indicator.js.map +3 -3
  593. package/dist/packages/step-indicator/stepindicator.react.stories.d.ts +2 -2
  594. package/dist/packages/step-indicator/stepindicator.react.stories.js +3 -3
  595. package/dist/packages/step-indicator/stepindicator.stories.d.ts +3 -3
  596. package/dist/packages/step-indicator/stepindicator.stories.js +129 -129
  597. package/dist/packages/step-indicator/styles.js +2 -2
  598. package/dist/packages/styles.js +277 -275
  599. package/dist/packages/switch/react.d.ts +1 -1
  600. package/dist/packages/switch/react.js +6 -6
  601. package/dist/packages/switch/styles.js +2 -2
  602. package/dist/packages/switch/switch.a11y.test.d.ts +1 -1
  603. package/dist/packages/switch/switch.a11y.test.js +46 -38
  604. package/dist/packages/switch/switch.d.ts +3 -3
  605. package/dist/packages/switch/switch.hydration.test.d.ts +1 -1
  606. package/dist/packages/switch/switch.hydration.test.js +23 -23
  607. package/dist/packages/switch/switch.js +304 -304
  608. package/dist/packages/switch/switch.js.map +3 -3
  609. package/dist/packages/switch/switch.react.stories.d.ts +2 -2
  610. package/dist/packages/switch/switch.react.stories.js +2 -2
  611. package/dist/packages/switch/switch.stories.d.ts +2 -2
  612. package/dist/packages/switch/switch.stories.js +42 -37
  613. package/dist/packages/switch/switch.test.d.ts +1 -1
  614. package/dist/packages/switch/switch.test.js +30 -35
  615. package/dist/packages/tab/react.d.ts +9 -7
  616. package/dist/packages/tab/react.js +11 -10
  617. package/dist/packages/tab/styles.d.ts +1 -0
  618. package/dist/packages/tab/styles.js +2 -0
  619. package/dist/packages/tab/tab.d.ts +6 -6
  620. package/dist/packages/tab/tab.hydration.test.d.ts +1 -1
  621. package/dist/packages/tab/tab.hydration.test.js +18 -12
  622. package/dist/packages/tab/tab.js +309 -308
  623. package/dist/packages/tab/tab.js.map +4 -4
  624. package/dist/packages/tab/tab.react.test.js +5 -3
  625. package/dist/packages/tab-panel/react.d.ts +3 -2
  626. package/dist/packages/tab-panel/react.js +11 -5
  627. package/dist/packages/tab-panel/tab-panel.d.ts +3 -3
  628. package/dist/packages/tab-panel/tab-panel.hydration.test.d.ts +1 -1
  629. package/dist/packages/tab-panel/tab-panel.hydration.test.js +13 -10
  630. package/dist/packages/tab-panel/tab-panel.js +293 -291
  631. package/dist/packages/tab-panel/tab-panel.js.map +3 -3
  632. package/dist/packages/tabs/index.d.ts +4 -4
  633. package/dist/packages/tabs/index.js +3 -3
  634. package/dist/packages/tabs/react.d.ts +27 -8
  635. package/dist/packages/tabs/react.js +30 -9
  636. package/dist/packages/tabs/styles.js +2 -2
  637. package/dist/packages/tabs/tabs.a11y.test.d.ts +3 -3
  638. package/dist/packages/tabs/tabs.a11y.test.js +188 -169
  639. package/dist/packages/tabs/tabs.d.ts +6 -5
  640. package/dist/packages/tabs/tabs.hydration.test.d.ts +3 -1
  641. package/dist/packages/tabs/tabs.hydration.test.js +22 -8
  642. package/dist/packages/tabs/tabs.js +293 -286
  643. package/dist/packages/tabs/tabs.js.map +3 -3
  644. package/dist/packages/tabs/tabs.react.stories.d.ts +12 -10
  645. package/dist/packages/tabs/tabs.react.stories.js +28 -28
  646. package/dist/packages/tabs/tabs.stories.d.ts +4 -4
  647. package/dist/packages/tabs/tabs.stories.js +101 -95
  648. package/dist/packages/tabs/tabs.test.d.ts +3 -3
  649. package/dist/packages/tabs/tabs.test.js +137 -123
  650. package/dist/packages/textarea/input-styles.d.ts +11 -0
  651. package/dist/packages/textarea/input-styles.js +88 -0
  652. package/dist/packages/textarea/react.d.ts +11 -11
  653. package/dist/packages/textarea/react.js +17 -17
  654. package/dist/packages/textarea/styles.js +2 -2
  655. package/dist/packages/textarea/textarea.a11y.test.d.ts +1 -1
  656. package/dist/packages/textarea/textarea.a11y.test.js +90 -58
  657. package/dist/packages/textarea/textarea.d.ts +11 -11
  658. package/dist/packages/textarea/textarea.hydration.test.d.ts +1 -1
  659. package/dist/packages/textarea/textarea.hydration.test.js +19 -19
  660. package/dist/packages/textarea/textarea.js +385 -304
  661. package/dist/packages/textarea/textarea.js.map +4 -4
  662. package/dist/packages/textarea/textarea.react.stories.d.ts +21 -21
  663. package/dist/packages/textarea/textarea.react.stories.js +13 -13
  664. package/dist/packages/textarea/textarea.react.test.js +7 -7
  665. package/dist/packages/textarea/textarea.stories.d.ts +3 -3
  666. package/dist/packages/textarea/textarea.stories.js +44 -42
  667. package/dist/packages/textarea/textarea.test.d.ts +1 -1
  668. package/dist/packages/textarea/textarea.test.js +124 -88
  669. package/dist/packages/textfield/input-styles.d.ts +11 -0
  670. package/dist/packages/textfield/input-styles.js +88 -0
  671. package/dist/packages/textfield/locales/da/messages.d.mts +1 -0
  672. package/dist/packages/textfield/locales/da/messages.mjs +1 -0
  673. package/dist/packages/textfield/locales/en/messages.d.mts +1 -0
  674. package/dist/packages/textfield/locales/en/messages.mjs +1 -0
  675. package/dist/packages/textfield/locales/fi/messages.d.mts +1 -0
  676. package/dist/packages/textfield/locales/fi/messages.mjs +1 -0
  677. package/dist/packages/textfield/locales/nb/messages.d.mts +1 -0
  678. package/dist/packages/textfield/locales/nb/messages.mjs +1 -0
  679. package/dist/packages/textfield/locales/sv/messages.d.mts +1 -0
  680. package/dist/packages/textfield/locales/sv/messages.mjs +1 -0
  681. package/dist/packages/textfield/react.d.ts +11 -11
  682. package/dist/packages/textfield/react.js +17 -17
  683. package/dist/packages/textfield/styles/w-textfield.styles.js +60 -58
  684. package/dist/packages/textfield/styles.js +2 -2
  685. package/dist/packages/textfield/textfield.d.ts +36 -26
  686. package/dist/packages/textfield/textfield.hydration.test.d.ts +1 -1
  687. package/dist/packages/textfield/textfield.hydration.test.js +19 -19
  688. package/dist/packages/textfield/textfield.js +468 -373
  689. package/dist/packages/textfield/textfield.js.map +4 -4
  690. package/dist/packages/textfield/textfield.react.stories.d.ts +21 -21
  691. package/dist/packages/textfield/textfield.react.stories.js +31 -31
  692. package/dist/packages/textfield/textfield.react.test.js +7 -7
  693. package/dist/packages/textfield/textfield.stories.d.ts +4 -4
  694. package/dist/packages/textfield/textfield.stories.js +107 -89
  695. package/dist/packages/textfield/textfield.test.d.ts +2 -2
  696. package/dist/packages/textfield/textfield.test.js +103 -71
  697. package/dist/packages/toast/api.d.ts +2 -2
  698. package/dist/packages/toast/api.js +3 -3
  699. package/dist/packages/toast/index.d.ts +5 -5
  700. package/dist/packages/toast/index.js +5 -5
  701. package/dist/packages/toast/styles.js +2 -2
  702. package/dist/packages/toast/toast.d.ts +5 -5
  703. package/dist/packages/toast/toast.js +349 -320
  704. package/dist/packages/toast/toast.js.map +4 -4
  705. package/dist/packages/toast/toast.stories.d.ts +5 -9
  706. package/dist/packages/toast/toast.stories.js +37 -33
  707. package/dist/packages/toast/toast.test.d.ts +1 -1
  708. package/dist/packages/toast/toast.test.js +48 -31
  709. package/dist/packages/toast/types.d.ts +1 -1
  710. package/dist/packages/toast-container/styles.d.ts +1 -0
  711. package/dist/packages/toast-container/styles.js +2 -0
  712. package/dist/packages/toast-container/toast-container.d.ts +2 -2
  713. package/dist/packages/toast-container/toast-container.js +295 -294
  714. package/dist/packages/toast-container/toast-container.js.map +4 -4
  715. package/dist/packages/utils/element-collapse.d.ts +12 -0
  716. package/dist/packages/utils/element-collapse.js +102 -0
  717. package/dist/packages/utils/expand-transition.d.ts +1 -1
  718. package/dist/packages/utils/expand-transition.js +12 -10
  719. package/dist/packages/utils/unstyled-heading.d.ts +1 -1
  720. package/dist/packages/utils/unstyled-heading.js +4 -4
  721. package/dist/packages/utils/window-exists.js +1 -1
  722. package/dist/packages/utils.js +2 -2
  723. package/dist/setup-tests.d.ts +3 -3
  724. package/dist/setup-tests.js +16 -13
  725. package/dist/tests/react-hydration.js +29 -30
  726. package/dist/tests/react-ssr-attributes.d.ts +1 -1
  727. package/dist/tests/react-ssr-attributes.js +4 -4
  728. package/dist/web-types.json +566 -301
  729. package/eik/index.js +96 -0
  730. package/package.json +35 -29
  731. package/dist/docs/modal-footer/accessibility.md +0 -1
  732. package/dist/docs/modal-footer/examples.md +0 -1
  733. package/dist/docs/modal-footer/usage.md +0 -1
  734. package/dist/docs/modal-header/accessibility.md +0 -1
  735. package/dist/docs/modal-header/examples.md +0 -1
  736. package/dist/docs/modal-header/usage.md +0 -1
  737. package/dist/docs/radio/accessibility.md +0 -1
  738. package/dist/docs/radio/examples.md +0 -1
  739. package/dist/docs/radio/usage.md +0 -1
  740. package/dist/packages/button/styles/w-button.styles.d.ts +0 -1
  741. package/dist/packages/button/styles/w-button.styles.js +0 -282
  742. package/dist/packages/link/styles/w-link.styles.js +0 -213
  743. /package/dist/packages/{link/styles/w-link.styles.d.ts → slider-thumb/styles.d.ts} +0 -0
@@ -0,0 +1,385 @@
1
+ # Snackbar (w-snackbar)
2
+
3
+ ## Description
4
+
5
+ A Snackbar shows brief user feedback messages that overlay content, with an optional action such as Undo.
6
+
7
+ Include one `<w-snackbar></w-snackbar>` in the document `<body>`. Use the `create` function to create messages.
8
+
9
+ ## Usage
10
+
11
+ Add `<w-snackbar>` as a direct child of `<body>`.
12
+
13
+ If you use a shared HTML template this may already have been done for you. You can check to see by running a query in your browser console:
14
+
15
+ ```js
16
+ // this should find an element,
17
+ // if not you should add <w-snackbar></w-snackbar> to <body>
18
+ document.querySelector("w-snackbar");
19
+ ```
20
+
21
+ `<w-snackbar>` sets up an ARIA live region that's ready for snackbar messages. We set this up ahead of time since some browsers and screen reader combinations have known issues when it comes to adding a live region and content at the same time.
22
+
23
+ ```html
24
+ <body>
25
+ <w-snackbar></w-snackbar>
26
+ </body>
27
+ ```
28
+
29
+ ### `<w-snackbar>` JS API
30
+
31
+ The `<w-snackbar>` element includes a [create function](#create) which you can use to create snackbar items.
32
+
33
+ ```js
34
+ const snackbar = document.querySelector("w-snackbar");
35
+ const snackbarItem = snackbar.create("Snackbar message");
36
+ ```
37
+
38
+ ### Snackbar item lifecycle
39
+
40
+ A snackbar item animates in from and out of the bottom of the screen unless the user has indicated a preference for reduced motion, in which case it appears and disappears without animation.
41
+
42
+ If more than one snackbar item is active at a time they will stack, with the new messages animating in above existing ones with the topmost item as the starting point of the animation.
43
+
44
+ However, only one snackbar item should be visible at a time. Be mindful of what triggers snackbars in your application to avoid creating a wall of snackbar items, for example in bulk editing operations.
45
+
46
+ #### Duration
47
+
48
+ Snackbar items automatically close after either:
49
+
50
+ - 4 seconds (short)
51
+ - 10 seconds (long)
52
+
53
+ You can also have a snackbar item last indefinitely, forcing users to dismiss it. We strongly encourage you to reconsider whether a snackbar is the right choice for you if you feel you need an indefinite snackbar item though, for the accessibility reasons outlined above.
54
+
55
+ ##### Pausing the countdown
56
+
57
+ To give people a better chance to read the snackbar message and consider taking action the duration countdown timer pauses when:
58
+
59
+ - A pointer hovers over the snackbar item.
60
+ - Either the action or close buttons have keyboard focus.
61
+
62
+ #### Closing
63
+
64
+ Users can close a snackbar item ahead of its configured duration by:
65
+
66
+ - Pressing the close button (present by default).
67
+ - Pressing the action button (if present).
68
+ - Pressing <kbd>Escape</kbd> on a keyboard.
69
+
70
+ ## Accessibility
71
+
72
+ From an accessibility perspective the snackbar component is problematic.
73
+
74
+ - Since the snackbar items disappear on their own users might not even see them, especially when zoomed in.
75
+ - The snackbar items are in practice impossible to reach with keyboard since they appear in the DOM away from the element that triggered them.
76
+ - Important elements on the page might get hidden behind the snackbar item.
77
+
78
+ A snackbar must never be the backbone of your user experience, it should only ever include information and actions that are available elsewhere.
79
+
80
+ - Keep messages and actions short since the snackbar item is available only for a short time.
81
+ - Ensure any information and action in the snackbar, such as Undo, is possible to do elsewhere.
82
+
83
+ `<w-snackbar>` creates an ARIA live region so messages you add to the snackbar get announced to assistive technologies.
84
+
85
+ ### Keyboard behavior
86
+
87
+ `<w-snackbar>` is problematic from a keyboard user perspective. We do not override the default <kbd>Tab</kbd> behavior, with the result that the focusable buttons in a snackbar item probably come first or last in the focus order, depending on what end of `<body>` you put `<w-snackbar>`. We're investigating ways to provide keyboard shortcuts for moving focus to the snackbar item, but have yet to conclude on a design.
88
+
89
+ `<w-snackbar>` sets up a keyboard event listener on `document`. Pressing <kbd>Escape</kbd> while a snackbar item is open will close it. If more than one item is open the oldest one will close.
90
+
91
+ ## Examples
92
+
93
+ ### Default
94
+
95
+ Snackbar uses the `neutral` variant with a short duration by default.
96
+
97
+ <elements-example>
98
+
99
+ ```html
100
+ <w-button data-testid="neutral-noaction">Neutral variant</w-button>
101
+
102
+ <script>
103
+ document.querySelector('w-button[data-testid="neutral-noaction"]').onclick = () => {
104
+ const snackbar = document.querySelector("w-snackbar");
105
+ snackbar.create("Snackbar message");
106
+ };
107
+ </script>
108
+ ```
109
+
110
+ </elements-example>
111
+
112
+ #### With action
113
+
114
+ You can include an action in the snackbar by providing a label and an onclick handler. By default the action button and close button are inline with the text.
115
+
116
+ Clicking an action button automatically closes the snackbar item. If you want to prevent this call `event.preventDefault()`.
117
+
118
+ You can use an action with any `variant`.
119
+
120
+ <elements-example>
121
+
122
+ ```html
123
+ <w-button data-testid="neutral-action">Neutral variant with action</w-button>
124
+
125
+ <script>
126
+ document.querySelector('w-button[data-testid="neutral-action"]').onclick = () => {
127
+ const snackbar = document.querySelector("w-snackbar");
128
+ snackbar.create("Snackbar message", {
129
+ action: {
130
+ label: "Undo",
131
+ onclick(e) {
132
+ console.log(e);
133
+ }
134
+ }
135
+ });
136
+ };
137
+ </script>
138
+ ```
139
+
140
+ </elements-example>
141
+
142
+ #### With long action label
143
+
144
+ By default a long label will result in the action and close buttons on a separate row. A label gets treated as long if it contains whitespace.
145
+
146
+ Clicking an action button automatically closes the snackbar item. If you want to prevent this call `event.preventDefault()`.
147
+
148
+ You can use an action with any `variant`.
149
+
150
+ <elements-example>
151
+
152
+ ```html
153
+ <w-button data-testid="neutral-longlabel">Neutral variant, long label</w-button>
154
+
155
+ <script>
156
+ document.querySelector('w-button[data-testid="neutral-longlabel"]').onclick = () => {
157
+ const snackbar = document.querySelector("w-snackbar");
158
+ snackbar.create("Snackbar message", {
159
+ action: {
160
+ label: "Undo this thing",
161
+ onclick(e) {
162
+ console.log(e);
163
+ }
164
+ }
165
+ });
166
+ };
167
+ </script>
168
+ ```
169
+
170
+ </elements-example>
171
+
172
+ ### Positive
173
+
174
+ <elements-example>
175
+
176
+ ```html
177
+ <w-button data-testid="positive-noaction">Positive variant</w-button>
178
+
179
+ <script>
180
+ document.querySelector('w-button[data-testid="positive-noaction"]').onclick = () => {
181
+ const snackbar = document.querySelector("w-snackbar");
182
+ snackbar.create("Snackbar message", {
183
+ variant: "positive",
184
+ });
185
+ };
186
+ </script>
187
+ ```
188
+
189
+ </elements-example>
190
+
191
+ ### Warning
192
+
193
+ <elements-example>
194
+
195
+ ```html
196
+ <w-button data-testid="warning-noaction">Warning variant</w-button>
197
+
198
+ <script>
199
+ document.querySelector('w-button[data-testid="warning-noaction"]').onclick = () => {
200
+ const snackbar = document.querySelector("w-snackbar");
201
+ snackbar.create("Snackbar message", {
202
+ variant: "warning",
203
+ });
204
+ };
205
+ </script>
206
+ ```
207
+
208
+ </elements-example>
209
+
210
+ ### Negative
211
+
212
+ <elements-example>
213
+
214
+ ```html
215
+ <w-button data-testid="negative-noaction">Negative variant</w-button>
216
+
217
+ <script>
218
+ document.querySelector('w-button[data-testid="negative-noaction"]').onclick = () => {
219
+ const snackbar = document.querySelector("w-snackbar");
220
+ snackbar.create("Snackbar message", {
221
+ variant: "negative",
222
+ });
223
+ };
224
+ </script>
225
+ ```
226
+
227
+ </elements-example>
228
+
229
+ ### Info
230
+
231
+ <elements-example>
232
+
233
+ ```html
234
+ <w-button data-testid="info-noaction">Info variant</w-button>
235
+
236
+ <script>
237
+ document.querySelector('w-button[data-testid="info-noaction"]').onclick = () => {
238
+ const snackbar = document.querySelector("w-snackbar");
239
+ snackbar.create("Snackbar message", {
240
+ variant: "info",
241
+ });
242
+ };
243
+ </script>
244
+ ```
245
+
246
+ </elements-example>
247
+
248
+ ### Neutral with custom icon
249
+
250
+ If you have cases not covered by the `create` API you can change the item returned by `create`.
251
+
252
+ For example, here is how you can add a custom icon to the neutral variant.
253
+
254
+ ```ts
255
+ const snackbar = document.querySelector<WarpSnackbar>('w-snackbar');
256
+
257
+ // the default neutral variant is without an icon
258
+ const snackbarItem = snackbar!.create('The message should be short');
259
+
260
+ const customIcon = document.createElement('w-icon');
261
+ customIcon.name = 'Rocket';
262
+ customIcon.slot = 'icon';
263
+ snackbarItem.prepend(customIcon);
264
+ ```
265
+
266
+ ### Create `<w-snackbar-item>` manually
267
+
268
+ Alternatively you can create a `w-snackbar-item` manually and call [prepend](https://developer.mozilla.org/en-US/docs/Web/API/Element/prepend) on `<w-snackbar>`. The snackbar item handles its entire lifecycle on its own.
269
+
270
+ Note that by not using `snackbar.create()` you have to create and wire up event handlers any close- and action button.
271
+
272
+ ```ts
273
+ const snackbar = document.querySelector("w-snackbar");
274
+ const item = document.createElement("w-snackbar-item");
275
+ item.variant = "info";
276
+ item.innerHTML = /* html */ `
277
+ <w-icon slot="icon" name="Rocket"></w-icon>
278
+ Warp speed engaged!
279
+ `;
280
+ snackbar.prepend(item);
281
+ ```
282
+
283
+ ## Styling
284
+
285
+ Snackbar supports styling through **component tokens** (CSS custom properties with a --w-c- prefix) and **parts**.
286
+
287
+ ### Parts
288
+
289
+ Use `::part(...)` from outside the component.
290
+
291
+ #### `<w-snackbar>` parts
292
+
293
+ - `container` - the live region that positions messages on the screen.
294
+
295
+ #### `<w-snackbar-item>` parts
296
+
297
+ - `item` - the container wrapping the message, icon and actions.
298
+ - `icon` - the icon for the variant.
299
+ - `message` - the default slot, body of the snackbar item.
300
+ - `action` - close and action button.
301
+
302
+ ### Component tokens
303
+
304
+ #### `<w-snackbar>` tokens
305
+
306
+ Set these on `w-snackbar` to override visuals.
307
+
308
+ ```css
309
+ w-snackbar {
310
+ --w-c-snackbar-position-bottom: 32px;
311
+ }
312
+ ```
313
+
314
+ ##### Layout and typography
315
+
316
+ - `--w-c-snackbar-container-gap`
317
+ - `--w-c-snackbar-position-bottom`
318
+ - `--w-c-snackbar-position-left`
319
+ - `--w-c-snackbar-position-right`
320
+ - `--w-c-snackbar-position-top`
321
+ - `--w-c-snackbar-z-index`
322
+
323
+ #### `<w-snackbar-item>` tokens
324
+
325
+ Set these on `w-snackbar-item` to override visuals.
326
+
327
+ ```css
328
+ w-snackbar-item {
329
+ --w-c-snackbar-item-box-shadow: var(--w-shadow-s);
330
+ }
331
+ ```
332
+
333
+ ##### Layout and typography
334
+
335
+ - `--w-c-snackbar-item-radius`
336
+ - `--w-c-snackbar-item-max-width`
337
+ - `--w-c-snackbar-item-min-width`
338
+ - `--w-c-snackbar-item-padding`
339
+
340
+ ##### Background
341
+
342
+ - `--w-c-snackbar-item-bg`
343
+ - `--w-c-snackbar-item-action-bg-active`
344
+ - `--w-c-snackbar-item-action-bg-hover`
345
+
346
+ ##### Text color
347
+
348
+ - `--w-c-snackbar-item-color`
349
+ - `--w-c-snackbar-item-action-color-active`
350
+ - `--w-c-snackbar-item-action-color-hover`
351
+
352
+ ##### Shadow
353
+
354
+ - `--w-c-snackbar-item-box-shadow`
355
+
356
+ ## `<w-snackbar>` API
357
+
358
+ Unless otherwise noted all properties are HTML attributes (as opposed to JavaScript object properties).
359
+
360
+ ### Properties
361
+
362
+ | Name | Type | Default | Summary |
363
+ |-|-|-|-|
364
+ | create (JS only) | `create(message: string, options: CreateSnackbarOptions = {}) => void` | `-` | Creates a snackbar item and immediately adds it to the snackbar. |
365
+
366
+ ### Property Details
367
+
368
+ #### create (JS only)
369
+
370
+ Creates a snackbar item and immediately adds it to the snackbar.
371
+
372
+ By default the snackbar item automatically closes after 4 seconds (`SnackbarDuration.Short`).
373
+
374
+ If you include an `action` in the options the default `duration` is
375
+ set to 10 seconds (`SnackbarDuration.Long`) and can not be made shorter.
376
+
377
+ A `duration` of 10 seconds or longer forces the close button to be visible.
378
+
379
+ The default `variant` is `neutral` which does not have an icon.
380
+
381
+ Set `duration` to `SnackbarDuration.Infinite` if you want a persistent message.
382
+
383
+ - Type: `create(message: string, options: CreateSnackbarOptions = {}) => void`
384
+ - Default: `-`
385
+
@@ -0,0 +1,72 @@
1
+ ## Styling
2
+
3
+ Snackbar supports styling through **component tokens** (CSS custom properties with a --w-c- prefix) and **parts**.
4
+
5
+ ### Parts
6
+
7
+ Use `::part(...)` from outside the component.
8
+
9
+ #### `<w-snackbar>` parts
10
+
11
+ - `container` - the live region that positions messages on the screen.
12
+
13
+ #### `<w-snackbar-item>` parts
14
+
15
+ - `item` - the container wrapping the message, icon and actions.
16
+ - `icon` - the icon for the variant.
17
+ - `message` - the default slot, body of the snackbar item.
18
+ - `action` - close and action button.
19
+
20
+ ### Component tokens
21
+
22
+ #### `<w-snackbar>` tokens
23
+
24
+ Set these on `w-snackbar` to override visuals.
25
+
26
+ ```css
27
+ w-snackbar {
28
+ --w-c-snackbar-position-bottom: 32px;
29
+ }
30
+ ```
31
+
32
+ ##### Layout and typography
33
+
34
+ - `--w-c-snackbar-container-gap`
35
+ - `--w-c-snackbar-position-bottom`
36
+ - `--w-c-snackbar-position-left`
37
+ - `--w-c-snackbar-position-right`
38
+ - `--w-c-snackbar-position-top`
39
+ - `--w-c-snackbar-z-index`
40
+
41
+ #### `<w-snackbar-item>` tokens
42
+
43
+ Set these on `w-snackbar-item` to override visuals.
44
+
45
+ ```css
46
+ w-snackbar-item {
47
+ --w-c-snackbar-item-box-shadow: var(--w-shadow-s);
48
+ }
49
+ ```
50
+
51
+ ##### Layout and typography
52
+
53
+ - `--w-c-snackbar-item-radius`
54
+ - `--w-c-snackbar-item-max-width`
55
+ - `--w-c-snackbar-item-min-width`
56
+ - `--w-c-snackbar-item-padding`
57
+
58
+ ##### Background
59
+
60
+ - `--w-c-snackbar-item-bg`
61
+ - `--w-c-snackbar-item-action-bg-active`
62
+ - `--w-c-snackbar-item-action-bg-hover`
63
+
64
+ ##### Text color
65
+
66
+ - `--w-c-snackbar-item-color`
67
+ - `--w-c-snackbar-item-action-color-active`
68
+ - `--w-c-snackbar-item-action-color-hover`
69
+
70
+ ##### Shadow
71
+
72
+ - `--w-c-snackbar-item-box-shadow`
@@ -0,0 +1,60 @@
1
+ ## Usage
2
+
3
+ Add `<w-snackbar>` as a direct child of `<body>`.
4
+
5
+ If you use a shared HTML template this may already have been done for you. You can check to see by running a query in your browser console:
6
+
7
+ ```js
8
+ // this should find an element,
9
+ // if not you should add <w-snackbar></w-snackbar> to <body>
10
+ document.querySelector("w-snackbar");
11
+ ```
12
+
13
+ `<w-snackbar>` sets up an ARIA live region that's ready for snackbar messages. We set this up ahead of time since some browsers and screen reader combinations have known issues when it comes to adding a live region and content at the same time.
14
+
15
+ ```html
16
+ <body>
17
+ <w-snackbar></w-snackbar>
18
+ </body>
19
+ ```
20
+
21
+ ### `<w-snackbar>` JS API
22
+
23
+ The `<w-snackbar>` element includes a [create function](#create) which you can use to create snackbar items.
24
+
25
+ ```js
26
+ const snackbar = document.querySelector("w-snackbar");
27
+ const snackbarItem = snackbar.create("Snackbar message");
28
+ ```
29
+
30
+ ### Snackbar item lifecycle
31
+
32
+ A snackbar item animates in from and out of the bottom of the screen unless the user has indicated a preference for reduced motion, in which case it appears and disappears without animation.
33
+
34
+ If more than one snackbar item is active at a time they will stack, with the new messages animating in above existing ones with the topmost item as the starting point of the animation.
35
+
36
+ However, only one snackbar item should be visible at a time. Be mindful of what triggers snackbars in your application to avoid creating a wall of snackbar items, for example in bulk editing operations.
37
+
38
+ #### Duration
39
+
40
+ Snackbar items automatically close after either:
41
+
42
+ - 4 seconds (short)
43
+ - 10 seconds (long)
44
+
45
+ You can also have a snackbar item last indefinitely, forcing users to dismiss it. We strongly encourage you to reconsider whether a snackbar is the right choice for you if you feel you need an indefinite snackbar item though, for the accessibility reasons outlined above.
46
+
47
+ ##### Pausing the countdown
48
+
49
+ To give people a better chance to read the snackbar message and consider taking action the duration countdown timer pauses when:
50
+
51
+ - A pointer hovers over the snackbar item.
52
+ - Either the action or close buttons have keyboard focus.
53
+
54
+ #### Closing
55
+
56
+ Users can close a snackbar item ahead of its configured duration by:
57
+
58
+ - Pressing the close button (present by default).
59
+ - Pressing the action button (if present).
60
+ - Pressing <kbd>Escape</kbd> on a keyboard.
@@ -0,0 +1,41 @@
1
+ ### `<w-snackbar-item>` API
2
+
3
+ #### Properties
4
+
5
+ | Name | Type | Default | Summary |
6
+ |-|-|-|-|
7
+ | action-placement | [`SnackbarActionPlacement`](#snackbaractionplacement) | `"inline"` | The placement of the action and close buttons. |
8
+ | close (JS only) | `close() => void` | `-` | Remove the snackbar item from the document. |
9
+ | duration | `number` | `-` | How long the message should stay in the document before removing itself. |
10
+
11
+ #### Property Details
12
+
13
+ ##### action-placement
14
+
15
+ The placement of the action and close buttons.
16
+
17
+ - Type: [`SnackbarActionPlacement`](#snackbaractionplacement)
18
+ - Default: `"inline"`
19
+
20
+ ##### close (JS only)
21
+
22
+ Remove the snackbar item from the document.
23
+
24
+ Moves focus to the last focused element outside of the snackbar item, if available.
25
+
26
+ - Type: `close() => void`
27
+ - Default: `-`
28
+
29
+ ##### duration
30
+
31
+ How long the message should stay in the document before removing itself.
32
+
33
+ - Type: `number`
34
+ - Default: `-`
35
+
36
+ #### Types
37
+
38
+ ##### SnackbarActionPlacement
39
+
40
+ `'inline' | 'block'`
41
+
@@ -0,0 +1,49 @@
1
+ # SnackbarItem (w-snackbar-item)
2
+
3
+ ## Description
4
+
5
+ An item to show in a `w-snackbar`.
6
+
7
+ See the `create` function on `w-snackbar` for a convenience API which helps you make snackbar items.
8
+
9
+ ### `<w-snackbar-item>` API
10
+
11
+ #### Properties
12
+
13
+ | Name | Type | Default | Summary |
14
+ |-|-|-|-|
15
+ | action-placement | [`SnackbarActionPlacement`](#snackbaractionplacement) | `"inline"` | The placement of the action and close buttons. |
16
+ | close (JS only) | `close() => void` | `-` | Remove the snackbar item from the document. |
17
+ | duration | `number` | `-` | How long the message should stay in the document before removing itself. |
18
+
19
+ #### Property Details
20
+
21
+ ##### action-placement
22
+
23
+ The placement of the action and close buttons.
24
+
25
+ - Type: [`SnackbarActionPlacement`](#snackbaractionplacement)
26
+ - Default: `"inline"`
27
+
28
+ ##### close (JS only)
29
+
30
+ Remove the snackbar item from the document.
31
+
32
+ Moves focus to the last focused element outside of the snackbar item, if available.
33
+
34
+ - Type: `close() => void`
35
+ - Default: `-`
36
+
37
+ ##### duration
38
+
39
+ How long the message should stay in the document before removing itself.
40
+
41
+ - Type: `number`
42
+ - Default: `-`
43
+
44
+ #### Types
45
+
46
+ ##### SnackbarActionPlacement
47
+
48
+ `'inline' | 'block'`
49
+
@@ -6,6 +6,8 @@
6
6
  |-|-|-|-|
7
7
  | active | `boolean` | `false` | Whether this step is active. |
8
8
  | completed | `boolean` | `false` | Whether this step is completed. |
9
+ | getAriaLabel (JS only) | `getAriaLabel() => void` | `-` | - |
10
+ | setContext (JS only) | `setContext(context: StepsContext) => void` | `-` | - |
9
11
 
10
12
  #### Property Details
11
13
 
@@ -27,3 +29,17 @@ Completed steps display a checkmark icon and a filled indicator.
27
29
  - Type: `boolean`
28
30
  - Default: `false`
29
31
 
32
+ ##### getAriaLabel (JS only)
33
+
34
+
35
+
36
+ - Type: `getAriaLabel() => void`
37
+ - Default: `-`
38
+
39
+ ##### setContext (JS only)
40
+
41
+
42
+
43
+ - Type: `setContext(context: StepsContext) => void`
44
+ - Default: `-`
45
+
@@ -12,6 +12,8 @@ Individual step component that shows a single step in a process
12
12
  |-|-|-|-|
13
13
  | active | `boolean` | `false` | Whether this step is active. |
14
14
  | completed | `boolean` | `false` | Whether this step is completed. |
15
+ | getAriaLabel (JS only) | `getAriaLabel() => void` | `-` | - |
16
+ | setContext (JS only) | `setContext(context: StepsContext) => void` | `-` | - |
15
17
 
16
18
  #### Property Details
17
19
 
@@ -33,3 +35,17 @@ Completed steps display a checkmark icon and a filled indicator.
33
35
  - Type: `boolean`
34
36
  - Default: `false`
35
37
 
38
+ ##### getAriaLabel (JS only)
39
+
40
+
41
+
42
+ - Type: `getAriaLabel() => void`
43
+ - Default: `-`
44
+
45
+ ##### setContext (JS only)
46
+
47
+
48
+
49
+ - Type: `setContext(context: StepsContext) => void`
50
+ - Default: `-`
51
+
@@ -103,6 +103,8 @@ Each `<w-step>` can be marked as `active` or `completed` to indicate progress. T
103
103
 
104
104
  </elements-example>
105
105
 
106
+ ## Styling API
107
+
106
108
  ## `<w-step-indicator>` API
107
109
 
108
110
  Unless otherwise noted all properties are HTML attributes (as opposed to JavaScript object properties).
@@ -0,0 +1 @@
1
+ ## Styling API
@@ -9,6 +9,7 @@ Unless otherwise noted all properties are HTML attributes (as opposed to JavaScr
9
9
  | checked | `boolean` | `false` | Whether the switch is on (checked). |
10
10
  | disabled | `boolean` | `false` | Whether the switch is disabled. |
11
11
  | name | `string` | `-` | Name used when submitting an HTML form. |
12
+ | resetFormControl (JS only) | `resetFormControl() => void` | `-` | - |
12
13
  | value | `string` | `-` | Value submitted when the switch is checked. |
13
14
 
14
15
  ### Property Details
@@ -34,6 +35,13 @@ Name used when submitting an HTML form.
34
35
  - Type: `string`
35
36
  - Default: `-`
36
37
 
38
+ #### resetFormControl (JS only)
39
+
40
+
41
+
42
+ - Type: `resetFormControl() => void`
43
+ - Default: `-`
44
+
37
45
  #### value
38
46
 
39
47
  Value submitted when the switch is checked.
@@ -0,0 +1 @@
1
+ ## Styling API