igniteui-webcomponents 3.1.0 → 3.3.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/CHANGELOG.md +46 -0
- package/README.md +56 -1
- package/components/accordion/accordion.d.ts +36 -0
- package/components/accordion/accordion.js +127 -0
- package/components/accordion/accordion.js.map +1 -0
- package/components/{nav-drawer/styles/indigo/nav-drawer-header-item.indigo.css.d.ts → accordion/themes/accordion.base.css.d.ts} +0 -0
- package/components/accordion/themes/accordion.base.css.js +3 -0
- package/components/accordion/themes/accordion.base.css.js.map +1 -0
- package/components/badge/themes/light/badge.bootstrap.css.js +1 -1
- package/components/badge/themes/light/badge.bootstrap.css.js.map +1 -1
- package/components/button/button-base.d.ts +6 -1
- package/components/button/button-base.js +4 -0
- package/components/button/button-base.js.map +1 -1
- package/components/button/icon-button.d.ts +0 -1
- package/components/button/icon-button.js +13 -9
- package/components/button/icon-button.js.map +1 -1
- package/components/button/themes/button/light/button.base.css.js +1 -1
- package/components/button/themes/button/light/button.base.css.js.map +1 -1
- package/components/button/themes/button/light/button.material.css.js +1 -1
- package/components/button/themes/button/light/button.material.css.js.map +1 -1
- package/components/button/themes/icon-button/light/icon-button.base.css.js +1 -1
- package/components/button/themes/icon-button/light/icon-button.base.css.js.map +1 -1
- package/components/button/themes/icon-button/light/icon-button.bootstrap.css.js +1 -1
- package/components/button/themes/icon-button/light/icon-button.bootstrap.css.js.map +1 -1
- package/components/button/themes/icon-button/light/icon-button.fluent.css.js +1 -1
- package/components/button/themes/icon-button/light/icon-button.fluent.css.js.map +1 -1
- package/components/button/themes/icon-button/light/icon-button.indigo.css.js +1 -1
- package/components/button/themes/icon-button/light/icon-button.indigo.css.js.map +1 -1
- package/components/button/themes/icon-button/light/icon-button.material.css.js +1 -1
- package/components/button/themes/icon-button/light/icon-button.material.css.js.map +1 -1
- package/components/calendar/calendar.d.ts +1 -5
- package/components/calendar/calendar.js +6 -4
- package/components/calendar/calendar.js.map +1 -1
- package/components/calendar/common/calendar-base.js +16 -12
- package/components/calendar/common/calendar-base.js.map +1 -1
- package/components/calendar/common/calendar.model.js.map +1 -1
- package/components/calendar/days-view/days-view.d.ts +2 -1
- package/components/calendar/days-view/days-view.js +2 -2
- package/components/calendar/days-view/days-view.js.map +1 -1
- package/components/calendar/months-view/months-view.d.ts +2 -1
- package/components/calendar/months-view/months-view.js +2 -2
- package/components/calendar/months-view/months-view.js.map +1 -1
- package/components/calendar/themes/bootstrap/calendar.bootstrap.css.js +1 -1
- package/components/calendar/themes/bootstrap/calendar.bootstrap.css.js.map +1 -1
- package/components/calendar/years-view/years-view.d.ts +2 -1
- package/components/calendar/years-view/years-view.js +2 -2
- package/components/calendar/years-view/years-view.js.map +1 -1
- package/components/card/card.header.js +2 -0
- package/components/card/card.header.js.map +1 -1
- package/components/card/card.js +6 -0
- package/components/card/card.js.map +1 -1
- package/components/card/themes/light/card.header.bootstrap.css.js +1 -1
- package/components/card/themes/light/card.header.bootstrap.css.js.map +1 -1
- package/components/{nav-drawer/styles/indigo/nav-drawer-item.indigo.css.d.ts → card/themes/light/card.header.fluent.css.d.ts} +0 -0
- package/components/card/themes/light/card.header.fluent.css.js +3 -0
- package/components/card/themes/light/card.header.fluent.css.js.map +1 -0
- package/components/checkbox/checkbox-base.d.ts +1 -1
- package/components/checkbox/checkbox.d.ts +1 -0
- package/components/checkbox/checkbox.js +6 -5
- package/components/checkbox/checkbox.js.map +1 -1
- package/components/checkbox/switch.d.ts +1 -0
- package/components/checkbox/switch.js +6 -5
- package/components/checkbox/switch.js.map +1 -1
- package/components/checkbox/themes/light/checkbox.base.css.js +1 -1
- package/components/checkbox/themes/light/checkbox.base.css.js.map +1 -1
- package/components/checkbox/themes/light/checkbox.bootstrap.css.js +1 -1
- package/components/checkbox/themes/light/checkbox.bootstrap.css.js.map +1 -1
- package/components/checkbox/themes/light/checkbox.fluent.css.js +1 -1
- package/components/checkbox/themes/light/checkbox.fluent.css.js.map +1 -1
- package/components/checkbox/themes/light/checkbox.indigo.css.js +1 -1
- package/components/checkbox/themes/light/checkbox.indigo.css.js.map +1 -1
- package/components/checkbox/themes/light/checkbox.material.css.js +1 -1
- package/components/checkbox/themes/light/checkbox.material.css.js.map +1 -1
- package/components/checkbox/themes/light/switch.base.css.js +1 -1
- package/components/checkbox/themes/light/switch.base.css.js.map +1 -1
- package/components/checkbox/themes/light/switch.fluent.css.js +1 -1
- package/components/checkbox/themes/light/switch.fluent.css.js.map +1 -1
- package/components/chip/chip.d.ts +1 -2
- package/components/chip/chip.js +3 -1
- package/components/chip/chip.js.map +1 -1
- package/components/chip/themes/chip.base.css.js +1 -1
- package/components/chip/themes/chip.base.css.js.map +1 -1
- package/components/chip/themes/chip.bootstrap.css.js +1 -1
- package/components/chip/themes/chip.bootstrap.css.js.map +1 -1
- package/components/chip/themes/chip.fluent.css.js +1 -1
- package/components/chip/themes/chip.fluent.css.js.map +1 -1
- package/components/chip/themes/chip.indigo.css.js +1 -1
- package/components/chip/themes/chip.indigo.css.js.map +1 -1
- package/components/chip/themes/chip.material.css.js +1 -1
- package/components/chip/themes/chip.material.css.js.map +1 -1
- package/components/common/decorators/blazorAdditionalDependencies.d.ts +5 -0
- package/components/common/decorators/blazorAdditionalDependencies.js +6 -0
- package/components/common/decorators/blazorAdditionalDependencies.js.map +1 -0
- package/components/common/decorators/index.d.ts +1 -0
- package/components/common/decorators/index.js +1 -0
- package/components/common/decorators/index.js.map +1 -1
- package/components/common/definitions/defineAllComponents.js +18 -0
- package/components/common/definitions/defineAllComponents.js.map +1 -1
- package/components/common/i18n/calendar.resources.js.map +1 -1
- package/components/common/mixins/constructor.d.ts +1 -0
- package/components/common/mixins/constructor.js.map +1 -1
- package/components/common/mixins/event-emitter.d.ts +2 -2
- package/components/common/mixins/event-emitter.js +2 -2
- package/components/common/mixins/event-emitter.js.map +1 -1
- package/components/common/types.d.ts +1 -0
- package/components/common/types.js +2 -0
- package/components/common/types.js.map +1 -0
- package/components/common/util.d.ts +18 -0
- package/components/common/util.js +17 -0
- package/components/common/util.js.map +1 -1
- package/components/date-time-input/date-time-input.d.ts +110 -0
- package/components/date-time-input/date-time-input.js +505 -0
- package/components/date-time-input/date-time-input.js.map +1 -0
- package/components/date-time-input/date-util.d.ts +89 -0
- package/components/date-time-input/date-util.js +597 -0
- package/components/date-time-input/date-util.js.map +1 -0
- package/components/dropdown/dropdown-group.d.ts +3 -2
- package/components/dropdown/dropdown-group.js +9 -10
- package/components/dropdown/dropdown-group.js.map +1 -1
- package/components/dropdown/dropdown.d.ts +25 -21
- package/components/dropdown/dropdown.js +63 -79
- package/components/dropdown/dropdown.js.map +1 -1
- package/components/expansion-panel/expansion-panel.d.ts +73 -0
- package/components/expansion-panel/expansion-panel.js +173 -0
- package/components/expansion-panel/expansion-panel.js.map +1 -0
- package/components/{nav-drawer/styles/indigo/nav-drawer.indigo.css.d.ts → expansion-panel/themes/light/expansion-panel.base.css.d.ts} +0 -0
- package/components/expansion-panel/themes/light/expansion-panel.base.css.js +3 -0
- package/components/expansion-panel/themes/light/expansion-panel.base.css.js.map +1 -0
- package/components/{nav-drawer/styles/nav-drawer-header-item.base.css.d.ts → expansion-panel/themes/light/expansion-panel.bootstrap.css.d.ts} +0 -0
- package/components/expansion-panel/themes/light/expansion-panel.bootstrap.css.js +3 -0
- package/components/expansion-panel/themes/light/expansion-panel.bootstrap.css.js.map +1 -0
- package/components/{nav-drawer/styles/nav-drawer-item.base.css.d.ts → expansion-panel/themes/light/expansion-panel.fluent.css.d.ts} +0 -0
- package/components/expansion-panel/themes/light/expansion-panel.fluent.css.js +3 -0
- package/components/expansion-panel/themes/light/expansion-panel.fluent.css.js.map +1 -0
- package/components/{nav-drawer/styles/nav-drawer.base.css.d.ts → expansion-panel/themes/light/expansion-panel.indigo.css.d.ts} +0 -0
- package/components/expansion-panel/themes/light/expansion-panel.indigo.css.js +3 -0
- package/components/expansion-panel/themes/light/expansion-panel.indigo.css.js.map +1 -0
- package/components/form/form.d.ts +1 -1
- package/components/form/form.js +12 -2
- package/components/form/form.js.map +1 -1
- package/components/icon/icon.js +3 -7
- package/components/icon/icon.js.map +1 -1
- package/components/icon/icon.material.css.js +1 -1
- package/components/icon/icon.material.css.js.map +1 -1
- package/components/icon/icon.registry.js +5 -0
- package/components/icon/icon.registry.js.map +1 -1
- package/components/input/input-base.d.ts +7 -3
- package/components/input/input-base.js +16 -11
- package/components/input/input-base.js.map +1 -1
- package/components/input/input.d.ts +1 -4
- package/components/input/input.js +8 -4
- package/components/input/input.js.map +1 -1
- package/components/input/themes/light/input.base.css.js +1 -1
- package/components/input/themes/light/input.base.css.js.map +1 -1
- package/components/input/themes/light/input.bootstrap.css.js +1 -1
- package/components/input/themes/light/input.bootstrap.css.js.map +1 -1
- package/components/list/list.js +4 -0
- package/components/list/list.js.map +1 -1
- package/components/list/themes/light/list-item.bootstrap.css.js +1 -1
- package/components/list/themes/light/list-item.bootstrap.css.js.map +1 -1
- package/components/list/themes/light/list-item.fluent.css.js +1 -1
- package/components/list/themes/light/list-item.fluent.css.js.map +1 -1
- package/components/list/themes/light/list-item.indigo.css.js +1 -1
- package/components/list/themes/light/list-item.indigo.css.js.map +1 -1
- package/components/list/themes/light/list.base.css.js +1 -1
- package/components/list/themes/light/list.base.css.js.map +1 -1
- package/components/mask-input/mask-input-base.d.ts +38 -0
- package/components/mask-input/mask-input-base.js +110 -0
- package/components/mask-input/mask-input-base.js.map +1 -0
- package/components/mask-input/mask-input.d.ts +71 -0
- package/components/mask-input/mask-input.js +182 -0
- package/components/mask-input/mask-input.js.map +1 -0
- package/components/mask-input/mask-parser.d.ts +30 -0
- package/components/mask-input/mask-parser.js +167 -0
- package/components/mask-input/mask-parser.js.map +1 -0
- package/components/nav-drawer/nav-drawer-header-item.js +4 -3
- package/components/nav-drawer/nav-drawer-header-item.js.map +1 -1
- package/components/nav-drawer/nav-drawer-item.d.ts +1 -0
- package/components/nav-drawer/nav-drawer-item.js +9 -5
- package/components/nav-drawer/nav-drawer-item.js.map +1 -1
- package/components/nav-drawer/nav-drawer.js +6 -2
- package/components/nav-drawer/nav-drawer.js.map +1 -1
- package/components/{snackbar/themes/snackbar.base.css.d.ts → nav-drawer/themes/dark/nav-drawer-item.base.css.d.ts} +0 -0
- package/components/nav-drawer/themes/dark/nav-drawer-item.base.css.js +3 -0
- package/components/nav-drawer/themes/dark/nav-drawer-item.base.css.js.map +1 -0
- package/components/{snackbar/themes/snackbar.bootstrap.css.d.ts → nav-drawer/themes/dark/nav-drawer-item.bootstrap.css.d.ts} +0 -0
- package/components/nav-drawer/themes/dark/nav-drawer-item.bootstrap.css.js +3 -0
- package/components/nav-drawer/themes/dark/nav-drawer-item.bootstrap.css.js.map +1 -0
- package/components/{snackbar/themes/snackbar.fluent.css.d.ts → nav-drawer/themes/dark/nav-drawer-item.fluent.css.d.ts} +0 -0
- package/components/nav-drawer/themes/dark/nav-drawer-item.fluent.css.js +3 -0
- package/components/nav-drawer/themes/dark/nav-drawer-item.fluent.css.js.map +1 -0
- package/components/{snackbar/themes/snackbar.indigo.css.d.ts → nav-drawer/themes/dark/nav-drawer-item.indigo.css.d.ts} +0 -0
- package/components/nav-drawer/themes/dark/nav-drawer-item.indigo.css.js +3 -0
- package/components/nav-drawer/themes/dark/nav-drawer-item.indigo.css.js.map +1 -0
- package/components/nav-drawer/themes/dark/nav-drawer.indigo.css.d.ts +1 -0
- package/components/nav-drawer/themes/dark/nav-drawer.indigo.css.js +3 -0
- package/components/nav-drawer/themes/dark/nav-drawer.indigo.css.js.map +1 -0
- package/components/nav-drawer/themes/light/fluent/nav-drawer-header-item.fluent.css.d.ts +1 -0
- package/components/nav-drawer/themes/light/fluent/nav-drawer-header-item.fluent.css.js +3 -0
- package/components/nav-drawer/themes/light/fluent/nav-drawer-header-item.fluent.css.js.map +1 -0
- package/components/nav-drawer/themes/light/fluent/nav-drawer-item.fluent.css.d.ts +1 -0
- package/components/nav-drawer/themes/light/fluent/nav-drawer-item.fluent.css.js +3 -0
- package/components/nav-drawer/themes/light/fluent/nav-drawer-item.fluent.css.js.map +1 -0
- package/components/nav-drawer/themes/light/indigo/nav-drawer-header-item.indigo.css.d.ts +1 -0
- package/components/nav-drawer/{styles → themes/light}/indigo/nav-drawer-header-item.indigo.css.js +0 -0
- package/components/nav-drawer/themes/light/indigo/nav-drawer-header-item.indigo.css.js.map +1 -0
- package/components/nav-drawer/themes/light/indigo/nav-drawer-item.indigo.css.d.ts +1 -0
- package/components/nav-drawer/themes/light/indigo/nav-drawer-item.indigo.css.js +3 -0
- package/components/nav-drawer/themes/light/indigo/nav-drawer-item.indigo.css.js.map +1 -0
- package/components/nav-drawer/themes/light/indigo/nav-drawer.indigo.css.d.ts +1 -0
- package/components/nav-drawer/themes/light/indigo/nav-drawer.indigo.css.js +3 -0
- package/components/nav-drawer/themes/light/indigo/nav-drawer.indigo.css.js.map +1 -0
- package/components/nav-drawer/themes/light/nav-drawer-header-item.base.css.d.ts +1 -0
- package/components/nav-drawer/{styles → themes/light}/nav-drawer-header-item.base.css.js +1 -1
- package/components/nav-drawer/themes/light/nav-drawer-header-item.base.css.js.map +1 -0
- package/components/nav-drawer/themes/light/nav-drawer-item.base.css.d.ts +1 -0
- package/components/nav-drawer/themes/light/nav-drawer-item.base.css.js +3 -0
- package/components/nav-drawer/themes/light/nav-drawer-item.base.css.js.map +1 -0
- package/components/nav-drawer/themes/light/nav-drawer.base.css.d.ts +1 -0
- package/components/nav-drawer/{styles → themes/light}/nav-drawer.base.css.js +1 -1
- package/components/nav-drawer/themes/light/nav-drawer.base.css.js.map +1 -0
- package/components/navbar/navbar.js +2 -1
- package/components/navbar/navbar.js.map +1 -1
- package/components/navbar/themes/light/navbar.base.css.js +1 -1
- package/components/navbar/themes/light/navbar.base.css.js.map +1 -1
- package/components/navbar/themes/light/navbar.bootstrap.css.js +1 -1
- package/components/navbar/themes/light/navbar.bootstrap.css.js.map +1 -1
- package/components/navbar/themes/light/navbar.fluent.css.d.ts +1 -0
- package/components/navbar/themes/light/navbar.fluent.css.js +3 -0
- package/components/navbar/themes/light/navbar.fluent.css.js.map +1 -0
- package/components/progress/circular-progress.d.ts +1 -1
- package/components/progress/circular-progress.js +3 -0
- package/components/progress/circular-progress.js.map +1 -1
- package/components/radio/radio.d.ts +2 -1
- package/components/radio/radio.js +6 -5
- package/components/radio/radio.js.map +1 -1
- package/components/radio/themes/light/radio.base.css.js +1 -1
- package/components/radio/themes/light/radio.base.css.js.map +1 -1
- package/components/radio/themes/light/radio.fluent.css.js +1 -1
- package/components/radio/themes/light/radio.fluent.css.js.map +1 -1
- package/components/rating/rating-symbol.base.css.d.ts +1 -0
- package/components/rating/rating-symbol.base.css.js +3 -0
- package/components/rating/rating-symbol.base.css.js.map +1 -0
- package/components/rating/rating-symbol.d.ts +8 -2
- package/components/rating/rating-symbol.js +12 -3
- package/components/rating/rating-symbol.js.map +1 -1
- package/components/rating/rating.base.css.js +1 -1
- package/components/rating/rating.base.css.js.map +1 -1
- package/components/rating/rating.bootstrap.css.js +1 -1
- package/components/rating/rating.bootstrap.css.js.map +1 -1
- package/components/rating/rating.d.ts +19 -14
- package/components/rating/rating.fluent.css.js +1 -1
- package/components/rating/rating.fluent.css.js.map +1 -1
- package/components/rating/rating.indigo.css.js +1 -1
- package/components/rating/rating.indigo.css.js.map +1 -1
- package/components/rating/rating.js +86 -44
- package/components/rating/rating.js.map +1 -1
- package/components/slider/range-slider.d.ts +1 -1
- package/components/slider/range-slider.js.map +1 -1
- package/components/slider/slider-base.js +4 -1
- package/components/slider/slider-base.js.map +1 -1
- package/components/slider/slider.d.ts +1 -1
- package/components/slider/themes/light/slider.base.css.js +1 -1
- package/components/slider/themes/light/slider.base.css.js.map +1 -1
- package/components/slider/themes/light/slider.bootstrap.css.js +1 -1
- package/components/slider/themes/light/slider.bootstrap.css.js.map +1 -1
- package/components/slider/themes/light/slider.fluent.css.js +1 -1
- package/components/slider/themes/light/slider.fluent.css.js.map +1 -1
- package/components/slider/themes/light/slider.indigo.css.js +1 -1
- package/components/slider/themes/light/slider.indigo.css.js.map +1 -1
- package/components/slider/themes/light/slider.material.css.js +1 -1
- package/components/slider/themes/light/slider.material.css.js.map +1 -1
- package/components/snackbar/snackbar.d.ts +1 -1
- package/components/snackbar/snackbar.js +8 -4
- package/components/snackbar/snackbar.js.map +1 -1
- package/components/snackbar/themes/dark/snackbar.indigo.css.d.ts +1 -0
- package/components/snackbar/themes/dark/snackbar.indigo.css.js +3 -0
- package/components/snackbar/themes/dark/snackbar.indigo.css.js.map +1 -0
- package/components/snackbar/themes/light/snackbar.base.css.d.ts +1 -0
- package/components/snackbar/themes/light/snackbar.base.css.js +3 -0
- package/components/snackbar/themes/light/snackbar.base.css.js.map +1 -0
- package/components/snackbar/themes/light/snackbar.bootstrap.css.d.ts +1 -0
- package/components/snackbar/themes/light/snackbar.bootstrap.css.js +3 -0
- package/components/snackbar/themes/light/snackbar.bootstrap.css.js.map +1 -0
- package/components/snackbar/themes/light/snackbar.fluent.css.d.ts +1 -0
- package/components/snackbar/themes/light/snackbar.fluent.css.js +3 -0
- package/components/snackbar/themes/light/snackbar.fluent.css.js.map +1 -0
- package/components/snackbar/themes/light/snackbar.indigo.css.d.ts +1 -0
- package/components/snackbar/themes/light/snackbar.indigo.css.js +3 -0
- package/components/snackbar/themes/light/snackbar.indigo.css.js.map +1 -0
- package/components/tabs/tab-panel.d.ts +20 -0
- package/components/tabs/tab-panel.js +20 -0
- package/components/tabs/tab-panel.js.map +1 -0
- package/components/tabs/tab.d.ts +37 -0
- package/components/tabs/tab.js +71 -0
- package/components/tabs/tab.js.map +1 -0
- package/components/tabs/tabs.d.ts +79 -0
- package/components/tabs/tabs.js +316 -0
- package/components/tabs/tabs.js.map +1 -0
- package/components/tabs/themes/dark/tab.dark.base.css.d.ts +1 -0
- package/components/tabs/themes/dark/tab.dark.base.css.js +3 -0
- package/components/tabs/themes/dark/tab.dark.base.css.js.map +1 -0
- package/components/tabs/themes/dark/tab.dark.bootstrap.css.d.ts +1 -0
- package/components/tabs/themes/dark/tab.dark.bootstrap.css.js +3 -0
- package/components/tabs/themes/dark/tab.dark.bootstrap.css.js.map +1 -0
- package/components/tabs/themes/light/tab-panel.base.css.d.ts +1 -0
- package/components/tabs/themes/light/tab-panel.base.css.js +3 -0
- package/components/tabs/themes/light/tab-panel.base.css.js.map +1 -0
- package/components/tabs/themes/light/tab.base.css.d.ts +1 -0
- package/components/tabs/themes/light/tab.base.css.js +3 -0
- package/components/tabs/themes/light/tab.base.css.js.map +1 -0
- package/components/tabs/themes/light/tab.bootstrap.css.d.ts +1 -0
- package/components/tabs/themes/light/tab.bootstrap.css.js +3 -0
- package/components/tabs/themes/light/tab.bootstrap.css.js.map +1 -0
- package/components/tabs/themes/light/tab.fluent.css.d.ts +1 -0
- package/components/tabs/themes/light/tab.fluent.css.js +3 -0
- package/components/tabs/themes/light/tab.fluent.css.js.map +1 -0
- package/components/tabs/themes/light/tab.indigo.css.d.ts +1 -0
- package/components/tabs/themes/light/tab.indigo.css.js +3 -0
- package/components/tabs/themes/light/tab.indigo.css.js.map +1 -0
- package/components/tabs/themes/light/tabs.base.css.d.ts +1 -0
- package/components/tabs/themes/light/tabs.base.css.js +3 -0
- package/components/tabs/themes/light/tabs.base.css.js.map +1 -0
- package/components/tabs/themes/light/tabs.bootstrap.css.d.ts +1 -0
- package/components/tabs/themes/light/tabs.bootstrap.css.js +3 -0
- package/components/tabs/themes/light/tabs.bootstrap.css.js.map +1 -0
- package/components/tabs/themes/light/tabs.fluent.css.d.ts +1 -0
- package/components/tabs/themes/light/tabs.fluent.css.js +3 -0
- package/components/tabs/themes/light/tabs.fluent.css.js.map +1 -0
- package/components/tabs/themes/light/tabs.indigo.css.d.ts +1 -0
- package/components/tabs/themes/light/tabs.indigo.css.js +3 -0
- package/components/tabs/themes/light/tabs.indigo.css.js.map +1 -0
- package/components/tabs/utils.d.ts +14 -0
- package/components/tabs/utils.js +32 -0
- package/components/tabs/utils.js.map +1 -0
- package/components/toast/themes/toast.base.css.js +1 -1
- package/components/toast/themes/toast.base.css.js.map +1 -1
- package/components/toggle/toggle.controller.d.ts +17 -2
- package/components/toggle/toggle.controller.js +16 -11
- package/components/toggle/toggle.controller.js.map +1 -1
- package/components/toggle/toggle.directive.d.ts +1 -1
- package/components/toggle/toggle.directive.js +6 -4
- package/components/toggle/toggle.directive.js.map +1 -1
- package/components/tree/themes/dark/tree-item.bootstrap.css.d.ts +1 -0
- package/components/tree/themes/dark/tree-item.bootstrap.css.js +3 -0
- package/components/tree/themes/dark/tree-item.bootstrap.css.js.map +1 -0
- package/components/tree/themes/dark/tree-item.fluent.css.d.ts +1 -0
- package/components/tree/themes/dark/tree-item.fluent.css.js +3 -0
- package/components/tree/themes/dark/tree-item.fluent.css.js.map +1 -0
- package/components/tree/themes/dark/tree-item.indigo.css.d.ts +1 -0
- package/components/tree/themes/dark/tree-item.indigo.css.js +3 -0
- package/components/tree/themes/dark/tree-item.indigo.css.js.map +1 -0
- package/components/tree/themes/light/tree-item.base.css.d.ts +1 -0
- package/components/tree/themes/light/tree-item.base.css.js +3 -0
- package/components/tree/themes/light/tree-item.base.css.js.map +1 -0
- package/components/tree/themes/light/tree-item.bootstrap.css.d.ts +1 -0
- package/components/tree/themes/light/tree-item.bootstrap.css.js +3 -0
- package/components/tree/themes/light/tree-item.bootstrap.css.js.map +1 -0
- package/components/tree/themes/light/tree-item.fluent.css.d.ts +1 -0
- package/components/tree/themes/light/tree-item.fluent.css.js +3 -0
- package/components/tree/themes/light/tree-item.fluent.css.js.map +1 -0
- package/components/tree/themes/light/tree-item.indigo.css.d.ts +1 -0
- package/components/tree/themes/light/tree-item.indigo.css.js +3 -0
- package/components/tree/themes/light/tree-item.indigo.css.js.map +1 -0
- package/components/tree/themes/light/tree.base.css.d.ts +1 -0
- package/components/tree/themes/light/tree.base.css.js +3 -0
- package/components/tree/themes/light/tree.base.css.js.map +1 -0
- package/components/tree/tree-item.d.ts +116 -0
- package/components/tree/tree-item.js +465 -0
- package/components/tree/tree-item.js.map +1 -0
- package/components/tree/tree.common.d.ts +17 -0
- package/components/tree/tree.common.js +2 -0
- package/components/tree/tree.common.js.map +1 -0
- package/components/tree/tree.d.ts +71 -0
- package/components/tree/tree.js +169 -0
- package/components/tree/tree.js.map +1 -0
- package/components/tree/tree.navigation.d.ts +41 -0
- package/components/tree/tree.navigation.js +260 -0
- package/components/tree/tree.navigation.js.map +1 -0
- package/components/tree/tree.selection.d.ts +55 -0
- package/components/tree/tree.selection.js +265 -0
- package/components/tree/tree.selection.js.map +1 -0
- package/custom-elements.json +2754 -1522
- package/index.d.ts +12 -8
- package/index.js +9 -7
- package/index.js.map +1 -1
- package/package.json +10 -8
- package/themes/dark/bootstrap.css +1 -1
- package/themes/dark/fluent.css +1 -1
- package/themes/dark/indigo.css +1 -1
- package/themes/dark/material.css +1 -1
- package/themes/light/bootstrap.css +1 -1
- package/themes/light/fluent.css +1 -1
- package/vscode-html-custom-data.json +515 -72
- package/components/nav-drawer/styles/indigo/nav-drawer-header-item.indigo.css.js.map +0 -1
- package/components/nav-drawer/styles/indigo/nav-drawer-item.indigo.css.js +0 -3
- package/components/nav-drawer/styles/indigo/nav-drawer-item.indigo.css.js.map +0 -1
- package/components/nav-drawer/styles/indigo/nav-drawer.indigo.css.js +0 -3
- package/components/nav-drawer/styles/indigo/nav-drawer.indigo.css.js.map +0 -1
- package/components/nav-drawer/styles/nav-drawer-header-item.base.css.js.map +0 -1
- package/components/nav-drawer/styles/nav-drawer-item.base.css.js +0 -3
- package/components/nav-drawer/styles/nav-drawer-item.base.css.js.map +0 -1
- package/components/nav-drawer/styles/nav-drawer.base.css.js.map +0 -1
- package/components/snackbar/themes/snackbar.base.css.js +0 -3
- package/components/snackbar/themes/snackbar.base.css.js.map +0 -1
- package/components/snackbar/themes/snackbar.bootstrap.css.js +0 -3
- package/components/snackbar/themes/snackbar.bootstrap.css.js.map +0 -1
- package/components/snackbar/themes/snackbar.fluent.css.js +0 -3
- package/components/snackbar/themes/snackbar.fluent.css.js.map +0 -1
- package/components/snackbar/themes/snackbar.indigo.css.js +0 -3
- package/components/snackbar/themes/snackbar.indigo.css.js.map +0 -1
package/CHANGELOG.md
CHANGED
|
@@ -5,6 +5,50 @@ All notable changes to this project will be documented in this file.
|
|
|
5
5
|
The format is based on [Keep a Changelog](http://keepachangelog.com/)
|
|
6
6
|
and this project adheres to [Semantic Versioning](http://semver.org/).
|
|
7
7
|
|
|
8
|
+
## [3.3.0] - 2022-07-26
|
|
9
|
+
### Added
|
|
10
|
+
- DateTime input component [#314](https://github.com/IgniteUI/igniteui-webcomponents/pull/314)
|
|
11
|
+
- Tabs component [#341](https://github.com/IgniteUI/igniteui-webcomponents/pull/341)
|
|
12
|
+
- Typography styles in themes [#392](https://github.com/IgniteUI/igniteui-webcomponents/pull/392)
|
|
13
|
+
- Accordion component [#418](https://github.com/IgniteUI/igniteui-webcomponents/pull/418)
|
|
14
|
+
|
|
15
|
+
### Changed
|
|
16
|
+
- Rating - Added support for single selection and empty symbols [#428](https://github.com/IgniteUI/igniteui-webcomponents/pull/428)
|
|
17
|
+
- Slider - Improved slider steps rendering [#448](https://github.com/IgniteUI/igniteui-webcomponents/pull/448)
|
|
18
|
+
- Components will now auto register their dependencies when they are registered in `defineComponents`
|
|
19
|
+
|
|
20
|
+
```typescript
|
|
21
|
+
import { IgcDropdownComponent, defineComponents } from 'igniteui-webcomponents';
|
|
22
|
+
// will automatically register the dropdown item & group elements
|
|
23
|
+
// as well as their dependencies if any
|
|
24
|
+
defineComponents(IgcDropdownComponent);
|
|
25
|
+
```
|
|
26
|
+
|
|
27
|
+
Check the official [documentation](https://www.infragistics.com/products/ignite-ui-web-components/web-components/components/general-getting-started) for more information.
|
|
28
|
+
|
|
29
|
+
### Fixed
|
|
30
|
+
- Remove input helper text container when it is empty [#395](https://github.com/IgniteUI/igniteui-webcomponents/pull/395)
|
|
31
|
+
- Icon not showing in Safari [#393](https://github.com/IgniteUI/igniteui-webcomponents/pull/393)
|
|
32
|
+
- Checkbox not showing in Safari [#398](https://github.com/IgniteUI/igniteui-webcomponents/pull/398)
|
|
33
|
+
- Button stretches correctly in flex containers [#407](https://github.com/IgniteUI/igniteui-webcomponents/pull/407)
|
|
34
|
+
- Various theming issues [#402](https://github.com/IgniteUI/igniteui-webcomponents/pull/402) [#409](https://github.com/IgniteUI/igniteui-webcomponents/pull/409) [#424](https://github.com/IgniteUI/igniteui-webcomponents/pull/424)
|
|
35
|
+
- Dropdown - bug fixes and improvements [#434](https://github.com/IgniteUI/igniteui-webcomponents/pull/434)
|
|
36
|
+
|
|
37
|
+
## [3.2.0] - 2022-05-30
|
|
38
|
+
### Added
|
|
39
|
+
- Mask input [#173](https://github.com/IgniteUI/igniteui-webcomponents/issues/173)
|
|
40
|
+
- Expansion Panel [#177](https://github.com/IgniteUI/igniteui-webcomponents/issues/177)
|
|
41
|
+
- Tree [#188](https://github.com/IgniteUI/igniteui-webcomponents/issues/188)
|
|
42
|
+
- Rating - Added `selected` CSS part and exposed CSS variable to control symbol sizes [#340](https://github.com/IgniteUI/igniteui-webcomponents/pull/340) [#371](https://github.com/IgniteUI/igniteui-webcomponents/pull/371)
|
|
43
|
+
- Icon Button - Allow slotted content [#355](https://github.com/IgniteUI/igniteui-webcomponents/pull/355)
|
|
44
|
+
|
|
45
|
+
### Fixed
|
|
46
|
+
- Navigation drawer - Various styles fixes [#356](https://github.com/IgniteUI/igniteui-webcomponents/pull/356) [#349](https://github.com/IgniteUI/igniteui-webcomponents/pull/349) [#363](https://github.com/IgniteUI/igniteui-webcomponents/pull/363) [#364](https://github.com/IgniteUI/igniteui-webcomponents/pull/364)
|
|
47
|
+
- Buttons - Vertical align [#357](https://github.com/IgniteUI/igniteui-webcomponents/pull/357) and focus management [#380](https://github.com/IgniteUI/igniteui-webcomponents/pull/380)
|
|
48
|
+
- Input - Overflow for suffix/prefix [#359](https://github.com/IgniteUI/igniteui-webcomponents/pull/359)
|
|
49
|
+
- Switch - Collapse with small sizes [#362](https://github.com/IgniteUI/igniteui-webcomponents/pull/362)
|
|
50
|
+
- List - Overflow behaviour [#391](https://github.com/IgniteUI/igniteui-webcomponents/pull/391)
|
|
51
|
+
|
|
8
52
|
## [3.1.0] - 2022-04-15
|
|
9
53
|
### Added
|
|
10
54
|
- Chip: Added `prefix` and `suffix` slots [#334](https://github.com/IgniteUI/igniteui-webcomponents/pull/334)
|
|
@@ -89,6 +133,8 @@ Initial release of Ignite UI Web Components
|
|
|
89
133
|
- Ripple component
|
|
90
134
|
- Switch component
|
|
91
135
|
|
|
136
|
+
[3.3.0]: https://github.com/IgniteUI/igniteui-webcomponents/compare/3.2.0...3.3.0
|
|
137
|
+
[3.2.0]: https://github.com/IgniteUI/igniteui-webcomponents/compare/3.1.0...3.2.0
|
|
92
138
|
[3.1.0]: https://github.com/IgniteUI/igniteui-webcomponents/compare/3.0.0...3.1.0
|
|
93
139
|
[3.0.0]: https://github.com/IgniteUI/igniteui-webcomponents/compare/2.2.0...3.0.0
|
|
94
140
|
[2.2.0]: https://github.com/IgniteUI/igniteui-webcomponents/compare/2.1.1...2.2.0
|
package/README.md
CHANGED
|
@@ -1,4 +1,11 @@
|
|
|
1
|
-
|
|
1
|
+

|
|
2
|
+
|
|
3
|
+
|
|
4
|
+
<h1 align="center">
|
|
5
|
+
Ignite UI for Angular - from Infragistics
|
|
6
|
+
</h1>
|
|
7
|
+
|
|
8
|
+
|
|
2
9
|
|
|
3
10
|
[](https://github.com/IgniteUI/igniteui-webcomponents/actions/workflows/node.js.yml)
|
|
4
11
|
[](https://coveralls.io/github/IgniteUI/igniteui-webcomponents)
|
|
@@ -7,8 +14,55 @@
|
|
|
7
14
|
|
|
8
15
|
[Ignite UI for Web Components](https://www.infragistics.com/products/ignite-ui-web-components) is a complete library of UI components, giving you the ability to build modern web applications using encapsulation and the concept of reusable components in a dependency-free approach. See the [Storybook Here](https://igniteui.github.io/igniteui-webcomponents)!
|
|
9
16
|
|
|
17
|
+
## Browser Support
|
|
18
|
+
|
|
19
|
+
 |  |  |  | 
|
|
20
|
+
--- | --- | --- | --- | --- |
|
|
21
|
+
Latest ✔ | Latest ✔ | Latest ✔ | Latest ✔ | Latest ✔ |
|
|
22
|
+
|
|
23
|
+
## Overview
|
|
24
|
+
|
|
25
|
+
|Components|Status|Documentation|Released Version|
|
|
26
|
+
|:--|:--:|:--:|:--:|
|
|
27
|
+
|Avatar|:white_check_mark:|[Docs](https://www.infragistics.com/products/ignite-ui-web-components/web-components/components/layouts/avatar)|[1.0.0](https://github.com/IgniteUI/igniteui-webcomponents/releases/tag/1.0.0)|
|
|
28
|
+
|Badge|:white_check_mark:|[Docs](https://www.infragistics.com/products/ignite-ui-web-components/web-components/components/inputs/badge)|[1.0.0](https://github.com/IgniteUI/igniteui-webcomponents/releases/tag/1.0.0)|
|
|
29
|
+
|Button|:white_check_mark:|[Docs](https://www.infragistics.com/products/ignite-ui-web-components/web-components/components/inputs/button)|[1.0.0](https://github.com/IgniteUI/igniteui-webcomponents/releases/tag/1.0.0)|
|
|
30
|
+
|Calendar|:white_check_mark:|[Docs](https://www.infragistics.com/products/ignite-ui-web-components/web-components/components/scheduling/calendar)|[1.0.0](https://github.com/IgniteUI/igniteui-webcomponents/releases/tag/1.0.0)|
|
|
31
|
+
|Card|:white_check_mark:|[Docs](https://www.infragistics.com/products/ignite-ui-web-components/web-components/components/layouts/card)|[1.0.0](https://github.com/IgniteUI/igniteui-webcomponents/releases/tag/1.0.0)|
|
|
32
|
+
|Checkbox|:white_check_mark:|[Docs](https://www.infragistics.com/products/ignite-ui-web-components/web-components/components/inputs/checkbox)|[1.0.0](https://github.com/IgniteUI/igniteui-webcomponents/releases/tag/1.0.0)|
|
|
33
|
+
|Form|:white_check_mark:|[Docs](https://www.infragistics.com/products/ignite-ui-web-components/web-components/components/inputs/form)|[1.0.0](https://github.com/IgniteUI/igniteui-webcomponents/releases/tag/1.0.0)|
|
|
34
|
+
|Icon|:white_check_mark:|[Docs](https://www.infragistics.com/products/ignite-ui-web-components/web-components/components/layouts/icon)|[1.0.0](https://github.com/IgniteUI/igniteui-webcomponents/releases/tag/1.0.0)|
|
|
35
|
+
|Icon Button|:white_check_mark:|[Docs](https://www.infragistics.com/products/ignite-ui-web-components/web-components/components/inputs/icon-button)|[1.0.0](https://github.com/IgniteUI/igniteui-webcomponents/releases/tag/1.0.0)|
|
|
36
|
+
|Input|:white_check_mark:|[Docs](https://www.infragistics.com/products/ignite-ui-web-components/web-components/components/inputs/input)|[1.0.0](https://github.com/IgniteUI/igniteui-webcomponents/releases/tag/1.0.0)|
|
|
37
|
+
|List|:white_check_mark:|[Docs](https://www.infragistics.com/products/ignite-ui-web-components/web-components/components/grids/list)|[1.0.0](https://github.com/IgniteUI/igniteui-webcomponents/releases/tag/1.0.0)|
|
|
38
|
+
|Navigation Bar (Navbar)|:white_check_mark:|[Docs](https://www.infragistics.com/products/ignite-ui-web-components/web-components/components/menus/navbar)|[1.0.0](https://github.com/IgniteUI/igniteui-webcomponents/releases/tag/1.0.0)|
|
|
39
|
+
|Navigation Drawer|:white_check_mark:|[Docs](https://www.infragistics.com/products/ignite-ui-web-components/web-components/components/menus/navigation-drawer)|[1.0.0](https://github.com/IgniteUI/igniteui-webcomponents/releases/tag/1.0.0)|
|
|
40
|
+
|Radio|:white_check_mark:|[Docs](https://www.infragistics.com/products/ignite-ui-web-components/web-components/components/inputs/radio)|[1.0.0](https://github.com/IgniteUI/igniteui-webcomponents/releases/tag/1.0.0)|
|
|
41
|
+
|Radio Group|:white_check_mark:|[Docs](https://www.infragistics.com/products/ignite-ui-web-components/web-components/components/inputs/radio)|[1.0.0](https://github.com/IgniteUI/igniteui-webcomponents/releases/tag/1.0.0)|
|
|
42
|
+
|Ripple|:white_check_mark:|[Docs](https://www.infragistics.com/products/ignite-ui-web-components/web-components/components/inputs/ripple)|[1.0.0](https://github.com/IgniteUI/igniteui-webcomponents/releases/tag/1.0.0)|
|
|
43
|
+
|Switch|:white_check_mark:|[Docs](https://www.infragistics.com/products/ignite-ui-web-components/web-components/components/inputs/switch)|[1.0.0](https://github.com/IgniteUI/igniteui-webcomponents/releases/tag/1.0.0)|
|
|
44
|
+
|Slider|:white_check_mark:|[Docs]()|[2.0.0](https://github.com/IgniteUI/igniteui-webcomponents/releases/tag/2.0.0)|
|
|
45
|
+
|Range Slider|:white_check_mark:|[Docs]()|[2.0.0](https://github.com/IgniteUI/igniteui-webcomponents/releases/tag/2.0.0)|
|
|
46
|
+
|Linear Progress|:white_check_mark:|[Docs](https://www.infragistics.com/products/ignite-ui-web-components/web-components/components/inputs/linear-progress)|[2.1.0](https://github.com/IgniteUI/igniteui-webcomponents/releases/tag/2.1.0)|
|
|
47
|
+
|Circular Progress|:white_check_mark:|[Docs](https://www.infragistics.com/products/ignite-ui-web-components/web-components/components/inputs/circular-progress)|[2.1.0](https://github.com/IgniteUI/igniteui-webcomponents/releases/tag/2.1.0)|
|
|
48
|
+
|Chip|:white_check_mark:|[Docs](https://www.infragistics.com/products/ignite-ui-web-components/web-components/components/inputs/chip)|[2.1.0](https://github.com/IgniteUI/igniteui-webcomponents/releases/tag/2.1.0)|
|
|
49
|
+
|Snackbar|:white_check_mark:|[Docs](https://www.infragistics.com/products/ignite-ui-web-components/web-components/components/notifications/snackbar)|[2.1.0](https://github.com/IgniteUI/igniteui-webcomponents/releases/tag/2.1.0)|
|
|
50
|
+
|Toast|:white_check_mark:|[Docs](https://www.infragistics.com/products/ignite-ui-web-components/web-components/components/notifications/toast)|[2.1.0](https://github.com/IgniteUI/igniteui-webcomponents/releases/tag/2.1.0)|
|
|
51
|
+
|Drop Down|:white_check_mark:|[Docs](https://www.infragistics.com/products/ignite-ui-web-components/web-components/components/notifications/toast)|[2.2.0](https://github.com/IgniteUI/igniteui-webcomponents/releases/tag/2.2.0)|
|
|
52
|
+
|Mask Input|:white_check_mark:|[Docs](https://www.infragistics.com/products/ignite-ui-web-components/web-components/components/inputs/input)|[3.2.0](https://github.com/IgniteUI/igniteui-webcomponents/releases/tag/3.2.0)|
|
|
53
|
+
|Expansion Panel|:white_check_mark:|[Docs](https://www.infragistics.com/products/ignite-ui-web-components/web-components/components/layouts/expansion-panel)|[3.2.0](https://github.com/IgniteUI/igniteui-webcomponents/releases/tag/3.2.0)|
|
|
54
|
+
|Tree|:white_check_mark:|[Docs](https://www.infragistics.com/products/ignite-ui-web-components/web-components/components/grids/tree)|[3.2.0](https://github.com/IgniteUI/igniteui-webcomponents/releases/tag/3.2.0)|
|
|
55
|
+
|
|
10
56
|
## Usage
|
|
11
57
|
|
|
58
|
+
### The Lightweight Web Components Data Grid and Data Table
|
|
59
|
+
|
|
60
|
+
The Ignite UI for Web Components Data Grid and Table are both lightweight and developed to handle high data volumes. The Web Components Grid offers powerful data visualization capabilities and superior performance on any device. With interactive features that users expect. Fast rendering. Unbeatable interactions. And the best possible user experience that you wouldn’t otherwise be able to achieve with so little code on your own.
|
|
61
|
+
|
|
62
|
+
### Dock Manager - EXCLUSIVE FEATURE
|
|
63
|
+
|
|
64
|
+
Provide a complete windowing experience, splitting complex layouts into smaller, easier-to-manage panes.
|
|
65
|
+
|
|
12
66
|
In order to use the Ignite UI Web Components in your application you should install the `igniteui-webcomponents` package:
|
|
13
67
|
|
|
14
68
|
```
|
|
@@ -56,6 +110,7 @@ Add the following line to your user or workspace settings:
|
|
|
56
110
|
}
|
|
57
111
|
```
|
|
58
112
|
|
|
113
|
+
|
|
59
114
|
## Setup
|
|
60
115
|
|
|
61
116
|
In order to run the repository locally from the root folder run:
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
import { LitElement } from 'lit';
|
|
2
|
+
import IgcExpansionPanelComponent from '../expansion-panel/expansion-panel.js';
|
|
3
|
+
/**
|
|
4
|
+
* The Accordion is a container-based component that can house multiple expansion panels
|
|
5
|
+
* and offers keyboard navigation.
|
|
6
|
+
*
|
|
7
|
+
* @element igc-accordion
|
|
8
|
+
*
|
|
9
|
+
* @slot - Renders the expansion panels inside default slot.
|
|
10
|
+
*/
|
|
11
|
+
export default class IgcAccordionComponent extends LitElement {
|
|
12
|
+
static readonly tagName = "igc-accordion";
|
|
13
|
+
static styles: import("lit").CSSResult;
|
|
14
|
+
private get _enabledPanels();
|
|
15
|
+
singleExpand: boolean;
|
|
16
|
+
/** Returns all of the accordions's direct igc-expansion-panel children. */
|
|
17
|
+
panels: Array<IgcExpansionPanelComponent>;
|
|
18
|
+
constructor();
|
|
19
|
+
private handlePanelOpening;
|
|
20
|
+
private handleKeydown;
|
|
21
|
+
private handleUpDownArrow;
|
|
22
|
+
private getNextPanel;
|
|
23
|
+
private getPanelHeader;
|
|
24
|
+
private closePanel;
|
|
25
|
+
private openPanel;
|
|
26
|
+
/** Hides all of the child expansion panels' contents. */
|
|
27
|
+
hideAll(): void;
|
|
28
|
+
/** Shows all of the child expansion panels' contents. */
|
|
29
|
+
showAll(): void;
|
|
30
|
+
protected render(): import("lit-html").TemplateResult<1>;
|
|
31
|
+
}
|
|
32
|
+
declare global {
|
|
33
|
+
interface HTMLElementTagNameMap {
|
|
34
|
+
'igc-accordion': IgcAccordionComponent;
|
|
35
|
+
}
|
|
36
|
+
}
|
|
@@ -0,0 +1,127 @@
|
|
|
1
|
+
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
|
|
2
|
+
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
3
|
+
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
4
|
+
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
5
|
+
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
6
|
+
};
|
|
7
|
+
import { LitElement, html } from 'lit';
|
|
8
|
+
import { property, queryAssignedElements } from 'lit/decorators.js';
|
|
9
|
+
import { styles } from './themes/accordion.base.css.js';
|
|
10
|
+
import { defineComponents } from '../common/definitions/defineComponents.js';
|
|
11
|
+
import IgcExpansionPanelComponent from '../expansion-panel/expansion-panel.js';
|
|
12
|
+
defineComponents(IgcExpansionPanelComponent);
|
|
13
|
+
export default class IgcAccordionComponent extends LitElement {
|
|
14
|
+
constructor() {
|
|
15
|
+
super();
|
|
16
|
+
this.singleExpand = false;
|
|
17
|
+
this.handleKeydown = (event) => {
|
|
18
|
+
if (event.target.tagName.toLowerCase() !==
|
|
19
|
+
'igc-expansion-panel' ||
|
|
20
|
+
!this._enabledPanels.includes(event.target)) {
|
|
21
|
+
return;
|
|
22
|
+
}
|
|
23
|
+
switch (event.key.toLowerCase()) {
|
|
24
|
+
case 'home':
|
|
25
|
+
this.getPanelHeader(this._enabledPanels.at(0)).focus();
|
|
26
|
+
break;
|
|
27
|
+
case 'end':
|
|
28
|
+
this.getPanelHeader(this._enabledPanels.at(-1)).focus();
|
|
29
|
+
break;
|
|
30
|
+
case 'arrowup':
|
|
31
|
+
case 'up':
|
|
32
|
+
this.handleUpDownArrow(true, event);
|
|
33
|
+
break;
|
|
34
|
+
case 'arrowdown':
|
|
35
|
+
case 'down':
|
|
36
|
+
this.handleUpDownArrow(false, event);
|
|
37
|
+
break;
|
|
38
|
+
}
|
|
39
|
+
};
|
|
40
|
+
this.addEventListener('keydown', this.handleKeydown, { capture: true });
|
|
41
|
+
this.addEventListener('igcOpening', this.handlePanelOpening);
|
|
42
|
+
}
|
|
43
|
+
get _enabledPanels() {
|
|
44
|
+
return this.panels.filter((p) => !p.disabled);
|
|
45
|
+
}
|
|
46
|
+
handlePanelOpening(event) {
|
|
47
|
+
const panel = event.target;
|
|
48
|
+
if (!this.singleExpand || !this.panels.includes(panel)) {
|
|
49
|
+
return;
|
|
50
|
+
}
|
|
51
|
+
this._enabledPanels.forEach((p) => {
|
|
52
|
+
if (p.open && p !== panel) {
|
|
53
|
+
this.closePanel(p);
|
|
54
|
+
}
|
|
55
|
+
});
|
|
56
|
+
}
|
|
57
|
+
handleUpDownArrow(isUp, event) {
|
|
58
|
+
const focusedPanel = event.target;
|
|
59
|
+
if (!event.altKey) {
|
|
60
|
+
const next = this.getNextPanel(focusedPanel, isUp ? -1 : 1);
|
|
61
|
+
if (next === focusedPanel) {
|
|
62
|
+
return;
|
|
63
|
+
}
|
|
64
|
+
this.getPanelHeader(next).focus();
|
|
65
|
+
}
|
|
66
|
+
if (event.shiftKey && event.altKey) {
|
|
67
|
+
if (this.singleExpand && !isUp) {
|
|
68
|
+
this._enabledPanels.forEach((p) => p !== focusedPanel ? this.closePanel(p) : this.openPanel(p));
|
|
69
|
+
return;
|
|
70
|
+
}
|
|
71
|
+
if (isUp) {
|
|
72
|
+
this._enabledPanels.forEach((p) => this.closePanel(p));
|
|
73
|
+
}
|
|
74
|
+
else {
|
|
75
|
+
this._enabledPanels.forEach((p) => this.openPanel(p));
|
|
76
|
+
}
|
|
77
|
+
}
|
|
78
|
+
}
|
|
79
|
+
getNextPanel(panel, dir = 1) {
|
|
80
|
+
const panelIndex = this._enabledPanels.indexOf(panel);
|
|
81
|
+
return this._enabledPanels[panelIndex + dir] || panel;
|
|
82
|
+
}
|
|
83
|
+
getPanelHeader(panel) {
|
|
84
|
+
var _a;
|
|
85
|
+
return (_a = panel.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('div[part="header"]');
|
|
86
|
+
}
|
|
87
|
+
async closePanel(panel) {
|
|
88
|
+
if (!panel.open) {
|
|
89
|
+
return;
|
|
90
|
+
}
|
|
91
|
+
if (!panel.emitEvent('igcClosing', { cancelable: true, detail: panel })) {
|
|
92
|
+
return;
|
|
93
|
+
}
|
|
94
|
+
panel.open = false;
|
|
95
|
+
await panel.updateComplete;
|
|
96
|
+
panel.emitEvent('igcClosed', { detail: panel });
|
|
97
|
+
}
|
|
98
|
+
async openPanel(panel) {
|
|
99
|
+
if (panel.open) {
|
|
100
|
+
return;
|
|
101
|
+
}
|
|
102
|
+
if (!panel.emitEvent('igcOpening', { cancelable: true, detail: panel })) {
|
|
103
|
+
return;
|
|
104
|
+
}
|
|
105
|
+
panel.open = true;
|
|
106
|
+
await panel.updateComplete;
|
|
107
|
+
panel.emitEvent('igcOpened', { detail: panel });
|
|
108
|
+
}
|
|
109
|
+
hideAll() {
|
|
110
|
+
this.panels.forEach((p) => (p.open = false));
|
|
111
|
+
}
|
|
112
|
+
showAll() {
|
|
113
|
+
this.panels.forEach((p) => (p.open = true));
|
|
114
|
+
}
|
|
115
|
+
render() {
|
|
116
|
+
return html `<slot></slot>`;
|
|
117
|
+
}
|
|
118
|
+
}
|
|
119
|
+
IgcAccordionComponent.tagName = 'igc-accordion';
|
|
120
|
+
IgcAccordionComponent.styles = styles;
|
|
121
|
+
__decorate([
|
|
122
|
+
property({ attribute: 'single-expand', reflect: true, type: Boolean })
|
|
123
|
+
], IgcAccordionComponent.prototype, "singleExpand", void 0);
|
|
124
|
+
__decorate([
|
|
125
|
+
queryAssignedElements({ selector: 'igc-expansion-panel' })
|
|
126
|
+
], IgcAccordionComponent.prototype, "panels", void 0);
|
|
127
|
+
//# sourceMappingURL=accordion.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"accordion.js","sourceRoot":"","sources":["../../../src/components/accordion/accordion.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, html } from 'lit';\nimport { property, queryAssignedElements } from 'lit/decorators.js';\nimport { styles } from './themes/accordion.base.css.js';\n\nimport { defineComponents } from '../common/definitions/defineComponents.js';\nimport IgcExpansionPanelComponent from '../expansion-panel/expansion-panel.js';\n\ndefineComponents(IgcExpansionPanelComponent);\n\n/**\n * The Accordion is a container-based component that can house multiple expansion panels\n * and offers keyboard navigation.\n *\n * @element igc-accordion\n *\n * @slot - Renders the expansion panels inside default slot.\n */\nexport default class IgcAccordionComponent extends LitElement {\n public static readonly tagName = 'igc-accordion';\n public static override styles = styles;\n\n private get _enabledPanels(): Array<IgcExpansionPanelComponent> {\n return this.panels.filter((p) => !p.disabled);\n }\n\n @property({ attribute: 'single-expand', reflect: true, type: Boolean })\n public singleExpand = false;\n\n /** Returns all of the accordions's direct igc-expansion-panel children. */\n @queryAssignedElements({ selector: 'igc-expansion-panel' })\n public panels!: Array<IgcExpansionPanelComponent>;\n\n constructor() {\n super();\n this.addEventListener('keydown', this.handleKeydown, { capture: true });\n this.addEventListener('igcOpening', this.handlePanelOpening);\n }\n\n private handlePanelOpening(event: Event) {\n const panel = event.target as IgcExpansionPanelComponent;\n if (!this.singleExpand || !this.panels.includes(panel)) {\n return;\n }\n this._enabledPanels.forEach((p) => {\n if (p.open && p !== panel) {\n this.closePanel(p);\n }\n });\n }\n\n private handleKeydown = (event: KeyboardEvent) => {\n if (\n (event.target as HTMLElement).tagName.toLowerCase() !==\n 'igc-expansion-panel' ||\n !this._enabledPanels.includes(event.target as IgcExpansionPanelComponent)\n ) {\n return;\n }\n switch (event.key.toLowerCase()) {\n case 'home':\n this.getPanelHeader(this._enabledPanels.at(0)!).focus();\n break;\n case 'end':\n this.getPanelHeader(this._enabledPanels.at(-1)!).focus();\n break;\n case 'arrowup':\n case 'up':\n this.handleUpDownArrow(true, event);\n break;\n case 'arrowdown':\n case 'down':\n this.handleUpDownArrow(false, event);\n break;\n }\n };\n\n private handleUpDownArrow(isUp: boolean, event: KeyboardEvent) {\n const focusedPanel = event.target as IgcExpansionPanelComponent;\n if (!event.altKey) {\n const next = this.getNextPanel(focusedPanel, isUp ? -1 : 1);\n if (next === focusedPanel) {\n return;\n }\n this.getPanelHeader(next).focus();\n }\n if (event.shiftKey && event.altKey) {\n if (this.singleExpand && !isUp) {\n this._enabledPanels.forEach((p) =>\n p !== focusedPanel ? this.closePanel(p) : this.openPanel(p)\n );\n return;\n }\n\n if (isUp) {\n this._enabledPanels.forEach((p) => this.closePanel(p));\n } else {\n this._enabledPanels.forEach((p) => this.openPanel(p));\n }\n }\n }\n\n private getNextPanel(panel: IgcExpansionPanelComponent, dir: 1 | -1 = 1) {\n const panelIndex = this._enabledPanels.indexOf(panel);\n return this._enabledPanels[panelIndex + dir] || panel;\n }\n\n private getPanelHeader(panel: IgcExpansionPanelComponent) {\n return panel.shadowRoot?.querySelector('div[part=\"header\"]') as HTMLElement;\n }\n\n private async closePanel(panel: IgcExpansionPanelComponent) {\n if (!panel.open) {\n return;\n }\n if (!panel.emitEvent('igcClosing', { cancelable: true, detail: panel })) {\n return;\n }\n panel.open = false;\n await panel.updateComplete;\n\n panel.emitEvent('igcClosed', { detail: panel });\n }\n\n private async openPanel(panel: IgcExpansionPanelComponent) {\n if (panel.open) {\n return;\n }\n if (!panel.emitEvent('igcOpening', { cancelable: true, detail: panel })) {\n return;\n }\n\n panel.open = true;\n await panel.updateComplete;\n\n panel.emitEvent('igcOpened', { detail: panel });\n }\n\n /** Hides all of the child expansion panels' contents. */\n public hideAll() {\n this.panels.forEach((p) => (p.open = false));\n }\n\n /** Shows all of the child expansion panels' contents. */\n public showAll() {\n this.panels.forEach((p) => (p.open = true));\n }\n\n protected override render() {\n return html`<slot></slot>`;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-accordion': IgcAccordionComponent;\n }\n}\n"]}
|
|
File without changes
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
import { css } from 'lit';
|
|
2
|
+
export const styles = css `:host ::slotted(igc-expansion-panel){--lines-clamped: 4}:host ::slotted(igc-expansion-panel[open]){margin:.5rem 0}:host ::slotted(igc-expansion-panel:first-of-type){margin-top:0}:host ::slotted(igc-expansion-panel:last-of-type){margin-bottom:0}`;
|
|
3
|
+
//# sourceMappingURL=accordion.base.css.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"accordion.base.css.js","sourceRoot":"","sources":["../../../../src/components/accordion/themes/accordion.base.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,sPAAsP,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host ::slotted(igc-expansion-panel){--lines-clamped: 4}:host ::slotted(igc-expansion-panel[open]){margin:.5rem 0}:host ::slotted(igc-expansion-panel:first-of-type){margin-top:0}:host ::slotted(igc-expansion-panel:last-of-type){margin-bottom:0}`;\n"]}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import { css } from 'lit';
|
|
2
|
-
export const styles = css `:host{--size: 1.125rem;--igc-subtitle-1-font-size: 0.75rem;font-weight:700}:host([
|
|
2
|
+
export const styles = css `:host{--size: 1.125rem;--igc-subtitle-1-font-size: 0.75rem;font-weight:700}:host([outlined]) span{-webkit-box-shadow:inset 0 0 0 .0625rem hsla(var(--igc-gray-50), var(--igc-gray-a));box-shadow:inset 0 0 0 .0625rem hsla(var(--igc-gray-50), var(--igc-gray-a))}`;
|
|
3
3
|
//# sourceMappingURL=badge.bootstrap.css.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"badge.bootstrap.css.js","sourceRoot":"","sources":["../../../../../src/components/badge/themes/light/badge.bootstrap.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,
|
|
1
|
+
{"version":3,"file":"badge.bootstrap.css.js","sourceRoot":"","sources":["../../../../../src/components/badge/themes/light/badge.bootstrap.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,oQAAoQ,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{--size: 1.125rem;--igc-subtitle-1-font-size: 0.75rem;font-weight:700}:host([outlined]) span{-webkit-box-shadow:inset 0 0 0 .0625rem hsla(var(--igc-gray-50), var(--igc-gray-a));box-shadow:inset 0 0 0 .0625rem hsla(var(--igc-gray-50), var(--igc-gray-a))}`;\n"]}
|
|
@@ -4,8 +4,13 @@ export interface IgcButtonEventMap {
|
|
|
4
4
|
igcFocus: CustomEvent<void>;
|
|
5
5
|
igcBlur: CustomEvent<void>;
|
|
6
6
|
}
|
|
7
|
-
declare const IgcButtonBaseComponent_base: Constructor<import("../common/mixins/sizable.js").SizableInterface> &
|
|
7
|
+
declare const IgcButtonBaseComponent_base: Constructor<import("../common/mixins/sizable.js").SizableInterface> & import("../common/mixins/constructor.js").AbstractConstructor<import("../common//mixins/event-emitter.js").EventEmitterInterface<IgcButtonEventMap>> & Constructor<LitElement>;
|
|
8
8
|
export declare abstract class IgcButtonBaseComponent extends IgcButtonBaseComponent_base {
|
|
9
|
+
protected static shadowRootOptions: {
|
|
10
|
+
delegatesFocus: boolean;
|
|
11
|
+
mode: ShadowRootMode;
|
|
12
|
+
slotAssignment?: SlotAssignmentMode | undefined;
|
|
13
|
+
};
|
|
9
14
|
private nativeElement;
|
|
10
15
|
private _ariaLabel;
|
|
11
16
|
/**
|
|
@@ -81,6 +81,10 @@ export class IgcButtonBaseComponent extends SizableMixin(EventEmitterMixin(LitEl
|
|
|
81
81
|
return link ? this.renderLinkButton() : this.renderButton();
|
|
82
82
|
}
|
|
83
83
|
}
|
|
84
|
+
IgcButtonBaseComponent.shadowRootOptions = {
|
|
85
|
+
...LitElement.shadowRootOptions,
|
|
86
|
+
delegatesFocus: true,
|
|
87
|
+
};
|
|
84
88
|
__decorate([
|
|
85
89
|
query('[part="base"]', true)
|
|
86
90
|
], IgcButtonBaseComponent.prototype, "nativeElement", void 0);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button-base.js","sourceRoot":"","sources":["../../../src/components/button/button-base.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAkB,MAAM,KAAK,CAAC;AACvD,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACzD,OAAO,EAAE,iBAAiB,EAAE,MAAM,oCAAoC,CAAC;AACvE,OAAO,EAAE,aAAa,EAAE,MAAM,uCAAuC,CAAC;AAEtE,OAAO,EAAE,YAAY,EAAE,MAAM,6BAA6B,CAAC;AAO3D,MAAM,OAAgB,sBAAuB,SAAQ,YAAY,CAC/D,iBAAiB,CAA6C,UAAU,CAAC,CAC1E;IAFD;;
|
|
1
|
+
{"version":3,"file":"button-base.js","sourceRoot":"","sources":["../../../src/components/button/button-base.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement, TemplateResult } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { EventEmitterMixin } from '../common//mixins/event-emitter.js';\nimport { alternateName } from '../common/decorators/alternateName.js';\nimport { Constructor } from '../common/mixins/constructor.js';\nimport { SizableMixin } from '../common/mixins/sizable.js';\n\nexport interface IgcButtonEventMap {\n igcFocus: CustomEvent<void>;\n igcBlur: CustomEvent<void>;\n}\n\nexport abstract class IgcButtonBaseComponent extends SizableMixin(\n EventEmitterMixin<IgcButtonEventMap, Constructor<LitElement>>(LitElement)\n) {\n protected static shadowRootOptions = {\n ...LitElement.shadowRootOptions,\n delegatesFocus: true,\n };\n\n @query('[part=\"base\"]', true)\n private nativeElement!: HTMLElement;\n\n private _ariaLabel!: string;\n\n /**\n * The type of the button. Defaults to undefined.\n */\n @alternateName('displayType')\n @property()\n public type!: 'button' | 'reset' | 'submit';\n\n /** The URL the button points to. */\n @property()\n public href!: string;\n\n /** Prompts to save the linked URL instead of navigating to it. */\n @property()\n public download!: string;\n\n /** Where to display the linked URL, as the name for a browsing context. */\n @property()\n public target!: '_blank' | '_parent' | '_self' | '_top' | undefined;\n\n /**\n * The relationship of the linked URL.\n * See https://developer.mozilla.org/en-US/docs/Web/HTML/Link_types\n */\n @property()\n public rel!: string;\n\n /**\n * Determines whether the button is disabled.\n */\n @property({ type: Boolean, reflect: true })\n public disabled = false;\n\n public override set ariaLabel(value: string) {\n const oldVal = this._ariaLabel;\n this._ariaLabel = value;\n\n if (this.hasAttribute('aria-label')) {\n this.removeAttribute('aria-label');\n }\n this.requestUpdate('ariaLabel', oldVal);\n }\n\n @property({ attribute: 'aria-label' })\n public override get ariaLabel() {\n return this._ariaLabel;\n }\n\n /** Sets focus in the button. */\n @alternateName('focusComponent')\n public override focus(options?: FocusOptions) {\n this.nativeElement.focus(options);\n }\n\n /** Removes focus from the button. */\n @alternateName('blurComponent')\n public override blur() {\n this.nativeElement.blur();\n }\n\n protected handleFocus() {\n this.emitEvent('igcFocus');\n }\n\n protected handleBlur() {\n this.emitEvent('igcBlur');\n }\n\n protected get classes() {\n return {};\n }\n\n private renderButton() {\n return html`\n <button\n part=\"base\"\n aria-label=${ifDefined(this.ariaLabel)}\n .disabled=${this.disabled}\n class=${classMap(this.classes)}\n type=${ifDefined(this.type)}\n @focus=${this.handleFocus}\n @blur=${this.handleBlur}\n >\n ${this.renderContent()}\n </button>\n `;\n }\n\n private renderLinkButton() {\n return html`\n <a\n part=\"base\"\n role=\"button\"\n href=${ifDefined(this.href)}\n target=${ifDefined(this.target)}\n download=${ifDefined(this.download)}\n rel=${ifDefined(this.rel)}\n aria-disabled=${this.disabled ? 'true' : 'false'}\n aria-label=${ifDefined(this.ariaLabel)}\n class=${classMap(this.classes)}\n @focus=${!this.disabled && this.handleFocus}\n @blur=${!this.disabled && this.handleBlur}\n >\n ${this.renderContent()}\n </a>\n `;\n }\n\n protected abstract renderContent(): TemplateResult;\n\n protected override render() {\n const link = this.href !== undefined;\n return link ? this.renderLinkButton() : this.renderButton();\n }\n}\n"]}
|
|
@@ -10,7 +10,6 @@ import { ifDefined } from 'lit/directives/if-defined.js';
|
|
|
10
10
|
import { themes } from '../../theming/theming-decorator.js';
|
|
11
11
|
import { alternateName } from '../common/decorators/alternateName.js';
|
|
12
12
|
import { blazorInclude } from '../common/decorators/blazorInclude.js';
|
|
13
|
-
import '../icon/icon.js';
|
|
14
13
|
import { registerIcon as registerIcon_impl, registerIconFromText as registerIconFromText_impl, } from '../icon/icon.registry.js';
|
|
15
14
|
import { IgcButtonBaseComponent } from './button-base.js';
|
|
16
15
|
import { styles } from './themes/icon-button/light/icon-button.base.css.js';
|
|
@@ -18,6 +17,9 @@ import { styles as bootstrap } from './themes/icon-button/light/icon-button.boot
|
|
|
18
17
|
import { styles as fluent } from './themes/icon-button/light/icon-button.fluent.css.js';
|
|
19
18
|
import { styles as indigo } from './themes/icon-button/light/icon-button.indigo.css.js';
|
|
20
19
|
import { styles as material } from './themes/icon-button/light/icon-button.material.css.js';
|
|
20
|
+
import { defineComponents } from '../common/definitions/defineComponents.js';
|
|
21
|
+
import IgcIconComponent from '../icon/icon.js';
|
|
22
|
+
defineComponents(IgcIconComponent);
|
|
21
23
|
let IgcIconButtonComponent = class IgcIconButtonComponent extends IgcButtonBaseComponent {
|
|
22
24
|
constructor() {
|
|
23
25
|
super(...arguments);
|
|
@@ -26,14 +28,16 @@ let IgcIconButtonComponent = class IgcIconButtonComponent extends IgcButtonBaseC
|
|
|
26
28
|
}
|
|
27
29
|
renderContent() {
|
|
28
30
|
return html `
|
|
29
|
-
<
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
31
|
+
<slot>
|
|
32
|
+
<igc-icon
|
|
33
|
+
part="icon"
|
|
34
|
+
name=${ifDefined(this.name)}
|
|
35
|
+
collection=${ifDefined(this.collection)}
|
|
36
|
+
.mirrored=${this.mirrored}
|
|
37
|
+
size=${ifDefined(this.size)}
|
|
38
|
+
aria-hidden="true"
|
|
39
|
+
></igc-icon>
|
|
40
|
+
</slot>
|
|
37
41
|
`;
|
|
38
42
|
}
|
|
39
43
|
async registerIcon(name, url, collection = 'default') {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"icon-button.js","sourceRoot":"","sources":["../../../src/components/button/icon-button.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAC3B,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACzD,OAAO,EAAE,MAAM,EAAE,MAAM,oCAAoC,CAAC;AAC5D,OAAO,EAAE,aAAa,EAAE,MAAM,uCAAuC,CAAC;AACtE,OAAO,EAAE,aAAa,EAAE,MAAM,uCAAuC,CAAC;AACtE,OAAO,
|
|
1
|
+
{"version":3,"file":"icon-button.js","sourceRoot":"","sources":["../../../src/components/button/icon-button.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAC3B,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACzD,OAAO,EAAE,MAAM,EAAE,MAAM,oCAAoC,CAAC;AAC5D,OAAO,EAAE,aAAa,EAAE,MAAM,uCAAuC,CAAC;AACtE,OAAO,EAAE,aAAa,EAAE,MAAM,uCAAuC,CAAC;AACtE,OAAO,EACL,YAAY,IAAI,iBAAiB,EACjC,oBAAoB,IAAI,yBAAyB,GAClD,MAAM,0BAA0B,CAAC;AAClC,OAAO,EAAE,sBAAsB,EAAE,MAAM,kBAAkB,CAAC;AAC1D,OAAO,EAAE,MAAM,EAAE,MAAM,oDAAoD,CAAC;AAC5E,OAAO,EAAE,MAAM,IAAI,SAAS,EAAE,MAAM,yDAAyD,CAAC;AAC9F,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,sDAAsD,CAAC;AACxF,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,sDAAsD,CAAC;AACxF,OAAO,EAAE,MAAM,IAAI,QAAQ,EAAE,MAAM,wDAAwD,CAAC;AAE5F,OAAO,EAAE,gBAAgB,EAAE,MAAM,2CAA2C,CAAC;AAC7E,OAAO,gBAAgB,MAAM,iBAAiB,CAAC;AAE/C,gBAAgB,CAAC,gBAAgB,CAAC,CAAC;AASnC,IAAqB,sBAAsB,GAA3C,MAAqB,sBAAuB,SAAQ,sBAAsB;IAA1E;;QAeS,aAAQ,GAAG,KAAK,CAAC;QAIjB,YAAO,GAAsC,WAAW,CAAC;IAkClE,CAAC;IAhCW,aAAa;QACrB,OAAO,IAAI,CAAA;;;;iBAIE,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC;uBACd,SAAS,CAAC,IAAI,CAAC,UAAU,CAAC;sBAC3B,IAAI,CAAC,QAAQ;iBAClB,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC;;;;KAIhC,CAAC;IACJ,CAAC;IAGS,KAAK,CAAC,YAAY,CAC1B,IAAY,EACZ,GAAW,EACX,UAAU,GAAG,SAAS;QAEtB,MAAM,iBAAiB,CAAC,IAAI,EAAE,GAAG,EAAE,UAAU,CAAC,CAAC;IACjD,CAAC;IAGS,oBAAoB,CAC5B,IAAY,EACZ,QAAgB,EAChB,UAAU,GAAG,SAAS;QAEtB,yBAAyB,CAAC,IAAI,EAAE,QAAQ,EAAE,UAAU,CAAC,CAAC;IACxD,CAAC;CACF,CAAA;AApDwB,8BAAO,GAAG,iBAAkB,CAAA;AAClC,6BAAM,GAAG,MAAO,CAAA;AAKjC;IAFC,aAAa,CAAC,UAAU,CAAC;IACzB,QAAQ,EAAE;oDACU;AAIrB;IADC,QAAQ,EAAE;0DACgB;AAI3B;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;wDACJ;AAIxB;IADC,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;uDACoC;AAkBhE;IADC,aAAa,EAAE;0DAOf;AAGD;IADC,aAAa,EAAE;kEAOf;AApDkB,sBAAsB;IAD1C,MAAM,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,EAAE,CAAC;GAC3B,sBAAsB,CAqD1C;eArDoB,sBAAsB","sourcesContent":["import { html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { themes } from '../../theming/theming-decorator.js';\nimport { alternateName } from '../common/decorators/alternateName.js';\nimport { blazorInclude } from '../common/decorators/blazorInclude.js';\nimport {\n registerIcon as registerIcon_impl,\n registerIconFromText as registerIconFromText_impl,\n} from '../icon/icon.registry.js';\nimport { IgcButtonBaseComponent } from './button-base.js';\nimport { styles } from './themes/icon-button/light/icon-button.base.css.js';\nimport { styles as bootstrap } from './themes/icon-button/light/icon-button.bootstrap.css.js';\nimport { styles as fluent } from './themes/icon-button/light/icon-button.fluent.css.js';\nimport { styles as indigo } from './themes/icon-button/light/icon-button.indigo.css.js';\nimport { styles as material } from './themes/icon-button/light/icon-button.material.css.js';\n\nimport { defineComponents } from '../common/definitions/defineComponents.js';\nimport IgcIconComponent from '../icon/icon.js';\n\ndefineComponents(IgcIconComponent);\n\n/**\n * @element igc-icon-button\n *\n * @csspart base - The wrapping element.\n * @csspart icon - The icon element.\n */\n@themes({ bootstrap, material, fluent, indigo })\nexport default class IgcIconButtonComponent extends IgcButtonBaseComponent {\n public static readonly tagName = 'igc-icon-button';\n protected static styles = styles;\n\n /** The name of the icon. */\n @alternateName('iconName')\n @property()\n public name!: string;\n\n /** The name of the icon collection. */\n @property()\n public collection!: string;\n\n /** Whether to flip the icon button. Useful for RTL layouts. */\n @property({ type: Boolean })\n public mirrored = false;\n\n /** The visual variant of the icon button. */\n @property({ reflect: true })\n public variant: 'flat' | 'contained' | 'outlined' = 'contained';\n\n protected renderContent() {\n return html`\n <slot>\n <igc-icon\n part=\"icon\"\n name=${ifDefined(this.name)}\n collection=${ifDefined(this.collection)}\n .mirrored=${this.mirrored}\n size=${ifDefined(this.size)}\n aria-hidden=\"true\"\n ></igc-icon>\n </slot>\n `;\n }\n\n @blazorInclude()\n protected async registerIcon(\n name: string,\n url: string,\n collection = 'default'\n ) {\n await registerIcon_impl(name, url, collection);\n }\n\n @blazorInclude()\n protected registerIconFromText(\n name: string,\n iconText: string,\n collection = 'default'\n ) {\n registerIconFromText_impl(name, iconText, collection);\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-icon-button': IgcIconButtonComponent;\n }\n}\n"]}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import { css } from 'lit';
|
|
2
|
-
export const styles = css `:host{position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;scrollbar-width:var(--scrolbar-size, 0.875rem);scrollbar-color:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a))) var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host *,:host *::before,:host *::after{-webkit-box-sizing:border-box;box-sizing:border-box}:host ::-webkit-scrollbar{width:var(--scrolbar-size, 0.875rem);height:var(--scrolbar-size, 0.875rem);background:var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host ::-webkit-scrollbar-thumb{background:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a)))}[hidden]{display:none !important}:host{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}[part=base]{border-radius:clamp(0rem,var(--igc-radius-factor)*.25rem,.25rem);position:relative;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;border:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;outline-style:none;-webkit-tap-highlight-color:rgba(0,0,0,0);overflow:hidden;white-space:nowrap;text-decoration:none;z-index:0;font-family:var(--igc-button-font-family);font-weight:var(--igc-button-font-weight);font-size:var(--igc-button-font-size);font-style:var(--igc-button-font-style);letter-spacing:var(--igc-button-letter-spacing);line-height:var(--igc-button-line-height);text-transform:var(--igc-button-text-transform)}[part=base]::before{position:absolute;content:"";width:100%;height:100%;z-index:-1;will-change:opacity;-webkit-transition:all .1s ease-out;-o-transition:all .1s ease-out;transition:all .1s ease-out}:host(:not([disabled])) [part=base]:hover{cursor:pointer}:host([disabled]){pointer-events:none}:host([disabled]) [part=base]{background:hsla(var(--igc-gray-300), var(--igc-gray-a));color:hsla(var(--igc-gray-500), var(--igc-gray-a));-webkit-box-shadow:none;box-shadow:none}:host([size=large]) [part=base]{height:var(--size, 36px);padding:0 calc(var(--igc-spacing-large)*2)}:host([size=medium]) [part=base]{height:var(--size, 30px);padding:0 calc(var(--igc-spacing-medium)*3)}:host([size=small]) [part=base]{height:var(--size, 24px);padding:0 calc(var(--igc-spacing-small)*4)}[name=prefix]::slotted(*){-webkit-margin-end:var(--igc-spacing-large);margin-inline-end:var(--igc-spacing-large)}[name=suffix]::slotted(*){-webkit-margin-start:var(--igc-spacing-large);margin-inline-start:var(--igc-spacing-large)}span[part=prefix],span[part=suffix]{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}:host(:not([disabled])[variant=outlined]) [part=base],:host(:not([disabled])[variant=flat]) [part=base]{color:hsla(var(--igc-secondary-500), var(--igc-secondary-a));background:rgba(0,0,0,0)}:host(:not([disabled])[variant=outlined]) [part=base]::before,:host(:not([disabled])[variant=flat]) [part=base]::before{opacity:0}:host(:not([disabled])[variant=outlined]) [part=base]:hover::before,:host(:not([disabled])[variant=flat]) [part=base]:hover::before{background:hsla(var(--igc-secondary-500), var(--igc-secondary-a));opacity:.12}:host(:not([disabled])[variant=outlined]) [part=base]:focus::before,:host(:not([disabled])[variant=flat]) [part=base]:focus::before,:host(:not([disabled])[variant=outlined]) [part=base]:active::before,:host(:not([disabled])[variant=flat]) [part=base]:active::before{background:hsla(var(--igc-secondary-500), var(--igc-secondary-a));opacity:.24}:host([disabled][variant=flat]) [part=base]{background:rgba(0,0,0,0)}:host(:not([disabled])[variant=outlined]) [part=base]{-webkit-box-shadow:inset 0 0 0 1px hsla(var(--igc-secondary-500), var(--igc-secondary-a));box-shadow:inset 0 0 0 1px hsla(var(--igc-secondary-500), var(--igc-secondary-a))}:host([disabled][variant=outlined]) [part=base]{background:rgba(0,0,0,0);-webkit-box-shadow:inset 0 0 0 1px hsla(var(--igc-gray-300), var(--igc-gray-a));box-shadow:inset 0 0 0 1px hsla(var(--igc-gray-300), var(--igc-gray-a))}:host(:not([disabled])[variant=fab]) [part=base],:host(:not([disabled])[variant=contained]) [part=base]{background:hsla(var(--igc-secondary-500), var(--igc-secondary-a));color:var(--igc-secondary-500-contrast)}:host([variant=fab]) [part=base]{border-radius:clamp(0rem,var(--igc-radius-factor)*var(--size)/2,var(--size)/2);min-width:var(--size);min-height:var(--size)}:host([variant=fab][size=large]) [part=base]{--size: 3rem}:host([variant=fab][size=medium]) [part=base]{--size: 2.5rem}:host([variant=fab][size=small]) [part=base]{--size: 2rem}`;
|
|
2
|
+
export const styles = css `:host{position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;scrollbar-width:var(--scrolbar-size, 0.875rem);scrollbar-color:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a))) var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host *,:host *::before,:host *::after{-webkit-box-sizing:border-box;box-sizing:border-box}:host ::-webkit-scrollbar{width:var(--scrolbar-size, 0.875rem);height:var(--scrolbar-size, 0.875rem);background:var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host ::-webkit-scrollbar-thumb{background:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a)))}[hidden]{display:none !important}:host{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;vertical-align:middle}[part=base]{border-radius:clamp(0rem,var(--igc-radius-factor)*.25rem,.25rem);position:relative;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-flex:1;-ms-flex:1;flex:1;border:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;outline-style:none;-webkit-tap-highlight-color:rgba(0,0,0,0);overflow:hidden;white-space:nowrap;text-decoration:none;z-index:0;font-family:var(--igc-button-font-family);font-weight:var(--igc-button-font-weight);font-size:var(--igc-button-font-size);font-style:var(--igc-button-font-style);letter-spacing:var(--igc-button-letter-spacing);line-height:var(--igc-button-line-height);text-transform:var(--igc-button-text-transform)}[part=base]::before{position:absolute;content:"";width:100%;height:100%;z-index:-1;will-change:opacity;-webkit-transition:all .1s ease-out;-o-transition:all .1s ease-out;transition:all .1s ease-out}:host(:not([disabled])) [part=base]:hover{cursor:pointer}:host([disabled]){pointer-events:none}:host([disabled]) [part=base]{background:hsla(var(--igc-gray-300), var(--igc-gray-a));color:hsla(var(--igc-gray-500), var(--igc-gray-a));-webkit-box-shadow:none;box-shadow:none}:host([size=large]) [part=base]{height:var(--size, 36px);padding:0 calc(var(--igc-spacing-large)*2)}:host([size=medium]) [part=base]{height:var(--size, 30px);padding:0 calc(var(--igc-spacing-medium)*3)}:host([size=small]) [part=base]{height:var(--size, 24px);padding:0 calc(var(--igc-spacing-small)*4)}[name=prefix]::slotted(*){-webkit-margin-end:var(--igc-spacing-large);margin-inline-end:var(--igc-spacing-large)}[name=suffix]::slotted(*){-webkit-margin-start:var(--igc-spacing-large);margin-inline-start:var(--igc-spacing-large)}span[part=prefix],span[part=suffix]{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}:host(:not([disabled])[variant=outlined]) [part=base],:host(:not([disabled])[variant=flat]) [part=base]{color:hsla(var(--igc-secondary-500), var(--igc-secondary-a));background:rgba(0,0,0,0)}:host(:not([disabled])[variant=outlined]) [part=base]::before,:host(:not([disabled])[variant=flat]) [part=base]::before{opacity:0}:host(:not([disabled])[variant=outlined]) [part=base]:hover::before,:host(:not([disabled])[variant=flat]) [part=base]:hover::before{background:hsla(var(--igc-secondary-500), var(--igc-secondary-a));opacity:.12}:host(:not([disabled])[variant=outlined]) [part=base]:focus::before,:host(:not([disabled])[variant=flat]) [part=base]:focus::before,:host(:not([disabled])[variant=outlined]) [part=base]:active::before,:host(:not([disabled])[variant=flat]) [part=base]:active::before{background:hsla(var(--igc-secondary-500), var(--igc-secondary-a));opacity:.24}:host([disabled][variant=flat]) [part=base]{background:rgba(0,0,0,0)}:host(:not([disabled])[variant=outlined]) [part=base]{-webkit-box-shadow:inset 0 0 0 1px hsla(var(--igc-secondary-500), var(--igc-secondary-a));box-shadow:inset 0 0 0 1px hsla(var(--igc-secondary-500), var(--igc-secondary-a))}:host([disabled][variant=outlined]) [part=base]{background:rgba(0,0,0,0);-webkit-box-shadow:inset 0 0 0 1px hsla(var(--igc-gray-300), var(--igc-gray-a));box-shadow:inset 0 0 0 1px hsla(var(--igc-gray-300), var(--igc-gray-a))}:host(:not([disabled])[variant=fab]) [part=base],:host(:not([disabled])[variant=contained]) [part=base]{background:hsla(var(--igc-secondary-500), var(--igc-secondary-a));color:var(--igc-secondary-500-contrast)}:host([variant=fab]) [part=base]{border-radius:clamp(0rem,var(--igc-radius-factor)*var(--size)/2,var(--size)/2);min-width:var(--size);min-height:var(--size)}:host([variant=fab][size=large]) [part=base]{--size: 3rem}:host([variant=fab][size=medium]) [part=base]{--size: 2.5rem}:host([variant=fab][size=small]) [part=base]{--size: 2rem}`;
|
|
3
3
|
//# sourceMappingURL=button.base.css.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button.base.css.js","sourceRoot":"","sources":["../../../../../../src/components/button/themes/button/light/button.base.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,
|
|
1
|
+
{"version":3,"file":"button.base.css.js","sourceRoot":"","sources":["../../../../../../src/components/button/themes/button/light/button.base.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,ktJAAktJ,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;scrollbar-width:var(--scrolbar-size, 0.875rem);scrollbar-color:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a))) var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host *,:host *::before,:host *::after{-webkit-box-sizing:border-box;box-sizing:border-box}:host ::-webkit-scrollbar{width:var(--scrolbar-size, 0.875rem);height:var(--scrolbar-size, 0.875rem);background:var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host ::-webkit-scrollbar-thumb{background:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a)))}[hidden]{display:none !important}:host{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;vertical-align:middle}[part=base]{border-radius:clamp(0rem,var(--igc-radius-factor)*.25rem,.25rem);position:relative;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-flex:1;-ms-flex:1;flex:1;border:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;outline-style:none;-webkit-tap-highlight-color:rgba(0,0,0,0);overflow:hidden;white-space:nowrap;text-decoration:none;z-index:0;font-family:var(--igc-button-font-family);font-weight:var(--igc-button-font-weight);font-size:var(--igc-button-font-size);font-style:var(--igc-button-font-style);letter-spacing:var(--igc-button-letter-spacing);line-height:var(--igc-button-line-height);text-transform:var(--igc-button-text-transform)}[part=base]::before{position:absolute;content:\"\";width:100%;height:100%;z-index:-1;will-change:opacity;-webkit-transition:all .1s ease-out;-o-transition:all .1s ease-out;transition:all .1s ease-out}:host(:not([disabled])) [part=base]:hover{cursor:pointer}:host([disabled]){pointer-events:none}:host([disabled]) [part=base]{background:hsla(var(--igc-gray-300), var(--igc-gray-a));color:hsla(var(--igc-gray-500), var(--igc-gray-a));-webkit-box-shadow:none;box-shadow:none}:host([size=large]) [part=base]{height:var(--size, 36px);padding:0 calc(var(--igc-spacing-large)*2)}:host([size=medium]) [part=base]{height:var(--size, 30px);padding:0 calc(var(--igc-spacing-medium)*3)}:host([size=small]) [part=base]{height:var(--size, 24px);padding:0 calc(var(--igc-spacing-small)*4)}[name=prefix]::slotted(*){-webkit-margin-end:var(--igc-spacing-large);margin-inline-end:var(--igc-spacing-large)}[name=suffix]::slotted(*){-webkit-margin-start:var(--igc-spacing-large);margin-inline-start:var(--igc-spacing-large)}span[part=prefix],span[part=suffix]{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}:host(:not([disabled])[variant=outlined]) [part=base],:host(:not([disabled])[variant=flat]) [part=base]{color:hsla(var(--igc-secondary-500), var(--igc-secondary-a));background:rgba(0,0,0,0)}:host(:not([disabled])[variant=outlined]) [part=base]::before,:host(:not([disabled])[variant=flat]) [part=base]::before{opacity:0}:host(:not([disabled])[variant=outlined]) [part=base]:hover::before,:host(:not([disabled])[variant=flat]) [part=base]:hover::before{background:hsla(var(--igc-secondary-500), var(--igc-secondary-a));opacity:.12}:host(:not([disabled])[variant=outlined]) [part=base]:focus::before,:host(:not([disabled])[variant=flat]) [part=base]:focus::before,:host(:not([disabled])[variant=outlined]) [part=base]:active::before,:host(:not([disabled])[variant=flat]) [part=base]:active::before{background:hsla(var(--igc-secondary-500), var(--igc-secondary-a));opacity:.24}:host([disabled][variant=flat]) [part=base]{background:rgba(0,0,0,0)}:host(:not([disabled])[variant=outlined]) [part=base]{-webkit-box-shadow:inset 0 0 0 1px hsla(var(--igc-secondary-500), var(--igc-secondary-a));box-shadow:inset 0 0 0 1px hsla(var(--igc-secondary-500), var(--igc-secondary-a))}:host([disabled][variant=outlined]) [part=base]{background:rgba(0,0,0,0);-webkit-box-shadow:inset 0 0 0 1px hsla(var(--igc-gray-300), var(--igc-gray-a));box-shadow:inset 0 0 0 1px hsla(var(--igc-gray-300), var(--igc-gray-a))}:host(:not([disabled])[variant=fab]) [part=base],:host(:not([disabled])[variant=contained]) [part=base]{background:hsla(var(--igc-secondary-500), var(--igc-secondary-a));color:var(--igc-secondary-500-contrast)}:host([variant=fab]) [part=base]{border-radius:clamp(0rem,var(--igc-radius-factor)*var(--size)/2,var(--size)/2);min-width:var(--size);min-height:var(--size)}:host([variant=fab][size=large]) [part=base]{--size: 3rem}:host([variant=fab][size=medium]) [part=base]{--size: 2.5rem}:host([variant=fab][size=small]) [part=base]{--size: 2rem}`;\n"]}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import { css } from 'lit';
|
|
2
|
-
export const styles = css `:host{position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;scrollbar-width:var(--scrolbar-size, 0.875rem);scrollbar-color:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a))) var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host *,:host *::before,:host *::after{-webkit-box-sizing:border-box;box-sizing:border-box}:host ::-webkit-scrollbar{width:var(--scrolbar-size, 0.875rem);height:var(--scrolbar-size, 0.875rem);background:var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host ::-webkit-scrollbar-thumb{background:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a)))}[hidden]{display:none !important}:host{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}[part=base]{border-radius:clamp(0rem,var(--igc-radius-factor)*.25rem,.25rem);position:relative;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;border:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;outline-style:none;-webkit-tap-highlight-color:rgba(0,0,0,0);overflow:hidden;white-space:nowrap;text-decoration:none;z-index:0;font-family:var(--igc-button-font-family);font-weight:var(--igc-button-font-weight);font-size:var(--igc-button-font-size);font-style:var(--igc-button-font-style);letter-spacing:var(--igc-button-letter-spacing);line-height:var(--igc-button-line-height);text-transform:var(--igc-button-text-transform)}[part=base]::before{position:absolute;content:"";width:100%;height:100%;z-index:-1;will-change:opacity;-webkit-transition:all .1s ease-out;-o-transition:all .1s ease-out;transition:all .1s ease-out}:host(:not([disabled])) [part=base]:hover{cursor:pointer}:host([disabled]){pointer-events:none}:host([disabled]) [part=base]{background:hsla(var(--igc-gray-300), var(--igc-gray-a));color:hsla(var(--igc-gray-500), var(--igc-gray-a));-webkit-box-shadow:none;box-shadow:none}:host([size=large]) [part=base]{height:var(--size, 36px);padding:0 calc(var(--igc-spacing-large)*2)}:host([size=medium]) [part=base]{height:var(--size, 30px);padding:0 calc(var(--igc-spacing-medium)*3)}:host([size=small]) [part=base]{height:var(--size, 24px);padding:0 calc(var(--igc-spacing-small)*4)}[name=prefix]::slotted(*){-webkit-margin-end:var(--igc-spacing-large);margin-inline-end:var(--igc-spacing-large)}[name=suffix]::slotted(*){-webkit-margin-start:var(--igc-spacing-large);margin-inline-start:var(--igc-spacing-large)}span[part=prefix],span[part=suffix]{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}:host(:not([disabled])[variant=outlined]) [part=base],:host(:not([disabled])[variant=flat]) [part=base]{color:hsla(var(--igc-secondary-500), var(--igc-secondary-a));background:rgba(0,0,0,0)}:host(:not([disabled])[variant=outlined]) [part=base]::before,:host(:not([disabled])[variant=flat]) [part=base]::before{opacity:0}:host(:not([disabled])[variant=outlined]) [part=base]:hover::before,:host(:not([disabled])[variant=flat]) [part=base]:hover::before{background:hsla(var(--igc-secondary-500), var(--igc-secondary-a));opacity:.12}:host(:not([disabled])[variant=outlined]) [part=base]:focus::before,:host(:not([disabled])[variant=flat]) [part=base]:focus::before,:host(:not([disabled])[variant=outlined]) [part=base]:active::before,:host(:not([disabled])[variant=flat]) [part=base]:active::before{background:hsla(var(--igc-secondary-500), var(--igc-secondary-a));opacity:.24}:host([disabled][variant=flat]) [part=base]{background:rgba(0,0,0,0)}:host(:not([disabled])[variant=outlined]) [part=base]{-webkit-box-shadow:inset 0 0 0 1px hsla(var(--igc-secondary-500), var(--igc-secondary-a));box-shadow:inset 0 0 0 1px hsla(var(--igc-secondary-500), var(--igc-secondary-a))}:host([disabled][variant=outlined]) [part=base]{background:rgba(0,0,0,0);-webkit-box-shadow:inset 0 0 0 1px hsla(var(--igc-gray-300), var(--igc-gray-a));box-shadow:inset 0 0 0 1px hsla(var(--igc-gray-300), var(--igc-gray-a))}:host(:not([disabled])[variant=contained]) [part=base],:host(:not([disabled])[variant=fab]) [part=base]{background:hsla(var(--igc-secondary-500), var(--igc-secondary-a));color:var(--igc-secondary-500-contrast)}:host([variant=fab]) [part=base]{border-radius:clamp(0rem,var(--igc-radius-factor)*var(--size)/2,var(--size)/2);min-width:var(--size);min-height:var(--size)}:host([variant=fab][size=large]) [part=base]{--size: 3rem}:host([variant=fab][size=medium]) [part=base]{--size: 2.5rem}:host([variant=fab][size=small]) [part=base]{--size: 2rem}:host(:not([disabled])[variant=fab]) [part=base],:host(:not([disabled])[variant=contained]) [part=base]{-webkit-transition:-webkit-box-shadow .1s ease-out;transition:-webkit-box-shadow .1s ease-out;-o-transition:box-shadow .1s ease-out;transition:box-shadow .1s ease-out;transition:box-shadow .1s ease-out, -webkit-box-shadow .1s ease-out}:host(:not([disabled])[variant=fab]) [part=base]::before,:host(:not([disabled])[variant=contained]) [part=base]::before{opacity:0}:host(:not([disabled])[variant=fab]) [part=base]:hover,:host(:not([disabled])[variant=contained]) [part=base]:hover{-webkit-box-shadow:var(--igc-elevation-4);box-shadow:var(--igc-elevation-4)}:host(:not([disabled])[variant=fab]) [part=base]:hover::before,:host(:not([disabled])[variant=contained]) [part=base]:hover::before{background:#fff;opacity:.12}:host(:not([disabled])[variant=fab]) [part=base]:focus,:host(:not([disabled])[variant=contained]) [part=base]:focus,:host(:not([disabled])[variant=fab]) [part=base]:active,:host(:not([disabled])[variant=contained]) [part=base]:active{-webkit-box-shadow:var(--igc-elevation-8);box-shadow:var(--igc-elevation-8)}:host(:not([disabled])[variant=fab]) [part=base]:focus::before,:host(:not([disabled])[variant=contained]) [part=base]:focus::before,:host(:not([disabled])[variant=fab]) [part=base]:active::before,:host(:not([disabled])[variant=contained]) [part=base]:active::before{background:#fff;opacity:.24}:host(:not([disabled])[variant=contained]) [part=base]{-webkit-box-shadow:var(--igc-elevation-2);box-shadow:var(--igc-elevation-2)}:host(:not([disabled])[variant=contained]) [part=base]:hover{-webkit-box-shadow:var(--igc-elevation-4);box-shadow:var(--igc-elevation-4)}:host(:not([disabled])[variant=contained]) [part=base]:focus,:host(:not([disabled])[variant=contained]) [part=base]:active{-webkit-box-shadow:var(--igc-elevation-8);box-shadow:var(--igc-elevation-8)}:host(:not([disabled])[variant=fab]) [part=base]{-webkit-box-shadow:var(--igc-elevation-6);box-shadow:var(--igc-elevation-6)}:host(:not([disabled])[variant=fab]) [part=base]:hover,:host(:not([disabled])[variant=fab]) [part=base]:focus,:host(:not([disabled])[variant=fab]) [part=base]:active{-webkit-box-shadow:var(--igc-elevation-12);box-shadow:var(--igc-elevation-12)}`;
|
|
2
|
+
export const styles = css `:host{position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;scrollbar-width:var(--scrolbar-size, 0.875rem);scrollbar-color:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a))) var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host *,:host *::before,:host *::after{-webkit-box-sizing:border-box;box-sizing:border-box}:host ::-webkit-scrollbar{width:var(--scrolbar-size, 0.875rem);height:var(--scrolbar-size, 0.875rem);background:var(--igc-scrollbar-track-color, hsla(var(--igc-gray-200), var(--igc-gray-a)))}:host ::-webkit-scrollbar-thumb{background:var(--igc-scrollbar-thumb-color, hsla(var(--igc-gray-400), var(--igc-gray-a)))}[hidden]{display:none !important}:host{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;vertical-align:middle}[part=base]{border-radius:clamp(0rem,var(--igc-radius-factor)*.25rem,.25rem);position:relative;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-flex:1;-ms-flex:1;flex:1;border:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;outline-style:none;-webkit-tap-highlight-color:rgba(0,0,0,0);overflow:hidden;white-space:nowrap;text-decoration:none;z-index:0;font-family:var(--igc-button-font-family);font-weight:var(--igc-button-font-weight);font-size:var(--igc-button-font-size);font-style:var(--igc-button-font-style);letter-spacing:var(--igc-button-letter-spacing);line-height:var(--igc-button-line-height);text-transform:var(--igc-button-text-transform)}[part=base]::before{position:absolute;content:"";width:100%;height:100%;z-index:-1;will-change:opacity;-webkit-transition:all .1s ease-out;-o-transition:all .1s ease-out;transition:all .1s ease-out}:host(:not([disabled])) [part=base]:hover{cursor:pointer}:host([disabled]){pointer-events:none}:host([disabled]) [part=base]{background:hsla(var(--igc-gray-300), var(--igc-gray-a));color:hsla(var(--igc-gray-500), var(--igc-gray-a));-webkit-box-shadow:none;box-shadow:none}:host([size=large]) [part=base]{height:var(--size, 36px);padding:0 calc(var(--igc-spacing-large)*2)}:host([size=medium]) [part=base]{height:var(--size, 30px);padding:0 calc(var(--igc-spacing-medium)*3)}:host([size=small]) [part=base]{height:var(--size, 24px);padding:0 calc(var(--igc-spacing-small)*4)}[name=prefix]::slotted(*){-webkit-margin-end:var(--igc-spacing-large);margin-inline-end:var(--igc-spacing-large)}[name=suffix]::slotted(*){-webkit-margin-start:var(--igc-spacing-large);margin-inline-start:var(--igc-spacing-large)}span[part=prefix],span[part=suffix]{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}:host(:not([disabled])[variant=outlined]) [part=base],:host(:not([disabled])[variant=flat]) [part=base]{color:hsla(var(--igc-secondary-500), var(--igc-secondary-a));background:rgba(0,0,0,0)}:host(:not([disabled])[variant=outlined]) [part=base]::before,:host(:not([disabled])[variant=flat]) [part=base]::before{opacity:0}:host(:not([disabled])[variant=outlined]) [part=base]:hover::before,:host(:not([disabled])[variant=flat]) [part=base]:hover::before{background:hsla(var(--igc-secondary-500), var(--igc-secondary-a));opacity:.12}:host(:not([disabled])[variant=outlined]) [part=base]:focus::before,:host(:not([disabled])[variant=flat]) [part=base]:focus::before,:host(:not([disabled])[variant=outlined]) [part=base]:active::before,:host(:not([disabled])[variant=flat]) [part=base]:active::before{background:hsla(var(--igc-secondary-500), var(--igc-secondary-a));opacity:.24}:host([disabled][variant=flat]) [part=base]{background:rgba(0,0,0,0)}:host(:not([disabled])[variant=outlined]) [part=base]{-webkit-box-shadow:inset 0 0 0 1px hsla(var(--igc-secondary-500), var(--igc-secondary-a));box-shadow:inset 0 0 0 1px hsla(var(--igc-secondary-500), var(--igc-secondary-a))}:host([disabled][variant=outlined]) [part=base]{background:rgba(0,0,0,0);-webkit-box-shadow:inset 0 0 0 1px hsla(var(--igc-gray-300), var(--igc-gray-a));box-shadow:inset 0 0 0 1px hsla(var(--igc-gray-300), var(--igc-gray-a))}:host(:not([disabled])[variant=contained]) [part=base],:host(:not([disabled])[variant=fab]) [part=base]{background:hsla(var(--igc-secondary-500), var(--igc-secondary-a));color:var(--igc-secondary-500-contrast)}:host([variant=fab]) [part=base]{border-radius:clamp(0rem,var(--igc-radius-factor)*var(--size)/2,var(--size)/2);min-width:var(--size);min-height:var(--size)}:host([variant=fab][size=large]) [part=base]{--size: 3rem}:host([variant=fab][size=medium]) [part=base]{--size: 2.5rem}:host([variant=fab][size=small]) [part=base]{--size: 2rem}:host(:not([disabled])[variant=fab]) [part=base],:host(:not([disabled])[variant=contained]) [part=base]{-webkit-transition:-webkit-box-shadow .1s ease-out;transition:-webkit-box-shadow .1s ease-out;-o-transition:box-shadow .1s ease-out;transition:box-shadow .1s ease-out;transition:box-shadow .1s ease-out, -webkit-box-shadow .1s ease-out}:host(:not([disabled])[variant=fab]) [part=base]::before,:host(:not([disabled])[variant=contained]) [part=base]::before{opacity:0}:host(:not([disabled])[variant=fab]) [part=base]:hover,:host(:not([disabled])[variant=contained]) [part=base]:hover{-webkit-box-shadow:var(--igc-elevation-4);box-shadow:var(--igc-elevation-4)}:host(:not([disabled])[variant=fab]) [part=base]:hover::before,:host(:not([disabled])[variant=contained]) [part=base]:hover::before{background:#fff;opacity:.12}:host(:not([disabled])[variant=fab]) [part=base]:focus,:host(:not([disabled])[variant=contained]) [part=base]:focus,:host(:not([disabled])[variant=fab]) [part=base]:active,:host(:not([disabled])[variant=contained]) [part=base]:active{-webkit-box-shadow:var(--igc-elevation-8);box-shadow:var(--igc-elevation-8)}:host(:not([disabled])[variant=fab]) [part=base]:focus::before,:host(:not([disabled])[variant=contained]) [part=base]:focus::before,:host(:not([disabled])[variant=fab]) [part=base]:active::before,:host(:not([disabled])[variant=contained]) [part=base]:active::before{background:#fff;opacity:.24}:host(:not([disabled])[variant=contained]) [part=base]{-webkit-box-shadow:var(--igc-elevation-2);box-shadow:var(--igc-elevation-2)}:host(:not([disabled])[variant=contained]) [part=base]:hover{-webkit-box-shadow:var(--igc-elevation-4);box-shadow:var(--igc-elevation-4)}:host(:not([disabled])[variant=contained]) [part=base]:focus,:host(:not([disabled])[variant=contained]) [part=base]:active{-webkit-box-shadow:var(--igc-elevation-8);box-shadow:var(--igc-elevation-8)}:host(:not([disabled])[variant=fab]) [part=base]{-webkit-box-shadow:var(--igc-elevation-6);box-shadow:var(--igc-elevation-6)}:host(:not([disabled])[variant=fab]) [part=base]:hover,:host(:not([disabled])[variant=fab]) [part=base]:focus,:host(:not([disabled])[variant=fab]) [part=base]:active{-webkit-box-shadow:var(--igc-elevation-12);box-shadow:var(--igc-elevation-12)}`;
|
|
3
3
|
//# sourceMappingURL=button.material.css.js.map
|