@duetds/components 10.0.0-alpha.13 → 10.0.0-alpha.14

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

@@ -1,453 +0,0 @@
-/*!
- * Built with Duet Design System
- */
-import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-f2c2f3d2.js';
-import { s as spaceXSmall } from './p-cea716f7.js';
-import { o as offset, f as flip, s as shift, c as computePosition, a as autoUpdate, d as defineCustomElement$4 } from './p-821de204.js';
-import { i as inheritGlobalTheme } from './p-aaa7a7bd.js';
-import { f as focusElement } from './p-e30dc66d.js';
-import { g as isArrowDownKey, b as isEscapeKey, f as isArrowUpKey, d as isTabKey } from './p-8db11326.js';
-import { a as getLanguage } from './p-35375593.js';
-import { T as Teleport } from './p-8cb0e6bd.js';
-import { d as defineCustomElement$a } from './p-42c1fc90.js';
-import { d as defineCustomElement$9 } from './p-ef48f2c7.js';
-import { d as defineCustomElement$8 } from './p-7b6a89e9.js';
-import { d as defineCustomElement$7 } from './p-3695c0cf.js';
-import { d as defineCustomElement$6 } from './p-a1b0454c.js';
-import { d as defineCustomElement$5 } from './p-f8ba399b.js';
-import { d as defineCustomElement$3 } from './p-91688dd8.js';
-import { d as defineCustomElement$2 } from './p-0cd28b7b.js';
-import { d as defineCustomElement$1 } from './p-4f6ac36d.js';
-
-const duetPopupMenuCss = "*,*::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}.duet-popup-menu-list{position:absolute;top:0;left:0;z-index:950;width:max-content;min-width:175px;padding:8px;margin:0;color:rgb(8, 42, 77);list-style:none;visibility:hidden !important;background:rgb(255, 255, 255);border-radius:8px;box-shadow:0 0 0 1px rgba(0, 0, 0, 0.07), 0 4px 10px 0 rgba(0, 41, 77, 0.15);opacity:0;transition:transform 300ms ease, visibility 300ms ease, opacity 300ms ease;transform:scaleY(0);transform-origin:top center}.duet-popup-menu-list.open{visibility:visible !important;opacity:1;transform:scaleY(1)}.duet-popup-menu-list.fixed{position:fixed}.duet-popup-menu-list.scroll-visible{overflow-y:scroll;scroll-margin:20px}.duet-popup-menu-list.duet-theme-turva{color:rgb(23, 28, 58) !important;background:rgb(255, 255, 255)}::slotted(duet-notification){max-width:360px}";
-const DuetPopupMenuStyle0 = duetPopupMenuCss;
-
-const DuetPopupMenu = /*@__PURE__*/ proxyCustomElement(class DuetPopupMenu extends H {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-        this.duetToggle = createEvent(this, "duetToggle", 7);
-        this.filterLabel = {
-            en: "Filter menu",
-            fi: "Suodata valikkoa",
-            sv: "Filtrera meny",
-        };
-        this.filterResultCountLabel = {
-            en: "items match filter",
-            fi: "kohtaa vastaa suodatinta",
-            sv: "menyalternativ matchar filtret",
-        };
-        this.setOpenButton = (element) => {
-            if (!element) {
-                return;
-            }
-            try {
-                const button = element;
-                button.accessiblePopup = "true";
-                button.accessibleExpanded = false;
-                if (this.controllerIcon) {
-                    button.setAttribute("trailing-icon", "action-arrow-down-small");
-                }
-                this.openButton = button;
-            }
-            catch (_e) { }
-        };
-        this.openButtonEventListener = () => {
-            this.toggle();
-        };
-        this.updatePlacement = async () => {
-            if (!this.openButton) {
-                return;
-            }
-            const middleware = [
-                offset({ mainAxis: this.mainAxisOffset, crossAxis: this.crossAxisOffset }),
-                this.allowVerticalFlip && flip(),
-                shift({ padding: 5 }),
-            ].filter(Boolean);
-            const coordinates = await computePosition(this.openButton, this.menuElement, {
-                middleware,
-                placement: this.placement,
-                strategy: this.position,
-            });
-            this.menuY = coordinates.y;
-            this.menuX = coordinates.x;
-        };
-        this.getNonFilteredItems = () => {
-            return this.showFilterInput ? this.itemElements.filter(i => i.style.display !== "none") : this.itemElements;
-        };
-        this.filterItems = () => {
-            var _a;
-            const filterText = (_a = this.filterInput.value) === null || _a === void 0 ? void 0 : _a.toLocaleLowerCase();
-            const items = this.itemElements;
-            items.forEach(item => {
-                var _a;
-                item.style.display =
-                    !filterText ||
-                        item.textContent.toLowerCase().includes(filterText) ||
-                        ((_a = item.value) === null || _a === void 0 ? void 0 : _a.toLowerCase().includes(filterText))
-                        ? ""
-                        : "none";
-            });
-            this.filterResultCount = items.filter(i => i.style.display !== "none").length;
-        };
-        this.handleKeyDownOnFilter = (ev) => {
-            var _a;
-            if (isArrowDownKey(ev)) {
-                (_a = this.getNonFilteredItems()[0]) === null || _a === void 0 ? void 0 : _a.setFocus();
-            }
-        };
-        this.open = false;
-        this.menuY = undefined;
-        this.menuX = undefined;
-        this.filterResultCount = undefined;
-        this.language = getLanguage();
-        this.accessibleLabel = undefined;
-        this.accessibleRole = "menu";
-        this.theme = "";
-        this.skipTeleport = undefined;
-        this.placement = "bottom-start";
-        this.forcePlacement = false;
-        this.allowVerticalFlip = true;
-        this.position = "absolute";
-        this.mainAxisOffset = 0;
-        this.crossAxisOffset = 0;
-        this.controllerIcon = "action-arrow-down-small";
-        this.scrollLimit = undefined;
-        this.showFilterInput = undefined;
-    }
-    /**
-     * Element, or id of an element, that controls the opening and closing of the popup menu. If id is given,
-     * the component automatically sets the click event listener to open and close the popup-menu.
-     */
-    get controller() {
-        return this._controller;
-    }
-    set controller(value) {
-        if (this._controller === value) {
-            return;
-        }
-        this._controller = value;
-        if (typeof value === "string") {
-            this.setOpenButton(document.getElementById(value));
-            if (this.openButton) {
-                this.openButton.addEventListener("click", this.openButtonEventListener);
-            }
-        }
-        else {
-            this.setOpenButton(value);
-        }
-    }
-    /**
-     * Alias for property controller.
-     */
-    get opener() {
-        return this._controller;
-    }
-    set opener(value) {
-        this.controller = value;
-    }
-    /**
-     * Component lifecycle events.
-     */
-    componentWillLoad() {
-        inheritGlobalTheme(this);
-    }
-    componentDidLoad() {
-        {
-            this.updatePlacement();
-        }
-    }
-    connectedCallback() {
-        if (!this.teleport) {
-            this.teleport = new Teleport(this.element);
-        }
-        if (this.teleport) {
-            this.teleport.activate();
-        }
-    }
-    disconnectedCallback() {
-        if (this.autoUpdateCleanup) {
-            this.autoUpdateCleanup();
-        }
-        if (this.openButton) {
-            this.openButton.removeEventListener("click", this.openButtonEventListener);
-            if (this.controllerIcon) {
-                this.openButton.removeAttribute("trailing-icon");
-            }
-        }
-    }
-    /**
-     * Component event handling.
-     */
-    handleKeyUp(evt) {
-        if (this.open) {
-            // When Esc is pressed the menu should be closed
-            if (isEscapeKey(evt)) {
-                this.hide();
-            }
-        }
-    }
-    async handleKeyDown(evt) {
-        const items = this.getNonFilteredItems();
-        if (this.open) {
-            if (isArrowDownKey(evt)) {
-                evt.preventDefault();
-                const current = await this.getFocusedItemIndex();
-                if (current !== -1) {
-                    if (current < items.length - 1) {
-                        items[current + 1].setFocus();
-                    }
-                    else {
-                        items[0].setFocus();
-                    }
-                }
-            }
-            if (isArrowUpKey(evt)) {
-                evt.preventDefault();
-                const current = await this.getFocusedItemIndex();
-                if (current !== -1) {
-                    if (current === 0) {
-                        if (this.showFilterInput) {
-                            this.filterInput.setFocus();
-                        }
-                        else {
-                            items[items.length - 1].setFocus();
-                        }
-                    }
-                    else {
-                        items[current - 1].setFocus();
-                    }
-                }
-            }
-            if (isTabKey(evt) && this.accessibleRole === "menu") {
-                evt.preventDefault();
-                this.hide();
-            }
-        }
-    }
-    handleClick(evt) {
-        const isClickOutside = evt.composedPath().every(node => node !== this.element && node !== this.openButton);
-        if (this.open && isClickOutside) {
-            this.hide();
-        }
-    }
-    /**
-     * isOpen.
-     */
-    async isOpen() {
-        return this.open;
-    }
-    /**
-     * Show.
-     */
-    async show() {
-        this.open = true;
-    }
-    /**
-     * Hide.
-     */
-    async hide() {
-        if (this.autoUpdateCleanup) {
-            this.autoUpdateCleanup();
-        }
-        this.open = false;
-    }
-    /**
-     * Toggle.
-     */
-    async toggle() {
-        if (this.open) {
-            this.hide();
-        }
-        else {
-            this.show();
-        }
-    }
-    handleOpenChange(newValue, oldValue) {
-        if (!!newValue === !!oldValue) {
-            return;
-        }
-        if (this.open && !oldValue) {
-            if (this.openButton) {
-                this.openButton.accessibleExpanded = true;
-            }
-            if (this.accessibleRole !== "listbox") {
-                this.teleport.makeSiblingsInert();
-            }
-            this.updatePlacement();
-            // Start autoUpdate when menu is open
-            if (this.menuElement && this.openButton) {
-                this.autoUpdateCleanup = autoUpdate(this.openButton, this.menuElement, this.updatePlacement);
-            }
-            if (this.showFilterInput) {
-                this.filterInput.value = "";
-                this.filterItems();
-            }
-            setTimeout(() => {
-                if (this.accessibleRole === "menu") {
-                    this.itemElements[0].setFocus();
-                }
-                this.duetToggle.emit({ open: this.open, component: "duet-popup-menu" });
-            }, 200);
-        }
-        else if (!this.open && oldValue) {
-            if (this.openButton) {
-                this.openButton.accessibleExpanded = false;
-            }
-            // Clean up autoUpdate when closed
-            if (this.autoUpdateCleanup) {
-                this.autoUpdateCleanup();
-            }
-            setTimeout(() => {
-                if (this.accessibleRole === "menu") {
-                    focusElement(this.openButton);
-                }
-                this.duetToggle.emit({ open: this.open, component: "duet-popup-menu" });
-                if (this.accessibleRole !== "listbox") {
-                    this.teleport.removeInertFromSiblings();
-                }
-            }, 200);
-        }
-    }
-    get itemElements() {
-        return Array.from(this.element.querySelectorAll(":scope duet-popup-menu-item"));
-    }
-    get popupMenuStyleHeight() {
-        const selector = ":scope duet-popup-menu-item, :scope duet-notification";
-        const elements = Array.from(this.element.querySelectorAll(selector));
-        if (elements.length > 0 && this.scrollLimit) {
-            const paddings = Number(spaceXSmall.replace("px", "")) * 2;
-            return `${elements[0].offsetHeight * this.scrollLimit + paddings}px`;
-        }
-        else {
-            return "auto";
-        }
-    }
-    async getFocusedItemIndex() {
-        const items = this.getNonFilteredItems();
-        for (let i = 0; i < items.length; i++) {
-            if (await items[i].isFocused()) {
-                return i;
-            }
-        }
-        return -1;
-    }
-    render() {
-        const styles = {
-            top: `${this.menuY}px`,
-            left: `${this.menuX}px`,
-            position: this.position,
-            overflowY: "auto",
-            height: this.popupMenuStyleHeight,
-        };
-        return (h(Host, { key: 'c9ec4d5a1aa99154d18f8449e9812aabfff46999' }, h("div", { key: '19a449f171e567d1ad3737b7d937c976a98e8498', ref: element => {
-                this.menuElement = element;
-            }, style: styles, class: {
-                open: this.open,
-                "duet-popup-menu-list": true,
-                "duet-theme-turva": this.theme === "turva",
-                "scroll-visible": this.scrollLimit < this.itemElements.length,
-            }, role: this.accessibleRole, "aria-label": this.accessibleLabel }, this.showFilterInput && (h("div", { key: 'd3305f4cc70d2eeefcc2298a387413882699f3a8' }, h("duet-input", { key: 'cb325a9abe4af32e96f24544d9e8093cf246eb9f', ref: el => (this.filterInput = el), label: this.filterLabel[this.language], "label-hidden": true, expand: true, margin: "none", type: "search", onDuetInput: this.filterItems, onKeyDown: this.handleKeyDownOnFilter }), h("duet-visually-hidden", { key: '89e754e2f45b8bcc101e3159692c2a8c0f45826d' }, h("span", { key: 'fd68da56e5e6166c8c29e5c1eb4ab9347e960769', role: "status" }, `
-                  ${this.filterResultCount}/${this.itemElements.length}
-                  ${this.filterResultCountLabel[this.language]}
-                `)), h("duet-spacer", { key: 'c1ad578949bea8f526acd9ab7e6c5f9aa26900a3', size: "xx-small" }))), h("slot", { key: '294cf8aa2cf3f4f99dfda8a25d70ce9b7da3f485' }))));
-    }
-    get element() { return this; }
-    static get watchers() { return {
-        "open": ["handleOpenChange"]
-    }; }
-    static get style() { return DuetPopupMenuStyle0; }
-}, [1, "duet-popup-menu", {
-        "accessibleLabel": [1, "accessible-label"],
-        "accessibleRole": [1, "accessible-role"],
-        "theme": [1025],
-        "skipTeleport": [4, "skip-teleport"],
-        "controller": [6145],
-        "opener": [6145],
-        "placement": [1],
-        "forcePlacement": [4, "force-placement"],
-        "allowVerticalFlip": [4, "allow-vertical-flip"],
-        "position": [1025],
-        "mainAxisOffset": [2, "main-axis-offset"],
-        "crossAxisOffset": [2, "cross-axis-offset"],
-        "controllerIcon": [1, "controller-icon"],
-        "scrollLimit": [2, "scroll-limit"],
-        "showFilterInput": [4, "show-filter-input"],
-        "open": [32],
-        "menuY": [32],
-        "menuX": [32],
-        "filterResultCount": [32],
-        "language": [32],
-        "isOpen": [64],
-        "show": [64],
-        "hide": [64],
-        "toggle": [64]
-    }, [[8, "keyup", "handleKeyUp"], [8, "keydown", "handleKeyDown"], [8, "click", "handleClick"]], {
-        "open": ["handleOpenChange"]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["duet-popup-menu", "duet-button", "duet-caption", "duet-icon", "duet-input", "duet-spacer", "duet-spinner", "duet-tooltip", "duet-tooltip-button", "duet-tooltip-popup", "duet-visually-hidden"];
-    components.forEach(tagName => { switch (tagName) {
-        case "duet-popup-menu":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, DuetPopupMenu);
-            }
-            break;
-        case "duet-button":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$a();
-            }
-            break;
-        case "duet-caption":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$9();
-            }
-            break;
-        case "duet-icon":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$8();
-            }
-            break;
-        case "duet-input":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$7();
-            }
-            break;
-        case "duet-spacer":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$6();
-            }
-            break;
-        case "duet-spinner":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$5();
-            }
-            break;
-        case "duet-tooltip":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$4();
-            }
-            break;
-        case "duet-tooltip-button":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$3();
-            }
-            break;
-        case "duet-tooltip-popup":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$2();
-            }
-            break;
-        case "duet-visually-hidden":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$1();
-            }
-            break;
-    } });
-}
-
-export { DuetPopupMenu as D, defineCustomElement as d };

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

