@duetds/components 8.5.1 → 8.5.2

package/lib/collection/components/duet-modal/duet-modal.e2e.js

@@ -1,7 +1,7 @@
 /*!
  * Built with Duet Design System
  */
-import { createPage, isFocused } from "../../utils/test-utils";
+import { createPage } from "../../utils/test-utils";
 describe("duet-modal", () => {
     // we want to wait for modal to be focused to ensure close button
     // automatically receives focus when `active` prop is `true`
@@ -59,39 +59,6 @@ describe("duet-modal", () => {
         const element = await page.find("duet-modal >>> .duet-modal-container");
         expect(element).toHaveClass("duet-modal-active");
     });
-    it("traps focus", async () => {
-        const page = await createPage(`
-      <duet-modal
-        size="small"
-        heading="Modal test"
-        icon="damage-breakage"
-        class="duet-text-center"
-        active
-      >
-        <duet-paragraph>
-          Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore
-          magna aliqua. Ut enim ad minim veniam quis nostrud.
-        </duet-paragraph>
-        <duet-paragraph>
-          Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt.
-        </duet-paragraph>
-        <duet-collapsible heading="Click to open details">
-          Lorem ipsum dolor sit, amet consectetur adipisicing elit.
-          Aperiam impedit, possimus minima repudiandae.
-        </duet-collapsible>
-      </duet-modal>
-    `);
-        await page.find("duet-modal");
-        await page.waitForFunction(isModalFocused);
-        // tab to link in light dom
-        await page.keyboard.press("Tab");
-        const collapsible = await page.find("duet-collapsible >>> button");
-        expect(await isFocused(collapsible)).toBe(true);
-        // focus should now go back to close button
-        await page.keyboard.press("Tab");
-        const closeButton = await page.find("duet-modal >>> duet-button");
-        expect(await isFocused(closeButton)).toBe(true);
-    });
     it.skip("closes on blur", async () => {
         const page = await createPage(`
       <duet-modal

package/lib/collection/components/duet-modal/duet-modal.js

@@ -5,8 +5,7 @@ import { Build, h } from "@stencil/core";
 import { disableBodyScroll, enableBodyScroll } from "body-scroll-lock/lib/bodyScrollLock.es6.js";
 import { inheritGlobalTheme } from "../../common";
 import { DuetStringsPleaseWaitDefaults } from "../../common-strings";
-import { createID } from "../../utils/create-id";
-import { focusElement, FocusGuard } from "../../utils/focus-utils";
+import { focusElement } from "../../utils/focus-utils";
 import { isEscapeKey } from "../../utils/keyboard-utils";
 import { connectLanguageChangeObserver, disconnectLanguageChangeObserver, getLanguage, getLocaleString, } from "../../utils/language-utils";
 import { hasSlot } from "../../utils/slot-utils";
@@ -22,11 +21,6 @@ const TRANSITION_MS = 600;
 export class DuetModal {
     constructor() {
         var _a, _b;
-        /**
-         * Own Properties.
-         */
-        this.modalId = createID("DuetModal");
-        this.slotDefaultId = createID("DuetModal-default-slot");
         this.hasStickyHeader = false;
         this.isAndroidDevice = ((_b = (_a = navigator === null || navigator === void 0 ? void 0 : navigator.userAgent) === null || _a === void 0 ? void 0 : _a.toLowerCase()) === null || _b === void 0 ? void 0 : _b.indexOf("android")) > -1 || null;
         this.isSafariBrowser = /^((?!chrome|android).)*safari/i.test(navigator === null || navigator === void 0 ? void 0 : navigator.userAgent);
@@ -78,7 +72,7 @@ export class DuetModal {
             }
             this.focusedElBeforeOpen = document.activeElement;
             disableBodyScroll(this.modalEl, { reserveScrollBarGap: true });
-            this.teleport.go(true);
+            this.teleport.makeSiblingsInert();
             this.slotContainerEl.querySelectorAll(".duet-loader-message").forEach(el => el.remove());
             setTimeout(() => {
                 if (this.variation === "loader") {
@@ -102,7 +96,7 @@ export class DuetModal {
             this.modalEl.classList.remove("duet-disable-transitions");
             enableBodyScroll(this.modalEl);
             this.duetClose.emit();
-            this.teleport.resume(TRANSITION_MS);
+            this.teleport.removeInertFromSiblings(TRANSITION_MS);
             setTimeout(() => {
                 focusElement(this.focusedElBeforeOpen);
             }, TRANSITION_MS);
@@ -125,7 +119,6 @@ export class DuetModal {
         if (Build.isServer) {
             return;
         }
-        this.teleport = new Teleport(this.element);
         if (this.active) {
             // This specific line below can’t be moved to componentWillLoad()
             // as it breaks body scroll enabling.
@@ -134,6 +127,15 @@ export class DuetModal {
         }
     }
     connectedCallback() {
+        if (Build.isServer) {
+            return;
+        }
+        if (!this.teleport) {
+            this.teleport = new Teleport(this.element);
+        }
+        if (this.teleport) {
+            this.teleport.activate();
+        }
         connectLanguageChangeObserver(this, [
             { prop: "accessibleCloseLabel", defaults: "accessibleCloseLabelDefaults" },
             { prop: "accessibleLoaderAnnouncement", defaults: "accessibleLoaderAnnouncementDefaults" },
@@ -141,7 +143,9 @@ export class DuetModal {
     }
     disconnectedCallback() {
         disconnectLanguageChangeObserver(this);
-        enableBodyScroll(this.modalEl);
+        if (this.modalEl) {
+            enableBodyScroll(this.modalEl);
+        }
     }
     /**
      * Component event handling.
@@ -208,7 +212,7 @@ export class DuetModal {
      * Always the last one in the class.
      */
     render() {
-        var _a;
+        var _a, _b;
         let iconColor = "primary";
         let closeColor = "secondary";
         const closingButton = (h("div", { class: "duet-modal-close" }, h("duet-button", { ref: button => (this.buttonEl = button), variation: "plain", accessibleLabel: this.accessibleCloseLabel, color: closeColor, iconSize: "large", icon: "navigation-close", iconOnly: true, margin: "none", theme: this.theme, onClick: ev => this.closeModal(ev), fixed: true })));
@@ -216,13 +220,13 @@ export class DuetModal {
             iconColor = "primary-turva";
             closeColor = "secondary-turva";
         }
-        return (h("div", { ref: modal => (this.modalEl = modal), "aria-label": this.accessibleLabel, "aria-labelledby": this.heading ? this.modalId : false, "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, "aria-describedby": this.accessibleDescribedBy, role: this.variation === "loader" ? "alert" : "dialog", "aria-modal": this.isSafariBrowser ? false : true, tabindex: "-1", "aria-flowto": this.slotDefaultId, class: {
+        return (h("div", { ref: modal => (this.modalEl = modal), "aria-label": (_a = this.accessibleLabel) !== null && _a !== void 0 ? _a : this.heading, "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, "aria-describedby": this.accessibleDescribedBy, role: this.variation === "loader" ? "alert" : "dialog", "aria-modal": this.isSafariBrowser ? false : true, tabindex: "-1", class: {
                 "duet-modal-container": true,
                 "duet-theme-turva": this.theme === "turva",
                 "duet-modal-active": this.open,
                 "duet-modal-slide-up": this.variation === "slide-up",
                 "duet-modal-has-sticky-header": this.hasStickyHeader,
-            } }, h(FocusGuard, { moveFocusTo: this.buttonEl }), h("duet-overlay", { "z-index": "-1", visible: this.open, variation: this.variation === "loader" ? "white" : "default" }), h("div", { ref: modalInner => (this.modalInnerEl = modalInner), class: {
+            } }, h("duet-overlay", { "z-index": "-1", visible: this.open, variation: this.variation === "loader" ? "white" : "default" }), h("div", { ref: modalInner => (this.modalInnerEl = modalInner), class: {
                 "duet-modal-inner": true,
                 [this.size]: true,
                 "duet-modal-slide-up": this.variation === "slide-up",
@@ -244,7 +248,7 @@ export class DuetModal {
                 "duet-modal-gutter-small": this.gutterSize === "small",
                 "duet-modal-gutter-medium": this.gutterSize === "medium",
                 "duet-modal-gutter-large": this.gutterSize === "large",
-            } }, h("div", { class: "duet-modal-header" }, h("span", { class: "duet-modal-inner-slot-top" }, h("slot", { name: "top" })), this.icon && h("duet-icon", { name: this.icon, size: "xx-large", color: this.color || iconColor }), this.heading && (h("duet-heading", { "visual-level": (_a = this.headingVisualLevel) !== null && _a !== void 0 ? _a : this.headingLevel, level: this.headingLevel, theme: this.theme, id: this.modalId }, this.heading))), this.variation === "loader" && (h("div", { class: "duet-modal-spinner" }, h("duet-spinner", { size: "large", color: "primary" }))), h("div", { class: "duet-modal-inner-slot-default", id: this.slotDefaultId, ref: el => (this.slotContainerEl = el), "aria-live": this.variation === "loader" ? "assertive" : "off" }, h("slot", null))))), h(FocusGuard, { moveFocusTo: this.buttonEl })));
+            } }, h("div", { class: "duet-modal-header" }, h("span", { class: "duet-modal-inner-slot-top" }, h("slot", { name: "top" })), this.icon && h("duet-icon", { name: this.icon, size: "xx-large", color: this.color || iconColor }), this.heading && (h("duet-heading", { "visual-level": (_b = this.headingVisualLevel) !== null && _b !== void 0 ? _b : this.headingLevel, level: this.headingLevel, theme: this.theme }, this.heading))), this.variation === "loader" && (h("div", { class: "duet-modal-spinner" }, h("duet-spinner", { size: "large", color: "primary" }))), h("div", { class: "duet-modal-inner-slot-default", ref: el => (this.slotContainerEl = el), "aria-live": this.variation === "loader" ? "assertive" : "off" }, h("slot", null)))))));
     }
     static get is() { return "duet-modal"; }
     static get encapsulation() { return "shadow"; }
@@ -402,7 +406,7 @@ export class DuetModal {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "By default the heading is used as target for aria-labelledby, and it overrides this label.\nIf you wish to skip the heading, you must set this label."
+                    "text": "By default the heading is used aria-label for the modal.\nIf you wish to use something else then you must set this label."
                 },
                 "attribute": "accessible-label",
                 "reflect": false

package/lib/collection/components/duet-overlay/duet-overlay.js

@@ -35,7 +35,7 @@ export class DuetOverlay {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, null, h("div", { style: { zIndex: this.zIndex }, class: {
+        return (h(Host, { "aria-hidden": "true" }, h("div", { style: { zIndex: this.zIndex }, class: {
                 "duet-overlay": true,
                 "duet-theme-turva": this.theme === "turva",
                 "keep-stacking-context": this.keepStackingContext,

package/lib/collection/components/duet-popup-menu/duet-popup-menu.js

@@ -68,6 +68,15 @@ export class DuetPopupMenu {
     }
     connectedCallback() {
         this.handleControllerChange(this.controller, null);
+        if (Build.isServer) {
+            return;
+        }
+        if (!this.teleport) {
+            this.teleport = new Teleport(this.element);
+        }
+        if (this.teleport) {
+            this.teleport.activate();
+        }
     }
     disconnectedCallback() {
         if (this.openButton) {
@@ -176,7 +185,7 @@ export class DuetPopupMenu {
             if (this.openButton) {
                 this.openButton.accessibleExpanded = true;
             }
-            this.teleport.go(true);
+            this.teleport.makeSiblingsInert();
             this.updatePlacement();
             setTimeout(() => {
                 if (this.accessibleRole === "menu") {
@@ -194,7 +203,7 @@ export class DuetPopupMenu {
                     this.focusOpenButton();
                 }
                 this.duetToggle.emit({ open: this.open, component: "duet-popup-menu" });
-                this.teleport.resume();
+                this.teleport.removeInertFromSiblings();
             }, 200);
         }
     }

package/lib/collection/components/duet-slideout/duet-slideout.js

@@ -92,6 +92,12 @@ export class DuetSlideout {
         if (Build.isServer) {
             return;
         }
+        if (!this.teleport) {
+            this.teleport = new Teleport(this.element);
+        }
+        if (this.teleport) {
+            this.teleport.activate();
+        }
         if (this.opener) {
             this.setOpenButton(document.getElementById(this.opener));
             if (this.openButton) {
@@ -106,7 +112,9 @@ export class DuetSlideout {
     }
     disconnectedCallback() {
         disconnectLanguageChangeObserver(this);
-        enableBodyScroll(this.dialog);
+        if (this.dialog) {
+            enableBodyScroll(this.dialog);
+        }
         if (this.mutationObserver) {
             this.mutationObserver.disconnect();
         }
@@ -124,7 +132,7 @@ export class DuetSlideout {
                 this.openButton.accessibleExpanded = true;
             }
             const openPanel = this.getOpenPanel();
-            this.teleport.go(true);
+            this.teleport.makeSiblingsInert();
             disableBodyScroll(this.dialog, { reserveScrollBarGap: true });
             if (openPanel) {
                 openPanel.setFocus();
@@ -142,7 +150,7 @@ export class DuetSlideout {
             setTimeout(() => {
                 focusElement(this.openButton);
                 enableBodyScroll(this.dialog);
-                this.teleport.resume();
+                this.teleport.removeInertFromSiblings();
             }, 200);
         }
     }

package/lib/collection/components/duet-tooltip/duet-tooltip-popup.js

@@ -1,7 +1,7 @@
 /*!
  * Built with Duet Design System
  */
-import { h, Host } from "@stencil/core";
+import { Build, h, Host } from "@stencil/core";
 import { inheritGlobalTheme } from "../../common";
 import { FocusGuard } from "../../utils/focus-utils";
 import { subscribeTabbingChange, unsubscribeTabbingChange } from "../../utils/keyboard-utils";
@@ -22,14 +22,6 @@ export class DuetTooltipPopup {
         this.placement = undefined;
         this.accessibleCloseLabel = undefined;
     }
-    handleActiveChange() {
-        if (this.active) {
-            this.teleport.go();
-        }
-        else {
-            this.teleport.resume(200);
-        }
-    }
     /**
      * Component lifecycle events.
      */
@@ -39,6 +31,15 @@ export class DuetTooltipPopup {
     }
     connectedCallback() {
         subscribeTabbingChange(this);
+        if (Build.isServer) {
+            return;
+        }
+        if (!this.teleport) {
+            this.teleport = new Teleport(this.element);
+        }
+        if (this.teleport) {
+            this.teleport.activate();
+        }
     }
     disconnectedCallback() {
         unsubscribeTabbingChange(this);
@@ -269,10 +270,4 @@ export class DuetTooltipPopup {
         };
     }
     static get elementRef() { return "element"; }
-    static get watchers() {
-        return [{
-                "propName": "active",
-                "methodName": "handleActiveChange"
-            }];
-    }
 }

package/lib/collection/components/duet-tooltip/duet-tooltip.js

@@ -2,7 +2,7 @@
  * Built with Duet Design System
  */
 import { media_query_large, media_query_medium } from "@duetds/tokens/lib/tokens.json";
-import { arrow, computePosition, flip, shift } from "@floating-ui/dom";
+import { arrow, autoUpdate, computePosition, flip, shift } from "@floating-ui/dom";
 import { Build, h, Host } from "@stencil/core";
 import { inheritGlobalTheme } from "../../common";
 import { createID } from "../../utils/create-id";
@@ -121,6 +121,7 @@ export class DuetTooltip {
         this.updatePlacement();
         if (this.active) {
             this.openTooltip();
+            await this.handleActiveChange(this.active);
         }
         this.intersectionObserver = new IntersectionObserver(this.updatePlacement, { root: document.body });
         this.intersectionObserver.observe(this.element);
@@ -134,23 +135,6 @@ export class DuetTooltip {
     disconnectedCallback() {
         disconnectLanguageChangeObserver(this);
     }
-    /**
-     * Component event handling.
-     */
-    onScroll() {
-        clearTimeout(this.scrollTimer);
-        this.scrollTimer = setTimeout(() => {
-            if (this.active) {
-                this.updatePlacement();
-            }
-        }, 100);
-    }
-    handleWindowResize() {
-        clearTimeout(this.resizeTimer);
-        this.resizeTimer = setTimeout(() => {
-            this.updatePlacement();
-        }, 100);
-    }
     handleDocumentClick(e) {
         if (!this.active) {
             return;
@@ -173,10 +157,10 @@ export class DuetTooltip {
     }
     async handleActiveChange(newActiveValue) {
         if (newActiveValue) {
-            setTimeout(() => this.updatePlacement(), 10);
+            this.autoUpdateCleanup = autoUpdate(this.buttonEl, this.popupElement, this.updatePlacement);
         }
         else {
-            setTimeout(() => this.updatePlacement(), 300);
+            this.autoUpdateCleanup();
         }
     }
     /**
@@ -554,18 +538,6 @@ export class DuetTooltip {
     }
     static get listeners() {
         return [{
-                "name": "scroll",
-                "method": "onScroll",
-                "target": "window",
-                "capture": false,
-                "passive": true
-            }, {
-                "name": "resize",
-                "method": "handleWindowResize",
-                "target": "window",
-                "capture": false,
-                "passive": true
-            }, {
                 "name": "click",
                 "method": "handleDocumentClick",
                 "target": "document",

package/lib/collection/utils/teleport.js

@@ -3,10 +3,11 @@
  */
 /**
  * Teleport helps resolving z-index issues of overlapping popup elements.
- * Initiate it in your component's willLoad or didLoad lifecycle hook.
- * When you open the popup, call teleport.go() and move focus to the popup.
- * When you close the popup, call teleport.resume() and move focus to the element that opened the popup.
- * If your popup has closing animation, use the timeout parameter.
+ * Initiate it in your component's connectedCallback.
+ * Call activate() to teleport the object.
+ * Call deactivate() to resume the object to its original place.
+ * Call makeSiblingsInert() to add inert attribute to sibling elements.
+ * Call removeInertFromSiblings() to remove inert attribute from sibling elements.
  */
 export class Teleport {
     constructor(element, target) {
@@ -15,44 +16,51 @@ export class Teleport {
         this.target = target || document.body;
         this.teleportId = `${Math.random()}-${Date.now()}`.substring(2);
     }
-    /**
-     * @param makeSiblingsInert - make all siblings of the element inert, use only with modals
-     */
-    go(makeSiblingsInert = false) {
-        const skipTeleport = this.element.getAttribute("skip-teleport");
-        if (skipTeleport !== null && skipTeleport !== "false") {
+    activate() {
+        if (this._isTeleportSkipped() || this.isActive) {
             return;
         }
-        // React handles teleporting itself with portals
-        if (!this.element.dataset.reactPortal) {
-            this.stub = document.createElement("template");
-            this.element.insertAdjacentElement("afterend", this.stub);
-            this.target.appendChild(this.element);
-        }
-        if (makeSiblingsInert) {
-            this._makeSiblingsInert();
-        }
-        this.deletionObserver = new MutationObserver(this._deletionObserverCallback.bind(this));
-        this.deletionObserver.observe(document.documentElement, { childList: true, subtree: true });
         this.isActive = true;
+        this._activate();
     }
-    resume(delay = 0) {
-        const skipTeleport = this.element.getAttribute("skip-teleport");
-        if (skipTeleport !== null && skipTeleport !== "false") {
+    deactivate() {
+        if (this._isTeleportSkipped() || !this.isActive) {
+            return;
+        }
+        this.isActive = false;
+        this._deactivate();
+    }
+    makeSiblingsInert() {
+        if (this._isTeleportSkipped() || !this.isActive) {
             return;
         }
-        if (!this.isActive) {
+        this._makeSiblingsInert();
+    }
+    removeInertFromSiblings(delay = 0) {
+        if (this._isTeleportSkipped() || !this.isActive) {
             return;
         }
-        this.isActive = false;
         if (delay) {
-            setTimeout(this._resume.bind(this), delay);
+            setTimeout(this._removeInertFromSiblings.bind(this), delay);
         }
         else {
-            this._resume();
+            this._removeInertFromSiblings();
+        }
+    }
+    _isTeleportSkipped() {
+        const skipTeleport = this.element.getAttribute("skip-teleport");
+        return skipTeleport !== null && skipTeleport !== "false";
+    }
+    _activate() {
+        if (!this.element.dataset.reactPortal) {
+            this.stub = document.createElement("template");
+            this.element.insertAdjacentElement("afterend", this.stub);
+            this.target.appendChild(this.element);
         }
+        this.deletionObserver = new MutationObserver(this._deletionObserverCallback.bind(this));
+        this.deletionObserver.observe(document.documentElement, { childList: true, subtree: true });
     }
-    _resume() {
+    _deactivate() {
         if (!this.element.dataset.reactPortal) {
             this.stub.insertAdjacentElement("beforebegin", this.element);
             this.stub.remove();

package/lib/dist-custom-elements/duet-action-button.js

@@ -1,7 +1,7 @@
 /*!
  * Built with Duet Design System
  */
-import { D as DuetActionButton$1, d as defineCustomElement$1 } from './p-ce8ea46e.js';
+import { D as DuetActionButton$1, d as defineCustomElement$1 } from './p-4021501c.js';
 
 const DuetActionButton = DuetActionButton$1;
 const defineCustomElement = defineCustomElement$1;

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

@@ -1,7 +1,7 @@
 /*!
  * Built with Duet Design System
  */
-import { D as DuetAlert$1, d as defineCustomElement$1 } from './p-c622edcc.js';
+import { D as DuetAlert$1, d as defineCustomElement$1 } from './p-6783b103.js';
 
 const DuetAlert = DuetAlert$1;
 const defineCustomElement = defineCustomElement$1;

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

@@ -1,7 +1,7 @@
 /*!
  * Built with Duet Design System
  */
-import { D as DuetBadge$1, d as defineCustomElement$1 } from './p-47534dc7.js';
+import { D as DuetBadge$1, d as defineCustomElement$1 } from './p-3e413cfd.js';
 
 const DuetBadge = DuetBadge$1;
 const defineCustomElement = defineCustomElement$1;

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

@@ -1,14 +1,14 @@
 /*!
  * Built with Duet Design System
  */
-import { p as proxyCustomElement, H, h as h$1, d as Host } from './p-e61e745f.js';
+import { p as proxyCustomElement, H, h as h$1, d as Host } from './p-fcd3721b.js';
 import { i as inheritGlobalTheme } from './p-a58bd561.js';
 import { h } from './p-33937fd7.js';
 import { h as hasSlot, c as checkNamedSlotElement } from './p-d87f6dd5.js';
 import { p as parsePossibleJSON } from './p-0e052642.js';
 import { g as getColorByName } from './p-25c80cdb.js';
-import { d as defineCustomElement$3 } from './p-2a725cd8.js';
-import { d as defineCustomElement$2 } from './p-e8ab4056.js';
+import { d as defineCustomElement$3 } from './p-77552eed.js';
+import { d as defineCustomElement$2 } from './p-227546cf.js';
 
 const DuetPicture = ({ img, sources }) => {
     return (h("picture", null,

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

@@ -1,12 +1,12 @@
 /*!
  * Built with Duet Design System
  */
-import { p as proxyCustomElement, H, h, d as Host } from './p-e61e745f.js';
+import { p as proxyCustomElement, H, h, d as Host } from './p-fcd3721b.js';
 import { i as inheritGlobalTheme } from './p-a58bd561.js';
 import { s as subscribeTabbingChange, u as unsubscribeTabbingChange } from './p-e44c0eff.js';
 import { a as getLanguage, c as connectLanguageChangeObserver, d as disconnectLanguageChangeObserver, g as getLocaleString } from './p-2e36d5bf.js';
-import { d as defineCustomElement$3 } from './p-e8ab4056.js';
-import { d as defineCustomElement$2 } from './p-18f2ebcd.js';
+import { d as defineCustomElement$3 } from './p-227546cf.js';
+import { d as defineCustomElement$2 } from './p-8f86417c.js';
 
 var actionArrowRightSmall={"title":"action-arrow-right-small","tags":"action arrow right small caret","svg":"<svg fill=\"currentColor\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" role=\"img\"><path d=\"M19.5 12a2.3 2.3 0 0 1-.78 1.729L7.568 23.54a1.847 1.847 0 0 1-2.439-2.773l9.752-8.579a.25.25 0 0 0 0-.376L5.129 3.233A1.847 1.847 0 0 1 7.568.46l11.148 9.808A2.31 2.31 0 0 1 19.5 12z\"/></svg>"};
 

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

@@ -1,7 +1,7 @@
 /*!
  * Built with Duet Design System
  */
-import { p as proxyCustomElement, H, h, d as Host } from './p-e61e745f.js';
+import { p as proxyCustomElement, H, h, d as Host } from './p-fcd3721b.js';
 import { i as inheritGlobalTheme } from './p-a58bd561.js';
 import { g as getLocaleString } from './p-2e36d5bf.js';
 import { g as getColorByName } from './p-25c80cdb.js';

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

@@ -1,7 +1,7 @@
 /*!
  * Built with Duet Design System
  */
-import { D as DuetButton$1, d as defineCustomElement$1 } from './p-a33222ce.js';
+import { D as DuetButton$1, d as defineCustomElement$1 } from './p-6f10ebc0.js';
 
 const DuetButton = DuetButton$1;
 const defineCustomElement = defineCustomElement$1;

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

@@ -1,10 +1,10 @@
 /*!
  * Built with Duet Design System
  */
-import { p as proxyCustomElement, H, h, d as Host } from './p-e61e745f.js';
+import { p as proxyCustomElement, H, h, d as Host } from './p-fcd3721b.js';
 import { i as inheritGlobalTheme } from './p-a58bd561.js';
 import { h as hasSlot, c as checkNamedSlotElement } from './p-d87f6dd5.js';
-import { d as defineCustomElement$2 } from './p-e8ab4056.js';
+import { d as defineCustomElement$2 } from './p-227546cf.js';
 
 const duetCalloutCss = ":host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;position:relative;display:block;width:100%}blockquote,figure{margin:0}.duet-callout{margin-bottom:28px !important;display:flex;align-items:center;justify-content:center;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\"}.duet-callout .container{display:flex;flex-direction:column;gap:8px;align-items:center;max-width:688px;text-align:center}.duet-callout .callout-icon{width:50px;padding-bottom:8px}.duet-callout blockquote{font-size:2.7vw;font-weight:600;line-height:1.5;color:rgb(0, 41, 77)}@media (max-width: 37.037037037rem){.duet-callout blockquote{font-size:1rem}}@media (min-width: 46.2962962963rem){.duet-callout blockquote{font-size:1.25rem}}.duet-callout .author{color:rgb(0, 41, 77)}.duet-callout.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-callout.duet-theme-turva .author,.duet-callout.duet-theme-turva blockquote{color:rgb(23, 28, 58)}.duet-callout.duet-m-0{margin:0 !important}";
 

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

@@ -1,7 +1,7 @@
 /*!
  * Built with Duet Design System
  */
-import { D as DuetCaption$1, d as defineCustomElement$1 } from './p-95c03966.js';
+import { D as DuetCaption$1, d as defineCustomElement$1 } from './p-8cb2b7fe.js';
 
 const DuetCaption = DuetCaption$1;
 const defineCustomElement = defineCustomElement$1;

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

@@ -1,14 +1,14 @@
 /*!
  * Built with Duet Design System
  */
-import { p as proxyCustomElement, H, c as createEvent, h, F as Fragment, d as Host } from './p-e61e745f.js';
+import { p as proxyCustomElement, H, c as createEvent, h, F as Fragment, d as Host } from './p-fcd3721b.js';
 import { i as inheritGlobalTheme } from './p-a58bd561.js';
 import { c as createID } from './p-5e59e970.js';
 import { i as isKeyboardClick, s as subscribeTabbingChange, u as unsubscribeTabbingChange } from './p-e44c0eff.js';
 import { s as sanitizeString } from './p-0e052642.js';
 import { g as getColorByName } from './p-25c80cdb.js';
-import { d as defineCustomElement$3 } from './p-e8ab4056.js';
-import { d as defineCustomElement$2 } from './p-18f2ebcd.js';
+import { d as defineCustomElement$3 } from './p-227546cf.js';
+import { d as defineCustomElement$2 } from './p-8f86417c.js';
 
 const duetHeadingLevels = ["h1", "h2", "h3", "h4", "h5", "h6"];
 const duetBlock = "div";

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

@@ -1,7 +1,7 @@
 /*!
  * Built with Duet Design System
  */
-import { D as DuetCheckbox$1, d as defineCustomElement$1 } from './p-771e2eca.js';
+import { D as DuetCheckbox$1, d as defineCustomElement$1 } from './p-934d4db1.js';
 
 const DuetCheckbox = DuetCheckbox$1;
 const defineCustomElement = defineCustomElement$1;

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

@@ -1,7 +1,7 @@
 /*!
  * Built with Duet Design System
  */
-import { D as DuetCheckmark$1, d as defineCustomElement$1 } from './p-95c051bc.js';
+import { D as DuetCheckmark$1, d as defineCustomElement$1 } from './p-2a3d455e.js';
 
 const DuetCheckmark = DuetCheckmark$1;
 const defineCustomElement = defineCustomElement$1;