@vonage/vivid 5.25.0 → 5.27.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (737) hide show
  1. package/accordion/index.cjs +1 -1
  2. package/accordion/index.js +8 -8
  3. package/accordion-item/index.cjs +1 -1
  4. package/action-group/index.cjs +3 -3
  5. package/action-group/index.js +10 -5
  6. package/alert/index.cjs +7 -7
  7. package/alert/index.js +47 -35
  8. package/audio-player/index.cjs +18 -18
  9. package/audio-player/index.js +15 -11
  10. package/avatar/index.cjs +9 -9
  11. package/avatar/index.js +27 -18
  12. package/badge/index.cjs +1 -1
  13. package/banner/index.cjs +5 -5
  14. package/banner/index.js +33 -27
  15. package/breadcrumb/index.cjs +1 -1
  16. package/breadcrumb/index.js +5 -1
  17. package/breadcrumb-item/index.cjs +1 -1
  18. package/breadcrumb-item/index.js +6 -6
  19. package/bundled/affix.cjs +3 -3
  20. package/bundled/affix.js +1 -1
  21. package/bundled/anchored.cjs +2 -2
  22. package/bundled/anchored.js +13 -1
  23. package/bundled/aria-binding-directive.cjs +1 -1
  24. package/bundled/aria-binding-directive.js +2 -2
  25. package/bundled/aria.cjs +1 -1
  26. package/bundled/base-color-picker.cjs +2 -2
  27. package/bundled/base-color-picker.js +1 -1
  28. package/bundled/base-progress.cjs +1 -1
  29. package/bundled/breadcrumb-item.cjs +1 -1
  30. package/bundled/button.cjs +1 -1
  31. package/bundled/calendar-event.cjs +1 -1
  32. package/bundled/calendar-event.js +17 -4
  33. package/bundled/calendar-picker.template.cjs +5 -5
  34. package/bundled/calendar-picker.template.js +53 -55
  35. package/bundled/char-count.cjs +2 -2
  36. package/bundled/children.cjs +1 -1
  37. package/bundled/children.js +1 -1
  38. package/bundled/class-names.cjs +1 -1
  39. package/bundled/component-enum.cjs +1 -0
  40. package/bundled/component-enum.js +9 -0
  41. package/bundled/data-grid.options.cjs +1 -1
  42. package/bundled/data-grid.options.js +7 -6
  43. package/bundled/decorate.cjs +1 -1
  44. package/bundled/decorate.js +1 -1
  45. package/bundled/definition.cjs +1 -1
  46. package/bundled/definition10.cjs +10 -20
  47. package/bundled/definition10.js +23 -72
  48. package/bundled/definition11.cjs +74 -10
  49. package/bundled/definition11.js +194 -24
  50. package/bundled/definition12.cjs +18 -70
  51. package/bundled/definition12.js +48 -186
  52. package/bundled/definition13.cjs +5 -22
  53. package/bundled/definition13.js +9 -58
  54. package/bundled/definition14.cjs +1 -5
  55. package/bundled/definition14.js +9 -9
  56. package/bundled/definition15.cjs +3 -3
  57. package/bundled/definition15.js +18 -18
  58. package/bundled/definition16.cjs +3 -3
  59. package/bundled/definition16.js +23 -17
  60. package/bundled/definition17.cjs +6 -6
  61. package/bundled/definition17.js +8 -8
  62. package/bundled/definition18.cjs +2 -2
  63. package/bundled/definition19.cjs +21 -21
  64. package/bundled/definition19.js +66 -61
  65. package/bundled/definition2.cjs +13 -1
  66. package/bundled/definition2.js +22 -185
  67. package/bundled/definition20.cjs +3 -3
  68. package/bundled/definition20.js +6 -7
  69. package/bundled/definition21.cjs +7 -7
  70. package/bundled/definition21.js +22 -23
  71. package/bundled/definition22.cjs +3 -3
  72. package/bundled/definition22.js +25 -25
  73. package/bundled/definition23.cjs +3 -3
  74. package/bundled/definition23.js +26 -8
  75. package/bundled/definition24.cjs +2 -2
  76. package/bundled/definition24.js +1 -1
  77. package/bundled/definition25.cjs +5 -5
  78. package/bundled/definition25.js +16 -11
  79. package/bundled/definition3.cjs +25 -12
  80. package/bundled/definition3.js +90 -21
  81. package/bundled/definition4.cjs +29 -25
  82. package/bundled/definition4.js +50 -89
  83. package/bundled/definition5.cjs +28 -29
  84. package/bundled/definition5.js +143 -45
  85. package/bundled/definition6.cjs +6 -29
  86. package/bundled/definition6.js +20 -130
  87. package/bundled/definition7.cjs +14 -6
  88. package/bundled/definition7.js +159 -20
  89. package/bundled/definition8.cjs +22 -14
  90. package/bundled/definition8.js +88 -144
  91. package/bundled/definition9.cjs +20 -22
  92. package/bundled/definition9.js +54 -80
  93. package/bundled/delegates-aria.cjs +1 -1
  94. package/bundled/delegates-aria.js +3 -2
  95. package/bundled/dialog.cjs +1 -1
  96. package/bundled/dialog.js +1 -1
  97. package/bundled/divider.cjs +1 -1
  98. package/bundled/divider.js +9 -9
  99. package/bundled/dom.cjs +1 -1
  100. package/bundled/enums.cjs +1 -1
  101. package/bundled/extractOptions.cjs +1 -1
  102. package/bundled/feedback-message.cjs +8 -0
  103. package/bundled/feedback-message.js +41 -0
  104. package/bundled/floating-ui.dom.cjs +1 -1
  105. package/bundled/floating-ui.dom.js +163 -197
  106. package/bundled/form-associated.cjs +1 -1
  107. package/bundled/form-associated.js +3 -4
  108. package/bundled/form-element.cjs +1 -1
  109. package/bundled/host-semantics.cjs +1 -1
  110. package/bundled/icon.cjs +1 -1
  111. package/bundled/kbd-shortcut.cjs +1 -1
  112. package/bundled/key-codes.cjs +1 -1
  113. package/bundled/linkable.cjs +2 -2
  114. package/bundled/listbox.cjs +1 -1
  115. package/bundled/listbox.js +3 -5
  116. package/bundled/localized.cjs +1 -1
  117. package/bundled/localized.js +33 -32
  118. package/bundled/mixins.cjs +9 -16
  119. package/bundled/mixins.js +23 -57
  120. package/bundled/numberConverter.cjs +2 -2
  121. package/bundled/numberConverter.js +1 -1
  122. package/bundled/numbers.cjs +1 -1
  123. package/bundled/optgroup.cjs +1 -1
  124. package/bundled/option.cjs +1 -1
  125. package/bundled/option.js +9 -7
  126. package/bundled/picker-field.template.cjs +2 -2
  127. package/bundled/picker-field.template.js +8 -8
  128. package/bundled/platform.cjs +1 -1
  129. package/bundled/playbackRates.cjs +1 -1
  130. package/bundled/ref.cjs +1 -1
  131. package/bundled/ref.js +1 -1
  132. package/bundled/render-in-light-dom.cjs +1 -1
  133. package/bundled/render-in-light-dom.js +1 -1
  134. package/bundled/repeat.cjs +1 -1
  135. package/bundled/repeat.js +16 -15
  136. package/bundled/scrollIntoView.cjs +1 -1
  137. package/bundled/scrollIntoView.js +1 -3
  138. package/bundled/single-date-picker.cjs +1 -1
  139. package/bundled/single-value-picker.cjs +1 -1
  140. package/bundled/single-value-picker.js +1 -1
  141. package/bundled/slider.template.cjs +12 -12
  142. package/bundled/slider.template.js +209 -32
  143. package/bundled/slottable-request.cjs +3 -3
  144. package/bundled/slottable-request.js +26 -17
  145. package/bundled/slotted.cjs +1 -1
  146. package/bundled/slotted.js +1 -1
  147. package/bundled/text-field.cjs +1 -1
  148. package/bundled/text-field.js +1 -1
  149. package/bundled/time-selection-picker.template.cjs +4 -4
  150. package/bundled/time-selection-picker.template.js +10 -7
  151. package/bundled/trapped-focus.cjs +1 -1
  152. package/bundled/utils.cjs +1 -1
  153. package/bundled/vivid-element.cjs +3 -3
  154. package/bundled/vivid-element.js +397 -358
  155. package/bundled/when.cjs +1 -1
  156. package/bundled/when.js +1 -1
  157. package/bundled/with-contextual-help.cjs +1 -1
  158. package/bundled/with-contextual-help.js +1 -1
  159. package/bundled/with-error-text.cjs +1 -1
  160. package/bundled/with-success-text.cjs +1 -1
  161. package/button/index.cjs +1 -1
  162. package/button/index.js +1 -1
  163. package/calendar/index.cjs +1 -1
  164. package/calendar/index.js +7 -7
  165. package/calendar-event/index.cjs +2 -2
  166. package/calendar-event/index.js +10 -8
  167. package/card/index.cjs +4 -2
  168. package/card/index.js +12 -7
  169. package/checkbox/index.cjs +1 -1
  170. package/color-picker/index.cjs +17 -17
  171. package/color-picker/index.js +19 -17
  172. package/combobox/index.cjs +9 -9
  173. package/combobox/index.js +46 -44
  174. package/contextual-help/index.cjs +1 -1
  175. package/contextual-help/index.js +1 -1
  176. package/country/index.cjs +1 -1
  177. package/country-group/index.cjs +1 -1
  178. package/country-group/index.js +8 -4
  179. package/custom-elements.json +7322 -7254
  180. package/data-grid/index.cjs +6 -6
  181. package/data-grid/index.js +92 -99
  182. package/date-picker/index.cjs +1 -1
  183. package/date-picker/index.js +10 -6
  184. package/date-range-picker/index.cjs +1 -1
  185. package/date-range-picker/index.js +13 -9
  186. package/date-time-picker/index.cjs +1 -1
  187. package/date-time-picker/index.js +11 -7
  188. package/dial-pad/index.cjs +4 -3
  189. package/dial-pad/index.js +14 -9
  190. package/dialog/index.cjs +1 -1
  191. package/dialog/index.js +9 -6
  192. package/divider/index.cjs +1 -1
  193. package/elevation/definition.cjs +1 -0
  194. package/elevation/definition.js +2 -2
  195. package/elevation/index.cjs +1 -1
  196. package/elevation/index.js +1 -1
  197. package/empty-state/index.cjs +3 -3
  198. package/empty-state/index.js +18 -6
  199. package/fab/index.cjs +3 -3
  200. package/fab/index.js +14 -6
  201. package/file-picker/index.cjs +8 -10
  202. package/file-picker/index.js +25 -22
  203. package/flag/index.cjs +1 -1
  204. package/flag/index.js +7 -3
  205. package/form-field/definition.cjs +5 -0
  206. package/form-field/definition.js +2 -0
  207. package/form-field/index.cjs +29 -0
  208. package/form-field/index.js +57 -0
  209. package/header/definition.cjs +1 -1
  210. package/header/definition.js +1 -1
  211. package/header/index.cjs +1 -1
  212. package/header/index.js +9 -5
  213. package/icon/index.cjs +1 -1
  214. package/icon/index.js +1 -1
  215. package/index.cjs +159 -154
  216. package/index.js +42 -40
  217. package/kbd-key/definition.cjs +1 -1
  218. package/kbd-key/definition.js +1 -1
  219. package/kbd-key/index.cjs +3 -3
  220. package/kbd-key/index.js +22 -13
  221. package/kbd-shortcut/definition.cjs +1 -1
  222. package/kbd-shortcut/definition.js +1 -1
  223. package/kbd-shortcut/index.cjs +1 -1
  224. package/kbd-shortcut/index.js +6 -6
  225. package/layout/definition.cjs +1 -1
  226. package/layout/definition.js +1 -1
  227. package/layout/index.cjs +1 -1
  228. package/layout/index.js +7 -3
  229. package/lib/accordion-item/accordion-item.d.ts +11 -6
  230. package/lib/action-group/action-group.d.ts +10 -5
  231. package/lib/alert/alert.d.ts +15 -18
  232. package/lib/avatar/avatar.d.ts +16 -7
  233. package/lib/badge/badge.d.ts +17 -7
  234. package/lib/banner/banner.d.ts +18 -20
  235. package/lib/button/button.d.ts +25 -16
  236. package/lib/calendar-event/calendar-event.d.ts +14 -7
  237. package/lib/checkbox/checkbox.d.ts +31 -28
  238. package/lib/combobox/combobox.d.ts +37 -32
  239. package/lib/components.d.ts +1 -0
  240. package/lib/data-grid/data-grid.options.d.ts +6 -1
  241. package/lib/dial-pad/locale.d.ts +1 -0
  242. package/lib/divider/divider.d.ts +9 -6
  243. package/lib/elevation/definition.d.ts +2 -0
  244. package/lib/empty-state/empty-state.d.ts +7 -2
  245. package/lib/fab/fab.d.ts +3 -2
  246. package/lib/form-field/definition.d.ts +4 -0
  247. package/lib/form-field/form-field.d.ts +6 -0
  248. package/lib/form-field/form-field.template.d.ts +3 -0
  249. package/lib/kbd-key/kbd-key.d.ts +7 -2
  250. package/lib/listbox/listbox.d.ts +1 -0
  251. package/lib/menu-item/menu-item.d.ts +17 -14
  252. package/lib/nav-disclosure/nav-disclosure.d.ts +18 -11
  253. package/lib/nav-item/nav-item.d.ts +19 -12
  254. package/lib/note/note.d.ts +10 -6
  255. package/lib/number-field/number-field.d.ts +45 -40
  256. package/lib/option/option.d.ts +13 -10
  257. package/lib/popup/definition.d.ts +2 -0
  258. package/lib/progress/progress.d.ts +10 -5
  259. package/lib/progress-ring/progress-ring.d.ts +9 -5
  260. package/lib/radio/radio.d.ts +18 -15
  261. package/lib/range-slider/range-slider.d.ts +19 -15
  262. package/lib/rich-text-editor/rich-text-editor.d.ts +9 -5
  263. package/lib/rich-text-editor/rte/utils/ui.d.ts +2 -1
  264. package/lib/searchable-select/option-tag.d.ts +12 -7
  265. package/lib/searchable-select/searchable-select.d.ts +7 -2
  266. package/lib/select/select.d.ts +45 -40
  267. package/lib/selectable-box/selectable-box.d.ts +9 -5
  268. package/lib/slider/slider.d.ts +18 -14
  269. package/lib/split-button/split-button.d.ts +24 -15
  270. package/lib/status/status.d.ts +10 -7
  271. package/lib/switch/switch.d.ts +13 -9
  272. package/lib/tab/tab.d.ts +19 -14
  273. package/lib/tabs/tabs.d.ts +6 -3
  274. package/lib/tag/tag.d.ts +24 -15
  275. package/lib/tag-name-map.d.ts +2 -1
  276. package/lib/text-field/text-field.d.ts +46 -41
  277. package/lib/video-player/__tests__/video-fixtures.d.ts +3 -0
  278. package/listbox/definition.cjs +1 -1
  279. package/listbox/definition.js +1 -1
  280. package/listbox/index.cjs +7 -5
  281. package/listbox/index.js +24 -10
  282. package/locales/de-DE.cjs +34 -33
  283. package/locales/de-DE.js +34 -33
  284. package/locales/en-GB.cjs +34 -33
  285. package/locales/en-GB.js +34 -33
  286. package/locales/ja-JP.cjs +35 -33
  287. package/locales/ja-JP.js +35 -33
  288. package/locales/zh-CN.cjs +34 -33
  289. package/locales/zh-CN.js +34 -33
  290. package/menu/index.cjs +1 -1
  291. package/menu-item/index.cjs +1 -1
  292. package/nav/definition.cjs +1 -1
  293. package/nav/definition.js +1 -1
  294. package/nav/index.cjs +1 -1
  295. package/nav/index.js +6 -4
  296. package/nav-disclosure/definition.cjs +1 -1
  297. package/nav-disclosure/definition.js +1 -1
  298. package/nav-disclosure/index.cjs +3 -3
  299. package/nav-disclosure/index.js +13 -8
  300. package/nav-item/definition.cjs +1 -1
  301. package/nav-item/definition.js +1 -1
  302. package/nav-item/index.cjs +2 -2
  303. package/nav-item/index.js +15 -10
  304. package/note/definition.cjs +1 -1
  305. package/note/definition.js +1 -1
  306. package/note/index.cjs +6 -4
  307. package/note/index.js +22 -9
  308. package/number-field/definition.cjs +1 -1
  309. package/number-field/definition.js +1 -1
  310. package/number-field/index.cjs +11 -11
  311. package/number-field/index.js +41 -36
  312. package/optgroup/index.cjs +1 -1
  313. package/option/index.cjs +1 -1
  314. package/package.json +29 -36
  315. package/pagination/definition.cjs +1 -1
  316. package/pagination/definition.js +1 -1
  317. package/pagination/index.cjs +1 -1
  318. package/pagination/index.js +9 -9
  319. package/platform-switch/definition.cjs +1 -1
  320. package/platform-switch/definition.js +1 -1
  321. package/platform-switch/index.cjs +1 -1
  322. package/platform-switch/index.js +6 -2
  323. package/popover/definition.cjs +1 -1
  324. package/popover/definition.js +1 -1
  325. package/popover/index.cjs +2 -2
  326. package/popover/index.js +43 -35
  327. package/popup/definition.cjs +1 -0
  328. package/popup/definition.js +2 -2
  329. package/popup/index.cjs +1 -1
  330. package/popup/index.js +1 -1
  331. package/progress/definition.cjs +1 -1
  332. package/progress/definition.js +1 -1
  333. package/progress/index.cjs +7 -7
  334. package/progress/index.js +21 -11
  335. package/progress-ring/index.cjs +1 -1
  336. package/progress-ring/index.js +1 -1
  337. package/radio/definition.cjs +1 -1
  338. package/radio/definition.js +1 -1
  339. package/radio/index.cjs +1 -1
  340. package/radio-group/definition.cjs +1 -1
  341. package/radio-group/definition.js +1 -1
  342. package/radio-group/index.cjs +2 -2
  343. package/radio-group/index.js +14 -9
  344. package/range-slider/definition.cjs +1 -1
  345. package/range-slider/definition.js +1 -1
  346. package/range-slider/index.cjs +8 -8
  347. package/range-slider/index.js +31 -32
  348. package/rich-text-editor/definition.cjs +1 -1
  349. package/rich-text-editor/definition.js +1 -1
  350. package/rich-text-editor/index.cjs +13 -10
  351. package/rich-text-editor/index.js +1942 -1711
  352. package/rich-text-view/definition.cjs +1 -1
  353. package/rich-text-view/definition.js +1 -1
  354. package/rich-text-view/index.cjs +1 -1
  355. package/rich-text-view/index.js +6 -4
  356. package/searchable-select/definition.cjs +1 -1
  357. package/searchable-select/definition.js +1 -1
  358. package/searchable-select/index.cjs +22 -22
  359. package/searchable-select/index.js +97 -93
  360. package/select/definition.cjs +1 -1
  361. package/select/definition.js +1 -1
  362. package/select/index.cjs +1 -1
  363. package/selectable-box/definition.cjs +1 -1
  364. package/selectable-box/definition.js +1 -1
  365. package/selectable-box/index.cjs +8 -8
  366. package/selectable-box/index.js +24 -20
  367. package/shared/patterns/anchored.d.ts +2 -0
  368. package/shared/styles/appearance.d.ts +2 -0
  369. package/shared/styles/connotation.d.ts +2 -0
  370. package/shared/styles/connotationOverrides.d.ts +1 -0
  371. package/shared/utils/component-enum.d.ts +7 -0
  372. package/side-drawer/definition.cjs +1 -1
  373. package/side-drawer/definition.js +1 -1
  374. package/side-drawer/index.cjs +1 -1
  375. package/side-drawer/index.js +10 -7
  376. package/simple-color-picker/definition.cjs +1 -1
  377. package/simple-color-picker/definition.js +1 -1
  378. package/simple-color-picker/index.cjs +2 -2
  379. package/simple-color-picker/index.js +20 -20
  380. package/slider/definition.cjs +2 -1
  381. package/slider/definition.js +2 -1
  382. package/slider/index.cjs +1 -1
  383. package/slider/index.js +1 -1
  384. package/split-button/definition.cjs +1 -1
  385. package/split-button/definition.js +1 -1
  386. package/split-button/index.cjs +9 -7
  387. package/split-button/index.js +58 -37
  388. package/status/definition.cjs +1 -1
  389. package/status/definition.js +1 -1
  390. package/status/index.cjs +5 -5
  391. package/status/index.js +22 -13
  392. package/switch/definition.cjs +1 -1
  393. package/switch/definition.js +1 -1
  394. package/switch/index.cjs +3 -3
  395. package/switch/index.js +22 -11
  396. package/tab/definition.cjs +1 -1
  397. package/tab/definition.js +1 -1
  398. package/tab/index.cjs +1 -1
  399. package/tab/index.js +1 -1
  400. package/tab-panel/definition.cjs +1 -1
  401. package/tab-panel/definition.js +1 -1
  402. package/tab-panel/index.cjs +1 -1
  403. package/tab-panel/index.js +1 -1
  404. package/table/definition.cjs +1 -1
  405. package/table/definition.js +1 -1
  406. package/table/index.cjs +4 -2
  407. package/table/index.js +12 -10
  408. package/tabs/definition.cjs +1 -1
  409. package/tabs/definition.js +1 -1
  410. package/tabs/index.cjs +4 -4
  411. package/tabs/index.js +32 -30
  412. package/tag/definition.cjs +1 -1
  413. package/tag/definition.js +1 -1
  414. package/tag/index.cjs +6 -6
  415. package/tag/index.js +28 -12
  416. package/tag-group/definition.cjs +1 -1
  417. package/tag-group/definition.js +1 -1
  418. package/tag-group/index.cjs +1 -1
  419. package/tag-group/index.js +6 -4
  420. package/text-area/definition.cjs +1 -1
  421. package/text-area/definition.js +1 -1
  422. package/text-area/index.cjs +5 -5
  423. package/text-area/index.js +18 -15
  424. package/text-field/index.cjs +1 -1
  425. package/text-field/index.js +1 -1
  426. package/time-picker/definition.cjs +1 -1
  427. package/time-picker/definition.js +1 -1
  428. package/time-picker/index.cjs +1 -1
  429. package/time-picker/index.js +9 -6
  430. package/toggletip/index.cjs +1 -1
  431. package/toggletip/index.js +1 -1
  432. package/tooltip/index.cjs +1 -1
  433. package/tooltip/index.js +1 -1
  434. package/tree-item/definition.cjs +1 -1
  435. package/tree-item/definition.js +1 -1
  436. package/tree-item/index.cjs +1 -1
  437. package/tree-item/index.js +1 -1
  438. package/tree-view/definition.cjs +1 -1
  439. package/tree-view/definition.js +1 -1
  440. package/tree-view/index.cjs +1 -1
  441. package/tree-view/index.js +7 -5
  442. package/unbundled/affix.cjs +0 -1
  443. package/unbundled/anchored.cjs +39 -1
  444. package/unbundled/anchored.js +28 -1
  445. package/unbundled/aria-binding-directive.cjs +2 -2
  446. package/unbundled/aria-binding-directive.js +2 -1
  447. package/unbundled/base-color-picker.cjs +0 -1
  448. package/unbundled/base-progress.cjs +0 -1
  449. package/unbundled/breadcrumb-item.cjs +0 -1
  450. package/unbundled/button.cjs +0 -1
  451. package/unbundled/calendar-event.cjs +29 -1
  452. package/unbundled/calendar-event.js +18 -1
  453. package/unbundled/calendar-picker.template.cjs +109 -91
  454. package/unbundled/calendar-picker.template.js +109 -90
  455. package/unbundled/char-count.cjs +0 -1
  456. package/unbundled/component-enum.cjs +18 -0
  457. package/unbundled/component-enum.js +13 -0
  458. package/unbundled/data-grid.options.cjs +8 -0
  459. package/unbundled/data-grid.options.js +3 -1
  460. package/unbundled/decorate.cjs +1 -1
  461. package/unbundled/decorate.js +1 -1
  462. package/unbundled/definition.cjs +1 -2
  463. package/unbundled/definition.js +1 -1
  464. package/unbundled/definition10.cjs +2 -343
  465. package/unbundled/definition10.js +4 -338
  466. package/unbundled/definition11.cjs +6 -7
  467. package/unbundled/definition11.js +6 -6
  468. package/unbundled/definition12.cjs +4 -4
  469. package/unbundled/definition12.js +5 -4
  470. package/unbundled/definition13.cjs +2 -2
  471. package/unbundled/definition13.js +2 -1
  472. package/unbundled/definition14.cjs +11 -3
  473. package/unbundled/definition14.js +11 -2
  474. package/unbundled/definition15.cjs +26 -5
  475. package/unbundled/definition15.js +26 -4
  476. package/unbundled/definition16.cjs +20 -14
  477. package/unbundled/definition16.js +20 -13
  478. package/unbundled/definition17.cjs +0 -1
  479. package/unbundled/definition18.cjs +4 -3
  480. package/unbundled/definition18.js +4 -2
  481. package/unbundled/definition19.cjs +2 -3
  482. package/unbundled/definition19.js +9 -8
  483. package/unbundled/definition2.cjs +8 -3
  484. package/unbundled/definition2.js +8 -2
  485. package/unbundled/definition20.cjs +1 -2
  486. package/unbundled/definition20.js +7 -6
  487. package/unbundled/definition21.cjs +4 -3
  488. package/unbundled/definition21.js +4 -2
  489. package/unbundled/definition22.cjs +0 -1
  490. package/unbundled/definition23.cjs +12 -6
  491. package/unbundled/definition23.js +11 -4
  492. package/unbundled/definition24.cjs +4 -4
  493. package/unbundled/definition24.js +5 -4
  494. package/unbundled/definition25.cjs +2 -3
  495. package/unbundled/definition25.js +2 -2
  496. package/unbundled/definition26.cjs +6 -4
  497. package/unbundled/definition26.js +5 -2
  498. package/unbundled/definition27.cjs +2 -2
  499. package/unbundled/definition27.js +2 -1
  500. package/unbundled/definition28.cjs +3 -3
  501. package/unbundled/definition28.js +2 -1
  502. package/unbundled/definition29.cjs +2 -3
  503. package/unbundled/definition29.js +3 -3
  504. package/unbundled/definition3.cjs +5 -6
  505. package/unbundled/definition3.js +5 -5
  506. package/unbundled/definition30.cjs +0 -1
  507. package/unbundled/definition31.cjs +15 -13
  508. package/unbundled/definition31.js +14 -11
  509. package/unbundled/definition32.cjs +0 -1
  510. package/unbundled/definition33.cjs +0 -1
  511. package/unbundled/definition34.cjs +0 -1
  512. package/unbundled/definition35.cjs +39 -51
  513. package/unbundled/definition35.js +40 -51
  514. package/unbundled/definition36.cjs +2 -3
  515. package/unbundled/definition36.js +9 -8
  516. package/unbundled/definition37.cjs +0 -1
  517. package/unbundled/definition38.cjs +0 -1
  518. package/unbundled/definition39.cjs +0 -1
  519. package/unbundled/definition4.cjs +4 -3
  520. package/unbundled/definition4.js +11 -6
  521. package/unbundled/definition40.cjs +5 -4
  522. package/unbundled/definition40.js +5 -3
  523. package/unbundled/definition41.cjs +0 -1
  524. package/unbundled/definition42.cjs +11 -3
  525. package/unbundled/definition42.js +11 -2
  526. package/unbundled/definition43.cjs +7 -3
  527. package/unbundled/definition43.js +7 -2
  528. package/unbundled/definition44.cjs +12 -11
  529. package/unbundled/definition44.js +11 -9
  530. package/unbundled/definition45.cjs +73 -52
  531. package/unbundled/definition45.js +69 -47
  532. package/unbundled/definition46.cjs +53 -46
  533. package/unbundled/definition46.js +49 -41
  534. package/unbundled/definition47.cjs +40 -165
  535. package/unbundled/definition47.js +36 -160
  536. package/unbundled/definition48.cjs +177 -32
  537. package/unbundled/definition48.js +174 -22
  538. package/unbundled/definition49.cjs +32 -596
  539. package/unbundled/definition49.js +29 -591
  540. package/unbundled/definition5.cjs +9 -3
  541. package/unbundled/definition5.js +15 -7
  542. package/unbundled/definition50.cjs +609 -78
  543. package/unbundled/definition50.js +605 -75
  544. package/unbundled/definition51.cjs +74 -34
  545. package/unbundled/definition51.js +70 -29
  546. package/unbundled/definition52.cjs +59 -24
  547. package/unbundled/definition52.js +57 -18
  548. package/unbundled/definition53.cjs +23 -40
  549. package/unbundled/definition53.js +19 -35
  550. package/unbundled/definition54.cjs +40 -316
  551. package/unbundled/definition54.js +38 -313
  552. package/unbundled/definition55.cjs +305 -196
  553. package/unbundled/definition55.js +301 -191
  554. package/unbundled/definition56.cjs +210 -41
  555. package/unbundled/definition56.js +206 -36
  556. package/unbundled/definition57.cjs +42 -271
  557. package/unbundled/definition57.js +38 -266
  558. package/unbundled/definition58.cjs +286 -51
  559. package/unbundled/definition58.js +283 -46
  560. package/unbundled/definition59.cjs +58 -147
  561. package/unbundled/definition59.js +59 -144
  562. package/unbundled/definition6.cjs +20 -6
  563. package/unbundled/definition6.js +20 -5
  564. package/unbundled/definition60.cjs +129 -226
  565. package/unbundled/definition60.js +126 -222
  566. package/unbundled/definition61.cjs +200 -420
  567. package/unbundled/definition61.js +197 -416
  568. package/unbundled/definition62.cjs +442 -3743
  569. package/unbundled/definition62.js +433 -3570
  570. package/unbundled/definition63.cjs +3729 -729
  571. package/unbundled/definition63.js +3558 -721
  572. package/unbundled/definition64.cjs +784 -98
  573. package/unbundled/definition64.js +781 -94
  574. package/unbundled/definition65.cjs +100 -1003
  575. package/unbundled/definition65.js +98 -997
  576. package/unbundled/definition66.cjs +996 -94
  577. package/unbundled/definition66.js +992 -89
  578. package/unbundled/definition67.cjs +111 -74
  579. package/unbundled/definition67.js +107 -63
  580. package/unbundled/definition68.cjs +69 -157
  581. package/unbundled/definition68.js +65 -152
  582. package/unbundled/definition69.cjs +156 -120
  583. package/unbundled/definition69.js +152 -115
  584. package/unbundled/definition7.cjs +0 -1
  585. package/unbundled/definition7.js +10 -4
  586. package/unbundled/definition70.cjs +154 -50
  587. package/unbundled/definition70.js +150 -45
  588. package/unbundled/definition71.cjs +58 -86
  589. package/unbundled/definition71.js +57 -81
  590. package/unbundled/definition72.cjs +99 -20
  591. package/unbundled/definition72.js +98 -15
  592. package/unbundled/definition73.cjs +20 -89
  593. package/unbundled/definition73.js +16 -84
  594. package/unbundled/definition74.cjs +79 -296
  595. package/unbundled/definition74.js +73 -217
  596. package/unbundled/definition75.cjs +291 -312
  597. package/unbundled/definition75.js +221 -306
  598. package/unbundled/definition76.cjs +328 -27
  599. package/unbundled/definition76.js +320 -23
  600. package/unbundled/definition77.cjs +27 -125
  601. package/unbundled/definition77.js +23 -120
  602. package/unbundled/definition78.cjs +120 -233
  603. package/unbundled/definition78.js +116 -228
  604. package/unbundled/definition79.cjs +258 -26
  605. package/unbundled/definition79.js +249 -23
  606. package/unbundled/definition8.cjs +17 -10
  607. package/unbundled/definition8.js +17 -9
  608. package/unbundled/definition80.cjs +29 -149
  609. package/unbundled/definition80.js +27 -134
  610. package/unbundled/definition81.cjs +118 -174
  611. package/unbundled/definition81.js +109 -169
  612. package/unbundled/definition82.cjs +180 -477
  613. package/unbundled/definition82.js +178 -472
  614. package/unbundled/definition83.cjs +517 -0
  615. package/unbundled/definition83.js +498 -0
  616. package/unbundled/definition9.cjs +4 -3
  617. package/unbundled/definition9.js +4 -2
  618. package/unbundled/delegates-aria.cjs +4 -2
  619. package/unbundled/delegates-aria.js +4 -2
  620. package/unbundled/divider.cjs +8 -3
  621. package/unbundled/divider.js +3 -3
  622. package/unbundled/en-US.cjs +34 -33
  623. package/unbundled/en-US.js +34 -33
  624. package/unbundled/feedback-message.cjs +59 -0
  625. package/unbundled/feedback-message.js +48 -0
  626. package/unbundled/form-associated.cjs +1 -4
  627. package/unbundled/form-associated.js +1 -3
  628. package/unbundled/form-element.cjs +0 -1
  629. package/unbundled/icon.cjs +0 -1
  630. package/unbundled/kbd-shortcut.cjs +0 -1
  631. package/unbundled/linkable.cjs +0 -1
  632. package/unbundled/listbox.cjs +0 -2
  633. package/unbundled/listbox.js +0 -1
  634. package/unbundled/localized.cjs +0 -1
  635. package/unbundled/mixins.cjs +3 -54
  636. package/unbundled/mixins.js +3 -47
  637. package/unbundled/numberConverter.cjs +8 -3
  638. package/unbundled/numberConverter.js +8 -3
  639. package/unbundled/optgroup.cjs +0 -1
  640. package/unbundled/option.cjs +8 -1
  641. package/unbundled/option.js +3 -1
  642. package/unbundled/picker-field.template.cjs +1 -2
  643. package/unbundled/picker-field.template.js +1 -1
  644. package/unbundled/randomId.cjs +0 -1
  645. package/unbundled/{chunk.cjs → rolldown-runtime.cjs} +1 -1
  646. package/unbundled/scrollIntoView.cjs +0 -1
  647. package/unbundled/scrollIntoView.js +0 -1
  648. package/unbundled/slider.template.cjs +340 -2
  649. package/unbundled/slider.template.js +338 -5
  650. package/unbundled/text-field.cjs +1 -1
  651. package/unbundled/text-field.js +1 -1
  652. package/unbundled/time-selection-picker.template.cjs +2 -3
  653. package/unbundled/time-selection-picker.template.js +2 -2
  654. package/unbundled/vivid-element.cjs +63 -4
  655. package/unbundled/vivid-element.js +63 -3
  656. package/unbundled/with-contextual-help.cjs +0 -1
  657. package/unbundled/with-error-text.cjs +0 -1
  658. package/unbundled/with-success-text.cjs +0 -1
  659. package/video-player/definition.cjs +1 -1
  660. package/video-player/definition.js +1 -1
  661. package/video-player/index.cjs +31 -31
  662. package/video-player/index.js +2094 -2085
  663. package/visually-hidden/index.cjs +1 -1
  664. package/vivid.api.json +488 -1165
  665. package/lib/accordion/variations.browser-spec.d.ts +0 -1
  666. package/lib/action-group/variations.browser-spec.d.ts +0 -1
  667. package/lib/alert/variations.browser-spec.d.ts +0 -1
  668. package/lib/audio-player/variations.browser-spec.d.ts +0 -1
  669. package/lib/avatar/variations.browser-spec.d.ts +0 -1
  670. package/lib/badge/variations.browser-spec.d.ts +0 -1
  671. package/lib/banner/variations.browser-spec.d.ts +0 -1
  672. package/lib/breadcrumb-item/variations.browser-spec.d.ts +0 -1
  673. package/lib/button/variations.browser-spec.d.ts +0 -1
  674. package/lib/calendar/variations.browser-spec.d.ts +0 -1
  675. package/lib/calendar-event/variations.browser-spec.d.ts +0 -1
  676. package/lib/card/variations.browser-spec.d.ts +0 -1
  677. package/lib/checkbox/variations.browser-spec.d.ts +0 -1
  678. package/lib/color-picker/variations.browser-spec.d.ts +0 -1
  679. package/lib/combobox/variations.browser-spec.d.ts +0 -1
  680. package/lib/contextual-help/variations.browser-spec.d.ts +0 -1
  681. package/lib/country/variations.browser-spec.d.ts +0 -1
  682. package/lib/data-grid/variations.browser-spec.d.ts +0 -1
  683. package/lib/date-picker/variations.browser-spec.d.ts +0 -1
  684. package/lib/date-range-picker/variations.browser-spec.d.ts +0 -1
  685. package/lib/date-time-picker/variations.browser-spec.d.ts +0 -1
  686. package/lib/dial-pad/variations.browser-spec.d.ts +0 -1
  687. package/lib/dialog/variations.browser-spec.d.ts +0 -1
  688. package/lib/divider/variations.browser-spec.d.ts +0 -1
  689. package/lib/empty-state/variations.browser-spec.d.ts +0 -1
  690. package/lib/fab/variations.browser-spec.d.ts +0 -1
  691. package/lib/file-picker/variations.browser-spec.d.ts +0 -1
  692. package/lib/flag/variations.browser-spec.d.ts +0 -1
  693. package/lib/header/variations.browser-spec.d.ts +0 -1
  694. package/lib/icon/variations.browser-spec.d.ts +0 -1
  695. package/lib/kbd-key/variations.browser-spec.d.ts +0 -1
  696. package/lib/kbd-shortcut/variations.browser-spec.d.ts +0 -1
  697. package/lib/layout/variations.browser-spec.d.ts +0 -1
  698. package/lib/listbox/variations.browser-spec.d.ts +0 -1
  699. package/lib/menu/variations.browser-spec.d.ts +0 -1
  700. package/lib/menu-item/variations.browser-spec.d.ts +0 -1
  701. package/lib/nav/variations.browser-spec.d.ts +0 -1
  702. package/lib/nav-disclosure/variations.browser-spec.d.ts +0 -1
  703. package/lib/nav-item/variations.browser-spec.d.ts +0 -1
  704. package/lib/note/variations.browser-spec.d.ts +0 -1
  705. package/lib/number-field/variations.browser-spec.d.ts +0 -1
  706. package/lib/optgroup/variations.browser-spec.d.ts +0 -1
  707. package/lib/option/variations.browser-spec.d.ts +0 -1
  708. package/lib/pagination/variations.browser-spec.d.ts +0 -1
  709. package/lib/popover/variations.browser-spec.d.ts +0 -1
  710. package/lib/progress/variations.browser-spec.d.ts +0 -1
  711. package/lib/progress-ring/variations.browser-spec.d.ts +0 -1
  712. package/lib/radio/variations.browser-spec.d.ts +0 -1
  713. package/lib/radio-group/variations.browser-spec.d.ts +0 -1
  714. package/lib/range-slider/variations.browser-spec.d.ts +0 -1
  715. package/lib/rich-text-editor/variations.browser-spec.d.ts +0 -1
  716. package/lib/rich-text-view/variations.browser-spec.d.ts +0 -1
  717. package/lib/searchable-select/variations.browser-spec.d.ts +0 -1
  718. package/lib/select/variations.browser-spec.d.ts +0 -1
  719. package/lib/selectable-box/variations.browser-spec.d.ts +0 -1
  720. package/lib/side-drawer/variations.browser-spec.d.ts +0 -1
  721. package/lib/simple-color-picker/variations.browser-spec.d.ts +0 -1
  722. package/lib/slider/variations.browser-spec.d.ts +0 -1
  723. package/lib/split-button/variations.browser-spec.d.ts +0 -1
  724. package/lib/status/variations.browser-spec.d.ts +0 -1
  725. package/lib/switch/variations.browser-spec.d.ts +0 -1
  726. package/lib/table/variations.browser-spec.d.ts +0 -1
  727. package/lib/tabs/variations.browser-spec.d.ts +0 -1
  728. package/lib/tag/variations.browser-spec.d.ts +0 -1
  729. package/lib/text-area/variations.browser-spec.d.ts +0 -1
  730. package/lib/text-field/variations.browser-spec.d.ts +0 -1
  731. package/lib/time-picker/variations.browser-spec.d.ts +0 -1
  732. package/lib/toggletip/variations.browser-spec.d.ts +0 -1
  733. package/lib/tooltip/variations.browser-spec.d.ts +0 -1
  734. package/lib/tree-item/variations.browser-spec.d.ts +0 -1
  735. package/lib/video-player/variations.browser-spec.d.ts +0 -1
  736. /package/lib/{accordion-item/variations.browser-spec.d.ts → form-field/index.d.ts} +0 -0
  737. /package/unbundled/{chunk.js → rolldown-runtime.js} +0 -0