@@ -1,213 +0,0 @@
-/*!
- * Built with Duet Design System
- */
-import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-f2c2f3d2.js';
-import { i as inheritGlobalTheme } from './p-aaa7a7bd.js';
-import { c as createID } from './p-5e59e970.js';
-import { s as subscribeTabbingChange, u as unsubscribeTabbingChange } from './p-8db11326.js';
-import { g as getLocaleString, c as connectLanguageChangeObserver, d as disconnectLanguageChangeObserver } from './p-35375593.js';
-import { h as hasSlot } from './p-ad615991.js';
-import { d as defineCustomElement$6 } from './p-42c1fc90.js';
-import { d as defineCustomElement$5 } from './p-7b6a89e9.js';
-import { d as defineCustomElement$4 } from './p-28c85b1c.js';
-import { d as defineCustomElement$3 } from './p-f8ba399b.js';
-import { d as defineCustomElement$2 } from './p-a39af5e2.js';
-import { d as defineCustomElement$1 } from './p-4f6ac36d.js';
-
-const duetAlertCss = "*,*::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;width:100%;max-height:999px;transition:opacity 300ms ease, visibility 300ms ease, transform 300ms ease, max-height 300ms ease}:host(:focus){outline:0}:host(.user-is-tabbing:focus){border-radius:4px;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}:host(.user-is-tabbing.duet-theme-turva:focus){box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}:host(.duet-alert-is-dismissed){max-height:0;overflow:hidden;visibility:hidden !important;opacity:0;transform:scale(0.98)}:host(.duet-alert-is-dismissed) .duet-alert{margin:0 !important}.duet-alert-wrapper{margin-bottom:16px !important;position:relative;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.25;color:rgb(8, 42, 77);background:rgb(228, 241, 247);border:1px solid rgb(172, 210, 229);border-radius:12px;transition:margin 100ms 300ms ease}.duet-alert-wrapper.duet-p-0{padding:0 !important}.duet-alert-wrapper.duet-m-0{margin:0 !important}.duet-alert-wrapper.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\"}.duet-alert-wrapper.warning{color:rgb(38, 26, 4);background:rgb(255, 247, 221);border:1px solid rgb(255, 217, 120)}.duet-alert-wrapper.danger{color:rgb(89, 0, 45);background:rgb(255, 225, 231);border:1px solid rgb(252, 136, 162)}.duet-alert-wrapper.success{color:rgb(4, 38, 33);background:rgb(231, 248, 239);border:1px solid rgb(163, 229, 202)}.duet-alert-wrapper.below-nav{margin-bottom:0 !important;border:0;border-bottom:1px solid rgb(212, 223, 229);border-radius:0}.duet-alert-wrapper .duet-alert{position:relative;width:100%;max-width:1384px;padding:16px;margin:0 auto}.duet-alert-wrapper .duet-alert.duet-alert-is-dismissible{padding:16px 72px 16px 16px;text-align:left}.duet-alert-wrapper .duet-alert.duet-alert-is-dismissible .duet-alert-container{text-align:left}.duet-alert-wrapper .duet-alert.duet-alert-has-show-more{padding-bottom:0}.duet-alert-wrapper .duet-alert.duet-alert-has-icon .duet-alert-show-more{margin-left:36px}.duet-alert-wrapper .duet-alert.duet-alert-expandable{padding-right:20px}.duet-alert-dismiss{position:absolute;top:3px;right:3px}.duet-alert-dismiss duet-button:hover{background-color:rgb(198, 225, 238);border-radius:8px}.warning .duet-alert-dismiss duet-button:hover{background-color:rgb(255, 232, 160)}.danger .duet-alert-dismiss duet-button:hover{background-color:rgb(255, 173, 190)}.success .duet-alert-dismiss duet-button:hover{background-color:rgb(191, 239, 218)}.duet-alert-container{display:inline-flex;align-items:flex-start;width:100%;margin:0 auto !important}.duet-alert-container .duet-alert-content{flex-grow:1;line-height:1.5}.duet-alert-has-icon .duet-alert-container{margin-top:2px !important}.duet-alert-container:focus{outline:none}.duet-alert-icon{position:relative;top:2px;display:inline-block;width:20px;min-width:20px;height:20px;margin:0 16px 0 0 !important}.duet-alert-icon duet-icon{width:20px;height:20px}.duet-alert-expander{display:flex;gap:16px;align-items:flex-start;justify-content:space-between;width:calc(100% + 32px + 40px);padding:16px;padding-right:20px;padding-left:52px;margin:-16px;margin-left:-52px;font-family:inherit;color:inherit;cursor:pointer;background-color:inherit}.duet-alert-expanded .duet-alert-expander{margin-bottom:-4px}.duet-alert-expander .expanding-title{flex-grow:1;font-size:1rem;line-height:1.5;text-align:left}.duet-alert-expander duet-icon{position:relative;top:4px;transition:rotate 300ms ease}.duet-alert-expanded .duet-alert-expander duet-icon{rotate:180deg}.duet-alert-expander:hover{filter:brightness(85%)}";
-const DuetAlertStyle0 = duetAlertCss;
-
-const DuetAlert = /*@__PURE__*/ proxyCustomElement(class DuetAlert extends H {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-        this.duetDismiss = createEvent(this, "duetDismiss", 7);
-        this.duetCloseComplete = createEvent(this, "duetCloseComplete", 7);
-        this.descriptiveId = createID("DuetAlert");
-        this.hasShowMoreSlot = false;
-        this.handleDismiss = (ev) => {
-            this.handleHide();
-            this.duetDismiss.emit({
-                component: "duet-alert",
-                originalEvent: ev,
-            });
-        };
-        this.handleShow = () => {
-            this.isDismissed = false;
-        };
-        this.handleHide = () => {
-            this.isDismissed = true;
-            this.element.addEventListener("transitionend", () => this.duetCloseComplete.emit(), { once: true });
-        };
-        this.handleExpandToggle = () => {
-            this.isExpanded = !this.isExpanded;
-        };
-        this.theme = "";
-        this.isDismissed = false;
-        this.isExpanded = false;
-        this.timeoutID = undefined;
-        this.accessibleLabelDefaults = {
-            fi: "Painike viestin sulkemiseen",
-            sv: "Knapp för att stänga meddelandet",
-            en: "Button to close the message",
-        };
-        this.accessibleLabel = getLocaleString(this.accessibleLabelDefaults);
-        this.announcements = true;
-        this.icon = "";
-        this.autoDismiss = undefined;
-        this.margin = "auto";
-        this.padding = "auto";
-        this.variation = "default";
-        this.position = "content";
-        this.dismissible = false;
-        this.focusable = false;
-        this.expandingTitle = "";
-    }
-    /**
-     * Component lifecycle events.
-     */
-    componentWillLoad() {
-        inheritGlobalTheme(this);
-        this.hasShowMoreSlot = hasSlot(this.element, "show-more");
-    }
-    componentDidLoad() {
-        if (this.autoDismiss) {
-            this.timeoutID = setTimeout(() => this.handleDismiss(), this.autoDismiss);
-        }
-    }
-    connectedCallback() {
-        connectLanguageChangeObserver(this, { prop: "accessibleLabel", defaults: "accessibleLabelDefaults" });
-        subscribeTabbingChange(this);
-    }
-    disconnectedCallback() {
-        if (this.timeoutID) {
-            clearTimeout(this.timeoutID);
-        }
-        disconnectLanguageChangeObserver(this);
-        unsubscribeTabbingChange(this);
-    }
-    /**
-     * Show.
-     */
-    async show() {
-        this.handleShow();
-    }
-    /**
-     * Hide.
-     */
-    async hide() {
-        this.handleHide();
-    }
-    /**
-     * Sets focus on the specified `duet-alert`.
-     * Works only when focusable property is set to true.
-     * Use this method instead of the global
-     * `button.focus()`.
-     */
-    async setFocus(options) {
-        this.alertContainer.focus(options);
-    }
-    /**
-     * There is bug in NVDA screen reader
-     * that is causing multiple alert readings
-     * when alert contains other components (link, button etc.).
-     */
-    /**
-     * render() function
-     * Always the last one in the class.
-     */
-    render() {
-        return (h(Host, { key: 'ae55751444a59a0630329e55f88711761506aa5f', class: {
-                "duet-theme-turva": this.theme === "turva",
-                "duet-alert-is-dismissed": this.isDismissed,
-            }, role: this.announcements ? "alert" : undefined }, h("div", { key: '03074d2258592e0ffa63f933f291667050116d87', class: {
-                "duet-alert-wrapper": true,
-                "duet-p-0": this.padding === "none",
-                "duet-m-0": this.margin === "none",
-                [this.variation]: true,
-                [this.position]: true,
-                "duet-theme-turva": this.theme === "turva",
-            } }, h("div", { key: '8a8ba0be00f76fc59c9e6f800ab5e7187c1708d9', class: {
-                "duet-alert": true,
-                "duet-alert-expandable": !!this.expandingTitle,
-                "duet-alert-expanded": this.isExpanded,
-                "duet-alert-has-icon": !!this.icon || this.position === "below-nav",
-                "duet-alert-has-show-more": this.hasShowMoreSlot,
-                "duet-alert-is-dismissible": this.dismissible,
-                "duet-p-0": this.padding === "none",
-                "duet-m-0": this.margin === "none",
-                [this.variation]: true,
-                "duet-theme-turva": this.theme === "turva",
-            } }, h("div", { key: '7ea557b2dbf25762a9382fb05a562dd92ba94a0d', class: "duet-alert-container", ref: element => {
-                this.alertContainer = element;
-            }, tabindex: this.focusable ? "0" : undefined }, this.position !== "below-nav" && (h("div", { key: '8e1ffa6107c2cd63f831bdfa0d80fdc0565bdfc1', class: "duet-alert-icon" }, (this.icon && h("duet-icon", { key: '0e2cddc6680f121ac6837f426c135d94fec8fd4f', size: "auto", name: this.icon, color: "currentColor" })) || (h("duet-status-icon", { key: '22400d9ead5d0d2153077460773ac2dc3b60b0ec', strong: true, variation: this.variation, margin: "none", size: "auto" })))), this.position === "below-nav" && (h("div", { key: '5b40ce74518e3cd6d0bb90d925578b1b8118ca82', class: "duet-alert-icon below-nav" }, h("duet-status-icon", { key: '2be267d6749de5f4ba1694b82c2117b2553834e3', strong: true, variation: this.variation, margin: "none", size: "auto" }))), h("div", { key: 'b806ffa20525c37ea87b4e57b5354181fa4cb8ea', class: "duet-alert-content", id: this.descriptiveId }, this.expandingTitle && (h("button", { key: '04956e8168dbd2e3dc200b0c0a4ccd5da3290f2a', "aria-expanded": this.isExpanded.toString(), "aria-controls": `${this.descriptiveId}-content`, class: "duet-alert-expander", onClick: this.handleExpandToggle }, h("span", { key: '63ae4a87fbe7e728c81183def7afdf108588f83e', class: "expanding-title" }, this.expandingTitle), h("duet-icon", { key: 'fb34541b1a576e13e5505e38a944b03a4799a0cf', name: "action-arrow-down", color: this.variation === "default" ? "lt-blue-800" : `${this.variation}-800`, margin: "none", size: "x-small" }))), (!this.expandingTitle || this.isExpanded) && (h("div", { key: '05754aa30c0d0f9062047c766c0a1151b4599a26', id: `${this.descriptiveId}-content` }, h("slot", { key: '213940d0f233bd4762584448579ad48477d564dd' }))))), this.hasShowMoreSlot && (h("duet-show-more", { key: '328837aa4a239bdad2e1a63811ccf64d818863b1', margin: "none", class: "duet-alert-show-more" }, h("slot", { key: '6200788cc7facca8507701008dfdb22d5034a974', name: "show-more" }))), this.dismissible && !this.expandingTitle && (h("div", { key: '0302d1c6d386bdca47034e4e08f694d6dcd64149', class: "duet-alert-dismiss" }, h("duet-button", { key: '73c78cce1ec34e97b139d267d7efd56d231a8a95', variation: "plain", accessibleLabel: this.accessibleLabel, accessibleDescribedBy: this.descriptiveId, iconSize: "medium", icon: "navigation-close", iconOnly: true, margin: "none", color: this.variation === "default" ? "lt-blue-800" : `${this.variation}-800`, theme: this.theme, onClick: this.handleDismiss, fixed: true })))))));
-    }
-    get element() { return this; }
-    static get style() { return DuetAlertStyle0; }
-}, [1, "duet-alert", {
-        "theme": [1025],
-        "accessibleLabelDefaults": [1, "accessible-label-default"],
-        "accessibleLabel": [1025, "accessible-label"],
-        "announcements": [4],
-        "icon": [1],
-        "autoDismiss": [2, "auto-dismiss"],
-        "margin": [1],
-        "padding": [1],
-        "variation": [1],
-        "position": [1],
-        "dismissible": [4],
-        "focusable": [4],
-        "expandingTitle": [1, "expanding-title"],
-        "isDismissed": [32],
-        "isExpanded": [32],
-        "timeoutID": [32],
-        "show": [64],
-        "hide": [64],
-        "setFocus": [64]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["duet-alert", "duet-button", "duet-icon", "duet-show-more", "duet-spinner", "duet-status-icon", "duet-visually-hidden"];
-    components.forEach(tagName => { switch (tagName) {
-        case "duet-alert":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, DuetAlert);
-            }
-            break;
-        case "duet-button":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$6();
-            }
-            break;
-        case "duet-icon":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$5();
-            }
-            break;
-        case "duet-show-more":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$4();
-            }
-            break;
-        case "duet-spinner":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$3();
-            }
-            break;
-        case "duet-status-icon":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$2();
-            }
-            break;
-        case "duet-visually-hidden":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$1();
-            }
-            break;
-    } });
-}
-
-export { DuetAlert as D, defineCustomElement as d };