@vonage/vivid 5.23.1 → 5.25.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/README.md +1 -1
- package/accordion/index.cjs +1 -1
- package/accordion/index.js +1 -1
- package/accordion-item/index.cjs +1 -1
- package/accordion-item/index.js +1 -1
- package/audio-player/index.cjs +2 -2
- package/audio-player/index.js +3 -3
- package/avatar/index.cjs +10 -10
- package/avatar/index.js +4 -3
- package/badge/index.cjs +1 -1
- package/badge/index.js +1 -1
- package/breadcrumb-item/index.cjs +9 -5
- package/breadcrumb-item/index.js +11 -6
- package/bundled/affix.cjs +1 -1
- package/bundled/affix.js +1 -1
- package/bundled/definition10.cjs +2 -1
- package/bundled/definition10.js +3 -2
- package/bundled/definition11.cjs +4 -4
- package/bundled/definition11.js +4 -3
- package/bundled/definition12.cjs +1 -1
- package/bundled/definition12.js +1 -0
- package/bundled/definition15.cjs +8 -7
- package/bundled/definition15.js +27 -24
- package/bundled/definition17.cjs +7 -7
- package/bundled/definition17.js +22 -109
- package/bundled/definition18.cjs +12 -83
- package/bundled/definition18.js +20 -426
- package/bundled/definition19.cjs +87 -7
- package/bundled/definition19.js +433 -16
- package/bundled/definition20.cjs +7 -37
- package/bundled/definition20.js +17 -172
- package/bundled/definition21.cjs +35 -27
- package/bundled/definition21.js +155 -154
- package/bundled/definition22.cjs +29 -6
- package/bundled/definition22.js +172 -20
- package/bundled/definition23.cjs +6 -12
- package/bundled/definition23.js +17 -32
- package/bundled/definition24.cjs +12 -39
- package/bundled/definition24.js +33 -67
- package/bundled/definition25.cjs +44 -0
- package/bundled/definition25.js +81 -0
- package/bundled/definition3.cjs +5 -5
- package/bundled/definition3.js +10 -40
- package/bundled/definition4.cjs +6 -6
- package/bundled/definition4.js +4 -3
- package/bundled/definition6.cjs +11 -11
- package/bundled/definition6.js +4 -3
- package/bundled/definition9.cjs +12 -6
- package/bundled/definition9.js +66 -43
- package/bundled/extractOptions.cjs +1 -0
- package/bundled/extractOptions.js +11 -0
- package/bundled/icon.cjs +1 -0
- package/bundled/icon.js +34 -0
- package/bundled/listbox.cjs +1 -1
- package/bundled/listbox.js +28 -12
- package/bundled/mixins.cjs +8 -8
- package/bundled/mixins.js +4 -3
- package/bundled/optgroup.cjs +1 -0
- package/bundled/optgroup.js +27 -0
- package/bundled/option.cjs +1 -0
- package/bundled/option.js +93 -0
- package/bundled/render-in-light-dom.cjs +1 -1
- package/bundled/render-in-light-dom.js +16 -19
- package/bundled/vivid-element.cjs +1 -1
- package/bundled/vivid-element.js +9 -1
- package/card/index.cjs +22 -22
- package/card/index.js +4 -3
- package/color-picker/index.cjs +18 -18
- package/color-picker/index.js +4 -3
- package/combobox/definition.cjs +1 -1
- package/combobox/definition.js +1 -1
- package/combobox/index.cjs +7 -7
- package/combobox/index.js +31 -21
- package/country/definition.cjs +1 -1
- package/country/definition.js +1 -1
- package/country/index.cjs +1 -1
- package/country/index.js +1 -1
- package/country-group/definition.cjs +1 -1
- package/country-group/definition.js +1 -1
- package/country-group/index.cjs +1 -1
- package/country-group/index.js +2 -2
- package/custom-elements.json +8438 -7866
- package/data-grid/definition.cjs +1 -1
- package/data-grid/definition.js +1 -1
- package/data-grid/index.cjs +26 -26
- package/data-grid/index.js +9 -8
- package/date-picker/definition.cjs +1 -1
- package/date-picker/definition.js +1 -1
- package/date-picker/index.cjs +1 -1
- package/date-picker/index.js +1 -1
- package/date-range-picker/definition.cjs +1 -1
- package/date-range-picker/definition.js +1 -1
- package/date-range-picker/index.cjs +1 -1
- package/date-range-picker/index.js +1 -1
- package/date-time-picker/definition.cjs +1 -1
- package/date-time-picker/definition.js +1 -1
- package/date-time-picker/index.cjs +1 -1
- package/date-time-picker/index.js +1 -1
- package/dial-pad/definition.cjs +1 -1
- package/dial-pad/definition.js +1 -1
- package/dial-pad/index.cjs +7 -7
- package/dial-pad/index.js +124 -54
- package/dialog/definition.cjs +1 -1
- package/dialog/definition.js +1 -1
- package/dialog/index.cjs +14 -14
- package/dialog/index.js +4 -3
- package/divider/definition.cjs +1 -1
- package/divider/definition.js +1 -1
- package/divider/index.cjs +1 -1
- package/divider/index.js +1 -1
- package/empty-state/definition.cjs +1 -1
- package/empty-state/definition.js +1 -1
- package/empty-state/index.cjs +3 -3
- package/empty-state/index.js +4 -3
- package/fab/definition.cjs +1 -1
- package/fab/definition.js +1 -1
- package/file-picker/definition.cjs +1 -1
- package/file-picker/definition.js +1 -1
- package/file-picker/index.cjs +7 -7
- package/file-picker/index.js +4 -3
- package/flag/definition.cjs +1 -1
- package/flag/definition.js +1 -1
- package/header/definition.cjs +1 -1
- package/header/definition.js +1 -1
- package/header/index.cjs +3 -3
- package/header/index.js +3 -3
- package/icon/definition.cjs +2 -1
- package/icon/definition.js +2 -1
- package/index.cjs +209 -198
- package/index.js +59 -54
- package/kbd-key/definition.cjs +1 -1
- package/kbd-key/definition.js +1 -1
- package/kbd-shortcut/definition.cjs +1 -1
- package/kbd-shortcut/definition.js +1 -1
- package/layout/definition.cjs +1 -1
- package/layout/definition.js +1 -1
- package/lib/accordion-item/accordion-item.d.ts +3 -1
- package/lib/action-group/action-group.d.ts +1 -1
- package/lib/alert/alert.d.ts +2 -2
- package/lib/audio-player/audio-player.d.ts +1 -1
- package/lib/avatar/avatar.d.ts +1 -1
- package/lib/badge/badge.d.ts +1 -1
- package/lib/banner/banner.d.ts +3 -3
- package/lib/breadcrumb/breadcrumb.d.ts +1 -1
- package/lib/breadcrumb-item/breadcrumb-item.d.ts +1 -1
- package/lib/button/button.d.ts +3 -3
- package/lib/calendar-event/calendar-event.d.ts +1 -1
- package/lib/card/card.d.ts +1 -1
- package/lib/checkbox/checkbox.d.ts +6 -6
- package/lib/color-picker/color-picker.d.ts +7 -7
- package/lib/combobox/combobox.d.ts +8 -8
- package/lib/components.d.ts +2 -0
- package/lib/country-group/country-group.d.ts +2 -2
- package/lib/data-grid/data-grid-cell.d.ts +4 -3
- package/lib/data-grid/data-grid-row.d.ts +3 -2
- package/lib/data-grid/data-grid.options.d.ts +5 -0
- package/lib/date-picker/date-picker.d.ts +8 -8
- package/lib/date-range-picker/date-range-picker.d.ts +4 -4
- package/lib/date-time-picker/date-time-picker.d.ts +8 -8
- package/lib/dial-pad/dial-pad.d.ts +2 -2
- package/lib/dialog/dialog.d.ts +2 -2
- package/lib/divider/divider.d.ts +1 -1
- package/lib/fab/fab.d.ts +1 -1
- package/lib/file-picker/file-picker.d.ts +7 -7
- package/lib/header/header.d.ts +1 -1
- package/lib/listbox/definition.d.ts +3 -0
- package/lib/listbox/index.d.ts +1 -0
- package/lib/listbox/listbox.d.ts +1302 -0
- package/lib/listbox/listbox.template.d.ts +3 -0
- package/lib/listbox/variations.browser-spec.d.ts +1 -0
- package/lib/menu/menu.d.ts +2 -3
- package/lib/menu-item/menu-item.d.ts +3 -3
- package/lib/nav/nav.d.ts +1 -1
- package/lib/nav-disclosure/nav-disclosure.d.ts +2 -2
- package/lib/nav-item/nav-item.d.ts +2 -2
- package/lib/note/note.d.ts +1 -1
- package/lib/number-field/number-field.d.ts +9 -10
- package/lib/optgroup/definition.d.ts +3 -0
- package/lib/optgroup/index.d.ts +1 -0
- package/lib/optgroup/optgroup.d.ts +430 -0
- package/lib/optgroup/optgroup.template.d.ts +2 -0
- package/lib/optgroup/variations.browser-spec.d.ts +1 -0
- package/lib/option/option.d.ts +2 -2
- package/lib/pagination/pagination.d.ts +1 -1
- package/lib/popover/popover.d.ts +2 -2
- package/lib/progress/progress.d.ts +1 -1
- package/lib/progress-ring/progress-ring.d.ts +1 -1
- package/lib/radio/radio.d.ts +3 -3
- package/lib/radio-group/radio-group.d.ts +1 -1
- package/lib/range-slider/range-slider.d.ts +3 -3
- package/lib/rich-text-editor/rich-text-editor.d.ts +1 -1
- package/lib/rich-text-editor/rte/features/base.d.ts +1 -0
- package/lib/rich-text-editor/rte/utils/default-textblock.d.ts +2 -2
- package/lib/searchable-select/option-tag.d.ts +1 -1
- package/lib/searchable-select/searchable-select.d.ts +47 -47
- package/lib/select/select.d.ts +9 -9
- package/lib/selectable-box/selectable-box.d.ts +1 -1
- package/lib/simple-color-picker/simple-color-picker.d.ts +2 -2
- package/lib/slider/slider.d.ts +3 -3
- package/lib/split-button/split-button.d.ts +3 -3
- package/lib/status/status.d.ts +1 -1
- package/lib/switch/switch.d.ts +2 -2
- package/lib/tab/tab.d.ts +3 -3
- package/lib/tab-panel/tab-panel.d.ts +1 -1
- package/lib/table/table-cell.d.ts +1 -1
- package/lib/table/table-header-cell.d.ts +1 -1
- package/lib/table/table-row.d.ts +1 -1
- package/lib/table/table-sorting-button.d.ts +1 -1
- package/lib/tag/tag.d.ts +3 -3
- package/lib/tag-group/tag-group.d.ts +1 -1
- package/lib/tag-name-map.d.ts +3 -1
- package/lib/text-area/text-area.d.ts +8 -8
- package/lib/text-field/text-field.d.ts +10 -9
- package/lib/time-picker/time-picker.d.ts +4 -4
- package/lib/toggletip/toggletip.d.ts +3 -2
- package/lib/tooltip/tooltip.d.ts +3 -2
- package/lib/tree-item/tree-item.d.ts +2 -2
- package/lib/tree-view/tree-view.d.ts +1 -1
- package/lib/video-player/video-player.d.ts +1 -1
- package/listbox/definition.cjs +5 -0
- package/listbox/definition.js +2 -0
- package/listbox/index.cjs +11 -0
- package/listbox/index.js +540 -0
- package/menu/index.cjs +1 -1
- package/menu/index.js +1 -1
- package/menu-item/index.cjs +1 -1
- package/menu-item/index.js +1 -1
- package/nav/definition.cjs +1 -1
- package/nav/definition.js +1 -1
- package/nav-disclosure/definition.cjs +1 -1
- package/nav-disclosure/definition.js +1 -1
- package/nav-disclosure/index.cjs +4 -4
- package/nav-disclosure/index.js +4 -3
- package/nav-item/definition.cjs +1 -1
- package/nav-item/definition.js +1 -1
- package/note/definition.cjs +1 -1
- package/note/definition.js +1 -1
- package/number-field/definition.cjs +1 -1
- package/number-field/definition.js +1 -1
- package/number-field/index.cjs +1 -1
- package/number-field/index.js +1 -1
- package/optgroup/definition.cjs +6 -0
- package/optgroup/definition.js +3 -0
- package/optgroup/index.cjs +1 -0
- package/optgroup/index.js +4 -0
- package/option/definition.cjs +2 -1
- package/option/definition.js +2 -1
- package/package.json +9 -8
- package/pagination/definition.cjs +1 -1
- package/pagination/definition.js +1 -1
- package/platform-switch/definition.cjs +1 -1
- package/platform-switch/definition.js +1 -1
- package/popover/definition.cjs +1 -1
- package/popover/definition.js +1 -1
- package/popover/index.cjs +5 -5
- package/popover/index.js +4 -3
- package/progress/definition.cjs +1 -1
- package/progress/definition.js +1 -1
- package/radio/definition.cjs +1 -1
- package/radio/definition.js +1 -1
- package/radio-group/definition.cjs +1 -1
- package/radio-group/definition.js +1 -1
- package/range-slider/definition.cjs +1 -1
- package/range-slider/definition.js +1 -1
- package/rich-text-editor/definition.cjs +1 -1
- package/rich-text-editor/definition.js +1 -1
- package/rich-text-editor/index.cjs +13 -13
- package/rich-text-editor/index.js +26 -23
- package/rich-text-view/definition.cjs +1 -1
- package/rich-text-view/definition.js +1 -1
- package/searchable-select/definition.cjs +1 -1
- package/searchable-select/definition.js +1 -1
- package/searchable-select/index.cjs +23 -23
- package/searchable-select/index.js +67 -49
- package/select/definition.cjs +1 -1
- package/select/definition.js +1 -1
- package/select/index.cjs +1 -1
- package/select/index.js +1 -1
- package/selectable-box/definition.cjs +1 -1
- package/selectable-box/definition.js +1 -1
- package/shared/aria/delegates-aria.d.ts +1 -1
- package/shared/aria/host-semantics.d.ts +1 -1
- package/shared/color-picker/base-color-picker.d.ts +1 -1
- package/shared/feedback/feedback-message.d.ts +1 -1
- package/shared/feedback/mixins.d.ts +2 -2
- package/shared/foundation/button/button.d.ts +2 -2
- package/shared/foundation/form-associated/form-associated.d.ts +2 -2
- package/shared/foundation/listbox/extractOptions.d.ts +2 -0
- package/shared/foundation/listbox/listbox.d.ts +2 -0
- package/shared/listbox/commands.d.ts +17 -0
- package/shared/listbox/move.d.ts +6 -0
- package/shared/listbox/options.d.ts +12 -0
- package/shared/listbox/selection.d.ts +28 -0
- package/shared/listbox/state.d.ts +26 -0
- package/shared/listbox/typeahead.d.ts +8 -0
- package/shared/listbox/with-options-filter.d.ts +440 -0
- package/shared/listbox/with-options.d.ts +862 -0
- package/shared/patterns/affix.d.ts +2 -2
- package/shared/patterns/anchored.d.ts +2 -2
- package/shared/patterns/char-count/char-count.d.ts +1 -1
- package/shared/patterns/form-elements/form-element.d.ts +1 -1
- package/shared/patterns/form-elements/with-contextual-help.d.ts +1 -1
- package/shared/patterns/form-elements/with-error-text.d.ts +1 -1
- package/shared/patterns/form-elements/with-success-text.d.ts +1 -1
- package/shared/patterns/kbd-shortcut.d.ts +1 -1
- package/shared/patterns/linkable.d.ts +1 -1
- package/shared/patterns/localized.d.ts +2 -2
- package/shared/patterns/trapped-focus.d.ts +1 -1
- package/shared/picker-field/mixins/calendar-picker.d.ts +2 -2
- package/shared/picker-field/mixins/calendar-picker.template.d.ts +2 -2
- package/shared/picker-field/mixins/inline-time-picker/inline-time-picker.d.ts +1 -1
- package/shared/picker-field/mixins/min-max-calendar-picker.d.ts +2 -2
- package/shared/picker-field/mixins/single-date-picker.d.ts +2 -2
- package/shared/picker-field/mixins/single-value-picker.d.ts +2 -2
- package/shared/picker-field/mixins/time-selection-picker.d.ts +2 -2
- package/shared/picker-field/mixins/time-selection-picker.template.d.ts +4 -4
- package/shared/picker-field/picker-field.d.ts +7 -7
- package/side-drawer/definition.cjs +1 -1
- package/side-drawer/definition.js +1 -1
- package/simple-color-picker/definition.cjs +1 -1
- package/simple-color-picker/definition.js +1 -1
- package/simple-color-picker/index.cjs +6 -6
- package/simple-color-picker/index.js +4 -3
- package/split-button/definition.cjs +1 -1
- package/split-button/definition.js +1 -1
- package/split-button/index.cjs +1 -0
- package/split-button/index.js +1 -0
- package/status/definition.cjs +1 -1
- package/status/definition.js +1 -1
- package/switch/definition.cjs +1 -1
- package/switch/definition.js +1 -1
- package/switch/index.cjs +6 -5
- package/switch/index.js +16 -14
- package/tab/definition.cjs +1 -1
- package/tab/definition.js +1 -1
- package/tab-panel/definition.cjs +1 -1
- package/tab-panel/definition.js +1 -1
- package/table/definition.cjs +1 -1
- package/table/definition.js +1 -1
- package/table/index.cjs +13 -13
- package/table/index.js +4 -3
- package/tabs/definition.cjs +1 -1
- package/tabs/definition.js +1 -1
- package/tag/definition.cjs +1 -1
- package/tag/definition.js +1 -1
- package/tag/index.cjs +11 -11
- package/tag/index.js +4 -3
- package/tag-group/definition.cjs +1 -1
- package/tag-group/definition.js +1 -1
- package/text-area/definition.cjs +1 -1
- package/text-area/definition.js +1 -1
- package/time-picker/definition.cjs +1 -1
- package/time-picker/definition.js +1 -1
- package/tree-item/definition.cjs +1 -1
- package/tree-item/definition.js +1 -1
- package/tree-view/definition.cjs +1 -1
- package/tree-view/definition.js +1 -1
- package/unbundled/affix.cjs +2 -2
- package/unbundled/affix.js +1 -1
- package/unbundled/base-progress.cjs +1 -1
- package/unbundled/base-progress.js +1 -1
- package/unbundled/button.cjs +2 -2
- package/unbundled/button.js +2 -2
- package/unbundled/definition.cjs +2 -65
- package/unbundled/definition.js +4 -61
- package/unbundled/definition11.cjs +4 -3
- package/unbundled/definition11.js +3 -2
- package/unbundled/definition12.cjs +3 -2
- package/unbundled/definition12.js +3 -2
- package/unbundled/definition13.cjs +1 -1
- package/unbundled/definition13.js +1 -1
- package/unbundled/definition14.cjs +2 -1
- package/unbundled/definition14.js +2 -1
- package/unbundled/definition17.cjs +9 -4
- package/unbundled/definition17.js +9 -4
- package/unbundled/definition2.cjs +14 -3
- package/unbundled/definition2.js +15 -4
- package/unbundled/definition21.cjs +2 -1
- package/unbundled/definition21.js +2 -1
- package/unbundled/definition23.cjs +3 -1
- package/unbundled/definition23.js +4 -2
- package/unbundled/definition24.cjs +6 -4
- package/unbundled/definition24.js +6 -4
- package/unbundled/definition25.cjs +2 -1
- package/unbundled/definition25.js +2 -1
- package/unbundled/definition26.cjs +7 -4
- package/unbundled/definition26.js +7 -4
- package/unbundled/definition27.cjs +39 -5
- package/unbundled/definition27.js +40 -6
- package/unbundled/definition28.cjs +4 -3
- package/unbundled/definition28.js +4 -3
- package/unbundled/definition29.cjs +5 -168
- package/unbundled/definition29.js +11 -162
- package/unbundled/definition30.cjs +26 -506
- package/unbundled/definition30.js +24 -498
- package/unbundled/definition31.cjs +503 -39
- package/unbundled/definition31.js +501 -37
- package/unbundled/definition32.cjs +39 -239
- package/unbundled/definition32.js +36 -236
- package/unbundled/definition33.cjs +236 -74
- package/unbundled/definition33.js +233 -71
- package/unbundled/definition34.cjs +74 -1968
- package/unbundled/definition34.js +70 -1940
- package/unbundled/definition35.cjs +1993 -26
- package/unbundled/definition35.js +1965 -27
- package/unbundled/definition36.cjs +26 -111
- package/unbundled/definition36.js +23 -103
- package/unbundled/definition37.cjs +53 -294
- package/unbundled/definition37.js +50 -291
- package/unbundled/definition38.cjs +282 -132
- package/unbundled/definition38.js +279 -129
- package/unbundled/definition39.cjs +165 -339
- package/unbundled/definition39.js +163 -337
- package/unbundled/definition40.cjs +395 -227
- package/unbundled/definition40.js +393 -225
- package/unbundled/definition41.cjs +269 -47
- package/unbundled/definition41.js +264 -42
- package/unbundled/definition42.cjs +48 -67
- package/unbundled/definition42.js +45 -64
- package/unbundled/definition43.cjs +56 -383
- package/unbundled/definition43.js +55 -382
- package/unbundled/definition44.cjs +387 -44
- package/unbundled/definition44.js +383 -40
- package/unbundled/definition45.cjs +53 -45
- package/unbundled/definition45.js +49 -41
- package/unbundled/definition46.cjs +40 -164
- package/unbundled/definition46.js +36 -160
- package/unbundled/definition47.cjs +171 -31
- package/unbundled/definition47.js +168 -22
- package/unbundled/definition48.cjs +30 -89
- package/unbundled/definition48.js +22 -87
- package/unbundled/definition49.cjs +589 -48
- package/unbundled/definition49.js +587 -47
- package/unbundled/definition50.cjs +90 -21
- package/unbundled/definition50.js +88 -16
- package/unbundled/definition51.cjs +47 -32
- package/unbundled/definition51.js +44 -29
- package/unbundled/definition52.cjs +22 -323
- package/unbundled/definition52.js +16 -320
- package/unbundled/definition53.cjs +33 -212
- package/unbundled/definition53.js +29 -208
- package/unbundled/definition54.cjs +318 -41
- package/unbundled/definition54.js +314 -37
- package/unbundled/definition55.cjs +199 -253
- package/unbundled/definition55.js +193 -247
- package/unbundled/definition56.cjs +45 -53
- package/unbundled/definition56.js +42 -49
- package/unbundled/definition57.cjs +255 -133
- package/unbundled/definition57.js +253 -128
- package/unbundled/definition58.cjs +49 -245
- package/unbundled/definition58.js +47 -244
- package/unbundled/definition59.cjs +127 -444
- package/unbundled/definition59.js +124 -444
- package/unbundled/definition6.cjs +2 -1
- package/unbundled/definition6.js +2 -1
- package/unbundled/definition60.cjs +230 -3746
- package/unbundled/definition60.js +223 -3576
- package/unbundled/definition61.cjs +427 -739
- package/unbundled/definition61.js +425 -737
- package/unbundled/definition62.cjs +3762 -103
- package/unbundled/definition62.js +3593 -97
- package/unbundled/definition63.cjs +678 -886
- package/unbundled/definition63.js +672 -877
- package/unbundled/definition64.cjs +104 -108
- package/unbundled/definition64.js +100 -104
- package/unbundled/definition65.cjs +999 -65
- package/unbundled/definition65.js +995 -58
- package/unbundled/definition66.cjs +105 -155
- package/unbundled/definition66.js +101 -151
- package/unbundled/definition67.cjs +71 -121
- package/unbundled/definition67.js +63 -119
- package/unbundled/definition68.cjs +162 -51
- package/unbundled/definition68.js +158 -47
- package/unbundled/definition69.cjs +117 -75
- package/unbundled/definition69.js +116 -71
- package/unbundled/definition70.cjs +59 -21
- package/unbundled/definition70.js +56 -15
- package/unbundled/definition71.cjs +80 -75
- package/unbundled/definition71.js +76 -74
- package/unbundled/definition72.cjs +20 -305
- package/unbundled/definition72.js +14 -230
- package/unbundled/definition73.cjs +75 -315
- package/unbundled/definition73.js +74 -307
- package/unbundled/definition74.cjs +308 -30
- package/unbundled/definition74.js +231 -24
- package/unbundled/definition75.cjs +314 -109
- package/unbundled/definition75.js +304 -106
- package/unbundled/definition76.cjs +26 -250
- package/unbundled/definition76.js +21 -246
- package/unbundled/definition77.cjs +133 -27
- package/unbundled/definition77.js +124 -25
- package/unbundled/definition78.cjs +230 -116
- package/unbundled/definition78.js +227 -107
- package/unbundled/definition79.cjs +28 -203
- package/unbundled/definition79.js +26 -193
- package/unbundled/definition80.cjs +126 -477
- package/unbundled/definition80.js +118 -473
- package/unbundled/definition81.cjs +221 -0
- package/unbundled/definition81.js +202 -0
- package/unbundled/definition82.cjs +517 -0
- package/unbundled/definition82.js +497 -0
- package/unbundled/extractOptions.cjs +21 -0
- package/unbundled/extractOptions.js +16 -0
- package/unbundled/icon.cjs +67 -0
- package/unbundled/icon.js +61 -0
- package/unbundled/linkable.cjs +1 -1
- package/unbundled/linkable.js +1 -1
- package/unbundled/listbox.cjs +29 -7
- package/unbundled/listbox.js +29 -7
- package/unbundled/mixins.cjs +2 -1
- package/unbundled/mixins.js +2 -1
- package/unbundled/optgroup.cjs +66 -0
- package/unbundled/optgroup.js +54 -0
- package/unbundled/option.cjs +176 -0
- package/unbundled/option.js +164 -0
- package/unbundled/time-selection-picker.template.cjs +1 -1
- package/unbundled/time-selection-picker.template.js +1 -1
- package/unbundled/vivid-element.cjs +10 -1
- package/unbundled/vivid-element.js +10 -1
- package/video-player/definition.cjs +1 -1
- package/video-player/definition.js +1 -1
- package/vivid.api.json +568 -231
|
@@ -0,0 +1,81 @@
|
|
|
1
|
+
import { A as e, d as t, h as n, m as r, n as i, p as a, t as o, u as s } from "./vivid-element.js";
|
|
2
|
+
import { t as c } from "./slotted.js";
|
|
3
|
+
import { t as l } from "./ref.js";
|
|
4
|
+
import { t as u } from "./when.js";
|
|
5
|
+
import { t as d } from "./decorate.js";
|
|
6
|
+
import { t as f } from "./class-names.js";
|
|
7
|
+
import { t as p } from "./definition3.js";
|
|
8
|
+
import { a as m, i as h, n as g } from "./affix.js";
|
|
9
|
+
//#region src/lib/accordion-item/accordion-item.scss?inline
|
|
10
|
+
var _ = ":host{--_vvd-accordion-item-accent-firm-wrapper:var(--vvd-accordion-item-accent-firm)}.heading-button{--vvd-accordion-item-accent-firm:var(--_vvd-accordion-item-accent-firm-wrapper,var(--vvd-accordion-item-accent-primary))}:host{box-sizing:border-box;flex-direction:column;display:flex}.heading-container{margin:0}.heading-button,.heading-button.appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.heading-button.appearance-filled{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary);--_appearance-color-outline:transparent}@media (hover:hover){.heading-button:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}.heading-button: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}.heading-button: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}}.heading-button.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}.heading-button.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}.heading-button.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}.heading-button:active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.heading-button: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}.heading-button: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}.heading-button.active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.heading-button.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}.heading-button.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}.heading-button{--_connotation-color-primary:var(--vvd-accordion-item-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-accordion-item-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-accordion-item-accent-primary-increment,var(--vvd-color-neutral-800));--_connotation-color-fierce:var(--vvd-accordion-item-accent-fierce,var(--vvd-color-neutral-700));--_connotation-color-faint:var(--vvd-accordion-item-accent-faint,var(--vvd-color-neutral-50));--_connotation-color-soft:var(--vvd-accordion-item-accent-soft,var(--vvd-color-neutral-100));--_connotation-color-firm:var(--vvd-accordion-item-accent-firm,var(--vvd-color-canvas-text));--focus-stroke-gap-color:transparent;background-color:var(--_appearance-color-fill);width:100%;color:var(--_appearance-color-text);cursor:pointer;text-align:left;border:none;align-items:center;padding:16px;display:flex}.heading-button: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))}.heading-button.size-condensed{font:var(--vvd-typography-base-extended-bold);gap:12px}.heading-button:not(.size-condensed){font:var(--vvd-typography-heading-4);gap:16px}.heading-content{flex-direction:column;flex:auto;gap:4px;min-inline-size:0;display:flex}.heading-primary{min-inline-size:0}.heading-secondary{color:var(--vvd-color-neutral-600)}.heading-button:not(.size-condensed) .heading-secondary,.heading-button.size-condensed .heading-secondary{font:var(--vvd-typography-base)}.meta{max-width:var(--accordion-item-meta-inline-size,20%);color:var(--vvd-color-neutral-600);text-align:end;text-overflow:ellipsis;white-space:nowrap;flex-shrink:0;overflow:hidden}.heading-button:not(.size-condensed) .meta{font:var(--vvd-typography-base-bold)}.heading-button.size-condensed .meta{font:var(--vvd-typography-base-condensed-bold)}.region{padding:8px 32px 24px 16px;display:none}.region:not(.size-condensed).padded{padding-inline-start:52px}:host([expanded]) .region{display:block}.region.size-condensed.padded{padding-inline-start:44px}slot[name=icon]{color:var(--vvd-color-neutral-600)}.heading-button:not(.size-condensed) slot[name=icon]{font:inherit}.heading-button.size-condensed slot[name=icon]{font:var(--vvd-typography-base-extended)}:host(:not([icon-trailing])) slot[name=icon]:last-of-type{color:var(--_appearance-color-text)}", v = class extends g(o) {
|
|
11
|
+
constructor(...e) {
|
|
12
|
+
super(...e), this.headinglevel = 2, this.expanded = !1, this.noIndicator = !1, this.clickHandler = () => {
|
|
13
|
+
this.expanded = !this.expanded, this.change();
|
|
14
|
+
}, this.change = () => {
|
|
15
|
+
this.$emit("change");
|
|
16
|
+
};
|
|
17
|
+
}
|
|
18
|
+
};
|
|
19
|
+
d([r({
|
|
20
|
+
attribute: "heading-level",
|
|
21
|
+
mode: "fromView",
|
|
22
|
+
converter: n
|
|
23
|
+
})], v.prototype, "headinglevel", void 0), d([r], v.prototype, "appearance", void 0), d([r({ mode: "boolean" })], v.prototype, "expanded", void 0), d([r], v.prototype, "id", void 0), d([r], v.prototype, "heading", void 0), d([r({ attribute: "secondary-text" })], v.prototype, "secondaryText", void 0), d([i({
|
|
24
|
+
deprecatedPropertyName: "secondaryText",
|
|
25
|
+
fromDeprecated: (e) => e,
|
|
26
|
+
toDeprecated: (e) => e
|
|
27
|
+
}), r({ attribute: "text-secondary" })], v.prototype, "textSecondary", void 0), d([e], v.prototype, "_headingSlottedContent", void 0), d([r({
|
|
28
|
+
mode: "boolean",
|
|
29
|
+
attribute: "no-indicator"
|
|
30
|
+
})], v.prototype, "noIndicator", void 0), d([r], v.prototype, "meta", void 0), d([e], v.prototype, "_metaSlottedContent", void 0), d([r], v.prototype, "size", void 0);
|
|
31
|
+
//#endregion
|
|
32
|
+
//#region src/lib/accordion-item/accordion-item.template.ts
|
|
33
|
+
var y = (e, t) => {
|
|
34
|
+
let n = m(e), r = a.partial(t);
|
|
35
|
+
return a`
|
|
36
|
+
<${r} class="heading-container">
|
|
37
|
+
<button
|
|
38
|
+
class="${(e) => f("heading-button", [`appearance-${e.appearance}`, !!e.appearance], [`size-${e.size}`, !!e.size])}"
|
|
39
|
+
id="${(e) => e.id}"
|
|
40
|
+
aria-expanded="${(e) => e.expanded}"
|
|
41
|
+
aria-controls="${(e) => e.id}-panel"
|
|
42
|
+
@click="${(e) => e.clickHandler()}"
|
|
43
|
+
${l("expandbutton")}
|
|
44
|
+
>
|
|
45
|
+
|
|
46
|
+
${(e) => e.iconTrailing ? null : n(e.icon, h.Slot)}
|
|
47
|
+
|
|
48
|
+
<span class="heading-content">
|
|
49
|
+
<span class="heading-primary">
|
|
50
|
+
<slot name="heading" ${c("_headingSlottedContent")}></slot>
|
|
51
|
+
${u((e) => e.heading && !e._headingSlottedContent?.length, a`${(e) => e.heading}`)}
|
|
52
|
+
</span>
|
|
53
|
+
${u((e) => !!e.textSecondary, a`<span class="heading-secondary"
|
|
54
|
+
>${(e) => e.textSecondary}</span
|
|
55
|
+
>`)}
|
|
56
|
+
</span>
|
|
57
|
+
|
|
58
|
+
<span class="meta">
|
|
59
|
+
<slot name="meta" ${c("_metaSlottedContent")}></slot>
|
|
60
|
+
${u((e) => e.meta && !e._metaSlottedContent?.length, a`${(e) => e.meta}`)}
|
|
61
|
+
</span>
|
|
62
|
+
|
|
63
|
+
${(e) => e.icon && e.iconTrailing ? n(e.icon) : null}
|
|
64
|
+
${(e) => !(e.icon && e.iconTrailing) && !e.noIndicator ? n(e.expanded ? "chevron-up-line" : "chevron-down-line") : null}
|
|
65
|
+
|
|
66
|
+
</button>
|
|
67
|
+
</${r}>
|
|
68
|
+
`;
|
|
69
|
+
}, b = s("accordion-item", v, (e) => a`
|
|
70
|
+
${(t) => y(e, `h${t.headinglevel}`)}
|
|
71
|
+
<div
|
|
72
|
+
id="${(e) => e.id}-panel"
|
|
73
|
+
aria-labelledby="${(e) => e.id}"
|
|
74
|
+
role="region"
|
|
75
|
+
class="region ${(e) => e.icon && !e.iconTrailing ? "padded" : ""} ${(e) => e.size ? `size-${e.size}` : ""}"
|
|
76
|
+
>
|
|
77
|
+
<slot></slot>
|
|
78
|
+
</div>
|
|
79
|
+
`, [p], { styles: _ }), x = t(b);
|
|
80
|
+
//#endregion
|
|
81
|
+
export { x as n, v as r, b as t };
|
package/bundled/definition3.cjs
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
const e=require(`./vivid-element.cjs`),t=require(`./when.cjs`),n=require(`./
|
|
1
|
+
const e=require(`./vivid-element.cjs`),t=require(`./when.cjs`),n=require(`./class-names.cjs`),r=require(`./icon.cjs`);var i=e.u(`icon`,r.t,()=>{let r=e=>!e.label||e.label.trim().length===0;return e.p`
|
|
2
2
|
<span
|
|
3
|
-
class="${e=>
|
|
4
|
-
role="${e=>
|
|
5
|
-
?aria-hidden="${e=>
|
|
3
|
+
class="${e=>n.t(`control`,[`connotation-${e.connotation}`,!!e.connotation],[`size-${e.size}`,typeof e.size==`number`])}"
|
|
4
|
+
role="${e=>r(e)?null:`img`}"
|
|
5
|
+
?aria-hidden="${e=>r(e)}"
|
|
6
6
|
aria-label="${e=>e.label||null}"
|
|
7
7
|
?aria-busy="${e=>!e?.iconLoaded}"
|
|
8
8
|
>
|
|
@@ -10,4 +10,4 @@ const e=require(`./vivid-element.cjs`),t=require(`./when.cjs`),n=require(`./deco
|
|
|
10
10
|
${t.t(e=>e?.iconLoaded&&e?._svg,t=>e.p`${e.p.partial(t._svg)}`)}
|
|
11
11
|
</slot>
|
|
12
12
|
</span>
|
|
13
|
-
`},[],{styles:
|
|
13
|
+
`},[],{styles:`:host{vertical-align:sub;display:inline-block}.control.connotation-accent{--_connotation-color-primary:var(--vvd-icon-accent-primary,var(--vvd-color-canvas-text))}.control.connotation-announcement{--_connotation-color-primary:var(--vvd-icon-announcement-primary,var(--vvd-color-announcement-500))}.control.connotation-cta{--_connotation-color-primary:var(--vvd-icon-cta-primary,var(--vvd-color-cta-500))}.control.connotation-success{--_connotation-color-primary:var(--vvd-icon-success-primary,var(--vvd-color-success-500))}.control.connotation-warning{--_connotation-color-primary:var(--vvd-icon-warning-primary,var(--vvd-color-warning-300))}.control.connotation-alert{--_connotation-color-primary:var(--vvd-icon-alert-primary,var(--vvd-color-alert-500))}.control.connotation-information{--_connotation-color-primary:var(--vvd-icon-information-primary,var(--vvd-color-information-500))}.control.size--6{--_icon-block-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))}.control.size--5{--_icon-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 20))}.control.size--4{--_icon-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16))}.control.size--3{--_icon-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 12))}.control.size--2{--_icon-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8))}.control.size--1{--_icon-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 4))}.control.size-0{--_icon-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)))}.control.size-1{--_icon-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 4))}.control.size-2{--_icon-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 8))}.control.size-3{--_icon-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 12))}.control.size-4{--_icon-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 16))}.control.size-5{--_icon-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 20))}.control:not(.size--6,.size--5,.size--4,.size--3,.size--2,.size--1,.size-0,.size-1,.size-2,.size-3,.size-4,.size-5){--_icon-block-size:1em}.control{margin:unset;block-size:var(--_icon-block-size);color:currentColor;contain:strict;inline-size:var(--_icon-block-size);display:flex}.control[class*=connotation]{color:var(--_connotation-color-primary)}slot,svg,::slotted(:where(svg,img)){block-size:inherit;inline-size:inherit;margin:auto}`}),a=e.d(i);Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return a}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return i}});
|
package/bundled/definition3.js
CHANGED
|
@@ -1,54 +1,24 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import { t as
|
|
3
|
-
import { t as
|
|
4
|
-
import { t as
|
|
5
|
-
import { n as l, r as u, t as d } from "./numberConverter.js";
|
|
6
|
-
//#region src/lib/icon/icon.scss?inline
|
|
7
|
-
var f = ":host{vertical-align:sub;display:inline-block}.control.connotation-accent{--_connotation-color-primary:var(--vvd-icon-accent-primary,var(--vvd-color-canvas-text))}.control.connotation-announcement{--_connotation-color-primary:var(--vvd-icon-announcement-primary,var(--vvd-color-announcement-500))}.control.connotation-cta{--_connotation-color-primary:var(--vvd-icon-cta-primary,var(--vvd-color-cta-500))}.control.connotation-success{--_connotation-color-primary:var(--vvd-icon-success-primary,var(--vvd-color-success-500))}.control.connotation-warning{--_connotation-color-primary:var(--vvd-icon-warning-primary,var(--vvd-color-warning-300))}.control.connotation-alert{--_connotation-color-primary:var(--vvd-icon-alert-primary,var(--vvd-color-alert-500))}.control.connotation-information{--_connotation-color-primary:var(--vvd-icon-information-primary,var(--vvd-color-information-500))}.control.size--6{--_icon-block-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))}.control.size--5{--_icon-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 20))}.control.size--4{--_icon-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16))}.control.size--3{--_icon-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 12))}.control.size--2{--_icon-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8))}.control.size--1{--_icon-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 4))}.control.size-0{--_icon-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)))}.control.size-1{--_icon-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 4))}.control.size-2{--_icon-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 8))}.control.size-3{--_icon-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 12))}.control.size-4{--_icon-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 16))}.control.size-5{--_icon-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 20))}.control:not(.size--6,.size--5,.size--4,.size--3,.size--2,.size--1,.size-0,.size-1,.size-2,.size-3,.size-4,.size-5){--_icon-block-size:1em}.control{margin:unset;block-size:var(--_icon-block-size);color:currentColor;contain:strict;inline-size:var(--_icon-block-size);display:flex}.control[class*=connotation]{color:var(--_connotation-color-primary)}slot,svg,::slotted(:where(svg,img)){block-size:inherit;inline-size:inherit;margin:auto}", p = 500, m = 2e3, h = class extends i {
|
|
8
|
-
constructor(...e) {
|
|
9
|
-
super(...e), this.iconLoaded = !1, this.#e = 0, this.#t = null;
|
|
10
|
-
}
|
|
11
|
-
#e;
|
|
12
|
-
#t;
|
|
13
|
-
async nameChanged() {
|
|
14
|
-
let e = ++this.#e;
|
|
15
|
-
this.#t && this.#t.abort(), this.#t = new AbortController(), this._svg = void 0, this.iconLoaded = !1;
|
|
16
|
-
let t = setTimeout(() => {
|
|
17
|
-
/* v8 ignore else -- @preserve */
|
|
18
|
-
this.#e === e && (this._svg = u, t = setTimeout(() => {
|
|
19
|
-
/* v8 ignore else -- @preserve */
|
|
20
|
-
this.#e === e && this._svg === u && (this._svg = void 0);
|
|
21
|
-
}, m));
|
|
22
|
-
}, p);
|
|
23
|
-
try {
|
|
24
|
-
let t = await l(this.name, this.#t.signal);
|
|
25
|
-
/* v8 ignore else -- @preserve */
|
|
26
|
-
this.#e === e && (this._svg = t);
|
|
27
|
-
} catch {
|
|
28
|
-
this.#e === e && (this._svg = void 0);
|
|
29
|
-
} finally {
|
|
30
|
-
this.#e === e && (clearTimeout(t), this.iconLoaded = !0);
|
|
31
|
-
}
|
|
32
|
-
}
|
|
33
|
-
};
|
|
34
|
-
s([n], h.prototype, "connotation", void 0), s([n({ converter: d })], h.prototype, "size", void 0), s([e], h.prototype, "_svg", void 0), s([e], h.prototype, "iconLoaded", void 0), s([n], h.prototype, "label", void 0), s([n], h.prototype, "name", void 0);
|
|
1
|
+
import { d as e, p as t, u as n } from "./vivid-element.js";
|
|
2
|
+
import { t as r } from "./when.js";
|
|
3
|
+
import { t as i } from "./class-names.js";
|
|
4
|
+
import { t as a } from "./icon.js";
|
|
35
5
|
//#endregion
|
|
36
6
|
//#region src/lib/icon/definition.ts
|
|
37
|
-
var
|
|
7
|
+
var o = n("icon", a, () => {
|
|
38
8
|
let e = (e) => !e.label || e.label.trim().length === 0;
|
|
39
|
-
return
|
|
9
|
+
return t`
|
|
40
10
|
<span
|
|
41
|
-
class="${(e) =>
|
|
11
|
+
class="${(e) => i("control", [`connotation-${e.connotation}`, !!e.connotation], [`size-${e.size}`, typeof e.size == "number"])}"
|
|
42
12
|
role="${(t) => e(t) ? null : "img"}"
|
|
43
13
|
?aria-hidden="${(t) => e(t)}"
|
|
44
14
|
aria-label="${(e) => e.label || null}"
|
|
45
15
|
?aria-busy="${(e) => !e?.iconLoaded}"
|
|
46
16
|
>
|
|
47
17
|
<slot aria-hidden="true">
|
|
48
|
-
${
|
|
18
|
+
${r((e) => e?.iconLoaded && e?._svg, (e) => t`${t.partial(e._svg)}`)}
|
|
49
19
|
</slot>
|
|
50
20
|
</span>
|
|
51
21
|
`;
|
|
52
|
-
}, [], { styles:
|
|
22
|
+
}, [], { styles: ":host{vertical-align:sub;display:inline-block}.control.connotation-accent{--_connotation-color-primary:var(--vvd-icon-accent-primary,var(--vvd-color-canvas-text))}.control.connotation-announcement{--_connotation-color-primary:var(--vvd-icon-announcement-primary,var(--vvd-color-announcement-500))}.control.connotation-cta{--_connotation-color-primary:var(--vvd-icon-cta-primary,var(--vvd-color-cta-500))}.control.connotation-success{--_connotation-color-primary:var(--vvd-icon-success-primary,var(--vvd-color-success-500))}.control.connotation-warning{--_connotation-color-primary:var(--vvd-icon-warning-primary,var(--vvd-color-warning-300))}.control.connotation-alert{--_connotation-color-primary:var(--vvd-icon-alert-primary,var(--vvd-color-alert-500))}.control.connotation-information{--_connotation-color-primary:var(--vvd-icon-information-primary,var(--vvd-color-information-500))}.control.size--6{--_icon-block-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))}.control.size--5{--_icon-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 20))}.control.size--4{--_icon-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16))}.control.size--3{--_icon-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 12))}.control.size--2{--_icon-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8))}.control.size--1{--_icon-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 4))}.control.size-0{--_icon-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)))}.control.size-1{--_icon-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 4))}.control.size-2{--_icon-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 8))}.control.size-3{--_icon-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 12))}.control.size-4{--_icon-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 16))}.control.size-5{--_icon-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 20))}.control:not(.size--6,.size--5,.size--4,.size--3,.size--2,.size--1,.size-0,.size-1,.size-2,.size-3,.size-4,.size-5){--_icon-block-size:1em}.control{margin:unset;block-size:var(--_icon-block-size);color:currentColor;contain:strict;inline-size:var(--_icon-block-size);display:flex}.control[class*=connotation]{color:var(--_connotation-color-primary)}slot,svg,::slotted(:where(svg,img)){block-size:inherit;inline-size:inherit;margin:auto}" }), s = e(o);
|
|
53
23
|
//#endregion
|
|
54
|
-
export {
|
|
24
|
+
export { s as n, o as t };
|
package/bundled/definition4.cjs
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
|
-
const e=require(`./vivid-element.cjs`),t=require(`./slotted.cjs`),n=require(`./children.cjs`),r=require(`./ref.cjs`),i=require(`./when.cjs`),a=require(`./decorate.cjs`),o=require(`./class-names.cjs`),s=require(`./dom.cjs`),c=require(`./definition3.cjs`),l=require(`./
|
|
1
|
+
const e=require(`./vivid-element.cjs`),t=require(`./slotted.cjs`),n=require(`./children.cjs`),r=require(`./ref.cjs`),i=require(`./when.cjs`),a=require(`./decorate.cjs`),o=require(`./class-names.cjs`),s=require(`./dom.cjs`),c=require(`./definition3.cjs`),l=require(`./icon.cjs`),u=require(`./affix.cjs`),d=require(`./host-semantics.cjs`);var f=`: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;user-select:none;border-radius:8px;align-items:center;gap:12px;padding-inline:16px;text-decoration:none;display:inline-flex;position:relative}.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 p(e){return s.t(e)&&(e.getAttribute(`role`)===`treeitem`||e instanceof m)}var m=class extends d.t(u.t(e.t)){constructor(...e){super(...e),this.expanded=!1,this.selected=!1,this.disabled=!1,this.focusable=!1,this.isNestedItem=()=>p(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=>{p(e)&&(e.nested=!0)})}static focusItem(e){e.focusable=!0,e.focus()}childItemLength(){return this.childItems.filter(e=>p(e)).length}};a.t([e.m],m.prototype,`text`,void 0),a.t([e.m({mode:`boolean`})],m.prototype,`expanded`,void 0),a.t([e.m({mode:`boolean`})],m.prototype,`selected`,void 0),a.t([e.m({mode:`boolean`})],m.prototype,`disabled`,void 0),a.t([e.A],m.prototype,`focusable`,void 0),a.t([e.A],m.prototype,`childItems`,void 0),a.t([e.A],m.prototype,`items`,void 0),a.t([e.A],m.prototype,`nested`,void 0),a.t([e.A],m.prototype,`renderCollapsedChildren`,void 0);var h=t=>{let n=t.tagFor(l.t);return e.p`
|
|
2
2
|
<div aria-hidden="true"
|
|
3
3
|
class="expandCollapseButton"
|
|
4
4
|
@click="${(e,t)=>e.handleExpandCollapseButtonClick(t.event)}"
|
|
5
5
|
${r.t(`expandCollapseButton`)}
|
|
6
6
|
>
|
|
7
7
|
<${n} class="expandCollapseIcon" name="${e=>e.expanded?`chevron-down-line`:`chevron-right-line`}"></${n}>
|
|
8
|
-
</div>`},
|
|
8
|
+
</div>`},g=e.u(`tree-item`,m,r=>{let a=u.a(r),s=r.tagFor(m,!0);return e.p` <template
|
|
9
9
|
slot="${e=>e.isNestedItem()?`item`:void 0}"
|
|
10
10
|
tabindex="-1"
|
|
11
|
-
${
|
|
11
|
+
${d.n({role:`treeitem`,ariaExpanded:e=>e.childItems&&e.childItems.length>0?e.expanded:void 0,ariaSelected:e=>e.selected,ariaDisabled:e=>e.disabled})}
|
|
12
12
|
@focusin="${(e,t)=>e.handleFocus(t.event)}"
|
|
13
13
|
@focusout="${(e,t)=>e.handleBlur(t.event)}"
|
|
14
14
|
${n.t({property:`childItems`,filter:t.r(s)})}
|
|
@@ -16,11 +16,11 @@ const e=require(`./vivid-element.cjs`),t=require(`./slotted.cjs`),n=require(`./c
|
|
|
16
16
|
<div
|
|
17
17
|
class="${e=>o.t(`control`,[`disabled`,e.disabled],[`selected`,e.selected])}"
|
|
18
18
|
>
|
|
19
|
-
${i.t(e=>e.childItems&&e.childItems.length>0,
|
|
20
|
-
${e=>a(e.icon,
|
|
19
|
+
${i.t(e=>e.childItems&&e.childItems.length>0,h(r))}
|
|
20
|
+
${e=>a(e.icon,u.i.Slot)}
|
|
21
21
|
${e=>e.text}
|
|
22
22
|
</div>
|
|
23
23
|
${i.t(e=>e.childItems&&e.childItems.length>0&&e.expanded,e.p` <div role="group" class="items">
|
|
24
24
|
<slot name="item" ${t.t(`items`)}></slot>
|
|
25
25
|
</div>`)}
|
|
26
|
-
</template>`},[c.t],{styles:
|
|
26
|
+
</template>`},[c.t],{styles:f}),_=e.d(g);Object.defineProperty(exports,`i`,{enumerable:!0,get:function(){return p}}),Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return g}}),Object.defineProperty(exports,`r`,{enumerable:!0,get:function(){return m}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return _}});
|
package/bundled/definition4.js
CHANGED
|
@@ -6,7 +6,8 @@ import { t as u } from "./when.js";
|
|
|
6
6
|
import { t as d } from "./decorate.js";
|
|
7
7
|
import { t as f } from "./class-names.js";
|
|
8
8
|
import { t as p } from "./dom.js";
|
|
9
|
-
import {
|
|
9
|
+
import { t as m } from "./definition3.js";
|
|
10
|
+
import { t as h } from "./icon.js";
|
|
10
11
|
import { a as g, i as _, t as v } from "./affix.js";
|
|
11
12
|
import { n as y, t as b } from "./host-semantics.js";
|
|
12
13
|
//#region src/lib/tree-item/tree-item.scss?inline
|
|
@@ -49,7 +50,7 @@ d([n], C.prototype, "text", void 0), d([n({ mode: "boolean" })], C.prototype, "e
|
|
|
49
50
|
//#endregion
|
|
50
51
|
//#region src/lib/tree-item/tree-item.template.ts
|
|
51
52
|
var w = (e) => {
|
|
52
|
-
let t = e.tagFor(
|
|
53
|
+
let t = e.tagFor(h);
|
|
53
54
|
return r`
|
|
54
55
|
<div aria-hidden="true"
|
|
55
56
|
class="expandCollapseButton"
|
|
@@ -87,6 +88,6 @@ var w = (e) => {
|
|
|
87
88
|
<slot name="item" ${s("items")}></slot>
|
|
88
89
|
</div>`)}
|
|
89
90
|
</template>`;
|
|
90
|
-
}, [
|
|
91
|
+
}, [m], { styles: x }), E = t(T);
|
|
91
92
|
//#endregion
|
|
92
93
|
export { S as i, T as n, C as r, E as t };
|
package/bundled/definition6.cjs
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
const e=require(`./localized.cjs`),t=require(`./vivid-element.cjs`),n=require(`./ref.cjs`),r=require(`./when.cjs`),i=require(`./enums.cjs`),a=require(`./decorate.cjs`),o=require(`./class-names.cjs`),s=require(`./definition3.cjs`),c=require(`./affix.cjs`),l=require(`./definition5.cjs`),u=require(`./delegates-aria.cjs`),d=require(`./button.cjs`),f=require(`./linkable.cjs`);var p=class extends c.n(e.t(f.t(d.t))){constructor(){super(),this.stacked=!1,this.pending=!1,this.dropdownIndicator=!1,this.active=!1,this.pressed=!1,this.title=``}clickHandler(e){if(this.disabled||this.pending){e.preventDefault(),e.stopImmediatePropagation();return}return!0}};a.t([t.m({converter:{fromView:e=>e||null,toView:e=>e||null}})],p.prototype,`title`,void 0),a.t([t.m],p.prototype,`connotation`,void 0),a.t([t.m],p.prototype,`shape`,void 0),a.t([t.m],p.prototype,`appearance`,void 0),a.t([t.m],p.prototype,`size`,void 0),a.t([t.m({mode:`boolean`,attribute:`stacked`})],p.prototype,`stacked`,void 0),a.t([t.m({mode:`boolean`,attribute:`pending`})],p.prototype,`pending`,void 0),a.t([t.m({mode:`boolean`,attribute:`dropdown-indicator`})],p.prototype,`dropdownIndicator`,void 0),a.t([t.m({mode:`boolean`,attribute:`active`})],p.prototype,`active`,void 0),a.t([t.m({mode:`boolean`,attribute:`pressed`})],p.prototype,`pressed`,void 0),a.t([t.m],p.prototype,`label`,void 0);var m=`.chevron{font:var(--vvd-typography-base-extended);flex-shrink:0;display:flex;transform:rotate(0)}@media (prefers-reduced-motion:no-preference){.chevron{transition:transform .2s}}:host([data-expanded=true]) .chevron,:host([open]) .chevron{transform:rotate(180deg)}:host{--_vvd-button-accent-firm-wrapper:var(--vvd-button-accent-firm);--_vvd-button-cta-firm-wrapper:var(--vvd-button-cta-firm);--_vvd-button-success-firm-wrapper:var(--vvd-button-success-firm);--_vvd-button-alert-firm-wrapper:var(--vvd-button-alert-firm);--_vvd-button-announcement-firm-wrapper:var(--vvd-button-announcement-firm)}.control:not(.appearance-ghost-light,.appearance-filled,.appearance-outlined){--vvd-button-accent-firm:var(--_vvd-button-accent-firm-wrapper,var(--vvd-button-accent-primary));--vvd-button-cta-firm:var(--_vvd-button-cta-firm-wrapper,var(--vvd-button-cta-primary));--vvd-button-success-firm:var(--_vvd-button-success-firm-wrapper,var(--vvd-button-success-primary));--vvd-button-alert-firm:var(--_vvd-button-alert-firm-wrapper,var(--vvd-button-alert-primary));--vvd-button-announcement-firm:var(--_vvd-button-announcement-firm-wrapper,var(--vvd-button-announcement-primary))}:host{display:inline-block}.control.connotation-cta{--_connotation-color-primary:var(--vvd-button-cta-primary,var(--vvd-color-cta-500));--_connotation-color-primary-text:var(--vvd-button-cta-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-button-cta-primary-increment,var(--vvd-color-cta-600));--_connotation-color-contrast:var(--vvd-button-cta-contrast,var(--vvd-color-cta-800));--_connotation-color-fierce:var(--vvd-button-cta-fierce,var(--vvd-color-cta-700));--_connotation-color-firm:var(--vvd-button-cta-firm,var(--vvd-color-cta-600));--_connotation-color-soft:var(--vvd-button-cta-soft,var(--vvd-color-cta-100));--_connotation-color-faint:var(--vvd-button-cta-faint,var(--vvd-color-cta-50));--_connotation-color-fierce-primary:var(--vvd-button-cta-fierce-primary,var(--vvd-color-cta-700));--_connotation-color-dim:var(--vvd-button-cta-dim,var(--vvd-color-cta-200));--_connotation-color-pale:var(--vvd-button-cta-pale,var(--vvd-color-cta-300))}.control.connotation-success{--_connotation-color-primary:var(--vvd-button-success-primary,var(--vvd-color-success-500));--_connotation-color-primary-text:var(--vvd-button-success-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-button-success-primary-increment,var(--vvd-color-success-600));--_connotation-color-contrast:var(--vvd-button-success-contrast,var(--vvd-color-success-800));--_connotation-color-fierce:var(--vvd-button-success-fierce,var(--vvd-color-success-700));--_connotation-color-firm:var(--vvd-button-success-firm,var(--vvd-color-success-600));--_connotation-color-soft:var(--vvd-button-success-soft,var(--vvd-color-success-100));--_connotation-color-faint:var(--vvd-button-success-faint,var(--vvd-color-success-50));--_connotation-color-fierce-primary:var(--vvd-button-success-fierce-primary,var(--vvd-color-success-700));--_connotation-color-dim:var(--vvd-button-success-dim,var(--vvd-color-success-200));--_connotation-color-pale:var(--vvd-button-success-pale,var(--vvd-color-success-300))}.control.connotation-alert{--_connotation-color-primary:var(--vvd-button-alert-primary,var(--vvd-color-alert-500));--_connotation-color-primary-text:var(--vvd-button-alert-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-button-alert-primary-increment,var(--vvd-color-alert-600));--_connotation-color-contrast:var(--vvd-button-alert-contrast,var(--vvd-color-alert-800));--_connotation-color-fierce:var(--vvd-button-alert-fierce,var(--vvd-color-alert-700));--_connotation-color-firm:var(--vvd-button-alert-firm,var(--vvd-color-alert-600));--_connotation-color-soft:var(--vvd-button-alert-soft,var(--vvd-color-alert-100));--_connotation-color-faint:var(--vvd-button-alert-faint,var(--vvd-color-alert-50));--_connotation-color-fierce-primary:var(--vvd-button-alert-fierce-primary,var(--vvd-color-alert-700));--_connotation-color-dim:var(--vvd-button-alert-dim,var(--vvd-color-alert-200));--_connotation-color-pale:var(--vvd-button-alert-pale,var(--vvd-color-alert-300))}.control.connotation-announcement{--_connotation-color-primary:var(--vvd-button-announcement-primary,var(--vvd-color-announcement-500));--_connotation-color-primary-text:var(--vvd-button-announcement-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-button-announcement-primary-increment,var(--vvd-color-announcement-600));--_connotation-color-contrast:var(--vvd-button-announcement-contrast,var(--vvd-color-announcement-800));--_connotation-color-fierce:var(--vvd-button-announcement-fierce,var(--vvd-color-announcement-700));--_connotation-color-firm:var(--vvd-button-announcement-firm,var(--vvd-color-announcement-600));--_connotation-color-soft:var(--vvd-button-announcement-soft,var(--vvd-color-announcement-100));--_connotation-color-faint:var(--vvd-button-announcement-faint,var(--vvd-color-announcement-50));--_connotation-color-fierce-primary:var(--vvd-button-announcement-fierce-primary,var(--vvd-color-announcement-700));--_connotation-color-dim:var(--vvd-button-announcement-dim,var(--vvd-color-announcement-200));--_connotation-color-pale:var(--vvd-button-announcement-pale,var(--vvd-color-announcement-300))}.control:not(.connotation-cta,.connotation-success,.connotation-alert,.connotation-announcement){--_connotation-color-primary:var(--vvd-button-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-button-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-button-accent-primary-increment,var(--vvd-color-neutral-800));--_connotation-color-contrast:var(--vvd-button-accent-contrast,var(--vvd-color-neutral-800));--_connotation-color-fierce:var(--vvd-button-accent-fierce,var(--vvd-color-neutral-700));--_connotation-color-firm:var(--vvd-button-accent-firm,var(--vvd-color-canvas-text));--_connotation-color-soft:var(--vvd-button-accent-soft,var(--vvd-color-neutral-100));--_connotation-color-faint:var(--vvd-button-accent-faint,var(--vvd-color-neutral-50));--_connotation-color-fierce-primary:var(--vvd-button-accent-fierce-primary,var(--vvd-color-canvas-text));--_connotation-color-dim:var(--vvd-button-accent-dim,var(--vvd-color-neutral-200));--_connotation-color-pale:var(--vvd-button-accent-pale,var(--vvd-color-neutral-300))}.control.appearance-filled{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary);--_appearance-color-outline:transparent}.control.appearance-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control,.control.appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.control.appearance-outlined-light{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.control.appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 85%);--_appearance-color-outline:transparent}@media (hover:hover){.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-filled{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary-increment);--_appearance-color-outline:transparent}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 90%);--_appearance-color-outline:transparent}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-outlined-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 90%);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-dim);--_appearance-color-outline:transparent}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 75%);--_appearance-color-outline:transparent}}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-filled{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary-increment);--_appearance-color-outline:transparent}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 90%);--_appearance-color-outline:transparent}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-outlined-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 90%);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-dim);--_appearance-color-outline:transparent}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 75%);--_appearance-color-outline:transparent}.control:disabled.appearance-filled{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:transparent}.control:disabled.appearance-outlined{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:disabled,.control:disabled.appearance-ghost-light{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.control:disabled.appearance-outlined-light{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:disabled.appearance-subtle,.control:disabled.appearance-subtle-light,.control.disabled.appearance-filled{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:transparent}.control.disabled.appearance-outlined{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.disabled,.control.disabled.appearance-ghost-light{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.control.disabled.appearance-outlined-light{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.disabled.appearance-subtle,.control.disabled.appearance-subtle-light{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)).appearance-filled{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-fierce);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)).appearance-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 80%);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)).appearance-outlined-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 80%);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:active:where(:not(.disabled,:disabled)).appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-pale);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)).appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 65%);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-filled{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-fierce);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 80%);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-outlined-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 80%);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.active:where(:not(.disabled,:disabled)).appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-pale);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 65%);--_appearance-color-outline:transparent}.control{--focus-stroke-gap-color:transparent;box-sizing:border-box;border-radius:var(--_button-border-radius);background-color:var(--_appearance-color-fill);block-size:var(--_button-block-size);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);color:var(--_appearance-color-text);justify-content:space-between;align-items:center;gap:var(--_button-icon-gap);vertical-align:middle;border:0;margin:0;text-decoration:none;display:inline-flex}.control .text{-webkit-line-clamp:var(--button-line-clamp,1);text-align:start;-webkit-box-orient:vertical;max-inline-size:100%;display:-webkit-box;overflow:hidden}.control:not(.icon-only){inline-size:100%}.control:not(.disabled){cursor:var(--button-cursor,pointer)}.control.disabled{cursor:not-allowed}.control{user-select:none}.control:not(.stacked).size-super-condensed{--_button-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16));font:var(--vvd-typography-base-condensed-bold);--_button-icon-gap:4px;--_button-chevron-size:10px}.control:not(.stacked).size-super-condensed.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control:not(.stacked).size-super-condensed:not(.icon-only){padding-inline:8px}.control:not(.stacked).size-condensed{--_button-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8));font:var(--vvd-typography-base-condensed-bold);--_button-icon-gap:8px;--_button-chevron-size:12px}.control:not(.stacked).size-condensed.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control:not(.stacked).size-condensed:not(.icon-only){padding-inline:12px}.control:not(.stacked).size-expanded{--_button-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 8));font:var(--vvd-typography-base-extended-bold);--_button-icon-gap:10px;--_button-chevron-size:16px}.control:not(.stacked).size-expanded.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control:not(.stacked).size-expanded:not(.icon-only){padding-inline:20px}.control:not(.stacked):not(.size-condensed,.size-expanded,.size-super-condensed){--_button-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)));font:var(--vvd-typography-base-bold);--_button-icon-gap:8px;--_button-chevron-size:16px}.control:not(.stacked):not(.size-condensed,.size-expanded,.size-super-condensed).icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control:not(.stacked):not(.size-condensed,.size-expanded,.size-super-condensed):not(.icon-only){padding-inline:16px}.control:not(.shape-pill){--_button-border-radius:8px}.control:not(.shape-pill).size-condensed:not(.stacked),.control:not(.shape-pill).size-super-condensed:not(.stacked){--_button-border-radius:4px}.control.shape-pill:not(.icon-only,.stacked.size-super-condensed,.stacked.size-condensed,.stacked.normal){--_button-border-radius:24px}.control.shape-pill.stacked.size-condensed,.control.shape-pill.stacked.size-super-condensed{--_button-border-radius:16px}.control.shape-pill.stacked.size-normal{--_button-border-radius:20px}.control.shape-pill.icon-only{--_button-border-radius:50%}.control.stacked.size-super-condensed{--stacked-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16));--_button-block-size:calc(var(--stacked-size) + 20px);font:var(--vvd-typography-base-condensed-bold);--_button-icon-gap:4px;--_button-chevron-size:10px}.control.stacked.size-super-condensed.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control.stacked.size-super-condensed:not(.icon-only){padding-inline:16px}.control.stacked.size-condensed{--stacked-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8));--_button-block-size:calc(var(--stacked-size) + 24px);font:var(--vvd-typography-base-condensed-bold);--_button-icon-gap:6px;--_button-chevron-size:12px}.control.stacked.size-condensed.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control.stacked.size-condensed:not(.icon-only){padding-inline:12px}.control.stacked.size-expanded{--stacked-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 8));--_button-block-size:calc(var(--stacked-size) + 32px);font:var(--vvd-typography-base-extended-bold);--_button-icon-gap:10px;--_button-chevron-size:16px}.control.stacked.size-expanded.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control.stacked.size-expanded:not(.icon-only){padding-inline:20px}.control.stacked:not(.size-condensed,.size-expanded,.size-super-condensed){--stacked-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)));--_button-block-size:calc(var(--stacked-size) + 28px);font:var(--vvd-typography-base-bold);--_button-icon-gap:8px;--_button-chevron-size:16px}.control.stacked:not(.size-condensed,.size-expanded,.size-super-condensed).icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control.stacked:not(.size-condensed,.size-expanded,.size-super-condensed):not(.icon-only){padding-inline:16px}.control.appearance-filled{--focus-stroke-gap-color:transparent}.control.appearance-filled:focus-visible{outline:none;position:relative}.control.appearance-filled:focus-visible:after{box-shadow:0 0 0 4px color-mix(in sRGB, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px));border-radius:var(--focus-border-radius,inherit);block-size:calc(100% + var(--focus-block-size-addition,4px));content:"";inline-size:calc(100% + var(--focus-block-size-addition,4px));display:block;position:absolute;inset-block-start:50%;inset-inline-start:50%;transform:translate(-50%,-50%)}.control:not(.appearance-filled):focus-visible{box-shadow:0 0 0 4px color-mix(in sRGB, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px))}slot[name=icon]{line-height:1}.icon-trailing slot[name=icon]{order:1;display:flex}.control.stacked slot[name=icon]{font-size:calc(var(--stacked-size) / 2)}.control:not(.stacked) slot[name=icon]{font-size:calc(var(--_button-block-size) / 2)}.chevron{font-size:var(--_button-chevron-size)}.content{justify-content:center;align-items:center;gap:var(--_button-icon-gap);flex:1;display:flex;overflow:hidden}.control.stacked .content{flex-direction:column}:host([dropdown-indicator]) .content{justify-content:var(--button-content-alignment,flex-start);text-align:start}:host([dropdown-indicator][stacked]) .content{align-items:var(--button-content-alignment,flex-start);justify-content:center}.pending-no-icon{position:absolute}.pending-no-icon+.text{visibility:hidden}:host([icon-trailing][pending]) .pending{order:1}.sr-only{clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}`,h=e=>{let n=e.tagFor(s.r);return t.p`<${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 _=e=>o.t(`control`,[`connotation-${e.connotation}`,!!e.connotation],`appearance-${g(e.appearance,e.pressed)}`,[`disabled`,e.disabled||e.pending],[`shape-${e.shape}`,!!e.shape],[`size-${e.size}`,!!e.size],[`icon-only`,!e.label&&!!(e.icon||e.iconSlottedContent?.length)&&!e.dropdownIndicator],[`icon-trailing`,e.iconTrailing],[`stacked`,e.stacked],[`active`,e.ariaExpanded===`true`||e.active]);function v(e,n,r,a=i.a.Normal){if(r&&a!=i.a.SuperCondensed){let r=e.tagFor(l.r),s={[i.a.Condensed]:`-6`,[i.a.Normal]:`-5`,[i.a.Expanded]:`-4`};return t.p`<span class="${e=>{let t=e.querySelector(`[slot="icon"]`);return o.t(`icon`,`pending`,[`pending-no-icon`,!(n||t)])}}" aria-hidden="true"><${r} size="${s[a]}"></${r}></span>`}else return c.a(e)(n,c.i.Slot)}var y=e=>[`submit`,`button`,`reset`].indexOf(e)>-1?e:`submit`,b=e=>{let n=h(e);return t.p`<span class="content">
|
|
2
|
-
${t=>
|
|
1
|
+
const e=require(`./localized.cjs`),t=require(`./vivid-element.cjs`),n=require(`./ref.cjs`),r=require(`./when.cjs`),i=require(`./enums.cjs`),a=require(`./decorate.cjs`),o=require(`./class-names.cjs`),s=require(`./definition3.cjs`),c=require(`./icon.cjs`),l=require(`./affix.cjs`),u=require(`./definition5.cjs`),d=require(`./delegates-aria.cjs`),f=require(`./button.cjs`),p=require(`./linkable.cjs`);var m=class extends l.n(e.t(p.t(f.t))){constructor(){super(),this.stacked=!1,this.pending=!1,this.dropdownIndicator=!1,this.active=!1,this.pressed=!1,this.title=``}clickHandler(e){if(this.disabled||this.pending){e.preventDefault(),e.stopImmediatePropagation();return}return!0}};a.t([t.m({converter:{fromView:e=>e||null,toView:e=>e||null}})],m.prototype,`title`,void 0),a.t([t.m],m.prototype,`connotation`,void 0),a.t([t.m],m.prototype,`shape`,void 0),a.t([t.m],m.prototype,`appearance`,void 0),a.t([t.m],m.prototype,`size`,void 0),a.t([t.m({mode:`boolean`,attribute:`stacked`})],m.prototype,`stacked`,void 0),a.t([t.m({mode:`boolean`,attribute:`pending`})],m.prototype,`pending`,void 0),a.t([t.m({mode:`boolean`,attribute:`dropdown-indicator`})],m.prototype,`dropdownIndicator`,void 0),a.t([t.m({mode:`boolean`,attribute:`active`})],m.prototype,`active`,void 0),a.t([t.m({mode:`boolean`,attribute:`pressed`})],m.prototype,`pressed`,void 0),a.t([t.m],m.prototype,`label`,void 0);var h=`.chevron{font:var(--vvd-typography-base-extended);flex-shrink:0;display:flex;transform:rotate(0)}@media (prefers-reduced-motion:no-preference){.chevron{transition:transform .2s}}:host([data-expanded=true]) .chevron,:host([open]) .chevron{transform:rotate(180deg)}:host{--_vvd-button-accent-firm-wrapper:var(--vvd-button-accent-firm);--_vvd-button-cta-firm-wrapper:var(--vvd-button-cta-firm);--_vvd-button-success-firm-wrapper:var(--vvd-button-success-firm);--_vvd-button-alert-firm-wrapper:var(--vvd-button-alert-firm);--_vvd-button-announcement-firm-wrapper:var(--vvd-button-announcement-firm)}.control:not(.appearance-ghost-light,.appearance-filled,.appearance-outlined){--vvd-button-accent-firm:var(--_vvd-button-accent-firm-wrapper,var(--vvd-button-accent-primary));--vvd-button-cta-firm:var(--_vvd-button-cta-firm-wrapper,var(--vvd-button-cta-primary));--vvd-button-success-firm:var(--_vvd-button-success-firm-wrapper,var(--vvd-button-success-primary));--vvd-button-alert-firm:var(--_vvd-button-alert-firm-wrapper,var(--vvd-button-alert-primary));--vvd-button-announcement-firm:var(--_vvd-button-announcement-firm-wrapper,var(--vvd-button-announcement-primary))}:host{display:inline-block}.control.connotation-cta{--_connotation-color-primary:var(--vvd-button-cta-primary,var(--vvd-color-cta-500));--_connotation-color-primary-text:var(--vvd-button-cta-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-button-cta-primary-increment,var(--vvd-color-cta-600));--_connotation-color-contrast:var(--vvd-button-cta-contrast,var(--vvd-color-cta-800));--_connotation-color-fierce:var(--vvd-button-cta-fierce,var(--vvd-color-cta-700));--_connotation-color-firm:var(--vvd-button-cta-firm,var(--vvd-color-cta-600));--_connotation-color-soft:var(--vvd-button-cta-soft,var(--vvd-color-cta-100));--_connotation-color-faint:var(--vvd-button-cta-faint,var(--vvd-color-cta-50));--_connotation-color-fierce-primary:var(--vvd-button-cta-fierce-primary,var(--vvd-color-cta-700));--_connotation-color-dim:var(--vvd-button-cta-dim,var(--vvd-color-cta-200));--_connotation-color-pale:var(--vvd-button-cta-pale,var(--vvd-color-cta-300))}.control.connotation-success{--_connotation-color-primary:var(--vvd-button-success-primary,var(--vvd-color-success-500));--_connotation-color-primary-text:var(--vvd-button-success-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-button-success-primary-increment,var(--vvd-color-success-600));--_connotation-color-contrast:var(--vvd-button-success-contrast,var(--vvd-color-success-800));--_connotation-color-fierce:var(--vvd-button-success-fierce,var(--vvd-color-success-700));--_connotation-color-firm:var(--vvd-button-success-firm,var(--vvd-color-success-600));--_connotation-color-soft:var(--vvd-button-success-soft,var(--vvd-color-success-100));--_connotation-color-faint:var(--vvd-button-success-faint,var(--vvd-color-success-50));--_connotation-color-fierce-primary:var(--vvd-button-success-fierce-primary,var(--vvd-color-success-700));--_connotation-color-dim:var(--vvd-button-success-dim,var(--vvd-color-success-200));--_connotation-color-pale:var(--vvd-button-success-pale,var(--vvd-color-success-300))}.control.connotation-alert{--_connotation-color-primary:var(--vvd-button-alert-primary,var(--vvd-color-alert-500));--_connotation-color-primary-text:var(--vvd-button-alert-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-button-alert-primary-increment,var(--vvd-color-alert-600));--_connotation-color-contrast:var(--vvd-button-alert-contrast,var(--vvd-color-alert-800));--_connotation-color-fierce:var(--vvd-button-alert-fierce,var(--vvd-color-alert-700));--_connotation-color-firm:var(--vvd-button-alert-firm,var(--vvd-color-alert-600));--_connotation-color-soft:var(--vvd-button-alert-soft,var(--vvd-color-alert-100));--_connotation-color-faint:var(--vvd-button-alert-faint,var(--vvd-color-alert-50));--_connotation-color-fierce-primary:var(--vvd-button-alert-fierce-primary,var(--vvd-color-alert-700));--_connotation-color-dim:var(--vvd-button-alert-dim,var(--vvd-color-alert-200));--_connotation-color-pale:var(--vvd-button-alert-pale,var(--vvd-color-alert-300))}.control.connotation-announcement{--_connotation-color-primary:var(--vvd-button-announcement-primary,var(--vvd-color-announcement-500));--_connotation-color-primary-text:var(--vvd-button-announcement-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-button-announcement-primary-increment,var(--vvd-color-announcement-600));--_connotation-color-contrast:var(--vvd-button-announcement-contrast,var(--vvd-color-announcement-800));--_connotation-color-fierce:var(--vvd-button-announcement-fierce,var(--vvd-color-announcement-700));--_connotation-color-firm:var(--vvd-button-announcement-firm,var(--vvd-color-announcement-600));--_connotation-color-soft:var(--vvd-button-announcement-soft,var(--vvd-color-announcement-100));--_connotation-color-faint:var(--vvd-button-announcement-faint,var(--vvd-color-announcement-50));--_connotation-color-fierce-primary:var(--vvd-button-announcement-fierce-primary,var(--vvd-color-announcement-700));--_connotation-color-dim:var(--vvd-button-announcement-dim,var(--vvd-color-announcement-200));--_connotation-color-pale:var(--vvd-button-announcement-pale,var(--vvd-color-announcement-300))}.control:not(.connotation-cta,.connotation-success,.connotation-alert,.connotation-announcement){--_connotation-color-primary:var(--vvd-button-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-button-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-button-accent-primary-increment,var(--vvd-color-neutral-800));--_connotation-color-contrast:var(--vvd-button-accent-contrast,var(--vvd-color-neutral-800));--_connotation-color-fierce:var(--vvd-button-accent-fierce,var(--vvd-color-neutral-700));--_connotation-color-firm:var(--vvd-button-accent-firm,var(--vvd-color-canvas-text));--_connotation-color-soft:var(--vvd-button-accent-soft,var(--vvd-color-neutral-100));--_connotation-color-faint:var(--vvd-button-accent-faint,var(--vvd-color-neutral-50));--_connotation-color-fierce-primary:var(--vvd-button-accent-fierce-primary,var(--vvd-color-canvas-text));--_connotation-color-dim:var(--vvd-button-accent-dim,var(--vvd-color-neutral-200));--_connotation-color-pale:var(--vvd-button-accent-pale,var(--vvd-color-neutral-300))}.control.appearance-filled{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary);--_appearance-color-outline:transparent}.control.appearance-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control,.control.appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.control.appearance-outlined-light{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.control.appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 85%);--_appearance-color-outline:transparent}@media (hover:hover){.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-filled{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary-increment);--_appearance-color-outline:transparent}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 90%);--_appearance-color-outline:transparent}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-outlined-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 90%);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-dim);--_appearance-color-outline:transparent}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 75%);--_appearance-color-outline:transparent}}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-filled{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary-increment);--_appearance-color-outline:transparent}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 90%);--_appearance-color-outline:transparent}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-outlined-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 90%);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-dim);--_appearance-color-outline:transparent}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 75%);--_appearance-color-outline:transparent}.control:disabled.appearance-filled{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:transparent}.control:disabled.appearance-outlined{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:disabled,.control:disabled.appearance-ghost-light{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.control:disabled.appearance-outlined-light{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:disabled.appearance-subtle,.control:disabled.appearance-subtle-light,.control.disabled.appearance-filled{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:transparent}.control.disabled.appearance-outlined{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.disabled,.control.disabled.appearance-ghost-light{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.control.disabled.appearance-outlined-light{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.disabled.appearance-subtle,.control.disabled.appearance-subtle-light{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)).appearance-filled{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-fierce);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)).appearance-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 80%);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)).appearance-outlined-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 80%);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:active:where(:not(.disabled,:disabled)).appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-pale);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)).appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 65%);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-filled{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-fierce);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 80%);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-outlined-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 80%);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.active:where(:not(.disabled,:disabled)).appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-pale);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 65%);--_appearance-color-outline:transparent}.control{--focus-stroke-gap-color:transparent;box-sizing:border-box;border-radius:var(--_button-border-radius);background-color:var(--_appearance-color-fill);block-size:var(--_button-block-size);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);color:var(--_appearance-color-text);justify-content:space-between;align-items:center;gap:var(--_button-icon-gap);vertical-align:middle;border:0;margin:0;text-decoration:none;display:inline-flex}.control .text{-webkit-line-clamp:var(--button-line-clamp,1);text-align:start;-webkit-box-orient:vertical;max-inline-size:100%;display:-webkit-box;overflow:hidden}.control:not(.icon-only){inline-size:100%}.control:not(.disabled){cursor:var(--button-cursor,pointer)}.control.disabled{cursor:not-allowed}.control{user-select:none}.control:not(.stacked).size-super-condensed{--_button-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16));font:var(--vvd-typography-base-condensed-bold);--_button-icon-gap:4px;--_button-chevron-size:10px}.control:not(.stacked).size-super-condensed.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control:not(.stacked).size-super-condensed:not(.icon-only){padding-inline:8px}.control:not(.stacked).size-condensed{--_button-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8));font:var(--vvd-typography-base-condensed-bold);--_button-icon-gap:8px;--_button-chevron-size:12px}.control:not(.stacked).size-condensed.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control:not(.stacked).size-condensed:not(.icon-only){padding-inline:12px}.control:not(.stacked).size-expanded{--_button-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 8));font:var(--vvd-typography-base-extended-bold);--_button-icon-gap:10px;--_button-chevron-size:16px}.control:not(.stacked).size-expanded.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control:not(.stacked).size-expanded:not(.icon-only){padding-inline:20px}.control:not(.stacked):not(.size-condensed,.size-expanded,.size-super-condensed){--_button-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)));font:var(--vvd-typography-base-bold);--_button-icon-gap:8px;--_button-chevron-size:16px}.control:not(.stacked):not(.size-condensed,.size-expanded,.size-super-condensed).icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control:not(.stacked):not(.size-condensed,.size-expanded,.size-super-condensed):not(.icon-only){padding-inline:16px}.control:not(.shape-pill){--_button-border-radius:8px}.control:not(.shape-pill).size-condensed:not(.stacked),.control:not(.shape-pill).size-super-condensed:not(.stacked){--_button-border-radius:4px}.control.shape-pill:not(.icon-only,.stacked.size-super-condensed,.stacked.size-condensed,.stacked.normal){--_button-border-radius:24px}.control.shape-pill.stacked.size-condensed,.control.shape-pill.stacked.size-super-condensed{--_button-border-radius:16px}.control.shape-pill.stacked.size-normal{--_button-border-radius:20px}.control.shape-pill.icon-only{--_button-border-radius:50%}.control.stacked.size-super-condensed{--stacked-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16));--_button-block-size:calc(var(--stacked-size) + 20px);font:var(--vvd-typography-base-condensed-bold);--_button-icon-gap:4px;--_button-chevron-size:10px}.control.stacked.size-super-condensed.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control.stacked.size-super-condensed:not(.icon-only){padding-inline:16px}.control.stacked.size-condensed{--stacked-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8));--_button-block-size:calc(var(--stacked-size) + 24px);font:var(--vvd-typography-base-condensed-bold);--_button-icon-gap:6px;--_button-chevron-size:12px}.control.stacked.size-condensed.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control.stacked.size-condensed:not(.icon-only){padding-inline:12px}.control.stacked.size-expanded{--stacked-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 8));--_button-block-size:calc(var(--stacked-size) + 32px);font:var(--vvd-typography-base-extended-bold);--_button-icon-gap:10px;--_button-chevron-size:16px}.control.stacked.size-expanded.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control.stacked.size-expanded:not(.icon-only){padding-inline:20px}.control.stacked:not(.size-condensed,.size-expanded,.size-super-condensed){--stacked-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)));--_button-block-size:calc(var(--stacked-size) + 28px);font:var(--vvd-typography-base-bold);--_button-icon-gap:8px;--_button-chevron-size:16px}.control.stacked:not(.size-condensed,.size-expanded,.size-super-condensed).icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control.stacked:not(.size-condensed,.size-expanded,.size-super-condensed):not(.icon-only){padding-inline:16px}.control.appearance-filled{--focus-stroke-gap-color:transparent}.control.appearance-filled:focus-visible{outline:none;position:relative}.control.appearance-filled:focus-visible:after{box-shadow:0 0 0 4px color-mix(in sRGB, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px));border-radius:var(--focus-border-radius,inherit);block-size:calc(100% + var(--focus-block-size-addition,4px));content:"";inline-size:calc(100% + var(--focus-block-size-addition,4px));display:block;position:absolute;inset-block-start:50%;inset-inline-start:50%;transform:translate(-50%,-50%)}.control:not(.appearance-filled):focus-visible{box-shadow:0 0 0 4px color-mix(in sRGB, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px))}slot[name=icon]{line-height:1}.icon-trailing slot[name=icon]{order:1;display:flex}.control.stacked slot[name=icon]{font-size:calc(var(--stacked-size) / 2)}.control:not(.stacked) slot[name=icon]{font-size:calc(var(--_button-block-size) / 2)}.chevron{font-size:var(--_button-chevron-size)}.content{justify-content:center;align-items:center;gap:var(--_button-icon-gap);flex:1;display:flex;overflow:hidden}.control.stacked .content{flex-direction:column}:host([dropdown-indicator]) .content{justify-content:var(--button-content-alignment,flex-start);text-align:start}:host([dropdown-indicator][stacked]) .content{align-items:var(--button-content-alignment,flex-start);justify-content:center}.pending-no-icon{position:absolute}.pending-no-icon+.text{visibility:hidden}:host([icon-trailing][pending]) .pending{order:1}.sr-only{clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}`,g=e=>{let n=e.tagFor(c.t);return t.p`<${n} class="chevron" aria-hidden="true" name="chevron-down-line"></${n}>`};function _(e,t){let n=e??`ghost`;if(t){if(n===`ghost`)return`subtle`;if(n===`ghost-light`)return`subtle-light`;if(n===`outlined`)return`filled`}return n}var v=e=>o.t(`control`,[`connotation-${e.connotation}`,!!e.connotation],`appearance-${_(e.appearance,e.pressed)}`,[`disabled`,e.disabled||e.pending],[`shape-${e.shape}`,!!e.shape],[`size-${e.size}`,!!e.size],[`icon-only`,!e.label&&!!(e.icon||e.iconSlottedContent?.length)&&!e.dropdownIndicator],[`icon-trailing`,e.iconTrailing],[`stacked`,e.stacked],[`active`,e.ariaExpanded===`true`||e.active]);function y(e,n,r,a=i.a.Normal){if(r&&a!=i.a.SuperCondensed){let r=e.tagFor(u.r),s={[i.a.Condensed]:`-6`,[i.a.Normal]:`-5`,[i.a.Expanded]:`-4`};return t.p`<span class="${e=>{let t=e.querySelector(`[slot="icon"]`);return o.t(`icon`,`pending`,[`pending-no-icon`,!(n||t)])}}" aria-hidden="true"><${r} size="${s[a]}"></${r}></span>`}else return l.a(e)(n,l.i.Slot)}var b=e=>[`submit`,`button`,`reset`].indexOf(e)>-1?e:`submit`,x=e=>{let n=g(e);return t.p`<span class="content">
|
|
2
|
+
${t=>y(e,t.icon,t.pending,t.size)}
|
|
3
3
|
${r.t(e=>e.label,t.p`<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
|
|
9
|
-
class="${
|
|
8
|
+
${r.t(e=>e.dropdownIndicator,n)}`};function S(e){return t.p` <button
|
|
9
|
+
class="${v}"
|
|
10
10
|
?autofocus="${e=>e.autofocus}"
|
|
11
11
|
form="${e=>e.formId}"
|
|
12
12
|
formaction="${e=>e.formaction}"
|
|
@@ -15,15 +15,15 @@ const e=require(`./localized.cjs`),t=require(`./vivid-element.cjs`),n=require(`.
|
|
|
15
15
|
formnovalidate="${e=>e.formnovalidate}"
|
|
16
16
|
formtarget="${e=>e.formtarget}"
|
|
17
17
|
name="${e=>e.name}"
|
|
18
|
-
type="${e=>
|
|
18
|
+
type="${e=>b(e.type)}"
|
|
19
19
|
value="${e=>e.value}"
|
|
20
20
|
title="${e=>e.title}"
|
|
21
|
-
${
|
|
21
|
+
${d.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
|
-
${
|
|
26
|
-
</button>`}function
|
|
27
|
-
${r.t(e=>!e.href,t.p`${
|
|
28
|
-
${r.t(e=>e.href,
|
|
29
|
-
</template>`,[s.t,
|
|
25
|
+
${x(e)}
|
|
26
|
+
</button>`}function C(e){return t.p`${t=>t._renderLinkElement(x(e),v,{ariaLabel:null})}`}var w=t.u(`button`,m,e=>t.p` <template>
|
|
27
|
+
${r.t(e=>!e.href,t.p`${S(e)}`)}
|
|
28
|
+
${r.t(e=>e.href,C(e))}
|
|
29
|
+
</template>`,[s.t,u.t],{styles:h,shadowOptions:{delegatesFocus:!0}}),T=t.d(w);Object.defineProperty(exports,`i`,{enumerable:!0,get:function(){return m}}),Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return T}}),Object.defineProperty(exports,`r`,{enumerable:!0,get:function(){return g}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return w}});
|
package/bundled/definition6.js
CHANGED
|
@@ -5,7 +5,8 @@ import { t as o } from "./when.js";
|
|
|
5
5
|
import { a as s } from "./enums.js";
|
|
6
6
|
import { t as c } from "./decorate.js";
|
|
7
7
|
import { t as l } from "./class-names.js";
|
|
8
|
-
import {
|
|
8
|
+
import { t as u } from "./definition3.js";
|
|
9
|
+
import { t as d } from "./icon.js";
|
|
9
10
|
import { a as f, i as p, n as m } from "./affix.js";
|
|
10
11
|
import { r as h, t as g } from "./definition5.js";
|
|
11
12
|
import { n as _ } from "./delegates-aria.js";
|
|
@@ -47,7 +48,7 @@ c([n({ converter: {
|
|
|
47
48
|
//#endregion
|
|
48
49
|
//#region src/lib/button/button.scss?inline
|
|
49
50
|
var x = ".chevron{font:var(--vvd-typography-base-extended);flex-shrink:0;display:flex;transform:rotate(0)}@media (prefers-reduced-motion:no-preference){.chevron{transition:transform .2s}}:host([data-expanded=true]) .chevron,:host([open]) .chevron{transform:rotate(180deg)}:host{--_vvd-button-accent-firm-wrapper:var(--vvd-button-accent-firm);--_vvd-button-cta-firm-wrapper:var(--vvd-button-cta-firm);--_vvd-button-success-firm-wrapper:var(--vvd-button-success-firm);--_vvd-button-alert-firm-wrapper:var(--vvd-button-alert-firm);--_vvd-button-announcement-firm-wrapper:var(--vvd-button-announcement-firm)}.control:not(.appearance-ghost-light,.appearance-filled,.appearance-outlined){--vvd-button-accent-firm:var(--_vvd-button-accent-firm-wrapper,var(--vvd-button-accent-primary));--vvd-button-cta-firm:var(--_vvd-button-cta-firm-wrapper,var(--vvd-button-cta-primary));--vvd-button-success-firm:var(--_vvd-button-success-firm-wrapper,var(--vvd-button-success-primary));--vvd-button-alert-firm:var(--_vvd-button-alert-firm-wrapper,var(--vvd-button-alert-primary));--vvd-button-announcement-firm:var(--_vvd-button-announcement-firm-wrapper,var(--vvd-button-announcement-primary))}:host{display:inline-block}.control.connotation-cta{--_connotation-color-primary:var(--vvd-button-cta-primary,var(--vvd-color-cta-500));--_connotation-color-primary-text:var(--vvd-button-cta-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-button-cta-primary-increment,var(--vvd-color-cta-600));--_connotation-color-contrast:var(--vvd-button-cta-contrast,var(--vvd-color-cta-800));--_connotation-color-fierce:var(--vvd-button-cta-fierce,var(--vvd-color-cta-700));--_connotation-color-firm:var(--vvd-button-cta-firm,var(--vvd-color-cta-600));--_connotation-color-soft:var(--vvd-button-cta-soft,var(--vvd-color-cta-100));--_connotation-color-faint:var(--vvd-button-cta-faint,var(--vvd-color-cta-50));--_connotation-color-fierce-primary:var(--vvd-button-cta-fierce-primary,var(--vvd-color-cta-700));--_connotation-color-dim:var(--vvd-button-cta-dim,var(--vvd-color-cta-200));--_connotation-color-pale:var(--vvd-button-cta-pale,var(--vvd-color-cta-300))}.control.connotation-success{--_connotation-color-primary:var(--vvd-button-success-primary,var(--vvd-color-success-500));--_connotation-color-primary-text:var(--vvd-button-success-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-button-success-primary-increment,var(--vvd-color-success-600));--_connotation-color-contrast:var(--vvd-button-success-contrast,var(--vvd-color-success-800));--_connotation-color-fierce:var(--vvd-button-success-fierce,var(--vvd-color-success-700));--_connotation-color-firm:var(--vvd-button-success-firm,var(--vvd-color-success-600));--_connotation-color-soft:var(--vvd-button-success-soft,var(--vvd-color-success-100));--_connotation-color-faint:var(--vvd-button-success-faint,var(--vvd-color-success-50));--_connotation-color-fierce-primary:var(--vvd-button-success-fierce-primary,var(--vvd-color-success-700));--_connotation-color-dim:var(--vvd-button-success-dim,var(--vvd-color-success-200));--_connotation-color-pale:var(--vvd-button-success-pale,var(--vvd-color-success-300))}.control.connotation-alert{--_connotation-color-primary:var(--vvd-button-alert-primary,var(--vvd-color-alert-500));--_connotation-color-primary-text:var(--vvd-button-alert-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-button-alert-primary-increment,var(--vvd-color-alert-600));--_connotation-color-contrast:var(--vvd-button-alert-contrast,var(--vvd-color-alert-800));--_connotation-color-fierce:var(--vvd-button-alert-fierce,var(--vvd-color-alert-700));--_connotation-color-firm:var(--vvd-button-alert-firm,var(--vvd-color-alert-600));--_connotation-color-soft:var(--vvd-button-alert-soft,var(--vvd-color-alert-100));--_connotation-color-faint:var(--vvd-button-alert-faint,var(--vvd-color-alert-50));--_connotation-color-fierce-primary:var(--vvd-button-alert-fierce-primary,var(--vvd-color-alert-700));--_connotation-color-dim:var(--vvd-button-alert-dim,var(--vvd-color-alert-200));--_connotation-color-pale:var(--vvd-button-alert-pale,var(--vvd-color-alert-300))}.control.connotation-announcement{--_connotation-color-primary:var(--vvd-button-announcement-primary,var(--vvd-color-announcement-500));--_connotation-color-primary-text:var(--vvd-button-announcement-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-button-announcement-primary-increment,var(--vvd-color-announcement-600));--_connotation-color-contrast:var(--vvd-button-announcement-contrast,var(--vvd-color-announcement-800));--_connotation-color-fierce:var(--vvd-button-announcement-fierce,var(--vvd-color-announcement-700));--_connotation-color-firm:var(--vvd-button-announcement-firm,var(--vvd-color-announcement-600));--_connotation-color-soft:var(--vvd-button-announcement-soft,var(--vvd-color-announcement-100));--_connotation-color-faint:var(--vvd-button-announcement-faint,var(--vvd-color-announcement-50));--_connotation-color-fierce-primary:var(--vvd-button-announcement-fierce-primary,var(--vvd-color-announcement-700));--_connotation-color-dim:var(--vvd-button-announcement-dim,var(--vvd-color-announcement-200));--_connotation-color-pale:var(--vvd-button-announcement-pale,var(--vvd-color-announcement-300))}.control:not(.connotation-cta,.connotation-success,.connotation-alert,.connotation-announcement){--_connotation-color-primary:var(--vvd-button-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-button-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-button-accent-primary-increment,var(--vvd-color-neutral-800));--_connotation-color-contrast:var(--vvd-button-accent-contrast,var(--vvd-color-neutral-800));--_connotation-color-fierce:var(--vvd-button-accent-fierce,var(--vvd-color-neutral-700));--_connotation-color-firm:var(--vvd-button-accent-firm,var(--vvd-color-canvas-text));--_connotation-color-soft:var(--vvd-button-accent-soft,var(--vvd-color-neutral-100));--_connotation-color-faint:var(--vvd-button-accent-faint,var(--vvd-color-neutral-50));--_connotation-color-fierce-primary:var(--vvd-button-accent-fierce-primary,var(--vvd-color-canvas-text));--_connotation-color-dim:var(--vvd-button-accent-dim,var(--vvd-color-neutral-200));--_connotation-color-pale:var(--vvd-button-accent-pale,var(--vvd-color-neutral-300))}.control.appearance-filled{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary);--_appearance-color-outline:transparent}.control.appearance-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control,.control.appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.control.appearance-outlined-light{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.control.appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 85%);--_appearance-color-outline:transparent}@media (hover:hover){.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-filled{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary-increment);--_appearance-color-outline:transparent}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 90%);--_appearance-color-outline:transparent}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-outlined-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 90%);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-dim);--_appearance-color-outline:transparent}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 75%);--_appearance-color-outline:transparent}}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-filled{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary-increment);--_appearance-color-outline:transparent}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 90%);--_appearance-color-outline:transparent}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-outlined-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 90%);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-dim);--_appearance-color-outline:transparent}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 75%);--_appearance-color-outline:transparent}.control:disabled.appearance-filled{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:transparent}.control:disabled.appearance-outlined{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:disabled,.control:disabled.appearance-ghost-light{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.control:disabled.appearance-outlined-light{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:disabled.appearance-subtle,.control:disabled.appearance-subtle-light,.control.disabled.appearance-filled{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:transparent}.control.disabled.appearance-outlined{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.disabled,.control.disabled.appearance-ghost-light{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.control.disabled.appearance-outlined-light{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.disabled.appearance-subtle,.control.disabled.appearance-subtle-light{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)).appearance-filled{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-fierce);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)).appearance-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 80%);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)).appearance-outlined-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 80%);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control:active:where(:not(.disabled,:disabled)).appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-pale);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)).appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 65%);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-filled{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-fierce);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-outlined{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 80%);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-outlined-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 80%);--_appearance-color-outline:var(--vvd-color-neutral-300)}.control.active:where(:not(.disabled,:disabled)).appearance-subtle{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-pale);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 65%);--_appearance-color-outline:transparent}.control{--focus-stroke-gap-color:transparent;box-sizing:border-box;border-radius:var(--_button-border-radius);background-color:var(--_appearance-color-fill);block-size:var(--_button-block-size);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);color:var(--_appearance-color-text);justify-content:space-between;align-items:center;gap:var(--_button-icon-gap);vertical-align:middle;border:0;margin:0;text-decoration:none;display:inline-flex}.control .text{-webkit-line-clamp:var(--button-line-clamp,1);text-align:start;-webkit-box-orient:vertical;max-inline-size:100%;display:-webkit-box;overflow:hidden}.control:not(.icon-only){inline-size:100%}.control:not(.disabled){cursor:var(--button-cursor,pointer)}.control.disabled{cursor:not-allowed}.control{user-select:none}.control:not(.stacked).size-super-condensed{--_button-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16));font:var(--vvd-typography-base-condensed-bold);--_button-icon-gap:4px;--_button-chevron-size:10px}.control:not(.stacked).size-super-condensed.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control:not(.stacked).size-super-condensed:not(.icon-only){padding-inline:8px}.control:not(.stacked).size-condensed{--_button-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8));font:var(--vvd-typography-base-condensed-bold);--_button-icon-gap:8px;--_button-chevron-size:12px}.control:not(.stacked).size-condensed.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control:not(.stacked).size-condensed:not(.icon-only){padding-inline:12px}.control:not(.stacked).size-expanded{--_button-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 8));font:var(--vvd-typography-base-extended-bold);--_button-icon-gap:10px;--_button-chevron-size:16px}.control:not(.stacked).size-expanded.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control:not(.stacked).size-expanded:not(.icon-only){padding-inline:20px}.control:not(.stacked):not(.size-condensed,.size-expanded,.size-super-condensed){--_button-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)));font:var(--vvd-typography-base-bold);--_button-icon-gap:8px;--_button-chevron-size:16px}.control:not(.stacked):not(.size-condensed,.size-expanded,.size-super-condensed).icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control:not(.stacked):not(.size-condensed,.size-expanded,.size-super-condensed):not(.icon-only){padding-inline:16px}.control:not(.shape-pill){--_button-border-radius:8px}.control:not(.shape-pill).size-condensed:not(.stacked),.control:not(.shape-pill).size-super-condensed:not(.stacked){--_button-border-radius:4px}.control.shape-pill:not(.icon-only,.stacked.size-super-condensed,.stacked.size-condensed,.stacked.normal){--_button-border-radius:24px}.control.shape-pill.stacked.size-condensed,.control.shape-pill.stacked.size-super-condensed{--_button-border-radius:16px}.control.shape-pill.stacked.size-normal{--_button-border-radius:20px}.control.shape-pill.icon-only{--_button-border-radius:50%}.control.stacked.size-super-condensed{--stacked-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16));--_button-block-size:calc(var(--stacked-size) + 20px);font:var(--vvd-typography-base-condensed-bold);--_button-icon-gap:4px;--_button-chevron-size:10px}.control.stacked.size-super-condensed.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control.stacked.size-super-condensed:not(.icon-only){padding-inline:16px}.control.stacked.size-condensed{--stacked-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8));--_button-block-size:calc(var(--stacked-size) + 24px);font:var(--vvd-typography-base-condensed-bold);--_button-icon-gap:6px;--_button-chevron-size:12px}.control.stacked.size-condensed.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control.stacked.size-condensed:not(.icon-only){padding-inline:12px}.control.stacked.size-expanded{--stacked-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 8));--_button-block-size:calc(var(--stacked-size) + 32px);font:var(--vvd-typography-base-extended-bold);--_button-icon-gap:10px;--_button-chevron-size:16px}.control.stacked.size-expanded.icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control.stacked.size-expanded:not(.icon-only){padding-inline:20px}.control.stacked:not(.size-condensed,.size-expanded,.size-super-condensed){--stacked-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)));--_button-block-size:calc(var(--stacked-size) + 28px);font:var(--vvd-typography-base-bold);--_button-icon-gap:8px;--_button-chevron-size:16px}.control.stacked:not(.size-condensed,.size-expanded,.size-super-condensed).icon-only{padding-inline:calc(var(--_button-block-size) / 4)}.control.stacked:not(.size-condensed,.size-expanded,.size-super-condensed):not(.icon-only){padding-inline:16px}.control.appearance-filled{--focus-stroke-gap-color:transparent}.control.appearance-filled:focus-visible{outline:none;position:relative}.control.appearance-filled:focus-visible:after{box-shadow:0 0 0 4px color-mix(in sRGB, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px));border-radius:var(--focus-border-radius,inherit);block-size:calc(100% + var(--focus-block-size-addition,4px));content:\"\";inline-size:calc(100% + var(--focus-block-size-addition,4px));display:block;position:absolute;inset-block-start:50%;inset-inline-start:50%;transform:translate(-50%,-50%)}.control:not(.appearance-filled):focus-visible{box-shadow:0 0 0 4px color-mix(in sRGB, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px))}slot[name=icon]{line-height:1}.icon-trailing slot[name=icon]{order:1;display:flex}.control.stacked slot[name=icon]{font-size:calc(var(--stacked-size) / 2)}.control:not(.stacked) slot[name=icon]{font-size:calc(var(--_button-block-size) / 2)}.chevron{font-size:var(--_button-chevron-size)}.content{justify-content:center;align-items:center;gap:var(--_button-icon-gap);flex:1;display:flex;overflow:hidden}.control.stacked .content{flex-direction:column}:host([dropdown-indicator]) .content{justify-content:var(--button-content-alignment,flex-start);text-align:start}:host([dropdown-indicator][stacked]) .content{align-items:var(--button-content-alignment,flex-start);justify-content:center}.pending-no-icon{position:absolute}.pending-no-icon+.text{visibility:hidden}:host([icon-trailing][pending]) .pending{order:1}.sr-only{clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}", S = (e) => {
|
|
50
|
-
let t = e.tagFor(
|
|
51
|
+
let t = e.tagFor(d);
|
|
51
52
|
return r`<${t} class="chevron" aria-hidden="true" name="chevron-down-line"></${t}>`;
|
|
52
53
|
};
|
|
53
54
|
//#endregion
|
|
@@ -123,7 +124,7 @@ function k(e) {
|
|
|
123
124
|
var A = i("button", b, (e) => r` <template>
|
|
124
125
|
${o((e) => !e.href, r`${O(e)}`)}
|
|
125
126
|
${o((e) => e.href, k(e))}
|
|
126
|
-
</template>`, [
|
|
127
|
+
</template>`, [u, g], {
|
|
127
128
|
styles: x,
|
|
128
129
|
shadowOptions: { delegatesFocus: !0 }
|
|
129
130
|
}), j = t(A);
|
package/bundled/definition9.cjs
CHANGED
|
@@ -1,16 +1,22 @@
|
|
|
1
|
-
const e=require(`./vivid-element.cjs`),t=require(`./slotted.cjs`),n=require(`./
|
|
2
|
-
${
|
|
3
|
-
${
|
|
4
|
-
<${
|
|
1
|
+
const e=require(`./vivid-element.cjs`),t=require(`./slotted.cjs`),n=require(`./when.cjs`),r=require(`./decorate.cjs`),i=require(`./class-names.cjs`),a=require(`./definition8.cjs`),o=require(`./anchored.cjs`),s=require(`./kbd-shortcut.cjs`),c=require(`./render-in-light-dom.cjs`),l=require(`./dialog.cjs`);var u=`:host :host{display:var(--_popup-display,inline)}:host :host([slotted-anchor]){--_popup-display:contents}.control{pointer-events:none}.tooltip{width:var(--tooltip-inline-size,auto);box-sizing:border-box;color:var(--vvd-color-canvas-text);font:var(--vvd-typography-base-bold);max-inline-size:var(--tooltip-max-inline-size,30ch);flex-direction:column;align-items:flex-start;gap:4px;padding:8px 12px;display:flex}.text-secondary{color:var(--vvd-color-neutral-600);font:var(--vvd-typography-base)}`,d=class extends s.t(o.t(e.t)){constructor(...e){super(...e),this.open=!1,this._descriptionId=`vwc-tooltip-desc-${c.n()}`,this._descriptionSecondaryId=`vwc-tooltip-desc-secondary-${c.n()}`,this._defaultSlotContent=[],this.#i=()=>{this.open=!0},this.#a=()=>{this.open=!1},this.#s=e=>{e.key===`Escape`&&this.#a()}}_defaultSlotContentChanged(){for(let e of this._defaultSlotContent)e.id||=`vwc-tooltip-content-${c.n()}`;this._anchorEl&&this.#t(this._anchorEl)}_kbdAriaShortcutsValueChanged(){this._anchorEl&&e.P.setAttribute(this._anchorEl,`aria-keyshortcuts`,this._kbdAriaShortcutsValue)}connectedCallback(){super.connectedCallback(),this.#o()}disconnectedCallback(){super.disconnectedCallback(),this.#o()}_anchorElChanged(e,t){e&&this.#r(e),t&&this.#n(t)}#e(){return[this._descriptionId,this._descriptionSecondaryId,...this._defaultSlotContent.map(e=>e.id).filter(Boolean)]}#t(e){let t=e.getAttribute(`aria-describedby`)??e.ariaDescribedBy??``,n=new Set(this.#e()),r=t.split(` `).filter(e=>e&&!n.has(e));e.setAttribute(`aria-describedby`,[...r,...this.#e()].join(` `))}#n(t){t.addEventListener(`mouseover`,this.#i),t.addEventListener(`mouseout`,this.#a),t.addEventListener(`focusin`,this.#i),t.addEventListener(`focusout`,this.#a),this.#t(t),e.P.setAttribute(t,`aria-keyshortcuts`,this._kbdAriaShortcutsValue)}#r(t){t.removeEventListener(`mouseover`,this.#i),t.removeEventListener(`mouseout`,this.#a),t.removeEventListener(`focusin`,this.#i),t.removeEventListener(`focusout`,this.#a);let n=t.getAttribute(`aria-describedby`)??t.ariaDescribedBy??``,r=new Set(this.#e()),i=n.split(` `).filter(e=>e&&!r.has(e)),a=i.length?i.join(` `):null;t.hasAttribute(`aria-describedby`)?e.P.setAttribute(t,`aria-describedby`,a):t.ariaDescribedBy=a,t.removeAttribute(`aria-keyshortcuts`)}#i;#a;#o(){document.removeEventListener(`keydown`,this.#s),this.open&&this.isConnected&&document.addEventListener(`keydown`,this.#s)}#s;openChanged(e){e!==void 0&&this.#o()}};r.t([e.m],d.prototype,`text`,void 0),r.t([e.m({attribute:`text-secondary`})],d.prototype,`textSecondary`,void 0),r.t([e.m({mode:`fromView`})],d.prototype,`placement`,void 0),r.t([e.m({mode:`boolean`})],d.prototype,`open`,void 0),r.t([e.A],d.prototype,`_defaultSlotContent`,void 0);var f=e.u(`tooltip`,d,r=>{let s=r.tagFor(a.i);return e.p`
|
|
2
|
+
${o.n()}
|
|
3
|
+
${c.t(e.p`<span slot="_description" id="${e=>e._descriptionId}">${e=>e.text}</span><span slot="_description-secondary" id="${e=>e._descriptionSecondaryId}">${e=>e.textSecondary}</span>`)}
|
|
4
|
+
<${s} class="${e=>i.t(`control`,[`open`,e.open])}" arrow alternate
|
|
5
5
|
:placement=${e=>e.placement}
|
|
6
6
|
:anchor="${e=>e._anchorEl}"
|
|
7
7
|
:open="${e=>e.open}"
|
|
8
|
-
@keydown="${(e,t)=>{e.open&&
|
|
8
|
+
@keydown="${(e,t)=>{e.open&&l.t(t.event)&&(e.open=!1)}}"
|
|
9
9
|
exportparts="vvd-theme-alternate">
|
|
10
10
|
<div part="vvd-theme-alternate" class="tooltip" role="tooltip">
|
|
11
11
|
<span class="text"><slot name="_description"></slot></span>
|
|
12
|
+
${n.t(e=>e.textSecondary,e.p`<span class="text-secondary"
|
|
13
|
+
><slot name="_description-secondary"></slot
|
|
14
|
+
></span>`)}
|
|
15
|
+
<slot
|
|
16
|
+
${t.t({property:`_defaultSlotContent`,filter:t.r()})}
|
|
17
|
+
></slot>
|
|
12
18
|
<slot name="kbd-shortcut"
|
|
13
19
|
${t.t({property:`_kbdShortcutSlotted`,filter:t.r()})}
|
|
14
20
|
></slot>
|
|
15
21
|
</div>
|
|
16
|
-
</${
|
|
22
|
+
</${s}>`},[a.t],{styles:u}),p=e.d(f);Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return f}}),Object.defineProperty(exports,`r`,{enumerable:!0,get:function(){return d}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return p}});
|