@vonage/vivid 5.18.0 → 5.19.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/accordion/definition.cjs +0 -1
- package/accordion/definition.js +0 -1
- package/accordion/index.cjs +2 -2
- package/accordion/index.js +3 -4
- package/accordion-item/definition.cjs +0 -1
- package/accordion-item/definition.js +0 -1
- package/accordion-item/index.cjs +1 -1
- package/accordion-item/index.js +0 -2
- package/action-group/index.cjs +4 -4
- package/action-group/index.js +7 -7
- package/alert/definition.cjs +0 -1
- package/alert/definition.js +0 -1
- package/alert/index.cjs +5 -5
- package/alert/index.js +20 -21
- package/audio-player/definition.cjs +0 -1
- package/audio-player/definition.js +0 -1
- package/audio-player/index.cjs +13 -13
- package/audio-player/index.js +76 -77
- package/avatar/definition.cjs +0 -1
- package/avatar/definition.js +0 -1
- package/avatar/index.cjs +8 -8
- package/avatar/index.js +20 -21
- package/badge/definition.cjs +0 -1
- package/badge/definition.js +0 -1
- package/badge/index.cjs +1 -1
- package/badge/index.js +0 -2
- package/banner/definition.cjs +0 -1
- package/banner/definition.js +0 -1
- package/banner/index.cjs +4 -4
- package/banner/index.js +17 -18
- package/breadcrumb/index.cjs +2 -2
- package/breadcrumb/index.js +3 -3
- package/breadcrumb-item/definition.cjs +0 -1
- package/breadcrumb-item/definition.js +0 -1
- package/breadcrumb-item/index.cjs +5 -5
- package/breadcrumb-item/index.js +7 -8
- package/bundled/affix.cjs +2 -2
- package/bundled/affix.js +1 -1
- package/bundled/anchored.cjs +1 -1
- package/bundled/anchored.js +1 -1
- package/bundled/aria-binding-directive.cjs +1 -0
- package/bundled/aria-binding-directive.js +29 -0
- package/bundled/base-color-picker.cjs +3 -3
- package/bundled/base-color-picker.js +1 -1
- package/bundled/base-progress.cjs +1 -1
- package/bundled/base-progress.js +2 -2
- package/bundled/breadcrumb-item.cjs +1 -1
- package/bundled/breadcrumb-item.js +3 -3
- package/bundled/button.cjs +1 -1
- package/bundled/button.js +3 -3
- package/bundled/calendar-event.cjs +1 -1
- package/bundled/calendar-event.js +4 -4
- package/bundled/calendar-picker.template.cjs +20 -20
- package/bundled/calendar-picker.template.js +10 -10
- package/bundled/char-count.cjs +2 -2
- package/bundled/char-count.js +3 -3
- package/bundled/children.cjs +1 -1
- package/bundled/children.js +6 -6
- package/bundled/decorate.js +1 -1
- package/bundled/definition.cjs +1 -1
- package/bundled/definition.js +2 -2
- package/bundled/definition10.cjs +3 -3
- package/bundled/definition10.js +19 -19
- package/bundled/definition11.cjs +2 -2
- package/bundled/definition11.js +7 -7
- package/bundled/definition12.cjs +7 -7
- package/bundled/definition12.js +16 -16
- package/bundled/definition13.cjs +3 -3
- package/bundled/definition13.js +6 -6
- package/bundled/definition14.cjs +2 -2
- package/bundled/definition14.js +3 -3
- package/bundled/definition15.cjs +6 -6
- package/bundled/definition15.js +14 -14
- package/bundled/definition16.cjs +3 -3
- package/bundled/definition16.js +19 -19
- package/bundled/definition17.cjs +7 -7
- package/bundled/definition17.js +14 -14
- package/bundled/definition18.cjs +7 -7
- package/bundled/definition18.js +20 -20
- package/bundled/definition19.cjs +2 -2
- package/bundled/definition19.js +3 -3
- package/bundled/definition2.cjs +3 -3
- package/bundled/definition2.js +11 -11
- package/bundled/definition20.cjs +8 -8
- package/bundled/definition20.js +16 -17
- package/bundled/definition21.cjs +5 -5
- package/bundled/definition21.js +26 -26
- package/bundled/definition22.cjs +3 -3
- package/bundled/definition22.js +8 -8
- package/bundled/definition23.cjs +4 -4
- package/bundled/definition23.js +9 -9
- package/bundled/definition24.cjs +5 -5
- package/bundled/definition24.js +15 -15
- package/bundled/definition3.cjs +1 -1
- package/bundled/definition3.js +33 -33
- package/bundled/definition4.cjs +4 -4
- package/bundled/definition4.js +11 -11
- package/bundled/definition5.cjs +5 -5
- package/bundled/definition5.js +10 -10
- package/bundled/definition6.cjs +7 -7
- package/bundled/definition6.js +30 -30
- package/bundled/definition7.cjs +2 -2
- package/bundled/definition7.js +6 -6
- package/bundled/definition8.cjs +4 -4
- package/bundled/definition8.js +15 -15
- package/bundled/definition9.cjs +2 -2
- package/bundled/definition9.js +18 -18
- package/bundled/delegates-aria.cjs +1 -1
- package/bundled/delegates-aria.js +10 -49
- package/bundled/divider.cjs +1 -1
- package/bundled/divider.js +3 -3
- package/bundled/form-associated.cjs +1 -1
- package/bundled/form-associated.js +6 -6
- package/bundled/form-element.cjs +1 -1
- package/bundled/form-element.js +8 -6
- package/bundled/host-semantics.cjs +1 -1
- package/bundled/host-semantics.js +10 -39
- package/bundled/linkable.cjs +2 -2
- package/bundled/linkable.js +1 -1
- package/bundled/listbox.cjs +1 -1
- package/bundled/listbox.js +12 -12
- package/bundled/localized.cjs +1 -1
- package/bundled/localized.js +6 -6
- package/bundled/mixins.cjs +6 -6
- package/bundled/mixins.js +9 -9
- package/bundled/normalize.cjs +1 -1
- package/bundled/normalize.js +2 -2
- package/bundled/picker-field.template.cjs +1 -1
- package/bundled/picker-field.template.js +24 -23
- package/bundled/ref.cjs +1 -1
- package/bundled/ref.js +1 -1
- package/bundled/repeat.cjs +1 -1
- package/bundled/repeat.js +54 -54
- package/bundled/slider.template.cjs +7 -7
- package/bundled/slider.template.js +13 -13
- package/bundled/slottable-request.cjs +1 -1
- package/bundled/slottable-request.js +1 -1
- package/bundled/slotted.cjs +1 -1
- package/bundled/slotted.js +1 -1
- package/bundled/text-field.cjs +1 -1
- package/bundled/text-field.js +1 -1
- package/bundled/time-selection-picker.template.cjs +4 -4
- package/bundled/time-selection-picker.template.js +23 -23
- package/bundled/vivid-element.cjs +1 -1
- package/bundled/vivid-element.js +21 -19
- package/bundled/when.cjs +1 -1
- package/bundled/when.js +1 -1
- package/bundled/with-contextual-help.cjs +1 -1
- package/bundled/with-contextual-help.js +1 -1
- package/bundled/with-error-text.cjs +1 -1
- package/bundled/with-error-text.js +1 -1
- package/bundled/with-success-text.cjs +1 -1
- package/bundled/with-success-text.js +1 -1
- package/button/definition.cjs +0 -1
- package/button/definition.js +0 -1
- package/button/index.cjs +1 -1
- package/button/index.js +0 -2
- package/calendar/index.cjs +8 -8
- package/calendar/index.js +10 -10
- package/calendar-event/index.cjs +6 -6
- package/calendar-event/index.js +8 -8
- package/card/definition.cjs +0 -1
- package/card/definition.js +0 -1
- package/card/index.cjs +14 -14
- package/card/index.js +33 -34
- package/checkbox/definition.cjs +0 -1
- package/checkbox/definition.js +0 -1
- package/checkbox/index.cjs +1 -1
- package/checkbox/index.js +0 -2
- package/color-picker/definition.cjs +0 -1
- package/color-picker/definition.js +0 -1
- package/color-picker/index.cjs +15 -15
- package/color-picker/index.js +42 -42
- package/combobox/definition.cjs +0 -1
- package/combobox/definition.js +0 -1
- package/combobox/index.cjs +4 -4
- package/combobox/index.js +20 -21
- package/contextual-help/definition.cjs +0 -1
- package/contextual-help/definition.js +0 -1
- package/contextual-help/index.cjs +1 -1
- package/contextual-help/index.js +0 -2
- package/country/definition.cjs +0 -1
- package/country/definition.js +0 -1
- package/country/index.cjs +1 -1
- package/country/index.js +0 -2
- package/country-group/definition.cjs +0 -1
- package/country-group/definition.js +0 -1
- package/country-group/index.cjs +4 -4
- package/country-group/index.js +29 -29
- package/custom-elements.json +2544 -2688
- package/data-grid/definition.cjs +0 -1
- package/data-grid/definition.js +0 -1
- package/data-grid/index.cjs +14 -14
- package/data-grid/index.js +103 -104
- package/date-picker/definition.cjs +0 -1
- package/date-picker/definition.js +0 -1
- package/date-picker/index.cjs +1 -1
- package/date-picker/index.js +2 -3
- package/date-range-picker/definition.cjs +0 -1
- package/date-range-picker/definition.js +0 -1
- package/date-range-picker/index.cjs +1 -1
- package/date-range-picker/index.js +6 -7
- package/date-time-picker/definition.cjs +0 -1
- package/date-time-picker/definition.js +0 -1
- package/date-time-picker/index.cjs +2 -2
- package/date-time-picker/index.js +8 -9
- package/dial-pad/definition.cjs +0 -1
- package/dial-pad/definition.js +0 -1
- package/dial-pad/index.cjs +8 -8
- package/dial-pad/index.js +16 -17
- package/dialog/definition.cjs +0 -1
- package/dialog/definition.js +0 -1
- package/dialog/index.cjs +13 -10
- package/dialog/index.js +35 -33
- package/divider/index.cjs +1 -1
- package/divider/index.js +0 -1
- package/elevation/index.cjs +1 -1
- package/elevation/index.js +0 -1
- package/empty-state/definition.cjs +0 -1
- package/empty-state/definition.js +0 -1
- package/empty-state/index.cjs +4 -4
- package/empty-state/index.js +9 -10
- package/fab/definition.cjs +0 -1
- package/fab/definition.js +0 -1
- package/fab/index.cjs +3 -3
- package/fab/index.js +9 -10
- package/file-picker/definition.cjs +0 -1
- package/file-picker/definition.js +0 -1
- package/file-picker/index.cjs +7 -7
- package/file-picker/index.js +22 -23
- package/flag/definition.cjs +0 -1
- package/flag/definition.js +0 -1
- package/flag/index.cjs +3 -3
- package/flag/index.js +11 -11
- package/header/index.cjs +5 -5
- package/header/index.js +11 -11
- package/icon/definition.cjs +0 -1
- package/icon/definition.js +0 -1
- package/icon/index.cjs +1 -1
- package/icon/index.js +0 -2
- package/index.cjs +0 -1
- package/index.js +0 -1
- package/layout/index.cjs +2 -2
- package/layout/index.js +3 -3
- package/lib/avatar/avatar.d.ts +1 -1
- package/lib/breadcrumb-item/breadcrumb-item.d.ts +1 -1
- package/lib/button/button.d.ts +1 -1
- package/lib/card/card.d.ts +1 -1
- package/lib/nav-item/nav-item.d.ts +1 -1
- package/lib/rich-text-editor/rte/utils/ui.d.ts +2 -1
- package/locales/de-DE.cjs +1 -1
- package/locales/en-GB.cjs +1 -1
- package/locales/en-US.cjs +1 -1
- package/locales/ja-JP.cjs +1 -1
- package/locales/zh-CN.cjs +1 -1
- package/menu/definition.cjs +0 -1
- package/menu/definition.js +0 -1
- package/menu/index.cjs +1 -1
- package/menu/index.js +0 -2
- package/menu-item/definition.cjs +0 -1
- package/menu-item/definition.js +0 -1
- package/menu-item/index.cjs +1 -1
- package/menu-item/index.js +0 -2
- package/nav/index.cjs +2 -2
- package/nav/index.js +2 -2
- package/nav-disclosure/definition.cjs +0 -1
- package/nav-disclosure/definition.js +0 -1
- package/nav-disclosure/index.cjs +4 -4
- package/nav-disclosure/index.js +15 -16
- package/nav-item/definition.cjs +0 -1
- package/nav-item/definition.js +0 -1
- package/nav-item/index.cjs +2 -2
- package/nav-item/index.js +10 -11
- package/note/definition.cjs +0 -1
- package/note/definition.js +0 -1
- package/note/index.cjs +2 -2
- package/note/index.js +7 -8
- package/number-field/definition.cjs +0 -1
- package/number-field/definition.js +0 -1
- package/number-field/index.cjs +5 -5
- package/number-field/index.js +16 -17
- package/option/definition.cjs +0 -1
- package/option/definition.js +0 -1
- package/option/index.cjs +1 -1
- package/option/index.js +0 -2
- package/package.json +22 -22
- package/pagination/definition.cjs +0 -1
- package/pagination/definition.js +0 -1
- package/pagination/index.cjs +4 -4
- package/pagination/index.js +11 -12
- package/popover/definition.cjs +0 -1
- package/popover/definition.js +0 -1
- package/popover/index.cjs +6 -6
- package/popover/index.js +28 -29
- package/popup/definition.cjs +0 -1
- package/popup/definition.js +0 -1
- package/popup/index.cjs +1 -1
- package/popup/index.js +0 -2
- package/progress/index.cjs +5 -5
- package/progress/index.js +10 -10
- package/progress-ring/index.cjs +1 -1
- package/progress-ring/index.js +0 -1
- package/radio/index.cjs +1 -1
- package/radio/index.js +0 -1
- package/radio-group/definition.cjs +0 -1
- package/radio-group/definition.js +0 -1
- package/radio-group/index.cjs +6 -6
- package/radio-group/index.js +21 -21
- package/range-slider/definition.cjs +0 -1
- package/range-slider/definition.js +0 -1
- package/range-slider/index.cjs +5 -5
- package/range-slider/index.js +58 -59
- package/rich-text-editor/definition.cjs +0 -1
- package/rich-text-editor/definition.js +0 -1
- package/rich-text-editor/index.cjs +9 -9
- package/rich-text-editor/index.js +2016 -1947
- package/rich-text-view/index.cjs +1 -1
- package/rich-text-view/index.js +2 -2
- package/searchable-select/definition.cjs +0 -1
- package/searchable-select/definition.js +0 -1
- package/searchable-select/index.cjs +23 -23
- package/searchable-select/index.js +109 -108
- package/select/definition.cjs +0 -1
- package/select/definition.js +0 -1
- package/select/index.cjs +1 -1
- package/select/index.js +0 -2
- package/selectable-box/definition.cjs +0 -1
- package/selectable-box/definition.js +0 -1
- package/selectable-box/index.cjs +9 -9
- package/selectable-box/index.js +19 -20
- package/shared/aria/aria-binding-directive.d.ts +21 -0
- package/shared/aria/aria-change-subscription.d.ts +1 -0
- package/shared/aria/delegates-aria.d.ts +1 -1
- package/shared/aria/host-semantics.d.ts +1 -1
- package/shared/patterns/linkable.d.ts +1 -1
- package/side-drawer/index.cjs +3 -3
- package/side-drawer/index.js +4 -4
- package/simple-color-picker/definition.cjs +0 -1
- package/simple-color-picker/definition.js +0 -1
- package/simple-color-picker/index.cjs +2 -2
- package/simple-color-picker/index.js +19 -20
- package/slider/definition.cjs +0 -1
- package/slider/definition.js +0 -1
- package/slider/index.cjs +1 -1
- package/slider/index.js +0 -2
- package/split-button/definition.cjs +0 -1
- package/split-button/definition.js +0 -1
- package/split-button/index.cjs +6 -6
- package/split-button/index.js +17 -18
- package/status/definition.cjs +0 -1
- package/status/definition.js +0 -1
- package/status/index.cjs +2 -2
- package/status/index.js +8 -9
- package/switch/definition.cjs +0 -1
- package/switch/definition.js +0 -1
- package/switch/index.cjs +5 -5
- package/switch/index.js +9 -10
- package/tab/definition.cjs +0 -1
- package/tab/definition.js +0 -1
- package/tab/index.cjs +1 -1
- package/tab/index.js +0 -2
- package/tab-panel/index.cjs +1 -1
- package/tab-panel/index.js +0 -1
- package/table/definition.cjs +0 -1
- package/table/definition.js +0 -1
- package/table/index.cjs +9 -9
- package/table/index.js +21 -22
- package/tabs/definition.cjs +0 -1
- package/tabs/definition.js +0 -1
- package/tabs/index.cjs +2 -2
- package/tabs/index.js +25 -26
- package/tag/definition.cjs +0 -1
- package/tag/definition.js +0 -1
- package/tag/index.cjs +11 -11
- package/tag/index.js +21 -22
- package/tag-group/index.cjs +4 -4
- package/tag-group/index.js +6 -6
- package/text-area/definition.cjs +0 -1
- package/text-area/definition.js +0 -1
- package/text-area/index.cjs +4 -4
- package/text-area/index.js +24 -25
- package/text-field/definition.cjs +0 -1
- package/text-field/definition.js +0 -1
- package/text-field/index.cjs +1 -1
- package/text-field/index.js +0 -2
- package/time-picker/definition.cjs +0 -1
- package/time-picker/definition.js +0 -1
- package/time-picker/index.cjs +1 -1
- package/time-picker/index.js +2 -3
- package/toggletip/definition.cjs +0 -1
- package/toggletip/definition.js +0 -1
- package/toggletip/index.cjs +1 -1
- package/toggletip/index.js +0 -2
- package/tooltip/definition.cjs +0 -1
- package/tooltip/definition.js +0 -1
- package/tooltip/index.cjs +1 -1
- package/tooltip/index.js +0 -2
- package/tree-item/definition.cjs +0 -1
- package/tree-item/definition.js +0 -1
- package/tree-item/index.cjs +1 -1
- package/tree-item/index.js +0 -2
- package/tree-view/definition.cjs +0 -1
- package/tree-view/definition.js +0 -1
- package/tree-view/index.cjs +2 -2
- package/tree-view/index.js +5 -5
- package/unbundled/aria-binding-directive.cjs +42 -0
- package/unbundled/aria-binding-directive.js +36 -0
- package/unbundled/calendar-picker.template.cjs +1 -1
- package/unbundled/calendar-picker.template.js +1 -1
- package/unbundled/char-count.cjs +2 -1
- package/unbundled/char-count.js +2 -1
- package/unbundled/decorate.cjs +1 -1
- package/unbundled/decorate.js +1 -1
- package/unbundled/definition.js +1 -1
- package/unbundled/definition10.cjs +5 -4
- package/unbundled/definition10.js +6 -5
- package/unbundled/definition11.cjs +14 -10
- package/unbundled/definition11.js +15 -11
- package/unbundled/definition12.cjs +2 -2
- package/unbundled/definition12.js +3 -3
- package/unbundled/definition13.cjs +7 -6
- package/unbundled/definition13.js +8 -7
- package/unbundled/definition14.cjs +67 -58
- package/unbundled/definition14.js +68 -59
- package/unbundled/definition15.js +1 -1
- package/unbundled/definition16.js +1 -1
- package/unbundled/definition17.cjs +10 -8
- package/unbundled/definition17.js +11 -9
- package/unbundled/definition18.js +1 -1
- package/unbundled/definition19.js +1 -1
- package/unbundled/definition2.cjs +4 -2
- package/unbundled/definition2.js +5 -3
- package/unbundled/definition20.js +1 -1
- package/unbundled/definition21.js +1 -1
- package/unbundled/definition22.js +1 -1
- package/unbundled/definition23.cjs +1 -1
- package/unbundled/definition23.js +2 -2
- package/unbundled/definition24.cjs +17 -13
- package/unbundled/definition24.js +18 -14
- package/unbundled/definition25.js +1 -1
- package/unbundled/definition26.cjs +17 -1
- package/unbundled/definition26.js +18 -2
- package/unbundled/definition27.cjs +15 -12
- package/unbundled/definition27.js +16 -13
- package/unbundled/definition28.cjs +9 -6
- package/unbundled/definition28.js +10 -7
- package/unbundled/definition29.js +1 -1
- package/unbundled/definition3.js +1 -1
- package/unbundled/definition30.cjs +4 -2
- package/unbundled/definition30.js +5 -3
- package/unbundled/definition31.js +1 -1
- package/unbundled/definition32.cjs +30 -23
- package/unbundled/definition32.js +31 -24
- package/unbundled/definition33.cjs +4 -2
- package/unbundled/definition33.js +5 -3
- package/unbundled/definition34.cjs +200 -48
- package/unbundled/definition34.js +201 -49
- package/unbundled/definition35.js +1 -1
- package/unbundled/definition36.js +1 -1
- package/unbundled/definition37.js +1 -1
- package/unbundled/definition38.cjs +2 -1
- package/unbundled/definition38.js +3 -2
- package/unbundled/definition39.js +1 -1
- package/unbundled/definition4.cjs +6 -0
- package/unbundled/definition4.js +7 -1
- package/unbundled/definition40.js +1 -1
- package/unbundled/definition41.cjs +17 -12
- package/unbundled/definition41.js +18 -13
- package/unbundled/definition42.js +1 -1
- package/unbundled/definition43.js +1 -1
- package/unbundled/definition44.cjs +4 -3
- package/unbundled/definition44.js +5 -4
- package/unbundled/definition45.js +1 -1
- package/unbundled/definition46.js +1 -1
- package/unbundled/definition47.cjs +5 -4
- package/unbundled/definition47.js +6 -5
- package/unbundled/definition48.cjs +1 -1
- package/unbundled/definition48.js +2 -2
- package/unbundled/definition49.js +1 -1
- package/unbundled/definition5.js +1 -1
- package/unbundled/definition50.js +1 -1
- package/unbundled/definition51.cjs +1 -1
- package/unbundled/definition51.js +2 -2
- package/unbundled/definition52.js +1 -1
- package/unbundled/definition53.cjs +16 -12
- package/unbundled/definition53.js +17 -13
- package/unbundled/definition54.js +1 -1
- package/unbundled/definition55.cjs +25 -23
- package/unbundled/definition55.js +26 -24
- package/unbundled/definition56.cjs +2 -1
- package/unbundled/definition56.js +3 -2
- package/unbundled/definition57.cjs +72 -61
- package/unbundled/definition57.js +73 -62
- package/unbundled/definition58.cjs +34 -26
- package/unbundled/definition58.js +34 -26
- package/unbundled/definition59.cjs +1 -1
- package/unbundled/definition59.js +2 -2
- package/unbundled/definition6.js +1 -1
- package/unbundled/definition60.js +1 -1
- package/unbundled/definition61.cjs +15 -10
- package/unbundled/definition61.js +16 -11
- package/unbundled/definition62.js +1 -1
- package/unbundled/definition63.js +1 -1
- package/unbundled/definition64.cjs +20 -17
- package/unbundled/definition64.js +21 -18
- package/unbundled/definition65.js +1 -1
- package/unbundled/definition66.js +1 -1
- package/unbundled/definition67.cjs +1 -1
- package/unbundled/definition67.js +2 -2
- package/unbundled/definition68.js +1 -1
- package/unbundled/definition69.js +1 -1
- package/unbundled/definition7.js +1 -1
- package/unbundled/definition70.cjs +28 -23
- package/unbundled/definition70.js +29 -24
- package/unbundled/definition71.js +1 -1
- package/unbundled/definition72.cjs +6 -5
- package/unbundled/definition72.js +7 -6
- package/unbundled/definition73.cjs +13 -1
- package/unbundled/definition73.js +14 -2
- package/unbundled/definition74.js +1 -1
- package/unbundled/definition75.js +1 -1
- package/unbundled/definition76.cjs +2 -1
- package/unbundled/definition76.js +3 -2
- package/unbundled/definition77.cjs +1 -1
- package/unbundled/definition77.js +1 -1
- package/unbundled/definition8.js +1 -1
- package/unbundled/definition9.cjs +9 -7
- package/unbundled/definition9.js +10 -8
- package/unbundled/delegates-aria.cjs +5 -60
- package/unbundled/delegates-aria.js +6 -60
- package/unbundled/divider.cjs +6 -0
- package/unbundled/divider.js +6 -0
- package/unbundled/form-element.cjs +7 -5
- package/unbundled/form-element.js +7 -5
- package/unbundled/host-semantics.cjs +10 -45
- package/unbundled/host-semantics.js +10 -44
- package/unbundled/mixins.js +1 -1
- package/unbundled/picker-field.template.cjs +20 -15
- package/unbundled/picker-field.template.js +20 -15
- package/unbundled/text-field.cjs +1 -1
- package/unbundled/text-field.js +1 -1
- package/unbundled/time-selection-picker.template.cjs +4 -3
- package/unbundled/time-selection-picker.template.js +5 -4
- package/unbundled/vivid-element.cjs +10 -1
- package/unbundled/vivid-element.js +5 -2
- package/video-player/index.cjs +24 -24
- package/video-player/index.js +3087 -3010
- package/visually-hidden/index.cjs +1 -1
- package/visually-hidden/index.js +0 -1
- package/vivid.api.json +1 -1
- package/bundled/attribute-binding-behaviour.cjs +0 -1
- package/bundled/attribute-binding-behaviour.js +0 -18
- package/bundled/strings.cjs +0 -1
- package/bundled/strings.js +0 -7
- package/shared/aria/delegate-aria-behavior.d.ts +0 -23
- package/shared/aria/host-semantics-behavior.d.ts +0 -19
- package/shared/templating/attribute-binding-behaviour.d.ts +0 -14
- package/unbundled/attribute-binding-behaviour.cjs +0 -37
- package/unbundled/attribute-binding-behaviour.js +0 -31
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { c as createRegisterFunction, s as defineVividComponent, t as VividElement } from "./vivid-element.js";
|
|
2
2
|
import { r as Icon, t as iconDefinition } from "./definition2.js";
|
|
3
3
|
import { t as __decorate } from "./decorate.js";
|
|
4
4
|
import { n as delegateAria, t as DelegatesAria } from "./delegates-aria.js";
|
|
@@ -100,6 +100,9 @@ var FilePicker = class extends WithContextualHelp(WithFeedback(WithErrorText(For
|
|
|
100
100
|
super.setFormValue(value, state);
|
|
101
101
|
};
|
|
102
102
|
this._customValidationError = null;
|
|
103
|
+
this.#customValidationChangeHandler = { handleChange: () => {
|
|
104
|
+
this._customValidationError = this.#customValidationChangeObserver.observe(this, ExecutionContext.default);
|
|
105
|
+
} };
|
|
103
106
|
this._dragHover = false;
|
|
104
107
|
this._allFiles = [];
|
|
105
108
|
}
|
|
@@ -146,9 +149,7 @@ var FilePicker = class extends WithContextualHelp(WithFeedback(WithErrorText(For
|
|
|
146
149
|
if (this.proxy) this.proxy.setCustomValidity(this._customValidationError ?? "");
|
|
147
150
|
this.validate();
|
|
148
151
|
}
|
|
149
|
-
#customValidationChangeHandler
|
|
150
|
-
this._customValidationError = this.#customValidationChangeObserver.observe(this, ExecutionContext.default);
|
|
151
|
-
} };
|
|
152
|
+
#customValidationChangeHandler;
|
|
152
153
|
#customValidationChangeObserver;
|
|
153
154
|
#startObservingCustomValidation() {
|
|
154
155
|
this.#customValidationChangeObserver = Observable.binding(() => this.#getCustomValidationError(), this.#customValidationChangeHandler, true);
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { c as createRegisterFunction, s as defineVividComponent, t as VividElement } from "./vivid-element.js";
|
|
2
2
|
import { t as __decorate } from "./decorate.js";
|
|
3
3
|
import { n as delegateAria, t as DelegatesAria } from "./delegates-aria.js";
|
|
4
4
|
import { r as Elevation, t as elevationDefinition } from "./definition8.js";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { c as createRegisterFunction, s as defineVividComponent, t as VividElement } from "./vivid-element.js";
|
|
2
2
|
import { t as __decorate } from "./decorate.js";
|
|
3
3
|
import { attr, html } from "@microsoft/fast-element";
|
|
4
4
|
import { classNames } from "@microsoft/fast-web-utilities";
|
|
@@ -31,6 +31,10 @@ var NavDisclosure = class extends require_affix.AffixIcon(require_delegates_aria
|
|
|
31
31
|
super(..._args);
|
|
32
32
|
this.open = false;
|
|
33
33
|
this.current = false;
|
|
34
|
+
this.#onToggle = () => {
|
|
35
|
+
this.open = this.details.open;
|
|
36
|
+
this.$emit("toggle", void 0, { bubbles: false });
|
|
37
|
+
};
|
|
34
38
|
}
|
|
35
39
|
/**
|
|
36
40
|
* @internal
|
|
@@ -47,10 +51,7 @@ var NavDisclosure = class extends require_affix.AffixIcon(require_delegates_aria
|
|
|
47
51
|
super.disconnectedCallback();
|
|
48
52
|
this.details.removeEventListener("toggle", this.#onToggle);
|
|
49
53
|
}
|
|
50
|
-
#onToggle
|
|
51
|
-
this.open = this.details.open;
|
|
52
|
-
this.$emit("toggle", void 0, { bubbles: false });
|
|
53
|
-
};
|
|
54
|
+
#onToggle;
|
|
54
55
|
};
|
|
55
56
|
require_decorate.__decorate([_microsoft_fast_element.attr], NavDisclosure.prototype, "label", void 0);
|
|
56
57
|
require_decorate.__decorate([_microsoft_fast_element.attr], NavDisclosure.prototype, "appearance", void 0);
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { c as createRegisterFunction, n as replaces, s as defineVividComponent, t as VividElement } from "./vivid-element.js";
|
|
2
2
|
import { r as Icon, t as iconDefinition } from "./definition2.js";
|
|
3
3
|
import { t as __decorate } from "./decorate.js";
|
|
4
4
|
import { a as affixIconTemplateFactory, i as IconWrapper, t as AffixIcon } from "./affix.js";
|
|
@@ -30,6 +30,10 @@ var NavDisclosure = class extends AffixIcon(DelegatesAria(VividElement)) {
|
|
|
30
30
|
super(..._args);
|
|
31
31
|
this.open = false;
|
|
32
32
|
this.current = false;
|
|
33
|
+
this.#onToggle = () => {
|
|
34
|
+
this.open = this.details.open;
|
|
35
|
+
this.$emit("toggle", void 0, { bubbles: false });
|
|
36
|
+
};
|
|
33
37
|
}
|
|
34
38
|
/**
|
|
35
39
|
* @internal
|
|
@@ -46,10 +50,7 @@ var NavDisclosure = class extends AffixIcon(DelegatesAria(VividElement)) {
|
|
|
46
50
|
super.disconnectedCallback();
|
|
47
51
|
this.details.removeEventListener("toggle", this.#onToggle);
|
|
48
52
|
}
|
|
49
|
-
#onToggle
|
|
50
|
-
this.open = this.details.open;
|
|
51
|
-
this.$emit("toggle", void 0, { bubbles: false });
|
|
52
|
-
};
|
|
53
|
+
#onToggle;
|
|
53
54
|
};
|
|
54
55
|
__decorate([attr], NavDisclosure.prototype, "label", void 0);
|
|
55
56
|
__decorate([attr], NavDisclosure.prototype, "appearance", void 0);
|
|
@@ -7,7 +7,7 @@ const require_linkable = require("./linkable.cjs");
|
|
|
7
7
|
let _microsoft_fast_element = require("@microsoft/fast-element");
|
|
8
8
|
let _microsoft_fast_web_utilities = require("@microsoft/fast-web-utilities");
|
|
9
9
|
//#region src/lib/nav-item/nav-item.scss?inline
|
|
10
|
-
var nav_item_default = ".control{box-sizing:border-box;background-color:var(--_appearance-color-fill);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);font:var(--vvd-typography-base);hyphens:auto;inline-size:100%;min-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)));vertical-align:middle;border-radius:8px;align-items:center;gap:12px;text-decoration:none;display:inline-flex}.control.current{color:var(--_appearance-color-text)}@supports not (color:color-mix(in srgb, var(--one-color), var(--second-color))){.control.current{background-color:var(--_connotation-color-primary)}}.control.current:focus-visible{outline:none;position:relative}.control.current:focus-visible:after{box-shadow:0 0 0 4px color-mix(in srgb, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px));border-radius:var(--focus-border-radius,inherit);block-size:calc(100% + var(--focus-block-size-addition,4px));content:\"\";inline-size:calc(100% + var(--focus-block-size-addition,4px));display:block;position:absolute;inset-block-start:50%;inset-inline-start:50%;transform:translate(-50%,-50%)}.control.connotation-cta{--_connotation-color-primary:var(--vvd-nav-item-cta-primary,var(--vvd-color-cta-500));--_connotation-color-primary-text:var(--vvd-nav-item-cta-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-nav-item-cta-primary-increment,var(--vvd-color-cta-600));--_connotation-color-contrast:var(--vvd-nav-item-cta-contrast,var(--vvd-color-cta-800));--_connotation-color-fierce:var(--vvd-nav-item-cta-fierce,var(--vvd-color-cta-700));--_connotation-color-fierce-primary:var(--vvd-nav-item-cta-fierce-primary,var(--vvd-color-cta-700));--_connotation-color-faint:var(--vvd-nav-item-cta-faint,var(--vvd-color-cta-50));--_connotation-color-firm:var(--vvd-nav-item-cta-firm,var(--vvd-color-cta-600));--_connotation-color-soft:var(--vvd-nav-item-cta-soft,var(--vvd-color-cta-100))}.control:not(.connotation-cta){--_connotation-color-primary:var(--vvd-nav-item-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-nav-item-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-nav-item-accent-primary-increment,var(--vvd-color-neutral-800));--_connotation-color-contrast:var(--vvd-nav-item-accent-contrast,var(--vvd-color-neutral-800));--_connotation-color-fierce:var(--vvd-nav-item-accent-fierce,var(--vvd-color-neutral-700));--_connotation-color-fierce-primary:var(--vvd-nav-item-accent-fierce-primary,var(--vvd-color-canvas-text));--_connotation-color-faint:var(--vvd-nav-item-accent-faint,var(--vvd-color-neutral-50));--_connotation-color-firm:var(--vvd-nav-item-accent-firm,var(--vvd-color-canvas-text));--_connotation-color-soft:var(--vvd-nav-item-accent-soft,var(--vvd-color-neutral-100))}.control,.control.appearance-ghost-light{--_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(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in srgb, var(--_connotation-color-primary), transparent 90%);--_appearance-color-outline:transparent}}.control.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in srgb, var(--_connotation-color-primary), transparent 90%);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in srgb, var(--_connotation-color-primary), transparent 80%);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in srgb, var(--_connotation-color-primary), transparent 80%);--_appearance-color-outline:transparent}.control.selected:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary);--_appearance-color-outline:transparent}.control.selected:where(:not(.disabled,:disabled)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:color-mix(in srgb, var(--_connotation-color-firm), transparent 10%);--_appearance-color-outline:transparent}@media (hover:hover){.control.selected:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary-increment);--_appearance-color-outline:transparent}.control.selected:hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:color-mix(in srgb, var(--_connotation-color-fierce-primary), transparent 20%);--_appearance-color-outline:transparent}}.control.selected.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary-increment);--_appearance-color-outline:transparent}.control.selected.hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:color-mix(in srgb, var(--_connotation-color-fierce-primary), transparent 20%);--_appearance-color-outline:transparent}.control.icon-only{block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)));inline-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)));place-content:center;display:flex}.control:not(.icon-only){padding-block:10px;padding-inline:16px}.control:not(.current){color:var(--vvd-color-canvas-text);--focus-stroke-gap-color:transparent}.control:not(.current):focus-visible{box-shadow:0 0 0 4px color-mix(in srgb, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px))}slot[name=icon]{font-size:20px;line-height:1}";
|
|
10
|
+
var nav_item_default = ".control{box-sizing:border-box;background-color:var(--_appearance-color-fill);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);font:var(--vvd-typography-base);hyphens:auto;inline-size:100%;min-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)));vertical-align:middle;border-radius:8px;align-items:center;gap:12px;text-decoration:none;display:inline-flex}.control.current{color:var(--_appearance-color-text)}@supports not (color:color-mix(in srgb, var(--one-color), var(--second-color))){.control.current{background-color:var(--_connotation-color-primary)}}.control.current:focus-visible{outline:none;position:relative}.control.current:focus-visible:after{box-shadow:0 0 0 4px color-mix(in srgb, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px));border-radius:var(--focus-border-radius,inherit);block-size:calc(100% + var(--focus-block-size-addition,4px));content:\"\";inline-size:calc(100% + var(--focus-block-size-addition,4px));display:block;position:absolute;inset-block-start:50%;inset-inline-start:50%;transform:translate(-50%,-50%)}.control.connotation-cta{--_connotation-color-primary:var(--vvd-nav-item-cta-primary,var(--vvd-color-cta-500));--_connotation-color-primary-text:var(--vvd-nav-item-cta-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-nav-item-cta-primary-increment,var(--vvd-color-cta-600));--_connotation-color-contrast:var(--vvd-nav-item-cta-contrast,var(--vvd-color-cta-800));--_connotation-color-fierce:var(--vvd-nav-item-cta-fierce,var(--vvd-color-cta-700));--_connotation-color-fierce-primary:var(--vvd-nav-item-cta-fierce-primary,var(--vvd-color-cta-700));--_connotation-color-faint:var(--vvd-nav-item-cta-faint,var(--vvd-color-cta-50));--_connotation-color-firm:var(--vvd-nav-item-cta-firm,var(--vvd-color-cta-600));--_connotation-color-soft:var(--vvd-nav-item-cta-soft,var(--vvd-color-cta-100))}.control:not(.connotation-cta){--_connotation-color-primary:var(--vvd-nav-item-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-nav-item-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-nav-item-accent-primary-increment,var(--vvd-color-neutral-800));--_connotation-color-contrast:var(--vvd-nav-item-accent-contrast,var(--vvd-color-neutral-800));--_connotation-color-fierce:var(--vvd-nav-item-accent-fierce,var(--vvd-color-neutral-700));--_connotation-color-fierce-primary:var(--vvd-nav-item-accent-fierce-primary,var(--vvd-color-canvas-text));--_connotation-color-faint:var(--vvd-nav-item-accent-faint,var(--vvd-color-neutral-50));--_connotation-color-firm:var(--vvd-nav-item-accent-firm,var(--vvd-color-canvas-text));--_connotation-color-soft:var(--vvd-nav-item-accent-soft,var(--vvd-color-neutral-100))}.control,.control.appearance-ghost-light{--_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(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in srgb, var(--_connotation-color-primary), transparent 90%);--_appearance-color-outline:transparent}}.control.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in srgb, var(--_connotation-color-primary), transparent 90%);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in srgb, var(--_connotation-color-primary), transparent 80%);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in srgb, var(--_connotation-color-primary), transparent 80%);--_appearance-color-outline:transparent}.control.selected:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary);--_appearance-color-outline:transparent}.control.selected:where(:not(.disabled,:disabled)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:color-mix(in srgb, var(--_connotation-color-firm), transparent 10%);--_appearance-color-outline:transparent}@media (hover:hover){.control.selected:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary-increment);--_appearance-color-outline:transparent}.control.selected:hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:color-mix(in srgb, var(--_connotation-color-fierce-primary), transparent 20%);--_appearance-color-outline:transparent}}.control.selected.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary-increment);--_appearance-color-outline:transparent}.control.selected.hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:color-mix(in srgb, var(--_connotation-color-fierce-primary), transparent 20%);--_appearance-color-outline:transparent}.control.icon-only{block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)));inline-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)));place-content:center;display:flex;position:relative}.control.icon-only slot[name=meta]{display:block;position:absolute;inset-block-start:calc((calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2))) - 20px) / 2);inset-inline-end:calc((calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2))) - 20px) / 2);transform:translate(50%,-50%)}.control:not(.icon-only){padding-block:10px;padding-inline:16px}.control:not(.current){color:var(--vvd-color-canvas-text);--focus-stroke-gap-color:transparent}.control:not(.current):focus-visible{box-shadow:0 0 0 4px color-mix(in srgb, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px))}:host(:dir(rtl)) .icon-only slot[name=meta]{transform:translate(-50%,-50%)}slot[name=icon]{font-size:20px;line-height:1}";
|
|
11
11
|
//#endregion
|
|
12
12
|
//#region src/lib/nav-item/nav-item.ts
|
|
13
13
|
/**
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { c as createRegisterFunction, n as replaces, s as defineVividComponent, t as VividElement } from "./vivid-element.js";
|
|
2
2
|
import { t as iconDefinition } from "./definition2.js";
|
|
3
3
|
import { t as __decorate } from "./decorate.js";
|
|
4
4
|
import { a as affixIconTemplateFactory, i as IconWrapper, t as AffixIcon } from "./affix.js";
|
|
@@ -6,7 +6,7 @@ import { t as Linkable } from "./linkable.js";
|
|
|
6
6
|
import { attr, html } from "@microsoft/fast-element";
|
|
7
7
|
import { classNames } from "@microsoft/fast-web-utilities";
|
|
8
8
|
//#region src/lib/nav-item/nav-item.scss?inline
|
|
9
|
-
var nav_item_default = ".control{box-sizing:border-box;background-color:var(--_appearance-color-fill);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);font:var(--vvd-typography-base);hyphens:auto;inline-size:100%;min-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)));vertical-align:middle;border-radius:8px;align-items:center;gap:12px;text-decoration:none;display:inline-flex}.control.current{color:var(--_appearance-color-text)}@supports not (color:color-mix(in srgb, var(--one-color), var(--second-color))){.control.current{background-color:var(--_connotation-color-primary)}}.control.current:focus-visible{outline:none;position:relative}.control.current:focus-visible:after{box-shadow:0 0 0 4px color-mix(in srgb, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px));border-radius:var(--focus-border-radius,inherit);block-size:calc(100% + var(--focus-block-size-addition,4px));content:\"\";inline-size:calc(100% + var(--focus-block-size-addition,4px));display:block;position:absolute;inset-block-start:50%;inset-inline-start:50%;transform:translate(-50%,-50%)}.control.connotation-cta{--_connotation-color-primary:var(--vvd-nav-item-cta-primary,var(--vvd-color-cta-500));--_connotation-color-primary-text:var(--vvd-nav-item-cta-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-nav-item-cta-primary-increment,var(--vvd-color-cta-600));--_connotation-color-contrast:var(--vvd-nav-item-cta-contrast,var(--vvd-color-cta-800));--_connotation-color-fierce:var(--vvd-nav-item-cta-fierce,var(--vvd-color-cta-700));--_connotation-color-fierce-primary:var(--vvd-nav-item-cta-fierce-primary,var(--vvd-color-cta-700));--_connotation-color-faint:var(--vvd-nav-item-cta-faint,var(--vvd-color-cta-50));--_connotation-color-firm:var(--vvd-nav-item-cta-firm,var(--vvd-color-cta-600));--_connotation-color-soft:var(--vvd-nav-item-cta-soft,var(--vvd-color-cta-100))}.control:not(.connotation-cta){--_connotation-color-primary:var(--vvd-nav-item-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-nav-item-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-nav-item-accent-primary-increment,var(--vvd-color-neutral-800));--_connotation-color-contrast:var(--vvd-nav-item-accent-contrast,var(--vvd-color-neutral-800));--_connotation-color-fierce:var(--vvd-nav-item-accent-fierce,var(--vvd-color-neutral-700));--_connotation-color-fierce-primary:var(--vvd-nav-item-accent-fierce-primary,var(--vvd-color-canvas-text));--_connotation-color-faint:var(--vvd-nav-item-accent-faint,var(--vvd-color-neutral-50));--_connotation-color-firm:var(--vvd-nav-item-accent-firm,var(--vvd-color-canvas-text));--_connotation-color-soft:var(--vvd-nav-item-accent-soft,var(--vvd-color-neutral-100))}.control,.control.appearance-ghost-light{--_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(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in srgb, var(--_connotation-color-primary), transparent 90%);--_appearance-color-outline:transparent}}.control.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in srgb, var(--_connotation-color-primary), transparent 90%);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in srgb, var(--_connotation-color-primary), transparent 80%);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in srgb, var(--_connotation-color-primary), transparent 80%);--_appearance-color-outline:transparent}.control.selected:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary);--_appearance-color-outline:transparent}.control.selected:where(:not(.disabled,:disabled)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:color-mix(in srgb, var(--_connotation-color-firm), transparent 10%);--_appearance-color-outline:transparent}@media (hover:hover){.control.selected:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary-increment);--_appearance-color-outline:transparent}.control.selected:hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:color-mix(in srgb, var(--_connotation-color-fierce-primary), transparent 20%);--_appearance-color-outline:transparent}}.control.selected.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary-increment);--_appearance-color-outline:transparent}.control.selected.hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:color-mix(in srgb, var(--_connotation-color-fierce-primary), transparent 20%);--_appearance-color-outline:transparent}.control.icon-only{block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)));inline-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)));place-content:center;display:flex}.control:not(.icon-only){padding-block:10px;padding-inline:16px}.control:not(.current){color:var(--vvd-color-canvas-text);--focus-stroke-gap-color:transparent}.control:not(.current):focus-visible{box-shadow:0 0 0 4px color-mix(in srgb, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px))}slot[name=icon]{font-size:20px;line-height:1}";
|
|
9
|
+
var nav_item_default = ".control{box-sizing:border-box;background-color:var(--_appearance-color-fill);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);font:var(--vvd-typography-base);hyphens:auto;inline-size:100%;min-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)));vertical-align:middle;border-radius:8px;align-items:center;gap:12px;text-decoration:none;display:inline-flex}.control.current{color:var(--_appearance-color-text)}@supports not (color:color-mix(in srgb, var(--one-color), var(--second-color))){.control.current{background-color:var(--_connotation-color-primary)}}.control.current:focus-visible{outline:none;position:relative}.control.current:focus-visible:after{box-shadow:0 0 0 4px color-mix(in srgb, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px));border-radius:var(--focus-border-radius,inherit);block-size:calc(100% + var(--focus-block-size-addition,4px));content:\"\";inline-size:calc(100% + var(--focus-block-size-addition,4px));display:block;position:absolute;inset-block-start:50%;inset-inline-start:50%;transform:translate(-50%,-50%)}.control.connotation-cta{--_connotation-color-primary:var(--vvd-nav-item-cta-primary,var(--vvd-color-cta-500));--_connotation-color-primary-text:var(--vvd-nav-item-cta-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-nav-item-cta-primary-increment,var(--vvd-color-cta-600));--_connotation-color-contrast:var(--vvd-nav-item-cta-contrast,var(--vvd-color-cta-800));--_connotation-color-fierce:var(--vvd-nav-item-cta-fierce,var(--vvd-color-cta-700));--_connotation-color-fierce-primary:var(--vvd-nav-item-cta-fierce-primary,var(--vvd-color-cta-700));--_connotation-color-faint:var(--vvd-nav-item-cta-faint,var(--vvd-color-cta-50));--_connotation-color-firm:var(--vvd-nav-item-cta-firm,var(--vvd-color-cta-600));--_connotation-color-soft:var(--vvd-nav-item-cta-soft,var(--vvd-color-cta-100))}.control:not(.connotation-cta){--_connotation-color-primary:var(--vvd-nav-item-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-nav-item-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-nav-item-accent-primary-increment,var(--vvd-color-neutral-800));--_connotation-color-contrast:var(--vvd-nav-item-accent-contrast,var(--vvd-color-neutral-800));--_connotation-color-fierce:var(--vvd-nav-item-accent-fierce,var(--vvd-color-neutral-700));--_connotation-color-fierce-primary:var(--vvd-nav-item-accent-fierce-primary,var(--vvd-color-canvas-text));--_connotation-color-faint:var(--vvd-nav-item-accent-faint,var(--vvd-color-neutral-50));--_connotation-color-firm:var(--vvd-nav-item-accent-firm,var(--vvd-color-canvas-text));--_connotation-color-soft:var(--vvd-nav-item-accent-soft,var(--vvd-color-neutral-100))}.control,.control.appearance-ghost-light{--_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(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}.control:hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in srgb, var(--_connotation-color-primary), transparent 90%);--_appearance-color-outline:transparent}}.control.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}.control.hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in srgb, var(--_connotation-color-primary), transparent 90%);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in srgb, var(--_connotation-color-primary), transparent 80%);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.control.active:where(:not(.disabled,:disabled)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-fierce-primary);--_appearance-color-fill:color-mix(in srgb, var(--_connotation-color-primary), transparent 80%);--_appearance-color-outline:transparent}.control.selected:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary);--_appearance-color-outline:transparent}.control.selected:where(:not(.disabled,:disabled)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:color-mix(in srgb, var(--_connotation-color-firm), transparent 10%);--_appearance-color-outline:transparent}@media (hover:hover){.control.selected:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary-increment);--_appearance-color-outline:transparent}.control.selected:hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:color-mix(in srgb, var(--_connotation-color-fierce-primary), transparent 20%);--_appearance-color-outline:transparent}}.control.selected.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary-increment);--_appearance-color-outline:transparent}.control.selected.hover:where(:not(.disabled,:disabled,.readonly)).appearance-ghost-light{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:color-mix(in srgb, var(--_connotation-color-fierce-primary), transparent 20%);--_appearance-color-outline:transparent}.control.icon-only{block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)));inline-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)));place-content:center;display:flex;position:relative}.control.icon-only slot[name=meta]{display:block;position:absolute;inset-block-start:calc((calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2))) - 20px) / 2);inset-inline-end:calc((calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2))) - 20px) / 2);transform:translate(50%,-50%)}.control:not(.icon-only){padding-block:10px;padding-inline:16px}.control:not(.current){color:var(--vvd-color-canvas-text);--focus-stroke-gap-color:transparent}.control:not(.current):focus-visible{box-shadow:0 0 0 4px color-mix(in srgb, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px))}:host(:dir(rtl)) .icon-only slot[name=meta]{transform:translate(-50%,-50%)}slot[name=icon]{font-size:20px;line-height:1}";
|
|
10
10
|
//#endregion
|
|
11
11
|
//#region src/lib/nav-item/nav-item.ts
|
|
12
12
|
/**
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { c as createRegisterFunction, s as defineVividComponent, t as VividElement } from "./vivid-element.js";
|
|
2
2
|
import { n as delegateAria, t as DelegatesAria } from "./delegates-aria.js";
|
|
3
3
|
import { html } from "@microsoft/fast-element";
|
|
4
4
|
//#region src/lib/nav/nav.scss?inline
|
package/unbundled/definition5.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { c as createRegisterFunction, s as defineVividComponent, t as VividElement } from "./vivid-element.js";
|
|
2
2
|
import { t as __decorate } from "./decorate.js";
|
|
3
3
|
import { n as delegateAria, t as DelegatesAria } from "./delegates-aria.js";
|
|
4
4
|
import { attr, html } from "@microsoft/fast-element";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { c as createRegisterFunction, s as defineVividComponent, t as VividElement } from "./vivid-element.js";
|
|
2
2
|
import { t as iconDefinition } from "./definition2.js";
|
|
3
3
|
import { t as __decorate } from "./decorate.js";
|
|
4
4
|
import { a as affixIconTemplateFactory, i as IconWrapper, t as AffixIcon } from "./affix.js";
|
|
@@ -20,7 +20,7 @@ const require_definition$4 = require("./definition36.cjs");
|
|
|
20
20
|
let _microsoft_fast_element = require("@microsoft/fast-element");
|
|
21
21
|
let _microsoft_fast_web_utilities = require("@microsoft/fast-web-utilities");
|
|
22
22
|
//#region src/lib/number-field/number-field.scss?inline
|
|
23
|
-
var number_field_default = ".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-
|
|
23
|
+
var number_field_default = ".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-color-primary:var(--vvd-text-field-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-text-field-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-text-field-accent-primary-increment,var(--vvd-color-neutral-800));--_connotation-color-intermediate:var(--vvd-text-field-accent-intermediate,var(--vvd-color-neutral-500));--_connotation-color-firm:var(--vvd-text-field-accent-firm,var(--vvd-color-canvas-text));--_connotation-color-fierce:var(--vvd-text-field-accent-fierce,var(--vvd-color-neutral-700));--_connotation-color-faint:var(--vvd-text-field-accent-faint,var(--vvd-color-neutral-50));--_connotation-color-soft:var(--vvd-text-field-accent-soft,var(--vvd-color-neutral-100));--_text-field-gutter-start:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2))) / 2.5);--_text-field-gutter-end:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2))) / 2.5);--_text-field-icon-size:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2))) / 2);--_text-field-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)));--_text-field-border-radius:8px;--_text-field-pill-border-radius:24px;grid-template-columns:min-content 1fr max-content;align-items:center;gap:4px;width:100%;display:inline-grid}.base.size-condensed{--_text-field-gutter-start:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16)) / 2);--_text-field-gutter-end:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16)) / 2);--_text-field-icon-size:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8)) / 2);--_text-field-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8));--_text-field-border-radius:4px}@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)}.label:not(slot),.label::slotted(label){font:var(--vvd-typography-base);grid-area:1/1/auto/4;box-sizing:initial!important;padding:initial!important;margin:initial!important;color:var(--vvd-color-canvas-text)!important}.char-count+.label:not(slot),.char-count+.label::slotted(label){grid-column:1/3}.char-count{color:var(--_low-ink-color);font:var(--vvd-typography-base)}.label-wrapper{grid-area:1/1/auto/4}.char-count+.label-wrapper{grid-column:1/3}.fieldset{background-color:var(--_appearance-color-fill);font:var(--vvd-typography-base);grid-column:1/4;align-items:center;padding-block:0;transition:color .2s,background-color .2s;display:flex;position:relative}.fieldset:after{border-radius:inherit;block-size:100%;box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);content:\"\";pointer-events:none;inline-size:100%;transition:box-shadow .2s;display:block;position:absolute}.fieldset:focus-visible{outline:none}.base>.fieldset{block-size:var(--_text-field-block-size)}.base:not(.shape-pill) .fieldset{border-radius:var(--_text-field-border-radius)}.base.shape-pill .fieldset{border-radius:var(--_text-field-pill-border-radius)}.wrapper{border-radius:inherit;block-size:100%;inline-size:100%}.control{border-radius:inherit;text-align:start}.control:not(slot),.control::slotted(input){font:inherit;text-align:inherit;outline:#0000;box-sizing:border-box!important;border-radius:inherit!important;width:100%!important;margin:initial!important;appearance:none!important;block-size:100%!important;color:inherit!important;padding-block:0!important;padding-inline:var(--_text-field-gutter-start) var(--_text-field-gutter-end)!important;background-color:#0000!important;border:0!important}.control:not(slot):disabled,.control::slotted(input:disabled){cursor:not-allowed!important;opacity:1!important;-webkit-text-fill-color:var(--_appearance-color-text)!important}.control:not(slot)::placeholder{opacity:1!important;-webkit-text-fill-color:var(--_low-ink-color)!important}.control::slotted(input:-webkit-autofill){-webkit-box-shadow:0 0 0 1000px var(--_appearance-color-fill) inset;-webkit-text-fill-color:var(--_appearance-color-text)!important}.control:not(slot):-webkit-autofill{-webkit-box-shadow:0 0 0 1000px var(--_appearance-color-fill) inset;-webkit-text-fill-color:var(--_appearance-color-text)!important}.has-icon .control:not(slot),.has-icon .control::slotted(input){padding-inline-start:calc(var(--_text-field-icon-size) + var(--_text-field-gutter-start) * 2)!important}.icon{z-index:1;color:var(--_low-ink-color);font-size:var(--_text-field-icon-size);line-height:1;position:absolute;inset-block-start:50%;inset-inline-start:calc(100% + var(--_text-field-gutter-start));transform:translateY(-50%)}.leading-items-wrapper{position:relative}.base.no-leading .leading-items-wrapper{display:none}.action-items-wrapper{margin-inline-end:4px}.base:not(.action-items) .action-items-wrapper{display:none}@supports selector(:has(*)){.base:not(.has-activedescendant) .fieldset:has(.wrapper .control:focus-within):after{--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 not selector(:has(*)){.base:not(.has-activedescendant) .wrapper:focus-within:after{box-shadow:0 0 0 4px color-mix(in srgb, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px));--focus-stroke-gap-color:transparent;z-index:1;border-radius:inherit;content:\"\";pointer-events:none;display:block;position:absolute;inset:0}}:host([internal-part]) .fieldset{font:var(--vvd-typography-heading-4);background-color:#0000;line-height:1.1}:host([internal-part]) .fieldset:not(:focus-within):after{block-size:1px;inset-block-end:0}@supports selector(:has(*)){:host([internal-part]) .fieldset:has(.action-items-wrapper:focus-within):after{block-size:1px;inset-block-end:0}}:host([internal-part]) .control{text-align:center}slot[name=_mirrored-helper-text]{display:none}.base{--_text-field-gutter-end:70px}.control::-webkit-outer-spin-button{appearance:none}.control::-webkit-inner-spin-button{appearance:none}.control-buttons{z-index:1;display:flex;position:absolute;right:3px}.readonly .control-buttons,.disabled .control-buttons{pointer-events:none}.control-buttons .divider{margin-block:8px}.control-buttons>*{flex-shrink:0}";
|
|
24
24
|
//#endregion
|
|
25
25
|
//#region src/lib/number-field/number-field.ts
|
|
26
26
|
var STEP_DIRECTION = {
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { c as createRegisterFunction, s as defineVividComponent, t as VividElement } from "./vivid-element.js";
|
|
2
2
|
import { n as visuallyHiddenDefinition, r as VisuallyHidden } from "./definition.js";
|
|
3
3
|
import { t as iconDefinition } from "./definition2.js";
|
|
4
4
|
import { t as __decorate } from "./decorate.js";
|
|
@@ -19,7 +19,7 @@ import { t as dividerDefinition } from "./definition36.js";
|
|
|
19
19
|
import { Updates, attr, html, nullableNumberConverter, observable, ref, slotted, when } from "@microsoft/fast-element";
|
|
20
20
|
import { classNames, keyArrowDown, keyArrowUp } from "@microsoft/fast-web-utilities";
|
|
21
21
|
//#region src/lib/number-field/number-field.scss?inline
|
|
22
|
-
var number_field_default = ".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-
|
|
22
|
+
var number_field_default = ".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-color-primary:var(--vvd-text-field-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-text-field-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-text-field-accent-primary-increment,var(--vvd-color-neutral-800));--_connotation-color-intermediate:var(--vvd-text-field-accent-intermediate,var(--vvd-color-neutral-500));--_connotation-color-firm:var(--vvd-text-field-accent-firm,var(--vvd-color-canvas-text));--_connotation-color-fierce:var(--vvd-text-field-accent-fierce,var(--vvd-color-neutral-700));--_connotation-color-faint:var(--vvd-text-field-accent-faint,var(--vvd-color-neutral-50));--_connotation-color-soft:var(--vvd-text-field-accent-soft,var(--vvd-color-neutral-100));--_text-field-gutter-start:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2))) / 2.5);--_text-field-gutter-end:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2))) / 2.5);--_text-field-icon-size:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2))) / 2);--_text-field-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)));--_text-field-border-radius:8px;--_text-field-pill-border-radius:24px;grid-template-columns:min-content 1fr max-content;align-items:center;gap:4px;width:100%;display:inline-grid}.base.size-condensed{--_text-field-gutter-start:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16)) / 2);--_text-field-gutter-end:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16)) / 2);--_text-field-icon-size:calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8)) / 2);--_text-field-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8));--_text-field-border-radius:4px}@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)}.label:not(slot),.label::slotted(label){font:var(--vvd-typography-base);grid-area:1/1/auto/4;box-sizing:initial!important;padding:initial!important;margin:initial!important;color:var(--vvd-color-canvas-text)!important}.char-count+.label:not(slot),.char-count+.label::slotted(label){grid-column:1/3}.char-count{color:var(--_low-ink-color);font:var(--vvd-typography-base)}.label-wrapper{grid-area:1/1/auto/4}.char-count+.label-wrapper{grid-column:1/3}.fieldset{background-color:var(--_appearance-color-fill);font:var(--vvd-typography-base);grid-column:1/4;align-items:center;padding-block:0;transition:color .2s,background-color .2s;display:flex;position:relative}.fieldset:after{border-radius:inherit;block-size:100%;box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);content:\"\";pointer-events:none;inline-size:100%;transition:box-shadow .2s;display:block;position:absolute}.fieldset:focus-visible{outline:none}.base>.fieldset{block-size:var(--_text-field-block-size)}.base:not(.shape-pill) .fieldset{border-radius:var(--_text-field-border-radius)}.base.shape-pill .fieldset{border-radius:var(--_text-field-pill-border-radius)}.wrapper{border-radius:inherit;block-size:100%;inline-size:100%}.control{border-radius:inherit;text-align:start}.control:not(slot),.control::slotted(input){font:inherit;text-align:inherit;outline:#0000;box-sizing:border-box!important;border-radius:inherit!important;width:100%!important;margin:initial!important;appearance:none!important;block-size:100%!important;color:inherit!important;padding-block:0!important;padding-inline:var(--_text-field-gutter-start) var(--_text-field-gutter-end)!important;background-color:#0000!important;border:0!important}.control:not(slot):disabled,.control::slotted(input:disabled){cursor:not-allowed!important;opacity:1!important;-webkit-text-fill-color:var(--_appearance-color-text)!important}.control:not(slot)::placeholder{opacity:1!important;-webkit-text-fill-color:var(--_low-ink-color)!important}.control::slotted(input:-webkit-autofill){-webkit-box-shadow:0 0 0 1000px var(--_appearance-color-fill) inset;-webkit-text-fill-color:var(--_appearance-color-text)!important}.control:not(slot):-webkit-autofill{-webkit-box-shadow:0 0 0 1000px var(--_appearance-color-fill) inset;-webkit-text-fill-color:var(--_appearance-color-text)!important}.has-icon .control:not(slot),.has-icon .control::slotted(input){padding-inline-start:calc(var(--_text-field-icon-size) + var(--_text-field-gutter-start) * 2)!important}.icon{z-index:1;color:var(--_low-ink-color);font-size:var(--_text-field-icon-size);line-height:1;position:absolute;inset-block-start:50%;inset-inline-start:calc(100% + var(--_text-field-gutter-start));transform:translateY(-50%)}.leading-items-wrapper{position:relative}.base.no-leading .leading-items-wrapper{display:none}.action-items-wrapper{margin-inline-end:4px}.base:not(.action-items) .action-items-wrapper{display:none}@supports selector(:has(*)){.base:not(.has-activedescendant) .fieldset:has(.wrapper .control:focus-within):after{--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 not selector(:has(*)){.base:not(.has-activedescendant) .wrapper:focus-within:after{box-shadow:0 0 0 4px color-mix(in srgb, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px));--focus-stroke-gap-color:transparent;z-index:1;border-radius:inherit;content:\"\";pointer-events:none;display:block;position:absolute;inset:0}}:host([internal-part]) .fieldset{font:var(--vvd-typography-heading-4);background-color:#0000;line-height:1.1}:host([internal-part]) .fieldset:not(:focus-within):after{block-size:1px;inset-block-end:0}@supports selector(:has(*)){:host([internal-part]) .fieldset:has(.action-items-wrapper:focus-within):after{block-size:1px;inset-block-end:0}}:host([internal-part]) .control{text-align:center}slot[name=_mirrored-helper-text]{display:none}.base{--_text-field-gutter-end:70px}.control::-webkit-outer-spin-button{appearance:none}.control::-webkit-inner-spin-button{appearance:none}.control-buttons{z-index:1;display:flex;position:absolute;right:3px}.readonly .control-buttons,.disabled .control-buttons{pointer-events:none}.control-buttons .divider{margin-block:8px}.control-buttons>*{flex-shrink:0}";
|
|
23
23
|
//#endregion
|
|
24
24
|
//#region src/lib/number-field/number-field.ts
|
|
25
25
|
var STEP_DIRECTION = {
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { c as createRegisterFunction, s as defineVividComponent, t as VividElement } from "./vivid-element.js";
|
|
2
2
|
import { t as __decorate } from "./decorate.js";
|
|
3
3
|
import { t as Localized } from "./localized.js";
|
|
4
4
|
import { i as Button, t as buttonDefinition } from "./definition7.js";
|
|
@@ -33,6 +33,18 @@ var Popover = class extends require_localized.Localized(require_delegates_aria.D
|
|
|
33
33
|
this.dismissButtonAriaLabel = null;
|
|
34
34
|
this.arrow = false;
|
|
35
35
|
this.open = false;
|
|
36
|
+
this.#currentAnchor = null;
|
|
37
|
+
this.#manualToggle = () => {
|
|
38
|
+
this._popoverEl.togglePopover();
|
|
39
|
+
};
|
|
40
|
+
this.#autoUpdateCallback = () => {
|
|
41
|
+
this.#lastPositionUpdate = this.updatePosition();
|
|
42
|
+
};
|
|
43
|
+
this.#handleNativeToggle = (e) => {
|
|
44
|
+
const isOpen = e.newState ? e.newState === "open" : this._popoverEl.matches(":popover-open");
|
|
45
|
+
if (this.open !== isOpen) this.open = isOpen;
|
|
46
|
+
this.$emit(isOpen ? "open" : "close", void 0, { bubbles: false });
|
|
47
|
+
};
|
|
36
48
|
}
|
|
37
49
|
/**
|
|
38
50
|
* @internal
|
|
@@ -71,7 +83,7 @@ var Popover = class extends require_localized.Localized(require_delegates_aria.D
|
|
|
71
83
|
/**
|
|
72
84
|
* @internal
|
|
73
85
|
*/
|
|
74
|
-
#currentAnchor
|
|
86
|
+
#currentAnchor;
|
|
75
87
|
/**
|
|
76
88
|
* @internal
|
|
77
89
|
*/
|
|
@@ -105,9 +117,7 @@ var Popover = class extends require_localized.Localized(require_delegates_aria.D
|
|
|
105
117
|
/**
|
|
106
118
|
* @internal
|
|
107
119
|
*/
|
|
108
|
-
#manualToggle
|
|
109
|
-
this._popoverEl.togglePopover();
|
|
110
|
-
};
|
|
120
|
+
#manualToggle;
|
|
111
121
|
/**
|
|
112
122
|
* @internal
|
|
113
123
|
*/
|
|
@@ -150,9 +160,7 @@ var Popover = class extends require_localized.Localized(require_delegates_aria.D
|
|
|
150
160
|
/**
|
|
151
161
|
* @internal
|
|
152
162
|
*/
|
|
153
|
-
#autoUpdateCallback
|
|
154
|
-
this.#lastPositionUpdate = this.updatePosition();
|
|
155
|
-
};
|
|
163
|
+
#autoUpdateCallback;
|
|
156
164
|
/**
|
|
157
165
|
* Updates the position of the popover
|
|
158
166
|
* @public
|
|
@@ -204,11 +212,7 @@ var Popover = class extends require_localized.Localized(require_delegates_aria.D
|
|
|
204
212
|
* Syncs native toggle state (Esc key, light dismiss) back to the 'open' attribute.
|
|
205
213
|
* @internal
|
|
206
214
|
*/
|
|
207
|
-
#handleNativeToggle
|
|
208
|
-
const isOpen = e.newState ? e.newState === "open" : this._popoverEl.matches(":popover-open");
|
|
209
|
-
if (this.open !== isOpen) this.open = isOpen;
|
|
210
|
-
this.$emit(isOpen ? "open" : "close", void 0, { bubbles: false });
|
|
211
|
-
};
|
|
215
|
+
#handleNativeToggle;
|
|
212
216
|
connectedCallback() {
|
|
213
217
|
super.connectedCallback();
|
|
214
218
|
this.#updateAnchor();
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { c as createRegisterFunction, s as defineVividComponent, t as VividElement } from "./vivid-element.js";
|
|
2
2
|
import { r as Icon, t as iconDefinition } from "./definition2.js";
|
|
3
3
|
import { t as __decorate } from "./decorate.js";
|
|
4
4
|
import { n as delegateAria, t as DelegatesAria } from "./delegates-aria.js";
|
|
@@ -32,6 +32,18 @@ var Popover = class extends Localized(DelegatesAria(VividElement)) {
|
|
|
32
32
|
this.dismissButtonAriaLabel = null;
|
|
33
33
|
this.arrow = false;
|
|
34
34
|
this.open = false;
|
|
35
|
+
this.#currentAnchor = null;
|
|
36
|
+
this.#manualToggle = () => {
|
|
37
|
+
this._popoverEl.togglePopover();
|
|
38
|
+
};
|
|
39
|
+
this.#autoUpdateCallback = () => {
|
|
40
|
+
this.#lastPositionUpdate = this.updatePosition();
|
|
41
|
+
};
|
|
42
|
+
this.#handleNativeToggle = (e) => {
|
|
43
|
+
const isOpen = e.newState ? e.newState === "open" : this._popoverEl.matches(":popover-open");
|
|
44
|
+
if (this.open !== isOpen) this.open = isOpen;
|
|
45
|
+
this.$emit(isOpen ? "open" : "close", void 0, { bubbles: false });
|
|
46
|
+
};
|
|
35
47
|
}
|
|
36
48
|
/**
|
|
37
49
|
* @internal
|
|
@@ -70,7 +82,7 @@ var Popover = class extends Localized(DelegatesAria(VividElement)) {
|
|
|
70
82
|
/**
|
|
71
83
|
* @internal
|
|
72
84
|
*/
|
|
73
|
-
#currentAnchor
|
|
85
|
+
#currentAnchor;
|
|
74
86
|
/**
|
|
75
87
|
* @internal
|
|
76
88
|
*/
|
|
@@ -104,9 +116,7 @@ var Popover = class extends Localized(DelegatesAria(VividElement)) {
|
|
|
104
116
|
/**
|
|
105
117
|
* @internal
|
|
106
118
|
*/
|
|
107
|
-
#manualToggle
|
|
108
|
-
this._popoverEl.togglePopover();
|
|
109
|
-
};
|
|
119
|
+
#manualToggle;
|
|
110
120
|
/**
|
|
111
121
|
* @internal
|
|
112
122
|
*/
|
|
@@ -149,9 +159,7 @@ var Popover = class extends Localized(DelegatesAria(VividElement)) {
|
|
|
149
159
|
/**
|
|
150
160
|
* @internal
|
|
151
161
|
*/
|
|
152
|
-
#autoUpdateCallback
|
|
153
|
-
this.#lastPositionUpdate = this.updatePosition();
|
|
154
|
-
};
|
|
162
|
+
#autoUpdateCallback;
|
|
155
163
|
/**
|
|
156
164
|
* Updates the position of the popover
|
|
157
165
|
* @public
|
|
@@ -203,11 +211,7 @@ var Popover = class extends Localized(DelegatesAria(VividElement)) {
|
|
|
203
211
|
* Syncs native toggle state (Esc key, light dismiss) back to the 'open' attribute.
|
|
204
212
|
* @internal
|
|
205
213
|
*/
|
|
206
|
-
#handleNativeToggle
|
|
207
|
-
const isOpen = e.newState ? e.newState === "open" : this._popoverEl.matches(":popover-open");
|
|
208
|
-
if (this.open !== isOpen) this.open = isOpen;
|
|
209
|
-
this.$emit(isOpen ? "open" : "close", void 0, { bubbles: false });
|
|
210
|
-
};
|
|
214
|
+
#handleNativeToggle;
|
|
211
215
|
connectedCallback() {
|
|
212
216
|
super.connectedCallback();
|
|
213
217
|
this.#updateAnchor();
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { c as createRegisterFunction, s as defineVividComponent } from "./vivid-element.js";
|
|
2
2
|
import { t as __decorate } from "./decorate.js";
|
|
3
3
|
import { n as delegateAria, t as DelegatesAria } from "./delegates-aria.js";
|
|
4
4
|
import { t as BaseProgress } from "./base-progress.js";
|
|
@@ -7,7 +7,7 @@ const require_with_error_text = require("./with-error-text.cjs");
|
|
|
7
7
|
let _microsoft_fast_element = require("@microsoft/fast-element");
|
|
8
8
|
let _microsoft_fast_web_utilities = require("@microsoft/fast-web-utilities");
|
|
9
9
|
//#region src/lib/radio/radio.scss?inline
|
|
10
|
-
var radio_default = ":host(:focus-visible){outline:none}:host([disabled]){cursor:not-allowed}.base.connotation-cta{--_connotation-color-primary:var(--vvd-radio-cta-primary,var(--vvd-color-cta-500));--_connotation-color-primary-text:var(--vvd-radio-cta-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-radio-cta-primary-increment,var(--vvd-color-cta-600));--_connotation-color-intermediate:var(--vvd-radio-cta-intermediate,var(--vvd-color-cta-500));--_connotation-color-firm:var(--vvd-radio-cta-firm,var(--vvd-color-cta-600));--_connotation-color-fierce:var(--vvd-radio-cta-fierce,var(--vvd-color-cta-700))}.base:not(.connotation-cta){--_connotation-color-primary:var(--vvd-radio-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-radio-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-radio-accent-primary-increment,var(--vvd-color-neutral-800));--_connotation-color-intermediate:var(--vvd-radio-accent-intermediate,var(--vvd-color-neutral-500));--_connotation-color-firm:var(--vvd-radio-accent-firm,var(--vvd-color-canvas-text));--_connotation-color-fierce:var(--vvd-radio-accent-fierce,var(--vvd-color-neutral-700))}.base{--_appearance-color-text:var(--vvd-color-canvas-text);--_appearance-color-fill:var(--vvd-color-canvas);--_appearance-color-outline:var(--vvd-color-neutral-500)}@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-color-text:var(--vvd-color-canvas-text);--_appearance-color-fill:var(--vvd-color-canvas);--_appearance-color-outline:var(--vvd-color-neutral-700)}.base:checked:where(:not(.disabled,:disabled)),.base.checked:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary);--_appearance-color-outline:var(--_connotation-color-primary)}@media (hover:hover){.base:checked:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary-increment);--_appearance-color-outline:var(--_connotation-color-primary-increment)}}.base.checked.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary-increment);--_appearance-color-outline:var(--_connotation-color-primary-increment)}.base:disabled,.base.disabled{--_appearance-color-text:var(--vvd-color-neutral-
|
|
10
|
+
var radio_default = ":host(:focus-visible){outline:none}:host([disabled]){cursor:not-allowed}.base.connotation-cta{--_connotation-color-primary:var(--vvd-radio-cta-primary,var(--vvd-color-cta-500));--_connotation-color-primary-text:var(--vvd-radio-cta-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-radio-cta-primary-increment,var(--vvd-color-cta-600));--_connotation-color-intermediate:var(--vvd-radio-cta-intermediate,var(--vvd-color-cta-500));--_connotation-color-firm:var(--vvd-radio-cta-firm,var(--vvd-color-cta-600));--_connotation-color-fierce:var(--vvd-radio-cta-fierce,var(--vvd-color-cta-700))}.base:not(.connotation-cta){--_connotation-color-primary:var(--vvd-radio-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-radio-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-radio-accent-primary-increment,var(--vvd-color-neutral-800));--_connotation-color-intermediate:var(--vvd-radio-accent-intermediate,var(--vvd-color-neutral-500));--_connotation-color-firm:var(--vvd-radio-accent-firm,var(--vvd-color-canvas-text));--_connotation-color-fierce:var(--vvd-radio-accent-fierce,var(--vvd-color-neutral-700))}.base{--_appearance-color-text:var(--vvd-color-canvas-text);--_appearance-color-fill:var(--vvd-color-canvas);--_appearance-color-outline:var(--vvd-color-neutral-500)}@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-color-text:var(--vvd-color-canvas-text);--_appearance-color-fill:var(--vvd-color-canvas);--_appearance-color-outline:var(--vvd-color-neutral-700)}.base:checked:where(:not(.disabled,:disabled)),.base.checked:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary);--_appearance-color-outline:var(--_connotation-color-primary)}@media (hover:hover){.base:checked:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary-increment);--_appearance-color-outline:var(--_connotation-color-primary-increment)}}.base.checked.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary-increment);--_appearance-color-outline:var(--_connotation-color-primary-increment)}.base:disabled,.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.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{cursor:pointer;align-items:center;gap:8px;display:inline-flex}@supports (user-select:none){.base{user-select:none}}.base.disabled{pointer-events:none}.control{block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 20));box-shadow:inset 0 0 0 2px var(--_appearance-color-outline);inline-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 20));border-radius:50%;flex-shrink:0;position:relative}.base:not(.checked) .control{background-color:var(--_appearance-color-fill)}.control:after{border-radius:inherit;background-color:var(--_appearance-color-outline);content:\"\";opacity:1;transition:opacity .2s;position:absolute;inset:5px}.base:not(.checked) .control:after{opacity:0}:host(:focus-visible) .control{--focus-stroke-gap-color:transparent;position:relative}:host(:focus-visible) .control:before{box-shadow:0 0 0 4px color-mix(in srgb, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px));border-radius:var(--focus-border-radius,inherit);block-size:calc(100% + var(--focus-block-size-addition,4px));content:\"\";inline-size:calc(100% + var(--focus-block-size-addition,4px));display:block;position:absolute;inset-block-start:50%;inset-inline-start:50%;transform:translate(-50%,-50%)}label{color:var(--vvd-color-canvas-text);cursor:pointer;font:var(--vvd-typography-base)}";
|
|
11
11
|
//#endregion
|
|
12
12
|
//#region src/lib/radio/radio.ts
|
|
13
13
|
/**
|
|
@@ -52,6 +52,28 @@ var Radio = class extends require_with_error_text.WithErrorText(require_form_ele
|
|
|
52
52
|
return true;
|
|
53
53
|
};
|
|
54
54
|
this.proxy = document.createElement("input");
|
|
55
|
+
this.#validateValueMissingWithSiblings = () => {
|
|
56
|
+
const siblings = this.#radioSiblings;
|
|
57
|
+
const group = this.#radioGroup;
|
|
58
|
+
if (siblings && siblings.length > 1) {
|
|
59
|
+
if (siblings.some((x) => x.checked)) {
|
|
60
|
+
this.setValidity({ valueMissing: false });
|
|
61
|
+
this.errorValidationMessage = "";
|
|
62
|
+
if (group) group.errorValidationMessage = "";
|
|
63
|
+
}
|
|
64
|
+
}
|
|
65
|
+
};
|
|
66
|
+
this.#syncSiblingsRequiredValidationStatus = () => {
|
|
67
|
+
if (this.elementInternals && !this.validity.valueMissing) {
|
|
68
|
+
const siblings = this.#radioSiblings;
|
|
69
|
+
const group = this.#radioGroup;
|
|
70
|
+
if (siblings && siblings.length > 1) siblings.forEach((x) => {
|
|
71
|
+
x.elementInternals.setValidity({ valueMissing: false });
|
|
72
|
+
x.errorValidationMessage = "";
|
|
73
|
+
if (group) group.errorValidationMessage = "";
|
|
74
|
+
});
|
|
75
|
+
}
|
|
76
|
+
};
|
|
55
77
|
this.proxy.setAttribute("type", "radio");
|
|
56
78
|
this.proxy.setAttribute("name", this.name);
|
|
57
79
|
this.checked = this.defaultChecked;
|
|
@@ -104,28 +126,8 @@ var Radio = class extends require_with_error_text.WithErrorText(require_form_ele
|
|
|
104
126
|
if (parentGroup) return parentGroup;
|
|
105
127
|
return null;
|
|
106
128
|
}
|
|
107
|
-
#validateValueMissingWithSiblings
|
|
108
|
-
|
|
109
|
-
const group = this.#radioGroup;
|
|
110
|
-
if (siblings && siblings.length > 1) {
|
|
111
|
-
if (siblings.some((x) => x.checked)) {
|
|
112
|
-
this.setValidity({ valueMissing: false });
|
|
113
|
-
this.errorValidationMessage = "";
|
|
114
|
-
if (group) group.errorValidationMessage = "";
|
|
115
|
-
}
|
|
116
|
-
}
|
|
117
|
-
};
|
|
118
|
-
#syncSiblingsRequiredValidationStatus = () => {
|
|
119
|
-
if (this.elementInternals && !this.validity.valueMissing) {
|
|
120
|
-
const siblings = this.#radioSiblings;
|
|
121
|
-
const group = this.#radioGroup;
|
|
122
|
-
if (siblings && siblings.length > 1) siblings.forEach((x) => {
|
|
123
|
-
x.elementInternals.setValidity({ valueMissing: false });
|
|
124
|
-
x.errorValidationMessage = "";
|
|
125
|
-
if (group) group.errorValidationMessage = "";
|
|
126
|
-
});
|
|
127
|
-
}
|
|
128
|
-
};
|
|
129
|
+
#validateValueMissingWithSiblings;
|
|
130
|
+
#syncSiblingsRequiredValidationStatus;
|
|
129
131
|
/**
|
|
130
132
|
* @internal
|
|
131
133
|
*/
|