@duetds/components 10.0.0-alpha.8 → 10.0.0

package/lib/dist-custom-elements/duet-range-slider.d.ts

@@ -1,11 +0,0 @@
-import type { Components, JSX } from "../types/components";
-
-interface DuetRangeSlider extends Components.DuetRangeSlider, HTMLElement {}
-export const DuetRangeSlider: {
-    prototype: DuetRangeSlider;
-    new (): DuetRangeSlider;
-};
-/**
- * Used to define this component and all nested components recursively.
- */
-export const defineCustomElement: () => void;

package/lib/dist-custom-elements/duet-range-slider.js

@@ -1,181 +0,0 @@
-/*!
- * Built with Duet Design System
- */
-import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-1080a6c7.js';
-import { G as colorPrimaryTurva, H as colorGrayTurva, C as colorPrimary, I as colorGray } from './p-cea716f7.js';
-import { D as DuetInternalLabel } from './p-42619f94.js';
-import { i as inheritGlobalTheme } from './p-aaa7a7bd.js';
-import { c as createID } from './p-5e59e970.js';
-import { i as isInternetExplorer } from './p-43b89e38.js';
-import { s as subscribeTabbingChange, u as unsubscribeTabbingChange } from './p-8db11326.js';
-import { p as proxyInputToSlot } from './p-ad615991.js';
-
-const duetRangeSliderCss = ".duet-internal-label{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-bottom:12px !important;position:relative;z-index:100;display:inline-flex;width:auto;margin-top:8px !important;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:1rem;font-weight:600 !important;line-height:1.25;line-height:1.25;color:rgb(8, 42, 77);text-align:left;word-break:break-word;cursor:default}.duet-internal-label.duet-p-0{padding:0 !important}.duet-internal-label.duet-m-0{margin:0 !important}.duet-internal-label span{font-size:1rem;font-weight:600 !important;word-break:break-word}.duet-internal-label.duet-m-0{margin-bottom:0 !important}.duet-internal-label.duet-small-margin{margin-top:8px !important;margin-bottom:4px !important}.duet-internal-label.duet-has-tooltip{padding-right:48px}@media (min-width: 48em){.duet-internal-label.duet-has-tooltip{padding-right:0}}.duet-internal-label.duet-internal-label-small{font-size:0.875rem}.duet-internal-label.duet-internal-label-small span{font-size:0.875rem}.duet-internal-label.duet-weight-normal{font-weight:400 !important}.duet-internal-label.duet-weight-normal span{font-weight:400 !important}.duet-internal-label.duet-theme-turva{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(23, 28, 58)}*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-right:16px !important;margin-bottom:12px !important;display:inline-flex;width:100%;max-width:100%;text-align:left;vertical-align:bottom}:host:last-child,:host:last-of-type{margin-right:0 !important}@media (min-width: 36em){:host{width:calc(50% - 16px - 3px)}:host.duet-expand{width:100% !important}}:host(.duet-m-0){margin:0 !important}.duet-range-container{position:relative;width:100%}.duet-output{position:absolute;top:12px;right:0;z-index:200;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:0.875rem;font-weight:400;font-variant-numeric:tabular-nums;line-height:1.25;color:rgb(8, 42, 77);background:rgb(255, 255, 255)}.duet-theme-turva .duet-output{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(23, 28, 58)}.duet-range-disabled .duet-output{color:rgb(127, 150, 165)}.duet-range-disabled.duet-theme-turva .duet-output{color:rgb(143, 147, 158)}.duet-range{position:relative;z-index:100;width:100%;height:4px;background:rgb(181, 198, 208);border-radius:4px}.duet-theme-turva .duet-range{background:rgb(199, 202, 207)}.duet-ie .duet-range{display:block;width:auto;height:26px;background:transparent !important}.duet-range::-moz-range-track{height:1px;background:transparent !important;border:0;-moz-appearance:none}.duet-range::-ms-track{color:transparent;background:transparent;border:0}.duet-range:focus,.duet-range:active{outline:0}:host(.user-is-tabbing) .duet-range:focus{box-shadow:0 0 0 1px #fff, 0 0 0 3px rgba(0, 119, 179, 0.75)}:host(.user-is-tabbing) .duet-theme-turva .duet-range:focus{box-shadow:0 0 0 1px #fff, 0 0 0 3px rgba(23, 28, 58, 0.75)}.duet-range::-webkit-slider-runnable-track{background:transparent}.duet-range::-webkit-slider-thumb{position:relative;width:24px;height:24px;cursor:-webkit-grab;background:rgb(255, 255, 255);border:1px solid rgb(127, 150, 165);border-radius:50%;transition:box-shadow 300ms ease;-webkit-appearance:none}.duet-theme-turva .duet-range::-webkit-slider-thumb{border-color:rgb(143, 147, 158)}.duet-range:active::-webkit-slider-thumb{cursor:-webkit-grabbing}.duet-range::-moz-range-thumb{position:relative;width:24px;height:24px;cursor:-moz-grab;background:rgb(255, 255, 255);border:1px solid rgb(127, 150, 165);border-radius:50%;appearance:none}.duet-theme-turva .duet-range::-moz-range-thumb{border-color:rgb(143, 147, 158)}.duet-range:active::-moz-range-thumb{cursor:-moz-grabbing}.duet-range::-ms-thumb{position:relative;width:24px;height:24px;overflow:visible;background:rgb(255, 255, 255);border:1px solid rgb(127, 150, 165);border-radius:50%}.duet-theme-turva .duet-range::-ms-thumb{border-color:rgb(143, 147, 158)}.duet-range:disabled{background:rgb(181, 198, 208) !important}.duet-theme-turva .duet-range:disabled{background:rgb(199, 202, 207) !important}.duet-range:disabled::-webkit-slider-thumb{cursor:default;background:rgb(181, 198, 208);border-color:transparent}.duet-theme-turva .duet-range:disabled::-webkit-slider-thumb{background:rgb(199, 202, 207);border-color:transparent}.duet-range:disabled::-moz-range-thumb{cursor:default;background:rgb(181, 198, 208);border-color:transparent}.duet-theme-turva .duet-range:disabled::-moz-range-thumb{background:rgb(199, 202, 207);border-color:transparent}.duet-range:disabled::-ms-thumb{cursor:default;background:rgb(181, 198, 208);border-color:transparent}.duet-theme-turva .duet-range:disabled::-ms-thumb{background:rgb(199, 202, 207);border-color:transparent}.duet-range::-ms-fill-lower{height:4px;background:rgb(0, 119, 179)}.duet-theme-turva .duet-range::-ms-fill-lower{background:rgb(198, 12, 48)}.duet-range::-ms-fill-upper{height:4px;background:rgb(181, 198, 208)}.duet-theme-turva .duet-range::-ms-fill-upper{background:rgb(199, 202, 207)}.duet-label-hidden .duet-internal-label,.duet-label-hidden output{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);border:0}";
-const DuetRangeSliderStyle0 = duetRangeSliderCss;
-
-const colors = {
-    turva: {
-        active: colorPrimaryTurva,
-        inactive: colorGrayTurva,
-    },
-    default: {
-        active: colorPrimary,
-        inactive: colorGray,
-    },
-};
-const DuetRangeSlider$1 = /*@__PURE__*/ proxyCustomElement(class DuetRangeSlider extends H {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-        this.duetChange = createEvent(this, "duetChange", 3);
-        this.duetInput = createEvent(this, "duetInput", 7);
-        /**
-         * Own Properties
-         */
-        this.rangeId = createID("DuetRange");
-        this.proxyId = createID("DuetRange");
-        /**
-         * Component event handling.
-         */
-        this.onInput = (ev) => {
-            const input = ev.target;
-            if (input) {
-                this.value = parseFloat(input.value) || 0;
-            }
-            this.duetInput.emit({
-                originalEvent: ev,
-                value: this.value,
-                component: "duet-range-slider",
-            });
-        };
-        this.onChange = (ev) => {
-            const input = ev.target;
-            if (input) {
-                this.value = parseFloat(input.value) || 0;
-            }
-            clearTimeout(this.timeoutId);
-            this.timeoutId = setTimeout(() => {
-                this.duetChange.emit({
-                    originalEvent: ev,
-                    value: this.value,
-                    component: "duet-range-slider",
-                });
-            }, this.debounce);
-        };
-        this.theme = "";
-        this.margin = "auto";
-        this.expand = false;
-        this.identifier = undefined;
-        this.name = undefined;
-        this.required = false;
-        this.disabled = false;
-        this.accessibleActiveDescendant = undefined;
-        this.accessibleControls = undefined;
-        this.accessibleOwns = undefined;
-        this.accessibleDescribedBy = undefined;
-        this.min = 0;
-        this.label = "label";
-        this.labelColor = undefined;
-        this.labelWeight = undefined;
-        this.labelHidden = false;
-        this.unit = "";
-        this.max = 100;
-        this.step = 1;
-        this.locale = "fi-FI";
-        this.value = 0;
-        this.debounce = 0;
-    }
-    /**
-     * Component lifecycle events.
-     */
-    componentWillLoad() {
-        inheritGlobalTheme(this);
-    }
-    connectedCallback() {
-        subscribeTabbingChange(this);
-    }
-    disconnectedCallback() {
-        unsubscribeTabbingChange(this);
-    }
-    componentDidRender() {
-        proxyInputToSlot(this.element, this.proxyId, this.name, this.value, this.required);
-    }
-    /**
-     * Sets focus on the specified `duet-range-slider`. Use this method instead of the global
-     * `input.focus()`.
-     */
-    async setFocus(options) {
-        this.nativeInput.focus(options);
-    }
-    /**
-     * Local methods.
-     */
-    calculatePercentage() {
-        return ((this.value - this.min) / (this.max - this.min)) * 100;
-    }
-    /**
-     * render() function
-     * Always the last one in the class.
-     */
-    render() {
-        const identifier = this.identifier || this.rangeId;
-        const theme = this.theme === "turva" ? "turva" : "default";
-        const { inactive, active } = colors[theme];
-        const percentage = this.calculatePercentage();
-        const rangeStyles = {
-            background: `-webkit-linear-gradient(left,${active} 0%,${active} ${percentage}%,${inactive} ${percentage}%)`,
-        };
-        return (h(Host, { key: 'e492b2000ff8e296f160a11172b5c4d67a2f432f', class: { "duet-m-0": this.margin === "none", "duet-expand": this.expand } }, h("div", { key: '3a79a8f3ba99b41f30550759779722373bac1168', class: {
-                "duet-range-container": true,
-                "duet-label-hidden": this.labelHidden,
-                "duet-theme-turva": this.theme === "turva",
-                "duet-ie": isInternetExplorer(),
-                "duet-range-disabled": this.disabled,
-            } }, h(DuetInternalLabel, { key: '6f9fc72159b9cf05a15b41a6fd11931ebb12b6aa', theme: theme, color: this.labelColor, weight: this.labelWeight, margin: "small", for: identifier }, this.label), h("output", { key: 'f196b801a06366d9dd849a5e1ae989aad659c26a', "aria-hidden": "true", htmlFor: identifier, class: "duet-output" }, this.value.toLocaleString(this.locale), this.unit), h("input", { key: 'b5bcfd42814e62d2107cea6b3e3ecbcc7bcfac98', onInput: this.onInput, onChange: this.onChange, ref: input => (this.nativeInput = input), type: "range", min: this.min, max: this.max, step: this.step, value: this.value, style: rangeStyles, "aria-valuemin": this.min, "aria-valuemax": this.max, "aria-valuenow": this.value, "aria-valuetext": `${this.value} ${this.unit}`, "aria-controls": this.accessibleControls, "aria-activedescendant": this.accessibleActiveDescendant, "aria-owns": this.accessibleOwns, "aria-describedby": this.accessibleDescribedBy, id: identifier, name: this.name, disabled: this.disabled, required: this.required, class: "duet-range" }))));
-    }
-    get element() { return this; }
-    static get style() { return DuetRangeSliderStyle0; }
-}, [1, "duet-range-slider", {
-        "theme": [1025],
-        "margin": [1],
-        "expand": [4],
-        "identifier": [1],
-        "name": [1],
-        "required": [4],
-        "disabled": [516],
-        "accessibleActiveDescendant": [1, "accessible-active-descendant"],
-        "accessibleControls": [1, "accessible-controls"],
-        "accessibleOwns": [1, "accessible-owns"],
-        "accessibleDescribedBy": [1, "accessible-described-by"],
-        "min": [2],
-        "label": [1],
-        "labelColor": [1025, "label-color"],
-        "labelWeight": [1025, "label-weight"],
-        "labelHidden": [4, "label-hidden"],
-        "unit": [1],
-        "max": [2],
-        "step": [2],
-        "locale": [1],
-        "value": [1026],
-        "debounce": [2],
-        "setFocus": [64]
-    }]);
-function defineCustomElement$1() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["duet-range-slider"];
-    components.forEach(tagName => { switch (tagName) {
-        case "duet-range-slider":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, DuetRangeSlider$1);
-            }
-            break;
-    } });
-}
-
-const DuetRangeSlider = DuetRangeSlider$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { DuetRangeSlider, defineCustomElement };

