igniteui-webcomponents 1.0.0 → 2.0.0

package/components/slider/slider.js

@@ -0,0 +1,80 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { html } from 'lit';
+import { property } from 'lit/decorators.js';
+import { EventEmitterMixin } from '../common/mixins/event-emitter';
+import { IgcSliderBaseComponent } from './slider-base';
+export default class IgcSliderComponent extends EventEmitterMixin(IgcSliderBaseComponent) {
+    constructor() {
+        super(...arguments);
+        this._value = 0;
+    }
+    set value(val) {
+        const oldVal = this._value;
+        this._value = this.validateValue(val);
+        this.requestUpdate('value', oldVal);
+    }
+    get value() {
+        return this._value;
+    }
+    set ariaLabel(value) {
+        const oldVal = this._ariaLabel;
+        this._ariaLabel = value;
+        if (this.hasAttribute('aria-label')) {
+            this.removeAttribute('aria-label');
+        }
+        this.requestUpdate('ariaLabel', oldVal);
+    }
+    get ariaLabel() {
+        return this._ariaLabel;
+    }
+    get activeValue() {
+        return this.value;
+    }
+    normalizeValue() {
+        this._value = this.validateValue(this._value);
+    }
+    getTrackStyle() {
+        const position = this.valueToFraction(this.value);
+        const filledTrackStyle = {
+            width: `${position * 100}%`,
+        };
+        return filledTrackStyle;
+    }
+    updateValue(increment) {
+        const oldValue = this.value;
+        this.value = this.value + increment;
+        if (oldValue === this.value) {
+            return false;
+        }
+        this.emitInputEvent();
+        return true;
+    }
+    emitInputEvent() {
+        this.emitEvent('igcInput', { detail: this.value });
+    }
+    emitChangeEvent() {
+        this.emitEvent('igcChange', { detail: this.value });
+    }
+    stepUp(stepIncrement = 1) {
+        this.value = this.value + stepIncrement * this.step;
+    }
+    stepDown(stepDecrement = 1) {
+        this.value = this.value - stepDecrement * this.step;
+    }
+    renderThumbs() {
+        return html `${this.renderThumb(this.value, this.ariaLabel)}`;
+    }
+}
+IgcSliderComponent.tagName = 'igc-slider';
+__decorate([
+    property({ type: Number })
+], IgcSliderComponent.prototype, "value", null);
+__decorate([
+    property({ attribute: 'aria-label' })
+], IgcSliderComponent.prototype, "ariaLabel", null);
+//# sourceMappingURL=slider.js.map

