import * as i0 from '@angular/core';
import { viewChild, signal, input, model, numberAttribute, booleanAttribute, computed, inject, NgZone, ChangeDetectorRef, HostListener, ChangeDetectionStrategy, Component, NgModule } from '@angular/core';
import { NG_VALUE_ACCESSOR } from '@angular/forms';
import { elementPlus, elementMinus } from '@siemens/element-icons';
import { correctKeyRTL, listenGlobal, isRTL } from '@siemens/element-ng/common';
import { SI_FORM_ITEM_CONTROL } from '@siemens/element-ng/form';
import { addIcons, SiIconComponent } from '@siemens/element-ng/icon';
import { t, SiTranslatePipe } from '@siemens/element-translate-ng/translate';
import { timer } from 'rxjs';

/**
 * Copyright (c) Siemens 2016 - 2026
 * SPDX-License-Identifier: MIT
 */
class SiSliderComponent {
    static idCounter = 0;
    handleRef = viewChild.required('handle');
    disabledNgControl = signal(false, ...(ngDevMode ? [{ debugName: "disabledNgControl" }] : []));
    /**
     * @defaultValue
     * ```
     * `__si-slider-${SiSliderComponent.idCounter++}`
     * ```
     */
    id = input(`__si-slider-${SiSliderComponent.idCounter++}`, ...(ngDevMode ? [{ debugName: "id" }] : []));
    /**
     * Current value of slider.
     */
    value = model(...(ngDevMode ? [undefined, { debugName: "value" }] : []));
    /**
     * Minimum of slider range.
     *
     * @defaultValue 0
     */
    min = input(0, { ...(ngDevMode ? { debugName: "min" } : {}), transform: numberAttribute });
    /**
     * Maximum of slider range.
     *
     * @defaultValue 100
     */
    max = input(100, { ...(ngDevMode ? { debugName: "max" } : {}), transform: numberAttribute });
    /**
     * Label to describe minimum of slider range.
     *
     * @defaultValue ''
     */
    minLabel = input('', ...(ngDevMode ? [{ debugName: "minLabel" }] : []));
    /**
     * Label to describe maximum of slider range.
     *
     * @defaultValue ''
     */
    maxLabel = input('', ...(ngDevMode ? [{ debugName: "maxLabel" }] : []));
    /**
     * Interval to step through the slider.
     *
     * @defaultValue 1
     */
    step = input(1, { ...(ngDevMode ? { debugName: "step" } : {}), transform: numberAttribute });
    /**
     * Icon to use as the slider thumb.
     */
    thumbIcon = input(...(ngDevMode ? [undefined, { debugName: "thumbIcon" }] : []));
    /**
     * Text for aria-label of increment. Needed for a11y.
     *
     * @defaultValue
     * ```
     * t(() => $localize`:@@SI_SLIDER.INCREMENT:Increment`)
     * ```
     */
    incrementLabel = input(t(() => $localize `:@@SI_SLIDER.INCREMENT:Increment`), ...(ngDevMode ? [{ debugName: "incrementLabel" }] : []));
    /**
     * Text for aria-label of decrement. Needed for a11y.
     *
     * @defaultValue
     * ```
     * t(() => $localize`:@@SI_SLIDER.DECREMENT:Decrement`)
     * ```
     */
    decrementLabel = input(t(() => $localize `:@@SI_SLIDER.DECREMENT:Decrement`), ...(ngDevMode ? [{ debugName: "decrementLabel" }] : []));
    /**
     * Text for aria-label of slider. Needed for a11y
     *
     * @defaultValue
     * ```
     * t(() => $localize`:@@SI_SLIDER.LABEL:Value`)
     * ```
     */
    sliderLabel = input(t(() => $localize `:@@SI_SLIDER.LABEL:Value`), ...(ngDevMode ? [{ debugName: "sliderLabel" }] : []));
    /**
     * @defaultValue
     * ```
     * `${this.id()}-label`
     * ```
     */
    labelledby = input(`${this.id()}-label`, ...(ngDevMode ? [{ debugName: "labelledby" }] : []));
    /** @defaultValue false */
    // eslint-disable-next-line @angular-eslint/no-input-rename
    disabledInput = input(false, { ...(ngDevMode ? { debugName: "disabledInput" } : {}), alias: 'disabled', transform: booleanAttribute });
    disabled = computed(() => this.disabledInput() || this.disabledNgControl() || this.min() === this.max(), ...(ngDevMode ? [{ debugName: "disabled" }] : []));
    sliderValue = computed(() => {
        const value = this.value();
        if (typeof value !== 'number') {
            return this.roundToStepPrecision((this.min() + this.max()) / 2);
        }
        return value;
    }, ...(ngDevMode ? [{ debugName: "sliderValue" }] : []));
    /**
     * This ID will be bound to the `aria-describedby` attribute of the slider.
     * Use this to reference the element containing the error message(s) for the slider.
     * It will be picked by the {@link SiFormItemComponent} if the slider is used inside a form item.
     *
     * @defaultValue
     * ```
     * `${this.id()}-errormessage`
     * ```
     */
    errormessageId = input(`${this.id()}-errormessage`, ...(ngDevMode ? [{ debugName: "errormessageId" }] : []));
    indicatorPos = computed(() => {
        const range = this.max() - this.min();
        if (range === 0) {
            return 50;
        }
        const indicatorPos = ((this.sliderValue() - this.min()) * 100) / range;
        return Math.max(Math.min(indicatorPos, 100), 0);
    }, ...(ngDevMode ? [{ debugName: "indicatorPos" }] : []));
    icons = addIcons({ elementMinus, elementPlus });
    isDragging = false;
    autoUpdate$ = timer(400, 80); // 250
    autoUpdateSubs;
    rtl = false;
    unlistenDragEvents = [];
    onTouchedCallback = () => { };
    onChangeCallback = () => { };
    zone = inject(NgZone);
    changeDetectorRef = inject(ChangeDetectorRef);
    incrementValue() {
        this.value.set(this.normalizeValue(this.sliderValue() + this.step()));
        this.valueChanged();
    }
    decrementValue() {
        this.value.set(this.normalizeValue(this.sliderValue() - this.step()));
        this.valueChanged();
    }
    roundToStepPrecision(value) {
        const factor = 1 / this.step();
        if (factor > 1) {
            return Math.round(value * factor) / factor;
        }
        return Math.round(value / this.step()) * this.step();
    }
    normalizeValue(value) {
        return Math.min(Math.max(this.roundToStepPrecision(value), this.min()), this.max());
    }
    handleTouchMove(event) {
        if (event.cancelable) {
            event.preventDefault();
            event.stopPropagation();
        }
        this.handleDragMove(event.touches[0]);
    }
    handleMouseMove(event) {
        event.preventDefault();
        event.stopPropagation();
        this.handleDragMove(event);
    }
    handleDragMove(event) {
        const pointerPosX = event.clientX;
        const handleRect = this.handleRef().nativeElement.getBoundingClientRect();
        const handleWrapperWidth = this.handleRef().nativeElement.parentElement.clientWidth;
        const direction = this.rtl ? -1 : 1;
        const pointerPosDelta = Math.round(pointerPosX - (handleRect.x + handleRect.width / 2)) * direction;
        const valueDelta = (pointerPosDelta / handleWrapperWidth) * (this.max() - this.min());
        const newValue = this.normalizeValue(this.sliderValue() + valueDelta);
        if ((pointerPosDelta > 0 && newValue > this.sliderValue()) ||
            (pointerPosDelta < 0 && newValue < this.sliderValue())) {
            // the zone is required to work around a problem on native device where CD doesn't trigger
            this.zone.run(() => {
                this.changeDetectorRef.markForCheck();
                this.value.set(newValue);
                this.valueChanged();
            });
        }
        window.getSelection()?.removeAllRanges();
    }
    handleDragEnd() {
        this.isDragging = false;
        this.unlistenDragEvents.forEach(handler => handler());
        this.unlistenDragEvents.length = 0;
    }
    valueChanged() {
        this.onTouchedCallback();
        this.onChangeCallback(this.sliderValue());
    }
    handlePointerDown(event) {
        event.stopPropagation();
    }
    autoUpdateKeydown(event) {
        const rtlCorrectedKey = correctKeyRTL(event.key);
        if (rtlCorrectedKey === 'ArrowLeft') {
            this.autoUpdateStart(event, false);
        }
        else if (rtlCorrectedKey === 'ArrowRight') {
            this.autoUpdateStart(event, true);
        }
    }
    autoUpdateStart(event, isIncrement) {
        event.preventDefault();
        const trigger = isIncrement ? () => this.incrementValue() : () => this.decrementValue();
        this.autoUpdateSubs?.unsubscribe();
        this.autoUpdateSubs = this.autoUpdate$.subscribe(trigger);
        trigger();
    }
    autoUpdateStop() {
        if (this.autoUpdateSubs) {
            this.autoUpdateSubs.unsubscribe();
            this.autoUpdateSubs = undefined;
        }
    }
    handleMouseDown(event) {
        this.unlistenDragEvents.push(listenGlobal('mousemove', moveEvent => this.handleMouseMove(moveEvent)));
        this.unlistenDragEvents.push(listenGlobal('mouseup', () => this.handleDragEnd()));
        this.isDragging = true;
        this.rtl = isRTL();
        this.handleMouseMove(event);
    }
    handleTouchStart(event) {
        if (event.touches.length !== 1) {
            return;
        }
        this.unlistenDragEvents.push(listenGlobal('touchmove', e => this.handleTouchMove(e), true));
        this.unlistenDragEvents.push(listenGlobal('touchend', () => this.handleDragEnd()));
        this.isDragging = true;
        this.rtl = isRTL();
        this.handleTouchMove(event);
    }
    /** @internal */
    writeValue(val) {
        this.value.set(val);
    }
    /** @internal */
    registerOnChange(fn) {
        this.onChangeCallback = fn;
    }
    /** @internal */
    registerOnTouched(fn) {
        this.onTouchedCallback = fn;
    }
    /** @internal */
    setDisabledState(isDisabled) {
        this.disabledNgControl.set(isDisabled);
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiSliderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: SiSliderComponent, isStandalone: true, selector: "si-slider", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, minLabel: { classPropertyName: "minLabel", publicName: "minLabel", isSignal: true, isRequired: false, transformFunction: null }, maxLabel: { classPropertyName: "maxLabel", publicName: "maxLabel", isSignal: true, isRequired: false, transformFunction: null }, step: { classPropertyName: "step", publicName: "step", isSignal: true, isRequired: false, transformFunction: null }, thumbIcon: { classPropertyName: "thumbIcon", publicName: "thumbIcon", isSignal: true, isRequired: false, transformFunction: null }, incrementLabel: { classPropertyName: "incrementLabel", publicName: "incrementLabel", isSignal: true, isRequired: false, transformFunction: null }, decrementLabel: { classPropertyName: "decrementLabel", publicName: "decrementLabel", isSignal: true, isRequired: false, transformFunction: null }, sliderLabel: { classPropertyName: "sliderLabel", publicName: "sliderLabel", isSignal: true, isRequired: false, transformFunction: null }, labelledby: { classPropertyName: "labelledby", publicName: "labelledby", isSignal: true, isRequired: false, transformFunction: null }, disabledInput: { classPropertyName: "disabledInput", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, errormessageId: { classPropertyName: "errormessageId", publicName: "errormessageId", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, host: { attributes: { "role": "group" }, listeners: { "pointerdown": "handlePointerDown($event)", "mousedown": "handlePointerDown($event)", "touchstart": "handlePointerDown($event)" }, properties: { "class.disabled": "disabled()", "attr.aria-labelledby": "labelledby()" } }, providers: [
            {
                provide: NG_VALUE_ACCESSOR,
                useExisting: SiSliderComponent,
                multi: true
            },
            {
                provide: SI_FORM_ITEM_CONTROL,
                useExisting: SiSliderComponent
            }
        ], viewQueries: [{ propertyName: "handleRef", first: true, predicate: ["handle"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"slider-container\">\n  <button\n    type=\"button\"\n    class=\"btn btn-circle btn-secondary decrement-button\"\n    [disabled]=\"disabled()\"\n    [attr.aria-label]=\"decrementLabel() | translate\"\n    [attr.aria-describedby]=\"errormessageId()\"\n    (mousedown)=\"autoUpdateStart($event, false)\"\n    (touchstart)=\"autoUpdateStart($event, false)\"\n    (keydown.enter)=\"autoUpdateStart($event, false)\"\n    (touchend)=\"autoUpdateStop()\"\n    (mouseup)=\"autoUpdateStop()\"\n    (keyup.enter)=\"autoUpdateStop()\"\n    (mouseleave)=\"autoUpdateStop()\"\n  >\n    <si-icon [icon]=\"icons.elementMinus\" />\n  </button>\n\n  <div class=\"slider-wrapper\">\n    <div class=\"value-indicator-wrapper\">\n      <span class=\"value-indicator\" [style.inset-inline-start.%]=\"indicatorPos()\">\n        <span>\n          <ng-content />\n        </span>\n      </span>\n    </div>\n\n    <div class=\"slider\" [class.dragging]=\"isDragging\">\n      <div class=\"track\"></div>\n      <div\n        class=\"thumb-handle-wrapper\"\n        [class.dragging]=\"isDragging\"\n        (mousedown)=\"handleMouseDown($event)\"\n        (touchstart)=\"handleTouchStart($event)\"\n      >\n        <div #handle class=\"thumb-handle\" [style.inset-inline-start.%]=\"indicatorPos()\">\n          <div\n            class=\"thumb\"\n            tabindex=\"0\"\n            role=\"slider\"\n            [attr.aria-label]=\"sliderLabel() | translate\"\n            [attr.aria-valuenow]=\"sliderValue()\"\n            [attr.aria-describedby]=\"errormessageId()\"\n            [class.dragging]=\"isDragging\"\n            (keydown)=\"autoUpdateKeydown($event)\"\n            (keyup)=\"autoUpdateStop()\"\n          >\n            @let iconValue = thumbIcon();\n            @if (iconValue) {\n              <si-icon [icon]=\"iconValue\" />\n            } @else {\n              <div class=\"hover-circle\"></div>\n            }\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n\n  <button\n    type=\"button\"\n    class=\"btn btn-circle btn-secondary increment-button\"\n    [disabled]=\"disabled()\"\n    [attr.aria-label]=\"incrementLabel() | translate\"\n    [attr.aria-describedby]=\"errormessageId()\"\n    (mousedown)=\"autoUpdateStart($event, true)\"\n    (touchstart)=\"autoUpdateStart($event, true)\"\n    (keydown.enter)=\"autoUpdateStart($event, true)\"\n    (touchend)=\"autoUpdateStop()\"\n    (mouseup)=\"autoUpdateStop()\"\n    (keyup.enter)=\"autoUpdateStop()\"\n    (mouseleave)=\"autoUpdateStop()\"\n  >\n    <si-icon [icon]=\"icons.elementPlus\" />\n  </button>\n</div>\n\n@if (minLabel() && maxLabel()) {\n  <div class=\"range-indicator-wrapper\">\n    <div class=\"range-indicator\">\n      <span>{{ minLabel() }}</span>\n      <span class=\"ms-auto\">{{ maxLabel() }}</span>\n    </div>\n  </div>\n}\n", styles: [":host{display:flex;flex-direction:column}.slider-container{display:flex;align-items:flex-end}.decrement-button{margin-inline-end:4px}.increment-button{margin-inline-start:4px}.slider-wrapper{position:relative;flex:1 1 0;min-inline-size:0;display:flex;flex-direction:column}.value-indicator-wrapper{position:relative;margin-inline:12px;text-align:start}.value-indicator{position:relative;display:inline-block;white-space:nowrap;color:var(--element-text-secondary)}.value-indicator>span{display:inline-block;margin-inline-start:-50%}.range-indicator-wrapper{margin-block:0;margin-inline:36px}.range-indicator-wrapper .range-indicator{display:inline-flex;white-space:nowrap;inline-size:100%;color:var(--element-text-secondary)}.range-indicator-wrapper .range-indicator>span{display:inline-block}.slider{position:relative;inline-size:100%;block-size:32px;cursor:pointer}.slider.dragging{cursor:grabbing}:host.disabled .slider{cursor:default}.slider .track{position:absolute;inset-block-start:50%;border-radius:var(--element-radius-1);margin-block-start:-2px;block-size:4px;inline-size:100%;background:var(--element-ui-4);pointer-events:none}.slider .thumb-handle-wrapper{position:absolute;inset-block:0;inset-inline:12px}:host.disabled .slider .thumb-handle-wrapper{pointer-events:none}.slider .thumb-handle{display:flex;align-items:center;justify-content:center;position:absolute;inset-block-start:50%;margin-block-start:-20px;margin-inline:-20px;inline-size:40px;block-size:40px}:host.disabled .slider .thumb-handle{pointer-events:none}.slider .thumb{--thumb-state-color: var(--element-ui-0);display:flex;align-items:center;justify-content:center;block-size:24px;min-block-size:24px;inline-size:24px;min-inline-size:24px;border-radius:50%;border:1px solid var(--thumb-state-color);box-shadow:0 0 8px var(--element-box-shadow-color-1),0 8px 8px var(--element-box-shadow-color-2);background:var(--element-base-1)}.slider .thumb:hover:not(.dragging){--thumb-state-color: var(--element-ui-0-hover);background:var(--element-action-secondary-hover)}:host.disabled .slider .thumb{--thumb-state-color: var(--element-ui-3)}.slider .thumb si-icon{font-size:1.25rem;color:var(--thumb-state-color)}.slider .thumb:hover .hover-circle,.slider .thumb:focus .hover-circle,.slider .thumb.dragging .hover-circle{display:block}.slider .hover-circle{display:none;block-size:12px;inline-size:12px;border-radius:50%;background:var(--thumb-state-color)}\n"], dependencies: [{ kind: "component", type: SiIconComponent, selector: "si-icon", inputs: ["icon"] }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiSliderComponent, decorators: [{
            type: Component,
            args: [{ selector: 'si-slider', imports: [SiIconComponent, SiTranslatePipe], providers: [
                        {
                            provide: NG_VALUE_ACCESSOR,
                            useExisting: SiSliderComponent,
                            multi: true
                        },
                        {
                            provide: SI_FORM_ITEM_CONTROL,
                            useExisting: SiSliderComponent
                        }
                    ], changeDetection: ChangeDetectionStrategy.OnPush, host: {
                        role: 'group',
                        '[class.disabled]': 'disabled()',
                        '[attr.aria-labelledby]': 'labelledby()'
                    }, template: "<div class=\"slider-container\">\n  <button\n    type=\"button\"\n    class=\"btn btn-circle btn-secondary decrement-button\"\n    [disabled]=\"disabled()\"\n    [attr.aria-label]=\"decrementLabel() | translate\"\n    [attr.aria-describedby]=\"errormessageId()\"\n    (mousedown)=\"autoUpdateStart($event, false)\"\n    (touchstart)=\"autoUpdateStart($event, false)\"\n    (keydown.enter)=\"autoUpdateStart($event, false)\"\n    (touchend)=\"autoUpdateStop()\"\n    (mouseup)=\"autoUpdateStop()\"\n    (keyup.enter)=\"autoUpdateStop()\"\n    (mouseleave)=\"autoUpdateStop()\"\n  >\n    <si-icon [icon]=\"icons.elementMinus\" />\n  </button>\n\n  <div class=\"slider-wrapper\">\n    <div class=\"value-indicator-wrapper\">\n      <span class=\"value-indicator\" [style.inset-inline-start.%]=\"indicatorPos()\">\n        <span>\n          <ng-content />\n        </span>\n      </span>\n    </div>\n\n    <div class=\"slider\" [class.dragging]=\"isDragging\">\n      <div class=\"track\"></div>\n      <div\n        class=\"thumb-handle-wrapper\"\n        [class.dragging]=\"isDragging\"\n        (mousedown)=\"handleMouseDown($event)\"\n        (touchstart)=\"handleTouchStart($event)\"\n      >\n        <div #handle class=\"thumb-handle\" [style.inset-inline-start.%]=\"indicatorPos()\">\n          <div\n            class=\"thumb\"\n            tabindex=\"0\"\n            role=\"slider\"\n            [attr.aria-label]=\"sliderLabel() | translate\"\n            [attr.aria-valuenow]=\"sliderValue()\"\n            [attr.aria-describedby]=\"errormessageId()\"\n            [class.dragging]=\"isDragging\"\n            (keydown)=\"autoUpdateKeydown($event)\"\n            (keyup)=\"autoUpdateStop()\"\n          >\n            @let iconValue = thumbIcon();\n            @if (iconValue) {\n              <si-icon [icon]=\"iconValue\" />\n            } @else {\n              <div class=\"hover-circle\"></div>\n            }\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n\n  <button\n    type=\"button\"\n    class=\"btn btn-circle btn-secondary increment-button\"\n    [disabled]=\"disabled()\"\n    [attr.aria-label]=\"incrementLabel() | translate\"\n    [attr.aria-describedby]=\"errormessageId()\"\n    (mousedown)=\"autoUpdateStart($event, true)\"\n    (touchstart)=\"autoUpdateStart($event, true)\"\n    (keydown.enter)=\"autoUpdateStart($event, true)\"\n    (touchend)=\"autoUpdateStop()\"\n    (mouseup)=\"autoUpdateStop()\"\n    (keyup.enter)=\"autoUpdateStop()\"\n    (mouseleave)=\"autoUpdateStop()\"\n  >\n    <si-icon [icon]=\"icons.elementPlus\" />\n  </button>\n</div>\n\n@if (minLabel() && maxLabel()) {\n  <div class=\"range-indicator-wrapper\">\n    <div class=\"range-indicator\">\n      <span>{{ minLabel() }}</span>\n      <span class=\"ms-auto\">{{ maxLabel() }}</span>\n    </div>\n  </div>\n}\n", styles: [":host{display:flex;flex-direction:column}.slider-container{display:flex;align-items:flex-end}.decrement-button{margin-inline-end:4px}.increment-button{margin-inline-start:4px}.slider-wrapper{position:relative;flex:1 1 0;min-inline-size:0;display:flex;flex-direction:column}.value-indicator-wrapper{position:relative;margin-inline:12px;text-align:start}.value-indicator{position:relative;display:inline-block;white-space:nowrap;color:var(--element-text-secondary)}.value-indicator>span{display:inline-block;margin-inline-start:-50%}.range-indicator-wrapper{margin-block:0;margin-inline:36px}.range-indicator-wrapper .range-indicator{display:inline-flex;white-space:nowrap;inline-size:100%;color:var(--element-text-secondary)}.range-indicator-wrapper .range-indicator>span{display:inline-block}.slider{position:relative;inline-size:100%;block-size:32px;cursor:pointer}.slider.dragging{cursor:grabbing}:host.disabled .slider{cursor:default}.slider .track{position:absolute;inset-block-start:50%;border-radius:var(--element-radius-1);margin-block-start:-2px;block-size:4px;inline-size:100%;background:var(--element-ui-4);pointer-events:none}.slider .thumb-handle-wrapper{position:absolute;inset-block:0;inset-inline:12px}:host.disabled .slider .thumb-handle-wrapper{pointer-events:none}.slider .thumb-handle{display:flex;align-items:center;justify-content:center;position:absolute;inset-block-start:50%;margin-block-start:-20px;margin-inline:-20px;inline-size:40px;block-size:40px}:host.disabled .slider .thumb-handle{pointer-events:none}.slider .thumb{--thumb-state-color: var(--element-ui-0);display:flex;align-items:center;justify-content:center;block-size:24px;min-block-size:24px;inline-size:24px;min-inline-size:24px;border-radius:50%;border:1px solid var(--thumb-state-color);box-shadow:0 0 8px var(--element-box-shadow-color-1),0 8px 8px var(--element-box-shadow-color-2);background:var(--element-base-1)}.slider .thumb:hover:not(.dragging){--thumb-state-color: var(--element-ui-0-hover);background:var(--element-action-secondary-hover)}:host.disabled .slider .thumb{--thumb-state-color: var(--element-ui-3)}.slider .thumb si-icon{font-size:1.25rem;color:var(--thumb-state-color)}.slider .thumb:hover .hover-circle,.slider .thumb:focus .hover-circle,.slider .thumb.dragging .hover-circle{display:block}.slider .hover-circle{display:none;block-size:12px;inline-size:12px;border-radius:50%;background:var(--thumb-state-color)}\n"] }]
        }], propDecorators: { handleRef: [{ type: i0.ViewChild, args: ['handle', { isSignal: true }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], min: [{ type: i0.Input, args: [{ isSignal: true, alias: "min", required: false }] }], max: [{ type: i0.Input, args: [{ isSignal: true, alias: "max", required: false }] }], minLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "minLabel", required: false }] }], maxLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxLabel", required: false }] }], step: [{ type: i0.Input, args: [{ isSignal: true, alias: "step", required: false }] }], thumbIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "thumbIcon", required: false }] }], incrementLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "incrementLabel", required: false }] }], decrementLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "decrementLabel", required: false }] }], sliderLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "sliderLabel", required: false }] }], labelledby: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelledby", required: false }] }], disabledInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], errormessageId: [{ type: i0.Input, args: [{ isSignal: true, alias: "errormessageId", required: false }] }], handlePointerDown: [{
                type: HostListener,
                args: ['pointerdown', ['$event']]
            }, {
                type: HostListener,
                args: ['mousedown', ['$event']]
            }, {
                type: HostListener,
                args: ['touchstart', ['$event']]
            }] } });

/**
 * Copyright (c) Siemens 2016 - 2026
 * SPDX-License-Identifier: MIT
 */
class SiSliderModule {
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiSliderModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.0.8", ngImport: i0, type: SiSliderModule, imports: [SiSliderComponent], exports: [SiSliderComponent] });
    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiSliderModule, imports: [SiSliderComponent] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiSliderModule, decorators: [{
            type: NgModule,
            args: [{
                    imports: [SiSliderComponent],
                    exports: [SiSliderComponent]
                }]
        }] });

/**
 * Copyright (c) Siemens 2016 - 2026
 * SPDX-License-Identifier: MIT
 */

/**
 * Generated bundle index. Do not edit.
 */

export { SiSliderComponent, SiSliderModule };
//# sourceMappingURL=siemens-element-ng-slider.mjs.map