package/lib/dist-custom-elements/duet-range-stepper.d.ts

@@ -1,11 +0,0 @@
-import type { Components, JSX } from "../types/components";
-
-interface DuetRangeStepper extends Components.DuetRangeStepper, HTMLElement {}
-export const DuetRangeStepper: {
-    prototype: DuetRangeStepper;
-    new (): DuetRangeStepper;
-};
-/**
- * Used to define this component and all nested components recursively.
- */
-export const defineCustomElement: () => void;

package/lib/dist-custom-elements/duet-range-stepper.js

@@ -1,234 +0,0 @@
-/*!
- * Built with Duet Design System
- */
-import { p as proxyCustomElement, H, c as createEvent, h } from './p-1080a6c7.js';
-import { i as inheritGlobalTheme } from './p-aaa7a7bd.js';
-import { c as createID } from './p-5e59e970.js';
-import { j as isArrowLeftKey, f as isArrowUpKey, o as isMinusKey, m as isArrowKey, k as isArrowRightKey, g as isArrowDownKey, p as isPlusKey } from './p-8db11326.js';
-import { g as getLocaleString, c as connectLanguageChangeObserver, d as disconnectLanguageChangeObserver } from './p-35375593.js';
-import { d as defineCustomElement$4 } from './p-297845c1.js';
-import { d as defineCustomElement$3 } from './p-d07ce35f.js';
-import { d as defineCustomElement$2 } from './p-df9299e6.js';
-
-const duetRangeStepperCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;display:inline-block;margin:0 auto}.duet-range-stepper{display:flex;flex-wrap:wrap;gap:0;align-items:baseline;justify-content:center;min-width:30px;min-height:30px;font-weight:600;text-decoration:none;border-left-width:0}.duet-range-stepper{white-space:nowrap}.duet-range-stepper .duet-range-step-counter{font-weight:600;color:rgb(8, 42, 77)}.duet-range-stepper ::part(button){border:0}";
-const DuetRangeStepperStyle0 = duetRangeStepperCss;
-
-const DuetRangeStepper$1 = /*@__PURE__*/ proxyCustomElement(class DuetRangeStepper extends H {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-        this.duetRangeStepUpdate = createEvent(this, "duetRangeStepUpdate", 7);
-        this.leftBn = createID("duetRangeStepper-left");
-        this.rightBn = createID("duetRangeStepper-right");
-        this.handleClick = (e, direction) => {
-            e.preventDefault();
-            this.stepIndex += direction;
-            this.clampStepIndex();
-            this.handleStepClick(e);
-        };
-        this.buttonLeftDisabled = false;
-        this.buttonRightDisabled = false;
-        this.theme = "";
-        this.disabled = false;
-        this.stepIndex = 1;
-        this.stepSize = 50;
-        this.total = 1000;
-        this.ariaLabelsDefaults = {
-            en: {
-                next_increment: "Next range increment",
-                previous_increment: "Previous range increment",
-                x_of_y: "{0}–{1} of {2}",
-            },
-            fi: {
-                next_increment: "Seuraava välillä",
-                previous_increment: "Edellinen välillä",
-                x_of_y: "{0}–{1} / {2}",
-            },
-            sv: {
-                next_increment: "Nästa intervall",
-                previous_increment: "Föregående intervall",
-                x_of_y: "{0}–{1} av {2}",
-            },
-        };
-        this.ariaLabels = getLocaleString(this.ariaLabelsDefaults);
-        this.ariaControls = "";
-    }
-    watchStepIndexStateHandler(newValue) {
-        if (this.leftBnRef && this.rightBnRef) {
-            if (newValue <= 1) {
-                if (this.element === document.activeElement) {
-                    this.rightBnRef.setFocus();
-                }
-                this.buttonLeftDisabled = true;
-            }
-            else {
-                this.buttonLeftDisabled = false;
-            }
-            if (newValue >= this.total / this.stepSize) {
-                if (this.element === document.activeElement) {
-                    this.leftBnRef.setFocus();
-                }
-                this.buttonRightDisabled = true;
-            }
-            else {
-                this.buttonRightDisabled = false;
-            }
-        }
-    }
-    watchStepSizeStateHandler(newValue, oldValue) {
-        if (newValue !== oldValue) {
-            if (this.stepIndex * newValue > this.total) {
-                this.stepIndex = Math.ceil(this.total / newValue);
-            }
-            // trigger handler in case a button needs to be disabled or enabled but stepIndex did not change
-            this.watchStepIndexStateHandler(this.stepIndex);
-        }
-    }
-    handleStepClick(e) {
-        this.duetRangeStepUpdate.emit({
-            originalEvent: e,
-            component: "duet-range-stepper",
-            from: this.getFrom(),
-            to: this.getTo(),
-            index: this.stepIndex,
-        });
-    }
-    componentWillLoad() {
-        inheritGlobalTheme(this);
-        this.clampStepIndex();
-    }
-    componentDidLoad() {
-        this.watchStepIndexStateHandler(this.stepIndex);
-    }
-    connectedCallback() {
-        connectLanguageChangeObserver(this, { prop: "ariaLabels", defaults: "ariaLabelsDefaults" });
-    }
-    disconnectedCallback() {
-        disconnectLanguageChangeObserver(this);
-    }
-    clampStepIndex() {
-        if (this.stepIndex < 1) {
-            this.stepIndex = 1;
-        }
-        else if (this.stepIndex * this.stepSize > this.total) {
-            this.stepIndex = Math.ceil(this.total / this.stepSize);
-        }
-    }
-    getFrom() {
-        return Math.floor((this.stepIndex - 1) * this.stepSize) + 1;
-    }
-    getTo() {
-        return Math.min(Math.floor(this.stepIndex * this.stepSize), this.total);
-    }
-    generateStepSize() {
-        return this.ariaLabels.x_of_y
-            .replace("{0}", String(this.getFrom()))
-            .replace("{1}", String(this.getTo()))
-            .replace("{2}", String(this.total));
-    }
-    generatePreviousIncrementLabel() {
-        if (this.getFrom() === 1) {
-            return "";
-        }
-        return this.ariaLabels.x_of_y
-            .replace("{0}", String(Math.max(this.getFrom() - this.stepSize, 1)))
-            .replace("{1}", String(Math.min(this.getFrom() - 1, this.total)))
-            .replace("{2}", String(this.total));
-    }
-    generateNextIncrementLabel() {
-        if (this.getTo() === this.total) {
-            return "";
-        }
-        return this.ariaLabels.x_of_y
-            .replace("{0}", String(this.getTo() + 1))
-            .replace("{1}", String(Math.min(this.getTo() + this.stepSize, this.total)))
-            .replace("{2}", String(this.total));
-    }
-    //handle a11y keyboard navigation events
-    async onKeyboardDown(e) {
-        if (this.disabled) {
-            return;
-        }
-        // handle a11y based keyboard navigation for left/right/up/down
-        let next = this.stepIndex;
-        let dir = 1;
-        if (isArrowLeftKey(e) || isArrowUpKey(e) || isMinusKey(e)) {
-            next--;
-            dir = -1;
-            this.leftBnRef.setFocus();
-        }
-        if (isArrowRightKey(e) || isArrowDownKey(e) || isPlusKey(e)) {
-            next++;
-            dir = 1;
-        }
-        if (isArrowKey(e)) {
-            if (next > 0 && next * this.stepSize <= this.total) {
-                this.handleClick(e, dir);
-            }
-        }
-    }
-    /**
-     * render() function
-     * Always the last one in the class.
-     */
-    render() {
-        return (h("div", { key: 'c9b11ce90897f1f447451ee5fb9a6c6e6beb6f28', class: {
-                "duet-range-stepper": true,
-                "duet-theme-turva": this.theme === "turva",
-            }, onKeyDown: e => this.onKeyboardDown(e), "aria-controls": this.ariaControls }, h("span", { key: '4398c6aa7367285c372aea99bcc75a3eeea66c7a', class: "duet-range-step-counter", part: "range-numbers" }, this.generateStepSize()), h("duet-action-button", { key: '315adfd1f29f46f3e04f97b06b3fcd5906dd294c', disabled: this.disabled || this.buttonLeftDisabled, class: "duet-range-step-button duet-range-step-minus", onClick: e => this.handleClick(e, -1), id: this.leftBn, "accessible-label": `${this.ariaLabels.previous_increment} ${this.generatePreviousIncrementLabel()}`, ref: el => (this.leftBnRef = el), part: "navigation-arrow", iconName: "action-arrow-left-small", title: "" }), h("duet-action-button", { key: '045f85fb0942d3841b51bfc1dfcc954d41b0554d', disabled: this.disabled || this.buttonRightDisabled, class: "duet-range-step-button duet-range-step-plus", onClick: e => this.handleClick(e, 1), "accessible-label": `${this.ariaLabels.next_increment} ${this.generateNextIncrementLabel()}`, id: this.rightBn, ref: el => (this.rightBnRef = el), part: "navigation-arrow", iconName: "action-arrow-right-small", title: "" })));
-    }
-    get element() { return this; }
-    static get watchers() { return {
-        "stepIndex": ["watchStepIndexStateHandler"],
-        "stepSize": ["watchStepSizeStateHandler"]
-    }; }
-    static get style() { return DuetRangeStepperStyle0; }
-}, [1, "duet-range-stepper", {
-        "theme": [1025],
-        "disabled": [516],
-        "stepIndex": [1026, "step-index"],
-        "stepSize": [2, "step-size"],
-        "total": [2],
-        "ariaLabelsDefaults": [16],
-        "ariaLabels": [1040],
-        "ariaControls": [1, "accessible-controls"],
-        "buttonLeftDisabled": [32],
-        "buttonRightDisabled": [32]
-    }, undefined, {
-        "stepIndex": ["watchStepIndexStateHandler"],
-        "stepSize": ["watchStepSizeStateHandler"]
-    }]);
-function defineCustomElement$1() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["duet-range-stepper", "duet-action-button", "duet-icon", "duet-visually-hidden"];
-    components.forEach(tagName => { switch (tagName) {
-        case "duet-range-stepper":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, DuetRangeStepper$1);
-            }
-            break;
-        case "duet-action-button":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$4();
-            }
-            break;
-        case "duet-icon":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$3();
-            }
-            break;
-        case "duet-visually-hidden":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$2();
-            }
-            break;
-    } });
-}
-
-const DuetRangeStepper = DuetRangeStepper$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { DuetRangeStepper, defineCustomElement };

