@duetds/components 10.0.0-alpha.9 → 10.0.0

package/lib/dist-custom-elements/p-e58296e6.js

@@ -1,110 +0,0 @@
-/*!
- * Built with Duet Design System
- */
-import { p as proxyCustomElement, H, h, d as Host } from './p-548610a6.js';
-import { d as defineCustomElement$1 } from './p-196352e6.js';
-
-const DuetUploadAriaStatus = /*@__PURE__*/ proxyCustomElement(class DuetUploadAriaStatus extends H {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-        /**
-         * Private functions
-         */
-        this.replacePlaceHolders = (statusString) => {
-            const addFiles = (amount) => {
-                return amount > 1 ? `${amount} ${this.statusMessageLabel.files}` : `${amount} ${this.statusMessageLabel.file}`;
-            };
-            return statusString
-                .replace("{filesUploaded}", addFiles(this.valid))
-                .replace("{filesInProgress}", addFiles(this.inprogress))
-                .replace("{filesTotal}", addFiles(this.total))
-                .replace("{filesWithErrors}", addFiles(this.invalid));
-        };
-        this.getStatusMessage = () => {
-            const { done, inProgress, doneWithErrors, inProgressWithErrors } = this.statusMessageLabel;
-            const hasErrors = this.invalid > 0;
-            const isInProgress = this.inprogress > 0;
-            const isInProgressWithErrors = this.inprogress > 0 && hasErrors;
-            const isDone = this.valid === this.total && !isInProgress && !hasErrors;
-            const isDoneWithErrors = this.valid + this.invalid === this.total && !isInProgress;
-            if (isDone) {
-                this.statusMessage = this.replacePlaceHolders(done);
-                return;
-            }
-            else if (isInProgressWithErrors) {
-                this.statusMessage = this.replacePlaceHolders(inProgressWithErrors);
-                return;
-            }
-            else if (isInProgress) {
-                this.statusMessage = this.replacePlaceHolders(inProgress);
-                return;
-            }
-            else if (isDoneWithErrors) {
-                this.statusMessage = this.replacePlaceHolders(doneWithErrors);
-                return;
-            }
-            return;
-        };
-        this.statusMessage = null;
-        this.statusMessageLabel = null;
-        this.accessibleAriaLive = "polite";
-        this.valid = undefined;
-        this.total = undefined;
-        this.invalid = undefined;
-        this.inprogress = undefined;
-    }
-    watchHandler(newValue, oldValue) {
-        if (newValue !== oldValue) {
-            this.getStatusMessage();
-        }
-    }
-    /**
-     * render() function
-     * Always the last one in the class.
-     */
-    render() {
-        return (h(Host, { key: '9ef075b90505bbba4b77395f4be84f896519b61a', role: "status", "aria-live": "assertive", "aria-atomic": "true", "aria-relevant": "all" }, h("duet-visually-hidden", { key: '57a5279dd6e2db63beb2d5d7912b29dce1ba547d' }, this.statusMessage)));
-    }
-    get element() { return this; }
-    static get watchers() { return {
-        "valid": ["watchHandler"],
-        "invalid": ["watchHandler"],
-        "inprogress": ["watchHandler"],
-        "total": ["watchHandler"]
-    }; }
-}, [1, "duet-upload-aria-status", {
-        "statusMessageLabel": [16],
-        "accessibleAriaLive": [1, "accessible-aria-live"],
-        "valid": [2],
-        "total": [2],
-        "invalid": [2],
-        "inprogress": [2],
-        "statusMessage": [32]
-    }, undefined, {
-        "valid": ["watchHandler"],
-        "invalid": ["watchHandler"],
-        "inprogress": ["watchHandler"],
-        "total": ["watchHandler"]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["duet-upload-aria-status", "duet-visually-hidden"];
-    components.forEach(tagName => { switch (tagName) {
-        case "duet-upload-aria-status":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, DuetUploadAriaStatus);
-            }
-            break;
-        case "duet-visually-hidden":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$1();
-            }
-            break;
-    } });
-}
-
-export { DuetUploadAriaStatus as D, defineCustomElement as d };

package/lib/dist-custom-elements/p-ed1ef4c3.js