package/bundled/when.cjs CHANGED
@@ -1 +1 @@
1
- const e=require(`./vivid-element.cjs`);var t=()=>null;function n(n){return n===void 0?t:e.I(n)?n:()=>n}function r(t,r,i){let a=e.I(t)?t:()=>t,o=n(r),s=n(i);return(e,t)=>a(e,t)?o(e,t):s(e,t)}Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return r}});
1
+ const e=require("./vivid-element.cjs");var t=()=>null;function n(n){return n===void 0?t:e.I(n)?n:()=>n}function r(t,r,i){let a=e.I(t)?t:()=>t,o=n(r),s=n(i);return(e,t)=>a(e,t)?o(e,t):s(e,t)}Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return r}});
package/bundled/when.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import { I as e } from "./vivid-element.js";
2
- //#region ../../node_modules/.pnpm/@microsoft+fast-element@2.10.4/node_modules/@microsoft/fast-element/dist/esm/templating/when.js
2
+ //#region ../../node_modules/.pnpm/@microsoft+fast-element@2.10.5/node_modules/@microsoft/fast-element/dist/esm/templating/when.js
3
3
  var t = () => null;
4
4
  function n(n) {
5
5
  return n === void 0 ? t : e(n) ? n : () => n;
@@ -1 +1 @@
1
- const e=require(`./vivid-element.cjs`),t=require(`./decorate.cjs`);var n=n=>{class r extends n{get _hasContextualHelp(){return(this._contextualHelpSlottedContent?.length??0)>0}_isFromContextualHelp(e){return e.composedPath().some(e=>e instanceof Element?e.closest(`[slot="contextual-help"],[data-vvd-component="contextual-help"]`):!1)}}return t.t([e.A],r.prototype,`_contextualHelpSlottedContent`,void 0),r};Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return n}});
1
+ const e=require("./vivid-element.cjs"),t=require("./decorate.cjs");var n=n=>{class r extends n{get _hasContextualHelp(){return(this._contextualHelpSlottedContent?.length??0)>0}_isFromContextualHelp(e){return e.composedPath().some(e=>e instanceof Element&&e.closest(`[slot="contextual-help"],[data-vvd-component="contextual-help"]`))}}return t.t([e.A],r.prototype,`_contextualHelpSlottedContent`,void 0),r};Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return n}});
@@ -7,7 +7,7 @@ var n = (n) => {
7
7
  return (this._contextualHelpSlottedContent?.length ?? 0) > 0;
8
8
  }
