@vonage/vivid 4.31.0 → 5.1.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/{shared/definition2.cjs → accordion/definition.cjs} +20 -20
- package/{shared/definition2.js → accordion/definition.js} +5 -7
- package/accordion/index.cjs +5 -5
- package/accordion/index.js +129 -3
- package/accordion-item/definition.cjs +145 -0
- package/accordion-item/definition.js +139 -0
- package/accordion-item/index.cjs +1 -5
- package/accordion-item/index.js +2 -3
- package/{shared/definition3.cjs → action-group/definition.cjs} +12 -9
- package/{shared/definition3.js → action-group/definition.js} +5 -4
- package/action-group/index.cjs +6 -5
- package/action-group/index.js +49 -3
- package/{shared/definition4.cjs → alert/definition.cjs} +33 -31
- package/{shared/definition4.js → alert/definition.js} +11 -11
- package/alert/index.cjs +30 -5
- package/alert/index.js +158 -3
- package/{shared/definition5.cjs → audio-player/definition.cjs} +58 -57
- package/{shared/definition5.js → audio-player/definition.js} +11 -12
- package/audio-player/index.cjs +68 -4
- package/audio-player/index.js +309 -2
- package/{shared/definition6.cjs → avatar/definition.cjs} +28 -26
- package/{shared/definition6.js → avatar/definition.js} +7 -7
- package/avatar/index.cjs +18 -5
- package/avatar/index.js +93 -3
- package/{shared/definition7.cjs → badge/definition.cjs} +18 -16
- package/{shared/definition7.js → badge/definition.js} +6 -6
- package/badge/index.cjs +4 -5
- package/badge/index.js +66 -3
- package/{shared/definition8.cjs → banner/definition.cjs} +26 -25
- package/{shared/definition8.js → banner/definition.js} +10 -11
- package/banner/index.cjs +29 -4
- package/banner/index.js +128 -2
- package/{shared/definition10.cjs → breadcrumb/definition.cjs} +11 -9
- package/{shared/definition10.js → breadcrumb/definition.js} +5 -5
- package/breadcrumb/index.cjs +12 -5
- package/breadcrumb/index.js +69 -3
- package/{shared/definition9.cjs → breadcrumb-item/definition.cjs} +18 -15
- package/{shared/definition9.js → breadcrumb-item/definition.js} +7 -7
- package/breadcrumb-item/index.cjs +5 -5
- package/breadcrumb-item/index.js +33 -3
- package/bundled/_has.cjs +1 -0
- package/bundled/_has.js +34 -0
- package/bundled/affix.cjs +13 -0
- package/bundled/affix.js +63 -0
- package/bundled/anchored.cjs +4 -0
- package/bundled/anchored.js +67 -0
- package/bundled/aria.cjs +1 -0
- package/bundled/aria.js +7 -0
- package/bundled/attribute-binding-behaviour.cjs +1 -0
- package/bundled/attribute-binding-behaviour.js +27 -0
- package/bundled/base-progress.cjs +1 -0
- package/bundled/base-progress.js +57 -0
- package/bundled/breadcrumb-item.cjs +1 -0
- package/bundled/breadcrumb-item.js +21 -0
- package/bundled/button.cjs +1 -0
- package/bundled/button.js +106 -0
- package/bundled/calendar-event.cjs +1 -0
- package/bundled/calendar-event.js +34 -0
- package/bundled/calendar-picker.template.cjs +148 -0
- package/bundled/calendar-picker.template.js +3371 -0
- package/bundled/char-count.cjs +13 -0
- package/bundled/char-count.js +54 -0
- package/bundled/children.cjs +1 -0
- package/bundled/children.js +38 -0
- package/bundled/class-names.cjs +1 -0
- package/bundled/class-names.js +9 -0
- package/bundled/definition.cjs +39 -0
- package/bundled/definition.js +122 -0
- package/bundled/definition10.cjs +19 -0
- package/bundled/definition10.js +73 -0
- package/bundled/definition11.cjs +10 -0
- package/bundled/definition11.js +44 -0
- package/bundled/definition12.cjs +1 -0
- package/bundled/definition12.js +20 -0
- package/bundled/definition13.cjs +73 -0
- package/bundled/definition13.js +359 -0
- package/bundled/definition14.cjs +5 -0
- package/bundled/definition14.js +29 -0
- package/bundled/definition15.cjs +30 -0
- package/bundled/definition15.js +80 -0
- package/bundled/definition16.cjs +19 -0
- package/bundled/definition16.js +103 -0
- package/bundled/definition17.cjs +13 -0
- package/bundled/definition17.js +137 -0
- package/bundled/definition18.cjs +12 -0
- package/bundled/definition18.js +94 -0
- package/bundled/definition19.cjs +67 -0
- package/bundled/definition19.js +666 -0
- package/bundled/definition2.cjs +20 -0
- package/bundled/definition2.js +180 -0
- package/bundled/definition20.cjs +20 -0
- package/bundled/definition20.js +106 -0
- package/bundled/definition21.cjs +5 -0
- package/bundled/definition21.js +19 -0
- package/bundled/definition22.cjs +24 -0
- package/bundled/definition22.js +151 -0
- package/bundled/definition3.cjs +29 -0
- package/bundled/definition3.js +195 -0
- package/bundled/definition4.cjs +6 -0
- package/bundled/definition4.js +42 -0
- package/bundled/definition5.cjs +1 -0
- package/bundled/definition5.js +345 -0
- package/bundled/definition6.cjs +31 -0
- package/bundled/definition6.js +265 -0
- package/bundled/definition7.cjs +30 -0
- package/bundled/definition7.js +288 -0
- package/bundled/definition8.cjs +19 -0
- package/bundled/definition8.js +145 -0
- package/bundled/definition9.cjs +14 -0
- package/bundled/definition9.js +1406 -0
- package/bundled/delegates-aria.cjs +1 -0
- package/bundled/delegates-aria.js +77 -0
- package/bundled/divider.cjs +1 -0
- package/bundled/divider.js +34 -0
- package/bundled/dom.cjs +1 -0
- package/bundled/dom.js +6 -0
- package/bundled/enums.cjs +1 -0
- package/bundled/enums.js +9 -0
- package/bundled/form-associated.cjs +1 -0
- package/bundled/form-associated.js +320 -0
- package/bundled/form-element.cjs +1 -0
- package/bundled/form-element.js +56 -0
- package/bundled/host-semantics.cjs +1 -0
- package/bundled/host-semantics.js +57 -0
- package/bundled/index.cjs +1 -0
- package/bundled/index.js +6 -0
- package/bundled/key-codes.cjs +1 -0
- package/bundled/key-codes.js +16 -0
- package/bundled/linkable.cjs +15 -0
- package/bundled/linkable.js +49 -0
- package/bundled/listbox.cjs +1 -0
- package/bundled/listbox.js +345 -0
- package/bundled/localized.cjs +1 -0
- package/bundled/localized.js +459 -0
- package/bundled/mixins.cjs +33 -0
- package/bundled/mixins.js +226 -0
- package/bundled/numbers.cjs +1 -0
- package/bundled/numbers.js +14 -0
- package/bundled/option.cjs +1 -0
- package/bundled/option.js +158 -0
- package/bundled/picker-field.template.cjs +62 -0
- package/bundled/picker-field.template.js +234 -0
- package/bundled/playbackRates.cjs +1 -0
- package/bundled/playbackRates.js +11 -0
- package/bundled/ref.cjs +1 -0
- package/bundled/ref.js +32 -0
- package/bundled/repeat.cjs +1 -0
- package/bundled/repeat.js +341 -0
- package/bundled/scrollIntoView.cjs +1 -0
- package/bundled/scrollIntoView.js +33 -0
- package/bundled/single-date-picker.cjs +1 -0
- package/bundled/single-date-picker.js +39 -0
- package/bundled/single-value-picker.cjs +1 -0
- package/bundled/single-value-picker.js +87 -0
- package/bundled/slider.template.cjs +41 -0
- package/bundled/slider.template.js +100 -0
- package/bundled/slotted.cjs +1 -0
- package/bundled/slotted.js +81 -0
- package/bundled/strings.cjs +1 -0
- package/bundled/strings.js +7 -0
- package/bundled/text-field.cjs +1 -0
- package/bundled/text-field.js +4 -0
- package/bundled/time-selection-picker.template.cjs +46 -0
- package/bundled/time-selection-picker.template.js +575 -0
- package/bundled/vivid-element.cjs +1 -0
- package/bundled/vivid-element.js +1761 -0
- package/bundled/when.cjs +1 -0
- package/bundled/when.js +11 -0
- package/bundled/with-contextual-help.cjs +1 -0
- package/bundled/with-contextual-help.js +22 -0
- package/bundled/with-error-text.cjs +1 -0
- package/bundled/with-error-text.js +39 -0
- package/bundled/with-success-text.cjs +1 -0
- package/bundled/with-success-text.js +16 -0
- package/button/definition.cjs +14 -0
- package/button/definition.js +4 -0
- package/button/index.cjs +1 -5
- package/button/index.js +2 -3
- package/{shared/definition13.cjs → calendar/definition.cjs} +27 -449
- package/{shared/definition13.js → calendar/definition.js} +7 -431
- package/calendar/index.cjs +53 -5
- package/calendar/index.js +431 -3
- package/{shared/definition12.cjs → calendar-event/definition.cjs} +12 -9
- package/{shared/definition12.js → calendar-event/definition.js} +6 -6
- package/calendar-event/index.cjs +9 -5
- package/calendar-event/index.js +43 -3
- package/card/definition.cjs +186 -0
- package/{shared/definition14.js → card/definition.js} +10 -11
- package/card/index.cjs +47 -5
- package/card/index.js +163 -3
- package/{shared/definition15.cjs → checkbox/definition.cjs} +35 -30
- package/{shared/definition15.js → checkbox/definition.js} +17 -14
- package/checkbox/index.cjs +1 -5
- package/checkbox/index.js +2 -3
- package/{shared/definition16.cjs → combobox/definition.cjs} +50 -52
- package/{shared/definition16.js → combobox/definition.js} +19 -23
- package/combobox/index.cjs +65 -5
- package/combobox/index.js +512 -3
- package/contextual-help/definition.cjs +62 -0
- package/contextual-help/definition.js +57 -0
- package/contextual-help/index.cjs +1 -0
- package/contextual-help/index.js +2 -0
- package/custom-elements.json +2735 -711
- package/{shared/definition17.cjs → data-grid/definition.cjs} +169 -196
- package/{shared/definition17.js → data-grid/definition.js} +71 -100
- package/data-grid/index.cjs +81 -5
- package/data-grid/index.js +1011 -3
- package/{shared/definition18.cjs → date-picker/definition.cjs} +20 -17
- package/{shared/definition18.js → date-picker/definition.js} +12 -11
- package/date-picker/index.cjs +1 -5
- package/date-picker/index.js +115 -3
- package/{shared/definition19.cjs → date-range-picker/definition.cjs} +26 -23
- package/{shared/definition19.js → date-range-picker/definition.js} +10 -9
- package/date-range-picker/index.cjs +1 -5
- package/date-range-picker/index.js +335 -3
- package/{shared/definition20.cjs → date-time-picker/definition.cjs} +27 -24
- package/{shared/definition20.js → date-time-picker/definition.js} +13 -12
- package/date-time-picker/index.cjs +8 -5
- package/date-time-picker/index.js +216 -3
- package/{shared/definition21.cjs → dial-pad/definition.cjs} +39 -40
- package/{shared/definition21.js → dial-pad/definition.js} +9 -12
- package/dial-pad/index.cjs +54 -5
- package/dial-pad/index.js +214 -3
- package/{shared/definition22.cjs → dialog/definition.cjs} +48 -47
- package/{shared/definition22.js → dialog/definition.js} +10 -11
- package/dialog/index.cjs +44 -5
- package/dialog/index.js +257 -3
- package/{shared/definition23.cjs → divider/definition.cjs} +10 -6
- package/{shared/definition23.js → divider/definition.js} +6 -5
- package/divider/index.cjs +1 -5
- package/divider/index.js +2 -3
- package/elevation/definition.cjs +11 -0
- package/elevation/definition.js +2 -0
- package/elevation/index.cjs +1 -5
- package/elevation/index.js +2 -3
- package/empty-state/definition.cjs +81 -0
- package/empty-state/definition.js +75 -0
- package/empty-state/index.cjs +14 -5
- package/empty-state/index.js +64 -3
- package/fab/definition.cjs +105 -0
- package/fab/definition.js +99 -0
- package/fab/index.cjs +20 -5
- package/fab/index.js +86 -3
- package/file-picker/definition.cjs +510 -0
- package/file-picker/definition.js +504 -0
- package/file-picker/index.cjs +58 -5
- package/file-picker/index.js +381 -3
- package/{shared/definition27.cjs → header/definition.cjs} +14 -11
- package/{shared/definition27.js → header/definition.js} +6 -5
- package/header/index.cjs +19 -5
- package/header/index.js +57 -3
- package/{shared/definition28.cjs → icon/definition.cjs} +25 -149
- package/{shared/definition28.js → icon/definition.js} +6 -132
- package/icon/index.cjs +1 -5
- package/icon/index.js +2 -3
- package/index.cjs +268 -264
- package/index.js +72 -71
- package/{shared/definition29.cjs → layout/definition.cjs} +13 -10
- package/{shared/definition29.js → layout/definition.js} +4 -3
- package/layout/index.cjs +3 -5
- package/layout/index.js +52 -3
- package/lib/accordion-item/accordion-item.d.ts +42 -2
- package/lib/action-group/action-group.d.ts +42 -2
- package/lib/alert/alert.d.ts +84 -4
- package/lib/audio-player/audio-player.d.ts +42 -2
- package/lib/avatar/avatar.d.ts +42 -2
- package/lib/badge/badge.d.ts +42 -2
- package/lib/banner/banner.d.ts +126 -6
- package/lib/breadcrumb/breadcrumb.d.ts +42 -2
- package/lib/breadcrumb-item/breadcrumb-item.d.ts +42 -2
- package/lib/button/button.d.ts +127 -6
- package/lib/calendar-event/calendar-event.d.ts +42 -2
- package/lib/card/card.d.ts +42 -2
- package/lib/checkbox/checkbox.d.ts +252 -13
- package/lib/combobox/combobox.d.ts +252 -12
- package/lib/components.d.ts +1 -0
- package/lib/contextual-help/contextual-help.d.ts +5 -0
- package/lib/contextual-help/contextual-help.template.d.ts +3 -0
- package/lib/contextual-help/definition.d.ts +1 -0
- package/lib/data-grid/data-grid-cell.d.ts +418 -3
- package/lib/data-grid/data-grid-row.d.ts +379 -1
- package/lib/date-picker/date-picker.d.ts +374 -54
- package/lib/date-range-picker/date-range-picker.d.ts +188 -28
- package/lib/date-time-picker/date-time-picker.d.ts +376 -56
- package/lib/dial-pad/dial-pad.d.ts +42 -2
- package/lib/dialog/dialog.d.ts +84 -4
- package/lib/divider/divider.d.ts +42 -2
- package/lib/fab/fab.d.ts +43 -2
- package/lib/file-picker/accept.d.ts +1 -0
- package/lib/file-picker/data-transfer.d.ts +1 -0
- package/lib/file-picker/file-picker.d.ts +259 -31
- package/lib/file-picker/locale.d.ts +1 -0
- package/lib/header/header.d.ts +42 -2
- package/lib/menu/menu.d.ts +84 -4
- package/lib/menu-item/menu-item.d.ts +84 -4
- package/lib/nav/nav.d.ts +42 -2
- package/lib/nav-disclosure/nav-disclosure.d.ts +84 -4
- package/lib/nav-item/nav-item.d.ts +84 -4
- package/lib/note/note.d.ts +42 -2
- package/lib/number-field/number-field.d.ts +840 -104
- package/lib/option/option.d.ts +85 -4
- package/lib/pagination/pagination.d.ts +42 -2
- package/lib/progress/progress.d.ts +42 -2
- package/lib/progress-ring/progress-ring.d.ts +42 -2
- package/lib/radio/radio.d.ts +126 -7
- package/lib/radio-group/radio-group.d.ts +42 -2
- package/lib/range-slider/range-slider.d.ts +126 -6
- package/lib/rich-text-editor/menubar/menubar.d.ts +42 -2
- package/lib/rich-text-editor/rich-text-editor.d.ts +42 -2
- package/lib/searchable-select/option-tag.d.ts +42 -2
- package/lib/searchable-select/searchable-select.d.ts +336 -16
- package/lib/select/select.d.ts +294 -14
- package/lib/selectable-box/selectable-box.d.ts +42 -3
- package/lib/simple-color-picker/definition.d.ts +4 -0
- package/lib/simple-color-picker/locale.d.ts +4 -0
- package/lib/simple-color-picker/simple-color-picker.d.ts +1600 -0
- package/lib/simple-color-picker/simple-color-picker.template.d.ts +3 -0
- package/lib/slider/slider.d.ts +126 -6
- package/lib/split-button/split-button.d.ts +128 -6
- package/lib/switch/switch.d.ts +84 -4
- package/lib/tab/tab.d.ts +126 -6
- package/lib/tab-panel/tab-panel.d.ts +42 -2
- package/lib/tag/tag.d.ts +126 -6
- package/lib/tag-group/tag-group.d.ts +42 -2
- package/lib/tag-name-map.d.ts +2 -1
- package/lib/text-area/text-area.d.ts +787 -91
- package/lib/text-field/text-field.d.ts +840 -104
- package/lib/time-picker/time-picker.d.ts +188 -28
- package/lib/toggletip/toggletip.d.ts +84 -4
- package/lib/tooltip/tooltip.d.ts +42 -2
- package/lib/tree-item/tree-item.d.ts +84 -4
- package/lib/tree-view/tree-view.d.ts +42 -2
- package/lib/video-player/video-player.d.ts +42 -2
- package/locales/de-DE.cjs +13 -1
- package/locales/de-DE.js +13 -1
- package/locales/en-GB.cjs +13 -1
- package/locales/en-GB.js +13 -1
- package/locales/en-US.cjs +13 -1
- package/locales/en-US.js +13 -1
- package/locales/ja-JP.cjs +13 -1
- package/locales/ja-JP.js +13 -1
- package/locales/zh-CN.cjs +13 -1
- package/locales/zh-CN.js +13 -1
- package/{shared/definition31.cjs → menu/definition.cjs} +46 -46
- package/{shared/definition31.js → menu/definition.js} +16 -18
- package/menu/index.cjs +1 -5
- package/menu/index.js +2 -3
- package/menu-item/definition.cjs +14 -0
- package/menu-item/definition.js +3 -0
- package/menu-item/index.cjs +1 -5
- package/menu-item/index.js +2 -3
- package/{shared/definition34.cjs → nav/definition.cjs} +7 -4
- package/{shared/definition34.js → nav/definition.js} +4 -3
- package/nav/index.cjs +5 -5
- package/nav/index.js +13 -3
- package/nav-disclosure/definition.cjs +122 -0
- package/nav-disclosure/definition.js +116 -0
- package/nav-disclosure/index.cjs +16 -5
- package/nav-disclosure/index.js +96 -3
- package/{shared/definition33.cjs → nav-item/definition.cjs} +19 -16
- package/{shared/definition33.js → nav-item/definition.js} +9 -8
- package/nav-item/index.cjs +2 -5
- package/nav-item/index.js +59 -3
- package/{shared/definition35.cjs → note/definition.cjs} +15 -13
- package/{shared/definition35.js → note/definition.js} +6 -6
- package/note/index.cjs +9 -5
- package/note/index.js +44 -3
- package/number-field/definition.cjs +438 -0
- package/{shared/definition36.js → number-field/definition.js} +31 -27
- package/number-field/index.cjs +60 -5
- package/number-field/index.js +369 -3
- package/option/definition.cjs +84 -0
- package/option/definition.js +78 -0
- package/option/index.cjs +1 -5
- package/option/index.js +2 -3
- package/package.json +15 -4
- package/{shared/definition38.cjs → pagination/definition.cjs} +31 -33
- package/{shared/definition38.js → pagination/definition.js} +7 -11
- package/pagination/index.cjs +43 -5
- package/pagination/index.js +194 -3
- package/popup/definition.cjs +13 -0
- package/popup/definition.js +4 -0
- package/popup/index.cjs +1 -5
- package/popup/index.js +2 -3
- package/{shared/definition40.cjs → progress/definition.cjs} +17 -15
- package/{shared/definition40.js → progress/definition.js} +6 -6
- package/progress/index.cjs +17 -5
- package/progress/index.js +69 -3
- package/{shared/definition39.cjs → progress-ring/definition.cjs} +17 -15
- package/{shared/definition39.js → progress-ring/definition.js} +7 -7
- package/progress-ring/index.cjs +1 -5
- package/progress-ring/index.js +2 -3
- package/{shared/definition42.cjs → radio/definition.cjs} +20 -23
- package/{shared/definition42.js → radio/definition.js} +8 -13
- package/radio/index.cjs +1 -5
- package/radio/index.js +2 -3
- package/{shared/definition41.cjs → radio-group/definition.cjs} +31 -30
- package/{shared/definition41.js → radio-group/definition.js} +8 -9
- package/radio-group/index.cjs +23 -5
- package/radio-group/index.js +255 -3
- package/{shared/definition43.cjs → range-slider/definition.cjs} +62 -61
- package/{shared/definition43.js → range-slider/definition.js} +13 -14
- package/range-slider/index.cjs +68 -5
- package/range-slider/index.js +456 -3
- package/rich-text-editor/definition.cjs +1206 -0
- package/rich-text-editor/definition.js +1200 -0
- package/rich-text-editor/index.cjs +133 -4
- package/rich-text-editor/index.js +10386 -2
- package/{shared/definition45.cjs → searchable-select/definition.cjs} +119 -116
- package/{shared/definition45.js → searchable-select/definition.js} +25 -24
- package/searchable-select/index.cjs +164 -5
- package/searchable-select/index.js +1025 -3
- package/{shared/definition46.cjs → select/definition.cjs} +80 -83
- package/{shared/definition46.js → select/definition.js} +19 -24
- package/select/index.cjs +1 -5
- package/select/index.js +2 -3
- package/{shared/definition47.cjs → selectable-box/definition.cjs} +26 -32
- package/{shared/definition47.js → selectable-box/definition.js} +9 -17
- package/selectable-box/index.cjs +28 -5
- package/selectable-box/index.js +136 -3
- package/shared/aria/aria-mixin.d.ts +43 -3
- package/shared/aria/attribute-removal.d.ts +3 -0
- package/shared/aria/delegate-aria-behavior.d.ts +0 -3
- package/shared/aria/delegates-aria.d.ts +42 -2
- package/shared/aria/host-semantics.d.ts +42 -2
- package/shared/color-picker/index.d.ts +2 -0
- package/shared/color-picker/types.d.ts +4 -0
- package/shared/color-picker/utils.d.ts +3 -0
- package/shared/feedback/feedback-message.d.ts +42 -2
- package/shared/feedback/mixins.d.ts +84 -4
- package/shared/foundation/button/button.d.ts +84 -4
- package/shared/foundation/form-associated/form-associated.d.ts +84 -4
- package/shared/foundation/vivid-element/vivid-element.d.ts +43 -3
- package/shared/localization/Locale.d.ts +2 -0
- package/shared/patterns/affix.d.ts +84 -4
- package/shared/patterns/anchored.d.ts +84 -4
- package/shared/patterns/char-count/char-count.d.ts +42 -2
- package/shared/patterns/form-elements/form-element.d.ts +84 -4
- package/shared/patterns/form-elements/with-contextual-help.d.ts +1238 -0
- package/shared/patterns/form-elements/with-error-text.d.ts +126 -6
- package/shared/patterns/form-elements/with-success-text.d.ts +42 -2
- package/shared/patterns/linkable.d.ts +42 -2
- package/shared/patterns/localized.d.ts +42 -2
- package/shared/patterns/trapped-focus.d.ts +42 -2
- package/shared/picker-field/mixins/calendar-picker.d.ts +94 -14
- package/shared/picker-field/mixins/calendar-picker.template.d.ts +94 -14
- package/shared/picker-field/mixins/inline-time-picker/inline-time-picker.d.ts +42 -2
- package/shared/picker-field/mixins/min-max-calendar-picker.d.ts +188 -28
- package/shared/picker-field/mixins/single-date-picker.d.ts +280 -40
- package/shared/picker-field/mixins/single-value-picker.d.ts +92 -12
- package/shared/picker-field/mixins/time-selection-picker.d.ts +188 -28
- package/shared/picker-field/mixins/time-selection-picker.template.d.ts +188 -28
- package/shared/picker-field/picker-field.d.ts +252 -12
- package/{shared/definition48.cjs → side-drawer/definition.cjs} +16 -14
- package/{shared/definition48.js → side-drawer/definition.js} +5 -5
- package/side-drawer/index.cjs +17 -3
- package/side-drawer/index.js +100 -2
- package/simple-color-picker/definition.cjs +398 -0
- package/simple-color-picker/definition.js +392 -0
- package/simple-color-picker/index.cjs +31 -0
- package/simple-color-picker/index.js +250 -0
- package/{shared/definition49.cjs → slider/definition.cjs} +46 -53
- package/{shared/definition49.js → slider/definition.js} +11 -20
- package/slider/index.cjs +1 -5
- package/slider/index.js +2 -3
- package/split-button/definition.cjs +176 -0
- package/split-button/definition.js +170 -0
- package/split-button/index.cjs +26 -5
- package/split-button/index.js +149 -3
- package/styles/core/all.css +1 -1
- package/styles/core/theme.css +1 -1
- package/styles/core/typography.css +1 -1
- package/styles/tokens/theme-dark.css +4 -4
- package/styles/tokens/theme-light.css +4 -4
- package/styles/tokens/vivid-2-compat.css +1 -1
- package/{shared/definition51.cjs → switch/definition.cjs} +20 -19
- package/{shared/definition51.js → switch/definition.js} +8 -9
- package/switch/index.cjs +16 -5
- package/switch/index.js +102 -3
- package/tab/definition.cjs +127 -0
- package/tab/definition.js +121 -0
- package/tab/index.cjs +1 -5
- package/tab/index.js +2 -3
- package/{shared/definition52.cjs → tab-panel/definition.cjs} +7 -4
- package/{shared/definition52.js → tab-panel/definition.js} +4 -3
- package/tab-panel/index.cjs +1 -5
- package/tab-panel/index.js +2 -3
- package/{shared/definition54.cjs → tabs/definition.cjs} +47 -40
- package/{shared/definition54.js → tabs/definition.js} +19 -14
- package/tabs/index.cjs +31 -5
- package/tabs/index.js +321 -3
- package/tag/definition.cjs +156 -0
- package/tag/definition.js +150 -0
- package/tag/index.cjs +19 -5
- package/tag/index.js +118 -3
- package/{shared/definition55.cjs → tag-group/definition.cjs} +9 -6
- package/{shared/definition55.js → tag-group/definition.js} +5 -4
- package/tag-group/index.cjs +8 -5
- package/tag-group/index.js +26 -3
- package/text-area/definition.cjs +355 -0
- package/text-area/definition.js +349 -0
- package/text-area/index.cjs +41 -5
- package/text-area/index.js +293 -3
- package/{shared/definition58.cjs → text-field/definition.cjs} +70 -52
- package/{shared/definition58.js → text-field/definition.js} +40 -24
- package/text-field/index.cjs +1 -5
- package/text-field/index.js +2 -3
- package/time-picker/definition.cjs +43 -0
- package/{shared/definition59.js → time-picker/definition.js} +9 -8
- package/time-picker/index.cjs +1 -5
- package/time-picker/index.js +29 -3
- package/{shared/definition60.cjs → toggletip/definition.cjs} +20 -18
- package/{shared/definition60.js → toggletip/definition.js} +8 -8
- package/toggletip/index.cjs +1 -5
- package/toggletip/index.js +2 -3
- package/{shared/definition61.cjs → tooltip/definition.cjs} +16 -13
- package/{shared/definition61.js → tooltip/definition.js} +7 -6
- package/tooltip/index.cjs +1 -5
- package/tooltip/index.js +2 -3
- package/tree-item/definition.cjs +13 -0
- package/tree-item/definition.js +3 -0
- package/tree-item/index.cjs +1 -5
- package/tree-item/index.js +2 -3
- package/{shared/definition63.cjs → tree-view/definition.cjs} +42 -44
- package/{shared/definition63.js → tree-view/definition.js} +7 -11
- package/tree-view/index.cjs +13 -5
- package/tree-view/index.js +171 -3
- package/{shared → unbundled}/affix.cjs +10 -11
- package/{shared → unbundled}/affix.js +2 -3
- package/{shared → unbundled}/anchored.cjs +7 -8
- package/{shared → unbundled}/anchored.js +1 -2
- package/{shared → unbundled}/attribute-binding-behaviour.cjs +3 -3
- package/{shared → unbundled}/attribute-binding-behaviour.js +1 -1
- package/{shared → unbundled}/base-progress.cjs +6 -5
- package/{shared → unbundled}/base-progress.js +2 -1
- package/{shared → unbundled}/breadcrumb-item.cjs +3 -2
- package/{shared → unbundled}/breadcrumb-item.js +2 -1
- package/{shared → unbundled}/button.cjs +10 -9
- package/{shared → unbundled}/button.js +2 -1
- package/{shared → unbundled}/calendar-event.cjs +8 -7
- package/{shared → unbundled}/calendar-event.js +2 -1
- package/unbundled/calendar-picker.template.cjs +917 -0
- package/unbundled/calendar-picker.template.js +906 -0
- package/{shared → unbundled}/char-count.cjs +6 -7
- package/{shared → unbundled}/char-count.js +2 -3
- package/unbundled/definition.cjs +225 -0
- package/unbundled/definition.js +220 -0
- package/{shared/definition30.cjs → unbundled/definition2.cjs} +49 -46
- package/{shared/definition30.js → unbundled/definition2.js} +14 -11
- package/unbundled/definition3.cjs +207 -0
- package/{shared/definition62.js → unbundled/definition3.js} +6 -10
- package/unbundled/definition4.cjs +298 -0
- package/unbundled/definition4.js +293 -0
- package/{shared/definition65.cjs → unbundled/definition5.cjs} +7 -6
- package/{shared/definition65.js → unbundled/definition5.js} +3 -2
- package/{shared → unbundled}/delegates-aria.cjs +8 -28
- package/{shared → unbundled}/delegates-aria.js +6 -26
- package/{shared → unbundled}/divider.cjs +13 -7
- package/{shared → unbundled}/divider.js +11 -5
- package/{shared → unbundled}/form-associated.cjs +13 -13
- package/{shared → unbundled}/form-associated.js +2 -2
- package/{shared → unbundled}/form-element.cjs +3 -3
- package/{shared → unbundled}/form-element.js +1 -1
- package/{shared → unbundled}/host-semantics.cjs +2 -1
- package/{shared → unbundled}/host-semantics.js +2 -1
- package/unbundled/key-codes.cjs +10 -0
- package/unbundled/key-codes.js +7 -0
- package/{shared → unbundled}/linkable.cjs +11 -12
- package/{shared → unbundled}/linkable.js +1 -2
- package/{shared → unbundled}/listbox.cjs +22 -38
- package/{shared → unbundled}/listbox.js +4 -20
- package/{shared → unbundled}/localized.cjs +2 -2
- package/{shared → unbundled}/localized.js +1 -1
- package/{shared → unbundled}/mixins.cjs +27 -83
- package/{shared → unbundled}/mixins.js +6 -62
- package/{shared → unbundled}/option.cjs +42 -17
- package/{shared → unbundled}/option.js +29 -4
- package/{shared → unbundled}/picker-field.template.cjs +21 -21
- package/{shared → unbundled}/picker-field.template.js +7 -7
- package/{shared → unbundled}/slider.template.cjs +15 -19
- package/{shared → unbundled}/slider.template.js +3 -7
- package/unbundled/text-field.cjs +5 -0
- package/unbundled/text-field.js +3 -0
- package/{shared → unbundled}/time-selection-picker.template.cjs +28 -30
- package/{shared → unbundled}/time-selection-picker.template.js +4 -6
- package/unbundled/vivid-element.cjs +283 -0
- package/unbundled/vivid-element.js +274 -0
- package/unbundled/with-contextual-help.cjs +29 -0
- package/unbundled/with-contextual-help.js +27 -0
- package/{shared → unbundled}/with-error-text.cjs +2 -2
- package/{shared → unbundled}/with-error-text.js +1 -1
- package/{shared → unbundled}/with-success-text.cjs +2 -2
- package/{shared → unbundled}/with-success-text.js +1 -1
- package/video-player/definition.cjs +536 -0
- package/video-player/definition.js +530 -0
- package/video-player/index.cjs +536 -3
- package/video-player/index.js +35912 -2
- package/{shared/definition66.cjs → visually-hidden/definition.cjs} +6 -3
- package/{shared/definition66.js → visually-hidden/definition.js} +3 -2
- package/visually-hidden/index.cjs +1 -5
- package/visually-hidden/index.js +2 -3
- package/vivid.api.json +716 -914
- package/shared/_has.cjs +0 -58
- package/shared/_has.js +0 -54
- package/shared/aria.cjs +0 -11
- package/shared/aria.js +0 -9
- package/shared/calendar-picker.template.cjs +0 -6377
- package/shared/calendar-picker.template.js +0 -6366
- package/shared/children.cjs +0 -61
- package/shared/children.js +0 -59
- package/shared/class-names.cjs +0 -17
- package/shared/class-names.js +0 -15
- package/shared/definition.cjs +0 -145
- package/shared/definition.js +0 -141
- package/shared/definition11.cjs +0 -220
- package/shared/definition11.js +0 -215
- package/shared/definition14.cjs +0 -185
- package/shared/definition24.cjs +0 -80
- package/shared/definition24.js +0 -76
- package/shared/definition25.cjs +0 -90
- package/shared/definition25.js +0 -86
- package/shared/definition26.cjs +0 -2514
- package/shared/definition26.js +0 -2510
- package/shared/definition32.cjs +0 -120
- package/shared/definition32.js +0 -116
- package/shared/definition36.cjs +0 -432
- package/shared/definition37.cjs +0 -71
- package/shared/definition37.js +0 -68
- package/shared/definition44.cjs +0 -14666
- package/shared/definition44.js +0 -14662
- package/shared/definition50.cjs +0 -148
- package/shared/definition50.js +0 -144
- package/shared/definition53.cjs +0 -124
- package/shared/definition53.js +0 -120
- package/shared/definition56.cjs +0 -154
- package/shared/definition56.js +0 -150
- package/shared/definition57.cjs +0 -335
- package/shared/definition57.js +0 -331
- package/shared/definition59.cjs +0 -39
- package/shared/definition62.cjs +0 -211
- package/shared/definition64.cjs +0 -69579
- package/shared/definition64.js +0 -69575
- package/shared/definition67.cjs +0 -2227
- package/shared/definition67.js +0 -2222
- package/shared/dom.cjs +0 -10
- package/shared/dom.js +0 -8
- package/shared/key-codes.cjs +0 -32
- package/shared/key-codes.js +0 -18
- package/shared/numbers.cjs +0 -38
- package/shared/numbers.js +0 -34
- package/shared/ref.cjs +0 -43
- package/shared/ref.js +0 -41
- package/shared/repeat.cjs +0 -767
- package/shared/repeat.js +0 -764
- package/shared/slotted.cjs +0 -123
- package/shared/slotted.js +0 -119
- package/shared/strings.cjs +0 -11
- package/shared/strings.js +0 -9
- package/shared/text-field.cjs +0 -5
- package/shared/text-field.js +0 -3
- package/shared/vivid-element.cjs +0 -2771
- package/shared/vivid-element.js +0 -2748
- package/shared/when.cjs +0 -31
- package/shared/when.js +0 -29
- /package/{shared → unbundled}/enums.cjs +0 -0
- /package/{shared → unbundled}/enums.js +0 -0
- /package/{shared → unbundled}/index.cjs +0 -0
- /package/{shared → unbundled}/index.js +0 -0
- /package/{shared → unbundled}/playbackRates.cjs +0 -0
- /package/{shared → unbundled}/playbackRates.js +0 -0
- /package/{shared → unbundled}/scrollIntoView.cjs +0 -0
- /package/{shared → unbundled}/scrollIntoView.js +0 -0
- /package/{shared → unbundled}/single-date-picker.cjs +0 -0
- /package/{shared → unbundled}/single-date-picker.js +0 -0
- /package/{shared → unbundled}/single-value-picker.cjs +0 -0
- /package/{shared → unbundled}/single-value-picker.js +0 -0
|
@@ -1,29 +1,26 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
const definition$2 = require('./definition28.cjs');
|
|
5
|
-
const definition$3 = require('./definition37.cjs');
|
|
6
|
-
const vividElement = require('./vivid-element.cjs');
|
|
7
|
-
const mixins = require('./mixins.cjs');
|
|
8
|
-
const listbox = require('./listbox.cjs');
|
|
9
|
-
const hostSemantics = require('./host-semantics.cjs');
|
|
10
|
-
const formAssociated = require('./form-associated.cjs');
|
|
11
|
-
const numbers = require('./numbers.cjs');
|
|
12
|
-
const withErrorText = require('./with-error-text.cjs');
|
|
13
|
-
const withSuccessText = require('./with-success-text.cjs');
|
|
14
|
-
const formElement = require('./form-element.cjs');
|
|
15
|
-
const affix = require('./affix.cjs');
|
|
16
|
-
const strings = require('./strings.cjs');
|
|
17
|
-
const keyCodes = require('./key-codes.cjs');
|
|
18
|
-
const option = require('./option.cjs');
|
|
19
|
-
const definition$1 = require('./definition11.cjs');
|
|
20
|
-
const index = require('./index.cjs');
|
|
21
|
-
const ref = require('./ref.cjs');
|
|
22
|
-
const when = require('./when.cjs');
|
|
23
|
-
const slotted = require('./slotted.cjs');
|
|
24
|
-
const classNames = require('./class-names.cjs');
|
|
3
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
25
4
|
|
|
26
|
-
const
|
|
5
|
+
const popup_definition = require('../unbundled/definition4.cjs');
|
|
6
|
+
const icon_definition = require('../icon/definition.cjs');
|
|
7
|
+
const option_definition = require('../option/definition.cjs');
|
|
8
|
+
const vividElement = require('../unbundled/vivid-element.cjs');
|
|
9
|
+
const mixins = require('../unbundled/mixins.cjs');
|
|
10
|
+
const fastElement = require('@microsoft/fast-element');
|
|
11
|
+
const fastWebUtilities = require('@microsoft/fast-web-utilities');
|
|
12
|
+
const listbox = require('../unbundled/listbox.cjs');
|
|
13
|
+
const hostSemantics = require('../unbundled/host-semantics.cjs');
|
|
14
|
+
const formAssociated = require('../unbundled/form-associated.cjs');
|
|
15
|
+
const withErrorText = require('../unbundled/with-error-text.cjs');
|
|
16
|
+
const withSuccessText = require('../unbundled/with-success-text.cjs');
|
|
17
|
+
const formElement = require('../unbundled/form-element.cjs');
|
|
18
|
+
const affix = require('../unbundled/affix.cjs');
|
|
19
|
+
const option = require('../unbundled/option.cjs');
|
|
20
|
+
const button_definition = require('../unbundled/definition.cjs');
|
|
21
|
+
const index = require('../unbundled/index.cjs');
|
|
22
|
+
|
|
23
|
+
const styles = ".chevron{display:flex;flex-shrink:0;font:var(--vvd-typography-base-extended);transform:rotate(0);transition:transform .2s}:host([data-expanded=true]) .chevron,:host([open]) .chevron{transform:rotate(180deg)}:host(:focus-visible){outline:none}:host{display:inline-flex;flex-direction:column;gap:4px;--_low-ink-color: var(--vvd-color-neutral-600);--focus-stroke-gap-color: transparent}:host([disabled]){--_low-ink-color: var(--vvd-color-neutral-400);cursor:not-allowed}.label{color:var(--vvd-color-canvas-text);contain:inline-size;font:var(--vvd-typography-base)}.control{--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--vvd-color-neutral-500)}.control.appearance-ghost{--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}@media (hover: hover){.control: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)}.control: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}}.control.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)}.control.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}.control: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)}.control:disabled.appearance-ghost{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.control.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)}.control.disabled.appearance-ghost{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.control.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)}.control.readonly:where(:not(.disabled,:disabled)).appearance-ghost{--_appearance-color-text: var(--vvd-color-neutral-600);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.control.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)}.control.error:where(:not(.disabled,:disabled)).appearance-ghost{--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-alert-50);--_appearance-color-outline: transparent}.control.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)}.control.success:where(:not(.disabled,:disabled)).appearance-ghost{--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-success-50);--_appearance-color-outline: transparent}.control{--_connotation-color-primary: var(--vvd-select-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-primary-text: var(--vvd-select-accent-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-select-accent-primary-increment, var(--vvd-color-neutral-800));--_connotation-color-intermediate: var(--vvd-select-accent-intermediate, var(--vvd-color-neutral-500));--_connotation-color-faint: var(--vvd-select-accent-faint, var(--vvd-color-neutral-50));--_connotation-color-soft: var(--vvd-select-accent-soft, var(--vvd-color-neutral-100));--_connotation-color-firm: var(--vvd-select-accent-firm, var(--vvd-color-canvas-text));--_connotation-color-fierce: var(--vvd-select-accent-fierce, var(--vvd-color-neutral-700))}.control{border-radius:var(--_select-control-border-radius);block-size:var(--_select-block-size);padding-inline:var(--_select-padding-inline)}.control{--_select-icon-size: calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))/2) ;--_select-block-size: calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))) ;--_select-padding-inline: calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))*.4) ;display:flex;align-items:center;justify-content:space-between;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);gap:8px;transition:box-shadow .2s,background-color .2s}.control.size-condensed{--_select-icon-size: calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))*.4) ;--_select-block-size: calc(1px*(32 + 4*clamp(-1, var(--vvd-size-density, 0), 2))) ;--_select-padding-inline: calc(1px*(24 + 4*clamp(-1, var(--vvd-size-density, 0), 2))/2) }.control.size-condensed:not(.shape-pill){--_select-control-border-radius: 4px}.control-wrapper{position:relative}.control:not(.disabled){cursor:pointer}.control.disabled{pointer-events:none}.control:not(.shape-pill){--_select-control-border-radius: 8px}.control.shape-pill{--_select-control-border-radius: 24px}:host(:focus-visible) .control{box-shadow:0 0 0 4px color-mix(in srgb,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))}.listbox{display:flex;max-height:var(--select-height, 408px);flex-direction:column;padding:4px;gap:2px;overflow-y:auto}:host([multiple]:focus-visible) .listbox{box-shadow:0 0 0 4px color-mix(in srgb,var(--vvd-color-cta-500),transparent 85%),inset 0 0 0 3px var(--focus-stroke-gap-color, currentColor);outline:1px solid var(--focus-stroke-color, var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset, 0px));border-radius:8px}.selected-value{display:flex;overflow:hidden;flex-grow:1;align-items:center;column-gap:12px;white-space:nowrap}.selected-value .text{overflow:hidden;max-inline-size:100%;text-overflow:ellipsis}.control.shows-placeholder .selected-value .text{color:var(--vvd-color-neutral-600)}.selected-value slot[name=icon]{flex:0 0 var(--_select-icon-size);font-size:var(--_select-icon-size);line-height:1}.control.has-meta .selected-value{padding-inline-end:8px}.feedback-wrapper{display:contents}::part(popup-base){inline-size:max-content;min-inline-size:var(--_select-fixed-width, 100%)}:host([multiple]) ::part(popup-base){position:static}";
|
|
27
24
|
|
|
28
25
|
var __defProp = Object.defineProperty;
|
|
29
26
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
@@ -61,7 +58,7 @@ class Select extends mixins.WithLightDOMFeedback(
|
|
|
61
58
|
*
|
|
62
59
|
* @internal
|
|
63
60
|
*/
|
|
64
|
-
this.listboxId =
|
|
61
|
+
this.listboxId = fastWebUtilities.uniqueId("listbox-");
|
|
65
62
|
this.maxHeight = 0;
|
|
66
63
|
this.fixedDropdown = false;
|
|
67
64
|
this.placeholderOption = null;
|
|
@@ -130,7 +127,7 @@ class Select extends mixins.WithLightDOMFeedback(
|
|
|
130
127
|
this.rangeStartIndex = this.activeIndex + 1;
|
|
131
128
|
}
|
|
132
129
|
this.options.forEach((o, i) => {
|
|
133
|
-
o.checked =
|
|
130
|
+
o.checked = fastWebUtilities.inRange(i, this.rangeStartIndex);
|
|
134
131
|
});
|
|
135
132
|
} else {
|
|
136
133
|
this.uncheckAllOptions();
|
|
@@ -154,7 +151,7 @@ class Select extends mixins.WithLightDOMFeedback(
|
|
|
154
151
|
this.rangeStartIndex = this.activeIndex;
|
|
155
152
|
}
|
|
156
153
|
this.options.forEach((o, i) => {
|
|
157
|
-
o.checked =
|
|
154
|
+
o.checked = fastWebUtilities.inRange(i, this.rangeStartIndex, this.length);
|
|
158
155
|
});
|
|
159
156
|
} else {
|
|
160
157
|
this.uncheckAllOptions();
|
|
@@ -178,7 +175,7 @@ class Select extends mixins.WithLightDOMFeedback(
|
|
|
178
175
|
this.rangeStartIndex = this.activeIndex;
|
|
179
176
|
}
|
|
180
177
|
this.options.forEach((o, i) => {
|
|
181
|
-
o.checked =
|
|
178
|
+
o.checked = fastWebUtilities.inRange(i, this.rangeStartIndex, this.activeIndex + 1);
|
|
182
179
|
});
|
|
183
180
|
} else {
|
|
184
181
|
this.uncheckAllOptions();
|
|
@@ -205,7 +202,7 @@ class Select extends mixins.WithLightDOMFeedback(
|
|
|
205
202
|
this.rangeStartIndex += 1;
|
|
206
203
|
}
|
|
207
204
|
this.options.forEach((o, i) => {
|
|
208
|
-
o.checked =
|
|
205
|
+
o.checked = fastWebUtilities.inRange(i, this.activeIndex, this.rangeStartIndex);
|
|
209
206
|
});
|
|
210
207
|
} else {
|
|
211
208
|
this.uncheckAllOptions();
|
|
@@ -323,7 +320,7 @@ class Select extends mixins.WithLightDOMFeedback(
|
|
|
323
320
|
if (this.open) {
|
|
324
321
|
this.focusAndScrollOptionIntoView();
|
|
325
322
|
this.indexWhenOpened = this.selectedIndex;
|
|
326
|
-
|
|
323
|
+
fastElement.DOM.queueUpdate(() => this.focus());
|
|
327
324
|
return;
|
|
328
325
|
}
|
|
329
326
|
const didClose = prev === true && next === false;
|
|
@@ -526,32 +523,32 @@ class Select extends mixins.WithLightDOMFeedback(
|
|
|
526
523
|
const { key, shiftKey } = e;
|
|
527
524
|
this.shouldSkipFocus = false;
|
|
528
525
|
switch (key) {
|
|
529
|
-
case
|
|
526
|
+
case fastWebUtilities.keyHome: {
|
|
530
527
|
this.checkFirstOption(shiftKey);
|
|
531
528
|
return;
|
|
532
529
|
}
|
|
533
|
-
case
|
|
530
|
+
case fastWebUtilities.keyArrowDown: {
|
|
534
531
|
this.checkNextOption(shiftKey);
|
|
535
532
|
return;
|
|
536
533
|
}
|
|
537
|
-
case
|
|
534
|
+
case fastWebUtilities.keyArrowUp: {
|
|
538
535
|
this.checkPreviousOption(shiftKey);
|
|
539
536
|
return;
|
|
540
537
|
}
|
|
541
|
-
case
|
|
538
|
+
case fastWebUtilities.keyEnd: {
|
|
542
539
|
this.checkLastOption(shiftKey);
|
|
543
540
|
return;
|
|
544
541
|
}
|
|
545
|
-
case
|
|
542
|
+
case fastWebUtilities.keyTab: {
|
|
546
543
|
this.focusAndScrollOptionIntoView();
|
|
547
544
|
return;
|
|
548
545
|
}
|
|
549
|
-
case
|
|
546
|
+
case fastWebUtilities.keyEscape: {
|
|
550
547
|
this.uncheckAllOptions();
|
|
551
548
|
this.checkActiveIndex();
|
|
552
549
|
return;
|
|
553
550
|
}
|
|
554
|
-
case
|
|
551
|
+
case fastWebUtilities.keySpace: {
|
|
555
552
|
e.preventDefault();
|
|
556
553
|
if (this.typeaheadExpired) {
|
|
557
554
|
this.toggleSelectedForAllCheckedOptions();
|
|
@@ -581,31 +578,31 @@ class Select extends mixins.WithLightDOMFeedback(
|
|
|
581
578
|
}
|
|
582
579
|
const key = e.key;
|
|
583
580
|
switch (key) {
|
|
584
|
-
case
|
|
581
|
+
case fastWebUtilities.keySpace: {
|
|
585
582
|
e.preventDefault();
|
|
586
583
|
if (this.collapsible && this.typeaheadExpired) {
|
|
587
584
|
this.open = !this.open;
|
|
588
585
|
}
|
|
589
586
|
break;
|
|
590
587
|
}
|
|
591
|
-
case
|
|
592
|
-
case
|
|
588
|
+
case fastWebUtilities.keyHome:
|
|
589
|
+
case fastWebUtilities.keyEnd: {
|
|
593
590
|
e.preventDefault();
|
|
594
591
|
break;
|
|
595
592
|
}
|
|
596
|
-
case
|
|
593
|
+
case fastWebUtilities.keyEnter: {
|
|
597
594
|
e.preventDefault();
|
|
598
595
|
this.open = !this.open;
|
|
599
596
|
break;
|
|
600
597
|
}
|
|
601
|
-
case
|
|
598
|
+
case fastWebUtilities.keyEscape: {
|
|
602
599
|
if (this.collapsible && this.open) {
|
|
603
600
|
e.preventDefault();
|
|
604
601
|
this.open = false;
|
|
605
602
|
}
|
|
606
603
|
break;
|
|
607
604
|
}
|
|
608
|
-
case
|
|
605
|
+
case fastWebUtilities.keyTab: {
|
|
609
606
|
if (this.collapsible && this.open) {
|
|
610
607
|
e.preventDefault();
|
|
611
608
|
this.open = false;
|
|
@@ -616,7 +613,7 @@ class Select extends mixins.WithLightDOMFeedback(
|
|
|
616
613
|
if (this.collapsible && !this.open && this.selectedIndex !== selectedIndexBefore) {
|
|
617
614
|
this.updateValue(true);
|
|
618
615
|
}
|
|
619
|
-
return !(e.key ===
|
|
616
|
+
return !(e.key === fastWebUtilities.keyArrowDown || e.key === fastWebUtilities.keyArrowUp);
|
|
620
617
|
}
|
|
621
618
|
connectedCallback() {
|
|
622
619
|
super.connectedCallback();
|
|
@@ -634,11 +631,11 @@ class Select extends mixins.WithLightDOMFeedback(
|
|
|
634
631
|
*/
|
|
635
632
|
updateDisplayValue() {
|
|
636
633
|
if (this.collapsible) {
|
|
637
|
-
|
|
634
|
+
fastElement.Observable.notify(this, "displayValue");
|
|
638
635
|
}
|
|
639
636
|
}
|
|
640
637
|
get displayValue() {
|
|
641
|
-
|
|
638
|
+
fastElement.Observable.track(this, "displayValue");
|
|
642
639
|
return this.firstSelectedOption?.getAttribute("label") ?? this.firstSelectedOption?.text ?? this.placeholder ?? "";
|
|
643
640
|
}
|
|
644
641
|
setDefaultSelectedOption() {
|
|
@@ -662,12 +659,12 @@ class Select extends mixins.WithLightDOMFeedback(
|
|
|
662
659
|
*/
|
|
663
660
|
slottedOptionsChanged(prev, next) {
|
|
664
661
|
this.options.forEach((o) => {
|
|
665
|
-
const notifier =
|
|
662
|
+
const notifier = fastElement.Observable.getNotifier(o);
|
|
666
663
|
notifier.unsubscribe(this, "value");
|
|
667
664
|
});
|
|
668
665
|
super.slottedOptionsChanged(prev, next);
|
|
669
666
|
this.options.forEach((o) => {
|
|
670
|
-
const notifier =
|
|
667
|
+
const notifier = fastElement.Observable.getNotifier(o);
|
|
671
668
|
notifier.subscribe(this, "value");
|
|
672
669
|
});
|
|
673
670
|
this.setProxyOptions();
|
|
@@ -694,50 +691,50 @@ class Select extends mixins.WithLightDOMFeedback(
|
|
|
694
691
|
}
|
|
695
692
|
}
|
|
696
693
|
__decorateClass([
|
|
697
|
-
|
|
694
|
+
fastElement.observable
|
|
698
695
|
], Select.prototype, "activeIndex", 2);
|
|
699
696
|
// @ts-expect-error Type is incorrectly non-optional
|
|
700
697
|
__decorateClass([
|
|
701
|
-
|
|
698
|
+
fastElement.attr({ mode: "boolean" })
|
|
702
699
|
], Select.prototype, "multiple", 2);
|
|
703
700
|
__decorateClass([
|
|
704
|
-
|
|
701
|
+
fastElement.attr({ attribute: "open", mode: "boolean" })
|
|
705
702
|
], Select.prototype, "open", 2);
|
|
706
703
|
__decorateClass([
|
|
707
|
-
|
|
704
|
+
fastElement.volatile
|
|
708
705
|
], Select.prototype, "collapsible", 1);
|
|
709
706
|
__decorateClass([
|
|
710
|
-
|
|
707
|
+
fastElement.observable
|
|
711
708
|
], Select.prototype, "control", 2);
|
|
712
709
|
__decorateClass([
|
|
713
|
-
|
|
710
|
+
fastElement.observable
|
|
714
711
|
], Select.prototype, "maxHeight", 2);
|
|
715
712
|
__decorateClass([
|
|
716
|
-
|
|
713
|
+
fastElement.observable
|
|
717
714
|
], Select.prototype, "_anchor", 2);
|
|
718
715
|
__decorateClass([
|
|
719
|
-
|
|
716
|
+
fastElement.attr()
|
|
720
717
|
], Select.prototype, "scale", 2);
|
|
721
718
|
__decorateClass([
|
|
722
|
-
|
|
719
|
+
fastElement.attr
|
|
723
720
|
], Select.prototype, "appearance", 2);
|
|
724
721
|
__decorateClass([
|
|
725
|
-
|
|
722
|
+
fastElement.attr
|
|
726
723
|
], Select.prototype, "shape", 2);
|
|
727
724
|
__decorateClass([
|
|
728
|
-
|
|
725
|
+
fastElement.attr({ mode: "boolean", attribute: "fixed-dropdown" })
|
|
729
726
|
], Select.prototype, "fixedDropdown", 2);
|
|
730
727
|
__decorateClass([
|
|
731
|
-
|
|
728
|
+
fastElement.attr
|
|
732
729
|
], Select.prototype, "placeholder", 2);
|
|
733
730
|
__decorateClass([
|
|
734
|
-
|
|
731
|
+
fastElement.observable
|
|
735
732
|
], Select.prototype, "placeholderOption", 2);
|
|
736
733
|
__decorateClass([
|
|
737
|
-
|
|
734
|
+
fastElement.observable
|
|
738
735
|
], Select.prototype, "_feedbackWrapper", 2);
|
|
739
736
|
__decorateClass([
|
|
740
|
-
|
|
737
|
+
fastElement.observable
|
|
741
738
|
], Select.prototype, "metaSlottedContent", 2);
|
|
742
739
|
|
|
743
740
|
const getStateClasses = ({
|
|
@@ -750,7 +747,7 @@ const getStateClasses = ({
|
|
|
750
747
|
placeholder,
|
|
751
748
|
value,
|
|
752
749
|
scale
|
|
753
|
-
}) =>
|
|
750
|
+
}) => fastWebUtilities.classNames(
|
|
754
751
|
["disabled", disabled],
|
|
755
752
|
[`appearance-${appearance}`, Boolean(appearance)],
|
|
756
753
|
[`shape-${shape}`, Boolean(shape)],
|
|
@@ -761,7 +758,7 @@ const getStateClasses = ({
|
|
|
761
758
|
[`size-${scale}`, Boolean(scale)]
|
|
762
759
|
);
|
|
763
760
|
function renderLabel() {
|
|
764
|
-
return
|
|
761
|
+
return fastElement.html` <label
|
|
765
762
|
for="${(x) => x.multiple ? null : "control"}"
|
|
766
763
|
class="label"
|
|
767
764
|
id="label"
|
|
@@ -771,24 +768,24 @@ function renderLabel() {
|
|
|
771
768
|
}
|
|
772
769
|
function renderPlaceholder(context) {
|
|
773
770
|
const optionTag = context.tagFor(option.ListboxOption);
|
|
774
|
-
return
|
|
775
|
-
<${optionTag} ${
|
|
771
|
+
return fastElement.html`
|
|
772
|
+
<${optionTag} ${fastElement.ref("placeholderOption")}
|
|
776
773
|
text="${(x) => x.placeholder}" hidden disabled>
|
|
777
774
|
</${optionTag}>`;
|
|
778
775
|
}
|
|
779
776
|
function selectValue(context) {
|
|
780
777
|
const affixIconTemplate = affix.affixIconTemplateFactory(context);
|
|
781
|
-
const chevronTemplate =
|
|
782
|
-
return
|
|
778
|
+
const chevronTemplate = button_definition.chevronTemplateFactory(context);
|
|
779
|
+
return fastElement.html` <div
|
|
783
780
|
class="control ${getStateClasses}"
|
|
784
|
-
${
|
|
781
|
+
${fastElement.ref("_anchor")}
|
|
785
782
|
id="control"
|
|
786
783
|
?disabled="${(x) => x.disabled}"
|
|
787
784
|
>
|
|
788
785
|
<div class="selected-value">
|
|
789
786
|
${(x) => affixIconTemplate(x.icon, affix.IconWrapper.Slot)}
|
|
790
787
|
<span class="text">${(x) => x.displayValue}</span>
|
|
791
|
-
<slot name="meta" ${
|
|
788
|
+
<slot name="meta" ${fastElement.slotted("metaSlottedContent")}></slot>
|
|
792
789
|
</div>
|
|
793
790
|
${chevronTemplate}
|
|
794
791
|
</div>`;
|
|
@@ -797,11 +794,11 @@ function setFixedDropdownVarWidth(x) {
|
|
|
797
794
|
return x.open && x.fixedDropdown ? `--_select-fixed-width: ${Math.round(x.getBoundingClientRect().width)}px` : null;
|
|
798
795
|
}
|
|
799
796
|
function renderControl(context) {
|
|
800
|
-
const popupTag = context.tagFor(
|
|
801
|
-
return
|
|
802
|
-
${
|
|
797
|
+
const popupTag = context.tagFor(popup_definition.Popup);
|
|
798
|
+
return fastElement.html`
|
|
799
|
+
${fastElement.when((x) => x.label, renderLabel())}
|
|
803
800
|
<div class="control-wrapper">
|
|
804
|
-
${
|
|
801
|
+
${fastElement.when((x) => !x.multiple, selectValue(context))}
|
|
805
802
|
<${popupTag} class="popup"
|
|
806
803
|
style="${setFixedDropdownVarWidth}"
|
|
807
804
|
?open="${(x) => x.collapsible ? x.open : true}"
|
|
@@ -816,10 +813,10 @@ function renderControl(context) {
|
|
|
816
813
|
aria-labelledby="${(x) => x.multiple && x.label ? "label" : null}"
|
|
817
814
|
?disabled="${(x) => x.disabled}"
|
|
818
815
|
?hidden="${(x) => x.collapsible ? !x.open : false}"
|
|
819
|
-
${
|
|
820
|
-
${
|
|
816
|
+
${fastElement.ref("listbox")}>
|
|
817
|
+
${fastElement.when((x) => x.placeholder, renderPlaceholder(context))}
|
|
821
818
|
<slot
|
|
822
|
-
${
|
|
819
|
+
${fastElement.slotted({
|
|
823
820
|
filter: listbox.Listbox.slottedOptionFilter,
|
|
824
821
|
flatten: true,
|
|
825
822
|
property: "slottedOptions"
|
|
@@ -839,7 +836,7 @@ function ifNotFromFeedback(handler) {
|
|
|
839
836
|
};
|
|
840
837
|
}
|
|
841
838
|
const SelectTemplate = (context) => {
|
|
842
|
-
return
|
|
839
|
+
return fastElement.html`
|
|
843
840
|
<template
|
|
844
841
|
class="base"
|
|
845
842
|
${hostSemantics.applyHostSemantics({
|
|
@@ -867,7 +864,7 @@ const SelectTemplate = (context) => {
|
|
|
867
864
|
)}"
|
|
868
865
|
>
|
|
869
866
|
${renderControl(context)}
|
|
870
|
-
<div class="feedback-wrapper" ${
|
|
867
|
+
<div class="feedback-wrapper" ${fastElement.ref("_feedbackWrapper")}>
|
|
871
868
|
${(x) => x._getFeedbackTemplate(context)}
|
|
872
869
|
</div>
|
|
873
870
|
</template>
|
|
@@ -879,9 +876,9 @@ const selectDefinition = vividElement.defineVividComponent(
|
|
|
879
876
|
Select,
|
|
880
877
|
SelectTemplate,
|
|
881
878
|
[
|
|
882
|
-
|
|
883
|
-
|
|
884
|
-
|
|
879
|
+
popup_definition.popupDefinition,
|
|
880
|
+
icon_definition.iconDefinition,
|
|
881
|
+
option_definition.listboxOptionDefinition,
|
|
885
882
|
mixins.feedbackMessageDefinition
|
|
886
883
|
],
|
|
887
884
|
{
|
|
@@ -890,6 +887,6 @@ const selectDefinition = vividElement.defineVividComponent(
|
|
|
890
887
|
);
|
|
891
888
|
const registerSelect = vividElement.createRegisterFunction(selectDefinition);
|
|
892
889
|
|
|
893
|
-
exports.
|
|
890
|
+
exports.VwcSelectElement = Select;
|
|
894
891
|
exports.registerSelect = registerSelect;
|
|
895
892
|
exports.selectDefinition = selectDefinition;
|
|
@@ -1,27 +1,22 @@
|
|
|
1
|
-
import { P as Popup, p as popupDefinition } from '
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
5
|
-
import { W as WithLightDOMFeedback, f as feedbackMessageDefinition } from '
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
8
|
-
import {
|
|
9
|
-
import {
|
|
10
|
-
import {
|
|
11
|
-
import { W as
|
|
12
|
-
import {
|
|
13
|
-
import {
|
|
14
|
-
import {
|
|
15
|
-
import {
|
|
16
|
-
import {
|
|
17
|
-
import {
|
|
18
|
-
import { h as handleEscapeKeyAndStopPropogation } from './index.js';
|
|
19
|
-
import { r as ref } from './ref.js';
|
|
20
|
-
import { w as when } from './when.js';
|
|
21
|
-
import { s as slotted } from './slotted.js';
|
|
22
|
-
import { c as classNames } from './class-names.js';
|
|
1
|
+
import { P as Popup, p as popupDefinition } from '../unbundled/definition4.js';
|
|
2
|
+
import { iconDefinition } from '../icon/definition.js';
|
|
3
|
+
import { listboxOptionDefinition } from '../option/definition.js';
|
|
4
|
+
import { d as defineVividComponent, c as createRegisterFunction } from '../unbundled/vivid-element.js';
|
|
5
|
+
import { W as WithLightDOMFeedback, f as feedbackMessageDefinition } from '../unbundled/mixins.js';
|
|
6
|
+
import { DOM, Observable, observable, attr, volatile, ref, html, when, slotted } from '@microsoft/fast-element';
|
|
7
|
+
import { uniqueId, inRange, keySpace, keyEscape, keyTab, keyEnd, keyArrowUp, keyArrowDown, keyHome, keyEnter, classNames } from '@microsoft/fast-web-utilities';
|
|
8
|
+
import { L as Listbox } from '../unbundled/listbox.js';
|
|
9
|
+
import { H as HostSemantics, a as applyHostSemantics } from '../unbundled/host-semantics.js';
|
|
10
|
+
import { F as FormAssociated } from '../unbundled/form-associated.js';
|
|
11
|
+
import { W as WithErrorText } from '../unbundled/with-error-text.js';
|
|
12
|
+
import { W as WithSuccessText } from '../unbundled/with-success-text.js';
|
|
13
|
+
import { F as FormElement } from '../unbundled/form-element.js';
|
|
14
|
+
import { A as AffixIconWithTrailing, a as affixIconTemplateFactory, I as IconWrapper } from '../unbundled/affix.js';
|
|
15
|
+
import { L as ListboxOption } from '../unbundled/option.js';
|
|
16
|
+
import { c as chevronTemplateFactory } from '../unbundled/definition.js';
|
|
17
|
+
import { h as handleEscapeKeyAndStopPropogation } from '../unbundled/index.js';
|
|
23
18
|
|
|
24
|
-
const styles = ".chevron{display:flex;flex-shrink:0;font:var(--vvd-typography-base-extended);transform:rotate(0);transition:transform .2s}:host([data-expanded=true]) .chevron,:host([open]) .chevron{transform:rotate(180deg)}:host(:focus-visible){outline:none}:host{display:inline-flex;flex-direction:column;gap:4px;--_low-ink-color: var(--vvd-color-neutral-600);--focus-stroke-gap-color: transparent}:host([disabled]){--_low-ink-color: var(--vvd-color-neutral-400);cursor:not-allowed}.label{color:var(--vvd-color-canvas-text);contain:inline-size;font:var(--vvd-typography-base)}.control{--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--vvd-color-neutral-500)}.control.appearance-ghost{--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}
|
|
19
|
+
const styles = ".chevron{display:flex;flex-shrink:0;font:var(--vvd-typography-base-extended);transform:rotate(0);transition:transform .2s}:host([data-expanded=true]) .chevron,:host([open]) .chevron{transform:rotate(180deg)}:host(:focus-visible){outline:none}:host{display:inline-flex;flex-direction:column;gap:4px;--_low-ink-color: var(--vvd-color-neutral-600);--focus-stroke-gap-color: transparent}:host([disabled]){--_low-ink-color: var(--vvd-color-neutral-400);cursor:not-allowed}.label{color:var(--vvd-color-canvas-text);contain:inline-size;font:var(--vvd-typography-base)}.control{--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--vvd-color-neutral-500)}.control.appearance-ghost{--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}@media (hover: hover){.control: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)}.control: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}}.control.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)}.control.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}.control: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)}.control:disabled.appearance-ghost{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.control.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)}.control.disabled.appearance-ghost{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.control.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)}.control.readonly:where(:not(.disabled,:disabled)).appearance-ghost{--_appearance-color-text: var(--vvd-color-neutral-600);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.control.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)}.control.error:where(:not(.disabled,:disabled)).appearance-ghost{--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-alert-50);--_appearance-color-outline: transparent}.control.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)}.control.success:where(:not(.disabled,:disabled)).appearance-ghost{--_appearance-color-text: notSet;--_appearance-color-fill: var(--vvd-color-success-50);--_appearance-color-outline: transparent}.control{--_connotation-color-primary: var(--vvd-select-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-primary-text: var(--vvd-select-accent-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-select-accent-primary-increment, var(--vvd-color-neutral-800));--_connotation-color-intermediate: var(--vvd-select-accent-intermediate, var(--vvd-color-neutral-500));--_connotation-color-faint: var(--vvd-select-accent-faint, var(--vvd-color-neutral-50));--_connotation-color-soft: var(--vvd-select-accent-soft, var(--vvd-color-neutral-100));--_connotation-color-firm: var(--vvd-select-accent-firm, var(--vvd-color-canvas-text));--_connotation-color-fierce: var(--vvd-select-accent-fierce, var(--vvd-color-neutral-700))}.control{border-radius:var(--_select-control-border-radius);block-size:var(--_select-block-size);padding-inline:var(--_select-padding-inline)}.control{--_select-icon-size: calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))/2) ;--_select-block-size: calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))) ;--_select-padding-inline: calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))*.4) ;display:flex;align-items:center;justify-content:space-between;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);gap:8px;transition:box-shadow .2s,background-color .2s}.control.size-condensed{--_select-icon-size: calc(1px*(40 + 4*clamp(-1, var(--vvd-size-density, 0), 2))*.4) ;--_select-block-size: calc(1px*(32 + 4*clamp(-1, var(--vvd-size-density, 0), 2))) ;--_select-padding-inline: calc(1px*(24 + 4*clamp(-1, var(--vvd-size-density, 0), 2))/2) }.control.size-condensed:not(.shape-pill){--_select-control-border-radius: 4px}.control-wrapper{position:relative}.control:not(.disabled){cursor:pointer}.control.disabled{pointer-events:none}.control:not(.shape-pill){--_select-control-border-radius: 8px}.control.shape-pill{--_select-control-border-radius: 24px}:host(:focus-visible) .control{box-shadow:0 0 0 4px color-mix(in srgb,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))}.listbox{display:flex;max-height:var(--select-height, 408px);flex-direction:column;padding:4px;gap:2px;overflow-y:auto}:host([multiple]:focus-visible) .listbox{box-shadow:0 0 0 4px color-mix(in srgb,var(--vvd-color-cta-500),transparent 85%),inset 0 0 0 3px var(--focus-stroke-gap-color, currentColor);outline:1px solid var(--focus-stroke-color, var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset, 0px));border-radius:8px}.selected-value{display:flex;overflow:hidden;flex-grow:1;align-items:center;column-gap:12px;white-space:nowrap}.selected-value .text{overflow:hidden;max-inline-size:100%;text-overflow:ellipsis}.control.shows-placeholder .selected-value .text{color:var(--vvd-color-neutral-600)}.selected-value slot[name=icon]{flex:0 0 var(--_select-icon-size);font-size:var(--_select-icon-size);line-height:1}.control.has-meta .selected-value{padding-inline-end:8px}.feedback-wrapper{display:contents}::part(popup-base){inline-size:max-content;min-inline-size:var(--_select-fixed-width, 100%)}:host([multiple]) ::part(popup-base){position:static}";
|
|
25
20
|
|
|
26
21
|
var __defProp = Object.defineProperty;
|
|
27
22
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
@@ -888,4 +883,4 @@ const selectDefinition = defineVividComponent(
|
|
|
888
883
|
);
|
|
889
884
|
const registerSelect = createRegisterFunction(selectDefinition);
|
|
890
885
|
|
|
891
|
-
export { Select as
|
|
886
|
+
export { Select as VwcSelectElement, registerSelect, selectDefinition };
|
package/select/index.cjs
CHANGED
package/select/index.js
CHANGED
|
@@ -1,3 +1,2 @@
|
|
|
1
|
-
import { r
|
|
2
|
-
|
|
3
|
-
registerSelect();
|
|
1
|
+
import { r } from "../bundled/definition19.js";
|
|
2
|
+
r();
|