@vonage/vivid 5.17.0 → 5.19.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/accordion/definition.cjs +5 -6
- package/accordion/definition.js +0 -1
- package/accordion/index.cjs +2 -2
- package/accordion/index.js +4 -5
- package/accordion-item/definition.cjs +4 -5
- package/accordion-item/definition.js +0 -1
- package/accordion-item/index.cjs +1 -1
- package/accordion-item/index.js +1 -3
- package/action-group/index.cjs +4 -4
- package/action-group/index.js +7 -7
- package/alert/definition.cjs +4 -5
- package/alert/definition.js +0 -1
- package/alert/index.cjs +5 -5
- package/alert/index.js +23 -23
- package/audio-player/definition.cjs +4 -5
- package/audio-player/definition.js +0 -1
- package/audio-player/index.cjs +13 -13
- package/audio-player/index.js +76 -76
- package/avatar/definition.cjs +4 -5
- package/avatar/definition.js +0 -1
- package/avatar/index.cjs +8 -8
- package/avatar/index.js +23 -23
- package/badge/definition.cjs +4 -5
- package/badge/definition.js +0 -1
- package/badge/index.cjs +1 -4
- package/badge/index.js +2 -20
- package/banner/definition.cjs +4 -5
- package/banner/definition.js +0 -1
- package/banner/index.cjs +4 -4
- package/banner/index.js +20 -20
- package/breadcrumb/index.cjs +2 -2
- package/breadcrumb/index.js +3 -3
- package/breadcrumb-item/definition.cjs +3 -4
- package/breadcrumb-item/definition.js +0 -1
- package/breadcrumb-item/index.cjs +5 -5
- package/breadcrumb-item/index.js +7 -7
- package/bundled/affix.cjs +2 -2
- package/bundled/affix.js +6 -6
- package/bundled/anchored.cjs +1 -1
- package/bundled/anchored.js +1 -1
- package/bundled/aria-binding-directive.cjs +1 -0
- package/bundled/aria-binding-directive.js +29 -0
- package/bundled/base-color-picker.cjs +3 -3
- package/bundled/base-color-picker.js +1 -1
- package/bundled/base-progress.cjs +1 -1
- package/bundled/base-progress.js +2 -2
- package/bundled/breadcrumb-item.cjs +1 -1
- package/bundled/breadcrumb-item.js +3 -3
- package/bundled/button.cjs +1 -1
- package/bundled/button.js +3 -3
- package/bundled/calendar-event.cjs +1 -1
- package/bundled/calendar-event.js +4 -4
- package/bundled/calendar-picker.template.cjs +20 -20
- package/bundled/calendar-picker.template.js +10 -10
- package/bundled/char-count.cjs +2 -2
- package/bundled/char-count.js +3 -3
- package/bundled/children.cjs +1 -1
- package/bundled/children.js +6 -6
- package/bundled/decorate.js +1 -1
- package/bundled/definition.cjs +1 -1
- package/bundled/definition.js +2 -2
- package/bundled/definition10.cjs +3 -3
- package/bundled/definition10.js +19 -19
- package/bundled/definition11.cjs +2 -2
- package/bundled/definition11.js +9 -9
- package/bundled/definition12.cjs +7 -7
- package/bundled/definition12.js +19 -19
- package/bundled/definition13.cjs +3 -3
- package/bundled/definition13.js +8 -8
- package/bundled/definition14.cjs +2 -2
- package/bundled/definition14.js +3 -3
- package/bundled/definition15.cjs +7 -7
- package/bundled/definition15.js +18 -18
- package/bundled/definition16.cjs +3 -3
- package/bundled/definition16.js +19 -19
- package/bundled/definition17.cjs +7 -7
- package/bundled/definition17.js +16 -16
- package/bundled/definition18.cjs +7 -7
- package/bundled/definition18.js +23 -23
- package/bundled/definition19.cjs +2 -2
- package/bundled/definition19.js +3 -3
- package/bundled/definition2.cjs +4 -15
- package/bundled/definition2.js +23 -56
- package/bundled/definition20.cjs +10 -10
- package/bundled/definition20.js +19 -20
- package/bundled/definition21.cjs +5 -5
- package/bundled/definition21.js +26 -26
- package/bundled/definition22.cjs +4 -39
- package/bundled/definition22.js +18 -70
- package/bundled/definition23.cjs +12 -0
- package/bundled/definition23.js +37 -0
- package/bundled/definition24.cjs +39 -0
- package/bundled/definition24.js +72 -0
- package/bundled/definition3.cjs +1 -1
- package/bundled/definition3.js +39 -36
- package/bundled/definition4.cjs +4 -4
- package/bundled/definition4.js +13 -13
- package/bundled/definition5.cjs +5 -5
- package/bundled/definition5.js +10 -10
- package/bundled/definition6.cjs +12 -12
- package/bundled/definition6.js +61 -45
- package/bundled/definition7.cjs +2 -2
- package/bundled/definition7.js +6 -6
- package/bundled/definition8.cjs +4 -4
- package/bundled/definition8.js +15 -15
- package/bundled/definition9.cjs +2 -2
- package/bundled/definition9.js +18 -18
- package/bundled/delegates-aria.cjs +1 -1
- package/bundled/delegates-aria.js +10 -49
- package/bundled/divider.cjs +1 -1
- package/bundled/divider.js +3 -3
- package/bundled/form-associated.cjs +1 -1
- package/bundled/form-associated.js +6 -6
- package/bundled/form-element.cjs +1 -1
- package/bundled/form-element.js +8 -6
- package/bundled/host-semantics.cjs +1 -1
- package/bundled/host-semantics.js +10 -39
- package/bundled/linkable.cjs +2 -2
- package/bundled/linkable.js +1 -1
- package/bundled/listbox.cjs +1 -1
- package/bundled/listbox.js +12 -12
- package/bundled/localized.cjs +1 -1
- package/bundled/localized.js +7 -6
- package/bundled/mixins.cjs +6 -6
- package/bundled/mixins.js +14 -14
- package/bundled/normalize.cjs +1 -1
- package/bundled/normalize.js +2 -2
- package/bundled/numberConverter.cjs +12 -0
- package/bundled/numberConverter.js +38 -0
- package/bundled/picker-field.template.cjs +2 -1
- package/bundled/picker-field.template.js +25 -23
- package/bundled/ref.cjs +1 -1
- package/bundled/ref.js +1 -1
- package/bundled/repeat.cjs +1 -1
- package/bundled/repeat.js +54 -54
- package/bundled/slider.template.cjs +7 -7
- package/bundled/slider.template.js +13 -13
- package/bundled/slottable-request.cjs +1 -1
- package/bundled/slottable-request.js +1 -1
- package/bundled/slotted.cjs +1 -1
- package/bundled/slotted.js +1 -1
- package/bundled/text-field.cjs +1 -1
- package/bundled/text-field.js +1 -1
- package/bundled/time-selection-picker.template.cjs +4 -4
- package/bundled/time-selection-picker.template.js +23 -23
- package/bundled/utils.cjs +1 -0
- package/bundled/utils.js +1420 -0
- package/bundled/vivid-element.cjs +1 -1
- package/bundled/vivid-element.js +21 -19
- package/bundled/when.cjs +1 -1
- package/bundled/when.js +1 -1
- package/bundled/with-contextual-help.cjs +1 -1
- package/bundled/with-contextual-help.js +1 -1
- package/bundled/with-error-text.cjs +1 -1
- package/bundled/with-error-text.js +1 -1
- package/bundled/with-success-text.cjs +1 -1
- package/bundled/with-success-text.js +1 -1
- package/button/definition.cjs +4 -5
- package/button/definition.js +0 -1
- package/button/index.cjs +1 -1
- package/button/index.js +0 -2
- package/calendar/index.cjs +8 -8
- package/calendar/index.js +10 -10
- package/calendar-event/index.cjs +6 -6
- package/calendar-event/index.js +8 -8
- package/card/definition.cjs +4 -5
- package/card/definition.js +0 -1
- package/card/index.cjs +15 -15
- package/card/index.js +37 -37
- package/checkbox/definition.cjs +4 -5
- package/checkbox/definition.js +0 -1
- package/checkbox/index.cjs +1 -1
- package/checkbox/index.js +0 -2
- package/color-picker/definition.cjs +4 -5
- package/color-picker/definition.js +0 -1
- package/color-picker/index.cjs +19 -19
- package/color-picker/index.js +94 -93
- package/combobox/definition.cjs +4 -5
- package/combobox/definition.js +0 -1
- package/combobox/index.cjs +4 -4
- package/combobox/index.js +23 -23
- package/contextual-help/definition.cjs +4 -5
- package/contextual-help/definition.js +0 -1
- package/contextual-help/index.cjs +1 -1
- package/contextual-help/index.js +0 -2
- package/country/definition.cjs +4 -5
- package/country/definition.js +0 -1
- package/country/index.cjs +1 -12
- package/country/index.js +2 -1216
- package/country-group/definition.cjs +5 -0
- package/country-group/definition.js +2 -0
- package/country-group/index.cjs +43 -0
- package/country-group/index.js +166 -0
- package/custom-elements.json +3535 -3017
- package/data-grid/definition.cjs +8 -9
- package/data-grid/definition.js +1 -2
- package/data-grid/index.cjs +14 -14
- package/data-grid/index.js +105 -105
- package/date-picker/definition.cjs +4 -5
- package/date-picker/definition.js +1 -2
- package/date-picker/index.cjs +1 -1
- package/date-picker/index.js +2 -3
- package/date-range-picker/definition.cjs +4 -5
- package/date-range-picker/definition.js +1 -2
- package/date-range-picker/index.cjs +1 -1
- package/date-range-picker/index.js +6 -7
- package/date-time-picker/definition.cjs +4 -5
- package/date-time-picker/definition.js +1 -2
- package/date-time-picker/index.cjs +2 -2
- package/date-time-picker/index.js +8 -9
- package/dial-pad/definition.cjs +4 -5
- package/dial-pad/definition.js +1 -2
- package/dial-pad/index.cjs +9 -9
- package/dial-pad/index.js +19 -19
- package/dialog/definition.cjs +4 -5
- package/dialog/definition.js +1 -2
- package/dialog/index.cjs +14 -11
- package/dialog/index.js +39 -36
- package/divider/definition.cjs +1 -1
- package/divider/definition.js +1 -1
- package/divider/index.cjs +1 -1
- package/divider/index.js +0 -1
- package/elevation/index.cjs +1 -1
- package/elevation/index.js +0 -1
- package/empty-state/definition.cjs +4 -5
- package/empty-state/definition.js +1 -2
- package/empty-state/index.cjs +4 -4
- package/empty-state/index.js +12 -12
- package/fab/definition.cjs +4 -5
- package/fab/definition.js +1 -2
- package/fab/index.cjs +3 -3
- package/fab/index.js +12 -12
- package/file-picker/definition.cjs +4 -5
- package/file-picker/definition.js +1 -2
- package/file-picker/index.cjs +10 -10
- package/file-picker/index.js +26 -26
- package/flag/definition.cjs +5 -0
- package/flag/definition.js +2 -0
- package/flag/index.cjs +10 -0
- package/flag/index.js +61 -0
- package/header/definition.cjs +1 -1
- package/header/definition.js +1 -1
- package/header/index.cjs +5 -5
- package/header/index.js +11 -11
- package/icon/index.cjs +1 -1
- package/icon/index.js +0 -1
- package/index.cjs +182 -174
- package/index.js +47 -45
- package/layout/definition.cjs +1 -1
- package/layout/definition.js +1 -1
- package/layout/index.cjs +2 -2
- package/layout/index.js +3 -3
- package/lib/avatar/avatar.d.ts +1 -1
- package/lib/breadcrumb-item/breadcrumb-item.d.ts +1 -1
- package/lib/button/button.d.ts +2 -1
- package/lib/card/card.d.ts +1 -1
- package/lib/components.d.ts +2 -0
- package/lib/country/countries-data.d.ts +1 -0
- package/lib/country/{country-code-to-flag-icon.d.ts → utils.d.ts} +0 -3
- package/lib/country-group/country-group.d.ts +829 -0
- package/lib/country-group/country-group.template.d.ts +3 -0
- package/lib/country-group/definition.d.ts +3 -0
- package/lib/country-group/index.d.ts +1 -0
- package/lib/country-group/locale.d.ts +3 -0
- package/lib/date-picker/date-picker.d.ts +4 -0
- package/lib/date-range-picker/date-range-picker.d.ts +2 -0
- package/lib/date-time-picker/date-time-picker.d.ts +4 -0
- package/lib/flag/definition.d.ts +3 -0
- package/lib/flag/flag.d.ts +8 -0
- package/lib/flag/flag.template.d.ts +3 -0
- package/lib/flag/index.d.ts +1 -0
- package/lib/icon/icon.d.ts +1 -2
- package/lib/nav-item/nav-item.d.ts +1 -1
- package/lib/rich-text-editor/rte/utils/ui.d.ts +2 -1
- package/lib/searchable-select/option-tag.d.ts +3 -1
- package/lib/searchable-select/searchable-select.d.ts +3 -1
- package/lib/tag-name-map.d.ts +2 -1
- package/lib/time-picker/time-picker.d.ts +2 -0
- package/locales/de-DE.cjs +2 -1
- package/locales/de-DE.js +1 -0
- package/locales/en-GB.cjs +2 -1
- package/locales/en-GB.js +1 -0
- package/locales/en-US.cjs +2 -1
- package/locales/en-US.js +1 -0
- package/locales/ja-JP.cjs +2 -1
- package/locales/ja-JP.js +1 -0
- package/locales/zh-CN.cjs +2 -1
- package/locales/zh-CN.js +1 -0
- package/menu/definition.cjs +4 -5
- package/menu/definition.js +0 -1
- package/menu/index.cjs +1 -1
- package/menu/index.js +0 -2
- package/menu-item/definition.cjs +5 -6
- package/menu-item/definition.js +0 -1
- package/menu-item/index.cjs +1 -1
- package/menu-item/index.js +0 -2
- package/nav/definition.cjs +1 -1
- package/nav/definition.js +1 -1
- package/nav/index.cjs +2 -2
- package/nav/index.js +2 -2
- package/nav-disclosure/definition.cjs +4 -5
- package/nav-disclosure/definition.js +1 -2
- package/nav-disclosure/index.cjs +4 -4
- package/nav-disclosure/index.js +18 -18
- package/nav-item/definition.cjs +4 -5
- package/nav-item/definition.js +1 -2
- package/nav-item/index.cjs +2 -2
- package/nav-item/index.js +13 -13
- package/note/definition.cjs +4 -5
- package/note/definition.js +1 -2
- package/note/index.cjs +2 -2
- package/note/index.js +10 -10
- package/number-field/definition.cjs +4 -5
- package/number-field/definition.js +1 -2
- package/number-field/index.cjs +5 -5
- package/number-field/index.js +19 -19
- package/option/definition.cjs +4 -5
- package/option/definition.js +0 -1
- package/option/index.cjs +1 -1
- package/option/index.js +0 -2
- package/package.json +23 -23
- package/pagination/definition.cjs +4 -5
- package/pagination/definition.js +1 -2
- package/pagination/index.cjs +4 -4
- package/pagination/index.js +11 -12
- package/popover/definition.cjs +4 -5
- package/popover/definition.js +1 -2
- package/popover/index.cjs +8 -8
- package/popover/index.js +31 -31
- package/popup/definition.cjs +3 -4
- package/popup/definition.js +0 -1
- package/popup/index.cjs +1 -1
- package/popup/index.js +0 -2
- package/progress/definition.cjs +1 -1
- package/progress/definition.js +1 -1
- package/progress/index.cjs +5 -5
- package/progress/index.js +10 -10
- package/progress-ring/index.cjs +1 -1
- package/progress-ring/index.js +0 -1
- package/radio/definition.cjs +1 -1
- package/radio/definition.js +1 -1
- package/radio/index.cjs +1 -1
- package/radio/index.js +0 -1
- package/radio-group/definition.cjs +4 -5
- package/radio-group/definition.js +1 -2
- package/radio-group/index.cjs +6 -6
- package/radio-group/index.js +21 -21
- package/range-slider/definition.cjs +4 -5
- package/range-slider/definition.js +1 -2
- package/range-slider/index.cjs +5 -5
- package/range-slider/index.js +69 -67
- package/rich-text-editor/definition.cjs +31 -32
- package/rich-text-editor/definition.js +1 -2
- package/rich-text-editor/index.cjs +9 -9
- package/rich-text-editor/index.js +2016 -1947
- package/rich-text-view/definition.cjs +1 -1
- package/rich-text-view/definition.js +1 -1
- package/rich-text-view/index.cjs +1 -1
- package/rich-text-view/index.js +2 -2
- package/searchable-select/definition.cjs +3 -4
- package/searchable-select/definition.js +1 -2
- package/searchable-select/index.cjs +25 -23
- package/searchable-select/index.js +72 -68
- package/select/definition.cjs +4 -5
- package/select/definition.js +1 -2
- package/select/index.cjs +1 -1
- package/select/index.js +0 -2
- package/selectable-box/definition.cjs +4 -5
- package/selectable-box/definition.js +1 -2
- package/selectable-box/index.cjs +9 -9
- package/selectable-box/index.js +19 -20
- package/shared/aria/aria-binding-directive.d.ts +21 -0
- package/shared/aria/aria-change-subscription.d.ts +1 -0
- package/shared/aria/delegates-aria.d.ts +1 -1
- package/shared/aria/host-semantics.d.ts +1 -1
- package/shared/icon/utils.d.ts +1 -0
- package/shared/localization/Locale.d.ts +2 -0
- package/shared/patterns/linkable.d.ts +1 -1
- package/shared/picker-field/mixins/calendar-picker.d.ts +1 -0
- package/shared/picker-field/mixins/calendar-picker.template.d.ts +1 -0
- package/shared/picker-field/mixins/min-max-calendar-picker.d.ts +1 -0
- package/shared/picker-field/mixins/single-date-picker.d.ts +1 -0
- package/shared/picker-field/mixins/single-value-picker.d.ts +1 -0
- package/shared/picker-field/mixins/time-selection-picker.d.ts +1 -0
- package/shared/picker-field/mixins/time-selection-picker.template.d.ts +2 -0
- package/shared/picker-field/picker-field.d.ts +2 -0
- package/side-drawer/definition.cjs +1 -1
- package/side-drawer/definition.js +1 -1
- package/side-drawer/index.cjs +3 -3
- package/side-drawer/index.js +4 -4
- package/simple-color-picker/definition.cjs +4 -5
- package/simple-color-picker/definition.js +1 -2
- package/simple-color-picker/index.cjs +2 -2
- package/simple-color-picker/index.js +22 -22
- package/slider/definition.cjs +4 -5
- package/slider/definition.js +0 -1
- package/slider/index.cjs +1 -1
- package/slider/index.js +0 -2
- package/split-button/definition.cjs +4 -5
- package/split-button/definition.js +1 -2
- package/split-button/index.cjs +6 -6
- package/split-button/index.js +20 -20
- package/status/definition.cjs +4 -5
- package/status/definition.js +1 -2
- package/status/index.cjs +2 -2
- package/status/index.js +11 -11
- package/switch/definition.cjs +4 -5
- package/switch/definition.js +1 -2
- package/switch/index.cjs +5 -5
- package/switch/index.js +12 -12
- package/tab/definition.cjs +4 -5
- package/tab/definition.js +1 -2
- package/tab/index.cjs +1 -1
- package/tab/index.js +0 -2
- package/tab-panel/definition.cjs +1 -1
- package/tab-panel/definition.js +1 -1
- package/tab-panel/index.cjs +1 -1
- package/tab-panel/index.js +0 -1
- package/table/definition.cjs +16 -17
- package/table/definition.js +1 -2
- package/table/index.cjs +9 -9
- package/table/index.js +24 -24
- package/tabs/definition.cjs +5 -6
- package/tabs/definition.js +1 -2
- package/tabs/index.cjs +2 -2
- package/tabs/index.js +25 -26
- package/tag/definition.cjs +4 -5
- package/tag/definition.js +1 -2
- package/tag/index.cjs +12 -12
- package/tag/index.js +24 -24
- package/tag-group/definition.cjs +1 -1
- package/tag-group/definition.js +1 -1
- package/tag-group/index.cjs +4 -4
- package/tag-group/index.js +6 -6
- package/text-area/definition.cjs +4 -5
- package/text-area/definition.js +1 -2
- package/text-area/index.cjs +4 -4
- package/text-area/index.js +24 -25
- package/text-field/definition.cjs +4 -5
- package/text-field/definition.js +0 -1
- package/text-field/index.cjs +1 -1
- package/text-field/index.js +0 -2
- package/time-picker/definition.cjs +3 -4
- package/time-picker/definition.js +1 -2
- package/time-picker/index.cjs +1 -1
- package/time-picker/index.js +2 -3
- package/toggletip/definition.cjs +4 -5
- package/toggletip/definition.js +0 -1
- package/toggletip/index.cjs +1 -1
- package/toggletip/index.js +0 -2
- package/tooltip/definition.cjs +4 -5
- package/tooltip/definition.js +0 -1
- package/tooltip/index.cjs +1 -1
- package/tooltip/index.js +0 -2
- package/tree-item/definition.cjs +4 -5
- package/tree-item/definition.js +1 -2
- package/tree-item/index.cjs +1 -1
- package/tree-item/index.js +0 -2
- package/tree-view/definition.cjs +4 -5
- package/tree-view/definition.js +1 -2
- package/tree-view/index.cjs +2 -2
- package/tree-view/index.js +5 -5
- package/unbundled/aria-binding-directive.cjs +42 -0
- package/unbundled/aria-binding-directive.js +36 -0
- package/unbundled/calendar-picker.template.cjs +1 -1
- package/unbundled/calendar-picker.template.js +1 -1
- package/unbundled/char-count.cjs +2 -1
- package/unbundled/char-count.js +2 -1
- package/unbundled/decorate.cjs +1 -1
- package/unbundled/decorate.js +1 -1
- package/unbundled/definition.js +1 -1
- package/unbundled/definition10.cjs +5 -4
- package/unbundled/definition10.js +6 -5
- package/unbundled/definition11.cjs +17 -7
- package/unbundled/definition11.js +18 -8
- package/unbundled/definition12.cjs +2 -2
- package/unbundled/definition12.js +3 -3
- package/unbundled/definition13.cjs +7 -6
- package/unbundled/definition13.js +8 -7
- package/unbundled/definition14.cjs +67 -57
- package/unbundled/definition14.js +68 -58
- package/unbundled/definition15.js +1 -1
- package/unbundled/definition16.js +1 -1
- package/unbundled/definition17.cjs +10 -8
- package/unbundled/definition17.js +11 -9
- package/unbundled/definition18.js +1 -1
- package/unbundled/definition19.js +1 -1
- package/unbundled/definition2.cjs +9 -77
- package/unbundled/definition2.js +6 -74
- package/unbundled/definition20.js +1 -1
- package/unbundled/definition21.js +1 -1
- package/unbundled/definition22.js +1 -1
- package/unbundled/definition23.cjs +1 -1
- package/unbundled/definition23.js +2 -2
- package/unbundled/definition24.cjs +17 -13
- package/unbundled/definition24.js +18 -14
- package/unbundled/definition25.js +1 -1
- package/unbundled/definition26.cjs +17 -1
- package/unbundled/definition26.js +18 -2
- package/unbundled/definition27.cjs +15 -12
- package/unbundled/definition27.js +16 -13
- package/unbundled/definition28.cjs +10 -6
- package/unbundled/definition28.js +11 -7
- package/unbundled/definition29.js +1 -1
- package/unbundled/definition3.js +1 -1
- package/unbundled/definition30.cjs +4 -2
- package/unbundled/definition30.js +5 -3
- package/unbundled/definition31.cjs +2 -1189
- package/unbundled/definition31.js +2 -1189
- package/unbundled/definition32.cjs +215 -1836
- package/unbundled/definition32.js +212 -1809
- package/unbundled/definition33.cjs +85 -311
- package/unbundled/definition33.js +82 -236
- package/unbundled/definition34.cjs +2039 -25
- package/unbundled/definition34.js +2009 -24
- package/unbundled/definition35.cjs +315 -121
- package/unbundled/definition35.js +236 -114
- package/unbundled/definition36.cjs +25 -405
- package/unbundled/definition36.js +23 -398
- package/unbundled/definition37.cjs +47 -142
- package/unbundled/definition37.js +45 -140
- package/unbundled/definition38.cjs +346 -330
- package/unbundled/definition38.js +344 -328
- package/unbundled/definition39.cjs +183 -235
- package/unbundled/definition39.js +181 -233
- package/unbundled/definition4.cjs +6 -0
- package/unbundled/definition4.js +7 -1
- package/unbundled/definition40.cjs +377 -47
- package/unbundled/definition40.js +373 -43
- package/unbundled/definition41.cjs +261 -57
- package/unbundled/definition41.js +260 -56
- package/unbundled/definition42.cjs +45 -432
- package/unbundled/definition42.js +42 -429
- package/unbundled/definition43.cjs +63 -49
- package/unbundled/definition43.js +61 -47
- package/unbundled/definition44.cjs +439 -30
- package/unbundled/definition44.js +436 -26
- package/unbundled/definition45.cjs +46 -84
- package/unbundled/definition45.js +43 -81
- package/unbundled/definition46.cjs +29 -54
- package/unbundled/definition46.js +24 -50
- package/unbundled/definition47.cjs +94 -21
- package/unbundled/definition47.js +92 -16
- package/unbundled/definition48.cjs +49 -33
- package/unbundled/definition48.js +46 -30
- package/unbundled/definition49.cjs +22 -347
- package/unbundled/definition49.js +17 -345
- package/unbundled/definition5.js +1 -1
- package/unbundled/definition50.cjs +34 -211
- package/unbundled/definition50.js +31 -208
- package/unbundled/definition51.cjs +282 -242
- package/unbundled/definition51.js +276 -236
- package/unbundled/definition52.cjs +211 -51
- package/unbundled/definition52.js +209 -48
- package/unbundled/definition53.cjs +279 -131
- package/unbundled/definition53.js +277 -128
- package/unbundled/definition54.cjs +50 -261
- package/unbundled/definition54.js +48 -260
- package/unbundled/definition55.cjs +128 -443
- package/unbundled/definition55.js +126 -442
- package/unbundled/definition56.cjs +235 -3596
- package/unbundled/definition56.js +231 -3429
- package/unbundled/definition57.cjs +419 -729
- package/unbundled/definition57.js +417 -727
- package/unbundled/definition58.cjs +3626 -106
- package/unbundled/definition58.js +3458 -101
- package/unbundled/definition59.cjs +624 -868
- package/unbundled/definition59.js +619 -863
- package/unbundled/definition6.js +1 -1
- package/unbundled/definition60.cjs +106 -108
- package/unbundled/definition60.js +103 -105
- package/unbundled/definition61.cjs +1045 -71
- package/unbundled/definition61.js +1041 -66
- package/unbundled/definition62.cjs +105 -169
- package/unbundled/definition62.js +102 -166
- package/unbundled/definition63.cjs +70 -113
- package/unbundled/definition63.js +66 -110
- package/unbundled/definition64.cjs +184 -53
- package/unbundled/definition64.js +182 -51
- package/unbundled/definition65.cjs +109 -76
- package/unbundled/definition65.js +110 -76
- package/unbundled/definition66.cjs +58 -21
- package/unbundled/definition66.js +56 -16
- package/unbundled/definition67.cjs +81 -74
- package/unbundled/definition67.js +80 -74
- package/unbundled/definition68.cjs +19 -344
- package/unbundled/definition68.js +15 -336
- package/unbundled/definition69.cjs +88 -26
- package/unbundled/definition69.js +86 -23
- package/unbundled/definition7.cjs +18 -3
- package/unbundled/definition7.js +19 -4
- package/unbundled/definition70.cjs +335 -111
- package/unbundled/definition70.js +326 -109
- package/unbundled/definition71.cjs +26 -271
- package/unbundled/definition71.js +22 -268
- package/unbundled/definition72.cjs +135 -27
- package/unbundled/definition72.js +126 -25
- package/unbundled/definition73.cjs +257 -113
- package/unbundled/definition73.js +255 -105
- package/unbundled/definition74.cjs +28 -212
- package/unbundled/definition74.js +26 -202
- package/unbundled/definition75.cjs +117 -479
- package/unbundled/definition75.js +110 -476
- package/unbundled/definition76.cjs +233 -0
- package/unbundled/definition76.js +214 -0
- package/unbundled/definition77.cjs +533 -0
- package/unbundled/definition77.js +513 -0
- package/unbundled/definition8.js +1 -1
- package/unbundled/definition9.cjs +9 -7
- package/unbundled/definition9.js +10 -8
- package/unbundled/delegates-aria.cjs +5 -60
- package/unbundled/delegates-aria.js +6 -60
- package/unbundled/divider.cjs +6 -0
- package/unbundled/divider.js +6 -0
- package/unbundled/form-element.cjs +7 -5
- package/unbundled/form-element.js +7 -5
- package/unbundled/host-semantics.cjs +10 -45
- package/unbundled/host-semantics.js +10 -44
- package/unbundled/mixins.js +1 -1
- package/unbundled/numberConverter.cjs +91 -0
- package/unbundled/numberConverter.js +74 -0
- package/unbundled/picker-field.template.cjs +22 -15
- package/unbundled/picker-field.template.js +22 -15
- package/unbundled/text-field.cjs +1 -1
- package/unbundled/text-field.js +1 -1
- package/unbundled/time-selection-picker.template.cjs +4 -3
- package/unbundled/time-selection-picker.template.js +5 -4
- package/unbundled/utils.cjs +1439 -0
- package/unbundled/utils.js +1428 -0
- package/unbundled/vivid-element.cjs +10 -1
- package/unbundled/vivid-element.js +5 -2
- package/video-player/definition.cjs +1 -1
- package/video-player/definition.js +1 -1
- package/video-player/index.cjs +24 -24
- package/video-player/index.js +3087 -3010
- package/visually-hidden/index.cjs +1 -1
- package/visually-hidden/index.js +0 -1
- package/vivid.api.json +514 -1
- package/bundled/attribute-binding-behaviour.cjs +0 -1
- package/bundled/attribute-binding-behaviour.js +0 -18
- package/bundled/strings.cjs +0 -1
- package/bundled/strings.js +0 -7
- package/shared/aria/delegate-aria-behavior.d.ts +0 -23
- package/shared/aria/host-semantics-behavior.d.ts +0 -19
- package/shared/templating/attribute-binding-behaviour.d.ts +0 -14
- package/unbundled/attribute-binding-behaviour.cjs +0 -37
- package/unbundled/attribute-binding-behaviour.js +0 -31
- /package/{lib/icon/icon.placeholder.d.ts → shared/icon/icon-placeholder.d.ts} +0 -0
package/tag/index.cjs
CHANGED
|
@@ -1,32 +1,32 @@
|
|
|
1
|
-
const e=require(`../bundled/localized.cjs`),t=require(`../bundled/vivid-element.cjs`),n=require(`../bundled/when.cjs`),r=require(`../bundled/definition2.cjs`),i=require(`../bundled/decorate.cjs`),a=require(`../bundled/affix.cjs`),o=require(`../bundled/delegates-aria.cjs`),s=require(`../bundled/class-names.cjs`);var c=class extends e.t(o.t(a.t(t.t))){constructor(...e){super(...e),this.removable=!1,this.disabled=!1,this.selectable=!1,this.selected=!1}remove(){!this.removable||this.selectable||(this.$emit(`removed`),this.parentElement&&this.parentElement.removeChild(this))}#e=()=>{!this.selectable||this.disabled||(this.selected=!this.selected,this.$emit(`selected-change`))};handleKeydown(e){return(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),this.#e()),(e.key===`Delete`||e.key===`Backspace`)&&(e.preventDefault(),this.remove()),!0}handleClick(){this.#e()}};i.t([t.l],c.prototype,`connotation`,void 0),i.t([t.l],c.prototype,`shape`,void 0),i.t([t.l],c.prototype,`appearance`,void 0),i.t([t.l],c.prototype,`label`,void 0),i.t([t.l({mode:`boolean`})],c.prototype,`removable`,void 0),i.t([t.l({mode:`boolean`})],c.prototype,`disabled`,void 0),i.t([t.l({mode:`boolean`})],c.prototype,`selectable`,void 0),i.t([t.l({mode:`boolean`})],c.prototype,`selected`,void 0);var l=`.base.connotation-cta{--_connotation-color-primary:var(--vvd-tag-cta-primary,var(--vvd-color-cta-500));--_connotation-color-primary-text:var(--vvd-tag-cta-primary-text,var(--vvd-color-canvas));--_connotation-color-soft:var(--vvd-tag-cta-soft,var(--vvd-color-cta-100));--_connotation-color-contrast:var(--vvd-tag-cta-contrast,var(--vvd-color-cta-800));--_connotation-color-pale:var(--vvd-tag-cta-pale,var(--vvd-color-cta-300));--_connotation-color-fierce:var(--vvd-tag-cta-fierce,var(--vvd-color-cta-700));--_connotation-color-firm:var(--vvd-tag-cta-firm,var(--vvd-color-cta-600));--_connotation-color-firm-all:var(--vvd-tag-cta-firm-all,var(--vvd-color-cta-600));--_connotation-color-faint:var(--vvd-tag-cta-faint,var(--vvd-color-cta-50));--_connotation-color-dim:var(--vvd-tag-cta-dim,var(--vvd-color-cta-200))}.base.connotation-success{--_connotation-color-primary:var(--vvd-tag-success-primary,var(--vvd-color-success-500));--_connotation-color-primary-text:var(--vvd-tag-success-primary-text,var(--vvd-color-canvas));--_connotation-color-soft:var(--vvd-tag-success-soft,var(--vvd-color-success-100));--_connotation-color-contrast:var(--vvd-tag-success-contrast,var(--vvd-color-success-800));--_connotation-color-pale:var(--vvd-tag-success-pale,var(--vvd-color-success-300));--_connotation-color-fierce:var(--vvd-tag-success-fierce,var(--vvd-color-success-700));--_connotation-color-firm:var(--vvd-tag-success-firm,var(--vvd-color-success-600));--_connotation-color-firm-all:var(--vvd-tag-success-firm-all,var(--vvd-color-success-600));--_connotation-color-faint:var(--vvd-tag-success-faint,var(--vvd-color-success-50));--_connotation-color-dim:var(--vvd-tag-success-dim,var(--vvd-color-success-200))}.base.connotation-alert{--_connotation-color-primary:var(--vvd-tag-alert-primary,var(--vvd-color-alert-500));--_connotation-color-primary-text:var(--vvd-tag-alert-primary-text,var(--vvd-color-canvas));--_connotation-color-soft:var(--vvd-tag-alert-soft,var(--vvd-color-alert-100));--_connotation-color-contrast:var(--vvd-tag-alert-contrast,var(--vvd-color-alert-800));--_connotation-color-pale:var(--vvd-tag-alert-pale,var(--vvd-color-alert-300));--_connotation-color-fierce:var(--vvd-tag-alert-fierce,var(--vvd-color-alert-700));--_connotation-color-firm:var(--vvd-tag-alert-firm,var(--vvd-color-alert-600));--_connotation-color-firm-all:var(--vvd-tag-alert-firm-all,var(--vvd-color-alert-600));--_connotation-color-faint:var(--vvd-tag-alert-faint,var(--vvd-color-alert-50));--_connotation-color-dim:var(--vvd-tag-alert-dim,var(--vvd-color-alert-200))}.base.connotation-warning{--_connotation-color-primary:var(--vvd-tag-warning-primary,var(--vvd-color-warning-300));--_connotation-color-primary-text:var(--vvd-tag-warning-primary-text,var(--vvd-color-canvas-text));--_connotation-color-soft:var(--vvd-tag-warning-soft,var(--vvd-color-warning-100));--_connotation-color-contrast:var(--vvd-tag-warning-contrast,var(--vvd-color-warning-800));--_connotation-color-pale:var(--vvd-tag-warning-pale,var(--vvd-color-warning-300));--_connotation-color-fierce:var(--vvd-tag-warning-fierce,var(--vvd-color-warning-700));--_connotation-color-firm:var(--vvd-tag-warning-firm,var(--vvd-color-warning-600));--_connotation-color-firm-all:var(--vvd-tag-warning-firm-all,var(--vvd-color-warning-600));--_connotation-color-faint:var(--vvd-tag-warning-faint,var(--vvd-color-warning-50));--_connotation-color-dim:var(--vvd-tag-warning-dim,var(--vvd-color-warning-200))}.base.connotation-information{--_connotation-color-primary:var(--vvd-tag-information-primary,var(--vvd-color-information-500));--_connotation-color-primary-text:var(--vvd-tag-information-primary-text,var(--vvd-color-canvas));--_connotation-color-soft:var(--vvd-tag-information-soft,var(--vvd-color-information-100));--_connotation-color-contrast:var(--vvd-tag-information-contrast,var(--vvd-color-information-800));--_connotation-color-pale:var(--vvd-tag-information-pale,var(--vvd-color-information-300));--_connotation-color-fierce:var(--vvd-tag-information-fierce,var(--vvd-color-information-700));--_connotation-color-firm:var(--vvd-tag-information-firm,var(--vvd-color-information-600));--_connotation-color-firm-all:var(--vvd-tag-information-firm-all,var(--vvd-color-information-600));--_connotation-color-faint:var(--vvd-tag-information-faint,var(--vvd-color-information-50));--_connotation-color-dim:var(--vvd-tag-information-dim,var(--vvd-color-information-200))}.base.connotation-announcement{--_connotation-color-primary:var(--vvd-tag-announcement-primary,var(--vvd-color-announcement-500));--_connotation-color-primary-text:var(--vvd-tag-announcement-primary-text,var(--vvd-color-canvas));--_connotation-color-soft:var(--vvd-tag-announcement-soft,var(--vvd-color-announcement-100));--_connotation-color-contrast:var(--vvd-tag-announcement-contrast,var(--vvd-color-announcement-800));--_connotation-color-pale:var(--vvd-tag-announcement-pale,var(--vvd-color-announcement-300));--_connotation-color-fierce:var(--vvd-tag-announcement-fierce,var(--vvd-color-announcement-700));--_connotation-color-firm:var(--vvd-tag-announcement-firm,var(--vvd-color-announcement-600));--_connotation-color-firm-all:var(--vvd-tag-announcement-firm-all,var(--vvd-color-announcement-600));--_connotation-color-faint:var(--vvd-tag-announcement-faint,var(--vvd-color-announcement-50));--_connotation-color-dim:var(--vvd-tag-announcement-dim,var(--vvd-color-announcement-200))}.base:not(.connotation-cta,.connotation-success,.connotation-alert,.connotation-warning,.connotation-information,.connotation-announcement){--_connotation-color-primary:var(--vvd-tag-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-tag-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-soft:var(--vvd-tag-accent-soft,var(--vvd-color-neutral-100));--_connotation-color-contrast:var(--vvd-tag-accent-contrast,var(--vvd-color-neutral-800));--_connotation-color-pale:var(--vvd-tag-accent-pale,var(--vvd-color-neutral-300));--_connotation-color-fierce:var(--vvd-tag-accent-fierce,var(--vvd-color-neutral-700));--_connotation-color-firm:var(--vvd-tag-accent-firm,var(--vvd-color-canvas-text));--_connotation-color-firm-all:var(--vvd-tag-accent-firm-all,var(--vvd-color-neutral-600));--_connotation-color-faint:var(--vvd-tag-accent-faint,var(--vvd-color-neutral-50));--_connotation-color-dim:var(--vvd-tag-accent-dim,var(--vvd-color-neutral-200))}.base{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.base.appearance-duotone{--_appearance-color-text:var(--_connotation-color-firm-all);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--_connotation-color-pale)}.base.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){.base:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-dim);--_appearance-color-outline:transparent}.base:hover:where(:not(.disabled,:disabled,.readonly)).appearance-duotone{--_appearance-color-text:var(--_connotation-color-firm-all);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--_connotation-color-firm-all)}.base: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}}.base.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-dim);--_appearance-color-outline:transparent}.base.hover:where(:not(.disabled,:disabled,.readonly)).appearance-duotone{--_appearance-color-text:var(--_connotation-color-firm-all);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--_connotation-color-firm-all)}.base.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}.base:active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-pale);--_appearance-color-outline:transparent}.base:active:where(:not(.disabled,:disabled)).appearance-duotone{--_appearance-color-text:var(--_connotation-color-firm-all);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:var(--_connotation-color-pale)}.base: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}.base.active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-pale);--_appearance-color-outline:transparent}.base.active:where(:not(.disabled,:disabled)).appearance-duotone{--_appearance-color-text:var(--_connotation-color-firm-all);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:var(--_connotation-color-pale)}.base.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}.base:disabled{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:transparent}.base:disabled.appearance-duotone{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-100)}.base:disabled.appearance-subtle-light,.base.disabled{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:transparent}.base.disabled.appearance-duotone{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-100)}.base.disabled.appearance-subtle-light{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:transparent}.base.selected:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary);--_appearance-color-outline:transparent}.base.selected:where(:not(.disabled,:disabled)).appearance-duotone{--_appearance-color-text:var(--_connotation-color-firm-all);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:var(--_connotation-color-pale)}.base.selected:where(:not(.disabled,:disabled)).appearance-subtle-light{--_appearance-color-text:var(--vvd-color-canvas);--_appearance-color-fill:var(--_connotation-color-firm);--_appearance-color-outline:transparent}.base{--tag-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16));box-sizing:border-box;background-color:var(--_appearance-color-fill);block-size:var(--tag-block-size);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);color:var(--_appearance-color-text);font:var(--vvd-typography-base-bold);vertical-align:middle;border:none;align-items:center;column-gap:8px;max-inline-size:100%;padding-inline:8px;display:inline-flex;position:relative}.base:not(.shape-pill){border-radius:4px}.base.shape-pill{border-radius:16px}.base:focus-visible{--focus-stroke-gap-color:transparent;box-shadow:0 0 0 4px color-mix(in srgb, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px))}@supports (user-select:none){.base{user-select:none}}.base:not(.disabled){cursor:pointer}.base.disabled{cursor:not-allowed;pointer-events:none}.base.removable{cursor:auto;padding-inline:8px 1px}.label{text-overflow:ellipsis;white-space:nowrap;max-inline-size:100%;overflow:hidden}slot[name=icon]{font-size:calc(var(--tag-block-size) / 1.5);line-height:1}.dismiss-button{border-radius:inherit;background-color:var(--_appearance-color-fill);cursor:pointer;border:none;align-items:center;padding:4px;display:flex;position:relative;inset-inline-start:-4px}.dismiss-button:focus-visible{--focus-stroke-gap-color:transparent;box-shadow:0 0 0 4px color-mix(in srgb, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px))}`,u=({connotation:e,appearance:t,shape:n,disabled:r,selectable:i,removable:a,selected:o})=>s.t(`base`,[`disabled`,r],[`selectable`,i],[`selected`,i&&o],[`removable`,a&&!i],[`connotation-${e}`,!!e],[`appearance-${t}`,!!t],[`shape-${n}`,!!n]);function d(e){return t.d`
|
|
1
|
+
const e=require(`../bundled/localized.cjs`),t=require(`../bundled/vivid-element.cjs`),n=require(`../bundled/when.cjs`),r=require(`../bundled/decorate.cjs`),i=require(`../bundled/definition2.cjs`),a=require(`../bundled/affix.cjs`),o=require(`../bundled/class-names.cjs`),s=require(`../bundled/delegates-aria.cjs`);var c=class extends e.t(s.t(a.t(t.t))){constructor(...e){super(...e),this.removable=!1,this.disabled=!1,this.selectable=!1,this.selected=!1,this.#e=()=>{!this.selectable||this.disabled||(this.selected=!this.selected,this.$emit(`selected-change`))}}remove(){!this.removable||this.selectable||(this.$emit(`removed`),this.parentElement&&this.parentElement.removeChild(this))}#e;handleKeydown(e){return(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),this.#e()),(e.key===`Delete`||e.key===`Backspace`)&&(e.preventDefault(),this.remove()),!0}handleClick(){this.#e()}};r.t([t.u],c.prototype,`connotation`,void 0),r.t([t.u],c.prototype,`shape`,void 0),r.t([t.u],c.prototype,`appearance`,void 0),r.t([t.u],c.prototype,`label`,void 0),r.t([t.u({mode:`boolean`})],c.prototype,`removable`,void 0),r.t([t.u({mode:`boolean`})],c.prototype,`disabled`,void 0),r.t([t.u({mode:`boolean`})],c.prototype,`selectable`,void 0),r.t([t.u({mode:`boolean`})],c.prototype,`selected`,void 0);var l=`.base.connotation-cta{--_connotation-color-primary:var(--vvd-tag-cta-primary,var(--vvd-color-cta-500));--_connotation-color-primary-text:var(--vvd-tag-cta-primary-text,var(--vvd-color-canvas));--_connotation-color-soft:var(--vvd-tag-cta-soft,var(--vvd-color-cta-100));--_connotation-color-contrast:var(--vvd-tag-cta-contrast,var(--vvd-color-cta-800));--_connotation-color-pale:var(--vvd-tag-cta-pale,var(--vvd-color-cta-300));--_connotation-color-fierce:var(--vvd-tag-cta-fierce,var(--vvd-color-cta-700));--_connotation-color-firm:var(--vvd-tag-cta-firm,var(--vvd-color-cta-600));--_connotation-color-firm-all:var(--vvd-tag-cta-firm-all,var(--vvd-color-cta-600));--_connotation-color-faint:var(--vvd-tag-cta-faint,var(--vvd-color-cta-50));--_connotation-color-dim:var(--vvd-tag-cta-dim,var(--vvd-color-cta-200))}.base.connotation-success{--_connotation-color-primary:var(--vvd-tag-success-primary,var(--vvd-color-success-500));--_connotation-color-primary-text:var(--vvd-tag-success-primary-text,var(--vvd-color-canvas));--_connotation-color-soft:var(--vvd-tag-success-soft,var(--vvd-color-success-100));--_connotation-color-contrast:var(--vvd-tag-success-contrast,var(--vvd-color-success-800));--_connotation-color-pale:var(--vvd-tag-success-pale,var(--vvd-color-success-300));--_connotation-color-fierce:var(--vvd-tag-success-fierce,var(--vvd-color-success-700));--_connotation-color-firm:var(--vvd-tag-success-firm,var(--vvd-color-success-600));--_connotation-color-firm-all:var(--vvd-tag-success-firm-all,var(--vvd-color-success-600));--_connotation-color-faint:var(--vvd-tag-success-faint,var(--vvd-color-success-50));--_connotation-color-dim:var(--vvd-tag-success-dim,var(--vvd-color-success-200))}.base.connotation-alert{--_connotation-color-primary:var(--vvd-tag-alert-primary,var(--vvd-color-alert-500));--_connotation-color-primary-text:var(--vvd-tag-alert-primary-text,var(--vvd-color-canvas));--_connotation-color-soft:var(--vvd-tag-alert-soft,var(--vvd-color-alert-100));--_connotation-color-contrast:var(--vvd-tag-alert-contrast,var(--vvd-color-alert-800));--_connotation-color-pale:var(--vvd-tag-alert-pale,var(--vvd-color-alert-300));--_connotation-color-fierce:var(--vvd-tag-alert-fierce,var(--vvd-color-alert-700));--_connotation-color-firm:var(--vvd-tag-alert-firm,var(--vvd-color-alert-600));--_connotation-color-firm-all:var(--vvd-tag-alert-firm-all,var(--vvd-color-alert-600));--_connotation-color-faint:var(--vvd-tag-alert-faint,var(--vvd-color-alert-50));--_connotation-color-dim:var(--vvd-tag-alert-dim,var(--vvd-color-alert-200))}.base.connotation-warning{--_connotation-color-primary:var(--vvd-tag-warning-primary,var(--vvd-color-warning-300));--_connotation-color-primary-text:var(--vvd-tag-warning-primary-text,var(--vvd-color-canvas-text));--_connotation-color-soft:var(--vvd-tag-warning-soft,var(--vvd-color-warning-100));--_connotation-color-contrast:var(--vvd-tag-warning-contrast,var(--vvd-color-warning-800));--_connotation-color-pale:var(--vvd-tag-warning-pale,var(--vvd-color-warning-300));--_connotation-color-fierce:var(--vvd-tag-warning-fierce,var(--vvd-color-warning-700));--_connotation-color-firm:var(--vvd-tag-warning-firm,var(--vvd-color-warning-600));--_connotation-color-firm-all:var(--vvd-tag-warning-firm-all,var(--vvd-color-warning-600));--_connotation-color-faint:var(--vvd-tag-warning-faint,var(--vvd-color-warning-50));--_connotation-color-dim:var(--vvd-tag-warning-dim,var(--vvd-color-warning-200))}.base.connotation-information{--_connotation-color-primary:var(--vvd-tag-information-primary,var(--vvd-color-information-500));--_connotation-color-primary-text:var(--vvd-tag-information-primary-text,var(--vvd-color-canvas));--_connotation-color-soft:var(--vvd-tag-information-soft,var(--vvd-color-information-100));--_connotation-color-contrast:var(--vvd-tag-information-contrast,var(--vvd-color-information-800));--_connotation-color-pale:var(--vvd-tag-information-pale,var(--vvd-color-information-300));--_connotation-color-fierce:var(--vvd-tag-information-fierce,var(--vvd-color-information-700));--_connotation-color-firm:var(--vvd-tag-information-firm,var(--vvd-color-information-600));--_connotation-color-firm-all:var(--vvd-tag-information-firm-all,var(--vvd-color-information-600));--_connotation-color-faint:var(--vvd-tag-information-faint,var(--vvd-color-information-50));--_connotation-color-dim:var(--vvd-tag-information-dim,var(--vvd-color-information-200))}.base.connotation-announcement{--_connotation-color-primary:var(--vvd-tag-announcement-primary,var(--vvd-color-announcement-500));--_connotation-color-primary-text:var(--vvd-tag-announcement-primary-text,var(--vvd-color-canvas));--_connotation-color-soft:var(--vvd-tag-announcement-soft,var(--vvd-color-announcement-100));--_connotation-color-contrast:var(--vvd-tag-announcement-contrast,var(--vvd-color-announcement-800));--_connotation-color-pale:var(--vvd-tag-announcement-pale,var(--vvd-color-announcement-300));--_connotation-color-fierce:var(--vvd-tag-announcement-fierce,var(--vvd-color-announcement-700));--_connotation-color-firm:var(--vvd-tag-announcement-firm,var(--vvd-color-announcement-600));--_connotation-color-firm-all:var(--vvd-tag-announcement-firm-all,var(--vvd-color-announcement-600));--_connotation-color-faint:var(--vvd-tag-announcement-faint,var(--vvd-color-announcement-50));--_connotation-color-dim:var(--vvd-tag-announcement-dim,var(--vvd-color-announcement-200))}.base:not(.connotation-cta,.connotation-success,.connotation-alert,.connotation-warning,.connotation-information,.connotation-announcement){--_connotation-color-primary:var(--vvd-tag-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-tag-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-soft:var(--vvd-tag-accent-soft,var(--vvd-color-neutral-100));--_connotation-color-contrast:var(--vvd-tag-accent-contrast,var(--vvd-color-neutral-800));--_connotation-color-pale:var(--vvd-tag-accent-pale,var(--vvd-color-neutral-300));--_connotation-color-fierce:var(--vvd-tag-accent-fierce,var(--vvd-color-neutral-700));--_connotation-color-firm:var(--vvd-tag-accent-firm,var(--vvd-color-canvas-text));--_connotation-color-firm-all:var(--vvd-tag-accent-firm-all,var(--vvd-color-neutral-600));--_connotation-color-faint:var(--vvd-tag-accent-faint,var(--vvd-color-neutral-50));--_connotation-color-dim:var(--vvd-tag-accent-dim,var(--vvd-color-neutral-200))}.base{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.base.appearance-duotone{--_appearance-color-text:var(--_connotation-color-firm-all);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--_connotation-color-pale)}.base.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){.base:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-dim);--_appearance-color-outline:transparent}.base:hover:where(:not(.disabled,:disabled,.readonly)).appearance-duotone{--_appearance-color-text:var(--_connotation-color-firm-all);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--_connotation-color-firm-all)}.base: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}}.base.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-dim);--_appearance-color-outline:transparent}.base.hover:where(:not(.disabled,:disabled,.readonly)).appearance-duotone{--_appearance-color-text:var(--_connotation-color-firm-all);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--_connotation-color-firm-all)}.base.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}.base:active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-pale);--_appearance-color-outline:transparent}.base:active:where(:not(.disabled,:disabled)).appearance-duotone{--_appearance-color-text:var(--_connotation-color-firm-all);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:var(--_connotation-color-pale)}.base: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}.base.active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-pale);--_appearance-color-outline:transparent}.base.active:where(:not(.disabled,:disabled)).appearance-duotone{--_appearance-color-text:var(--_connotation-color-firm-all);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:var(--_connotation-color-pale)}.base.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}.base:disabled{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:transparent}.base:disabled.appearance-duotone{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-100)}.base:disabled.appearance-subtle-light,.base.disabled{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:transparent}.base.disabled.appearance-duotone{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-100)}.base.disabled.appearance-subtle-light{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:transparent}.base.selected:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary);--_appearance-color-outline:transparent}.base.selected:where(:not(.disabled,:disabled)).appearance-duotone{--_appearance-color-text:var(--_connotation-color-firm-all);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:var(--_connotation-color-pale)}.base.selected:where(:not(.disabled,:disabled)).appearance-subtle-light{--_appearance-color-text:var(--vvd-color-canvas);--_appearance-color-fill:var(--_connotation-color-firm);--_appearance-color-outline:transparent}.base{--tag-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16));box-sizing:border-box;background-color:var(--_appearance-color-fill);block-size:var(--tag-block-size);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);color:var(--_appearance-color-text);font:var(--vvd-typography-base-bold);vertical-align:middle;border:none;align-items:center;column-gap:8px;max-inline-size:100%;padding-inline:8px;display:inline-flex;position:relative}.base:not(.shape-pill){border-radius:4px}.base.shape-pill{border-radius:16px}.base:focus-visible{--focus-stroke-gap-color:transparent;box-shadow:0 0 0 4px color-mix(in srgb, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px))}@supports (user-select:none){.base{user-select:none}}.base:not(.disabled){cursor:pointer}.base.disabled{cursor:not-allowed;pointer-events:none}.base.removable{cursor:auto;padding-inline:8px 1px}.label{text-overflow:ellipsis;white-space:nowrap;max-inline-size:100%;overflow:hidden}slot[name=icon]{font-size:calc(var(--tag-block-size) / 1.5);line-height:1}.dismiss-button{border-radius:inherit;background-color:var(--_appearance-color-fill);cursor:pointer;border:none;align-items:center;padding:4px;display:flex;position:relative;inset-inline-start:-4px}.dismiss-button:focus-visible{--focus-stroke-gap-color:transparent;box-shadow:0 0 0 4px color-mix(in srgb, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px))}`,u=({connotation:e,appearance:t,shape:n,disabled:r,selectable:i,removable:a,selected:s})=>o.t(`base`,[`disabled`,r],[`selectable`,i],[`selected`,i&&s],[`removable`,a&&!i],[`connotation-${e}`,!!e],[`appearance-${t}`,!!t],[`shape-${n}`,!!n]);function d(e){return t.f`
|
|
2
2
|
<button
|
|
3
3
|
class="dismiss-button"
|
|
4
4
|
aria-label="${e=>e.locale.tag.remove(e.label)}"
|
|
5
5
|
?disabled="${e=>e.disabled}"
|
|
6
6
|
@click="${e=>e.remove()}">
|
|
7
7
|
<${e} name="close-line"></${e}>
|
|
8
|
-
</button>`}var f=t.
|
|
9
|
-
${e=>
|
|
10
|
-
${n.t(e=>e.label,e=>t.
|
|
11
|
-
${n.t(e=>e.removable&&!e.selectable,d(
|
|
12
|
-
${n.t(e=>e.selectable&&e.selected,t.
|
|
13
|
-
`;return t.
|
|
14
|
-
${n.t(e=>e.selectable,t.
|
|
8
|
+
</button>`}var f=t.s(`tag`,c,e=>{let r=a.a(e),o=e.tagFor(i.r),c=t.f`
|
|
9
|
+
${e=>r(e.icon,a.i.Slot)}
|
|
10
|
+
${n.t(e=>e.label,e=>t.f`<span class="label">${e.label}</span>`)}
|
|
11
|
+
${n.t(e=>e.removable&&!e.selectable,d(o))}
|
|
12
|
+
${n.t(e=>e.selectable&&e.selected,t.f`<${o} class="selectable-icon" name="check-circle-solid"></${o}>`)}
|
|
13
|
+
`;return t.f`
|
|
14
|
+
${n.t(e=>e.selectable,t.f`<button
|
|
15
15
|
class="${u}"
|
|
16
|
-
${
|
|
16
|
+
${s.n({ariaPressed:e=>e.selected})}
|
|
17
17
|
?disabled="${e=>e.disabled}"
|
|
18
18
|
@keydown="${(e,t)=>e.handleKeydown(t.event)}"
|
|
19
19
|
@click="${e=>e.handleClick()}"
|
|
20
20
|
>
|
|
21
21
|
${c}
|
|
22
22
|
</button>`)}
|
|
23
|
-
${n.t(e=>!e.selectable,t.
|
|
23
|
+
${n.t(e=>!e.selectable,t.f`<span
|
|
24
24
|
class="${u}"
|
|
25
|
-
${
|
|
25
|
+
${s.n()}
|
|
26
26
|
tabindex="${e=>e.disabled||e.removable?null:0}"
|
|
27
27
|
@keydown="${(e,t)=>e.handleKeydown(t.event)}"
|
|
28
28
|
@click="${e=>e.handleClick()}"
|
|
29
29
|
>
|
|
30
30
|
${c}
|
|
31
31
|
</span>`)}
|
|
32
|
-
`},[
|
|
32
|
+
`},[i.t],{styles:l,shadowOptions:{delegatesFocus:!0}});t.c(f)();
|
package/tag/index.js
CHANGED
|
@@ -1,22 +1,22 @@
|
|
|
1
1
|
import { t as e } from "../bundled/localized.js";
|
|
2
|
-
import {
|
|
2
|
+
import { c as t, f as n, s as r, t as i, u as a } from "../bundled/vivid-element.js";
|
|
3
3
|
import { t as o } from "../bundled/when.js";
|
|
4
|
-
import {
|
|
5
|
-
import { t as l } from "../bundled/
|
|
4
|
+
import { t as s } from "../bundled/decorate.js";
|
|
5
|
+
import { r as c, t as l } from "../bundled/definition2.js";
|
|
6
6
|
import { a as u, i as d, t as f } from "../bundled/affix.js";
|
|
7
|
-
import {
|
|
8
|
-
import { t as h } from "../bundled/
|
|
7
|
+
import { t as p } from "../bundled/class-names.js";
|
|
8
|
+
import { n as m, t as h } from "../bundled/delegates-aria.js";
|
|
9
9
|
//#region src/lib/tag/tag.ts
|
|
10
|
-
var g = class extends e(
|
|
10
|
+
var g = class extends e(h(f(i))) {
|
|
11
11
|
constructor(...e) {
|
|
12
|
-
super(...e), this.removable = !1, this.disabled = !1, this.selectable = !1, this.selected = !1
|
|
12
|
+
super(...e), this.removable = !1, this.disabled = !1, this.selectable = !1, this.selected = !1, this.#e = () => {
|
|
13
|
+
!this.selectable || this.disabled || (this.selected = !this.selected, this.$emit("selected-change"));
|
|
14
|
+
};
|
|
13
15
|
}
|
|
14
16
|
remove() {
|
|
15
17
|
!this.removable || this.selectable || (this.$emit("removed"), this.parentElement && this.parentElement.removeChild(this));
|
|
16
18
|
}
|
|
17
|
-
#e
|
|
18
|
-
!this.selectable || this.disabled || (this.selected = !this.selected, this.$emit("selected-change"));
|
|
19
|
-
};
|
|
19
|
+
#e;
|
|
20
20
|
handleKeydown(e) {
|
|
21
21
|
return (e.key === "Enter" || e.key === " ") && (e.preventDefault(), this.#e()), (e.key === "Delete" || e.key === "Backspace") && (e.preventDefault(), this.remove()), !0;
|
|
22
22
|
}
|
|
@@ -24,12 +24,12 @@ var g = class extends e(m(f(a))) {
|
|
|
24
24
|
this.#e();
|
|
25
25
|
}
|
|
26
26
|
};
|
|
27
|
-
|
|
27
|
+
s([a], g.prototype, "connotation", void 0), s([a], g.prototype, "shape", void 0), s([a], g.prototype, "appearance", void 0), s([a], g.prototype, "label", void 0), s([a({ mode: "boolean" })], g.prototype, "removable", void 0), s([a({ mode: "boolean" })], g.prototype, "disabled", void 0), s([a({ mode: "boolean" })], g.prototype, "selectable", void 0), s([a({ mode: "boolean" })], g.prototype, "selected", void 0);
|
|
28
28
|
//#endregion
|
|
29
29
|
//#region src/lib/tag/tag.scss?inline
|
|
30
|
-
var _ = ".base.connotation-cta{--_connotation-color-primary:var(--vvd-tag-cta-primary,var(--vvd-color-cta-500));--_connotation-color-primary-text:var(--vvd-tag-cta-primary-text,var(--vvd-color-canvas));--_connotation-color-soft:var(--vvd-tag-cta-soft,var(--vvd-color-cta-100));--_connotation-color-contrast:var(--vvd-tag-cta-contrast,var(--vvd-color-cta-800));--_connotation-color-pale:var(--vvd-tag-cta-pale,var(--vvd-color-cta-300));--_connotation-color-fierce:var(--vvd-tag-cta-fierce,var(--vvd-color-cta-700));--_connotation-color-firm:var(--vvd-tag-cta-firm,var(--vvd-color-cta-600));--_connotation-color-firm-all:var(--vvd-tag-cta-firm-all,var(--vvd-color-cta-600));--_connotation-color-faint:var(--vvd-tag-cta-faint,var(--vvd-color-cta-50));--_connotation-color-dim:var(--vvd-tag-cta-dim,var(--vvd-color-cta-200))}.base.connotation-success{--_connotation-color-primary:var(--vvd-tag-success-primary,var(--vvd-color-success-500));--_connotation-color-primary-text:var(--vvd-tag-success-primary-text,var(--vvd-color-canvas));--_connotation-color-soft:var(--vvd-tag-success-soft,var(--vvd-color-success-100));--_connotation-color-contrast:var(--vvd-tag-success-contrast,var(--vvd-color-success-800));--_connotation-color-pale:var(--vvd-tag-success-pale,var(--vvd-color-success-300));--_connotation-color-fierce:var(--vvd-tag-success-fierce,var(--vvd-color-success-700));--_connotation-color-firm:var(--vvd-tag-success-firm,var(--vvd-color-success-600));--_connotation-color-firm-all:var(--vvd-tag-success-firm-all,var(--vvd-color-success-600));--_connotation-color-faint:var(--vvd-tag-success-faint,var(--vvd-color-success-50));--_connotation-color-dim:var(--vvd-tag-success-dim,var(--vvd-color-success-200))}.base.connotation-alert{--_connotation-color-primary:var(--vvd-tag-alert-primary,var(--vvd-color-alert-500));--_connotation-color-primary-text:var(--vvd-tag-alert-primary-text,var(--vvd-color-canvas));--_connotation-color-soft:var(--vvd-tag-alert-soft,var(--vvd-color-alert-100));--_connotation-color-contrast:var(--vvd-tag-alert-contrast,var(--vvd-color-alert-800));--_connotation-color-pale:var(--vvd-tag-alert-pale,var(--vvd-color-alert-300));--_connotation-color-fierce:var(--vvd-tag-alert-fierce,var(--vvd-color-alert-700));--_connotation-color-firm:var(--vvd-tag-alert-firm,var(--vvd-color-alert-600));--_connotation-color-firm-all:var(--vvd-tag-alert-firm-all,var(--vvd-color-alert-600));--_connotation-color-faint:var(--vvd-tag-alert-faint,var(--vvd-color-alert-50));--_connotation-color-dim:var(--vvd-tag-alert-dim,var(--vvd-color-alert-200))}.base.connotation-warning{--_connotation-color-primary:var(--vvd-tag-warning-primary,var(--vvd-color-warning-300));--_connotation-color-primary-text:var(--vvd-tag-warning-primary-text,var(--vvd-color-canvas-text));--_connotation-color-soft:var(--vvd-tag-warning-soft,var(--vvd-color-warning-100));--_connotation-color-contrast:var(--vvd-tag-warning-contrast,var(--vvd-color-warning-800));--_connotation-color-pale:var(--vvd-tag-warning-pale,var(--vvd-color-warning-300));--_connotation-color-fierce:var(--vvd-tag-warning-fierce,var(--vvd-color-warning-700));--_connotation-color-firm:var(--vvd-tag-warning-firm,var(--vvd-color-warning-600));--_connotation-color-firm-all:var(--vvd-tag-warning-firm-all,var(--vvd-color-warning-600));--_connotation-color-faint:var(--vvd-tag-warning-faint,var(--vvd-color-warning-50));--_connotation-color-dim:var(--vvd-tag-warning-dim,var(--vvd-color-warning-200))}.base.connotation-information{--_connotation-color-primary:var(--vvd-tag-information-primary,var(--vvd-color-information-500));--_connotation-color-primary-text:var(--vvd-tag-information-primary-text,var(--vvd-color-canvas));--_connotation-color-soft:var(--vvd-tag-information-soft,var(--vvd-color-information-100));--_connotation-color-contrast:var(--vvd-tag-information-contrast,var(--vvd-color-information-800));--_connotation-color-pale:var(--vvd-tag-information-pale,var(--vvd-color-information-300));--_connotation-color-fierce:var(--vvd-tag-information-fierce,var(--vvd-color-information-700));--_connotation-color-firm:var(--vvd-tag-information-firm,var(--vvd-color-information-600));--_connotation-color-firm-all:var(--vvd-tag-information-firm-all,var(--vvd-color-information-600));--_connotation-color-faint:var(--vvd-tag-information-faint,var(--vvd-color-information-50));--_connotation-color-dim:var(--vvd-tag-information-dim,var(--vvd-color-information-200))}.base.connotation-announcement{--_connotation-color-primary:var(--vvd-tag-announcement-primary,var(--vvd-color-announcement-500));--_connotation-color-primary-text:var(--vvd-tag-announcement-primary-text,var(--vvd-color-canvas));--_connotation-color-soft:var(--vvd-tag-announcement-soft,var(--vvd-color-announcement-100));--_connotation-color-contrast:var(--vvd-tag-announcement-contrast,var(--vvd-color-announcement-800));--_connotation-color-pale:var(--vvd-tag-announcement-pale,var(--vvd-color-announcement-300));--_connotation-color-fierce:var(--vvd-tag-announcement-fierce,var(--vvd-color-announcement-700));--_connotation-color-firm:var(--vvd-tag-announcement-firm,var(--vvd-color-announcement-600));--_connotation-color-firm-all:var(--vvd-tag-announcement-firm-all,var(--vvd-color-announcement-600));--_connotation-color-faint:var(--vvd-tag-announcement-faint,var(--vvd-color-announcement-50));--_connotation-color-dim:var(--vvd-tag-announcement-dim,var(--vvd-color-announcement-200))}.base:not(.connotation-cta,.connotation-success,.connotation-alert,.connotation-warning,.connotation-information,.connotation-announcement){--_connotation-color-primary:var(--vvd-tag-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-tag-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-soft:var(--vvd-tag-accent-soft,var(--vvd-color-neutral-100));--_connotation-color-contrast:var(--vvd-tag-accent-contrast,var(--vvd-color-neutral-800));--_connotation-color-pale:var(--vvd-tag-accent-pale,var(--vvd-color-neutral-300));--_connotation-color-fierce:var(--vvd-tag-accent-fierce,var(--vvd-color-neutral-700));--_connotation-color-firm:var(--vvd-tag-accent-firm,var(--vvd-color-canvas-text));--_connotation-color-firm-all:var(--vvd-tag-accent-firm-all,var(--vvd-color-neutral-600));--_connotation-color-faint:var(--vvd-tag-accent-faint,var(--vvd-color-neutral-50));--_connotation-color-dim:var(--vvd-tag-accent-dim,var(--vvd-color-neutral-200))}.base{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.base.appearance-duotone{--_appearance-color-text:var(--_connotation-color-firm-all);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--_connotation-color-pale)}.base.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){.base:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-dim);--_appearance-color-outline:transparent}.base:hover:where(:not(.disabled,:disabled,.readonly)).appearance-duotone{--_appearance-color-text:var(--_connotation-color-firm-all);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--_connotation-color-firm-all)}.base: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}}.base.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-dim);--_appearance-color-outline:transparent}.base.hover:where(:not(.disabled,:disabled,.readonly)).appearance-duotone{--_appearance-color-text:var(--_connotation-color-firm-all);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--_connotation-color-firm-all)}.base.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}.base:active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-pale);--_appearance-color-outline:transparent}.base:active:where(:not(.disabled,:disabled)).appearance-duotone{--_appearance-color-text:var(--_connotation-color-firm-all);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:var(--_connotation-color-pale)}.base: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}.base.active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-pale);--_appearance-color-outline:transparent}.base.active:where(:not(.disabled,:disabled)).appearance-duotone{--_appearance-color-text:var(--_connotation-color-firm-all);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:var(--_connotation-color-pale)}.base.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}.base:disabled{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:transparent}.base:disabled.appearance-duotone{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-100)}.base:disabled.appearance-subtle-light,.base.disabled{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:transparent}.base.disabled.appearance-duotone{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-100)}.base.disabled.appearance-subtle-light{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:transparent}.base.selected:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary);--_appearance-color-outline:transparent}.base.selected:where(:not(.disabled,:disabled)).appearance-duotone{--_appearance-color-text:var(--_connotation-color-firm-all);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:var(--_connotation-color-pale)}.base.selected:where(:not(.disabled,:disabled)).appearance-subtle-light{--_appearance-color-text:var(--vvd-color-canvas);--_appearance-color-fill:var(--_connotation-color-firm);--_appearance-color-outline:transparent}.base{--tag-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16));box-sizing:border-box;background-color:var(--_appearance-color-fill);block-size:var(--tag-block-size);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);color:var(--_appearance-color-text);font:var(--vvd-typography-base-bold);vertical-align:middle;border:none;align-items:center;column-gap:8px;max-inline-size:100%;padding-inline:8px;display:inline-flex;position:relative}.base:not(.shape-pill){border-radius:4px}.base.shape-pill{border-radius:16px}.base:focus-visible{--focus-stroke-gap-color:transparent;box-shadow:0 0 0 4px color-mix(in srgb, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px))}@supports (user-select:none){.base{user-select:none}}.base:not(.disabled){cursor:pointer}.base.disabled{cursor:not-allowed;pointer-events:none}.base.removable{cursor:auto;padding-inline:8px 1px}.label{text-overflow:ellipsis;white-space:nowrap;max-inline-size:100%;overflow:hidden}slot[name=icon]{font-size:calc(var(--tag-block-size) / 1.5);line-height:1}.dismiss-button{border-radius:inherit;background-color:var(--_appearance-color-fill);cursor:pointer;border:none;align-items:center;padding:4px;display:flex;position:relative;inset-inline-start:-4px}.dismiss-button:focus-visible{--focus-stroke-gap-color:transparent;box-shadow:0 0 0 4px color-mix(in srgb, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px))}", v = ({ connotation: e, appearance: t, shape: n, disabled: r, selectable: i, removable: a, selected: o }) => h("base", ["disabled", r], ["selectable", i], ["selected", i && o], ["removable", a && !i], [`connotation-${e}`, !!e], [`appearance-${t}`, !!t], [`shape-${n}`, !!n]);
|
|
30
|
+
var _ = ".base.connotation-cta{--_connotation-color-primary:var(--vvd-tag-cta-primary,var(--vvd-color-cta-500));--_connotation-color-primary-text:var(--vvd-tag-cta-primary-text,var(--vvd-color-canvas));--_connotation-color-soft:var(--vvd-tag-cta-soft,var(--vvd-color-cta-100));--_connotation-color-contrast:var(--vvd-tag-cta-contrast,var(--vvd-color-cta-800));--_connotation-color-pale:var(--vvd-tag-cta-pale,var(--vvd-color-cta-300));--_connotation-color-fierce:var(--vvd-tag-cta-fierce,var(--vvd-color-cta-700));--_connotation-color-firm:var(--vvd-tag-cta-firm,var(--vvd-color-cta-600));--_connotation-color-firm-all:var(--vvd-tag-cta-firm-all,var(--vvd-color-cta-600));--_connotation-color-faint:var(--vvd-tag-cta-faint,var(--vvd-color-cta-50));--_connotation-color-dim:var(--vvd-tag-cta-dim,var(--vvd-color-cta-200))}.base.connotation-success{--_connotation-color-primary:var(--vvd-tag-success-primary,var(--vvd-color-success-500));--_connotation-color-primary-text:var(--vvd-tag-success-primary-text,var(--vvd-color-canvas));--_connotation-color-soft:var(--vvd-tag-success-soft,var(--vvd-color-success-100));--_connotation-color-contrast:var(--vvd-tag-success-contrast,var(--vvd-color-success-800));--_connotation-color-pale:var(--vvd-tag-success-pale,var(--vvd-color-success-300));--_connotation-color-fierce:var(--vvd-tag-success-fierce,var(--vvd-color-success-700));--_connotation-color-firm:var(--vvd-tag-success-firm,var(--vvd-color-success-600));--_connotation-color-firm-all:var(--vvd-tag-success-firm-all,var(--vvd-color-success-600));--_connotation-color-faint:var(--vvd-tag-success-faint,var(--vvd-color-success-50));--_connotation-color-dim:var(--vvd-tag-success-dim,var(--vvd-color-success-200))}.base.connotation-alert{--_connotation-color-primary:var(--vvd-tag-alert-primary,var(--vvd-color-alert-500));--_connotation-color-primary-text:var(--vvd-tag-alert-primary-text,var(--vvd-color-canvas));--_connotation-color-soft:var(--vvd-tag-alert-soft,var(--vvd-color-alert-100));--_connotation-color-contrast:var(--vvd-tag-alert-contrast,var(--vvd-color-alert-800));--_connotation-color-pale:var(--vvd-tag-alert-pale,var(--vvd-color-alert-300));--_connotation-color-fierce:var(--vvd-tag-alert-fierce,var(--vvd-color-alert-700));--_connotation-color-firm:var(--vvd-tag-alert-firm,var(--vvd-color-alert-600));--_connotation-color-firm-all:var(--vvd-tag-alert-firm-all,var(--vvd-color-alert-600));--_connotation-color-faint:var(--vvd-tag-alert-faint,var(--vvd-color-alert-50));--_connotation-color-dim:var(--vvd-tag-alert-dim,var(--vvd-color-alert-200))}.base.connotation-warning{--_connotation-color-primary:var(--vvd-tag-warning-primary,var(--vvd-color-warning-300));--_connotation-color-primary-text:var(--vvd-tag-warning-primary-text,var(--vvd-color-canvas-text));--_connotation-color-soft:var(--vvd-tag-warning-soft,var(--vvd-color-warning-100));--_connotation-color-contrast:var(--vvd-tag-warning-contrast,var(--vvd-color-warning-800));--_connotation-color-pale:var(--vvd-tag-warning-pale,var(--vvd-color-warning-300));--_connotation-color-fierce:var(--vvd-tag-warning-fierce,var(--vvd-color-warning-700));--_connotation-color-firm:var(--vvd-tag-warning-firm,var(--vvd-color-warning-600));--_connotation-color-firm-all:var(--vvd-tag-warning-firm-all,var(--vvd-color-warning-600));--_connotation-color-faint:var(--vvd-tag-warning-faint,var(--vvd-color-warning-50));--_connotation-color-dim:var(--vvd-tag-warning-dim,var(--vvd-color-warning-200))}.base.connotation-information{--_connotation-color-primary:var(--vvd-tag-information-primary,var(--vvd-color-information-500));--_connotation-color-primary-text:var(--vvd-tag-information-primary-text,var(--vvd-color-canvas));--_connotation-color-soft:var(--vvd-tag-information-soft,var(--vvd-color-information-100));--_connotation-color-contrast:var(--vvd-tag-information-contrast,var(--vvd-color-information-800));--_connotation-color-pale:var(--vvd-tag-information-pale,var(--vvd-color-information-300));--_connotation-color-fierce:var(--vvd-tag-information-fierce,var(--vvd-color-information-700));--_connotation-color-firm:var(--vvd-tag-information-firm,var(--vvd-color-information-600));--_connotation-color-firm-all:var(--vvd-tag-information-firm-all,var(--vvd-color-information-600));--_connotation-color-faint:var(--vvd-tag-information-faint,var(--vvd-color-information-50));--_connotation-color-dim:var(--vvd-tag-information-dim,var(--vvd-color-information-200))}.base.connotation-announcement{--_connotation-color-primary:var(--vvd-tag-announcement-primary,var(--vvd-color-announcement-500));--_connotation-color-primary-text:var(--vvd-tag-announcement-primary-text,var(--vvd-color-canvas));--_connotation-color-soft:var(--vvd-tag-announcement-soft,var(--vvd-color-announcement-100));--_connotation-color-contrast:var(--vvd-tag-announcement-contrast,var(--vvd-color-announcement-800));--_connotation-color-pale:var(--vvd-tag-announcement-pale,var(--vvd-color-announcement-300));--_connotation-color-fierce:var(--vvd-tag-announcement-fierce,var(--vvd-color-announcement-700));--_connotation-color-firm:var(--vvd-tag-announcement-firm,var(--vvd-color-announcement-600));--_connotation-color-firm-all:var(--vvd-tag-announcement-firm-all,var(--vvd-color-announcement-600));--_connotation-color-faint:var(--vvd-tag-announcement-faint,var(--vvd-color-announcement-50));--_connotation-color-dim:var(--vvd-tag-announcement-dim,var(--vvd-color-announcement-200))}.base:not(.connotation-cta,.connotation-success,.connotation-alert,.connotation-warning,.connotation-information,.connotation-announcement){--_connotation-color-primary:var(--vvd-tag-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-tag-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-soft:var(--vvd-tag-accent-soft,var(--vvd-color-neutral-100));--_connotation-color-contrast:var(--vvd-tag-accent-contrast,var(--vvd-color-neutral-800));--_connotation-color-pale:var(--vvd-tag-accent-pale,var(--vvd-color-neutral-300));--_connotation-color-fierce:var(--vvd-tag-accent-fierce,var(--vvd-color-neutral-700));--_connotation-color-firm:var(--vvd-tag-accent-firm,var(--vvd-color-canvas-text));--_connotation-color-firm-all:var(--vvd-tag-accent-firm-all,var(--vvd-color-neutral-600));--_connotation-color-faint:var(--vvd-tag-accent-faint,var(--vvd-color-neutral-50));--_connotation-color-dim:var(--vvd-tag-accent-dim,var(--vvd-color-neutral-200))}.base{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.base.appearance-duotone{--_appearance-color-text:var(--_connotation-color-firm-all);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--_connotation-color-pale)}.base.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){.base:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-dim);--_appearance-color-outline:transparent}.base:hover:where(:not(.disabled,:disabled,.readonly)).appearance-duotone{--_appearance-color-text:var(--_connotation-color-firm-all);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--_connotation-color-firm-all)}.base: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}}.base.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-dim);--_appearance-color-outline:transparent}.base.hover:where(:not(.disabled,:disabled,.readonly)).appearance-duotone{--_appearance-color-text:var(--_connotation-color-firm-all);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--_connotation-color-firm-all)}.base.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}.base:active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-pale);--_appearance-color-outline:transparent}.base:active:where(:not(.disabled,:disabled)).appearance-duotone{--_appearance-color-text:var(--_connotation-color-firm-all);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:var(--_connotation-color-pale)}.base: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}.base.active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-pale);--_appearance-color-outline:transparent}.base.active:where(:not(.disabled,:disabled)).appearance-duotone{--_appearance-color-text:var(--_connotation-color-firm-all);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:var(--_connotation-color-pale)}.base.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}.base:disabled{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:transparent}.base:disabled.appearance-duotone{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-100)}.base:disabled.appearance-subtle-light,.base.disabled{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:transparent}.base.disabled.appearance-duotone{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-100)}.base.disabled.appearance-subtle-light{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:transparent}.base.selected:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary);--_appearance-color-outline:transparent}.base.selected:where(:not(.disabled,:disabled)).appearance-duotone{--_appearance-color-text:var(--_connotation-color-firm-all);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:var(--_connotation-color-pale)}.base.selected:where(:not(.disabled,:disabled)).appearance-subtle-light{--_appearance-color-text:var(--vvd-color-canvas);--_appearance-color-fill:var(--_connotation-color-firm);--_appearance-color-outline:transparent}.base{--tag-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16));box-sizing:border-box;background-color:var(--_appearance-color-fill);block-size:var(--tag-block-size);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);color:var(--_appearance-color-text);font:var(--vvd-typography-base-bold);vertical-align:middle;border:none;align-items:center;column-gap:8px;max-inline-size:100%;padding-inline:8px;display:inline-flex;position:relative}.base:not(.shape-pill){border-radius:4px}.base.shape-pill{border-radius:16px}.base:focus-visible{--focus-stroke-gap-color:transparent;box-shadow:0 0 0 4px color-mix(in srgb, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px))}@supports (user-select:none){.base{user-select:none}}.base:not(.disabled){cursor:pointer}.base.disabled{cursor:not-allowed;pointer-events:none}.base.removable{cursor:auto;padding-inline:8px 1px}.label{text-overflow:ellipsis;white-space:nowrap;max-inline-size:100%;overflow:hidden}slot[name=icon]{font-size:calc(var(--tag-block-size) / 1.5);line-height:1}.dismiss-button{border-radius:inherit;background-color:var(--_appearance-color-fill);cursor:pointer;border:none;align-items:center;padding:4px;display:flex;position:relative;inset-inline-start:-4px}.dismiss-button:focus-visible{--focus-stroke-gap-color:transparent;box-shadow:0 0 0 4px color-mix(in srgb, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px))}", v = ({ connotation: e, appearance: t, shape: n, disabled: r, selectable: i, removable: a, selected: o }) => p("base", ["disabled", r], ["selectable", i], ["selected", i && o], ["removable", a && !i], [`connotation-${e}`, !!e], [`appearance-${t}`, !!t], [`shape-${n}`, !!n]);
|
|
31
31
|
function y(e) {
|
|
32
|
-
return
|
|
32
|
+
return n`
|
|
33
33
|
<button
|
|
34
34
|
class="dismiss-button"
|
|
35
35
|
aria-label="${(e) => e.locale.tag.remove(e.label)}"
|
|
@@ -40,26 +40,26 @@ function y(e) {
|
|
|
40
40
|
}
|
|
41
41
|
//#endregion
|
|
42
42
|
//#region src/lib/tag/index.ts
|
|
43
|
-
|
|
44
|
-
let
|
|
45
|
-
${(e) =>
|
|
46
|
-
${o((e) => e.label, (e) =>
|
|
43
|
+
t(r("tag", g, (e) => {
|
|
44
|
+
let t = u(e), r = e.tagFor(c), i = n`
|
|
45
|
+
${(e) => t(e.icon, d.Slot)}
|
|
46
|
+
${o((e) => e.label, (e) => n`<span class="label">${e.label}</span>`)}
|
|
47
47
|
${o((e) => e.removable && !e.selectable, y(r))}
|
|
48
|
-
${o((e) => e.selectable && e.selected,
|
|
48
|
+
${o((e) => e.selectable && e.selected, n`<${r} class="selectable-icon" name="check-circle-solid"></${r}>`)}
|
|
49
49
|
`;
|
|
50
|
-
return
|
|
51
|
-
${o((e) => e.selectable,
|
|
50
|
+
return n`
|
|
51
|
+
${o((e) => e.selectable, n`<button
|
|
52
52
|
class="${v}"
|
|
53
|
-
${
|
|
53
|
+
${m({ ariaPressed: (e) => e.selected })}
|
|
54
54
|
?disabled="${(e) => e.disabled}"
|
|
55
55
|
@keydown="${(e, t) => e.handleKeydown(t.event)}"
|
|
56
56
|
@click="${(e) => e.handleClick()}"
|
|
57
57
|
>
|
|
58
58
|
${i}
|
|
59
59
|
</button>`)}
|
|
60
|
-
${o((e) => !e.selectable,
|
|
60
|
+
${o((e) => !e.selectable, n`<span
|
|
61
61
|
class="${v}"
|
|
62
|
-
${
|
|
62
|
+
${m()}
|
|
63
63
|
tabindex="${(e) => e.disabled || e.removable ? null : 0}"
|
|
64
64
|
@keydown="${(e, t) => e.handleKeydown(t.event)}"
|
|
65
65
|
@click="${(e) => e.handleClick()}"
|
|
@@ -67,7 +67,7 @@ i(r("tag", g, (e) => {
|
|
|
67
67
|
${i}
|
|
68
68
|
</span>`)}
|
|
69
69
|
`;
|
|
70
|
-
}, [
|
|
70
|
+
}, [l], {
|
|
71
71
|
styles: _,
|
|
72
72
|
shadowOptions: { delegatesFocus: !0 }
|
|
73
73
|
}))();
|
package/tag-group/definition.cjs
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
2
|
-
const require_definition = require("../unbundled/
|
|
2
|
+
const require_definition = require("../unbundled/definition71.cjs");
|
|
3
3
|
exports.VwcTagGroupElement = require_definition.TagGroup;
|
|
4
4
|
exports.registerTagGroup = require_definition.registerTagGroup;
|
|
5
5
|
exports.tagGroupDefinition = require_definition.tagGroupDefinition;
|
package/tag-group/definition.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { n as tagGroupDefinition, r as TagGroup, t as registerTagGroup } from "../unbundled/
|
|
1
|
+
import { n as tagGroupDefinition, r as TagGroup, t as registerTagGroup } from "../unbundled/definition71.js";
|
|
2
2
|
export { TagGroup as VwcTagGroupElement, registerTagGroup, tagGroupDefinition };
|
package/tag-group/index.cjs
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
const e=require(`../bundled/vivid-element.cjs`),t=require(`../bundled/
|
|
1
|
+
const e=require(`../bundled/vivid-element.cjs`),t=require(`../bundled/class-names.cjs`),n=require(`../bundled/delegates-aria.cjs`);var r=`.base{flex-wrap:wrap;gap:8px;display:flex}`,i=class extends n.t(e.t){},a=e.f`
|
|
2
2
|
<div
|
|
3
|
-
class="${e=>
|
|
4
|
-
${
|
|
3
|
+
class="${e=>t.t(`base`)}"
|
|
4
|
+
${n.n({role:`group`})}
|
|
5
5
|
>
|
|
6
6
|
<slot></slot>
|
|
7
7
|
</div>
|
|
8
|
-
`,o=e.
|
|
8
|
+
`,o=e.s(`tag-group`,i,a,[],{styles:r});e.c(o)();
|
package/tag-group/index.js
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
3
|
-
import { t as o } from "../bundled/
|
|
1
|
+
import { c as e, f as t, s as n, t as r } from "../bundled/vivid-element.js";
|
|
2
|
+
import { t as i } from "../bundled/class-names.js";
|
|
3
|
+
import { n as a, t as o } from "../bundled/delegates-aria.js";
|
|
4
4
|
//#endregion
|
|
5
5
|
//#region src/lib/tag-group/index.ts
|
|
6
|
-
n(
|
|
6
|
+
e(n("tag-group", class extends o(r) {}, t`
|
|
7
7
|
<div
|
|
8
|
-
class="${(e) =>
|
|
9
|
-
${
|
|
8
|
+
class="${(e) => i("base")}"
|
|
9
|
+
${a({ role: "group" })}
|
|
10
10
|
>
|
|
11
11
|
<slot></slot>
|
|
12
12
|
</div>
|
package/text-area/definition.cjs
CHANGED
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
2
|
-
require("../unbundled/
|
|
3
|
-
|
|
4
|
-
exports.
|
|
5
|
-
exports.
|
|
6
|
-
exports.textAreaDefinition = require_definition$1.textAreaDefinition;
|
|
2
|
+
const require_definition = require("../unbundled/definition73.cjs");
|
|
3
|
+
exports.VwcTextAreaElement = require_definition.TextArea;
|
|
4
|
+
exports.registerTextArea = require_definition.registerTextArea;
|
|
5
|
+
exports.textAreaDefinition = require_definition.textAreaDefinition;
|
package/text-area/definition.js
CHANGED
|
@@ -1,3 +1,2 @@
|
|
|
1
|
-
import "../unbundled/
|
|
2
|
-
import { n as textAreaDefinition, r as TextArea, t as registerTextArea } from "../unbundled/definition71.js";
|
|
1
|
+
import { n as textAreaDefinition, r as TextArea, t as registerTextArea } from "../unbundled/definition73.js";
|
|
3
2
|
export { TextArea as VwcTextAreaElement, registerTextArea, textAreaDefinition };
|
package/text-area/index.cjs
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
const e=require(`../bundled/vivid-element.cjs`),t=require(`../bundled/ref.cjs`),n=require(`../bundled/when.cjs`),r=require(`../bundled/slotted.cjs`),i=require(`../bundled/definition.cjs`);require(`../bundled/definition2.cjs`);const a=require(`../bundled/decorate.cjs`),o=require(`../bundled/form-element.cjs`),s=require(`../bundled/with-success-text.cjs`),c=require(`../bundled/with-error-text.cjs`),l=require(`../bundled/with-contextual-help.cjs`),u=require(`../bundled/delegates-aria.cjs`),d=require(`../bundled/char-count.cjs`),f=require(`../bundled/class-names.cjs`),p=require(`../bundled/form-associated.cjs`),m=require(`../bundled/mixins.cjs`),h=require(`../bundled/definition11.cjs`);var g=`.label-wrapper{align-items:center;gap:var(--label-wrapper-gap,4px);flex-direction:row;display:flex}.label-wrapper[hidden]{display:none}.label:not(slot),.label::slotted(label){flex:0 auto}:host{display:inline-block}.base{--_appearance-color-text:var(--vvd-color-canvas-text);--_appearance-color-fill:var(--vvd-color-canvas);--_appearance-color-outline:var(--vvd-color-neutral-500)}.base.appearance-ghost{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}@media (hover:hover){.base:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--vvd-color-canvas-text);--_appearance-color-fill:var(--vvd-color-canvas);--_appearance-color-outline:var(--vvd-color-neutral-700)}.base:hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}}.base.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--vvd-color-canvas-text);--_appearance-color-fill:var(--vvd-color-canvas);--_appearance-color-outline:var(--vvd-color-neutral-700)}.base.hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}.base:disabled{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:var(--vvd-color-neutral-300)}.base:disabled.appearance-ghost{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.base.disabled{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:var(--vvd-color-neutral-300)}.base.disabled.appearance-ghost{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.base.readonly:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--vvd-color-canvas-text);--_appearance-color-fill:var(--vvd-color-neutral-200);--_appearance-color-outline:var(--vvd-color-neutral-400)}.base.readonly:where(:not(.disabled,:disabled)).appearance-ghost{--_appearance-color-text:var(--vvd-color-neutral-600);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.base.error:where(:not(.disabled,:disabled)){--_appearance-color-text:notSet;--_appearance-color-fill:var(--vvd-color-alert-50);--_appearance-color-outline:var(--vvd-color-alert-500)}.base.error:where(:not(.disabled,:disabled)).appearance-ghost{--_appearance-color-text:notSet;--_appearance-color-fill:var(--vvd-color-alert-50);--_appearance-color-outline:transparent}.base.success:where(:not(.disabled,:disabled)){--_appearance-color-text:notSet;--_appearance-color-fill:var(--vvd-color-success-50);--_appearance-color-outline:var(--vvd-color-success-500)}.base.success:where(:not(.disabled,:disabled)).appearance-ghost{--_appearance-color-text:notSet;--_appearance-color-fill:var(--vvd-color-success-50);--_appearance-color-outline:transparent}.base.connotation-success{--_connotation-color-primary:var(--vvd-text-area-success-primary,var(--vvd-color-success-500));--_connotation-color-primary-text:var(--vvd-text-area-success-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-text-area-success-primary-increment,var(--vvd-color-success-600));--_connotation-color-intermediate:var(--vvd-text-area-success-intermediate,var(--vvd-color-success-500));--_connotation-color-firm:var(--vvd-text-area-success-firm,var(--vvd-color-success-600));--_connotation-color-fierce:var(--vvd-text-area-success-fierce,var(--vvd-color-success-700));--_connotation-color-faint:var(--vvd-text-area-success-faint,var(--vvd-color-success-50));--_connotation-color-soft:var(--vvd-text-area-success-soft,var(--vvd-color-success-100))}.base.connotation-alert{--_connotation-color-primary:var(--vvd-text-area-alert-primary,var(--vvd-color-alert-500));--_connotation-color-primary-text:var(--vvd-text-area-alert-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-text-area-alert-primary-increment,var(--vvd-color-alert-600));--_connotation-color-intermediate:var(--vvd-text-area-alert-intermediate,var(--vvd-color-alert-500));--_connotation-color-firm:var(--vvd-text-area-alert-firm,var(--vvd-color-alert-600));--_connotation-color-fierce:var(--vvd-text-area-alert-fierce,var(--vvd-color-alert-700));--_connotation-color-faint:var(--vvd-text-area-alert-faint,var(--vvd-color-alert-50));--_connotation-color-soft:var(--vvd-text-area-alert-soft,var(--vvd-color-alert-100))}.base:not(.connotation-success,.connotation-alert){--_connotation-color-primary:var(--vvd-text-area-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-text-area-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-text-area-accent-primary-increment,var(--vvd-color-neutral-800));--_connotation-color-intermediate:var(--vvd-text-area-accent-intermediate,var(--vvd-color-neutral-500));--_connotation-color-firm:var(--vvd-text-area-accent-firm,var(--vvd-color-canvas-text));--_connotation-color-fierce:var(--vvd-text-area-accent-fierce,var(--vvd-color-neutral-700));--_connotation-color-faint:var(--vvd-text-area-accent-faint,var(--vvd-color-neutral-50));--_connotation-color-soft:var(--vvd-text-area-accent-soft,var(--vvd-color-neutral-100))}.base{grid-template-columns:1fr max-content;row-gap:4px;inline-size:100%;display:inline-grid}@supports (user-select:none){.base{user-select:none}}.base:not(.disabled){--_low-ink-color:var(--vvd-color-neutral-600)}.base.disabled{--_low-ink-color:var(--_appearance-color-text);cursor:not-allowed}.label{color:var(--vvd-color-canvas-text);font:var(--vvd-typography-base);line-height:20px}.label-wrapper{grid-area:1/1/auto/2}.char-count{color:var(--_low-ink-color);font:var(--vvd-typography-base);grid-column:2/-1}.control{--scrollbar-track-color:transparent;--scrollbar-thumb-color:color-mix(in srgb, var(--vvd-color-neutral-950), transparent 70%);scrollbar-color:var(--scrollbar-thumb-color) var(--scrollbar-track-color);scrollbar-width:thin}.control ::-webkit-scrollbar{width:4px}.control ::-webkit-scrollbar-track{background:var(--scrollbar-track-color)}.control ::-webkit-scrollbar-thumb{background-color:var(--scrollbar-fallback-track-color,var(--scrollbar-thumb-color));border:0;border-radius:4px}.control{box-sizing:border-box;appearance:none;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);min-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8));resize:none;border:0;border-radius:8px;grid-column:1/-1;padding:8px 16px;transition:box-shadow .2s,background-color .2s,color .2s}@supports selector(::-webkit-resizer){.control::-webkit-resizer{background-image:linear-gradient(315deg, transparent 0, transparent 2px, var(--vvd-color-canvas-text) 2px, var(--vvd-color-canvas-text) 3px, transparent 3px, transparent 5px, var(--vvd-color-canvas-text) 5px, var(--vvd-color-canvas-text) 6px, transparent 6px, transparent 8px, transparent 100%);background-repeat:no-repeat;background-size:10px 10px;block-size:10px;inline-size:10px}}.control:disabled{opacity:1;pointer-events:none;-webkit-text-fill-color:var(--_appearance-color-text)}.control::placeholder,.control:disabled::placeholder{opacity:1;pointer-events:none;-webkit-text-fill-color:var(--_low-ink-color)}.control:focus-visible{--focus-stroke-gap-color:transparent;box-shadow:0 0 0 4px color-mix(in srgb, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px))}:host([resize=both]) .control{resize:both}:host([resize=horizontal]) .control{resize:horizontal}:host([resize=vertical]) .control{resize:vertical}`,_=class{#e=new Map;#t;#n;constructor(e,t){this.#t=e,this.#n=t}attribute(e,t){this.#r(e,{type:`attribute`,destination:t})}booleanAttribute(e,t){this.#r(e,{type:`boolean-attribute`,destination:t})}property(e,t,n=!1){this.#r(e,{type:`property`,destination:t,skipIfEqual:n})}destroy(){let t=e.w.getNotifier(this.#t);for(let e of this.#e.keys())t.unsubscribe(this.#i,e);this.#e.clear()}#r(t,n){this.#e.set(t,n),e.w.getNotifier(this.#t).subscribe(this.#i,t),this.#i.handleChange(this.#t,t)}#i={handleChange:(t,n)=>{let r=this.#e.get(n),i=t[n];switch(r.type){case`boolean-attribute`:e.k.setBooleanAttribute(this.#n,r.destination,!!i);break;case`attribute`:e.k.setAttribute(this.#n,r.destination,i);break;case`property`:if(r.skipIfEqual&&this.#n[r.destination]===i)return;this.#n[r.destination]=i;break}}}},v={none:`none`,both:`both`,horizontal:`horizontal`,vertical:`vertical`},y=class extends l.t(m.t(d.t(c.t(s.t(o.t(u.t(p.n(e.t)))))))){constructor(...e){super(...e),this.proxy=document.createElement(`textarea`),this.resize=v.none,this.cols=20,this.handleTextInput=()=>{this.value=this.control.value}}readOnlyChanged(){this.proxy instanceof HTMLTextAreaElement&&(this.proxy.readOnly=this.readOnly)}autofocusChanged(){this.proxy instanceof HTMLTextAreaElement&&(this.proxy.autofocus=this.autofocus)}listChanged(){this.proxy instanceof HTMLTextAreaElement&&this.proxy.setAttribute(`list`,this.list)}maxlengthChanged(){this.proxy instanceof HTMLTextAreaElement&&(this.proxy.maxLength=this.maxlength)}minlengthChanged(){this.proxy instanceof HTMLTextAreaElement&&(this.proxy.minLength=this.minlength)}spellcheckChanged(){this.proxy instanceof HTMLTextAreaElement&&(this.proxy.spellcheck=this.spellcheck)}select(){this.control.select()}valueChanged(e,t){super.valueChanged(e,t),this.charCount&&this.maxlength&&this._updateCharCountRemaining()}handleChange(){this.$emit(`change`)}validate(){super.validate(this.control)}#e;connectedCallback(){super.connectedCallback(),this.#e=new _(this,this.control),this.#e.property(`value`,`value`,!0),this._renderCharCountRemaining()}disconnectedCallback(){super.disconnectedCallback(),this.#e.destroy()}};a.t([e.l({mode:`boolean`})],y.prototype,`readOnly`,void 0),a.t([e.l],y.prototype,`resize`,void 0),a.t([e.l({mode:`boolean`})],y.prototype,`autofocus`,void 0),a.t([e.l({attribute:`form`})],y.prototype,`formId`,void 0),a.t([e.l],y.prototype,`list`,void 0),a.t([e.l({converter:e.u})],y.prototype,`maxlength`,void 0),a.t([e.l({converter:e.u})],y.prototype,`minlength`,void 0),a.t([e.l],y.prototype,`placeholder`,void 0),a.t([e.l({converter:e.u,mode:`fromView`})],y.prototype,`cols`,void 0),a.t([e.l({converter:e.u,mode:`fromView`})],y.prototype,`rows`,void 0),a.t([e.l({mode:`boolean`})],y.prototype,`spellcheck`,void 0),a.t([e.T],y.prototype,`defaultSlottedNodes`,void 0),a.t([e.l],y.prototype,`wrap`,void 0);var b=({value:e,errorValidationMessage:t,disabled:n,placeholder:r,readOnly:i,successText:a})=>f.t(`base`,[`readonly`,i],[`placeholder`,!!r],[`disabled`,n],[`error`,!!t],[`has-value`,!!e],[`success`,!!a]);function x(){return e.d` <label for="control" class="label">
|
|
1
|
+
const e=require(`../bundled/vivid-element.cjs`),t=require(`../bundled/ref.cjs`),n=require(`../bundled/when.cjs`),r=require(`../bundled/slotted.cjs`),i=require(`../bundled/definition.cjs`),a=require(`../bundled/decorate.cjs`),o=require(`../bundled/form-element.cjs`),s=require(`../bundled/with-success-text.cjs`),c=require(`../bundled/with-error-text.cjs`),l=require(`../bundled/with-contextual-help.cjs`),u=require(`../bundled/class-names.cjs`),d=require(`../bundled/delegates-aria.cjs`),f=require(`../bundled/char-count.cjs`),p=require(`../bundled/form-associated.cjs`),m=require(`../bundled/mixins.cjs`),h=require(`../bundled/definition11.cjs`);var g=`.label-wrapper{align-items:center;gap:var(--label-wrapper-gap,4px);flex-direction:row;display:flex}.label-wrapper[hidden]{display:none}.label:not(slot),.label::slotted(label){flex:0 auto}:host{display:inline-block}.base{--_appearance-color-text:var(--vvd-color-canvas-text);--_appearance-color-fill:var(--vvd-color-canvas);--_appearance-color-outline:var(--vvd-color-neutral-500)}.base.appearance-ghost{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}@media (hover:hover){.base:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--vvd-color-canvas-text);--_appearance-color-fill:var(--vvd-color-canvas);--_appearance-color-outline:var(--vvd-color-neutral-700)}.base:hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}}.base.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--vvd-color-canvas-text);--_appearance-color-fill:var(--vvd-color-canvas);--_appearance-color-outline:var(--vvd-color-neutral-700)}.base.hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}.base:disabled{--_appearance-color-text:var(--vvd-color-neutral-600);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:var(--vvd-color-neutral-300)}.base:disabled.appearance-ghost{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.base.disabled{--_appearance-color-text:var(--vvd-color-neutral-600);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:var(--vvd-color-neutral-300)}.base.disabled.appearance-ghost{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.base.readonly:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--vvd-color-canvas-text);--_appearance-color-fill:var(--vvd-color-neutral-200);--_appearance-color-outline:var(--vvd-color-neutral-400)}.base.readonly:where(:not(.disabled,:disabled)).appearance-ghost{--_appearance-color-text:var(--vvd-color-neutral-600);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.base.error:where(:not(.disabled,:disabled)){--_appearance-color-text:notSet;--_appearance-color-fill:var(--vvd-color-alert-50);--_appearance-color-outline:var(--vvd-color-alert-500)}.base.error:where(:not(.disabled,:disabled)).appearance-ghost{--_appearance-color-text:notSet;--_appearance-color-fill:var(--vvd-color-alert-50);--_appearance-color-outline:transparent}.base.success:where(:not(.disabled,:disabled)){--_appearance-color-text:notSet;--_appearance-color-fill:var(--vvd-color-success-50);--_appearance-color-outline:var(--vvd-color-success-500)}.base.success:where(:not(.disabled,:disabled)).appearance-ghost{--_appearance-color-text:notSet;--_appearance-color-fill:var(--vvd-color-success-50);--_appearance-color-outline:transparent}.base.connotation-success{--_connotation-color-primary:var(--vvd-text-area-success-primary,var(--vvd-color-success-500));--_connotation-color-primary-text:var(--vvd-text-area-success-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-text-area-success-primary-increment,var(--vvd-color-success-600));--_connotation-color-intermediate:var(--vvd-text-area-success-intermediate,var(--vvd-color-success-500));--_connotation-color-firm:var(--vvd-text-area-success-firm,var(--vvd-color-success-600));--_connotation-color-fierce:var(--vvd-text-area-success-fierce,var(--vvd-color-success-700));--_connotation-color-faint:var(--vvd-text-area-success-faint,var(--vvd-color-success-50));--_connotation-color-soft:var(--vvd-text-area-success-soft,var(--vvd-color-success-100))}.base.connotation-alert{--_connotation-color-primary:var(--vvd-text-area-alert-primary,var(--vvd-color-alert-500));--_connotation-color-primary-text:var(--vvd-text-area-alert-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-text-area-alert-primary-increment,var(--vvd-color-alert-600));--_connotation-color-intermediate:var(--vvd-text-area-alert-intermediate,var(--vvd-color-alert-500));--_connotation-color-firm:var(--vvd-text-area-alert-firm,var(--vvd-color-alert-600));--_connotation-color-fierce:var(--vvd-text-area-alert-fierce,var(--vvd-color-alert-700));--_connotation-color-faint:var(--vvd-text-area-alert-faint,var(--vvd-color-alert-50));--_connotation-color-soft:var(--vvd-text-area-alert-soft,var(--vvd-color-alert-100))}.base:not(.connotation-success,.connotation-alert){--_connotation-color-primary:var(--vvd-text-area-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-text-area-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-text-area-accent-primary-increment,var(--vvd-color-neutral-800));--_connotation-color-intermediate:var(--vvd-text-area-accent-intermediate,var(--vvd-color-neutral-500));--_connotation-color-firm:var(--vvd-text-area-accent-firm,var(--vvd-color-canvas-text));--_connotation-color-fierce:var(--vvd-text-area-accent-fierce,var(--vvd-color-neutral-700));--_connotation-color-faint:var(--vvd-text-area-accent-faint,var(--vvd-color-neutral-50));--_connotation-color-soft:var(--vvd-text-area-accent-soft,var(--vvd-color-neutral-100))}.base{grid-template-columns:1fr max-content;row-gap:4px;inline-size:100%;display:inline-grid}@supports (user-select:none){.base{user-select:none}}.base:not(.disabled){--_low-ink-color:var(--vvd-color-neutral-600)}.base.disabled{--_low-ink-color:var(--_appearance-color-text);cursor:not-allowed}.label{color:var(--vvd-color-canvas-text);font:var(--vvd-typography-base);line-height:20px}.label-wrapper{grid-area:1/1/auto/2}.char-count{color:var(--_low-ink-color);font:var(--vvd-typography-base);grid-column:2/-1}.control{--scrollbar-track-color:transparent;--scrollbar-thumb-color:color-mix(in srgb, var(--vvd-color-neutral-950), transparent 70%);scrollbar-color:var(--scrollbar-thumb-color) var(--scrollbar-track-color);scrollbar-width:thin}.control ::-webkit-scrollbar{width:4px}.control ::-webkit-scrollbar-track{background:var(--scrollbar-track-color)}.control ::-webkit-scrollbar-thumb{background-color:var(--scrollbar-fallback-track-color,var(--scrollbar-thumb-color));border:0;border-radius:4px}.control{box-sizing:border-box;appearance:none;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);min-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8));resize:none;border:0;border-radius:8px;grid-column:1/-1;padding:8px 16px;transition:box-shadow .2s,background-color .2s,color .2s}@supports selector(::-webkit-resizer){.control::-webkit-resizer{background-image:linear-gradient(315deg, transparent 0, transparent 2px, var(--vvd-color-canvas-text) 2px, var(--vvd-color-canvas-text) 3px, transparent 3px, transparent 5px, var(--vvd-color-canvas-text) 5px, var(--vvd-color-canvas-text) 6px, transparent 6px, transparent 8px, transparent 100%);background-repeat:no-repeat;background-size:10px 10px;block-size:10px;inline-size:10px}}.control:disabled{opacity:1;pointer-events:none;-webkit-text-fill-color:var(--_appearance-color-text)}.control::placeholder,.control:disabled::placeholder{opacity:1;pointer-events:none;-webkit-text-fill-color:var(--_low-ink-color)}.control:focus-visible{--focus-stroke-gap-color:transparent;box-shadow:0 0 0 4px color-mix(in srgb, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px))}:host([resize=both]) .control{resize:both}:host([resize=horizontal]) .control{resize:horizontal}:host([resize=vertical]) .control{resize:vertical}`,_=class{#e=new Map;#t;#n;constructor(e,t){this.#t=e,this.#n=t}attribute(e,t){this.#r(e,{type:`attribute`,destination:t})}booleanAttribute(e,t){this.#r(e,{type:`boolean-attribute`,destination:t})}property(e,t,n=!1){this.#r(e,{type:`property`,destination:t,skipIfEqual:n})}destroy(){let t=e.E.getNotifier(this.#t);for(let e of this.#e.keys())t.unsubscribe(this.#i,e);this.#e.clear()}#r(t,n){this.#e.set(t,n),e.E.getNotifier(this.#t).subscribe(this.#i,t),this.#i.handleChange(this.#t,t)}#i={handleChange:(t,n)=>{let r=this.#e.get(n),i=t[n];switch(r.type){case`boolean-attribute`:e.j.setBooleanAttribute(this.#n,r.destination,!!i);break;case`attribute`:e.j.setAttribute(this.#n,r.destination,i);break;case`property`:if(r.skipIfEqual&&this.#n[r.destination]===i)return;this.#n[r.destination]=i;break}}}},v={none:`none`,both:`both`,horizontal:`horizontal`,vertical:`vertical`},y=class extends l.t(m.t(f.t(c.t(s.t(o.t(d.t(p.n(e.t)))))))){constructor(...e){super(...e),this.proxy=document.createElement(`textarea`),this.resize=v.none,this.cols=20,this.handleTextInput=()=>{this.value=this.control.value}}readOnlyChanged(){this.proxy instanceof HTMLTextAreaElement&&(this.proxy.readOnly=this.readOnly)}autofocusChanged(){this.proxy instanceof HTMLTextAreaElement&&(this.proxy.autofocus=this.autofocus)}listChanged(){this.proxy instanceof HTMLTextAreaElement&&this.proxy.setAttribute(`list`,this.list)}maxlengthChanged(){this.proxy instanceof HTMLTextAreaElement&&(this.proxy.maxLength=this.maxlength)}minlengthChanged(){this.proxy instanceof HTMLTextAreaElement&&(this.proxy.minLength=this.minlength)}spellcheckChanged(){this.proxy instanceof HTMLTextAreaElement&&(this.proxy.spellcheck=this.spellcheck)}select(){this.control.select()}valueChanged(e,t){super.valueChanged(e,t),this.charCount&&this.maxlength&&this._updateCharCountRemaining()}handleChange(){this.$emit(`change`)}validate(){super.validate(this.control)}#e;connectedCallback(){super.connectedCallback(),this.#e=new _(this,this.control),this.#e.property(`value`,`value`,!0),this._renderCharCountRemaining()}disconnectedCallback(){super.disconnectedCallback(),this.#e.destroy()}};a.t([e.u({mode:`boolean`})],y.prototype,`readOnly`,void 0),a.t([e.u],y.prototype,`resize`,void 0),a.t([e.u({mode:`boolean`})],y.prototype,`autofocus`,void 0),a.t([e.u({attribute:`form`})],y.prototype,`formId`,void 0),a.t([e.u],y.prototype,`list`,void 0),a.t([e.u({converter:e.d})],y.prototype,`maxlength`,void 0),a.t([e.u({converter:e.d})],y.prototype,`minlength`,void 0),a.t([e.u],y.prototype,`placeholder`,void 0),a.t([e.u({converter:e.d,mode:`fromView`})],y.prototype,`cols`,void 0),a.t([e.u({converter:e.d,mode:`fromView`})],y.prototype,`rows`,void 0),a.t([e.u({mode:`boolean`})],y.prototype,`spellcheck`,void 0),a.t([e.D],y.prototype,`defaultSlottedNodes`,void 0),a.t([e.u],y.prototype,`wrap`,void 0);var b=({value:e,errorValidationMessage:t,disabled:n,placeholder:r,readOnly:i,successText:a})=>u.t(`base`,[`readonly`,i],[`placeholder`,!!r],[`disabled`,n],[`error`,!!t],[`has-value`,!!e],[`success`,!!a]);function x(){return e.f` <label for="control" class="label">
|
|
2
2
|
${e=>e.label}
|
|
3
|
-
</label>`}var S=e.
|
|
3
|
+
</label>`}var S=e.s(`text-area`,y,i=>e.f`
|
|
4
4
|
<div class="${b}">
|
|
5
5
|
${n.t(e=>e.charCount&&e.maxlength,e=>e._getCharCountTemplate(i))}
|
|
6
6
|
<div
|
|
@@ -30,7 +30,7 @@ const e=require(`../bundled/vivid-element.cjs`),t=require(`../bundled/ref.cjs`),
|
|
|
30
30
|
?required="${e=>e.required}"
|
|
31
31
|
?spellcheck="${e=>e.spellcheck}"
|
|
32
32
|
aria-describedby="${e=>e._feedbackDescribedBy} ${e=>e.charCount&&e.maxlength?e._charCountDescribedBy:null}"
|
|
33
|
-
${
|
|
33
|
+
${d.n()}
|
|
34
34
|
@input="${e=>e.handleTextInput()}"
|
|
35
35
|
@change="${e=>e.handleChange()}"
|
|
36
36
|
${t.t(`control`)}
|
|
@@ -38,4 +38,4 @@ const e=require(`../bundled/vivid-element.cjs`),t=require(`../bundled/ref.cjs`),
|
|
|
38
38
|
</textarea>
|
|
39
39
|
${e=>e._getFeedbackTemplate(i)}
|
|
40
40
|
</div>
|
|
41
|
-
`,[m.a,i.n,h.t],{styles:g,shadowOptions:{delegatesFocus:!0}});e.
|
|
41
|
+
`,[m.a,i.n,h.t],{styles:g,shadowOptions:{delegatesFocus:!0}});e.c(S)();
|
package/text-area/index.js
CHANGED
|
@@ -1,22 +1,21 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { D as e, E as t, c as n, d as r, f as i, j as a, s as o, t as s, u as c } from "../bundled/vivid-element.js";
|
|
2
2
|
import { t as l } from "../bundled/ref.js";
|
|
3
3
|
import { t as u } from "../bundled/when.js";
|
|
4
4
|
import { t as d } from "../bundled/slotted.js";
|
|
5
5
|
import { n as f } from "../bundled/definition.js";
|
|
6
|
-
import "../bundled/definition2.js";
|
|
7
6
|
import { t as p } from "../bundled/decorate.js";
|
|
8
7
|
import { t as m } from "../bundled/form-element.js";
|
|
9
8
|
import { t as h } from "../bundled/with-success-text.js";
|
|
10
9
|
import { t as g } from "../bundled/with-error-text.js";
|
|
11
10
|
import { t as _ } from "../bundled/with-contextual-help.js";
|
|
12
|
-
import {
|
|
13
|
-
import { t as b } from "../bundled/
|
|
14
|
-
import { t as x } from "../bundled/
|
|
11
|
+
import { t as v } from "../bundled/class-names.js";
|
|
12
|
+
import { n as y, t as b } from "../bundled/delegates-aria.js";
|
|
13
|
+
import { t as x } from "../bundled/char-count.js";
|
|
15
14
|
import { n as S } from "../bundled/form-associated.js";
|
|
16
15
|
import { a as C, t as w } from "../bundled/mixins.js";
|
|
17
16
|
import { t as T } from "../bundled/definition11.js";
|
|
18
17
|
//#region src/lib/text-area/text-area.scss?inline
|
|
19
|
-
var E = ".label-wrapper{align-items:center;gap:var(--label-wrapper-gap,4px);flex-direction:row;display:flex}.label-wrapper[hidden]{display:none}.label:not(slot),.label::slotted(label){flex:0 auto}:host{display:inline-block}.base{--_appearance-color-text:var(--vvd-color-canvas-text);--_appearance-color-fill:var(--vvd-color-canvas);--_appearance-color-outline:var(--vvd-color-neutral-500)}.base.appearance-ghost{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}@media (hover:hover){.base:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--vvd-color-canvas-text);--_appearance-color-fill:var(--vvd-color-canvas);--_appearance-color-outline:var(--vvd-color-neutral-700)}.base:hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}}.base.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--vvd-color-canvas-text);--_appearance-color-fill:var(--vvd-color-canvas);--_appearance-color-outline:var(--vvd-color-neutral-700)}.base.hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}.base:disabled{--_appearance-color-text:var(--vvd-color-neutral-
|
|
18
|
+
var E = ".label-wrapper{align-items:center;gap:var(--label-wrapper-gap,4px);flex-direction:row;display:flex}.label-wrapper[hidden]{display:none}.label:not(slot),.label::slotted(label){flex:0 auto}:host{display:inline-block}.base{--_appearance-color-text:var(--vvd-color-canvas-text);--_appearance-color-fill:var(--vvd-color-canvas);--_appearance-color-outline:var(--vvd-color-neutral-500)}.base.appearance-ghost{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}@media (hover:hover){.base:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--vvd-color-canvas-text);--_appearance-color-fill:var(--vvd-color-canvas);--_appearance-color-outline:var(--vvd-color-neutral-700)}.base:hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}}.base.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--vvd-color-canvas-text);--_appearance-color-fill:var(--vvd-color-canvas);--_appearance-color-outline:var(--vvd-color-neutral-700)}.base.hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}.base:disabled{--_appearance-color-text:var(--vvd-color-neutral-600);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:var(--vvd-color-neutral-300)}.base:disabled.appearance-ghost{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.base.disabled{--_appearance-color-text:var(--vvd-color-neutral-600);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:var(--vvd-color-neutral-300)}.base.disabled.appearance-ghost{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.base.readonly:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--vvd-color-canvas-text);--_appearance-color-fill:var(--vvd-color-neutral-200);--_appearance-color-outline:var(--vvd-color-neutral-400)}.base.readonly:where(:not(.disabled,:disabled)).appearance-ghost{--_appearance-color-text:var(--vvd-color-neutral-600);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.base.error:where(:not(.disabled,:disabled)){--_appearance-color-text:notSet;--_appearance-color-fill:var(--vvd-color-alert-50);--_appearance-color-outline:var(--vvd-color-alert-500)}.base.error:where(:not(.disabled,:disabled)).appearance-ghost{--_appearance-color-text:notSet;--_appearance-color-fill:var(--vvd-color-alert-50);--_appearance-color-outline:transparent}.base.success:where(:not(.disabled,:disabled)){--_appearance-color-text:notSet;--_appearance-color-fill:var(--vvd-color-success-50);--_appearance-color-outline:var(--vvd-color-success-500)}.base.success:where(:not(.disabled,:disabled)).appearance-ghost{--_appearance-color-text:notSet;--_appearance-color-fill:var(--vvd-color-success-50);--_appearance-color-outline:transparent}.base.connotation-success{--_connotation-color-primary:var(--vvd-text-area-success-primary,var(--vvd-color-success-500));--_connotation-color-primary-text:var(--vvd-text-area-success-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-text-area-success-primary-increment,var(--vvd-color-success-600));--_connotation-color-intermediate:var(--vvd-text-area-success-intermediate,var(--vvd-color-success-500));--_connotation-color-firm:var(--vvd-text-area-success-firm,var(--vvd-color-success-600));--_connotation-color-fierce:var(--vvd-text-area-success-fierce,var(--vvd-color-success-700));--_connotation-color-faint:var(--vvd-text-area-success-faint,var(--vvd-color-success-50));--_connotation-color-soft:var(--vvd-text-area-success-soft,var(--vvd-color-success-100))}.base.connotation-alert{--_connotation-color-primary:var(--vvd-text-area-alert-primary,var(--vvd-color-alert-500));--_connotation-color-primary-text:var(--vvd-text-area-alert-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-text-area-alert-primary-increment,var(--vvd-color-alert-600));--_connotation-color-intermediate:var(--vvd-text-area-alert-intermediate,var(--vvd-color-alert-500));--_connotation-color-firm:var(--vvd-text-area-alert-firm,var(--vvd-color-alert-600));--_connotation-color-fierce:var(--vvd-text-area-alert-fierce,var(--vvd-color-alert-700));--_connotation-color-faint:var(--vvd-text-area-alert-faint,var(--vvd-color-alert-50));--_connotation-color-soft:var(--vvd-text-area-alert-soft,var(--vvd-color-alert-100))}.base:not(.connotation-success,.connotation-alert){--_connotation-color-primary:var(--vvd-text-area-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-text-area-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-text-area-accent-primary-increment,var(--vvd-color-neutral-800));--_connotation-color-intermediate:var(--vvd-text-area-accent-intermediate,var(--vvd-color-neutral-500));--_connotation-color-firm:var(--vvd-text-area-accent-firm,var(--vvd-color-canvas-text));--_connotation-color-fierce:var(--vvd-text-area-accent-fierce,var(--vvd-color-neutral-700));--_connotation-color-faint:var(--vvd-text-area-accent-faint,var(--vvd-color-neutral-50));--_connotation-color-soft:var(--vvd-text-area-accent-soft,var(--vvd-color-neutral-100))}.base{grid-template-columns:1fr max-content;row-gap:4px;inline-size:100%;display:inline-grid}@supports (user-select:none){.base{user-select:none}}.base:not(.disabled){--_low-ink-color:var(--vvd-color-neutral-600)}.base.disabled{--_low-ink-color:var(--_appearance-color-text);cursor:not-allowed}.label{color:var(--vvd-color-canvas-text);font:var(--vvd-typography-base);line-height:20px}.label-wrapper{grid-area:1/1/auto/2}.char-count{color:var(--_low-ink-color);font:var(--vvd-typography-base);grid-column:2/-1}.control{--scrollbar-track-color:transparent;--scrollbar-thumb-color:color-mix(in srgb, var(--vvd-color-neutral-950), transparent 70%);scrollbar-color:var(--scrollbar-thumb-color) var(--scrollbar-track-color);scrollbar-width:thin}.control ::-webkit-scrollbar{width:4px}.control ::-webkit-scrollbar-track{background:var(--scrollbar-track-color)}.control ::-webkit-scrollbar-thumb{background-color:var(--scrollbar-fallback-track-color,var(--scrollbar-thumb-color));border:0;border-radius:4px}.control{box-sizing:border-box;appearance:none;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);min-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8));resize:none;border:0;border-radius:8px;grid-column:1/-1;padding:8px 16px;transition:box-shadow .2s,background-color .2s,color .2s}@supports selector(::-webkit-resizer){.control::-webkit-resizer{background-image:linear-gradient(315deg, transparent 0, transparent 2px, var(--vvd-color-canvas-text) 2px, var(--vvd-color-canvas-text) 3px, transparent 3px, transparent 5px, var(--vvd-color-canvas-text) 5px, var(--vvd-color-canvas-text) 6px, transparent 6px, transparent 8px, transparent 100%);background-repeat:no-repeat;background-size:10px 10px;block-size:10px;inline-size:10px}}.control:disabled{opacity:1;pointer-events:none;-webkit-text-fill-color:var(--_appearance-color-text)}.control::placeholder,.control:disabled::placeholder{opacity:1;pointer-events:none;-webkit-text-fill-color:var(--_low-ink-color)}.control:focus-visible{--focus-stroke-gap-color:transparent;box-shadow:0 0 0 4px color-mix(in srgb, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px))}:host([resize=both]) .control{resize:both}:host([resize=horizontal]) .control{resize:horizontal}:host([resize=vertical]) .control{resize:vertical}", D = class {
|
|
20
19
|
#e = /* @__PURE__ */ new Map();
|
|
21
20
|
#t;
|
|
22
21
|
#n;
|
|
@@ -43,25 +42,25 @@ var E = ".label-wrapper{align-items:center;gap:var(--label-wrapper-gap,4px);flex
|
|
|
43
42
|
});
|
|
44
43
|
}
|
|
45
44
|
destroy() {
|
|
46
|
-
let e =
|
|
45
|
+
let e = t.getNotifier(this.#t);
|
|
47
46
|
for (let t of this.#e.keys()) e.unsubscribe(this.#i, t);
|
|
48
47
|
this.#e.clear();
|
|
49
48
|
}
|
|
50
|
-
#r(e,
|
|
51
|
-
this.#e.set(e,
|
|
49
|
+
#r(e, n) {
|
|
50
|
+
this.#e.set(e, n), t.getNotifier(this.#t).subscribe(this.#i, e), this.#i.handleChange(this.#t, e);
|
|
52
51
|
}
|
|
53
52
|
#i = { handleChange: (e, t) => {
|
|
54
|
-
let
|
|
55
|
-
switch (
|
|
53
|
+
let n = this.#e.get(t), r = e[t];
|
|
54
|
+
switch (n.type) {
|
|
56
55
|
case "boolean-attribute":
|
|
57
|
-
|
|
56
|
+
a.setBooleanAttribute(this.#n, n.destination, !!r);
|
|
58
57
|
break;
|
|
59
58
|
case "attribute":
|
|
60
|
-
|
|
59
|
+
a.setAttribute(this.#n, n.destination, r);
|
|
61
60
|
break;
|
|
62
61
|
case "property":
|
|
63
|
-
if (
|
|
64
|
-
this.#n[
|
|
62
|
+
if (n.skipIfEqual && this.#n[n.destination] === r) return;
|
|
63
|
+
this.#n[n.destination] = r;
|
|
65
64
|
break;
|
|
66
65
|
}
|
|
67
66
|
} };
|
|
@@ -70,7 +69,7 @@ var E = ".label-wrapper{align-items:center;gap:var(--label-wrapper-gap,4px);flex
|
|
|
70
69
|
both: "both",
|
|
71
70
|
horizontal: "horizontal",
|
|
72
71
|
vertical: "vertical"
|
|
73
|
-
}, k = class extends _(w(
|
|
72
|
+
}, k = class extends _(w(x(g(h(m(b(S(s)))))))) {
|
|
74
73
|
constructor(...e) {
|
|
75
74
|
super(...e), this.proxy = document.createElement("textarea"), this.resize = O.none, this.cols = 20, this.handleTextInput = () => {
|
|
76
75
|
this.value = this.control.value;
|
|
@@ -120,24 +119,24 @@ var E = ".label-wrapper{align-items:center;gap:var(--label-wrapper-gap,4px);flex
|
|
|
120
119
|
super.disconnectedCallback(), this.#e.destroy();
|
|
121
120
|
}
|
|
122
121
|
};
|
|
123
|
-
p([
|
|
124
|
-
converter:
|
|
122
|
+
p([c({ mode: "boolean" })], k.prototype, "readOnly", void 0), p([c], k.prototype, "resize", void 0), p([c({ mode: "boolean" })], k.prototype, "autofocus", void 0), p([c({ attribute: "form" })], k.prototype, "formId", void 0), p([c], k.prototype, "list", void 0), p([c({ converter: r })], k.prototype, "maxlength", void 0), p([c({ converter: r })], k.prototype, "minlength", void 0), p([c], k.prototype, "placeholder", void 0), p([c({
|
|
123
|
+
converter: r,
|
|
125
124
|
mode: "fromView"
|
|
126
|
-
})], k.prototype, "cols", void 0), p([
|
|
127
|
-
converter:
|
|
125
|
+
})], k.prototype, "cols", void 0), p([c({
|
|
126
|
+
converter: r,
|
|
128
127
|
mode: "fromView"
|
|
129
|
-
})], k.prototype, "rows", void 0), p([
|
|
128
|
+
})], k.prototype, "rows", void 0), p([c({ mode: "boolean" })], k.prototype, "spellcheck", void 0), p([e], k.prototype, "defaultSlottedNodes", void 0), p([c], k.prototype, "wrap", void 0);
|
|
130
129
|
//#endregion
|
|
131
130
|
//#region src/lib/text-area/text-area.template.ts
|
|
132
|
-
var A = ({ value: e, errorValidationMessage: t, disabled: n, placeholder: r, readOnly: i, successText: a }) =>
|
|
131
|
+
var A = ({ value: e, errorValidationMessage: t, disabled: n, placeholder: r, readOnly: i, successText: a }) => v("base", ["readonly", i], ["placeholder", !!r], ["disabled", n], ["error", !!t], ["has-value", !!e], ["success", !!a]);
|
|
133
132
|
function j() {
|
|
134
|
-
return
|
|
133
|
+
return i` <label for="control" class="label">
|
|
135
134
|
${(e) => e.label}
|
|
136
135
|
</label>`;
|
|
137
136
|
}
|
|
138
137
|
//#endregion
|
|
139
138
|
//#region src/lib/text-area/index.ts
|
|
140
|
-
|
|
139
|
+
n(o("text-area", k, (e) => i`
|
|
141
140
|
<div class="${A}">
|
|
142
141
|
${u((e) => e.charCount && e.maxlength, (t) => t._getCharCountTemplate(e))}
|
|
143
142
|
<div
|
|
@@ -167,7 +166,7 @@ a(i("text-area", k, (e) => t`
|
|
|
167
166
|
?required="${(e) => e.required}"
|
|
168
167
|
?spellcheck="${(e) => e.spellcheck}"
|
|
169
168
|
aria-describedby="${(e) => e._feedbackDescribedBy} ${(e) => e.charCount && e.maxlength ? e._charCountDescribedBy : null}"
|
|
170
|
-
${
|
|
169
|
+
${y()}
|
|
171
170
|
@input="${(e) => e.handleTextInput()}"
|
|
172
171
|
@change="${(e) => e.handleChange()}"
|
|
173
172
|
${l("control")}
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
2
|
-
require("../unbundled/
|
|
3
|
-
|
|
4
|
-
exports.
|
|
5
|
-
exports.
|
|
6
|
-
exports.textFieldDefinition = require_definition$1.textFieldDefinition;
|
|
2
|
+
const require_definition = require("../unbundled/definition26.cjs");
|
|
3
|
+
exports.VwcTextFieldElement = require_definition.TextField;
|
|
4
|
+
exports.registerTextField = require_definition.registerTextField;
|
|
5
|
+
exports.textFieldDefinition = require_definition.textFieldDefinition;
|
package/text-field/definition.js
CHANGED
package/text-field/index.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
require(`../bundled/
|
|
1
|
+
require(`../bundled/definition12.cjs`).t();
|
package/text-field/index.js
CHANGED
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
2
|
-
require("../unbundled/definition2.cjs");
|
|
3
2
|
const require_time_selection_picker_template = require("../unbundled/time-selection-picker.template.cjs");
|
|
4
|
-
const require_definition
|
|
3
|
+
const require_definition = require("../unbundled/definition74.cjs");
|
|
5
4
|
exports.VwcTimePickerElement = require_time_selection_picker_template.TimePicker;
|
|
6
|
-
exports.registerTimePicker = require_definition
|
|
7
|
-
exports.timePickerDefinition = require_definition
|
|
5
|
+
exports.registerTimePicker = require_definition.registerTimePicker;
|
|
6
|
+
exports.timePickerDefinition = require_definition.timePickerDefinition;
|