@warp-ds/elements 2.10.0-next.9 → 2.10.1-next.1

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 (724) hide show
  1. package/dist/.storybook/utilities.js +4 -4
  2. package/dist/api.js.map +2 -2
  3. package/dist/custom-elements.json +1211 -542
  4. package/dist/docs/affix/affix.md +111 -2
  5. package/dist/docs/affix/api.md +2 -2
  6. package/dist/docs/affix/styling.md +107 -0
  7. package/dist/docs/alert/alert.md +5 -5
  8. package/dist/docs/alert/api.md +4 -4
  9. package/dist/docs/attention/api.md +50 -2
  10. package/dist/docs/attention/attention.md +53 -3
  11. package/dist/docs/badge/api.md +50 -4
  12. package/dist/docs/badge/badge.md +50 -4
  13. package/dist/docs/box/api.md +2 -2
  14. package/dist/docs/box/box.md +4 -2
  15. package/dist/docs/breadcrumb-item/api.md +27 -0
  16. package/dist/docs/breadcrumb-item/breadcrumb-item.md +36 -0
  17. package/dist/docs/breadcrumbs/accessibility.md +8 -18
  18. package/dist/docs/breadcrumbs/breadcrumbs.md +123 -34
  19. package/dist/docs/breadcrumbs/examples.md +8 -8
  20. package/dist/docs/breadcrumbs/styling.md +96 -0
  21. package/dist/docs/breadcrumbs/usage.md +8 -8
  22. package/dist/docs/button/api.md +32 -24
  23. package/dist/docs/button/button.md +35 -24
  24. package/dist/docs/card/api.md +8 -0
  25. package/dist/docs/card/card.md +10 -0
  26. package/dist/docs/checkbox/api.md +52 -13
  27. package/dist/docs/checkbox/checkbox.md +231 -14
  28. package/dist/docs/checkbox/styling.md +173 -0
  29. package/dist/docs/checkbox-group/api.md +30 -6
  30. package/dist/docs/checkbox-group/checkbox-group.md +66 -36
  31. package/dist/docs/checkbox-group/styling.md +31 -29
  32. package/dist/docs/combobox/api.md +20 -12
  33. package/dist/docs/combobox/combobox.md +22 -12
  34. package/dist/docs/datepicker/api.md +22 -14
  35. package/dist/docs/datepicker/datepicker.md +24 -16
  36. package/dist/docs/expandable/api.md +6 -6
  37. package/dist/docs/expandable/expandable.md +8 -6
  38. package/dist/docs/icon/api.md +4 -4
  39. package/dist/docs/icon/icon.md +5 -5
  40. package/dist/docs/index.md +35 -32
  41. package/dist/docs/link/api.md +10 -10
  42. package/dist/docs/link/link.md +13 -11
  43. package/dist/docs/modal/api.md +20 -2
  44. package/dist/docs/modal/modal.md +101 -10
  45. package/dist/docs/modal/styling.md +75 -0
  46. package/dist/docs/modal/usage.md +4 -8
  47. package/dist/docs/modal-footer/modal-footer.md +2 -0
  48. package/dist/docs/modal-header/modal-header.md +2 -0
  49. package/dist/docs/page-indicator/page-indicator.md +2 -0
  50. package/dist/docs/pagination/api.md +4 -4
  51. package/dist/docs/pagination/pagination.md +6 -4
  52. package/dist/docs/pill/api.md +8 -8
  53. package/dist/docs/pill/pill.md +10 -8
  54. package/dist/docs/radio/radio.md +5 -1
  55. package/dist/docs/radio-group/api.md +4 -4
  56. package/dist/docs/radio-group/radio-group.md +186 -69
  57. package/dist/docs/radio-group/styling.md +179 -64
  58. package/dist/docs/select/api.md +10 -10
  59. package/dist/docs/select/select.md +103 -10
  60. package/dist/docs/select/styling.md +91 -0
  61. package/dist/docs/slider/api.md +38 -22
  62. package/dist/docs/slider/slider.md +40 -22
  63. package/dist/docs/slider-thumb/api.md +28 -12
  64. package/dist/docs/slider-thumb/slider-thumb.md +28 -12
  65. package/dist/docs/snackbar/accessibility.md +20 -0
  66. package/dist/docs/snackbar/api.md +30 -0
  67. package/dist/docs/snackbar/examples.md +191 -0
  68. package/dist/docs/snackbar/snackbar.md +387 -0
  69. package/dist/docs/snackbar/styling.md +72 -0
  70. package/dist/docs/snackbar/usage.md +60 -0
  71. package/dist/docs/snackbar-item/api.md +41 -0
  72. package/dist/docs/snackbar-item/snackbar-item.md +51 -0
  73. package/dist/docs/step/api.md +16 -0
  74. package/dist/docs/step/step.md +19 -1
  75. package/dist/docs/step-indicator/step-indicator.md +2 -0
  76. package/dist/docs/switch/api.md +8 -0
  77. package/dist/docs/switch/switch.md +10 -0
  78. package/dist/docs/tab/tab.md +2 -0
  79. package/dist/docs/tab-panel/tab-panel.md +3 -0
  80. package/dist/docs/tabs/api.md +3 -3
  81. package/dist/docs/tabs/tabs.md +5 -3
  82. package/dist/docs/textarea/api.md +54 -14
  83. package/dist/docs/textarea/styling.md +91 -0
  84. package/dist/docs/textarea/textarea.md +146 -19
  85. package/dist/docs/textfield/api.md +74 -34
  86. package/dist/docs/textfield/styling.md +95 -0
  87. package/dist/docs/textfield/textfield.md +171 -34
  88. package/dist/entrypoint-react.d.ts +38 -0
  89. package/dist/entrypoint-react.js +39 -0
  90. package/dist/index.d.ts +1007 -154
  91. package/dist/packages/affix/affix-styles.d.ts +8 -0
  92. package/dist/packages/affix/affix-styles.js +108 -0
  93. package/dist/packages/affix/affix.d.ts +12 -14
  94. package/dist/packages/affix/affix.hydration.test.d.ts +1 -1
  95. package/dist/packages/affix/affix.hydration.test.js +15 -15
  96. package/dist/packages/affix/affix.js +451 -320
  97. package/dist/packages/affix/affix.js.map +4 -4
  98. package/dist/packages/affix/affix.react.stories.d.ts +3 -3
  99. package/dist/packages/affix/affix.react.stories.js +3 -3
  100. package/dist/packages/affix/affix.react.test.js +5 -3
  101. package/dist/packages/affix/affix.stories.d.ts +3 -3
  102. package/dist/packages/affix/affix.stories.js +10 -10
  103. package/dist/packages/affix/affix.test.d.ts +1 -1
  104. package/dist/packages/affix/affix.test.js +10 -10
  105. package/dist/packages/affix/react.d.ts +8 -3
  106. package/dist/packages/affix/react.js +11 -6
  107. package/dist/packages/affix/styles.js +2 -2
  108. package/dist/packages/alert/alert.d.ts +9 -6
  109. package/dist/packages/alert/alert.hydration.test.d.ts +1 -1
  110. package/dist/packages/alert/alert.hydration.test.js +21 -21
  111. package/dist/packages/alert/alert.js +349 -324
  112. package/dist/packages/alert/alert.js.map +3 -3
  113. package/dist/packages/alert/alert.react.stories.d.ts +2 -2
  114. package/dist/packages/alert/alert.react.stories.js +13 -13
  115. package/dist/packages/alert/alert.stories.d.ts +4 -4
  116. package/dist/packages/alert/alert.stories.js +29 -27
  117. package/dist/packages/alert/alert.test.d.ts +1 -1
  118. package/dist/packages/alert/alert.test.js +34 -21
  119. package/dist/packages/alert/react.d.ts +8 -1
  120. package/dist/packages/alert/react.js +11 -4
  121. package/dist/packages/alert/styles.js +2 -2
  122. package/dist/packages/attention/attention.d.ts +14 -7
  123. package/dist/packages/attention/attention.hydration.test.d.ts +1 -1
  124. package/dist/packages/attention/attention.hydration.test.js +29 -29
  125. package/dist/packages/attention/attention.js +1744 -1681
  126. package/dist/packages/attention/attention.js.map +4 -4
  127. package/dist/packages/attention/attention.react.stories.d.ts +3 -3
  128. package/dist/packages/attention/attention.react.stories.js +13 -13
  129. package/dist/packages/attention/attention.react.test.js +11 -7
  130. package/dist/packages/attention/attention.stories.d.ts +4 -4
  131. package/dist/packages/attention/attention.stories.js +126 -117
  132. package/dist/packages/attention/attention.test.d.ts +1 -1
  133. package/dist/packages/attention/attention.test.js +18 -10
  134. package/dist/packages/attention/layout-styles.js +900 -900
  135. package/dist/packages/attention/react.d.ts +16 -6
  136. package/dist/packages/attention/react.js +22 -11
  137. package/dist/packages/attention/styles.js +2 -2
  138. package/dist/packages/badge/badge.d.ts +8 -3
  139. package/dist/packages/badge/badge.hydration.test.d.ts +1 -1
  140. package/dist/packages/badge/badge.hydration.test.js +25 -25
  141. package/dist/packages/badge/badge.js +281 -281
  142. package/dist/packages/badge/badge.js.map +3 -3
  143. package/dist/packages/badge/badge.react.stories.d.ts +3 -3
  144. package/dist/packages/badge/badge.react.stories.js +17 -17
  145. package/dist/packages/badge/badge.stories.d.ts +3 -3
  146. package/dist/packages/badge/badge.stories.js +22 -20
  147. package/dist/packages/badge/badge.test.d.ts +1 -1
  148. package/dist/packages/badge/badge.test.js +13 -11
  149. package/dist/packages/badge/react.d.ts +6 -1
  150. package/dist/packages/badge/react.js +9 -4
  151. package/dist/packages/badge/styles.js +2 -2
  152. package/dist/packages/box/box.d.ts +7 -2
  153. package/dist/packages/box/box.hydration.test.d.ts +1 -1
  154. package/dist/packages/box/box.hydration.test.js +14 -14
  155. package/dist/packages/box/box.js +288 -288
  156. package/dist/packages/box/box.js.map +3 -3
  157. package/dist/packages/box/box.react.stories.d.ts +4 -4
  158. package/dist/packages/box/box.react.stories.js +8 -8
  159. package/dist/packages/box/box.stories.d.ts +3 -3
  160. package/dist/packages/box/box.stories.js +25 -19
  161. package/dist/packages/box/box.test.d.ts +1 -1
  162. package/dist/packages/box/box.test.js +6 -6
  163. package/dist/packages/box/react.d.ts +6 -1
  164. package/dist/packages/box/react.js +9 -4
  165. package/dist/packages/box/slot.test.d.ts +1 -1
  166. package/dist/packages/box/slot.test.js +6 -6
  167. package/dist/packages/box/styles.js +2 -2
  168. package/dist/packages/breadcrumb-item/breadcrumb-item.d.ts +34 -0
  169. package/dist/packages/breadcrumb-item/breadcrumb-item.js +2529 -0
  170. package/dist/packages/breadcrumb-item/breadcrumb-item.js.map +7 -0
  171. package/dist/packages/breadcrumb-item/react.d.ts +8 -0
  172. package/dist/packages/breadcrumb-item/react.js +17 -0
  173. package/dist/packages/breadcrumb-item/styles.d.ts +4 -0
  174. package/dist/packages/breadcrumb-item/styles.js +81 -0
  175. package/dist/packages/breadcrumbs/breadcrumbs.d.ts +11 -4
  176. package/dist/packages/breadcrumbs/breadcrumbs.hydration.test.d.ts +1 -1
  177. package/dist/packages/breadcrumbs/breadcrumbs.hydration.test.js +55 -49
  178. package/dist/packages/breadcrumbs/breadcrumbs.js +288 -284
  179. package/dist/packages/breadcrumbs/breadcrumbs.js.map +4 -4
  180. package/dist/packages/breadcrumbs/breadcrumbs.react.stories.d.ts +4 -4
  181. package/dist/packages/breadcrumbs/breadcrumbs.react.stories.js +17 -16
  182. package/dist/packages/breadcrumbs/breadcrumbs.stories.d.ts +7 -8
  183. package/dist/packages/breadcrumbs/breadcrumbs.stories.js +30 -26
  184. package/dist/packages/breadcrumbs/breadcrumbs.test.d.ts +1 -1
  185. package/dist/packages/breadcrumbs/breadcrumbs.test.js +19 -17
  186. package/dist/packages/breadcrumbs/react.d.ts +8 -1
  187. package/dist/packages/breadcrumbs/react.js +11 -4
  188. package/dist/packages/breadcrumbs/styles.js +2 -2
  189. package/dist/packages/button/button.d.ts +22 -16
  190. package/dist/packages/button/button.hydration.test.d.ts +1 -1
  191. package/dist/packages/button/button.hydration.test.js +19 -19
  192. package/dist/packages/button/button.js +758 -711
  193. package/dist/packages/button/button.js.map +4 -4
  194. package/dist/packages/button/button.react.stories.d.ts +5 -5
  195. package/dist/packages/button/button.react.stories.js +30 -30
  196. package/dist/packages/button/button.react.test.js +13 -13
  197. package/dist/packages/button/button.stories.d.ts +4 -4
  198. package/dist/packages/button/button.stories.js +276 -167
  199. package/dist/packages/button/button.test.d.ts +1 -1
  200. package/dist/packages/button/button.test.js +36 -35
  201. package/dist/packages/button/react.d.ts +10 -3
  202. package/dist/packages/button/react.js +14 -7
  203. package/dist/packages/button/styles.js +373 -331
  204. package/dist/packages/card/card.d.ts +7 -2
  205. package/dist/packages/card/card.hydration.test.d.ts +1 -1
  206. package/dist/packages/card/card.hydration.test.js +14 -14
  207. package/dist/packages/card/card.js +310 -295
  208. package/dist/packages/card/card.js.map +4 -4
  209. package/dist/packages/card/card.react.stories.d.ts +4 -4
  210. package/dist/packages/card/card.react.stories.js +11 -11
  211. package/dist/packages/card/card.stories.d.ts +3 -3
  212. package/dist/packages/card/card.stories.js +36 -24
  213. package/dist/packages/card/card.test.d.ts +1 -1
  214. package/dist/packages/card/card.test.js +6 -6
  215. package/dist/packages/card/react.d.ts +6 -1
  216. package/dist/packages/card/react.js +9 -4
  217. package/dist/packages/card/styles.js +2 -2
  218. package/dist/packages/checkbox/checkbox.a11y.test.d.ts +1 -1
  219. package/dist/packages/checkbox/checkbox.a11y.test.js +47 -33
  220. package/dist/packages/checkbox/checkbox.d.ts +10 -4
  221. package/dist/packages/checkbox/checkbox.hydration.test.d.ts +1 -1
  222. package/dist/packages/checkbox/checkbox.hydration.test.js +21 -21
  223. package/dist/packages/checkbox/checkbox.js +481 -430
  224. package/dist/packages/checkbox/checkbox.js.map +3 -3
  225. package/dist/packages/checkbox/checkbox.react.stories.d.ts +4 -4
  226. package/dist/packages/checkbox/checkbox.react.stories.js +3 -3
  227. package/dist/packages/checkbox/checkbox.stories.d.ts +4 -4
  228. package/dist/packages/checkbox/checkbox.stories.js +99 -91
  229. package/dist/packages/checkbox/checkbox.test.d.ts +1 -1
  230. package/dist/packages/checkbox/checkbox.test.js +64 -64
  231. package/dist/packages/checkbox/react.d.ts +12 -3
  232. package/dist/packages/checkbox/react.js +13 -6
  233. package/dist/packages/checkbox/styles.js +183 -132
  234. package/dist/packages/checkbox-group/checkbox-group.a11y.test.d.ts +2 -2
  235. package/dist/packages/checkbox-group/checkbox-group.a11y.test.js +83 -73
  236. package/dist/packages/checkbox-group/checkbox-group.d.ts +13 -6
  237. package/dist/packages/checkbox-group/checkbox-group.hydration.test.d.ts +2 -2
  238. package/dist/packages/checkbox-group/checkbox-group.hydration.test.js +36 -19
  239. package/dist/packages/checkbox-group/checkbox-group.js +62 -57
  240. package/dist/packages/checkbox-group/checkbox-group.js.map +3 -3
  241. package/dist/packages/checkbox-group/checkbox-group.react.test.js +4 -4
  242. package/dist/packages/checkbox-group/checkbox-group.test.d.ts +2 -2
  243. package/dist/packages/checkbox-group/checkbox-group.test.js +183 -90
  244. package/dist/packages/checkbox-group/react.d.ts +10 -3
  245. package/dist/packages/checkbox-group/react.js +13 -6
  246. package/dist/packages/combobox/combobox.a11y.test.d.ts +2 -2
  247. package/dist/packages/combobox/combobox.a11y.test.js +72 -49
  248. package/dist/packages/combobox/combobox.d.ts +8 -3
  249. package/dist/packages/combobox/combobox.hydration.test.d.ts +1 -1
  250. package/dist/packages/combobox/combobox.hydration.test.js +45 -45
  251. package/dist/packages/combobox/combobox.js +337 -338
  252. package/dist/packages/combobox/combobox.js.map +4 -4
  253. package/dist/packages/combobox/combobox.react.stories.d.ts +45 -13
  254. package/dist/packages/combobox/combobox.react.stories.js +29 -29
  255. package/dist/packages/combobox/combobox.react.test.js +8 -8
  256. package/dist/packages/combobox/combobox.stories.d.ts +4 -4
  257. package/dist/packages/combobox/combobox.stories.js +100 -94
  258. package/dist/packages/combobox/combobox.test.d.ts +2 -2
  259. package/dist/packages/combobox/combobox.test.js +249 -133
  260. package/dist/packages/combobox/react.d.ts +28 -7
  261. package/dist/packages/combobox/react.js +23 -14
  262. package/dist/packages/combobox/styles.js +2 -3
  263. package/dist/packages/datepicker/DatePicker.test.d.ts +2 -2
  264. package/dist/packages/datepicker/DatePicker.test.js +49 -42
  265. package/dist/packages/datepicker/datepicker.d.ts +15 -12
  266. package/dist/packages/datepicker/datepicker.hydration.test.d.ts +1 -1
  267. package/dist/packages/datepicker/datepicker.hydration.test.js +21 -21
  268. package/dist/packages/datepicker/datepicker.js +673 -632
  269. package/dist/packages/datepicker/datepicker.js.map +4 -4
  270. package/dist/packages/datepicker/datepicker.react.stories.d.ts +17 -17
  271. package/dist/packages/datepicker/datepicker.react.stories.js +9 -9
  272. package/dist/packages/datepicker/datepicker.react.test.js +6 -6
  273. package/dist/packages/datepicker/datepicker.stories.d.ts +4 -4
  274. package/dist/packages/datepicker/datepicker.stories.js +32 -32
  275. package/dist/packages/datepicker/datepicker.test.d.ts +2 -2
  276. package/dist/packages/datepicker/datepicker.test.js +77 -79
  277. package/dist/packages/datepicker/react.d.ts +15 -9
  278. package/dist/packages/datepicker/react.js +21 -14
  279. package/dist/packages/datepicker/styles/w-datepicker-calendar.styles.js +13 -12
  280. package/dist/packages/datepicker/styles/w-datepicker-day.styles.js +58 -55
  281. package/dist/packages/datepicker/styles/w-datepicker-month.styles.js +60 -57
  282. package/dist/packages/datepicker/styles/w-datepicker.styles.js +87 -87
  283. package/dist/packages/datepicker/utils.d.ts +3 -0
  284. package/dist/packages/datepicker/utils.js +40 -1
  285. package/dist/packages/datepicker/utils.test.d.ts +1 -0
  286. package/dist/packages/datepicker/utils.test.js +29 -0
  287. package/dist/packages/expandable/expandable.d.ts +14 -7
  288. package/dist/packages/expandable/expandable.hydration.test.d.ts +1 -1
  289. package/dist/packages/expandable/expandable.hydration.test.js +21 -21
  290. package/dist/packages/expandable/expandable.js +359 -332
  291. package/dist/packages/expandable/expandable.js.map +4 -4
  292. package/dist/packages/expandable/expandable.react.stories.d.ts +3 -3
  293. package/dist/packages/expandable/expandable.react.stories.js +7 -7
  294. package/dist/packages/expandable/expandable.react.test.js +15 -7
  295. package/dist/packages/expandable/expandable.stories.d.ts +5 -5
  296. package/dist/packages/expandable/expandable.stories.js +51 -45
  297. package/dist/packages/expandable/expandable.test.d.ts +1 -1
  298. package/dist/packages/expandable/expandable.test.js +19 -17
  299. package/dist/packages/expandable/react.d.ts +7 -2
  300. package/dist/packages/expandable/react.js +14 -9
  301. package/dist/packages/expandable/styles.js +2 -2
  302. package/dist/packages/global.d.ts +1 -0
  303. package/dist/packages/global.js +5 -0
  304. package/dist/packages/i18n.d.ts +1 -1
  305. package/dist/packages/i18n.js +37 -29
  306. package/dist/packages/icon/icon.d.ts +10 -2
  307. package/dist/packages/icon/icon.hydration.test.d.ts +1 -1
  308. package/dist/packages/icon/icon.hydration.test.js +25 -25
  309. package/dist/packages/icon/icon.js +31 -26
  310. package/dist/packages/icon/icon.js.map +2 -2
  311. package/dist/packages/icon/icon.react.stories.d.ts +3 -2
  312. package/dist/packages/icon/icon.react.stories.js +284 -283
  313. package/dist/packages/icon/icon.stories.d.ts +7 -30
  314. package/dist/packages/icon/icon.stories.js +307 -297
  315. package/dist/packages/icon/icon.test.d.ts +1 -1
  316. package/dist/packages/icon/icon.test.js +36 -28
  317. package/dist/packages/icon/react.d.ts +4 -1
  318. package/dist/packages/icon/react.js +7 -4
  319. package/dist/packages/icon/style.js +24 -25
  320. package/dist/packages/interaction-type-detection.d.ts +22 -0
  321. package/dist/packages/interaction-type-detection.js +38 -0
  322. package/dist/packages/link/link.d.ts +14 -9
  323. package/dist/packages/link/link.hydration.test.d.ts +1 -1
  324. package/dist/packages/link/link.hydration.test.js +27 -27
  325. package/dist/packages/link/link.js +726 -679
  326. package/dist/packages/link/link.js.map +3 -3
  327. package/dist/packages/link/link.react.stories.d.ts +5 -5
  328. package/dist/packages/link/link.react.stories.js +42 -42
  329. package/dist/packages/link/link.react.test.js +5 -3
  330. package/dist/packages/link/link.stories.d.ts +3 -3
  331. package/dist/packages/link/link.stories.js +51 -51
  332. package/dist/packages/link/link.test.d.ts +1 -1
  333. package/dist/packages/link/link.test.js +11 -7
  334. package/dist/packages/link/react.d.ts +8 -3
  335. package/dist/packages/link/react.js +11 -6
  336. package/dist/packages/link/styles.js +63 -58
  337. package/dist/packages/modal/index.d.ts +7 -7
  338. package/dist/packages/modal/index.js +7 -7
  339. package/dist/packages/modal/modal.d.ts +26 -4
  340. package/dist/packages/modal/modal.hydration.test.d.ts +1 -1
  341. package/dist/packages/modal/modal.hydration.test.js +12 -12
  342. package/dist/packages/modal/modal.js +456 -409
  343. package/dist/packages/modal/modal.js.map +4 -4
  344. package/dist/packages/modal/modal.react.stories.d.ts +7 -7
  345. package/dist/packages/modal/modal.react.stories.js +15 -6
  346. package/dist/packages/modal/modal.react.test.js +5 -5
  347. package/dist/packages/modal/modal.stories.d.ts +9 -8
  348. package/dist/packages/modal/modal.stories.js +266 -248
  349. package/dist/packages/modal/react.d.ts +40 -8
  350. package/dist/packages/modal/react.js +45 -13
  351. package/dist/packages/modal/styles.d.ts +1 -0
  352. package/dist/packages/modal/styles.js +171 -0
  353. package/dist/packages/modal/util.js +3 -1
  354. package/dist/packages/modal-footer/modal-footer.d.ts +13 -2
  355. package/dist/packages/modal-footer/modal-footer.js +299 -296
  356. package/dist/packages/modal-footer/modal-footer.js.map +4 -4
  357. package/dist/packages/modal-footer/react.d.ts +6 -1
  358. package/dist/packages/modal-footer/react.js +9 -4
  359. package/dist/packages/modal-footer/styles.d.ts +1 -0
  360. package/dist/packages/modal-footer/styles.js +22 -0
  361. package/dist/packages/modal-header/modal-header.d.ts +21 -7
  362. package/dist/packages/modal-header/modal-header.js +451 -422
  363. package/dist/packages/modal-header/modal-header.js.map +4 -4
  364. package/dist/packages/modal-header/modal-header.react.test.js +5 -3
  365. package/dist/packages/modal-header/react.d.ts +9 -4
  366. package/dist/packages/modal-header/react.js +13 -8
  367. package/dist/packages/modal-header/styles.d.ts +1 -0
  368. package/dist/packages/modal-header/styles.js +96 -0
  369. package/dist/packages/page-indicator/page-indicator.d.ts +8 -5
  370. package/dist/packages/page-indicator/page-indicator.hydration.test.d.ts +1 -1
  371. package/dist/packages/page-indicator/page-indicator.hydration.test.js +22 -22
  372. package/dist/packages/page-indicator/page-indicator.js +29 -29
  373. package/dist/packages/page-indicator/page-indicator.js.map +4 -4
  374. package/dist/packages/page-indicator/page-indicator.react.stories.d.ts +3 -3
  375. package/dist/packages/page-indicator/page-indicator.react.stories.js +11 -11
  376. package/dist/packages/page-indicator/page-indicator.react.test.js +5 -5
  377. package/dist/packages/page-indicator/page-indicator.stories.d.ts +9 -27
  378. package/dist/packages/page-indicator/page-indicator.stories.js +63 -32
  379. package/dist/packages/page-indicator/page-indicator.test.d.ts +1 -1
  380. package/dist/packages/page-indicator/page-indicator.test.js +110 -70
  381. package/dist/packages/page-indicator/react.d.ts +9 -2
  382. package/dist/packages/page-indicator/react.js +14 -7
  383. package/dist/packages/page-indicator/style.js +21 -21
  384. package/dist/packages/pagination/pagination.a11y.test.d.ts +1 -1
  385. package/dist/packages/pagination/pagination.a11y.test.js +59 -25
  386. package/dist/packages/pagination/pagination.d.ts +17 -11
  387. package/dist/packages/pagination/pagination.hydration.test.d.ts +1 -1
  388. package/dist/packages/pagination/pagination.hydration.test.js +19 -19
  389. package/dist/packages/pagination/pagination.js +385 -354
  390. package/dist/packages/pagination/pagination.js.map +4 -4
  391. package/dist/packages/pagination/pagination.react.stories.d.ts +19 -11
  392. package/dist/packages/pagination/pagination.react.stories.js +8 -8
  393. package/dist/packages/pagination/pagination.react.test.js +6 -6
  394. package/dist/packages/pagination/pagination.stories.d.ts +3 -3
  395. package/dist/packages/pagination/pagination.stories.js +18 -18
  396. package/dist/packages/pagination/pagination.test.d.ts +1 -1
  397. package/dist/packages/pagination/pagination.test.js +146 -72
  398. package/dist/packages/pagination/react.d.ts +15 -6
  399. package/dist/packages/pagination/react.js +17 -10
  400. package/dist/packages/pagination/styles.js +2 -2
  401. package/dist/packages/pill/pill.d.ts +13 -6
  402. package/dist/packages/pill/pill.hydration.test.d.ts +1 -1
  403. package/dist/packages/pill/pill.hydration.test.js +14 -14
  404. package/dist/packages/pill/pill.js +337 -314
  405. package/dist/packages/pill/pill.js.map +4 -4
  406. package/dist/packages/pill/pill.react.stories.d.ts +15 -11
  407. package/dist/packages/pill/pill.react.stories.js +7 -3
  408. package/dist/packages/pill/pill.react.test.js +8 -8
  409. package/dist/packages/pill/pill.stories.d.ts +3 -3
  410. package/dist/packages/pill/pill.stories.js +8 -8
  411. package/dist/packages/pill/pill.test.d.ts +1 -1
  412. package/dist/packages/pill/pill.test.js +17 -15
  413. package/dist/packages/pill/react.d.ts +11 -6
  414. package/dist/packages/pill/react.js +23 -14
  415. package/dist/packages/pill/styles.js +2 -2
  416. package/dist/packages/radio/base-element.d.ts +3 -3
  417. package/dist/packages/radio/base-element.js +3 -3
  418. package/dist/packages/radio/custom-error-validator.d.ts +1 -1
  419. package/dist/packages/radio/custom-error-validator.js +3 -3
  420. package/dist/packages/radio/form-associated-element.d.ts +9 -9
  421. package/dist/packages/radio/form-associated-element.js +27 -26
  422. package/dist/packages/radio/host-styles.js +9 -9
  423. package/dist/packages/radio/invalid.d.ts +1 -1
  424. package/dist/packages/radio/invalid.js +1 -1
  425. package/dist/packages/radio/radio-styles.js +199 -160
  426. package/dist/packages/radio/radio.a11y.test.d.ts +2 -2
  427. package/dist/packages/radio/radio.a11y.test.js +60 -58
  428. package/dist/packages/radio/radio.d.ts +10 -4
  429. package/dist/packages/radio/radio.hydration.test.d.ts +1 -1
  430. package/dist/packages/radio/radio.hydration.test.js +23 -14
  431. package/dist/packages/radio/radio.js +491 -452
  432. package/dist/packages/radio/radio.js.map +3 -3
  433. package/dist/packages/radio/radio.react.stories.d.ts +2 -2
  434. package/dist/packages/radio/radio.react.stories.js +3 -3
  435. package/dist/packages/radio/radio.stories.d.ts +4 -4
  436. package/dist/packages/radio/radio.stories.js +152 -136
  437. package/dist/packages/radio/radio.test.d.ts +1 -1
  438. package/dist/packages/radio/radio.test.js +74 -73
  439. package/dist/packages/radio/react.d.ts +8 -1
  440. package/dist/packages/radio/react.js +11 -4
  441. package/dist/packages/radio/required-validator.d.ts +1 -1
  442. package/dist/packages/radio/required-validator.js +12 -7
  443. package/dist/packages/radio/slot.d.ts +1 -1
  444. package/dist/packages/radio/slot.js +11 -8
  445. package/dist/packages/radio/watch.d.ts +1 -1
  446. package/dist/packages/radio/watch.js +3 -1
  447. package/dist/packages/radio-group/radio-group-styles.js +121 -88
  448. package/dist/packages/radio-group/radio-group.a11y.test.d.ts +2 -2
  449. package/dist/packages/radio-group/radio-group.a11y.test.js +81 -79
  450. package/dist/packages/radio-group/radio-group.d.ts +10 -8
  451. package/dist/packages/radio-group/radio-group.hydration.test.d.ts +2 -2
  452. package/dist/packages/radio-group/radio-group.hydration.test.js +29 -18
  453. package/dist/packages/radio-group/radio-group.js +654 -566
  454. package/dist/packages/radio-group/radio-group.js.map +4 -4
  455. package/dist/packages/radio-group/radio-group.react.test.js +4 -4
  456. package/dist/packages/radio-group/radio-group.test.d.ts +2 -2
  457. package/dist/packages/radio-group/radio-group.test.js +304 -230
  458. package/dist/packages/radio-group/react.d.ts +14 -7
  459. package/dist/packages/radio-group/react.js +18 -10
  460. package/dist/packages/select/input-styles.d.ts +11 -0
  461. package/dist/packages/select/input-styles.js +88 -0
  462. package/dist/packages/select/locales/da/messages.mjs +1 -1
  463. package/dist/packages/select/locales/en/messages.mjs +1 -1
  464. package/dist/packages/select/locales/fi/messages.mjs +1 -1
  465. package/dist/packages/select/locales/nb/messages.mjs +1 -1
  466. package/dist/packages/select/locales/sv/messages.mjs +1 -1
  467. package/dist/packages/select/react.d.ts +11 -5
  468. package/dist/packages/select/react.js +16 -11
  469. package/dist/packages/select/select.a11y.test.d.ts +1 -1
  470. package/dist/packages/select/select.a11y.test.js +98 -91
  471. package/dist/packages/select/select.d.ts +18 -13
  472. package/dist/packages/select/select.hydration.test.d.ts +1 -1
  473. package/dist/packages/select/select.hydration.test.js +16 -16
  474. package/dist/packages/select/select.js +432 -336
  475. package/dist/packages/select/select.js.map +4 -4
  476. package/dist/packages/select/select.react.stories.d.ts +10 -10
  477. package/dist/packages/select/select.react.stories.js +19 -14
  478. package/dist/packages/select/select.react.test.js +6 -6
  479. package/dist/packages/select/select.stories.d.ts +3 -3
  480. package/dist/packages/select/select.stories.js +51 -48
  481. package/dist/packages/select/select.test.d.ts +1 -1
  482. package/dist/packages/select/select.test.js +227 -178
  483. package/dist/packages/select/styles.js +2 -2
  484. package/dist/packages/slider/index.d.ts +2 -2
  485. package/dist/packages/slider/index.js +2 -2
  486. package/dist/packages/slider/locales/da/messages.mjs +1 -1
  487. package/dist/packages/slider/locales/en/messages.mjs +1 -1
  488. package/dist/packages/slider/locales/fi/messages.mjs +1 -1
  489. package/dist/packages/slider/locales/nb/messages.mjs +1 -1
  490. package/dist/packages/slider/locales/sv/messages.mjs +1 -1
  491. package/dist/packages/slider/react.d.ts +9 -4
  492. package/dist/packages/slider/react.js +14 -9
  493. package/dist/packages/slider/slider.d.ts +32 -17
  494. package/dist/packages/slider/slider.hydration.test.d.ts +1 -1
  495. package/dist/packages/slider/slider.hydration.test.js +39 -20
  496. package/dist/packages/slider/slider.js +523 -466
  497. package/dist/packages/slider/slider.js.map +4 -4
  498. package/dist/packages/slider/slider.react.stories.d.ts +4 -4
  499. package/dist/packages/slider/slider.react.stories.js +31 -34
  500. package/dist/packages/slider/slider.react.test.js +6 -6
  501. package/dist/packages/slider/slider.stories.d.ts +9 -7
  502. package/dist/packages/slider/slider.stories.js +369 -340
  503. package/dist/packages/slider/slider.test.d.ts +5 -5
  504. package/dist/packages/slider/slider.test.js +476 -336
  505. package/dist/packages/slider/styles/w-slider.styles.js +166 -148
  506. package/dist/packages/slider/styles.js +2 -2
  507. package/dist/packages/slider-thumb/oddbird-css-anchor-positioning.d.ts +1 -1
  508. package/dist/packages/slider-thumb/oddbird-css-anchor-positioning.js +1 -1
  509. package/dist/packages/slider-thumb/react.d.ts +16 -5
  510. package/dist/packages/slider-thumb/react.js +16 -9
  511. package/dist/packages/slider-thumb/slider-thumb.d.ts +22 -17
  512. package/dist/packages/slider-thumb/slider-thumb.hydration.test.d.ts +1 -1
  513. package/dist/packages/slider-thumb/slider-thumb.hydration.test.js +26 -17
  514. package/dist/packages/slider-thumb/slider-thumb.js +549 -552
  515. package/dist/packages/slider-thumb/slider-thumb.js.map +4 -4
  516. package/dist/packages/slider-thumb/slider-thumb.react.test.js +9 -5
  517. package/dist/packages/slider-thumb/styles/w-slider-thumb.styles.js +189 -188
  518. package/dist/packages/slider-thumb/styles.d.ts +1 -0
  519. package/dist/packages/slider-thumb/styles.js +2 -0
  520. package/dist/packages/snackbar/locales/da/messages.d.mts +1 -0
  521. package/dist/packages/snackbar/locales/da/messages.mjs +1 -0
  522. package/dist/packages/snackbar/locales/en/messages.d.mts +1 -0
  523. package/dist/packages/snackbar/locales/en/messages.mjs +1 -0
  524. package/dist/packages/snackbar/locales/fi/messages.d.mts +1 -0
  525. package/dist/packages/snackbar/locales/fi/messages.mjs +1 -0
  526. package/dist/packages/snackbar/locales/nb/messages.d.mts +1 -0
  527. package/dist/packages/snackbar/locales/nb/messages.mjs +1 -0
  528. package/dist/packages/snackbar/locales/sv/messages.d.mts +1 -0
  529. package/dist/packages/snackbar/locales/sv/messages.mjs +1 -0
  530. package/dist/packages/snackbar/react.d.ts +41 -0
  531. package/dist/packages/snackbar/react.js +50 -0
  532. package/dist/packages/snackbar/snackbar.d.ts +134 -0
  533. package/dist/packages/snackbar/snackbar.hydration.test.d.ts +1 -0
  534. package/dist/packages/snackbar/snackbar.hydration.test.js +13 -0
  535. package/dist/packages/snackbar/snackbar.js +2665 -0
  536. package/dist/packages/snackbar/snackbar.js.map +7 -0
  537. package/dist/packages/snackbar/snackbar.react.stories.d.ts +12 -0
  538. package/dist/packages/snackbar/snackbar.react.stories.js +160 -0
  539. package/dist/packages/snackbar/snackbar.stories.d.ts +20 -0
  540. package/dist/packages/snackbar/snackbar.stories.js +363 -0
  541. package/dist/packages/snackbar/snackbar.test.d.ts +4 -0
  542. package/dist/packages/snackbar/snackbar.test.js +17 -0
  543. package/dist/packages/snackbar/styles.d.ts +1 -0
  544. package/dist/packages/snackbar/styles.js +35 -0
  545. package/dist/packages/snackbar-item/react.d.ts +12 -0
  546. package/dist/packages/snackbar-item/react.js +23 -0
  547. package/dist/packages/snackbar-item/snackbar-item.d.ts +71 -0
  548. package/dist/packages/snackbar-item/snackbar-item.js +2620 -0
  549. package/dist/packages/snackbar-item/snackbar-item.js.map +7 -0
  550. package/dist/packages/snackbar-item/snackbar-item.react.test.d.ts +1 -0
  551. package/dist/packages/snackbar-item/snackbar-item.react.test.js +5 -0
  552. package/dist/packages/snackbar-item/styles.d.ts +1 -0
  553. package/dist/packages/snackbar-item/styles.js +133 -0
  554. package/dist/packages/step/react.d.ts +6 -1
  555. package/dist/packages/step/react.js +9 -4
  556. package/dist/packages/step/step.d.ts +10 -3
  557. package/dist/packages/step/step.hydration.test.d.ts +1 -1
  558. package/dist/packages/step/step.hydration.test.js +10 -10
  559. package/dist/packages/step/step.js +336 -314
  560. package/dist/packages/step/step.js.map +4 -4
  561. package/dist/packages/step/styles.d.ts +1 -0
  562. package/dist/packages/step/styles.js +2 -0
  563. package/dist/packages/step-indicator/index.d.ts +2 -2
  564. package/dist/packages/step-indicator/index.js +2 -2
  565. package/dist/packages/step-indicator/react.d.ts +7 -2
  566. package/dist/packages/step-indicator/react.js +10 -5
  567. package/dist/packages/step-indicator/step-indicator.a11y.test.d.ts +2 -2
  568. package/dist/packages/step-indicator/step-indicator.a11y.test.js +48 -46
  569. package/dist/packages/step-indicator/step-indicator.d.ts +8 -1
  570. package/dist/packages/step-indicator/step-indicator.hydration.test.d.ts +1 -1
  571. package/dist/packages/step-indicator/step-indicator.hydration.test.js +10 -10
  572. package/dist/packages/step-indicator/step-indicator.js +285 -281
  573. package/dist/packages/step-indicator/step-indicator.js.map +3 -3
  574. package/dist/packages/step-indicator/stepindicator.react.stories.d.ts +2 -2
  575. package/dist/packages/step-indicator/stepindicator.react.stories.js +3 -3
  576. package/dist/packages/step-indicator/stepindicator.stories.d.ts +3 -3
  577. package/dist/packages/step-indicator/stepindicator.stories.js +129 -129
  578. package/dist/packages/step-indicator/styles.js +2 -2
  579. package/dist/packages/styles.js +277 -275
  580. package/dist/packages/switch/react.d.ts +9 -3
  581. package/dist/packages/switch/react.js +11 -6
  582. package/dist/packages/switch/styles.js +2 -2
  583. package/dist/packages/switch/switch.a11y.test.d.ts +1 -1
  584. package/dist/packages/switch/switch.a11y.test.js +46 -38
  585. package/dist/packages/switch/switch.d.ts +10 -3
  586. package/dist/packages/switch/switch.hydration.test.d.ts +1 -1
  587. package/dist/packages/switch/switch.hydration.test.js +23 -23
  588. package/dist/packages/switch/switch.js +304 -304
  589. package/dist/packages/switch/switch.js.map +3 -3
  590. package/dist/packages/switch/switch.react.stories.d.ts +4 -4
  591. package/dist/packages/switch/switch.react.stories.js +2 -2
  592. package/dist/packages/switch/switch.stories.d.ts +2 -2
  593. package/dist/packages/switch/switch.stories.js +42 -37
  594. package/dist/packages/switch/switch.test.d.ts +1 -1
  595. package/dist/packages/switch/switch.test.js +30 -35
  596. package/dist/packages/tab/react.d.ts +12 -7
  597. package/dist/packages/tab/react.js +14 -10
  598. package/dist/packages/tab/styles.d.ts +1 -0
  599. package/dist/packages/tab/styles.js +2 -0
  600. package/dist/packages/tab/tab.d.ts +13 -6
  601. package/dist/packages/tab/tab.hydration.test.d.ts +1 -1
  602. package/dist/packages/tab/tab.hydration.test.js +18 -12
  603. package/dist/packages/tab/tab.js +309 -308
  604. package/dist/packages/tab/tab.js.map +4 -4
  605. package/dist/packages/tab/tab.react.test.js +5 -3
  606. package/dist/packages/tab-panel/react.d.ts +10 -2
  607. package/dist/packages/tab-panel/react.js +18 -5
  608. package/dist/packages/tab-panel/tab-panel.d.ts +6 -3
  609. package/dist/packages/tab-panel/tab-panel.hydration.test.d.ts +1 -1
  610. package/dist/packages/tab-panel/tab-panel.hydration.test.js +13 -10
  611. package/dist/packages/tab-panel/tab-panel.js +293 -291
  612. package/dist/packages/tab-panel/tab-panel.js.map +3 -3
  613. package/dist/packages/tabs/index.d.ts +4 -4
  614. package/dist/packages/tabs/index.js +3 -3
  615. package/dist/packages/tabs/react.d.ts +31 -8
  616. package/dist/packages/tabs/react.js +34 -9
  617. package/dist/packages/tabs/styles.js +2 -2
  618. package/dist/packages/tabs/tabs.a11y.test.d.ts +3 -3
  619. package/dist/packages/tabs/tabs.a11y.test.js +188 -169
  620. package/dist/packages/tabs/tabs.d.ts +9 -6
  621. package/dist/packages/tabs/tabs.hydration.test.d.ts +3 -1
  622. package/dist/packages/tabs/tabs.hydration.test.js +22 -8
  623. package/dist/packages/tabs/tabs.js +293 -286
  624. package/dist/packages/tabs/tabs.js.map +3 -3
  625. package/dist/packages/tabs/tabs.react.stories.d.ts +12 -10
  626. package/dist/packages/tabs/tabs.react.stories.js +28 -28
  627. package/dist/packages/tabs/tabs.stories.d.ts +4 -4
  628. package/dist/packages/tabs/tabs.stories.js +101 -95
  629. package/dist/packages/tabs/tabs.test.d.ts +3 -3
  630. package/dist/packages/tabs/tabs.test.js +136 -122
  631. package/dist/packages/textarea/input-styles.d.ts +11 -0
  632. package/dist/packages/textarea/input-styles.js +88 -0
  633. package/dist/packages/textarea/locales/da/messages.mjs +1 -1
  634. package/dist/packages/textarea/locales/en/messages.mjs +1 -1
  635. package/dist/packages/textarea/locales/fi/messages.mjs +1 -1
  636. package/dist/packages/textarea/locales/nb/messages.mjs +1 -1
  637. package/dist/packages/textarea/locales/sv/messages.mjs +1 -1
  638. package/dist/packages/textarea/react.d.ts +17 -11
  639. package/dist/packages/textarea/react.js +22 -17
  640. package/dist/packages/textarea/styles.js +2 -2
  641. package/dist/packages/textarea/textarea.a11y.test.d.ts +1 -1
  642. package/dist/packages/textarea/textarea.a11y.test.js +90 -58
  643. package/dist/packages/textarea/textarea.d.ts +20 -20
  644. package/dist/packages/textarea/textarea.hydration.test.d.ts +1 -1
  645. package/dist/packages/textarea/textarea.hydration.test.js +19 -19
  646. package/dist/packages/textarea/textarea.js +385 -304
  647. package/dist/packages/textarea/textarea.js.map +4 -4
  648. package/dist/packages/textarea/textarea.react.stories.d.ts +38 -21
  649. package/dist/packages/textarea/textarea.react.stories.js +30 -13
  650. package/dist/packages/textarea/textarea.react.test.js +7 -7
  651. package/dist/packages/textarea/textarea.stories.d.ts +3 -3
  652. package/dist/packages/textarea/textarea.stories.js +44 -42
  653. package/dist/packages/textarea/textarea.test.d.ts +1 -1
  654. package/dist/packages/textarea/textarea.test.js +197 -88
  655. package/dist/packages/textfield/input-styles.d.ts +11 -0
  656. package/dist/packages/textfield/input-styles.js +88 -0
  657. package/dist/packages/textfield/locales/da/messages.d.mts +1 -0
  658. package/dist/packages/textfield/locales/da/messages.mjs +1 -0
  659. package/dist/packages/textfield/locales/en/messages.d.mts +1 -0
  660. package/dist/packages/textfield/locales/en/messages.mjs +1 -0
  661. package/dist/packages/textfield/locales/fi/messages.d.mts +1 -0
  662. package/dist/packages/textfield/locales/fi/messages.mjs +1 -0
  663. package/dist/packages/textfield/locales/nb/messages.d.mts +1 -0
  664. package/dist/packages/textfield/locales/nb/messages.mjs +1 -0
  665. package/dist/packages/textfield/locales/sv/messages.d.mts +1 -0
  666. package/dist/packages/textfield/locales/sv/messages.mjs +1 -0
  667. package/dist/packages/textfield/react.d.ts +17 -11
  668. package/dist/packages/textfield/react.js +22 -17
  669. package/dist/packages/textfield/react.test.d.ts +1 -0
  670. package/dist/packages/textfield/react.test.js +20 -0
  671. package/dist/packages/textfield/styles/w-textfield.styles.js +60 -58
  672. package/dist/packages/textfield/styles.js +2 -2
  673. package/dist/packages/textfield/textfield.d.ts +38 -26
  674. package/dist/packages/textfield/textfield.hydration.test.d.ts +1 -1
  675. package/dist/packages/textfield/textfield.hydration.test.js +19 -19
  676. package/dist/packages/textfield/textfield.js +468 -373
  677. package/dist/packages/textfield/textfield.js.map +4 -4
  678. package/dist/packages/textfield/textfield.react.stories.d.ts +51 -21
  679. package/dist/packages/textfield/textfield.react.stories.js +63 -31
  680. package/dist/packages/textfield/textfield.react.test.js +7 -7
  681. package/dist/packages/textfield/textfield.stories.d.ts +4 -4
  682. package/dist/packages/textfield/textfield.stories.js +107 -89
  683. package/dist/packages/textfield/textfield.test.d.ts +2 -2
  684. package/dist/packages/textfield/textfield.test.js +174 -71
  685. package/dist/packages/toast/api.d.ts +2 -2
  686. package/dist/packages/toast/api.js +3 -3
  687. package/dist/packages/toast/index.d.ts +5 -5
  688. package/dist/packages/toast/index.js +5 -5
  689. package/dist/packages/toast/styles.js +2 -2
  690. package/dist/packages/toast/toast.d.ts +10 -5
  691. package/dist/packages/toast/toast.js +349 -320
  692. package/dist/packages/toast/toast.js.map +4 -4
  693. package/dist/packages/toast/toast.stories.d.ts +4 -4
  694. package/dist/packages/toast/toast.stories.js +37 -16
  695. package/dist/packages/toast/toast.test.d.ts +1 -1
  696. package/dist/packages/toast/toast.test.js +48 -31
  697. package/dist/packages/toast/types.d.ts +1 -1
  698. package/dist/packages/toast-container/styles.d.ts +1 -0
  699. package/dist/packages/toast-container/styles.js +2 -0
  700. package/dist/packages/toast-container/toast-container.d.ts +8 -3
  701. package/dist/packages/toast-container/toast-container.js +295 -294
  702. package/dist/packages/toast-container/toast-container.js.map +4 -4
  703. package/dist/packages/types.d.ts +16 -0
  704. package/dist/packages/types.js +1 -0
  705. package/dist/packages/utils/element-collapse.d.ts +12 -0
  706. package/dist/packages/utils/element-collapse.js +102 -0
  707. package/dist/packages/utils/expand-transition.d.ts +1 -1
  708. package/dist/packages/utils/expand-transition.js +12 -10
  709. package/dist/packages/utils/unstyled-heading.d.ts +1 -1
  710. package/dist/packages/utils/unstyled-heading.js +4 -4
  711. package/dist/packages/utils/window-exists.js +1 -1
  712. package/dist/packages/utils.js +2 -2
  713. package/dist/setup-tests.d.ts +3 -3
  714. package/dist/setup-tests.js +16 -13
  715. package/dist/tests/react-hydration.js +29 -30
  716. package/dist/tests/react-ssr-attributes.d.ts +1 -1
  717. package/dist/tests/react-ssr-attributes.js +4 -4
  718. package/dist/web-types.json +458 -256
  719. package/eik/index.js +20 -2460
  720. package/package.json +21 -129
  721. package/dist/packages/slider/Slider.d.ts +0 -2
  722. package/dist/packages/slider/Slider.js +0 -8
  723. package/dist/packages/slider-thumb/SliderThumb.d.ts +0 -2
  724. package/dist/packages/slider-thumb/SliderThumb.js +0 -8
