kemet-ui 3.0.1 → 4.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (482) hide show
  1. package/custom-elements.json +2671 -1274
  2. package/dist/{components/kemet-accordion/styles.js → styles/elements/accordion.ts} +4 -3
  3. package/dist/{components/kemet-alert/styles.js → styles/elements/alert.ts} +53 -3
  4. package/dist/{components/kemet-avatar/styles.js → styles/elements/avatar.ts} +26 -12
  5. package/dist/styles/elements/badge.ts +92 -0
  6. package/dist/{components/kemet-button/styles.js → styles/elements/button.ts} +32 -13
  7. package/dist/{components/kemet-card/styles.js → styles/elements/card.ts} +3 -3
  8. package/dist/{components/kemet-carousel/styles.js → styles/elements/carousel.ts} +2 -2
  9. package/dist/{components/kemet-checkbox/styles.js → styles/elements/checkbox.ts} +2 -2
  10. package/dist/{components/kemet-combo/styles.js → styles/elements/combo.ts} +2 -2
  11. package/dist/{components/kemet-drawer/styles.js → styles/elements/drawer.ts} +5 -3
  12. package/dist/{components/kemet-fab/styles.js → styles/elements/fab.ts} +2 -2
  13. package/dist/{components/kemet-field/styles.js → styles/elements/field.ts} +2 -14
  14. package/dist/{components/kemet-flipcard/styles.js → styles/elements/flipcard.ts} +2 -2
  15. package/dist/styles/elements/icon-lucide.ts +7 -0
  16. package/dist/{components/kemet-input/styles.js → styles/elements/input.ts} +36 -12
  17. package/dist/{components/kemet-modal/styles.js → styles/elements/modal.ts} +27 -6
  18. package/dist/styles/elements/multi-input.ts +125 -0
  19. package/dist/{components/kemet-password/styles.js → styles/elements/password.ts} +3 -3
  20. package/dist/{components/kemet-popper/styles.effects.js → styles/elements/popper.ts} +52 -9
  21. package/dist/{components/kemet-radio/styles.js → styles/elements/radio.ts} +4 -3
  22. package/dist/{components/kemet-rotator/styles.js → styles/elements/rotator.ts} +2 -2
  23. package/dist/{components/kemet-scroll-nav/styles.js → styles/elements/scroll-nav.ts} +2 -2
  24. package/dist/{components/kemet-scroll-snap/styles.js → styles/elements/scroll-snap.ts} +4 -3
  25. package/dist/{components/kemet-select/styles.js → styles/elements/select.ts} +34 -10
  26. package/dist/{components/kemet-sortable/styles.js → styles/elements/sortable.ts} +4 -3
  27. package/dist/{components/kemet-tabs/styles.js → styles/elements/tabs.ts} +7 -5
  28. package/dist/{components/kemet-textarea/styles.js → styles/elements/textarea.ts} +29 -4
  29. package/dist/styles/elements/timer.ts +13 -0
  30. package/dist/{components/kemet-toggle/styles.js → styles/elements/toggle.ts} +2 -2
  31. package/dist/{components/kemet-tooltip/styles.js → styles/elements/tooltip.ts} +2 -2
  32. package/dist/{components/kemet-tracker/styles.js → styles/elements/tracker.ts} +2 -2
  33. package/dist/{components/kemet-upload/styles.js → styles/elements/upload.ts} +6 -4
  34. package/dist/styles/kemet.base.css +24 -2
  35. package/dist/styles/kemet.base.css.map +1 -1
  36. package/dist/styles/kemet.core.css +266 -2
  37. package/dist/styles/kemet.core.css.map +1 -1
  38. package/dist/styles/shared/_config.scss +25 -1
  39. package/dist/styles/shared/_helpers.scss +19 -18
  40. package/package.json +76 -80
  41. package/types/global.d.ts +3 -0
  42. package/types/jsx.d.ts +140 -0
  43. package/dist/components/kemet-accordion/kemet-accordion-panel.d.ts +0 -50
  44. package/dist/components/kemet-accordion/kemet-accordion-panel.js +0 -137
  45. package/dist/components/kemet-accordion/kemet-accordion-panel.js.map +0 -1
  46. package/dist/components/kemet-accordion/kemet-accordion.d.ts +0 -38
  47. package/dist/components/kemet-accordion/kemet-accordion.js +0 -138
  48. package/dist/components/kemet-accordion/kemet-accordion.js.map +0 -1
  49. package/dist/components/kemet-accordion/stories.d.ts +0 -12
  50. package/dist/components/kemet-accordion/stories.js +0 -47
  51. package/dist/components/kemet-accordion/stories.js.map +0 -1
  52. package/dist/components/kemet-accordion/styles.d.ts +0 -2
  53. package/dist/components/kemet-accordion/styles.js.map +0 -1
  54. package/dist/components/kemet-alert/docs/stories.d.ts +0 -21
  55. package/dist/components/kemet-alert/docs/stories.js +0 -221
  56. package/dist/components/kemet-alert/docs/stories.js.map +0 -1
  57. package/dist/components/kemet-alert/kemet-alert.d.ts +0 -51
  58. package/dist/components/kemet-alert/kemet-alert.js +0 -111
  59. package/dist/components/kemet-alert/kemet-alert.js.map +0 -1
  60. package/dist/components/kemet-alert/styles.d.ts +0 -1
  61. package/dist/components/kemet-alert/styles.js.map +0 -1
  62. package/dist/components/kemet-alert/types.d.ts +0 -1
  63. package/dist/components/kemet-alert/types.js +0 -2
  64. package/dist/components/kemet-alert/types.js.map +0 -1
  65. package/dist/components/kemet-avatar/docs/stories.d.ts +0 -15
  66. package/dist/components/kemet-avatar/docs/stories.js +0 -108
  67. package/dist/components/kemet-avatar/docs/stories.js.map +0 -1
  68. package/dist/components/kemet-avatar/kemet-avatar.d.ts +0 -43
  69. package/dist/components/kemet-avatar/kemet-avatar.js +0 -78
  70. package/dist/components/kemet-avatar/kemet-avatar.js.map +0 -1
  71. package/dist/components/kemet-avatar/kemet-avatars.d.ts +0 -20
  72. package/dist/components/kemet-avatar/kemet-avatars.js +0 -25
  73. package/dist/components/kemet-avatar/kemet-avatars.js.map +0 -1
  74. package/dist/components/kemet-avatar/styles.d.ts +0 -2
  75. package/dist/components/kemet-avatar/styles.js.map +0 -1
  76. package/dist/components/kemet-badge/docs/stories.d.ts +0 -15
  77. package/dist/components/kemet-badge/docs/stories.js +0 -76
  78. package/dist/components/kemet-badge/docs/stories.js.map +0 -1
  79. package/dist/components/kemet-badge/kemet-badge.d.ts +0 -31
  80. package/dist/components/kemet-badge/kemet-badge.js +0 -55
  81. package/dist/components/kemet-badge/kemet-badge.js.map +0 -1
  82. package/dist/components/kemet-badge/styles.d.ts +0 -1
  83. package/dist/components/kemet-badge/styles.js +0 -42
  84. package/dist/components/kemet-badge/styles.js.map +0 -1
  85. package/dist/components/kemet-badge/types.d.ts +0 -1
  86. package/dist/components/kemet-badge/types.js +0 -2
  87. package/dist/components/kemet-badge/types.js.map +0 -1
  88. package/dist/components/kemet-button/docs/stories.d.ts +0 -21
  89. package/dist/components/kemet-button/docs/stories.js +0 -112
  90. package/dist/components/kemet-button/docs/stories.js.map +0 -1
  91. package/dist/components/kemet-button/kemet-button.d.ts +0 -89
  92. package/dist/components/kemet-button/kemet-button.js +0 -153
  93. package/dist/components/kemet-button/kemet-button.js.map +0 -1
  94. package/dist/components/kemet-button/styles.d.ts +0 -1
  95. package/dist/components/kemet-button/styles.js.map +0 -1
  96. package/dist/components/kemet-button/types.d.ts +0 -1
  97. package/dist/components/kemet-button/types.js +0 -2
  98. package/dist/components/kemet-button/types.js.map +0 -1
  99. package/dist/components/kemet-card/docs/stories.d.ts +0 -19
  100. package/dist/components/kemet-card/docs/stories.js +0 -120
  101. package/dist/components/kemet-card/docs/stories.js.map +0 -1
  102. package/dist/components/kemet-card/kemet-card.d.ts +0 -47
  103. package/dist/components/kemet-card/kemet-card.js +0 -65
  104. package/dist/components/kemet-card/kemet-card.js.map +0 -1
  105. package/dist/components/kemet-card/styles.d.ts +0 -1
  106. package/dist/components/kemet-card/styles.js.map +0 -1
  107. package/dist/components/kemet-carousel/docs/stories.d.ts +0 -23
  108. package/dist/components/kemet-carousel/docs/stories.js +0 -180
  109. package/dist/components/kemet-carousel/docs/stories.js.map +0 -1
  110. package/dist/components/kemet-carousel/kemet-carousel-current.d.ts +0 -26
  111. package/dist/components/kemet-carousel/kemet-carousel-current.js +0 -44
  112. package/dist/components/kemet-carousel/kemet-carousel-current.js.map +0 -1
  113. package/dist/components/kemet-carousel/kemet-carousel-first.d.ts +0 -25
  114. package/dist/components/kemet-carousel/kemet-carousel-first.js +0 -50
  115. package/dist/components/kemet-carousel/kemet-carousel-first.js.map +0 -1
  116. package/dist/components/kemet-carousel/kemet-carousel-last.d.ts +0 -25
  117. package/dist/components/kemet-carousel/kemet-carousel-last.js +0 -50
  118. package/dist/components/kemet-carousel/kemet-carousel-last.js.map +0 -1
  119. package/dist/components/kemet-carousel/kemet-carousel-link.d.ts +0 -31
  120. package/dist/components/kemet-carousel/kemet-carousel-link.js +0 -64
  121. package/dist/components/kemet-carousel/kemet-carousel-link.js.map +0 -1
  122. package/dist/components/kemet-carousel/kemet-carousel-next.d.ts +0 -25
  123. package/dist/components/kemet-carousel/kemet-carousel-next.js +0 -50
  124. package/dist/components/kemet-carousel/kemet-carousel-next.js.map +0 -1
  125. package/dist/components/kemet-carousel/kemet-carousel-prev.d.ts +0 -25
  126. package/dist/components/kemet-carousel/kemet-carousel-prev.js +0 -50
  127. package/dist/components/kemet-carousel/kemet-carousel-prev.js.map +0 -1
  128. package/dist/components/kemet-carousel/kemet-carousel-slide.d.ts +0 -29
  129. package/dist/components/kemet-carousel/kemet-carousel-slide.js +0 -53
  130. package/dist/components/kemet-carousel/kemet-carousel-slide.js.map +0 -1
  131. package/dist/components/kemet-carousel/kemet-carousel-total.d.ts +0 -26
  132. package/dist/components/kemet-carousel/kemet-carousel-total.js +0 -44
  133. package/dist/components/kemet-carousel/kemet-carousel-total.js.map +0 -1
  134. package/dist/components/kemet-carousel/kemet-carousel.d.ts +0 -118
  135. package/dist/components/kemet-carousel/kemet-carousel.js +0 -429
  136. package/dist/components/kemet-carousel/kemet-carousel.js.map +0 -1
  137. package/dist/components/kemet-carousel/styles.d.ts +0 -1
  138. package/dist/components/kemet-carousel/styles.js.map +0 -1
  139. package/dist/components/kemet-checkbox/docs/stories.d.ts +0 -13
  140. package/dist/components/kemet-checkbox/docs/stories.js +0 -45
  141. package/dist/components/kemet-checkbox/docs/stories.js.map +0 -1
  142. package/dist/components/kemet-checkbox/kemet-checkbox.d.ts +0 -71
  143. package/dist/components/kemet-checkbox/kemet-checkbox.js +0 -192
  144. package/dist/components/kemet-checkbox/kemet-checkbox.js.map +0 -1
  145. package/dist/components/kemet-checkbox/styles.d.ts +0 -1
  146. package/dist/components/kemet-checkbox/styles.js.map +0 -1
  147. package/dist/components/kemet-checkbox/types.d.ts +0 -15
  148. package/dist/components/kemet-checkbox/types.js +0 -2
  149. package/dist/components/kemet-checkbox/types.js.map +0 -1
  150. package/dist/components/kemet-combo/docs/stories.d.ts +0 -11
  151. package/dist/components/kemet-combo/docs/stories.js +0 -32
  152. package/dist/components/kemet-combo/docs/stories.js.map +0 -1
  153. package/dist/components/kemet-combo/kemet-combo.d.ts +0 -50
  154. package/dist/components/kemet-combo/kemet-combo.js +0 -158
  155. package/dist/components/kemet-combo/kemet-combo.js.map +0 -1
  156. package/dist/components/kemet-combo/styles.d.ts +0 -1
  157. package/dist/components/kemet-combo/styles.js.map +0 -1
  158. package/dist/components/kemet-count/docs/stories.d.ts +0 -11
  159. package/dist/components/kemet-count/docs/stories.js +0 -36
  160. package/dist/components/kemet-count/docs/stories.js.map +0 -1
  161. package/dist/components/kemet-count/kemet-count.d.ts +0 -39
  162. package/dist/components/kemet-count/kemet-count.js +0 -98
  163. package/dist/components/kemet-count/kemet-count.js.map +0 -1
  164. package/dist/components/kemet-draggable/docs/stories.d.ts +0 -10
  165. package/dist/components/kemet-draggable/docs/stories.js +0 -25
  166. package/dist/components/kemet-draggable/docs/stories.js.map +0 -1
  167. package/dist/components/kemet-draggable/kemet-draggable.d.ts +0 -49
  168. package/dist/components/kemet-draggable/kemet-draggable.js +0 -138
  169. package/dist/components/kemet-draggable/kemet-draggable.js.map +0 -1
  170. package/dist/components/kemet-drawer/docs/stories.d.ts +0 -16
  171. package/dist/components/kemet-drawer/docs/stories.js +0 -90
  172. package/dist/components/kemet-drawer/docs/stories.js.map +0 -1
  173. package/dist/components/kemet-drawer/kemet-drawer.d.ts +0 -48
  174. package/dist/components/kemet-drawer/kemet-drawer.js +0 -95
  175. package/dist/components/kemet-drawer/kemet-drawer.js.map +0 -1
  176. package/dist/components/kemet-drawer/styles.d.ts +0 -2
  177. package/dist/components/kemet-drawer/styles.js.map +0 -1
  178. package/dist/components/kemet-drawer/types.d.ts +0 -2
  179. package/dist/components/kemet-drawer/types.js +0 -2
  180. package/dist/components/kemet-drawer/types.js.map +0 -1
  181. package/dist/components/kemet-fab/docs/stories.d.ts +0 -14
  182. package/dist/components/kemet-fab/docs/stories.js +0 -78
  183. package/dist/components/kemet-fab/docs/stories.js.map +0 -1
  184. package/dist/components/kemet-fab/kemet-fab.d.ts +0 -49
  185. package/dist/components/kemet-fab/kemet-fab.js +0 -107
  186. package/dist/components/kemet-fab/kemet-fab.js.map +0 -1
  187. package/dist/components/kemet-fab/styles.d.ts +0 -1
  188. package/dist/components/kemet-fab/styles.js.map +0 -1
  189. package/dist/components/kemet-fab/types.d.ts +0 -8
  190. package/dist/components/kemet-fab/types.js +0 -2
  191. package/dist/components/kemet-fab/types.js.map +0 -1
  192. package/dist/components/kemet-field/docs/stories.d.ts +0 -15
  193. package/dist/components/kemet-field/docs/stories.js +0 -55
  194. package/dist/components/kemet-field/docs/stories.js.map +0 -1
  195. package/dist/components/kemet-field/kemet-field.d.ts +0 -61
  196. package/dist/components/kemet-field/kemet-field.js +0 -139
  197. package/dist/components/kemet-field/kemet-field.js.map +0 -1
  198. package/dist/components/kemet-field/styles.d.ts +0 -1
  199. package/dist/components/kemet-field/styles.js.map +0 -1
  200. package/dist/components/kemet-field/types.d.ts +0 -13
  201. package/dist/components/kemet-field/types.js +0 -2
  202. package/dist/components/kemet-field/types.js.map +0 -1
  203. package/dist/components/kemet-flipcard/docs/stories.d.ts +0 -14
  204. package/dist/components/kemet-flipcard/docs/stories.js +0 -60
  205. package/dist/components/kemet-flipcard/docs/stories.js.map +0 -1
  206. package/dist/components/kemet-flipcard/kemet-flipcard-trigger.d.ts +0 -21
  207. package/dist/components/kemet-flipcard/kemet-flipcard-trigger.js +0 -41
  208. package/dist/components/kemet-flipcard/kemet-flipcard-trigger.js.map +0 -1
  209. package/dist/components/kemet-flipcard/kemet-flipcard.d.ts +0 -52
  210. package/dist/components/kemet-flipcard/kemet-flipcard.js +0 -129
  211. package/dist/components/kemet-flipcard/kemet-flipcard.js.map +0 -1
  212. package/dist/components/kemet-flipcard/styles.d.ts +0 -1
  213. package/dist/components/kemet-flipcard/styles.js.map +0 -1
  214. package/dist/components/kemet-flipcard/types.d.ts +0 -7
  215. package/dist/components/kemet-flipcard/types.js +0 -2
  216. package/dist/components/kemet-flipcard/types.js.map +0 -1
  217. package/dist/components/kemet-icon/docs/stories.d.ts +0 -9
  218. package/dist/components/kemet-icon/docs/stories.js +0 -27
  219. package/dist/components/kemet-icon/docs/stories.js.map +0 -1
  220. package/dist/components/kemet-icon/kemet-icon.d.ts +0 -28
  221. package/dist/components/kemet-icon/kemet-icon.js +0 -114
  222. package/dist/components/kemet-icon/kemet-icon.js.map +0 -1
  223. package/dist/components/kemet-icon/styles.d.ts +0 -1
  224. package/dist/components/kemet-icon/styles.js +0 -9
  225. package/dist/components/kemet-icon/styles.js.map +0 -1
  226. package/dist/components/kemet-icon/types.d.ts +0 -5
  227. package/dist/components/kemet-icon/types.js +0 -2
  228. package/dist/components/kemet-icon/types.js.map +0 -1
  229. package/dist/components/kemet-input/docs/stories.d.ts +0 -13
  230. package/dist/components/kemet-input/docs/stories.js +0 -83
  231. package/dist/components/kemet-input/docs/stories.js.map +0 -1
  232. package/dist/components/kemet-input/kemet-input.d.ts +0 -174
  233. package/dist/components/kemet-input/kemet-input.js +0 -397
  234. package/dist/components/kemet-input/kemet-input.js.map +0 -1
  235. package/dist/components/kemet-input/styles.d.ts +0 -1
  236. package/dist/components/kemet-input/styles.js.map +0 -1
  237. package/dist/components/kemet-input/types.d.ts +0 -35
  238. package/dist/components/kemet-input/types.js +0 -2
  239. package/dist/components/kemet-input/types.js.map +0 -1
  240. package/dist/components/kemet-modal/docs/stories.d.ts +0 -12
  241. package/dist/components/kemet-modal/docs/stories.js +0 -58
  242. package/dist/components/kemet-modal/docs/stories.js.map +0 -1
  243. package/dist/components/kemet-modal/kemet-modal-close.d.ts +0 -21
  244. package/dist/components/kemet-modal/kemet-modal-close.js +0 -40
  245. package/dist/components/kemet-modal/kemet-modal-close.js.map +0 -1
  246. package/dist/components/kemet-modal/kemet-modal.d.ts +0 -59
  247. package/dist/components/kemet-modal/kemet-modal.js +0 -150
  248. package/dist/components/kemet-modal/kemet-modal.js.map +0 -1
  249. package/dist/components/kemet-modal/styles.d.ts +0 -2
  250. package/dist/components/kemet-modal/styles.js.map +0 -1
  251. package/dist/components/kemet-modal/types.d.ts +0 -8
  252. package/dist/components/kemet-modal/types.js +0 -2
  253. package/dist/components/kemet-modal/types.js.map +0 -1
  254. package/dist/components/kemet-password/docs/stories.d.ts +0 -10
  255. package/dist/components/kemet-password/docs/stories.js +0 -29
  256. package/dist/components/kemet-password/docs/stories.js.map +0 -1
  257. package/dist/components/kemet-password/kemet-password.d.ts +0 -83
  258. package/dist/components/kemet-password/kemet-password.js +0 -155
  259. package/dist/components/kemet-password/kemet-password.js.map +0 -1
  260. package/dist/components/kemet-password/styles.d.ts +0 -1
  261. package/dist/components/kemet-password/styles.js.map +0 -1
  262. package/dist/components/kemet-password/types.d.ts +0 -10
  263. package/dist/components/kemet-password/types.js +0 -2
  264. package/dist/components/kemet-password/types.js.map +0 -1
  265. package/dist/components/kemet-popper/docs/stories.d.ts +0 -12
  266. package/dist/components/kemet-popper/docs/stories.js +0 -65
  267. package/dist/components/kemet-popper/docs/stories.js.map +0 -1
  268. package/dist/components/kemet-popper/kemet-popper-close.d.ts +0 -22
  269. package/dist/components/kemet-popper/kemet-popper-close.js +0 -48
  270. package/dist/components/kemet-popper/kemet-popper-close.js.map +0 -1
  271. package/dist/components/kemet-popper/kemet-popper.d.ts +0 -72
  272. package/dist/components/kemet-popper/kemet-popper.js +0 -173
  273. package/dist/components/kemet-popper/kemet-popper.js.map +0 -1
  274. package/dist/components/kemet-popper/styles.d.ts +0 -1
  275. package/dist/components/kemet-popper/styles.effects.d.ts +0 -8
  276. package/dist/components/kemet-popper/styles.effects.js.map +0 -1
  277. package/dist/components/kemet-popper/styles.js +0 -37
  278. package/dist/components/kemet-popper/styles.js.map +0 -1
  279. package/dist/components/kemet-popper/types.d.ts +0 -3
  280. package/dist/components/kemet-popper/types.js +0 -2
  281. package/dist/components/kemet-popper/types.js.map +0 -1
  282. package/dist/components/kemet-radio/docs/stories.d.ts +0 -12
  283. package/dist/components/kemet-radio/docs/stories.js +0 -44
  284. package/dist/components/kemet-radio/docs/stories.js.map +0 -1
  285. package/dist/components/kemet-radio/kemet-radio.d.ts +0 -57
  286. package/dist/components/kemet-radio/kemet-radio.js +0 -130
  287. package/dist/components/kemet-radio/kemet-radio.js.map +0 -1
  288. package/dist/components/kemet-radio/kemet-radios.d.ts +0 -50
  289. package/dist/components/kemet-radio/kemet-radios.js +0 -149
  290. package/dist/components/kemet-radio/kemet-radios.js.map +0 -1
  291. package/dist/components/kemet-radio/styles.d.ts +0 -2
  292. package/dist/components/kemet-radio/styles.js.map +0 -1
  293. package/dist/components/kemet-radio/types.d.ts +0 -20
  294. package/dist/components/kemet-radio/types.js +0 -2
  295. package/dist/components/kemet-radio/types.js.map +0 -1
  296. package/dist/components/kemet-rotator/docs/stories.d.ts +0 -10
  297. package/dist/components/kemet-rotator/docs/stories.js +0 -34
  298. package/dist/components/kemet-rotator/docs/stories.js.map +0 -1
  299. package/dist/components/kemet-rotator/kemet-rotator.d.ts +0 -40
  300. package/dist/components/kemet-rotator/kemet-rotator.js +0 -121
  301. package/dist/components/kemet-rotator/kemet-rotator.js.map +0 -1
  302. package/dist/components/kemet-rotator/styles.d.ts +0 -1
  303. package/dist/components/kemet-rotator/styles.js.map +0 -1
  304. package/dist/components/kemet-rotator/types.d.ts +0 -9
  305. package/dist/components/kemet-rotator/types.js +0 -2
  306. package/dist/components/kemet-rotator/types.js.map +0 -1
  307. package/dist/components/kemet-scroll-link/docs/stories.d.ts +0 -9
  308. package/dist/components/kemet-scroll-link/docs/stories.js +0 -97
  309. package/dist/components/kemet-scroll-link/docs/stories.js.map +0 -1
  310. package/dist/components/kemet-scroll-link/kemet-scroll-link.d.ts +0 -31
  311. package/dist/components/kemet-scroll-link/kemet-scroll-link.js +0 -83
  312. package/dist/components/kemet-scroll-link/kemet-scroll-link.js.map +0 -1
  313. package/dist/components/kemet-scroll-link/types.d.ts +0 -6
  314. package/dist/components/kemet-scroll-link/types.js +0 -2
  315. package/dist/components/kemet-scroll-link/types.js.map +0 -1
  316. package/dist/components/kemet-scroll-nav/docs/stories.d.ts +0 -10
  317. package/dist/components/kemet-scroll-nav/docs/stories.js +0 -162
  318. package/dist/components/kemet-scroll-nav/docs/stories.js.map +0 -1
  319. package/dist/components/kemet-scroll-nav/kemet-scroll-nav.d.ts +0 -34
  320. package/dist/components/kemet-scroll-nav/kemet-scroll-nav.js +0 -65
  321. package/dist/components/kemet-scroll-nav/kemet-scroll-nav.js.map +0 -1
  322. package/dist/components/kemet-scroll-nav/styles.d.ts +0 -1
  323. package/dist/components/kemet-scroll-nav/styles.js.map +0 -1
  324. package/dist/components/kemet-scroll-nav/types.d.ts +0 -6
  325. package/dist/components/kemet-scroll-nav/types.js +0 -2
  326. package/dist/components/kemet-scroll-nav/types.js.map +0 -1
  327. package/dist/components/kemet-scroll-snap/docs/stories.d.ts +0 -17
  328. package/dist/components/kemet-scroll-snap/docs/stories.js +0 -121
  329. package/dist/components/kemet-scroll-snap/docs/stories.js.map +0 -1
  330. package/dist/components/kemet-scroll-snap/kemet-scroll-snap-paginator.d.ts +0 -45
  331. package/dist/components/kemet-scroll-snap/kemet-scroll-snap-paginator.js +0 -120
  332. package/dist/components/kemet-scroll-snap/kemet-scroll-snap-paginator.js.map +0 -1
  333. package/dist/components/kemet-scroll-snap/kemet-scroll-snap-slide.d.ts +0 -30
  334. package/dist/components/kemet-scroll-snap/kemet-scroll-snap-slide.js +0 -53
  335. package/dist/components/kemet-scroll-snap/kemet-scroll-snap-slide.js.map +0 -1
  336. package/dist/components/kemet-scroll-snap/kemet-scroll-snap.d.ts +0 -47
  337. package/dist/components/kemet-scroll-snap/kemet-scroll-snap.js +0 -117
  338. package/dist/components/kemet-scroll-snap/kemet-scroll-snap.js.map +0 -1
  339. package/dist/components/kemet-scroll-snap/styles.d.ts +0 -2
  340. package/dist/components/kemet-scroll-snap/styles.js.map +0 -1
  341. package/dist/components/kemet-scroll-snap/types.d.ts +0 -20
  342. package/dist/components/kemet-scroll-snap/types.js +0 -2
  343. package/dist/components/kemet-scroll-snap/types.js.map +0 -1
  344. package/dist/components/kemet-select/docs/stories.d.ts +0 -13
  345. package/dist/components/kemet-select/docs/stories.js +0 -49
  346. package/dist/components/kemet-select/docs/stories.js.map +0 -1
  347. package/dist/components/kemet-select/kemet-option.d.ts +0 -29
  348. package/dist/components/kemet-select/kemet-option.js +0 -45
  349. package/dist/components/kemet-select/kemet-option.js.map +0 -1
  350. package/dist/components/kemet-select/kemet-select.d.ts +0 -119
  351. package/dist/components/kemet-select/kemet-select.js +0 -198
  352. package/dist/components/kemet-select/kemet-select.js.map +0 -1
  353. package/dist/components/kemet-select/styles.d.ts +0 -1
  354. package/dist/components/kemet-select/styles.js.map +0 -1
  355. package/dist/components/kemet-select/types.d.ts +0 -20
  356. package/dist/components/kemet-select/types.js +0 -2
  357. package/dist/components/kemet-select/types.js.map +0 -1
  358. package/dist/components/kemet-sortable/docs/stories.d.ts +0 -10
  359. package/dist/components/kemet-sortable/docs/stories.js +0 -29
  360. package/dist/components/kemet-sortable/docs/stories.js.map +0 -1
  361. package/dist/components/kemet-sortable/kemet-sortable-item.d.ts +0 -21
  362. package/dist/components/kemet-sortable/kemet-sortable-item.js +0 -30
  363. package/dist/components/kemet-sortable/kemet-sortable-item.js.map +0 -1
  364. package/dist/components/kemet-sortable/kemet-sortable.d.ts +0 -25
  365. package/dist/components/kemet-sortable/kemet-sortable.js +0 -77
  366. package/dist/components/kemet-sortable/kemet-sortable.js.map +0 -1
  367. package/dist/components/kemet-sortable/styles.d.ts +0 -2
  368. package/dist/components/kemet-sortable/styles.js.map +0 -1
  369. package/dist/components/kemet-sortable/types.d.ts +0 -3
  370. package/dist/components/kemet-sortable/types.js +0 -2
  371. package/dist/components/kemet-sortable/types.js.map +0 -1
  372. package/dist/components/kemet-svgs/docs/stories.d.ts +0 -10
  373. package/dist/components/kemet-svgs/docs/stories.js +0 -67
  374. package/dist/components/kemet-svgs/docs/stories.js.map +0 -1
  375. package/dist/components/kemet-svgs/kemet-svg.d.ts +0 -38
  376. package/dist/components/kemet-svgs/kemet-svg.js +0 -97
  377. package/dist/components/kemet-svgs/kemet-svg.js.map +0 -1
  378. package/dist/components/kemet-svgs/kemet-svgs.d.ts +0 -27
  379. package/dist/components/kemet-svgs/kemet-svgs.js +0 -51
  380. package/dist/components/kemet-svgs/kemet-svgs.js.map +0 -1
  381. package/dist/components/kemet-svgs/types.d.ts +0 -10
  382. package/dist/components/kemet-svgs/types.js +0 -2
  383. package/dist/components/kemet-svgs/types.js.map +0 -1
  384. package/dist/components/kemet-tabs/docs/stories.d.ts +0 -18
  385. package/dist/components/kemet-tabs/docs/stories.js +0 -142
  386. package/dist/components/kemet-tabs/docs/stories.js.map +0 -1
  387. package/dist/components/kemet-tabs/kemet-tab-panel.d.ts +0 -28
  388. package/dist/components/kemet-tabs/kemet-tab-panel.js +0 -55
  389. package/dist/components/kemet-tabs/kemet-tab-panel.js.map +0 -1
  390. package/dist/components/kemet-tabs/kemet-tab.d.ts +0 -38
  391. package/dist/components/kemet-tabs/kemet-tab.js +0 -82
  392. package/dist/components/kemet-tabs/kemet-tab.js.map +0 -1
  393. package/dist/components/kemet-tabs/kemet-tabs.d.ts +0 -100
  394. package/dist/components/kemet-tabs/kemet-tabs.js +0 -487
  395. package/dist/components/kemet-tabs/kemet-tabs.js.map +0 -1
  396. package/dist/components/kemet-tabs/styles.d.ts +0 -3
  397. package/dist/components/kemet-tabs/styles.js.map +0 -1
  398. package/dist/components/kemet-tabs/types.d.ts +0 -27
  399. package/dist/components/kemet-tabs/types.js +0 -2
  400. package/dist/components/kemet-tabs/types.js.map +0 -1
  401. package/dist/components/kemet-textarea/docs/stories.d.ts +0 -12
  402. package/dist/components/kemet-textarea/docs/stories.js +0 -58
  403. package/dist/components/kemet-textarea/docs/stories.js.map +0 -1
  404. package/dist/components/kemet-textarea/kemet-textarea.d.ts +0 -123
  405. package/dist/components/kemet-textarea/kemet-textarea.js +0 -293
  406. package/dist/components/kemet-textarea/kemet-textarea.js.map +0 -1
  407. package/dist/components/kemet-textarea/styles.d.ts +0 -1
  408. package/dist/components/kemet-textarea/styles.js.map +0 -1
  409. package/dist/components/kemet-textarea/types.d.ts +0 -20
  410. package/dist/components/kemet-textarea/types.js +0 -2
  411. package/dist/components/kemet-textarea/types.js.map +0 -1
  412. package/dist/components/kemet-toggle/docs/stories.d.ts +0 -11
  413. package/dist/components/kemet-toggle/docs/stories.js +0 -43
  414. package/dist/components/kemet-toggle/docs/stories.js.map +0 -1
  415. package/dist/components/kemet-toggle/kemet-toggle.d.ts +0 -60
  416. package/dist/components/kemet-toggle/kemet-toggle.js +0 -130
  417. package/dist/components/kemet-toggle/kemet-toggle.js.map +0 -1
  418. package/dist/components/kemet-toggle/styles.d.ts +0 -1
  419. package/dist/components/kemet-toggle/styles.js.map +0 -1
  420. package/dist/components/kemet-toggle/types.d.ts +0 -10
  421. package/dist/components/kemet-toggle/types.js +0 -2
  422. package/dist/components/kemet-toggle/types.js.map +0 -1
  423. package/dist/components/kemet-tooltip/docs/stories.d.ts +0 -14
  424. package/dist/components/kemet-tooltip/docs/stories.js +0 -97
  425. package/dist/components/kemet-tooltip/docs/stories.js.map +0 -1
  426. package/dist/components/kemet-tooltip/kemet-tooltip.d.ts +0 -33
  427. package/dist/components/kemet-tooltip/kemet-tooltip.js +0 -69
  428. package/dist/components/kemet-tooltip/kemet-tooltip.js.map +0 -1
  429. package/dist/components/kemet-tooltip/styles.d.ts +0 -1
  430. package/dist/components/kemet-tooltip/styles.js.map +0 -1
  431. package/dist/components/kemet-tooltip/types.d.ts +0 -3
  432. package/dist/components/kemet-tooltip/types.js +0 -2
  433. package/dist/components/kemet-tooltip/types.js.map +0 -1
  434. package/dist/components/kemet-tracker/docs/stories.d.ts +0 -11
  435. package/dist/components/kemet-tracker/docs/stories.js +0 -42
  436. package/dist/components/kemet-tracker/docs/stories.js.map +0 -1
  437. package/dist/components/kemet-tracker/kemet-tracker-step.d.ts +0 -63
  438. package/dist/components/kemet-tracker/kemet-tracker-step.js +0 -127
  439. package/dist/components/kemet-tracker/kemet-tracker-step.js.map +0 -1
  440. package/dist/components/kemet-tracker/kemet-tracker.d.ts +0 -27
  441. package/dist/components/kemet-tracker/kemet-tracker.js +0 -70
  442. package/dist/components/kemet-tracker/kemet-tracker.js.map +0 -1
  443. package/dist/components/kemet-tracker/styles.d.ts +0 -1
  444. package/dist/components/kemet-tracker/styles.js.map +0 -1
  445. package/dist/components/kemet-tracker/types.d.ts +0 -13
  446. package/dist/components/kemet-tracker/types.js +0 -2
  447. package/dist/components/kemet-tracker/types.js.map +0 -1
  448. package/dist/components/kemet-upload/docs/stories.d.ts +0 -10
  449. package/dist/components/kemet-upload/docs/stories.js +0 -52
  450. package/dist/components/kemet-upload/docs/stories.js.map +0 -1
  451. package/dist/components/kemet-upload/kemet-upload-file.d.ts +0 -46
  452. package/dist/components/kemet-upload/kemet-upload-file.js +0 -109
  453. package/dist/components/kemet-upload/kemet-upload-file.js.map +0 -1
  454. package/dist/components/kemet-upload/kemet-upload.d.ts +0 -58
  455. package/dist/components/kemet-upload/kemet-upload.js +0 -149
  456. package/dist/components/kemet-upload/kemet-upload.js.map +0 -1
  457. package/dist/components/kemet-upload/styles.d.ts +0 -3
  458. package/dist/components/kemet-upload/styles.js.map +0 -1
  459. package/dist/components/kemet-upload/types.d.ts +0 -21
  460. package/dist/components/kemet-upload/types.js +0 -2
  461. package/dist/components/kemet-upload/types.js.map +0 -1
  462. package/dist/kemet-components.bundle.js +0 -99
  463. package/dist/kemet-components.bundle.js.map +0 -1
  464. package/dist/kemet-components.cjs +0 -11691
  465. package/dist/kemet-components.js +0 -11689
  466. package/dist/styles/components/_config.scss +0 -4
  467. package/dist/styles/components/accordion.scss +0 -9
  468. package/dist/styles/components/scrollsnap.scss +0 -11
  469. package/dist/styles/kemet.components.css +0 -23
  470. package/dist/styles/kemet.components.css.map +0 -1
  471. package/dist/styles/kemet.components.scss +0 -2
  472. package/dist/tsconfig.tsbuildinfo +0 -1
  473. package/dist/utilities/controllers/forms.d.ts +0 -11
  474. package/dist/utilities/controllers/forms.js +0 -102
  475. package/dist/utilities/controllers/forms.js.map +0 -1
  476. package/dist/utilities/misc/constants.d.ts +0 -5
  477. package/dist/utilities/misc/constants.js +0 -6
  478. package/dist/utilities/misc/constants.js.map +0 -1
  479. package/dist/utilities/misc/events.d.ts +0 -1
  480. package/dist/utilities/misc/events.js +0 -4
  481. package/dist/utilities/misc/events.js.map +0 -1
  482. package/index.js +0 -1