@@ -1,55 +0,0 @@
-/*!
- * Built with Duet Design System
- */
-import { p as proxyCustomElement, H, h, d as Host } from './p-548610a6.js';
-import { i as inheritGlobalTheme } from './p-aaa7a7bd.js';
-
-const duetCheckmarkCss = ".duet-checkmark-container{position:relative;width:20px;height:20px;margin-left:auto;border:1px solid rgb(127, 150, 165);border-radius:4px;transition:border 300ms ease}.duet-checkmark-container.center{margin-right:auto}.duet-theme-turva .duet-checkmark-container{border-color:rgb(143, 147, 158)}.checked .duet-checkmark-container{background:rgb(0, 119, 179);border-color:rgb(0, 119, 179);transition:none}.duet-theme-turva .checked .duet-checkmark-container{background:rgb(23, 28, 58);border-color:rgb(23, 28, 58) !important}.duet-checkmark-container.duet-checkmark-radio{border-radius:50%}[disabled]+label .duet-checkmark-container{border-color:rgb(181, 198, 208) !important}.duet-theme-turva [disabled]+label .duet-checkmark-container{border-color:rgb(199, 202, 207) !important}.checked [disabled]+label .duet-checkmark-container{background:rgb(181, 198, 208) !important}.duet-theme-turva .checked [disabled]+label .duet-checkmark-container{background:rgb(199, 202, 207) !important}.duet-checkmark{position:absolute;top:10px;left:3px;width:5.3333333333px;height:11.8518518519px;border-top:2px solid rgb(255, 255, 255);border-right:2px solid rgb(255, 255, 255);opacity:1;transform:scaleX(-1) rotate(135deg) translateZ(0);transform-origin:left top;animation-name:duet-checkmark;animation-duration:600ms;animation-timing-function:ease-out;animation-fill-mode:forwards}@keyframes duet-checkmark{0%{width:0;height:0;opacity:1}20%{width:5.3333333333px;height:0;opacity:1}40%,100%{width:5.3333333333px;height:11.8518518519px;opacity:1}}";
-const DuetCheckmarkStyle0 = duetCheckmarkCss;
-
-const DuetCheckmark = /*@__PURE__*/ proxyCustomElement(class DuetCheckmark extends H {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.theme = "";
-        this.checked = false;
-        this.presentationOnly = false;
-        this.center = false;
-        this.type = "checkbox";
-    }
-    /**
-     * Component lifecycle events.
-     */
-    componentWillLoad() {
-        inheritGlobalTheme(this);
-    }
-    render() {
-        return (h(Host, { key: '622bd4a994f7a18ee9b3f5d0b4f2fa3c38fe2054', class: { "duet-theme-turva": this.theme === "turva" } }, h("div", { key: '95f90f2a7f1648534789dfd90e5216c728f472c4', role: this.presentationOnly ? "presentation" : null, class: { checked: this.checked } }, h("div", { key: 'b9fc08723222791a4ed226ad2f2dc4fec1256c88', class: {
-                "duet-checkmark-container": true,
-                center: this.center,
-                "duet-checkmark-radio": this.type === "radio",
-            } }, this.checked && h("div", { key: 'ddf0b69427d9e91abbcc2c48ce12bbcd1d55e7b4', class: "duet-checkmark" })))));
-    }
-    static get style() { return DuetCheckmarkStyle0; }
-}, [0, "duet-checkmark", {
-        "theme": [1025],
-        "checked": [1028],
-        "presentationOnly": [4, "presentation-only"],
-        "center": [4],
-        "type": [513]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["duet-checkmark"];
-    components.forEach(tagName => { switch (tagName) {
-        case "duet-checkmark":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, DuetCheckmark);
-            }
-            break;
-    } });
-}
-
-export { DuetCheckmark as D, defineCustomElement as d };

package/lib/dist-custom-elements/p-ed6a907e.js

@@ -1,61 +0,0 @@
-/*!
- * Built with Duet Design System
- */
-import { p as proxyCustomElement, H, h, d as Host } from './p-548610a6.js';
-import { i as inheritGlobalTheme } from './p-aaa7a7bd.js';
-
-const duetCaptionCss = ":host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-bottom:16px !important;display:flex;flex:0 0 100%;width:100%;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:400;line-height:1.5;color:rgb(98, 121, 138);vertical-align:top}:host.duet-p-0{padding:0 !important}:host.duet-m-0{margin:0 !important}:host(.duet-caption-small){font-size:0.875rem;line-height:1.25}:host(.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(143, 147, 158)}:host(.duet-caption-selected){color:rgb(0, 119, 179)}:host(.duet-caption-selected.duet-theme-turva){color:rgb(23, 28, 58)}:host(.duet-m-0){margin:0 !important}";
-const DuetCaptionStyle0 = duetCaptionCss;
-
-const DuetCaption = /*@__PURE__*/ proxyCustomElement(class DuetCaption extends H {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-        this.theme = "";
-        this.margin = "auto";
-        this.selected = false;
-        this.size = "medium";
-    }
-    /**
-     * Component lifecycle events.
-     */
-    componentWillLoad() {
-        inheritGlobalTheme(this);
-    }
-    /**
-     * render() function
-     * Always the last one in the class.
-     */
-    render() {
-        return (h(Host, { key: 'cefb662c677d5a45cc8e007a68ab67b0698ce2ee', class: {
-                "duet-caption": true,
-                "duet-caption-selected": this.selected,
-                "duet-caption-small": this.size === "small",
-                "duet-theme-turva": this.theme === "turva",
-                "duet-m-0": this.margin === "none",
-            } }, h("slot", { key: '4a38bee52925d9c7db4473dd0e5bc92797b0b058' })));
-    }
-    get element() { return this; }
-    static get style() { return DuetCaptionStyle0; }
-}, [1, "duet-caption", {
-        "theme": [1025],
-        "margin": [1],
-        "selected": [4],
-        "size": [1]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["duet-caption"];
-    components.forEach(tagName => { switch (tagName) {
-        case "duet-caption":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, DuetCaption);
-            }
-            break;
-    } });
-}
-
-export { DuetCaption as D, defineCustomElement as d };

package/lib/dist-custom-elements/p-ed6f3abc.js

