@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/button/button-base.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { CSSResultGroup } from '@lit/reactive-element/css-tag';
|
|
2
|
-
import {
|
|
3
|
-
export declare abstract class
|
|
2
|
+
import { ButtonWrapper } from '../shared/button-wrapper.js';
|
|
3
|
+
export declare abstract class ButtonBase extends ButtonWrapper {
|
|
4
4
|
#private;
|
|
5
5
|
static readonly formAssociated = true;
|
|
6
6
|
static styles: CSSResultGroup;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button-base.d.ts","sourceRoot":"","sources":["../../src/button/button-base.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,+BAA+B,CAAC;AAI/D,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"button-base.d.ts","sourceRoot":"","sources":["../../src/button/button-base.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,+BAA+B,CAAC;AAI/D,OAAO,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAC;AAG5D,8BAAsB,UAAW,SAAQ,aAAa;;IAEpD,MAAM,CAAC,QAAQ,CAAC,cAAc,QAAQ;IAEtC,OAAgB,MAAM,EAAE,cAAc,CAAkC;IAExE;;;OAGG;IACS,IAAI,SAAY;IAE5B;;OAEG;IAC0B,KAAK,SAAM;IAExC,IAAI,IAAI,IAAI,eAAe,GAAG,IAAI,CAEjC;;cASkB,YAAY,CAAC,CAAC,EAAE,OAAO,GAAG,IAAI;CA8BlD"}
|
package/button/button-base.js
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import { __decorate } from "tslib";
|
|
2
2
|
import { property } from 'lit/decorators.js';
|
|
3
|
-
import {
|
|
3
|
+
import { ButtonWrapper } from '../shared/button-wrapper.js';
|
|
4
4
|
import { styles } from './button-base.styles.js';
|
|
5
|
-
export class
|
|
5
|
+
export class ButtonBase extends ButtonWrapper {
|
|
6
6
|
static { this.formAssociated = true; }
|
|
7
|
-
static { this.styles = [
|
|
7
|
+
static { this.styles = [ButtonWrapper.styles, styles]; }
|
|
8
8
|
get form() {
|
|
9
9
|
return this.#elementInternals.form;
|
|
10
10
|
}
|
|
@@ -46,8 +46,8 @@ export class UmButtonBase extends UmButtonWrapper {
|
|
|
46
46
|
}
|
|
47
47
|
__decorate([
|
|
48
48
|
property()
|
|
49
|
-
],
|
|
49
|
+
], ButtonBase.prototype, "type", void 0);
|
|
50
50
|
__decorate([
|
|
51
51
|
property({ reflect: true })
|
|
52
|
-
],
|
|
52
|
+
], ButtonBase.prototype, "value", void 0);
|
|
53
53
|
//# sourceMappingURL=button-base.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button-base.js","sourceRoot":"","sources":["../../src/button/button-base.ts"],"names":[],"mappings":";AAEA,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE7C,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"button-base.js","sourceRoot":"","sources":["../../src/button/button-base.ts"],"names":[],"mappings":";AAEA,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE7C,OAAO,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAC;AAC5D,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AAEjD,MAAM,OAAgB,UAAW,SAAQ,aAAa;aAEpC,mBAAc,GAAG,IAAI,AAAP,CAAQ;aAEtB,WAAM,GAAmB,CAAC,aAAa,CAAC,MAAM,EAAE,MAAM,CAAC,AAAjD,CAAkD;IAaxE,IAAI,IAAI;QACN,OAAO,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC;IACrC,CAAC;IAEQ,iBAAiB,CAAmB;IAE7C;QACE,KAAK,EAAE,CAAC;QAlBV;;;WAGG;QACS,SAAI,GAAG,QAAQ,CAAC;QAE5B;;WAEG;QAC0B,UAAK,GAAG,EAAE,CAAC;QAUtC,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC,eAAe,EAAE,CAAC;IAClD,CAAC;IAEkB,YAAY,CAAC,CAAU;QAExC,IAAI,IAAI,CAAC,IAAI,KAAK,QAAQ,IAAI,CAAC,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;YAC1C,OAAO;QACT,CAAC;QAED,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;YACf,OAAO;QACT,CAAC;QAED,IAAI,CAAC,iBAAiB,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAEhD,IAAI,IAAI,CAAC,IAAI,KAAK,OAAO,EAAE,CAAC;YAC1B,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC;YAClB,OAAO;QACT,CAAC;QAED,IAAI,CAAC,IAAI,CAAC,gBAAgB,CACxB,QAAQ,EACR,WAAW,CAAC,EAAE;YACZ,MAAM,CAAC,cAAc,CAAC,WAAW,EAAE,WAAW,EAAE;gBAC9C,YAAY,EAAE,IAAI;gBAClB,UAAU,EAAE,IAAI;gBAChB,GAAG,EAAE,GAAG,EAAE,CAAC,IAAI;aAChB,CAAC,CAAC;QACL,CAAC,EACD,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,CAC9B,CAAC;QACF,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE,CAAC;IAC5B,CAAC;;AA/CW;IAAX,QAAQ,EAAE;wCAAiB;AAKC;IAA5B,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;yCAAY","sourcesContent":["import { CSSResultGroup } from '@lit/reactive-element/css-tag';\n\nimport { property } from 'lit/decorators.js';\n\nimport { ButtonWrapper } from '../shared/button-wrapper.js';\nimport { styles } from './button-base.styles.js';\n\nexport abstract class ButtonBase extends ButtonWrapper {\n\n static readonly formAssociated = true;\n\n static override styles: CSSResultGroup = [ButtonWrapper.styles, styles];\n\n /**\n * The button behavior. Mirrors the native `type` attribute and accepts\n * values like `submit`, `reset` or `button`.\n */\n @property() type = 'submit';\n\n /**\n * The value submitted with the form when this button is the submitter\n */\n @property({ reflect: true }) value = '';\n\n get form(): HTMLFormElement | null {\n return this.#elementInternals.form;\n }\n\n readonly #elementInternals: ElementInternals;\n\n constructor() {\n super();\n this.#elementInternals = this.attachInternals();\n }\n\n protected override _handleClick(_: UIEvent): void {\n\n if (this.type === 'button' || !!this.href) {\n return;\n }\n\n if (!this.form) {\n return;\n }\n\n this.#elementInternals.setFormValue(this.value);\n\n if (this.type === 'reset') {\n this.form.reset();\n return;\n }\n\n this.form.addEventListener(\n 'submit',\n submitEvent => {\n Object.defineProperty(submitEvent, 'submitter', {\n configurable: true,\n enumerable: true,\n get: () => this,\n });\n },\n { capture: true, once: true },\n );\n this.form.requestSubmit();\n }\n}\n"]}
|
package/button/button-set.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import {
|
|
2
|
-
export declare class
|
|
1
|
+
import { SetBase } from '../shared/sets/set-base.js';
|
|
2
|
+
export declare class ButtonSet extends SetBase {
|
|
3
3
|
static styles: import("lit").CSSResultGroup[];
|
|
4
4
|
/**
|
|
5
5
|
* Whether to render the buttons stacked or not
|
|
@@ -9,7 +9,7 @@ export declare class UmButtonSet extends UmSetBase {
|
|
|
9
9
|
}
|
|
10
10
|
declare global {
|
|
11
11
|
interface HTMLElementTagNameMap {
|
|
12
|
-
'u-button-set':
|
|
12
|
+
'u-button-set': ButtonSet;
|
|
13
13
|
}
|
|
14
14
|
}
|
|
15
15
|
//# sourceMappingURL=button-set.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button-set.d.ts","sourceRoot":"","sources":["../../src/button/button-set.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"button-set.d.ts","sourceRoot":"","sources":["../../src/button/button-set.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AAGrD,qBACa,SAAU,SAAQ,OAAO;IAEpC,OAAgB,MAAM,iCAA4B;IAElD;;OAEG;IACyC,KAAK,UAAS;IAEjD,SAAS,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAS;CACxD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,cAAc,EAAE,SAAS,CAAC;KAC3B;CACF"}
|
package/button/button-set.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { __decorate } from "tslib";
|
|
2
2
|
import { customElement, property } from 'lit/decorators.js';
|
|
3
|
-
import {
|
|
3
|
+
import { SetBase } from '../shared/sets/set-base.js';
|
|
4
4
|
import { styles } from './button-set.styles.js';
|
|
5
|
-
let
|
|
5
|
+
let ButtonSet = class ButtonSet extends SetBase {
|
|
6
6
|
constructor() {
|
|
7
7
|
super(...arguments);
|
|
8
8
|
/**
|
|
@@ -11,13 +11,13 @@ let UmButtonSet = class UmButtonSet extends UmSetBase {
|
|
|
11
11
|
this.stack = false;
|
|
12
12
|
this.alignment = 'end';
|
|
13
13
|
}
|
|
14
|
-
static { this.styles = [
|
|
14
|
+
static { this.styles = [SetBase.styles, styles]; }
|
|
15
15
|
};
|
|
16
16
|
__decorate([
|
|
17
17
|
property({ type: Boolean, reflect: true })
|
|
18
|
-
],
|
|
19
|
-
|
|
18
|
+
], ButtonSet.prototype, "stack", void 0);
|
|
19
|
+
ButtonSet = __decorate([
|
|
20
20
|
customElement('u-button-set')
|
|
21
|
-
],
|
|
22
|
-
export {
|
|
21
|
+
], ButtonSet);
|
|
22
|
+
export { ButtonSet };
|
|
23
23
|
//# sourceMappingURL=button-set.js.map
|
package/button/button-set.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button-set.js","sourceRoot":"","sources":["../../src/button/button-set.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE5D,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"button-set.js","sourceRoot":"","sources":["../../src/button/button-set.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE5D,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AACrD,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAC;AAGzC,IAAM,SAAS,GAAf,MAAM,SAAU,SAAQ,OAAO;IAA/B;;QAIL;;WAEG;QACyC,UAAK,GAAG,KAAK,CAAC;QAEjD,cAAS,GAA+B,KAAK,CAAC;IACzD,CAAC;aARiB,WAAM,GAAG,CAAC,OAAO,CAAC,MAAM,EAAE,MAAM,CAAC,AAA3B,CAA4B;;AAKN;IAA3C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;wCAAe;AAP/C,SAAS;IADrB,aAAa,CAAC,cAAc,CAAC;GACjB,SAAS,CAUrB","sourcesContent":["import { customElement, property } from 'lit/decorators.js';\n\nimport { SetBase } from '../shared/sets/set-base.js';\nimport { styles } from './button-set.styles.js';\n\n@customElement('u-button-set')\nexport class ButtonSet extends SetBase {\n\n static override styles = [SetBase.styles, styles];\n\n /**\n * Whether to render the buttons stacked or not\n */\n @property({ type: Boolean, reflect: true }) stack = false;\n\n override alignment: 'start' | 'center' | 'end' = 'end';\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'u-button-set': ButtonSet;\n }\n}\n"]}
|
package/button/button.d.ts
CHANGED
|
@@ -1,21 +1,21 @@
|
|
|
1
1
|
import { PropertyValues } from '@lit/reactive-element';
|
|
2
2
|
import { CSSResultGroup } from '@lit/reactive-element/css-tag';
|
|
3
3
|
import { HTMLTemplateResult } from 'lit';
|
|
4
|
-
import {
|
|
4
|
+
import { ToggleButton } from './toggle-button.js';
|
|
5
5
|
import '../ripple/ripple.js';
|
|
6
|
-
export type
|
|
7
|
-
export type
|
|
8
|
-
export declare class
|
|
6
|
+
export type ButtonVariant = 'filled' | 'tonal' | 'elevated' | 'outlined' | 'text';
|
|
7
|
+
export type ButtonColor = 'primary' | 'secondary' | 'tertiary' | 'error';
|
|
8
|
+
export declare class Button extends ToggleButton {
|
|
9
9
|
#private;
|
|
10
10
|
static styles: CSSResultGroup;
|
|
11
11
|
/**
|
|
12
12
|
* The Button variant to render
|
|
13
13
|
*/
|
|
14
|
-
variant:
|
|
14
|
+
variant: ButtonVariant;
|
|
15
15
|
/**
|
|
16
16
|
* The Button color
|
|
17
17
|
*/
|
|
18
|
-
color:
|
|
18
|
+
color: ButtonColor;
|
|
19
19
|
/**
|
|
20
20
|
* Whether the slotted icon is rendered after the label instead of before
|
|
21
21
|
*/
|
|
@@ -31,7 +31,7 @@ export declare class UmButton extends UmToggleButton {
|
|
|
31
31
|
}
|
|
32
32
|
declare global {
|
|
33
33
|
interface HTMLElementTagNameMap {
|
|
34
|
-
'u-button':
|
|
34
|
+
'u-button': Button;
|
|
35
35
|
}
|
|
36
36
|
}
|
|
37
37
|
//# sourceMappingURL=button.d.ts.map
|
package/button/button.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../src/button/button.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AACvD,OAAO,EAAE,cAAc,EAAE,MAAM,+BAA+B,CAAC;AAE/D,OAAO,EAAQ,kBAAkB,EAAE,MAAM,KAAK,CAAC;AAK/C,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../src/button/button.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AACvD,OAAO,EAAE,cAAc,EAAE,MAAM,+BAA+B,CAAC;AAE/D,OAAO,EAAQ,kBAAkB,EAAE,MAAM,KAAK,CAAC;AAK/C,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAElD,OAAO,qBAAqB,CAAC;AAE7B,MAAM,MAAM,aAAa,GAAG,QAAQ,GAAG,OAAO,GAAG,UAAU,GAAG,UAAU,GAAG,MAAM,CAAC;AAClF,MAAM,MAAM,WAAW,GAAG,SAAS,GAAG,WAAW,GAAG,UAAU,GAAG,OAAO,CAAC;AAEzE,qBACa,MAAO,SAAQ,YAAY;;IACtC,OAAgB,MAAM,EAAE,cAAc,CAAiC;IAEvE;;OAEG;IACS,OAAO,EAAE,aAAa,CAAY;IAE9C;;OAEG;IACS,KAAK,EAAE,WAAW,CAAa;IAE3C;;OAEG;IACqE,YAAY,UAAS;IAEpF,OAAO,CAAC,QAAQ,CAAS;IACzB,OAAO,CAAC,kBAAkB,CAAS;IACnC,iBAAiB,UAAS;IAEF,OAAO,CAAC,QAAQ,CAAC,YAAY,CAAe;IACtD,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAe;IAInD,YAAY,CAAC,iBAAiB,EAAE,cAAc;cAuBpC,oBAAoB,IAAI,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;cAW/C,cAAc,IAAI,kBAAkB;CAiCxD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,UAAU,EAAE,MAAM,CAAC;KACpB;CACF"}
|
package/button/button.js
CHANGED
|
@@ -3,9 +3,9 @@ import { html } from 'lit';
|
|
|
3
3
|
import { customElement, property, query, state } from 'lit/decorators.js';
|
|
4
4
|
import { classMap } from 'lit/directives/class-map.js';
|
|
5
5
|
import { styles } from './button.styles.js';
|
|
6
|
-
import {
|
|
6
|
+
import { ToggleButton } from './toggle-button.js';
|
|
7
7
|
import '../ripple/ripple.js';
|
|
8
|
-
let
|
|
8
|
+
let Button = class Button extends ToggleButton {
|
|
9
9
|
constructor() {
|
|
10
10
|
super(...arguments);
|
|
11
11
|
/**
|
|
@@ -24,7 +24,7 @@ let UmButton = class UmButton extends UmToggleButton {
|
|
|
24
24
|
this._hasSelectionLabel = false;
|
|
25
25
|
this.animateTextChange = false;
|
|
26
26
|
}
|
|
27
|
-
static { this.styles = [
|
|
27
|
+
static { this.styles = [ToggleButton.styles, styles]; }
|
|
28
28
|
#textSizeObserver;
|
|
29
29
|
firstUpdated(changedProperties) {
|
|
30
30
|
super.firstUpdated(changedProperties);
|
|
@@ -84,30 +84,30 @@ let UmButton = class UmButton extends UmToggleButton {
|
|
|
84
84
|
};
|
|
85
85
|
__decorate([
|
|
86
86
|
property()
|
|
87
|
-
],
|
|
87
|
+
], Button.prototype, "variant", void 0);
|
|
88
88
|
__decorate([
|
|
89
89
|
property()
|
|
90
|
-
],
|
|
90
|
+
], Button.prototype, "color", void 0);
|
|
91
91
|
__decorate([
|
|
92
92
|
property({ type: Boolean, attribute: 'trailing-icon', reflect: true })
|
|
93
|
-
],
|
|
93
|
+
], Button.prototype, "trailingIcon", void 0);
|
|
94
94
|
__decorate([
|
|
95
95
|
state()
|
|
96
|
-
],
|
|
96
|
+
], Button.prototype, "_hasIcon", void 0);
|
|
97
97
|
__decorate([
|
|
98
98
|
state()
|
|
99
|
-
],
|
|
99
|
+
], Button.prototype, "_hasSelectionLabel", void 0);
|
|
100
100
|
__decorate([
|
|
101
101
|
state()
|
|
102
|
-
],
|
|
102
|
+
], Button.prototype, "animateTextChange", void 0);
|
|
103
103
|
__decorate([
|
|
104
104
|
query('.label-container', true)
|
|
105
|
-
],
|
|
105
|
+
], Button.prototype, "_textWrapper", void 0);
|
|
106
106
|
__decorate([
|
|
107
107
|
query('#label', true)
|
|
108
|
-
],
|
|
109
|
-
|
|
108
|
+
], Button.prototype, "_text", void 0);
|
|
109
|
+
Button = __decorate([
|
|
110
110
|
customElement('u-button')
|
|
111
|
-
],
|
|
112
|
-
export {
|
|
111
|
+
], Button);
|
|
112
|
+
export { Button };
|
|
113
113
|
//# sourceMappingURL=button.js.map
|
package/button/button.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button.js","sourceRoot":"","sources":["../../src/button/button.ts"],"names":[],"mappings":";AAGA,OAAO,EAAE,IAAI,EAAsB,MAAM,KAAK,CAAC;AAC/C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAC1E,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AAEvD,OAAO,EAAE,MAAM,EAAE,MAAM,oBAAoB,CAAC;AAC5C,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"button.js","sourceRoot":"","sources":["../../src/button/button.ts"],"names":[],"mappings":";AAGA,OAAO,EAAE,IAAI,EAAsB,MAAM,KAAK,CAAC;AAC/C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAC1E,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AAEvD,OAAO,EAAE,MAAM,EAAE,MAAM,oBAAoB,CAAC;AAC5C,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAElD,OAAO,qBAAqB,CAAC;AAMtB,IAAM,MAAM,GAAZ,MAAM,MAAO,SAAQ,YAAY;IAAjC;;QAGL;;WAEG;QACS,YAAO,GAAkB,QAAQ,CAAC;QAE9C;;WAEG;QACS,UAAK,GAAgB,SAAS,CAAC;QAE3C;;WAEG;QACqE,iBAAY,GAAG,KAAK,CAAC;QAE5E,aAAQ,GAAG,KAAK,CAAC;QACjB,uBAAkB,GAAG,KAAK,CAAC;QACnC,sBAAiB,GAAG,KAAK,CAAC;IA0ErC,CAAC;aA7FiB,WAAM,GAAmB,CAAC,YAAY,CAAC,MAAM,EAAE,MAAM,CAAC,AAAhD,CAAiD;IAwBvE,iBAAiB,CAAyB;IAEjC,YAAY,CAAC,iBAAiC;QACrD,KAAK,CAAC,YAAY,CAAC,iBAAiB,CAAC,CAAC;QAEtC,IAAI,CAAC,iBAAiB,GAAG,IAAI,cAAc,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,oBAAoB,EAAE,CAAC,CAAC;QAC/E,IAAI,CAAC,iBAAiB,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAC3C,IAAI,CAAC,oBAAoB,EAAE,CAAC;IAC9B,CAAC;IAED,oBAAoB;QAElB,MAAM,KAAK,GAAG,GAAG,IAAI,CAAC,KAAK,CAAC,WAAW,IAAI,CAAC;QAC5C,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,KAAK,GAAG,KAAK,CAAC;QAEtC,MAAM,iBAAiB,GAAG,CAAC,CAAC,QAAQ,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC;QAEhD,IAAI,IAAI,CAAC,iBAAiB,KAAK,iBAAiB,EAAE,CAAC;YACjD,OAAO;QACT,CAAC;QAED,UAAU,CAAC,GAAG,EAAE,CACd,IAAI,CAAC,iBAAiB,GAAG,iBAAiB,CAAC,CAAC;IAChD,CAAC;IAEkB,oBAAoB;QACrC,OAAO;YACL,GAAG,KAAK,CAAC,oBAAoB,EAAE;YAC/B,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,IAAI;YAClB,CAAC,IAAI,CAAC,OAAO,CAAC,EAAE,IAAI;YACpB,eAAe,EAAE,IAAI,CAAC,YAAY;YAClC,UAAU,EAAE,IAAI,CAAC,QAAQ;YACzB,qBAAqB,EAAE,IAAI,CAAC,kBAAkB;SAC/C,CAAC;IACJ,CAAC;IAEkB,cAAc;QAC/B,MAAM,qBAAqB,GAAG,EAAE,OAAO,EAAE,IAAI,CAAC,iBAAiB,EAAE,CAAC;QAElE,OAAO,IAAI,CAAA;;;2CAG4B,IAAI,CAAC,qBAAqB;;;oDAGjB,IAAI,CAAC,6BAA6B;;;;qCAIjD,QAAQ,CAAC,qBAAqB,CAAC;;;;;;uDAMb,IAAI,CAAC,8BAA8B;;;;KAIrF,CAAC;IACJ,CAAC;IAED,qBAAqB,CAAC,CAAQ;QAC5B,IAAI,CAAC,QAAQ,GAAI,CAAC,CAAC,MAA0B,CAAC,gBAAgB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC;IAC/F,CAAC;IAED,8BAA8B,CAAC,CAAQ;QACrC,IAAI,CAAC,kBAAkB,GAAI,CAAC,CAAC,MAA0B,CAAC,gBAAgB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC;IACzG,CAAC;;AAvFW;IAAX,QAAQ,EAAE;uCAAmC;AAKlC;IAAX,QAAQ,EAAE;qCAAgC;AAK6B;IAAvE,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,eAAe,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;4CAAsB;AAE5E;IAAhB,KAAK,EAAE;wCAA0B;AACjB;IAAhB,KAAK,EAAE;kDAAoC;AACnC;IAAR,KAAK,EAAE;iDAA2B;AAEe;IAAjD,KAAK,CAAC,kBAAkB,EAAE,IAAI,CAAC;4CAA6C;AACrC;IAAvC,KAAK,CAAC,QAAQ,EAAE,IAAI,CAAC;qCAAsC;AAvBjD,MAAM;IADlB,aAAa,CAAC,UAAU,CAAC;GACb,MAAM,CA8FlB","sourcesContent":["import { PropertyValues } from '@lit/reactive-element';\nimport { CSSResultGroup } from '@lit/reactive-element/css-tag';\n\nimport { html, HTMLTemplateResult } from 'lit';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\n\nimport { styles } from './button.styles.js';\nimport { ToggleButton } from './toggle-button.js';\n\nimport '../ripple/ripple.js';\n\nexport type ButtonVariant = 'filled' | 'tonal' | 'elevated' | 'outlined' | 'text';\nexport type ButtonColor = 'primary' | 'secondary' | 'tertiary' | 'error';\n\n@customElement('u-button')\nexport class Button extends ToggleButton {\n static override styles: CSSResultGroup = [ToggleButton.styles, styles];\n\n /**\n * The Button variant to render\n */\n @property() variant: ButtonVariant = 'filled';\n\n /**\n * The Button color\n */\n @property() color: ButtonColor = 'primary';\n\n /**\n * Whether the slotted icon is rendered after the label instead of before\n */\n @property({ type: Boolean, attribute: 'trailing-icon', reflect: true }) trailingIcon = false;\n\n @state() private _hasIcon = false;\n @state() private _hasSelectionLabel = false;\n @state() animateTextChange = false;\n\n @query('.label-container', true) private readonly _textWrapper!: HTMLElement;\n @query('#label', true) private readonly _text!: HTMLElement;\n\n #textSizeObserver!: ResizeObserver | null;\n\n override firstUpdated(changedProperties: PropertyValues) {\n super.firstUpdated(changedProperties);\n\n this.#textSizeObserver = new ResizeObserver(() => this.#setTextWrapperWidth());\n this.#textSizeObserver.observe(this._text);\n this.#setTextWrapperWidth();\n }\n\n #setTextWrapperWidth(): void {\n\n const width = `${this._text.offsetWidth}px`;\n this._textWrapper.style.width = width;\n\n const animateTextChange = !!parseInt(width, 10);\n\n if (this.animateTextChange === animateTextChange) {\n return;\n }\n\n setTimeout(() =>\n this.animateTextChange = animateTextChange);\n }\n\n protected override _getContainerClasses(): Record<string, boolean> {\n return {\n ...super._getContainerClasses(),\n [this.color]: true,\n [this.variant]: true,\n 'trailing-icon': this.trailingIcon,\n 'has-icon': this._hasIcon,\n 'has-selection-label': this._hasSelectionLabel,\n };\n }\n\n protected override _renderContent(): HTMLTemplateResult {\n const labelContainerClasses = { animate: this.animateTextChange };\n\n return html`\n <span class=\"icon-container\" aria-hidden=\"true\">\n <span class=\"icon icon-default\">\n <slot name=\"icon\" @slotchange=\"${this.#handleIconSlotChange}\"></slot>\n </span>\n <span class=\"icon icon-selected\">\n <slot name=\"icon-selected\" @slotchange=\"${this._handleSelectedIconSlotChange}\"></slot>\n </span>\n </span>\n\n <span class=\"label-container ${classMap(labelContainerClasses)}\">\n <span id=\"label\">\n <span class=\"label label-default\">\n <slot></slot>\n </span>\n <span class=\"label label-selected\">\n <slot name=\"label-selected\" @slotchange=\"${this.#handleSelectedLabelSlotChange}\"></slot>\n </span>\n </span>\n </span>\n `;\n }\n\n #handleIconSlotChange(e: Event) {\n this._hasIcon = (e.target as HTMLSlotElement).assignedElements({ flatten: true }).length > 0;\n }\n\n #handleSelectedLabelSlotChange(e: Event): void {\n this._hasSelectionLabel = (e.target as HTMLSlotElement).assignedElements({ flatten: true }).length > 0;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'u-button': Button;\n }\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"fab-menu-color-context.d.ts","sourceRoot":"","sources":["../../src/button/fab-menu-color-context.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"fab-menu-color-context.d.ts","sourceRoot":"","sources":["../../src/button/fab-menu-color-context.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAC;AAEpC,eAAO,MAAM,mBAAmB;;CAAyD,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"fab-menu-color-context.js","sourceRoot":"","sources":["../../src/button/fab-menu-color-context.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAI7C,MAAM,CAAC,MAAM,mBAAmB,GAAG,aAAa,
|
|
1
|
+
{"version":3,"file":"fab-menu-color-context.js","sourceRoot":"","sources":["../../src/button/fab-menu-color-context.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAI7C,MAAM,CAAC,MAAM,mBAAmB,GAAG,aAAa,CAAW,MAAM,CAAC,qBAAqB,CAAC,CAAC,CAAC","sourcesContent":["import { createContext } from '@lit/context';\n\nimport { FabColor } from './fab.js';\n\nexport const fabMenuColorContext = createContext<FabColor>(Symbol('fabMenuColorContext'));\n"]}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { HTMLTemplateResult } from 'lit';
|
|
2
|
-
import {
|
|
3
|
-
export declare class
|
|
2
|
+
import { ButtonBase } from './button-base.js';
|
|
3
|
+
export declare class FabMenuItem extends ButtonBase {
|
|
4
4
|
#private;
|
|
5
5
|
static styles: import("lit").CSSResultGroup[];
|
|
6
6
|
private readonly _color;
|
|
@@ -17,7 +17,7 @@ export declare class UmFabMenuItem extends UmButtonBase {
|
|
|
17
17
|
}
|
|
18
18
|
declare global {
|
|
19
19
|
interface HTMLElementTagNameMap {
|
|
20
|
-
'u-fab-menu-item':
|
|
20
|
+
'u-fab-menu-item': FabMenuItem;
|
|
21
21
|
}
|
|
22
22
|
}
|
|
23
23
|
//# sourceMappingURL=fab-menu-item.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"fab-menu-item.d.ts","sourceRoot":"","sources":["../../src/button/fab-menu-item.ts"],"names":[],"mappings":"AAEA,OAAO,EAAQ,kBAAkB,EAAE,MAAM,KAAK,CAAC;AAG/C,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"fab-menu-item.d.ts","sourceRoot":"","sources":["../../src/button/fab-menu-item.ts"],"names":[],"mappings":"AAEA,OAAO,EAAQ,kBAAkB,EAAE,MAAM,KAAK,CAAC;AAG/C,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAM9C,qBACa,WAAY,SAAQ,UAAU;;IAEzC,OAAgB,MAAM,iCAA+B;IAKrD,OAAO,CAAC,QAAQ,CAAC,MAAM,CAAY;IAInC,OAAO,CAAC,QAAQ,CAAC,SAAS,CAAW;IAErC;;OAEG;IACS,KAAK,EAAE,MAAM,GAAG,IAAI,CAAQ;IAE/B,OAAO,CAAC,QAAQ,CAAS;IAElC,IACI,MAAM,WAET;IAED,IAAI,MAAM,CAAC,KAAK,QAAA,EAGf;cAEkB,oBAAoB,IAAI,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;cAS/C,cAAc,IAAI,kBAAkB;CAaxD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,iBAAiB,EAAE,WAAW,CAAC;KAChC;CACF"}
|
package/button/fab-menu-item.js
CHANGED
|
@@ -2,11 +2,11 @@ import { __decorate } from "tslib";
|
|
|
2
2
|
import { consume } from '@lit/context';
|
|
3
3
|
import { html } from 'lit';
|
|
4
4
|
import { customElement, property, state } from 'lit/decorators.js';
|
|
5
|
-
import {
|
|
5
|
+
import { ButtonBase } from './button-base.js';
|
|
6
6
|
import { fabMenuColorContext } from './fab-menu-color-context.js';
|
|
7
7
|
import { styles } from './fab-menu-item.styles.js';
|
|
8
8
|
import { fabMenuOpenContext } from './fab-menu-open-context.js';
|
|
9
|
-
let
|
|
9
|
+
let FabMenuItem = class FabMenuItem extends ButtonBase {
|
|
10
10
|
constructor() {
|
|
11
11
|
super(...arguments);
|
|
12
12
|
this.#index = 0;
|
|
@@ -16,7 +16,7 @@ let UmFabMenuItem = class UmFabMenuItem extends UmButtonBase {
|
|
|
16
16
|
this.label = null;
|
|
17
17
|
this._hasIcon = false;
|
|
18
18
|
}
|
|
19
|
-
static { this.styles = [
|
|
19
|
+
static { this.styles = [ButtonBase.styles, styles]; }
|
|
20
20
|
#index;
|
|
21
21
|
get _index() {
|
|
22
22
|
return this.#index;
|
|
@@ -49,22 +49,22 @@ let UmFabMenuItem = class UmFabMenuItem extends UmButtonBase {
|
|
|
49
49
|
__decorate([
|
|
50
50
|
consume({ context: fabMenuColorContext, subscribe: true }),
|
|
51
51
|
state()
|
|
52
|
-
],
|
|
52
|
+
], FabMenuItem.prototype, "_color", void 0);
|
|
53
53
|
__decorate([
|
|
54
54
|
consume({ context: fabMenuOpenContext, subscribe: true }),
|
|
55
55
|
state()
|
|
56
|
-
],
|
|
56
|
+
], FabMenuItem.prototype, "_menuOpen", void 0);
|
|
57
57
|
__decorate([
|
|
58
58
|
property()
|
|
59
|
-
],
|
|
59
|
+
], FabMenuItem.prototype, "label", void 0);
|
|
60
60
|
__decorate([
|
|
61
61
|
state()
|
|
62
|
-
],
|
|
62
|
+
], FabMenuItem.prototype, "_hasIcon", void 0);
|
|
63
63
|
__decorate([
|
|
64
64
|
state()
|
|
65
|
-
],
|
|
66
|
-
|
|
65
|
+
], FabMenuItem.prototype, "_index", null);
|
|
66
|
+
FabMenuItem = __decorate([
|
|
67
67
|
customElement('u-fab-menu-item')
|
|
68
|
-
],
|
|
69
|
-
export {
|
|
68
|
+
], FabMenuItem);
|
|
69
|
+
export { FabMenuItem };
|
|
70
70
|
//# sourceMappingURL=fab-menu-item.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"fab-menu-item.js","sourceRoot":"","sources":["../../src/button/fab-menu-item.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AAEvC,OAAO,EAAE,IAAI,EAAsB,MAAM,KAAK,CAAC;AAC/C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAEnE,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"fab-menu-item.js","sourceRoot":"","sources":["../../src/button/fab-menu-item.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AAEvC,OAAO,EAAE,IAAI,EAAsB,MAAM,KAAK,CAAC;AAC/C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAEnE,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAAE,mBAAmB,EAAE,MAAM,6BAA6B,CAAC;AAClE,OAAO,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC;AACnD,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAIzD,IAAM,WAAW,GAAjB,MAAM,WAAY,SAAQ,UAAU;IAApC;;QAGL,WAAM,GAAG,CAAC,CAAC;QAUX;;WAEG;QACS,UAAK,GAAkB,IAAI,CAAC;QAEvB,aAAQ,GAAG,KAAK,CAAC;IAkCpC,CAAC;aAlDiB,WAAM,GAAG,CAAC,UAAU,CAAC,MAAM,EAAE,MAAM,CAAC,AAA9B,CAA+B;IACrD,MAAM,CAAK;IAkBX,IAAI,MAAM;QACR,OAAO,IAAI,CAAC,MAAM,CAAC;IACrB,CAAC;IAED,IAAI,MAAM,CAAC,KAAK;QACd,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;QACpB,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,8BAA8B,EAAE,KAAK,CAAC,QAAQ,EAAE,CAAC,CAAC;IAC3E,CAAC;IAEkB,oBAAoB;QACrC,OAAO;YACL,GAAG,KAAK,CAAC,oBAAoB,EAAE;YAC/B,IAAI,EAAE,IAAI,CAAC,SAAS;YACpB,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE,IAAI;YACnB,UAAU,EAAE,IAAI,CAAC,QAAQ;SAC1B,CAAC;IACJ,CAAC;IAEkB,cAAc;QAC/B,OAAO,IAAI,CAAA;;;4BAGa,IAAI,CAAC,qBAAqB;;4BAE1B,IAAI,CAAC,KAAK;KACjC,CAAC;IACJ,CAAC;IAED,qBAAqB,CAAC,CAAQ;QAC5B,IAAI,CAAC,QAAQ,GAAI,CAAC,CAAC,MAA0B,CAAC,gBAAgB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC;IAC/F,CAAC;;AA5CgB;IAFhB,OAAO,CAAC,EAAE,OAAO,EAAE,mBAAmB,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;IAC1D,KAAK,EAAE;2CAC2B;AAIlB;IAFhB,OAAO,CAAC,EAAE,OAAO,EAAE,kBAAkB,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;IACzD,KAAK,EAAE;8CAC6B;AAKzB;IAAX,QAAQ,EAAE;0CAA6B;AAEvB;IAAhB,KAAK,EAAE;6CAA0B;AAGlC;IADC,KAAK,EAAE;yCAGP;AAvBU,WAAW;IADvB,aAAa,CAAC,iBAAiB,CAAC;GACpB,WAAW,CAoDvB","sourcesContent":["import { consume } from '@lit/context';\n\nimport { html, HTMLTemplateResult } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\n\nimport { ButtonBase } from './button-base.js';\nimport { fabMenuColorContext } from './fab-menu-color-context.js';\nimport { styles } from './fab-menu-item.styles.js';\nimport { fabMenuOpenContext } from './fab-menu-open-context.js';\nimport { FabColor } from './fab.js';\n\n@customElement('u-fab-menu-item')\nexport class FabMenuItem extends ButtonBase {\n\n static override styles = [ButtonBase.styles, styles];\n #index = 0;\n\n @consume({ context: fabMenuColorContext, subscribe: true })\n @state()\n private readonly _color!: FabColor;\n\n @consume({ context: fabMenuOpenContext, subscribe: true })\n @state()\n private readonly _menuOpen!: boolean;\n\n /**\n * The text to display the FAB menu item.\n */\n @property() label: string | null = null;\n\n @state() private _hasIcon = false;\n\n @state()\n get _index() {\n return this.#index;\n }\n\n set _index(value) {\n this.#index = value;\n this.style.setProperty('--_animation-delay-increment', value.toString());\n }\n\n protected override _getContainerClasses(): Record<string, boolean> {\n return {\n ...super._getContainerClasses(),\n open: this._menuOpen,\n [this._color]: true,\n 'has-icon': this._hasIcon,\n };\n }\n\n protected override _renderContent(): HTMLTemplateResult {\n return html`\n <span class=\"clipper\"></span>\n <span class=\"icon\" aria-hidden=\"true\">\n <slot @slotchange=${this.#handleIconSlotChange}></slot>\n </span>\n <span class=\"label\">${this.label}</span>\n `;\n }\n\n #handleIconSlotChange(e: Event) {\n this._hasIcon = (e.target as HTMLSlotElement).assignedElements({ flatten: true }).length > 0;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'u-fab-menu-item': FabMenuItem;\n }\n}\n"]}
|
package/button/fab-menu.d.ts
CHANGED
|
@@ -1,26 +1,41 @@
|
|
|
1
1
|
import { HTMLTemplateResult, LitElement } from 'lit';
|
|
2
|
-
import {
|
|
3
|
-
export declare class
|
|
2
|
+
import { FabColor, FabSize } from './fab.js';
|
|
3
|
+
export declare class FabMenu extends LitElement {
|
|
4
4
|
#private;
|
|
5
5
|
static styles: import("lit").CSSResult[];
|
|
6
6
|
/**
|
|
7
7
|
* The FAB color variant to render.
|
|
8
8
|
*/
|
|
9
|
-
color:
|
|
9
|
+
color: FabColor;
|
|
10
10
|
/**
|
|
11
11
|
* The size of the FAB.
|
|
12
12
|
*/
|
|
13
|
-
size:
|
|
13
|
+
size: FabSize;
|
|
14
14
|
/**
|
|
15
15
|
* Lowers the FAB's elevation.
|
|
16
16
|
*/
|
|
17
17
|
lowered: boolean;
|
|
18
18
|
open: boolean;
|
|
19
|
+
/**
|
|
20
|
+
* The element the FAB menu will observe for scroll. Accepts an
|
|
21
|
+
* `HTMLElement`, the id of an element, `'window'` to use the window
|
|
22
|
+
* scroll, or `'none'` to disable. When unset, the FAB menu consumes the
|
|
23
|
+
* scroll container provided by an ancestor `u-scaffold` via context,
|
|
24
|
+
* falling back to `'window'`. Reserved for future scroll-driven behaviors.
|
|
25
|
+
*/
|
|
26
|
+
scrollContainer: 'none' | 'window' | string | HTMLElement | undefined;
|
|
27
|
+
protected readonly _scrollContainerFromContext: HTMLElement | undefined;
|
|
28
|
+
/**
|
|
29
|
+
* The resolved scroll target according to the precedence
|
|
30
|
+
* explicit > context > window. Returns `null` when the explicit value
|
|
31
|
+
* is `'none'`.
|
|
32
|
+
*/
|
|
33
|
+
protected get _effectiveScrollContainer(): HTMLElement | Window | null;
|
|
19
34
|
protected render(): HTMLTemplateResult;
|
|
20
35
|
}
|
|
21
36
|
declare global {
|
|
22
37
|
interface HTMLElementTagNameMap {
|
|
23
|
-
'u-fab-menu':
|
|
38
|
+
'u-fab-menu': FabMenu;
|
|
24
39
|
}
|
|
25
40
|
}
|
|
26
41
|
//# sourceMappingURL=fab-menu.d.ts.map
|
package/button/fab-menu.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"fab-menu.d.ts","sourceRoot":"","sources":["../../src/button/fab-menu.ts"],"names":[],"mappings":"AAEA,OAAO,EAAQ,kBAAkB,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;
|
|
1
|
+
{"version":3,"file":"fab-menu.d.ts","sourceRoot":"","sources":["../../src/button/fab-menu.ts"],"names":[],"mappings":"AAEA,OAAO,EAAQ,kBAAkB,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAS3D,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC;AAE7C,qBACa,OAAQ,SAAQ,UAAU;;IAErC,OAAgB,MAAM,4BAAY;IAElC;;OAEG;IAGH,KAAK,EAAE,QAAQ,CAAa;IAE5B;;OAEG;IACS,IAAI,EAAE,OAAO,CAAY;IAErC;;OAEG;IACyC,OAAO,UAAS;IAI5D,IAAI,UAAS;IAEb;;;;;;OAMG;IAEH,eAAe,EAAE,MAAM,GAAG,QAAQ,GAAG,MAAM,GAAG,WAAW,GAAG,SAAS,CAAa;IAIlF,SAAS,CAAC,QAAQ,CAAC,2BAA2B,EAAG,WAAW,GAAG,SAAS,CAAC;IAEzE;;;;OAIG;IACH,SAAS,KAAK,yBAAyB,IAAI,WAAW,GAAG,MAAM,GAAG,IAAI,CAoBrE;cAEkB,MAAM,IAAI,kBAAkB;CAmDhD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,YAAY,EAAE,OAAO,CAAC;KACvB;CACF"}
|
package/button/fab-menu.js
CHANGED
|
@@ -1,13 +1,14 @@
|
|
|
1
1
|
import { __decorate } from "tslib";
|
|
2
|
-
import { provide } from '@lit/context';
|
|
2
|
+
import { consume, provide } from '@lit/context';
|
|
3
3
|
import { html, LitElement } from 'lit';
|
|
4
4
|
import { customElement, property, state } from 'lit/decorators.js';
|
|
5
5
|
import { classMap } from 'lit/directives/class-map.js';
|
|
6
|
+
import { scrollContainerContext } from '../scaffold/scroll-container-context.js';
|
|
6
7
|
import { fabMenuColorContext } from './fab-menu-color-context.js';
|
|
7
|
-
import {
|
|
8
|
+
import { FabMenuItem } from './fab-menu-item.js';
|
|
8
9
|
import { fabMenuOpenContext } from './fab-menu-open-context.js';
|
|
9
10
|
import { styles } from './fab-menu.styles.js';
|
|
10
|
-
let
|
|
11
|
+
let FabMenu = class FabMenu extends LitElement {
|
|
11
12
|
constructor() {
|
|
12
13
|
super(...arguments);
|
|
13
14
|
/**
|
|
@@ -23,8 +24,37 @@ let UmFabMenu = class UmFabMenu extends LitElement {
|
|
|
23
24
|
*/
|
|
24
25
|
this.lowered = false;
|
|
25
26
|
this.open = false;
|
|
27
|
+
/**
|
|
28
|
+
* The element the FAB menu will observe for scroll. Accepts an
|
|
29
|
+
* `HTMLElement`, the id of an element, `'window'` to use the window
|
|
30
|
+
* scroll, or `'none'` to disable. When unset, the FAB menu consumes the
|
|
31
|
+
* scroll container provided by an ancestor `u-scaffold` via context,
|
|
32
|
+
* falling back to `'window'`. Reserved for future scroll-driven behaviors.
|
|
33
|
+
*/
|
|
34
|
+
this.scrollContainer = undefined;
|
|
26
35
|
}
|
|
27
36
|
static { this.styles = [styles]; }
|
|
37
|
+
/**
|
|
38
|
+
* The resolved scroll target according to the precedence
|
|
39
|
+
* explicit > context > window. Returns `null` when the explicit value
|
|
40
|
+
* is `'none'`.
|
|
41
|
+
*/
|
|
42
|
+
get _effectiveScrollContainer() {
|
|
43
|
+
const explicit = this.scrollContainer;
|
|
44
|
+
if (explicit === 'none') {
|
|
45
|
+
return null;
|
|
46
|
+
}
|
|
47
|
+
if (explicit instanceof HTMLElement) {
|
|
48
|
+
return explicit;
|
|
49
|
+
}
|
|
50
|
+
if (typeof explicit === 'string' && explicit.length > 0) {
|
|
51
|
+
if (explicit === 'window') {
|
|
52
|
+
return window;
|
|
53
|
+
}
|
|
54
|
+
return document.getElementById(explicit);
|
|
55
|
+
}
|
|
56
|
+
return this._scrollContainerFromContext ?? window;
|
|
57
|
+
}
|
|
28
58
|
render() {
|
|
29
59
|
const containerClasses = classMap({
|
|
30
60
|
open: this.open,
|
|
@@ -66,7 +96,7 @@ let UmFabMenu = class UmFabMenu extends LitElement {
|
|
|
66
96
|
#handleIconItemsSlotChange(event) {
|
|
67
97
|
const elements = event.target.assignedElements({ flatten: true });
|
|
68
98
|
let index = 0;
|
|
69
|
-
for (const element of elements.filter(e => e instanceof
|
|
99
|
+
for (const element of elements.filter(e => e instanceof FabMenuItem).reverse()) {
|
|
70
100
|
element._index = index;
|
|
71
101
|
index++;
|
|
72
102
|
}
|
|
@@ -75,19 +105,26 @@ let UmFabMenu = class UmFabMenu extends LitElement {
|
|
|
75
105
|
__decorate([
|
|
76
106
|
provide({ context: fabMenuColorContext }),
|
|
77
107
|
property()
|
|
78
|
-
],
|
|
108
|
+
], FabMenu.prototype, "color", void 0);
|
|
79
109
|
__decorate([
|
|
80
110
|
property()
|
|
81
|
-
],
|
|
111
|
+
], FabMenu.prototype, "size", void 0);
|
|
82
112
|
__decorate([
|
|
83
113
|
property({ type: Boolean, reflect: true })
|
|
84
|
-
],
|
|
114
|
+
], FabMenu.prototype, "lowered", void 0);
|
|
85
115
|
__decorate([
|
|
86
116
|
provide({ context: fabMenuOpenContext }),
|
|
87
117
|
state()
|
|
88
|
-
],
|
|
89
|
-
|
|
118
|
+
], FabMenu.prototype, "open", void 0);
|
|
119
|
+
__decorate([
|
|
120
|
+
property({ attribute: 'scroll-container' })
|
|
121
|
+
], FabMenu.prototype, "scrollContainer", void 0);
|
|
122
|
+
__decorate([
|
|
123
|
+
consume({ context: scrollContainerContext, subscribe: true }),
|
|
124
|
+
state()
|
|
125
|
+
], FabMenu.prototype, "_scrollContainerFromContext", void 0);
|
|
126
|
+
FabMenu = __decorate([
|
|
90
127
|
customElement('u-fab-menu')
|
|
91
|
-
],
|
|
92
|
-
export {
|
|
128
|
+
], FabMenu);
|
|
129
|
+
export { FabMenu };
|
|
93
130
|
//# sourceMappingURL=fab-menu.js.map
|
package/button/fab-menu.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"fab-menu.js","sourceRoot":"","sources":["../../src/button/fab-menu.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;
|
|
1
|
+
{"version":3,"file":"fab-menu.js","sourceRoot":"","sources":["../../src/button/fab-menu.ts"],"names":[],"mappings":"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","sourcesContent":["import { consume, provide } from '@lit/context';\n\nimport { html, HTMLTemplateResult, LitElement } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\n\nimport { scrollContainerContext } from '../scaffold/scroll-container-context.js';\nimport { fabMenuColorContext } from './fab-menu-color-context.js';\nimport { FabMenuItem } from './fab-menu-item.js';\nimport { fabMenuOpenContext } from './fab-menu-open-context.js';\nimport { styles } from './fab-menu.styles.js';\nimport { FabColor, FabSize } from './fab.js';\n\n@customElement('u-fab-menu')\nexport class FabMenu extends LitElement {\n\n static override styles = [styles];\n\n /**\n * The FAB color variant to render.\n */\n @provide({ context: fabMenuColorContext })\n @property()\n color: FabColor = 'primary';\n\n /**\n * The size of the FAB.\n */\n @property() size: FabSize = 'medium';\n\n /**\n * Lowers the FAB's elevation.\n */\n @property({ type: Boolean, reflect: true }) lowered = false;\n\n @provide({ context: fabMenuOpenContext })\n @state()\n open = false;\n\n /**\n * The element the FAB menu will observe for scroll. Accepts an\n * `HTMLElement`, the id of an element, `'window'` to use the window\n * scroll, or `'none'` to disable. When unset, the FAB menu consumes the\n * scroll container provided by an ancestor `u-scaffold` via context,\n * falling back to `'window'`. Reserved for future scroll-driven behaviors.\n */\n @property({ attribute: 'scroll-container' })\n scrollContainer: 'none' | 'window' | string | HTMLElement | undefined = undefined;\n\n @consume({ context: scrollContainerContext, subscribe: true })\n @state()\n protected readonly _scrollContainerFromContext!: HTMLElement | undefined;\n\n /**\n * The resolved scroll target according to the precedence\n * explicit > context > window. Returns `null` when the explicit value\n * is `'none'`.\n */\n protected get _effectiveScrollContainer(): HTMLElement | Window | null {\n const explicit = this.scrollContainer;\n\n if (explicit === 'none') {\n return null;\n }\n\n if (explicit instanceof HTMLElement) {\n return explicit;\n }\n\n if (typeof explicit === 'string' && explicit.length > 0) {\n if (explicit === 'window') {\n return window;\n }\n\n return document.getElementById(explicit);\n }\n\n return this._scrollContainerFromContext ?? window;\n }\n\n protected override render(): HTMLTemplateResult {\n const containerClasses = classMap({\n open: this.open,\n [this.color]: true,\n });\n\n return html`\n <div class=\"container ${containerClasses}\">\n <div class=\"menu-items\">\n <slot @slotchange=${this.#handleIconItemsSlotChange}></slot>\n </div>\n <u-fab class=\"toggle-container\" .size=${this.size}>\n <u-fab \n class=\"toggle\"\n .color=${this.color}\n .lowered=${this.lowered}\n .size=${this.open ? 'medium' : this.size}\n @click=${this.#toggle}>\n <span class=\"icon-container\" aria-hidden=\"true\">\n <span class=\"icon icon-default\">\n <slot name=\"icon\"></slot>\n </span>\n <span class=\"icon icon-close\">\n <slot name=\"close-icon\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"1em\" viewBox=\"0 -960 960 960\" width=\"1em\" fill=\"currentColor\">\n <path\n d=\"m256-200-56-56 224-224-224-224 56-56 224 224 224-224 56 56-224 224 224 224-56 56-224-224-224 224Z\" />\n </svg>\n </slot>\n </span>\n </span>\n </u-fab>\n </u-fab>\n </div>\n `;\n }\n\n #toggle(): void {\n this.open = !this.open;\n }\n\n #handleIconItemsSlotChange(event: Event) {\n const elements = (event.target as HTMLSlotElement).assignedElements({ flatten: true });\n\n let index = 0;\n\n for (const element of elements.filter(e => e instanceof FabMenuItem).reverse()) {\n element._index = index;\n index++;\n }\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'u-fab-menu': FabMenu;\n }\n}\n"]}
|