9
9
  _isFromContextualHelp(e) {
10
- return e.composedPath().some((e) => e instanceof Element ? e.closest("[slot=\"contextual-help\"],[data-vvd-component=\"contextual-help\"]") : !1);
10
+ return e.composedPath().some((e) => e instanceof Element && e.closest("[slot=\"contextual-help\"],[data-vvd-component=\"contextual-help\"]"));
11
11
  }
12
12
  }
13
13
  return t([e], r.prototype, "_contextualHelpSlottedContent", void 0), r;
@@ -1 +1 @@
1
- const e=require(`./vivid-element.cjs`),t=require(`./decorate.cjs`);var n=n=>{class r extends n{errorTextChanged(e,t){t?this.#n(t):this.#r()}#e=!1;#t;constructor(...e){super(...e),this.#t=this.validate,this.validate=()=>{this.#e||this.#t()}}#n(e){this.setValidity({customError:!0},e,this.control),this.errorValidationMessage=e,this.#e=!0}#r(){this.setValidity({},``,this.control),this.#e=!1,this.validate()}}return t.t([e.m({attribute:`error-text`})],r.prototype,`errorText`,void 0),r};Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return n}});
1
+ const e=require("./vivid-element.cjs"),t=require("./decorate.cjs");var n=n=>{class r extends n{errorTextChanged(e,t){t?this.#n(t):this.#r()}#e=!1;#t;constructor(...e){super(...e),this.#t=this.validate,this.validate=()=>{this.#e||this.#t()}}#n(e){this.setValidity({customError:!0},e,this.control),this.errorValidationMessage=e,this.#e=!0}#r(){this.setValidity({},``,this.control),this.#e=!1,this.validate()}}return t.t([e.m({attribute:`error-text`})],r.prototype,`errorText`,void 0),r};Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return n}});
@@ -1 +1 @@
1
- const e=require(`./vivid-element.cjs`),t=require(`./decorate.cjs`);var n=n=>{class r extends n{}return t.t([e.m({attribute:`success-text`})],r.prototype,`successText`,void 0),r};Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return n}});
1
+ const e=require("./vivid-element.cjs"),t=require("./decorate.cjs");var n=n=>{class r extends n{}return t.t([e.m({attribute:`success-text`})],r.prototype,`successText`,void 0),r};Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return n}});
package/button/index.cjs CHANGED
@@ -1 +1 @@
1
- require(`../bundled/definition6.cjs`).n();
1
+ require("../bundled/definition5.cjs").n();
package/button/index.js CHANGED
@@ -1,4 +1,4 @@
1
- import { n as e } from "../bundled/definition6.js";
1
+ import { n as e } from "../bundled/definition5.js";
2
2
  //#region src/lib/button/index.ts
3
3
  e();
4
4
  //#endregion