package/lib/dist-custom-elements/duet-scrollable.d.ts

@@ -1,11 +0,0 @@
-import type { Components, JSX } from "../types/components";
-
-interface DuetScrollable extends Components.DuetScrollable, HTMLElement {}
-export const DuetScrollable: {
-    prototype: DuetScrollable;
-    new (): DuetScrollable;
-};
-/**
- * Used to define this component and all nested components recursively.
- */
-export const defineCustomElement: () => void;

package/lib/dist-custom-elements/duet-scrollable.js

@@ -1,9 +0,0 @@
-/*!
- * Built with Duet Design System
- */
-import { D as DuetScrollable$1, d as defineCustomElement$1 } from './p-3bea94c3.js';
-
-const DuetScrollable = DuetScrollable$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { DuetScrollable, defineCustomElement };

package/lib/dist-custom-elements/duet-section-layout.d.ts

@@ -1,11 +0,0 @@
-import type { Components, JSX } from "../types/components";
-
-interface DuetSectionLayout extends Components.DuetSectionLayout, HTMLElement {}
-export const DuetSectionLayout: {
-    prototype: DuetSectionLayout;
-    new (): DuetSectionLayout;
-};
-/**
- * Used to define this component and all nested components recursively.
- */
-export const defineCustomElement: () => void;

