@vonage/vivid 5.18.0 → 5.19.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.
- package/accordion/definition.cjs +0 -1
- package/accordion/definition.js +0 -1
- package/accordion/index.cjs +2 -2
- package/accordion/index.js +3 -4
- package/accordion-item/definition.cjs +0 -1
- package/accordion-item/definition.js +0 -1
- package/accordion-item/index.cjs +1 -1
- package/accordion-item/index.js +0 -2
- package/action-group/index.cjs +4 -4
- package/action-group/index.js +7 -7
- package/alert/definition.cjs +0 -1
- package/alert/definition.js +0 -1
- package/alert/index.cjs +5 -5
- package/alert/index.js +20 -21
- package/audio-player/definition.cjs +0 -1
- package/audio-player/definition.js +0 -1
- package/audio-player/index.cjs +13 -13
- package/audio-player/index.js +76 -77
- package/avatar/definition.cjs +0 -1
- package/avatar/definition.js +0 -1
- package/avatar/index.cjs +8 -8
- package/avatar/index.js +20 -21
- package/badge/definition.cjs +0 -1
- package/badge/definition.js +0 -1
- package/badge/index.cjs +1 -1
- package/badge/index.js +0 -2
- package/banner/definition.cjs +0 -1
- package/banner/definition.js +0 -1
- package/banner/index.cjs +4 -4
- package/banner/index.js +17 -18
- package/breadcrumb/index.cjs +2 -2
- package/breadcrumb/index.js +3 -3
- package/breadcrumb-item/definition.cjs +0 -1
- package/breadcrumb-item/definition.js +0 -1
- package/breadcrumb-item/index.cjs +5 -5
- package/breadcrumb-item/index.js +7 -8
- package/bundled/affix.cjs +2 -2
- package/bundled/affix.js +1 -1
- package/bundled/anchored.cjs +1 -1
- package/bundled/anchored.js +1 -1
- package/bundled/aria-binding-directive.cjs +1 -0
- package/bundled/aria-binding-directive.js +29 -0
- package/bundled/base-color-picker.cjs +3 -3
- package/bundled/base-color-picker.js +1 -1
- package/bundled/base-progress.cjs +1 -1
- package/bundled/base-progress.js +2 -2
- package/bundled/breadcrumb-item.cjs +1 -1
- package/bundled/breadcrumb-item.js +3 -3
- package/bundled/button.cjs +1 -1
- package/bundled/button.js +3 -3
- package/bundled/calendar-event.cjs +1 -1
- package/bundled/calendar-event.js +4 -4
- package/bundled/calendar-picker.template.cjs +20 -20
- package/bundled/calendar-picker.template.js +10 -10
- package/bundled/char-count.cjs +2 -2
- package/bundled/char-count.js +3 -3
- package/bundled/children.cjs +1 -1
- package/bundled/children.js +6 -6
- package/bundled/decorate.js +1 -1
- package/bundled/definition.cjs +1 -1
- package/bundled/definition.js +2 -2
- package/bundled/definition10.cjs +3 -3
- package/bundled/definition10.js +19 -19
- package/bundled/definition11.cjs +2 -2
- package/bundled/definition11.js +7 -7
- package/bundled/definition12.cjs +7 -7
- package/bundled/definition12.js +16 -16
- package/bundled/definition13.cjs +3 -3
- package/bundled/definition13.js +6 -6
- package/bundled/definition14.cjs +2 -2
- package/bundled/definition14.js +3 -3
- package/bundled/definition15.cjs +6 -6
- package/bundled/definition15.js +14 -14
- package/bundled/definition16.cjs +3 -3
- package/bundled/definition16.js +19 -19
- package/bundled/definition17.cjs +7 -7
- package/bundled/definition17.js +14 -14
- package/bundled/definition18.cjs +7 -7
- package/bundled/definition18.js +20 -20
- package/bundled/definition19.cjs +2 -2
- package/bundled/definition19.js +3 -3
- package/bundled/definition2.cjs +3 -3
- package/bundled/definition2.js +11 -11
- package/bundled/definition20.cjs +8 -8
- package/bundled/definition20.js +16 -17
- package/bundled/definition21.cjs +5 -5
- package/bundled/definition21.js +26 -26
- package/bundled/definition22.cjs +3 -3
- package/bundled/definition22.js +8 -8
- package/bundled/definition23.cjs +4 -4
- package/bundled/definition23.js +9 -9
- package/bundled/definition24.cjs +5 -5
- package/bundled/definition24.js +15 -15
- package/bundled/definition3.cjs +1 -1
- package/bundled/definition3.js +33 -33
- package/bundled/definition4.cjs +4 -4
- package/bundled/definition4.js +11 -11
- package/bundled/definition5.cjs +5 -5
- package/bundled/definition5.js +10 -10
- package/bundled/definition6.cjs +7 -7
- package/bundled/definition6.js +30 -30
- package/bundled/definition7.cjs +2 -2
- package/bundled/definition7.js +6 -6
- package/bundled/definition8.cjs +4 -4
- package/bundled/definition8.js +15 -15
- package/bundled/definition9.cjs +2 -2
- package/bundled/definition9.js +18 -18
- package/bundled/delegates-aria.cjs +1 -1
- package/bundled/delegates-aria.js +10 -49
- package/bundled/divider.cjs +1 -1
- package/bundled/divider.js +3 -3
- package/bundled/form-associated.cjs +1 -1
- package/bundled/form-associated.js +6 -6
- package/bundled/form-element.cjs +1 -1
- package/bundled/form-element.js +8 -6
- package/bundled/host-semantics.cjs +1 -1
- package/bundled/host-semantics.js +10 -39
- package/bundled/linkable.cjs +2 -2
- package/bundled/linkable.js +1 -1
- package/bundled/listbox.cjs +1 -1
- package/bundled/listbox.js +12 -12
- package/bundled/localized.cjs +1 -1
- package/bundled/localized.js +6 -6
- package/bundled/mixins.cjs +6 -6
- package/bundled/mixins.js +9 -9
- package/bundled/normalize.cjs +1 -1
- package/bundled/normalize.js +2 -2
- package/bundled/picker-field.template.cjs +1 -1
- package/bundled/picker-field.template.js +24 -23
- package/bundled/ref.cjs +1 -1
- package/bundled/ref.js +1 -1
- package/bundled/repeat.cjs +1 -1
- package/bundled/repeat.js +54 -54
- package/bundled/slider.template.cjs +7 -7
- package/bundled/slider.template.js +13 -13
- package/bundled/slottable-request.cjs +1 -1
- package/bundled/slottable-request.js +1 -1
- package/bundled/slotted.cjs +1 -1
- package/bundled/slotted.js +1 -1
- package/bundled/text-field.cjs +1 -1
- package/bundled/text-field.js +1 -1
- package/bundled/time-selection-picker.template.cjs +4 -4
- package/bundled/time-selection-picker.template.js +23 -23
- package/bundled/vivid-element.cjs +1 -1
- package/bundled/vivid-element.js +21 -19
- package/bundled/when.cjs +1 -1
- package/bundled/when.js +1 -1
- package/bundled/with-contextual-help.cjs +1 -1
- package/bundled/with-contextual-help.js +1 -1
- package/bundled/with-error-text.cjs +1 -1
- package/bundled/with-error-text.js +1 -1
- package/bundled/with-success-text.cjs +1 -1
- package/bundled/with-success-text.js +1 -1
- package/button/definition.cjs +0 -1
- package/button/definition.js +0 -1
- package/button/index.cjs +1 -1
- package/button/index.js +0 -2
- package/calendar/index.cjs +8 -8
- package/calendar/index.js +10 -10
- package/calendar-event/index.cjs +6 -6
- package/calendar-event/index.js +8 -8
- package/card/definition.cjs +0 -1
- package/card/definition.js +0 -1
- package/card/index.cjs +14 -14
- package/card/index.js +33 -34
- package/checkbox/definition.cjs +0 -1
- package/checkbox/definition.js +0 -1
- package/checkbox/index.cjs +1 -1
- package/checkbox/index.js +0 -2
- package/color-picker/definition.cjs +0 -1
- package/color-picker/definition.js +0 -1
- package/color-picker/index.cjs +15 -15
- package/color-picker/index.js +42 -42
- package/combobox/definition.cjs +0 -1
- package/combobox/definition.js +0 -1
- package/combobox/index.cjs +4 -4
- package/combobox/index.js +20 -21
- package/contextual-help/definition.cjs +0 -1
- package/contextual-help/definition.js +0 -1
- package/contextual-help/index.cjs +1 -1
- package/contextual-help/index.js +0 -2
- package/country/definition.cjs +0 -1
- package/country/definition.js +0 -1
- package/country/index.cjs +1 -1
- package/country/index.js +0 -2
- package/country-group/definition.cjs +0 -1
- package/country-group/definition.js +0 -1
- package/country-group/index.cjs +4 -4
- package/country-group/index.js +29 -29
- package/custom-elements.json +2544 -2688
- package/data-grid/definition.cjs +0 -1
- package/data-grid/definition.js +0 -1
- package/data-grid/index.cjs +14 -14
- package/data-grid/index.js +103 -104
- package/date-picker/definition.cjs +0 -1
- package/date-picker/definition.js +0 -1
- package/date-picker/index.cjs +1 -1
- package/date-picker/index.js +2 -3
- package/date-range-picker/definition.cjs +0 -1
- package/date-range-picker/definition.js +0 -1
- package/date-range-picker/index.cjs +1 -1
- package/date-range-picker/index.js +6 -7
- package/date-time-picker/definition.cjs +0 -1
- package/date-time-picker/definition.js +0 -1
- package/date-time-picker/index.cjs +2 -2
- package/date-time-picker/index.js +8 -9
- package/dial-pad/definition.cjs +0 -1
- package/dial-pad/definition.js +0 -1
- package/dial-pad/index.cjs +8 -8
- package/dial-pad/index.js +16 -17
- package/dialog/definition.cjs +0 -1
- package/dialog/definition.js +0 -1
- package/dialog/index.cjs +13 -10
- package/dialog/index.js +35 -33
- package/divider/index.cjs +1 -1
- package/divider/index.js +0 -1
- package/elevation/index.cjs +1 -1
- package/elevation/index.js +0 -1
- package/empty-state/definition.cjs +0 -1
- package/empty-state/definition.js +0 -1
- package/empty-state/index.cjs +4 -4
- package/empty-state/index.js +9 -10
- package/fab/definition.cjs +0 -1
- package/fab/definition.js +0 -1
- package/fab/index.cjs +3 -3
- package/fab/index.js +9 -10
- package/file-picker/definition.cjs +0 -1
- package/file-picker/definition.js +0 -1
- package/file-picker/index.cjs +7 -7
- package/file-picker/index.js +22 -23
- package/flag/definition.cjs +0 -1
- package/flag/definition.js +0 -1
- package/flag/index.cjs +3 -3
- package/flag/index.js +11 -11
- package/header/index.cjs +5 -5
- package/header/index.js +11 -11
- package/icon/definition.cjs +0 -1
- package/icon/definition.js +0 -1
- package/icon/index.cjs +1 -1
- package/icon/index.js +0 -2
- package/index.cjs +0 -1
- package/index.js +0 -1
- package/layout/index.cjs +2 -2
- package/layout/index.js +3 -3
- package/lib/avatar/avatar.d.ts +1 -1
- package/lib/breadcrumb-item/breadcrumb-item.d.ts +1 -1
- package/lib/button/button.d.ts +1 -1
- package/lib/card/card.d.ts +1 -1
- package/lib/nav-item/nav-item.d.ts +1 -1
- package/lib/rich-text-editor/rte/utils/ui.d.ts +2 -1
- package/locales/de-DE.cjs +1 -1
- package/locales/en-GB.cjs +1 -1
- package/locales/en-US.cjs +1 -1
- package/locales/ja-JP.cjs +1 -1
- package/locales/zh-CN.cjs +1 -1
- package/menu/definition.cjs +0 -1
- package/menu/definition.js +0 -1
- package/menu/index.cjs +1 -1
- package/menu/index.js +0 -2
- package/menu-item/definition.cjs +0 -1
- package/menu-item/definition.js +0 -1
- package/menu-item/index.cjs +1 -1
- package/menu-item/index.js +0 -2
- package/nav/index.cjs +2 -2
- package/nav/index.js +2 -2
- package/nav-disclosure/definition.cjs +0 -1
- package/nav-disclosure/definition.js +0 -1
- package/nav-disclosure/index.cjs +4 -4
- package/nav-disclosure/index.js +15 -16
- package/nav-item/definition.cjs +0 -1
- package/nav-item/definition.js +0 -1
- package/nav-item/index.cjs +2 -2
- package/nav-item/index.js +10 -11
- package/note/definition.cjs +0 -1
- package/note/definition.js +0 -1
- package/note/index.cjs +2 -2
- package/note/index.js +7 -8
- package/number-field/definition.cjs +0 -1
- package/number-field/definition.js +0 -1
- package/number-field/index.cjs +5 -5
- package/number-field/index.js +16 -17
- package/option/definition.cjs +0 -1
- package/option/definition.js +0 -1
- package/option/index.cjs +1 -1
- package/option/index.js +0 -2
- package/package.json +22 -22
- package/pagination/definition.cjs +0 -1
- package/pagination/definition.js +0 -1
- package/pagination/index.cjs +4 -4
- package/pagination/index.js +11 -12
- package/popover/definition.cjs +0 -1
- package/popover/definition.js +0 -1
- package/popover/index.cjs +6 -6
- package/popover/index.js +28 -29
- package/popup/definition.cjs +0 -1
- package/popup/definition.js +0 -1
- package/popup/index.cjs +1 -1
- package/popup/index.js +0 -2
- package/progress/index.cjs +5 -5
- package/progress/index.js +10 -10
- package/progress-ring/index.cjs +1 -1
- package/progress-ring/index.js +0 -1
- package/radio/index.cjs +1 -1
- package/radio/index.js +0 -1
- package/radio-group/definition.cjs +0 -1
- package/radio-group/definition.js +0 -1
- package/radio-group/index.cjs +6 -6
- package/radio-group/index.js +21 -21
- package/range-slider/definition.cjs +0 -1
- package/range-slider/definition.js +0 -1
- package/range-slider/index.cjs +5 -5
- package/range-slider/index.js +58 -59
- package/rich-text-editor/definition.cjs +0 -1
- package/rich-text-editor/definition.js +0 -1
- package/rich-text-editor/index.cjs +9 -9
- package/rich-text-editor/index.js +2016 -1947
- package/rich-text-view/index.cjs +1 -1
- package/rich-text-view/index.js +2 -2
- package/searchable-select/definition.cjs +0 -1
- package/searchable-select/definition.js +0 -1
- package/searchable-select/index.cjs +23 -23
- package/searchable-select/index.js +109 -108
- package/select/definition.cjs +0 -1
- package/select/definition.js +0 -1
- package/select/index.cjs +1 -1
- package/select/index.js +0 -2
- package/selectable-box/definition.cjs +0 -1
- package/selectable-box/definition.js +0 -1
- package/selectable-box/index.cjs +9 -9
- package/selectable-box/index.js +19 -20
- package/shared/aria/aria-binding-directive.d.ts +21 -0
- package/shared/aria/aria-change-subscription.d.ts +1 -0
- package/shared/aria/delegates-aria.d.ts +1 -1
- package/shared/aria/host-semantics.d.ts +1 -1
- package/shared/patterns/linkable.d.ts +1 -1
- package/side-drawer/index.cjs +3 -3
- package/side-drawer/index.js +4 -4
- package/simple-color-picker/definition.cjs +0 -1
- package/simple-color-picker/definition.js +0 -1
- package/simple-color-picker/index.cjs +2 -2
- package/simple-color-picker/index.js +19 -20
- package/slider/definition.cjs +0 -1
- package/slider/definition.js +0 -1
- package/slider/index.cjs +1 -1
- package/slider/index.js +0 -2
- package/split-button/definition.cjs +0 -1
- package/split-button/definition.js +0 -1
- package/split-button/index.cjs +6 -6
- package/split-button/index.js +17 -18
- package/status/definition.cjs +0 -1
- package/status/definition.js +0 -1
- package/status/index.cjs +2 -2
- package/status/index.js +8 -9
- package/switch/definition.cjs +0 -1
- package/switch/definition.js +0 -1
- package/switch/index.cjs +5 -5
- package/switch/index.js +9 -10
- package/tab/definition.cjs +0 -1
- package/tab/definition.js +0 -1
- package/tab/index.cjs +1 -1
- package/tab/index.js +0 -2
- package/tab-panel/index.cjs +1 -1
- package/tab-panel/index.js +0 -1
- package/table/definition.cjs +0 -1
- package/table/definition.js +0 -1
- package/table/index.cjs +9 -9
- package/table/index.js +21 -22
- package/tabs/definition.cjs +0 -1
- package/tabs/definition.js +0 -1
- package/tabs/index.cjs +2 -2
- package/tabs/index.js +25 -26
- package/tag/definition.cjs +0 -1
- package/tag/definition.js +0 -1
- package/tag/index.cjs +11 -11
- package/tag/index.js +21 -22
- package/tag-group/index.cjs +4 -4
- package/tag-group/index.js +6 -6
- package/text-area/definition.cjs +0 -1
- package/text-area/definition.js +0 -1
- package/text-area/index.cjs +4 -4
- package/text-area/index.js +24 -25
- package/text-field/definition.cjs +0 -1
- package/text-field/definition.js +0 -1
- package/text-field/index.cjs +1 -1
- package/text-field/index.js +0 -2
- package/time-picker/definition.cjs +0 -1
- package/time-picker/definition.js +0 -1
- package/time-picker/index.cjs +1 -1
- package/time-picker/index.js +2 -3
- package/toggletip/definition.cjs +0 -1
- package/toggletip/definition.js +0 -1
- package/toggletip/index.cjs +1 -1
- package/toggletip/index.js +0 -2
- package/tooltip/definition.cjs +0 -1
- package/tooltip/definition.js +0 -1
- package/tooltip/index.cjs +1 -1
- package/tooltip/index.js +0 -2
- package/tree-item/definition.cjs +0 -1
- package/tree-item/definition.js +0 -1
- package/tree-item/index.cjs +1 -1
- package/tree-item/index.js +0 -2
- package/tree-view/definition.cjs +0 -1
- package/tree-view/definition.js +0 -1
- package/tree-view/index.cjs +2 -2
- package/tree-view/index.js +5 -5
- package/unbundled/aria-binding-directive.cjs +42 -0
- package/unbundled/aria-binding-directive.js +36 -0
- package/unbundled/calendar-picker.template.cjs +1 -1
- package/unbundled/calendar-picker.template.js +1 -1
- package/unbundled/char-count.cjs +2 -1
- package/unbundled/char-count.js +2 -1
- package/unbundled/decorate.cjs +1 -1
- package/unbundled/decorate.js +1 -1
- package/unbundled/definition.js +1 -1
- package/unbundled/definition10.cjs +5 -4
- package/unbundled/definition10.js +6 -5
- package/unbundled/definition11.cjs +14 -10
- package/unbundled/definition11.js +15 -11
- package/unbundled/definition12.cjs +2 -2
- package/unbundled/definition12.js +3 -3
- package/unbundled/definition13.cjs +7 -6
- package/unbundled/definition13.js +8 -7
- package/unbundled/definition14.cjs +67 -58
- package/unbundled/definition14.js +68 -59
- package/unbundled/definition15.js +1 -1
- package/unbundled/definition16.js +1 -1
- package/unbundled/definition17.cjs +10 -8
- package/unbundled/definition17.js +11 -9
- package/unbundled/definition18.js +1 -1
- package/unbundled/definition19.js +1 -1
- package/unbundled/definition2.cjs +4 -2
- package/unbundled/definition2.js +5 -3
- package/unbundled/definition20.js +1 -1
- package/unbundled/definition21.js +1 -1
- package/unbundled/definition22.js +1 -1
- package/unbundled/definition23.cjs +1 -1
- package/unbundled/definition23.js +2 -2
- package/unbundled/definition24.cjs +17 -13
- package/unbundled/definition24.js +18 -14
- package/unbundled/definition25.js +1 -1
- package/unbundled/definition26.cjs +17 -1
- package/unbundled/definition26.js +18 -2
- package/unbundled/definition27.cjs +15 -12
- package/unbundled/definition27.js +16 -13
- package/unbundled/definition28.cjs +9 -6
- package/unbundled/definition28.js +10 -7
- package/unbundled/definition29.js +1 -1
- package/unbundled/definition3.js +1 -1
- package/unbundled/definition30.cjs +4 -2
- package/unbundled/definition30.js +5 -3
- package/unbundled/definition31.js +1 -1
- package/unbundled/definition32.cjs +30 -23
- package/unbundled/definition32.js +31 -24
- package/unbundled/definition33.cjs +4 -2
- package/unbundled/definition33.js +5 -3
- package/unbundled/definition34.cjs +200 -48
- package/unbundled/definition34.js +201 -49
- package/unbundled/definition35.js +1 -1
- package/unbundled/definition36.js +1 -1
- package/unbundled/definition37.js +1 -1
- package/unbundled/definition38.cjs +2 -1
- package/unbundled/definition38.js +3 -2
- package/unbundled/definition39.js +1 -1
- package/unbundled/definition4.cjs +6 -0
- package/unbundled/definition4.js +7 -1
- package/unbundled/definition40.js +1 -1
- package/unbundled/definition41.cjs +17 -12
- package/unbundled/definition41.js +18 -13
- package/unbundled/definition42.js +1 -1
- package/unbundled/definition43.js +1 -1
- package/unbundled/definition44.cjs +4 -3
- package/unbundled/definition44.js +5 -4
- package/unbundled/definition45.js +1 -1
- package/unbundled/definition46.js +1 -1
- package/unbundled/definition47.cjs +5 -4
- package/unbundled/definition47.js +6 -5
- package/unbundled/definition48.cjs +1 -1
- package/unbundled/definition48.js +2 -2
- package/unbundled/definition49.js +1 -1
- package/unbundled/definition5.js +1 -1
- package/unbundled/definition50.js +1 -1
- package/unbundled/definition51.cjs +1 -1
- package/unbundled/definition51.js +2 -2
- package/unbundled/definition52.js +1 -1
- package/unbundled/definition53.cjs +16 -12
- package/unbundled/definition53.js +17 -13
- package/unbundled/definition54.js +1 -1
- package/unbundled/definition55.cjs +25 -23
- package/unbundled/definition55.js +26 -24
- package/unbundled/definition56.cjs +2 -1
- package/unbundled/definition56.js +3 -2
- package/unbundled/definition57.cjs +72 -61
- package/unbundled/definition57.js +73 -62
- package/unbundled/definition58.cjs +34 -26
- package/unbundled/definition58.js +34 -26
- package/unbundled/definition59.cjs +1 -1
- package/unbundled/definition59.js +2 -2
- package/unbundled/definition6.js +1 -1
- package/unbundled/definition60.js +1 -1
- package/unbundled/definition61.cjs +15 -10
- package/unbundled/definition61.js +16 -11
- package/unbundled/definition62.js +1 -1
- package/unbundled/definition63.js +1 -1
- package/unbundled/definition64.cjs +20 -17
- package/unbundled/definition64.js +21 -18
- package/unbundled/definition65.js +1 -1
- package/unbundled/definition66.js +1 -1
- package/unbundled/definition67.cjs +1 -1
- package/unbundled/definition67.js +2 -2
- package/unbundled/definition68.js +1 -1
- package/unbundled/definition69.js +1 -1
- package/unbundled/definition7.js +1 -1
- package/unbundled/definition70.cjs +28 -23
- package/unbundled/definition70.js +29 -24
- package/unbundled/definition71.js +1 -1
- package/unbundled/definition72.cjs +6 -5
- package/unbundled/definition72.js +7 -6
- package/unbundled/definition73.cjs +13 -1
- package/unbundled/definition73.js +14 -2
- package/unbundled/definition74.js +1 -1
- package/unbundled/definition75.js +1 -1
- package/unbundled/definition76.cjs +2 -1
- package/unbundled/definition76.js +3 -2
- package/unbundled/definition77.cjs +1 -1
- package/unbundled/definition77.js +1 -1
- package/unbundled/definition8.js +1 -1
- package/unbundled/definition9.cjs +9 -7
- package/unbundled/definition9.js +10 -8
- package/unbundled/delegates-aria.cjs +5 -60
- package/unbundled/delegates-aria.js +6 -60
- package/unbundled/divider.cjs +6 -0
- package/unbundled/divider.js +6 -0
- package/unbundled/form-element.cjs +7 -5
- package/unbundled/form-element.js +7 -5
- package/unbundled/host-semantics.cjs +10 -45
- package/unbundled/host-semantics.js +10 -44
- package/unbundled/mixins.js +1 -1
- package/unbundled/picker-field.template.cjs +20 -15
- package/unbundled/picker-field.template.js +20 -15
- package/unbundled/text-field.cjs +1 -1
- package/unbundled/text-field.js +1 -1
- package/unbundled/time-selection-picker.template.cjs +4 -3
- package/unbundled/time-selection-picker.template.js +5 -4
- package/unbundled/vivid-element.cjs +10 -1
- package/unbundled/vivid-element.js +5 -2
- package/video-player/index.cjs +24 -24
- package/video-player/index.js +3087 -3010
- package/visually-hidden/index.cjs +1 -1
- package/visually-hidden/index.js +0 -1
- package/vivid.api.json +1 -1
- package/bundled/attribute-binding-behaviour.cjs +0 -1
- package/bundled/attribute-binding-behaviour.js +0 -18
- package/bundled/strings.cjs +0 -1
- package/bundled/strings.js +0 -7
- package/shared/aria/delegate-aria-behavior.d.ts +0 -23
- package/shared/aria/host-semantics-behavior.d.ts +0 -19
- package/shared/templating/attribute-binding-behaviour.d.ts +0 -14
- package/unbundled/attribute-binding-behaviour.cjs +0 -37
- package/unbundled/attribute-binding-behaviour.js +0 -31
package/bundled/definition3.js
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import { t as e } from "./localized.js";
|
|
2
|
-
import {
|
|
2
|
+
import { D as t, O as n, c as r, d as i, s as a, t as o, u as s } from "./vivid-element.js";
|
|
3
3
|
import { t as c } from "./decorate.js";
|
|
4
|
-
import { t as l } from "./
|
|
5
|
-
import {
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
4
|
+
import { t as l } from "./aria.js";
|
|
5
|
+
import { i as u, n as d, r as f, t as p } from "./key-codes.js";
|
|
6
|
+
import { n as m } from "./numbers.js";
|
|
7
|
+
import { t as h } from "./delegates-aria.js";
|
|
8
8
|
import { n as g } from "./form-associated.js";
|
|
9
9
|
import { t as _ } from "./definition8.js";
|
|
10
10
|
import { a as v, i as y, o as b, r as x, t as S } from "./slider.template.js";
|
|
@@ -18,20 +18,20 @@ var C;
|
|
|
18
18
|
var w = ":host{display:inline-block}:host(:not([orientation=vertical])){inline-size:100%}:host([orientation=vertical]){block-size:100%;min-block-size:calc(var(--_thumb-interaction-indicator-size) * 5)}:host([disabled]){cursor:not-allowed}.control.connotation-cta{--_connotation-color-primary:var(--vvd-slider-cta-primary,var(--vvd-color-cta-500))}.control:not(.connotation-cta){--_connotation-color-primary:var(--vvd-slider-accent-primary,var(--vvd-color-canvas-text))}.control{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary);--_appearance-color-outline:transparent;--_thumb-size:12px;--_thumb-interaction-indicator-size:36px;--_track-start-inset-inline-start:0;--_track-start-inset-block-start:0;cursor:pointer;user-select:none;outline:none}.control .positioning-region{position:relative}.control .track{background:var(--_track-background-color);border-radius:4px;position:absolute}.control .track-start{border-radius:inherit;background:var(--_track-start-background-color);block-size:100%;position:absolute;inset-inline-start:var(--_track-start-inset-inline-start)}.control.horizontal{block-size:var(--_thumb-interaction-indicator-size);inline-size:calc(100% - var(--_thumb-size));min-inline-size:var(--_thumb-size);margin-inline-start:calc(var(--_thumb-size) / 2)}.control.horizontal .track{top:calc((var(--_thumb-interaction-indicator-size) - 2px) / 2);block-size:2px;left:0;right:0}:host([markers]) .control.horizontal .track-start{--_track-start-inset-inline-start:1px;border-top-left-radius:0;border-bottom-left-radius:0}.control.horizontal .track .mark{block-size:6px;inline-size:100%;position:absolute;inset-block-start:-2px;inset-inline-start:0}.control.vertical{margin-top:calc(var(--_thumb-interaction-indicator-size) / 2);block-size:calc(100% - var(--_thumb-interaction-indicator-size));inline-size:var(--_thumb-interaction-indicator-size);min-block-size:var(--_thumb-interaction-indicator-size)}.control.vertical .positioning-region{block-size:100%}.control.vertical .track{left:calc((var(--_thumb-interaction-indicator-size) - 2px) / 2);block-size:100%;inline-size:2px}.control.vertical .track .mark{block-size:100%;inline-size:6px;position:absolute;inset-block-start:0;inset-inline-start:-2px}.control.vertical .track-start{block-size:auto;inline-size:100%;inset-block-start:var(--_track-start-inset-block-start)}:host([markers]) .control.vertical .track-start{--_track-start-inset-block-start:1px;border-radius:0}.control.disabled{--_track-background-color:var(--vvd-color-neutral-100);--_track-start-background-color:var(--vvd-color-neutral-300);pointer-events:none}.control:not(.disabled){--_track-background-color:var(--vvd-color-neutral-300);--_track-start-background-color:var(--_appearance-color-fill)}.control:not(.disabled) .mark{color:var(--vvd-color-neutral-950)}.control.disabled .mark{color:var(--_track-start-background-color)}.thumb-container{block-size:var(--_thumb-interaction-indicator-size);cursor:inherit;inline-size:var(--_thumb-interaction-indicator-size);touch-action:none;border-radius:50%;outline:none;position:absolute}.thumb-container.focus-visible{box-shadow:0 0 0 4px color-mix(in srgb, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px));--focus-stroke-gap-color:transparent;--_thumb-interaction-indicator-alpha:.05;border-radius:50%}.control.horizontal .thumb-container{transform:translateX(calc(var(--_thumb-interaction-indicator-size) / 2))}.control.vertical .thumb-container{transform:translateY(calc(var(--_thumb-interaction-indicator-size) / 2))}@media (hover:hover){.control:not(.disabled) .thumb-container:hover{--_thumb-interaction-indicator-alpha:.12}}.control:not(.disabled) .thumb-container:active{--_thumb-interaction-indicator-alpha:.25}.thumb-container:before{border-radius:inherit;background-color:var(--_track-start-background-color);block-size:var(--_thumb-interaction-indicator-size);content:\"\";inline-size:var(--_thumb-interaction-indicator-size);opacity:var(--_thumb-interaction-indicator-alpha,0);transition:opacity .2s ease-out;display:block;position:absolute}.thumb-container:after{border-radius:inherit;background-color:var(--_track-start-background-color);block-size:var(--_thumb-size);content:\"\";inline-size:var(--_thumb-size);inset:calc((var(--_thumb-interaction-indicator-size) - var(--_thumb-size)) / 2);display:block;position:absolute}.popup{pointer-events:none}.tooltip{width:auto;color:var(--vvd-color-canvas-text);font:var(--vvd-typography-base-bold);padding:8px 12px}:host([internal-part]) .thumb-container{opacity:0;transition:opacity .2s}:host([internal-part]) .control.horizontal .track{block-size:4px;top:16px;overflow:hidden}:host([internal-part]) .control:focus .thumb-container{opacity:1}@media (hover:hover){:host([internal-part]) .control:hover .thumb-container{opacity:1}}", T = (e) => {
|
|
19
19
|
let t = e.closest("[dir]");
|
|
20
20
|
return t !== null && t.dir === "rtl" ? C.rtl : C.ltr;
|
|
21
|
-
}, E = { singleValue: "single-value" }, D = class extends e(
|
|
21
|
+
}, E = { singleValue: "single-value" }, D = class extends e(h(g(o))) {
|
|
22
22
|
constructor(...e) {
|
|
23
|
-
super(...e), this.proxy = document.createElement("input"), this.direction = C.ltr, this.isDragging = !1, this.trackWidth = 0, this.trackMinWidth = 0, this.trackHeight = 0, this.trackLeft = 0, this.trackMinHeight = 0, this.valueTextFormatter = (e) => parseFloat(e).toLocaleString(this.locale.lang), this.min = 0, this.max = 10, this.step = 1, this.orientation =
|
|
23
|
+
super(...e), this.proxy = document.createElement("input"), this.direction = C.ltr, this.isDragging = !1, this.trackWidth = 0, this.trackMinWidth = 0, this.trackHeight = 0, this.trackLeft = 0, this.trackMinHeight = 0, this.valueTextFormatter = (e) => parseFloat(e).toLocaleString(this.locale.lang), this.min = 0, this.max = 10, this.step = 1, this.orientation = l.horizontal, this.mode = E.singleValue, this.keypressHandler = (e) => {
|
|
24
24
|
if (this._focusVisible = !0, !this.readOnly) if (e.key === "Home") e.preventDefault(), this.value = `${this.min}`;
|
|
25
25
|
else if (e.key === "End") e.preventDefault(), this.value = `${this.max}`;
|
|
26
26
|
else {
|
|
27
27
|
if (e.shiftKey) return;
|
|
28
28
|
switch (e.key) {
|
|
29
|
-
case
|
|
30
|
-
case
|
|
29
|
+
case f:
|
|
30
|
+
case u:
|
|
31
31
|
e.preventDefault(), this.increment();
|
|
32
32
|
break;
|
|
33
|
-
case
|
|
34
|
-
case
|
|
33
|
+
case d:
|
|
34
|
+
case p:
|
|
35
35
|
e.preventDefault(), this.decrement();
|
|
36
36
|
break;
|
|
37
37
|
}
|
|
@@ -64,10 +64,16 @@ var w = ":host{display:inline-block}:host(:not([orientation=vertical])){inline-s
|
|
|
64
64
|
let t = this.#t(e);
|
|
65
65
|
this.value = `${this.#n(t)}`, this.isDragging = !0;
|
|
66
66
|
}
|
|
67
|
-
}, this.markers = !1, this.pin = !1, this._focusVisible = !1, this._hoveringOnThumb = !1, this._onFocusIn = () => {
|
|
67
|
+
}, this.markers = !1, this.pin = !1, this._focusVisible = !1, this._hoveringOnThumb = !1, this.#r = !1, this._onFocusIn = () => {
|
|
68
68
|
this.#r || (this._focusVisible = !0), this.#r = !1;
|
|
69
69
|
}, this._onFocusOut = () => {
|
|
70
70
|
this._focusVisible = !1;
|
|
71
|
+
}, this.#o = () => {
|
|
72
|
+
document.hidden && this.shadowRoot.activeElement !== null && (this.#r = !0);
|
|
73
|
+
}, this.#s = () => {
|
|
74
|
+
this._hoveringOnThumb = !0;
|
|
75
|
+
}, this.#c = () => {
|
|
76
|
+
this._hoveringOnThumb = !1;
|
|
71
77
|
};
|
|
72
78
|
}
|
|
73
79
|
readOnlyChanged() {
|
|
@@ -109,23 +115,23 @@ var w = ":host{display:inline-block}:host(:not([orientation=vertical])){inline-s
|
|
|
109
115
|
this.setupListeners(!0), this.#a(), document.removeEventListener("visibilitychange", this.#o);
|
|
110
116
|
}
|
|
111
117
|
increment() {
|
|
112
|
-
let e = this.direction !== C.rtl && this.orientation !==
|
|
118
|
+
let e = this.direction !== C.rtl && this.orientation !== l.vertical ? Number(this.value) + Number(this.step) : Number(this.value) - Number(this.step);
|
|
113
119
|
this.value = this.#n(e).toString();
|
|
114
120
|
}
|
|
115
121
|
decrement() {
|
|
116
|
-
let e = this.direction !== C.rtl && this.orientation !==
|
|
122
|
+
let e = this.direction !== C.rtl && this.orientation !== l.vertical ? Number(this.value) - Number(this.step) : Number(this.value) + Number(this.step);
|
|
117
123
|
this.value = this.#n(e).toString();
|
|
118
124
|
}
|
|
119
125
|
setThumbPositionForOrientation(e) {
|
|
120
126
|
let t = this.#e(this.valueAsNumber);
|
|
121
|
-
this.orientation ===
|
|
127
|
+
this.orientation === l.horizontal ? this.position = this.isDragging ? `right: ${t}%; transition: none;` : `right: ${t}%; transition: right 0.2s ease;` : this.position = this.isDragging ? `bottom: ${t}%; transition: none;` : `bottom: ${t}%; transition: bottom 0.2s ease;`;
|
|
122
128
|
}
|
|
123
129
|
#e(e) {
|
|
124
130
|
return (1 - x(this.min, this.max, e)) * 100;
|
|
125
131
|
}
|
|
126
132
|
updateStepMultiplier() {
|
|
127
|
-
let e = this.step + "";
|
|
128
|
-
this.stepMultiplier = 10 **
|
|
133
|
+
let e = this.step + "", t = this.step % 1 ? e.length - e.indexOf(".") - 1 : 0;
|
|
134
|
+
this.stepMultiplier = 10 ** t;
|
|
129
135
|
}
|
|
130
136
|
get midpoint() {
|
|
131
137
|
return `${this.#n((this.max + this.min) / 2)}`;
|
|
@@ -139,7 +145,7 @@ var w = ":host{display:inline-block}:host(:not([orientation=vertical])){inline-s
|
|
|
139
145
|
}
|
|
140
146
|
}
|
|
141
147
|
#t(e) {
|
|
142
|
-
let t = this.track.getBoundingClientRect(), [n, r, i] = this.orientation ===
|
|
148
|
+
let t = this.track.getBoundingClientRect(), [n, r, i] = this.orientation === l.horizontal ? [
|
|
143
149
|
this.track.clientLeft,
|
|
144
150
|
this.track.clientWidth,
|
|
145
151
|
e.pageX - document.documentElement.scrollLeft - this.getBoundingClientRect().left
|
|
@@ -151,37 +157,31 @@ var w = ":host{display:inline-block}:host(:not([orientation=vertical])){inline-s
|
|
|
151
157
|
return y(this.min, this.max, x(n, r, i));
|
|
152
158
|
}
|
|
153
159
|
#n(e) {
|
|
154
|
-
return
|
|
160
|
+
return m(this.min, this.max, b(e - this.min, this.step) + this.min);
|
|
155
161
|
}
|
|
156
162
|
get _isThumbPopupOpen() {
|
|
157
163
|
return this._focusVisible || this._hoveringOnThumb || this.isDragging;
|
|
158
164
|
}
|
|
159
|
-
#r
|
|
165
|
+
#r;
|
|
160
166
|
#i() {
|
|
161
167
|
this.thumb.addEventListener("mouseover", this.#s, { passive: !0 }), this.thumb.addEventListener("mouseout", this.#c, { passive: !0 });
|
|
162
168
|
}
|
|
163
169
|
#a() {
|
|
164
170
|
this.thumb.removeEventListener("mouseover", this.#s), this.thumb.removeEventListener("mouseout", this.#c);
|
|
165
171
|
}
|
|
166
|
-
#o
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
#s = () => {
|
|
170
|
-
this._hoveringOnThumb = !0;
|
|
171
|
-
};
|
|
172
|
-
#c = () => {
|
|
173
|
-
this._hoveringOnThumb = !1;
|
|
174
|
-
};
|
|
172
|
+
#o;
|
|
173
|
+
#s;
|
|
174
|
+
#c;
|
|
175
175
|
};
|
|
176
|
-
c([
|
|
176
|
+
c([s({
|
|
177
177
|
attribute: "readonly",
|
|
178
178
|
mode: "boolean"
|
|
179
|
-
})], D.prototype, "readOnly", void 0), c([
|
|
179
|
+
})], D.prototype, "readOnly", void 0), c([t], D.prototype, "direction", void 0), c([t], D.prototype, "isDragging", void 0), c([t], D.prototype, "position", void 0), c([t], D.prototype, "trackWidth", void 0), c([t], D.prototype, "trackMinWidth", void 0), c([t], D.prototype, "trackHeight", void 0), c([t], D.prototype, "trackLeft", void 0), c([t], D.prototype, "trackMinHeight", void 0), c([t], D.prototype, "valueTextFormatter", void 0), c([s({ converter: i })], D.prototype, "min", void 0), c([s({ converter: i })], D.prototype, "max", void 0), c([s({ converter: v })], D.prototype, "step", void 0), c([s], D.prototype, "orientation", void 0), c([s], D.prototype, "mode", void 0), c([s({ mode: "boolean" })], D.prototype, "markers", void 0), c([s({ mode: "boolean" })], D.prototype, "pin", void 0), c([s], D.prototype, "connotation", void 0), c([t], D.prototype, "_focusVisible", void 0), c([t], D.prototype, "_hoveringOnThumb", void 0), c([n], D.prototype, "_isThumbPopupOpen", null);
|
|
180
180
|
//#endregion
|
|
181
181
|
//#region src/lib/slider/definition.ts
|
|
182
|
-
var O =
|
|
182
|
+
var O = a("slider", D, S, [_], {
|
|
183
183
|
styles: w,
|
|
184
184
|
shadowOptions: { delegatesFocus: !0 }
|
|
185
|
-
}), k =
|
|
185
|
+
}), k = r(O);
|
|
186
186
|
//#endregion
|
|
187
187
|
export { O as n, D as r, k as t };
|
package/bundled/definition4.cjs
CHANGED
|
@@ -1,11 +1,11 @@
|
|
|
1
|
-
const e=require(`./vivid-element.cjs`),t=require(`./ref.cjs`),n=require(`./when.cjs`),r=require(`./slotted.cjs`),i=require(`./children.cjs`),a=require(`./decorate.cjs`),o=require(`./definition2.cjs`),s=require(`./affix.cjs`),c=require(`./class-names.cjs`),l=require(`./dom.cjs`),u=require(`./host-semantics.cjs`);var d=`:host(:focus-visible){outline:none}:host([disabled]){cursor:not-allowed}.control{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.control:disabled,.control.disabled{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}@media (hover:hover){.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-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)),.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.selected:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary);--_appearance-color-outline:transparent}@media (hover:hover){.control.selected:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary-increment);--_appearance-color-outline:transparent}}.control.selected.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary-increment);--_appearance-color-outline:transparent}.control{--_connotation-color-primary:var(--vvd-tree-item-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-tree-item-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-tree-item-accent-primary-increment,var(--vvd-color-neutral-800));--_connotation-color-faint:var(--vvd-tree-item-accent-faint,var(--vvd-color-neutral-50));--_connotation-color-soft:var(--vvd-tree-item-accent-soft,var(--vvd-color-neutral-100));--_connotation-color-firm:var(--vvd-tree-item-accent-firm,var(--vvd-color-canvas-text));box-sizing:border-box;background-color:var(--_appearance-color-fill);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);color:var(--_appearance-color-text);font:var(--vvd-typography-base);hyphens:auto;inline-size:100%;min-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)));vertical-align:middle;word-break:break-word;border-radius:8px;align-items:center;gap:12px;padding-inline:16px;text-decoration:none;display:inline-flex;position:relative}@supports (user-select:none){.control{user-select:none}}.control:not(.disabled){cursor:pointer}.control.disabled{pointer-events:none}:host(:focus-visible) .control{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))}:host(:focus-visible) .control:not(.selected){--focus-stroke-gap-color:transparent}.control .text{font:var(--vvd-typography-base)}.expandCollapseButton{border-radius:8px;align-items:center;font-size:20px;display:flex}.expandCollapseButton .expandCollapseIcon{margin:4px}@media (hover:hover){.expandCollapseButton:hover{background-color:var(--vvd-color-neutral-100)}.selected .expandCollapseButton:hover{background-color:var(--vvd-color-neutral-700)}}.items{flex-direction:column;gap:4px;margin-block-start:4px;padding-inline-start:48px;display:flex}slot[name=icon]{font-size:20px;line-height:1}.control:not(.disabled,.selected) slot[name=icon]{color:var(--vvd-color-neutral-600)}`;function f(e){return l.t(e)&&(e.getAttribute(`role`)===`treeitem`||e instanceof p)}var p=class extends u.t(s.t(e.t)){constructor(...e){super(...e),this.expanded=!1,this.selected=!1,this.disabled=!1,this.focusable=!1,this.isNestedItem=()=>f(this.parentElement),this.handleExpandCollapseButtonClick=e=>{!this.disabled&&!e.defaultPrevented&&(this.expanded=!this.expanded)},this.handleFocus=e=>{this.setAttribute(`tabindex`,`0`)},this.handleBlur=e=>{this.setAttribute(`tabindex`,`-1`)}}expandedChanged(){this.$fastController.isConnected&&this.$emit(`expanded-change`,this)}selectedChanged(){this.$fastController.isConnected&&this.$emit(`selected-change`,this)}itemsChanged(){this.$fastController.isConnected&&this.items.forEach(e=>{f(e)&&(e.nested=!0)})}static focusItem(e){e.focusable=!0,e.focus()}childItemLength(){return this.childItems.filter(e=>f(e)).length}};a.t([e.
|
|
1
|
+
const e=require(`./vivid-element.cjs`),t=require(`./ref.cjs`),n=require(`./when.cjs`),r=require(`./slotted.cjs`),i=require(`./children.cjs`),a=require(`./decorate.cjs`),o=require(`./definition2.cjs`),s=require(`./affix.cjs`),c=require(`./class-names.cjs`),l=require(`./dom.cjs`),u=require(`./host-semantics.cjs`);var d=`:host(:focus-visible){outline:none}:host([disabled]){cursor:not-allowed}.control{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.control:disabled,.control.disabled{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}@media (hover:hover){.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-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)),.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.selected:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary);--_appearance-color-outline:transparent}@media (hover:hover){.control.selected:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary-increment);--_appearance-color-outline:transparent}}.control.selected.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary-increment);--_appearance-color-outline:transparent}.control{--_connotation-color-primary:var(--vvd-tree-item-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-tree-item-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-tree-item-accent-primary-increment,var(--vvd-color-neutral-800));--_connotation-color-faint:var(--vvd-tree-item-accent-faint,var(--vvd-color-neutral-50));--_connotation-color-soft:var(--vvd-tree-item-accent-soft,var(--vvd-color-neutral-100));--_connotation-color-firm:var(--vvd-tree-item-accent-firm,var(--vvd-color-canvas-text));box-sizing:border-box;background-color:var(--_appearance-color-fill);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);color:var(--_appearance-color-text);font:var(--vvd-typography-base);hyphens:auto;inline-size:100%;min-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)));vertical-align:middle;word-break:break-word;border-radius:8px;align-items:center;gap:12px;padding-inline:16px;text-decoration:none;display:inline-flex;position:relative}@supports (user-select:none){.control{user-select:none}}.control:not(.disabled){cursor:pointer}.control.disabled{pointer-events:none}:host(:focus-visible) .control{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))}:host(:focus-visible) .control:not(.selected){--focus-stroke-gap-color:transparent}.control .text{font:var(--vvd-typography-base)}.expandCollapseButton{border-radius:8px;align-items:center;font-size:20px;display:flex}.expandCollapseButton .expandCollapseIcon{margin:4px}@media (hover:hover){.expandCollapseButton:hover{background-color:var(--vvd-color-neutral-100)}.selected .expandCollapseButton:hover{background-color:var(--vvd-color-neutral-700)}}.items{flex-direction:column;gap:4px;margin-block-start:4px;padding-inline-start:48px;display:flex}slot[name=icon]{font-size:20px;line-height:1}.control:not(.disabled,.selected) slot[name=icon]{color:var(--vvd-color-neutral-600)}`;function f(e){return l.t(e)&&(e.getAttribute(`role`)===`treeitem`||e instanceof p)}var p=class extends u.t(s.t(e.t)){constructor(...e){super(...e),this.expanded=!1,this.selected=!1,this.disabled=!1,this.focusable=!1,this.isNestedItem=()=>f(this.parentElement),this.handleExpandCollapseButtonClick=e=>{!this.disabled&&!e.defaultPrevented&&(this.expanded=!this.expanded)},this.handleFocus=e=>{this.setAttribute(`tabindex`,`0`)},this.handleBlur=e=>{this.setAttribute(`tabindex`,`-1`)}}expandedChanged(){this.$fastController.isConnected&&this.$emit(`expanded-change`,this)}selectedChanged(){this.$fastController.isConnected&&this.$emit(`selected-change`,this)}itemsChanged(){this.$fastController.isConnected&&this.items.forEach(e=>{f(e)&&(e.nested=!0)})}static focusItem(e){e.focusable=!0,e.focus()}childItemLength(){return this.childItems.filter(e=>f(e)).length}};a.t([e.u],p.prototype,`text`,void 0),a.t([e.u({mode:`boolean`})],p.prototype,`expanded`,void 0),a.t([e.u({mode:`boolean`})],p.prototype,`selected`,void 0),a.t([e.u({mode:`boolean`})],p.prototype,`disabled`,void 0),a.t([e.D],p.prototype,`focusable`,void 0),a.t([e.D],p.prototype,`childItems`,void 0),a.t([e.D],p.prototype,`items`,void 0),a.t([e.D],p.prototype,`nested`,void 0),a.t([e.D],p.prototype,`renderCollapsedChildren`,void 0);var m=({disabled:e,selected:t})=>c.t(`control`,[`disabled`,e],[`selected`,!!t]),h=n=>{let r=n.tagFor(o.r);return e.f`
|
|
2
2
|
<div aria-hidden="true"
|
|
3
3
|
class="expandCollapseButton"
|
|
4
4
|
@click="${(e,t)=>e.handleExpandCollapseButtonClick(t.event)}"
|
|
5
5
|
${t.t(`expandCollapseButton`)}
|
|
6
6
|
>
|
|
7
7
|
<${r} class="expandCollapseIcon" name="${e=>e.expanded?`chevron-down-line`:`chevron-right-line`}"></${r}>
|
|
8
|
-
</div>`},g=e.
|
|
8
|
+
</div>`},g=e.s(`tree-item`,p,t=>{let a=s.a(t),o=t.tagFor(p,!0);return e.f` <template
|
|
9
9
|
slot="${e=>e.isNestedItem()?`item`:void 0}"
|
|
10
10
|
tabindex="-1"
|
|
11
11
|
${u.n({role:`treeitem`,ariaExpanded:e=>e.childItems&&e.childItems.length>0?e.expanded:void 0,ariaSelected:e=>e.selected,ariaDisabled:e=>e.disabled})}
|
|
@@ -18,7 +18,7 @@ const e=require(`./vivid-element.cjs`),t=require(`./ref.cjs`),n=require(`./when.
|
|
|
18
18
|
${e=>a(e.icon,s.i.Slot)}
|
|
19
19
|
${e=>e.text}
|
|
20
20
|
</div>
|
|
21
|
-
${n.t(e=>e.childItems&&e.childItems.length>0&&e.expanded,e.
|
|
21
|
+
${n.t(e=>e.childItems&&e.childItems.length>0&&e.expanded,e.f` <div role="group" class="items">
|
|
22
22
|
<slot name="item" ${r.t(`items`)}></slot>
|
|
23
23
|
</div>`)}
|
|
24
|
-
</template>`},[o.t],{styles:d}),_=e.
|
|
24
|
+
</template>`},[o.t],{styles:d}),_=e.c(g);Object.defineProperty(exports,`i`,{enumerable:!0,get:function(){return f}}),Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return g}}),Object.defineProperty(exports,`r`,{enumerable:!0,get:function(){return p}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return _}});
|
package/bundled/definition4.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { D as e, c as t, f as n, s as r, t as i, u as a } from "./vivid-element.js";
|
|
2
2
|
import { t as o } from "./ref.js";
|
|
3
3
|
import { t as s } from "./when.js";
|
|
4
4
|
import { r as c, t as l } from "./slotted.js";
|
|
@@ -16,7 +16,7 @@ var x = ":host(:focus-visible){outline:none}:host([disabled]){cursor:not-allowed
|
|
|
16
16
|
function S(e) {
|
|
17
17
|
return v(e) && (e.getAttribute("role") === "treeitem" || e instanceof C);
|
|
18
18
|
}
|
|
19
|
-
var C = class extends b(g(
|
|
19
|
+
var C = class extends b(g(i)) {
|
|
20
20
|
constructor(...e) {
|
|
21
21
|
super(...e), this.expanded = !1, this.selected = !1, this.disabled = !1, this.focusable = !1, this.isNestedItem = () => S(this.parentElement), this.handleExpandCollapseButtonClick = (e) => {
|
|
22
22
|
!this.disabled && !e.defaultPrevented && (this.expanded = !this.expanded);
|
|
@@ -45,22 +45,22 @@ var C = class extends b(g(a)) {
|
|
|
45
45
|
return this.childItems.filter((e) => S(e)).length;
|
|
46
46
|
}
|
|
47
47
|
};
|
|
48
|
-
d([
|
|
48
|
+
d([a], C.prototype, "text", void 0), d([a({ mode: "boolean" })], C.prototype, "expanded", void 0), d([a({ mode: "boolean" })], C.prototype, "selected", void 0), d([a({ mode: "boolean" })], C.prototype, "disabled", void 0), d([e], C.prototype, "focusable", void 0), d([e], C.prototype, "childItems", void 0), d([e], C.prototype, "items", void 0), d([e], C.prototype, "nested", void 0), d([e], C.prototype, "renderCollapsedChildren", void 0);
|
|
49
49
|
//#endregion
|
|
50
50
|
//#region src/lib/tree-item/tree-item.template.ts
|
|
51
51
|
var w = ({ disabled: e, selected: t }) => _("control", ["disabled", e], ["selected", !!t]), T = (e) => {
|
|
52
|
-
let
|
|
53
|
-
return
|
|
52
|
+
let t = e.tagFor(f);
|
|
53
|
+
return n`
|
|
54
54
|
<div aria-hidden="true"
|
|
55
55
|
class="expandCollapseButton"
|
|
56
56
|
@click="${(e, t) => e.handleExpandCollapseButtonClick(t.event)}"
|
|
57
57
|
${o("expandCollapseButton")}
|
|
58
58
|
>
|
|
59
|
-
<${
|
|
59
|
+
<${t} class="expandCollapseIcon" name="${(e) => e.expanded ? "chevron-down-line" : "chevron-right-line"}"></${t}>
|
|
60
60
|
</div>`;
|
|
61
61
|
}, E = r("tree-item", C, (e) => {
|
|
62
|
-
let
|
|
63
|
-
return
|
|
62
|
+
let t = m(e), r = e.tagFor(C, !0);
|
|
63
|
+
return n` <template
|
|
64
64
|
slot="${(e) => e.isNestedItem() ? "item" : void 0}"
|
|
65
65
|
tabindex="-1"
|
|
66
66
|
${y({
|
|
@@ -78,13 +78,13 @@ var w = ({ disabled: e, selected: t }) => _("control", ["disabled", e], ["select
|
|
|
78
78
|
>
|
|
79
79
|
<div class="${w}">
|
|
80
80
|
${s((e) => e.childItems && e.childItems.length > 0, T(e))}
|
|
81
|
-
${(e) =>
|
|
81
|
+
${(e) => t(e.icon, h.Slot)}
|
|
82
82
|
${(e) => e.text}
|
|
83
83
|
</div>
|
|
84
|
-
${s((e) => e.childItems && e.childItems.length > 0 && e.expanded,
|
|
84
|
+
${s((e) => e.childItems && e.childItems.length > 0 && e.expanded, n` <div role="group" class="items">
|
|
85
85
|
<slot name="item" ${l("items")}></slot>
|
|
86
86
|
</div>`)}
|
|
87
87
|
</template>`;
|
|
88
|
-
}, [p], { styles: x }), D =
|
|
88
|
+
}, [p], { styles: x }), D = t(E);
|
|
89
89
|
//#endregion
|
|
90
90
|
export { S as i, E as n, C as r, D as t };
|
package/bundled/definition5.cjs
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
const e=require(`./vivid-element.cjs`),t=require(`./when.cjs`),n=require(`./decorate.cjs`),r=require(`./
|
|
1
|
+
const e=require(`./vivid-element.cjs`),t=require(`./when.cjs`),n=require(`./decorate.cjs`),r=require(`./class-names.cjs`),i=require(`./delegates-aria.cjs`),a=require(`./base-progress.cjs`);var o=`: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)}}`,s=class extends i.t(a.t){};n.t([e.u],s.prototype,`connotation`,void 0),n.t([e.u],s.prototype,`size`,void 0);var c=({connotation:e,size:t,paused:n})=>r.t(`base`,[`disabled`,!!n],[`connotation-${e}`,!!e],[`size-${t}`,!!t]),l=44,u=e.f`<template>
|
|
2
2
|
<div
|
|
3
3
|
class="${e=>e.paused?`paused`:``} ${c}"
|
|
4
|
-
${
|
|
4
|
+
${i.n({role:`progressbar`,ariaValueNow:e=>e.value,ariaValueMin:e=>e.min,ariaValueMax:e=>e.max})}
|
|
5
5
|
>
|
|
6
|
-
${t.t(e=>typeof e.value==`number`,e.
|
|
6
|
+
${t.t(e=>typeof e.value==`number`,e.f`
|
|
7
7
|
<svg class="progress" viewBox="0 0 16 16">
|
|
8
8
|
<circle class="background" cx="8px" cy="8px" r="7px"></circle>
|
|
9
9
|
<circle
|
|
@@ -15,7 +15,7 @@ const e=require(`./vivid-element.cjs`),t=require(`./when.cjs`),n=require(`./deco
|
|
|
15
15
|
></circle>
|
|
16
16
|
</svg>
|
|
17
17
|
`)}
|
|
18
|
-
${t.t(e=>typeof e.value!=`number`,e.
|
|
18
|
+
${t.t(e=>typeof e.value!=`number`,e.f`
|
|
19
19
|
<svg class="progress" viewBox="0 0 16 16">
|
|
20
20
|
<circle class="background" cx="8px" cy="8px" r="7px"></circle>
|
|
21
21
|
<circle
|
|
@@ -27,4 +27,4 @@ const e=require(`./vivid-element.cjs`),t=require(`./when.cjs`),n=require(`./deco
|
|
|
27
27
|
</svg>
|
|
28
28
|
`)}
|
|
29
29
|
</div>
|
|
30
|
-
</template>`,d=e.
|
|
30
|
+
</template>`,d=e.s(`progress-ring`,s,u,[],{styles:o}),f=e.c(d);Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return f}}),Object.defineProperty(exports,`r`,{enumerable:!0,get:function(){return s}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return d}});
|
package/bundled/definition5.js
CHANGED
|
@@ -1,25 +1,25 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { c as e, f as t, s as n, u as r } from "./vivid-element.js";
|
|
2
2
|
import { t as i } from "./when.js";
|
|
3
3
|
import { t as a } from "./decorate.js";
|
|
4
|
-
import {
|
|
5
|
-
import { t as c } from "./
|
|
4
|
+
import { t as o } from "./class-names.js";
|
|
5
|
+
import { n as s, t as c } from "./delegates-aria.js";
|
|
6
6
|
import { t as l } from "./base-progress.js";
|
|
7
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
|
|
9
|
-
a([
|
|
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 c(l) {};
|
|
9
|
+
a([r], d.prototype, "connotation", void 0), a([r], d.prototype, "size", void 0);
|
|
10
10
|
//#endregion
|
|
11
11
|
//#region src/lib/progress-ring/progress-ring.template.ts
|
|
12
|
-
var f = ({ connotation: e, size: t, paused: n }) =>
|
|
12
|
+
var f = ({ connotation: e, size: t, paused: n }) => o("base", ["disabled", !!n], [`connotation-${e}`, !!e], [`size-${t}`, !!t]), p = 44, m = n("progress-ring", d, t`<template>
|
|
13
13
|
<div
|
|
14
14
|
class="${(e) => e.paused ? "paused" : ""} ${f}"
|
|
15
|
-
${
|
|
15
|
+
${s({
|
|
16
16
|
role: "progressbar",
|
|
17
17
|
ariaValueNow: (e) => e.value,
|
|
18
18
|
ariaValueMin: (e) => e.min,
|
|
19
19
|
ariaValueMax: (e) => e.max
|
|
20
20
|
})}
|
|
21
21
|
>
|
|
22
|
-
${i((e) => typeof e.value == "number",
|
|
22
|
+
${i((e) => typeof e.value == "number", t`
|
|
23
23
|
<svg class="progress" viewBox="0 0 16 16">
|
|
24
24
|
<circle class="background" cx="8px" cy="8px" r="7px"></circle>
|
|
25
25
|
<circle
|
|
@@ -31,7 +31,7 @@ var f = ({ connotation: e, size: t, paused: n }) => c("base", ["disabled", !!n],
|
|
|
31
31
|
></circle>
|
|
32
32
|
</svg>
|
|
33
33
|
`)}
|
|
34
|
-
${i((e) => typeof e.value != "number",
|
|
34
|
+
${i((e) => typeof e.value != "number", t`
|
|
35
35
|
<svg class="progress" viewBox="0 0 16 16">
|
|
36
36
|
<circle class="background" cx="8px" cy="8px" r="7px"></circle>
|
|
37
37
|
<circle
|
|
@@ -43,6 +43,6 @@ var f = ({ connotation: e, size: t, paused: n }) => c("base", ["disabled", !!n],
|
|
|
43
43
|
</svg>
|
|
44
44
|
`)}
|
|
45
45
|
</div>
|
|
46
|
-
</template>`, [], { styles: u }), h =
|
|
46
|
+
</template>`, [], { styles: u }), h = e(m);
|
|
47
47
|
//#endregion
|
|
48
48
|
export { h as n, d as r, m as t };
|
package/bundled/definition6.cjs
CHANGED
|
@@ -1,11 +1,11 @@
|
|
|
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(`./definition2.cjs`),s=require(`./affix.cjs`),c=require(`./delegates-aria.cjs`),l=require(`./linkable.cjs`),u=require(`./class-names.cjs`),d=require(`./definition5.cjs`),f=require(`./button.cjs`);var p=class extends s.n(e.t(l.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}}};a.t([t.l({converter:{fromView:e=>e||null,toView:e=>e||null}})],p.prototype,`title`,void 0),a.t([t.l],p.prototype,`connotation`,void 0),a.t([t.l],p.prototype,`shape`,void 0),a.t([t.l],p.prototype,`appearance`,void 0),a.t([t.l],p.prototype,`size`,void 0),a.t([t.l({mode:`boolean`,attribute:`stacked`})],p.prototype,`stacked`,void 0),a.t([t.l({mode:`boolean`,attribute:`pending`})],p.prototype,`pending`,void 0),a.t([t.l({mode:`boolean`,attribute:`dropdown-indicator`})],p.prototype,`dropdownIndicator`,void 0),a.t([t.l({mode:`boolean`,attribute:`active`})],p.prototype,`active`,void 0),a.t([t.l({mode:`boolean`,attribute:`pressed`})],p.prototype,`pressed`,void 0),a.t([t.l],p.prototype,`label`,void 0);var m=`.chevron{font:var(--vvd-typography-base-extended);flex-shrink:0;transition:transform .2s;display:flex;transform:rotate(0)}: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}@supports (user-select:none){.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}`,h=e=>{let n=e.tagFor(o.r);return t.d`<${n} class="chevron" aria-hidden="true" name="chevron-down-line"></${n}>`};function g(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 _=({connotation:e,appearance:t,shape:n,iconTrailing:r,icon:i,label:a,disabled:o,pending:s,stacked:c,size:l,iconSlottedContent:d,ariaExpanded:f,active:p,dropdownIndicator:m,pressed:h})=>u.t(`control`,[`connotation-${e}`,!!e],`appearance-${g(t,h)}`,[`disabled`,o||s],[`shape-${n}`,!!n],[`size-${l}`,!!l],[`icon-only`,!a&&!!(i||d?.length)&&!m],[`icon-trailing`,r],[`stacked`,!!c],[`active`,f===`true`||p]);function v(e,n,r,a=i.a.Normal){if(r&&a!=i.a.SuperCondensed){let r=e.tagFor(d.r),o={[i.a.Condensed]:`-6`,[i.a.Normal]:`-5`,[i.a.Expanded]:`-4`};return t.d`<span class="${e=>{let t=e.querySelector(`[slot="icon"]`);return u.t(`icon`,`pending`,[`pending-no-icon`,!(n||t)])}}" aria-hidden="true"><${r} size="${o[a]}"></${r}></span>`}else return s.a(e)(n,s.i.Slot)}var y=e=>[`submit`,`button`,`reset`].indexOf(e)>-1?e:`submit`,b=e=>{let n=h(e);return t.d`<span class="content">
|
|
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(`./definition2.cjs`),s=require(`./affix.cjs`),c=require(`./class-names.cjs`),l=require(`./delegates-aria.cjs`),u=require(`./linkable.cjs`),d=require(`./definition5.cjs`),f=require(`./button.cjs`);var p=class extends s.n(e.t(u.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}}};a.t([t.u({converter:{fromView:e=>e||null,toView:e=>e||null}})],p.prototype,`title`,void 0),a.t([t.u],p.prototype,`connotation`,void 0),a.t([t.u],p.prototype,`shape`,void 0),a.t([t.u],p.prototype,`appearance`,void 0),a.t([t.u],p.prototype,`size`,void 0),a.t([t.u({mode:`boolean`,attribute:`stacked`})],p.prototype,`stacked`,void 0),a.t([t.u({mode:`boolean`,attribute:`pending`})],p.prototype,`pending`,void 0),a.t([t.u({mode:`boolean`,attribute:`dropdown-indicator`})],p.prototype,`dropdownIndicator`,void 0),a.t([t.u({mode:`boolean`,attribute:`active`})],p.prototype,`active`,void 0),a.t([t.u({mode:`boolean`,attribute:`pressed`})],p.prototype,`pressed`,void 0),a.t([t.u],p.prototype,`label`,void 0);var m=`.chevron{font:var(--vvd-typography-base-extended);flex-shrink:0;transition:transform .2s;display:flex;transform:rotate(0)}: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}@supports (user-select:none){.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}`,h=e=>{let n=e.tagFor(o.r);return t.f`<${n} class="chevron" aria-hidden="true" name="chevron-down-line"></${n}>`};function g(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 _=({connotation:e,appearance:t,shape:n,iconTrailing:r,icon:i,label:a,disabled:o,pending:s,stacked:l,size:u,iconSlottedContent:d,ariaExpanded:f,active:p,dropdownIndicator:m,pressed:h})=>c.t(`control`,[`connotation-${e}`,!!e],`appearance-${g(t,h)}`,[`disabled`,o||s],[`shape-${n}`,!!n],[`size-${u}`,!!u],[`icon-only`,!a&&!!(i||d?.length)&&!m],[`icon-trailing`,r],[`stacked`,!!l],[`active`,f===`true`||p]);function v(e,n,r,a=i.a.Normal){if(r&&a!=i.a.SuperCondensed){let r=e.tagFor(d.r),o={[i.a.Condensed]:`-6`,[i.a.Normal]:`-5`,[i.a.Expanded]:`-4`};return t.f`<span class="${e=>{let t=e.querySelector(`[slot="icon"]`);return c.t(`icon`,`pending`,[`pending-no-icon`,!(n||t)])}}" aria-hidden="true"><${r} size="${o[a]}"></${r}></span>`}else return s.a(e)(n,s.i.Slot)}var y=e=>[`submit`,`button`,`reset`].indexOf(e)>-1?e:`submit`,b=e=>{let n=h(e);return t.f`<span class="content">
|
|
2
2
|
${t=>v(e,t.icon,t.pending,t.size)}
|
|
3
|
-
${r.t(e=>e.label,t.
|
|
3
|
+
${r.t(e=>e.label,t.f`<span class="text" aria-hidden="true">${e=>e.label}</span>`)}
|
|
4
4
|
<span class="sr-only"
|
|
5
5
|
>${e=>e.pending?e.locale.button.pendingLabel:e.ariaLabel??e.label}</span
|
|
6
6
|
>
|
|
7
7
|
</span>
|
|
8
|
-
${r.t(e=>e.dropdownIndicator,n)}`};function x(e){return t.
|
|
8
|
+
${r.t(e=>e.dropdownIndicator,n)}`};function x(e){return t.f` <button
|
|
9
9
|
class="${_}"
|
|
10
10
|
?autofocus="${e=>e.autofocus}"
|
|
11
11
|
form="${e=>e.formId}"
|
|
@@ -18,12 +18,12 @@ const e=require(`./localized.cjs`),t=require(`./vivid-element.cjs`),n=require(`.
|
|
|
18
18
|
type="${e=>y(e.type)}"
|
|
19
19
|
value="${e=>e.value}"
|
|
20
20
|
title="${e=>e.title}"
|
|
21
|
-
${
|
|
21
|
+
${l.n({ariaLabel:null,ariaDisabled:e=>e.disabled||e.pending,ariaPressed:e=>e.pressed?`true`:e.ariaPressed??null})}
|
|
22
22
|
${n.t(`control`)}
|
|
23
23
|
@click="${(e,t)=>e.clickHandler(t.event)}"
|
|
24
24
|
>
|
|
25
25
|
${b(e)}
|
|
26
|
-
</button>`}function S(e){return t.
|
|
27
|
-
${r.t(e=>!e.href,t.
|
|
26
|
+
</button>`}function S(e){return t.f`${t=>t._renderLinkElement(b(e),_,{ariaLabel:null})}`}var C=t.s(`button`,p,e=>t.f` <template>
|
|
27
|
+
${r.t(e=>!e.href,t.f`${x(e)}`)}
|
|
28
28
|
${r.t(e=>e.href,S(e))}
|
|
29
|
-
</template>`,[o.t,d.t],{styles:m,shadowOptions:{delegatesFocus:!0}}),w=t.
|
|
29
|
+
</template>`,[o.t,d.t],{styles:m,shadowOptions:{delegatesFocus:!0}}),w=t.c(C);Object.defineProperty(exports,`i`,{enumerable:!0,get:function(){return p}}),Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return w}}),Object.defineProperty(exports,`r`,{enumerable:!0,get:function(){return h}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return C}});
|