@@ -1,4 +1,4 @@
1
- const e=require(`../bundled/vivid-element.cjs`),t=require(`../bundled/repeat.cjs`),n=require(`../bundled/enums.cjs`),r=require(`../bundled/decorate.cjs`),i=require(`../bundled/class-names.cjs`),a=require(`../bundled/calendar-event.cjs`);var o=`:host{block-size:inherit;max-block-size:inherit;display:block;overflow:auto}ol{margin:0;padding:0;list-style:none}[role=grid i]{z-index:0;grid-template-columns:min-content auto;grid-template-areas:"filler column-headers""row-headers calendar";inline-size:max(100%,500px);min-inline-size:880px;margin:auto;display:grid;position:relative}.row-headers{grid-area:row-headers;grid-template-rows:repeat(24,1fr);margin-inline-end:2px;display:grid}.row-headers>[role=rowheader i]{justify-content:flex-end;align-items:flex-end;display:flex}.row-headers>[role=rowheader i]>time{font:var(--vvd-typography-base-condensed);text-transform:uppercase;white-space:nowrap;font-size:small;line-height:1}.sticky-column .row-headers,.sticky-all .row-headers{z-index:1;background-color:var(--calendar-column-background-color,var(--vvd-color-canvas));margin-inline-end:3px;position:sticky;inset-inline-start:0}.calendar-row{display:contents}.calendar-grid-presentation{background:var(--vvd-color-surface-2dp);counter-reset:listing;filter:var(--vvd-shadow-surface-2dp);border-radius:8px;grid-template:repeat(24,1fr)/repeat(7,1fr);grid-area:calendar;grid-auto-flow:column;gap:1px;display:grid;overflow:hidden}.hours{display:contents}.hours>[role=listitem i]{grid-column:1/8;grid-row:var(--row);min-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 8));pointer-events:none;position:relative}.hours>[role=listitem i]:not(:first-child):after{border-block-end:var(--vvd-color-neutral-100) 1px solid;content:"";inline-size:100%;margin-block-start:-1px;position:absolute}.hours>[role=listitem i]:nth-child(24n+1){--row:1}.hours>[role=listitem i]:nth-child(24n+2){--row:2}.hours>[role=listitem i]:nth-child(24n+3){--row:3}.hours>[role=listitem i]:nth-child(24n+4){--row:4}.hours>[role=listitem i]:nth-child(24n+5){--row:5}.hours>[role=listitem i]:nth-child(24n+6){--row:6}.hours>[role=listitem i]:nth-child(24n+7){--row:7}.hours>[role=listitem i]:nth-child(24n+8){--row:8}.hours>[role=listitem i]:nth-child(24n+9){--row:9}.hours>[role=listitem i]:nth-child(24n+10){--row:10}.hours>[role=listitem i]:nth-child(24n+11){--row:11}.hours>[role=listitem i]:nth-child(24n+12){--row:12}.hours>[role=listitem i]:nth-child(24n+13){--row:13}.hours>[role=listitem i]:nth-child(24n+14){--row:14}.hours>[role=listitem i]:nth-child(24n+15){--row:15}.hours>[role=listitem i]:nth-child(24n+16){--row:16}.hours>[role=listitem i]:nth-child(24n+17){--row:17}.hours>[role=listitem i]:nth-child(24n+18){--row:18}.hours>[role=listitem i]:nth-child(24n+19){--row:19}.hours>[role=listitem i]:nth-child(24n+20){--row:20}.hours>[role=listitem i]:nth-child(24n+21){--row:21}.hours>[role=listitem i]:nth-child(24n+22){--row:22}.hours>[role=listitem i]:nth-child(24n+23){--row:23}.hours>[role=listitem i]:nth-child(24n+24){--row:24}[role=gridcell i]{grid-auto-flow:column;gap:1px;display:grid}[role=gridcell i],[role=columnheader i],[role=columnheader i] [role=button i]{position:relative}[role=gridcell i]:before,[role=columnheader i]:before,[role=columnheader i] [role=button i]:before{z-index:-1;background-color:var(--vvd-color-information-400);content:"";position:absolute;inset:0}[role=gridcell i]:focus,[role=columnheader i]:focus,[role=columnheader i] [role=button i]:focus{outline:none}[role=gridcell i]:not(:focus-visible):before,[role=columnheader i]:not(:focus-visible):before,[role=columnheader i] [role=button i]:not(:focus-visible):before{display:none}.columns{display:contents}.columns>[role=gridcell i]{grid-column:var(--column);grid-row:1/25;position:relative}.columns>[role=gridcell i]:first-child{--column:1}.columns>[role=gridcell i]:nth-child(2){--column:2}.columns>[role=gridcell i]:nth-child(3){--column:3}.columns>[role=gridcell i]:nth-child(4){--column:4}.columns>[role=gridcell i]:nth-child(5){--column:5}.columns>[role=gridcell i]:nth-child(6){--column:6}.columns>[role=gridcell i]:nth-child(7){--column:7}.columns>[role=gridcell i]:not(:first-child):after{border-inline-end:var(--vvd-color-neutral-100) 1px solid;content:"";block-size:100%;margin-inline-start:-1px;position:absolute}.column-headers{grid-area:column-headers;grid-template-columns:repeat(7,1fr);display:grid}.column-headers [role=columnheader i] h2{font:var(--vvd-typography-heading-4);grid-template-columns:1fr auto 1fr;align-items:baseline;margin:0;display:grid}.column-headers [role=columnheader i] h2>em{font:inherit;inline-size:min-content;inset-inline-start:0}.column-headers [role=columnheader i] h2>small{font:var(--vvd-typography-base-condensed);text-transform:uppercase}.sticky-header .column-headers,.sticky-all .column-headers{z-index:1;background-color:var(--calendar-header-background-color,var(--vvd-color-canvas));margin-block-end:3px;position:sticky;inset-block-start:0}.filler{background-color:#0000;grid-area:filler}.sticky-header .filler,.sticky-all .filler,.sticky-column .filler{z-index:2;background-color:var(--calendar-header-background-color,var(--vvd-color-canvas));margin-block-end:3px;position:sticky}.sticky-column .filler{inset-inline-start:0}.sticky-header .filler{inset-block-start:0}.sticky-all .filler{inset-block-start:0;inset-inline-start:0}`,s=`ArrowUp`,c=`ArrowRight`,l=`ArrowDown`,u=`ArrowLeft`;function d(e){return e instanceof HTMLElement&&(e.matches(`[role="gridcell"i]`)||e.matches(`[role="columnheader"i]`))}var f=e=>e.matches(`[role="columnheader"i]`)?`[role="gridcell"i]`:`[role="columnheader"i]`;function p(e,t){if(t.parentNode instanceof HTMLElement)switch(e){case c:return t.nextElementSibling||t.parentNode.firstElementChild;case u:return t.previousElementSibling||t.parentNode.lastElementChild;case s:case l:{let{children:e}=t.parentNode,n=Array.from(e).indexOf(t);return this.shadowRoot.querySelector(`${f(t)}:nth-child(${n+1})`)}}}function m(e,t){if(e!==`ArrowDown`)return;let n=t.closest(`[role="columnheader"i]`),r=this.shadowRoot.querySelectorAll(`[role="columnheader"i]`),i=Array.from(r).indexOf(n);return this.shadowRoot.querySelector(`[role="gridcell"i]:nth-child(${i+1})`)}function h(e){let t=e.closest(`[role="gridcell"i], [role="columnheader"i]`);if(t){let{parentElement:e}=t;if(e)return Array.from(e.children).indexOf(t)}}function g(e,t,n){let r=t.closest(`[role="rowheader"], [role="gridcell"i]`);if(r){let t=r.getBoundingClientRect(),i=(e.clientY-t.y)/(t.height/n);return Math.round((i+2**-52)*100)/100}}var _=function(e){if(!(e instanceof KeyboardEvent||e instanceof MouseEvent))throw Error(`Invalid event. Event must be instance of KeyboardEvent or MouseEvent`);let[t]=e.composedPath();if(!(t instanceof HTMLElement&&this.shadowRoot.contains(t)))throw Error(`Invalid event. Event must contain a target object which is a direct descendant of calendar`);let n=h(t),r;e instanceof MouseEvent&&(r=g(e,t,this._hours));let i={...n!=null&&{day:n},...r!=null&&{hour:r}};return Object.keys(i).length>0?i:null},v=e=>{let t=window.getComputedStyle(e).overflowY,n=window.getComputedStyle(e).overflowX;return{vertical:(t===`auto`||t===`scroll`)&&e.scrollHeight>e.clientHeight,horizontal:(n===`auto`||n===`scroll`)&&e.scrollWidth>e.clientWidth}},y=class extends e.t{constructor(...e){super(...e),this.hour12=!1,this.stickyMode=n.o.All,this._hours=24,this._days=7,this.hoursAsDatetime=Array.from({length:this._hours-1}).fill(new Date(new Date().setHours(0,0,0))).map((e,t)=>new Date(e.setHours(t+1))),this._generateDaysArr=e=>{if(e.length==this._days)return e;let t=new Date(e[e.length-1]);return t.setDate(t.getDate()+1),this._generateDaysArr([...e,t])},this.getEventContext=_}get#e(){let{activeElement:e}=document;return e instanceof a.t?e:null}getCalendarEventContainingCell(e){let t=e.getAttribute(`slot`);return this.shadowRoot.querySelector(`slot[name="${t}"i]`).parentElement}arrowKeysInteractions(e){let{activeElement:t}=this.shadowRoot,n;n=d(t)?p.call(this,e,t):this.#e?this.getCalendarEventContainingCell(this.#e):t?.matches(`em[role="button"i]`)?m.call(this,e,t):this.shadowRoot.querySelector(`[role="columnheader"i]`),this.activateElement(n)}activateElement(e){e?.addEventListener(`blur`,({target:e})=>e.setAttribute(`tabindex`,`-1`),{once:!0}),e?.setAttribute(`tabindex`,`0`),e?.focus()}onKeydown({key:e}){let t=[s,c,l,u].some(t=>t==e);return t&&this.arrowKeysInteractions(e),!t}connectedCallback(){super.connectedCallback(),this.initializeScrollPosition()}initializeScrollPosition(){if(!v(this).vertical)return;let t=this.scrollHeight/this._hours*7;e.M.enqueue(()=>{this.scrollTo({top:t})})}};r.t([e.m],y.prototype,`datetime`,void 0),r.t([e.m({attribute:`start-day`})],y.prototype,`startDay`,void 0),r.t([e.m],y.prototype,`locales`,void 0),r.t([e.m({mode:`boolean`})],y.prototype,`hour12`,void 0),r.t([e.m({attribute:`sticky-mode`,mode:`fromView`})],y.prototype,`stickyMode`,void 0);function b(e){let t=e=>`0${e}`.slice(-2);return`${e.getFullYear()}-${t(e.getMonth()+1)}-${t(e.getDate())}`}var x=new Map([[`sunday`,0],[`monday`,1]]);function S(e=new Date,t){e=new Date(e);let n=x.get(t);n??=1;let r=e.getDate()-(e.getDay()+7-n)%7;return new Date(e.setDate(r))}var C=()=>e.p` <div class="row-headers" role="row">
1
+ const e=require("../bundled/vivid-element.cjs"),t=require("../bundled/repeat.cjs"),n=require("../bundled/enums.cjs"),r=require("../bundled/decorate.cjs"),i=require("../bundled/class-names.cjs"),a=require("../bundled/calendar-event.cjs");var o=`:host{block-size:inherit;max-block-size:inherit;display:block;overflow:auto}ol{margin:0;padding:0;list-style:none}[role=grid i]{z-index:0;grid-template-columns:min-content auto;grid-template-areas:"filler column-headers""row-headers calendar";inline-size:max(100%,500px);min-inline-size:880px;margin:auto;display:grid;position:relative}.row-headers{grid-area:row-headers;grid-template-rows:repeat(24,1fr);margin-inline-end:2px;display:grid}.row-headers>[role=rowheader i]{justify-content:flex-end;align-items:flex-end;display:flex}.row-headers>[role=rowheader i]>time{font:var(--vvd-typography-base-condensed);text-transform:uppercase;white-space:nowrap;font-size:small;line-height:1}.sticky-column .row-headers,.sticky-all .row-headers{z-index:1;background-color:var(--calendar-column-background-color,var(--vvd-color-canvas));margin-inline-end:3px;position:sticky;inset-inline-start:0}.calendar-row{display:contents}.calendar-grid-presentation{background:var(--vvd-color-surface-2dp);counter-reset:listing;filter:var(--vvd-shadow-surface-2dp);border-radius:8px;grid-template:repeat(24,1fr)/repeat(7,1fr);grid-area:calendar;grid-auto-flow:column;gap:1px;display:grid;overflow:hidden}.hours{display:contents}.hours>[role=listitem i]{grid-column:1/8;grid-row:var(--row);min-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 8));pointer-events:none;position:relative}.hours>[role=listitem i]:not(:first-child):after{border-block-end:var(--vvd-color-neutral-100) 1px solid;content:"";inline-size:100%;margin-block-start:-1px;position:absolute}.hours>[role=listitem i]:nth-child(24n+1){--row:1}.hours>[role=listitem i]:nth-child(24n+2){--row:2}.hours>[role=listitem i]:nth-child(24n+3){--row:3}.hours>[role=listitem i]:nth-child(24n+4){--row:4}.hours>[role=listitem i]:nth-child(24n+5){--row:5}.hours>[role=listitem i]:nth-child(24n+6){--row:6}.hours>[role=listitem i]:nth-child(24n+7){--row:7}.hours>[role=listitem i]:nth-child(24n+8){--row:8}.hours>[role=listitem i]:nth-child(24n+9){--row:9}.hours>[role=listitem i]:nth-child(24n+10){--row:10}.hours>[role=listitem i]:nth-child(24n+11){--row:11}.hours>[role=listitem i]:nth-child(24n+12){--row:12}.hours>[role=listitem i]:nth-child(24n+13){--row:13}.hours>[role=listitem i]:nth-child(24n+14){--row:14}.hours>[role=listitem i]:nth-child(24n+15){--row:15}.hours>[role=listitem i]:nth-child(24n+16){--row:16}.hours>[role=listitem i]:nth-child(24n+17){--row:17}.hours>[role=listitem i]:nth-child(24n+18){--row:18}.hours>[role=listitem i]:nth-child(24n+19){--row:19}.hours>[role=listitem i]:nth-child(24n+20){--row:20}.hours>[role=listitem i]:nth-child(24n+21){--row:21}.hours>[role=listitem i]:nth-child(24n+22){--row:22}.hours>[role=listitem i]:nth-child(24n+23){--row:23}.hours>[role=listitem i]:nth-child(24n+24){--row:24}[role=gridcell i]{grid-auto-flow:column;gap:1px;display:grid}[role=gridcell i],[role=columnheader i],[role=columnheader i] [role=button i]{position:relative}[role=gridcell i]:before,[role=columnheader i]:before,[role=columnheader i] [role=button i]:before{z-index:-1;background-color:var(--vvd-color-information-400);content:"";position:absolute;inset:0}[role=gridcell i]:focus,[role=columnheader i]:focus,[role=columnheader i] [role=button i]:focus{outline:none}[role=gridcell i]:not(:focus-visible):before,[role=columnheader i]:not(:focus-visible):before,[role=columnheader i] [role=button i]:not(:focus-visible):before{display:none}.columns{display:contents}.columns>[role=gridcell i]{grid-column:var(--column);grid-row:1/25;position:relative}.columns>[role=gridcell i]:first-child{--column:1}.columns>[role=gridcell i]:nth-child(2){--column:2}.columns>[role=gridcell i]:nth-child(3){--column:3}.columns>[role=gridcell i]:nth-child(4){--column:4}.columns>[role=gridcell i]:nth-child(5){--column:5}.columns>[role=gridcell i]:nth-child(6){--column:6}.columns>[role=gridcell i]:nth-child(7){--column:7}.columns>[role=gridcell i]:not(:first-child):after{border-inline-end:var(--vvd-color-neutral-100) 1px solid;content:"";block-size:100%;margin-inline-start:-1px;position:absolute}.column-headers{grid-area:column-headers;grid-template-columns:repeat(7,1fr);display:grid}.column-headers [role=columnheader i] h2{font:var(--vvd-typography-heading-4);grid-template-columns:1fr auto 1fr;align-items:baseline;margin:0;display:grid}.column-headers [role=columnheader i] h2>em{font:inherit;inline-size:min-content;inset-inline-start:0}.column-headers [role=columnheader i] h2>small{font:var(--vvd-typography-base-condensed);text-transform:uppercase}.sticky-header .column-headers,.sticky-all .column-headers{z-index:1;background-color:var(--calendar-header-background-color,var(--vvd-color-canvas));margin-block-end:3px;position:sticky;inset-block-start:0}.filler{background-color:#0000;grid-area:filler}.sticky-header .filler,.sticky-all .filler,.sticky-column .filler{z-index:2;background-color:var(--calendar-header-background-color,var(--vvd-color-canvas));margin-block-end:3px;position:sticky}.sticky-column .filler{inset-inline-start:0}.sticky-header .filler{inset-block-start:0}.sticky-all .filler{inset-block-start:0;inset-inline-start:0}`,s=`ArrowUp`,c=`ArrowRight`,l=`ArrowDown`,u=`ArrowLeft`;function d(e){return e instanceof HTMLElement&&(e.matches(`[role="gridcell"i]`)||e.matches(`[role="columnheader"i]`))}var f=e=>e.matches(`[role="columnheader"i]`)?`[role="gridcell"i]`:`[role="columnheader"i]`;function p(e,t){if(t.parentNode instanceof HTMLElement)switch(e){case c:return t.nextElementSibling||t.parentNode.firstElementChild;case u:return t.previousElementSibling||t.parentNode.lastElementChild;case s:case l:{let{children:e}=t.parentNode,n=Array.from(e).indexOf(t);return this.shadowRoot.querySelector(`${f(t)}:nth-child(${n+1})`)}}}function m(e,t){if(e!==`ArrowDown`)return;let n=t.closest(`[role="columnheader"i]`),r=this.shadowRoot.querySelectorAll(`[role="columnheader"i]`),i=Array.from(r).indexOf(n);return this.shadowRoot.querySelector(`[role="gridcell"i]:nth-child(${i+1})`)}function h(e){let t=e.closest(`[role="gridcell"i], [role="columnheader"i]`);if(t){let{parentElement:e}=t;if(e)return Array.from(e.children).indexOf(t)}}function g(e,t,n){let r=t.closest(`[role="rowheader"], [role="gridcell"i]`);if(r){let t=r.getBoundingClientRect(),i=(e.clientY-t.y)/(t.height/n);return Math.round((i+2**-52)*100)/100}}var _=function(e){if(!(e instanceof KeyboardEvent||e instanceof MouseEvent))throw Error(`Invalid event. Event must be instance of KeyboardEvent or MouseEvent`);let[t]=e.composedPath();if(!(t instanceof HTMLElement&&this.shadowRoot.contains(t)))throw Error(`Invalid event. Event must contain a target object which is a direct descendant of calendar`);let n=h(t),r;e instanceof MouseEvent&&(r=g(e,t,this._hours));let i={...n!=null&&{day:n},...r!=null&&{hour:r}};return Object.keys(i).length>0?i:null},v=e=>{let t=window.getComputedStyle(e).overflowY,n=window.getComputedStyle(e).overflowX;return{vertical:(t===`auto`||t===`scroll`)&&e.scrollHeight>e.clientHeight,horizontal:(n===`auto`||n===`scroll`)&&e.scrollWidth>e.clientWidth}},y=class extends e.t{constructor(...e){super(...e),this.hour12=!1,this.stickyMode=n.o.All,this._hours=24,this._days=7,this.hoursAsDatetime=Array.from({length:this._hours-1}).fill(new Date(new Date().setHours(0,0,0))).map((e,t)=>new Date(e.setHours(t+1))),this._generateDaysArr=e=>{if(e.length==this._days)return e;let t=new Date(e[e.length-1]);return t.setDate(t.getDate()+1),this._generateDaysArr([...e,t])},this.getEventContext=_}get#e(){let{activeElement:e}=document;return e instanceof a.t?e:null}getCalendarEventContainingCell(e){let t=e.getAttribute(`slot`);return this.shadowRoot.querySelector(`slot[name="${t}"i]`).parentElement}arrowKeysInteractions(e){let{activeElement:t}=this.shadowRoot,n;n=d(t)?p.call(this,e,t):this.#e?this.getCalendarEventContainingCell(this.#e):t?.matches(`em[role="button"i]`)?m.call(this,e,t):this.shadowRoot.querySelector(`[role="columnheader"i]`),this.activateElement(n)}activateElement(e){e?.addEventListener(`blur`,({target:e})=>e.setAttribute(`tabindex`,`-1`),{once:!0}),e?.setAttribute(`tabindex`,`0`),e?.focus()}onKeydown({key:e}){let t=[s,c,l,u].some(t=>t==e);return t&&this.arrowKeysInteractions(e),!t}connectedCallback(){super.connectedCallback(),this.initializeScrollPosition()}initializeScrollPosition(){if(!v(this).vertical)return;let t=this.scrollHeight/this._hours*7;e.M.enqueue(()=>{this.scrollTo({top:t})})}};r.t([e.m],y.prototype,`datetime`,void 0),r.t([e.m({attribute:`start-day`})],y.prototype,`startDay`,void 0),r.t([e.m],y.prototype,`locales`,void 0),r.t([e.m({mode:`boolean`})],y.prototype,`hour12`,void 0),r.t([e.m({attribute:`sticky-mode`,mode:`fromView`})],y.prototype,`stickyMode`,void 0);function b(e){let t=e=>`0${e}`.slice(-2);return`${e.getFullYear()}-${t(e.getMonth()+1)}-${t(e.getDate())}`}var x=new Map([[`sunday`,0],[`monday`,1]]);function S(e=new Date,t){e=new Date(e);let n=x.get(t);n??=1;let r=e.getDate()-(e.getDay()+7-n)%7;return new Date(e.setDate(r))}var C=()=>e.p` <div class="row-headers" role="row">
2
2
  ${t.n(e=>e.hoursAsDatetime,e.p`<span role="rowheader">
3
3
  <time
4
4
  datetime="${(e,t)=>new Intl.DateTimeFormat(t.parent.locales,{hour:`numeric`,minute:`numeric`,hour12:!1}).format(e)}"
package/calendar/index.js CHANGED
@@ -114,7 +114,7 @@ function T(e) {
114
114
  let t = (e) => `0${e}`.slice(-2);
115
115
  return `${e.getFullYear()}-${t(e.getMonth() + 1)}-${t(e.getDate())}`;
116
116
  }
117
- var E = new Map([["sunday", 0], ["monday", 1]]);
117
+ var E = /* @__PURE__ */ new Map([["sunday", 0], ["monday", 1]]);
118
118
  function D(e = /* @__PURE__ */ new Date(), t) {
119
119
  e = new Date(e);
120
120
  let n = E.get(t);
@@ -166,10 +166,7 @@ var O = () => r` <div class="row-headers" role="row">
166
166
  <div role="gridcell" tabindex="-1">
167
167
  <slot name="day-${(e, t) => t.index}"></slot>
168
168
  </div>
169
- `;
170
- //#endregion
171
- //#region src/lib/calendar/index.ts
172
- t(a("calendar", w, r`
169
+ `, j = r`
173
170
  <div
174
171
  role="grid"
175
172
  class="${(e) => l([`sticky-${e.stickyMode}`, !!e.stickyMode])}"
@@ -190,8 +187,11 @@ t(a("calendar", w, r`
190
187
  </div>
191
188
  </div>
192
189
  </div>
193
- `, [], {
190
+ `, M = a("calendar", w, j, [], {
194
191
  styles: d,
195
192
  shadowOptions: { delegatesFocus: !0 }
196
- }))();
193
+ });
194
+ //#endregion
195
+ //#region src/lib/calendar/index.ts
196
+ t(M)();
197
197
  //#endregion
@@ -1,6 +1,6 @@
1
- const e=require(`../bundled/vivid-element.cjs`),t=require(`../bundled/when.cjs`),n=require(`../bundled/class-names.cjs`),r=require(`../bundled/delegates-aria.cjs`),i=require(`../bundled/calendar-event.cjs`);var a=`:host{display:contents}.base.connotation-accent{--_connotation-color-primary:var(--vvd-calendar-event-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-calendar-event-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-contrast:var(--vvd-calendar-event-accent-contrast,var(--vvd-color-neutral-800));--_connotation-color-soft:var(--vvd-calendar-event-accent-soft,var(--vvd-color-neutral-100))}.base.connotation-cta{--_connotation-color-primary:var(--vvd-calendar-event-cta-primary,var(--vvd-color-cta-500));--_connotation-color-primary-text:var(--vvd-calendar-event-cta-primary-text,var(--vvd-color-canvas));--_connotation-color-contrast:var(--vvd-calendar-event-cta-contrast,var(--vvd-color-cta-800));--_connotation-color-soft:var(--vvd-calendar-event-cta-soft,var(--vvd-color-cta-100))}.base.connotation-success{--_connotation-color-primary:var(--vvd-calendar-event-success-primary,var(--vvd-color-success-500));--_connotation-color-primary-text:var(--vvd-calendar-event-success-primary-text,var(--vvd-color-canvas));--_connotation-color-contrast:var(--vvd-calendar-event-success-contrast,var(--vvd-color-success-800));--_connotation-color-soft:var(--vvd-calendar-event-success-soft,var(--vvd-color-success-100))}.base.connotation-alert{--_connotation-color-primary:var(--vvd-calendar-event-alert-primary,var(--vvd-color-alert-500));--_connotation-color-primary-text:var(--vvd-calendar-event-alert-primary-text,var(--vvd-color-canvas));--_connotation-color-contrast:var(--vvd-calendar-event-alert-contrast,var(--vvd-color-alert-800));--_connotation-color-soft:var(--vvd-calendar-event-alert-soft,var(--vvd-color-alert-100))}.base.connotation-warning{--_connotation-color-primary:var(--vvd-calendar-event-warning-primary,var(--vvd-color-warning-300));--_connotation-color-primary-text:var(--vvd-calendar-event-warning-primary-text,var(--vvd-color-canvas-text));--_connotation-color-contrast:var(--vvd-calendar-event-warning-contrast,var(--vvd-color-warning-800));--_connotation-color-soft:var(--vvd-calendar-event-warning-soft,var(--vvd-color-warning-100))}.base.connotation-announcement{--_connotation-color-primary:var(--vvd-calendar-event-announcement-primary,var(--vvd-color-announcement-500));--_connotation-color-primary-text:var(--vvd-calendar-event-announcement-primary-text,var(--vvd-color-canvas));--_connotation-color-contrast:var(--vvd-calendar-event-announcement-contrast,var(--vvd-color-announcement-800));--_connotation-color-soft:var(--vvd-calendar-event-announcement-soft,var(--vvd-color-announcement-100))}.base:not(.connotation-accent,.connotation-cta,.connotation-success,.connotation-alert,.connotation-warning,.connotation-announcement){--_connotation-color-primary:var(--vvd-calendar-event-information-primary,var(--vvd-color-information-500));--_connotation-color-primary-text:var(--vvd-calendar-event-information-primary-text,var(--vvd-color-canvas));--_connotation-color-contrast:var(--vvd-calendar-event-information-contrast,var(--vvd-color-information-800));--_connotation-color-soft:var(--vvd-calendar-event-information-soft,var(--vvd-color-information-100))}.base{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary);--_appearance-color-outline:transparent}.base.appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.base{--vvd-calendar-event--indent:calc(0px + var(--vvd-calendar-event--overlap-count,0) * 8px);--focus-stroke-gap-color:transparent;z-index:var(--vvd-calendar-event--overlap-count);top:calc(var(--vvd-calendar-event--start,0) * (100% - 23px) / 24 + calc(1px * var(--vvd-calendar-event--start,0)));box-sizing:border-box;background-color:var(--_appearance-color-fill);block-size:calc(var(--vvd-calendar-event--duration,1) * calc((100% - 23px) / 24) + calc(1px * (var(--vvd-calendar-event--duration,1) - 1)) - 4px);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);color:var(--_appearance-color-text);inline-size:calc(100% - 8px - min(var(--vvd-calendar-event--indent), 32px));margin-block-start:2px;margin-inline:min(var(--vvd-calendar-event--indent), 32px) 8px;max-block-size:calc(100% - calc(var(--vvd-calendar-event--start,0) * (100% - 23px) / 24 + calc(1px * var(--vvd-calendar-event--start,0))) - 4px);border-radius:8px;padding:4px 8px;position:absolute;overflow:hidden}@supports (contain:content){.base{contain:strict}}@supports not (contain:content){.base{overflow:hidden}}.base:focus{box-shadow:0 0 0 4px color-mix(in sRGB, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px));z-index:2000}:host([overlap-count]) .base{--focus-stroke-gap-color:var(--vvd-color-canvas)}:host([overlap-count]) .base:not(:focus){box-shadow:inset 0 0 0 1px var(--vvd-color-canvas)}h2{font:var(--vvd-typography-base-condensed-bold);margin:0}h2>strong{font:inherit}p{font:var(--vvd-typography-base-condensed);margin:0}`,o=e.p` <div
1
+ const e=require("../bundled/vivid-element.cjs"),t=require("../bundled/when.cjs"),n=require("../bundled/class-names.cjs"),r=require("../bundled/delegates-aria.cjs"),i=require("../bundled/calendar-event.cjs");var a=`:host{display:contents}.base{--vvd-calendar-event--indent:calc(0px + var(--vvd-calendar-event--overlap-count,0) * 8px);--focus-stroke-gap-color:transparent;z-index:var(--vvd-calendar-event--overlap-count);top:calc(var(--vvd-calendar-event--start,0) * (100% - 23px) / 24 + calc(1px * var(--vvd-calendar-event--start,0)));box-sizing:border-box;background-color:var(--_appearance-color-fill);block-size:calc(var(--vvd-calendar-event--duration,1) * calc((100% - 23px) / 24) + calc(1px * (var(--vvd-calendar-event--duration,1) - 1)) - 4px);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);color:var(--_appearance-color-text);inline-size:calc(100% - 8px - min(var(--vvd-calendar-event--indent), 32px));margin-block-start:2px;margin-inline:min(var(--vvd-calendar-event--indent), 32px) 8px;max-block-size:calc(100% - calc(var(--vvd-calendar-event--start,0) * (100% - 23px) / 24 + calc(1px * var(--vvd-calendar-event--start,0))) - 4px);border-radius:8px;padding:4px 8px;position:absolute;overflow:hidden}@supports (contain:content){.base{contain:strict}}@supports not (contain:content){.base{overflow:hidden}}.base:focus{box-shadow:0 0 0 4px color-mix(in sRGB, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px));z-index:2000}:host([overlap-count]) .base{--focus-stroke-gap-color:var(--vvd-color-canvas)}:host([overlap-count]) .base:not(:focus){box-shadow:inset 0 0 0 1px var(--vvd-color-canvas)}h2{font:var(--vvd-typography-base-condensed-bold);margin:0}h2>strong{font:inherit}p{font:var(--vvd-typography-base-condensed);margin:0}`,o=e.p` <div
2
2
  style="${({start:e,duration:t,overlapCount:n})=>{let r={...n&&{"--vvd-calendar-event--overlap-count":n},...e&&{"--vvd-calendar-event--start":e},...t&&{"--vvd-calendar-event--duration":t}};return Object.entries(r).map(e=>e.join(`:`)).join(`;`)}}"
3
- class="${e=>n.t(`base`,[`connotation-${e.connotation}`,!!e.connotation],[`appearance-${e.appearance}`,!!e.appearance])}"
3
+ class="${e=>n.t(`base`,`connotation-${i.r.parse(e.connotation)}`,`appearance-${i.n.parse(e.appearance)}`,`with-idle`)}"
4
4
  tabindex="0"
5
5
  ${r.n({role:`button`})}
6
6
  >
@@ -2,10 +2,9 @@ import { d as e, p as t, u as n } from "../bundled/vivid-element.js";
2
2
  import { t as r } from "../bundled/when.js";
3
3
  import { t as i } from "../bundled/class-names.js";
4
4
  import { n as a } from "../bundled/delegates-aria.js";
5
- import { t as o } from "../bundled/calendar-event.js";
6
- //#endregion
7
- //#region src/lib/calendar-event/index.ts
8
- e(n("calendar-event", o, t` <div
5
+ import { n as o, r as s, t as c } from "../bundled/calendar-event.js";
6
+ //#region src/lib/calendar-event/calendar-event.scss?inline
7
+ var l = ":host{display:contents}.base{--vvd-calendar-event--indent:calc(0px + var(--vvd-calendar-event--overlap-count,0) * 8px);--focus-stroke-gap-color:transparent;z-index:var(--vvd-calendar-event--overlap-count);top:calc(var(--vvd-calendar-event--start,0) * (100% - 23px) / 24 + calc(1px * var(--vvd-calendar-event--start,0)));box-sizing:border-box;background-color:var(--_appearance-color-fill);block-size:calc(var(--vvd-calendar-event--duration,1) * calc((100% - 23px) / 24) + calc(1px * (var(--vvd-calendar-event--duration,1) - 1)) - 4px);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);color:var(--_appearance-color-text);inline-size:calc(100% - 8px - min(var(--vvd-calendar-event--indent), 32px));margin-block-start:2px;margin-inline:min(var(--vvd-calendar-event--indent), 32px) 8px;max-block-size:calc(100% - calc(var(--vvd-calendar-event--start,0) * (100% - 23px) / 24 + calc(1px * var(--vvd-calendar-event--start,0))) - 4px);border-radius:8px;padding:4px 8px;position:absolute;overflow:hidden}@supports (contain:content){.base{contain:strict}}@supports not (contain:content){.base{overflow:hidden}}.base:focus{box-shadow:0 0 0 4px color-mix(in sRGB, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px));z-index:2000}:host([overlap-count]) .base{--focus-stroke-gap-color:var(--vvd-color-canvas)}:host([overlap-count]) .base:not(:focus){box-shadow:inset 0 0 0 1px var(--vvd-color-canvas)}h2{font:var(--vvd-typography-base-condensed-bold);margin:0}h2>strong{font:inherit}p{font:var(--vvd-typography-base-condensed);margin:0}", u = t` <div
9
8
  style="${({ start: e, duration: t, overlapCount: n }) => {
10
9
  let r = {
11
10
  ...n && { "--vvd-calendar-event--overlap-count": n },
@@ -14,14 +13,17 @@ e(n("calendar-event", o, t` <div
14
13
  };
15
14
  return Object.entries(r).map((e) => e.join(":")).join(";");
16
15
  }}"
17
- class="${(e) => i("base", [`connotation-${e.connotation}`, !!e.connotation], [`appearance-${e.appearance}`, !!e.appearance])}"
16
+ class="${(e) => i("base", `connotation-${s.parse(e.connotation)}`, `appearance-${o.parse(e.appearance)}`, "with-idle")}"
18
17
  tabindex="0"
19
18
  ${a({ role: "button" })}
20
19
  >
21
20
  ${r((e) => e.heading, t`<h2><strong>${(e) => e.heading}</strong></h2>`)}
22
21
  ${r((e) => e.description, t`<p>${(e) => e.description}</p>`)}
23
- </div>`, [], {
24
- styles: ":host{display:contents}.base.connotation-accent{--_connotation-color-primary:var(--vvd-calendar-event-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-calendar-event-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-contrast:var(--vvd-calendar-event-accent-contrast,var(--vvd-color-neutral-800));--_connotation-color-soft:var(--vvd-calendar-event-accent-soft,var(--vvd-color-neutral-100))}.base.connotation-cta{--_connotation-color-primary:var(--vvd-calendar-event-cta-primary,var(--vvd-color-cta-500));--_connotation-color-primary-text:var(--vvd-calendar-event-cta-primary-text,var(--vvd-color-canvas));--_connotation-color-contrast:var(--vvd-calendar-event-cta-contrast,var(--vvd-color-cta-800));--_connotation-color-soft:var(--vvd-calendar-event-cta-soft,var(--vvd-color-cta-100))}.base.connotation-success{--_connotation-color-primary:var(--vvd-calendar-event-success-primary,var(--vvd-color-success-500));--_connotation-color-primary-text:var(--vvd-calendar-event-success-primary-text,var(--vvd-color-canvas));--_connotation-color-contrast:var(--vvd-calendar-event-success-contrast,var(--vvd-color-success-800));--_connotation-color-soft:var(--vvd-calendar-event-success-soft,var(--vvd-color-success-100))}.base.connotation-alert{--_connotation-color-primary:var(--vvd-calendar-event-alert-primary,var(--vvd-color-alert-500));--_connotation-color-primary-text:var(--vvd-calendar-event-alert-primary-text,var(--vvd-color-canvas));--_connotation-color-contrast:var(--vvd-calendar-event-alert-contrast,var(--vvd-color-alert-800));--_connotation-color-soft:var(--vvd-calendar-event-alert-soft,var(--vvd-color-alert-100))}.base.connotation-warning{--_connotation-color-primary:var(--vvd-calendar-event-warning-primary,var(--vvd-color-warning-300));--_connotation-color-primary-text:var(--vvd-calendar-event-warning-primary-text,var(--vvd-color-canvas-text));--_connotation-color-contrast:var(--vvd-calendar-event-warning-contrast,var(--vvd-color-warning-800));--_connotation-color-soft:var(--vvd-calendar-event-warning-soft,var(--vvd-color-warning-100))}.base.connotation-announcement{--_connotation-color-primary:var(--vvd-calendar-event-announcement-primary,var(--vvd-color-announcement-500));--_connotation-color-primary-text:var(--vvd-calendar-event-announcement-primary-text,var(--vvd-color-canvas));--_connotation-color-contrast:var(--vvd-calendar-event-announcement-contrast,var(--vvd-color-announcement-800));--_connotation-color-soft:var(--vvd-calendar-event-announcement-soft,var(--vvd-color-announcement-100))}.base:not(.connotation-accent,.connotation-cta,.connotation-success,.connotation-alert,.connotation-warning,.connotation-announcement){--_connotation-color-primary:var(--vvd-calendar-event-information-primary,var(--vvd-color-information-500));--_connotation-color-primary-text:var(--vvd-calendar-event-information-primary-text,var(--vvd-color-canvas));--_connotation-color-contrast:var(--vvd-calendar-event-information-contrast,var(--vvd-color-information-800));--_connotation-color-soft:var(--vvd-calendar-event-information-soft,var(--vvd-color-information-100))}.base{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary);--_appearance-color-outline:transparent}.base.appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.base{--vvd-calendar-event--indent:calc(0px + var(--vvd-calendar-event--overlap-count,0) * 8px);--focus-stroke-gap-color:transparent;z-index:var(--vvd-calendar-event--overlap-count);top:calc(var(--vvd-calendar-event--start,0) * (100% - 23px) / 24 + calc(1px * var(--vvd-calendar-event--start,0)));box-sizing:border-box;background-color:var(--_appearance-color-fill);block-size:calc(var(--vvd-calendar-event--duration,1) * calc((100% - 23px) / 24) + calc(1px * (var(--vvd-calendar-event--duration,1) - 1)) - 4px);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);color:var(--_appearance-color-text);inline-size:calc(100% - 8px - min(var(--vvd-calendar-event--indent), 32px));margin-block-start:2px;margin-inline:min(var(--vvd-calendar-event--indent), 32px) 8px;max-block-size:calc(100% - calc(var(--vvd-calendar-event--start,0) * (100% - 23px) / 24 + calc(1px * var(--vvd-calendar-event--start,0))) - 4px);border-radius:8px;padding:4px 8px;position:absolute;overflow:hidden}@supports (contain:content){.base{contain:strict}}@supports not (contain:content){.base{overflow:hidden}}.base:focus{box-shadow:0 0 0 4px color-mix(in sRGB, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px));z-index:2000}:host([overlap-count]) .base{--focus-stroke-gap-color:var(--vvd-color-canvas)}:host([overlap-count]) .base:not(:focus){box-shadow:inset 0 0 0 1px var(--vvd-color-canvas)}h2{font:var(--vvd-typography-base-condensed-bold);margin:0}h2>strong{font:inherit}p{font:var(--vvd-typography-base-condensed);margin:0}",
22
+ </div>`, d = n("calendar-event", c, u, [], {
23
+ styles: l,
25
24
  shadowOptions: { delegatesFocus: !0 }
26
- }))();
25
+ });
26
+ //#endregion
27
+ //#region src/lib/calendar-event/index.ts
28
+ e(d)();
27
29
  //#endregion