package/lib/dist-custom-elements/duet-section-layout.js

@@ -1,56 +0,0 @@
-/*!
- * Built with Duet Design System
- */
-import { p as proxyCustomElement, H, h, d as Host } from './p-1080a6c7.js';
-import { i as isInternetExplorer } from './p-43b89e38.js';
-
-const duetSectionLayoutCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;display:block;flex:1 0 auto;width:100%}:host(.duet-middle) .duet-layout{padding:36px 28px !important}@media (min-width: 36em){:host(.duet-middle) .duet-layout{padding:48px 36px !important}}@media (min-width: 62em){:host(.duet-middle) .duet-layout{padding:56px !important}}:host(.duet-ie){height:100%}:host(.duet-middle.duet-ie){height:auto}.duet-layout-wrapper{display:block;margin:48px 0 36px;overflow-x:clip}@media (min-width: 36em){.duet-layout-wrapper{margin-top:72px}}@media (min-width: 62em){.duet-layout-wrapper{margin-bottom:48px}}.duet-layout-wrapper.duet-m-0{margin-top:0 !important;margin-bottom:0 !important}.duet-layout-wrapper>*{width:100%}.duet-layout{position:relative;padding:0 16px;margin:0 auto}@media (max-width: 20.5em){.duet-layout.padding-xxx-small{padding:0}}@media (max-width: 22.5em){.duet-layout.padding-xx-small{padding:0}}@media (max-width: 35.9375em){.duet-layout.padding-x-small{padding:0}}@media (min-width: 36em){.duet-layout.padding-small{padding:0}}@media (min-width: 48em){.duet-layout.padding-medium{padding:0}}@media (min-width: 62em){.duet-layout.padding-large{padding:0}}@media (min-width: 64.0625em){.duet-layout.padding-x-large{padding:0}}@media (min-width: 76.25em){.duet-layout.padding-xx-large{padding:0}}@media (min-width: 106.25em){.duet-layout.padding-xxx-large{padding:0}}@media (min-width: 36em){.duet-layout{padding:0 28px}}@media (min-width: 62em){.duet-layout{display:flex;flex-direction:row;padding:0 56px}}@media (min-width: 76.25em){.duet-layout{max-width:1110px;padding:0}}.duet-main{display:block;width:100%}@media (min-width: 62em){.duet-main{min-width:600px;margin:0 auto}}";
-const DuetSectionLayoutStyle0 = duetSectionLayoutCss;
-
-const DuetSectionLayout$1 = /*@__PURE__*/ proxyCustomElement(class DuetSectionLayout extends H {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-        this.margin = "auto";
-        this.middle = false;
-        this.paddingBreakpoint = undefined;
-    }
-    /**
-     * render() function.
-     * Always the last one in the class.
-     */
-    render() {
-        return (h(Host, { key: 'f6adbb4624397e3ce0dc5dfaf00dad1afc605d72', class: {
-                "duet-middle": this.middle,
-                "duet-ie": isInternetExplorer(),
-            } }, h("div", { key: 'a32239cd0233b568459975b3473fb8d644730a98', class: { "duet-layout-wrapper": true, "duet-m-0": this.margin === "none" } }, h("div", { key: '34f720bb4d768a6a37f8608f46d6a8ea4edbef53', class: {
-                "duet-layout": true,
-                [`padding-${this.paddingBreakpoint}`]: !!this.paddingBreakpoint,
-            } }, h("section", { key: 'a6a4fe58bb1b954401555a4325fdb0d3e98bc5b5', class: "duet-main" }, h("slot", { key: '7dacf94bdfaffc03e4d3cf81f4ac5fcf14b09304' }))))));
-    }
-    get element() { return this; }
-    static get style() { return DuetSectionLayoutStyle0; }
-}, [1, "duet-section-layout", {
-        "margin": [1],
-        "middle": [4],
-        "paddingBreakpoint": [1, "padding-breakpoint"]
-    }]);
-function defineCustomElement$1() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["duet-section-layout"];
-    components.forEach(tagName => { switch (tagName) {
-        case "duet-section-layout":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, DuetSectionLayout$1);
-            }
-            break;
-    } });
-}
-
-const DuetSectionLayout = DuetSectionLayout$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { DuetSectionLayout, defineCustomElement };

