@vonage/vivid 5.23.1-preview.0 → 5.23.1
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/action-group/index.cjs +1 -1
- package/action-group/index.js +1 -1
- package/alert/definition.cjs +1 -1
- package/alert/definition.js +1 -1
- package/alert/index.cjs +7 -7
- package/alert/index.js +13 -14
- package/audio-player/definition.cjs +1 -1
- package/audio-player/definition.js +1 -1
- package/audio-player/index.cjs +18 -16
- package/audio-player/index.js +21 -19
- package/avatar/definition.cjs +1 -1
- package/avatar/definition.js +1 -1
- package/avatar/index.cjs +4 -4
- package/avatar/index.js +6 -6
- package/badge/definition.cjs +1 -1
- package/badge/definition.js +1 -1
- package/banner/definition.cjs +1 -1
- package/banner/definition.js +1 -1
- package/banner/index.cjs +3 -3
- package/banner/index.js +8 -8
- package/breadcrumb/definition.cjs +1 -1
- package/breadcrumb/definition.js +1 -1
- package/breadcrumb-item/definition.cjs +1 -1
- package/breadcrumb-item/definition.js +1 -1
- package/breadcrumb-item/index.cjs +2 -2
- package/breadcrumb-item/index.js +5 -5
- package/bundled/affix.cjs +1 -1
- package/bundled/affix.js +1 -1
- package/bundled/base-color-picker.cjs +2 -2
- package/bundled/base-color-picker.js +5 -5
- package/bundled/calendar-picker.template.cjs +1 -1
- package/bundled/calendar-picker.template.js +1 -1
- package/bundled/definition11.cjs +4 -4
- package/bundled/definition11.js +5 -5
- package/bundled/definition12.cjs +9 -7
- package/bundled/definition12.js +28 -26
- package/bundled/definition13.cjs +9 -7
- package/bundled/definition13.js +16 -15
- package/bundled/definition15.cjs +6 -6
- package/bundled/definition15.js +17 -17
- package/bundled/definition16.cjs +4 -2
- package/bundled/definition16.js +8 -6
- package/bundled/definition17.cjs +8 -6
- package/bundled/definition17.js +15 -14
- package/bundled/definition18.cjs +23 -23
- package/bundled/definition18.js +51 -52
- package/bundled/definition19.cjs +3 -1
- package/bundled/definition19.js +3 -1
- package/bundled/definition2.cjs +1 -13
- package/bundled/definition2.js +181 -48
- package/bundled/definition20.cjs +11 -9
- package/bundled/definition20.js +25 -23
- package/bundled/definition21.cjs +6 -6
- package/bundled/definition21.js +7 -8
- package/bundled/definition22.cjs +5 -3
- package/bundled/definition22.js +13 -11
- package/bundled/definition23.cjs +1 -1
- package/bundled/definition23.js +2 -2
- package/bundled/definition24.cjs +10 -10
- package/bundled/definition24.js +12 -12
- package/bundled/definition3.cjs +13 -1
- package/bundled/definition3.js +48 -181
- package/bundled/definition4.cjs +9 -7
- package/bundled/definition4.js +18 -16
- package/bundled/definition5.cjs +5 -5
- package/bundled/definition5.js +9 -9
- package/bundled/definition6.cjs +3 -3
- package/bundled/definition6.js +16 -16
- package/bundled/definition7.cjs +1 -1
- package/bundled/definition7.js +1 -1
- package/bundled/definition8.cjs +7 -7
- package/bundled/definition8.js +9 -7
- package/bundled/definition9.cjs +4 -4
- package/bundled/definition9.js +12 -12
- package/bundled/mixins.cjs +3 -3
- package/bundled/mixins.js +5 -5
- package/bundled/numberConverter.cjs +1 -1
- package/bundled/numberConverter.js +36 -1
- package/bundled/picker-field.template.cjs +13 -13
- package/bundled/picker-field.template.js +16 -16
- package/bundled/slider.template.cjs +8 -8
- package/bundled/slider.template.js +9 -9
- package/bundled/text-field.cjs +1 -1
- package/bundled/text-field.js +1 -1
- package/bundled/time-selection-picker.template.cjs +3 -3
- package/bundled/time-selection-picker.template.js +9 -9
- package/bundled/vivid-element.cjs +1 -1
- package/bundled/vivid-element.js +1 -1
- package/button/definition.cjs +1 -1
- package/button/definition.js +1 -1
- package/calendar/definition.cjs +1 -1
- package/calendar/definition.js +1 -1
- package/calendar/index.cjs +9 -9
- package/calendar/index.js +7 -7
- package/calendar-event/definition.cjs +1 -1
- package/calendar-event/definition.js +1 -1
- package/calendar-event/index.cjs +2 -2
- package/calendar-event/index.js +2 -2
- package/card/definition.cjs +1 -1
- package/card/definition.js +1 -1
- package/card/index.cjs +3 -3
- package/card/index.js +6 -6
- package/color-picker/index.cjs +10 -10
- package/color-picker/index.js +52 -52
- package/combobox/index.cjs +14 -11
- package/combobox/index.js +38 -36
- package/custom-elements.json +2994 -3642
- package/data-grid/index.cjs +8 -6
- package/data-grid/index.js +20 -18
- package/dial-pad/index.cjs +22 -20
- package/dial-pad/index.js +36 -34
- package/dialog/index.cjs +14 -14
- package/dialog/index.js +17 -18
- package/elevation/definition.cjs +1 -1
- package/elevation/definition.js +1 -1
- package/empty-state/index.cjs +4 -4
- package/empty-state/index.js +7 -11
- package/fab/index.cjs +4 -4
- package/fab/index.js +9 -13
- package/file-picker/index.cjs +8 -8
- package/file-picker/index.js +19 -19
- package/flag/index.cjs +5 -5
- package/flag/index.js +8 -12
- package/header/index.cjs +5 -5
- package/header/index.js +4 -8
- package/icon/index.cjs +1 -1
- package/icon/index.js +1 -1
- package/index.cjs +15 -14
- package/index.js +16 -16
- package/kbd-key/index.cjs +3 -3
- package/kbd-key/index.js +2 -6
- package/layout/index.cjs +3 -1
- package/layout/index.js +3 -1
- package/lib/accordion/variations.browser-spec.d.ts +1 -0
- package/lib/accordion-item/variations.browser-spec.d.ts +1 -0
- package/lib/action-group/variations.browser-spec.d.ts +1 -0
- package/lib/alert/variations.browser-spec.d.ts +1 -0
- package/lib/audio-player/variations.browser-spec.d.ts +1 -0
- package/lib/avatar/variations.browser-spec.d.ts +1 -0
- package/lib/badge/badge.d.ts +4 -4
- package/lib/badge/badge.template.d.ts +1 -2
- package/lib/badge/variations.browser-spec.d.ts +1 -0
- package/lib/banner/variations.browser-spec.d.ts +1 -0
- package/lib/breadcrumb-item/variations.browser-spec.d.ts +1 -0
- package/lib/button/variations.browser-spec.d.ts +1 -0
- package/lib/calendar/variations.browser-spec.d.ts +1 -0
- package/lib/calendar-event/variations.browser-spec.d.ts +1 -0
- package/lib/card/card.d.ts +4 -4
- package/lib/card/variations.browser-spec.d.ts +1 -0
- package/lib/checkbox/variations.browser-spec.d.ts +1 -0
- package/lib/color-picker/color-picker.d.ts +1 -1
- package/lib/color-picker/variations.browser-spec.d.ts +1 -0
- package/lib/combobox/variations.browser-spec.d.ts +1 -0
- package/lib/contextual-help/variations.browser-spec.d.ts +1 -0
- package/lib/country/variations.browser-spec.d.ts +1 -0
- package/lib/data-grid/variations.browser-spec.d.ts +1 -0
- package/lib/date-picker/variations.browser-spec.d.ts +1 -0
- package/lib/date-range-picker/variations.browser-spec.d.ts +1 -0
- package/lib/date-time-picker/variations.browser-spec.d.ts +1 -0
- package/lib/dial-pad/variations.browser-spec.d.ts +1 -0
- package/lib/dialog/variations.browser-spec.d.ts +1 -0
- package/lib/divider/variations.browser-spec.d.ts +1 -0
- package/lib/empty-state/variations.browser-spec.d.ts +1 -0
- package/lib/fab/fab.d.ts +5 -5
- package/lib/fab/variations.browser-spec.d.ts +1 -0
- package/lib/file-picker/variations.browser-spec.d.ts +1 -0
- package/lib/flag/variations.browser-spec.d.ts +1 -0
- package/lib/header/variations.browser-spec.d.ts +1 -0
- package/lib/icon/variations.browser-spec.d.ts +1 -0
- package/lib/kbd-key/variations.browser-spec.d.ts +1 -0
- package/lib/kbd-shortcut/variations.browser-spec.d.ts +1 -0
- package/lib/layout/variations.browser-spec.d.ts +1 -0
- package/lib/menu/variations.browser-spec.d.ts +1 -0
- package/lib/menu-item/variations.browser-spec.d.ts +1 -0
- package/lib/nav/variations.browser-spec.d.ts +1 -0
- package/lib/nav-disclosure/variations.browser-spec.d.ts +1 -0
- package/lib/nav-item/variations.browser-spec.d.ts +1 -0
- package/lib/note/variations.browser-spec.d.ts +1 -0
- package/lib/number-field/variations.browser-spec.d.ts +1 -0
- package/lib/option/variations.browser-spec.d.ts +1 -0
- package/lib/pagination/variations.browser-spec.d.ts +1 -0
- package/lib/popover/variations.browser-spec.d.ts +1 -0
- package/lib/progress/variations.browser-spec.d.ts +1 -0
- package/lib/progress-ring/variations.browser-spec.d.ts +1 -0
- package/lib/radio/variations.browser-spec.d.ts +1 -0
- package/lib/radio-group/variations.browser-spec.d.ts +1 -0
- package/lib/range-slider/variations.browser-spec.d.ts +1 -0
- package/lib/rich-text-editor/rte/features/internal/cursor-fix.d.ts +6 -1
- package/lib/rich-text-editor/variations.browser-spec.d.ts +1 -0
- package/lib/rich-text-view/variations.browser-spec.d.ts +1 -0
- package/lib/searchable-select/variations.browser-spec.d.ts +1 -0
- package/lib/select/variations.browser-spec.d.ts +1 -0
- package/lib/selectable-box/variations.browser-spec.d.ts +1 -0
- package/lib/side-drawer/variations.browser-spec.d.ts +1 -0
- package/lib/simple-color-picker/simple-color-picker.d.ts +2 -2
- package/lib/simple-color-picker/variations.browser-spec.d.ts +1 -0
- package/lib/slider/variations.browser-spec.d.ts +1 -0
- package/lib/split-button/variations.browser-spec.d.ts +1 -0
- package/lib/status/variations.browser-spec.d.ts +1 -0
- package/lib/switch/variations.browser-spec.d.ts +1 -0
- package/lib/tab/tab.d.ts +12 -12
- package/lib/table/variations.browser-spec.d.ts +1 -0
- package/lib/tabs/variations.browser-spec.d.ts +1 -0
- package/lib/tag/tag.d.ts +12 -12
- package/lib/tag/variations.browser-spec.d.ts +1 -0
- package/lib/text-area/text-area.template.d.ts +1 -2
- package/lib/text-area/variations.browser-spec.d.ts +1 -0
- package/lib/text-field/variations.browser-spec.d.ts +1 -0
- package/lib/time-picker/variations.browser-spec.d.ts +1 -0
- package/lib/toggletip/variations.browser-spec.d.ts +1 -0
- package/lib/tooltip/variations.browser-spec.d.ts +1 -0
- package/lib/tree-item/variations.browser-spec.d.ts +1 -0
- package/lib/video-player/variations.browser-spec.d.ts +1 -0
- package/menu/definition.cjs +1 -1
- package/menu/definition.js +1 -1
- package/menu-item/definition.cjs +1 -1
- package/menu-item/definition.js +1 -1
- package/nav-disclosure/index.cjs +6 -6
- package/nav-disclosure/index.js +11 -15
- package/nav-item/index.cjs +2 -2
- package/nav-item/index.js +11 -15
- package/note/index.cjs +5 -5
- package/note/index.js +10 -11
- package/number-field/index.cjs +12 -12
- package/number-field/index.js +34 -35
- package/package.json +15 -6
- package/popover/index.cjs +8 -8
- package/popover/index.js +11 -15
- package/popup/definition.cjs +1 -1
- package/popup/definition.js +1 -1
- package/progress/index.cjs +8 -8
- package/progress/index.js +9 -10
- package/range-slider/index.cjs +10 -8
- package/range-slider/index.js +26 -24
- package/rich-text-editor/index.cjs +3 -3
- package/rich-text-editor/index.js +758 -747
- package/searchable-select/definition.cjs +1 -0
- package/searchable-select/definition.js +2 -2
- package/searchable-select/index.cjs +30 -27
- package/searchable-select/index.js +80 -76
- package/selectable-box/index.cjs +8 -8
- package/selectable-box/index.js +8 -9
- package/side-drawer/index.cjs +3 -3
- package/side-drawer/index.js +3 -3
- package/simple-color-picker/index.cjs +4 -4
- package/simple-color-picker/index.js +6 -6
- package/slider/definition.cjs +1 -1
- package/slider/definition.js +1 -1
- package/slider/index.cjs +1 -1
- package/slider/index.js +1 -1
- package/split-button/index.cjs +4 -4
- package/split-button/index.js +9 -9
- package/status/index.cjs +7 -5
- package/status/index.js +14 -12
- package/styles/core/all.css +5 -7
- package/styles/core/theme.css +5 -7
- package/styles/core/typography.css +0 -3
- package/styles/tokens/vivid-2-compat.css +1 -6
- package/switch/index.cjs +3 -3
- package/switch/index.js +5 -5
- package/table/index.cjs +10 -10
- package/table/index.js +12 -12
- package/tabs/index.cjs +6 -4
- package/tabs/index.js +10 -9
- package/tag/index.cjs +6 -6
- package/tag/index.js +8 -8
- package/text-area/index.cjs +8 -6
- package/text-area/index.js +20 -19
- package/unbundled/affix.cjs +2 -7
- package/unbundled/affix.js +2 -7
- package/unbundled/anchored.cjs +2 -6
- package/unbundled/anchored.js +2 -6
- package/unbundled/aria-binding-directive.cjs +1 -3
- package/unbundled/aria-binding-directive.js +1 -3
- package/unbundled/base-color-picker.cjs +18 -52
- package/unbundled/base-color-picker.js +18 -52
- package/unbundled/base-progress.cjs +4 -14
- package/unbundled/base-progress.js +4 -14
- package/unbundled/button.cjs +2 -8
- package/unbundled/button.js +2 -8
- package/unbundled/calendar-picker.template.cjs +31 -85
- package/unbundled/calendar-picker.template.js +30 -84
- package/unbundled/char-count.cjs +2 -4
- package/unbundled/char-count.js +2 -4
- package/unbundled/data-grid.options.cjs +3 -19
- package/unbundled/data-grid.options.js +3 -19
- package/unbundled/definition.cjs +3 -8
- package/unbundled/definition.js +3 -8
- package/unbundled/definition10.cjs +316 -211
- package/unbundled/definition10.js +313 -202
- package/unbundled/definition11.cjs +262 -356
- package/unbundled/definition11.js +248 -354
- package/unbundled/definition12.cjs +243 -274
- package/unbundled/definition12.js +241 -260
- package/unbundled/definition13.cjs +341 -255
- package/unbundled/definition13.js +338 -252
- package/unbundled/definition14.cjs +61 -371
- package/unbundled/definition14.js +57 -367
- package/unbundled/definition15.cjs +32 -77
- package/unbundled/definition15.js +28 -73
- package/unbundled/definition16.cjs +120 -32
- package/unbundled/definition16.js +117 -29
- package/unbundled/definition17.cjs +24 -132
- package/unbundled/definition17.js +24 -126
- package/unbundled/definition18.cjs +74 -26
- package/unbundled/definition18.js +67 -25
- package/unbundled/definition19.cjs +33 -79
- package/unbundled/definition19.js +32 -73
- package/unbundled/definition2.cjs +3 -6
- package/unbundled/definition2.js +3 -6
- package/unbundled/definition20.cjs +272 -29
- package/unbundled/definition20.js +264 -27
- package/unbundled/definition21.cjs +135 -263
- package/unbundled/definition21.js +133 -260
- package/unbundled/definition22.cjs +17 -155
- package/unbundled/definition22.js +13 -151
- package/unbundled/definition23.cjs +8 -17
- package/unbundled/definition23.js +8 -17
- package/unbundled/definition24.cjs +4 -10
- package/unbundled/definition24.js +4 -10
- package/unbundled/definition25.cjs +2 -10
- package/unbundled/definition25.js +2 -10
- package/unbundled/definition26.cjs +28 -70
- package/unbundled/definition26.js +28 -70
- package/unbundled/definition27.cjs +6 -13
- package/unbundled/definition27.js +6 -13
- package/unbundled/definition28.cjs +30 -77
- package/unbundled/definition28.js +30 -77
- package/unbundled/definition29.cjs +7 -14
- package/unbundled/definition29.js +7 -14
- package/unbundled/definition3.cjs +5 -16
- package/unbundled/definition3.js +5 -16
- package/unbundled/definition30.cjs +20 -51
- package/unbundled/definition30.js +20 -51
- package/unbundled/definition31.cjs +2 -4
- package/unbundled/definition31.js +2 -4
- package/unbundled/definition32.cjs +7 -17
- package/unbundled/definition32.js +7 -17
- package/unbundled/definition33.cjs +4 -9
- package/unbundled/definition33.js +4 -9
- package/unbundled/definition34.cjs +51 -141
- package/unbundled/definition34.js +51 -141
- package/unbundled/definition35.cjs +4 -5
- package/unbundled/definition35.js +4 -5
- package/unbundled/definition36.cjs +16 -38
- package/unbundled/definition36.js +14 -36
- package/unbundled/definition37.cjs +33 -89
- package/unbundled/definition37.js +31 -87
- package/unbundled/definition38.cjs +18 -44
- package/unbundled/definition38.js +16 -42
- package/unbundled/definition39.cjs +16 -32
- package/unbundled/definition39.js +13 -29
- package/unbundled/definition4.cjs +2 -11
- package/unbundled/definition4.js +2 -7
- package/unbundled/definition40.cjs +9 -20
- package/unbundled/definition40.js +9 -20
- package/unbundled/definition41.cjs +3 -6
- package/unbundled/definition41.js +3 -6
- package/unbundled/definition42.cjs +3 -6
- package/unbundled/definition42.js +3 -6
- package/unbundled/definition43.cjs +24 -67
- package/unbundled/definition43.js +24 -67
- package/unbundled/definition44.cjs +3 -6
- package/unbundled/definition44.js +3 -6
- package/unbundled/definition45.cjs +1 -3
- package/unbundled/definition45.js +1 -3
- package/unbundled/definition46.cjs +5 -14
- package/unbundled/definition46.js +5 -14
- package/unbundled/definition47.cjs +4 -5
- package/unbundled/definition47.js +5 -11
- package/unbundled/definition48.cjs +5 -12
- package/unbundled/definition48.js +5 -12
- package/unbundled/definition49.cjs +3 -7
- package/unbundled/definition49.js +3 -7
- package/unbundled/definition5.cjs +2 -5
- package/unbundled/definition5.js +2 -5
- package/unbundled/definition50.cjs +1 -3
- package/unbundled/definition50.js +1 -3
- package/unbundled/definition51.cjs +2 -5
- package/unbundled/definition51.js +2 -5
- package/unbundled/definition52.cjs +19 -44
- package/unbundled/definition52.js +16 -41
- package/unbundled/definition53.cjs +5 -13
- package/unbundled/definition53.js +5 -13
- package/unbundled/definition54.cjs +2 -6
- package/unbundled/definition54.js +2 -6
- package/unbundled/definition55.cjs +23 -65
- package/unbundled/definition55.js +23 -65
- package/unbundled/definition56.cjs +2 -5
- package/unbundled/definition56.js +2 -5
- package/unbundled/definition57.cjs +11 -24
- package/unbundled/definition57.js +11 -26
- package/unbundled/definition58.cjs +10 -30
- package/unbundled/definition58.js +10 -30
- package/unbundled/definition59.cjs +19 -48
- package/unbundled/definition59.js +19 -48
- package/unbundled/definition6.cjs +179 -17
- package/unbundled/definition6.js +170 -14
- package/unbundled/definition60.cjs +70 -54
- package/unbundled/definition60.js +70 -54
- package/unbundled/definition61.cjs +22 -54
- package/unbundled/definition61.js +22 -54
- package/unbundled/definition62.cjs +3 -9
- package/unbundled/definition62.js +3 -9
- package/unbundled/definition63.cjs +62 -130
- package/unbundled/definition63.js +60 -131
- package/unbundled/definition64.cjs +5 -12
- package/unbundled/definition64.js +5 -12
- package/unbundled/definition65.cjs +6 -14
- package/unbundled/definition65.js +6 -19
- package/unbundled/definition66.cjs +13 -35
- package/unbundled/definition66.js +13 -35
- package/unbundled/definition67.cjs +3 -5
- package/unbundled/definition67.js +3 -5
- package/unbundled/definition68.cjs +4 -5
- package/unbundled/definition68.js +4 -5
- package/unbundled/definition69.cjs +6 -15
- package/unbundled/definition69.js +6 -17
- package/unbundled/definition7.cjs +31 -177
- package/unbundled/definition7.js +24 -170
- package/unbundled/definition70.cjs +1 -3
- package/unbundled/definition70.js +1 -3
- package/unbundled/definition71.cjs +7 -12
- package/unbundled/definition71.js +7 -12
- package/unbundled/definition72.cjs +11 -25
- package/unbundled/definition72.js +11 -25
- package/unbundled/definition73.cjs +15 -39
- package/unbundled/definition73.js +15 -39
- package/unbundled/definition74.cjs +1 -3
- package/unbundled/definition74.js +1 -3
- package/unbundled/definition75.cjs +5 -11
- package/unbundled/definition75.js +5 -11
- package/unbundled/definition76.cjs +24 -59
- package/unbundled/definition76.js +24 -59
- package/unbundled/definition77.cjs +6 -8
- package/unbundled/definition77.js +4 -6
- package/unbundled/definition78.cjs +7 -13
- package/unbundled/definition78.js +7 -13
- package/unbundled/definition79.cjs +5 -15
- package/unbundled/definition79.js +5 -15
- package/unbundled/definition8.cjs +152 -36
- package/unbundled/definition8.js +148 -31
- package/unbundled/definition80.cjs +9 -25
- package/unbundled/definition80.js +9 -25
- package/unbundled/definition9.cjs +200 -135
- package/unbundled/definition9.js +189 -130
- package/unbundled/delegates-aria.cjs +1 -3
- package/unbundled/delegates-aria.js +1 -3
- package/unbundled/divider.cjs +2 -7
- package/unbundled/divider.js +2 -7
- package/unbundled/form-associated.cjs +20 -60
- package/unbundled/form-associated.js +20 -60
- package/unbundled/form-element.cjs +5 -15
- package/unbundled/form-element.js +5 -15
- package/unbundled/host-semantics.cjs +1 -3
- package/unbundled/host-semantics.js +1 -3
- package/unbundled/kbd-shortcut.cjs +1 -3
- package/unbundled/kbd-shortcut.js +1 -3
- package/unbundled/linkable.cjs +1 -3
- package/unbundled/linkable.js +1 -3
- package/unbundled/listbox.cjs +6 -20
- package/unbundled/listbox.js +6 -20
- package/unbundled/localized.cjs +3 -9
- package/unbundled/localized.js +3 -9
- package/unbundled/mixins.cjs +9 -25
- package/unbundled/mixins.js +9 -25
- package/unbundled/numberConverter.cjs +39 -9
- package/unbundled/numberConverter.js +39 -9
- package/unbundled/picker-field.template.cjs +16 -36
- package/unbundled/picker-field.template.js +16 -36
- package/unbundled/platform.cjs +1 -3
- package/unbundled/platform.js +1 -3
- package/unbundled/playbackRates.cjs +1 -3
- package/unbundled/playbackRates.js +1 -3
- package/unbundled/randomId.cjs +1 -3
- package/unbundled/randomId.js +1 -3
- package/unbundled/single-date-picker.cjs +6 -18
- package/unbundled/single-date-picker.js +6 -18
- package/unbundled/single-value-picker.cjs +7 -21
- package/unbundled/single-value-picker.js +7 -21
- package/unbundled/slider.template.cjs +6 -14
- package/unbundled/slider.template.js +6 -14
- package/unbundled/slottable-request.cjs +2 -6
- package/unbundled/slottable-request.js +2 -6
- package/unbundled/text-field.cjs +1 -1
- package/unbundled/text-field.js +1 -1
- package/unbundled/time-selection-picker.template.cjs +27 -79
- package/unbundled/time-selection-picker.template.js +27 -79
- package/unbundled/trapped-focus.cjs +1 -3
- package/unbundled/trapped-focus.js +1 -3
- package/unbundled/vivid-element.cjs +7 -19
- package/unbundled/vivid-element.js +7 -19
- package/unbundled/with-contextual-help.cjs +4 -13
- package/unbundled/with-contextual-help.js +4 -13
- package/unbundled/with-error-text.cjs +2 -6
- package/unbundled/with-error-text.js +2 -6
- package/unbundled/with-success-text.cjs +1 -3
- package/unbundled/with-success-text.js +1 -3
- package/video-player/index.cjs +3 -3
- package/video-player/index.js +5 -5
- package/visually-hidden/definition.cjs +1 -1
- package/visually-hidden/definition.js +1 -1
- package/shared/color-picker/index.d.ts +0 -3
- package/shared/foundation/button/index.d.ts +0 -2
- package/shared/patterns/char-count/index.d.ts +0 -1
- package/shared/patterns/form-elements/index.d.ts +0 -4
- package/shared/patterns/index.d.ts +0 -7
|
@@ -44,9 +44,7 @@ var Tag = class extends Localized(DelegatesAria(AffixIcon(VividElement))) {
|
|
|
44
44
|
this.parentElement?.removeChild(this);
|
|
45
45
|
}
|
|
46
46
|
#select;
|
|
47
|
-
/**
|
|
48
|
-
* @internal
|
|
49
|
-
*/
|
|
47
|
+
/** @internal */
|
|
50
48
|
handleKeydown(e) {
|
|
51
49
|
if (e.key === "Enter" || e.key === " ") {
|
|
52
50
|
e.preventDefault();
|
|
@@ -58,9 +56,7 @@ var Tag = class extends Localized(DelegatesAria(AffixIcon(VividElement))) {
|
|
|
58
56
|
}
|
|
59
57
|
return true;
|
|
60
58
|
}
|
|
61
|
-
/**
|
|
62
|
-
* @internal
|
|
63
|
-
*/
|
|
59
|
+
/** @internal */
|
|
64
60
|
handleClick() {
|
|
65
61
|
this.#select();
|
|
66
62
|
}
|
|
@@ -75,10 +71,10 @@ __decorate([attr({ mode: "boolean" })], Tag.prototype, "selectable", void 0);
|
|
|
75
71
|
__decorate([attr({ mode: "boolean" })], Tag.prototype, "selected", void 0);
|
|
76
72
|
//#endregion
|
|
77
73
|
//#region src/lib/tag/tag.scss?inline
|
|
78
|
-
var tag_default = ".base.connotation-cta{--_connotation-color-primary:var(--vvd-tag-cta-primary,var(--vvd-color-cta-500));--_connotation-color-primary-text:var(--vvd-tag-cta-primary-text,var(--vvd-color-canvas));--_connotation-color-soft:var(--vvd-tag-cta-soft,var(--vvd-color-cta-100));--_connotation-color-contrast:var(--vvd-tag-cta-contrast,var(--vvd-color-cta-800));--_connotation-color-pale:var(--vvd-tag-cta-pale,var(--vvd-color-cta-300));--_connotation-color-fierce:var(--vvd-tag-cta-fierce,var(--vvd-color-cta-700));--_connotation-color-firm:var(--vvd-tag-cta-firm,var(--vvd-color-cta-600));--_connotation-color-firm-all:var(--vvd-tag-cta-firm-all,var(--vvd-color-cta-600));--_connotation-color-faint:var(--vvd-tag-cta-faint,var(--vvd-color-cta-50));--_connotation-color-dim:var(--vvd-tag-cta-dim,var(--vvd-color-cta-200))}.base.connotation-success{--_connotation-color-primary:var(--vvd-tag-success-primary,var(--vvd-color-success-500));--_connotation-color-primary-text:var(--vvd-tag-success-primary-text,var(--vvd-color-canvas));--_connotation-color-soft:var(--vvd-tag-success-soft,var(--vvd-color-success-100));--_connotation-color-contrast:var(--vvd-tag-success-contrast,var(--vvd-color-success-800));--_connotation-color-pale:var(--vvd-tag-success-pale,var(--vvd-color-success-300));--_connotation-color-fierce:var(--vvd-tag-success-fierce,var(--vvd-color-success-700));--_connotation-color-firm:var(--vvd-tag-success-firm,var(--vvd-color-success-600));--_connotation-color-firm-all:var(--vvd-tag-success-firm-all,var(--vvd-color-success-600));--_connotation-color-faint:var(--vvd-tag-success-faint,var(--vvd-color-success-50));--_connotation-color-dim:var(--vvd-tag-success-dim,var(--vvd-color-success-200))}.base.connotation-alert{--_connotation-color-primary:var(--vvd-tag-alert-primary,var(--vvd-color-alert-500));--_connotation-color-primary-text:var(--vvd-tag-alert-primary-text,var(--vvd-color-canvas));--_connotation-color-soft:var(--vvd-tag-alert-soft,var(--vvd-color-alert-100));--_connotation-color-contrast:var(--vvd-tag-alert-contrast,var(--vvd-color-alert-800));--_connotation-color-pale:var(--vvd-tag-alert-pale,var(--vvd-color-alert-300));--_connotation-color-fierce:var(--vvd-tag-alert-fierce,var(--vvd-color-alert-700));--_connotation-color-firm:var(--vvd-tag-alert-firm,var(--vvd-color-alert-600));--_connotation-color-firm-all:var(--vvd-tag-alert-firm-all,var(--vvd-color-alert-600));--_connotation-color-faint:var(--vvd-tag-alert-faint,var(--vvd-color-alert-50));--_connotation-color-dim:var(--vvd-tag-alert-dim,var(--vvd-color-alert-200))}.base.connotation-warning{--_connotation-color-primary:var(--vvd-tag-warning-primary,var(--vvd-color-warning-300));--_connotation-color-primary-text:var(--vvd-tag-warning-primary-text,var(--vvd-color-canvas-text));--_connotation-color-soft:var(--vvd-tag-warning-soft,var(--vvd-color-warning-100));--_connotation-color-contrast:var(--vvd-tag-warning-contrast,var(--vvd-color-warning-800));--_connotation-color-pale:var(--vvd-tag-warning-pale,var(--vvd-color-warning-300));--_connotation-color-fierce:var(--vvd-tag-warning-fierce,var(--vvd-color-warning-700));--_connotation-color-firm:var(--vvd-tag-warning-firm,var(--vvd-color-warning-600));--_connotation-color-firm-all:var(--vvd-tag-warning-firm-all,var(--vvd-color-warning-600));--_connotation-color-faint:var(--vvd-tag-warning-faint,var(--vvd-color-warning-50));--_connotation-color-dim:var(--vvd-tag-warning-dim,var(--vvd-color-warning-200))}.base.connotation-information{--_connotation-color-primary:var(--vvd-tag-information-primary,var(--vvd-color-information-500));--_connotation-color-primary-text:var(--vvd-tag-information-primary-text,var(--vvd-color-canvas));--_connotation-color-soft:var(--vvd-tag-information-soft,var(--vvd-color-information-100));--_connotation-color-contrast:var(--vvd-tag-information-contrast,var(--vvd-color-information-800));--_connotation-color-pale:var(--vvd-tag-information-pale,var(--vvd-color-information-300));--_connotation-color-fierce:var(--vvd-tag-information-fierce,var(--vvd-color-information-700));--_connotation-color-firm:var(--vvd-tag-information-firm,var(--vvd-color-information-600));--_connotation-color-firm-all:var(--vvd-tag-information-firm-all,var(--vvd-color-information-600));--_connotation-color-faint:var(--vvd-tag-information-faint,var(--vvd-color-information-50));--_connotation-color-dim:var(--vvd-tag-information-dim,var(--vvd-color-information-200))}.base.connotation-announcement{--_connotation-color-primary:var(--vvd-tag-announcement-primary,var(--vvd-color-announcement-500));--_connotation-color-primary-text:var(--vvd-tag-announcement-primary-text,var(--vvd-color-canvas));--_connotation-color-soft:var(--vvd-tag-announcement-soft,var(--vvd-color-announcement-100));--_connotation-color-contrast:var(--vvd-tag-announcement-contrast,var(--vvd-color-announcement-800));--_connotation-color-pale:var(--vvd-tag-announcement-pale,var(--vvd-color-announcement-300));--_connotation-color-fierce:var(--vvd-tag-announcement-fierce,var(--vvd-color-announcement-700));--_connotation-color-firm:var(--vvd-tag-announcement-firm,var(--vvd-color-announcement-600));--_connotation-color-firm-all:var(--vvd-tag-announcement-firm-all,var(--vvd-color-announcement-600));--_connotation-color-faint:var(--vvd-tag-announcement-faint,var(--vvd-color-announcement-50));--_connotation-color-dim:var(--vvd-tag-announcement-dim,var(--vvd-color-announcement-200))}.base:not(.connotation-cta,.connotation-success,.connotation-alert,.connotation-warning,.connotation-information,.connotation-announcement){--_connotation-color-primary:var(--vvd-tag-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-tag-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-soft:var(--vvd-tag-accent-soft,var(--vvd-color-neutral-100));--_connotation-color-contrast:var(--vvd-tag-accent-contrast,var(--vvd-color-neutral-800));--_connotation-color-pale:var(--vvd-tag-accent-pale,var(--vvd-color-neutral-300));--_connotation-color-fierce:var(--vvd-tag-accent-fierce,var(--vvd-color-neutral-700));--_connotation-color-firm:var(--vvd-tag-accent-firm,var(--vvd-color-canvas-text));--_connotation-color-firm-all:var(--vvd-tag-accent-firm-all,var(--vvd-color-neutral-600));--_connotation-color-faint:var(--vvd-tag-accent-faint,var(--vvd-color-neutral-50));--_connotation-color-dim:var(--vvd-tag-accent-dim,var(--vvd-color-neutral-200))}.base{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.base.appearance-duotone{--_appearance-color-text:var(--_connotation-color-firm-all);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--_connotation-color-pale)}.base.appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in srgb, var(--_connotation-color-primary), transparent 85%);--_appearance-color-outline:transparent}@media (hover:hover){.base:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-dim);--_appearance-color-outline:transparent}.base:hover:where(:not(.disabled,:disabled,.readonly)).appearance-duotone{--_appearance-color-text:var(--_connotation-color-firm-all);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--_connotation-color-firm-all)}.base:hover:where(:not(.disabled,:disabled,.readonly)).appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in srgb, var(--_connotation-color-primary), transparent 75%);--_appearance-color-outline:transparent}}.base.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-dim);--_appearance-color-outline:transparent}.base.hover:where(:not(.disabled,:disabled,.readonly)).appearance-duotone{--_appearance-color-text:var(--_connotation-color-firm-all);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--_connotation-color-firm-all)}.base.hover:where(:not(.disabled,:disabled,.readonly)).appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in srgb, var(--_connotation-color-primary), transparent 75%);--_appearance-color-outline:transparent}.base:active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-pale);--_appearance-color-outline:transparent}.base:active:where(:not(.disabled,:disabled)).appearance-duotone{--_appearance-color-text:var(--_connotation-color-firm-all);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:var(--_connotation-color-pale)}.base:active:where(:not(.disabled,:disabled)).appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in srgb, var(--_connotation-color-primary), transparent 65%);--_appearance-color-outline:transparent}.base.active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-pale);--_appearance-color-outline:transparent}.base.active:where(:not(.disabled,:disabled)).appearance-duotone{--_appearance-color-text:var(--_connotation-color-firm-all);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:var(--_connotation-color-pale)}.base.active:where(:not(.disabled,:disabled)).appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in srgb, var(--_connotation-color-primary), transparent 65%);--_appearance-color-outline:transparent}.base:disabled{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:transparent}.base:disabled.appearance-duotone{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-100)}.base:disabled.appearance-subtle-light,.base.disabled{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:transparent}.base.disabled.appearance-duotone{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-100)}.base.disabled.appearance-subtle-light{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:transparent}.base.selected:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary);--_appearance-color-outline:transparent}.base.selected:where(:not(.disabled,:disabled)).appearance-duotone{--_appearance-color-text:var(--_connotation-color-firm-all);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:var(--_connotation-color-pale)}.base.selected:where(:not(.disabled,:disabled)).appearance-subtle-light{--_appearance-color-text:var(--vvd-color-canvas);--_appearance-color-fill:var(--_connotation-color-firm);--_appearance-color-outline:transparent}.base{--tag-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16));box-sizing:border-box;background-color:var(--_appearance-color-fill);block-size:var(--tag-block-size);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);color:var(--_appearance-color-text);font:var(--vvd-typography-base-bold);vertical-align:middle;border:none;align-items:center;column-gap:8px;max-inline-size:100%;padding-inline:8px;display:inline-flex;position:relative}.base:not(.shape-pill){border-radius:4px}.base.shape-pill{border-radius:16px}.base:focus-visible{--focus-stroke-gap-color:transparent;box-shadow:0 0 0 4px color-mix(in srgb, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px))}@supports (user-select:none){.base{user-select:none}}.base:not(.disabled){cursor:pointer}.base.disabled{cursor:not-allowed;pointer-events:none}.base.removable{cursor:auto;padding-inline:8px 1px}.label{text-overflow:ellipsis;white-space:nowrap;max-inline-size:100%;overflow:hidden}slot[name=icon]{font-size:calc(var(--tag-block-size) / 1.5);line-height:1}.dismiss-button{border-radius:inherit;background-color:var(--_appearance-color-fill);cursor:pointer;border:none;align-items:center;padding:4px;display:flex;position:relative;inset-inline-start:-4px}.dismiss-button:focus-visible{--focus-stroke-gap-color:transparent;box-shadow:0 0 0 4px color-mix(in srgb, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px))}";
|
|
74
|
+
var tag_default = ".base.connotation-cta{--_connotation-color-primary:var(--vvd-tag-cta-primary,var(--vvd-color-cta-500));--_connotation-color-primary-text:var(--vvd-tag-cta-primary-text,var(--vvd-color-canvas));--_connotation-color-soft:var(--vvd-tag-cta-soft,var(--vvd-color-cta-100));--_connotation-color-contrast:var(--vvd-tag-cta-contrast,var(--vvd-color-cta-800));--_connotation-color-pale:var(--vvd-tag-cta-pale,var(--vvd-color-cta-300));--_connotation-color-fierce:var(--vvd-tag-cta-fierce,var(--vvd-color-cta-700));--_connotation-color-firm:var(--vvd-tag-cta-firm,var(--vvd-color-cta-600));--_connotation-color-firm-all:var(--vvd-tag-cta-firm-all,var(--vvd-color-cta-600));--_connotation-color-faint:var(--vvd-tag-cta-faint,var(--vvd-color-cta-50));--_connotation-color-dim:var(--vvd-tag-cta-dim,var(--vvd-color-cta-200))}.base.connotation-success{--_connotation-color-primary:var(--vvd-tag-success-primary,var(--vvd-color-success-500));--_connotation-color-primary-text:var(--vvd-tag-success-primary-text,var(--vvd-color-canvas));--_connotation-color-soft:var(--vvd-tag-success-soft,var(--vvd-color-success-100));--_connotation-color-contrast:var(--vvd-tag-success-contrast,var(--vvd-color-success-800));--_connotation-color-pale:var(--vvd-tag-success-pale,var(--vvd-color-success-300));--_connotation-color-fierce:var(--vvd-tag-success-fierce,var(--vvd-color-success-700));--_connotation-color-firm:var(--vvd-tag-success-firm,var(--vvd-color-success-600));--_connotation-color-firm-all:var(--vvd-tag-success-firm-all,var(--vvd-color-success-600));--_connotation-color-faint:var(--vvd-tag-success-faint,var(--vvd-color-success-50));--_connotation-color-dim:var(--vvd-tag-success-dim,var(--vvd-color-success-200))}.base.connotation-alert{--_connotation-color-primary:var(--vvd-tag-alert-primary,var(--vvd-color-alert-500));--_connotation-color-primary-text:var(--vvd-tag-alert-primary-text,var(--vvd-color-canvas));--_connotation-color-soft:var(--vvd-tag-alert-soft,var(--vvd-color-alert-100));--_connotation-color-contrast:var(--vvd-tag-alert-contrast,var(--vvd-color-alert-800));--_connotation-color-pale:var(--vvd-tag-alert-pale,var(--vvd-color-alert-300));--_connotation-color-fierce:var(--vvd-tag-alert-fierce,var(--vvd-color-alert-700));--_connotation-color-firm:var(--vvd-tag-alert-firm,var(--vvd-color-alert-600));--_connotation-color-firm-all:var(--vvd-tag-alert-firm-all,var(--vvd-color-alert-600));--_connotation-color-faint:var(--vvd-tag-alert-faint,var(--vvd-color-alert-50));--_connotation-color-dim:var(--vvd-tag-alert-dim,var(--vvd-color-alert-200))}.base.connotation-warning{--_connotation-color-primary:var(--vvd-tag-warning-primary,var(--vvd-color-warning-300));--_connotation-color-primary-text:var(--vvd-tag-warning-primary-text,var(--vvd-color-canvas-text));--_connotation-color-soft:var(--vvd-tag-warning-soft,var(--vvd-color-warning-100));--_connotation-color-contrast:var(--vvd-tag-warning-contrast,var(--vvd-color-warning-800));--_connotation-color-pale:var(--vvd-tag-warning-pale,var(--vvd-color-warning-300));--_connotation-color-fierce:var(--vvd-tag-warning-fierce,var(--vvd-color-warning-700));--_connotation-color-firm:var(--vvd-tag-warning-firm,var(--vvd-color-warning-600));--_connotation-color-firm-all:var(--vvd-tag-warning-firm-all,var(--vvd-color-warning-600));--_connotation-color-faint:var(--vvd-tag-warning-faint,var(--vvd-color-warning-50));--_connotation-color-dim:var(--vvd-tag-warning-dim,var(--vvd-color-warning-200))}.base.connotation-information{--_connotation-color-primary:var(--vvd-tag-information-primary,var(--vvd-color-information-500));--_connotation-color-primary-text:var(--vvd-tag-information-primary-text,var(--vvd-color-canvas));--_connotation-color-soft:var(--vvd-tag-information-soft,var(--vvd-color-information-100));--_connotation-color-contrast:var(--vvd-tag-information-contrast,var(--vvd-color-information-800));--_connotation-color-pale:var(--vvd-tag-information-pale,var(--vvd-color-information-300));--_connotation-color-fierce:var(--vvd-tag-information-fierce,var(--vvd-color-information-700));--_connotation-color-firm:var(--vvd-tag-information-firm,var(--vvd-color-information-600));--_connotation-color-firm-all:var(--vvd-tag-information-firm-all,var(--vvd-color-information-600));--_connotation-color-faint:var(--vvd-tag-information-faint,var(--vvd-color-information-50));--_connotation-color-dim:var(--vvd-tag-information-dim,var(--vvd-color-information-200))}.base.connotation-announcement{--_connotation-color-primary:var(--vvd-tag-announcement-primary,var(--vvd-color-announcement-500));--_connotation-color-primary-text:var(--vvd-tag-announcement-primary-text,var(--vvd-color-canvas));--_connotation-color-soft:var(--vvd-tag-announcement-soft,var(--vvd-color-announcement-100));--_connotation-color-contrast:var(--vvd-tag-announcement-contrast,var(--vvd-color-announcement-800));--_connotation-color-pale:var(--vvd-tag-announcement-pale,var(--vvd-color-announcement-300));--_connotation-color-fierce:var(--vvd-tag-announcement-fierce,var(--vvd-color-announcement-700));--_connotation-color-firm:var(--vvd-tag-announcement-firm,var(--vvd-color-announcement-600));--_connotation-color-firm-all:var(--vvd-tag-announcement-firm-all,var(--vvd-color-announcement-600));--_connotation-color-faint:var(--vvd-tag-announcement-faint,var(--vvd-color-announcement-50));--_connotation-color-dim:var(--vvd-tag-announcement-dim,var(--vvd-color-announcement-200))}.base:not(.connotation-cta,.connotation-success,.connotation-alert,.connotation-warning,.connotation-information,.connotation-announcement){--_connotation-color-primary:var(--vvd-tag-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-tag-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-soft:var(--vvd-tag-accent-soft,var(--vvd-color-neutral-100));--_connotation-color-contrast:var(--vvd-tag-accent-contrast,var(--vvd-color-neutral-800));--_connotation-color-pale:var(--vvd-tag-accent-pale,var(--vvd-color-neutral-300));--_connotation-color-fierce:var(--vvd-tag-accent-fierce,var(--vvd-color-neutral-700));--_connotation-color-firm:var(--vvd-tag-accent-firm,var(--vvd-color-canvas-text));--_connotation-color-firm-all:var(--vvd-tag-accent-firm-all,var(--vvd-color-neutral-600));--_connotation-color-faint:var(--vvd-tag-accent-faint,var(--vvd-color-neutral-50));--_connotation-color-dim:var(--vvd-tag-accent-dim,var(--vvd-color-neutral-200))}.base{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.base.appearance-duotone{--_appearance-color-text:var(--_connotation-color-firm-all);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--_connotation-color-pale)}.base.appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 85%);--_appearance-color-outline:transparent}@media (hover:hover){.base:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-dim);--_appearance-color-outline:transparent}.base:hover:where(:not(.disabled,:disabled,.readonly)).appearance-duotone{--_appearance-color-text:var(--_connotation-color-firm-all);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--_connotation-color-firm-all)}.base:hover:where(:not(.disabled,:disabled,.readonly)).appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 75%);--_appearance-color-outline:transparent}}.base.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-dim);--_appearance-color-outline:transparent}.base.hover:where(:not(.disabled,:disabled,.readonly)).appearance-duotone{--_appearance-color-text:var(--_connotation-color-firm-all);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--_connotation-color-firm-all)}.base.hover:where(:not(.disabled,:disabled,.readonly)).appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 75%);--_appearance-color-outline:transparent}.base:active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-pale);--_appearance-color-outline:transparent}.base:active:where(:not(.disabled,:disabled)).appearance-duotone{--_appearance-color-text:var(--_connotation-color-firm-all);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:var(--_connotation-color-pale)}.base:active:where(:not(.disabled,:disabled)).appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 65%);--_appearance-color-outline:transparent}.base.active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:var(--_connotation-color-pale);--_appearance-color-outline:transparent}.base.active:where(:not(.disabled,:disabled)).appearance-duotone{--_appearance-color-text:var(--_connotation-color-firm-all);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:var(--_connotation-color-pale)}.base.active:where(:not(.disabled,:disabled)).appearance-subtle-light{--_appearance-color-text:var(--_connotation-color-contrast);--_appearance-color-fill:color-mix(in sRGB, var(--_connotation-color-primary), transparent 65%);--_appearance-color-outline:transparent}.base:disabled{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:transparent}.base:disabled.appearance-duotone{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-100)}.base:disabled.appearance-subtle-light,.base.disabled{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:transparent}.base.disabled.appearance-duotone{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:var(--vvd-color-neutral-100)}.base.disabled.appearance-subtle-light{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:var(--vvd-color-neutral-100);--_appearance-color-outline:transparent}.base.selected:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary);--_appearance-color-outline:transparent}.base.selected:where(:not(.disabled,:disabled)).appearance-duotone{--_appearance-color-text:var(--_connotation-color-firm-all);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:var(--_connotation-color-pale)}.base.selected:where(:not(.disabled,:disabled)).appearance-subtle-light{--_appearance-color-text:var(--vvd-color-canvas);--_appearance-color-fill:var(--_connotation-color-firm);--_appearance-color-outline:transparent}.base{--tag-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 16));box-sizing:border-box;background-color:var(--_appearance-color-fill);block-size:var(--tag-block-size);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);color:var(--_appearance-color-text);font:var(--vvd-typography-base-bold);vertical-align:middle;border:none;align-items:center;column-gap:8px;max-inline-size:100%;padding-inline:8px;display:inline-flex;position:relative}.base:not(.shape-pill){border-radius:4px}.base.shape-pill{border-radius:16px}.base:focus-visible{--focus-stroke-gap-color:transparent;box-shadow:0 0 0 4px color-mix(in sRGB, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px))}.base{user-select:none}.base:not(.disabled){cursor:pointer}.base.disabled{cursor:not-allowed;pointer-events:none}.base.removable{cursor:auto;padding-inline:8px 1px}.label{text-overflow:ellipsis;white-space:nowrap;max-inline-size:100%;overflow:hidden}slot[name=icon]{font-size:calc(var(--tag-block-size) / 1.5);line-height:1}.dismiss-button{border-radius:inherit;background-color:var(--_appearance-color-fill);cursor:pointer;border:none;align-items:center;padding:4px;display:flex;position:relative;inset-inline-start:-4px}.dismiss-button:focus-visible{--focus-stroke-gap-color:transparent;box-shadow:0 0 0 4px color-mix(in sRGB, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px))}";
|
|
79
75
|
//#endregion
|
|
80
76
|
//#region src/lib/tag/tag.template.ts
|
|
81
|
-
var getClasses = (
|
|
77
|
+
var getClasses = (x) => classNames("base", ["disabled", x.disabled], ["selectable", x.selectable], ["selected", x.selectable && x.selected], ["removable", x.removable && !x.selectable], [`connotation-${x.connotation}`, Boolean(x.connotation)], [`appearance-${x.appearance}`, Boolean(x.appearance)], [`shape-${x.shape}`, Boolean(x.shape)]);
|
|
82
78
|
function renderDismissButton(iconTag) {
|
|
83
79
|
return html`
|
|
84
80
|
<button
|
|
@@ -121,9 +117,7 @@ var tagTemplate = (context) => {
|
|
|
121
117
|
};
|
|
122
118
|
//#endregion
|
|
123
119
|
//#region src/lib/tag/definition.ts
|
|
124
|
-
/**
|
|
125
|
-
* @internal
|
|
126
|
-
*/
|
|
120
|
+
/** @internal */
|
|
127
121
|
var tagDefinition = defineVividComponent("tag", Tag, tagTemplate, [iconDefinition], {
|
|
128
122
|
styles: tag_default,
|
|
129
123
|
shadowOptions: { delegatesFocus: true }
|
|
@@ -3,23 +3,21 @@ const require_vivid_element = require("./vivid-element.cjs");
|
|
|
3
3
|
const require_decorate = require("./decorate.cjs");
|
|
4
4
|
const require_delegates_aria = require("./delegates-aria.cjs");
|
|
5
5
|
const require_form_associated = require("./form-associated.cjs");
|
|
6
|
+
const require_definition = require("./definition22.cjs");
|
|
7
|
+
const require_mixins = require("./mixins.cjs");
|
|
6
8
|
const require_form_element = require("./form-element.cjs");
|
|
7
|
-
const require_with_success_text = require("./with-success-text.cjs");
|
|
8
9
|
const require_with_error_text = require("./with-error-text.cjs");
|
|
9
|
-
const
|
|
10
|
-
const require_definition = require("./definition6.cjs");
|
|
11
|
-
const require_char_count = require("./char-count.cjs");
|
|
12
|
-
const require_mixins = require("./mixins.cjs");
|
|
10
|
+
const require_with_success_text = require("./with-success-text.cjs");
|
|
13
11
|
const require_definition$1 = require("./definition25.cjs");
|
|
12
|
+
const require_char_count = require("./char-count.cjs");
|
|
13
|
+
const require_with_contextual_help = require("./with-contextual-help.cjs");
|
|
14
14
|
let _microsoft_fast_element = require("@microsoft/fast-element");
|
|
15
15
|
let _microsoft_fast_web_utilities = require("@microsoft/fast-web-utilities");
|
|
16
16
|
//#region src/lib/text-area/text-area.scss?inline
|
|
17
|
-
var text_area_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:
|
|
17
|
+
var text_area_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-success{--_connotation-color-primary:var(--vvd-text-area-success-primary,var(--vvd-color-success-500));--_connotation-color-primary-text:var(--vvd-text-area-success-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-text-area-success-primary-increment,var(--vvd-color-success-600));--_connotation-color-intermediate:var(--vvd-text-area-success-intermediate,var(--vvd-color-success-500));--_connotation-color-firm:var(--vvd-text-area-success-firm,var(--vvd-color-success-600));--_connotation-color-fierce:var(--vvd-text-area-success-fierce,var(--vvd-color-success-700));--_connotation-color-faint:var(--vvd-text-area-success-faint,var(--vvd-color-success-50));--_connotation-color-soft:var(--vvd-text-area-success-soft,var(--vvd-color-success-100))}.base.connotation-alert{--_connotation-color-primary:var(--vvd-text-area-alert-primary,var(--vvd-color-alert-500));--_connotation-color-primary-text:var(--vvd-text-area-alert-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-text-area-alert-primary-increment,var(--vvd-color-alert-600));--_connotation-color-intermediate:var(--vvd-text-area-alert-intermediate,var(--vvd-color-alert-500));--_connotation-color-firm:var(--vvd-text-area-alert-firm,var(--vvd-color-alert-600));--_connotation-color-fierce:var(--vvd-text-area-alert-fierce,var(--vvd-color-alert-700));--_connotation-color-faint:var(--vvd-text-area-alert-faint,var(--vvd-color-alert-50));--_connotation-color-soft:var(--vvd-text-area-alert-soft,var(--vvd-color-alert-100))}.base:not(.connotation-success,.connotation-alert){--_connotation-color-primary:var(--vvd-text-area-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-text-area-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-text-area-accent-primary-increment,var(--vvd-color-neutral-800));--_connotation-color-intermediate:var(--vvd-text-area-accent-intermediate,var(--vvd-color-neutral-500));--_connotation-color-firm:var(--vvd-text-area-accent-firm,var(--vvd-color-canvas-text));--_connotation-color-fierce:var(--vvd-text-area-accent-fierce,var(--vvd-color-neutral-700));--_connotation-color-faint:var(--vvd-text-area-accent-faint,var(--vvd-color-neutral-50));--_connotation-color-soft:var(--vvd-text-area-accent-soft,var(--vvd-color-neutral-100))}.base{user-select:none;grid-template-columns:1fr max-content;row-gap:4px;inline-size:100%;display:inline-grid}.base:not(.disabled){--_low-ink-color:var(--vvd-color-neutral-600)}.base.disabled{--_low-ink-color:var(--_appearance-color-text);cursor:not-allowed}.label{color:var(--vvd-color-canvas-text);font:var(--vvd-typography-base);line-height:20px}.label-wrapper{grid-area:1/1/auto/2}.char-count{color:var(--_low-ink-color);font:var(--vvd-typography-base);grid-column:2/-1}.control{--scrollbar-track-color:transparent;--scrollbar-thumb-color:color-mix(in sRGB, var(--vvd-color-neutral-950), transparent 70%);scrollbar-color:var(--scrollbar-thumb-color) var(--scrollbar-track-color);scrollbar-width:thin}.control ::-webkit-scrollbar{width:4px}.control ::-webkit-scrollbar-track{background:var(--scrollbar-track-color)}.control ::-webkit-scrollbar-thumb{background-color:var(--scrollbar-fallback-track-color,var(--scrollbar-thumb-color));border:0;border-radius:4px}.control{box-sizing:border-box;appearance:none;background-color:var(--_appearance-color-fill);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);color:var(--_appearance-color-text);font:var(--vvd-typography-base);min-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8));resize:none;border:0;border-radius:8px;grid-column:1/-1;padding:8px 16px;transition:box-shadow .2s,background-color .2s,color .2s}@supports selector(::-webkit-resizer){.control::-webkit-resizer{background-image:linear-gradient(315deg, transparent 0, transparent 2px, var(--vvd-color-canvas-text) 2px, var(--vvd-color-canvas-text) 3px, transparent 3px, transparent 5px, var(--vvd-color-canvas-text) 5px, var(--vvd-color-canvas-text) 6px, transparent 6px, transparent 8px, transparent 100%);background-repeat:no-repeat;background-size:10px 10px;block-size:10px;inline-size:10px}}.control:disabled{opacity:1;pointer-events:none;-webkit-text-fill-color:var(--_appearance-color-text)}.control::placeholder,.control:disabled::placeholder{opacity:1;pointer-events:none;-webkit-text-fill-color:var(--_low-ink-color)}.control:focus-visible{--focus-stroke-gap-color:transparent;box-shadow:0 0 0 4px color-mix(in sRGB, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px))}:host([resize=both]) .control{resize:both}:host([resize=horizontal]) .control{resize:horizontal}:host([resize=vertical]) .control{resize:vertical}";
|
|
18
18
|
//#endregion
|
|
19
19
|
//#region src/shared/utils/Reflector.ts
|
|
20
|
-
/**
|
|
21
|
-
* Reflects observable properties of the source object to the target, either as attributes or as properties.
|
|
22
|
-
*/
|
|
20
|
+
/** Reflects observable properties of the source object to the target, either as attributes or as properties. */
|
|
23
21
|
var Reflector = class {
|
|
24
22
|
#reflectedProperties = /* @__PURE__ */ new Map();
|
|
25
23
|
#source;
|
|
@@ -76,26 +74,15 @@ var Reflector = class {
|
|
|
76
74
|
};
|
|
77
75
|
//#endregion
|
|
78
76
|
//#region src/lib/text-area/text-area.ts
|
|
79
|
-
/**
|
|
80
|
-
* Resize mode for a TextArea
|
|
81
|
-
* @public
|
|
82
|
-
*/
|
|
77
|
+
/** Resize mode for a TextArea */
|
|
83
78
|
var TextAreaResize = {
|
|
84
|
-
/**
|
|
85
|
-
* No resize.
|
|
86
|
-
*/
|
|
79
|
+
/** No resize. */
|
|
87
80
|
none: "none",
|
|
88
|
-
/**
|
|
89
|
-
* Resize vertically and horizontally.
|
|
90
|
-
*/
|
|
81
|
+
/** Resize vertically and horizontally. */
|
|
91
82
|
both: "both",
|
|
92
|
-
/**
|
|
93
|
-
* Resize horizontally.
|
|
94
|
-
*/
|
|
83
|
+
/** Resize horizontally. */
|
|
95
84
|
horizontal: "horizontal",
|
|
96
|
-
/**
|
|
97
|
-
* Resize vertically.
|
|
98
|
-
*/
|
|
85
|
+
/** Resize vertically. */
|
|
99
86
|
vertical: "vertical"
|
|
100
87
|
};
|
|
101
88
|
/**
|
|
@@ -119,59 +106,41 @@ var TextArea = class extends require_with_contextual_help.WithContextualHelp(req
|
|
|
119
106
|
this.value = this.control.value;
|
|
120
107
|
};
|
|
121
108
|
}
|
|
122
|
-
/**
|
|
123
|
-
* @internal
|
|
124
|
-
*/
|
|
109
|
+
/** @internal */
|
|
125
110
|
readOnlyChanged() {
|
|
126
111
|
/* v8 ignore if -- @preserve */
|
|
127
112
|
if (this.proxy instanceof HTMLTextAreaElement) this.proxy.readOnly = this.readOnly;
|
|
128
113
|
}
|
|
129
|
-
/**
|
|
130
|
-
* @internal
|
|
131
|
-
*/
|
|
114
|
+
/** @internal */
|
|
132
115
|
autofocusChanged() {
|
|
133
116
|
/* v8 ignore if -- @preserve */
|
|
134
117
|
if (this.proxy instanceof HTMLTextAreaElement) this.proxy.autofocus = this.autofocus;
|
|
135
118
|
}
|
|
136
|
-
/**
|
|
137
|
-
* @internal
|
|
138
|
-
*/
|
|
119
|
+
/** @internal */
|
|
139
120
|
listChanged() {
|
|
140
121
|
/* v8 ignore if -- @preserve */
|
|
141
122
|
if (this.proxy instanceof HTMLTextAreaElement) this.proxy.setAttribute("list", this.list);
|
|
142
123
|
}
|
|
143
|
-
/**
|
|
144
|
-
* @internal
|
|
145
|
-
*/
|
|
124
|
+
/** @internal */
|
|
146
125
|
maxlengthChanged() {
|
|
147
126
|
/* v8 ignore if -- @preserve */
|
|
148
127
|
if (this.proxy instanceof HTMLTextAreaElement) this.proxy.maxLength = this.maxlength;
|
|
149
128
|
}
|
|
150
|
-
/**
|
|
151
|
-
* @internal
|
|
152
|
-
*/
|
|
129
|
+
/** @internal */
|
|
153
130
|
minlengthChanged() {
|
|
154
131
|
/* v8 ignore if -- @preserve */
|
|
155
132
|
if (this.proxy instanceof HTMLTextAreaElement) this.proxy.minLength = this.minlength;
|
|
156
133
|
}
|
|
157
|
-
/**
|
|
158
|
-
* @internal
|
|
159
|
-
*/
|
|
134
|
+
/** @internal */
|
|
160
135
|
spellcheckChanged() {
|
|
161
136
|
/* v8 ignore if -- @preserve */
|
|
162
137
|
if (this.proxy instanceof HTMLTextAreaElement) this.proxy.spellcheck = this.spellcheck;
|
|
163
138
|
}
|
|
164
|
-
/**
|
|
165
|
-
* Selects all the text in the text area
|
|
166
|
-
*
|
|
167
|
-
* @public
|
|
168
|
-
*/
|
|
139
|
+
/** Selects all the text in the text area */
|
|
169
140
|
select() {
|
|
170
141
|
this.control.select();
|
|
171
142
|
}
|
|
172
|
-
/**
|
|
173
|
-
* @internal
|
|
174
|
-
*/
|
|
143
|
+
/** @internal */
|
|
175
144
|
valueChanged(previous, next) {
|
|
176
145
|
super.valueChanged(previous, next);
|
|
177
146
|
if (this.charCount && this.maxlength) this._updateCharCountRemaining();
|
|
@@ -225,10 +194,6 @@ require_decorate.__decorate([_microsoft_fast_element.observable], TextArea.proto
|
|
|
225
194
|
require_decorate.__decorate([_microsoft_fast_element.attr], TextArea.prototype, "wrap", void 0);
|
|
226
195
|
//#endregion
|
|
227
196
|
//#region src/lib/text-area/text-area.template.ts
|
|
228
|
-
var getClasses = ({ value, errorValidationMessage, disabled, placeholder, readOnly, successText }) => (0, _microsoft_fast_web_utilities.classNames)("base", ["readonly", readOnly], ["placeholder", Boolean(placeholder)], ["disabled", disabled], ["error", Boolean(errorValidationMessage)], ["has-value", Boolean(value)], ["success", !!successText]);
|
|
229
|
-
/**
|
|
230
|
-
*
|
|
231
|
-
*/
|
|
232
197
|
function renderLabel() {
|
|
233
198
|
return _microsoft_fast_element.html` <label for="control" class="label">
|
|
234
199
|
${(x) => x.label}
|
|
@@ -236,7 +201,9 @@ function renderLabel() {
|
|
|
236
201
|
}
|
|
237
202
|
var TextAreaTemplate = (context) => {
|
|
238
203
|
return _microsoft_fast_element.html`
|
|
239
|
-
<div
|
|
204
|
+
<div
|
|
205
|
+
class="${(x) => (0, _microsoft_fast_web_utilities.classNames)("base", ["readonly", x.readOnly], ["placeholder", Boolean(x.placeholder)], ["disabled", x.disabled], ["error", Boolean(x.errorValidationMessage)], ["has-value", Boolean(x.value)], ["success", !!x.successText])}"
|
|
206
|
+
>
|
|
240
207
|
${(0, _microsoft_fast_element.when)((x) => x.charCount && x.maxlength, (x) => x._getCharCountTemplate(context))}
|
|
241
208
|
<div
|
|
242
209
|
class="label-wrapper"
|
|
@@ -276,9 +243,7 @@ var TextAreaTemplate = (context) => {
|
|
|
276
243
|
};
|
|
277
244
|
//#endregion
|
|
278
245
|
//#region src/lib/text-area/definition.ts
|
|
279
|
-
/**
|
|
280
|
-
* @internal
|
|
281
|
-
*/
|
|
246
|
+
/** @internal */
|
|
282
247
|
var textAreaDefinition = require_vivid_element.defineVividComponent("text-area", TextArea, TextAreaTemplate, [
|
|
283
248
|
require_mixins.feedbackMessageDefinition,
|
|
284
249
|
require_definition.visuallyHiddenDefinition,
|
|
@@ -2,23 +2,21 @@ import { d as createRegisterFunction, t as VividElement, u as defineVividCompone
|
|
|
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 { n as FormAssociated } from "./form-associated.js";
|
|
5
|
+
import { n as visuallyHiddenDefinition } from "./definition22.js";
|
|
6
|
+
import { r as feedbackMessageDefinition, t as WithFeedback } from "./mixins.js";
|
|
5
7
|
import { t as FormElement } from "./form-element.js";
|
|
6
|
-
import { t as WithSuccessText } from "./with-success-text.js";
|
|
7
8
|
import { t as WithErrorText } from "./with-error-text.js";
|
|
8
|
-
import { t as
|
|
9
|
-
import { n as visuallyHiddenDefinition } from "./definition6.js";
|
|
10
|
-
import { t as WithCharCount } from "./char-count.js";
|
|
11
|
-
import { r as feedbackMessageDefinition, t as WithFeedback } from "./mixins.js";
|
|
9
|
+
import { t as WithSuccessText } from "./with-success-text.js";
|
|
12
10
|
import { t as contextualHelpDefinition } from "./definition25.js";
|
|
11
|
+
import { t as WithCharCount } from "./char-count.js";
|
|
12
|
+
import { t as WithContextualHelp } from "./with-contextual-help.js";
|
|
13
13
|
import { DOM, Observable, attr, html, nullableNumberConverter, observable, ref, slotted, when } from "@microsoft/fast-element";
|
|
14
14
|
import { classNames } from "@microsoft/fast-web-utilities";
|
|
15
15
|
//#region src/lib/text-area/text-area.scss?inline
|
|
16
|
-
var text_area_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:
|
|
16
|
+
var text_area_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-success{--_connotation-color-primary:var(--vvd-text-area-success-primary,var(--vvd-color-success-500));--_connotation-color-primary-text:var(--vvd-text-area-success-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-text-area-success-primary-increment,var(--vvd-color-success-600));--_connotation-color-intermediate:var(--vvd-text-area-success-intermediate,var(--vvd-color-success-500));--_connotation-color-firm:var(--vvd-text-area-success-firm,var(--vvd-color-success-600));--_connotation-color-fierce:var(--vvd-text-area-success-fierce,var(--vvd-color-success-700));--_connotation-color-faint:var(--vvd-text-area-success-faint,var(--vvd-color-success-50));--_connotation-color-soft:var(--vvd-text-area-success-soft,var(--vvd-color-success-100))}.base.connotation-alert{--_connotation-color-primary:var(--vvd-text-area-alert-primary,var(--vvd-color-alert-500));--_connotation-color-primary-text:var(--vvd-text-area-alert-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-text-area-alert-primary-increment,var(--vvd-color-alert-600));--_connotation-color-intermediate:var(--vvd-text-area-alert-intermediate,var(--vvd-color-alert-500));--_connotation-color-firm:var(--vvd-text-area-alert-firm,var(--vvd-color-alert-600));--_connotation-color-fierce:var(--vvd-text-area-alert-fierce,var(--vvd-color-alert-700));--_connotation-color-faint:var(--vvd-text-area-alert-faint,var(--vvd-color-alert-50));--_connotation-color-soft:var(--vvd-text-area-alert-soft,var(--vvd-color-alert-100))}.base:not(.connotation-success,.connotation-alert){--_connotation-color-primary:var(--vvd-text-area-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-text-area-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-text-area-accent-primary-increment,var(--vvd-color-neutral-800));--_connotation-color-intermediate:var(--vvd-text-area-accent-intermediate,var(--vvd-color-neutral-500));--_connotation-color-firm:var(--vvd-text-area-accent-firm,var(--vvd-color-canvas-text));--_connotation-color-fierce:var(--vvd-text-area-accent-fierce,var(--vvd-color-neutral-700));--_connotation-color-faint:var(--vvd-text-area-accent-faint,var(--vvd-color-neutral-50));--_connotation-color-soft:var(--vvd-text-area-accent-soft,var(--vvd-color-neutral-100))}.base{user-select:none;grid-template-columns:1fr max-content;row-gap:4px;inline-size:100%;display:inline-grid}.base:not(.disabled){--_low-ink-color:var(--vvd-color-neutral-600)}.base.disabled{--_low-ink-color:var(--_appearance-color-text);cursor:not-allowed}.label{color:var(--vvd-color-canvas-text);font:var(--vvd-typography-base);line-height:20px}.label-wrapper{grid-area:1/1/auto/2}.char-count{color:var(--_low-ink-color);font:var(--vvd-typography-base);grid-column:2/-1}.control{--scrollbar-track-color:transparent;--scrollbar-thumb-color:color-mix(in sRGB, var(--vvd-color-neutral-950), transparent 70%);scrollbar-color:var(--scrollbar-thumb-color) var(--scrollbar-track-color);scrollbar-width:thin}.control ::-webkit-scrollbar{width:4px}.control ::-webkit-scrollbar-track{background:var(--scrollbar-track-color)}.control ::-webkit-scrollbar-thumb{background-color:var(--scrollbar-fallback-track-color,var(--scrollbar-thumb-color));border:0;border-radius:4px}.control{box-sizing:border-box;appearance:none;background-color:var(--_appearance-color-fill);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);color:var(--_appearance-color-text);font:var(--vvd-typography-base);min-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) - 8));resize:none;border:0;border-radius:8px;grid-column:1/-1;padding:8px 16px;transition:box-shadow .2s,background-color .2s,color .2s}@supports selector(::-webkit-resizer){.control::-webkit-resizer{background-image:linear-gradient(315deg, transparent 0, transparent 2px, var(--vvd-color-canvas-text) 2px, var(--vvd-color-canvas-text) 3px, transparent 3px, transparent 5px, var(--vvd-color-canvas-text) 5px, var(--vvd-color-canvas-text) 6px, transparent 6px, transparent 8px, transparent 100%);background-repeat:no-repeat;background-size:10px 10px;block-size:10px;inline-size:10px}}.control:disabled{opacity:1;pointer-events:none;-webkit-text-fill-color:var(--_appearance-color-text)}.control::placeholder,.control:disabled::placeholder{opacity:1;pointer-events:none;-webkit-text-fill-color:var(--_low-ink-color)}.control:focus-visible{--focus-stroke-gap-color:transparent;box-shadow:0 0 0 4px color-mix(in sRGB, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px))}:host([resize=both]) .control{resize:both}:host([resize=horizontal]) .control{resize:horizontal}:host([resize=vertical]) .control{resize:vertical}";
|
|
17
17
|
//#endregion
|
|
18
18
|
//#region src/shared/utils/Reflector.ts
|
|
19
|
-
/**
|
|
20
|
-
* Reflects observable properties of the source object to the target, either as attributes or as properties.
|
|
21
|
-
*/
|
|
19
|
+
/** Reflects observable properties of the source object to the target, either as attributes or as properties. */
|
|
22
20
|
var Reflector = class {
|
|
23
21
|
#reflectedProperties = /* @__PURE__ */ new Map();
|
|
24
22
|
#source;
|
|
@@ -75,26 +73,15 @@ var Reflector = class {
|
|
|
75
73
|
};
|
|
76
74
|
//#endregion
|
|
77
75
|
//#region src/lib/text-area/text-area.ts
|
|
78
|
-
/**
|
|
79
|
-
* Resize mode for a TextArea
|
|
80
|
-
* @public
|
|
81
|
-
*/
|
|
76
|
+
/** Resize mode for a TextArea */
|
|
82
77
|
var TextAreaResize = {
|
|
83
|
-
/**
|
|
84
|
-
* No resize.
|
|
85
|
-
*/
|
|
78
|
+
/** No resize. */
|
|
86
79
|
none: "none",
|
|
87
|
-
/**
|
|
88
|
-
* Resize vertically and horizontally.
|
|
89
|
-
*/
|
|
80
|
+
/** Resize vertically and horizontally. */
|
|
90
81
|
both: "both",
|
|
91
|
-
/**
|
|
92
|
-
* Resize horizontally.
|
|
93
|
-
*/
|
|
82
|
+
/** Resize horizontally. */
|
|
94
83
|
horizontal: "horizontal",
|
|
95
|
-
/**
|
|
96
|
-
* Resize vertically.
|
|
97
|
-
*/
|
|
84
|
+
/** Resize vertically. */
|
|
98
85
|
vertical: "vertical"
|
|
99
86
|
};
|
|
100
87
|
/**
|
|
@@ -118,59 +105,41 @@ var TextArea = class extends WithContextualHelp(WithFeedback(WithCharCount(WithE
|
|
|
118
105
|
this.value = this.control.value;
|
|
119
106
|
};
|
|
120
107
|
}
|
|
121
|
-
/**
|
|
122
|
-
* @internal
|
|
123
|
-
*/
|
|
108
|
+
/** @internal */
|
|
124
109
|
readOnlyChanged() {
|
|
125
110
|
/* v8 ignore if -- @preserve */
|
|
126
111
|
if (this.proxy instanceof HTMLTextAreaElement) this.proxy.readOnly = this.readOnly;
|
|
127
112
|
}
|
|
128
|
-
/**
|
|
129
|
-
* @internal
|
|
130
|
-
*/
|
|
113
|
+
/** @internal */
|
|
131
114
|
autofocusChanged() {
|
|
132
115
|
/* v8 ignore if -- @preserve */
|
|
133
116
|
if (this.proxy instanceof HTMLTextAreaElement) this.proxy.autofocus = this.autofocus;
|
|
134
117
|
}
|
|
135
|
-
/**
|
|
136
|
-
* @internal
|
|
137
|
-
*/
|
|
118
|
+
/** @internal */
|
|
138
119
|
listChanged() {
|
|
139
120
|
/* v8 ignore if -- @preserve */
|
|
140
121
|
if (this.proxy instanceof HTMLTextAreaElement) this.proxy.setAttribute("list", this.list);
|
|
141
122
|
}
|
|
142
|
-
/**
|
|
143
|
-
* @internal
|
|
144
|
-
*/
|
|
123
|
+
/** @internal */
|
|
145
124
|
maxlengthChanged() {
|
|
146
125
|
/* v8 ignore if -- @preserve */
|
|
147
126
|
if (this.proxy instanceof HTMLTextAreaElement) this.proxy.maxLength = this.maxlength;
|
|
148
127
|
}
|
|
149
|
-
/**
|
|
150
|
-
* @internal
|
|
151
|
-
*/
|
|
128
|
+
/** @internal */
|
|
152
129
|
minlengthChanged() {
|
|
153
130
|
/* v8 ignore if -- @preserve */
|
|
154
131
|
if (this.proxy instanceof HTMLTextAreaElement) this.proxy.minLength = this.minlength;
|
|
155
132
|
}
|
|
156
|
-
/**
|
|
157
|
-
* @internal
|
|
158
|
-
*/
|
|
133
|
+
/** @internal */
|
|
159
134
|
spellcheckChanged() {
|
|
160
135
|
/* v8 ignore if -- @preserve */
|
|
161
136
|
if (this.proxy instanceof HTMLTextAreaElement) this.proxy.spellcheck = this.spellcheck;
|
|
162
137
|
}
|
|
163
|
-
/**
|
|
164
|
-
* Selects all the text in the text area
|
|
165
|
-
*
|
|
166
|
-
* @public
|
|
167
|
-
*/
|
|
138
|
+
/** Selects all the text in the text area */
|
|
168
139
|
select() {
|
|
169
140
|
this.control.select();
|
|
170
141
|
}
|
|
171
|
-
/**
|
|
172
|
-
* @internal
|
|
173
|
-
*/
|
|
142
|
+
/** @internal */
|
|
174
143
|
valueChanged(previous, next) {
|
|
175
144
|
super.valueChanged(previous, next);
|
|
176
145
|
if (this.charCount && this.maxlength) this._updateCharCountRemaining();
|
|
@@ -224,10 +193,6 @@ __decorate([observable], TextArea.prototype, "defaultSlottedNodes", void 0);
|
|
|
224
193
|
__decorate([attr], TextArea.prototype, "wrap", void 0);
|
|
225
194
|
//#endregion
|
|
226
195
|
//#region src/lib/text-area/text-area.template.ts
|
|
227
|
-
var getClasses = ({ value, errorValidationMessage, disabled, placeholder, readOnly, successText }) => classNames("base", ["readonly", readOnly], ["placeholder", Boolean(placeholder)], ["disabled", disabled], ["error", Boolean(errorValidationMessage)], ["has-value", Boolean(value)], ["success", !!successText]);
|
|
228
|
-
/**
|
|
229
|
-
*
|
|
230
|
-
*/
|
|
231
196
|
function renderLabel() {
|
|
232
197
|
return html` <label for="control" class="label">
|
|
233
198
|
${(x) => x.label}
|
|
@@ -235,7 +200,9 @@ function renderLabel() {
|
|
|
235
200
|
}
|
|
236
201
|
var TextAreaTemplate = (context) => {
|
|
237
202
|
return html`
|
|
238
|
-
<div
|
|
203
|
+
<div
|
|
204
|
+
class="${(x) => classNames("base", ["readonly", x.readOnly], ["placeholder", Boolean(x.placeholder)], ["disabled", x.disabled], ["error", Boolean(x.errorValidationMessage)], ["has-value", Boolean(x.value)], ["success", !!x.successText])}"
|
|
205
|
+
>
|
|
239
206
|
${when((x) => x.charCount && x.maxlength, (x) => x._getCharCountTemplate(context))}
|
|
240
207
|
<div
|
|
241
208
|
class="label-wrapper"
|
|
@@ -275,9 +242,7 @@ var TextAreaTemplate = (context) => {
|
|
|
275
242
|
};
|
|
276
243
|
//#endregion
|
|
277
244
|
//#region src/lib/text-area/definition.ts
|
|
278
|
-
/**
|
|
279
|
-
* @internal
|
|
280
|
-
*/
|
|
245
|
+
/** @internal */
|
|
281
246
|
var textAreaDefinition = defineVividComponent("text-area", TextArea, TextAreaTemplate, [
|
|
282
247
|
feedbackMessageDefinition,
|
|
283
248
|
visuallyHiddenDefinition,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
const require_vivid_element = require("./vivid-element.cjs");
|
|
2
2
|
const require_definition = require("./definition6.cjs");
|
|
3
|
-
const require_definition$1 = require("./
|
|
4
|
-
const require_definition$2 = require("./
|
|
3
|
+
const require_definition$1 = require("./definition9.cjs");
|
|
4
|
+
const require_definition$2 = require("./definition22.cjs");
|
|
5
5
|
const require_definition$3 = require("./definition26.cjs");
|
|
6
6
|
const require_picker_field_template = require("./picker-field.template.cjs");
|
|
7
7
|
const require_time_selection_picker_template = require("./time-selection-picker.template.cjs");
|
|
@@ -14,15 +14,13 @@ var TimePickerTemplate = (context) => {
|
|
|
14
14
|
};
|
|
15
15
|
//#endregion
|
|
16
16
|
//#region src/lib/time-picker/definition.ts
|
|
17
|
-
/**
|
|
18
|
-
* @internal
|
|
19
|
-
*/
|
|
17
|
+
/** @internal */
|
|
20
18
|
var timePickerDefinition = require_vivid_element.defineVividComponent("time-picker", require_time_selection_picker_template.TimePicker, TimePickerTemplate, [
|
|
21
19
|
require_definition$3.textFieldDefinition,
|
|
22
|
-
require_definition$
|
|
23
|
-
require_definition
|
|
20
|
+
require_definition$1.popupDefinition,
|
|
21
|
+
require_definition.buttonDefinition,
|
|
24
22
|
require_time_selection_picker_template.inlineTimePickerDefinition,
|
|
25
|
-
require_definition.visuallyHiddenDefinition
|
|
23
|
+
require_definition$2.visuallyHiddenDefinition
|
|
26
24
|
], {
|
|
27
25
|
styles: require_picker_field_template.picker_field_default,
|
|
28
26
|
shadowOptions: { delegatesFocus: true }
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { d as createRegisterFunction, u as defineVividComponent } from "./vivid-element.js";
|
|
2
|
-
import {
|
|
3
|
-
import { t as
|
|
4
|
-
import {
|
|
2
|
+
import { t as buttonDefinition } from "./definition6.js";
|
|
3
|
+
import { t as popupDefinition } from "./definition9.js";
|
|
4
|
+
import { n as visuallyHiddenDefinition } from "./definition22.js";
|
|
5
5
|
import { n as textFieldDefinition } from "./definition26.js";
|
|
6
6
|
import { r as picker_field_default, t as PickerFieldTemplate } from "./picker-field.template.js";
|
|
7
7
|
import { n as TimePicker, s as inlineTimePickerDefinition, t as TimeSelectionPickerTemplate } from "./time-selection-picker.template.js";
|
|
@@ -14,9 +14,7 @@ var TimePickerTemplate = (context) => {
|
|
|
14
14
|
};
|
|
15
15
|
//#endregion
|
|
16
16
|
//#region src/lib/time-picker/definition.ts
|
|
17
|
-
/**
|
|
18
|
-
* @internal
|
|
19
|
-
*/
|
|
17
|
+
/** @internal */
|
|
20
18
|
var timePickerDefinition = defineVividComponent("time-picker", TimePicker, TimePickerTemplate, [
|
|
21
19
|
textFieldDefinition,
|
|
22
20
|
popupDefinition,
|
|
@@ -7,7 +7,7 @@ const require_host_semantics = require("./host-semantics.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/tree-item/tree-item.scss?inline
|
|
10
|
-
var tree_item_default = ":host(:focus-visible){outline:none}:host([disabled]){cursor:not-allowed}.control{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.control:disabled,.control.disabled{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}@media (hover:hover){.control:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}}.control.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)),.control.active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.control.selected:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary);--_appearance-color-outline:transparent}@media (hover:hover){.control.selected:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary-increment);--_appearance-color-outline:transparent}}.control.selected.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary-increment);--_appearance-color-outline:transparent}.control{--_connotation-color-primary:var(--vvd-tree-item-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-tree-item-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-tree-item-accent-primary-increment,var(--vvd-color-neutral-800));--_connotation-color-faint:var(--vvd-tree-item-accent-faint,var(--vvd-color-neutral-50));--_connotation-color-soft:var(--vvd-tree-item-accent-soft,var(--vvd-color-neutral-100));--_connotation-color-firm:var(--vvd-tree-item-accent-firm,var(--vvd-color-canvas-text));box-sizing:border-box;background-color:var(--_appearance-color-fill);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);color:var(--_appearance-color-text);font:var(--vvd-typography-base);hyphens:auto;inline-size:100%;min-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)));vertical-align:middle;word-break:break-word;border-radius:8px;align-items:center;gap:12px;padding-inline:16px;text-decoration:none;display:inline-flex;position:relative}
|
|
10
|
+
var tree_item_default = ":host(:focus-visible){outline:none}:host([disabled]){cursor:not-allowed}.control{--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}.control:disabled,.control.disabled{--_appearance-color-text:var(--vvd-color-neutral-300);--_appearance-color-fill:transparent;--_appearance-color-outline:transparent}@media (hover:hover){.control:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}}.control.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}.control:active:where(:not(.disabled,:disabled)),.control.active:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}.control.selected:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary);--_appearance-color-outline:transparent}@media (hover:hover){.control.selected:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary-increment);--_appearance-color-outline:transparent}}.control.selected.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary-increment);--_appearance-color-outline:transparent}.control{--_connotation-color-primary:var(--vvd-tree-item-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-tree-item-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-tree-item-accent-primary-increment,var(--vvd-color-neutral-800));--_connotation-color-faint:var(--vvd-tree-item-accent-faint,var(--vvd-color-neutral-50));--_connotation-color-soft:var(--vvd-tree-item-accent-soft,var(--vvd-color-neutral-100));--_connotation-color-firm:var(--vvd-tree-item-accent-firm,var(--vvd-color-canvas-text));box-sizing:border-box;background-color:var(--_appearance-color-fill);box-shadow:inset 0 0 0 1px var(--_appearance-color-outline);color:var(--_appearance-color-text);font:var(--vvd-typography-base);hyphens:auto;inline-size:100%;min-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2)));vertical-align:middle;word-break:break-word;user-select:none;border-radius:8px;align-items:center;gap:12px;padding-inline:16px;text-decoration:none;display:inline-flex;position:relative}.control:not(.disabled){cursor:pointer}.control.disabled{pointer-events:none}:host(:focus-visible) .control{box-shadow:0 0 0 4px color-mix(in sRGB, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px))}:host(:focus-visible) .control:not(.selected){--focus-stroke-gap-color:transparent}.control .text{font:var(--vvd-typography-base)}.expandCollapseButton{border-radius:8px;align-items:center;font-size:20px;display:flex}.expandCollapseButton .expandCollapseIcon{margin:4px}@media (hover:hover){.expandCollapseButton:hover{background-color:var(--vvd-color-neutral-100)}.selected .expandCollapseButton:hover{background-color:var(--vvd-color-neutral-700)}}.items{flex-direction:column;gap:4px;margin-block-start:4px;padding-inline-start:48px;display:flex}slot[name=icon]{font-size:20px;line-height:1}.control:not(.disabled,.selected) slot[name=icon]{color:var(--vvd-color-neutral-600)}";
|
|
11
11
|
//#endregion
|
|
12
12
|
//#region src/lib/tree-item/tree-item.ts
|
|
13
13
|
function isTreeItemElement(el) {
|
|
@@ -41,15 +41,11 @@ var TreeItem = class extends require_host_semantics.HostSemantics(require_affix.
|
|
|
41
41
|
this.setAttribute("tabindex", "-1");
|
|
42
42
|
};
|
|
43
43
|
}
|
|
44
|
-
/**
|
|
45
|
-
* @internal
|
|
46
|
-
*/
|
|
44
|
+
/** @internal */
|
|
47
45
|
expandedChanged() {
|
|
48
46
|
if (this.$fastController.isConnected) this.$emit("expanded-change", this);
|
|
49
47
|
}
|
|
50
|
-
/**
|
|
51
|
-
* @internal
|
|
52
|
-
*/
|
|
48
|
+
/** @internal */
|
|
53
49
|
selectedChanged() {
|
|
54
50
|
if (this.$fastController.isConnected) this.$emit("selected-change", this);
|
|
55
51
|
}
|
|
@@ -62,7 +58,6 @@ var TreeItem = class extends require_host_semantics.HostSemantics(require_affix.
|
|
|
62
58
|
/**
|
|
63
59
|
* Places document focus on a tree item
|
|
64
60
|
*
|
|
65
|
-
* @public
|
|
66
61
|
* @param el - the element to focus
|
|
67
62
|
*/
|
|
68
63
|
static focusItem(el) {
|
|
@@ -91,7 +86,6 @@ require_decorate.__decorate([_microsoft_fast_element.observable], TreeItem.proto
|
|
|
91
86
|
require_decorate.__decorate([_microsoft_fast_element.observable], TreeItem.prototype, "renderCollapsedChildren", void 0);
|
|
92
87
|
//#endregion
|
|
93
88
|
//#region src/lib/tree-item/tree-item.template.ts
|
|
94
|
-
var getClasses = ({ disabled, selected }) => (0, _microsoft_fast_web_utilities.classNames)("control", ["disabled", disabled], ["selected", selected]);
|
|
95
89
|
var expandCollapseButton = (context) => {
|
|
96
90
|
const iconTag = context.tagFor(require_definition.Icon);
|
|
97
91
|
return _microsoft_fast_element.html`
|
|
@@ -122,7 +116,9 @@ var TreeItemTemplate = (context) => {
|
|
|
122
116
|
filter: (0, _microsoft_fast_element.elements)(treeItemTagName)
|
|
123
117
|
})}
|
|
124
118
|
>
|
|
125
|
-
<div
|
|
119
|
+
<div
|
|
120
|
+
class="${(x) => (0, _microsoft_fast_web_utilities.classNames)("control", ["disabled", x.disabled], ["selected", x.selected])}"
|
|
121
|
+
>
|
|
126
122
|
${(0, _microsoft_fast_element.when)((x) => x.childItems && x.childItems.length > 0, expandCollapseButton(context))}
|
|
127
123
|
${(x) => affixIconTemplate(x.icon, require_affix.IconWrapper.Slot)}
|
|
128
124
|
${(x) => x.text}
|
|
@@ -134,9 +130,7 @@ var TreeItemTemplate = (context) => {
|
|
|
134
130
|
};
|
|
135
131
|
//#endregion
|
|
136
132
|
//#region src/lib/tree-item/definition.ts
|
|
137
|
-
/**
|
|
138
|
-
* @internal
|
|
139
|
-
*/
|
|
133
|
+
/** @internal */
|
|
140
134
|
var treeItemDefinition = require_vivid_element.defineVividComponent("tree-item", TreeItem, TreeItemTemplate, [require_definition.iconDefinition], { styles: tree_item_default });
|
|
141
135
|
/**
|
|
142
136
|
* Registers the tree-item element with the design system.
|