package/components/slider/slider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"slider.js","sourceRoot":"","sources":["../../../src/components/slider/slider.ts"],"names":[],"mappings":"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","sourcesContent":["import { html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { Constructor } from '../common/mixins/constructor';\nimport { EventEmitterMixin } from '../common/mixins/event-emitter';\nimport { IgcSliderBaseComponent } from './slider-base';\n\nexport interface IgcSliderEventMap {\n  /**\n   * Emitted when a value is changed via thumb drag or keyboard interaction.\n   */\n  igcInput: CustomEvent<number>;\n  /**\n   * Emitted when a value change is committed on a thumb drag end or keyboard interaction.\n   */\n  igcChange: CustomEvent<number>;\n}\n\n/**\n * A slider component used to select numeric value within a range.\n *\n * @element igc-slider\n *\n * @fires igcInput - Emitted when a value is changed via thumb drag or keyboard interaction.\n * @fires igcChange - Emitted when a value change is committed on a thumb drag end or keyboard interaction.\n *\n * @csspart base - The base wrapper of the slider.\n * @csspart ticks - The ticks container.\n * @csspart tick-group - The tick group container.\n * @csspart tick - The tick element.\n * @csspart tick-label - The tick label element.\n * @csspart tick-label-inner - The inner element of the tick label.\n * @csspart thumbs - The thumbs container.\n * @csspart thumb - The thumb element.\n * @csspart thumb-label - The thumb tooltip label container.\n * @csspart thumb-label-inner - The thumb tooltip label inner element.\n * @csspart track - The track container.\n * @csspart steps - The track steps element.\n * @csspart inactive - The inactive element of the track.\n * @csspart fill - The filled part of the track.\n */\nexport default class IgcSliderComponent extends EventEmitterMixin<\n  IgcSliderEventMap,\n  Constructor<IgcSliderBaseComponent>\n>(IgcSliderBaseComponent) {\n  public static readonly tagName = 'igc-slider';\n\n  private _value = 0;\n  private _ariaLabel!: string;\n\n  public set value(val: number) {\n    const oldVal = this._value;\n    this._value = this.validateValue(val);\n    this.requestUpdate('value', oldVal);\n  }\n\n  /**\n   * The current value of the slider.\n   */\n  @property({ type: Number })\n  public get value() {\n    return this._value;\n  }\n\n  public override set ariaLabel(value: string) {\n    const oldVal = this._ariaLabel;\n    this._ariaLabel = value;\n\n    if (this.hasAttribute('aria-label')) {\n      this.removeAttribute('aria-label');\n    }\n    this.requestUpdate('ariaLabel', oldVal);\n  }\n\n  /**\n   * The aria label of the slider thumb.\n   */\n  @property({ attribute: 'aria-label' })\n  public override get ariaLabel() {\n    return this._ariaLabel;\n  }\n\n  protected override get activeValue(): number {\n    return this.value;\n  }\n\n  protected override normalizeValue(): void {\n    this._value = this.validateValue(this._value);\n  }\n\n  protected override getTrackStyle() {\n    const position = this.valueToFraction(this.value);\n    const filledTrackStyle = {\n      width: `${position * 100}%`,\n    };\n\n    return filledTrackStyle;\n  }\n\n  protected override updateValue(increment: number) {\n    const oldValue = this.value;\n\n    this.value = (this.value as number) + increment;\n\n    if (oldValue === this.value) {\n      return false;\n    }\n\n    this.emitInputEvent();\n    return true;\n  }\n\n  protected override emitInputEvent() {\n    this.emitEvent('igcInput', { detail: this.value });\n  }\n\n  protected override emitChangeEvent() {\n    this.emitEvent('igcChange', { detail: this.value });\n  }\n\n  /**\n   * Increments the value of the slider by `stepIncrement * step`, where `stepIncrement` defaults to 1.\n   * @param stepIncrement Optional step increment. If no parameter is passed, it defaults to 1.\n   */\n  public stepUp(stepIncrement = 1) {\n    this.value = this.value + stepIncrement * this.step;\n  }\n\n  /**\n   * Decrements the value of the slider by `stepDecrement * step`, where `stepDecrement` defaults to 1.\n   * @param stepDecrement Optional step decrement. If no parameter is passed, it defaults to 1.\n   */\n  public stepDown(stepDecrement = 1) {\n    this.value = this.value - stepDecrement * this.step;\n  }\n\n  protected override renderThumbs() {\n    return html`${this.renderThumb(this.value, this.ariaLabel)}`;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-slider': IgcSliderComponent;\n  }\n}\n"]}

package/components/slider/slider.material.css.d.ts

@@ -0,0 +1 @@
+export declare const styles: import("lit").CSSResult;

package/components/slider/slider.material.css.js

