@vonage/vivid 5.19.0 → 5.20.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/accordion/definition.cjs +1 -1
- package/accordion/definition.js +1 -1
- package/accordion/index.cjs +2 -2
- package/accordion/index.js +2 -2
- package/accordion-item/definition.cjs +1 -1
- package/accordion-item/definition.js +1 -1
- package/action-group/definition.cjs +1 -1
- package/action-group/definition.js +1 -1
- package/action-group/index.cjs +2 -2
- package/action-group/index.js +2 -2
- package/alert/index.cjs +5 -5
- package/alert/index.js +8 -8
- package/audio-player/index.cjs +10 -10
- package/audio-player/index.js +28 -28
- package/avatar/index.cjs +7 -7
- package/avatar/index.js +14 -14
- package/banner/index.cjs +5 -5
- package/banner/index.js +9 -9
- package/breadcrumb/index.cjs +2 -2
- package/breadcrumb/index.js +3 -3
- package/breadcrumb-item/index.cjs +5 -5
- package/breadcrumb-item/index.js +1 -1
- package/bundled/affix.cjs +2 -2
- package/bundled/affix.js +11 -11
- package/bundled/anchored.cjs +1 -1
- package/bundled/anchored.js +6 -6
- package/bundled/aria-binding-directive.cjs +1 -1
- package/bundled/aria-binding-directive.js +88 -16
- package/bundled/base-color-picker.cjs +3 -3
- package/bundled/base-color-picker.js +5 -5
- package/bundled/base-progress.cjs +1 -1
- package/bundled/base-progress.js +3 -3
- package/bundled/breadcrumb-item.cjs +1 -1
- package/bundled/breadcrumb-item.js +3 -3
- package/bundled/button.cjs +1 -1
- package/bundled/button.js +3 -3
- package/bundled/calendar-event.cjs +1 -1
- package/bundled/calendar-event.js +4 -4
- package/bundled/calendar-picker.template.cjs +23 -24
- package/bundled/calendar-picker.template.js +35 -36
- package/bundled/char-count.cjs +2 -2
- package/bundled/char-count.js +8 -8
- package/bundled/children.cjs +1 -1
- package/bundled/children.js +11 -13
- package/bundled/definition.cjs +1 -1
- package/bundled/definition.js +2 -2
- package/bundled/definition10.cjs +3 -3
- package/bundled/definition10.js +5 -5
- package/bundled/definition11.cjs +2 -2
- package/bundled/definition11.js +7 -7
- package/bundled/definition12.cjs +15 -16
- package/bundled/definition12.js +22 -22
- package/bundled/definition13.cjs +3 -3
- package/bundled/definition13.js +5 -5
- package/bundled/definition14.cjs +2 -2
- package/bundled/definition14.js +2 -2
- package/bundled/definition15.cjs +7 -8
- package/bundled/definition15.js +14 -14
- package/bundled/definition16.cjs +3 -3
- package/bundled/definition16.js +8 -8
- package/bundled/definition17.cjs +7 -7
- package/bundled/definition17.js +13 -13
- package/bundled/definition18.cjs +18 -18
- package/bundled/definition18.js +36 -36
- package/bundled/definition19.cjs +2 -2
- package/bundled/definition19.js +1 -1
- package/bundled/definition2.cjs +10 -9
- package/bundled/definition2.js +24 -24
- package/bundled/definition20.cjs +19 -14
- package/bundled/definition20.js +51 -39
- package/bundled/definition21.cjs +6 -6
- package/bundled/definition21.js +18 -18
- package/bundled/definition22.cjs +3 -3
- package/bundled/definition22.js +7 -7
- package/bundled/definition23.cjs +4 -4
- package/bundled/definition23.js +8 -8
- package/bundled/definition24.cjs +8 -8
- package/bundled/definition24.js +17 -17
- package/bundled/definition3.cjs +1 -1
- package/bundled/definition3.js +5 -5
- package/bundled/definition4.cjs +9 -9
- package/bundled/definition4.js +16 -16
- package/bundled/definition5.cjs +4 -4
- package/bundled/definition5.js +5 -5
- package/bundled/definition6.cjs +6 -6
- package/bundled/definition6.js +21 -21
- package/bundled/definition7.cjs +2 -2
- package/bundled/definition7.js +4 -4
- package/bundled/definition8.cjs +4 -4
- package/bundled/definition8.js +7 -7
- package/bundled/definition9.cjs +10 -6
- package/bundled/definition9.js +48 -34
- package/bundled/delegates-aria.cjs +1 -1
- package/bundled/delegates-aria.js +20 -9
- package/bundled/divider.cjs +1 -1
- package/bundled/divider.js +3 -3
- package/bundled/form-associated.cjs +1 -1
- package/bundled/form-associated.js +6 -6
- package/bundled/form-element.cjs +1 -1
- package/bundled/form-element.js +1 -1
- package/bundled/host-semantics.cjs +1 -1
- package/bundled/host-semantics.js +2 -1
- package/bundled/kbd-shortcut.cjs +1 -0
- package/bundled/kbd-shortcut.js +14 -0
- package/bundled/linkable.cjs +2 -2
- package/bundled/linkable.js +5 -5
- package/bundled/listbox.cjs +1 -1
- package/bundled/listbox.js +4 -4
- package/bundled/localized.cjs +1 -1
- package/bundled/localized.js +3 -2
- package/bundled/mixins.cjs +16 -16
- package/bundled/mixins.js +39 -105
- package/bundled/picker-field.template.cjs +6 -6
- package/bundled/picker-field.template.js +15 -15
- package/bundled/platform.cjs +1 -0
- package/bundled/platform.js +9 -0
- package/bundled/ref.cjs +1 -1
- package/bundled/ref.js +2 -2
- package/bundled/render-in-light-dom.cjs +1 -0
- package/bundled/render-in-light-dom.js +57 -0
- package/bundled/repeat.cjs +1 -1
- package/bundled/repeat.js +117 -107
- package/bundled/slider.template.cjs +3 -3
- package/bundled/slider.template.js +1 -1
- package/bundled/slotted.cjs +1 -1
- package/bundled/slotted.js +2 -2
- package/bundled/time-selection-picker.template.cjs +4 -4
- package/bundled/time-selection-picker.template.js +18 -18
- package/bundled/vivid-element.cjs +3 -3
- package/bundled/vivid-element.js +626 -550
- package/bundled/when.cjs +1 -1
- package/bundled/when.js +2 -2
- package/bundled/with-contextual-help.cjs +1 -1
- package/bundled/with-contextual-help.js +1 -1
- package/bundled/with-error-text.cjs +1 -1
- package/bundled/with-error-text.js +1 -1
- package/bundled/with-success-text.cjs +1 -1
- package/bundled/with-success-text.js +1 -1
- package/calendar/index.cjs +8 -8
- package/calendar/index.js +9 -9
- package/calendar-event/index.cjs +4 -4
- package/calendar-event/index.js +1 -1
- package/card/index.cjs +24 -25
- package/card/index.js +29 -30
- package/color-picker/index.cjs +26 -26
- package/color-picker/index.js +90 -90
- package/combobox/index.cjs +13 -13
- package/combobox/index.js +22 -22
- package/country-group/index.cjs +4 -4
- package/country-group/index.js +3 -3
- package/custom-elements.json +940 -112
- package/data-grid/index.cjs +34 -34
- package/data-grid/index.js +37 -38
- package/date-picker/definition.cjs +1 -1
- package/date-picker/definition.js +1 -1
- package/date-picker/index.cjs +1 -1
- package/date-picker/index.js +2 -2
- package/date-range-picker/definition.cjs +1 -1
- package/date-range-picker/definition.js +1 -1
- package/date-range-picker/index.cjs +1 -1
- package/date-range-picker/index.js +4 -4
- package/date-time-picker/definition.cjs +1 -1
- package/date-time-picker/definition.js +1 -1
- package/date-time-picker/index.cjs +2 -2
- package/date-time-picker/index.js +6 -6
- package/dial-pad/definition.cjs +1 -1
- package/dial-pad/definition.js +1 -1
- package/dial-pad/index.cjs +8 -8
- package/dial-pad/index.js +15 -15
- package/dialog/definition.cjs +1 -1
- package/dialog/definition.js +1 -1
- package/dialog/index.cjs +16 -17
- package/dialog/index.js +29 -27
- package/divider/definition.cjs +1 -1
- package/divider/definition.js +1 -1
- package/empty-state/definition.cjs +1 -1
- package/empty-state/definition.js +1 -1
- package/empty-state/index.cjs +5 -5
- package/empty-state/index.js +9 -9
- package/fab/definition.cjs +1 -1
- package/fab/definition.js +1 -1
- package/fab/index.cjs +2 -2
- package/fab/index.js +6 -6
- package/file-picker/definition.cjs +1 -1
- package/file-picker/definition.js +1 -1
- package/file-picker/index.cjs +9 -10
- package/file-picker/index.js +21 -22
- package/flag/index.cjs +3 -3
- package/flag/index.js +7 -7
- package/header/definition.cjs +1 -1
- package/header/definition.js +1 -1
- package/header/index.cjs +2 -2
- package/header/index.js +8 -8
- package/icon/definition.cjs +1 -1
- package/icon/definition.js +1 -1
- package/index.cjs +184 -172
- package/index.js +52 -49
- package/kbd-key/definition.cjs +5 -0
- package/kbd-key/definition.js +2 -0
- package/kbd-key/index.cjs +5 -0
- package/kbd-key/index.js +65 -0
- package/kbd-shortcut/definition.cjs +5 -0
- package/kbd-shortcut/definition.js +2 -0
- package/kbd-shortcut/index.cjs +3 -0
- package/kbd-shortcut/index.js +27 -0
- package/layout/definition.cjs +1 -1
- package/layout/definition.js +1 -1
- package/layout/index.cjs +2 -2
- package/layout/index.js +2 -2
- package/lib/accordion-item/accordion-item.d.ts +18 -1
- package/lib/action-group/action-group.d.ts +18 -1
- package/lib/alert/alert.d.ts +36 -2
- package/lib/audio-player/audio-player.d.ts +18 -1
- package/lib/avatar/avatar.d.ts +18 -1
- package/lib/badge/badge.d.ts +18 -1
- package/lib/banner/banner.d.ts +54 -3
- package/lib/breadcrumb/breadcrumb.d.ts +18 -1
- package/lib/breadcrumb-item/breadcrumb-item.d.ts +18 -1
- package/lib/button/button.d.ts +54 -3
- package/lib/calendar-event/calendar-event.d.ts +18 -1
- package/lib/card/card.d.ts +18 -1
- package/lib/checkbox/checkbox.d.ts +107 -5
- package/lib/color-picker/color-picker.d.ts +126 -7
- package/lib/combobox/combobox.d.ts +124 -5
- package/lib/components.d.ts +4 -1
- package/lib/country-group/country-group.d.ts +36 -2
- package/lib/data-grid/data-grid-cell.d.ts +36 -2
- package/lib/data-grid/data-grid-row.d.ts +18 -1
- package/lib/date-picker/date-picker.d.ts +140 -4
- package/lib/date-range-picker/date-range-picker.d.ts +70 -2
- package/lib/date-time-picker/date-time-picker.d.ts +140 -4
- package/lib/dial-pad/dial-pad.d.ts +18 -1
- package/lib/dialog/dialog.d.ts +36 -2
- package/lib/divider/divider.d.ts +18 -1
- package/lib/fab/fab.d.ts +18 -1
- package/lib/file-picker/file-picker.d.ts +124 -5
- package/lib/header/header.d.ts +18 -1
- package/lib/icon/icon.template.d.ts +1 -2
- package/lib/kbd-key/definition.d.ts +4 -0
- package/lib/kbd-key/index.d.ts +1 -0
- package/lib/kbd-key/kbd-key.d.ts +18 -0
- package/lib/kbd-key/kbd-key.template.d.ts +4 -0
- package/lib/kbd-shortcut/definition.d.ts +3 -0
- package/lib/kbd-shortcut/index.d.ts +1 -0
- package/lib/kbd-shortcut/kbd-shortcut.d.ts +4 -0
- package/lib/kbd-shortcut/kbd-shortcut.template.d.ts +4 -0
- package/lib/menu/menu.d.ts +35 -1
- package/lib/menu-item/menu-item.d.ts +463 -2
- package/lib/nav/nav.d.ts +18 -1
- package/lib/nav-disclosure/nav-disclosure.d.ts +36 -2
- package/lib/nav-item/nav-item.d.ts +36 -2
- package/lib/note/note.d.ts +18 -1
- package/lib/number-field/number-field.d.ts +160 -7
- package/lib/option/option.d.ts +36 -2
- package/lib/pagination/pagination.d.ts +18 -1
- package/lib/platform-switch/definition.d.ts +3 -0
- package/lib/platform-switch/index.d.ts +1 -0
- package/lib/platform-switch/platform-switch.d.ts +4 -0
- package/lib/platform-switch/platform-switch.template.d.ts +4 -0
- package/lib/popover/popover.d.ts +36 -2
- package/lib/progress/progress.d.ts +18 -1
- package/lib/progress-ring/progress-ring.d.ts +18 -1
- package/lib/radio/radio.d.ts +53 -2
- package/lib/radio-group/radio-group.d.ts +18 -1
- package/lib/range-slider/range-slider.d.ts +52 -1
- package/lib/rich-text-editor/locale.d.ts +1 -0
- package/lib/rich-text-editor/popover.d.ts +1 -0
- package/lib/rich-text-editor/rich-text-editor.d.ts +17 -0
- package/lib/rich-text-editor/rte/utils/ui.d.ts +1 -0
- package/lib/searchable-select/option-tag.d.ts +18 -1
- package/lib/searchable-select/searchable-select.d.ts +160 -7
- package/lib/select/select.d.ts +160 -7
- package/lib/selectable-box/selectable-box.d.ts +18 -1
- package/lib/simple-color-picker/simple-color-picker.d.ts +35 -1
- package/lib/slider/slider.d.ts +53 -2
- package/lib/split-button/split-button.d.ts +54 -3
- package/lib/status/status.d.ts +18 -1
- package/lib/switch/switch.d.ts +36 -2
- package/lib/tab/tab.d.ts +54 -3
- package/lib/tab-panel/tab-panel.d.ts +18 -1
- package/lib/table/table-cell.d.ts +18 -1
- package/lib/table/table-header-cell.d.ts +18 -1
- package/lib/table/table-row.d.ts +18 -1
- package/lib/table/table-sorting-button.d.ts +18 -1
- package/lib/tag/tag.d.ts +54 -3
- package/lib/tag-group/tag-group.d.ts +18 -1
- package/lib/tag-name-map.d.ts +4 -1
- package/lib/text-area/text-area.d.ts +142 -6
- package/lib/text-field/text-field.d.ts +160 -7
- package/lib/time-picker/time-picker.d.ts +70 -2
- package/lib/toggletip/toggletip.d.ts +35 -1
- package/lib/tooltip/tooltip.d.ts +444 -0
- package/lib/tree-item/tree-item.d.ts +36 -2
- package/lib/tree-view/tree-view.d.ts +18 -1
- package/lib/video-player/video-player.d.ts +18 -1
- package/locales/de-DE.cjs +1 -0
- package/locales/de-DE.js +1 -0
- package/locales/en-GB.cjs +1 -0
- package/locales/en-GB.js +1 -0
- package/locales/en-US.cjs +1 -0
- package/locales/en-US.js +1 -0
- package/locales/ja-JP.cjs +1 -0
- package/locales/ja-JP.js +1 -0
- package/locales/zh-CN.cjs +1 -0
- package/locales/zh-CN.js +1 -0
- package/nav/definition.cjs +1 -1
- package/nav/definition.js +1 -1
- package/nav/index.cjs +2 -2
- package/nav/index.js +2 -2
- package/nav-disclosure/definition.cjs +1 -1
- package/nav-disclosure/definition.js +1 -1
- package/nav-disclosure/index.cjs +3 -4
- package/nav-disclosure/index.js +11 -11
- package/nav-item/definition.cjs +1 -1
- package/nav-item/definition.js +1 -1
- package/nav-item/index.cjs +2 -2
- package/nav-item/index.js +6 -6
- package/note/definition.cjs +1 -1
- package/note/definition.js +1 -1
- package/note/index.cjs +2 -2
- package/note/index.js +7 -7
- package/number-field/definition.cjs +1 -1
- package/number-field/definition.js +1 -1
- package/number-field/index.cjs +8 -9
- package/number-field/index.js +16 -17
- package/package.json +8 -8
- package/pagination/definition.cjs +1 -1
- package/pagination/definition.js +1 -1
- package/pagination/index.cjs +9 -9
- package/pagination/index.js +16 -16
- package/platform-switch/definition.cjs +5 -0
- package/platform-switch/definition.js +2 -0
- package/platform-switch/index.cjs +1 -0
- package/platform-switch/index.js +28 -0
- package/popover/definition.cjs +1 -1
- package/popover/definition.js +1 -1
- package/popover/index.cjs +6 -6
- package/popover/index.js +12 -12
- package/progress/definition.cjs +1 -1
- package/progress/definition.js +1 -1
- package/progress/index.cjs +4 -4
- package/progress/index.js +5 -5
- package/progress-ring/definition.cjs +1 -1
- package/progress-ring/definition.js +1 -1
- package/radio/definition.cjs +1 -1
- package/radio/definition.js +1 -1
- package/radio-group/definition.cjs +1 -1
- package/radio-group/definition.js +1 -1
- package/radio-group/index.cjs +5 -8
- package/radio-group/index.js +16 -16
- package/range-slider/definition.cjs +1 -1
- package/range-slider/definition.js +1 -1
- package/range-slider/index.cjs +5 -5
- package/range-slider/index.js +9 -9
- package/rich-text-editor/definition.cjs +1 -1
- package/rich-text-editor/definition.js +1 -1
- package/rich-text-editor/index.cjs +8 -6
- package/rich-text-editor/index.js +101 -78
- package/rich-text-view/definition.cjs +1 -1
- package/rich-text-view/definition.js +1 -1
- package/rich-text-view/index.cjs +1 -1
- package/rich-text-view/index.js +3 -3
- package/searchable-select/definition.cjs +1 -1
- package/searchable-select/definition.js +1 -1
- package/searchable-select/index.cjs +38 -40
- package/searchable-select/index.js +64 -64
- package/select/definition.cjs +1 -1
- package/select/definition.js +1 -1
- package/selectable-box/definition.cjs +1 -1
- package/selectable-box/definition.js +1 -1
- package/selectable-box/index.cjs +4 -4
- package/selectable-box/index.js +13 -13
- package/shared/aria/aria-binding-directive.d.ts +4 -4
- package/shared/aria/aria-mixin.d.ts +21 -3
- package/shared/aria/delegates-aria.d.ts +18 -1
- package/shared/aria/host-semantics.d.ts +18 -1
- package/shared/aria/idrefs-controller.d.ts +17 -0
- package/shared/color-picker/base-color-picker.d.ts +18 -1
- package/shared/feedback/feedback-message.d.ts +18 -1
- package/shared/feedback/mixins.d.ts +36 -2
- package/shared/foundation/button/button.d.ts +35 -1
- package/shared/foundation/form-associated/form-associated.d.ts +35 -1
- package/shared/foundation/vivid-element/vivid-element.d.ts +375 -0
- package/shared/framework/reactive-controller.d.ts +373 -0
- package/shared/patterns/affix.d.ts +36 -2
- package/shared/patterns/anchored.d.ts +34 -0
- package/shared/patterns/char-count/char-count.d.ts +18 -1
- package/shared/patterns/form-elements/form-element.d.ts +17 -0
- package/shared/patterns/form-elements/with-contextual-help.d.ts +18 -1
- package/shared/patterns/form-elements/with-error-text.d.ts +18 -1
- package/shared/patterns/form-elements/with-success-text.d.ts +18 -1
- package/shared/patterns/index.d.ts +1 -0
- package/shared/patterns/kbd-shortcut.d.ts +431 -0
- package/shared/patterns/linkable.d.ts +18 -1
- package/shared/patterns/localized.d.ts +35 -1
- package/shared/patterns/trapped-focus.d.ts +18 -1
- package/shared/picker-field/mixins/calendar-picker.d.ts +35 -1
- package/shared/picker-field/mixins/calendar-picker.template.d.ts +35 -1
- package/shared/picker-field/mixins/inline-time-picker/inline-time-picker.d.ts +18 -1
- package/shared/picker-field/mixins/min-max-calendar-picker.d.ts +35 -1
- package/shared/picker-field/mixins/single-date-picker.d.ts +35 -1
- package/shared/picker-field/mixins/single-value-picker.d.ts +35 -1
- package/shared/picker-field/mixins/time-selection-picker.d.ts +35 -1
- package/shared/picker-field/mixins/time-selection-picker.template.d.ts +70 -2
- package/shared/picker-field/picker-field.d.ts +124 -5
- package/shared/templating/render-in-light-dom.d.ts +7 -20
- package/shared/utils/platform.d.ts +1 -0
- package/side-drawer/definition.cjs +1 -1
- package/side-drawer/definition.js +1 -1
- package/side-drawer/index.cjs +3 -3
- package/side-drawer/index.js +3 -3
- package/simple-color-picker/definition.cjs +1 -1
- package/simple-color-picker/definition.js +1 -1
- package/simple-color-picker/index.cjs +2 -2
- package/simple-color-picker/index.js +6 -6
- package/split-button/definition.cjs +1 -1
- package/split-button/definition.js +1 -1
- package/split-button/index.cjs +5 -6
- package/split-button/index.js +8 -8
- package/status/definition.cjs +1 -1
- package/status/definition.js +1 -1
- package/status/index.cjs +4 -4
- package/status/index.js +9 -9
- package/styles/core/all.css +24 -2
- package/styles/core/typography.css +24 -2
- package/styles/fonts/spezia-variable.css +6 -0
- package/styles/tokens/theme-dark.css +2 -0
- package/styles/tokens/theme-light.css +2 -0
- package/switch/definition.cjs +1 -1
- package/switch/definition.js +1 -1
- package/switch/index.cjs +3 -3
- package/switch/index.js +4 -4
- package/tab/definition.cjs +1 -1
- package/tab/definition.js +1 -1
- package/tab-panel/definition.cjs +1 -1
- package/tab-panel/definition.js +1 -1
- package/table/definition.cjs +1 -1
- package/table/definition.js +1 -1
- package/table/index.cjs +9 -9
- package/table/index.js +19 -19
- package/tabs/definition.cjs +1 -1
- package/tabs/definition.js +1 -1
- package/tabs/index.cjs +8 -8
- package/tabs/index.js +14 -14
- package/tag/definition.cjs +1 -1
- package/tag/definition.js +1 -1
- package/tag/index.cjs +8 -8
- package/tag/index.js +11 -11
- package/tag-group/definition.cjs +1 -1
- package/tag-group/definition.js +1 -1
- package/tag-group/index.cjs +2 -2
- package/tag-group/index.js +2 -2
- package/text-area/definition.cjs +1 -1
- package/text-area/definition.js +1 -1
- package/text-area/index.cjs +8 -9
- package/text-area/index.js +25 -26
- package/time-picker/definition.cjs +1 -1
- package/time-picker/definition.js +1 -1
- package/time-picker/index.cjs +1 -1
- package/time-picker/index.js +1 -1
- package/tree-item/definition.cjs +1 -1
- package/tree-item/definition.js +1 -1
- package/tree-view/definition.cjs +1 -1
- package/tree-view/definition.js +1 -1
- package/tree-view/index.cjs +4 -4
- package/tree-view/index.js +7 -7
- package/unbundled/affix.cjs +1 -1
- package/unbundled/affix.js +1 -1
- package/unbundled/aria-binding-directive.cjs +112 -2
- package/unbundled/aria-binding-directive.js +108 -4
- package/unbundled/calendar-picker.template.cjs +8 -10
- package/unbundled/calendar-picker.template.js +8 -10
- package/unbundled/char-count.cjs +1 -1
- package/unbundled/char-count.js +1 -1
- package/unbundled/definition.cjs +91 -17
- package/unbundled/definition.js +88 -14
- package/unbundled/definition10.js +1 -1
- package/unbundled/definition11.js +1 -1
- package/unbundled/definition12.cjs +15 -2
- package/unbundled/definition12.js +17 -4
- package/unbundled/definition13.js +1 -1
- package/unbundled/definition14.js +1 -1
- package/unbundled/definition15.cjs +1 -1
- package/unbundled/definition15.js +2 -2
- package/unbundled/definition16.cjs +1 -1
- package/unbundled/definition16.js +2 -2
- package/unbundled/definition17.cjs +1 -1
- package/unbundled/definition17.js +2 -2
- package/unbundled/definition18.cjs +1 -1
- package/unbundled/definition18.js +2 -2
- package/unbundled/definition19.js +1 -1
- package/unbundled/definition2.cjs +96 -77
- package/unbundled/definition2.js +94 -75
- package/unbundled/definition20.js +1 -1
- package/unbundled/definition21.js +1 -1
- package/unbundled/definition22.cjs +2 -3
- package/unbundled/definition22.js +3 -4
- package/unbundled/definition23.cjs +3 -3
- package/unbundled/definition23.js +5 -5
- package/unbundled/definition24.js +1 -1
- package/unbundled/definition25.cjs +1 -1
- package/unbundled/definition25.js +2 -2
- package/unbundled/definition26.cjs +8 -8
- package/unbundled/definition26.js +6 -6
- package/unbundled/definition27.cjs +26 -12
- package/unbundled/definition27.js +28 -14
- package/unbundled/definition28.cjs +1 -1
- package/unbundled/definition28.js +3 -3
- package/unbundled/definition29.cjs +1 -1
- package/unbundled/definition29.js +2 -2
- package/unbundled/definition3.cjs +154 -95
- package/unbundled/definition3.js +146 -93
- package/unbundled/definition30.cjs +1 -1
- package/unbundled/definition30.js +3 -3
- package/unbundled/definition31.cjs +1 -1
- package/unbundled/definition31.js +2 -2
- package/unbundled/definition32.js +1 -1
- package/unbundled/definition33.cjs +1 -1
- package/unbundled/definition33.js +2 -2
- package/unbundled/definition34.cjs +103 -65
- package/unbundled/definition34.js +102 -64
- package/unbundled/definition35.cjs +26 -326
- package/unbundled/definition35.js +24 -247
- package/unbundled/definition36.cjs +131 -25
- package/unbundled/definition36.js +124 -23
- package/unbundled/definition37.cjs +326 -51
- package/unbundled/definition37.js +324 -49
- package/unbundled/definition38.cjs +137 -317
- package/unbundled/definition38.js +135 -315
- package/unbundled/definition39.cjs +337 -173
- package/unbundled/definition39.js +334 -170
- package/unbundled/definition4.cjs +34 -159
- package/unbundled/definition4.js +25 -151
- package/unbundled/definition40.cjs +234 -339
- package/unbundled/definition40.js +230 -335
- package/unbundled/definition41.cjs +48 -271
- package/unbundled/definition41.js +44 -267
- package/unbundled/definition42.cjs +68 -49
- package/unbundled/definition42.js +65 -46
- package/unbundled/definition43.cjs +424 -56
- package/unbundled/definition43.js +422 -54
- package/unbundled/definition44.cjs +45 -428
- package/unbundled/definition44.js +42 -425
- package/unbundled/definition45.cjs +45 -54
- package/unbundled/definition45.js +42 -51
- package/unbundled/definition46.cjs +178 -30
- package/unbundled/definition46.js +175 -26
- package/unbundled/definition47.cjs +29 -94
- package/unbundled/definition47.js +25 -91
- package/unbundled/definition48.cjs +76 -36
- package/unbundled/definition48.js +73 -33
- package/unbundled/definition49.cjs +56 -23
- package/unbundled/definition49.js +54 -18
- package/unbundled/definition5.cjs +56 -38
- package/unbundled/definition5.js +52 -28
- package/unbundled/definition50.cjs +23 -40
- package/unbundled/definition50.js +18 -38
- package/unbundled/definition51.cjs +30 -338
- package/unbundled/definition51.js +30 -338
- package/unbundled/definition52.cjs +317 -187
- package/unbundled/definition52.js +314 -184
- package/unbundled/definition53.cjs +194 -289
- package/unbundled/definition53.js +189 -284
- package/unbundled/definition54.cjs +47 -54
- package/unbundled/definition54.js +44 -50
- package/unbundled/definition55.cjs +279 -133
- package/unbundled/definition55.js +277 -130
- package/unbundled/definition56.cjs +50 -262
- package/unbundled/definition56.js +48 -261
- package/unbundled/definition57.cjs +128 -460
- package/unbundled/definition57.js +126 -459
- package/unbundled/definition58.cjs +235 -3604
- package/unbundled/definition58.js +231 -3437
- package/unbundled/definition59.cjs +419 -729
- package/unbundled/definition59.js +417 -727
- package/unbundled/definition6.cjs +18 -64
- package/unbundled/definition6.js +15 -60
- package/unbundled/definition60.cjs +3666 -106
- package/unbundled/definition60.js +3498 -101
- package/unbundled/definition61.cjs +625 -878
- package/unbundled/definition61.js +619 -872
- package/unbundled/definition62.cjs +106 -108
- package/unbundled/definition62.js +103 -105
- package/unbundled/definition63.cjs +1045 -71
- package/unbundled/definition63.js +1041 -66
- package/unbundled/definition64.cjs +105 -173
- package/unbundled/definition64.js +102 -170
- package/unbundled/definition65.cjs +70 -113
- package/unbundled/definition65.js +66 -110
- package/unbundled/definition66.cjs +185 -54
- package/unbundled/definition66.js +182 -51
- package/unbundled/definition67.cjs +110 -77
- package/unbundled/definition67.js +111 -77
- package/unbundled/definition68.cjs +58 -21
- package/unbundled/definition68.js +56 -16
- package/unbundled/definition69.cjs +82 -75
- package/unbundled/definition69.js +81 -75
- package/unbundled/definition7.cjs +2 -2
- package/unbundled/definition7.js +3 -3
- package/unbundled/definition70.cjs +19 -349
- package/unbundled/definition70.js +15 -341
- package/unbundled/definition71.cjs +88 -26
- package/unbundled/definition71.js +86 -23
- package/unbundled/definition72.cjs +309 -119
- package/unbundled/definition72.js +234 -116
- package/unbundled/definition73.cjs +293 -229
- package/unbundled/definition73.js +287 -230
- package/unbundled/definition74.cjs +39 -30
- package/unbundled/definition74.js +29 -28
- package/unbundled/definition75.cjs +106 -121
- package/unbundled/definition75.js +104 -113
- package/unbundled/definition76.cjs +260 -179
- package/unbundled/definition76.js +258 -176
- package/unbundled/definition77.cjs +29 -514
- package/unbundled/definition77.js +27 -503
- package/unbundled/definition78.cjs +171 -0
- package/unbundled/definition78.js +147 -0
- package/unbundled/definition79.cjs +233 -0
- package/unbundled/definition79.js +214 -0
- package/unbundled/definition8.js +1 -1
- package/unbundled/definition80.cjs +533 -0
- package/unbundled/definition80.js +513 -0
- package/unbundled/definition9.cjs +1 -1
- package/unbundled/definition9.js +2 -2
- package/unbundled/delegates-aria.cjs +15 -1
- package/unbundled/delegates-aria.js +17 -3
- package/unbundled/host-semantics.cjs +2 -1
- package/unbundled/host-semantics.js +2 -1
- package/unbundled/kbd-shortcut.cjs +26 -0
- package/unbundled/kbd-shortcut.js +20 -0
- package/unbundled/mixins.cjs +7 -77
- package/unbundled/mixins.js +6 -64
- package/unbundled/platform.cjs +17 -0
- package/unbundled/platform.js +12 -0
- package/unbundled/randomId.cjs +47 -0
- package/unbundled/randomId.js +35 -0
- package/unbundled/time-selection-picker.template.js +1 -1
- package/unbundled/vivid-element.cjs +82 -9
- package/unbundled/vivid-element.js +63 -8
- package/video-player/definition.cjs +1 -1
- package/video-player/definition.js +1 -1
- 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/vivid.api.json +604 -6
- package/bundled/normalize.cjs +0 -1
- package/bundled/normalize.js +0 -7
package/data-grid/index.cjs
CHANGED
|
@@ -1,33 +1,33 @@
|
|
|
1
|
-
const e=require(`../bundled/localized.cjs`),t=require(`../bundled/vivid-element.cjs`),n=require(`../bundled/repeat.cjs`),r=require(`../bundled/normalize.cjs`),i=require(`../bundled/when.cjs`),a=require(`../bundled/slotted.cjs`),o=require(`../bundled/children.cjs`),s=require(`../bundled/definition.cjs`),c=require(`../bundled/decorate.cjs`),l=require(`../bundled/definition2.cjs`),u=require(`../bundled/class-names.cjs`),d=require(`../bundled/key-codes.cjs`),f=require(`../bundled/host-semantics.cjs`),p=require(`../bundled/data-grid.options.cjs`);var m=`focus`,h=`focusin`,g=`focusout`,_=`keydown`,v=`:host{display:block}:host([generate-header=sticky]){max-block-size:400px}.base{--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}.base ::-webkit-scrollbar{width:4px}.base ::-webkit-scrollbar-track{background:var(--scrollbar-track-color)}.base ::-webkit-scrollbar-thumb{background-color:var(--scrollbar-fallback-track-color,var(--scrollbar-thumb-color));border:0;border-radius:4px}.base{block-size:inherit;inline-size:100%;max-block-size:inherit;position:relative;overflow:auto}`,y=`.base.connotation-cta{--_connotation-color-primary:var(--vvd-data-grid-row-cta-primary,var(--vvd-color-cta-500));--_connotation-color-primary-text:var(--vvd-data-grid-row-cta-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-data-grid-row-cta-primary-increment,var(--vvd-color-cta-600));--_connotation-color-firm:var(--vvd-data-grid-row-cta-firm,var(--vvd-color-cta-600));--_connotation-color-faint:var(--vvd-data-grid-row-cta-faint,var(--vvd-color-cta-50));--_connotation-color-soft:var(--vvd-data-grid-row-cta-soft,var(--vvd-color-cta-100));--_connotation-color-pale:var(--vvd-data-grid-row-cta-pale,var(--vvd-color-cta-300));--_connotation-color-dim:var(--vvd-data-grid-row-cta-dim,var(--vvd-color-cta-200))}.base:not(.connotation-cta){--_connotation-color-primary:var(--vvd-data-grid-row-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-data-grid-row-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-data-grid-row-accent-primary-increment,var(--vvd-color-neutral-800));--_connotation-color-firm:var(--vvd-data-grid-row-accent-firm,var(--vvd-color-canvas-text));--_connotation-color-faint:var(--vvd-data-grid-row-accent-faint,var(--vvd-color-neutral-50));--_connotation-color-soft:var(--vvd-data-grid-row-accent-soft,var(--vvd-color-neutral-100));--_connotation-color-pale:var(--vvd-data-grid-row-accent-pale,var(--vvd-color-neutral-300));--_connotation-color-dim:var(--vvd-data-grid-row-accent-dim,var(--vvd-color-neutral-200))}.base{--_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(--_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(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}.base.selected:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}@media (hover:hover){.base.selected:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-dim);--_appearance-color-outline:transparent}}.base.selected.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-dim);--_appearance-color-outline:transparent}.base{box-sizing:border-box;width:100%;color:var(--vvd-color-canvas-text);display:grid}:host([row-type=sticky-header]) .base{z-index:9;background:var(--data-grid-row-background,var(--vvd-color-canvas));position:sticky;top:0}:host([row-type=hidden-header]) .base{display:none}:host([selected]:not([row-type*=header])) .base{background-color:var(--_appearance-color-fill)}`,b=`:host{block-size:100%;min-inline-size:80px}:host(:focus-visible){outline:none}:host([data-fixed]){z-index:5;background:var(--data-grid-cell-background,var(--vvd-color-surface-2dp));position:sticky}:host([data-fixed]):before{z-index:1;width:1px;content:"";pointer-events:none;block-size:100%;position:absolute;top:0;right:0;box-shadow:4px 0 4px #0000001a,2px 0 2px #0000000d,1px 0 1px #0000000d}.base.connotation-cta{--_connotation-color-primary:var(--vvd-data-grid-cell-cta-primary,var(--vvd-color-cta-500));--_connotation-color-primary-text:var(--vvd-data-grid-cell-cta-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-data-grid-cell-cta-primary-increment,var(--vvd-color-cta-600));--_connotation-color-firm:var(--vvd-data-grid-cell-cta-firm,var(--vvd-color-cta-600));--_connotation-color-soft:var(--vvd-data-grid-cell-cta-soft,var(--vvd-color-cta-100));--_connotation-color-faint:var(--vvd-data-grid-cell-cta-faint,var(--vvd-color-cta-50));--_connotation-color-pale:var(--vvd-data-grid-cell-cta-pale,var(--vvd-color-cta-300));--_connotation-color-dim:var(--vvd-data-grid-cell-cta-dim,var(--vvd-color-cta-200))}.base:not(.connotation-cta){--_connotation-color-primary:var(--vvd-data-grid-cell-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-data-grid-cell-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-data-grid-cell-accent-primary-increment,var(--vvd-color-neutral-800));--_connotation-color-firm:var(--vvd-data-grid-cell-accent-firm,var(--vvd-color-canvas-text));--_connotation-color-soft:var(--vvd-data-grid-cell-accent-soft,var(--vvd-color-neutral-100));--_connotation-color-faint:var(--vvd-data-grid-cell-accent-faint,var(--vvd-color-neutral-50));--_connotation-color-pale:var(--vvd-data-grid-cell-accent-pale,var(--vvd-color-neutral-300));--_connotation-color-dim:var(--vvd-data-grid-cell-accent-dim,var(--vvd-color-neutral-200))}.base{--_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(--_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(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}.base.selected:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}@media (hover:hover){.base.selected:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-dim);--_appearance-color-outline:transparent}}.base.selected.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-dim);--_appearance-color-outline:transparent}.base{box-sizing:border-box;border-bottom:1px solid var(--vvd-color-neutral-300);block-size:var(--data-grid-cell-block-size,var(--_data-grid-cell-default-block-size));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));align-items:center;padding-block:13px 14px;padding-inline:12px;display:flex}:host(:focus-visible) .base{--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([cell-type=columnheader]) .base{border-color:var(--vvd-color-canvas-text);font:var(--vvd-typography-base-bold);--_data-grid-cell-default-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 8));--_data-grid-cell-default-white-space:nowrap}:host(:not([cell-type=columnheader])) .base{--_data-grid-cell-default-block-size:100%;--_data-grid-cell-default-white-space:normal}:host([selected]:not([cell-type=columnheader])) .base{background-color:var(--_appearance-color-fill)}.content{align-items:center;display:flex;overflow:hidden}.content[role=button]{cursor:pointer}slot:not([name]){text-overflow:ellipsis;white-space:var(--data-grid-cell-white-space,var(--_data-grid-cell-default-white-space));display:block;overflow:hidden}:host(:not([cell-type=columnheader][aria-sort])) slot:not([name]){inline-size:100%}.header-icon{flex-shrink:0;margin-inline-start:16px}slot[name=action-items]{flex-shrink:0;align-items:center;display:flex}.base.has-action-items slot[name=action-items]{margin-inline-start:16px}`,x={none:`none`,singleRow:`single-row`,multiRow:`multi-row`,singleCell:`single-cell`,multiCell:`multi-cell`},S=class e extends t.t{static generateTemplateColumns(e){let t=``;return e.forEach(e=>{t=`${t}${t===``?``:` `}1fr`}),t}noTabbingChanged(){this.$fastController.isConnected&&this.#e()}#e(){this.setAttribute(`tabIndex`,this.noTabbing||this.contains(document.activeElement)?`-1`:`0`)}generateHeaderChanged(){this.$fastController.isConnected&&this.toggleGeneratedHeader()}gridTemplateColumnsChanged(){this.$fastController.isConnected&&(this.updateRowIndexes(),this.fixedColumns&&this.fixedColumns>0&&this.applyFixedColumns())}rowsDataChanged(){this.columnDefinitions===null&&this.rowsData.length>0&&(this.columnDefinitions=e.generateColumns(this.rowsData[0])),this.$fastController.isConnected&&this.toggleGeneratedHeader()}columnDefinitionsChanged(){if(this.columnDefinitions===null){this.generatedGridTemplateColumns=``;return}this.generatedGridTemplateColumns=e.generateTemplateColumns(this.columnDefinitions),this.$fastController.isConnected&&(this.columnDefinitionsStale=!0,this.queueRowIndexUpdate())}headerCellItemTemplateChanged(){this.$fastController.isConnected&&this.generatedHeader!==null&&(this.generatedHeader.headerCellItemTemplate=this.headerCellItemTemplate)}focusRowIndexChanged(){this.$fastController.isConnected&&this.queueFocusUpdate()}focusColumnIndexChanged(){this.$fastController.isConnected&&this.queueFocusUpdate()}fixedColumnsChanged(){this.$fastController.isConnected&&(this.applyFixedColumns(),this.setupResizeObserver())}setupResizeObserver(){this.resizeObserver&&=(this.resizeObserver.disconnect(),void 0),typeof ResizeObserver<`u`&&this.fixedColumns&&this.fixedColumns>0&&(this.resizeObserver=new ResizeObserver(()=>{this.applyFixedColumns()}),this.resizeObserver.observe(this))}connectedCallback(){super.connectedCallback(),this.rowItemTemplate===void 0&&(this.rowItemTemplate=this.defaultRowItemTemplate),this.behaviorOrchestrator===null&&(this.behaviorOrchestrator=t.l.create(this),this.$fastController.addBehavior(this.behaviorOrchestrator),this.behaviorOrchestrator.addBehaviorFactory(new n.t(r.t(e=>e.rowsData),r.t(e=>e.rowItemTemplate),{positioning:!0}),this.appendChild(document.createComment(``)))),this.toggleGeneratedHeader(),this.addEventListener(`row-focused`,this.handleRowFocus),this.addEventListener(m,this.handleFocus),this.addEventListener(_,this.handleKeydown),this.addEventListener(g,this.handleFocusOut),this.observer=new MutationObserver(this.onChildListChange),this.observer.observe(this,{childList:!0}),this.setupResizeObserver(),t.A.enqueue(this.queueRowIndexUpdate),this.#e(),t.E.getNotifier(this).subscribe(this.#s,`columnDefinitions`)}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener(`row-focused`,this.handleRowFocus),this.removeEventListener(m,this.handleFocus),this.removeEventListener(_,this.handleKeydown),this.removeEventListener(g,this.handleFocusOut),this.observer.disconnect(),this.resizeObserver&&=(this.resizeObserver.disconnect(),void 0),this.generatedHeader=null,t.E.getNotifier(this).unsubscribe(this.#s,`columnDefinitions`)}handleRowFocus(e){this.isUpdatingFocus=!0;let t=e.target;this.focusRowIndex=this.rowElements.indexOf(t),this.focusColumnIndex=t.focusColumnIndex,this.setAttribute(`tabIndex`,`-1`),this.isUpdatingFocus=!1}handleFocus(e){this.focusOnCell(this.focusRowIndex,this.focusColumnIndex,!0)}handleFocusOut(e){(e.relatedTarget===null||!this.contains(e.relatedTarget))&&this.setAttribute(`tabIndex`,this.noTabbing?`-1`:`0`)}handleKeydown(e){if(e.defaultPrevented)return;let t,n=this.rowElements.length-1,r=this.offsetHeight+this.scrollTop,i=this.rowElements[n];switch(e.key){case d.i:e.preventDefault(),this.focusOnCell(this.focusRowIndex-1,this.focusColumnIndex,!0);break;case d.t:e.preventDefault(),this.focusOnCell(this.focusRowIndex+1,this.focusColumnIndex,!0);break;case d.l:if(e.preventDefault(),this.rowElements.length===0){this.focusOnCell(0,0,!1);break}if(this.focusRowIndex===0){this.focusOnCell(0,this.focusColumnIndex,!1);return}for(t=this.focusRowIndex-1;t>=0;t--){let e=this.rowElements[t];if(e.offsetTop<this.scrollTop){this.scrollTop=e.offsetTop+e.clientHeight-this.clientHeight;break}}this.focusOnCell(t,this.focusColumnIndex,!1);break;case d.c:if(e.preventDefault(),this.rowElements.length===0){this.focusOnCell(0,0,!1);break}if(this.focusRowIndex>=n||i.offsetTop+i.offsetHeight<=r){this.focusOnCell(n,this.focusColumnIndex,!1);return}for(t=this.focusRowIndex+1;t<=n;t++){let e=this.rowElements[t];if(e.offsetTop+e.offsetHeight>r){let t=0;this.generateHeader===p.a.sticky&&this.generatedHeader!==null&&(t=this.generatedHeader.clientHeight),this.scrollTop=e.offsetTop-t;break}}this.focusOnCell(t,this.focusColumnIndex,!1);break;case d.s:e.ctrlKey&&(e.preventDefault(),this.focusOnCell(0,0,!0));break;case`End`:e.ctrlKey&&this.columnDefinitions!==null&&(e.preventDefault(),this.focusOnCell(this.rowElements.length-1,this.columnDefinitions.length-1,!0));break}}queueFocusUpdate(){this.isUpdatingFocus&&this.contains(document.activeElement)||this.pendingFocusUpdate===!1&&(this.pendingFocusUpdate=!0,t.A.enqueue(()=>this.updateFocus()))}updateFocus(){this.pendingFocusUpdate=!1,this.focusOnCell(this.focusRowIndex,this.focusColumnIndex,!0)}toggleGeneratedHeader(){if(this.generatedHeader!==null&&(this.removeChild(this.generatedHeader),this.generatedHeader=null),this.generateHeader!==p.a.none&&this.columnDefinitions!==null){let e=document.createElement(this.rowElementTag);this.generatedHeader=e,this.generatedHeader.columnDefinitions=this.columnDefinitions,this.generatedHeader.gridTemplateColumns=this.gridTemplateColumns,this.generatedHeader.rowType=this.generateHeader===p.a.sticky?p.i.stickyHeader:p.i.header,this.firstChild!==null&&this.insertBefore(e,this.firstChild);return}}slottedRowElementsChanged(e,t){this._resetSelection()}get#t(){return this.rowElements.filter(e=>e.selected)}get#n(){return this.rowElements.reduce((e,t)=>{let n=Array.from(t.children).filter(e=>e.selected);return e.concat(n)},[])}selectionModeChanged(e){if(e===void 0){t.A.enqueue(this._resetSelection);return}this._resetSelection(!0)}#r;#i;#a;#o;constructor(){super(),this.noTabbing=!1,this.generateHeader=p.a.default,this.rowsData=[],this.columnDefinitions=null,this.focusRowIndex=0,this.focusColumnIndex=0,this.fixedColumnsPositions=[],this.behaviorOrchestrator=null,this.generatedHeader=null,this.isUpdatingFocus=!1,this.pendingFocusUpdate=!1,this.rowindexUpdateQueued=!1,this.columnDefinitionsStale=!0,this.generatedGridTemplateColumns=``,this.focusOnCell=(e,t,n)=>{if(this.rowElements.length===0){this.focusRowIndex=0,this.focusColumnIndex=0;return}let r=Math.max(0,Math.min(this.rowElements.length-1,e)),i=this.rowElements[r].querySelectorAll(`[role="cell"], [role="gridcell"], [role="columnheader"], [role="rowheader"], [data-vvd-component="data-grid-cell"]`),a=i[Math.max(0,Math.min(i.length-1,t))];n&&this.scrollHeight!==this.clientHeight&&(r<this.focusRowIndex&&this.scrollTop>0||r>this.focusRowIndex&&this.scrollTop<this.scrollHeight-this.clientHeight)&&a.scrollIntoView({block:`center`,inline:`center`}),a.focus()},this.onChildListChange=(e,t)=>{e&&e.length&&(e.forEach(e=>{e.addedNodes.forEach(e=>{e.nodeType===1&&(e.getAttribute(`role`)===`row`||e.getAttribute(`row-type`)===`default`)&&(e.columnDefinitions=this.columnDefinitions)})}),this.queueRowIndexUpdate())},this.queueRowIndexUpdate=()=>{this.rowindexUpdateQueued||(this.rowindexUpdateQueued=!0,t.A.enqueue(this.updateRowIndexes))},this.updateRowIndexes=()=>{let e=this.gridTemplateColumns;if(e===void 0){if(this.generatedGridTemplateColumns===``&&this.rowElements.length>0){let e=this.rowElements[0];this.generatedGridTemplateColumns=Array(e.cellElements.length).fill(`1fr`).join(` `)}e=this.generatedGridTemplateColumns}this.rowElements.forEach((t,n)=>{let r=t;r.rowIndex=n,r.gridTemplateColumns=e,this.columnDefinitionsStale&&(r.columnDefinitions=this.columnDefinitions)}),this.rowindexUpdateQueued=!1,this.columnDefinitionsStale=!1},this.#r=e=>{(e.key===`Enter`||e.key===` `)&&this.#i(e)},this.#i=({target:e,ctrlKey:t,shiftKey:n,metaKey:r})=>{if(!(e.getAttribute(`role`)!==`gridcell`||e.getAttribute(`cell-type`)!==`default`)){if(this.selectionMode===x.singleCell||this.selectionMode===x.multiCell){this.#a({target:e,ctrlKey:t,shiftKey:n,metaKey:r});return}(this.selectionMode===x.singleRow||this.selectionMode===x.multiRow)&&this.#o({target:e,ctrlKey:t,shiftKey:n,metaKey:r})}},this.#a=({target:e,ctrlKey:t,shiftKey:n,metaKey:r})=>{let i=e;if(this.selectionMode===x.multiCell&&(t||n||r))i.selected=!this.#n.includes(i);else{let e=i.selected;this._resetSelection(!0),i.selected=!e}},this.#o=({target:e,ctrlKey:t,shiftKey:n,metaKey:r})=>{let i=e.parentNode;if(this.selectionMode===x.multiRow&&(t||n||r))i.selected=!this.#t.includes(i);else{let e=i.selected;this._resetSelection(!0),i.selected=!e}},this.#s={handleChange(e,t){t===`columnDefinitions`&&e.$fastController.isConnected&&e.toggleGeneratedHeader()}},this._resetSelection=(e=!1)=>{let t=Array.from(this.querySelectorAll(`[role="gridcell"], [cell-type="default"]`)),n=Array.from(this.querySelectorAll(`[role="row"], [row-type="default"]`));if(this.selectionMode===x.singleCell||this.selectionMode===x.multiCell){for(let n of t)n._selectable=!0,n.selected=e?!1:n.selected||!1;for(let e of n)e._selectable=!1,e.selected=!1}if(this.selectionMode===x.none)for(let e of[...t,...n])e._selectable=!1,e.selected=!1;if(this.selectionMode===x.singleRow||this.selectionMode===x.multiRow){for(let e of t)e._selectable=!1,e.selected=!1;for(let t of n)t._selectable=!0,t.selected=e?!1:t.selected||!1}},this.addEventListener(`click`,this.#i),this.addEventListener(`keydown`,this.#r)}#s;static generateColumns(e){return Object.keys(e).map((e,t)=>({columnDataKey:e,gridColumn:`${t}`}))}applyFixedColumns(){if(!this.fixedColumns||this.fixedColumns<=0){this.clearFixedColumns();return}this.calculateFixedColumnPositions(),this.applyFixedColumnStyling()}applyFixedColumnStyling(){this.rowElements.forEach(e=>{let t=e.querySelectorAll(`[role="cell"], [role="gridcell"], [role="columnheader"], [cell-type="default"], [cell-type="columnheader"]`);this.fixedColumnsPositions.forEach((e,n)=>{if(n<t.length){let r=t[n];typeof r.setFixedPosition==`function`&&r.setFixedPosition(`${e}px`)}})})}calculateFixedColumnPositions(){if(this.fixedColumnsPositions=[],this.rowElements.length===0)return;let e=this.rowElements[0].querySelectorAll(`[role="cell"], [role="gridcell"], [role="columnheader"], [cell-type="default"], [cell-type="columnheader"]`),t=0;for(let n=0;n<Math.min(this.fixedColumns,e.length);n++)this.fixedColumnsPositions.push(t),t+=e[n].offsetWidth}clearFixedColumns(){if(this.rowElements.length===0){this.fixedColumnsPositions=[];return}this.rowElements.forEach(e=>{let t=e.querySelectorAll(`[role="cell"], [role="gridcell"], [role="columnheader"], [cell-type="default"], [cell-type="columnheader"]`);this.fixedColumnsPositions.forEach((e,n)=>{if(n<t.length){let e=t[n];typeof e.setFixedPosition==`function`&&e.setFixedPosition(void 0)}})}),this.fixedColumnsPositions=[]}};c.t([t.u({attribute:`no-tabbing`,mode:`boolean`})],S.prototype,`noTabbing`,void 0),c.t([t.u({attribute:`generate-header`})],S.prototype,`generateHeader`,void 0),c.t([t.u({attribute:`grid-template-columns`})],S.prototype,`gridTemplateColumns`,void 0),c.t([t.D],S.prototype,`rowsData`,void 0),c.t([t.D],S.prototype,`columnDefinitions`,void 0),c.t([t.D],S.prototype,`rowItemTemplate`,void 0),c.t([t.D],S.prototype,`cellItemTemplate`,void 0),c.t([t.D],S.prototype,`headerCellItemTemplate`,void 0),c.t([t.D],S.prototype,`focusRowIndex`,void 0),c.t([t.D],S.prototype,`focusColumnIndex`,void 0),c.t([t.u({attribute:`fixed-columns`,converter:t.d})],S.prototype,`fixedColumns`,void 0),c.t([t.D],S.prototype,`defaultRowItemTemplate`,void 0),c.t([t.D],S.prototype,`rowElementTag`,void 0),c.t([t.D],S.prototype,`rowElements`,void 0),c.t([t.D],S.prototype,`slottedRowElements`,void 0),c.t([t.u({attribute:`selection-mode`})],S.prototype,`selectionMode`,void 0);var C=class extends f.t(t.t){constructor(...e){super(...e),this.rowType=p.i.default,this.rowData=null,this.columnDefinitions=null,this.behaviorOrchestrator=null,this.focusColumnIndex=0,this.updateRowStyle=()=>{this.style.gridTemplateColumns=this.gridTemplateColumns},this.ariaSelected=null,this._selectable=!1,this.selected=!1}gridTemplateColumnsChanged(){this.$fastController.isConnected&&this.updateRowStyle()}rowTypeChanged(){this.$fastController.isConnected&&this.updateItemTemplate()}cellItemTemplateChanged(){this.updateItemTemplate()}headerCellItemTemplateChanged(){this.updateItemTemplate()}connectedCallback(){super.connectedCallback(),this.behaviorOrchestrator===null&&(this.updateItemTemplate(),this.behaviorOrchestrator=t.l.create(this),this.$fastController.addBehavior(this.behaviorOrchestrator),this.behaviorOrchestrator.addBehaviorFactory(new n.t(r.t(e=>e.columnDefinitions),r.t(e=>e.activeCellItemTemplate),{positioning:!0}),this.appendChild(document.createComment(``)))),this.addEventListener(`cell-focused`,this.handleCellFocus),this.addEventListener(g,this.handleFocusout),this.addEventListener(_,this.handleKeydown),this.updateRowStyle()}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener(`cell-focused`,this.handleCellFocus),this.removeEventListener(g,this.handleFocusout),this.removeEventListener(_,this.handleKeydown)}handleFocusout(e){this.contains(document.activeElement)||(this.focusColumnIndex=0)}handleCellFocus(e){this.focusColumnIndex=this.cellElements.indexOf(e.target),this.$emit(`row-focused`,this)}handleKeydown(e){if(e.defaultPrevented)return;let t=0;switch(e.key){case d.n:t=Math.max(0,this.focusColumnIndex-1),this.cellElements[t].focus(),e.preventDefault();break;case d.r:t=Math.min(this.cellElements.length-1,this.focusColumnIndex+1),this.cellElements[t].focus(),e.preventDefault();break;case d.s:e.ctrlKey||(this.cellElements[0].focus(),e.preventDefault());break;case`End`:e.ctrlKey||(this.cellElements[this.cellElements.length-1].focus(),e.preventDefault());break}}updateItemTemplate(){this.activeCellItemTemplate=this.rowType===p.i.default&&this.cellItemTemplate!==void 0?this.cellItemTemplate:this.rowType===p.i.default&&this.cellItemTemplate===void 0?this.defaultCellItemTemplate:this.headerCellItemTemplate===void 0?this.defaultHeaderCellItemTemplate:this.headerCellItemTemplate}ariaSelectedChanged(e,t){super.ariaSelectedChanged(e,t),this._selectable=t!==null,this.selected=t===`true`}};c.t([t.u({attribute:`grid-template-columns`})],C.prototype,`gridTemplateColumns`,void 0),c.t([t.u({attribute:`row-type`})],C.prototype,`rowType`,void 0),c.t([t.D],C.prototype,`rowData`,void 0),c.t([t.D],C.prototype,`columnDefinitions`,void 0),c.t([t.D],C.prototype,`cellItemTemplate`,void 0),c.t([t.D],C.prototype,`headerCellItemTemplate`,void 0),c.t([t.D],C.prototype,`rowIndex`,void 0),c.t([t.D],C.prototype,`activeCellItemTemplate`,void 0),c.t([t.D],C.prototype,`defaultCellItemTemplate`,void 0),c.t([t.D],C.prototype,`defaultHeaderCellItemTemplate`,void 0),c.t([t.D],C.prototype,`cellElements`,void 0),c.t([t.D],C.prototype,`_selectable`,void 0),c.t([t.u({mode:`boolean`})],C.prototype,`selected`,void 0);function w(e){let n=e.tagFor(C);return t.f`
|
|
1
|
+
const e=require(`../bundled/localized.cjs`),t=require(`../bundled/vivid-element.cjs`),n=require(`../bundled/repeat.cjs`),r=require(`../bundled/slotted.cjs`),i=require(`../bundled/children.cjs`),a=require(`../bundled/when.cjs`),o=require(`../bundled/definition.cjs`),s=require(`../bundled/decorate.cjs`),c=require(`../bundled/definition2.cjs`),l=require(`../bundled/class-names.cjs`),u=require(`../bundled/key-codes.cjs`),d=require(`../bundled/host-semantics.cjs`),f=require(`../bundled/data-grid.options.cjs`);var p=`focus`,m=`focusin`,h=`focusout`,g=`keydown`,_=`:host{display:block}:host([generate-header=sticky]){max-block-size:400px}.base{--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}.base ::-webkit-scrollbar{width:4px}.base ::-webkit-scrollbar-track{background:var(--scrollbar-track-color)}.base ::-webkit-scrollbar-thumb{background-color:var(--scrollbar-fallback-track-color,var(--scrollbar-thumb-color));border:0;border-radius:4px}.base{block-size:inherit;inline-size:100%;max-block-size:inherit;position:relative;overflow:auto}`,v=`.base.connotation-cta{--_connotation-color-primary:var(--vvd-data-grid-row-cta-primary,var(--vvd-color-cta-500));--_connotation-color-primary-text:var(--vvd-data-grid-row-cta-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-data-grid-row-cta-primary-increment,var(--vvd-color-cta-600));--_connotation-color-firm:var(--vvd-data-grid-row-cta-firm,var(--vvd-color-cta-600));--_connotation-color-faint:var(--vvd-data-grid-row-cta-faint,var(--vvd-color-cta-50));--_connotation-color-soft:var(--vvd-data-grid-row-cta-soft,var(--vvd-color-cta-100));--_connotation-color-pale:var(--vvd-data-grid-row-cta-pale,var(--vvd-color-cta-300));--_connotation-color-dim:var(--vvd-data-grid-row-cta-dim,var(--vvd-color-cta-200))}.base:not(.connotation-cta){--_connotation-color-primary:var(--vvd-data-grid-row-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-data-grid-row-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-data-grid-row-accent-primary-increment,var(--vvd-color-neutral-800));--_connotation-color-firm:var(--vvd-data-grid-row-accent-firm,var(--vvd-color-canvas-text));--_connotation-color-faint:var(--vvd-data-grid-row-accent-faint,var(--vvd-color-neutral-50));--_connotation-color-soft:var(--vvd-data-grid-row-accent-soft,var(--vvd-color-neutral-100));--_connotation-color-pale:var(--vvd-data-grid-row-accent-pale,var(--vvd-color-neutral-300));--_connotation-color-dim:var(--vvd-data-grid-row-accent-dim,var(--vvd-color-neutral-200))}.base{--_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(--_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(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}.base.selected:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}@media (hover:hover){.base.selected:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-dim);--_appearance-color-outline:transparent}}.base.selected.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-dim);--_appearance-color-outline:transparent}.base{box-sizing:border-box;width:100%;color:var(--vvd-color-canvas-text);display:grid}:host([row-type=sticky-header]) .base{z-index:9;background:var(--data-grid-row-background,var(--vvd-color-canvas));position:sticky;top:0}:host([row-type=hidden-header]) .base{display:none}:host([selected]:not([row-type*=header])) .base{background-color:var(--_appearance-color-fill)}`,y=`:host{block-size:100%;min-inline-size:80px}:host(:focus-visible){outline:none}:host([data-fixed]){z-index:5;background:var(--data-grid-cell-background,var(--vvd-color-surface-2dp));position:sticky}:host([data-fixed]):before{z-index:1;width:1px;content:"";pointer-events:none;block-size:100%;position:absolute;top:0;right:0;box-shadow:4px 0 4px #0000001a,2px 0 2px #0000000d,1px 0 1px #0000000d}.base.connotation-cta{--_connotation-color-primary:var(--vvd-data-grid-cell-cta-primary,var(--vvd-color-cta-500));--_connotation-color-primary-text:var(--vvd-data-grid-cell-cta-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-data-grid-cell-cta-primary-increment,var(--vvd-color-cta-600));--_connotation-color-firm:var(--vvd-data-grid-cell-cta-firm,var(--vvd-color-cta-600));--_connotation-color-soft:var(--vvd-data-grid-cell-cta-soft,var(--vvd-color-cta-100));--_connotation-color-faint:var(--vvd-data-grid-cell-cta-faint,var(--vvd-color-cta-50));--_connotation-color-pale:var(--vvd-data-grid-cell-cta-pale,var(--vvd-color-cta-300));--_connotation-color-dim:var(--vvd-data-grid-cell-cta-dim,var(--vvd-color-cta-200))}.base:not(.connotation-cta){--_connotation-color-primary:var(--vvd-data-grid-cell-accent-primary,var(--vvd-color-canvas-text));--_connotation-color-primary-text:var(--vvd-data-grid-cell-accent-primary-text,var(--vvd-color-canvas));--_connotation-color-primary-increment:var(--vvd-data-grid-cell-accent-primary-increment,var(--vvd-color-neutral-800));--_connotation-color-firm:var(--vvd-data-grid-cell-accent-firm,var(--vvd-color-canvas-text));--_connotation-color-soft:var(--vvd-data-grid-cell-accent-soft,var(--vvd-color-neutral-100));--_connotation-color-faint:var(--vvd-data-grid-cell-accent-faint,var(--vvd-color-neutral-50));--_connotation-color-pale:var(--vvd-data-grid-cell-accent-pale,var(--vvd-color-neutral-300));--_connotation-color-dim:var(--vvd-data-grid-cell-accent-dim,var(--vvd-color-neutral-200))}.base{--_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(--_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(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-faint);--_appearance-color-outline:transparent}.base.selected:where(:not(.disabled,:disabled)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-soft);--_appearance-color-outline:transparent}@media (hover:hover){.base.selected:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-dim);--_appearance-color-outline:transparent}}.base.selected.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text:var(--_connotation-color-firm);--_appearance-color-fill:var(--_connotation-color-dim);--_appearance-color-outline:transparent}.base{box-sizing:border-box;border-bottom:1px solid var(--vvd-color-neutral-300);block-size:var(--data-grid-cell-block-size,var(--_data-grid-cell-default-block-size));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));align-items:center;padding-block:13px 14px;padding-inline:12px;display:flex}:host(:focus-visible) .base{--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([cell-type=columnheader]) .base{border-color:var(--vvd-color-canvas-text);font:var(--vvd-typography-base-bold);--_data-grid-cell-default-block-size:calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density,0), 2) + 8));--_data-grid-cell-default-white-space:nowrap}:host(:not([cell-type=columnheader])) .base{--_data-grid-cell-default-block-size:100%;--_data-grid-cell-default-white-space:normal}:host([selected]:not([cell-type=columnheader])) .base{background-color:var(--_appearance-color-fill)}.content{align-items:center;display:flex;overflow:hidden}.content[role=button]{cursor:pointer}slot:not([name]){text-overflow:ellipsis;white-space:var(--data-grid-cell-white-space,var(--_data-grid-cell-default-white-space));display:block;overflow:hidden}:host(:not([cell-type=columnheader][aria-sort])) slot:not([name]){inline-size:100%}.header-icon{flex-shrink:0;margin-inline-start:16px}slot[name=action-items]{flex-shrink:0;align-items:center;display:flex}.base.has-action-items slot[name=action-items]{margin-inline-start:16px}`,b={none:`none`,singleRow:`single-row`,multiRow:`multi-row`,singleCell:`single-cell`,multiCell:`multi-cell`},x=class e extends t.t{static generateTemplateColumns(e){let t=``;return e.forEach(e=>{t=`${t}${t===``?``:` `}1fr`}),t}noTabbingChanged(){this.$fastController.isConnected&&this.#e()}#e(){this.setAttribute(`tabIndex`,this.noTabbing||this.contains(document.activeElement)?`-1`:`0`)}generateHeaderChanged(){this.$fastController.isConnected&&this.toggleGeneratedHeader()}gridTemplateColumnsChanged(){this.$fastController.isConnected&&(this.updateRowIndexes(),this.fixedColumns&&this.fixedColumns>0&&this.applyFixedColumns())}rowsDataChanged(){this.columnDefinitions===null&&this.rowsData.length>0&&(this.columnDefinitions=e.generateColumns(this.rowsData[0])),this.$fastController.isConnected&&this.toggleGeneratedHeader()}columnDefinitionsChanged(){if(this.columnDefinitions===null){this.generatedGridTemplateColumns=``;return}this.generatedGridTemplateColumns=e.generateTemplateColumns(this.columnDefinitions),this.$fastController.isConnected&&(this.columnDefinitionsStale=!0,this.queueRowIndexUpdate())}headerCellItemTemplateChanged(){this.$fastController.isConnected&&this.generatedHeader!==null&&(this.generatedHeader.headerCellItemTemplate=this.headerCellItemTemplate)}focusRowIndexChanged(){this.$fastController.isConnected&&this.queueFocusUpdate()}focusColumnIndexChanged(){this.$fastController.isConnected&&this.queueFocusUpdate()}fixedColumnsChanged(){this.$fastController.isConnected&&(this.applyFixedColumns(),this.setupResizeObserver())}setupResizeObserver(){this.resizeObserver&&=(this.resizeObserver.disconnect(),void 0),typeof ResizeObserver<`u`&&this.fixedColumns&&this.fixedColumns>0&&(this.resizeObserver=new ResizeObserver(()=>{this.applyFixedColumns()}),this.resizeObserver.observe(this))}connectedCallback(){super.connectedCallback(),this.rowItemTemplate===void 0&&(this.rowItemTemplate=this.defaultRowItemTemplate),this.behaviorOrchestrator===null&&(this.behaviorOrchestrator=t.f.create(this),this.$fastController.addBehavior(this.behaviorOrchestrator),this.behaviorOrchestrator.addBehaviorFactory(new n.t(n.r(e=>e.rowsData),n.r(e=>e.rowItemTemplate),{positioning:!0}),this.appendChild(document.createComment(``)))),this.toggleGeneratedHeader(),this.addEventListener(`row-focused`,this.handleRowFocus),this.addEventListener(p,this.handleFocus),this.addEventListener(g,this.handleKeydown),this.addEventListener(h,this.handleFocusOut),this.observer=new MutationObserver(this.onChildListChange),this.observer.observe(this,{childList:!0}),this.setupResizeObserver(),t.M.enqueue(this.queueRowIndexUpdate),this.#e(),t.k.getNotifier(this).subscribe(this.#s,`columnDefinitions`)}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener(`row-focused`,this.handleRowFocus),this.removeEventListener(p,this.handleFocus),this.removeEventListener(g,this.handleKeydown),this.removeEventListener(h,this.handleFocusOut),this.observer.disconnect(),this.resizeObserver&&=(this.resizeObserver.disconnect(),void 0),this.generatedHeader=null,t.k.getNotifier(this).unsubscribe(this.#s,`columnDefinitions`)}handleRowFocus(e){this.isUpdatingFocus=!0;let t=e.target;this.focusRowIndex=this.rowElements.indexOf(t),this.focusColumnIndex=t.focusColumnIndex,this.setAttribute(`tabIndex`,`-1`),this.isUpdatingFocus=!1}handleFocus(e){this.focusOnCell(this.focusRowIndex,this.focusColumnIndex,!0)}handleFocusOut(e){(e.relatedTarget===null||!this.contains(e.relatedTarget))&&this.setAttribute(`tabIndex`,this.noTabbing?`-1`:`0`)}handleKeydown(e){if(e.defaultPrevented)return;let t,n=this.rowElements.length-1,r=this.offsetHeight+this.scrollTop,i=this.rowElements[n];switch(e.key){case u.i:e.preventDefault(),this.focusOnCell(this.focusRowIndex-1,this.focusColumnIndex,!0);break;case u.t:e.preventDefault(),this.focusOnCell(this.focusRowIndex+1,this.focusColumnIndex,!0);break;case u.l:if(e.preventDefault(),this.rowElements.length===0){this.focusOnCell(0,0,!1);break}if(this.focusRowIndex===0){this.focusOnCell(0,this.focusColumnIndex,!1);return}for(t=this.focusRowIndex-1;t>=0;t--){let e=this.rowElements[t];if(e.offsetTop<this.scrollTop){this.scrollTop=e.offsetTop+e.clientHeight-this.clientHeight;break}}this.focusOnCell(t,this.focusColumnIndex,!1);break;case u.c:if(e.preventDefault(),this.rowElements.length===0){this.focusOnCell(0,0,!1);break}if(this.focusRowIndex>=n||i.offsetTop+i.offsetHeight<=r){this.focusOnCell(n,this.focusColumnIndex,!1);return}for(t=this.focusRowIndex+1;t<=n;t++){let e=this.rowElements[t];if(e.offsetTop+e.offsetHeight>r){let t=0;this.generateHeader===f.a.sticky&&this.generatedHeader!==null&&(t=this.generatedHeader.clientHeight),this.scrollTop=e.offsetTop-t;break}}this.focusOnCell(t,this.focusColumnIndex,!1);break;case u.s:e.ctrlKey&&(e.preventDefault(),this.focusOnCell(0,0,!0));break;case`End`:e.ctrlKey&&this.columnDefinitions!==null&&(e.preventDefault(),this.focusOnCell(this.rowElements.length-1,this.columnDefinitions.length-1,!0));break}}queueFocusUpdate(){this.isUpdatingFocus&&this.contains(document.activeElement)||this.pendingFocusUpdate===!1&&(this.pendingFocusUpdate=!0,t.M.enqueue(()=>this.updateFocus()))}updateFocus(){this.pendingFocusUpdate=!1,this.focusOnCell(this.focusRowIndex,this.focusColumnIndex,!0)}toggleGeneratedHeader(){if(this.generatedHeader!==null&&(this.removeChild(this.generatedHeader),this.generatedHeader=null),this.generateHeader!==f.a.none&&this.columnDefinitions!==null){let e=document.createElement(this.rowElementTag);this.generatedHeader=e,this.generatedHeader.columnDefinitions=this.columnDefinitions,this.generatedHeader.gridTemplateColumns=this.gridTemplateColumns,this.generatedHeader.rowType=this.generateHeader===f.a.sticky?f.i.stickyHeader:f.i.header,this.firstChild!==null&&this.insertBefore(e,this.firstChild);return}}slottedRowElementsChanged(e,t){this._resetSelection()}get#t(){return this.rowElements.filter(e=>e.selected)}get#n(){return this.rowElements.reduce((e,t)=>{let n=Array.from(t.children).filter(e=>e.selected);return e.concat(n)},[])}selectionModeChanged(e){if(e===void 0){t.M.enqueue(this._resetSelection);return}this._resetSelection(!0)}#r;#i;#a;#o;constructor(){super(),this.noTabbing=!1,this.generateHeader=f.a.default,this.rowsData=[],this.columnDefinitions=null,this.focusRowIndex=0,this.focusColumnIndex=0,this.fixedColumnsPositions=[],this.behaviorOrchestrator=null,this.generatedHeader=null,this.isUpdatingFocus=!1,this.pendingFocusUpdate=!1,this.rowindexUpdateQueued=!1,this.columnDefinitionsStale=!0,this.generatedGridTemplateColumns=``,this.focusOnCell=(e,t,n)=>{if(this.rowElements.length===0){this.focusRowIndex=0,this.focusColumnIndex=0;return}let r=Math.max(0,Math.min(this.rowElements.length-1,e)),i=this.rowElements[r].querySelectorAll(`[role="cell"], [role="gridcell"], [role="columnheader"], [role="rowheader"], [data-vvd-component="data-grid-cell"]`),a=i[Math.max(0,Math.min(i.length-1,t))];n&&this.scrollHeight!==this.clientHeight&&(r<this.focusRowIndex&&this.scrollTop>0||r>this.focusRowIndex&&this.scrollTop<this.scrollHeight-this.clientHeight)&&a.scrollIntoView({block:`center`,inline:`center`}),a.focus()},this.onChildListChange=(e,t)=>{e&&e.length&&(e.forEach(e=>{e.addedNodes.forEach(e=>{e.nodeType===1&&(e.getAttribute(`role`)===`row`||e.getAttribute(`row-type`)===`default`)&&(e.columnDefinitions=this.columnDefinitions)})}),this.queueRowIndexUpdate())},this.queueRowIndexUpdate=()=>{this.rowindexUpdateQueued||(this.rowindexUpdateQueued=!0,t.M.enqueue(this.updateRowIndexes))},this.updateRowIndexes=()=>{let e=this.gridTemplateColumns;if(e===void 0){if(this.generatedGridTemplateColumns===``&&this.rowElements.length>0){let e=this.rowElements[0];this.generatedGridTemplateColumns=Array(e.cellElements.length).fill(`1fr`).join(` `)}e=this.generatedGridTemplateColumns}this.rowElements.forEach((t,n)=>{let r=t;r.rowIndex=n,r.gridTemplateColumns=e,this.columnDefinitionsStale&&(r.columnDefinitions=this.columnDefinitions)}),this.rowindexUpdateQueued=!1,this.columnDefinitionsStale=!1},this.#r=e=>{(e.key===`Enter`||e.key===` `)&&this.#i(e)},this.#i=({target:e,ctrlKey:t,shiftKey:n,metaKey:r})=>{if(!(e.getAttribute(`role`)!==`gridcell`||e.getAttribute(`cell-type`)!==`default`)){if(this.selectionMode===b.singleCell||this.selectionMode===b.multiCell){this.#a({target:e,ctrlKey:t,shiftKey:n,metaKey:r});return}(this.selectionMode===b.singleRow||this.selectionMode===b.multiRow)&&this.#o({target:e,ctrlKey:t,shiftKey:n,metaKey:r})}},this.#a=({target:e,ctrlKey:t,shiftKey:n,metaKey:r})=>{let i=e;if(this.selectionMode===b.multiCell&&(t||n||r))i.selected=!this.#n.includes(i);else{let e=i.selected;this._resetSelection(!0),i.selected=!e}},this.#o=({target:e,ctrlKey:t,shiftKey:n,metaKey:r})=>{let i=e.parentNode;if(this.selectionMode===b.multiRow&&(t||n||r))i.selected=!this.#t.includes(i);else{let e=i.selected;this._resetSelection(!0),i.selected=!e}},this.#s={handleChange(e,t){t===`columnDefinitions`&&e.$fastController.isConnected&&e.toggleGeneratedHeader()}},this._resetSelection=(e=!1)=>{let t=Array.from(this.querySelectorAll(`[role="gridcell"], [cell-type="default"]`)),n=Array.from(this.querySelectorAll(`[role="row"], [row-type="default"]`));if(this.selectionMode===b.singleCell||this.selectionMode===b.multiCell){for(let n of t)n._selectable=!0,n.selected=e?!1:n.selected||!1;for(let e of n)e._selectable=!1,e.selected=!1}if(this.selectionMode===b.none)for(let e of[...t,...n])e._selectable=!1,e.selected=!1;if(this.selectionMode===b.singleRow||this.selectionMode===b.multiRow){for(let e of t)e._selectable=!1,e.selected=!1;for(let t of n)t._selectable=!0,t.selected=e?!1:t.selected||!1}},this.addEventListener(`click`,this.#i),this.addEventListener(`keydown`,this.#r)}#s;static generateColumns(e){return Object.keys(e).map((e,t)=>({columnDataKey:e,gridColumn:`${t}`}))}applyFixedColumns(){if(!this.fixedColumns||this.fixedColumns<=0){this.clearFixedColumns();return}this.calculateFixedColumnPositions(),this.applyFixedColumnStyling()}applyFixedColumnStyling(){this.rowElements.forEach(e=>{let t=e.querySelectorAll(`[role="cell"], [role="gridcell"], [role="columnheader"], [cell-type="default"], [cell-type="columnheader"]`);this.fixedColumnsPositions.forEach((e,n)=>{if(n<t.length){let r=t[n];typeof r.setFixedPosition==`function`&&r.setFixedPosition(`${e}px`)}})})}calculateFixedColumnPositions(){if(this.fixedColumnsPositions=[],this.rowElements.length===0)return;let e=this.rowElements[0].querySelectorAll(`[role="cell"], [role="gridcell"], [role="columnheader"], [cell-type="default"], [cell-type="columnheader"]`),t=0;for(let n=0;n<Math.min(this.fixedColumns,e.length);n++)this.fixedColumnsPositions.push(t),t+=e[n].offsetWidth}clearFixedColumns(){if(this.rowElements.length===0){this.fixedColumnsPositions=[];return}this.rowElements.forEach(e=>{let t=e.querySelectorAll(`[role="cell"], [role="gridcell"], [role="columnheader"], [cell-type="default"], [cell-type="columnheader"]`);this.fixedColumnsPositions.forEach((e,n)=>{if(n<t.length){let e=t[n];typeof e.setFixedPosition==`function`&&e.setFixedPosition(void 0)}})}),this.fixedColumnsPositions=[]}};s.t([t.m({attribute:`no-tabbing`,mode:`boolean`})],x.prototype,`noTabbing`,void 0),s.t([t.m({attribute:`generate-header`})],x.prototype,`generateHeader`,void 0),s.t([t.m({attribute:`grid-template-columns`})],x.prototype,`gridTemplateColumns`,void 0),s.t([t.A],x.prototype,`rowsData`,void 0),s.t([t.A],x.prototype,`columnDefinitions`,void 0),s.t([t.A],x.prototype,`rowItemTemplate`,void 0),s.t([t.A],x.prototype,`cellItemTemplate`,void 0),s.t([t.A],x.prototype,`headerCellItemTemplate`,void 0),s.t([t.A],x.prototype,`focusRowIndex`,void 0),s.t([t.A],x.prototype,`focusColumnIndex`,void 0),s.t([t.m({attribute:`fixed-columns`,converter:t.h})],x.prototype,`fixedColumns`,void 0),s.t([t.A],x.prototype,`defaultRowItemTemplate`,void 0),s.t([t.A],x.prototype,`rowElementTag`,void 0),s.t([t.A],x.prototype,`rowElements`,void 0),s.t([t.A],x.prototype,`slottedRowElements`,void 0),s.t([t.m({attribute:`selection-mode`})],x.prototype,`selectionMode`,void 0);var S=class extends d.t(t.t){constructor(...e){super(...e),this.rowType=f.i.default,this.rowData=null,this.columnDefinitions=null,this.behaviorOrchestrator=null,this.focusColumnIndex=0,this.updateRowStyle=()=>{this.style.gridTemplateColumns=this.gridTemplateColumns},this.ariaSelected=null,this._selectable=!1,this.selected=!1}gridTemplateColumnsChanged(){this.$fastController.isConnected&&this.updateRowStyle()}rowTypeChanged(){this.$fastController.isConnected&&this.updateItemTemplate()}cellItemTemplateChanged(){this.updateItemTemplate()}headerCellItemTemplateChanged(){this.updateItemTemplate()}connectedCallback(){super.connectedCallback(),this.behaviorOrchestrator===null&&(this.updateItemTemplate(),this.behaviorOrchestrator=t.f.create(this),this.$fastController.addBehavior(this.behaviorOrchestrator),this.behaviorOrchestrator.addBehaviorFactory(new n.t(n.r(e=>e.columnDefinitions),n.r(e=>e.activeCellItemTemplate),{positioning:!0}),this.appendChild(document.createComment(``)))),this.addEventListener(`cell-focused`,this.handleCellFocus),this.addEventListener(h,this.handleFocusout),this.addEventListener(g,this.handleKeydown),this.updateRowStyle()}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener(`cell-focused`,this.handleCellFocus),this.removeEventListener(h,this.handleFocusout),this.removeEventListener(g,this.handleKeydown)}handleFocusout(e){this.contains(document.activeElement)||(this.focusColumnIndex=0)}handleCellFocus(e){this.focusColumnIndex=this.cellElements.indexOf(e.target),this.$emit(`row-focused`,this)}handleKeydown(e){if(e.defaultPrevented)return;let t=0;switch(e.key){case u.n:t=Math.max(0,this.focusColumnIndex-1),this.cellElements[t].focus(),e.preventDefault();break;case u.r:t=Math.min(this.cellElements.length-1,this.focusColumnIndex+1),this.cellElements[t].focus(),e.preventDefault();break;case u.s:e.ctrlKey||(this.cellElements[0].focus(),e.preventDefault());break;case`End`:e.ctrlKey||(this.cellElements[this.cellElements.length-1].focus(),e.preventDefault());break}}updateItemTemplate(){this.activeCellItemTemplate=this.rowType===f.i.default&&this.cellItemTemplate!==void 0?this.cellItemTemplate:this.rowType===f.i.default&&this.cellItemTemplate===void 0?this.defaultCellItemTemplate:this.headerCellItemTemplate===void 0?this.defaultHeaderCellItemTemplate:this.headerCellItemTemplate}ariaSelectedChanged(e,t){super.ariaSelectedChanged(e,t),this._selectable=t!==null,this.selected=t===`true`}};s.t([t.m({attribute:`grid-template-columns`})],S.prototype,`gridTemplateColumns`,void 0),s.t([t.m({attribute:`row-type`})],S.prototype,`rowType`,void 0),s.t([t.A],S.prototype,`rowData`,void 0),s.t([t.A],S.prototype,`columnDefinitions`,void 0),s.t([t.A],S.prototype,`cellItemTemplate`,void 0),s.t([t.A],S.prototype,`headerCellItemTemplate`,void 0),s.t([t.A],S.prototype,`rowIndex`,void 0),s.t([t.A],S.prototype,`activeCellItemTemplate`,void 0),s.t([t.A],S.prototype,`defaultCellItemTemplate`,void 0),s.t([t.A],S.prototype,`defaultHeaderCellItemTemplate`,void 0),s.t([t.A],S.prototype,`cellElements`,void 0),s.t([t.A],S.prototype,`_selectable`,void 0),s.t([t.m({mode:`boolean`})],S.prototype,`selected`,void 0);function C(e){let n=e.tagFor(S);return t.p`
|
|
2
2
|
<${n}
|
|
3
3
|
:rowData="${e=>e}"
|
|
4
4
|
:cellItemTemplate="${(e,t)=>t.parent.cellItemTemplate}"
|
|
5
5
|
:headerCellItemTemplate="${(e,t)=>t.parent.headerCellItemTemplate}"
|
|
6
6
|
></${n}>
|
|
7
|
-
`}function
|
|
7
|
+
`}function w(e){return e.selectionMode===void 0||e.selectionMode===b.none?null:e.selectionMode.includes(`multi`)?`true`:`false`}function T(e){if(e.columnDefinitions===null){let t=e.querySelector(`[cell-type="columnheader"]`)?.parentElement;if(e.generateHeader===f.a.default&&(t?.getAttribute(`row-type`)===f.i.header||t?.getAttribute(`row-type`)===f.i.stickyHeader))return;if(t){let n=e.generateHeader===f.a.sticky?f.i.stickyHeader:f.i.header;t.setAttribute(`row-type`,n)}}}function E(e,{event:t}){t.stopPropagation()}var D=e=>{let n=C(e),a=e.tagFor(S,!0);return t.p`
|
|
8
8
|
<template
|
|
9
|
-
aria-multiselectable="${
|
|
9
|
+
aria-multiselectable="${w}"
|
|
10
10
|
role="grid"
|
|
11
11
|
tabindex="0"
|
|
12
|
-
@sort="${
|
|
13
|
-
:rowElementTag="${()=>
|
|
12
|
+
@sort="${E}"
|
|
13
|
+
:rowElementTag="${()=>a}"
|
|
14
14
|
:defaultRowItemTemplate="${n}"
|
|
15
|
-
${
|
|
15
|
+
${i.t({property:`rowElements`,filter:r.r(`[role=row],[data-vvd-component=data-grid-row]`)})}
|
|
16
16
|
>
|
|
17
17
|
<div class="base">
|
|
18
|
-
${
|
|
19
|
-
<slot ${
|
|
18
|
+
${T}
|
|
19
|
+
<slot ${r.t(`slottedRowElements`)}></slot>
|
|
20
20
|
</div>
|
|
21
21
|
</template>
|
|
22
|
-
`},
|
|
22
|
+
`},O=t.p`
|
|
23
23
|
<template>
|
|
24
24
|
${e=>e.rowData===null||e.columnDefinition===null||e.columnDefinition.columnDataKey===null?null:e.rowData[e.columnDefinition.columnDataKey]}
|
|
25
25
|
</template>
|
|
26
|
-
`,
|
|
26
|
+
`,k=t.p`
|
|
27
27
|
<template>
|
|
28
28
|
${e=>e.columnDefinition.title===void 0?e.columnDefinition.columnDataKey:e.columnDefinition.title}
|
|
29
29
|
</template>
|
|
30
|
-
`,
|
|
30
|
+
`,A=class extends e.t(d.t(t.t)){constructor(...e){super(...e),this.cellType=f.r.default,this.rowData=null,this.columnDefinition=null,this.isActiveCell=!1,this.customCellView=null,this.updateCellStyle=()=>{this.gridColumn&&!this.gridColumn.includes(`undefined`)?this.style.gridColumn=this.gridColumn:this.style.removeProperty(`grid-column`)},this._selectable=!1,this.selected=!1,this.ariaSelected=null,this.ariaSort=null}cellTypeChanged(){this.$fastController.isConnected&&this.updateCellView()}gridColumnChanged(){this.$fastController.isConnected&&this.updateCellStyle()}columnDefinitionChanged(e,t){this.$fastController.isConnected&&this.updateCellView()}updateFixedStyle(){this.fixedPosition===void 0?(this.removeAttribute(`data-fixed`),this.style.removeProperty(`left`)):(this.setAttribute(`data-fixed`,``),this.style.left=this.fixedPosition)}setFixedPosition(e){this.fixedPosition=e,this.updateFixedStyle()}connectedCallback(){super.connectedCallback(),this.addEventListener(m,this.handleFocusin),this.addEventListener(h,this.handleFocusout),this.addEventListener(g,this.handleKeydown),this.style.gridColumn=`${this.columnDefinition?.gridColumn===void 0?0:this.columnDefinition.gridColumn}`,this.updateCellView(),this.updateCellStyle(),this.updateFixedStyle()}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener(m,this.handleFocusin),this.removeEventListener(h,this.handleFocusout),this.removeEventListener(g,this.handleKeydown),this.disconnectCellView()}handleFocusin(e){if(this.shadowRoot.querySelector(`.base`).classList.add(`active`),!this.isActiveCell){switch(this.isActiveCell=!0,this.cellType){case f.r.columnHeader:if(this.columnDefinition!==null&&this.columnDefinition.headerCellInternalFocusQueue!==!0&&typeof this.columnDefinition.headerCellFocusTargetCallback==`function`){let e=this.columnDefinition.headerCellFocusTargetCallback(this);e!==null&&e.focus()}break;default:if(this.columnDefinition!==null&&this.columnDefinition.cellInternalFocusQueue!==!0&&typeof this.columnDefinition.cellFocusTargetCallback==`function`){let e=this.columnDefinition.cellFocusTargetCallback(this);e!==null&&e.focus()}break}this.$emit(`cell-focused`,this)}}handleFocusout(e){this.shadowRoot.querySelector(`.base`).classList.remove(`active`),this!==document.activeElement&&!this.contains(document.activeElement)&&(this.isActiveCell=!1)}handleKeydown(e){if(!(e.defaultPrevented||this.columnDefinition===null||this.cellType===f.r.default&&this.columnDefinition.cellInternalFocusQueue!==!0||this.cellType===f.r.columnHeader&&this.columnDefinition.headerCellInternalFocusQueue!==!0))switch(e.key){case u.a:case`F2`:if(this.contains(document.activeElement)&&document.activeElement!==this)return;switch(this.cellType){case f.r.columnHeader:if(this.columnDefinition.headerCellFocusTargetCallback!==void 0){let t=this.columnDefinition.headerCellFocusTargetCallback(this);t!==null&&t.focus(),e.preventDefault()}break;default:if(this.columnDefinition.cellFocusTargetCallback!==void 0){let t=this.columnDefinition.cellFocusTargetCallback(this);t!==null&&t.focus(),e.preventDefault()}break}break;case u.o:this.contains(document.activeElement)&&document.activeElement!==this&&(this.focus(),e.preventDefault());break}}updateCellView(){if(this.disconnectCellView(),this.columnDefinition!==null){switch(this.cellType){case f.r.columnHeader:this.columnDefinition.headerCellTemplate===void 0?this.customCellView=k.render(this,this):this.customCellView=this.columnDefinition.headerCellTemplate.render(this,this);break;case f.r.rowHeader:case f.r.default:this.columnDefinition.cellTemplate===void 0?this.customCellView=O.render(this,this):this.customCellView=this.columnDefinition.cellTemplate.render(this,this);break}this.columnDefinition?.sortable?this.columnDefinition.sortDirection?this.sortDirection=this.columnDefinition.sortDirection:this.sortDirection=f.n.none:this.sortDirection=void 0}}disconnectCellView(){this.customCellView!==null&&(this.customCellView.dispose(),this.customCellView=null)}ariaSelectedChanged(e,t){super.ariaSelectedChanged(e,t),this._selectable=t!==null,this.selected=t===`true`}ariaSortChanged(e,t){if(super.ariaSortChanged(e,t),t===null){this.sortDirection=void 0;return}this.sortDirection=t}#e(){return this.columnDefinition&&this.columnDefinition.columnDataKey?this.columnDefinition.columnDataKey:this.textContent.trim()}_handleInteraction(){let e=this.cellType===`columnheader`;return e&&this.sortDirection!==void 0&&this.$emit(`sort`,{columnDataKey:this.#e(),sortDirection:this.sortDirection}),(e?this.columnDefinition?.headerCellInternalFocusQueue:this.columnDefinition?.cellInternalFocusQueue)||this.$emit(`cell-click`,{cell:this,row:this.parentElement,isHeaderCell:e,columnDataKey:this.#e()}),!0}};s.t([t.m({attribute:`cell-type`})],A.prototype,`cellType`,void 0),s.t([t.m({attribute:`grid-column`})],A.prototype,`gridColumn`,void 0),s.t([t.A],A.prototype,`rowData`,void 0),s.t([t.A],A.prototype,`columnDefinition`,void 0),s.t([t.A],A.prototype,`_selectable`,void 0),s.t([t.m({mode:`boolean`})],A.prototype,`selected`,void 0),s.t([t.m({attribute:`sort-direction`})],A.prototype,`sortDirection`,void 0),s.t([t.A],A.prototype,`_actionItemsSlottedContent`,void 0);function j(e){return e._selectable&&e.selected?`true`:e._selectable&&!e.selected?`false`:null}function M(e){let n=e.tagFor(A);return t.p`
|
|
31
31
|
<${n}
|
|
32
32
|
cell-type="${e=>e.isRowHeader?`rowheader`:void 0}"
|
|
33
33
|
grid-column="${(e,t)=>t.index+1}"
|
|
@@ -35,67 +35,67 @@ const e=require(`../bundled/localized.cjs`),t=require(`../bundled/vivid-element.
|
|
|
35
35
|
:columnDefinition="${e=>e}"
|
|
36
36
|
selected="${(e,t)=>t.parent.ariaSelected===`true`?!0:null}"
|
|
37
37
|
></${n}>
|
|
38
|
-
`}function
|
|
38
|
+
`}function N(e){let n=e.tagFor(A);return t.p`
|
|
39
39
|
<${n}
|
|
40
40
|
cell-type="columnheader"
|
|
41
41
|
grid-column="${(e,t)=>t.index+1}"
|
|
42
42
|
:columnDefinition="${e=>e}"
|
|
43
43
|
></${n}>
|
|
44
|
-
`}var
|
|
44
|
+
`}var P=e=>{let n=M(e),a=N(e);return t.p`
|
|
45
45
|
<template
|
|
46
|
-
${
|
|
46
|
+
${d.n({role:`row`,ariaSelected:j})}
|
|
47
47
|
class="${e=>e.rowType===`default`?``:e.rowType}"
|
|
48
48
|
:defaultCellItemTemplate="${n}"
|
|
49
|
-
:defaultHeaderCellItemTemplate="${
|
|
50
|
-
${
|
|
49
|
+
:defaultHeaderCellItemTemplate="${a}"
|
|
50
|
+
${i.t({property:`cellElements`,filter:r.r(`[role="cell"],[role="gridcell"],[role="columnheader"],[role="rowheader"],[data-vvd-component="data-grid-cell"]`)})}
|
|
51
51
|
>
|
|
52
52
|
<div
|
|
53
|
-
class="${e=>
|
|
53
|
+
class="${e=>l.t(`base`,[`selected`,!!e.selected])}"
|
|
54
54
|
style="grid-template-columns: ${e=>e.gridTemplateColumns};"
|
|
55
55
|
>
|
|
56
|
-
<slot ${
|
|
56
|
+
<slot ${r.t(`slottedCellElements`)}></slot>
|
|
57
57
|
</div>
|
|
58
58
|
</template>
|
|
59
|
-
`};function
|
|
60
|
-
${
|
|
61
|
-
<${n} class="header-icon" name="${
|
|
59
|
+
`};function F(e){return e.cellType===`columnheader`&&e.sortDirection!==void 0&&e.sortDirection!==f.n.other}function I(e){return e.sortDirection===f.n.ascending?`sort-asc-solid`:e.sortDirection===f.n.descending?`sort-desc-solid`:`sort-solid`}function L(e){return e._selectable&&e.selected?`true`:e._selectable&&!e.selected?`false`:null}function R(e){let n=e.tagFor(c.r);return t.p`
|
|
60
|
+
${a.t(F,t.p`
|
|
61
|
+
<${n} class="header-icon" name="${I}"></${n}>
|
|
62
62
|
`)}
|
|
63
|
-
`}function
|
|
63
|
+
`}function z(e){return e.cellType===f.r.columnHeader&&e.sortDirection!==void 0}function B(e){return e.sortDirection??f.n.none}function V(e){let t=B(e);return e.locale.dataGrid.cell.sortStatus?.[t]}function H(e){let t=B(e);return e.locale.dataGrid.cell.sortInstruction?.[t]}function U(e){return[V(e),H(e)].filter(e=>!!e).join(` `).trim()}function W(e,t){if(t.key===`Enter`||t.key===` `){if(t.target.closest(`[slot="action-items"]`))return!0;e._handleInteraction()}return!0}function G(e,t){return t.target.closest(`[slot="action-items"]`)||e._handleInteraction(),!0}var K=t.u(`data-grid-cell`,A,e=>{let n=e.tagFor(o.r);return t.p`
|
|
64
64
|
<template
|
|
65
65
|
tabindex="-1"
|
|
66
|
-
${
|
|
67
|
-
@click="${(e,t)=>
|
|
68
|
-
@keydown="${(e,t)=>
|
|
66
|
+
${d.n({role:e=>f.t[e.cellType]??f.t.default,ariaSelected:L,ariaSort:e=>e.sortDirection??null})}
|
|
67
|
+
@click="${(e,t)=>G(e,t.event)}"
|
|
68
|
+
@keydown="${(e,t)=>W(e,t.event)}"
|
|
69
69
|
>
|
|
70
|
-
<div class="${({selected:e,_actionItemsSlottedContent:t})=>
|
|
70
|
+
<div class="${({selected:e,_actionItemsSlottedContent:t})=>l.t(`base`,[`selected`,!!e],[`has-action-items`,!!t?.length])}">
|
|
71
71
|
<div
|
|
72
72
|
class="content"
|
|
73
|
-
role="${e=>
|
|
73
|
+
role="${e=>F(e)?`button`:void 0}"
|
|
74
74
|
>
|
|
75
|
-
${e=>e.selected?t.
|
|
75
|
+
${e=>e.selected?t.p`<${n}
|
|
76
76
|
data-announcement="selection"
|
|
77
77
|
>
|
|
78
78
|
${e=>e.locale.dataGrid.cell.selected}
|
|
79
79
|
</${n}>`:null}
|
|
80
80
|
<slot></slot>
|
|
81
|
-
${
|
|
81
|
+
${a.t(F,t.p`<${n}
|
|
82
82
|
data-announcement="button-role"
|
|
83
83
|
>
|
|
84
84
|
${e=>e.locale.dataGrid.cell.button}
|
|
85
85
|
</${n}>
|
|
86
86
|
`)}
|
|
87
|
-
${
|
|
87
|
+
${a.t(z,t.p`<${n}
|
|
88
88
|
aria-live="polite"
|
|
89
89
|
data-announcement="sort-state"
|
|
90
90
|
>
|
|
91
|
-
${
|
|
91
|
+
${U}
|
|
92
92
|
</${n}>`)}
|
|
93
|
-
${t=>
|
|
93
|
+
${t=>R(e)}
|
|
94
94
|
</div>
|
|
95
95
|
<slot
|
|
96
96
|
name="action-items"
|
|
97
|
-
${
|
|
97
|
+
${r.t(`_actionItemsSlottedContent`)}
|
|
98
98
|
></slot>
|
|
99
99
|
</div>
|
|
100
100
|
</template>
|
|
101
|
-
`},[
|
|
101
|
+
`},[c.t,o.n],{styles:y}),q=t.u(`data-grid-row`,S,P,[K],{styles:v}),J=t.u(`data-grid`,x,D,[q],{styles:_});t.d(J)();
|
package/data-grid/index.js
CHANGED
|
@@ -1,10 +1,9 @@
|
|
|
1
1
|
import { t as e } from "../bundled/localized.js";
|
|
2
|
-
import { A as t,
|
|
3
|
-
import {
|
|
4
|
-
import { t as
|
|
5
|
-
import { t as
|
|
6
|
-
import {
|
|
7
|
-
import { t as g } from "../bundled/children.js";
|
|
2
|
+
import { A as t, M as n, d as r, f as i, h as a, k as o, m as s, p as c, t as l, u } from "../bundled/vivid-element.js";
|
|
3
|
+
import { r as d, t as f } from "../bundled/repeat.js";
|
|
4
|
+
import { r as p, t as m } from "../bundled/slotted.js";
|
|
5
|
+
import { t as h } from "../bundled/children.js";
|
|
6
|
+
import { t as g } from "../bundled/when.js";
|
|
8
7
|
import { n as _, r as v } from "../bundled/definition.js";
|
|
9
8
|
import { t as y } from "../bundled/decorate.js";
|
|
10
9
|
import { r as b, t as x } from "../bundled/definition2.js";
|
|
@@ -70,10 +69,10 @@ var I = "focus", L = "focusin", R = "focusout", z = "keydown", B = ":host{displa
|
|
|
70
69
|
}), this.resizeObserver.observe(this));
|
|
71
70
|
}
|
|
72
71
|
connectedCallback() {
|
|
73
|
-
super.connectedCallback(), this.rowItemTemplate === void 0 && (this.rowItemTemplate = this.defaultRowItemTemplate), this.behaviorOrchestrator === null && (this.behaviorOrchestrator =
|
|
72
|
+
super.connectedCallback(), this.rowItemTemplate === void 0 && (this.rowItemTemplate = this.defaultRowItemTemplate), this.behaviorOrchestrator === null && (this.behaviorOrchestrator = i.create(this), this.$fastController.addBehavior(this.behaviorOrchestrator), this.behaviorOrchestrator.addBehaviorFactory(new f(d((e) => e.rowsData), d((e) => e.rowItemTemplate), { positioning: !0 }), this.appendChild(document.createComment("")))), this.toggleGeneratedHeader(), this.addEventListener("row-focused", this.handleRowFocus), this.addEventListener(I, this.handleFocus), this.addEventListener(z, this.handleKeydown), this.addEventListener(R, this.handleFocusOut), this.observer = new MutationObserver(this.onChildListChange), this.observer.observe(this, { childList: !0 }), this.setupResizeObserver(), n.enqueue(this.queueRowIndexUpdate), this.#e(), o.getNotifier(this).subscribe(this.#s, "columnDefinitions");
|
|
74
73
|
}
|
|
75
74
|
disconnectedCallback() {
|
|
76
|
-
super.disconnectedCallback(), this.removeEventListener("row-focused", this.handleRowFocus), this.removeEventListener(I, this.handleFocus), this.removeEventListener(z, this.handleKeydown), this.removeEventListener(R, this.handleFocusOut), this.observer.disconnect(), this.resizeObserver &&= (this.resizeObserver.disconnect(), void 0), this.generatedHeader = null,
|
|
75
|
+
super.disconnectedCallback(), this.removeEventListener("row-focused", this.handleRowFocus), this.removeEventListener(I, this.handleFocus), this.removeEventListener(z, this.handleKeydown), this.removeEventListener(R, this.handleFocusOut), this.observer.disconnect(), this.resizeObserver &&= (this.resizeObserver.disconnect(), void 0), this.generatedHeader = null, o.getNotifier(this).unsubscribe(this.#s, "columnDefinitions");
|
|
77
76
|
}
|
|
78
77
|
handleRowFocus(e) {
|
|
79
78
|
this.isUpdatingFocus = !0;
|
|
@@ -144,7 +143,7 @@ var I = "focus", L = "focusin", R = "focusout", z = "keydown", B = ":host{displa
|
|
|
144
143
|
}
|
|
145
144
|
}
|
|
146
145
|
queueFocusUpdate() {
|
|
147
|
-
this.isUpdatingFocus && this.contains(document.activeElement) || this.pendingFocusUpdate === !1 && (this.pendingFocusUpdate = !0,
|
|
146
|
+
this.isUpdatingFocus && this.contains(document.activeElement) || this.pendingFocusUpdate === !1 && (this.pendingFocusUpdate = !0, n.enqueue(() => this.updateFocus()));
|
|
148
147
|
}
|
|
149
148
|
updateFocus() {
|
|
150
149
|
this.pendingFocusUpdate = !1, this.focusOnCell(this.focusRowIndex, this.focusColumnIndex, !0);
|
|
@@ -171,7 +170,7 @@ var I = "focus", L = "focusin", R = "focusout", z = "keydown", B = ":host{displa
|
|
|
171
170
|
}
|
|
172
171
|
selectionModeChanged(e) {
|
|
173
172
|
if (e === void 0) {
|
|
174
|
-
|
|
173
|
+
n.enqueue(this._resetSelection);
|
|
175
174
|
return;
|
|
176
175
|
}
|
|
177
176
|
this._resetSelection(!0);
|
|
@@ -199,7 +198,7 @@ var I = "focus", L = "focusin", R = "focusout", z = "keydown", B = ":host{displa
|
|
|
199
198
|
});
|
|
200
199
|
}), this.queueRowIndexUpdate());
|
|
201
200
|
}, this.queueRowIndexUpdate = () => {
|
|
202
|
-
this.rowindexUpdateQueued || (this.rowindexUpdateQueued = !0,
|
|
201
|
+
this.rowindexUpdateQueued || (this.rowindexUpdateQueued = !0, n.enqueue(this.updateRowIndexes));
|
|
203
202
|
}, this.updateRowIndexes = () => {
|
|
204
203
|
let e = this.gridTemplateColumns;
|
|
205
204
|
if (e === void 0) {
|
|
@@ -313,13 +312,13 @@ var I = "focus", L = "focusin", R = "focusout", z = "keydown", B = ":host{displa
|
|
|
313
312
|
}), this.fixedColumnsPositions = [];
|
|
314
313
|
}
|
|
315
314
|
};
|
|
316
|
-
y([
|
|
315
|
+
y([s({
|
|
317
316
|
attribute: "no-tabbing",
|
|
318
317
|
mode: "boolean"
|
|
319
|
-
})], W.prototype, "noTabbing", void 0), y([
|
|
318
|
+
})], W.prototype, "noTabbing", void 0), y([s({ attribute: "generate-header" })], W.prototype, "generateHeader", void 0), y([s({ attribute: "grid-template-columns" })], W.prototype, "gridTemplateColumns", void 0), y([t], W.prototype, "rowsData", void 0), y([t], W.prototype, "columnDefinitions", void 0), y([t], W.prototype, "rowItemTemplate", void 0), y([t], W.prototype, "cellItemTemplate", void 0), y([t], W.prototype, "headerCellItemTemplate", void 0), y([t], W.prototype, "focusRowIndex", void 0), y([t], W.prototype, "focusColumnIndex", void 0), y([s({
|
|
320
319
|
attribute: "fixed-columns",
|
|
321
320
|
converter: a
|
|
322
|
-
})], W.prototype, "fixedColumns", void 0), y([
|
|
321
|
+
})], W.prototype, "fixedColumns", void 0), y([t], W.prototype, "defaultRowItemTemplate", void 0), y([t], W.prototype, "rowElementTag", void 0), y([t], W.prototype, "rowElements", void 0), y([t], W.prototype, "slottedRowElements", void 0), y([s({ attribute: "selection-mode" })], W.prototype, "selectionMode", void 0);
|
|
323
322
|
//#endregion
|
|
324
323
|
//#region src/lib/data-grid/data-grid-row.ts
|
|
325
324
|
var G = class extends A(l) {
|
|
@@ -341,7 +340,7 @@ var G = class extends A(l) {
|
|
|
341
340
|
this.updateItemTemplate();
|
|
342
341
|
}
|
|
343
342
|
connectedCallback() {
|
|
344
|
-
super.connectedCallback(), this.behaviorOrchestrator === null && (this.updateItemTemplate(), this.behaviorOrchestrator =
|
|
343
|
+
super.connectedCallback(), this.behaviorOrchestrator === null && (this.updateItemTemplate(), this.behaviorOrchestrator = i.create(this), this.$fastController.addBehavior(this.behaviorOrchestrator), this.behaviorOrchestrator.addBehaviorFactory(new f(d((e) => e.columnDefinitions), d((e) => e.activeCellItemTemplate), { positioning: !0 }), this.appendChild(document.createComment("")))), this.addEventListener("cell-focused", this.handleCellFocus), this.addEventListener(R, this.handleFocusout), this.addEventListener(z, this.handleKeydown), this.updateRowStyle();
|
|
345
344
|
}
|
|
346
345
|
disconnectedCallback() {
|
|
347
346
|
super.disconnectedCallback(), this.removeEventListener("cell-focused", this.handleCellFocus), this.removeEventListener(R, this.handleFocusout), this.removeEventListener(z, this.handleKeydown);
|
|
@@ -378,12 +377,12 @@ var G = class extends A(l) {
|
|
|
378
377
|
super.ariaSelectedChanged(e, t), this._selectable = t !== null, this.selected = t === "true";
|
|
379
378
|
}
|
|
380
379
|
};
|
|
381
|
-
y([
|
|
380
|
+
y([s({ attribute: "grid-template-columns" })], G.prototype, "gridTemplateColumns", void 0), y([s({ attribute: "row-type" })], G.prototype, "rowType", void 0), y([t], G.prototype, "rowData", void 0), y([t], G.prototype, "columnDefinitions", void 0), y([t], G.prototype, "cellItemTemplate", void 0), y([t], G.prototype, "headerCellItemTemplate", void 0), y([t], G.prototype, "rowIndex", void 0), y([t], G.prototype, "activeCellItemTemplate", void 0), y([t], G.prototype, "defaultCellItemTemplate", void 0), y([t], G.prototype, "defaultHeaderCellItemTemplate", void 0), y([t], G.prototype, "cellElements", void 0), y([t], G.prototype, "_selectable", void 0), y([s({ mode: "boolean" })], G.prototype, "selected", void 0);
|
|
382
381
|
//#endregion
|
|
383
382
|
//#region src/lib/data-grid/data-grid.template.ts
|
|
384
383
|
function K(e) {
|
|
385
384
|
let t = e.tagFor(G);
|
|
386
|
-
return
|
|
385
|
+
return c`
|
|
387
386
|
<${t}
|
|
388
387
|
:rowData="${(e) => e}"
|
|
389
388
|
:cellItemTemplate="${(e, t) => t.parent.cellItemTemplate}"
|
|
@@ -409,7 +408,7 @@ function Y(e, { event: t }) {
|
|
|
409
408
|
}
|
|
410
409
|
var X = (e) => {
|
|
411
410
|
let t = K(e), n = e.tagFor(G, !0);
|
|
412
|
-
return
|
|
411
|
+
return c`
|
|
413
412
|
<template
|
|
414
413
|
aria-multiselectable="${q}"
|
|
415
414
|
role="grid"
|
|
@@ -417,22 +416,22 @@ var X = (e) => {
|
|
|
417
416
|
@sort="${Y}"
|
|
418
417
|
:rowElementTag="${() => n}"
|
|
419
418
|
:defaultRowItemTemplate="${t}"
|
|
420
|
-
${
|
|
419
|
+
${h({
|
|
421
420
|
property: "rowElements",
|
|
422
|
-
filter:
|
|
421
|
+
filter: p("[role=row],[data-vvd-component=data-grid-row]")
|
|
423
422
|
})}
|
|
424
423
|
>
|
|
425
424
|
<div class="base">
|
|
426
425
|
${J}
|
|
427
|
-
<slot ${
|
|
426
|
+
<slot ${m("slottedRowElements")}></slot>
|
|
428
427
|
</div>
|
|
429
428
|
</template>
|
|
430
429
|
`;
|
|
431
|
-
}, re =
|
|
430
|
+
}, re = c`
|
|
432
431
|
<template>
|
|
433
432
|
${(e) => e.rowData === null || e.columnDefinition === null || e.columnDefinition.columnDataKey === null ? null : e.rowData[e.columnDefinition.columnDataKey]}
|
|
434
433
|
</template>
|
|
435
|
-
`, ie =
|
|
434
|
+
`, ie = c`
|
|
436
435
|
<template>
|
|
437
436
|
${(e) => e.columnDefinition.title === void 0 ? e.columnDefinition.columnDataKey : e.columnDefinition.title}
|
|
438
437
|
</template>
|
|
@@ -557,7 +556,7 @@ var X = (e) => {
|
|
|
557
556
|
}), !0;
|
|
558
557
|
}
|
|
559
558
|
};
|
|
560
|
-
y([
|
|
559
|
+
y([s({ attribute: "cell-type" })], Z.prototype, "cellType", void 0), y([s({ attribute: "grid-column" })], Z.prototype, "gridColumn", void 0), y([t], Z.prototype, "rowData", void 0), y([t], Z.prototype, "columnDefinition", void 0), y([t], Z.prototype, "_selectable", void 0), y([s({ mode: "boolean" })], Z.prototype, "selected", void 0), y([s({ attribute: "sort-direction" })], Z.prototype, "sortDirection", void 0), y([t], Z.prototype, "_actionItemsSlottedContent", void 0);
|
|
561
560
|
//#endregion
|
|
562
561
|
//#region src/lib/data-grid/data-grid-row.template.ts
|
|
563
562
|
function ae(e) {
|
|
@@ -565,7 +564,7 @@ function ae(e) {
|
|
|
565
564
|
}
|
|
566
565
|
function oe(e) {
|
|
567
566
|
let t = e.tagFor(Z);
|
|
568
|
-
return
|
|
567
|
+
return c`
|
|
569
568
|
<${t}
|
|
570
569
|
cell-type="${(e) => e.isRowHeader ? "rowheader" : void 0}"
|
|
571
570
|
grid-column="${(e, t) => t.index + 1}"
|
|
@@ -577,7 +576,7 @@ function oe(e) {
|
|
|
577
576
|
}
|
|
578
577
|
function se(e) {
|
|
579
578
|
let t = e.tagFor(Z);
|
|
580
|
-
return
|
|
579
|
+
return c`
|
|
581
580
|
<${t}
|
|
582
581
|
cell-type="columnheader"
|
|
583
582
|
grid-column="${(e, t) => t.index + 1}"
|
|
@@ -587,7 +586,7 @@ function se(e) {
|
|
|
587
586
|
}
|
|
588
587
|
var ce = (e) => {
|
|
589
588
|
let t = oe(e), n = se(e);
|
|
590
|
-
return
|
|
589
|
+
return c`
|
|
591
590
|
<template
|
|
592
591
|
${k({
|
|
593
592
|
role: "row",
|
|
@@ -596,16 +595,16 @@ var ce = (e) => {
|
|
|
596
595
|
class="${(e) => e.rowType === "default" ? "" : e.rowType}"
|
|
597
596
|
:defaultCellItemTemplate="${t}"
|
|
598
597
|
:defaultHeaderCellItemTemplate="${n}"
|
|
599
|
-
${
|
|
598
|
+
${h({
|
|
600
599
|
property: "cellElements",
|
|
601
|
-
filter:
|
|
600
|
+
filter: p("[role=\"cell\"],[role=\"gridcell\"],[role=\"columnheader\"],[role=\"rowheader\"],[data-vvd-component=\"data-grid-cell\"]")
|
|
602
601
|
})}
|
|
603
602
|
>
|
|
604
603
|
<div
|
|
605
604
|
class="${(e) => S("base", ["selected", !!e.selected])}"
|
|
606
605
|
style="grid-template-columns: ${(e) => e.gridTemplateColumns};"
|
|
607
606
|
>
|
|
608
|
-
<slot ${
|
|
607
|
+
<slot ${m("slottedCellElements")}></slot>
|
|
609
608
|
</div>
|
|
610
609
|
</template>
|
|
611
610
|
`;
|
|
@@ -623,8 +622,8 @@ function ue(e) {
|
|
|
623
622
|
}
|
|
624
623
|
function de(e) {
|
|
625
624
|
let t = e.tagFor(b);
|
|
626
|
-
return
|
|
627
|
-
${
|
|
625
|
+
return c`
|
|
626
|
+
${g(Q, c`
|
|
628
627
|
<${t} class="header-icon" name="${le}"></${t}>
|
|
629
628
|
`)}
|
|
630
629
|
`;
|
|
@@ -658,9 +657,9 @@ function _e(e, t) {
|
|
|
658
657
|
}
|
|
659
658
|
//#endregion
|
|
660
659
|
//#region src/lib/data-grid/index.ts
|
|
661
|
-
|
|
660
|
+
r(u("data-grid", W, X, [u("data-grid-row", G, ce, [u("data-grid-cell", Z, (e) => {
|
|
662
661
|
let t = e.tagFor(v);
|
|
663
|
-
return
|
|
662
|
+
return c`
|
|
664
663
|
<template
|
|
665
664
|
tabindex="-1"
|
|
666
665
|
${k({
|
|
@@ -676,19 +675,19 @@ i(c("data-grid", W, X, [c("data-grid-row", G, ce, [c("data-grid-cell", Z, (e) =>
|
|
|
676
675
|
class="content"
|
|
677
676
|
role="${(e) => Q(e) ? "button" : void 0}"
|
|
678
677
|
>
|
|
679
|
-
${(e) => e.selected ?
|
|
678
|
+
${(e) => e.selected ? c`<${t}
|
|
680
679
|
data-announcement="selection"
|
|
681
680
|
>
|
|
682
681
|
${(e) => e.locale.dataGrid.cell.selected}
|
|
683
682
|
</${t}>` : null}
|
|
684
683
|
<slot></slot>
|
|
685
|
-
${
|
|
684
|
+
${g(Q, c`<${t}
|
|
686
685
|
data-announcement="button-role"
|
|
687
686
|
>
|
|
688
687
|
${(e) => e.locale.dataGrid.cell.button}
|
|
689
688
|
</${t}>
|
|
690
689
|
`)}
|
|
691
|
-
${
|
|
690
|
+
${g(fe, c`<${t}
|
|
692
691
|
aria-live="polite"
|
|
693
692
|
data-announcement="sort-state"
|
|
694
693
|
>
|
|
@@ -698,7 +697,7 @@ i(c("data-grid", W, X, [c("data-grid-row", G, ce, [c("data-grid-cell", Z, (e) =>
|
|
|
698
697
|
</div>
|
|
699
698
|
<slot
|
|
700
699
|
name="action-items"
|
|
701
|
-
${
|
|
700
|
+
${m("_actionItemsSlottedContent")}
|
|
702
701
|
></slot>
|
|
703
702
|
</div>
|
|
704
703
|
</template>
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
2
|
-
const require_definition = require("../unbundled/
|
|
2
|
+
const require_definition = require("../unbundled/definition36.cjs");
|
|
3
3
|
exports.VwcDatePickerElement = require_definition.DatePicker;
|
|
4
4
|
exports.datePickerDefinition = require_definition.datePickerDefinition;
|
|
5
5
|
exports.registerDatePicker = require_definition.registerDatePicker;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { n as registerDatePicker, r as DatePicker, t as datePickerDefinition } from "../unbundled/
|
|
1
|
+
import { n as registerDatePicker, r as DatePicker, t as datePickerDefinition } from "../unbundled/definition36.js";
|
|
2
2
|
export { DatePicker as VwcDatePickerElement, datePickerDefinition, registerDatePicker };
|
package/date-picker/index.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
const e=require(`../bundled/vivid-element.cjs`),t=require(`../bundled/definition.cjs`),n=require(`../bundled/decorate.cjs`),r=require(`../bundled/definition6.cjs`),i=require(`../bundled/definition8.cjs`),a=require(`../bundled/definition12.cjs`),o=require(`../bundled/picker-field.template.cjs`),s=require(`../bundled/single-value-picker.cjs`),c=require(`../bundled/definition19.cjs`),l=require(`../bundled/calendar-picker.template.cjs`),u=require(`../bundled/single-date-picker.cjs`);var d=class extends u.t(s.t(l.n(l.i(o.n)))){_toPresentationValue(e){return l.a(e,this.locale.calendarPicker)}_parsePresentationValue(e){return l.o(e,this.locale.calendarPicker)}_dateValue(){return this.value}_withUpdatedDate(e){return e}constructor(){super(),this._isValidValue=l.l,this._textFieldSize=`20`,this.proxy.type=`date`}get _pickerButtonLabel(){return this.value?this.locale.calendarPicker.changeDateLabel(this._toPresentationValue(this.value)):this.locale.calendarPicker.chooseDateLabel}get _dialogLabel(){return this.locale.calendarPicker.chooseDateLabel}get _textFieldPlaceholder(){return this.locale.calendarPicker.dateFormatPlaceholder}_onDateClick(e){super._onDateClick(e),this._closePopup()}_getCustomValidationError(){return this._isPresentationValueInvalid()?this.locale.calendarPicker.invalidDateError:null}_focusableElsWithinDialog(){return this._dialogEl.querySelectorAll(`button, .vwc-button`)}get _pickerButtonIcon(){return`calendar-line`}};n.t([e.
|
|
1
|
+
const e=require(`../bundled/vivid-element.cjs`),t=require(`../bundled/definition.cjs`),n=require(`../bundled/decorate.cjs`),r=require(`../bundled/definition6.cjs`),i=require(`../bundled/definition8.cjs`),a=require(`../bundled/definition12.cjs`),o=require(`../bundled/picker-field.template.cjs`),s=require(`../bundled/single-value-picker.cjs`),c=require(`../bundled/definition19.cjs`),l=require(`../bundled/calendar-picker.template.cjs`),u=require(`../bundled/single-date-picker.cjs`);var d=class extends u.t(s.t(l.n(l.i(o.n)))){_toPresentationValue(e){return l.a(e,this.locale.calendarPicker)}_parsePresentationValue(e){return l.o(e,this.locale.calendarPicker)}_dateValue(){return this.value}_withUpdatedDate(e){return e}constructor(){super(),this._isValidValue=l.l,this._textFieldSize=`20`,this.proxy.type=`date`}get _pickerButtonLabel(){return this.value?this.locale.calendarPicker.changeDateLabel(this._toPresentationValue(this.value)):this.locale.calendarPicker.chooseDateLabel}get _dialogLabel(){return this.locale.calendarPicker.chooseDateLabel}get _textFieldPlaceholder(){return this.locale.calendarPicker.dateFormatPlaceholder}_onDateClick(e){super._onDateClick(e),this._closePopup()}_getCustomValidationError(){return this._isPresentationValueInvalid()?this.locale.calendarPicker.invalidDateError:null}_focusableElsWithinDialog(){return this._dialogEl.querySelectorAll(`button, .vwc-button`)}get _pickerButtonIcon(){return`calendar-line`}};n.t([e.j],d.prototype,`_pickerButtonLabel`,null);var f=e.u(`date-picker`,d,e=>o.t(e,l.t(e),{withSeparator:!1,padded:!0}),[r.t,i.t,a.n,c.t,t.n],{styles:[o.r,l.u],shadowOptions:{delegatesFocus:!0}});e.d(f)();
|
package/date-picker/index.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { d as e, j as t, u as n } from "../bundled/vivid-element.js";
|
|
2
2
|
import { n as r } from "../bundled/definition.js";
|
|
3
3
|
import { t as i } from "../bundled/decorate.js";
|
|
4
4
|
import { t as a } from "../bundled/definition6.js";
|
|
@@ -50,7 +50,7 @@ var x = class extends b(d(g(m(c)))) {
|
|
|
50
50
|
};
|
|
51
51
|
//#endregion
|
|
52
52
|
//#region src/lib/date-picker/index.ts
|
|
53
|
-
i([
|
|
53
|
+
i([t], x.prototype, "_pickerButtonLabel", null), e(n("date-picker", x, (e) => u(e, v(e), {
|
|
54
54
|
withSeparator: !1,
|
|
55
55
|
padded: !0
|
|
56
56
|
}), [
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
2
|
-
const require_definition = require("../unbundled/
|
|
2
|
+
const require_definition = require("../unbundled/definition37.cjs");
|
|
3
3
|
exports.VwcDateRangePickerElement = require_definition.DateRangePicker;
|
|
4
4
|
exports.dateRangePickerDefinition = require_definition.dateRangePickerDefinition;
|
|
5
5
|
exports.registerDateRangePicker = require_definition.registerDateRangePicker;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { n as registerDateRangePicker, r as DateRangePicker, t as dateRangePickerDefinition } from "../unbundled/
|
|
1
|
+
import { n as registerDateRangePicker, r as DateRangePicker, t as dateRangePickerDefinition } from "../unbundled/definition37.js";
|
|
2
2
|
export { DateRangePicker as VwcDateRangePickerElement, dateRangePickerDefinition, registerDateRangePicker };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
const e=require(`../bundled/vivid-element.cjs`),t=require(`../bundled/definition.cjs`),n=require(`../bundled/decorate.cjs`),r=require(`../bundled/definition6.cjs`),i=require(`../bundled/definition8.cjs`),a=require(`../bundled/definition12.cjs`),o=require(`../bundled/picker-field.template.cjs`),s=require(`../bundled/definition19.cjs`),c=require(`../bundled/calendar-picker.template.cjs`);var l=(e,t)=>`${e} – ${t}`,u=(e,t)=>l(c.a(e.start,t),c.a(e.end,t)),d=(e,t)=>{let n=e.trim().split(/[\s—–-]+/);if(n.length!==2)throw Error(`Invalid date range: ${e}`);let[r,i]=n.map(e=>c.o(e,t));return{start:r,end:i}},f=e=>typeof e==`string`;function p(e){return!!e}var m=class extends c.n(c.i(o.n)){constructor(...e){super(...e),this.initialStart=``,this.initialEnd=``,this.#e=!1,this.start=``,this.end=``,this.setFormValue=(e,t)=>{f(e)||super.setFormValue(e,t)},this._numCalendars=2,this._hideDatesOutsideMonth=!0,this._textFieldSize=`30`}initialStartChanged(){this.dirtyValue||=(this.start=this.initialStart,!1)}initialEndChanged(){this.dirtyValue||=(this.end=this.initialEnd,!1)}#e;startChanged(){if(this.start&&!c.l(this.start)){this.start=``;return}this.currentStart=this.start,this.dirtyValue=!0,this.#e||this.#n()}endChanged(){if(this.end&&!c.l(this.end)){this.end=``;return}this.currentEnd=this.end,this.dirtyValue=!0,this.#e||this.#n()}currentStartChanged(){this.start=this.currentStart}currentEndChanged(){this.end=this.currentEnd}#t(e){this.#e=!0,e.start!==void 0&&(this.start=e.start,this.$emit(`input:start`)),e.end!==void 0&&(this.end=e.end,this.$emit(`input:end`)),this.#e=!1,this.$emit(`input`),this.$emit(`change`),this.#n()}#n(){if(this.start&&this.end){if(c.s(this.start,this.end)>0){this.#t({start:this.end,end:this.start});return}this.value=l(this.start,this.end)}else this.value=``;this._updatePresentationValue();let e=this.start||this.end;e&&this._adjustSelectedMonthToEnsureVisibilityOf(e),this.#r()}_updatePresentationValue(){this.start&&this.end?this._presentationValue=u({start:this.start,end:this.end},this.locale.calendarPicker):this._presentationValue=``}nameChanged(e,t){super.nameChanged(e,t),this.#r()}#r(){if(!this.name||!this.start||!this.end)this.setFormValue(null);else{let e=new FormData;e.append(this.name,this.start),e.append(this.name,this.end),this.setFormValue(e)}}connectedCallback(){super.connectedCallback(),this.start||=this.initialStart,this.end||=this.initialEnd}#i(){let e=[this.start,this.end].filter(p),t=e.length===1;this._hoverDate&&t&&e.push(this._hoverDate);let[n,r]=e.sort(c.s);return{start:n,end:r}}_isDateAriaSelected(e){return this._isDateInSelectedRange(e)}_isDateInSelectedRange(e){let{start:t,end:n}=this.#i();return t&&n?c.s(e,t)>=0&&c.s(e,n)<=0:!1}_isDateRangeStart(e){return e===this.#i().start}_isDateRangeEnd(e){return e===this.#i().end}_getSelectedDates(){let e=[];return this.start&&e.push(this.start),this.end&&e.push(this.end),e}_onDateClick(e){this.start&&this.end?this.#t({start:e,end:``}):this.start?(this.#t({end:e}),this._closePopup()):this.end?(this.#t({start:e}),this._closePopup()):this.#t({start:e})}get _textFieldPlaceholder(){return l(this.locale.calendarPicker.dateFormatPlaceholder,this.locale.calendarPicker.dateFormatPlaceholder)}_onTextFieldChange(){if(this._presentationValue===``){this.#t({start:``,end:``});return}try{let{start:e,end:t}=d(this._presentationValue,this.locale.calendarPicker);this.#t({start:e,end:t})}catch{let e=this._presentationValue;this.#t({start:``,end:``}),this._presentationValue=e;return}}_onDateMouseEnter(e){this._hoverDate=e}_onDateMouseLeave(){this._hoverDate=void 0}_getCustomValidationError(){return this._isPresentationValueInvalid()?this.locale.calendarPicker.invalidDateRangeError:this.min&&this.start&&c.s(this.start,this.min)<0?this.locale.calendarPicker.startDateAfterMinDateError(c.a(this.min,this.locale.calendarPicker)):this.max&&this.end&&c.s(this.end,this.max)>0?this.locale.calendarPicker.endDateBeforeMaxDateError(c.a(this.max,this.locale.calendarPicker)):null}_isPresentationValueInvalid(){if(this._presentationValue===``)return!1;try{return d(this._presentationValue,this.locale.calendarPicker),!1}catch{return!0}}_onClearClick(){this.#t({start:``,end:``}),super._onClearClick()}formResetCallback(){this.#t({start:this.initialStart,end:this.initialEnd}),super.formResetCallback()}get _pickerButtonLabel(){return this.start&&this.end?this.locale.calendarPicker.changeDatesLabel(u({start:this.start,end:this.end},this.locale.calendarPicker)):this.locale.calendarPicker.chooseDatesLabel}get _dialogLabel(){return this.locale.calendarPicker.chooseDatesLabel}_focusableElsWithinDialog(){return this._dialogEl.querySelectorAll(`button, .vwc-button`)}get _pickerButtonIcon(){return`calendar-line`}};n.t([e.
|
|
1
|
+
const e=require(`../bundled/vivid-element.cjs`),t=require(`../bundled/definition.cjs`),n=require(`../bundled/decorate.cjs`),r=require(`../bundled/definition6.cjs`),i=require(`../bundled/definition8.cjs`),a=require(`../bundled/definition12.cjs`),o=require(`../bundled/picker-field.template.cjs`),s=require(`../bundled/definition19.cjs`),c=require(`../bundled/calendar-picker.template.cjs`);var l=(e,t)=>`${e} – ${t}`,u=(e,t)=>l(c.a(e.start,t),c.a(e.end,t)),d=(e,t)=>{let n=e.trim().split(/[\s—–-]+/);if(n.length!==2)throw Error(`Invalid date range: ${e}`);let[r,i]=n.map(e=>c.o(e,t));return{start:r,end:i}},f=e=>typeof e==`string`;function p(e){return!!e}var m=class extends c.n(c.i(o.n)){constructor(...e){super(...e),this.initialStart=``,this.initialEnd=``,this.#e=!1,this.start=``,this.end=``,this.setFormValue=(e,t)=>{f(e)||super.setFormValue(e,t)},this._numCalendars=2,this._hideDatesOutsideMonth=!0,this._textFieldSize=`30`}initialStartChanged(){this.dirtyValue||=(this.start=this.initialStart,!1)}initialEndChanged(){this.dirtyValue||=(this.end=this.initialEnd,!1)}#e;startChanged(){if(this.start&&!c.l(this.start)){this.start=``;return}this.currentStart=this.start,this.dirtyValue=!0,this.#e||this.#n()}endChanged(){if(this.end&&!c.l(this.end)){this.end=``;return}this.currentEnd=this.end,this.dirtyValue=!0,this.#e||this.#n()}currentStartChanged(){this.start=this.currentStart}currentEndChanged(){this.end=this.currentEnd}#t(e){this.#e=!0,e.start!==void 0&&(this.start=e.start,this.$emit(`input:start`)),e.end!==void 0&&(this.end=e.end,this.$emit(`input:end`)),this.#e=!1,this.$emit(`input`),this.$emit(`change`),this.#n()}#n(){if(this.start&&this.end){if(c.s(this.start,this.end)>0){this.#t({start:this.end,end:this.start});return}this.value=l(this.start,this.end)}else this.value=``;this._updatePresentationValue();let e=this.start||this.end;e&&this._adjustSelectedMonthToEnsureVisibilityOf(e),this.#r()}_updatePresentationValue(){this.start&&this.end?this._presentationValue=u({start:this.start,end:this.end},this.locale.calendarPicker):this._presentationValue=``}nameChanged(e,t){super.nameChanged(e,t),this.#r()}#r(){if(!this.name||!this.start||!this.end)this.setFormValue(null);else{let e=new FormData;e.append(this.name,this.start),e.append(this.name,this.end),this.setFormValue(e)}}connectedCallback(){super.connectedCallback(),this.start||=this.initialStart,this.end||=this.initialEnd}#i(){let e=[this.start,this.end].filter(p),t=e.length===1;this._hoverDate&&t&&e.push(this._hoverDate);let[n,r]=e.sort(c.s);return{start:n,end:r}}_isDateAriaSelected(e){return this._isDateInSelectedRange(e)}_isDateInSelectedRange(e){let{start:t,end:n}=this.#i();return t&&n?c.s(e,t)>=0&&c.s(e,n)<=0:!1}_isDateRangeStart(e){return e===this.#i().start}_isDateRangeEnd(e){return e===this.#i().end}_getSelectedDates(){let e=[];return this.start&&e.push(this.start),this.end&&e.push(this.end),e}_onDateClick(e){this.start&&this.end?this.#t({start:e,end:``}):this.start?(this.#t({end:e}),this._closePopup()):this.end?(this.#t({start:e}),this._closePopup()):this.#t({start:e})}get _textFieldPlaceholder(){return l(this.locale.calendarPicker.dateFormatPlaceholder,this.locale.calendarPicker.dateFormatPlaceholder)}_onTextFieldChange(){if(this._presentationValue===``){this.#t({start:``,end:``});return}try{let{start:e,end:t}=d(this._presentationValue,this.locale.calendarPicker);this.#t({start:e,end:t})}catch{let e=this._presentationValue;this.#t({start:``,end:``}),this._presentationValue=e;return}}_onDateMouseEnter(e){this._hoverDate=e}_onDateMouseLeave(){this._hoverDate=void 0}_getCustomValidationError(){return this._isPresentationValueInvalid()?this.locale.calendarPicker.invalidDateRangeError:this.min&&this.start&&c.s(this.start,this.min)<0?this.locale.calendarPicker.startDateAfterMinDateError(c.a(this.min,this.locale.calendarPicker)):this.max&&this.end&&c.s(this.end,this.max)>0?this.locale.calendarPicker.endDateBeforeMaxDateError(c.a(this.max,this.locale.calendarPicker)):null}_isPresentationValueInvalid(){if(this._presentationValue===``)return!1;try{return d(this._presentationValue,this.locale.calendarPicker),!1}catch{return!0}}_onClearClick(){this.#t({start:``,end:``}),super._onClearClick()}formResetCallback(){this.#t({start:this.initialStart,end:this.initialEnd}),super.formResetCallback()}get _pickerButtonLabel(){return this.start&&this.end?this.locale.calendarPicker.changeDatesLabel(u({start:this.start,end:this.end},this.locale.calendarPicker)):this.locale.calendarPicker.chooseDatesLabel}get _dialogLabel(){return this.locale.calendarPicker.chooseDatesLabel}_focusableElsWithinDialog(){return this._dialogEl.querySelectorAll(`button, .vwc-button`)}get _pickerButtonIcon(){return`calendar-line`}};n.t([e.m({mode:`fromView`,attribute:`start`})],m.prototype,`initialStart`,void 0),n.t([e.m({mode:`fromView`,attribute:`end`})],m.prototype,`initialEnd`,void 0),n.t([e.A],m.prototype,`start`,void 0),n.t([e.A],m.prototype,`end`,void 0),n.t([e.m({attribute:`current-start`})],m.prototype,`currentStart`,void 0),n.t([e.m({attribute:`current-end`})],m.prototype,`currentEnd`,void 0),n.t([e.A],m.prototype,`_numCalendars`,void 0),n.t([e.A],m.prototype,`_hoverDate`,void 0),n.t([e.j],m.prototype,`_pickerButtonLabel`,null);var h=e.u(`date-range-picker`,m,e=>o.t(e,c.t(e),{withSeparator:!1,padded:!0}),[r.t,i.t,a.n,s.t,t.n],{styles:[o.r,c.u],shadowOptions:{delegatesFocus:!0}});e.d(h)();
|