npm - @siemens/element-ng - Versions diffs - 49.16.0 → 51.0.0-rc.10 - Mend

@siemens/element-ng 49.16.0 → 51.0.0-rc.10

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.

Files changed (314) hide show

package/fesm2022/siemens-element-ng-slider.mjs CHANGED Viewed

@@ -1,5 +1,5 @@
 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 { viewChild, signal, input, model, numberAttribute, booleanAttribute, computed, inject, NgZone, ChangeDetectorRef, HostListener, 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';
@@ -14,53 +14,60 @@ import { timer } from 'rxjs';
  */
 class SiSliderComponent {
     static idCounter = 0;
-    handleRef = viewChild.required('handle');
-    disabledNgControl = signal(false, ...(ngDevMode ? [{ debugName: "disabledNgControl" }] : []));
+    handleRef = viewChild.required('handle', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "handleRef" }] : /* istanbul ignore next */ []));
+    disabledNgControl = signal(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "disabledNgControl" }] : /* istanbul ignore next */ []));
     /**
      * @defaultValue
      * ```
      * `__si-slider-${SiSliderComponent.idCounter++}`
      * ```
      */
-    id = input(`__si-slider-${SiSliderComponent.idCounter++}`, ...(ngDevMode ? [{ debugName: "id" }] : []));
+    id = input(`__si-slider-${SiSliderComponent.idCounter++}`, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "id" }] : /* istanbul ignore next */ []));
     /**
      * Current value of slider.
      */
-    value = model(...(ngDevMode ? [undefined, { debugName: "value" }] : []));
+    value = model(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "value" }] : /* istanbul ignore next */ []));
     /**
      * Minimum of slider range.
      *
      * @defaultValue 0
      */
-    min = input(0, { ...(ngDevMode ? { debugName: "min" } : {}), transform: numberAttribute });
+    min = input(0, { ...(ngDevMode ? { debugName: "min" } : /* istanbul ignore next */ {}), transform: numberAttribute });
     /**
      * Maximum of slider range.
      *
      * @defaultValue 100
      */
-    max = input(100, { ...(ngDevMode ? { debugName: "max" } : {}), transform: numberAttribute });
+    max = input(100, { ...(ngDevMode ? { debugName: "max" } : /* istanbul ignore next */ {}), transform: numberAttribute });
     /**
      * Label to describe minimum of slider range.
      *
      * @defaultValue ''
      */
-    minLabel = input('', ...(ngDevMode ? [{ debugName: "minLabel" }] : []));
+    minLabel = input('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "minLabel" }] : /* istanbul ignore next */ []));
     /**
      * Label to describe maximum of slider range.
      *
      * @defaultValue ''
      */
-    maxLabel = input('', ...(ngDevMode ? [{ debugName: "maxLabel" }] : []));
+    maxLabel = input('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "maxLabel" }] : /* istanbul ignore next */ []));
     /**
      * Interval to step through the slider.
      *
      * @defaultValue 1
      */
-    step = input(1, { ...(ngDevMode ? { debugName: "step" } : {}), transform: numberAttribute });
+    step = input(1, { ...(ngDevMode ? { debugName: "step" } : /* istanbul ignore next */ {}), transform: numberAttribute });
     /**
      * Icon to use as the slider thumb.
      */
-    thumbIcon = input(...(ngDevMode ? [undefined, { debugName: "thumbIcon" }] : []));
+    thumbIcon = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "thumbIcon" }] : /* istanbul ignore next */ []));
     /**
      * Text for aria-label of increment. Needed for a11y.
      *
@@ -69,7 +76,8 @@ class SiSliderComponent {
      * t(() => $localize`:@@SI_SLIDER.INCREMENT:Increment`)
      * ```
      */
-    incrementLabel = input(t(() => $localize `:@@SI_SLIDER.INCREMENT:Increment`), ...(ngDevMode ? [{ debugName: "incrementLabel" }] : []));
+    incrementLabel = input(t(() => $localize `:@@SI_SLIDER.INCREMENT:Increment`), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "incrementLabel" }] : /* istanbul ignore next */ []));
     /**
      * Text for aria-label of decrement. Needed for a11y.
      *
@@ -78,7 +86,8 @@ class SiSliderComponent {
      * t(() => $localize`:@@SI_SLIDER.DECREMENT:Decrement`)
      * ```
      */
-    decrementLabel = input(t(() => $localize `:@@SI_SLIDER.DECREMENT:Decrement`), ...(ngDevMode ? [{ debugName: "decrementLabel" }] : []));
+    decrementLabel = input(t(() => $localize `:@@SI_SLIDER.DECREMENT:Decrement`), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "decrementLabel" }] : /* istanbul ignore next */ []));
     /**
      * Text for aria-label of slider. Needed for a11y
      *
@@ -87,25 +96,29 @@ class SiSliderComponent {
      * t(() => $localize`:@@SI_SLIDER.LABEL:Value`)
      * ```
      */
-    sliderLabel = input(t(() => $localize `:@@SI_SLIDER.LABEL:Value`), ...(ngDevMode ? [{ debugName: "sliderLabel" }] : []));
+    sliderLabel = input(t(() => $localize `:@@SI_SLIDER.LABEL:Value`), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "sliderLabel" }] : /* istanbul ignore next */ []));
     /**
      * @defaultValue
      * ```
      * `${this.id()}-label`
      * ```
      */
-    labelledby = input(`${this.id()}-label`, ...(ngDevMode ? [{ debugName: "labelledby" }] : []));
+    labelledby = input(`${this.id()}-label`, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "labelledby" }] : /* istanbul ignore next */ []));
     /** @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" }] : []));
+    disabledInput = input(false, { ...(ngDevMode ? { debugName: "disabledInput" } : /* istanbul ignore next */ {}), alias: 'disabled', transform: booleanAttribute });
+    disabled = computed(() => this.disabledInput() || this.disabledNgControl() || this.min() === this.max(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
     sliderValue = computed(() => {
         const value = this.value();
         if (typeof value !== 'number') {
             return this.roundToStepPrecision((this.min() + this.max()) / 2);
         }
         return value;
-    }, ...(ngDevMode ? [{ debugName: "sliderValue" }] : []));
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "sliderValue" }] : /* istanbul ignore next */ []));
     /**
      * 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.
@@ -116,7 +129,8 @@ class SiSliderComponent {
      * `${this.id()}-errormessage`
      * ```
      */
