igniteui-webcomponents 4.2.3 → 4.3.0-beta.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 +12 -0
- package/README.md +2 -6
- package/animations/player.js +10 -6
- package/animations/player.js.map +1 -1
- package/animations/presets/fade/index.d.ts +3 -0
- package/animations/presets/fade/index.js +12 -0
- package/animations/presets/fade/index.js.map +1 -0
- package/animations/presets/index.d.ts +1 -0
- package/animations/presets/index.js +1 -0
- package/animations/presets/index.js.map +1 -1
- package/components/accordion/accordion.js +2 -1
- package/components/accordion/accordion.js.map +1 -1
- package/components/avatar/avatar.js +2 -2
- package/components/avatar/avatar.js.map +1 -1
- package/components/avatar/themes/dark/avatar.base.bootstrap.css.js +15 -0
- package/components/avatar/themes/dark/avatar.base.bootstrap.css.js.map +1 -0
- package/components/avatar/themes/{avatar.base.css.js → light/avatar.base.css.js} +25 -8
- package/components/avatar/themes/light/avatar.base.css.js.map +1 -0
- package/components/avatar/themes/light/avatar.bootstrap.css.js +26 -0
- package/components/avatar/themes/light/avatar.bootstrap.css.js.map +1 -0
- package/components/badge/badge.js.map +1 -1
- package/components/badge/themes/light/badge.base.css.js +4 -5
- package/components/badge/themes/light/badge.base.css.js.map +1 -1
- package/components/button/button-base.js.map +1 -1
- package/components/button/button.js.map +1 -1
- package/components/button/icon-button.js.map +1 -1
- package/components/button/themes/button/dark/button.bootstrap.css.js +15 -0
- package/components/button/themes/button/dark/button.bootstrap.css.js.map +1 -0
- package/components/button/themes/button/dark/button.fluent.css.js +13 -1
- package/components/button/themes/button/dark/button.fluent.css.js.map +1 -1
- package/components/button/themes/button/dark/button.indigo.css.d.ts +1 -0
- package/components/button/themes/button/dark/button.indigo.css.js +15 -0
- package/components/button/themes/button/dark/button.indigo.css.js.map +1 -0
- package/components/button/themes/button/dark/button.material.css.d.ts +1 -0
- package/components/button/themes/button/dark/button.material.css.js +15 -0
- package/components/button/themes/button/dark/button.material.css.js.map +1 -0
- package/components/button/themes/button/light/button.base.css.js +6 -57
- package/components/button/themes/button/light/button.base.css.js.map +1 -1
- package/components/button/themes/button/light/button.bootstrap.css.js +229 -71
- package/components/button/themes/button/light/button.bootstrap.css.js.map +1 -1
- package/components/button/themes/button/light/button.fluent.css.js +289 -70
- package/components/button/themes/button/light/button.fluent.css.js.map +1 -1
- package/components/button/themes/button/light/button.indigo.css.js +282 -78
- package/components/button/themes/button/light/button.indigo.css.js.map +1 -1
- package/components/button/themes/button/light/button.material.css.js +282 -170
- 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 +4 -6
- 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 +24 -0
- 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 +16 -0
- 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 +9 -0
- 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 +7 -0
- package/components/button/themes/icon-button/light/icon-button.material.css.js.map +1 -1
- package/components/calendar/calendar.js.map +1 -1
- package/components/calendar/common/calendar-base.d.ts +2 -2
- package/components/calendar/common/calendar-base.js.map +1 -1
- package/components/calendar/days-view/days-view.js.map +1 -1
- package/components/calendar/months-view/months-view.js.map +1 -1
- package/components/calendar/themes/calendar.base.css.js +4 -5
- package/components/calendar/themes/calendar.base.css.js.map +1 -1
- package/components/calendar/themes/fluent/calendar.fluent.css.js +4 -5
- package/components/calendar/themes/fluent/calendar.fluent.css.js.map +1 -1
- package/components/calendar/years-view/years-view.js.map +1 -1
- package/components/card/card.actions.js.map +1 -1
- package/components/card/card.content.js.map +1 -1
- package/components/card/card.header.js.map +1 -1
- package/components/card/card.js.map +1 -1
- package/components/card/card.media.js +2 -1
- package/components/card/card.media.js.map +1 -1
- package/components/card/themes/light/card.actions.bootstrap.css.js +4 -5
- package/components/card/themes/light/card.actions.bootstrap.css.js.map +1 -1
- package/components/card/themes/light/card.actions.material.css.js +4 -5
- package/components/card/themes/light/card.actions.material.css.js.map +1 -1
- package/components/card/themes/light/card.content.bootstrap.css.js +5 -8
- package/components/card/themes/light/card.content.bootstrap.css.js.map +1 -1
- package/components/card/themes/light/card.content.indigo.css.js +5 -8
- package/components/card/themes/light/card.content.indigo.css.js.map +1 -1
- package/components/card/themes/light/card.content.material.css.js +5 -8
- package/components/card/themes/light/card.content.material.css.js.map +1 -1
- package/components/card/themes/light/card.header.bootstrap.css.js +4 -8
- package/components/card/themes/light/card.header.bootstrap.css.js.map +1 -1
- package/components/card/themes/light/card.header.fluent.css.js +4 -8
- package/components/card/themes/light/card.header.fluent.css.js.map +1 -1
- package/components/card/themes/light/card.header.indigo.css.js +4 -8
- package/components/card/themes/light/card.header.indigo.css.js.map +1 -1
- package/components/card/themes/light/card.header.material.css.js +4 -8
- package/components/card/themes/light/card.header.material.css.js.map +1 -1
- package/components/card/themes/light/card.material.css.js +15 -5
- package/components/card/themes/light/card.material.css.js.map +1 -1
- package/components/card/themes/light/card.media.material.css.js +4 -5
- package/components/card/themes/light/card.media.material.css.js.map +1 -1
- package/components/checkbox/checkbox-base.js.map +1 -1
- package/components/checkbox/checkbox.js.map +1 -1
- package/components/checkbox/switch.js.map +1 -1
- package/components/checkbox/themes/dark/checkbox.bootstrap.css.d.ts +1 -0
- package/components/checkbox/themes/dark/checkbox.bootstrap.css.js +15 -0
- package/components/checkbox/themes/dark/checkbox.bootstrap.css.js.map +1 -0
- package/components/checkbox/themes/dark/checkbox.fluent.css.js +13 -1
- package/components/checkbox/themes/dark/checkbox.fluent.css.js.map +1 -1
- package/components/checkbox/themes/dark/checkbox.indigo.css.js +13 -1
- package/components/checkbox/themes/dark/checkbox.indigo.css.js.map +1 -1
- package/components/checkbox/themes/dark/checkbox.material.css.d.ts +1 -0
- package/components/checkbox/themes/dark/checkbox.material.css.js +15 -0
- package/components/checkbox/themes/dark/checkbox.material.css.js.map +1 -0
- package/components/checkbox/themes/dark/switch.bootstrap.css.d.ts +1 -0
- package/components/checkbox/themes/dark/switch.bootstrap.css.js +15 -0
- package/components/checkbox/themes/dark/switch.bootstrap.css.js.map +1 -0
- package/components/checkbox/themes/dark/switch.fluent.css.js +13 -1
- package/components/checkbox/themes/dark/switch.fluent.css.js.map +1 -1
- package/components/checkbox/themes/dark/switch.indigo.css.js +13 -1
- package/components/checkbox/themes/dark/switch.indigo.css.js.map +1 -1
- package/components/checkbox/themes/dark/switch.material.css.d.ts +1 -0
- package/components/checkbox/themes/dark/switch.material.css.js +15 -0
- package/components/checkbox/themes/dark/switch.material.css.js.map +1 -0
- package/components/checkbox/themes/light/checkbox.base.css.js +17 -51
- package/components/checkbox/themes/light/checkbox.base.css.js.map +1 -1
- package/components/checkbox/themes/light/checkbox.bootstrap.css.js +124 -46
- package/components/checkbox/themes/light/checkbox.bootstrap.css.js.map +1 -1
- package/components/checkbox/themes/light/checkbox.fluent.css.js +172 -87
- package/components/checkbox/themes/light/checkbox.fluent.css.js.map +1 -1
- package/components/checkbox/themes/light/checkbox.indigo.css.js +136 -49
- package/components/checkbox/themes/light/checkbox.indigo.css.js.map +1 -1
- package/components/checkbox/themes/light/checkbox.material.css.js +148 -18
- package/components/checkbox/themes/light/checkbox.material.css.js.map +1 -1
- package/components/checkbox/themes/light/switch.base.css.js +31 -56
- package/components/checkbox/themes/light/switch.base.css.js.map +1 -1
- package/components/checkbox/themes/light/switch.bootstrap.css.js +148 -95
- package/components/checkbox/themes/light/switch.bootstrap.css.js.map +1 -1
- package/components/checkbox/themes/light/switch.fluent.css.js +144 -80
- package/components/checkbox/themes/light/switch.fluent.css.js.map +1 -1
- package/components/checkbox/themes/light/switch.indigo.css.js +154 -97
- package/components/checkbox/themes/light/switch.indigo.css.js.map +1 -1
- package/components/checkbox/themes/light/switch.material.css.js +171 -37
- package/components/checkbox/themes/light/switch.material.css.js.map +1 -1
- package/components/chip/chip.js.map +1 -1
- package/components/chip/themes/chip.base.css.js +4 -5
- package/components/chip/themes/chip.base.css.js.map +1 -1
- package/components/chip/themes/chip.bootstrap.css.js +4 -5
- package/components/chip/themes/chip.bootstrap.css.js.map +1 -1
- package/components/chip/themes/chip.fluent.css.js +4 -5
- package/components/chip/themes/chip.fluent.css.js.map +1 -1
- package/components/chip/themes/chip.indigo.css.js +4 -5
- package/components/chip/themes/chip.indigo.css.js.map +1 -1
- package/components/chip/themes/chip.material.css.js +4 -5
- package/components/chip/themes/chip.material.css.js.map +1 -1
- package/components/combo/combo-header.js.map +1 -1
- package/components/combo/combo-item.d.ts +5 -0
- package/components/combo/combo-item.js.map +1 -1
- package/components/combo/combo-list.js +2 -1
- package/components/combo/combo-list.js.map +1 -1
- package/components/combo/combo.d.ts +51 -5
- package/components/combo/combo.js +58 -26
- package/components/combo/combo.js.map +1 -1
- package/components/combo/controllers/data.js +9 -5
- package/components/combo/controllers/data.js.map +1 -1
- package/components/combo/controllers/selection.d.ts +2 -1
- package/components/combo/controllers/selection.js +14 -3
- package/components/combo/controllers/selection.js.map +1 -1
- package/components/combo/operations/filter.d.ts +3 -1
- package/components/combo/operations/filter.js +10 -7
- package/components/combo/operations/filter.js.map +1 -1
- package/components/combo/operations/group.d.ts +2 -2
- package/components/combo/operations/group.js +8 -5
- package/components/combo/operations/group.js.map +1 -1
- package/components/combo/themes/light/combo.base.css.js +4 -5
- package/components/combo/themes/light/combo.base.css.js.map +1 -1
- package/components/combo/themes/light/header/combo-header.base.css.js +4 -5
- package/components/combo/themes/light/header/combo-header.base.css.js.map +1 -1
- package/components/combo/themes/light/item/combo-item.base.css.js +4 -5
- package/components/combo/themes/light/item/combo-item.base.css.js.map +1 -1
- package/components/combo/types.d.ts +8 -5
- package/components/combo/types.js.map +1 -1
- package/components/common/mixins/sizable.js.map +1 -1
- package/components/date-time-input/date-time-input.js +2 -1
- package/components/date-time-input/date-time-input.js.map +1 -1
- package/components/date-time-input/date-util.js +2 -1
- package/components/date-time-input/date-util.js.map +1 -1
- package/components/dialog/dialog.d.ts +9 -2
- package/components/dialog/dialog.js +37 -10
- package/components/dialog/dialog.js.map +1 -1
- package/components/dialog/themes/light/dialog.base.css.js +17 -8
- package/components/dialog/themes/light/dialog.base.css.js.map +1 -1
- package/components/dropdown/dropdown-group.js.map +1 -1
- package/components/dropdown/dropdown-header.js.map +1 -1
- package/components/dropdown/dropdown-item.js.map +1 -1
- package/components/dropdown/dropdown.js +2 -0
- package/components/dropdown/dropdown.js.map +1 -1
- package/components/dropdown/themes/light/dropdown-group.base.css.js +4 -5
- package/components/dropdown/themes/light/dropdown-group.base.css.js.map +1 -1
- package/components/dropdown/themes/light/dropdown-header.base.css.js +4 -5
- package/components/dropdown/themes/light/dropdown-header.base.css.js.map +1 -1
- package/components/dropdown/themes/light/dropdown-item.base.css.js +4 -5
- package/components/dropdown/themes/light/dropdown-item.base.css.js.map +1 -1
- package/components/dropdown/themes/light/dropdown.base.css.js +4 -5
- package/components/dropdown/themes/light/dropdown.base.css.js.map +1 -1
- package/components/expansion-panel/expansion-panel.d.ts +1 -0
- package/components/expansion-panel/expansion-panel.js.map +1 -1
- package/components/expansion-panel/themes/light/expansion-panel.base.css.js +4 -5
- package/components/expansion-panel/themes/light/expansion-panel.base.css.js.map +1 -1
- package/components/form/form.js +2 -1
- package/components/form/form.js.map +1 -1
- package/components/icon/dark/icon.bootstrap.css.d.ts +1 -0
- package/components/icon/dark/icon.bootstrap.css.js +15 -0
- package/components/icon/dark/icon.bootstrap.css.js.map +1 -0
- package/components/icon/dark/icon.fluent.css.d.ts +1 -0
- package/components/{avatar/themes/avatar.bootstrap.css.js → icon/dark/icon.fluent.css.js} +13 -5
- package/components/icon/dark/icon.fluent.css.js.map +1 -0
- package/components/icon/dark/icon.indigo.css.d.ts +1 -0
- package/components/icon/dark/icon.indigo.css.js +15 -0
- package/components/icon/dark/icon.indigo.css.js.map +1 -0
- package/components/icon/dark/icon.material.css.d.ts +1 -0
- package/components/icon/dark/icon.material.css.js +15 -0
- package/components/icon/dark/icon.material.css.js.map +1 -0
- package/components/icon/icon.base.css.d.ts +1 -0
- package/components/icon/{icon.material.css.js → icon.base.css.js} +11 -13
- package/components/icon/icon.base.css.js.map +1 -0
- package/components/icon/icon.js +12 -3
- package/components/icon/icon.js.map +1 -1
- package/components/icon/light/icon.bootstrap.css.d.ts +1 -0
- package/components/icon/light/icon.bootstrap.css.js +60 -0
- package/components/icon/light/icon.bootstrap.css.js.map +1 -0
- package/components/icon/light/icon.fluent.css.d.ts +1 -0
- package/components/icon/light/icon.fluent.css.js +60 -0
- package/components/icon/light/icon.fluent.css.js.map +1 -0
- package/components/icon/light/icon.indigo.css.d.ts +1 -0
- package/components/icon/light/icon.indigo.css.js +60 -0
- package/components/icon/light/icon.indigo.css.js.map +1 -0
- package/components/icon/light/icon.material.css.d.ts +1 -0
- package/components/icon/light/icon.material.css.js +60 -0
- package/components/icon/light/icon.material.css.js.map +1 -0
- package/components/input/input-base.js.map +1 -1
- package/components/input/input.js +2 -1
- package/components/input/input.js.map +1 -1
- package/components/input/themes/light/input.base.css.js +4 -5
- package/components/input/themes/light/input.base.css.js.map +1 -1
- package/components/list/list-header.js.map +1 -1
- package/components/list/list-item.js.map +1 -1
- package/components/list/list.js.map +1 -1
- package/components/list/themes/light/list-header.base.css.js +4 -5
- package/components/list/themes/light/list-header.base.css.js.map +1 -1
- package/components/list/themes/light/list-item.base.css.js +4 -5
- package/components/list/themes/light/list-item.base.css.js.map +1 -1
- package/components/list/themes/light/list.base.css.js +4 -5
- package/components/list/themes/light/list.base.css.js.map +1 -1
- package/components/mask-input/mask-input-base.js.map +1 -1
- package/components/mask-input/mask-input.js +2 -1
- package/components/mask-input/mask-input.js.map +1 -1
- package/components/nav-drawer/nav-drawer-header-item.js.map +1 -1
- package/components/nav-drawer/nav-drawer-item.js.map +1 -1
- package/components/nav-drawer/nav-drawer.js.map +1 -1
- package/components/nav-drawer/themes/light/nav-drawer-header-item.base.css.js +4 -5
- package/components/nav-drawer/themes/light/nav-drawer-header-item.base.css.js.map +1 -1
- package/components/nav-drawer/themes/light/nav-drawer-item.base.css.js +4 -5
- package/components/nav-drawer/themes/light/nav-drawer-item.base.css.js.map +1 -1
- package/components/nav-drawer/themes/light/nav-drawer.base.css.js +4 -5
- package/components/nav-drawer/themes/light/nav-drawer.base.css.js.map +1 -1
- package/components/navbar/navbar.js +3 -2
- package/components/navbar/navbar.js.map +1 -1
- package/components/navbar/themes/dark/navbar.bootstrap.css.d.ts +1 -0
- package/components/navbar/themes/dark/navbar.bootstrap.css.js +15 -0
- package/components/navbar/themes/dark/navbar.bootstrap.css.js.map +1 -0
- package/components/navbar/themes/dark/navbar.fluent.css.d.ts +1 -0
- package/components/navbar/themes/dark/navbar.fluent.css.js +15 -0
- package/components/navbar/themes/dark/navbar.fluent.css.js.map +1 -0
- package/components/navbar/themes/dark/navbar.indigo.css.d.ts +1 -0
- package/components/navbar/themes/dark/navbar.indigo.css.js +15 -0
- package/components/navbar/themes/dark/navbar.indigo.css.js.map +1 -0
- package/components/navbar/themes/dark/navbar.material.css.d.ts +1 -0
- package/components/navbar/themes/dark/navbar.material.css.js +15 -0
- package/components/navbar/themes/dark/navbar.material.css.js.map +1 -0
- package/components/navbar/themes/light/navbar.bootstrap.css.js +62 -6
- package/components/navbar/themes/light/navbar.bootstrap.css.js.map +1 -1
- package/components/navbar/themes/light/navbar.fluent.css.js +68 -1
- package/components/navbar/themes/light/navbar.fluent.css.js.map +1 -1
- package/components/navbar/themes/light/navbar.indigo.css.js +65 -3
- package/components/navbar/themes/light/navbar.indigo.css.js.map +1 -1
- package/components/navbar/themes/light/navbar.material.css.d.ts +1 -0
- package/components/navbar/themes/light/navbar.material.css.js +69 -0
- package/components/navbar/themes/light/navbar.material.css.js.map +1 -0
- package/components/navbar/themes/navbar.base.css.d.ts +1 -0
- package/components/navbar/themes/{light/navbar.base.css.js → navbar.base.css.js} +7 -10
- package/components/navbar/themes/navbar.base.css.js.map +1 -0
- package/components/progress/base.js.map +1 -1
- package/components/progress/circular-gradient.js +2 -1
- package/components/progress/circular-gradient.js.map +1 -1
- package/components/progress/circular-progress.js.map +1 -1
- package/components/progress/linear-progress.js.map +1 -1
- package/components/progress/themes/circular/circular.progress.base.css.js +4 -5
- package/components/progress/themes/circular/circular.progress.base.css.js.map +1 -1
- package/components/progress/themes/linear/linear.progress.base.css.js +4 -5
- package/components/progress/themes/linear/linear.progress.base.css.js.map +1 -1
- package/components/progress/themes/linear/linear.progress.bootstrap.css.js +4 -5
- package/components/progress/themes/linear/linear.progress.bootstrap.css.js.map +1 -1
- package/components/progress/themes/linear/linear.progress.indigo.css.js +4 -5
- package/components/progress/themes/linear/linear.progress.indigo.css.js.map +1 -1
- package/components/radio/radio.js +6 -3
- package/components/radio/radio.js.map +1 -1
- package/components/radio/themes/dark/radio.bootstrap.css.d.ts +1 -0
- package/components/radio/themes/dark/radio.bootstrap.css.js +15 -0
- package/components/radio/themes/dark/radio.bootstrap.css.js.map +1 -0
- package/components/radio/themes/dark/radio.fluent.css.js +13 -1
- package/components/radio/themes/dark/radio.fluent.css.js.map +1 -1
- package/components/radio/themes/dark/radio.indigo.css.js +13 -1
- package/components/radio/themes/dark/radio.indigo.css.js.map +1 -1
- package/components/radio/themes/dark/radio.material.css.js +13 -1
- package/components/radio/themes/dark/radio.material.css.js.map +1 -1
- package/components/radio/themes/light/radio.base.css.js +24 -41
- package/components/radio/themes/light/radio.base.css.js.map +1 -1
- package/components/radio/themes/light/radio.bootstrap.css.js +102 -30
- package/components/radio/themes/light/radio.bootstrap.css.js.map +1 -1
- package/components/radio/themes/light/radio.fluent.css.js +155 -66
- package/components/radio/themes/light/radio.fluent.css.js.map +1 -1
- package/components/radio/themes/light/radio.indigo.css.js +106 -56
- package/components/radio/themes/light/radio.indigo.css.js.map +1 -1
- package/components/radio/themes/light/radio.material.css.js +131 -16
- package/components/radio/themes/light/radio.material.css.js.map +1 -1
- package/components/radio-group/radio-group.base.css.js +4 -5
- package/components/radio-group/radio-group.base.css.js.map +1 -1
- package/components/radio-group/radio-group.js.map +1 -1
- package/components/rating/rating-symbol.base.css.js +4 -5
- package/components/rating/rating-symbol.base.css.js.map +1 -1
- package/components/rating/rating-symbol.js +2 -1
- package/components/rating/rating-symbol.js.map +1 -1
- package/components/rating/rating.base.css.js +4 -5
- package/components/rating/rating.base.css.js.map +1 -1
- package/components/rating/rating.js.map +1 -1
- package/components/ripple/ripple.js +2 -1
- package/components/ripple/ripple.js.map +1 -1
- package/components/ripple/ripple.material.css.js +4 -5
- package/components/ripple/ripple.material.css.js.map +1 -1
- package/components/select/select-group.js +2 -1
- package/components/select/select-group.js.map +1 -1
- package/components/select/select-header.js +2 -1
- package/components/select/select-header.js.map +1 -1
- package/components/select/select-item.js +2 -1
- package/components/select/select-item.js.map +1 -1
- package/components/select/select.d.ts +8 -0
- package/components/select/select.js +9 -4
- package/components/select/select.js.map +1 -1
- package/components/select/themes/light/select.base.css.js +4 -5
- package/components/select/themes/light/select.base.css.js.map +1 -1
- package/components/slider/range-slider.js +2 -1
- package/components/slider/range-slider.js.map +1 -1
- package/components/slider/slider-base.js.map +1 -1
- package/components/slider/slider-label.js +2 -1
- package/components/slider/slider-label.js.map +1 -1
- package/components/slider/slider.js +2 -1
- package/components/slider/slider.js.map +1 -1
- package/components/slider/themes/light/slider.base.css.js +4 -5
- package/components/slider/themes/light/slider.base.css.js.map +1 -1
- package/components/snackbar/snackbar.d.ts +5 -1
- package/components/snackbar/snackbar.js +19 -2
- package/components/snackbar/snackbar.js.map +1 -1
- package/components/snackbar/themes/light/snackbar.base.css.js +4 -5
- package/components/snackbar/themes/light/snackbar.base.css.js.map +1 -1
- package/components/stepper/step.js.map +1 -1
- package/components/stepper/stepper.d.ts +1 -1
- package/components/stepper/stepper.js +12 -3
- package/components/stepper/stepper.js.map +1 -1
- package/components/stepper/themes/step/light/step.base.css.js +7 -5
- package/components/stepper/themes/step/light/step.base.css.js.map +1 -1
- package/components/stepper/themes/stepper/stepper.base.css.js +13 -6
- package/components/stepper/themes/stepper/stepper.base.css.js.map +1 -1
- package/components/stepper/themes/stepper/stepper.bootstrap.css.js +4 -5
- package/components/stepper/themes/stepper/stepper.bootstrap.css.js.map +1 -1
- package/components/stepper/themes/stepper/stepper.fluent.css.js +4 -5
- package/components/stepper/themes/stepper/stepper.fluent.css.js.map +1 -1
- package/components/stepper/themes/stepper/stepper.indigo.css.js +4 -5
- package/components/stepper/themes/stepper/stepper.indigo.css.js.map +1 -1
- package/components/tabs/tab-panel.js +2 -1
- package/components/tabs/tab-panel.js.map +1 -1
- package/components/tabs/tab.js.map +1 -1
- package/components/tabs/tabs.js +1 -1
- package/components/tabs/tabs.js.map +1 -1
- package/components/tabs/themes/light/tab-panel.base.css.js +4 -5
- package/components/tabs/themes/light/tab-panel.base.css.js.map +1 -1
- package/components/tabs/themes/light/tab.base.css.js +4 -5
- package/components/tabs/themes/light/tab.base.css.js.map +1 -1
- package/components/tabs/themes/light/tabs.base.css.js +4 -5
- package/components/tabs/themes/light/tabs.base.css.js.map +1 -1
- package/components/toast/toast.d.ts +4 -1
- package/components/toast/toast.js +17 -2
- package/components/toast/toast.js.map +1 -1
- package/components/toggle/toggle.directive.d.ts +9 -3
- package/components/toggle/toggle.directive.js +54 -38
- package/components/toggle/toggle.directive.js.map +1 -1
- package/components/tree/themes/light/tree-item.base.css.js +4 -5
- package/components/tree/themes/light/tree-item.base.css.js.map +1 -1
- package/components/tree/themes/light/tree.base.css.js +4 -5
- package/components/tree/themes/light/tree.base.css.js.map +1 -1
- package/components/tree/tree-item.js.map +1 -1
- package/components/tree/tree.js.map +1 -1
- package/custom-elements.json +49 -32
- package/index.d.ts +1 -1
- package/index.js +1 -0
- package/index.js.map +1 -1
- package/package.json +6 -4
- package/themes/dark/bootstrap.css +320 -0
- package/themes/dark/fluent.css +303 -25
- package/themes/dark/indigo.css +307 -12
- package/themes/dark/material.css +329 -6
- package/themes/light/bootstrap.css +108 -0
- package/themes/light/fluent.css +108 -0
- package/themes/light/indigo.css +108 -0
- package/themes/light/material.css +108 -0
- package/vscode-html-custom-data.json +21 -32
- package/components/avatar/themes/avatar.base.css.js.map +0 -1
- package/components/avatar/themes/avatar.bootstrap.css.js.map +0 -1
- package/components/combo/utils/converters.d.ts +0 -3
- package/components/combo/utils/converters.js +0 -9
- package/components/combo/utils/converters.js.map +0 -1
- package/components/icon/icon.material.css.js.map +0 -1
- package/components/navbar/themes/light/navbar.base.css.js.map +0 -1
- /package/components/avatar/themes/{avatar.base.css.d.ts → dark/avatar.base.bootstrap.css.d.ts} +0 -0
- /package/components/avatar/themes/{avatar.bootstrap.css.d.ts → light/avatar.base.css.d.ts} +0 -0
- /package/components/{icon/icon.material.css.d.ts → avatar/themes/light/avatar.bootstrap.css.d.ts} +0 -0
- /package/components/{navbar/themes/light/navbar.base.css.d.ts → button/themes/button/dark/button.bootstrap.css.d.ts} +0 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"range-slider.js","sourceRoot":"","sources":["../../../src/components/slider/range-slider.ts"],"names":[],"mappings":"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","sourcesContent":["import { html } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { styleMap } from 'lit/directives/style-map.js';\nimport { Constructor } from '../common/mixins/constructor.js';\nimport { EventEmitterMixin } from '../common/mixins/event-emitter.js';\nimport { IgcSliderBaseComponent } from './slider-base.js';\n\n/* blazorSuppress */\nexport interface IgcRangeSliderValue {\n lower: number;\n upper: number;\n}\n\nexport interface IgcRangeSliderEventMap {\n /**\n * Emitted when a value is changed via thumb drag or keyboard interaction.\n */\n igcInput: CustomEvent<IgcRangeSliderValue>;\n /**\n * Emitted when a value change is committed on a thumb drag end or keyboard interaction.\n */\n igcChange: CustomEvent<IgcRangeSliderValue>;\n}\n\n/**\n * A range slider component used to select two numeric values within a range.\n *\n * @element igc-range-slider\n *\n * @fires igcInput - Emitted when a value is changed via thumb drag or keyboard interaction.\n * @fires igcChange - Emitted when a value change is committed on a thumb drag end or keyboard interaction.\n *\n * @csspart base - The base wrapper of the slider.\n * @csspart ticks - The ticks container.\n * @csspart tick-group - The tick group container.\n * @csspart tick - The tick element.\n * @csspart tick-label - The tick label element.\n * @csspart tick-label-inner - The inner element of the tick label.\n * @csspart thumbs - The thumbs container.\n * @csspart thumb - The thumb element.\n * @csspart thumb-label - The thumb tooltip label container.\n * @csspart thumb-label-inner - The thumb tooltip label inner element.\n * @csspart track - The track container.\n * @csspart steps - The track steps element.\n * @csspart inactive - The inactive element of the track.\n * @csspart fill - The filled part of the track.\n */\nexport default class IgcRangeSliderComponent extends EventEmitterMixin<\n IgcRangeSliderEventMap,\n Constructor<IgcSliderBaseComponent>\n>(IgcSliderBaseComponent) {\n public static readonly tagName = 'igc-range-slider';\n\n @query(`#thumbFrom`)\n private thumbFrom!: HTMLElement;\n\n @query(`#thumbTo`)\n private thumbTo!: HTMLElement;\n\n private _lower = 0;\n private _upper = 0;\n\n public set lower(val: number) {\n const oldVal = this._lower;\n this._lower = this.validateValue(val);\n this.requestUpdate('lower', oldVal);\n }\n\n /**\n * The current value of the lower thumb.\n * @attr\n */\n @property({ type: Number })\n public get lower() {\n return this._lower;\n }\n\n public set upper(val: number) {\n const oldVal = this._upper;\n this._upper = this.validateValue(val);\n this.requestUpdate('upper', oldVal);\n }\n\n /**\n * The current value of the upper thumb.\n * @attr\n */\n @property({ type: Number })\n public get upper() {\n return this._upper;\n }\n\n /**\n * The aria label of the lower thumb.\n * @attr aria-label-lower\n */\n @property({ attribute: 'aria-label-lower' })\n public ariaLabelLower!: string;\n\n /**\n * The aria label of the upper thumb.\n * @attr aria-label-upper\n */\n @property({ attribute: 'aria-label-upper' })\n public ariaLabelUpper!: string;\n\n protected override get activeValue(): number {\n return this.activeThumb === this.thumbFrom ? this.lower : this.upper;\n }\n\n protected override normalizeValue(): void {\n this._lower = this.validateValue(this._lower);\n this._upper = this.validateValue(this._upper);\n }\n\n protected override getTrackStyle() {\n const toPosition = this.valueToFraction(this.upper);\n const fromPosition = this.valueToFraction(this.lower);\n const positionGap = toPosition - fromPosition;\n\n const filledTrackStyle = {\n width: `${positionGap * 100}%`,\n insetInlineStart: `${fromPosition * 100}%`,\n };\n\n return filledTrackStyle;\n }\n\n private closestTo(goal: number, positions: number[]): number {\n return positions.reduce((previous, current) =>\n Math.abs(goal - current) < Math.abs(goal - previous) ? current : previous\n );\n }\n\n protected override closestHandle(event: PointerEvent): HTMLElement {\n const fromOffset =\n this.thumbFrom.offsetLeft + this.thumbFrom.offsetWidth / 2;\n const toOffset = this.thumbTo.offsetLeft + this.thumbTo.offsetWidth / 2;\n const xPointer = event.clientX - this.getBoundingClientRect().left;\n const match = this.closestTo(xPointer, [fromOffset, toOffset]);\n\n if (fromOffset === toOffset && toOffset < xPointer) {\n return this.thumbTo;\n } else if (fromOffset === toOffset && toOffset > xPointer) {\n return this.thumbFrom;\n } else if (match === fromOffset) {\n return this.thumbFrom;\n } else {\n return this.thumbTo;\n }\n }\n\n protected override updateValue(increment: number) {\n const oldValue = this.activeValue;\n\n let lower = this.lower;\n let upper = this.upper;\n\n if (this.activeThumb === this.thumbFrom) {\n lower += increment;\n } else {\n upper += increment;\n }\n\n if (lower >= upper) {\n this.swapValues(lower, upper);\n this.toggleActiveThumb();\n } else {\n if (this.activeThumb === this.thumbFrom) {\n this.lower = lower;\n } else {\n this.upper = upper;\n }\n }\n\n if (oldValue === this.activeValue) {\n return false;\n }\n\n this.emitInputEvent();\n return true;\n }\n\n protected override emitInputEvent() {\n this.emitEvent('igcInput', {\n detail: { lower: this.lower, upper: this.upper },\n });\n }\n\n protected override emitChangeEvent() {\n this.emitEvent('igcChange', {\n detail: { lower: this.lower, upper: this.upper },\n });\n }\n\n private swapValues(lower: number, upper: number) {\n this.lower = upper;\n this.upper = lower;\n }\n\n private toggleActiveThumb() {\n const thumb =\n this.activeThumb === this.thumbFrom ? this.thumbTo : this.thumbFrom;\n thumb.focus();\n }\n\n private handleFocus(ev: Event) {\n this.activeThumb = ev.target as HTMLElement;\n const thumbId = this.activeThumb?.id;\n const thumbs = this.shadowRoot?.querySelectorAll('div[part=\"thumb\"]');\n\n thumbs?.forEach((t) => {\n if (t.id !== thumbId) {\n const activeThumbVal = parseFloat(this.activeThumb!.ariaValueNow!);\n const thumbVal = parseFloat(t.ariaValueNow!);\n const rangeFrom = Math.min(activeThumbVal, thumbVal);\n const rangeTo = Math.max(activeThumbVal, thumbVal);\n\n this.activeThumb?.setAttribute(\n 'aria-valuetext',\n `${this.formatValue(rangeFrom)} - ${this.formatValue(rangeTo)}`\n );\n }\n });\n }\n\n protected override renderThumb(\n value: number,\n ariaLabel?: string,\n thumbId?: string\n ) {\n const percent = `${this.valueToFraction(value) * 100}%`;\n const ariaValueText =\n thumbId === 'thumbFrom' ? `min ${this.lower}` : `max ${this.upper}`;\n\n const textValue = this.labels\n ? this.labels[value]\n : this.valueFormat || this.valueFormatOptions\n ? this.formatValue(value)\n : ariaValueText;\n\n return html`\n <div\n part=\"thumb\"\n id=${ifDefined(thumbId)}\n tabindex=${this.disabled ? -1 : 0}\n style=${styleMap({ insetInlineStart: percent })}\n role=\"slider\"\n aria-valuemin=${this.actualMin}\n aria-valuemax=${this.actualMax}\n aria-valuenow=${value}\n aria-valuetext=${ifDefined(textValue)}\n aria-label=${ifDefined(ariaLabel)}\n aria-disabled=${this.disabled ? 'true' : 'false'}\n @pointerenter=${this.handleThumbPointerEnter}\n @pointerleave=${this.handleThumbPointerLeave}\n @focus=${(ev: Event) => this.handleFocus(ev)}\n @blur=${() => (\n this.activeThumb?.part.remove('focused'),\n (this.activeThumb = undefined)\n )}\n ></div>\n ${this.hideTooltip\n ? html``\n : html`\n <div\n part=\"thumb-label\"\n style=${styleMap({\n opacity: this.thumbLabelsVisible ? '1' : '0',\n insetInlineStart: percent,\n })}\n >\n <div part=\"thumb-label-inner\">\n ${this.labels ? this.labels[value] : this.formatValue(value)}\n </div>\n </div>\n `}\n `;\n }\n\n protected override renderThumbs() {\n return html`${this.renderThumb(\n this.lower,\n this.ariaLabelLower,\n 'thumbFrom'\n )}\n ${this.renderThumb(this.upper, this.ariaLabelUpper, 'thumbTo')}`;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-range-slider': IgcRangeSliderComponent;\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"range-slider.js","sourceRoot":"","sources":["../../../src/components/slider/range-slider.ts"],"names":[],"mappings":"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","sourcesContent":["import { html } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { styleMap } from 'lit/directives/style-map.js';\nimport { Constructor } from '../common/mixins/constructor.js';\nimport { EventEmitterMixin } from '../common/mixins/event-emitter.js';\nimport { IgcSliderBaseComponent } from './slider-base.js';\n\n/* blazorSuppress */\nexport interface IgcRangeSliderValue {\n lower: number;\n upper: number;\n}\n\nexport interface IgcRangeSliderEventMap {\n /**\n * Emitted when a value is changed via thumb drag or keyboard interaction.\n */\n igcInput: CustomEvent<IgcRangeSliderValue>;\n /**\n * Emitted when a value change is committed on a thumb drag end or keyboard interaction.\n */\n igcChange: CustomEvent<IgcRangeSliderValue>;\n}\n\n/**\n * A range slider component used to select two numeric values within a range.\n *\n * @element igc-range-slider\n *\n * @fires igcInput - Emitted when a value is changed via thumb drag or keyboard interaction.\n * @fires igcChange - Emitted when a value change is committed on a thumb drag end or keyboard interaction.\n *\n * @csspart base - The base wrapper of the slider.\n * @csspart ticks - The ticks container.\n * @csspart tick-group - The tick group container.\n * @csspart tick - The tick element.\n * @csspart tick-label - The tick label element.\n * @csspart tick-label-inner - The inner element of the tick label.\n * @csspart thumbs - The thumbs container.\n * @csspart thumb - The thumb element.\n * @csspart thumb-label - The thumb tooltip label container.\n * @csspart thumb-label-inner - The thumb tooltip label inner element.\n * @csspart track - The track container.\n * @csspart steps - The track steps element.\n * @csspart inactive - The inactive element of the track.\n * @csspart fill - The filled part of the track.\n */\nexport default class IgcRangeSliderComponent extends EventEmitterMixin<\n IgcRangeSliderEventMap,\n Constructor<IgcSliderBaseComponent>\n>(IgcSliderBaseComponent) {\n public static readonly tagName = 'igc-range-slider';\n\n @query(`#thumbFrom`)\n private thumbFrom!: HTMLElement;\n\n @query(`#thumbTo`)\n private thumbTo!: HTMLElement;\n\n private _lower = 0;\n private _upper = 0;\n\n public set lower(val: number) {\n const oldVal = this._lower;\n this._lower = this.validateValue(val);\n this.requestUpdate('lower', oldVal);\n }\n\n /**\n * The current value of the lower thumb.\n * @attr\n */\n @property({ type: Number })\n public get lower() {\n return this._lower;\n }\n\n public set upper(val: number) {\n const oldVal = this._upper;\n this._upper = this.validateValue(val);\n this.requestUpdate('upper', oldVal);\n }\n\n /**\n * The current value of the upper thumb.\n * @attr\n */\n @property({ type: Number })\n public get upper() {\n return this._upper;\n }\n\n /**\n * The aria label of the lower thumb.\n * @attr aria-label-lower\n */\n @property({ attribute: 'aria-label-lower' })\n public ariaLabelLower!: string;\n\n /**\n * The aria label of the upper thumb.\n * @attr aria-label-upper\n */\n @property({ attribute: 'aria-label-upper' })\n public ariaLabelUpper!: string;\n\n protected override get activeValue(): number {\n return this.activeThumb === this.thumbFrom ? this.lower : this.upper;\n }\n\n protected override normalizeValue(): void {\n this._lower = this.validateValue(this._lower);\n this._upper = this.validateValue(this._upper);\n }\n\n protected override getTrackStyle() {\n const toPosition = this.valueToFraction(this.upper);\n const fromPosition = this.valueToFraction(this.lower);\n const positionGap = toPosition - fromPosition;\n\n const filledTrackStyle = {\n width: `${positionGap * 100}%`,\n insetInlineStart: `${fromPosition * 100}%`,\n };\n\n return filledTrackStyle;\n }\n\n private closestTo(goal: number, positions: number[]): number {\n return positions.reduce((previous, current) =>\n Math.abs(goal - current) < Math.abs(goal - previous) ? current : previous\n );\n }\n\n protected override closestHandle(event: PointerEvent): HTMLElement {\n const fromOffset =\n this.thumbFrom.offsetLeft + this.thumbFrom.offsetWidth / 2;\n const toOffset = this.thumbTo.offsetLeft + this.thumbTo.offsetWidth / 2;\n const xPointer = event.clientX - this.getBoundingClientRect().left;\n const match = this.closestTo(xPointer, [fromOffset, toOffset]);\n\n if (fromOffset === toOffset && toOffset < xPointer) {\n return this.thumbTo;\n } else if (fromOffset === toOffset && toOffset > xPointer) {\n return this.thumbFrom;\n } else if (match === fromOffset) {\n return this.thumbFrom;\n } else {\n return this.thumbTo;\n }\n }\n\n protected override updateValue(increment: number) {\n const oldValue = this.activeValue;\n\n let lower = this.lower;\n let upper = this.upper;\n\n if (this.activeThumb === this.thumbFrom) {\n lower += increment;\n } else {\n upper += increment;\n }\n\n if (lower >= upper) {\n this.swapValues(lower, upper);\n this.toggleActiveThumb();\n } else {\n if (this.activeThumb === this.thumbFrom) {\n this.lower = lower;\n } else {\n this.upper = upper;\n }\n }\n\n if (oldValue === this.activeValue) {\n return false;\n }\n\n this.emitInputEvent();\n return true;\n }\n\n protected override emitInputEvent() {\n this.emitEvent('igcInput', {\n detail: { lower: this.lower, upper: this.upper },\n });\n }\n\n protected override emitChangeEvent() {\n this.emitEvent('igcChange', {\n detail: { lower: this.lower, upper: this.upper },\n });\n }\n\n private swapValues(lower: number, upper: number) {\n this.lower = upper;\n this.upper = lower;\n }\n\n private toggleActiveThumb() {\n const thumb =\n this.activeThumb === this.thumbFrom ? this.thumbTo : this.thumbFrom;\n thumb.focus();\n }\n\n private handleFocus(ev: Event) {\n this.activeThumb = ev.target as HTMLElement;\n const thumbId = this.activeThumb?.id;\n const thumbs = this.shadowRoot?.querySelectorAll('div[part=\"thumb\"]');\n\n thumbs?.forEach((t) => {\n if (t.id !== thumbId) {\n const activeThumbVal = parseFloat(this.activeThumb!.ariaValueNow!);\n const thumbVal = parseFloat(t.ariaValueNow!);\n const rangeFrom = Math.min(activeThumbVal, thumbVal);\n const rangeTo = Math.max(activeThumbVal, thumbVal);\n\n this.activeThumb?.setAttribute(\n 'aria-valuetext',\n `${this.formatValue(rangeFrom)} - ${this.formatValue(rangeTo)}`\n );\n }\n });\n }\n\n protected override renderThumb(\n value: number,\n ariaLabel?: string,\n thumbId?: string\n ) {\n const percent = `${this.valueToFraction(value) * 100}%`;\n const ariaValueText =\n thumbId === 'thumbFrom' ? `min ${this.lower}` : `max ${this.upper}`;\n\n const textValue = this.labels\n ? this.labels[value]\n : this.valueFormat || this.valueFormatOptions\n ? this.formatValue(value)\n : ariaValueText;\n\n return html`\n <div\n part=\"thumb\"\n id=${ifDefined(thumbId)}\n tabindex=${this.disabled ? -1 : 0}\n style=${styleMap({ insetInlineStart: percent })}\n role=\"slider\"\n aria-valuemin=${this.actualMin}\n aria-valuemax=${this.actualMax}\n aria-valuenow=${value}\n aria-valuetext=${ifDefined(textValue)}\n aria-label=${ifDefined(ariaLabel)}\n aria-disabled=${this.disabled ? 'true' : 'false'}\n @pointerenter=${this.handleThumbPointerEnter}\n @pointerleave=${this.handleThumbPointerLeave}\n @focus=${(ev: Event) => this.handleFocus(ev)}\n @blur=${() => (\n this.activeThumb?.part.remove('focused'),\n (this.activeThumb = undefined)\n )}\n ></div>\n ${this.hideTooltip\n ? html``\n : html`\n <div\n part=\"thumb-label\"\n style=${styleMap({\n opacity: this.thumbLabelsVisible ? '1' : '0',\n insetInlineStart: percent,\n })}\n >\n <div part=\"thumb-label-inner\">\n ${this.labels ? this.labels[value] : this.formatValue(value)}\n </div>\n </div>\n `}\n `;\n }\n\n protected override renderThumbs() {\n return html`${this.renderThumb(\n this.lower,\n this.ariaLabelLower,\n 'thumbFrom'\n )}\n ${this.renderThumb(this.upper, this.ariaLabelUpper, 'thumbTo')}`;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-range-slider': IgcRangeSliderComponent;\n }\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"slider-base.js","sourceRoot":"","sources":["../../../src/components/slider/slider-base.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement, TemplateResult } from 'lit';\nimport {\n property,\n query,\n queryAssignedElements,\n state,\n} from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { StyleInfo, styleMap } from 'lit/directives/style-map.js';\nimport { themes } from '../../theming/theming-decorator.js';\nimport { blazorTypeOverride } from '../common/decorators/blazorTypeOverride.js';\nimport { watch } from '../common/decorators/watch.js';\nimport { styles } from './themes/light/slider.base.css.js';\nimport { styles as bootstrap } from './themes/light/slider.bootstrap.css.js';\nimport { styles as fluent } from './themes/light/slider.fluent.css.js';\nimport { styles as indigo } from './themes/light/slider.indigo.css.js';\nimport { styles as material } from './themes/light/slider.material.css.js';\n\nimport { defineComponents } from '../common/definitions/defineComponents.js';\nimport IgcSliderLabelComponent from './slider-label.js';\nimport { blazorDeepImport } from '../common/decorators/blazorDeepImport.js';\nimport { isLTR } from '../common/util.js';\n\ndefineComponents(IgcSliderLabelComponent);\n\n@themes({ material, bootstrap, fluent, indigo })\n@blazorDeepImport\nexport class IgcSliderBaseComponent extends LitElement {\n public static override styles = styles;\n\n @query(`[part~='thumb']`)\n protected thumb!: HTMLElement;\n\n @queryAssignedElements({ selector: 'igc-slider-label' })\n private labelElements!: HTMLElement[];\n\n private _lowerBound?: number;\n private _upperBound?: number;\n private _min = 0;\n private _max = 100;\n private _step = 1;\n private startValue?: number;\n private pointerCaptured = false;\n private thumbHoverTimer: any;\n protected activeThumb?: HTMLElement;\n\n @state()\n protected thumbLabelsVisible = false;\n\n @state()\n protected labels?: string[];\n\n public set min(value: number) {\n if (value < this.max) {\n const oldVal = this._min;\n this._min = this.labels ? 0 : value;\n this.requestUpdate('min', oldVal);\n\n if (typeof this.lowerBound === 'number' && this.lowerBound < value) {\n this.lowerBound = value;\n }\n }\n }\n\n /**\n * The minimum value of the slider scale. Defaults to 0.\n * @attr\n */\n @property({ type: Number })\n public get min() {\n return this._min;\n }\n\n public set max(value: number) {\n if (value > this.min) {\n const oldVal = this._max;\n this._max = this.labels ? this.labels.length - 1 : value;\n this.requestUpdate('max', oldVal);\n\n if (typeof this.upperBound === 'number' && this.upperBound > value) {\n this.upperBound = value;\n }\n }\n }\n\n /**\n * The maximum value of the slider scale. Defaults to 100.\n * @attr\n */\n @property({ type: Number })\n public get max() {\n return this._max;\n }\n\n public set lowerBound(value: number | undefined) {\n const oldVal = this._lowerBound;\n\n if (typeof value === 'number') {\n this._lowerBound = this.valueInRange(value, this.min, this.actualMax);\n } else {\n this._lowerBound = value;\n }\n this.requestUpdate('lowerBound', oldVal);\n }\n\n /**\n * The lower bound of the slider value. If not set, the `min` value is applied.\n * @attr lower-bound\n */\n @property({ type: Number, attribute: 'lower-bound' })\n public get lowerBound(): number | undefined {\n return this._lowerBound;\n }\n\n public set upperBound(value: number | undefined) {\n const oldVal = this._upperBound;\n\n if (typeof value === 'number') {\n this._upperBound = this.valueInRange(value, this.actualMin, this.max);\n } else {\n this._upperBound = value;\n }\n this.requestUpdate('upperBound', oldVal);\n }\n\n /**\n * The upper bound of the slider value. If not set, the `max` value is applied.\n * @attr upper-bound\n */\n @property({ type: Number, attribute: 'upper-bound' })\n public get upperBound(): number | undefined {\n return this._upperBound;\n }\n\n /**\n * Disables the UI interactions of the slider.\n * @attr\n */\n @property({ type: Boolean, reflect: true })\n public disabled = false;\n\n /**\n * Marks the slider track as discrete so it displays the steps.\n * If the `step` is 0, the slider will remain continuos even if `discreteTrack` is `true`.\n * @attr discrete-track\n */\n @property({ type: Boolean, attribute: 'discrete-track' })\n public discreteTrack = false;\n\n /**\n * Hides the thumb tooltip.\n * @attr hide-tooltip\n */\n @property({ type: Boolean, attribute: 'hide-tooltip' })\n public hideTooltip = false;\n\n public set step(value: number) {\n const oldVal = this._step;\n this._step = this.labels ? 1 : value;\n this.requestUpdate('step', oldVal);\n }\n\n /**\n * Specifies the granularity that the value must adhere to.\n * If set to 0 no stepping is implied and any value in the range is allowed.\n * @attr\n */\n @property({ type: Number })\n public get step() {\n return this._step;\n }\n\n /**\n * The number of primary ticks. It defaults to 0 which means no primary ticks are displayed.\n * @attr primary-ticks\n */\n @property({ type: Number, attribute: 'primary-ticks' })\n public primaryTicks = 0;\n\n /**\n * The number of secondary ticks. It defaults to 0 which means no secondary ticks are displayed.\n * @attr secondary-ticks\n */\n @property({ type: Number, attribute: 'secondary-ticks' })\n public secondaryTicks = 0;\n\n /**\n * Changes the orientation of the ticks.\n * @attr tick-orientation\n */\n @property({ attribute: 'tick-orientation' })\n public tickOrientation: 'mirror' | 'start' | 'end' = 'end';\n\n /**\n * Hides the primary tick labels.\n * @attr hide-primary-labels\n */\n @property({ type: Boolean, attribute: 'hide-primary-labels' })\n public hidePrimaryLabels = false;\n\n /**\n * Hides the secondary tick labels.\n * @attr hide-secondary-labels\n */\n @property({ type: Boolean, attribute: 'hide-secondary-labels' })\n public hideSecondaryLabels = false;\n\n /**\n * The locale used to format the thumb and tick label values in the slider.\n * @attr\n */\n @property()\n public locale = 'en';\n\n /**\n * String format used for the thumb and tick label values in the slider.\n * @attr value-format\n */\n @property({ attribute: 'value-format' })\n public valueFormat?: string;\n\n /**\n * Number format options used for the thumb and tick label values in the slider.\n */\n /* blazorSuppress */\n @property({ attribute: false })\n public valueFormatOptions?: Intl.NumberFormatOptions;\n\n /**\n * The degrees for the rotation of the tick labels. Defaults to 0.\n * @attr tick-label-rotation\n */\n @property({ type: Number, reflect: true, attribute: 'tick-label-rotation' })\n @blazorTypeOverride('TickLabelRotation', true)\n public tickLabelRotation: 0 | 90 | -90 = 0;\n\n @watch('min', { waitUntilFirstUpdate: true })\n @watch('max', { waitUntilFirstUpdate: true })\n @watch('lowerBound', { waitUntilFirstUpdate: true })\n @watch('upperBound', { waitUntilFirstUpdate: true })\n @watch('step', { waitUntilFirstUpdate: true })\n protected constraintsChange() {\n this.normalizeValue();\n }\n\n @watch('labels')\n protected labelsChange() {\n if (this.labels) {\n this.min = 0;\n this.max = this.labels.length - 1;\n this.step = 1;\n }\n }\n\n constructor() {\n super();\n this.addEventListener('pointerdown', this.pointerDown);\n this.addEventListener('pointermove', this.pointerMove);\n this.addEventListener('lostpointercapture', this.lostPointerCapture);\n this.addEventListener('keydown', this.handleKeydown);\n }\n\n public override connectedCallback() {\n super.connectedCallback();\n this.normalizeValue();\n this.addEventListener('keyup', this.handleKeyUp);\n }\n\n public override disconnectedCallback() {\n this.removeEventListener('keyup', this.handleKeyUp);\n super.disconnectedCallback();\n }\n\n protected handleKeyUp() {\n this.activeThumb?.part.add('focused');\n }\n\n protected handleSlotChange() {\n this.labels =\n this.labelElements && this.labelElements.length\n ? this.labelElements.map((e) => e.textContent as string)\n : undefined;\n }\n\n /* c8 ignore next 3 */\n protected get activeValue() {\n return 0;\n }\n\n /* c8 ignore next */\n protected normalizeValue(): void {}\n\n /* c8 ignore next 3 */\n protected getTrackStyle(): StyleInfo {\n return {};\n }\n\n /* c8 ignore next 3 */\n protected updateValue(_increment: number): boolean {\n return false;\n }\n\n /* c8 ignore next 3 */\n protected renderThumbs(): TemplateResult<1> {\n return html``;\n }\n\n /* c8 ignore next */\n protected emitInputEvent() {}\n\n /* c8 ignore next */\n protected emitChangeEvent() {}\n\n protected get actualMin(): number {\n return typeof this.lowerBound === 'number'\n ? (this.lowerBound as number)\n : this.min;\n }\n\n protected get actualMax(): number {\n return typeof this.upperBound === 'number'\n ? (this.upperBound as number)\n : this.max;\n }\n\n protected validateValue(value: number) {\n value = this.valueInRange(value, this.actualMin, this.actualMax);\n value = this.normalizeByStep(value);\n\n return value;\n }\n\n protected formatValue(value: number) {\n return this.valueFormat\n ? this.valueFormat.replace(\n '{0}',\n value.toLocaleString(this.locale, this.valueFormatOptions)\n )\n : value.toLocaleString(this.locale, this.valueFormatOptions);\n }\n\n private normalizeByStep(value: number) {\n return this.step ? value - ((value - this.actualMin) % this.step) : value;\n }\n\n protected closestHandle(_event: PointerEvent): HTMLElement {\n return this.thumb;\n }\n\n private totalTickCount() {\n const primaryTicks = this.labels\n ? this.primaryTicks > 0\n ? this.labels.length\n : 0\n : this.primaryTicks === 1\n ? 2\n : this.primaryTicks;\n\n return primaryTicks > 0\n ? (primaryTicks - 1) * this.secondaryTicks + primaryTicks\n : this.secondaryTicks > 0\n ? this.secondaryTicks\n : 0;\n }\n\n private tickValue(idx: number) {\n const tickCount = this.totalTickCount();\n const labelStep =\n tickCount > 1\n ? (this.max - this.min) / (tickCount - 1)\n : this.max - this.min;\n const labelVal = labelStep * idx;\n\n return this.min + labelVal;\n }\n\n private isPrimary(idx: number) {\n return this.primaryTicks <= 0\n ? false\n : idx % (this.secondaryTicks + 1) === 0;\n }\n\n private showThumbLabels() {\n if (this.disabled || this.hideTooltip) {\n return;\n }\n\n if (this.thumbHoverTimer) {\n clearTimeout(this.thumbHoverTimer);\n this.thumbHoverTimer = null;\n }\n\n this.thumbLabelsVisible = true;\n }\n\n private hideThumbLabels() {\n if (this.pointerCaptured || !this.thumbLabelsVisible) {\n return;\n }\n\n this.thumbHoverTimer = setTimeout(() => {\n this.thumbLabelsVisible = false;\n }, 750);\n }\n\n private valueInRange(value: number, min = 0, max = 100) {\n return Math.max(Math.min(value, max), min);\n }\n\n protected valueToFraction(value: number) {\n return (value - this.min) / (this.max - this.min);\n }\n\n private calculateTrackUpdate(mouseX: number): number {\n if (!this.activeThumb) {\n return 0;\n }\n\n const thumbBoundaries = this.activeThumb.getBoundingClientRect();\n const thumbCenter = (thumbBoundaries.right - thumbBoundaries.left) / 2;\n const thumbPositionX = thumbBoundaries.left + thumbCenter;\n\n const scale = this.getBoundingClientRect().width / (this.max - this.min);\n const change = isLTR(this)\n ? mouseX - thumbPositionX\n : thumbPositionX - mouseX;\n\n if (this.step) {\n const stepDistance = scale * this.step;\n const stepDistanceCenter = stepDistance / 2;\n\n // If the thumb scale range (slider update) is less than a half step,\n // the position stays the same.\n const scaleXPositive = Math.abs(change);\n if (scaleXPositive < stepDistanceCenter) {\n return 0;\n }\n\n return Math.round(change / stepDistance) * this.step;\n } else {\n return change / scale;\n }\n }\n\n private updateSlider(mouseX: number) {\n if (this.disabled) {\n return;\n }\n\n const increment = this.calculateTrackUpdate(mouseX);\n if (this.activeThumb && increment !== 0) {\n this.updateValue(increment);\n }\n }\n\n private pointerDown = (event: PointerEvent) => {\n const thumb = this.closestHandle(event);\n thumb.focus();\n\n this.startValue = this.activeValue;\n this.updateSlider(event.clientX);\n\n this.setPointerCapture(event.pointerId);\n this.pointerCaptured = true;\n this.showThumbLabels();\n event.preventDefault();\n this.activeThumb?.part.remove('focused');\n };\n\n private pointerMove = (event: PointerEvent) => {\n if (this.pointerCaptured) {\n this.updateSlider(event.clientX);\n }\n };\n\n private lostPointerCapture = () => {\n this.pointerCaptured = false;\n this.hideThumbLabels();\n\n if (this.startValue! !== this.activeValue) {\n this.emitChangeEvent();\n }\n this.startValue = undefined;\n };\n\n private handleKeydown = (event: KeyboardEvent) => {\n if (this.disabled) {\n return;\n }\n\n const { key } = event;\n\n let increment = 0;\n const value = this.activeValue;\n const step = this.step ? this.step : 1;\n const ltr = isLTR(this);\n\n switch (key) {\n case 'ArrowLeft':\n increment += ltr ? -step : step;\n break;\n case 'ArrowRight':\n increment += ltr ? step : -step;\n break;\n case 'ArrowUp':\n increment = step;\n break;\n case 'ArrowDown':\n increment = -step;\n break;\n case 'Home':\n increment = this.actualMin - value;\n break;\n case 'End':\n increment = this.actualMax - value;\n break;\n case 'PageUp':\n increment = Math.max((this.actualMax - this.actualMin) / 10, step);\n break;\n case 'PageDown':\n increment = -Math.max((this.actualMax - this.actualMin) / 10, step);\n break;\n default:\n return;\n }\n\n if (increment) {\n const updated = this.updateValue(increment);\n this.showThumbLabels();\n this.hideThumbLabels();\n\n if (updated) {\n this.emitChangeEvent();\n }\n }\n };\n\n protected handleThumbPointerEnter = () => {\n this.showThumbLabels();\n };\n\n protected handleThumbPointerLeave = () => {\n this.hideThumbLabels();\n };\n\n protected renderTicks() {\n const groups = [];\n for (let i = 0, totalCount = this.totalTickCount(); i < totalCount; i++) {\n const isPrimary = this.isPrimary(i);\n groups.push(html`\n <div part=\"tick-group\">\n <div part=\"tick\" data-primary=${isPrimary}>\n ${(isPrimary ? this.hidePrimaryLabels : this.hideSecondaryLabels)\n ? html``\n : html`\n <div part=\"tick-label\">\n <span part=\"tick-label-inner\">\n ${this.labels\n ? isPrimary\n ? this.labels[\n Math.round(i / (this.secondaryTicks + 1))\n ]\n : ''\n : this.formatValue(this.tickValue(i))}\n </span>\n </div>\n `}\n </div>\n </div>\n `);\n }\n return groups;\n }\n\n protected renderThumb(value: number, ariaLabel?: string, thumbId?: string) {\n const percent = `${this.valueToFraction(value) * 100}%`;\n\n return html`\n <div\n part=\"thumb\"\n id=${ifDefined(thumbId)}\n tabindex=${this.disabled ? -1 : 0}\n style=${styleMap({ insetInlineStart: percent })}\n role=\"slider\"\n aria-valuemin=${this.actualMin}\n aria-valuemax=${this.actualMax}\n aria-valuenow=${value}\n aria-valuetext=${ifDefined(\n this.labels\n ? this.labels[value]\n : this.valueFormat || this.valueFormatOptions\n ? this.formatValue(value)\n : undefined\n )}\n aria-label=${ifDefined(ariaLabel)}\n aria-disabled=${this.disabled ? 'true' : 'false'}\n @pointerenter=${this.handleThumbPointerEnter}\n @pointerleave=${this.handleThumbPointerLeave}\n @focus=${(ev: Event) => (this.activeThumb = ev.target as HTMLElement)}\n @blur=${() => (\n this.activeThumb?.part.remove('focused'),\n (this.activeThumb = undefined)\n )}\n ></div>\n ${this.hideTooltip\n ? html``\n : html`\n <div\n part=\"thumb-label\"\n style=${styleMap({\n opacity: this.thumbLabelsVisible ? '1' : '0',\n insetInlineStart: percent,\n })}\n >\n <div part=\"thumb-label-inner\">\n ${this.labels ? this.labels[value] : this.formatValue(value)}\n </div>\n </div>\n `}\n `;\n }\n\n private renderSteps() {\n if (!this.discreteTrack || !this.step) {\n return html``;\n }\n\n const trackRange = this.max - this.min;\n const interval = ((100 / (trackRange / this.step)) * 10) / 10;\n\n return html`\n <div part=\"steps\">\n <svg width=\"100%\" height=\"100%\" style=\"display: flex\">\n <line\n x1=\"0\"\n y1=\"1\"\n x2=\"100%\"\n y2=\"1\"\n stroke=\"currentColor\"\n stroke-dasharray=\"0, calc(${interval * Math.sqrt(2)}%)\"\n stroke-linecap=\"round\"\n stroke-width=\"2px\"\n ></line>\n </svg>\n </div>\n `;\n }\n\n protected override render() {\n return html`\n <div part=\"base\">\n ${this.tickOrientation === 'mirror' || this.tickOrientation === 'start'\n ? html`<div part=\"ticks\">${this.renderTicks()}</div>`\n : html``}\n <div part=\"track\">\n <div part=\"inactive\"></div>\n <div part=\"fill\" style=${styleMap(this.getTrackStyle())}></div>\n ${this.renderSteps()}\n </div>\n ${this.tickOrientation !== 'start'\n ? html`<div part=\"ticks\">${this.renderTicks()}</div>`\n : html``}\n <div part=\"thumbs\">${this.renderThumbs()}</div>\n <slot @slotchange=${this.handleSlotChange}></slot>\n </div>\n `;\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"slider-base.js","sourceRoot":"","sources":["../../../src/components/slider/slider-base.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement, TemplateResult } from 'lit';\nimport {\n property,\n query,\n queryAssignedElements,\n state,\n} from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { StyleInfo, styleMap } from 'lit/directives/style-map.js';\nimport { themes } from '../../theming/theming-decorator.js';\nimport { blazorTypeOverride } from '../common/decorators/blazorTypeOverride.js';\nimport { watch } from '../common/decorators/watch.js';\nimport { styles } from './themes/light/slider.base.css.js';\nimport { styles as bootstrap } from './themes/light/slider.bootstrap.css.js';\nimport { styles as fluent } from './themes/light/slider.fluent.css.js';\nimport { styles as indigo } from './themes/light/slider.indigo.css.js';\nimport { styles as material } from './themes/light/slider.material.css.js';\n\nimport { defineComponents } from '../common/definitions/defineComponents.js';\nimport IgcSliderLabelComponent from './slider-label.js';\nimport { blazorDeepImport } from '../common/decorators/blazorDeepImport.js';\nimport { isLTR } from '../common/util.js';\n\ndefineComponents(IgcSliderLabelComponent);\n\n@themes({ material, bootstrap, fluent, indigo })\n@blazorDeepImport\nexport class IgcSliderBaseComponent extends LitElement {\n public static override styles = styles;\n\n @query(`[part~='thumb']`)\n protected thumb!: HTMLElement;\n\n @queryAssignedElements({ selector: 'igc-slider-label' })\n private labelElements!: HTMLElement[];\n\n private _lowerBound?: number;\n private _upperBound?: number;\n private _min = 0;\n private _max = 100;\n private _step = 1;\n private startValue?: number;\n private pointerCaptured = false;\n private thumbHoverTimer: any;\n protected activeThumb?: HTMLElement;\n\n @state()\n protected thumbLabelsVisible = false;\n\n @state()\n protected labels?: string[];\n\n public set min(value: number) {\n if (value < this.max) {\n const oldVal = this._min;\n this._min = this.labels ? 0 : value;\n this.requestUpdate('min', oldVal);\n\n if (typeof this.lowerBound === 'number' && this.lowerBound < value) {\n this.lowerBound = value;\n }\n }\n }\n\n /**\n * The minimum value of the slider scale. Defaults to 0.\n * @attr\n */\n @property({ type: Number })\n public get min() {\n return this._min;\n }\n\n public set max(value: number) {\n if (value > this.min) {\n const oldVal = this._max;\n this._max = this.labels ? this.labels.length - 1 : value;\n this.requestUpdate('max', oldVal);\n\n if (typeof this.upperBound === 'number' && this.upperBound > value) {\n this.upperBound = value;\n }\n }\n }\n\n /**\n * The maximum value of the slider scale. Defaults to 100.\n * @attr\n */\n @property({ type: Number })\n public get max() {\n return this._max;\n }\n\n public set lowerBound(value: number | undefined) {\n const oldVal = this._lowerBound;\n\n if (typeof value === 'number') {\n this._lowerBound = this.valueInRange(value, this.min, this.actualMax);\n } else {\n this._lowerBound = value;\n }\n this.requestUpdate('lowerBound', oldVal);\n }\n\n /**\n * The lower bound of the slider value. If not set, the `min` value is applied.\n * @attr lower-bound\n */\n @property({ type: Number, attribute: 'lower-bound' })\n public get lowerBound(): number | undefined {\n return this._lowerBound;\n }\n\n public set upperBound(value: number | undefined) {\n const oldVal = this._upperBound;\n\n if (typeof value === 'number') {\n this._upperBound = this.valueInRange(value, this.actualMin, this.max);\n } else {\n this._upperBound = value;\n }\n this.requestUpdate('upperBound', oldVal);\n }\n\n /**\n * The upper bound of the slider value. If not set, the `max` value is applied.\n * @attr upper-bound\n */\n @property({ type: Number, attribute: 'upper-bound' })\n public get upperBound(): number | undefined {\n return this._upperBound;\n }\n\n /**\n * Disables the UI interactions of the slider.\n * @attr\n */\n @property({ type: Boolean, reflect: true })\n public disabled = false;\n\n /**\n * Marks the slider track as discrete so it displays the steps.\n * If the `step` is 0, the slider will remain continuos even if `discreteTrack` is `true`.\n * @attr discrete-track\n */\n @property({ type: Boolean, attribute: 'discrete-track' })\n public discreteTrack = false;\n\n /**\n * Hides the thumb tooltip.\n * @attr hide-tooltip\n */\n @property({ type: Boolean, attribute: 'hide-tooltip' })\n public hideTooltip = false;\n\n public set step(value: number) {\n const oldVal = this._step;\n this._step = this.labels ? 1 : value;\n this.requestUpdate('step', oldVal);\n }\n\n /**\n * Specifies the granularity that the value must adhere to.\n * If set to 0 no stepping is implied and any value in the range is allowed.\n * @attr\n */\n @property({ type: Number })\n public get step() {\n return this._step;\n }\n\n /**\n * The number of primary ticks. It defaults to 0 which means no primary ticks are displayed.\n * @attr primary-ticks\n */\n @property({ type: Number, attribute: 'primary-ticks' })\n public primaryTicks = 0;\n\n /**\n * The number of secondary ticks. It defaults to 0 which means no secondary ticks are displayed.\n * @attr secondary-ticks\n */\n @property({ type: Number, attribute: 'secondary-ticks' })\n public secondaryTicks = 0;\n\n /**\n * Changes the orientation of the ticks.\n * @attr tick-orientation\n */\n @property({ attribute: 'tick-orientation' })\n public tickOrientation: 'mirror' | 'start' | 'end' = 'end';\n\n /**\n * Hides the primary tick labels.\n * @attr hide-primary-labels\n */\n @property({ type: Boolean, attribute: 'hide-primary-labels' })\n public hidePrimaryLabels = false;\n\n /**\n * Hides the secondary tick labels.\n * @attr hide-secondary-labels\n */\n @property({ type: Boolean, attribute: 'hide-secondary-labels' })\n public hideSecondaryLabels = false;\n\n /**\n * The locale used to format the thumb and tick label values in the slider.\n * @attr\n */\n @property()\n public locale = 'en';\n\n /**\n * String format used for the thumb and tick label values in the slider.\n * @attr value-format\n */\n @property({ attribute: 'value-format' })\n public valueFormat?: string;\n\n /**\n * Number format options used for the thumb and tick label values in the slider.\n */\n /* blazorSuppress */\n @property({ attribute: false })\n public valueFormatOptions?: Intl.NumberFormatOptions;\n\n /**\n * The degrees for the rotation of the tick labels. Defaults to 0.\n * @attr tick-label-rotation\n */\n @property({ type: Number, reflect: true, attribute: 'tick-label-rotation' })\n @blazorTypeOverride('TickLabelRotation', true)\n public tickLabelRotation: 0 | 90 | -90 = 0;\n\n @watch('min', { waitUntilFirstUpdate: true })\n @watch('max', { waitUntilFirstUpdate: true })\n @watch('lowerBound', { waitUntilFirstUpdate: true })\n @watch('upperBound', { waitUntilFirstUpdate: true })\n @watch('step', { waitUntilFirstUpdate: true })\n protected constraintsChange() {\n this.normalizeValue();\n }\n\n @watch('labels')\n protected labelsChange() {\n if (this.labels) {\n this.min = 0;\n this.max = this.labels.length - 1;\n this.step = 1;\n }\n }\n\n constructor() {\n super();\n this.addEventListener('pointerdown', this.pointerDown);\n this.addEventListener('pointermove', this.pointerMove);\n this.addEventListener('lostpointercapture', this.lostPointerCapture);\n this.addEventListener('keydown', this.handleKeydown);\n }\n\n public override connectedCallback() {\n super.connectedCallback();\n this.normalizeValue();\n this.addEventListener('keyup', this.handleKeyUp);\n }\n\n public override disconnectedCallback() {\n this.removeEventListener('keyup', this.handleKeyUp);\n super.disconnectedCallback();\n }\n\n protected handleKeyUp() {\n this.activeThumb?.part.add('focused');\n }\n\n protected handleSlotChange() {\n this.labels =\n this.labelElements && this.labelElements.length\n ? this.labelElements.map((e) => e.textContent as string)\n : undefined;\n }\n\n /* c8 ignore next 3 */\n protected get activeValue() {\n return 0;\n }\n\n /* c8 ignore next */\n protected normalizeValue(): void {}\n\n /* c8 ignore next 3 */\n protected getTrackStyle(): StyleInfo {\n return {};\n }\n\n /* c8 ignore next 3 */\n protected updateValue(_increment: number): boolean {\n return false;\n }\n\n /* c8 ignore next 3 */\n protected renderThumbs(): TemplateResult<1> {\n return html``;\n }\n\n /* c8 ignore next */\n protected emitInputEvent() {}\n\n /* c8 ignore next */\n protected emitChangeEvent() {}\n\n protected get actualMin(): number {\n return typeof this.lowerBound === 'number'\n ? (this.lowerBound as number)\n : this.min;\n }\n\n protected get actualMax(): number {\n return typeof this.upperBound === 'number'\n ? (this.upperBound as number)\n : this.max;\n }\n\n protected validateValue(value: number) {\n value = this.valueInRange(value, this.actualMin, this.actualMax);\n value = this.normalizeByStep(value);\n\n return value;\n }\n\n protected formatValue(value: number) {\n return this.valueFormat\n ? this.valueFormat.replace(\n '{0}',\n value.toLocaleString(this.locale, this.valueFormatOptions)\n )\n : value.toLocaleString(this.locale, this.valueFormatOptions);\n }\n\n private normalizeByStep(value: number) {\n return this.step ? value - ((value - this.actualMin) % this.step) : value;\n }\n\n protected closestHandle(_event: PointerEvent): HTMLElement {\n return this.thumb;\n }\n\n private totalTickCount() {\n const primaryTicks = this.labels\n ? this.primaryTicks > 0\n ? this.labels.length\n : 0\n : this.primaryTicks === 1\n ? 2\n : this.primaryTicks;\n\n return primaryTicks > 0\n ? (primaryTicks - 1) * this.secondaryTicks + primaryTicks\n : this.secondaryTicks > 0\n ? this.secondaryTicks\n : 0;\n }\n\n private tickValue(idx: number) {\n const tickCount = this.totalTickCount();\n const labelStep =\n tickCount > 1\n ? (this.max - this.min) / (tickCount - 1)\n : this.max - this.min;\n const labelVal = labelStep * idx;\n\n return this.min + labelVal;\n }\n\n private isPrimary(idx: number) {\n return this.primaryTicks <= 0\n ? false\n : idx % (this.secondaryTicks + 1) === 0;\n }\n\n private showThumbLabels() {\n if (this.disabled || this.hideTooltip) {\n return;\n }\n\n if (this.thumbHoverTimer) {\n clearTimeout(this.thumbHoverTimer);\n this.thumbHoverTimer = null;\n }\n\n this.thumbLabelsVisible = true;\n }\n\n private hideThumbLabels() {\n if (this.pointerCaptured || !this.thumbLabelsVisible) {\n return;\n }\n\n this.thumbHoverTimer = setTimeout(() => {\n this.thumbLabelsVisible = false;\n }, 750);\n }\n\n private valueInRange(value: number, min = 0, max = 100) {\n return Math.max(Math.min(value, max), min);\n }\n\n protected valueToFraction(value: number) {\n return (value - this.min) / (this.max - this.min);\n }\n\n private calculateTrackUpdate(mouseX: number): number {\n if (!this.activeThumb) {\n return 0;\n }\n\n const thumbBoundaries = this.activeThumb.getBoundingClientRect();\n const thumbCenter = (thumbBoundaries.right - thumbBoundaries.left) / 2;\n const thumbPositionX = thumbBoundaries.left + thumbCenter;\n\n const scale = this.getBoundingClientRect().width / (this.max - this.min);\n const change = isLTR(this)\n ? mouseX - thumbPositionX\n : thumbPositionX - mouseX;\n\n if (this.step) {\n const stepDistance = scale * this.step;\n const stepDistanceCenter = stepDistance / 2;\n\n // If the thumb scale range (slider update) is less than a half step,\n // the position stays the same.\n const scaleXPositive = Math.abs(change);\n if (scaleXPositive < stepDistanceCenter) {\n return 0;\n }\n\n return Math.round(change / stepDistance) * this.step;\n } else {\n return change / scale;\n }\n }\n\n private updateSlider(mouseX: number) {\n if (this.disabled) {\n return;\n }\n\n const increment = this.calculateTrackUpdate(mouseX);\n if (this.activeThumb && increment !== 0) {\n this.updateValue(increment);\n }\n }\n\n private pointerDown = (event: PointerEvent) => {\n const thumb = this.closestHandle(event);\n thumb.focus();\n\n this.startValue = this.activeValue;\n this.updateSlider(event.clientX);\n\n this.setPointerCapture(event.pointerId);\n this.pointerCaptured = true;\n this.showThumbLabels();\n event.preventDefault();\n this.activeThumb?.part.remove('focused');\n };\n\n private pointerMove = (event: PointerEvent) => {\n if (this.pointerCaptured) {\n this.updateSlider(event.clientX);\n }\n };\n\n private lostPointerCapture = () => {\n this.pointerCaptured = false;\n this.hideThumbLabels();\n\n if (this.startValue! !== this.activeValue) {\n this.emitChangeEvent();\n }\n this.startValue = undefined;\n };\n\n private handleKeydown = (event: KeyboardEvent) => {\n if (this.disabled) {\n return;\n }\n\n const { key } = event;\n\n let increment = 0;\n const value = this.activeValue;\n const step = this.step ? this.step : 1;\n const ltr = isLTR(this);\n\n switch (key) {\n case 'ArrowLeft':\n increment += ltr ? -step : step;\n break;\n case 'ArrowRight':\n increment += ltr ? step : -step;\n break;\n case 'ArrowUp':\n increment = step;\n break;\n case 'ArrowDown':\n increment = -step;\n break;\n case 'Home':\n increment = this.actualMin - value;\n break;\n case 'End':\n increment = this.actualMax - value;\n break;\n case 'PageUp':\n increment = Math.max((this.actualMax - this.actualMin) / 10, step);\n break;\n case 'PageDown':\n increment = -Math.max((this.actualMax - this.actualMin) / 10, step);\n break;\n default:\n return;\n }\n\n if (increment) {\n const updated = this.updateValue(increment);\n this.showThumbLabels();\n this.hideThumbLabels();\n\n if (updated) {\n this.emitChangeEvent();\n }\n }\n };\n\n protected handleThumbPointerEnter = () => {\n this.showThumbLabels();\n };\n\n protected handleThumbPointerLeave = () => {\n this.hideThumbLabels();\n };\n\n protected renderTicks() {\n const groups = [];\n for (let i = 0, totalCount = this.totalTickCount(); i < totalCount; i++) {\n const isPrimary = this.isPrimary(i);\n groups.push(html`\n <div part=\"tick-group\">\n <div part=\"tick\" data-primary=${isPrimary}>\n ${(isPrimary ? this.hidePrimaryLabels : this.hideSecondaryLabels)\n ? html``\n : html`\n <div part=\"tick-label\">\n <span part=\"tick-label-inner\">\n ${this.labels\n ? isPrimary\n ? this.labels[\n Math.round(i / (this.secondaryTicks + 1))\n ]\n : ''\n : this.formatValue(this.tickValue(i))}\n </span>\n </div>\n `}\n </div>\n </div>\n `);\n }\n return groups;\n }\n\n protected renderThumb(value: number, ariaLabel?: string, thumbId?: string) {\n const percent = `${this.valueToFraction(value) * 100}%`;\n\n return html`\n <div\n part=\"thumb\"\n id=${ifDefined(thumbId)}\n tabindex=${this.disabled ? -1 : 0}\n style=${styleMap({ insetInlineStart: percent })}\n role=\"slider\"\n aria-valuemin=${this.actualMin}\n aria-valuemax=${this.actualMax}\n aria-valuenow=${value}\n aria-valuetext=${ifDefined(\n this.labels\n ? this.labels[value]\n : this.valueFormat || this.valueFormatOptions\n ? this.formatValue(value)\n : undefined\n )}\n aria-label=${ifDefined(ariaLabel)}\n aria-disabled=${this.disabled ? 'true' : 'false'}\n @pointerenter=${this.handleThumbPointerEnter}\n @pointerleave=${this.handleThumbPointerLeave}\n @focus=${(ev: Event) => (this.activeThumb = ev.target as HTMLElement)}\n @blur=${() => (\n this.activeThumb?.part.remove('focused'),\n (this.activeThumb = undefined)\n )}\n ></div>\n ${this.hideTooltip\n ? html``\n : html`\n <div\n part=\"thumb-label\"\n style=${styleMap({\n opacity: this.thumbLabelsVisible ? '1' : '0',\n insetInlineStart: percent,\n })}\n >\n <div part=\"thumb-label-inner\">\n ${this.labels ? this.labels[value] : this.formatValue(value)}\n </div>\n </div>\n `}\n `;\n }\n\n private renderSteps() {\n if (!this.discreteTrack || !this.step) {\n return html``;\n }\n\n const trackRange = this.max - this.min;\n const interval = ((100 / (trackRange / this.step)) * 10) / 10;\n\n return html`\n <div part=\"steps\">\n <svg width=\"100%\" height=\"100%\" style=\"display: flex\">\n <line\n x1=\"0\"\n y1=\"1\"\n x2=\"100%\"\n y2=\"1\"\n stroke=\"currentColor\"\n stroke-dasharray=\"0, calc(${interval * Math.sqrt(2)}%)\"\n stroke-linecap=\"round\"\n stroke-width=\"2px\"\n ></line>\n </svg>\n </div>\n `;\n }\n\n protected override render() {\n return html`\n <div part=\"base\">\n ${this.tickOrientation === 'mirror' || this.tickOrientation === 'start'\n ? html`<div part=\"ticks\">${this.renderTicks()}</div>`\n : html``}\n <div part=\"track\">\n <div part=\"inactive\"></div>\n <div part=\"fill\" style=${styleMap(this.getTrackStyle())}></div>\n ${this.renderSteps()}\n </div>\n ${this.tickOrientation !== 'start'\n ? html`<div part=\"ticks\">${this.renderTicks()}</div>`\n : html``}\n <div part=\"thumbs\">${this.renderThumbs()}</div>\n <slot @slotchange=${this.handleSlotChange}></slot>\n </div>\n `;\n }\n}\n"]}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { css, LitElement } from 'lit';
|
|
2
|
-
|
|
2
|
+
class IgcSliderLabelComponent extends LitElement {
|
|
3
3
|
createRenderRoot() {
|
|
4
4
|
return this;
|
|
5
5
|
}
|
|
@@ -10,4 +10,5 @@ IgcSliderLabelComponent.styles = css `
|
|
|
10
10
|
}
|
|
11
11
|
`;
|
|
12
12
|
IgcSliderLabelComponent.tagName = 'igc-slider-label';
|
|
13
|
+
export default IgcSliderLabelComponent;
|
|
13
14
|
//# sourceMappingURL=slider-label.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"slider-label.js","sourceRoot":"","sources":["../../../src/components/slider/slider-label.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAEtC,
|
|
1
|
+
{"version":3,"file":"slider-label.js","sourceRoot":"","sources":["../../../src/components/slider/slider-label.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAEtC,MAAqB,uBAAwB,SAAQ,UAAU;IAS1C,gBAAgB;QACjC,OAAO,IAAI,CAAC;IACd,CAAC;;AAVsB,8BAAM,GAAG,GAAG,CAAA;;;;GAIlC,CAAC;AAEqB,+BAAO,GAAG,kBAAkB,CAAC;eAPjC,uBAAuB","sourcesContent":["import { css, LitElement } from 'lit';\n\nexport default class IgcSliderLabelComponent extends LitElement {\n public static override styles = css`\n :host {\n display: none;\n }\n `;\n\n public static readonly tagName = 'igc-slider-label';\n\n protected override createRenderRoot() {\n return this;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-slider-label': IgcSliderLabelComponent;\n }\n}\n"]}
|
|
@@ -8,7 +8,7 @@ import { html } from 'lit';
|
|
|
8
8
|
import { property } from 'lit/decorators.js';
|
|
9
9
|
import { EventEmitterMixin } from '../common/mixins/event-emitter.js';
|
|
10
10
|
import { IgcSliderBaseComponent } from './slider-base.js';
|
|
11
|
-
|
|
11
|
+
class IgcSliderComponent extends EventEmitterMixin(IgcSliderBaseComponent) {
|
|
12
12
|
constructor() {
|
|
13
13
|
super(...arguments);
|
|
14
14
|
this._value = 0;
|
|
@@ -77,4 +77,5 @@ __decorate([
|
|
|
77
77
|
__decorate([
|
|
78
78
|
property({ attribute: 'aria-label' })
|
|
79
79
|
], IgcSliderComponent.prototype, "ariaLabel", null);
|
|
80
|
+
export default IgcSliderComponent;
|
|
80
81
|
//# sourceMappingURL=slider.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"slider.js","sourceRoot":"","sources":["../../../src/components/slider/slider.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAC3B,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE7C,OAAO,EAAE,iBAAiB,EAAE,MAAM,mCAAmC,CAAC;AACtE,OAAO,EAAE,sBAAsB,EAAE,MAAM,kBAAkB,CAAC;AAoC1D,
|
|
1
|
+
{"version":3,"file":"slider.js","sourceRoot":"","sources":["../../../src/components/slider/slider.ts"],"names":[],"mappings":"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","sourcesContent":["import { html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { Constructor } from '../common/mixins/constructor.js';\nimport { EventEmitterMixin } from '../common/mixins/event-emitter.js';\nimport { IgcSliderBaseComponent } from './slider-base.js';\n\nexport interface IgcSliderEventMap {\n /**\n * Emitted when a value is changed via thumb drag or keyboard interaction.\n */\n igcInput: CustomEvent<number>;\n /**\n * Emitted when a value change is committed on a thumb drag end or keyboard interaction.\n */\n igcChange: CustomEvent<number>;\n}\n\n/**\n * A slider component used to select numeric value within a range.\n *\n * @element igc-slider\n *\n * @fires igcInput - Emitted when a value is changed via thumb drag or keyboard interaction.\n * @fires igcChange - Emitted when a value change is committed on a thumb drag end or keyboard interaction.\n *\n * @csspart base - The base wrapper of the slider.\n * @csspart ticks - The ticks container.\n * @csspart tick-group - The tick group container.\n * @csspart tick - The tick element.\n * @csspart tick-label - The tick label element.\n * @csspart tick-label-inner - The inner element of the tick label.\n * @csspart thumbs - The thumbs container.\n * @csspart thumb - The thumb element.\n * @csspart thumb-label - The thumb tooltip label container.\n * @csspart thumb-label-inner - The thumb tooltip label inner element.\n * @csspart track - The track container.\n * @csspart steps - The track steps element.\n * @csspart inactive - The inactive element of the track.\n * @csspart fill - The filled part of the track.\n */\nexport default class IgcSliderComponent extends EventEmitterMixin<\n IgcSliderEventMap,\n Constructor<IgcSliderBaseComponent>\n>(IgcSliderBaseComponent) {\n public static readonly tagName = 'igc-slider';\n\n private _value = 0;\n private _ariaLabel!: string;\n\n public set value(val: number) {\n const oldVal = this._value;\n this._value = this.validateValue(val);\n this.requestUpdate('value', oldVal);\n }\n\n /**\n * The current value of the slider.\n * @attr\n */\n @property({ type: Number })\n public get value() {\n return this._value;\n }\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 /**\n * The aria label of the slider thumb.\n * @attr\n */\n @property({ attribute: 'aria-label' })\n public override get ariaLabel() {\n return this._ariaLabel;\n }\n\n protected override get activeValue(): number {\n return this.value;\n }\n\n protected override normalizeValue(): void {\n this._value = this.validateValue(this._value);\n }\n\n protected override getTrackStyle() {\n const position = this.valueToFraction(this.value);\n const filledTrackStyle = {\n width: `${position * 100}%`,\n };\n\n return filledTrackStyle;\n }\n\n protected override updateValue(increment: number) {\n const oldValue = this.value;\n\n this.value = (this.value as number) + increment;\n\n if (oldValue === this.value) {\n return false;\n }\n\n this.emitInputEvent();\n return true;\n }\n\n protected override emitInputEvent() {\n this.emitEvent('igcInput', { detail: this.value });\n }\n\n protected override emitChangeEvent() {\n this.emitEvent('igcChange', { detail: this.value });\n }\n\n /**\n * Increments the value of the slider by `stepIncrement * step`, where `stepIncrement` defaults to 1.\n * @param stepIncrement Optional step increment. If no parameter is passed, it defaults to 1.\n */\n public stepUp(stepIncrement = 1) {\n this.value = this.value + stepIncrement * this.step;\n }\n\n /**\n * Decrements the value of the slider by `stepDecrement * step`, where `stepDecrement` defaults to 1.\n * @param stepDecrement Optional step decrement. If no parameter is passed, it defaults to 1.\n */\n public stepDown(stepDecrement = 1) {\n this.value = this.value - stepDecrement * this.step;\n }\n\n protected override renderThumbs() {\n return html`${this.renderThumb(this.value, this.ariaLabel)}`;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-slider': IgcSliderComponent;\n }\n}\n"]}
|
|
@@ -1,11 +1,10 @@
|
|
|
1
1
|
import { css } from 'lit';
|
|
2
2
|
export const styles = css `:host {
|
|
3
3
|
--is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);
|
|
4
|
-
--is-medium:
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
);
|
|
4
|
+
--is-medium: min(
|
|
5
|
+
clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1),
|
|
6
|
+
clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1)
|
|
7
|
+
);
|
|
9
8
|
--is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);
|
|
10
9
|
position: relative;
|
|
11
10
|
-webkit-box-sizing: border-box;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"slider.base.css.js","sourceRoot":"","sources":["../../../../../src/components/slider/themes/light/slider.base.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAgTvB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host {\n --is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);\n --is-medium:\n min(\n clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1),\n clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1)\n );\n --is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);\n position: relative;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n scrollbar-width: var(--ig-scrollbar-size);\n scrollbar-color: var(--ig-scrollbar-thumb-background) var(--ig-scrollbar-track-background);\n}\n:host *,\n:host *::before,\n:host *::after {\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n}\n:host ::-webkit-scrollbar {\n width: var(--ig-scrollbar-size);\n height: var(--ig-scrollbar-size);\n background: var(--ig-scrollbar-track-background);\n}\n:host ::-webkit-scrollbar-thumb {\n background: var(--ig-scrollbar-thumb-background);\n}\n\n[hidden] {\n display: none !important;\n}\n\n/* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */\n:host {\n display: block;\n}\n\nslot {\n display: none;\n}\n\n[part~=base] {\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n position: relative;\n -webkit-box-flex: 1;\n -ms-flex-positive: 1;\n flex-grow: 1;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n height: 3rem;\n -webkit-transition: all 0.2s ease-out;\n -o-transition: all 0.2s ease-out;\n transition: all 0.2s ease-out;\n font-family: var(--ig-font-family);\n}\n\n[part=track] {\n border-radius: clamp(0rem, calc(var(--ig-radius-factor) * 2rem), 2rem);\n position: relative;\n width: 100%;\n overflow: hidden;\n}\n\n[part=fill] {\n position: absolute;\n background: hsla(var(--ig-secondary-500), var(--ig-secondary-a));\n border-radius: inherit;\n}\n\n[part=inactive] {\n position: absolute;\n width: 100%;\n top: 0.0625rem;\n background: hsla(var(--ig-secondary-500), 0.24);\n -webkit-transition: background 0.2s ease-out;\n -o-transition: background 0.2s ease-out;\n transition: background 0.2s ease-out;\n border-radius: inherit;\n}\n\n[part=steps] {\n position: absolute;\n width: 100%;\n height: 0.25rem;\n opacity: 0.85;\n -webkit-transition: opacity 0.2s ease-out;\n -o-transition: opacity 0.2s ease-out;\n transition: opacity 0.2s ease-out;\n top: 50%;\n -webkit-transform: translateY(-50%);\n -ms-transform: translateY(-50%);\n transform: translateY(-50%);\n color: white;\n}\n[part=steps] svg {\n -webkit-clip-path: inset(0 0.1875rem 0 0.1875rem);\n clip-path: inset(0 0.1875rem 0 0.1875rem);\n}\n[part=steps] line {\n -webkit-transform: translateY(25%);\n -ms-transform: translateY(25%);\n transform: translateY(25%);\n stroke: currentcolor;\n stroke-width: 0.1875rem;\n stroke-linecap: round;\n}\n\n[part=ticks] {\n width: 100%;\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n position: absolute;\n bottom: 0;\n -webkit-box-pack: justify;\n -ms-flex-pack: justify;\n justify-content: space-between;\n}\n[part=ticks]:first-child {\n bottom: auto;\n top: 0;\n -webkit-box-align: end;\n -ms-flex-align: end;\n align-items: flex-end;\n}\n[part=ticks]:first-child [part=tick-label] {\n top: auto;\n bottom: 1.5rem;\n}\n\n[part=tick-group]:first-of-type {\n -webkit-margin-start: -0.0625rem;\n margin-inline-start: -0.0625rem;\n}\n[part=tick-group]:last-of-type {\n -webkit-margin-start: -0.0625rem;\n margin-inline-start: -0.0625rem;\n}\n\n[part=tick] {\n background: hsla(var(--ig-gray-500), var(--ig-gray-a));\n height: 0.5rem;\n width: 0.125rem;\n}\n\n[part=tick][data-primary=true] {\n height: 1rem;\n}\n\n[part=tick-label] {\n color: hsla(var(--ig-gray-500), var(--ig-gray-a));\n position: absolute;\n top: 1.5rem;\n line-height: 0.7;\n opacity: 1;\n -webkit-transition: opacity 0.2s ease-in-out;\n -o-transition: opacity 0.2s ease-in-out;\n transition: opacity 0.2s ease-in-out;\n font-family: var(--ig-caption-font-family, var(--ig-font-family));\n font-size: var(--ig-caption-font-size);\n font-weight: var(--ig-caption-font-weight);\n font-style: var(--ig-caption-font-style);\n line-height: var(--ig-caption-line-height);\n letter-spacing: var(--ig-caption-letter-spacing);\n text-transform: var(--ig-caption-text-transform);\n margin-top: var(--ig-caption-margin-top);\n margin-bottom: var(--ig-caption-margin-bottom);\n}\n\n[part=tick-label-inner] {\n -webkit-margin-start: -50%;\n margin-inline-start: -50%;\n}\n\n[part=thumbs] {\n position: absolute;\n width: 100%;\n height: 0;\n cursor: default;\n inset-inline-start: 0;\n}\n\n[part~=thumb] {\n border-radius: clamp(0rem, calc(var(--ig-radius-factor) * 0.625rem), 0.625rem);\n position: absolute;\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-pack: center;\n -ms-flex-pack: center;\n justify-content: center;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n -webkit-box-orient: vertical;\n -webkit-box-direction: normal;\n -ms-flex-direction: column;\n flex-direction: column;\n outline-style: none;\n -webkit-transition: border-radius 0.1s ease-out, -webkit-transform 0.1s ease-out;\n transition: border-radius 0.1s ease-out, -webkit-transform 0.1s ease-out;\n -o-transition: transform 0.1s ease-out, border-radius 0.1s ease-out;\n transition: transform 0.1s ease-out, border-radius 0.1s ease-out;\n transition: transform 0.1s ease-out, border-radius 0.1s ease-out, -webkit-transform 0.1s ease-out;\n background: hsla(var(--ig-secondary-500), var(--ig-secondary-a));\n}\n\n[part=thumb-label] {\n position: absolute;\n top: calc((1.875rem + 1.25rem) * -1);\n pointer-events: none;\n height: 1.875rem;\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n}\n\n[part=thumb-label-inner] {\n font-family: var(--ig-caption-font-family, var(--ig-font-family));\n font-size: var(--ig-caption-font-size);\n font-weight: var(--ig-caption-font-weight);\n font-style: var(--ig-caption-font-style);\n line-height: var(--ig-caption-line-height);\n letter-spacing: var(--ig-caption-letter-spacing);\n text-transform: var(--ig-caption-text-transform);\n margin-top: var(--ig-caption-margin-top);\n margin-bottom: var(--ig-caption-margin-bottom);\n border-radius: clamp(0rem, calc(var(--ig-radius-factor) * 0.125rem), 0.125rem);\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n min-width: 2.5rem;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n -webkit-box-pack: center;\n -ms-flex-pack: center;\n justify-content: center;\n white-space: nowrap;\n -webkit-margin-start: -50%;\n margin-inline-start: -50%;\n padding: 0 0.125rem;\n color: var(--ig-gray-700-contrast);\n background: hsla(var(--ig-gray-700), var(--ig-gray-a));\n}\n[part=thumb-label-inner]::after {\n content: \"\";\n position: absolute;\n top: 85%;\n border-left: 0.625rem solid transparent;\n border-right: 0.625rem solid transparent;\n border-top: 0.625rem solid hsla(var(--ig-gray-700), var(--ig-gray-a));\n}\n\n:host(:not([tick-label-rotation=\"0\"])) [part=tick-label-inner] {\n -webkit-writing-mode: vertical-rl;\n -ms-writing-mode: tb-rl;\n writing-mode: vertical-rl;\n -webkit-margin-start: 0;\n margin-inline-start: 0;\n margin-block: -50%;\n}\n\n:host([tick-label-rotation=\"-90\"]) [part=tick-label-inner] {\n -webkit-transform: rotate(180deg);\n -ms-transform: rotate(180deg);\n transform: rotate(180deg);\n}\n\n:host([disabled]) {\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n pointer-events: none;\n cursor: initial;\n}\n:host([disabled]) [part=inactive] {\n background: hsla(var(--ig-gray-200), var(--ig-gray-a));\n}\n:host([disabled]) [part=fill],\n:host([disabled]) [part=tick] {\n background: hsla(var(--ig-gray-400), var(--ig-gray-a));\n}\n:host([disabled]) [part=tick-label] {\n color: hsla(var(--ig-gray-400), var(--ig-gray-a));\n}\n:host([disabled]) [part~=thumb] {\n background: hsla(var(--ig-gray-400), var(--ig-gray-a));\n}\n:host([disabled]) [part~=thumb]:focus::after {\n -webkit-transform: scale(0);\n -ms-transform: scale(0);\n transform: scale(0);\n}\n:host([disabled]):hover [part=inactive] {\n background: hsla(var(--ig-gray-400), var(--ig-gray-a));\n}\n:host([disabled]):hover [part~=thumb] {\n border-color: hsla(var(--ig-gray-400), var(--ig-gray-a));\n}`;\n"]}
|
|
1
|
+
{"version":3,"file":"slider.base.css.js","sourceRoot":"","sources":["../../../../../src/components/slider/themes/light/slider.base.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA+SvB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host {\n --is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);\n --is-medium: min(\n clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1),\n clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1)\n );\n --is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);\n position: relative;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n scrollbar-width: var(--ig-scrollbar-size);\n scrollbar-color: var(--ig-scrollbar-thumb-background) var(--ig-scrollbar-track-background);\n}\n:host *,\n:host *::before,\n:host *::after {\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n}\n:host ::-webkit-scrollbar {\n width: var(--ig-scrollbar-size);\n height: var(--ig-scrollbar-size);\n background: var(--ig-scrollbar-track-background);\n}\n:host ::-webkit-scrollbar-thumb {\n background: var(--ig-scrollbar-thumb-background);\n}\n\n[hidden] {\n display: none !important;\n}\n\n/* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */\n:host {\n display: block;\n}\n\nslot {\n display: none;\n}\n\n[part~=base] {\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n position: relative;\n -webkit-box-flex: 1;\n -ms-flex-positive: 1;\n flex-grow: 1;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n height: 3rem;\n -webkit-transition: all 0.2s ease-out;\n -o-transition: all 0.2s ease-out;\n transition: all 0.2s ease-out;\n font-family: var(--ig-font-family);\n}\n\n[part=track] {\n border-radius: clamp(0rem, calc(var(--ig-radius-factor) * 2rem), 2rem);\n position: relative;\n width: 100%;\n overflow: hidden;\n}\n\n[part=fill] {\n position: absolute;\n background: hsla(var(--ig-secondary-500), var(--ig-secondary-a));\n border-radius: inherit;\n}\n\n[part=inactive] {\n position: absolute;\n width: 100%;\n top: 0.0625rem;\n background: hsla(var(--ig-secondary-500), 0.24);\n -webkit-transition: background 0.2s ease-out;\n -o-transition: background 0.2s ease-out;\n transition: background 0.2s ease-out;\n border-radius: inherit;\n}\n\n[part=steps] {\n position: absolute;\n width: 100%;\n height: 0.25rem;\n opacity: 0.85;\n -webkit-transition: opacity 0.2s ease-out;\n -o-transition: opacity 0.2s ease-out;\n transition: opacity 0.2s ease-out;\n top: 50%;\n -webkit-transform: translateY(-50%);\n -ms-transform: translateY(-50%);\n transform: translateY(-50%);\n color: white;\n}\n[part=steps] svg {\n -webkit-clip-path: inset(0 0.1875rem 0 0.1875rem);\n clip-path: inset(0 0.1875rem 0 0.1875rem);\n}\n[part=steps] line {\n -webkit-transform: translateY(25%);\n -ms-transform: translateY(25%);\n transform: translateY(25%);\n stroke: currentcolor;\n stroke-width: 0.1875rem;\n stroke-linecap: round;\n}\n\n[part=ticks] {\n width: 100%;\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n position: absolute;\n bottom: 0;\n -webkit-box-pack: justify;\n -ms-flex-pack: justify;\n justify-content: space-between;\n}\n[part=ticks]:first-child {\n bottom: auto;\n top: 0;\n -webkit-box-align: end;\n -ms-flex-align: end;\n align-items: flex-end;\n}\n[part=ticks]:first-child [part=tick-label] {\n top: auto;\n bottom: 1.5rem;\n}\n\n[part=tick-group]:first-of-type {\n -webkit-margin-start: -0.0625rem;\n margin-inline-start: -0.0625rem;\n}\n[part=tick-group]:last-of-type {\n -webkit-margin-start: -0.0625rem;\n margin-inline-start: -0.0625rem;\n}\n\n[part=tick] {\n background: hsla(var(--ig-gray-500), var(--ig-gray-a));\n height: 0.5rem;\n width: 0.125rem;\n}\n\n[part=tick][data-primary=true] {\n height: 1rem;\n}\n\n[part=tick-label] {\n color: hsla(var(--ig-gray-500), var(--ig-gray-a));\n position: absolute;\n top: 1.5rem;\n line-height: 0.7;\n opacity: 1;\n -webkit-transition: opacity 0.2s ease-in-out;\n -o-transition: opacity 0.2s ease-in-out;\n transition: opacity 0.2s ease-in-out;\n font-family: var(--ig-caption-font-family, var(--ig-font-family));\n font-size: var(--ig-caption-font-size);\n font-weight: var(--ig-caption-font-weight);\n font-style: var(--ig-caption-font-style);\n line-height: var(--ig-caption-line-height);\n letter-spacing: var(--ig-caption-letter-spacing);\n text-transform: var(--ig-caption-text-transform);\n margin-top: var(--ig-caption-margin-top);\n margin-bottom: var(--ig-caption-margin-bottom);\n}\n\n[part=tick-label-inner] {\n -webkit-margin-start: -50%;\n margin-inline-start: -50%;\n}\n\n[part=thumbs] {\n position: absolute;\n width: 100%;\n height: 0;\n cursor: default;\n inset-inline-start: 0;\n}\n\n[part~=thumb] {\n border-radius: clamp(0rem, calc(var(--ig-radius-factor) * 0.625rem), 0.625rem);\n position: absolute;\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-pack: center;\n -ms-flex-pack: center;\n justify-content: center;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n -webkit-box-orient: vertical;\n -webkit-box-direction: normal;\n -ms-flex-direction: column;\n flex-direction: column;\n outline-style: none;\n -webkit-transition: border-radius 0.1s ease-out, -webkit-transform 0.1s ease-out;\n transition: border-radius 0.1s ease-out, -webkit-transform 0.1s ease-out;\n -o-transition: transform 0.1s ease-out, border-radius 0.1s ease-out;\n transition: transform 0.1s ease-out, border-radius 0.1s ease-out;\n transition: transform 0.1s ease-out, border-radius 0.1s ease-out, -webkit-transform 0.1s ease-out;\n background: hsla(var(--ig-secondary-500), var(--ig-secondary-a));\n}\n\n[part=thumb-label] {\n position: absolute;\n top: calc((1.875rem + 1.25rem) * -1);\n pointer-events: none;\n height: 1.875rem;\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n}\n\n[part=thumb-label-inner] {\n font-family: var(--ig-caption-font-family, var(--ig-font-family));\n font-size: var(--ig-caption-font-size);\n font-weight: var(--ig-caption-font-weight);\n font-style: var(--ig-caption-font-style);\n line-height: var(--ig-caption-line-height);\n letter-spacing: var(--ig-caption-letter-spacing);\n text-transform: var(--ig-caption-text-transform);\n margin-top: var(--ig-caption-margin-top);\n margin-bottom: var(--ig-caption-margin-bottom);\n border-radius: clamp(0rem, calc(var(--ig-radius-factor) * 0.125rem), 0.125rem);\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n min-width: 2.5rem;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n -webkit-box-pack: center;\n -ms-flex-pack: center;\n justify-content: center;\n white-space: nowrap;\n -webkit-margin-start: -50%;\n margin-inline-start: -50%;\n padding: 0 0.125rem;\n color: var(--ig-gray-700-contrast);\n background: hsla(var(--ig-gray-700), var(--ig-gray-a));\n}\n[part=thumb-label-inner]::after {\n content: \"\";\n position: absolute;\n top: 85%;\n border-left: 0.625rem solid transparent;\n border-right: 0.625rem solid transparent;\n border-top: 0.625rem solid hsla(var(--ig-gray-700), var(--ig-gray-a));\n}\n\n:host(:not([tick-label-rotation=\"0\"])) [part=tick-label-inner] {\n -webkit-writing-mode: vertical-rl;\n -ms-writing-mode: tb-rl;\n writing-mode: vertical-rl;\n -webkit-margin-start: 0;\n margin-inline-start: 0;\n margin-block: -50%;\n}\n\n:host([tick-label-rotation=\"-90\"]) [part=tick-label-inner] {\n -webkit-transform: rotate(180deg);\n -ms-transform: rotate(180deg);\n transform: rotate(180deg);\n}\n\n:host([disabled]) {\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n pointer-events: none;\n cursor: initial;\n}\n:host([disabled]) [part=inactive] {\n background: hsla(var(--ig-gray-200), var(--ig-gray-a));\n}\n:host([disabled]) [part=fill],\n:host([disabled]) [part=tick] {\n background: hsla(var(--ig-gray-400), var(--ig-gray-a));\n}\n:host([disabled]) [part=tick-label] {\n color: hsla(var(--ig-gray-400), var(--ig-gray-a));\n}\n:host([disabled]) [part~=thumb] {\n background: hsla(var(--ig-gray-400), var(--ig-gray-a));\n}\n:host([disabled]) [part~=thumb]:focus::after {\n -webkit-transform: scale(0);\n -ms-transform: scale(0);\n transform: scale(0);\n}\n:host([disabled]):hover [part=inactive] {\n background: hsla(var(--ig-gray-400), var(--ig-gray-a));\n}\n:host([disabled]):hover [part~=thumb] {\n border-color: hsla(var(--ig-gray-400), var(--ig-gray-a));\n}`;\n"]}
|
|
@@ -24,6 +24,8 @@ export default class IgcSnackbarComponent extends IgcSnackbarComponent_base {
|
|
|
24
24
|
/** @private */
|
|
25
25
|
static styles: import("lit").CSSResult;
|
|
26
26
|
private autoHideTimeout;
|
|
27
|
+
private animationPlayer;
|
|
28
|
+
protected content: HTMLElement;
|
|
27
29
|
/**
|
|
28
30
|
* Determines whether the snackbar is opened.
|
|
29
31
|
* @attr
|
|
@@ -44,10 +46,12 @@ export default class IgcSnackbarComponent extends IgcSnackbarComponent_base {
|
|
|
44
46
|
* @attr action-text
|
|
45
47
|
*/
|
|
46
48
|
actionText: string;
|
|
49
|
+
firstUpdated(): void;
|
|
50
|
+
private toggleAnimation;
|
|
47
51
|
/** Opens the snackbar. */
|
|
48
52
|
show(): void;
|
|
49
53
|
/** Closes the snackbar. */
|
|
50
|
-
hide(): void
|
|
54
|
+
hide(): Promise<void>;
|
|
51
55
|
/** Toggles the open state of the component. */
|
|
52
56
|
toggle(): void;
|
|
53
57
|
private handleClick;
|
|
@@ -5,7 +5,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
|
|
|
5
5
|
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
6
6
|
};
|
|
7
7
|
import { html, LitElement, nothing } from 'lit';
|
|
8
|
-
import { property } from 'lit/decorators.js';
|
|
8
|
+
import { property, query } from 'lit/decorators.js';
|
|
9
9
|
import { ifDefined } from 'lit/directives/if-defined.js';
|
|
10
10
|
import { themes } from '../../theming/theming-decorator.js';
|
|
11
11
|
import { EventEmitterMixin } from '../common/mixins/event-emitter.js';
|
|
@@ -15,6 +15,7 @@ import { styles as fluent } from './themes/light/snackbar.fluent.css.js';
|
|
|
15
15
|
import { styles as indigo } from './themes/light/snackbar.indigo.css.js';
|
|
16
16
|
import { defineComponents } from '../common/definitions/defineComponents.js';
|
|
17
17
|
import IgcButtonComponent from '../button/button.js';
|
|
18
|
+
import { AnimationPlayer, fadeIn, fadeOut } from '../../animations/index.js';
|
|
18
19
|
defineComponents(IgcButtonComponent);
|
|
19
20
|
let IgcSnackbarComponent = class IgcSnackbarComponent extends EventEmitterMixin(LitElement) {
|
|
20
21
|
constructor() {
|
|
@@ -23,20 +24,33 @@ let IgcSnackbarComponent = class IgcSnackbarComponent extends EventEmitterMixin(
|
|
|
23
24
|
this.displayTime = 4000;
|
|
24
25
|
this.keepOpen = false;
|
|
25
26
|
}
|
|
27
|
+
firstUpdated() {
|
|
28
|
+
this.animationPlayer = new AnimationPlayer(this.content);
|
|
29
|
+
}
|
|
30
|
+
async toggleAnimation(dir) {
|
|
31
|
+
const animation = dir === 'open' ? fadeIn : fadeOut;
|
|
32
|
+
const [_, event] = await Promise.all([
|
|
33
|
+
this.animationPlayer.stopAll(),
|
|
34
|
+
this.animationPlayer.play(animation),
|
|
35
|
+
]);
|
|
36
|
+
return event.type === 'finish';
|
|
37
|
+
}
|
|
26
38
|
show() {
|
|
27
39
|
if (this.open) {
|
|
28
40
|
return;
|
|
29
41
|
}
|
|
42
|
+
this.toggleAnimation('open');
|
|
30
43
|
this.open = true;
|
|
31
44
|
clearTimeout(this.autoHideTimeout);
|
|
32
45
|
if (this.open && !this.keepOpen) {
|
|
33
46
|
this.autoHideTimeout = window.setTimeout(() => this.hide(), this.displayTime);
|
|
34
47
|
}
|
|
35
48
|
}
|
|
36
|
-
hide() {
|
|
49
|
+
async hide() {
|
|
37
50
|
if (!this.open) {
|
|
38
51
|
return;
|
|
39
52
|
}
|
|
53
|
+
await this.toggleAnimation('close');
|
|
40
54
|
this.open = false;
|
|
41
55
|
clearTimeout(this.autoHideTimeout);
|
|
42
56
|
}
|
|
@@ -70,6 +84,9 @@ let IgcSnackbarComponent = class IgcSnackbarComponent extends EventEmitterMixin(
|
|
|
70
84
|
};
|
|
71
85
|
IgcSnackbarComponent.tagName = 'igc-snackbar';
|
|
72
86
|
IgcSnackbarComponent.styles = styles;
|
|
87
|
+
__decorate([
|
|
88
|
+
query('[part~="base"]', true)
|
|
89
|
+
], IgcSnackbarComponent.prototype, "content", void 0);
|
|
73
90
|
__decorate([
|
|
74
91
|
property({ type: Boolean, reflect: true })
|
|
75
92
|
], IgcSnackbarComponent.prototype, "open", void 0);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"snackbar.js","sourceRoot":"","sources":["../../../src/components/snackbar/snackbar.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AAChD,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;
|
|
1
|
+
{"version":3,"file":"snackbar.js","sourceRoot":"","sources":["../../../src/components/snackbar/snackbar.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement, nothing } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { themes } from '../../theming/theming-decorator.js';\n\nimport { Constructor } from '../common/mixins/constructor.js';\nimport { EventEmitterMixin } from '../common/mixins/event-emitter.js';\nimport { styles } from './themes/light/snackbar.base.css.js';\nimport { styles as bootstrap } from './themes/light/snackbar.bootstrap.css.js';\nimport { styles as fluent } from './themes/light/snackbar.fluent.css.js';\nimport { styles as indigo } from './themes/light/snackbar.indigo.css.js';\n\nimport { defineComponents } from '../common/definitions/defineComponents.js';\nimport IgcButtonComponent from '../button/button.js';\nimport { AnimationPlayer, fadeIn, fadeOut } from '../../animations/index.js';\n\ndefineComponents(IgcButtonComponent);\n\nexport interface IgcSnackbarEventMap {\n igcAction: CustomEvent<void>;\n}\n\n/**\n * A snackbar component is used to provide feedback about an operation\n * by showing a brief message at the bottom of the screen.\n *\n * @element igc-snackbar\n *\n * @slot - Renders the snackbar content.\n *\n * @fires igcAction - Emitted when the snackbar action button is clicked.\n *\n * @csspart base - The base wrapper of the snackbar component.\n * @csspart message - The snackbar message.\n * @csspart action - The snackbar action button.\n */\n@themes({ bootstrap, fluent, indigo })\nexport default class IgcSnackbarComponent extends EventEmitterMixin<\n IgcSnackbarEventMap,\n Constructor<LitElement>\n>(LitElement) {\n /** @private */\n public static tagName = 'igc-snackbar';\n\n /** @private */\n public static styles = styles;\n\n private autoHideTimeout!: number;\n private animationPlayer!: AnimationPlayer;\n\n @query('[part~=\"base\"]', true)\n protected content!: HTMLElement;\n\n /**\n * Determines whether the snackbar is opened.\n * @attr\n */\n @property({ type: Boolean, reflect: true })\n public open = false;\n\n /**\n * Determines the duration in ms in which the snackbar will be visible.\n * @attr display-time\n */\n @property({ type: Number, attribute: 'display-time' })\n public displayTime = 4000;\n\n /**\n * Determines whether the snackbar should close after the displayTime is over.\n * @attr keep-open\n */\n @property({ type: Boolean, attribute: 'keep-open' })\n public keepOpen = false;\n\n /**\n * The snackbar action button.\n * @attr action-text\n */\n @property({ attribute: 'action-text' })\n public actionText!: string;\n\n public override firstUpdated() {\n this.animationPlayer = new AnimationPlayer(this.content);\n }\n\n private async toggleAnimation(dir: 'open' | 'close') {\n const animation = dir === 'open' ? fadeIn : fadeOut;\n\n const [_, event] = await Promise.all([\n this.animationPlayer.stopAll(),\n this.animationPlayer.play(animation),\n ]);\n\n return event.type === 'finish';\n }\n\n /** Opens the snackbar. */\n public show() {\n if (this.open) {\n return;\n }\n\n this.toggleAnimation('open');\n this.open = true;\n\n clearTimeout(this.autoHideTimeout);\n if (this.open && !this.keepOpen) {\n this.autoHideTimeout = window.setTimeout(\n () => this.hide(),\n this.displayTime\n );\n }\n }\n\n /** Closes the snackbar. */\n public async hide() {\n if (!this.open) {\n return;\n }\n\n await this.toggleAnimation('close');\n this.open = false;\n clearTimeout(this.autoHideTimeout);\n }\n\n /** Toggles the open state of the component. */\n public toggle() {\n this.open ? this.hide() : this.show();\n }\n\n private handleClick() {\n this.emitEvent('igcAction');\n }\n\n protected override render() {\n return html`\n <div part=\"base\">\n <span part=\"message\">\n <slot></slot>\n </span>\n ${this.actionText\n ? html`\n <igc-button\n variant=\"flat\"\n part=\"action\"\n size=\"small\"\n @click=${this.handleClick}\n >\n ${ifDefined(this.actionText)}\n </igc-button>\n `\n : nothing}\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-snackbar': IgcSnackbarComponent;\n }\n}\n"]}
|
|
@@ -1,11 +1,10 @@
|
|
|
1
1
|
import { css } from 'lit';
|
|
2
2
|
export const styles = css `:host {
|
|
3
3
|
--is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);
|
|
4
|
-
--is-medium:
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
);
|
|
4
|
+
--is-medium: min(
|
|
5
|
+
clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1),
|
|
6
|
+
clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1)
|
|
7
|
+
);
|
|
9
8
|
--is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);
|
|
10
9
|
position: relative;
|
|
11
10
|
-webkit-box-sizing: border-box;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"snackbar.base.css.js","sourceRoot":"","sources":["../../../../../src/components/snackbar/themes/light/snackbar.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":"snackbar.base.css.js","sourceRoot":"","sources":["../../../../../src/components/snackbar/themes/light/snackbar.base.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA4GvB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host {\n --is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);\n --is-medium: min(\n clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1),\n clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1)\n );\n --is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);\n position: relative;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n scrollbar-width: var(--ig-scrollbar-size);\n scrollbar-color: var(--ig-scrollbar-thumb-background) var(--ig-scrollbar-track-background);\n}\n:host *,\n:host *::before,\n:host *::after {\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n}\n:host ::-webkit-scrollbar {\n width: var(--ig-scrollbar-size);\n height: var(--ig-scrollbar-size);\n background: var(--ig-scrollbar-track-background);\n}\n:host ::-webkit-scrollbar-thumb {\n background: var(--ig-scrollbar-thumb-background);\n}\n\n[hidden] {\n display: none !important;\n}\n\n/* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */ /* stylelint-disable max-line-length */\n:host {\n font-family: var(--ig-font-family);\n position: fixed;\n bottom: 0;\n left: 50%;\n -webkit-transform: translate(-50%, -50%);\n -ms-transform: translate(-50%, -50%);\n transform: translate(-50%, -50%);\n}\n\n[part~=base] {\n border-radius: clamp(0rem, calc(var(--ig-radius-factor) * 0.25rem), 0.25rem);\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -ms-flex-wrap: row nowrap;\n flex-wrap: row nowrap;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n -webkit-box-pack: justify;\n -ms-flex-pack: justify;\n justify-content: space-between;\n min-height: 3rem;\n padding: 0.4375rem 1.5rem;\n margin: 0.5rem;\n gap: 1.5rem;\n color: var(--ig-gray-900-contrast);\n background: hsla(var(--ig-gray-900), 0.9);\n -webkit-box-shadow: var(--ig-elevation-4);\n box-shadow: var(--ig-elevation-4);\n -webkit-backface-visibility: hidden;\n backface-visibility: hidden;\n -webkit-backdrop-filter: blur(8px);\n backdrop-filter: blur(8px);\n}\n\n[part~=message] {\n font-family: var(--ig-body-2-font-family, var(--ig-font-family));\n font-size: var(--ig-body-2-font-size);\n font-weight: var(--ig-body-2-font-weight);\n font-style: var(--ig-body-2-font-style);\n line-height: var(--ig-body-2-line-height);\n letter-spacing: var(--ig-body-2-letter-spacing);\n text-transform: var(--ig-body-2-text-transform);\n margin-top: var(--ig-body-2-margin-top);\n margin-bottom: var(--ig-body-2-margin-bottom);\n display: -webkit-inline-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n -webkit-box-flex: 1;\n -ms-flex: 1 1 50%;\n flex: 1 1 50%;\n}\n\n:host([action-text]) igc-button::part(base) {\n text-transform: uppercase;\n font-weight: 600;\n}\n:host([action-text]) igc-button::part(base):hover::before {\n background: transparent;\n}\n:host([action-text]) igc-button::part(base):focus {\n background: transparent;\n outline: none;\n -webkit-box-shadow: none;\n box-shadow: none;\n}\n:host([action-text]) igc-button::part(base):focus::before {\n background: transparent;\n}\n\n:host(:not([open])) [part=base] {\n display: none;\n}`;\n"]}
|