@@ -2,9 +2,9 @@
2
2
 
3
3
  ## Description
4
4
 
5
- An input for dates.
5
+ A date picker allows the user to select a specific calendar date.
6
6
 
7
- Uses the `lang` attribute on either the element or on `<html>` to determine the locale options.
7
+ [Warp component reference](https://warp-ds.github.io/docs/components/date-picker/frameworks/elements)
8
8
 
9
9
  ## Usage
10
10
 
@@ -207,24 +207,25 @@ Unless otherwise noted all properties are HTML attributes (as opposed to JavaScr
207
207
  | Name | Type | Default | Summary |
208
208
  |-|-|-|-|
209
209
  | calendar (JS only) | `HTMLDivElement` | `-` | - |
210
- | day-format | `string` | `'PPPP'` | The date format used for calendar day accessible names. |
211
- | header-format | `string` | `'MMMM yyyy'` | The date format used in the calendar header. |
210
+ | day-format | `string` | `"PPPP"` | The date format used for calendar day accessible names. |
211
+ | header-format | `string` | `"MMMM yyyy"` | The date format used in the calendar header. |
212
212
  | input (JS only) | `HTMLInputElement` | `-` | - |
213
213
  | isCalendarOpen (JS only) | `boolean` | `false` | - |
214
- | isDayDisabled (JS only) | `(day: Date) => boolean` | `-` | Function used to disable dates in the calendar. |
215
- | label | `string` | `-` | The label displayed above the date input. |
214
+ | isDayDisabled (JS only) | `((day: Date) => boolean) \| undefined` | `-` | Function used to disable dates in the calendar. |
215
+ | label | `string \| undefined` | `-` | The label displayed above the date input. |
216
216
  | lang | `string` | `-` | The locale used for calendar labels and date formatting. |
217
217
  | month (JS only) | `unknown` | `-` | - |
218
- | name | `string` | `-` | The name submitted with the date value. |
218
+ | name | `string \| undefined` | `-` | The name submitted with the date value. |
219
219
  | navigationDate (JS only) | `Date` | `-` | - |
220
220
  | previousMonthButton (JS only) | `HTMLButtonElement` | `-` | This is the first focusable element, needed for the modal focus trap. |
221
+ | resetFormControl (JS only) | `resetFormControl() => void` | `-` | - |
221
222
  | selectedCell (JS only) | `HTMLTableCellElement` | `-` | - |
222
223
  | selectedDate (JS only) | `Date \| null` | `-` | - |
223
224
  | shadowRootOptions (JS only) | `object` | `{ ...LitElement.shadowRootOptions, delegatesFocus: true, }` | - |
224
225
  | todayCell (JS only) | `HTMLTableCellElement` | `-` | - |
225
226
  | toggleButton (JS only) | `HTMLButtonElement` | `-` | - |
226
- | value | `string` | `-` | The selected date value. |
227
- | weekday-format | `string` | `'EEEEEE'` | The weekday format shown above the calendar grid. |
227
+ | value | `string \| undefined` | `-` | The selected date value. |
228
+ | weekday-format | `string` | `"EEEEEE"` | The weekday format shown above the calendar grid. |
228
229
  | weeks (JS only) | `unknown` | `-` | - |
229
230
  | wrapper (JS only) | `HTMLDivElement` | `-` | - |
230
231
 
@@ -244,7 +245,7 @@ The date format used for calendar day accessible names.
244
245
  The syntax is defined by [date-fns/format](https://date-fns.org/v4.1.0/docs/format).
245
246
 
246
247
  - Type: `string`
247
- - Default: `'PPPP'`
248
+ - Default: `"PPPP"`
248
249
 
249
250
  #### header-format
250
251
 
@@ -253,7 +254,7 @@ The date format used in the calendar header.
253
254
  The syntax is defined by [date-fns/format](https://date-fns.org/v4.1.0/docs/format).
254
255
 
255
256
  - Type: `string`
256
- - Default: `'MMMM yyyy'`
257
+ - Default: `"MMMM yyyy"`
257
258
 
258
259
  #### input (JS only)
259
260
 
@@ -275,7 +276,7 @@ Function used to disable dates in the calendar.
275
276
 
276
277
  Set this on the element instance in JavaScript, not as an HTML attribute. Disabled dates cannot be selected from the calendar.
277
278
 
278
- - Type: `(day: Date) => boolean`
279
+ - Type: `((day: Date) => boolean) | undefined`
279
280
  - Default: `-`
280
281
 
281
282
  #### label
@@ -284,7 +285,7 @@ The label displayed above the date input.
284
285
 
285
286
  Use this to give the datepicker a visible and accessible name.
286
287
 
287
- - Type: `string`
288
+ - Type: `string | undefined`
288
289
  - Default: `-`
289
290
 
290
291
  #### lang
@@ -309,7 +310,7 @@ The name submitted with the date value.
309
310
 
310
311
  Use this when the datepicker belongs to a form and its value should be included in form data.
311
312
 
312
- - Type: `string`
313
+ - Type: `string | undefined`
313
314
  - Default: `-`
314
315
 
315
316
  #### navigationDate (JS only)
@@ -330,6 +331,13 @@ the query will point to an element that doesn't exist anymore.
330
331
  - Type: `HTMLButtonElement`
331
332
  - Default: `-`
332
333
 
334
+ #### resetFormControl (JS only)
335
+
336
+
337
+
338
+ - Type: `resetFormControl() => void`
339
+ - Default: `-`
340
+
333
341
  #### selectedCell (JS only)
334
342
 
335
343
 
@@ -371,7 +379,7 @@ The selected date value.
371
379
 
372
380
  Use an ISO date string in `YYYY-MM-DD` format. The value is submitted with the form and is reset to its initial value when the form resets.
373
381
 
374
- - Type: `string`
382
+ - Type: `string | undefined`
375
383
  - Default: `-`
376
384
 
377
385
  #### weekday-format
@@ -381,7 +389,7 @@ The weekday format shown above the calendar grid.
381
389
  The syntax is defined by [date-fns/format](https://date-fns.org/v4.1.0/docs/format).
382
390
 
383
391
  - Type: `string`
384
- - Default: `'EEEEEE'`
392
+ - Default: `"EEEEEE"`
385
393
 
386
394
  #### weeks (JS only)
387
395
 
@@ -9,10 +9,10 @@ Unless otherwise noted all properties are HTML attributes (as opposed to JavaScr
9
9
  | animated | `boolean` | `false` | Will animate the expansion/collapse |
10
10
  | bleed | `boolean` | `false` | Will make the expandable full-width on the sm breakpoint size |
11
11
  | box | `boolean` | `false` | Will make the expandable a Box |
12
- | button-class | `string` | `-` | **Deprecated**: Probably does not work the way you expect. The class must exist inside the shadow DOM of the component. |
13
- | content-class | `string` | `-` | **Deprecated**: Probably does not work the way you expect. The class must exist inside the shadow DOM of the component. |
12
+ | button-class | `string \| undefined` | `-` | **Deprecated**: Probably does not work the way you expect. The class must exist inside the shadow DOM of the component. |
13
+ | content-class | `string \| undefined` | `-` | **Deprecated**: Probably does not work the way you expect. The class must exist inside the shadow DOM of the component. |
14
14
  | expanded | `boolean` | `false` | Controls component's expanded state |
15
- | heading-level | `number` | `-` | Wrap the toggle button in a heading element with the specified level. If headingLevel is not specified, the button will not be wrapped by a heading element. |
15
+ | heading-level | `number \| undefined` | `-` | Wrap the toggle button in a heading element with the specified level. If headingLevel is not specified, the button will not be wrapped by a heading element. |
16
16
  | no-chevron | `boolean` | `false` | Controls chevron visibility |
17
17
  | title | `string` | `-` | Component title. Used to display the title value which is always present regardless of whether the component is open or closed. |
18
18
 
@@ -45,7 +45,7 @@ Will make the expandable a Box
45
45
 
46
46
 
47
47
 
48
- - Type: `string`
48
+ - Type: `string | undefined`
49
49
  - Default: `-`
50
50
 
51
51
  #### content-class
@@ -54,7 +54,7 @@ Will make the expandable a Box
54
54
 
55
55
 
56
56
 
57
- - Type: `string`
57
+ - Type: `string | undefined`
58
58
  - Default: `-`
59
59
 
60
60
  #### expanded
@@ -68,7 +68,7 @@ Controls component's expanded state
68
68
 
69
69
  Wrap the toggle button in a heading element with the specified level. If headingLevel is not specified, the button will not be wrapped by a heading element.
70
70
 
71
- - Type: `number`
71
+ - Type: `number | undefined`
72
72
  - Default: `-`
73
73
 
74
74
  #### no-chevron
@@ -4,6 +4,8 @@
4
4
 
5
5
  Expandable is a layout component used for creating expandable content areas on a page.
6
6
 
7
+ [Warp component reference](https://warp-ds.github.io/docs/components/expandable/frameworks/elements)
8
+
7
9
  ## Usage
8
10
 
9
11
  ## Accessibility
@@ -77,10 +79,10 @@ Unless otherwise noted all properties are HTML attributes (as opposed to JavaScr
77
79
  | animated | `boolean` | `false` | Will animate the expansion/collapse |
78
80
  | bleed | `boolean` | `false` | Will make the expandable full-width on the sm breakpoint size |
79
81
  | box | `boolean` | `false` | Will make the expandable a Box |
80
- | button-class | `string` | `-` | **Deprecated**: Probably does not work the way you expect. The class must exist inside the shadow DOM of the component. |
81
- | content-class | `string` | `-` | **Deprecated**: Probably does not work the way you expect. The class must exist inside the shadow DOM of the component. |
82
+ | button-class | `string \| undefined` | `-` | **Deprecated**: Probably does not work the way you expect. The class must exist inside the shadow DOM of the component. |
83
+ | content-class | `string \| undefined` | `-` | **Deprecated**: Probably does not work the way you expect. The class must exist inside the shadow DOM of the component. |
82
84
  | expanded | `boolean` | `false` | Controls component's expanded state |
83
- | heading-level | `number` | `-` | Wrap the toggle button in a heading element with the specified level. If headingLevel is not specified, the button will not be wrapped by a heading element. |
85
+ | heading-level | `number \| undefined` | `-` | Wrap the toggle button in a heading element with the specified level. If headingLevel is not specified, the button will not be wrapped by a heading element. |
84
86
  | no-chevron | `boolean` | `false` | Controls chevron visibility |
85
87
  | title | `string` | `-` | Component title. Used to display the title value which is always present regardless of whether the component is open or closed. |
86
88
 
@@ -113,7 +115,7 @@ Will make the expandable a Box
113
115
 
114
116
 
115
117
 
116
- - Type: `string`
118
+ - Type: `string | undefined`
117
119
  - Default: `-`
118
120
 
119
121
  #### content-class
@@ -122,7 +124,7 @@ Will make the expandable a Box
122
124
 
123
125
 
124
126
 
125
- - Type: `string`
127
+ - Type: `string | undefined`
126
128
  - Default: `-`
127
129
 
128
130
  #### expanded
@@ -136,7 +138,7 @@ Controls component's expanded state
136
138
 
137
139
  Wrap the toggle button in a heading element with the specified level. If headingLevel is not specified, the button will not be wrapped by a heading element.
138
140
 
139
- - Type: `number`
141
+ - Type: `number | undefined`
140
142
  - Default: `-`
141
143
 
142
144
  #### no-chevron
@@ -8,7 +8,7 @@ Unless otherwise noted all properties are HTML attributes (as opposed to JavaScr
8
8
  |-|-|-|-|
9
9
  | locale | `string` | `-` | Locale used for `<title>` text. |
10
10
  | name | `string` | `-` | Icon filename (without .svg) |
11
- | size | [`'small' \| 'medium' \| 'large' \| PixelValue`](#small-medium-large-pixelvalue) | `"medium"` | Size: small, medium, large or pixel value (e.g. "32px"). |
11
+ | size | [`"small" \| "medium" \| "large" \| PixelValue \| undefined`](#small-medium-large-pixelvalue-undefined) | `"medium"` | Size: small, medium, large or pixel value (e.g. "32px"). |
12
12
 
13
13
  ### Property Details
14
14
 
@@ -32,12 +32,12 @@ Icon filename (without .svg)
32
32
 
33
33
  Size: small, medium, large or pixel value (e.g. "32px").
34
34
 
35
- - Type: [`'small' | 'medium' | 'large' | PixelValue`](#small-medium-large-pixelvalue)
35
+ - Type: [`"small" | "medium" | "large" | PixelValue | undefined`](#small-medium-large-pixelvalue-undefined)
36
36
  - Default: `"medium"`
37
37
 
38
38
  ### Types
39
39
 
40
- #### 'small' | 'medium' | 'large' | PixelValue
40
+ #### "small" | "medium" | "large" | PixelValue | undefined
41
41
 
42
- `'small' | 'medium' | 'large' | `${number}px``
42
+ `'small' | 'medium' | 'large' | `${number}px` | undefined`
43
43
 
@@ -2,7 +2,7 @@
2
2
 
3
3
  ## Description
4
4
 
5
- See the Icons overview for a list of available icons. Icon names are case sensitive.
5
+ [Warp component reference](https://warp-ds.github.io/docs/components/icons/frameworks/elements)
6
6
 
7
7
  ## Usage
8
8
 
@@ -80,7 +80,7 @@ Unless otherwise noted all properties are HTML attributes (as opposed to JavaScr
80
80
  |-|-|-|-|
81
81
  | locale | `string` | `-` | Locale used for `<title>` text. |
82
82
  | name | `string` | `-` | Icon filename (without .svg) |
83
- | size | [`'small' \| 'medium' \| 'large' \| PixelValue`](#small-medium-large-pixelvalue) | `"medium"` | Size: small, medium, large or pixel value (e.g. "32px"). |
83
+ | size | [`"small" \| "medium" \| "large" \| PixelValue \| undefined`](#small-medium-large-pixelvalue-undefined) | `"medium"` | Size: small, medium, large or pixel value (e.g. "32px"). |
84
84
 
85
85
  ### Property Details
86
86
 
@@ -104,12 +104,12 @@ Icon filename (without .svg)
104
104
 
105
105
  Size: small, medium, large or pixel value (e.g. "32px").
106
106
 
107
- - Type: [`'small' | 'medium' | 'large' | PixelValue`](#small-medium-large-pixelvalue)
107
+ - Type: [`"small" | "medium" | "large" | PixelValue | undefined`](#small-medium-large-pixelvalue-undefined)
108
108
  - Default: `"medium"`
109
109
 
110
110
  ### Types
111
111
 
112
- #### 'small' | 'medium' | 'large' | PixelValue
112
+ #### "small" | "medium" | "large" | PixelValue | undefined
113
113
 
114
- `'small' | 'medium' | 'large' | `${number}px``
114
+ `'small' | 'medium' | 'large' | `${number}px` | undefined`
115
115
 
@@ -9,38 +9,41 @@ Generated by `pnpm build:docs`. This file indexes the Markdown documentation shi
9
9
 
10
10
  | Component | Element / API | Package | Summary | Docs |
11
11
  |-|-|-|-|-|
12
- | Affix | `<w-affix>` | `affix` | This component is usually used in other components like form elements to show a prefix or suffix. See for example `w-textfield`. | [affix.md](./affix/affix.md) |
13
- | Alert | `<w-alert>` | `alert` | Alert is an inline component used for displaying different types of messages. For accessibility reasons, alert should appear close to the element that triggered it. | [alert.md](./alert/alert.md) |
14
- | Attention | `<w-attention>` | `attention` | Attention is a versatile component for displaying contextual information and messages. It can be used for a wide range of purposes, such as tooltips, callouts, popovers, and highlights. The component is designed to be anchored to a trigger element, providing contextual information related to that element. It supports various placements and styling options to accommodate different use cases and design needs. Note: attention will soon be split into multiple components (tooltip, callout, popover, highlight) at which time this component will be deprecated. For now, use the `tooltip`, `callout`, `popover`, and `highlight` boolean properties to achieve the desired style and behavior. | [attention.md](./attention/attention.md) |
12
+ | Affix | `<w-affix>` | `affix` | This component is usually used in other components like form elements to show a prefix or suffix. See for example `w-textfield`. Warp component reference | [affix.md](./affix/affix.md) |
13
+ | Alert | `<w-alert>` | `alert` | Alert is an inline component used for displaying different types of messages. Warp component reference | [alert.md](./alert/alert.md) |
14
+ | Attention | `<w-attention>` | `attention` | Note: attention will soon be split into multiple components (tooltip, callout, popover, highlight) at which time this component will be deprecated. For now, use the `tooltip`, `callout`, `popover`, and `highlight` boolean properties to achieve the desired style and behavior. Attention is a versatile component for displaying contextual information and messages. It can be used for a wide range of purposes, such as tooltips, callouts, popovers, and highlights. The component is designed to be anchored to a trigger element, providing contextual information related to that element. It supports various placements and styling options to accommodate different use cases and design needs. Warp component reference | [attention.md](./attention/attention.md) |
15
15
  | Badge | `<w-badge>` | `badge` | `w-badge` is used for showing a small amount of non-interactive color-categorized metadata, like a status or count. | [badge.md](./badge/badge.md) |
16
- | Box | `<w-box>` | `box` | Box is a layout component used for separating content areas on a page. | [box.md](./box/box.md) |
17
- | Breadcrumbs | `<w-breadcrumbs>` | `breadcrumbs` | Shows the navigation structure for the current page. Renders direct child links and non-link elements as a breadcrumb trail, inserts separators between items, and exposes the trail as navigation. | [breadcrumbs.md](./breadcrumbs/breadcrumbs.md) |
18
- | Button | `<w-button>` | `button` | Performs an action or renders a link with button styling. Use button variants to match action priority, risk, and context. | [button.md](./button/button.md) |
19
- | Card | `<w-card>` | `card` | Card is a layout component used for separating content areas on a page. | [card.md](./card/card.md) |
20
- | Checkbox | `<w-checkbox>` | `checkbox` | Checkbox lets users select one or more options. Use it for independent yes/no choices, multi-select lists, and terms or consent confirmations. | [checkbox.md](./checkbox/checkbox.md) |
21
- | Checkbox Group | `<w-checkbox-group>` | `checkbox-group` | Use `w-checkbox-group` when several checkboxes share one label, help text, optional indicator, or required validation. | [checkbox-group.md](./checkbox-group/checkbox-group.md) |
22
- | Combobox | `<w-combobox>` | `combobox` | A combobox element for text input with selectable options. | [combobox.md](./combobox/combobox.md) |
23
- | Datepicker | `<w-datepicker>` | `datepicker` | An input for dates. Uses the `lang` attribute on either the element or on `<html>` to determine the locale options. | [datepicker.md](./datepicker/datepicker.md) |
24
- | Expandable | `<w-expandable>` | `expandable` | Expandable is a layout component used for creating expandable content areas on a page. | [expandable.md](./expandable/expandable.md) |
25
- | Icon | `<w-icon>` | `icon` | See the Icons overview for a list of available icons. Icon names are case sensitive. | [icon.md](./icon/icon.md) |
26
- | Link | `<w-link>` | `link` | Buttons are used to perform actions, with different visuals for different needs. | [link.md](./link/link.md) |
27
- | Modal | `<w-modal>` | `modal` | Modals (or dialogs) display important information that users need to acknowledge. | [modal.md](./modal/modal.md) |
28
- | Modal Footer | `<w-modal-footer>` | `modal-footer` | The footer section of a modal, typically where you place actions. | [modal-footer.md](./modal-footer/modal-footer.md) |
29
- | Modal Header | `<w-modal-header>` | `modal-header` | The header section of a modal, typically where you place the title and a close button. | [modal-header.md](./modal-header/modal-header.md) |
30
- | Page Indicator | `<w-page-indicator>` | `page-indicator` | A page indicator component that displays a series of dots representing pages. One dot is highlighted to indicate the currently selected page. | [page-indicator.md](./page-indicator/page-indicator.md) |
31
- | Pagination | `<w-pagination>` | `pagination` | Pagination allows users to navigate through multiple pages of content by providing navigation controls with page numbers and directional arrows. | [pagination.md](./pagination/pagination.md) |
32
- | Pill | `<w-pill>` | `pill` | Pill is a type of button that is often used as a filter, but can also be used as a rounded button for overlays, etc. | [pill.md](./pill/pill.md) |
33
- | Radio | `<w-radio>` | `radio` | A radio input typically consists of two components: | [radio.md](./radio/radio.md) |
34
- | Radio Group | `<w-radio-group>` | `radio-group` | Radios allow users to select a single option from a list of choices. Use with `w-radio`. | [radio-group.md](./radio-group/radio-group.md) |
35
- | Select | `<w-select>` | `select` | A dropdown component for selecting a single value. | [select.md](./select/select.md) |
36
- | Slider | `<w-slider>` | `slider` | Parent component for sliders (both single and range sliders). Used in combination with a `<w-slider-thumb>`. | [slider.md](./slider/slider.md) |
16
+ | Box | `<w-box>` | `box` | Box is a layout component used for separating content areas on a page. Warp component reference | [box.md](./box/box.md) |
17
+ | Breadcrumb Item | `<w-breadcrumb-item>` | `breadcrumb-item` | Represents one item in a `w-breadcrumbs` trail. Renders the slotted label as a link when `href` is set, or as text when it is not, and adds a separator after non-current items. Warp component reference | [breadcrumb-item.md](./breadcrumb-item/breadcrumb-item.md) |
18
+ | Breadcrumbs | `<w-breadcrumbs>` | `breadcrumbs` | Shows the navigation structure for the current page. Renders direct child links and non-link elements as a breadcrumb trail, inserts separators between items, and exposes the trail as navigation. Warp component reference | [breadcrumbs.md](./breadcrumbs/breadcrumbs.md) |
19
+ | Button | `<w-button>` | `button` | Performs an action or renders a link with button styling. Use button variants to match action priority, risk, and context. Warp component reference | [button.md](./button/button.md) |
20
+ | Card | `<w-card>` | `card` | Card is a layout component used for separating content areas on a page. Warp component reference | [card.md](./card/card.md) |
21
+ | Checkbox | `<w-checkbox>` | `checkbox` | Checkboxes allow users to select one or more options from a number of choices. Wrap individual checkboxes in a checkbox group. Warp component reference | [checkbox.md](./checkbox/checkbox.md) |
22
+ | Checkbox Group | `<w-checkbox-group>` | `checkbox-group` | Checkboxes allow users to select one or more options from a number of choices. Wrap individual checkboxes in a checkbox group. Warp component reference | [checkbox-group.md](./checkbox-group/checkbox-group.md) |
23
+ | Combobox | `<w-combobox>` | `combobox` | A combobox element for text input with selectable options. Warp component reference | [combobox.md](./combobox/combobox.md) |
24
+ | Datepicker | `<w-datepicker>` | `datepicker` | A date picker allows the user to select a specific calendar date. Warp component reference | [datepicker.md](./datepicker/datepicker.md) |
25
+ | Expandable | `<w-expandable>` | `expandable` | Expandable is a layout component used for creating expandable content areas on a page. Warp component reference | [expandable.md](./expandable/expandable.md) |
26
+ | Icon | `<w-icon>` | `icon` | Warp component reference | [icon.md](./icon/icon.md) |
27
+ | Link | `<w-link>` | `link` | Link component to use when creating links that look like buttons. Warp component reference | [link.md](./link/link.md) |
28
+ | Modal | `<w-modal>` | `modal` | Modals (or dialogs) display important information that users need to acknowledge. Warp component reference | [modal.md](./modal/modal.md) |
29
+ | Modal Footer | `<w-modal-footer>` | `modal-footer` | The footer section of a modal, typically where you place actions. Warp component reference | [modal-footer.md](./modal-footer/modal-footer.md) |
30
+ | Modal Header | `<w-modal-header>` | `modal-header` | The header section of a modal, typically where you place the title and a close button. Warp component reference | [modal-header.md](./modal-header/modal-header.md) |
31
+ | Page Indicator | `<w-page-indicator>` | `page-indicator` | A page indicator component that displays a series of dots representing pages. One dot is highlighted to indicate the currently selected page. Warp component reference | [page-indicator.md](./page-indicator/page-indicator.md) |
32
+ | Pagination | `<w-pagination>` | `pagination` | Pagination allows users to navigate through multiple pages of content by providing navigation controls with page numbers and directional arrows. Warp component reference | [pagination.md](./pagination/pagination.md) |
33
+ | Pill | `<w-pill>` | `pill` | Pill is a type of button that is often used as a filter, but can also be used as a rounded button for overlays, etc. Warp component reference | [pill.md](./pill/pill.md) |
34
+ | Radio | `<w-radio>` | `radio` | Radios allow users to select a single option from a list of choices. Wrap individual radio components in a radio group. Warp component reference | [radio.md](./radio/radio.md) |
35
+ | Radio Group | `<w-radio-group>` | `radio-group` | Radios allow users to select a single option from a list of choices. Wrap individual radio components in a radio group. Warp component reference | [radio-group.md](./radio-group/radio-group.md) |
36
+ | Select | `<w-select>` | `select` | A dropdown component for selecting a single value. Warp component reference | [select.md](./select/select.md) |
37
+ | Slider | `<w-slider>` | `slider` | Parent component for sliders (both single and range sliders). Used in combination with a `<w-slider-thumb>`. Warp component reference | [slider.md](./slider/slider.md) |
37
38
  | Slider Thumb | `<w-slider-thumb>` | `slider-thumb` | Component to place inside a `<w-slider>`. | [slider-thumb.md](./slider-thumb/slider-thumb.md) |
38
- | Step | `<w-step>` | `step` | Individual step component that shows a single step in a process | [step.md](./step/step.md) |
39
- | Step Indicator | `<w-step-indicator>` | `step-indicator` | Steps are used to show progress through a process or to guide users through a multi-step task. | [step-indicator.md](./step-indicator/step-indicator.md) |
40
- | Switch | `<w-switch>` | `switch` | The Switch component allows users to toggle between two states. | [switch.md](./switch/switch.md) |
41
- | Tab | `<w-tab>` | `tab` | Individual tab component used within w-tabs container. | [tab.md](./tab/tab.md) |
42
- | Tab Panel | `<w-tab-panel>` | `tab-panel` | Tab panel component that holds content for individual tabs. Each tab panel should have a name that matches a corresponding tab. | [tab-panel.md](./tab-panel/tab-panel.md) |
43
- | Tabs | `<w-tabs>` | `tabs` | Tabs are used to organize content by grouping similar information on the same page. | [tabs.md](./tabs/tabs.md) |
44
- | Textarea | `<w-textarea>` | `textarea` | A multi-line text input with built-in form validation, auto-resizing, and styling support. The component automatically handles: - Form integration - Auto-resizing based on content and row constraints - Built-in validation with customizable error messages - Accessibility attributes and labeling | [textarea.md](./textarea/textarea.md) |
45
- | Textfield | `<w-textfield>` | `textfield` | A single-line input component used for entering and editing textual or numeric data. | [textfield.md](./textfield/textfield.md) |
39
+ | Snackbar | `<w-snackbar>` | `snackbar` | A Snackbar shows brief user feedback messages that overlay content, with an optional action such as Undo. Include one `<w-snackbar></w-snackbar>` in the document `<body>`. Use the `create` function to create messages. Warp component reference | [snackbar.md](./snackbar/snackbar.md) |
40
+ | Snackbar Item | `<w-snackbar-item>` | `snackbar-item` | An item to show in a `w-snackbar`. See the `create` function on `w-snackbar` for a convenience API which helps you make snackbar items. Warp component reference | [snackbar-item.md](./snackbar-item/snackbar-item.md) |
41
+ | Step | `<w-step>` | `step` | Individual step component that shows a single step in a process. Warp component reference | [step.md](./step/step.md) |
42
+ | Step Indicator | `<w-step-indicator>` | `step-indicator` | Steps are used to show progress through a process or to guide users through a multi-step task. Warp component reference | [step-indicator.md](./step-indicator/step-indicator.md) |
43
+ | Switch | `<w-switch>` | `switch` | The Switch component allows users to toggle between two states. Warp component reference | [switch.md](./switch/switch.md) |
44
+ | Tab | `<w-tab>` | `tab` | Individual tab component used within w-tabs container. Warp component reference | [tab.md](./tab/tab.md) |
45
+ | Tab Panel | `<w-tab-panel>` | `tab-panel` | Tab panel component that holds content for individual tabs. Each tab panel should have a name that matches a corresponding tab. Warp component reference | [tab-panel.md](./tab-panel/tab-panel.md) |
46
+ | Tabs | `<w-tabs>` | `tabs` | Tabs are used to organize content by grouping similar information on the same page. Warp component reference | [tabs.md](./tabs/tabs.md) |
47
+ | Textarea | `<w-textarea>` | `textarea` | A multi-line text input with built-in form validation, auto-resizing, and styling support. Warp component reference | [textarea.md](./textarea/textarea.md) |
48
+ | Textfield | `<w-textfield>` | `textfield` | A single-line input component used for entering and editing textual or numeric data. Warp component reference | [textfield.md](./textfield/textfield.md) |
46
49
  | Toast | `@warp-ds/elements/toast` | `toast` | Toasts are brief user feedback messages that overlay content. | [toast.md](./toast/toast.md) |
@@ -9,11 +9,11 @@ Unless otherwise noted all properties are HTML attributes (as opposed to JavaScr
9
9
  | autofocus | `boolean` | `false` | Focus the link after it is rendered |
10
10
  | disabled | `boolean` | `false` | Applies disabled styling, but you need to disable clicks on your own. |
11
11
  | full-width | `boolean` | `false` | Makes the link take up the full width of its parent |
12
- | href | `string` | `-` | The URL the link points to |
13
- | rel | `string` | `-` | Relationship of the linked URL. |
12
+ | href | `string \| undefined` | `-` | The URL the link points to |
13
+ | rel | `string \| undefined` | `-` | Relationship of the linked URL. |
14
14
  | small | `boolean` | `false` | Render a smaller version |
15
- | target | `string` | `-` | Where to display the linked URL (e.g. `_blank`) |
16
- | variant | [`ButtonVariant`](#buttonvariant) | `-` | Visual style for the link/button. |
15
+ | target | `string \| undefined` | `-` | Where to display the linked URL (e.g. `_blank`) |
16
+ | variant | [`ButtonVariant \| undefined`](#buttonvariant-undefined) | `-` | Visual style for the link/button. |
17
17
 
18
18
  ### Property Details
19
19
 
@@ -44,7 +44,7 @@ Makes the link take up the full width of its parent
44
44
 
45
45
  The URL the link points to
46
46
 
47
- - Type: `string`
47
+ - Type: `string | undefined`
48
48
  - Default: `-`
49
49
 
50
50
  #### rel
@@ -53,7 +53,7 @@ Relationship of the linked URL.
53
53
 
54
54
  If `target="_blank"` and `rel` is not provided, the component uses `noopener`.
55
55
 
56
- - Type: `string`
56
+ - Type: `string | undefined`
57
57
  - Default: `-`
58
58
 
59
59
  #### small
@@ -67,19 +67,19 @@ Render a smaller version
67
67
 
68
68
  Where to display the linked URL (e.g. `_blank`)
69
69
 
70
- - Type: `string`
70
+ - Type: `string | undefined`
71
71
  - Default: `-`
72
72
 
73
73
  #### variant
74
74
 
75
75
  Visual style for the link/button.
76
76
 
77
- - Type: [`ButtonVariant`](#buttonvariant)
77
+ - Type: [`ButtonVariant | undefined`](#buttonvariant-undefined)
78
78
  - Default: `-`
79
79
 
80
80
  ### Types
81
81
 
82
- #### ButtonVariant
82
+ #### ButtonVariant | undefined
83
83
 
84
- `'negative' | 'primary' | 'secondary' | 'negativeQuiet' | 'utility' | 'quiet' | 'utilityQuiet' | 'overlay' | 'overlayInverted' | 'overlayQuiet' | 'overlayInvertedQuiet'`
84
+ `'negative' | 'primary' | 'secondary' | 'negativeQuiet' | 'utility' | 'quiet' | 'utilityQuiet' | 'overlay' | 'overlayInverted' | 'overlayQuiet' | 'overlayInvertedQuiet' | undefined`
85
85
 
@@ -2,7 +2,9 @@
2
2
 
3
3
  ## Description
4
4
 
5
- Buttons are used to perform actions, with different visuals for different needs.
5
+ Link component to use when creating links that look like buttons.
6
+
7
+ [Warp component reference](https://warp-ds.github.io/docs/components/link/frameworks/elements)
6
8
 
7
9
  ## Usage
8
10
 
@@ -116,11 +118,11 @@ Unless otherwise noted all properties are HTML attributes (as opposed to JavaScr
116
118
  | autofocus | `boolean` | `false` | Focus the link after it is rendered |
117
119
  | disabled | `boolean` | `false` | Applies disabled styling, but you need to disable clicks on your own. |
118
120
  | full-width | `boolean` | `false` | Makes the link take up the full width of its parent |
119
- | href | `string` | `-` | The URL the link points to |
120
- | rel | `string` | `-` | Relationship of the linked URL. |
121
+ | href | `string \| undefined` | `-` | The URL the link points to |
122
+ | rel | `string \| undefined` | `-` | Relationship of the linked URL. |
121
123
  | small | `boolean` | `false` | Render a smaller version |
122
- | target | `string` | `-` | Where to display the linked URL (e.g. `_blank`) |
123
- | variant | [`ButtonVariant`](#buttonvariant) | `-` | Visual style for the link/button. |
124
+ | target | `string \| undefined` | `-` | Where to display the linked URL (e.g. `_blank`) |
125
+ | variant | [`ButtonVariant \| undefined`](#buttonvariant-undefined) | `-` | Visual style for the link/button. |
124
126
 
125
127
  ### Property Details
126
128
 
@@ -151,7 +153,7 @@ Makes the link take up the full width of its parent
151
153
 
152
154
  The URL the link points to
153
155
 
154
- - Type: `string`
156
+ - Type: `string | undefined`
155
157
  - Default: `-`
156
158
 
157
159
  #### rel
@@ -160,7 +162,7 @@ Relationship of the linked URL.
160
162
 
161
163
  If `target="_blank"` and `rel` is not provided, the component uses `noopener`.
162
164
 
163
- - Type: `string`
165
+ - Type: `string | undefined`
164
166
  - Default: `-`
165
167
 
166
168
  #### small
@@ -174,19 +176,19 @@ Render a smaller version
174
176
 
175
177
  Where to display the linked URL (e.g. `_blank`)
176
178
 
177
- - Type: `string`
179
+ - Type: `string | undefined`
178
180
  - Default: `-`
179
181
 
180
182
  #### variant
181
183
 
182
184
  Visual style for the link/button.
183
185
 
184
- - Type: [`ButtonVariant`](#buttonvariant)
186
+ - Type: [`ButtonVariant | undefined`](#buttonvariant-undefined)
185
187
  - Default: `-`
186
188
 
187
189
  ### Types
188
190
 
189
- #### ButtonVariant
191
+ #### ButtonVariant | undefined
190
192
 
191
- `'negative' | 'primary' | 'secondary' | 'negativeQuiet' | 'utility' | 'quiet' | 'utilityQuiet' | 'overlay' | 'overlayInverted' | 'overlayQuiet' | 'overlayInvertedQuiet'`
193
+ `'negative' | 'primary' | 'secondary' | 'negativeQuiet' | 'utility' | 'quiet' | 'utilityQuiet' | 'overlay' | 'overlayInverted' | 'overlayQuiet' | 'overlayInvertedQuiet' | undefined`
192
194
 
@@ -6,17 +6,28 @@ Unless otherwise noted all properties are HTML attributes (as opposed to JavaScr
6
6
 
7
7
  | Name | Type | Default | Summary |
8
8
  |-|-|-|-|
9
- | content-id | `string` | `-` | - |
9
+ | close (JS only) | `close() => void` | `-` | - |
10
+ | content-id | `string \| undefined` | `-` | **Deprecated**: This ID has no effect |
10
11
  | ignore-backdrop-clicks | `boolean` | `false` | Ignores clicks to the backdrop when set |
12
+ | open (JS only) | `open() => void` | `-` | - |
11
13
  | show | `boolean` | `false` | Controls if the modal should show or hide. |
12
14
 
13
15
  ### Property Details
14
16
 
17
+ #### close (JS only)
18
+
19
+
20
+
21
+ - Type: `close() => void`
22
+ - Default: `-`
23
+
15
24
  #### content-id
16
25
 
26
+ **Deprecated**: This ID has no effect
27
+
17
28
 
18
29
 
19
- - Type: `string`
30
+ - Type: `string | undefined`
20
31
  - Default: `-`
21
32
 
22
33
  #### ignore-backdrop-clicks
@@ -26,6 +37,13 @@ Ignores clicks to the backdrop when set
26
37
  - Type: `boolean`
27
38
  - Default: `false`
28
39
 
40
+ #### open (JS only)
41
+
42
+
43
+
44
+ - Type: `open() => void`
45
+ - Default: `-`
46
+
29
47
  #### show
30
48
 
31
49
  Controls if the modal should show or hide.