@cas-smartdesign/lit-slider 7.1.0 → 7.2.0

package/dist/slider.d.ts

@@ -1,4 +1,4 @@
-import { LitElement, PropertyValues, TemplateResult } from "lit";
+import { LitElement, TemplateResult } from "lit";
 import { ValidationLevel } from "@cas-smartdesign/field-validation-message";
 import "@cas-smartdesign/lit-input";
 declare global {
@@ -50,8 +50,9 @@ export default class Slider extends LitElement {
     connectedCallback(): void;
     disconnectedCallback(): void;
     private upgradeProperty;
-    private updateInitialValue;
-    protected shouldUpdate(_changedProperties: PropertyValues): boolean;
+    static get observedAttributes(): string[];
+    attributeChangedCallback(name: string, old: string | null, value: string | null): void;
+    private updateValue;
     get value(): number;
     set value(newValue: number);
     private roundToStep;

package/dist/slider.mjs

@@ -1,9 +1,9 @@
-import { LitElement as p, css as g, unsafeCSS as m, html as d } from "lit";
+import { LitElement as p, unsafeCSS as g, css as m, html as d } from "lit";
 import { property as o } from "lit/decorators/property.js";
 import v from "hex-rgb";
 import "@cas-smartdesign/lit-input";
-import { Big as f } from "big.js";
-class b {
+import { Big as b } from "big.js";
+class f {
   constructor() {
     this._rgbaColors = /* @__PURE__ */ new Map(), this._originalColors = /* @__PURE__ */ new Map();
   }
@@ -73,21 +73,21 @@ class b {
   }
 }
 const C = ":host{display:block;position:relative;width:100%;height:48px;cursor:pointer;touch-action:none;contain:layout style}:host([hidden]){display:none!important}:host([disabled]){opacity:.6;cursor:default;filter:grayscale(100%)}:host([disabled]) sd-lit-input{opacity:1}#track-container{position:absolute;top:50%;left:0;height:2px;overflow:hidden}#track{position:absolute;width:100%;height:100%;transform-origin:left top;will-change:transform}:host(:focus) #thumb{top:11px;left:-14px;border-width:8px}#thumb[active]{top:7px!important;left:-18px!important;border-width:12px!important}#thumb{width:12px;height:12px;position:absolute;top:19px;left:-6px;border-radius:50%;border-width:0;background-clip:padding-box;-webkit-user-select:none;user-select:none;will-change:transform;border-style:solid}sd-lit-input{position:absolute;height:100%;width:var(--slider-suffix-width, 50px);right:0;text-align:center;outline:none;white-space:nowrap}sd-field-validation-message{position:absolute;bottom:0}";
-var y = Object.defineProperty, x = Object.getOwnPropertyDescriptor, n = (u, t, e, i) => {
-  for (var r = i > 1 ? void 0 : i ? x(t, e) : t, s = u.length - 1, h; s >= 0; s--)
-    (h = u[s]) && (r = (i ? h(t, e, r) : h(r)) || r);
-  return i && r && y(t, e, r), r;
+var y = Object.defineProperty, n = (u, t, e, i) => {
+  for (var r = void 0, s = u.length - 1, h; s >= 0; s--)
+    (h = u[s]) && (r = h(t, e, r) || r);
+  return r && y(t, e, r), r;
 }, l;
 const a = (l = class extends p {
   constructor() {
-    super(), this.thumbPosition = 0, this._value = 0, this._relativeValue = 0, this.min = 0, this.max = 1, this.colorBlender = new b(), this.baseColor = l.defaultColor, this.resizeObserver = new ResizeObserver(() => {
+    super(), this.thumbPosition = 0, this._value = 0, this._relativeValue = 0, this.min = 0, this.max = 1, this.colorBlender = new f(), this.baseColor = l.defaultColor, this.resizeObserver = new ResizeObserver(() => {
       window.requestAnimationFrame(() => {
         this.lastKnownWidth !== this.trackContainerWidth && (this.lastKnownWidth = this.trackContainerWidth, this.doUpdateRelativeValue(this._relativeValue, !0));
       });
     });
   }
   firstUpdated(t) {
-    super.firstUpdated(t), this.updateInitialValue(), this.addEventListener(
+    super.firstUpdated(t), this.updateValue(Number.parseFloat(this.getAttribute("value")) || this._value), this.addEventListener(
       this.useTouchEvents() ? "touchstart" : "pointerdown",
       (e) => {
         !this.hasAttribute("disabled") && e.composedPath().indexOf(this.inputElement) === -1 && (e.preventDefault(), e.pointerId && this.setPointerCapture(e.pointerId), this.focus(), this.listenMoveEvents(
@@ -110,12 +110,15 @@ const a = (l = class extends p {
       delete this[t], this[t] = e;
     }
   }
-  updateInitialValue() {
-    const t = Number.parseFloat(this.getAttribute("value")) || this._value;
-    this.setValueInternal(t) && (this.inputElement && (this.inputElement.value = this.formattedValue()), this.fireBothValueChangeEvents());
+  static get observedAttributes() {
+    const t = super.observedAttributes;
+    return t.push("value"), t;
   }
-  shouldUpdate(t) {
-    return t.has("step") && this.setValueInternal(this._value) && this.fireBothValueChangeEvents(), super.shouldUpdate(t);
+  attributeChangedCallback(t, e, i) {
+    super.attributeChangedCallback(t, e, i), (t === "value" || t == "step") && this.hasUpdated && this.updateValue(Number.parseFloat(i));
+  }
+  updateValue(t) {
+    this.setValueInternal(t) && (this.inputElement && (this.inputElement.value = this.formattedValue()), this._value != t && this.fireBothValueChangeEvents());
   }
   get value() {
     return this._value;
@@ -127,8 +130,8 @@ const a = (l = class extends p {
     let e = Number.parseFloat(t);
     if (Number.isNaN(e))
       return this._value;
-    if (this.step) {
-      const i = f(e).div(this.step).round().mul(this.step);
+    if (this.step && e >= this.min && e <= this.max) {
+      const i = new b(e).minus(this.min).div(this.step).round().mul(this.step).plus(this.min);
       e = Number.parseFloat(i.toString());
     }
     return e;
@@ -160,8 +163,8 @@ const a = (l = class extends p {
   }
   static get styles() {
     return [
-      g`
-                ${m(C)}
+      m`
+                ${g(C)}
             `
     ];
   }
@@ -277,46 +280,46 @@ const a = (l = class extends p {
 }, l.ID = "sd-lit-slider", l.defaultColor = "rgb(20, 103, 186)", l);
 n([
   o({ type: Number })
-], a.prototype, "thumbPosition", 2);
+], a.prototype, "thumbPosition");
 n([
   o({ type: Number, reflect: !0 })
-], a.prototype, "min", 2);
+], a.prototype, "min");
 n([
   o({ type: Number, reflect: !0 })
-], a.prototype, "max", 2);
+], a.prototype, "max");
 n([
   o({ type: Number, reflect: !0 })
-], a.prototype, "step", 2);
+], a.prototype, "step");
 n([
   o({ type: Boolean, reflect: !0 })
-], a.prototype, "editable", 2);
+], a.prototype, "editable");
 n([
   o({ type: Boolean, reflect: !0 })
-], a.prototype, "clampValue", 2);
+], a.prototype, "clampValue");
 n([
   o({ type: String, reflect: !0 })
-], a.prototype, "inputSuffix", 2);
+], a.prototype, "inputSuffix");
 n([
   o({ type: Boolean, reflect: !0 })
-], a.prototype, "disabled", 2);
+], a.prototype, "disabled");
 n([
   o({ type: String, attribute: !0 })
-], a.prototype, "validationMessage", 2);
+], a.prototype, "validationMessage");
 n([
   o({ type: String, attribute: !0 })
-], a.prototype, "validationIconSrc", 2);
+], a.prototype, "validationIconSrc");
 n([
   o({ type: String, attribute: !0 })
-], a.prototype, "validationLevel", 2);
+], a.prototype, "validationLevel");
 n([
   o({ type: String, attribute: !0 })
-], a.prototype, "decimalSeparator", 2);
+], a.prototype, "decimalSeparator");
 n([
   o({ type: Boolean })
-], a.prototype, "active", 2);
+], a.prototype, "active");
 n([
   o()
-], a.prototype, "baseColor", 2);
+], a.prototype, "baseColor");
 let c = a;
 customElements.get(c.ID) || customElements.define(c.ID, c);
 export {

package/dist/slider.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"slider.mjs","sources":["../colorblender.ts","../slider.ts"],"sourcesContent":["import hexRgb from \"hex-rgb\";\n\nexport interface IColor {\n    red: number;\n    green: number;\n    blue: number;\n    alpha: number;\n}\n\nexport default class ColorBlender {\n    private _rgbaColors: Map<number, IColor> = new Map();\n    private _originalColors: Map<number, string> = new Map();\n\n    public get colors(): Map<number, string> {\n        return this._originalColors;\n    }\n\n    public set colors(newColors: Map<number, string>) {\n        this._rgbaColors.clear();\n        this._originalColors = newColors;\n        if (newColors && newColors.size) {\n            const invalidColorKey = Array.from(newColors.keys()).find((value) => {\n                return value < 0 || value > 1;\n            });\n            if (invalidColorKey) {\n                throw Error(\n                    \"The keys of the colors must represent the relative value where the color is fully applied.\",\n                );\n            }\n            newColors.forEach((value, key) => {\n                const color: IColor = this.convertFromRGBAString(value) || this.convertFromHex(value);\n                if (Object.keys(color).length === 0 && color.constructor === Object) {\n                    throw Error(`Cannot convert color: ${value} to rgba-color`);\n                } else {\n                    this._rgbaColors.set(key, color);\n                }\n            });\n            const sortedEntries = Array.from(this._rgbaColors.entries()).sort();\n            this._rgbaColors = new Map(sortedEntries);\n        }\n    }\n\n    public blend(relativeValue: number): string {\n        if (!this._rgbaColors.size) {\n            throw Error(\"It is not possible to blend without a color list.\");\n        }\n        let leftColor: [number, IColor];\n        let rightColor: [number, IColor];\n        for (const entry of this._rgbaColors) {\n            if (!leftColor) {\n                leftColor = entry;\n            }\n            if (entry[0] < relativeValue) {\n                leftColor = entry;\n            } else if (entry[0] === relativeValue) {\n                leftColor = rightColor = entry;\n                break;\n            } else {\n                rightColor = entry;\n                break;\n            }\n        }\n        if (!rightColor) {\n            rightColor = leftColor;\n        }\n        const diff = rightColor[0] - leftColor[0];\n        if (diff) {\n            return this.blendColors(leftColor[1], rightColor[1], (relativeValue - leftColor[0]) / diff);\n        } else {\n            return this.convertToRGBAString(leftColor[1]);\n        }\n    }\n\n    private blendColors(colorA: IColor, colorB: IColor, relativeOffsetFromA: number): string {\n        return this.convertToRGBAString({\n            red: Math.round(colorA.red + (colorB.red - colorA.red) * relativeOffsetFromA),\n            green: Math.round(colorA.green + (colorB.green - colorA.green) * relativeOffsetFromA),\n            blue: Math.round(colorA.blue + (colorB.blue - colorA.blue) * relativeOffsetFromA),\n            alpha: colorA.alpha + (colorB.alpha - colorA.alpha) * relativeOffsetFromA,\n        });\n    }\n\n    private convertFromHex(hexColor: string): IColor {\n        const color = hexRgb(hexColor);\n        if (color.alpha > 1) {\n            color.alpha /= 255;\n        }\n        return color;\n    }\n\n    private convertFromRGBAString(rgbaColor: string): IColor {\n        const match = rgbaColor.match(/rgba?\\((\\d{1,3}), ?(\\d{1,3}), ?(\\d{1,3})\\)?(?:, ?(\\d(?:\\.\\d?))\\))?/);\n        return match\n            ? {\n                  red: parseInt(match[1], 10),\n                  green: parseInt(match[2], 10),\n                  blue: parseInt(match[3], 10),\n                  alpha: parseInt(match[4], 10) || 1,\n              }\n            : null;\n    }\n\n    public transparentize(color: string, alpha: number): string {\n        return this.convertToRGBAString(this.convertFromRGBAString(color), alpha);\n    }\n\n    private convertToRGBAString(color: IColor, alpha?: number): string {\n        return `rgba(${color.red},${color.green},${color.blue},${alpha || color.alpha})`;\n    }\n}\n","import { LitElement, html, PropertyValues, unsafeCSS, TemplateResult, css } from \"lit\";\nimport { property } from \"lit/decorators/property.js\";\nimport ColorBlender from \"./colorblender\";\nimport { ValidationLevel } from \"@cas-smartdesign/field-validation-message\";\nimport SDInput from \"@cas-smartdesign/lit-input\";\nimport \"@cas-smartdesign/lit-input\";\nimport { Big } from \"big.js\";\n\ndeclare global {\n    interface HTMLElementTagNameMap {\n        [Slider.ID]: Slider;\n    }\n}\n\nimport style from \"./style.scss?inline\";\n\ninterface IEventListenerRegistration {\n    remove();\n}\n\nexport interface IValueChangeEvent {\n    value: number;\n}\n\nexport interface CustomEventMap extends HTMLElementEventMap {\n    \"immediate-value-change\": CustomEvent<IValueChangeEvent>;\n    \"value-change\": CustomEvent<IValueChangeEvent>;\n}\n\nexport default interface Slider {\n    addEventListener<K extends keyof CustomEventMap>(\n        event: K,\n        listener: ((this: this, ev: CustomEventMap[K]) => unknown) | null,\n        options?: AddEventListenerOptions | boolean,\n    ): void;\n    addEventListener(\n        type: string,\n        callback: EventListenerOrEventListenerObject | null,\n        options?: AddEventListenerOptions | boolean,\n    ): void;\n    removeEventListener<K extends keyof CustomEventMap>(\n        type: K,\n        listener: (this: this, ev: CustomEventMap[K]) => unknown,\n        options?: boolean | EventListenerOptions,\n    ): void;\n    removeEventListener(\n        type: string,\n        listener: EventListenerOrEventListenerObject,\n        options?: boolean | EventListenerOptions,\n    ): void;\n    dispatchEvent<EventType extends CustomEventMap[keyof CustomEventMap]>(event: EventType): boolean;\n}\n\nexport default class Slider extends LitElement {\n    public static readonly ID = \"sd-lit-slider\";\n\n    @property({ type: Number })\n    private thumbPosition = 0;\n    private _value = 0;\n    private _relativeValue = 0;\n\n    @property({ type: Number, reflect: true })\n    public min = 0;\n    @property({ type: Number, reflect: true })\n    public max = 1;\n    @property({ type: Number, reflect: true })\n    public step: number;\n    @property({ type: Boolean, reflect: true })\n    public editable: boolean;\n    @property({ type: Boolean, reflect: true })\n    public clampValue: boolean;\n    @property({ type: String, reflect: true })\n    public inputSuffix: string;\n    @property({ type: Boolean, reflect: true })\n    public disabled: boolean;\n    @property({ type: String, attribute: true })\n    public validationMessage: string;\n    @property({ type: String, attribute: true })\n    public validationIconSrc: string;\n    @property({ type: String, attribute: true })\n    public validationLevel: ValidationLevel;\n    @property({ type: String, attribute: true })\n    public decimalSeparator: string;\n\n    @property({ type: Boolean })\n    private active: boolean;\n\n    private colorBlender: ColorBlender = new ColorBlender();\n    private static defaultColor = \"rgb(20, 103, 186)\";\n    @property()\n    private baseColor: string = Slider.defaultColor;\n\n    private resizeObserver: ResizeObserver;\n    private lastKnownWidth: number;\n    private _trackContainer: HTMLElement;\n    private _inputElement: SDInput;\n    private updateAlreadyRequested: boolean;\n\n    constructor() {\n        super();\n        this.resizeObserver = new ResizeObserver(() => {\n            window.requestAnimationFrame(() => {\n                if (this.lastKnownWidth !== this.trackContainerWidth) {\n                    this.lastKnownWidth = this.trackContainerWidth;\n                    this.doUpdateRelativeValue(this._relativeValue, true);\n                }\n            });\n        });\n    }\n\n    public firstUpdated(changedProperties) {\n        super.firstUpdated(changedProperties);\n\n        this.updateInitialValue();\n\n        this.addEventListener(\n            this.useTouchEvents() ? \"touchstart\" : \"pointerdown\",\n            (event: TouchEvent | PointerEvent) => {\n                if (!this.hasAttribute(\"disabled\") && event.composedPath().indexOf(this.inputElement) === -1) {\n                    event.preventDefault();\n                    if ((event as PointerEvent).pointerId) {\n                        this.setPointerCapture((event as PointerEvent).pointerId);\n                    }\n                    this.focus();\n                    this.listenMoveEvents(\n                        (event as PointerEvent).clientX || (event as TouchEvent).changedTouches[0].clientX,\n                    );\n                }\n            },\n        );\n        this.addEventListener(\"keydown\", this.handleKeyDown, true);\n        this.setAttribute(\"aria-valuemin\", this.min.toString());\n        this.setAttribute(\"aria-valuemax\", this.max.toString());\n        if (!this.hasAttribute(\"tabindex\")) {\n            this.setAttribute(\"tabindex\", \"0\");\n        }\n    }\n\n    public connectedCallback() {\n        super.connectedCallback();\n        [\"colors\", \"min\", \"max\", \"step\", \"editable\", \"inputSuffix\", \"value\"].forEach((p) => {\n            this.upgradeProperty(p);\n        });\n        this.resizeObserver.observe(this);\n    }\n\n    public disconnectedCallback() {\n        super.disconnectedCallback();\n        this.lastKnownWidth = undefined;\n        this.resizeObserver.disconnect();\n    }\n\n    private upgradeProperty(propertyName: string): void {\n        if (Object.prototype.hasOwnProperty.call(this, propertyName)) {\n            const value = this[propertyName];\n            delete this[propertyName];\n            this[propertyName] = value;\n        }\n    }\n\n    private updateInitialValue(): void {\n        const initialValue = Number.parseFloat(this.getAttribute(\"value\")) || this._value;\n        if (this.setValueInternal(initialValue)) {\n            if (this.inputElement) {\n                this.inputElement.value = this.formattedValue();\n            }\n            this.fireBothValueChangeEvents();\n        }\n    }\n\n    protected shouldUpdate(_changedProperties: PropertyValues): boolean {\n        if (_changedProperties.has(\"step\")) {\n            // Ensure value is rounded based on step.\n            if (this.setValueInternal(this._value)) {\n                this.fireBothValueChangeEvents();\n            }\n        }\n        return super.shouldUpdate(_changedProperties);\n    }\n\n    public get value(): number {\n        return this._value;\n    }\n\n    public set value(newValue: number) {\n        const hasChanged = this.setValueInternal(newValue);\n        if (hasChanged) {\n            this.fireBothValueChangeEvents();\n        }\n    }\n\n    private roundToStep(rawValue: number): number {\n        // eslint-disable-next-line @typescript-eslint/no-explicit-any\n        let roundedValue = Number.parseFloat(rawValue as any);\n        if (Number.isNaN(roundedValue)) {\n            return this._value;\n        }\n        if (this.step) {\n            const coercedBigDecimal = Big(roundedValue).div(this.step).round().mul(this.step);\n            roundedValue = Number.parseFloat(coercedBigDecimal.toString());\n        }\n        return roundedValue;\n    }\n\n    private setValueInternal(newValue: number): boolean {\n        const roundedValue = this.roundToStep(newValue);\n        const clampedValue = this.clampValue ? Math.max(this.min, Math.min(this.max, roundedValue)) : roundedValue;\n        if (this._value !== clampedValue) {\n            const oldValue = this._value;\n            this._value = clampedValue;\n            this.relativeValue = (clampedValue - this.min) / (this.max - this.min);\n            this.setAttribute(\"aria-valuenow\", this._value.toString());\n            this.requestUpdate(\"value\", oldValue);\n            return true;\n        }\n        return false;\n    }\n\n    get relativeValue() {\n        return this._relativeValue;\n    }\n\n    set relativeValue(newRelativeValue: number) {\n        if (this._relativeValue !== newRelativeValue) {\n            this.doUpdateRelativeValue(newRelativeValue);\n        }\n    }\n\n    private doUpdateRelativeValue(newRelativeValue: number, skipColorUpdate?: boolean) {\n        this._relativeValue = newRelativeValue;\n        this.thumbPosition = Math.min(Math.max(0, newRelativeValue), 1) * this.trackContainerWidth;\n        const newValueBasedOnRelativeValue = this.min + (this.max - this.min) * this._relativeValue;\n        this.setValueInternal(newValueBasedOnRelativeValue);\n        if (!skipColorUpdate && this.colors && this.colors.size) {\n            this.baseColor = this.colorBlender.blend(this._relativeValue);\n        }\n    }\n\n    public get colors(): Map<number, string> {\n        return this.colorBlender.colors;\n    }\n\n    public set colors(newColors: Map<number, string>) {\n        this.colorBlender.colors = newColors;\n        if (this.colors && this.colors.size) {\n            this.baseColor = this.colorBlender.blend(this._relativeValue);\n        } else {\n            this.baseColor = Slider.defaultColor;\n        }\n    }\n\n    static get styles() {\n        return [\n            css`\n                ${unsafeCSS(style)}\n            `,\n        ];\n    }\n\n    public render(): TemplateResult {\n        const trackBackgroundColor = this.colorBlender.transparentize(this.baseColor, 0.26);\n        const trackContainerStyle = `background-color:${trackBackgroundColor}; right: ${\n            this.editable ? \"calc(var(--slider-suffix-width, 50px) + 8px)\" : \"0\"\n        }`;\n        const trackStyle = `transform: scaleX(${this.relativeValue}); background-color:${this.baseColor};`;\n        const thumbStyle = `transform: translateX(${this.thumbPosition}px); background-color:${this.baseColor}; border-color:${trackBackgroundColor};`;\n        return html`\n            <div id=\"track-container\" style=\"${trackContainerStyle}\">\n                <div id=\"track\" style=\"${trackStyle}\"></div>\n            </div>\n            <div id=\"thumb\" ?active=\"${this.active}\" style=\"${thumbStyle}\"></div>\n            ${this.editable &&\n            html`\n                <sd-lit-input\n                    .value=\"${this.formattedValue()}\"\n                    @value-change=\"${this.onInputValueChange}\"\n                    ?disabled=\"${this.disabled}\"\n                    ><span slot=\"suffix\">${this.inputSuffix}</span>\n                </sd-lit-input>\n            `}\n            ${this.validationMessage &&\n            html`\n                <sd-field-validation-message\n                    .message=\"${this.validationMessage}\"\n                    .icon=\"${this.validationIconSrc}\"\n                    .level=\"${this.validationLevel}\"\n                >\n                </sd-field-validation-message>\n            `}\n        `;\n    }\n\n    private listenMoveEvents(currentClientX: number) {\n        this.active = true;\n        this.onPointerMove(currentClientX);\n\n        const eventListenersToRemove: IEventListenerRegistration[] = [];\n        const pointerMoveListener = (event) => {\n            event.stopPropagation();\n            event.preventDefault();\n            this.onPointerMove(event.clientX || (event.changedTouches && event.changedTouches[0].clientX));\n        };\n        const pointerUpListener = () => {\n            this.active = false;\n            eventListenersToRemove.forEach((reg) => reg.remove());\n            this.fireValueChange();\n        };\n        if (this.useTouchEvents()) {\n            eventListenersToRemove.push(this.addPointerEventListener(\"touchmove\", pointerMoveListener));\n            eventListenersToRemove.push(this.addPointerEventListener(\"touchend\", pointerUpListener));\n            eventListenersToRemove.push(this.addPointerEventListener(\"touchcancel\", pointerUpListener));\n        } else {\n            eventListenersToRemove.push(this.addPointerEventListener(\"pointermove\", pointerMoveListener));\n            eventListenersToRemove.push(this.addPointerEventListener(\"pointerup\", pointerUpListener));\n        }\n    }\n\n    private onPointerMove(clientX: number): void {\n        if (this.updateAlreadyRequested) {\n            return;\n        }\n        this.updateAlreadyRequested = true;\n        window.requestAnimationFrame(async () => {\n            this.updateAlreadyRequested = false;\n            this.updateThumbPosition(clientX);\n            const previousValue = this.relativeValue;\n            this.relativeValue = this.thumbPosition / this.trackContainerWidth;\n            if (this.relativeValue !== previousValue) {\n                await this.updateComplete;\n                this.fireValueChange(true);\n                if (!this.active) {\n                    this.fireValueChange();\n                }\n            }\n        });\n    }\n\n    private addPointerEventListener(type: string, listener: EventListener): IEventListenerRegistration {\n        window.addEventListener(type, listener, true);\n        return {\n            remove: () => {\n                window.removeEventListener(type, listener, true);\n            },\n        };\n    }\n\n    private updateThumbPosition(clientX: number): void {\n        this.thumbPosition = Math.min(\n            this.trackContainerWidth,\n            Math.max(0, clientX - this.getBoundingClientRect().left),\n        );\n        if (this.max - this.min > 1) {\n            // Enforce integer steps by pointer move events. Fixes #231868\n            const thumbStepForIntegerOffset = this.trackContainerWidth / (this.max - this.min);\n            const thumbPositionError = this.thumbPosition % thumbStepForIntegerOffset;\n            if (thumbPositionError) {\n                if (thumbPositionError < thumbStepForIntegerOffset / 2) {\n                    this.thumbPosition -= thumbPositionError;\n                } else {\n                    this.thumbPosition += thumbStepForIntegerOffset - thumbPositionError;\n                }\n            }\n        }\n    }\n\n    private onInputValueChange(event: CustomEvent) {\n        this.value = Number(event.detail.value.replace(RegExp(this.escapedDecimalSeparator), \".\"));\n        if (String(this.value) !== String(event.detail.value)) {\n            (event.target as SDInput).value = String(this.value);\n        }\n    }\n\n    private formattedValue(): string {\n        return this.value.toString().replace(/\\./, this.decimalSeparatorOrDefault);\n    }\n\n    private get escapedDecimalSeparator(): string {\n        return this.decimalSeparatorOrDefault.replace(/[-[\\]{}()*+?.,\\\\^$|#\\s]/g, \"\\\\$&\");\n    }\n\n    private get decimalSeparatorOrDefault(): string {\n        return this.decimalSeparator || Number(1.1).toLocaleString(this.navigatorLanguage).substring(1, 2);\n    }\n\n    private get navigatorLanguage(): string {\n        if (navigator.languages && navigator.languages.length) {\n            return navigator.languages[0];\n        } else {\n            // eslint-disable-next-line @typescript-eslint/no-explicit-any\n            return (navigator as any).userLanguage || navigator.language || (navigator as any).browserLanguage || \"en\";\n        }\n    }\n\n    private handleKeyDown(event: KeyboardEvent): void {\n        if (!this.hasAttribute(\"disabled\") && event.composedPath().indexOf(this.inputElement) === -1) {\n            let offset = this.step || (this.max - this.min) / 100;\n            if (this.max - this.min > 1) {\n                // Enforce integer steps by keydown events. Fixes #231868\n                offset = Math.round(offset) || 1;\n            }\n            switch (event.keyCode) {\n                case 37:\n                case 40:\n                    this.value = Math.max(this.value - offset, this.min);\n                    event.preventDefault();\n                    break;\n                case 38:\n                case 39:\n                    this.value = Math.min(this.value + offset, this.max);\n                    event.preventDefault();\n                    break;\n            }\n        }\n    }\n\n    private get inputElement(): SDInput {\n        if (!this._inputElement) {\n            this._inputElement = this.shadowRoot.querySelector(\"sd-lit-input\");\n        }\n        return this._inputElement;\n    }\n\n    private get trackContainer(): HTMLElement {\n        if (!this._trackContainer) {\n            this._trackContainer = this.shadowRoot.querySelector(\"#track-container\");\n        }\n        return this._trackContainer;\n    }\n\n    private get trackContainerWidth(): number {\n        return this.trackContainer && this.trackContainer.offsetWidth;\n    }\n\n    private fireBothValueChangeEvents(): void {\n        this.fireValueChange(true);\n        this.fireValueChange();\n    }\n\n    private fireValueChange(immediate?: boolean): void {\n        this.dispatchEvent(\n            new CustomEvent<IValueChangeEvent>(`${immediate ? \"immediate-\" : \"\"}value-change`, {\n                detail: { value: this.value },\n            }),\n        );\n    }\n\n    private useTouchEvents(): boolean {\n        return this.hasAttribute(\"use-touch-events\");\n    }\n}\n\nif (!customElements.get(Slider.ID)) {\n    customElements.define(Slider.ID, Slider);\n}\n"],"names":["ColorBlender","newColors","value","key","color","sortedEntries","relativeValue","leftColor","rightColor","entry","diff","colorA","colorB","relativeOffsetFromA","hexColor","hexRgb","rgbaColor","match","alpha","_Slider","_a","LitElement","changedProperties","event","p","propertyName","initialValue","_changedProperties","newValue","rawValue","roundedValue","coercedBigDecimal","Big","clampedValue","oldValue","newRelativeValue","skipColorUpdate","newValueBasedOnRelativeValue","css","unsafeCSS","style","trackBackgroundColor","trackContainerStyle","trackStyle","thumbStyle","html","currentClientX","eventListenersToRemove","pointerMoveListener","pointerUpListener","reg","clientX","previousValue","type","listener","thumbStepForIntegerOffset","thumbPositionError","offset","immediate","__decorateClass","property","Slider"],"mappings":"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"}
+{"version":3,"file":"slider.mjs","sources":["../colorblender.ts","../slider.ts"],"sourcesContent":["import hexRgb from \"hex-rgb\";\n\nexport interface IColor {\n    red: number;\n    green: number;\n    blue: number;\n    alpha: number;\n}\n\nexport default class ColorBlender {\n    private _rgbaColors: Map<number, IColor> = new Map();\n    private _originalColors: Map<number, string> = new Map();\n\n    public get colors(): Map<number, string> {\n        return this._originalColors;\n    }\n\n    public set colors(newColors: Map<number, string>) {\n        this._rgbaColors.clear();\n        this._originalColors = newColors;\n        if (newColors && newColors.size) {\n            const invalidColorKey = Array.from(newColors.keys()).find((value) => {\n                return value < 0 || value > 1;\n            });\n            if (invalidColorKey) {\n                throw Error(\n                    \"The keys of the colors must represent the relative value where the color is fully applied.\",\n                );\n            }\n            newColors.forEach((value, key) => {\n                const color: IColor = this.convertFromRGBAString(value) || this.convertFromHex(value);\n                if (Object.keys(color).length === 0 && color.constructor === Object) {\n                    throw Error(`Cannot convert color: ${value} to rgba-color`);\n                } else {\n                    this._rgbaColors.set(key, color);\n                }\n            });\n            const sortedEntries = Array.from(this._rgbaColors.entries()).sort();\n            this._rgbaColors = new Map(sortedEntries);\n        }\n    }\n\n    public blend(relativeValue: number): string {\n        if (!this._rgbaColors.size) {\n            throw Error(\"It is not possible to blend without a color list.\");\n        }\n        let leftColor: [number, IColor];\n        let rightColor: [number, IColor];\n        for (const entry of this._rgbaColors) {\n            if (!leftColor) {\n                leftColor = entry;\n            }\n            if (entry[0] < relativeValue) {\n                leftColor = entry;\n            } else if (entry[0] === relativeValue) {\n                leftColor = rightColor = entry;\n                break;\n            } else {\n                rightColor = entry;\n                break;\n            }\n        }\n        if (!rightColor) {\n            rightColor = leftColor;\n        }\n        const diff = rightColor[0] - leftColor[0];\n        if (diff) {\n            return this.blendColors(leftColor[1], rightColor[1], (relativeValue - leftColor[0]) / diff);\n        } else {\n            return this.convertToRGBAString(leftColor[1]);\n        }\n    }\n\n    private blendColors(colorA: IColor, colorB: IColor, relativeOffsetFromA: number): string {\n        return this.convertToRGBAString({\n            red: Math.round(colorA.red + (colorB.red - colorA.red) * relativeOffsetFromA),\n            green: Math.round(colorA.green + (colorB.green - colorA.green) * relativeOffsetFromA),\n            blue: Math.round(colorA.blue + (colorB.blue - colorA.blue) * relativeOffsetFromA),\n            alpha: colorA.alpha + (colorB.alpha - colorA.alpha) * relativeOffsetFromA,\n        });\n    }\n\n    private convertFromHex(hexColor: string): IColor {\n        const color = hexRgb(hexColor);\n        if (color.alpha > 1) {\n            color.alpha /= 255;\n        }\n        return color;\n    }\n\n    private convertFromRGBAString(rgbaColor: string): IColor {\n        const match = rgbaColor.match(/rgba?\\((\\d{1,3}), ?(\\d{1,3}), ?(\\d{1,3})\\)?(?:, ?(\\d(?:\\.\\d?))\\))?/);\n        return match\n            ? {\n                  red: parseInt(match[1], 10),\n                  green: parseInt(match[2], 10),\n                  blue: parseInt(match[3], 10),\n                  alpha: parseInt(match[4], 10) || 1,\n              }\n            : null;\n    }\n\n    public transparentize(color: string, alpha: number): string {\n        return this.convertToRGBAString(this.convertFromRGBAString(color), alpha);\n    }\n\n    private convertToRGBAString(color: IColor, alpha?: number): string {\n        return `rgba(${color.red},${color.green},${color.blue},${alpha || color.alpha})`;\n    }\n}\n","import { LitElement, html, PropertyValues, unsafeCSS, TemplateResult, css } from \"lit\";\nimport { property } from \"lit/decorators/property.js\";\nimport ColorBlender from \"./colorblender\";\nimport { ValidationLevel } from \"@cas-smartdesign/field-validation-message\";\nimport SDInput from \"@cas-smartdesign/lit-input\";\nimport \"@cas-smartdesign/lit-input\";\nimport { Big } from \"big.js\";\n\ndeclare global {\n    interface HTMLElementTagNameMap {\n        [Slider.ID]: Slider;\n    }\n}\n\nimport style from \"./style.scss?inline\";\n\ninterface IEventListenerRegistration {\n    remove();\n}\n\nexport interface IValueChangeEvent {\n    value: number;\n}\n\nexport interface CustomEventMap extends HTMLElementEventMap {\n    \"immediate-value-change\": CustomEvent<IValueChangeEvent>;\n    \"value-change\": CustomEvent<IValueChangeEvent>;\n}\n\nexport default interface Slider {\n    addEventListener<K extends keyof CustomEventMap>(\n        event: K,\n        listener: ((this: this, ev: CustomEventMap[K]) => unknown) | null,\n        options?: AddEventListenerOptions | boolean,\n    ): void;\n    addEventListener(\n        type: string,\n        callback: EventListenerOrEventListenerObject | null,\n        options?: AddEventListenerOptions | boolean,\n    ): void;\n    removeEventListener<K extends keyof CustomEventMap>(\n        type: K,\n        listener: (this: this, ev: CustomEventMap[K]) => unknown,\n        options?: boolean | EventListenerOptions,\n    ): void;\n    removeEventListener(\n        type: string,\n        listener: EventListenerOrEventListenerObject,\n        options?: boolean | EventListenerOptions,\n    ): void;\n    dispatchEvent<EventType extends CustomEventMap[keyof CustomEventMap]>(event: EventType): boolean;\n}\n\nexport default class Slider extends LitElement {\n    public static readonly ID = \"sd-lit-slider\";\n\n    @property({ type: Number })\n    private thumbPosition = 0;\n    private _value = 0;\n    private _relativeValue = 0;\n\n    @property({ type: Number, reflect: true })\n    public min = 0;\n    @property({ type: Number, reflect: true })\n    public max = 1;\n    @property({ type: Number, reflect: true })\n    public step: number;\n    @property({ type: Boolean, reflect: true })\n    public editable: boolean;\n    @property({ type: Boolean, reflect: true })\n    public clampValue: boolean;\n    @property({ type: String, reflect: true })\n    public inputSuffix: string;\n    @property({ type: Boolean, reflect: true })\n    public disabled: boolean;\n    @property({ type: String, attribute: true })\n    public validationMessage: string;\n    @property({ type: String, attribute: true })\n    public validationIconSrc: string;\n    @property({ type: String, attribute: true })\n    public validationLevel: ValidationLevel;\n    @property({ type: String, attribute: true })\n    public decimalSeparator: string;\n\n    @property({ type: Boolean })\n    private active: boolean;\n\n    private colorBlender: ColorBlender = new ColorBlender();\n    private static defaultColor = \"rgb(20, 103, 186)\";\n    @property()\n    private baseColor: string = Slider.defaultColor;\n\n    private resizeObserver: ResizeObserver;\n    private lastKnownWidth: number;\n    private _trackContainer: HTMLElement;\n    private _inputElement: SDInput;\n    private updateAlreadyRequested: boolean;\n\n    constructor() {\n        super();\n        this.resizeObserver = new ResizeObserver(() => {\n            window.requestAnimationFrame(() => {\n                if (this.lastKnownWidth !== this.trackContainerWidth) {\n                    this.lastKnownWidth = this.trackContainerWidth;\n                    this.doUpdateRelativeValue(this._relativeValue, true);\n                }\n            });\n        });\n    }\n\n    public firstUpdated(changedProperties) {\n        super.firstUpdated(changedProperties);\n\n        this.updateValue(Number.parseFloat(this.getAttribute(\"value\")) || this._value);\n\n        this.addEventListener(\n            this.useTouchEvents() ? \"touchstart\" : \"pointerdown\",\n            (event: TouchEvent | PointerEvent) => {\n                if (!this.hasAttribute(\"disabled\") && event.composedPath().indexOf(this.inputElement) === -1) {\n                    event.preventDefault();\n                    if ((event as PointerEvent).pointerId) {\n                        this.setPointerCapture((event as PointerEvent).pointerId);\n                    }\n                    this.focus();\n                    this.listenMoveEvents(\n                        (event as PointerEvent).clientX || (event as TouchEvent).changedTouches[0].clientX,\n                    );\n                }\n            },\n        );\n        this.addEventListener(\"keydown\", this.handleKeyDown, true);\n        this.setAttribute(\"aria-valuemin\", this.min.toString());\n        this.setAttribute(\"aria-valuemax\", this.max.toString());\n        if (!this.hasAttribute(\"tabindex\")) {\n            this.setAttribute(\"tabindex\", \"0\");\n        }\n    }\n\n    public connectedCallback() {\n        super.connectedCallback();\n        [\"colors\", \"min\", \"max\", \"step\", \"editable\", \"inputSuffix\", \"value\"].forEach((p) => {\n            this.upgradeProperty(p);\n        });\n        this.resizeObserver.observe(this);\n    }\n\n    public disconnectedCallback() {\n        super.disconnectedCallback();\n        this.lastKnownWidth = undefined;\n        this.resizeObserver.disconnect();\n    }\n\n    private upgradeProperty(propertyName: string): void {\n        if (Object.prototype.hasOwnProperty.call(this, propertyName)) {\n            const value = this[propertyName];\n            delete this[propertyName];\n            this[propertyName] = value;\n        }\n    }\n\n    static get observedAttributes() {\n        const attributes = super.observedAttributes;\n        attributes.push(\"value\");\n        return attributes;\n    }\n\n    attributeChangedCallback(name: string, old: string | null, value: string | null): void {\n        super.attributeChangedCallback(name, old, value);\n\n        if ((name === \"value\" || name == \"step\") && this.hasUpdated) {\n            this.updateValue(Number.parseFloat(value));\n        }\n    }\n\n    private updateValue(newValue: number) {\n        if (this.setValueInternal(newValue)) {\n            if (this.inputElement) {\n                this.inputElement.value = this.formattedValue();\n            }\n            if (this._value != newValue) {\n                this.fireBothValueChangeEvents();\n            }\n        }\n    }\n\n    public get value(): number {\n        return this._value;\n    }\n\n    public set value(newValue: number) {\n        const hasChanged = this.setValueInternal(newValue);\n        if (hasChanged) {\n            this.fireBothValueChangeEvents();\n        }\n    }\n\n    private roundToStep(rawValue: number): number {\n        // eslint-disable-next-line @typescript-eslint/no-explicit-any\n        let roundedValue = Number.parseFloat(rawValue as any);\n        if (Number.isNaN(roundedValue)) {\n            return this._value;\n        }\n        if (this.step && roundedValue >= this.min && roundedValue <= this.max) {\n            const offsetBigDecimal = new Big(roundedValue)\n                .minus(this.min)\n                .div(this.step)\n                .round()\n                .mul(this.step)\n                .plus(this.min);\n            roundedValue = Number.parseFloat(offsetBigDecimal.toString());\n        }\n        return roundedValue;\n    }\n\n    private setValueInternal(newValue: number): boolean {\n        const roundedValue = this.roundToStep(newValue);\n        const clampedValue = this.clampValue ? Math.max(this.min, Math.min(this.max, roundedValue)) : roundedValue;\n        if (this._value !== clampedValue) {\n            const oldValue = this._value;\n            this._value = clampedValue;\n            this.relativeValue = (clampedValue - this.min) / (this.max - this.min);\n            this.setAttribute(\"aria-valuenow\", this._value.toString());\n            this.requestUpdate(\"value\", oldValue);\n            return true;\n        }\n        return false;\n    }\n\n    get relativeValue() {\n        return this._relativeValue;\n    }\n\n    set relativeValue(newRelativeValue: number) {\n        if (this._relativeValue !== newRelativeValue) {\n            this.doUpdateRelativeValue(newRelativeValue);\n        }\n    }\n\n    private doUpdateRelativeValue(newRelativeValue: number, skipColorUpdate?: boolean) {\n        this._relativeValue = newRelativeValue;\n        this.thumbPosition = Math.min(Math.max(0, newRelativeValue), 1) * this.trackContainerWidth;\n        const newValueBasedOnRelativeValue = this.min + (this.max - this.min) * this._relativeValue;\n        this.setValueInternal(newValueBasedOnRelativeValue);\n        if (!skipColorUpdate && this.colors && this.colors.size) {\n            this.baseColor = this.colorBlender.blend(this._relativeValue);\n        }\n    }\n\n    public get colors(): Map<number, string> {\n        return this.colorBlender.colors;\n    }\n\n    public set colors(newColors: Map<number, string>) {\n        this.colorBlender.colors = newColors;\n        if (this.colors && this.colors.size) {\n            this.baseColor = this.colorBlender.blend(this._relativeValue);\n        } else {\n            this.baseColor = Slider.defaultColor;\n        }\n    }\n\n    static get styles() {\n        return [\n            css`\n                ${unsafeCSS(style)}\n            `,\n        ];\n    }\n\n    public render(): TemplateResult {\n        const trackBackgroundColor = this.colorBlender.transparentize(this.baseColor, 0.26);\n        const trackContainerStyle = `background-color:${trackBackgroundColor}; right: ${\n            this.editable ? \"calc(var(--slider-suffix-width, 50px) + 8px)\" : \"0\"\n        }`;\n        const trackStyle = `transform: scaleX(${this.relativeValue}); background-color:${this.baseColor};`;\n        const thumbStyle = `transform: translateX(${this.thumbPosition}px); background-color:${this.baseColor}; border-color:${trackBackgroundColor};`;\n        return html`\n            <div id=\"track-container\" style=\"${trackContainerStyle}\">\n                <div id=\"track\" style=\"${trackStyle}\"></div>\n            </div>\n            <div id=\"thumb\" ?active=\"${this.active}\" style=\"${thumbStyle}\"></div>\n            ${this.editable &&\n            html`\n                <sd-lit-input\n                    .value=\"${this.formattedValue()}\"\n                    @value-change=\"${this.onInputValueChange}\"\n                    ?disabled=\"${this.disabled}\"\n                    ><span slot=\"suffix\">${this.inputSuffix}</span>\n                </sd-lit-input>\n            `}\n            ${this.validationMessage &&\n            html`\n                <sd-field-validation-message\n                    .message=\"${this.validationMessage}\"\n                    .icon=\"${this.validationIconSrc}\"\n                    .level=\"${this.validationLevel}\"\n                >\n                </sd-field-validation-message>\n            `}\n        `;\n    }\n\n    private listenMoveEvents(currentClientX: number) {\n        this.active = true;\n        this.onPointerMove(currentClientX);\n\n        const eventListenersToRemove: IEventListenerRegistration[] = [];\n        const pointerMoveListener = (event) => {\n            event.stopPropagation();\n            event.preventDefault();\n            this.onPointerMove(event.clientX || (event.changedTouches && event.changedTouches[0].clientX));\n        };\n        const pointerUpListener = () => {\n            this.active = false;\n            eventListenersToRemove.forEach((reg) => reg.remove());\n            this.fireValueChange();\n        };\n        if (this.useTouchEvents()) {\n            eventListenersToRemove.push(this.addPointerEventListener(\"touchmove\", pointerMoveListener));\n            eventListenersToRemove.push(this.addPointerEventListener(\"touchend\", pointerUpListener));\n            eventListenersToRemove.push(this.addPointerEventListener(\"touchcancel\", pointerUpListener));\n        } else {\n            eventListenersToRemove.push(this.addPointerEventListener(\"pointermove\", pointerMoveListener));\n            eventListenersToRemove.push(this.addPointerEventListener(\"pointerup\", pointerUpListener));\n        }\n    }\n\n    private onPointerMove(clientX: number): void {\n        if (this.updateAlreadyRequested) {\n            return;\n        }\n        this.updateAlreadyRequested = true;\n        window.requestAnimationFrame(async () => {\n            this.updateAlreadyRequested = false;\n            this.updateThumbPosition(clientX);\n            const previousValue = this.relativeValue;\n            this.relativeValue = this.thumbPosition / this.trackContainerWidth;\n            if (this.relativeValue !== previousValue) {\n                await this.updateComplete;\n                this.fireValueChange(true);\n                if (!this.active) {\n                    this.fireValueChange();\n                }\n            }\n        });\n    }\n\n    private addPointerEventListener(type: string, listener: EventListener): IEventListenerRegistration {\n        window.addEventListener(type, listener, true);\n        return {\n            remove: () => {\n                window.removeEventListener(type, listener, true);\n            },\n        };\n    }\n\n    private updateThumbPosition(clientX: number): void {\n        this.thumbPosition = Math.min(\n            this.trackContainerWidth,\n            Math.max(0, clientX - this.getBoundingClientRect().left),\n        );\n        if (this.max - this.min > 1) {\n            // Enforce integer steps by pointer move events. Fixes #231868\n            const thumbStepForIntegerOffset = this.trackContainerWidth / (this.max - this.min);\n            const thumbPositionError = this.thumbPosition % thumbStepForIntegerOffset;\n            if (thumbPositionError) {\n                if (thumbPositionError < thumbStepForIntegerOffset / 2) {\n                    this.thumbPosition -= thumbPositionError;\n                } else {\n                    this.thumbPosition += thumbStepForIntegerOffset - thumbPositionError;\n                }\n            }\n        }\n    }\n\n    private onInputValueChange(event: CustomEvent) {\n        this.value = Number(event.detail.value.replace(RegExp(this.escapedDecimalSeparator), \".\"));\n        if (String(this.value) !== String(event.detail.value)) {\n            (event.target as SDInput).value = String(this.value);\n        }\n    }\n\n    private formattedValue(): string {\n        return this.value.toString().replace(/\\./, this.decimalSeparatorOrDefault);\n    }\n\n    private get escapedDecimalSeparator(): string {\n        return this.decimalSeparatorOrDefault.replace(/[-[\\]{}()*+?.,\\\\^$|#\\s]/g, \"\\\\$&\");\n    }\n\n    private get decimalSeparatorOrDefault(): string {\n        return this.decimalSeparator || Number(1.1).toLocaleString(this.navigatorLanguage).substring(1, 2);\n    }\n\n    private get navigatorLanguage(): string {\n        if (navigator.languages && navigator.languages.length) {\n            return navigator.languages[0];\n        } else {\n            // eslint-disable-next-line @typescript-eslint/no-explicit-any\n            return (navigator as any).userLanguage || navigator.language || (navigator as any).browserLanguage || \"en\";\n        }\n    }\n\n    private handleKeyDown(event: KeyboardEvent): void {\n        if (!this.hasAttribute(\"disabled\") && event.composedPath().indexOf(this.inputElement) === -1) {\n            let offset = this.step || (this.max - this.min) / 100;\n            if (this.max - this.min > 1) {\n                // Enforce integer steps by keydown events. Fixes #231868\n                offset = Math.round(offset) || 1;\n            }\n            switch (event.keyCode) {\n                case 37:\n                case 40:\n                    this.value = Math.max(this.value - offset, this.min);\n                    event.preventDefault();\n                    break;\n                case 38:\n                case 39:\n                    this.value = Math.min(this.value + offset, this.max);\n                    event.preventDefault();\n                    break;\n            }\n        }\n    }\n\n    private get inputElement(): SDInput {\n        if (!this._inputElement) {\n            this._inputElement = this.shadowRoot.querySelector(\"sd-lit-input\");\n        }\n        return this._inputElement;\n    }\n\n    private get trackContainer(): HTMLElement {\n        if (!this._trackContainer) {\n            this._trackContainer = this.shadowRoot.querySelector(\"#track-container\");\n        }\n        return this._trackContainer;\n    }\n\n    private get trackContainerWidth(): number {\n        return this.trackContainer && this.trackContainer.offsetWidth;\n    }\n\n    private fireBothValueChangeEvents(): void {\n        this.fireValueChange(true);\n        this.fireValueChange();\n    }\n\n    private fireValueChange(immediate?: boolean): void {\n        this.dispatchEvent(\n            new CustomEvent<IValueChangeEvent>(`${immediate ? \"immediate-\" : \"\"}value-change`, {\n                detail: { value: this.value },\n            }),\n        );\n    }\n\n    private useTouchEvents(): boolean {\n        return this.hasAttribute(\"use-touch-events\");\n    }\n}\n\nif (!customElements.get(Slider.ID)) {\n    customElements.define(Slider.ID, Slider);\n}\n"],"names":["ColorBlender","newColors","value","key","color","sortedEntries","relativeValue","leftColor","rightColor","entry","diff","colorA","colorB","relativeOffsetFromA","hexColor","hexRgb","rgbaColor","match","alpha","_Slider","_a","LitElement","changedProperties","event","p","propertyName","attributes","name","old","newValue","rawValue","roundedValue","offsetBigDecimal","Big","clampedValue","oldValue","newRelativeValue","skipColorUpdate","newValueBasedOnRelativeValue","css","unsafeCSS","style","trackBackgroundColor","trackContainerStyle","trackStyle","thumbStyle","html","currentClientX","eventListenersToRemove","pointerMoveListener","pointerUpListener","reg","clientX","previousValue","type","listener","thumbStepForIntegerOffset","thumbPositionError","offset","immediate","__decorateClass","property","Slider"],"mappings":";;;;;AASA,MAAqBA,EAAa;AAAA,EAAlC,cAAA;AACI,SAAQ,kCAAuC,IAAA,GAC/C,KAAQ,sCAA2C,IAAA;AAAA,EAAI;AAAA,EAEvD,IAAW,SAA8B;AACrC,WAAO,KAAK;AAAA,EAChB;AAAA,EAEA,IAAW,OAAOC,GAAgC;AAG9C,QAFA,KAAK,YAAY,MAAA,GACjB,KAAK,kBAAkBA,GACnBA,KAAaA,EAAU,MAAM;AAI7B,UAHwB,MAAM,KAAKA,EAAU,MAAM,EAAE,KAAK,CAACC,MAChDA,IAAQ,KAAKA,IAAQ,CAC/B;AAEG,cAAM;AAAA,UACF;AAAA,QAAA;AAGR,MAAAD,EAAU,QAAQ,CAACC,GAAOC,MAAQ;AAC9B,cAAMC,IAAgB,KAAK,sBAAsBF,CAAK,KAAK,KAAK,eAAeA,CAAK;AACpF,YAAI,OAAO,KAAKE,CAAK,EAAE,WAAW,KAAKA,EAAM,gBAAgB;AACzD,gBAAM,MAAM,yBAAyBF,CAAK,gBAAgB;AAE1D,aAAK,YAAY,IAAIC,GAAKC,CAAK;AAAA,MAEvC,CAAC;AACD,YAAMC,IAAgB,MAAM,KAAK,KAAK,YAAY,QAAA,CAAS,EAAE,KAAA;AAC7D,WAAK,cAAc,IAAI,IAAIA,CAAa;AAAA,IAC5C;AAAA,EACJ;AAAA,EAEO,MAAMC,GAA+B;AACxC,QAAI,CAAC,KAAK,YAAY;AAClB,YAAM,MAAM,mDAAmD;AAEnE,QAAIC,GACAC;AACJ,eAAWC,KAAS,KAAK;AAIrB,UAHKF,MACDA,IAAYE,IAEZA,EAAM,CAAC,IAAIH;AACX,QAAAC,IAAYE;AAAA,eACLA,EAAM,CAAC,MAAMH,GAAe;AACnC,QAAAC,IAAYC,IAAaC;AACzB;AAAA,MACJ,OAAO;AACH,QAAAD,IAAaC;AACb;AAAA,MACJ;AAEJ,IAAKD,MACDA,IAAaD;AAEjB,UAAMG,IAAOF,EAAW,CAAC,IAAID,EAAU,CAAC;AACxC,WAAIG,IACO,KAAK,YAAYH,EAAU,CAAC,GAAGC,EAAW,CAAC,IAAIF,IAAgBC,EAAU,CAAC,KAAKG,CAAI,IAEnF,KAAK,oBAAoBH,EAAU,CAAC,CAAC;AAAA,EAEpD;AAAA,EAEQ,YAAYI,GAAgBC,GAAgBC,GAAqC;AACrF,WAAO,KAAK,oBAAoB;AAAA,MAC5B,KAAK,KAAK,MAAMF,EAAO,OAAOC,EAAO,MAAMD,EAAO,OAAOE,CAAmB;AAAA,MAC5E,OAAO,KAAK,MAAMF,EAAO,SAASC,EAAO,QAAQD,EAAO,SAASE,CAAmB;AAAA,MACpF,MAAM,KAAK,MAAMF,EAAO,QAAQC,EAAO,OAAOD,EAAO,QAAQE,CAAmB;AAAA,MAChF,OAAOF,EAAO,SAASC,EAAO,QAAQD,EAAO,SAASE;AAAA,IAAA,CACzD;AAAA,EACL;AAAA,EAEQ,eAAeC,GAA0B;AAC7C,UAAMV,IAAQW,EAAOD,CAAQ;AAC7B,WAAIV,EAAM,QAAQ,MACdA,EAAM,SAAS,MAEZA;AAAA,EACX;AAAA,EAEQ,sBAAsBY,GAA2B;AACrD,UAAMC,IAAQD,EAAU,MAAM,oEAAoE;AAClG,WAAOC,IACD;AAAA,MACI,KAAK,SAASA,EAAM,CAAC,GAAG,EAAE;AAAA,MAC1B,OAAO,SAASA,EAAM,CAAC,GAAG,EAAE;AAAA,MAC5B,MAAM,SAASA,EAAM,CAAC,GAAG,EAAE;AAAA,MAC3B,OAAO,SAASA,EAAM,CAAC,GAAG,EAAE,KAAK;AAAA,IAAA,IAErC;AAAA,EACV;AAAA,EAEO,eAAeb,GAAec,GAAuB;AACxD,WAAO,KAAK,oBAAoB,KAAK,sBAAsBd,CAAK,GAAGc,CAAK;AAAA,EAC5E;AAAA,EAEQ,oBAAoBd,GAAec,GAAwB;AAC/D,WAAO,QAAQd,EAAM,GAAG,IAAIA,EAAM,KAAK,IAAIA,EAAM,IAAI,IAAIc,KAASd,EAAM,KAAK;AAAA,EACjF;AACJ;;;;;;;ACxDA,MAAqBe,KAArBC,IAAA,cAAoCC,EAAW;AAAA,EA6C3C,cAAc;AACV,UAAA,GA1CJ,KAAQ,gBAAgB,GACxB,KAAQ,SAAS,GACjB,KAAQ,iBAAiB,GAGzB,KAAO,MAAM,GAEb,KAAO,MAAM,GAuBb,KAAQ,eAA6B,IAAIrB,EAAA,GAGzC,KAAQ,YAAoBoB,EAAO,cAU/B,KAAK,iBAAiB,IAAI,eAAe,MAAM;AAC3C,aAAO,sBAAsB,MAAM;AAC/B,QAAI,KAAK,mBAAmB,KAAK,wBAC7B,KAAK,iBAAiB,KAAK,qBAC3B,KAAK,sBAAsB,KAAK,gBAAgB,EAAI;AAAA,MAE5D,CAAC;AAAA,IACL,CAAC;AAAA,EACL;AAAA,EAEO,aAAaE,GAAmB;AACnC,UAAM,aAAaA,CAAiB,GAEpC,KAAK,YAAY,OAAO,WAAW,KAAK,aAAa,OAAO,CAAC,KAAK,KAAK,MAAM,GAE7E,KAAK;AAAA,MACD,KAAK,mBAAmB,eAAe;AAAA,MACvC,CAACC,MAAqC;AAClC,QAAI,CAAC,KAAK,aAAa,UAAU,KAAKA,EAAM,aAAA,EAAe,QAAQ,KAAK,YAAY,MAAM,OACtFA,EAAM,eAAA,GACDA,EAAuB,aACxB,KAAK,kBAAmBA,EAAuB,SAAS,GAE5D,KAAK,MAAA,GACL,KAAK;AAAA,UACAA,EAAuB,WAAYA,EAAqB,eAAe,CAAC,EAAE;AAAA,QAAA;AAAA,MAGvF;AAAA,IAAA,GAEJ,KAAK,iBAAiB,WAAW,KAAK,eAAe,EAAI,GACzD,KAAK,aAAa,iBAAiB,KAAK,IAAI,UAAU,GACtD,KAAK,aAAa,iBAAiB,KAAK,IAAI,UAAU,GACjD,KAAK,aAAa,UAAU,KAC7B,KAAK,aAAa,YAAY,GAAG;AAAA,EAEzC;AAAA,EAEO,oBAAoB;AACvB,UAAM,kBAAA,GACN,CAAC,UAAU,OAAO,OAAO,QAAQ,YAAY,eAAe,OAAO,EAAE,QAAQ,CAACC,MAAM;AAChF,WAAK,gBAAgBA,CAAC;AAAA,IAC1B,CAAC,GACD,KAAK,eAAe,QAAQ,IAAI;AAAA,EACpC;AAAA,EAEO,uBAAuB;AAC1B,UAAM,qBAAA,GACN,KAAK,iBAAiB,QACtB,KAAK,eAAe,WAAA;AAAA,EACxB;AAAA,EAEQ,gBAAgBC,GAA4B;AAChD,QAAI,OAAO,UAAU,eAAe,KAAK,MAAMA,CAAY,GAAG;AAC1D,YAAMvB,IAAQ,KAAKuB,CAAY;AAC/B,aAAO,KAAKA,CAAY,GACxB,KAAKA,CAAY,IAAIvB;AAAA,IACzB;AAAA,EACJ;AAAA,EAEA,WAAW,qBAAqB;AAC5B,UAAMwB,IAAa,MAAM;AACzB,WAAAA,EAAW,KAAK,OAAO,GAChBA;AAAA,EACX;AAAA,EAEA,yBAAyBC,GAAcC,GAAoB1B,GAA4B;AACnF,UAAM,yBAAyByB,GAAMC,GAAK1B,CAAK,IAE1CyB,MAAS,WAAWA,KAAQ,WAAW,KAAK,cAC7C,KAAK,YAAY,OAAO,WAAWzB,CAAK,CAAC;AAAA,EAEjD;AAAA,EAEQ,YAAY2B,GAAkB;AAClC,IAAI,KAAK,iBAAiBA,CAAQ,MAC1B,KAAK,iBACL,KAAK,aAAa,QAAQ,KAAK,eAAA,IAE/B,KAAK,UAAUA,KACf,KAAK,0BAAA;AAAA,EAGjB;AAAA,EAEA,IAAW,QAAgB;AACvB,WAAO,KAAK;AAAA,EAChB;AAAA,EAEA,IAAW,MAAMA,GAAkB;AAE/B,IADmB,KAAK,iBAAiBA,CAAQ,KAE7C,KAAK,0BAAA;AAAA,EAEb;AAAA,EAEQ,YAAYC,GAA0B;AAE1C,QAAIC,IAAe,OAAO,WAAWD,CAAe;AACpD,QAAI,OAAO,MAAMC,CAAY;AACzB,aAAO,KAAK;AAEhB,QAAI,KAAK,QAAQA,KAAgB,KAAK,OAAOA,KAAgB,KAAK,KAAK;AACnE,YAAMC,IAAmB,IAAIC,EAAIF,CAAY,EACxC,MAAM,KAAK,GAAG,EACd,IAAI,KAAK,IAAI,EACb,QACA,IAAI,KAAK,IAAI,EACb,KAAK,KAAK,GAAG;AAClB,MAAAA,IAAe,OAAO,WAAWC,EAAiB,SAAA,CAAU;AAAA,IAChE;AACA,WAAOD;AAAA,EACX;AAAA,EAEQ,iBAAiBF,GAA2B;AAChD,UAAME,IAAe,KAAK,YAAYF,CAAQ,GACxCK,IAAe,KAAK,aAAa,KAAK,IAAI,KAAK,KAAK,KAAK,IAAI,KAAK,KAAKH,CAAY,CAAC,IAAIA;AAC9F,QAAI,KAAK,WAAWG,GAAc;AAC9B,YAAMC,IAAW,KAAK;AACtB,kBAAK,SAASD,GACd,KAAK,iBAAiBA,IAAe,KAAK,QAAQ,KAAK,MAAM,KAAK,MAClE,KAAK,aAAa,iBAAiB,KAAK,OAAO,UAAU,GACzD,KAAK,cAAc,SAASC,CAAQ,GAC7B;AAAA,IACX;AACA,WAAO;AAAA,EACX;AAAA,EAEA,IAAI,gBAAgB;AAChB,WAAO,KAAK;AAAA,EAChB;AAAA,EAEA,IAAI,cAAcC,GAA0B;AACxC,IAAI,KAAK,mBAAmBA,KACxB,KAAK,sBAAsBA,CAAgB;AAAA,EAEnD;AAAA,EAEQ,sBAAsBA,GAA0BC,GAA2B;AAC/E,SAAK,iBAAiBD,GACtB,KAAK,gBAAgB,KAAK,IAAI,KAAK,IAAI,GAAGA,CAAgB,GAAG,CAAC,IAAI,KAAK;AACvE,UAAME,IAA+B,KAAK,OAAO,KAAK,MAAM,KAAK,OAAO,KAAK;AAC7E,SAAK,iBAAiBA,CAA4B,GAC9C,CAACD,KAAmB,KAAK,UAAU,KAAK,OAAO,SAC/C,KAAK,YAAY,KAAK,aAAa,MAAM,KAAK,cAAc;AAAA,EAEpE;AAAA,EAEA,IAAW,SAA8B;AACrC,WAAO,KAAK,aAAa;AAAA,EAC7B;AAAA,EAEA,IAAW,OAAOpC,GAAgC;AAC9C,SAAK,aAAa,SAASA,GACvB,KAAK,UAAU,KAAK,OAAO,OAC3B,KAAK,YAAY,KAAK,aAAa,MAAM,KAAK,cAAc,IAE5D,KAAK,YAAYmB,EAAO;AAAA,EAEhC;AAAA,EAEA,WAAW,SAAS;AAChB,WAAO;AAAA,MACHmB;AAAA,kBACMC,EAAUC,CAAK,CAAC;AAAA;AAAA,IAAA;AAAA,EAG9B;AAAA,EAEO,SAAyB;AAC5B,UAAMC,IAAuB,KAAK,aAAa,eAAe,KAAK,WAAW,IAAI,GAC5EC,IAAsB,oBAAoBD,CAAoB,YAChE,KAAK,WAAW,iDAAiD,GACrE,IACME,IAAa,qBAAqB,KAAK,aAAa,uBAAuB,KAAK,SAAS,KACzFC,IAAa,yBAAyB,KAAK,aAAa,yBAAyB,KAAK,SAAS,kBAAkBH,CAAoB;AAC3I,WAAOI;AAAA,+CACgCH,CAAmB;AAAA,yCACzBC,CAAU;AAAA;AAAA,uCAEZ,KAAK,MAAM,YAAYC,CAAU;AAAA,cAC1D,KAAK,YACPC;AAAA;AAAA,8BAEkB,KAAK,gBAAgB;AAAA,qCACd,KAAK,kBAAkB;AAAA,iCAC3B,KAAK,QAAQ;AAAA,2CACH,KAAK,WAAW;AAAA;AAAA,aAE9C;AAAA,cACC,KAAK,qBACPA;AAAA;AAAA,gCAEoB,KAAK,iBAAiB;AAAA,6BACzB,KAAK,iBAAiB;AAAA,8BACrB,KAAK,eAAe;AAAA;AAAA;AAAA,aAGrC;AAAA;AAAA,EAET;AAAA,EAEQ,iBAAiBC,GAAwB;AAC7C,SAAK,SAAS,IACd,KAAK,cAAcA,CAAc;AAEjC,UAAMC,IAAuD,CAAA,GACvDC,IAAsB,CAAC1B,MAAU;AACnC,MAAAA,EAAM,gBAAA,GACNA,EAAM,eAAA,GACN,KAAK,cAAcA,EAAM,WAAYA,EAAM,kBAAkBA,EAAM,eAAe,CAAC,EAAE,OAAQ;AAAA,IACjG,GACM2B,IAAoB,MAAM;AAC5B,WAAK,SAAS,IACdF,EAAuB,QAAQ,CAACG,MAAQA,EAAI,QAAQ,GACpD,KAAK,gBAAA;AAAA,IACT;AACA,IAAI,KAAK,oBACLH,EAAuB,KAAK,KAAK,wBAAwB,aAAaC,CAAmB,CAAC,GAC1FD,EAAuB,KAAK,KAAK,wBAAwB,YAAYE,CAAiB,CAAC,GACvFF,EAAuB,KAAK,KAAK,wBAAwB,eAAeE,CAAiB,CAAC,MAE1FF,EAAuB,KAAK,KAAK,wBAAwB,eAAeC,CAAmB,CAAC,GAC5FD,EAAuB,KAAK,KAAK,wBAAwB,aAAaE,CAAiB,CAAC;AAAA,EAEhG;AAAA,EAEQ,cAAcE,GAAuB;AACzC,IAAI,KAAK,2BAGT,KAAK,yBAAyB,IAC9B,OAAO,sBAAsB,YAAY;AACrC,WAAK,yBAAyB,IAC9B,KAAK,oBAAoBA,CAAO;AAChC,YAAMC,IAAgB,KAAK;AAC3B,WAAK,gBAAgB,KAAK,gBAAgB,KAAK,qBAC3C,KAAK,kBAAkBA,MACvB,MAAM,KAAK,gBACX,KAAK,gBAAgB,EAAI,GACpB,KAAK,UACN,KAAK,gBAAA;AAAA,IAGjB,CAAC;AAAA,EACL;AAAA,EAEQ,wBAAwBC,GAAcC,GAAqD;AAC/F,kBAAO,iBAAiBD,GAAMC,GAAU,EAAI,GACrC;AAAA,MACH,QAAQ,MAAM;AACV,eAAO,oBAAoBD,GAAMC,GAAU,EAAI;AAAA,MACnD;AAAA,IAAA;AAAA,EAER;AAAA,EAEQ,oBAAoBH,GAAuB;AAK/C,QAJA,KAAK,gBAAgB,KAAK;AAAA,MACtB,KAAK;AAAA,MACL,KAAK,IAAI,GAAGA,IAAU,KAAK,sBAAA,EAAwB,IAAI;AAAA,IAAA,GAEvD,KAAK,MAAM,KAAK,MAAM,GAAG;AAEzB,YAAMI,IAA4B,KAAK,uBAAuB,KAAK,MAAM,KAAK,MACxEC,IAAqB,KAAK,gBAAgBD;AAChD,MAAIC,MACIA,IAAqBD,IAA4B,IACjD,KAAK,iBAAiBC,IAEtB,KAAK,iBAAiBD,IAA4BC;AAAA,IAG9D;AAAA,EACJ;AAAA,EAEQ,mBAAmBlC,GAAoB;AAC3C,SAAK,QAAQ,OAAOA,EAAM,OAAO,MAAM,QAAQ,OAAO,KAAK,uBAAuB,GAAG,GAAG,CAAC,GACrF,OAAO,KAAK,KAAK,MAAM,OAAOA,EAAM,OAAO,KAAK,MAC/CA,EAAM,OAAmB,QAAQ,OAAO,KAAK,KAAK;AAAA,EAE3D;AAAA,EAEQ,iBAAyB;AAC7B,WAAO,KAAK,MAAM,SAAA,EAAW,QAAQ,MAAM,KAAK,yBAAyB;AAAA,EAC7E;AAAA,EAEA,IAAY,0BAAkC;AAC1C,WAAO,KAAK,0BAA0B,QAAQ,4BAA4B,MAAM;AAAA,EACpF;AAAA,EAEA,IAAY,4BAAoC;AAC5C,WAAO,KAAK,oBAA2B,IAAK,eAAe,KAAK,iBAAiB,EAAE,UAAU,GAAG,CAAC;AAAA,EACrG;AAAA,EAEA,IAAY,oBAA4B;AACpC,WAAI,UAAU,aAAa,UAAU,UAAU,SACpC,UAAU,UAAU,CAAC,IAGpB,UAAkB,gBAAgB,UAAU,YAAa,UAAkB,mBAAmB;AAAA,EAE9G;AAAA,EAEQ,cAAcA,GAA4B;AAC9C,QAAI,CAAC,KAAK,aAAa,UAAU,KAAKA,EAAM,aAAA,EAAe,QAAQ,KAAK,YAAY,MAAM,IAAI;AAC1F,UAAImC,IAAS,KAAK,SAAS,KAAK,MAAM,KAAK,OAAO;AAKlD,cAJI,KAAK,MAAM,KAAK,MAAM,MAEtBA,IAAS,KAAK,MAAMA,CAAM,KAAK,IAE3BnC,EAAM,SAAA;AAAA,QACV,KAAK;AAAA,QACL,KAAK;AACD,eAAK,QAAQ,KAAK,IAAI,KAAK,QAAQmC,GAAQ,KAAK,GAAG,GACnDnC,EAAM,eAAA;AACN;AAAA,QACJ,KAAK;AAAA,QACL,KAAK;AACD,eAAK,QAAQ,KAAK,IAAI,KAAK,QAAQmC,GAAQ,KAAK,GAAG,GACnDnC,EAAM,eAAA;AACN;AAAA,MAAA;AAAA,IAEZ;AAAA,EACJ;AAAA,EAEA,IAAY,eAAwB;AAChC,WAAK,KAAK,kBACN,KAAK,gBAAgB,KAAK,WAAW,cAAc,cAAc,IAE9D,KAAK;AAAA,EAChB;AAAA,EAEA,IAAY,iBAA8B;AACtC,WAAK,KAAK,oBACN,KAAK,kBAAkB,KAAK,WAAW,cAAc,kBAAkB,IAEpE,KAAK;AAAA,EAChB;AAAA,EAEA,IAAY,sBAA8B;AACtC,WAAO,KAAK,kBAAkB,KAAK,eAAe;AAAA,EACtD;AAAA,EAEQ,4BAAkC;AACtC,SAAK,gBAAgB,EAAI,GACzB,KAAK,gBAAA;AAAA,EACT;AAAA,EAEQ,gBAAgBoC,GAA2B;AAC/C,SAAK;AAAA,MACD,IAAI,YAA+B,GAAGA,IAAY,eAAe,EAAE,gBAAgB;AAAA,QAC/E,QAAQ,EAAE,OAAO,KAAK,MAAA;AAAA,MAAM,CAC/B;AAAA,IAAA;AAAA,EAET;AAAA,EAEQ,iBAA0B;AAC9B,WAAO,KAAK,aAAa,kBAAkB;AAAA,EAC/C;AACJ,GArZIvC,EAAuB,KAAK,iBAkC5BA,EAAe,eAAe,qBAnClCA;AAIYwC,EAAA;AAAA,EADPC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GAHT1C,EAIT,WAAA,eAAA;AAKDyC,EAAA;AAAA,EADNC,EAAS,EAAE,MAAM,QAAQ,SAAS,IAAM;AAAA,GARxB1C,EASV,WAAA,KAAA;AAEAyC,EAAA;AAAA,EADNC,EAAS,EAAE,MAAM,QAAQ,SAAS,IAAM;AAAA,GAVxB1C,EAWV,WAAA,KAAA;AAEAyC,EAAA;AAAA,EADNC,EAAS,EAAE,MAAM,QAAQ,SAAS,IAAM;AAAA,GAZxB1C,EAaV,WAAA,MAAA;AAEAyC,EAAA;AAAA,EADNC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GAdzB1C,EAeV,WAAA,UAAA;AAEAyC,EAAA;AAAA,EADNC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GAhBzB1C,EAiBV,WAAA,YAAA;AAEAyC,EAAA;AAAA,EADNC,EAAS,EAAE,MAAM,QAAQ,SAAS,IAAM;AAAA,GAlBxB1C,EAmBV,WAAA,aAAA;AAEAyC,EAAA;AAAA,EADNC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GApBzB1C,EAqBV,WAAA,UAAA;AAEAyC,EAAA;AAAA,EADNC,EAAS,EAAE,MAAM,QAAQ,WAAW,IAAM;AAAA,GAtB1B1C,EAuBV,WAAA,mBAAA;AAEAyC,EAAA;AAAA,EADNC,EAAS,EAAE,MAAM,QAAQ,WAAW,IAAM;AAAA,GAxB1B1C,EAyBV,WAAA,mBAAA;AAEAyC,EAAA;AAAA,EADNC,EAAS,EAAE,MAAM,QAAQ,WAAW,IAAM;AAAA,GA1B1B1C,EA2BV,WAAA,iBAAA;AAEAyC,EAAA;AAAA,EADNC,EAAS,EAAE,MAAM,QAAQ,WAAW,IAAM;AAAA,GA5B1B1C,EA6BV,WAAA,kBAAA;AAGCyC,EAAA;AAAA,EADPC,EAAS,EAAE,MAAM,QAAA,CAAS;AAAA,GA/BV1C,EAgCT,WAAA,QAAA;AAKAyC,EAAA;AAAA,EADPC,EAAA;AAAS,GApCO1C,EAqCT,WAAA,WAAA;AArCZ,IAAqB2C,IAArB3C;AAwZK,eAAe,IAAI2C,EAAO,EAAE,KAC7B,eAAe,OAAOA,EAAO,IAAIA,CAAM;"}

package/npm-third-party-licenses.json

@@ -1,10 +1,15 @@
 {
-    "@cypress/vite-dev-server@5.0.7": {
+    "@cypress/vite-dev-server@7.0.0": {
         "licenses": "MIT",
         "repository": "https://github.com/cypress-io/cypress",
         "licenseUrl": "https://github.com/cypress-io/cypress/tree/develop/npm/vite-dev-server#readme"
     },
-    "@rollup/plugin-node-resolve@15.2.3": {
+    "@eslint/js@9.34.0": {
+        "licenses": "MIT",
+        "repository": "https://github.com/eslint/eslint",
+        "licenseUrl": "https://github.com/eslint/eslint/raw/HEAD/LICENSE"
+    },
+    "@rollup/plugin-node-resolve@16.0.1": {
         "licenses": "MIT",
         "repository": "https://github.com/rollup/plugins",
         "licenseUrl": "https://github.com/rollup/plugins/raw/HEAD/LICENSE"
@@ -14,7 +19,7 @@
         "repository": "https://github.com/DefinitelyTyped/DefinitelyTyped",
         "licenseUrl": "https://github.com/DefinitelyTyped/DefinitelyTyped/raw/HEAD/LICENSE"
     },
-    "@types/node@20.10.6": {
+    "@types/node@24.3.0": {
         "licenses": "MIT",
         "repository": "https://github.com/DefinitelyTyped/DefinitelyTyped",
         "licenseUrl": "https://github.com/DefinitelyTyped/DefinitelyTyped/raw/HEAD/LICENSE"
@@ -24,52 +29,47 @@
         "repository": "https://github.com/DefinitelyTyped/DefinitelyTyped",
         "licenseUrl": "https://github.com/DefinitelyTyped/DefinitelyTyped/raw/HEAD/LICENSE"
     },
-    "@typescript-eslint/eslint-plugin@6.17.0": {
+    "@typescript-eslint/eslint-plugin@8.41.0": {
         "licenses": "MIT",
         "repository": "https://github.com/typescript-eslint/typescript-eslint",
         "licenseUrl": "https://github.com/typescript-eslint/typescript-eslint/raw/HEAD/LICENSE"
     },
-    "@typescript-eslint/parser@6.17.0": {
-        "licenses": "BSD-2-Clause",
+    "@typescript-eslint/parser@8.41.0": {
+        "licenses": "MIT",
         "repository": "https://github.com/typescript-eslint/typescript-eslint",
         "licenseUrl": "https://github.com/typescript-eslint/typescript-eslint/raw/HEAD/LICENSE"
     },
-    "@vitest/coverage-v8@1.1.1": {
+    "@vitest/coverage-v8@3.2.4": {
         "licenses": "MIT",
         "repository": "https://github.com/vitest-dev/vitest",
         "licenseUrl": "https://github.com/vitest-dev/vitest/raw/HEAD/LICENSE"
     },
-    "@vitest/ui@1.1.1": {
+    "@vitest/ui@3.2.4": {
         "licenses": "MIT",
         "repository": "https://github.com/vitest-dev/vitest",
         "licenseUrl": "https://github.com/vitest-dev/vitest/raw/HEAD/LICENSE"
     },
-    "axe-core@4.8.3": {
+    "axe-core@4.10.3": {
         "licenses": "MPL-2.0",
         "repository": "https://github.com/dequelabs/axe-core",
         "licenseUrl": "https://github.com/dequelabs/axe-core/raw/HEAD/LICENSE"
     },
-    "big.js@6.2.1": {
+    "big.js@7.0.1": {
         "licenses": "MIT",
         "repository": "https://github.com/MikeMcl/big.js",
         "licenseUrl": "https://github.com/MikeMcl/big.js/raw/HEAD/LICENCE.md"
     },
-    "cypress-axe@1.5.0": {
+    "cypress-axe@1.7.0": {
         "licenses": "MIT",
         "repository": "https://github.com/component-driven/cypress-axe",
         "licenseUrl": "https://github.com/component-driven/cypress-axe/raw/HEAD/License.md"
     },
-    "cypress-real-events@1.13.0": {
-        "licenses": "MIT",
-        "repository": "https://github.com/dmtrKovalenko/cypress-real-events",
-        "licenseUrl": "https://github.com/dmtrKovalenko/cypress-real-events"
-    },
-    "cypress@13.6.2": {
+    "cypress@15.0.0": {
         "licenses": "MIT",
         "repository": "https://github.com/cypress-io/cypress",
         "licenseUrl": "https://cypress.io"
     },
-    "esbuild@0.19.11": {
+    "esbuild@0.25.9": {
         "licenses": "MIT",
         "repository": "https://github.com/evanw/esbuild",
         "licenseUrl": "https://github.com/evanw/esbuild/raw/HEAD/LICENSE.md"
@@ -79,17 +79,17 @@
         "repository": "https://github.com/google/eslint-config-google",
         "licenseUrl": "https://github.com/google/eslint-config-google/raw/HEAD/LICENSE"
     },
-    "eslint-config-prettier@9.1.0": {
+    "eslint-config-prettier@10.1.8": {
         "licenses": "MIT",
         "repository": "https://github.com/prettier/eslint-config-prettier",
         "licenseUrl": "https://github.com/prettier/eslint-config-prettier/raw/HEAD/LICENSE"
     },
-    "eslint@8.56.0": {
+    "eslint@9.34.0": {
         "licenses": "MIT",
         "repository": "https://github.com/eslint/eslint",
         "licenseUrl": "https://github.com/eslint/eslint/raw/HEAD/LICENSE"
     },
-    "github-markdown-css@5.5.0": {
+    "github-markdown-css@5.8.1": {
         "licenses": "MIT",
         "repository": "https://github.com/sindresorhus/github-markdown-css",
         "licenseUrl": "https://github.com/sindresorhus/github-markdown-css/raw/HEAD/license"
@@ -99,42 +99,42 @@
         "repository": "https://github.com/sindresorhus/hex-rgb",
         "licenseUrl": "https://github.com/sindresorhus/hex-rgb/raw/HEAD/license"
     },
-    "highlight.js@11.9.0": {
+    "highlight.js@11.11.1": {
         "licenses": "BSD-3-Clause",
         "repository": "https://github.com/highlightjs/highlight.js",
         "licenseUrl": "https://github.com/highlightjs/highlight.js/raw/HEAD/LICENSE"
     },
-    "junit-report-builder@3.1.0": {
+    "junit-report-builder@5.1.1": {
         "licenses": "MIT",
         "repository": "https://github.com/davidparsson/junit-report-builder",
         "licenseUrl": "https://github.com/davidparsson/junit-report-builder/raw/HEAD/LICENSE"
     },
-    "lint-staged@15.2.0": {
+    "lint-staged@16.1.5": {
         "licenses": "MIT",
-        "repository": "https://github.com/okonet/lint-staged",
-        "licenseUrl": "https://github.com/okonet/lint-staged/raw/HEAD/LICENSE"
+        "repository": "https://github.com/lint-staged/lint-staged",
+        "licenseUrl": "https://github.com/lint-staged/lint-staged/raw/HEAD/LICENSE"
     },
-    "lit@2.8.0": {
+    "lit@3.3.1": {
         "licenses": "BSD-3-Clause",
         "repository": "https://github.com/lit/lit",
         "licenseUrl": "https://github.com/lit/lit/raw/HEAD/LICENSE"
     },
-    "marked@11.1.1": {
+    "marked@16.2.1": {
         "licenses": "MIT",
         "repository": "https://github.com/markedjs/marked",
         "licenseUrl": "https://github.com/markedjs/marked/raw/HEAD/LICENSE.md"
     },
-    "postcss-prefix-selector@1.16.0": {
+    "postcss-prefix-selector@2.1.1": {
         "licenses": "MIT",
         "repository": "https://github.com/RadValentin/postcss-prefix-selector",
         "licenseUrl": "https://github.com/RadValentin/postcss-prefix-selector/raw/HEAD/LICENSE"
     },
-    "postcss@8.4.32": {
+    "postcss@8.5.6": {
         "licenses": "MIT",
         "repository": "https://github.com/postcss/postcss",
         "licenseUrl": "https://github.com/postcss/postcss/raw/HEAD/LICENSE"
     },
-    "prettier@3.1.1": {
+    "prettier@3.6.2": {
         "licenses": "MIT",
         "repository": "https://github.com/prettier/prettier",
         "licenseUrl": "https://github.com/prettier/prettier/raw/HEAD/LICENSE"
@@ -144,62 +144,67 @@
         "repository": "https://github.com/sindresorhus/resolve-pkg",
         "licenseUrl": "https://github.com/sindresorhus/resolve-pkg/raw/HEAD/license"
     },
-    "sass@1.69.6": {
+    "sass@1.91.0": {
         "licenses": "MIT",
         "repository": "https://github.com/sass/dart-sass",
         "licenseUrl": "https://github.com/sass/dart-sass/raw/HEAD/LICENSE"
     },
-    "stylelint-config-recommended-scss@14.0.0": {
+    "stylelint-config-recommended-scss@16.0.0": {
         "licenses": "MIT",
         "repository": "https://github.com/stylelint-scss/stylelint-config-recommended-scss",
         "licenseUrl": "https://github.com/stylelint-scss/stylelint-config-recommended-scss/raw/HEAD/LICENSE"
     },
-    "stylelint-config-standard@36.0.0": {
+    "stylelint-config-standard@39.0.0": {
         "licenses": "MIT",
         "repository": "https://github.com/stylelint/stylelint-config-standard",
         "licenseUrl": "https://github.com/stylelint/stylelint-config-standard/raw/HEAD/LICENSE"
     },
-    "stylelint-scss@6.0.0": {
+    "stylelint-scss@6.12.1": {
         "licenses": "MIT",
         "repository": "https://github.com/stylelint-scss/stylelint-scss",
         "licenseUrl": "https://github.com/stylelint-scss/stylelint-scss/raw/HEAD/LICENSE"
     },
-    "stylelint@16.1.0": {
+    "stylelint@16.23.1": {
         "licenses": "MIT",
         "repository": "https://github.com/stylelint/stylelint",
         "licenseUrl": "https://github.com/stylelint/stylelint/raw/HEAD/LICENSE"
     },
-    "tsup@8.0.1": {
+    "tsup@8.5.0": {
         "licenses": "MIT",
         "repository": "https://github.com/egoist/tsup",
         "licenseUrl": "https://github.com/egoist/tsup/raw/HEAD/LICENSE"
     },
-    "turbo@1.11.2": {
-        "licenses": "MPL-2.0",
-        "repository": "https://github.com/vercel/turbo",
-        "licenseUrl": "https://github.com/vercel/turbo/raw/HEAD/LICENSE"
+    "turbo@2.5.6": {
+        "licenses": "MIT",
+        "repository": "https://github.com/vercel/turborepo",
+        "licenseUrl": "https://github.com/vercel/turborepo/raw/HEAD/LICENSE"
+    },
+    "typescript-eslint@8.41.0": {
+        "licenses": "MIT",
+        "repository": "https://github.com/typescript-eslint/typescript-eslint",
+        "licenseUrl": "https://github.com/typescript-eslint/typescript-eslint/raw/HEAD/LICENSE"
     },
-    "typescript@5.3.3": {
+    "typescript@5.9.2": {
         "licenses": "Apache-2.0",
-        "repository": "https://github.com/Microsoft/TypeScript",
-        "licenseUrl": "https://github.com/Microsoft/TypeScript/raw/HEAD/LICENSE.txt"
+        "repository": "https://github.com/microsoft/TypeScript",
+        "licenseUrl": "https://github.com/microsoft/TypeScript/raw/HEAD/LICENSE.txt"
     },
-    "vite-tsconfig-paths@4.2.3": {
+    "vite-tsconfig-paths@5.1.4": {
         "licenses": "MIT",
         "repository": "https://github.com/aleclarson/vite-tsconfig-paths",
         "licenseUrl": "https://github.com/aleclarson/vite-tsconfig-paths/raw/HEAD/LICENSE"
     },
-    "vite@5.0.10": {
+    "vite@7.1.3": {
         "licenses": "MIT",
         "repository": "https://github.com/vitejs/vite",
         "licenseUrl": "https://github.com/vitejs/vite/raw/HEAD/LICENSE.md"
     },
-    "vitest@1.1.1": {
+    "vitest@3.2.4": {
         "licenses": "MIT",
         "repository": "https://github.com/vitest-dev/vitest",
         "licenseUrl": "https://github.com/vitest-dev/vitest/raw/HEAD/LICENSE.md"
     },
-    "yargs@17.7.2": {
+    "yargs@18.0.0": {
         "licenses": "MIT",
         "repository": "https://github.com/yargs/yargs",
         "licenseUrl": "https://github.com/yargs/yargs/raw/HEAD/LICENSE"

package/package.json

@@ -1,22 +1,22 @@
 {
   "name": "@cas-smartdesign/lit-slider",
-  "version": "7.1.0",
+  "version": "7.2.0",
   "description": "A slider element based on LitElement & material components",
   "main": "dist/slider-with-externals.js",
   "module": "dist/slider.mjs",
   "license": "SEE LICENSE IN LICENSE",
   "types": "dist/slider.d.ts",
   "dependencies": {
-    "big.js": "^6.2.1",
+    "big.js": "^7.0.1",
     "hex-rgb": "^5.0.0",
-    "lit": "^2.8.0",
-    "@cas-smartdesign/field-validation-message": "^5.0.2",
-    "@cas-smartdesign/lit-input": "^7.2.1"
+    "lit": "^3.3.1",
+    "@cas-smartdesign/lit-input": "^7.4.0",
+    "@cas-smartdesign/field-validation-message": "^5.1.0"
   },
   "devDependencies": {
     "@types/big.js": "^6.2.2",
-    "@cas-smartdesign/element-preview": "^0.2.2",
-    "@cas-smartdesign/license-generator": "^1.6.3"
+    "@cas-smartdesign/element-preview": "^0.3.0",
+    "@cas-smartdesign/license-generator": "^1.7.0"
   },
   "files": [
     "dist",

package/readme.md

@@ -21,7 +21,9 @@ The following properties are available:
 - `max` **_number (default=1)_**
   - reflects the corresponding attribute
 - `step` **_number (default=undefined)_**
-  - reflects the corresponding attribute, if undefined then the _(max-min)/100_ value is used
+  - Reflects the corresponding attribute, if undefined then the _(max - min) / 100_ value is used.
+  - Valid values are defined based on the `min` value and increments of the `step` value, up to the `max` value.
+  - If difference between `min` and `max` is bigger than 1, only steps larger than 1 are supported on user interactions done directly on the slider part.
 - `colors` **_Map<number, string> (default=empty)_**
   - A relative-value -> color mapping which can be used to configure a color blending mode for the slider. For further details check the examples.
 - `editable` **_boolean (default=false)_**