@@ -0,0 +1,3 @@
+import { css } from 'lit';
+export const styles = css `:host{position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;scrollbar-width:var(--scrolbar-size);scrollbar-color:var(--igc-scrollbar-thumb-color) var(--igc-scrollbar-track-color)}:host *,:host *::before,:host *::after{-webkit-box-sizing:border-box;box-sizing:border-box}:host ::-webkit-scrollbar{width:var(--scrolbar-size);height:var(--scrolbar-size);background:var(--igc-scrollbar-track-color)}:host ::-webkit-scrollbar-thumb{background:var(--igc-scrollbar-thumb-color)}[hidden]{display:none !important}:host{display:block}slot{display:none}[part=base]{display:-webkit-box;display:-ms-flexbox;display:flex;position:relative;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:3rem;-webkit-transition:all .2s ease-out;-o-transition:all .2s ease-out;transition:all .2s ease-out;font-family:var(--igc-font-family)}[part=track]{position:relative;height:.375rem;width:100%;border-radius:2rem;overflow:hidden}[part=fill]{position:absolute;height:.375rem;background:hsla(var(--igc-secondary-500), var(--igc-secondary-a));border-radius:inherit}[part=inactive]{position:absolute;height:.25rem;width:100%;top:.0625rem;background:hsla(var(--igc-secondary-500), 0.24);-webkit-transition:background .2s ease-out;-o-transition:background .2s ease-out;transition:background .2s ease-out;border-radius:inherit}[part=steps]{position:absolute;width:100%;height:.125rem;color:#fff;opacity:.85;-webkit-transition:opacity .2s ease-out;-o-transition:opacity .2s ease-out;transition:opacity .2s ease-out;top:.125rem}[part=ticks]{width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;position:absolute;bottom:0;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}[part=ticks]:first-child{bottom:auto;top:0;-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end}[part=ticks]:first-child [part=tick-label]{top:auto;bottom:1.5rem}[part=tick-group]:first-of-type{-webkit-margin-start:-0.0625rem;margin-inline-start:-0.0625rem}[part=tick-group]:last-of-type{-webkit-margin-start:-0.0625rem;margin-inline-start:-0.0625rem}[part=tick]{background:hsla(var(--igc-gray-500), var(--igc-gray-a));height:.5rem;width:.125rem}[part=tick][data-primary=true]{height:1rem}[part=tick-label]{color:hsla(var(--igc-gray-500), var(--igc-gray-a));position:absolute;top:1.5rem;line-height:.7;opacity:1;-webkit-transition:opacity .2s ease-in-out;-o-transition:opacity .2s ease-in-out;transition:opacity .2s ease-in-out;font-family:var(--igc-caption-font-family);font-weight:var(--igc-caption-font-weight);font-size:var(--igc-caption-font-size);font-style:var(--igc-caption-font-style);letter-spacing:var(--igc-caption-letter-spacing);text-transform:var(--igc-caption-text-transform);line-height:var(--igc-caption-line-height);margin-top:var(--igc-caption-margin-top);margin-bottom:var(--igc-caption-margin-bottom)}[part=tick-label-inner]{-webkit-margin-start:-50%;margin-inline-start:-50%}[part=thumbs]{position:absolute;width:100%;height:0;cursor:default;inset-inline-start:0}[part=thumb]{position:absolute;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;outline-style:none;width:1.25rem;height:1.25rem;background:hsla(var(--igc-secondary-500), var(--igc-secondary-a));-webkit-transition:border-radius .1s ease-out,-webkit-transform .1s ease-out;transition:border-radius .1s ease-out,-webkit-transform .1s ease-out;-o-transition:transform .1s ease-out,border-radius .1s ease-out;transition:transform .1s ease-out,border-radius .1s ease-out;transition:transform .1s ease-out,border-radius .1s ease-out,-webkit-transform .1s ease-out;border-radius:calc(1.25rem / 2);top:calc((1.25rem - calc(1.25rem / 2))*-1);-webkit-margin-start:calc((1.25rem - calc(1.25rem / 2))*-1);margin-inline-start:calc((1.25rem - calc(1.25rem / 2))*-1)}[part=thumb]::after{position:absolute;content:"";width:2.5rem;height:2.5rem;background:hsla(var(--igc-secondary-500), var(--igc-secondary-a));top:calc(50% - calc(2.5rem / 2));inset-inline-start:calc(50% - calc(2.5rem / 2));opacity:0;-webkit-transform:scale(0);-ms-transform:scale(0);transform:scale(0);-webkit-transform-origin:center center;-ms-transform-origin:center center;transform-origin:center center;-webkit-transition:opacity .1s ease-out,-webkit-transform .1s ease-out;transition:opacity .1s ease-out,-webkit-transform .1s ease-out;-o-transition:transform .1s ease-out,opacity .1s ease-out;transition:transform .1s ease-out,opacity .1s ease-out;transition:transform .1s ease-out,opacity .1s ease-out,-webkit-transform .1s ease-out;overflow:hidden;border-radius:calc(2.5rem / 2)}[part=thumb]:hover::after{opacity:.12;-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}[part=thumb]:focus::after{opacity:.18;-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}[part=thumb]:active::after{opacity:.24}[part=thumb-label]{position:absolute;top:calc((1.875rem + 1.25rem)*-1);pointer-events:none;height:1.875rem;display:-webkit-box;display:-ms-flexbox;display:flex}[part=thumb-label-inner]{font-family:var(--igc-caption-font-family);font-weight:var(--igc-caption-font-weight);font-size:var(--igc-caption-font-size);font-style:var(--igc-caption-font-style);letter-spacing:var(--igc-caption-letter-spacing);text-transform:var(--igc-caption-text-transform);line-height:var(--igc-caption-line-height);margin-top:var(--igc-caption-margin-top);margin-bottom:var(--igc-caption-margin-bottom);display:-webkit-box;display:-ms-flexbox;display:flex;min-width:2.5rem;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;white-space:nowrap;-webkit-margin-start:-50%;margin-inline-start:-50%;padding:0 .125rem;border-radius:.125rem;color:var(--igc-gray-700-contrast);background:hsla(var(--igc-gray-700), var(--igc-gray-a))}[part=thumb-label-inner]::after{content:"";position:absolute;top:85%;border-left:.625rem solid transparent;border-right:.625rem solid transparent;border-top:.625rem solid hsla(var(--igc-gray-700), var(--igc-gray-a))}:host(:not([tick-label-rotation="0"])) [part=tick-label-inner]{-webkit-writing-mode:vertical-rl;-ms-writing-mode:tb-rl;writing-mode:vertical-rl;-webkit-margin-start:0;margin-inline-start:0;margin-block:-50%}:host([tick-label-rotation="-90"]) [part=tick-label-inner]{-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg)}:host([disabled]){-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;pointer-events:none;cursor:initial}:host([disabled]) [part=inactive]{background:hsla(var(--igc-gray-200), var(--igc-gray-a))}:host([disabled]) [part=fill],:host([disabled]) [part=tick]{background:hsla(var(--igc-gray-400), var(--igc-gray-a))}:host([disabled]) [part=tick-label]{color:hsla(var(--igc-gray-400), var(--igc-gray-a))}:host([disabled]) [part=thumb]{background:hsla(var(--igc-gray-400), var(--igc-gray-a))}:host([disabled]) [part=thumb]:focus::after{-webkit-transform:scale(0);-ms-transform:scale(0);transform:scale(0)}:host([disabled]):hover [part=inactive]{background:hsla(var(--igc-gray-400), var(--igc-gray-a))}:host([disabled]):hover [part=thumb]{border-color:hsla(var(--igc-gray-400), var(--igc-gray-a))}`;
+//# sourceMappingURL=slider.material.css.js.map