-    errormessageId = input(`${this.id()}-errormessage`, ...(ngDevMode ? [{ debugName: "errormessageId" }] : []));
+    errormessageId = input(`${this.id()}-errormessage`, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "errormessageId" }] : /* istanbul ignore next */ []));
     indicatorPos = computed(() => {
         const range = this.max() - this.min();
         if (range === 0) {
@@ -124,7 +138,8 @@ class SiSliderComponent {
         }
         const indicatorPos = ((this.sliderValue() - this.min()) * 100) / range;
         return Math.max(Math.min(indicatorPos, 100), 0);
-    }, ...(ngDevMode ? [{ debugName: "indicatorPos" }] : []));
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "indicatorPos" }] : /* istanbul ignore next */ []));
     icons = addIcons({ elementMinus, elementPlus });
     isDragging = false;
     autoUpdate$ = timer(400, 80); // 250
@@ -251,8 +266,8 @@ class SiSliderComponent {
     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: [
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: SiSliderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.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,
@@ -262,9 +277,9 @@ class SiSliderComponent {
                 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:grid;grid-template:auto calc(1lh + 16px) /auto 1fr auto;column-gap:4px}.decrement-button{grid-column:1;grid-row:2;align-self:center}.increment-button{grid-column:3;grid-row:2;align-self:center}.slider-wrapper{grid-column:2;grid-row:1/-1;display:flex;flex-direction:column}.value-indicator-wrapper{position:relative;margin-inline:.75rem;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:calc(1lh + 20px)}.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:calc(1lh + 16px);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:.75rem}: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:calc((1.5rem + 16px)/-2);margin-inline:calc((1.5rem + 16px)/-2);inline-size:calc(1.5rem + 16px);block-size:calc(1.5rem + 16px)}: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:1.5rem;min-block-size:1.5rem;inline-size:1.5rem;min-inline-size:1.5rem;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:.75rem;inline-size:.75rem;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 });
+        ], 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:grid;grid-template:auto calc(1lh + 2 * var(--si-sys-sizing-spacing-y-40))/auto 1fr auto;column-gap:4px}.decrement-button{grid-column:1;grid-row:2;align-self:center}.increment-button{grid-column:3;grid-row:2;align-self:center}.slider-wrapper{grid-column:2;grid-row:1/-1;display:flex;flex-direction:column}.value-indicator-wrapper{position:relative;margin-inline:.75rem;text-align:start}.value-indicator{position:relative;display:inline-block;white-space:nowrap;color:var(--si-sys-text-secondary)}.value-indicator>span{display:inline-block;margin-inline-start:-50%}.range-indicator-wrapper{margin-block:0;margin-inline:calc(1lh + 2 * var(--si-sys-sizing-spacing-y-40) + 4px)}.range-indicator-wrapper .range-indicator{display:inline-flex;white-space:nowrap;inline-size:100%;color:var(--si-sys-text-secondary)}.range-indicator-wrapper .range-indicator>span{display:inline-block}.slider{position:relative;inline-size:100%;block-size:calc(1lh + 2 * var(--si-sys-sizing-spacing-y-40));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(--si-sys-border-4);pointer-events:none}.slider .thumb-handle-wrapper{position:absolute;inset-block:0;inset-inline:.75rem}: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:calc((1.5rem + 2 * var(--si-sys-sizing-spacing-y-40)) / -2);margin-inline:calc((1.5rem + 2 * var(--si-sys-sizing-spacing-y-40)) / -2);inline-size:calc(1.5rem + 2 * var(--si-sys-sizing-spacing-y-40));block-size:calc(1.5rem + 2 * var(--si-sys-sizing-spacing-y-40))}:host.disabled .slider .thumb-handle{pointer-events:none}.slider .thumb{--thumb-state-color: var(--si-sys-text-accent);display:flex;align-items:center;justify-content:center;block-size:1.5rem;min-block-size:1.5rem;inline-size:1.5rem;min-inline-size:1.5rem;border-radius:50%;border:1px solid var(--thumb-state-color);box-shadow:var(--si-sys-effects-shadow-1);background:var(--si-sys-background-1)}.slider .thumb:hover:not(.dragging){--thumb-state-color: var(--si-sys-text-accent-hover);background:var(--si-sys-background-accent-secondary-hover)}:host.disabled .slider .thumb{--thumb-state-color: var(--si-sys-text-disabled)}.slider .thumb si-icon{font-size:var(--si-sys-sizing-icon-md);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:.75rem;inline-size:.75rem;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" }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiSliderComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: SiSliderComponent, decorators: [{
             type: Component,
             args: [{ selector: 'si-slider', imports: [SiIconComponent, SiTranslatePipe], providers: [
                         {
@@ -276,11 +291,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
                             provide: SI_FORM_ITEM_CONTROL,
                             useExisting: SiSliderComponent
                         }
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                    ], 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:grid;grid-template:auto calc(1lh + 16px) /auto 1fr auto;column-gap:4px}.decrement-button{grid-column:1;grid-row:2;align-self:center}.increment-button{grid-column:3;grid-row:2;align-self:center}.slider-wrapper{grid-column:2;grid-row:1/-1;display:flex;flex-direction:column}.value-indicator-wrapper{position:relative;margin-inline:.75rem;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:calc(1lh + 20px)}.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:calc(1lh + 16px);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:.75rem}: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:calc((1.5rem + 16px)/-2);margin-inline:calc((1.5rem + 16px)/-2);inline-size:calc(1.5rem + 16px);block-size:calc(1.5rem + 16px)}: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:1.5rem;min-block-size:1.5rem;inline-size:1.5rem;min-inline-size:1.5rem;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:.75rem;inline-size:.75rem;border-radius:50%;background:var(--thumb-state-color)}\n"] }]
+                    }, 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:grid;grid-template:auto calc(1lh + 2 * var(--si-sys-sizing-spacing-y-40))/auto 1fr auto;column-gap:4px}.decrement-button{grid-column:1;grid-row:2;align-self:center}.increment-button{grid-column:3;grid-row:2;align-self:center}.slider-wrapper{grid-column:2;grid-row:1/-1;display:flex;flex-direction:column}.value-indicator-wrapper{position:relative;margin-inline:.75rem;text-align:start}.value-indicator{position:relative;display:inline-block;white-space:nowrap;color:var(--si-sys-text-secondary)}.value-indicator>span{display:inline-block;margin-inline-start:-50%}.range-indicator-wrapper{margin-block:0;margin-inline:calc(1lh + 2 * var(--si-sys-sizing-spacing-y-40) + 4px)}.range-indicator-wrapper .range-indicator{display:inline-flex;white-space:nowrap;inline-size:100%;color:var(--si-sys-text-secondary)}.range-indicator-wrapper .range-indicator>span{display:inline-block}.slider{position:relative;inline-size:100%;block-size:calc(1lh + 2 * var(--si-sys-sizing-spacing-y-40));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(--si-sys-border-4);pointer-events:none}.slider .thumb-handle-wrapper{position:absolute;inset-block:0;inset-inline:.75rem}: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:calc((1.5rem + 2 * var(--si-sys-sizing-spacing-y-40)) / -2);margin-inline:calc((1.5rem + 2 * var(--si-sys-sizing-spacing-y-40)) / -2);inline-size:calc(1.5rem + 2 * var(--si-sys-sizing-spacing-y-40));block-size:calc(1.5rem + 2 * var(--si-sys-sizing-spacing-y-40))}:host.disabled .slider .thumb-handle{pointer-events:none}.slider .thumb{--thumb-state-color: var(--si-sys-text-accent);display:flex;align-items:center;justify-content:center;block-size:1.5rem;min-block-size:1.5rem;inline-size:1.5rem;min-inline-size:1.5rem;border-radius:50%;border:1px solid var(--thumb-state-color);box-shadow:var(--si-sys-effects-shadow-1);background:var(--si-sys-background-1)}.slider .thumb:hover:not(.dragging){--thumb-state-color: var(--si-sys-text-accent-hover);background:var(--si-sys-background-accent-secondary-hover)}:host.disabled .slider .thumb{--thumb-state-color: var(--si-sys-text-disabled)}.slider .thumb si-icon{font-size:var(--si-sys-sizing-icon-md);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:.75rem;inline-size:.75rem;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']]
@@ -297,11 +312,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
  * 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] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: SiSliderModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.0.8", ngImport: i0, type: SiSliderModule, imports: [SiSliderComponent], exports: [SiSliderComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: SiSliderModule, imports: [SiSliderComponent] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiSliderModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: SiSliderModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [SiSliderComponent],