package/lib/dist-custom-elements/duet-select.d.ts

@@ -1,11 +0,0 @@
-import type { Components, JSX } from "../types/components";
-
-interface DuetSelect extends Components.DuetSelect, HTMLElement {}
-export const DuetSelect: {
-    prototype: DuetSelect;
-    new (): DuetSelect;
-};
-/**
- * Used to define this component and all nested components recursively.
- */
-export const defineCustomElement: () => void;

package/lib/dist-custom-elements/duet-select.js

@@ -1,9 +0,0 @@
-/*!
- * Built with Duet Design System
- */
-import { D as DuetSelect$1, d as defineCustomElement$1 } from './p-d1aca1bf.js';
-
-const DuetSelect = DuetSelect$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { DuetSelect, defineCustomElement };

package/lib/dist-custom-elements/duet-shaped-image.d.ts

@@ -1,11 +0,0 @@
-import type { Components, JSX } from "../types/components";
-
-interface DuetShapedImage extends Components.DuetShapedImage, HTMLElement {}
-export const DuetShapedImage: {
-    prototype: DuetShapedImage;
-    new (): DuetShapedImage;
-};
-/**
- * Used to define this component and all nested components recursively.
- */
-export const defineCustomElement: () => void;

package/lib/dist-custom-elements/duet-shaped-image.js