@@ -1,58 +0,0 @@
1
- import { html } from 'lit';
2
- import { ifDefined } from 'lit/directives/if-defined.js';
3
- import '../kemet-textarea';
4
- import '../../kemet-tabs/kemet-tabs';
5
- import '../../kemet-tabs/kemet-tab';
6
- import '../../kemet-tabs/kemet-tab-panel';
7
- const meta = {
8
- title: 'Components / Textarea',
9
- component: 'kemet-textarea',
10
- argTypes: {
11
- status: {
12
- control: { type: 'radio' },
13
- options: ['standard', 'error', 'success', 'warning'],
14
- },
15
- inputmode: {
16
- control: { type: 'select' },
17
- options: ['none', 'text', 'decimal', 'numeric', 'tel', 'search', 'email', 'url'],
18
- },
19
- }
20
- };
21
- export default meta;
22
- const Template = (args) => html `<kemet-textarea
23
- status=${ifDefined(args.status)}
24
- ?required=${args.required}
25
- ?validate-on-blur=${args.validateOnBlur}
26
- placeholder=${ifDefined(args.placeholder || null)}
27
- minlength=${ifDefined(args.minlength || null)}
28
- maxlength=${ifDefined(args.maxlength || null)}
29
- inputmode=${args.inputmode}
30
- ?autofocus=${args.autofocus}
31
- ?disabled=${args.disabled}
32
- ?readonly=${args.readonly}
33
- rows=${ifDefined(args.rows)}
34
- ?filled=${args.filled}
35
- ?rounded=${args.rounded}
36
- ></kemet-textarea>`;
37
- export const Standard = {
38
- render: args => Template(args),
39
- };
40
- export const Disabled = {
41
- render: args => Template(args),
42
- args: {
43
- disabled: true
44
- }
45
- };
46
- export const Filled = {
47
- render: args => Template(args),
48
- args: {
49
- filled: true
50
- }
51
- };
52
- export const Rounded = {
53
- render: args => Template(args),
54
- args: {
55
- rounded: true
56
- }
57
- };
58
- //# sourceMappingURL=stories.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"stories.js","sourceRoot":"","sources":["../../../../src/components/kemet-textarea/docs/stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAC3B,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AAGzD,OAAO,mBAAmB,CAAC;AAE3B,OAAO,6BAA6B,CAAC;AACrC,OAAO,4BAA4B,CAAC;AACpC,OAAO,kCAAkC,CAAC;AAE1C,MAAM,IAAI,GAAS;IACjB,KAAK,EAAE,uBAAuB;IAC9B,SAAS,EAAE,gBAAgB;IAC3B,QAAQ,EAAE;QACR,MAAM,EAAE;YACN,OAAO,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE;YAC1B,OAAO,EAAE,CAAC,UAAU,EAAE,OAAO,EAAE,SAAS,EAAE,SAAS,CAAC;SACrD;QACD,SAAS,EAAE;YACT,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE;YAC3B,OAAO,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,SAAS,EAAE,SAAS,EAAE,KAAK,EAAE,QAAQ,EAAE,OAAO,EAAE,KAAK,CAAC;SACjF;KACF;CACF,CAAC;AACF,eAAe,IAAI,CAAC;AAIpB,MAAM,QAAQ,GAAG,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAA;WACpB,SAAS,CAAC,IAAI,CAAC,MAAM,CAAC;cACnB,IAAI,CAAC,QAAQ;sBACL,IAAI,CAAC,cAAc;gBACzB,SAAS,CAAC,IAAI,CAAC,WAAW,IAAI,IAAI,CAAC;cACrC,SAAS,CAAC,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC;cACjC,SAAS,CAAC,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC;cACjC,IAAI,CAAC,SAAS;eACb,IAAI,CAAC,SAAS;cACf,IAAI,CAAC,QAAQ;cACb,IAAI,CAAC,QAAQ;SAClB,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC;YACjB,IAAI,CAAC,MAAM;aACV,IAAI,CAAC,OAAO;mBACN,CAAC;AAEpB,MAAM,CAAC,MAAM,QAAQ,GAAU;IAC7B,MAAM,EAAE,IAAI,CAAC,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC;CAC/B,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAU;IAC7B,MAAM,EAAE,IAAI,CAAC,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC;IAC9B,IAAI,EAAE;QACJ,QAAQ,EAAE,IAAI;KACf;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,MAAM,GAAU;IAC3B,MAAM,EAAE,IAAI,CAAC,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC;IAC9B,IAAI,EAAE;QACJ,MAAM,EAAE,IAAI;KACb;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAU;IAC5B,MAAM,EAAE,IAAI,CAAC,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC;IAC9B,IAAI,EAAE;QACJ,OAAO,EAAE,IAAI;KACd;CACF,CAAC","sourcesContent":["import { html } from 'lit';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport type { Meta, StoryObj } from '@storybook/web-components';\n\nimport '../kemet-textarea';\n\nimport '../../kemet-tabs/kemet-tabs';\nimport '../../kemet-tabs/kemet-tab';\nimport '../../kemet-tabs/kemet-tab-panel';\n\nconst meta: Meta = {\n title: 'Components / Textarea',\n component: 'kemet-textarea',\n argTypes: {\n status: {\n control: { type: 'radio' },\n options: ['standard', 'error', 'success', 'warning'],\n },\n inputmode: {\n control: { type: 'select' },\n options: ['none', 'text', 'decimal', 'numeric', 'tel', 'search', 'email', 'url'],\n },\n }\n};\nexport default meta;\n\ntype Story = StoryObj;\n\nconst Template = (args) => html`<kemet-textarea\n status=${ifDefined(args.status)}\n ?required=${args.required}\n ?validate-on-blur=${args.validateOnBlur}\n placeholder=${ifDefined(args.placeholder || null)}\n minlength=${ifDefined(args.minlength || null)}\n maxlength=${ifDefined(args.maxlength || null)}\n inputmode=${args.inputmode}\n ?autofocus=${args.autofocus}\n ?disabled=${args.disabled}\n ?readonly=${args.readonly}\n rows=${ifDefined(args.rows)}\n ?filled=${args.filled}\n ?rounded=${args.rounded}\n></kemet-textarea>`;\n\nexport const Standard: Story = {\n render: args => Template(args),\n};\n\nexport const Disabled: Story = {\n render: args => Template(args),\n args: {\n disabled: true\n }\n};\n\nexport const Filled: Story = {\n render: args => Template(args),\n args: {\n filled: true\n }\n};\n\nexport const Rounded: Story = {\n render: args => Template(args),\n args: {\n rounded: true\n }\n};\n"]}
@@ -1,123 +0,0 @@
1
- import { LitElement } from 'lit';
2
- import { FormSubmitController } from '../../utilities/controllers/forms';
3
- import { KemetFieldInterface } from '../kemet-field/types';
4
- import { TypeStatus } from './types';
5
- /**
6
- * @since 1.0.0
7
- * @status stable
8
- *
9
- * @tagname kemet-textarea
10
- * @summary An enhanced textarea element.
11
- *
12
- * @prop {string} slug
13
- * @prop {string} name
14
- * @prop {string} placeholder
15
- * @prop {number} minlength
16
- * @prop {number} maxlength
17
- * @prop {string} inputmode
18
- * @prop {boolean} disabled
19
- * @prop {boolean} readonly
20
- * @prop {boolean} required
21
- * @prop {string} value
22
- * @prop {boolean} invalid
23
- * @prop {TypeStatus} status
24
- * @prop {boolean} validateOnBlur
25
- * @prop {boolean} rounded
26
- * @prop {boolean} filled
27
- * @prop {number} rows
28
- * @prop {boolean} autocorrect
29
- *
30
- *
31
- * @csspart textarea
32
- *
33
- * @cssproperty --kemet-textarea-padding - The padding on the textarea.
34
- * @cssproperty --kemet-textarea-border - The border of the textarea.
35
- * @cssproperty --kemet-textarea-border-color-error - The border of the error state.
36
- * @cssproperty --kemet-textarea-border-color-success - The border of the success state.
37
- * @cssproperty --kemet-textarea-border-color-warning - The border of the warning state.
38
- * @cssproperty --kemet-textarea-border-radius-rounded - The border radius on rounded.
39
- * @cssproperty --kemet-textarea-border-filled - The border on filled.
40
- * @cssproperty --kemet-textarea-color-filled - The color on filled.
41
- * @cssproperty --kemet-textarea-background-color-filled - The background-color on filled.
42
- * @cssproperty --kemet-textarea-background-color-error - The error state background color.
43
- * @cssproperty --kemet-textarea-background-color-success - The success state background color.
44
- * @cssproperty --kemet-textarea-background-color-warning - The warning state background color.
45
- *
46
- */
47
- export default class KemetTextarea extends LitElement {
48
- formSubmitController: FormSubmitController;
49
- static styles: import("lit").CSSResult[];
50
- slug: string;
51
- name: string;
52
- placeholder: string;
53
- minlength: number;
54
- maxlength: number;
55
- inputmode: string;
56
- autofocus: boolean;
57
- disabled: boolean;
58
- readonly: boolean;
59
- required: boolean;
60
- value: string;
61
- invalid: boolean;
62
- status: TypeStatus;
63
- rows: number;
64
- validateOnBlur: boolean;
65
- filled: boolean;
66
- rounded: boolean;
67
- autocorrect: boolean;
68
- form: HTMLFormElement;
69
- control: KemetFieldInterface;
70
- textarea: HTMLTextAreaElement;
71
- hasFocus: boolean;
72
- validity: ValidityState;
73
- constructor();
74
- firstUpdated(): void;
75
- render(): import("lit-html").TemplateResult<1>;
76
- /**
77
- * Handles when the textarea receives focus
78
- * @private
79
- */
80
- handleFocus(): void;
81
- /**
82
- * Handles when the textarea loses focus
83
- * @private
84
- */
85
- handleBlur(): void;
86
- /**
87
- * Handles when the textarea changes value
88
- * @private
89
- */
90
- handleChange(): void;
91
- /**
92
- * Handles when the textarea receives input
93
- * @private
94
- */
95
- handleInput(): void;
96
- /**
97
- * Handles when the textarea has an error
98
- * @private
99
- */
100
- handleInvalid(): void;
101
- /**
102
- * Checks the validity of the character limit for the count component
103
- * @private
104
- * @returns {boolean}
105
- */
106
- checkLimitValidity(): boolean;
107
- /**
108
- * Checks the validity of the standard input
109
- * @public
110
- * @returns {boolean}
111
- */
112
- checkValidity(): boolean;
113
- /**
114
- * Focuses the standard input
115
- * @public
116
- */
117
- focus(): void;
118
- }
119
- declare global {
120
- interface HTMLElementTagNameMap {
121
- 'kemet-textarea': KemetTextarea;
122
- }
123
- }
@@ -1,293 +0,0 @@
1
- import { __decorate } from "tslib";
2
- import { html, LitElement } from 'lit';
3
- import { customElement, property, state } from 'lit/decorators.js';
4
- import { ifDefined } from 'lit/directives/if-defined.js';
5
- import { live } from 'lit/directives/live.js';
6
- import { FormSubmitController } from '../../utilities/controllers/forms';
7
- import { stylesTextarea } from './styles';
8
- /**
9
- * @since 1.0.0
10
- * @status stable
11
- *
12
- * @tagname kemet-textarea
13
- * @summary An enhanced textarea element.
14
- *
15
- * @prop {string} slug
16
- * @prop {string} name
17
- * @prop {string} placeholder
18
- * @prop {number} minlength
19
- * @prop {number} maxlength
20
- * @prop {string} inputmode
21
- * @prop {boolean} disabled
22
- * @prop {boolean} readonly
23
- * @prop {boolean} required
24
- * @prop {string} value
25
- * @prop {boolean} invalid
26
- * @prop {TypeStatus} status
27
- * @prop {boolean} validateOnBlur
28
- * @prop {boolean} rounded
29
- * @prop {boolean} filled
30
- * @prop {number} rows
31
- * @prop {boolean} autocorrect
32
- *
33
- *
34
- * @csspart textarea
35
- *
36
- * @cssproperty --kemet-textarea-padding - The padding on the textarea.
37
- * @cssproperty --kemet-textarea-border - The border of the textarea.
38
- * @cssproperty --kemet-textarea-border-color-error - The border of the error state.
39
- * @cssproperty --kemet-textarea-border-color-success - The border of the success state.
40
- * @cssproperty --kemet-textarea-border-color-warning - The border of the warning state.
41
- * @cssproperty --kemet-textarea-border-radius-rounded - The border radius on rounded.
42
- * @cssproperty --kemet-textarea-border-filled - The border on filled.
43
- * @cssproperty --kemet-textarea-color-filled - The color on filled.
44
- * @cssproperty --kemet-textarea-background-color-filled - The background-color on filled.
45
- * @cssproperty --kemet-textarea-background-color-error - The error state background color.
46
- * @cssproperty --kemet-textarea-background-color-success - The success state background color.
47
- * @cssproperty --kemet-textarea-background-color-warning - The warning state background color.
48
- *
49
- */
50
- let KemetTextarea = class KemetTextarea extends LitElement {
51
- constructor() {
52
- super();
53
- this.slug = 'textarea';
54
- this.name = 'textarea';
55
- this.value = '';
56
- this.status = 'standard';
57
- this.rows = 4;
58
- /** @internal */
59
- this.formSubmitController = new FormSubmitController(this);
60
- }
61
- firstUpdated() {
62
- // elements
63
- this.form = this.closest('form');
64
- this.control = this.closest('kemet-field');
65
- this.textarea = this.shadowRoot.querySelector('textarea');
66
- }
67
- render() {
68
- return html `
69
- <textarea
70
- part="textarea"
71
- id=${this.slug}
72
- name=${this.name}
73
- .value=${live(this.value)}
74
- ?disabled=${this.disabled}
75
- ?readonly=${this.readonly}
76
- ?required=${this.required}
77
- placeholder=${ifDefined(this.placeholder)}
78
- rows=${ifDefined(this.rows)}
79
- minlength=${ifDefined(this.minlength)}
80
- maxlength=${ifDefined(this.maxlength)}
81
- autocorrect=${ifDefined(this.autocorrect)}
82
- ?autofocus=${this.autofocus}
83
- spellcheck=${ifDefined(this.spellcheck)}
84
- inputmode=${ifDefined(this.inputmode)}
85
- @change=${this.handleChange}
86
- @input=${this.handleInput}
87
- @focus=${this.handleFocus}
88
- @blur=${this.handleBlur}
89
- @invalid=${this.handleInvalid}
90
- ></textarea>
91
- `;
92
- }
93
- /**
94
- * Handles when the textarea receives focus
95
- * @private
96
- */
97
- handleFocus() {
98
- this.hasFocus = true;
99
- /**
100
- * Fires when the input receives and loses focus
101
- */
102
- this.dispatchEvent(new CustomEvent('kemet-input-focused', {
103
- bubbles: true,
104
- composed: true,
105
- detail: true,
106
- }));
107
- }
108
- /**
109
- * Handles when the textarea loses focus
110
- * @private
111
- */
112
- handleBlur() {
113
- this.hasFocus = false;
114
- /**
115
- * Fires when the input receives and loses focus
116
- */
117
- this.dispatchEvent(new CustomEvent('kemet-input-focused', {
118
- bubbles: true,
119
- composed: true,
120
- detail: false,
121
- }));
122
- if (this.validateOnBlur && this.form && !this.form.noValidate) {
123
- this.textarea.checkValidity();
124
- this.validity = this.textarea.validity;
125
- }
126
- }
127
- /**
128
- * Handles when the textarea changes value
129
- * @private
130
- */
131
- handleChange() {
132
- this.value = this.textarea.value;
133
- if (this.textarea.checkValidity() && this.checkLimitValidity()) {
134
- this.invalid = false;
135
- this.status = 'standard';
136
- this.validity = this.textarea.validity;
137
- /**
138
- * Fires when there's a change in status
139
- */
140
- this.dispatchEvent(new CustomEvent('kemet-input-status', {
141
- bubbles: true,
142
- composed: true,
143
- detail: {
144
- status: 'standard',
145
- validity: this.textarea.validity,
146
- element: this,
147
- },
148
- }));
149
- }
150
- }
151
- /**
152
- * Handles when the textarea receives input
153
- * @private
154
- */
155
- handleInput() {
156
- this.value = this.textarea.value;
157
- /**
158
- * Fires when the input receives input
159
- */
160
- this.dispatchEvent(new CustomEvent('kemet-input-input', {
161
- bubbles: true,
162
- composed: true,
163
- detail: this.value,
164
- }));
165
- }
166
- /**
167
- * Handles when the textarea has an error
168
- * @private
169
- */
170
- handleInvalid() {
171
- this.validity = this.textarea.validity;
172
- if (this.validateOnBlur) {
173
- this.invalid = true;
174
- this.status = 'error';
175
- /**
176
- * Fires when there's a change in status
177
- */
178
- this.dispatchEvent(new CustomEvent('kemet-input-status', {
179
- bubbles: true,
180
- composed: true,
181
- detail: {
182
- status: 'error',
183
- validity: this.textarea.validity,
184
- element: this,
185
- },
186
- }));
187
- }
188
- }
189
- /**
190
- * Checks the validity of the character limit for the count component
191
- * @private
192
- * @returns {boolean}
193
- */
194
- checkLimitValidity() {
195
- if (this.control) {
196
- const count = this.control.querySelector('kemet-count');
197
- if (count) {
198
- return this.value.length < count.limit;
199
- }
200
- }
201
- return true;
202
- }
203
- /**
204
- * Checks the validity of the standard input
205
- * @public
206
- * @returns {boolean}
207
- */
208
- checkValidity() {
209
- return this.textarea.checkValidity();
210
- }
211
- /**
212
- * Focuses the standard input
213
- * @public
214
- */
215
- focus() {
216
- return this.textarea.focus();
217
- }
218
- };
219
- KemetTextarea.styles = [stylesTextarea];
220
- __decorate([
221
- property({ type: String })
222
- ], KemetTextarea.prototype, "slug", void 0);
223
- __decorate([
224
- property({ type: String })
225
- ], KemetTextarea.prototype, "name", void 0);
226
- __decorate([
227
- property({ type: String })
228
- ], KemetTextarea.prototype, "placeholder", void 0);
229
- __decorate([
230
- property({ type: Number })
231
- ], KemetTextarea.prototype, "minlength", void 0);
232
- __decorate([
233
- property({ type: Number })
234
- ], KemetTextarea.prototype, "maxlength", void 0);
235
- __decorate([
236
- property({ type: String })
237
- ], KemetTextarea.prototype, "inputmode", void 0);
238
- __decorate([
239
- property({ type: Boolean })
240
- ], KemetTextarea.prototype, "autofocus", void 0);
241
- __decorate([
242
- property({ type: Boolean, reflect: true })
243
- ], KemetTextarea.prototype, "disabled", void 0);
244
- __decorate([
245
- property({ type: Boolean })
246
- ], KemetTextarea.prototype, "readonly", void 0);
247
- __decorate([
248
- property({ type: Boolean, reflect: true })
249
- ], KemetTextarea.prototype, "required", void 0);
250
- __decorate([
251
- property({ type: String })
252
- ], KemetTextarea.prototype, "value", void 0);
253
- __decorate([
254
- property({ type: Boolean, reflect: true })
255
- ], KemetTextarea.prototype, "invalid", void 0);
256
- __decorate([
257
- property({ type: String, reflect: true })
258
- ], KemetTextarea.prototype, "status", void 0);
259
- __decorate([
260
- property({ type: Number })
261
- ], KemetTextarea.prototype, "rows", void 0);
262
- __decorate([
263
- property({ type: Boolean, attribute: 'validate-on-blur' })
264
- ], KemetTextarea.prototype, "validateOnBlur", void 0);
265
- __decorate([
266
- property({ type: Boolean, reflect: true })
267
- ], KemetTextarea.prototype, "filled", void 0);
268
- __decorate([
269
- property({ type: Boolean, reflect: true })
270
- ], KemetTextarea.prototype, "rounded", void 0);
271
- __decorate([
272
- property({ type: Boolean })
273
- ], KemetTextarea.prototype, "autocorrect", void 0);
274
- __decorate([
275
- state()
276
- ], KemetTextarea.prototype, "form", void 0);
277
- __decorate([
278
- state()
279
- ], KemetTextarea.prototype, "control", void 0);
280
- __decorate([
281
- state()
282
- ], KemetTextarea.prototype, "textarea", void 0);
283
- __decorate([
284
- state()
285
- ], KemetTextarea.prototype, "hasFocus", void 0);
286
- __decorate([
287
- state()
288
- ], KemetTextarea.prototype, "validity", void 0);
289
- KemetTextarea = __decorate([
290
- customElement('kemet-textarea')
291
- ], KemetTextarea);
292
- export default KemetTextarea;
293
- //# sourceMappingURL=kemet-textarea.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"kemet-textarea.js","sourceRoot":"","sources":["../../../src/components/kemet-textarea/kemet-textarea.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { live } from 'lit/directives/live.js';\nimport { FormSubmitController } from '../../utilities/controllers/forms';\nimport { KemetFieldInterface } from '../kemet-field/types';\nimport { stylesTextarea } from './styles';\nimport { TypeStatus } from './types';\n\n/**\n * @since 1.0.0\n * @status stable\n *\n * @tagname kemet-textarea\n * @summary An enhanced textarea element.\n *\n * @prop {string} slug\n * @prop {string} name\n * @prop {string} placeholder\n * @prop {number} minlength\n * @prop {number} maxlength\n * @prop {string} inputmode\n * @prop {boolean} disabled\n * @prop {boolean} readonly\n * @prop {boolean} required\n * @prop {string} value\n * @prop {boolean} invalid\n * @prop {TypeStatus} status\n * @prop {boolean} validateOnBlur\n * @prop {boolean} rounded\n * @prop {boolean} filled\n * @prop {number} rows\n * @prop {boolean} autocorrect\n *\n *\n * @csspart textarea\n *\n * @cssproperty --kemet-textarea-padding - The padding on the textarea.\n * @cssproperty --kemet-textarea-border - The border of the textarea.\n * @cssproperty --kemet-textarea-border-color-error - The border of the error state.\n * @cssproperty --kemet-textarea-border-color-success - The border of the success state.\n * @cssproperty --kemet-textarea-border-color-warning - The border of the warning state.\n * @cssproperty --kemet-textarea-border-radius-rounded - The border radius on rounded.\n * @cssproperty --kemet-textarea-border-filled - The border on filled.\n * @cssproperty --kemet-textarea-color-filled - The color on filled.\n * @cssproperty --kemet-textarea-background-color-filled - The background-color on filled.\n * @cssproperty --kemet-textarea-background-color-error - The error state background color.\n * @cssproperty --kemet-textarea-background-color-success - The success state background color.\n * @cssproperty --kemet-textarea-background-color-warning - The warning state background color.\n *\n */\n\n@customElement('kemet-textarea')\nexport default class KemetTextarea extends LitElement {\n formSubmitController: FormSubmitController;\n\n static styles = [stylesTextarea];\n\n @property({ type: String })\n slug: string = 'textarea';\n\n @property({ type: String })\n name: string = 'textarea';\n\n @property({ type: String })\n placeholder: string;\n\n @property({ type: Number })\n minlength: number;\n\n @property({ type: Number })\n maxlength: number;\n\n @property({ type: String })\n inputmode: string;\n\n @property({ type: Boolean })\n autofocus: boolean;\n\n @property({ type: Boolean, reflect: true })\n disabled: boolean;\n\n @property({ type: Boolean })\n readonly: boolean;\n\n @property({ type: Boolean, reflect: true })\n required: boolean;\n\n @property({ type: String })\n value: string = '';\n\n @property({ type: Boolean, reflect: true })\n invalid: boolean;\n\n @property({ type: String, reflect: true })\n status: TypeStatus = 'standard';\n\n @property({ type: Number })\n rows: number = 4;\n\n @property({ type: Boolean, attribute: 'validate-on-blur' })\n validateOnBlur: boolean;\n\n @property({ type: Boolean, reflect: true })\n filled: boolean;\n\n @property({ type: Boolean, reflect: true })\n rounded: boolean;\n\n @property({ type: Boolean })\n autocorrect: boolean;\n\n @state()\n form: HTMLFormElement;\n\n @state()\n control: KemetFieldInterface;\n\n @state()\n textarea: HTMLTextAreaElement;\n\n @state()\n hasFocus: boolean;\n\n @state()\n validity: ValidityState;\n\n constructor() {\n super();\n\n /** @internal */\n this.formSubmitController = new FormSubmitController(this);\n }\n\n firstUpdated() {\n // elements\n this.form = this.closest('form');\n this.control = this.closest('kemet-field');\n this.textarea = this.shadowRoot.querySelector('textarea');\n }\n\n render() {\n return html`\n <textarea\n part=\"textarea\"\n id=${this.slug}\n name=${this.name}\n .value=${live(this.value)}\n ?disabled=${this.disabled}\n ?readonly=${this.readonly}\n ?required=${this.required}\n placeholder=${ifDefined(this.placeholder)}\n rows=${ifDefined(this.rows)}\n minlength=${ifDefined(this.minlength)}\n maxlength=${ifDefined(this.maxlength)}\n autocorrect=${ifDefined(this.autocorrect)}\n ?autofocus=${this.autofocus}\n spellcheck=${ifDefined(this.spellcheck)}\n inputmode=${ifDefined(this.inputmode)}\n @change=${this.handleChange}\n @input=${this.handleInput}\n @focus=${this.handleFocus}\n @blur=${this.handleBlur}\n @invalid=${this.handleInvalid}\n ></textarea>\n `;\n }\n\n /**\n * Handles when the textarea receives focus\n * @private\n */\n handleFocus() {\n this.hasFocus = true;\n\n /**\n * Fires when the input receives and loses focus\n */\n this.dispatchEvent(\n new CustomEvent('kemet-input-focused', {\n bubbles: true,\n composed: true,\n detail: true,\n }),\n );\n }\n\n /**\n * Handles when the textarea loses focus\n * @private\n */\n handleBlur() {\n this.hasFocus = false;\n\n /**\n * Fires when the input receives and loses focus\n */\n this.dispatchEvent(\n new CustomEvent('kemet-input-focused', {\n bubbles: true,\n composed: true,\n detail: false,\n }),\n );\n\n if (this.validateOnBlur && this.form && !this.form.noValidate) {\n this.textarea.checkValidity();\n this.validity = this.textarea.validity;\n }\n }\n\n /**\n * Handles when the textarea changes value\n * @private\n */\n handleChange() {\n this.value = this.textarea.value;\n\n if (this.textarea.checkValidity() && this.checkLimitValidity()) {\n this.invalid = false;\n this.status = 'standard';\n this.validity = this.textarea.validity;\n\n /**\n * Fires when there's a change in status\n */\n this.dispatchEvent(\n new CustomEvent('kemet-input-status', {\n bubbles: true,\n composed: true,\n detail: {\n status: 'standard',\n validity: this.textarea.validity,\n element: this,\n },\n }),\n );\n }\n }\n\n /**\n * Handles when the textarea receives input\n * @private\n */\n handleInput() {\n this.value = this.textarea.value;\n\n /**\n * Fires when the input receives input\n */\n this.dispatchEvent(\n new CustomEvent('kemet-input-input', {\n bubbles: true,\n composed: true,\n detail: this.value,\n }),\n );\n }\n\n /**\n * Handles when the textarea has an error\n * @private\n */\n handleInvalid() {\n this.validity = this.textarea.validity;\n\n if (this.validateOnBlur) {\n this.invalid = true;\n this.status = 'error';\n\n /**\n * Fires when there's a change in status\n */\n this.dispatchEvent(\n new CustomEvent('kemet-input-status', {\n bubbles: true,\n composed: true,\n detail: {\n status: 'error',\n validity: this.textarea.validity,\n element: this,\n },\n }),\n );\n }\n }\n\n /**\n * Checks the validity of the character limit for the count component\n * @private\n * @returns {boolean}\n */\n checkLimitValidity(): boolean {\n if (this.control) {\n const count = this.control.querySelector('kemet-count');\n if (count) {\n return this.value.length < count.limit;\n }\n }\n\n return true;\n }\n\n /**\n * Checks the validity of the standard input\n * @public\n * @returns {boolean}\n */\n checkValidity(): boolean {\n return this.textarea.checkValidity();\n }\n\n /**\n * Focuses the standard input\n * @public\n */\n focus() {\n return this.textarea.focus();\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'kemet-textarea': KemetTextarea\n }\n}\n"]}
@@ -1 +0,0 @@
1
- export declare const stylesTextarea: import("lit").CSSResult;
@@ -1 +0,0 @@
1
- {"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/components/kemet-textarea/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiFhC,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const stylesTextarea = css`\n :host {\n --kemet-textarea-padding: 1rem;\n --kemet-textarea-border: 1px solid rgb(var(--kemet-color-foreground));\n --kemet-textarea-border-color-error: 1px solid rgb(var(--kemet-color-error));\n --kemet-textarea-border-color-success: 1px solid rgb(var(--kemet-color-success));\n --kemet-textarea-border-color-warning: 1px solid rgb(var(--kemet-color-warning));\n --kemet-textarea-icon-left-padding: 3rem;\n --kemet-textarea-icon-right-padding: 3rem;\n --kemet-textarea-border-radius-rounded: var(--kemet-border-radius-md);\n --kemet-textarea-border-filled: none;\n --kemet-textarea-color-filled: rgb(var(--kemet-color-white));\n --kemet-textarea-background-color-filled: rgb(var(--kemet-color-primary));\n --kemet-textarea-background-color-error: rgb(var(--kemet-color-error));\n --kemet-textarea-background-color-success: rgb(var(--kemet-color-success));\n --kemet-textarea-background-color-warning: rgb(var(--kemet-color-warning));\n\n position: relative;\n display: block;\n }\n\n textarea {\n color: rgb(var(--kemet-color-text));\n display: block;\n width: 100%;\n padding: var(--kemet-textarea-padding);\n border: var(--kemet-textarea-border);\n appearance: none;\n box-sizing: border-box;\n background: transparent;\n }\n\n :host([status='error']) textarea {\n border: var(--kemet-textarea-border-color-error);\n }\n\n :host([status='success']) textarea {\n border: var(--kemet-textarea-border-color-success);\n }\n\n :host([status='warning']) textarea {\n border: var(--kemet-textarea-border-color-warning);\n }\n\n :host([disabled]) textarea {\n opacity: 0.5;\n }\n\n :host([icon-left]) textarea {\n padding-left: var(--kemet-textarea-icon-left-padding);\n }\n\n :host([icon-right]) textarea {\n padding-right: var(--kemet-textarea-icon-right-padding);\n }\n\n :host([rounded]) textarea {\n border-radius: var(--kemet-textarea-border-radius-rounded);\n }\n\n :host([filled]) textarea {\n border: var(--kemet-textarea-border-filled);\n color: var(--kemet-textarea-color-filled);\n background-color: var(--kemet-textarea-background-color-filled);\n }\n\n :host([filled]) textarea::placeholder {\n color: var(--kemet-textarea-color-filled);\n }\n\n :host([status='error'][filled]) textarea {\n background-color: var(--kemet-textarea-background-color-error);\n }\n\n :host([status='success'][filled]) textarea {\n background-color: var(--kemet-textarea-background-color-success);\n }\n\n :host([status='warning'][filled]) textarea {\n background-color: var(--kemet-textarea-background-color-warning);\n }\n`;\n"]}
@@ -1,20 +0,0 @@
1
- export declare type TypeStatus = 'standard' | 'error' | 'success' | 'warning';
2
- export interface KemetTextareaInterface extends HTMLElement {
3
- slug?: string;
4
- name?: string;
5
- placeholder?: string;
6
- minlength?: number;
7
- maxlength?: number;
8
- inputmode?: string;
9
- disabled?: boolean;
10
- readonly?: boolean;
11
- required?: boolean;
12
- value?: string;
13
- invalid?: boolean;
14
- status?: TypeStatus;
15
- validateOnBlur?: boolean;
16
- rounded?: boolean;
17
- filled?: boolean;
18
- rows?: number;
19
- autocorrect?: boolean;
20
- }
@@ -1,2 +0,0 @@
1
- export {};
2
- //# sourceMappingURL=types.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/components/kemet-textarea/types.ts"],"names":[],"mappings":"","sourcesContent":["export type TypeStatus = 'standard' | 'error' | 'success' | 'warning';\n\nexport interface KemetTextareaInterface extends HTMLElement {\n slug?: string,\n name?: string,\n placeholder?: string,\n minlength?: number,\n maxlength?: number,\n inputmode?: string,\n disabled?: boolean,\n readonly?: boolean,\n required?: boolean,\n value?: string,\n invalid?: boolean,\n status?: TypeStatus,\n validateOnBlur?: boolean,\n rounded?: boolean,\n filled?: boolean,\n rows?: number,\n autocorrect?: boolean,\n}\n"]}
@@ -1,11 +0,0 @@
1
- import type { Meta, StoryObj } from '@storybook/web-components';
2
- import '../kemet-toggle';
3
- import '../../kemet-tabs/kemet-tabs';
4
- import '../../kemet-tabs/kemet-tab';
5
- import '../../kemet-tabs/kemet-tab-panel';
6
- declare const meta: Meta;
7
- export default meta;
8
- declare type Story = StoryObj;
9
- export declare const Standard: Story;
10
- export declare const Squared: Story;
11
- export declare const ShowOptions: Story;
@@ -1,43 +0,0 @@
1
- import { html } from 'lit';
2
- import { ifDefined } from 'lit/directives/if-defined.js';
3
- import '../kemet-toggle';
4
- import '../../kemet-tabs/kemet-tabs';
5
- import '../../kemet-tabs/kemet-tab';
6
- import '../../kemet-tabs/kemet-tab-panel';
7
- const meta = {
8
- title: 'Components / Toggle',
9
- component: 'kemet-toggle',
10
- args: {
11
- label: 'Label'
12
- }
13
- };
14
- export default meta;
15
- const Template = (args) => html `
16
- <kemet-toggle
17
- label=${ifDefined(args.label)}
18
- ?disabled=${args.disabled}
19
- ?checked=${args.checked}
20
- ?show=${args.show}
21
- ?squared=${args.squared}
22
- option-unchecked=${ifDefined(args.optionUnchecked)}
23
- option-checked=${ifDefined(args.optionChecked)}
24
- ></kemet-toggle>
25
- `;
26
- export const Standard = {
27
- render: args => Template(args),
28
- };
29
- export const Squared = {
30
- render: args => Template(args),
31
- args: {
32
- squared: true,
33
- },
34
- };
35
- export const ShowOptions = {
36
- render: args => Template(args),
37
- args: {
38
- show: true,
39
- optionUnchecked: 'No',
40
- optionChecked: 'Yes',
41
- },
42
- };
43
- //# sourceMappingURL=stories.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"stories.js","sourceRoot":"","sources":["../../../../src/components/kemet-toggle/docs/stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAC3B,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AAGzD,OAAO,iBAAiB,CAAC;AAEzB,OAAO,6BAA6B,CAAC;AACrC,OAAO,4BAA4B,CAAC;AACpC,OAAO,kCAAkC,CAAC;AAE1C,MAAM,IAAI,GAAS;IACjB,KAAK,EAAE,qBAAqB;IAC5B,SAAS,EAAE,cAAc;IACzB,IAAI,EAAE;QACJ,KAAK,EAAE,OAAO;KACf;CACF,CAAC;AACF,eAAe,IAAI,CAAC;AAIpB,MAAM,QAAQ,GAAG,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAA;;YAEnB,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC;gBACjB,IAAI,CAAC,QAAQ;eACd,IAAI,CAAC,OAAO;YACf,IAAI,CAAC,IAAI;eACN,IAAI,CAAC,OAAO;uBACJ,SAAS,CAAC,IAAI,CAAC,eAAe,CAAC;qBACjC,SAAS,CAAC,IAAI,CAAC,aAAa,CAAC;;CAEjD,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAU;IAC7B,MAAM,EAAE,IAAI,CAAC,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC;CAC/B,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAU;IAC5B,MAAM,EAAE,IAAI,CAAC,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC;IAC9B,IAAI,EAAE;QACJ,OAAO,EAAE,IAAI;KACd;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,WAAW,GAAU;IAChC,MAAM,EAAE,IAAI,CAAC,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC;IAC9B,IAAI,EAAE;QACJ,IAAI,EAAE,IAAI;QACV,eAAe,EAAE,IAAI;QACrB,aAAa,EAAE,KAAK;KACrB;CACF,CAAC","sourcesContent":["import { html } from 'lit';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport type { Meta, StoryObj } from '@storybook/web-components';\n\nimport '../kemet-toggle';\n\nimport '../../kemet-tabs/kemet-tabs';\nimport '../../kemet-tabs/kemet-tab';\nimport '../../kemet-tabs/kemet-tab-panel';\n\nconst meta: Meta = {\n title: 'Components / Toggle',\n component: 'kemet-toggle',\n args: {\n label: 'Label'\n }\n};\nexport default meta;\n\ntype Story = StoryObj;\n\nconst Template = (args) => html`\n <kemet-toggle\n label=${ifDefined(args.label)}\n ?disabled=${args.disabled}\n ?checked=${args.checked}\n ?show=${args.show}\n ?squared=${args.squared}\n option-unchecked=${ifDefined(args.optionUnchecked)}\n option-checked=${ifDefined(args.optionChecked)}\n ></kemet-toggle>\n`;\n\nexport const Standard: Story = {\n render: args => Template(args),\n};\n\nexport const Squared: Story = {\n render: args => Template(args),\n args: {\n squared: true,\n },\n};\n\nexport const ShowOptions: Story = {\n render: args => Template(args),\n args: {\n show: true,\n optionUnchecked: 'No',\n optionChecked: 'Yes',\n },\n};\n"]}