@duetds/components 8.6.3 → 8.6.5

package/lib/collection/components/duet-footer/duet-footer.css

@@ -27,19 +27,21 @@
 
 ::slotted([slot=info]) {
   padding: 0 28px;
-  margin-top: 36px;
+  margin-top: 0;
+  margin-bottom: 16px;
 }
 @media (min-width: 62em) {
   ::slotted([slot=info]) {
     padding: 0;
-    margin: 0;
+    margin-top: calc(20px - 0.5em);
+    margin-bottom: 0;
   }
 }
 
 .duet-footer {
   display: block;
   width: 100%;
-  padding-top: 20px;
+  padding-top: 24px;
   padding-bottom: 16px;
   margin-top: 48px;
   font-family: "localtapiola-sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
@@ -56,11 +58,6 @@
 .duet-footer.duet-m-0 {
   margin: 0 !important;
 }
-@media (min-width: 36em) {
-  .duet-footer {
-    padding-top: 36px;
-  }
-}
 @media (min-width: 62em) {
   .duet-footer {
     padding-top: 48px;
@@ -115,36 +112,43 @@
     display: flex;
     flex-direction: row;
     align-items: center;
-    justify-content: space-between;
+  }
+  .duet-footer-top.duet-has-info {
+    align-items: flex-start;
   }
 }
 .duet-footer-top .footer-top-logo {
   flex-grow: 1;
 }
 .duet-footer-top .footer-top-right-container {
-  flex-grow: 1.5;
+  flex-grow: 1;
+}
+@media (min-width: 62em) {
+  .duet-footer-top .footer-top-right-container {
+    text-align: right;
+  }
 }
 .duet-footer-top .footer-top-items {
   display: flex;
   flex-direction: column;
-  justify-content: space-between;
+  align-items: flex-start;
+  justify-content: flex-start;
+  padding-left: 28px;
 }
 @media (min-width: 62em) {
   .duet-footer-top .footer-top-items {
     flex-direction: row;
+    justify-content: flex-end;
   }
 }
 
 duet-logo {
+  margin-bottom: 24px;
   margin-left: 16px !important;
 }
-@media (min-width: 36em) {
-  duet-logo {
-    margin-left: 28px !important;
-  }
-}
 @media (min-width: 62em) {
   duet-logo {
+    margin-bottom: 0;
     margin-left: 0 !important;
   }
 }
@@ -199,71 +203,11 @@ duet-logo {
   }
 }
 
