smoothly 1.2.1-alpha.20 → 1.2.1-alpha.22

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 (462) hide show
  1. package/dist/cjs/loader.cjs.js +1 -1
  2. package/dist/cjs/{smoothly-app_106.cjs.entry.js → smoothly-app_107.cjs.entry.js} +272 -240
  3. package/dist/cjs/smoothly-app_107.cjs.entry.js.map +1 -0
  4. package/dist/cjs/smoothly-input-checkbox-demo.cjs.entry.js +1 -1
  5. package/dist/cjs/smoothly-trigger-sink.cjs.entry.js +1 -1
  6. package/dist/cjs/smoothly-trigger-source.cjs.entry.js +1 -1
  7. package/dist/cjs/smoothly.cjs.js +1 -1
  8. package/dist/collection/collection-manifest.json +1 -0
  9. package/dist/collection/components/dialog/demo/index.js +23 -2
  10. package/dist/collection/components/dialog/demo/index.js.map +1 -1
  11. package/dist/collection/components/dialog/demo/style.css +5 -0
  12. package/dist/collection/components/display/demo/index.js +10 -10
  13. package/dist/collection/components/display/demo/json/index.js +1 -1
  14. package/dist/collection/components/display/index.js +3 -3
  15. package/dist/collection/components/display/json/index.js +1 -1
  16. package/dist/collection/components/display/json/object/index.js +2 -2
  17. package/dist/collection/components/display/json/object/key/index.js +1 -1
  18. package/dist/collection/components/display/json/primitive/index.js +1 -1
  19. package/dist/collection/components/filter/field/index.js +1 -1
  20. package/dist/collection/components/filter/index.js +3 -3
  21. package/dist/collection/components/filter/input/index.js +1 -1
  22. package/dist/collection/components/filter/select/index.js +1 -1
  23. package/dist/collection/components/filter/toggle/index.js +1 -1
  24. package/dist/collection/components/form/demo/all/index.js +2 -2
  25. package/dist/collection/components/form/demo/card/index.js +1 -1
  26. package/dist/collection/components/form/demo/controlled/index.js +1 -1
  27. package/dist/collection/components/form/demo/date/index.js +1 -1
  28. package/dist/collection/components/form/demo/date-range/index.js +1 -1
  29. package/dist/collection/components/form/demo/index.js +1 -1
  30. package/dist/collection/components/form/demo/login/index.js +1 -1
  31. package/dist/collection/components/form/demo/pet/index.js +2 -2
  32. package/dist/collection/components/form/demo/prices/index.js +1 -1
  33. package/dist/collection/components/form/demo/transparent/index.js +1 -1
  34. package/dist/collection/components/form/demo/typed/index.js +1 -1
  35. package/dist/collection/components/form/index.js +1 -1
  36. package/dist/collection/components/icon/demo/index.js +1 -1
  37. package/dist/collection/components/icon/index.js +1 -1
  38. package/dist/collection/components/input/checkbox/demo/index.js +1 -1
  39. package/dist/collection/components/input/checkbox/index.js +1 -1
  40. package/dist/collection/components/input/clear/index.js +1 -1
  41. package/dist/collection/components/input/color/demo/index.js +1 -1
  42. package/dist/collection/components/input/color/index.js +2 -2
  43. package/dist/collection/components/input/date/index.js +3 -3
  44. package/dist/collection/components/input/date/range/index.js +2 -2
  45. package/dist/collection/components/input/demo/index.js +5 -5
  46. package/dist/collection/components/input/demo/price/index.js +1 -1
  47. package/dist/collection/components/input/demo/standard/index.js +1 -1
  48. package/dist/collection/components/input/edit/index.js +1 -1
  49. package/dist/collection/components/input/file/index.js +1 -1
  50. package/dist/collection/components/input/index.js +2 -2
  51. package/dist/collection/components/input/month/index.js +2 -2
  52. package/dist/collection/components/input/radio/index.js +1 -1
  53. package/dist/collection/components/input/radio/item/index.js +1 -1
  54. package/dist/collection/components/input/range/demo/index.js +1 -1
  55. package/dist/collection/components/input/range/index.js +2 -2
  56. package/dist/collection/components/input/reset/index.js +1 -1
  57. package/dist/collection/components/input/select/index.js +3 -3
  58. package/dist/collection/components/input/select/style.css +3 -2
  59. package/dist/collection/components/input/submit/index.js +1 -1
  60. package/dist/collection/components/item/index.js +1 -1
  61. package/dist/collection/components/label/index.js +2 -2
  62. package/dist/collection/components/lazy/index.js +1 -1
  63. package/dist/collection/components/load-more/index.js +1 -1
  64. package/dist/collection/components/modal/index.js +116 -0
  65. package/dist/collection/components/modal/index.js.map +1 -0
  66. package/dist/collection/components/modal/style.css +60 -0
  67. package/dist/collection/components/next/demo/colspan/index.js +1 -1
  68. package/dist/collection/components/next/demo/filtered/index.js +5 -5
  69. package/dist/collection/components/next/demo/group/index.js +1 -1
  70. package/dist/collection/components/next/demo/index.js +1 -1
  71. package/dist/collection/components/next/demo/nested/index.js +1 -1
  72. package/dist/collection/components/next/demo/nested/inner/index.js +1 -1
  73. package/dist/collection/components/next/demo/simple/simple.js +1 -1
  74. package/dist/collection/components/next/table/body/index.js +1 -1
  75. package/dist/collection/components/next/table/cell/index.js +1 -1
  76. package/dist/collection/components/next/table/expandable/cell/index.js +1 -1
  77. package/dist/collection/components/next/table/expandable/row/index.js +1 -1
  78. package/dist/collection/components/next/table/foot/index.js +1 -1
  79. package/dist/collection/components/next/table/group/index.js +1 -1
  80. package/dist/collection/components/next/table/head/index.js +1 -1
  81. package/dist/collection/components/next/table/index.js +1 -1
  82. package/dist/collection/components/next/table/row/index.js +1 -1
  83. package/dist/collection/components/notification/index.js +1 -1
  84. package/dist/collection/components/notifier/index.js +2 -2
  85. package/dist/collection/components/spinner/index.js +2 -2
  86. package/dist/collection/components/submit/index.js +1 -1
  87. package/dist/collection/components/summary/index.js +1 -1
  88. package/dist/collection/components/table/cell/index.js +1 -1
  89. package/dist/collection/components/table/demo/filtered/index.js +5 -5
  90. package/dist/collection/components/table/demo/index.js +1 -1
  91. package/dist/collection/components/table/demo/testing/index.js +1 -1
  92. package/dist/collection/components/table/expandable/cell/index.js +1 -1
  93. package/dist/collection/components/table/expandable/row/index.js +1 -1
  94. package/dist/collection/components/table/footer/index.js +1 -1
  95. package/dist/collection/components/table/header/index.js +1 -1
  96. package/dist/collection/components/table/index.js +1 -1
  97. package/dist/collection/components/table/row/index.js +1 -1
  98. package/dist/collection/components/tabs/demo/index.js +1 -1
  99. package/dist/collection/components/tabs/index.js +1 -1
  100. package/dist/collection/components/tabs/tab/index.js +1 -1
  101. package/dist/collection/components/theme/color/index.js +1 -1
  102. package/dist/collection/components/theme/demo/index.js +1 -1
  103. package/dist/collection/components/theme/guide/index.js +8 -8
  104. package/dist/collection/components/theme/picker/index.js +2 -2
  105. package/dist/collection/components/toggle/index.js +1 -1
  106. package/dist/collection/components/toggle-switch/demo/index.js +1 -1
  107. package/dist/collection/components/toggle-switch/index.js +1 -1
  108. package/dist/collection/components/trigger/index.js +1 -1
  109. package/dist/collection/components/trigger/sink/index.js +1 -1
  110. package/dist/collection/components/trigger/source/index.js +1 -1
  111. package/dist/components/{p-d13c63d5.js → p-005e85db.js} +13 -13
  112. package/dist/components/{p-d13c63d5.js.map → p-005e85db.js.map} +1 -1
  113. package/dist/components/{p-960d8ba1.js → p-089f64c2.js} +3 -3
  114. package/dist/components/{p-960d8ba1.js.map → p-089f64c2.js.map} +1 -1
  115. package/dist/components/{p-3e87d17f.js → p-092b23d2.js} +8 -8
  116. package/dist/components/p-092b23d2.js.map +1 -0
  117. package/dist/components/{p-ff043e81.js → p-0a1466e3.js} +5 -5
  118. package/dist/components/{p-ff043e81.js.map → p-0a1466e3.js.map} +1 -1
  119. package/dist/components/{p-8bd61cb0.js → p-0bed7501.js} +15 -15
  120. package/dist/components/{p-8bd61cb0.js.map → p-0bed7501.js.map} +1 -1
  121. package/dist/components/{p-c49eb816.js → p-0ffdc60e.js} +2 -2
  122. package/dist/components/{p-c49eb816.js.map → p-0ffdc60e.js.map} +1 -1
  123. package/dist/components/{p-2a828c4b.js → p-137b3421.js} +11 -11
  124. package/dist/components/{p-2a828c4b.js.map → p-137b3421.js.map} +1 -1
  125. package/dist/components/{p-9652bc90.js → p-1826dd84.js} +2 -2
  126. package/dist/components/{p-9652bc90.js.map → p-1826dd84.js.map} +1 -1
  127. package/dist/components/{p-67fe8484.js → p-19512c94.js} +2 -2
  128. package/dist/components/{p-67fe8484.js.map → p-19512c94.js.map} +1 -1
  129. package/dist/components/{p-cb7811d5.js → p-2366143a.js} +2 -2
  130. package/dist/components/{p-cb7811d5.js.map → p-2366143a.js.map} +1 -1
  131. package/dist/components/{p-bd99d7e0.js → p-249f6b83.js} +2 -2
  132. package/dist/components/{p-bd99d7e0.js.map → p-249f6b83.js.map} +1 -1
  133. package/dist/components/{p-4ac558d7.js → p-264f51a5.js} +12 -12
  134. package/dist/components/{p-4ac558d7.js.map → p-264f51a5.js.map} +1 -1
  135. package/dist/components/{p-f8c96f10.js → p-26b64015.js} +7 -7
  136. package/dist/components/{p-f8c96f10.js.map → p-26b64015.js.map} +1 -1
  137. package/dist/components/{p-9661e3e2.js → p-277654d7.js} +2 -2
  138. package/dist/components/{p-9661e3e2.js.map → p-277654d7.js.map} +1 -1
  139. package/dist/components/{p-cecd67cb.js → p-283f43bb.js} +13 -13
  140. package/dist/components/{p-cecd67cb.js.map → p-283f43bb.js.map} +1 -1
  141. package/dist/components/{p-c52830ed.js → p-28e6aa24.js} +4 -4
  142. package/dist/components/{p-c52830ed.js.map → p-28e6aa24.js.map} +1 -1
  143. package/dist/components/{p-317d9357.js → p-292bffec.js} +4 -4
  144. package/dist/components/{p-317d9357.js.map → p-292bffec.js.map} +1 -1
  145. package/dist/components/{p-5733b8ef.js → p-29eacd31.js} +2 -2
  146. package/dist/components/{p-5733b8ef.js.map → p-29eacd31.js.map} +1 -1
  147. package/dist/components/{p-a1ec2a51.js → p-2efadf3c.js} +4 -4
  148. package/dist/components/{p-a1ec2a51.js.map → p-2efadf3c.js.map} +1 -1
  149. package/dist/components/{p-d4d6503f.js → p-2f1fce2c.js} +2 -2
  150. package/dist/components/{p-d4d6503f.js.map → p-2f1fce2c.js.map} +1 -1
  151. package/dist/components/{p-c5849868.js → p-2fb54a15.js} +8 -8
  152. package/dist/components/{p-c5849868.js.map → p-2fb54a15.js.map} +1 -1
  153. package/dist/components/p-31873e1c.js +241 -0
  154. package/dist/components/{p-ed0a94cc.js.map → p-31873e1c.js.map} +1 -1
  155. package/dist/components/{p-4f89fe0a.js → p-349fa13f.js} +2 -2
  156. package/dist/components/{p-4f89fe0a.js.map → p-349fa13f.js.map} +1 -1
  157. package/dist/components/{p-7c10f8c8.js → p-34b2eda8.js} +5 -5
  158. package/dist/components/{p-7c10f8c8.js.map → p-34b2eda8.js.map} +1 -1
  159. package/dist/components/{p-6b9d18a3.js → p-3851d6af.js} +4 -4
  160. package/dist/components/{p-6b9d18a3.js.map → p-3851d6af.js.map} +1 -1
  161. package/dist/components/{p-ea189b69.js → p-399bba68.js} +28 -28
  162. package/dist/components/{p-ea189b69.js.map → p-399bba68.js.map} +1 -1
  163. package/dist/components/{p-4e624488.js → p-43b0c35c.js} +7 -7
  164. package/dist/components/{p-4e624488.js.map → p-43b0c35c.js.map} +1 -1
  165. package/dist/components/{p-9580f153.js → p-4716165d.js} +3 -3
  166. package/dist/components/{p-9580f153.js.map → p-4716165d.js.map} +1 -1
  167. package/dist/components/{p-c3549f14.js → p-4833b43b.js} +2 -2
  168. package/dist/components/{p-c3549f14.js.map → p-4833b43b.js.map} +1 -1
  169. package/dist/components/{p-66556e0d.js → p-49a0a4cd.js} +2 -2
  170. package/dist/components/{p-66556e0d.js.map → p-49a0a4cd.js.map} +1 -1
  171. package/dist/components/{p-1964f713.js → p-49ecbdb4.js} +3 -3
  172. package/dist/components/{p-1964f713.js.map → p-49ecbdb4.js.map} +1 -1
  173. package/dist/components/{p-eeb1e790.js → p-4d285afc.js} +3 -3
  174. package/dist/components/{p-eeb1e790.js.map → p-4d285afc.js.map} +1 -1
  175. package/dist/components/{p-4433b27b.js → p-4d4b4a0a.js} +3 -3
  176. package/dist/components/{p-4433b27b.js.map → p-4d4b4a0a.js.map} +1 -1
  177. package/dist/components/{p-087c623a.js → p-50f303f3.js} +6 -6
  178. package/dist/components/{p-087c623a.js.map → p-50f303f3.js.map} +1 -1
  179. package/dist/components/{p-29cf2133.js → p-52b80bf5.js} +2 -2
  180. package/dist/components/{p-29cf2133.js.map → p-52b80bf5.js.map} +1 -1
  181. package/dist/components/{p-ef188cb4.js → p-531fa770.js} +2 -2
  182. package/dist/components/{p-ef188cb4.js.map → p-531fa770.js.map} +1 -1
  183. package/dist/components/{p-709e2536.js → p-5325f725.js} +11 -11
  184. package/dist/components/{p-709e2536.js.map → p-5325f725.js.map} +1 -1
  185. package/dist/components/{p-b98d0bad.js → p-58c24d57.js} +8 -8
  186. package/dist/components/{p-b98d0bad.js.map → p-58c24d57.js.map} +1 -1
  187. package/dist/components/{p-1772ae14.js → p-5a3098ce.js} +14 -14
  188. package/dist/components/{p-1772ae14.js.map → p-5a3098ce.js.map} +1 -1
  189. package/dist/components/{p-4ab9c3c8.js → p-5d3caa35.js} +14 -14
  190. package/dist/components/{p-4ab9c3c8.js.map → p-5d3caa35.js.map} +1 -1
  191. package/dist/components/{p-c781cbd7.js → p-5d416ccf.js} +13 -13
  192. package/dist/components/{p-c781cbd7.js.map → p-5d416ccf.js.map} +1 -1
  193. package/dist/components/{p-10abb216.js → p-5f80ec3c.js} +2 -2
  194. package/dist/components/{p-10abb216.js.map → p-5f80ec3c.js.map} +1 -1
  195. package/dist/components/{p-3089f404.js → p-62833e92.js} +15 -15
  196. package/dist/components/{p-3089f404.js.map → p-62833e92.js.map} +1 -1
  197. package/dist/components/{p-52ebcc8e.js → p-666dab06.js} +6 -6
  198. package/dist/components/{p-52ebcc8e.js.map → p-666dab06.js.map} +1 -1
  199. package/dist/components/p-6b2c0f3e.js +57 -0
  200. package/dist/components/p-6b2c0f3e.js.map +1 -0
  201. package/dist/components/{p-405ebb07.js → p-6eb46ce4.js} +42 -42
  202. package/dist/components/{p-405ebb07.js.map → p-6eb46ce4.js.map} +1 -1
  203. package/dist/components/p-6f488a68.js +123 -0
  204. package/dist/components/{p-5622b982.js.map → p-6f488a68.js.map} +1 -1
  205. package/dist/components/{p-fea68b4b.js → p-6f69fc7d.js} +2 -2
  206. package/dist/components/{p-fea68b4b.js.map → p-6f69fc7d.js.map} +1 -1
  207. package/dist/components/p-72730ae3.js +176 -0
  208. package/dist/components/{p-7b715e6a.js.map → p-72730ae3.js.map} +1 -1
  209. package/dist/components/{p-3fd0d9ce.js → p-730c6db2.js} +19 -19
  210. package/dist/components/{p-3fd0d9ce.js.map → p-730c6db2.js.map} +1 -1
  211. package/dist/components/p-750bac7d.js +74 -0
  212. package/dist/components/p-750bac7d.js.map +1 -0
  213. package/dist/components/{p-d8db6c83.js → p-76076037.js} +5 -5
  214. package/dist/components/{p-d8db6c83.js.map → p-76076037.js.map} +1 -1
  215. package/dist/components/{p-09f58121.js → p-7ad3376d.js} +6 -6
  216. package/dist/components/{p-09f58121.js.map → p-7ad3376d.js.map} +1 -1
  217. package/dist/components/{p-7654073e.js → p-8362e6ea.js} +4 -4
  218. package/dist/components/{p-7654073e.js.map → p-8362e6ea.js.map} +1 -1
  219. package/dist/components/{p-9c14be4b.js → p-88442020.js} +2 -2
  220. package/dist/components/{p-9c14be4b.js.map → p-88442020.js.map} +1 -1
  221. package/dist/components/{p-cb0be10a.js → p-8ad720fa.js} +3 -3
  222. package/dist/components/{p-cb0be10a.js.map → p-8ad720fa.js.map} +1 -1
  223. package/dist/components/{p-6c77cd6c.js → p-8da9fa74.js} +3 -3
  224. package/dist/components/{p-6c77cd6c.js.map → p-8da9fa74.js.map} +1 -1
  225. package/dist/components/{p-7616ad6b.js → p-8edc879e.js} +35 -35
  226. package/dist/components/{p-7616ad6b.js.map → p-8edc879e.js.map} +1 -1
  227. package/dist/components/{p-04a71815.js → p-918ddb21.js} +11 -11
  228. package/dist/components/{p-04a71815.js.map → p-918ddb21.js.map} +1 -1
  229. package/dist/components/{p-9ba73174.js → p-938c06a2.js} +5 -5
  230. package/dist/components/{p-9ba73174.js.map → p-938c06a2.js.map} +1 -1
  231. package/dist/components/{p-0b5ca4eb.js → p-953eb5d8.js} +2 -2
  232. package/dist/components/{p-0b5ca4eb.js.map → p-953eb5d8.js.map} +1 -1
  233. package/dist/components/{p-a7d9cabf.js → p-96e2307f.js} +28 -28
  234. package/dist/components/{p-a7d9cabf.js.map → p-96e2307f.js.map} +1 -1
  235. package/dist/components/p-97848f3d.js +175 -0
  236. package/dist/components/{p-ea7dba25.js.map → p-97848f3d.js.map} +1 -1
  237. package/dist/components/{p-c9b98b2c.js → p-98425f42.js} +2 -2
  238. package/dist/components/{p-c9b98b2c.js.map → p-98425f42.js.map} +1 -1
  239. package/dist/components/{p-608a35ca.js → p-a08bf822.js} +3 -3
  240. package/dist/components/{p-608a35ca.js.map → p-a08bf822.js.map} +1 -1
  241. package/dist/components/{p-1bf5dad5.js → p-a74bdd1f.js} +3 -3
  242. package/dist/components/{p-1bf5dad5.js.map → p-a74bdd1f.js.map} +1 -1
  243. package/dist/components/{p-31ca8d3f.js → p-aa3e9c0f.js} +4 -4
  244. package/dist/components/{p-31ca8d3f.js.map → p-aa3e9c0f.js.map} +1 -1
  245. package/dist/components/{p-0608a32b.js → p-ac285959.js} +30 -30
  246. package/dist/components/{p-0608a32b.js.map → p-ac285959.js.map} +1 -1
  247. package/dist/components/{p-722f48c0.js → p-acdb7891.js} +7 -7
  248. package/dist/components/{p-722f48c0.js.map → p-acdb7891.js.map} +1 -1
  249. package/dist/components/{p-7478f877.js → p-ad504cb6.js} +2 -2
  250. package/dist/components/{p-7478f877.js.map → p-ad504cb6.js.map} +1 -1
  251. package/dist/components/p-b5b689d9.js +45 -0
  252. package/dist/components/{p-3b329054.js.map → p-b5b689d9.js.map} +1 -1
  253. package/dist/components/{p-f4ad0c7e.js → p-bc36484d.js} +2 -2
  254. package/dist/components/{p-f4ad0c7e.js.map → p-bc36484d.js.map} +1 -1
  255. package/dist/components/{p-38829eed.js → p-c0063da9.js} +2 -2
  256. package/dist/components/{p-38829eed.js.map → p-c0063da9.js.map} +1 -1
  257. package/dist/components/{p-73e9879a.js → p-c025f250.js} +9 -9
  258. package/dist/components/{p-73e9879a.js.map → p-c025f250.js.map} +1 -1
  259. package/dist/components/{p-be596a9e.js → p-c5519ec1.js} +3 -3
  260. package/dist/components/{p-be596a9e.js.map → p-c5519ec1.js.map} +1 -1
  261. package/dist/components/{p-8a34ee77.js → p-c5beaa82.js} +15 -15
  262. package/dist/components/{p-8a34ee77.js.map → p-c5beaa82.js.map} +1 -1
  263. package/dist/components/{p-7443f196.js → p-c7c1ceaa.js} +6 -6
  264. package/dist/components/{p-7443f196.js.map → p-c7c1ceaa.js.map} +1 -1
  265. package/dist/components/{p-56fd5598.js → p-cdd3d9d4.js} +2 -2
  266. package/dist/components/{p-56fd5598.js.map → p-cdd3d9d4.js.map} +1 -1
  267. package/dist/components/{p-ca004e42.js → p-ce03e4d0.js} +3 -3
  268. package/dist/components/{p-ca004e42.js.map → p-ce03e4d0.js.map} +1 -1
  269. package/dist/components/{p-8da7e7cf.js → p-cfe2cdab.js} +15 -15
  270. package/dist/components/{p-8da7e7cf.js.map → p-cfe2cdab.js.map} +1 -1
  271. package/dist/components/{p-0e71696f.js → p-d062ac7b.js} +4 -4
  272. package/dist/components/{p-0e71696f.js.map → p-d062ac7b.js.map} +1 -1
  273. package/dist/components/{p-184d9baa.js → p-d3edfccf.js} +9 -9
  274. package/dist/components/{p-184d9baa.js.map → p-d3edfccf.js.map} +1 -1
  275. package/dist/components/{p-1fe5f6ae.js → p-d7ba5dde.js} +7 -7
  276. package/dist/components/{p-1fe5f6ae.js.map → p-d7ba5dde.js.map} +1 -1
  277. package/dist/components/p-d9b2d6c1.js +207 -0
  278. package/dist/components/{p-61541fc1.js.map → p-d9b2d6c1.js.map} +1 -1
  279. package/dist/components/{p-53681ab6.js → p-d9b4a9de.js} +2 -2
  280. package/dist/components/{p-53681ab6.js.map → p-d9b4a9de.js.map} +1 -1
  281. package/dist/components/{p-e55d0b9e.js → p-db9b16c7.js} +2 -2
  282. package/dist/components/{p-e55d0b9e.js.map → p-db9b16c7.js.map} +1 -1
  283. package/dist/components/{p-1e225024.js → p-dfc5f0b7.js} +2 -2
  284. package/dist/components/{p-1e225024.js.map → p-dfc5f0b7.js.map} +1 -1
  285. package/dist/components/{p-4d3676e0.js → p-dffea279.js} +13 -13
  286. package/dist/components/{p-4d3676e0.js.map → p-dffea279.js.map} +1 -1
  287. package/dist/components/{p-7b6e9ca3.js → p-e32f8664.js} +3 -3
  288. package/dist/components/{p-7b6e9ca3.js.map → p-e32f8664.js.map} +1 -1
  289. package/dist/components/{p-17194438.js → p-e451a0b5.js} +2 -2
  290. package/dist/components/{p-17194438.js.map → p-e451a0b5.js.map} +1 -1
  291. package/dist/components/{p-a8ec972e.js → p-e572ff39.js} +4 -4
  292. package/dist/components/{p-a8ec972e.js.map → p-e572ff39.js.map} +1 -1
  293. package/dist/components/{p-155b35db.js → p-e5ac7847.js} +15 -15
  294. package/dist/components/{p-155b35db.js.map → p-e5ac7847.js.map} +1 -1
  295. package/dist/components/{p-f0e6efc9.js → p-eb3d2060.js} +8 -8
  296. package/dist/components/{p-f0e6efc9.js.map → p-eb3d2060.js.map} +1 -1
  297. package/dist/components/{p-a78942e6.js → p-eccb82fa.js} +4 -4
  298. package/dist/components/{p-a78942e6.js.map → p-eccb82fa.js.map} +1 -1
  299. package/dist/components/{p-5276d246.js → p-ee3b0a3b.js} +2 -2
  300. package/dist/components/{p-5276d246.js.map → p-ee3b0a3b.js.map} +1 -1
  301. package/dist/components/{p-4c3b2014.js → p-f40a3efd.js} +3 -3
  302. package/dist/components/{p-4c3b2014.js.map → p-f40a3efd.js.map} +1 -1
  303. package/dist/components/{p-631842aa.js → p-f7691a04.js} +5 -5
  304. package/dist/components/{p-631842aa.js.map → p-f7691a04.js.map} +1 -1
  305. package/dist/components/{p-8c1999fd.js → p-f8b21fed.js} +14 -14
  306. package/dist/components/{p-8c1999fd.js.map → p-f8b21fed.js.map} +1 -1
  307. package/dist/components/{p-8a02ff30.js → p-f8b6cc8e.js} +2 -2
  308. package/dist/components/{p-8a02ff30.js.map → p-f8b6cc8e.js.map} +1 -1
  309. package/dist/components/{p-532aa5fd.js → p-fa39a723.js} +3 -3
  310. package/dist/components/{p-532aa5fd.js.map → p-fa39a723.js.map} +1 -1
  311. package/dist/components/{p-24f14b31.js → p-fbd4a12b.js} +10 -10
  312. package/dist/components/{p-24f14b31.js.map → p-fbd4a12b.js.map} +1 -1
  313. package/dist/components/{p-7f090deb.js → p-fc98f7be.js} +4 -4
  314. package/dist/components/{p-7f090deb.js.map → p-fc98f7be.js.map} +1 -1
  315. package/dist/components/{p-c1619101.js → p-fccef2cd.js} +25 -25
  316. package/dist/components/{p-c1619101.js.map → p-fccef2cd.js.map} +1 -1
  317. package/dist/components/smoothly-app-demo.js +171 -165
  318. package/dist/components/smoothly-app-demo.js.map +1 -1
  319. package/dist/components/smoothly-app-room.js +1 -1
  320. package/dist/components/smoothly-app.js +1 -1
  321. package/dist/components/smoothly-back-to-top.js +1 -1
  322. package/dist/components/smoothly-burger.js +1 -1
  323. package/dist/components/smoothly-button-confirm.js +1 -1
  324. package/dist/components/smoothly-button-demo.js +1 -1
  325. package/dist/components/smoothly-calendar.js +1 -1
  326. package/dist/components/smoothly-checkbox.js +1 -1
  327. package/dist/components/smoothly-dialog-demo.js +1 -1
  328. package/dist/components/smoothly-dialog.js +1 -1
  329. package/dist/components/smoothly-display-demo-json.js +1 -1
  330. package/dist/components/smoothly-display-demo.js +1 -1
  331. package/dist/components/smoothly-display-json-object.js +1 -1
  332. package/dist/components/smoothly-display-json-primitive.js +1 -1
  333. package/dist/components/smoothly-display-json-record-key.js +1 -1
  334. package/dist/components/smoothly-display-json.js +1 -1
  335. package/dist/components/smoothly-display.js +1 -1
  336. package/dist/components/smoothly-filter-field.js +1 -1
  337. package/dist/components/smoothly-filter-input.js +1 -1
  338. package/dist/components/smoothly-filter-select.js +1 -1
  339. package/dist/components/smoothly-filter-toggle.js +1 -1
  340. package/dist/components/smoothly-filter.js +1 -1
  341. package/dist/components/smoothly-form-demo-all.js +1 -1
  342. package/dist/components/smoothly-form-demo-card.js +1 -1
  343. package/dist/components/smoothly-form-demo-controlled.js +1 -1
  344. package/dist/components/smoothly-form-demo-date-range.js +1 -1
  345. package/dist/components/smoothly-form-demo-date.js +1 -1
  346. package/dist/components/smoothly-form-demo-login.js +1 -1
  347. package/dist/components/smoothly-form-demo-pet.js +1 -1
  348. package/dist/components/smoothly-form-demo-prices.js +1 -1
  349. package/dist/components/smoothly-form-demo-transparent.js +1 -1
  350. package/dist/components/smoothly-form-demo-typed.js +1 -1
  351. package/dist/components/smoothly-form-demo.js +1 -1
  352. package/dist/components/smoothly-form.js +1 -1
  353. package/dist/components/smoothly-icon-demo.js +1 -1
  354. package/dist/components/smoothly-icon.js +1 -1
  355. package/dist/components/smoothly-input-checkbox-demo.js +28 -28
  356. package/dist/components/smoothly-input-checkbox.js +1 -1
  357. package/dist/components/smoothly-input-clear.js +1 -1
  358. package/dist/components/smoothly-input-color-demo.js +1 -1
  359. package/dist/components/smoothly-input-color.js +1 -1
  360. package/dist/components/smoothly-input-date-range.js +1 -1
  361. package/dist/components/smoothly-input-date.js +1 -1
  362. package/dist/components/smoothly-input-demo-standard.js +1 -1
  363. package/dist/components/smoothly-input-demo.js +1 -1
  364. package/dist/components/smoothly-input-edit.js +1 -1
  365. package/dist/components/smoothly-input-file.js +1 -1
  366. package/dist/components/smoothly-input-month.js +1 -1
  367. package/dist/components/smoothly-input-price-demo.js +1 -1
  368. package/dist/components/smoothly-input-radio-item.js +1 -1
  369. package/dist/components/smoothly-input-radio.js +1 -1
  370. package/dist/components/smoothly-input-range-demo.js +1 -1
  371. package/dist/components/smoothly-input-range.js +1 -1
  372. package/dist/components/smoothly-input-reset.js +1 -1
  373. package/dist/components/smoothly-input-select.js +1 -1
  374. package/dist/components/smoothly-input-submit.js +1 -1
  375. package/dist/components/smoothly-input.js +1 -1
  376. package/dist/components/smoothly-item.js +1 -1
  377. package/dist/components/smoothly-label.js +1 -1
  378. package/dist/components/smoothly-lazy.js +1 -1
  379. package/dist/components/smoothly-load-more.js +1 -1
  380. package/dist/components/smoothly-modal.d.ts +11 -0
  381. package/dist/components/smoothly-modal.js +8 -0
  382. package/dist/components/smoothly-modal.js.map +1 -0
  383. package/dist/components/smoothly-next-demo-colspan.js +1 -1
  384. package/dist/components/smoothly-next-demo-group.js +1 -1
  385. package/dist/components/smoothly-next-demo-nested-inner.js +1 -1
  386. package/dist/components/smoothly-next-demo-nested.js +1 -1
  387. package/dist/components/smoothly-next-demo-simple.js +1 -1
  388. package/dist/components/smoothly-next-demo.js +1 -1
  389. package/dist/components/smoothly-next-table-body.js +1 -1
  390. package/dist/components/smoothly-next-table-cell.js +1 -1
  391. package/dist/components/smoothly-next-table-demo-filtered.js +1 -1
  392. package/dist/components/smoothly-next-table-expandable-cell.js +1 -1
  393. package/dist/components/smoothly-next-table-expandable-row.js +1 -1
  394. package/dist/components/smoothly-next-table-foot.js +1 -1
  395. package/dist/components/smoothly-next-table-head.js +1 -1
  396. package/dist/components/smoothly-next-table-row-group.js +1 -1
  397. package/dist/components/smoothly-next-table-row.js +1 -1
  398. package/dist/components/smoothly-next-table.js +1 -1
  399. package/dist/components/smoothly-notification.js +1 -1
  400. package/dist/components/smoothly-notifier.js +1 -1
  401. package/dist/components/smoothly-spinner.js +1 -1
  402. package/dist/components/smoothly-submit.js +1 -1
  403. package/dist/components/smoothly-summary.js +1 -1
  404. package/dist/components/smoothly-tab.js +1 -1
  405. package/dist/components/smoothly-table-cell.js +1 -1
  406. package/dist/components/smoothly-table-demo-filtered.js +1 -1
  407. package/dist/components/smoothly-table-demo.js +1 -1
  408. package/dist/components/smoothly-table-expandable-cell.js +1 -1
  409. package/dist/components/smoothly-table-expandable-row.js +1 -1
  410. package/dist/components/smoothly-table-footer.js +1 -1
  411. package/dist/components/smoothly-table-header.js +1 -1
  412. package/dist/components/smoothly-table-row.js +1 -1
  413. package/dist/components/smoothly-table-testing.js +1 -1
  414. package/dist/components/smoothly-table.js +1 -1
  415. package/dist/components/smoothly-tabs-demo.js +1 -1
  416. package/dist/components/smoothly-tabs.js +1 -1
  417. package/dist/components/smoothly-theme-color.js +1 -1
  418. package/dist/components/smoothly-theme-colors.js +1 -1
  419. package/dist/components/smoothly-theme-demo.js +1 -1
  420. package/dist/components/smoothly-theme-guide.js +1 -1
  421. package/dist/components/smoothly-theme-picker.js +1 -1
  422. package/dist/components/smoothly-toggle-switch-demo.js +1 -1
  423. package/dist/components/smoothly-toggle-switch.js +1 -1
  424. package/dist/components/smoothly-toggle.js +1 -1
  425. package/dist/components/smoothly-trigger-sink.js +1 -1
  426. package/dist/components/smoothly-trigger-source.js +1 -1
  427. package/dist/components/smoothly-trigger.js +1 -1
  428. package/dist/esm/loader.js +1 -1
  429. package/dist/esm/{smoothly-app_106.entry.js → smoothly-app_107.entry.js} +272 -241
  430. package/dist/esm/smoothly-app_107.entry.js.map +1 -0
  431. package/dist/esm/smoothly-input-checkbox-demo.entry.js +1 -1
  432. package/dist/esm/smoothly-trigger-sink.entry.js +1 -1
  433. package/dist/esm/smoothly-trigger-source.entry.js +1 -1
  434. package/dist/esm/smoothly.js +1 -1
  435. package/dist/smoothly/p-32d55e4c.entry.js +2 -0
  436. package/dist/smoothly/p-32d55e4c.entry.js.map +1 -0
  437. package/dist/smoothly/{p-aa596b7e.entry.js → p-5ff5fc57.entry.js} +2 -2
  438. package/dist/smoothly/p-83ce9999.entry.js +2 -0
  439. package/dist/smoothly/{p-f0d68499.entry.js → p-9bfe8aba.entry.js} +2 -2
  440. package/dist/smoothly/smoothly.esm.js +1 -1
  441. package/dist/smoothly/smoothly.esm.js.map +1 -1
  442. package/dist/types/components/dialog/demo/index.d.ts +2 -0
  443. package/dist/types/components/modal/index.d.ts +10 -0
  444. package/dist/types/components.d.ts +35 -0
  445. package/package.json +1 -1
  446. package/dist/cjs/smoothly-app_106.cjs.entry.js.map +0 -1
  447. package/dist/components/p-3b329054.js +0 -45
  448. package/dist/components/p-3e87d17f.js.map +0 -1
  449. package/dist/components/p-5622b982.js +0 -123
  450. package/dist/components/p-61541fc1.js +0 -207
  451. package/dist/components/p-7b715e6a.js +0 -176
  452. package/dist/components/p-987d969a.js +0 -53
  453. package/dist/components/p-987d969a.js.map +0 -1
  454. package/dist/components/p-ea7dba25.js +0 -175
  455. package/dist/components/p-ed0a94cc.js +0 -241
  456. package/dist/esm/smoothly-app_106.entry.js.map +0 -1
  457. package/dist/smoothly/p-23b77134.entry.js +0 -2
  458. package/dist/smoothly/p-23b77134.entry.js.map +0 -1
  459. package/dist/smoothly/p-3e49ca8d.entry.js +0 -2
  460. /package/dist/smoothly/{p-aa596b7e.entry.js.map → p-5ff5fc57.entry.js.map} +0 -0
  461. /package/dist/smoothly/{p-3e49ca8d.entry.js.map → p-83ce9999.entry.js.map} +0 -0
  462. /package/dist/smoothly/{p-f0d68499.entry.js.map → p-9bfe8aba.entry.js.map} +0 -0
@@ -24,8 +24,8 @@ function getLocale() {
24
24
  return TimeZone.Locale.is(result) ? result : TimeZone.Language.is(result) ? TimeZone.Locale.toLocale(result) : undefined;
25
25
  }
26
26
 
27
- const styleCss$1s = "smoothly-app{--header-height:5rem;display:block}smoothly-app>smoothly-notifier>main{height:calc(100dvh - var(--header-height))}smoothly-app[hidden]{display:none}smoothly-app>smoothly-notifier{height:100%;background:none}header:has(smoothly-burger[visible])>nav>ul smoothly-app-room{width:100%;height:4em}smoothly-app>smoothly-notifier>header{position:sticky;top:0;z-index:5;width:100%;height:var(--header-height);display:flex;justify-content:space-between;box-sizing:border-box;align-items:center;box-shadow:0 1px 0 0 rgb(var(--smoothly-color-shade))}smoothly-app>smoothly-notifier>header>nav{width:100%;flex-shrink:2;height:100%}smoothly-app>smoothly-notifier>header>nav,smoothly-app>smoothly-notifier>header>nav>ul{display:flex;margin:0}smoothly-app:not([label])>smoothly-notifier>header>h1{display:none}smoothly-app>smoothly-notifier>header>h1{margin-left:1rem;margin-bottom:0.8em;display:flex;height:100%}smoothly-app>smoothly-notifier>header>h1>a{display:inline-block;align-self:center;size:100%;background-position-y:center;text-decoration:none;white-space:nowrap}smoothly-app>smoothly-notifier>header>nav>ul{width:100%}smoothly-app>smoothly-notifier>header>nav>ul>div.nav-start-container{display:flex;align-items:center;height:100%}smoothly-app>smoothly-notifier>header>nav>ul>div.nav-end-container{display:flex;align-items:center;height:100%;margin-left:auto;margin-right:1rem}smoothly-app>smoothly-notifier>header>nav>ul>[slot=\"nav-end\"]{width:fit-content;align-self:center;height:fit-content;margin-left:10rem}smoothly-app>smoothly-notifier>header>nav>ul li a{display:flex;height:2.3rem;text-decoration:none;align-items:center;align-self:center}@media screen and (max-width: 900px){smoothly-app>smoothly-notifier>header>nav{width:fit-content;max-width:100%;top:100%;position:absolute;max-height:calc(100dvh - var(--header-height));overflow-y:scroll;right:0;height:auto}smoothly-app>smoothly-notifier>header>nav,smoothly-app>smoothly-notifier>header>nav>ul{flex-direction:column;background-color:rgba(var(--smoothly-color))}smoothly-app>smoothly-notifier>header>nav>ul{padding:1.5rem;box-sizing:border-box}smoothly-app>smoothly-notifier>header>nav>ul li{margin-right:0;width:100%}smoothly-app>smoothly-notifier>header>smoothly-burger{position:absolute;top:0;right:0}smoothly-app>smoothly-notifier>header>nav>ul>[slot=\"nav-start\"]{display:none}smoothly-app>smoothly-notifier>header>nav>ul>div.nav-start-container,smoothly-app>smoothly-notifier>header>nav>ul>div.nav-end-container{flex-direction:column;margin:0;align-items:start;justify-content:center}smoothly-app>smoothly-notifier>header>nav>ul>div.nav-start-container>*:last-child{margin-bottom:1em}}smoothly-app>smoothly-notifier>header>nav:not(.menu-open){display:none}smoothly-app>smoothly-notifier>main>div{overflow-y:scroll;height:100%}";
28
- const SmoothlyAppStyle0 = styleCss$1s;
27
+ const styleCss$1u = "smoothly-app{--header-height:5rem;display:block}smoothly-app>smoothly-notifier>main{height:calc(100dvh - var(--header-height))}smoothly-app[hidden]{display:none}smoothly-app>smoothly-notifier{height:100%;background:none}header:has(smoothly-burger[visible])>nav>ul smoothly-app-room{width:100%;height:4em}smoothly-app>smoothly-notifier>header{position:sticky;top:0;z-index:5;width:100%;height:var(--header-height);display:flex;justify-content:space-between;box-sizing:border-box;align-items:center;box-shadow:0 1px 0 0 rgb(var(--smoothly-color-shade))}smoothly-app>smoothly-notifier>header>nav{width:100%;flex-shrink:2;height:100%}smoothly-app>smoothly-notifier>header>nav,smoothly-app>smoothly-notifier>header>nav>ul{display:flex;margin:0}smoothly-app:not([label])>smoothly-notifier>header>h1{display:none}smoothly-app>smoothly-notifier>header>h1{margin-left:1rem;margin-bottom:0.8em;display:flex;height:100%}smoothly-app>smoothly-notifier>header>h1>a{display:inline-block;align-self:center;size:100%;background-position-y:center;text-decoration:none;white-space:nowrap}smoothly-app>smoothly-notifier>header>nav>ul{width:100%}smoothly-app>smoothly-notifier>header>nav>ul>div.nav-start-container{display:flex;align-items:center;height:100%}smoothly-app>smoothly-notifier>header>nav>ul>div.nav-end-container{display:flex;align-items:center;height:100%;margin-left:auto;margin-right:1rem}smoothly-app>smoothly-notifier>header>nav>ul>[slot=\"nav-end\"]{width:fit-content;align-self:center;height:fit-content;margin-left:10rem}smoothly-app>smoothly-notifier>header>nav>ul li a{display:flex;height:2.3rem;text-decoration:none;align-items:center;align-self:center}@media screen and (max-width: 900px){smoothly-app>smoothly-notifier>header>nav{width:fit-content;max-width:100%;top:100%;position:absolute;max-height:calc(100dvh - var(--header-height));overflow-y:scroll;right:0;height:auto}smoothly-app>smoothly-notifier>header>nav,smoothly-app>smoothly-notifier>header>nav>ul{flex-direction:column;background-color:rgba(var(--smoothly-color))}smoothly-app>smoothly-notifier>header>nav>ul{padding:1.5rem;box-sizing:border-box}smoothly-app>smoothly-notifier>header>nav>ul li{margin-right:0;width:100%}smoothly-app>smoothly-notifier>header>smoothly-burger{position:absolute;top:0;right:0}smoothly-app>smoothly-notifier>header>nav>ul>[slot=\"nav-start\"]{display:none}smoothly-app>smoothly-notifier>header>nav>ul>div.nav-start-container,smoothly-app>smoothly-notifier>header>nav>ul>div.nav-end-container{flex-direction:column;margin:0;align-items:start;justify-content:center}smoothly-app>smoothly-notifier>header>nav>ul>div.nav-start-container>*:last-child{margin-bottom:1em}}smoothly-app>smoothly-notifier>header>nav:not(.menu-open){display:none}smoothly-app>smoothly-notifier>main>div{overflow-y:scroll;height:100%}";
28
+ const SmoothlyAppStyle0 = styleCss$1u;
29
29
 
30
30
  const SmoothlyApp = class {
31
31
  constructor(hostRef) {
@@ -1529,8 +1529,8 @@ if (!globalThis.URLPattern) {
1529
1529
  globalThis.URLPattern = URLPattern$1;
1530
1530
  }
1531
1531
 
1532
- const styleCss$1r = ".sc-smoothly-app-room-h{display:flex;justify-content:center;text-align:center;cursor:pointer;height:100%;position:relative}.sc-smoothly-app-room-h>div.sc-smoothly-app-room{overflow-y:auto;height:100%}:not([label].sc-smoothly-app-room-h,[icon]).sc-smoothly-app-room-h,[disabled].sc-smoothly-app-room-h{display:none}.sc-smoothly-app-room-h>div.sc-smoothly-app-room{display:none}.sc-smoothly-app-room-h>li.sc-smoothly-app-room{height:100%;list-style:none}.sc-smoothly-app-room-h>li.sc-smoothly-app-room>a.sc-smoothly-app-room{padding:0 1.5em;height:100%}[selected].sc-smoothly-app-room-h>li.sc-smoothly-app-room>a.sc-smoothly-app-room{display:flex;color:rgb(var(--smoothly-color-contrast));background:rgb(var(--smoothly-color-shade))}.sc-smoothly-app-room-h:hover>li.sc-smoothly-app-room>a.sc-smoothly-app-room{color:rgb(var(--smoothly-color-contrast));background-color:rgb(var(--smoothly-color-tint));transition:0.2s}.sc-smoothly-app-room-h>li.sc-smoothly-app-room>a.sc-smoothly-app-room>smoothly-icon.sc-smoothly-app-room{align-self:inherit}[icon].sc-smoothly-app-room-h>li.sc-smoothly-app-room>a.sc-smoothly-app-room>.label.sc-smoothly-app-room{display:none}[icon][label].sc-smoothly-app-room-h:hover::before,[icon][label].sc-smoothly-app-room-h:hover::after{position:absolute;color:rgb(var(--smoothly-color-contrast));background-color:rgb(var(--smoothly-color-tint));border-radius:0.25rem;pointer-events:none}[icon][label].sc-smoothly-app-room-h:hover::before{content:\"\";bottom:-1.75rem;transform:rotate(45deg);width:1.25em;height:1.25em}[icon][label].sc-smoothly-app-room-h:hover::after{content:attr(label);white-space:nowrap;bottom:-3.25rem;padding:.5rem 1rem;border-radius:.25rem}@media screen and (max-width: 900px){.sc-smoothly-app-room-h>li.sc-smoothly-app-room>a.sc-smoothly-app-room{padding:0}[icon].sc-smoothly-app-room-h>li.sc-smoothly-app-room>a.sc-smoothly-app-room>.label.sc-smoothly-app-room{display:unset;padding:0 1rem}.sc-smoothly-app-room-h>li.sc-smoothly-app-room>a.sc-smoothly-app-room{margin-left:-1.5rem;margin-right:-1.5rem;padding-left:1.5rem;padding-right:1.5rem}[icon][label].sc-smoothly-app-room-h:hover::before,[icon][label].sc-smoothly-app-room-h:hover::after{content:unset}}";
1533
- const SmoothlyAppRoomStyle0 = styleCss$1r;
1532
+ const styleCss$1t = ".sc-smoothly-app-room-h{display:flex;justify-content:center;text-align:center;cursor:pointer;height:100%;position:relative}.sc-smoothly-app-room-h>div.sc-smoothly-app-room{overflow-y:auto;height:100%}:not([label].sc-smoothly-app-room-h,[icon]).sc-smoothly-app-room-h,[disabled].sc-smoothly-app-room-h{display:none}.sc-smoothly-app-room-h>div.sc-smoothly-app-room{display:none}.sc-smoothly-app-room-h>li.sc-smoothly-app-room{height:100%;list-style:none}.sc-smoothly-app-room-h>li.sc-smoothly-app-room>a.sc-smoothly-app-room{padding:0 1.5em;height:100%}[selected].sc-smoothly-app-room-h>li.sc-smoothly-app-room>a.sc-smoothly-app-room{display:flex;color:rgb(var(--smoothly-color-contrast));background:rgb(var(--smoothly-color-shade))}.sc-smoothly-app-room-h:hover>li.sc-smoothly-app-room>a.sc-smoothly-app-room{color:rgb(var(--smoothly-color-contrast));background-color:rgb(var(--smoothly-color-tint));transition:0.2s}.sc-smoothly-app-room-h>li.sc-smoothly-app-room>a.sc-smoothly-app-room>smoothly-icon.sc-smoothly-app-room{align-self:inherit}[icon].sc-smoothly-app-room-h>li.sc-smoothly-app-room>a.sc-smoothly-app-room>.label.sc-smoothly-app-room{display:none}[icon][label].sc-smoothly-app-room-h:hover::before,[icon][label].sc-smoothly-app-room-h:hover::after{position:absolute;color:rgb(var(--smoothly-color-contrast));background-color:rgb(var(--smoothly-color-tint));border-radius:0.25rem;pointer-events:none}[icon][label].sc-smoothly-app-room-h:hover::before{content:\"\";bottom:-1.75rem;transform:rotate(45deg);width:1.25em;height:1.25em}[icon][label].sc-smoothly-app-room-h:hover::after{content:attr(label);white-space:nowrap;bottom:-3.25rem;padding:.5rem 1rem;border-radius:.25rem}@media screen and (max-width: 900px){.sc-smoothly-app-room-h>li.sc-smoothly-app-room>a.sc-smoothly-app-room{padding:0}[icon].sc-smoothly-app-room-h>li.sc-smoothly-app-room>a.sc-smoothly-app-room>.label.sc-smoothly-app-room{display:unset;padding:0 1rem}.sc-smoothly-app-room-h>li.sc-smoothly-app-room>a.sc-smoothly-app-room{margin-left:-1.5rem;margin-right:-1.5rem;padding-left:1.5rem;padding-right:1.5rem}[icon][label].sc-smoothly-app-room-h:hover::before,[icon][label].sc-smoothly-app-room-h:hover::after{content:unset}}";
1533
+ const SmoothlyAppRoomStyle0 = styleCss$1t;
1534
1534
 
1535
1535
  const SmoothlyAppRoom = class {
1536
1536
  constructor(hostRef) {
@@ -1568,8 +1568,8 @@ const SmoothlyAppRoom = class {
1568
1568
  };
1569
1569
  SmoothlyAppRoom.style = SmoothlyAppRoomStyle0;
1570
1570
 
1571
- const styleCss$1q = ".sc-smoothly-back-to-top-h{background-color:rgba(var(--smoothly-default-color), 1);opacity:var(--opacity);pointer-events:var(--pointer-events);transition:opacity 400ms;z-index:3;border-radius:50%;box-shadow:var(--smoothly-shadow);height:3rem;width:3rem;position:fixed;bottom:var(--bottom);right:var(--right);outline:none;cursor:pointer;display:flex;justify-content:center;align-items:center}";
1572
- const SmoothlyBackToTopStyle0 = styleCss$1q;
1571
+ const styleCss$1s = ".sc-smoothly-back-to-top-h{background-color:rgba(var(--smoothly-default-color), 1);opacity:var(--opacity);pointer-events:var(--pointer-events);transition:opacity 400ms;z-index:3;border-radius:50%;box-shadow:var(--smoothly-shadow);height:3rem;width:3rem;position:fixed;bottom:var(--bottom);right:var(--right);outline:none;cursor:pointer;display:flex;justify-content:center;align-items:center}";
1572
+ const SmoothlyBackToTopStyle0 = styleCss$1s;
1573
1573
 
1574
1574
  const SmoothlyBackToTop = class {
1575
1575
  constructor(hostRef) {
@@ -1607,8 +1607,8 @@ const SmoothlyBackToTop = class {
1607
1607
  };
1608
1608
  SmoothlyBackToTop.style = SmoothlyBackToTopStyle0;
1609
1609
 
1610
- const styleCss$1p = "[visible].sc-smoothly-burger-h{display:flex;justify-content:center;align-items:center;height:100%}[visible].sc-smoothly-burger-h .burger.sc-smoothly-burger smoothly-icon.sc-smoothly-burger{font-size:1.7em;cursor:pointer;margin-right:1em}.sc-smoothly-burger-h:not([visible]){display:none}.sc-smoothly-burger-h:not([open]) smoothly-icon.sc-smoothly-burger{transform:rotate(0deg);transition:transform 100ms ease-in-out}[open].sc-smoothly-burger-h smoothly-icon.sc-smoothly-burger{transform:rotate(-90deg);transition:transform 100ms ease-in-out}";
1611
- const SmoothlyBurgerStyle0 = styleCss$1p;
1610
+ const styleCss$1r = "[visible].sc-smoothly-burger-h{display:flex;justify-content:center;align-items:center;height:100%}[visible].sc-smoothly-burger-h .burger.sc-smoothly-burger smoothly-icon.sc-smoothly-burger{font-size:1.7em;cursor:pointer;margin-right:1em}.sc-smoothly-burger-h:not([visible]){display:none}.sc-smoothly-burger-h:not([open]) smoothly-icon.sc-smoothly-burger{transform:rotate(0deg);transition:transform 100ms ease-in-out}[open].sc-smoothly-burger-h smoothly-icon.sc-smoothly-burger{transform:rotate(-90deg);transition:transform 100ms ease-in-out}";
1611
+ const SmoothlyBurgerStyle0 = styleCss$1r;
1612
1612
 
1613
1613
  const SmoothlyBurger = class {
1614
1614
  constructor(hostRef) {
@@ -1691,8 +1691,8 @@ function local(path) {
1691
1691
  return new URL(path, window.location.origin).origin == window.location.origin;
1692
1692
  }
1693
1693
 
1694
- const styleCss$1o = "[color=default].sc-smoothly-button{--smoothly-color:var(--smoothly-default-color);--smoothly-color-contrast:var(--smoothly-default-contrast);--smoothly-color-shade:var(--smoothly-default-shade);--smoothly-color-tint:var(--smoothly-default-tint)}[color=primary].sc-smoothly-button{--smoothly-color:var(--smoothly-primary-color);--smoothly-color-contrast:var(--smoothly-primary-contrast);--smoothly-color-shade:var(--smoothly-primary-shade);--smoothly-color-tint:var(--smoothly-primary-tint)}[color=secondary].sc-smoothly-button{--smoothly-color:var(--smoothly-secondary-color);--smoothly-color-contrast:var(--smoothly-secondary-contrast);--smoothly-color-shade:var(--smoothly-secondary-shade);--smoothly-color-tint:var(--smoothly-secondary-tint)}[color=tertiary].sc-smoothly-button{--smoothly-color:var(--smoothly-tertiary-color);--smoothly-color-contrast:var(--smoothly-tertiary-contrast);--smoothly-color-shade:var(--smoothly-tertiary-shade);--smoothly-color-tint:var(--smoothly-tertiary-tint)}[color=success].sc-smoothly-button{--smoothly-color:var(--smoothly-success-color);--smoothly-color-contrast:var(--smoothly-success-contrast);--smoothly-color-shade:var(--smoothly-success-shade);--smoothly-color-tint:var(--smoothly-success-tint)}[color=warning].sc-smoothly-button{--smoothly-color:var(--smoothly-warning-color);--smoothly-color-contrast:var(--smoothly-warning-contrast);--smoothly-color-shade:var(--smoothly-warning-shade);--smoothly-color-tint:var(--smoothly-warning-tint)}[color=danger].sc-smoothly-button{--smoothly-color:var(--smoothly-danger-color);--smoothly-color-contrast:var(--smoothly-danger-contrast);--smoothly-color-shade:var(--smoothly-danger-shade);--smoothly-color-tint:var(--smoothly-danger-tint)}[color=light].sc-smoothly-button{--smoothly-color:var(--smoothly-light-color);--smoothly-color-contrast:var(--smoothly-light-contrast);--smoothly-color-shade:var(--smoothly-light-shade);--smoothly-color-tint:var(--smoothly-light-tint)}[color=medium].sc-smoothly-button{--smoothly-color:var(--smoothly-medium-color);--smoothly-color-contrast:var(--smoothly-medium-contrast);--smoothly-color-shade:var(--smoothly-medium-shade);--smoothly-color-tint:var(--smoothly-medium-tint)}[color=dark].sc-smoothly-button{--smoothly-color:var(--smoothly-dark-color);--smoothly-color-contrast:var(--smoothly-dark-contrast);--smoothly-color-shade:var(--smoothly-dark-shade);--smoothly-color-tint:var(--smoothly-dark-tint)}.sc-smoothly-button-h{--smoothly-button-border-radius:0.5rem;display:inline-block;box-sizing:border-box;border-radius:var(--smoothly-button-border-radius);cursor:pointer;border:none;outline:none;position:relative}[shape=rounded].sc-smoothly-button-h{--smoothly-button-border-radius:2rem}[type=link].sc-smoothly-button-h{display:inline}[disabled].sc-smoothly-button-h{opacity:0.5;pointer-events:none}.sc-smoothly-button-h>a.sc-smoothly-button,.sc-smoothly-button-h>button.sc-smoothly-button{font-size:110%;font-weight:400;border:1px solid transparent;outline:none;background-color:transparent;cursor:pointer;display:inline-flex;gap:0.5rem;box-sizing:border-box}.sc-smoothly-button-h>a.sc-smoothly-button:empty,.sc-smoothly-button-h>button.sc-smoothly-button:empty{border-width:0}.sc-smoothly-button-h>button.sc-smoothly-button{font-weight:bold;justify-content:center;height:100%;width:100%;border-radius:var(--smoothly-button-border-radius);align-items:center}.sc-smoothly-button-h:not([size=icon]):not([size=flexible])>button.sc-smoothly-button{padding:0.8em;min-width:8em}.sc-smoothly-button-h:not([size=icon]):not([size=flexible]):has(smoothly-icon)>button.sc-smoothly-button{padding:0.6em}[size=icon].sc-smoothly-button-h>button.sc-smoothly-button{padding:0.5em}[type=button].sc-smoothly-button-h>a.sc-smoothly-button{text-align:center;text-decoration:inherit;width:calc(100% - 0.6em)}[size=small].sc-smoothly-button-h>button.sc-smoothly-button{font-size:100%}[size=large].sc-smoothly-button-h>button.sc-smoothly-button{font-size:130%}.sc-smoothly-button-h:not([size=icon]){min-width:8em}[size=flexible].sc-smoothly-button-h{min-width:unset;padding:0;margin:0;display:flex;justify-content:center;align-items:center}[size=flexible].sc-smoothly-button-h>button.sc-smoothly-button{min-width:unset;padding:0;margin:0}[expand].sc-smoothly-button-h{width:100%}[expand=full].sc-smoothly-button-h{border-left:none;border-right:none;--smoothly-button-border-radius:0}[fill=outline].sc-smoothly-button-h>button.sc-smoothly-button{background-color:transparent;color:rgb(var(--smoothly-button-foreground));fill:rgb(var(--smoothly-button-foreground));stroke:rgb(var(--smoothly-button-foreground));border-color:rgb(var(--smoothly-button-foreground))}.sc-smoothly-button-h:not([fill=clear])>button.sc-smoothly-button:hover,.sc-smoothly-button-h>button.sc-smoothly-button:focus-visible,[fill=outline].sc-smoothly-button-h:active>button.sc-smoothly-button::before{border-color:rgb(var(--smoothly-button-focus-color))}[fill=outline].sc-smoothly-button-h>button.sc-smoothly-button:hover::before,[fill=outline].sc-smoothly-button-h>button.sc-smoothly-button:focus-within::before,[fill=outline].sc-smoothly-button-h>button.sc-smoothly-button:active::before{content:\"\";position:absolute;border:2px solid rgb(var(--smoothly-button-focus-border));inset:-1px;border-radius:var(--smoothly-button-border-radius)}.sc-smoothly-button-h:not([fill=clear]):not([fill=outline])>button.sc-smoothly-button:hover,.sc-smoothly-button-h:not([fill=clear]):not([fill=outline])>button.sc-smoothly-button:focus-visible,.sc-smoothly-button-h:not([fill=clear]):not([fill=outline])>button.sc-smoothly-button:active{background:rgb(var(--smoothly-button-hover-background))}.sc-smoothly-button-h>button.sc-smoothly-button,.sc-smoothly-button-h.sc-smoothly-button-s>smoothly-icon,.sc-smoothly-button-h .sc-smoothly-button-s>smoothly-icon{color:rgb(var(--smoothly-button-foreground));stroke:rgb(var(--smoothly-button-foreground));fill:rgb(var(--smoothly-button-foreground))}[hidden].sc-smoothly-button-h{display:none}";
1695
- const SmoothlyButtonStyle0 = styleCss$1o;
1694
+ const styleCss$1q = "[color=default].sc-smoothly-button{--smoothly-color:var(--smoothly-default-color);--smoothly-color-contrast:var(--smoothly-default-contrast);--smoothly-color-shade:var(--smoothly-default-shade);--smoothly-color-tint:var(--smoothly-default-tint)}[color=primary].sc-smoothly-button{--smoothly-color:var(--smoothly-primary-color);--smoothly-color-contrast:var(--smoothly-primary-contrast);--smoothly-color-shade:var(--smoothly-primary-shade);--smoothly-color-tint:var(--smoothly-primary-tint)}[color=secondary].sc-smoothly-button{--smoothly-color:var(--smoothly-secondary-color);--smoothly-color-contrast:var(--smoothly-secondary-contrast);--smoothly-color-shade:var(--smoothly-secondary-shade);--smoothly-color-tint:var(--smoothly-secondary-tint)}[color=tertiary].sc-smoothly-button{--smoothly-color:var(--smoothly-tertiary-color);--smoothly-color-contrast:var(--smoothly-tertiary-contrast);--smoothly-color-shade:var(--smoothly-tertiary-shade);--smoothly-color-tint:var(--smoothly-tertiary-tint)}[color=success].sc-smoothly-button{--smoothly-color:var(--smoothly-success-color);--smoothly-color-contrast:var(--smoothly-success-contrast);--smoothly-color-shade:var(--smoothly-success-shade);--smoothly-color-tint:var(--smoothly-success-tint)}[color=warning].sc-smoothly-button{--smoothly-color:var(--smoothly-warning-color);--smoothly-color-contrast:var(--smoothly-warning-contrast);--smoothly-color-shade:var(--smoothly-warning-shade);--smoothly-color-tint:var(--smoothly-warning-tint)}[color=danger].sc-smoothly-button{--smoothly-color:var(--smoothly-danger-color);--smoothly-color-contrast:var(--smoothly-danger-contrast);--smoothly-color-shade:var(--smoothly-danger-shade);--smoothly-color-tint:var(--smoothly-danger-tint)}[color=light].sc-smoothly-button{--smoothly-color:var(--smoothly-light-color);--smoothly-color-contrast:var(--smoothly-light-contrast);--smoothly-color-shade:var(--smoothly-light-shade);--smoothly-color-tint:var(--smoothly-light-tint)}[color=medium].sc-smoothly-button{--smoothly-color:var(--smoothly-medium-color);--smoothly-color-contrast:var(--smoothly-medium-contrast);--smoothly-color-shade:var(--smoothly-medium-shade);--smoothly-color-tint:var(--smoothly-medium-tint)}[color=dark].sc-smoothly-button{--smoothly-color:var(--smoothly-dark-color);--smoothly-color-contrast:var(--smoothly-dark-contrast);--smoothly-color-shade:var(--smoothly-dark-shade);--smoothly-color-tint:var(--smoothly-dark-tint)}.sc-smoothly-button-h{--smoothly-button-border-radius:0.5rem;display:inline-block;box-sizing:border-box;border-radius:var(--smoothly-button-border-radius);cursor:pointer;border:none;outline:none;position:relative}[shape=rounded].sc-smoothly-button-h{--smoothly-button-border-radius:2rem}[type=link].sc-smoothly-button-h{display:inline}[disabled].sc-smoothly-button-h{opacity:0.5;pointer-events:none}.sc-smoothly-button-h>a.sc-smoothly-button,.sc-smoothly-button-h>button.sc-smoothly-button{font-size:110%;font-weight:400;border:1px solid transparent;outline:none;background-color:transparent;cursor:pointer;display:inline-flex;gap:0.5rem;box-sizing:border-box}.sc-smoothly-button-h>a.sc-smoothly-button:empty,.sc-smoothly-button-h>button.sc-smoothly-button:empty{border-width:0}.sc-smoothly-button-h>button.sc-smoothly-button{font-weight:bold;justify-content:center;height:100%;width:100%;border-radius:var(--smoothly-button-border-radius);align-items:center}.sc-smoothly-button-h:not([size=icon]):not([size=flexible])>button.sc-smoothly-button{padding:0.8em;min-width:8em}.sc-smoothly-button-h:not([size=icon]):not([size=flexible]):has(smoothly-icon)>button.sc-smoothly-button{padding:0.6em}[size=icon].sc-smoothly-button-h>button.sc-smoothly-button{padding:0.5em}[type=button].sc-smoothly-button-h>a.sc-smoothly-button{text-align:center;text-decoration:inherit;width:calc(100% - 0.6em)}[size=small].sc-smoothly-button-h>button.sc-smoothly-button{font-size:100%}[size=large].sc-smoothly-button-h>button.sc-smoothly-button{font-size:130%}.sc-smoothly-button-h:not([size=icon]){min-width:8em}[size=flexible].sc-smoothly-button-h{min-width:unset;padding:0;margin:0;display:flex;justify-content:center;align-items:center}[size=flexible].sc-smoothly-button-h>button.sc-smoothly-button{min-width:unset;padding:0;margin:0}[expand].sc-smoothly-button-h{width:100%}[expand=full].sc-smoothly-button-h{border-left:none;border-right:none;--smoothly-button-border-radius:0}[fill=outline].sc-smoothly-button-h>button.sc-smoothly-button{background-color:transparent;color:rgb(var(--smoothly-button-foreground));fill:rgb(var(--smoothly-button-foreground));stroke:rgb(var(--smoothly-button-foreground));border-color:rgb(var(--smoothly-button-foreground))}.sc-smoothly-button-h:not([fill=clear])>button.sc-smoothly-button:hover,.sc-smoothly-button-h>button.sc-smoothly-button:focus-visible,[fill=outline].sc-smoothly-button-h:active>button.sc-smoothly-button::before{border-color:rgb(var(--smoothly-button-focus-color))}[fill=outline].sc-smoothly-button-h>button.sc-smoothly-button:hover::before,[fill=outline].sc-smoothly-button-h>button.sc-smoothly-button:focus-within::before,[fill=outline].sc-smoothly-button-h>button.sc-smoothly-button:active::before{content:\"\";position:absolute;border:2px solid rgb(var(--smoothly-button-focus-border));inset:-1px;border-radius:var(--smoothly-button-border-radius)}.sc-smoothly-button-h:not([fill=clear]):not([fill=outline])>button.sc-smoothly-button:hover,.sc-smoothly-button-h:not([fill=clear]):not([fill=outline])>button.sc-smoothly-button:focus-visible,.sc-smoothly-button-h:not([fill=clear]):not([fill=outline])>button.sc-smoothly-button:active{background:rgb(var(--smoothly-button-hover-background))}.sc-smoothly-button-h>button.sc-smoothly-button,.sc-smoothly-button-h.sc-smoothly-button-s>smoothly-icon,.sc-smoothly-button-h .sc-smoothly-button-s>smoothly-icon{color:rgb(var(--smoothly-button-foreground));stroke:rgb(var(--smoothly-button-foreground));fill:rgb(var(--smoothly-button-foreground))}[hidden].sc-smoothly-button-h{display:none}";
1695
+ const SmoothlyButtonStyle0 = styleCss$1q;
1696
1696
 
1697
1697
  const SmoothlyButton = class {
1698
1698
  constructor(hostRef) {
@@ -1712,8 +1712,8 @@ const SmoothlyButton = class {
1712
1712
  };
1713
1713
  SmoothlyButton.style = SmoothlyButtonStyle0;
1714
1714
 
1715
- const styleCss$1n = ".sc-smoothly-button-confirm-h{display:inline-block}[disabled].sc-smoothly-button-confirm-h{opacity:0.5;pointer-events:none}.sc-smoothly-button-confirm-h:not([warning])>smoothly-button.sc-smoothly-button-confirm:first-child{display:none}[warning].sc-smoothly-button-confirm-h>smoothly-button.sc-smoothly-button-confirm:nth-child(2){display:none}[expand].sc-smoothly-button-confirm-h{width:100%}";
1716
- const SmoothlyButtonConfirmStyle0 = styleCss$1n;
1715
+ const styleCss$1p = ".sc-smoothly-button-confirm-h{display:inline-block}[disabled].sc-smoothly-button-confirm-h{opacity:0.5;pointer-events:none}.sc-smoothly-button-confirm-h:not([warning])>smoothly-button.sc-smoothly-button-confirm:first-child{display:none}[warning].sc-smoothly-button-confirm-h>smoothly-button.sc-smoothly-button-confirm:nth-child(2){display:none}[expand].sc-smoothly-button-confirm-h{width:100%}";
1716
+ const SmoothlyButtonConfirmStyle0 = styleCss$1p;
1717
1717
 
1718
1718
  const SmoothlyButtonConfirm = class {
1719
1719
  constructor(hostRef) {
@@ -1749,8 +1749,8 @@ const SmoothlyButtonConfirm = class {
1749
1749
  };
1750
1750
  SmoothlyButtonConfirm.style = SmoothlyButtonConfirmStyle0;
1751
1751
 
1752
- const styleCss$1m = "smoothly-button-demo{display:block;margin:1rem}smoothly-button-demo>section>div{display:flex;align-items:center}smoothly-button-demo smoothly-button{margin:.2em .5em}";
1753
- const SmoothlyButtonDemoStyle0 = styleCss$1m;
1752
+ const styleCss$1o = "smoothly-button-demo{display:block;margin:1rem}smoothly-button-demo>section>div{display:flex;align-items:center}smoothly-button-demo smoothly-button{margin:.2em .5em}";
1753
+ const SmoothlyButtonDemoStyle0 = styleCss$1o;
1754
1754
 
1755
1755
  const SmoothlyButtonDemo = class {
1756
1756
  constructor(hostRef) {
@@ -1824,8 +1824,8 @@ function years(current, min, max) {
1824
1824
  return result;
1825
1825
  }
1826
1826
 
1827
- const styleCss$1l = ".sc-smoothly-calendar-h{display:block;--other-month-opacity:0.5;padding:0.5em;border:1px solid rgb(var(--smoothly-input-border))}.sc-smoothly-calendar-h>smoothly-input-month.sc-smoothly-calendar{padding:0 0.5em}.sc-smoothly-calendar-h>table.sc-smoothly-calendar{table-layout:fixed;width:100%}.sc-smoothly-calendar-h>table.sc-smoothly-calendar>thead.sc-smoothly-calendar>tr.sc-smoothly-calendar>th.sc-smoothly-calendar,.sc-smoothly-calendar-h>table.sc-smoothly-calendar>tr.sc-smoothly-calendar>td.sc-smoothly-calendar{text-align:center;padding:0.5em;min-width:2em;box-sizing:border-box;background-color:rgb(var(--smoothly-input-background));color:rgb(var(--smoothly-input-foreground));-webkit-user-select:none;user-select:none}.sc-smoothly-calendar-h>table.sc-smoothly-calendar>tr.sc-smoothly-calendar>td.sc-smoothly-calendar{position:relative;cursor:pointer}.sc-smoothly-calendar-h>table.sc-smoothly-calendar>tr.sc-smoothly-calendar>td.currentMonth.sc-smoothly-calendar{color:rgb(var(--smoothly-default-contrast))}.sc-smoothly-calendar-h>table.sc-smoothly-calendar>tr.sc-smoothly-calendar>td.sc-smoothly-calendar:not(.currentMonth){color:rgba(var(--smoothly-default-contrast), var(--other-month-opacity))}.sc-smoothly-calendar-h>table.sc-smoothly-calendar>tr.sc-smoothly-calendar>td.sc-smoothly-calendar:nth-child(6):not(.currentMonth).selected,.sc-smoothly-calendar-h>table.sc-smoothly-calendar>tr.sc-smoothly-calendar>td.sc-smoothly-calendar:nth-child(6):not(.currentMonth).dateRange,.sc-smoothly-calendar-h>table.sc-smoothly-calendar>tr.sc-smoothly-calendar>td.sc-smoothly-calendar:nth-child(7):not(.currentMonth).selected,.sc-smoothly-calendar-h>table.sc-smoothly-calendar>tr.sc-smoothly-calendar>td.sc-smoothly-calendar:nth-child(7):not(.currentMonth).dateRange{color:rgba(var(--smoothly-default-contrast))}.sc-smoothly-calendar-h>table.sc-smoothly-calendar>tr.sc-smoothly-calendar>td.sc-smoothly-calendar:nth-child(6),.sc-smoothly-calendar-h>table.sc-smoothly-calendar>tr.sc-smoothly-calendar>td.sc-smoothly-calendar:nth-child(7){color:rgb(var(--smoothly-calendar-weekend-foreground, var(--smoothly-danger-color)))}.sc-smoothly-calendar-h>table.sc-smoothly-calendar>tr.sc-smoothly-calendar>td.sc-smoothly-calendar:nth-child(6):not(.currentMonth),.sc-smoothly-calendar-h>table.sc-smoothly-calendar>tr.sc-smoothly-calendar>td.sc-smoothly-calendar:nth-child(7):not(.currentMonth){color:rgba(var(--smoothly-calendar-weekend-foreground, var(--smoothly-danger-color)), var(--other-month-opacity))}.sc-smoothly-calendar-h>table.sc-smoothly-calendar>tr.sc-smoothly-calendar>td.sc-smoothly-calendar:not(.selected,.disable).sc-smoothly-calendar:hover{color:rgb(var(--smoothly-primary-contrast));background:rgb(var(--smoothly-primary-tint))}.sc-smoothly-calendar-h>table.sc-smoothly-calendar>tr.sc-smoothly-calendar>td.selected.sc-smoothly-calendar{color:rgb(var(--smoothly-primary-contrast));background:rgb(var(--smoothly-primary-color))}.sc-smoothly-calendar-h>table.sc-smoothly-calendar>tr.sc-smoothly-calendar>td.today.sc-smoothly-calendar::before{content:\"\";inset:2px;position:absolute;border:1px solid currentColor}.sc-smoothly-calendar-h>table.sc-smoothly-calendar>tr.sc-smoothly-calendar>td.dateRange.sc-smoothly-calendar{color:rgb(var(--smoothly-primary-contrast));background:rgb(var(--smoothly-primary-tint))}.sc-smoothly-calendar-h>table.sc-smoothly-calendar>tr.sc-smoothly-calendar>td.disable.sc-smoothly-calendar{cursor:not-allowed;opacity:0.5}";
1828
- const SmoothlyCalendarStyle0 = styleCss$1l;
1827
+ const styleCss$1n = ".sc-smoothly-calendar-h{display:block;--other-month-opacity:0.5;padding:0.5em;border:1px solid rgb(var(--smoothly-input-border))}.sc-smoothly-calendar-h>smoothly-input-month.sc-smoothly-calendar{padding:0 0.5em}.sc-smoothly-calendar-h>table.sc-smoothly-calendar{table-layout:fixed;width:100%}.sc-smoothly-calendar-h>table.sc-smoothly-calendar>thead.sc-smoothly-calendar>tr.sc-smoothly-calendar>th.sc-smoothly-calendar,.sc-smoothly-calendar-h>table.sc-smoothly-calendar>tr.sc-smoothly-calendar>td.sc-smoothly-calendar{text-align:center;padding:0.5em;min-width:2em;box-sizing:border-box;background-color:rgb(var(--smoothly-input-background));color:rgb(var(--smoothly-input-foreground));-webkit-user-select:none;user-select:none}.sc-smoothly-calendar-h>table.sc-smoothly-calendar>tr.sc-smoothly-calendar>td.sc-smoothly-calendar{position:relative;cursor:pointer}.sc-smoothly-calendar-h>table.sc-smoothly-calendar>tr.sc-smoothly-calendar>td.currentMonth.sc-smoothly-calendar{color:rgb(var(--smoothly-default-contrast))}.sc-smoothly-calendar-h>table.sc-smoothly-calendar>tr.sc-smoothly-calendar>td.sc-smoothly-calendar:not(.currentMonth){color:rgba(var(--smoothly-default-contrast), var(--other-month-opacity))}.sc-smoothly-calendar-h>table.sc-smoothly-calendar>tr.sc-smoothly-calendar>td.sc-smoothly-calendar:nth-child(6):not(.currentMonth).selected,.sc-smoothly-calendar-h>table.sc-smoothly-calendar>tr.sc-smoothly-calendar>td.sc-smoothly-calendar:nth-child(6):not(.currentMonth).dateRange,.sc-smoothly-calendar-h>table.sc-smoothly-calendar>tr.sc-smoothly-calendar>td.sc-smoothly-calendar:nth-child(7):not(.currentMonth).selected,.sc-smoothly-calendar-h>table.sc-smoothly-calendar>tr.sc-smoothly-calendar>td.sc-smoothly-calendar:nth-child(7):not(.currentMonth).dateRange{color:rgba(var(--smoothly-default-contrast))}.sc-smoothly-calendar-h>table.sc-smoothly-calendar>tr.sc-smoothly-calendar>td.sc-smoothly-calendar:nth-child(6),.sc-smoothly-calendar-h>table.sc-smoothly-calendar>tr.sc-smoothly-calendar>td.sc-smoothly-calendar:nth-child(7){color:rgb(var(--smoothly-calendar-weekend-foreground, var(--smoothly-danger-color)))}.sc-smoothly-calendar-h>table.sc-smoothly-calendar>tr.sc-smoothly-calendar>td.sc-smoothly-calendar:nth-child(6):not(.currentMonth),.sc-smoothly-calendar-h>table.sc-smoothly-calendar>tr.sc-smoothly-calendar>td.sc-smoothly-calendar:nth-child(7):not(.currentMonth){color:rgba(var(--smoothly-calendar-weekend-foreground, var(--smoothly-danger-color)), var(--other-month-opacity))}.sc-smoothly-calendar-h>table.sc-smoothly-calendar>tr.sc-smoothly-calendar>td.sc-smoothly-calendar:not(.selected,.disable).sc-smoothly-calendar:hover{color:rgb(var(--smoothly-primary-contrast));background:rgb(var(--smoothly-primary-tint))}.sc-smoothly-calendar-h>table.sc-smoothly-calendar>tr.sc-smoothly-calendar>td.selected.sc-smoothly-calendar{color:rgb(var(--smoothly-primary-contrast));background:rgb(var(--smoothly-primary-color))}.sc-smoothly-calendar-h>table.sc-smoothly-calendar>tr.sc-smoothly-calendar>td.today.sc-smoothly-calendar::before{content:\"\";inset:2px;position:absolute;border:1px solid currentColor}.sc-smoothly-calendar-h>table.sc-smoothly-calendar>tr.sc-smoothly-calendar>td.dateRange.sc-smoothly-calendar{color:rgb(var(--smoothly-primary-contrast));background:rgb(var(--smoothly-primary-tint))}.sc-smoothly-calendar-h>table.sc-smoothly-calendar>tr.sc-smoothly-calendar>td.disable.sc-smoothly-calendar{cursor:not-allowed;opacity:0.5}";
1828
+ const SmoothlyCalendarStyle0 = styleCss$1n;
1829
1829
 
1830
1830
  const Calendar = class {
1831
1831
  constructor(hostRef) {
@@ -1910,8 +1910,8 @@ const Calendar = class {
1910
1910
  };
1911
1911
  Calendar.style = SmoothlyCalendarStyle0;
1912
1912
 
1913
- const styleCss$1k = ".sc-smoothly-dialog-h{display:block;position:fixed;top:55%;left:50%;transform:translate(-50%, -50%);width:100%;height:100%;z-index:1;background:rgba(var(--smoothly-default-color), var(--smoothly-semitransparent)) !important}[hidden].sc-smoothly-dialog-h{display:none}.sc-smoothly-dialog-h>section.sc-smoothly-dialog{margin-top:var(--smoothly-dialog-margin-top)}.sc-smoothly-dialog-h>section.sc-smoothly-dialog>div.header.sc-smoothly-dialog{border-top-left-radius:8px;border-top-right-radius:8px;margin-top:2em;color:rgb(var(--smoothly-primary-contrast));background:rgb(var(--smoothly-primary-color));border-color:rgb(var(--smoothly-primary-color))}.sc-smoothly-dialog-h:not([header]) div.header.sc-smoothly-dialog{border:none}.sc-smoothly-dialog-h>section.sc-smoothly-dialog>*.sc-smoothly-dialog{position:relative;color:rgb(var(--smoothly-default-contrast));background-color:rgb(var(--smoothly-default-color));border-color:rgb(var(--smoothly-color));border-width:1px;border-style:solid;max-width:40em;width:calc(100vw - 4em - 2px);max-height:calc(100vh - 6em - 2px);height:auto;margin-left:auto;margin-right:auto;border-collapse:collapse}.sc-smoothly-dialog-h>section.sc-smoothly-dialog>div.content.sc-smoothly-dialog{border-bottom-left-radius:8px;border-bottom-right-radius:8px;margin-bottom:2em;border:1px solid rgb(var(--smoothly-default-contrast));box-sizing:border-box;overflow:hidden}.sc-smoothly-dialog-h:not([header])>section.sc-smoothly-dialog>div.content.sc-smoothly-dialog{border-radius:8px}.sc-smoothly-dialog-h>section.sc-smoothly-dialog>*.sc-smoothly-dialog>smoothly-trigger.sc-smoothly-dialog{position:absolute;right:-2em;top:-2em;z-index:1;border-color:transparent}.sc-smoothly-dialog-h>section.sc-smoothly-dialog>*.sc-smoothly-dialog>smoothly-trigger.sc-smoothly-dialog:hover{border-color:transparent}.sc-smoothly-dialog-h>section.sc-smoothly-dialog>div.header.sc-smoothly-dialog>smoothly-trigger.sc-smoothly-dialog>smoothly-icon.sc-smoothly-dialog{background-color:rgb(var(--smoothly-color));border-radius:50%}.sc-smoothly-dialog-h>section.sc-smoothly-dialog>*.sc-smoothly-dialog>*.sc-smoothly-dialog{margin:10px}";
1914
- const SmoothlyDialogStyle0 = styleCss$1k;
1913
+ const styleCss$1m = ".sc-smoothly-dialog-h{display:block;position:fixed;top:55%;left:50%;transform:translate(-50%, -50%);width:100%;height:100%;z-index:1;background:rgba(var(--smoothly-default-color), var(--smoothly-semitransparent)) !important}[hidden].sc-smoothly-dialog-h{display:none}.sc-smoothly-dialog-h>section.sc-smoothly-dialog{margin-top:var(--smoothly-dialog-margin-top)}.sc-smoothly-dialog-h>section.sc-smoothly-dialog>div.header.sc-smoothly-dialog{border-top-left-radius:8px;border-top-right-radius:8px;margin-top:2em;color:rgb(var(--smoothly-primary-contrast));background:rgb(var(--smoothly-primary-color));border-color:rgb(var(--smoothly-primary-color))}.sc-smoothly-dialog-h:not([header]) div.header.sc-smoothly-dialog{border:none}.sc-smoothly-dialog-h>section.sc-smoothly-dialog>*.sc-smoothly-dialog{position:relative;color:rgb(var(--smoothly-default-contrast));background-color:rgb(var(--smoothly-default-color));border-color:rgb(var(--smoothly-color));border-width:1px;border-style:solid;max-width:40em;width:calc(100vw - 4em - 2px);max-height:calc(100vh - 6em - 2px);height:auto;margin-left:auto;margin-right:auto;border-collapse:collapse}.sc-smoothly-dialog-h>section.sc-smoothly-dialog>div.content.sc-smoothly-dialog{border-bottom-left-radius:8px;border-bottom-right-radius:8px;margin-bottom:2em;border:1px solid rgb(var(--smoothly-default-contrast));box-sizing:border-box;overflow:hidden}.sc-smoothly-dialog-h:not([header])>section.sc-smoothly-dialog>div.content.sc-smoothly-dialog{border-radius:8px}.sc-smoothly-dialog-h>section.sc-smoothly-dialog>*.sc-smoothly-dialog>smoothly-trigger.sc-smoothly-dialog{position:absolute;right:-2em;top:-2em;z-index:1;border-color:transparent}.sc-smoothly-dialog-h>section.sc-smoothly-dialog>*.sc-smoothly-dialog>smoothly-trigger.sc-smoothly-dialog:hover{border-color:transparent}.sc-smoothly-dialog-h>section.sc-smoothly-dialog>div.header.sc-smoothly-dialog>smoothly-trigger.sc-smoothly-dialog>smoothly-icon.sc-smoothly-dialog{background-color:rgb(var(--smoothly-color));border-radius:50%}.sc-smoothly-dialog-h>section.sc-smoothly-dialog>*.sc-smoothly-dialog>*.sc-smoothly-dialog{margin:10px}";
1914
+ const SmoothlyDialogStyle0 = styleCss$1m;
1915
1915
 
1916
1916
  const SmoothlyDialog = class {
1917
1917
  constructor(hostRef) {
@@ -1939,14 +1939,20 @@ const SmoothlyDialog = class {
1939
1939
  };
1940
1940
  SmoothlyDialog.style = SmoothlyDialogStyle0;
1941
1941
 
1942
+ const styleCss$1l = ".sc-smoothly-dialog-demo-h>smoothly-button.sc-smoothly-dialog-demo{display:block;margin-block:2rem}";
1943
+ const SmoothlyDialogDemoStyle0 = styleCss$1l;
1944
+
1942
1945
  const SmoothlyDialogDemo = class {
1943
1946
  constructor(hostRef) {
1944
1947
  index.registerInstance(this, hostRef);
1948
+ this.openModal = false;
1949
+ this.showFrame = false;
1945
1950
  }
1946
1951
  render() {
1947
- return (index.h("smoothly-dialog", { key: 'd7b88047c49add95c1816b1552bc9c30276ba08b', color: "default", closable: true }, index.h("smoothly-frame", { key: '56aedefead747913a72d795c0149342ddc45c5bb', url: "https://www.wikipedia.org/", name: "parent", style: { height: "80vh" } })));
1952
+ return (index.h(index.Host, { key: '6c4ba68e4b6f35ae85b1c580a64c04595ae6117c' }, index.h("smoothly-button", { key: 'f67e91a8698cc5ec7202372e789fabe725c1e7e5', fill: "solid", color: "light", onClick: () => (this.openModal = true) }, "Open Modal"), index.h("smoothly-button", { key: 'b2d30f776331757892584ef8956bb81a2bd207c7', fill: "solid", color: "light", onClick: () => (this.showFrame = !this.showFrame) }, "Show Frame"), index.h("smoothly-modal", { key: '7a722ab3c5edade7fa4550ea7d87c6364caa02dd', closable: true, open: this.openModal, onSmoothlyModalChange: e => (this.openModal = e.detail) }, index.h("h2", { key: '48f5e0c1380214c301ba0bea1bdef0fc5457cba9', slot: "header" }, "Modal"), index.h("span", { key: 'b55816e13c2941e69d7aaedf9f48729708e0f08c' }, "Are you sure you want to confirm this action?"), index.h("smoothly-button", { key: 'd68ce299fe568f359ae087b71f2622cc46754046', slot: "actions", color: "success" }, "Confirm"), index.h("smoothly-button", { key: '791bac22ef5643e20acdb6c3d3e65d24685ab983', slot: "actions", color: "light", fill: "outline", onClick: () => (this.openModal = false) }, "Cancel")), this.showFrame && (index.h("smoothly-dialog", { key: '6500f4c114d5b50b75a9dde232c52caf67df5332', closable: true }, index.h("smoothly-frame", { key: '24fbc3add95843e4e63703173fd51a9546787285', url: "https://www.wikipedia.org/", name: "parent", style: { height: "80vh" } })))));
1948
1953
  }
1949
1954
  };
1955
+ SmoothlyDialogDemo.style = SmoothlyDialogDemoStyle0;
1950
1956
 
1951
1957
  function getForwardWordBreakIndex(str, index, wordRegex) {
1952
1958
  let result = 0;
@@ -3774,8 +3780,8 @@ class Handler {
3774
3780
  }
3775
3781
  add$5("hex-color", () => new Handler());
3776
3782
 
3777
- const styleCss$1j = ".sc-smoothly-display-h{display:block;white-space:wrap}[hidden].sc-smoothly-display-h{display:none}.sc-smoothly-display-h>div.sc-smoothly-display{opacity:0.6;font-size:.8rem}";
3778
- const SmoothlyDisplayStyle0 = styleCss$1j;
3783
+ const styleCss$1k = ".sc-smoothly-display-h{display:block;white-space:wrap}[hidden].sc-smoothly-display-h{display:none}.sc-smoothly-display-h>div.sc-smoothly-display{opacity:0.6;font-size:.8rem}";
3784
+ const SmoothlyDisplayStyle0 = styleCss$1k;
3779
3785
 
3780
3786
  const SmoothlyDisplay = class {
3781
3787
  constructor(hostRef) {
@@ -3795,16 +3801,16 @@ const SmoothlyDisplay = class {
3795
3801
  const type = this.type;
3796
3802
  switch (type) {
3797
3803
  case "json":
3798
- result = index.h("smoothly-display-json", { key: '72260098deaaf8e86824a3c3afb18a8f84e0c017', value: this.value, collapseDepth: this.collapseDepth });
3804
+ result = index.h("smoothly-display-json", { key: '0c9bec874f0f21678c2a9e48696e99172d94add0', value: this.value, collapseDepth: this.collapseDepth });
3799
3805
  break;
3800
3806
  default:
3801
3807
  result = format(this.value, type);
3802
3808
  break;
3803
3809
  case "email":
3804
- result = index.h("a", { key: '2f6c92ae6a5fd6669a55ebf574d4153a8dfba56b', href: "mailto:" + this.value }, format(this.value, type));
3810
+ result = index.h("a", { key: 'a9d33b95c096c5ba49842f8770cab32bfb5479fd', href: "mailto:" + this.value }, format(this.value, type));
3805
3811
  break;
3806
3812
  case "phone":
3807
- result = index.h("a", { key: '2d85accc66c0d4ddfb0054b1a479bad1d03aef24', href: "tel:" + this.value }, format(this.value, type, this.country));
3813
+ result = index.h("a", { key: '62f3aef05eadab71c7d87168d02d13e01faaef33', href: "tel:" + this.value }, format(this.value, type, this.country));
3808
3814
  break;
3809
3815
  case "postal-code":
3810
3816
  result = format(this.value, type, this.country);
@@ -3841,35 +3847,35 @@ const SmoothlyDisplayDemo = class {
3841
3847
  }
3842
3848
  render() {
3843
3849
  return [
3844
- index.h("main", { key: 'e7e31ea92b4ed1b752e1b36b1834d0f625f67cfd' }, index.h("fieldset", { key: '581f468dda8f2bd82de2c000e4447d5321e9eed6' }, index.h("h2", { key: '87966e476a302a692668bed7e3b3d19115882eb8' }, "Smoothly display"), index.h("dl", { key: 'cbcb2f6235ce01e0afeef271c80834c4ae5f3224' }, index.h("dt", { key: '25181e180acc711c3cb77f33b80b73a0610c4486' }, "Duration"), index.h("dd", { key: '83448124de87c9c3feb35c77275ff3fcded5aefa' }, index.h("div", { key: '94230b9ab2b633e70e616cef8637c7ec14e42faf' }, index.h("div", { key: '0eba921df28ca3c86529070be5635a6c65c7d40c' }, index.h("smoothly-display", { key: 'd68d7ffda5f4cb3f3be5749050ca40e1b8392d89', style: { display: "inline" }, type: "duration", value: { hours: 13, minutes: 100 } }), " h"), index.h("div", { key: '1493a1fcdb128fdcf2ed3cd8531aeb78fb1c1a98' }, index.h("smoothly-display", { key: '5f66a9b3fbbddf42ddedad9d1662337d3f72f7df', style: { display: "inline" }, type: "duration", value: { hours: 8 } }), " h"), index.h("div", { key: '3378de69efaba3bbb6df4552485af2e994070367' }, index.h("smoothly-display", { key: 'cdecb32bb23d5c87e913e58ab107fd235c96910e', style: { display: "inline" }, type: "duration", value: { minutes: 3 } }), " h"), index.h("div", { key: 'db05908dbbf3bab906a3f6df6f88e416fa3422bf' }, index.h("smoothly-display", { key: 'a8f32adb32961b3e24436b5c5e8c8a21b65b9901', style: { display: "inline" }, type: "duration", value: { hours: -13, minutes: 100 } }), " h"), index.h("div", { key: 'a20f84ade97c32a35c6490f8b15f757ec07ed3cc' }, index.h("smoothly-display", { key: '8a3140e45105d3f276fe9fea7ef441ae0d8bd059', style: { display: "inline" }, type: "duration", value: { hours: -8 } }), " h"), index.h("div", { key: 'ec59e01cf6a1a57ff8152e1bb2f0ed523b1cec8f' }, index.h("smoothly-display", { key: 'dab86834e425d6086d247fcea8bdf2ccf64b96b1', style: { display: "inline" }, type: "duration", value: {} }), " h"), index.h("div", { key: 'b040a252eb914cfed6e0136c0dfec52f6a92aea3' }, index.h("smoothly-display", { key: '0ddbdae519c07a8d2907bff91b37aec1e08d1002', style: { display: "inline" }, type: "duration", value: { minutes: -3 } }), " h"))), index.h("dt", { key: '092f01d470ea3a94defbd1a9bf89b03dcba5dd29' }, "text"), index.h("dd", { key: '3819b8f1e424767e1d7e90b8de69990ea2914c69' }, index.h("smoothly-display", { key: '4c902c18d635e3b0f2b3043c2ec5b500b9d07e66', type: "text", value: "text" })), index.h("dt", { key: 'bd037b5ae1014379296aa0d1571b3d65a1e5ed2b' }, "postal code"), index.h("dd", { key: 'b35456ca38465589d719261c9daea0ca7806dc81' }, index.h("smoothly-display", { key: '231f37d8cae724a1665ba3af41c483bc88d25bda', type: "postal-code", value: "752 31" })), index.h("dt", { key: 'fde2305262f5ba77f3af9e0fae87c94d2d5dbf20' }, "password"), index.h("dd", { key: '8c2ba8207b52bf849ffa5ac2d36af0a5738d5fd4' }, index.h("smoothly-display", { key: 'ee45bffb640e0ccf31d9b634633b0c2cb0285351', type: "password", value: "password" })), index.h("dt", { key: 'd6c8e5c0dba5484cf8dfa114c57dfc36ee424ccb' }, "email"), index.h("dd", { key: 'd9b38d1f881646490db89ea50479ee5a82f3985d' }, index.h("smoothly-display", { key: '0f92895923de8cd7c46870fc00374331c588e9a7', type: "email", value: "test@example.com" })), index.h("dt", { key: '1d044f4869f6aaa9fae4ea4b027bd3028d0026dc' }, "price"), index.h("dd", { key: 'a73a15154b8f1b835d8f7d26a7db6ac6fa57e5d7' }, index.h("smoothly-display", { key: 'f0f8ad0e46a2f84b6a6171d0ca3008c85da25ad8', type: "price", value: "13.37", currency: "SEK" })), index.h("dt", { key: '285d7294b63ca9bbf90ff0b7b9b07cd4427770e7' }, "price without decimals"), index.h("dd", { key: 'b8af56cc967f7c9e135bbb4a1b42b6e798856004' }, index.h("smoothly-display", { key: '95ba14d11f83ed74037435a8eb59e0aee897ea17', type: "price", value: 200, currency: "SEK", toInteger: true })), index.h("dt", { key: 'a2460b0e68a5b7a4debdd765ea767b093a7b4bed' }, "price with decimals if they are set, otherwise no decimal"), index.h("dd", { key: 'c8e71e703498e330caffaa2422d400e1d39c3d3f' }, index.h("smoothly-display", { key: '24e22a7d5d01b7082dfd2f9d6f1e1d33fb3aab92', type: "price", value: 200.2, currency: "SEK", toInteger: true })), index.h("dt", { key: 'e13f9079f4f938619ecc495456a00bb55839c285' }, "price with decimals"), index.h("dd", { key: '72f7bcc6cc483e00caffcf5e480d298dc7433bc0' }, index.h("smoothly-display", { key: '93efabea58c28b1bc6571acd1d76e474fada9f3e', type: "price", value: 200.2, currency: "SEK" })), index.h("dt", { key: 'f47315d9d331b0e44fa1083f70d66b2c52d2c5de' }, "percent"), index.h("dd", { key: 'caf1fad0df1ec581e4d10eeb931dca7debe193c7' }, index.h("smoothly-display", { key: '1ac7b0ba18d696e80d932321af360df4dcb40eb8', type: "percent", value: "42" })), index.h("dt", { key: '57d24776382b532da3be0f5d735f109e7ebc38a6' }, "phone"), index.h("dd", { key: '5d5f4fa27daf47c9c194b13bcaf3b643af3767bc' }, index.h("smoothly-display", { key: '677a57d0535ffc5ba365b96a39be42ee79d10978', type: "phone", value: "0101881108" })), index.h("dt", { key: '6a18b773e36a3e9a9f6932288d7fc3e92d1cdab8' }, "card number"), index.h("dd", { key: '2c577b2f57bce9f0c37ba2d191ff1093b8d06580' }, index.h("smoothly-display", { key: 'ad8e47881cdca3282cc0539ee829304478a145ac', type: "card-number", value: "4111111111111111" })), index.h("dt", { key: 'e7d737ad090cee4f39ab91a600b4d49824d0fa06' }, "card expires"), index.h("dd", { key: '2d532483f5a6347fe1bc381d91e0f21eee3963b8' }, index.h("smoothly-display", { key: 'c17999c3906e8ed19ae504796cdb9d8b8a03e04d', type: "card-expires", value: "7/22" })), index.h("dt", { key: '7db78e190ad8e66ba995ebe940759e0c4d6352e9' }, "card csc"), index.h("dd", { key: 'b9fbda14abbf23a1d276bfc98908ce8fde75b4c3' }, index.h("smoothly-display", { key: 'd010f0989dcd0511074d705ce4a159f7b5e710c0', type: "card-csc", value: "987" })), index.h("dt", { key: 'b70f323a7ca5701cc8c5cae0b4cb8866001c3c93' }, "date"), index.h("dd", { key: '3d03ff32f1082b228f3496d7350d1723b442cea9' }, index.h("smoothly-display", { key: '5260595387fa3c2b1cf057a4d2287be3d590ba3a', type: "date", value: "2022-07-07" })), index.h("dt", { key: 'ddd622b6a27b9df4f8aff1bc81859acf2607a446' }, "date time"), index.h("dd", { key: '3580d27a731265f31a461b711e259d51f5f04c78' }, index.h("smoothly-display", { key: '87269902b733eeee0d3176940ac585a05d7960be', type: "date-time", format: {
3850
+ index.h("main", { key: '1884d99c36f0634c0541dcbba73f078f1f2e146f' }, index.h("fieldset", { key: '1f1bfd94d014dbcb3e2b216b1d030487556ec12d' }, index.h("h2", { key: 'd74303a581f7b12ba9439b82158abd5ff3a954b3' }, "Smoothly display"), index.h("dl", { key: '7d2b802071231e313225322119cd6bd43007e11f' }, index.h("dt", { key: 'c4089b2fd1c555f27dc067a79e03a70c51b481c2' }, "Duration"), index.h("dd", { key: '12876e8af94ebef30bdf50c193e502216bdf282c' }, index.h("div", { key: '9f1dbbbdcdbb7b160d4c03f38e48b932d067cb71' }, index.h("div", { key: 'a639d9137db808a3cdc7cfecdd19712bdc52c86d' }, index.h("smoothly-display", { key: '72c5fdf95929f7b4f34c2bf52df82a970c45e922', style: { display: "inline" }, type: "duration", value: { hours: 13, minutes: 100 } }), " h"), index.h("div", { key: '8f7a1860a1abb16ae1aec3e61b79b03c663ecb3d' }, index.h("smoothly-display", { key: '7c753fdd3400c5aba71f26cc7fcb988e271671ca', style: { display: "inline" }, type: "duration", value: { hours: 8 } }), " h"), index.h("div", { key: '0e94ccc042565b4a8f2f4574699aa5dbc2391da6' }, index.h("smoothly-display", { key: 'f1b2e0a178c5e52e84378b6fe8bfd1d7066d6517', style: { display: "inline" }, type: "duration", value: { minutes: 3 } }), " h"), index.h("div", { key: '066ebf90522f44fb03e87e42bcf1ee0645a3fda1' }, index.h("smoothly-display", { key: 'e7f712610fdb0fde221ae752ab81941141fe1736', style: { display: "inline" }, type: "duration", value: { hours: -13, minutes: 100 } }), " h"), index.h("div", { key: '73a3e283f7dd191c4ab5b950e30376587cbc9860' }, index.h("smoothly-display", { key: '95dac3ecda205c1c8eac4efeb76aff25f9432352', style: { display: "inline" }, type: "duration", value: { hours: -8 } }), " h"), index.h("div", { key: 'c8d0a225e9743c1acaedb51a032fe0c9ab03e97b' }, index.h("smoothly-display", { key: '6a8a03aee7a070f7a395d77b387b2e026b26630b', style: { display: "inline" }, type: "duration", value: {} }), " h"), index.h("div", { key: '6867f3a04a4f8a1884ca753f77019da2e38193f3' }, index.h("smoothly-display", { key: '13fa79643263fdcbe8aaa7b25c64a0913f1cecf1', style: { display: "inline" }, type: "duration", value: { minutes: -3 } }), " h"))), index.h("dt", { key: 'bd9bf2570d75bf161c05f9875947799ff3267db4' }, "text"), index.h("dd", { key: '688fdae9d08f2a008c1281437b50f3f92481dbd2' }, index.h("smoothly-display", { key: 'c220de6401d1aa13251c3e66c0daf822499ee08b', type: "text", value: "text" })), index.h("dt", { key: '97c14363d67efc9e086b01eb4f1b6d6d517b723f' }, "postal code"), index.h("dd", { key: 'd644b1d763d3d99de89cbb478cd930f5d9344072' }, index.h("smoothly-display", { key: '80d74c9776e2f97fb51d4d1b7bb5eecd4bdd0067', type: "postal-code", value: "752 31" })), index.h("dt", { key: 'b0fe5f014cdcce5f246df01977abd4f81ddc10f2' }, "password"), index.h("dd", { key: '99cfc035193811268af615778aec9758a5c29ba4' }, index.h("smoothly-display", { key: '01414318b7fa3d68cee849f6a1c7b2dc073091f1', type: "password", value: "password" })), index.h("dt", { key: '31b6dd5816132673b12d085906273622f2a7fe67' }, "email"), index.h("dd", { key: '738b0106ac2228e6207678c4b310135a73614982' }, index.h("smoothly-display", { key: '39c4c8fce8247b0ef025e1f246e1501f5ced2764', type: "email", value: "test@example.com" })), index.h("dt", { key: '2fe0afb508eb4a324a7bd4c3f12b5ed990234d4a' }, "price"), index.h("dd", { key: 'd8f43c0efd5997cf84df8e1041059dd65641bd4b' }, index.h("smoothly-display", { key: 'a49efc19974c2a3abbea9ead4b432b194874089b', type: "price", value: "13.37", currency: "SEK" })), index.h("dt", { key: '98181a41b44286f039e688e81a314544923cdaa2' }, "price without decimals"), index.h("dd", { key: '9775482a24ad31b1882e9284320d6d0f9dea6b25' }, index.h("smoothly-display", { key: 'f95b697244ff916b5abe814951491bd446c6a129', type: "price", value: 200, currency: "SEK", toInteger: true })), index.h("dt", { key: 'acbbe2f964fa678c8323ca293eea908a602dda4c' }, "price with decimals if they are set, otherwise no decimal"), index.h("dd", { key: '2316ed6bbafd30c898a55cd347d887646351a059' }, index.h("smoothly-display", { key: 'bae4a8e049119718cbc749d3fbd04e660e6d3213', type: "price", value: 200.2, currency: "SEK", toInteger: true })), index.h("dt", { key: '75c83574a45e947c705a527627a95dd928d0d302' }, "price with decimals"), index.h("dd", { key: '33a0a8dcaf8c622bc23b0ccd5ea5da772e5f5d0a' }, index.h("smoothly-display", { key: '8281b39bf3e683e267b0933340b16ef2df39eea0', type: "price", value: 200.2, currency: "SEK" })), index.h("dt", { key: 'be28aad75033edb9a7d2f22ab9353ff8dc917a48' }, "percent"), index.h("dd", { key: '2819b8d662e4dd9391a96053adfdf6e0bc8017d2' }, index.h("smoothly-display", { key: '6b2ffb4bfbd6b0e3c607a056e264e13afceb8fa6', type: "percent", value: "42" })), index.h("dt", { key: '3d9ab902cf90db8cda244761f5a6cd0e3959cfe5' }, "phone"), index.h("dd", { key: 'fcc3f2c0f42d863c81da28285d371c142b1a267c' }, index.h("smoothly-display", { key: '417a233b8a47abd611e54793492349485185103f', type: "phone", value: "0101881108" })), index.h("dt", { key: '91ccc7e6fb8e6e4bbf33ff6fe2fc7aeca2f014c5' }, "card number"), index.h("dd", { key: 'd03ca2f1002073d85e375639da979b1e46506ab1' }, index.h("smoothly-display", { key: '8b4c6367af7f3a731122974ccbccecb5d183808b', type: "card-number", value: "4111111111111111" })), index.h("dt", { key: '039698ebc4190e3e728d46085fe42bd7a677bb92' }, "card expires"), index.h("dd", { key: 'a2acfaa95ee16e5ab3536776ceb1fd7e43498933' }, index.h("smoothly-display", { key: '03d35dc9b8a9334f5a0036819dcd24456cb0cb39', type: "card-expires", value: "7/22" })), index.h("dt", { key: '5770e2dc7e5c9024087110cbbe96ac2d0c34e45a' }, "card csc"), index.h("dd", { key: 'cb7137f7ac9a45a73a174618d1e08ac9198b0c28' }, index.h("smoothly-display", { key: '6698bbdf05f0f9aeff9a524a6c6e9b3a162e611f', type: "card-csc", value: "987" })), index.h("dt", { key: 'bb3132ddd71145977ee78e7ae1b3ef36309ece50' }, "date"), index.h("dd", { key: '15d8e19ad162991a87685384d6b85b9f56cf7d88' }, index.h("smoothly-display", { key: '5e9e982f3f1f5d520fc6295f7129cecd6923f4cd', type: "date", value: "2022-07-07" })), index.h("dt", { key: '35dcaf719cdd984bd152b3f7d3882d61b3f740d5' }, "date time"), index.h("dd", { key: '19c1e94cc9bccf8ed4fa6ced58456003919deeb1' }, index.h("smoothly-display", { key: '534cac8ced225a5e4e18d024cede0ede390f1382', type: "date-time", format: {
3845
3851
  year: "numeric",
3846
3852
  month: "short",
3847
3853
  day: "numeric",
3848
3854
  hour: "numeric",
3849
3855
  minute: "numeric",
3850
3856
  second: "numeric",
3851
- }, value: "2022-07-07T02:02:02Z" })), index.h("dd", { key: 'a622179096f208403250b108ae5ed6921fb1ede5' }, index.h("smoothly-display", { key: 'b069bc49fb68420f78f98a8afebe53ba594276d8', type: "date-time", format: {
3857
+ }, value: "2022-07-07T02:02:02Z" })), index.h("dd", { key: '5cb68a16a2a58e482f479f7b0cd55bec7c2dd843' }, index.h("smoothly-display", { key: '6e0103ac51fda62fee2b92b6c5b675659af55d14', type: "date-time", format: {
3852
3858
  year: "2-digit",
3853
3859
  month: "long",
3854
3860
  day: "2-digit",
3855
3861
  hour: "2-digit",
3856
3862
  minute: "2-digit",
3857
3863
  second: "2-digit",
3858
- }, value: "2022-07-07T02:02:02Z" })), index.h("dd", { key: '35ebf02ee974dbfad74e11807d466a44d7dab651' }, index.h("smoothly-display", { key: 'e583e366e9cb87e8bf5bf6746ac1ed1982c19260', type: "date-time", format: {
3864
+ }, value: "2022-07-07T02:02:02Z" })), index.h("dd", { key: 'd2a30230571dd5408d957375e12dec0991430628' }, index.h("smoothly-display", { key: '1ab7d44d8e8d54c35bab5994ba93ddeb7e4d8a34', type: "date-time", format: {
3859
3865
  year: "numeric",
3860
3866
  month: "2-digit",
3861
3867
  day: "2-digit",
3862
3868
  hour: "numeric",
3863
3869
  minute: "numeric",
3864
3870
  second: "numeric",
3865
- }, value: "2022-07-07T12:22:24Z" })), index.h("dd", { key: '97a46b2e8748325431b1d3afd0476e3680781073' }, index.h("smoothly-display", { key: '23bc78ca6a281cfb8b7d6604b7cfc8167c993f9b', type: "date-time", format: {
3871
+ }, value: "2022-07-07T12:22:24Z" })), index.h("dd", { key: '9d78a6759e91cd6b4448e6f6736036d4a3da29d2' }, index.h("smoothly-display", { key: 'bf6e329d185ee7077c5f3e1321e08acae2eaf4e9', type: "date-time", format: {
3866
3872
  year: "numeric",
3867
3873
  month: "numeric",
3868
3874
  day: "numeric",
3869
3875
  hour: "numeric",
3870
3876
  minute: "numeric",
3871
3877
  second: "numeric",
3872
- }, value: "2022-07-07T12:22:24Z" })), index.h("dd", { key: 'aa5b12abeade5d25410bbadd79c24b2b8513c7b6' }, index.h("smoothly-display", { key: '02d95bd64d06434862a5b173444664772085e60b', type: "date-time", format: { year: "numeric", month: "short", day: "numeric" }, value: "2022-07-07T00:00+02:00" })), index.h("dd", { key: '4768e4cc6d7331de78be1df17d2cb18730c8702f' }, index.h("smoothly-display", { key: 'e8ca4320e1f7f508b1117f55e2dab8c3f4cbf86c', type: "date-time", format: { year: "2-digit", month: "numeric", day: "numeric" }, value: "2022-07-07T00:00+02:00" })), index.h("dd", { key: '04ecdbb2bd48b5cab09b237e526fe756beec527a' }, index.h("smoothly-display", { key: 'd115a6ddfba6bc4b7d5043a35ac135867d4197a4', type: "date-time", format: {
3878
+ }, value: "2022-07-07T12:22:24Z" })), index.h("dd", { key: 'e18e944f3a2634c8845fc3c8ac37218b99a7449e' }, index.h("smoothly-display", { key: '08f12a25ac1a82a29c4f3b0b2c243abf35e5dc19', type: "date-time", format: { year: "numeric", month: "short", day: "numeric" }, value: "2022-07-07T00:00+02:00" })), index.h("dd", { key: '77a762a3d71ea5a4a0aec54f6a00b7cefb63599f' }, index.h("smoothly-display", { key: '8295f62596514d41bf862485f13c8c71c0a4f1cc', type: "date-time", format: { year: "2-digit", month: "numeric", day: "numeric" }, value: "2022-07-07T00:00+02:00" })), index.h("dd", { key: '9b80503f3e137006d711017eaf10b3db5da34875' }, index.h("smoothly-display", { key: '66645f730d1177045b8f5eacaeab2c329f0dff44', type: "date-time", format: {
3873
3879
  year: "2-digit",
3874
3880
  month: "numeric",
3875
3881
  day: "numeric",
@@ -3877,21 +3883,21 @@ const SmoothlyDisplayDemo = class {
3877
3883
  minute: "2-digit",
3878
3884
  second: "2-digit",
3879
3885
  timeZone: "Europe/Stockholm",
3880
- }, value: "2022-07-07T12:15Z" })), index.h("dt", { key: '58cbda2d543ea346b2978251302dab8658bac60e' }, "Display JSON"), index.h("dd", { key: 'de862323b443aef9c4cb0d010aeae3a500e21811' }, index.h("smoothly-display-demo-json", { key: 'f37649a3f492ff36e0e47a89cfca41be88128e14' })))), index.h("h2", { key: 'cd3c21b3baae669f14febc93e698d30cab5897b3' }, "With labels"), index.h("dd", { key: 'ae206d6ab12ff7229346a91b4b25b5b6d0841e8a' }, index.h("smoothly-display", { key: '005821b1b1fc672b878e62cb2df51f77744ae629', label: "Today", type: "date", value: TimeZone.Date.now() }), index.h("smoothly-display", { key: '5cd373c8e511ed140fc60f6cafbb435abcbf7da4', label: "Total amount", type: "price", currency: "SEK", value: 6789 }), index.h("smoothly-display", { key: 'dfa7d3e1c59edd780b0097d8b2fa1b69a100a076', label: "Total amount", type: "price", currency: "GBP", value: 678.9 }), index.h("smoothly-display", { key: '59a2dabebe70950c5eb040fb330c45aa65da342e', label: "Logs", type: "json", value: [
3886
+ }, value: "2022-07-07T12:15Z" })), index.h("dt", { key: '06daf48cc5f219d8d20ded0b2d17eb5c15ee802f' }, "Display JSON"), index.h("dd", { key: '68e52d5d58c9e6b2a81afdf12d068e486206a75c' }, index.h("smoothly-display-demo-json", { key: '2e7cea8ceaf6d757aedbda66b7ecd3fbcba9626c' })))), index.h("h2", { key: '8b6e6410e5893b39746d297490f4ba6c1a9e43ab' }, "With labels"), index.h("dd", { key: 'fe7442c9d9790bcf21f96982d051c3c405ae04b7' }, index.h("smoothly-display", { key: 'af5004ede783be29b7068ed1c61d22710e282bf4', label: "Today", type: "date", value: TimeZone.Date.now() }), index.h("smoothly-display", { key: '882f57a8e91fa1d74fe2ccf1ec71367ce2a499f2', label: "Total amount", type: "price", currency: "SEK", value: 6789 }), index.h("smoothly-display", { key: 'fa228466f55ac337f553733415b7bde7038f562b', label: "Total amount", type: "price", currency: "GBP", value: 678.9 }), index.h("smoothly-display", { key: '04eac3bb5a5382815e2f92a2b4c54182166b9637', label: "Logs", type: "json", value: [
3881
3887
  { type: "trace", message: "Hello" },
3882
3888
  { type: "error", message: "Oh no!" },
3883
- ] })), index.h("fieldset", { key: '2170a3fa7a27b29fb7492b184358dd821c271050' }, index.h("h2", { key: '1f8b40d2ec4209b128b26120825bce734e69b564' }, "Test of different kinds of notifier"), index.h("button", { key: '70b9b22b9f6db72b67ec932d8b6eb55e57cc7911', onClick: () => this.noticeWarning(redirect.Notice.warn("This is a test warning notice.")) }, "warning"), index.h("button", { key: 'a844297ef5b7e62e84ade4f9bfe80fe94c65b048', onClick: () => this.noticeWarning(redirect.Notice.succeeded("This is a test success notice.")) }, "success"), index.h("button", { key: 'd11839578ed84c2cbe7fc1569e9e744a543f0174', onClick: () => this.noticeWarning(redirect.Notice.failed("This is a test danger notice.")) }, "danger"), index.h("button", { key: 'e7fa70e00831f203985c3a10bd9cdd5be2f994e9', onClick: () => this.noticeWarning(redirect.Notice.execute("This is a test execute notice.", () => new Promise(resolve => window.setTimeout(() => resolve([true, "This went great"]), 3000)))) }, "execute"), index.h("button", { key: 'ee5d0372d0c46394badfbd93e6f6649df7221ecb', onClick: () => this.noticeWarning(redirect.Notice.delay("This is a test delay notice.", () => new Promise(resolve => window.setTimeout(() => resolve([true, "This went great"]), 3000)))) }, "delay")), index.h("fieldset", { key: 'e5a63d08c9fa051ba0c8365712e1b6ba291864f2' }, index.h("h2", { key: '5e3fc7cf6a2b995269369e7b235db0b271c49e87' }, "Smoothly spinner"), index.h("div", { key: 'a5ab353d1f2481be7e825c51c060793ff5286e2d', style: { width: "fit-content" } }, "Large", index.h("smoothly-spinner", { key: 'bd5d65f076d7fc61999cf3abf560b9071f60cb15', size: "large", style: {
3889
+ ] })), index.h("fieldset", { key: '393f6b45c8bc45dc1cddeec02c24aac06230cb53' }, index.h("h2", { key: '9a5c714f14f433c33e740099765886557b6ce3be' }, "Test of different kinds of notifier"), index.h("button", { key: 'd51beff4cb95a30b38da85ed78fb462891e318f6', onClick: () => this.noticeWarning(redirect.Notice.warn("This is a test warning notice.")) }, "warning"), index.h("button", { key: 'c4dc373da9d151ee072193142a35a6abd7d4e9dd', onClick: () => this.noticeWarning(redirect.Notice.succeeded("This is a test success notice.")) }, "success"), index.h("button", { key: '3244cf32b9f79b4d946902566d7ca22d586bceb4', onClick: () => this.noticeWarning(redirect.Notice.failed("This is a test danger notice.")) }, "danger"), index.h("button", { key: '9d4f44f4bfdbd7777bc8704e469264c0ccbb4592', onClick: () => this.noticeWarning(redirect.Notice.execute("This is a test execute notice.", () => new Promise(resolve => window.setTimeout(() => resolve([true, "This went great"]), 3000)))) }, "execute"), index.h("button", { key: '0e28a01647de5450e3f945da1e7a4cf6232618cd', onClick: () => this.noticeWarning(redirect.Notice.delay("This is a test delay notice.", () => new Promise(resolve => window.setTimeout(() => resolve([true, "This went great"]), 3000)))) }, "delay")), index.h("fieldset", { key: '7392a2b3a129b0d06eace6a4b2f1d101fd2f5cbc' }, index.h("h2", { key: '677cb38a68a02bda1ad5184c822ab50837211481' }, "Smoothly spinner"), index.h("div", { key: 'feca9fa309b2ed6b5dc3ff0f631f479343c80f68', style: { width: "fit-content" } }, "Large", index.h("smoothly-spinner", { key: '12977c80104f2deb49ee424adfc07d4652736284', size: "large", style: {
3884
3890
  "--spinner-background": "200,255,200",
3885
3891
  "--spinner-background-opacity": "0.2",
3886
3892
  "--spinner-color": "0,130,0",
3887
- } })), index.h("div", { key: 'c69aedc3a3b8ad9b06152ce43f4382cf2ddef623', style: { width: "fit-content" } }, "Medium", index.h("smoothly-spinner", { key: '6d1049cbf6ff23acb61f5d54cb9de3f4aeff029d', size: "medium" })), index.h("div", { key: '0846e58331aa79405c9191ddb2b7faa750ef33ae', style: { width: "fit-content" } }, "Small", index.h("smoothly-spinner", { key: '08bba479fcd8be6fde340377c0a659a7d3b1a121', size: "small" })), index.h("div", { key: '7cef575d8cb061c70749cb0c3cde03635f2028e0' }, "Icon sized spinner on button", Scrollable.Color.types.map(color => (index.h("smoothly-button", { size: "icon", color: color, shape: "rounded", onClick: () => {
3893
+ } })), index.h("div", { key: 'b2c8342d2d56fe92cbcf5b009fbae25ed8eb55d6', style: { width: "fit-content" } }, "Medium", index.h("smoothly-spinner", { key: 'd74801142948ed1a9f84f396080abc9852d62785', size: "medium" })), index.h("div", { key: 'a30d593857302fc6624284ddbe44d7721c220113', style: { width: "fit-content" } }, "Small", index.h("smoothly-spinner", { key: '5e3ee46d77b88d6ecd81e36f340b9c561652e515', size: "small" })), index.h("div", { key: 'ccfc1d96cecb1d7f0d69dfd8db9b0b8445dc9a05' }, "Icon sized spinner on button", Scrollable.Color.types.map(color => (index.h("smoothly-button", { size: "icon", color: color, shape: "rounded", onClick: () => {
3888
3894
  this.downloadingSpinner = true;
3889
3895
  setTimeout(() => (this.downloadingSpinner = false), 3000);
3890
- } }, !this.downloadingSpinner && index.h("smoothly-icon", { name: "download-outline" }), this.downloadingSpinner && (index.h("smoothly-spinner", { size: "icon", style: { "--spinner-background-opacity": "0" } })))))), index.h("h3", { key: '07a35ccb69f841cb40122333bdfe1abc1efe18c4' }, "Spinner with overlay"), index.h("div", { key: '5fbcb320946d8fec08458149ebdb47ccc9aa630c', style: { position: "relative", height: "10em" } }, "Large Overlay Spinner", index.h("smoothly-spinner", { key: 'fd9acb9a5bb12ec0041a08f9a7a4257ded496bc8', overlay: true, size: "large", style: {
3896
+ } }, !this.downloadingSpinner && index.h("smoothly-icon", { name: "download-outline" }), this.downloadingSpinner && (index.h("smoothly-spinner", { size: "icon", style: { "--spinner-background-opacity": "0" } })))))), index.h("h3", { key: '6ab29d607099b5d52f0814af7ed4bd874333d5aa' }, "Spinner with overlay"), index.h("div", { key: 'c3be578d6f72d9c68486713e169e54bc35fb6686', style: { position: "relative", height: "10em" } }, "Large Overlay Spinner", index.h("smoothly-spinner", { key: '250c12f2ef7d820475b6205e712a7d4e1aea0581', overlay: true, size: "large", style: {
3891
3897
  "--spinner-background": "255,200,255",
3892
3898
  "--spinner-background-opacity": "0.5",
3893
3899
  "--spinner-color": "0,130,0",
3894
- } })), index.h("div", { key: '858037c3dc104bef8b7b16eb418b4d1fa67170f6', style: { position: "relative", height: "10em" } }, "Medium Overlay Spinner", index.h("smoothly-spinner", { key: '93ba7062b31cf94f0b10d7a00025db080b6092ce', overlay: true, color: "secondary", size: "medium" })), index.h("div", { key: '507bdbd9303934e19ae2737e9f779c1af9b9f51b', style: { position: "relative", height: "10em" } }, "Small Overlay Spinner", index.h("smoothly-spinner", { key: '29eab4404c1486e0e639b1b35664b663ed514dae', overlay: true, size: "small" }))), index.h("fieldset", { key: '13c77980b44a49e370dc2c53ff2abf005b02e26e' }, index.h("h2", { key: '28bc4f36494dd133d49ead798fa35e7201c2c9bb' }, "Smoothly summary"), index.h("smoothly-summary", { key: 'cfcb5e6e539e465d501e8513dbe2c97bff51b182' }, index.h("p", { key: '66a83893a90fb3c07ec48d81d0fc792e78ef2c88', slot: "summary" }, "Some title"), index.h("p", { key: '9e9e8969fb180badabca40f5cfbe886b1a06dd9c', slot: "content" }, "Some content")), index.h("smoothly-summary", { key: '75d56b87cdbb57f4ae2efded1fd55bd7030b737a', size: "large" }, index.h("p", { key: '5a4ea8bbd79ace35331a60313a5726ba81e0ed4a', slot: "summary" }, "Some title"), index.h("p", { key: '3e079e8f5e627e9248d2c6c297b2e7320d9edb56', slot: "content" }, "Some content")), index.h("smoothly-summary", { key: '397ef2e4ef50dafc4c6f9b11ee4127fd9c6c4690', color: "danger", fill: "clear" }, index.h("div", { key: '2dbb6179676804c2fedfdbd981574586361ee4bf', slot: "summary", style: { display: "flex", gap: "0.3rem" } }, index.h("span", { key: 'fbe1a347f5fef147cf93a29a460852c38c79ebd5' }, "Person"), index.h("smoothly-icon", { key: '5d3b9bff5d1d788ac6c74de9ab08aaaba8672e9a', name: "person", color: "light", fill: "clear", size: "tiny" })), index.h("p", { key: '71d4fbebf7eda2d158f583e5217eb723e0a86131', slot: "content" }, "Some person information.")), index.h("smoothly-summary", { key: 'a8b48edc40de316c09cef79d8aa8ece3b7afd011', color: "danger", fill: "clear", open: true }, index.h("p", { key: '25407c2aa319fa0d9da0ed18867e74238dacf50c', slot: "summary" }, "Some other title"), index.h("p", { key: 'ba29da74382114c1c157c1073380cbd76fcff742', slot: "content" }, "A lot more content, yes please. A lot more content, yes please. A lot more content, yes please. A lot more content, yes please. A lot more content, yes please.A lot more content, yes please. A lot more content, yes please. A lot more content, yes please. A lot more content, yes please.")), index.h("h2", { key: '39f96c186d601ba2d00c2615b10dfe77f6cf46a4' }, "Label"), labels.map(l => (index.h("smoothly-label", { hue: l.hue, description: l.description, shape: "rectangle" }, l.name))), index.h("smoothly-label", { key: '9af567fc9f112cfc4694827752bd65a231892f8c', color: "primary", description: "Using colors", shape: "rectangle" }, "Primary"))),
3900
+ } })), index.h("div", { key: '6f73e8dd28efa4d12903dd710fe2940f95fc2777', style: { position: "relative", height: "10em" } }, "Medium Overlay Spinner", index.h("smoothly-spinner", { key: 'eb7cd93a1107a3b332deba784c248e14bb733d52', overlay: true, color: "secondary", size: "medium" })), index.h("div", { key: '98e4c675a13f2d6509180546ec8aaf907f2fbf33', style: { position: "relative", height: "10em" } }, "Small Overlay Spinner", index.h("smoothly-spinner", { key: '7f2c9b9757b84bcf8db81d2d806c91c7a98b3cc1', overlay: true, size: "small" }))), index.h("fieldset", { key: '578b058ee4690857b3515e1c2296c6440e91b703' }, index.h("h2", { key: '7bb174dfc72444554375b6b47459f5019bd130a1' }, "Smoothly summary"), index.h("smoothly-summary", { key: '0c68ec73e784689353c6c532b3ca2b1d410b98ab' }, index.h("p", { key: 'bfb5aa482d17553212b9c85707173aea3f637feb', slot: "summary" }, "Some title"), index.h("p", { key: '1892b2651a47f0ed653d7162644aa32b8f09711d', slot: "content" }, "Some content")), index.h("smoothly-summary", { key: 'cc74ca77a9554d5c70e5cf42f3128afcb22c03a6', size: "large" }, index.h("p", { key: '6d15505296c1861c2b4862cfa1fc832a9ed8bacb', slot: "summary" }, "Some title"), index.h("p", { key: 'a280d03667de795224971f994bfa73e005b6f6ac', slot: "content" }, "Some content")), index.h("smoothly-summary", { key: '4fa2131e8bcb195e7e66afe9cef21d4006cae169', color: "danger", fill: "clear" }, index.h("div", { key: 'ae7c5e9b5c4aa915ae78b1626db62d8b701cde75', slot: "summary", style: { display: "flex", gap: "0.3rem" } }, index.h("span", { key: '622c3667246779558feb3de07abb29dc83afbcd0' }, "Person"), index.h("smoothly-icon", { key: '95ecff619b7ccfa363800791cfcb4e9f7748f5b8', name: "person", color: "light", fill: "clear", size: "tiny" })), index.h("p", { key: 'e8cdfc372f68dbd7d1d04abe20e3744bfec51820', slot: "content" }, "Some person information.")), index.h("smoothly-summary", { key: '6bc59ec419d844418476576813ff65a0d74f73ac', color: "danger", fill: "clear", open: true }, index.h("p", { key: 'c5a748de209024c344bc90def813852871870b5b', slot: "summary" }, "Some other title"), index.h("p", { key: 'a7c767bff5806090c0ea09f32b31ae01df60d8fd', slot: "content" }, "A lot more content, yes please. A lot more content, yes please. A lot more content, yes please. A lot more content, yes please. A lot more content, yes please.A lot more content, yes please. A lot more content, yes please. A lot more content, yes please. A lot more content, yes please.")), index.h("h2", { key: '2543a49bd5e55d2b0a9d9fa4ad258baf0751125f' }, "Label"), labels.map(l => (index.h("smoothly-label", { hue: l.hue, description: l.description, shape: "rectangle" }, l.name))), index.h("smoothly-label", { key: 'f7e3385b40c099a5610b90c6e309b501e43d9bd1', color: "primary", description: "Using colors", shape: "rectangle" }, "Primary"))),
3895
3901
  ];
3896
3902
  }
3897
3903
  };
@@ -3918,7 +3924,7 @@ const SmoothlyDisplayDemoJson = class {
3918
3924
  index.registerInstance(this, hostRef);
3919
3925
  }
3920
3926
  render() {
3921
- return (index.h(index.Host, { key: 'e2ff443448cb73a0bea3d0b8e9605267d05a4b7a' }, [0, 1, 3, undefined].map(colapseDepth => [
3927
+ return (index.h(index.Host, { key: '47b2d50e314a8a014996083c7cb374c5f6720d15' }, [0, 1, 3, undefined].map(colapseDepth => [
3922
3928
  index.h("div", null, "collapseDepth=", colapseDepth !== null && colapseDepth !== void 0 ? colapseDepth : "undefined"),
3923
3929
  index.h("div", null, index.h("smoothly-display", { type: "json", value: json, collapseDepth: colapseDepth })),
3924
3930
  ])));
@@ -3943,8 +3949,8 @@ const JsonValue = ({ value, collapseDepth }) => {
3943
3949
  return Scrollable.object().is(value) || Array.isArray(value) ? (index.h("smoothly-display-json-object", { value: value, collapseDepth: collapseDepth })) : (index.h("smoothly-display-json-primitive", { value: value }));
3944
3950
  };
3945
3951
 
3946
- const styleCss$1i = ".sc-smoothly-display-json-h{font-family:monospace}";
3947
- const SmoothlyDisplayJsonStyle0 = styleCss$1i;
3952
+ const styleCss$1j = ".sc-smoothly-display-json-h{font-family:monospace}";
3953
+ const SmoothlyDisplayJsonStyle0 = styleCss$1j;
3948
3954
 
3949
3955
  const SmoothlyDisplayJson = class {
3950
3956
  constructor(hostRef) {
@@ -3953,13 +3959,13 @@ const SmoothlyDisplayJson = class {
3953
3959
  this.collapseDepth = undefined;
3954
3960
  }
3955
3961
  render() {
3956
- return index.h(JsonValue, { key: '5901dea5e79a06c0de84963d10a9b7b44e76dd55', value: this.value, collapseDepth: this.collapseDepth });
3962
+ return index.h(JsonValue, { key: '2de1ab30b99f654340413c94d770bc83e0dacda0', value: this.value, collapseDepth: this.collapseDepth });
3957
3963
  }
3958
3964
  };
3959
3965
  SmoothlyDisplayJson.style = SmoothlyDisplayJsonStyle0;
3960
3966
 
3961
- const styleCss$1h = ".sc-smoothly-display-json-object-h{font-family:monospace;position:relative}[hidden].sc-smoothly-display-json-object-h{display:none}.indent.sc-smoothly-display-json-object{padding-left:1rem;border-left:1px solid rgb(var(--smoothly-light-shade))}.sc-smoothly-display-json-object-h:not(.open) .content.sc-smoothly-display-json-object{display:none}.sc-smoothly-display-json-object-h>.content.sc-smoothly-display-json-object>.indent.sc-smoothly-display-json-object:last-child>.comma.sc-smoothly-display-json-object{display:none}.open-bracket.sc-smoothly-display-json-object::after{background-color:rgb(var(--smoothly-light-color));color:rgb(var(--smoothly-light-shade));white-space:pre;border-radius:0.25rem;font-weight:bold;font-size:0.8em}.sc-smoothly-display-json-object-h:not(.open):not(.empty)>.open-bracket.sc-smoothly-display-json-object::after{content:\" ▶ \" attr(data-length) \" ◀ \"}.open.sc-smoothly-display-json-object-h:not(.empty)>.open-bracket.sc-smoothly-display-json-object::after{content:\" ▼ \"}";
3962
- const SmoothlyDisplayJsonObjectStyle0 = styleCss$1h;
3967
+ const styleCss$1i = ".sc-smoothly-display-json-object-h{font-family:monospace;position:relative}[hidden].sc-smoothly-display-json-object-h{display:none}.indent.sc-smoothly-display-json-object{padding-left:1rem;border-left:1px solid rgb(var(--smoothly-light-shade))}.sc-smoothly-display-json-object-h:not(.open) .content.sc-smoothly-display-json-object{display:none}.sc-smoothly-display-json-object-h>.content.sc-smoothly-display-json-object>.indent.sc-smoothly-display-json-object:last-child>.comma.sc-smoothly-display-json-object{display:none}.open-bracket.sc-smoothly-display-json-object::after{background-color:rgb(var(--smoothly-light-color));color:rgb(var(--smoothly-light-shade));white-space:pre;border-radius:0.25rem;font-weight:bold;font-size:0.8em}.sc-smoothly-display-json-object-h:not(.open):not(.empty)>.open-bracket.sc-smoothly-display-json-object::after{content:\" ▶ \" attr(data-length) \" ◀ \"}.open.sc-smoothly-display-json-object-h:not(.empty)>.open-bracket.sc-smoothly-display-json-object::after{content:\" ▼ \"}";
3968
+ const SmoothlyDisplayJsonObjectStyle0 = styleCss$1i;
3963
3969
 
3964
3970
  const SmoothlyDisplayJsonObject = class {
3965
3971
  constructor(hostRef) {
@@ -3987,15 +3993,15 @@ const SmoothlyDisplayJsonObject = class {
3987
3993
  }
3988
3994
  render() {
3989
3995
  const nextCollapseDepth = typeof this.collapseDepth == "number" ? Math.max(this.collapseDepth - 1, 0) : undefined;
3990
- return (index.h(index.Host, { key: 'd4b518cb0ed73061381c263aa1ce70b036c5a169', class: { empty: this.empty, open: this.open } }, index.h("span", { key: 'd3d5aa239a41aba16db7eb1aa2bf1cb3db67c30c', class: "open-bracket", onClick: () => (this.open = !this.open), "data-length": this.length }, this.openBracket), index.h("span", { key: 'fa1efeaabbd3501a6351f82b966f0c326e613f84', class: "content" }, Array.isArray(this.value)
3996
+ return (index.h(index.Host, { key: '6f80167fe29f5e9f5cce053aed85f7004b657c10', class: { empty: this.empty, open: this.open } }, index.h("span", { key: '4ca590eedfab5fc6582fc5edc9c4cc1c7c1d6666', class: "open-bracket", onClick: () => (this.open = !this.open), "data-length": this.length }, this.openBracket), index.h("span", { key: '58a1e870beb473b7659dc8b5835366719f5e84ce', class: "content" }, Array.isArray(this.value)
3991
3997
  ? this.value.map(v => (index.h("div", { class: "indent" }, index.h(JsonValue, { value: v, collapseDepth: nextCollapseDepth }), index.h("span", { class: "comma" }, ","))))
3992
- : Object.entries(this.value).map(([k, v]) => (index.h("div", { class: "indent" }, index.h("smoothly-display-json-record-key", { value: k }), ":", " ", index.h(JsonValue, { value: v, collapseDepth: nextCollapseDepth }), index.h("span", { class: "comma" }, ","))))), index.h("span", { key: '44380da90e2071bc30146c06ee19d89ab97e734b' }, this.closeBracket)));
3998
+ : Object.entries(this.value).map(([k, v]) => (index.h("div", { class: "indent" }, index.h("smoothly-display-json-record-key", { value: k }), ":", " ", index.h(JsonValue, { value: v, collapseDepth: nextCollapseDepth }), index.h("span", { class: "comma" }, ","))))), index.h("span", { key: 'a574be7feeee9f2995dcf2a15f03c21252cc4efe' }, this.closeBracket)));
3993
3999
  }
3994
4000
  };
3995
4001
  SmoothlyDisplayJsonObject.style = SmoothlyDisplayJsonObjectStyle0;
3996
4002
 
3997
- const styleCss$1g = ".sc-smoothly-display-json-primitive-h{font-family:monospace;display:inline;word-wrap:anywhere}[hidden].sc-smoothly-display-json-primitive-h{display:none}.string.sc-smoothly-display-json-primitive-h,.number.sc-smoothly-display-json-primitive-h,.boolean.sc-smoothly-display-json-primitive-h{font-weight:bold}.string.sc-smoothly-display-json-primitive-h{color:rgb(var(--smoothly-primary-color))}.number.sc-smoothly-display-json-primitive-h{color:rgb(var(--smoothly-secondary-color))}.boolean.sc-smoothly-display-json-primitive-h{color:rgb(var(--smoothly-tertiary-color))}.null.sc-smoothly-display-json-primitive-h,.undefined.sc-smoothly-display-json-primitive-h{color:rgb(var(--smoothly-medium-color))}";
3998
- const SmoothlyDisplayJsonPrimitiveStyle0 = styleCss$1g;
4003
+ const styleCss$1h = ".sc-smoothly-display-json-primitive-h{font-family:monospace;display:inline;word-wrap:anywhere}[hidden].sc-smoothly-display-json-primitive-h{display:none}.string.sc-smoothly-display-json-primitive-h,.number.sc-smoothly-display-json-primitive-h,.boolean.sc-smoothly-display-json-primitive-h{font-weight:bold}.string.sc-smoothly-display-json-primitive-h{color:rgb(var(--smoothly-primary-color))}.number.sc-smoothly-display-json-primitive-h{color:rgb(var(--smoothly-secondary-color))}.boolean.sc-smoothly-display-json-primitive-h{color:rgb(var(--smoothly-tertiary-color))}.null.sc-smoothly-display-json-primitive-h,.undefined.sc-smoothly-display-json-primitive-h{color:rgb(var(--smoothly-medium-color))}";
4004
+ const SmoothlyDisplayJsonPrimitiveStyle0 = styleCss$1h;
3999
4005
 
4000
4006
  const SmoothlyDisplayJsonPrimitive = class {
4001
4007
  constructor(hostRef) {
@@ -4003,13 +4009,13 @@ const SmoothlyDisplayJsonPrimitive = class {
4003
4009
  this.value = undefined;
4004
4010
  }
4005
4011
  render() {
4006
- return index.h(index.Host, { key: '60c85f55a13c6af67d6d68e8f5ca14a50f188d78', class: this.value == null ? "null" : typeof this.value }, "" + JSON.stringify(this.value));
4012
+ return index.h(index.Host, { key: '715afdf74552ced18f93c08ebc7118e146e34ab3', class: this.value == null ? "null" : typeof this.value }, "" + JSON.stringify(this.value));
4007
4013
  }
4008
4014
  };
4009
4015
  SmoothlyDisplayJsonPrimitive.style = SmoothlyDisplayJsonPrimitiveStyle0;
4010
4016
 
4011
- const styleCss$1f = ".sc-smoothly-display-json-record-key-h{font-family:monospace;display:inline;color:rgb(var(--smoothly-default-contrast))}[hidden].sc-smoothly-display-json-record-key-h{display:none}";
4012
- const SmoothlyDisplayJsonRecordKeyStyle0 = styleCss$1f;
4017
+ const styleCss$1g = ".sc-smoothly-display-json-record-key-h{font-family:monospace;display:inline;color:rgb(var(--smoothly-default-contrast))}[hidden].sc-smoothly-display-json-record-key-h{display:none}";
4018
+ const SmoothlyDisplayJsonRecordKeyStyle0 = styleCss$1g;
4013
4019
 
4014
4020
  const SmoothlyDisplayJsonRecordKey = class {
4015
4021
  constructor(hostRef) {
@@ -4017,7 +4023,7 @@ const SmoothlyDisplayJsonRecordKey = class {
4017
4023
  this.value = undefined;
4018
4024
  }
4019
4025
  render() {
4020
- return index.h(index.Host, { key: '312d806be76eb6dfad9bf4190c4816b9f7c763d4' }, "\"", this.value, "\"");
4026
+ return index.h(index.Host, { key: '77c1e22f681a110773bad450f94ee9bb9199054f' }, "\"", this.value, "\"");
4021
4027
  }
4022
4028
  };
4023
4029
  SmoothlyDisplayJsonRecordKey.style = SmoothlyDisplayJsonRecordKeyStyle0;
@@ -7006,8 +7012,8 @@ var Filter;
7006
7012
  });
7007
7013
  })(Filter || (Filter = {}));
7008
7014
 
7009
- const styleCss$1e = ".sc-smoothly-filter-h {\n\tposition: relative;\n\tborder: 1px solid rgb(var(--smoothly-medium-tint));\n\tmargin-left: 1rem;\n\tbackground-color: rgb(var(--smoothly-input-background));\n\tmargin-right: 1rem;\n\tdisplay: flex;\n\tflex-direction: row;\n\talign-items: center;\n}\n\n.sc-smoothly-filter-h>div.sc-smoothly-filter-s > [slot=detail] {\n\tz-index: 5;\n}\n\n.sc-smoothly-filter-h.sc-smoothly-filter-s > [slot=bar] {\n\tpointer-events: auto;\n\tmargin-left: 0.3em;\n\tmargin-right: 0.3em;\n\n\t&>[looks=\"plain\"] {\n\t\tdisplay: flex;\n\t\talign-self: stretch;\n\t\talign-items: center;\n\t}\n}\n\n.sc-smoothly-filter-h > div.sc-smoothly-filter:empty + smoothly-icon.sc-smoothly-filter {\n\tdisplay: none;\n}\n\n.sc-smoothly-filter-h > smoothly-icon.sc-smoothly-filter {\n\tcursor: pointer;\n\tmargin-left: 0.3em;\n\tmargin-right: 0.3em;\n\tflex-shrink: 0;\n}\n\n.sc-smoothly-filter-h > div.close.sc-smoothly-filter {\n\tposition: fixed;\n\tz-index: 3;\n\ttop: 0;\n\tleft: 0;\n\twidth: 100dvw;\n\theight: 100dvh;\n\tbackground: transparent;\n}\n\n.sc-smoothly-filter-h > div.hidden.sc-smoothly-filter {\n\tdisplay: none;\n}\n\n.sc-smoothly-filter-h > .container.sc-smoothly-filter {\n\tpadding: 2em;\n\tposition: absolute;\n\tright: 0.35em;\n\twidth: fit-content;\n\tdisplay: flex;\n\tjustify-content: center;\n\ttop: 100%;\n\twidth: fit-content;\n\tz-index: 4;\n\tbackground-color: rgb(var(--smoothly-color));\n\tmargin: 0.8em -2em;\n}\n\n\n.sc-smoothly-filter-h > div.container.sc-smoothly-filter:before {\n\tcontent: \"\";\n\twidth: 0.6em;\n\theight: 0.6em;\n\ttransform: rotate(45deg);\n\tborder-top: 1px solid rgb(var(--smoothly-medium-tint));\n\tborder-left: 1px solid rgb(var(--smoothly-medium-tint));\n\tbackground-color: rgb(var(--smoothly-color));\n\tposition: absolute;\n\tz-index: 3;\n}\n\n\n.sc-smoothly-filter-h > div.container.arrow-top.sc-smoothly-filter:before {\n\tleft: calc(91%);\n\ttop: -5px;\n}\n\n.sc-smoothly-filter-h div.container.sc-smoothly-filter:after {\n\tcontent: \"\";\n\theight: 100%;\n\twidth: 100%;\n\tborder: 1px solid rgb(var(--smoothly-medium-tint));\n\tborder-radius: 0.25em;\n\tposition: absolute;\n\ttop: 0;\n\tleft: 0;\n}";
7010
- const SmoothlyFilterStyle0 = styleCss$1e;
7015
+ const styleCss$1f = ".sc-smoothly-filter-h {\n\tposition: relative;\n\tborder: 1px solid rgb(var(--smoothly-medium-tint));\n\tmargin-left: 1rem;\n\tbackground-color: rgb(var(--smoothly-input-background));\n\tmargin-right: 1rem;\n\tdisplay: flex;\n\tflex-direction: row;\n\talign-items: center;\n}\n\n.sc-smoothly-filter-h>div.sc-smoothly-filter-s > [slot=detail] {\n\tz-index: 5;\n}\n\n.sc-smoothly-filter-h.sc-smoothly-filter-s > [slot=bar] {\n\tpointer-events: auto;\n\tmargin-left: 0.3em;\n\tmargin-right: 0.3em;\n\n\t&>[looks=\"plain\"] {\n\t\tdisplay: flex;\n\t\talign-self: stretch;\n\t\talign-items: center;\n\t}\n}\n\n.sc-smoothly-filter-h > div.sc-smoothly-filter:empty + smoothly-icon.sc-smoothly-filter {\n\tdisplay: none;\n}\n\n.sc-smoothly-filter-h > smoothly-icon.sc-smoothly-filter {\n\tcursor: pointer;\n\tmargin-left: 0.3em;\n\tmargin-right: 0.3em;\n\tflex-shrink: 0;\n}\n\n.sc-smoothly-filter-h > div.close.sc-smoothly-filter {\n\tposition: fixed;\n\tz-index: 3;\n\ttop: 0;\n\tleft: 0;\n\twidth: 100dvw;\n\theight: 100dvh;\n\tbackground: transparent;\n}\n\n.sc-smoothly-filter-h > div.hidden.sc-smoothly-filter {\n\tdisplay: none;\n}\n\n.sc-smoothly-filter-h > .container.sc-smoothly-filter {\n\tpadding: 2em;\n\tposition: absolute;\n\tright: 0.35em;\n\twidth: fit-content;\n\tdisplay: flex;\n\tjustify-content: center;\n\ttop: 100%;\n\twidth: fit-content;\n\tz-index: 4;\n\tbackground-color: rgb(var(--smoothly-color));\n\tmargin: 0.8em -2em;\n}\n\n\n.sc-smoothly-filter-h > div.container.sc-smoothly-filter:before {\n\tcontent: \"\";\n\twidth: 0.6em;\n\theight: 0.6em;\n\ttransform: rotate(45deg);\n\tborder-top: 1px solid rgb(var(--smoothly-medium-tint));\n\tborder-left: 1px solid rgb(var(--smoothly-medium-tint));\n\tbackground-color: rgb(var(--smoothly-color));\n\tposition: absolute;\n\tz-index: 3;\n}\n\n\n.sc-smoothly-filter-h > div.container.arrow-top.sc-smoothly-filter:before {\n\tleft: calc(91%);\n\ttop: -5px;\n}\n\n.sc-smoothly-filter-h div.container.sc-smoothly-filter:after {\n\tcontent: \"\";\n\theight: 100%;\n\twidth: 100%;\n\tborder: 1px solid rgb(var(--smoothly-medium-tint));\n\tborder-radius: 0.25em;\n\tposition: absolute;\n\ttop: 0;\n\tleft: 0;\n}";
7016
+ const SmoothlyFilterStyle0 = styleCss$1f;
7011
7017
 
7012
7018
  const SmoothlyFilter = class {
7013
7019
  constructor(hostRef) {
@@ -7046,17 +7052,17 @@ const SmoothlyFilter = class {
7046
7052
  this.filters.forEach(update => update(this.criteria));
7047
7053
  }
7048
7054
  render() {
7049
- return (index.h(index.Host, { key: '8d508a972373e320e8c176529e4e96c44e98ef02' }, index.h("slot", { key: '8c6c5cfe4a9f15a933b923b2238fae2325e1e9f8', name: "bar" }), index.h("smoothly-filter-field", { key: '23b25507f9bd5b7ca557491b6b27a99d3aa28942', criteria: this.criteria, ref: e => (this.field = e) }), this.criteria.toString() != "" && (index.h("smoothly-icon", { key: 'dd857c516c6fa74d93d58152aac2791d9e83c650', name: "close", toolTip: "Clear all filters", size: "small", onClick: () => {
7055
+ return (index.h(index.Host, { key: '3754a76da51207f0083f1c434f8988e0035470f2' }, index.h("slot", { key: 'b80c020ef2cdd6158dafcf348865e41010f6ee33', name: "bar" }), index.h("smoothly-filter-field", { key: '6e0a90aa767fe4691b6d266420596c6c2f741e37', criteria: this.criteria, ref: e => (this.field = e) }), this.criteria.toString() != "" && (index.h("smoothly-icon", { key: '62f58d470f598bb433fbdf7ca54fab5d9e52505f', name: "close", toolTip: "Clear all filters", size: "small", onClick: () => {
7050
7056
  this.clear();
7051
- } })), index.h("div", { key: '47fd4b90b77237cc99131f6e6ee76d066ebc4bff', class: this.expanded ? "container arrow-top" : "hidden" }, index.h("slot", { key: '3900c4604b1dd8684c7f5f0060dc70d49d9d2f9f', name: "detail" })), index.h("smoothly-icon", { key: 'e516c6c71b87ca93b155cbf778a7cef79b590e2d', name: this.expanded ? "options" : "options-outline", toolTip: (this.expanded ? "Hide" : "Show") + " additional filters", size: "small", onClick: () => {
7057
+ } })), index.h("div", { key: '7fa7844e45a4290ee7fbb1a8aeb7b113d97dbde2', class: this.expanded ? "container arrow-top" : "hidden" }, index.h("slot", { key: '8ada24b23feafab59eb3bea282680adca784c88b', name: "detail" })), index.h("smoothly-icon", { key: '6daf693884fdb02bc84bcf59ddbd07c7613028aa', name: this.expanded ? "options" : "options-outline", toolTip: (this.expanded ? "Hide" : "Show") + " additional filters", size: "small", onClick: () => {
7052
7058
  this.expanded = !this.expanded;
7053
- } }), index.h("div", { key: '301873500cf475507be2b3a7cbe5bbc07e69f38b', class: this.expanded ? "close" : "hidden", onClick: () => (this.expanded = !this.expanded) })));
7059
+ } }), index.h("div", { key: '32a3e3a7da81f88cdecbc49478234c638b4e80c5', class: this.expanded ? "close" : "hidden", onClick: () => (this.expanded = !this.expanded) })));
7054
7060
  }
7055
7061
  };
7056
7062
  SmoothlyFilter.style = SmoothlyFilterStyle0;
7057
7063
 
7058
- const styleCss$1d = ".sc-smoothly-filter-field-h{flex-grow:5}";
7059
- const SmoothlyFilterFieldStyle0 = styleCss$1d;
7064
+ const styleCss$1e = ".sc-smoothly-filter-field-h{flex-grow:5}";
7065
+ const SmoothlyFilterFieldStyle0 = styleCss$1e;
7060
7066
 
7061
7067
  const SmoothlyFilterField = class {
7062
7068
  constructor(hostRef) {
@@ -7073,7 +7079,7 @@ const SmoothlyFilterField = class {
7073
7079
  this.smoothlyFilterField.emit(parse$2((_b = (_a = this.input) === null || _a === void 0 ? void 0 : _a.value) !== null && _b !== void 0 ? _b : ""));
7074
7080
  }
7075
7081
  render() {
7076
- return (index.h(index.Host, { key: '2633f0911b393af632de050a1dcc1415564eff38', onKeyDown: (e) => e.key == "Enter" && this.filterFieldEmit() }, index.h("smoothly-input", { key: 'de303c1e68d0b27578ff1005f794c268c747b085', name: "filter", ref: e => (this.input = e), value: this.criteria.toString(), onSmoothlyInputLooks: e => e.stopPropagation(), onSmoothlyBlur: e => {
7082
+ return (index.h(index.Host, { key: 'c7980e675d10a13d599be6e9117558311b9def83', onKeyDown: (e) => e.key == "Enter" && this.filterFieldEmit() }, index.h("smoothly-input", { key: '1f99654cce7732353df4a32139e8cea7ced6cc21', name: "filter", ref: e => (this.input = e), value: this.criteria.toString(), onSmoothlyInputLooks: e => e.stopPropagation(), onSmoothlyBlur: e => {
7077
7083
  e.stopPropagation();
7078
7084
  this.filterFieldEmit();
7079
7085
  }, onSmoothlyFormDisable: e => e.stopPropagation(), onSmoothlyInputLoad: e => e.stopPropagation(), onSmoothlyChange: e => e.stopPropagation(), onSmoothlyInput: e => {
@@ -7083,8 +7089,8 @@ const SmoothlyFilterField = class {
7083
7089
  };
7084
7090
  SmoothlyFilterField.style = SmoothlyFilterFieldStyle0;
7085
7091
 
7086
- const styleCss$1c = ".sc-smoothly-filter-input-h{display:contents}.sc-smoothly-filter-input-h>smoothly-input.sc-smoothly-filter-input{flex-grow:1;min-width:10em;flex-basis:40%}";
7087
- const SmoothlyFilterInputStyle0 = styleCss$1c;
7092
+ const styleCss$1d = ".sc-smoothly-filter-input-h{display:contents}.sc-smoothly-filter-input-h>smoothly-input.sc-smoothly-filter-input{flex-grow:1;min-width:10em;flex-basis:40%}";
7093
+ const SmoothlyFilterInputStyle0 = styleCss$1d;
7088
7094
 
7089
7095
  const SmoothlyFilterInput = class {
7090
7096
  constructor(hostRef) {
@@ -7152,13 +7158,13 @@ const SmoothlyFilterInput = class {
7152
7158
  (rest.length == 0 || (!!criteria.criteria && this.findInstanceOf(criteria.criteria, rest.join(".")))));
7153
7159
  }
7154
7160
  render() {
7155
- return (index.h("smoothly-input", { key: 'bf48d8851eee96f60aac0a53887ed69c74215a9e', name: this.property, value: this.needle, type: this.type, placeholder: this.placeholder, onSmoothlyBlur: e => e.stopPropagation(), onSmoothlyFormDisable: e => e.stopPropagation(), onSmoothlyInputLoad: e => e.stopPropagation(), onSmoothlyChange: e => e.stopPropagation(), onSmoothlyInput: e => this.inputHandler(e) }, this.label, index.h("slot", { key: 'a9cf8cfc974ae9008e682bcb8ce1328abf4681d5' })));
7161
+ return (index.h("smoothly-input", { key: '4187159fd95484dda23ff00224d2804bcee0880b', name: this.property, value: this.needle, type: this.type, placeholder: this.placeholder, onSmoothlyBlur: e => e.stopPropagation(), onSmoothlyFormDisable: e => e.stopPropagation(), onSmoothlyInputLoad: e => e.stopPropagation(), onSmoothlyChange: e => e.stopPropagation(), onSmoothlyInput: e => this.inputHandler(e) }, this.label, index.h("slot", { key: '962175017c27931cbdcae9599d37682c6cb048fa' })));
7156
7162
  }
7157
7163
  };
7158
7164
  SmoothlyFilterInput.style = SmoothlyFilterInputStyle0;
7159
7165
 
7160
- const styleCss$1b = ".sc-smoothly-filter-select-h{display:contents}.sc-smoothly-filter-select-h>smoothly-input-select.sc-smoothly-filter-select{flex-grow:1;width:12.5em}.options.sc-smoothly-filter-select{border:rgb(var(--smoothly-input-border, var(--smoothly-color-contrast))) solid 1px;border-top:rgba(var(--smoothly-input-border, var(--smoothly-color-contrast)), .4) solid 1px}";
7161
- const SmoothlyFilterSelectStyle0 = styleCss$1b;
7166
+ const styleCss$1c = ".sc-smoothly-filter-select-h{display:contents}.sc-smoothly-filter-select-h>smoothly-input-select.sc-smoothly-filter-select{flex-grow:1;width:12.5em}.options.sc-smoothly-filter-select{border:rgb(var(--smoothly-input-border, var(--smoothly-color-contrast))) solid 1px;border-top:rgba(var(--smoothly-input-border, var(--smoothly-color-contrast)), .4) solid 1px}";
7167
+ const SmoothlyFilterSelectStyle0 = styleCss$1c;
7162
7168
 
7163
7169
  const SmoothlyFilterSelect = class {
7164
7170
  constructor(hostRef) {
@@ -7261,14 +7267,14 @@ const SmoothlyFilterSelect = class {
7261
7267
  return result && this.property.split(".").reduceRight((r, e) => property(e, r), result);
7262
7268
  }
7263
7269
  render() {
7264
- return (index.h("smoothly-input-select", { key: '8c8521687fa9e4f676a2b5ec178e2ec8cecaeda4', ref: e => (this.selectElement = e), name: this.property, looks: this.looks, multiple: this.multiple, menuHeight: this.menuHeight, onSmoothlyInputLooks: e => e.stopPropagation(), onSmoothlyItemSelect: e => e.stopPropagation(), onSmoothlyInput: e => this.selectHandler(e) }, this.label && (index.h("span", { key: 'cdaaaeec31f18cc52729a570a41c3140cf23c8fc', slot: "label" }, [this.label.slice(0, 1).toUpperCase(), this.label.slice(1, this.label.length)].join(""))), index.h("slot", { key: 'a4e37edbc53abe52fef8530fbe18d3bfbecf4e6c', name: "items" })));
7270
+ return (index.h("smoothly-input-select", { key: 'ec623ee8b6a2e2fb107efe27039990dd6c53be3f', ref: e => (this.selectElement = e), name: this.property, looks: this.looks, multiple: this.multiple, menuHeight: this.menuHeight, onSmoothlyInputLooks: e => e.stopPropagation(), onSmoothlyItemSelect: e => e.stopPropagation(), onSmoothlyInput: e => this.selectHandler(e) }, this.label && (index.h("span", { key: '95e15be5bdd76d12bd19f2762d319b1ebc8edae9', slot: "label" }, [this.label.slice(0, 1).toUpperCase(), this.label.slice(1, this.label.length)].join(""))), index.h("slot", { key: '8ea0afb0352974f405895bb6c5514c3835af718c', name: "items" })));
7265
7271
  }
7266
7272
  get element() { return index.getElement(this); }
7267
7273
  };
7268
7274
  SmoothlyFilterSelect.style = SmoothlyFilterSelectStyle0;
7269
7275
 
7270
- const styleCss$1a = ".sc-smoothly-filter-toggle-h{position:relative;display:inline-block;cursor:pointer}.sc-smoothly-filter-toggle-h:hover>smoothly-icon.sc-smoothly-filter-toggle{stroke:rgb(var(--smoothly-success-tint));color:rgb(var(--smoothly-success-tint));fill:rgb(var(--smoothly-success-tint))}[flip].sc-smoothly-filter-toggle-h{transform:scaleX(-1)}";
7271
- const SmoothlyFilterToggleStyle0 = styleCss$1a;
7276
+ const styleCss$1b = ".sc-smoothly-filter-toggle-h{position:relative;display:inline-block;cursor:pointer}.sc-smoothly-filter-toggle-h:hover>smoothly-icon.sc-smoothly-filter-toggle{stroke:rgb(var(--smoothly-success-tint));color:rgb(var(--smoothly-success-tint));fill:rgb(var(--smoothly-success-tint))}[flip].sc-smoothly-filter-toggle-h{transform:scaleX(-1)}";
7277
+ const SmoothlyFilterToggleStyle0 = styleCss$1b;
7272
7278
 
7273
7279
  const SmoothlyFilterToggle = class {
7274
7280
  constructor(hostRef) {
@@ -7345,7 +7351,7 @@ const SmoothlyFilterToggle = class {
7345
7351
  (rest.length == 0 || (!!check.criteria && this.findInstanceOf(check.criteria, rest.join(".")))));
7346
7352
  }
7347
7353
  render() {
7348
- return (index.h("smoothly-icon", { key: '0d4679c2a62356f5fa7b537073553a2a04d022c7', fill: "clear", color: this.active ? "success" : "medium", name: (this.active ? `${this.icon}` : `${this.icon}-outline`), toolTip: this.toolTip, onClick: () => this.activeHandler(true) }));
7354
+ return (index.h("smoothly-icon", { key: 'd67dff0a06d70b061fc695f099dec5f7bccbbecc', fill: "clear", color: this.active ? "success" : "medium", name: (this.active ? `${this.icon}` : `${this.icon}-outline`), toolTip: this.toolTip, onClick: () => this.activeHandler(true) }));
7349
7355
  }
7350
7356
  };
7351
7357
  SmoothlyFilterToggle.style = SmoothlyFilterToggleStyle0;
@@ -8183,8 +8189,8 @@ var Input;
8183
8189
  Input.formAdd = formAdd;
8184
8190
  })(Input || (Input = {}));
8185
8191
 
8186
- const styleCss$19 = "smoothly-form{display:block;position:relative}smoothly-form>form{position:relative;min-width:15em}smoothly-form>form>fieldset{display:flex;flex-flow:row wrap;margin-inline-start:unset;margin-inline-end:unset;padding-block-start:unset;padding-inline-start:unset;padding-inline-end:unset;padding-block-end:unset;min-inline-size:unset;border-width:unset;border-style:unset;border-color:unset;border-image:unset}smoothly-form>form>fieldset>*{flex-grow:1;min-width:10em;flex-basis:40%}smoothly-form[looks=\"line\"]>form>fieldset,smoothly-form[looks=\"border\"]>form>fieldset,smoothly-form[looks=\"transparent\"]>form>fieldset{gap:2em}smoothly-form[looks=\"grid\"]>form>fieldset{padding:1px;gap:1px}smoothly-form>form>div:not(:empty){display:flex;justify-content:end;gap:1em;margin-top:0.5rem}";
8187
- const SmoothlyFormStyle0 = styleCss$19;
8192
+ const styleCss$1a = "smoothly-form{display:block;position:relative}smoothly-form>form{position:relative;min-width:15em}smoothly-form>form>fieldset{display:flex;flex-flow:row wrap;margin-inline-start:unset;margin-inline-end:unset;padding-block-start:unset;padding-inline-start:unset;padding-inline-end:unset;padding-block-end:unset;min-inline-size:unset;border-width:unset;border-style:unset;border-color:unset;border-image:unset}smoothly-form>form>fieldset>*{flex-grow:1;min-width:10em;flex-basis:40%}smoothly-form[looks=\"line\"]>form>fieldset,smoothly-form[looks=\"border\"]>form>fieldset,smoothly-form[looks=\"transparent\"]>form>fieldset{gap:2em}smoothly-form[looks=\"grid\"]>form>fieldset{padding:1px;gap:1px}smoothly-form>form>div:not(:empty){display:flex;justify-content:end;gap:1em;margin-top:0.5rem}";
8193
+ const SmoothlyFormStyle0 = styleCss$1a;
8188
8194
 
8189
8195
  const SmoothlyForm = class {
8190
8196
  constructor(hostRef) {
@@ -8345,7 +8351,7 @@ const SmoothlyForm = class {
8345
8351
  await Promise.all([...this.inputs.values()].map(input => Editable.Element.type.is(input) && input.setInitialValue()));
8346
8352
  }
8347
8353
  render() {
8348
- return (index.h(index.Host, { key: '4bcff20afa0c1467d5e404f1f43df8121d3af299' }, index.h("smoothly-spinner", { key: 'eabacd57d478a69cef2380d874368fcb70045414', overlay: true, hidden: !this.processing }), index.h("form", { key: '7928cf5c376f3a5b37bebd3b4fe2d37e5c84af19', onSubmit: !this.prevent ? undefined : e => e.preventDefault(), name: this.name }, index.h("fieldset", { key: 'd265a35e7a9b148cbc25529d8fec13d3bc8b99b7' }, index.h("slot", { key: 'f7d13fe2420dd95b89f1797c575655030bd24efe' })), index.h("div", { key: '610e884eba8398fefa567ce9c20fa7c82b1c4f3a' }, index.h("slot", { key: '8619569518577e4d7208a089b8035788de8c5a98', name: "clear" }), index.h("slot", { key: 'd799c17f6c8c101cd058452ec0c5ac0fa4920f08', name: "edit" }), index.h("slot", { key: '1d630d00faef80319699f4c34b782dfb3e9952ba', name: "reset" }), index.h("slot", { key: 'f55189740776bc7529a7750bd87524e778d3848d', name: "delete" }), index.h("slot", { key: 'a05495198a8f9a509d8a13edf13626f45c779ac6', name: "submit" })))));
8354
+ return (index.h(index.Host, { key: 'a714a5f1c8e96bd23ee415a9c8dd0bd0f156a6db' }, index.h("smoothly-spinner", { key: 'c195d7d61c89b1174bb936bcd1261b42611a711e', overlay: true, hidden: !this.processing }), index.h("form", { key: 'c06e98690dae06168c296372d42112eeba9431e8', onSubmit: !this.prevent ? undefined : e => e.preventDefault(), name: this.name }, index.h("fieldset", { key: 'e50f476edd4d34ab5f9144afb2b442e93c9e5e71' }, index.h("slot", { key: 'f5f7f30d2cc396060e8565670cd35d7a936e5bca' })), index.h("div", { key: '2a1bff13bf67f0f67eb203131dd618b0509d8fa9' }, index.h("slot", { key: '5dc14c0e90dcc387d2bbe6e72843c7115596b394', name: "clear" }), index.h("slot", { key: 'd7fd18f6e843641e9617c55816546e3d2c58da5d', name: "edit" }), index.h("slot", { key: '41390402a9589ac817f7cb731186ac31acf34dab', name: "reset" }), index.h("slot", { key: '701654710291b96faccdb8c118dce0d63f9fe0a7', name: "delete" }), index.h("slot", { key: 'e278921143c02005e249312a262e7c455b735b10', name: "submit" })))));
8349
8355
  }
8350
8356
  get element() { return index.getElement(this); }
8351
8357
  static get watchers() { return {
@@ -8355,15 +8361,15 @@ const SmoothlyForm = class {
8355
8361
  };
8356
8362
  SmoothlyForm.style = SmoothlyFormStyle0;
8357
8363
 
8358
- const styleCss$18 = ".sc-smoothly-form-demo-h{display:flex;margin-top:2em;margin-bottom:10em}.sc-smoothly-form-demo-h>div.sc-smoothly-form-demo{margin:auto;width:1200px;max-width:100%}";
8359
- const SmoothlyFormDemoStyle0 = styleCss$18;
8364
+ const styleCss$19 = ".sc-smoothly-form-demo-h{display:flex;margin-top:2em;margin-bottom:10em}.sc-smoothly-form-demo-h>div.sc-smoothly-form-demo{margin:auto;width:1200px;max-width:100%}";
8365
+ const SmoothlyFormDemoStyle0 = styleCss$19;
8360
8366
 
8361
8367
  const SmoothlyFormDemo = class {
8362
8368
  constructor(hostRef) {
8363
8369
  index.registerInstance(this, hostRef);
8364
8370
  }
8365
8371
  render() {
8366
- return (index.h(index.Host, { key: 'd1a1ede38040f5b5e6bd5e838b5a550ce262ed1b' }, index.h("div", { key: '3cf3e63c28b5429fe4758e5f78209db968728f3c' }, index.h("smoothly-form-demo-all", { key: '20f3cc618aa4d43f4e2b8f45f8d5086eb1b64974' }), index.h("smoothly-form-demo-pet", { key: 'ed75d9093ad32d3c96dc351b237f572653d61bd0' }), index.h("smoothly-form-demo-card", { key: 'd330a9da5f85438404481c9dd27773bb52e84f19' }), index.h("smoothly-form-demo-login", { key: '6fab86879750d7a9a9a7b1015f0ee6fdc48efe8d' }), index.h("smoothly-form-demo-prices", { key: '3f55668d9e139241facdf4f0ca53a4c354eeb4d8' }), index.h("smoothly-form-demo-typed", { key: '083dfe2ee9ce90ae3456575214f0b5cda0977191' }), index.h("smoothly-form-demo-transparent", { key: '0bd752cae80162cb289ad7de49dc811fd16a11ea' }), index.h("smoothly-form-demo-date", { key: 'b2b53a2fcd431d1a02cbf5460715bb826aa990e2' }), index.h("smoothly-form-demo-date-range", { key: '6eafe3c351e4046f663e5ebae243c2af667b1cd7' }), index.h("smoothly-form-demo-controlled", { key: 'ef5b1c51634cde1c6d218cac3eed1997ebd28e3a' }))));
8372
+ return (index.h(index.Host, { key: 'be42460c0454e37b28b4201197204ac200671039' }, index.h("div", { key: 'f6f8fa67312b722f0887c670dbfedd734c2b66fe' }, index.h("smoothly-form-demo-all", { key: '33c03542448e64fe3d45b980933aa72497a3ceab' }), index.h("smoothly-form-demo-pet", { key: '55abb6ca722b4f2a7333c0fbcb9d9729d30e467f' }), index.h("smoothly-form-demo-card", { key: '718779385e312a28d11f0c53bc6591c612c78d20' }), index.h("smoothly-form-demo-login", { key: 'ee67dc1e11f039d73fb27c2a116dc99577cab85a' }), index.h("smoothly-form-demo-prices", { key: '8091990c73450acfde6d6a9ad7959192e57e99a1' }), index.h("smoothly-form-demo-typed", { key: 'b80637c1aab9ed4262ea4fd6b37c17a7e314a695' }), index.h("smoothly-form-demo-transparent", { key: '3eb8e8efceba010993a04802316bd71743118043' }), index.h("smoothly-form-demo-date", { key: '379b6ed49a574410ca62a6b00f5a49b50d5f2744' }), index.h("smoothly-form-demo-date-range", { key: 'f00a96281d70c215a3bf409d82710bb5640989bc' }), index.h("smoothly-form-demo-controlled", { key: '5043f9c375917088f1a5808f2a9719529ad87d6e' }))));
8367
8373
  }
8368
8374
  };
8369
8375
  SmoothlyFormDemo.style = SmoothlyFormDemoStyle0;
@@ -8373,9 +8379,9 @@ const SmoothlyFormDemoAll = class {
8373
8379
  index.registerInstance(this, hostRef);
8374
8380
  }
8375
8381
  render() {
8376
- return (index.h(index.Host, { key: '0f21d33f0e276513e166b7d8c4d28cb0fe7091a1' }, index.h("h2", { key: '4a2468e208c16e4167f1178e330cc3a728320655' }, "All inputs"), index.h("smoothly-form", { key: '0822ae30e4c7f3cd554a78487e885c57d8c9ff95', looks: "grid", type: "create", readonly: true, action: "https://api.toiletapi.com/upload/6b12fd2f-e896-46f9-b38f-25cf42cee4b4", onSmoothlyFormSubmit: e => {
8382
+ return (index.h(index.Host, { key: '7fccf5c4d19f7711ad8695609719d5b157dc69e9' }, index.h("h2", { key: '471984566caccd53c58d182275dfb5b3dffd1438' }, "All inputs"), index.h("smoothly-form", { key: 'dcb87409af65d590f88cf7640d03b5077dfc72d3', looks: "grid", type: "create", readonly: true, action: "https://api.toiletapi.com/upload/6b12fd2f-e896-46f9-b38f-25cf42cee4b4", onSmoothlyFormSubmit: e => {
8377
8383
  Object.entries(e.detail.value).forEach(([key, value]) => console.log(key, value));
8378
- } }, index.h("smoothly-input", { key: '1c9e5c3e5f1c716f67b2c5ec2fb651572744b333', readonly: true, name: "First Name", value: "John" }, "First name"), index.h("smoothly-input", { key: '90733dfb428a9f970243bba603d3d197604a9455', showLabel: false, name: "Last name", value: "Doe" }, "Last name", index.h("smoothly-input-clear", { key: '55bf51e2e1cec08c3290f9b17a4315458edf5d3e', size: "icon", slot: "end" })), index.h("smoothly-input", { key: '1b47ddc2f7e13edd32fd2df6e170bc121f51dc2d', type: "phone", name: "Phone", value: "777888999" }, "Phone", index.h("smoothly-input-reset", { key: '1a6d49a72b07eb3f3d75be7ee2fcf313ab45e14f', size: "icon", slot: "end" })), index.h("smoothly-input-radio", { key: '00d26bda7e79761dda3fed03b7740c379da4b32e', clearable: true, name: "radioFirstInput" }, index.h("label", { key: 'e0c10ccf7862d02495f2a21fa6a5b3e6e5a81366', slot: "label" }, "Clearable"), index.h("smoothly-input-radio-item", { key: '7fc58ab2d7d56c5b56a5d85dc55948b6cb80daef', value: "first" }, "Label 1"), index.h("smoothly-input-radio-item", { key: 'f759c7030781b224327d6d3137dc7037d47572c8', selected: true, value: "second" }, "Label 2"), index.h("smoothly-input-radio-item", { key: '7e7b2315ada97801325de0092ee7cab101bc15b7', value: "third" }, "Label 3")), index.h("smoothly-input-color", { key: 'b8e88392cbabec7fbfedcfb911e93bea40519890', name: "color" }, "Color"), index.h("smoothly-input-select", { key: '86a90a29af509f435db9da5d77a0b90e1f79a598', multiple: true, menuHeight: "7.5items", placeholder: "Select...", name: "select-month" }, index.h("label", { key: '2e124336d215afd82376662bcc36e32c9f43308a', slot: "label" }, "Month multiple select"), index.h("smoothly-item", { key: 'e0c36476de42fa44637661e4a9409b55d384c660', value: "1" }, "January"), index.h("smoothly-item", { key: '96b6696ca6ede81eeec72b77439d40822daff299', value: "2" }, "February"), index.h("smoothly-item", { key: '659caf5ba8d4b51989b50a3206117b97a1e598f0', value: "3" }, "March"), index.h("smoothly-item", { key: '573738299642bb2fc635695f36da963c8dd51529', value: "4" }, "April"), index.h("smoothly-item", { key: '8b742ac119480699df135c0a185502f140a9d313', value: "5" }, "May"), index.h("smoothly-item", { key: '79fb2a26a13dec2e83255c2c46ac6148cb61527b', value: "6" }, "June"), index.h("smoothly-item", { key: 'fe4b4a0dfa8a528fc15dcb66d5f82576bf44843e', value: "7" }, "July"), index.h("smoothly-item", { key: '492b19d88d76e555270b1ca2e08228b815ec732d', value: "8" }, "August"), index.h("smoothly-item", { key: '1c0fb21d9a40cfa9f199473c0db7bfa68e2f0ce7', value: "9" }, "September"), index.h("smoothly-item", { key: 'c868e100c1e9e1aac4bd9ad361157e2adccc63d0', value: "10" }, "October"), index.h("smoothly-item", { key: 'cbc309fae9cef27950776c56f3d4a71afbcdc1fb', value: "11" }, "November"), index.h("smoothly-item", { key: 'fdba2e89192bc16d5aaf80504b86c519fb227b03', value: "12" }, "December")), index.h("smoothly-input-select", { key: 'a9897fd31987b376259a08b01917a4f9ef0752f3', name: "select-icon", clearable: false, showSelected: false }, index.h("smoothly-item", { key: '639d58a3b335a031d1574d5d8929a6b05e68634f', value: "folder", selected: true }, index.h("smoothly-icon", { key: '98d6aec9c4db1a9700b089bfdcbaf81540a09263', size: "small", name: "folder-outline" })), index.h("smoothly-item", { key: '4f6d162120f779e881b21a75c54cb8cf747c67c5', value: "camera" }, index.h("smoothly-icon", { key: 'eadbd3179e5aabe9c8fdd2d029e5c7df06b5ac6d', size: "small", name: "camera-outline" }))), index.h("smoothly-input-checkbox", { key: 'aeebf927e1effc92ec1bbc9fc72230daa9b612c2', name: "checkbox" }, "Check the box"), index.h("smoothly-input-checkbox", { key: 'e8bd53788ece3fda1352417d227cad8ffd5865b6', name: "checkbox2", checked: true }, "Check the box 2"), index.h("smoothly-input-range", { key: '1e937d34e6882d02922f9c8f325f25b41524908e', step: 1, name: "range3", value: 20, label: "Range" }), index.h("smoothly-input", { key: 'fef6e5123d81af109a6405ab1f0489ce9c626cd1', name: "pets.0.name" }, "First Pet's Name"), index.h("smoothly-input-range", { key: '56a6e3916e259d2c58fd2d80fc6cccf19442e38d', name: "pets.0.age", max: 100, step: 1, label: "First Pet's Age" }), index.h("smoothly-input", { key: '5d9a6b0b92c6b3fbb992f17c102879729b6a0cd1', name: "pets.1.name" }, "Second Pet's Name"), index.h("smoothly-input-range", { key: 'ec65719d0497353d8b434a1854bf9e064ee9089a', name: "pets.1.age", max: 100, step: 1, label: "Second Pet's Age" }), index.h("smoothly-input", { key: 'af10efc3fcea51c8521942656b1cdee952c1bb5e', name: "pets.2.name" }, "Third Pet's Name"), index.h("smoothly-input-range", { key: '862de755b1e343578226a1308e5e78cb8f7c4a85', name: "pets.2.age", max: 100, step: 1, label: "Third Pet's Age" }), index.h("smoothly-input-file", { key: '3d9f140826605a5ebafe05a2784722af204cad75', name: "profile", placeholder: "Click or drag your profile picture here..." }, index.h("span", { key: '4e6feb9e29c018ac8dc1510c0b4224f19470e856', slot: "label" }, "Profile"), index.h("smoothly-icon", { key: '1020a98e15c33c0b2de470af477de457a2f28741', slot: "button", name: "person-circle-outline", size: "tiny", fill: "default" })), index.h("smoothly-input", { key: 'b39173b9b8ccabd790ab8ec26b6ccdaa05397d4a', type: "duration", name: "duration", value: {} }, "Duration"), index.h("smoothly-input-clear", { key: 'a6727a03d7855b9741e0f2a3fa82f6e220f8f46d', fill: "default", type: "form", color: "warning", slot: "clear", size: "icon", shape: "rounded" }), index.h("smoothly-input-edit", { key: 'f9591a4c18cccc97633c83033df084378a8d6826', fill: "default", type: "form", color: "tertiary", slot: "edit", size: "icon", shape: "rounded" }), index.h("smoothly-input-reset", { key: '22d67028a219c030fc49981ddeea1f6c6c8ece2e', fill: "default", type: "form", color: "warning", slot: "reset", size: "icon", shape: "rounded" }), index.h("smoothly-input-submit", { key: 'bbed800551c5701c3df9f8405d8630b497cf5efd', delete: true, slot: "delete", color: "danger", size: "icon", shape: "rounded" }), index.h("smoothly-input-submit", { key: '63c88955ec02dd4a034a55b5dcc09a0824f118e0', fill: "default", color: "success", slot: "submit", size: "icon", shape: "rounded" }))));
8384
+ } }, index.h("smoothly-input", { key: '7b2eb3e92db01f5660b4b1d0970422d6d691e4fa', readonly: true, name: "First Name", value: "John" }, "First name"), index.h("smoothly-input", { key: 'ef5c01e448520b65ac53e56b3d4c6e7ef745b3a1', showLabel: false, name: "Last name", value: "Doe" }, "Last name", index.h("smoothly-input-clear", { key: 'dcc2400d3294a5b385aef83d4f0a32a1d4d1529c', size: "icon", slot: "end" })), index.h("smoothly-input", { key: 'cba3faa8f44afeea1629d487b04f20dacdc6cb90', type: "phone", name: "Phone", value: "777888999" }, "Phone", index.h("smoothly-input-reset", { key: '50e02e1848a36610730a3d223f50f2f4f964ceef', size: "icon", slot: "end" })), index.h("smoothly-input-radio", { key: '67aa7d31153efef7171699042b7f00f68158c54a', clearable: true, name: "radioFirstInput" }, index.h("label", { key: 'fd000369571ab966a68c3117cc726206df75cfca', slot: "label" }, "Clearable"), index.h("smoothly-input-radio-item", { key: 'efc4d00f271c2e10430d47355e980b5dc671b57a', value: "first" }, "Label 1"), index.h("smoothly-input-radio-item", { key: '81d02a9e3edbc853a543961d3555e7788a035e88', selected: true, value: "second" }, "Label 2"), index.h("smoothly-input-radio-item", { key: 'd350df35f50334a916f5b36a50328aeeb8698638', value: "third" }, "Label 3")), index.h("smoothly-input-color", { key: 'b4171d328700fd038aed7efbb85d2f0681273c57', name: "color" }, "Color"), index.h("smoothly-input-select", { key: 'b881d8d697b1377f853e10178cfa78f1dcefb6d7', multiple: true, menuHeight: "7.5items", placeholder: "Select...", name: "select-month" }, index.h("label", { key: 'ff88234efe48a82289768560fe221b5abc39cda2', slot: "label" }, "Month multiple select"), index.h("smoothly-item", { key: '34520421f0686499af2e6156cec38cb6f1e21ef6', value: "1" }, "January"), index.h("smoothly-item", { key: '00e90515a47310445f602cb5e1e4b6a374db0e32', value: "2" }, "February"), index.h("smoothly-item", { key: 'e69d38d192b73b7d457a85615a0bb5bee94c4261', value: "3" }, "March"), index.h("smoothly-item", { key: '1497a5e25bde1f74c911583b7f58b24311e27138', value: "4" }, "April"), index.h("smoothly-item", { key: '4347375e8beb1860cefc00bd78317fd8583bffb6', value: "5" }, "May"), index.h("smoothly-item", { key: '3f64fc5a5f42a229dd253bfd43ad48b97cb81b82', value: "6" }, "June"), index.h("smoothly-item", { key: '85ce0c6a21ef858de66f47b134d414177ecd0c9a', value: "7" }, "July"), index.h("smoothly-item", { key: '15ccbd4fbdd620730a42676a52ef58a29733efbb', value: "8" }, "August"), index.h("smoothly-item", { key: 'ad328c7576a564161195f4b0cdd15ee5954eb5c5', value: "9" }, "September"), index.h("smoothly-item", { key: 'b0b7f64cac0dfa22fdb095251d76bb1b5204d9d2', value: "10" }, "October"), index.h("smoothly-item", { key: '87d34b68e8bce002511f6c595c3ff92213864c7e', value: "11" }, "November"), index.h("smoothly-item", { key: '088b3958b79b2e11d7ccb38801f4035588fe0c75', value: "12" }, "December")), index.h("smoothly-input-select", { key: '08a93ddcd78c24a78229d3051b6dc57e51f78e70', name: "select-icon", clearable: false, showSelected: false }, index.h("smoothly-item", { key: '489658e084984b9448f9510c14fe9a579da1e137', value: "folder", selected: true }, index.h("smoothly-icon", { key: 'cb46300bf7a30990fad586ad8a2d8abd7033d788', size: "small", name: "folder-outline" })), index.h("smoothly-item", { key: 'c1e2ef0638f5903f3ef66b204fa803b98b8508a4', value: "camera" }, index.h("smoothly-icon", { key: 'e38b9c538e0fd4212339d687bad504990e6bd11f', size: "small", name: "camera-outline" }))), index.h("smoothly-input-checkbox", { key: '1dd4abf768ad0246df81dba6e0c5acf7cd3b1d1e', name: "checkbox" }, "Check the box"), index.h("smoothly-input-checkbox", { key: 'ce4d3045d4892a3ee68d45f4a19a57345fa6e9cd', name: "checkbox2", checked: true }, "Check the box 2"), index.h("smoothly-input-range", { key: '7a21fbdde34216df183e6fd6390929cea8c75f50', step: 1, name: "range3", value: 20, label: "Range" }), index.h("smoothly-input", { key: '557a9becbbed3e015f7f20ad6492a37adf3951c9', name: "pets.0.name" }, "First Pet's Name"), index.h("smoothly-input-range", { key: 'a9ccc931ea4e9391eee5067f3adaf2d934c9b314', name: "pets.0.age", max: 100, step: 1, label: "First Pet's Age" }), index.h("smoothly-input", { key: 'c5bec1fe07df3b52b16e38da867b44c2c5eede6b', name: "pets.1.name" }, "Second Pet's Name"), index.h("smoothly-input-range", { key: '103bf173600b31844c66d5b883f7ce0c75cdf9f7', name: "pets.1.age", max: 100, step: 1, label: "Second Pet's Age" }), index.h("smoothly-input", { key: '0c6b9f0b3843db0daab0552b399c9bcacb8c076b', name: "pets.2.name" }, "Third Pet's Name"), index.h("smoothly-input-range", { key: '3a02005b1bcd05d7a30624bed434cf87dd8f8b65', name: "pets.2.age", max: 100, step: 1, label: "Third Pet's Age" }), index.h("smoothly-input-file", { key: 'eb67afc68313ac9a66c6d74ef889bea4c9bdc065', name: "profile", placeholder: "Click or drag your profile picture here..." }, index.h("span", { key: 'a49cef10434601d6a588728cf3e3ea1b94a6d75f', slot: "label" }, "Profile"), index.h("smoothly-icon", { key: 'f3139d6f626847a53b1e9b90e655b4373d583b43', slot: "button", name: "person-circle-outline", size: "tiny", fill: "default" })), index.h("smoothly-input", { key: '1fb7c379dfca4c4f3fc313719a7045d4c5c08b19', type: "duration", name: "duration", value: {} }, "Duration"), index.h("smoothly-input-clear", { key: '730188c73cb15755a43913e10e836fff25be6c37', fill: "default", type: "form", color: "warning", slot: "clear", size: "icon", shape: "rounded" }), index.h("smoothly-input-edit", { key: '4442a854ab7a7f5c562e711b31ba29d016846cec', fill: "default", type: "form", color: "tertiary", slot: "edit", size: "icon", shape: "rounded" }), index.h("smoothly-input-reset", { key: '7d3ea9ec4372af8948411500afcc8755430f546b', fill: "default", type: "form", color: "warning", slot: "reset", size: "icon", shape: "rounded" }), index.h("smoothly-input-submit", { key: 'a2a4eb127a5da6d1c6885ac3007666517cbdf554', delete: true, slot: "delete", color: "danger", size: "icon", shape: "rounded" }), index.h("smoothly-input-submit", { key: '8a67c4cbbd10a97db5d57ef67b5b8e6e31fe9620', fill: "default", color: "success", slot: "submit", size: "icon", shape: "rounded" }))));
8379
8385
  }
8380
8386
  };
8381
8387
 
@@ -8384,7 +8390,7 @@ const SmoothlyFormDemoCard = class {
8384
8390
  index.registerInstance(this, hostRef);
8385
8391
  }
8386
8392
  render() {
8387
- return (index.h(index.Host, { key: '27bb1a0cce6b941674329084ee89a89ffd834cad' }, index.h("h2", { key: '517da49391df49740f1fa2ec2724b706df8ff253' }, "Card"), index.h("smoothly-form", { key: '50c65dcf24441dd4b0ef889eae29a631bf2d08f5', looks: "grid", onSmoothlyFormSubmit: (e) => alert(JSON.stringify(e.detail)) }, index.h("smoothly-input", { key: '30040918cb4bfcb6aff2aaf2387e15fc920b637d', type: "card-number", name: "card" }, "Card #"), index.h("smoothly-input-submit", { key: '925ae95728616ae1ecb4130da437380820ffbfe7', size: "icon", slot: "submit", color: "success", fill: "solid" }), index.h("smoothly-input", { key: 'c94bc00a99483172d37171df0d76cbe4b1a306d4', type: "card-expires", name: "expires" }, "Expires"), index.h("smoothly-input", { key: '4e1d172d4f24463480b4260782e0da5e03c79648', type: "card-csc", name: "csc" }, "CVV/CVC"), index.h("smoothly-input", { key: '38f2c00914b9fdb451490c2a1a39f3fd0dcac810', type: "text", name: "name.first" }, "First Name"), index.h("smoothly-input", { key: '5d478d5c6a341a3db81eef8096ebce73afe96d2f', type: "text", name: "name.last" }, "Last Name"))));
8393
+ return (index.h(index.Host, { key: 'f41d3996d386b484cdcc491f9073392dbd8c4901' }, index.h("h2", { key: 'c1972ad42a1ca14daea085d1ddcc4e3457487306' }, "Card"), index.h("smoothly-form", { key: '2cb36ce0c468e19f26b791d64460018081e3b9dc', looks: "grid", onSmoothlyFormSubmit: (e) => alert(JSON.stringify(e.detail)) }, index.h("smoothly-input", { key: 'c389c92d82a609ba046c58b175fbc4557abff1ac', type: "card-number", name: "card" }, "Card #"), index.h("smoothly-input-submit", { key: 'e545832ece3f6fd0e9fe609ba256d8aa9945855f', size: "icon", slot: "submit", color: "success", fill: "solid" }), index.h("smoothly-input", { key: 'cfc1566569bd53868d9e09e5f7dc422e36734d14', type: "card-expires", name: "expires" }, "Expires"), index.h("smoothly-input", { key: 'ee6049372fc859a05ded9328594f083cea37ce57', type: "card-csc", name: "csc" }, "CVV/CVC"), index.h("smoothly-input", { key: '11da0772ff937336788e0a00b61528cbb97df4f5', type: "text", name: "name.first" }, "First Name"), index.h("smoothly-input", { key: '4c9f8d7125f84d2f5f6405814d0dd78c51e94c79', type: "text", name: "name.last" }, "Last Name"))));
8388
8394
  }
8389
8395
  };
8390
8396
 
@@ -8420,15 +8426,15 @@ const SmoothlyFormDemoControlled = class {
8420
8426
  event.detail.result(false);
8421
8427
  }
8422
8428
  render() {
8423
- return (index.h(index.Host, { key: '04d995a76c5f9c4549fcd74cb9f394bb2af90e2a' }, index.h("h2", { key: '55e6f33bb11d352b3af7230accd23e27ae2c0024' }, "Controlled"), index.h("smoothly-form", { key: '0ef3168da2f1c9621b0308b24119c0364881c0c6', readonly: true, looks: "grid", onSmoothlyFormSubmit: e => this.submitHandler(e) }, index.h("smoothly-input", { key: '8badcb37b4a6452d5a201bd8094ba158108bf7aa', type: "text", name: "name", value: this.name }, "Name"), index.h("smoothly-input-select", { key: '1efe7c4951dca1aa64401334424b43f02e647398', name: "currency" }, index.h("span", { key: '2b36f82e17c99e916c8e8945577d23ab51bd2c45', slot: "label" }, "Currency"), this.currencies.map(currency => (index.h("smoothly-item", { selected: currency == this.currency, value: currency }, currency)))), index.h("smoothly-input", { key: 'f990f004092a0695318e0f5f4cd2d74bb3c3e00a' }, "Dummy"), index.h("smoothly-input-month", { key: 'ddff7d9b07962bbcbe7df05f8d8eccfa61b98771', name: "date", value: this.date, next: true, previous: true }, index.h("span", { key: '0d3753a5d6df09ce0e6985cb93395b630d438cc1', slot: "year-label" }, "Year"), index.h("span", { key: 'b65124754a2fe96dbdafa3d7424ba45b824d4527', slot: "month-label" }, "Month")), index.h("smoothly-input-edit", { key: '7209bd3e3a05e6b1c07e41cd093234e44f74e1c3', slot: "edit", size: "icon", color: "primary", fill: "default" }), index.h("smoothly-input-reset", { key: 'cf7211c8a08fee082a295e75ec31f146cd0052a1', slot: "reset", size: "icon", color: "warning", fill: "default" }), index.h("smoothly-input-submit", { key: '8cbfd5c9f1d020035701235eab374d8c14e2aaab', slot: "submit", size: "icon", color: "success" }))));
8429
+ return (index.h(index.Host, { key: '1fd4d2fa478bf809dfe9bb3b9d72443b4f934221' }, index.h("h2", { key: '4f74d9500d2c7b180ba8c195c291db0ff3db5a2d' }, "Controlled"), index.h("smoothly-form", { key: '4777ff01eb0d0e3279be2f248171868c8df67efa', readonly: true, looks: "grid", onSmoothlyFormSubmit: e => this.submitHandler(e) }, index.h("smoothly-input", { key: '158abc4c211a02f7cbdc01cc2a247beba27cb5cc', type: "text", name: "name", value: this.name }, "Name"), index.h("smoothly-input-select", { key: '8239412efd0e36ebfb2211de5479d1290f393887', name: "currency" }, index.h("span", { key: '35cb2e8e9b5757afc6d7401b506715d1d4268e51', slot: "label" }, "Currency"), this.currencies.map(currency => (index.h("smoothly-item", { selected: currency == this.currency, value: currency }, currency)))), index.h("smoothly-input", { key: '8edc0dcbe2a7c523f97aca8a58fef2d0e8eaf823' }, "Dummy"), index.h("smoothly-input-month", { key: '4c53b1878604534aba4c32dfb6c614c53deff9b8', name: "date", value: this.date, next: true, previous: true }, index.h("span", { key: 'd6d865bb7e650b0fdb0b1967ff1ddfc096c8487e', slot: "year-label" }, "Year"), index.h("span", { key: '23ce8c55b7b64d677fbec3bad34b6649ae3108e4', slot: "month-label" }, "Month")), index.h("smoothly-input-edit", { key: '9dd2e66bd9b2f022243aa0eb7e608f847fa168da', slot: "edit", size: "icon", color: "primary", fill: "default" }), index.h("smoothly-input-reset", { key: 'f4e9762d6ce565c4f715ccda1f372ea9a27fe39f', slot: "reset", size: "icon", color: "warning", fill: "default" }), index.h("smoothly-input-submit", { key: 'd40b10936e26d6295acfde5458bdc67cec444625', slot: "submit", size: "icon", color: "success" }))));
8424
8430
  }
8425
8431
  static get watchers() { return {
8426
8432
  "name": ["nameChanged"]
8427
8433
  }; }
8428
8434
  };
8429
8435
 
8430
- const styleCss$17 = ".sc-smoothly-form-demo-date-h{display:block}";
8431
- const SmoothlyFormDemoDateStyle0 = styleCss$17;
8436
+ const styleCss$18 = ".sc-smoothly-form-demo-date-h{display:block}";
8437
+ const SmoothlyFormDemoDateStyle0 = styleCss$18;
8432
8438
 
8433
8439
  const SmoothlyFormDemoDate = class {
8434
8440
  constructor(hostRef) {
@@ -8451,13 +8457,13 @@ const SmoothlyFormDemoDate = class {
8451
8457
  event.detail.result(false);
8452
8458
  }
8453
8459
  render() {
8454
- return (index.h(index.Host, { key: 'f630251d93105a022fddd00df614c31e67e8c7b5' }, index.h("h2", { key: '58288b3ece987d7ce4ec06cd59c3bcd46dc19a72' }, "Date input"), index.h("smoothly-form", { key: '82d07ac321b52972a8eee2d5e0e8dcb6ecf619e3', looks: "border", type: "create", validator: this.validator, onSmoothlyFormSubmit: e => this.submitHandler(e) }, index.h("smoothly-input-date", { key: '80ceded85c7985664236c315978f05654b1cd882', name: "date" }, "Date"), index.h("smoothly-input-submit", { key: 'ec11a355dcf06a70b4356ea57522362a80a68d85', slot: "submit" }, index.h("smoothly-icon", { key: '553b78fe04fbbb938d500856a1fdea0fc084c86e', name: "checkmark-outline" })))));
8460
+ return (index.h(index.Host, { key: '0e9ebcf1bfe2e51739108325f6aeaae38fb21872' }, index.h("h2", { key: 'ff8c62400072ad8d57f16feeeaa0bcd1bc92eabf' }, "Date input"), index.h("smoothly-form", { key: '145c55f92f0c17a206ba5b7023f4d5ba3c456976', looks: "border", type: "create", validator: this.validator, onSmoothlyFormSubmit: e => this.submitHandler(e) }, index.h("smoothly-input-date", { key: 'f2d23dbd7948caa0cbcec370a6480c50db3c4960', name: "date" }, "Date"), index.h("smoothly-input-submit", { key: '6841b540a936eac12e1c73ecbfceaa152af1c519', slot: "submit" }, index.h("smoothly-icon", { key: '3c6c67b2a6b613979245be8f6ef421daad7b16df', name: "checkmark-outline" })))));
8455
8461
  }
8456
8462
  };
8457
8463
  SmoothlyFormDemoDate.style = SmoothlyFormDemoDateStyle0;
8458
8464
 
8459
- const styleCss$16 = ".sc-smoothly-form-demo-date-range-h{display:block}";
8460
- const SmoothlyFormDemoDateRangeStyle0 = styleCss$16;
8465
+ const styleCss$17 = ".sc-smoothly-form-demo-date-range-h{display:block}";
8466
+ const SmoothlyFormDemoDateRangeStyle0 = styleCss$17;
8461
8467
 
8462
8468
  const SmoothlyFormDemoDateRange = class {
8463
8469
  constructor(hostRef) {
@@ -8480,7 +8486,7 @@ const SmoothlyFormDemoDateRange = class {
8480
8486
  event.detail.result(false);
8481
8487
  }
8482
8488
  render() {
8483
- return (index.h(index.Host, { key: '48c35dad0061babccde136943e35ae31a1a2bb03' }, index.h("h2", { key: '3c22dada7556902e648381cca190f7769dc35313' }, "Date-range input"), index.h("smoothly-form", { key: '0b023b3f51c2b03eb8f3a3c352b568cddcd4f7da', looks: "border", type: "create", validator: this.validator, onSmoothlyFormSubmit: e => this.submitHandler(e) }, index.h("smoothly-input-date-range", { key: '906f8f3abc29524353e8416d87ac2f3ed588b798', name: "range" }, "Range"), index.h("smoothly-input-submit", { key: 'cf9f0712c8179b9729ed8139d04766ef70f58242', slot: "submit" }, index.h("smoothly-icon", { key: '1754fc104edbb8a19e683ffee519567296fddfd8', name: "checkmark-outline" })))));
8489
+ return (index.h(index.Host, { key: '6ba08563a69716f7eb21cd040b61d1f21842fcef' }, index.h("h2", { key: 'dbbf147ae323715a44549b10739788649af3138f' }, "Date-range input"), index.h("smoothly-form", { key: '81ea96a97ecb6a85ad9ee53ab097de2d0712f2b6', looks: "border", type: "create", validator: this.validator, onSmoothlyFormSubmit: e => this.submitHandler(e) }, index.h("smoothly-input-date-range", { key: 'fd77d4da2eff6ca3257eadb5f452dafc389feeca', name: "range" }, "Range"), index.h("smoothly-input-submit", { key: '0f7d811917d7b63466bf43ea0cf29363737eee6a', slot: "submit" }, index.h("smoothly-icon", { key: 'f576ccc6552d70a503874506780fba434325dba8', name: "checkmark-outline" })))));
8484
8490
  }
8485
8491
  };
8486
8492
  SmoothlyFormDemoDateRange.style = SmoothlyFormDemoDateRangeStyle0;
@@ -8490,12 +8496,12 @@ const SmoothlyFormDemoLogin = class {
8490
8496
  index.registerInstance(this, hostRef);
8491
8497
  }
8492
8498
  render() {
8493
- return (index.h(index.Host, { key: '4b0e611d58d138b6b10a3abac45fee93aa86a317' }, index.h("h2", { key: '69ba68609f48d993303b35b1ded910dfc6fe77f6' }, "Login"), index.h("smoothly-form", { key: '5dbe7e1e2176484b750b4b8b333b9e840e135136', looks: "border" }, index.h("smoothly-input", { key: 'f87daf7b2a9d8c442f28626209cd84e4f9ac3e37', type: "text", name: "username" }, "Username"), index.h("smoothly-input", { key: '8fe4c4a8bd612018c0dc1170b60f2bb40e9696f5', type: "password", name: "password" }, "Password"), index.h("smoothly-input-reset", { key: 'c48dcd36130b3b8aa4f442e2ac450afe7f30a810', slot: "reset", type: "form", size: "icon", color: "warning" }), index.h("smoothly-input-submit", { key: 'c4f617a7542706566a461675ae2d6828b6a532d9', slot: "submit" }))));
8499
+ return (index.h(index.Host, { key: '121f2b09b6e49c96510f286a942f1214c3d6c3ba' }, index.h("h2", { key: 'f1dd7c6d1922db4b3fc4e2715ebc19556cfa0e36' }, "Login"), index.h("smoothly-form", { key: '3cd991716a14bc5fb5a1c6d0da70b0516815473c', looks: "border" }, index.h("smoothly-input", { key: '83ac9a528f40a78654daaa9a293c4466bcec32c4', type: "text", name: "username" }, "Username"), index.h("smoothly-input", { key: '0a5aea9376c0930a5615cf841834516bab4608c9', type: "password", name: "password" }, "Password"), index.h("smoothly-input-reset", { key: '1a2bb6ec0310f0f3fe6c5f4016cafe6135c3b56c', slot: "reset", type: "form", size: "icon", color: "warning" }), index.h("smoothly-input-submit", { key: 'f9f7f4ce8e05477c8e6021039b0d3e036c08bf12', slot: "submit" }))));
8494
8500
  }
8495
8501
  };
8496
8502
 
8497
- const styleCss$15 = ".sc-smoothly-form-demo-pet-h{display:grid;grid-template-columns:2fr 1fr;grid-template-rows:auto auto;grid-column-gap:2rem}.sc-smoothly-form-demo-pet-h smoothly-input-checkbox[name=\"hasOwner\"].sc-smoothly-form-demo-pet,.sc-smoothly-form-demo-pet-h>smoothly-form.sc-smoothly-form-demo-pet smoothly-summary.sc-smoothly-form-demo-pet,.sc-smoothly-form-demo-pet-h>smoothly-form.sc-smoothly-form-demo-pet smoothly-tabs.sc-smoothly-form-demo-pet{flex-basis:100%}";
8498
- const SmoothlyFormDemoPetStyle0 = styleCss$15;
8503
+ const styleCss$16 = ".sc-smoothly-form-demo-pet-h{display:grid;grid-template-columns:2fr 1fr;grid-template-rows:auto auto;grid-column-gap:2rem}.sc-smoothly-form-demo-pet-h smoothly-input-checkbox[name=\"hasOwner\"].sc-smoothly-form-demo-pet,.sc-smoothly-form-demo-pet-h>smoothly-form.sc-smoothly-form-demo-pet smoothly-summary.sc-smoothly-form-demo-pet,.sc-smoothly-form-demo-pet-h>smoothly-form.sc-smoothly-form-demo-pet smoothly-tabs.sc-smoothly-form-demo-pet{flex-basis:100%}";
8504
+ const SmoothlyFormDemoPetStyle0 = styleCss$16;
8499
8505
 
8500
8506
  const SmoothlyFormDemoPet = class {
8501
8507
  constructor(hostRef) {
@@ -8506,10 +8512,10 @@ const SmoothlyFormDemoPet = class {
8506
8512
  }
8507
8513
  render() {
8508
8514
  var _a, _b;
8509
- return (index.h(index.Host, { key: '3c53b7ed2d4c3716346637d021d47503fd43a14a' }, index.h("h2", { key: 'ee64a8c839e53d186fc3f5a9e5526ce7f4146098' }, "Pet"), index.h("h3", { key: '64fba77b59e28b7c43dfa4d3a7d6c6d67e31896c' }, "Value"), index.h("smoothly-form", { key: 'f4b9585a5f2f9dc69b8e29aba90eefee061b3059', looks: "border", onSmoothlyFormSubmit: (e) => alert(JSON.stringify(e.detail)), onSmoothlyFormInput: e => (this.value = Object.assign({}, e.detail)) }, index.h("smoothly-input", { key: '4e51fb1ed76a65e4290a0886fc520887d0e895ce', type: "text", name: "name.first" }, "Name"), index.h("smoothly-input", { key: '7efe762b7a9374a5e999383a883c2256bfc0ac35', type: "integer", name: "age" }, "Age (Years)"), index.h("smoothly-input-checkbox", { key: 'ffcec51e398c836e6cff2ce5dfda39482cc3cfa7', name: "hasOwner", onSmoothlyInputLoad: e => e.stopPropagation(), onSmoothlyInput: e => {
8515
+ return (index.h(index.Host, { key: '25f0e28fea574ff23698b4a80b778f4adef770d7' }, index.h("h2", { key: 'c19bd386fed8547d82e6accfd02434dc15cc3480' }, "Pet"), index.h("h3", { key: '3d2271d0f1d437c2b1814c1a77901f5c7448f031' }, "Value"), index.h("smoothly-form", { key: '65fd9e5c17fb35abae93bf6c8a13fa7eb4358fa3', looks: "border", onSmoothlyFormSubmit: (e) => alert(JSON.stringify(e.detail)), onSmoothlyFormInput: e => (this.value = Object.assign({}, e.detail)) }, index.h("smoothly-input", { key: '14e5218263e557ea0a7e08fd3c7d0e75d3960d3a', type: "text", name: "name.first" }, "Name"), index.h("smoothly-input", { key: 'b4f1def54df11b5a7604ed25ed166fafdf6bf1c1', type: "integer", name: "age" }, "Age (Years)"), index.h("smoothly-input-checkbox", { key: '1d9cf11f390155b57ea50a90bb480a9f9422eda5', name: "hasOwner", onSmoothlyInputLoad: e => e.stopPropagation(), onSmoothlyInput: e => {
8510
8516
  this.hasOwner = e.detail.hasOwner;
8511
8517
  e.stopPropagation();
8512
- } }, "Has Owner"), this.hasOwner && (index.h(index.Fragment, { key: '0aa46abc16f4c78b43031396758719a0ded37b14' }, index.h("smoothly-input", { key: '334e20752a37f0335350151cb0a75e893ee1afae', type: "text", name: "owner.firstName", value: this.owner.firstName, onSmoothlyInput: e => (this.owner = Object.assign(Object.assign({}, this.owner), { firstName: e.detail["owner.firstName"] })) }, "Owner First Name"), index.h("smoothly-input", { key: '8026b5c10ae2523f730a861edec471db21190e14', type: "text", name: "owner.lastName", value: this.owner.lastName, onSmoothlyInput: e => (this.owner = Object.assign(Object.assign({}, this.owner), { lastName: e.detail["owner.lastName"] })) }, "Owner Last Name"), index.h("smoothly-input-file", { key: 'fbf744db0cecd2852d45d20374c3d809d2ba66d7', name: "owner.picture" }, index.h("span", { key: '283c48ba1b67474b7c857d0e5fb1c9c6148cea6f', slot: "label" }, "Owner picture")), index.h("smoothly-input-date", { key: '63e16605bad9e35e1c6c60e2db2748d1db328c4d', name: "owner.birthday", value: this.owner.birthday, onSmoothlyInput: e => (this.owner = Object.assign(Object.assign({}, this.owner), { birthday: e.detail["owner.birthday"] })) }, "Owner birthday"), index.h("smoothly-input-date-range", { key: '70da494c5ed18ff14fca67a3a28d1c4cb33967e9', name: "owner.ownedRange", start: (_a = this.owner.ownedRange) === null || _a === void 0 ? void 0 : _a.start, end: (_b = this.owner.ownedRange) === null || _b === void 0 ? void 0 : _b.end, onSmoothlyInput: e => (this.owner = Object.assign(Object.assign({}, this.owner), { ownedRange: e.detail["owner.ownedRange"] })) }, "Owner ownedRange"), index.h("smoothly-input-range", { key: '6b83cae51495445730e8df1cfdee739984d22901', name: "owner.height", step: 1, max: 250, value: this.owner.height, onSmoothlyInput: e => (this.owner = Object.assign(Object.assign({}, this.owner), { height: e.detail["owner.height"] })) }, "Owner's Height"), index.h("smoothly-input-select", { key: '37b12e61593accb16cf090da36cbadd5352fe69f', name: "owner.favoriteHat" }, index.h("span", { key: '522e857a7afb2329b422b407703cbee51612d675', slot: "label" }, "Owner's Favorite Hat"), ["🎩 top hat", "🧢 cap", "👒 sun hat", "❌ none"].map((value, index$1) => (index.h("smoothly-item", { value: value, key: index$1, selected: this.owner.favoriteHat == value }, value)))), index.h("smoothly-input-color", { key: 'babff66ef827128dc76008d19917eaba6d5b8bd5', name: "owner.favoriteColor", value: this.owner.favoriteColor ? Scrollable.RGB.toHex(this.owner.favoriteColor) : undefined, onSmoothlyInput: e => (this.owner = Object.assign(Object.assign({}, this.owner), { favoriteColor: e.detail["owner.favoriteColor"] })) }, "Owner's Favorite Color"), index.h("smoothly-input-radio", { key: '51f58bf37b41d9f8eca8700dfd26b4083d2f4087', name: "owner.favoritePizza", value: this.owner.favoritePizza, onSmoothlyInput: e => (this.owner = Object.assign(Object.assign({}, this.owner), { favoritePizza: e.detail["owner.favoritePizza"] })) }, index.h("span", { key: 'c77c02447327750693eb73b6414dbce9bb0d9855', slot: "label" }, "Owner's Favorite Pizza"), ["vesuvio", "capricciosa", "quattro formaggi"].map((value, index$1) => (index.h("smoothly-input-radio-item", { value: value, key: index$1 }, value)))), index.h("smoothly-input-checkbox", { key: '6918e8eee355a1e951289cb2b08ae1ae44b4d50d', name: "owner.hasPet", checked: this.owner.hasPet, onSmoothlyInput: e => (this.owner = Object.assign(Object.assign({}, this.owner), { hasPet: e.detail["owner.hasPet"] })) }, "Has Pet"))), index.h("smoothly-summary", { key: '86339dace672dec3831ad33a89a8205d65a44067' }, index.h("span", { key: '1f46ab814504129410b0e0b5a324504eb9c7a3bd', slot: "summary" }, "Summary"), index.h("div", { key: 'a2e1f716a3bed994318f944dd84addf09fa68e38', slot: "content" }, index.h("smoothly-input", { key: '703e71027659f823a979687d95a43c08104fd138', type: "price", name: "summary.price", currency: "EUR" }, "Summary Price"), index.h("smoothly-input-file", { key: '7241934c607ef4775e4e5b5bdd8f16c00e7cb5ba', name: "summary.picture" }, index.h("span", { key: '3e54f9ffc78d32b3f6ae6922f1ffcd93c49d58b2', slot: "label" }, "Summary picture")), index.h("smoothly-input-date", { key: '53f53274ba847482ac4a44894f052c95f02b19d7', name: "summary.birthday" }, "Summary birthday"), index.h("smoothly-input-date-range", { key: 'c0463d1f8b712e7d9bc067348702c5d8114758b3', name: "summary.ownedRange" }, "Summary ownedRange"), index.h("smoothly-input-range", { key: '8a0835af7cac1a961c89563984b7f4299086785e', name: "summary.height" }, "Height"), index.h("smoothly-input-select", { key: '888df31b68297ba73368f93b598f8897871fac7d', name: "summary.favoriteHat" }, index.h("span", { key: '54f47458eeec94270e433e76b486f51b8bda553c', slot: "label" }, "Summary's Favorite Hat"), ["🎩 top hat", "🧢 cap", "👒 sun hat", "❌ none"].map((value, index$1) => (index.h("smoothly-item", { value: value, key: index$1 }, value)))), index.h("smoothly-input-month", { key: 'aa1b528332dc4e384714e8434eb8eaccb1238af1', name: "summary.month" }, "Summary Month"), index.h("smoothly-input-color", { key: '03e528e7e497481bdb8741529cf2f35ce3c063ed', name: "summary.color" }, "Summary Color"), index.h("smoothly-input-radio", { key: 'e394ffc5c8d91b7e9a7a5a85db6d77aba7480445', name: "summary.favoritePizza" }, index.h("span", { key: 'f40af9c8a324eae7e098baf45a7fc62a51db44a9', slot: "label" }, "Summary's Favorite Pizza"), ["vesuvio", "capricciosa", "quattro formaggi"].map((value, index$1) => (index.h("smoothly-input-radio-item", { value: value, key: index$1 }, value)))), index.h("smoothly-input-checkbox", { key: '3a724ec08f9db20e8c8a6adc975908804273aff8', name: "summary.hasPet" }, "Has Pet"))), index.h("smoothly-tabs", { key: '7393b61a3852772efcb92b287310ba4f1d825a89' }, index.h("smoothly-tab", { key: '36527d22fdcb6c3fed70c817f84b40457daf6e3b', label: "Dog" }, index.h("smoothly-input", { key: '112b46f947bec3350bd71d70983dd6cb2bd5f023', type: "text", name: "dog.breed" }, "Breed"), index.h("smoothly-input-file", { key: '70cb42494c87433b376381dadf6d76c0d2e173dd', name: "dog.picture" }, index.h("span", { key: '5081c67a2c38b56ef2c63038363b66f6a9399848', slot: "label" }, "Dog picture")), index.h("smoothly-input-date", { key: 'b2a7afc24117ff0f748461de59be5b53b4c11f8e', name: "dog.birthday" }, "Dog birthday"), index.h("smoothly-input-date-range", { key: '8ea4837d9c59dccea4a4c03ab5d3d64e9e61f6bc', name: "dog.dateRange" }, "Dog date range"), index.h("smoothly-input-select", { key: 'd1df59726ccdf95cc296eb7dfefe7f242644012b', name: "dog.favoriteHat" }, index.h("span", { key: 'daf751759c26ed6f814bd9a08fc3dcd1e87bc727', slot: "label" }, "Dog's Favorite Hat"), ["🎩 top hat", "🧢 cap", "👒 sun hat", "❌ none"].map((value, index$1) => (index.h("smoothly-item", { value: value, key: index$1 }, value)))), index.h("smoothly-input-color", { key: '1139d9780da74962df9e2cad90c5215a4cbbc719', name: "dog.favoriteColor" }, "Dog's Favorite Color"), index.h("smoothly-input-radio", { key: 'f420307f2437e68f198dda8e7d883e8e48825385', name: "dog.favoritePizza" }, index.h("span", { key: '0bbfda786c21f78d3c11802ff91eaf407c61bbfe', slot: "label" }, "Dog's Favorite Pizza"), ["vesuvio", "capricciosa", "quattro formaggi"].map((value, index$1) => (index.h("smoothly-input-radio-item", { value: value, key: index$1 }, value)))), index.h("smoothly-input-checkbox", { key: 'b4ed76b8df431ac2690d1e9fc788f1224bccd1da', name: "dog.hasPet" }, "Has Pet")), index.h("smoothly-tab", { key: '7676494d9d81eabef36fc63d84a009792ab896bb', label: "Cat", open: true }, index.h("smoothly-input", { key: '1aae371a8c2744e30d1883b28edb28fd3865a847', name: "cat.favoriteFood" }, "Favorite Food"))), index.h("smoothly-input-submit", { key: '594e2fc70306fcf0c2adc90ba9ef7712a64fcff9', size: "icon", slot: "submit", color: "success", fill: "solid" })), index.h("smoothly-display", { key: 'c3ba7a735d158a39102d98ac5cf113c74c2596cd', type: "json", value: this.value })));
8518
+ } }, "Has Owner"), this.hasOwner && (index.h(index.Fragment, { key: '2db53f04c4783682a175c248e78a743352f2d884' }, index.h("smoothly-input", { key: 'c0349d628ce5ae47157259663e1c0f133d936ce0', type: "text", name: "owner.firstName", value: this.owner.firstName, onSmoothlyInput: e => (this.owner = Object.assign(Object.assign({}, this.owner), { firstName: e.detail["owner.firstName"] })) }, "Owner First Name"), index.h("smoothly-input", { key: '74f117b7b6e8a8c5a0f32baa90d77e522e8432e9', type: "text", name: "owner.lastName", value: this.owner.lastName, onSmoothlyInput: e => (this.owner = Object.assign(Object.assign({}, this.owner), { lastName: e.detail["owner.lastName"] })) }, "Owner Last Name"), index.h("smoothly-input-file", { key: 'a086c62c678687596e53752100d7e9e47d9fec65', name: "owner.picture" }, index.h("span", { key: 'e23d1e31b0216bfeb3abce270889e3db283725bf', slot: "label" }, "Owner picture")), index.h("smoothly-input-date", { key: '7a1da5ee1e5eb91e6e67fcf6f3aa978262f827eb', name: "owner.birthday", value: this.owner.birthday, onSmoothlyInput: e => (this.owner = Object.assign(Object.assign({}, this.owner), { birthday: e.detail["owner.birthday"] })) }, "Owner birthday"), index.h("smoothly-input-date-range", { key: '5a079fe255e7d48352e08f31a29638981aacd2d6', name: "owner.ownedRange", start: (_a = this.owner.ownedRange) === null || _a === void 0 ? void 0 : _a.start, end: (_b = this.owner.ownedRange) === null || _b === void 0 ? void 0 : _b.end, onSmoothlyInput: e => (this.owner = Object.assign(Object.assign({}, this.owner), { ownedRange: e.detail["owner.ownedRange"] })) }, "Owner ownedRange"), index.h("smoothly-input-range", { key: '6055dc522ddb020f74dfb2bc3a2ffab009ca4d1c', name: "owner.height", step: 1, max: 250, value: this.owner.height, onSmoothlyInput: e => (this.owner = Object.assign(Object.assign({}, this.owner), { height: e.detail["owner.height"] })) }, "Owner's Height"), index.h("smoothly-input-select", { key: '2adbe6bae62b0f9c0ee3c829c4123fda8aed4319', name: "owner.favoriteHat" }, index.h("span", { key: '901774a34e11bc9e6b31702b031663f3edbfcb68', slot: "label" }, "Owner's Favorite Hat"), ["🎩 top hat", "🧢 cap", "👒 sun hat", "❌ none"].map((value, index$1) => (index.h("smoothly-item", { value: value, key: index$1, selected: this.owner.favoriteHat == value }, value)))), index.h("smoothly-input-color", { key: '8083565c9dbc962a5bfc9383dabb0cf677044a25', name: "owner.favoriteColor", value: this.owner.favoriteColor ? Scrollable.RGB.toHex(this.owner.favoriteColor) : undefined, onSmoothlyInput: e => (this.owner = Object.assign(Object.assign({}, this.owner), { favoriteColor: e.detail["owner.favoriteColor"] })) }, "Owner's Favorite Color"), index.h("smoothly-input-radio", { key: '5829f3a37b7b786212fe0e3ff5f4fc37c097ee69', name: "owner.favoritePizza", value: this.owner.favoritePizza, onSmoothlyInput: e => (this.owner = Object.assign(Object.assign({}, this.owner), { favoritePizza: e.detail["owner.favoritePizza"] })) }, index.h("span", { key: '433d1bc7230de1e3ec08db94a56db35a67386dcf', slot: "label" }, "Owner's Favorite Pizza"), ["vesuvio", "capricciosa", "quattro formaggi"].map((value, index$1) => (index.h("smoothly-input-radio-item", { value: value, key: index$1 }, value)))), index.h("smoothly-input-checkbox", { key: '0c1a58b9764c419a3dba1bf9d1e69f325bf34088', name: "owner.hasPet", checked: this.owner.hasPet, onSmoothlyInput: e => (this.owner = Object.assign(Object.assign({}, this.owner), { hasPet: e.detail["owner.hasPet"] })) }, "Has Pet"))), index.h("smoothly-summary", { key: 'ee58c10dbdfd98beda622a8b6e4bb96958cfc3ef' }, index.h("span", { key: '61729887692798a6d7c223ac5bb81cb19e1c3f68', slot: "summary" }, "Summary"), index.h("div", { key: 'a57a455ef226ef72d091a4b97874ecc4a38608bb', slot: "content" }, index.h("smoothly-input", { key: 'c5dfb6e6d4b87500ea29b7b2e44ddbdcf2c836b2', type: "price", name: "summary.price", currency: "EUR" }, "Summary Price"), index.h("smoothly-input-file", { key: '188ade417c7e57be4eb20c2aa82ac6afca294397', name: "summary.picture" }, index.h("span", { key: '9e44ccca1cd29434aee0bdb50f85de1d010bd40c', slot: "label" }, "Summary picture")), index.h("smoothly-input-date", { key: 'b70839b02c0cb1c2f26a7b63efac9675de096b7c', name: "summary.birthday" }, "Summary birthday"), index.h("smoothly-input-date-range", { key: '164bc527fe0e5f0f173f14d6742e93e8416b6937', name: "summary.ownedRange" }, "Summary ownedRange"), index.h("smoothly-input-range", { key: '3660eceee6e5fd1811e1e3978ddd984a9141ea14', name: "summary.height" }, "Height"), index.h("smoothly-input-select", { key: '0495922c735c863805edd589c3cf5c34939eebef', name: "summary.favoriteHat" }, index.h("span", { key: 'ac7bca6854d1f48df60ccc50879ffaa5b52eb6f2', slot: "label" }, "Summary's Favorite Hat"), ["🎩 top hat", "🧢 cap", "👒 sun hat", "❌ none"].map((value, index$1) => (index.h("smoothly-item", { value: value, key: index$1 }, value)))), index.h("smoothly-input-month", { key: 'c03c81c26238580e88a5790c7f87402caab6bae9', name: "summary.month" }, "Summary Month"), index.h("smoothly-input-color", { key: 'eb3247f2fcadc0a9084b5ad6b6672a8fc7ffc8cf', name: "summary.color" }, "Summary Color"), index.h("smoothly-input-radio", { key: 'f9c78cfd9b2986af54a96bde31b78f8c87d5c7ad', name: "summary.favoritePizza" }, index.h("span", { key: '67941d134cc3e312d76e3b6efca2894322e8240b', slot: "label" }, "Summary's Favorite Pizza"), ["vesuvio", "capricciosa", "quattro formaggi"].map((value, index$1) => (index.h("smoothly-input-radio-item", { value: value, key: index$1 }, value)))), index.h("smoothly-input-checkbox", { key: '8836e89cb394a0d38f595992db7df82a8010ac5b', name: "summary.hasPet" }, "Has Pet"))), index.h("smoothly-tabs", { key: 'c2e5f3114069547c64bc44a408b9586a9ff8e287' }, index.h("smoothly-tab", { key: 'eba8e9edd0cb561babc873b9dfa3cc89f4fa66ac', label: "Dog" }, index.h("smoothly-input", { key: 'a96f9cc655f719363c31477ffd713fc8f857a597', type: "text", name: "dog.breed" }, "Breed"), index.h("smoothly-input-file", { key: 'd987b511f67ddbeadaf8f79847e22368d371f91c', name: "dog.picture" }, index.h("span", { key: 'c3fd42cfd1c8bcddafa8f7ac5d6f556f02eeb510', slot: "label" }, "Dog picture")), index.h("smoothly-input-date", { key: '0f41d07589abfce67ade5743791b0b9482d3858b', name: "dog.birthday" }, "Dog birthday"), index.h("smoothly-input-date-range", { key: '9b1968bac680b5d02a37674c2d95aedff07e2c44', name: "dog.dateRange" }, "Dog date range"), index.h("smoothly-input-select", { key: 'b23b84e1d4c9cd8317e9f87f69f2a593791a04cc', name: "dog.favoriteHat" }, index.h("span", { key: '0620298258955584e728914a0f739e85df0c249c', slot: "label" }, "Dog's Favorite Hat"), ["🎩 top hat", "🧢 cap", "👒 sun hat", "❌ none"].map((value, index$1) => (index.h("smoothly-item", { value: value, key: index$1 }, value)))), index.h("smoothly-input-color", { key: 'cd7910bae7f5cdb29ca2b3cf050b1d1c67d826c1', name: "dog.favoriteColor" }, "Dog's Favorite Color"), index.h("smoothly-input-radio", { key: '700fea8be049fa8cd6ec58deb709fab0962505ad', name: "dog.favoritePizza" }, index.h("span", { key: 'fea88bd6af68a913402f498e41fd22256f2f001b', slot: "label" }, "Dog's Favorite Pizza"), ["vesuvio", "capricciosa", "quattro formaggi"].map((value, index$1) => (index.h("smoothly-input-radio-item", { value: value, key: index$1 }, value)))), index.h("smoothly-input-checkbox", { key: '8afa50869642b41a50aa541d6943894de554ccab', name: "dog.hasPet" }, "Has Pet")), index.h("smoothly-tab", { key: '82505611d4c0eccdef752362c2ba76ab9b1a67f0', label: "Cat", open: true }, index.h("smoothly-input", { key: 'a44183fd177d84950fdf674484be41c3e9faec36', name: "cat.favoriteFood" }, "Favorite Food"))), index.h("smoothly-input-submit", { key: '59873065ed8742f0f731d9f1db458d6dc8877f9e', size: "icon", slot: "submit", color: "success", fill: "solid" })), index.h("smoothly-display", { key: '9134688c2d2a993637bd525d23450158e021d4a0', type: "json", value: this.value })));
8513
8519
  }
8514
8520
  };
8515
8521
  SmoothlyFormDemoPet.style = SmoothlyFormDemoPetStyle0;
@@ -8519,7 +8525,7 @@ const SmoothlyFormDemoPrices = class {
8519
8525
  index.registerInstance(this, hostRef);
8520
8526
  }
8521
8527
  render() {
8522
- return (index.h(index.Host, { key: 'c38c5381d2318cce67e32a9a776d68772c601ee8' }, index.h("h2", { key: 'c1314867af69f2237b64683bd7221ede1438cbac' }, "Prices"), index.h("smoothly-form", { key: '69192fbd1de099c4a0989d1ca8a6fa2d115f47e3', looks: "line" }, index.h("smoothly-input", { key: '6939a3f45e811472ff89bf40e58653bb9f44208e', type: "price", name: "no" }, "No currency"), index.h("smoothly-input", { key: '100c148021dbad1f1abf46d6e87cf1e2a9e12f43', type: "price", name: "crowns", currency: "SEK", toInteger: true }, "SEK (toInteger)"), index.h("smoothly-input", { key: 'c35b955e1c1582913248d919cb64d170947423e2', type: "price", name: "usDollar", currency: "USD" }, "USD"), index.h("smoothly-input", { key: 'ae21229ce2c2f7e1e4ff4e3892cf4afa6efdadb5', type: "price", name: "pounds", currency: "GBP" }, "GBP"), index.h("smoothly-input", { key: 'c21a6d4e2d388a28c4b14da1a0c98cd8a6ab9920', type: "price", name: "peso", currency: "UYW" }, "UYW"), index.h("smoothly-input", { key: '208232229cf7c6e292fcbe179a00bab9399aaa2d', type: "price", name: "iceland", currency: "ISK" }, "ISK"), index.h("smoothly-input", { key: '446f7eb15e73b5a3e10a9760cc6041d0c922a0f3', type: "price", name: "Palladium", currency: "XPD" }, "XPD (Palladium)"), index.h("smoothly-input-reset", { key: 'b267b8686d2bae8f33f003789eab99d37f6c04ba', slot: "reset", fill: "default", type: "form", color: "warning" }), index.h("smoothly-input-submit", { key: '9468f459a23ae781d660134ee16b7ba2c758153c', slot: "submit" }))));
8528
+ return (index.h(index.Host, { key: '9d7de2edf91d84fd944b0787aaae43abf274ac49' }, index.h("h2", { key: '643d7d413bbe2dfd46e26fe227527e6c089c5cc6' }, "Prices"), index.h("smoothly-form", { key: '8208d0a84ce3af46be9b9eb93652b3664ee643c8', looks: "line" }, index.h("smoothly-input", { key: 'e68ccdf92d114eebb5354f58254fc7e934dd8018', type: "price", name: "no" }, "No currency"), index.h("smoothly-input", { key: 'e4def726dbfe3e26c9292359f684eaad919fbf9c', type: "price", name: "crowns", currency: "SEK", toInteger: true }, "SEK (toInteger)"), index.h("smoothly-input", { key: 'd8519a00bf2f6f73cad691e7f5b1ef1bc465cadf', type: "price", name: "usDollar", currency: "USD" }, "USD"), index.h("smoothly-input", { key: 'bcc8cc63fbe4b674327e8216b65ae8861a70b1ca', type: "price", name: "pounds", currency: "GBP" }, "GBP"), index.h("smoothly-input", { key: '4c25cadee15865ebac7e336685c97f354a16c142', type: "price", name: "peso", currency: "UYW" }, "UYW"), index.h("smoothly-input", { key: '7928b1a081003be0858728f5bca227e040fecff2', type: "price", name: "iceland", currency: "ISK" }, "ISK"), index.h("smoothly-input", { key: '4bcd0d6eeb77f290dbeb16a29dded1481ff53bdc', type: "price", name: "Palladium", currency: "XPD" }, "XPD (Palladium)"), index.h("smoothly-input-reset", { key: 'e25fc293f0e6f0213b042e0be23453874296f12d', slot: "reset", fill: "default", type: "form", color: "warning" }), index.h("smoothly-input-submit", { key: 'b67ab2fc3e4e830ec8ca1c5dfccc79cbe39b32dd', slot: "submit" }))));
8523
8529
  }
8524
8530
  };
8525
8531
 
@@ -8528,7 +8534,7 @@ const SmoothlyFormDemoTransparent = class {
8528
8534
  index.registerInstance(this, hostRef);
8529
8535
  }
8530
8536
  render() {
8531
- return (index.h(index.Host, { key: '75f6427077012bf2ab455b5ce1ee551f4ada6152' }, index.h("h2", { key: 'fa603e4a15cf63c027b88c24c8ff31b2f7692fab' }, "Transparent"), index.h("smoothly-form", { key: 'e91c69cc412d1ceaf5d3b160585125f0008a559b', looks: "transparent", onSmoothlyFormSubmit: e => console.log(e.detail.value) }, index.h("smoothly-input-file", { key: '627abbdcd742e2d32db644d09ffe548db35ef6af', name: "file" }, index.h("span", { key: 'c33dea3dac428f2e0a2af92c7595f8e493ff403d', slot: "label" }, "File"), index.h("smoothly-icon", { key: '6ea09d804e3b1ad46c73ae1d1a1dc71ebb34cdc9', slot: "button", name: "folder-open-outline", size: "small" })), index.h("smoothly-input", { key: '0a22f7f505e1ec9ecc3d6aec656a3944e6d24e3a', type: "duration", looks: "transparent", placeholder: "h:mm" }, "Input"), index.h("smoothly-input-date", { key: 'ecf89e51ee2c9d1c1c749f9072eec14dfa31971a' }, "Date"), index.h("smoothly-input-date-range", { key: '7e80495bd6d8f6b5677c9b32bd9a7c67d045fc88' }, "Date Range"), index.h("smoothly-input-select", { key: '82030484abfbe81c584b477e605901919edb8e8b', name: "transport" }, index.h("smoothly-item", { key: '6fa3bd409901bb2526eb236e32efdb8b3b8209f4', value: "plane" }, index.h("smoothly-icon", { key: '31be61e295c8a3640700cef252689b8c76c2ce2f', name: "airplane-outline" })), index.h("smoothly-item", { key: '48973972d5309f33bae2cbabbdd5040aef4820bb', value: "car" }, index.h("smoothly-icon", { key: '648078e77ec0d36f889fe51ac994f865ab58dc30', name: "car-outline" })), index.h("smoothly-item", { key: '469417f682e779831ef0b003873d4a6f5307d1e4', value: "bus", selected: true }, index.h("smoothly-icon", { key: '34cb5e2fd9e85de8baa46258c8cbb1025291bbbe', name: "bus-outline" }))), index.h("smoothly-input-submit", { key: 'b48e0bfc449f53eb489e9c736a77c9942174bacb', icon: "checkbox-outline" }))));
8537
+ return (index.h(index.Host, { key: '3057e6de398fb81a09bd3ff18360757c49be174d' }, index.h("h2", { key: 'ba825799f731267b7d1a63204c8029eec352193a' }, "Transparent"), index.h("smoothly-form", { key: 'ce7702a1b692775140b1da4a851f6e13b1f0ab89', looks: "transparent", onSmoothlyFormSubmit: e => console.log(e.detail.value) }, index.h("smoothly-input-file", { key: '66881e03dbd519d2da6f545390b95a2e6e229431', name: "file" }, index.h("span", { key: '07efd0cdb02069e1cdcf5e4a7178e4fea63c06ef', slot: "label" }, "File"), index.h("smoothly-icon", { key: '3ee2a5ad8c690834531c05d350702a377078dabf', slot: "button", name: "folder-open-outline", size: "small" })), index.h("smoothly-input", { key: 'aa075e902817e6fc201762e04ee1031b09203ec0', type: "duration", looks: "transparent", placeholder: "h:mm" }, "Input"), index.h("smoothly-input-date", { key: 'b35fb059e3c7c9f08938a20add99851d182f86ba' }, "Date"), index.h("smoothly-input-date-range", { key: '3faed295eba7db68bd888d7b3575da31888ad215' }, "Date Range"), index.h("smoothly-input-select", { key: '51e7fbd5abac7351c35cbf3136fa2a15c0a96d43', name: "transport" }, index.h("smoothly-item", { key: '16eaf9bd791575e5b739ee7cba1e16310f3812f0', value: "plane" }, index.h("smoothly-icon", { key: '1b5ed0735cb7d0ba33eb71cd854cb0806c85657e', name: "airplane-outline" })), index.h("smoothly-item", { key: '3750f39f61f1ee7f336ffdf7229279eedfeef7c0', value: "car" }, index.h("smoothly-icon", { key: '5fd4d60477fe34c4eb7fe275ab35c8324983894a', name: "car-outline" })), index.h("smoothly-item", { key: 'bdbecfc510225deeed8257a6a182e71167084451', value: "bus", selected: true }, index.h("smoothly-icon", { key: '6a6e62e2e82d64f6216ea17df4cbbb138888a63d', name: "bus-outline" }))), index.h("smoothly-input-submit", { key: '3e26a9e7ff465a770c9390b87284d878f04ad737', icon: "checkbox-outline" }))));
8532
8538
  }
8533
8539
  };
8534
8540
 
@@ -8542,21 +8548,21 @@ var Contact;
8542
8548
  });
8543
8549
  })(Contact || (Contact = {}));
8544
8550
 
8545
- const styleCss$14 = "";
8546
- const SmoothlyFormDemoTypedStyle0 = styleCss$14;
8551
+ const styleCss$15 = "";
8552
+ const SmoothlyFormDemoTypedStyle0 = styleCss$15;
8547
8553
 
8548
8554
  const SmoothlyFormDemoTyped = class {
8549
8555
  constructor(hostRef) {
8550
8556
  index.registerInstance(this, hostRef);
8551
8557
  }
8552
8558
  render() {
8553
- return (index.h(index.Host, { key: 'b46a4c5b96614398be82f63e161f11e713d671ac' }, index.h("h2", { key: '76688ea6e7bdddf57e60ddceeac54b459297082c' }, "Typed Contact"), index.h("smoothly-form", { key: 'f106191bf794c6e7ca352e1ccf3391bd5d0c4c2c', validator: Contact.type }, index.h("smoothly-input", { key: '79c34bb9332b9b96482a03cbc49e1b53cdf21f74', name: "name.first" }, "First Name"), index.h("smoothly-input", { key: 'f4c9a1939e18253e9febd36a065ccfe84527dbff', name: "name.middle" }, "Middle Name (optional)"), index.h("smoothly-input", { key: '57bb7482d53e956fd0fa94b3838e7dea38ab6453', name: "name.last" }, "Last Name"), index.h("smoothly-input", { key: '2a91d9a949dd98ec632e09b9e8f7e5fa597a4e85', name: "age", type: "integer" }, "Age (18-120)"), index.h("smoothly-input-select", { key: '3ae0b13a37c317600f0f314b337286921e214d8b', name: "country" }, index.h("span", { key: '4ea1c8a2432e4d9af68934bfcbe635208e959da1', slot: "label" }, "Country"), TimeZone.Alpha2.types.map(country => (index.h("smoothly-item", { value: country }, en.from(country))))), index.h("smoothly-input-date", { key: '1b0326b16e1954d453e0117004b0ddd0222001ae', name: "birthday" }, "Date of birth"), index.h("smoothly-input-reset", { key: '914fab1b08af093f2a5bf89227c3b6995a75f1e2', slot: "reset", type: "form", size: "icon", color: "warning" }), index.h("smoothly-input-submit", { key: '6042757f6fc6b44e4190525f81b0dbbc68a7b935', slot: "submit", size: "icon", color: "success" }))));
8559
+ return (index.h(index.Host, { key: '863d42c367fa028fa1300469261155b3656317f0' }, index.h("h2", { key: 'c09c96c4d46e4ae793da5590177ee27a83a47344' }, "Typed Contact"), index.h("smoothly-form", { key: 'a573e17c47c9caa1edfffb45db48d5562994e9d7', validator: Contact.type }, index.h("smoothly-input", { key: 'af05cca00bc6b389964cb6421b6eea0c98f2777e', name: "name.first" }, "First Name"), index.h("smoothly-input", { key: '5b41c244e61776ce742beae0303ad32e9a400559', name: "name.middle" }, "Middle Name (optional)"), index.h("smoothly-input", { key: '6731f9d7aa683d0cc21b10e25af363e44e5d28d1', name: "name.last" }, "Last Name"), index.h("smoothly-input", { key: '76891da3232bb6220866a3c2a5532447133d52e5', name: "age", type: "integer" }, "Age (18-120)"), index.h("smoothly-input-select", { key: 'b5685795e011d37898da248d444c423fb3d79601', name: "country" }, index.h("span", { key: '73a337495ffd988b65a989bf30fd9304e5262ccb', slot: "label" }, "Country"), TimeZone.Alpha2.types.map(country => (index.h("smoothly-item", { value: country }, en.from(country))))), index.h("smoothly-input-date", { key: 'f77ee0ee979fb302dfa01958c8847cf78704e18c', name: "birthday" }, "Date of birth"), index.h("smoothly-input-reset", { key: 'c4584f57c38a939b2417be9193981fd1d531b325', slot: "reset", type: "form", size: "icon", color: "warning" }), index.h("smoothly-input-submit", { key: '61d1ab1a391b3a5e1bf3ba7a8e36701f87930d24', slot: "submit", size: "icon", color: "success" }))));
8554
8560
  }
8555
8561
  };
8556
8562
  SmoothlyFormDemoTyped.style = SmoothlyFormDemoTypedStyle0;
8557
8563
 
8558
- const styleCss$13 = ".sc-smoothly-frame-h{display:block;width:100%;height:100%}[hidden].sc-smoothly-frame-h{display:none}.sc-smoothly-frame-h>iframe.sc-smoothly-frame{border:none;padding:none;margin:none}";
8559
- const SmoothlyFrameStyle0 = styleCss$13;
8564
+ const styleCss$14 = ".sc-smoothly-frame-h{display:block;width:100%;height:100%}[hidden].sc-smoothly-frame-h{display:none}.sc-smoothly-frame-h>iframe.sc-smoothly-frame{border:none;padding:none;margin:none}";
8565
+ const SmoothlyFrameStyle0 = styleCss$14;
8560
8566
 
8561
8567
  const SmoothlyFrame = class {
8562
8568
  constructor(hostRef) {
@@ -8603,8 +8609,8 @@ const SmoothlyFrame = class {
8603
8609
  };
8604
8610
  SmoothlyFrame.style = SmoothlyFrameStyle0;
8605
8611
 
8606
- const styleCss$12 = "[size].sc-smoothly-icon-h{background:none}.sc-smoothly-icon-h{display:flex;align-items:center;justify-content:center}[rotate].sc-smoothly-icon-h{--rotate:rotate(var(--rotation, 0deg));transform:var(--rotate)}[flip=x].sc-smoothly-icon-h{--flip:scaleX(-1);transform:var(--flip)}[flip=y].sc-smoothly-icon-h{--flip:scaleY(-1);transform:var(--flip)}[rotate][flip].sc-smoothly-icon-h{transform:var(--rotate)var(--flip)}[hidden].sc-smoothly-icon-h{display:none}[size=tiny].sc-smoothly-icon-h{width:1.2em;height:1.2em}[size=small].sc-smoothly-icon-h{width:1.4em;height:1.4em}[size=medium].sc-smoothly-icon-h{width:1.8em;height:1.8em}[size=large].sc-smoothly-icon-h{width:2.8em;height:2.8em}[size=xlarge].sc-smoothly-icon-h{width:4em;height:4em}.sc-smoothly-icon-h.sc-smoothly-icon-s>svg{width:100%}";
8607
- const SmoothlyIconStyle0 = styleCss$12;
8612
+ const styleCss$13 = "[size].sc-smoothly-icon-h{background:none}.sc-smoothly-icon-h{display:flex;align-items:center;justify-content:center}[rotate].sc-smoothly-icon-h{--rotate:rotate(var(--rotation, 0deg));transform:var(--rotate)}[flip=x].sc-smoothly-icon-h{--flip:scaleX(-1);transform:var(--flip)}[flip=y].sc-smoothly-icon-h{--flip:scaleY(-1);transform:var(--flip)}[rotate][flip].sc-smoothly-icon-h{transform:var(--rotate)var(--flip)}[hidden].sc-smoothly-icon-h{display:none}[size=tiny].sc-smoothly-icon-h{width:1.2em;height:1.2em}[size=small].sc-smoothly-icon-h{width:1.4em;height:1.4em}[size=medium].sc-smoothly-icon-h{width:1.8em;height:1.8em}[size=large].sc-smoothly-icon-h{width:2.8em;height:2.8em}[size=xlarge].sc-smoothly-icon-h{width:4em;height:4em}.sc-smoothly-icon-h.sc-smoothly-icon-s>svg{width:100%}";
8613
+ const SmoothlyIconStyle0 = styleCss$13;
8608
8614
 
8609
8615
  const SmoothlyIcon = class {
8610
8616
  constructor(hostRef) {
@@ -8648,7 +8654,7 @@ const SmoothlyIcon = class {
8648
8654
  }
8649
8655
  render() {
8650
8656
  var _a;
8651
- return index.h(index.Host, { key: '2ca960872991b5522629128b7a1f91fc52eb9924', innerHTML: this.document, style: { ["--rotation"]: `${(_a = this.rotate) !== null && _a !== void 0 ? _a : 0}deg` } });
8657
+ return index.h(index.Host, { key: 'e29dfb2ff35e71cb6007424718aec29c006331e1', innerHTML: this.document, style: { ["--rotation"]: `${(_a = this.rotate) !== null && _a !== void 0 ? _a : 0}deg` } });
8652
8658
  }
8653
8659
  static get watchers() { return {
8654
8660
  "name": ["nameChanged"]
@@ -8656,8 +8662,8 @@ const SmoothlyIcon = class {
8656
8662
  };
8657
8663
  SmoothlyIcon.style = SmoothlyIconStyle0;
8658
8664
 
8659
- const styleCss$11 = ".sc-smoothly-icon-demo-h{display:block;width:clamp(200px, 100%, 1200px);margin:auto}[hidden].sc-smoothly-icon-demo-h{display:none}.sc-smoothly-icon-demo-h>div.sc-smoothly-icon-demo{display:flex;flex-flow:row wrap}.sc-smoothly-icon-demo-h>div.sc-smoothly-icon-demo>smoothly-icon.sc-smoothly-icon-demo{padding:1rem;position:relative}.sc-smoothly-icon-demo-h>div.sc-smoothly-icon-demo>smoothly-icon.sc-smoothly-icon-demo:hover{scale:1.5}.sc-smoothly-icon-demo-h>div.sc-smoothly-icon-demo>smoothly-icon.sc-smoothly-icon-demo:hover::after{content:attr(data-name);position:absolute;white-space:nowrap;bottom:100%;background:rgb(var(--smoothly-default-contrast));color:rgb(var(--smoothly-default-color));padding:0.25rem 1rem;z-index:1;pointer-events:none}";
8660
- const SmoothlyIconDemoStyle0 = styleCss$11;
8665
+ const styleCss$12 = ".sc-smoothly-icon-demo-h{display:block;width:clamp(200px, 100%, 1200px);margin:auto}[hidden].sc-smoothly-icon-demo-h{display:none}.sc-smoothly-icon-demo-h>div.sc-smoothly-icon-demo{display:flex;flex-flow:row wrap}.sc-smoothly-icon-demo-h>div.sc-smoothly-icon-demo>smoothly-icon.sc-smoothly-icon-demo{padding:1rem;position:relative}.sc-smoothly-icon-demo-h>div.sc-smoothly-icon-demo>smoothly-icon.sc-smoothly-icon-demo:hover{scale:1.5}.sc-smoothly-icon-demo-h>div.sc-smoothly-icon-demo>smoothly-icon.sc-smoothly-icon-demo:hover::after{content:attr(data-name);position:absolute;white-space:nowrap;bottom:100%;background:rgb(var(--smoothly-default-contrast));color:rgb(var(--smoothly-default-color));padding:0.25rem 1rem;z-index:1;pointer-events:none}";
8666
+ const SmoothlyIconDemoStyle0 = styleCss$12;
8661
8667
 
8662
8668
  const SmoothlyIconDemo = class {
8663
8669
  constructor(hostRef) {
@@ -8668,7 +8674,7 @@ const SmoothlyIconDemo = class {
8668
8674
  this.props = {};
8669
8675
  }
8670
8676
  render() {
8671
- return (index.h(index.Host, { key: 'a48ba348de697e8a536a0236719efa65b252159d' }, index.h("h2", { key: '317dd038d538789cbaa5532d9c16257ef5a64814' }, "Filter and Variants"), index.h("smoothly-form", { key: '8960c5768d0735eb1c86d068d5759d2a0aa04129', onSmoothlyFormInput: e => (this.display = e.detail) }, index.h("smoothly-input", { key: '84d023b804b64814cba87e651f363521d2e7615e', name: "filter" }, "Filter"), index.h("smoothly-input-select", { key: '41c33c71d7987b03d39c57f574b567add5e16271', name: "variant" }, index.h("span", { key: '72d59198e6d547da8f062e43364167107d3086e7', slot: "label" }, "Variant"), index.h("smoothly-item", { key: '61bebffd79c5dccab8ac9b90c4b8ff987ff45d1d', value: "outline" }, "outline"), index.h("smoothly-item", { key: '756a78875009eaa973e0b96bc339ef7a4dc663ca', value: "sharp" }, "sharp"), index.h("smoothly-input-clear", { key: 'ec9abf0352ae7d30b405330e6f828c013351b93e', slot: "end" }))), index.h("h2", { key: 'a4170a7aaf8fa66dfc28065c937b0e051996decf' }, "Props"), index.h("smoothly-form", { key: '306eda4fad769698d78601d51141ee303dd99918', onSmoothlyFormInput: e => (this.props = e.detail) }, index.h("smoothly-input-select", { key: '1fad7a0c9b10b567c108b45dfc1bdce337c5adc0', name: "color" }, index.h("span", { key: '419dca6615f6046eb5f0f8407bac7bddb8d621b4', slot: "label" }, "Color"), Scrollable.Color.types.map(color => (index.h("smoothly-item", { value: color, color: color }, color))), index.h("smoothly-input-clear", { key: '6d84cd25c0056a9bb56995ca57bf45fbcd7ca728', slot: "end" })), index.h("smoothly-input-select", { key: 'e47724be5b6c0a6c6949b01893c02b2061c61d39', name: "flip" }, index.h("span", { key: '071f941f348aa1515833b9cdb5c137779d2c1edc', slot: "label" }, "Flip"), index.h("smoothly-item", { key: '2c08bb5fb826bc163982812dcbfbf92bdbd6eac8', value: "x" }, "x"), index.h("smoothly-item", { key: '4458204ffc2337494168175e3678506c6b0b1df3', value: "y" }, "y"), index.h("smoothly-input-clear", { key: '4d561ebe12520ff6d153e565c1635afded75c9e5', slot: "end" })), index.h("smoothly-input-select", { key: 'fc71d8f6fb9f12f04271f13a7007e59dd19c1fc2', name: "size" }, index.h("span", { key: '668399e2602e6eeeb881c45cba082f1b8227a13b', slot: "label" }, "Size"), index.h("smoothly-item", { key: '5b56b01cc36e3056ca69a8e19e3d0829540a84c5', value: "tiny" }, "tiny"), index.h("smoothly-item", { key: '8506c6d7c3adc1008122756fffbb075a997a47a7', value: "small" }, "small"), index.h("smoothly-item", { key: '5139f8aafc5d47bce7023200825f5eadc30c2440', value: "medium" }, "medium"), index.h("smoothly-item", { key: 'f7a64ad46b598e3fab88c37687ac29b0e4545278', value: "large" }, "large"), index.h("smoothly-input-clear", { key: '16d946bf5e8440f49bb8f9ed911a1a56e6c0f70c', slot: "end" })), index.h("smoothly-input-range", { key: '36ffc94ee758970a62a811a26d6cdaa8206ca45c', name: "rotate", step: 1, min: -180, max: 180, value: 0 }, "Rotate", index.h("smoothly-input-clear", { key: '98c83ffad9dc19e7668de9fc3758894b42d197b3', slot: "end" }))), index.h("h1", { key: '8b11b39a4a81f8b0820b7b16c199af27864ab94d' }, "Icons"), index.h("div", { key: 'a31ee3aa619190ab97d7e8509e25be1aaa8ed44c', class: "icons" }, [
8677
+ return (index.h(index.Host, { key: 'c587537cfac8dd04a8b5d677aa0d940ccf8d8c1f' }, index.h("h2", { key: '13e44a78d8a3f80ca991603af716c3dc8b49b3b8' }, "Filter and Variants"), index.h("smoothly-form", { key: '44ff9b82b821262bc8d7c4a01275b5f5f1cad861', onSmoothlyFormInput: e => (this.display = e.detail) }, index.h("smoothly-input", { key: 'e496109a429a8bb28a0f2574d59da21caf3a0cad', name: "filter" }, "Filter"), index.h("smoothly-input-select", { key: '63e2b5a60f6a83843815a87850236f7985c427f8', name: "variant" }, index.h("span", { key: 'dfcd3453576dd07c41ebb28d9ac2d0f7510b8151', slot: "label" }, "Variant"), index.h("smoothly-item", { key: '858645608d3ded70226e698d12161fa8a5da0566', value: "outline" }, "outline"), index.h("smoothly-item", { key: '26473eb08d6231cc23d9df4ea58748d6aff939c5', value: "sharp" }, "sharp"), index.h("smoothly-input-clear", { key: '563d5097d77a6cb771f3950d881a2ad5f4f94a77', slot: "end" }))), index.h("h2", { key: 'f0e5efcd97da7df914ca33d5cae907f154b59ae0' }, "Props"), index.h("smoothly-form", { key: '23be6e8004126b2653c2968c91e4862992b501c1', onSmoothlyFormInput: e => (this.props = e.detail) }, index.h("smoothly-input-select", { key: '234d568e4edf5e20a8a1e503b800ac78c832cb01', name: "color" }, index.h("span", { key: 'ca7c3d6b7b91342397a6a8324fa0c01c2c955bab', slot: "label" }, "Color"), Scrollable.Color.types.map(color => (index.h("smoothly-item", { value: color, color: color }, color))), index.h("smoothly-input-clear", { key: '714e92f3c015532b677b947c86e16da12a279acd', slot: "end" })), index.h("smoothly-input-select", { key: 'c389a8b4cc53a4e049b24ebdca0f436eb81d068c', name: "flip" }, index.h("span", { key: '0f93c27dddb5e2c2b3b707650d326b7ad76758bd', slot: "label" }, "Flip"), index.h("smoothly-item", { key: 'bc9666e658041d38b4c35a27a5885dbd5f123d09', value: "x" }, "x"), index.h("smoothly-item", { key: '0783bf83144a31577abe17a07af707fda2587680', value: "y" }, "y"), index.h("smoothly-input-clear", { key: '23dad9141834b4cdbb9c6dd06e4d6c10dd0bce23', slot: "end" })), index.h("smoothly-input-select", { key: '8c87db4ce0041147c66b6961d80973d1b365e2e3', name: "size" }, index.h("span", { key: '7870f3c9b4ef8138e34b768f6e4005e00437c446', slot: "label" }, "Size"), index.h("smoothly-item", { key: '8c6e8943d5c1b5ba194cdecd08884ec2852a314b', value: "tiny" }, "tiny"), index.h("smoothly-item", { key: '3591b9178abcb9bce8824b47bcf05d335d735bf9', value: "small" }, "small"), index.h("smoothly-item", { key: 'ed80c9ec9e05d786713d85ef95343096bb581032', value: "medium" }, "medium"), index.h("smoothly-item", { key: '8046e4bf9c5f8457eef91fe2051c742d59cde223', value: "large" }, "large"), index.h("smoothly-input-clear", { key: '7e849daf267c1309ebabc4f3bb8381d2f39549e8', slot: "end" })), index.h("smoothly-input-range", { key: '10b731415bc2db750066baadb51dca5a543a6fe7', name: "rotate", step: 1, min: -180, max: 180, value: 0 }, "Rotate", index.h("smoothly-input-clear", { key: 'f74115bba6427c12bc1bbea85e4891cfdb3bbc7e', slot: "end" }))), index.h("h1", { key: '2be36eb07701df50c1dd810dea8474539912af31' }, "Icons"), index.h("div", { key: 'f4bf305b13940b4c08f6be7b4959f3823a8855b7', class: "icons" }, [
8672
8678
  ...Scrollable.Icon.Name.values
8673
8679
  .filter(name => !this.display.filter || name.includes(this.display.filter))
8674
8680
  .map((name) => (this.display.variant ? `${name}-${this.display.variant}` : name)),
@@ -8928,8 +8934,8 @@ class InputStateHandler {
8928
8934
  }
8929
8935
  }
8930
8936
 
8931
- const styleCss$10 = ".sc-smoothly-input-h{--input-padding-side:.5rem;--input-value-padding-top:1.25rem;--input-value-padding-bottom:.25rem;--input-min-height:3rem;min-height:var(--input-min-height);box-sizing:border-box;border-radius:var(--smoothly-input-border-radius)}.sc-smoothly-input-h[looks=\"border\"].sc-smoothly-input-s>smoothly-picker-menu smoothly-input,[looks=\"border\"].sc-smoothly-input-h{border:rgb(var(--smoothly-input-border)) solid 1px}[looks=\"border\"][readonly].sc-smoothly-input-h{border:transparent solid 1px}.sc-smoothly-input-h[looks=\"line\"].sc-smoothly-input-s>smoothly-picker-menu smoothly-input,[looks=\"line\"].sc-smoothly-input-h{border-bottom:rgb(var(--smoothly-input-border)) solid 1px}[looks=\"line\"][readonly].sc-smoothly-input-h{border-bottom:transparent solid 1px}[looks=\"grid\"].sc-smoothly-input-h{flex-grow:1;flex-basis:40%;box-shadow:0px 0px 0px 1px rgb(var(--smoothly-input-border));border:none}[looks=\"grid\"][readonly].sc-smoothly-input-h{box-shadow:0px 0px 0px 1px rgba(var(--smoothly-input-border-readonly))}[looks=\"transparent\"].sc-smoothly-input-h{border:none}[looks=\"transparent\"][readonly].sc-smoothly-input-h,[looks=\"transparent\"].sc-smoothly-input-h:not(:focus-within){background-color:transparent}[looks=\"transparent\"][readonly].sc-smoothly-input-h>input.sc-smoothly-input,[looks=\"transparent\"].sc-smoothly-input-h:not(:focus-within)>input.sc-smoothly-input{background:transparent}[looks=\"transparent\"].sc-smoothly-input-h:not([readonly]):focus-within{outline:1px solid rgb(var(--smoothly-input-border))}.sc-smoothly-input-h.sc-smoothly-input-s>[slot=label],.sc-smoothly-input-h .sc-smoothly-input-s>[slot=label],.sc-smoothly-input-h .label.sc-smoothly-input{position:absolute;top:.6rem;opacity:0.8;user-select:none;cursor:inherit;transform-origin:top left;transition:transform 100ms ease}.sc-smoothly-input-h.floating-label.sc-smoothly-input-s>[slot=label],.sc-smoothly-input-h.floating-label .sc-smoothly-input-s>[slot=label],.sc-smoothly-input-h.has-value.sc-smoothly-input-s>[slot=label],.sc-smoothly-input-h.has-value .sc-smoothly-input-s>[slot=label],.sc-smoothly-input-h[placeholder].sc-smoothly-input-s>[slot=label],.sc-smoothly-input-h[placeholder] .sc-smoothly-input-s>[slot=label],.sc-smoothly-input-h[readonly].sc-smoothly-input-s>[slot=label],.sc-smoothly-input-h[readonly] .sc-smoothly-input-s>[slot=label],.has-value.sc-smoothly-input-h .label.sc-smoothly-input,[placeholder].sc-smoothly-input-h .label.sc-smoothly-input,[readonly].sc-smoothly-input-h .label.sc-smoothly-input,.sc-smoothly-input-h:not([readonly]):focus-within .label.float-on-focus.sc-smoothly-input{top:.2rem;transform:scale(0.8)}.sc-smoothly-input-h:not([show-label]):not(.show-label) .label.sc-smoothly-input{display:none}.sc-smoothly-input-h{display:flex;align-items:center;justify-content:center;font-weight:var(--smoothly-font-weight);overflow:hidden;background-color:rgb(var(--smoothly-input-background));color:rgb(var(--smoothly-input-foreground))}[hidden].sc-smoothly-input-h{display:none}.sc-smoothly-input-h>div.sc-smoothly-input{position:relative;width:100%;height:100%}.sc-smoothly-input-h>div.sc-smoothly-input>label.sc-smoothly-input{left:var(--input-padding-side)}.sc-smoothly-input-h:not([show-label])>div.sc-smoothly-input>input.sc-smoothly-input{padding:0 var(--input-padding-side)}.sc-smoothly-input-h>div.sc-smoothly-input>div.ghost.sc-smoothly-input{position:absolute;box-sizing:border-box;align-content:center;height:100%;padding:var(--input-value-padding-top) \n\t\tvar(--input-padding-side) \n\t\tvar(--input-value-padding-bottom) \n\t\tvar(--input-padding-side)}.sc-smoothly-input-h>div.sc-smoothly-input>div.ghost.sc-smoothly-input>div.value.sc-smoothly-input{display:inline;pointer-events:none;opacity:0}.sc-smoothly-input-h>div.sc-smoothly-input>div.ghost.sc-smoothly-input>div.remainder.sc-smoothly-input{display:inline;pointer-events:none;opacity:0.5}.sc-smoothly-input-h>div.sc-smoothly-input>input.sc-smoothly-input{padding:var(--input-value-padding-top) \n\t\tvar(--input-padding-side) \n\t\tvar(--input-value-padding-bottom) \n\t\tvar(--input-padding-side);box-sizing:border-box;width:100%;height:100%;border:0;z-index:1;position:relative;font-size:1rem;font-family:var(--smoothly-font-family)}.sc-smoothly-input-h>div.sc-smoothly-input>smoothly-icon.sc-smoothly-input{display:none;position:absolute;right:0.2em;top:0.6em}[invalid].sc-smoothly-input-h>div.sc-smoothly-input>smoothly-icon.sc-smoothly-input{display:block;z-index:2;cursor:pointer}.sc-smoothly-input-h>div.sc-smoothly-input>label.sc-smoothly-input{z-index:1;pointer-events:none}.sc-smoothly-input-h>div.sc-smoothly-input>input.sc-smoothly-input:focus{outline:none}.sc-smoothly-input-h.sc-smoothly-input-s>[slot=end] button{padding:0}.sc-smoothly-input-h>div.sc-smoothly-input>input.sc-smoothly-input:-webkit-autofill,.sc-smoothly-input-h>div.sc-smoothly-input>input.sc-smoothly-input:-webkit-autofill:hover,.sc-smoothly-input-h>div.sc-smoothly-input>input.sc-smoothly-input:-webkit-autofill:focus,.sc-smoothly-input-h>div.sc-smoothly-input>input.sc-smoothly-input:-webkit-autofill:active{box-shadow:0 0 0 40em rgb(var(--smoothly-input-background)) inset;-webkit-box-shadow:0 0 0 40em rgb(var(--smoothly-input-background)) inset}.sc-smoothly-input-h>div.sc-smoothly-input>input.sc-smoothly-input:-webkit-autofill,.sc-smoothly-input-h>div.sc-smoothly-input>input.sc-smoothly-input:-webkit-autofill+label.sc-smoothly-input{-webkit-text-fill-color:rgb(var(--smoothly-input-foreground))}";
8932
- const SmoothlyInputStyle0 = styleCss$10;
8937
+ const styleCss$11 = ".sc-smoothly-input-h{--input-padding-side:.5rem;--input-value-padding-top:1.25rem;--input-value-padding-bottom:.25rem;--input-min-height:3rem;min-height:var(--input-min-height);box-sizing:border-box;border-radius:var(--smoothly-input-border-radius)}.sc-smoothly-input-h[looks=\"border\"].sc-smoothly-input-s>smoothly-picker-menu smoothly-input,[looks=\"border\"].sc-smoothly-input-h{border:rgb(var(--smoothly-input-border)) solid 1px}[looks=\"border\"][readonly].sc-smoothly-input-h{border:transparent solid 1px}.sc-smoothly-input-h[looks=\"line\"].sc-smoothly-input-s>smoothly-picker-menu smoothly-input,[looks=\"line\"].sc-smoothly-input-h{border-bottom:rgb(var(--smoothly-input-border)) solid 1px}[looks=\"line\"][readonly].sc-smoothly-input-h{border-bottom:transparent solid 1px}[looks=\"grid\"].sc-smoothly-input-h{flex-grow:1;flex-basis:40%;box-shadow:0px 0px 0px 1px rgb(var(--smoothly-input-border));border:none}[looks=\"grid\"][readonly].sc-smoothly-input-h{box-shadow:0px 0px 0px 1px rgba(var(--smoothly-input-border-readonly))}[looks=\"transparent\"].sc-smoothly-input-h{border:none}[looks=\"transparent\"][readonly].sc-smoothly-input-h,[looks=\"transparent\"].sc-smoothly-input-h:not(:focus-within){background-color:transparent}[looks=\"transparent\"][readonly].sc-smoothly-input-h>input.sc-smoothly-input,[looks=\"transparent\"].sc-smoothly-input-h:not(:focus-within)>input.sc-smoothly-input{background:transparent}[looks=\"transparent\"].sc-smoothly-input-h:not([readonly]):focus-within{outline:1px solid rgb(var(--smoothly-input-border))}.sc-smoothly-input-h.sc-smoothly-input-s>[slot=label],.sc-smoothly-input-h .sc-smoothly-input-s>[slot=label],.sc-smoothly-input-h .label.sc-smoothly-input{position:absolute;top:.6rem;opacity:0.8;user-select:none;cursor:inherit;transform-origin:top left;transition:transform 100ms ease}.sc-smoothly-input-h.floating-label.sc-smoothly-input-s>[slot=label],.sc-smoothly-input-h.floating-label .sc-smoothly-input-s>[slot=label],.sc-smoothly-input-h.has-value.sc-smoothly-input-s>[slot=label],.sc-smoothly-input-h.has-value .sc-smoothly-input-s>[slot=label],.sc-smoothly-input-h[placeholder].sc-smoothly-input-s>[slot=label],.sc-smoothly-input-h[placeholder] .sc-smoothly-input-s>[slot=label],.sc-smoothly-input-h[readonly].sc-smoothly-input-s>[slot=label],.sc-smoothly-input-h[readonly] .sc-smoothly-input-s>[slot=label],.has-value.sc-smoothly-input-h .label.sc-smoothly-input,[placeholder].sc-smoothly-input-h .label.sc-smoothly-input,[readonly].sc-smoothly-input-h .label.sc-smoothly-input,.sc-smoothly-input-h:not([readonly]):focus-within .label.float-on-focus.sc-smoothly-input{top:.2rem;transform:scale(0.8)}.sc-smoothly-input-h:not([show-label]):not(.show-label) .label.sc-smoothly-input{display:none}.sc-smoothly-input-h{display:flex;align-items:center;justify-content:center;font-weight:var(--smoothly-font-weight);overflow:hidden;background-color:rgb(var(--smoothly-input-background));color:rgb(var(--smoothly-input-foreground))}[hidden].sc-smoothly-input-h{display:none}.sc-smoothly-input-h>div.sc-smoothly-input{position:relative;width:100%;height:100%}.sc-smoothly-input-h>div.sc-smoothly-input>label.sc-smoothly-input{left:var(--input-padding-side)}.sc-smoothly-input-h:not([show-label])>div.sc-smoothly-input>input.sc-smoothly-input{padding:0 var(--input-padding-side)}.sc-smoothly-input-h>div.sc-smoothly-input>div.ghost.sc-smoothly-input{position:absolute;box-sizing:border-box;align-content:center;height:100%;padding:var(--input-value-padding-top) \n\t\tvar(--input-padding-side) \n\t\tvar(--input-value-padding-bottom) \n\t\tvar(--input-padding-side)}.sc-smoothly-input-h>div.sc-smoothly-input>div.ghost.sc-smoothly-input>div.value.sc-smoothly-input{display:inline;pointer-events:none;opacity:0}.sc-smoothly-input-h>div.sc-smoothly-input>div.ghost.sc-smoothly-input>div.remainder.sc-smoothly-input{display:inline;pointer-events:none;opacity:0.5}.sc-smoothly-input-h>div.sc-smoothly-input>input.sc-smoothly-input{padding:var(--input-value-padding-top) \n\t\tvar(--input-padding-side) \n\t\tvar(--input-value-padding-bottom) \n\t\tvar(--input-padding-side);box-sizing:border-box;width:100%;height:100%;border:0;z-index:1;position:relative;font-size:1rem;font-family:var(--smoothly-font-family)}.sc-smoothly-input-h>div.sc-smoothly-input>smoothly-icon.sc-smoothly-input{display:none;position:absolute;right:0.2em;top:0.6em}[invalid].sc-smoothly-input-h>div.sc-smoothly-input>smoothly-icon.sc-smoothly-input{display:block;z-index:2;cursor:pointer}.sc-smoothly-input-h>div.sc-smoothly-input>label.sc-smoothly-input{z-index:1;pointer-events:none}.sc-smoothly-input-h>div.sc-smoothly-input>input.sc-smoothly-input:focus{outline:none}.sc-smoothly-input-h.sc-smoothly-input-s>[slot=end] button{padding:0}.sc-smoothly-input-h>div.sc-smoothly-input>input.sc-smoothly-input:-webkit-autofill,.sc-smoothly-input-h>div.sc-smoothly-input>input.sc-smoothly-input:-webkit-autofill:hover,.sc-smoothly-input-h>div.sc-smoothly-input>input.sc-smoothly-input:-webkit-autofill:focus,.sc-smoothly-input-h>div.sc-smoothly-input>input.sc-smoothly-input:-webkit-autofill:active{box-shadow:0 0 0 40em rgb(var(--smoothly-input-background)) inset;-webkit-box-shadow:0 0 0 40em rgb(var(--smoothly-input-background)) inset}.sc-smoothly-input-h>div.sc-smoothly-input>input.sc-smoothly-input:-webkit-autofill,.sc-smoothly-input-h>div.sc-smoothly-input>input.sc-smoothly-input:-webkit-autofill+label.sc-smoothly-input{-webkit-text-fill-color:rgb(var(--smoothly-input-foreground))}";
8938
+ const SmoothlyInputStyle0 = styleCss$11;
8933
8939
 
8934
8940
  const SmoothlyInput = class {
8935
8941
  constructor(hostRef) {
@@ -9045,7 +9051,7 @@ const SmoothlyInput = class {
9045
9051
  }
9046
9052
  render() {
9047
9053
  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
9048
- return (index.h(index.Host, { key: 'a13172d6b16931a91710b8f74d093570c6008e63', class: { "has-value": ((_a = this.state) === null || _a === void 0 ? void 0 : _a.value) != undefined && ((_b = this.state) === null || _b === void 0 ? void 0 : _b.value) != "" }, onclick: () => { var _a; return (_a = this.inputElement) === null || _a === void 0 ? void 0 : _a.focus(); } }, index.h("slot", { key: 'beefb2811e733db33b5d7fb0689727968fc5d9de', name: "start" }), index.h("div", { key: 'ffa17f6f5882d35c6202ca011312af405a2b7e2b' }, index.h("div", { key: 'f1e8f0964775b7d5f0f842ca587f33deb0b653f6', class: "ghost" }, index.h("div", { key: '38cf89f151f099c972ecf14846fea9fa3e1068f3', class: "value" }, (_c = this.state) === null || _c === void 0 ? void 0 : _c.value), index.h("div", { key: '36dd49266aceef29b4ddd063c91ad96a99c96111', class: "remainder" }, (_d = this.state) === null || _d === void 0 ? void 0 : _d.remainder)), index.h("input", { key: '704b50082c3cd68972dc0aee5ec427086ef5b919', ref: (el) => (this.inputElement = el), color: this.color, name: this.name, type: (_e = this.state) === null || _e === void 0 ? void 0 : _e.type, inputmode: (_f = this.state) === null || _f === void 0 ? void 0 : _f.inputmode, placeholder: this.placeholder, required: this.required, autocomplete: (_g = this.autocomplete) !== null && _g !== void 0 ? _g : (_h = this.state) === null || _h === void 0 ? void 0 : _h.autocomplete, disabled: this.disabled, readOnly: this.readonly, pattern: ((_j = this.state) === null || _j === void 0 ? void 0 : _j.pattern) && ((_k = this.state) === null || _k === void 0 ? void 0 : _k.pattern.source), onKeyDown: event => {
9054
+ return (index.h(index.Host, { key: 'a2d80b132fb6df878a0c7d4578f898688e5477d4', class: { "has-value": ((_a = this.state) === null || _a === void 0 ? void 0 : _a.value) != undefined && ((_b = this.state) === null || _b === void 0 ? void 0 : _b.value) != "" }, onclick: () => { var _a; return (_a = this.inputElement) === null || _a === void 0 ? void 0 : _a.focus(); } }, index.h("slot", { key: '7521275d115175bfaae814952ced002bba874ae9', name: "start" }), index.h("div", { key: '41940054f9c11b4fd7954d3d3fde7a255cb762da' }, index.h("div", { key: 'fe690096bd6c92000c27aa2b9acd8eaf0a295bd3', class: "ghost" }, index.h("div", { key: 'a858961bc91c214618c637fd9c5deee33a841666', class: "value" }, (_c = this.state) === null || _c === void 0 ? void 0 : _c.value), index.h("div", { key: '02705773d3af87f2d7a528ac20175cb5f7d36474', class: "remainder" }, (_d = this.state) === null || _d === void 0 ? void 0 : _d.remainder)), index.h("input", { key: 'd195fea65f240194ecee4764c390d7cf001a5348', ref: (el) => (this.inputElement = el), color: this.color, name: this.name, type: (_e = this.state) === null || _e === void 0 ? void 0 : _e.type, inputmode: (_f = this.state) === null || _f === void 0 ? void 0 : _f.inputmode, placeholder: this.placeholder, required: this.required, autocomplete: (_g = this.autocomplete) !== null && _g !== void 0 ? _g : (_h = this.state) === null || _h === void 0 ? void 0 : _h.autocomplete, disabled: this.disabled, readOnly: this.readonly, pattern: ((_j = this.state) === null || _j === void 0 ? void 0 : _j.pattern) && ((_k = this.state) === null || _k === void 0 ? void 0 : _k.pattern.source), onKeyDown: event => {
9049
9055
  this.state = this.stateHandler.onKeyDown(event, this.state);
9050
9056
  if (event.key == "Enter")
9051
9057
  this.smoothlyBlur.emit();
@@ -9058,7 +9064,7 @@ const SmoothlyInput = class {
9058
9064
  if (Deep.notEqual(lastValue, this.stateHandler.getValue(this.state)))
9059
9065
  this.smoothlyChange.emit({ [this.name]: this.stateHandler.getValue(this.state) });
9060
9066
  }
9061
- } }), index.h("label", { key: '8a910c7d4c90676467066ab8023f52df72377fd7', class: "label float-on-focus", htmlFor: this.name }, index.h("slot", { key: '38dfbebdb875107ca63df2e6c74c3e17e6d79649' })), index.h("smoothly-icon", { key: 'b42d359c901704dfdceaa88ec0d6a02fcd9c11ef', name: "alert-circle", color: "danger", fill: "clear", size: "small", toolTip: this.errorMessage })), index.h("slot", { key: '3727d0419be165d53b8baac295439f91049f8340', name: "end" })));
9067
+ } }), index.h("label", { key: '891e34f1f52c83dff8ac57b3fb180bdcc5e3472c', class: "label float-on-focus", htmlFor: this.name }, index.h("slot", { key: '24dd7892e3d0ee65ebf6d9630b256b94f472355d' })), index.h("smoothly-icon", { key: '0f5da90409392952b971b1d4807263dc003fe8d5', name: "alert-circle", color: "danger", fill: "clear", size: "small", toolTip: this.errorMessage })), index.h("slot", { key: 'efe0c88e562e4effa7691134d3723abd5b0845a2', name: "end" })));
9062
9068
  }
9063
9069
  get element() { return index.getElement(this); }
9064
9070
  static get watchers() { return {
@@ -9071,8 +9077,8 @@ const SmoothlyInput = class {
9071
9077
  };
9072
9078
  SmoothlyInput.style = SmoothlyInputStyle0;
9073
9079
 
9074
- const styleCss$$ = ".sc-smoothly-input-checkbox-h{--input-padding-side:.5rem;--input-value-padding-top:1.25rem;--input-value-padding-bottom:.25rem;--input-min-height:3rem;min-height:var(--input-min-height);box-sizing:border-box;border-radius:var(--smoothly-input-border-radius)}.sc-smoothly-input-checkbox-h[looks=\"border\"].sc-smoothly-input-checkbox-s>smoothly-picker-menu smoothly-input,[looks=\"border\"].sc-smoothly-input-checkbox-h{border:rgb(var(--smoothly-input-border)) solid 1px}[looks=\"border\"][readonly].sc-smoothly-input-checkbox-h{border:transparent solid 1px}.sc-smoothly-input-checkbox-h[looks=\"line\"].sc-smoothly-input-checkbox-s>smoothly-picker-menu smoothly-input,[looks=\"line\"].sc-smoothly-input-checkbox-h{border-bottom:rgb(var(--smoothly-input-border)) solid 1px}[looks=\"line\"][readonly].sc-smoothly-input-checkbox-h{border-bottom:transparent solid 1px}[looks=\"grid\"].sc-smoothly-input-checkbox-h{flex-grow:1;flex-basis:40%;box-shadow:0px 0px 0px 1px rgb(var(--smoothly-input-border));border:none}[looks=\"grid\"][readonly].sc-smoothly-input-checkbox-h{box-shadow:0px 0px 0px 1px rgba(var(--smoothly-input-border-readonly))}[looks=\"transparent\"].sc-smoothly-input-checkbox-h{border:none}[looks=\"transparent\"][readonly].sc-smoothly-input-checkbox-h,[looks=\"transparent\"].sc-smoothly-input-checkbox-h:not(:focus-within){background-color:transparent}[looks=\"transparent\"][readonly].sc-smoothly-input-checkbox-h>input.sc-smoothly-input-checkbox,[looks=\"transparent\"].sc-smoothly-input-checkbox-h:not(:focus-within)>input.sc-smoothly-input-checkbox{background:transparent}[looks=\"transparent\"].sc-smoothly-input-checkbox-h:not([readonly]):focus-within{outline:1px solid rgb(var(--smoothly-input-border))}.sc-smoothly-input-checkbox-h.sc-smoothly-input-checkbox-s>[slot=label],.sc-smoothly-input-checkbox-h .sc-smoothly-input-checkbox-s>[slot=label],.sc-smoothly-input-checkbox-h .label.sc-smoothly-input-checkbox{position:absolute;top:.6rem;opacity:0.8;user-select:none;cursor:inherit;transform-origin:top left;transition:transform 100ms ease}.sc-smoothly-input-checkbox-h.floating-label.sc-smoothly-input-checkbox-s>[slot=label],.sc-smoothly-input-checkbox-h.floating-label .sc-smoothly-input-checkbox-s>[slot=label],.sc-smoothly-input-checkbox-h.has-value.sc-smoothly-input-checkbox-s>[slot=label],.sc-smoothly-input-checkbox-h.has-value .sc-smoothly-input-checkbox-s>[slot=label],.sc-smoothly-input-checkbox-h[placeholder].sc-smoothly-input-checkbox-s>[slot=label],.sc-smoothly-input-checkbox-h[placeholder] .sc-smoothly-input-checkbox-s>[slot=label],.sc-smoothly-input-checkbox-h[readonly].sc-smoothly-input-checkbox-s>[slot=label],.sc-smoothly-input-checkbox-h[readonly] .sc-smoothly-input-checkbox-s>[slot=label],.has-value.sc-smoothly-input-checkbox-h .label.sc-smoothly-input-checkbox,[placeholder].sc-smoothly-input-checkbox-h .label.sc-smoothly-input-checkbox,[readonly].sc-smoothly-input-checkbox-h .label.sc-smoothly-input-checkbox,.sc-smoothly-input-checkbox-h:not([readonly]):focus-within .label.float-on-focus.sc-smoothly-input-checkbox{top:.2rem;transform:scale(0.8)}.sc-smoothly-input-checkbox-h:not([show-label]):not(.show-label) .label.sc-smoothly-input-checkbox{display:none}.sc-smoothly-input-checkbox-h{display:flex;align-items:center;flex-direction:row;position:relative;gap:.5rem;padding:0 var(--input-padding-side);background-color:rgb(var(--smoothly-input-background));box-sizing:border-box}.sc-smoothly-input-checkbox-h>smoothly-icon.sc-smoothly-input-checkbox{position:absolute;z-index:1}.sc-smoothly-input-checkbox-h>input.sc-smoothly-input-checkbox{-webkit-appearance:none;-moz-appearance:none;appearance:none;height:1.25rem;width:1.25rem;border:1px solid black;display:block}.sc-smoothly-input-checkbox-h:not([readonly]),.sc-smoothly-input-checkbox-h:not([readonly])>*.sc-smoothly-input-checkbox{cursor:pointer}[readonly].sc-smoothly-input-checkbox-h,[readonly].sc-smoothly-input-checkbox-h>*.sc-smoothly-input-checkbox{cursor:not-allowed}[disabled].sc-smoothly-input-checkbox-h>input.sc-smoothly-input-checkbox,[disabled].sc-smoothly-input-checkbox-h>smoothly-icon.sc-smoothly-input-checkbox{cursor:not-allowed;border-color:rgb(var(--smoothly-color-contrast), 0.3);color:rgb(var(--smoothly-color-contrast), 0.4)}[looks=\"transparent\"].sc-smoothly-input-checkbox-h{background-color:transparent}[looks=\"transparent\"].sc-smoothly-input-checkbox-h:not([readonly]):focus-within{outline-color:transparent}";
9075
- const SmoothlyInputCheckboxStyle0 = styleCss$$;
9080
+ const styleCss$10 = ".sc-smoothly-input-checkbox-h{--input-padding-side:.5rem;--input-value-padding-top:1.25rem;--input-value-padding-bottom:.25rem;--input-min-height:3rem;min-height:var(--input-min-height);box-sizing:border-box;border-radius:var(--smoothly-input-border-radius)}.sc-smoothly-input-checkbox-h[looks=\"border\"].sc-smoothly-input-checkbox-s>smoothly-picker-menu smoothly-input,[looks=\"border\"].sc-smoothly-input-checkbox-h{border:rgb(var(--smoothly-input-border)) solid 1px}[looks=\"border\"][readonly].sc-smoothly-input-checkbox-h{border:transparent solid 1px}.sc-smoothly-input-checkbox-h[looks=\"line\"].sc-smoothly-input-checkbox-s>smoothly-picker-menu smoothly-input,[looks=\"line\"].sc-smoothly-input-checkbox-h{border-bottom:rgb(var(--smoothly-input-border)) solid 1px}[looks=\"line\"][readonly].sc-smoothly-input-checkbox-h{border-bottom:transparent solid 1px}[looks=\"grid\"].sc-smoothly-input-checkbox-h{flex-grow:1;flex-basis:40%;box-shadow:0px 0px 0px 1px rgb(var(--smoothly-input-border));border:none}[looks=\"grid\"][readonly].sc-smoothly-input-checkbox-h{box-shadow:0px 0px 0px 1px rgba(var(--smoothly-input-border-readonly))}[looks=\"transparent\"].sc-smoothly-input-checkbox-h{border:none}[looks=\"transparent\"][readonly].sc-smoothly-input-checkbox-h,[looks=\"transparent\"].sc-smoothly-input-checkbox-h:not(:focus-within){background-color:transparent}[looks=\"transparent\"][readonly].sc-smoothly-input-checkbox-h>input.sc-smoothly-input-checkbox,[looks=\"transparent\"].sc-smoothly-input-checkbox-h:not(:focus-within)>input.sc-smoothly-input-checkbox{background:transparent}[looks=\"transparent\"].sc-smoothly-input-checkbox-h:not([readonly]):focus-within{outline:1px solid rgb(var(--smoothly-input-border))}.sc-smoothly-input-checkbox-h.sc-smoothly-input-checkbox-s>[slot=label],.sc-smoothly-input-checkbox-h .sc-smoothly-input-checkbox-s>[slot=label],.sc-smoothly-input-checkbox-h .label.sc-smoothly-input-checkbox{position:absolute;top:.6rem;opacity:0.8;user-select:none;cursor:inherit;transform-origin:top left;transition:transform 100ms ease}.sc-smoothly-input-checkbox-h.floating-label.sc-smoothly-input-checkbox-s>[slot=label],.sc-smoothly-input-checkbox-h.floating-label .sc-smoothly-input-checkbox-s>[slot=label],.sc-smoothly-input-checkbox-h.has-value.sc-smoothly-input-checkbox-s>[slot=label],.sc-smoothly-input-checkbox-h.has-value .sc-smoothly-input-checkbox-s>[slot=label],.sc-smoothly-input-checkbox-h[placeholder].sc-smoothly-input-checkbox-s>[slot=label],.sc-smoothly-input-checkbox-h[placeholder] .sc-smoothly-input-checkbox-s>[slot=label],.sc-smoothly-input-checkbox-h[readonly].sc-smoothly-input-checkbox-s>[slot=label],.sc-smoothly-input-checkbox-h[readonly] .sc-smoothly-input-checkbox-s>[slot=label],.has-value.sc-smoothly-input-checkbox-h .label.sc-smoothly-input-checkbox,[placeholder].sc-smoothly-input-checkbox-h .label.sc-smoothly-input-checkbox,[readonly].sc-smoothly-input-checkbox-h .label.sc-smoothly-input-checkbox,.sc-smoothly-input-checkbox-h:not([readonly]):focus-within .label.float-on-focus.sc-smoothly-input-checkbox{top:.2rem;transform:scale(0.8)}.sc-smoothly-input-checkbox-h:not([show-label]):not(.show-label) .label.sc-smoothly-input-checkbox{display:none}.sc-smoothly-input-checkbox-h{display:flex;align-items:center;flex-direction:row;position:relative;gap:.5rem;padding:0 var(--input-padding-side);background-color:rgb(var(--smoothly-input-background));box-sizing:border-box}.sc-smoothly-input-checkbox-h>smoothly-icon.sc-smoothly-input-checkbox{position:absolute;z-index:1}.sc-smoothly-input-checkbox-h>input.sc-smoothly-input-checkbox{-webkit-appearance:none;-moz-appearance:none;appearance:none;height:1.25rem;width:1.25rem;border:1px solid black;display:block}.sc-smoothly-input-checkbox-h:not([readonly]),.sc-smoothly-input-checkbox-h:not([readonly])>*.sc-smoothly-input-checkbox{cursor:pointer}[readonly].sc-smoothly-input-checkbox-h,[readonly].sc-smoothly-input-checkbox-h>*.sc-smoothly-input-checkbox{cursor:not-allowed}[disabled].sc-smoothly-input-checkbox-h>input.sc-smoothly-input-checkbox,[disabled].sc-smoothly-input-checkbox-h>smoothly-icon.sc-smoothly-input-checkbox{cursor:not-allowed;border-color:rgb(var(--smoothly-color-contrast), 0.3);color:rgb(var(--smoothly-color-contrast), 0.4)}[looks=\"transparent\"].sc-smoothly-input-checkbox-h{background-color:transparent}[looks=\"transparent\"].sc-smoothly-input-checkbox-h:not([readonly]):focus-within{outline-color:transparent}";
9081
+ const SmoothlyInputCheckboxStyle0 = styleCss$10;
9076
9082
 
9077
9083
  const SmoothlyInputCheckbox = class {
9078
9084
  constructor(hostRef) {
@@ -9139,7 +9145,7 @@ const SmoothlyInputCheckbox = class {
9139
9145
  !this.disabled && !this.readonly && (this.checked = !this.checked);
9140
9146
  }
9141
9147
  render() {
9142
- return (index.h(index.Host, { key: '3c1316c6be3090b1cc8e666c5d108fde4370300c', onMouseDown: (e) => (this.mouseDownPosition = { x: e.clientX, y: e.clientY }), onMouseUp: (e) => { var _a; return ((_a = this.mouseDownPosition) === null || _a === void 0 ? void 0 : _a.x) == e.clientX && this.mouseDownPosition.y == e.clientY && this.click(); } }, index.h("input", { key: '47109b72871ad21e58bd0683fc3d3a4fbf66c83c', type: "checkbox", checked: this.checked }), this.checked && index.h("smoothly-icon", { key: 'aec34d4073515bb073fe54cd658637a7b2ed7aac', name: "checkmark-outline", size: "tiny" }), index.h("label", { key: 'c6e0d71cf2193f49b6f4a9e08ae11592bcace9ef' }, index.h("slot", { key: '787d55c4d6baac335285870d00d6336d6ddde724' }))));
9148
+ return (index.h(index.Host, { key: '6926bcba58ed87725c8d9fbd24c5873c796dfbaa', onMouseDown: (e) => (this.mouseDownPosition = { x: e.clientX, y: e.clientY }), onMouseUp: (e) => { var _a; return ((_a = this.mouseDownPosition) === null || _a === void 0 ? void 0 : _a.x) == e.clientX && this.mouseDownPosition.y == e.clientY && this.click(); } }, index.h("input", { key: '0eb23a4138c5f7bde792266a87b2ebc8edf07bb4', type: "checkbox", checked: this.checked }), this.checked && index.h("smoothly-icon", { key: '241adb264d872ba5902f8b2e49cd1d178c919be6', name: "checkmark-outline", size: "tiny" }), index.h("label", { key: 'a7d0e2eac3bb4e382358db36c2adededa4927809' }, index.h("slot", { key: '22fbcfe9ad64a5aeeb5bfa425c7270a49f6a77e6' }))));
9143
9149
  }
9144
9150
  get element() { return index.getElement(this); }
9145
9151
  static get watchers() { return {
@@ -9148,8 +9154,8 @@ const SmoothlyInputCheckbox = class {
9148
9154
  };
9149
9155
  SmoothlyInputCheckbox.style = SmoothlyInputCheckboxStyle0;
9150
9156
 
9151
- const styleCss$_ = "[color=default].sc-smoothly-input-clear{--smoothly-color:var(--smoothly-default-color);--smoothly-color-contrast:var(--smoothly-default-contrast);--smoothly-color-shade:var(--smoothly-default-shade);--smoothly-color-tint:var(--smoothly-default-tint)}[color=primary].sc-smoothly-input-clear{--smoothly-color:var(--smoothly-primary-color);--smoothly-color-contrast:var(--smoothly-primary-contrast);--smoothly-color-shade:var(--smoothly-primary-shade);--smoothly-color-tint:var(--smoothly-primary-tint)}[color=secondary].sc-smoothly-input-clear{--smoothly-color:var(--smoothly-secondary-color);--smoothly-color-contrast:var(--smoothly-secondary-contrast);--smoothly-color-shade:var(--smoothly-secondary-shade);--smoothly-color-tint:var(--smoothly-secondary-tint)}[color=tertiary].sc-smoothly-input-clear{--smoothly-color:var(--smoothly-tertiary-color);--smoothly-color-contrast:var(--smoothly-tertiary-contrast);--smoothly-color-shade:var(--smoothly-tertiary-shade);--smoothly-color-tint:var(--smoothly-tertiary-tint)}[color=success].sc-smoothly-input-clear{--smoothly-color:var(--smoothly-success-color);--smoothly-color-contrast:var(--smoothly-success-contrast);--smoothly-color-shade:var(--smoothly-success-shade);--smoothly-color-tint:var(--smoothly-success-tint)}[color=warning].sc-smoothly-input-clear{--smoothly-color:var(--smoothly-warning-color);--smoothly-color-contrast:var(--smoothly-warning-contrast);--smoothly-color-shade:var(--smoothly-warning-shade);--smoothly-color-tint:var(--smoothly-warning-tint)}[color=danger].sc-smoothly-input-clear{--smoothly-color:var(--smoothly-danger-color);--smoothly-color-contrast:var(--smoothly-danger-contrast);--smoothly-color-shade:var(--smoothly-danger-shade);--smoothly-color-tint:var(--smoothly-danger-tint)}[color=light].sc-smoothly-input-clear{--smoothly-color:var(--smoothly-light-color);--smoothly-color-contrast:var(--smoothly-light-contrast);--smoothly-color-shade:var(--smoothly-light-shade);--smoothly-color-tint:var(--smoothly-light-tint)}[color=medium].sc-smoothly-input-clear{--smoothly-color:var(--smoothly-medium-color);--smoothly-color-contrast:var(--smoothly-medium-contrast);--smoothly-color-shade:var(--smoothly-medium-shade);--smoothly-color-tint:var(--smoothly-medium-tint)}[color=dark].sc-smoothly-input-clear{--smoothly-color:var(--smoothly-dark-color);--smoothly-color-contrast:var(--smoothly-dark-contrast);--smoothly-color-shade:var(--smoothly-dark-shade);--smoothly-color-tint:var(--smoothly-dark-tint)}.sc-smoothly-input-clear-h{--smoothly-button-border-radius:0.5rem;display:inline-block;box-sizing:border-box;border-radius:var(--smoothly-button-border-radius);cursor:pointer;border:none;outline:none;position:relative}[shape=rounded].sc-smoothly-input-clear-h{--smoothly-button-border-radius:2rem}[type=link].sc-smoothly-input-clear-h{display:inline}[disabled].sc-smoothly-input-clear-h{opacity:0.5;pointer-events:none}.sc-smoothly-input-clear-h>a.sc-smoothly-input-clear,.sc-smoothly-input-clear-h>button.sc-smoothly-input-clear{font-size:110%;font-weight:400;border:1px solid transparent;outline:none;background-color:transparent;cursor:pointer;display:inline-flex;gap:0.5rem;box-sizing:border-box}.sc-smoothly-input-clear-h>a.sc-smoothly-input-clear:empty,.sc-smoothly-input-clear-h>button.sc-smoothly-input-clear:empty{border-width:0}.sc-smoothly-input-clear-h>button.sc-smoothly-input-clear{font-weight:bold;justify-content:center;height:100%;width:100%;border-radius:var(--smoothly-button-border-radius);align-items:center}.sc-smoothly-input-clear-h:not([size=icon]):not([size=flexible])>button.sc-smoothly-input-clear{padding:0.8em;min-width:8em}.sc-smoothly-input-clear-h:not([size=icon]):not([size=flexible]):has(smoothly-icon)>button.sc-smoothly-input-clear{padding:0.6em}[size=icon].sc-smoothly-input-clear-h>button.sc-smoothly-input-clear{padding:0.5em}[type=button].sc-smoothly-input-clear-h>a.sc-smoothly-input-clear{text-align:center;text-decoration:inherit;width:calc(100% - 0.6em)}[size=small].sc-smoothly-input-clear-h>button.sc-smoothly-input-clear{font-size:100%}[size=large].sc-smoothly-input-clear-h>button.sc-smoothly-input-clear{font-size:130%}.sc-smoothly-input-clear-h:not([size=icon]){min-width:8em}[size=flexible].sc-smoothly-input-clear-h{min-width:unset;padding:0;margin:0;display:flex;justify-content:center;align-items:center}[size=flexible].sc-smoothly-input-clear-h>button.sc-smoothly-input-clear{min-width:unset;padding:0;margin:0}[expand].sc-smoothly-input-clear-h{width:100%}[expand=full].sc-smoothly-input-clear-h{border-left:none;border-right:none;--smoothly-button-border-radius:0}[fill=outline].sc-smoothly-input-clear-h>button.sc-smoothly-input-clear{background-color:transparent;color:rgb(var(--smoothly-button-foreground));fill:rgb(var(--smoothly-button-foreground));stroke:rgb(var(--smoothly-button-foreground));border-color:rgb(var(--smoothly-button-foreground))}.sc-smoothly-input-clear-h:not([fill=clear])>button.sc-smoothly-input-clear:hover,.sc-smoothly-input-clear-h>button.sc-smoothly-input-clear:focus-visible,[fill=outline].sc-smoothly-input-clear-h:active>button.sc-smoothly-input-clear::before{border-color:rgb(var(--smoothly-button-focus-color))}[fill=outline].sc-smoothly-input-clear-h>button.sc-smoothly-input-clear:hover::before,[fill=outline].sc-smoothly-input-clear-h>button.sc-smoothly-input-clear:focus-within::before,[fill=outline].sc-smoothly-input-clear-h>button.sc-smoothly-input-clear:active::before{content:\"\";position:absolute;border:2px solid rgb(var(--smoothly-button-focus-border));inset:-1px;border-radius:var(--smoothly-button-border-radius)}.sc-smoothly-input-clear-h:not([fill=clear]):not([fill=outline])>button.sc-smoothly-input-clear:hover,.sc-smoothly-input-clear-h:not([fill=clear]):not([fill=outline])>button.sc-smoothly-input-clear:focus-visible,.sc-smoothly-input-clear-h:not([fill=clear]):not([fill=outline])>button.sc-smoothly-input-clear:active{background:rgb(var(--smoothly-button-hover-background))}.sc-smoothly-input-clear-h>button.sc-smoothly-input-clear,.sc-smoothly-input-clear-h.sc-smoothly-input-clear-s>smoothly-icon,.sc-smoothly-input-clear-h .sc-smoothly-input-clear-s>smoothly-icon{color:rgb(var(--smoothly-button-foreground));stroke:rgb(var(--smoothly-button-foreground));fill:rgb(var(--smoothly-button-foreground))}[hidden].sc-smoothly-input-clear-h{display:none}.sc-smoothly-input-clear-h{display:flex}.sc-smoothly-input-clear-h:not([display]){display:none}.sc-smoothly-input-clear-h[type=\"input\"].sc-smoothly-input-clear-s>smoothly-button>button{cursor:pointer;filter:opacity(60%);--smoothly-button-foreground:var(--smoothly-input-foreground);background-color:transparent}.sc-smoothly-input-clear-h.sc-smoothly-input-clear-s>smoothly-button>button>*+smoothly-icon{display:none}[disabled].sc-smoothly-input-clear-h{cursor:not-allowed}.sc-smoothly-input-clear-h[type=\"input\"]:hover.sc-smoothly-input-clear-s>smoothly-icon,.sc-smoothly-input-clear-h[type=\"input\"]:hover .sc-smoothly-input-clear-s>smoothly-icon{cursor:pointer;filter:opacity(100%)}";
9152
- const SmoothlyInputClearStyle0 = styleCss$_;
9157
+ const styleCss$$ = "[color=default].sc-smoothly-input-clear{--smoothly-color:var(--smoothly-default-color);--smoothly-color-contrast:var(--smoothly-default-contrast);--smoothly-color-shade:var(--smoothly-default-shade);--smoothly-color-tint:var(--smoothly-default-tint)}[color=primary].sc-smoothly-input-clear{--smoothly-color:var(--smoothly-primary-color);--smoothly-color-contrast:var(--smoothly-primary-contrast);--smoothly-color-shade:var(--smoothly-primary-shade);--smoothly-color-tint:var(--smoothly-primary-tint)}[color=secondary].sc-smoothly-input-clear{--smoothly-color:var(--smoothly-secondary-color);--smoothly-color-contrast:var(--smoothly-secondary-contrast);--smoothly-color-shade:var(--smoothly-secondary-shade);--smoothly-color-tint:var(--smoothly-secondary-tint)}[color=tertiary].sc-smoothly-input-clear{--smoothly-color:var(--smoothly-tertiary-color);--smoothly-color-contrast:var(--smoothly-tertiary-contrast);--smoothly-color-shade:var(--smoothly-tertiary-shade);--smoothly-color-tint:var(--smoothly-tertiary-tint)}[color=success].sc-smoothly-input-clear{--smoothly-color:var(--smoothly-success-color);--smoothly-color-contrast:var(--smoothly-success-contrast);--smoothly-color-shade:var(--smoothly-success-shade);--smoothly-color-tint:var(--smoothly-success-tint)}[color=warning].sc-smoothly-input-clear{--smoothly-color:var(--smoothly-warning-color);--smoothly-color-contrast:var(--smoothly-warning-contrast);--smoothly-color-shade:var(--smoothly-warning-shade);--smoothly-color-tint:var(--smoothly-warning-tint)}[color=danger].sc-smoothly-input-clear{--smoothly-color:var(--smoothly-danger-color);--smoothly-color-contrast:var(--smoothly-danger-contrast);--smoothly-color-shade:var(--smoothly-danger-shade);--smoothly-color-tint:var(--smoothly-danger-tint)}[color=light].sc-smoothly-input-clear{--smoothly-color:var(--smoothly-light-color);--smoothly-color-contrast:var(--smoothly-light-contrast);--smoothly-color-shade:var(--smoothly-light-shade);--smoothly-color-tint:var(--smoothly-light-tint)}[color=medium].sc-smoothly-input-clear{--smoothly-color:var(--smoothly-medium-color);--smoothly-color-contrast:var(--smoothly-medium-contrast);--smoothly-color-shade:var(--smoothly-medium-shade);--smoothly-color-tint:var(--smoothly-medium-tint)}[color=dark].sc-smoothly-input-clear{--smoothly-color:var(--smoothly-dark-color);--smoothly-color-contrast:var(--smoothly-dark-contrast);--smoothly-color-shade:var(--smoothly-dark-shade);--smoothly-color-tint:var(--smoothly-dark-tint)}.sc-smoothly-input-clear-h{--smoothly-button-border-radius:0.5rem;display:inline-block;box-sizing:border-box;border-radius:var(--smoothly-button-border-radius);cursor:pointer;border:none;outline:none;position:relative}[shape=rounded].sc-smoothly-input-clear-h{--smoothly-button-border-radius:2rem}[type=link].sc-smoothly-input-clear-h{display:inline}[disabled].sc-smoothly-input-clear-h{opacity:0.5;pointer-events:none}.sc-smoothly-input-clear-h>a.sc-smoothly-input-clear,.sc-smoothly-input-clear-h>button.sc-smoothly-input-clear{font-size:110%;font-weight:400;border:1px solid transparent;outline:none;background-color:transparent;cursor:pointer;display:inline-flex;gap:0.5rem;box-sizing:border-box}.sc-smoothly-input-clear-h>a.sc-smoothly-input-clear:empty,.sc-smoothly-input-clear-h>button.sc-smoothly-input-clear:empty{border-width:0}.sc-smoothly-input-clear-h>button.sc-smoothly-input-clear{font-weight:bold;justify-content:center;height:100%;width:100%;border-radius:var(--smoothly-button-border-radius);align-items:center}.sc-smoothly-input-clear-h:not([size=icon]):not([size=flexible])>button.sc-smoothly-input-clear{padding:0.8em;min-width:8em}.sc-smoothly-input-clear-h:not([size=icon]):not([size=flexible]):has(smoothly-icon)>button.sc-smoothly-input-clear{padding:0.6em}[size=icon].sc-smoothly-input-clear-h>button.sc-smoothly-input-clear{padding:0.5em}[type=button].sc-smoothly-input-clear-h>a.sc-smoothly-input-clear{text-align:center;text-decoration:inherit;width:calc(100% - 0.6em)}[size=small].sc-smoothly-input-clear-h>button.sc-smoothly-input-clear{font-size:100%}[size=large].sc-smoothly-input-clear-h>button.sc-smoothly-input-clear{font-size:130%}.sc-smoothly-input-clear-h:not([size=icon]){min-width:8em}[size=flexible].sc-smoothly-input-clear-h{min-width:unset;padding:0;margin:0;display:flex;justify-content:center;align-items:center}[size=flexible].sc-smoothly-input-clear-h>button.sc-smoothly-input-clear{min-width:unset;padding:0;margin:0}[expand].sc-smoothly-input-clear-h{width:100%}[expand=full].sc-smoothly-input-clear-h{border-left:none;border-right:none;--smoothly-button-border-radius:0}[fill=outline].sc-smoothly-input-clear-h>button.sc-smoothly-input-clear{background-color:transparent;color:rgb(var(--smoothly-button-foreground));fill:rgb(var(--smoothly-button-foreground));stroke:rgb(var(--smoothly-button-foreground));border-color:rgb(var(--smoothly-button-foreground))}.sc-smoothly-input-clear-h:not([fill=clear])>button.sc-smoothly-input-clear:hover,.sc-smoothly-input-clear-h>button.sc-smoothly-input-clear:focus-visible,[fill=outline].sc-smoothly-input-clear-h:active>button.sc-smoothly-input-clear::before{border-color:rgb(var(--smoothly-button-focus-color))}[fill=outline].sc-smoothly-input-clear-h>button.sc-smoothly-input-clear:hover::before,[fill=outline].sc-smoothly-input-clear-h>button.sc-smoothly-input-clear:focus-within::before,[fill=outline].sc-smoothly-input-clear-h>button.sc-smoothly-input-clear:active::before{content:\"\";position:absolute;border:2px solid rgb(var(--smoothly-button-focus-border));inset:-1px;border-radius:var(--smoothly-button-border-radius)}.sc-smoothly-input-clear-h:not([fill=clear]):not([fill=outline])>button.sc-smoothly-input-clear:hover,.sc-smoothly-input-clear-h:not([fill=clear]):not([fill=outline])>button.sc-smoothly-input-clear:focus-visible,.sc-smoothly-input-clear-h:not([fill=clear]):not([fill=outline])>button.sc-smoothly-input-clear:active{background:rgb(var(--smoothly-button-hover-background))}.sc-smoothly-input-clear-h>button.sc-smoothly-input-clear,.sc-smoothly-input-clear-h.sc-smoothly-input-clear-s>smoothly-icon,.sc-smoothly-input-clear-h .sc-smoothly-input-clear-s>smoothly-icon{color:rgb(var(--smoothly-button-foreground));stroke:rgb(var(--smoothly-button-foreground));fill:rgb(var(--smoothly-button-foreground))}[hidden].sc-smoothly-input-clear-h{display:none}.sc-smoothly-input-clear-h{display:flex}.sc-smoothly-input-clear-h:not([display]){display:none}.sc-smoothly-input-clear-h[type=\"input\"].sc-smoothly-input-clear-s>smoothly-button>button{cursor:pointer;filter:opacity(60%);--smoothly-button-foreground:var(--smoothly-input-foreground);background-color:transparent}.sc-smoothly-input-clear-h.sc-smoothly-input-clear-s>smoothly-button>button>*+smoothly-icon{display:none}[disabled].sc-smoothly-input-clear-h{cursor:not-allowed}.sc-smoothly-input-clear-h[type=\"input\"]:hover.sc-smoothly-input-clear-s>smoothly-icon,.sc-smoothly-input-clear-h[type=\"input\"]:hover .sc-smoothly-input-clear-s>smoothly-icon{cursor:pointer;filter:opacity(100%)}";
9158
+ const SmoothlyInputClearStyle0 = styleCss$$;
9153
9159
 
9154
9160
  const SmoothlyInputClear = class {
9155
9161
  constructor(hostRef) {
@@ -9189,13 +9195,13 @@ const SmoothlyInputClear = class {
9189
9195
  }
9190
9196
  render() {
9191
9197
  var _a;
9192
- return (index.h(index.Host, { key: '0c7859c8c7560f7608910d94e854976e15159fa3', title: this.tooltip }, index.h("smoothly-button", { key: 'ce8acccf37e58c5e680a6d74b6e7b5a6cd9eed4a', disabled: this.disabled, size: this.size, type: "button", shape: this.shape, expand: this.expand, color: this.color, fill: (_a = this.fill) !== null && _a !== void 0 ? _a : (this.type == "input" ? "clear" : undefined) }, index.h("slot", { key: 'f776dfc22004fe630e5963fb0b3be02623159687' }), index.h("smoothly-icon", { key: '173c4c57101a67b4a028e08a86542548cb935499', name: "close", size: "tiny" }))));
9198
+ return (index.h(index.Host, { key: 'c6f49245fc95bd93f729a2b51f50f97ab41fdb97', title: this.tooltip }, index.h("smoothly-button", { key: '08f5d20f4dd0b15f8ac40b593585598f767de228', disabled: this.disabled, size: this.size, type: "button", shape: this.shape, expand: this.expand, color: this.color, fill: (_a = this.fill) !== null && _a !== void 0 ? _a : (this.type == "input" ? "clear" : undefined) }, index.h("slot", { key: 'd751b259ed5566cdad948697b139d94a3404f59d' }), index.h("smoothly-icon", { key: '19d2b88739261b33db7a445e4154f50afaeb70c5', name: "close", size: "tiny" }))));
9193
9199
  }
9194
9200
  };
9195
9201
  SmoothlyInputClear.style = SmoothlyInputClearStyle0;
9196
9202
 
9197
- const styleCss$Z = ".sc-smoothly-input-color-h{--input-padding-side:.5rem;--input-value-padding-top:1.25rem;--input-value-padding-bottom:.25rem;--input-min-height:3rem;min-height:var(--input-min-height);box-sizing:border-box;border-radius:var(--smoothly-input-border-radius)}.sc-smoothly-input-color-h[looks=\"border\"].sc-smoothly-input-color-s>smoothly-picker-menu smoothly-input,[looks=\"border\"].sc-smoothly-input-color-h{border:rgb(var(--smoothly-input-border)) solid 1px}[looks=\"border\"][readonly].sc-smoothly-input-color-h{border:transparent solid 1px}.sc-smoothly-input-color-h[looks=\"line\"].sc-smoothly-input-color-s>smoothly-picker-menu smoothly-input,[looks=\"line\"].sc-smoothly-input-color-h{border-bottom:rgb(var(--smoothly-input-border)) solid 1px}[looks=\"line\"][readonly].sc-smoothly-input-color-h{border-bottom:transparent solid 1px}[looks=\"grid\"].sc-smoothly-input-color-h{flex-grow:1;flex-basis:40%;box-shadow:0px 0px 0px 1px rgb(var(--smoothly-input-border));border:none}[looks=\"grid\"][readonly].sc-smoothly-input-color-h{box-shadow:0px 0px 0px 1px rgba(var(--smoothly-input-border-readonly))}[looks=\"transparent\"].sc-smoothly-input-color-h{border:none}[looks=\"transparent\"][readonly].sc-smoothly-input-color-h,[looks=\"transparent\"].sc-smoothly-input-color-h:not(:focus-within){background-color:transparent}[looks=\"transparent\"][readonly].sc-smoothly-input-color-h>input.sc-smoothly-input-color,[looks=\"transparent\"].sc-smoothly-input-color-h:not(:focus-within)>input.sc-smoothly-input-color{background:transparent}[looks=\"transparent\"].sc-smoothly-input-color-h:not([readonly]):focus-within{outline:1px solid rgb(var(--smoothly-input-border))}.sc-smoothly-input-color-h.sc-smoothly-input-color-s>[slot=label],.sc-smoothly-input-color-h .sc-smoothly-input-color-s>[slot=label],.sc-smoothly-input-color-h .label.sc-smoothly-input-color{position:absolute;top:.6rem;opacity:0.8;user-select:none;cursor:inherit;transform-origin:top left;transition:transform 100ms ease}.sc-smoothly-input-color-h.floating-label.sc-smoothly-input-color-s>[slot=label],.sc-smoothly-input-color-h.floating-label .sc-smoothly-input-color-s>[slot=label],.sc-smoothly-input-color-h.has-value.sc-smoothly-input-color-s>[slot=label],.sc-smoothly-input-color-h.has-value .sc-smoothly-input-color-s>[slot=label],.sc-smoothly-input-color-h[placeholder].sc-smoothly-input-color-s>[slot=label],.sc-smoothly-input-color-h[placeholder] .sc-smoothly-input-color-s>[slot=label],.sc-smoothly-input-color-h[readonly].sc-smoothly-input-color-s>[slot=label],.sc-smoothly-input-color-h[readonly] .sc-smoothly-input-color-s>[slot=label],.has-value.sc-smoothly-input-color-h .label.sc-smoothly-input-color,[placeholder].sc-smoothly-input-color-h .label.sc-smoothly-input-color,[readonly].sc-smoothly-input-color-h .label.sc-smoothly-input-color,.sc-smoothly-input-color-h:not([readonly]):focus-within .label.float-on-focus.sc-smoothly-input-color{top:.2rem;transform:scale(0.8)}.sc-smoothly-input-color-h:not([show-label]):not(.show-label) .label.sc-smoothly-input-color{display:none}.sc-smoothly-input-color-h{display:flex;position:relative;background-color:rgb(var(--smoothly-input-background));align-items:center;justify-content:center;padding-right:.5em}.sc-smoothly-input-color-h>smoothly-input.sc-smoothly-input-color{width:100%;--input-min-height:calc(var(--input-min-height) - 2px)}.sc-smoothly-input-color-h div.color-sample.sc-smoothly-input-color{height:2em;width:3em;margin-right:0.5rem;background-color:var(--hexCode);outline:1px solid rgb(var(--smoothly-input-border));border-radius:3px}[readonly].sc-smoothly-input-color-h smoothly-icon[name=options-outline].sc-smoothly-input-color{filter:opacity(60%)}.sc-smoothly-input-color-h>div.rgb-sliders.sc-smoothly-input-color{background-color:rgb(var(--smoothly-input-background));position:absolute;padding:1em 1em 1em 0;top:calc(var(--element-height) + .8em);left:0;box-sizing:border-box;z-index:10;border:1px solid rgb(var(--smoothly-input-border))}.sc-smoothly-input-color-h>div.rgb-sliders.sc-smoothly-input-color::before{content:\"\";transform:translate(2em, -0.55em) rotate(45deg);width:1em;height:1em;background-color:rgb(var(--smoothly-input-background));border-top:1px solid rgb(var(--smoothly-input-border));border-left:1px solid rgb(var(--smoothly-input-border));position:absolute;z-index:100;top:0em}.sc-smoothly-input-color-h>div.rgb-sliders.sc-smoothly-input-color>smoothly-toggle-switch.sc-smoothly-input-color{margin-left:auto;margin-right:1em;margin-bottom:1em}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color{padding:.5em 0}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color label.sc-smoothly-input-color{width:4em}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=r].sc-smoothly-input-color::-webkit-slider-runnable-track{background:linear-gradient(to left, rgb(255, var(--rgb-g), var(--rgb-b)), rgb(0, var(--rgb-g), var(--rgb-b)))}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=r].sc-smoothly-input-color::-moz-range-track{background:linear-gradient(to left, rgb(255, var(--rgb-g), var(--rgb-b)), rgb(0, var(--rgb-g), var(--rgb-b)))}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=r].sc-smoothly-input-color::-moz-range-thumb{background-color:red}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=r].sc-smoothly-input-color::-webkit-slider-thumb{background-color:red}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=g].sc-smoothly-input-color::-webkit-slider-runnable-track{background:linear-gradient(to left, rgb(var(--rgb-r), 255, var(--rgb-b)), rgb(var(--rgb-r), 0, var(--rgb-b)))}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=g].sc-smoothly-input-color::-moz-range-track{background:linear-gradient(to left, rgb(var(--rgb-r), 255, var(--rgb-b)), rgb(var(--rgb-r), 0, var(--rgb-b)))}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=g].sc-smoothly-input-color::-moz-range-thumb{background-color:green}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=g].sc-smoothly-input-color::-webkit-slider-thumb{background-color:green}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=b].sc-smoothly-input-color::-webkit-slider-runnable-track{background:linear-gradient(to left, rgb(var(--rgb-r), var(--rgb-g), 255), rgb(var(--rgb-r), var(--rgb-g), 0))}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=b].sc-smoothly-input-color::-moz-range-track{background:linear-gradient(to left, rgb(var(--rgb-r), var(--rgb-g), 255), rgb(var(--rgb-r), var(--rgb-g), 0))}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=b].sc-smoothly-input-color::-moz-range-thumb{background-color:blue}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=b].sc-smoothly-input-color::-webkit-slider-thumb{background-color:blue}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=h].sc-smoothly-input-color::-webkit-slider-runnable-track{background:linear-gradient(to right in hsl longer hue, red, red)}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=h].sc-smoothly-input-color::-moz-range-track{background:linear-gradient(to right in hsl longer hue, red, red)}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=h].sc-smoothly-input-color::-webkit-slider-thumb{background-color:hsl(var(--hsl-h), 100%, 50%)}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=h].sc-smoothly-input-color::-moz-range-thumb{background-color:hsl(var(--hsl-h), 100%, 50%)}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=s].sc-smoothly-input-color::-webkit-slider-runnable-track{background:linear-gradient(to right, hsl(var(--hsl-h), 0%, 50%), hsl(var(--hsl-h), 100%, 50%))}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=s].sc-smoothly-input-color::-moz-range-track{background:linear-gradient(to right, hsl(var(--hsl-h), 0%, 50%), hsl(var(--hsl-h), 100%, 50%))}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=s].sc-smoothly-input-color::-moz-range-thumb{background-color:hsl(var(--hsl-h), var(--hsl-s), 50%)}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=s].sc-smoothly-input-color::-webkit-slider-thumb{background-color:hsl(var(--hsl-h), var(--hsl-s), 50%)}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=l].sc-smoothly-input-color::-moz-range-track{background:linear-gradient(to right, black, white)}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=l].sc-smoothly-input-color::-webkit-slider-runnable-track{background:linear-gradient(to right, black, white)}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=l].sc-smoothly-input-color::-moz-range-thumb{background-color:#777}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=l].sc-smoothly-input-color::-webkit-slider-thumb{background-color:#777}";
9198
- const SmoothlyInputColorStyle0 = styleCss$Z;
9203
+ const styleCss$_ = ".sc-smoothly-input-color-h{--input-padding-side:.5rem;--input-value-padding-top:1.25rem;--input-value-padding-bottom:.25rem;--input-min-height:3rem;min-height:var(--input-min-height);box-sizing:border-box;border-radius:var(--smoothly-input-border-radius)}.sc-smoothly-input-color-h[looks=\"border\"].sc-smoothly-input-color-s>smoothly-picker-menu smoothly-input,[looks=\"border\"].sc-smoothly-input-color-h{border:rgb(var(--smoothly-input-border)) solid 1px}[looks=\"border\"][readonly].sc-smoothly-input-color-h{border:transparent solid 1px}.sc-smoothly-input-color-h[looks=\"line\"].sc-smoothly-input-color-s>smoothly-picker-menu smoothly-input,[looks=\"line\"].sc-smoothly-input-color-h{border-bottom:rgb(var(--smoothly-input-border)) solid 1px}[looks=\"line\"][readonly].sc-smoothly-input-color-h{border-bottom:transparent solid 1px}[looks=\"grid\"].sc-smoothly-input-color-h{flex-grow:1;flex-basis:40%;box-shadow:0px 0px 0px 1px rgb(var(--smoothly-input-border));border:none}[looks=\"grid\"][readonly].sc-smoothly-input-color-h{box-shadow:0px 0px 0px 1px rgba(var(--smoothly-input-border-readonly))}[looks=\"transparent\"].sc-smoothly-input-color-h{border:none}[looks=\"transparent\"][readonly].sc-smoothly-input-color-h,[looks=\"transparent\"].sc-smoothly-input-color-h:not(:focus-within){background-color:transparent}[looks=\"transparent\"][readonly].sc-smoothly-input-color-h>input.sc-smoothly-input-color,[looks=\"transparent\"].sc-smoothly-input-color-h:not(:focus-within)>input.sc-smoothly-input-color{background:transparent}[looks=\"transparent\"].sc-smoothly-input-color-h:not([readonly]):focus-within{outline:1px solid rgb(var(--smoothly-input-border))}.sc-smoothly-input-color-h.sc-smoothly-input-color-s>[slot=label],.sc-smoothly-input-color-h .sc-smoothly-input-color-s>[slot=label],.sc-smoothly-input-color-h .label.sc-smoothly-input-color{position:absolute;top:.6rem;opacity:0.8;user-select:none;cursor:inherit;transform-origin:top left;transition:transform 100ms ease}.sc-smoothly-input-color-h.floating-label.sc-smoothly-input-color-s>[slot=label],.sc-smoothly-input-color-h.floating-label .sc-smoothly-input-color-s>[slot=label],.sc-smoothly-input-color-h.has-value.sc-smoothly-input-color-s>[slot=label],.sc-smoothly-input-color-h.has-value .sc-smoothly-input-color-s>[slot=label],.sc-smoothly-input-color-h[placeholder].sc-smoothly-input-color-s>[slot=label],.sc-smoothly-input-color-h[placeholder] .sc-smoothly-input-color-s>[slot=label],.sc-smoothly-input-color-h[readonly].sc-smoothly-input-color-s>[slot=label],.sc-smoothly-input-color-h[readonly] .sc-smoothly-input-color-s>[slot=label],.has-value.sc-smoothly-input-color-h .label.sc-smoothly-input-color,[placeholder].sc-smoothly-input-color-h .label.sc-smoothly-input-color,[readonly].sc-smoothly-input-color-h .label.sc-smoothly-input-color,.sc-smoothly-input-color-h:not([readonly]):focus-within .label.float-on-focus.sc-smoothly-input-color{top:.2rem;transform:scale(0.8)}.sc-smoothly-input-color-h:not([show-label]):not(.show-label) .label.sc-smoothly-input-color{display:none}.sc-smoothly-input-color-h{display:flex;position:relative;background-color:rgb(var(--smoothly-input-background));align-items:center;justify-content:center;padding-right:.5em}.sc-smoothly-input-color-h>smoothly-input.sc-smoothly-input-color{width:100%;--input-min-height:calc(var(--input-min-height) - 2px)}.sc-smoothly-input-color-h div.color-sample.sc-smoothly-input-color{height:2em;width:3em;margin-right:0.5rem;background-color:var(--hexCode);outline:1px solid rgb(var(--smoothly-input-border));border-radius:3px}[readonly].sc-smoothly-input-color-h smoothly-icon[name=options-outline].sc-smoothly-input-color{filter:opacity(60%)}.sc-smoothly-input-color-h>div.rgb-sliders.sc-smoothly-input-color{background-color:rgb(var(--smoothly-input-background));position:absolute;padding:1em 1em 1em 0;top:calc(var(--element-height) + .8em);left:0;box-sizing:border-box;z-index:10;border:1px solid rgb(var(--smoothly-input-border))}.sc-smoothly-input-color-h>div.rgb-sliders.sc-smoothly-input-color::before{content:\"\";transform:translate(2em, -0.55em) rotate(45deg);width:1em;height:1em;background-color:rgb(var(--smoothly-input-background));border-top:1px solid rgb(var(--smoothly-input-border));border-left:1px solid rgb(var(--smoothly-input-border));position:absolute;z-index:100;top:0em}.sc-smoothly-input-color-h>div.rgb-sliders.sc-smoothly-input-color>smoothly-toggle-switch.sc-smoothly-input-color{margin-left:auto;margin-right:1em;margin-bottom:1em}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color{padding:.5em 0}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color label.sc-smoothly-input-color{width:4em}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=r].sc-smoothly-input-color::-webkit-slider-runnable-track{background:linear-gradient(to left, rgb(255, var(--rgb-g), var(--rgb-b)), rgb(0, var(--rgb-g), var(--rgb-b)))}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=r].sc-smoothly-input-color::-moz-range-track{background:linear-gradient(to left, rgb(255, var(--rgb-g), var(--rgb-b)), rgb(0, var(--rgb-g), var(--rgb-b)))}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=r].sc-smoothly-input-color::-moz-range-thumb{background-color:red}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=r].sc-smoothly-input-color::-webkit-slider-thumb{background-color:red}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=g].sc-smoothly-input-color::-webkit-slider-runnable-track{background:linear-gradient(to left, rgb(var(--rgb-r), 255, var(--rgb-b)), rgb(var(--rgb-r), 0, var(--rgb-b)))}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=g].sc-smoothly-input-color::-moz-range-track{background:linear-gradient(to left, rgb(var(--rgb-r), 255, var(--rgb-b)), rgb(var(--rgb-r), 0, var(--rgb-b)))}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=g].sc-smoothly-input-color::-moz-range-thumb{background-color:green}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=g].sc-smoothly-input-color::-webkit-slider-thumb{background-color:green}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=b].sc-smoothly-input-color::-webkit-slider-runnable-track{background:linear-gradient(to left, rgb(var(--rgb-r), var(--rgb-g), 255), rgb(var(--rgb-r), var(--rgb-g), 0))}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=b].sc-smoothly-input-color::-moz-range-track{background:linear-gradient(to left, rgb(var(--rgb-r), var(--rgb-g), 255), rgb(var(--rgb-r), var(--rgb-g), 0))}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=b].sc-smoothly-input-color::-moz-range-thumb{background-color:blue}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=b].sc-smoothly-input-color::-webkit-slider-thumb{background-color:blue}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=h].sc-smoothly-input-color::-webkit-slider-runnable-track{background:linear-gradient(to right in hsl longer hue, red, red)}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=h].sc-smoothly-input-color::-moz-range-track{background:linear-gradient(to right in hsl longer hue, red, red)}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=h].sc-smoothly-input-color::-webkit-slider-thumb{background-color:hsl(var(--hsl-h), 100%, 50%)}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=h].sc-smoothly-input-color::-moz-range-thumb{background-color:hsl(var(--hsl-h), 100%, 50%)}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=s].sc-smoothly-input-color::-webkit-slider-runnable-track{background:linear-gradient(to right, hsl(var(--hsl-h), 0%, 50%), hsl(var(--hsl-h), 100%, 50%))}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=s].sc-smoothly-input-color::-moz-range-track{background:linear-gradient(to right, hsl(var(--hsl-h), 0%, 50%), hsl(var(--hsl-h), 100%, 50%))}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=s].sc-smoothly-input-color::-moz-range-thumb{background-color:hsl(var(--hsl-h), var(--hsl-s), 50%)}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=s].sc-smoothly-input-color::-webkit-slider-thumb{background-color:hsl(var(--hsl-h), var(--hsl-s), 50%)}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=l].sc-smoothly-input-color::-moz-range-track{background:linear-gradient(to right, black, white)}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=l].sc-smoothly-input-color::-webkit-slider-runnable-track{background:linear-gradient(to right, black, white)}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=l].sc-smoothly-input-color::-moz-range-thumb{background-color:#777}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=l].sc-smoothly-input-color::-webkit-slider-thumb{background-color:#777}";
9204
+ const SmoothlyInputColorStyle0 = styleCss$_;
9199
9205
 
9200
9206
  const SmoothlyInputColor = class {
9201
9207
  constructor(hostRef) {
@@ -9340,7 +9346,7 @@ const SmoothlyInputColor = class {
9340
9346
  }
9341
9347
  render() {
9342
9348
  var _a, _b, _c, _d, _e, _f;
9343
- return (index.h(index.Host, { key: '51a16fcfe1910a90d2700e8d0cc4dffb55117f0a', style: {
9349
+ return (index.h(index.Host, { key: '466b4cea7cfcb6d6466842e21de641291237bc59', style: {
9344
9350
  "--hexCode": this.value,
9345
9351
  "--rgb-r": `${Math.round((_a = this.rgb.r) !== null && _a !== void 0 ? _a : 0)}`,
9346
9352
  "--rgb-g": `${Math.round((_b = this.rgb.g) !== null && _b !== void 0 ? _b : 0)}`,
@@ -9349,7 +9355,7 @@ const SmoothlyInputColor = class {
9349
9355
  "--hsl-s": `${Math.round((_e = this.hsl.s) !== null && _e !== void 0 ? _e : 0)}%`,
9350
9356
  "--hsl-l": `${Math.round((_f = this.hsl.l) !== null && _f !== void 0 ? _f : 0)}%`,
9351
9357
  "--element-height": `${this.element.clientHeight}px`,
9352
- } }, index.h("smoothly-input", { key: 'c1562bc77088d0385845434d8d1b008fd6302fc4', value: this.value, name: this.name, looks: undefined, color: this.color, type: "hex-color", showLabel: this.showLabel, readonly: this.readonly, onSmoothlyInput: event => (event === null || event === void 0 ? void 0 : event.stopPropagation(), this.hexInputHandler(event.detail[this.name])) }, index.h("slot", { key: '86121a306bcb0036a14ece88dc79b715305f6363' })), index.h("div", { key: '017725837b67c695fbf8aa34b9f0fb73c2cf30bd', class: "color-sample" }), index.h("smoothly-icon", { key: '8ecb0d806407e75b95b766b51a91be4198cd407e', color: this.color, name: "options-outline", size: "small", onClick: () => !this.readonly && this.openDropdown() }), this.open && !this.readonly && (index.h("div", { key: '2bb350f021941d7196b9c5a3f0654af0efebfa53', class: "rgb-sliders" }, index.h("smoothly-toggle-switch", { key: '96b9582749ffa84c28a7579689e51a5f2965f78d', title: `${this.sliderMode === "rgb" ? "To HSL" : "To RGB"}`, onSmoothlyToggleSwitchChange: event => this.handleSwitchMode(event), size: "tiny", checkmark: false, selected: this.sliderMode === "hsl" }), Object.entries(this.rgb).map(([key, value]) => (index.h("smoothly-input-range", { style: this.sliderMode != "rgb" ? { display: "none" } : {}, name: key, min: 0, max: 255, color: undefined, type: "text", value: value, step: 1, outputSide: "right", onSmoothlyInput: event => this.sliderInputHandler(event), label: key.toUpperCase() }))), Object.entries(this.hsl).map(([key, value]) => (index.h("smoothly-input-range", { style: this.sliderMode != "hsl" ? { display: "none" } : {}, name: key, min: 0, max: key === "h" ? 359 : 1, color: undefined, type: key === "s" || key === "l" ? "percent" : "text", value: (key === "s" || key === "l") && value ? value / 100 : value, step: key === "s" || key === "l" ? 0.01 : 1, outputSide: "right", onSmoothlyInput: event => this.sliderInputHandler(event), label: key.toUpperCase() })))))));
9358
+ } }, index.h("smoothly-input", { key: '9425ebd85ac1b88b6a068ead8c0c6e5dcdffc20b', value: this.value, name: this.name, looks: undefined, color: this.color, type: "hex-color", showLabel: this.showLabel, readonly: this.readonly, onSmoothlyInput: event => (event === null || event === void 0 ? void 0 : event.stopPropagation(), this.hexInputHandler(event.detail[this.name])) }, index.h("slot", { key: 'cb7c28f919f99ea8972da528f06b6784772ec65d' })), index.h("div", { key: '21a253aa34394b7778dd37f8ccee2b34c7f12656', class: "color-sample" }), index.h("smoothly-icon", { key: 'cfae43c70c83076663323af117eac04df5712c40', color: this.color, name: "options-outline", size: "small", onClick: () => !this.readonly && this.openDropdown() }), this.open && !this.readonly && (index.h("div", { key: '569cfca78b025b12dfe8d5275f4a273fe3894567', class: "rgb-sliders" }, index.h("smoothly-toggle-switch", { key: '72a8ddc92ff19fb4e0b2020bf2387c3ede8831b3', title: `${this.sliderMode === "rgb" ? "To HSL" : "To RGB"}`, onSmoothlyToggleSwitchChange: event => this.handleSwitchMode(event), size: "tiny", checkmark: false, selected: this.sliderMode === "hsl" }), Object.entries(this.rgb).map(([key, value]) => (index.h("smoothly-input-range", { style: this.sliderMode != "rgb" ? { display: "none" } : {}, name: key, min: 0, max: 255, color: undefined, type: "text", value: value, step: 1, outputSide: "right", onSmoothlyInput: event => this.sliderInputHandler(event), label: key.toUpperCase() }))), Object.entries(this.hsl).map(([key, value]) => (index.h("smoothly-input-range", { style: this.sliderMode != "hsl" ? { display: "none" } : {}, name: key, min: 0, max: key === "h" ? 359 : 1, color: undefined, type: key === "s" || key === "l" ? "percent" : "text", value: (key === "s" || key === "l") && value ? value / 100 : value, step: key === "s" || key === "l" ? 0.01 : 1, outputSide: "right", onSmoothlyInput: event => this.sliderInputHandler(event), label: key.toUpperCase() })))))));
9353
9359
  }
9354
9360
  get element() { return index.getElement(this); }
9355
9361
  static get watchers() { return {
@@ -9363,13 +9369,13 @@ const SmoothlyInputColorDemo = class {
9363
9369
  index.registerInstance(this, hostRef);
9364
9370
  }
9365
9371
  render() {
9366
- return (index.h(index.Host, { key: 'a268b3a8769165e116c77eb1f8f8e049afc83595' }, index.h("h2", { key: 'c11a162fdd641b19cb4427dae013994e29e1da6f' }, "Color"), index.h("smoothly-input-color", { key: 'fc3844f0c02372dc9a7432dae694ba4f986e9a5e', name: "color" }, "Choose color")));
9372
+ return (index.h(index.Host, { key: '5dd338ba5962a799023edc2ee9b78da7aae650fe' }, index.h("h2", { key: 'dd37cbc43c310e3f7437350180eb181bdfde9501' }, "Color"), index.h("smoothly-input-color", { key: '11182984e7bf765803274574e151a9f98d1d17e8', name: "color" }, "Choose color")));
9367
9373
  }
9368
9374
  };
9369
9375
  SmoothlyInputColorDemo.style = "style.css";
9370
9376
 
9371
- const styleCss$Y = ".sc-smoothly-input-date-h{--input-padding-side:.5rem;--input-value-padding-top:1.25rem;--input-value-padding-bottom:.25rem;--input-min-height:3rem;min-height:var(--input-min-height);box-sizing:border-box;border-radius:var(--smoothly-input-border-radius)}.sc-smoothly-input-date-h[looks=\"border\"].sc-smoothly-input-date-s>smoothly-picker-menu smoothly-input,[looks=\"border\"].sc-smoothly-input-date-h{border:rgb(var(--smoothly-input-border)) solid 1px}[looks=\"border\"][readonly].sc-smoothly-input-date-h{border:transparent solid 1px}.sc-smoothly-input-date-h[looks=\"line\"].sc-smoothly-input-date-s>smoothly-picker-menu smoothly-input,[looks=\"line\"].sc-smoothly-input-date-h{border-bottom:rgb(var(--smoothly-input-border)) solid 1px}[looks=\"line\"][readonly].sc-smoothly-input-date-h{border-bottom:transparent solid 1px}[looks=\"grid\"].sc-smoothly-input-date-h{flex-grow:1;flex-basis:40%;box-shadow:0px 0px 0px 1px rgb(var(--smoothly-input-border));border:none}[looks=\"grid\"][readonly].sc-smoothly-input-date-h{box-shadow:0px 0px 0px 1px rgba(var(--smoothly-input-border-readonly))}[looks=\"transparent\"].sc-smoothly-input-date-h{border:none}[looks=\"transparent\"][readonly].sc-smoothly-input-date-h,[looks=\"transparent\"].sc-smoothly-input-date-h:not(:focus-within){background-color:transparent}[looks=\"transparent\"][readonly].sc-smoothly-input-date-h>input.sc-smoothly-input-date,[looks=\"transparent\"].sc-smoothly-input-date-h:not(:focus-within)>input.sc-smoothly-input-date{background:transparent}[looks=\"transparent\"].sc-smoothly-input-date-h:not([readonly]):focus-within{outline:1px solid rgb(var(--smoothly-input-border))}.sc-smoothly-input-date-h.sc-smoothly-input-date-s>[slot=label],.sc-smoothly-input-date-h .sc-smoothly-input-date-s>[slot=label],.sc-smoothly-input-date-h .label.sc-smoothly-input-date{position:absolute;top:.6rem;opacity:0.8;user-select:none;cursor:inherit;transform-origin:top left;transition:transform 100ms ease}.sc-smoothly-input-date-h.floating-label.sc-smoothly-input-date-s>[slot=label],.sc-smoothly-input-date-h.floating-label .sc-smoothly-input-date-s>[slot=label],.sc-smoothly-input-date-h.has-value.sc-smoothly-input-date-s>[slot=label],.sc-smoothly-input-date-h.has-value .sc-smoothly-input-date-s>[slot=label],.sc-smoothly-input-date-h[placeholder].sc-smoothly-input-date-s>[slot=label],.sc-smoothly-input-date-h[placeholder] .sc-smoothly-input-date-s>[slot=label],.sc-smoothly-input-date-h[readonly].sc-smoothly-input-date-s>[slot=label],.sc-smoothly-input-date-h[readonly] .sc-smoothly-input-date-s>[slot=label],.has-value.sc-smoothly-input-date-h .label.sc-smoothly-input-date,[placeholder].sc-smoothly-input-date-h .label.sc-smoothly-input-date,[readonly].sc-smoothly-input-date-h .label.sc-smoothly-input-date,.sc-smoothly-input-date-h:not([readonly]):focus-within .label.float-on-focus.sc-smoothly-input-date{top:.2rem;transform:scale(0.8)}.sc-smoothly-input-date-h:not([show-label]):not(.show-label) .label.sc-smoothly-input-date{display:none}.sc-smoothly-input-date-h{display:flex;position:relative;max-width:100vw;background-color:rgb(var(--smoothly-input-background));box-sizing:border-box;min-height:var(--input-min-height)}.sc-smoothly-input-date-h>smoothly-input.sc-smoothly-input-date{width:100%;--input-min-height:calc(var(--input-min-height) - 2px)}.sc-smoothly-input-date-h>smoothly-input.sc-smoothly-input-date>div.sc-smoothly-input-date>input.sc-smoothly-input-date{cursor:pointer}[readonly].sc-smoothly-input-date-h,[readonly].sc-smoothly-input-date-h>smoothly-input.sc-smoothly-input-date>div.sc-smoothly-input-date>input.sc-smoothly-input-date{cursor:not-allowed}[looks=transparent].sc-smoothly-input-date-h smoothly-input.sc-smoothly-input-date{outline:none}.sc-smoothly-input-date-h>nav.sc-smoothly-input-date{position:absolute;z-index:10;top:4em;background-color:rgb(var(--smoothly-input-background));min-width:18em}.sc-smoothly-input-date-h>nav.sc-smoothly-input-date>smoothly-calendar.sc-smoothly-input-date::before{content:\"\";box-sizing:border-box;position:absolute;top:1px;z-index:9;transform:translate(2em, -0.55em) rotate(45deg);width:1em;height:1em;background-color:rgb(var(--smoothly-input-background));border-top:1px solid rgb(var(--smoothly-input-border));border-left:1px solid rgb(var(--smoothly-input-border))}.sc-smoothly-input-date-h>span.icons.sc-smoothly-input-date{display:flex;flex-direction:row;align-items:center;margin-right:.2em}@media screen and (min-width: 400px){.sc-smoothly-input-date-h>nav.sc-smoothly-input-date{position:absolute;z-index:10;top:4em;background-color:rgb(var(--smoothly-input-background));max-width:22em}}";
9372
- const SmoothlyInputDateStyle0 = styleCss$Y;
9377
+ const styleCss$Z = ".sc-smoothly-input-date-h{--input-padding-side:.5rem;--input-value-padding-top:1.25rem;--input-value-padding-bottom:.25rem;--input-min-height:3rem;min-height:var(--input-min-height);box-sizing:border-box;border-radius:var(--smoothly-input-border-radius)}.sc-smoothly-input-date-h[looks=\"border\"].sc-smoothly-input-date-s>smoothly-picker-menu smoothly-input,[looks=\"border\"].sc-smoothly-input-date-h{border:rgb(var(--smoothly-input-border)) solid 1px}[looks=\"border\"][readonly].sc-smoothly-input-date-h{border:transparent solid 1px}.sc-smoothly-input-date-h[looks=\"line\"].sc-smoothly-input-date-s>smoothly-picker-menu smoothly-input,[looks=\"line\"].sc-smoothly-input-date-h{border-bottom:rgb(var(--smoothly-input-border)) solid 1px}[looks=\"line\"][readonly].sc-smoothly-input-date-h{border-bottom:transparent solid 1px}[looks=\"grid\"].sc-smoothly-input-date-h{flex-grow:1;flex-basis:40%;box-shadow:0px 0px 0px 1px rgb(var(--smoothly-input-border));border:none}[looks=\"grid\"][readonly].sc-smoothly-input-date-h{box-shadow:0px 0px 0px 1px rgba(var(--smoothly-input-border-readonly))}[looks=\"transparent\"].sc-smoothly-input-date-h{border:none}[looks=\"transparent\"][readonly].sc-smoothly-input-date-h,[looks=\"transparent\"].sc-smoothly-input-date-h:not(:focus-within){background-color:transparent}[looks=\"transparent\"][readonly].sc-smoothly-input-date-h>input.sc-smoothly-input-date,[looks=\"transparent\"].sc-smoothly-input-date-h:not(:focus-within)>input.sc-smoothly-input-date{background:transparent}[looks=\"transparent\"].sc-smoothly-input-date-h:not([readonly]):focus-within{outline:1px solid rgb(var(--smoothly-input-border))}.sc-smoothly-input-date-h.sc-smoothly-input-date-s>[slot=label],.sc-smoothly-input-date-h .sc-smoothly-input-date-s>[slot=label],.sc-smoothly-input-date-h .label.sc-smoothly-input-date{position:absolute;top:.6rem;opacity:0.8;user-select:none;cursor:inherit;transform-origin:top left;transition:transform 100ms ease}.sc-smoothly-input-date-h.floating-label.sc-smoothly-input-date-s>[slot=label],.sc-smoothly-input-date-h.floating-label .sc-smoothly-input-date-s>[slot=label],.sc-smoothly-input-date-h.has-value.sc-smoothly-input-date-s>[slot=label],.sc-smoothly-input-date-h.has-value .sc-smoothly-input-date-s>[slot=label],.sc-smoothly-input-date-h[placeholder].sc-smoothly-input-date-s>[slot=label],.sc-smoothly-input-date-h[placeholder] .sc-smoothly-input-date-s>[slot=label],.sc-smoothly-input-date-h[readonly].sc-smoothly-input-date-s>[slot=label],.sc-smoothly-input-date-h[readonly] .sc-smoothly-input-date-s>[slot=label],.has-value.sc-smoothly-input-date-h .label.sc-smoothly-input-date,[placeholder].sc-smoothly-input-date-h .label.sc-smoothly-input-date,[readonly].sc-smoothly-input-date-h .label.sc-smoothly-input-date,.sc-smoothly-input-date-h:not([readonly]):focus-within .label.float-on-focus.sc-smoothly-input-date{top:.2rem;transform:scale(0.8)}.sc-smoothly-input-date-h:not([show-label]):not(.show-label) .label.sc-smoothly-input-date{display:none}.sc-smoothly-input-date-h{display:flex;position:relative;max-width:100vw;background-color:rgb(var(--smoothly-input-background));box-sizing:border-box;min-height:var(--input-min-height)}.sc-smoothly-input-date-h>smoothly-input.sc-smoothly-input-date{width:100%;--input-min-height:calc(var(--input-min-height) - 2px)}.sc-smoothly-input-date-h>smoothly-input.sc-smoothly-input-date>div.sc-smoothly-input-date>input.sc-smoothly-input-date{cursor:pointer}[readonly].sc-smoothly-input-date-h,[readonly].sc-smoothly-input-date-h>smoothly-input.sc-smoothly-input-date>div.sc-smoothly-input-date>input.sc-smoothly-input-date{cursor:not-allowed}[looks=transparent].sc-smoothly-input-date-h smoothly-input.sc-smoothly-input-date{outline:none}.sc-smoothly-input-date-h>nav.sc-smoothly-input-date{position:absolute;z-index:10;top:4em;background-color:rgb(var(--smoothly-input-background));min-width:18em}.sc-smoothly-input-date-h>nav.sc-smoothly-input-date>smoothly-calendar.sc-smoothly-input-date::before{content:\"\";box-sizing:border-box;position:absolute;top:1px;z-index:9;transform:translate(2em, -0.55em) rotate(45deg);width:1em;height:1em;background-color:rgb(var(--smoothly-input-background));border-top:1px solid rgb(var(--smoothly-input-border));border-left:1px solid rgb(var(--smoothly-input-border))}.sc-smoothly-input-date-h>span.icons.sc-smoothly-input-date{display:flex;flex-direction:row;align-items:center;margin-right:.2em}@media screen and (min-width: 400px){.sc-smoothly-input-date-h>nav.sc-smoothly-input-date{position:absolute;z-index:10;top:4em;background-color:rgb(var(--smoothly-input-background));max-width:22em}}";
9378
+ const SmoothlyInputDateStyle0 = styleCss$Z;
9373
9379
 
9374
9380
  const SmoothlyInputDate = class {
9375
9381
  constructor(hostRef) {
@@ -9458,13 +9464,13 @@ const SmoothlyInputDate = class {
9458
9464
  event.stopPropagation();
9459
9465
  }
9460
9466
  render() {
9461
- return (index.h(index.Host, { key: '5b9654434c2fba857bf3ef7bbf847af2515eb984' }, index.h("smoothly-input", { key: '80e721c34de7fe959f47680d50806adfa75e3b01', color: this.color, looks: this.looks == "transparent" ? this.looks : undefined, name: this.name, onFocus: () => !this.readonly && (this.open = !this.open), onClick: () => !this.readonly && (this.open = !this.open), readonly: this.readonly, invalid: this.invalid, type: "date", value: this.value, showLabel: this.showLabel, onSmoothlyInputLoad: e => e.stopPropagation(), onSmoothlyInput: e => {
9467
+ return (index.h(index.Host, { key: '66e271ebab444435ebbd5c52ac8bdb206744fdc1' }, index.h("smoothly-input", { key: '07f1065acefd25523bbd8fe6baa510cc6e794518', color: this.color, looks: this.looks == "transparent" ? this.looks : undefined, name: this.name, onFocus: () => !this.readonly && (this.open = !this.open), onClick: () => !this.readonly && (this.open = !this.open), readonly: this.readonly, invalid: this.invalid, type: "date", value: this.value, showLabel: this.showLabel, onSmoothlyInputLoad: e => e.stopPropagation(), onSmoothlyInput: e => {
9462
9468
  e.stopPropagation();
9463
9469
  this.value = e.detail[this.name];
9464
- } }, index.h("slot", { key: 'd9e47ad7fed79355051a9d00a4c1175b5166b3c9' })), index.h("span", { key: '76afdd4bfc5ad1c4be6ec1550e0eef35b9a6da77', class: "icons" }, index.h("slot", { key: '66ff5380e4d8b3681b80ebe51afd35846788e722', name: "end" })), this.open && !this.readonly && (index.h("nav", { key: '3e3d8a0e07a83d33d4495d49aaf4d014dd1d22ed' }, index.h("smoothly-calendar", { key: '746927467a60b22fae380f62980bd6b1d3aa3a32', doubleInput: false, value: this.value, onSmoothlyValueChange: event => {
9470
+ } }, index.h("slot", { key: '6f38b7267ee028b314ba878be4cb1ea6bfe47559' })), index.h("span", { key: '9098841d1407d736a13ea5f43a0af2ed152da688', class: "icons" }, index.h("slot", { key: 'a4286689f848b90d86cac835706f711a60eecd72', name: "end" })), this.open && !this.readonly && (index.h("nav", { key: '1905727c2e5117ce3cb4454359a666a794fa61ee' }, index.h("smoothly-calendar", { key: '5c3cb5875ff1400326d3501ebbd86fa57d141c60', doubleInput: false, value: this.value, onSmoothlyValueChange: event => {
9465
9471
  this.value = event.detail;
9466
9472
  event.stopPropagation();
9467
- }, max: this.max, min: this.min }, index.h("div", { key: '81c87991d320895ca9204945cf7ddee642b64c2e', slot: "year-label" }, index.h("slot", { key: '13f321ef61b4cf16e19a51852f28c0fa6091279b', name: "year-label" })), index.h("div", { key: '3a82f53e0fbfc6952110bbcefc82116d1d3764a9', slot: "month-label" }, index.h("slot", { key: '5448271cb9b19de99aef07a029facf8aeed59a46', name: "month-label" })))))));
9473
+ }, max: this.max, min: this.min }, index.h("div", { key: '485b37e07a8e5aac04b1b5e79c6a62b7f8d41a9c', slot: "year-label" }, index.h("slot", { key: '6107cb5ddfe07645e34d9d5e88d40ba8a279119b', name: "year-label" })), index.h("div", { key: '623383481f6a231577c70e429b27ff1481fdd74c', slot: "month-label" }, index.h("slot", { key: 'cfa25c65448b1160591d73486863a8dac61560a4', name: "month-label" })))))));
9468
9474
  }
9469
9475
  get element() { return index.getElement(this); }
9470
9476
  static get watchers() { return {
@@ -9473,8 +9479,8 @@ const SmoothlyInputDate = class {
9473
9479
  };
9474
9480
  SmoothlyInputDate.style = SmoothlyInputDateStyle0;
9475
9481
 
9476
- const styleCss$X = ".sc-smoothly-input-date-range-h{--input-padding-side:.5rem;--input-value-padding-top:1.25rem;--input-value-padding-bottom:.25rem;--input-min-height:3rem;min-height:var(--input-min-height);box-sizing:border-box;border-radius:var(--smoothly-input-border-radius)}.sc-smoothly-input-date-range-h[looks=\"border\"].sc-smoothly-input-date-range-s>smoothly-picker-menu smoothly-input,[looks=\"border\"].sc-smoothly-input-date-range-h{border:rgb(var(--smoothly-input-border)) solid 1px}[looks=\"border\"][readonly].sc-smoothly-input-date-range-h{border:transparent solid 1px}.sc-smoothly-input-date-range-h[looks=\"line\"].sc-smoothly-input-date-range-s>smoothly-picker-menu smoothly-input,[looks=\"line\"].sc-smoothly-input-date-range-h{border-bottom:rgb(var(--smoothly-input-border)) solid 1px}[looks=\"line\"][readonly].sc-smoothly-input-date-range-h{border-bottom:transparent solid 1px}[looks=\"grid\"].sc-smoothly-input-date-range-h{flex-grow:1;flex-basis:40%;box-shadow:0px 0px 0px 1px rgb(var(--smoothly-input-border));border:none}[looks=\"grid\"][readonly].sc-smoothly-input-date-range-h{box-shadow:0px 0px 0px 1px rgba(var(--smoothly-input-border-readonly))}[looks=\"transparent\"].sc-smoothly-input-date-range-h{border:none}[looks=\"transparent\"][readonly].sc-smoothly-input-date-range-h,[looks=\"transparent\"].sc-smoothly-input-date-range-h:not(:focus-within){background-color:transparent}[looks=\"transparent\"][readonly].sc-smoothly-input-date-range-h>input.sc-smoothly-input-date-range,[looks=\"transparent\"].sc-smoothly-input-date-range-h:not(:focus-within)>input.sc-smoothly-input-date-range{background:transparent}[looks=\"transparent\"].sc-smoothly-input-date-range-h:not([readonly]):focus-within{outline:1px solid rgb(var(--smoothly-input-border))}.sc-smoothly-input-date-range-h.sc-smoothly-input-date-range-s>[slot=label],.sc-smoothly-input-date-range-h .sc-smoothly-input-date-range-s>[slot=label],.sc-smoothly-input-date-range-h .label.sc-smoothly-input-date-range{position:absolute;top:.6rem;opacity:0.8;user-select:none;cursor:inherit;transform-origin:top left;transition:transform 100ms ease}.sc-smoothly-input-date-range-h.floating-label.sc-smoothly-input-date-range-s>[slot=label],.sc-smoothly-input-date-range-h.floating-label .sc-smoothly-input-date-range-s>[slot=label],.sc-smoothly-input-date-range-h.has-value.sc-smoothly-input-date-range-s>[slot=label],.sc-smoothly-input-date-range-h.has-value .sc-smoothly-input-date-range-s>[slot=label],.sc-smoothly-input-date-range-h[placeholder].sc-smoothly-input-date-range-s>[slot=label],.sc-smoothly-input-date-range-h[placeholder] .sc-smoothly-input-date-range-s>[slot=label],.sc-smoothly-input-date-range-h[readonly].sc-smoothly-input-date-range-s>[slot=label],.sc-smoothly-input-date-range-h[readonly] .sc-smoothly-input-date-range-s>[slot=label],.has-value.sc-smoothly-input-date-range-h .label.sc-smoothly-input-date-range,[placeholder].sc-smoothly-input-date-range-h .label.sc-smoothly-input-date-range,[readonly].sc-smoothly-input-date-range-h .label.sc-smoothly-input-date-range,.sc-smoothly-input-date-range-h:not([readonly]):focus-within .label.float-on-focus.sc-smoothly-input-date-range{top:.2rem;transform:scale(0.8)}.sc-smoothly-input-date-range-h:not([show-label]):not(.show-label) .label.sc-smoothly-input-date-range{display:none}.sc-smoothly-input-date-range-h{position:relative;display:flex;background-color:rgb(var(--smoothly-input-background))}.sc-smoothly-input-date-range-h:focus-within smoothly-input.sc-smoothly-input-date-range{outline:none}.sc-smoothly-input-date-range-h>section.sc-smoothly-input-date-range>smoothly-input.sc-smoothly-input-date-range>div.sc-smoothly-input-date-range>input.sc-smoothly-input-date-range{cursor:pointer}[readonly].sc-smoothly-input-date-range-h,[readonly].sc-smoothly-input-date-range-h>section.sc-smoothly-input-date-range>smoothly-input.sc-smoothly-input-date-range>div.sc-smoothly-input-date-range>input.sc-smoothly-input-date-range{cursor:not-allowed}.sc-smoothly-input-date-range-h>nav.sc-smoothly-input-date-range{position:absolute;z-index:10;top:4em;background-color:rgb(var(--smoothly-input-background));max-width:22em;min-width:18em}.sc-smoothly-input-date-range-h>nav.sc-smoothly-input-date-range>smoothly-calendar.sc-smoothly-input-date-range::before{content:\"\";position:absolute;box-sizing:border-box;top:1px;left:-7em;z-index:9;transform:translate(10em, -0.55em) rotate(45deg);width:1em;height:1em;background-color:rgb(var(--smoothly-input-background));border-top:1px solid rgb(var(--smoothly-input-border));border-left:1px solid rgb(var(--smoothly-input-border))}.sc-smoothly-input-date-range-h>section.sc-smoothly-input-date-range{display:flex;width:100%;background-color:var(--smoothly-input-background);border-radius:0.25rem;cursor:pointer}.sc-smoothly-input-date-range-h>section.sc-smoothly-input-date-range>smoothly-input.sc-smoothly-input-date-range{min-width:15rem;background-color:transparent;--input-min-height:calc(var(--input-min-height) - 2px)}.sc-smoothly-input-date-range-h>section.sc-smoothly-input-date-range>span.sc-smoothly-input-date-range{padding:0.5em 0.2em 0.5em 0.2em;align-self:center}.sc-smoothly-input-date-range-h>span.icons.sc-smoothly-input-date-range{display:flex;flex-direction:row;align-items:center;margin-right:0.4em}";
9477
- const SmoothlyInputDateRangeStyle0 = styleCss$X;
9482
+ const styleCss$Y = ".sc-smoothly-input-date-range-h{--input-padding-side:.5rem;--input-value-padding-top:1.25rem;--input-value-padding-bottom:.25rem;--input-min-height:3rem;min-height:var(--input-min-height);box-sizing:border-box;border-radius:var(--smoothly-input-border-radius)}.sc-smoothly-input-date-range-h[looks=\"border\"].sc-smoothly-input-date-range-s>smoothly-picker-menu smoothly-input,[looks=\"border\"].sc-smoothly-input-date-range-h{border:rgb(var(--smoothly-input-border)) solid 1px}[looks=\"border\"][readonly].sc-smoothly-input-date-range-h{border:transparent solid 1px}.sc-smoothly-input-date-range-h[looks=\"line\"].sc-smoothly-input-date-range-s>smoothly-picker-menu smoothly-input,[looks=\"line\"].sc-smoothly-input-date-range-h{border-bottom:rgb(var(--smoothly-input-border)) solid 1px}[looks=\"line\"][readonly].sc-smoothly-input-date-range-h{border-bottom:transparent solid 1px}[looks=\"grid\"].sc-smoothly-input-date-range-h{flex-grow:1;flex-basis:40%;box-shadow:0px 0px 0px 1px rgb(var(--smoothly-input-border));border:none}[looks=\"grid\"][readonly].sc-smoothly-input-date-range-h{box-shadow:0px 0px 0px 1px rgba(var(--smoothly-input-border-readonly))}[looks=\"transparent\"].sc-smoothly-input-date-range-h{border:none}[looks=\"transparent\"][readonly].sc-smoothly-input-date-range-h,[looks=\"transparent\"].sc-smoothly-input-date-range-h:not(:focus-within){background-color:transparent}[looks=\"transparent\"][readonly].sc-smoothly-input-date-range-h>input.sc-smoothly-input-date-range,[looks=\"transparent\"].sc-smoothly-input-date-range-h:not(:focus-within)>input.sc-smoothly-input-date-range{background:transparent}[looks=\"transparent\"].sc-smoothly-input-date-range-h:not([readonly]):focus-within{outline:1px solid rgb(var(--smoothly-input-border))}.sc-smoothly-input-date-range-h.sc-smoothly-input-date-range-s>[slot=label],.sc-smoothly-input-date-range-h .sc-smoothly-input-date-range-s>[slot=label],.sc-smoothly-input-date-range-h .label.sc-smoothly-input-date-range{position:absolute;top:.6rem;opacity:0.8;user-select:none;cursor:inherit;transform-origin:top left;transition:transform 100ms ease}.sc-smoothly-input-date-range-h.floating-label.sc-smoothly-input-date-range-s>[slot=label],.sc-smoothly-input-date-range-h.floating-label .sc-smoothly-input-date-range-s>[slot=label],.sc-smoothly-input-date-range-h.has-value.sc-smoothly-input-date-range-s>[slot=label],.sc-smoothly-input-date-range-h.has-value .sc-smoothly-input-date-range-s>[slot=label],.sc-smoothly-input-date-range-h[placeholder].sc-smoothly-input-date-range-s>[slot=label],.sc-smoothly-input-date-range-h[placeholder] .sc-smoothly-input-date-range-s>[slot=label],.sc-smoothly-input-date-range-h[readonly].sc-smoothly-input-date-range-s>[slot=label],.sc-smoothly-input-date-range-h[readonly] .sc-smoothly-input-date-range-s>[slot=label],.has-value.sc-smoothly-input-date-range-h .label.sc-smoothly-input-date-range,[placeholder].sc-smoothly-input-date-range-h .label.sc-smoothly-input-date-range,[readonly].sc-smoothly-input-date-range-h .label.sc-smoothly-input-date-range,.sc-smoothly-input-date-range-h:not([readonly]):focus-within .label.float-on-focus.sc-smoothly-input-date-range{top:.2rem;transform:scale(0.8)}.sc-smoothly-input-date-range-h:not([show-label]):not(.show-label) .label.sc-smoothly-input-date-range{display:none}.sc-smoothly-input-date-range-h{position:relative;display:flex;background-color:rgb(var(--smoothly-input-background))}.sc-smoothly-input-date-range-h:focus-within smoothly-input.sc-smoothly-input-date-range{outline:none}.sc-smoothly-input-date-range-h>section.sc-smoothly-input-date-range>smoothly-input.sc-smoothly-input-date-range>div.sc-smoothly-input-date-range>input.sc-smoothly-input-date-range{cursor:pointer}[readonly].sc-smoothly-input-date-range-h,[readonly].sc-smoothly-input-date-range-h>section.sc-smoothly-input-date-range>smoothly-input.sc-smoothly-input-date-range>div.sc-smoothly-input-date-range>input.sc-smoothly-input-date-range{cursor:not-allowed}.sc-smoothly-input-date-range-h>nav.sc-smoothly-input-date-range{position:absolute;z-index:10;top:4em;background-color:rgb(var(--smoothly-input-background));max-width:22em;min-width:18em}.sc-smoothly-input-date-range-h>nav.sc-smoothly-input-date-range>smoothly-calendar.sc-smoothly-input-date-range::before{content:\"\";position:absolute;box-sizing:border-box;top:1px;left:-7em;z-index:9;transform:translate(10em, -0.55em) rotate(45deg);width:1em;height:1em;background-color:rgb(var(--smoothly-input-background));border-top:1px solid rgb(var(--smoothly-input-border));border-left:1px solid rgb(var(--smoothly-input-border))}.sc-smoothly-input-date-range-h>section.sc-smoothly-input-date-range{display:flex;width:100%;background-color:var(--smoothly-input-background);border-radius:0.25rem;cursor:pointer}.sc-smoothly-input-date-range-h>section.sc-smoothly-input-date-range>smoothly-input.sc-smoothly-input-date-range{min-width:15rem;background-color:transparent;--input-min-height:calc(var(--input-min-height) - 2px)}.sc-smoothly-input-date-range-h>section.sc-smoothly-input-date-range>span.sc-smoothly-input-date-range{padding:0.5em 0.2em 0.5em 0.2em;align-self:center}.sc-smoothly-input-date-range-h>span.icons.sc-smoothly-input-date-range{display:flex;flex-direction:row;align-items:center;margin-right:0.4em}";
9483
+ const SmoothlyInputDateRangeStyle0 = styleCss$Y;
9478
9484
 
9479
9485
  const SmoothlyInputDateRange = class {
9480
9486
  constructor(hostRef) {
@@ -9573,12 +9579,12 @@ const SmoothlyInputDateRange = class {
9573
9579
  }
9574
9580
  render() {
9575
9581
  const locale = navigator.language;
9576
- return (index.h(index.Host, { key: '83a4df5b6d8eb60c62c71e606bb939289d259346', tabindex: 0 }, index.h("section", { key: '63aed666649aa276437e8c362e1b9ebc8cb07463', onClick: () => !this.readonly && (this.open = !this.open) }, index.h("smoothly-input", { key: '2bdc7f72a4708def9a274e0dc0cae28b2a415859', type: "text", name: "dateRangeInput", readonly: this.readonly, value: this.start && this.end
9582
+ return (index.h(index.Host, { key: '17965c35233c194ac804a0e31eee8ab770ea0e7d', tabindex: 0 }, index.h("section", { key: '15bf32607818890cbe158c5e795565c8372895ad', onClick: () => !this.readonly && (this.open = !this.open) }, index.h("smoothly-input", { key: 'f331b1793d83ce0c8291488c28b958b4b61e71d8', type: "text", name: "dateRangeInput", readonly: this.readonly, value: this.start && this.end
9577
9583
  ? `${format(this.start, "date", locale)} — ${format(this.end, "date", locale)}`
9578
9584
  : undefined, invalid: this.invalid, placeholder: this.placeholder, showLabel: this.showLabel, onSmoothlyInput: e => {
9579
9585
  e.stopPropagation();
9580
9586
  this.inputHandler(e.detail);
9581
- } }, index.h("slot", { key: '1a21ce7402507b8e2740308a8f216a45317e7254' }))), index.h("span", { key: '68ee8c56303fd1b9531a5e34358f2d6f953fa450', class: "icons" }, index.h("slot", { key: '301bfe40349ae98d14d23a059c51f15eecfc7dae', name: "end" })), this.open && (index.h("nav", { key: 'a3c163d13c2ba8dc8b61d977c983f62e552d9e37' }, index.h("smoothly-calendar", { key: '8569ba2af69fa58481699060eabbaee32e32cb56', doubleInput: true, onSmoothlyValueChange: e => e.stopPropagation(), onSmoothlyStartChange: e => {
9587
+ } }, index.h("slot", { key: '8f797dba165e1494b4423b7a224f16d9b9be6500' }))), index.h("span", { key: '47fedb6c916d925d7b291250ddc952225d2fffd1', class: "icons" }, index.h("slot", { key: 'c697792dc6bb1a4260ba1fa01c0b143fb597b77b', name: "end" })), this.open && (index.h("nav", { key: '8c3ea513275174cace04131d56849c8089dcc2e0' }, index.h("smoothly-calendar", { key: 'f95965cec7ec58fcefe0f14c25ec8be5dc9c2edf', doubleInput: true, onSmoothlyValueChange: e => e.stopPropagation(), onSmoothlyStartChange: e => {
9582
9588
  e.stopPropagation();
9583
9589
  this.start = e.detail;
9584
9590
  }, onSmoothlyEndChange: e => {
@@ -9599,8 +9605,8 @@ const SmoothlyInputDateRange = class {
9599
9605
  };
9600
9606
  SmoothlyInputDateRange.style = SmoothlyInputDateRangeStyle0;
9601
9607
 
9602
- const styleCss$W = ".sc-smoothly-input-demo-h{display:flex;flex-direction:column;margin-top:2em;margin-bottom:10rem}smoothly-input-demo-standard.sc-smoothly-input-demo{margin-bottom:2rem}div.inputs.sc-smoothly-input-demo{margin:auto;width:50%}div.inputs.sc-smoothly-input-demo>h2.sc-smoothly-input-demo:not(:first-child){padding-top:3em;margin-top:3em;border-top:1px solid black}.checkbox-group.sc-smoothly-input-demo{display:flex;gap:1.5em;align-items:center;background-color:rgb(var(--smoothly-input-background))}.select-div.sc-smoothly-input-demo{display:flex;justify-content:space-between;gap:1em;flex-wrap:wrap}.select-div.sc-smoothly-input-demo>smoothly-color.sc-smoothly-input-demo>*.sc-smoothly-input-demo,.select-div.sc-smoothly-input-demo>*.sc-smoothly-input-demo{flex-basis:49%}";
9603
- const SmoothlyInputDemoStyle0 = styleCss$W;
9608
+ const styleCss$X = ".sc-smoothly-input-demo-h{display:flex;flex-direction:column;margin-top:2em;margin-bottom:10rem}smoothly-input-demo-standard.sc-smoothly-input-demo{margin-bottom:2rem}div.inputs.sc-smoothly-input-demo{margin:auto;width:50%}div.inputs.sc-smoothly-input-demo>h2.sc-smoothly-input-demo:not(:first-child){padding-top:3em;margin-top:3em;border-top:1px solid black}.checkbox-group.sc-smoothly-input-demo{display:flex;gap:1.5em;align-items:center;background-color:rgb(var(--smoothly-input-background))}.select-div.sc-smoothly-input-demo{display:flex;justify-content:space-between;gap:1em;flex-wrap:wrap}.select-div.sc-smoothly-input-demo>smoothly-color.sc-smoothly-input-demo>*.sc-smoothly-input-demo,.select-div.sc-smoothly-input-demo>*.sc-smoothly-input-demo{flex-basis:49%}";
9609
+ const SmoothlyInputDemoStyle0 = styleCss$X;
9604
9610
 
9605
9611
  const SmoothlyInputDemo = class {
9606
9612
  constructor(hostRef) {
@@ -9609,23 +9615,23 @@ const SmoothlyInputDemo = class {
9609
9615
  this.alphanumeric = "!@##";
9610
9616
  }
9611
9617
  render() {
9612
- return (index.h(index.Host, { key: '60dd1e6b3944fc22f37e5b2f5d44e7fcf2833a84' }, index.h("smoothly-input-demo-standard", { key: '2de6bb4b669536a5f7a15e4a600af1b2e1a9af0c' }), index.h("div", { key: 'b78fe28ebc5c9d4d9dabcb4f6f5c80dd78f77d5c', class: "inputs" }, index.h("h2", { key: '3446b75ffe04fc341d3dcc072a4f9e06db26785c' }, "Calendar"), index.h("smoothly-input-date", { key: 'fcf59b2cc974165f4f695c02b52b704d3d74d6f3', name: "some-date" }, "Calendar"), index.h("h2", { key: 'a156ab1d3aca8be94908453872a2134c831d88c0' }, "Date Range"), index.h("smoothly-input-date-range", { key: '271a5188c679eb550c5c05ca2e1595ef136e684e', name: "testing", start: TimeZone.Date.now(), end: TimeZone.Date.nextMonth(TimeZone.Date.now()), min: "2021-10-01", max: "2025-01-31" }), index.h("smoothly-input-date-range", { key: '1e52949912d2a75db26c7540c3a9706e06e557e2', name: "testing", start: TimeZone.Date.now(), end: TimeZone.Date.nextMonth(TimeZone.Date.now()), min: "2021-10-10", max: "2024-12-30" }, index.h("smoothly-input-reset", { key: '5c127ccb828b1040525b18bd663bf750c8ff6eb5', slot: "end", size: "icon" })), index.h("smoothly-input-date-range", { key: 'f7d55eba1eb762f7361faff2abf7955fac195f6f', looks: "grid", start: TimeZone.Date.now(), end: TimeZone.Date.nextMonth(TimeZone.Date.now()), min: "2021-10-10", max: "2025-12-30", showLabel: false, style: {
9618
+ return (index.h(index.Host, { key: 'a3759e16fd8a2ba0c8cd2239b413e788c09ae119' }, index.h("smoothly-input-demo-standard", { key: '5576bbe54f9e14a97201346366fadcd74e136a17' }), index.h("div", { key: 'c56de93cd9540f2ad19a97349d7b4cdca2a995ac', class: "inputs" }, index.h("h2", { key: '964e3da1d54802f6e02314ad7b43f19870a3fda5' }, "Calendar"), index.h("smoothly-input-date", { key: 'd358efc50689190534b3f8ef6e69ef94f882b452', name: "some-date" }, "Calendar"), index.h("h2", { key: '60894ffa222578039b6483724cf9c7658ff9f047' }, "Date Range"), index.h("smoothly-input-date-range", { key: '091fc511140a3e484699caa2e35d1f6ff4babce0', name: "testing", start: TimeZone.Date.now(), end: TimeZone.Date.nextMonth(TimeZone.Date.now()), min: "2021-10-01", max: "2025-01-31" }), index.h("smoothly-input-date-range", { key: 'd8873b16214ba7caf779c870184dfde8f99a69f3', name: "testing", start: TimeZone.Date.now(), end: TimeZone.Date.nextMonth(TimeZone.Date.now()), min: "2021-10-10", max: "2024-12-30" }, index.h("smoothly-input-reset", { key: '9d115c8fe8e6d0c6529ac8b6ab779525accc44ae', slot: "end", size: "icon" })), index.h("smoothly-input-date-range", { key: 'f0f18e57a75f0a874b1f829de32e1559b2cf2ec9', looks: "grid", start: TimeZone.Date.now(), end: TimeZone.Date.nextMonth(TimeZone.Date.now()), min: "2021-10-10", max: "2025-12-30", showLabel: false, style: {
9613
9619
  "--smoothly-input-border-radius": "0.5rem",
9614
- } }, index.h("smoothly-input-clear", { key: '42cc2fff5a1c16fdd944d0ca991c4ec62beaba7d', slot: "end", size: "icon" })), index.h("h2", { key: 'c27fc483bad0afb666ca74c429f7ccae1a2221f2' }, "Date"), index.h("smoothly-input-date", { key: '3d3aaa26f231d651fa32f0fab84a154a11a76626' }, "Date"), index.h("smoothly-input-date", { key: '76c3bb73b29cfa08cb050a214f3350e66d11db4c', showLabel: false, value: "2021-10-28", max: "2021-12-30", min: "2021-10-10" }, "Date"), index.h("smoothly-input-date", { key: '9faa09cb1639f3bd2cdaa2f778b3089f9b2a28db', value: "2021-10-28" }, "Date", index.h("smoothly-input-reset", { key: 'b23977afa3336103cdac903ce7bb41e85aa1b5d2', slot: "end", size: "icon" })), index.h("smoothly-input-date", { key: '07531f044374101bc1b8b7412ab95c99fc0c0821', value: "2021-10-28" }, "Date", index.h("smoothly-input-clear", { key: '9412380e4b99a089e2a27033f2d907fdf632870f', slot: "end", size: "icon" })), index.h("h2", { key: 'f49350d7cd4c67861d6f68cf84cbe1c55a7b57c6' }, "Select"), index.h("div", { key: '1e065be44b7e8cd703e2224eff99590b6312eef9', class: "select-div" }, index.h("smoothly-input-select", { key: '2b7c5dc15f3e3d1b7fb305c19bd2fdc3dde9e5ad', name: "select-dessert", looks: "border" }, index.h("label", { key: '88520ce4cf5e3fca70d6bc53ba09c85ca69f0886', slot: "label" }, "Select with clear button"), index.h("smoothly-item", { key: 'b3933f46e484bb4088bb127ff9d5934383f6718a', value: "1" }, "Ice cream"), index.h("smoothly-item", { key: 'ec7c81c9a7175925fb934c4c4649a9583406ba8e', value: "2" }, "Sponge cake"), index.h("smoothly-item", { key: 'dee107a78eb7d633c2649f01423e1fb648d75f6a', value: "3" }, "Cookie"), index.h("smoothly-item", { key: '3574cf96bbeb79378ab2ff2f51cf6d9037ad1636', value: "4" }, "Croissant"), index.h("smoothly-item", { key: '4a828f6722f5b224aa1270a37224d8ad417cfda8', value: "5" }, "Chocolate fondue"), index.h("smoothly-input-clear", { key: '9fe902f304044ba4d151339ec32a513b206eea6a', size: "icon", slot: "end" })), index.h("smoothly-input-select", { key: '25e44de9e1d06060ff29256e43b9ec6fd64c4d00', multiple: true, name: "select-dessert-multiple", looks: "border" }, index.h("label", { key: '01b6f70c32864d0230f5eaf9328e7b2e1c90548f', slot: "label" }, "Select multiple with reset button"), index.h("smoothly-item", { key: 'c7114fce4a9a38fb65b5965204703c6d122fda37', value: "ice cream" }, "Ice cream"), index.h("smoothly-item", { key: '62b0e1adedbb41617e9209bb371b6487695f0d95', value: "sponge cake" }, "Sponge cake"), index.h("smoothly-item", { key: 'f4a274d856a67bdfe40e8c4ff2f7522a75022807', selected: true, value: "cookie" }, "Cookie"), index.h("smoothly-item", { key: '7ff4c8d48432b01b1233e826912015350dbd1471', value: "croissant" }, "Croissant"), index.h("smoothly-item", { key: '91f9cf259e2bf3a9a2fc11e24f81c6a343d1c6ce', selected: true, value: "chocolate fondue" }, "Chocolate fondue"), index.h("smoothly-input-reset", { key: 'a3fd01d729cce520d94a847ba9ac1e329d645fb3', size: "icon", slot: "end" })), index.h("smoothly-input-select", { key: '789d978ebedffce68f1ba8afa75b9760342c524c', name: "spirit-animals", looks: "border", mutable: true }, index.h("label", { key: 'f6797eedb62b38f18f4bdbfe26449b23ca42ca20', slot: "label" }, "Select or add new options"), index.h("smoothly-item", { key: '683df95a98d45de4a4af6ccedcd985cd81ed4e2c', value: "manatee" }, "Manatee"), index.h("smoothly-item", { key: '538ffed77e6ef496b79cfee0815a728e18c1fcdc', selected: true, value: "cthulu" }, "Cthulu")), index.h("smoothly-input-select", { key: 'ac967e2053f91aa34b8e47456bcde12715808c5e', name: "select-icon", clearable: false, showSelected: false }, index.h("smoothly-item", { key: '2db3a5e0b4d0deacce03c63525a4412b8f7808d4', value: "folder", selected: true }, index.h("smoothly-icon", { key: 'a7117932c22979d76a24c07d722e3a117716e394', size: "small", name: "folder-outline" })), index.h("smoothly-item", { key: 'a6d257fbf551b79326dd9700dae69cd8f0ea6f74', value: "camera" }, index.h("smoothly-icon", { key: '2140114c4691fab40d456fa8d37baa5904eadcba', size: "small", name: "camera-outline" }))), index.h("smoothly-input-select", { key: 'fa1526c0fe3c83df1f1ff97b240be85d4ed59c4b', ordered: true, menuHeight: "7.5items", placeholder: "Select...", name: "select-month" }, index.h("label", { key: '536cbe805f9baacb7f8752b2b5cdcfb32915af87', slot: "label" }, "Alphabet ordered select"), Array.from({ length: 26 })
9620
+ } }, index.h("smoothly-input-clear", { key: '5ee91abb156cef71bc8b030af73f6094d416f9c9', slot: "end", size: "icon" })), index.h("h2", { key: '5eb334531bec7eba0ee2e9a3dbfd6c6afda29bf9' }, "Date"), index.h("smoothly-input-date", { key: '3ee82cf9411ee0495d284e5a01a8df3d95836918' }, "Date"), index.h("smoothly-input-date", { key: '5e571c0bbf5465b30bd6f3c4d1958579f64c95ff', showLabel: false, value: "2021-10-28", max: "2021-12-30", min: "2021-10-10" }, "Date"), index.h("smoothly-input-date", { key: '6c28ccfb6b4a768de70bf28230f3f52d1cd7bcfc', value: "2021-10-28" }, "Date", index.h("smoothly-input-reset", { key: 'ffece9de256e29026cc14ff69c8635ce25dea36f', slot: "end", size: "icon" })), index.h("smoothly-input-date", { key: '95dc888d14a9adc517a833f2ab411a801cd91619', value: "2021-10-28" }, "Date", index.h("smoothly-input-clear", { key: '0296879775dbff3c722103c08d978a5ddcdb64a8', slot: "end", size: "icon" })), index.h("h2", { key: '6f64f32a83f7c41861f130b6a4f74e69203374c4' }, "Select"), index.h("div", { key: '953e7676a497b9bd2968ea5fb85d336dfcfcd5ac', class: "select-div" }, index.h("smoothly-input-select", { key: '7f4b2bfe74ac04277e9d8300cf006ede53d473b1', name: "select-dessert", looks: "border" }, index.h("label", { key: 'b8459bc08dd7ea114135f4d365670ac09b43d9d8', slot: "label" }, "Select with clear button"), index.h("smoothly-item", { key: 'c42c0682c742fc184b55090392d8da06856e3e2c', value: "1" }, "Ice cream"), index.h("smoothly-item", { key: '20b8e3a23bca148f21f2de1ec5cfa7bce97f0e62', value: "2" }, "Sponge cake"), index.h("smoothly-item", { key: '0aa7384ed709def5d82895c72dbfd19df46b08f4', value: "3" }, "Cookie"), index.h("smoothly-item", { key: '8f964ebfc388d2db39c88c9ff4256a39ea52b669', value: "4" }, "Croissant"), index.h("smoothly-item", { key: '32b5f47609c8c0c6a24be01534facab3d395e54a', value: "5" }, "Chocolate fondue"), index.h("smoothly-input-clear", { key: '8b92771e975ed99d5b4d2841df6cbc4ef4f49bd8', size: "icon", slot: "end" })), index.h("smoothly-input-select", { key: '8895f2855d805d425f0a98c7788a2a345aac38b2', multiple: true, name: "select-dessert-multiple", looks: "border" }, index.h("label", { key: '28e337ce2eb1fcd1519e6a8065a4c431c00353e0', slot: "label" }, "Select multiple with reset button"), index.h("smoothly-item", { key: '6ca9d6809c18c2742fc139fdfa5b5605cef00b4e', value: "ice cream" }, "Ice cream"), index.h("smoothly-item", { key: '966956b86328f33bc191f44cf880cf8fd1546885', value: "sponge cake" }, "Sponge cake"), index.h("smoothly-item", { key: '72dea6e761ece3f2a8277a3a6f5baf28ceec3672', selected: true, value: "cookie" }, "Cookie"), index.h("smoothly-item", { key: '17e8b8bf6f508464993428a496e98085e8b9a1e1', value: "croissant" }, "Croissant"), index.h("smoothly-item", { key: '5e089913258e6a8250202a00fc6bed66b59813e8', selected: true, value: "chocolate fondue" }, "Chocolate fondue"), index.h("smoothly-input-reset", { key: '269464d07997c396d06db1264a78d9f120c8f103', size: "icon", slot: "end" })), index.h("smoothly-input-select", { key: '46b80baeefb3adde62f762fa1725ffdd8b07c2ef', name: "spirit-animals", looks: "border", mutable: true }, index.h("label", { key: '91cb5241885cd670fb09992ede0244832d433356', slot: "label" }, "Select or add new options"), index.h("smoothly-item", { key: '27e33ce37d5a9bc9189486d19b9ba80b36cb3a21', value: "manatee" }, "Manatee"), index.h("smoothly-item", { key: 'b0dbcd505735921e550817ff6914eb9cc92d6bbb', selected: true, value: "cthulu" }, "Cthulu")), index.h("smoothly-input-select", { key: '5b79531f257e14eec2805f641cb009bacd19635a', name: "select-icon", clearable: false, showSelected: false }, index.h("smoothly-item", { key: '00dc8b052ee83f2d221b2db40b12268670071f62', value: "folder", selected: true }, index.h("smoothly-icon", { key: 'd94ceec2258b71c9e2670d54a5e14c706e6b5a8e', size: "small", name: "folder-outline" })), index.h("smoothly-item", { key: 'b76ad7e9baaf609baced0e2cc9a8c852acbf433f', value: "camera" }, index.h("smoothly-icon", { key: 'b55fb5fbc72c7a026945b56707c715d7d9a858e5', size: "small", name: "camera-outline" }))), index.h("smoothly-input-select", { key: '7554e0bc5763853f86a86ae0229d214ee9408cc5', ordered: true, menuHeight: "7.5items", placeholder: "Select...", name: "select-month" }, index.h("label", { key: '165dcad609ba1b42df404e1e3c5f110218372ed9', slot: "label" }, "Alphabet ordered select"), Array.from({ length: 26 })
9615
9621
  .map((_, i) => String.fromCharCode(i + 65))
9616
- .map(char => (index.h("smoothly-item", { value: char, selected: char == "H" }, char)))), index.h("smoothly-input-select", { key: '9a54121c3c2c4a54dfec67f162715e85693bd644', multiple: true, menuHeight: "7.5items", placeholder: "Select...", name: "select-month" }, index.h("label", { key: '7dc86bf58e320f8d3b88ab302c1405e23baf3573', slot: "label" }, "Month multiple select"), index.h("smoothly-item", { key: '4d36b73ad961841f704d424953b52862f17aab7c', value: "1" }, "January"), index.h("smoothly-item", { key: '34c54bfc6b913bcfe311f58e95997df5bf6cf556', value: "2" }, "February"), index.h("smoothly-item", { key: '36c318142cf3e4c96746a0ea6db0e47efb905ff1', value: "3" }, "March"), index.h("smoothly-item", { key: '71a0e0338a684afc95372afe0e73476ae4c6b92e', value: "4" }, "April"), index.h("smoothly-item", { key: 'f886245dd9028cedf7b5b4c8a92d8145404e7b48', value: "5" }, "May"), index.h("smoothly-item", { key: 'baf3dfd66dabd46ab53e08f32eee4c9f40beed86', value: "6" }, "June"), index.h("smoothly-item", { key: '23902edc851bbd38d91aeb492be1588080ec8e35', value: "7" }, "July"), index.h("smoothly-item", { key: '070013888d298a0411cf11451896cdeebd5faefd', value: "8" }, "August"), index.h("smoothly-item", { key: 'f118909abf6d4f79a24794ff834dcd93f6f359bb', value: "9" }, "September"), index.h("smoothly-item", { key: 'fe43d7d6282c2879bd75749ba22a884e5fc9360d', value: "10" }, "October"), index.h("smoothly-item", { key: '5483b77005e252cfb5aa6ef1921a1fa8ff342a8f', value: "11" }, "November"), index.h("smoothly-item", { key: '9ae0ea26b94e91f40ad46315ca5706408ba94e60', value: "12" }, "December"))), index.h("h2", { key: 'a0d9abd40b02df85804a063340651dd341637539' }, "Duration"), index.h("smoothly-input", { key: 'ab34411fc2c3f2580e88c3f80229d38619c92922', name: "duration", type: "duration", placeholder: "hh:mm", value: this.duration, onSmoothlyInput: e => {
9622
+ .map(char => (index.h("smoothly-item", { value: char, selected: char == "H" }, char)))), index.h("smoothly-input-select", { key: 'c105b5955731a2d2797fbebda5e91fbbbdb29f04', multiple: true, menuHeight: "7.5items", placeholder: "Select...", name: "select-month" }, index.h("label", { key: 'e8144f15440543b193ec287d72d1934893ecbdff', slot: "label" }, "Month multiple select"), index.h("smoothly-item", { key: 'e27d43ca516960222d8f8e1d4de376d5fa7742a5', value: "1" }, "January"), index.h("smoothly-item", { key: '675b95ed2a76a69247244a9e21656d0a3fd905e6', value: "2" }, "February"), index.h("smoothly-item", { key: '8f8e1efdc4ea91001a12801e6b43f775c94be67e', value: "3" }, "March"), index.h("smoothly-item", { key: '6066be8411b7bbc98e61baf8e543d8d423d25b32', value: "4" }, "April"), index.h("smoothly-item", { key: 'c775756977711338fccfcdae8aa98ea66fb1dcc4', value: "5" }, "May"), index.h("smoothly-item", { key: '9279da1d6f02092a7dd02f08b6a80aab1bb81865', value: "6" }, "June"), index.h("smoothly-item", { key: 'de52af29af4209871d6000fc22419e62a2a26552', value: "7" }, "July"), index.h("smoothly-item", { key: '672feea83b808052bac70d574368b9a2b175da18', value: "8" }, "August"), index.h("smoothly-item", { key: '7641231e0fc93ea973a29d6d1fcedee513f34637', value: "9" }, "September"), index.h("smoothly-item", { key: '53275ef569b772a9ee14f7039b31eb65d2f2c13b', value: "10" }, "October"), index.h("smoothly-item", { key: '1effa9d783d911bd0efdc4d297fe5bbea5273eb7', value: "11" }, "November"), index.h("smoothly-item", { key: 'd8235388cf746f521e233592f137ca7aea25db7a', value: "12" }, "December"))), index.h("h2", { key: 'f0c3cee9124d36368d78b9188eed2157330ff80e' }, "Duration"), index.h("smoothly-input", { key: 'bc808a99f0e3e1b28e90207d6cf04eafa7a968ef', name: "duration", type: "duration", placeholder: "hh:mm", value: this.duration, onSmoothlyInput: e => {
9617
9623
  const duration = e.detail.duration;
9618
9624
  this.duration = duration;
9619
- } }, "Duration"), index.h("smoothly-input", { key: 'd79ab5f9b188a7e7997b7632528d9b7b7d3a4e17', name: "duration", type: "duration", value: this.duration, placeholder: "-hh:mm", onSmoothlyInput: e => {
9625
+ } }, "Duration"), index.h("smoothly-input", { key: '5c286bddbc3201c5f8ee85c2050d59eb9844e75b', name: "duration", type: "duration", value: this.duration, placeholder: "-hh:mm", onSmoothlyInput: e => {
9620
9626
  const duration = e.detail.duration;
9621
9627
  this.duration = duration;
9622
- } }, "Duration"), index.h("h2", { key: '77659fae36b8baf78144e6bdf8114468bbbcce63' }, "Invalid text with warning icon and tooltip"), index.h("smoothly-input", { key: '36ec2d01a0eff284ac9c9ca029de977ca377b4d4', name: "alphanumeric", invalid: !/^[a-zA-Z0-9]+$/.test(this.alphanumeric), errorMessage: "Only alphanumeric allowed", value: this.alphanumeric, onSmoothlyInput: e => (this.alphanumeric = e.detail.alphanumeric) }, "Alphanumeric"), index.h("h2", { key: 'f932f037b870016f7c9cbdb6005667dc7128a0e5' }, "Identifiers"), index.h("smoothly-input", { key: 'c01d348ad7da08d7f4d79b81940d93c6d487dc73', type: "identifier-code" }, "Code"), index.h("smoothly-input", { key: '6f04219c7620dbf62ea636cef4cb57b5eaa92620', type: "identifier-attribute" }, "Attribute"), index.h("smoothly-input", { key: '238ccb9cf5b3af202a7e78afb5af3825388a4ecc', type: "identifier-snake" }, "Snake"), index.h("smoothly-input", { key: '80c20c17cae2e98e28cf868a8804a03b5bb47d96', type: "identifier-pascal" }, "Pascal"), index.h("smoothly-input", { key: 'e2bf4532f7f684d52446a79065ac80da72c90f22', type: "identifier-camel" }, "Camel"), index.h("h2", { key: 'a1881af9a04d1ba6ff914280cb897d4007ca9782' }, "Input Alternatives"), index.h("smoothly-input", { key: '726f60d54ecc61f3b837ecc7c66d3764d0a757b1', type: "text", name: "name.last", onSmoothlyChange: e => console.log("smoothly change event") }, index.h("smoothly-icon", { key: '9674ac3e67095c3709eacc60ecabb7ff88074a0c', name: "checkmark-circle", slot: "start" }), "First Name"), index.h("smoothly-input", { key: '18ab4455f475fbf78f554aa3305eb1189c206b4f', type: "text", name: "name.first", onSmoothlyChange: e => console.log("smoothly change event") }, "Last Name", index.h("smoothly-icon", { key: '7c4ffa8dd88b3e34e1b7f2844974272f56ca47c7', name: "checkmark-circle", slot: "end" })), index.h("smoothly-input", { key: 'f556a8cdeaa4c2f9475bc78dad3d9f26a90d7bea', type: "text", name: "name.first", placeholder: "Smith", onSmoothlyChange: e => console.log("smoothly change event") }, "Last Name", index.h("smoothly-icon", { key: 'e896f71cbeaa26e8aa2c6647b37ca9ab60d6ed4c', name: "checkmark-circle", slot: "end" })), index.h("smoothly-input", { key: '3542b034172c61acc999fc9822ad33cc2cdccaf7', placeholder: "test" }), index.h("smoothly-input-submit", { key: 'a42187c08d5fe2853d052d6844c7cc6bcad18c26', slot: "submit", fill: "solid", onSubmit: (e) => alert(e), color: "success" }), index.h("h4", { key: '8664ce9045837f7d7463faef8709049344a00dc3' }, "Smoothly checkboxes"), index.h("div", { key: '04b2ec0bc402d30fbeda397d94af55deb373fc72', class: "checkbox-group" }, index.h("smoothly-input-checkbox", { key: '575a1dc529da494f9e75cf118265bc0c7de98ed8', disabled: true, name: "first-checkbox" }, index.h("smoothly-icon", { key: '53de5dc29a3abeb050b37d90303e2af61c480fe2', name: "checkmark-circle", slot: "start", size: "tiny" }), "First"), index.h("smoothly-input-checkbox", { key: 'b0de8f61c270597d0a3d678b460c352a5ab1c292', name: "second-checkbox", checked: true }, index.h("smoothly-icon", { key: '8c28814145da88c5985389dd2bd857546cd95dac', name: "checkmark-circle", slot: "start", size: "tiny" }), "second", index.h("smoothly-input-clear", { key: 'b9adc0e43251e6351699705c90e30328e6fe90e3', size: "icon", slot: "end" })), index.h("smoothly-input-checkbox", { key: 'fccdafc99185802b6aebef7db0e013d3c2bf7b7a', name: "third-checkbox" }, "3rd")), index.h("h4", { key: '02546922407a4eb0cd79fd0df59ca964023339c6' }, "Smoothly Radio Buttons"), index.h("smoothly-input-radio", { key: '8a571b06744975ad89cb98531dabb186fd174d34', clearable: true, name: "radioFirstInput" }, index.h("smoothly-icon", { key: 'a16d89da7d35337d960e8c84cc35c1d5685b090c', name: "checkmark-circle", slot: "start" }), index.h("label", { key: '01b331334090300561788e9275e7d4c6953b1819', slot: "label" }, "Clearable"), index.h("smoothly-input-radio-item", { key: 'fcefd1e0e2d57f7e88eb1e11d57347f176a62840', value: "first" }, "Label 1"), index.h("smoothly-input-radio-item", { key: '42385195aff79e62b89ab6fcf4272d03c388e5eb', selected: true, value: "second" }, "Label 2"), index.h("smoothly-input-radio-item", { key: '422b734be7f7e2f682ecbe4aaba7ea911fbc2f31', value: "third" }, "Label 3"), index.h("smoothly-input-clear", { key: 'f01b73ad270339303318232fce8381b84d7820ee', size: "icon", slot: "end" })), index.h("smoothly-input-radio", { key: '18a80016d74b795c4776571becf06aaa5b252cfb', name: "radioSecondInput" }, index.h("label", { key: '00b38c06274eb23a05a3b8ad164bab3599210b64', slot: "label" }, "Not clearable"), index.h("smoothly-input-radio-item", { key: '6fb088a2296577c80cac0bb6de0739f09bf86562', value: "first" }, "Label 1"), index.h("smoothly-input-radio-item", { key: 'd05e7d3e74e8715998f69a4aab8fba2f37ed977d', value: "second" }, "Label 2"), index.h("smoothly-input-radio-item", { key: 'd03c3fb5bd3c78db4454a25ddd4632b34ed0f02b', value: "third" }, "Label 3"), index.h("smoothly-input-radio-item", { key: 'ab22cadf0659c3f5c5f413257204cac7591a8de8', value: "fourth" }, "Label 4"), index.h("smoothly-input-radio-item", { key: '79116a6a56bb33a639a20ba42b2b5e9ccd08c305', value: "fifth" }, "Label 5"), index.h("smoothly-input-radio-item", { key: 'a1c12af0a76770978442fb89eea781fb4e07bf30', value: "sixth" }, "Label 6")), index.h("smoothly-input-range-demo", { key: 'bfec9553edd15ed9cbe0e6f17889f437308a644b' }), index.h("smoothly-input-color-demo", { key: 'e6a5a06f852534958c4985d83295bf59c527826f' }), index.h("smoothly-input-price-demo", { key: 'becbde45aeea68315b69aad6d9ba887070e6d36b' }), index.h("smoothly-back-to-top", { key: '969d495c56d6caf1c7ea392a714f3e647d2e8ea5' }))));
9628
+ } }, "Duration"), index.h("h2", { key: '4017f3c95eba0ee876c848109df51f813d4aac8f' }, "Invalid text with warning icon and tooltip"), index.h("smoothly-input", { key: 'c73f534f9e633406a75b1c5fbdd0b21b78bc917d', name: "alphanumeric", invalid: !/^[a-zA-Z0-9]+$/.test(this.alphanumeric), errorMessage: "Only alphanumeric allowed", value: this.alphanumeric, onSmoothlyInput: e => (this.alphanumeric = e.detail.alphanumeric) }, "Alphanumeric"), index.h("h2", { key: '486a889d31d932e71b18bec5fd07e3c549efdb31' }, "Identifiers"), index.h("smoothly-input", { key: '539335f657d72e3c7cddb2b503d2949256d2914f', type: "identifier-code" }, "Code"), index.h("smoothly-input", { key: '02dd45100a15016525826b5be17b797bc8b04752', type: "identifier-attribute" }, "Attribute"), index.h("smoothly-input", { key: 'aceb9820fd73e225639fcc2e776893fcf90b26af', type: "identifier-snake" }, "Snake"), index.h("smoothly-input", { key: 'f03264c9e62fb28fed66a49368d89e96c34aa560', type: "identifier-pascal" }, "Pascal"), index.h("smoothly-input", { key: '2da7c5e2ecf35518b51266a7461fcb4faef38bf4', type: "identifier-camel" }, "Camel"), index.h("h2", { key: '226d67a20538b2522646858c9ad8fbfdd8cfb926' }, "Input Alternatives"), index.h("smoothly-input", { key: '8e1867ba1ac45dc87491cea2a49ba4004bf9c1dc', type: "text", name: "name.last", onSmoothlyChange: e => console.log("smoothly change event") }, index.h("smoothly-icon", { key: '35afbfd53cb6637457e826f60a3e6e379d28dc5f', name: "checkmark-circle", slot: "start" }), "First Name"), index.h("smoothly-input", { key: '6994934c54c24cff2eaba102f67c74a76b1393f8', type: "text", name: "name.first", onSmoothlyChange: e => console.log("smoothly change event") }, "Last Name", index.h("smoothly-icon", { key: '62d7f2a8eefd4da22491a281de38d66a7138fddd', name: "checkmark-circle", slot: "end" })), index.h("smoothly-input", { key: '4366b0291a3f74026dea5856c0bf60b2d4ea4d93', type: "text", name: "name.first", placeholder: "Smith", onSmoothlyChange: e => console.log("smoothly change event") }, "Last Name", index.h("smoothly-icon", { key: '6d94234d166d77b23ba805db6c0b39e19a5d4a65', name: "checkmark-circle", slot: "end" })), index.h("smoothly-input", { key: '38283621fea72da77bb7d87fa3d56ec6453d8e0d', placeholder: "test" }), index.h("smoothly-input-submit", { key: 'b3a7e49422a3c13bb58fbced399bee7e2fd09cfb', slot: "submit", fill: "solid", onSubmit: (e) => alert(e), color: "success" }), index.h("h4", { key: '62ea4451d74acf394eaaae53a77b129004c61ac9' }, "Smoothly checkboxes"), index.h("div", { key: '9945daf0fa09dcccce897f781d3642fc8281414b', class: "checkbox-group" }, index.h("smoothly-input-checkbox", { key: 'b9eb11a38cba92a0c133cc2afe979fd1139c01fa', disabled: true, name: "first-checkbox" }, index.h("smoothly-icon", { key: 'bdb4d3e62f40d5b8085bebf0aef863284c355e38', name: "checkmark-circle", slot: "start", size: "tiny" }), "First"), index.h("smoothly-input-checkbox", { key: 'e9ee627f9be6a1fc0072b89e2169df40dbe0c697', name: "second-checkbox", checked: true }, index.h("smoothly-icon", { key: '77994dd6460da98f4823bb5f21af2ef222c6d9d0', name: "checkmark-circle", slot: "start", size: "tiny" }), "second", index.h("smoothly-input-clear", { key: '11e53da5cce7f5e2bf8df0417972c0da24a6e99e', size: "icon", slot: "end" })), index.h("smoothly-input-checkbox", { key: '3d2aedf1f11e4ab73e8ed2707e71aa05e3a75fea', name: "third-checkbox" }, "3rd")), index.h("h4", { key: 'e12cc690b73be889e9a108d28798deaebda7c019' }, "Smoothly Radio Buttons"), index.h("smoothly-input-radio", { key: '44bd8a972f109a62dcea7d24e264fd438d7c359b', clearable: true, name: "radioFirstInput" }, index.h("smoothly-icon", { key: '0df4843fc0c1edc6f8671ac050e46c30d04feed1', name: "checkmark-circle", slot: "start" }), index.h("label", { key: '9d8eb7aedd198a6d9ff554f16110d00cac0bf50d', slot: "label" }, "Clearable"), index.h("smoothly-input-radio-item", { key: '4aa9dd05057526619ba26165064096460400db36', value: "first" }, "Label 1"), index.h("smoothly-input-radio-item", { key: '825aac6d7fcd31831658a6ba144318b508e6f393', selected: true, value: "second" }, "Label 2"), index.h("smoothly-input-radio-item", { key: 'e2108d334f1da1a5927508fe171c6bd007ae97b4', value: "third" }, "Label 3"), index.h("smoothly-input-clear", { key: '72a9668cfb1ec37b7b8c0c414215d9b287d5da90', size: "icon", slot: "end" })), index.h("smoothly-input-radio", { key: '620de291dc950ddba04e52d6f33e9ba6f4833756', name: "radioSecondInput" }, index.h("label", { key: 'c730321dd39f9a216db32ac91a71f4d5d2e21251', slot: "label" }, "Not clearable"), index.h("smoothly-input-radio-item", { key: 'd0ba2eabf228eaee8927dc6b5903729fccf40039', value: "first" }, "Label 1"), index.h("smoothly-input-radio-item", { key: 'cfe057b7cbdca1f1649b0929107dfa6c2e6edbcd', value: "second" }, "Label 2"), index.h("smoothly-input-radio-item", { key: 'ee6c80f9f636c347f6c230ea189078544695362d', value: "third" }, "Label 3"), index.h("smoothly-input-radio-item", { key: '778d24581b0618a5735fdb40be3989f6e61ac247', value: "fourth" }, "Label 4"), index.h("smoothly-input-radio-item", { key: 'ebd353d82992a072f9163a3121039faa0e8807bf', value: "fifth" }, "Label 5"), index.h("smoothly-input-radio-item", { key: '42db90b5fc75cef8111cc2cbf65254ae5e101cf8', value: "sixth" }, "Label 6")), index.h("smoothly-input-range-demo", { key: 'd0ba6dc792c5043c346e79994ae87d2aeff675bc' }), index.h("smoothly-input-color-demo", { key: '566c1b0a557045173d3a2d5e45bd12f86069e496' }), index.h("smoothly-input-price-demo", { key: '81572554d1a58e9d0e01a8fe620ebb9375924a6d' }), index.h("smoothly-back-to-top", { key: '6e13b4107fcaf456de94b95c39d3cf59eb5b67a0' }))));
9623
9629
  }
9624
9630
  };
9625
9631
  SmoothlyInputDemo.style = SmoothlyInputDemoStyle0;
9626
9632
 
9627
- const styleCss$V = ".sc-smoothly-input-demo-standard-h{width:50%;margin:auto}.sc-smoothly-input-demo-standard-h h2.sc-smoothly-input-demo-standard,.sc-smoothly-input-demo-standard-h p.sc-smoothly-input-demo-standard{margin:.5rem 0}div.input-wrapper.sc-smoothly-input-demo-standard{display:grid;margin-top:1rem;grid-template-columns:2fr 1fr;gap:1rem;position:relative;justify-content:space-around}div.input-wrapper.sc-smoothly-input-demo-standard>[name].sc-smoothly-input-demo-standard{grid-column:1 / 2}div.input-wrapper.sc-smoothly-input-demo-standard>.width.sc-smoothly-input-demo-standard{width:100%;text-align:center;border-bottom:1px dashed black}div.input-wrapper.sc-smoothly-input-demo-standard>.height.sc-smoothly-input-demo-standard{align-content:center;grid-column:2 / 3;border-left:1px dashed black;padding-left:1rem;content:\"hello\"}div.input-wrapper.sc-smoothly-input-demo-standard>.left-padding.sc-smoothly-input-demo-standard{width:0.5rem;grid-column:1 / 2;white-space:nowrap;overflow:visible;position:relative;cursor:default}div.input-wrapper.sc-smoothly-input-demo-standard>.left-padding.sc-smoothly-input-demo-standard::before{content:\"\";position:absolute;width:100%;top:1.5rem;bottom:-1rem;border:1px dashed black;z-index:2}div.input-wrapper.sc-smoothly-input-demo-standard>.left-padding.sc-smoothly-input-demo-standard:hover::before{bottom:-100vh}.vertical.sc-smoothly-input-demo-standard-h{width:100%;row-gap:0;position:relative}.vertical.sc-smoothly-input-demo-standard-h>div.input-wrapper.sc-smoothly-input-demo-standard{display:grid;grid-template-columns:repeat(auto-fill, 14rem);gap:.5rem}.vertical.sc-smoothly-input-demo-standard-h>div.input-wrapper.sc-smoothly-input-demo-standard>.width.sc-smoothly-input-demo-standard,.vertical.sc-smoothly-input-demo-standard-h>div.input-wrapper.sc-smoothly-input-demo-standard>.height.sc-smoothly-input-demo-standard,.vertical.sc-smoothly-input-demo-standard-h>div.input-wrapper.sc-smoothly-input-demo-standard>.left-padding.sc-smoothly-input-demo-standard{display:none}.vertical.sc-smoothly-input-demo-standard-h>div.input-wrapper.sc-smoothly-input-demo-standard>.guide-lines.sc-smoothly-input-demo-standard::before,.vertical.sc-smoothly-input-demo-standard-h>div.input-wrapper.sc-smoothly-input-demo-standard>.guide-lines.sc-smoothly-input-demo-standard::after{content:\"\";pointer-events:none;right:0;width:100vw;position:absolute;z-index:2;border-top:1px dotted black}.sc-smoothly-input-demo-standard-h:not(.vertical) .guide-lines.sc-smoothly-input-demo-standard{display:none}.guide-lines.sc-smoothly-input-demo-standard{text-align:end;justify-self:center;align-content:center}.guide-lines.sc-smoothly-input-demo-standard::before{top:1rem}.guide-lines.sc-smoothly-input-demo-standard::after{top:2rem}.guide-lines.show-label.sc-smoothly-input-demo-standard::before{top:1.05rem}.guide-lines.show-label.sc-smoothly-input-demo-standard::after{top:2.3rem}";
9628
- const SmoothlyInputDemoStandardStyle0 = styleCss$V;
9633
+ const styleCss$W = ".sc-smoothly-input-demo-standard-h{width:50%;margin:auto}.sc-smoothly-input-demo-standard-h h2.sc-smoothly-input-demo-standard,.sc-smoothly-input-demo-standard-h p.sc-smoothly-input-demo-standard{margin:.5rem 0}div.input-wrapper.sc-smoothly-input-demo-standard{display:grid;margin-top:1rem;grid-template-columns:2fr 1fr;gap:1rem;position:relative;justify-content:space-around}div.input-wrapper.sc-smoothly-input-demo-standard>[name].sc-smoothly-input-demo-standard{grid-column:1 / 2}div.input-wrapper.sc-smoothly-input-demo-standard>.width.sc-smoothly-input-demo-standard{width:100%;text-align:center;border-bottom:1px dashed black}div.input-wrapper.sc-smoothly-input-demo-standard>.height.sc-smoothly-input-demo-standard{align-content:center;grid-column:2 / 3;border-left:1px dashed black;padding-left:1rem;content:\"hello\"}div.input-wrapper.sc-smoothly-input-demo-standard>.left-padding.sc-smoothly-input-demo-standard{width:0.5rem;grid-column:1 / 2;white-space:nowrap;overflow:visible;position:relative;cursor:default}div.input-wrapper.sc-smoothly-input-demo-standard>.left-padding.sc-smoothly-input-demo-standard::before{content:\"\";position:absolute;width:100%;top:1.5rem;bottom:-1rem;border:1px dashed black;z-index:2}div.input-wrapper.sc-smoothly-input-demo-standard>.left-padding.sc-smoothly-input-demo-standard:hover::before{bottom:-100vh}.vertical.sc-smoothly-input-demo-standard-h{width:100%;row-gap:0;position:relative}.vertical.sc-smoothly-input-demo-standard-h>div.input-wrapper.sc-smoothly-input-demo-standard{display:grid;grid-template-columns:repeat(auto-fill, 14rem);gap:.5rem}.vertical.sc-smoothly-input-demo-standard-h>div.input-wrapper.sc-smoothly-input-demo-standard>.width.sc-smoothly-input-demo-standard,.vertical.sc-smoothly-input-demo-standard-h>div.input-wrapper.sc-smoothly-input-demo-standard>.height.sc-smoothly-input-demo-standard,.vertical.sc-smoothly-input-demo-standard-h>div.input-wrapper.sc-smoothly-input-demo-standard>.left-padding.sc-smoothly-input-demo-standard{display:none}.vertical.sc-smoothly-input-demo-standard-h>div.input-wrapper.sc-smoothly-input-demo-standard>.guide-lines.sc-smoothly-input-demo-standard::before,.vertical.sc-smoothly-input-demo-standard-h>div.input-wrapper.sc-smoothly-input-demo-standard>.guide-lines.sc-smoothly-input-demo-standard::after{content:\"\";pointer-events:none;right:0;width:100vw;position:absolute;z-index:2;border-top:1px dotted black}.sc-smoothly-input-demo-standard-h:not(.vertical) .guide-lines.sc-smoothly-input-demo-standard{display:none}.guide-lines.sc-smoothly-input-demo-standard{text-align:end;justify-self:center;align-content:center}.guide-lines.sc-smoothly-input-demo-standard::before{top:1rem}.guide-lines.sc-smoothly-input-demo-standard::after{top:2rem}.guide-lines.show-label.sc-smoothly-input-demo-standard::before{top:1.05rem}.guide-lines.show-label.sc-smoothly-input-demo-standard::after{top:2.3rem}";
9634
+ const SmoothlyInputDemoStandardStyle0 = styleCss$W;
9629
9635
 
9630
9636
  const SmoothlyInputDemoStandard = class {
9631
9637
  constructor(hostRef) {
@@ -9648,14 +9654,14 @@ const SmoothlyInputDemoStandard = class {
9648
9654
  }
9649
9655
  render() {
9650
9656
  const placeholder = this.options.placeholder ? "placeholder" : undefined;
9651
- return (index.h(index.Host, { key: '4e10f0d5eb28d0510f7cb21e96186431be670d89', class: { vertical: !!this.options.vertical } }, index.h("div", { key: '9b2b4b702969c7d015f5c1dbfe3aa4e74fd8c540', class: "description" }, index.h("h2", { key: 'a2c21fe6391d84db87497e6a4ff4e2b70c4d5f80' }, "Input Standard"), index.h("p", { key: '9bfda6f0a0dd936202f114d4637ee12bf08edbe3' }, "Height of input should be ", index.h("code", { key: 'ab833f468eefb8c0ae2f4062670cc77ba9b4a2fa' }, "3rem"), " including border. This is should result in a 48 pixel height at 100% zoom, assuming a root font-size of 16 pixels."), index.h("smoothly-form", { key: 'e99dbf780a7782a81fcb72edaa2d7f5457da8beb', looks: "grid", onSmoothlyFormInput: (e) => (this.options = e.detail) }, index.h("smoothly-input-select", { key: '9f1e9f65aaaaa38af2fb65b85a8fb83454c332d9', name: "looks" }, index.h("span", { key: '3b84ca0fb05114ae3795f523615f41ba5dca0bdc', slot: "label" }, "Looks"), Looks.types.map(l => (index.h("smoothly-item", { value: l }, l)))), index.h("smoothly-input-checkbox", { key: '77e00ac8693dbccc4f57b14185a52efbcb5fd41c', name: "readonly" }, "Readonly"), index.h("smoothly-input-select", { key: '87f8b71bd390aa5fd9cebaa736cea67895c29536', name: "color" }, index.h("span", { key: 'd451f9ed64066336c60239eacd7cbf153fd4e1d7', slot: "label" }, "Color"), Scrollable.Color.types.map(c => (index.h("smoothly-item", { value: c }, index.h("span", { color: c }, c)))), index.h("smoothly-input-clear", { key: 'ff5c0ce5115ddd31522a91b3bb95f539ba1684e5', slot: "end" })), index.h("smoothly-input-checkbox", { key: '732ddc3aef6cb9c26fb5524ce2227e488c05254f', name: "vertical" }, "Vertical Layout"), index.h("smoothly-input-checkbox", { key: '1c958a47f2e6d866c82dfc767ea46706eec75dfb', name: "showLabel", checked: this.options.showLabel }, "Show Label"), index.h("smoothly-input-checkbox", { key: 'a710c74606aca3e9a19f39c492e50737f1ed24df', name: "placeholder", checked: this.options.placeholder }, "Placeholder"), index.h("smoothly-input-range", { key: 'ba771530eadb363d3097c0d96138a7bf44ff1673', label: "Border Radius (rem)", name: "borderRadius", value: this.options.borderRadius, min: 0, max: 2, step: 0.25 }))), index.h("div", { key: '7ae3270b14d538ba0694bab2de7d85f0aab431af', class: "input-wrapper", style: { "--smoothly-input-border-radius": `${this.options.borderRadius}rem` } }, index.h("div", { key: 'f49c38040b5dda13e4e805fdcaeea1ff0a459dbb', class: "width" }, "100%"), index.h("div", { key: '6f7cb40aefe9bc700e4596b2632d99da07226307', class: "left-padding" }, "0.5rem - left padding"), index.h("smoothly-input", { key: '5bb2e783bbcc3a58d6c5acdb1f8bbc041da04191', name: "text", looks: this.options.looks, placeholder: placeholder, readonly: this.options.readonly, color: this.options.color, showLabel: this.options.showLabel }, this.options.showLabel && index.h("span", { key: '23d8e1f1c3bdef9fee261977c859fe02ce553727' }, "Text"), index.h("smoothly-input-clear", { key: '5fcbc008484fd538c0b38c022e21c2517392a1fa', slot: "end" })), index.h("div", { key: '85718f38cfc3fac720618543d7b0cd730eb36ad3', class: "height" }), index.h("smoothly-input-select", { key: '3df2a457315696c953f23aba6340b137195adb39', name: "month", looks: this.options.looks, placeholder: placeholder, readonly: this.options.readonly, color: this.options.color }, this.options.showLabel && index.h("label", { key: '77290d485806c27b165b3342b4c80350cbb8ee25', slot: "label" }, "Select"), index.h("smoothly-item", { key: '99b7fbad3137c7e4c9b92475e7d309b62648f22a', value: "1" }, "January"), index.h("smoothly-item", { key: 'f23acba69d6de3dfa9412fcc97bf1f8f6e014d67', value: "2" }, "February"), index.h("smoothly-item", { key: 'e4ffe245efc2c63dddeb6850feb3c9f9d38c4fb6', value: "3" }, "March"), index.h("smoothly-item", { key: '86122909ed7a82abea77bb9350d81f1e882e811e', value: "4" }, "April"), index.h("smoothly-item", { key: 'cb2e877d9571f816ac1dbb0128bde317af0fe7ec', value: "5" }, "May"), index.h("smoothly-item", { key: 'eda0c6dc42fb25f4eeba5310c631bc2104002030', value: "6" }, "June"), index.h("smoothly-item", { key: 'df65330b2f39efe3d8a030bf71b11f6a9342a754', value: "7" }, "July"), index.h("smoothly-item", { key: '8944af056b0d2e3946cd6d7c1cdf6a05df6e2536', value: "8" }, "August"), index.h("smoothly-item", { key: '68220d8d44f857cdd462c2d58ac764c5da3465b5', value: "9" }, "September"), index.h("smoothly-item", { key: 'b6e2589030646c4760e9bacb172db8e07f066bfe', value: "10" }, "October"), index.h("smoothly-item", { key: '4a446940c5b9ca7190787a1eaba51803c28a0095', value: "11" }, "November"), index.h("smoothly-item", { key: '2ec0f1cb158d31292401c6254d72652c605d3cc7', value: "12" }, "December"), index.h("smoothly-input-clear", { key: '029afac367bf9c37f6f11669740f2863fbd7ce78', slot: "end" })), index.h("div", { key: 'c99fc11ba5be8def7181bd8bc9273f20cbb4923c', class: "height" }), index.h("smoothly-input-checkbox", { key: '26ce8e4d1dcb6cd8a7c5f2a86d92f355a302aab9', looks: this.options.looks, readonly: this.options.readonly, color: this.options.color }, "Check"), index.h("div", { key: 'c5ed1d671f23491904635358619f30832ec2cc81', class: "height" }), index.h("smoothly-input-radio", { key: 'bea498eee5d98b1aaf03116f4e981169268cb23b', looks: this.options.looks, readonly: this.options.readonly, color: this.options.color, showLabel: this.options.showLabel }, this.options.showLabel && index.h("label", { key: 'b1d858188959a28954181e78a6d36787c3c04afe', slot: "label" }, "Radio"), index.h("smoothly-input-radio-item", { key: 'b8ddd523e395f5c0e25636d0c024ff1431a6ce77', value: "first" }, "Label 1"), index.h("smoothly-input-radio-item", { key: '202e97eae6401dd1d725d2656f2d8cebded460e0', selected: true, value: "second" }, "Label 2"), index.h("smoothly-input-radio-item", { key: '3ed079468ba539e332675f401f7578b23d255df2', value: "third" }, "Label 3"), index.h("smoothly-input-clear", { key: 'ba656e92b96b300b9fd0561b6ea76224fb819fc4', slot: "end" })), index.h("div", { key: 'b5e5398836dc34b9daee143354b3a91a83bd62de', class: "height" }), index.h("smoothly-input-file", { key: '6126408cd7770f339c1661d86d3b619973d01061', looks: this.options.looks, readonly: this.options.readonly, color: this.options.color, placeholder: placeholder, showLabel: this.options.showLabel }, this.options.showLabel && index.h("span", { key: '336658082d7f580dbc9ef000e47a2a4f3738f427', slot: "label" }, "File"), index.h("smoothly-input-clear", { key: 'bb53bb75963346d980c01c7814108d0eec21a33c', slot: "end" })), index.h("div", { key: '49d8c35ea7317cd6ddf70eabf54494cbee4e6ed5', class: "height" }), index.h("smoothly-input-range", { key: '5d2b708c5837134c164a2b10f8c4a62088855c6c', label: this.options.showLabel ? "Range" : undefined, looks: this.options.looks, readonly: this.options.readonly, color: this.options.color }, index.h("smoothly-input-clear", { key: 'fbd4a69fa25bac1fe0579ae2677d7a0900eb45b5', slot: "end" })), index.h("div", { key: 'f17fbd46698f04d3c53e0357d837e8a2f58f5d3c', class: "height" }), index.h("smoothly-input-color", { key: '94dabbeeeee831131b5b30dd6c6fac94ec639789', looks: this.options.looks, readonly: this.options.readonly, color: this.options.color, showLabel: this.options.showLabel }, this.options.showLabel && index.h("span", { key: '56f67d59608fb2fa7bb38602eadf5d5498a56ac7' }, "Color"), index.h("smoothly-input-clear", { key: '3a9e50a5847b8c1fad4bc751c0fa1e491d117d31', slot: "end" })), index.h("div", { key: '249584c44dde3e87b6b033b04f3a58457eea507a', class: "height" }), index.h("smoothly-input-date", { key: 'a0ccd5fb348cffafeb6841f95c13d608c78e3f57', looks: this.options.looks, readonly: this.options.readonly, color: this.options.color, showLabel: this.options.showLabel }, this.options.showLabel && index.h("span", { key: 'b6cbe5209daf9bca4d8e7b78edbfbf4d81e60509' }, "Date"), index.h("smoothly-input-clear", { key: '2480daa13efe13045889211a9c768224e3dd658d', slot: "end" })), index.h("div", { key: '235419c95e2a9ad6b9c20e08698cb724a58279e6', class: "height" }), index.h("smoothly-input-date-range", { key: '426650cd055a27d94a08e985b81abd49ea2ef649', looks: this.options.looks, readonly: this.options.readonly, color: this.options.color, placeholder: placeholder, showLabel: this.options.showLabel }, this.options.showLabel && index.h("span", { key: '3c57b0f1489d483420db5d80926e3651044dafc2' }, "Date Range"), index.h("smoothly-input-clear", { key: 'a8348f4a932bf7abb7c448364287a7053d873edc', slot: "end" })), index.h("div", { key: '53b0aad98c34e95de4e71c5390981b1f8ef3ce32', class: "height" }), index.h("div", { key: '487394cb94a04c1515c365f916759b55edadedb3', class: { "guide-lines": true, "show-label": !!this.options.showLabel } }, this.options.showLabel ? "Aligned labels & values" : "Center values"))));
9657
+ return (index.h(index.Host, { key: '87ded360e0757684c36df766dc4a98995d91f410', class: { vertical: !!this.options.vertical } }, index.h("div", { key: '0f3abd6202fdab215411d4441b276db6f41e8f62', class: "description" }, index.h("h2", { key: '07d167c5337764bea7c6837acd61bbdf0fbc27c9' }, "Input Standard"), index.h("p", { key: '13d087b3c165ae403bc7df9f8ca46268709df005' }, "Height of input should be ", index.h("code", { key: 'ee27c4071f8edea1080432f2a9e952fe6b2e52be' }, "3rem"), " including border. This is should result in a 48 pixel height at 100% zoom, assuming a root font-size of 16 pixels."), index.h("smoothly-form", { key: '962a004e4d6789fb6b39591a8c05e2531557890a', looks: "grid", onSmoothlyFormInput: (e) => (this.options = e.detail) }, index.h("smoothly-input-select", { key: '4497bcc9662109d26da0db727364b53b85ec0ba9', name: "looks" }, index.h("span", { key: '956d761688fd69e70872d445b4e67bfc3ccac809', slot: "label" }, "Looks"), Looks.types.map(l => (index.h("smoothly-item", { value: l }, l)))), index.h("smoothly-input-checkbox", { key: 'eb6586edfc70a7bed7413886c3aa76418b46793d', name: "readonly" }, "Readonly"), index.h("smoothly-input-select", { key: 'b74383882c4648a96ff474f5b12d87603544fdaa', name: "color" }, index.h("span", { key: '5baefdeee8857e5c12f90653a563daf6336031f1', slot: "label" }, "Color"), Scrollable.Color.types.map(c => (index.h("smoothly-item", { value: c }, index.h("span", { color: c }, c)))), index.h("smoothly-input-clear", { key: '572e44dfdd2d9d4664cbd2c3fd1b89fe89cc72fe', slot: "end" })), index.h("smoothly-input-checkbox", { key: 'a7a213ce6fccda1ec23fc48de6d9fe050a27e245', name: "vertical" }, "Vertical Layout"), index.h("smoothly-input-checkbox", { key: 'a3edb07aebdcb380cb885a2136b738ecfd44ace8', name: "showLabel", checked: this.options.showLabel }, "Show Label"), index.h("smoothly-input-checkbox", { key: '5acb329383072197e54b96668f44d08ec26bf210', name: "placeholder", checked: this.options.placeholder }, "Placeholder"), index.h("smoothly-input-range", { key: '821bd6134b7b448f586f0de49d1e30351c151b4c', label: "Border Radius (rem)", name: "borderRadius", value: this.options.borderRadius, min: 0, max: 2, step: 0.25 }))), index.h("div", { key: '769871d848dcfa8cbb40b1b46d1c6902a309890e', class: "input-wrapper", style: { "--smoothly-input-border-radius": `${this.options.borderRadius}rem` } }, index.h("div", { key: '79a45e35b9469ae3284ed876e18f1438626b6042', class: "width" }, "100%"), index.h("div", { key: '6ef396bb81530ed27aacc5220adc0a8ea8abfeab', class: "left-padding" }, "0.5rem - left padding"), index.h("smoothly-input", { key: '004bbd25ff3845c8ab32a3788a5243fff573205b', name: "text", looks: this.options.looks, placeholder: placeholder, readonly: this.options.readonly, color: this.options.color, showLabel: this.options.showLabel }, this.options.showLabel && index.h("span", { key: '7e345ca5e9236021ce7bf4c67d765aa35d809ae4' }, "Text"), index.h("smoothly-input-clear", { key: 'd62132dc410d2df6adbd7eb02edfdde21d67b3df', slot: "end" })), index.h("div", { key: '838c3bf4e54ef029cb2ccc63afba6112874f2911', class: "height" }), index.h("smoothly-input-select", { key: '5fce85e7f25fdce59b258213b1c79f0aafdf03cb', name: "month", looks: this.options.looks, placeholder: placeholder, readonly: this.options.readonly, color: this.options.color }, this.options.showLabel && index.h("label", { key: 'def0597cf4bc08d81760136b8357e57cd63d32cf', slot: "label" }, "Select"), index.h("smoothly-item", { key: '7cc0334ed97ae321dc23e6938838b12fbf2bc256', value: "1" }, "January"), index.h("smoothly-item", { key: 'a0d500eeec8c40ab1fdd0e6b565d57b1a947eb98', value: "2" }, "February"), index.h("smoothly-item", { key: '27b8ebd25aaa0ca49ffbab867918bc2becefad70', value: "3" }, "March"), index.h("smoothly-item", { key: '6f41fb81857c718ad9c809751a594d0a6dcd5a1e', value: "4" }, "April"), index.h("smoothly-item", { key: 'e46454b401e762532cef546505cee6efaca7b6cb', value: "5" }, "May"), index.h("smoothly-item", { key: '8fe4ca56569fccc0447c1fa3abc2edcca5e37ce4', value: "6" }, "June"), index.h("smoothly-item", { key: 'c8e098d40a8a81319da798e62c43dbfe4ffd33dd', value: "7" }, "July"), index.h("smoothly-item", { key: 'c5a80322dce8c851a427fd023b8b1595d09bab61', value: "8" }, "August"), index.h("smoothly-item", { key: 'a2e77fb96cfe8aac7ab9bdb4e39701ec65611336', value: "9" }, "September"), index.h("smoothly-item", { key: '4a379f2189232123b0815b3e7dc4617238021ff4', value: "10" }, "October"), index.h("smoothly-item", { key: 'dd168a5b940f08de68fc5b31f3974916fd992da0', value: "11" }, "November"), index.h("smoothly-item", { key: '20c131780c62ca906539114d133d36f475ec4bbc', value: "12" }, "December"), index.h("smoothly-input-clear", { key: 'a1807d2003af2bc895501582a17872794156cc21', slot: "end" })), index.h("div", { key: 'afe03c77f5fdd9adcd0123601b38283e40f9e7dd', class: "height" }), index.h("smoothly-input-checkbox", { key: 'd0c23ca3d88815428a75acf1b19352a8124e5362', looks: this.options.looks, readonly: this.options.readonly, color: this.options.color }, "Check"), index.h("div", { key: 'e8378566e091ddcf5986137c61b5c88caa6fa63a', class: "height" }), index.h("smoothly-input-radio", { key: '2137468d8f961aee10d3689fe04d7d6f3cabff8a', looks: this.options.looks, readonly: this.options.readonly, color: this.options.color, showLabel: this.options.showLabel }, this.options.showLabel && index.h("label", { key: 'e43d08e89d58a3064c1415b4b7486315edf1bbc4', slot: "label" }, "Radio"), index.h("smoothly-input-radio-item", { key: '433829f46056ecca05339edabd55dfd0c43b055f', value: "first" }, "Label 1"), index.h("smoothly-input-radio-item", { key: 'fab7a9065eb0d63f0d3314d5af0ddee96a0b2e96', selected: true, value: "second" }, "Label 2"), index.h("smoothly-input-radio-item", { key: 'b13ff5501e43d776d6cba7cf2abee1d892f8f3e5', value: "third" }, "Label 3"), index.h("smoothly-input-clear", { key: '845649da3365ddf6bc95337e50ebded1216dab68', slot: "end" })), index.h("div", { key: 'b4d503fe5b25fa31102e64f38f8dcbe698b2d6bd', class: "height" }), index.h("smoothly-input-file", { key: '5d58ee600f2f518707f9cd5c90f47a7f04734614', looks: this.options.looks, readonly: this.options.readonly, color: this.options.color, placeholder: placeholder, showLabel: this.options.showLabel }, this.options.showLabel && index.h("span", { key: '48d2911f19b85977b6ba2176f711b4ed544c6142', slot: "label" }, "File"), index.h("smoothly-input-clear", { key: 'd1c30f69f7bcbd3c4eb0bbb247b975d345d4d6ff', slot: "end" })), index.h("div", { key: 'fc7424c55114d84af6f0057597ae2a8298279c63', class: "height" }), index.h("smoothly-input-range", { key: '6d902bef05a0dbc617914e5e717af30a80feda9b', label: this.options.showLabel ? "Range" : undefined, looks: this.options.looks, readonly: this.options.readonly, color: this.options.color }, index.h("smoothly-input-clear", { key: 'd04b58cd2c8fce340d1c07b7c43368eb4740ebe5', slot: "end" })), index.h("div", { key: '078f6869c2eb76bc359bb32e1f301ef6149b9fce', class: "height" }), index.h("smoothly-input-color", { key: '7cc1a5eef8d6d21149f3c633d092b141fd975e7d', looks: this.options.looks, readonly: this.options.readonly, color: this.options.color, showLabel: this.options.showLabel }, this.options.showLabel && index.h("span", { key: '4fefa1d335c3c9719d23068ac1b095e419ce3888' }, "Color"), index.h("smoothly-input-clear", { key: 'dec6684b14c4ff081e666efc9531f3b658dabfdb', slot: "end" })), index.h("div", { key: 'e1e5487933bf548b3b781b854f82c984f9e19f2d', class: "height" }), index.h("smoothly-input-date", { key: '361e15f4bb8fa46ca32db1d91d47f2314f29b29d', looks: this.options.looks, readonly: this.options.readonly, color: this.options.color, showLabel: this.options.showLabel }, this.options.showLabel && index.h("span", { key: 'd232de93bb672f616944cdd2486be57d47cd634b' }, "Date"), index.h("smoothly-input-clear", { key: 'c0974361753ed3fdb458f5873e5a867fa48f7394', slot: "end" })), index.h("div", { key: '43263b84a5001972df19490dbb97035a01d52e69', class: "height" }), index.h("smoothly-input-date-range", { key: 'b609effabab1e33dc77fdba4c9a018c71338a526', looks: this.options.looks, readonly: this.options.readonly, color: this.options.color, placeholder: placeholder, showLabel: this.options.showLabel }, this.options.showLabel && index.h("span", { key: '8e06dd462bb6ad2c67e91b6d3343ec9cbc682ff4' }, "Date Range"), index.h("smoothly-input-clear", { key: 'fc8a521bfcd33277c0ab7c753e1fd727c5939427', slot: "end" })), index.h("div", { key: '06b1ee403c5ae251a0d49f275fec06807d427807', class: "height" }), index.h("div", { key: '1070a5c4bb8db9fa0d9f50a270630dc1466d6c65', class: { "guide-lines": true, "show-label": !!this.options.showLabel } }, this.options.showLabel ? "Aligned labels & values" : "Center values"))));
9652
9658
  }
9653
9659
  get element() { return index.getElement(this); }
9654
9660
  };
9655
9661
  SmoothlyInputDemoStandard.style = SmoothlyInputDemoStandardStyle0;
9656
9662
 
9657
- const styleCss$U = "[color=default].sc-smoothly-input-edit{--smoothly-color:var(--smoothly-default-color);--smoothly-color-contrast:var(--smoothly-default-contrast);--smoothly-color-shade:var(--smoothly-default-shade);--smoothly-color-tint:var(--smoothly-default-tint)}[color=primary].sc-smoothly-input-edit{--smoothly-color:var(--smoothly-primary-color);--smoothly-color-contrast:var(--smoothly-primary-contrast);--smoothly-color-shade:var(--smoothly-primary-shade);--smoothly-color-tint:var(--smoothly-primary-tint)}[color=secondary].sc-smoothly-input-edit{--smoothly-color:var(--smoothly-secondary-color);--smoothly-color-contrast:var(--smoothly-secondary-contrast);--smoothly-color-shade:var(--smoothly-secondary-shade);--smoothly-color-tint:var(--smoothly-secondary-tint)}[color=tertiary].sc-smoothly-input-edit{--smoothly-color:var(--smoothly-tertiary-color);--smoothly-color-contrast:var(--smoothly-tertiary-contrast);--smoothly-color-shade:var(--smoothly-tertiary-shade);--smoothly-color-tint:var(--smoothly-tertiary-tint)}[color=success].sc-smoothly-input-edit{--smoothly-color:var(--smoothly-success-color);--smoothly-color-contrast:var(--smoothly-success-contrast);--smoothly-color-shade:var(--smoothly-success-shade);--smoothly-color-tint:var(--smoothly-success-tint)}[color=warning].sc-smoothly-input-edit{--smoothly-color:var(--smoothly-warning-color);--smoothly-color-contrast:var(--smoothly-warning-contrast);--smoothly-color-shade:var(--smoothly-warning-shade);--smoothly-color-tint:var(--smoothly-warning-tint)}[color=danger].sc-smoothly-input-edit{--smoothly-color:var(--smoothly-danger-color);--smoothly-color-contrast:var(--smoothly-danger-contrast);--smoothly-color-shade:var(--smoothly-danger-shade);--smoothly-color-tint:var(--smoothly-danger-tint)}[color=light].sc-smoothly-input-edit{--smoothly-color:var(--smoothly-light-color);--smoothly-color-contrast:var(--smoothly-light-contrast);--smoothly-color-shade:var(--smoothly-light-shade);--smoothly-color-tint:var(--smoothly-light-tint)}[color=medium].sc-smoothly-input-edit{--smoothly-color:var(--smoothly-medium-color);--smoothly-color-contrast:var(--smoothly-medium-contrast);--smoothly-color-shade:var(--smoothly-medium-shade);--smoothly-color-tint:var(--smoothly-medium-tint)}[color=dark].sc-smoothly-input-edit{--smoothly-color:var(--smoothly-dark-color);--smoothly-color-contrast:var(--smoothly-dark-contrast);--smoothly-color-shade:var(--smoothly-dark-shade);--smoothly-color-tint:var(--smoothly-dark-tint)}.sc-smoothly-input-edit-h{--smoothly-button-border-radius:0.5rem;display:inline-block;box-sizing:border-box;border-radius:var(--smoothly-button-border-radius);cursor:pointer;border:none;outline:none;position:relative}[shape=rounded].sc-smoothly-input-edit-h{--smoothly-button-border-radius:2rem}[type=link].sc-smoothly-input-edit-h{display:inline}[disabled].sc-smoothly-input-edit-h{opacity:0.5;pointer-events:none}.sc-smoothly-input-edit-h>a.sc-smoothly-input-edit,.sc-smoothly-input-edit-h>button.sc-smoothly-input-edit{font-size:110%;font-weight:400;border:1px solid transparent;outline:none;background-color:transparent;cursor:pointer;display:inline-flex;gap:0.5rem;box-sizing:border-box}.sc-smoothly-input-edit-h>a.sc-smoothly-input-edit:empty,.sc-smoothly-input-edit-h>button.sc-smoothly-input-edit:empty{border-width:0}.sc-smoothly-input-edit-h>button.sc-smoothly-input-edit{font-weight:bold;justify-content:center;height:100%;width:100%;border-radius:var(--smoothly-button-border-radius);align-items:center}.sc-smoothly-input-edit-h:not([size=icon]):not([size=flexible])>button.sc-smoothly-input-edit{padding:0.8em;min-width:8em}.sc-smoothly-input-edit-h:not([size=icon]):not([size=flexible]):has(smoothly-icon)>button.sc-smoothly-input-edit{padding:0.6em}[size=icon].sc-smoothly-input-edit-h>button.sc-smoothly-input-edit{padding:0.5em}[type=button].sc-smoothly-input-edit-h>a.sc-smoothly-input-edit{text-align:center;text-decoration:inherit;width:calc(100% - 0.6em)}[size=small].sc-smoothly-input-edit-h>button.sc-smoothly-input-edit{font-size:100%}[size=large].sc-smoothly-input-edit-h>button.sc-smoothly-input-edit{font-size:130%}.sc-smoothly-input-edit-h:not([size=icon]){min-width:8em}[size=flexible].sc-smoothly-input-edit-h{min-width:unset;padding:0;margin:0;display:flex;justify-content:center;align-items:center}[size=flexible].sc-smoothly-input-edit-h>button.sc-smoothly-input-edit{min-width:unset;padding:0;margin:0}[expand].sc-smoothly-input-edit-h{width:100%}[expand=full].sc-smoothly-input-edit-h{border-left:none;border-right:none;--smoothly-button-border-radius:0}[fill=outline].sc-smoothly-input-edit-h>button.sc-smoothly-input-edit{background-color:transparent;color:rgb(var(--smoothly-button-foreground));fill:rgb(var(--smoothly-button-foreground));stroke:rgb(var(--smoothly-button-foreground));border-color:rgb(var(--smoothly-button-foreground))}.sc-smoothly-input-edit-h:not([fill=clear])>button.sc-smoothly-input-edit:hover,.sc-smoothly-input-edit-h>button.sc-smoothly-input-edit:focus-visible,[fill=outline].sc-smoothly-input-edit-h:active>button.sc-smoothly-input-edit::before{border-color:rgb(var(--smoothly-button-focus-color))}[fill=outline].sc-smoothly-input-edit-h>button.sc-smoothly-input-edit:hover::before,[fill=outline].sc-smoothly-input-edit-h>button.sc-smoothly-input-edit:focus-within::before,[fill=outline].sc-smoothly-input-edit-h>button.sc-smoothly-input-edit:active::before{content:\"\";position:absolute;border:2px solid rgb(var(--smoothly-button-focus-border));inset:-1px;border-radius:var(--smoothly-button-border-radius)}.sc-smoothly-input-edit-h:not([fill=clear]):not([fill=outline])>button.sc-smoothly-input-edit:hover,.sc-smoothly-input-edit-h:not([fill=clear]):not([fill=outline])>button.sc-smoothly-input-edit:focus-visible,.sc-smoothly-input-edit-h:not([fill=clear]):not([fill=outline])>button.sc-smoothly-input-edit:active{background:rgb(var(--smoothly-button-hover-background))}.sc-smoothly-input-edit-h>button.sc-smoothly-input-edit,.sc-smoothly-input-edit-h.sc-smoothly-input-edit-s>smoothly-icon,.sc-smoothly-input-edit-h .sc-smoothly-input-edit-s>smoothly-icon{color:rgb(var(--smoothly-button-foreground));stroke:rgb(var(--smoothly-button-foreground));fill:rgb(var(--smoothly-button-foreground))}[hidden].sc-smoothly-input-edit-h{display:none}.sc-smoothly-input-edit-h:not([display]){display:none}[editable].sc-smoothly-input-edit-h{opacity:0.5}.sc-smoothly-input-edit-h[type=\"input\"].sc-smoothly-input-edit-s>smoothly-button>button{cursor:pointer;filter:opacity(60%);--smoothly-button-foreground:var(--smoothly-input-foreground);background-color:transparent}.sc-smoothly-input-edit-h smoothly-icon.default.sc-smoothly-input-edit{transform:translate(.1em, -.1em)}.sc-smoothly-input-edit-h.sc-smoothly-input-edit-s>button>*+smoothly-icon{display:none}";
9658
- const SmoothlyInputEditStyle0 = styleCss$U;
9663
+ const styleCss$V = "[color=default].sc-smoothly-input-edit{--smoothly-color:var(--smoothly-default-color);--smoothly-color-contrast:var(--smoothly-default-contrast);--smoothly-color-shade:var(--smoothly-default-shade);--smoothly-color-tint:var(--smoothly-default-tint)}[color=primary].sc-smoothly-input-edit{--smoothly-color:var(--smoothly-primary-color);--smoothly-color-contrast:var(--smoothly-primary-contrast);--smoothly-color-shade:var(--smoothly-primary-shade);--smoothly-color-tint:var(--smoothly-primary-tint)}[color=secondary].sc-smoothly-input-edit{--smoothly-color:var(--smoothly-secondary-color);--smoothly-color-contrast:var(--smoothly-secondary-contrast);--smoothly-color-shade:var(--smoothly-secondary-shade);--smoothly-color-tint:var(--smoothly-secondary-tint)}[color=tertiary].sc-smoothly-input-edit{--smoothly-color:var(--smoothly-tertiary-color);--smoothly-color-contrast:var(--smoothly-tertiary-contrast);--smoothly-color-shade:var(--smoothly-tertiary-shade);--smoothly-color-tint:var(--smoothly-tertiary-tint)}[color=success].sc-smoothly-input-edit{--smoothly-color:var(--smoothly-success-color);--smoothly-color-contrast:var(--smoothly-success-contrast);--smoothly-color-shade:var(--smoothly-success-shade);--smoothly-color-tint:var(--smoothly-success-tint)}[color=warning].sc-smoothly-input-edit{--smoothly-color:var(--smoothly-warning-color);--smoothly-color-contrast:var(--smoothly-warning-contrast);--smoothly-color-shade:var(--smoothly-warning-shade);--smoothly-color-tint:var(--smoothly-warning-tint)}[color=danger].sc-smoothly-input-edit{--smoothly-color:var(--smoothly-danger-color);--smoothly-color-contrast:var(--smoothly-danger-contrast);--smoothly-color-shade:var(--smoothly-danger-shade);--smoothly-color-tint:var(--smoothly-danger-tint)}[color=light].sc-smoothly-input-edit{--smoothly-color:var(--smoothly-light-color);--smoothly-color-contrast:var(--smoothly-light-contrast);--smoothly-color-shade:var(--smoothly-light-shade);--smoothly-color-tint:var(--smoothly-light-tint)}[color=medium].sc-smoothly-input-edit{--smoothly-color:var(--smoothly-medium-color);--smoothly-color-contrast:var(--smoothly-medium-contrast);--smoothly-color-shade:var(--smoothly-medium-shade);--smoothly-color-tint:var(--smoothly-medium-tint)}[color=dark].sc-smoothly-input-edit{--smoothly-color:var(--smoothly-dark-color);--smoothly-color-contrast:var(--smoothly-dark-contrast);--smoothly-color-shade:var(--smoothly-dark-shade);--smoothly-color-tint:var(--smoothly-dark-tint)}.sc-smoothly-input-edit-h{--smoothly-button-border-radius:0.5rem;display:inline-block;box-sizing:border-box;border-radius:var(--smoothly-button-border-radius);cursor:pointer;border:none;outline:none;position:relative}[shape=rounded].sc-smoothly-input-edit-h{--smoothly-button-border-radius:2rem}[type=link].sc-smoothly-input-edit-h{display:inline}[disabled].sc-smoothly-input-edit-h{opacity:0.5;pointer-events:none}.sc-smoothly-input-edit-h>a.sc-smoothly-input-edit,.sc-smoothly-input-edit-h>button.sc-smoothly-input-edit{font-size:110%;font-weight:400;border:1px solid transparent;outline:none;background-color:transparent;cursor:pointer;display:inline-flex;gap:0.5rem;box-sizing:border-box}.sc-smoothly-input-edit-h>a.sc-smoothly-input-edit:empty,.sc-smoothly-input-edit-h>button.sc-smoothly-input-edit:empty{border-width:0}.sc-smoothly-input-edit-h>button.sc-smoothly-input-edit{font-weight:bold;justify-content:center;height:100%;width:100%;border-radius:var(--smoothly-button-border-radius);align-items:center}.sc-smoothly-input-edit-h:not([size=icon]):not([size=flexible])>button.sc-smoothly-input-edit{padding:0.8em;min-width:8em}.sc-smoothly-input-edit-h:not([size=icon]):not([size=flexible]):has(smoothly-icon)>button.sc-smoothly-input-edit{padding:0.6em}[size=icon].sc-smoothly-input-edit-h>button.sc-smoothly-input-edit{padding:0.5em}[type=button].sc-smoothly-input-edit-h>a.sc-smoothly-input-edit{text-align:center;text-decoration:inherit;width:calc(100% - 0.6em)}[size=small].sc-smoothly-input-edit-h>button.sc-smoothly-input-edit{font-size:100%}[size=large].sc-smoothly-input-edit-h>button.sc-smoothly-input-edit{font-size:130%}.sc-smoothly-input-edit-h:not([size=icon]){min-width:8em}[size=flexible].sc-smoothly-input-edit-h{min-width:unset;padding:0;margin:0;display:flex;justify-content:center;align-items:center}[size=flexible].sc-smoothly-input-edit-h>button.sc-smoothly-input-edit{min-width:unset;padding:0;margin:0}[expand].sc-smoothly-input-edit-h{width:100%}[expand=full].sc-smoothly-input-edit-h{border-left:none;border-right:none;--smoothly-button-border-radius:0}[fill=outline].sc-smoothly-input-edit-h>button.sc-smoothly-input-edit{background-color:transparent;color:rgb(var(--smoothly-button-foreground));fill:rgb(var(--smoothly-button-foreground));stroke:rgb(var(--smoothly-button-foreground));border-color:rgb(var(--smoothly-button-foreground))}.sc-smoothly-input-edit-h:not([fill=clear])>button.sc-smoothly-input-edit:hover,.sc-smoothly-input-edit-h>button.sc-smoothly-input-edit:focus-visible,[fill=outline].sc-smoothly-input-edit-h:active>button.sc-smoothly-input-edit::before{border-color:rgb(var(--smoothly-button-focus-color))}[fill=outline].sc-smoothly-input-edit-h>button.sc-smoothly-input-edit:hover::before,[fill=outline].sc-smoothly-input-edit-h>button.sc-smoothly-input-edit:focus-within::before,[fill=outline].sc-smoothly-input-edit-h>button.sc-smoothly-input-edit:active::before{content:\"\";position:absolute;border:2px solid rgb(var(--smoothly-button-focus-border));inset:-1px;border-radius:var(--smoothly-button-border-radius)}.sc-smoothly-input-edit-h:not([fill=clear]):not([fill=outline])>button.sc-smoothly-input-edit:hover,.sc-smoothly-input-edit-h:not([fill=clear]):not([fill=outline])>button.sc-smoothly-input-edit:focus-visible,.sc-smoothly-input-edit-h:not([fill=clear]):not([fill=outline])>button.sc-smoothly-input-edit:active{background:rgb(var(--smoothly-button-hover-background))}.sc-smoothly-input-edit-h>button.sc-smoothly-input-edit,.sc-smoothly-input-edit-h.sc-smoothly-input-edit-s>smoothly-icon,.sc-smoothly-input-edit-h .sc-smoothly-input-edit-s>smoothly-icon{color:rgb(var(--smoothly-button-foreground));stroke:rgb(var(--smoothly-button-foreground));fill:rgb(var(--smoothly-button-foreground))}[hidden].sc-smoothly-input-edit-h{display:none}.sc-smoothly-input-edit-h:not([display]){display:none}[editable].sc-smoothly-input-edit-h{opacity:0.5}.sc-smoothly-input-edit-h[type=\"input\"].sc-smoothly-input-edit-s>smoothly-button>button{cursor:pointer;filter:opacity(60%);--smoothly-button-foreground:var(--smoothly-input-foreground);background-color:transparent}.sc-smoothly-input-edit-h smoothly-icon.default.sc-smoothly-input-edit{transform:translate(.1em, -.1em)}.sc-smoothly-input-edit-h.sc-smoothly-input-edit-s>button>*+smoothly-icon{display:none}";
9664
+ const SmoothlyInputEditStyle0 = styleCss$V;
9659
9665
 
9660
9666
  const SmoothlyInputEdit = class {
9661
9667
  constructor(hostRef) {
@@ -9687,13 +9693,13 @@ const SmoothlyInputEdit = class {
9687
9693
  }
9688
9694
  render() {
9689
9695
  var _a;
9690
- return (index.h(index.Host, { key: '3893bd50803a0e1b68650272a4c6e33852523dac', title: this.toolTip }, index.h("smoothly-button", { key: '0d239160f6d1182482c5197919c95e8318df5a34', disabled: this.disabled, size: this.size, type: "button", shape: this.shape, expand: this.expand, color: this.color, fill: (_a = this.fill) !== null && _a !== void 0 ? _a : (this.type == "input" ? "clear" : undefined) }, index.h("slot", { key: '5b2d5a89c7a1189cb303f530838ef62d6d9eeae5' }), index.h("smoothly-icon", { key: '56b6e50451c2d46f4914a0ae4af67daae5567a0a', class: "default", name: "create-outline", size: "tiny" }))));
9696
+ return (index.h(index.Host, { key: 'c4ad85d772797177e47e567e33732a44f732c882', title: this.toolTip }, index.h("smoothly-button", { key: '22653fadf71dc4a22fbbe9991a0797fbf40a3a91', disabled: this.disabled, size: this.size, type: "button", shape: this.shape, expand: this.expand, color: this.color, fill: (_a = this.fill) !== null && _a !== void 0 ? _a : (this.type == "input" ? "clear" : undefined) }, index.h("slot", { key: '3e43434ff280a243a040edd88d02172c599351af' }), index.h("smoothly-icon", { key: '46a7632c22ee809e81a8097ee24bfebb34d221a9', class: "default", name: "create-outline", size: "tiny" }))));
9691
9697
  }
9692
9698
  };
9693
9699
  SmoothlyInputEdit.style = SmoothlyInputEditStyle0;
9694
9700
 
9695
- const styleCss$T = ".sc-smoothly-input-file-h{--input-padding-side:.5rem;--input-value-padding-top:1.25rem;--input-value-padding-bottom:.25rem;--input-min-height:3rem;min-height:var(--input-min-height);box-sizing:border-box;border-radius:var(--smoothly-input-border-radius)}.sc-smoothly-input-file-h[looks=\"border\"].sc-smoothly-input-file-s>smoothly-picker-menu smoothly-input,[looks=\"border\"].sc-smoothly-input-file-h{border:rgb(var(--smoothly-input-border)) solid 1px}[looks=\"border\"][readonly].sc-smoothly-input-file-h{border:transparent solid 1px}.sc-smoothly-input-file-h[looks=\"line\"].sc-smoothly-input-file-s>smoothly-picker-menu smoothly-input,[looks=\"line\"].sc-smoothly-input-file-h{border-bottom:rgb(var(--smoothly-input-border)) solid 1px}[looks=\"line\"][readonly].sc-smoothly-input-file-h{border-bottom:transparent solid 1px}[looks=\"grid\"].sc-smoothly-input-file-h{flex-grow:1;flex-basis:40%;box-shadow:0px 0px 0px 1px rgb(var(--smoothly-input-border));border:none}[looks=\"grid\"][readonly].sc-smoothly-input-file-h{box-shadow:0px 0px 0px 1px rgba(var(--smoothly-input-border-readonly))}[looks=\"transparent\"].sc-smoothly-input-file-h{border:none}[looks=\"transparent\"][readonly].sc-smoothly-input-file-h,[looks=\"transparent\"].sc-smoothly-input-file-h:not(:focus-within){background-color:transparent}[looks=\"transparent\"][readonly].sc-smoothly-input-file-h>input.sc-smoothly-input-file,[looks=\"transparent\"].sc-smoothly-input-file-h:not(:focus-within)>input.sc-smoothly-input-file{background:transparent}[looks=\"transparent\"].sc-smoothly-input-file-h:not([readonly]):focus-within{outline:1px solid rgb(var(--smoothly-input-border))}.sc-smoothly-input-file-h.sc-smoothly-input-file-s>[slot=label],.sc-smoothly-input-file-h .sc-smoothly-input-file-s>[slot=label],.sc-smoothly-input-file-h .label.sc-smoothly-input-file{position:absolute;top:.6rem;opacity:0.8;user-select:none;cursor:inherit;transform-origin:top left;transition:transform 100ms ease}.sc-smoothly-input-file-h.floating-label.sc-smoothly-input-file-s>[slot=label],.sc-smoothly-input-file-h.floating-label .sc-smoothly-input-file-s>[slot=label],.sc-smoothly-input-file-h.has-value.sc-smoothly-input-file-s>[slot=label],.sc-smoothly-input-file-h.has-value .sc-smoothly-input-file-s>[slot=label],.sc-smoothly-input-file-h[placeholder].sc-smoothly-input-file-s>[slot=label],.sc-smoothly-input-file-h[placeholder] .sc-smoothly-input-file-s>[slot=label],.sc-smoothly-input-file-h[readonly].sc-smoothly-input-file-s>[slot=label],.sc-smoothly-input-file-h[readonly] .sc-smoothly-input-file-s>[slot=label],.has-value.sc-smoothly-input-file-h .label.sc-smoothly-input-file,[placeholder].sc-smoothly-input-file-h .label.sc-smoothly-input-file,[readonly].sc-smoothly-input-file-h .label.sc-smoothly-input-file,.sc-smoothly-input-file-h:not([readonly]):focus-within .label.float-on-focus.sc-smoothly-input-file{top:.2rem;transform:scale(0.8)}.sc-smoothly-input-file-h:not([show-label]):not(.show-label) .label.sc-smoothly-input-file{display:none}.sc-smoothly-input-file-h{display:flex;align-items:center;flex-wrap:wrap;overflow:hidden;position:relative;width:100%;padding-left:0.5rem;background-color:rgb(var(--smoothly-input-background));box-sizing:border-box}.sc-smoothly-input-file-h>div.sc-smoothly-input-file>div.mask.sc-smoothly-input-file{position:absolute;inset:0;color:rgb(var(--smoothly-hover-contrast));background-color:rgb(var(--smoothly-input-hover-background))}.sc-smoothly-input-file-h:not(.dragging)>div.sc-smoothly-input-file>div.mask.sc-smoothly-input-file{display:none}.sc-smoothly-input-file-h>div.sc-smoothly-input-file>input.sc-smoothly-input-file{overflow:hidden;height:0;width:0;padding:0}.sc-smoothly-input-file-h:not([show-label])>div.input.sc-smoothly-input-file{display:flex;align-items:center;padding-bottom:0.2rem}.sc-smoothly-input-file-h:not([show-label])>smoothly-button.sc-smoothly-input-file:not(:empty){margin-right:1ch}[show-label].sc-smoothly-input-file-h>div.input.sc-smoothly-input-file{display:flex;padding:var(--input-value-padding-top) 0 var(--input-value-padding-bottom) 0;height:100%;box-sizing:border-box}.sc-smoothly-input-file-h>div.sc-smoothly-input-file>smoothly-button.sc-smoothly-input-file{margin:0;border:none}.sc-smoothly-input-file-h>label.sc-smoothly-input-file{left:var(--input-padding-side)}.sc-smoothly-input-file-h,.sc-smoothly-input-file-h *.sc-smoothly-input-file{cursor:pointer}[readonly].sc-smoothly-input-file-h,[readonly].sc-smoothly-input-file-h *.sc-smoothly-input-file{cursor:not-allowed}";
9696
- const SmoothlyInputFileStyle0 = styleCss$T;
9701
+ const styleCss$U = ".sc-smoothly-input-file-h{--input-padding-side:.5rem;--input-value-padding-top:1.25rem;--input-value-padding-bottom:.25rem;--input-min-height:3rem;min-height:var(--input-min-height);box-sizing:border-box;border-radius:var(--smoothly-input-border-radius)}.sc-smoothly-input-file-h[looks=\"border\"].sc-smoothly-input-file-s>smoothly-picker-menu smoothly-input,[looks=\"border\"].sc-smoothly-input-file-h{border:rgb(var(--smoothly-input-border)) solid 1px}[looks=\"border\"][readonly].sc-smoothly-input-file-h{border:transparent solid 1px}.sc-smoothly-input-file-h[looks=\"line\"].sc-smoothly-input-file-s>smoothly-picker-menu smoothly-input,[looks=\"line\"].sc-smoothly-input-file-h{border-bottom:rgb(var(--smoothly-input-border)) solid 1px}[looks=\"line\"][readonly].sc-smoothly-input-file-h{border-bottom:transparent solid 1px}[looks=\"grid\"].sc-smoothly-input-file-h{flex-grow:1;flex-basis:40%;box-shadow:0px 0px 0px 1px rgb(var(--smoothly-input-border));border:none}[looks=\"grid\"][readonly].sc-smoothly-input-file-h{box-shadow:0px 0px 0px 1px rgba(var(--smoothly-input-border-readonly))}[looks=\"transparent\"].sc-smoothly-input-file-h{border:none}[looks=\"transparent\"][readonly].sc-smoothly-input-file-h,[looks=\"transparent\"].sc-smoothly-input-file-h:not(:focus-within){background-color:transparent}[looks=\"transparent\"][readonly].sc-smoothly-input-file-h>input.sc-smoothly-input-file,[looks=\"transparent\"].sc-smoothly-input-file-h:not(:focus-within)>input.sc-smoothly-input-file{background:transparent}[looks=\"transparent\"].sc-smoothly-input-file-h:not([readonly]):focus-within{outline:1px solid rgb(var(--smoothly-input-border))}.sc-smoothly-input-file-h.sc-smoothly-input-file-s>[slot=label],.sc-smoothly-input-file-h .sc-smoothly-input-file-s>[slot=label],.sc-smoothly-input-file-h .label.sc-smoothly-input-file{position:absolute;top:.6rem;opacity:0.8;user-select:none;cursor:inherit;transform-origin:top left;transition:transform 100ms ease}.sc-smoothly-input-file-h.floating-label.sc-smoothly-input-file-s>[slot=label],.sc-smoothly-input-file-h.floating-label .sc-smoothly-input-file-s>[slot=label],.sc-smoothly-input-file-h.has-value.sc-smoothly-input-file-s>[slot=label],.sc-smoothly-input-file-h.has-value .sc-smoothly-input-file-s>[slot=label],.sc-smoothly-input-file-h[placeholder].sc-smoothly-input-file-s>[slot=label],.sc-smoothly-input-file-h[placeholder] .sc-smoothly-input-file-s>[slot=label],.sc-smoothly-input-file-h[readonly].sc-smoothly-input-file-s>[slot=label],.sc-smoothly-input-file-h[readonly] .sc-smoothly-input-file-s>[slot=label],.has-value.sc-smoothly-input-file-h .label.sc-smoothly-input-file,[placeholder].sc-smoothly-input-file-h .label.sc-smoothly-input-file,[readonly].sc-smoothly-input-file-h .label.sc-smoothly-input-file,.sc-smoothly-input-file-h:not([readonly]):focus-within .label.float-on-focus.sc-smoothly-input-file{top:.2rem;transform:scale(0.8)}.sc-smoothly-input-file-h:not([show-label]):not(.show-label) .label.sc-smoothly-input-file{display:none}.sc-smoothly-input-file-h{display:flex;align-items:center;flex-wrap:wrap;overflow:hidden;position:relative;width:100%;padding-left:0.5rem;background-color:rgb(var(--smoothly-input-background));box-sizing:border-box}.sc-smoothly-input-file-h>div.sc-smoothly-input-file>div.mask.sc-smoothly-input-file{position:absolute;inset:0;color:rgb(var(--smoothly-hover-contrast));background-color:rgb(var(--smoothly-input-hover-background))}.sc-smoothly-input-file-h:not(.dragging)>div.sc-smoothly-input-file>div.mask.sc-smoothly-input-file{display:none}.sc-smoothly-input-file-h>div.sc-smoothly-input-file>input.sc-smoothly-input-file{overflow:hidden;height:0;width:0;padding:0}.sc-smoothly-input-file-h:not([show-label])>div.input.sc-smoothly-input-file{display:flex;align-items:center;padding-bottom:0.2rem}.sc-smoothly-input-file-h:not([show-label])>smoothly-button.sc-smoothly-input-file:not(:empty){margin-right:1ch}[show-label].sc-smoothly-input-file-h>div.input.sc-smoothly-input-file{display:flex;padding:var(--input-value-padding-top) 0 var(--input-value-padding-bottom) 0;height:100%;box-sizing:border-box}.sc-smoothly-input-file-h>div.sc-smoothly-input-file>smoothly-button.sc-smoothly-input-file{margin:0;border:none}.sc-smoothly-input-file-h>label.sc-smoothly-input-file{left:var(--input-padding-side)}.sc-smoothly-input-file-h,.sc-smoothly-input-file-h *.sc-smoothly-input-file{cursor:pointer}[readonly].sc-smoothly-input-file-h,[readonly].sc-smoothly-input-file-h *.sc-smoothly-input-file{cursor:not-allowed}";
9702
+ const SmoothlyInputFileStyle0 = styleCss$U;
9697
9703
 
9698
9704
  const SmoothlyInputFile = class {
9699
9705
  constructor(hostRef) {
@@ -9797,7 +9803,7 @@ const SmoothlyInputFile = class {
9797
9803
  }
9798
9804
  render() {
9799
9805
  var _a, _b, _c;
9800
- return (index.h(index.Host, { key: 'f4564952fa6b429188708dfde4a46071642791be', class: { dragging: this.dragging, "has-value": !!this.value }, tabindex: 0, onClick: (e) => this.clickHandler(e), onDragOver: (e) => this.dragOverHandler(e), onDragEnter: (e) => this.dragEnterHandler(e) }, index.h("label", { key: '425032f8554b49bb2b8a290ba0892aaf640de1c8' }, index.h("slot", { key: '4c5a07a177e7a40ae3e01ede1de501dda9ac86e0', name: "label" })), index.h("div", { key: '4b027176237fe67991f11ce09c44b2df76ec773b', class: "input" }, index.h("smoothly-button", { key: '778160114bc894d9364e073f32b5c5db69dc0516', color: this.color, fill: "clear", size: "flexible" }, index.h("slot", { key: 'afbf717c676c69c3d1bf1e831667132fc8960906', name: "button" })), index.h("span", { key: 'fd666a147562d529ea177ad77593d880d72c69d6' }, (_b = (_a = this.value) === null || _a === void 0 ? void 0 : _a.name) !== null && _b !== void 0 ? _b : this.placeholder), index.h("div", { key: '985c5f24f14c3e045590ac9ec389a1bd404f5816', class: "mask", onDrop: e => this.dropHandler(e), onDragLeave: e => this.dragLeaveHandler(e) }), index.h("input", { key: '83b727df684650e2a7110126b1fa8e2d627d076c', ref: element => (this.input = element), type: "file", capture: this.camera == "back" ? "environment" : "user", accept: (_c = this.accept) !== null && _c !== void 0 ? _c : (!this.camera ? undefined : "image/jpeg"), files: this.files, onInput: e => this.inputHandler(e) })), index.h("slot", { key: 'e60f4d80d448ff44f78f6ab021548bfcf20418fe' })));
9806
+ return (index.h(index.Host, { key: '080d404570c5b5b1dd5058a9e9e34c174a862b2e', class: { dragging: this.dragging, "has-value": !!this.value }, tabindex: 0, onClick: (e) => this.clickHandler(e), onDragOver: (e) => this.dragOverHandler(e), onDragEnter: (e) => this.dragEnterHandler(e) }, index.h("label", { key: '5bae5144a3110a8e1b753756d0486acffd2f446d' }, index.h("slot", { key: 'f458d7dde342570df9bea06f6948086978eb0dbe', name: "label" })), index.h("div", { key: 'eb162a004a196e6b5a6bc5ff27a38ea7e5652bde', class: "input" }, index.h("smoothly-button", { key: '85df1422b232bd96b29044b30d7330584a5d1424', color: this.color, fill: "clear", size: "flexible" }, index.h("slot", { key: 'c0163b9da0bf0880832b9c0893593690172f5c1a', name: "button" })), index.h("span", { key: 'f649fcc391bd60d5623d57563239bf514019d41e' }, (_b = (_a = this.value) === null || _a === void 0 ? void 0 : _a.name) !== null && _b !== void 0 ? _b : this.placeholder), index.h("div", { key: '732ef24078b7333ecfe249e72823ba093183848e', class: "mask", onDrop: e => this.dropHandler(e), onDragLeave: e => this.dragLeaveHandler(e) }), index.h("input", { key: '96b7eff1b52a7e234c97353c204c2ce5a24d2894', ref: element => (this.input = element), type: "file", capture: this.camera == "back" ? "environment" : "user", accept: (_c = this.accept) !== null && _c !== void 0 ? _c : (!this.camera ? undefined : "image/jpeg"), files: this.files, onInput: e => this.inputHandler(e) })), index.h("slot", { key: '2d7ed2ef57653c07b98b182397416de182630059' })));
9801
9807
  }
9802
9808
  get element() { return index.getElement(this); }
9803
9809
  static get watchers() { return {
@@ -9806,8 +9812,8 @@ const SmoothlyInputFile = class {
9806
9812
  };
9807
9813
  SmoothlyInputFile.style = SmoothlyInputFileStyle0;
9808
9814
 
9809
- const styleCss$S = ".sc-smoothly-input-month-h{display:flex;flex-direction:row;justify-content:space-between;background-color:rgb(var(--smoothly-input-background))}.sc-smoothly-input-month-h:not([in-calendar])>smoothly-input-select.sc-smoothly-input-month{display:flex;flex:1}[looks=line].sc-smoothly-input-month-h,[looks=border].sc-smoothly-input-month-h,[looks=transparent].sc-smoothly-input-month-h{gap:2em}.sc-smoothly-input-month-h:not([previous])>smoothly-icon.sc-smoothly-input-month:first-of-type,.sc-smoothly-input-month-h:not([next])>smoothly-icon.sc-smoothly-input-month:last-of-type{display:none}.sc-smoothly-input-month-h>smoothly-icon.sc-smoothly-input-month{display:flex;align-self:center;cursor:pointer}.sc-smoothly-input-month-h>smoothly-icon.disabled.sc-smoothly-input-month{opacity:0.5;cursor:not-allowed}";
9810
- const SmoothlyInputMonthStyle0 = styleCss$S;
9815
+ const styleCss$T = ".sc-smoothly-input-month-h{display:flex;flex-direction:row;justify-content:space-between;background-color:rgb(var(--smoothly-input-background))}.sc-smoothly-input-month-h:not([in-calendar])>smoothly-input-select.sc-smoothly-input-month{display:flex;flex:1}[looks=line].sc-smoothly-input-month-h,[looks=border].sc-smoothly-input-month-h,[looks=transparent].sc-smoothly-input-month-h{gap:2em}.sc-smoothly-input-month-h:not([previous])>smoothly-icon.sc-smoothly-input-month:first-of-type,.sc-smoothly-input-month-h:not([next])>smoothly-icon.sc-smoothly-input-month:last-of-type{display:none}.sc-smoothly-input-month-h>smoothly-icon.sc-smoothly-input-month{display:flex;align-self:center;cursor:pointer}.sc-smoothly-input-month-h>smoothly-icon.disabled.sc-smoothly-input-month{opacity:0.5;cursor:not-allowed}";
9816
+ const SmoothlyInputMonthStyle0 = styleCss$T;
9811
9817
 
9812
9818
  const SmoothlyInputMonth = class {
9813
9819
  constructor(hostRef) {
@@ -9918,9 +9924,9 @@ const SmoothlyInputMonth = class {
9918
9924
  }
9919
9925
  render() {
9920
9926
  var _a, _b;
9921
- return (index.h(index.Host, { key: 'f7c8f232a03bd253c40e3fa8a104eefbb7012bca' }, index.h("smoothly-icon", { key: '294541bc09b9cfa9b6888f148c411cb1d708a74d', name: "caret-back-outline", size: "tiny", color: this.color, fill: "default", class: {
9927
+ return (index.h(index.Host, { key: 'bb8be12ae4ff58f2cc72dfdedf5c2fe562c6e338' }, index.h("smoothly-icon", { key: '97456be9a5ac89ec1374a65439d5cbf11d248e5f', name: "caret-back-outline", size: "tiny", color: this.color, fill: "default", class: {
9922
9928
  disabled: this.readonly || !this.allowPreviousMonth,
9923
- }, onClick: () => this.allowPreviousMonth && this.adjustMonth(-1) }), index.h("smoothly-input-select", { key: '075bc03f65732b7584a713c914c3ccb6b54173fc', ref: e => (this.year = e), name: `${this.name}-year`, readonly: this.readonly, changed: this.changed, menuHeight: "5.5items", required: true, ordered: true, inCalendar: this.inCalendar, showLabel: this.showLabel, onSmoothlyInput: e => this.inputHandler(e), searchDisabled: true }, index.h("div", { key: 'bfc9ea3524bfa7fdc89f1a37e161492dae03fca5', slot: "label" }, index.h("slot", { key: '9838d285f25fd339cf998551e0695b117277caaa', name: "year-label" })), years((_a = this.value) !== null && _a !== void 0 ? _a : TimeZone.Date.now(), this.min, this.max).map(year => (index.h("smoothly-item", { key: year.date, value: year.date, selected: year.selected || this.value == year.date }, year.name)))), index.h("smoothly-input-select", { key: '9399e9f140c3dbd07672779394353234e201cc7b', ref: e => (this.month = e), name: `${this.name}-month`, readonly: this.readonly, color: this.color, looks: this.looks, changed: this.changed, menuHeight: "5.5items", required: true, ordered: true, inCalendar: this.inCalendar, showLabel: this.showLabel, onSmoothlyInput: e => this.inputHandler(e), searchDisabled: true }, index.h("div", { key: '8f480c75256521f111621dbe48bd183c2195ee9a', slot: "label" }, index.h("slot", { key: '0d520a10c3569475b007e52299aabf6ea1472e9c', name: "month-label" })), months((_b = this.value) !== null && _b !== void 0 ? _b : TimeZone.Date.now()).map(month => (index.h("smoothly-item", { key: month.date, value: month.date, selected: month.selected || this.value == month.date }, month.name)))), index.h("smoothly-icon", { key: 'db2c4f5c1398bfb09e1c867d374f81093d3e2ff7', name: "caret-forward-outline", size: "tiny", color: this.color, fill: "default", class: {
9929
+ }, onClick: () => this.allowPreviousMonth && this.adjustMonth(-1) }), index.h("smoothly-input-select", { key: '3f4365988c13f2a334447e5a264af6bfcd6a4962', ref: e => (this.year = e), name: `${this.name}-year`, readonly: this.readonly, changed: this.changed, menuHeight: "5.5items", required: true, ordered: true, inCalendar: this.inCalendar, showLabel: this.showLabel, onSmoothlyInput: e => this.inputHandler(e), searchDisabled: true }, index.h("div", { key: 'e682c9e17657e1bdad4e06826ca2d307c0539d7a', slot: "label" }, index.h("slot", { key: '27697f030d045f8456e03b719050b29a53a1d002', name: "year-label" })), years((_a = this.value) !== null && _a !== void 0 ? _a : TimeZone.Date.now(), this.min, this.max).map(year => (index.h("smoothly-item", { key: year.date, value: year.date, selected: year.selected || this.value == year.date }, year.name)))), index.h("smoothly-input-select", { key: 'a2b409677361046f344919570db7cb34fc10296d', ref: e => (this.month = e), name: `${this.name}-month`, readonly: this.readonly, color: this.color, looks: this.looks, changed: this.changed, menuHeight: "5.5items", required: true, ordered: true, inCalendar: this.inCalendar, showLabel: this.showLabel, onSmoothlyInput: e => this.inputHandler(e), searchDisabled: true }, index.h("div", { key: 'e2ce7bc2c644548cc61a917519208ef96ab8b439', slot: "label" }, index.h("slot", { key: 'e4f77dbedccd604256eaf8f838aab9dad649c300', name: "month-label" })), months((_b = this.value) !== null && _b !== void 0 ? _b : TimeZone.Date.now()).map(month => (index.h("smoothly-item", { key: month.date, value: month.date, selected: month.selected || this.value == month.date }, month.name)))), index.h("smoothly-icon", { key: '7d0397024fdf9a253d00a829e85b696d476c45ed', name: "caret-forward-outline", size: "tiny", color: this.color, fill: "default", class: {
9924
9930
  disabled: this.readonly || !this.allowNextMonth,
9925
9931
  }, onClick: () => this.allowNextMonth && this.adjustMonth(1) })));
9926
9932
  }
@@ -9933,8 +9939,8 @@ const SmoothlyInputMonth = class {
9933
9939
  };
9934
9940
  SmoothlyInputMonth.style = SmoothlyInputMonthStyle0;
9935
9941
 
9936
- const styleCss$R = ".sc-smoothly-input-price-demo-h{display:block}";
9937
- const SmoothlyInputPriceDemoStyle0 = styleCss$R;
9942
+ const styleCss$S = ".sc-smoothly-input-price-demo-h{display:block}";
9943
+ const SmoothlyInputPriceDemoStyle0 = styleCss$S;
9938
9944
 
9939
9945
  const SmoothlyInputPriceDemo = class {
9940
9946
  constructor(hostRef) {
@@ -9943,13 +9949,13 @@ const SmoothlyInputPriceDemo = class {
9943
9949
  this.currency = "USD";
9944
9950
  }
9945
9951
  render() {
9946
- return (index.h(index.Host, { key: 'eae20a79b5023c969b79ba18175e454b044331bf' }, index.h("h2", { key: '006d4cdb680ca8cbfd50e4d1307b0ebac63d82e2' }, "State demo on smoothly-input"), index.h("p", { key: '35088c1dd66f02134f2f4b1d31d24e293e25816e' }, "This demo/test the internal state of the smoothly-input component."), index.h("p", { key: 'ee73e3e2fcffc660369268772b46892d0f66a942' }, "The currency of the price should update when switching between the currencies."), index.h("smoothly-input-radio", { key: '3950d4691f86e340596e9d2560dd53a36e676cd1', name: "currency", onSmoothlyInput: e => (this.currency = TimeZone.Currency.is(e.detail.currency) ? e.detail.currency : undefined) }, this.currencies.map(currency => (index.h("smoothly-input-radio-item", { key: currency, selected: currency == this.currency, value: currency }, currency)))), index.h("smoothly-input", { key: 'e5fd131508b7d6726982bd11d46cbc0007e0846f', type: "price", currency: this.currency }, "price")));
9952
+ return (index.h(index.Host, { key: 'ab14f46624e9d7bfcef3d143700138e0d9220948' }, index.h("h2", { key: 'e357df508351176067791a33f2939611c12cf5e3' }, "State demo on smoothly-input"), index.h("p", { key: '3d210b4211b96b5868c0276addb714315ba3d141' }, "This demo/test the internal state of the smoothly-input component."), index.h("p", { key: '2a72bcfaaa7ec0ba096ea4869010d02330e0f080' }, "The currency of the price should update when switching between the currencies."), index.h("smoothly-input-radio", { key: 'a2181563d8ce20ff72f67fc523d3b434a85a09cb', name: "currency", onSmoothlyInput: e => (this.currency = TimeZone.Currency.is(e.detail.currency) ? e.detail.currency : undefined) }, this.currencies.map(currency => (index.h("smoothly-input-radio-item", { key: currency, selected: currency == this.currency, value: currency }, currency)))), index.h("smoothly-input", { key: 'ffb01069a5a882380d83becc72a4c31c7c75df1a', type: "price", currency: this.currency }, "price")));
9947
9953
  }
9948
9954
  };
9949
9955
  SmoothlyInputPriceDemo.style = SmoothlyInputPriceDemoStyle0;
9950
9956
 
9951
- const styleCss$Q = ".sc-smoothly-input-radio-h{--input-padding-side:.5rem;--input-value-padding-top:1.25rem;--input-value-padding-bottom:.25rem;--input-min-height:3rem;min-height:var(--input-min-height);box-sizing:border-box;border-radius:var(--smoothly-input-border-radius)}.sc-smoothly-input-radio-h[looks=\"border\"].sc-smoothly-input-radio-s>smoothly-picker-menu smoothly-input,[looks=\"border\"].sc-smoothly-input-radio-h{border:rgb(var(--smoothly-input-border)) solid 1px}[looks=\"border\"][readonly].sc-smoothly-input-radio-h{border:transparent solid 1px}.sc-smoothly-input-radio-h[looks=\"line\"].sc-smoothly-input-radio-s>smoothly-picker-menu smoothly-input,[looks=\"line\"].sc-smoothly-input-radio-h{border-bottom:rgb(var(--smoothly-input-border)) solid 1px}[looks=\"line\"][readonly].sc-smoothly-input-radio-h{border-bottom:transparent solid 1px}[looks=\"grid\"].sc-smoothly-input-radio-h{flex-grow:1;flex-basis:40%;box-shadow:0px 0px 0px 1px rgb(var(--smoothly-input-border));border:none}[looks=\"grid\"][readonly].sc-smoothly-input-radio-h{box-shadow:0px 0px 0px 1px rgba(var(--smoothly-input-border-readonly))}[looks=\"transparent\"].sc-smoothly-input-radio-h{border:none}[looks=\"transparent\"][readonly].sc-smoothly-input-radio-h,[looks=\"transparent\"].sc-smoothly-input-radio-h:not(:focus-within){background-color:transparent}[looks=\"transparent\"][readonly].sc-smoothly-input-radio-h>input.sc-smoothly-input-radio,[looks=\"transparent\"].sc-smoothly-input-radio-h:not(:focus-within)>input.sc-smoothly-input-radio{background:transparent}[looks=\"transparent\"].sc-smoothly-input-radio-h:not([readonly]):focus-within{outline:1px solid rgb(var(--smoothly-input-border))}.sc-smoothly-input-radio-h.sc-smoothly-input-radio-s>[slot=label],.sc-smoothly-input-radio-h .sc-smoothly-input-radio-s>[slot=label],.sc-smoothly-input-radio-h .label.sc-smoothly-input-radio{position:absolute;top:.6rem;opacity:0.8;user-select:none;cursor:inherit;transform-origin:top left;transition:transform 100ms ease}.sc-smoothly-input-radio-h.floating-label.sc-smoothly-input-radio-s>[slot=label],.sc-smoothly-input-radio-h.floating-label .sc-smoothly-input-radio-s>[slot=label],.sc-smoothly-input-radio-h.has-value.sc-smoothly-input-radio-s>[slot=label],.sc-smoothly-input-radio-h.has-value .sc-smoothly-input-radio-s>[slot=label],.sc-smoothly-input-radio-h[placeholder].sc-smoothly-input-radio-s>[slot=label],.sc-smoothly-input-radio-h[placeholder] .sc-smoothly-input-radio-s>[slot=label],.sc-smoothly-input-radio-h[readonly].sc-smoothly-input-radio-s>[slot=label],.sc-smoothly-input-radio-h[readonly] .sc-smoothly-input-radio-s>[slot=label],.has-value.sc-smoothly-input-radio-h .label.sc-smoothly-input-radio,[placeholder].sc-smoothly-input-radio-h .label.sc-smoothly-input-radio,[readonly].sc-smoothly-input-radio-h .label.sc-smoothly-input-radio,.sc-smoothly-input-radio-h:not([readonly]):focus-within .label.float-on-focus.sc-smoothly-input-radio{top:.2rem;transform:scale(0.8)}.sc-smoothly-input-radio-h:not([show-label]):not(.show-label) .label.sc-smoothly-input-radio{display:none}.sc-smoothly-input-radio-h{background-color:rgb(var(--smoothly-input-background));display:flex;align-items:center;padding:0 var(--input-padding-side);box-sizing:border-box}[show-label].sc-smoothly-input-radio-h>div.sc-smoothly-input-radio{position:relative;padding:var(--input-value-padding-top) 0 var(--input-value-padding-bottom) 0}.sc-smoothly-input-radio-h>div.sc-smoothly-input-radio,.sc-smoothly-input-radio-h>div.sc-smoothly-input-radio>div.options.sc-smoothly-input-radio{display:flex;gap:1.5rem}.sc-smoothly-input-radio-h.sc-smoothly-input-radio-s>[slot=end]{margin-right:0;margin-left:auto}.sc-smoothly-input-radio-h.sc-smoothly-input-radio-s>[slot=end] button{padding:0}[readonly].sc-smoothly-input-radio-h smoothly-input-radio-item.sc-smoothly-input-radio *.sc-smoothly-input-radio{cursor:not-allowed}";
9952
- const SmoothlyInputRadioStyle0 = styleCss$Q;
9957
+ const styleCss$R = ".sc-smoothly-input-radio-h{--input-padding-side:.5rem;--input-value-padding-top:1.25rem;--input-value-padding-bottom:.25rem;--input-min-height:3rem;min-height:var(--input-min-height);box-sizing:border-box;border-radius:var(--smoothly-input-border-radius)}.sc-smoothly-input-radio-h[looks=\"border\"].sc-smoothly-input-radio-s>smoothly-picker-menu smoothly-input,[looks=\"border\"].sc-smoothly-input-radio-h{border:rgb(var(--smoothly-input-border)) solid 1px}[looks=\"border\"][readonly].sc-smoothly-input-radio-h{border:transparent solid 1px}.sc-smoothly-input-radio-h[looks=\"line\"].sc-smoothly-input-radio-s>smoothly-picker-menu smoothly-input,[looks=\"line\"].sc-smoothly-input-radio-h{border-bottom:rgb(var(--smoothly-input-border)) solid 1px}[looks=\"line\"][readonly].sc-smoothly-input-radio-h{border-bottom:transparent solid 1px}[looks=\"grid\"].sc-smoothly-input-radio-h{flex-grow:1;flex-basis:40%;box-shadow:0px 0px 0px 1px rgb(var(--smoothly-input-border));border:none}[looks=\"grid\"][readonly].sc-smoothly-input-radio-h{box-shadow:0px 0px 0px 1px rgba(var(--smoothly-input-border-readonly))}[looks=\"transparent\"].sc-smoothly-input-radio-h{border:none}[looks=\"transparent\"][readonly].sc-smoothly-input-radio-h,[looks=\"transparent\"].sc-smoothly-input-radio-h:not(:focus-within){background-color:transparent}[looks=\"transparent\"][readonly].sc-smoothly-input-radio-h>input.sc-smoothly-input-radio,[looks=\"transparent\"].sc-smoothly-input-radio-h:not(:focus-within)>input.sc-smoothly-input-radio{background:transparent}[looks=\"transparent\"].sc-smoothly-input-radio-h:not([readonly]):focus-within{outline:1px solid rgb(var(--smoothly-input-border))}.sc-smoothly-input-radio-h.sc-smoothly-input-radio-s>[slot=label],.sc-smoothly-input-radio-h .sc-smoothly-input-radio-s>[slot=label],.sc-smoothly-input-radio-h .label.sc-smoothly-input-radio{position:absolute;top:.6rem;opacity:0.8;user-select:none;cursor:inherit;transform-origin:top left;transition:transform 100ms ease}.sc-smoothly-input-radio-h.floating-label.sc-smoothly-input-radio-s>[slot=label],.sc-smoothly-input-radio-h.floating-label .sc-smoothly-input-radio-s>[slot=label],.sc-smoothly-input-radio-h.has-value.sc-smoothly-input-radio-s>[slot=label],.sc-smoothly-input-radio-h.has-value .sc-smoothly-input-radio-s>[slot=label],.sc-smoothly-input-radio-h[placeholder].sc-smoothly-input-radio-s>[slot=label],.sc-smoothly-input-radio-h[placeholder] .sc-smoothly-input-radio-s>[slot=label],.sc-smoothly-input-radio-h[readonly].sc-smoothly-input-radio-s>[slot=label],.sc-smoothly-input-radio-h[readonly] .sc-smoothly-input-radio-s>[slot=label],.has-value.sc-smoothly-input-radio-h .label.sc-smoothly-input-radio,[placeholder].sc-smoothly-input-radio-h .label.sc-smoothly-input-radio,[readonly].sc-smoothly-input-radio-h .label.sc-smoothly-input-radio,.sc-smoothly-input-radio-h:not([readonly]):focus-within .label.float-on-focus.sc-smoothly-input-radio{top:.2rem;transform:scale(0.8)}.sc-smoothly-input-radio-h:not([show-label]):not(.show-label) .label.sc-smoothly-input-radio{display:none}.sc-smoothly-input-radio-h{background-color:rgb(var(--smoothly-input-background));display:flex;align-items:center;padding:0 var(--input-padding-side);box-sizing:border-box}[show-label].sc-smoothly-input-radio-h>div.sc-smoothly-input-radio{position:relative;padding:var(--input-value-padding-top) 0 var(--input-value-padding-bottom) 0}.sc-smoothly-input-radio-h>div.sc-smoothly-input-radio,.sc-smoothly-input-radio-h>div.sc-smoothly-input-radio>div.options.sc-smoothly-input-radio{display:flex;gap:1.5rem}.sc-smoothly-input-radio-h.sc-smoothly-input-radio-s>[slot=end]{margin-right:0;margin-left:auto}.sc-smoothly-input-radio-h.sc-smoothly-input-radio-s>[slot=end] button{padding:0}[readonly].sc-smoothly-input-radio-h smoothly-input-radio-item.sc-smoothly-input-radio *.sc-smoothly-input-radio{cursor:not-allowed}";
9958
+ const SmoothlyInputRadioStyle0 = styleCss$R;
9953
9959
 
9954
9960
  const SmoothlyInputRadio = class {
9955
9961
  constructor(hostRef) {
@@ -10055,7 +10061,7 @@ const SmoothlyInputRadio = class {
10055
10061
  (_b = (_a = this.listener).changed) === null || _b === void 0 ? void 0 : _b.call(_a, this);
10056
10062
  }
10057
10063
  render() {
10058
- return (index.h(index.Host, { key: '7acf872aa853271bc3e0bb8e17ef4aae02645a06', class: "floating-label" }, index.h("slot", { key: '147f9011fa62e4f571d8bcc3080acacaf4976bfb', name: "start" }), index.h("div", { key: 'bb10827ce5574b1922ec7e7e7b4f7ac6d4cd25e4' }, index.h("slot", { key: '90b73e3f57aa13243b98badd8c4e4c79c60bf2ea', name: "label" }), index.h("div", { key: '7bd6ecbc3e3ec3000926705f69d95b6976683c64', class: "options" }, index.h("slot", { key: '168ede957a777d861520b6736e2488863948534c' }))), index.h("slot", { key: '72555322e23a289b462ee0d1fdd5dba154e14489', name: "end" })));
10064
+ return (index.h(index.Host, { key: '156cf678b0cf1bbce78e2abb384d8a8f247584ac', class: "floating-label" }, index.h("slot", { key: '8ff9f95eed38a9056cbb7c53dc89071ad39564dd', name: "start" }), index.h("div", { key: '91da0baf3757d9b6822611cf9129ef65956fb6d5' }, index.h("slot", { key: 'ec8ae5aebca5b7f2ef7e4925a1d17b6e2be2c288', name: "label" }), index.h("div", { key: '3c9afd82bacc723c67bad00beca11397383149cb', class: "options" }, index.h("slot", { key: 'b2efd49b65335d8b369a371d30f64ea231edc725' }))), index.h("slot", { key: '29bccd7057400dabcaf8a9bcf60ddb6d693c2dc2', name: "end" })));
10059
10065
  }
10060
10066
  get element() { return index.getElement(this); }
10061
10067
  static get watchers() { return {
@@ -10065,8 +10071,8 @@ const SmoothlyInputRadio = class {
10065
10071
  };
10066
10072
  SmoothlyInputRadio.style = SmoothlyInputRadioStyle0;
10067
10073
 
10068
- const styleCss$P = ".sc-smoothly-input-radio-item-h{display:flex;align-items:center;position:relative}.sc-smoothly-input-radio-item-h:hover>*.sc-smoothly-input-radio-item{cursor:pointer}.sc-smoothly-input-radio-item-h>input.sc-smoothly-input-radio-item:focus-visible+smoothly-icon.sc-smoothly-input-radio-item{outline:2px solid rgb(var(--smoothly-primary-color));border-radius:1px}.sc-smoothly-input-radio-item-h>input.sc-smoothly-input-radio-item{opacity:0;z-index:1;width:1.5em;height:1.5em;position:absolute;transform:translateX(50%)}.sc-smoothly-input-radio-item-h>label.sc-smoothly-input-radio-item{padding:0 .3em;white-space:nowrap}";
10069
- const SmoothlyInputRadioItemStyle0 = styleCss$P;
10074
+ const styleCss$Q = ".sc-smoothly-input-radio-item-h{display:flex;align-items:center;position:relative}.sc-smoothly-input-radio-item-h:hover>*.sc-smoothly-input-radio-item{cursor:pointer}.sc-smoothly-input-radio-item-h>input.sc-smoothly-input-radio-item:focus-visible+smoothly-icon.sc-smoothly-input-radio-item{outline:2px solid rgb(var(--smoothly-primary-color));border-radius:1px}.sc-smoothly-input-radio-item-h>input.sc-smoothly-input-radio-item{opacity:0;z-index:1;width:1.5em;height:1.5em;position:absolute;transform:translateX(50%)}.sc-smoothly-input-radio-item-h>label.sc-smoothly-input-radio-item{padding:0 .3em;white-space:nowrap}";
10075
+ const SmoothlyInputRadioItemStyle0 = styleCss$Q;
10070
10076
 
10071
10077
  const SmoothlyInputRadioItem = class {
10072
10078
  constructor(hostRef) {
@@ -10086,14 +10092,14 @@ const SmoothlyInputRadioItem = class {
10086
10092
  this.smoothlySelect.emit({ value: this.value, selected: this.selected, select: s => (this.selected = s) });
10087
10093
  }
10088
10094
  render() {
10089
- return (index.h(index.Host, { key: '59774a1bdcf5ca1edc05b9d85c6f3ae697faddf3', onClick: () => this.inputHandler() }, index.h("input", { key: 'bcfd93d12645c0274d7d2fcd5b71c2d342edb30e', name: this.name, type: "radio", checked: this.selected }), index.h("smoothly-icon", { key: '2ec88c60554f1d133cb0ddcfb7d4e3c40ffbd4ae', name: this.selected ? "checkmark-circle" : "ellipse-outline", size: "small", fill: "outline", color: this.selected ? "success" : "medium", toolTip: "Select" }), index.h("label", { key: '8955cec7ff50907bf245b30cf06ab733238a894c' }, index.h("slot", { key: '4372df8cf4f1a6922a911e33e67187ba9d977091' }))));
10095
+ return (index.h(index.Host, { key: '7c48c949fdbce137b24f9a3e1ec6192be05ca97f', onClick: () => this.inputHandler() }, index.h("input", { key: '9877ecbfd2f4ac2f61b7d3d32c6a8c085e2203ee', name: this.name, type: "radio", checked: this.selected }), index.h("smoothly-icon", { key: 'ec4d5b9b68951216669a38391c36584c4335e22f', name: this.selected ? "checkmark-circle" : "ellipse-outline", size: "small", fill: "outline", color: this.selected ? "success" : "medium", toolTip: "Select" }), index.h("label", { key: '044b40a81e3c53fdac6a43e6265c22f60156249c' }, index.h("slot", { key: '9b325abcc530336647663c90484b403e6ab8d82b' }))));
10090
10096
  }
10091
10097
  get element() { return index.getElement(this); }
10092
10098
  };
10093
10099
  SmoothlyInputRadioItem.style = SmoothlyInputRadioItemStyle0;
10094
10100
 
10095
- const styleCss$O = ".sc-smoothly-input-range-h{--input-padding-side:.5rem;--input-value-padding-top:1.25rem;--input-value-padding-bottom:.25rem;--input-min-height:3rem;min-height:var(--input-min-height);box-sizing:border-box;border-radius:var(--smoothly-input-border-radius)}.sc-smoothly-input-range-h[looks=\"border\"].sc-smoothly-input-range-s>smoothly-picker-menu smoothly-input,[looks=\"border\"].sc-smoothly-input-range-h{border:rgb(var(--smoothly-input-border)) solid 1px}[looks=\"border\"][readonly].sc-smoothly-input-range-h{border:transparent solid 1px}.sc-smoothly-input-range-h[looks=\"line\"].sc-smoothly-input-range-s>smoothly-picker-menu smoothly-input,[looks=\"line\"].sc-smoothly-input-range-h{border-bottom:rgb(var(--smoothly-input-border)) solid 1px}[looks=\"line\"][readonly].sc-smoothly-input-range-h{border-bottom:transparent solid 1px}[looks=\"grid\"].sc-smoothly-input-range-h{flex-grow:1;flex-basis:40%;box-shadow:0px 0px 0px 1px rgb(var(--smoothly-input-border));border:none}[looks=\"grid\"][readonly].sc-smoothly-input-range-h{box-shadow:0px 0px 0px 1px rgba(var(--smoothly-input-border-readonly))}[looks=\"transparent\"].sc-smoothly-input-range-h{border:none}[looks=\"transparent\"][readonly].sc-smoothly-input-range-h,[looks=\"transparent\"].sc-smoothly-input-range-h:not(:focus-within){background-color:transparent}[looks=\"transparent\"][readonly].sc-smoothly-input-range-h>input.sc-smoothly-input-range,[looks=\"transparent\"].sc-smoothly-input-range-h:not(:focus-within)>input.sc-smoothly-input-range{background:transparent}[looks=\"transparent\"].sc-smoothly-input-range-h:not([readonly]):focus-within{outline:1px solid rgb(var(--smoothly-input-border))}.sc-smoothly-input-range-h.sc-smoothly-input-range-s>[slot=label],.sc-smoothly-input-range-h .sc-smoothly-input-range-s>[slot=label],.sc-smoothly-input-range-h .label.sc-smoothly-input-range{position:absolute;top:.6rem;opacity:0.8;user-select:none;cursor:inherit;transform-origin:top left;transition:transform 100ms ease}.sc-smoothly-input-range-h.floating-label.sc-smoothly-input-range-s>[slot=label],.sc-smoothly-input-range-h.floating-label .sc-smoothly-input-range-s>[slot=label],.sc-smoothly-input-range-h.has-value.sc-smoothly-input-range-s>[slot=label],.sc-smoothly-input-range-h.has-value .sc-smoothly-input-range-s>[slot=label],.sc-smoothly-input-range-h[placeholder].sc-smoothly-input-range-s>[slot=label],.sc-smoothly-input-range-h[placeholder] .sc-smoothly-input-range-s>[slot=label],.sc-smoothly-input-range-h[readonly].sc-smoothly-input-range-s>[slot=label],.sc-smoothly-input-range-h[readonly] .sc-smoothly-input-range-s>[slot=label],.has-value.sc-smoothly-input-range-h .label.sc-smoothly-input-range,[placeholder].sc-smoothly-input-range-h .label.sc-smoothly-input-range,[readonly].sc-smoothly-input-range-h .label.sc-smoothly-input-range,.sc-smoothly-input-range-h:not([readonly]):focus-within .label.float-on-focus.sc-smoothly-input-range{top:.2rem;transform:scale(0.8)}.sc-smoothly-input-range-h:not([show-label]):not(.show-label) .label.sc-smoothly-input-range{display:none}*.sc-smoothly-input-range{box-sizing:border-box}.sc-smoothly-input-range-h{position:relative;width:100%;justify-content:center;align-items:center;display:flex;background-color:rgb(var(--smoothly-input-background));padding-right:.5em;box-sizing:border-box}.sc-smoothly-input-range-h>div.sc-smoothly-input-range{position:relative;display:flex;justify-content:center;align-items:center;width:100%}.sc-smoothly-input-range-h>div.sc-smoothly-input-range>smoothly-input.sc-smoothly-input-range{width:12em;--input-min-height:calc(3rem - 2px)}.sc-smoothly-input-range-h>div.sc-smoothly-input-range>smoothly-input.sc-smoothly-input-range:focus{outline:none;border:none}.sc-smoothly-input-range-h>div.sc-smoothly-input-range>smoothly-input.sc-smoothly-input-range label.sc-smoothly-input-range{white-space:nowrap}.output-side-right.sc-smoothly-input-range-h>div.sc-smoothly-input-range{padding:0}.output-side-right.sc-smoothly-input-range-h>div.sc-smoothly-input-range>smoothly-input.sc-smoothly-input-range{text-align:center;margin-left:var(--input-padding-side);border:none;box-sizing:border-box;width:5em;order:3;margin:0}.output-side-right.sc-smoothly-input-range-h>div.sc-smoothly-input-range>smoothly-display.sc-smoothly-input-range,.sc-smoothly-input-range-h:not(.output-side-right)>div.sc-smoothly-input-range>label.sc-smoothly-input-range{display:none}.output-side-right.sc-smoothly-input-range-h>div.sc-smoothly-input-range>smoothly-input.sc-smoothly-input-range input.sc-smoothly-input-range{padding:0;text-align:center}.output-side-right.sc-smoothly-input-range-h>div.sc-smoothly-input-range>smoothly-input.sc-smoothly-input-range label.sc-smoothly-input-range{width:100%}.output-side-right.sc-smoothly-input-range-h>div.sc-smoothly-input-range>label.sc-smoothly-input-range{position:static;font-size:inherit;text-align:center;margin:0 var(--input-padding-side)}.sc-smoothly-input-range-h>div.sc-smoothly-input-range>input[type=range].sc-smoothly-input-range{-webkit-appearance:none;width:100%;background:transparent;height:1.5em;padding:0 .4em}.sc-smoothly-input-range-h>div.sc-smoothly-input-range>input[type=range].sc-smoothly-input-range::-webkit-slider-thumb{-webkit-appearance:none;height:0.8em;width:0.8em;border-radius:100%;background-color:rgb(var(--smoothly-primary-color));cursor:pointer;margin-top:-.25em;border:none}.sc-smoothly-input-range-h>div.sc-smoothly-input-range>input[type=range].sc-smoothly-input-range::-moz-range-thumb{height:0.8em;width:0.8em;border-radius:100%;background-color:rgb(var(--smoothly-primary-color));cursor:pointer;border:none}.sc-smoothly-input-range-h>div.sc-smoothly-input-range>input[type=range].sc-smoothly-input-range::-webkit-slider-runnable-track{height:.3em;cursor:pointer;background-color:rgb(var(--smoothly-primary-color));border-radius:20px}.sc-smoothly-input-range-h>div.sc-smoothly-input-range>input[type=range].sc-smoothly-input-range::-moz-range-track{width:100%;height:.3em;cursor:pointer;background-color:rgb(var(--smoothly-primary-color));border-radius:20px}.sc-smoothly-input-range-h:not([value])>div.sc-smoothly-input-range>input[type=range].sc-smoothly-input-range::-webkit-slider-runnable-track{background-color:rgb(var(--smoothly-primary-tint))}.sc-smoothly-input-range-h:not([value])>dov.sc-smoothly-input-range>input[type=range].sc-smoothly-input-range::-moz-range-track{background-color:rgb(var(--smoothly-primary-tint))}[readonly].sc-smoothly-input-range-h>div.sc-smoothly-input-range>input[type=range].sc-smoothly-input-range::-webkit-slider-thumb,[readonly].sc-smoothly-input-range-h>div.sc-smoothly-input-range>input[type=range].sc-smoothly-input-range::-moz-range-thumb,[readonly].sc-smoothly-input-range-h>div.sc-smoothly-input-range>input[type=range].sc-smoothly-input-range::-webkit-slider-runnable-track,[readonly].sc-smoothly-input-range-h>div.sc-smoothly-input-range>input[type=range].sc-smoothly-input-range::-moz-range-track,[readonly].sc-smoothly-input-range-h,[readonly].sc-smoothly-input-range-h *.sc-smoothly-input-range{cursor:not-allowed}input.sc-smoothly-input-range::-webkit-outer-spin-button,input.sc-smoothly-input-range::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}";
10096
- const SmoothlyInputRangeStyle0 = styleCss$O;
10101
+ const styleCss$P = ".sc-smoothly-input-range-h{--input-padding-side:.5rem;--input-value-padding-top:1.25rem;--input-value-padding-bottom:.25rem;--input-min-height:3rem;min-height:var(--input-min-height);box-sizing:border-box;border-radius:var(--smoothly-input-border-radius)}.sc-smoothly-input-range-h[looks=\"border\"].sc-smoothly-input-range-s>smoothly-picker-menu smoothly-input,[looks=\"border\"].sc-smoothly-input-range-h{border:rgb(var(--smoothly-input-border)) solid 1px}[looks=\"border\"][readonly].sc-smoothly-input-range-h{border:transparent solid 1px}.sc-smoothly-input-range-h[looks=\"line\"].sc-smoothly-input-range-s>smoothly-picker-menu smoothly-input,[looks=\"line\"].sc-smoothly-input-range-h{border-bottom:rgb(var(--smoothly-input-border)) solid 1px}[looks=\"line\"][readonly].sc-smoothly-input-range-h{border-bottom:transparent solid 1px}[looks=\"grid\"].sc-smoothly-input-range-h{flex-grow:1;flex-basis:40%;box-shadow:0px 0px 0px 1px rgb(var(--smoothly-input-border));border:none}[looks=\"grid\"][readonly].sc-smoothly-input-range-h{box-shadow:0px 0px 0px 1px rgba(var(--smoothly-input-border-readonly))}[looks=\"transparent\"].sc-smoothly-input-range-h{border:none}[looks=\"transparent\"][readonly].sc-smoothly-input-range-h,[looks=\"transparent\"].sc-smoothly-input-range-h:not(:focus-within){background-color:transparent}[looks=\"transparent\"][readonly].sc-smoothly-input-range-h>input.sc-smoothly-input-range,[looks=\"transparent\"].sc-smoothly-input-range-h:not(:focus-within)>input.sc-smoothly-input-range{background:transparent}[looks=\"transparent\"].sc-smoothly-input-range-h:not([readonly]):focus-within{outline:1px solid rgb(var(--smoothly-input-border))}.sc-smoothly-input-range-h.sc-smoothly-input-range-s>[slot=label],.sc-smoothly-input-range-h .sc-smoothly-input-range-s>[slot=label],.sc-smoothly-input-range-h .label.sc-smoothly-input-range{position:absolute;top:.6rem;opacity:0.8;user-select:none;cursor:inherit;transform-origin:top left;transition:transform 100ms ease}.sc-smoothly-input-range-h.floating-label.sc-smoothly-input-range-s>[slot=label],.sc-smoothly-input-range-h.floating-label .sc-smoothly-input-range-s>[slot=label],.sc-smoothly-input-range-h.has-value.sc-smoothly-input-range-s>[slot=label],.sc-smoothly-input-range-h.has-value .sc-smoothly-input-range-s>[slot=label],.sc-smoothly-input-range-h[placeholder].sc-smoothly-input-range-s>[slot=label],.sc-smoothly-input-range-h[placeholder] .sc-smoothly-input-range-s>[slot=label],.sc-smoothly-input-range-h[readonly].sc-smoothly-input-range-s>[slot=label],.sc-smoothly-input-range-h[readonly] .sc-smoothly-input-range-s>[slot=label],.has-value.sc-smoothly-input-range-h .label.sc-smoothly-input-range,[placeholder].sc-smoothly-input-range-h .label.sc-smoothly-input-range,[readonly].sc-smoothly-input-range-h .label.sc-smoothly-input-range,.sc-smoothly-input-range-h:not([readonly]):focus-within .label.float-on-focus.sc-smoothly-input-range{top:.2rem;transform:scale(0.8)}.sc-smoothly-input-range-h:not([show-label]):not(.show-label) .label.sc-smoothly-input-range{display:none}*.sc-smoothly-input-range{box-sizing:border-box}.sc-smoothly-input-range-h{position:relative;width:100%;justify-content:center;align-items:center;display:flex;background-color:rgb(var(--smoothly-input-background));padding-right:.5em;box-sizing:border-box}.sc-smoothly-input-range-h>div.sc-smoothly-input-range{position:relative;display:flex;justify-content:center;align-items:center;width:100%}.sc-smoothly-input-range-h>div.sc-smoothly-input-range>smoothly-input.sc-smoothly-input-range{width:12em;--input-min-height:calc(3rem - 2px)}.sc-smoothly-input-range-h>div.sc-smoothly-input-range>smoothly-input.sc-smoothly-input-range:focus{outline:none;border:none}.sc-smoothly-input-range-h>div.sc-smoothly-input-range>smoothly-input.sc-smoothly-input-range label.sc-smoothly-input-range{white-space:nowrap}.output-side-right.sc-smoothly-input-range-h>div.sc-smoothly-input-range{padding:0}.output-side-right.sc-smoothly-input-range-h>div.sc-smoothly-input-range>smoothly-input.sc-smoothly-input-range{text-align:center;margin-left:var(--input-padding-side);border:none;box-sizing:border-box;width:5em;order:3;margin:0}.output-side-right.sc-smoothly-input-range-h>div.sc-smoothly-input-range>smoothly-display.sc-smoothly-input-range,.sc-smoothly-input-range-h:not(.output-side-right)>div.sc-smoothly-input-range>label.sc-smoothly-input-range{display:none}.output-side-right.sc-smoothly-input-range-h>div.sc-smoothly-input-range>smoothly-input.sc-smoothly-input-range input.sc-smoothly-input-range{padding:0;text-align:center}.output-side-right.sc-smoothly-input-range-h>div.sc-smoothly-input-range>smoothly-input.sc-smoothly-input-range label.sc-smoothly-input-range{width:100%}.output-side-right.sc-smoothly-input-range-h>div.sc-smoothly-input-range>label.sc-smoothly-input-range{position:static;font-size:inherit;text-align:center;margin:0 var(--input-padding-side)}.sc-smoothly-input-range-h>div.sc-smoothly-input-range>input[type=range].sc-smoothly-input-range{-webkit-appearance:none;width:100%;background:transparent;height:1.5em;padding:0 .4em}.sc-smoothly-input-range-h>div.sc-smoothly-input-range>input[type=range].sc-smoothly-input-range::-webkit-slider-thumb{-webkit-appearance:none;height:0.8em;width:0.8em;border-radius:100%;background-color:rgb(var(--smoothly-primary-color));cursor:pointer;margin-top:-.25em;border:none}.sc-smoothly-input-range-h>div.sc-smoothly-input-range>input[type=range].sc-smoothly-input-range::-moz-range-thumb{height:0.8em;width:0.8em;border-radius:100%;background-color:rgb(var(--smoothly-primary-color));cursor:pointer;border:none}.sc-smoothly-input-range-h>div.sc-smoothly-input-range>input[type=range].sc-smoothly-input-range::-webkit-slider-runnable-track{height:.3em;cursor:pointer;background-color:rgb(var(--smoothly-primary-color));border-radius:20px}.sc-smoothly-input-range-h>div.sc-smoothly-input-range>input[type=range].sc-smoothly-input-range::-moz-range-track{width:100%;height:.3em;cursor:pointer;background-color:rgb(var(--smoothly-primary-color));border-radius:20px}.sc-smoothly-input-range-h:not([value])>div.sc-smoothly-input-range>input[type=range].sc-smoothly-input-range::-webkit-slider-runnable-track{background-color:rgb(var(--smoothly-primary-tint))}.sc-smoothly-input-range-h:not([value])>dov.sc-smoothly-input-range>input[type=range].sc-smoothly-input-range::-moz-range-track{background-color:rgb(var(--smoothly-primary-tint))}[readonly].sc-smoothly-input-range-h>div.sc-smoothly-input-range>input[type=range].sc-smoothly-input-range::-webkit-slider-thumb,[readonly].sc-smoothly-input-range-h>div.sc-smoothly-input-range>input[type=range].sc-smoothly-input-range::-moz-range-thumb,[readonly].sc-smoothly-input-range-h>div.sc-smoothly-input-range>input[type=range].sc-smoothly-input-range::-webkit-slider-runnable-track,[readonly].sc-smoothly-input-range-h>div.sc-smoothly-input-range>input[type=range].sc-smoothly-input-range::-moz-range-track,[readonly].sc-smoothly-input-range-h,[readonly].sc-smoothly-input-range-h *.sc-smoothly-input-range{cursor:not-allowed}input.sc-smoothly-input-range::-webkit-outer-spin-button,input.sc-smoothly-input-range::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}";
10102
+ const SmoothlyInputRangeStyle0 = styleCss$P;
10097
10103
 
10098
10104
  const SmoothlyInputRange = class {
10099
10105
  constructor(hostRef) {
@@ -10190,10 +10196,10 @@ const SmoothlyInputRange = class {
10190
10196
  }
10191
10197
  render() {
10192
10198
  var _a, _b, _c;
10193
- return (index.h(index.Host, { key: '8fb68210ebaf98f5da58cfdd6e515cf604d83395', class: {
10199
+ return (index.h(index.Host, { key: '217e854b0aaba05fc17bcb5836bec4476091b8e0', class: {
10194
10200
  "output-side-right": this.outputSide === "right",
10195
10201
  "show-label": this.outputSide === "left" && !!this.label,
10196
- } }, index.h("slot", { key: 'e3079cb69fc730453a7a98acf25433f89a815f2b', name: "start" }), index.h("div", { key: '079abafd6c931376a7f1f34849fde620b5f0108d' }, index.h("label", { key: 'c2f747411d5fbb355d48907a5ecbaec4cef6c1b5', htmlFor: this.name }, this.label), index.h("smoothly-input", { key: '010dbb5438d4f8ad3df91e8ab98ecd924b65dcd1', ref: e => (this.input = e), looks: undefined, color: this.color, showLabel: this.outputSide === "left" && !!this.label, type: this.type, onSmoothlyInputLoad: e => (e.stopPropagation(), this.inputHandler(e)), onSmoothlyBlur: e => this.inputHandler(e), onSmoothlyInput: e => e.stopPropagation(), value: this.type == "percent" ? this.value : (_a = this.value) === null || _a === void 0 ? void 0 : _a.toString(), placeholder: this.outputSide === "right" ? "-" : undefined, readonly: this.readonly }, this.label), index.h("smoothly-display", { key: 'd4943e82147cf352a69bdc0546438c737fc39040', label: (this.type == "percent" ? this.min * 100 : this.min).toString() }), index.h("input", { key: '02eb994933e5124475b1ddf17bbf3a1ad02f79a8', name: this.name, part: "range", type: "range", min: this.min, max: this.max, step: (_b = this.step) !== null && _b !== void 0 ? _b : "any", disabled: this.readonly, onInput: event => this.inputHandler(event), value: (_c = this.value) !== null && _c !== void 0 ? _c : this.min }), index.h("smoothly-display", { key: '43f8daf61048150a4503777df2a0e646d54ace76', label: (this.type == "percent" ? this.max * 100 : this.max).toString() })), index.h("slot", { key: '8a0e4c96747d3c3d4a3678dfe8375ec6d0a4f9cb', name: "end" })));
10202
+ } }, index.h("slot", { key: 'abcad7f036f41e5c8afd7a5ad1352d5edbaa6105', name: "start" }), index.h("div", { key: '3098b807e53e5aea94137616dc039c19e3ff42d5' }, index.h("label", { key: '63429452ac71f1cb2ca5b712521fae46d755fe15', htmlFor: this.name }, this.label), index.h("smoothly-input", { key: '3308b0d304f47e0daf57954b38dedf7140f4c366', ref: e => (this.input = e), looks: undefined, color: this.color, showLabel: this.outputSide === "left" && !!this.label, type: this.type, onSmoothlyInputLoad: e => (e.stopPropagation(), this.inputHandler(e)), onSmoothlyBlur: e => this.inputHandler(e), onSmoothlyInput: e => e.stopPropagation(), value: this.type == "percent" ? this.value : (_a = this.value) === null || _a === void 0 ? void 0 : _a.toString(), placeholder: this.outputSide === "right" ? "-" : undefined, readonly: this.readonly }, this.label), index.h("smoothly-display", { key: '3b6e02d138b33bb3e1b56323b809af2986adfc14', label: (this.type == "percent" ? this.min * 100 : this.min).toString() }), index.h("input", { key: '32ed12cfe8051885e52928e3824d82ed58217a0d', name: this.name, part: "range", type: "range", min: this.min, max: this.max, step: (_b = this.step) !== null && _b !== void 0 ? _b : "any", disabled: this.readonly, onInput: event => this.inputHandler(event), value: (_c = this.value) !== null && _c !== void 0 ? _c : this.min }), index.h("smoothly-display", { key: '715c9942ba15a7bf1d7275a8d892b6d9bf950362', label: (this.type == "percent" ? this.max * 100 : this.max).toString() })), index.h("slot", { key: '907dd4ed8bf117a9c6097602015cafe65f5113f8', name: "end" })));
10197
10203
  }
10198
10204
  get element() { return index.getElement(this); }
10199
10205
  static get watchers() { return {
@@ -10207,12 +10213,12 @@ const SmoothlyInputRangeDemo = class {
10207
10213
  index.registerInstance(this, hostRef);
10208
10214
  }
10209
10215
  render() {
10210
- return (index.h(index.Host, { key: 'e6c972c319124ccc57918d00ac2939ffcf801086' }, index.h("h2", { key: '2eee90cf795cb664ae58f8acc9c3ce7507d24d43' }, "Range"), index.h("h3", { key: '514e771706c0ef2966314210c521b77aae6303cd' }, "Phone Number"), index.h("smoothly-input-range", { key: 'ca56ef4990eaf1b2e7fdf538ff97e99e8dc95dbc', min: 700000000, max: 799999999, step: 1, label: "Phone Number" }), index.h("h3", { key: 'b2311c9a02a18f87e6007751e74d0f734c3065cb' }, "Stars out of ten"), index.h("smoothly-input-range", { key: '5943346ccc617732018765e3bee90983249af7ee', max: 10, step: 1, label: "Stars" }), index.h("h3", { key: '568036b413fb001fa391e4d17301c7de6cae0ae4' }, "Percent"), index.h("smoothly-input-range", { key: '8fb10ce5d6797d3902a5ef6daea24693aed6c8f0', type: "percent", max: 1, step: 0.01, label: "Percent" }), index.h("h3", { key: 'a559ab1a231c754648ab7b41f98e22a2be92822c' }, "With icon at start and clear button"), index.h("smoothly-input-range", { key: '7f9e20c399d74ead7e045e9bf667960caf79d5b5', step: 1, name: "range2", label: "Select" }, index.h("smoothly-icon", { key: '4160644ddaccebae7e635c685f77af1f8f67fbef', name: "checkmark-circle", slot: "start" }), index.h("smoothly-input-clear", { key: '39d01ea1fafbeaceb339154e8d356b7fb02c5e5a', size: "icon", slot: "end" }))));
10216
+ return (index.h(index.Host, { key: '66bd4b62cb51f2f5cc68921bcb3baf360abe9f4a' }, index.h("h2", { key: 'b413570feb6f48e1bec5fa86f9cec85fe77f4c36' }, "Range"), index.h("h3", { key: 'b939256cc23178592e830d301185b30ebbe96a9e' }, "Phone Number"), index.h("smoothly-input-range", { key: '4f57681060c1759ab127b638ab839e9c85315580', min: 700000000, max: 799999999, step: 1, label: "Phone Number" }), index.h("h3", { key: '2a1f6ae29389117ab738e700cb0ac36dcbd02d21' }, "Stars out of ten"), index.h("smoothly-input-range", { key: '3124b06f533a733220710e10862ff36db2db88a7', max: 10, step: 1, label: "Stars" }), index.h("h3", { key: '1c28dc9e3385b1fdbfa9dd7fc27b387b7db87c86' }, "Percent"), index.h("smoothly-input-range", { key: '8606937ac9f195a76bcdcc97cfd32c49a7438663', type: "percent", max: 1, step: 0.01, label: "Percent" }), index.h("h3", { key: 'e33e94cbdedf240d9f32ad3b61c00d0d2ae7de5d' }, "With icon at start and clear button"), index.h("smoothly-input-range", { key: 'e81e920156dedf852d1450ae3fbdaa8f3747b5e9', step: 1, name: "range2", label: "Select" }, index.h("smoothly-icon", { key: '766f06b5182fbfe0e1e5bf3d87bb9a3caaad9588', name: "checkmark-circle", slot: "start" }), index.h("smoothly-input-clear", { key: '7f43e976c428e47ae228433ce2fedffe21128bff', size: "icon", slot: "end" }))));
10211
10217
  }
10212
10218
  };
10213
10219
 
10214
- const styleCss$N = "[color=default].sc-smoothly-input-reset{--smoothly-color:var(--smoothly-default-color);--smoothly-color-contrast:var(--smoothly-default-contrast);--smoothly-color-shade:var(--smoothly-default-shade);--smoothly-color-tint:var(--smoothly-default-tint)}[color=primary].sc-smoothly-input-reset{--smoothly-color:var(--smoothly-primary-color);--smoothly-color-contrast:var(--smoothly-primary-contrast);--smoothly-color-shade:var(--smoothly-primary-shade);--smoothly-color-tint:var(--smoothly-primary-tint)}[color=secondary].sc-smoothly-input-reset{--smoothly-color:var(--smoothly-secondary-color);--smoothly-color-contrast:var(--smoothly-secondary-contrast);--smoothly-color-shade:var(--smoothly-secondary-shade);--smoothly-color-tint:var(--smoothly-secondary-tint)}[color=tertiary].sc-smoothly-input-reset{--smoothly-color:var(--smoothly-tertiary-color);--smoothly-color-contrast:var(--smoothly-tertiary-contrast);--smoothly-color-shade:var(--smoothly-tertiary-shade);--smoothly-color-tint:var(--smoothly-tertiary-tint)}[color=success].sc-smoothly-input-reset{--smoothly-color:var(--smoothly-success-color);--smoothly-color-contrast:var(--smoothly-success-contrast);--smoothly-color-shade:var(--smoothly-success-shade);--smoothly-color-tint:var(--smoothly-success-tint)}[color=warning].sc-smoothly-input-reset{--smoothly-color:var(--smoothly-warning-color);--smoothly-color-contrast:var(--smoothly-warning-contrast);--smoothly-color-shade:var(--smoothly-warning-shade);--smoothly-color-tint:var(--smoothly-warning-tint)}[color=danger].sc-smoothly-input-reset{--smoothly-color:var(--smoothly-danger-color);--smoothly-color-contrast:var(--smoothly-danger-contrast);--smoothly-color-shade:var(--smoothly-danger-shade);--smoothly-color-tint:var(--smoothly-danger-tint)}[color=light].sc-smoothly-input-reset{--smoothly-color:var(--smoothly-light-color);--smoothly-color-contrast:var(--smoothly-light-contrast);--smoothly-color-shade:var(--smoothly-light-shade);--smoothly-color-tint:var(--smoothly-light-tint)}[color=medium].sc-smoothly-input-reset{--smoothly-color:var(--smoothly-medium-color);--smoothly-color-contrast:var(--smoothly-medium-contrast);--smoothly-color-shade:var(--smoothly-medium-shade);--smoothly-color-tint:var(--smoothly-medium-tint)}[color=dark].sc-smoothly-input-reset{--smoothly-color:var(--smoothly-dark-color);--smoothly-color-contrast:var(--smoothly-dark-contrast);--smoothly-color-shade:var(--smoothly-dark-shade);--smoothly-color-tint:var(--smoothly-dark-tint)}.sc-smoothly-input-reset-h{--smoothly-button-border-radius:0.5rem;display:inline-block;box-sizing:border-box;border-radius:var(--smoothly-button-border-radius);cursor:pointer;border:none;outline:none;position:relative}[shape=rounded].sc-smoothly-input-reset-h{--smoothly-button-border-radius:2rem}[type=link].sc-smoothly-input-reset-h{display:inline}[disabled].sc-smoothly-input-reset-h{opacity:0.5;pointer-events:none}.sc-smoothly-input-reset-h>a.sc-smoothly-input-reset,.sc-smoothly-input-reset-h>button.sc-smoothly-input-reset{font-size:110%;font-weight:400;border:1px solid transparent;outline:none;background-color:transparent;cursor:pointer;display:inline-flex;gap:0.5rem;box-sizing:border-box}.sc-smoothly-input-reset-h>a.sc-smoothly-input-reset:empty,.sc-smoothly-input-reset-h>button.sc-smoothly-input-reset:empty{border-width:0}.sc-smoothly-input-reset-h>button.sc-smoothly-input-reset{font-weight:bold;justify-content:center;height:100%;width:100%;border-radius:var(--smoothly-button-border-radius);align-items:center}.sc-smoothly-input-reset-h:not([size=icon]):not([size=flexible])>button.sc-smoothly-input-reset{padding:0.8em;min-width:8em}.sc-smoothly-input-reset-h:not([size=icon]):not([size=flexible]):has(smoothly-icon)>button.sc-smoothly-input-reset{padding:0.6em}[size=icon].sc-smoothly-input-reset-h>button.sc-smoothly-input-reset{padding:0.5em}[type=button].sc-smoothly-input-reset-h>a.sc-smoothly-input-reset{text-align:center;text-decoration:inherit;width:calc(100% - 0.6em)}[size=small].sc-smoothly-input-reset-h>button.sc-smoothly-input-reset{font-size:100%}[size=large].sc-smoothly-input-reset-h>button.sc-smoothly-input-reset{font-size:130%}.sc-smoothly-input-reset-h:not([size=icon]){min-width:8em}[size=flexible].sc-smoothly-input-reset-h{min-width:unset;padding:0;margin:0;display:flex;justify-content:center;align-items:center}[size=flexible].sc-smoothly-input-reset-h>button.sc-smoothly-input-reset{min-width:unset;padding:0;margin:0}[expand].sc-smoothly-input-reset-h{width:100%}[expand=full].sc-smoothly-input-reset-h{border-left:none;border-right:none;--smoothly-button-border-radius:0}[fill=outline].sc-smoothly-input-reset-h>button.sc-smoothly-input-reset{background-color:transparent;color:rgb(var(--smoothly-button-foreground));fill:rgb(var(--smoothly-button-foreground));stroke:rgb(var(--smoothly-button-foreground));border-color:rgb(var(--smoothly-button-foreground))}.sc-smoothly-input-reset-h:not([fill=clear])>button.sc-smoothly-input-reset:hover,.sc-smoothly-input-reset-h>button.sc-smoothly-input-reset:focus-visible,[fill=outline].sc-smoothly-input-reset-h:active>button.sc-smoothly-input-reset::before{border-color:rgb(var(--smoothly-button-focus-color))}[fill=outline].sc-smoothly-input-reset-h>button.sc-smoothly-input-reset:hover::before,[fill=outline].sc-smoothly-input-reset-h>button.sc-smoothly-input-reset:focus-within::before,[fill=outline].sc-smoothly-input-reset-h>button.sc-smoothly-input-reset:active::before{content:\"\";position:absolute;border:2px solid rgb(var(--smoothly-button-focus-border));inset:-1px;border-radius:var(--smoothly-button-border-radius)}.sc-smoothly-input-reset-h:not([fill=clear]):not([fill=outline])>button.sc-smoothly-input-reset:hover,.sc-smoothly-input-reset-h:not([fill=clear]):not([fill=outline])>button.sc-smoothly-input-reset:focus-visible,.sc-smoothly-input-reset-h:not([fill=clear]):not([fill=outline])>button.sc-smoothly-input-reset:active{background:rgb(var(--smoothly-button-hover-background))}.sc-smoothly-input-reset-h>button.sc-smoothly-input-reset,.sc-smoothly-input-reset-h.sc-smoothly-input-reset-s>smoothly-icon,.sc-smoothly-input-reset-h .sc-smoothly-input-reset-s>smoothly-icon{color:rgb(var(--smoothly-button-foreground));stroke:rgb(var(--smoothly-button-foreground));fill:rgb(var(--smoothly-button-foreground))}[hidden].sc-smoothly-input-reset-h{display:none}.sc-smoothly-input-reset-h:not([display]){display:none}.sc-smoothly-input-reset-h[type=\"input\"].sc-smoothly-input-reset-s>smoothly-button>button{cursor:pointer;filter:opacity(60%);--smoothly-button-foreground:var(--smoothly-input-foreground);background-color:transparent}.sc-smoothly-input-reset-h.sc-smoothly-input-reset-s>smoothly-button>button>*+smoothly-icon{display:none}[disabled].sc-smoothly-input-reset-h{cursor:not-allowed}.sc-smoothly-input-reset-h[type=\"input\"]:hover.sc-smoothly-input-reset-s>smoothly-icon,.sc-smoothly-input-reset-h[type=\"input\"]:hover .sc-smoothly-input-reset-s>smoothly-icon{cursor:pointer;filter:opacity(100%)}";
10215
- const SmoothlyInputResetStyle0 = styleCss$N;
10220
+ const styleCss$O = "[color=default].sc-smoothly-input-reset{--smoothly-color:var(--smoothly-default-color);--smoothly-color-contrast:var(--smoothly-default-contrast);--smoothly-color-shade:var(--smoothly-default-shade);--smoothly-color-tint:var(--smoothly-default-tint)}[color=primary].sc-smoothly-input-reset{--smoothly-color:var(--smoothly-primary-color);--smoothly-color-contrast:var(--smoothly-primary-contrast);--smoothly-color-shade:var(--smoothly-primary-shade);--smoothly-color-tint:var(--smoothly-primary-tint)}[color=secondary].sc-smoothly-input-reset{--smoothly-color:var(--smoothly-secondary-color);--smoothly-color-contrast:var(--smoothly-secondary-contrast);--smoothly-color-shade:var(--smoothly-secondary-shade);--smoothly-color-tint:var(--smoothly-secondary-tint)}[color=tertiary].sc-smoothly-input-reset{--smoothly-color:var(--smoothly-tertiary-color);--smoothly-color-contrast:var(--smoothly-tertiary-contrast);--smoothly-color-shade:var(--smoothly-tertiary-shade);--smoothly-color-tint:var(--smoothly-tertiary-tint)}[color=success].sc-smoothly-input-reset{--smoothly-color:var(--smoothly-success-color);--smoothly-color-contrast:var(--smoothly-success-contrast);--smoothly-color-shade:var(--smoothly-success-shade);--smoothly-color-tint:var(--smoothly-success-tint)}[color=warning].sc-smoothly-input-reset{--smoothly-color:var(--smoothly-warning-color);--smoothly-color-contrast:var(--smoothly-warning-contrast);--smoothly-color-shade:var(--smoothly-warning-shade);--smoothly-color-tint:var(--smoothly-warning-tint)}[color=danger].sc-smoothly-input-reset{--smoothly-color:var(--smoothly-danger-color);--smoothly-color-contrast:var(--smoothly-danger-contrast);--smoothly-color-shade:var(--smoothly-danger-shade);--smoothly-color-tint:var(--smoothly-danger-tint)}[color=light].sc-smoothly-input-reset{--smoothly-color:var(--smoothly-light-color);--smoothly-color-contrast:var(--smoothly-light-contrast);--smoothly-color-shade:var(--smoothly-light-shade);--smoothly-color-tint:var(--smoothly-light-tint)}[color=medium].sc-smoothly-input-reset{--smoothly-color:var(--smoothly-medium-color);--smoothly-color-contrast:var(--smoothly-medium-contrast);--smoothly-color-shade:var(--smoothly-medium-shade);--smoothly-color-tint:var(--smoothly-medium-tint)}[color=dark].sc-smoothly-input-reset{--smoothly-color:var(--smoothly-dark-color);--smoothly-color-contrast:var(--smoothly-dark-contrast);--smoothly-color-shade:var(--smoothly-dark-shade);--smoothly-color-tint:var(--smoothly-dark-tint)}.sc-smoothly-input-reset-h{--smoothly-button-border-radius:0.5rem;display:inline-block;box-sizing:border-box;border-radius:var(--smoothly-button-border-radius);cursor:pointer;border:none;outline:none;position:relative}[shape=rounded].sc-smoothly-input-reset-h{--smoothly-button-border-radius:2rem}[type=link].sc-smoothly-input-reset-h{display:inline}[disabled].sc-smoothly-input-reset-h{opacity:0.5;pointer-events:none}.sc-smoothly-input-reset-h>a.sc-smoothly-input-reset,.sc-smoothly-input-reset-h>button.sc-smoothly-input-reset{font-size:110%;font-weight:400;border:1px solid transparent;outline:none;background-color:transparent;cursor:pointer;display:inline-flex;gap:0.5rem;box-sizing:border-box}.sc-smoothly-input-reset-h>a.sc-smoothly-input-reset:empty,.sc-smoothly-input-reset-h>button.sc-smoothly-input-reset:empty{border-width:0}.sc-smoothly-input-reset-h>button.sc-smoothly-input-reset{font-weight:bold;justify-content:center;height:100%;width:100%;border-radius:var(--smoothly-button-border-radius);align-items:center}.sc-smoothly-input-reset-h:not([size=icon]):not([size=flexible])>button.sc-smoothly-input-reset{padding:0.8em;min-width:8em}.sc-smoothly-input-reset-h:not([size=icon]):not([size=flexible]):has(smoothly-icon)>button.sc-smoothly-input-reset{padding:0.6em}[size=icon].sc-smoothly-input-reset-h>button.sc-smoothly-input-reset{padding:0.5em}[type=button].sc-smoothly-input-reset-h>a.sc-smoothly-input-reset{text-align:center;text-decoration:inherit;width:calc(100% - 0.6em)}[size=small].sc-smoothly-input-reset-h>button.sc-smoothly-input-reset{font-size:100%}[size=large].sc-smoothly-input-reset-h>button.sc-smoothly-input-reset{font-size:130%}.sc-smoothly-input-reset-h:not([size=icon]){min-width:8em}[size=flexible].sc-smoothly-input-reset-h{min-width:unset;padding:0;margin:0;display:flex;justify-content:center;align-items:center}[size=flexible].sc-smoothly-input-reset-h>button.sc-smoothly-input-reset{min-width:unset;padding:0;margin:0}[expand].sc-smoothly-input-reset-h{width:100%}[expand=full].sc-smoothly-input-reset-h{border-left:none;border-right:none;--smoothly-button-border-radius:0}[fill=outline].sc-smoothly-input-reset-h>button.sc-smoothly-input-reset{background-color:transparent;color:rgb(var(--smoothly-button-foreground));fill:rgb(var(--smoothly-button-foreground));stroke:rgb(var(--smoothly-button-foreground));border-color:rgb(var(--smoothly-button-foreground))}.sc-smoothly-input-reset-h:not([fill=clear])>button.sc-smoothly-input-reset:hover,.sc-smoothly-input-reset-h>button.sc-smoothly-input-reset:focus-visible,[fill=outline].sc-smoothly-input-reset-h:active>button.sc-smoothly-input-reset::before{border-color:rgb(var(--smoothly-button-focus-color))}[fill=outline].sc-smoothly-input-reset-h>button.sc-smoothly-input-reset:hover::before,[fill=outline].sc-smoothly-input-reset-h>button.sc-smoothly-input-reset:focus-within::before,[fill=outline].sc-smoothly-input-reset-h>button.sc-smoothly-input-reset:active::before{content:\"\";position:absolute;border:2px solid rgb(var(--smoothly-button-focus-border));inset:-1px;border-radius:var(--smoothly-button-border-radius)}.sc-smoothly-input-reset-h:not([fill=clear]):not([fill=outline])>button.sc-smoothly-input-reset:hover,.sc-smoothly-input-reset-h:not([fill=clear]):not([fill=outline])>button.sc-smoothly-input-reset:focus-visible,.sc-smoothly-input-reset-h:not([fill=clear]):not([fill=outline])>button.sc-smoothly-input-reset:active{background:rgb(var(--smoothly-button-hover-background))}.sc-smoothly-input-reset-h>button.sc-smoothly-input-reset,.sc-smoothly-input-reset-h.sc-smoothly-input-reset-s>smoothly-icon,.sc-smoothly-input-reset-h .sc-smoothly-input-reset-s>smoothly-icon{color:rgb(var(--smoothly-button-foreground));stroke:rgb(var(--smoothly-button-foreground));fill:rgb(var(--smoothly-button-foreground))}[hidden].sc-smoothly-input-reset-h{display:none}.sc-smoothly-input-reset-h:not([display]){display:none}.sc-smoothly-input-reset-h[type=\"input\"].sc-smoothly-input-reset-s>smoothly-button>button{cursor:pointer;filter:opacity(60%);--smoothly-button-foreground:var(--smoothly-input-foreground);background-color:transparent}.sc-smoothly-input-reset-h.sc-smoothly-input-reset-s>smoothly-button>button>*+smoothly-icon{display:none}[disabled].sc-smoothly-input-reset-h{cursor:not-allowed}.sc-smoothly-input-reset-h[type=\"input\"]:hover.sc-smoothly-input-reset-s>smoothly-icon,.sc-smoothly-input-reset-h[type=\"input\"]:hover .sc-smoothly-input-reset-s>smoothly-icon{cursor:pointer;filter:opacity(100%)}";
10221
+ const SmoothlyInputResetStyle0 = styleCss$O;
10216
10222
 
10217
10223
  const SmoothlyInputReset = class {
10218
10224
  constructor(hostRef) {
@@ -10253,7 +10259,7 @@ const SmoothlyInputReset = class {
10253
10259
  }
10254
10260
  render() {
10255
10261
  var _a;
10256
- return (index.h(index.Host, { key: '84d146336bbff590ee3975dae9a2680d70d8edb7', title: this.tooltip }, index.h("smoothly-button", { key: '0286108fc4e8b36381d1ae238b771121153a3eaa', disabled: this.disabled, size: this.size, type: "button", shape: this.shape, expand: this.expand, color: this.color, fill: (_a = this.fill) !== null && _a !== void 0 ? _a : (this.type == "input" ? "clear" : undefined), onClick: event => this.clickHandler(event) }, index.h("slot", { key: 'c188073bf34013cc79126f1dac5fd19c1bc44884' }), index.h("smoothly-icon", { key: 'ca46c711d2d41a0f4ad835c608c5011d1f5a8e03', flip: "x", name: "refresh-outline", size: "tiny" }))));
10262
+ return (index.h(index.Host, { key: '7e244bbb6694869845c2cfc5904f25d1998f0147', title: this.tooltip }, index.h("smoothly-button", { key: 'a76ceacb18572fd7c5b43bc9cdcb7a174c39645d', disabled: this.disabled, size: this.size, type: "button", shape: this.shape, expand: this.expand, color: this.color, fill: (_a = this.fill) !== null && _a !== void 0 ? _a : (this.type == "input" ? "clear" : undefined), onClick: event => this.clickHandler(event) }, index.h("slot", { key: 'a7686c6a178443f3d2be496bafbb67d7f317fa63' }), index.h("smoothly-icon", { key: '020db640096a5e1b4dbac7ca85deb428c3da8a46', flip: "x", name: "refresh-outline", size: "tiny" }))));
10257
10263
  }
10258
10264
  };
10259
10265
  SmoothlyInputReset.style = SmoothlyInputResetStyle0;
@@ -10274,8 +10280,8 @@ var Item;
10274
10280
  Item.is = Item.type.is;
10275
10281
  })(Item || (Item = {}));
10276
10282
 
10277
- const styleCss$M = ".sc-smoothly-input-select-h{--input-padding-side:.5rem;--input-value-padding-top:1.25rem;--input-value-padding-bottom:.25rem;--input-min-height:3rem;min-height:var(--input-min-height);box-sizing:border-box;border-radius:var(--smoothly-input-border-radius)}.sc-smoothly-input-select-h[looks=\"border\"].sc-smoothly-input-select-s>smoothly-picker-menu smoothly-input,[looks=\"border\"].sc-smoothly-input-select-h{border:rgb(var(--smoothly-input-border)) solid 1px}[looks=\"border\"][readonly].sc-smoothly-input-select-h{border:transparent solid 1px}.sc-smoothly-input-select-h[looks=\"line\"].sc-smoothly-input-select-s>smoothly-picker-menu smoothly-input,[looks=\"line\"].sc-smoothly-input-select-h{border-bottom:rgb(var(--smoothly-input-border)) solid 1px}[looks=\"line\"][readonly].sc-smoothly-input-select-h{border-bottom:transparent solid 1px}[looks=\"grid\"].sc-smoothly-input-select-h{flex-grow:1;flex-basis:40%;box-shadow:0px 0px 0px 1px rgb(var(--smoothly-input-border));border:none}[looks=\"grid\"][readonly].sc-smoothly-input-select-h{box-shadow:0px 0px 0px 1px rgba(var(--smoothly-input-border-readonly))}[looks=\"transparent\"].sc-smoothly-input-select-h{border:none}[looks=\"transparent\"][readonly].sc-smoothly-input-select-h,[looks=\"transparent\"].sc-smoothly-input-select-h:not(:focus-within){background-color:transparent}[looks=\"transparent\"][readonly].sc-smoothly-input-select-h>input.sc-smoothly-input-select,[looks=\"transparent\"].sc-smoothly-input-select-h:not(:focus-within)>input.sc-smoothly-input-select{background:transparent}[looks=\"transparent\"].sc-smoothly-input-select-h:not([readonly]):focus-within{outline:1px solid rgb(var(--smoothly-input-border))}.sc-smoothly-input-select-h.sc-smoothly-input-select-s>[slot=label],.sc-smoothly-input-select-h .sc-smoothly-input-select-s>[slot=label],.sc-smoothly-input-select-h .label.sc-smoothly-input-select{position:absolute;top:.6rem;opacity:0.8;user-select:none;cursor:inherit;transform-origin:top left;transition:transform 100ms ease}.sc-smoothly-input-select-h.floating-label.sc-smoothly-input-select-s>[slot=label],.sc-smoothly-input-select-h.floating-label .sc-smoothly-input-select-s>[slot=label],.sc-smoothly-input-select-h.has-value.sc-smoothly-input-select-s>[slot=label],.sc-smoothly-input-select-h.has-value .sc-smoothly-input-select-s>[slot=label],.sc-smoothly-input-select-h[placeholder].sc-smoothly-input-select-s>[slot=label],.sc-smoothly-input-select-h[placeholder] .sc-smoothly-input-select-s>[slot=label],.sc-smoothly-input-select-h[readonly].sc-smoothly-input-select-s>[slot=label],.sc-smoothly-input-select-h[readonly] .sc-smoothly-input-select-s>[slot=label],.has-value.sc-smoothly-input-select-h .label.sc-smoothly-input-select,[placeholder].sc-smoothly-input-select-h .label.sc-smoothly-input-select,[readonly].sc-smoothly-input-select-h .label.sc-smoothly-input-select,.sc-smoothly-input-select-h:not([readonly]):focus-within .label.float-on-focus.sc-smoothly-input-select{top:.2rem;transform:scale(0.8)}.sc-smoothly-input-select-h:not([show-label]):not(.show-label) .label.sc-smoothly-input-select{display:none}.sc-smoothly-input-select-h{display:flex;justify-content:space-between;flex-direction:row;position:relative;background-color:rgb(var(--smoothly-input-background));color:rgb(var(--smoothly-input-foreground));fill:rgb(var(--smoothly-input-foreground));stroke:rgb(var(--smoothly-input-foreground));padding:0 var(--input-padding-side)}.open.sc-smoothly-input-select-h{border-radius:var(--smoothly-input-border-radius) var(--smoothly-input-border-radius) 0 0}.icon.sc-smoothly-input-select-h{width:fit-content;flex-direction:column}.sc-smoothly-input-select-h>div.select-display.sc-smoothly-input-select{box-sizing:border-box;display:flex;cursor:pointer;padding:var(--input-value-padding-top) 0 var(--input-value-padding-bottom) 0;overflow:hidden;width:100%;white-space:nowrap;gap:1rem;text-overflow:ellipsis}.sc-smoothly-input-select-h:not(:has([slot=label]))>div.select-display.sc-smoothly-input-select,.sc-smoothly-input-select-h:not([show-label])>div.select-display.sc-smoothly-input-select{padding:.6em 0;align-items:center}[readonly].sc-smoothly-input-select-h>div.select-display.sc-smoothly-input-select{cursor:not-allowed}.sc-smoothly-input-select-h>div.select-display.sc-smoothly-input-select smoothly-icon.sc-smoothly-input-select{color:rgb(var(--smoothly-input-foreground));fill:rgb(var(--smoothly-input-foreground));stroke:rgb(var(--smoothly-input-foreground))}.sc-smoothly-input-select-h>div.icons.sc-smoothly-input-select{display:flex;flex-direction:row;align-items:center;margin-right:.2em}.sc-smoothly-input-select-h>div.icons.sc-smoothly-input-select-s>smoothly-icon:not(\"color\"){color:rgb(var(--smoothly-input-foreground));fill:rgb(var(--smoothly-input-foreground));stroke:rgb(var(--smoothly-input-foreground));filter:opacity(60%)}.sc-smoothly-input-select-h:hover>div.icons.sc-smoothly-input-select-s>smoothly-icon{filter:opacity(100%)}smoothly-icon[name=caret-down-outline].sc-smoothly-input-select,smoothly-icon[name=caret-forward-outline].sc-smoothly-input-select{opacity:.7}.invalid.sc-smoothly-input-select-h>div.sc-smoothly-input-select>smoothly-icon.invalid.sc-smoothly-input-select{display:block}.sc-smoothly-input-select-h>div.sc-smoothly-input-select>smoothly-icon.invalid.sc-smoothly-input-select{display:none}.sc-smoothly-input-select-h>div.icons.sc-smoothly-input-select-s>smoothly-input-reset{padding-right:.2em}.sc-smoothly-input-select-h .label.sc-smoothly-input-select{left:.5rem}.has-value.sc-smoothly-input-select-h:has([slot=label]:not(:empty))>div.select-display.sc-smoothly-input-select,.sc-smoothly-input-select-h:not(.has-value)[placeholder]>div.select-display.sc-smoothly-input-select{overflow:hidden;width:100%}.sc-smoothly-input-select-h>.options.sc-smoothly-input-select{display:flex;flex-direction:column;position:absolute;top:var(--element-height);z-index:10;max-height:var(--menu-height, unset);overflow-x:hidden;overflow-y:auto;background-color:rgb(var(--smoothly-input-background));left:0;right:0;border-radius:0 0 var(--smoothly-input-border-radius) var(--smoothly-input-border-radius);min-width:fit-content;border:rgb(var(--smoothly-input-border, var(--smoothly-color-contrast))) solid 1px;border-top:rgba(var(--smoothly-input-border, var(--smoothly-color-contrast)), .4) solid 1px}[looks=\"grid\"].sc-smoothly-input-select-h>div.options.sc-smoothly-input-select,[looks=border].sc-smoothly-input-select-h>div.options.sc-smoothly-input-select,[looks=\"transparent\"].sc-smoothly-input-select-h>div.options.sc-smoothly-input-select{left:-1px;right:-1px}.sc-smoothly-input-select-h>div.options.sc-smoothly-input-select-s>smoothly-item{padding:.7em .7em .7em .25em}.sc-smoothly-input-select-h>div.options.sc-smoothly-input-select-s>smoothly-item:not([selectable]){display:flex;gap:1em;background-color:rgba(var(--smoothly-primary-tint), .5);color:var(--smoothly-color-contrast)}.sc-smoothly-input-select-h>div.options.sc-smoothly-input-select>smoothly-item.sc-smoothly-input-select:not([selectable])>smoothly-icon[name=\"backspace-outline\"].sc-smoothly-input-select{margin-left:auto;margin-right:0}.sc-smoothly-input-select-h>div.options.hidden.sc-smoothly-input-select{display:none}.invalid.sc-smoothly-input-select-h>div.sc-smoothly-input-select>smoothly-icon.sc-smoothly-input-select{display:block}";
10278
- const SmoothlyInputSelectStyle0 = styleCss$M;
10283
+ const styleCss$N = ".sc-smoothly-input-select-h{--input-padding-side:.5rem;--input-value-padding-top:1.25rem;--input-value-padding-bottom:.25rem;--input-min-height:3rem;min-height:var(--input-min-height);box-sizing:border-box;border-radius:var(--smoothly-input-border-radius)}.sc-smoothly-input-select-h[looks=\"border\"].sc-smoothly-input-select-s>smoothly-picker-menu smoothly-input,[looks=\"border\"].sc-smoothly-input-select-h{border:rgb(var(--smoothly-input-border)) solid 1px}[looks=\"border\"][readonly].sc-smoothly-input-select-h{border:transparent solid 1px}.sc-smoothly-input-select-h[looks=\"line\"].sc-smoothly-input-select-s>smoothly-picker-menu smoothly-input,[looks=\"line\"].sc-smoothly-input-select-h{border-bottom:rgb(var(--smoothly-input-border)) solid 1px}[looks=\"line\"][readonly].sc-smoothly-input-select-h{border-bottom:transparent solid 1px}[looks=\"grid\"].sc-smoothly-input-select-h{flex-grow:1;flex-basis:40%;box-shadow:0px 0px 0px 1px rgb(var(--smoothly-input-border));border:none}[looks=\"grid\"][readonly].sc-smoothly-input-select-h{box-shadow:0px 0px 0px 1px rgba(var(--smoothly-input-border-readonly))}[looks=\"transparent\"].sc-smoothly-input-select-h{border:none}[looks=\"transparent\"][readonly].sc-smoothly-input-select-h,[looks=\"transparent\"].sc-smoothly-input-select-h:not(:focus-within){background-color:transparent}[looks=\"transparent\"][readonly].sc-smoothly-input-select-h>input.sc-smoothly-input-select,[looks=\"transparent\"].sc-smoothly-input-select-h:not(:focus-within)>input.sc-smoothly-input-select{background:transparent}[looks=\"transparent\"].sc-smoothly-input-select-h:not([readonly]):focus-within{outline:1px solid rgb(var(--smoothly-input-border))}.sc-smoothly-input-select-h.sc-smoothly-input-select-s>[slot=label],.sc-smoothly-input-select-h .sc-smoothly-input-select-s>[slot=label],.sc-smoothly-input-select-h .label.sc-smoothly-input-select{position:absolute;top:.6rem;opacity:0.8;user-select:none;cursor:inherit;transform-origin:top left;transition:transform 100ms ease}.sc-smoothly-input-select-h.floating-label.sc-smoothly-input-select-s>[slot=label],.sc-smoothly-input-select-h.floating-label .sc-smoothly-input-select-s>[slot=label],.sc-smoothly-input-select-h.has-value.sc-smoothly-input-select-s>[slot=label],.sc-smoothly-input-select-h.has-value .sc-smoothly-input-select-s>[slot=label],.sc-smoothly-input-select-h[placeholder].sc-smoothly-input-select-s>[slot=label],.sc-smoothly-input-select-h[placeholder] .sc-smoothly-input-select-s>[slot=label],.sc-smoothly-input-select-h[readonly].sc-smoothly-input-select-s>[slot=label],.sc-smoothly-input-select-h[readonly] .sc-smoothly-input-select-s>[slot=label],.has-value.sc-smoothly-input-select-h .label.sc-smoothly-input-select,[placeholder].sc-smoothly-input-select-h .label.sc-smoothly-input-select,[readonly].sc-smoothly-input-select-h .label.sc-smoothly-input-select,.sc-smoothly-input-select-h:not([readonly]):focus-within .label.float-on-focus.sc-smoothly-input-select{top:.2rem;transform:scale(0.8)}.sc-smoothly-input-select-h:not([show-label]):not(.show-label) .label.sc-smoothly-input-select{display:none}.sc-smoothly-input-select-h{display:flex;justify-content:space-between;flex-direction:row;position:relative;background-color:rgb(var(--smoothly-input-background));color:rgb(var(--smoothly-input-foreground));fill:rgb(var(--smoothly-input-foreground));stroke:rgb(var(--smoothly-input-foreground));padding:0 var(--input-padding-side)}.open.sc-smoothly-input-select-h{border-radius:var(--smoothly-input-border-radius) var(--smoothly-input-border-radius) 0 0}.icon.sc-smoothly-input-select-h{width:fit-content;flex-direction:column}.sc-smoothly-input-select-h>div.select-display.sc-smoothly-input-select{box-sizing:border-box;display:flex;cursor:pointer;padding:var(--input-value-padding-top) 0 var(--input-value-padding-bottom) 0;overflow:hidden;width:100%;white-space:nowrap;gap:1rem;text-overflow:ellipsis}.sc-smoothly-input-select-h:not(:has([slot=label]))>div.select-display.sc-smoothly-input-select,.sc-smoothly-input-select-h:not([show-label])>div.select-display.sc-smoothly-input-select{padding:.6em 0;align-items:center}[readonly].sc-smoothly-input-select-h>div.select-display.sc-smoothly-input-select{cursor:not-allowed}.sc-smoothly-input-select-h>div.select-display.sc-smoothly-input-select smoothly-icon.sc-smoothly-input-select{color:rgb(var(--smoothly-input-foreground));fill:rgb(var(--smoothly-input-foreground));stroke:rgb(var(--smoothly-input-foreground))}.sc-smoothly-input-select-h>div.icons.sc-smoothly-input-select{display:flex;flex-direction:row;align-items:center;margin-right:.2em}.sc-smoothly-input-select-h>div.icons.sc-smoothly-input-select-s>smoothly-icon:not(\"color\"){color:rgb(var(--smoothly-input-foreground));fill:rgb(var(--smoothly-input-foreground));stroke:rgb(var(--smoothly-input-foreground));filter:opacity(60%)}.sc-smoothly-input-select-h:hover>div.icons.sc-smoothly-input-select-s>smoothly-icon{filter:opacity(100%)}.sc-smoothly-input-select-h>div.icons.sc-smoothly-input-select>smoothly-icon[name=caret-down-outline].sc-smoothly-input-select,.sc-smoothly-input-select-h>div.icons.sc-smoothly-input-select>smoothly-icon[name=caret-forward-outline].sc-smoothly-input-select{opacity:.7;cursor:pointer}.invalid.sc-smoothly-input-select-h>div.sc-smoothly-input-select>smoothly-icon.invalid.sc-smoothly-input-select{display:block}.sc-smoothly-input-select-h>div.sc-smoothly-input-select>smoothly-icon.invalid.sc-smoothly-input-select{display:none}.sc-smoothly-input-select-h>div.icons.sc-smoothly-input-select-s>smoothly-input-reset{padding-right:.2em}.sc-smoothly-input-select-h .label.sc-smoothly-input-select{left:.5rem}.has-value.sc-smoothly-input-select-h:has([slot=label]:not(:empty))>div.select-display.sc-smoothly-input-select,.sc-smoothly-input-select-h:not(.has-value)[placeholder]>div.select-display.sc-smoothly-input-select{overflow:hidden;width:100%}.sc-smoothly-input-select-h>.options.sc-smoothly-input-select{display:flex;flex-direction:column;position:absolute;top:var(--element-height);z-index:10;max-height:var(--menu-height, unset);overflow-x:hidden;overflow-y:auto;background-color:rgb(var(--smoothly-input-background));left:0;right:0;border-radius:0 0 var(--smoothly-input-border-radius) var(--smoothly-input-border-radius);min-width:fit-content;border:rgb(var(--smoothly-input-border, var(--smoothly-color-contrast))) solid 1px;border-top:rgba(var(--smoothly-input-border, var(--smoothly-color-contrast)), .4) solid 1px}[looks=\"grid\"].sc-smoothly-input-select-h>div.options.sc-smoothly-input-select,[looks=border].sc-smoothly-input-select-h>div.options.sc-smoothly-input-select,[looks=\"transparent\"].sc-smoothly-input-select-h>div.options.sc-smoothly-input-select{left:-1px;right:-1px}.sc-smoothly-input-select-h>div.options.sc-smoothly-input-select-s>smoothly-item{padding:.7em .7em .7em .25em}.sc-smoothly-input-select-h>div.options.sc-smoothly-input-select-s>smoothly-item:not([selectable]){display:flex;gap:1em;background-color:rgba(var(--smoothly-primary-tint), .5);color:var(--smoothly-color-contrast)}.sc-smoothly-input-select-h>div.options.sc-smoothly-input-select>smoothly-item.sc-smoothly-input-select:not([selectable])>smoothly-icon[name=\"backspace-outline\"].sc-smoothly-input-select{margin-left:auto;margin-right:0}.sc-smoothly-input-select-h>div.options.hidden.sc-smoothly-input-select{display:none}.invalid.sc-smoothly-input-select-h>div.sc-smoothly-input-select>smoothly-icon.sc-smoothly-input-select{display:block}";
10284
+ const SmoothlyInputSelectStyle0 = styleCss$N;
10279
10285
 
10280
10286
  const SmoothlyInputSelect = class {
10281
10287
  constructor(hostRef) {
@@ -10562,14 +10568,14 @@ const SmoothlyInputSelect = class {
10562
10568
  this.addedItems = this.addedItems.concat(index.h("smoothly-item", { value: this.filter, selected: true }, this.filter));
10563
10569
  }
10564
10570
  render() {
10565
- return (index.h(index.Host, { key: '126ca504b10b3bad5e6d8082ddcd4b60a116c06b', tabIndex: 0, class: { "has-value": this.selected.length !== 0, open: this.open, invalid: !!this.invalid }, onClick: (event) => this.handleShowOptions(event) }, index.h("div", { key: '167e4b9bbdb4cf2fa4db457123dd8152acfe67d7', class: "select-display", ref: element => (this.displaySelectedElement = element) }, this.placeholder), index.h("div", { key: 'da71cda616c691e2b77887cca24abf1c82d6328e', class: "icons", ref: element => (this.iconsDiv = element) }, index.h("slot", { key: '4f6042a5a7b3d2b9fa0736f2d9ff04cc80e78e36', name: "end" }), this.looks == "border" && !this.readonly && (index.h("smoothly-icon", { key: '058577c183a1b446cd9e65d82bc7538f258e0627', ref: element => (this.toggle = element), size: "tiny", name: this.open ? "caret-down-outline" : "caret-forward-outline" })), index.h("smoothly-icon", { key: '3f09d834fb8b14a7c1aeda057e51adcdbedf7c7f', class: "invalid", name: "alert-circle", color: "danger", fill: "clear", size: "small" })), index.h("slot", { key: '93d7ac3a839964bb5e429d2f66d39cfb6c66ae0e', name: "label" }), index.h("div", { key: 'c6b2321ca5d632d07dcb7bc0cdfd9e4345a6e110', class: { hidden: !this.open, options: true }, ref: (el) => (this.optionsDiv = el) }, this.filter.length > 0 && (index.h("smoothly-item", { key: '2b3614e99b646fffc6e8d6893d8d99da278646a2', selectable: false }, index.h("smoothly-icon", { key: 'a1509e12963c7bd91de3dccd5a7b411c2b94e1d4', name: "search-outline", size: "small" }), this.filter, index.h("smoothly-icon", { key: '4b82441f8dac4fef8e1d573307ac09000c14804a', name: "backspace-outline", size: "small", onClick: e => {
10571
+ return (index.h(index.Host, { key: 'c4cabb65c384a6183e5710b590985814c72e9cc5', tabIndex: 0, class: { "has-value": this.selected.length !== 0, open: this.open, invalid: !!this.invalid }, onClick: (event) => this.handleShowOptions(event) }, index.h("div", { key: '48b695c468e1f47588014c3ba00c8173a1fec543', class: "select-display", ref: element => (this.displaySelectedElement = element) }, this.placeholder), index.h("div", { key: 'e2e787a20278b2374dc305a5bca2ee9c54a77aaf', class: "icons", ref: element => (this.iconsDiv = element) }, index.h("slot", { key: 'c4e8d15da88a3a070e8c92bafbc05ec1366dd520', name: "end" }), this.looks == "border" && !this.readonly && (index.h("smoothly-icon", { key: 'afa45686839ba1327fe83cb6d947902dbed33ef7', ref: element => (this.toggle = element), size: "tiny", name: this.open ? "caret-down-outline" : "caret-forward-outline" })), index.h("smoothly-icon", { key: 'febbc0f340ce3e10d3fab529bcd2b3a6ce0acccc', class: "invalid", name: "alert-circle", color: "danger", fill: "clear", size: "small" })), index.h("slot", { key: 'ab6ef93bfbe10588d6e0365defe3b7b5e8b0f60b', name: "label" }), index.h("div", { key: 'f7c2e8d753c6ea6f9a42b61719ae29b24ac71612', class: { hidden: !this.open, options: true }, ref: (el) => (this.optionsDiv = el) }, this.filter.length > 0 && (index.h("smoothly-item", { key: '4d012f828bc08cfa8b21206562b32665a733202e', selectable: false }, index.h("smoothly-icon", { key: '1530e7662e94201e64ad0f993cb2914117b493a6', name: "search-outline", size: "small" }), this.filter, index.h("smoothly-icon", { key: '7392ff1ad0f367383fd5004d331c6ca43007512c', name: "backspace-outline", size: "small", onClick: e => {
10566
10572
  e.stopPropagation();
10567
10573
  this.filter = "";
10568
10574
  this.element.focus();
10569
- } }), this.mutable && (index.h("smoothly-icon", { key: 'd28a88ee36f0d03cd83ef5ec6096cdb2e4a77524', name: "add", size: "small", onClick: e => {
10575
+ } }), this.mutable && (index.h("smoothly-icon", { key: '4f0cdfc025a27dfd5ed6c9a4a2223503e4a58283', name: "add", size: "small", onClick: e => {
10570
10576
  e.stopPropagation();
10571
10577
  this.addItem();
10572
- } })))), index.h("slot", { key: '4d1636482bb3d7d3f144bc3c49746e2b613eb9b3' }), this.addedItems)));
10578
+ } })))), index.h("slot", { key: '5830efb81b23701c751665d095031e679b649af8' }), this.addedItems)));
10573
10579
  }
10574
10580
  get element() { return index.getElement(this); }
10575
10581
  static get watchers() { return {
@@ -10590,8 +10596,8 @@ var Submittable;
10590
10596
  Submittable.is = is;
10591
10597
  })(Submittable || (Submittable = {}));
10592
10598
 
10593
- const styleCss$L = "[color=default].sc-smoothly-input-submit{--smoothly-color:var(--smoothly-default-color);--smoothly-color-contrast:var(--smoothly-default-contrast);--smoothly-color-shade:var(--smoothly-default-shade);--smoothly-color-tint:var(--smoothly-default-tint)}[color=primary].sc-smoothly-input-submit{--smoothly-color:var(--smoothly-primary-color);--smoothly-color-contrast:var(--smoothly-primary-contrast);--smoothly-color-shade:var(--smoothly-primary-shade);--smoothly-color-tint:var(--smoothly-primary-tint)}[color=secondary].sc-smoothly-input-submit{--smoothly-color:var(--smoothly-secondary-color);--smoothly-color-contrast:var(--smoothly-secondary-contrast);--smoothly-color-shade:var(--smoothly-secondary-shade);--smoothly-color-tint:var(--smoothly-secondary-tint)}[color=tertiary].sc-smoothly-input-submit{--smoothly-color:var(--smoothly-tertiary-color);--smoothly-color-contrast:var(--smoothly-tertiary-contrast);--smoothly-color-shade:var(--smoothly-tertiary-shade);--smoothly-color-tint:var(--smoothly-tertiary-tint)}[color=success].sc-smoothly-input-submit{--smoothly-color:var(--smoothly-success-color);--smoothly-color-contrast:var(--smoothly-success-contrast);--smoothly-color-shade:var(--smoothly-success-shade);--smoothly-color-tint:var(--smoothly-success-tint)}[color=warning].sc-smoothly-input-submit{--smoothly-color:var(--smoothly-warning-color);--smoothly-color-contrast:var(--smoothly-warning-contrast);--smoothly-color-shade:var(--smoothly-warning-shade);--smoothly-color-tint:var(--smoothly-warning-tint)}[color=danger].sc-smoothly-input-submit{--smoothly-color:var(--smoothly-danger-color);--smoothly-color-contrast:var(--smoothly-danger-contrast);--smoothly-color-shade:var(--smoothly-danger-shade);--smoothly-color-tint:var(--smoothly-danger-tint)}[color=light].sc-smoothly-input-submit{--smoothly-color:var(--smoothly-light-color);--smoothly-color-contrast:var(--smoothly-light-contrast);--smoothly-color-shade:var(--smoothly-light-shade);--smoothly-color-tint:var(--smoothly-light-tint)}[color=medium].sc-smoothly-input-submit{--smoothly-color:var(--smoothly-medium-color);--smoothly-color-contrast:var(--smoothly-medium-contrast);--smoothly-color-shade:var(--smoothly-medium-shade);--smoothly-color-tint:var(--smoothly-medium-tint)}[color=dark].sc-smoothly-input-submit{--smoothly-color:var(--smoothly-dark-color);--smoothly-color-contrast:var(--smoothly-dark-contrast);--smoothly-color-shade:var(--smoothly-dark-shade);--smoothly-color-tint:var(--smoothly-dark-tint)}.sc-smoothly-input-submit-h{--smoothly-button-border-radius:0.5rem;display:inline-block;box-sizing:border-box;border-radius:var(--smoothly-button-border-radius);cursor:pointer;border:none;outline:none;position:relative}[shape=rounded].sc-smoothly-input-submit-h{--smoothly-button-border-radius:2rem}[type=link].sc-smoothly-input-submit-h{display:inline}[disabled].sc-smoothly-input-submit-h{opacity:0.5;pointer-events:none}.sc-smoothly-input-submit-h>a.sc-smoothly-input-submit,.sc-smoothly-input-submit-h>button.sc-smoothly-input-submit{font-size:110%;font-weight:400;border:1px solid transparent;outline:none;background-color:transparent;cursor:pointer;display:inline-flex;gap:0.5rem;box-sizing:border-box}.sc-smoothly-input-submit-h>a.sc-smoothly-input-submit:empty,.sc-smoothly-input-submit-h>button.sc-smoothly-input-submit:empty{border-width:0}.sc-smoothly-input-submit-h>button.sc-smoothly-input-submit{font-weight:bold;justify-content:center;height:100%;width:100%;border-radius:var(--smoothly-button-border-radius);align-items:center}.sc-smoothly-input-submit-h:not([size=icon]):not([size=flexible])>button.sc-smoothly-input-submit{padding:0.8em;min-width:8em}.sc-smoothly-input-submit-h:not([size=icon]):not([size=flexible]):has(smoothly-icon)>button.sc-smoothly-input-submit{padding:0.6em}[size=icon].sc-smoothly-input-submit-h>button.sc-smoothly-input-submit{padding:0.5em}[type=button].sc-smoothly-input-submit-h>a.sc-smoothly-input-submit{text-align:center;text-decoration:inherit;width:calc(100% - 0.6em)}[size=small].sc-smoothly-input-submit-h>button.sc-smoothly-input-submit{font-size:100%}[size=large].sc-smoothly-input-submit-h>button.sc-smoothly-input-submit{font-size:130%}.sc-smoothly-input-submit-h:not([size=icon]){min-width:8em}[size=flexible].sc-smoothly-input-submit-h{min-width:unset;padding:0;margin:0;display:flex;justify-content:center;align-items:center}[size=flexible].sc-smoothly-input-submit-h>button.sc-smoothly-input-submit{min-width:unset;padding:0;margin:0}[expand].sc-smoothly-input-submit-h{width:100%}[expand=full].sc-smoothly-input-submit-h{border-left:none;border-right:none;--smoothly-button-border-radius:0}[fill=outline].sc-smoothly-input-submit-h>button.sc-smoothly-input-submit{background-color:transparent;color:rgb(var(--smoothly-button-foreground));fill:rgb(var(--smoothly-button-foreground));stroke:rgb(var(--smoothly-button-foreground));border-color:rgb(var(--smoothly-button-foreground))}.sc-smoothly-input-submit-h:not([fill=clear])>button.sc-smoothly-input-submit:hover,.sc-smoothly-input-submit-h>button.sc-smoothly-input-submit:focus-visible,[fill=outline].sc-smoothly-input-submit-h:active>button.sc-smoothly-input-submit::before{border-color:rgb(var(--smoothly-button-focus-color))}[fill=outline].sc-smoothly-input-submit-h>button.sc-smoothly-input-submit:hover::before,[fill=outline].sc-smoothly-input-submit-h>button.sc-smoothly-input-submit:focus-within::before,[fill=outline].sc-smoothly-input-submit-h>button.sc-smoothly-input-submit:active::before{content:\"\";position:absolute;border:2px solid rgb(var(--smoothly-button-focus-border));inset:-1px;border-radius:var(--smoothly-button-border-radius)}.sc-smoothly-input-submit-h:not([fill=clear]):not([fill=outline])>button.sc-smoothly-input-submit:hover,.sc-smoothly-input-submit-h:not([fill=clear]):not([fill=outline])>button.sc-smoothly-input-submit:focus-visible,.sc-smoothly-input-submit-h:not([fill=clear]):not([fill=outline])>button.sc-smoothly-input-submit:active{background:rgb(var(--smoothly-button-hover-background))}.sc-smoothly-input-submit-h>button.sc-smoothly-input-submit,.sc-smoothly-input-submit-h.sc-smoothly-input-submit-s>smoothly-icon,.sc-smoothly-input-submit-h .sc-smoothly-input-submit-s>smoothly-icon{color:rgb(var(--smoothly-button-foreground));stroke:rgb(var(--smoothly-button-foreground));fill:rgb(var(--smoothly-button-foreground))}[hidden].sc-smoothly-input-submit-h{display:none}.sc-smoothly-input-submit-h{display:flex}.sc-smoothly-input-submit-h:not([display]){display:none}.sc-smoothly-input-submit-h.sc-smoothly-input-submit-s>smoothly-button button>*+smoothly-icon,.sc-smoothly-input-submit-h.sc-smoothly-input-submit-s>smoothly-button-confirm button>*+smoothly-icon{display:none}[disabled].sc-smoothly-input-submit-h{cursor:not-allowed}";
10594
- const SmoothlyInputSubmitStyle0 = styleCss$L;
10599
+ const styleCss$M = "[color=default].sc-smoothly-input-submit{--smoothly-color:var(--smoothly-default-color);--smoothly-color-contrast:var(--smoothly-default-contrast);--smoothly-color-shade:var(--smoothly-default-shade);--smoothly-color-tint:var(--smoothly-default-tint)}[color=primary].sc-smoothly-input-submit{--smoothly-color:var(--smoothly-primary-color);--smoothly-color-contrast:var(--smoothly-primary-contrast);--smoothly-color-shade:var(--smoothly-primary-shade);--smoothly-color-tint:var(--smoothly-primary-tint)}[color=secondary].sc-smoothly-input-submit{--smoothly-color:var(--smoothly-secondary-color);--smoothly-color-contrast:var(--smoothly-secondary-contrast);--smoothly-color-shade:var(--smoothly-secondary-shade);--smoothly-color-tint:var(--smoothly-secondary-tint)}[color=tertiary].sc-smoothly-input-submit{--smoothly-color:var(--smoothly-tertiary-color);--smoothly-color-contrast:var(--smoothly-tertiary-contrast);--smoothly-color-shade:var(--smoothly-tertiary-shade);--smoothly-color-tint:var(--smoothly-tertiary-tint)}[color=success].sc-smoothly-input-submit{--smoothly-color:var(--smoothly-success-color);--smoothly-color-contrast:var(--smoothly-success-contrast);--smoothly-color-shade:var(--smoothly-success-shade);--smoothly-color-tint:var(--smoothly-success-tint)}[color=warning].sc-smoothly-input-submit{--smoothly-color:var(--smoothly-warning-color);--smoothly-color-contrast:var(--smoothly-warning-contrast);--smoothly-color-shade:var(--smoothly-warning-shade);--smoothly-color-tint:var(--smoothly-warning-tint)}[color=danger].sc-smoothly-input-submit{--smoothly-color:var(--smoothly-danger-color);--smoothly-color-contrast:var(--smoothly-danger-contrast);--smoothly-color-shade:var(--smoothly-danger-shade);--smoothly-color-tint:var(--smoothly-danger-tint)}[color=light].sc-smoothly-input-submit{--smoothly-color:var(--smoothly-light-color);--smoothly-color-contrast:var(--smoothly-light-contrast);--smoothly-color-shade:var(--smoothly-light-shade);--smoothly-color-tint:var(--smoothly-light-tint)}[color=medium].sc-smoothly-input-submit{--smoothly-color:var(--smoothly-medium-color);--smoothly-color-contrast:var(--smoothly-medium-contrast);--smoothly-color-shade:var(--smoothly-medium-shade);--smoothly-color-tint:var(--smoothly-medium-tint)}[color=dark].sc-smoothly-input-submit{--smoothly-color:var(--smoothly-dark-color);--smoothly-color-contrast:var(--smoothly-dark-contrast);--smoothly-color-shade:var(--smoothly-dark-shade);--smoothly-color-tint:var(--smoothly-dark-tint)}.sc-smoothly-input-submit-h{--smoothly-button-border-radius:0.5rem;display:inline-block;box-sizing:border-box;border-radius:var(--smoothly-button-border-radius);cursor:pointer;border:none;outline:none;position:relative}[shape=rounded].sc-smoothly-input-submit-h{--smoothly-button-border-radius:2rem}[type=link].sc-smoothly-input-submit-h{display:inline}[disabled].sc-smoothly-input-submit-h{opacity:0.5;pointer-events:none}.sc-smoothly-input-submit-h>a.sc-smoothly-input-submit,.sc-smoothly-input-submit-h>button.sc-smoothly-input-submit{font-size:110%;font-weight:400;border:1px solid transparent;outline:none;background-color:transparent;cursor:pointer;display:inline-flex;gap:0.5rem;box-sizing:border-box}.sc-smoothly-input-submit-h>a.sc-smoothly-input-submit:empty,.sc-smoothly-input-submit-h>button.sc-smoothly-input-submit:empty{border-width:0}.sc-smoothly-input-submit-h>button.sc-smoothly-input-submit{font-weight:bold;justify-content:center;height:100%;width:100%;border-radius:var(--smoothly-button-border-radius);align-items:center}.sc-smoothly-input-submit-h:not([size=icon]):not([size=flexible])>button.sc-smoothly-input-submit{padding:0.8em;min-width:8em}.sc-smoothly-input-submit-h:not([size=icon]):not([size=flexible]):has(smoothly-icon)>button.sc-smoothly-input-submit{padding:0.6em}[size=icon].sc-smoothly-input-submit-h>button.sc-smoothly-input-submit{padding:0.5em}[type=button].sc-smoothly-input-submit-h>a.sc-smoothly-input-submit{text-align:center;text-decoration:inherit;width:calc(100% - 0.6em)}[size=small].sc-smoothly-input-submit-h>button.sc-smoothly-input-submit{font-size:100%}[size=large].sc-smoothly-input-submit-h>button.sc-smoothly-input-submit{font-size:130%}.sc-smoothly-input-submit-h:not([size=icon]){min-width:8em}[size=flexible].sc-smoothly-input-submit-h{min-width:unset;padding:0;margin:0;display:flex;justify-content:center;align-items:center}[size=flexible].sc-smoothly-input-submit-h>button.sc-smoothly-input-submit{min-width:unset;padding:0;margin:0}[expand].sc-smoothly-input-submit-h{width:100%}[expand=full].sc-smoothly-input-submit-h{border-left:none;border-right:none;--smoothly-button-border-radius:0}[fill=outline].sc-smoothly-input-submit-h>button.sc-smoothly-input-submit{background-color:transparent;color:rgb(var(--smoothly-button-foreground));fill:rgb(var(--smoothly-button-foreground));stroke:rgb(var(--smoothly-button-foreground));border-color:rgb(var(--smoothly-button-foreground))}.sc-smoothly-input-submit-h:not([fill=clear])>button.sc-smoothly-input-submit:hover,.sc-smoothly-input-submit-h>button.sc-smoothly-input-submit:focus-visible,[fill=outline].sc-smoothly-input-submit-h:active>button.sc-smoothly-input-submit::before{border-color:rgb(var(--smoothly-button-focus-color))}[fill=outline].sc-smoothly-input-submit-h>button.sc-smoothly-input-submit:hover::before,[fill=outline].sc-smoothly-input-submit-h>button.sc-smoothly-input-submit:focus-within::before,[fill=outline].sc-smoothly-input-submit-h>button.sc-smoothly-input-submit:active::before{content:\"\";position:absolute;border:2px solid rgb(var(--smoothly-button-focus-border));inset:-1px;border-radius:var(--smoothly-button-border-radius)}.sc-smoothly-input-submit-h:not([fill=clear]):not([fill=outline])>button.sc-smoothly-input-submit:hover,.sc-smoothly-input-submit-h:not([fill=clear]):not([fill=outline])>button.sc-smoothly-input-submit:focus-visible,.sc-smoothly-input-submit-h:not([fill=clear]):not([fill=outline])>button.sc-smoothly-input-submit:active{background:rgb(var(--smoothly-button-hover-background))}.sc-smoothly-input-submit-h>button.sc-smoothly-input-submit,.sc-smoothly-input-submit-h.sc-smoothly-input-submit-s>smoothly-icon,.sc-smoothly-input-submit-h .sc-smoothly-input-submit-s>smoothly-icon{color:rgb(var(--smoothly-button-foreground));stroke:rgb(var(--smoothly-button-foreground));fill:rgb(var(--smoothly-button-foreground))}[hidden].sc-smoothly-input-submit-h{display:none}.sc-smoothly-input-submit-h{display:flex}.sc-smoothly-input-submit-h:not([display]){display:none}.sc-smoothly-input-submit-h.sc-smoothly-input-submit-s>smoothly-button button>*+smoothly-icon,.sc-smoothly-input-submit-h.sc-smoothly-input-submit-s>smoothly-button-confirm button>*+smoothly-icon{display:none}[disabled].sc-smoothly-input-submit-h{cursor:not-allowed}";
10600
+ const SmoothlyInputSubmitStyle0 = styleCss$M;
10595
10601
 
10596
10602
  const SmoothlyInputSubmit = class {
10597
10603
  constructor(hostRef) {
@@ -10630,13 +10636,13 @@ const SmoothlyInputSubmit = class {
10630
10636
  }
10631
10637
  render() {
10632
10638
  var _a, _b;
10633
- return (index.h(index.Host, { key: '61455e946113cc21449e9e8641c6bbfef8e30e72', title: this.toolTip }, this.delete == true ? (index.h("smoothly-button-confirm", { size: this.size, shape: this.shape, expand: this.expand, color: (_a = this.color) !== null && _a !== void 0 ? _a : "danger", fill: this.fill, onSmoothlyConfirm: () => this.clickHandler() }, index.h("slot", null), index.h("smoothly-icon", { name: "trash-outline", fill: "solid", size: "tiny" }))) : (index.h("smoothly-button", { disabled: this.disabled, size: this.size, type: "button", shape: this.shape, expand: this.expand, color: (_b = this.color) !== null && _b !== void 0 ? _b : "success", fill: this.fill, onClick: () => this.clickHandler() }, index.h("slot", null), this.icon && index.h("smoothly-icon", { name: this.icon, fill: "solid", size: "tiny" })))));
10639
+ return (index.h(index.Host, { key: '9c0181cf2a8b2fc3273e9ba16c3827f636824bf1', title: this.toolTip }, this.delete == true ? (index.h("smoothly-button-confirm", { size: this.size, shape: this.shape, expand: this.expand, color: (_a = this.color) !== null && _a !== void 0 ? _a : "danger", fill: this.fill, onSmoothlyConfirm: () => this.clickHandler() }, index.h("slot", null), index.h("smoothly-icon", { name: "trash-outline", fill: "solid", size: "tiny" }))) : (index.h("smoothly-button", { disabled: this.disabled, size: this.size, type: "button", shape: this.shape, expand: this.expand, color: (_b = this.color) !== null && _b !== void 0 ? _b : "success", fill: this.fill, onClick: () => this.clickHandler() }, index.h("slot", null), this.icon && index.h("smoothly-icon", { name: this.icon, fill: "solid", size: "tiny" })))));
10634
10640
  }
10635
10641
  };
10636
10642
  SmoothlyInputSubmit.style = SmoothlyInputSubmitStyle0;
10637
10643
 
10638
- const styleCss$K = "[selected].sc-smoothly-item-h{background-color:rgb(var(--smoothly-input-selected-background));color:rgb(var(--smoothly-input-selected-foreground));border-left:.3em solid rgb(var(--smoothly-input-selected-border))}.sc-smoothly-item-h{padding:0.5em;cursor:pointer;border-left:.3em solid transparent;color:rgb(var(--smoothly-input-foreground));fill:rgb(var(--smoothly-input-foreground));stroke:rgb(var(--smoothly-input-foreground));box-sizing:border-box;min-height:3rem}.sc-smoothly-item-h.sc-smoothly-item-s>*{color:rgb(var(--smoothly-input-foreground));fill:rgb(var(--smoothly-input-foreground));stroke:rgb(var(--smoothly-input-foreground))}[marked].sc-smoothly-item-h,.sc-smoothly-item-h:hover{background-color:rgb(var(--smoothly-input-hover-background));color:rgb(var(--smoothly-input-hover-foreground));fill:rgb(var(--smoothly-input-hover-foreground));stroke:rgb(var(--smoothly-input-hover-foreground))}.sc-smoothly-item-h[marked].sc-smoothly-item-s>*,.sc-smoothly-item-h:hover.sc-smoothly-item-s>*{color:rgb(var(--smoothly-input-hover-foreground));fill:rgb(var(--smoothly-input-hover-foreground));stroke:rgb(var(--smoothly-input-hover-foreground))}";
10639
- const SmoothlyItemStyle0 = styleCss$K;
10644
+ const styleCss$L = "[selected].sc-smoothly-item-h{background-color:rgb(var(--smoothly-input-selected-background));color:rgb(var(--smoothly-input-selected-foreground));border-left:.3em solid rgb(var(--smoothly-input-selected-border))}.sc-smoothly-item-h{padding:0.5em;cursor:pointer;border-left:.3em solid transparent;color:rgb(var(--smoothly-input-foreground));fill:rgb(var(--smoothly-input-foreground));stroke:rgb(var(--smoothly-input-foreground));box-sizing:border-box;min-height:3rem}.sc-smoothly-item-h.sc-smoothly-item-s>*{color:rgb(var(--smoothly-input-foreground));fill:rgb(var(--smoothly-input-foreground));stroke:rgb(var(--smoothly-input-foreground))}[marked].sc-smoothly-item-h,.sc-smoothly-item-h:hover{background-color:rgb(var(--smoothly-input-hover-background));color:rgb(var(--smoothly-input-hover-foreground));fill:rgb(var(--smoothly-input-hover-foreground));stroke:rgb(var(--smoothly-input-hover-foreground))}.sc-smoothly-item-h[marked].sc-smoothly-item-s>*,.sc-smoothly-item-h:hover.sc-smoothly-item-s>*{color:rgb(var(--smoothly-input-hover-foreground));fill:rgb(var(--smoothly-input-hover-foreground));stroke:rgb(var(--smoothly-input-hover-foreground))}";
10645
+ const SmoothlyItemStyle0 = styleCss$L;
10640
10646
 
10641
10647
  const SmoothlyItem = class {
10642
10648
  constructor(hostRef) {
@@ -10672,7 +10678,7 @@ const SmoothlyItem = class {
10672
10678
  : false;
10673
10679
  }
10674
10680
  render() {
10675
- return (index.h(index.Host, { key: '0e5344e701592d19a28bd7d2da143047fea7e40a', tabIndex: -1 }, index.h("slot", { key: 'fd980b0d8c26d6f771a7a17e0217791f6a7f487a' })));
10681
+ return (index.h(index.Host, { key: 'b2aceaea145db0046ac8e87b495dc8deab785f60', tabIndex: -1 }, index.h("slot", { key: '18974097498a2f542e7ae723ad11a9a88e1bffb7' })));
10676
10682
  }
10677
10683
  get element() { return index.getElement(this); }
10678
10684
  static get watchers() { return {
@@ -10681,8 +10687,8 @@ const SmoothlyItem = class {
10681
10687
  };
10682
10688
  SmoothlyItem.style = SmoothlyItemStyle0;
10683
10689
 
10684
- const styleCss$J = ".sc-smoothly-label-h{position:relative;width:max-content;display:flex;justify-content:center;align-items:center;padding:0.15em 0.6em;border-radius:2em;color:rgb(var(--smoothly-default-contrast));background-color:hsl(var(--hue), 85%, 70%)}[shape=rectangle].sc-smoothly-label-h{border-radius:0.3em}";
10685
- const SmoothlyLabelStyle0 = styleCss$J;
10690
+ const styleCss$K = ".sc-smoothly-label-h{position:relative;width:max-content;display:flex;justify-content:center;align-items:center;padding:0.15em 0.6em;border-radius:2em;color:rgb(var(--smoothly-default-contrast));background-color:hsl(var(--hue), 85%, 70%)}[shape=rectangle].sc-smoothly-label-h{border-radius:0.3em}";
10691
+ const SmoothlyLabelStyle0 = styleCss$K;
10686
10692
 
10687
10693
  const SmoothlyLabel = class {
10688
10694
  constructor(hostRef) {
@@ -10693,15 +10699,15 @@ const SmoothlyLabel = class {
10693
10699
  }
10694
10700
  render() {
10695
10701
  var _a;
10696
- return (index.h(index.Host, { key: '4a90b9d9674560c2a9a59945cb1f0eaf0ce09f9b', title: this.description, style: {
10702
+ return (index.h(index.Host, { key: 'd922aac105f734223802e577908de0b8e9ca0c39', title: this.description, style: {
10697
10703
  "--hue": (_a = this.hue) === null || _a === void 0 ? void 0 : _a.toString(),
10698
- } }, index.h("slot", { key: 'ed8b2c1be55b3bd18c7af8f13a7638554046d8c5' })));
10704
+ } }, index.h("slot", { key: 'ca5761e5d1b281771f04820fcd82ae40ca54b64a' })));
10699
10705
  }
10700
10706
  };
10701
10707
  SmoothlyLabel.style = SmoothlyLabelStyle0;
10702
10708
 
10703
- const styleCss$I = ".sc-smoothly-lazy-h{display:block}";
10704
- const SmoothlyLazyStyle0 = styleCss$I;
10709
+ const styleCss$J = ".sc-smoothly-lazy-h{display:block}";
10710
+ const SmoothlyLazyStyle0 = styleCss$J;
10705
10711
 
10706
10712
  const SmoothlyLazy = class {
10707
10713
  constructor(hostRef) {
@@ -10714,7 +10720,7 @@ const SmoothlyLazy = class {
10714
10720
  this.show = true;
10715
10721
  }
10716
10722
  render() {
10717
- return (index.h(index.Host, { key: '88c9532ef42caab22c88a769a13068d7828f62e8' }, index.h("slot", { key: '473962c13eb1cedd201dc015b12543f146937871', name: "before" }), index.h("smoothly-load-more", { key: '6c9e8bbc62fac0be9eeec2475f63f6f68417006a', onSmoothlyLoadMore: e => this.loadMoreHandler(e) }), this.show && (typeof this.content == "function" ? index.h(this.content, null) : this.content), index.h("slot", { key: '9239f995d5eea81d62ec1a80167f16dcb28435a1' })));
10723
+ return (index.h(index.Host, { key: '3c967227a83500f95674271b312a1841afc40067' }, index.h("slot", { key: '293988b47130197ca487a7671a5157ee2390984a', name: "before" }), index.h("smoothly-load-more", { key: '08d8e0065a326a9dd238247066da528c91c5e14e', onSmoothlyLoadMore: e => this.loadMoreHandler(e) }), this.show && (typeof this.content == "function" ? index.h(this.content, null) : this.content), index.h("slot", { key: '703f9673a656f95818c67f1c4a98decf88d1a162' })));
10718
10724
  }
10719
10725
  };
10720
10726
  SmoothlyLazy.style = SmoothlyLazyStyle0;
@@ -10758,11 +10764,36 @@ const LoadMore = class {
10758
10764
  }
10759
10765
  }
10760
10766
  render() {
10761
- return index.h(index.Host, { key: 'e2d3a2ec72790c092e380414de0e652e5e95f2e6' });
10767
+ return index.h(index.Host, { key: 'e8d5e19dec6d562b79f27112012e62b9580f658c' });
10762
10768
  }
10763
10769
  get element() { return index.getElement(this); }
10764
10770
  };
10765
10771
 
10772
+ const styleCss$I = ".sc-smoothly-modal-h{position:fixed;display:flex;justify-content:center;align-items:center;top:0;left:0;width:100%;height:100%;background-color:rgba(var(--smoothly-modal-backdrop));color:rgb(var(--smoothly-modal-foreground))}.sc-smoothly-modal-h:not([open]),[hidden].sc-smoothly-modal-h{display:none}.sc-smoothly-modal-h>div.modal.sc-smoothly-modal{display:flex;flex-direction:column;padding:2rem;gap:1.5rem;max-width:40rem;height:fit-content;background:rgb(var(--smoothly-modal-background, var(--smoothly-color)));border:1px solid rgb(var(--smoothly-modal-border));border-radius:var(--smoothly-modal-border-radius);box-shadow:var(--smoothly-modal-shadow)}.sc-smoothly-modal-h>div.modal.sc-smoothly-modal>div.header.sc-smoothly-modal:empty,.sc-smoothly-modal-h>div.modal.sc-smoothly-modal>div.actions.sc-smoothly-modal:empty{display:none}.sc-smoothly-modal-h>div.modal.sc-smoothly-modal>div.header.sc-smoothly-modal{display:flex;justify-content:space-between;align-items:center}.sc-smoothly-modal-h>div.modal.sc-smoothly-modal>*.sc-smoothly-modal,.sc-smoothly-modal-h>div.modal.sc-smoothly-modal>div.header.sc-smoothly-modal>*.sc-smoothly-modal{margin-block:0}.sc-smoothly-modal-h>div.modal.sc-smoothly-modal>div.header.sc-smoothly-modal:not(:has([slot=\"header\"])){justify-content:end}.sc-smoothly-modal-h>div.modal.sc-smoothly-modal>div.header.sc-smoothly-modal>smoothly-icon.sc-smoothly-modal:not([slot=\"header\"]){cursor:pointer;opacity:0.7}.sc-smoothly-modal-h>div.modal.sc-smoothly-modal>div.header.sc-smoothly-modal>smoothly-icon.sc-smoothly-modal:not([slot=\"header\"]):hover{opacity:1}.sc-smoothly-modal-h>div.modal.sc-smoothly-modal>div.actions.sc-smoothly-modal{display:flex;justify-content:center;align-items:center;gap:1rem;flex-wrap:wrap}";
10773
+ const SmoothlyModalStyle0 = styleCss$I;
10774
+
10775
+ const SmoothlyModal = class {
10776
+ constructor(hostRef) {
10777
+ index.registerInstance(this, hostRef);
10778
+ this.smoothlyModalChange = index.createEvent(this, "smoothlyModalChange", 7);
10779
+ this.color = undefined;
10780
+ this.open = false;
10781
+ this.closable = false;
10782
+ }
10783
+ openChanged() {
10784
+ this.smoothlyModalChange.emit(this.open);
10785
+ }
10786
+ render() {
10787
+ return (index.h(index.Host, { key: '8a8d5bb61579367a4c241efe43f110ab07f74c83', role: "alertdialog" }, index.h("div", { key: '181d4155af04dac2e7640ed29f856d21f52a5724', class: "modal" }, index.h("div", { key: '81f86d5ea0a2dd2b1acf79e848fabec70109f7a8', class: "header" }, index.h("slot", { key: '9d5d80e04631abc007c92373303f9fdec2b6feb2', name: "header" }), this.closable && (index.h("smoothly-icon", { key: '422972e7776068483ebc14cfdf1acd13ef90bd96', name: "close-outline", fill: "solid", color: this.color, onClick: () => {
10788
+ this.open = false;
10789
+ } }))), index.h("slot", { key: 'ef627686438cdfbad2ec530c409326c32105f610' }), index.h("div", { key: 'c2130b674a9cfa8fdc861bff0816ea70ddf08a4d', class: "actions" }, index.h("slot", { key: 'bb98047a826107df942e9d5b888cf173ac8c4d3e', name: "actions" })))));
10790
+ }
10791
+ static get watchers() { return {
10792
+ "open": ["openChanged"]
10793
+ }; }
10794
+ };
10795
+ SmoothlyModal.style = SmoothlyModalStyle0;
10796
+
10766
10797
  const styleCss$H = ".sc-smoothly-next-demo-h{display:grid;gap:5rem;box-sizing:border-box;max-width:80rem;width:100%;margin:auto;padding:2rem}";
10767
10798
  const SmoothlyNextDemoStyle0 = styleCss$H;
10768
10799
 
@@ -10771,7 +10802,7 @@ const SmoothlyNextDemo = class {
10771
10802
  index.registerInstance(this, hostRef);
10772
10803
  }
10773
10804
  render() {
10774
- return (index.h(index.Host, { key: 'ad66c04678c57615cd654afef65052166bf95d02' }, index.h("smoothly-next-demo-group", { key: '18584b307d1170601bbfae068ea73aaa51495d91' }), index.h("smoothly-next-demo-colspan", { key: '46dd448391adb9c6a62877b9b08db6f638bb4ea7' }), index.h("smoothly-next-demo-simple", { key: 'e576c9455c1915d5773981a5c655960e643443b7' }), index.h("smoothly-next-demo-nested", { key: 'd9f197a314998a3bee70eb410d4c47945e48756c' }), index.h("smoothly-next-table-demo-filtered", { key: 'e1a613c0f6ec69bf6a92159afa3f347cf9411e1e' })));
10805
+ return (index.h(index.Host, { key: '13017520ca4623b617a3d255b1933d63742a4065' }, index.h("smoothly-next-demo-group", { key: '3008ea50bb9c15bfa50543b6e2e46c5f5974b54c' }), index.h("smoothly-next-demo-colspan", { key: '8f0fbd33f719c97c8a4a320fe6721a0b47bbf274' }), index.h("smoothly-next-demo-simple", { key: 'c50c5e1a7fb167ef8571feec80263d0cf8ccf8f0' }), index.h("smoothly-next-demo-nested", { key: '548df80dc2baa857c4b037df77b7fb30cb00520d' }), index.h("smoothly-next-table-demo-filtered", { key: '862288f93789bd5fd0e479882b0663ffa1a4bdca' })));
10775
10806
  }
10776
10807
  };
10777
10808
  SmoothlyNextDemo.style = SmoothlyNextDemoStyle0;
@@ -10784,7 +10815,7 @@ const SmoothlyNextDemoColspan = class {
10784
10815
  index.registerInstance(this, hostRef);
10785
10816
  }
10786
10817
  render() {
10787
- return (index.h(index.Host, { key: 'b2c6c645d065e30ee02b8e9f5feedb2b295ea3e4' }, index.h("smoothly-next-table", { key: '2a3f3f2405975ecbc1368d1fcad7cabc83e1bbf4', columns: 3 }, index.h("smoothly-next-table-head", { key: 'e77caee7b9768d0dea19249ec0a91c20cafcb607' }, index.h("smoothly-next-table-row", { key: '087a5fad61abc4ce24ca78c4acf1b8176c6b70df' }, index.h("smoothly-next-table-cell", { key: '4c49a5950fde1ccad81a94383ff16755ad5fa2e5' }, "Date"), index.h("smoothly-next-table-cell", { key: '8614f0587a7f50c996f3e4034b792e0e148ba867' }, "Skip"), index.h("smoothly-next-table-cell", { key: '386a1cf212c3caffcdb92a06f2d6b8424e48ab44' }, "Total"))), index.h("smoothly-next-table-body", { key: 'a8e0cf028b6fc60707a553792064a0bd551d857f' }, index.h("smoothly-next-table-row", { key: '6451e716f3ddd3ac0ad38ab8a8a5c9b75bdbf930' }, index.h("smoothly-next-table-cell", { key: 'df0ca19e83c66e3381ba3de68b3980b40d00bcf9', span: 2 }, index.h("smoothly-display", { key: '196eea216c4da3b8638682d89238bc1f732dab4c', type: "date", value: "2024-01-01" })), index.h("smoothly-next-table-cell", { key: '21e9c4582309ddda5927f16725c52ce26e3a6664' }, index.h("smoothly-display", { key: '2be15893edbe6c922d9b8d800129f8932817c73e', type: "price", value: 120, currency: "EUR" }))), index.h("smoothly-next-table-row", { key: 'b8c48318275f6cf0394d182441c5580554bd36ef' }, index.h("smoothly-next-table-expandable-cell", { key: '91529f5300fd180587451c7329fd308de700dca3', span: 2 }, index.h("smoothly-display", { key: 'ae2ac526610e0a9a768057643becde1f5ab89510', type: "date", value: "2024-01-02" }), index.h("smoothly-lazy", { key: '573e52c30a1394e1ebfad7cdc8bdbf8a8ad90c09', slot: "detail", content: index.h("smoothly-display", { type: "date-time", value: "2024-01-02T13:37:00.000Z" }) })), index.h("smoothly-next-table-expandable-cell", { key: '5de337ecacbfd99a15061adedf6d54c634462962' }, index.h("smoothly-display", { key: '5cb3e3fed252228a9b9d1c1d711bab91faf83f86', type: "price", value: 220, currency: "EUR" }), index.h("smoothly-lazy", { key: 'b89a787ec90aca2d56e694fdc8c820cddb0b7dda', slot: "detail", content: index.h("span", null, index.h("smoothly-display", { type: "price", value: 120, currency: "EUR" }), " + ", index.h("smoothly-display", { type: "price", value: 100, currency: "EUR" })) }))), index.h("smoothly-next-table-row", { key: '9743fe9940fee19131f342271fb77b47da615a63' }, index.h("smoothly-next-table-cell", { key: '908d245801e83374a6e20f6aebf21d87199f84fe' }, index.h("smoothly-display", { key: '7f3169841c862511050e427e6f525fae099f2f59', type: "date", value: "2024-01-02" })), index.h("smoothly-next-table-cell", { key: 'dbd77917ba5226340a77099a9afe5e80aa9b7ad5' }, "Not Skipped"), index.h("smoothly-next-table-cell", { key: 'c015691be21133633630da7f9aa0224204402c24' }, index.h("smoothly-display", { key: '960708bfa8ef9ac968f9f23120b2f89315cb7cdf', type: "price", value: 320, currency: "EUR" })))))));
10818
+ return (index.h(index.Host, { key: '27796ac28a50da50db0be40b5e04ad08bebf0bcd' }, index.h("smoothly-next-table", { key: 'c0e5aef2a19b61d3c6ea07259bb43b9fe1818835', columns: 3 }, index.h("smoothly-next-table-head", { key: '20a436643f93c8dfeacf04535d1f55611ed61313' }, index.h("smoothly-next-table-row", { key: '1a7f3a761336dbb535a1e44a4bab91b95faa16df' }, index.h("smoothly-next-table-cell", { key: '13eb0504001f52b4283b8c90e125386b62972507' }, "Date"), index.h("smoothly-next-table-cell", { key: '6bd313a500e6418c704f0eae341bb1b96c5cf491' }, "Skip"), index.h("smoothly-next-table-cell", { key: 'f3f0d7884416f3c2a1bd0f746eacb0419f9f7ce4' }, "Total"))), index.h("smoothly-next-table-body", { key: 'bb7d0b955556ec8ffa9f00bbe361ef8a84543c5d' }, index.h("smoothly-next-table-row", { key: 'c2de161dc2ca24a502d3d4816dcd5db9c5e05867' }, index.h("smoothly-next-table-cell", { key: '27873cd6358bbc7887d91808e8f5fe4e749f759b', span: 2 }, index.h("smoothly-display", { key: 'ccd87a72c2fae763ce85181edb7c899252ff23e4', type: "date", value: "2024-01-01" })), index.h("smoothly-next-table-cell", { key: '497797dd92669d364f27de00ce2043365910f101' }, index.h("smoothly-display", { key: '636950b07dd7017eee652ec4667a04574ed226f3', type: "price", value: 120, currency: "EUR" }))), index.h("smoothly-next-table-row", { key: 'e37e3d4a52be4c0b8a32411cd40475b4a55c3997' }, index.h("smoothly-next-table-expandable-cell", { key: 'a7b0555c14b206c2824c5c8e38eab92f42b8e6ae', span: 2 }, index.h("smoothly-display", { key: '6ce82c3420b19d5064fc51dd099ad6acf6ab69bf', type: "date", value: "2024-01-02" }), index.h("smoothly-lazy", { key: '50dbda1b2f1f172a3bd11ad48fe406edc86f8172', slot: "detail", content: index.h("smoothly-display", { type: "date-time", value: "2024-01-02T13:37:00.000Z" }) })), index.h("smoothly-next-table-expandable-cell", { key: '6a15946de6a9495fbc1c35d8615b55318422dfd2' }, index.h("smoothly-display", { key: '1ffee1d92e3a2fe8542a28dd85cfacf6352ca21c', type: "price", value: 220, currency: "EUR" }), index.h("smoothly-lazy", { key: 'eccf8621336a3376aab0306c23df183deccfc82c', slot: "detail", content: index.h("span", null, index.h("smoothly-display", { type: "price", value: 120, currency: "EUR" }), " + ", index.h("smoothly-display", { type: "price", value: 100, currency: "EUR" })) }))), index.h("smoothly-next-table-row", { key: '2f628dbb945d4b61ec282d42123a029e726a9f83' }, index.h("smoothly-next-table-cell", { key: '9b14c45642c90268ec817e8ac5eeb7592e7a2639' }, index.h("smoothly-display", { key: 'fd5bd4aaad2e58a8748122d436e146bf85cdc67b', type: "date", value: "2024-01-02" })), index.h("smoothly-next-table-cell", { key: '665ed679e942960c4e3c9eed2c36f3a87f510ed6' }, "Not Skipped"), index.h("smoothly-next-table-cell", { key: '8480c4f7728dbbe5adb32d656b7c65d3b57c33b0' }, index.h("smoothly-display", { key: '5aec36dd039aff21e298e685451b38ae84cbb287', type: "price", value: 320, currency: "EUR" })))))));
10788
10819
  }
10789
10820
  };
10790
10821
  SmoothlyNextDemoColspan.style = SmoothlyNextDemoColspanStyle0;
@@ -10797,7 +10828,7 @@ const SmoothlyNextDemoGroup = class {
10797
10828
  index.registerInstance(this, hostRef);
10798
10829
  }
10799
10830
  render() {
10800
- return (index.h(index.Host, { key: 'ff874f15d29e99083ebcc499cf47f13080b1d981' }, index.h("smoothly-display", { key: '1e032e73f451aebbf079015970fd4c9179b4f34c', type: "text", value: "Group" }), index.h("smoothly-next-table", { key: 'e4cbaaa391ac3a5d6c3c1e241f5abfe5a860c1e2', color: "primary", columns: 2 }, index.h("smoothly-next-table-head", { key: '28f06391849ce85568cd0d0bbacafcf399734cf0' }, index.h("smoothly-next-table-row", { key: 'e022b2233c8ee921951e788dcdf82f07d15ef331' }, index.h("smoothly-next-table-cell", { key: '6c9cf6fb3eff80c996614d30682430cf6c43c5d6' }, "Date"), index.h("smoothly-next-table-cell", { key: '69dd24aa41d2eb9be070ec15d0df5a5d70023518' }, "Total"))), index.h("smoothly-next-table-body", { key: '39573e34a031bba392edcf2259ed1e1fa99d6e0a' }, index.h("smoothly-next-table-row-group", { key: 'eb8c3c6d5f012a6d9fa18dc3a7ed02ad6f42b07f', align: true }, index.h("smoothly-display", { key: '097d576c78e4aad18b45b88140561a63849ae696', slot: "start", type: "date", value: "2024-01-01" }), index.h("smoothly-display", { key: 'cbb3f0d18e230353d46585b69575975b6b28cbca', slot: "end", type: "price", currency: "EUR", value: 510 }), index.h("smoothly-next-table-expandable-row", { key: 'f0ed517d0295c3c435b745296bda12a52ec19469' }, index.h("smoothly-next-table-cell", { key: 'aad9d185615fac89d0c7ae22a8622931714da9e5' }, index.h("smoothly-display", { key: '229bdb21a8e632b3cabc75b52dc10a5ac552843c', type: "date-time", value: "2024-01-01T01:37:00.000Z" })), index.h("smoothly-next-table-cell", { key: '65e35f8e0cef441c38538ea7260144516b073d59' }, index.h("smoothly-display", { key: 'ae43957ee27fa296763cf963715a8b332255e241', type: "price", currency: "EUR", value: 250 })), index.h("smoothly-lazy", { key: '9b04e07d24fe3a2c0582d593c128e82300fbd5ae', slot: "detail", content: index.h(index.Fragment, null, "Details of 2024-01-01T01:37:00.000Z") })), index.h("smoothly-next-table-expandable-row", { key: '0421109113e533e527b9afbb9ff96d53e782c2e7' }, index.h("smoothly-next-table-cell", { key: '339dc0089c2a94144a5ec9d32129d532ee968e83' }, index.h("smoothly-display", { key: 'fefc20db6ad710098e9a1b024b14e169b8d80c39', type: "date-time", value: "2024-01-01T13:37:00.000Z" })), index.h("smoothly-next-table-cell", { key: '3405e27f2e9fe09f6ee766603f55154ce5c97b8e' }, index.h("smoothly-display", { key: '9e9b529c7783890e535cc12e5fc81add5bb6dcbf', type: "price", currency: "EUR", value: 260 })), index.h("smoothly-lazy", { key: 'd6a1c29f866b4bc2c7f30f93694302ffa2928a6b', slot: "detail", content: index.h(index.Fragment, null, "Details of 2024-01-01T13:37:00.000Z") }))), index.h("smoothly-next-table-row", { key: '56b81f00b219e8e686895abb596815465d79bc56' }, index.h("smoothly-next-table-cell", { key: 'bde142726605fbf1d848a714ed4eeb28311d46b1' }, index.h("smoothly-display", { key: '7bdccf4633c9e7ce9ddc4ece54a1756b134191b0', type: "date", value: "2024-01-02" })), index.h("smoothly-next-table-cell", { key: '461389cef6c33040a1fb4c16ec206f16f391c315' }, index.h("smoothly-display", { key: '1a327b00a226d514fe3d22db0ca6fc05cb8544a4', type: "price", currency: "EUR", value: 130 }))), index.h("smoothly-next-table-row-group", { key: '12d395fd3c1ac1dcd846d7f1f922f399c89b3a5d' }, index.h("smoothly-display", { key: 'e79903aae83137a74d7a0d651a489554bc109916', slot: "start", type: "date", value: "2024-01-03" }), index.h("smoothly-display", { key: '6577ecd6301fc9c8ba3931fe3c3375f52425a190', slot: "end", type: "price", currency: "EUR", value: 720 }), index.h("smoothly-next-table-expandable-row", { key: '9b11f897beeafd11d209739e4e2af95d43e9024c' }, index.h("smoothly-next-table-cell", { key: '5bb31970610ce0562eabdd76c8bd6003eadcb703' }, index.h("smoothly-display", { key: 'd00fc7e0d7367da1795552a38edf6a35e7d67c04', type: "date-time", value: "2024-01-03T01:37:00.000Z" })), index.h("smoothly-next-table-cell", { key: 'ef8fd452e7f83e05fbbecf95b0638337fdbbf85d' }, index.h("smoothly-display", { key: '6524bc3d69f3c00eff36f5ddcdaaa677c1809a9a', type: "price", currency: "EUR", value: 320 })), index.h("smoothly-lazy", { key: '32d1f68b390bc19d85a32dc3300b50b0a6eacdb6', slot: "detail", content: index.h(index.Fragment, null, "Details of 2024-01-03T01:37:00.000Z") })), index.h("smoothly-next-table-expandable-row", { key: 'dacca1bc298a62451e7b1de3ea2688282b649a2a' }, index.h("smoothly-next-table-cell", { key: '97da26f60d83a2a2d948cc2ba02ba9090528f1a3' }, index.h("smoothly-display", { key: '19d81d7f3f751f25ea752ee8842f8e0a8e246584', type: "date-time", value: "2024-01-03T13:37:00.000Z" })), index.h("smoothly-next-table-cell", { key: '43c793b92e4ba613287b577219d8575a0f24410d' }, index.h("smoothly-display", { key: 'b120bb00528952bfe843fc463c74ee650ca0eeeb', type: "price", currency: "EUR", value: 400 })), index.h("smoothly-lazy", { key: '86fc64d503d0df6aef46dc3b7882d41b17b85129', slot: "detail", content: index.h(index.Fragment, null, "Details of 2024-01-03T13:37:00.000Z") }))), index.h("smoothly-next-table-row-group", { key: '40b0dc0deb96c3dbba541558e3588efe87044c0d' }, index.h("smoothly-display", { key: '493bb51e2dd587f43065aa17c5038d0eaf557ff7', slot: "start", type: "date", value: "2024-01-04" }), index.h("smoothly-next-table-expandable-row", { key: '102684745337826b747da01ff6834f8351e5fdd1' }, index.h("smoothly-next-table-cell", { key: 'c803e418a66f0e70a31b5713e3db5430b656cce5' }, index.h("smoothly-display", { key: 'a3c42172f2b70bdeac5f11e3c03c9a45a35371a3', type: "date-time", value: "2024-01-04T01:37:00.000Z" })), index.h("smoothly-next-table-cell", { key: 'b78d45a62d5afe38b9e74b79f37bf043b76535f6' }, index.h("smoothly-display", { key: 'f2de03d1b47cc9827c607bc9a1cccd7d090d109d', type: "price", currency: "EUR", value: 320 })), index.h("smoothly-lazy", { key: '987e7dc9105e445300201263849685ea8e2bef2b', slot: "detail", content: index.h(index.Fragment, null, "Details of 2024-01-04T01:37:00.000Z") })), index.h("smoothly-next-table-expandable-row", { key: '7e82232e17c85dc9a84fcedfc1da556b160a67b8' }, index.h("smoothly-next-table-cell", { key: 'b2daffddab2af02684efa06d4e583b832de01702' }, index.h("smoothly-display", { key: '487a1f53600026e1291b7ce1ba8d4565c4c5a184', type: "date-time", value: "2024-01-04T13:37:00.000Z" })), index.h("smoothly-next-table-cell", { key: '2f251ec1c497f631609fe8a9dc7c5242516953f6' }, index.h("smoothly-display", { key: '705cb8032956df5cd3fe86387f22ed1f499541e3', type: "price", currency: "EUR", value: 400 })), index.h("smoothly-lazy", { key: '96bbbbcbee7c044d380d44c1272aef94b7d26d7c', slot: "detail", content: index.h(index.Fragment, null, "Details of 2024-01-04T13:37:00.000Z") }))), index.h("smoothly-next-table-row-group", { key: '581936167e7153290cd4a004b0de4097b3dcd37d' }, index.h("smoothly-display", { key: '4c64eadf6eaadc46cf6cbe685485aa29cdd79ab3', slot: "end", type: "price", currency: "EUR", value: 720 }), index.h("smoothly-next-table-expandable-row", { key: 'f21368272112b5e10bdca67f3ac00e20c920991f' }, index.h("smoothly-next-table-cell", { key: '905ca0c7756b91ffac9c2f64b690fd4f9386d5a2' }, index.h("smoothly-display", { key: 'ff8d18b78048e4fbdd2db5daa1d0d5fc638d2b40', type: "date-time", value: "2024-01-05T01:37:00.000Z" })), index.h("smoothly-next-table-cell", { key: 'ca7e8ab39d27d5cd0f4328db1ea53ed146b096e5' }, index.h("smoothly-display", { key: 'a71b3233c84ca7bb4b841ef92e5c415920aa8e04', type: "price", currency: "EUR", value: 320 })), index.h("smoothly-lazy", { key: '8c0d91382720e022075ffcac32123d3218fca091', slot: "detail", content: index.h(index.Fragment, null, "Details of 2024-01-05T01:37:00.000Z") })), index.h("smoothly-next-table-expandable-row", { key: '7783eda7dd805ee4a1e6b812ee16dc5de5d4c728' }, index.h("smoothly-next-table-cell", { key: 'ae8618d1213ca9b2936f8e13b3099a51cc47c445' }, index.h("smoothly-display", { key: 'a2a8cc83750ba4e9754cec70e904fb034ad79d82', type: "date-time", value: "2024-01-05T13:37:00.000Z" })), index.h("smoothly-next-table-cell", { key: 'bf7a5c89a9f6709b10b4b44b6e3de4b83595d1f1' }, index.h("smoothly-display", { key: '4437f5797f262190bce122235ffa79c7a754b930', type: "price", currency: "EUR", value: 400 })), index.h("smoothly-lazy", { key: 'b0ad97494ec9e92698f5dbc87286a886513ee435', slot: "detail", content: index.h(index.Fragment, null, "Details of 2024-01-05T13:37:00.000Z") }))), index.h("fake-group-wrapper", { key: '9cf6d748292dd9fd3a9fea44fcacca3225b3e33a' }, index.h("smoothly-next-table-row-group", { key: '1bce798d3fa74f46b4f72c443bc7b8796ca3a16a' }, index.h("smoothly-display", { key: '1e5724ffb93301b0fb15d619b257784fa7496489', slot: "start", type: "date", value: "2024-01-06" }), index.h("smoothly-display", { key: '19b8246354fbfc7bfd006cd8798bb93199bafb89', slot: "end", type: "price", currency: "EUR", value: 720 }), index.h("fake-row-wrapper", { key: 'cb2d49d7a02550f6ff3a774a8cf71339fa12e004' }, index.h("smoothly-next-table-row", { key: 'bd7a8c8077c19c4c4055cd0ca9e562aa06e9890a' }, index.h("fake-cell-wrapper", { key: 'b1366c9b42cc987c3f3539987b9732151d70557f' }, index.h("smoothly-next-table-cell", { key: '81382dceb58c5ef27c34e58fce6d7c6e4c3d2042' }, index.h("smoothly-display", { key: 'f21e24a484ffc07be14132e180433f9a259da092', type: "date", value: "2024-01-02" }))), index.h("fake-expandable-cell-wrapper", { key: '1738c66939b561a6cded42cb96dc850229a49767' }, index.h("smoothly-next-table-expandable-cell", { key: '3dd59423999f91677399fd5c8484b4a6b847f4a2' }, index.h("smoothly-display", { key: '002e9352edc79c8bd24c32d86613bcd171ff3c56', type: "price", currency: "EUR", value: 130 }), index.h("smoothly-lazy", { key: '8176912a8409266607a8e9be866d973fdf09d8b6', slot: "detail", content: index.h("span", null, index.h("smoothly-display", { type: "price", value: 100, currency: "EUR" }), " + ", index.h("smoothly-display", { type: "price", value: 30, currency: "EUR" })) }))))), index.h("fake-expandable-row-wrapper", { key: 'fbb9345e40dec6db5710cffea7bdcb08891a483c' }, index.h("smoothly-next-table-expandable-row", { key: '627a45cd5376678868725bf3c06367e7ae43a5b9' }, index.h("fake-cell-wrapper", { key: 'eb046a275d6595b51403a850f798cc22916aa4be', class: "span-2" }, index.h("smoothly-next-table-cell", { key: '077a02cb1ae0717b44ce1556a49a811179e651fc', span: 2 }, index.h("smoothly-display", { key: '782b8989a45e1812fea6956991cba54bc15db671', type: "date", value: "2024-01-07" }))), index.h("smoothly-lazy", { key: '2d2bebabe359322df1d97a916ab96eac0f935427', slot: "detail", content: index.h("smoothly-display", { type: "date-time", value: "2024-01-07T13:37:00.000Z" }) }))))), index.h("smoothly-next-table-row-group", { key: '4ff04f4105fb8ae4cbeb04f383a430700248ebae' }, index.h("smoothly-display", { key: '7d3205eda3cf4c8db2dd895661dd02b6e9d7daa2', slot: "start", type: "date", value: "2024-01-08" }), index.h("smoothly-display", { key: '09b25d7d4d940827459bc613e56f99074d97e2cd', slot: "end", type: "price", currency: "EUR", value: 720 }))))));
10831
+ return (index.h(index.Host, { key: '00107720391b349441ae772cf773fd2ec0dcf3e8' }, index.h("smoothly-display", { key: '5f8a60bfcfbc7cc11344a67c3aae53491ef8d568', type: "text", value: "Group" }), index.h("smoothly-next-table", { key: '0f0eba34507f364c3ddd3fc96619e21153b5b15e', color: "primary", columns: 2 }, index.h("smoothly-next-table-head", { key: 'dc39e9cc58b74383b1650580d0957193afeb4bdf' }, index.h("smoothly-next-table-row", { key: 'ea000e7af4f3bf7449f2eb31596fa15d335beef2' }, index.h("smoothly-next-table-cell", { key: '73a01b2d248b15eddc1335241284a12174575782' }, "Date"), index.h("smoothly-next-table-cell", { key: '2ffb521c06f044a022264693b64b1cc37333e579' }, "Total"))), index.h("smoothly-next-table-body", { key: '97312f4c2ff7dd6e10230dafa2031ad9327cd21d' }, index.h("smoothly-next-table-row-group", { key: 'fda16f4e638bf0fdab68bd52d988050721847d7c', align: true }, index.h("smoothly-display", { key: 'b9675d21ca891e31e46de714210851bb2a8c85d7', slot: "start", type: "date", value: "2024-01-01" }), index.h("smoothly-display", { key: '1437979831f6bd2986adc484d36c63661fa1f0bd', slot: "end", type: "price", currency: "EUR", value: 510 }), index.h("smoothly-next-table-expandable-row", { key: '78dc25f457719b3a81324a72f6f3208027f4f334' }, index.h("smoothly-next-table-cell", { key: 'ddeebcb112ed6d7d1389ca1991b6656176374ea7' }, index.h("smoothly-display", { key: 'a5f874fcf3dfe3f568cf5d0323300b343f2ac708', type: "date-time", value: "2024-01-01T01:37:00.000Z" })), index.h("smoothly-next-table-cell", { key: 'e9abcd0f1760eeb21c1933a1c56fc7195f60c3da' }, index.h("smoothly-display", { key: '572afb037cf27ccd1b4181935814b3e6817ce876', type: "price", currency: "EUR", value: 250 })), index.h("smoothly-lazy", { key: '0c0190e41c95d39fd03487865240f43daf97b069', slot: "detail", content: index.h(index.Fragment, null, "Details of 2024-01-01T01:37:00.000Z") })), index.h("smoothly-next-table-expandable-row", { key: 'c8bace32550e65b08b8fd29ad514936095af7c1f' }, index.h("smoothly-next-table-cell", { key: 'f854682c202244f2d7784ec334a6baf866bf3314' }, index.h("smoothly-display", { key: '61015ffd8e2bcf27f830c44ab3c86939bcac218f', type: "date-time", value: "2024-01-01T13:37:00.000Z" })), index.h("smoothly-next-table-cell", { key: '10412d33ab10229a125267ee0e6011f884def956' }, index.h("smoothly-display", { key: '1cb496ed5169ef9be0d41aa9127b1394bb095d8f', type: "price", currency: "EUR", value: 260 })), index.h("smoothly-lazy", { key: 'ecb67fe11e3df463d6a46d31c2edd075bdb58f29', slot: "detail", content: index.h(index.Fragment, null, "Details of 2024-01-01T13:37:00.000Z") }))), index.h("smoothly-next-table-row", { key: '5f5699d9e6a11c6ece66287b2cbab9984b10b4ce' }, index.h("smoothly-next-table-cell", { key: '9c2fa987acc14fc768614f32ad6a633e3d778db1' }, index.h("smoothly-display", { key: 'c8072ef83ee06ec43dd7e5e257dede50f961d99f', type: "date", value: "2024-01-02" })), index.h("smoothly-next-table-cell", { key: 'cbc9b054938892c5fc4a1502960a28a03736dc5c' }, index.h("smoothly-display", { key: '2c8225a6340fbd39dc1d54bc8991021375c7742b', type: "price", currency: "EUR", value: 130 }))), index.h("smoothly-next-table-row-group", { key: 'd4c0fa91a9c5c008a32931f16a736989d23d4bb2' }, index.h("smoothly-display", { key: '0d6ef4e96b3d601f2d738477d9094210b7803691', slot: "start", type: "date", value: "2024-01-03" }), index.h("smoothly-display", { key: '84e25d2da669d0d4afbe23dfb114ffcf21c82b5e', slot: "end", type: "price", currency: "EUR", value: 720 }), index.h("smoothly-next-table-expandable-row", { key: '3ffdf7473ff6b9c40d81cbe4b2aaf3a825c86125' }, index.h("smoothly-next-table-cell", { key: 'ab985e9e6caaa743e77d4ca6e33a8e0a54a9dc6a' }, index.h("smoothly-display", { key: '8f570dde80bc617e5cb137acebc44e5dc742c06b', type: "date-time", value: "2024-01-03T01:37:00.000Z" })), index.h("smoothly-next-table-cell", { key: '5e269a1370993eda41e2d466b35077f1dab9d08a' }, index.h("smoothly-display", { key: '0563c3b3f467b71087e1d28bb1cff706667fad8e', type: "price", currency: "EUR", value: 320 })), index.h("smoothly-lazy", { key: 'e6584a4a3bf627b53d16e89c2cce7616876e5c6d', slot: "detail", content: index.h(index.Fragment, null, "Details of 2024-01-03T01:37:00.000Z") })), index.h("smoothly-next-table-expandable-row", { key: '5a054025d70b831d91d6d2e862b741772207eb60' }, index.h("smoothly-next-table-cell", { key: '2543c240ced21320a82b87006aab704c2d10b8e0' }, index.h("smoothly-display", { key: '73277a03ce5942a4d1c04d7f1155410054b12404', type: "date-time", value: "2024-01-03T13:37:00.000Z" })), index.h("smoothly-next-table-cell", { key: '66f3ba0940cb1537212b16e28712f8bf7178da91' }, index.h("smoothly-display", { key: '7991e7325ae9179051ab238e0423cb50afe754aa', type: "price", currency: "EUR", value: 400 })), index.h("smoothly-lazy", { key: '31e2406e1243c99efe0e03f305f6035daa18aa7d', slot: "detail", content: index.h(index.Fragment, null, "Details of 2024-01-03T13:37:00.000Z") }))), index.h("smoothly-next-table-row-group", { key: '178a34a2d08caf9d102f7bdd37b3c1ba5b760cfe' }, index.h("smoothly-display", { key: '684716cf86d232663a7a7238340bae887a96699f', slot: "start", type: "date", value: "2024-01-04" }), index.h("smoothly-next-table-expandable-row", { key: '5a187e5f912989f9dcc08009e05cb5aa32d25fac' }, index.h("smoothly-next-table-cell", { key: '861f3672a68c477aa7492a9b1d36ef85c857e0bd' }, index.h("smoothly-display", { key: '879482bee27d7b2c575e348271488c41fd86fc6a', type: "date-time", value: "2024-01-04T01:37:00.000Z" })), index.h("smoothly-next-table-cell", { key: '8a3c4ec1c7257f656f7863ee03366e542a3ceb9b' }, index.h("smoothly-display", { key: 'ef28ce80ead9d0d51ad63e17f285bb1d576c65e4', type: "price", currency: "EUR", value: 320 })), index.h("smoothly-lazy", { key: 'f9ea724f32a0fb5fea0fd5c6be709e61cd430d5b', slot: "detail", content: index.h(index.Fragment, null, "Details of 2024-01-04T01:37:00.000Z") })), index.h("smoothly-next-table-expandable-row", { key: '4086636035f573e04b4c3b29d9f71e1e3db6bbae' }, index.h("smoothly-next-table-cell", { key: 'f22210aa14ea0e4185ab2f3a8f85a9bbf4a5fe4a' }, index.h("smoothly-display", { key: '3cb01fa16079e0cf36a8add8437fbd0aef6371b3', type: "date-time", value: "2024-01-04T13:37:00.000Z" })), index.h("smoothly-next-table-cell", { key: '909c0b0d7c6618bd9a3b640f4ceaebd84826faaa' }, index.h("smoothly-display", { key: 'ddbedf3e8973aaa6ca07a34cca7b9a84248a27c0', type: "price", currency: "EUR", value: 400 })), index.h("smoothly-lazy", { key: '8d7d4bab3a9ce599865f1f96e0da1f60a880f81d', slot: "detail", content: index.h(index.Fragment, null, "Details of 2024-01-04T13:37:00.000Z") }))), index.h("smoothly-next-table-row-group", { key: '957c290c4adf503c083c2a77cf035a74d0fb903c' }, index.h("smoothly-display", { key: '5c9e031ede14a47d422b3b469644209be9b38d95', slot: "end", type: "price", currency: "EUR", value: 720 }), index.h("smoothly-next-table-expandable-row", { key: 'b6985fd3b5ae4724ae9cea30a956f2e75d6e49ab' }, index.h("smoothly-next-table-cell", { key: 'c05bbb34ba90eff403f484838d89262ea92fb87c' }, index.h("smoothly-display", { key: '2c745983fba7058ce583a6fb485060dcb189dbbc', type: "date-time", value: "2024-01-05T01:37:00.000Z" })), index.h("smoothly-next-table-cell", { key: 'f331a9b877aef07f728febf8442683cc59454ab5' }, index.h("smoothly-display", { key: '9e1741958a961e81ddbafd510e557491af7ad0d4', type: "price", currency: "EUR", value: 320 })), index.h("smoothly-lazy", { key: '5ab1426aec39166bc57a66eb877f6f7c83391aa9', slot: "detail", content: index.h(index.Fragment, null, "Details of 2024-01-05T01:37:00.000Z") })), index.h("smoothly-next-table-expandable-row", { key: '338758ee1753b4d3f3ab6b3113ea217320e629da' }, index.h("smoothly-next-table-cell", { key: 'c953d80047cec4a1720a398f371c63cefb0b8bef' }, index.h("smoothly-display", { key: 'da963d282663c10a3740121fa7e4b0945c4732fc', type: "date-time", value: "2024-01-05T13:37:00.000Z" })), index.h("smoothly-next-table-cell", { key: '275b2049fa2b844b899b004b983e3b7ae28d0535' }, index.h("smoothly-display", { key: '4d57a467d26b783679b15df8ba589ba751a5146c', type: "price", currency: "EUR", value: 400 })), index.h("smoothly-lazy", { key: 'a5b658a5a2c3fd00c430bd316a4d9d921269be52', slot: "detail", content: index.h(index.Fragment, null, "Details of 2024-01-05T13:37:00.000Z") }))), index.h("fake-group-wrapper", { key: 'bd3a067117480c0b3177a4b86a426d4516dedaf3' }, index.h("smoothly-next-table-row-group", { key: '799c938feee7a42ed5882837207b841929178428' }, index.h("smoothly-display", { key: 'acd827c42f10f5fe867391d03b47bb5e3f42d8d0', slot: "start", type: "date", value: "2024-01-06" }), index.h("smoothly-display", { key: '94a58e94464bad591bb249762d6ade36c33510b7', slot: "end", type: "price", currency: "EUR", value: 720 }), index.h("fake-row-wrapper", { key: '66cf6bcd02eeb7cafbb5a8bd96007fafb4350499' }, index.h("smoothly-next-table-row", { key: '6bcafa2e926993be57ba07bd42f06beff61cb0c6' }, index.h("fake-cell-wrapper", { key: 'ed9d8126bcbf8cee01fa542c3336a9d14212f61c' }, index.h("smoothly-next-table-cell", { key: 'f84f32fe9fa0b9e38fd7531ef3ef3aa81f833ac5' }, index.h("smoothly-display", { key: '02a7fcf7773a3f522b0ad455fb771a5dd7c376d7', type: "date", value: "2024-01-02" }))), index.h("fake-expandable-cell-wrapper", { key: '241ad856e54ed5c4972f03955416a15c36a143d0' }, index.h("smoothly-next-table-expandable-cell", { key: 'bdd971c56910fbc8359ab6021856901cb3afc8bd' }, index.h("smoothly-display", { key: '3fd55705e77de16b28c20809cd6a6a57c58324d6', type: "price", currency: "EUR", value: 130 }), index.h("smoothly-lazy", { key: 'cc27159540768cd765832124f53a487f78ecea04', slot: "detail", content: index.h("span", null, index.h("smoothly-display", { type: "price", value: 100, currency: "EUR" }), " + ", index.h("smoothly-display", { type: "price", value: 30, currency: "EUR" })) }))))), index.h("fake-expandable-row-wrapper", { key: '95accdf2c8bb515abf253082f734e7dfa8fe3c0e' }, index.h("smoothly-next-table-expandable-row", { key: 'dc31702d1bb3c8fcd8dba383515abd05699f8a5e' }, index.h("fake-cell-wrapper", { key: '9a905ab96104b082b114b17f466b9823c130c30a', class: "span-2" }, index.h("smoothly-next-table-cell", { key: 'ceb47f64f86d5cf2b2ee176598011ec4e9d4f557', span: 2 }, index.h("smoothly-display", { key: 'b2081dec56b27f3e95cdd97ba3cc41106a077b79', type: "date", value: "2024-01-07" }))), index.h("smoothly-lazy", { key: '35f165d6d71929a879580ba56330c2823f33ae0b', slot: "detail", content: index.h("smoothly-display", { type: "date-time", value: "2024-01-07T13:37:00.000Z" }) }))))), index.h("smoothly-next-table-row-group", { key: 'a0fb9d098fb4d391a31baa3269fd6e550ad3534d' }, index.h("smoothly-display", { key: '966c7d9d5e4f241bfdceb51c509cb41089bca009', slot: "start", type: "date", value: "2024-01-08" }), index.h("smoothly-display", { key: '5f52da2331bc0a99d40b735294ffe664f94bdd89', slot: "end", type: "price", currency: "EUR", value: 720 }))))));
10801
10832
  }
10802
10833
  };
10803
10834
  SmoothlyNextDemoGroup.style = SmoothlyNextDemoGroupStyle0;
@@ -11743,7 +11774,7 @@ const SmoothlyNextDemoNested = class {
11743
11774
  index.registerInstance(this, hostRef);
11744
11775
  }
11745
11776
  render() {
11746
- return (index.h(index.Host, { key: 'eb174539571c6594f1a67904a3bd6cc46a4775c2' }, index.h("smoothly-display", { key: 'c38e889a98aa98d0d31759e4e6199cd8f4227da9', type: "text", value: "Nested" }), index.h("smoothly-next-table", { key: 'e6bfb25f6b697f8f2329691542386280cc4fa6ed', color: "primary", columns: 8 }, index.h("smoothly-next-table-head", { key: '55d1813a936ce8f7e8741f06df2d2c580f7f7e10' }, index.h("smoothly-next-table-row", { key: '949ebfda030b30f79f53e6384e08f7ba8df1f87b' }, index.h("smoothly-next-table-cell", { key: '233a25c79fa3292d9feadf879ddea26a96c075fe' }, "Id"), index.h("smoothly-next-table-cell", { key: '30c05dd3615677857fe5c91b16f82c4416b37008' }, "Registered"), index.h("smoothly-next-table-cell", { key: '85dbf75ac19a80e5d0f9af9d24eb4986c92f356b' }, "Name"), index.h("smoothly-next-table-cell", { key: 'eac465afe7e5136923d1d791ac9b2c199c265a70' }, "Age"), index.h("smoothly-next-table-cell", { key: '094c2f78e1815c87df70ddaddb519b7970a761b3' }, "Balance"), index.h("smoothly-next-table-cell", { key: '60aad2b05e37abef37479480743e91d86ce91f06' }, "EyeColor"), index.h("smoothly-next-table-cell", { key: 'f27711521ccd55da231c9154764b896d52d8cb67' }, "Gender"), index.h("smoothly-next-table-cell", { key: '7ec4903f2c08eeb484e749fe70e6aa243b65a6c1' }, "Company"))), index.h("smoothly-next-table-body", { key: 'a487a951bc77a11077076b0ac4b91f8ba2bd184f' }, data$1.map(entry => (index.h("smoothly-next-table-expandable-row", null, index.h("smoothly-next-demo-nested-inner", { color: "secondary", data: entry.friends, slot: "detail" }), index.h("smoothly-next-table-cell", null, entry.id), index.h("smoothly-next-table-cell", null, entry.registered), index.h("smoothly-next-table-cell", null, entry.name), index.h("smoothly-next-table-cell", null, entry.age), index.h("smoothly-next-table-cell", null, entry.balance), index.h("smoothly-next-table-cell", null, entry.eyeColor), index.h("smoothly-next-table-cell", null, entry.gender), index.h("smoothly-next-table-cell", null, entry.company))))), index.h("smoothly-next-table-foot", { key: '54805bd7e8c97fbd649e7a901f9b2e36ba4e8871' }, index.h("smoothly-next-table-row", { key: '65cf41367d296dd55a41587eef61d7ebbf7b2e9d' }, index.h("smoothly-next-table-cell", { key: 'f736158bf4d9329d7b49380e21ad83a61667b986' }, "Footer Cell"), index.h("smoothly-next-table-cell", { key: 'cbb0d98254a73a1443cbaab8a1edfaea37f7d33b' }, "Footer Cell"))))));
11777
+ return (index.h(index.Host, { key: '8f37f27812cb85a6ecf9f4d7ed9ba50b239148c5' }, index.h("smoothly-display", { key: '68937abfc9bf9b22a85fd9f51239eeaf21a12ca0', type: "text", value: "Nested" }), index.h("smoothly-next-table", { key: '3242706eaf0211a0c5fadf690b78b9e790f59a68', color: "primary", columns: 8 }, index.h("smoothly-next-table-head", { key: '29022d74a2afaf919b87619d041e79b06f49a230' }, index.h("smoothly-next-table-row", { key: 'b0e5131b451861c7b1d1f2cddddf0e00c70bf305' }, index.h("smoothly-next-table-cell", { key: 'cf07517ba2e94d5a85e8bdd828387fa28701f8a4' }, "Id"), index.h("smoothly-next-table-cell", { key: '65546bca0dc6a27793c1fb8f2c3d327cbd3023f9' }, "Registered"), index.h("smoothly-next-table-cell", { key: '5cbe9bdaa27b51f9c37d66e88860acd4e89b5574' }, "Name"), index.h("smoothly-next-table-cell", { key: '9a324e4a363bb2494f178aac4de5c4f2b34cc081' }, "Age"), index.h("smoothly-next-table-cell", { key: 'f484b7f22660f6e4c30d11b6e363f474b6e52814' }, "Balance"), index.h("smoothly-next-table-cell", { key: '31537ecf8802ba4accaefcd3eeb5fbbe951f9efb' }, "EyeColor"), index.h("smoothly-next-table-cell", { key: '53b71f0c209bc5f2b6eb33684f4e5992cdd68795' }, "Gender"), index.h("smoothly-next-table-cell", { key: '3f9c00e7618772f120d8e0bb2186171c5684b863' }, "Company"))), index.h("smoothly-next-table-body", { key: 'ad27fa7372647b96dc52dc8230d7fb9e4971fdf2' }, data$1.map(entry => (index.h("smoothly-next-table-expandable-row", null, index.h("smoothly-next-demo-nested-inner", { color: "secondary", data: entry.friends, slot: "detail" }), index.h("smoothly-next-table-cell", null, entry.id), index.h("smoothly-next-table-cell", null, entry.registered), index.h("smoothly-next-table-cell", null, entry.name), index.h("smoothly-next-table-cell", null, entry.age), index.h("smoothly-next-table-cell", null, entry.balance), index.h("smoothly-next-table-cell", null, entry.eyeColor), index.h("smoothly-next-table-cell", null, entry.gender), index.h("smoothly-next-table-cell", null, entry.company))))), index.h("smoothly-next-table-foot", { key: '1f61dea24f10b2c10689f23bccdda0a29c3561bc' }, index.h("smoothly-next-table-row", { key: 'bc025e98f221343b77746309d7b4d7212e7bcce0' }, index.h("smoothly-next-table-cell", { key: '2f439da41d155b44c576516d139c59c15ddc66c3' }, "Footer Cell"), index.h("smoothly-next-table-cell", { key: 'bef37be02cd579395a25dcc31a04d2c04a5691f3' }, "Footer Cell"))))));
11747
11778
  }
11748
11779
  };
11749
11780
  SmoothlyNextDemoNested.style = SmoothlyNextDemoNestedStyle0;
@@ -11758,7 +11789,7 @@ const SmoothlyNextDemoNestedInner = class {
11758
11789
  }
11759
11790
  render() {
11760
11791
  var _a;
11761
- return (index.h(index.Host, { key: '0248b5a72a254ce62d43d99ec2202530dd28e789' }, index.h("smoothly-next-table", { key: '4ce545a2433622bd8ac4694b30ebd51ec5c41c64', columns: 4 }, index.h("smoothly-next-table-head", { key: 'a08d6b7548fbe825faebe9426642b2518936db6c' }, index.h("smoothly-next-table-row", { key: '5ea67a034a36d0bb651c8c46a47fe79c8970c5ba' }, index.h("smoothly-next-table-cell", { key: '53bae7bcd2cd0b6bd0963ddf4d945e5f56ffea1c' }, "Id"), index.h("smoothly-next-table-cell", { key: 'e7a32cf03cfa817f5392681c18f957281e8037b0' }, "Name"), index.h("smoothly-next-table-cell", { key: '07dea67c94413dc8ac254b8bb11f3ee929a96ccd' }, "Age"), index.h("smoothly-next-table-cell", { key: 'f865dd009768fa6e5cffa253feacb4f90761abd0' }, "Balance"))), index.h("smoothly-next-table-body", { key: 'e241d00a285d0ee99bb2de8b8bf0e308b46ec9f4' }, (_a = this.data) === null || _a === void 0 ? void 0 : _a.map(entry => (index.h("smoothly-next-table-expandable-row", null, index.h("smoothly-next-table-cell", null, entry.id), index.h("smoothly-next-table-cell", null, entry.name), index.h("smoothly-next-table-cell", null, entry.age), index.h("smoothly-next-table-cell", null, entry.balance))))))));
11792
+ return (index.h(index.Host, { key: 'b96533afe403464afe1eed879646a05954aaf292' }, index.h("smoothly-next-table", { key: '74cb50c9cf59ddd35996c830d3398bb224590971', columns: 4 }, index.h("smoothly-next-table-head", { key: '61c20b2b8359465e5036db5a815268f99282c32d' }, index.h("smoothly-next-table-row", { key: '3a3fc573c3d87ad67fdebfa586e037ebd9373167' }, index.h("smoothly-next-table-cell", { key: 'ea3fc32addd0cf37a51648c350e5012d8648b898' }, "Id"), index.h("smoothly-next-table-cell", { key: 'ef6e3a42cb3c380a6dc4540ad7b369821f476cbd' }, "Name"), index.h("smoothly-next-table-cell", { key: '45cf5bc5a85c081bd1952acafff5bf8289556355' }, "Age"), index.h("smoothly-next-table-cell", { key: '9e57058db0cf95f0d3feb54cf73d9c93fc460ad2' }, "Balance"))), index.h("smoothly-next-table-body", { key: '9f8415905b5eadf8806ef503b4a9f9d54928411f' }, (_a = this.data) === null || _a === void 0 ? void 0 : _a.map(entry => (index.h("smoothly-next-table-expandable-row", null, index.h("smoothly-next-table-cell", null, entry.id), index.h("smoothly-next-table-cell", null, entry.name), index.h("smoothly-next-table-cell", null, entry.age), index.h("smoothly-next-table-cell", null, entry.balance))))))));
11762
11793
  }
11763
11794
  };
11764
11795
  SmoothlyNextDemoNestedInner.style = SmoothlyNextDemoNestedInnerStyle0;
@@ -11771,7 +11802,7 @@ const SmoothlyNextDemoSimple = class {
11771
11802
  index.registerInstance(this, hostRef);
11772
11803
  }
11773
11804
  render() {
11774
- return (index.h(index.Host, { key: 'c5fdef18f94b85c2efe83032d466da6ba567015d' }, index.h("smoothly-display", { key: '0200a4b2cd5710bd1ce995d77550a013bb7ab45b', type: "text", value: "Simple" }), index.h("smoothly-next-table", { key: '64f5c4c3b1b6dcb48446ec591d4f8ec208b17d33', color: "primary", columns: 2 }, index.h("smoothly-next-table-head", { key: '0be8b756189e93a18b40e63dd90a5cec7c32b1a9' }, index.h("smoothly-next-table-row", { key: 'a727b2b2c8159e26969528becbe4181b9982cd13' }, index.h("smoothly-next-table-cell", { key: '47917f9ed28a51e02a646db47af64b7d589ab486' }, "Breed"), index.h("smoothly-next-table-cell", { key: '17006d80320f9da44010966eb8c6bb0ce96526db' }, "Coat"))), index.h("smoothly-next-table-body", { key: '2e4220d573b24c2e975ba664a05b82631be35dbc' }, cats.map(cat => (index.h("smoothly-next-table-row", null, index.h("smoothly-next-table-expandable-cell", null, cat.breed, index.h("div", { slot: "detail" }, "Country:", index.h("br", null), cat.country)), index.h("smoothly-next-table-expandable-cell", null, cat.coat, index.h("div", { slot: "detail" }, "Pattern: ", cat.pattern))))), index.h("smoothly-next-table-expandable-row", { key: 'c3a86869b462749f01db9d85365d2bfaab54bba7' }, index.h("div", { key: '8acde0cbbef36a6118b4d5ce205ea796d584f65c', slot: "detail" }, "Content", index.h("br", { key: 'f7872803b10b635a48bd670753d03cf9d7c2e678' }), "of", index.h("br", { key: 'd552bc308f4fde201b6642e644646d952470c6c1' }), "the", index.h("br", { key: '3e043df2b75084a2880beb5b3c7d083369ff8276' }), "expandable", index.h("br", { key: 'c63c87fcd100a5c4b5d8a72b1c48cbd8196212cb' }), "row"), index.h("smoothly-next-table-cell", { key: '48e6d5a20e99edce537f666e256c293dc61a02d9' }, "Cell1 in expandable row"), index.h("smoothly-next-table-cell", { key: 'b69385320f21344c591e2a863bfe91c14c11143d' }, "Cell2 in expandable row")), index.h("smoothly-next-table-row", { key: '27af852e8125aea2c6a08816ac9fd18105a0e2e9' }, index.h("smoothly-next-table-cell", { key: '8e40941f52eb0e15f41b29480d52efba177f58f4' }, "Cell5"), index.h("smoothly-next-table-expandable-cell", { key: '54e32eb1c9966561c63702b57bcaebb0fd75799a' }, "Expandable Cell", index.h("div", { key: 'a048887e5fcf457323fcf6909f839b803b389065', slot: "detail" }, "Content of the expandable cell"))), index.h("smoothly-next-table-row", { key: '1d5a5178fb8d6cdaff961ef519f3d8133a4aa4d6' }, index.h("smoothly-next-table-expandable-cell", { key: '440b23610fdbac87b86de2ae21f9b0121dd98212' }, "Expandable Cell 1", index.h("div", { key: 'c6eeec4e8a16906309ca7343612db2c3f00528db', slot: "detail" }, "Content of the expandable cell 1")), index.h("smoothly-next-table-expandable-cell", { key: 'b4ff5754ff2ef4facbead45353bb5a4588b9d9b6' }, "Expandable Cell 2", index.h("div", { key: 'a9aa1bd586e9fee98015e609551967b692f4568b', slot: "detail" }, "Content of the expandable cell 2")))), index.h("smoothly-next-table-foot", { key: '5023f571df9999cb5da23ee3051c3270403ffc7f' }, index.h("smoothly-next-table-row", { key: 'b738ccd3663c1183d2ad84eacf36824112db4013' }, index.h("smoothly-next-table-cell", { key: '0abf338b0191ceaaed6db51fd2280d7d0d2874f6' }, "Footer Cell"), index.h("smoothly-next-table-cell", { key: '241615bc1f5aca330df47feaa8c5e583c42b5b63' }, "Footer Cell"))))));
11805
+ return (index.h(index.Host, { key: 'b208684b3e42afd9e7c33733c5ada19bb823f2d6' }, index.h("smoothly-display", { key: '1c506825525ab9058797c4d43f83ddbb3707ea83', type: "text", value: "Simple" }), index.h("smoothly-next-table", { key: '1ac990600294a5af42e85a7c5015cf187250f046', color: "primary", columns: 2 }, index.h("smoothly-next-table-head", { key: '1551dbee3b8b36d7d960d7bdd04ca49a1eb4ae6c' }, index.h("smoothly-next-table-row", { key: '783292c349b6cb3446ca75ad98025451085d5bd6' }, index.h("smoothly-next-table-cell", { key: 'e6c38954adcadbc92cc0d8f7a8afdc0279ec7c93' }, "Breed"), index.h("smoothly-next-table-cell", { key: 'ae4dbe133ad85732b3367cf87ce8f483eecec94d' }, "Coat"))), index.h("smoothly-next-table-body", { key: '855910c63834dd6de4c41150998785a00c6e51a6' }, cats.map(cat => (index.h("smoothly-next-table-row", null, index.h("smoothly-next-table-expandable-cell", null, cat.breed, index.h("div", { slot: "detail" }, "Country:", index.h("br", null), cat.country)), index.h("smoothly-next-table-expandable-cell", null, cat.coat, index.h("div", { slot: "detail" }, "Pattern: ", cat.pattern))))), index.h("smoothly-next-table-expandable-row", { key: '217ef2db0f9efb597003e2b0b15cb7bf9b79acee' }, index.h("div", { key: '08070e42588aaed1c9f6547b6c3d0f7f8c1e899e', slot: "detail" }, "Content", index.h("br", { key: 'c546c3b04c14ee02374f6efd571becf0d5852fcc' }), "of", index.h("br", { key: '3c1c2efb30c664c95906795f9c29e9fab85403c8' }), "the", index.h("br", { key: 'fe62197087a9deaf6e9a83800948e25556272fb4' }), "expandable", index.h("br", { key: 'c40015fc86a7d6b446ddca64773198c94e6a6cab' }), "row"), index.h("smoothly-next-table-cell", { key: '86a378b93d1b9f5ef2efff15f9c8222c991195a0' }, "Cell1 in expandable row"), index.h("smoothly-next-table-cell", { key: 'abcd906ebf252d2818fc61ecabc5c96f33d93c63' }, "Cell2 in expandable row")), index.h("smoothly-next-table-row", { key: 'dae677b0e06b5d3afb1cbf8f1edb51b29bad5101' }, index.h("smoothly-next-table-cell", { key: '83e8a54254ddf60164ae9146ff17c9e931742a24' }, "Cell5"), index.h("smoothly-next-table-expandable-cell", { key: 'ed6ea305ff0a88e56c26c46b2e3e5e30c6de07f5' }, "Expandable Cell", index.h("div", { key: '037d10cd323819b325e0b1cc15dc44b5c10a6cfb', slot: "detail" }, "Content of the expandable cell"))), index.h("smoothly-next-table-row", { key: '3b79ae045968ca70695b241d0e0c75e646be341b' }, index.h("smoothly-next-table-expandable-cell", { key: '939fb4cf1b114ddb60cf7c0ff6b0bd2460a0fef1' }, "Expandable Cell 1", index.h("div", { key: '53384ff42394ce9fd36015797ff62c99ab690253', slot: "detail" }, "Content of the expandable cell 1")), index.h("smoothly-next-table-expandable-cell", { key: '2326c51f5e7077ee4fe8a8ee28eead996a3c8ff5' }, "Expandable Cell 2", index.h("div", { key: '849d9fb31ca27cd92a9ebe025f1b8dd02588806e', slot: "detail" }, "Content of the expandable cell 2")))), index.h("smoothly-next-table-foot", { key: '96341e258d79b1bdffc61ec3ef23843cd620bbd3' }, index.h("smoothly-next-table-row", { key: '0e25ff8e24f495b9e9f09bfff2f83cdac4a75cc4' }, index.h("smoothly-next-table-cell", { key: 'bd1402ad5b7eb7b72435ef0953b83c86d549a626' }, "Footer Cell"), index.h("smoothly-next-table-cell", { key: '79f46f1066befd87b9621ee60d37373a6021111d' }, "Footer Cell"))))));
11775
11806
  }
11776
11807
  };
11777
11808
  const cats = [
@@ -11860,7 +11891,7 @@ const SmoothlyNextTable = class {
11860
11891
  event.stopPropagation();
11861
11892
  }
11862
11893
  render() {
11863
- return (index.h(index.Host, { key: '8f2969cfd0b8108a8e976dc592ff1e992c727cdb', style: { "--columns": this.columns.toString() } }, index.h("slot", { key: '93076a994b040551cd588de2acd21b73c407b4cc' })));
11894
+ return (index.h(index.Host, { key: 'a5f6a264ccd04fd97ca3e6e741470940edf93e70', style: { "--columns": this.columns.toString() } }, index.h("slot", { key: '8b2ed2b53c7783f45ae0a20f1fbc09960d6a0a8b' })));
11864
11895
  }
11865
11896
  };
11866
11897
  SmoothlyNextTable.style = SmoothlyNextTableStyle0;
@@ -11873,7 +11904,7 @@ const SmoothlyNextTableBody = class {
11873
11904
  index.registerInstance(this, hostRef);
11874
11905
  }
11875
11906
  render() {
11876
- return (index.h(index.Host, { key: 'f8381f510d7a93e337d2510ff605474c8c675717' }, index.h("slot", { key: '22d334dbce9a5fe7cbe75172c641cc04070cbba3' })));
11907
+ return (index.h(index.Host, { key: 'a00a51d1361e9156066c4edc40f549a90e29c1a9' }, index.h("slot", { key: '576a3efee9e369842cca6742b5d3278e6e90e82a' })));
11877
11908
  }
11878
11909
  };
11879
11910
  SmoothlyNextTableBody.style = SmoothlyNextTableBodyStyle0;
@@ -11888,7 +11919,7 @@ const SmoothlyNextTableCell = class {
11888
11919
  }
11889
11920
  render() {
11890
11921
  var _a;
11891
- return (index.h(index.Host, { key: 'a5f090501ab9f97c7acd9bde4d6efbd8ecda0acd', style: { "--smoothly-table-cell-span": (_a = this.span) === null || _a === void 0 ? void 0 : _a.toString(10) } }, index.h("slot", { key: 'b3f340298309141052b400cf10b5a11d139fdbac' })));
11922
+ return (index.h(index.Host, { key: '44302155e3e30ec4d8661d548fe6747a42091cb5', style: { "--smoothly-table-cell-span": (_a = this.span) === null || _a === void 0 ? void 0 : _a.toString(10) } }, index.h("slot", { key: '968dbfd72741e01a07761901f43a5b4bb69c31bf' })));
11892
11923
  }
11893
11924
  };
11894
11925
  SmoothlyNextTableCell.style = SmoothlyNextTableCellStyle0;
@@ -11960,18 +11991,18 @@ const TableDemoFiltered$1 = class {
11960
11991
  }
11961
11992
  render() {
11962
11993
  const cats = this.cats && filter(this.criteria, this.cats);
11963
- return (index.h(index.Host, { key: '21b8aef8fbffa0d341c6a0cb96391955daadadc8' }, index.h("smoothly-display", { key: '81aac4b8b0df022cb02fa4a4233ae81b6e703e42', type: "text", value: "Filtered" }), index.h("smoothly-filter", { key: '32b8a029114b5c69ca61ba7ae91333c03682b378' }, index.h("smoothly-filter-toggle", { key: '426ddab99effdfca5d3f0f4266df73ad17bff7c6', properties: { ["nested.pattern"]: "Ticked", breed: "" }, icon: "add", toolTip: "Nested Ticked", slot: "bar" }), index.h("smoothly-filter-toggle", { key: '5c3897576c80babf14a21b174764e05815d7b409', properties: { pattern: "Ticked", breed: "" }, icon: "paw", toolTip: "Ticked cats", slot: "bar" }), index.h("smoothly-filter-toggle", { key: '072ed99302f41e1df1f7534198edab6d56c79a19', properties: { breed: "Bombay", pattern: "Solid" }, icon: "radio-button-on", toolTip: "Solid bombay cats", slot: "bar" }), index.h("smoothly-filter-toggle", { key: '4e9c69749157a8ce2ef4ff600c258b3df31fe03b', properties: { pattern: "Colorpoint" }, not: true, active: true, icon: "alert", toolTip: "Colored cats", slot: "bar" }), index.h("smoothly-filter-select", { key: '7c1d4ef27af368bb3abbccbc8ab554c0e39e032e', menuHeight: "5items", label: "coat", property: "nested.coat", slot: "bar", multiple: false }, this.cats &&
11994
+ return (index.h(index.Host, { key: '093286a7f844e0e795e261cd55e394296da37cdc' }, index.h("smoothly-display", { key: 'fb2b537a9a45c00591f3b45e99481e390616423f', type: "text", value: "Filtered" }), index.h("smoothly-filter", { key: '5415e17f1b89938cd8305e1bfe610e2b97b03de0' }, index.h("smoothly-filter-toggle", { key: '04b6714e0fd3f3d2a5a01c457e51a324da089af7', properties: { ["nested.pattern"]: "Ticked", breed: "" }, icon: "add", toolTip: "Nested Ticked", slot: "bar" }), index.h("smoothly-filter-toggle", { key: 'e0b1d37883eb62fbd406aebbb3d64b37d0370499', properties: { pattern: "Ticked", breed: "" }, icon: "paw", toolTip: "Ticked cats", slot: "bar" }), index.h("smoothly-filter-toggle", { key: '4a8bd053e4003bcae50230f6584c090c06ca9d2e', properties: { breed: "Bombay", pattern: "Solid" }, icon: "radio-button-on", toolTip: "Solid bombay cats", slot: "bar" }), index.h("smoothly-filter-toggle", { key: '7bacf494c6aee34515dea81b1b5dfd57d8bf2a17', properties: { pattern: "Colorpoint" }, not: true, active: true, icon: "alert", toolTip: "Colored cats", slot: "bar" }), index.h("smoothly-filter-select", { key: 'cda9abcdd8adf77d79364632bc6aaac33062d980', menuHeight: "5items", label: "coat", property: "nested.coat", slot: "bar", multiple: false }, this.cats &&
11964
11995
  Object.values(this.cats.reduce((r, cat) => (cat.nested ? Object.assign(Object.assign({}, r), { [cat.nested.coat]: cat }) : r), {})).map(cat => {
11965
11996
  var _a;
11966
11997
  return ((_a = cat.nested) === null || _a === void 0 ? void 0 : _a.coat) && (index.h("smoothly-item", { slot: "items", value: cat.nested.coat }, cat.nested.coat));
11967
- })), index.h("div", { key: '2d59cb9a656bdeed01641b7fc452c2c72ec39b9c', slot: "detail" }, index.h("smoothly-form", { key: '321506b0a0b656978d64f3c79301ec8e1528a346', looks: "border" }, index.h("smoothly-filter-select", { key: 'b4d38daa73244679a7c0eaa70e58e886d04a261f', menuHeight: "5items", label: "coat", property: "nested.coat", multiple: true }, this.cats &&
11998
+ })), index.h("div", { key: 'b438d2f67bc46a2f1aeb11cfe8caaa9206a73804', slot: "detail" }, index.h("smoothly-form", { key: '007d780885e1421e9902969fdcf3271fb0167432', looks: "border" }, index.h("smoothly-filter-select", { key: 'd9f1c8e400ec8c1299c78afa1d26cbd462895a64', menuHeight: "5items", label: "coat", property: "nested.coat", multiple: true }, this.cats &&
11968
11999
  Object.values(this.cats.reduce((r, cat) => (cat.nested ? Object.assign(Object.assign({}, r), { [cat.nested.coat]: cat }) : r), {})).map(cat => {
11969
12000
  var _a;
11970
12001
  return ((_a = cat.nested) === null || _a === void 0 ? void 0 : _a.coat) && (index.h("smoothly-item", { slot: "items", value: cat.nested.coat }, cat.nested.coat));
11971
- })), index.h("smoothly-filter-select", { key: '2a7002b911e71c2fcd00d22e36bea8caee847ce6', menuHeight: "5items", label: "breed", property: "breed", multiple: false }, this.cats &&
11972
- Object.values(this.cats.reduce((r, cat) => (cat.breed ? Object.assign(Object.assign({}, r), { [cat.breed]: cat }) : r), {})).map(cat => cat.breed && (index.h("smoothly-item", { slot: "items", value: cat.breed }, cat.breed)))), index.h("smoothly-filter-select", { key: 'eec92284f9c3a34837ea8cc24c92acf1826c02d7', menuHeight: "5items", label: "names", property: "nested.names", multiple: true, type: "array" }, Object.keys(Object.values(names$1)
12002
+ })), index.h("smoothly-filter-select", { key: '6d60d144cb44633fd913bb56eaa5fc15ebd8d12e', menuHeight: "5items", label: "breed", property: "breed", multiple: false }, this.cats &&
12003
+ Object.values(this.cats.reduce((r, cat) => (cat.breed ? Object.assign(Object.assign({}, r), { [cat.breed]: cat }) : r), {})).map(cat => cat.breed && (index.h("smoothly-item", { slot: "items", value: cat.breed }, cat.breed)))), index.h("smoothly-filter-select", { key: '84d021709e5d55ca7d00bb81b487a02c09068797', menuHeight: "5items", label: "names", property: "nested.names", multiple: true, type: "array" }, Object.keys(Object.values(names$1)
11973
12004
  .flat()
11974
- .reduce((r, name) => (Object.assign(Object.assign({}, r), { [name]: true })), {})).flatMap(name => (index.h("smoothly-item", { slot: "items", value: name }, name)))), index.h("smoothly-filter-input", { key: '8aedcd9954ed6e2c398d7e4f4bb44534262d2a28', label: "Coat", property: "coat" }), index.h("smoothly-filter-input", { key: 'f42f086333adc01ab5ff116bc547bdae14a7c8ba', label: "Nested Coat", property: "nested.coat" })))), !cats ? ("Failed to load data.") : (index.h("smoothly-next-table", { columns: 4 }, index.h("smoothly-next-table-head", null, index.h("smoothly-next-table-row", null, index.h("smoothly-next-table-cell", null, this.selector.render(cats)), index.h("smoothly-next-table-cell", null, "Breed"), index.h("smoothly-next-table-cell", null, "Coat"), index.h("smoothly-next-table-cell", null, "Price"))), cats.map(cat => (index.h("smoothly-next-table-row", null, index.h("smoothly-next-table-cell", null, this.selector.render(cat)), index.h("smoothly-next-table-expandable-cell", null, cat.breed, index.h("div", { slot: "detail" }, "Country: ", cat.country)), index.h("smoothly-next-table-expandable-cell", null, cat.coat, index.h("div", { slot: "detail" }, "Pattern: ", cat.pattern)), index.h("smoothly-next-table-cell", null, index.h("smoothly-display", { type: "price", value: cat.price, currency: "SEK" }))))), index.h("smoothly-next-table-foot", null, index.h("smoothly-next-table-row", null, index.h("smoothly-next-table-cell", { span: 3 }, index.h("smoothly-display", { type: "text", value: `Selected: ${this.selector.selected.length != 0 ? this.selector.selected.length : cats ? cats.length : "?"}` }))))))));
12005
+ .reduce((r, name) => (Object.assign(Object.assign({}, r), { [name]: true })), {})).flatMap(name => (index.h("smoothly-item", { slot: "items", value: name }, name)))), index.h("smoothly-filter-input", { key: '85bb47145d4a312eff7966be03c3752c9e83116d', label: "Coat", property: "coat" }), index.h("smoothly-filter-input", { key: '66d9861b1b514a7b56bb9e804f120d0ab2c1c0cb', label: "Nested Coat", property: "nested.coat" })))), !cats ? ("Failed to load data.") : (index.h("smoothly-next-table", { columns: 4 }, index.h("smoothly-next-table-head", null, index.h("smoothly-next-table-row", null, index.h("smoothly-next-table-cell", null, this.selector.render(cats)), index.h("smoothly-next-table-cell", null, "Breed"), index.h("smoothly-next-table-cell", null, "Coat"), index.h("smoothly-next-table-cell", null, "Price"))), cats.map(cat => (index.h("smoothly-next-table-row", null, index.h("smoothly-next-table-cell", null, this.selector.render(cat)), index.h("smoothly-next-table-expandable-cell", null, cat.breed, index.h("div", { slot: "detail" }, "Country: ", cat.country)), index.h("smoothly-next-table-expandable-cell", null, cat.coat, index.h("div", { slot: "detail" }, "Pattern: ", cat.pattern)), index.h("smoothly-next-table-cell", null, index.h("smoothly-display", { type: "price", value: cat.price, currency: "SEK" }))))), index.h("smoothly-next-table-foot", null, index.h("smoothly-next-table-row", null, index.h("smoothly-next-table-cell", { span: 3 }, index.h("smoothly-display", { type: "text", value: `Selected: ${this.selector.selected.length != 0 ? this.selector.selected.length : cats ? cats.length : "?"}` }))))))));
11975
12006
  }
11976
12007
  };
11977
12008
  const names$1 = {
@@ -12007,7 +12038,7 @@ const SmoothlyNextTableExpandableCell = class {
12007
12038
  }
12008
12039
  render() {
12009
12040
  var _a;
12010
- return (index.h(index.Host, { key: 'f9ee788b23bb196c0c0ffc7e5b404149f61ea2ed', style: { "--smoothly-table-cell-span": (_a = this.span) === null || _a === void 0 ? void 0 : _a.toString(10) } }, index.h("div", { key: '66fedc2f8717220cbfa428ddd75a7b39c5db8ddf', onClick: () => this.clickHandler(), class: "content" }, index.h("slot", { key: '5bf3b5a31ed276f086eeb8379ec1b9377de26e44' })), index.h("div", { key: 'e11517c4d3b41b340bc37169f1659ff6b935ac17', class: "detail" }, index.h("slot", { key: '417bff514de4a9a0e10c245edb8e7fcbffa4526f', name: "detail" }))));
12041
+ return (index.h(index.Host, { key: '119289a907bb003ceb4f46fc874373f8b7f4942e', style: { "--smoothly-table-cell-span": (_a = this.span) === null || _a === void 0 ? void 0 : _a.toString(10) } }, index.h("div", { key: '515257705785b023ca4a41bbc74797747d508c0c', onClick: () => this.clickHandler(), class: "content" }, index.h("slot", { key: 'e46be80340a4c68b082866d02ece4eafc4a78ea1' })), index.h("div", { key: '6475b16fd7cc13ab39596b49110a2caa821d7a91', class: "detail" }, index.h("slot", { key: 'bdfd0bc8b7219f931ae913a279a529fcad11e96f', name: "detail" }))));
12011
12042
  }
12012
12043
  static get watchers() { return {
12013
12044
  "open": ["openChange"]
@@ -12031,7 +12062,7 @@ const SmoothlyNextTableExpandableRow = class {
12031
12062
  this.smoothlyNextTableExpandableRowChange.emit(this.open);
12032
12063
  }
12033
12064
  render() {
12034
- return (index.h(index.Host, { key: '4b2d988483dd093197a75171ea3c3a24864246bf', onClick: (e) => this.clickHandler(e) }, index.h("slot", { key: 'd59c66077cb1a67083c8a23e9cbb1ac9625a4df1' }), index.h("div", { key: '0dde37337531483d160c6fa081a5754f31c0799d', ref: e => (this.div = e) }, index.h("slot", { key: '0914d7e1e3472082335eaafe04629c4490bf6854', name: "detail" }))));
12065
+ return (index.h(index.Host, { key: 'afccc86c98a2d7e821d5728d290f7bb12e82e139', onClick: (e) => this.clickHandler(e) }, index.h("slot", { key: '8ff3d3cede9388122b98aa8b814fcd9feceb3a20' }), index.h("div", { key: '1749fe7e69ce1af4035663a4967700705e4b813a', ref: e => (this.div = e) }, index.h("slot", { key: '1eb4e0197d61e292b6a64906c3ed06fc24c56d28', name: "detail" }))));
12035
12066
  }
12036
12067
  static get watchers() { return {
12037
12068
  "open": ["openChange"]
@@ -12047,7 +12078,7 @@ const SmoothlyNextTableFoot = class {
12047
12078
  index.registerInstance(this, hostRef);
12048
12079
  }
12049
12080
  render() {
12050
- return (index.h(index.Host, { key: '002f8fdf9a86bbe73432339582adfb6ff75537dd' }, index.h("slot", { key: 'f54fcaa0a1da2d1d910ac56a2b3c3de609f2c099' })));
12081
+ return (index.h(index.Host, { key: 'e406505551c283675e8d66a9926a05c72425e9c2' }, index.h("slot", { key: '07592151cec5a40a1865cac7a43df4af97d3f2f3' })));
12051
12082
  }
12052
12083
  };
12053
12084
  SmoothlyNextTableFoot.style = SmoothlyNextTableFootStyle0;
@@ -12078,7 +12109,7 @@ const SmoothlyNextTableHead = class {
12078
12109
  (_a = this.scrollParent) === null || _a === void 0 ? void 0 : _a.removeEventListener("scroll", this.onScroll);
12079
12110
  }
12080
12111
  render() {
12081
- return (index.h(index.Host, { key: 'ec034d5b8c824a2c3f87038ecb8bd0f39323ecf2', class: { scrolled: !!this.scrolled } }, index.h("slot", { key: 'dd85786f6c1182900ff51f2b7a45ce916ff679b2' })));
12112
+ return (index.h(index.Host, { key: '0033553e2d592dec3e088ceac1c840dca4f67671', class: { scrolled: !!this.scrolled } }, index.h("slot", { key: '4907255ee9e86e93f5fb064edad72811efeada95' })));
12082
12113
  }
12083
12114
  get element() { return index.getElement(this); }
12084
12115
  };
@@ -12102,7 +12133,7 @@ const SmoothlyNextTableRow = class {
12102
12133
  event.target != cell && cell.close();
12103
12134
  }
12104
12135
  render() {
12105
- return (index.h(index.Host, { key: 'be95802ce9024180037183f675f6622b25f3cd6b' }, index.h("slot", { key: '638c381090279b4872349665c1a76fa31bd8550d' })));
12136
+ return (index.h(index.Host, { key: '3322e029e371bfaeca10ed2c2801741019148106' }, index.h("slot", { key: '68697027cfe344b18e613c5bb9603a06c6bf94eb' })));
12106
12137
  }
12107
12138
  };
12108
12139
  SmoothlyNextTableRow.style = SmoothlyNextTableRowStyle0;
@@ -12122,7 +12153,7 @@ const SmoothlyNextTableRowGroup = class {
12122
12153
  this.smoothlyNextTableRowGroupChange.emit(this.open);
12123
12154
  }
12124
12155
  render() {
12125
- return (index.h(index.Host, { key: '79a96cccc913843258e1a8ee21910ba95cb79212' }, index.h("div", { key: '91a971d8238bfde412c8d8fe161a70514680ba25', onClick: () => this.clickHandler() }, index.h("div", { key: '3247efaee6e511f2c96dbb5d95cd03b468d5ab93' }, index.h("slot", { key: '819a1490404d4631f42015eb001f30d5a1bbf91f', name: "start" })), index.h("div", { key: '77c0162725c19951cf70ba63c30657b23dd12401' }, index.h("slot", { key: '73fcae48cf88db6aaef0ee80875aa0cce91bced9', name: "end" }))), index.h("div", { key: '0af8689e2e3ed4a26f9925edc82bf557212ed18f' }, index.h("slot", { key: '5c8edd8ff22f5d48d70ce1e37e54c76ef2567746' }))));
12156
+ return (index.h(index.Host, { key: 'f01b3bb5d0726aeb6c70a2f8cb0f9c2a2d7e9215' }, index.h("div", { key: 'b598b867ea4a628de3c160a34ddb5f2487dec4a4', onClick: () => this.clickHandler() }, index.h("div", { key: 'b3da70637c310ec6164d9175e1f29a1f9eb96f46' }, index.h("slot", { key: 'b68fcbe98438160ce8cc6df33191f59e2f4559c9', name: "start" })), index.h("div", { key: '2a0788acc0b371b9b1405abaf5268483cab6fa98' }, index.h("slot", { key: 'efea8ad87c0a6121ae7f0c68ca11be5d590cdb3a', name: "end" }))), index.h("div", { key: '9756f7ef4c370782243dae3588a62086d4cb2a3b' }, index.h("slot", { key: '0a940bae1a64c65b8de743de2ee129648f9e2b3a' }))));
12126
12157
  }
12127
12158
  };
12128
12159
  SmoothlyNextTableRowGroup.style = SmoothlyNextTableRowGroupStyle0;
@@ -12182,7 +12213,7 @@ const Notification = class {
12182
12213
  this.onUpdatedNotice(this.notice);
12183
12214
  }
12184
12215
  render() {
12185
- return (index.h(index.Host, { key: '6ec1f235832f27c3df309d1f18a996965abdd217', color: this.properties[0], fill: "solid" }, this.closable && (index.h("smoothly-trigger", { key: '96b6f943b5633fbd9356cd33e3f3e22058fc6b4c', fill: "clear", name: "close" }, index.h("smoothly-icon", { key: '1fadc126c00027bcb3a43dc09ccffbd7401f3249', name: "close-circle-outline" }))), index.h("span", { key: 'bd7eacc66df09ea5cc6d45af66afc900b5d18374', class: this.icon ? "icon" : "clean" }, this.icon && index.h("smoothly-icon", { key: 'a99b20d20a99b1e81f2960bd7340b3cf1de51f3b', name: this.properties[1] }), index.h("p", { key: 'fa0bf5fcabbe133b119143132320eb98f3a11595' }, this.notice.message))));
12216
+ return (index.h(index.Host, { key: 'ef7444aeed0fb27214092c86d9eb4ee70bd9c056', color: this.properties[0], fill: "solid" }, this.closable && (index.h("smoothly-trigger", { key: '6a0520c327adbca9f8248af010e69ad5e01b27db', fill: "clear", name: "close" }, index.h("smoothly-icon", { key: 'c40f4c8e7664bd4686e846ff49ed1a5b33e42f4a', name: "close-circle-outline" }))), index.h("span", { key: '633dac15017f6f5ae1b6ff7712f084d94a4fc9ca', class: this.icon ? "icon" : "clean" }, this.icon && index.h("smoothly-icon", { key: 'bc315885ce88801035ce3c98a601154c76e546fe', name: this.properties[1] }), index.h("p", { key: 'e0b831cac3419fe66aff5604735d59a3f9cadeec' }, this.notice.message))));
12186
12217
  }
12187
12218
  static get watchers() { return {
12188
12219
  "notice": ["onUpdatedNotice"]
@@ -12207,8 +12238,8 @@ const Notifier = class {
12207
12238
  }
12208
12239
  render() {
12209
12240
  return [
12210
- index.h("slot", { key: '38d88ec7c986388109298bc3118da187cdeb5db1' }),
12211
- index.h("aside", { key: '7776494597ca209816a77eaac8e5fad9e98da4b4' }, this.notices.map(n => (index.h("smoothly-notification", { notice: n, icon: this.icon })))),
12241
+ index.h("slot", { key: '0c886bce3ce16e3c46cdea40a61c93b9a46871c7' }),
12242
+ index.h("aside", { key: '9899942e988bc7588903ce92766e73f3b109e226' }, this.notices.map(n => (index.h("smoothly-notification", { notice: n, icon: this.icon })))),
12212
12243
  ];
12213
12244
  }
12214
12245
  };
@@ -12225,9 +12256,9 @@ const SmoothlySpinner = class {
12225
12256
  }
12226
12257
  render() {
12227
12258
  const strokeWidth = this.size == "large" ? 6 : this.size == "medium" ? 8 : this.size == "icon" ? 8 : 12;
12228
- return (index.h(index.Host, { key: 'd30d4bf3f7e2c8ea7ba2ad651edf278e1795eac0', style: {
12259
+ return (index.h(index.Host, { key: '81ac798799ccbac9050d9cde6e2f6f40b711e19c', style: {
12229
12260
  "--spinner-size": this.size == "large" ? "5em" : this.size == "medium" ? "3em" : this.size == "icon" ? "1.8em" : "1.2em",
12230
- } }, index.h("svg", { key: '0d98c276244bbeac542017c224b148d20acebaa6', class: "spinner", viewBox: `0 0 ${60 + strokeWidth} ${60 + strokeWidth}`, xmlns: "http://www.w3.org/2000/svg" }, index.h("circle", { key: 'd5ac6fcbabbe4a1034b940ef73f63ee14884b505', class: "path", fill: "none", "stroke-width": strokeWidth, "stroke-linecap": "round", cx: `${30 + strokeWidth / 2}`, cy: `${30 + strokeWidth / 2}`, r: "30" }))));
12261
+ } }, index.h("svg", { key: '8342d4dd9c475ff67613a004deb112277cb75ab9', class: "spinner", viewBox: `0 0 ${60 + strokeWidth} ${60 + strokeWidth}`, xmlns: "http://www.w3.org/2000/svg" }, index.h("circle", { key: 'aeeb3244f7684524f15e9f300cfd1eaae0a3a704', class: "path", fill: "none", "stroke-width": strokeWidth, "stroke-linecap": "round", cx: `${30 + strokeWidth / 2}`, cy: `${30 + strokeWidth / 2}`, r: "30" }))));
12231
12262
  }
12232
12263
  };
12233
12264
  SmoothlySpinner.style = SmoothlySpinnerStyle0;
@@ -12260,7 +12291,7 @@ const SmoothlySubmit = class {
12260
12291
  (_a = this.parent) === null || _a === void 0 ? void 0 : _a.submit();
12261
12292
  }
12262
12293
  render() {
12263
- return (index.h(Button, { key: '501c8c100fab3dff9e26108160d61cd699baafea', disabled: this.disabled, type: this.type }, index.h("slot", { key: '1d7f97fb097e91732268f28f72b9ea8c12a4eb9c' })));
12294
+ return (index.h(Button, { key: '56f3a0f92fe9111ee513d7c1f2c30c1268f0b71d', disabled: this.disabled, type: this.type }, index.h("slot", { key: '5b90cb32ef640707f4c3354bbff7d3634ce3e4b1' })));
12264
12295
  }
12265
12296
  };
12266
12297
  SmoothlySubmit.style = SmoothlySubmitStyle0;
@@ -12295,7 +12326,7 @@ const SmoothlySummary = class {
12295
12326
  }
12296
12327
  }
12297
12328
  render() {
12298
- return (index.h("details", { key: '0ceae00723a65e8e5b87a0fe30c0ba376b37fd8a', onToggle: e => this.toggleHandler(e), open: this.open }, index.h("summary", { key: '57e3893bf5a17c001930b9d4d198e3072cd3bc32' }, index.h("smoothly-icon", { key: '3f1a52200e79f482de81f16f5f7061a287d16bd9', name: "caret-forward", color: this.color, fill: this.fill, size: this.size }), index.h("slot", { key: 'aeacad0c79702eba90f26020a58fc6144aef2c79', name: "summary" })), index.h("slot", { key: '2e571d4a377a4dc36b74cc0a92c7383dd870f876', name: "content" })));
12329
+ return (index.h("details", { key: '03423089bf7ee4b014c1fd3d99ad03416605834f', onToggle: e => this.toggleHandler(e), open: this.open }, index.h("summary", { key: 'ba0c2d9f264a86aa51e733403d5c28ef2249e5b0' }, index.h("smoothly-icon", { key: '6e3806216cb99e05db15ab9c5228764e0b249c88', name: "caret-forward", color: this.color, fill: this.fill, size: this.size }), index.h("slot", { key: '4ebdb4f665e4004806bcaafccb7dad453b502cb2', name: "summary" })), index.h("slot", { key: 'b4c7202fb177b351f4e2a4b2c2a0493a1929a98c', name: "content" })));
12299
12330
  }
12300
12331
  };
12301
12332
  SmoothlySummary.style = SmoothlySummaryStyle0;
@@ -12337,7 +12368,7 @@ const SmoothlyTab = class {
12337
12368
  }
12338
12369
  }
12339
12370
  render() {
12340
- return (index.h(index.Host, { key: 'e12af24406795e8b226ad6ae561d202f65a1e153' }, index.h("div", { key: '5b33ade0ecda93b3960b2b6e32dbe007804fb658' }, index.h("label", { key: '5a03adf7e78844f3aeba63ff78a21fccaec65ff9' }, this.label)), index.h("div", { key: '25fb82e9b2756dfa210ff4e07d923bdd0cc3e1ac', hidden: !this.open }, index.h("slot", { key: '7636dff75a43fe0ae13da034742001cf874804c8' }))));
12371
+ return (index.h(index.Host, { key: '7332b276d0d33c8bf9af559d1445960ab4d19fb4' }, index.h("div", { key: '9c6d23ce48245e5205655d38e3f4e4935cb654ba' }, index.h("label", { key: '6ebc7f648d62a1a376c9db4f572b86166d8eb58a' }, this.label)), index.h("div", { key: '208a58f7334fd3d7084d218ae655fa7188895b44', hidden: !this.open }, index.h("slot", { key: 'bfd4cca2db0b802c604055c29b7a2f242e9c35d7' }))));
12341
12372
  }
12342
12373
  static get watchers() { return {
12343
12374
  "open": ["openHandler"]
@@ -12388,7 +12419,7 @@ const Table = class {
12388
12419
  event.stopPropagation();
12389
12420
  }
12390
12421
  render() {
12391
- return [index.h("slot", { key: '355060c54b3d596b81699ba8d3634fbb81de3de1' })];
12422
+ return [index.h("slot", { key: '789d1cca2e2e00a20f5d6b2ae79146b7b77e709d' })];
12392
12423
  }
12393
12424
  get element() { return index.getElement(this); }
12394
12425
  };
@@ -12402,7 +12433,7 @@ const TableCell = class {
12402
12433
  index.registerInstance(this, hostRef);
12403
12434
  }
12404
12435
  render() {
12405
- return (index.h(index.Host, { key: '18794d18c837ba87e876bc622d88f99dd7f76218' }, index.h("div", { key: '9699441c8fdf2d57ded3758e5eeb5cbe7f05e5f7' }, index.h("div", { key: '6db443ed129b1168a2957ec7977cc929d8e2a855' }, index.h("slot", { key: '2c1b039d09bba48e76b94ef45f38d2a659db347f' })), index.h("smoothly-icon", { key: '2b433159b9f4a140f6a550fb64d2df9768211af3', name: "caret-forward-outline", size: "tiny" }))));
12436
+ return (index.h(index.Host, { key: 'ddbd2b60f52a554b80eb9731c3306862b9ea2caf' }, index.h("div", { key: '7c85f274db55e65d80fd8339885a514802414c96' }, index.h("div", { key: '9ba372931ea1b84c09d10eaf63ee388de1e93dce' }, index.h("slot", { key: '4ca7ea3f9c997261ed11eae003ba74d2e60b10de' })), index.h("smoothly-icon", { key: '9f960f2478bfc9698673fc66e07d5ed4265199d7', name: "caret-forward-outline", size: "tiny" }))));
12406
12437
  }
12407
12438
  };
12408
12439
  TableCell.style = SmoothlyTableCellStyle0;
@@ -12415,7 +12446,7 @@ const TableDemo = class {
12415
12446
  index.registerInstance(this, hostRef);
12416
12447
  }
12417
12448
  render() {
12418
- return (index.h(index.Host, { key: '1e81888eaa70617dc00aceea0d521b6cdc64ccfc' }, index.h("h4", { key: 'cf811a7ae12720e33f58263069bcb586b64c9899' }, "Demo table 1: Filtered & Checked Table"), " ", index.h("smoothly-lazy", { key: '8d5b7796bd599d6a715f052a9c51c734028cfbc8', content: index.h("smoothly-table-demo-filtered", null) }), index.h("h4", { key: 'ae1c1ae7f4e182b1b4951481b75f581528ca9431' }, "Demo table 2"), " ", index.h("smoothly-table-testing", { key: '9cb781610aff9a2e101c074419b3441cb222d1b6' }), " ", index.h("h4", { key: '1f7b199a3c812e9669510e387c7c580cc2ee0ef2' }, "Demo table 3"), index.h("smoothly-table", { key: '619b90e36f7d36aa1510d180418dd31587c89de5' }, index.h("smoothly-table-row", { key: 'd20f4d27e0dc7cff71043508f2a696f14aaf446e' }, index.h("smoothly-table-header", { key: '6c83cbfee2f7dd8a9f35c54d9b429d49a6f28095' }, "Header A"), index.h("smoothly-table-header", { key: 'ba411ae9b8ba9672c68188b20eec7879c9d61487' }, "Header B"), index.h("smoothly-table-header", { key: '544e5b604e47f6ee5a3af70d1d05b15a26accccc' }, "Header C"), index.h("smoothly-table-header", { key: 'd07440f84256d50b05bea93545836c8df3342059' }, "Header D")), index.h("smoothly-table-row", { key: 'f29fbd4781d3df5a436e5613ba23ea625a44e335' }, index.h("smoothly-table-expandable-cell", { key: '65885643a6fbd3be4a9dde0fce47eccdd60735ff' }, "normal row (exp.cell)", index.h("div", { key: '95fe20c0245b0ae2e16dafeae2323e74ffb301aa', slot: "detail" }, "expandable cell 1 content")), index.h("smoothly-table-expandable-cell", { key: '8a732eca75a30504e08beb5fb2d26bce47e71121' }, "expandable cell", index.h("div", { key: '6c81cc0bae9e6efc960ae83558ef7501beb8c6d6', slot: "detail" }, "expandable cell 2 content")), index.h("smoothly-table-expandable-cell", { key: '0bf827efd764a4e1e844d707a79ca284d056a892' }, "expandable cell", index.h("div", { key: 'b857f2e434b69b4bcd62eb6440d0f27697aa9e92', slot: "detail" }, "expandable cell 3 content")), index.h("smoothly-table-expandable-cell", { key: '621f67b7ab564385fb451c2d8a15ae9c22ee6119' }, "expandable cell", index.h("div", { key: 'c47a13ea04e469e9aa9a24c94059a46a4251e258', slot: "detail" }, "expandable cell 4 content"))), index.h("smoothly-table-row", { key: '2446942bf8e81d2a97de8ef58d3c2cef4bec6f2c' }, index.h("smoothly-table-cell", { key: 'b501284265c4e99706bc275e155d661a9dc6baf5' }, "normal row (nor.cell)\""), index.h("smoothly-table-cell", { key: 'f0650f4a99ae42d410f620747fa1404ec5df4a50' }, "normal cell"), index.h("smoothly-table-expandable-cell", { key: '5737103453809dc92490573254d1475b20546ebf' }, "expandable cell", index.h("div", { key: '27564d6c8413037cad183c9975c9b28afda0e897', slot: "detail" }, "expandable cell details.")), index.h("smoothly-table-expandable-cell", { key: '916bf43ed085b57ad030635cdff9eff8b80985a1' }, "expandable cell", index.h("div", { key: '221d619c3f089af2ad81cf7add468558dcef18ea', slot: "detail" }, "expandable cell details."))), index.h("smoothly-table-expandable-row", { key: '92d2596e4c862700a25e027dc3c9625500b10478' }, index.h("smoothly-table-cell", { key: '62e1cfd13663bdc82d47778aea9b95f4f22c57e5' }, "expandable row (nor.cell)"), index.h("smoothly-table-cell", { key: '1030293776092fdaa24ad3e9b529ee4f45eec8ca' }, "Normal cell"), index.h("smoothly-table-cell", { key: '7e8db7f0b350b74e84d1df6ccfb200b4a04d66b5' }, "normal cell"), index.h("smoothly-table-cell", { key: 'c5e4df506620b88a9b333a4a92b87a0d46cb1472' }, "Normal cell"), index.h("div", { key: 'f6201f1ce3644876491f3b6a9420e49c710ac113', slot: "detail" }, "expandable row content"))), index.h("h4", { key: '68910519f59a42a9268dbec93208bc0f030d9804' }, "Demo table 4"), index.h("smoothly-table", { key: '819f177232294f211c0869ac9319ebb4601ad809' }, index.h("smoothly-table-row", { key: 'ac5d6fe75392bee6b5725aa5eabcddb4e1b62ead' }, index.h("smoothly-table-header", { key: '7a8f45f9d911dfec7406e6805c55ba04169569a6' }, "Header A"), index.h("smoothly-table-expandable-cell", { key: 'f0cf50801446d37261c01d6ddcf7bb56a0d96812' }, "Header expansion", index.h("div", { key: 'be363d51d567a25f8d1979ddabe86a290df5f45a', slot: "detail" }, "Expansion content"))), index.h("smoothly-table-expandable-row", { key: 'f9c051f11a46bf9b9dccf60ee75e7a3e31cca6bd' }, index.h("smoothly-table-cell", { key: '9ac076907ea1d49c884ba4c4d7df0d50f00095ae' }, "A Content"), index.h("smoothly-table-cell", { key: '77ea6442409fb0165c3d697363cbb4c54bb22707' }, "Expansion cell"), index.h("div", { key: 'd351e4b0138840dafff86aa6d511521d8e5992a2', slot: "detail" }, index.h("smoothly-tab-switch", { key: '29fbd13a00942110f49f907fa7924ca9fa9688bd' }, index.h("smoothly-tab", { key: 'b9d8d6749e2c16c1a62a5079fcb84a99d48598c9', label: "innertable 1", open: true }, index.h("smoothly-table", { key: '7e79c190252792a2fe41499e96c51ca73c3f451c' }, index.h("smoothly-table-row", { key: '763108617589dbaf09137b11b8e956da3f3cfb8d' }, index.h("smoothly-table-header", { key: 'dd43ad5e8875f3fd11fd976f93db1ad2334613b6' }, "Header B")), index.h("smoothly-table-expandable-row", { key: '450237e8339795da1a416527794bfe72433ead09' }, "B Content"))), index.h("smoothly-tab", { key: 'abf14271c6d8c6b641e2eb9335f9f49f32be93e7', label: "innertable 2" }, index.h("smoothly-table", { key: '5e59f6f7f3d4027cb6ebed7b1f14eafc3c153f29' }, index.h("smoothly-table-row", { key: '23eeeeb7a9e61f3ef8e209a581f28dc1a12f2fbb' }, index.h("smoothly-table-header", { key: 'bb6e69d8dcadc79d8ef50510d3ee968c13418481' }, "Header C")), index.h("smoothly-table-expandable-row", { key: 'fffa4bcac8af9190eb301de669393028cb9922af' }, index.h("smoothly-table-cell", { key: 'b2578a41acb2ff4714df24c9a9f909be67d20987' }, "C Content"))))))), index.h("smoothly-table-row", { key: '93120f64ed8b8bb7f6f9bf2f4cf93bea99656823' }, index.h("smoothly-table-cell", { key: '27c785497174ca3a4041f75df596d2e5fc5c47b3' }, "A Content"), index.h("smoothly-table-expandable-cell", { key: 'ae9a378292c57acf6e63f26e9d6b3b9afca4b6a9' }, "Expandable cell", index.h("div", { key: 'ab08e00832be0ce6af77375dd494ef395c027ce4', slot: "detail" }, "Expansion content")))), index.h("h4", { key: 'c714a263f163ff7cb3d4de166df0116daa81e2cc' }, "Demo table 5"), index.h("smoothly-table", { key: '3f02085045c29d19876f0e8cf23bed4250894fe3' }, index.h("smoothly-table-row", { key: 'fa35f7bd0b49d48a3da436a008108862db387131' }, index.h("smoothly-table-header", { key: '406ae426edfab82362a2b699464760c3d6ac6fb0' }, "A"), index.h("smoothly-table-header", { key: '5b99554fb6ae94a6e0b95cffe492d1febaca28aa' }, "B")), index.h("smoothly-table-expandable-row", { key: 'dfedc25c9da8a6bbd75ae324b5a578aa9bd35b69' }, index.h("smoothly-table-cell", { key: 'f459d12839147af8aa204ee2ea75bbbcac17ae5a' }, "nested expandable row"), index.h("smoothly-table-cell", { key: 'd0a136bb38f8aa979a48b247f260a9760f5843a9' }, "b row"), index.h("div", { key: 'd00338f17800d0a521840a22e39bd972daae03bd', slot: "detail" }, index.h("smoothly-table", { key: '89e0547b0cad65f7ad2b167ea4d8c706c51afcb2' }, index.h("smoothly-table-row", { key: '20ced4c3688f3b8c75ba1d78a061779cd44a59b7' }, index.h("smoothly-table-header", { key: '0a1ee11eced03c8b8ccd1d877404fad78d510467' }, "C"), index.h("smoothly-table-header", { key: 'da2335b9f970ad68c84709e57f2a708b484c739f' }, "D")), index.h("smoothly-table-expandable-row", { key: '7e7a19166ffd03bb859a54c2821b010d436faeb6' }, index.h("smoothly-table-cell", { key: 'ea4b0f0ea191075ef54c18fabbe2ad8ed1047791' }, "c"), index.h("smoothly-table-cell", { key: 'dbf092a1d1bb5d43c5cbe196becb81b89db625d7' }, "d"), index.h("div", { key: '549de7498f0c93408119fea944a859e51fbf3ae7', slot: "detail" }, index.h("smoothly-table", { key: '2305a88610c4f553e11b7144c9030fa10a71fa7f' }, index.h("smoothly-table-row", { key: 'df3ec78778e81cce512b1dffce3e92d4b6b92c52' }, index.h("smoothly-table-header", { key: '96774b735a82a5bed80e5ba0f7ccf4c5f1b4174a' }, "E"), index.h("smoothly-table-header", { key: '04307e344fd8f11bdf0c88b5fba4649bed4ba580' }, "F")), index.h("smoothly-table-expandable-row", { key: '4a4337b1531c0eaf7945169897d219ca11527295' }, index.h("smoothly-table-cell", { key: '80c1691696bc31b95e8b599cee9db92e337b4382' }, "e row"), index.h("smoothly-table-cell", { key: 'c5b8f116527691db954891d4635c935f9756188a' }, "f row"), index.h("div", { key: 'b8eac3a676f89874a2608d044998d04860e67d28', slot: "detail" }, "nested expandable row expansion e f")))))))), index.h("smoothly-table-expandable-row", { key: 'd11dda6cd527a9a5cf6e89b1128247c3948d4e9f' }, index.h("smoothly-table-cell", { key: '935fe60f4b9d1fb24d8f52c7c6afeb4cf457bd7a' }, index.h("span", { key: '514651f49aee6f4e49b8a0af61fe205ec9f3abd8' }, "one"), index.h("span", { key: 'aa6c772b53eb2fd36270720d5f66a73d9fb67311' }, "two"), index.h("span", { key: '1be29fff33fe9d831828a648ed20dedc861dd81f' }, "three")), index.h("smoothly-table-cell", { key: '003c06afcbf0ff320a9de32b60581b83ae85acc9' }, "five", index.h("smoothly-icon", { key: '0c8c44a1edd9a1242032d4974664201501940f85', name: "paper-plane-sharp", size: "small" })), index.h("div", { key: '8f47c6a4654d81c50021f4386d50356e54afff38', slot: "detail" }, "four")), index.h("smoothly-table-row", { key: 'e2c6b130ebd48168742baaef5cf5c8e2680d8ea5' }, index.h("smoothly-table-expandable-cell", { key: 'e9f073767d0839aacc7893969e2542af214f1b9c' }, index.h("span", { key: '054869c5592ec90551c5669ccac9dd4ee39024d8' }, "nested expandable cells"), index.h("div", { key: '65116daf9dff2e598b529ea65c86b233629c2eba', slot: "detail" }, index.h("smoothly-table", { key: '6513b3a540584f9b0356083edfc9eabbf6ef5aa9' }, index.h("smoothly-table-row", { key: 'b3aa59da63cb1fefc5eaf37208583c3ab6551fcb' }, index.h("smoothly-table-header", { key: '2120416ce1708d86c63367ea607f6e05ee0aaca0' }, "E"), index.h("smoothly-table-header", { key: '9d1328b7bcbb592dbf59f86fba11117e8c5ae52b' }, "F")), index.h("smoothly-table-row", { key: '9a3808b7c792ab0426e21a8d3440b231decc0cc5' }, index.h("smoothly-table-expandable-cell", { key: 'e673440ce2a02601d226cfd7b11e6983edecc6fe' }, "e cell", index.h("div", { key: '540ed415d6c4c29479d7b0e4d6a7e208f79e37dd', slot: "detail" }, index.h("smoothly-table", { key: '07554fe7d38c781de85bc6776dde4834dcad8e0d' }, index.h("smoothly-table-row", { key: 'fe3b65f0716372568906e39284fb588c947baf4c' }, index.h("smoothly-table-header", { key: '09fd1a27b7cc01817246e067bc83de4fab6dfae7' }, "G"), index.h("smoothly-table-header", { key: 'c49c4798ef89199ac05a1c0df95c75a3985ab473' }, "H")), index.h("smoothly-table-row", { key: 'd9ccb888b9a212c2918a7c2029e70cf218f865b5' }, index.h("smoothly-table-expandable-cell", { key: '56f5199ce8eea13310c114c96accc437284e0da6' }, "g cell", index.h("div", { key: '60594357229ffb745a8c2b2194bdb2c153759ce2', slot: "detail" }, "nested expandable cell expansion g")), index.h("smoothly-table-expandable-cell", { key: 'f77afab9dfdcf09597f626fd9993adfba80038a5' }, "h cell", index.h("div", { key: 'bbf4147c3a2f54a21a79d0ebc00934855e8abf68', slot: "detail" }, "nested expandable cell expansion h")))))), index.h("smoothly-table-expandable-cell", { key: '48d7231f8728d0ba9087a3af64eee1a7864e9ee0' }, "f cell", index.h("div", { key: '15334c6f8fd87223c7550856bf94d255e3151f5f', slot: "detail" }, "nested expandable cell expansion f")))))), index.h("smoothly-table-expandable-cell", { key: 'e2e1727ba211c15e03486350c54e6e322266d19d' }, "b cell", index.h("div", { key: 'dda0f2ded71dbc0cf51ac1db7c0dcca4a3bb1195', slot: "detail" }, index.h("smoothly-table", { key: '9e0cd99b329f5379d7b24cd541f79724f211a3d8' }, index.h("smoothly-table-row", { key: 'e6af29a4a7b6f072faebea3e2b5f99a6fe09789d' }, index.h("smoothly-table-header", { key: '97ac4940e023b1f3ddcba367e8a16be0e10dfb17' }, "C"), index.h("smoothly-table-header", { key: 'e4fc8ad4dd3b5e89c59fc9eff0f9a74716ab747a' }, "D")), index.h("smoothly-table-row", { key: '9a2aab23aecfc63e9d07979ac6429836f49dc113' }, index.h("smoothly-table-expandable-cell", { key: '83c6beb6154dec2c40f10a945656d38ac1e251f6' }, "c cell", index.h("div", { key: '29d5a68d901afa9ef21694836279834c2e58aa40', slot: "detail" }, "nested expandable cell expansion c")), index.h("smoothly-table-expandable-cell", { key: 'bdf3c4db6caeb8744380e37150ffea699fef3048' }, "d cell", index.h("div", { key: '1f4ca8c1ee381a1f69b30c4731dc0a4ca6437e37', slot: "detail" }, "nested expandable cell expansion d")))))))), index.h("h4", { key: 'a8b606873bea8fd29fd5a598fdeaf54465fd8477' }, "Demo table 6"), index.h("smoothly-table", { key: '49ad1eb61a4b55a5e9697ab572657f1a376293f5' }, index.h("smoothly-table-row", { key: '69ab467625ca61745698fce9051dca55ac1933a2' }, index.h("smoothly-table-header", { key: 'ba503032861e865a78436ac0147474c768ea9e33' }, "display"), index.h("smoothly-table-header", { key: '4898d03f29a427e13e43f07c484d6bc3419eebdd' }, "contents")), index.h("smoothly-table-expandable-row", { key: 'fc732ebc99a553573a87fc3526a0040d2110cc24' }, index.h("div", { key: '18e0a560239968a34af0102198012191fa1a7e7f', class: "content" }, index.h("smoothly-table-cell", { key: '2bf87d2d2ddf3df8bd0b751d8f5ce3caf14bcbbd' }, "A"), index.h("smoothly-table-cell", { key: '1c7f4b19ef37a0c1ad63cd8d02b17d8d71b74289' }, "B")), index.h("div", { key: 'bbcbd5a769a3b39527cbc6748b36c673814a53f5', slot: "detail" }, "expansion"))), index.h("h4", { key: '5d7ee48e767200bc936931b27a14e029e4d52986' }, "Demo table 7"), " ", index.h("span", { key: 'd036fb86f3e4620d39063992d93f755142f49f2f' }, "nested 1 then normal"), index.h("smoothly-table", { key: '7707fa02cd1e9b3077b83559d3f5cf5a41edd454' }, index.h("smoothly-table-row", { key: '8dd04f01721a1a04c894c8e5c82f5ba1cb907b1b' }, index.h("smoothly-table-header", { key: '4bffdae687565c10c024ecb9dd4791f0a836126f' }, "A"), index.h("smoothly-table-header", { key: '4590482dab09d539f67588d55545e914cf6b9c77' }, "B")), index.h("smoothly-table-expandable-row", { key: '31dbffa696c52d1c55354b75095ed92392740db7' }, index.h("smoothly-table-cell", { key: '92d369a1c4a62dbacfe7a980c6340f6d0df243be' }, "a"), index.h("smoothly-table-cell", { key: 'c57f1e063ccef84669ccae9a081c639ba08583d0' }, "b"), index.h("div", { key: 'abd39e1a8a218adee4af5f8302fa5a657236211d', slot: "detail" }, index.h("smoothly-table", { key: 'bfd377d30ed610d5c1f3f511dad6515e68d3bb54' }, index.h("smoothly-table-row", { key: 'f3b2f184dc5cee1d7765713e35da478c0794375f' }, index.h("smoothly-table-header", { key: 'a390623c55a401607b8c591fe2ef98317df93764' }, "C"), index.h("smoothly-table-header", { key: '65b3f864c08dfdf4b0220e146b324947f6cfae1e' }, "D")), index.h("smoothly-table-row", { key: 'bab95dd9483805247b79c578b819c861bebfaa8d' }, index.h("smoothly-table-cell", { key: 'fe2a9ca2737837153910376dce32c7a402c6c8fd' }, "c"), index.h("smoothly-table-cell", { key: 'c6c656bc7d6308df1df80ba8be1ec485ae61e37e' }, "d")), index.h("smoothly-table-row", { key: 'aa278cf867067a35676398f225d74a9111affb36' }, index.h("smoothly-table-cell", { key: 'f564282a07c7e5dbc21bd36472622b327ee18608' }, "ccc"), index.h("smoothly-table-cell", { key: 'db4ece905e48909a68afe367ae4f20af1292945b' }, "ddd")), index.h("smoothly-table-expandable-row", { key: '102ed1c7f25cf45abf7a4238efdf7828da385397' }, index.h("smoothly-table-cell", { key: 'fad55baf3fd69b952a62057d7faa17e5bd5ec00b' }, "cccc"), index.h("smoothly-table-cell", { key: '09865389901e69b54438b121386e9dc324db32d3' }, "dddd"), index.h("div", { key: '502aed0c2ddee456e0c25c7d8293e4729e8957c5', slot: "detail" }, "CONTENT")), index.h("smoothly-table-row", { key: 'd7bef8b956a4ecf1947239069c9eee77c72227d5' }, index.h("smoothly-table-cell", { key: 'a3a06dab0231a921e63ec07337600518a8cf9c38' }, "ccccc"), index.h("smoothly-table-cell", { key: 'a8575b5800edc197459caacafcd13e559769a1eb' }, "ddd")), index.h("smoothly-table-expandable-row", { key: '633dc208b1c8e9895c05aeddd3644a626dee5e71' }, index.h("smoothly-table-cell", { key: '7c7b5577284dee9eb6af96121fc6de8db907ad07' }, "cccc"), index.h("smoothly-table-cell", { key: '014dd61d02fcaed5ea2743507e68a6653f1b54eb' }, "dddd"), index.h("div", { key: '4c9fbede205d1188439f2aef528add694cef54d9', slot: "detail" }, "CONTENT")))))), index.h("h4", { key: 'b132164e9d72c99cbcd433ab0ec6e7b0b60b3e25' }, "Demo table 8"), " ", index.h("span", { key: 'dc561b563acdf8d333923bf10b69ff143778c951' }, "not nested"), index.h("smoothly-table", { key: '74ee9c97b800c3a3f7e6825b2c3681d9d85afe69' }, index.h("smoothly-table-row", { key: '4b18d54e58521e0367b04816cd10398066394018' }, index.h("smoothly-table-header", { key: '98b143fdfc5a4662999563fda34233249d9267a7' }, "C"), index.h("smoothly-table-header", { key: '18400fcc92660c94ab1c64e20af6f97a4f3c8a05' }, "D")), index.h("smoothly-table-row", { key: 'e34cb184da9fb804b766217677971b830f2f1885' }, index.h("smoothly-table-cell", { key: 'b6d92d09994628bb9231ac5400185297dc1ff3b5' }, "c"), index.h("smoothly-table-cell", { key: '34983d7167c8a45b46eec6b32ef0e36b5cd05cf0' }, "d")), index.h("smoothly-table-row", { key: '3bfd306e3988785bfd3037e29de0ea00fc00f346' }, index.h("smoothly-table-cell", { key: 'fdec6965a2a560cf6509027a421f22f48f463d81' }, "cc"), index.h("smoothly-table-cell", { key: 'b09356192288dc68afe592f1669d09e2e9c68a0f' }, "dd")), index.h("smoothly-table-row", { key: 'ea1bb1160e13bb813e4075c8a106c5f8e49d7c99' }, index.h("smoothly-table-cell", { key: '8e2605ba8f015b09cfb2f856ba8a42c5427f22be' }, "ccc"), index.h("smoothly-table-cell", { key: 'a3117a4dee7abf312b4ff8e0c941e306885167d8' }, "ddd"))), index.h("h4", { key: '0c3d01993facb1d5b4e832562bddb9578e86ebc2' }, "Demo table 9"), index.h("smoothly-table", { key: 'c9a0e744704422b13ee6dfdcfc9c395598292e6f' }, index.h("smoothly-table-row", { key: '60a2fceafba34733346810a3387ac405721e08fd' }, index.h("smoothly-table-header", { key: '701de971e583df65bb611beb9c7ce27cd6b0a47a' }, "First name"), index.h("smoothly-table-header", { key: '17d13bf167959c8e30451f39bfccebe1b431ccb8' }, "Last name"), index.h("smoothly-table-header", { key: 'bf5c4eb33709c3e7d95e8f0fa98fe5aa47841d51', style: { width: "1px" } }, index.h("smoothly-icon", { key: '53e48b50924b099beb6a8e7a070e2980d310047d', name: "alert-outline" }))), index.h("smoothly-table-expandable-row", { key: '5223dc40dd46aa5838086c9609858799657a291f' }, index.h("smoothly-table-cell", { key: '7c159f9dd96d8f65d9b2a2c159ebcad077d4ba47' }, "Jessie"), index.h("smoothly-table-cell", { key: '5a940814eab03442b4e20cbc620ee50afe83d214' }, "Doe"), index.h("smoothly-table-cell", { key: '8e7f5ca5be97c9c8c2631b0312031d59922abb3c' }), index.h("div", { key: '47e38131aa67c605efe8ad05803f96fe07639ea0', slot: "detail" }, index.h("p", { key: '9b05cf8f394777d75f5a6fcc8c9d5d288568b8c4' }, "This is Jessie")))), index.h("h4", { key: 'a736a57fd4c75b2fc00f1fed4125d2cc925db5c1' }, "Demo table 9 - Lazy expansion rows"), index.h("smoothly-table", { key: 'cd8b06b8e3b42899b7945ffe8f5bf298a1faf913' }, index.h("smoothly-table-row", { key: '0458d828dda4829b25887bf7660c9fc5daffdc7d' }, index.h("smoothly-table-header", { key: '2c254693f0b569e408e9f22ec115592dcd79dacd' }, "Company")), index.h("smoothly-table-expandable-row", { key: '37fc26f33bff30be526ca3780fdf668f3c8c65cc' }, index.h("smoothly-table-cell", { key: '7f113a77a7bfecc61a3d263346a73c94f78fc60b' }, "Proquse"), index.h("smoothly-lazy", { key: '6fada0440bd567c7a93107a2558b88fe022a8137', slot: "detail", content: index.h("img", { src: "https://brand.proquse.com/logo/proquse-black.svg", alt: "Proquse Logotype." }) })), index.h("smoothly-table-expandable-row", { key: '00798683c7b8fa194f0c073e51d84fde85c58284' }, index.h("smoothly-table-cell", { key: '4555f5454e1c5825bacf233b8e256d326ea73229' }, "Pax2Pay"), index.h("smoothly-lazy", { key: '49feed1977bf280d37a2001445e6034e23363c66', slot: "detail", content: () => (index.h("img", { src: "https://dash.pax2pay.app/assets/pax2pay-dark-horizontal.svg", alt: "Pax2Pay Logotype." })) }))), index.h("h4", { key: '6275ea3894718b21b373638eab5eb37be4ba0a41' }, "Demo table 10 - Lazy expansion cells"), index.h("smoothly-table", { key: 'e42273100ca07053ac14e16e839b081e11a97a47' }, index.h("smoothly-table-row", { key: '64b6c0601ca90569f7f9a876f2f9f242b46b9aa2' }, index.h("smoothly-table-header", { key: '380b83357c4867232dbce95307cc7b0e3ee2de7d' }, "Company")), index.h("smoothly-table-row", { key: '56685669ebc4730c0dd890b3de5be051ca15f1fd' }, index.h("smoothly-table-expandable-cell", { key: '214757a42d4f8ce0fe37c221cadb779829b371a5' }, "Proquse", index.h("smoothly-lazy", { key: 'bb80c7a05470e41057342673a6b547bdff817dcc', slot: "detail", content: index.h("img", { src: "https://brand.proquse.com/logo/proquse-black.svg", alt: "Proquse Logotype." }) }))), index.h("smoothly-table-row", { key: 'be9de15d8056192c37679bc397884e0fad19de2b' }, index.h("smoothly-table-expandable-cell", { key: '37af6119e9357506e719601e0f02ba8026ebda6f' }, "Pax2Pay", index.h("smoothly-lazy", { key: '3c03393a59f61c77e5a54af377d3e38d0fcc85a1', slot: "detail", content: () => (index.h("img", { src: "https://dash.pax2pay.app/assets/pax2pay-dark-horizontal.svg", alt: "Pax2Pay Logotype." })) })))), index.h("h4", { key: 'a43e894a6af8b0beb4467fb7e626b8c1ffcb987c' }, "Demo table 11 - expandable cells"), index.h("smoothly-table", { key: 'e63bb694959e962e5f7044f1e7ebae8d83836630' }, index.h("smoothly-table-row", { key: 'f75ccc5a9bace58bd093cb3172e868cc9c4100ae' }, index.h("smoothly-table-header", { key: '9c389bc08a2cdb00cf9a834175b88ec14d2c7dee' }, "Name"), index.h("smoothly-table-header", { key: '585c069ee58522f4205bdfb2e51fdf44799a1d4b' }, "Age"), index.h("smoothly-table-header", { key: 'd47197237f7119d2bd4a89d67157691250e84761' }, "Location")), index.h("smoothly-table-row", { key: '4596285b471e280396bb5cd593d40017ffc6de29' }, index.h("smoothly-table-expandable-cell", { key: '3b6abf5cee5aad618b65a3fb0dc6eb06d09d23ff' }, "Jessie", index.h("div", { key: 'e505c3f2004f5c116c621e59bdbfcfe6beca283a', slot: "detail" }, "Doe")), index.h("smoothly-table-expandable-cell", { key: '958c8719cccb717f3453ad1042b8dca554b2eb7e' }, new Date().getFullYear() - 2000, index.h("div", { key: 'c9f7adc43fdfae17a3ceaad66683b566daa1b4c4', slot: "detail" }, "2000-01-01")), index.h("smoothly-table-expandable-cell", { key: '4cd1b333b9ec91af3d8e0f3453a1c44ca8ff5519' }, "UK", index.h("div", { key: 'd6966945a0ccde89223503e40b32fbc7482a3217', slot: "detail" }, "London"))))));
12449
+ return (index.h(index.Host, { key: '4d75a6bbda2339457dcccfdb3e5359ac811fd8fd' }, index.h("h4", { key: '565706c04d24d783034c63f28e54c8218df4f3a9' }, "Demo table 1: Filtered & Checked Table"), " ", index.h("smoothly-lazy", { key: '60822910e875796372b43352d9feff22bea153a0', content: index.h("smoothly-table-demo-filtered", null) }), index.h("h4", { key: '9df98423ebb70849e60266ef9848de29c34a97cf' }, "Demo table 2"), " ", index.h("smoothly-table-testing", { key: 'ad72f0c9c28183f7c73b60fa3ea48c032fb359ef' }), " ", index.h("h4", { key: '2fd86e82d10d9c699cc7bae5f7df6f821c4e9c25' }, "Demo table 3"), index.h("smoothly-table", { key: 'ead1eb8dbe9841b274f1cfefc784f26f5415e701' }, index.h("smoothly-table-row", { key: '567dc7014c17e15b943254f0eaa3fc0f93588615' }, index.h("smoothly-table-header", { key: '849a1bc10f5a16495def8917374bc627de78af22' }, "Header A"), index.h("smoothly-table-header", { key: '85fd2363c202975cbb30219c9fa8b3d741e61cd0' }, "Header B"), index.h("smoothly-table-header", { key: '4ee53183f4b1a77b9c3bb2a5068958f3df27a13a' }, "Header C"), index.h("smoothly-table-header", { key: '9a9cb1d1b2cb8252183ad7c1c113e0cb2a20310f' }, "Header D")), index.h("smoothly-table-row", { key: 'a0cdab27e7ff0a686601f5b8c581deeaa443062f' }, index.h("smoothly-table-expandable-cell", { key: '2cfa5ebc1522d3916ba3c73d09846c4957b99757' }, "normal row (exp.cell)", index.h("div", { key: 'b17bdace713635e508ae5654a4e208ebe1a55852', slot: "detail" }, "expandable cell 1 content")), index.h("smoothly-table-expandable-cell", { key: '4937605b3367b71b402b2fea4b88a867758eb2ba' }, "expandable cell", index.h("div", { key: '139e10e87077f131e4f49afeece05464c566ab89', slot: "detail" }, "expandable cell 2 content")), index.h("smoothly-table-expandable-cell", { key: 'e3df2d67065cc7f2ac9d2e42f4b7e623bf656843' }, "expandable cell", index.h("div", { key: 'df6307b76691f3ca87db71413c4b39fd90ab619c', slot: "detail" }, "expandable cell 3 content")), index.h("smoothly-table-expandable-cell", { key: '1c7efc477a22cb66a4ffeb55cb514d74a17e34b8' }, "expandable cell", index.h("div", { key: '09fb1975534d5f00ddbc00404182fffcc487ff8e', slot: "detail" }, "expandable cell 4 content"))), index.h("smoothly-table-row", { key: '847fc395a1216c6d6239a5c6e31788378e41a06b' }, index.h("smoothly-table-cell", { key: '282f7cb4e3555c593d37df0af4835bf29d77b543' }, "normal row (nor.cell)\""), index.h("smoothly-table-cell", { key: '0dec2f1ca7025caa7811b94e23504f366a915f25' }, "normal cell"), index.h("smoothly-table-expandable-cell", { key: '09425fc3be52c6a56e5dd5ecab75ec0a1c6563e4' }, "expandable cell", index.h("div", { key: 'ceae9f3be29b9f77e0980df2920ef46af49f9423', slot: "detail" }, "expandable cell details.")), index.h("smoothly-table-expandable-cell", { key: 'fa30c7d7323ce88e54ebeb36c2b7db498c5bfc91' }, "expandable cell", index.h("div", { key: '4fbb7089b92e9b6355a55d22256d4f26a7d26b1c', slot: "detail" }, "expandable cell details."))), index.h("smoothly-table-expandable-row", { key: 'cf37d3d0ddde0774a036faab21bb2a1b161fd2cf' }, index.h("smoothly-table-cell", { key: 'd50d52a23419aae1e18decdd556ff01698798d9a' }, "expandable row (nor.cell)"), index.h("smoothly-table-cell", { key: '68ec6b4925c74bccea4a300023adfad92b9ccc39' }, "Normal cell"), index.h("smoothly-table-cell", { key: 'c9fa755098e2f8866779b2173d35db01b91f081b' }, "normal cell"), index.h("smoothly-table-cell", { key: 'dc968923326834da3fdb84a4683b2aa83a7d14b9' }, "Normal cell"), index.h("div", { key: 'a4231e4f2a311ac13dfa1f0751153b0749fd768b', slot: "detail" }, "expandable row content"))), index.h("h4", { key: '6b9413fd4cfd0232722dab8c0086220d7de4f880' }, "Demo table 4"), index.h("smoothly-table", { key: 'b72c61724bf681b99b47cf47a7d518970bf29a3b' }, index.h("smoothly-table-row", { key: '48a4910318aa017c2e87e9251463966f31123d87' }, index.h("smoothly-table-header", { key: '74a418fd72e9ee42fed4037e9a1073fe9b994948' }, "Header A"), index.h("smoothly-table-expandable-cell", { key: 'eb43429edca1e385aa9bf3d2beaf86468b9040a5' }, "Header expansion", index.h("div", { key: 'e145061d6954d44e117513b0e275188d567c06f9', slot: "detail" }, "Expansion content"))), index.h("smoothly-table-expandable-row", { key: '174e0e8eb8540f0b9eba2b951df65d106facf604' }, index.h("smoothly-table-cell", { key: 'e5a71ca565e5f44ac5ecedd633158b735f0fe7e1' }, "A Content"), index.h("smoothly-table-cell", { key: '2799cdc6d78c24d5008f21336113ff7f51712a13' }, "Expansion cell"), index.h("div", { key: '4b1187ba13c0c7c1dc9e80118408c998fa552ae0', slot: "detail" }, index.h("smoothly-tab-switch", { key: 'f24ccfc3d7dee3449bc7c6db18bf67e51cd6ff1c' }, index.h("smoothly-tab", { key: 'f2840215bb198bb199b6fdf360c4a099e224fce3', label: "innertable 1", open: true }, index.h("smoothly-table", { key: 'ea50a861ae9d3c4c72643b405a6ead37ba99d8dc' }, index.h("smoothly-table-row", { key: 'a59d3e923e070aeb4478a0702ca8a668fef93a9a' }, index.h("smoothly-table-header", { key: '647f389fa707c5473ec9ab0399349c097da9fd1d' }, "Header B")), index.h("smoothly-table-expandable-row", { key: 'f6b1043b654059073ff426e325136ffca64d4956' }, "B Content"))), index.h("smoothly-tab", { key: '340f0879addcfb073e3db13e5dd7bd0e3aaa4075', label: "innertable 2" }, index.h("smoothly-table", { key: '6dcfe34730e9fcdea008f146e7d5756e1a61f686' }, index.h("smoothly-table-row", { key: '8602b8b672ff2f8419e48f5342e3a34a28e51baf' }, index.h("smoothly-table-header", { key: '30dfdd6045bff2ca268bf18f6776c0b1902f5b5e' }, "Header C")), index.h("smoothly-table-expandable-row", { key: '1deef22f36a9453767ba0abf71b956ad04696c29' }, index.h("smoothly-table-cell", { key: 'f662c003f4d67288aeb388ab927182ba6c7864e6' }, "C Content"))))))), index.h("smoothly-table-row", { key: '16b38e84a416929a4f88ca071d544b0fe10b1a0d' }, index.h("smoothly-table-cell", { key: '387b2ef88275ed0c44b84858a01f97f3b0ccc8cb' }, "A Content"), index.h("smoothly-table-expandable-cell", { key: '027279acb6ba0a6f5b80c4db72cab97dec09bc59' }, "Expandable cell", index.h("div", { key: '4e28f419d87501079e5934ddadf044a91db26c0c', slot: "detail" }, "Expansion content")))), index.h("h4", { key: 'b157a262703045efbabbf18d45a2ab865d5d117d' }, "Demo table 5"), index.h("smoothly-table", { key: 'b91df5c00f1096b79348a474804809556005b668' }, index.h("smoothly-table-row", { key: '9f44a30ab6fb6ac06650ac22a8763708f28cb95f' }, index.h("smoothly-table-header", { key: '088e7b725a4f35d405ba029c461e367b9dacabca' }, "A"), index.h("smoothly-table-header", { key: '02ba317d2ad1fce6f183d6706ce32a2169d1c2c9' }, "B")), index.h("smoothly-table-expandable-row", { key: '879ffd71485ba21e82b645daeb4788cbcc76c028' }, index.h("smoothly-table-cell", { key: 'e36ff9152ae876ec40d16cdc269b7a5f49ef09c1' }, "nested expandable row"), index.h("smoothly-table-cell", { key: 'f7a8822b65317d7f8e985338f38f47fbd3d2742f' }, "b row"), index.h("div", { key: '19c472d1663626ca4bf49ad73d2f81d574f5e13e', slot: "detail" }, index.h("smoothly-table", { key: '79ab194e1bef69e04621b77689951b8f1374b876' }, index.h("smoothly-table-row", { key: 'd4e4df6cd8d94f9c17ff6b4989726f0781132df0' }, index.h("smoothly-table-header", { key: '3e5358f360904a5300eef1dbdef304c5859824aa' }, "C"), index.h("smoothly-table-header", { key: '01a4187fc804759b43c1661484db0c34b1316f5f' }, "D")), index.h("smoothly-table-expandable-row", { key: 'ace0c19ee9ef7802efca61cbdce30e82d1b37741' }, index.h("smoothly-table-cell", { key: '02452b6171949863dcc262d6e3bcc33b17d8cc72' }, "c"), index.h("smoothly-table-cell", { key: '372f4f353b5afe4cc2fc16bc643b8a16e38fb8c5' }, "d"), index.h("div", { key: 'e32095b17716a819db416646e3f9c85b325a161e', slot: "detail" }, index.h("smoothly-table", { key: '80bf5968b5b6700067be7f9b31e5a8460fc068d9' }, index.h("smoothly-table-row", { key: '89afc84de5ebbcdf2f8a0cc396d3afc37ff79f61' }, index.h("smoothly-table-header", { key: '7681a5d6e758eec38a8afbf861d853f58641ca4e' }, "E"), index.h("smoothly-table-header", { key: '3fa1c073cace44d4a904a2355fc257f0eb3d636b' }, "F")), index.h("smoothly-table-expandable-row", { key: '4b6375d689b06ca9128f649885de0654f7982a7f' }, index.h("smoothly-table-cell", { key: '5b9a61dc4246954d460f53f051c0c2a0fdba0cb0' }, "e row"), index.h("smoothly-table-cell", { key: '05a02b0d9059bc4823e1b78fa96f790fbb083c15' }, "f row"), index.h("div", { key: '816b6a1e704b564c41644c6acbfef8b472a515a8', slot: "detail" }, "nested expandable row expansion e f")))))))), index.h("smoothly-table-expandable-row", { key: '5193e67450ab2ae63c87a149301a0dc66665e274' }, index.h("smoothly-table-cell", { key: 'cd68edfefe486b1a5ac65d6dfadc38768c4561d6' }, index.h("span", { key: '46b04030612537f57ddd6120b6fa29602971332b' }, "one"), index.h("span", { key: '1fc6d4c7cc7987396dc2b8783524cf735ff417e8' }, "two"), index.h("span", { key: 'e48250123ee9f5cafd954e29a6852ca366bcc786' }, "three")), index.h("smoothly-table-cell", { key: 'b078bbaeb5bc162b5bd239bd97768a2481b5d4d9' }, "five", index.h("smoothly-icon", { key: '8bdd45617561bc52f990d157904c2dbb2545fb6e', name: "paper-plane-sharp", size: "small" })), index.h("div", { key: 'a9965cf11e02fcf743987f4c29e7b87df48d70ac', slot: "detail" }, "four")), index.h("smoothly-table-row", { key: 'e3f52483f58e0b50b55504a65ceaaab887f595fc' }, index.h("smoothly-table-expandable-cell", { key: 'f6c1bb6602b8e52f960f2455e11fec00a53f48a3' }, index.h("span", { key: '57d652d10c30e8e2e2476a71d56f1fa845d7b8b3' }, "nested expandable cells"), index.h("div", { key: '55b4a2e151213f197c24ccd86336ad805839c89a', slot: "detail" }, index.h("smoothly-table", { key: 'cb9c535103f77df6ac615b6bfad7ba3a22ac7a13' }, index.h("smoothly-table-row", { key: 'ad81ccfcea8e06348e87fd804910c41f977341da' }, index.h("smoothly-table-header", { key: '5926bfeb6c1168450e99e373942cc4a96b8c2b06' }, "E"), index.h("smoothly-table-header", { key: '7bcf13500a7870fb343f1b2b2d2477a1bf60fe26' }, "F")), index.h("smoothly-table-row", { key: '2cf863787a43fe522cbeaaeac679fd37abd42f22' }, index.h("smoothly-table-expandable-cell", { key: '86efe2a1258e04deba4e5b88acba8fdb9e272a70' }, "e cell", index.h("div", { key: '64e96d3792939ec4d86269e6873c0825083523c6', slot: "detail" }, index.h("smoothly-table", { key: 'b972ea1324f4508d7a6882ccf9780bd9a1d943b6' }, index.h("smoothly-table-row", { key: '74735f09f56384da5a74b2434bf28a47d8183be5' }, index.h("smoothly-table-header", { key: 'bdb5b8d7fca758b570a4530c73ce2120559ea02f' }, "G"), index.h("smoothly-table-header", { key: '9330353a33d4106428243daca956d8d801264259' }, "H")), index.h("smoothly-table-row", { key: '106dd11ed14b739565dcf0f12b11b955d82f8f87' }, index.h("smoothly-table-expandable-cell", { key: '7607860201c9036188d69813b2e5ca7b286b95e9' }, "g cell", index.h("div", { key: 'c5a9fa9dd96f0e5b83035e49aed09493264c4a57', slot: "detail" }, "nested expandable cell expansion g")), index.h("smoothly-table-expandable-cell", { key: '795c298d223a63012486edfffcad1e62cf92fc1d' }, "h cell", index.h("div", { key: '7c66648d032ba2bc9385a67d6e18b81387fa1f6b', slot: "detail" }, "nested expandable cell expansion h")))))), index.h("smoothly-table-expandable-cell", { key: '4ebb724a71c53e83f5f524169194de7120e6693e' }, "f cell", index.h("div", { key: '14438cef2d3a28ea25f84175b7ff2c48b364a252', slot: "detail" }, "nested expandable cell expansion f")))))), index.h("smoothly-table-expandable-cell", { key: 'd6148997d2dddbef5fe0089767d865f8b46d2c32' }, "b cell", index.h("div", { key: '08ff0f926febf4df68b8fbaafb9a03a4065f40ec', slot: "detail" }, index.h("smoothly-table", { key: 'f5c9200e21a38a8f4260845d2e5ff5839d394885' }, index.h("smoothly-table-row", { key: '243fdc3cafe492df63fac1e75ed8e94e280a4273' }, index.h("smoothly-table-header", { key: 'fc149cdadf6ea763bd57dfdf73eae0fb0c04ff60' }, "C"), index.h("smoothly-table-header", { key: '4a84549ed920f1edd97308deaccaaca4e0bd4858' }, "D")), index.h("smoothly-table-row", { key: 'db4c5364ff1bbacde700ca35b96c658851462bac' }, index.h("smoothly-table-expandable-cell", { key: '1fd4f8987f70b6802a5df708d1d53a149739f240' }, "c cell", index.h("div", { key: '4655d25f2d3e5d26ddf7133ba0f6858d441453c4', slot: "detail" }, "nested expandable cell expansion c")), index.h("smoothly-table-expandable-cell", { key: 'df0733668bd098af635888a62a08eccfd4864554' }, "d cell", index.h("div", { key: 'd5ce1ae1235118767cd88c18342c74bd50d2e563', slot: "detail" }, "nested expandable cell expansion d")))))))), index.h("h4", { key: '78955bf3f6aa98b689849d2f8f986b119e5a0813' }, "Demo table 6"), index.h("smoothly-table", { key: 'b2e59918d985365b87dff9f00241af2279f27f41' }, index.h("smoothly-table-row", { key: 'c9225ee001bfb36906ea6d076b76ecefb3ce580f' }, index.h("smoothly-table-header", { key: '7d7c60855e8afc22607d32abd1778e99437a8069' }, "display"), index.h("smoothly-table-header", { key: '0a56ea94a5db7071038c0ac61175ed24e6cb7962' }, "contents")), index.h("smoothly-table-expandable-row", { key: '9a8332b23170188708c7a8546a0776bcf17c68f9' }, index.h("div", { key: '3a62af807ad1d34bd80b1d8c82013f869bda17fb', class: "content" }, index.h("smoothly-table-cell", { key: '41aa0fed8911f34f08e4b1f5126616eddb0efb5c' }, "A"), index.h("smoothly-table-cell", { key: '8b1454d6e64b2f34088deec5bfc76bdc1f81dc14' }, "B")), index.h("div", { key: '8523ca12289bbd501a269f7693715e3b33ce7c1d', slot: "detail" }, "expansion"))), index.h("h4", { key: '65baf660733eb3273aa1fc45c8400e7a9fe8a055' }, "Demo table 7"), " ", index.h("span", { key: '055a8441595bac3d7aed30efb7db55d0f749822b' }, "nested 1 then normal"), index.h("smoothly-table", { key: '7874ca1d5010352be7f8f10ea68016a541b5976f' }, index.h("smoothly-table-row", { key: '375ab7dbe17805ab0d8b448951ece6e4ab50eff1' }, index.h("smoothly-table-header", { key: '8914c7a64ef476075e75a616d917d123b552ba11' }, "A"), index.h("smoothly-table-header", { key: '0826d6e33e00e8a02523a39dda6c3d97a53acd01' }, "B")), index.h("smoothly-table-expandable-row", { key: '17bd4571f1dd0493ecb66dd644cd17cacca04b2a' }, index.h("smoothly-table-cell", { key: '8ffbb19e69b87e738e394d2a69e94d5864c978ab' }, "a"), index.h("smoothly-table-cell", { key: '111baa59e84b8ad619b9b097bddecadaa221bdb8' }, "b"), index.h("div", { key: '60ef6c239a698e2564ddc253911881a387eea519', slot: "detail" }, index.h("smoothly-table", { key: 'fe098287c9800264ecb789607ef38edfc4918c84' }, index.h("smoothly-table-row", { key: 'cf503bc0464f7f2ac3583a75ebcc0c638f5aa86d' }, index.h("smoothly-table-header", { key: '38217c3c06fc803dda2a32e9b558bf25791aa568' }, "C"), index.h("smoothly-table-header", { key: 'e6db1eca207221b55aed373c68d9d4f35c1b555a' }, "D")), index.h("smoothly-table-row", { key: '46d4575bcb85e32f6992edf44f8718573d2e62c2' }, index.h("smoothly-table-cell", { key: '4d00d9ae3e0e15147ce3b697e82f39cf06688e3d' }, "c"), index.h("smoothly-table-cell", { key: 'efd070f1822b059cb0284eb40ae09fa85ce02b5c' }, "d")), index.h("smoothly-table-row", { key: '0df1266570321720b48cc136d3471880dd483968' }, index.h("smoothly-table-cell", { key: 'baf6166809e44f708b7452ff0939cce4db0f998e' }, "ccc"), index.h("smoothly-table-cell", { key: '800f5c0f8d13c89d8cfa1d867f49e0ddb7f45603' }, "ddd")), index.h("smoothly-table-expandable-row", { key: 'ac83767933ef61081b3c28abacf30cd7346e0917' }, index.h("smoothly-table-cell", { key: 'f54da1c32cec055852402ce50e5507f63901a63f' }, "cccc"), index.h("smoothly-table-cell", { key: 'e9598a3d6e95c2489684a1e0aaf753bd8b320894' }, "dddd"), index.h("div", { key: 'd09cc1d8f0785d86c2ff17679ef9fc370762ba89', slot: "detail" }, "CONTENT")), index.h("smoothly-table-row", { key: 'd50df933a3a1a6a5b10be2191578ed5d879acee8' }, index.h("smoothly-table-cell", { key: '169f3e4a94bbae4f9b575af802d602b854389032' }, "ccccc"), index.h("smoothly-table-cell", { key: '713b6741813970dfa9f36ac6b61e01f3daed0a24' }, "ddd")), index.h("smoothly-table-expandable-row", { key: 'e9c26b2d16666ec6fbde1cf50c248ffa6d7fa418' }, index.h("smoothly-table-cell", { key: 'e335e1560b40f7085edf255b9c636a17a4a034c9' }, "cccc"), index.h("smoothly-table-cell", { key: 'b8426a925ddbfb192ff3df0c3659e9a3b50f0bf6' }, "dddd"), index.h("div", { key: 'e181097e31f64856395c61c9499e605444d0e034', slot: "detail" }, "CONTENT")))))), index.h("h4", { key: 'a28acb2c3a30dfd4d469557ab5ae325b7198a607' }, "Demo table 8"), " ", index.h("span", { key: '56bfbd9cb3a897ccf6cfd42a614c3e937223b43f' }, "not nested"), index.h("smoothly-table", { key: 'fda13210a7e5ea36a33e0f44b12b25905e302808' }, index.h("smoothly-table-row", { key: '63e9610a78dfbc329c9bc26d4e416998d7e6237a' }, index.h("smoothly-table-header", { key: '20600d28fcaa6ba3a6a275008a863ca8148ac0fb' }, "C"), index.h("smoothly-table-header", { key: '3d7fa4c1729eaca33fffadedec9914f6da271017' }, "D")), index.h("smoothly-table-row", { key: '6236fcfe58f09309a7fd522d177d2bd33e7a0ab9' }, index.h("smoothly-table-cell", { key: '67a7d31d6aa3d116ebe0a88a5e8f584c2285333a' }, "c"), index.h("smoothly-table-cell", { key: '2f5a1d93eadc9b96dfd3aad8ba91d2696c3055e1' }, "d")), index.h("smoothly-table-row", { key: 'fb2736306cf978aa89dde85bf792e21c746765f8' }, index.h("smoothly-table-cell", { key: 'c069426cda86081182906813b121a84039f9a04a' }, "cc"), index.h("smoothly-table-cell", { key: '01fc6c252bdc06c012cdb0537c65eb706a10212f' }, "dd")), index.h("smoothly-table-row", { key: '165d917a082ec87033b3ed9d28b6aa6acb5c6417' }, index.h("smoothly-table-cell", { key: 'f820c8c1492086af2dc1083a3904d75cbbd83169' }, "ccc"), index.h("smoothly-table-cell", { key: '9d04ce5f411f1dfc84a1243c7f310a99921c121d' }, "ddd"))), index.h("h4", { key: '78613924411ff0be89ce90aed26dc136852a1e64' }, "Demo table 9"), index.h("smoothly-table", { key: '5aeb337045c88746c907f410ee575b9bcaa9ea27' }, index.h("smoothly-table-row", { key: 'e98d4dcf9c6116837a17a9f38d4d0e435c463d84' }, index.h("smoothly-table-header", { key: '70f4c22617686211b39084f2996a910ab8eee19c' }, "First name"), index.h("smoothly-table-header", { key: 'e48b12ba18d328d2742864f7fca90cf8e8df646b' }, "Last name"), index.h("smoothly-table-header", { key: 'efec65c1f52cc5e98a316154c604d0aa15106542', style: { width: "1px" } }, index.h("smoothly-icon", { key: 'c44853f1aae338b249624251ac7fd836c93b838b', name: "alert-outline" }))), index.h("smoothly-table-expandable-row", { key: 'c6930ebe7f156d515a701e3a8155d8cb9d360766' }, index.h("smoothly-table-cell", { key: 'fd63067bbe70e5458b9a2ddaa357d3486563026d' }, "Jessie"), index.h("smoothly-table-cell", { key: '7fdd0e7dfbf930d84374fb7151c75fe28343b5c4' }, "Doe"), index.h("smoothly-table-cell", { key: 'c61fc89306ac778353f43bfd49a75087f15a4495' }), index.h("div", { key: '280796257c2e5f2a063939da3bab4b5a77542d70', slot: "detail" }, index.h("p", { key: 'e4140e8363996bc92a84d498baad2ebdaa001e81' }, "This is Jessie")))), index.h("h4", { key: 'a308341362afb08052af53bfe0eeda963671f2d7' }, "Demo table 9 - Lazy expansion rows"), index.h("smoothly-table", { key: '3f9d7af3e1778e091d31c2c9fefc9d616a6c60a6' }, index.h("smoothly-table-row", { key: '60ad913bd394abcd83a2000d779c76222def9e1c' }, index.h("smoothly-table-header", { key: '4f0710e9724526ec1123e96d5feed564878b3762' }, "Company")), index.h("smoothly-table-expandable-row", { key: 'd0f39b09c7fbcbe67423799836fa0f45c13efa17' }, index.h("smoothly-table-cell", { key: '18dc6162fb8b0917b30c1ca32e8628700536669d' }, "Proquse"), index.h("smoothly-lazy", { key: '44780a800166f2288e1ccbd781305c5d1acd6256', slot: "detail", content: index.h("img", { src: "https://brand.proquse.com/logo/proquse-black.svg", alt: "Proquse Logotype." }) })), index.h("smoothly-table-expandable-row", { key: '60161028cb03261e40922dcdadbc6c76d8c8b4ec' }, index.h("smoothly-table-cell", { key: '804f920e49c7bb7588b3e3914a1baf39538338a7' }, "Pax2Pay"), index.h("smoothly-lazy", { key: '9e88e2f562dc88f4a0f2c206b31575deaafe7c7b', slot: "detail", content: () => (index.h("img", { src: "https://dash.pax2pay.app/assets/pax2pay-dark-horizontal.svg", alt: "Pax2Pay Logotype." })) }))), index.h("h4", { key: '05e29e47065dfe1f6fc03c7f62e6d851ca599793' }, "Demo table 10 - Lazy expansion cells"), index.h("smoothly-table", { key: '3ee0be5c6663458bf8f6bdd6dec1ebf876c85567' }, index.h("smoothly-table-row", { key: '9d2a06dd1d27e2cd69ec74353a0855d1fde6ab97' }, index.h("smoothly-table-header", { key: '24bcfb658bbd342881cabab291247695484a1f62' }, "Company")), index.h("smoothly-table-row", { key: 'e2fb2d3aad701e89e4e1f1f11f6288103cddca46' }, index.h("smoothly-table-expandable-cell", { key: '698d75cc90b0ecaf056fb165fc6482c7d72d1636' }, "Proquse", index.h("smoothly-lazy", { key: 'f74d1d00c8842fb89a6fe0867d0c134da50c22fb', slot: "detail", content: index.h("img", { src: "https://brand.proquse.com/logo/proquse-black.svg", alt: "Proquse Logotype." }) }))), index.h("smoothly-table-row", { key: '3c1545ccf09e0bda5ba27f07341cebaf44d51b1e' }, index.h("smoothly-table-expandable-cell", { key: 'dd0736cffce96cce69bbaf3bcba1e278d6c9ffd6' }, "Pax2Pay", index.h("smoothly-lazy", { key: '026f7c8d2a40a8c3c0b089e1c57e7571abfca4e9', slot: "detail", content: () => (index.h("img", { src: "https://dash.pax2pay.app/assets/pax2pay-dark-horizontal.svg", alt: "Pax2Pay Logotype." })) })))), index.h("h4", { key: '6642d61a7ed37ae26c7eb6d63f0ac820a8d8462b' }, "Demo table 11 - expandable cells"), index.h("smoothly-table", { key: 'ed81c44f6a494c3c223433c76fba88635d400c47' }, index.h("smoothly-table-row", { key: '3c3c6287d0d82d733bec8a85095229c1b84ab902' }, index.h("smoothly-table-header", { key: '54434837620161815440c1d1d8050c5b350d4399' }, "Name"), index.h("smoothly-table-header", { key: '3cb0ed2cd8c0938f4b22474eeb7140a386ec60b1' }, "Age"), index.h("smoothly-table-header", { key: '7c28485362b0e7c7de97dc1e1dd534a1f5f47ade' }, "Location")), index.h("smoothly-table-row", { key: '433324a6fe43ff2536d820e6b628a8ab7de1b67a' }, index.h("smoothly-table-expandable-cell", { key: 'edfcf4adc703947972fc9ee7ff5869a7d69190f6' }, "Jessie", index.h("div", { key: '33279c406692ee816e52c1a35cd40ebfbf8e53f9', slot: "detail" }, "Doe")), index.h("smoothly-table-expandable-cell", { key: 'a742c3624ca05d00dc5e71cbe00840ad9cbd5108' }, new Date().getFullYear() - 2000, index.h("div", { key: '50d84db55d267b7a7be5fe2d1999fe018b73a0c4', slot: "detail" }, "2000-01-01")), index.h("smoothly-table-expandable-cell", { key: 'fc91ae7f97ddf88ba658f54821be8af1f99008db' }, "UK", index.h("div", { key: 'ab0596814c4524a8b64c091ddbb9120c25b49bd4', slot: "detail" }, "London"))))));
12419
12450
  }
12420
12451
  };
12421
12452
  TableDemo.style = SmoothlyTableDemoStyle0;
@@ -12449,18 +12480,18 @@ const TableDemoFiltered = class {
12449
12480
  }
12450
12481
  render() {
12451
12482
  const cats = this.cats && filter(this.criteria, this.cats);
12452
- return (index.h(index.Host, { key: '74d8a3b771e113d5ca2b89f9ce6daeaacd51ae40' }, index.h("smoothly-filter", { key: '7dfebb10b3aa9727c5676cd73423ce404530b94f' }, index.h("smoothly-filter-toggle", { key: '2a80d59713845db048dd3f2b49bf5320da0f4020', properties: { ["nested.pattern"]: "Ticked", breed: "" }, icon: "add", toolTip: "Nested Ticked", slot: "bar" }), index.h("smoothly-filter-toggle", { key: '5099ce34d39e89d4a2aaa97a45e6c8df8d581138', properties: { pattern: "Ticked", breed: "" }, icon: "paw", toolTip: "Ticked cats", slot: "bar" }), index.h("smoothly-filter-toggle", { key: 'a3224462cfec87135d5394d2337f1f606a1c9631', properties: { breed: "Bombay", pattern: "Solid" }, icon: "radio-button-on", toolTip: "Solid bombay cats", slot: "bar" }), index.h("smoothly-filter-toggle", { key: '032df107748c093d14aa4209a09d57e79f8b24a8', properties: { pattern: "Colorpoint" }, not: true, active: true, icon: "alert", toolTip: "Colored cats", slot: "bar" }), index.h("smoothly-filter-select", { key: 'cdb268d230fc3593cd37349c5d3e119e3a69008f', label: "coat", property: "nested.coat", slot: "bar", multiple: false }, this.cats &&
12483
+ return (index.h(index.Host, { key: '1632fc896a3c14cc68145cd77166797806651f60' }, index.h("smoothly-filter", { key: '71928ac255e71c6f035830270e202c47cabc8f3a' }, index.h("smoothly-filter-toggle", { key: '61062e4add68ba020b9244af36e8736d9e78a4f9', properties: { ["nested.pattern"]: "Ticked", breed: "" }, icon: "add", toolTip: "Nested Ticked", slot: "bar" }), index.h("smoothly-filter-toggle", { key: '9e6f2d11d6f86352ec1476185d68e961db6914ac', properties: { pattern: "Ticked", breed: "" }, icon: "paw", toolTip: "Ticked cats", slot: "bar" }), index.h("smoothly-filter-toggle", { key: '6847c4f187c08912bebbd1fcb690d1f7a9f2ab31', properties: { breed: "Bombay", pattern: "Solid" }, icon: "radio-button-on", toolTip: "Solid bombay cats", slot: "bar" }), index.h("smoothly-filter-toggle", { key: '836571ad9e00e96e3c97b1b615ff3e1fc08ccd27', properties: { pattern: "Colorpoint" }, not: true, active: true, icon: "alert", toolTip: "Colored cats", slot: "bar" }), index.h("smoothly-filter-select", { key: '6b04421955de238e2263323fca0867a7e12a42e2', label: "coat", property: "nested.coat", slot: "bar", multiple: false }, this.cats &&
12453
12484
  Object.values(this.cats.reduce((r, cat) => (cat.nested ? Object.assign(Object.assign({}, r), { [cat.nested.coat]: cat }) : r), {})).map(cat => {
12454
12485
  var _a;
12455
12486
  return ((_a = cat.nested) === null || _a === void 0 ? void 0 : _a.coat) && (index.h("smoothly-item", { slot: "items", value: cat.nested.coat }, cat.nested.coat));
12456
- })), index.h("div", { key: 'ee3325e8c5a57a90e3b5dc3ef2cc311d80b085ce', slot: "detail" }, index.h("smoothly-form", { key: '2ce7fce28ce4cd7791b7f2164b9f8b9f2d3b62f4', looks: "border" }, index.h("smoothly-filter-select", { key: '6b9a30ac80d0ae5b16a446a69264b6a964e2e0aa', label: "coat", property: "nested.coat", multiple: true }, this.cats &&
12487
+ })), index.h("div", { key: '63609e5156d7a3761ed7fd421ed863681c4d7b5d', slot: "detail" }, index.h("smoothly-form", { key: '44b78b0d4e2781ac620f66b03ca4032440caed48', looks: "border" }, index.h("smoothly-filter-select", { key: 'f401a2d1bfb0484a726a4e25dc17be7c88a5c51e', label: "coat", property: "nested.coat", multiple: true }, this.cats &&
12457
12488
  Object.values(this.cats.reduce((r, cat) => (cat.nested ? Object.assign(Object.assign({}, r), { [cat.nested.coat]: cat }) : r), {})).map(cat => {
12458
12489
  var _a;
12459
12490
  return ((_a = cat.nested) === null || _a === void 0 ? void 0 : _a.coat) && (index.h("smoothly-item", { slot: "items", value: cat.nested.coat }, cat.nested.coat));
12460
- })), index.h("smoothly-filter-select", { key: '56d84756ae3edff2c3121a43893cc5172e7996bb', label: "breed", property: "breed", multiple: false }, this.cats &&
12461
- Object.values(this.cats.reduce((r, cat) => (cat.breed ? Object.assign(Object.assign({}, r), { [cat.breed]: cat }) : r), {})).map(cat => cat.breed && (index.h("smoothly-item", { slot: "items", value: cat.breed }, cat.breed)))), index.h("smoothly-filter-select", { key: '4b8c42aedee0c60ddaa177ae9e7122621063c743', label: "names", property: "nested.names", multiple: true, type: "array" }, Object.keys(Object.values(names)
12491
+ })), index.h("smoothly-filter-select", { key: '786a00cd3d90c73583c65602d0ae92561fa0412a', label: "breed", property: "breed", multiple: false }, this.cats &&
12492
+ Object.values(this.cats.reduce((r, cat) => (cat.breed ? Object.assign(Object.assign({}, r), { [cat.breed]: cat }) : r), {})).map(cat => cat.breed && (index.h("smoothly-item", { slot: "items", value: cat.breed }, cat.breed)))), index.h("smoothly-filter-select", { key: '93c389248f5b02b23e08ec7009e341247bb0d975', label: "names", property: "nested.names", multiple: true, type: "array" }, Object.keys(Object.values(names)
12462
12493
  .flat()
12463
- .reduce((r, name) => (Object.assign(Object.assign({}, r), { [name]: true })), {})).flatMap(name => (index.h("smoothly-item", { slot: "items", value: name }, name)))), index.h("smoothly-filter-input", { key: 'ac17a9ab17d55e8f1a5a1143a4cc3fe7547c2d6f', label: "Coat", property: "coat" }), index.h("smoothly-filter-input", { key: 'fa2f2ae6cbe1926d389edc86c77d1c90a3119533', label: "Nested Coat", property: "nested.coat" })))), !cats ? ("Failed to load data.") : (index.h("smoothly-table", null, index.h("smoothly-table-row", null, index.h("smoothly-table-header", null, this.selector.render(cats)), index.h("smoothly-table-header", null, "Breed"), index.h("smoothly-table-header", null, "Coat"), index.h("smoothly-table-header", null, "Price")), cats.map(cat => (index.h("smoothly-table-row", null, index.h("smoothly-table-cell", null, this.selector.render(cat)), index.h("smoothly-table-expandable-cell", null, cat.breed, index.h("div", { slot: "detail" }, "Country: ", cat.country)), index.h("smoothly-table-expandable-cell", null, cat.coat, index.h("div", { slot: "detail" }, "Pattern: ", cat.pattern)), index.h("smoothly-table-cell", null, index.h("smoothly-display", { type: "price", value: cat.price, currency: "SEK" }))))), index.h("smoothly-table-footer", null, index.h("td", { colSpan: 5 }, index.h("smoothly-display", { type: "text", value: `Selected: ${this.selector.selected.length != 0 ? this.selector.selected.length : cats ? cats.length : "?"}` })))))));
12494
+ .reduce((r, name) => (Object.assign(Object.assign({}, r), { [name]: true })), {})).flatMap(name => (index.h("smoothly-item", { slot: "items", value: name }, name)))), index.h("smoothly-filter-input", { key: '0046e17476642a0cd4fecdc1030e9eb2aba04bfe', label: "Coat", property: "coat" }), index.h("smoothly-filter-input", { key: '801fa97acd8ec50530304b1cd0a964d2a01d46eb', label: "Nested Coat", property: "nested.coat" })))), !cats ? ("Failed to load data.") : (index.h("smoothly-table", null, index.h("smoothly-table-row", null, index.h("smoothly-table-header", null, this.selector.render(cats)), index.h("smoothly-table-header", null, "Breed"), index.h("smoothly-table-header", null, "Coat"), index.h("smoothly-table-header", null, "Price")), cats.map(cat => (index.h("smoothly-table-row", null, index.h("smoothly-table-cell", null, this.selector.render(cat)), index.h("smoothly-table-expandable-cell", null, cat.breed, index.h("div", { slot: "detail" }, "Country: ", cat.country)), index.h("smoothly-table-expandable-cell", null, cat.coat, index.h("div", { slot: "detail" }, "Pattern: ", cat.pattern)), index.h("smoothly-table-cell", null, index.h("smoothly-display", { type: "price", value: cat.price, currency: "SEK" }))))), index.h("smoothly-table-footer", null, index.h("td", { colSpan: 5 }, index.h("smoothly-display", { type: "text", value: `Selected: ${this.selector.selected.length != 0 ? this.selector.selected.length : cats ? cats.length : "?"}` })))))));
12464
12495
  }
12465
12496
  };
12466
12497
  const names = {
@@ -12516,7 +12547,7 @@ const TableExpandableCell = class {
12516
12547
  event.detail(this.element);
12517
12548
  }
12518
12549
  render() {
12519
- return (index.h(index.Host, { key: 'c1cc9c453f14bdbea27288cb630149bed4eedc10' }, index.h("div", { key: '8bff096be0f15b0529d51601d107875a50587a26' }, index.h("smoothly-icon", { key: 'a50afa90d33988bbd43425175f628c2732f9f208', name: "caret-forward-outline" }), index.h("slot", { key: '54a354b62524a00094c29bc46d2e18cd449d204f' })), index.h("tr", { key: 'cd464fb9f1e5bbd547faecacfc624bf11a17e80a', class: { spotlight: this.spotlight }, ref: e => (this.expansionElement = e) }, index.h("td", { key: '09ebc1b71d570b78e9d38f5ac572eca15d737f9b', colSpan: 999 }, index.h("slot", { key: '8e156248148b0625480ac212163d51ceef8a29e1', name: "detail" })))));
12550
+ return (index.h(index.Host, { key: 'b0722ac2b5894d6a08ff86f9ae8cb6ab6e573320' }, index.h("div", { key: 'a9472d042e9bdac9c0bb0c841023bd19c2d6f283' }, index.h("smoothly-icon", { key: '953239cf1296bbe7e0bf3ff2fd2b2876bbf45fc4', name: "caret-forward-outline" }), index.h("slot", { key: '684f2f1e4d9a670ffe43a99a5f2f7453df0f0563' })), index.h("tr", { key: 'c3237dd2b3c948468f5431e376112c9c7567ab8b', class: { spotlight: this.spotlight }, ref: e => (this.expansionElement = e) }, index.h("td", { key: '8575d321597bef075866fd0aa0f7eb412935612d', colSpan: 999 }, index.h("slot", { key: '55b5610313b8f6363c03ce8de3d46e8dad35ca8b', name: "detail" })))));
12520
12551
  }
12521
12552
  get element() { return index.getElement(this); }
12522
12553
  static get watchers() { return {
@@ -12552,7 +12583,7 @@ const TableExpandableRow = class {
12552
12583
  event.detail(this.element);
12553
12584
  }
12554
12585
  render() {
12555
- return (index.h(index.Host, { key: '68f734852bf19b3f0859a2d2bf1b695ad807de7d' }, index.h("div", { key: '1fe5bbcc7249106a3c719d83c4d0023654812e3f', onClick: () => (this.open = !this.open) }, index.h("slot", { key: 'f579e90c39134fe4ff0ef95a30b4a5c2fc20c13f' })), index.h("tr", { key: '07c64f1cba0b59d0d17c1509dec1ec951dee637e', class: { spotlight: this.spotlight } }, index.h("td", { key: '67d991e9fb53eae60a3b1b71aa40cfb72dfb39d5', colSpan: 999 }, index.h("slot", { key: 'a10e429dd2b99ace26ac9ed67f4860889ab3bb4a', name: "detail" })))));
12586
+ return (index.h(index.Host, { key: '3bcc97ed6e2791b5d2e499e4778f805afd6c3796' }, index.h("div", { key: '1c0f055d551ee74869a171754f436b466fe5c582', onClick: () => (this.open = !this.open) }, index.h("slot", { key: 'df24e386c9c906b4745bb66aa6b16bcb4059143e' })), index.h("tr", { key: 'c6b08fde5babec71465abb1caef4c06bc5b0f8bc', class: { spotlight: this.spotlight } }, index.h("td", { key: 'db3d0590cb43229ea3ca2000cfdd004f489b8272', colSpan: 999 }, index.h("slot", { key: '9222f690b82eba97520741877948e3f4a7504642', name: "detail" })))));
12556
12587
  }
12557
12588
  get element() { return index.getElement(this); }
12558
12589
  static get watchers() { return {
@@ -12570,7 +12601,7 @@ const TableFooter = class {
12570
12601
  index.registerInstance(this, hostRef);
12571
12602
  }
12572
12603
  render() {
12573
- return index.h("slot", { key: 'e9bbaf0fb7f645dba139a78a5233ab5188438165' });
12604
+ return index.h("slot", { key: '92ae107645e77eaaae9d40d06966e5662c83b914' });
12574
12605
  }
12575
12606
  };
12576
12607
  TableFooter.style = SmoothlyTableFooterStyle0;
@@ -12584,7 +12615,7 @@ const TableHeader = class {
12584
12615
  this.name = undefined;
12585
12616
  }
12586
12617
  render() {
12587
- return (index.h(index.Host, { key: '309ad66fa298fbe62b1925f29626f56fea9ca29c' }, index.h("slot", { key: 'e57b9b6e864950961ead1064796d6067aec6b995' })));
12618
+ return (index.h(index.Host, { key: '394a454ddc969c87033825a058beac227325dc73' }, index.h("slot", { key: '035d027bb935e244b867ba39b16466cc6a0db7c5' })));
12588
12619
  }
12589
12620
  };
12590
12621
  TableHeader.style = SmoothlyTableHeaderStyle0;
@@ -12614,7 +12645,7 @@ const TableRow = class {
12614
12645
  (_a = this.element) === null || _a === void 0 ? void 0 : _a.after(event.detail);
12615
12646
  }
12616
12647
  render() {
12617
- return (index.h("div", { key: '999ef425b1c6bbbf716658b0641d68e61e68752d', ref: e => (this.element = e) }, index.h("slot", { key: 'e60687a313d183a62b918225abcb30416e55acd8' })));
12648
+ return (index.h("div", { key: '2a76ac0241c79e325b487e9ca92b62fbec6dc6e1', ref: e => (this.element = e) }, index.h("slot", { key: 'a49794e5574311a4402263818ac177e32ad21fe5' })));
12618
12649
  }
12619
12650
  };
12620
12651
  TableRow.style = SmoothlyTableRowStyle0;
@@ -12656,7 +12687,7 @@ const SmoothlyTableTesting = class {
12656
12687
  this.counter = 0;
12657
12688
  }
12658
12689
  render() {
12659
- return (index.h(index.Host, { key: 'e415a54d0679bdadf321a1b610b8a29998b36105' }, index.h("smoothly-table", { key: '976eb7e5682d8fdb22f73ce1e4b7d119a106487d', color: "dark" }, index.h("smoothly-table-row", { key: '179a1e72e5ed3f042345da24b6e1a903900b72a8' }, index.h("smoothly-table-header", { key: '5a88e049f57b38d6185b4b7298438555bc14596c' }, "Type"), index.h("smoothly-table-header", { key: '49be12dad2477ba195db63844064f3f00f7cbf85' }, "Name"), index.h("smoothly-table-header", { key: '67f896c78fa8909fb9f2df30dfdb05d8525fe1ac' }, "Age")), data.map(animal => (index.h("smoothly-table-expandable-row", null, index.h("smoothly-table-cell", null, animal.type), index.h("smoothly-table-cell", null, animal.name), index.h("smoothly-table-cell", null, animal.age), index.h("smoothly-form", { slot: "detail", onSmoothlyFormSubmit: () => this.counter++, looks: "line" }, index.h("smoothly-input", { value: animal.type }, "Type"), index.h("smoothly-input", { value: animal.name }, "Name"), index.h("smoothly-input", null, animal.age), index.h("smoothly-submit", { slot: "submit" }, "Submit!"))))), data.map(animal => (index.h("smoothly-table-row", null, index.h("smoothly-table-cell", null, animal.type), index.h("smoothly-table-expandable-cell", null, animal.name, index.h("smoothly-form", { slot: "detail", onSmoothlyFormSubmit: () => this.counter++, looks: "line" }, index.h("smoothly-input", { value: animal.name }, "Name"), index.h("smoothly-submit", { slot: "submit" }, "Submit!"))), index.h("smoothly-table-expandable-cell", null, animal.age, index.h("smoothly-form", { slot: "detail", onSmoothlyFormSubmit: () => this.counter++, looks: "line" }, index.h("smoothly-input", { value: animal.type }, "Type"), index.h("smoothly-input", { value: animal.name }, "Name"), index.h("smoothly-input", null, animal.age), index.h("smoothly-submit", { slot: "submit" }, "Submit!")))))), index.h("smoothly-table-footer", { key: '86996e2c769ebf0c8f9dc45531ebdb6702683169' }, index.h("td", { key: 'ba0671a9359fe871d17e4aa996ef95948a2aa94e', colSpan: 2 }, index.h("div", { key: '136bd8a0df0c3d205f267c827d50eda0cf87356b', class: "footer" }, "Currently viewing content from:", index.h("smoothly-display", { key: '16e4d70da4dc1800c311cd36c146305463da32f2', type: "date", value: "2023-10-12" }))), index.h("smoothly-table-header", { key: 'd251a3788a9ed808b7775070ad77e875fe76c067' }, "Total age: " + data.reduce((r, a) => r + a.age, 0))))));
12690
+ return (index.h(index.Host, { key: '1085f1696d6d7e66bcaa5c72bf8af0fe9531ac5f' }, index.h("smoothly-table", { key: '7b7f1826e75d45446577204794385c3a15afbca2', color: "dark" }, index.h("smoothly-table-row", { key: '47c1266d3b1b894d1ae987ffb6fdcb4023e5707b' }, index.h("smoothly-table-header", { key: '54076867bbe8ecbbda6bbd883b6f991a35b717c9' }, "Type"), index.h("smoothly-table-header", { key: 'ad2ec2b46aacbaeb6047a269a29ba285b0777e00' }, "Name"), index.h("smoothly-table-header", { key: 'dfa2353121fd65e30d50c14b9a51cccd01082c30' }, "Age")), data.map(animal => (index.h("smoothly-table-expandable-row", null, index.h("smoothly-table-cell", null, animal.type), index.h("smoothly-table-cell", null, animal.name), index.h("smoothly-table-cell", null, animal.age), index.h("smoothly-form", { slot: "detail", onSmoothlyFormSubmit: () => this.counter++, looks: "line" }, index.h("smoothly-input", { value: animal.type }, "Type"), index.h("smoothly-input", { value: animal.name }, "Name"), index.h("smoothly-input", null, animal.age), index.h("smoothly-submit", { slot: "submit" }, "Submit!"))))), data.map(animal => (index.h("smoothly-table-row", null, index.h("smoothly-table-cell", null, animal.type), index.h("smoothly-table-expandable-cell", null, animal.name, index.h("smoothly-form", { slot: "detail", onSmoothlyFormSubmit: () => this.counter++, looks: "line" }, index.h("smoothly-input", { value: animal.name }, "Name"), index.h("smoothly-submit", { slot: "submit" }, "Submit!"))), index.h("smoothly-table-expandable-cell", null, animal.age, index.h("smoothly-form", { slot: "detail", onSmoothlyFormSubmit: () => this.counter++, looks: "line" }, index.h("smoothly-input", { value: animal.type }, "Type"), index.h("smoothly-input", { value: animal.name }, "Name"), index.h("smoothly-input", null, animal.age), index.h("smoothly-submit", { slot: "submit" }, "Submit!")))))), index.h("smoothly-table-footer", { key: '89632321b8eb3e5cc90949ca090c83f66bb92ddc' }, index.h("td", { key: '0487fb4e794ae1869ba4587e771bc762bbe51bee', colSpan: 2 }, index.h("div", { key: '5593a3dbb5be54e071dd853aca3f37d0fec0ccd3', class: "footer" }, "Currently viewing content from:", index.h("smoothly-display", { key: 'f91fa74ca1e36c74168ba2191009997935710c5f', type: "date", value: "2023-10-12" }))), index.h("smoothly-table-header", { key: 'fdd07d8165c4d6b05a96fb37f14da6aa6e00bbde' }, "Total age: " + data.reduce((r, a) => r + a.age, 0))))));
12660
12691
  }
12661
12692
  };
12662
12693
  SmoothlyTableTesting.style = SmoothlyTableTestingStyle0;
@@ -12688,7 +12719,7 @@ const SmoothlyTabs = class {
12688
12719
  old.open = false;
12689
12720
  }
12690
12721
  render() {
12691
- return (index.h(index.Host, { key: '76a866d156ea794fc03087957ad32db5cf020321', style: { "--tabs": `${this.tabs.length}` } }, index.h("slot", { key: '5de5cc3949962492f8262585d495b148783aded8' })));
12722
+ return (index.h(index.Host, { key: 'b7546191fa983884fae40908ef9d192801008b24', style: { "--tabs": `${this.tabs.length}` } }, index.h("slot", { key: 'b4c48090e63b912607d772044c47af880ca6a09e' })));
12692
12723
  }
12693
12724
  get element() { return index.getElement(this); }
12694
12725
  static get watchers() { return {
@@ -12705,7 +12736,7 @@ const SmoothlyTabsDemo = class {
12705
12736
  index.registerInstance(this, hostRef);
12706
12737
  }
12707
12738
  render() {
12708
- return (index.h("smoothly-tabs", { key: 'a299b436bb4e22db2e782aaa99387e1fcc7135cb' }, index.h("smoothly-tab", { key: '3d0d10ba0dc347c611de3827273c4e1389648488', label: "test1", open: true }, "Hello world!"), index.h("smoothly-tab", { key: '3b9cdbcec7159443d6ccd3d1b10fa9c7ba8cfb6d', label: "test2" }, "this is a test message!"), index.h("smoothly-tab", { key: '759ca730abf0e0f870f1856b3cd2de4578c2f19f', label: "test3" }, "this is a test message again!")));
12739
+ return (index.h("smoothly-tabs", { key: 'd569728a46c2542bb18675a87b45af852c168502' }, index.h("smoothly-tab", { key: '4b30de3d0e9ad3477fcaba37d043135cbdbaf02b', label: "test1", open: true }, "Hello world!"), index.h("smoothly-tab", { key: 'fbc279d1279d1f6b6df4e4214a9f80ede3f1cb3f', label: "test2" }, "this is a test message!"), index.h("smoothly-tab", { key: 'f935e14faf487d2d7089fa6ca311454ed5c0e725', label: "test3" }, "this is a test message again!")));
12709
12740
  }
12710
12741
  };
12711
12742
  SmoothlyTabsDemo.style = SmoothlyTabsDemoStyle0;
@@ -12719,7 +12750,7 @@ const SmoothlyThemeColor = class {
12719
12750
  this.color = undefined;
12720
12751
  }
12721
12752
  render() {
12722
- return (index.h(index.Host, { key: '848121aba4246db4379e532e7fbbac982d2343f1' }, this.color, ["tint", "color", "shade"].map(variant => (index.h("smoothly-theme-color-variant", { title: `${this.color} ${variant}`, color: this.color, variant: variant })))));
12753
+ return (index.h(index.Host, { key: 'd8b102ae04ea052a0dfb6ce574647ae9f036c2b1' }, this.color, ["tint", "color", "shade"].map(variant => (index.h("smoothly-theme-color-variant", { title: `${this.color} ${variant}`, color: this.color, variant: variant })))));
12723
12754
  }
12724
12755
  };
12725
12756
  SmoothlyThemeColor.style = SmoothlyThemeColorStyle0;
@@ -12771,7 +12802,7 @@ const SmoothlyThemeDemo = class {
12771
12802
  index.registerInstance(this, hostRef);
12772
12803
  }
12773
12804
  render() {
12774
- return (index.h(index.Host, { key: '865ce77bdd45afebc2774a27eff805c25356ab36' }, index.h("h2", { key: '06ee90bd42d389e9a778856afd80b5dfc30e0321' }, "Theme"), index.h("smoothly-theme-picker", { key: '26363a1dddd0ebd83c2d699161122367b70f354c' }, index.h("smoothly-item", { key: '27ee146716b8087ae25fb16d79398f4987a38f50', selected: true, value: "assets/style/smoothly.css" }, "Smoothly"), index.h("smoothly-item", { key: 'dd1a03ccc5babe39f122fb934deeffa410a9f988', value: "https://app.issuefab.com/assets/style/index.css" }, "Issuefab"), index.h("smoothly-item", { key: 'dd09137b95dd1f6d362f63004f6e08406e715b7d', value: "https://app.proquse.com/assets/style/index.css" }, "Proquse"), index.h("smoothly-item", { key: 'e00ce17a19b2e317bd48ae3756704b3108ec5d78', value: "https://app.weekmeter.com/assets/style/index.css" }, "Weekmeter"), index.h("smoothly-item", { key: 'dfeedfd252269713c8c57d1944691f83f43f0383', value: "https://dash.pax2pay.app/p2pdash.css" }, "Pax2Pay Dashboard"), index.h("smoothly-item", { key: '72f624557fcac90b0914ff923d0bd8d25201e2a7', value: "https://ui.pax2pay.app/assets/style/pax2pay.css" }, "Pax2Pay Portal"), index.h("smoothly-item", { key: 'd51e73562da1aa075753602a563bdc1b839d66ed', value: "https://theme.payfunc.com/intergiro/index.css" }, "Intergiro Monitor"), index.h("smoothly-item", { key: 'ace56c663cad091d890be11a4ac98bb3d15615ba', value: "https://theme.payfunc.com/light/index.css" }, "Payfunc Light"), index.h("smoothly-item", { key: 'eee4bf76c231024eb3e73e5fadb5a3bd6ff9a953', value: "https://theme.payfunc.com/dark/index.css" }, "Payfunc Dark")), index.h("span", { key: 'a9502b7c878a7ac000a94e36c0fc98e051c244b2' }, index.h("smoothly-theme-colors", { key: 'ef952e7c9569b1d0afe771e93d948293e26341df' }), index.h("smoothly-theme-guide", { key: '79675de688385da425545169846b0025a9c40812' })), index.h("smoothly-button", { key: '93173a279843b4186c678b11800aaa4d678a6fc6', type: "link", link: "/redirect" }, "To redirect"), index.h("smoothly-button", { key: '3f9e7cf9743a3858d89983e443380f3ab21d9396', type: "link", link: "/redirect" }, "To /redirect"), index.h("smoothly-button", { key: '0052e0765dddef35e6500a72fd4489608236c88a', type: "link", link: new URL("/redirect", window.location.origin).href }, "To new URL(\"redirect\")"), index.h("smoothly-button", { key: 'cb476d018d10a8a59b895c50576f41c3ffcc5bd6', type: "link", link: "redirect/nested" }, "To redirect nested")));
12805
+ return (index.h(index.Host, { key: '54d081410164cfe67d684c8bb4c1ec1ebe452806' }, index.h("h2", { key: '1f34789f78794291e430c72839ba8a3c3076e00e' }, "Theme"), index.h("smoothly-theme-picker", { key: 'fe3c84e990cab972ccb2dc86f04d5e939a0b730d' }, index.h("smoothly-item", { key: '11c7a8328ddb902224cc3e99993ce8e425acc868', selected: true, value: "assets/style/smoothly.css" }, "Smoothly"), index.h("smoothly-item", { key: '028e8171c1ec84f0c631425e11784bdabb08c885', value: "https://app.issuefab.com/assets/style/index.css" }, "Issuefab"), index.h("smoothly-item", { key: 'b0e7c5a0141424e165e0c5ff1c21bb70726909b6', value: "https://app.proquse.com/assets/style/index.css" }, "Proquse"), index.h("smoothly-item", { key: 'ab2095a17d41e7a75153f7f26c8f20f39bbe90d6', value: "https://app.weekmeter.com/assets/style/index.css" }, "Weekmeter"), index.h("smoothly-item", { key: '826a37fbdf3ac1f2b5164ff9d542d2bd60abfa10', value: "https://dash.pax2pay.app/p2pdash.css" }, "Pax2Pay Dashboard"), index.h("smoothly-item", { key: '906abe598591c168e3c453f5e13a8b38dd33deee', value: "https://ui.pax2pay.app/assets/style/pax2pay.css" }, "Pax2Pay Portal"), index.h("smoothly-item", { key: '772d0de279b2f20c40b35e0263f30ea1d8a3f9e7', value: "https://theme.payfunc.com/intergiro/index.css" }, "Intergiro Monitor"), index.h("smoothly-item", { key: 'e284556364e9cda627507a2d9068d1543876aec8', value: "https://theme.payfunc.com/light/index.css" }, "Payfunc Light"), index.h("smoothly-item", { key: 'c90cf63880db12aa88849fc5365b98ccdf14906b', value: "https://theme.payfunc.com/dark/index.css" }, "Payfunc Dark")), index.h("span", { key: '93cf03d3c0f223162468ad9b365a004fabf65c83' }, index.h("smoothly-theme-colors", { key: 'b2bad8b6c1750281f937646ea57e1580d933a640' }), index.h("smoothly-theme-guide", { key: '2d550662a46eceedcb475b4a9abaf2cac178e2e7' })), index.h("smoothly-button", { key: '7ae3e1a95fa71d430e227e1e585347e36130b413', type: "link", link: "/redirect" }, "To redirect"), index.h("smoothly-button", { key: '2f3d0ebfeef56c4385538c7bdad673b22795ae03', type: "link", link: "/redirect" }, "To /redirect"), index.h("smoothly-button", { key: 'ac89007d285921323cfb0ea1e03d527cdb3ffdc1', type: "link", link: new URL("/redirect", window.location.origin).href }, "To new URL(\"redirect\")"), index.h("smoothly-button", { key: '6424bb2eedc79f9844e03b3012befffac9dd3f58', type: "link", link: "redirect/nested" }, "To redirect nested")));
12775
12806
  }
12776
12807
  };
12777
12808
  SmoothlyThemeDemo.style = SmoothlyThemeDemoStyle0;
@@ -12785,14 +12816,14 @@ const SmoothlyThemeColors = class {
12785
12816
  }
12786
12817
  render() {
12787
12818
  return [
12788
- index.h("smoothly-display", { key: '707ff83cef8b445e4dc7289dbabf6be194b7fec6' }, "Tint is used as background to highlight, for example hovering an item in the select menu."),
12789
- index.h("br", { key: '65fe1eb58612a7f9ea62b34b47605bcc2afc0162' }),
12790
- index.h("smoothly-display", { key: '12bc6cce06f04ea8296467bd6337a7d572de6c4e' }, "Color is used as a normal background or as a background to show that something is selected, for example a selected item in the select menu."),
12791
- index.h("br", { key: '3b1fe4b475a48890679280e5fe7002ac48f5f03a' }),
12792
- index.h("smoothly-display", { key: '134dc7394b8a9c4e2491fa0f50e050e1238a6218' }, "Shade is used as border and for symbols in buttons. It works as a semi-low contrast against color and tint."),
12793
- index.h("br", { key: '583b15592a6c75a192964eaa6994e9c29d8beb84' }),
12794
- index.h("smoothly-display", { key: 'a50de9e71218ca9bfe945fcc4b47f2d2d9186e4e' }, "One can use the ", "<smoothly-color>", " component to switch between what color set is used.", " "),
12795
- index.h("br", { key: 'd580b54882d4062f2ca9b692052896c64e82f699' }),
12819
+ index.h("smoothly-display", { key: '73aced140e98364ab32b558c8f2957a6eeb7ebc0' }, "Tint is used as background to highlight, for example hovering an item in the select menu."),
12820
+ index.h("br", { key: 'f03d94ad53fb3c09f469259175b621b7c7cd50e7' }),
12821
+ index.h("smoothly-display", { key: 'b93d13d77f9c7fb00e5daef73a3c04b1dc3e4682' }, "Color is used as a normal background or as a background to show that something is selected, for example a selected item in the select menu."),
12822
+ index.h("br", { key: '9e7d54e25677e2d38522a50188088630451e8db5' }),
12823
+ index.h("smoothly-display", { key: '95eb20b5ca9d5e51d500e045ecf9b857366a3835' }, "Shade is used as border and for symbols in buttons. It works as a semi-low contrast against color and tint."),
12824
+ index.h("br", { key: '368566d705df9860fb6ab4c986baebefb7b3c539' }),
12825
+ index.h("smoothly-display", { key: '6b981748e1642f940dca3c4fd56d4298272efb7e' }, "One can use the ", "<smoothly-color>", " component to switch between what color set is used.", " "),
12826
+ index.h("br", { key: 'df8636fd9068f981efdddb4fd1f9b33d98acdfe1' }),
12796
12827
  ];
12797
12828
  }
12798
12829
  };
@@ -12807,11 +12838,11 @@ const SmoothlyThemePicker = class {
12807
12838
  this.element = "smoothly-css";
12808
12839
  }
12809
12840
  render() {
12810
- return (index.h(index.Host, { key: '183b2052a1cde44f7ac25a9e9ad15ac61b9e338d' }, index.h("smoothly-input-select", { key: 'a0b4a7be58ebd0f934940e235a37beaba3cf6c46', name: "theme", looks: "border", onSmoothlyInput: e => {
12841
+ return (index.h(index.Host, { key: '3b06c8bdbf291fc5f577044962f583375660b853' }, index.h("smoothly-input-select", { key: 'f4d9aaeaad1ac395bda8e11bcd10c3f71d9317ec', name: "theme", looks: "border", onSmoothlyInput: e => {
12811
12842
  const element = document.querySelector(`#${this.element}`);
12812
12843
  if (element instanceof HTMLLinkElement && typeof e.detail.theme == "string")
12813
12844
  element.href = e.detail.theme;
12814
- } }, index.h("label", { key: '5df75384e9b9c07f0f7d860c61f060e7d3c87fc3', slot: "label" }, "Select theme"), index.h("slot", { key: 'c30444d8e8afebd522954b79e98baed622182327' }))));
12845
+ } }, index.h("label", { key: '5182e27204a212ac887561d8660e14f072a124d8', slot: "label" }, "Select theme"), index.h("slot", { key: 'bd7fa9a727b640068089b128db1a4de905a49feb' }))));
12815
12846
  }
12816
12847
  };
12817
12848
  SmoothlyThemePicker.style = SmoothlyThemePickerStyle0;
@@ -12832,7 +12863,7 @@ const SmoothlyToggle = class {
12832
12863
  this.selected = !this.selected;
12833
12864
  }
12834
12865
  render() {
12835
- return (index.h("button", { key: 'b430e16450b3f35da226707fe6023072b56bbedf' }, index.h("slot", { key: '7e821a21d754c1d4721c650a4d9e3854cd1c052c', name: "icon-slot" }), index.h("slot", { key: '51394d6d6c76ccf573846014ceaf099deefecfe8' }, this.name)));
12866
+ return (index.h("button", { key: '943fdf3c2020e09c03e37110ce01927e31b915bd' }, index.h("slot", { key: 'dcb1b18047edc69ecbd80d883c2e974fe33e6951', name: "icon-slot" }), index.h("slot", { key: '3d8fc1215e43327649d6b8c90e8f6e6ed46ac440' }, this.name)));
12836
12867
  }
12837
12868
  };
12838
12869
  SmoothlyToggle.style = SmoothlyToggleStyle0;
@@ -12856,7 +12887,7 @@ const SmoothlyToggleSwitch = class {
12856
12887
  this.smoothlyToggleSwitchChange.emit(this.selected);
12857
12888
  }
12858
12889
  render() {
12859
- return (index.h(index.Host, { key: '092fc236b5cb41718825e5f72076f92843c7e337' }, index.h("button", { key: 'f607ed3cc25099d8b191876456df7c8d54360f3c', disabled: this.disabled, onClick: () => this.handleClick() }, index.h("smoothly-icon", { key: 'a34cdcacbed9ae97c79cd902c09840c5237cd576', color: this.color, name: !this.checkmark ? "ellipse" : this.selected ? "checkmark-circle" : "close-circle", fill: "clear", class: { selected: this.selected } }))));
12890
+ return (index.h(index.Host, { key: 'ffb27188be61fc8c2ada8a404af42be35ced322d' }, index.h("button", { key: 'd816de8b00238c8758466ae330c6c5db27ee0242', disabled: this.disabled, onClick: () => this.handleClick() }, index.h("smoothly-icon", { key: '80a5ca52f10517e4810023a596ef08994ffa3440', color: this.color, name: !this.checkmark ? "ellipse" : this.selected ? "checkmark-circle" : "close-circle", fill: "clear", class: { selected: this.selected } }))));
12860
12891
  }
12861
12892
  };
12862
12893
  SmoothlyToggleSwitch.style = SmoothlyToggleSwitchStyle0;
@@ -12869,7 +12900,7 @@ const SmoothlyToggleSwitchDemo = class {
12869
12900
  index.registerInstance(this, hostRef);
12870
12901
  }
12871
12902
  render() {
12872
- return (index.h(index.Host, { key: 'b5a8dad0e8976256f3b4627764d9bc7f3242d514' }, index.h("h4", { key: 'a0fb1105285b4ebd999f5bd7fc9a67c4dabbffe7' }, "Toggle switches"), index.h("div", { key: 'e1f383c9bb9538ae08c67572e51cf0ade1985c90' }, index.h("p", { key: '068e32fa464cf8a469dadc57bbd17540ee4857ab' }, "Checkmark"), index.h("span", { key: '212f89b6c1d905a7711790f30f7039c126083146' }, index.h("p", { key: 'ef887b9684ee3732b954bb7d67920d1c561f186c' }, "Tiny"), index.h("smoothly-toggle-switch", { key: '2d02e137002d7d77f35762fb1057f77fbd8b9c7b', disabled: false, size: "tiny" })), index.h("span", { key: 'a317a1fa13ec0643e8314c8e0309d5ec9ef92a6b' }, index.h("p", { key: '4fba9e2c490d6a441b2fd87e502371af64c2fec7' }, "Small"), index.h("smoothly-toggle-switch", { key: '1cf9d08b7fd357d1a1a2cbb07dc19af3329b638d', disabled: false, size: "small" })), index.h("span", { key: '86122733c5b1a4b0fa9d62534f4e23fb97a6b1cb' }, index.h("p", { key: '83a898afe95f77d87df30a45b49460a288a752bf' }, "Standard"), index.h("smoothly-toggle-switch", { key: 'e748f4c1a33cb3ec4ec5f0cb3d06222772291783', disabled: false })), index.h("span", { key: '0dd0d6c6e6df19f798c0082eec67bc3b99abfd30' }, index.h("p", { key: 'ef85903cbe51b0936ce50c23329cd13d366da08e' }, "Large"), index.h("smoothly-toggle-switch", { key: 'e6e4dc938e3d808ecee53f476f774fa124eff34b', disabled: false, size: "large" })), index.h("p", { key: '08f2e4c397aeb0ca02b8a230946c7f63ee97545f' }, "Colors checkmark"), index.h("span", { key: 'efbe3544bc9c51863e0787ffedfd507e60ed40aa' }, index.h("p", { key: 'ace9e8d3011faea0bbfc3bc24aebe57ac4d22b66' }, "Danger"), index.h("smoothly-toggle-switch", { key: '276519f385e87e2fd8667c0828d907320c699f04', color: "danger", disabled: false, size: "small" })), index.h("span", { key: 'd63aeeaf10d9eaa72bb903f9d46eae9248baa6a9' }, index.h("p", { key: '4b50aaba711d21ee300d665518044167c4544e16' }, "Primary color"), index.h("smoothly-toggle-switch", { key: '252117c2670a1d711ae0a4038815daafc4f6eac1', color: "primary", disabled: false, size: "small" })), index.h("span", { key: 'd753489108dee9ff3919dc4888b7b184efc12359' }, index.h("p", { key: '300e5007173732e8d1f635e209215c197a39e743' }, "Secondary color"), index.h("smoothly-toggle-switch", { key: 'a37e57c300608347e41a9ebcf74cf942cd13b700', color: "secondary", disabled: false, size: "small" })), index.h("p", { key: 'ff9f091be0d5673bc67a2b8c147a3ebdeb7a0de0' }), index.h("p", { key: 'c9449dc13ba993f888914ae0b2b30c64abe4362f' }, "Colors no checkmark"), index.h("span", { key: '5dd59ef4b8a96c73b7ba63af6fb480e30d754f85' }, index.h("p", { key: 'cf69d46fd1d23594577df9c8061ca4f08f16d6e8' }, "Danger"), index.h("smoothly-toggle-switch", { key: 'ffd295756cfd7e5793615809c96ca8e540197707', checkmark: false, color: "danger", disabled: false, size: "small" })), index.h("span", { key: 'aea5eb0c1a904765942448b80f3cc73964dbe0f4' }, index.h("p", { key: '1ed89ea2201fbcc9ab1254b14df60a55b4396334' }, "Primary color"), index.h("smoothly-toggle-switch", { key: 'd3ef838368ec6cc5ad08f854acc591d97a6b5540', checkmark: false, color: "primary", disabled: false, size: "small" })), index.h("span", { key: 'f9167625da0b84b939d775757ec707431153a09c' }, index.h("p", { key: '5c1cf2729734ac8e397b3e1500b6abc9d5862bfd' }, "Secondary color"), index.h("smoothly-toggle-switch", { key: '06c2af18c81fe2f23daa9f783e3a7cdb363ed3f5', checkmark: false, color: "secondary", disabled: false, size: "small" })))));
12903
+ return (index.h(index.Host, { key: '7cf6fe092063bfcc2a0b5ce00390608c7ceb3e35' }, index.h("h4", { key: '650888efb65135a0af4525a326a3503a9e75bbea' }, "Toggle switches"), index.h("div", { key: '340d00ecd16ca494455452861e0fdfbdd14f9bf4' }, index.h("p", { key: '4b5aa3e5744bf2e80a38b9d51a60a475e9b83f21' }, "Checkmark"), index.h("span", { key: 'dfb0037144b00a27e8a254fa160f32ab1f6157d2' }, index.h("p", { key: 'c8446ba9bbb5f057375466ccc68b2587c021f980' }, "Tiny"), index.h("smoothly-toggle-switch", { key: '0a211ca5f13225f87da1eb532a493c0c73343193', disabled: false, size: "tiny" })), index.h("span", { key: '13bca9557cfa2b4cc415b4abd89fbdea9e55c9d4' }, index.h("p", { key: '8de177d62eeee0051c41096716fa4ca1a36739fc' }, "Small"), index.h("smoothly-toggle-switch", { key: 'ea7aa17918176f5fa1c71e244be978f7eafa5052', disabled: false, size: "small" })), index.h("span", { key: '1dc744e7d8ed1535eb3d507e307fb9f11f3380af' }, index.h("p", { key: 'd49d0be30eba8392635172004f1156540b2293ab' }, "Standard"), index.h("smoothly-toggle-switch", { key: '42f4d36895aa794d5f274f5129dda23ea72398f3', disabled: false })), index.h("span", { key: '652700c32164c5031adaa6f43955901eb1095bb9' }, index.h("p", { key: 'dab8f0b9025a99fb6ca9a3ba6e4e5ce9254dd0f3' }, "Large"), index.h("smoothly-toggle-switch", { key: 'd4473d3d9943e8cf461c712c8f58cb99aaba0013', disabled: false, size: "large" })), index.h("p", { key: 'f3b130b5d488f9f2c1854ac2c9a34a8deef221c1' }, "Colors checkmark"), index.h("span", { key: 'd9158b70cff53031fabbf28424eb3f3f88aa2598' }, index.h("p", { key: '737c97eaf035b4e061c8d9237a61b4ad9aabb32e' }, "Danger"), index.h("smoothly-toggle-switch", { key: '2e675f71873242c3d05abc0432fd2ee5f4a1bc44', color: "danger", disabled: false, size: "small" })), index.h("span", { key: '80cd3de234536333f0bf295d4b8b55aa67d6c593' }, index.h("p", { key: 'cc9b82a775e9d5760ae1114a117d1971ef0dfabb' }, "Primary color"), index.h("smoothly-toggle-switch", { key: '5e4faa94056c423207db5ee56044029b2029cc49', color: "primary", disabled: false, size: "small" })), index.h("span", { key: 'd4c08e700f6279d790082a6d8a6cf82bc80593b6' }, index.h("p", { key: 'dc2b2be553c249465279c5d3126f1bce155b217c' }, "Secondary color"), index.h("smoothly-toggle-switch", { key: '6ca09980d762d90d61e1b16c61fa3bebcc3fd8ed', color: "secondary", disabled: false, size: "small" })), index.h("p", { key: 'b99e95bc2fe2d8b1fa56395ff7cd11f5ea504bf2' }), index.h("p", { key: 'f068ce4b6cb5c137c3937ba24f62249f373050e5' }, "Colors no checkmark"), index.h("span", { key: 'a10998da8b515d78c1ecfff6a70dca9b9925ea3d' }, index.h("p", { key: 'e6ad7c694a6f48ed202c9c9750ded94e9fa2d562' }, "Danger"), index.h("smoothly-toggle-switch", { key: '67a6fbfb0a4ce235d6f9a055d8105660964abb71', checkmark: false, color: "danger", disabled: false, size: "small" })), index.h("span", { key: 'd035077c4acded94ad12659b6468cc30eec8aecd' }, index.h("p", { key: '0b2b5af4e4d6e45d8b116becaaf65854c35d1e9c' }, "Primary color"), index.h("smoothly-toggle-switch", { key: 'bf46cdf92b6b1e71ca9f57d284341a6c8c2a62de', checkmark: false, color: "primary", disabled: false, size: "small" })), index.h("span", { key: '730d9706d731826fa1f71c4eb68bb02019fa74f2' }, index.h("p", { key: '5d3323546f9e6917cc0a5a99f4e584d56ecb87f4' }, "Secondary color"), index.h("smoothly-toggle-switch", { key: '781749106ba74f78cee1874f624ce8e5e1c5c78a', checkmark: false, color: "secondary", disabled: false, size: "small" })))));
12873
12904
  }
12874
12905
  };
12875
12906
  SmoothlyToggleSwitchDemo.style = SmoothlyToggleSwitchDemoStyle0;
@@ -12900,7 +12931,7 @@ const SmoothlyTrigger = class {
12900
12931
  result = this.disabled ? (index.h("slot", null)) : (index.h("a", { onClick: e => this.onClick(e) }, index.h("slot", null)));
12901
12932
  break;
12902
12933
  case "button":
12903
- result = (index.h("button", { key: 'be00b28fdd08ca1faf3074fd0b431d0841a68848', disabled: this.disabled, name: this.name }, index.h("slot", { key: 'f14949be4c37391c0f3658938c99e5a4e7b52a23' })));
12934
+ result = (index.h("button", { key: 'd7b832d4189b926886eee9d1eee0abe4797e4510', disabled: this.disabled, name: this.name }, index.h("slot", { key: 'bfc5c7dfced3f4495d709e538a906a0fcbac636d' })));
12904
12935
  break;
12905
12936
  }
12906
12937
  return result;
@@ -12970,6 +13001,7 @@ exports.smoothly_item = SmoothlyItem;
12970
13001
  exports.smoothly_label = SmoothlyLabel;
12971
13002
  exports.smoothly_lazy = SmoothlyLazy;
12972
13003
  exports.smoothly_load_more = LoadMore;
13004
+ exports.smoothly_modal = SmoothlyModal;
12973
13005
  exports.smoothly_next_demo = SmoothlyNextDemo;
12974
13006
  exports.smoothly_next_demo_colspan = SmoothlyNextDemoColspan;
12975
13007
  exports.smoothly_next_demo_group = SmoothlyNextDemoGroup;
@@ -13015,4 +13047,4 @@ exports.smoothly_toggle_switch = SmoothlyToggleSwitch;
13015
13047
  exports.smoothly_toggle_switch_demo = SmoothlyToggleSwitchDemo;
13016
13048
  exports.smoothly_trigger = SmoothlyTrigger;
13017
13049
 
13018
- //# sourceMappingURL=smoothly-app_106.cjs.entry.js.map
13050
+ //# sourceMappingURL=smoothly-app_107.cjs.entry.js.map