@@ -1,64 +0,0 @@
-/*!
- * Built with Duet Design System
- */
-import { p as proxyCustomElement, H, h, d as Host } from './p-1080a6c7.js';
-import { i as inheritGlobalTheme } from './p-aaa7a7bd.js';
-
-const duetShapedImageCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;display:inline-block;width:100%;height:100%;margin:5%}:host(.duet-theme-turva){margin:3%}:host(.duet-m-0){margin:0}.shaped-image{position:relative;display:inline-block;width:100%;height:100%}.shaped-image .shaped-image-mask{position:relative;display:block;width:100%;height:100%;overflow:hidden;border-radius:25%;transform:rotate(var(--rotation))}.shaped-image .shaped-image-mask .shaped-image-img{position:relative;display:block;width:100%;height:100%;background-repeat:no-repeat;background-position:center;background-size:cover;transform:scale(1.07) rotate(calc(-1 * var(--rotation)));transform-origin:center}:host(.duet-theme-turva) .shaped-image .shaped-image-mask{transform:none;-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg%20fill%3D%22currentColor%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20160%20140%22%3E%3Cpath%20d%3D%22M87.8%20139.6a57.3%2057.3%200%2000-18.4-3.3c-8-.5-16.3-2.5-24.6-6-16.7-7-29-18.7-37.1-35.3a73.5%2073.5%200%2001-5-52.4c1.7-4%203-6.7%204-7.8a33%2033%200%20004-7.8C33.4%203.5%2063.2-4.3%20100%203.2c30.5%204%2049.7%2019.9%2057.6%2047.4l1.6%2024c4.4%2036-11.5%2056-47.5%2060.3-4%202.4-12%203.9-24%204.7%22%20fill-rule%3D%22nonzero%22%2F%3E%3C%2Fsvg%3E\");-webkit-mask-repeat:no-repeat;mask-image:url(\"data:image/svg+xml,%3Csvg%20fill%3D%22currentColor%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20160%20140%22%3E%3Cpath%20d%3D%22M87.8%20139.6a57.3%2057.3%200%2000-18.4-3.3c-8-.5-16.3-2.5-24.6-6-16.7-7-29-18.7-37.1-35.3a73.5%2073.5%200%2001-5-52.4c1.7-4%203-6.7%204-7.8a33%2033%200%20004-7.8C33.4%203.5%2063.2-4.3%20100%203.2c30.5%204%2049.7%2019.9%2057.6%2047.4l1.6%2024c4.4%2036-11.5%2056-47.5%2060.3-4%202.4-12%203.9-24%204.7%22%20fill-rule%3D%22nonzero%22%2F%3E%3C%2Fsvg%3E\");mask-repeat:no-repeat}:host(.duet-theme-turva) .shaped-image .shaped-image-mask .shaped-image-img{transform:none}";
-const DuetShapedImageStyle0 = duetShapedImageCss;
-
-const DuetShapedImage$1 = /*@__PURE__*/ proxyCustomElement(class DuetShapedImage extends H {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-        this.theme = "";
-        this.accessibleLabel = undefined;
-        this.margin = "auto";
-        this.src = undefined;
-        this.rotation = 7;
-    }
-    /**
-     * Component lifecycle events.
-     */
-    componentWillLoad() {
-        inheritGlobalTheme(this);
-    }
-    /**
-     * render() function
-     * Always the last one of the class.
-     */
-    render() {
-        const style = {
-            "--rotation": `${this.rotation}deg`,
-        };
-        return (h(Host, { key: '94aa9402f3e6b93c0efa20822a7ffe889cdfd2ea', class: { "duet-theme-turva": this.theme === "turva", "duet-m-0": this.margin === "none" } }, h("span", { key: '2de6c874205c4a76106c3b47e7aea16d6d153453', class: {
-                "shaped-image": true,
-            }, role: "img", "aria-label": this.accessibleLabel, style: style }, h("span", { key: '316b13cb583473cdbe6952d8b0d557a4450e54df', class: "shaped-image-mask", role: "presentation" }, h("span", { key: 'b1063b1a09d864f0c606e37cd453af2d9e82aa3b', class: "shaped-image-img", role: "presentation", style: { backgroundImage: `url("${this.src}")` } })))));
-    }
-    static get style() { return DuetShapedImageStyle0; }
-}, [1, "duet-shaped-image", {
-        "theme": [1025],
-        "accessibleLabel": [1, "accessible-label"],
-        "margin": [1],
-        "src": [1],
-        "rotation": [2]
-    }]);
-function defineCustomElement$1() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["duet-shaped-image"];
-    components.forEach(tagName => { switch (tagName) {
-        case "duet-shaped-image":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, DuetShapedImage$1);
-            }
-            break;
-    } });
-}
-
-const DuetShapedImage = DuetShapedImage$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { DuetShapedImage, defineCustomElement };

package/lib/dist-custom-elements/duet-show-more.d.ts

@@ -1,11 +0,0 @@
-import type { Components, JSX } from "../types/components";
-
-interface DuetShowMore extends Components.DuetShowMore, HTMLElement {}
-export const DuetShowMore: {
-    prototype: DuetShowMore;
-    new (): DuetShowMore;
-};
-/**
- * Used to define this component and all nested components recursively.
- */
-export const defineCustomElement: () => void;