@@ -1,165 +0,0 @@
-/*!
- * Built with Duet Design System
- */
-import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-548610a6.js';
-import { i as inheritGlobalTheme } from './p-aaa7a7bd.js';
-import { c as createID } from './p-5e59e970.js';
-import { i as isKeyboardClick } from './p-8db11326.js';
-import { a as getLanguage, g as getLocaleString, c as connectLanguageChangeObserver, d as disconnectLanguageChangeObserver } from './p-35375593.js';
-import { d as defineCustomElement$4 } from './p-9ee4d52e.js';
-import { d as defineCustomElement$3 } from './p-77667998.js';
-import { d as defineCustomElement$2 } from './p-3c70317f.js';
-import { d as defineCustomElement$1 } from './p-196352e6.js';
-
-const duetShowMoreCss = "*,*::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}.duet-show-more{margin-bottom:16px !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;line-height:1.5;color:rgb(8, 42, 77)}.duet-show-more.duet-m-0{margin:0 !important}.duet-show-more .slotted-content{display:none}.duet-show-more.open .slotted-content{display:block}.duet-show-more .content:focus{outline:0;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.duet-show-more.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)}.duet-show-more.duet-theme-turva .content:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}";
-const DuetShowMoreStyle0 = duetShowMoreCss;
-
-const DuetShowMore = /*@__PURE__*/ proxyCustomElement(class DuetShowMore extends H {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-        this.duetToggle = createEvent(this, "duetToggle", 7);
-        this.contentId = createID("DuetShowMore");
-        this.buttonId = createID("DuetShowMoreButton");
-        this.handleKeyDown = (e) => {
-            if (isKeyboardClick(e)) {
-                this.handleClick(e);
-            }
-        };
-        this.handleClick = (e) => {
-            e.preventDefault();
-            const open = !this.open;
-            this.open = open;
-            if (open) {
-                setTimeout(() => {
-                    this.contentElement.focus();
-                }, 100);
-                setTimeout(() => {
-                    this.buttonAriaOpen = open;
-                }, 500);
-            }
-            else {
-                this.buttonAriaOpen = open;
-            }
-            this.duetToggle.emit({
-                component: "duet-show-more",
-                originalEvent: e,
-            });
-        };
-        this.buttonAriaOpen = false;
-        this.theme = "";
-        this.language = getLanguage();
-        this.showMoreLabelDefaults = {
-            fi: "Näytä lisää",
-            sv: "Visa mer",
-            en: "Show more",
-        };
-        this.showMoreLabel = getLocaleString(this.showMoreLabelDefaults);
-        this.showLessLabelDefaults = {
-            fi: "Näytä vähemmän",
-            sv: "Visa mindre",
-            en: "Show less",
-        };
-        this.showLessLabel = getLocaleString(this.showLessLabelDefaults);
-        this.showMoreAccessibleLabelDefaults = {
-            fi: "Näytä lisää tästä aiheesta",
-            sv: "Visa mer om detta ämne",
-            en: "Show more about this subject",
-        };
-        this.showMoreAccessibleLabel = getLocaleString(this.showMoreAccessibleLabelDefaults);
-        this.showLessAccessibleLabelDefaults = {
-            fi: "Näytä vähemmän tästä aiheesta",
-            sv: "Visa mindre om detta ämne",
-            en: "Show less about this subject",
-        };
-        this.showLessAccessibleLabel = getLocaleString(this.showLessAccessibleLabelDefaults);
-        this.margin = "auto";
-        this.buttonMargin = "auto";
-        this.buttonPadding = "auto";
-        this.open = false;
-    }
-    /**
-     * Component lifecycle events.
-     */
-    componentWillLoad() {
-        inheritGlobalTheme(this);
-        this.buttonAriaOpen = this.open;
-    }
-    connectedCallback() {
-        connectLanguageChangeObserver(this, [
-            { prop: "showMoreLabel", defaults: "showMoreLabelDefaults" },
-            { prop: "showLessLabel", defaults: "showLessLabelDefaults" },
-            { prop: "showMoreAccessibleLabel", defaults: "showMoreAccessibleLabelDefaults" },
-            { prop: "showLessAccessibleLabel", defaults: "showLessAccessibleLabelDefaults" },
-        ]);
-    }
-    disconnectedCallback() {
-        disconnectLanguageChangeObserver(this);
-    }
-    /**
-     * render() function
-     * Always the last one of the class.
-     */
-    render() {
-        return (h(Host, { key: 'ef627056589c603539d480e8fa4b98d62926c407' }, h("div", { key: '2338f98e828eb9fa1752c410155f1950a7db6929', class: {
-                "duet-show-more": true,
-                "duet-theme-turva": this.theme === "turva",
-                "duet-m-0": this.margin === "none",
-                open: this.open,
-            } }, h("div", { key: '6843c1073eb5e3d32b240523cf4f6438aceda390', ref: ref => (this.contentElement = ref), class: { content: true }, id: this.contentId, tabindex: this.open ? "0" : "" }, h("div", { key: '1f50d0de6d6e467b6d001de9c14c40e765432b83', class: { "slotted-content": true } }, h("slot", { key: 'ae4f7c65883e2d7cbba0b9b7dad0403e8679dfe3' }))), h("duet-button", { key: '41ab2c46d81106aa01df2c856ed26ba7aa8ec298', id: this.buttonId, variation: "plain", "accessible-label": this.buttonAriaOpen ? this.showLessAccessibleLabel : this.showMoreAccessibleLabel, "accessible-expanded": this.buttonAriaOpen ? "true" : "false", "accessible-controls": this.contentId, accessiblePressed: this.open, onClick: this.handleClick, onKeyDown: this.handleKeyDown, "icon-right": true, icon: this.open ? "action-arrow-up-small" : "action-arrow-down-small", "icon-size": "medium-small", size: "small", margin: this.buttonMargin, padding: this.buttonPadding, theme: this.theme === "turva" ? "turva" : "default" }, h("span", { key: 'f0f97a072bc00a04d6d2cdaceb03dd34b1571fbb' }, this.open ? this.showLessLabel : this.showMoreLabel)))));
-    }
-    get element() { return this; }
-    static get style() { return DuetShowMoreStyle0; }
-}, [1, "duet-show-more", {
-        "theme": [1025],
-        "language": [1537],
-        "showMoreLabelDefaults": [16],
-        "showMoreLabel": [1537, "show-more-label"],
-        "showLessLabelDefaults": [16],
-        "showLessLabel": [1537, "show-less-label"],
-        "showMoreAccessibleLabelDefaults": [16],
-        "showMoreAccessibleLabel": [1537, "show-more-accessible-label"],
-        "showLessAccessibleLabelDefaults": [16],
-        "showLessAccessibleLabel": [1537, "show-less-accessible-label"],
-        "margin": [1],
-        "buttonMargin": [1, "button-margin"],
-        "buttonPadding": [1, "button-padding"],
-        "open": [1540],
-        "buttonAriaOpen": [32]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["duet-show-more", "duet-button", "duet-icon", "duet-spinner", "duet-visually-hidden"];
-    components.forEach(tagName => { switch (tagName) {
-        case "duet-show-more":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, DuetShowMore);
-            }
-            break;
-        case "duet-button":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$4();
-            }
-            break;
-        case "duet-icon":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$3();
-            }
-            break;
-        case "duet-spinner":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$2();
-            }
-            break;
-        case "duet-visually-hidden":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$1();
-            }
-            break;
-    } });
-}
-
-export { DuetShowMore as D, defineCustomElement as d };