package/components/slider/slider.material.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"slider.material.css.js","sourceRoot":"","sources":["../../../src/components/slider/slider.material.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,8yOAA8yO,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;scrollbar-width:var(--scrolbar-size);scrollbar-color:var(--igc-scrollbar-thumb-color) var(--igc-scrollbar-track-color)}:host *,:host *::before,:host *::after{-webkit-box-sizing:border-box;box-sizing:border-box}:host ::-webkit-scrollbar{width:var(--scrolbar-size);height:var(--scrolbar-size);background:var(--igc-scrollbar-track-color)}:host ::-webkit-scrollbar-thumb{background:var(--igc-scrollbar-thumb-color)}[hidden]{display:none !important}:host{display:block}slot{display:none}[part=base]{display:-webkit-box;display:-ms-flexbox;display:flex;position:relative;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:3rem;-webkit-transition:all .2s ease-out;-o-transition:all .2s ease-out;transition:all .2s ease-out;font-family:var(--igc-font-family)}[part=track]{position:relative;height:.375rem;width:100%;border-radius:2rem;overflow:hidden}[part=fill]{position:absolute;height:.375rem;background:hsla(var(--igc-secondary-500), var(--igc-secondary-a));border-radius:inherit}[part=inactive]{position:absolute;height:.25rem;width:100%;top:.0625rem;background:hsla(var(--igc-secondary-500), 0.24);-webkit-transition:background .2s ease-out;-o-transition:background .2s ease-out;transition:background .2s ease-out;border-radius:inherit}[part=steps]{position:absolute;width:100%;height:.125rem;color:#fff;opacity:.85;-webkit-transition:opacity .2s ease-out;-o-transition:opacity .2s ease-out;transition:opacity .2s ease-out;top:.125rem}[part=ticks]{width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;position:absolute;bottom:0;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}[part=ticks]:first-child{bottom:auto;top:0;-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end}[part=ticks]:first-child [part=tick-label]{top:auto;bottom:1.5rem}[part=tick-group]:first-of-type{-webkit-margin-start:-0.0625rem;margin-inline-start:-0.0625rem}[part=tick-group]:last-of-type{-webkit-margin-start:-0.0625rem;margin-inline-start:-0.0625rem}[part=tick]{background:hsla(var(--igc-gray-500), var(--igc-gray-a));height:.5rem;width:.125rem}[part=tick][data-primary=true]{height:1rem}[part=tick-label]{color:hsla(var(--igc-gray-500), var(--igc-gray-a));position:absolute;top:1.5rem;line-height:.7;opacity:1;-webkit-transition:opacity .2s ease-in-out;-o-transition:opacity .2s ease-in-out;transition:opacity .2s ease-in-out;font-family:var(--igc-caption-font-family);font-weight:var(--igc-caption-font-weight);font-size:var(--igc-caption-font-size);font-style:var(--igc-caption-font-style);letter-spacing:var(--igc-caption-letter-spacing);text-transform:var(--igc-caption-text-transform);line-height:var(--igc-caption-line-height);margin-top:var(--igc-caption-margin-top);margin-bottom:var(--igc-caption-margin-bottom)}[part=tick-label-inner]{-webkit-margin-start:-50%;margin-inline-start:-50%}[part=thumbs]{position:absolute;width:100%;height:0;cursor:default;inset-inline-start:0}[part=thumb]{position:absolute;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;outline-style:none;width:1.25rem;height:1.25rem;background:hsla(var(--igc-secondary-500), var(--igc-secondary-a));-webkit-transition:border-radius .1s ease-out,-webkit-transform .1s ease-out;transition:border-radius .1s ease-out,-webkit-transform .1s ease-out;-o-transition:transform .1s ease-out,border-radius .1s ease-out;transition:transform .1s ease-out,border-radius .1s ease-out;transition:transform .1s ease-out,border-radius .1s ease-out,-webkit-transform .1s ease-out;border-radius:calc(1.25rem / 2);top:calc((1.25rem - calc(1.25rem / 2))*-1);-webkit-margin-start:calc((1.25rem - calc(1.25rem / 2))*-1);margin-inline-start:calc((1.25rem - calc(1.25rem / 2))*-1)}[part=thumb]::after{position:absolute;content:\"\";width:2.5rem;height:2.5rem;background:hsla(var(--igc-secondary-500), var(--igc-secondary-a));top:calc(50% - calc(2.5rem / 2));inset-inline-start:calc(50% - calc(2.5rem / 2));opacity:0;-webkit-transform:scale(0);-ms-transform:scale(0);transform:scale(0);-webkit-transform-origin:center center;-ms-transform-origin:center center;transform-origin:center center;-webkit-transition:opacity .1s ease-out,-webkit-transform .1s ease-out;transition:opacity .1s ease-out,-webkit-transform .1s ease-out;-o-transition:transform .1s ease-out,opacity .1s ease-out;transition:transform .1s ease-out,opacity .1s ease-out;transition:transform .1s ease-out,opacity .1s ease-out,-webkit-transform .1s ease-out;overflow:hidden;border-radius:calc(2.5rem / 2)}[part=thumb]:hover::after{opacity:.12;-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}[part=thumb]:focus::after{opacity:.18;-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}[part=thumb]:active::after{opacity:.24}[part=thumb-label]{position:absolute;top:calc((1.875rem + 1.25rem)*-1);pointer-events:none;height:1.875rem;display:-webkit-box;display:-ms-flexbox;display:flex}[part=thumb-label-inner]{font-family:var(--igc-caption-font-family);font-weight:var(--igc-caption-font-weight);font-size:var(--igc-caption-font-size);font-style:var(--igc-caption-font-style);letter-spacing:var(--igc-caption-letter-spacing);text-transform:var(--igc-caption-text-transform);line-height:var(--igc-caption-line-height);margin-top:var(--igc-caption-margin-top);margin-bottom:var(--igc-caption-margin-bottom);display:-webkit-box;display:-ms-flexbox;display:flex;min-width:2.5rem;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;white-space:nowrap;-webkit-margin-start:-50%;margin-inline-start:-50%;padding:0 .125rem;border-radius:.125rem;color:var(--igc-gray-700-contrast);background:hsla(var(--igc-gray-700), var(--igc-gray-a))}[part=thumb-label-inner]::after{content:\"\";position:absolute;top:85%;border-left:.625rem solid transparent;border-right:.625rem solid transparent;border-top:.625rem solid hsla(var(--igc-gray-700), var(--igc-gray-a))}:host(:not([tick-label-rotation=\"0\"])) [part=tick-label-inner]{-webkit-writing-mode:vertical-rl;-ms-writing-mode:tb-rl;writing-mode:vertical-rl;-webkit-margin-start:0;margin-inline-start:0;margin-block:-50%}:host([tick-label-rotation=\"-90\"]) [part=tick-label-inner]{-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg)}:host([disabled]){-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;pointer-events:none;cursor:initial}:host([disabled]) [part=inactive]{background:hsla(var(--igc-gray-200), var(--igc-gray-a))}:host([disabled]) [part=fill],:host([disabled]) [part=tick]{background:hsla(var(--igc-gray-400), var(--igc-gray-a))}:host([disabled]) [part=tick-label]{color:hsla(var(--igc-gray-400), var(--igc-gray-a))}:host([disabled]) [part=thumb]{background:hsla(var(--igc-gray-400), var(--igc-gray-a))}:host([disabled]) [part=thumb]:focus::after{-webkit-transform:scale(0);-ms-transform:scale(0);transform:scale(0)}:host([disabled]):hover [part=inactive]{background:hsla(var(--igc-gray-400), var(--igc-gray-a))}:host([disabled]):hover [part=thumb]{border-color:hsla(var(--igc-gray-400), var(--igc-gray-a))}`;\n"]}