igniteui-webcomponents 5.3.0-beta.3 → 5.4.0-rc.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 +39 -0
- package/README.md +10 -5
- package/animations/player.js.map +1 -1
- package/components/avatar/avatar.d.ts +2 -1
- package/components/avatar/avatar.js.map +1 -1
- package/components/avatar/themes/dark/avatar.bootstrap.css.js +1 -1
- package/components/avatar/themes/dark/avatar.bootstrap.css.js.map +1 -1
- package/components/avatar/themes/dark/avatar.fluent.css.js +1 -1
- package/components/avatar/themes/dark/avatar.fluent.css.js.map +1 -1
- package/components/avatar/themes/dark/avatar.indigo.css.js +1 -1
- package/components/avatar/themes/dark/avatar.indigo.css.js.map +1 -1
- package/components/avatar/themes/dark/avatar.material.css.js +1 -1
- package/components/avatar/themes/dark/avatar.material.css.js.map +1 -1
- package/components/avatar/themes/light/avatar.bootstrap.css.js +1 -1
- package/components/avatar/themes/light/avatar.bootstrap.css.js.map +1 -1
- package/components/avatar/themes/light/avatar.fluent.css.js +1 -1
- package/components/avatar/themes/light/avatar.fluent.css.js.map +1 -1
- package/components/avatar/themes/light/avatar.indigo.css.js +1 -1
- package/components/avatar/themes/light/avatar.indigo.css.js.map +1 -1
- package/components/avatar/themes/light/avatar.material.css.js +1 -1
- package/components/avatar/themes/light/avatar.material.css.js.map +1 -1
- package/components/badge/badge.d.ts +2 -2
- package/components/badge/badge.js.map +1 -1
- package/components/badge/themes/dark/badge.bootstrap.css.js +1 -1
- package/components/badge/themes/dark/badge.bootstrap.css.js.map +1 -1
- package/components/badge/themes/dark/badge.fluent.css.js +1 -1
- package/components/badge/themes/dark/badge.fluent.css.js.map +1 -1
- package/components/badge/themes/dark/badge.indigo.css.js +1 -1
- package/components/badge/themes/dark/badge.indigo.css.js.map +1 -1
- package/components/badge/themes/dark/badge.material.css.js +1 -1
- package/components/badge/themes/dark/badge.material.css.js.map +1 -1
- package/components/badge/themes/light/badge.bootstrap.css.js +1 -1
- package/components/badge/themes/light/badge.bootstrap.css.js.map +1 -1
- package/components/badge/themes/light/badge.fluent.css.js +1 -1
- package/components/badge/themes/light/badge.fluent.css.js.map +1 -1
- package/components/badge/themes/light/badge.indigo.css.js +1 -1
- package/components/badge/themes/light/badge.indigo.css.js.map +1 -1
- package/components/badge/themes/light/badge.material.css.js +1 -1
- package/components/badge/themes/light/badge.material.css.js.map +1 -1
- package/components/banner/themes/dark/banner.bootstrap.css.js +1 -1
- package/components/banner/themes/dark/banner.bootstrap.css.js.map +1 -1
- package/components/banner/themes/dark/banner.fluent.css.js +1 -1
- package/components/banner/themes/dark/banner.fluent.css.js.map +1 -1
- package/components/banner/themes/dark/banner.indigo.css.js +1 -1
- package/components/banner/themes/dark/banner.indigo.css.js.map +1 -1
- package/components/banner/themes/dark/banner.material.css.js +1 -1
- package/components/banner/themes/dark/banner.material.css.js.map +1 -1
- package/components/banner/themes/light/banner.bootstrap.css.js +1 -1
- package/components/banner/themes/light/banner.bootstrap.css.js.map +1 -1
- package/components/banner/themes/light/banner.fluent.css.js +1 -1
- package/components/banner/themes/light/banner.fluent.css.js.map +1 -1
- package/components/banner/themes/light/banner.indigo.css.js +1 -1
- package/components/banner/themes/light/banner.indigo.css.js.map +1 -1
- package/components/banner/themes/light/banner.material.css.js +1 -1
- package/components/banner/themes/light/banner.material.css.js.map +1 -1
- package/components/button/button.d.ts +2 -1
- package/components/button/button.js.map +1 -1
- package/components/button/icon-button.d.ts +2 -1
- package/components/button/icon-button.js.map +1 -1
- package/components/button/themes/button/dark/button.bootstrap.css.js +1 -1
- package/components/button/themes/button/dark/button.bootstrap.css.js.map +1 -1
- package/components/button/themes/button/dark/button.fluent.css.js +1 -1
- package/components/button/themes/button/dark/button.fluent.css.js.map +1 -1
- package/components/button/themes/button/dark/button.indigo.css.js +1 -1
- package/components/button/themes/button/dark/button.indigo.css.js.map +1 -1
- package/components/button/themes/button/dark/button.material.css.js +1 -1
- package/components/button/themes/button/dark/button.material.css.js.map +1 -1
- package/components/button/themes/button/light/button.bootstrap.css.js +1 -1
- package/components/button/themes/button/light/button.bootstrap.css.js.map +1 -1
- package/components/button/themes/button/light/button.fluent.css.js +1 -1
- package/components/button/themes/button/light/button.fluent.css.js.map +1 -1
- package/components/button/themes/button/light/button.indigo.css.js +1 -1
- package/components/button/themes/button/light/button.indigo.css.js.map +1 -1
- package/components/button/themes/button/light/button.material.css.js +1 -1
- package/components/button/themes/button/light/button.material.css.js.map +1 -1
- package/components/button/themes/icon-button/dark/icon-button.bootstrap.css.js +1 -1
- package/components/button/themes/icon-button/dark/icon-button.bootstrap.css.js.map +1 -1
- package/components/button/themes/icon-button/dark/icon-button.fluent.css.js +1 -1
- package/components/button/themes/icon-button/dark/icon-button.fluent.css.js.map +1 -1
- package/components/button/themes/icon-button/dark/icon-button.indigo.css.js +1 -1
- package/components/button/themes/icon-button/dark/icon-button.indigo.css.js.map +1 -1
- package/components/button/themes/icon-button/dark/icon-button.material.css.js +1 -1
- package/components/button/themes/icon-button/dark/icon-button.material.css.js.map +1 -1
- package/components/button/themes/icon-button/light/icon-button.bootstrap.css.js +1 -1
- package/components/button/themes/icon-button/light/icon-button.bootstrap.css.js.map +1 -1
- package/components/button/themes/icon-button/light/icon-button.fluent.css.js +1 -1
- package/components/button/themes/icon-button/light/icon-button.fluent.css.js.map +1 -1
- package/components/button/themes/icon-button/light/icon-button.indigo.css.js +1 -1
- package/components/button/themes/icon-button/light/icon-button.indigo.css.js.map +1 -1
- package/components/button/themes/icon-button/light/icon-button.material.css.js +1 -1
- package/components/button/themes/icon-button/light/icon-button.material.css.js.map +1 -1
- package/components/button/themes/icon-button/shared/icon-button.bootstrap.css.js +1 -1
- package/components/button/themes/icon-button/shared/icon-button.bootstrap.css.js.map +1 -1
- package/components/button/themes/icon-button/shared/icon-button.common.css.js +1 -1
- package/components/button/themes/icon-button/shared/icon-button.common.css.js.map +1 -1
- package/components/button/themes/icon-button/shared/icon-button.fluent.css.js +1 -1
- package/components/button/themes/icon-button/shared/icon-button.fluent.css.js.map +1 -1
- package/components/button/themes/icon-button/shared/icon-button.indigo.css.js +1 -1
- package/components/button/themes/icon-button/shared/icon-button.indigo.css.js.map +1 -1
- package/components/button/themes/icon-button/shared/icon-button.material.css.js +1 -1
- package/components/button/themes/icon-button/shared/icon-button.material.css.js.map +1 -1
- package/components/button-group/button-group.d.ts +3 -2
- package/components/button-group/button-group.js.map +1 -1
- package/components/button-group/themes/dark/button-group.bootstrap.css.js +1 -1
- package/components/button-group/themes/dark/button-group.bootstrap.css.js.map +1 -1
- package/components/button-group/themes/dark/button-group.fluent.css.js +1 -1
- package/components/button-group/themes/dark/button-group.fluent.css.js.map +1 -1
- package/components/button-group/themes/dark/button-group.indigo.css.js +1 -1
- package/components/button-group/themes/dark/button-group.indigo.css.js.map +1 -1
- package/components/button-group/themes/dark/button-group.material.css.js +1 -1
- package/components/button-group/themes/dark/button-group.material.css.js.map +1 -1
- package/components/button-group/themes/light/button-group.bootstrap.css.js +1 -1
- package/components/button-group/themes/light/button-group.bootstrap.css.js.map +1 -1
- package/components/button-group/themes/light/button-group.fluent.css.js +1 -1
- package/components/button-group/themes/light/button-group.fluent.css.js.map +1 -1
- package/components/button-group/themes/light/button-group.indigo.css.js +1 -1
- package/components/button-group/themes/light/button-group.indigo.css.js.map +1 -1
- package/components/button-group/themes/light/button-group.material.css.js +1 -1
- package/components/button-group/themes/light/button-group.material.css.js.map +1 -1
- package/components/calendar/base.d.ts +2 -2
- package/components/calendar/base.js.map +1 -1
- package/components/calendar/calendar.d.ts +5 -4
- package/components/calendar/calendar.js.map +1 -1
- package/components/calendar/themes/calendar.base.css.js +1 -1
- package/components/calendar/themes/calendar.base.css.js.map +1 -1
- package/components/calendar/themes/dark/calendar.bootstrap.css.js +1 -1
- package/components/calendar/themes/dark/calendar.bootstrap.css.js.map +1 -1
- package/components/calendar/themes/dark/calendar.fluent.css.js +1 -1
- package/components/calendar/themes/dark/calendar.fluent.css.js.map +1 -1
- package/components/calendar/themes/dark/calendar.indigo.css.js +1 -1
- package/components/calendar/themes/dark/calendar.indigo.css.js.map +1 -1
- package/components/calendar/themes/dark/calendar.material.css.js +1 -1
- package/components/calendar/themes/dark/calendar.material.css.js.map +1 -1
- package/components/calendar/themes/light/calendar.bootstrap.css.js +1 -1
- package/components/calendar/themes/light/calendar.bootstrap.css.js.map +1 -1
- package/components/calendar/themes/light/calendar.fluent.css.js +1 -1
- package/components/calendar/themes/light/calendar.fluent.css.js.map +1 -1
- package/components/calendar/themes/light/calendar.indigo.css.js +1 -1
- package/components/calendar/themes/light/calendar.indigo.css.js.map +1 -1
- package/components/calendar/themes/light/calendar.material.css.js +1 -1
- package/components/calendar/themes/light/calendar.material.css.js.map +1 -1
- package/components/calendar/themes/light/calendar.shared.css.js +1 -1
- package/components/calendar/themes/light/calendar.shared.css.js.map +1 -1
- package/components/calendar/themes/shared/bootstrap/calendar.bootstrap.css.js +1 -1
- package/components/calendar/themes/shared/bootstrap/calendar.bootstrap.css.js.map +1 -1
- package/components/calendar/themes/shared/bootstrap/days-view.bootstrap.css.js +1 -1
- package/components/calendar/themes/shared/bootstrap/days-view.bootstrap.css.js.map +1 -1
- package/components/calendar/themes/shared/fluent/calendar.fluent.css.js +1 -1
- package/components/calendar/themes/shared/fluent/calendar.fluent.css.js.map +1 -1
- package/components/calendar/themes/shared/fluent/days-view.fluent.css.js +1 -1
- package/components/calendar/themes/shared/fluent/days-view.fluent.css.js.map +1 -1
- package/components/calendar/themes/shared/indigo/calendar.indigo.css.js +1 -1
- package/components/calendar/themes/shared/indigo/calendar.indigo.css.js.map +1 -1
- package/components/calendar/themes/shared/indigo/days-view.indigo.css.js +1 -1
- package/components/calendar/themes/shared/indigo/days-view.indigo.css.js.map +1 -1
- package/components/calendar/themes/shared/material/calendar.material.css.js +1 -1
- package/components/calendar/themes/shared/material/calendar.material.css.js.map +1 -1
- package/components/calendar/themes/shared/material/days-view.material.css.js +1 -1
- package/components/calendar/themes/shared/material/days-view.material.css.js.map +1 -1
- package/components/calendar/types.d.ts +3 -0
- package/components/calendar/types.js.map +1 -1
- package/components/card/card.actions.d.ts +2 -1
- package/components/card/card.actions.js.map +1 -1
- package/components/card/themes/card.actions.base.css.js +1 -1
- package/components/card/themes/card.actions.base.css.js.map +1 -1
- package/components/card/themes/container.js +2 -1
- package/components/card/themes/container.js.map +1 -1
- package/components/card/themes/dark/card.bootstrap.css.js +1 -1
- package/components/card/themes/dark/card.bootstrap.css.js.map +1 -1
- package/components/card/themes/dark/card.fluent.css.js +1 -1
- package/components/card/themes/dark/card.fluent.css.js.map +1 -1
- package/components/card/themes/dark/card.indigo.css.js +1 -1
- package/components/card/themes/dark/card.indigo.css.js.map +1 -1
- package/components/card/themes/dark/card.material.css.js +1 -1
- package/components/card/themes/dark/card.material.css.js.map +1 -1
- package/components/card/themes/dark/card.shared.css.js +1 -1
- package/components/card/themes/dark/card.shared.css.js.map +1 -1
- package/components/card/themes/light/container/card.bootstrap.css.js +1 -1
- package/components/card/themes/light/container/card.bootstrap.css.js.map +1 -1
- package/components/card/themes/light/container/card.fluent.css.js +1 -1
- package/components/card/themes/light/container/card.fluent.css.js.map +1 -1
- package/components/card/themes/light/container/card.indigo.css.js +1 -1
- package/components/card/themes/light/container/card.indigo.css.js.map +1 -1
- package/components/card/themes/light/container/card.material.css.js +1 -1
- package/components/card/themes/light/container/card.material.css.js.map +1 -1
- package/components/card/themes/light/container/card.shared.css.js +1 -1
- package/components/card/themes/light/container/card.shared.css.js.map +1 -1
- package/components/card/themes/shared/container/card.bootstrap.css.js +3 -0
- package/components/card/themes/shared/container/card.bootstrap.css.js.map +1 -0
- package/components/card/themes/shared/container/card.indigo.css.js +1 -1
- package/components/card/themes/shared/container/card.indigo.css.js.map +1 -1
- package/components/card/themes/shared/content/card.content.bootstrap.css.js +1 -1
- package/components/card/themes/shared/content/card.content.bootstrap.css.js.map +1 -1
- package/components/card/themes/shared/header/card.header.bootstrap.css.js +1 -1
- package/components/card/themes/shared/header/card.header.bootstrap.css.js.map +1 -1
- package/components/card/themes/shared/header/card.header.fluent.css.js +1 -1
- package/components/card/themes/shared/header/card.header.fluent.css.js.map +1 -1
- package/components/card/themes/shared/header/card.header.indigo.css.js +1 -1
- package/components/card/themes/shared/header/card.header.indigo.css.js.map +1 -1
- package/components/carousel/carousel-slide.d.ts +5 -1
- package/components/carousel/carousel-slide.js.map +1 -1
- package/components/carousel/carousel.d.ts +3 -2
- package/components/carousel/carousel.js.map +1 -1
- package/components/carousel/themes/dark/carousel.bootstrap.css.js +1 -1
- package/components/carousel/themes/dark/carousel.bootstrap.css.js.map +1 -1
- package/components/carousel/themes/dark/carousel.fluent.css.js +1 -1
- package/components/carousel/themes/dark/carousel.fluent.css.js.map +1 -1
- package/components/carousel/themes/dark/carousel.indigo.css.js +1 -1
- package/components/carousel/themes/dark/carousel.indigo.css.js.map +1 -1
- package/components/carousel/themes/dark/carousel.material.css.js +1 -1
- package/components/carousel/themes/dark/carousel.material.css.js.map +1 -1
- package/components/carousel/themes/light/carousel.bootstrap.css.js +1 -1
- package/components/carousel/themes/light/carousel.bootstrap.css.js.map +1 -1
- package/components/carousel/themes/light/carousel.fluent.css.js +1 -1
- package/components/carousel/themes/light/carousel.fluent.css.js.map +1 -1
- package/components/carousel/themes/light/carousel.indigo.css.js +1 -1
- package/components/carousel/themes/light/carousel.indigo.css.js.map +1 -1
- package/components/carousel/themes/light/carousel.material.css.js +1 -1
- package/components/carousel/themes/light/carousel.material.css.js.map +1 -1
- package/components/checkbox/checkbox-base.d.ts +6 -3
- package/components/checkbox/checkbox-base.js.map +1 -1
- package/components/checkbox/themes/dark/checkbox/checkbox.bootstrap.css.js +1 -1
- package/components/checkbox/themes/dark/checkbox/checkbox.bootstrap.css.js.map +1 -1
- package/components/checkbox/themes/dark/checkbox/checkbox.fluent.css.js +1 -1
- package/components/checkbox/themes/dark/checkbox/checkbox.fluent.css.js.map +1 -1
- package/components/checkbox/themes/dark/checkbox/checkbox.indigo.css.js +1 -1
- package/components/checkbox/themes/dark/checkbox/checkbox.indigo.css.js.map +1 -1
- package/components/checkbox/themes/dark/checkbox/checkbox.material.css.js +1 -1
- package/components/checkbox/themes/dark/checkbox/checkbox.material.css.js.map +1 -1
- package/components/checkbox/themes/dark/switch/switch.bootstrap.css.js +1 -1
- package/components/checkbox/themes/dark/switch/switch.bootstrap.css.js.map +1 -1
- package/components/checkbox/themes/dark/switch/switch.fluent.css.js +1 -1
- package/components/checkbox/themes/dark/switch/switch.fluent.css.js.map +1 -1
- package/components/checkbox/themes/dark/switch/switch.indigo.css.js +1 -1
- package/components/checkbox/themes/dark/switch/switch.indigo.css.js.map +1 -1
- package/components/checkbox/themes/dark/switch/switch.material.css.js +1 -1
- package/components/checkbox/themes/dark/switch/switch.material.css.js.map +1 -1
- package/components/checkbox/themes/light/checkbox/checkbox.bootstrap.css.js +1 -1
- package/components/checkbox/themes/light/checkbox/checkbox.bootstrap.css.js.map +1 -1
- package/components/checkbox/themes/light/checkbox/checkbox.fluent.css.js +1 -1
- package/components/checkbox/themes/light/checkbox/checkbox.fluent.css.js.map +1 -1
- package/components/checkbox/themes/light/checkbox/checkbox.indigo.css.js +1 -1
- package/components/checkbox/themes/light/checkbox/checkbox.indigo.css.js.map +1 -1
- package/components/checkbox/themes/light/checkbox/checkbox.material.css.js +1 -1
- package/components/checkbox/themes/light/checkbox/checkbox.material.css.js.map +1 -1
- package/components/checkbox/themes/light/switch/switch.bootstrap.css.js +1 -1
- package/components/checkbox/themes/light/switch/switch.bootstrap.css.js.map +1 -1
- package/components/checkbox/themes/light/switch/switch.fluent.css.js +1 -1
- package/components/checkbox/themes/light/switch/switch.fluent.css.js.map +1 -1
- package/components/checkbox/themes/light/switch/switch.indigo.css.js +1 -1
- package/components/checkbox/themes/light/switch/switch.indigo.css.js.map +1 -1
- package/components/checkbox/themes/light/switch/switch.material.css.js +1 -1
- package/components/checkbox/themes/light/switch/switch.material.css.js.map +1 -1
- package/components/checkbox/themes/light/switch/switch.shared.css.js +1 -1
- package/components/checkbox/themes/light/switch/switch.shared.css.js.map +1 -1
- package/components/checkbox/themes/shared/switch/switch.bootstrap.css.js +1 -1
- package/components/checkbox/themes/shared/switch/switch.bootstrap.css.js.map +1 -1
- package/components/checkbox/themes/shared/switch/switch.common.css.js +1 -1
- package/components/checkbox/themes/shared/switch/switch.common.css.js.map +1 -1
- package/components/checkbox/themes/shared/switch/switch.fluent.css.js +1 -1
- package/components/checkbox/themes/shared/switch/switch.fluent.css.js.map +1 -1
- package/components/checkbox/themes/shared/switch/switch.indigo.css.js +1 -1
- package/components/checkbox/themes/shared/switch/switch.indigo.css.js.map +1 -1
- package/components/checkbox/themes/shared/switch/switch.material.css.js +1 -1
- package/components/checkbox/themes/shared/switch/switch.material.css.js.map +1 -1
- package/components/chip/themes/dark/chip.bootstrap.css.js +1 -1
- package/components/chip/themes/dark/chip.bootstrap.css.js.map +1 -1
- package/components/chip/themes/dark/chip.fluent.css.js +1 -1
- package/components/chip/themes/dark/chip.fluent.css.js.map +1 -1
- package/components/chip/themes/dark/chip.indigo.css.js +1 -1
- package/components/chip/themes/dark/chip.indigo.css.js.map +1 -1
- package/components/chip/themes/dark/chip.material.css.js +1 -1
- package/components/chip/themes/dark/chip.material.css.js.map +1 -1
- package/components/chip/themes/light/chip.bootstrap.css.js +1 -1
- package/components/chip/themes/light/chip.bootstrap.css.js.map +1 -1
- package/components/chip/themes/light/chip.fluent.css.js +1 -1
- package/components/chip/themes/light/chip.fluent.css.js.map +1 -1
- package/components/chip/themes/light/chip.indigo.css.js +1 -1
- package/components/chip/themes/light/chip.indigo.css.js.map +1 -1
- package/components/chip/themes/light/chip.material.css.js +1 -1
- package/components/chip/themes/light/chip.material.css.js.map +1 -1
- package/components/chip/themes/shared/chip.bootstrap.css.js +1 -1
- package/components/chip/themes/shared/chip.bootstrap.css.js.map +1 -1
- package/components/combo/themes/dark/combo.bootstrap.css.js +1 -1
- package/components/combo/themes/dark/combo.bootstrap.css.js.map +1 -1
- package/components/combo/themes/dark/combo.fluent.css.js +1 -1
- package/components/combo/themes/dark/combo.fluent.css.js.map +1 -1
- package/components/combo/themes/dark/combo.indigo.css.js +1 -1
- package/components/combo/themes/dark/combo.indigo.css.js.map +1 -1
- package/components/combo/themes/dark/combo.material.css.js +1 -1
- package/components/combo/themes/dark/combo.material.css.js.map +1 -1
- package/components/combo/themes/light/combo.bootstrap.css.js +1 -1
- package/components/combo/themes/light/combo.bootstrap.css.js.map +1 -1
- package/components/combo/themes/light/combo.fluent.css.js +1 -1
- package/components/combo/themes/light/combo.fluent.css.js.map +1 -1
- package/components/combo/themes/light/combo.indigo.css.js +1 -1
- package/components/combo/themes/light/combo.indigo.css.js.map +1 -1
- package/components/combo/themes/light/combo.material.css.js +1 -1
- package/components/combo/themes/light/combo.material.css.js.map +1 -1
- package/components/combo/themes/light/combo.shared.css.js +1 -1
- package/components/combo/themes/light/combo.shared.css.js.map +1 -1
- package/components/common/controllers/drag.d.ts +16 -4
- package/components/common/controllers/drag.js +65 -25
- package/components/common/controllers/drag.js.map +1 -1
- package/components/common/controllers/root-scroll.d.ts +2 -1
- package/components/common/controllers/root-scroll.js.map +1 -1
- package/components/common/mixins/alert.d.ts +2 -1
- package/components/common/mixins/alert.js.map +1 -1
- package/components/common/mixins/forms/associated.js +1 -1
- package/components/common/mixins/forms/associated.js.map +1 -1
- package/components/common/mixins/forms/form-value.d.ts +1 -0
- package/components/common/mixins/forms/form-value.js +16 -0
- package/components/common/mixins/forms/form-value.js.map +1 -1
- package/components/common/util.d.ts +6 -6
- package/components/common/util.js +8 -7
- package/components/common/util.js.map +1 -1
- package/components/date-picker/date-picker.d.ts +5 -5
- package/components/date-picker/date-picker.js.map +1 -1
- package/components/date-picker/themes/dark/date-picker.bootstrap.css.js +1 -1
- package/components/date-picker/themes/dark/date-picker.bootstrap.css.js.map +1 -1
- package/components/date-picker/themes/dark/date-picker.fluent.css.js +1 -1
- package/components/date-picker/themes/dark/date-picker.fluent.css.js.map +1 -1
- package/components/date-picker/themes/dark/date-picker.indigo.css.js +1 -1
- package/components/date-picker/themes/dark/date-picker.indigo.css.js.map +1 -1
- package/components/date-picker/themes/dark/date-picker.material.css.js +1 -1
- package/components/date-picker/themes/dark/date-picker.material.css.js.map +1 -1
- package/components/date-picker/themes/light/date-picker.bootstrap.css.js +1 -1
- package/components/date-picker/themes/light/date-picker.bootstrap.css.js.map +1 -1
- package/components/date-picker/themes/light/date-picker.fluent.css.js +1 -1
- package/components/date-picker/themes/light/date-picker.fluent.css.js.map +1 -1
- package/components/date-picker/themes/light/date-picker.indigo.css.js +1 -1
- package/components/date-picker/themes/light/date-picker.indigo.css.js.map +1 -1
- package/components/date-picker/themes/light/date-picker.material.css.js +1 -1
- package/components/date-picker/themes/light/date-picker.material.css.js.map +1 -1
- package/components/date-picker/themes/light/date-picker.shared.css.js +1 -1
- package/components/date-picker/themes/light/date-picker.shared.css.js.map +1 -1
- package/components/dialog/themes/dark/dialog.bootstrap.css.js +1 -1
- package/components/dialog/themes/dark/dialog.bootstrap.css.js.map +1 -1
- package/components/dialog/themes/dark/dialog.fluent.css.js +1 -1
- package/components/dialog/themes/dark/dialog.fluent.css.js.map +1 -1
- package/components/dialog/themes/dark/dialog.indigo.css.js +1 -1
- package/components/dialog/themes/dark/dialog.indigo.css.js.map +1 -1
- package/components/dialog/themes/dark/dialog.material.css.js +1 -1
- package/components/dialog/themes/dark/dialog.material.css.js.map +1 -1
- package/components/dialog/themes/light/dialog.bootstrap.css.js +1 -1
- package/components/dialog/themes/light/dialog.bootstrap.css.js.map +1 -1
- package/components/dialog/themes/light/dialog.fluent.css.js +1 -1
- package/components/dialog/themes/light/dialog.fluent.css.js.map +1 -1
- package/components/dialog/themes/light/dialog.indigo.css.js +1 -1
- package/components/dialog/themes/light/dialog.indigo.css.js.map +1 -1
- package/components/dialog/themes/light/dialog.material.css.js +1 -1
- package/components/dialog/themes/light/dialog.material.css.js.map +1 -1
- package/components/divider/divider.d.ts +2 -1
- package/components/divider/divider.js.map +1 -1
- package/components/divider/themes/dark/divider.bootstrap.css.js +1 -1
- package/components/divider/themes/dark/divider.bootstrap.css.js.map +1 -1
- package/components/divider/themes/dark/divider.fluent.css.js +1 -1
- package/components/divider/themes/dark/divider.fluent.css.js.map +1 -1
- package/components/divider/themes/dark/divider.indigo.css.js +1 -1
- package/components/divider/themes/dark/divider.indigo.css.js.map +1 -1
- package/components/divider/themes/dark/divider.material.css.js +1 -1
- package/components/divider/themes/dark/divider.material.css.js.map +1 -1
- package/components/divider/themes/light/divider.bootstrap.css.js +1 -1
- package/components/divider/themes/light/divider.bootstrap.css.js.map +1 -1
- package/components/divider/themes/light/divider.fluent.css.js +1 -1
- package/components/divider/themes/light/divider.fluent.css.js.map +1 -1
- package/components/divider/themes/light/divider.indigo.css.js +1 -1
- package/components/divider/themes/light/divider.indigo.css.js.map +1 -1
- package/components/divider/themes/light/divider.material.css.js +1 -1
- package/components/divider/themes/light/divider.material.css.js.map +1 -1
- package/components/dropdown/dropdown.d.ts +4 -4
- package/components/dropdown/dropdown.js.map +1 -1
- package/components/dropdown/themes/dark/dropdown.bootstrap.css.js +1 -1
- package/components/dropdown/themes/dark/dropdown.bootstrap.css.js.map +1 -1
- package/components/dropdown/themes/dark/dropdown.fluent.css.js +1 -1
- package/components/dropdown/themes/dark/dropdown.fluent.css.js.map +1 -1
- package/components/dropdown/themes/dark/dropdown.indigo.css.js +1 -1
- package/components/dropdown/themes/dark/dropdown.indigo.css.js.map +1 -1
- package/components/dropdown/themes/dark/dropdown.material.css.js +1 -1
- package/components/dropdown/themes/dark/dropdown.material.css.js.map +1 -1
- package/components/dropdown/themes/dark/dropdown.shared.css.js +1 -1
- package/components/dropdown/themes/dark/dropdown.shared.css.js.map +1 -1
- package/components/dropdown/themes/light/dropdown.bootstrap.css.js +1 -1
- package/components/dropdown/themes/light/dropdown.bootstrap.css.js.map +1 -1
- package/components/dropdown/themes/light/dropdown.fluent.css.js +1 -1
- package/components/dropdown/themes/light/dropdown.fluent.css.js.map +1 -1
- package/components/dropdown/themes/light/dropdown.indigo.css.js +1 -1
- package/components/dropdown/themes/light/dropdown.indigo.css.js.map +1 -1
- package/components/dropdown/themes/light/dropdown.material.css.js +1 -1
- package/components/dropdown/themes/light/dropdown.material.css.js.map +1 -1
- package/components/dropdown/themes/light/dropdown.shared.css.js +1 -1
- package/components/dropdown/themes/light/dropdown.shared.css.js.map +1 -1
- package/components/expansion-panel/expansion-panel.d.ts +2 -1
- package/components/expansion-panel/expansion-panel.js.map +1 -1
- package/components/expansion-panel/themes/dark/expansion-panel.bootstrap.css.js +1 -1
- package/components/expansion-panel/themes/dark/expansion-panel.bootstrap.css.js.map +1 -1
- package/components/expansion-panel/themes/dark/expansion-panel.fluent.css.js +1 -1
- package/components/expansion-panel/themes/dark/expansion-panel.fluent.css.js.map +1 -1
- package/components/expansion-panel/themes/dark/expansion-panel.indigo.css.js +1 -1
- package/components/expansion-panel/themes/dark/expansion-panel.indigo.css.js.map +1 -1
- package/components/expansion-panel/themes/dark/expansion-panel.material.css.js +1 -1
- package/components/expansion-panel/themes/dark/expansion-panel.material.css.js.map +1 -1
- package/components/expansion-panel/themes/light/expansion-panel.bootstrap.css.js +1 -1
- package/components/expansion-panel/themes/light/expansion-panel.bootstrap.css.js.map +1 -1
- package/components/expansion-panel/themes/light/expansion-panel.fluent.css.js +1 -1
- package/components/expansion-panel/themes/light/expansion-panel.fluent.css.js.map +1 -1
- package/components/expansion-panel/themes/light/expansion-panel.indigo.css.js +1 -1
- package/components/expansion-panel/themes/light/expansion-panel.indigo.css.js.map +1 -1
- package/components/expansion-panel/themes/light/expansion-panel.material.css.js +1 -1
- package/components/expansion-panel/themes/light/expansion-panel.material.css.js.map +1 -1
- package/components/file-input/file-input.d.ts +85 -0
- package/components/file-input/file-input.js +155 -0
- package/components/file-input/file-input.js.map +1 -0
- package/components/file-input/themes/file-input.base.css.d.ts +1 -0
- package/components/file-input/themes/file-input.base.css.js +3 -0
- package/components/file-input/themes/file-input.base.css.js.map +1 -0
- package/components/file-input/themes/shared/file-input.bootstrap.css.d.ts +1 -0
- package/components/file-input/themes/shared/file-input.bootstrap.css.js +3 -0
- package/components/file-input/themes/shared/file-input.bootstrap.css.js.map +1 -0
- package/components/file-input/themes/shared/file-input.fluent.css.d.ts +1 -0
- package/components/file-input/themes/shared/file-input.fluent.css.js +3 -0
- package/components/file-input/themes/shared/file-input.fluent.css.js.map +1 -0
- package/components/file-input/themes/shared/file-input.indigo.css.d.ts +1 -0
- package/components/file-input/themes/shared/file-input.indigo.css.js +3 -0
- package/components/file-input/themes/shared/file-input.indigo.css.js.map +1 -0
- package/components/file-input/themes/shared/file-input.material.css.d.ts +1 -0
- package/components/file-input/themes/shared/file-input.material.css.js +3 -0
- package/components/file-input/themes/shared/file-input.material.css.js.map +1 -0
- package/components/file-input/themes/themes.d.ts +2 -0
- package/components/file-input/themes/themes.js +50 -0
- package/components/file-input/themes/themes.js.map +1 -0
- package/components/file-input/validators.d.ts +3 -0
- package/components/file-input/validators.js +5 -0
- package/components/file-input/validators.js.map +1 -0
- package/components/icon/internal-icons-lib.js +14 -14
- package/components/icon/internal-icons-lib.js.map +1 -1
- package/components/icon/themes/dark/icon.bootstrap.css.js +1 -1
- package/components/icon/themes/dark/icon.bootstrap.css.js.map +1 -1
- package/components/icon/themes/dark/icon.fluent.css.js +1 -1
- package/components/icon/themes/dark/icon.fluent.css.js.map +1 -1
- package/components/icon/themes/dark/icon.indigo.css.js +1 -1
- package/components/icon/themes/dark/icon.indigo.css.js.map +1 -1
- package/components/icon/themes/dark/icon.material.css.js +1 -1
- package/components/icon/themes/dark/icon.material.css.js.map +1 -1
- package/components/icon/themes/light/icon.bootstrap.css.js +1 -1
- package/components/icon/themes/light/icon.bootstrap.css.js.map +1 -1
- package/components/icon/themes/light/icon.fluent.css.js +1 -1
- package/components/icon/themes/light/icon.fluent.css.js.map +1 -1
- package/components/icon/themes/light/icon.indigo.css.js +1 -1
- package/components/icon/themes/light/icon.indigo.css.js.map +1 -1
- package/components/icon/themes/light/icon.material.css.js +1 -1
- package/components/icon/themes/light/icon.material.css.js.map +1 -1
- package/components/input/input-base.d.ts +3 -1
- package/components/input/input-base.js +6 -2
- package/components/input/input-base.js.map +1 -1
- package/components/input/input.d.ts +2 -2
- package/components/input/input.js.map +1 -1
- package/components/input/themes/dark/input.bootstrap.css.js +1 -1
- package/components/input/themes/dark/input.bootstrap.css.js.map +1 -1
- package/components/input/themes/dark/input.fluent.css.js +1 -1
- package/components/input/themes/dark/input.fluent.css.js.map +1 -1
- package/components/input/themes/dark/input.indigo.css.js +1 -1
- package/components/input/themes/dark/input.indigo.css.js.map +1 -1
- package/components/input/themes/dark/input.material.css.js +1 -1
- package/components/input/themes/dark/input.material.css.js.map +1 -1
- package/components/input/themes/light/input.bootstrap.css.js +1 -1
- package/components/input/themes/light/input.bootstrap.css.js.map +1 -1
- package/components/input/themes/light/input.fluent.css.js +1 -1
- package/components/input/themes/light/input.fluent.css.js.map +1 -1
- package/components/input/themes/light/input.indigo.css.js +1 -1
- package/components/input/themes/light/input.indigo.css.js.map +1 -1
- package/components/input/themes/light/input.material.css.js +1 -1
- package/components/input/themes/light/input.material.css.js.map +1 -1
- package/components/input/themes/shared/input.bootstrap.css.js +1 -1
- package/components/input/themes/shared/input.bootstrap.css.js.map +1 -1
- package/components/input/themes/shared/input.material.css.js +1 -1
- package/components/input/themes/shared/input.material.css.js.map +1 -1
- package/components/list/list-item.d.ts +5 -0
- package/components/list/list-item.js +5 -0
- package/components/list/list-item.js.map +1 -1
- package/components/list/themes/dark/container/list.bootstrap.css.js +1 -1
- package/components/list/themes/dark/container/list.bootstrap.css.js.map +1 -1
- package/components/list/themes/dark/container/list.fluent.css.js +1 -1
- package/components/list/themes/dark/container/list.fluent.css.js.map +1 -1
- package/components/list/themes/dark/container/list.indigo.css.js +1 -1
- package/components/list/themes/dark/container/list.indigo.css.js.map +1 -1
- package/components/list/themes/dark/container/list.material.css.js +1 -1
- package/components/list/themes/dark/container/list.material.css.js.map +1 -1
- package/components/list/themes/dark/header/list-header.bootstrap.css.js +1 -1
- package/components/list/themes/dark/header/list-header.bootstrap.css.js.map +1 -1
- package/components/list/themes/dark/header/list-header.fluent.css.js +1 -1
- package/components/list/themes/dark/header/list-header.fluent.css.js.map +1 -1
- package/components/list/themes/dark/header/list-header.indigo.css.js +1 -1
- package/components/list/themes/dark/header/list-header.indigo.css.js.map +1 -1
- package/components/list/themes/dark/header/list-header.material.css.js +1 -1
- package/components/list/themes/dark/header/list-header.material.css.js.map +1 -1
- package/components/list/themes/dark/item/list-item.bootstrap.css.js +1 -1
- package/components/list/themes/dark/item/list-item.bootstrap.css.js.map +1 -1
- package/components/list/themes/dark/item/list-item.fluent.css.js +1 -1
- package/components/list/themes/dark/item/list-item.fluent.css.js.map +1 -1
- package/components/list/themes/dark/item/list-item.indigo.css.js +1 -1
- package/components/list/themes/dark/item/list-item.indigo.css.js.map +1 -1
- package/components/list/themes/dark/item/list-item.material.css.js +1 -1
- package/components/list/themes/dark/item/list-item.material.css.js.map +1 -1
- package/components/list/themes/light/container/list.bootstrap.css.js +1 -1
- package/components/list/themes/light/container/list.bootstrap.css.js.map +1 -1
- package/components/list/themes/light/container/list.fluent.css.js +1 -1
- package/components/list/themes/light/container/list.fluent.css.js.map +1 -1
- package/components/list/themes/light/container/list.indigo.css.js +1 -1
- package/components/list/themes/light/container/list.indigo.css.js.map +1 -1
- package/components/list/themes/light/container/list.material.css.js +1 -1
- package/components/list/themes/light/container/list.material.css.js.map +1 -1
- package/components/list/themes/light/header/list-header.bootstrap.css.js +1 -1
- package/components/list/themes/light/header/list-header.bootstrap.css.js.map +1 -1
- package/components/list/themes/light/header/list-header.fluent.css.js +1 -1
- package/components/list/themes/light/header/list-header.fluent.css.js.map +1 -1
- package/components/list/themes/light/header/list-header.indigo.css.js +1 -1
- package/components/list/themes/light/header/list-header.indigo.css.js.map +1 -1
- package/components/list/themes/light/header/list-header.material.css.js +1 -1
- package/components/list/themes/light/header/list-header.material.css.js.map +1 -1
- package/components/list/themes/light/item/list-item.bootstrap.css.js +1 -1
- package/components/list/themes/light/item/list-item.bootstrap.css.js.map +1 -1
- package/components/list/themes/light/item/list-item.fluent.css.js +1 -1
- package/components/list/themes/light/item/list-item.fluent.css.js.map +1 -1
- package/components/list/themes/light/item/list-item.indigo.css.js +1 -1
- package/components/list/themes/light/item/list-item.indigo.css.js.map +1 -1
- package/components/list/themes/light/item/list-item.material.css.js +1 -1
- package/components/list/themes/light/item/list-item.material.css.js.map +1 -1
- package/components/list/themes/shared/item/list-item.common.css.js +1 -1
- package/components/list/themes/shared/item/list-item.common.css.js.map +1 -1
- package/components/mask-input/mask-input.d.ts +2 -1
- package/components/mask-input/mask-input.js.map +1 -1
- package/components/nav-drawer/nav-drawer.d.ts +2 -1
- package/components/nav-drawer/nav-drawer.js.map +1 -1
- package/components/nav-drawer/themes/dark/container/nav-drawer.bootstrap.css.js +1 -1
- package/components/nav-drawer/themes/dark/container/nav-drawer.bootstrap.css.js.map +1 -1
- package/components/nav-drawer/themes/dark/container/nav-drawer.fluent.css.js +1 -1
- package/components/nav-drawer/themes/dark/container/nav-drawer.fluent.css.js.map +1 -1
- package/components/nav-drawer/themes/dark/container/nav-drawer.indigo.css.js +1 -1
- package/components/nav-drawer/themes/dark/container/nav-drawer.indigo.css.js.map +1 -1
- package/components/nav-drawer/themes/dark/container/nav-drawer.material.css.js +1 -1
- package/components/nav-drawer/themes/dark/container/nav-drawer.material.css.js.map +1 -1
- package/components/nav-drawer/themes/light/container/nav-drawer.bootstrap.css.js +1 -1
- package/components/nav-drawer/themes/light/container/nav-drawer.bootstrap.css.js.map +1 -1
- package/components/nav-drawer/themes/light/container/nav-drawer.fluent.css.js +1 -1
- package/components/nav-drawer/themes/light/container/nav-drawer.fluent.css.js.map +1 -1
- package/components/nav-drawer/themes/light/container/nav-drawer.indigo.css.js +1 -1
- package/components/nav-drawer/themes/light/container/nav-drawer.indigo.css.js.map +1 -1
- package/components/nav-drawer/themes/light/container/nav-drawer.material.css.js +1 -1
- package/components/nav-drawer/themes/light/container/nav-drawer.material.css.js.map +1 -1
- package/components/navbar/themes/dark/navbar.bootstrap.css.js +1 -1
- package/components/navbar/themes/dark/navbar.bootstrap.css.js.map +1 -1
- package/components/navbar/themes/dark/navbar.fluent.css.js +1 -1
- package/components/navbar/themes/dark/navbar.fluent.css.js.map +1 -1
- package/components/navbar/themes/dark/navbar.indigo.css.js +1 -1
- package/components/navbar/themes/dark/navbar.indigo.css.js.map +1 -1
- package/components/navbar/themes/dark/navbar.material.css.js +1 -1
- package/components/navbar/themes/dark/navbar.material.css.js.map +1 -1
- package/components/navbar/themes/light/navbar.bootstrap.css.js +1 -1
- package/components/navbar/themes/light/navbar.bootstrap.css.js.map +1 -1
- package/components/navbar/themes/light/navbar.fluent.css.js +1 -1
- package/components/navbar/themes/light/navbar.fluent.css.js.map +1 -1
- package/components/navbar/themes/light/navbar.indigo.css.js +1 -1
- package/components/navbar/themes/light/navbar.indigo.css.js.map +1 -1
- package/components/navbar/themes/light/navbar.material.css.js +1 -1
- package/components/navbar/themes/light/navbar.material.css.js.map +1 -1
- package/components/popover/popover.d.ts +2 -2
- package/components/popover/popover.js +1 -5
- package/components/popover/popover.js.map +1 -1
- package/components/progress/linear-progress.d.ts +2 -1
- package/components/progress/linear-progress.js.map +1 -1
- package/components/progress/themes/circular/dark/circular.progress.bootstrap.css.js +1 -1
- package/components/progress/themes/circular/dark/circular.progress.bootstrap.css.js.map +1 -1
- package/components/progress/themes/circular/dark/circular.progress.fluent.css.js +1 -1
- package/components/progress/themes/circular/dark/circular.progress.fluent.css.js.map +1 -1
- package/components/progress/themes/circular/dark/circular.progress.indigo.css.js +1 -1
- package/components/progress/themes/circular/dark/circular.progress.indigo.css.js.map +1 -1
- package/components/progress/themes/circular/dark/circular.progress.material.css.js +1 -1
- package/components/progress/themes/circular/dark/circular.progress.material.css.js.map +1 -1
- package/components/progress/themes/circular/light/circular.progress.bootstrap.css.js +1 -1
- package/components/progress/themes/circular/light/circular.progress.bootstrap.css.js.map +1 -1
- package/components/progress/themes/circular/light/circular.progress.fluent.css.js +1 -1
- package/components/progress/themes/circular/light/circular.progress.fluent.css.js.map +1 -1
- package/components/progress/themes/circular/light/circular.progress.indigo.css.js +1 -1
- package/components/progress/themes/circular/light/circular.progress.indigo.css.js.map +1 -1
- package/components/progress/themes/circular/light/circular.progress.material.css.js +1 -1
- package/components/progress/themes/circular/light/circular.progress.material.css.js.map +1 -1
- package/components/progress/themes/circular/light/circular.progress.shared.css.js +1 -1
- package/components/progress/themes/circular/light/circular.progress.shared.css.js.map +1 -1
- package/components/progress/themes/circular/shared/circular.progress.common.css.js +1 -1
- package/components/progress/themes/circular/shared/circular.progress.common.css.js.map +1 -1
- package/components/progress/themes/linear/dark/linear.progress.bootstrap.css.js +1 -1
- package/components/progress/themes/linear/dark/linear.progress.bootstrap.css.js.map +1 -1
- package/components/progress/themes/linear/dark/linear.progress.fluent.css.js +1 -1
- package/components/progress/themes/linear/dark/linear.progress.fluent.css.js.map +1 -1
- package/components/progress/themes/linear/dark/linear.progress.indigo.css.js +1 -1
- package/components/progress/themes/linear/dark/linear.progress.indigo.css.js.map +1 -1
- package/components/progress/themes/linear/dark/linear.progress.material.css.js +1 -1
- package/components/progress/themes/linear/dark/linear.progress.material.css.js.map +1 -1
- package/components/progress/themes/linear/light/linear.progress.bootstrap.css.js +1 -1
- package/components/progress/themes/linear/light/linear.progress.bootstrap.css.js.map +1 -1
- package/components/progress/themes/linear/light/linear.progress.fluent.css.js +1 -1
- package/components/progress/themes/linear/light/linear.progress.fluent.css.js.map +1 -1
- package/components/progress/themes/linear/light/linear.progress.indigo.css.js +1 -1
- package/components/progress/themes/linear/light/linear.progress.indigo.css.js.map +1 -1
- package/components/progress/themes/linear/light/linear.progress.material.css.js +1 -1
- package/components/progress/themes/linear/light/linear.progress.material.css.js.map +1 -1
- package/components/progress/themes/linear/light/linear.progress.shared.css.js +1 -1
- package/components/progress/themes/linear/light/linear.progress.shared.css.js.map +1 -1
- package/components/progress/themes/linear/linear.progress.base.css.js +1 -1
- package/components/progress/themes/linear/linear.progress.base.css.js.map +1 -1
- package/components/progress/themes/linear/shared/linear.progress.common.css.js +1 -1
- package/components/progress/themes/linear/shared/linear.progress.common.css.js.map +1 -1
- package/components/progress/themes/linear/shared/linear.progress.fluent.css.js +1 -1
- package/components/progress/themes/linear/shared/linear.progress.fluent.css.js.map +1 -1
- package/components/progress/themes/linear/themes.js +2 -3
- package/components/progress/themes/linear/themes.js.map +1 -1
- package/components/radio/radio.d.ts +12 -3
- package/components/radio/radio.js +18 -0
- package/components/radio/radio.js.map +1 -1
- package/components/radio/themes/dark/radio.bootstrap.css.js +1 -1
- package/components/radio/themes/dark/radio.bootstrap.css.js.map +1 -1
- package/components/radio/themes/dark/radio.fluent.css.js +1 -1
- package/components/radio/themes/dark/radio.fluent.css.js.map +1 -1
- package/components/radio/themes/dark/radio.indigo.css.js +1 -1
- package/components/radio/themes/dark/radio.indigo.css.js.map +1 -1
- package/components/radio/themes/dark/radio.material.css.js +1 -1
- package/components/radio/themes/dark/radio.material.css.js.map +1 -1
- package/components/radio/themes/light/radio.bootstrap.css.js +1 -1
- package/components/radio/themes/light/radio.bootstrap.css.js.map +1 -1
- package/components/radio/themes/light/radio.fluent.css.js +1 -1
- package/components/radio/themes/light/radio.fluent.css.js.map +1 -1
- package/components/radio/themes/light/radio.indigo.css.js +1 -1
- package/components/radio/themes/light/radio.indigo.css.js.map +1 -1
- package/components/radio/themes/light/radio.material.css.js +1 -1
- package/components/radio/themes/light/radio.material.css.js.map +1 -1
- package/components/radio/themes/light/radio.shared.css.js +1 -1
- package/components/radio/themes/light/radio.shared.css.js.map +1 -1
- package/components/radio-group/radio-group.d.ts +2 -1
- package/components/radio-group/radio-group.js.map +1 -1
- package/components/rating/themes/dark/rating.bootstrap.css.js +1 -1
- package/components/rating/themes/dark/rating.bootstrap.css.js.map +1 -1
- package/components/rating/themes/dark/rating.fluent.css.js +1 -1
- package/components/rating/themes/dark/rating.fluent.css.js.map +1 -1
- package/components/rating/themes/dark/rating.indigo.css.js +1 -1
- package/components/rating/themes/dark/rating.indigo.css.js.map +1 -1
- package/components/rating/themes/dark/rating.material.css.js +1 -1
- package/components/rating/themes/dark/rating.material.css.js.map +1 -1
- package/components/rating/themes/light/rating.bootstrap.css.js +1 -1
- package/components/rating/themes/light/rating.bootstrap.css.js.map +1 -1
- package/components/rating/themes/light/rating.fluent.css.js +1 -1
- package/components/rating/themes/light/rating.fluent.css.js.map +1 -1
- package/components/rating/themes/light/rating.indigo.css.js +1 -1
- package/components/rating/themes/light/rating.indigo.css.js.map +1 -1
- package/components/rating/themes/light/rating.material.css.js +1 -1
- package/components/rating/themes/light/rating.material.css.js.map +1 -1
- package/components/rating/themes/light/rating.shared.css.js +1 -1
- package/components/rating/themes/light/rating.shared.css.js.map +1 -1
- package/components/rating/themes/rating.base.css.js +1 -1
- package/components/rating/themes/rating.base.css.js.map +1 -1
- package/components/rating/themes/shared/rating.common.css.js +1 -1
- package/components/rating/themes/shared/rating.common.css.js.map +1 -1
- package/components/rating/themes/shared/rating.indigo.css.js +1 -1
- package/components/rating/themes/shared/rating.indigo.css.js.map +1 -1
- package/components/resize-container/default-ghost.d.ts +2 -1
- package/components/resize-container/default-ghost.js +7 -3
- package/components/resize-container/default-ghost.js.map +1 -1
- package/components/resize-container/resize-container.d.ts +1 -9
- package/components/resize-container/resize-container.js +8 -23
- package/components/resize-container/resize-container.js.map +1 -1
- package/components/resize-container/resize-controller.d.ts +1 -2
- package/components/resize-container/resize-controller.js +26 -18
- package/components/resize-container/resize-controller.js.map +1 -1
- package/components/resize-container/themes/dark/resize-indicator.bootstrap.css.js +1 -1
- package/components/resize-container/themes/dark/resize-indicator.bootstrap.css.js.map +1 -1
- package/components/resize-container/themes/dark/resize-indicator.fluent.css.js +1 -1
- package/components/resize-container/themes/dark/resize-indicator.fluent.css.js.map +1 -1
- package/components/resize-container/themes/dark/resize-indicator.indigo.css.js +1 -1
- package/components/resize-container/themes/dark/resize-indicator.indigo.css.js.map +1 -1
- package/components/resize-container/themes/dark/resize-indicator.material.css.js +1 -1
- package/components/resize-container/themes/dark/resize-indicator.material.css.js.map +1 -1
- package/components/resize-container/themes/dark/resize-indicator.shared.css.js +1 -1
- package/components/resize-container/themes/dark/resize-indicator.shared.css.js.map +1 -1
- package/components/resize-container/themes/light/resize-indicator.bootstrap.css.js +1 -1
- package/components/resize-container/themes/light/resize-indicator.bootstrap.css.js.map +1 -1
- package/components/resize-container/themes/light/resize-indicator.fluent.css.js +1 -1
- package/components/resize-container/themes/light/resize-indicator.fluent.css.js.map +1 -1
- package/components/resize-container/themes/light/resize-indicator.indigo.css.js +1 -1
- package/components/resize-container/themes/light/resize-indicator.indigo.css.js.map +1 -1
- package/components/resize-container/themes/light/resize-indicator.material.css.js +1 -1
- package/components/resize-container/themes/light/resize-indicator.material.css.js.map +1 -1
- package/components/resize-container/themes/light/resize-indicator.shared.css.js +1 -1
- package/components/resize-container/themes/light/resize-indicator.shared.css.js.map +1 -1
- package/components/resize-container/types.d.ts +2 -0
- package/components/resize-container/types.js.map +1 -1
- package/components/select/select.d.ts +4 -4
- package/components/select/select.js.map +1 -1
- package/components/select/themes/dark/select.bootstrap.css.js +1 -1
- package/components/select/themes/dark/select.bootstrap.css.js.map +1 -1
- package/components/select/themes/dark/select.fluent.css.js +1 -1
- package/components/select/themes/dark/select.fluent.css.js.map +1 -1
- package/components/select/themes/dark/select.indigo.css.js +1 -1
- package/components/select/themes/dark/select.indigo.css.js.map +1 -1
- package/components/select/themes/dark/select.material.css.js +1 -1
- package/components/select/themes/dark/select.material.css.js.map +1 -1
- package/components/select/themes/light/select.bootstrap.css.js +1 -1
- package/components/select/themes/light/select.bootstrap.css.js.map +1 -1
- package/components/select/themes/light/select.fluent.css.js +1 -1
- package/components/select/themes/light/select.fluent.css.js.map +1 -1
- package/components/select/themes/light/select.indigo.css.js +1 -1
- package/components/select/themes/light/select.indigo.css.js.map +1 -1
- package/components/select/themes/light/select.material.css.js +1 -1
- package/components/select/themes/light/select.material.css.js.map +1 -1
- package/components/select/themes/light/select.shared.css.js +1 -1
- package/components/select/themes/light/select.shared.css.js.map +1 -1
- package/components/slider/range-slider.d.ts +5 -3
- package/components/slider/range-slider.js.map +1 -1
- package/components/slider/slider-base.d.ts +3 -2
- package/components/slider/slider-base.js +1 -3
- package/components/slider/slider-base.js.map +1 -1
- package/components/slider/slider-label.d.ts +10 -0
- package/components/slider/slider-label.js.map +1 -1
- package/components/slider/themes/dark/slider.bootstrap.css.js +1 -1
- package/components/slider/themes/dark/slider.bootstrap.css.js.map +1 -1
- package/components/slider/themes/dark/slider.fluent.css.js +1 -1
- package/components/slider/themes/dark/slider.fluent.css.js.map +1 -1
- package/components/slider/themes/dark/slider.indigo.css.js +1 -1
- package/components/slider/themes/dark/slider.indigo.css.js.map +1 -1
- package/components/slider/themes/dark/slider.material.css.js +1 -1
- package/components/slider/themes/dark/slider.material.css.js.map +1 -1
- package/components/slider/themes/light/slider.bootstrap.css.js +1 -1
- package/components/slider/themes/light/slider.bootstrap.css.js.map +1 -1
- package/components/slider/themes/light/slider.fluent.css.js +1 -1
- package/components/slider/themes/light/slider.fluent.css.js.map +1 -1
- package/components/slider/themes/light/slider.indigo.css.js +1 -1
- package/components/slider/themes/light/slider.indigo.css.js.map +1 -1
- package/components/slider/themes/light/slider.material.css.js +1 -1
- package/components/slider/themes/light/slider.material.css.js.map +1 -1
- package/components/snackbar/themes/dark/snackbar.bootstrap.css.js +1 -1
- package/components/snackbar/themes/dark/snackbar.bootstrap.css.js.map +1 -1
- package/components/snackbar/themes/dark/snackbar.fluent.css.js +1 -1
- package/components/snackbar/themes/dark/snackbar.fluent.css.js.map +1 -1
- package/components/snackbar/themes/dark/snackbar.indigo.css.js +1 -1
- package/components/snackbar/themes/dark/snackbar.indigo.css.js.map +1 -1
- package/components/snackbar/themes/dark/snackbar.material.css.js +1 -1
- package/components/snackbar/themes/dark/snackbar.material.css.js.map +1 -1
- package/components/snackbar/themes/light/snackbar.bootstrap.css.js +1 -1
- package/components/snackbar/themes/light/snackbar.bootstrap.css.js.map +1 -1
- package/components/snackbar/themes/light/snackbar.fluent.css.js +1 -1
- package/components/snackbar/themes/light/snackbar.fluent.css.js.map +1 -1
- package/components/snackbar/themes/light/snackbar.indigo.css.js +1 -1
- package/components/snackbar/themes/light/snackbar.indigo.css.js.map +1 -1
- package/components/snackbar/themes/light/snackbar.material.css.js +1 -1
- package/components/snackbar/themes/light/snackbar.material.css.js.map +1 -1
- package/components/snackbar/themes/light/snackbar.shared.css.js +1 -1
- package/components/snackbar/themes/light/snackbar.shared.css.js.map +1 -1
- package/components/stepper/animations.d.ts +2 -1
- package/components/stepper/animations.js.map +1 -1
- package/components/stepper/step.d.ts +8 -3
- package/components/stepper/step.js.map +1 -1
- package/components/stepper/stepper.common.d.ts +8 -4
- package/components/stepper/stepper.common.js.map +1 -1
- package/components/stepper/stepper.d.ts +6 -5
- package/components/stepper/stepper.js.map +1 -1
- package/components/stepper/themes/step/dark/step.bootstrap.css.js +1 -1
- package/components/stepper/themes/step/dark/step.bootstrap.css.js.map +1 -1
- package/components/stepper/themes/step/dark/step.fluent.css.js +1 -1
- package/components/stepper/themes/step/dark/step.fluent.css.js.map +1 -1
- package/components/stepper/themes/step/dark/step.indigo.css.js +1 -1
- package/components/stepper/themes/step/dark/step.indigo.css.js.map +1 -1
- package/components/stepper/themes/step/dark/step.material.css.js +1 -1
- package/components/stepper/themes/step/dark/step.material.css.js.map +1 -1
- package/components/stepper/themes/step/light/step.bootstrap.css.js +1 -1
- package/components/stepper/themes/step/light/step.bootstrap.css.js.map +1 -1
- package/components/stepper/themes/step/light/step.fluent.css.js +1 -1
- package/components/stepper/themes/step/light/step.fluent.css.js.map +1 -1
- package/components/stepper/themes/step/light/step.indigo.css.js +1 -1
- package/components/stepper/themes/step/light/step.indigo.css.js.map +1 -1
- package/components/stepper/themes/step/light/step.material.css.js +1 -1
- package/components/stepper/themes/step/light/step.material.css.js.map +1 -1
- package/components/stepper/themes/step/step.base.css.js +1 -1
- package/components/stepper/themes/step/step.base.css.js.map +1 -1
- package/components/tabs/tabs.d.ts +3 -2
- package/components/tabs/tabs.js.map +1 -1
- package/components/tabs/themes/dark/tab.bootstrap.css.js +1 -1
- package/components/tabs/themes/dark/tab.bootstrap.css.js.map +1 -1
- package/components/tabs/themes/dark/tab.fluent.css.js +1 -1
- package/components/tabs/themes/dark/tab.fluent.css.js.map +1 -1
- package/components/tabs/themes/dark/tab.indigo.css.js +1 -1
- package/components/tabs/themes/dark/tab.indigo.css.js.map +1 -1
- package/components/tabs/themes/dark/tab.material.css.js +1 -1
- package/components/tabs/themes/dark/tab.material.css.js.map +1 -1
- package/components/tabs/themes/light/tab.bootstrap.css.js +1 -1
- package/components/tabs/themes/light/tab.bootstrap.css.js.map +1 -1
- package/components/tabs/themes/light/tab.fluent.css.js +1 -1
- package/components/tabs/themes/light/tab.fluent.css.js.map +1 -1
- package/components/tabs/themes/light/tab.indigo.css.js +1 -1
- package/components/tabs/themes/light/tab.indigo.css.js.map +1 -1
- package/components/tabs/themes/light/tab.material.css.js +1 -1
- package/components/tabs/themes/light/tab.material.css.js.map +1 -1
- package/components/textarea/textarea.d.ts +2 -2
- package/components/textarea/textarea.js.map +1 -1
- package/components/textarea/themes/dark/textarea.bootstrap.css.js +1 -1
- package/components/textarea/themes/dark/textarea.bootstrap.css.js.map +1 -1
- package/components/textarea/themes/dark/textarea.fluent.css.js +1 -1
- package/components/textarea/themes/dark/textarea.fluent.css.js.map +1 -1
- package/components/textarea/themes/dark/textarea.indigo.css.js +1 -1
- package/components/textarea/themes/dark/textarea.indigo.css.js.map +1 -1
- package/components/textarea/themes/dark/textarea.material.css.js +1 -1
- package/components/textarea/themes/dark/textarea.material.css.js.map +1 -1
- package/components/textarea/themes/light/textarea.bootstrap.css.js +1 -1
- package/components/textarea/themes/light/textarea.bootstrap.css.js.map +1 -1
- package/components/textarea/themes/light/textarea.fluent.css.js +1 -1
- package/components/textarea/themes/light/textarea.fluent.css.js.map +1 -1
- package/components/textarea/themes/light/textarea.indigo.css.js +1 -1
- package/components/textarea/themes/light/textarea.indigo.css.js.map +1 -1
- package/components/textarea/themes/light/textarea.material.css.js +1 -1
- package/components/textarea/themes/light/textarea.material.css.js.map +1 -1
- package/components/tile-manager/position.d.ts +4 -0
- package/components/tile-manager/position.js +18 -0
- package/components/tile-manager/position.js.map +1 -1
- package/components/tile-manager/{tile-util.d.ts → resize-state.d.ts} +7 -37
- package/components/tile-manager/resize-state.js +178 -0
- package/components/tile-manager/resize-state.js.map +1 -0
- package/components/tile-manager/resize-util.d.ts +8 -0
- package/components/tile-manager/resize-util.js +84 -0
- package/components/tile-manager/resize-util.js.map +1 -0
- package/components/tile-manager/serializer.d.ts +1 -6
- package/components/tile-manager/serializer.js +5 -26
- package/components/tile-manager/serializer.js.map +1 -1
- package/components/tile-manager/themes/dark/tile-manager.bootstrap.css.js +1 -1
- package/components/tile-manager/themes/dark/tile-manager.bootstrap.css.js.map +1 -1
- package/components/tile-manager/themes/dark/tile-manager.fluent.css.js +1 -1
- package/components/tile-manager/themes/dark/tile-manager.fluent.css.js.map +1 -1
- package/components/tile-manager/themes/dark/tile-manager.indigo.css.js +1 -1
- package/components/tile-manager/themes/dark/tile-manager.indigo.css.js.map +1 -1
- package/components/tile-manager/themes/dark/tile-manager.material.css.js +1 -1
- package/components/tile-manager/themes/dark/tile-manager.material.css.js.map +1 -1
- package/components/tile-manager/themes/light/tile-manager.bootstrap.css.js +1 -1
- package/components/tile-manager/themes/light/tile-manager.bootstrap.css.js.map +1 -1
- package/components/tile-manager/themes/light/tile-manager.fluent.css.js +1 -1
- package/components/tile-manager/themes/light/tile-manager.fluent.css.js.map +1 -1
- package/components/tile-manager/themes/light/tile-manager.indigo.css.js +1 -1
- package/components/tile-manager/themes/light/tile-manager.indigo.css.js.map +1 -1
- package/components/tile-manager/themes/light/tile-manager.material.css.js +1 -1
- package/components/tile-manager/themes/light/tile-manager.material.css.js.map +1 -1
- package/components/tile-manager/themes/light/tile-manager.shared.css.js +1 -1
- package/components/tile-manager/themes/light/tile-manager.shared.css.js.map +1 -1
- package/components/tile-manager/themes/shared/tile/tile.common.css.js +1 -1
- package/components/tile-manager/themes/shared/tile/tile.common.css.js.map +1 -1
- package/components/tile-manager/themes/shared/tile-manager.common.css.js +1 -1
- package/components/tile-manager/themes/shared/tile-manager.common.css.js.map +1 -1
- package/components/tile-manager/themes/tile-manager.base.css.js +1 -1
- package/components/tile-manager/themes/tile-manager.base.css.js.map +1 -1
- package/components/tile-manager/themes/tile.base.css.js +1 -1
- package/components/tile-manager/themes/tile.base.css.js.map +1 -1
- package/components/tile-manager/tile-ghost-util.d.ts +3 -0
- package/components/tile-manager/tile-ghost-util.js +49 -0
- package/components/tile-manager/tile-ghost-util.js.map +1 -0
- package/components/tile-manager/tile-manager.d.ts +23 -14
- package/components/tile-manager/tile-manager.js +9 -17
- package/components/tile-manager/tile-manager.js.map +1 -1
- package/components/tile-manager/tile.d.ts +59 -43
- package/components/tile-manager/tile.js +126 -97
- package/components/tile-manager/tile.js.map +1 -1
- package/components/tile-manager/types.d.ts +36 -0
- package/components/tile-manager/types.js +2 -0
- package/components/tile-manager/types.js.map +1 -0
- package/components/toast/themes/dark/toast.bootstrap.css.js +1 -1
- package/components/toast/themes/dark/toast.bootstrap.css.js.map +1 -1
- package/components/toast/themes/dark/toast.fluent.css.js +1 -1
- package/components/toast/themes/dark/toast.fluent.css.js.map +1 -1
- package/components/toast/themes/dark/toast.indigo.css.js +1 -1
- package/components/toast/themes/dark/toast.indigo.css.js.map +1 -1
- package/components/toast/themes/dark/toast.material.css.js +1 -1
- package/components/toast/themes/dark/toast.material.css.js.map +1 -1
- package/components/toast/themes/dark/toast.shared.css.js +1 -1
- package/components/toast/themes/dark/toast.shared.css.js.map +1 -1
- package/components/toast/themes/light/toast.bootstrap.css.js +1 -1
- package/components/toast/themes/light/toast.bootstrap.css.js.map +1 -1
- package/components/toast/themes/light/toast.fluent.css.js +1 -1
- package/components/toast/themes/light/toast.fluent.css.js.map +1 -1
- package/components/toast/themes/light/toast.indigo.css.js +1 -1
- package/components/toast/themes/light/toast.indigo.css.js.map +1 -1
- package/components/toast/themes/light/toast.material.css.js +1 -1
- package/components/toast/themes/light/toast.material.css.js.map +1 -1
- package/components/toast/themes/light/toast.shared.css.js +1 -1
- package/components/toast/themes/light/toast.shared.css.js.map +1 -1
- package/components/tree/themes/dark/container.bootstrap.css.js +1 -1
- package/components/tree/themes/dark/container.bootstrap.css.js.map +1 -1
- package/components/tree/themes/dark/container.fluent.css.js +1 -1
- package/components/tree/themes/dark/container.fluent.css.js.map +1 -1
- package/components/tree/themes/dark/container.indigo.css.js +1 -1
- package/components/tree/themes/dark/container.indigo.css.js.map +1 -1
- package/components/tree/themes/dark/container.material.css.js +1 -1
- package/components/tree/themes/dark/container.material.css.js.map +1 -1
- package/components/tree/themes/light/container.bootstrap.css.js +1 -1
- package/components/tree/themes/light/container.bootstrap.css.js.map +1 -1
- package/components/tree/themes/light/container.fluent.css.js +1 -1
- package/components/tree/themes/light/container.fluent.css.js.map +1 -1
- package/components/tree/themes/light/container.indigo.css.js +1 -1
- package/components/tree/themes/light/container.indigo.css.js.map +1 -1
- package/components/tree/themes/light/container.material.css.js +1 -1
- package/components/tree/themes/light/container.material.css.js.map +1 -1
- package/components/tree/tree.common.d.ts +4 -6
- package/components/tree/tree.common.js.map +1 -1
- package/components/tree/tree.d.ts +2 -1
- package/components/tree/tree.js.map +1 -1
- package/components/tree/tree.selection.js.map +1 -1
- package/components/types.d.ts +30 -2
- package/components/types.js.map +1 -1
- package/components/validation-container/themes/dark/validator.bootstrap.css.js +1 -1
- package/components/validation-container/themes/dark/validator.bootstrap.css.js.map +1 -1
- package/components/validation-container/themes/dark/validator.fluent.css.js +1 -1
- package/components/validation-container/themes/dark/validator.fluent.css.js.map +1 -1
- package/components/validation-container/themes/dark/validator.indigo.css.js +1 -1
- package/components/validation-container/themes/dark/validator.indigo.css.js.map +1 -1
- package/components/validation-container/themes/dark/validator.material.css.js +1 -1
- package/components/validation-container/themes/dark/validator.material.css.js.map +1 -1
- package/components/validation-container/themes/light/validator.bootstrap.css.js +1 -1
- package/components/validation-container/themes/light/validator.bootstrap.css.js.map +1 -1
- package/components/validation-container/themes/light/validator.fluent.css.js +1 -1
- package/components/validation-container/themes/light/validator.fluent.css.js.map +1 -1
- package/components/validation-container/themes/light/validator.indigo.css.js +1 -1
- package/components/validation-container/themes/light/validator.indigo.css.js.map +1 -1
- package/components/validation-container/themes/light/validator.material.css.js +1 -1
- package/components/validation-container/themes/light/validator.material.css.js.map +1 -1
- package/custom-elements.json +2669 -823
- package/igniteui-webcomponents.css-data.json +2 -2
- package/igniteui-webcomponents.html-data.json +1 -1
- package/index.d.ts +17 -6
- package/index.js +3 -1
- package/index.js.map +1 -1
- package/package.json +2 -2
- package/theming/types.d.ts +2 -2
- package/theming/types.js.map +1 -1
- package/web-types.json +3 -3
- package/components/common/decorators/blazorTypeOverride.d.ts +0 -7
- package/components/common/decorators/blazorTypeOverride.js +0 -4
- package/components/common/decorators/blazorTypeOverride.js.map +0 -1
- package/components/progress/themes/linear/shared/linear.progress.bootstrap.css.js +0 -3
- package/components/progress/themes/linear/shared/linear.progress.bootstrap.css.js.map +0 -1
- package/components/tile-manager/tile-util.js +0 -288
- package/components/tile-manager/tile-util.js.map +0 -1
- /package/components/{progress/themes/linear/shared/linear.progress.bootstrap.css.d.ts → card/themes/shared/container/card.bootstrap.css.d.ts} +0 -0
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import { css } from 'lit';
|
|
2
|
-
export const styles = css `:host([variant=flat]){--shadow-color: var(--ig-icon-button-shadow-color, transparent);--background: var(--ig-icon-button-background, transparent);--foreground: var(--ig-icon-button-foreground, var(--ig-gray-900));--hover-background: var(--ig-icon-button-hover-background, hsl(from var(--ig-gray-500) h s l/0.08));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-gray-900));--focus-background: var(--ig-icon-button-focus-background, hsl(from var(--ig-gray-500) h s l/0.16));--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-gray-900));--focus-hover-background: var(--ig-icon-button-focus-hover-background, hsl(from var(--ig-gray-500) h s l/0.24));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-gray-900));--active-background: var(--ig-icon-button-active-background, hsl(from var(--ig-gray-500) h s l/0.32));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-gray-900));--border-color: var(--ig-icon-button-border-color, transparent);--focus-border-color: var(--ig-icon-button-focus-border-color, transparent);--disabled-background: var(--ig-icon-button-disabled-background, transparent);--disabled-foreground: var(--ig-icon-button-disabled-foreground, var(--ig-gray-500));--disabled-border-color: var(--ig-icon-button-disabled-border-color, transparent);--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 1) * 1.25rem), 1.25rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(2.25rem, -1 * 2.25rem), var(--is-medium, 1) * max(1.875rem, -1 * 1.875rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));--default-size: var(--ig-icon-button-default-size, 3)}:host([variant=outlined]){--shadow-color: var(--ig-icon-button-shadow-color, transparent);--background: var(--ig-icon-button-background, transparent);--foreground: var(--ig-icon-button-foreground, var(--ig-gray-900));--hover-background: var(--ig-icon-button-hover-background, hsl(from var(--ig-gray-500) h s l/0.08));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-gray-900));--focus-background: var(--ig-icon-button-focus-background, hsl(from var(--ig-gray-500) h s l/0.16));--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-gray-900));--focus-hover-background: var(--ig-icon-button-focus-hover-background, hsl(from var(--ig-gray-500) h s l/0.24));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-gray-900));--active-background: var(--ig-icon-button-active-background, hsl(from var(--ig-gray-500) h s l/0.32));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-gray-900));--border-color: var(--ig-icon-button-border-color, var(--ig-gray-300));--focus-border-color: var(--ig-icon-button-focus-border-color, var(--ig-gray-300));--disabled-background: var(--ig-icon-button-disabled-background, transparent);--disabled-foreground: var(--ig-icon-button-disabled-foreground, var(--ig-gray-500));--disabled-border-color: var(--ig-icon-button-disabled-border-color, var(--ig-gray-300));--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 1) * 1.25rem), 1.25rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(2.25rem, -1 * 2.25rem), var(--is-medium, 1) * max(1.875rem, -1 * 1.875rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));--default-size: var(--ig-icon-button-default-size, 3)}:host([variant=contained]){--shadow-color: var(--ig-icon-button-shadow-color, transparent);--background: var(--ig-icon-button-background, hsl(from var(--ig-gray-900) h s l/0.08));--foreground: var(--ig-icon-button-foreground, var(--ig-gray-900));--hover-background: var(--ig-icon-button-hover-background, hsl(from var(--ig-gray-900) h s l/0.12));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-gray-900));--focus-background: var(--ig-icon-button-focus-background, hsl(from var(--ig-gray-900) h s l/0.16));--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-gray-900));--focus-hover-background: var(--ig-icon-button-focus-hover-background, hsl(from var(--ig-gray-900) h s l/0.2));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-gray-900));--active-background: var(--ig-icon-button-active-background, hsl(from var(--ig-gray-900) h s l/0.24));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-gray-900));--border-color: var(--ig-icon-button-border-color, transparent);--focus-border-color: var(--ig-icon-button-focus-border-color, transparent);--disabled-background: var(--ig-icon-button-disabled-background, hsl(from var(--ig-gray-900) h s l/0.04));--disabled-foreground: var(--ig-icon-button-disabled-foreground, var(--ig-gray-500));--disabled-border-color: var(--ig-icon-button-disabled-border-color, transparent);--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 1) * 1.25rem), 1.25rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(2.25rem, -1 * 2.25rem), var(--is-medium, 1) * max(1.875rem, -1 * 1.875rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));--default-size: var(--ig-icon-button-default-size, 3)}`;
|
|
2
|
+
export const styles = css `:host([variant=flat]){--shadow-color: var(--ig-icon-button-shadow-color, transparent);--background: var(--ig-icon-button-background, transparent);--foreground: var(--ig-icon-button-foreground, var(--ig-gray-900));--hover-background: var(--ig-icon-button-hover-background, hsl(from var(--ig-gray-500) h s l/0.08));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-gray-900));--focus-background: var(--ig-icon-button-focus-background, hsl(from var(--ig-gray-500) h s l/0.16));--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-gray-900));--focus-hover-background: var(--ig-icon-button-focus-hover-background, hsl(from var(--ig-gray-500) h s l/0.24));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-gray-900));--active-background: var(--ig-icon-button-active-background, hsl(from var(--ig-gray-500) h s l/0.32));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-gray-900));--border-color: var(--ig-icon-button-border-color, transparent);--focus-border-color: var(--ig-icon-button-focus-border-color, transparent);--disabled-background: var(--ig-icon-button-disabled-background, transparent);--disabled-foreground: var(--ig-icon-button-disabled-foreground, var(--ig-gray-500));--disabled-border-color: var(--ig-icon-button-disabled-border-color, transparent);--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 1) * 1.25rem), 1.25rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(2.25rem, -1 * 2.25rem), var(--is-medium, 1) * max(1.875rem, -1 * 1.875rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));--default-size: var(--ig-icon-button-default-size, 3);--ig-theme: material}:host([variant=outlined]){--shadow-color: var(--ig-icon-button-shadow-color, transparent);--background: var(--ig-icon-button-background, transparent);--foreground: var(--ig-icon-button-foreground, var(--ig-gray-900));--hover-background: var(--ig-icon-button-hover-background, hsl(from var(--ig-gray-500) h s l/0.08));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-gray-900));--focus-background: var(--ig-icon-button-focus-background, hsl(from var(--ig-gray-500) h s l/0.16));--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-gray-900));--focus-hover-background: var(--ig-icon-button-focus-hover-background, hsl(from var(--ig-gray-500) h s l/0.24));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-gray-900));--active-background: var(--ig-icon-button-active-background, hsl(from var(--ig-gray-500) h s l/0.32));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-gray-900));--border-color: var(--ig-icon-button-border-color, var(--ig-gray-300));--focus-border-color: var(--ig-icon-button-focus-border-color, var(--ig-gray-300));--disabled-background: var(--ig-icon-button-disabled-background, transparent);--disabled-foreground: var(--ig-icon-button-disabled-foreground, var(--ig-gray-500));--disabled-border-color: var(--ig-icon-button-disabled-border-color, var(--ig-gray-300));--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 1) * 1.25rem), 1.25rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(2.25rem, -1 * 2.25rem), var(--is-medium, 1) * max(1.875rem, -1 * 1.875rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));--default-size: var(--ig-icon-button-default-size, 3);--ig-theme: material}:host([variant=contained]){--shadow-color: var(--ig-icon-button-shadow-color, transparent);--background: var(--ig-icon-button-background, hsl(from var(--ig-gray-900) h s l/0.08));--foreground: var(--ig-icon-button-foreground, var(--ig-gray-900));--hover-background: var(--ig-icon-button-hover-background, hsl(from var(--ig-gray-900) h s l/0.12));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-gray-900));--focus-background: var(--ig-icon-button-focus-background, hsl(from var(--ig-gray-900) h s l/0.16));--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-gray-900));--focus-hover-background: var(--ig-icon-button-focus-hover-background, hsl(from var(--ig-gray-900) h s l/0.2));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-gray-900));--active-background: var(--ig-icon-button-active-background, hsl(from var(--ig-gray-900) h s l/0.24));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-gray-900));--border-color: var(--ig-icon-button-border-color, transparent);--focus-border-color: var(--ig-icon-button-focus-border-color, transparent);--disabled-background: var(--ig-icon-button-disabled-background, hsl(from var(--ig-gray-900) h s l/0.04));--disabled-foreground: var(--ig-icon-button-disabled-foreground, var(--ig-gray-500));--disabled-border-color: var(--ig-icon-button-disabled-border-color, transparent);--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 1) * 1.25rem), 1.25rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(2.25rem, -1 * 2.25rem), var(--is-medium, 1) * max(1.875rem, -1 * 1.875rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));--default-size: var(--ig-icon-button-default-size, 3);--ig-theme: material}`;
|
|
3
3
|
//# sourceMappingURL=icon-button.material.css.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"icon-button.material.css.js","sourceRoot":"","sources":["../../../../../../src/components/button/themes/icon-button/light/icon-button.material.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,
|
|
1
|
+
{"version":3,"file":"icon-button.material.css.js","sourceRoot":"","sources":["../../../../../../src/components/button/themes/icon-button/light/icon-button.material.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,2oKAA2oK,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host([variant=flat]){--shadow-color: var(--ig-icon-button-shadow-color, transparent);--background: var(--ig-icon-button-background, transparent);--foreground: var(--ig-icon-button-foreground, var(--ig-gray-900));--hover-background: var(--ig-icon-button-hover-background, hsl(from var(--ig-gray-500) h s l/0.08));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-gray-900));--focus-background: var(--ig-icon-button-focus-background, hsl(from var(--ig-gray-500) h s l/0.16));--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-gray-900));--focus-hover-background: var(--ig-icon-button-focus-hover-background, hsl(from var(--ig-gray-500) h s l/0.24));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-gray-900));--active-background: var(--ig-icon-button-active-background, hsl(from var(--ig-gray-500) h s l/0.32));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-gray-900));--border-color: var(--ig-icon-button-border-color, transparent);--focus-border-color: var(--ig-icon-button-focus-border-color, transparent);--disabled-background: var(--ig-icon-button-disabled-background, transparent);--disabled-foreground: var(--ig-icon-button-disabled-foreground, var(--ig-gray-500));--disabled-border-color: var(--ig-icon-button-disabled-border-color, transparent);--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 1) * 1.25rem), 1.25rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(2.25rem, -1 * 2.25rem), var(--is-medium, 1) * max(1.875rem, -1 * 1.875rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));--default-size: var(--ig-icon-button-default-size, 3);--ig-theme: material}:host([variant=outlined]){--shadow-color: var(--ig-icon-button-shadow-color, transparent);--background: var(--ig-icon-button-background, transparent);--foreground: var(--ig-icon-button-foreground, var(--ig-gray-900));--hover-background: var(--ig-icon-button-hover-background, hsl(from var(--ig-gray-500) h s l/0.08));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-gray-900));--focus-background: var(--ig-icon-button-focus-background, hsl(from var(--ig-gray-500) h s l/0.16));--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-gray-900));--focus-hover-background: var(--ig-icon-button-focus-hover-background, hsl(from var(--ig-gray-500) h s l/0.24));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-gray-900));--active-background: var(--ig-icon-button-active-background, hsl(from var(--ig-gray-500) h s l/0.32));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-gray-900));--border-color: var(--ig-icon-button-border-color, var(--ig-gray-300));--focus-border-color: var(--ig-icon-button-focus-border-color, var(--ig-gray-300));--disabled-background: var(--ig-icon-button-disabled-background, transparent);--disabled-foreground: var(--ig-icon-button-disabled-foreground, var(--ig-gray-500));--disabled-border-color: var(--ig-icon-button-disabled-border-color, var(--ig-gray-300));--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 1) * 1.25rem), 1.25rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(2.25rem, -1 * 2.25rem), var(--is-medium, 1) * max(1.875rem, -1 * 1.875rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));--default-size: var(--ig-icon-button-default-size, 3);--ig-theme: material}:host([variant=contained]){--shadow-color: var(--ig-icon-button-shadow-color, transparent);--background: var(--ig-icon-button-background, hsl(from var(--ig-gray-900) h s l/0.08));--foreground: var(--ig-icon-button-foreground, var(--ig-gray-900));--hover-background: var(--ig-icon-button-hover-background, hsl(from var(--ig-gray-900) h s l/0.12));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-gray-900));--focus-background: var(--ig-icon-button-focus-background, hsl(from var(--ig-gray-900) h s l/0.16));--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-gray-900));--focus-hover-background: var(--ig-icon-button-focus-hover-background, hsl(from var(--ig-gray-900) h s l/0.2));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-gray-900));--active-background: var(--ig-icon-button-active-background, hsl(from var(--ig-gray-900) h s l/0.24));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-gray-900));--border-color: var(--ig-icon-button-border-color, transparent);--focus-border-color: var(--ig-icon-button-focus-border-color, transparent);--disabled-background: var(--ig-icon-button-disabled-background, hsl(from var(--ig-gray-900) h s l/0.04));--disabled-foreground: var(--ig-icon-button-disabled-foreground, var(--ig-gray-500));--disabled-border-color: var(--ig-icon-button-disabled-border-color, transparent);--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 1) * 1.25rem), 1.25rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(2.25rem, -1 * 2.25rem), var(--is-medium, 1) * max(1.875rem, -1 * 1.875rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));--default-size: var(--ig-icon-button-default-size, 3);--ig-theme: material}`;\n"]}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import { css } from 'lit';
|
|
2
|
-
export const styles = css `[part~=base]{transition:box-shadow .15s ease-out,color .15s ease-out;padding:max(var(--is-large, 1)*max(15px, -1 * 15px)*var(--ig-spacing-large, var(--ig-spacing, --ig-spacing)),var(--is-medium, 1)*max(10px, -1 * 10px)*var(--ig-spacing-medium, var(--ig-spacing, --ig-spacing)),var(--is-small, 1)*max(7px, -1 * 7px)*var(--ig-spacing-small, var(--ig-spacing, --ig-spacing)))}:host([variant=flat]){--shadow-color: var(--ig-icon-button-shadow-color, hsl(from var(--ig-primary-600) h s l/0.5));--background: var(--ig-icon-button-background, transparent);--foreground: var(--ig-icon-button-foreground, var(--ig-primary-500));--hover-background: var(--ig-icon-button-hover-background, transparent);--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-primary-600));--focus-background: var(--ig-icon-button-focus-background, transparent);--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-primary-500));--focus-hover-background: var(--ig-icon-button-focus-hover-background, transparent);--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-primary-600));--active-background: var(--ig-icon-button-active-background, transparent);--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-primary-800));--border-color: var(--ig-icon-button-border-color, transparent);--focus-border-color: var(--ig-icon-button-focus-border-color, transparent);--disabled-background: var(--ig-icon-button-disabled-background, transparent);--disabled-foreground: var(--ig-icon-button-disabled-foreground, var(--ig-primary-200));--disabled-border-color: var(--ig-icon-button-disabled-border-color, transparent);--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.2) * 1.25rem), 1.25rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(3rem, -1 * 3rem), var(--is-medium, 1) * max(2.375rem, -1 * 2.375rem), var(--is-small, 1) * max(2rem, -1 * 2rem)));--default-size: var(--ig-icon-button-default-size, 2);--component-size: var(--ig-size, var(--default-size))}:host([variant=flat]) [part~=base]:hover igc-icon{color:var(--hover-foreground)}:host([variant=flat]) [part~=base]:active igc-icon{color:var(--active-foreground)}:host([variant=flat]) [part="base focused"]{box-shadow:0 0 0 .25rem var(--shadow-color)}:host([variant=flat]) [part="base focused"] igc-icon{color:var(--focus-foreground)}:host([variant=flat]) [part="base focused"]:hover igc-icon{color:var(--focus-hover-foreground)}:host([variant=contained]){--shadow-color: var(--ig-icon-button-shadow-color, hsl(from var(--ig-primary-600) h s l/0.5));--background: var(--ig-icon-button-background, var(--ig-primary-500));--foreground: var(--ig-icon-button-foreground, var(--ig-primary-600-contrast));--hover-background: var(--ig-icon-button-hover-background, var(--ig-primary-600));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-primary-600-contrast));--focus-background: var(--ig-icon-button-focus-background, var(--ig-primary-500));--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-primary-600-contrast));--focus-hover-background: var(--ig-icon-button-focus-hover-background, var(--ig-primary-600));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-primary-600-contrast));--active-background: var(--ig-icon-button-active-background, var(--ig-primary-800));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-primary-800-contrast));--border-color: var(--ig-icon-button-border-color, transparent);--focus-border-color: var(--ig-icon-button-focus-border-color, transparent);--disabled-background: var(--ig-icon-button-disabled-background, var(--ig-primary-50));--disabled-foreground: var(--ig-icon-button-disabled-foreground, var(--ig-primary-200));--disabled-border-color: var(--ig-icon-button-disabled-border-color, transparent);--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.2) * 1.25rem), 1.25rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(3rem, -1 * 3rem), var(--is-medium, 1) * max(2.375rem, -1 * 2.375rem), var(--is-small, 1) * max(2rem, -1 * 2rem)));--default-size: var(--ig-icon-button-default-size, 2);--component-size: var(--ig-size, var(--default-size))}:host([variant=contained]) [part="base focused"]{box-shadow:0 0 0 .25rem var(--shadow-color)}:host([variant=outlined]){--shadow-color: var(--ig-icon-button-shadow-color, hsl(from var(--ig-primary-600) h s l/0.5));--background: var(--ig-icon-button-background, transparent);--foreground: var(--ig-icon-button-foreground, var(--ig-primary-500));--hover-background: var(--ig-icon-button-hover-background, var(--ig-primary-600));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-primary-600-contrast));--focus-background: var(--ig-icon-button-focus-background, var(--ig-primary-500));--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-primary-600-contrast));--focus-hover-background: var(--ig-icon-button-focus-hover-background, var(--ig-primary-600));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-primary-600-contrast));--active-background: var(--ig-icon-button-active-background, var(--ig-primary-800));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-primary-800-contrast));--border-color: var(--ig-icon-button-border-color, var(--ig-primary-500));--focus-border-color: var(--ig-icon-button-focus-border-color, var(--ig-primary-800));--disabled-background: var(--ig-icon-button-disabled-background, transparent);--disabled-foreground: var(--ig-icon-button-disabled-foreground, var(--ig-primary-200));--disabled-border-color: var(--ig-icon-button-disabled-border-color, var(--ig-primary-50));--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.2) * 1.25rem), 1.25rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(3rem, -1 * 3rem), var(--is-medium, 1) * max(2.375rem, -1 * 2.375rem), var(--is-small, 1) * max(2rem, -1 * 2rem)));--default-size: var(--ig-icon-button-default-size, 2);--component-size: var(--ig-size, var(--default-size))}:host([variant=outlined]) [part~=base]:hover{border-color:var(--hover-background)}:host([variant=outlined]) [part~=base]:hover igc-icon{color:var(--hover-foreground)}:host([variant=outlined]) [part~=base]:active{border-color:var(--focus-border-color)}:host([variant=outlined]) [part~=base]:active igc-icon{color:var(--active-foreground)}:host([variant=outlined]) [part="base focused"]{border-color:var(--border-color);box-shadow:0 0 0 .25rem var(--shadow-color)}:host([variant=outlined]) [part="base focused"] igc-icon{color:var(--focus-foreground)}:host([variant=outlined]) [part="base focused"]:hover{border-color:var(--focus-hover-background)}:host([variant=outlined]) [part="base focused"]:hover igc-icon{color:var(--focus-hover-foreground)}:host([variant=outlined]) [part="base focused"]:active{border-color:var(--focus-border-color)}`;
|
|
2
|
+
export const styles = css `[part~=base]{transition:box-shadow .15s ease-out,color .15s ease-out;padding:max(var(--is-large, 1)*max(15px, -1 * 15px)*var(--ig-spacing-large, var(--ig-spacing, --ig-spacing)),var(--is-medium, 1)*max(10px, -1 * 10px)*var(--ig-spacing-medium, var(--ig-spacing, --ig-spacing)),var(--is-small, 1)*max(7px, -1 * 7px)*var(--ig-spacing-small, var(--ig-spacing, --ig-spacing)))}:host([variant=flat]){--shadow-color: var(--ig-icon-button-shadow-color, hsl(from var(--ig-primary-600) h s l/0.5));--background: var(--ig-icon-button-background, transparent);--foreground: var(--ig-icon-button-foreground, var(--ig-primary-500));--hover-background: var(--ig-icon-button-hover-background, transparent);--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-primary-600));--focus-background: var(--ig-icon-button-focus-background, transparent);--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-primary-500));--focus-hover-background: var(--ig-icon-button-focus-hover-background, transparent);--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-primary-600));--active-background: var(--ig-icon-button-active-background, transparent);--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-primary-800));--border-color: var(--ig-icon-button-border-color, transparent);--focus-border-color: var(--ig-icon-button-focus-border-color, transparent);--disabled-background: var(--ig-icon-button-disabled-background, transparent);--disabled-foreground: var(--ig-icon-button-disabled-foreground, var(--ig-primary-200));--disabled-border-color: var(--ig-icon-button-disabled-border-color, transparent);--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.2) * 1.25rem), 1.25rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(3rem, -1 * 3rem), var(--is-medium, 1) * max(2.375rem, -1 * 2.375rem), var(--is-small, 1) * max(2rem, -1 * 2rem)));--default-size: var(--ig-icon-button-default-size, 2);--ig-theme: bootstrap;--component-size: var(--ig-size, var(--default-size))}:host([variant=flat]) [part~=base]:hover igc-icon{color:var(--hover-foreground)}:host([variant=flat]) [part~=base]:active igc-icon{color:var(--active-foreground)}:host([variant=flat]) [part="base focused"]{box-shadow:0 0 0 .25rem var(--shadow-color)}:host([variant=flat]) [part="base focused"] igc-icon{color:var(--focus-foreground)}:host([variant=flat]) [part="base focused"]:hover igc-icon{color:var(--focus-hover-foreground)}:host([variant=contained]){--shadow-color: var(--ig-icon-button-shadow-color, hsl(from var(--ig-primary-600) h s l/0.5));--background: var(--ig-icon-button-background, var(--ig-primary-500));--foreground: var(--ig-icon-button-foreground, var(--ig-primary-600-contrast));--hover-background: var(--ig-icon-button-hover-background, var(--ig-primary-600));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-primary-600-contrast));--focus-background: var(--ig-icon-button-focus-background, var(--ig-primary-500));--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-primary-600-contrast));--focus-hover-background: var(--ig-icon-button-focus-hover-background, var(--ig-primary-600));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-primary-600-contrast));--active-background: var(--ig-icon-button-active-background, var(--ig-primary-800));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-primary-800-contrast));--border-color: var(--ig-icon-button-border-color, transparent);--focus-border-color: var(--ig-icon-button-focus-border-color, transparent);--disabled-background: var(--ig-icon-button-disabled-background, var(--ig-primary-50));--disabled-foreground: var(--ig-icon-button-disabled-foreground, var(--ig-primary-200));--disabled-border-color: var(--ig-icon-button-disabled-border-color, transparent);--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.2) * 1.25rem), 1.25rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(3rem, -1 * 3rem), var(--is-medium, 1) * max(2.375rem, -1 * 2.375rem), var(--is-small, 1) * max(2rem, -1 * 2rem)));--default-size: var(--ig-icon-button-default-size, 2);--ig-theme: bootstrap;--component-size: var(--ig-size, var(--default-size))}:host([variant=contained]) [part="base focused"]{box-shadow:0 0 0 .25rem var(--shadow-color)}:host([variant=outlined]){--shadow-color: var(--ig-icon-button-shadow-color, hsl(from var(--ig-primary-600) h s l/0.5));--background: var(--ig-icon-button-background, transparent);--foreground: var(--ig-icon-button-foreground, var(--ig-primary-500));--hover-background: var(--ig-icon-button-hover-background, var(--ig-primary-600));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-primary-600-contrast));--focus-background: var(--ig-icon-button-focus-background, var(--ig-primary-500));--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-primary-600-contrast));--focus-hover-background: var(--ig-icon-button-focus-hover-background, var(--ig-primary-600));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-primary-600-contrast));--active-background: var(--ig-icon-button-active-background, var(--ig-primary-800));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-primary-800-contrast));--border-color: var(--ig-icon-button-border-color, var(--ig-primary-500));--focus-border-color: var(--ig-icon-button-focus-border-color, var(--ig-primary-800));--disabled-background: var(--ig-icon-button-disabled-background, transparent);--disabled-foreground: var(--ig-icon-button-disabled-foreground, var(--ig-primary-200));--disabled-border-color: var(--ig-icon-button-disabled-border-color, var(--ig-primary-50));--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.2) * 1.25rem), 1.25rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(3rem, -1 * 3rem), var(--is-medium, 1) * max(2.375rem, -1 * 2.375rem), var(--is-small, 1) * max(2rem, -1 * 2rem)));--default-size: var(--ig-icon-button-default-size, 2);--ig-theme: bootstrap;--component-size: var(--ig-size, var(--default-size))}:host([variant=outlined]) [part~=base]:hover{border-color:var(--hover-background)}:host([variant=outlined]) [part~=base]:hover igc-icon{color:var(--hover-foreground)}:host([variant=outlined]) [part~=base]:active{border-color:var(--focus-border-color)}:host([variant=outlined]) [part~=base]:active igc-icon{color:var(--active-foreground)}:host([variant=outlined]) [part="base focused"]{border-color:var(--border-color);box-shadow:0 0 0 .25rem var(--shadow-color)}:host([variant=outlined]) [part="base focused"] igc-icon{color:var(--focus-foreground)}:host([variant=outlined]) [part="base focused"]:hover{border-color:var(--focus-hover-background)}:host([variant=outlined]) [part="base focused"]:hover igc-icon{color:var(--focus-hover-foreground)}:host([variant=outlined]) [part="base focused"]:active{border-color:var(--focus-border-color)}`;
|
|
3
3
|
//# sourceMappingURL=icon-button.bootstrap.css.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"icon-button.bootstrap.css.js","sourceRoot":"","sources":["../../../../../../src/components/button/themes/icon-button/shared/icon-button.bootstrap.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,
|
|
1
|
+
{"version":3,"file":"icon-button.bootstrap.css.js","sourceRoot":"","sources":["../../../../../../src/components/button/themes/icon-button/shared/icon-button.bootstrap.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,k6NAAk6N,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`[part~=base]{transition:box-shadow .15s ease-out,color .15s ease-out;padding:max(var(--is-large, 1)*max(15px, -1 * 15px)*var(--ig-spacing-large, var(--ig-spacing, --ig-spacing)),var(--is-medium, 1)*max(10px, -1 * 10px)*var(--ig-spacing-medium, var(--ig-spacing, --ig-spacing)),var(--is-small, 1)*max(7px, -1 * 7px)*var(--ig-spacing-small, var(--ig-spacing, --ig-spacing)))}:host([variant=flat]){--shadow-color: var(--ig-icon-button-shadow-color, hsl(from var(--ig-primary-600) h s l/0.5));--background: var(--ig-icon-button-background, transparent);--foreground: var(--ig-icon-button-foreground, var(--ig-primary-500));--hover-background: var(--ig-icon-button-hover-background, transparent);--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-primary-600));--focus-background: var(--ig-icon-button-focus-background, transparent);--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-primary-500));--focus-hover-background: var(--ig-icon-button-focus-hover-background, transparent);--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-primary-600));--active-background: var(--ig-icon-button-active-background, transparent);--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-primary-800));--border-color: var(--ig-icon-button-border-color, transparent);--focus-border-color: var(--ig-icon-button-focus-border-color, transparent);--disabled-background: var(--ig-icon-button-disabled-background, transparent);--disabled-foreground: var(--ig-icon-button-disabled-foreground, var(--ig-primary-200));--disabled-border-color: var(--ig-icon-button-disabled-border-color, transparent);--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.2) * 1.25rem), 1.25rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(3rem, -1 * 3rem), var(--is-medium, 1) * max(2.375rem, -1 * 2.375rem), var(--is-small, 1) * max(2rem, -1 * 2rem)));--default-size: var(--ig-icon-button-default-size, 2);--ig-theme: bootstrap;--component-size: var(--ig-size, var(--default-size))}:host([variant=flat]) [part~=base]:hover igc-icon{color:var(--hover-foreground)}:host([variant=flat]) [part~=base]:active igc-icon{color:var(--active-foreground)}:host([variant=flat]) [part=\"base focused\"]{box-shadow:0 0 0 .25rem var(--shadow-color)}:host([variant=flat]) [part=\"base focused\"] igc-icon{color:var(--focus-foreground)}:host([variant=flat]) [part=\"base focused\"]:hover igc-icon{color:var(--focus-hover-foreground)}:host([variant=contained]){--shadow-color: var(--ig-icon-button-shadow-color, hsl(from var(--ig-primary-600) h s l/0.5));--background: var(--ig-icon-button-background, var(--ig-primary-500));--foreground: var(--ig-icon-button-foreground, var(--ig-primary-600-contrast));--hover-background: var(--ig-icon-button-hover-background, var(--ig-primary-600));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-primary-600-contrast));--focus-background: var(--ig-icon-button-focus-background, var(--ig-primary-500));--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-primary-600-contrast));--focus-hover-background: var(--ig-icon-button-focus-hover-background, var(--ig-primary-600));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-primary-600-contrast));--active-background: var(--ig-icon-button-active-background, var(--ig-primary-800));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-primary-800-contrast));--border-color: var(--ig-icon-button-border-color, transparent);--focus-border-color: var(--ig-icon-button-focus-border-color, transparent);--disabled-background: var(--ig-icon-button-disabled-background, var(--ig-primary-50));--disabled-foreground: var(--ig-icon-button-disabled-foreground, var(--ig-primary-200));--disabled-border-color: var(--ig-icon-button-disabled-border-color, transparent);--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.2) * 1.25rem), 1.25rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(3rem, -1 * 3rem), var(--is-medium, 1) * max(2.375rem, -1 * 2.375rem), var(--is-small, 1) * max(2rem, -1 * 2rem)));--default-size: var(--ig-icon-button-default-size, 2);--ig-theme: bootstrap;--component-size: var(--ig-size, var(--default-size))}:host([variant=contained]) [part=\"base focused\"]{box-shadow:0 0 0 .25rem var(--shadow-color)}:host([variant=outlined]){--shadow-color: var(--ig-icon-button-shadow-color, hsl(from var(--ig-primary-600) h s l/0.5));--background: var(--ig-icon-button-background, transparent);--foreground: var(--ig-icon-button-foreground, var(--ig-primary-500));--hover-background: var(--ig-icon-button-hover-background, var(--ig-primary-600));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-primary-600-contrast));--focus-background: var(--ig-icon-button-focus-background, var(--ig-primary-500));--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-primary-600-contrast));--focus-hover-background: var(--ig-icon-button-focus-hover-background, var(--ig-primary-600));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-primary-600-contrast));--active-background: var(--ig-icon-button-active-background, var(--ig-primary-800));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-primary-800-contrast));--border-color: var(--ig-icon-button-border-color, var(--ig-primary-500));--focus-border-color: var(--ig-icon-button-focus-border-color, var(--ig-primary-800));--disabled-background: var(--ig-icon-button-disabled-background, transparent);--disabled-foreground: var(--ig-icon-button-disabled-foreground, var(--ig-primary-200));--disabled-border-color: var(--ig-icon-button-disabled-border-color, var(--ig-primary-50));--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.2) * 1.25rem), 1.25rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(3rem, -1 * 3rem), var(--is-medium, 1) * max(2.375rem, -1 * 2.375rem), var(--is-small, 1) * max(2rem, -1 * 2rem)));--default-size: var(--ig-icon-button-default-size, 2);--ig-theme: bootstrap;--component-size: var(--ig-size, var(--default-size))}:host([variant=outlined]) [part~=base]:hover{border-color:var(--hover-background)}:host([variant=outlined]) [part~=base]:hover igc-icon{color:var(--hover-foreground)}:host([variant=outlined]) [part~=base]:active{border-color:var(--focus-border-color)}:host([variant=outlined]) [part~=base]:active igc-icon{color:var(--active-foreground)}:host([variant=outlined]) [part=\"base focused\"]{border-color:var(--border-color);box-shadow:0 0 0 .25rem var(--shadow-color)}:host([variant=outlined]) [part=\"base focused\"] igc-icon{color:var(--focus-foreground)}:host([variant=outlined]) [part=\"base focused\"]:hover{border-color:var(--focus-hover-background)}:host([variant=outlined]) [part=\"base focused\"]:hover igc-icon{color:var(--focus-hover-foreground)}:host([variant=outlined]) [part=\"base focused\"]:active{border-color:var(--focus-border-color)}`;\n"]}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import { css } from 'lit';
|
|
2
|
-
export const styles = css `[part~=base]{border-radius:var(--border-radius);width:var(--size);height:var(--size)}:host([variant=flat]){--shadow-color: var(--ig-icon-button-shadow-color, transparent);--background: var(--ig-icon-button-background, transparent);--foreground: var(--ig-icon-button-foreground, var(--ig-gray-900));--hover-background: var(--ig-icon-button-hover-background, hsl(from var(--ig-gray-500) h s l/0.08));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-gray-900));--focus-background: var(--ig-icon-button-focus-background, hsl(from var(--ig-gray-500) h s l/0.16));--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-gray-900));--focus-hover-background: var(--ig-icon-button-focus-hover-background, hsl(from var(--ig-gray-500) h s l/0.24));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-gray-900));--active-background: var(--ig-icon-button-active-background, hsl(from var(--ig-gray-500) h s l/0.32));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-gray-900));--border-color: var(--ig-icon-button-border-color, transparent);--focus-border-color: var(--ig-icon-button-focus-border-color, transparent);--disabled-background: var(--ig-icon-button-disabled-background, transparent);--disabled-foreground: var(--ig-icon-button-disabled-foreground, var(--ig-gray-500));--disabled-border-color: var(--ig-icon-button-disabled-border-color, transparent);--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 1) * 1.25rem), 1.25rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(2.25rem, -1 * 2.25rem), var(--is-medium, 1) * max(1.875rem, -1 * 1.875rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));--default-size: var(--ig-icon-button-default-size, 3);--component-size: var(--ig-size, var(--default-size))}:host([variant=flat]) [part~=base]{color:var(--foreground);background:var(--background);border:.0625rem solid var(--border-color)}:host([variant=flat]) [part~=base]:hover{background:var(--hover-background);color:var(--hover-foreground)}:host([variant=flat]) [part~=base]:active{background:var(--active-background);color:var(--active-foreground)}:host([variant=flat]) [part="base focused"]{background:var(--focus-background);color:var(--focus-foreground)}:host([variant=flat]) [part="base focused"]:hover{background:var(--focus-hover-background);color:var(--focus-hover-foreground)}:host([variant=flat]) [part="base focused"]:active{background:var(--active-background);color:var(--active-foreground)}:host([variant=flat]) igc-icon{color:var(--foreground)}:host([variant=flat]) ::slotted(igc-ripple){border-radius:var(--border-radius)}:host([variant=contained]){--shadow-color: var(--ig-icon-button-shadow-color, transparent);--background: var(--ig-icon-button-background, hsl(from var(--ig-gray-900) h s l/0.08));--foreground: var(--ig-icon-button-foreground, var(--ig-gray-900));--hover-background: var(--ig-icon-button-hover-background, hsl(from var(--ig-gray-900) h s l/0.12));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-gray-900));--focus-background: var(--ig-icon-button-focus-background, hsl(from var(--ig-gray-900) h s l/0.16));--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-gray-900));--focus-hover-background: var(--ig-icon-button-focus-hover-background, hsl(from var(--ig-gray-900) h s l/0.2));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-gray-900));--active-background: var(--ig-icon-button-active-background, hsl(from var(--ig-gray-900) h s l/0.24));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-gray-900));--border-color: var(--ig-icon-button-border-color, transparent);--focus-border-color: var(--ig-icon-button-focus-border-color, transparent);--disabled-background: var(--ig-icon-button-disabled-background, hsl(from var(--ig-gray-900) h s l/0.04));--disabled-foreground: var(--ig-icon-button-disabled-foreground, var(--ig-gray-500));--disabled-border-color: var(--ig-icon-button-disabled-border-color, transparent);--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 1) * 1.25rem), 1.25rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(2.25rem, -1 * 2.25rem), var(--is-medium, 1) * max(1.875rem, -1 * 1.875rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));--default-size: var(--ig-icon-button-default-size, 3);--component-size: var(--ig-size, var(--default-size))}:host([variant=contained]) [part~=base]{background:var(--background);color:var(--foreground);border:.0625rem solid var(--border-color)}:host([variant=contained]) [part~=base]:hover{background:var(--hover-background);color:var(--hover-foreground)}:host([variant=contained]) [part~=base]:active{background:var(--active-background);color:var(--active-foreground)}:host([variant=contained]) [part="base focused"]{background:var(--focus-background);color:var(--focus-foreground)}:host([variant=contained]) [part="base focused"]:hover{background:var(--focus-hover-background);color:var(--focus-hover-foreground)}:host([variant=contained]) [part="base focused"]:active{background:var(--active-background);color:var(--active-foreground)}:host([variant=contained]) igc-icon{color:var(--foreground)}:host([variant=contained]) ::slotted(igc-ripple){border-radius:var(--border-radius)}:host([variant=outlined]){--shadow-color: var(--ig-icon-button-shadow-color, transparent);--background: var(--ig-icon-button-background, transparent);--foreground: var(--ig-icon-button-foreground, var(--ig-gray-900));--hover-background: var(--ig-icon-button-hover-background, hsl(from var(--ig-gray-500) h s l/0.08));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-gray-900));--focus-background: var(--ig-icon-button-focus-background, hsl(from var(--ig-gray-500) h s l/0.16));--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-gray-900));--focus-hover-background: var(--ig-icon-button-focus-hover-background, hsl(from var(--ig-gray-500) h s l/0.24));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-gray-900));--active-background: var(--ig-icon-button-active-background, hsl(from var(--ig-gray-500) h s l/0.32));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-gray-900));--border-color: var(--ig-icon-button-border-color, var(--ig-gray-300));--focus-border-color: var(--ig-icon-button-focus-border-color, var(--ig-gray-300));--disabled-background: var(--ig-icon-button-disabled-background, transparent);--disabled-foreground: var(--ig-icon-button-disabled-foreground, var(--ig-gray-500));--disabled-border-color: var(--ig-icon-button-disabled-border-color, var(--ig-gray-300));--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 1) * 1.25rem), 1.25rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(2.25rem, -1 * 2.25rem), var(--is-medium, 1) * max(1.875rem, -1 * 1.875rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));--default-size: var(--ig-icon-button-default-size, 3);--component-size: var(--ig-size, var(--default-size))}:host([variant=outlined]) [part~=base]{color:var(--foreground);background:var(--background);border:.0625rem solid var(--border-color)}:host([variant=outlined]) [part~=base]:hover{background:var(--hover-background);color:var(--hover-foreground)}:host([variant=outlined]) [part~=base]:active{background:var(--active-background);color:var(--active-foreground)}:host([variant=outlined]) [part="base focused"]{background:var(--focus-background);color:var(--focus-foreground);border-color:var(--focus-border-color)}:host([variant=outlined]) [part="base focused"]:hover{background:var(--focus-hover-background);color:var(--focus-hover-foreground)}:host([variant=outlined]) [part="base focused"]:active{background:var(--active-background);color:var(--active-foreground)}:host([variant=outlined]) igc-icon{color:var(--foreground)}:host([variant=outlined]) ::slotted(igc-ripple){border-radius:var(--border-radius)}:host([disabled]) [part~=base],:host(:disabled) [part~=base]{background:var(--disabled-background);color:var(--disabled-foreground);border-color:var(--disabled-border-color)}:host([disabled]) igc-icon,:host(:disabled) igc-icon{color:var(--disabled-foreground)}:host([disabled][variant=contained]) [part~=base],:host(:disabled[variant=contained]) [part~=base]{background:var(--disabled-background);color:var(--disabled-foreground);border-color:var(--disabled-border-color)}:host([disabled][variant=contained]) igc-icon,:host(:disabled[variant=contained]) igc-icon{color:var(--disabled-foreground)}:host([disabled][variant=outlined]) [part~=base],:host(:disabled[variant=outlined]) [part~=base]{background:var(--disabled-background);color:var(--disabled-foreground);border-color:var(--disabled-border-color)}:host([disabled][variant=outlined]) igc-icon,:host(:disabled[variant=outlined]) igc-icon{color:var(--disabled-foreground)}`;
|
|
2
|
+
export const styles = css `[part~=base]{border-radius:var(--border-radius);width:var(--size);height:var(--size)}:host([variant=flat]){--shadow-color: var(--ig-icon-button-shadow-color, transparent);--background: var(--ig-icon-button-background, transparent);--foreground: var(--ig-icon-button-foreground, var(--ig-gray-900));--hover-background: var(--ig-icon-button-hover-background, hsl(from var(--ig-gray-500) h s l/0.08));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-gray-900));--focus-background: var(--ig-icon-button-focus-background, hsl(from var(--ig-gray-500) h s l/0.16));--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-gray-900));--focus-hover-background: var(--ig-icon-button-focus-hover-background, hsl(from var(--ig-gray-500) h s l/0.24));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-gray-900));--active-background: var(--ig-icon-button-active-background, hsl(from var(--ig-gray-500) h s l/0.32));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-gray-900));--border-color: var(--ig-icon-button-border-color, transparent);--focus-border-color: var(--ig-icon-button-focus-border-color, transparent);--disabled-background: var(--ig-icon-button-disabled-background, transparent);--disabled-foreground: var(--ig-icon-button-disabled-foreground, var(--ig-gray-500));--disabled-border-color: var(--ig-icon-button-disabled-border-color, transparent);--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 1) * 1.25rem), 1.25rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(2.25rem, -1 * 2.25rem), var(--is-medium, 1) * max(1.875rem, -1 * 1.875rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));--default-size: var(--ig-icon-button-default-size, 3);--ig-theme: material;--component-size: var(--ig-size, var(--default-size))}:host([variant=flat]) [part~=base]{color:var(--foreground);background:var(--background);border:.0625rem solid var(--border-color)}:host([variant=flat]) [part~=base]:hover{background:var(--hover-background);color:var(--hover-foreground)}:host([variant=flat]) [part~=base]:active{background:var(--active-background);color:var(--active-foreground)}:host([variant=flat]) [part="base focused"]{background:var(--focus-background);color:var(--focus-foreground)}:host([variant=flat]) [part="base focused"]:hover{background:var(--focus-hover-background);color:var(--focus-hover-foreground)}:host([variant=flat]) [part="base focused"]:active{background:var(--active-background);color:var(--active-foreground)}:host([variant=flat]) igc-icon{color:var(--foreground)}:host([variant=flat]) ::slotted(igc-ripple){border-radius:var(--border-radius)}:host([variant=contained]){--shadow-color: var(--ig-icon-button-shadow-color, transparent);--background: var(--ig-icon-button-background, hsl(from var(--ig-gray-900) h s l/0.08));--foreground: var(--ig-icon-button-foreground, var(--ig-gray-900));--hover-background: var(--ig-icon-button-hover-background, hsl(from var(--ig-gray-900) h s l/0.12));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-gray-900));--focus-background: var(--ig-icon-button-focus-background, hsl(from var(--ig-gray-900) h s l/0.16));--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-gray-900));--focus-hover-background: var(--ig-icon-button-focus-hover-background, hsl(from var(--ig-gray-900) h s l/0.2));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-gray-900));--active-background: var(--ig-icon-button-active-background, hsl(from var(--ig-gray-900) h s l/0.24));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-gray-900));--border-color: var(--ig-icon-button-border-color, transparent);--focus-border-color: var(--ig-icon-button-focus-border-color, transparent);--disabled-background: var(--ig-icon-button-disabled-background, hsl(from var(--ig-gray-900) h s l/0.04));--disabled-foreground: var(--ig-icon-button-disabled-foreground, var(--ig-gray-500));--disabled-border-color: var(--ig-icon-button-disabled-border-color, transparent);--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 1) * 1.25rem), 1.25rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(2.25rem, -1 * 2.25rem), var(--is-medium, 1) * max(1.875rem, -1 * 1.875rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));--default-size: var(--ig-icon-button-default-size, 3);--ig-theme: material;--component-size: var(--ig-size, var(--default-size))}:host([variant=contained]) [part~=base]{background:var(--background);color:var(--foreground);border:.0625rem solid var(--border-color)}:host([variant=contained]) [part~=base]:hover{background:var(--hover-background);color:var(--hover-foreground)}:host([variant=contained]) [part~=base]:active{background:var(--active-background);color:var(--active-foreground)}:host([variant=contained]) [part="base focused"]{background:var(--focus-background);color:var(--focus-foreground)}:host([variant=contained]) [part="base focused"]:hover{background:var(--focus-hover-background);color:var(--focus-hover-foreground)}:host([variant=contained]) [part="base focused"]:active{background:var(--active-background);color:var(--active-foreground)}:host([variant=contained]) igc-icon{color:var(--foreground)}:host([variant=contained]) ::slotted(igc-ripple){border-radius:var(--border-radius)}:host([variant=outlined]){--shadow-color: var(--ig-icon-button-shadow-color, transparent);--background: var(--ig-icon-button-background, transparent);--foreground: var(--ig-icon-button-foreground, var(--ig-gray-900));--hover-background: var(--ig-icon-button-hover-background, hsl(from var(--ig-gray-500) h s l/0.08));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-gray-900));--focus-background: var(--ig-icon-button-focus-background, hsl(from var(--ig-gray-500) h s l/0.16));--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-gray-900));--focus-hover-background: var(--ig-icon-button-focus-hover-background, hsl(from var(--ig-gray-500) h s l/0.24));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-gray-900));--active-background: var(--ig-icon-button-active-background, hsl(from var(--ig-gray-500) h s l/0.32));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-gray-900));--border-color: var(--ig-icon-button-border-color, var(--ig-gray-300));--focus-border-color: var(--ig-icon-button-focus-border-color, var(--ig-gray-300));--disabled-background: var(--ig-icon-button-disabled-background, transparent);--disabled-foreground: var(--ig-icon-button-disabled-foreground, var(--ig-gray-500));--disabled-border-color: var(--ig-icon-button-disabled-border-color, var(--ig-gray-300));--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 1) * 1.25rem), 1.25rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(2.25rem, -1 * 2.25rem), var(--is-medium, 1) * max(1.875rem, -1 * 1.875rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));--default-size: var(--ig-icon-button-default-size, 3);--ig-theme: material;--component-size: var(--ig-size, var(--default-size))}:host([variant=outlined]) [part~=base]{color:var(--foreground);background:var(--background);border:.0625rem solid var(--border-color)}:host([variant=outlined]) [part~=base]:hover{background:var(--hover-background);color:var(--hover-foreground)}:host([variant=outlined]) [part~=base]:active{background:var(--active-background);color:var(--active-foreground)}:host([variant=outlined]) [part="base focused"]{background:var(--focus-background);color:var(--focus-foreground);border-color:var(--focus-border-color)}:host([variant=outlined]) [part="base focused"]:hover{background:var(--focus-hover-background);color:var(--focus-hover-foreground)}:host([variant=outlined]) [part="base focused"]:active{background:var(--active-background);color:var(--active-foreground)}:host([variant=outlined]) igc-icon{color:var(--foreground)}:host([variant=outlined]) ::slotted(igc-ripple){border-radius:var(--border-radius)}:host([disabled]) [part~=base],:host(:disabled) [part~=base]{background:var(--disabled-background);color:var(--disabled-foreground);border-color:var(--disabled-border-color)}:host([disabled]) igc-icon,:host(:disabled) igc-icon{color:var(--disabled-foreground)}:host([disabled][variant=contained]) [part~=base],:host(:disabled[variant=contained]) [part~=base]{background:var(--disabled-background);color:var(--disabled-foreground);border-color:var(--disabled-border-color)}:host([disabled][variant=contained]) igc-icon,:host(:disabled[variant=contained]) igc-icon{color:var(--disabled-foreground)}:host([disabled][variant=outlined]) [part~=base],:host(:disabled[variant=outlined]) [part~=base]{background:var(--disabled-background);color:var(--disabled-foreground);border-color:var(--disabled-border-color)}:host([disabled][variant=outlined]) igc-icon,:host(:disabled[variant=outlined]) igc-icon{color:var(--disabled-foreground)}`;
|
|
3
3
|
//# sourceMappingURL=icon-button.common.css.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"icon-button.common.css.js","sourceRoot":"","sources":["../../../../../../src/components/button/themes/icon-button/shared/icon-button.common.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,
|
|
1
|
+
{"version":3,"file":"icon-button.common.css.js","sourceRoot":"","sources":["../../../../../../src/components/button/themes/icon-button/shared/icon-button.common.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,o1RAAo1R,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`[part~=base]{border-radius:var(--border-radius);width:var(--size);height:var(--size)}:host([variant=flat]){--shadow-color: var(--ig-icon-button-shadow-color, transparent);--background: var(--ig-icon-button-background, transparent);--foreground: var(--ig-icon-button-foreground, var(--ig-gray-900));--hover-background: var(--ig-icon-button-hover-background, hsl(from var(--ig-gray-500) h s l/0.08));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-gray-900));--focus-background: var(--ig-icon-button-focus-background, hsl(from var(--ig-gray-500) h s l/0.16));--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-gray-900));--focus-hover-background: var(--ig-icon-button-focus-hover-background, hsl(from var(--ig-gray-500) h s l/0.24));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-gray-900));--active-background: var(--ig-icon-button-active-background, hsl(from var(--ig-gray-500) h s l/0.32));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-gray-900));--border-color: var(--ig-icon-button-border-color, transparent);--focus-border-color: var(--ig-icon-button-focus-border-color, transparent);--disabled-background: var(--ig-icon-button-disabled-background, transparent);--disabled-foreground: var(--ig-icon-button-disabled-foreground, var(--ig-gray-500));--disabled-border-color: var(--ig-icon-button-disabled-border-color, transparent);--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 1) * 1.25rem), 1.25rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(2.25rem, -1 * 2.25rem), var(--is-medium, 1) * max(1.875rem, -1 * 1.875rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));--default-size: var(--ig-icon-button-default-size, 3);--ig-theme: material;--component-size: var(--ig-size, var(--default-size))}:host([variant=flat]) [part~=base]{color:var(--foreground);background:var(--background);border:.0625rem solid var(--border-color)}:host([variant=flat]) [part~=base]:hover{background:var(--hover-background);color:var(--hover-foreground)}:host([variant=flat]) [part~=base]:active{background:var(--active-background);color:var(--active-foreground)}:host([variant=flat]) [part=\"base focused\"]{background:var(--focus-background);color:var(--focus-foreground)}:host([variant=flat]) [part=\"base focused\"]:hover{background:var(--focus-hover-background);color:var(--focus-hover-foreground)}:host([variant=flat]) [part=\"base focused\"]:active{background:var(--active-background);color:var(--active-foreground)}:host([variant=flat]) igc-icon{color:var(--foreground)}:host([variant=flat]) ::slotted(igc-ripple){border-radius:var(--border-radius)}:host([variant=contained]){--shadow-color: var(--ig-icon-button-shadow-color, transparent);--background: var(--ig-icon-button-background, hsl(from var(--ig-gray-900) h s l/0.08));--foreground: var(--ig-icon-button-foreground, var(--ig-gray-900));--hover-background: var(--ig-icon-button-hover-background, hsl(from var(--ig-gray-900) h s l/0.12));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-gray-900));--focus-background: var(--ig-icon-button-focus-background, hsl(from var(--ig-gray-900) h s l/0.16));--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-gray-900));--focus-hover-background: var(--ig-icon-button-focus-hover-background, hsl(from var(--ig-gray-900) h s l/0.2));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-gray-900));--active-background: var(--ig-icon-button-active-background, hsl(from var(--ig-gray-900) h s l/0.24));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-gray-900));--border-color: var(--ig-icon-button-border-color, transparent);--focus-border-color: var(--ig-icon-button-focus-border-color, transparent);--disabled-background: var(--ig-icon-button-disabled-background, hsl(from var(--ig-gray-900) h s l/0.04));--disabled-foreground: var(--ig-icon-button-disabled-foreground, var(--ig-gray-500));--disabled-border-color: var(--ig-icon-button-disabled-border-color, transparent);--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 1) * 1.25rem), 1.25rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(2.25rem, -1 * 2.25rem), var(--is-medium, 1) * max(1.875rem, -1 * 1.875rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));--default-size: var(--ig-icon-button-default-size, 3);--ig-theme: material;--component-size: var(--ig-size, var(--default-size))}:host([variant=contained]) [part~=base]{background:var(--background);color:var(--foreground);border:.0625rem solid var(--border-color)}:host([variant=contained]) [part~=base]:hover{background:var(--hover-background);color:var(--hover-foreground)}:host([variant=contained]) [part~=base]:active{background:var(--active-background);color:var(--active-foreground)}:host([variant=contained]) [part=\"base focused\"]{background:var(--focus-background);color:var(--focus-foreground)}:host([variant=contained]) [part=\"base focused\"]:hover{background:var(--focus-hover-background);color:var(--focus-hover-foreground)}:host([variant=contained]) [part=\"base focused\"]:active{background:var(--active-background);color:var(--active-foreground)}:host([variant=contained]) igc-icon{color:var(--foreground)}:host([variant=contained]) ::slotted(igc-ripple){border-radius:var(--border-radius)}:host([variant=outlined]){--shadow-color: var(--ig-icon-button-shadow-color, transparent);--background: var(--ig-icon-button-background, transparent);--foreground: var(--ig-icon-button-foreground, var(--ig-gray-900));--hover-background: var(--ig-icon-button-hover-background, hsl(from var(--ig-gray-500) h s l/0.08));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-gray-900));--focus-background: var(--ig-icon-button-focus-background, hsl(from var(--ig-gray-500) h s l/0.16));--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-gray-900));--focus-hover-background: var(--ig-icon-button-focus-hover-background, hsl(from var(--ig-gray-500) h s l/0.24));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-gray-900));--active-background: var(--ig-icon-button-active-background, hsl(from var(--ig-gray-500) h s l/0.32));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-gray-900));--border-color: var(--ig-icon-button-border-color, var(--ig-gray-300));--focus-border-color: var(--ig-icon-button-focus-border-color, var(--ig-gray-300));--disabled-background: var(--ig-icon-button-disabled-background, transparent);--disabled-foreground: var(--ig-icon-button-disabled-foreground, var(--ig-gray-500));--disabled-border-color: var(--ig-icon-button-disabled-border-color, var(--ig-gray-300));--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 1) * 1.25rem), 1.25rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(2.25rem, -1 * 2.25rem), var(--is-medium, 1) * max(1.875rem, -1 * 1.875rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));--default-size: var(--ig-icon-button-default-size, 3);--ig-theme: material;--component-size: var(--ig-size, var(--default-size))}:host([variant=outlined]) [part~=base]{color:var(--foreground);background:var(--background);border:.0625rem solid var(--border-color)}:host([variant=outlined]) [part~=base]:hover{background:var(--hover-background);color:var(--hover-foreground)}:host([variant=outlined]) [part~=base]:active{background:var(--active-background);color:var(--active-foreground)}:host([variant=outlined]) [part=\"base focused\"]{background:var(--focus-background);color:var(--focus-foreground);border-color:var(--focus-border-color)}:host([variant=outlined]) [part=\"base focused\"]:hover{background:var(--focus-hover-background);color:var(--focus-hover-foreground)}:host([variant=outlined]) [part=\"base focused\"]:active{background:var(--active-background);color:var(--active-foreground)}:host([variant=outlined]) igc-icon{color:var(--foreground)}:host([variant=outlined]) ::slotted(igc-ripple){border-radius:var(--border-radius)}:host([disabled]) [part~=base],:host(:disabled) [part~=base]{background:var(--disabled-background);color:var(--disabled-foreground);border-color:var(--disabled-border-color)}:host([disabled]) igc-icon,:host(:disabled) igc-icon{color:var(--disabled-foreground)}:host([disabled][variant=contained]) [part~=base],:host(:disabled[variant=contained]) [part~=base]{background:var(--disabled-background);color:var(--disabled-foreground);border-color:var(--disabled-border-color)}:host([disabled][variant=contained]) igc-icon,:host(:disabled[variant=contained]) igc-icon{color:var(--disabled-foreground)}:host([disabled][variant=outlined]) [part~=base],:host(:disabled[variant=outlined]) [part~=base]{background:var(--disabled-background);color:var(--disabled-foreground);border-color:var(--disabled-border-color)}:host([disabled][variant=outlined]) igc-icon,:host(:disabled[variant=outlined]) igc-icon{color:var(--disabled-foreground)}`;\n"]}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import { css } from 'lit';
|
|
2
|
-
export const styles = css `[part~=base]{transition:color .15s ease-out,background .15s ease-out;box-shadow:none;padding:max(var(--is-large, 1)*max(10px, -1 * 10px)*var(--ig-spacing-large, var(--ig-spacing, --ig-spacing)),var(--is-medium, 1)*max(7px, -1 * 7px)*var(--ig-spacing-medium, var(--ig-spacing, --ig-spacing)),var(--is-small, 1)*max(3px, -1 * 3px)*var(--ig-spacing-small, var(--ig-spacing, --ig-spacing)))}[part="base focused"]::after{position:absolute;content:"";pointer-events:none;inset-block-start:.1875rem;inset-inline-start:.1875rem;width:calc(100% - 0.1875rem*2);height:calc(100% - 0.1875rem*2)}:host([variant=flat]){--shadow-color: var(--ig-icon-button-shadow-color, transparent);--background: var(--ig-icon-button-background, transparent);--foreground: var(--ig-icon-button-foreground, var(--ig-primary-500));--hover-background: var(--ig-icon-button-hover-background, var(--ig-gray-200));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-primary-600));--focus-background: var(--ig-icon-button-focus-background, transparent);--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-primary-500));--focus-hover-background: var(--ig-icon-button-focus-hover-background, var(--ig-gray-200));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-primary-600));--active-background: var(--ig-icon-button-active-background, var(--ig-gray-300));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-primary-800));--border-color: var(--ig-icon-button-border-color, transparent);--focus-border-color: var(--ig-icon-button-focus-border-color, var(--ig-gray-700));--disabled-background: var(--ig-icon-button-disabled-background, var(--ig-gray-100));--disabled-foreground: var(--ig-icon-button-disabled-foreground, var(--ig-gray-500));--disabled-border-color: var(--ig-icon-button-disabled-border-color, transparent);--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.1) * 1.25rem), 1.25rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(2.375rem, -1 * 2.375rem), var(--is-medium, 1) * max(2rem, -1 * 2rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));--default-size: var(--ig-icon-button-default-size, 2);--component-size: var(--ig-size, var(--default-size))}:host([variant=flat]) [part~=base]:hover igc-icon{color:var(--hover-foreground)}:host([variant=flat]) [part~=base]:active igc-icon{color:var(--active-foreground)}:host([variant=flat]) [part="base focused"]::after{box-shadow:0 0 0 .0625rem var(--focus-border-color)}:host([variant=contained]){--shadow-color: var(--ig-icon-button-shadow-color, transparent);--background: var(--ig-icon-button-background, var(--ig-primary-500));--foreground: var(--ig-icon-button-foreground, var(--ig-primary-600-contrast));--hover-background: var(--ig-icon-button-hover-background, var(--ig-primary-600));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-primary-600-contrast));--focus-background: var(--ig-icon-button-focus-background, var(--ig-primary-500));--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-primary-600-contrast));--focus-hover-background: var(--ig-icon-button-focus-hover-background, var(--ig-primary-600));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-primary-600-contrast));--active-background: var(--ig-icon-button-active-background, var(--ig-primary-800));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-primary-800-contrast));--border-color: var(--ig-icon-button-border-color, transparent);--focus-border-color: var(--ig-icon-button-focus-border-color, var(--ig-primary-600-contrast));--disabled-background: var(--ig-icon-button-disabled-background, var(--ig-gray-100));--disabled-foreground: var(--ig-icon-button-disabled-foreground, var(--ig-gray-500));--disabled-border-color: var(--ig-icon-button-disabled-border-color, transparent);--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.1) * 1.25rem), 1.25rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(2.375rem, -1 * 2.375rem), var(--is-medium, 1) * max(2rem, -1 * 2rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));--default-size: var(--ig-icon-button-default-size, 2);--component-size: var(--ig-size, var(--default-size))}:host([variant=contained]) [part~=base]{border-color:var(--border-color)}:host([variant=contained]) [part="base focused"]::after{box-shadow:0 0 0 .0625rem var(--focus-border-color)}:host([variant=outlined]){--shadow-color: var(--ig-icon-button-shadow-color, transparent);--background: var(--ig-icon-button-background, transparent);--foreground: var(--ig-icon-button-foreground, var(--ig-gray-900));--hover-background: var(--ig-icon-button-hover-background, var(--ig-gray-200));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-gray-900));--focus-background: var(--ig-icon-button-focus-background, transparent);--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-gray-900));--focus-hover-background: var(--ig-icon-button-focus-hover-background, var(--ig-gray-200));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-gray-900));--active-background: var(--ig-icon-button-active-background, var(--ig-gray-300));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-gray-900));--border-color: var(--ig-icon-button-border-color, var(--ig-gray-600));--focus-border-color: var(--ig-icon-button-focus-border-color, var(--ig-gray-700));--disabled-background: var(--ig-icon-button-disabled-background, var(--ig-gray-100));--disabled-foreground: var(--ig-icon-button-disabled-foreground, var(--ig-gray-500));--disabled-border-color: var(--ig-icon-button-disabled-border-color, var(--ig-gray-300));--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.1) * 1.25rem), 1.25rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(2.375rem, -1 * 2.375rem), var(--is-medium, 1) * max(2rem, -1 * 2rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));--default-size: var(--ig-icon-button-default-size, 2);--component-size: var(--ig-size, var(--default-size))}:host([variant=outlined]) [part~=base]{border-color:var(--border-color)}:host([variant=outlined]) [part="base focused"]::after{box-shadow:0 0 0 .0625rem var(--focus-border-color)}`;
|
|
2
|
+
export const styles = css `[part~=base]{transition:color .15s ease-out,background .15s ease-out;box-shadow:none;padding:max(var(--is-large, 1)*max(10px, -1 * 10px)*var(--ig-spacing-large, var(--ig-spacing, --ig-spacing)),var(--is-medium, 1)*max(7px, -1 * 7px)*var(--ig-spacing-medium, var(--ig-spacing, --ig-spacing)),var(--is-small, 1)*max(3px, -1 * 3px)*var(--ig-spacing-small, var(--ig-spacing, --ig-spacing)))}[part="base focused"]::after{position:absolute;content:"";pointer-events:none;inset-block-start:.1875rem;inset-inline-start:.1875rem;width:calc(100% - 0.1875rem*2);height:calc(100% - 0.1875rem*2)}:host([variant=flat]){--shadow-color: var(--ig-icon-button-shadow-color, transparent);--background: var(--ig-icon-button-background, transparent);--foreground: var(--ig-icon-button-foreground, var(--ig-primary-500));--hover-background: var(--ig-icon-button-hover-background, var(--ig-gray-200));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-primary-600));--focus-background: var(--ig-icon-button-focus-background, transparent);--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-primary-500));--focus-hover-background: var(--ig-icon-button-focus-hover-background, var(--ig-gray-200));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-primary-600));--active-background: var(--ig-icon-button-active-background, var(--ig-gray-300));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-primary-800));--border-color: var(--ig-icon-button-border-color, transparent);--focus-border-color: var(--ig-icon-button-focus-border-color, var(--ig-gray-700));--disabled-background: var(--ig-icon-button-disabled-background, var(--ig-gray-100));--disabled-foreground: var(--ig-icon-button-disabled-foreground, var(--ig-gray-500));--disabled-border-color: var(--ig-icon-button-disabled-border-color, transparent);--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.1) * 1.25rem), 1.25rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(2.375rem, -1 * 2.375rem), var(--is-medium, 1) * max(2rem, -1 * 2rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));--default-size: var(--ig-icon-button-default-size, 2);--ig-theme: fluent;--component-size: var(--ig-size, var(--default-size))}:host([variant=flat]) [part~=base]:hover igc-icon{color:var(--hover-foreground)}:host([variant=flat]) [part~=base]:active igc-icon{color:var(--active-foreground)}:host([variant=flat]) [part="base focused"]::after{box-shadow:0 0 0 .0625rem var(--focus-border-color)}:host([variant=contained]){--shadow-color: var(--ig-icon-button-shadow-color, transparent);--background: var(--ig-icon-button-background, var(--ig-primary-500));--foreground: var(--ig-icon-button-foreground, var(--ig-primary-600-contrast));--hover-background: var(--ig-icon-button-hover-background, var(--ig-primary-600));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-primary-600-contrast));--focus-background: var(--ig-icon-button-focus-background, var(--ig-primary-500));--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-primary-600-contrast));--focus-hover-background: var(--ig-icon-button-focus-hover-background, var(--ig-primary-600));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-primary-600-contrast));--active-background: var(--ig-icon-button-active-background, var(--ig-primary-800));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-primary-800-contrast));--border-color: var(--ig-icon-button-border-color, transparent);--focus-border-color: var(--ig-icon-button-focus-border-color, var(--ig-primary-600-contrast));--disabled-background: var(--ig-icon-button-disabled-background, var(--ig-gray-100));--disabled-foreground: var(--ig-icon-button-disabled-foreground, var(--ig-gray-500));--disabled-border-color: var(--ig-icon-button-disabled-border-color, transparent);--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.1) * 1.25rem), 1.25rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(2.375rem, -1 * 2.375rem), var(--is-medium, 1) * max(2rem, -1 * 2rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));--default-size: var(--ig-icon-button-default-size, 2);--ig-theme: fluent;--component-size: var(--ig-size, var(--default-size))}:host([variant=contained]) [part~=base]{border-color:var(--border-color)}:host([variant=contained]) [part="base focused"]::after{box-shadow:0 0 0 .0625rem var(--focus-border-color)}:host([variant=outlined]){--shadow-color: var(--ig-icon-button-shadow-color, transparent);--background: var(--ig-icon-button-background, transparent);--foreground: var(--ig-icon-button-foreground, var(--ig-gray-900));--hover-background: var(--ig-icon-button-hover-background, var(--ig-gray-200));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-gray-900));--focus-background: var(--ig-icon-button-focus-background, transparent);--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-gray-900));--focus-hover-background: var(--ig-icon-button-focus-hover-background, var(--ig-gray-200));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-gray-900));--active-background: var(--ig-icon-button-active-background, var(--ig-gray-300));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-gray-900));--border-color: var(--ig-icon-button-border-color, var(--ig-gray-600));--focus-border-color: var(--ig-icon-button-focus-border-color, var(--ig-gray-700));--disabled-background: var(--ig-icon-button-disabled-background, var(--ig-gray-100));--disabled-foreground: var(--ig-icon-button-disabled-foreground, var(--ig-gray-500));--disabled-border-color: var(--ig-icon-button-disabled-border-color, var(--ig-gray-300));--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.1) * 1.25rem), 1.25rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(2.375rem, -1 * 2.375rem), var(--is-medium, 1) * max(2rem, -1 * 2rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));--default-size: var(--ig-icon-button-default-size, 2);--ig-theme: fluent;--component-size: var(--ig-size, var(--default-size))}:host([variant=outlined]) [part~=base]{border-color:var(--border-color)}:host([variant=outlined]) [part="base focused"]::after{box-shadow:0 0 0 .0625rem var(--focus-border-color)}`;
|
|
3
3
|
//# sourceMappingURL=icon-button.fluent.css.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"icon-button.fluent.css.js","sourceRoot":"","sources":["../../../../../../src/components/button/themes/icon-button/shared/icon-button.fluent.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,
|
|
1
|
+
{"version":3,"file":"icon-button.fluent.css.js","sourceRoot":"","sources":["../../../../../../src/components/button/themes/icon-button/shared/icon-button.fluent.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,kyMAAkyM,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`[part~=base]{transition:color .15s ease-out,background .15s ease-out;box-shadow:none;padding:max(var(--is-large, 1)*max(10px, -1 * 10px)*var(--ig-spacing-large, var(--ig-spacing, --ig-spacing)),var(--is-medium, 1)*max(7px, -1 * 7px)*var(--ig-spacing-medium, var(--ig-spacing, --ig-spacing)),var(--is-small, 1)*max(3px, -1 * 3px)*var(--ig-spacing-small, var(--ig-spacing, --ig-spacing)))}[part=\"base focused\"]::after{position:absolute;content:\"\";pointer-events:none;inset-block-start:.1875rem;inset-inline-start:.1875rem;width:calc(100% - 0.1875rem*2);height:calc(100% - 0.1875rem*2)}:host([variant=flat]){--shadow-color: var(--ig-icon-button-shadow-color, transparent);--background: var(--ig-icon-button-background, transparent);--foreground: var(--ig-icon-button-foreground, var(--ig-primary-500));--hover-background: var(--ig-icon-button-hover-background, var(--ig-gray-200));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-primary-600));--focus-background: var(--ig-icon-button-focus-background, transparent);--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-primary-500));--focus-hover-background: var(--ig-icon-button-focus-hover-background, var(--ig-gray-200));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-primary-600));--active-background: var(--ig-icon-button-active-background, var(--ig-gray-300));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-primary-800));--border-color: var(--ig-icon-button-border-color, transparent);--focus-border-color: var(--ig-icon-button-focus-border-color, var(--ig-gray-700));--disabled-background: var(--ig-icon-button-disabled-background, var(--ig-gray-100));--disabled-foreground: var(--ig-icon-button-disabled-foreground, var(--ig-gray-500));--disabled-border-color: var(--ig-icon-button-disabled-border-color, transparent);--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.1) * 1.25rem), 1.25rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(2.375rem, -1 * 2.375rem), var(--is-medium, 1) * max(2rem, -1 * 2rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));--default-size: var(--ig-icon-button-default-size, 2);--ig-theme: fluent;--component-size: var(--ig-size, var(--default-size))}:host([variant=flat]) [part~=base]:hover igc-icon{color:var(--hover-foreground)}:host([variant=flat]) [part~=base]:active igc-icon{color:var(--active-foreground)}:host([variant=flat]) [part=\"base focused\"]::after{box-shadow:0 0 0 .0625rem var(--focus-border-color)}:host([variant=contained]){--shadow-color: var(--ig-icon-button-shadow-color, transparent);--background: var(--ig-icon-button-background, var(--ig-primary-500));--foreground: var(--ig-icon-button-foreground, var(--ig-primary-600-contrast));--hover-background: var(--ig-icon-button-hover-background, var(--ig-primary-600));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-primary-600-contrast));--focus-background: var(--ig-icon-button-focus-background, var(--ig-primary-500));--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-primary-600-contrast));--focus-hover-background: var(--ig-icon-button-focus-hover-background, var(--ig-primary-600));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-primary-600-contrast));--active-background: var(--ig-icon-button-active-background, var(--ig-primary-800));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-primary-800-contrast));--border-color: var(--ig-icon-button-border-color, transparent);--focus-border-color: var(--ig-icon-button-focus-border-color, var(--ig-primary-600-contrast));--disabled-background: var(--ig-icon-button-disabled-background, var(--ig-gray-100));--disabled-foreground: var(--ig-icon-button-disabled-foreground, var(--ig-gray-500));--disabled-border-color: var(--ig-icon-button-disabled-border-color, transparent);--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.1) * 1.25rem), 1.25rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(2.375rem, -1 * 2.375rem), var(--is-medium, 1) * max(2rem, -1 * 2rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));--default-size: var(--ig-icon-button-default-size, 2);--ig-theme: fluent;--component-size: var(--ig-size, var(--default-size))}:host([variant=contained]) [part~=base]{border-color:var(--border-color)}:host([variant=contained]) [part=\"base focused\"]::after{box-shadow:0 0 0 .0625rem var(--focus-border-color)}:host([variant=outlined]){--shadow-color: var(--ig-icon-button-shadow-color, transparent);--background: var(--ig-icon-button-background, transparent);--foreground: var(--ig-icon-button-foreground, var(--ig-gray-900));--hover-background: var(--ig-icon-button-hover-background, var(--ig-gray-200));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-gray-900));--focus-background: var(--ig-icon-button-focus-background, transparent);--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-gray-900));--focus-hover-background: var(--ig-icon-button-focus-hover-background, var(--ig-gray-200));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-gray-900));--active-background: var(--ig-icon-button-active-background, var(--ig-gray-300));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-gray-900));--border-color: var(--ig-icon-button-border-color, var(--ig-gray-600));--focus-border-color: var(--ig-icon-button-focus-border-color, var(--ig-gray-700));--disabled-background: var(--ig-icon-button-disabled-background, var(--ig-gray-100));--disabled-foreground: var(--ig-icon-button-disabled-foreground, var(--ig-gray-500));--disabled-border-color: var(--ig-icon-button-disabled-border-color, var(--ig-gray-300));--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.1) * 1.25rem), 1.25rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(2.375rem, -1 * 2.375rem), var(--is-medium, 1) * max(2rem, -1 * 2rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));--default-size: var(--ig-icon-button-default-size, 2);--ig-theme: fluent;--component-size: var(--ig-size, var(--default-size))}:host([variant=outlined]) [part~=base]{border-color:var(--border-color)}:host([variant=outlined]) [part=\"base focused\"]::after{box-shadow:0 0 0 .0625rem var(--focus-border-color)}`;\n"]}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import { css } from 'lit';
|
|
2
|
-
export const styles = css `:host{--icon-size: 1rem}[part=icon]{--size: 1rem}[part~=base]{transition:color .15s ease-in-out,box-shadow .15s ease-in-out,background .15s ease-in-out;padding:max(var(--is-large, 1)*max(8px, -1 * 8px)*var(--ig-spacing-large, var(--ig-spacing, --ig-spacing)),var(--is-medium, 1)*max(6px, -1 * 6px)*var(--ig-spacing-medium, var(--ig-spacing, --ig-spacing)),var(--is-small, 1)*max(4px, -1 * 4px)*var(--ig-spacing-small, var(--ig-spacing, --ig-spacing)))}:host([variant=flat]){--shadow-color: var(--ig-icon-button-shadow-color, hsl(from var(--ig-gray-900) h s l/0.15));--background: var(--ig-icon-button-background, transparent);--foreground: var(--ig-icon-button-foreground, var(--ig-gray-600));--hover-background: var(--ig-icon-button-hover-background, hsl(from var(--ig-gray-900) h s l/0.05));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-gray-700));--focus-background: var(--ig-icon-button-focus-background, transparent);--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-gray-600));--focus-hover-background: var(--ig-icon-button-focus-hover-background, hsl(from var(--ig-gray-900) h s l/0.05));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-gray-700));--active-background: var(--ig-icon-button-active-background, hsl(from var(--ig-gray-900) h s l/0.05));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-gray-700));--border-color: var(--ig-icon-button-border-color, transparent);--focus-border-color: var(--ig-icon-button-focus-border-color, hsl(from var(--ig-gray-900) h s l/0.15));--disabled-background: var(--ig-icon-button-disabled-background, transparent);--disabled-foreground: var(--ig-icon-button-disabled-foreground, hsl(from var(--ig-gray-900) h s l/0.2));--disabled-border-color: var(--ig-icon-button-disabled-border-color, transparent);--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 1) * 2.5rem), 2.5rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(2rem, -1 * 2rem), var(--is-medium, 1) * max(1.75rem, -1 * 1.75rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));--default-size: var(--ig-icon-button-default-size, 2);--component-size: var(--ig-size, var(--default-size))}:host([variant=flat]) [part="base focused"]{border-color:var(--border-color);box-shadow:0 0 0 .1875rem var(--focus-border-color)}:host([variant=contained]){--shadow-color: var(--ig-icon-button-shadow-color, hsl(from var(--ig-primary-400) h s l/0.5));--background: var(--ig-icon-button-background, var(--ig-primary-500));--foreground: var(--ig-icon-button-foreground, hsl(from var(--ig-primary-500-contrast) h s l/0.8));--hover-background: var(--ig-icon-button-hover-background, var(--ig-primary-400));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-primary-500-contrast));--focus-background: var(--ig-icon-button-focus-background, var(--ig-primary-500));--focus-foreground: var(--ig-icon-button-focus-foreground, hsl(from var(--ig-primary-500-contrast) h s l/0.8));--focus-hover-background: var(--ig-icon-button-focus-hover-background, var(--ig-primary-400));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-primary-500-contrast));--active-background: var(--ig-icon-button-active-background, var(--ig-primary-400));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-primary-500-contrast));--border-color: var(--ig-icon-button-border-color, transparent);--focus-border-color: var(--ig-icon-button-focus-border-color, hsl(from var(--ig-primary-400) h s l/0.5));--disabled-background: var(--ig-icon-button-disabled-background, hsl(from var(--ig-primary-400) h s l/0.5));--disabled-foreground: var(--ig-icon-button-disabled-foreground, hsl(from var(--ig-primary-500-contrast) h s l/0.3));--disabled-border-color: var(--ig-icon-button-disabled-border-color, transparent);--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 1) * 2.5rem), 2.5rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(2rem, -1 * 2rem), var(--is-medium, 1) * max(1.75rem, -1 * 1.75rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));--default-size: var(--ig-icon-button-default-size, 2);--component-size: var(--ig-size, var(--default-size))}:host([variant=contained]) [part~=base]:hover igc-icon,:host([variant=contained]) [part~=base]:active igc-icon{color:var(--hover-foreground)}:host([variant=contained]) [part="base focused"]{box-shadow:0 0 0 .1875rem var(--focus-border-color)}:host([variant=outlined]){--shadow-color: var(--ig-icon-button-shadow-color, hsl(from var(--ig-gray-900) h s l/0.15));--background: var(--ig-icon-button-background, transparent);--foreground: var(--ig-icon-button-foreground, var(--ig-gray-600));--hover-background: var(--ig-icon-button-hover-background, hsl(from var(--ig-gray-900) h s l/0.05));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-gray-700));--focus-background: var(--ig-icon-button-focus-background, transparent);--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-gray-600));--focus-hover-background: var(--ig-icon-button-focus-hover-background, hsl(from var(--ig-gray-900) h s l/0.05));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-gray-700));--active-background: var(--ig-icon-button-active-background, hsl(from var(--ig-gray-900) h s l/0.05));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-gray-700));--border-color: var(--ig-icon-button-border-color, var(--ig-gray-500));--focus-border-color: var(--ig-icon-button-focus-border-color, hsl(from var(--ig-gray-900) h s l/0.15));--disabled-background: var(--ig-icon-button-disabled-background, transparent);--disabled-foreground: var(--ig-icon-button-disabled-foreground, hsl(from var(--ig-gray-900) h s l/0.2));--disabled-border-color: var(--ig-icon-button-disabled-border-color, hsl(from var(--ig-gray-900) h s l/0.15));--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 1) * 2.5rem), 2.5rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(2rem, -1 * 2rem), var(--is-medium, 1) * max(1.75rem, -1 * 1.75rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));--default-size: var(--ig-icon-button-default-size, 2);--component-size: var(--ig-size, var(--default-size))}:host([variant=outlined]) [part~=base]{border-width:.125rem}:host([variant=outlined]) [part~=base]:hover,:host([variant=outlined]) [part~=base]:active{border-color:var(--foreground)}:host([variant=outlined]) [part="base focused"]{border-color:var(--border-color);box-shadow:0 0 0 .1875rem var(--focus-border-color)}:host([variant=outlined]) [part="base focused"]:hover,:host([variant=outlined]) [part="base focused"]:active{border-color:var(--foreground)}:host([variant=outlined]) [part~=base]:hover igc-icon,:host([variant=outlined]) [part~=base]:active igc-icon,:host([variant=flat]) [part~=base]:hover igc-icon,:host([variant=flat]) [part~=base]:active igc-icon{color:var(--hover-foreground)}:host([variant=outlined]) [part="base focused"] igc-icon,:host([variant=flat]) [part="base focused"] igc-icon{color:var(--focus-foreground)}:host([variant=outlined]) [part="base focused"]:hover igc-icon,:host([variant=outlined]) [part="base focused"]:active igc-icon,:host([variant=flat]) [part="base focused"]:hover igc-icon,:host([variant=flat]) [part="base focused"]:active igc-icon{color:var(--focus-hover-foreground)}:host([disabled]) [part~=base],:host(:disabled) [part~=base]{box-shadow:none}`;
|
|
2
|
+
export const styles = css `:host{--icon-size: 1rem}[part=icon]{--size: 1rem}[part~=base]{transition:color .15s ease-in-out,box-shadow .15s ease-in-out,background .15s ease-in-out;padding:max(var(--is-large, 1)*max(8px, -1 * 8px)*var(--ig-spacing-large, var(--ig-spacing, --ig-spacing)),var(--is-medium, 1)*max(6px, -1 * 6px)*var(--ig-spacing-medium, var(--ig-spacing, --ig-spacing)),var(--is-small, 1)*max(4px, -1 * 4px)*var(--ig-spacing-small, var(--ig-spacing, --ig-spacing)))}:host([variant=flat]){--shadow-color: var(--ig-icon-button-shadow-color, hsl(from var(--ig-gray-900) h s l/0.15));--background: var(--ig-icon-button-background, transparent);--foreground: var(--ig-icon-button-foreground, var(--ig-gray-600));--hover-background: var(--ig-icon-button-hover-background, hsl(from var(--ig-gray-900) h s l/0.05));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-gray-700));--focus-background: var(--ig-icon-button-focus-background, transparent);--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-gray-600));--focus-hover-background: var(--ig-icon-button-focus-hover-background, hsl(from var(--ig-gray-900) h s l/0.05));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-gray-700));--active-background: var(--ig-icon-button-active-background, hsl(from var(--ig-gray-900) h s l/0.05));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-gray-700));--border-color: var(--ig-icon-button-border-color, transparent);--focus-border-color: var(--ig-icon-button-focus-border-color, hsl(from var(--ig-gray-900) h s l/0.15));--disabled-background: var(--ig-icon-button-disabled-background, transparent);--disabled-foreground: var(--ig-icon-button-disabled-foreground, hsl(from var(--ig-gray-900) h s l/0.2));--disabled-border-color: var(--ig-icon-button-disabled-border-color, transparent);--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 1) * 2.5rem), 2.5rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(2rem, -1 * 2rem), var(--is-medium, 1) * max(1.75rem, -1 * 1.75rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));--default-size: var(--ig-icon-button-default-size, 2);--ig-theme: indigo;--component-size: var(--ig-size, var(--default-size))}:host([variant=flat]) [part="base focused"]{border-color:var(--border-color);box-shadow:0 0 0 .1875rem var(--focus-border-color)}:host([variant=contained]){--shadow-color: var(--ig-icon-button-shadow-color, hsl(from var(--ig-primary-400) h s l/0.5));--background: var(--ig-icon-button-background, var(--ig-primary-500));--foreground: var(--ig-icon-button-foreground, hsl(from var(--ig-primary-500-contrast) h s l/0.8));--hover-background: var(--ig-icon-button-hover-background, var(--ig-primary-400));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-primary-500-contrast));--focus-background: var(--ig-icon-button-focus-background, var(--ig-primary-500));--focus-foreground: var(--ig-icon-button-focus-foreground, hsl(from var(--ig-primary-500-contrast) h s l/0.8));--focus-hover-background: var(--ig-icon-button-focus-hover-background, var(--ig-primary-400));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-primary-500-contrast));--active-background: var(--ig-icon-button-active-background, var(--ig-primary-400));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-primary-500-contrast));--border-color: var(--ig-icon-button-border-color, transparent);--focus-border-color: var(--ig-icon-button-focus-border-color, hsl(from var(--ig-primary-400) h s l/0.5));--disabled-background: var(--ig-icon-button-disabled-background, hsl(from var(--ig-primary-400) h s l/0.5));--disabled-foreground: var(--ig-icon-button-disabled-foreground, hsl(from var(--ig-primary-500-contrast) h s l/0.3));--disabled-border-color: var(--ig-icon-button-disabled-border-color, transparent);--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 1) * 2.5rem), 2.5rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(2rem, -1 * 2rem), var(--is-medium, 1) * max(1.75rem, -1 * 1.75rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));--default-size: var(--ig-icon-button-default-size, 2);--ig-theme: indigo;--component-size: var(--ig-size, var(--default-size))}:host([variant=contained]) [part~=base]:hover igc-icon,:host([variant=contained]) [part~=base]:active igc-icon{color:var(--hover-foreground)}:host([variant=contained]) [part="base focused"]{box-shadow:0 0 0 .1875rem var(--focus-border-color)}:host([variant=outlined]){--shadow-color: var(--ig-icon-button-shadow-color, hsl(from var(--ig-gray-900) h s l/0.15));--background: var(--ig-icon-button-background, transparent);--foreground: var(--ig-icon-button-foreground, var(--ig-gray-600));--hover-background: var(--ig-icon-button-hover-background, hsl(from var(--ig-gray-900) h s l/0.05));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-gray-700));--focus-background: var(--ig-icon-button-focus-background, transparent);--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-gray-600));--focus-hover-background: var(--ig-icon-button-focus-hover-background, hsl(from var(--ig-gray-900) h s l/0.05));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-gray-700));--active-background: var(--ig-icon-button-active-background, hsl(from var(--ig-gray-900) h s l/0.05));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-gray-700));--border-color: var(--ig-icon-button-border-color, var(--ig-gray-500));--focus-border-color: var(--ig-icon-button-focus-border-color, hsl(from var(--ig-gray-900) h s l/0.15));--disabled-background: var(--ig-icon-button-disabled-background, transparent);--disabled-foreground: var(--ig-icon-button-disabled-foreground, hsl(from var(--ig-gray-900) h s l/0.2));--disabled-border-color: var(--ig-icon-button-disabled-border-color, hsl(from var(--ig-gray-900) h s l/0.15));--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 1) * 2.5rem), 2.5rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(2rem, -1 * 2rem), var(--is-medium, 1) * max(1.75rem, -1 * 1.75rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));--default-size: var(--ig-icon-button-default-size, 2);--ig-theme: indigo;--component-size: var(--ig-size, var(--default-size))}:host([variant=outlined]) [part~=base]{border-width:.125rem}:host([variant=outlined]) [part~=base]:hover,:host([variant=outlined]) [part~=base]:active{border-color:var(--foreground)}:host([variant=outlined]) [part="base focused"]{border-color:var(--border-color);box-shadow:0 0 0 .1875rem var(--focus-border-color)}:host([variant=outlined]) [part="base focused"]:hover,:host([variant=outlined]) [part="base focused"]:active{border-color:var(--foreground)}:host([variant=outlined]) [part~=base]:hover igc-icon,:host([variant=outlined]) [part~=base]:active igc-icon,:host([variant=flat]) [part~=base]:hover igc-icon,:host([variant=flat]) [part~=base]:active igc-icon{color:var(--hover-foreground)}:host([variant=outlined]) [part="base focused"] igc-icon,:host([variant=flat]) [part="base focused"] igc-icon{color:var(--focus-foreground)}:host([variant=outlined]) [part="base focused"]:hover igc-icon,:host([variant=outlined]) [part="base focused"]:active igc-icon,:host([variant=flat]) [part="base focused"]:hover igc-icon,:host([variant=flat]) [part="base focused"]:active igc-icon{color:var(--focus-hover-foreground)}:host([disabled]) [part~=base],:host(:disabled) [part~=base]{box-shadow:none}`;
|
|
3
3
|
//# sourceMappingURL=icon-button.indigo.css.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"icon-button.indigo.css.js","sourceRoot":"","sources":["../../../../../../src/components/button/themes/icon-button/shared/icon-button.indigo.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,
|
|
1
|
+
{"version":3,"file":"icon-button.indigo.css.js","sourceRoot":"","sources":["../../../../../../src/components/button/themes/icon-button/shared/icon-button.indigo.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,i8OAAi8O,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{--icon-size: 1rem}[part=icon]{--size: 1rem}[part~=base]{transition:color .15s ease-in-out,box-shadow .15s ease-in-out,background .15s ease-in-out;padding:max(var(--is-large, 1)*max(8px, -1 * 8px)*var(--ig-spacing-large, var(--ig-spacing, --ig-spacing)),var(--is-medium, 1)*max(6px, -1 * 6px)*var(--ig-spacing-medium, var(--ig-spacing, --ig-spacing)),var(--is-small, 1)*max(4px, -1 * 4px)*var(--ig-spacing-small, var(--ig-spacing, --ig-spacing)))}:host([variant=flat]){--shadow-color: var(--ig-icon-button-shadow-color, hsl(from var(--ig-gray-900) h s l/0.15));--background: var(--ig-icon-button-background, transparent);--foreground: var(--ig-icon-button-foreground, var(--ig-gray-600));--hover-background: var(--ig-icon-button-hover-background, hsl(from var(--ig-gray-900) h s l/0.05));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-gray-700));--focus-background: var(--ig-icon-button-focus-background, transparent);--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-gray-600));--focus-hover-background: var(--ig-icon-button-focus-hover-background, hsl(from var(--ig-gray-900) h s l/0.05));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-gray-700));--active-background: var(--ig-icon-button-active-background, hsl(from var(--ig-gray-900) h s l/0.05));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-gray-700));--border-color: var(--ig-icon-button-border-color, transparent);--focus-border-color: var(--ig-icon-button-focus-border-color, hsl(from var(--ig-gray-900) h s l/0.15));--disabled-background: var(--ig-icon-button-disabled-background, transparent);--disabled-foreground: var(--ig-icon-button-disabled-foreground, hsl(from var(--ig-gray-900) h s l/0.2));--disabled-border-color: var(--ig-icon-button-disabled-border-color, transparent);--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 1) * 2.5rem), 2.5rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(2rem, -1 * 2rem), var(--is-medium, 1) * max(1.75rem, -1 * 1.75rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));--default-size: var(--ig-icon-button-default-size, 2);--ig-theme: indigo;--component-size: var(--ig-size, var(--default-size))}:host([variant=flat]) [part=\"base focused\"]{border-color:var(--border-color);box-shadow:0 0 0 .1875rem var(--focus-border-color)}:host([variant=contained]){--shadow-color: var(--ig-icon-button-shadow-color, hsl(from var(--ig-primary-400) h s l/0.5));--background: var(--ig-icon-button-background, var(--ig-primary-500));--foreground: var(--ig-icon-button-foreground, hsl(from var(--ig-primary-500-contrast) h s l/0.8));--hover-background: var(--ig-icon-button-hover-background, var(--ig-primary-400));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-primary-500-contrast));--focus-background: var(--ig-icon-button-focus-background, var(--ig-primary-500));--focus-foreground: var(--ig-icon-button-focus-foreground, hsl(from var(--ig-primary-500-contrast) h s l/0.8));--focus-hover-background: var(--ig-icon-button-focus-hover-background, var(--ig-primary-400));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-primary-500-contrast));--active-background: var(--ig-icon-button-active-background, var(--ig-primary-400));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-primary-500-contrast));--border-color: var(--ig-icon-button-border-color, transparent);--focus-border-color: var(--ig-icon-button-focus-border-color, hsl(from var(--ig-primary-400) h s l/0.5));--disabled-background: var(--ig-icon-button-disabled-background, hsl(from var(--ig-primary-400) h s l/0.5));--disabled-foreground: var(--ig-icon-button-disabled-foreground, hsl(from var(--ig-primary-500-contrast) h s l/0.3));--disabled-border-color: var(--ig-icon-button-disabled-border-color, transparent);--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 1) * 2.5rem), 2.5rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(2rem, -1 * 2rem), var(--is-medium, 1) * max(1.75rem, -1 * 1.75rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));--default-size: var(--ig-icon-button-default-size, 2);--ig-theme: indigo;--component-size: var(--ig-size, var(--default-size))}:host([variant=contained]) [part~=base]:hover igc-icon,:host([variant=contained]) [part~=base]:active igc-icon{color:var(--hover-foreground)}:host([variant=contained]) [part=\"base focused\"]{box-shadow:0 0 0 .1875rem var(--focus-border-color)}:host([variant=outlined]){--shadow-color: var(--ig-icon-button-shadow-color, hsl(from var(--ig-gray-900) h s l/0.15));--background: var(--ig-icon-button-background, transparent);--foreground: var(--ig-icon-button-foreground, var(--ig-gray-600));--hover-background: var(--ig-icon-button-hover-background, hsl(from var(--ig-gray-900) h s l/0.05));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-gray-700));--focus-background: var(--ig-icon-button-focus-background, transparent);--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-gray-600));--focus-hover-background: var(--ig-icon-button-focus-hover-background, hsl(from var(--ig-gray-900) h s l/0.05));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-gray-700));--active-background: var(--ig-icon-button-active-background, hsl(from var(--ig-gray-900) h s l/0.05));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-gray-700));--border-color: var(--ig-icon-button-border-color, var(--ig-gray-500));--focus-border-color: var(--ig-icon-button-focus-border-color, hsl(from var(--ig-gray-900) h s l/0.15));--disabled-background: var(--ig-icon-button-disabled-background, transparent);--disabled-foreground: var(--ig-icon-button-disabled-foreground, hsl(from var(--ig-gray-900) h s l/0.2));--disabled-border-color: var(--ig-icon-button-disabled-border-color, hsl(from var(--ig-gray-900) h s l/0.15));--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 1) * 2.5rem), 2.5rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(2rem, -1 * 2rem), var(--is-medium, 1) * max(1.75rem, -1 * 1.75rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));--default-size: var(--ig-icon-button-default-size, 2);--ig-theme: indigo;--component-size: var(--ig-size, var(--default-size))}:host([variant=outlined]) [part~=base]{border-width:.125rem}:host([variant=outlined]) [part~=base]:hover,:host([variant=outlined]) [part~=base]:active{border-color:var(--foreground)}:host([variant=outlined]) [part=\"base focused\"]{border-color:var(--border-color);box-shadow:0 0 0 .1875rem var(--focus-border-color)}:host([variant=outlined]) [part=\"base focused\"]:hover,:host([variant=outlined]) [part=\"base focused\"]:active{border-color:var(--foreground)}:host([variant=outlined]) [part~=base]:hover igc-icon,:host([variant=outlined]) [part~=base]:active igc-icon,:host([variant=flat]) [part~=base]:hover igc-icon,:host([variant=flat]) [part~=base]:active igc-icon{color:var(--hover-foreground)}:host([variant=outlined]) [part=\"base focused\"] igc-icon,:host([variant=flat]) [part=\"base focused\"] igc-icon{color:var(--focus-foreground)}:host([variant=outlined]) [part=\"base focused\"]:hover igc-icon,:host([variant=outlined]) [part=\"base focused\"]:active igc-icon,:host([variant=flat]) [part=\"base focused\"]:hover igc-icon,:host([variant=flat]) [part=\"base focused\"]:active igc-icon{color:var(--focus-hover-foreground)}:host([disabled]) [part~=base],:host(:disabled) [part~=base]{box-shadow:none}`;\n"]}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import { css } from 'lit';
|
|
2
|
-
export const styles = css `[part~=base]{padding:max(var(--is-large, 1)*max(9px, -1 * 9px)*var(--ig-spacing-large, var(--ig-spacing, --ig-spacing)),var(--is-medium, 1)*max(6px, -1 * 6px)*var(--ig-spacing-medium, var(--ig-spacing, --ig-spacing)),var(--is-small, 1)*max(3px, -1 * 3px)*var(--ig-spacing-small, var(--ig-spacing, --ig-spacing)))}:host([variant=flat]){--shadow-color: var(--ig-icon-button-shadow-color, transparent);--background: var(--ig-icon-button-background, transparent);--foreground: var(--ig-icon-button-foreground, var(--ig-gray-900));--hover-background: var(--ig-icon-button-hover-background, hsl(from var(--ig-gray-500) h s l/0.08));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-gray-900));--focus-background: var(--ig-icon-button-focus-background, hsl(from var(--ig-gray-500) h s l/0.16));--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-gray-900));--focus-hover-background: var(--ig-icon-button-focus-hover-background, hsl(from var(--ig-gray-500) h s l/0.24));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-gray-900));--active-background: var(--ig-icon-button-active-background, hsl(from var(--ig-gray-500) h s l/0.32));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-gray-900));--border-color: var(--ig-icon-button-border-color, transparent);--focus-border-color: var(--ig-icon-button-focus-border-color, transparent);--disabled-background: var(--ig-icon-button-disabled-background, transparent);--disabled-foreground: var(--ig-icon-button-disabled-foreground, var(--ig-gray-500));--disabled-border-color: var(--ig-icon-button-disabled-border-color, transparent);--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 1) * 1.25rem), 1.25rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(2.25rem, -1 * 2.25rem), var(--is-medium, 1) * max(1.875rem, -1 * 1.875rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));--default-size: var(--ig-icon-button-default-size, 3);--component-size: var(--ig-size, var(--default-size))}:host([variant=flat]) [part~=base]:active{background:var(--focus-background);color:var(--focus-foreground)}:host([variant=flat]) [part="base focused"]:active{background:var(--active-background);color:var(--active-foreground)}:host([variant=contained]){--shadow-color: var(--ig-icon-button-shadow-color, transparent);--background: var(--ig-icon-button-background, hsl(from var(--ig-gray-900) h s l/0.08));--foreground: var(--ig-icon-button-foreground, var(--ig-gray-900));--hover-background: var(--ig-icon-button-hover-background, hsl(from var(--ig-gray-900) h s l/0.12));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-gray-900));--focus-background: var(--ig-icon-button-focus-background, hsl(from var(--ig-gray-900) h s l/0.16));--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-gray-900));--focus-hover-background: var(--ig-icon-button-focus-hover-background, hsl(from var(--ig-gray-900) h s l/0.2));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-gray-900));--active-background: var(--ig-icon-button-active-background, hsl(from var(--ig-gray-900) h s l/0.24));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-gray-900));--border-color: var(--ig-icon-button-border-color, transparent);--focus-border-color: var(--ig-icon-button-focus-border-color, transparent);--disabled-background: var(--ig-icon-button-disabled-background, hsl(from var(--ig-gray-900) h s l/0.04));--disabled-foreground: var(--ig-icon-button-disabled-foreground, var(--ig-gray-500));--disabled-border-color: var(--ig-icon-button-disabled-border-color, transparent);--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 1) * 1.25rem), 1.25rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(2.25rem, -1 * 2.25rem), var(--is-medium, 1) * max(1.875rem, -1 * 1.875rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));--default-size: var(--ig-icon-button-default-size, 3);--component-size: var(--ig-size, var(--default-size))}:host([variant=contained]) [part~=base]:active{background:var(--focus-background);color:var(--focus-foreground)}:host([variant=contained]) [part="base focused"]:active{background:var(--active-background);color:var(--active-foreground)}:host([variant=outlined]){--shadow-color: var(--ig-icon-button-shadow-color, transparent);--background: var(--ig-icon-button-background, transparent);--foreground: var(--ig-icon-button-foreground, var(--ig-gray-900));--hover-background: var(--ig-icon-button-hover-background, hsl(from var(--ig-gray-500) h s l/0.08));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-gray-900));--focus-background: var(--ig-icon-button-focus-background, hsl(from var(--ig-gray-500) h s l/0.16));--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-gray-900));--focus-hover-background: var(--ig-icon-button-focus-hover-background, hsl(from var(--ig-gray-500) h s l/0.24));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-gray-900));--active-background: var(--ig-icon-button-active-background, hsl(from var(--ig-gray-500) h s l/0.32));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-gray-900));--border-color: var(--ig-icon-button-border-color, var(--ig-gray-300));--focus-border-color: var(--ig-icon-button-focus-border-color, var(--ig-gray-300));--disabled-background: var(--ig-icon-button-disabled-background, transparent);--disabled-foreground: var(--ig-icon-button-disabled-foreground, var(--ig-gray-500));--disabled-border-color: var(--ig-icon-button-disabled-border-color, var(--ig-gray-300));--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 1) * 1.25rem), 1.25rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(2.25rem, -1 * 2.25rem), var(--is-medium, 1) * max(1.875rem, -1 * 1.875rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));--default-size: var(--ig-icon-button-default-size, 3);--component-size: var(--ig-size, var(--default-size))}:host([variant=outlined]) [part~=base]{border:none}:host([variant=outlined]) [part~=base]::after{position:absolute;content:"";inset:0;box-shadow:inset 0 0 0 .0625rem var(--border-color);border-radius:inherit}:host([variant=outlined]) [part~=base]:active{background:var(--focus-background);color:var(--focus-foreground)}:host([variant=outlined]) [part="base focused"]{border:none}:host([variant=outlined]) [part="base focused"]::after{box-shadow:inset 0 0 0 .0625rem var(--focus-border-color)}:host([variant=outlined]) [part="base focused"]:active{background:var(--active-background);color:var(--active-foreground)}`;
|
|
2
|
+
export const styles = css `[part~=base]{padding:max(var(--is-large, 1)*max(9px, -1 * 9px)*var(--ig-spacing-large, var(--ig-spacing, --ig-spacing)),var(--is-medium, 1)*max(6px, -1 * 6px)*var(--ig-spacing-medium, var(--ig-spacing, --ig-spacing)),var(--is-small, 1)*max(3px, -1 * 3px)*var(--ig-spacing-small, var(--ig-spacing, --ig-spacing)))}:host([variant=flat]){--shadow-color: var(--ig-icon-button-shadow-color, transparent);--background: var(--ig-icon-button-background, transparent);--foreground: var(--ig-icon-button-foreground, var(--ig-gray-900));--hover-background: var(--ig-icon-button-hover-background, hsl(from var(--ig-gray-500) h s l/0.08));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-gray-900));--focus-background: var(--ig-icon-button-focus-background, hsl(from var(--ig-gray-500) h s l/0.16));--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-gray-900));--focus-hover-background: var(--ig-icon-button-focus-hover-background, hsl(from var(--ig-gray-500) h s l/0.24));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-gray-900));--active-background: var(--ig-icon-button-active-background, hsl(from var(--ig-gray-500) h s l/0.32));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-gray-900));--border-color: var(--ig-icon-button-border-color, transparent);--focus-border-color: var(--ig-icon-button-focus-border-color, transparent);--disabled-background: var(--ig-icon-button-disabled-background, transparent);--disabled-foreground: var(--ig-icon-button-disabled-foreground, var(--ig-gray-500));--disabled-border-color: var(--ig-icon-button-disabled-border-color, transparent);--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 1) * 1.25rem), 1.25rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(2.25rem, -1 * 2.25rem), var(--is-medium, 1) * max(1.875rem, -1 * 1.875rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));--default-size: var(--ig-icon-button-default-size, 3);--ig-theme: material;--component-size: var(--ig-size, var(--default-size))}:host([variant=flat]) [part~=base]:active{background:var(--focus-background);color:var(--focus-foreground)}:host([variant=flat]) [part="base focused"]:active{background:var(--active-background);color:var(--active-foreground)}:host([variant=contained]){--shadow-color: var(--ig-icon-button-shadow-color, transparent);--background: var(--ig-icon-button-background, hsl(from var(--ig-gray-900) h s l/0.08));--foreground: var(--ig-icon-button-foreground, var(--ig-gray-900));--hover-background: var(--ig-icon-button-hover-background, hsl(from var(--ig-gray-900) h s l/0.12));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-gray-900));--focus-background: var(--ig-icon-button-focus-background, hsl(from var(--ig-gray-900) h s l/0.16));--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-gray-900));--focus-hover-background: var(--ig-icon-button-focus-hover-background, hsl(from var(--ig-gray-900) h s l/0.2));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-gray-900));--active-background: var(--ig-icon-button-active-background, hsl(from var(--ig-gray-900) h s l/0.24));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-gray-900));--border-color: var(--ig-icon-button-border-color, transparent);--focus-border-color: var(--ig-icon-button-focus-border-color, transparent);--disabled-background: var(--ig-icon-button-disabled-background, hsl(from var(--ig-gray-900) h s l/0.04));--disabled-foreground: var(--ig-icon-button-disabled-foreground, var(--ig-gray-500));--disabled-border-color: var(--ig-icon-button-disabled-border-color, transparent);--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 1) * 1.25rem), 1.25rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(2.25rem, -1 * 2.25rem), var(--is-medium, 1) * max(1.875rem, -1 * 1.875rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));--default-size: var(--ig-icon-button-default-size, 3);--ig-theme: material;--component-size: var(--ig-size, var(--default-size))}:host([variant=contained]) [part~=base]:active{background:var(--focus-background);color:var(--focus-foreground)}:host([variant=contained]) [part="base focused"]:active{background:var(--active-background);color:var(--active-foreground)}:host([variant=outlined]){--shadow-color: var(--ig-icon-button-shadow-color, transparent);--background: var(--ig-icon-button-background, transparent);--foreground: var(--ig-icon-button-foreground, var(--ig-gray-900));--hover-background: var(--ig-icon-button-hover-background, hsl(from var(--ig-gray-500) h s l/0.08));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-gray-900));--focus-background: var(--ig-icon-button-focus-background, hsl(from var(--ig-gray-500) h s l/0.16));--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-gray-900));--focus-hover-background: var(--ig-icon-button-focus-hover-background, hsl(from var(--ig-gray-500) h s l/0.24));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-gray-900));--active-background: var(--ig-icon-button-active-background, hsl(from var(--ig-gray-500) h s l/0.32));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-gray-900));--border-color: var(--ig-icon-button-border-color, var(--ig-gray-300));--focus-border-color: var(--ig-icon-button-focus-border-color, var(--ig-gray-300));--disabled-background: var(--ig-icon-button-disabled-background, transparent);--disabled-foreground: var(--ig-icon-button-disabled-foreground, var(--ig-gray-500));--disabled-border-color: var(--ig-icon-button-disabled-border-color, var(--ig-gray-300));--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 1) * 1.25rem), 1.25rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(2.25rem, -1 * 2.25rem), var(--is-medium, 1) * max(1.875rem, -1 * 1.875rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));--default-size: var(--ig-icon-button-default-size, 3);--ig-theme: material;--component-size: var(--ig-size, var(--default-size))}:host([variant=outlined]) [part~=base]{border:none}:host([variant=outlined]) [part~=base]::after{position:absolute;content:"";inset:0;box-shadow:inset 0 0 0 .0625rem var(--border-color);border-radius:inherit}:host([variant=outlined]) [part~=base]:active{background:var(--focus-background);color:var(--focus-foreground)}:host([variant=outlined]) [part="base focused"]{border:none}:host([variant=outlined]) [part="base focused"]::after{box-shadow:inset 0 0 0 .0625rem var(--focus-border-color)}:host([variant=outlined]) [part="base focused"]:active{background:var(--active-background);color:var(--active-foreground)}`;
|
|
3
3
|
//# sourceMappingURL=icon-button.material.css.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"icon-button.material.css.js","sourceRoot":"","sources":["../../../../../../src/components/button/themes/icon-button/shared/icon-button.material.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,
|
|
1
|
+
{"version":3,"file":"icon-button.material.css.js","sourceRoot":"","sources":["../../../../../../src/components/button/themes/icon-button/shared/icon-button.material.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,wpNAAwpN,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`[part~=base]{padding:max(var(--is-large, 1)*max(9px, -1 * 9px)*var(--ig-spacing-large, var(--ig-spacing, --ig-spacing)),var(--is-medium, 1)*max(6px, -1 * 6px)*var(--ig-spacing-medium, var(--ig-spacing, --ig-spacing)),var(--is-small, 1)*max(3px, -1 * 3px)*var(--ig-spacing-small, var(--ig-spacing, --ig-spacing)))}:host([variant=flat]){--shadow-color: var(--ig-icon-button-shadow-color, transparent);--background: var(--ig-icon-button-background, transparent);--foreground: var(--ig-icon-button-foreground, var(--ig-gray-900));--hover-background: var(--ig-icon-button-hover-background, hsl(from var(--ig-gray-500) h s l/0.08));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-gray-900));--focus-background: var(--ig-icon-button-focus-background, hsl(from var(--ig-gray-500) h s l/0.16));--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-gray-900));--focus-hover-background: var(--ig-icon-button-focus-hover-background, hsl(from var(--ig-gray-500) h s l/0.24));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-gray-900));--active-background: var(--ig-icon-button-active-background, hsl(from var(--ig-gray-500) h s l/0.32));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-gray-900));--border-color: var(--ig-icon-button-border-color, transparent);--focus-border-color: var(--ig-icon-button-focus-border-color, transparent);--disabled-background: var(--ig-icon-button-disabled-background, transparent);--disabled-foreground: var(--ig-icon-button-disabled-foreground, var(--ig-gray-500));--disabled-border-color: var(--ig-icon-button-disabled-border-color, transparent);--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 1) * 1.25rem), 1.25rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(2.25rem, -1 * 2.25rem), var(--is-medium, 1) * max(1.875rem, -1 * 1.875rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));--default-size: var(--ig-icon-button-default-size, 3);--ig-theme: material;--component-size: var(--ig-size, var(--default-size))}:host([variant=flat]) [part~=base]:active{background:var(--focus-background);color:var(--focus-foreground)}:host([variant=flat]) [part=\"base focused\"]:active{background:var(--active-background);color:var(--active-foreground)}:host([variant=contained]){--shadow-color: var(--ig-icon-button-shadow-color, transparent);--background: var(--ig-icon-button-background, hsl(from var(--ig-gray-900) h s l/0.08));--foreground: var(--ig-icon-button-foreground, var(--ig-gray-900));--hover-background: var(--ig-icon-button-hover-background, hsl(from var(--ig-gray-900) h s l/0.12));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-gray-900));--focus-background: var(--ig-icon-button-focus-background, hsl(from var(--ig-gray-900) h s l/0.16));--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-gray-900));--focus-hover-background: var(--ig-icon-button-focus-hover-background, hsl(from var(--ig-gray-900) h s l/0.2));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-gray-900));--active-background: var(--ig-icon-button-active-background, hsl(from var(--ig-gray-900) h s l/0.24));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-gray-900));--border-color: var(--ig-icon-button-border-color, transparent);--focus-border-color: var(--ig-icon-button-focus-border-color, transparent);--disabled-background: var(--ig-icon-button-disabled-background, hsl(from var(--ig-gray-900) h s l/0.04));--disabled-foreground: var(--ig-icon-button-disabled-foreground, var(--ig-gray-500));--disabled-border-color: var(--ig-icon-button-disabled-border-color, transparent);--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 1) * 1.25rem), 1.25rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(2.25rem, -1 * 2.25rem), var(--is-medium, 1) * max(1.875rem, -1 * 1.875rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));--default-size: var(--ig-icon-button-default-size, 3);--ig-theme: material;--component-size: var(--ig-size, var(--default-size))}:host([variant=contained]) [part~=base]:active{background:var(--focus-background);color:var(--focus-foreground)}:host([variant=contained]) [part=\"base focused\"]:active{background:var(--active-background);color:var(--active-foreground)}:host([variant=outlined]){--shadow-color: var(--ig-icon-button-shadow-color, transparent);--background: var(--ig-icon-button-background, transparent);--foreground: var(--ig-icon-button-foreground, var(--ig-gray-900));--hover-background: var(--ig-icon-button-hover-background, hsl(from var(--ig-gray-500) h s l/0.08));--hover-foreground: var(--ig-icon-button-hover-foreground, var(--ig-gray-900));--focus-background: var(--ig-icon-button-focus-background, hsl(from var(--ig-gray-500) h s l/0.16));--focus-foreground: var(--ig-icon-button-focus-foreground, var(--ig-gray-900));--focus-hover-background: var(--ig-icon-button-focus-hover-background, hsl(from var(--ig-gray-500) h s l/0.24));--focus-hover-foreground: var(--ig-icon-button-focus-hover-foreground, var(--ig-gray-900));--active-background: var(--ig-icon-button-active-background, hsl(from var(--ig-gray-500) h s l/0.32));--active-foreground: var(--ig-icon-button-active-foreground, var(--ig-gray-900));--border-color: var(--ig-icon-button-border-color, var(--ig-gray-300));--focus-border-color: var(--ig-icon-button-focus-border-color, var(--ig-gray-300));--disabled-background: var(--ig-icon-button-disabled-background, transparent);--disabled-foreground: var(--ig-icon-button-disabled-foreground, var(--ig-gray-500));--disabled-border-color: var(--ig-icon-button-disabled-border-color, var(--ig-gray-300));--border-radius: var(--ig-icon-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 1) * 1.25rem), 1.25rem));--size: var(--ig-icon-button-size, max(var(--is-large, 1) * max(2.25rem, -1 * 2.25rem), var(--is-medium, 1) * max(1.875rem, -1 * 1.875rem), var(--is-small, 1) * max(1.5rem, -1 * 1.5rem)));--default-size: var(--ig-icon-button-default-size, 3);--ig-theme: material;--component-size: var(--ig-size, var(--default-size))}:host([variant=outlined]) [part~=base]{border:none}:host([variant=outlined]) [part~=base]::after{position:absolute;content:\"\";inset:0;box-shadow:inset 0 0 0 .0625rem var(--border-color);border-radius:inherit}:host([variant=outlined]) [part~=base]:active{background:var(--focus-background);color:var(--focus-foreground)}:host([variant=outlined]) [part=\"base focused\"]{border:none}:host([variant=outlined]) [part=\"base focused\"]::after{box-shadow:inset 0 0 0 .0625rem var(--focus-border-color)}:host([variant=outlined]) [part=\"base focused\"]:active{background:var(--active-background);color:var(--active-foreground)}`;\n"]}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { LitElement } from 'lit';
|
|
2
2
|
import type { Constructor } from '../common/mixins/constructor.js';
|
|
3
|
+
import type { ButtonGroupSelection, ContentOrientation } from '../types.js';
|
|
3
4
|
export interface IgcButtonGroupComponentEventMap {
|
|
4
5
|
igcSelect: CustomEvent<string | undefined>;
|
|
5
6
|
igcDeselect: CustomEvent<string | undefined>;
|
|
@@ -35,12 +36,12 @@ export default class IgcButtonGroupComponent extends IgcButtonGroupComponent_bas
|
|
|
35
36
|
* Sets the orientation of the buttons in the group.
|
|
36
37
|
* @attr
|
|
37
38
|
*/
|
|
38
|
-
alignment:
|
|
39
|
+
alignment: ContentOrientation;
|
|
39
40
|
/**
|
|
40
41
|
* Controls the mode of selection for the button group.
|
|
41
42
|
* @attr
|
|
42
43
|
*/
|
|
43
|
-
selection:
|
|
44
|
+
selection: ButtonGroupSelection;
|
|
44
45
|
/**
|
|
45
46
|
* Gets/Sets the currently selected buttons (their values).
|
|
46
47
|
* @attr
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button-group.js","sourceRoot":"","sources":["../../../src/components/button-group/button-group.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, html } from 'lit';\nimport { property, queryAssignedElements } from 'lit/decorators.js';\n\nimport { themes } from '../../theming/theming-decorator.js';\nimport {\n type MutationControllerParams,\n createMutationController,\n} from '../common/controllers/mutation-observer.js';\nimport { watch } from '../common/decorators/watch.js';\nimport { registerComponent } from '../common/definitions/register.js';\nimport type { Constructor } from '../common/mixins/constructor.js';\nimport { EventEmitterMixin } from '../common/mixins/event-emitter.js';\nimport { findElementFromEventPath, last } from '../common/util.js';\nimport { styles } from './themes/group.base.css.js';\nimport { all } from './themes/group.js';\nimport { styles as shared } from './themes/shared/group/group.common.css.js';\nimport IgcToggleButtonComponent from './toggle-button.js';\n\nexport interface IgcButtonGroupComponentEventMap {\n igcSelect: CustomEvent<string | undefined>;\n igcDeselect: CustomEvent<string | undefined>;\n}\n\n/* blazorAdditionalDependency: IgcToggleButtonComponent */\n/**\n * The `igc-button-group` groups a series of `igc-toggle-button`s together, exposing features such as layout and selection.\n *\n * @element igc-button-group\n *\n * @slot - Renders `igc-toggle-button` component.\n *\n * @fires igcSelect - Emitted when a button is selected through user interaction.\n * @fires igcDeselect - Emitted when a button is deselected through user interaction.\n *\n * @csspart group - The button group container.\n */\n@themes(all)\nexport default class IgcButtonGroupComponent extends EventEmitterMixin<\n IgcButtonGroupComponentEventMap,\n Constructor<LitElement>\n>(LitElement) {\n public static readonly tagName = 'igc-button-group';\n public static styles = [styles, shared];\n\n /* blazorSuppress */\n public static register() {\n registerComponent(IgcButtonGroupComponent, IgcToggleButtonComponent);\n }\n\n private get isMultiple() {\n return this.selection === 'multiple';\n }\n\n private _selectedItems: Set<string> = new Set();\n\n private _observerCallback({\n changes: { added, attributes },\n }: MutationControllerParams<IgcToggleButtonComponent>) {\n if (this.isMultiple || this._selectedButtons.length <= 1) {\n return;\n }\n\n const buttons = this.toggleButtons;\n const idx = buttons.indexOf(\n added.length ? last(added).node : last(attributes)\n );\n\n for (const [i, button] of buttons.entries()) {\n if (button.selected && i !== idx) {\n button.selected = false;\n }\n }\n }\n\n private get _selectedButtons(): Array<IgcToggleButtonComponent> {\n return this.toggleButtons.filter((b) => b.selected);\n }\n\n @queryAssignedElements({ selector: IgcToggleButtonComponent.tagName })\n private toggleButtons!: Array<IgcToggleButtonComponent>;\n\n /**\n * Disables all buttons inside the group.\n * @attr\n */\n @property({ type: Boolean, reflect: true })\n public disabled = false;\n\n /**\n * Sets the orientation of the buttons in the group.\n * @attr\n */\n @property({ reflect: true })\n public alignment: 'horizontal' | 'vertical' = 'horizontal';\n\n /**\n * Controls the mode of selection for the button group.\n * @attr\n */\n @property({ reflect: false })\n public selection: 'single' | 'single-required' | 'multiple' = 'single';\n\n /**\n * Gets/Sets the currently selected buttons (their values).\n * @attr\n */\n @property({ attribute: 'selected-items', type: Array, reflect: false })\n public get selectedItems(): string[] {\n return this._selectedButtons.map((b) => b.value).filter((v) => v);\n }\n\n public set selectedItems(values: string[]) {\n this._selectedItems = new Set(Array.isArray(values) ? values : []);\n this.setSelection(this._selectedItems);\n }\n\n @watch('disabled', { waitUntilFirstUpdate: true })\n protected updateDisabledState() {\n this.toggleButtons.forEach((b) => {\n b.disabled = this.disabled;\n });\n }\n\n @watch('selection', { waitUntilFirstUpdate: true })\n protected updateSelectionState() {\n if (this._selectedButtons.length) {\n this.toggleButtons.forEach((b) => {\n b.selected = false;\n });\n }\n }\n\n constructor() {\n super();\n\n createMutationController(this, {\n callback: this._observerCallback,\n filter: [IgcToggleButtonComponent.tagName],\n config: {\n attributeFilter: ['selected'],\n childList: true,\n subtree: true,\n },\n });\n }\n\n protected override firstUpdated() {\n if (this.disabled) {\n this.updateDisabledState();\n }\n\n const buttons = this._selectedButtons;\n\n if (buttons.length) {\n if (!this.isMultiple) {\n const index = buttons.indexOf(buttons.at(-1)!);\n\n for (let i = 0; i < index; i++) {\n buttons[i].selected = false;\n }\n }\n } else {\n this.setSelection(this._selectedItems);\n }\n }\n\n private handleClick(event: MouseEvent) {\n const button = findElementFromEventPath<IgcToggleButtonComponent>(\n IgcToggleButtonComponent.tagName,\n event\n );\n\n if (button) {\n this.isMultiple\n ? this.handleMultipleSelection(button)\n : this.handleSingleSelection(button);\n }\n }\n\n private handleSingleSelection(button: IgcToggleButtonComponent) {\n const singleRequired = this.selection === 'single-required';\n const selectedButton = this._selectedButtons.at(0);\n const isSame = selectedButton && selectedButton.value === button.value;\n\n if (selectedButton) {\n if (singleRequired && isSame) return;\n this.emitDeselectEvent(selectedButton);\n }\n if (isSame) return;\n this.emitSelectEvent(button);\n }\n\n private handleMultipleSelection(button: IgcToggleButtonComponent) {\n button.selected\n ? this.emitDeselectEvent(button)\n : this.emitSelectEvent(button);\n }\n\n private emitSelectEvent(button: IgcToggleButtonComponent) {\n button.selected = true;\n this.emitEvent('igcSelect', { detail: button.value });\n }\n\n private emitDeselectEvent(button: IgcToggleButtonComponent) {\n button.selected = false;\n this.emitEvent('igcDeselect', { detail: button.value });\n }\n\n private setSelection(values: Set<string>) {\n if (!values.size) {\n this.toggleButtons.forEach((b) => {\n b.selected = false;\n });\n return;\n }\n\n for (const button of this.toggleButtons) {\n if (values.has(button.value)) {\n button.selected = true;\n if (!this.isMultiple) {\n break;\n }\n }\n }\n }\n\n protected override render() {\n return html`\n <div\n part=\"group\"\n role=\"group\"\n aria-disabled=${this.disabled}\n @click=${this.handleClick}\n >\n <slot></slot>\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-button-group': IgcButtonGroupComponent;\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"button-group.js","sourceRoot":"","sources":["../../../src/components/button-group/button-group.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, html } from 'lit';\nimport { property, queryAssignedElements } from 'lit/decorators.js';\n\nimport { themes } from '../../theming/theming-decorator.js';\nimport {\n type MutationControllerParams,\n createMutationController,\n} from '../common/controllers/mutation-observer.js';\nimport { watch } from '../common/decorators/watch.js';\nimport { registerComponent } from '../common/definitions/register.js';\nimport type { Constructor } from '../common/mixins/constructor.js';\nimport { EventEmitterMixin } from '../common/mixins/event-emitter.js';\nimport { findElementFromEventPath, last } from '../common/util.js';\nimport type { ButtonGroupSelection, ContentOrientation } from '../types.js';\nimport { styles } from './themes/group.base.css.js';\nimport { all } from './themes/group.js';\nimport { styles as shared } from './themes/shared/group/group.common.css.js';\nimport IgcToggleButtonComponent from './toggle-button.js';\n\nexport interface IgcButtonGroupComponentEventMap {\n igcSelect: CustomEvent<string | undefined>;\n igcDeselect: CustomEvent<string | undefined>;\n}\n\n/* blazorAdditionalDependency: IgcToggleButtonComponent */\n/**\n * The `igc-button-group` groups a series of `igc-toggle-button`s together, exposing features such as layout and selection.\n *\n * @element igc-button-group\n *\n * @slot - Renders `igc-toggle-button` component.\n *\n * @fires igcSelect - Emitted when a button is selected through user interaction.\n * @fires igcDeselect - Emitted when a button is deselected through user interaction.\n *\n * @csspart group - The button group container.\n */\n@themes(all)\nexport default class IgcButtonGroupComponent extends EventEmitterMixin<\n IgcButtonGroupComponentEventMap,\n Constructor<LitElement>\n>(LitElement) {\n public static readonly tagName = 'igc-button-group';\n public static styles = [styles, shared];\n\n /* blazorSuppress */\n public static register() {\n registerComponent(IgcButtonGroupComponent, IgcToggleButtonComponent);\n }\n\n private get isMultiple() {\n return this.selection === 'multiple';\n }\n\n private _selectedItems: Set<string> = new Set();\n\n private _observerCallback({\n changes: { added, attributes },\n }: MutationControllerParams<IgcToggleButtonComponent>) {\n if (this.isMultiple || this._selectedButtons.length <= 1) {\n return;\n }\n\n const buttons = this.toggleButtons;\n const idx = buttons.indexOf(\n added.length ? last(added).node : last(attributes)\n );\n\n for (const [i, button] of buttons.entries()) {\n if (button.selected && i !== idx) {\n button.selected = false;\n }\n }\n }\n\n private get _selectedButtons(): Array<IgcToggleButtonComponent> {\n return this.toggleButtons.filter((b) => b.selected);\n }\n\n @queryAssignedElements({ selector: IgcToggleButtonComponent.tagName })\n private toggleButtons!: Array<IgcToggleButtonComponent>;\n\n /**\n * Disables all buttons inside the group.\n * @attr\n */\n @property({ type: Boolean, reflect: true })\n public disabled = false;\n\n /**\n * Sets the orientation of the buttons in the group.\n * @attr\n */\n @property({ reflect: true })\n public alignment: ContentOrientation = 'horizontal';\n\n /**\n * Controls the mode of selection for the button group.\n * @attr\n */\n @property({ reflect: false })\n public selection: ButtonGroupSelection = 'single';\n\n /**\n * Gets/Sets the currently selected buttons (their values).\n * @attr\n */\n @property({ attribute: 'selected-items', type: Array, reflect: false })\n public get selectedItems(): string[] {\n return this._selectedButtons.map((b) => b.value).filter((v) => v);\n }\n\n public set selectedItems(values: string[]) {\n this._selectedItems = new Set(Array.isArray(values) ? values : []);\n this.setSelection(this._selectedItems);\n }\n\n @watch('disabled', { waitUntilFirstUpdate: true })\n protected updateDisabledState() {\n this.toggleButtons.forEach((b) => {\n b.disabled = this.disabled;\n });\n }\n\n @watch('selection', { waitUntilFirstUpdate: true })\n protected updateSelectionState() {\n if (this._selectedButtons.length) {\n this.toggleButtons.forEach((b) => {\n b.selected = false;\n });\n }\n }\n\n constructor() {\n super();\n\n createMutationController(this, {\n callback: this._observerCallback,\n filter: [IgcToggleButtonComponent.tagName],\n config: {\n attributeFilter: ['selected'],\n childList: true,\n subtree: true,\n },\n });\n }\n\n protected override firstUpdated() {\n if (this.disabled) {\n this.updateDisabledState();\n }\n\n const buttons = this._selectedButtons;\n\n if (buttons.length) {\n if (!this.isMultiple) {\n const index = buttons.indexOf(buttons.at(-1)!);\n\n for (let i = 0; i < index; i++) {\n buttons[i].selected = false;\n }\n }\n } else {\n this.setSelection(this._selectedItems);\n }\n }\n\n private handleClick(event: MouseEvent) {\n const button = findElementFromEventPath<IgcToggleButtonComponent>(\n IgcToggleButtonComponent.tagName,\n event\n );\n\n if (button) {\n this.isMultiple\n ? this.handleMultipleSelection(button)\n : this.handleSingleSelection(button);\n }\n }\n\n private handleSingleSelection(button: IgcToggleButtonComponent) {\n const singleRequired = this.selection === 'single-required';\n const selectedButton = this._selectedButtons.at(0);\n const isSame = selectedButton && selectedButton.value === button.value;\n\n if (selectedButton) {\n if (singleRequired && isSame) return;\n this.emitDeselectEvent(selectedButton);\n }\n if (isSame) return;\n this.emitSelectEvent(button);\n }\n\n private handleMultipleSelection(button: IgcToggleButtonComponent) {\n button.selected\n ? this.emitDeselectEvent(button)\n : this.emitSelectEvent(button);\n }\n\n private emitSelectEvent(button: IgcToggleButtonComponent) {\n button.selected = true;\n this.emitEvent('igcSelect', { detail: button.value });\n }\n\n private emitDeselectEvent(button: IgcToggleButtonComponent) {\n button.selected = false;\n this.emitEvent('igcDeselect', { detail: button.value });\n }\n\n private setSelection(values: Set<string>) {\n if (!values.size) {\n this.toggleButtons.forEach((b) => {\n b.selected = false;\n });\n return;\n }\n\n for (const button of this.toggleButtons) {\n if (values.has(button.value)) {\n button.selected = true;\n if (!this.isMultiple) {\n break;\n }\n }\n }\n }\n\n protected override render() {\n return html`\n <div\n part=\"group\"\n role=\"group\"\n aria-disabled=${this.disabled}\n @click=${this.handleClick}\n >\n <slot></slot>\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-button-group': IgcButtonGroupComponent;\n }\n}\n"]}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import { css } from 'lit';
|
|
2
|
-
export const styles = css `:host{--elevation: var(--ig-button-group-elevation, var(--ig-elevation-0));--idle-shadow-color: var(--ig-button-group-idle-shadow-color, hsl(from var(--ig-primary-600) h s l/0.5));--selected-shadow-color: var(--ig-button-group-selected-shadow-color, hsl(from var(--ig-primary-600) h s l/0.5));--item-text-color: var(--ig-button-group-item-text-color, var(--ig-primary-600-contrast));--item-background: var(--ig-button-group-item-background, var(--ig-primary-500));--item-border-color: var(--ig-button-group-item-border-color, var(--ig-primary-500));--item-hover-background: var(--ig-button-group-item-hover-background, var(--ig-primary-600));--item-hover-text-color: var(--ig-button-group-item-hover-text-color, var(--ig-primary-600-contrast));--item-focused-text-color: var(--ig-button-group-item-focused-text-color, var(--ig-primary-600-contrast));--item-focused-border-color: var(--ig-button-group-item-focused-border-color, var(--ig-gray-400));--disabled-background-color: var(--ig-button-group-disabled-background-color, var(--ig-primary-100));--disabled-selected-background: var(--ig-button-group-disabled-selected-background, hsl(from var(--ig-gray-500) h s l/0.12));--border-radius: var(--ig-button-group-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.2) * 1.25rem), 1.25rem));--default-size: var(--ig-button-group-default-size, 2);--item-icon-color: var(--ig-button-group-item-icon-color, var(--ig-primary-600-contrast));--item-hover-border-color: var(--ig-button-group-item-hover-border-color, var(--ig-primary-500));--item-hover-icon-color: var(--ig-button-group-item-hover-icon-color, var(--ig-primary-600-contrast));--item-focused-background: var(--ig-button-group-item-focused-background, hsl(from var(--ig-primary-900) h s l/0.6));--item-focused-hover-background: var(--ig-button-group-item-focused-hover-background, hsl(from var(--ig-primary-600) h s l/0.5));--item-selected-background: var(--ig-button-group-item-selected-background, var(--ig-primary-700));--item-selected-text-color: var(--ig-button-group-item-selected-text-color, var(--ig-primary-700-contrast));--item-selected-icon-color: var(--ig-button-group-item-selected-icon-color, var(--ig-primary-700-contrast));--item-selected-border-color: var(--ig-button-group-item-selected-border-color, var(--ig-primary-700));--item-selected-hover-background: var(--ig-button-group-item-selected-hover-background, var(--ig-primary-800));--item-selected-hover-text-color: var(--ig-button-group-item-selected-hover-text-color, var(--ig-primary-700-contrast));--item-selected-hover-icon-color: var(--ig-button-group-item-selected-hover-icon-color, var(--ig-primary-700-contrast));--item-selected-hover-border-color: var(--ig-button-group-item-selected-hover-border-color, var(--ig-primary-700));--item-selected-focus-background: var(--ig-button-group-item-selected-focus-background, hsl(from var(--ig-primary-900) h s l/0.9));--item-selected-focus-hover-background: var(--ig-button-group-item-selected-focus-hover-background, hsl(from var(--ig-primary-600) h s l/0.5));--disabled-text-color: var(--ig-button-group-disabled-text-color, var(--ig-primary-200));--item-disabled-border: var(--ig-button-group-item-disabled-border, var(--ig-primary-100));--disabled-selected-text-color: var(--ig-button-group-disabled-selected-text-color, var(--ig-primary-200));--disabled-selected-icon-color: var(--ig-button-group-disabled-selected-icon-color, var(--ig-primary-200));--disabled-selected-border-color: var(--ig-button-group-disabled-selected-border-color, var(--ig-primary-100))}`;
|
|
2
|
+
export const styles = css `:host{--elevation: var(--ig-button-group-elevation, var(--ig-elevation-0));--idle-shadow-color: var(--ig-button-group-idle-shadow-color, hsl(from var(--ig-primary-600) h s l/0.5));--selected-shadow-color: var(--ig-button-group-selected-shadow-color, hsl(from var(--ig-primary-600) h s l/0.5));--item-text-color: var(--ig-button-group-item-text-color, var(--ig-primary-600-contrast));--item-background: var(--ig-button-group-item-background, var(--ig-primary-500));--item-border-color: var(--ig-button-group-item-border-color, var(--ig-primary-500));--item-hover-background: var(--ig-button-group-item-hover-background, var(--ig-primary-600));--item-hover-text-color: var(--ig-button-group-item-hover-text-color, var(--ig-primary-600-contrast));--item-focused-text-color: var(--ig-button-group-item-focused-text-color, var(--ig-primary-600-contrast));--item-focused-border-color: var(--ig-button-group-item-focused-border-color, var(--ig-gray-400));--disabled-background-color: var(--ig-button-group-disabled-background-color, var(--ig-primary-100));--disabled-selected-background: var(--ig-button-group-disabled-selected-background, hsl(from var(--ig-gray-500) h s l/0.12));--border-radius: var(--ig-button-group-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.2) * 1.25rem), 1.25rem));--default-size: var(--ig-button-group-default-size, 2);--item-icon-color: var(--ig-button-group-item-icon-color, var(--ig-primary-600-contrast));--item-hover-border-color: var(--ig-button-group-item-hover-border-color, var(--ig-primary-500));--item-hover-icon-color: var(--ig-button-group-item-hover-icon-color, var(--ig-primary-600-contrast));--item-focused-background: var(--ig-button-group-item-focused-background, hsl(from var(--ig-primary-900) h s l/0.6));--item-focused-hover-background: var(--ig-button-group-item-focused-hover-background, hsl(from var(--ig-primary-600) h s l/0.5));--item-selected-background: var(--ig-button-group-item-selected-background, var(--ig-primary-700));--item-selected-text-color: var(--ig-button-group-item-selected-text-color, var(--ig-primary-700-contrast));--item-selected-icon-color: var(--ig-button-group-item-selected-icon-color, var(--ig-primary-700-contrast));--item-selected-border-color: var(--ig-button-group-item-selected-border-color, var(--ig-primary-700));--item-selected-hover-background: var(--ig-button-group-item-selected-hover-background, var(--ig-primary-800));--item-selected-hover-text-color: var(--ig-button-group-item-selected-hover-text-color, var(--ig-primary-700-contrast));--item-selected-hover-icon-color: var(--ig-button-group-item-selected-hover-icon-color, var(--ig-primary-700-contrast));--item-selected-hover-border-color: var(--ig-button-group-item-selected-hover-border-color, var(--ig-primary-700));--item-selected-focus-background: var(--ig-button-group-item-selected-focus-background, hsl(from var(--ig-primary-900) h s l/0.9));--item-selected-focus-hover-background: var(--ig-button-group-item-selected-focus-hover-background, hsl(from var(--ig-primary-600) h s l/0.5));--disabled-text-color: var(--ig-button-group-disabled-text-color, var(--ig-primary-200));--item-disabled-border: var(--ig-button-group-item-disabled-border, var(--ig-primary-100));--disabled-selected-text-color: var(--ig-button-group-disabled-selected-text-color, var(--ig-primary-200));--disabled-selected-icon-color: var(--ig-button-group-disabled-selected-icon-color, var(--ig-primary-200));--disabled-selected-border-color: var(--ig-button-group-disabled-selected-border-color, var(--ig-primary-100));--ig-theme: bootstrap}`;
|
|
3
3
|
//# sourceMappingURL=button-group.bootstrap.css.js.map
|