@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
@@ -1,48 +1,146 @@
1
- import { d as e, m as t, p as n, u as r } from "./vivid-element.js";
2
- import { t as i } from "./when.js";
3
- import { t as a } from "./decorate.js";
4
- import { t as o } from "./class-names.js";
5
- import { t as s } from "./base-progress.js";
6
- import { n as c, t as l } from "./delegates-aria.js";
7
- //#region src/lib/progress-ring/progress-ring.scss?inline
8
- var u = ":host{--_vvd-progress-ring-accent-firm-wrapper:var(--vvd-progress-ring-accent-firm);--_vvd-progress-ring-cta-firm-wrapper:var(--vvd-progress-ring-cta-firm);--_vvd-progress-ring-alert-firm-wrapper:var(--vvd-progress-ring-alert-firm);--_vvd-progress-ring-success-firm-wrapper:var(--vvd-progress-ring-success-firm)}.base{--vvd-progress-ring-accent-firm:var(--_vvd-progress-ring-accent-firm-wrapper,var(--vvd-progress-ring-accent-primary));--vvd-progress-ring-cta-firm:var(--_vvd-progress-ring-cta-firm-wrapper,var(--vvd-progress-ring-cta-primary));--vvd-progress-ring-alert-firm:var(--_vvd-progress-ring-alert-firm-wrapper,var(--vvd-progress-ring-alert-primary));--vvd-progress-ring-success-firm:var(--_vvd-progress-ring-success-firm-wrapper,var(--vvd-progress-ring-success-primary))}.base.connotation-cta{--_connotation-color-firm:var(--vvd-progress-ring-cta-firm,var(--vvd-color-cta-600))}.base.connotation-alert{--_connotation-color-firm:var(--vvd-progress-ring-alert-firm,var(--vvd-color-alert-600))}.base.connotation-success{--_connotation-color-firm:var(--vvd-progress-ring-success-firm,var(--vvd-color-success-600))}.base:not(.connotation-cta,.connotation-alert,.connotation-success){--_connotation-color-firm:var(--vvd-progress-ring-accent-firm,var(--vvd-color-canvas-text))}.base{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.base:disabled,.base.disabled{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.base.size--6{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)) - 1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16))}.base.size--5{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 20))}.base.size--4{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16))}.base.size--3{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 12))}.base.size--2{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8))}.base.size--1{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 4))}.base.size-1{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 4))}.base.size-2{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 8))}.base.size-3{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 12))}.base.size-4{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 16))}.base.size-5{--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 20))}.base:not(.size--6,.size--5,.size--4,.size--3,.size--2,.size--1,.size-1,.size-2,.size-3,.size-4,.size-5){--_size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)))}.base{block-size:var(--_size);color:var(--_appearance-color-text);inline-size:var(--_size);outline:none;align-items:center}.progress{width:100%;height:100%}.background{fill:none;stroke:#0000;stroke-width:1px}.determinate{fill:none;stroke:currentColor;stroke-linecap:round;stroke-width:1px;transform-origin:50%;transition:all .2s ease-in-out;transform:rotate(-90deg)}.indeterminate-indicator-1{fill:none;stroke:currentColor;stroke-linecap:round;stroke-width:1px;transform-origin:50%;transition:all .2s ease-in-out;animation:2s linear infinite spin-infinite;transform:rotate(-90deg)}.base.paused .indeterminate-indicator-1{animation-play-state:paused}@keyframes spin-infinite{0%{stroke-dasharray:.01 43.97;transform:rotate(0)}50%{stroke-dasharray:21.99 21.99;transform:rotate(450deg)}to{stroke-dasharray:.01 43.97;transform:rotate(1080deg)}}", d = class extends l(s) {};
9
- a([t], d.prototype, "connotation", void 0), a([t], d.prototype, "size", void 0);
1
+ import { t as e } from "./localized.js";
2
+ import { d as t, m as n, p as r, u as i } from "./vivid-element.js";
3
+ import { t as a } from "./ref.js";
4
+ import { t as o } from "./when.js";
5
+ import { a as s } from "./enums.js";
6
+ import { t as c } from "./decorate.js";
7
+ import { t as l } from "./class-names.js";
8
+ import { t as u } from "./definition2.js";
9
+ import { t as d } from "./icon.js";
10
+ import { a as f, i as p, n as m } from "./affix.js";
11
+ import { r as h, t as g } from "./definition4.js";
12
+ import { n as _ } from "./delegates-aria.js";
13
+ import { t as v } from "./component-enum.js";
14
+ import { t as y } from "./button.js";
15
+ import { t as b } from "./linkable.js";
16
+ //#region src/lib/button/button.ts
17
+ var x = v([
18
+ "accent",
19
+ "announcement",
20
+ "cta",
21
+ "success",
22
+ "alert"
23
+ ], "accent"), S = v([
24
+ "filled",
25
+ "outlined",
26
+ "ghost",
27
+ "ghost-light",
28
+ "outlined-light"
29
+ ], "ghost"), C = class extends m(e(b(y))) {
30
+ constructor() {
31
+ super(), this.stacked = !1, this.pending = !1, this.dropdownIndicator = !1, this.active = !1, this.pressed = !1, this.title = "";
32
+ }
33
+ clickHandler(e) {
34
+ /* v8 ignore else -- @preserve */
35
+ if (this.disabled || this.pending) {
36
+ e.preventDefault(), e.stopImmediatePropagation();
37
+ return;
38
+ }
39
+ return !0;
40
+ }
41
+ };
42
+ c([n({ converter: {
43
+ fromView: (e) => e || null,
44
+ toView: (e) => e || null
45
+ } })], C.prototype, "title", void 0), c([n], C.prototype, "connotation", void 0), c([n], C.prototype, "shape", void 0), c([n], C.prototype, "appearance", void 0), c([n], C.prototype, "size", void 0), c([n({
46
+ mode: "boolean",
47
+ attribute: "stacked"
48
+ })], C.prototype, "stacked", void 0), c([n({
49
+ mode: "boolean",
50
+ attribute: "pending"
51
+ })], C.prototype, "pending", void 0), c([n({
52
+ mode: "boolean",
53
+ attribute: "dropdown-indicator"
54
+ })], C.prototype, "dropdownIndicator", void 0), c([n({
55
+ mode: "boolean",
56
+ attribute: "active"
57
+ })], C.prototype, "active", void 0), c([n({
58
+ mode: "boolean",
59
+ attribute: "pressed"
60
+ })], C.prototype, "pressed", void 0), c([n], C.prototype, "label", void 0);
10
61
  //#endregion
