@universal-material/web 3.8.0 → 3.9.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/.claude-plugin/plugin.json +12 -0
- package/README.md +12 -0
- package/app-bar/top-app-bar.d.ts +7 -6
- package/app-bar/top-app-bar.d.ts.map +1 -1
- package/app-bar/top-app-bar.js +71 -35
- package/app-bar/top-app-bar.js.map +1 -1
- package/app-bar/top-app-bar.styles.d.ts.map +1 -1
- package/app-bar/top-app-bar.styles.js +18 -1
- package/app-bar/top-app-bar.styles.js.map +1 -1
- package/badge/badge.d.ts +2 -2
- package/badge/badge.d.ts.map +1 -1
- package/badge/badge.js +6 -6
- package/badge/badge.js.map +1 -1
- package/badge/badge.styles.d.ts.map +1 -1
- package/badge/badge.styles.js +1 -0
- package/badge/badge.styles.js.map +1 -1
- package/bundle.min.js +4469 -1277
- package/button/button-base.d.ts +2 -2
- package/button/button-base.d.ts.map +1 -1
- package/button/button-base.js +5 -5
- package/button/button-base.js.map +1 -1
- package/button/button-set.d.ts +3 -3
- package/button/button-set.d.ts.map +1 -1
- package/button/button-set.js +7 -7
- package/button/button-set.js.map +1 -1
- package/button/button.d.ts +7 -7
- package/button/button.d.ts.map +1 -1
- package/button/button.js +14 -14
- package/button/button.js.map +1 -1
- package/button/fab-menu-color-context.d.ts +2 -2
- package/button/fab-menu-color-context.d.ts.map +1 -1
- package/button/fab-menu-color-context.js.map +1 -1
- package/button/fab-menu-item.d.ts +3 -3
- package/button/fab-menu-item.d.ts.map +1 -1
- package/button/fab-menu-item.js +11 -11
- package/button/fab-menu-item.js.map +1 -1
- package/button/fab-menu.d.ts +20 -5
- package/button/fab-menu.d.ts.map +1 -1
- package/button/fab-menu.js +48 -11
- package/button/fab-menu.js.map +1 -1
- package/button/fab.d.ts +22 -7
- package/button/fab.d.ts.map +1 -1
- package/button/fab.js +49 -11
- package/button/fab.js.map +1 -1
- package/button/icon-button.d.ts +7 -7
- package/button/icon-button.d.ts.map +1 -1
- package/button/icon-button.js +8 -8
- package/button/icon-button.js.map +1 -1
- package/button/toggle-button.d.ts +6 -6
- package/button/toggle-button.d.ts.map +1 -1
- package/button/toggle-button.js +10 -10
- package/button/toggle-button.js.map +1 -1
- package/button-field/button-field.d.ts +3 -3
- package/button-field/button-field.d.ts.map +1 -1
- package/button-field/button-field.js +9 -9
- package/button-field/button-field.js.map +1 -1
- package/calendar/calendar-base.d.ts +1 -1
- package/calendar/calendar-base.d.ts.map +1 -1
- package/calendar/calendar-base.js +10 -10
- package/calendar/calendar-base.js.map +1 -1
- package/calendar/calendar.d.ts +2 -2
- package/calendar/calendar.d.ts.map +1 -1
- package/calendar/calendar.js +8 -8
- package/calendar/calendar.js.map +1 -1
- package/calendar/range-calendar.d.ts +2 -2
- package/calendar/range-calendar.d.ts.map +1 -1
- package/calendar/range-calendar.js +9 -9
- package/calendar/range-calendar.js.map +1 -1
- package/card/card-content.d.ts +2 -2
- package/card/card-content.d.ts.map +1 -1
- package/card/card-content.js +5 -5
- package/card/card-content.js.map +1 -1
- package/card/card-media.d.ts +2 -2
- package/card/card-media.d.ts.map +1 -1
- package/card/card-media.js +5 -5
- package/card/card-media.js.map +1 -1
- package/card/card.d.ts +4 -4
- package/card/card.d.ts.map +1 -1
- package/card/card.js +5 -5
- package/card/card.js.map +1 -1
- package/checkbox/checkbox-list-item.d.ts +4 -4
- package/checkbox/checkbox-list-item.d.ts.map +1 -1
- package/checkbox/checkbox-list-item.js +5 -5
- package/checkbox/checkbox-list-item.js.map +1 -1
- package/checkbox/checkbox.d.ts +3 -3
- package/checkbox/checkbox.d.ts.map +1 -1
- package/checkbox/checkbox.js +7 -7
- package/checkbox/checkbox.js.map +1 -1
- package/chip/chip-set.d.ts +3 -3
- package/chip/chip-set.d.ts.map +1 -1
- package/chip/chip-set.js +6 -6
- package/chip/chip-set.js.map +1 -1
- package/chip/chip.d.ts +5 -5
- package/chip/chip.d.ts.map +1 -1
- package/chip/chip.js +20 -20
- package/chip/chip.js.map +1 -1
- package/chip-field/chip-field.d.ts +3 -3
- package/chip-field/chip-field.d.ts.map +1 -1
- package/chip-field/chip-field.js +9 -9
- package/chip-field/chip-field.js.map +1 -1
- package/collapse/collapse.d.ts +26 -0
- package/collapse/collapse.d.ts.map +1 -0
- package/collapse/collapse.js +62 -0
- package/collapse/collapse.js.map +1 -0
- package/collapse/collapse.styles.d.ts +2 -0
- package/collapse/collapse.styles.d.ts.map +1 -0
- package/collapse/collapse.styles.js +8 -0
- package/collapse/collapse.styles.js.map +1 -0
- package/config.js.map +1 -1
- package/css/universal-material.css +2 -1
- package/css/universal-material.min.css +2 -1
- package/custom-elements.json +16615 -12152
- package/datepicker/datepicker.d.ts +6 -4
- package/datepicker/datepicker.d.ts.map +1 -1
- package/datepicker/datepicker.js +33 -19
- package/datepicker/datepicker.js.map +1 -1
- package/datepicker/datepicker.styles.d.ts.map +1 -1
- package/datepicker/datepicker.styles.js +25 -0
- package/datepicker/datepicker.styles.js.map +1 -1
- package/datepicker/range-datepicker.d.ts +6 -4
- package/datepicker/range-datepicker.d.ts.map +1 -1
- package/datepicker/range-datepicker.js +33 -19
- package/datepicker/range-datepicker.js.map +1 -1
- package/dialog/confirm-dialog-builder.d.ts +3 -3
- package/dialog/confirm-dialog-builder.d.ts.map +1 -1
- package/dialog/confirm-dialog-builder.js.map +1 -1
- package/dialog/dialog-builder.d.ts +5 -4
- package/dialog/dialog-builder.d.ts.map +1 -1
- package/dialog/dialog-builder.js +10 -3
- package/dialog/dialog-builder.js.map +1 -1
- package/dialog/dialog-button-def.d.ts +3 -3
- package/dialog/dialog-button-def.d.ts.map +1 -1
- package/dialog/dialog-button-def.js.map +1 -1
- package/dialog/dialog.d.ts +2 -2
- package/dialog/dialog.d.ts.map +1 -1
- package/dialog/dialog.js +14 -14
- package/dialog/dialog.js.map +1 -1
- package/dialog/message-dialog-builder.d.ts +2 -2
- package/dialog/message-dialog-builder.d.ts.map +1 -1
- package/dialog/message-dialog-builder.js.map +1 -1
- package/elevation/elevation.d.ts +2 -2
- package/elevation/elevation.d.ts.map +1 -1
- package/elevation/elevation.js +4 -4
- package/elevation/elevation.js.map +1 -1
- package/expansion-panel/expansion-panel-container.d.ts +24 -0
- package/expansion-panel/expansion-panel-container.d.ts.map +1 -0
- package/expansion-panel/expansion-panel-container.js +54 -0
- package/expansion-panel/expansion-panel-container.js.map +1 -0
- package/expansion-panel/expansion-panel-container.styles.d.ts +2 -0
- package/expansion-panel/expansion-panel-container.styles.d.ts.map +1 -0
- package/expansion-panel/expansion-panel-container.styles.js +9 -0
- package/expansion-panel/expansion-panel-container.styles.js.map +1 -0
- package/expansion-panel/expansion-panel.d.ts +37 -0
- package/expansion-panel/expansion-panel.d.ts.map +1 -0
- package/expansion-panel/expansion-panel.js +89 -0
- package/expansion-panel/expansion-panel.js.map +1 -0
- package/expansion-panel/expansion-panel.styles.d.ts +2 -0
- package/expansion-panel/expansion-panel.styles.d.ts.map +1 -0
- package/expansion-panel/expansion-panel.styles.js +66 -0
- package/expansion-panel/expansion-panel.styles.js.map +1 -0
- package/field/field-base.d.ts +3 -3
- package/field/field-base.d.ts.map +1 -1
- package/field/field-base.js +20 -20
- package/field/field-base.js.map +1 -1
- package/field/field-defaults-context.d.ts +2 -2
- package/field/field-defaults-context.d.ts.map +1 -1
- package/field/field-defaults-context.js.map +1 -1
- package/field/field-defaults.d.ts +3 -3
- package/field/field-defaults.d.ts.map +1 -1
- package/field/field-defaults.js.map +1 -1
- package/field/field-variant.d.ts +1 -1
- package/field/field-variant.d.ts.map +1 -1
- package/field/field-variant.js.map +1 -1
- package/field/field.d.ts +3 -3
- package/field/field.d.ts.map +1 -1
- package/field/field.js +6 -6
- package/field/field.js.map +1 -1
- package/icon/icon.d.ts +2 -2
- package/icon/icon.d.ts.map +1 -1
- package/icon/icon.js +4 -4
- package/icon/icon.js.map +1 -1
- package/index.d.ts +24 -1
- package/index.d.ts.map +1 -1
- package/index.js +24 -1
- package/index.js.map +1 -1
- package/list/list-item.d.ts +16 -2
- package/list/list-item.d.ts.map +1 -1
- package/list/list-item.js +26 -6
- package/list/list-item.js.map +1 -1
- package/list/list-item.styles.d.ts.map +1 -1
- package/list/list-item.styles.js +13 -0
- package/list/list-item.styles.js.map +1 -1
- package/list/list.d.ts +2 -2
- package/list/list.d.ts.map +1 -1
- package/list/list.js +4 -4
- package/list/list.js.map +1 -1
- package/menu/menu-item.d.ts +3 -3
- package/menu/menu-item.d.ts.map +1 -1
- package/menu/menu-item.js +10 -10
- package/menu/menu-item.js.map +1 -1
- package/menu/menu.d.ts +2 -2
- package/menu/menu.d.ts.map +1 -1
- package/menu/menu.js +13 -13
- package/menu/menu.js.map +1 -1
- package/navigation/drawer-headline.d.ts +2 -2
- package/navigation/drawer-headline.d.ts.map +1 -1
- package/navigation/drawer-headline.js +6 -6
- package/navigation/drawer-headline.js.map +1 -1
- package/navigation/drawer-item.d.ts +3 -3
- package/navigation/drawer-item.d.ts.map +1 -1
- package/navigation/drawer-item.js +17 -12
- package/navigation/drawer-item.js.map +1 -1
- package/navigation/drawer.d.ts +2 -2
- package/navigation/drawer.d.ts.map +1 -1
- package/navigation/drawer.js +4 -4
- package/navigation/drawer.js.map +1 -1
- package/navigation/side-navigation.d.ts +9 -2
- package/navigation/side-navigation.d.ts.map +1 -1
- package/navigation/side-navigation.js +15 -8
- package/navigation/side-navigation.js.map +1 -1
- package/navigation-bar/navigation-bar-item.d.ts +40 -0
- package/navigation-bar/navigation-bar-item.d.ts.map +1 -0
- package/navigation-bar/navigation-bar-item.js +113 -0
- package/navigation-bar/navigation-bar-item.js.map +1 -0
- package/navigation-bar/navigation-bar-item.styles.d.ts +2 -0
- package/navigation-bar/navigation-bar-item.styles.d.ts.map +1 -0
- package/navigation-bar/navigation-bar-item.styles.js +101 -0
- package/navigation-bar/navigation-bar-item.styles.js.map +1 -0
- package/navigation-bar/navigation-bar.d.ts +40 -0
- package/navigation-bar/navigation-bar.d.ts.map +1 -0
- package/navigation-bar/navigation-bar.js +85 -0
- package/navigation-bar/navigation-bar.js.map +1 -0
- package/navigation-bar/navigation-bar.styles.d.ts +2 -0
- package/navigation-bar/navigation-bar.styles.d.ts.map +1 -0
- package/navigation-bar/navigation-bar.styles.js +44 -0
- package/navigation-bar/navigation-bar.styles.js.map +1 -0
- package/navigation-rail/navigation-rail-headline.d.ts +23 -0
- package/navigation-rail/navigation-rail-headline.d.ts.map +1 -0
- package/navigation-rail/navigation-rail-headline.js +28 -0
- package/navigation-rail/navigation-rail-headline.js.map +1 -0
- package/navigation-rail/navigation-rail-headline.styles.d.ts +2 -0
- package/navigation-rail/navigation-rail-headline.styles.d.ts.map +1 -0
- package/navigation-rail/navigation-rail-headline.styles.js +19 -0
- package/navigation-rail/navigation-rail-headline.styles.js.map +1 -0
- package/navigation-rail/navigation-rail-item.d.ts +58 -0
- package/navigation-rail/navigation-rail-item.d.ts.map +1 -0
- package/navigation-rail/navigation-rail-item.js +160 -0
- package/navigation-rail/navigation-rail-item.js.map +1 -0
- package/navigation-rail/navigation-rail-item.styles.d.ts +2 -0
- package/navigation-rail/navigation-rail-item.styles.d.ts.map +1 -0
- package/navigation-rail/navigation-rail-item.styles.js +182 -0
- package/navigation-rail/navigation-rail-item.styles.js.map +1 -0
- package/navigation-rail/navigation-rail.d.ts +66 -0
- package/navigation-rail/navigation-rail.d.ts.map +1 -0
- package/navigation-rail/navigation-rail.js +223 -0
- package/navigation-rail/navigation-rail.js.map +1 -0
- package/navigation-rail/navigation-rail.styles.d.ts +2 -0
- package/navigation-rail/navigation-rail.styles.d.ts.map +1 -0
- package/navigation-rail/navigation-rail.styles.js +220 -0
- package/navigation-rail/navigation-rail.styles.js.map +1 -0
- package/overflow-menu/overflow-menu.d.ts +8 -2
- package/overflow-menu/overflow-menu.d.ts.map +1 -1
- package/overflow-menu/overflow-menu.js +10 -1
- package/overflow-menu/overflow-menu.js.map +1 -1
- package/package.json +19 -3
- package/progress/circular-progress.d.ts +2 -2
- package/progress/circular-progress.d.ts.map +1 -1
- package/progress/circular-progress.js +6 -6
- package/progress/circular-progress.js.map +1 -1
- package/progress/progress-bar.d.ts +2 -2
- package/progress/progress-bar.d.ts.map +1 -1
- package/progress/progress-bar.js +6 -6
- package/progress/progress-bar.js.map +1 -1
- package/radio/radio-list-item.d.ts +4 -4
- package/radio/radio-list-item.d.ts.map +1 -1
- package/radio/radio-list-item.js +5 -5
- package/radio/radio-list-item.js.map +1 -1
- package/radio/radio.d.ts +3 -3
- package/radio/radio.d.ts.map +1 -1
- package/radio/radio.js +6 -6
- package/radio/radio.js.map +1 -1
- package/ripple/ripple.d.ts +2 -2
- package/ripple/ripple.d.ts.map +1 -1
- package/ripple/ripple.js +9 -9
- package/ripple/ripple.js.map +1 -1
- package/scaffold/pane.d.ts +127 -0
- package/scaffold/pane.d.ts.map +1 -0
- package/scaffold/pane.js +220 -0
- package/scaffold/pane.js.map +1 -0
- package/scaffold/pane.styles.d.ts +2 -0
- package/scaffold/pane.styles.d.ts.map +1 -0
- package/scaffold/pane.styles.js +1909 -0
- package/scaffold/pane.styles.js.map +1 -0
- package/scaffold/scaffold.d.ts +45 -0
- package/scaffold/scaffold.d.ts.map +1 -0
- package/scaffold/scaffold.js +170 -0
- package/scaffold/scaffold.js.map +1 -0
- package/scaffold/scaffold.styles.d.ts +2 -0
- package/scaffold/scaffold.styles.d.ts.map +1 -0
- package/scaffold/scaffold.styles.js +69 -0
- package/scaffold/scaffold.styles.js.map +1 -0
- package/scaffold/scroll-container-context.d.ts +4 -0
- package/scaffold/scroll-container-context.d.ts.map +1 -0
- package/scaffold/scroll-container-context.js +3 -0
- package/scaffold/scroll-container-context.js.map +1 -0
- package/scss/utilities/_divider.scss +4 -0
- package/search/search.d.ts +3 -3
- package/search/search.d.ts.map +1 -1
- package/search/search.js +7 -7
- package/search/search.js.map +1 -1
- package/search/search.styles.d.ts.map +1 -1
- package/search/search.styles.js +7 -2
- package/search/search.styles.js.map +1 -1
- package/select/option.d.ts +3 -3
- package/select/option.d.ts.map +1 -1
- package/select/option.js +8 -8
- package/select/option.js.map +1 -1
- package/select/select-navigation-controller.d.ts +4 -4
- package/select/select-navigation-controller.d.ts.map +1 -1
- package/select/select-navigation-controller.js.map +1 -1
- package/select/select.d.ts +18 -12
- package/select/select.d.ts.map +1 -1
- package/select/select.js +77 -31
- package/select/select.js.map +1 -1
- package/shared/button-wrapper.d.ts +1 -1
- package/shared/button-wrapper.d.ts.map +1 -1
- package/shared/button-wrapper.js +8 -8
- package/shared/button-wrapper.js.map +1 -1
- package/shared/char-count-text-field/native-text-field-wrapper.d.ts +2 -2
- package/shared/char-count-text-field/native-text-field-wrapper.d.ts.map +1 -1
- package/shared/char-count-text-field/native-text-field-wrapper.js +6 -6
- package/shared/char-count-text-field/native-text-field-wrapper.js.map +1 -1
- package/shared/menu-field/menu-field-navigation-controller.d.ts +3 -3
- package/shared/menu-field/menu-field-navigation-controller.d.ts.map +1 -1
- package/shared/menu-field/menu-field-navigation-controller.js.map +1 -1
- package/shared/menu-field/menu-field.d.ts +5 -5
- package/shared/menu-field/menu-field.d.ts.map +1 -1
- package/shared/menu-field/menu-field.js.map +1 -1
- package/shared/selection-control/selection-control-list-item.d.ts +2 -2
- package/shared/selection-control/selection-control-list-item.d.ts.map +1 -1
- package/shared/selection-control/selection-control-list-item.js +10 -1
- package/shared/selection-control/selection-control-list-item.js.map +1 -1
- package/shared/selection-control/selection-control.d.ts +1 -1
- package/shared/selection-control/selection-control.d.ts.map +1 -1
- package/shared/selection-control/selection-control.js +15 -7
- package/shared/selection-control/selection-control.js.map +1 -1
- package/shared/sets/set-base.d.ts +1 -1
- package/shared/sets/set-base.d.ts.map +1 -1
- package/shared/sets/set-base.js +2 -2
- package/shared/sets/set-base.js.map +1 -1
- package/shared/text-field-base/text-field-base.d.ts +34 -2
- package/shared/text-field-base/text-field-base.d.ts.map +1 -1
- package/shared/text-field-base/text-field-base.js +63 -4
- package/shared/text-field-base/text-field-base.js.map +1 -1
- package/skills/badge/SKILL.md +43 -0
- package/skills/buttons/SKILL.md +115 -0
- package/skills/card/SKILL.md +162 -0
- package/skills/chips/SKILL.md +95 -0
- package/skills/collapse/SKILL.md +37 -0
- package/skills/datepicker/SKILL.md +110 -0
- package/skills/dialog/SKILL.md +92 -0
- package/skills/drawer/SKILL.md +94 -0
- package/skills/expansion-panel/SKILL.md +65 -0
- package/skills/fab/SKILL.md +79 -0
- package/skills/list/SKILL.md +105 -0
- package/skills/menu/SKILL.md +120 -0
- package/skills/navigation-bar/SKILL.md +87 -0
- package/skills/navigation-rail/SKILL.md +127 -0
- package/skills/overview/SKILL.md +44 -0
- package/skills/progress/SKILL.md +63 -0
- package/skills/scaffold/SKILL.md +392 -0
- package/skills/search/SKILL.md +65 -0
- package/skills/select/SKILL.md +120 -0
- package/skills/selection-controls/SKILL.md +88 -0
- package/skills/setup/SKILL.md +58 -0
- package/skills/slider/SKILL.md +119 -0
- package/skills/snackbar/SKILL.md +70 -0
- package/skills/tab-bar/SKILL.md +55 -0
- package/skills/text-field/SKILL.md +114 -0
- package/skills/theming/SKILL.md +80 -0
- package/skills/top-app-bar/SKILL.md +64 -0
- package/skills/typeahead/SKILL.md +113 -0
- package/slider/slider.d.ts +73 -0
- package/slider/slider.d.ts.map +1 -0
- package/slider/slider.js +506 -0
- package/slider/slider.js.map +1 -0
- package/slider/slider.styles.d.ts +2 -0
- package/slider/slider.styles.d.ts.map +1 -0
- package/slider/slider.styles.js +292 -0
- package/slider/slider.styles.js.map +1 -0
- package/snackbar/snackbar.d.ts +4 -4
- package/snackbar/snackbar.d.ts.map +1 -1
- package/snackbar/snackbar.js +28 -28
- package/snackbar/snackbar.js.map +1 -1
- package/snackbar/snackbar.styles.js +1 -1
- package/snackbar/snackbar.styles.js.map +1 -1
- package/switch/switch-list-item.d.ts +4 -4
- package/switch/switch-list-item.d.ts.map +1 -1
- package/switch/switch-list-item.js +5 -5
- package/switch/switch-list-item.js.map +1 -1
- package/switch/switch.d.ts +3 -3
- package/switch/switch.d.ts.map +1 -1
- package/switch/switch.js +5 -5
- package/switch/switch.js.map +1 -1
- package/tab-bar/tab-bar.d.ts +6 -6
- package/tab-bar/tab-bar.d.ts.map +1 -1
- package/tab-bar/tab-bar.js +40 -23
- package/tab-bar/tab-bar.js.map +1 -1
- package/tab-bar/tab.d.ts +5 -5
- package/tab-bar/tab.d.ts.map +1 -1
- package/tab-bar/tab.js +9 -9
- package/tab-bar/tab.js.map +1 -1
- package/text-area/text-area.d.ts +3 -3
- package/text-area/text-area.d.ts.map +1 -1
- package/text-area/text-area.js +9 -9
- package/text-area/text-area.js.map +1 -1
- package/text-field/text-field.d.ts +15 -3
- package/text-field/text-field.d.ts.map +1 -1
- package/text-field/text-field.js +46 -13
- package/text-field/text-field.js.map +1 -1
- package/typeahead/highlight.d.ts +2 -2
- package/typeahead/highlight.d.ts.map +1 -1
- package/typeahead/highlight.js +7 -7
- package/typeahead/highlight.js.map +1 -1
- package/typeahead/typeahead.d.ts +7 -7
- package/typeahead/typeahead.d.ts.map +1 -1
- package/typeahead/typeahead.js +22 -18
- package/typeahead/typeahead.js.map +1 -1
- package/vscode.html-custom-data.json +870 -481
package/search/search.styles.js
CHANGED
|
@@ -12,8 +12,7 @@ export const styles = css `
|
|
|
12
12
|
display: none;
|
|
13
13
|
}
|
|
14
14
|
|
|
15
|
-
|
|
16
|
-
slot[name=trailing-icon] {
|
|
15
|
+
.icon {
|
|
17
16
|
display: inline-flex;
|
|
18
17
|
align-items: center;
|
|
19
18
|
gap: var(--u-search-icons-gap, 8px);
|
|
@@ -87,6 +86,12 @@ export const styles = css `
|
|
|
87
86
|
margin-inline: auto;
|
|
88
87
|
}
|
|
89
88
|
|
|
89
|
+
:host([position=static]) .inner-container {
|
|
90
|
+
padding: 0;
|
|
91
|
+
max-width: none;
|
|
92
|
+
margin-inline: 0;
|
|
93
|
+
}
|
|
94
|
+
|
|
90
95
|
.leading-icon {
|
|
91
96
|
margin-inline: var(--u-search-leading-icon-margin, 8px);
|
|
92
97
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"search.styles.js","sourceRoot":"","sources":["../../src/search/search.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAC
|
|
1
|
+
{"version":3,"file":"search.styles.js","sourceRoot":"","sources":["../../src/search/search.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAqGzB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css `\n :host {\n display: block;\n }\n\n :host(:not([has-leading-icon])) .leading-icon {\n display: none;\n }\n\n :host(:not([has-trailing-icon])) .trailing-icon {\n display: none;\n }\n\n .icon {\n display: inline-flex;\n align-items: center;\n gap: var(--u-search-icons-gap, 8px);\n }\n\n slot[name=leading-icon]::slotted(u-icon-button) {\n color: inherit;\n }\n\n :host([position=absolute]) .container {\n position: absolute;\n }\n\n :host([position=fixed]) .container {\n position: fixed;\n inset-inline: 0;\n inset-block-start: 0;\n inset-inline-start: var(--u-app-bar-offset, 0);\n }\n\n :host([position=absolute]),\n :host([position=fixed]) {\n padding-top: var(--_content-height);\n }\n :host([position=absolute]) .container,\n :host([position=fixed]) .container {\n z-index: var(--u-fixed-search-z-index, 1010);\n }\n\n .input {\n font-family: var(--u-font-family, var(--u-font-family, system-ui, -apple-system, \"Segoe UI\", Roboto, \"Helvetica Neue\", \"Noto Sans\", \"Liberation Sans\", Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\"));\n line-height: var(--u-search-input-line-height, var(--u-body-l-line-height, 1.5rem));\n font-size: var(--u-search-input-font-size, var(--u-body-l-font-size, 1rem));\n letter-spacing: var(--u-search-input-letter-spacing, var(--u-body-l-letter-spacing, 0.03125rem));\n font-weight: var(--u-search-input-font-weight, var(--u-body-l-font-weight, var(--u-font-weight-regular, 400)));\n margin: 0;\n margin-inline: var(--u-search-placeholder-margin, 16px);\n display: block;\n width: 100%;\n color: var(--u-search-input-text-color, var(--u-color-on-surface, rgb(29, 27, 32)));\n padding: 0;\n appearance: none;\n background: transparent;\n border: none;\n outline: 0 !important;\n caret-color: var(--u-color-primary, rgb(103, 80, 164));\n }\n .input::placeholder {\n color: var(--u-search-input-placeholder-color, var(--u-color-on-surface-variant, rgb(73, 69, 79)));\n }\n :host([has-leading-icon]) .input {\n margin-inline-start: 0;\n }\n\n .content {\n display: flex;\n align-items: center;\n background-color: var(--u-search-container-color, var(--u-color-surface-container-high, rgb(236, 230, 240)));\n border-radius: var(--u-search-border-radius, 9999px);\n height: var(--u-search-height, 56px);\n }\n\n .inner-container {\n padding-inline: var(--u-layout-margin-inline, var(--u-layout-margin));\n padding-block: var(--u-search-margin-block, 8px);\n width: 100%;\n }\n\n .inner-container {\n max-width: var(--u-container-width, 992px);\n margin-inline: auto;\n }\n\n :host([position=static]) .inner-container {\n padding: 0;\n max-width: none;\n margin-inline: 0;\n }\n\n .leading-icon {\n margin-inline: var(--u-search-leading-icon-margin, 8px);\n }\n\n .trailing-icon {\n padding-inline: var(--u-search-trailing-icon-margin, 8px);\n margin-inline-start: auto;\n }\n`;\n"]}
|
package/select/option.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { TemplateResult } from 'lit';
|
|
2
|
-
import {
|
|
2
|
+
import { MenuItem } from '../menu/menu-item.js';
|
|
3
3
|
import './select.js';
|
|
4
|
-
export declare class
|
|
4
|
+
export declare class Option extends MenuItem {
|
|
5
5
|
#private;
|
|
6
6
|
static styles: (import("lit").CSSResult | import("lit").CSSResultGroup[])[];
|
|
7
7
|
/**
|
|
@@ -27,7 +27,7 @@ export declare class UmOption extends UmMenuItem {
|
|
|
27
27
|
}
|
|
28
28
|
declare global {
|
|
29
29
|
interface HTMLElementTagNameMap {
|
|
30
|
-
'u-option':
|
|
30
|
+
'u-option': Option;
|
|
31
31
|
}
|
|
32
32
|
}
|
|
33
33
|
//# sourceMappingURL=option.d.ts.map
|
package/select/option.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"option.d.ts","sourceRoot":"","sources":["../../src/select/option.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,cAAc,EAAE,MAAM,KAAK,CAAC;AAG1C,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"option.d.ts","sourceRoot":"","sources":["../../src/select/option.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,cAAc,EAAE,MAAM,KAAK,CAAC;AAG1C,OAAO,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAIhD,OAAO,aAAa,CAAC;AAErB,qBACa,MAAO,SAAQ,QAAQ;;IAClC,OAAgB,MAAM,+DAA6B;IAOnD;;OAEG;IACH,IACI,KAAK,IAAI,MAAM,CAElB;IAED,IAAI,KAAK,CAAC,KAAK,EAAE,MAAM,EAOtB;IAED;;OAEG;IACH,IACI,QAAQ,IAAI,OAAO,CAEtB;IAED,IAAI,QAAQ,CAAC,QAAQ,EAAE,OAAO,EAO7B;IAED,IAAI,eAAe,IAAI,OAAO,CAE7B;IAED,IAAI,eAAe,CAAC,KAAK,EAAE,OAAO,EAEjC;cAEkB,oBAAoB;;;cAOpB,0BAA0B,IAAI,cAAc;IAatD,iBAAiB;IAcjB,oBAAoB;IAMpB,wBAAwB,CAAC,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,GAAG,IAAI,EAAE,KAAK,EAAE,MAAM,GAAG,IAAI;IAiBzF,kBAAkB;CAWnB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,UAAU,EAAE,MAAM,CAAC;KACpB;CACF"}
|
package/select/option.js
CHANGED
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import { __decorate } from "tslib";
|
|
2
2
|
import { svg } from 'lit';
|
|
3
3
|
import { customElement, property } from 'lit/decorators.js';
|
|
4
|
-
import {
|
|
4
|
+
import { MenuItem } from '../menu/menu-item.js';
|
|
5
5
|
import { styles } from './option.styles.js';
|
|
6
6
|
import './select.js';
|
|
7
|
-
let
|
|
8
|
-
static { this.styles = [
|
|
7
|
+
let Option = class Option extends MenuItem {
|
|
8
|
+
static { this.styles = [MenuItem.styles, styles]; }
|
|
9
9
|
#mutationObserver = new MutationObserver(() => this.#updateContent());
|
|
10
10
|
#value = '';
|
|
11
11
|
#selected = false;
|
|
@@ -99,12 +99,12 @@ let UmOption = class UmOption extends UmMenuItem {
|
|
|
99
99
|
};
|
|
100
100
|
__decorate([
|
|
101
101
|
property({ reflect: true })
|
|
102
|
-
],
|
|
102
|
+
], Option.prototype, "value", null);
|
|
103
103
|
__decorate([
|
|
104
104
|
property({ type: Boolean })
|
|
105
|
-
],
|
|
106
|
-
|
|
105
|
+
], Option.prototype, "selected", null);
|
|
106
|
+
Option = __decorate([
|
|
107
107
|
customElement('u-option')
|
|
108
|
-
],
|
|
109
|
-
export {
|
|
108
|
+
], Option);
|
|
109
|
+
export { Option };
|
|
110
110
|
//# sourceMappingURL=option.js.map
|
package/select/option.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"option.js","sourceRoot":"","sources":["../../src/select/option.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAkB,MAAM,KAAK,CAAC;AAC1C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE5D,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"option.js","sourceRoot":"","sources":["../../src/select/option.ts"],"names":[],"mappings":"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","sourcesContent":["import { svg, TemplateResult } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\n\nimport { MenuItem } from '../menu/menu-item.js';\nimport { styles } from './option.styles.js';\nimport { Select } from './select.js';\n\nimport './select.js';\n\n@customElement('u-option')\nexport class Option extends MenuItem {\n static override styles = [MenuItem.styles, styles];\n\n readonly #mutationObserver = new MutationObserver(() => this.#updateContent());\n\n #value = '';\n #selected = false;\n\n /**\n * The value submitted with the form when this option is selected\n */\n @property({ reflect: true })\n get value(): string {\n return this.#value;\n }\n\n set value(value: string) {\n if (this.#value === value) {\n return;\n }\n\n this.#value = value;\n this.#select?._scheduleSync();\n }\n\n /**\n * Whether the option is currently selected in the parent `u-select`\n */\n @property({ type: Boolean })\n get selected(): boolean {\n return this.#selected;\n }\n\n set selected(selected: boolean) {\n if (this.#selected === selected) {\n return;\n }\n\n this.#selected = selected;\n this.#select?._scheduleSync();\n }\n\n get defaultSelected(): boolean {\n return this.hasAttribute('selected');\n }\n\n set defaultSelected(value: boolean) {\n this.toggleAttribute('selected', value);\n }\n\n protected override _getContainerClasses() {\n return {\n ...super._getContainerClasses(),\n selected: this.selected,\n };\n }\n\n protected override _renderDefaultTrailingIcon(): TemplateResult {\n return svg`\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"1em\" viewBox=\"0 -960 960 960\" width=\"1em\" fill=\"currentColor\">\n <path d=\"M382-240 154-468l57-57 171 171 367-367 57 57-424 424Z\"/>\n </svg>`;\n }\n\n get #select(): Select | null {\n return this.parentElement?.tagName === 'U-SELECT'\n ? this.parentElement as Select\n : null;\n }\n\n override connectedCallback() {\n super.connectedCallback();\n this.addEventListener('click', this.#handleClick);\n this.setAttribute('tabindex', '-1');\n\n this.#mutationObserver.observe(this, {\n subtree: true,\n characterData: true,\n childList: true,\n });\n\n this.#updateContent();\n }\n\n override disconnectedCallback() {\n super.disconnectedCallback();\n this.removeEventListener('click', this.#handleClick);\n this.#mutationObserver.disconnect();\n }\n\n override attributeChangedCallback(name: string, _old: string | null, value: string | null) {\n super.attributeChangedCallback(name, _old, value);\n\n if (name === 'disabled') {\n this.#select?._scheduleSync();\n }\n }\n\n readonly #handleClick = (e: Event): void => {\n if (!this.#select || this.disabled) {\n return;\n }\n\n e.stopPropagation();\n this.#select._setSelectedByUser(this);\n };\n\n _setSelectedByUser() {\n if (!this.#select || this.disabled) {\n return;\n }\n\n this.#select._setSelectedByUser(this);\n }\n\n #updateContent(): void {\n this.#select?._renderOptionRelatedElements();\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'u-option': Option;\n }\n}\n"]}
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import { MenuFieldNavigationController } from '../shared/menu-field/menu-field-navigation-controller.js';
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
4
|
-
export declare class SelectNavigationController extends MenuFieldNavigationController<
|
|
2
|
+
import { Option } from './option.js';
|
|
3
|
+
import { Select } from './select.js';
|
|
4
|
+
export declare class SelectNavigationController extends MenuFieldNavigationController<Select, Option> {
|
|
5
5
|
#private;
|
|
6
6
|
protected handleKeyDown(event: KeyboardEvent): boolean;
|
|
7
7
|
attach(element: HTMLElement): void;
|
|
8
8
|
detach(): void;
|
|
9
|
-
protected afterFocus(_:
|
|
9
|
+
protected afterFocus(_: Option, index: number): void;
|
|
10
10
|
protected afterBlur(): void;
|
|
11
11
|
private handleType;
|
|
12
12
|
private findNextElementByTerm;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"select-navigation-controller.d.ts","sourceRoot":"","sources":["../../src/select/select-navigation-controller.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,6BAA6B,EAAE,MAAM,0DAA0D,CAAC;AACzG,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"select-navigation-controller.d.ts","sourceRoot":"","sources":["../../src/select/select-navigation-controller.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,6BAA6B,EAAE,MAAM,0DAA0D,CAAC;AACzG,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AASrC,qBAAa,0BAA2B,SAAQ,6BAA6B,CAAC,MAAM,EAAE,MAAM,CAAC;;cAGxE,aAAa,CAAC,KAAK,EAAE,aAAa,GAAG,OAAO;IA0BtD,MAAM,CAAC,OAAO,EAAE,WAAW;IAK3B,MAAM;cAWI,UAAU,CAAC,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM;cAInC,SAAS;IAI5B,OAAO,CAAC,UAAU;IAsBlB,OAAO,CAAC,qBAAqB;CAyB9B"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"select-navigation-controller.js","sourceRoot":"","sources":["../../src/select/select-navigation-controller.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,2BAA2B,CAAC;AACjE,OAAO,EAAE,6BAA6B,EAAE,MAAM,0DAA0D,CAAC;AAIzG,MAAM,uBAAuB,GAAG,GAAG,EAAE,CAAC,CAAC;IACrC,MAAM,EAAE,KAAK;IACb,SAAS,EAAE,KAAK;IAChB,MAAM,EAAE,EAAE;IACV,SAAS,EAAE,CAAC;CACb,CAAC,CAAC;AAEH,MAAM,OAAO,0BAA2B,SAAQ,
|
|
1
|
+
{"version":3,"file":"select-navigation-controller.js","sourceRoot":"","sources":["../../src/select/select-navigation-controller.ts"],"names":[],"mappings":"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","sourcesContent":["import { normalizedStartsWith } from '../shared/compare-text.js';\nimport { MenuFieldNavigationController } from '../shared/menu-field/menu-field-navigation-controller.js';\nimport { Option } from './option.js';\nimport { Select } from './select.js';\n\nconst getCleanTypeaheadStatus = () => ({\n typing: false,\n repeating: false,\n buffer: '',\n timeoutId: 0,\n});\n\nexport class SelectNavigationController extends MenuFieldNavigationController<Select, Option> {\n #typeaheadStatus = getCleanTypeaheadStatus();\n\n protected override handleKeyDown(event: KeyboardEvent): boolean {\n if (this.getHost()._menu.open) {\n const handled = super.handleKeyDown(event);\n\n return handled || this.handleType(event);\n }\n\n const isDown = event.key === 'ArrowDown';\n const isUp = event.key === 'ArrowUp';\n\n if (!isDown && !isUp) {\n return this.handleType(event);\n }\n\n event.preventDefault();\n this.getHost()._menu.show();\n\n if (!this.getHost().selectedOptions.length) {\n return true;\n }\n\n const option = this.getHost().selectedOptions[0];\n this.navigateTo(event, option, this.getHost()._menuItems.indexOf(option));\n return true;\n }\n\n override attach(element: HTMLElement) {\n super.attach(element);\n this.getHost()._menu.addEventListener('menu-item-mouseenter', this.#handleMouseFocus);\n }\n\n override detach() {\n super.detach();\n this.getHost()._menu.removeEventListener('menu-item-mouseenter', this.#handleMouseFocus);\n }\n\n readonly #handleMouseFocus = (e: Event) => {\n this.blurMenu();\n const option = e.target as Option;\n this.focusMenu(option, this.getHost()._menuItems.indexOf(option), false, false);\n };\n\n protected override afterFocus(_: Option, index: number) {\n this.getHost()._button.setAttribute('aria-activedescendant', `item-${index + 1}`);\n }\n\n protected override afterBlur() {\n this.getHost()._button.removeAttribute('aria-activedescendant');\n }\n\n private handleType(event: KeyboardEvent) {\n if (event.key.length > 1) {\n return false;\n }\n\n if (this.#typeaheadStatus.timeoutId) {\n clearTimeout(this.#typeaheadStatus.timeoutId);\n }\n\n const lastFocusedMenu = this.focusedMenu;\n\n this.#typeaheadStatus.buffer += event.key;\n\n this.#typeaheadStatus.timeoutId = setTimeout(() => this.#typeaheadStatus = getCleanTypeaheadStatus(), 1000);\n\n const term =\n this.#typeaheadStatus.buffer.replaceAll(event.key, '') === '' ? event.key : this.#typeaheadStatus.buffer;\n this.findNextElementByTerm(term, lastFocusedMenu);\n\n return true;\n }\n\n private findNextElementByTerm(term: string, lastFocusedMenu: Option | null): void {\n const options = this.getHost()._options;\n const lastFocusedMenuIndex = lastFocusedMenu ? options.indexOf(lastFocusedMenu) : -1;\n\n let nextMenu =\n lastFocusedMenuIndex > -1 ? this.getHost()._options[lastFocusedMenuIndex + 1] as Option | undefined : null;\n\n if (!nextMenu || !normalizedStartsWith(nextMenu.textContent, term)) {\n nextMenu = options.find(o => normalizedStartsWith(o.textContent, term));\n }\n\n if (!nextMenu) {\n return;\n }\n\n const nextMenuIndex = options.indexOf(nextMenu);\n\n if (this.getHost()._menu.open) {\n this.blurMenu();\n this.focusMenu(nextMenu, nextMenuIndex);\n return;\n }\n\n nextMenu._setSelectedByUser();\n }\n}\n"]}
|
package/select/select.d.ts
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import { TemplateResult } from 'lit';
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
2
|
+
import { Menu } from '../menu/menu.js';
|
|
3
|
+
import { MenuField } from '../shared/menu-field/menu-field.js';
|
|
4
|
+
import { FieldValidity, TextFieldBase } from '../shared/text-field-base/text-field-base.js';
|
|
5
|
+
import { Option } from './option.js';
|
|
6
6
|
import './option.js';
|
|
7
|
-
export declare class
|
|
7
|
+
export declare class Select extends TextFieldBase implements MenuField {
|
|
8
8
|
#private;
|
|
9
9
|
static styles: import("lit").CSSResultGroup[];
|
|
10
|
-
_menu:
|
|
10
|
+
_menu: Menu;
|
|
11
11
|
_button: HTMLButtonElement;
|
|
12
12
|
_input: HTMLElement;
|
|
13
13
|
/**
|
|
@@ -16,7 +16,12 @@ export declare class UmSelect extends UmTextFieldBase implements UmMenuField {
|
|
|
16
16
|
*/
|
|
17
17
|
menuPositioning: 'relative' | 'fixed';
|
|
18
18
|
/**
|
|
19
|
-
* The `value` of the selected option
|
|
19
|
+
* The `value` of the selected option. Mirrors the native `<select>`'s
|
|
20
|
+
* `value` IDL property — there is no `value` *attribute*; set the initial
|
|
21
|
+
* selection with `<u-option selected>`.
|
|
22
|
+
*
|
|
23
|
+
* Setting a value whose option isn't present yet (e.g. before an async list
|
|
24
|
+
* loads) is remembered and applied once that option appears.
|
|
20
25
|
*/
|
|
21
26
|
get value(): string;
|
|
22
27
|
set value(value: string);
|
|
@@ -25,9 +30,9 @@ export declare class UmSelect extends UmTextFieldBase implements UmMenuField {
|
|
|
25
30
|
*/
|
|
26
31
|
get selectedIndex(): number;
|
|
27
32
|
set selectedIndex(index: number);
|
|
28
|
-
get _options():
|
|
29
|
-
get _menuItems():
|
|
30
|
-
get selectedOptions():
|
|
33
|
+
get _options(): Option[];
|
|
34
|
+
get _menuItems(): Option[];
|
|
35
|
+
get selectedOptions(): Option[];
|
|
31
36
|
protected renderControl(): TemplateResult;
|
|
32
37
|
protected renderAfterContent(): TemplateResult;
|
|
33
38
|
protected renderDefaultTrailingIcon(): TemplateResult;
|
|
@@ -36,13 +41,14 @@ export declare class UmSelect extends UmTextFieldBase implements UmMenuField {
|
|
|
36
41
|
formResetCallback(): void;
|
|
37
42
|
formStateRestoreCallback(inFormState: string | null): void;
|
|
38
43
|
_scheduleSync(): void;
|
|
39
|
-
_setSelectedByUser(option:
|
|
44
|
+
_setSelectedByUser(option: Option): void;
|
|
45
|
+
protected _getValidity(): FieldValidity;
|
|
40
46
|
/** Re-renderiza display e listbox a11y quando o textContent de uma option muda. */
|
|
41
47
|
_renderOptionRelatedElements(): void;
|
|
42
48
|
}
|
|
43
49
|
declare global {
|
|
44
50
|
interface HTMLElementTagNameMap {
|
|
45
|
-
'u-select':
|
|
51
|
+
'u-select': Select;
|
|
46
52
|
}
|
|
47
53
|
}
|
|
48
54
|
//# sourceMappingURL=select.d.ts.map
|
package/select/select.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"select.d.ts","sourceRoot":"","sources":["../../src/select/select.ts"],"names":[],"mappings":"AAAA,OAAO,EAAqB,cAAc,EAAE,MAAM,KAAK,CAAC;AAKxD,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"select.d.ts","sourceRoot":"","sources":["../../src/select/select.ts"],"names":[],"mappings":"AAAA,OAAO,EAAqB,cAAc,EAAE,MAAM,KAAK,CAAC;AAKxD,OAAO,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;AACvC,OAAO,EAAE,SAAS,EAAE,MAAM,oCAAoC,CAAC;AAC/D,OAAO,EAAE,aAAa,EAAE,aAAa,EAAE,MAAM,8CAA8C,CAAC;AAC5F,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAIrC,OAAO,aAAa,CAAC;AAErB,qBACa,MAAO,SAAQ,aAAc,YAAW,SAAS;;IAC5D,OAAgB,MAAM,iCAAkC;IA0BjC,KAAK,EAAG,IAAI,CAAC;IACZ,OAAO,EAAG,iBAAiB,CAAC;IAC7B,MAAM,EAAG,WAAW,CAAC;IAE5C;;;OAGG;IACyD,eAAe,EAAE,UAAU,GAAG,OAAO,CAAc;IAE/G;;;;;;;OAOG;IACH,IACI,KAAK,IAAI,MAAM,CAElB;IAED,IAAI,KAAK,CAAC,KAAK,EAAE,MAAM,EAGtB;IAED;;OAEG;IACH,IACI,aAAa,IAAI,MAAM,CAE1B;IAED,IAAI,aAAa,CAAC,KAAK,EAAE,MAAM,EAK9B;IAED,IAAI,QAAQ,IAAI,MAAM,EAAE,CAEvB;IAED,IAAI,UAAU,IAAI,MAAM,EAAE,CAEzB;IAED,IAAI,eAAe,IAAI,MAAM,EAAE,CAG9B;cAEkB,aAAa,IAAI,cAAc;cAc/B,kBAAkB,IAAI,cAAc;cAQpC,yBAAyB,IAAI,cAAc;IAOrD,iBAAiB;IAOjB,oBAAoB;IAM7B,iBAAiB,IAAI,IAAI;IAUzB,wBAAwB,CAAC,WAAW,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI;IAI1D,aAAa,IAAI,IAAI;IAiBrB,kBAAkB,CAAC,MAAM,EAAE,MAAM,GAAG,IAAI;cAmBrB,YAAY,IAAI,aAAa;IAUhD,mFAAmF;IACnF,4BAA4B,IAAI,IAAI;CAwKrC;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,UAAU,EAAE,MAAM,CAAC;KACpB;CACF"}
|
package/select/select.js
CHANGED
|
@@ -3,11 +3,11 @@ import { html, render, svg } from 'lit';
|
|
|
3
3
|
import { customElement, property, query, state } from 'lit/decorators.js';
|
|
4
4
|
import { map } from 'lit/directives/map.js';
|
|
5
5
|
import { html as staticHtml } from 'lit/static-html.js';
|
|
6
|
-
import {
|
|
6
|
+
import { TextFieldBase } from '../shared/text-field-base/text-field-base.js';
|
|
7
7
|
import { SelectNavigationController } from './select-navigation-controller.js';
|
|
8
8
|
import { styles } from './select.styles.js';
|
|
9
9
|
import './option.js';
|
|
10
|
-
let
|
|
10
|
+
let Select = class Select extends TextFieldBase {
|
|
11
11
|
constructor() {
|
|
12
12
|
super(...arguments);
|
|
13
13
|
this.#list = (() => {
|
|
@@ -23,6 +23,13 @@ let UmSelect = class UmSelect extends UmTextFieldBase {
|
|
|
23
23
|
this.#syncScheduled = false;
|
|
24
24
|
this.#selectedIndex = -1;
|
|
25
25
|
this.#lastSyncSignature = '';
|
|
26
|
+
// The last value the consumer intentionally selected (via the `value`/
|
|
27
|
+
// `selectedIndex` setters, a user click, or an `<u-option selected>`). It is
|
|
28
|
+
// re-applied whenever the options change so the selection survives a
|
|
29
|
+
// framework re-rendering the `<u-option>` nodes — which otherwise drops the
|
|
30
|
+
// per-element `.selected` flag. `null` = no intentional selection yet (the
|
|
31
|
+
// first-enabled fallback is not sticky, preserving native parity).
|
|
32
|
+
this.#desiredValue = null;
|
|
26
33
|
/**
|
|
27
34
|
* The positioning strategy used by the dropdown menu. Use `'fixed'`
|
|
28
35
|
* when the select is rendered inside a clipped/scrollable container.
|
|
@@ -49,7 +56,7 @@ let UmSelect = class UmSelect extends UmTextFieldBase {
|
|
|
49
56
|
this.#navigationController.blurMenu();
|
|
50
57
|
};
|
|
51
58
|
}
|
|
52
|
-
static { this.styles = [
|
|
59
|
+
static { this.styles = [TextFieldBase.styles, styles]; }
|
|
53
60
|
#list;
|
|
54
61
|
#navigationController;
|
|
55
62
|
#resizeObserver;
|
|
@@ -57,13 +64,26 @@ let UmSelect = class UmSelect extends UmTextFieldBase {
|
|
|
57
64
|
#syncScheduled;
|
|
58
65
|
#selectedIndex;
|
|
59
66
|
#lastSyncSignature;
|
|
67
|
+
// The last value the consumer intentionally selected (via the `value`/
|
|
68
|
+
// `selectedIndex` setters, a user click, or an `<u-option selected>`). It is
|
|
69
|
+
// re-applied whenever the options change so the selection survives a
|
|
70
|
+
// framework re-rendering the `<u-option>` nodes — which otherwise drops the
|
|
71
|
+
// per-element `.selected` flag. `null` = no intentional selection yet (the
|
|
72
|
+
// first-enabled fallback is not sticky, preserving native parity).
|
|
73
|
+
#desiredValue;
|
|
60
74
|
/**
|
|
61
|
-
* The `value` of the selected option
|
|
75
|
+
* The `value` of the selected option. Mirrors the native `<select>`'s
|
|
76
|
+
* `value` IDL property — there is no `value` *attribute*; set the initial
|
|
77
|
+
* selection with `<u-option selected>`.
|
|
78
|
+
*
|
|
79
|
+
* Setting a value whose option isn't present yet (e.g. before an async list
|
|
80
|
+
* loads) is remembered and applied once that option appears.
|
|
62
81
|
*/
|
|
63
82
|
get value() {
|
|
64
83
|
return this._options[this.#selectedIndex]?.value ?? '';
|
|
65
84
|
}
|
|
66
85
|
set value(value) {
|
|
86
|
+
this.#desiredValue = value;
|
|
67
87
|
this.#commitIndex(this._options.findIndex(o => o.value === value));
|
|
68
88
|
}
|
|
69
89
|
/**
|
|
@@ -74,7 +94,9 @@ let UmSelect = class UmSelect extends UmTextFieldBase {
|
|
|
74
94
|
}
|
|
75
95
|
set selectedIndex(index) {
|
|
76
96
|
const len = this._options.length;
|
|
77
|
-
|
|
97
|
+
const target = index >= 0 && index < len ? index : -1;
|
|
98
|
+
this.#desiredValue = target >= 0 ? this._options[target].value : null;
|
|
99
|
+
this.#commitIndex(target);
|
|
78
100
|
}
|
|
79
101
|
get _options() {
|
|
80
102
|
return Array.from(this.querySelectorAll(':scope > u-option'));
|
|
@@ -125,6 +147,8 @@ let UmSelect = class UmSelect extends UmTextFieldBase {
|
|
|
125
147
|
for (const o of this._options) {
|
|
126
148
|
o.selected = o.defaultSelected;
|
|
127
149
|
}
|
|
150
|
+
// Drop the sticky value so the reset honors `<u-option selected>` defaults.
|
|
151
|
+
this.#desiredValue = null;
|
|
128
152
|
this.#syncFromOptions();
|
|
129
153
|
}
|
|
130
154
|
formStateRestoreCallback(inFormState) {
|
|
@@ -152,6 +176,7 @@ let UmSelect = class UmSelect extends UmTextFieldBase {
|
|
|
152
176
|
if (newIndex < 0) {
|
|
153
177
|
return;
|
|
154
178
|
}
|
|
179
|
+
this.#desiredValue = option.value;
|
|
155
180
|
this.#commitIndex(newIndex);
|
|
156
181
|
if (previousIndex !== newIndex) {
|
|
157
182
|
this.dispatchEvent(new InputEvent('input', { bubbles: true, composed: true }));
|
|
@@ -159,8 +184,22 @@ let UmSelect = class UmSelect extends UmTextFieldBase {
|
|
|
159
184
|
}
|
|
160
185
|
this._menu.close();
|
|
161
186
|
}
|
|
187
|
+
_getValidity() {
|
|
188
|
+
const valueMissing = this.required && this.value === '';
|
|
189
|
+
return {
|
|
190
|
+
flags: { valueMissing },
|
|
191
|
+
message: valueMissing ? 'Please select an item in the list.' : '',
|
|
192
|
+
anchor: this._button,
|
|
193
|
+
};
|
|
194
|
+
}
|
|
162
195
|
/** Re-renderiza display e listbox a11y quando o textContent de uma option muda. */
|
|
163
196
|
_renderOptionRelatedElements() {
|
|
197
|
+
// An option can call this from its own connectedCallback before the select
|
|
198
|
+
// has finished `#attach` (its `_input`/list aren't wired yet). Skip until
|
|
199
|
+
// the select is connected and rendered — `#attach` re-runs this afterwards.
|
|
200
|
+
if (!this.#connected || !this._input) {
|
|
201
|
+
return;
|
|
202
|
+
}
|
|
164
203
|
this.#renderAccessibilityList();
|
|
165
204
|
this.#updateDisplay();
|
|
166
205
|
}
|
|
@@ -176,27 +215,34 @@ let UmSelect = class UmSelect extends UmTextFieldBase {
|
|
|
176
215
|
}
|
|
177
216
|
#syncFromOptions() {
|
|
178
217
|
const options = this._options;
|
|
179
|
-
|
|
180
|
-
//
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
218
|
+
// 1. Sticky: re-apply the last intentional value if its option is (still or
|
|
219
|
+
// newly) present. This keeps the selection across option re-renders and
|
|
220
|
+
// applies a value set before its option existed.
|
|
221
|
+
if (this.#desiredValue !== null) {
|
|
222
|
+
const desiredIndex = options.findIndex(o => o.value === this.#desiredValue && !o.disabled);
|
|
223
|
+
if (desiredIndex >= 0) {
|
|
224
|
+
this.#commitIndex(desiredIndex);
|
|
225
|
+
return;
|
|
187
226
|
}
|
|
188
|
-
lastSelected = i;
|
|
189
227
|
}
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
228
|
+
// 2. Authored default: the last `<u-option selected>` — read the *attribute*
|
|
229
|
+
// (`defaultSelected`), not the runtime `.selected` flag, so the
|
|
230
|
+
// first-enabled fallback below can't be mistaken for an authored choice
|
|
231
|
+
// on a later sync. An authored choice is intentional, so make it sticky.
|
|
232
|
+
let authoredIndex = -1;
|
|
233
|
+
for (let i = 0; i < options.length; i++) {
|
|
234
|
+
if (options[i].defaultSelected) {
|
|
235
|
+
authoredIndex = i;
|
|
195
236
|
}
|
|
196
237
|
}
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
238
|
+
if (authoredIndex >= 0) {
|
|
239
|
+
this.#desiredValue = options[authoredIndex].value;
|
|
240
|
+
this.#commitIndex(authoredIndex);
|
|
241
|
+
return;
|
|
242
|
+
}
|
|
243
|
+
// 3. First-enabled fallback: a default, not an intentional choice, so it is
|
|
244
|
+
// left non-sticky — a later reorder/rebuild follows the native <select>.
|
|
245
|
+
this.#commitIndex(options.length ? options.findIndex(o => !o.disabled) : -1);
|
|
200
246
|
}
|
|
201
247
|
#computeSignature() {
|
|
202
248
|
return this._options
|
|
@@ -267,24 +313,24 @@ let UmSelect = class UmSelect extends UmTextFieldBase {
|
|
|
267
313
|
};
|
|
268
314
|
__decorate([
|
|
269
315
|
query('u-menu', true)
|
|
270
|
-
],
|
|
316
|
+
], Select.prototype, "_menu", void 0);
|
|
271
317
|
__decorate([
|
|
272
318
|
query('.button', true)
|
|
273
|
-
],
|
|
319
|
+
], Select.prototype, "_button", void 0);
|
|
274
320
|
__decorate([
|
|
275
321
|
query('.input', true)
|
|
276
|
-
],
|
|
322
|
+
], Select.prototype, "_input", void 0);
|
|
277
323
|
__decorate([
|
|
278
324
|
property({ reflect: true, attribute: 'menu-positioning' })
|
|
279
|
-
],
|
|
325
|
+
], Select.prototype, "menuPositioning", void 0);
|
|
280
326
|
__decorate([
|
|
281
327
|
state()
|
|
282
|
-
],
|
|
328
|
+
], Select.prototype, "value", null);
|
|
283
329
|
__decorate([
|
|
284
330
|
state()
|
|
285
|
-
],
|
|
286
|
-
|
|
331
|
+
], Select.prototype, "selectedIndex", null);
|
|
332
|
+
Select = __decorate([
|
|
287
333
|
customElement('u-select')
|
|
288
|
-
],
|
|
289
|
-
export {
|
|
334
|
+
], Select);
|
|
335
|
+
export { Select };
|
|
290
336
|
//# sourceMappingURL=select.js.map
|
package/select/select.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"select.js","sourceRoot":"","sources":["../../src/select/select.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, render, svg, TemplateResult } from 'lit';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { map } from 'lit/directives/map.js';\nimport { html as staticHtml } from 'lit/static-html.js';\n\nimport { UmMenu } from '../menu/menu.js';\nimport { UmMenuField } from '../shared/menu-field/menu-field.js';\nimport { UmTextFieldBase } from '../shared/text-field-base/text-field-base.js';\nimport { UmOption } from './option.js';\nimport { SelectNavigationController } from './select-navigation-controller.js';\nimport { styles } from './select.styles.js';\n\nimport './option.js';\n\n@customElement('u-select')\nexport class UmSelect extends UmTextFieldBase implements UmMenuField {\n static override styles = [UmTextFieldBase.styles, styles];\n\n readonly #list: HTMLElement = (() => {\n const list = document.createElement('div');\n list.role = 'listbox';\n list.id = 'list';\n list.className = 'list';\n\n return list;\n })();\n\n readonly #navigationController = new SelectNavigationController(this);\n readonly #resizeObserver = new ResizeObserver(() => this.#setMenuWidthProperty());\n\n #connected = false;\n #syncScheduled = false;\n #selectedIndex = -1;\n #lastSyncSignature = '';\n\n @query('u-menu', true) _menu!: UmMenu;\n @query('.button', true) _button!: HTMLButtonElement;\n @query('.input', true) _input!: HTMLElement;\n\n /**\n * The positioning strategy used by the dropdown menu. Use `'fixed'`\n * when the select is rendered inside a clipped/scrollable container.\n */\n @property({ reflect: true, attribute: 'menu-positioning' }) menuPositioning: 'relative' | 'fixed' = 'relative';\n\n /**\n * The `value` of the selected option\n */\n\n @state()\n get value(): string {\n return this._options[this.#selectedIndex]?.value ?? '';\n }\n\n set value(value: string) {\n this.#commitIndex(this._options.findIndex(o => o.value === value));\n }\n\n /**\n * The index of the selected option. When there's no selected option the value is `-1`.\n */\n @state()\n get selectedIndex(): number {\n return this.#selectedIndex;\n }\n\n set selectedIndex(index: number) {\n const len = this._options.length;\n this.#commitIndex(index >= 0 && index < len ? index : -1);\n }\n\n get _options(): UmOption[] {\n return Array.from(this.querySelectorAll<UmOption>(':scope > u-option'));\n }\n\n get _menuItems(): UmOption[] {\n return this._options;\n }\n\n get selectedOptions(): UmOption[] {\n const option = this._options[this.#selectedIndex];\n return option ? [option] : [];\n }\n\n protected override renderControl(): TemplateResult {\n return staticHtml`\n <button \n class=\"button\"\n role=\"combobox\"\n aria-haspopup=\"listbox\"\n aria-controls=\"list\"\n aria-expanded=\"false\"\n ?disabled=${this.disabled}></button>\n <div class=\"input\">\n <span class=\"display\"></span>\n </div>`;\n }\n\n protected override renderAfterContent(): TemplateResult {\n return html`\n <u-menu positioning=\"${this.menuPositioning}\">\n <slot @slotchange=${this.#handleSlotChange}></slot>\n </u-menu>\n `;\n }\n\n protected override renderDefaultTrailingIcon(): TemplateResult {\n return svg`\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"1em\" viewBox=\"0 -960 960 960\" width=\"1em\" fill=\"currentColor\">\n <path d=\"M480-360 280-560h400L480-360Z\"/>\n </svg>`;\n }\n\n override connectedCallback() {\n super.connectedCallback();\n\n this.#connected = true;\n this.#attach();\n }\n\n override disconnectedCallback() {\n super.disconnectedCallback();\n\n this.#detach();\n }\n\n formResetCallback(): void {\n for (const o of this._options) {\n o.selected = o.defaultSelected;\n }\n\n this.#syncFromOptions();\n }\n\n formStateRestoreCallback(inFormState: string | null): void {\n this.value = inFormState ?? '';\n }\n\n _scheduleSync(): void {\n if (this.#syncScheduled || !this.#connected) {\n return;\n }\n\n this.#syncScheduled = true;\n queueMicrotask(() => {\n try {\n if (this.#computeSignature() !== this.#lastSyncSignature) {\n this.#syncFromOptions();\n }\n } finally {\n this.#syncScheduled = false;\n }\n });\n }\n\n _setSelectedByUser(option: UmOption): void {\n const previousIndex = this.#selectedIndex;\n const newIndex = this._options.indexOf(option);\n\n if (newIndex < 0) {\n return;\n }\n\n this.#commitIndex(newIndex);\n\n if (previousIndex !== newIndex) {\n this.dispatchEvent(new InputEvent('input', { bubbles: true, composed: true }));\n this.dispatchEvent(new Event('change', { bubbles: true }));\n }\n\n this._menu.close();\n }\n\n /** Re-renderiza display e listbox a11y quando o textContent de uma option muda. */\n _renderOptionRelatedElements(): void {\n this.#renderAccessibilityList();\n this.#updateDisplay();\n }\n\n #commitIndex(index: number): void {\n const options = this._options;\n const target = index >= 0 ? options[index] : null;\n\n for (const o of options) {\n o.selected = o === target;\n }\n\n this.#selectedIndex = target ? index : -1;\n this.#lastSyncSignature = this.#computeSignature();\n this.#emitState();\n }\n\n #syncFromOptions(): void {\n const options = this._options;\n let lastSelected = -1;\n\n // last-wins\n for (let i = 0; i < options.length; i++) {\n if (!options[i].selected) {\n continue;\n }\n\n if (lastSelected >= 0) {\n options[lastSelected].selected = false;\n }\n\n lastSelected = i;\n }\n\n if (lastSelected < 0 && options.length > 0) {\n const firstEnabled = options.findIndex(o => !o.disabled);\n\n if (firstEnabled >= 0) {\n options[firstEnabled].selected = true;\n lastSelected = firstEnabled;\n }\n }\n\n this.#selectedIndex = lastSelected;\n this.#lastSyncSignature = this.#computeSignature();\n this.#emitState();\n }\n\n #computeSignature(): string {\n return this._options\n .map(o => `${o.selected ? 1 : 0}:${o.disabled ? 1 : 0}:${o.value}`)\n .join('|');\n }\n\n #emitState(): void {\n this.elementInternals.setFormValue(this.value || null);\n this.#renderAccessibilityList();\n this.#updateDisplay();\n this.#updateEmpty();\n this.requestUpdate();\n }\n\n #updateEmpty(): void {\n const o = this._options[this.#selectedIndex];\n this.empty = !o?.textContent?.trim();\n }\n\n #renderAccessibilityList(): void {\n const selectedIdx = this.#selectedIndex;\n render(\n map(this._options, (option, index) =>\n html`<div role=\"option\"\n id=${`item-${index + 1}`}\n aria-selected=${index === selectedIdx ? 'true' : 'false'}>\n ${option.textContent}\n </div>`),\n this.#list);\n }\n\n #updateDisplay(): void {\n if (!this._input) {\n return;\n }\n\n this._input.textContent = this._options[this.#selectedIndex]?.textContent?.trim() ?? '';\n }\n\n #setMenuWidthProperty(): void {\n this.style.setProperty('--_menu-width', `${this.clientWidth}px`);\n }\n\n readonly #handleSlotChange = (): void => {\n this.#syncFromOptions();\n };\n\n readonly #handleClick = (e: MouseEvent) => {\n this._menu.toggle();\n\n if (!this._menu.open || this.#selectedIndex === -1) {\n return;\n }\n\n this.#navigationController.focusMenu(this.selectedOptions[0], 0, e.detail === 0, false);\n };\n\n #handleMenuClick(e: Event) {\n e.stopPropagation();\n }\n\n readonly #handleMenuOpen = () => {\n this._button.setAttribute('aria-expanded', 'true');\n };\n\n readonly #handleMenuOpened = () => {\n this._options[this.#selectedIndex]?.scrollIntoView({ block: 'nearest' });\n };\n\n readonly #handleMenuClose = () => {\n this._button.setAttribute('aria-expanded', 'false');\n this.#navigationController.blurMenu();\n };\n\n async #attach(): Promise<void> {\n this.#resizeObserver.observe(this);\n this._renderOptionRelatedElements();\n\n await this.updateComplete;\n\n this.#navigationController.attach(this);\n\n this._input.appendChild(this.#list);\n this._button.addEventListener('click', this.#handleClick);\n\n this._menu.anchorElement = this._container;\n this._menu.addEventListener('click', this.#handleMenuClick);\n this._menu.addEventListener('open', this.#handleMenuOpen);\n this._menu.addEventListener('opened', this.#handleMenuOpened);\n this._menu.addEventListener('close', this.#handleMenuClose);\n\n this.#syncFromOptions();\n }\n\n #detach(): void {\n this.#resizeObserver.disconnect();\n this.#list.remove();\n this.#navigationController.detach();\n this.#connected = false;\n this._button.removeEventListener('click', this.#handleClick);\n this._menu.removeEventListener('click', this.#handleMenuClick);\n this._menu.removeEventListener('open', this.#handleMenuOpen);\n this._menu.removeEventListener('opened', this.#handleMenuOpened);\n this._menu.removeEventListener('close', this.#handleMenuClose);\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'u-select': UmSelect;\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"select.js","sourceRoot":"","sources":["../../src/select/select.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, render, svg, TemplateResult } from 'lit';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { map } from 'lit/directives/map.js';\nimport { html as staticHtml } from 'lit/static-html.js';\n\nimport { Menu } from '../menu/menu.js';\nimport { MenuField } from '../shared/menu-field/menu-field.js';\nimport { FieldValidity, TextFieldBase } from '../shared/text-field-base/text-field-base.js';\nimport { Option } from './option.js';\nimport { SelectNavigationController } from './select-navigation-controller.js';\nimport { styles } from './select.styles.js';\n\nimport './option.js';\n\n@customElement('u-select')\nexport class Select extends TextFieldBase implements MenuField {\n static override styles = [TextFieldBase.styles, styles];\n\n readonly #list: HTMLElement = (() => {\n const list = document.createElement('div');\n list.role = 'listbox';\n list.id = 'list';\n list.className = 'list';\n\n return list;\n })();\n\n readonly #navigationController = new SelectNavigationController(this);\n readonly #resizeObserver = new ResizeObserver(() => this.#setMenuWidthProperty());\n\n #connected = false;\n #syncScheduled = false;\n #selectedIndex = -1;\n #lastSyncSignature = '';\n // The last value the consumer intentionally selected (via the `value`/\n // `selectedIndex` setters, a user click, or an `<u-option selected>`). It is\n // re-applied whenever the options change so the selection survives a\n // framework re-rendering the `<u-option>` nodes — which otherwise drops the\n // per-element `.selected` flag. `null` = no intentional selection yet (the\n // first-enabled fallback is not sticky, preserving native parity).\n #desiredValue: string | null = null;\n\n @query('u-menu', true) _menu!: Menu;\n @query('.button', true) _button!: HTMLButtonElement;\n @query('.input', true) _input!: HTMLElement;\n\n /**\n * The positioning strategy used by the dropdown menu. Use `'fixed'`\n * when the select is rendered inside a clipped/scrollable container.\n */\n @property({ reflect: true, attribute: 'menu-positioning' }) menuPositioning: 'relative' | 'fixed' = 'relative';\n\n /**\n * The `value` of the selected option. Mirrors the native `<select>`'s\n * `value` IDL property — there is no `value` *attribute*; set the initial\n * selection with `<u-option selected>`.\n *\n * Setting a value whose option isn't present yet (e.g. before an async list\n * loads) is remembered and applied once that option appears.\n */\n @state()\n get value(): string {\n return this._options[this.#selectedIndex]?.value ?? '';\n }\n\n set value(value: string) {\n this.#desiredValue = value;\n this.#commitIndex(this._options.findIndex(o => o.value === value));\n }\n\n /**\n * The index of the selected option. When there's no selected option the value is `-1`.\n */\n @state()\n get selectedIndex(): number {\n return this.#selectedIndex;\n }\n\n set selectedIndex(index: number) {\n const len = this._options.length;\n const target = index >= 0 && index < len ? index : -1;\n this.#desiredValue = target >= 0 ? this._options[target].value : null;\n this.#commitIndex(target);\n }\n\n get _options(): Option[] {\n return Array.from(this.querySelectorAll<Option>(':scope > u-option'));\n }\n\n get _menuItems(): Option[] {\n return this._options;\n }\n\n get selectedOptions(): Option[] {\n const option = this._options[this.#selectedIndex];\n return option ? [option] : [];\n }\n\n protected override renderControl(): TemplateResult {\n return staticHtml`\n <button \n class=\"button\"\n role=\"combobox\"\n aria-haspopup=\"listbox\"\n aria-controls=\"list\"\n aria-expanded=\"false\"\n ?disabled=${this.disabled}></button>\n <div class=\"input\">\n <span class=\"display\"></span>\n </div>`;\n }\n\n protected override renderAfterContent(): TemplateResult {\n return html`\n <u-menu positioning=\"${this.menuPositioning}\">\n <slot @slotchange=${this.#handleSlotChange}></slot>\n </u-menu>\n `;\n }\n\n protected override renderDefaultTrailingIcon(): TemplateResult {\n return svg`\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"1em\" viewBox=\"0 -960 960 960\" width=\"1em\" fill=\"currentColor\">\n <path d=\"M480-360 280-560h400L480-360Z\"/>\n </svg>`;\n }\n\n override connectedCallback() {\n super.connectedCallback();\n\n this.#connected = true;\n this.#attach();\n }\n\n override disconnectedCallback() {\n super.disconnectedCallback();\n\n this.#detach();\n }\n\n formResetCallback(): void {\n for (const o of this._options) {\n o.selected = o.defaultSelected;\n }\n\n // Drop the sticky value so the reset honors `<u-option selected>` defaults.\n this.#desiredValue = null;\n this.#syncFromOptions();\n }\n\n formStateRestoreCallback(inFormState: string | null): void {\n this.value = inFormState ?? '';\n }\n\n _scheduleSync(): void {\n if (this.#syncScheduled || !this.#connected) {\n return;\n }\n\n this.#syncScheduled = true;\n queueMicrotask(() => {\n try {\n if (this.#computeSignature() !== this.#lastSyncSignature) {\n this.#syncFromOptions();\n }\n } finally {\n this.#syncScheduled = false;\n }\n });\n }\n\n _setSelectedByUser(option: Option): void {\n const previousIndex = this.#selectedIndex;\n const newIndex = this._options.indexOf(option);\n\n if (newIndex < 0) {\n return;\n }\n\n this.#desiredValue = option.value;\n this.#commitIndex(newIndex);\n\n if (previousIndex !== newIndex) {\n this.dispatchEvent(new InputEvent('input', { bubbles: true, composed: true }));\n this.dispatchEvent(new Event('change', { bubbles: true }));\n }\n\n this._menu.close();\n }\n\n protected override _getValidity(): FieldValidity {\n const valueMissing = this.required && this.value === '';\n\n return {\n flags: { valueMissing },\n message: valueMissing ? 'Please select an item in the list.' : '',\n anchor: this._button,\n };\n }\n\n /** Re-renderiza display e listbox a11y quando o textContent de uma option muda. */\n _renderOptionRelatedElements(): void {\n // An option can call this from its own connectedCallback before the select\n // has finished `#attach` (its `_input`/list aren't wired yet). Skip until\n // the select is connected and rendered — `#attach` re-runs this afterwards.\n if (!this.#connected || !this._input) {\n return;\n }\n\n this.#renderAccessibilityList();\n this.#updateDisplay();\n }\n\n #commitIndex(index: number): void {\n const options = this._options;\n const target = index >= 0 ? options[index] : null;\n\n for (const o of options) {\n o.selected = o === target;\n }\n\n this.#selectedIndex = target ? index : -1;\n this.#lastSyncSignature = this.#computeSignature();\n this.#emitState();\n }\n\n #syncFromOptions(): void {\n const options = this._options;\n\n // 1. Sticky: re-apply the last intentional value if its option is (still or\n // newly) present. This keeps the selection across option re-renders and\n // applies a value set before its option existed.\n if (this.#desiredValue !== null) {\n const desiredIndex = options.findIndex(o => o.value === this.#desiredValue && !o.disabled);\n\n if (desiredIndex >= 0) {\n this.#commitIndex(desiredIndex);\n return;\n }\n }\n\n // 2. Authored default: the last `<u-option selected>` — read the *attribute*\n // (`defaultSelected`), not the runtime `.selected` flag, so the\n // first-enabled fallback below can't be mistaken for an authored choice\n // on a later sync. An authored choice is intentional, so make it sticky.\n let authoredIndex = -1;\n\n for (let i = 0; i < options.length; i++) {\n if (options[i].defaultSelected) {\n authoredIndex = i;\n }\n }\n\n if (authoredIndex >= 0) {\n this.#desiredValue = options[authoredIndex].value;\n this.#commitIndex(authoredIndex);\n return;\n }\n\n // 3. First-enabled fallback: a default, not an intentional choice, so it is\n // left non-sticky — a later reorder/rebuild follows the native <select>.\n this.#commitIndex(options.length ? options.findIndex(o => !o.disabled) : -1);\n }\n\n #computeSignature(): string {\n return this._options\n .map(o => `${o.selected ? 1 : 0}:${o.disabled ? 1 : 0}:${o.value}`)\n .join('|');\n }\n\n #emitState(): void {\n this.elementInternals.setFormValue(this.value || null);\n this.#renderAccessibilityList();\n this.#updateDisplay();\n this.#updateEmpty();\n this.requestUpdate();\n }\n\n #updateEmpty(): void {\n const o = this._options[this.#selectedIndex];\n this.empty = !o?.textContent?.trim();\n }\n\n #renderAccessibilityList(): void {\n const selectedIdx = this.#selectedIndex;\n render(\n map(this._options, (option, index) =>\n html`<div role=\"option\"\n id=${`item-${index + 1}`}\n aria-selected=${index === selectedIdx ? 'true' : 'false'}>\n ${option.textContent}\n </div>`),\n this.#list);\n }\n\n #updateDisplay(): void {\n if (!this._input) {\n return;\n }\n\n this._input.textContent = this._options[this.#selectedIndex]?.textContent?.trim() ?? '';\n }\n\n #setMenuWidthProperty(): void {\n this.style.setProperty('--_menu-width', `${this.clientWidth}px`);\n }\n\n readonly #handleSlotChange = (): void => {\n this.#syncFromOptions();\n };\n\n readonly #handleClick = (e: MouseEvent) => {\n this._menu.toggle();\n\n if (!this._menu.open || this.#selectedIndex === -1) {\n return;\n }\n\n this.#navigationController.focusMenu(this.selectedOptions[0], 0, e.detail === 0, false);\n };\n\n #handleMenuClick(e: Event) {\n e.stopPropagation();\n }\n\n readonly #handleMenuOpen = () => {\n this._button.setAttribute('aria-expanded', 'true');\n };\n\n readonly #handleMenuOpened = () => {\n this._options[this.#selectedIndex]?.scrollIntoView({ block: 'nearest' });\n };\n\n readonly #handleMenuClose = () => {\n this._button.setAttribute('aria-expanded', 'false');\n this.#navigationController.blurMenu();\n };\n\n async #attach(): Promise<void> {\n this.#resizeObserver.observe(this);\n this._renderOptionRelatedElements();\n\n await this.updateComplete;\n\n this.#navigationController.attach(this);\n\n this._input.appendChild(this.#list);\n this._button.addEventListener('click', this.#handleClick);\n\n this._menu.anchorElement = this._container;\n this._menu.addEventListener('click', this.#handleMenuClick);\n this._menu.addEventListener('open', this.#handleMenuOpen);\n this._menu.addEventListener('opened', this.#handleMenuOpened);\n this._menu.addEventListener('close', this.#handleMenuClose);\n\n this.#syncFromOptions();\n }\n\n #detach(): void {\n this.#resizeObserver.disconnect();\n this.#list.remove();\n this.#navigationController.detach();\n this.#connected = false;\n this._button.removeEventListener('click', this.#handleClick);\n this._menu.removeEventListener('click', this.#handleMenuClick);\n this._menu.removeEventListener('open', this.#handleMenuOpen);\n this._menu.removeEventListener('opened', this.#handleMenuOpened);\n this._menu.removeEventListener('close', this.#handleMenuClose);\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'u-select': Select;\n }\n}\n"]}
|
|
@@ -2,7 +2,7 @@ import { CSSResultGroup } from '@lit/reactive-element/css-tag';
|
|
|
2
2
|
import { HTMLTemplateResult, LitElement } from 'lit';
|
|
3
3
|
import '../elevation/elevation.js';
|
|
4
4
|
import '../ripple/ripple.js';
|
|
5
|
-
export declare abstract class
|
|
5
|
+
export declare abstract class ButtonWrapper extends LitElement {
|
|
6
6
|
#private;
|
|
7
7
|
static styles: CSSResultGroup;
|
|
8
8
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button-wrapper.d.ts","sourceRoot":"","sources":["../../src/shared/button-wrapper.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,+BAA+B,CAAC;AAE/D,OAAO,EAAQ,kBAAkB,EAAE,UAAU,EAAW,MAAM,KAAK,CAAC;AASpE,OAAO,2BAA2B,CAAC;AACnC,OAAO,qBAAqB,CAAC;AAE7B,8BAAsB,
|
|
1
|
+
{"version":3,"file":"button-wrapper.d.ts","sourceRoot":"","sources":["../../src/shared/button-wrapper.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,+BAA+B,CAAC;AAE/D,OAAO,EAAQ,kBAAkB,EAAE,UAAU,EAAW,MAAM,KAAK,CAAC;AASpE,OAAO,2BAA2B,CAAC;AACnC,OAAO,qBAAqB,CAAC;AAE7B,8BAAsB,aAAc,SAAQ,UAAU;;IACpD,OAAgB,MAAM,EAAE,cAAc,CAAwB;IAE9D;;OAEG;IACyC,QAAQ,UAAS;IAEpD,YAAY,UAAQ;IAE7B;;OAEG;IACS,IAAI,EAAE,MAAM,GAAG,SAAS,CAAC;IAErC;;;OAGG;IACS,MAAM,EAAE,MAAM,GAAG,SAAS,CAAC;IAEvC;;OAEG;IACS,IAAI,EAAE,MAAM,GAAG,SAAS,CAAC;IAEnB,QAAQ,CAAC,aAAa,EAAG,WAAW,CAAC;IACpC,OAAO,CAAC,QAAQ,CAAC,OAAO,CAAU;IAErD,SAAS,CAAC,SAAS,EAAE,MAAM,GAAG,IAAI,CAAQ;IAE1C,IAAI,QAAQ,IAAI,MAAM,CAErB;cAEkB,MAAM,IAAI,kBAAkB;IAW/C,SAAS,CAAC,oBAAoB,IAAI,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;IAyCzD,SAAS,CAAC,QAAQ,CAAC,cAAc,IAAI,kBAAkB;IAE9C,iBAAiB;IAMjB,oBAAoB;IAMpB,KAAK;IAIL,IAAI;IAIb,SAAS,CAAC,YAAY,IAAI,MAAM,GAAG,IAAI;IAiCvC,SAAS,CAAC,YAAY,CAAC,CAAC,EAAE,OAAO,GAAG,IAAI;CAEzC"}
|