package/card/index.cjs CHANGED
@@ -1,4 +1,4 @@
1
- const e=require(`../bundled/vivid-element.cjs`),t=require(`../bundled/slotted.cjs`),n=require(`../bundled/when.cjs`),r=require(`../bundled/enums.cjs`),i=require(`../bundled/decorate.cjs`),a=require(`../bundled/class-names.cjs`),o=require(`../bundled/definition3.cjs`),s=require(`../bundled/icon.cjs`),c=require(`../bundled/delegates-aria.cjs`),l=require(`../bundled/linkable.cjs`),u=require(`../bundled/definition7.cjs`);var d=`:host{--_vvd-tinted-shadow-surface-0dp:drop-shadow(1px 0px 0px var(--card-border-color)) drop-shadow(0px 1px 0px var(--card-border-color)) drop-shadow(0px -1px 0px var(--card-border-color)) drop-shadow(-1px 0px 0px var(--card-border-color));display:flex}.base{text-align:start;border:0;border-radius:8px;outline:none;inline-size:100%;padding:0;text-decoration:none}.base:is(button,a):not(:disabled){cursor:pointer}.base:is(button,a):disabled{cursor:not-allowed}.base:is(button,a):focus-visible{box-shadow:0 0 0 4px color-mix(in sRGB, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px))}.wrapper{border-radius:inherit;block-size:100%;color:var(--vvd-color-canvas-text);--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent;flex-flow:column;display:flex;overflow:hidden}@media (hover:hover){.wrapper:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}}.wrapper.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}.wrapper:active:where(:not(.disabled,:disabled)),.wrapper.active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.wrapper{--_connotation-color-primary:var(--vvd-card-cta-primary,var(--vvd-color-cta-500));--_connotation-color-primary-text:var(--vvd-card-cta-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-card-cta-primary-increment,var(--vvd-color-cta-600));--_connotation-color-faint:var(--vvd-card-cta-faint,var(--vvd-color-cta-50));--_connotation-color-soft:var(--vvd-card-cta-soft,var(--vvd-color-cta-100))}@media (hover:hover){.base:is(button,a):hover>.wrapper{background-color:var(--_appearance-color-fill)}}.main-content{flex-flow:column;padding:24px;display:flex}.body-wrapper{padding-top:16px}.hide-header .body-wrapper{padding-top:0}.hide-body .body-wrapper{display:none}.header{flex:1;align-items:flex-start;gap:8px;display:flex}.header-content{flex:1}.header-wrapper{gap:8px;display:flex}.header-headline,.header-subtitle{-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.header-headline{font:var(--vvd-typography-heading-4);-webkit-line-clamp:var(--headline-line-clamp)}.header-subtitle{font:var(--vvd-typography-base);-webkit-line-clamp:var(--subtitle-line-clamp)}.hide-header .header{display:none}.header-subtitle,.text{color:var(--vvd-color-neutral-600);font:var(--vvd-typography-base)}.text{margin-top:12px;padding-right:8px}.footer{padding-bottom:24px;flex-direction:column;align-items:flex-end;margin-top:auto;padding-inline:24px;display:inline-flex}.hide-footer .footer{display:none}::slotted([slot=graphic i]),.icon{flex-shrink:0;align-self:baseline;margin-block-start:4px}.icon{font-size:20px}::slotted([slot=meta i]){flex-shrink:0;align-self:flex-start;margin-block-start:-8px;margin-inline:auto -8px}`,f=class extends l.t(e.t){constructor(...e){super(...e),this.clickableCard=!1}};i.t([e.m],f.prototype,`appearance`,void 0),i.t([e.m],f.prototype,`headline`,void 0),i.t([e.m],f.prototype,`subtitle`,void 0),i.t([e.m],f.prototype,`text`,void 0),i.t([e.m],f.prototype,`icon`,void 0),i.t([e.m],f.prototype,`elevation`,void 0),i.t([e.m({mode:`boolean`,attribute:`clickable-card`})],f.prototype,`clickableCard`,void 0),i.t([e.A],f.prototype,`bodySlottedContent`,void 0),i.t([e.A],f.prototype,`footerSlottedContent`,void 0),i.t([e.A],f.prototype,`graphicSlottedContent`,void 0),i.t([e.A],f.prototype,`hasMetaSlottedContent`,void 0);var p=e=>a.t(`base`,[`hide-footer`,!e.footerSlottedContent||!e.footerSlottedContent.length],[`hide-header`,y(e)],[`hide-body`,!e.bodySlottedContent||!e.bodySlottedContent.length]);function m(t){return e.p`
1
+ const e=require("../bundled/vivid-element.cjs"),t=require("../bundled/slotted.cjs"),n=require("../bundled/when.cjs"),r=require("../bundled/enums.cjs"),i=require("../bundled/decorate.cjs"),a=require("../bundled/class-names.cjs"),o=require("../bundled/definition2.cjs"),s=require("../bundled/icon.cjs"),c=require("../bundled/delegates-aria.cjs"),l=require("../bundled/linkable.cjs"),u=require("../bundled/definition6.cjs");var d=`:host{--_vvd-tinted-shadow-surface-0dp:drop-shadow(1px 0px 0px var(--card-border-color)) drop-shadow(0px 1px 0px var(--card-border-color)) drop-shadow(0px -1px 0px var(--card-border-color)) drop-shadow(-1px 0px 0px var(--card-border-color));display:flex}.base{text-align:start;border:0;border-radius:8px;outline:none;inline-size:100%;padding:0;text-decoration:none}.base:is(button,a):not(:disabled){cursor:pointer}.base:is(button,a):disabled{cursor:not-allowed}.base:is(button,a):focus-visible{box-shadow:0 0 0 4px color-mix(in sRGB, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px))}.wrapper{border-radius:inherit;block-size:100%;color:var(--vvd-color-canvas-text);flex-flow:column;display:flex;overflow:hidden}@media (hover:hover){.base:is(button,a):hover>.wrapper{background-color:var(--_appearance-color-fill)}}.main-content{flex-flow:column;padding:24px;display:flex}.body-wrapper{padding-top:16px}.hide-header .body-wrapper{padding-top:0}.hide-body .body-wrapper{display:none}.header{flex:1;align-items:flex-start;gap:8px;display:flex}.header-content{flex:1}.header-wrapper{gap:8px;display:flex}.header-headline,.header-subtitle{-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.header-headline{font:var(--vvd-typography-heading-4);-webkit-line-clamp:var(--headline-line-clamp)}.header-subtitle{font:var(--vvd-typography-base);-webkit-line-clamp:var(--subtitle-line-clamp)}.hide-header .header{display:none}.header-subtitle,.text{color:var(--vvd-color-neutral-600);font:var(--vvd-typography-base)}.text{margin-top:12px;padding-right:8px}.footer{padding-bottom:24px;flex-direction:column;align-items:flex-end;margin-top:auto;padding-inline:24px;display:inline-flex}.hide-footer .footer{display:none}::slotted([slot=graphic i]),.icon{flex-shrink:0;align-self:baseline;margin-block-start:4px}.icon{font-size:20px}::slotted([slot=meta i]){flex-shrink:0;align-self:flex-start;margin-block-start:-8px;margin-inline:auto -8px}`,f=class extends l.t(e.t){constructor(...e){super(...e),this.clickableCard=!1}};i.t([e.m],f.prototype,`appearance`,void 0),i.t([e.m],f.prototype,`headline`,void 0),i.t([e.m],f.prototype,`subtitle`,void 0),i.t([e.m],f.prototype,`text`,void 0),i.t([e.m],f.prototype,`icon`,void 0),i.t([e.m],f.prototype,`elevation`,void 0),i.t([e.m({mode:`boolean`,attribute:`clickable-card`})],f.prototype,`clickableCard`,void 0),i.t([e.A],f.prototype,`bodySlottedContent`,void 0),i.t([e.A],f.prototype,`footerSlottedContent`,void 0),i.t([e.A],f.prototype,`graphicSlottedContent`,void 0),i.t([e.A],f.prototype,`hasMetaSlottedContent`,void 0);var p=e=>a.t(`base`,[`hide-footer`,!e.footerSlottedContent||!e.footerSlottedContent.length],[`hide-header`,y(e)],[`hide-body`,!e.bodySlottedContent||!e.bodySlottedContent.length]);function m(t){return e.p`
2
2
  <${t} class="icon" inline name="${e=>e.icon}"></${t}>`}function h(){return e.p`
3
3
  <div class="header-headline" id="card-headline">${e=>e.headline}</div>
4
4
  `}function g(){return e.p` <div class="header-subtitle">${e=>e.subtitle}</div> `}function _(){return e.p`
@@ -23,7 +23,9 @@ const e=require(`../bundled/vivid-element.cjs`),t=require(`../bundled/slotted.cj
23
23
  >
24
24
  ${n}
25
25
  </div>`}function w(r){let i=r.tagFor(s.t);return e.p`
26
- ${r=>C(r,e.p`<div class="wrapper">
26
+ ${r=>C(r,e.p`<div
27
+ class="wrapper connotation-cta appearance-ghost with-idle with-hover with-active"
28
+ >
27
29
  <div class="vwc-card-media">
28
30
  <slot name="media"></slot>
29
31
  </div>
package/card/index.js CHANGED
@@ -4,13 +4,13 @@ import { t as s } from "../bundled/when.js";
4
4
  import { t as c } from "../bundled/enums.js";
5
5
  import { t as l } from "../bundled/decorate.js";
6
6
  import { t as u } from "../bundled/class-names.js";
7
- import { t as d } from "../bundled/definition3.js";
7
+ import { t as d } from "../bundled/definition2.js";
8
8
  import { t as f } from "../bundled/icon.js";
9
9
  import { n as p } from "../bundled/delegates-aria.js";
10
10
  import { t as m } from "../bundled/linkable.js";
11
- import { r as h, t as g } from "../bundled/definition7.js";
11
+ import { r as h, t as g } from "../bundled/definition6.js";
12
12
  //#region src/lib/card/card.scss?inline
13
- var _ = ":host{--_vvd-tinted-shadow-surface-0dp:drop-shadow(1px 0px 0px var(--card-border-color)) drop-shadow(0px 1px 0px var(--card-border-color)) drop-shadow(0px -1px 0px var(--card-border-color)) drop-shadow(-1px 0px 0px var(--card-border-color));display:flex}.base{text-align:start;border:0;border-radius:8px;outline:none;inline-size:100%;padding:0;text-decoration:none}.base:is(button,a):not(:disabled){cursor:pointer}.base:is(button,a):disabled{cursor:not-allowed}.base:is(button,a):focus-visible{box-shadow:0 0 0 4px color-mix(in sRGB, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px))}.wrapper{border-radius:inherit;block-size:100%;color:var(--vvd-color-canvas-text);--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent;flex-flow:column;display:flex;overflow:hidden}@media (hover:hover){.wrapper:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}}.wrapper.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}.wrapper:active:where(:not(.disabled,:disabled)),.wrapper.active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.wrapper{--_connotation-color-primary:var(--vvd-card-cta-primary,var(--vvd-color-cta-500));--_connotation-color-primary-text:var(--vvd-card-cta-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-card-cta-primary-increment,var(--vvd-color-cta-600));--_connotation-color-faint:var(--vvd-card-cta-faint,var(--vvd-color-cta-50));--_connotation-color-soft:var(--vvd-card-cta-soft,var(--vvd-color-cta-100))}@media (hover:hover){.base:is(button,a):hover>.wrapper{background-color:var(--_appearance-color-fill)}}.main-content{flex-flow:column;padding:24px;display:flex}.body-wrapper{padding-top:16px}.hide-header .body-wrapper{padding-top:0}.hide-body .body-wrapper{display:none}.header{flex:1;align-items:flex-start;gap:8px;display:flex}.header-content{flex:1}.header-wrapper{gap:8px;display:flex}.header-headline,.header-subtitle{-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.header-headline{font:var(--vvd-typography-heading-4);-webkit-line-clamp:var(--headline-line-clamp)}.header-subtitle{font:var(--vvd-typography-base);-webkit-line-clamp:var(--subtitle-line-clamp)}.hide-header .header{display:none}.header-subtitle,.text{color:var(--vvd-color-neutral-600);font:var(--vvd-typography-base)}.text{margin-top:12px;padding-right:8px}.footer{padding-bottom:24px;flex-direction:column;align-items:flex-end;margin-top:auto;padding-inline:24px;display:inline-flex}.hide-footer .footer{display:none}::slotted([slot=graphic i]),.icon{flex-shrink:0;align-self:baseline;margin-block-start:4px}.icon{font-size:20px}::slotted([slot=meta i]){flex-shrink:0;align-self:flex-start;margin-block-start:-8px;margin-inline:auto -8px}", v = class extends m(i) {
13
+ var _ = ":host{--_vvd-tinted-shadow-surface-0dp:drop-shadow(1px 0px 0px var(--card-border-color)) drop-shadow(0px 1px 0px var(--card-border-color)) drop-shadow(0px -1px 0px var(--card-border-color)) drop-shadow(-1px 0px 0px var(--card-border-color));display:flex}.base{text-align:start;border:0;border-radius:8px;outline:none;inline-size:100%;padding:0;text-decoration:none}.base:is(button,a):not(:disabled){cursor:pointer}.base:is(button,a):disabled{cursor:not-allowed}.base:is(button,a):focus-visible{box-shadow:0 0 0 4px color-mix(in sRGB, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px))}.wrapper{border-radius:inherit;block-size:100%;color:var(--vvd-color-canvas-text);flex-flow:column;display:flex;overflow:hidden}@media (hover:hover){.base:is(button,a):hover>.wrapper{background-color:var(--_appearance-color-fill)}}.main-content{flex-flow:column;padding:24px;display:flex}.body-wrapper{padding-top:16px}.hide-header .body-wrapper{padding-top:0}.hide-body .body-wrapper{display:none}.header{flex:1;align-items:flex-start;gap:8px;display:flex}.header-content{flex:1}.header-wrapper{gap:8px;display:flex}.header-headline,.header-subtitle{-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.header-headline{font:var(--vvd-typography-heading-4);-webkit-line-clamp:var(--headline-line-clamp)}.header-subtitle{font:var(--vvd-typography-base);-webkit-line-clamp:var(--subtitle-line-clamp)}.hide-header .header{display:none}.header-subtitle,.text{color:var(--vvd-color-neutral-600);font:var(--vvd-typography-base)}.text{margin-top:12px;padding-right:8px}.footer{padding-bottom:24px;flex-direction:column;align-items:flex-end;margin-top:auto;padding-inline:24px;display:inline-flex}.hide-footer .footer{display:none}::slotted([slot=graphic i]),.icon{flex-shrink:0;align-self:baseline;margin-block-start:4px}.icon{font-size:20px}::slotted([slot=meta i]){flex-shrink:0;align-self:flex-start;margin-block-start:-8px;margin-inline:auto -8px}", v = class extends m(i) {
14
14
  constructor(...e) {
15
15
  super(...e), this.clickableCard = !1;
16
16
  }
@@ -79,7 +79,9 @@ function k(e, t) {
79
79
  function A(e) {
80
80
  let t = e.tagFor(f);
81
81
  return r`
82
- ${(e) => k(e, r`<div class="wrapper">
82
+ ${(e) => k(e, r`<div
83
+ class="wrapper connotation-cta appearance-ghost with-idle with-hover with-active"
84
+ >
83
85
  <div class="vwc-card-media">
84
86
  <slot name="media"></slot>
85
87
  </div>
@@ -101,8 +103,8 @@ function A(e) {
101
103
  `;
102
104
  }
103
105
  //#endregion
104
- //#region src/lib/card/index.ts
105
- t(a("card", v, (e) => {
106
+ //#region src/lib/card/definition.ts
107
+ var j = a("card", v, (e) => {
106
108
  let t = e.tagFor(h);
107
109
  return r`
108
110
  ${s((e) => e.appearance !== c.Ghost && e.appearance !== c.Outlined, r`
@@ -117,5 +119,8 @@ t(a("card", v, (e) => {
117
119
  `)}
118
120
  ${s((e) => e.appearance === c.Ghost, r` ${A(e)} `)}
119
121
  `;
120
- }, [d, g], { styles: _ }))();
122
+ }, [d, g], { styles: _ });
123
+ //#endregion
124
+ //#region src/lib/card/index.ts
125
+ t(j)();
121
126
  //#endregion
@@ -1 +1 @@
1
- require(`../bundled/definition15.cjs`).n();
1
+ require("../bundled/definition15.cjs").n();
@@ -1,8 +1,8 @@
1
- const e=require(`../bundled/vivid-element.cjs`),t=require(`../bundled/repeat.cjs`),n=require(`../bundled/slotted.cjs`),r=require(`../bundled/ref.cjs`),i=require(`../bundled/when.cjs`),a=require(`../bundled/decorate.cjs`),o=require(`../bundled/class-names.cjs`),s=require(`../bundled/definition3.cjs`),c=require(`../bundled/icon.cjs`),l=require(`../bundled/delegates-aria.cjs`),u=require(`../bundled/definition6.cjs`),d=require(`../bundled/definition8.cjs`),f=require(`../bundled/definition9.cjs`),p=require(`../bundled/dialog.cjs`),m=require(`../bundled/mixins.cjs`),ee=require(`../bundled/with-contextual-help.cjs`),te=require(`../bundled/with-error-text.cjs`),ne=require(`../bundled/with-success-text.cjs`),h=require(`../bundled/definition12.cjs`),re=require(`../bundled/trapped-focus.cjs`),g=require(`../bundled/base-color-picker.cjs`);var ie=`.palette{grid-template-columns:repeat(var(--swatches-per-row,7), var(--_color-swatch-size,24px));display:grid}.swatch{background-color:var(--swatch-color);block-size:var(--_color-swatch-size,24px);color:var(--vvd-color-canvas);cursor:pointer;inline-size:var(--_color-swatch-size,24px);border-radius:4px;padding:0;position:relative}.swatch:not(.contrast){border:none}.swatch.contrast{border:1px solid var(--vvd-color-neutral-400);color:var(--vvd-color-canvas-text)}.swatch:focus-visible{box-shadow:0 0 0 4px color-mix(in sRGB, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:none;outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px));--focus-stroke-gap-color:transparent;--focus-inset:-3px}:host{--_low-ink-color:var(--vvd-color-neutral-600);display:inline-block}.base{min-inline-size:var(--_color-picker-min-inline-size,280px);display:inline-block}.control{inline-size:100%}.button{box-sizing:border-box;background-color:var(--button-color,var(--vvd-color-canvas-text));block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8));color:var(--vvd-color-canvas);inline-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8));padding-inline:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8)) / 4);vertical-align:middle;border:0;border-radius:4px;align-items:center;margin:0;text-decoration:none;display:inline-flex}.button.contrast{color:var(--vvd-color-canvas-text)}.button:not(.disabled){cursor:pointer}.button.disabled{background-color:var(--vvd-color-neutral-300);color:var(--vvd-color-neutral-500);cursor:not-allowed}.button:focus-visible{--focus-stroke-gap-color:transparent;box-shadow:0 0 0 4px color-mix(in sRGB, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px))}.button [data-vvd-component=icon]{font-size:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8)) / 2);line-height:1}.dialog{min-inline-size:var(--_color-picker-popup-min-inline-size,264px);flex-direction:column;display:flex}.dialog .header{justify-content:space-between;align-items:center;padding-block:8px;padding-inline:16px;display:inline-flex}.dialog .header-title{font:var(--vvd-typography-base-extended-bold);margin-block:0}.dialog .body{flex-direction:column;gap:16px;margin-block-end:16px;padding-inline:16px;display:flex}.dialog .hex-input-wrapper{align-items:stretch;gap:8px;display:flex}.dialog .hex-input-wrapper [data-vvd-component=button]{flex:none}.dialog .footer{border-top:1px solid var(--vvd-color-neutral-200);padding:16px}.dialog .footer-header{margin-block-end:8px}.dialog .swatches-count{color:var(--_low-ink-color);font:var(--vvd-typography-base)}.dialog .palette{gap:var(--_color-swatches-gap,8px)}vvd-hex-input{flex:auto;min-width:0}vvd-hex-input::part(input),vvd-hex-input>input{box-sizing:border-box;background-color:var(--vvd-color-canvas);width:100%;height:100%;box-shadow:inset 0 0 0 1px var(--vvd-color-neutral-500);font:var(--vvd-typography-base);padding-inline:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2))) / 2.5);border:0;border-radius:8px;outline:#0000}vvd-hex-input::part(input):focus-visible,vvd-hex-input>input:focus-visible{box-shadow:0 0 0 4px color-mix(in sRGB, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px));--focus-stroke-gap-color:transparent}vvd-hex-picker{width:auto;height:auto;gap:16px;inline-size:100%}vvd-hex-picker::part(saturation){border-radius:8px;block-size:120px}vvd-hex-picker::part(hue){border-radius:8px;flex:0 0 8px}vvd-hex-picker::part(hue-pointer){width:10px;height:10px}vvd-hex-picker::part(saturation-pointer){width:18px;height:18px}::part(popup-base){inline-size:max-content;min-block-size:var(--_color-picker-popup-min-inline-size,264px);min-inline-size:var(--_color-picker-popup-min-inline-size,264px)}.visually-hidden{clip:rect(0 0 0 0);border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}`,_=(e,t=0,n=1)=>e>n?n:e<t?t:e,v=(e,t=0,n=10**t)=>Math.round(n*e)/n;360/(Math.PI*2);var ae=e=>ue(y(e)),y=e=>(e[0]===`#`&&(e=e.substring(1)),e.length<6?{r:parseInt(e[0]+e[0],16),g:parseInt(e[1]+e[1],16),b:parseInt(e[2]+e[2],16),a:e.length===4?v(parseInt(e[3]+e[3],16)/255,2):1}:{r:parseInt(e.substring(0,2),16),g:parseInt(e.substring(2,4),16),b:parseInt(e.substring(4,6),16),a:e.length===8?v(parseInt(e.substring(6,8),16)/255,2):1}),oe=e=>le(ce(e)),se=({h:e,s:t,v:n,a:r})=>{let i=(200-t)*n/100;return{h:v(e),s:v(i>0&&i<200?t*n/100/(i<=100?i:200-i)*100:0),l:v(i/2),a:v(r,2)}},b=e=>{let{h:t,s:n,l:r}=se(e);return`hsl(${t}, ${n}%, ${r}%)`},ce=({h:e,s:t,v:n,a:r})=>{e=e/360*6,t/=100,n/=100;let i=Math.floor(e),a=n*(1-t),o=n*(1-(e-i)*t),s=n*(1-(1-e+i)*t),c=i%6;return{r:v([n,o,a,a,s,n][c]*255),g:v([s,n,n,o,a,a][c]*255),b:v([a,a,s,n,n,o][c]*255),a:v(r,2)}},x=e=>{let t=e.toString(16);return t.length<2?`0`+t:t},le=({r:e,g:t,b:n,a:r})=>{let i=r<1?x(v(r*255)):``;return`#`+x(e)+x(t)+x(n)+i},ue=({r:e,g:t,b:n,a:r})=>{let i=Math.max(e,t,n),a=i-Math.min(e,t,n),o=a?i===e?(t-n)/a:i===t?2+(n-e)/a:4+(e-t)/a:0;return{h:v(60*(o<0?o+6:o)),s:v(i?a/i*100:0),v:v(i/255*100),a:r}},S=(e,t)=>{if(e===t)return!0;for(let n in e)if(e[n]!==t[n])return!1;return!0},de=(e,t)=>e.toLowerCase()===t.toLowerCase()?!0:S(y(e),y(t)),C={},w=e=>{let t=C[e];return t||(t=document.createElement(`template`),t.innerHTML=e,C[e]=t),t},T=(e,t,n)=>{e.dispatchEvent(new CustomEvent(t,{bubbles:!0,detail:n}))},E=!1,D=e=>`touches`in e,fe=e=>E&&!D(e)?!1:(E||=D(e),!0),O=(e,t)=>{let n=D(t)?t.touches[0]:t,r=e.el.getBoundingClientRect();T(e.el,`move`,e.getMove({x:_((n.pageX-(r.left+window.pageXOffset))/r.width),y:_((n.pageY-(r.top+window.pageYOffset))/r.height)}))},pe=(e,t)=>{let n=t.keyCode;n>40||e.xy&&n<37||n<33||(t.preventDefault(),T(e.el,`move`,e.getMove({x:n===39?.01:n===37?-.01:n===34?.05:n===33?-.05:n===35?1:n===36?-1:0,y:n===40?.01:n===38?-.01:0},!0)))},k=class{constructor(e,t,n,r){let i=w(`<div role="slider" tabindex="0" part="${t}" ${n}><div part="${t}-pointer"></div></div>`);e.appendChild(i.content.cloneNode(!0));let a=e.querySelector(`[part=${t}]`);a.addEventListener(`mousedown`,this),a.addEventListener(`touchstart`,this),a.addEventListener(`keydown`,this),this.el=a,this.xy=r,this.nodes=[a.firstChild,a]}set dragging(e){let t=e?document.addEventListener:document.removeEventListener;t(E?`touchmove`:`mousemove`,this),t(E?`touchend`:`mouseup`,this)}handleEvent(e){switch(e.type){case`mousedown`:case`touchstart`:if(e.preventDefault(),!fe(e)||!E&&e.button!=0)return;this.el.focus(),O(this,e),this.dragging=!0;break;case`mousemove`:case`touchmove`:e.preventDefault(),O(this,e);break;case`mouseup`:case`touchend`:this.dragging=!1;break;case`keydown`:pe(this,e);break}}style(e){e.forEach((e,t)=>{for(let n in e)this.nodes[t].style.setProperty(n,e[n])})}},me=class extends k{constructor(e){super(e,`hue`,`aria-label="Hue" aria-valuemin="0" aria-valuemax="360"`,!1)}update({h:e}){this.h=e,this.style([{left:`${e/360*100}%`,color:b({h:e,s:100,v:100,a:1})}]),this.el.setAttribute(`aria-valuenow`,`${v(e)}`)}getMove(e,t){return{h:t?_(this.h+e.x*360,0,360):360*e.x}}},he=class extends k{constructor(e){super(e,`saturation`,`aria-label="Color"`,!0)}update(e){this.hsva=e,this.style([{top:`${100-e.v}%`,left:`${e.s}%`,color:b(e)},{"background-color":b({h:e.h,s:100,v:100,a:1})}]),this.el.setAttribute(`aria-valuetext`,`Saturation ${v(e.s)}%, Brightness ${v(e.v)}%`)}getMove(e,t){return{s:t?_(this.hsva.s+e.x*100,0,100):e.x*100,v:t?_(this.hsva.v-e.y*100,0,100):Math.round(100-e.y*100)}}},ge=`:host{display:flex;flex-direction:column;position:relative;width:200px;height:200px;user-select:none;-webkit-user-select:none;cursor:default}:host([hidden]){display:none!important}[role=slider]{position:relative;touch-action:none;user-select:none;-webkit-user-select:none;outline:0}[role=slider]:last-child{border-radius:0 0 8px 8px}[part$=pointer]{position:absolute;z-index:1;box-sizing:border-box;width:28px;height:28px;display:flex;place-content:center center;transform:translate(-50%,-50%);background-color:#fff;border:2px solid #fff;border-radius:50%;box-shadow:0 2px 4px rgba(0,0,0,.2)}[part$=pointer]::after{content:"";width:100%;height:100%;border-radius:inherit;background-color:currentColor}[role=slider]:focus [part$=pointer]{transform:translate(-50%,-50%) scale(1.1)}`,_e=`[part=hue]{flex:0 0 24px;background:linear-gradient(to right,red 0,#ff0 17%,#0f0 33%,#0ff 50%,#00f 67%,#f0f 83%,red 100%)}[part=hue-pointer]{top:50%;z-index:2}`,ve=`[part=saturation]{flex-grow:1;border-color:transparent;border-bottom:12px solid #000;border-radius:8px 8px 0 0;background-image:linear-gradient(to top,#000,transparent),linear-gradient(to right,#fff,rgba(255,255,255,0));box-shadow:inset 0 0 0 1px rgba(0,0,0,.05)}[part=saturation-pointer]{z-index:3}`,A=Symbol(`same`),j=Symbol(`color`),M=Symbol(`hsva`),N=Symbol(`update`),P=Symbol(`parts`),F=Symbol(`css`),I=Symbol(`sliders`),ye=class extends HTMLElement{static get observedAttributes(){return[`color`]}get[F](){return[ge,_e,ve]}get[I](){return[he,me]}get color(){return this[j]}set color(e){if(!this[A](e)){let t=this.colorModel.toHsva(e);this[N](t),this[j]=e}}constructor(){super();let e=w(`<style>${this[F].join(``)}</style>`),t=this.attachShadow({mode:`open`});t.appendChild(e.content.cloneNode(!0)),t.addEventListener(`move`,this),this[P]=this[I].map(e=>new e(t))}connectedCallback(){if(this.hasOwnProperty(`color`)){let e=this.color;delete this.color,this.color=e}else this.color||=this.colorModel.defaultColor}attributeChangedCallback(e,t,n){let r=this.colorModel.fromAttr(n);this[A](r)||(this.color=r)}handleEvent(e){let t=this[M],n={...t,...e.detail};this[N](n);let r;!S(n,t)&&!this[A](r=this.colorModel.fromHsva(n))&&(this[j]=r,T(this,`color-changed`,{value:r}))}[A](e){return this.color&&this.colorModel.equal(e,this.color)}[N](e){this[M]=e,this[P].forEach(t=>t.update(e))}},be={defaultColor:`#000`,toHsva:ae,fromHsva:({h:e,s:t,v:n})=>oe({h:e,s:t,v:n,a:1}),equal:de,fromAttr:e=>e},xe=class extends ye{get colorModel(){return be}},L=class extends xe{};customElements.define(`hex-color-picker`,L);var Se=/^#?([0-9A-F]{3,8})$/i,R=(e,t)=>{let n=Se.exec(e),r=n?n[1].length:0;return r===3||r===6||!!t&&r===4||!!t&&r===8},Ce=w(`<slot><input part="input" spellcheck="false"></slot>`),z=(e,t)=>e.replace(/([^0-9A-F]+)/gi,``).substring(0,t?8:6),B=Symbol(`alpha`),V=Symbol(`color`),H=Symbol(`saved`),U=Symbol(`input`),W=Symbol(`init`),G=Symbol(`prefix`),K=Symbol(`update`),we=class extends HTMLElement{static get observedAttributes(){return[`alpha`,`color`,`prefixed`]}get color(){return this[V]}set color(e){this[V]=e,this[K](e)}get alpha(){return this[B]}set alpha(e){this[B]=e,this.toggleAttribute(`alpha`,e);let t=this.color;t&&!R(t,e)&&(this.color=t.startsWith(`#`)?t.substring(0,t.length===5?4:7):t.substring(0,t.length===4?3:6))}get prefixed(){return this[G]}set prefixed(e){this[G]=e,this.toggleAttribute(`prefixed`,e),this[K](this.color)}constructor(){super();let e=this.attachShadow({mode:`open`});e.appendChild(Ce.content.cloneNode(!0)),e.firstElementChild.addEventListener(`slotchange`,()=>this[W](e))}connectedCallback(){if(this[W](this.shadowRoot),this.hasOwnProperty(`alpha`)){let e=this.alpha;delete this.alpha,this.alpha=e}else this.alpha=this.hasAttribute(`alpha`);if(this.hasOwnProperty(`prefixed`)){let e=this.prefixed;delete this.prefixed,this.prefixed=e}else this.prefixed=this.hasAttribute(`prefixed`);if(this.hasOwnProperty(`color`)){let e=this.color;delete this.color,this.color=e}else this.color==null?this.color=this.getAttribute(`color`)||``:this[V]&&this[K](this[V])}handleEvent(e){let{value:t}=e.target;switch(e.type){case`input`:let e=z(t,this.alpha);this[H]=this.color,(R(e,this.alpha)||t===``)&&(this.color=e,this.dispatchEvent(new CustomEvent(`color-changed`,{bubbles:!0,detail:{value:e?`#`+e:``}})));break;case`blur`:t&&!R(t,this.alpha)&&(this.color=this[H])}}attributeChangedCallback(e,t,n){e===`color`&&this.color!==n&&(this.color=n);let r=n!=null;e===`alpha`&&this.alpha!==r&&(this.alpha=r),e===`prefixed`&&this.prefixed!==r&&(this.prefixed=r)}[W](e){let t=this.querySelector(`input`);if(!t){let n;for(;n=this.firstChild;)n.remove();t=e.querySelector(`input`)}t.addEventListener(`input`,this),t.addEventListener(`blur`,this),this[U]=t,this[K](this.color)}[K](e){this[U]&&(this[U].value=e==null||e==``?``:(this.prefixed?`#`:``)+z(e,this.alpha))}},q=class extends we{};customElements.define(`hex-input`,q);var J=`vvd-hex-picker`,Y=`vvd-hex-input`,Te=class extends L{static{this.displayName=`VvdHexPicker`}},Ee=class extends q{static{this.displayName=`VvdHexInput`}};customElements.get(J)||customElements.define(J,Te),customElements.get(Y)||customElements.define(Y,Ee);var X=J,Z=Y,Q=class extends ee.t(m.t(te.t(ne.t(l.t(re.t(g.t(e.t))))))){constructor(...e){super(...e),this.disableSavedColors=!1,this.savedColors=[],this.maxSwatches=6,this.#e=e=>{this._isInPath(e,this._buttonEl)||this._isInPath(e,this._popupEl)||(this.open=!1)},this.copyIconName=`copy-2-line`,this.#t=null,this._copyValueToClipboard=async e=>{try{await navigator.clipboard.writeText(e),this._setTemporaryCopyIcon(`check-circle-line`),this._ariaLiveDescription=this.locale.colorPicker.copySuccessMessage(e)}catch{alert(this.locale.colorPicker.copyErrorText),this._setTemporaryCopyIcon(`error-line`),this._ariaLiveDescription=this.locale.colorPicker.copyErrorText}},this._ariaLiveDescription=``}static{this.HEX_COLOR_PATTERN=/^#(([0-9a-fA-F]{2}){3}|([0-9a-fA-F]){3})$/}placeholderChanged(){this.proxy instanceof HTMLInputElement&&(this.proxy.placeholder=this.placeholder)}handleChange(){this.$emit(`change`)}openChanged(e,t){t&&this.isConnected&&requestAnimationFrame(()=>{this._refreshCanvasColor()})}savedColorsKeyChanged(){this.savedColors=this._loadSavedColors()}get _savedColorsStorageKey(){return this.savedColorsKey?this.savedColorsKey:`vvd-saved-colors:${this.tagName.toLowerCase()}`}_handleColorSaving(){this._saveCurrentColor()}_saveCurrentColor(){let e=this.value;if(typeof e!=`string`||!g.n(e))return;let t=Array.isArray(this.savedColors)?[...this.savedColors]:[],n=t.findIndex(t=>t.value===e);n!==-1&&t.splice(n,1),t.unshift({value:e}),this.savedColors=t.slice(0,this._maxSwatchesNormalized),this._setSavedColors(this.savedColors)}_loadSavedColors(){try{let e=localStorage.getItem(this._savedColorsStorageKey);if(!e)return[];let t=JSON.parse(e);return Array.isArray(t)?t.filter(e=>e&&typeof e.value==`string`&&g.n(e.value)).map(e=>({value:e.value,label:typeof e.label==`string`?e.label:void 0})):[]}catch{return[]}}_setSavedColors(e){try{localStorage.setItem(this._savedColorsStorageKey,JSON.stringify(e))}catch{}}get allSwatches(){let e=Array.isArray(this.swatches)?this.swatches:[],t=Array.isArray(this.savedColors)?this.savedColors:[],n=new Set,r=[],i=e=>{!e||typeof e.value!=`string`||!g.n(e.value)||n.has(e.value)||(n.add(e.value),r.push(e))};return this.disableSavedColors||t.forEach(i),e.forEach(i),r.slice(0,this._maxSwatchesNormalized)}get _maxSwatchesNormalized(){return Number.isFinite(this.maxSwatches)?Math.max(0,Math.floor(this.maxSwatches)):0}maxSwatchesChanged(){let e=this._maxSwatchesNormalized;this.savedColors.length>e&&(this.savedColors=this.savedColors.slice(0,e),this._setSavedColors(this.savedColors))}_onPickerColorChanged(e){typeof e.detail.value==`string`&&(this.value=e.detail.value)}valueChanged(e,t){this._vcHexPickerEl&&typeof t==`string`&&(this._vcHexPickerEl.color=t),this._vcHexInputEl&&typeof t==`string`&&(this._vcHexInputEl.color=t)}_onTextFieldInput(e){let t=e.currentTarget;this.value=t.value}get _buttonColor(){return this._canvasColor||this._refreshCanvasColor(),this.value&&g.n(this.value)?this.value:`var(--vvd-color-canvas-text)`}_onButtonClick(){this.open=!this.open}_handleCloseRequest(){this.open=!1}_isInPath(e,t){if(!t)return!1;let n=e.composedPath?.();return!!(n&&n.includes(t))}#e;connectedCallback(){super.connectedCallback(),this.savedColors=this._loadSavedColors(),document.addEventListener(`mousedown`,this.#e,!0)}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener(`mousedown`,this.#e,!0)}#t;_setTemporaryCopyIcon(e,t=2e3){this.copyIconName=e,this.#t&&clearTimeout(this.#t),this.#t=setTimeout(()=>{this.copyIconName=`copy-2-line`,this.#t=null},t)}_onBaseKeydown(e){return this.open&&p.t(e)?(this.open=!1,!1):!this._trappedFocus(e,()=>this._focusableElsWithinDialog())}_focusableElsWithinDialog(){return this._popupEl.querySelectorAll(`button:not([role="gridcell"]), [data-vvd-component="button"], vwc-button:not([role="gridcell"])`)}_handleCellKeydown(e,t,n,r){if(e.key===`Tab`){e.preventDefault();let t=this._focusableElsWithinDialog(),n=Array.prototype.indexOf.call(t,e.currentTarget);return t[e.shiftKey?(n-1+t.length)%t.length:(n+1)%t.length]?.focus(),!1}return super._handleCellKeydown(e,t,n,r)}_handleSwatchSelection(e){this.value!==e&&(this._ariaLiveDescription=this.locale.colorPicker.selectionSuccessMessage(e)),super._handleSwatchSelection(e)}};a.t([e.m],Q.prototype,`placeholder`,void 0),a.t([e.m({attribute:`saved-colors-key`})],Q.prototype,`savedColorsKey`,void 0),a.t([e.m({mode:`boolean`,attribute:`disable-saved-colors`})],Q.prototype,`disableSavedColors`,void 0),a.t([e.A],Q.prototype,`savedColors`,void 0),a.t([e.m({attribute:`max-swatches`,mode:`fromView`,converter:e.h})],Q.prototype,`maxSwatches`,void 0),a.t([e.A],Q.prototype,`copyIconName`,void 0),a.t([e.A],Q.prototype,`_ariaLiveDescription`,void 0);function $(t,i){return e.p`
1
+ const e=require("../bundled/vivid-element.cjs"),t=require("../bundled/repeat.cjs"),n=require("../bundled/slotted.cjs"),r=require("../bundled/ref.cjs"),i=require("../bundled/when.cjs"),a=require("../bundled/decorate.cjs"),o=require("../bundled/class-names.cjs"),s=require("../bundled/definition2.cjs"),c=require("../bundled/icon.cjs"),l=require("../bundled/delegates-aria.cjs"),u=require("../bundled/definition5.cjs"),d=require("../bundled/definition7.cjs"),f=require("../bundled/definition8.cjs"),ee=require("../bundled/dialog.cjs"),p=require("../bundled/feedback-message.cjs"),te=require("../bundled/with-contextual-help.cjs"),ne=require("../bundled/with-error-text.cjs"),re=require("../bundled/with-success-text.cjs"),ie=require("../bundled/mixins.cjs"),m=require("../bundled/definition11.cjs"),ae=require("../bundled/trapped-focus.cjs"),h=require("../bundled/base-color-picker.cjs");var g=`.palette{grid-template-columns:repeat(var(--swatches-per-row,7), var(--_color-swatch-size,24px));display:grid}.swatch{background-color:var(--swatch-color);block-size:var(--_color-swatch-size,24px);color:var(--vvd-color-canvas);cursor:pointer;inline-size:var(--_color-swatch-size,24px);border-radius:4px;padding:0;position:relative}.swatch:not(.contrast){border:none}.swatch.contrast{border:1px solid var(--vvd-color-neutral-400);color:var(--vvd-color-canvas-text)}.swatch:focus-visible{box-shadow:0 0 0 4px color-mix(in sRGB, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:none;outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px));--focus-stroke-gap-color:transparent;--focus-inset:-3px}:host{--_low-ink-color:var(--vvd-color-neutral-600);display:inline-block}.base{min-inline-size:var(--_color-picker-min-inline-size,280px);display:inline-block}.control{inline-size:100%}.button{box-sizing:border-box;background-color:var(--button-color,var(--vvd-color-canvas-text));block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8));color:var(--vvd-color-canvas);inline-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8));padding-inline:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8)) / 4);vertical-align:middle;border:0;border-radius:4px;align-items:center;margin:0;text-decoration:none;display:inline-flex}.button.contrast{color:var(--vvd-color-canvas-text)}.button:not(.disabled){cursor:pointer}.button.disabled{background-color:var(--vvd-color-neutral-300);color:var(--vvd-color-neutral-500);cursor:not-allowed}.button:focus-visible{--focus-stroke-gap-color:transparent;box-shadow:0 0 0 4px color-mix(in sRGB, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px))}.button [data-vvd-component=icon]{font-size:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8)) / 2);line-height:1}.dialog{min-inline-size:var(--_color-picker-popup-min-inline-size,264px);flex-direction:column;display:flex}.dialog .header{justify-content:space-between;align-items:center;padding-block:8px;padding-inline:16px;display:inline-flex}.dialog .header-title{font:var(--vvd-typography-base-extended-bold);margin-block:0}.dialog .body{flex-direction:column;gap:16px;margin-block-end:16px;padding-inline:16px;display:flex}.dialog .hex-input-wrapper{align-items:stretch;gap:8px;display:flex}.dialog .hex-input-wrapper [data-vvd-component=button]{flex:none}.dialog .footer{border-top:1px solid var(--vvd-color-neutral-200);padding:16px}.dialog .footer-header{margin-block-end:8px}.dialog .swatches-count{color:var(--_low-ink-color);font:var(--vvd-typography-base)}.dialog .palette{gap:var(--_color-swatches-gap,8px)}vvd-hex-input{flex:auto;min-width:0}vvd-hex-input::part(input),vvd-hex-input>input{box-sizing:border-box;background-color:var(--vvd-color-canvas);width:100%;height:100%;box-shadow:inset 0 0 0 1px var(--vvd-color-neutral-500);font:var(--vvd-typography-base);padding-inline:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2))) / 2.5);border:0;border-radius:8px;outline:#0000}vvd-hex-input::part(input):focus-visible,vvd-hex-input>input:focus-visible{box-shadow:0 0 0 4px color-mix(in sRGB, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px));--focus-stroke-gap-color:transparent}vvd-hex-picker{width:auto;height:auto;gap:16px;inline-size:100%}vvd-hex-picker::part(saturation){border-radius:8px;block-size:120px}vvd-hex-picker::part(hue){border-radius:8px;flex:0 0 8px}vvd-hex-picker::part(hue-pointer){width:10px;height:10px}vvd-hex-picker::part(saturation-pointer){width:18px;height:18px}::part(popup-base){inline-size:max-content;min-block-size:var(--_color-picker-popup-min-inline-size,264px);min-inline-size:var(--_color-picker-popup-min-inline-size,264px)}.visually-hidden{clip:rect(0 0 0 0);border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}`,_=(e,t=0,n=1)=>e>n?n:e<t?t:e,v=(e,t=0,n=10**t)=>Math.round(n*e)/n;360/(Math.PI*2);var oe=e=>de(y(e)),y=e=>(e[0]===`#`&&(e=e.substring(1)),e.length<6?{r:parseInt(e[0]+e[0],16),g:parseInt(e[1]+e[1],16),b:parseInt(e[2]+e[2],16),a:e.length===4?v(parseInt(e[3]+e[3],16)/255,2):1}:{r:parseInt(e.substring(0,2),16),g:parseInt(e.substring(2,4),16),b:parseInt(e.substring(4,6),16),a:e.length===8?v(parseInt(e.substring(6,8),16)/255,2):1}),se=e=>ue(le(e)),ce=({h:e,s:t,v:n,a:r})=>{let i=(200-t)*n/100;return{h:v(e),s:v(i>0&&i<200?t*n/100/(i<=100?i:200-i)*100:0),l:v(i/2),a:v(r,2)}},b=e=>{let{h:t,s:n,l:r}=ce(e);return`hsl(${t}, ${n}%, ${r}%)`},le=({h:e,s:t,v:n,a:r})=>{e=e/360*6,t/=100,n/=100;let i=Math.floor(e),a=n*(1-t),o=n*(1-(e-i)*t),s=n*(1-(1-e+i)*t),c=i%6;return{r:v([n,o,a,a,s,n][c]*255),g:v([s,n,n,o,a,a][c]*255),b:v([a,a,s,n,n,o][c]*255),a:v(r,2)}},x=e=>{let t=e.toString(16);return t.length<2?`0`+t:t},ue=({r:e,g:t,b:n,a:r})=>{let i=r<1?x(v(r*255)):``;return`#`+x(e)+x(t)+x(n)+i},de=({r:e,g:t,b:n,a:r})=>{let i=Math.max(e,t,n),a=i-Math.min(e,t,n),o=a?i===e?(t-n)/a:i===t?2+(n-e)/a:4+(e-t)/a:0;return{h:v(60*(o<0?o+6:o)),s:v(i?a/i*100:0),v:v(i/255*100),a:r}},S=(e,t)=>{if(e===t)return!0;for(let n in e)if(e[n]!==t[n])return!1;return!0},fe=(e,t)=>e.toLowerCase()===t.toLowerCase()||S(y(e),y(t)),C={},w=e=>{let t=C[e];return t||(t=document.createElement(`template`),t.innerHTML=e,C[e]=t),t},T=(e,t,n)=>{e.dispatchEvent(new CustomEvent(t,{bubbles:!0,detail:n}))},E=!1,D=e=>`touches`in e,O=e=>E&&!D(e)?!1:(E||=D(e),!0),k=(e,t)=>{let n=D(t)?t.touches[0]:t,r=e.el.getBoundingClientRect();T(e.el,`move`,e.getMove({x:_((n.pageX-(r.left+window.pageXOffset))/r.width),y:_((n.pageY-(r.top+window.pageYOffset))/r.height)}))},pe=(e,t)=>{let n=t.keyCode;n>40||e.xy&&n<37||n<33||(t.preventDefault(),T(e.el,`move`,e.getMove({x:n===39?.01:n===37?-.01:n===34?.05:n===33?-.05:n===35?1:n===36?-1:0,y:n===40?.01:n===38?-.01:0},!0)))},A=class{constructor(e,t,n,r){let i=w(`<div role="slider" tabindex="0" part="${t}" ${n}><div part="${t}-pointer"></div></div>`);e.appendChild(i.content.cloneNode(!0));let a=e.querySelector(`[part=${t}]`);a.addEventListener(`mousedown`,this),a.addEventListener(`touchstart`,this),a.addEventListener(`keydown`,this),this.el=a,this.xy=r,this.nodes=[a.firstChild,a]}set dragging(e){let t=e?document.addEventListener:document.removeEventListener;t(E?`touchmove`:`mousemove`,this),t(E?`touchend`:`mouseup`,this)}handleEvent(e){switch(e.type){case`mousedown`:case`touchstart`:if(e.preventDefault(),!O(e)||!E&&e.button!=0)return;this.el.focus(),k(this,e),this.dragging=!0;break;case`mousemove`:case`touchmove`:e.preventDefault(),k(this,e);break;case`mouseup`:case`touchend`:this.dragging=!1;break;case`keydown`:pe(this,e)}}style(e){e.forEach((e,t)=>{for(let n in e)this.nodes[t].style.setProperty(n,e[n])})}},me=class extends A{constructor(e){super(e,`hue`,`aria-label="Hue" aria-valuemin="0" aria-valuemax="360"`,!1)}update({h:e}){this.h=e,this.style([{left:`${e/360*100}%`,color:b({h:e,s:100,v:100,a:1})}]),this.el.setAttribute(`aria-valuenow`,`${v(e)}`)}getMove(e,t){return{h:t?_(this.h+e.x*360,0,360):360*e.x}}},he=class extends A{constructor(e){super(e,`saturation`,`aria-label="Color"`,!0)}update(e){this.hsva=e,this.style([{top:`${100-e.v}%`,left:`${e.s}%`,color:b(e)},{"background-color":b({h:e.h,s:100,v:100,a:1})}]),this.el.setAttribute(`aria-valuetext`,`Saturation ${v(e.s)}%, Brightness ${v(e.v)}%`)}getMove(e,t){return{s:t?_(this.hsva.s+e.x*100,0,100):e.x*100,v:t?_(this.hsva.v-e.y*100,0,100):Math.round(100-e.y*100)}}},ge=`:host{display:flex;flex-direction:column;position:relative;width:200px;height:200px;user-select:none;-webkit-user-select:none;cursor:default}:host([hidden]){display:none!important}[role=slider]{position:relative;touch-action:none;user-select:none;-webkit-user-select:none;outline:0}[role=slider]:last-child{border-radius:0 0 8px 8px}[part$=pointer]{position:absolute;z-index:1;box-sizing:border-box;width:28px;height:28px;display:flex;place-content:center center;transform:translate(-50%,-50%);background-color:#fff;border:2px solid #fff;border-radius:50%;box-shadow:0 2px 4px rgba(0,0,0,.2)}[part$=pointer]::after{content:"";width:100%;height:100%;border-radius:inherit;background-color:currentColor}[role=slider]:focus [part$=pointer]{transform:translate(-50%,-50%) scale(1.1)}`,_e=`[part=hue]{flex:0 0 24px;background:linear-gradient(to right,red 0,#ff0 17%,#0f0 33%,#0ff 50%,#00f 67%,#f0f 83%,red 100%)}[part=hue-pointer]{top:50%;z-index:2}`,ve=`[part=saturation]{flex-grow:1;border-color:transparent;border-bottom:12px solid #000;border-radius:8px 8px 0 0;background-image:linear-gradient(to top,#000,transparent),linear-gradient(to right,#fff,rgba(255,255,255,0));box-shadow:inset 0 0 0 1px rgba(0,0,0,.05)}[part=saturation-pointer]{z-index:3}`,j=Symbol(`same`),M=Symbol(`color`),N=Symbol(`hsva`),P=Symbol(`update`),F=Symbol(`parts`),I=Symbol(`css`),L=Symbol(`sliders`),ye=class extends HTMLElement{static get observedAttributes(){return[`color`]}get[I](){return[ge,_e,ve]}get[L](){return[he,me]}get color(){return this[M]}set color(e){if(!this[j](e)){let t=this.colorModel.toHsva(e);this[P](t),this[M]=e}}constructor(){super();let e=w(`<style>${this[I].join(``)}</style>`),t=this.attachShadow({mode:`open`});t.appendChild(e.content.cloneNode(!0)),t.addEventListener(`move`,this),this[F]=this[L].map(e=>new e(t))}connectedCallback(){if(this.hasOwnProperty(`color`)){let e=this.color;delete this.color,this.color=e}else this.color||=this.colorModel.defaultColor}attributeChangedCallback(e,t,n){let r=this.colorModel.fromAttr(n);this[j](r)||(this.color=r)}handleEvent(e){let t=this[N],n={...t,...e.detail};this[P](n);let r;!S(n,t)&&!this[j](r=this.colorModel.fromHsva(n))&&(this[M]=r,T(this,`color-changed`,{value:r}))}[j](e){return this.color&&this.colorModel.equal(e,this.color)}[P](e){this[N]=e,this[F].forEach(t=>t.update(e))}},be={defaultColor:`#000`,toHsva:oe,fromHsva:({h:e,s:t,v:n})=>se({h:e,s:t,v:n,a:1}),equal:fe,fromAttr:e=>e},xe=class extends ye{get colorModel(){return be}},R=class extends xe{};customElements.define(`hex-color-picker`,R);var Se=/^#?([0-9A-F]{3,8})$/i,z=(e,t)=>{let n=Se.exec(e),r=n?n[1].length:0;return r===3||r===6||!!t&&r===4||!!t&&r===8},Ce=w(`<slot><input part="input" spellcheck="false"></slot>`),B=(e,t)=>e.replace(/([^0-9A-F]+)/gi,``).substring(0,t?8:6),V=Symbol(`alpha`),H=Symbol(`color`),U=Symbol(`saved`),W=Symbol(`input`),G=Symbol(`init`),K=Symbol(`prefix`),q=Symbol(`update`),we=class extends HTMLElement{static get observedAttributes(){return[`alpha`,`color`,`prefixed`]}get color(){return this[H]}set color(e){this[H]=e,this[q](e)}get alpha(){return this[V]}set alpha(e){this[V]=e,this.toggleAttribute(`alpha`,e);let t=this.color;t&&!z(t,e)&&(this.color=t.startsWith(`#`)?t.substring(0,t.length===5?4:7):t.substring(0,t.length===4?3:6))}get prefixed(){return this[K]}set prefixed(e){this[K]=e,this.toggleAttribute(`prefixed`,e),this[q](this.color)}constructor(){super();let e=this.attachShadow({mode:`open`});e.appendChild(Ce.content.cloneNode(!0)),e.firstElementChild.addEventListener(`slotchange`,()=>this[G](e))}connectedCallback(){if(this[G](this.shadowRoot),this.hasOwnProperty(`alpha`)){let e=this.alpha;delete this.alpha,this.alpha=e}else this.alpha=this.hasAttribute(`alpha`);if(this.hasOwnProperty(`prefixed`)){let e=this.prefixed;delete this.prefixed,this.prefixed=e}else this.prefixed=this.hasAttribute(`prefixed`);if(this.hasOwnProperty(`color`)){let e=this.color;delete this.color,this.color=e}else this.color==null?this.color=this.getAttribute(`color`)||``:this[H]&&this[q](this[H])}handleEvent(e){let{value:t}=e.target;switch(e.type){case`input`:let e=B(t,this.alpha);this[U]=this.color,(z(e,this.alpha)||t===``)&&(this.color=e,this.dispatchEvent(new CustomEvent(`color-changed`,{bubbles:!0,detail:{value:e?`#`+e:``}})));break;case`blur`:t&&!z(t,this.alpha)&&(this.color=this[U])}}attributeChangedCallback(e,t,n){e===`color`&&this.color!==n&&(this.color=n);let r=n!=null;e===`alpha`&&this.alpha!==r&&(this.alpha=r),e===`prefixed`&&this.prefixed!==r&&(this.prefixed=r)}[G](e){let t=this.querySelector(`input`);if(!t){let n;for(;n=this.firstChild;)n.remove();t=e.querySelector(`input`)}t.addEventListener(`input`,this),t.addEventListener(`blur`,this),this[W]=t,this[q](this.color)}[q](e){this[W]&&(this[W].value=e==null||e==``?``:(this.prefixed?`#`:``)+B(e,this.alpha))}},J=class extends we{};customElements.define(`hex-input`,J);var Y=`vvd-hex-picker`,X=`vvd-hex-input`,Te=class extends R{static{this.displayName=`VvdHexPicker`}},Ee=class extends J{static{this.displayName=`VvdHexInput`}};customElements.get(Y)||customElements.define(Y,Te),customElements.get(X)||customElements.define(X,Ee);var Z=Y,Q=X,$=class extends te.t(ie.t(ne.t(re.t(l.t(ae.t(h.t(e.t))))))){constructor(...e){super(...e),this.disableSavedColors=!1,this.savedColors=[],this.maxSwatches=6,this.#e=e=>{this._isInPath(e,this._buttonEl)||this._isInPath(e,this._popupEl)||(this.open=!1)},this.copyIconName=`copy-2-line`,this.#t=null,this._copyValueToClipboard=async e=>{try{await navigator.clipboard.writeText(e),this._setTemporaryCopyIcon(`check-circle-line`),this._ariaLiveDescription=this.locale.colorPicker.copySuccessMessage(e)}catch{alert(this.locale.colorPicker.copyErrorText),this._setTemporaryCopyIcon(`error-line`),this._ariaLiveDescription=this.locale.colorPicker.copyErrorText}},this._ariaLiveDescription=``}static{this.HEX_COLOR_PATTERN=/^#(([0-9a-fA-F]{2}){3}|([0-9a-fA-F]){3})$/}placeholderChanged(){this.proxy instanceof HTMLInputElement&&(this.proxy.placeholder=this.placeholder)}handleChange(){this.$emit(`change`)}openChanged(e,t){t&&this.isConnected&&requestAnimationFrame(()=>{this._refreshCanvasColor()})}savedColorsKeyChanged(){this.savedColors=this._loadSavedColors()}get _savedColorsStorageKey(){return this.savedColorsKey?this.savedColorsKey:`vvd-saved-colors:${this.tagName.toLowerCase()}`}_handleColorSaving(){this._saveCurrentColor()}_saveCurrentColor(){let e=this.value;if(typeof e!=`string`||!h.n(e))return;let t=Array.isArray(this.savedColors)?[...this.savedColors]:[],n=t.findIndex(t=>t.value===e);n!==-1&&t.splice(n,1),t.unshift({value:e}),this.savedColors=t.slice(0,this._maxSwatchesNormalized),this._setSavedColors(this.savedColors)}_loadSavedColors(){try{let e=localStorage.getItem(this._savedColorsStorageKey);if(!e)return[];let t=JSON.parse(e);return Array.isArray(t)?t.filter(e=>e&&typeof e.value==`string`&&h.n(e.value)).map(e=>({value:e.value,label:typeof e.label==`string`?e.label:void 0})):[]}catch{return[]}}_setSavedColors(e){try{localStorage.setItem(this._savedColorsStorageKey,JSON.stringify(e))}catch{}}get allSwatches(){let e=Array.isArray(this.swatches)?this.swatches:[],t=Array.isArray(this.savedColors)?this.savedColors:[],n=new Set,r=[],i=e=>{!e||typeof e.value!=`string`||!h.n(e.value)||n.has(e.value)||(n.add(e.value),r.push(e))};return this.disableSavedColors||t.forEach(i),e.forEach(i),r.slice(0,this._maxSwatchesNormalized)}get _maxSwatchesNormalized(){return Number.isFinite(this.maxSwatches)?Math.max(0,Math.floor(this.maxSwatches)):0}maxSwatchesChanged(){let e=this._maxSwatchesNormalized;this.savedColors.length>e&&(this.savedColors=this.savedColors.slice(0,e),this._setSavedColors(this.savedColors))}_onPickerColorChanged(e){typeof e.detail.value==`string`&&(this.value=e.detail.value)}valueChanged(e,t){this._vcHexPickerEl&&typeof t==`string`&&(this._vcHexPickerEl.color=t),this._vcHexInputEl&&typeof t==`string`&&(this._vcHexInputEl.color=t)}_onTextFieldInput(e){let t=e.currentTarget;this.value=t.value}get _buttonColor(){return this._canvasColor||this._refreshCanvasColor(),this.value&&h.n(this.value)?this.value:`var(--vvd-color-canvas-text)`}_onButtonClick(){this.open=!this.open}_handleCloseRequest(){this.open=!1}_isInPath(e,t){if(!t)return!1;let n=e.composedPath?.();return!!(n&&n.includes(t))}#e;connectedCallback(){super.connectedCallback(),this.savedColors=this._loadSavedColors(),document.addEventListener(`mousedown`,this.#e,!0)}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener(`mousedown`,this.#e,!0)}#t;_setTemporaryCopyIcon(e,t=2e3){this.copyIconName=e,this.#t&&clearTimeout(this.#t),this.#t=setTimeout(()=>{this.copyIconName=`copy-2-line`,this.#t=null},t)}_onBaseKeydown(e){return this.open&&ee.t(e)?(this.open=!1,!1):!this._trappedFocus(e,()=>this._focusableElsWithinDialog())}_focusableElsWithinDialog(){return this._popupEl.querySelectorAll(`button:not([role="gridcell"]), [data-vvd-component="button"], vwc-button:not([role="gridcell"])`)}_handleCellKeydown(e,t,n,r){if(e.key===`Tab`){e.preventDefault();let t=this._focusableElsWithinDialog(),n=Array.prototype.indexOf.call(t,e.currentTarget);return t[e.shiftKey?(n-1+t.length)%t.length:(n+1)%t.length]?.focus(),!1}return super._handleCellKeydown(e,t,n,r)}_handleSwatchSelection(e){this.value!==e&&(this._ariaLiveDescription=this.locale.colorPicker.selectionSuccessMessage(e)),super._handleSwatchSelection(e)}};a.t([e.m],$.prototype,`placeholder`,void 0),a.t([e.m({attribute:`saved-colors-key`})],$.prototype,`savedColorsKey`,void 0),a.t([e.m({mode:`boolean`,attribute:`disable-saved-colors`})],$.prototype,`disableSavedColors`,void 0),a.t([e.A],$.prototype,`savedColors`,void 0),a.t([e.m({attribute:`max-swatches`,mode:`fromView`,converter:e.h})],$.prototype,`maxSwatches`,void 0),a.t([e.A],$.prototype,`copyIconName`,void 0),a.t([e.A],$.prototype,`_ariaLiveDescription`,void 0);function De(t,i){return e.p`
2
2
  <${t}