package/lib/dist-custom-elements/p-ee0c73c3.js

@@ -1,50 +0,0 @@
-/*!
- * Built with Duet Design System
- */
-import { p as proxyCustomElement, H, h, d as Host } from './p-548610a6.js';
-
-const duetListItemCss = "*,*::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;flex-direction:column;display:flex;width:100%;overflow:visible;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-style:normal;font-weight:400;font-variant-numeric:tabular-nums;line-height:1.25;color:rgb(8, 42, 77)}:host dt{padding-bottom:4px}:host dd{padding-top:0}:host dt,:host dd{flex-basis:100%}:host dt,:host dd{width:100%;margin-inline-start:0;-webkit-hyphens:auto;hyphens:auto;text-align:left;overflow-wrap:break-word}:host dt{font-weight:600}.duet-theme-turva :host dt{font-weight:700}:host dd{margin-left:auto}:host(.duet-list-striped) dt,:host(.duet-list-striped) dd{padding:16px}:host(.duet-list-striped) dt{padding-bottom:4px}:host(.duet-list-striped) dd{padding-top:0}:host(.duet-list-striped.duet-no-stacking) dt,:host(.duet-list-striped.duet-no-stacking) dd{padding:16px}:host(:not(.duet-list-striped)) dt,:host(:not(.duet-list-striped)) dd{padding:8px;padding-inline:0}:host(:not(.duet-list-striped)) dt{padding-bottom:4px}:host(:not(.duet-list-striped)) dd{padding-top:0}:host(:not(.duet-list-striped).duet-no-stacking) dt,:host(:not(.duet-list-striped).duet-no-stacking) dd{padding:8px;padding-inline:0}:host(.duet-p-0) dt,:host(.duet-p-0) dd{padding:0 !important}:host(.duet-list-mobile-center) dt,:host(.duet-list-mobile-center) dd{text-align:center}:host(.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)}:host(.duet-list-striped:nth-child(odd)) dt,:host(.duet-list-striped:nth-child(odd)) dd{background:rgb(245, 248, 250)}:host(.duet-list-striped.duet-theme-turva:nth-child(odd)) dt,:host(.duet-list-striped.duet-theme-turva:nth-child(odd)) dd{background:rgb(245, 247, 250)}:host(.duet-list-bordered){border-block-start:1px solid rgb(212, 223, 229)}:host(.duet-list-bordered:last-child){border-block-end:1px solid rgb(212, 223, 229)}:host(.duet-list-bordered.duet-theme-turva){border-block-start:1px solid rgb(222, 224, 228)}:host(.duet-list-bordered.duet-theme-turva:last-child){border-block-end:1px solid rgb(222, 224, 228)}:host(.duet-list-inner-bordered:not(:last-child)){border-block-end:1px solid rgb(212, 223, 229)}:host(.duet-list-inner-bordered.duet-theme-turva:not(:last-child)){border-block-end:1px solid rgb(222, 224, 228)}:host(.duet-no-stacking){flex-direction:row}:host(.duet-list-mobile-center.duet-no-stacking) dt,:host(.duet-list-mobile-center.duet-no-stacking) dd{text-align:left}:host(.duet-no-stacking.duet-list-width-30) dt{flex-basis:33%}:host(.duet-no-stacking.duet-list-width-30) dd{flex-basis:67%}:host(.duet-no-stacking.duet-list-width-50) dt{flex-basis:47%}:host(.duet-no-stacking.duet-list-width-50) dd{flex-basis:53%}:host(.duet-no-stacking.duet-list-width-70) dt{flex-basis:65%}:host(.duet-no-stacking.duet-list-width-70) dd{flex-basis:35%}:host(.duet-list-item-breakpoint-x-small){flex-direction:row}:host(.duet-list-item-breakpoint-x-small.duet-list-striped) dt,:host(.duet-list-item-breakpoint-x-small.duet-list-striped) dd{padding:16px}:host(.duet-list-item-breakpoint-x-small:not(.duet-list-striped)) dt,:host(.duet-list-item-breakpoint-x-small:not(.duet-list-striped)) dd{padding:8px;padding-inline:0}:host(.duet-list-item-breakpoint-x-small.duet-p-0) dt,:host(.duet-list-item-breakpoint-x-small.duet-p-0) dd{padding:0 !important}:host(.duet-list-item-breakpoint-x-small.duet-list-mobile-center) dt,:host(.duet-list-item-breakpoint-x-small.duet-list-mobile-center) dd{text-align:left}:host(.duet-list-item-breakpoint-x-small.duet-list-width-30) dt{flex-basis:33%}:host(.duet-list-item-breakpoint-x-small.duet-list-width-30) dd{flex-basis:67%}:host(.duet-list-item-breakpoint-x-small.duet-list-width-50) dt{flex-basis:47%}:host(.duet-list-item-breakpoint-x-small.duet-list-width-50) dd{flex-basis:53%}:host(.duet-list-item-breakpoint-x-small.duet-list-width-70) dt{flex-basis:65%}:host(.duet-list-item-breakpoint-x-small.duet-list-width-70) dd{flex-basis:35%}@media (max-width: 22.5em){:host(.duet-list-item-breakpoint-x-small){flex-direction:column}:host(.duet-list-item-breakpoint-x-small) dt{padding-bottom:4px}:host(.duet-list-item-breakpoint-x-small) dd{padding-top:0}:host(.duet-list-item-breakpoint-x-small.duet-list-striped) dt,:host(.duet-list-item-breakpoint-x-small.duet-list-striped) dd{padding:16px}:host(.duet-list-item-breakpoint-x-small.duet-list-striped) dt{padding-bottom:4px}:host(.duet-list-item-breakpoint-x-small.duet-list-striped) dd{padding-top:0}:host(.duet-list-item-breakpoint-x-small:not(.duet-list-striped)) dt,:host(.duet-list-item-breakpoint-x-small:not(.duet-list-striped)) dd{padding:8px;padding-inline:0}:host(.duet-list-item-breakpoint-x-small:not(.duet-list-striped)) dt{padding-bottom:4px}:host(.duet-list-item-breakpoint-x-small:not(.duet-list-striped)) dd{padding-top:0}:host(.duet-list-item-breakpoint-x-small.duet-p-0) dt,:host(.duet-list-item-breakpoint-x-small.duet-p-0) dd{padding:0 !important}:host(.duet-list-item-breakpoint-x-small.duet-list-mobile-center) dt,:host(.duet-list-item-breakpoint-x-small.duet-list-mobile-center) dd{text-align:center}:host(.duet-list-item-breakpoint-x-small.duet-list-width-30) dt,:host(.duet-list-item-breakpoint-x-small.duet-list-width-30) dd{flex-basis:100%}:host(.duet-list-item-breakpoint-x-small.duet-list-width-50) dt,:host(.duet-list-item-breakpoint-x-small.duet-list-width-50) dd{flex-basis:100%}:host(.duet-list-item-breakpoint-x-small.duet-list-width-70) dt,:host(.duet-list-item-breakpoint-x-small.duet-list-width-70) dd{flex-basis:100%}}@media (min-width: 36em){:host(.duet-list-item-breakpoint-small){flex-direction:row}:host(.duet-list-item-breakpoint-small.duet-list-striped) dt,:host(.duet-list-item-breakpoint-small.duet-list-striped) dd{padding:16px}:host(.duet-list-item-breakpoint-small:not(.duet-list-striped)) dt,:host(.duet-list-item-breakpoint-small:not(.duet-list-striped)) dd{padding:8px;padding-inline:0}:host(.duet-list-item-breakpoint-small.duet-p-0) dt,:host(.duet-list-item-breakpoint-small.duet-p-0) dd{padding:0 !important}:host(.duet-list-item-breakpoint-small.duet-list-mobile-center) dt,:host(.duet-list-item-breakpoint-small.duet-list-mobile-center) dd{text-align:left}:host(.duet-list-item-breakpoint-small.duet-list-width-30) dt{flex-basis:33%}:host(.duet-list-item-breakpoint-small.duet-list-width-30) dd{flex-basis:67%}:host(.duet-list-item-breakpoint-small.duet-list-width-50) dt{flex-basis:47%}:host(.duet-list-item-breakpoint-small.duet-list-width-50) dd{flex-basis:53%}:host(.duet-list-item-breakpoint-small.duet-list-width-70) dt{flex-basis:65%}:host(.duet-list-item-breakpoint-small.duet-list-width-70) dd{flex-basis:35%}}@media (min-width: 48em){:host(.duet-list-item-breakpoint-medium){flex-direction:row}:host(.duet-list-item-breakpoint-medium.duet-list-striped) dt,:host(.duet-list-item-breakpoint-medium.duet-list-striped) dd{padding:16px}:host(.duet-list-item-breakpoint-medium:not(.duet-list-striped)) dt,:host(.duet-list-item-breakpoint-medium:not(.duet-list-striped)) dd{padding:8px;padding-inline:0}:host(.duet-list-item-breakpoint-medium.duet-p-0) dt,:host(.duet-list-item-breakpoint-medium.duet-p-0) dd{padding:0 !important}:host(.duet-list-item-breakpoint-medium.duet-list-mobile-center) dt,:host(.duet-list-item-breakpoint-medium.duet-list-mobile-center) dd{text-align:left}:host(.duet-list-item-breakpoint-medium.duet-list-width-30) dt{flex-basis:33%}:host(.duet-list-item-breakpoint-medium.duet-list-width-30) dd{flex-basis:67%}:host(.duet-list-item-breakpoint-medium.duet-list-width-50) dt{flex-basis:47%}:host(.duet-list-item-breakpoint-medium.duet-list-width-50) dd{flex-basis:53%}:host(.duet-list-item-breakpoint-medium.duet-list-width-70) dt{flex-basis:65%}:host(.duet-list-item-breakpoint-medium.duet-list-width-70) dd{flex-basis:35%}}@media (min-width: 62em){:host(.duet-list-item-breakpoint-large){flex-direction:row}:host(.duet-list-item-breakpoint-large.duet-list-striped) dt,:host(.duet-list-item-breakpoint-large.duet-list-striped) dd{padding:16px}:host(.duet-list-item-breakpoint-large:not(.duet-list-striped)) dt,:host(.duet-list-item-breakpoint-large:not(.duet-list-striped)) dd{padding:8px;padding-inline:0}:host(.duet-list-item-breakpoint-large.duet-p-0) dt,:host(.duet-list-item-breakpoint-large.duet-p-0) dd{padding:0 !important}:host(.duet-list-item-breakpoint-large.duet-list-mobile-center) dt,:host(.duet-list-item-breakpoint-large.duet-list-mobile-center) dd{text-align:left}:host(.duet-list-item-breakpoint-large.duet-list-width-30) dt{flex-basis:33%}:host(.duet-list-item-breakpoint-large.duet-list-width-30) dd{flex-basis:67%}:host(.duet-list-item-breakpoint-large.duet-list-width-50) dt{flex-basis:47%}:host(.duet-list-item-breakpoint-large.duet-list-width-50) dd{flex-basis:53%}:host(.duet-list-item-breakpoint-large.duet-list-width-70) dt{flex-basis:65%}:host(.duet-list-item-breakpoint-large.duet-list-width-70) dd{flex-basis:35%}}@media (min-width: 64.0625em){:host(.duet-list-item-breakpoint-x-large){flex-direction:row}:host(.duet-list-item-breakpoint-x-large.duet-list-striped) dt,:host(.duet-list-item-breakpoint-x-large.duet-list-striped) dd{padding:16px}:host(.duet-list-item-breakpoint-x-large:not(.duet-list-striped)) dt,:host(.duet-list-item-breakpoint-x-large:not(.duet-list-striped)) dd{padding:8px;padding-inline:0}:host(.duet-list-item-breakpoint-x-large.duet-p-0) dt,:host(.duet-list-item-breakpoint-x-large.duet-p-0) dd{padding:0 !important}:host(.duet-list-item-breakpoint-x-large.duet-list-mobile-center) dt,:host(.duet-list-item-breakpoint-x-large.duet-list-mobile-center) dd{text-align:left}:host(.duet-list-item-breakpoint-x-large.duet-list-width-30) dt{flex-basis:33%}:host(.duet-list-item-breakpoint-x-large.duet-list-width-30) dd{flex-basis:67%}:host(.duet-list-item-breakpoint-x-large.duet-list-width-50) dt{flex-basis:47%}:host(.duet-list-item-breakpoint-x-large.duet-list-width-50) dd{flex-basis:53%}:host(.duet-list-item-breakpoint-x-large.duet-list-width-70) dt{flex-basis:65%}:host(.duet-list-item-breakpoint-x-large.duet-list-width-70) dd{flex-basis:35%}}";
-const DuetListItemStyle0 = duetListItemCss;
-
-const DuetListItem = /*@__PURE__*/ proxyCustomElement(class DuetListItem extends H {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-        this.responsive = false;
-        this.breakpoint = "small";
-    }
-    /**
-     * render() function
-     * Always the last one in the class.
-     */
-    render() {
-        return (h(Host, { key: 'df53e40d49897cce2ee5e1979afa9abce6a6824b', class: {
-                "duet-no-stacking": !this.responsive,
-                "duet-list-item-breakpoint-x-small": this.breakpoint === "x-small",
-                "duet-list-item-breakpoint-small": this.breakpoint === "small",
-                "duet-list-item-breakpoint-medium": this.breakpoint === "medium",
-                "duet-list-item-breakpoint-large": this.breakpoint === "large",
-                "duet-list-item-breakpoint-x-large": this.breakpoint === "x-large",
-            } }, h("dt", { key: '8b5d902f86288be859d8fce358cef7e03773c124' }, h("slot", { key: '01bbfe056a318f68092938601686113f068c71f2', name: "label" })), h("dd", { key: 'ab28871db561a05fa732736b4dbf063e507a9537' }, h("slot", { key: 'c4f3b4f9681c837262e19f431a14a2121f097044', name: "value" }))));
-    }
-    static get style() { return DuetListItemStyle0; }
-}, [1, "duet-list-item", {
-        "responsive": [4],
-        "breakpoint": [1]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["duet-list-item"];
-    components.forEach(tagName => { switch (tagName) {
-        case "duet-list-item":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, DuetListItem);
-            }
-            break;
-    } });
-}
-
-export { DuetListItem as D, defineCustomElement as d };