package/fesm2022/siemens-element-ng-slider.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"siemens-element-ng-slider.mjs","sources":["../../../../projects/element-ng/slider/si-slider.component.ts","../../../../projects/element-ng/slider/si-slider.component.html","../../../../projects/element-ng/slider/si-slider.module.ts","../../../../projects/element-ng/slider/index.ts","../../../../projects/element-ng/slider/siemens-element-ng-slider.ts"],"sourcesContent":["/*\n Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n /\nimport {\n booleanAttribute,\n ChangeDetectionStrategy,\n ChangeDetectorRef,\n Component,\n computed,\n ElementRef,\n HostListener,\n inject,\n input,\n model,\n NgZone,\n numberAttribute,\n signal,\n viewChild\n} from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\nimport { elementMinus, elementPlus } from '@siemens/element-icons';\nimport { correctKeyRTL, isRTL, listenGlobal } from '@siemens/element-ng/common';\nimport { SI_FORM_ITEM_CONTROL, SiFormItemControl } from '@siemens/element-ng/form';\nimport { addIcons, SiIconComponent } from '@siemens/element-ng/icon';\nimport { SiTranslatePipe, t } from '@siemens/element-translate-ng/translate';\nimport { Subscription, timer } from 'rxjs';\n\n@Component({\n selector: 'si-slider',\n imports: [SiIconComponent, SiTranslatePipe],\n templateUrl: './si-slider.component.html',\n styleUrl: './si-slider.component.scss',\n providers: [\n {\n provide: NG_VALUE_ACCESSOR,\n useExisting: SiSliderComponent,\n multi: true\n },\n {\n provide: SI_FORM_ITEM_CONTROL,\n useExisting: SiSliderComponent\n }\n ],\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n role: 'group',\n '[class.disabled]': 'disabled()',\n '[attr.aria-labelledby]': 'labelledby()'\n }\n})\nexport class SiSliderComponent implements ControlValueAccessor, SiFormItemControl {\n private static idCounter = 0;\n\n private readonly handleRef = viewChild.required<ElementRef>('handle');\n\n private readonly disabledNgControl = signal(false);\n\n /\n @defaultValue\n * ```\n * `__si-slider-${SiSliderComponent.idCounter++}`\n * ```\n /\n readonly id = input(`__si-slider-${SiSliderComponent.idCounter++}`);\n\n /\n Current value of slider.\n /\n readonly value = model<number>();\n /\n Minimum of slider range.\n \n @defaultValue 0\n /\n readonly min = input(0, { transform: numberAttribute });\n /\n Maximum of slider range.\n \n @defaultValue 100\n /\n readonly max = input(100, { transform: numberAttribute });\n /\n Label to describe minimum of slider range.\n \n @defaultValue ''\n /\n readonly minLabel = input('');\n /\n Label to describe maximum of slider range.\n \n @defaultValue ''\n /\n readonly maxLabel = input('');\n /\n Interval to step through the slider.\n \n @defaultValue 1\n /\n readonly step = input(1, { transform: numberAttribute });\n /\n Icon to use as the slider thumb.\n /\n readonly thumbIcon = input<string>();\n /\n Text for aria-label of increment. Needed for a11y.\n \n @defaultValue\n * ```\n * t(() => $localize`:@@SI_SLIDER.INCREMENT:Increment`)\n * ```\n /\n readonly incrementLabel = input(t(() => $localize`:@@SI_SLIDER.INCREMENT:Increment`));\n /\n Text for aria-label of decrement. Needed for a11y.\n \n @defaultValue\n * ```\n * t(() => $localize`:@@SI_SLIDER.DECREMENT:Decrement`)\n * ```\n /\n readonly decrementLabel = input(t(() => $localize`:@@SI_SLIDER.DECREMENT:Decrement`));\n /\n Text for aria-label of slider. Needed for a11y\n \n @defaultValue\n * ```\n * t(() => $localize`:@@SI_SLIDER.LABEL:Value`)\n * ```\n /\n readonly sliderLabel = input(t(() => $localize`:@@SI_SLIDER.LABEL:Value`));\n\n /\n @defaultValue\n * ```\n * `${this.id()}-label`\n * ```\n /\n readonly labelledby = input(`${this.id()}-label`);\n\n /* @defaultValue false /\n // eslint-disable-next-line @angular-eslint/no-input-rename\n readonly disabledInput = input(false, { alias: 'disabled', transform: booleanAttribute });\n\n protected readonly disabled = computed(\n () => this.disabledInput() \|\| this.disabledNgControl() \|\| this.min() === this.max()\n );\n\n protected readonly sliderValue = computed<number>(() => {\n const value = this.value();\n if (typeof value !== 'number') {\n return this.roundToStepPrecision((this.min() + this.max()) / 2);\n }\n return value;\n });\n\n /\n This ID will be bound to the `aria-describedby` attribute of the slider.\n * Use this to reference the element containing the error message(s) for the slider.\n * It will be picked by the {@link SiFormItemComponent} if the slider is used inside a form item.\n \n @defaultValue\n * ```\n * `${this.id()}-errormessage`\n * ```\n /\n readonly errormessageId = input(`${this.id()}-errormessage`);\n\n protected readonly indicatorPos = computed(() => {\n const range = this.max() - this.min();\n if (range === 0) {\n return 50;\n }\n const indicatorPos = ((this.sliderValue()! - this.min()) 100) / range;\n return Math.max(Math.min(indicatorPos, 100), 0);\n });\n\n protected readonly icons = addIcons({ elementMinus, elementPlus });\n protected isDragging = false;\n\n private autoUpdate$ = timer(400, 80); // 250\n private autoUpdateSubs?: Subscription;\n private rtl = false;\n\n private unlistenDragEvents: (() => void)[] = [];\n\n private onTouchedCallback: () => void = () => {};\n private onChangeCallback: (val: any) => void = () => {};\n\n private zone = inject(NgZone);\n private changeDetectorRef = inject(ChangeDetectorRef);\n\n private incrementValue(): void {\n this.value.set(this.normalizeValue(this.sliderValue()! + this.step()));\n this.valueChanged();\n }\n\n private decrementValue(): void {\n this.value.set(this.normalizeValue(this.sliderValue()! - this.step()));\n this.valueChanged();\n }\n\n private roundToStepPrecision(value: number): number {\n const factor = 1 / this.step();\n if (factor > 1) {\n return Math.round(value * factor) / factor;\n }\n return Math.round(value / this.step()) * this.step();\n }\n\n private normalizeValue(value: number): number {\n return Math.min(Math.max(this.roundToStepPrecision(value), this.min()), this.max());\n }\n\n private handleTouchMove(event: TouchEvent): void {\n if (event.cancelable) {\n event.preventDefault();\n event.stopPropagation();\n }\n this.handleDragMove(event.touches[0]);\n }\n\n private handleMouseMove(event: MouseEvent): void {\n event.preventDefault();\n event.stopPropagation();\n this.handleDragMove(event);\n }\n\n private handleDragMove(event: MouseEvent \| Touch): void {\n const pointerPosX = event.clientX;\n const handleRect = this.handleRef().nativeElement.getBoundingClientRect();\n const handleWrapperWidth = this.handleRef().nativeElement.parentElement.clientWidth;\n\n const direction = this.rtl ? -1 : 1;\n const pointerPosDelta =\n Math.round(pointerPosX - (handleRect.x + handleRect.width / 2)) * direction;\n const valueDelta = (pointerPosDelta / handleWrapperWidth) * (this.max() - this.min());\n\n const newValue = this.normalizeValue(this.sliderValue()! + valueDelta);\n\n if (\n (pointerPosDelta > 0 && newValue > this.sliderValue()!) \|\|\n (pointerPosDelta < 0 && newValue < this.sliderValue()!)\n ) {\n // the zone is required to work around a problem on native device where CD doesn't trigger\n this.zone.run(() => {\n this.changeDetectorRef.markForCheck();\n this.value.set(newValue);\n this.valueChanged();\n });\n }\n window.getSelection()?.removeAllRanges();\n }\n\n private handleDragEnd(): void {\n this.isDragging = false;\n\n this.unlistenDragEvents.forEach(handler => handler());\n this.unlistenDragEvents.length = 0;\n }\n\n private valueChanged(): void {\n this.onTouchedCallback();\n this.onChangeCallback(this.sliderValue());\n }\n\n @HostListener('pointerdown', ['$event'])\n @HostListener('mousedown', ['$event'])\n @HostListener('touchstart', ['$event'])\n protected handlePointerDown(event: Event): void {\n event.stopPropagation();\n }\n\n protected autoUpdateKeydown(event: KeyboardEvent): void {\n const rtlCorrectedKey = correctKeyRTL(event.key);\n\n if (rtlCorrectedKey === 'ArrowLeft') {\n this.autoUpdateStart(event, false);\n } else if (rtlCorrectedKey === 'ArrowRight') {\n this.autoUpdateStart(event, true);\n }\n }\n\n protected autoUpdateStart(event: Event, isIncrement: boolean): void {\n event.preventDefault();\n\n const trigger = isIncrement ? () => this.incrementValue() : () => this.decrementValue();\n\n this.autoUpdateSubs?.unsubscribe();\n this.autoUpdateSubs = this.autoUpdate$.subscribe(trigger);\n trigger();\n }\n\n protected autoUpdateStop(): void {\n if (this.autoUpdateSubs) {\n this.autoUpdateSubs.unsubscribe();\n this.autoUpdateSubs = undefined;\n }\n }\n\n protected handleMouseDown(event: MouseEvent): void {\n this.unlistenDragEvents.push(\n listenGlobal('mousemove', moveEvent => this.handleMouseMove(moveEvent))\n );\n this.unlistenDragEvents.push(listenGlobal('mouseup', () => this.handleDragEnd()));\n\n this.isDragging = true;\n\n this.rtl = isRTL();\n this.handleMouseMove(event);\n }\n\n protected handleTouchStart(event: TouchEvent): void {\n if (event.touches.length !== 1) {\n return;\n }\n\n this.unlistenDragEvents.push(listenGlobal('touchmove', e => this.handleTouchMove(e), true));\n this.unlistenDragEvents.push(listenGlobal('touchend', () => this.handleDragEnd()));\n\n this.isDragging = true;\n\n this.rtl = isRTL();\n this.handleTouchMove(event);\n }\n\n /** @internal /\n writeValue(val: any): void {\n this.value.set(val);\n }\n\n /* @internal /\n registerOnChange(fn: any): void {\n this.onChangeCallback = fn;\n }\n\n /* @internal /\n registerOnTouched(fn: () => void): void {\n this.onTouchedCallback = fn;\n }\n\n /* @internal /\n setDisabledState(isDisabled: boolean): void {\n this.disabledNgControl.set(isDisabled);\n }\n}\n","<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","/\n Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n /\nimport { NgModule } from '@angular/core';\n\nimport { SiSliderComponent } from './si-slider.component';\n\n@NgModule({\n imports: [SiSliderComponent],\n exports: [SiSliderComponent]\n})\nexport class SiSliderModule {}\n","/\n Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n /\nexport from './si-slider.component';\nexport * from './si-slider.module';\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"siemens-element-ng-slider.mjs","sources":["../../../../projects/element-ng/slider/si-slider.component.ts","../../../../projects/element-ng/slider/si-slider.component.html","../../../../projects/element-ng/slider/si-slider.module.ts","../../../../projects/element-ng/slider/index.ts","../../../../projects/element-ng/slider/siemens-element-ng-slider.ts"],"sourcesContent":["/*\n Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n /\nimport {\n booleanAttribute,\n ChangeDetectorRef,\n Component,\n computed,\n ElementRef,\n HostListener,\n inject,\n input,\n model,\n NgZone,\n numberAttribute,\n signal,\n viewChild\n} from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\nimport { elementMinus, elementPlus } from '@siemens/element-icons';\nimport { correctKeyRTL, isRTL, listenGlobal } from '@siemens/element-ng/common';\nimport { SI_FORM_ITEM_CONTROL, SiFormItemControl } from '@siemens/element-ng/form';\nimport { addIcons, SiIconComponent } from '@siemens/element-ng/icon';\nimport { SiTranslatePipe, t } from '@siemens/element-translate-ng/translate';\nimport { Subscription, timer } from 'rxjs';\n\n@Component({\n selector: 'si-slider',\n imports: [SiIconComponent, SiTranslatePipe],\n templateUrl: './si-slider.component.html',\n styleUrl: './si-slider.component.scss',\n providers: [\n {\n provide: NG_VALUE_ACCESSOR,\n useExisting: SiSliderComponent,\n multi: true\n },\n {\n provide: SI_FORM_ITEM_CONTROL,\n useExisting: SiSliderComponent\n }\n ],\n host: {\n role: 'group',\n '[class.disabled]': 'disabled()',\n '[attr.aria-labelledby]': 'labelledby()'\n }\n})\nexport class SiSliderComponent implements ControlValueAccessor, SiFormItemControl {\n private static idCounter = 0;\n\n private readonly handleRef = viewChild.required<ElementRef>('handle');\n\n private readonly disabledNgControl = signal(false);\n\n /\n @defaultValue\n * ```\n * `__si-slider-${SiSliderComponent.idCounter++}`\n * ```\n /\n readonly id = input(`__si-slider-${SiSliderComponent.idCounter++}`);\n\n /\n Current value of slider.\n /\n readonly value = model<number>();\n /\n Minimum of slider range.\n \n @defaultValue 0\n /\n readonly min = input(0, { transform: numberAttribute });\n /\n Maximum of slider range.\n \n @defaultValue 100\n /\n readonly max = input(100, { transform: numberAttribute });\n /\n Label to describe minimum of slider range.\n \n @defaultValue ''\n /\n readonly minLabel = input('');\n /\n Label to describe maximum of slider range.\n \n @defaultValue ''\n /\n readonly maxLabel = input('');\n /\n Interval to step through the slider.\n \n @defaultValue 1\n /\n readonly step = input(1, { transform: numberAttribute });\n /\n Icon to use as the slider thumb.\n /\n readonly thumbIcon = input<string>();\n /\n Text for aria-label of increment. Needed for a11y.\n \n @defaultValue\n * ```\n * t(() => $localize`:@@SI_SLIDER.INCREMENT:Increment`)\n * ```\n /\n readonly incrementLabel = input(t(() => $localize`:@@SI_SLIDER.INCREMENT:Increment`));\n /\n Text for aria-label of decrement. Needed for a11y.\n \n @defaultValue\n * ```\n * t(() => $localize`:@@SI_SLIDER.DECREMENT:Decrement`)\n * ```\n /\n readonly decrementLabel = input(t(() => $localize`:@@SI_SLIDER.DECREMENT:Decrement`));\n /\n Text for aria-label of slider. Needed for a11y\n \n @defaultValue\n * ```\n * t(() => $localize`:@@SI_SLIDER.LABEL:Value`)\n * ```\n /\n readonly sliderLabel = input(t(() => $localize`:@@SI_SLIDER.LABEL:Value`));\n\n /\n @defaultValue\n * ```\n * `${this.id()}-label`\n * ```\n /\n readonly labelledby = input(`${this.id()}-label`);\n\n /* @defaultValue false /\n // eslint-disable-next-line @angular-eslint/no-input-rename\n readonly disabledInput = input(false, { alias: 'disabled', transform: booleanAttribute });\n\n protected readonly disabled = computed(\n () => this.disabledInput() \|\| this.disabledNgControl() \|\| this.min() === this.max()\n );\n\n protected readonly sliderValue = computed<number>(() => {\n const value = this.value();\n if (typeof value !== 'number') {\n return this.roundToStepPrecision((this.min() + this.max()) / 2);\n }\n return value;\n });\n\n /\n This ID will be bound to the `aria-describedby` attribute of the slider.\n * Use this to reference the element containing the error message(s) for the slider.\n * It will be picked by the {@link SiFormItemComponent} if the slider is used inside a form item.\n \n @defaultValue\n * ```\n * `${this.id()}-errormessage`\n * ```\n /\n readonly errormessageId = input(`${this.id()}-errormessage`);\n\n protected readonly indicatorPos = computed(() => {\n const range = this.max() - this.min();\n if (range === 0) {\n return 50;\n }\n const indicatorPos = ((this.sliderValue()! - this.min()) 100) / range;\n return Math.max(Math.min(indicatorPos, 100), 0);\n });\n\n protected readonly icons = addIcons({ elementMinus, elementPlus });\n protected isDragging = false;\n\n private autoUpdate$ = timer(400, 80); // 250\n private autoUpdateSubs?: Subscription;\n private rtl = false;\n\n private unlistenDragEvents: (() => void)[] = [];\n\n private onTouchedCallback: () => void = () => {};\n private onChangeCallback: (val: any) => void = () => {};\n\n private zone = inject(NgZone);\n private changeDetectorRef = inject(ChangeDetectorRef);\n\n private incrementValue(): void {\n this.value.set(this.normalizeValue(this.sliderValue()! + this.step()));\n this.valueChanged();\n }\n\n private decrementValue(): void {\n this.value.set(this.normalizeValue(this.sliderValue()! - this.step()));\n this.valueChanged();\n }\n\n private roundToStepPrecision(value: number): number {\n const factor = 1 / this.step();\n if (factor > 1) {\n return Math.round(value * factor) / factor;\n }\n return Math.round(value / this.step()) * this.step();\n }\n\n private normalizeValue(value: number): number {\n return Math.min(Math.max(this.roundToStepPrecision(value), this.min()), this.max());\n }\n\n private handleTouchMove(event: TouchEvent): void {\n if (event.cancelable) {\n event.preventDefault();\n event.stopPropagation();\n }\n this.handleDragMove(event.touches[0]);\n }\n\n private handleMouseMove(event: MouseEvent): void {\n event.preventDefault();\n event.stopPropagation();\n this.handleDragMove(event);\n }\n\n private handleDragMove(event: MouseEvent \| Touch): void {\n const pointerPosX = event.clientX;\n const handleRect = this.handleRef().nativeElement.getBoundingClientRect();\n const handleWrapperWidth = this.handleRef().nativeElement.parentElement.clientWidth;\n\n const direction = this.rtl ? -1 : 1;\n const pointerPosDelta =\n Math.round(pointerPosX - (handleRect.x + handleRect.width / 2)) * direction;\n const valueDelta = (pointerPosDelta / handleWrapperWidth) * (this.max() - this.min());\n\n const newValue = this.normalizeValue(this.sliderValue()! + valueDelta);\n\n if (\n (pointerPosDelta > 0 && newValue > this.sliderValue()!) \|\|\n (pointerPosDelta < 0 && newValue < this.sliderValue()!)\n ) {\n // the zone is required to work around a problem on native device where CD doesn't trigger\n this.zone.run(() => {\n this.changeDetectorRef.markForCheck();\n this.value.set(newValue);\n this.valueChanged();\n });\n }\n window.getSelection()?.removeAllRanges();\n }\n\n private handleDragEnd(): void {\n this.isDragging = false;\n\n this.unlistenDragEvents.forEach(handler => handler());\n this.unlistenDragEvents.length = 0;\n }\n\n private valueChanged(): void {\n this.onTouchedCallback();\n this.onChangeCallback(this.sliderValue());\n }\n\n @HostListener('pointerdown', ['$event'])\n @HostListener('mousedown', ['$event'])\n @HostListener('touchstart', ['$event'])\n protected handlePointerDown(event: Event): void {\n event.stopPropagation();\n }\n\n protected autoUpdateKeydown(event: KeyboardEvent): void {\n const rtlCorrectedKey = correctKeyRTL(event.key);\n\n if (rtlCorrectedKey === 'ArrowLeft') {\n this.autoUpdateStart(event, false);\n } else if (rtlCorrectedKey === 'ArrowRight') {\n this.autoUpdateStart(event, true);\n }\n }\n\n protected autoUpdateStart(event: Event, isIncrement: boolean): void {\n event.preventDefault();\n\n const trigger = isIncrement ? () => this.incrementValue() : () => this.decrementValue();\n\n this.autoUpdateSubs?.unsubscribe();\n this.autoUpdateSubs = this.autoUpdate$.subscribe(trigger);\n trigger();\n }\n\n protected autoUpdateStop(): void {\n if (this.autoUpdateSubs) {\n this.autoUpdateSubs.unsubscribe();\n this.autoUpdateSubs = undefined;\n }\n }\n\n protected handleMouseDown(event: MouseEvent): void {\n this.unlistenDragEvents.push(\n listenGlobal('mousemove', moveEvent => this.handleMouseMove(moveEvent))\n );\n this.unlistenDragEvents.push(listenGlobal('mouseup', () => this.handleDragEnd()));\n\n this.isDragging = true;\n\n this.rtl = isRTL();\n this.handleMouseMove(event);\n }\n\n protected handleTouchStart(event: TouchEvent): void {\n if (event.touches.length !== 1) {\n return;\n }\n\n this.unlistenDragEvents.push(listenGlobal('touchmove', e => this.handleTouchMove(e), true));\n this.unlistenDragEvents.push(listenGlobal('touchend', () => this.handleDragEnd()));\n\n this.isDragging = true;\n\n this.rtl = isRTL();\n this.handleTouchMove(event);\n }\n\n /** @internal /\n writeValue(val: any): void {\n this.value.set(val);\n }\n\n /* @internal /\n registerOnChange(fn: any): void {\n this.onChangeCallback = fn;\n }\n\n /* @internal /\n registerOnTouched(fn: () => void): void {\n this.onTouchedCallback = fn;\n }\n\n /* @internal /\n setDisabledState(isDisabled: boolean): void {\n this.disabledNgControl.set(isDisabled);\n }\n}\n","<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","/\n Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n /\nimport { NgModule } from '@angular/core';\n\nimport { SiSliderComponent } from './si-slider.component';\n\n@NgModule({\n imports: [SiSliderComponent],\n exports: [SiSliderComponent]\n})\nexport class SiSliderModule {}\n","/\n Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n /\nexport from './si-slider.component';\nexport * from './si-slider.module';\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/siemens-element-ng-source-chip.mjs ADDED Viewed

@@ -0,0 +1,79 @@
+import * as i0 from '@angular/core';
+import { input, booleanAttribute, output, computed, Component } from '@angular/core';
+import { elementGlobal } from '@siemens/element-icons';
+import { addIcons, SiIconComponent } from '@siemens/element-ng/icon';
+import { SiPopoverTitleDirective, SiPopoverBodyDirective, SiPopoverDirective } from '@siemens/element-ng/popover';
+import { t, SiTranslatePipe } from '@siemens/element-translate-ng/translate';
+/**
+ * Copyright (c) Siemens 2016 - 2026
+ * SPDX-License-Identifier: MIT
+ */
+class SiSourceChipComponent {
+    /**
+     * Wether to show the glob icon.
+     * @defaultValue false
+     */
+    showIcon = input(false, { ...(ngDevMode ? { debugName: "showIcon" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /**
+     * Wether to show a 'sources' label
+     * @defaultValue false
+     */
+    showLabel = input(false, { ...(ngDevMode ? { debugName: "showLabel" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /** The sources. */
+    sources = input.required(/* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "sources" }] : /* istanbul ignore next */ []));
+    /**
+     * Compact mode for inline use.
+     * @defaultValue false
+     */
+    compact = input(false, { ...(ngDevMode ? { debugName: "compact" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /**
+     * Disabled state.
+     * @defaultValue false
+     */
+    disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /** Emitted when a source has been clicked. */
+    sourceClicked = output();
+    labelSources = t(() => $localize `:@@SI_SOURCE_CHIP.SOURCES:Sources`);
+    label = computed(() => {
+        const name = this.sources()[0].name;
+        return name.length > 24 ? name.slice(0, 24) + '…' : name;
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
+    constructor() {
+        addIcons({ elementGlobal });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: SiSourceChipComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: SiSourceChipComponent, isStandalone: true, selector: "si-source-chip", inputs: { showIcon: { classPropertyName: "showIcon", publicName: "showIcon", isSignal: true, isRequired: false, transformFunction: null }, showLabel: { classPropertyName: "showLabel", publicName: "showLabel", isSignal: true, isRequired: false, transformFunction: null }, sources: { classPropertyName: "sources", publicName: "sources", isSignal: true, isRequired: true, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { sourceClicked: "sourceClicked" }, host: { properties: { "class.lh-1": "compact()" }, classAttribute: "px-2" }, ngImport: i0, template: "@let dis = disabled();\n@let src = sources();\n<button\n  type=\"button\"\n  class=\"chip\"\n  siPopoverContainerClass=\"si-source-chip-popover\"\n  [attr.tabindex]=\"dis ? '' : '0'\"\n  [attr.aria-disabled]=\"dis\"\n  [class.disabled]=\"dis\"\n  [class.compact]=\"compact()\"\n  [class.full-size]=\"!compact()\"\n  [siPopover]=\"sourcePopover\"\n>\n  @if (showIcon()) {\n    <si-icon icon=\"element-global\" />\n  }\n  @if (showLabel() || !src.length) {\n    {{ labelSources | translate }}\n  } @else {\n    {{ label() }}\n\n    @if (src.length > 2) {\n      +{{ src.length - 1 }}\n    }\n  }\n</button>\n\n<ng-template #sourcePopover>\n  <si-popover-title class=\"visually-hidden\">\n    {{ labelSources | translate }}\n  </si-popover-title>\n  <si-popover-body class=\"p-2 sources\">\n    <ul class=\"list-unstyled mb-0\">\n      @for (source of src; track $index) {\n        <li>\n          <button\n            type=\"button\"\n            class=\"list-item list-item-action p-4\"\n            (click)=\"sourceClicked.emit(source)\"\n          >\n            <div class=\"list-item-title pt-0\">{{ source.name }}</div>\n            @if (source.quote ?? source.description; as description) {\n              <p class=\"list-item-description mb-0\">{{ description }}</p>\n            }\n          </button>\n        </li>\n      }\n    </ul>\n  </si-popover-body>\n</ng-template>\n", styles: [".chip{display:inline-flex;align-items:center;justify-content:center;min-inline-size:calc(1lh + 2 * var(--si-sys-sizing-spacing-x-40));border:1px solid var(--si-sys-border-neutral);border-radius:1lh;padding-block:0;padding-inline:var(--si-sys-sizing-spacing-x-40);gap:var(--si-sys-sizing-spacing-y-20) var(--si-sys-sizing-spacing-x-20);background:var(--si-sys-background-0)}.chip:not(.disabled){cursor:pointer}.chip:not(.disabled):not(.selected):hover{background:var(--si-sys-background-hover)}.chip[aria-expanded=true]{background:var(--si-sys-background-active)}.compact{font-size:var(--si-sys-typography-font-size-body-sm);block-size:1rem}.full-size{block-size:calc(1lh + 2 * var(--si-sys-sizing-spacing-y-40))}.disabled{opacity:var(--element-action-disabled-opacity)}.sources{max-block-size:400px;overflow-y:auto}.sources li:first-child .list-item{border-start-start-radius:var(--element-radius-1);border-start-end-radius:var(--element-radius-1)}.sources li:last-child .list-item{border-end-start-radius:var(--element-radius-1);border-end-end-radius:var(--element-radius-1)}.sources li:not(:first-child){margin-block-start:var(--si-sys-sizing-spacing-y-40)}::ng-deep .si-source-chip-popover{min-inline-size:230px;max-inline-size:400px}\n"], dependencies: [{ kind: "component", type: SiIconComponent, selector: "si-icon", inputs: ["icon"] }, { kind: "directive", type: SiPopoverTitleDirective, selector: "si-popover-title" }, { kind: "directive", type: SiPopoverBodyDirective, selector: "si-popover-body" }, { kind: "directive", type: SiPopoverDirective, selector: "[siPopover]", inputs: ["siPopover", "siPopoverPlacement", "siPopoverTitle", "siPopoverContainerClass", "siPopoverIcon", "siPopoverContext", "siPopoverScrollStrategy"], outputs: ["siPopoverVisibilityChange"], exportAs: ["si-popover"] }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: SiSourceChipComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'si-source-chip', imports: [
+                        SiIconComponent,
+                        SiTranslatePipe,
+                        SiPopoverTitleDirective,
+                        SiPopoverBodyDirective,
+                        SiPopoverDirective
+                    ], host: {
+                        class: 'px-2',
+                        '[class.lh-1]': 'compact()'
+                    }, template: "@let dis = disabled();\n@let src = sources();\n<button\n  type=\"button\"\n  class=\"chip\"\n  siPopoverContainerClass=\"si-source-chip-popover\"\n  [attr.tabindex]=\"dis ? '' : '0'\"\n  [attr.aria-disabled]=\"dis\"\n  [class.disabled]=\"dis\"\n  [class.compact]=\"compact()\"\n  [class.full-size]=\"!compact()\"\n  [siPopover]=\"sourcePopover\"\n>\n  @if (showIcon()) {\n    <si-icon icon=\"element-global\" />\n  }\n  @if (showLabel() || !src.length) {\n    {{ labelSources | translate }}\n  } @else {\n    {{ label() }}\n\n    @if (src.length > 2) {\n      +{{ src.length - 1 }}\n    }\n  }\n</button>\n\n<ng-template #sourcePopover>\n  <si-popover-title class=\"visually-hidden\">\n    {{ labelSources | translate }}\n  </si-popover-title>\n  <si-popover-body class=\"p-2 sources\">\n    <ul class=\"list-unstyled mb-0\">\n      @for (source of src; track $index) {\n        <li>\n          <button\n            type=\"button\"\n            class=\"list-item list-item-action p-4\"\n            (click)=\"sourceClicked.emit(source)\"\n          >\n            <div class=\"list-item-title pt-0\">{{ source.name }}</div>\n            @if (source.quote ?? source.description; as description) {\n              <p class=\"list-item-description mb-0\">{{ description }}</p>\n            }\n          </button>\n        </li>\n      }\n    </ul>\n  </si-popover-body>\n</ng-template>\n", styles: [".chip{display:inline-flex;align-items:center;justify-content:center;min-inline-size:calc(1lh + 2 * var(--si-sys-sizing-spacing-x-40));border:1px solid var(--si-sys-border-neutral);border-radius:1lh;padding-block:0;padding-inline:var(--si-sys-sizing-spacing-x-40);gap:var(--si-sys-sizing-spacing-y-20) var(--si-sys-sizing-spacing-x-20);background:var(--si-sys-background-0)}.chip:not(.disabled){cursor:pointer}.chip:not(.disabled):not(.selected):hover{background:var(--si-sys-background-hover)}.chip[aria-expanded=true]{background:var(--si-sys-background-active)}.compact{font-size:var(--si-sys-typography-font-size-body-sm);block-size:1rem}.full-size{block-size:calc(1lh + 2 * var(--si-sys-sizing-spacing-y-40))}.disabled{opacity:var(--element-action-disabled-opacity)}.sources{max-block-size:400px;overflow-y:auto}.sources li:first-child .list-item{border-start-start-radius:var(--element-radius-1);border-start-end-radius:var(--element-radius-1)}.sources li:last-child .list-item{border-end-start-radius:var(--element-radius-1);border-end-end-radius:var(--element-radius-1)}.sources li:not(:first-child){margin-block-start:var(--si-sys-sizing-spacing-y-40)}::ng-deep .si-source-chip-popover{min-inline-size:230px;max-inline-size:400px}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { showIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "showIcon", required: false }] }], showLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "showLabel", required: false }] }], sources: [{ type: i0.Input, args: [{ isSignal: true, alias: "sources", required: true }] }], compact: [{ type: i0.Input, args: [{ isSignal: true, alias: "compact", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], sourceClicked: [{ type: i0.Output, args: ["sourceClicked"] }] } });
+/**
+ * Copyright (c) Siemens 2016 - 2026
+ * SPDX-License-Identifier: MIT
+ */
+/**
+ * Copyright (c) Siemens 2016 - 2026
+ * SPDX-License-Identifier: MIT
+ */
+/**
+ * Generated bundle index. Do not edit.
+ */
+export { SiSourceChipComponent };
+//# sourceMappingURL=siemens-element-ng-source-chip.mjs.map

package/fesm2022/siemens-element-ng-source-chip.mjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"siemens-element-ng-source-chip.mjs","sources":["../../../../projects/element-ng/source-chip/si-source-chip.component.ts","../../../../projects/element-ng/source-chip/si-source-chip.component.html","../../../../projects/element-ng/source-chip/si-source-chip.model.ts","../../../../projects/element-ng/source-chip/index.ts","../../../../projects/element-ng/source-chip/siemens-element-ng-source-chip.ts"],"sourcesContent":["/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport { booleanAttribute, Component, computed, input, output } from '@angular/core';\nimport { elementGlobal } from '@siemens/element-icons';\nimport { addIcons, SiIconComponent } from '@siemens/element-ng/icon';\nimport {\n SiPopoverTitleDirective,\n SiPopoverBodyDirective,\n SiPopoverDirective\n} from '@siemens/element-ng/popover';\nimport { SiTranslatePipe, t } from '@siemens/element-translate-ng/translate';\n\nimport { SourceReference } from './si-source-chip.model';\n\n@Component({\n selector: 'si-source-chip',\n imports: [\n SiIconComponent,\n SiTranslatePipe,\n SiPopoverTitleDirective,\n SiPopoverBodyDirective,\n SiPopoverDirective\n ],\n templateUrl: './si-source-chip.component.html',\n styleUrl: './si-source-chip.component.scss',\n host: {\n class: 'px-2',\n '[class.lh-1]': 'compact()'\n }\n})\nexport class SiSourceChipComponent {\n /**\n * Wether to show the glob icon.\n * @defaultValue false\n */\n readonly showIcon = input(false, { transform: booleanAttribute });\n /**\n * Wether to show a 'sources' label\n * @defaultValue false\n */\n readonly showLabel = input(false, { transform: booleanAttribute });\n /** The sources. */\n readonly sources = input.required<SourceReference[]>();\n /**\n * Compact mode for inline use.\n * @defaultValue false\n */\n readonly compact = input(false, { transform: booleanAttribute });\n /**\n * Disabled state.\n * @defaultValue false\n */\n readonly disabled = input(false, { transform: booleanAttribute });\n\n /** Emitted when a source has been clicked. */\n readonly sourceClicked = output<SourceReference>();\n\n protected readonly labelSources = t(() => $localize`:@@SI_SOURCE_CHIP.SOURCES:Sources`);\n\n protected readonly label = computed(() => {\n const name = this.sources()[0].name;\n return name.length > 24 ? name.slice(0, 24) + '…' : name;\n });\n\n constructor() {\n addIcons({ elementGlobal });\n }\n}\n","@let dis = disabled();\n@let src = sources();\n<button\n type=\"button\"\n class=\"chip\"\n siPopoverContainerClass=\"si-source-chip-popover\"\n [attr.tabindex]=\"dis ? '' : '0'\"\n [attr.aria-disabled]=\"dis\"\n [class.disabled]=\"dis\"\n [class.compact]=\"compact()\"\n [class.full-size]=\"!compact()\"\n [siPopover]=\"sourcePopover\"\n>\n @if (showIcon()) {\n <si-icon icon=\"element-global\" />\n }\n @if (showLabel() || !src.length) {\n {{ labelSources | translate }}\n } @else {\n {{ label() }}\n\n @if (src.length > 2) {\n +{{ src.length - 1 }}\n }\n }\n</button>\n\n<ng-template #sourcePopover>\n <si-popover-title class=\"visually-hidden\">\n {{ labelSources | translate }}\n </si-popover-title>\n <si-popover-body class=\"p-2 sources\">\n <ul class=\"list-unstyled mb-0\">\n @for (source of src; track $index) {\n <li>\n <button\n type=\"button\"\n class=\"list-item list-item-action p-4\"\n (click)=\"sourceClicked.emit(source)\"\n >\n <div class=\"list-item-title pt-0\">{{ source.name }}</div>\n @if (source.quote ?? source.description; as description) {\n <p class=\"list-item-description mb-0\">{{ description }}</p>\n }\n </button>\n </li>\n }\n </ul>\n </si-popover-body>\n</ng-template>\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\n\n/** Definition of a single source */\nexport interface SourceReference {\n /** Source name displayed to the user. */\n name: string;\n /** Source URL. */\n url: string;\n /** Optional source description. */\n description?: string;\n /** Optional source quote. Takes precedence over {@link description}. */\n quote?: string;\n}\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nexport * from './si-source-chip.component';\nexport * from './si-source-chip.model';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}