3
3
  id="text-field"
4
4
  class="${e=>o.t(`control`)}"
5
- pattern="${Q.HEX_COLOR_PATTERN.source}"
5
+ pattern="${$.HEX_COLOR_PATTERN.source}"
6
6
  maxlength="7"
7
7
  label="${e=>e.label}"
8
8
  :value="${e=>e.value}"
@@ -42,7 +42,7 @@ const e=require(`../bundled/vivid-element.cjs`),t=require(`../bundled/repeat.cjs
42
42
  ${n.t(`_contextualHelpSlottedContent`)}
43
43
  ></slot>
44
44
  </${t}>
45
- `}function De(t,n){return e.p`
45
+ `}function Oe(t,n){return e.p`
46
46
  <div class="header">
47
47
  <h2 class="header-title" id="color-picker-title">
48
48
  <slot name="popup-text">${e=>e.locale.colorPicker.popupLabel}</slot>
@@ -53,16 +53,16 @@ const e=require(`../bundled/vivid-element.cjs`),t=require(`../bundled/repeat.cjs
53
53
  <${n} slot="icon" name="close-line"></${n}>
54
54
  </${t}>
55
55
  </div>
56
- `}function Oe(t,n,i){return e.p`
56
+ `}function ke(t,n,i){return e.p`
57
57
  <div class="body">
58
- <${e.p.partial(X)}
58
+ <${e.p.partial(Z)}
59
59
  part="hex-picker"
60
60
  color="${e=>e.value}"
61
61
  @color-changed="${(e,t)=>e._onPickerColorChanged(t.event)}"
62
62
  ${r.t(`_vcHexPickerEl`)}
63
- ></${e.p.partial(X)}>
63
+ ></${e.p.partial(Z)}>
64
64
  <div class="hex-input-wrapper">
65
- <${e.p.partial(Z)}
65
+ <${e.p.partial(Q)}
66
66
  part="hex-input"
67
67
  prefixed
68
68
  color="${e=>e.value}"
@@ -73,7 +73,7 @@ const e=require(`../bundled/vivid-element.cjs`),t=require(`../bundled/repeat.cjs
73
73
  placeholder="${e=>e.placeholder}"
74
74
  @blur="${(e,t)=>t.event.stopImmediatePropagation()}"
75
75
  part="input">
76
- </${e.p.partial(Z)}>
76
+ </${e.p.partial(Q)}>
77
77
  <${i} placement="top"
78
78
  text="${e=>e.locale.colorPicker.copyButtonLabel}"
79
79
  exportparts="vvd-theme-alternate">
@@ -86,7 +86,7 @@ const e=require(`../bundled/vivid-element.cjs`),t=require(`../bundled/repeat.cjs
86
86
  </${i}>
87
87
  </div>
88
88
  </div>
89
- `}function ke(n,r,a){return e.p`
89
+ `}function Ae(n,r,a){return e.p`
90
90
  <div class="footer">
91
91
  <div class="footer-header">
92
92
  <span class="footer-title" id="color-picker-footer-title"
@@ -94,7 +94,7 @@ const e=require(`../bundled/vivid-element.cjs`),t=require(`../bundled/repeat.cjs
94
94
  >${e=>e.locale.colorPicker.swatchesLabel}</slot
95
95
  ></span
96
96
  >
97
- ${i.t(e=>!e.disableSavedColors,Ae())}
97
+ ${i.t(e=>!e.disableSavedColors,je())}
98
98
  </div>
99
99
  <div
100
100
  class="palette"
@@ -124,19 +124,19 @@ const e=require(`../bundled/vivid-element.cjs`),t=require(`../bundled/repeat.cjs
124
124
  `)}
125
125
  </div>
126
126
  </div>
127
- `}function Ae(){return e.p`
127
+ `}function je(){return e.p`
128
128
  <span
129
129
  id="swatches-count"
130
130
  class="swatches-count"
131
131
  aria-label="${e=>e.locale.colorPicker.maxSwatchesMessage(e.allSwatches.length,e.maxSwatches)}"
132
132
  >${e=>`${e.allSwatches.length}/${e.maxSwatches}`}</span
133
133
  >
134
- `}var je=e.u(`color-picker`,Q,t=>{let n=t.tagFor(h.r),a=t.tagFor(c.t),o=t.tagFor(d.i),s=t.tagFor(u.i),l=t.tagFor(f.r);return e.p`
134
+ `}var Me=e.u(`color-picker`,$,t=>{let n=t.tagFor(m.r),a=t.tagFor(c.t),o=t.tagFor(d.i),s=t.tagFor(u.i),l=t.tagFor(f.r);return e.p`
135
135
  <div class="base" @keydown="${(e,{event:t})=>e._onBaseKeydown(t)}">
136
136
  <span aria-live="assertive" aria-relevant="text" class="visually-hidden">
137
137
  ${e=>e._ariaLiveDescription}
138
138
  </span>
139
- ${$(n,a)}
139
+ ${De(n,a)}
140
140
  <${o}
141
141
  :open="${e=>e.open}"
142
142
  :anchor="${e=>e._buttonEl}"
@@ -147,10 +147,10 @@ const e=require(`../bundled/vivid-element.cjs`),t=require(`../bundled/repeat.cjs
147
147
  role="dialog"
148
148
  aria-modal="true"
149
149
  aria-labelledby="color-picker-title">
150
- ${De(s,a)}
151
- ${Oe(s,a,l)}
152
- ${i.t(e=>!e.disableSavedColors||e.allSwatches.length>0,ke(s,a,l))}
150
+ ${Oe(s,a)}
151
+ ${ke(s,a,l)}
152
+ ${i.t(e=>!e.disableSavedColors||e.allSwatches.length>0,Ae(s,a,l))}
153
153
  </div>
154
154
  </${o}>
155
155
  </div>
156
- `},[d.t,s.t,h.n,u.t,f.n,m.r],{styles:ie});e.d(je)();
156
+ `},[d.t,s.t,m.n,u.t,f.n,p.n],{styles:g});e.d(Me)();
@@ -5,18 +5,19 @@ import { t as l } from "../bundled/ref.js";
5
5
  import { t as u } from "../bundled/when.js";
6
6
  import { t as d } from "../bundled/decorate.js";
7
7
  import { t as f } from "../bundled/class-names.js";
8
- import { t as ee } from "../bundled/definition3.js";
8
+ import { t as ee } from "../bundled/definition2.js";
9
9
  import { t as te } from "../bundled/icon.js";
10
10
  import { n as ne, t as re } from "../bundled/delegates-aria.js";
11
- import { i as ie, t as ae } from "../bundled/definition6.js";
12
- import { i as oe, t as se } from "../bundled/definition8.js";
13
- import { n as ce, r as p } from "../bundled/definition9.js";
11
+ import { i as ie, t as ae } from "../bundled/definition5.js";
12
+ import { i as oe, t as se } from "../bundled/definition7.js";
13
+ import { n as ce, r as p } from "../bundled/definition8.js";
14
14
  import { t as le } from "../bundled/dialog.js";
15
- import { r as ue, t as de } from "../bundled/mixins.js";
16
- import { t as fe } from "../bundled/with-contextual-help.js";
17
- import { t as pe } from "../bundled/with-error-text.js";
18
- import { t as me } from "../bundled/with-success-text.js";
19
- import { n as he, r as ge } from "../bundled/definition12.js";
15
+ import { n as ue } from "../bundled/feedback-message.js";
16
+ import { t as de } from "../bundled/with-contextual-help.js";
17
+ import { t as fe } from "../bundled/with-error-text.js";
18
+ import { t as pe } from "../bundled/with-success-text.js";
19
+ import { t as me } from "../bundled/mixins.js";
20
+ import { n as he, r as ge } from "../bundled/definition11.js";
20
21
  import { t as _e } from "../bundled/trapped-focus.js";
21
22
  import { n as m, t as ve } from "../bundled/base-color-picker.js";
22
23
  //#region src/lib/color-picker/color-picker.scss?inline
@@ -91,7 +92,7 @@ var _ = (e) => we(v(e)), v = (e) => (e[0] === "#" && (e = e.substring(1)), e.len
91
92
  if (e === t) return !0;
92
93
  for (let n in e) if (e[n] !== t[n]) return !1;
93
94
  return !0;
94
- }, Te = (e, t) => e.toLowerCase() === t.toLowerCase() ? !0 : x(v(e), v(t)), S = {}, C = (e) => {
95
+ }, Te = (e, t) => e.toLowerCase() === t.toLowerCase() || x(v(e), v(t)), S = {}, C = (e) => {
95
96
  let t = S[e];
96
97
  return t || (t = document.createElement("template"), t.innerHTML = e, S[e] = t), t;
97
98
  }, w = (e, t, n) => {
@@ -137,9 +138,7 @@ var _ = (e) => we(v(e)), v = (e) => (e[0] === "#" && (e = e.substring(1)), e.len
137
138
  case "touchend":
138
139
  this.dragging = !1;
139
140
  break;
140
- case "keydown":
141
- Ee(this, e);
142
- break;
141
+ case "keydown": Ee(this, e);
143
142
  }
144
143
  }
145
144
  style(e) {
@@ -354,7 +353,7 @@ var Y = "vvd-hex-picker", X = "vvd-hex-input", Le = class extends L {
354
353
  };
355
354
  /* v8 ignore if -- @preserve */
356
355
  customElements.get(Y) || customElements.define(Y, Le), customElements.get(X) || customElements.define(X, Re);
357
- var Z = Y, Q = X, $ = class extends fe(de(pe(me(re(_e(ve(a))))))) {
356
+ var Z = Y, Q = X, $ = class extends de(me(fe(pe(re(_e(ve(a))))))) {
358
357
  constructor(...e) {
359
358
  super(...e), this.disableSavedColors = !1, this.savedColors = [], this.maxSwatches = 6, this.#e = (e) => {
360
359
  this._isInPath(e, this._buttonEl) || this._isInPath(e, this._popupEl) || (this.open = !1);
@@ -645,8 +644,8 @@ function Ue() {
645
644
  `;
646
645
  }
647
646
  //#endregion
648
- //#region src/lib/color-picker/index.ts
649
- t(o("color-picker", $, (e) => {
647
+ //#region src/lib/color-picker/definition.ts
648
+ var We = o("color-picker", $, (e) => {
650
649
  let t = e.tagFor(ge), n = e.tagFor(te), r = e.tagFor(oe), a = e.tagFor(ie), o = e.tagFor(p);
651
650
  return i`
652
651
  <div class="base" @keydown="${(e, { event: t }) => e._onBaseKeydown(t)}">
@@ -678,5 +677,8 @@ t(o("color-picker", $, (e) => {
678
677
  ae,
679
678
  ce,
680
679
  ue
681
- ], { styles: ye }))();
680
+ ], { styles: ye });
681
+ //#endregion
682
+ //#region src/lib/color-picker/index.ts
683
+ t(We)();
682
684
  //#endregion