package/lib/dist-custom-elements/p-f11208c3.js

@@ -1,6 +0,0 @@
-/*!
- * Built with Duet Design System
- */
-var actionNewWindowSmall={"title":"action-new-window-small","tags":"arrow open new window tab external linksquare box rectangle action small","svg":"<svg fill=\"currentColor\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" role=\"img\"><path d=\"M10.5 2a1.5 1.5 0 0 1 .14 3H3.75c-.38 0-.7.28-.74.65l-.01.1v14.5c0 .38.28.7.65.74l.1.01h14.5c.38 0 .7-.28.74-.65l.01-.1v-6.89a1.5 1.5 0 0 1 3 0v6.89A3.75 3.75 0 0 1 18.25 24H3.75A3.75 3.75 0 0 1 0 20.25V5.75A3.75 3.75 0 0 1 3.75 2zm12-2c.78 0 1.42.6 1.5 1.36V7.5a1.5 1.5 0 0 1-3 .14V5.12l-5.44 5.44a1.5 1.5 0 0 1-2.22-2l.1-.12L18.88 3H16.5A1.5 1.5 0 0 1 15 1.64V1.5c0-.78.6-1.42 1.36-1.5h.14z\"/></svg>"};
-
-export { actionNewWindowSmall as a };

package/lib/dist-custom-elements/p-f4067b03.js

