@cas-smartdesign/lit-slider 7.0.5 → 7.1.0

package/dist/slider.d.ts

@@ -29,6 +29,7 @@ export default class Slider extends LitElement {
     max: number;
     step: number;
     editable: boolean;
+    clampValue: boolean;
     inputSuffix: string;
     disabled: boolean;
     validationMessage: string;

package/dist/slider.mjs

@@ -1,8 +1,8 @@
-import { LitElement as p, css as g, unsafeCSS as v, html as d } from "lit";
+import { LitElement as p, css as g, unsafeCSS as m, html as d } from "lit";
 import { property as o } from "lit/decorators/property.js";
-import f from "hex-rgb";
+import v from "hex-rgb";
 import "@cas-smartdesign/lit-input";
-import { Big as m } from "big.js";
+import { Big as f } from "big.js";
 class b {
   constructor() {
     this._rgbaColors = /* @__PURE__ */ new Map(), this._originalColors = /* @__PURE__ */ new Map();
@@ -53,7 +53,7 @@ class b {
     });
   }
   convertFromHex(t) {
-    const e = f(t);
+    const e = v(t);
     return e.alpha > 1 && (e.alpha /= 255), e;
   }
   convertFromRGBAString(t) {
@@ -128,16 +128,16 @@ const a = (l = class extends p {
     if (Number.isNaN(e))
       return this._value;
     if (this.step) {
-      const i = m(e).div(this.step).round().mul(this.step);
+      const i = f(e).div(this.step).round().mul(this.step);
       e = Number.parseFloat(i.toString());
     }
     return e;
   }
   setValueInternal(t) {
-    const e = this.roundToStep(t);
-    if (this._value !== e) {
-      const i = this._value;
-      return this._value = e, this.relativeValue = (e - this.min) / (this.max - this.min), this.setAttribute("aria-valuenow", this._value.toString()), this.requestUpdate("value", i), !0;
+    const e = this.roundToStep(t), i = this.clampValue ? Math.max(this.min, Math.min(this.max, e)) : e;
+    if (this._value !== i) {
+      const r = this._value;
+      return this._value = i, this.relativeValue = (i - this.min) / (this.max - this.min), this.setAttribute("aria-valuenow", this._value.toString()), this.requestUpdate("value", r), !0;
     }
     return !1;
   }
@@ -161,7 +161,7 @@ const a = (l = class extends p {
   static get styles() {
     return [
       g`
-                ${v(C)}
+                ${m(C)}
             `
     ];
   }
@@ -290,6 +290,9 @@ n([
 n([
   o({ type: Boolean, reflect: !0 })
 ], a.prototype, "editable", 2);
+n([
+  o({ type: Boolean, reflect: !0 })
+], a.prototype, "clampValue", 2);
 n([
   o({ type: String, reflect: !0 })
 ], a.prototype, "inputSuffix", 2);

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: 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        if (this._value !== roundedValue) {\n            const oldValue = this._value;\n            this._value = roundedValue;\n            this.relativeValue = (roundedValue - 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","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.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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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cas-smartdesign/lit-slider",
-  "version": "7.0.5",
+  "version": "7.1.0",
   "description": "A slider element based on LitElement & material components",
   "main": "dist/slider-with-externals.js",
   "module": "dist/slider.mjs",
@@ -11,12 +11,12 @@
     "hex-rgb": "^5.0.0",
     "lit": "^2.8.0",
     "@cas-smartdesign/field-validation-message": "^5.0.2",
-    "@cas-smartdesign/lit-input": "^7.1.4"
+    "@cas-smartdesign/lit-input": "^7.2.1"
   },
   "devDependencies": {
     "@types/big.js": "^6.2.2",
-    "@cas-smartdesign/license-generator": "^1.6.3",
-    "@cas-smartdesign/element-preview": "^0.2.2"
+    "@cas-smartdesign/element-preview": "^0.2.2",
+    "@cas-smartdesign/license-generator": "^1.6.3"
   },
   "files": [
     "dist",

package/readme.md

@@ -8,7 +8,7 @@ The main entry point requires ES6 & support for Custom Elements v1
 
 ## Attributes
 
-The following attributes are supported: `min`, `max`, `value`, `step`, `editable`, `inputSuffix`, `disabled` & `hidden`
+The following attributes are supported: `min`, `max`, `value`, `step`, `editable`, `clampValue`, `inputSuffix`, `disabled` & `hidden`
 
 ## Properties
 
@@ -26,6 +26,8 @@ The following properties are available:
   - 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)_**
   - If set to true then a value `lit-input` is shown next to the track container.
+- `clampValue` **_boolean (default=false)_**
+  - If set to true, the value is clamped according to the limits of min and max.
 - `inputSuffix` **_string (default=undefined)_**
   - A suffix text can be defined for the value field which is turned on via editable flag.
 - `disabled` **_boolean (default=false)_**