-.duet-footer-icon {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  padding: 12px;
-  margin-right: 16px;
-  background: rgb(0, 119, 179);
-  border-radius: 50%;
-  transition: 300ms ease;
-}
-.duet-theme-turva .duet-footer-icon {
-  background: transparent;
-  box-shadow: 0 0 0 1px #fff;
-}
-a:hover .duet-footer-icon {
-  background: #006ba1;
-}
-.duet-theme-turva a:hover .duet-footer-icon {
-  background: transparent;
-}
-
-.duet-footer-arrow {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 20px;
-  min-width: 20px;
-  max-width: 20px;
-  height: 20px;
-  max-height: 20px;
-  margin-left: auto;
-  color: rgb(255, 255, 255);
-  transition: transform 300ms ease;
-}
-@media (min-width: 62em) {
-  .duet-footer-arrow {
-    width: 10px;
-    min-width: 10px;
-    margin-top: 3px;
-    margin-left: 8px;
-  }
-}
-@media (min-width: 62em) {
-  .duet-footer-arrow {
-    margin-right: 0;
-  }
-}
-a:hover .duet-footer-arrow {
-  transform: translateX(4px);
-}
-.duet-footer-arrow duet-icon {
-  width: 20px;
-  height: 20px;
-}
-@media (min-width: 62em) {
-  .duet-footer-arrow duet-icon {
-    width: 10px;
-    height: 10px;
-  }
-}
-
 .duet-footer-menu {
   padding: 20px !important;
   display: flex;
   gap: 2rem;
+  padding-left: 28px !important;
   font-size: 0.875rem;
 }
 @media (min-width: 36em) {
@@ -273,6 +217,7 @@ a:hover .duet-footer-arrow {
 }
 @media (min-width: 62em) {
   .duet-footer-menu {
+    padding-right: 0 !important;
     padding-left: 8px !important;
   }
 }
@@ -321,7 +266,7 @@ a:hover .duet-footer-arrow {
   display: block;
   padding-top: 0.5rem;
   padding-bottom: 1.25rem;
-  padding-left: 2rem;
+  padding-left: 28px;
   text-align: left;
 }
 @media (min-width: 62em) {

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

@@ -35,9 +35,9 @@ describe("duet-footer", () => {
         const page = await createPage(defaultFooter);
         await page.$eval("duet-footer", (el) => {
             el.items = [
-                { label: "Hae korvausta", href: "#", icon: "navigation-make-claim" },
-                { label: "Osta vakuutus", href: "#", icon: "action-buy-insurance" },
-                { label: "Yhteystiedot", href: "#", icon: "form-tel" },
+                { label: "Hae korvausta", href: "#" },
+                { label: "Osta vakuutus", href: "#" },
+                { label: "Yhteystiedot", href: "#" },
             ];
         });
         await page.waitForChanges();
@@ -66,19 +66,19 @@ describe("duet-footer", () => {
         const page = await createPage(defaultFooter);
         await page.$eval("duet-footer", (el) => {
             el.items = [
-                { label: "Hae korvausta", href: "#", icon: "navigation-make-claim" },
-                { label: "Osta vakuutus", href: "#", icon: "action-buy-insurance" },
-                { label: "Yhteystiedot", href: "#", icon: "form-tel" },
+                { label: "Hae korvausta", href: "#" },
+                { label: "Osta vakuutus", href: "#" },
+                { label: "Yhteystiedot", href: "#" },
             ];
         });
         const element = await page.find("duet-footer");
         // should be updated when setting the *attribute*
-        element.setAttribute("items", '[{ "label": "test", "href": "#", "icon": "navigation-make-claim" }]');
+        element.setAttribute("items", '[{ "label": "test", "href": "#" }]');
         await page.waitForChanges();
         let test = await page.find("duet-footer >>> .duet-footer-link");
         expect(test).toEqualText("test");
         // should also be updated when setting the label *property*
-        element.setProperty("items", [{ label: "test 2", href: "#", icon: "navigation-make-claim" }]);
+        element.setProperty("items", [{ label: "test 2", href: "#" }]);
         await page.waitForChanges();
         test = await page.find("duet-footer >>> .duet-footer-link");
         expect(test).toEqualText("test 2");
@@ -88,11 +88,11 @@ describe("duet-footer", () => {
         let footer;
         const props = {
             items: [
-                { label: "item 1", id: "item-1", icon: "form-tel" },
-                { label: "item 2", id: "item-2", icon: "navigation-make-claim" },
+                { label: "item 1", id: "item-1" },
+                { label: "item 2", id: "item-2" },
             ],
             menu: [{ label: "menu 1", id: "menu-1" }],
-            logoHref: "/logo",
+            logoHref: "./#logo",
         };
         beforeEach(async () => {
             page = await createPage(defaultFooter);
@@ -102,8 +102,7 @@ describe("duet-footer", () => {
             }, props);
             await page.waitForChanges();
         });
-        // TODO: broken test as the browser tries to enter the logo url
-        it.skip("raises events when logo is clicked", async () => {
+        it("raises events when logo is clicked", async () => {
             const logo = await page.find("duet-footer >>> duet-logo");
             const changeSpy = await footer.spyOnEvent("duetChange");
             const logoSpy = await footer.spyOnEvent("duetLogoClick");
@@ -149,8 +148,8 @@ describe("duet-footer", () => {
             page = await createPage(`
         <duet-footer
           items='[
-            { "label": "item 1", "id": "item-1", "analyticsId": "item analytics", "icon": "form-tel"} ,
-            { "label": "item 2", "id": "item-2", "icon": "form-tel" }
+            { "label": "item 1", "id": "item-1", "analyticsId": "item analytics" } ,
+            { "label": "item 2", "id": "item-2" }
           ]'
           menu='[{ "label": "menu 1", "id": "menu-1", "analyticsId": "menu analytics"}]'
         ></duet-footer>

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

@@ -1,14 +1,13 @@
 /*!
  * Built with Duet Design System
  */
-import arrowRightIcon from "@duetds/icons/lib/assets/action-arrow-right";
-import newWindowIcon from "@duetds/icons/lib/assets/action-new-window";
 import newWindowIconSmall from "@duetds/icons/lib/assets/action-new-window-small";
-import { Build, Fragment, h } from "@stencil/core";
+import { Fragment, h } from "@stencil/core";
 import { DuetStringsExternalDefaults } from "../../common-strings";
 import { inheritGlobalTheme } from "../../common/themeable-component";
 import { subscribeTabbingChange, unsubscribeTabbingChange } from "../../utils/keyboard-utils";
 import { connectLanguageChangeObserver, disconnectLanguageChangeObserver, getLanguage, getLocaleString, } from "../../utils/language-utils";
+import { hasSlot } from "../../utils/slot-utils";
 import { parsePossibleJSON } from "../../utils/string-utils";
 const i18n = {
     fi: { lahi: "© LähiTapiola", turva: "© Turva" },
@@ -82,9 +81,7 @@ export class DuetFooter {
     componentWillLoad() {
         inheritGlobalTheme(this);
         this.refresh();
-        this.hasInfoSlot = Build.isServer
-            ? Array.from(this.element.children).filter(el => el.matches("[slot='info']")).length > 0
-            : !!this.element.querySelector(":scope > [slot='info']");
+        this.hasInfoSlot = hasSlot(this.element, "info");
     }
     connectedCallback() {
         connectLanguageChangeObserver(this, {
@@ -104,18 +101,6 @@ export class DuetFooter {
         this.processedItems = parsePossibleJSON(this.items);
         this.processedMenu = parsePossibleJSON(this.menu);
     }
-    renderFooterTop() {
-        const logo = (h("div", { class: {
-                "footer-top-logo": this.hasInfoSlot,
-            } }, this.variation !== "simple" && (h("duet-logo", { href: this.logoHref, onClick: this.handleLogoClick, size: "large", inverse: true, language: this.language, theme: this.theme }))));
-        const footerItems = this.processedItems &&
-            this.variation !== "simple" &&
-            this.processedItems.map(item => (h("a", { class: "duet-footer-link", href: item.href, id: item.id, target: item.external ? "_blank" : "_self", onClick: event => this.handleItemClick(event, item), onMouseEnter: event => this.emitDuetEvent(event, item), onTouchStart: event => this.emitDuetEvent(event, item) }, h("div", { class: "duet-footer-icon" }, h("duet-icon", { size: "medium", margin: "none", name: item.icon, color: "currentColor" })), h("span", null, item.label), !item.hideArrow && (h(Fragment, null, item.external && h("duet-visually-hidden", null, ", ", this.accessibleLabelExternal), h("div", { class: "duet-footer-arrow" }, item.external ? (h("duet-icon", { icon: newWindowIcon.svg, size: "xx-small", margin: "none", color: "currentColor" })) : (h("duet-icon", { icon: arrowRightIcon.svg, size: "auto", margin: "none", color: "currentColor" }))))))));
-        if (this.hasInfoSlot) {
-            return (h(Fragment, null, logo, h("div", { class: "footer-top-right-container" }, h("slot", { name: "info" }), h("div", { class: "footer-top-items" }, footerItems))));
-        }
-        return (h(Fragment, null, logo, footerItems));
-    }
     /**
      * render() function
      * Always the last one in the class.
@@ -128,7 +113,20 @@ export class DuetFooter {
                 "duet-m-0": this.margin === "none",
                 "duet-theme-turva": this.theme === "turva",
                 "duet-footer-simple": this.variation === "simple",
-            }, "aria-label": this.accessibleLabel }, h("div", { class: "duet-footer-wrapper" }, h("div", { class: "duet-footer-top", part: "top" }, this.renderFooterTop()), h("slot", { name: "extra" }), h("p", { class: "duet-footer-menu", part: "menu" }, h("span", { class: "duet-footer-copyright" }, `${copyrightLabel} ${new Date().getFullYear()}`), h("span", { class: "duet-footer-menu-links" }, this.processedMenu && (h(Fragment, null, this.processedMenu.map(item => (h("a", { href: item.href, id: item.id, target: item.external ? "_blank" : "_self", onClick: event => this.handleMenuClick(event, item), onMouseEnter: event => this.emitDuetEvent(event, item), onTouchStart: event => this.emitDuetEvent(event, item) }, item.label, item.external && (h(Fragment, null, h("duet-visually-hidden", null, ", ", this.accessibleLabelExternal), h("span", { class: "duet-footer-external" }, h("duet-icon", { icon: newWindowIconSmall.svg, size: "xx-small", margin: "none", color: "currentColor" })))), h("span", { class: "duet-footer-divider", role: "presentation", "aria-hidden": "true" }, "/")))))))), h("p", { class: "duet-footer-copyright duet-footer-copyright-mobile" }, `${copyrightLabel} ${new Date().getFullYear()}`))));
+            }, "aria-label": this.accessibleLabel }, h("div", { class: "duet-footer-wrapper" }, this.variation !== "simple" && (h("div", { class: {
+                "duet-footer-top": true,
+                "duet-has-info": this.hasInfoSlot,
+            }, part: "top" }, h("div", { class: "footer-top-logo" }, h("duet-logo", { href: this.logoHref, onClick: this.handleLogoClick, size: "large", inverse: true, language: this.language, theme: this.theme })), h("div", { class: "footer-top-right-container" }, h("slot", { name: "info" }), h("div", { class: "footer-top-items" }, this.processedItems &&
+            this.processedItems.map((item, index) => {
+                var _a, _b, _c, _d, _e, _f;
+                return (h(Fragment, null, index > 0 && h("duet-spacer", { size: "x-large", direction: "horizontal" }), h("duet-button", { id: item.id, class: "duet-footer-link", variation: "plain", margin: "none", fixed: true, negative: true, url: item.href, external: item.external, icon: ((_a = item.href) === null || _a === void 0 ? void 0 : _a.startsWith("tel:"))
+                        ? "form-tel"
+                        : ((_b = item.href) === null || _b === void 0 ? void 0 : _b.startsWith("mailto:"))
+                            ? "navigation-message"
+                            : "navigation-arrow-right", "icon-right": !((_c = item.href) === null || _c === void 0 ? void 0 : _c.startsWith("tel:")) && !((_d = item.href) === null || _d === void 0 ? void 0 : _d.startsWith("mailto:")), "icon-size": ((_e = item.href) === null || _e === void 0 ? void 0 : _e.startsWith("tel:")) || ((_f = item.href) === null || _f === void 0 ? void 0 : _f.startsWith("mailto:"))
+                        ? "medium"
+                        : "medium-small", onClick: event => this.handleItemClick(event, item), onMouseEnter: event => this.emitDuetEvent(event, item), onTouchStart: event => this.emitDuetEvent(event, item) }, item.label)));
+            }))))), h("slot", { name: "extra" }), h("p", { class: "duet-footer-menu", part: "menu" }, h("span", { class: "duet-footer-copyright" }, `${copyrightLabel} ${new Date().getFullYear()}`), h("span", { class: "duet-footer-menu-links" }, this.processedMenu && (h(Fragment, null, this.processedMenu.map(item => (h("a", { href: item.href, id: item.id, target: item.external ? "_blank" : "_self", onClick: event => this.handleMenuClick(event, item), onMouseEnter: event => this.emitDuetEvent(event, item), onTouchStart: event => this.emitDuetEvent(event, item) }, item.label, item.external && (h(Fragment, null, h("duet-visually-hidden", null, ", ", this.accessibleLabelExternal), h("span", { class: "duet-footer-external" }, h("duet-icon", { icon: newWindowIconSmall.svg, size: "xx-small", margin: "none", color: "currentColor" })))), h("span", { class: "duet-footer-divider", role: "presentation", "aria-hidden": "true" }, "/")))))))), h("p", { class: "duet-footer-copyright duet-footer-copyright-mobile" }, `${copyrightLabel} ${new Date().getFullYear()}`))));
     }
     static get is() { return "duet-footer"; }
     static get encapsulation() { return "shadow"; }
@@ -276,7 +274,7 @@ export class DuetFooter {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "An array of items for the main footer links. Items have to include mandatory\n\"label\", \"href\" and \"icon\" fields to work. Additionally, you can pass an \"id\"\nthat is added as an HTML identifier for the anchor tag."
+                    "text": "An array of items for the main footer links. Items have to include mandatory\n\"label\" and \"href\" fields to work. Additionally, you can pass an \"id\"\nthat is added as an HTML identifier for the anchor tag. Note that previously mandatory\n\"icon\" field has now been removed - setting it has no effect."
                 },
                 "attribute": "items",
                 "reflect": false
@@ -388,7 +386,7 @@ export class DuetFooter {
                 },
                 "complexType": {
                     "original": "DuetFooterChangeEvent",
-                    "resolved": "{ component: \"duet-footer\"; data: DuetFooterItem | DuetFooterIconItem; originalEvent: Event; }",
+                    "resolved": "{ component: \"duet-footer\"; data: DuetFooterItem; originalEvent: Event; }",
                     "references": {
                         "DuetFooterChangeEvent": {
                             "location": "local",
@@ -409,7 +407,7 @@ export class DuetFooter {
                 },
                 "complexType": {
                     "original": "DuetFooterChangeEvent",
-                    "resolved": "{ component: \"duet-footer\"; data: DuetFooterItem | DuetFooterIconItem; originalEvent: Event; }",
+                    "resolved": "{ component: \"duet-footer\"; data: DuetFooterItem; originalEvent: Event; }",
                     "references": {
                         "DuetFooterChangeEvent": {
                             "location": "local",
@@ -430,7 +428,7 @@ export class DuetFooter {
                 },
                 "complexType": {
                     "original": "DuetFooterChangeEvent",
-                    "resolved": "{ component: \"duet-footer\"; data: DuetFooterItem | DuetFooterIconItem; originalEvent: Event; }",
+                    "resolved": "{ component: \"duet-footer\"; data: DuetFooterItem; originalEvent: Event; }",
                     "references": {
                         "DuetFooterChangeEvent": {
                             "location": "local",
@@ -451,7 +449,7 @@ export class DuetFooter {
                 },
                 "complexType": {
                     "original": "DuetFooterChangeEvent",
-                    "resolved": "{ component: \"duet-footer\"; data: DuetFooterItem | DuetFooterIconItem; originalEvent: Event; }",
+                    "resolved": "{ component: \"duet-footer\"; data: DuetFooterItem; originalEvent: Event; }",
                     "references": {
                         "DuetFooterChangeEvent": {
                             "location": "local",
@@ -493,7 +491,7 @@ export class DuetFooter {
                 },
                 "complexType": {
                     "original": "DuetFooterChangeEvent",
-                    "resolved": "{ component: \"duet-footer\"; data: DuetFooterItem | DuetFooterIconItem; originalEvent: Event; }",
+                    "resolved": "{ component: \"duet-footer\"; data: DuetFooterItem; originalEvent: Event; }",
                     "references": {
                         "DuetFooterChangeEvent": {
                             "location": "local",

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

@@ -104,6 +104,7 @@ export class DuetModal {
         }
         else {
             this.modalEl.classList.remove("duet-disable-transitions");
+            this.modalEl.addEventListener("transitionend", () => this.duetCloseComplete.emit(), { once: true });
             enableBodyScroll(this.modalEl);
             this.duetClose.emit();
             this.teleport.removeInertFromSiblings();
@@ -737,6 +738,21 @@ export class DuetModal {
                     "resolved": "any",
                     "references": {}
                 }
+            }, {
+                "method": "duetCloseComplete",
+                "name": "duetCloseComplete",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Emitted when the modal closing transition is complete."
+                },
+                "complexType": {
+                    "original": "any",
+                    "resolved": "any",
+                    "references": {}
+                }
             }, {
                 "method": "duetBeforeClose",
                 "name": "duetBeforeClose",

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-bfcc033c.js';
+import { D as DuetActionButton$1, d as defineCustomElement$1 } from './p-f40596e9.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-cefa037c.js';
+import { D as DuetAlert$1, d as defineCustomElement$1 } from './p-3f85f7b8.js';
 
 const DuetAlert = DuetAlert$1;
 const defineCustomElement = defineCustomElement$1;

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

@@ -6,9 +6,9 @@ import { i as inheritGlobalTheme } from './p-a58bd561.js';
 import { h } from './p-33937fd7.js';
 import { h as hasSlot, c as checkNamedSlotElement } from './p-06e608ae.js';
 import { p as parsePossibleJSON } from './p-0e052642.js';
-import { g as getColorByName } from './p-25c80cdb.js';
-import { d as defineCustomElement$3 } from './p-a167e2a0.js';
-import { d as defineCustomElement$2 } from './p-98d17606.js';
+import { g as getColorByName } from './p-3ec3eb5f.js';
+import { d as defineCustomElement$3 } from './p-d72fa71c.js';
+import { d as defineCustomElement$2 } from './p-9ca3437c.js';
 
 const DuetPicture = ({ img, sources }) => {
     return (h("picture", null,
@@ -17,7 +17,7 @@ const DuetPicture = ({ img, sources }) => {
         h("img", Object.assign({}, img))));
 };
 
-const duetBannerCss = "*,\n*::after,\n*::before {\n  box-sizing: border-box;\n  padding: 0;\n  margin: 0;\n  background: transparent;\n  border: 0;\n  -moz-appearance: none;\n  -webkit-appearance: none;\n  appearance: none;\n}\n\n:host {\n  box-sizing: border-box;\n  padding: 0;\n  margin: 0;\n  background: transparent;\n  border: 0;\n  -moz-appearance: none;\n  -webkit-appearance: none;\n  appearance: none;\n  margin-right: 36px !important;\n  margin-bottom: 36px !important;\n  display: flex;\n  justify-content: center;\n  width: auto;\n  container: duet-banner-container;\n  container-type: inline-size;\n}\n:host:last-child, :host:last-of-type {\n  margin-right: 0 !important;\n}\n\n:host(.duet-m-0) {\n  margin: 0 !important;\n}\n\n.duet-banner {\n  display: grid;\n  grid-template-rows: min-content 1fr;\n  width: 100%;\n  height: 100%;\n  font-family: \"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";\n  font-style: normal;\n  text-align: left;\n  border-radius: 16px;\n}\n.duet-banner.duet-p-0 {\n  padding: 0 !important;\n}\n.duet-banner.duet-m-0 {\n  margin: 0 !important;\n}\n.duet-banner .visual {\n  position: relative;\n  display: none;\n  overflow: hidden;\n  /* stylelint-disable */\n}\n@container duet-banner-container (min-width: 0px) {\n  .duet-banner .visual {\n    /* stylelint-enable */\n    display: block;\n  }\n}\n.duet-banner .visual .image-container {\n  position: relative;\n  aspect-ratio: 2/1;\n  overflow: hidden;\n}\n.duet-banner .visual .image {\n  position: relative;\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n  object-position: center;\n}\n.duet-banner .visual .icon {\n  position: absolute;\n}\n.duet-banner .visual .brand-shape {\n  position: absolute;\n  top: 0;\n  left: 72%;\n  display: none;\n  width: 100%;\n  height: 100%;\n  background: url(\"data:image/svg+xml,%3Csvg%20%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20160%20344%22%20fill%3D%22none%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M2.72641e-07%2091.1902C0.000476976%2097.9034%200.626077%20104.726%201.92282%20111.592L42.7493%20327.771C43.8045%20333.358%2045.2667%20338.776%2047.0996%20344H160V0H51.1439C19.7799%2019.1253%200.00268143%2053.4178%202.72641e-07%2091.1749C-9.08807e-08%2091.18%20-9.08875e-08%2091.1851%202.72641e-07%2091.1902Z%22%20fill%3D%22%23E6F2F8%22%2F%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fsvg%3E\");\n}\n.duet-banner .content {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  padding: 16px 20px 28px;\n}\n.duet-banner .content .description {\n  hyphens: auto;\n}\n.duet-banner .action {\n  display: flex;\n  flex-direction: column;\n  flex-grow: 1;\n  align-items: flex-start;\n  justify-content: flex-end;\n  padding-top: 16px;\n}\n.duet-banner .visual {\n  border-top-left-radius: 16px;\n  border-top-right-radius: 16px;\n}\n.duet-banner .visual .image-container {\n  width: 100%;\n  height: auto;\n  border-radius: 0;\n}\n.duet-banner .visual .icon {\n  bottom: 30px;\n  left: 15px;\n}\n.duet-banner.duet-theme-turva {\n  font-family: \"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";\n}\n.duet-banner.duet-theme-turva .visual .brand-shape {\n  background-image: url(\"data:image/svg+xml,%3Csvg viewBox='0 0 160 344' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_7920_3801)'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M2.58983 142.533C0.751086 155.147 0.0746585 167.857 0.00796847 179.225C0.00263853 179.814 0 180.409 0 181.007C0 194.845 1.41172 210.806 3.58065 223.171C5.6528 234.934 8.58716 246.495 12.5981 257.779C21.2249 282.059 34.0151 304.109 50.8401 323.977C56.7824 330.993 63.0921 337.68 69.8162 344H160V0H65.0733C52.1771 10.7866 41.4339 23.4177 32.7528 37.7978C21.1154 57.0822 14.0367 77.9583 9.75424 99.7913C9.09214 103.157 8.55049 106.545 8.00901 109.933C7.75185 111.542 7.49474 113.15 7.22478 114.756C6.74308 117.618 6.24543 120.479 5.74776 123.34C4.6361 129.729 3.52432 136.12 2.58983 142.533Z' fill='%23F5F5F7'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_7920_3801'%3E%3Crect width='160' height='344' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A\");\n}\n.duet-banner.size-medium, .duet-banner.size-large {\n  /* stylelint-disable */\n  /* stylelint-disable */\n}\n@container duet-banner-container (min-width: 486px) {\n  .duet-banner.size-medium, .duet-banner.size-large {\n    /* stylelint-enable */\n    grid-template-rows: none;\n    grid-template-columns: 50% 50%;\n  }\n  .duet-banner.size-medium .visual, .duet-banner.size-large .visual {\n    border-top-left-radius: 16px;\n    border-top-right-radius: 0;\n    border-bottom-left-radius: 16px;\n  }\n  .duet-banner.size-medium .visual .image-container, .duet-banner.size-large .visual .image-container {\n    height: 100%;\n  }\n  .duet-banner.size-medium .visual .image, .duet-banner.size-large .visual .image {\n    width: 100%;\n    height: 100%;\n  }\n  .duet-banner.size-medium .visual .icon, .duet-banner.size-large .visual .icon {\n    top: 36px;\n    left: 168px;\n  }\n  .duet-banner.size-medium .visual .brand-shape, .duet-banner.size-large .visual .brand-shape {\n    display: block;\n  }\n  .duet-banner.size-medium .content, .duet-banner.size-large .content {\n    align-items: flex-start;\n    justify-content: center;\n    padding: 28px 28px 28px 0;\n  }\n  .duet-banner.size-medium .action, .duet-banner.size-large .action {\n    flex-grow: 0;\n  }\n}\n@container duet-banner-container (min-width: 586px) {\n  .duet-banner.size-medium, .duet-banner.size-large {\n    /* stylelint-enable */\n  }\n  .duet-banner.size-medium .visual .brand-shape, .duet-banner.size-large .visual .brand-shape {\n    left: 80%;\n  }\n}\n.duet-banner.size-large {\n  /* stylelint-disable */\n}\n@container duet-banner-container (min-width: 900px) {\n  .duet-banner.size-large {\n    /* stylelint-enable */\n    grid-template-rows: none;\n    grid-template-columns: 50% 50%;\n  }\n  .duet-banner.size-large .visual {\n    border-top-left-radius: 16px;\n    border-bottom-left-radius: 16px;\n  }\n  .duet-banner.size-large .visual .image-container {\n    height: 100%;\n  }\n  .duet-banner.size-large .visual .image {\n    width: 100%;\n    height: 100%;\n  }\n  .duet-banner.size-large .visual .icon {\n    top: 40px;\n    bottom: auto;\n    left: 335px;\n  }\n  .duet-banner.size-large .visual .brand-shape {\n    display: block;\n  }\n  .duet-banner.size-large .content {\n    align-items: flex-start;\n    justify-content: center;\n    padding: 48px 48px 48px 0;\n  }\n  .duet-banner.size-large .action {\n    flex-grow: 0;\n  }\n}";
+const duetBannerCss = "*,\n*::after,\n*::before {\n  box-sizing: border-box;\n  padding: 0;\n  margin: 0;\n  background: transparent;\n  border: 0;\n  -moz-appearance: none;\n  -webkit-appearance: none;\n  appearance: none;\n}\n\n:host {\n  box-sizing: border-box;\n  padding: 0;\n  margin: 0;\n  background: transparent;\n  border: 0;\n  -moz-appearance: none;\n  -webkit-appearance: none;\n  appearance: none;\n  margin-right: 36px !important;\n  margin-bottom: 36px !important;\n  display: flex;\n  justify-content: center;\n  width: auto;\n  container: duet-banner-container;\n  container-type: inline-size;\n}\n:host:last-child, :host:last-of-type {\n  margin-right: 0 !important;\n}\n\n:host(.duet-m-0) {\n  margin: 0 !important;\n}\n\n.duet-banner {\n  display: grid;\n  grid-template-rows: min-content 1fr;\n  width: 100%;\n  height: 100%;\n  font-family: \"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";\n  font-style: normal;\n  text-align: left;\n  border-radius: 16px;\n}\n.duet-banner.duet-p-0 {\n  padding: 0 !important;\n}\n.duet-banner.duet-m-0 {\n  margin: 0 !important;\n}\n.duet-banner .visual {\n  position: relative;\n  display: none;\n  overflow: hidden;\n  /* stylelint-disable */\n}\n@container duet-banner-container (min-width: 0px) {\n  .duet-banner .visual {\n    /* stylelint-enable */\n    display: block;\n  }\n}\n.duet-banner .visual .image-container {\n  position: relative;\n  aspect-ratio: 2/1;\n  overflow: hidden;\n}\n.duet-banner .visual .image {\n  position: relative;\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n  object-position: center;\n}\n.duet-banner .visual .icon {\n  position: absolute;\n}\n.duet-banner .visual .brand-shape {\n  position: absolute;\n  top: 0;\n  left: 72%;\n  display: none;\n  width: 100%;\n  height: 100%;\n  mask-image: url(\"data:image/svg+xml,%3Csvg%20%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20160%20344%22%20fill%3D%22none%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M2.72641e-07%2091.1902C0.000476976%2097.9034%200.626077%20104.726%201.92282%20111.592L42.7493%20327.771C43.8045%20333.358%2045.2667%20338.776%2047.0996%20344H160V0H51.1439C19.7799%2019.1253%200.00268143%2053.4178%202.72641e-07%2091.1749C-9.08807e-08%2091.18%20-9.08875e-08%2091.1851%202.72641e-07%2091.1902Z%22%20fill%3D%22%23E6F2F8%22%2F%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fsvg%3E\");\n}\n.duet-banner .content {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  padding: 16px 20px 28px;\n}\n.duet-banner .content .description {\n  hyphens: auto;\n}\n.duet-banner .action {\n  display: flex;\n  flex-direction: column;\n  flex-grow: 1;\n  align-items: flex-start;\n  justify-content: flex-end;\n  padding-top: 16px;\n}\n.duet-banner .visual {\n  border-top-left-radius: 16px;\n  border-top-right-radius: 16px;\n}\n.duet-banner .visual .image-container {\n  width: 100%;\n  height: auto;\n  border-radius: 0;\n}\n.duet-banner .visual .icon {\n  bottom: 30px;\n  left: 15px;\n}\n.duet-banner.duet-theme-turva {\n  font-family: \"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";\n}\n.duet-banner.duet-theme-turva .visual .brand-shape {\n  mask-image: url(\"data:image/svg+xml,%3Csvg viewBox='0 0 160 344' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_7920_3801)'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M2.58983 142.533C0.751086 155.147 0.0746585 167.857 0.00796847 179.225C0.00263853 179.814 0 180.409 0 181.007C0 194.845 1.41172 210.806 3.58065 223.171C5.6528 234.934 8.58716 246.495 12.5981 257.779C21.2249 282.059 34.0151 304.109 50.8401 323.977C56.7824 330.993 63.0921 337.68 69.8162 344H160V0H65.0733C52.1771 10.7866 41.4339 23.4177 32.7528 37.7978C21.1154 57.0822 14.0367 77.9583 9.75424 99.7913C9.09214 103.157 8.55049 106.545 8.00901 109.933C7.75185 111.542 7.49474 113.15 7.22478 114.756C6.74308 117.618 6.24543 120.479 5.74776 123.34C4.6361 129.729 3.52432 136.12 2.58983 142.533Z' fill='%23F5F5F7'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_7920_3801'%3E%3Crect width='160' height='344' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A\");\n}\n.duet-banner.size-medium, .duet-banner.size-large {\n  /* stylelint-disable */\n  /* stylelint-disable */\n}\n@container duet-banner-container (min-width: 486px) {\n  .duet-banner.size-medium, .duet-banner.size-large {\n    /* stylelint-enable */\n    grid-template-rows: none;\n    grid-template-columns: 50% 50%;\n  }\n  .duet-banner.size-medium .visual, .duet-banner.size-large .visual {\n    border-top-left-radius: 16px;\n    border-top-right-radius: 0;\n    border-bottom-left-radius: 16px;\n  }\n  .duet-banner.size-medium .visual .image-container, .duet-banner.size-large .visual .image-container {\n    height: 100%;\n  }\n  .duet-banner.size-medium .visual .image, .duet-banner.size-large .visual .image {\n    width: 100%;\n    height: 100%;\n  }\n  .duet-banner.size-medium .visual .icon, .duet-banner.size-large .visual .icon {\n    top: 36px;\n    left: 168px;\n  }\n  .duet-banner.size-medium .visual .brand-shape, .duet-banner.size-large .visual .brand-shape {\n    display: block;\n  }\n  .duet-banner.size-medium .content, .duet-banner.size-large .content {\n    align-items: flex-start;\n    justify-content: center;\n    padding: 28px 28px 28px 0;\n  }\n  .duet-banner.size-medium .action, .duet-banner.size-large .action {\n    flex-grow: 0;\n  }\n}\n@container duet-banner-container (min-width: 586px) {\n  .duet-banner.size-medium, .duet-banner.size-large {\n    /* stylelint-enable */\n  }\n  .duet-banner.size-medium .visual .brand-shape, .duet-banner.size-large .visual .brand-shape {\n    left: 80%;\n  }\n}\n.duet-banner.size-large {\n  /* stylelint-disable */\n}\n@container duet-banner-container (min-width: 900px) {\n  .duet-banner.size-large {\n    /* stylelint-enable */\n    grid-template-rows: none;\n    grid-template-columns: 50% 50%;\n  }\n  .duet-banner.size-large .visual {\n    border-top-left-radius: 16px;\n    border-bottom-left-radius: 16px;\n  }\n  .duet-banner.size-large .visual .image-container {\n    height: 100%;\n  }\n  .duet-banner.size-large .visual .image {\n    width: 100%;\n    height: 100%;\n  }\n  .duet-banner.size-large .visual .icon {\n    top: 40px;\n    bottom: auto;\n    left: 335px;\n  }\n  .duet-banner.size-large .visual .brand-shape {\n    display: block;\n  }\n  .duet-banner.size-large .content {\n    align-items: flex-start;\n    justify-content: center;\n    padding: 48px 48px 48px 0;\n  }\n  .duet-banner.size-large .action {\n    flex-grow: 0;\n  }\n}";
 
 const DuetBanner$1 = /*@__PURE__*/ proxyCustomElement(class DuetBanner extends H {
     constructor() {
@@ -107,7 +107,7 @@ const DuetBanner$1 = /*@__PURE__*/ proxyCustomElement(class DuetBanner extends H
                 [this.currentSize]: true,
                 "size-medium": this.size === "medium" || this.size === "large",
                 "size-large": this.size === "large",
-            }, style: bannerStyles }, h$1("div", { class: "visual" }, h$1("div", { class: "image-container" }, this.image && h$1(DuetPicture, Object.assign({}, pictureSource))), 1 > 2  , h$1("div", { class: "brand-shape" })), h$1("div", { class: "content" }, this.hasHeadingSlot && (h$1("div", { class: "heading" }, h$1("duet-heading", { theme: this.theme, level: this.headingLevel, "visual-level": this.currentSize === "large" ? "h2" : "h3", "fixed-size": true, margin: "none", color: this.textColor }, h$1("span", null, h$1("slot", { name: "heading" }))))), this.hasDescriptionSlot && (h$1("div", { class: "description", style: { color } }, h$1("slot", { name: "description" }))), this.hasActionSlot && (h$1("div", { class: "action" }, h$1("slot", { name: "action" })))))));
+            }, style: bannerStyles }, h$1("div", { class: "visual" }, h$1("div", { class: "image-container" }, this.image && h$1(DuetPicture, Object.assign({}, pictureSource))), 1 > 2  , h$1("div", { style: bannerStyles, class: "brand-shape" })), h$1("div", { class: "content" }, this.hasHeadingSlot && (h$1("div", { class: "heading" }, h$1("duet-heading", { theme: this.theme, level: this.headingLevel, "visual-level": this.currentSize === "large" ? "h2" : "h3", "fixed-size": true, margin: "none", color: this.textColor }, h$1("span", null, h$1("slot", { name: "heading" }))))), this.hasDescriptionSlot && (h$1("div", { class: "description", style: { color } }, h$1("slot", { name: "description" }))), this.hasActionSlot && (h$1("div", { class: "action" }, h$1("slot", { name: "action" })))))));
     }
     get element() { return this; }
     static get style() { return duetBannerCss; }

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

@@ -5,7 +5,7 @@ import { p as proxyCustomElement, H, h, d as Host } from './p-e98f9bb0.js';
 import { i as inheritGlobalTheme } from './p-a58bd561.js';
 import { s as subscribeTabbingChange, u as unsubscribeTabbingChange } from './p-785686e3.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-98d17606.js';
+import { d as defineCustomElement$3 } from './p-9ca3437c.js';
 import { d as defineCustomElement$2 } from './p-23e23ced.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

@@ -4,7 +4,7 @@
 import { p as proxyCustomElement, H, h, d as Host } from './p-e98f9bb0.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';
+import { g as getColorByName } from './p-3ec3eb5f.js';
 
 const duetBreadcrumbsCss = "*,*::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%}::slotted(*){font-weight:400}::slotted(:last-child){font-weight:600}:host([variation=plain]) ::slotted(:last-child){font-weight:400}.duet-breadcrumbs{position:relative;display:flex;align-items:center;justify-content:center;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"}.duet-breadcrumbs .container{position:relative;display:flex;align-items:center;justify-content:space-between;width:100%;max-width:1384px;min-height:36px;margin:0 28px}.duet-breadcrumbs .list{display:flex;flex-direction:row;flex-wrap:wrap;gap:8px;align-items:center;justify-content:flex-start;padding:10px 0;color:inherit;list-style:none}.duet-breadcrumbs .bottom-border{position:absolute;bottom:0;display:none;width:100%;height:1px}.duet-breadcrumbs.header{color:rgb(0, 41, 77);background:rgb(243, 249, 252)}.duet-breadcrumbs.header .list duet-breadcrumb[href]:hover{color:rgb(0, 77, 128)}.duet-breadcrumbs.header .bottom-border--nav{display:block;background:rgb(225, 227, 230)}.duet-breadcrumbs.header.duet-theme-turva{color:rgb(23, 28, 58);background:rgb(245, 245, 247)}.duet-breadcrumbs.header.duet-theme-turva ol duet-breadcrumb[href]:hover{color:rgb(148, 9, 37)}.duet-breadcrumbs.footer{color:rgb(255, 255, 255);background:rgb(0, 41, 77)}@media (min-width: 64.0625em){.duet-breadcrumbs.footer{justify-content:flex-start}}@media (min-width: 76.25em){.duet-breadcrumbs.footer{justify-content:center}}.duet-breadcrumbs.footer .container{max-width:1110px}@media (min-width: 62em){.duet-breadcrumbs.footer .container{margin:0 72px 0 48px}}.duet-breadcrumbs.footer .list{padding:20px 0}@media (min-width: 62em){.duet-breadcrumbs.footer .list{padding:20px 8px}}.duet-breadcrumbs.footer .list duet-breadcrumb[href]:hover{text-decoration:underline}.duet-breadcrumbs.footer .bottom-border--container{display:block;background:rgba(255, 255, 255, 0.2)}.duet-breadcrumbs.footer.duet-theme-turva{color:rgb(255, 255, 255);background:rgb(198, 12, 48)}.duet-breadcrumbs.plain .container{max-width:none;min-height:auto;margin:0}.duet-breadcrumbs.plain .list{padding:0}.duet-breadcrumbs.plain .bottom-border{display:none}";
 

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-4c6021d9.js';
+import { D as DuetButton$1, d as defineCustomElement$1 } from './p-20b3fa1e.js';
 
 const DuetButton = DuetButton$1;
 const defineCustomElement = defineCustomElement$1;

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

@@ -4,7 +4,7 @@
 import { p as proxyCustomElement, H, h, d as Host } from './p-e98f9bb0.js';
 import { i as inheritGlobalTheme } from './p-a58bd561.js';
 import { h as hasSlot, c as checkNamedSlotElement } from './p-06e608ae.js';
-import { d as defineCustomElement$2 } from './p-98d17606.js';
+import { d as defineCustomElement$2 } from './p-9ca3437c.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-card.js

@@ -6,8 +6,8 @@ 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-785686e3.js';
 import { s as sanitizeString } from './p-0e052642.js';
-import { g as getColorByName } from './p-25c80cdb.js';
-import { d as defineCustomElement$3 } from './p-98d17606.js';
+import { g as getColorByName } from './p-3ec3eb5f.js';
+import { d as defineCustomElement$3 } from './p-9ca3437c.js';
 import { d as defineCustomElement$2 } from './p-23e23ced.js';
 
 const duetHeadingLevels = ["h1", "h2", "h3", "h4", "h5", "h6"];

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

@@ -1,7 +1,7 @@
 /*!
  * Built with Duet Design System
  */
-import { D as DuetChip$1, d as defineCustomElement$1 } from './p-531e8a71.js';
+import { D as DuetChip$1, d as defineCustomElement$1 } from './p-ef51ec63.js';
 
 const DuetChip = DuetChip$1;
 const defineCustomElement = defineCustomElement$1;

package/lib/dist-custom-elements/duet-choice-group.js

@@ -6,10 +6,10 @@ import { i as inheritGlobalTheme } from './p-a58bd561.js';
 import { c as checkNamedSlotElement } from './p-06e608ae.js';
 import { d as defineCustomElement$8 } from './p-b6322d8d.js';
 import { d as defineCustomElement$7 } from './p-45fd4d84.js';
-import { d as defineCustomElement$6 } from './p-98d17606.js';
-import { d as defineCustomElement$5 } from './p-bb662681.js';
+import { d as defineCustomElement$6 } from './p-9ca3437c.js';
+import { d as defineCustomElement$5 } from './p-f47e755d.js';
 import { d as defineCustomElement$4 } from './p-c8415e2f.js';
-import { d as defineCustomElement$3 } from './p-7b843aae.js';
+import { d as defineCustomElement$3 } from './p-ecaba4be.js';
 import { d as defineCustomElement$2 } from './p-d1815d2a.js';
 
 const duetChoiceGroupCss = "*.sc-duet-choice-group,*.sc-duet-choice-group::after,*.sc-duet-choice-group::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}.sc-duet-choice-group-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;display:block;width:100%}.horizontal.sc-duet-choice-group-h .duet-choice-group.sc-duet-choice-group{display:block;margin-bottom:-12px}.horizontal.sc-duet-choice-group-h .duet-choice-group.duet-no-stacking.sc-duet-choice-group{display:flex}@media (min-width: 48em){.horizontal.sc-duet-choice-group-h .duet-choice-group.sc-duet-choice-group{margin-bottom:0}}@media (max-width: 35.9375em){.horizontal.sc-duet-choice-group-h .duet-choice-group.sc-duet-choice-group{display:flex}}.horizontal.duet-choice-group-breakpoint-x-small.sc-duet-choice-group-h .duet-choice-group.sc-duet-choice-group:not(.duet-no-stacking){display:flex}@media (max-width: 22.5em){.horizontal.duet-choice-group-breakpoint-x-small.sc-duet-choice-group-h .duet-choice-group.sc-duet-choice-group:not(.duet-no-stacking){display:block}}.horizontal.duet-choice-group-breakpoint-small.sc-duet-choice-group-h .duet-choice-group.sc-duet-choice-group:not(.duet-no-stacking){display:block}@media (min-width: 36em){.horizontal.duet-choice-group-breakpoint-small.sc-duet-choice-group-h .duet-choice-group.sc-duet-choice-group:not(.duet-no-stacking){display:flex}}.horizontal.duet-choice-group-breakpoint-medium.sc-duet-choice-group-h .duet-choice-group.sc-duet-choice-group:not(.duet-no-stacking){display:block}@media (min-width: 48em){.horizontal.duet-choice-group-breakpoint-medium.sc-duet-choice-group-h .duet-choice-group.sc-duet-choice-group:not(.duet-no-stacking){display:flex}}.horizontal.duet-choice-group-breakpoint-large.sc-duet-choice-group-h .duet-choice-group.sc-duet-choice-group:not(.duet-no-stacking){display:block}@media (min-width: 62em){.horizontal.duet-choice-group-breakpoint-large.sc-duet-choice-group-h .duet-choice-group.sc-duet-choice-group:not(.duet-no-stacking){display:flex}}.horizontal.duet-choice-group-breakpoint-x-large.sc-duet-choice-group-h .duet-choice-group.sc-duet-choice-group:not(.duet-no-stacking){display:block}@media (min-width: 64.0625em){.horizontal.duet-choice-group-breakpoint-x-large.sc-duet-choice-group-h .duet-choice-group.sc-duet-choice-group:not(.duet-no-stacking){display:flex}}.duet-choice-group.sc-duet-choice-group{position:relative;width:100%;margin-bottom:-12px}";

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

@@ -9,7 +9,7 @@ import { i as isKeyboardClick, a as isQuestionKey, s as subscribeTabbingChange,
 import { g as getLocaleString, a as getLanguage, c as connectLanguageChangeObserver, d as disconnectLanguageChangeObserver } from './p-2e36d5bf.js';
 import { h as hasSlot } from './p-06e608ae.js';
 import { d as defineCustomElement$4 } from './p-b6322d8d.js';
-import { d as defineCustomElement$3 } from './p-98d17606.js';
+import { d as defineCustomElement$3 } from './p-9ca3437c.js';
 import { d as defineCustomElement$2 } from './p-23e23ced.js';
 
 var messagingInfo={"title":"messaging-info","tags":"messaging info information circle","svg":"<svg fill=\"currentColor\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" role=\"img\"><path d=\"M13.5 17.25A2.252 2.252 0 0 1 11.25 15v-3.75h-.75a.75.75 0 0 1 0-1.5h.75c.827 0 1.5.673 1.5 1.5V15c0 .414.336.75.75.75h.75a.75.75 0 0 1 0 1.5z\"/><circle cx=\"11.625\" cy=\"7.125\" r=\"1.125\"/><path d=\"M12 24C5.383 24 0 18.617 0 12S5.383 0 12 0s12 5.383 12 12-5.383 12-12 12zm0-22.5C6.21 1.5 1.5 6.21 1.5 12S6.21 22.5 12 22.5 22.5 17.79 22.5 12 17.79 1.5 12 1.5z\"/></svg>"};

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

@@ -3,13 +3,13 @@
  */
 import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-e98f9bb0.js';
 import { a as actionArrowDownSmall } from './p-115c79b6.js';
-import { f as font_size_medium, t as tokens } from './p-f9a8d356.js';
+import { f as font_size_medium, t as tokens } from './p-d5c03b61.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-785686e3.js';
 import { h as hasSlot } from './p-06e608ae.js';
 import { s as sanitizeString } from './p-0e052642.js';
-import { d as defineCustomElement$2 } from './p-98d17606.js';
+import { d as defineCustomElement$2 } from './p-9ca3437c.js';
 
 const duetCollapsibleCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}::slotted([slot=after-heading]){display:inline-block}: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:block;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(0, 41, 77)}: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-m-0){margin:0 !important}.duet-collapsible-content{display:none;padding-left:18px;margin-top:8px;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;font-variant-numeric:tabular-nums;-webkit-hyphens:auto;hyphens:auto;line-height:1.5;color:rgb(0, 41, 77)}@media (max-width: 35.9375em){.duet-collapsible-content{font-size:0.875rem}}.duet-collapsible-content.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([open])>.duet-collapsible-content{display:block}.duet-collapsible-heading{-webkit-user-select:none;user-select:none;display:flex;align-items:center;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(0, 41, 77);text-align:left;cursor:pointer;border-radius:4px}.duet-collapsible-heading.full-width{width:100%}.duet-collapsible-heading.duet-collapsible-heading-centered{margin:auto}.duet-collapsible-heading.duet-collapsible-normal-weight{font-weight:400}.duet-collapsible-heading.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-collapsible-heading .duet-collapsible-heading-content{min-width:0}.duet-collapsible-heading.has-after-heading .duet-collapsible-heading-content+div{margin-left:16px}.duet-collapsible-heading.has-after-heading .duet-collapsible-heading-content+div.float-right{margin-left:auto}.duet-collapsible-heading:focus{outline:0}:host(.user-is-tabbing) .duet-collapsible-heading: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-collapsible-heading.duet-theme-turva:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-collapsible-heading-icon{margin-right:8px !important;display:flex;align-items:center;justify-content:center;color:rgb(0, 41, 77);transition:transform 300ms ease}.duet-collapsible-heading-icon:last-child,.duet-collapsible-heading-icon:last-of-type{margin-right:0 !important}[aria-expanded=true] .duet-collapsible-heading-icon{transform:rotate(180deg)}";