@@ -1,154 +0,0 @@
-/*!
- * Built with Duet Design System
- */
-import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-548610a6.js';
-import { i as inheritGlobalTheme } from './p-aaa7a7bd.js';
-import { c as createID } from './p-5e59e970.js';
-
-const duetCheckboxCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{margin-right:8px !important}:host(:last-child),:host(:last-of-type){margin-right:0 !important}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-bottom:12px !important;display:inline-flex;width:100%;vertical-align:bottom;-webkit-tap-highlight-color:transparent}:host(:last-child:not(:only-child)){margin-bottom:0 !important}:host(.duet-m-0){margin:0 !important}.duet-label{position:relative;z-index:100;display:inline;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:400;line-height:1.5;color:rgb(8, 42, 77);vertical-align:top;cursor:pointer;background:transparent;transition:300ms ease}.duet-theme-turva .duet-label{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-label span{display:inline-block;width:calc(100% - 32px);font-size:1rem;font-weight:400;vertical-align:top}.duet-checkbox-container{position:relative;width:100%;height:100%}.duet-checkbox{padding:14px !important;position:absolute;top:0;left:0;z-index:2;width:100%;height:100%;cursor:pointer;opacity:0}.duet-checkbox+label::before{z-index:100;display:inline-block;width:20px;height:20px;margin:2px 10px 1px 1px;vertical-align:top;content:\"\";background:rgb(255, 255, 255);border:1px solid rgb(8, 42, 77);border-radius:4px}.duet-theme-turva .duet-checkbox+label::before{border-color:rgb(23, 28, 58)}.duet-checkbox:checked+label::before{background:rgb(0, 119, 179);border:1px solid rgb(0, 119, 179)}.duet-theme-turva .duet-checkbox:checked+label::before{background:rgb(23, 28, 58);border-color:rgb(23, 28, 58)}.duet-checkbox:focus+label::before{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.duet-theme-turva .duet-checkbox:focus+label::before{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-checkbox[aria-invalid=true]+label::before{background:#fdf4f6;border-color:rgb(214, 28, 82)}.duet-theme-turva .duet-checkbox[aria-invalid=true]+label::before{background:#fdf4f6;border-color:rgb(214, 28, 82)}.duet-checkbox+label{position:static}.duet-checkbox:checked+label::after{position:absolute;top:6px;left:5px;z-index:200;width:12px;height:12px;pointer-events:none;content:\"\";background:transparent url(\"data:image/svg+xml,%3Csvg%20fill%3D%27white%27%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20d%3D%27M23.374.287a1.5%2C1.5%2C0%2C0%2C0-2.093.345L7.246%2C20.2%2C2.561%2C15.511A1.5%2C1.5%2C0%2C1%2C0%2C.439%2C17.632l5.935%2C5.934a1.525%2C1.525%2C0%2C0%2C0%2C2.279-.186l15.066-21A1.5%2C1.5%2C0%2C0%2C0%2C23.374.287Z%27%20%2F%3E%3C%2Fsvg%3E\") no-repeat 0 0;background-size:100% auto}.duet-checkbox[disabled]{cursor:default}.duet-checkbox[disabled]+label{color:rgb(98, 121, 138)}.duet-theme-turva .duet-checkbox[disabled]+label{color:rgb(143, 147, 158)}.duet-checkbox[disabled]+label::before{border-color:rgb(181, 198, 208)}.duet-theme-turva .duet-checkbox[disabled]+label::before{border-color:rgb(199, 202, 207)}.duet-checkbox[disabled]:checked+label::before{background:rgb(127, 150, 165);border:1px solid rgb(127, 150, 165)}.duet-theme-turva .duet-checkbox[disabled]:checked+label::before{background:rgb(143, 147, 158);border-color:rgb(143, 147, 158)}.duet-checkbox-error{margin-left:31px;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;line-height:1.25;color:rgb(214, 28, 82);border-radius:4px}.duet-theme-turva .duet-checkbox-error{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(214, 28, 82)}.duet-label-hidden .duet-label span,.duet-label-hidden .duet-checkbox-error span{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);border:0}";
-const DuetCheckboxStyle0 = duetCheckboxCss;
-
-const DuetCheckbox = /*@__PURE__*/ proxyCustomElement(class DuetCheckbox extends H {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-        this.duetChange = createEvent(this, "duetChange", 3);
-        this.duetFocus = createEvent(this, "duetFocus", 7);
-        this.duetBlur = createEvent(this, "duetBlur", 7);
-        /**
-         * Own Properties.
-         */
-        this.checkboxId = createID("DuetCheckbox");
-        this.errorId = createID("DuetError");
-        /**
-         * Component event handling.
-         */
-        this.onChange = (ev) => {
-            this.checked = !this.checked;
-            this.duetChange.emit({
-                originalEvent: ev,
-                checked: this.checked,
-                value: this.value,
-                component: "duet-checkbox",
-            });
-        };
-        this.onBlur = (ev) => {
-            this.duetBlur.emit({
-                originalEvent: ev,
-                checked: this.checked,
-                value: this.value,
-                component: "duet-checkbox",
-            });
-        };
-        this.onFocus = (ev) => {
-            this.duetFocus.emit({
-                originalEvent: ev,
-                checked: this.checked,
-                value: this.value,
-                component: "duet-checkbox",
-            });
-        };
-        this.getDescribedBy = () => {
-            const describedBy = [];
-            if (this.accessibleDescribedBy) {
-                describedBy.push(this.accessibleDescribedBy);
-            }
-            if (this.error) {
-                describedBy.push(this.errorId);
-            }
-            return describedBy.length > 0 ? describedBy.join(" ") : null;
-        };
-        this.accessibleActiveDescendant = undefined;
-        this.margin = "auto";
-        this.accessibleControls = undefined;
-        this.accessibleIndex = undefined;
-        this.accessibleOwns = undefined;
-        this.accessibleDescribedBy = undefined;
-        this.accessibleDetails = undefined;
-        this.accessibleLabelledBy = undefined;
-        this.accessibleDescription = undefined;
-        this.accessibleSelected = undefined;
-        this.accessibleLiveError = "polite";
-        this.required = false;
-        this.error = "";
-        this.theme = "";
-        this.disabled = false;
-        this.identifier = undefined;
-        this.label = "label";
-        this.labelHidden = false;
-        this.name = undefined;
-        this.role = undefined;
-        this.checked = false;
-        this.value = undefined;
-    }
-    /**
-     * Component lifecycle events.
-     */
-    componentWillLoad() {
-        inheritGlobalTheme(this);
-        if (this.value === undefined) {
-            this.value = this.identifier;
-        }
-    }
-    /**
-     * Sets focus on the specified `duet-checkbox`. Use this method instead of the global
-     * `input.focus()`.
-     */
-    async setFocus(options) {
-        this.nativeInput.focus(options);
-    }
-    /**
-     * render() function
-     * Always the last one in the class.
-     */
-    render() {
-        const identifier = this.identifier || this.checkboxId;
-        return (h(Host, { key: 'b766728b3dfefde1c6deefe6d0db2f549cd8aad3', class: { "duet-m-0": this.margin === "none" } }, h("div", { key: 'caeaf8e29cbfdc3f684a64a5c7e7e5ef6513432b', class: {
-                "duet-checkbox-container": true,
-                "duet-label-hidden": this.labelHidden,
-                "duet-theme-turva": this.theme === "turva",
-            } }, h("input", { key: '6ab801fbe93327d25187b276878076bcfdf48b36', ref: input => (this.nativeInput = input), type: "checkbox", onFocus: this.onFocus, onBlur: this.onBlur, onChange: this.onChange, value: this.value, class: { "duet-checkbox": true, disabled: this.disabled }, checked: this.checked, disabled: this.disabled, tabindex: this.accessibleIndex, "aria-invalid": this.error ? "true" : "false", "aria-controls": this.accessibleControls, "aria-activedescendant": this.accessibleActiveDescendant, "aria-owns": this.accessibleOwns, "aria-describedby": this.getDescribedBy(), "aria-labelledby": this.accessibleLabelledBy, "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, "aria-selected": this.accessibleSelected, required: this.required, role: this.role, name: this.name, id: identifier }), h("label", { key: '68e27e7756a0db41709ff8a3ae200ee99ff786b1', class: "duet-label", htmlFor: identifier }, h("span", { key: '3db3ad22a9878f989e6dc47fee0c37c7d5195f42' }, this.label)), h("div", { key: '9d27e662b34db5a4db91e3a7e7d9f989ba933f94', class: "duet-checkbox-error", id: this.errorId, "aria-atomic": "true", "aria-live": this.accessibleLiveError, "aria-relevant": "additions removals" }, this.error && h("span", { key: '7901825f9db5ff2a62876fa4324b449155ffac6a' }, this.error)))));
-    }
-    get element() { return this; }
-    static get style() { return DuetCheckboxStyle0; }
-}, [1, "duet-checkbox", {
-        "accessibleActiveDescendant": [1, "accessible-active-descendant"],
-        "margin": [1],
-        "accessibleControls": [1, "accessible-controls"],
-        "accessibleIndex": [1, "accessible-index"],
-        "accessibleOwns": [1, "accessible-owns"],
-        "accessibleDescribedBy": [1, "accessible-described-by"],
-        "accessibleDetails": [1, "accessible-details"],
-        "accessibleLabelledBy": [1, "accessible-labelled-by"],
-        "accessibleDescription": [1, "accessible-description"],
-        "accessibleSelected": [1, "accessible-selected"],
-        "accessibleLiveError": [1, "accessible-live-error"],
-        "required": [4],
-        "error": [1],
-        "theme": [1025],
-        "disabled": [516],
-        "identifier": [1],
-        "label": [1],
-        "labelHidden": [4, "label-hidden"],
-        "name": [1],
-        "role": [1],
-        "checked": [1540],
-        "value": [1537],
-        "setFocus": [64]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["duet-checkbox"];
-    components.forEach(tagName => { switch (tagName) {
-        case "duet-checkbox":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, DuetCheckbox);
-            }
-            break;
-    } });
-}
-
-export { DuetCheckbox as D, defineCustomElement as d };