11
- //#region src/lib/progress-ring/progress-ring.template.ts
12
- var f = 44, p = r("progress-ring", d, n`<template>
13
- <div
14
- class="${(e) => e.paused ? "paused" : ""} ${(e) => o("base", ["disabled", e.paused], [`connotation-${e.connotation}`, !!e.connotation], [`size-${e.size}`, !!e.size])}"
15
- ${c({
16
- role: "progressbar",
17
- ariaValueNow: (e) => e.value,
18
- ariaValueMin: (e) => e.min,
19
- ariaValueMax: (e) => e.max
20
- })}
62
+ //#region src/lib/button/button.scss?inline
63
+ var w = ".chevron{font:var(--vvd-typography-base-extended);flex-shrink:0;display:flex;transform:rotate(0)}@media (prefers-reduced-motion:no-preference){.chevron{transition:transform .2s}}:host([data-expanded=true]) .chevron,:host([open]) .chevron{transform:rotate(180deg)}:host{--_vvd-button-accent-firm-wrapper:var(--vvd-button-accent-firm);--_vvd-button-cta-firm-wrapper:var(--vvd-button-cta-firm);--_vvd-button-success-firm-wrapper:var(--vvd-button-success-firm);--_vvd-button-alert-firm-wrapper:var(--vvd-button-alert-firm);--_vvd-button-announcement-firm-wrapper:var(--vvd-button-announcement-firm)}.control:not(.appearance-ghost-light,.appearance-filled,.appearance-outlined){--vvd-button-accent-firm:var(--_vvd-button-accent-firm-wrapper,var(--vvd-button-accent-primary));--vvd-button-cta-firm:var(--_vvd-button-cta-firm-wrapper,var(--vvd-button-cta-primary));--vvd-button-success-firm:var(--_vvd-button-success-firm-wrapper,var(--vvd-button-success-primary));--vvd-button-alert-firm:var(--_vvd-button-alert-firm-wrapper,var(--vvd-button-alert-primary));--vvd-button-announcement-firm:var(--_vvd-button-announcement-firm-wrapper,var(--vvd-button-announcement-primary))}:host{display:inline-block}.control{--focus-stroke-gap-color:transparent;box-sizing:border-box;border-radius:var(--_button-border-radius);background-color:var(--_appearance-color-fill);block-size:var(--_button-block-size);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);color:var(--_appearance-color-text);justify-content:space-between;align-items:center;gap:var(--_button-icon-gap);vertical-align:middle;border:0;margin:0;text-decoration:none;display:inline-flex}.control .text{-webkit-line-clamp:var(--button-line-clamp,1);text-align:start;-webkit-box-orient:vertical;max-inline-size:100%;display:-webkit-box;overflow:hidden}.control:not(.icon-only){inline-size:100%}.control:not(.disabled){cursor:var(--button-cursor,pointer)}.control.disabled{cursor:not-allowed}.control{user-select:none}.control:not(.stacked).size-super-condensed{--_button-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16));font:var(--vvd-typography-base-condensed-bold);--_button-icon-gap:4px;--_button-chevron-size:10px}.control:not(.stacked).size-super-condensed.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control:not(.stacked).size-super-condensed:not(.icon-only){padding-inline:8px}.control:not(.stacked).size-condensed{--_button-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8));font:var(--vvd-typography-base-condensed-bold);--_button-icon-gap:8px;--_button-chevron-size:12px}.control:not(.stacked).size-condensed.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control:not(.stacked).size-condensed:not(.icon-only){padding-inline:12px}.control:not(.stacked).size-expanded{--_button-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 8));font:var(--vvd-typography-base-extended-bold);--_button-icon-gap:10px;--_button-chevron-size:16px}.control:not(.stacked).size-expanded.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control:not(.stacked).size-expanded:not(.icon-only){padding-inline:20px}.control:not(.stacked):not(.size-condensed,.size-expanded,.size-super-condensed){--_button-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)));font:var(--vvd-typography-base-bold);--_button-icon-gap:8px;--_button-chevron-size:16px}.control:not(.stacked):not(.size-condensed,.size-expanded,.size-super-condensed).icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control:not(.stacked):not(.size-condensed,.size-expanded,.size-super-condensed):not(.icon-only){padding-inline:16px}.control:not(.shape-pill){--_button-border-radius:8px}.control:not(.shape-pill).size-condensed:not(.stacked),.control:not(.shape-pill).size-super-condensed:not(.stacked){--_button-border-radius:4px}.control.shape-pill:not(.icon-only,.stacked.size-super-condensed,.stacked.size-condensed,.stacked.normal){--_button-border-radius:24px}.control.shape-pill.stacked.size-condensed,.control.shape-pill.stacked.size-super-condensed{--_button-border-radius:16px}.control.shape-pill.stacked.size-normal{--_button-border-radius:20px}.control.shape-pill.icon-only{--_button-border-radius:50%}.control.stacked.size-super-condensed{--stacked-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16));--_button-block-size:calc(var(--stacked-size) + 20px);font:var(--vvd-typography-base-condensed-bold);--_button-icon-gap:4px;--_button-chevron-size:10px}.control.stacked.size-super-condensed.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control.stacked.size-super-condensed:not(.icon-only){padding-inline:16px}.control.stacked.size-condensed{--stacked-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8));--_button-block-size:calc(var(--stacked-size) + 24px);font:var(--vvd-typography-base-condensed-bold);--_button-icon-gap:6px;--_button-chevron-size:12px}.control.stacked.size-condensed.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control.stacked.size-condensed:not(.icon-only){padding-inline:12px}.control.stacked.size-expanded{--stacked-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 8));--_button-block-size:calc(var(--stacked-size) + 32px);font:var(--vvd-typography-base-extended-bold);--_button-icon-gap:10px;--_button-chevron-size:16px}.control.stacked.size-expanded.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control.stacked.size-expanded:not(.icon-only){padding-inline:20px}.control.stacked:not(.size-condensed,.size-expanded,.size-super-condensed){--stacked-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)));--_button-block-size:calc(var(--stacked-size) + 28px);font:var(--vvd-typography-base-bold);--_button-icon-gap:8px;--_button-chevron-size:16px}.control.stacked:not(.size-condensed,.size-expanded,.size-super-condensed).icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control.stacked:not(.size-condensed,.size-expanded,.size-super-condensed):not(.icon-only){padding-inline:16px}.control.appearance-filled{--focus-stroke-gap-color:transparent}.control.appearance-filled:focus-visible{outline:none;position:relative}.control.appearance-filled:focus-visible:after{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));border-radius:var(--focus-border-radius,inherit);block-size:calc(100% + var(--focus-block-size-addition,4px));content:\"\";inline-size:calc(100% + var(--focus-block-size-addition,4px));display:block;position:absolute;inset-block-start:50%;inset-inline-start:50%;transform:translate(-50%,-50%)}.control:not(.appearance-filled):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))}slot[name=icon]{line-height:1}.icon-trailing slot[name=icon]{order:1;display:flex}.control.stacked slot[name=icon]{font-size:calc(var(--stacked-size) / 2)}.control:not(.stacked) slot[name=icon]{font-size:calc(var(--_button-block-size) / 2)}.chevron{font-size:var(--_button-chevron-size)}.content{justify-content:center;align-items:center;gap:var(--_button-icon-gap);flex:1;display:flex;overflow:hidden}.control.stacked .content{flex-direction:column}:host([dropdown-indicator]) .content{justify-content:var(--button-content-alignment,flex-start);text-align:start}:host([dropdown-indicator][stacked]) .content{align-items:var(--button-content-alignment,flex-start);justify-content:center}.pending-no-icon{position:absolute}.pending-no-icon+.text{visibility:hidden}:host([icon-trailing][pending]) .pending{order:1}.sr-only{clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}", T = (e) => {
64
+ let t = e.tagFor(d);
65
+ return r`<${t} class="chevron" aria-hidden="true" name="chevron-down-line"></${t}>`;
66
+ };
67
+ //#endregion
68
+ //#region src/lib/button/button.template.ts
69
+ function E(e) {
70
+ let t = S.parse(e.appearance);
71
+ if (e.pressed) {
72
+ if (t === "ghost") return "subtle";
73
+ if (t === "ghost-light") return "subtle-light";
74
+ if (t === "outlined") return "filled";
75
+ }
76
+ return t;
77
+ }
78
+ var D = (e) => l("control", `connotation-${x.parse(e.connotation)}`, `appearance-${E(e)}`, "with-idle", "with-hover", "with-active", "with-disabled", ["disabled", e.disabled || e.pending], [`shape-${e.shape}`, !!e.shape], [`size-${e.size}`, !!e.size], ["icon-only", !e.label && !!(e.icon || e.iconSlottedContent?.length) && !e.dropdownIndicator], ["icon-trailing", e.iconTrailing], ["stacked", e.stacked], ["active", e.ariaExpanded === "true" || e.active]);
79
+ function O(e, t, n, i = s.Normal) {
80
+ if (n && i != s.SuperCondensed) {
81
+ let n = e.tagFor(h), a = {
82
+ [s.Condensed]: "-6",
83
+ [s.Normal]: "-5",
84
+ [s.Expanded]: "-4"
85
+ };
86
+ return r`<span class="${(e) => {
87
+ let n = e.querySelector("[slot=\"icon\"]");
88
+ return l("icon", "pending", ["pending-no-icon", !(t || n)]);
89
+ }}" aria-hidden="true"><${n} size="${a[i]}"></${n}></span>`;
90
+ }
91
+ return f(e)(t, p.Slot);
92
+ }
93
+ var k = (e) => [
94
+ "submit",
95
+ "button",
96
+ "reset"
97
+ ].indexOf(e) > -1 ? e : "submit", A = (e) => {
98
+ let t = T(e);
99
+ return r`<span class="content">
100
+ ${(t) => O(e, t.icon, t.pending, t.size)}
101
+ ${o((e) => e.label, r`<span class="text" aria-hidden="true">${(e) => e.label}</span>`)}
102
+ <span class="sr-only"
103
+ >${(e) => e.pending ? e.locale.button.pendingLabel : e.ariaLabel ?? e.label}</span
104
+ >
105
+ </span>
106
+ ${o((e) => e.dropdownIndicator, t)}`;
107
+ };
108
+ function j(e) {
109
+ return r` <button
110
+ class="${D}"
111
+ ?autofocus="${(e) => e.autofocus}"
112
+ form="${(e) => e.formId}"
113
+ formaction="${(e) => e.formaction}"
114
+ formenctype="${(e) => e.formenctype}"
115
+ formmethod="${(e) => e.formmethod}"
116
+ formnovalidate="${(e) => e.formnovalidate}"
117
+ formtarget="${(e) => e.formtarget}"
118
+ name="${(e) => e.name}"
119
+ type="${(e) => k(e.type)}"
120
+ value="${(e) => e.value}"
121
+ title="${(e) => e.title}"
122
+ ${_({
123
+ ariaLabel: null,
124
+ ariaDisabled: (e) => e.disabled || e.pending,
125
+ ariaPressed: (e) => e.pressed ? "true" : e.ariaPressed ?? null
126
+ })}
127
+ ${a("control")}
128
+ @click="${(e, t) => e.clickHandler(t.event)}"
21
129
  >
22
- ${i((e) => typeof e.value == "number", n`
23
- <svg class="progress" viewBox="0 0 16 16">
24
- <circle class="background" cx="8px" cy="8px" r="7px"></circle>
25
- <circle
26
- class="determinate"
27
- style="stroke-dasharray: ${(e) => f * e.percentComplete / 100}px ${f}px"
28
- cx="8px"
29
- cy="8px"
30
- r="7px"
31
- ></circle>
32
- </svg>
33
- `)}
34
- ${i((e) => typeof e.value != "number", n`
35
- <svg class="progress" viewBox="0 0 16 16">
36
- <circle class="background" cx="8px" cy="8px" r="7px"></circle>
37
- <circle
38
- class="indeterminate-indicator-1"
39
- cx="8px"
40
- cy="8px"
41
- r="7px"
42
- ></circle>
43
- </svg>
44
- `)}
45
- </div>
46
- </template>`, [], { styles: u }), m = e(p);
130
+ ${A(e)}
131
+ </button>`;
132
+ }
133
+ function M(e) {
134
+ return r`${(t) => t._renderLinkElement(A(e), D, { ariaLabel: null })}`;
135
+ }
136
+ //#endregion
137
+ //#region src/lib/button/definition.ts
138
+ var N = i("button", C, (e) => r` <template>
139
+ ${o((e) => !e.href, r`${j(e)}`)}
140
+ ${o((e) => e.href, M(e))}
141
+ </template>`, [u, g], {
142
+ styles: w,
143
+ shadowOptions: { delegatesFocus: !0 }
144
+ }), P = t(N);
47
145
  //#endregion
48
- export { m as n, d as r, p as t };
146
+ export { C as i, P as n, T as r, N as t };
@@ -1,29 +1,6 @@
1
- const e=require(`./localized.cjs`),t=require(`./vivid-element.cjs`),n=require(`./ref.cjs`),r=require(`./when.cjs`),i=require(`./enums.cjs`),a=require(`./decorate.cjs`),o=require(`./class-names.cjs`),s=require(`./definition3.cjs`),c=require(`./icon.cjs`),l=require(`./affix.cjs`),u=require(`./definition5.cjs`),d=require(`./delegates-aria.cjs`),f=require(`./button.cjs`),p=require(`./linkable.cjs`);var m=class extends l.n(e.t(p.t(f.t))){constructor(){super(),this.stacked=!1,this.pending=!1,this.dropdownIndicator=!1,this.active=!1,this.pressed=!1,this.title=``}clickHandler(e){if(this.disabled||this.pending){e.preventDefault(),e.stopImmediatePropagation();return}return!0}};a.t([t.m({converter:{fromView:e=>e||null,toView:e=>e||null}})],m.prototype,`title`,void 0),a.t([t.m],m.prototype,`connotation`,void 0),a.t([t.m],m.prototype,`shape`,void 0),a.t([t.m],m.prototype,`appearance`,void 0),a.t([t.m],m.prototype,`size`,void 0),a.t([t.m({mode:`boolean`,attribute:`stacked`})],m.prototype,`stacked`,void 0),a.t([t.m({mode:`boolean`,attribute:`pending`})],m.prototype,`pending`,void 0),a.t([t.m({mode:`boolean`,attribute:`dropdown-indicator`})],m.prototype,`dropdownIndicator`,void 0),a.t([t.m({mode:`boolean`,attribute:`active`})],m.prototype,`active`,void 0),a.t([t.m({mode:`boolean`,attribute:`pressed`})],m.prototype,`pressed`,void 0),a.t([t.m],m.prototype,`label`,void 0);var h=`.chevron{font:var(--vvd-typography-base-extended);flex-shrink:0;display:flex;transform:rotate(0)}@media (prefers-reduced-motion:no-preference){.chevron{transition:transform .2s}}:host([data-expanded=true]) .chevron,:host([open]) .chevron{transform:rotate(180deg)}:host{--_vvd-button-accent-firm-wrapper:var(--vvd-button-accent-firm);--_vvd-button-cta-firm-wrapper:var(--vvd-button-cta-firm);--_vvd-button-success-firm-wrapper:var(--vvd-button-success-firm);--_vvd-button-alert-firm-wrapper:var(--vvd-button-alert-firm);--_vvd-button-announcement-firm-wrapper:var(--vvd-button-announcement-firm)}.control:not(.appearance-ghost-light,.appearance-filled,.appearance-outlined){--vvd-button-accent-firm:var(--_vvd-button-accent-firm-wrapper,var(--vvd-button-accent-primary));--vvd-button-cta-firm:var(--_vvd-button-cta-firm-wrapper,var(--vvd-button-cta-primary));--vvd-button-success-firm:var(--_vvd-button-success-firm-wrapper,var(--vvd-button-success-primary));--vvd-button-alert-firm:var(--_vvd-button-alert-firm-wrapper,var(--vvd-button-alert-primary));--vvd-button-announcement-firm:var(--_vvd-button-announcement-firm-wrapper,var(--vvd-button-announcement-primary))}:host{display:inline-block}.control.connotation-cta{--_connotation-color-primary:var(--vvd-button-cta-primary,var(--vvd-color-cta-500));--_connotation-color-primary-text:var(--vvd-button-cta-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-button-cta-primary-increment,var(--vvd-color-cta-600));--_connotation-color-contrast:var(--vvd-button-cta-contrast,var(--vvd-color-cta-800));--_connotation-color-fierce:var(--vvd-button-cta-fierce,var(--vvd-color-cta-700));--_connotation-color-firm:var(--vvd-button-cta-firm,var(--vvd-color-cta-600));--_connotation-color-soft:var(--vvd-button-cta-soft,var(--vvd-color-cta-100));--_connotation-color-faint:var(--vvd-button-cta-faint,var(--vvd-color-cta-50));--_connotation-color-fierce-primary:var(--vvd-button-cta-fierce-primary,var(--vvd-color-cta-700));--_connotation-color-dim:var(--vvd-button-cta-dim,var(--vvd-color-cta-200));--_connotation-color-pale:var(--vvd-button-cta-pale,var(--vvd-color-cta-300))}.control.connotation-success{--_connotation-color-primary:var(--vvd-button-success-primary,var(--vvd-color-success-500));--_connotation-color-primary-text:var(--vvd-button-success-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-button-success-primary-increment,var(--vvd-color-success-600));--_connotation-color-contrast:var(--vvd-button-success-contrast,var(--vvd-color-success-800));--_connotation-color-fierce:var(--vvd-button-success-fierce,var(--vvd-color-success-700));--_connotation-color-firm:var(--vvd-button-success-firm,var(--vvd-color-success-600));--_connotation-color-soft:var(--vvd-button-success-soft,var(--vvd-color-success-100));--_connotation-color-faint:var(--vvd-button-success-faint,var(--vvd-color-success-50));--_connotation-color-fierce-primary:var(--vvd-button-success-fierce-primary,var(--vvd-color-success-700));--_connotation-color-dim:var(--vvd-button-success-dim,var(--vvd-color-success-200));--_connotation-color-pale:var(--vvd-button-success-pale,var(--vvd-color-success-300))}.control.connotation-alert{--_connotation-color-primary:var(--vvd-button-alert-primary,var(--vvd-color-alert-500));--_connotation-color-primary-text:var(--vvd-button-alert-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-button-alert-primary-increment,var(--vvd-color-alert-600));--_connotation-color-contrast:var(--vvd-button-alert-contrast,var(--vvd-color-alert-800));--_connotation-color-fierce:var(--vvd-button-alert-fierce,var(--vvd-color-alert-700));--_connotation-color-firm:var(--vvd-button-alert-firm,var(--vvd-color-alert-600));--_connotation-color-soft:var(--vvd-button-alert-soft,var(--vvd-color-alert-100));--_connotation-color-faint:var(--vvd-button-alert-faint,var(--vvd-color-alert-50));--_connotation-color-fierce-primary:var(--vvd-button-alert-fierce-primary,var(--vvd-color-alert-700));--_connotation-color-dim:var(--vvd-button-alert-dim,var(--vvd-color-alert-200));--_connotation-color-pale:var(--vvd-button-alert-pale,var(--vvd-color-alert-300))}.control.connotation-announcement{--_connotation-color-primary:var(--vvd-button-announcement-primary,var(--vvd-color-announcement-500));--_connotation-color-primary-text:var(--vvd-button-announcement-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-button-announcement-primary-increment,var(--vvd-color-announcement-600));--_connotation-color-contrast:var(--vvd-button-announcement-contrast,var(--vvd-color-announcement-800));--_connotation-color-fierce:var(--vvd-button-announcement-fierce,var(--vvd-color-announcement-700));--_connotation-color-firm:var(--vvd-button-announcement-firm,var(--vvd-color-announcement-600));--_connotation-color-soft:var(--vvd-button-announcement-soft,var(--vvd-color-announcement-100));--_connotation-color-faint:var(--vvd-button-announcement-faint,var(--vvd-color-announcement-50));--_connotation-color-fierce-primary:var(--vvd-button-announcement-fierce-primary,var(--vvd-color-announcement-700));--_connotation-color-dim:var(--vvd-button-announcement-dim,var(--vvd-color-announcement-200));--_connotation-color-pale:var(--vvd-button-announcement-pale,var(--vvd-color-announcement-300))}.control:not(.connotation-cta,.connotation-success,.connotation-alert,.connotation-announcement){--_connotation-color-primary:var(--vvd-button-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-button-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-button-accent-primary-increment,var(--vvd-color-neutral-800));--_connotation-color-contrast:var(--vvd-button-accent-contrast,var(--vvd-color-neutral-800));--_connotation-color-fierce:var(--vvd-button-accent-fierce,var(--vvd-color-neutral-700));--_connotation-color-firm:var(--vvd-button-accent-firm,var(--vvd-color-canvas-text));--_connotation-color-soft:var(--vvd-button-accent-soft,var(--vvd-color-neutral-100));--_connotation-color-faint:var(--vvd-button-accent-faint,var(--vvd-color-neutral-50));--_connotation-color-fierce-primary:var(--vvd-button-accent-fierce-primary,var(--vvd-color-canvas-text));--_connotation-color-dim:var(--vvd-button-accent-dim,var(--vvd-color-neutral-200));--_connotation-color-pale:var(--vvd-button-accent-pale,var(--vvd-color-neutral-300))}.control.appearance-filled{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary);--_appearance-color-outline:transparent}.control.appearance-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control,.control.appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.control.appearance-outlined-light{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.control.appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 85%);--_appearance-color-outline:transparent}@media (hover:hover){.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-filled{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary-increment);--_appearance-color-outline:transparent}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 90%);--_appearance-color-outline:transparent}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-outlined-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 90%);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-dim);--_appearance-color-outline:transparent}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 75%);--_appearance-color-outline:transparent}}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-filled{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary-increment);--_appearance-color-outline:transparent}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 90%);--_appearance-color-outline:transparent}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-outlined-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 90%);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-dim);--_appearance-color-outline:transparent}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 75%);--_appearance-color-outline:transparent}.control:disabled.appearance-filled{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:transparent}.control:disabled.appearance-outlined{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:disabled,.control:disabled.appearance-ghost-light{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.control:disabled.appearance-outlined-light{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:disabled.appearance-subtle,.control:disabled.appearance-subtle-light,.control.disabled.appearance-filled{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:transparent}.control.disabled.appearance-outlined{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.disabled,.control.disabled.appearance-ghost-light{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.control.disabled.appearance-outlined-light{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.disabled.appearance-subtle,.control.disabled.appearance-subtle-light{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)).appearance-filled{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-fierce);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)).appearance-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 80%);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)).appearance-outlined-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 80%);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:active:where(:not(.disabled,:disabled)).appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-pale);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)).appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 65%);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-filled{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-fierce);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 80%);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-outlined-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 80%);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.active:where(:not(.disabled,:disabled)).appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-pale);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 65%);--_appearance-color-outline:transparent}.control{--focus-stroke-gap-color:transparent;box-sizing:border-box;border-radius:var(--_button-border-radius);background-color:var(--_appearance-color-fill);block-size:var(--_button-block-size);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);color:var(--_appearance-color-text);justify-content:space-between;align-items:center;gap:var(--_button-icon-gap);vertical-align:middle;border:0;margin:0;text-decoration:none;display:inline-flex}.control .text{-webkit-line-clamp:var(--button-line-clamp,1);text-align:start;-webkit-box-orient:vertical;max-inline-size:100%;display:-webkit-box;overflow:hidden}.control:not(.icon-only){inline-size:100%}.control:not(.disabled){cursor:var(--button-cursor,pointer)}.control.disabled{cursor:not-allowed}.control{user-select:none}.control:not(.stacked).size-super-condensed{--_button-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16));font:var(--vvd-typography-base-condensed-bold);--_button-icon-gap:4px;--_button-chevron-size:10px}.control:not(.stacked).size-super-condensed.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control:not(.stacked).size-super-condensed:not(.icon-only){padding-inline:8px}.control:not(.stacked).size-condensed{--_button-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8));font:var(--vvd-typography-base-condensed-bold);--_button-icon-gap:8px;--_button-chevron-size:12px}.control:not(.stacked).size-condensed.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control:not(.stacked).size-condensed:not(.icon-only){padding-inline:12px}.control:not(.stacked).size-expanded{--_button-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 8));font:var(--vvd-typography-base-extended-bold);--_button-icon-gap:10px;--_button-chevron-size:16px}.control:not(.stacked).size-expanded.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control:not(.stacked).size-expanded:not(.icon-only){padding-inline:20px}.control:not(.stacked):not(.size-condensed,.size-expanded,.size-super-condensed){--_button-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)));font:var(--vvd-typography-base-bold);--_button-icon-gap:8px;--_button-chevron-size:16px}.control:not(.stacked):not(.size-condensed,.size-expanded,.size-super-condensed).icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control:not(.stacked):not(.size-condensed,.size-expanded,.size-super-condensed):not(.icon-only){padding-inline:16px}.control:not(.shape-pill){--_button-border-radius:8px}.control:not(.shape-pill).size-condensed:not(.stacked),.control:not(.shape-pill).size-super-condensed:not(.stacked){--_button-border-radius:4px}.control.shape-pill:not(.icon-only,.stacked.size-super-condensed,.stacked.size-condensed,.stacked.normal){--_button-border-radius:24px}.control.shape-pill.stacked.size-condensed,.control.shape-pill.stacked.size-super-condensed{--_button-border-radius:16px}.control.shape-pill.stacked.size-normal{--_button-border-radius:20px}.control.shape-pill.icon-only{--_button-border-radius:50%}.control.stacked.size-super-condensed{--stacked-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16));--_button-block-size:calc(var(--stacked-size) + 20px);font:var(--vvd-typography-base-condensed-bold);--_button-icon-gap:4px;--_button-chevron-size:10px}.control.stacked.size-super-condensed.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control.stacked.size-super-condensed:not(.icon-only){padding-inline:16px}.control.stacked.size-condensed{--stacked-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8));--_button-block-size:calc(var(--stacked-size) + 24px);font:var(--vvd-typography-base-condensed-bold);--_button-icon-gap:6px;--_button-chevron-size:12px}.control.stacked.size-condensed.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control.stacked.size-condensed:not(.icon-only){padding-inline:12px}.control.stacked.size-expanded{--stacked-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 8));--_button-block-size:calc(var(--stacked-size) + 32px);font:var(--vvd-typography-base-extended-bold);--_button-icon-gap:10px;--_button-chevron-size:16px}.control.stacked.size-expanded.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control.stacked.size-expanded:not(.icon-only){padding-inline:20px}.control.stacked:not(.size-condensed,.size-expanded,.size-super-condensed){--stacked-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)));--_button-block-size:calc(var(--stacked-size) + 28px);font:var(--vvd-typography-base-bold);--_button-icon-gap:8px;--_button-chevron-size:16px}.control.stacked:not(.size-condensed,.size-expanded,.size-super-condensed).icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control.stacked:not(.size-condensed,.size-expanded,.size-super-condensed):not(.icon-only){padding-inline:16px}.control.appearance-filled{--focus-stroke-gap-color:transparent}.control.appearance-filled:focus-visible{outline:none;position:relative}.control.appearance-filled:focus-visible:after{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));border-radius:var(--focus-border-radius,inherit);block-size:calc(100% + var(--focus-block-size-addition,4px));content:"";inline-size:calc(100% + var(--focus-block-size-addition,4px));display:block;position:absolute;inset-block-start:50%;inset-inline-start:50%;transform:translate(-50%,-50%)}.control:not(.appearance-filled):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))}slot[name=icon]{line-height:1}.icon-trailing slot[name=icon]{order:1;display:flex}.control.stacked slot[name=icon]{font-size:calc(var(--stacked-size) / 2)}.control:not(.stacked) slot[name=icon]{font-size:calc(var(--_button-block-size) / 2)}.chevron{font-size:var(--_button-chevron-size)}.content{justify-content:center;align-items:center;gap:var(--_button-icon-gap);flex:1;display:flex;overflow:hidden}.control.stacked .content{flex-direction:column}:host([dropdown-indicator]) .content{justify-content:var(--button-content-alignment,flex-start);text-align:start}:host([dropdown-indicator][stacked]) .content{align-items:var(--button-content-alignment,flex-start);justify-content:center}.pending-no-icon{position:absolute}.pending-no-icon+.text{visibility:hidden}:host([icon-trailing][pending]) .pending{order:1}.sr-only{clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}`,g=e=>{let n=e.tagFor(c.t);return t.p`<${n} class="chevron" aria-hidden="true" name="chevron-down-line"></${n}>`};function _(e,t){let n=e??`ghost`;if(t){if(n===`ghost`)return`subtle`;if(n===`ghost-light`)return`subtle-light`;if(n===`outlined`)return`filled`}return n}var v=e=>o.t(`control`,[`connotation-${e.connotation}`,!!e.connotation],`appearance-${_(e.appearance,e.pressed)}`,[`disabled`,e.disabled||e.pending],[`shape-${e.shape}`,!!e.shape],[`size-${e.size}`,!!e.size],[`icon-only`,!e.label&&!!(e.icon||e.iconSlottedContent?.length)&&!e.dropdownIndicator],[`icon-trailing`,e.iconTrailing],[`stacked`,e.stacked],[`active`,e.ariaExpanded===`true`||e.active]);function y(e,n,r,a=i.a.Normal){if(r&&a!=i.a.SuperCondensed){let r=e.tagFor(u.r),s={[i.a.Condensed]:`-6`,[i.a.Normal]:`-5`,[i.a.Expanded]:`-4`};return t.p`<span class="${e=>{let t=e.querySelector(`[slot="icon"]`);return o.t(`icon`,`pending`,[`pending-no-icon`,!(n||t)])}}" aria-hidden="true"><${r} size="${s[a]}"></${r}></span>`}else return l.a(e)(n,l.i.Slot)}var b=e=>[`submit`,`button`,`reset`].indexOf(e)>-1?e:`submit`,x=e=>{let n=g(e);return t.p`<span class="content">
2
- ${t=>y(e,t.icon,t.pending,t.size)}
3
- ${r.t(e=>e.label,t.p`<span class="text" aria-hidden="true">${e=>e.label}</span>`)}
4
- <span class="sr-only"
5
- >${e=>e.pending?e.locale.button.pendingLabel:e.ariaLabel??e.label}</span
6
- >
7
- </span>
8
- ${r.t(e=>e.dropdownIndicator,n)}`};function S(e){return t.p` <button
9
- class="${v}"
10
- ?autofocus="${e=>e.autofocus}"
11
- form="${e=>e.formId}"
12
- formaction="${e=>e.formaction}"
13
- formenctype="${e=>e.formenctype}"
14
- formmethod="${e=>e.formmethod}"
15
- formnovalidate="${e=>e.formnovalidate}"
16
- formtarget="${e=>e.formtarget}"
17
- name="${e=>e.name}"
18
- type="${e=>b(e.type)}"
19
- value="${e=>e.value}"
20
- title="${e=>e.title}"
21
- ${d.n({ariaLabel:null,ariaDisabled:e=>e.disabled||e.pending,ariaPressed:e=>e.pressed?`true`:e.ariaPressed??null})}
22
- ${n.t(`control`)}
23
- @click="${(e,t)=>e.clickHandler(t.event)}"
24
- >
25
- ${x(e)}
26
- </button>`}function C(e){return t.p`${t=>t._renderLinkElement(x(e),v,{ariaLabel:null})}`}var w=t.u(`button`,m,e=>t.p` <template>
27
- ${r.t(e=>!e.href,t.p`${S(e)}`)}
28
- ${r.t(e=>e.href,C(e))}
29
- </template>`,[s.t,u.t],{styles:h,shadowOptions:{delegatesFocus:!0}}),T=t.d(w);Object.defineProperty(exports,`i`,{enumerable:!0,get:function(){return m}}),Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return T}}),Object.defineProperty(exports,`r`,{enumerable:!0,get:function(){return g}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return w}});
1
+ const e=require("./vivid-element.cjs"),t=require("./decorate.cjs"),n=require("./class-names.cjs");var r=class extends e.t{};t.t([e.m],r.prototype,`dp`,void 0),t.t([e.m({attribute:`no-shadow`,mode:`boolean`})],r.prototype,`noShadow`,void 0),t.t([e.m({attribute:`not-relative`,mode:`boolean`})],r.prototype,`notRelative`,void 0);var i=`:host,.control{display:contents}.control.dp-0{--_elevation-fill:var(--_vvd-tinted-color-surface-0dp,var(--vvd-color-surface-0dp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-0dp,var(--vvd-shadow-surface-0dp))}.control.dp-4{--_elevation-fill:var(--_vvd-tinted-color-surface-4dp,var(--vvd-color-surface-4dp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-4dp,var(--vvd-shadow-surface-4dp))}.control.dp-8{--_elevation-fill:var(--_vvd-tinted-color-surface-8dp,var(--vvd-color-surface-8dp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-8dp,var(--vvd-shadow-surface-8dp))}.control.dp-12{--_elevation-fill:var(--_vvd-tinted-color-surface-12dp,var(--vvd-color-surface-12dp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-12dp,var(--vvd-shadow-surface-12dp))}.control.dp-16{--_elevation-fill:var(--_vvd-tinted-color-surface-16dp,var(--vvd-color-surface-16dp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-16dp,var(--vvd-shadow-surface-16dp))}.control.dp-24{--_elevation-fill:var(--_vvd-tinted-color-surface-24dp,var(--vvd-color-surface-24dp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-24dp,var(--vvd-shadow-surface-24dp))}.control:not(.dp-0,.dp-4,.dp-8,.dp-12,.dp-16,.dp-24){--_elevation-fill:var(--_vvd-tinted-color-surface-2dp,var(--vvd-color-surface-2dp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-2dp,var(--vvd-shadow-surface-2dp))}.control ::slotted(*){isolation:isolate}.control ::slotted(*):before{z-index:-1;border-radius:inherit;background:var(--_elevation-fill);content:"";block-size:100%;filter:var(--_elevation-shadow);inline-size:100%;transition:background-color .15s linear,filter .15s linear;position:absolute;inset-block-start:0;inset-inline-start:0}.control:not(.not-relative) ::slotted(*){position:relative}.control.no-shadow ::slotted(*):before{filter:none}`,a=e.p` <div
2
+ class="${e=>n.t(`control`,[`dp-${e.dp}`,!!e.dp],[`no-shadow`,!!e.noShadow],[`not-relative`,!!e.notRelative])}"
3
+ part="base"
4
+ >
5
+ <slot></slot>
6
+ </div>`,o=e.u(`elevation`,r,a,[],{styles:i}),s=e.d(o);Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return s}}),Object.defineProperty(exports,"r",{enumerable:!0,get:function(){return r}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return o}});
@@ -1,132 +1,22 @@
1
- import { t as e } from "./localized.js";
2
- import { d as t, m as n, p as r, u as i } from "./vivid-element.js";
3
- import { t as a } from "./ref.js";
4
- import { t as o } from "./when.js";
5
- import { a as s } from "./enums.js";
6
- import { t as c } from "./decorate.js";
7
- import { t as l } from "./class-names.js";
8
- import { t as u } from "./definition3.js";
9
- import { t as d } from "./icon.js";
10
- import { a as f, i as p, n as m } from "./affix.js";
11
- import { r as h, t as g } from "./definition5.js";
12
- import { n as _ } from "./delegates-aria.js";
13
- import { t as v } from "./button.js";
14
- import { t as y } from "./linkable.js";
15
- //#region src/lib/button/button.ts
16
- var b = class extends m(e(y(v))) {
17
- constructor() {
18
- super(), this.stacked = !1, this.pending = !1, this.dropdownIndicator = !1, this.active = !1, this.pressed = !1, this.title = "";
19
- }
20
- clickHandler(e) {
21
- /* v8 ignore else -- @preserve */
22
- if (this.disabled || this.pending) {
23
- e.preventDefault(), e.stopImmediatePropagation();
24
- return;
25
- }
26
- return !0;
27
- }
28
- };
29
- c([n({ converter: {
30
- fromView: (e) => e || null,
31
- toView: (e) => e || null
32
- } })], b.prototype, "title", void 0), c([n], b.prototype, "connotation", void 0), c([n], b.prototype, "shape", void 0), c([n], b.prototype, "appearance", void 0), c([n], b.prototype, "size", void 0), c([n({
33
- mode: "boolean",
34
- attribute: "stacked"
35
- })], b.prototype, "stacked", void 0), c([n({
36
- mode: "boolean",
37
- attribute: "pending"
38
- })], b.prototype, "pending", void 0), c([n({
39
- mode: "boolean",
40
- attribute: "dropdown-indicator"
41
- })], b.prototype, "dropdownIndicator", void 0), c([n({
42
- mode: "boolean",
43
- attribute: "active"
44
- })], b.prototype, "active", void 0), c([n({
45
- mode: "boolean",
46
- attribute: "pressed"
47
- })], b.prototype, "pressed", void 0), c([n], b.prototype, "label", void 0);
1
+ import { d as e, m as t, p as n, t as r, u as i } from "./vivid-element.js";
2
+ import { t as a } from "./decorate.js";
3
+ import { t as o } from "./class-names.js";
4
+ //#region src/lib/elevation/elevation.ts
5
+ var s = class extends r {};
6
+ a([t], s.prototype, "dp", void 0), a([t({
7
+ attribute: "no-shadow",
8
+ mode: "boolean"
9
+ })], s.prototype, "noShadow", void 0), a([t({
10
+ attribute: "not-relative",
11
+ mode: "boolean"
12
+ })], s.prototype, "notRelative", void 0);
48
13
  //#endregion
49
- //#region src/lib/button/button.scss?inline
50
- var x = ".chevron{font:var(--vvd-typography-base-extended);flex-shrink:0;display:flex;transform:rotate(0)}@media (prefers-reduced-motion:no-preference){.chevron{transition:transform .2s}}:host([data-expanded=true]) .chevron,:host([open]) .chevron{transform:rotate(180deg)}:host{--_vvd-button-accent-firm-wrapper:var(--vvd-button-accent-firm);--_vvd-button-cta-firm-wrapper:var(--vvd-button-cta-firm);--_vvd-button-success-firm-wrapper:var(--vvd-button-success-firm);--_vvd-button-alert-firm-wrapper:var(--vvd-button-alert-firm);--_vvd-button-announcement-firm-wrapper:var(--vvd-button-announcement-firm)}.control:not(.appearance-ghost-light,.appearance-filled,.appearance-outlined){--vvd-button-accent-firm:var(--_vvd-button-accent-firm-wrapper,var(--vvd-button-accent-primary));--vvd-button-cta-firm:var(--_vvd-button-cta-firm-wrapper,var(--vvd-button-cta-primary));--vvd-button-success-firm:var(--_vvd-button-success-firm-wrapper,var(--vvd-button-success-primary));--vvd-button-alert-firm:var(--_vvd-button-alert-firm-wrapper,var(--vvd-button-alert-primary));--vvd-button-announcement-firm:var(--_vvd-button-announcement-firm-wrapper,var(--vvd-button-announcement-primary))}:host{display:inline-block}.control.connotation-cta{--_connotation-color-primary:var(--vvd-button-cta-primary,var(--vvd-color-cta-500));--_connotation-color-primary-text:var(--vvd-button-cta-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-button-cta-primary-increment,var(--vvd-color-cta-600));--_connotation-color-contrast:var(--vvd-button-cta-contrast,var(--vvd-color-cta-800));--_connotation-color-fierce:var(--vvd-button-cta-fierce,var(--vvd-color-cta-700));--_connotation-color-firm:var(--vvd-button-cta-firm,var(--vvd-color-cta-600));--_connotation-color-soft:var(--vvd-button-cta-soft,var(--vvd-color-cta-100));--_connotation-color-faint:var(--vvd-button-cta-faint,var(--vvd-color-cta-50));--_connotation-color-fierce-primary:var(--vvd-button-cta-fierce-primary,var(--vvd-color-cta-700));--_connotation-color-dim:var(--vvd-button-cta-dim,var(--vvd-color-cta-200));--_connotation-color-pale:var(--vvd-button-cta-pale,var(--vvd-color-cta-300))}.control.connotation-success{--_connotation-color-primary:var(--vvd-button-success-primary,var(--vvd-color-success-500));--_connotation-color-primary-text:var(--vvd-button-success-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-button-success-primary-increment,var(--vvd-color-success-600));--_connotation-color-contrast:var(--vvd-button-success-contrast,var(--vvd-color-success-800));--_connotation-color-fierce:var(--vvd-button-success-fierce,var(--vvd-color-success-700));--_connotation-color-firm:var(--vvd-button-success-firm,var(--vvd-color-success-600));--_connotation-color-soft:var(--vvd-button-success-soft,var(--vvd-color-success-100));--_connotation-color-faint:var(--vvd-button-success-faint,var(--vvd-color-success-50));--_connotation-color-fierce-primary:var(--vvd-button-success-fierce-primary,var(--vvd-color-success-700));--_connotation-color-dim:var(--vvd-button-success-dim,var(--vvd-color-success-200));--_connotation-color-pale:var(--vvd-button-success-pale,var(--vvd-color-success-300))}.control.connotation-alert{--_connotation-color-primary:var(--vvd-button-alert-primary,var(--vvd-color-alert-500));--_connotation-color-primary-text:var(--vvd-button-alert-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-button-alert-primary-increment,var(--vvd-color-alert-600));--_connotation-color-contrast:var(--vvd-button-alert-contrast,var(--vvd-color-alert-800));--_connotation-color-fierce:var(--vvd-button-alert-fierce,var(--vvd-color-alert-700));--_connotation-color-firm:var(--vvd-button-alert-firm,var(--vvd-color-alert-600));--_connotation-color-soft:var(--vvd-button-alert-soft,var(--vvd-color-alert-100));--_connotation-color-faint:var(--vvd-button-alert-faint,var(--vvd-color-alert-50));--_connotation-color-fierce-primary:var(--vvd-button-alert-fierce-primary,var(--vvd-color-alert-700));--_connotation-color-dim:var(--vvd-button-alert-dim,var(--vvd-color-alert-200));--_connotation-color-pale:var(--vvd-button-alert-pale,var(--vvd-color-alert-300))}.control.connotation-announcement{--_connotation-color-primary:var(--vvd-button-announcement-primary,var(--vvd-color-announcement-500));--_connotation-color-primary-text:var(--vvd-button-announcement-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-button-announcement-primary-increment,var(--vvd-color-announcement-600));--_connotation-color-contrast:var(--vvd-button-announcement-contrast,var(--vvd-color-announcement-800));--_connotation-color-fierce:var(--vvd-button-announcement-fierce,var(--vvd-color-announcement-700));--_connotation-color-firm:var(--vvd-button-announcement-firm,var(--vvd-color-announcement-600));--_connotation-color-soft:var(--vvd-button-announcement-soft,var(--vvd-color-announcement-100));--_connotation-color-faint:var(--vvd-button-announcement-faint,var(--vvd-color-announcement-50));--_connotation-color-fierce-primary:var(--vvd-button-announcement-fierce-primary,var(--vvd-color-announcement-700));--_connotation-color-dim:var(--vvd-button-announcement-dim,var(--vvd-color-announcement-200));--_connotation-color-pale:var(--vvd-button-announcement-pale,var(--vvd-color-announcement-300))}.control:not(.connotation-cta,.connotation-success,.connotation-alert,.connotation-announcement){--_connotation-color-primary:var(--vvd-button-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-button-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-button-accent-primary-increment,var(--vvd-color-neutral-800));--_connotation-color-contrast:var(--vvd-button-accent-contrast,var(--vvd-color-neutral-800));--_connotation-color-fierce:var(--vvd-button-accent-fierce,var(--vvd-color-neutral-700));--_connotation-color-firm:var(--vvd-button-accent-firm,var(--vvd-color-canvas-text));--_connotation-color-soft:var(--vvd-button-accent-soft,var(--vvd-color-neutral-100));--_connotation-color-faint:var(--vvd-button-accent-faint,var(--vvd-color-neutral-50));--_connotation-color-fierce-primary:var(--vvd-button-accent-fierce-primary,var(--vvd-color-canvas-text));--_connotation-color-dim:var(--vvd-button-accent-dim,var(--vvd-color-neutral-200));--_connotation-color-pale:var(--vvd-button-accent-pale,var(--vvd-color-neutral-300))}.control.appearance-filled{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary);--_appearance-color-outline:transparent}.control.appearance-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control,.control.appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.control.appearance-outlined-light{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.control.appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 85%);--_appearance-color-outline:transparent}@media (hover:hover){.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-filled{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary-increment);--_appearance-color-outline:transparent}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 90%);--_appearance-color-outline:transparent}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-outlined-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 90%);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-dim);--_appearance-color-outline:transparent}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 75%);--_appearance-color-outline:transparent}}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-filled{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary-increment);--_appearance-color-outline:transparent}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 90%);--_appearance-color-outline:transparent}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-outlined-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 90%);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-dim);--_appearance-color-outline:transparent}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 75%);--_appearance-color-outline:transparent}.control:disabled.appearance-filled{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:transparent}.control:disabled.appearance-outlined{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:disabled,.control:disabled.appearance-ghost-light{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.control:disabled.appearance-outlined-light{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:disabled.appearance-subtle,.control:disabled.appearance-subtle-light,.control.disabled.appearance-filled{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:transparent}.control.disabled.appearance-outlined{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.disabled,.control.disabled.appearance-ghost-light{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.control.disabled.appearance-outlined-light{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.disabled.appearance-subtle,.control.disabled.appearance-subtle-light{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)).appearance-filled{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-fierce);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)).appearance-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 80%);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)).appearance-outlined-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 80%);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:active:where(:not(.disabled,:disabled)).appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-pale);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)).appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 65%);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-filled{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-fierce);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 80%);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-outlined-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 80%);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.active:where(:not(.disabled,:disabled)).appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-pale);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 65%);--_appearance-color-outline:transparent}.control{--focus-stroke-gap-color:transparent;box-sizing:border-box;border-radius:var(--_button-border-radius);background-color:var(--_appearance-color-fill);block-size:var(--_button-block-size);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);color:var(--_appearance-color-text);justify-content:space-between;align-items:center;gap:var(--_button-icon-gap);vertical-align:middle;border:0;margin:0;text-decoration:none;display:inline-flex}.control .text{-webkit-line-clamp:var(--button-line-clamp,1);text-align:start;-webkit-box-orient:vertical;max-inline-size:100%;display:-webkit-box;overflow:hidden}.control:not(.icon-only){inline-size:100%}.control:not(.disabled){cursor:var(--button-cursor,pointer)}.control.disabled{cursor:not-allowed}.control{user-select:none}.control:not(.stacked).size-super-condensed{--_button-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16));font:var(--vvd-typography-base-condensed-bold);--_button-icon-gap:4px;--_button-chevron-size:10px}.control:not(.stacked).size-super-condensed.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control:not(.stacked).size-super-condensed:not(.icon-only){padding-inline:8px}.control:not(.stacked).size-condensed{--_button-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8));font:var(--vvd-typography-base-condensed-bold);--_button-icon-gap:8px;--_button-chevron-size:12px}.control:not(.stacked).size-condensed.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control:not(.stacked).size-condensed:not(.icon-only){padding-inline:12px}.control:not(.stacked).size-expanded{--_button-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 8));font:var(--vvd-typography-base-extended-bold);--_button-icon-gap:10px;--_button-chevron-size:16px}.control:not(.stacked).size-expanded.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control:not(.stacked).size-expanded:not(.icon-only){padding-inline:20px}.control:not(.stacked):not(.size-condensed,.size-expanded,.size-super-condensed){--_button-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)));font:var(--vvd-typography-base-bold);--_button-icon-gap:8px;--_button-chevron-size:16px}.control:not(.stacked):not(.size-condensed,.size-expanded,.size-super-condensed).icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control:not(.stacked):not(.size-condensed,.size-expanded,.size-super-condensed):not(.icon-only){padding-inline:16px}.control:not(.shape-pill){--_button-border-radius:8px}.control:not(.shape-pill).size-condensed:not(.stacked),.control:not(.shape-pill).size-super-condensed:not(.stacked){--_button-border-radius:4px}.control.shape-pill:not(.icon-only,.stacked.size-super-condensed,.stacked.size-condensed,.stacked.normal){--_button-border-radius:24px}.control.shape-pill.stacked.size-condensed,.control.shape-pill.stacked.size-super-condensed{--_button-border-radius:16px}.control.shape-pill.stacked.size-normal{--_button-border-radius:20px}.control.shape-pill.icon-only{--_button-border-radius:50%}.control.stacked.size-super-condensed{--stacked-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16));--_button-block-size:calc(var(--stacked-size) + 20px);font:var(--vvd-typography-base-condensed-bold);--_button-icon-gap:4px;--_button-chevron-size:10px}.control.stacked.size-super-condensed.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control.stacked.size-super-condensed:not(.icon-only){padding-inline:16px}.control.stacked.size-condensed{--stacked-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8));--_button-block-size:calc(var(--stacked-size) + 24px);font:var(--vvd-typography-base-condensed-bold);--_button-icon-gap:6px;--_button-chevron-size:12px}.control.stacked.size-condensed.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control.stacked.size-condensed:not(.icon-only){padding-inline:12px}.control.stacked.size-expanded{--stacked-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 8));--_button-block-size:calc(var(--stacked-size) + 32px);font:var(--vvd-typography-base-extended-bold);--_button-icon-gap:10px;--_button-chevron-size:16px}.control.stacked.size-expanded.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control.stacked.size-expanded:not(.icon-only){padding-inline:20px}.control.stacked:not(.size-condensed,.size-expanded,.size-super-condensed){--stacked-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)));--_button-block-size:calc(var(--stacked-size) + 28px);font:var(--vvd-typography-base-bold);--_button-icon-gap:8px;--_button-chevron-size:16px}.control.stacked:not(.size-condensed,.size-expanded,.size-super-condensed).icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control.stacked:not(.size-condensed,.size-expanded,.size-super-condensed):not(.icon-only){padding-inline:16px}.control.appearance-filled{--focus-stroke-gap-color:transparent}.control.appearance-filled:focus-visible{outline:none;position:relative}.control.appearance-filled:focus-visible:after{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));border-radius:var(--focus-border-radius,inherit);block-size:calc(100% + var(--focus-block-size-addition,4px));content:\"\";inline-size:calc(100% + var(--focus-block-size-addition,4px));display:block;position:absolute;inset-block-start:50%;inset-inline-start:50%;transform:translate(-50%,-50%)}.control:not(.appearance-filled):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))}slot[name=icon]{line-height:1}.icon-trailing slot[name=icon]{order:1;display:flex}.control.stacked slot[name=icon]{font-size:calc(var(--stacked-size) / 2)}.control:not(.stacked) slot[name=icon]{font-size:calc(var(--_button-block-size) / 2)}.chevron{font-size:var(--_button-chevron-size)}.content{justify-content:center;align-items:center;gap:var(--_button-icon-gap);flex:1;display:flex;overflow:hidden}.control.stacked .content{flex-direction:column}:host([dropdown-indicator]) .content{justify-content:var(--button-content-alignment,flex-start);text-align:start}:host([dropdown-indicator][stacked]) .content{align-items:var(--button-content-alignment,flex-start);justify-content:center}.pending-no-icon{position:absolute}.pending-no-icon+.text{visibility:hidden}:host([icon-trailing][pending]) .pending{order:1}.sr-only{clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}", S = (e) => {
51
- let t = e.tagFor(d);
52
- return r`<${t} class="chevron" aria-hidden="true" name="chevron-down-line"></${t}>`;
53
- };
14
+ //#region src/lib/elevation/elevation.scss?inline
15
+ var c = ":host,.control{display:contents}.control.dp-0{--_elevation-fill:var(--_vvd-tinted-color-surface-0dp,var(--vvd-color-surface-0dp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-0dp,var(--vvd-shadow-surface-0dp))}.control.dp-4{--_elevation-fill:var(--_vvd-tinted-color-surface-4dp,var(--vvd-color-surface-4dp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-4dp,var(--vvd-shadow-surface-4dp))}.control.dp-8{--_elevation-fill:var(--_vvd-tinted-color-surface-8dp,var(--vvd-color-surface-8dp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-8dp,var(--vvd-shadow-surface-8dp))}.control.dp-12{--_elevation-fill:var(--_vvd-tinted-color-surface-12dp,var(--vvd-color-surface-12dp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-12dp,var(--vvd-shadow-surface-12dp))}.control.dp-16{--_elevation-fill:var(--_vvd-tinted-color-surface-16dp,var(--vvd-color-surface-16dp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-16dp,var(--vvd-shadow-surface-16dp))}.control.dp-24{--_elevation-fill:var(--_vvd-tinted-color-surface-24dp,var(--vvd-color-surface-24dp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-24dp,var(--vvd-shadow-surface-24dp))}.control:not(.dp-0,.dp-4,.dp-8,.dp-12,.dp-16,.dp-24){--_elevation-fill:var(--_vvd-tinted-color-surface-2dp,var(--vvd-color-surface-2dp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-2dp,var(--vvd-shadow-surface-2dp))}.control ::slotted(*){isolation:isolate}.control ::slotted(*):before{z-index:-1;border-radius:inherit;background:var(--_elevation-fill);content:\"\";block-size:100%;filter:var(--_elevation-shadow);inline-size:100%;transition:background-color .15s linear,filter .15s linear;position:absolute;inset-block-start:0;inset-inline-start:0}.control:not(.not-relative) ::slotted(*){position:relative}.control.no-shadow ::slotted(*):before{filter:none}", l = n` <div
16
+ class="${(e) => o("control", [`dp-${e.dp}`, !!e.dp], ["no-shadow", !!e.noShadow], ["not-relative", !!e.notRelative])}"
17
+ part="base"
18
+ >
19
+ <slot></slot>
20
+ </div>`, u = i("elevation", s, l, [], { styles: c }), d = e(u);
54
21
  //#endregion
55
- //#region src/lib/button/button.template.ts
56
- function C(e, t) {
57
- let n = e ?? "ghost";
58
- if (t) {
59
- if (n === "ghost") return "subtle";
60
- if (n === "ghost-light") return "subtle-light";
61
- if (n === "outlined") return "filled";
62
- }
63
- return n;
64
- }
65
- var w = (e) => l("control", [`connotation-${e.connotation}`, !!e.connotation], `appearance-${C(e.appearance, e.pressed)}`, ["disabled", e.disabled || e.pending], [`shape-${e.shape}`, !!e.shape], [`size-${e.size}`, !!e.size], ["icon-only", !e.label && !!(e.icon || e.iconSlottedContent?.length) && !e.dropdownIndicator], ["icon-trailing", e.iconTrailing], ["stacked", e.stacked], ["active", e.ariaExpanded === "true" || e.active]);
66
- function T(e, t, n, i = s.Normal) {
67
- if (n && i != s.SuperCondensed) {
68
- let n = e.tagFor(h);
69
- return r`<span class="${(e) => {
70
- let n = e.querySelector("[slot=\"icon\"]");
71
- return l("icon", "pending", ["pending-no-icon", !(t || n)]);
72
- }}" aria-hidden="true"><${n} size="${{
73
- [s.Condensed]: "-6",
74
- [s.Normal]: "-5",
75
- [s.Expanded]: "-4"
76
- }[i]}"></${n}></span>`;
77
- } else return f(e)(t, p.Slot);
78
- }
79
- var E = (e) => [
80
- "submit",
81
- "button",
82
- "reset"
83
- ].indexOf(e) > -1 ? e : "submit", D = (e) => {
84
- let t = S(e);
85
- return r`<span class="content">
86
- ${(t) => T(e, t.icon, t.pending, t.size)}
87
- ${o((e) => e.label, r`<span class="text" aria-hidden="true">${(e) => e.label}</span>`)}
88
- <span class="sr-only"
89
- >${(e) => e.pending ? e.locale.button.pendingLabel : e.ariaLabel ?? e.label}</span
90
- >
91
- </span>
92
- ${o((e) => e.dropdownIndicator, t)}`;
93
- };
94
- function O(e) {
95
- return r` <button
96
- class="${w}"
97
- ?autofocus="${(e) => e.autofocus}"
98
- form="${(e) => e.formId}"
99
- formaction="${(e) => e.formaction}"
100
- formenctype="${(e) => e.formenctype}"
101
- formmethod="${(e) => e.formmethod}"
102
- formnovalidate="${(e) => e.formnovalidate}"
103
- formtarget="${(e) => e.formtarget}"
104
- name="${(e) => e.name}"
105
- type="${(e) => E(e.type)}"
106
- value="${(e) => e.value}"
107
- title="${(e) => e.title}"
108
- ${_({
109
- ariaLabel: null,
110
- ariaDisabled: (e) => e.disabled || e.pending,
111
- ariaPressed: (e) => e.pressed ? "true" : e.ariaPressed ?? null
112
- })}
113
- ${a("control")}
114
- @click="${(e, t) => e.clickHandler(t.event)}"
115
- >
116
- ${D(e)}
117
- </button>`;
118
- }
119
- function k(e) {
120
- return r`${(t) => t._renderLinkElement(D(e), w, { ariaLabel: null })}`;
121
- }
122
- //#endregion
123
- //#region src/lib/button/definition.ts
124
- var A = i("button", b, (e) => r` <template>
125
- ${o((e) => !e.href, r`${O(e)}`)}
126
- ${o((e) => e.href, k(e))}
127
- </template>`, [u, g], {
128
- styles: x,
129
- shadowOptions: { delegatesFocus: !0 }
130
- }), j = t(A);
131
- //#endregion
132
- export { b as i, j as n, S as r, A as t };
22
+ export { d as n, s as r, u as t };
@@ -1,6 +1,14 @@
1
- const e=require(`./vivid-element.cjs`),t=require(`./decorate.cjs`),n=require(`./class-names.cjs`);var r=class extends e.t{};t.t([e.m],r.prototype,`dp`,void 0),t.t([e.m({attribute:`no-shadow`,mode:`boolean`})],r.prototype,`noShadow`,void 0),t.t([e.m({attribute:`not-relative`,mode:`boolean`})],r.prototype,`notRelative`,void 0);var i=`:host,.control{display:contents}.control.dp-0{--_elevation-fill:var(--_vvd-tinted-color-surface-0dp,var(--vvd-color-surface-0dp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-0dp,var(--vvd-shadow-surface-0dp))}.control.dp-4{--_elevation-fill:var(--_vvd-tinted-color-surface-4dp,var(--vvd-color-surface-4dp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-4dp,var(--vvd-shadow-surface-4dp))}.control.dp-8{--_elevation-fill:var(--_vvd-tinted-color-surface-8dp,var(--vvd-color-surface-8dp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-8dp,var(--vvd-shadow-surface-8dp))}.control.dp-12{--_elevation-fill:var(--_vvd-tinted-color-surface-12dp,var(--vvd-color-surface-12dp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-12dp,var(--vvd-shadow-surface-12dp))}.control.dp-16{--_elevation-fill:var(--_vvd-tinted-color-surface-16dp,var(--vvd-color-surface-16dp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-16dp,var(--vvd-shadow-surface-16dp))}.control.dp-24{--_elevation-fill:var(--_vvd-tinted-color-surface-24dp,var(--vvd-color-surface-24dp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-24dp,var(--vvd-shadow-surface-24dp))}.control:not(.dp-0,.dp-4,.dp-8,.dp-12,.dp-16,.dp-24){--_elevation-fill:var(--_vvd-tinted-color-surface-2dp,var(--vvd-color-surface-2dp));--_elevation-shadow:var(--_vvd-tinted-shadow-surface-2dp,var(--vvd-shadow-surface-2dp))}.control ::slotted(*){isolation:isolate}.control ::slotted(*):before{z-index:-1;border-radius:inherit;background:var(--_elevation-fill);content:"";block-size:100%;filter:var(--_elevation-shadow);inline-size:100%;transition:background-color .15s linear,filter .15s linear;position:absolute;inset-block-start:0;inset-inline-start:0}.control:not(.not-relative) ::slotted(*){position:relative}.control.no-shadow ::slotted(*):before{filter:none}`,a=e.p` <div
2
- class="${e=>n.t(`control`,[`dp-${e.dp}`,!!e.dp],[`no-shadow`,!!e.noShadow],[`not-relative`,!!e.notRelative])}"
3
- part="base"
4
- >
5
- <slot></slot>
6
- </div>`,o=e.u(`elevation`,r,a,[],{styles:i}),s=e.d(o);Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return s}}),Object.defineProperty(exports,`r`,{enumerable:!0,get:function(){return r}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return o}});
1
+ const e=require("./vivid-element.cjs"),t=require("./ref.cjs"),n=require("./when.cjs"),r=require("./decorate.cjs"),i=require("./class-names.cjs"),a=require("./definition5.cjs"),o=require("./definition6.cjs"),s=require("./floating-ui.dom.cjs");var c={Flip:`flip`,AutoPlacementHorizontal:`auto-placement-horizontal`,AutoPlacementVertical:`auto-placement-vertical`},l={[c.Flip]:s.a(),[c.AutoPlacementHorizontal]:s.n({allowedPlacements:[`bottom`,`top`,`bottom-start`,`bottom-end`,`top-start`,`top-end`]}),[c.AutoPlacementVertical]:s.n({allowedPlacements:[`left`,`right`,`left-start`,`left-end`,`right-start`,`right-end`]})},u=class extends e.t{constructor(...e){super(...e),this.open=!1,this.dismissible=!1,this.arrow=!1,this.alternate=!1,this.placementStrategy=c.Flip,this.animationFrame=!1,this.shiftCrossAxis=!1,this.strategy=`fixed`,this.offset=null,this.#a=()=>(this.#i=this.updatePosition(),this.#i)}get#e(){let e=[s.s(),l[this.placementStrategy],s.l({crossAxis:this.shiftCrossAxis}),s.o(),s.u({apply({availableWidth:e,availableHeight:t,elements:n}){Object.assign(n.floating.style,{maxWidth:`${e}px`,maxHeight:`${t}px`})}})],t=this.offset??0;return this.arrow&&(t+=12,e=[...e,s.t({element:this.arrowEl,padding:10})]),t>0&&e.unshift(s.c(t)),e}#t;openChanged(e,t){this.#r(),this.#n(),this.$emit(t?`vwc-popup:open`:`vwc-popup:close`)}animationFrameChanged(){this.#n()}shiftCrossAxisChanged(){this.#n()}anchorChanged(){this.#n()}strategyChanged(){this.#r()}connectedCallback(){super.connectedCallback(),this.#r(),this.#n()}disconnectedCallback(){super.disconnectedCallback(),this.#n()}#n(){this.#t?.(),this.isConnected&&(this.open&&this.controlEl&&this.controlEl.classList.add(`open`),this.anchorEl&&this.open&&this.popupEl&&(this.#t=s.r(this.anchorEl,this.popupEl,()=>void this.#a(),{animationFrame:this.animationFrame})))}#r(){this.popupEl&&this.strategy===`fixed`&&(this.open?this.popupEl.showPopover():this.popupEl.hidePopover())}#i;#a;async updatePosition(){if(!this.open||!this.anchorEl)return;let e=await s.i(this.anchorEl,this.popupEl,{placement:this.placement,strategy:this.strategy,middleware:this.#e});this.#o(e),this.arrow&&this.#s(e)}#o(e){let{x:t,y:n}=e,{referenceHidden:r}=e.middlewareData.hide;Object.assign(this.popupEl.style,{left:`${t}px`,top:`${n}px`,visibility:r?`hidden`:`visible`})}#s(e){let{x:t,y:n}=e.middlewareData.arrow,r={left:`calc(100% - 4px)`,right:`-4px`,top:`calc(100% - 4px)`,bottom:`-4px`},i=e.placement.split(`-`)[0];Object.assign(this.arrowEl.style,{left:t?`${t}px`:r[i],top:n?`${n}px`:r[i]})}get anchorEl(){return this.anchor??null}show(){return this.open=!0,this.#i??Promise.resolve()}hide(){this.open=!1}};r.t([e.m({mode:`boolean`})],u.prototype,`open`,void 0),r.t([e.m({mode:`boolean`})],u.prototype,`dismissible`,void 0),r.t([e.m({mode:`boolean`})],u.prototype,`arrow`,void 0),r.t([e.m({mode:`boolean`})],u.prototype,`alternate`,void 0),r.t([e.m({mode:`fromView`})],u.prototype,`placement`,void 0),r.t([e.m({mode:`boolean`,attribute:`animation-frame`})],u.prototype,`animationFrame`,void 0),r.t([e.m({mode:`boolean`,attribute:`shift-cross-axis`})],u.prototype,`shiftCrossAxis`,void 0),r.t([e.m({mode:`fromView`})],u.prototype,`strategy`,void 0),r.t([e.m({attribute:`offset`,converter:e.h})],u.prototype,`offset`,void 0),r.t([e.A],u.prototype,`anchor`,void 0);var d=`:host{display:var(--_popup-display,inline)}.control{border-radius:inherit;background:var(--vvd-color-surface-4dp);contain:layout}.control:not(.open){display:none}.popup-wrapper{white-space:initial;--scrollbar-track-color:transparent;--scrollbar-thumb-color:color-mix(in sRGB, var(--vvd-color-neutral-950), transparent 70%);scrollbar-color:var(--scrollbar-thumb-color) var(--scrollbar-track-color);scrollbar-width:thin}.popup-wrapper ::-webkit-scrollbar{width:4px}.popup-wrapper ::-webkit-scrollbar-track{background:var(--scrollbar-track-color)}.popup-wrapper ::-webkit-scrollbar-thumb{background-color:var(--scrollbar-fallback-track-color,var(--scrollbar-thumb-color));border:0;border-radius:4px}.popup-wrapper{z-index:var(--_popup-z-index,10);border:none;border-radius:8px;inline-size:max-content;min-inline-size:fit-content;margin:0;padding:0;overflow:visible}.popup-wrapper:not(.absolute){position:fixed}.popup-wrapper.absolute{position:absolute;top:0;left:0}.popup-content{color:var(--vvd-color-canvas-text);display:grid}.dismissible .popup-content{grid-template-columns:1fr auto;align-content:start}.arrow{z-index:-1;background:var(--vvd-color-surface-4dp);width:8px;height:8px;position:absolute;transform:rotate(45deg)}.dismissible-button{align-self:flex-start;margin-block-start:4px;margin-inline-end:4px}`;function f(e){return e.strategy&&e.strategy===`fixed`?`manual`:null}var p=e.u(`popup`,u,r=>{let s=r.tagFor(o.r),c=r.tagFor(a.i);return e.p`
2
+ <${s}>
3
+ <div popover="${f}" class="popup-wrapper ${e=>e.strategy}" ${t.t(`popupEl`)} part="popup-base">
4
+ <div ${t.t(`controlEl`)} class="${e=>i.t(`control`,[`open`,e.open],[`dismissible`,e.dismissible],[`alternate`,e.alternate])}" aria-hidden="${e=>e.open?`false`:`true`}"
5
+ part="${e=>e.alternate?`vvd-theme-alternate`:``}">
6
+ <div class="popup-content">
7
+ <slot></slot>
8
+ ${n.t(e=>e.dismissible,e.p`<${c} size="condensed" @click="${e=>e.open=!1}"
9
+ class="dismissible-button" icon="close-small-solid" shape="pill"></${c}>`)}
10
+ </div>
11
+ ${n.t(e=>e.arrow,e.p`<div class="arrow" ${t.t(`arrowEl`)}></div>`)}
12
+ </div>
13
+ </div>
14
+ </${s}>`},[o.t,a.t],{styles:d}),m=e.d(p);Object.defineProperty(exports,"i",{enumerable:!0,get:function(){return u}}),Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return m}}),Object.defineProperty(exports,"r",{enumerable:!0,get:function(){return c}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return p}});