@duetds/components 10.0.0-alpha.2 → 10.0.0-alpha.4

package/lib/esm/duet-caption_4.entry.js

@@ -1,17 +1,17 @@
 /*!
  * Built with Duet Design System
  */
-import { r as registerInstance, h, H as Host, g as getElement, F as Fragment } from './index-1d0b7c66.js';
+import { r as registerInstance, h, H as Host, g as getElement, F as Fragment } from './index-4b4e4ec8.js';
 import { i as inheritGlobalTheme } from './themeable-component-860041c5.js';
 import { s as sanitizeString } from './string-utils-192eb3c8.js';
-import { g as getColorByName, a as breakpointToToken } from './token-utils-a32eb753.js';
+import { g as getColorByName } from './token-utils-b9ba8c5e.js';
 import { a as actionNewWindowSmall } from './action-new-window-small-1945be91.js';
 import { D as DuetStringsExternalDefaults, c as DuetStringsDownloadLinkDefaults } from './common-strings-af765cad.js';
-import { g as getAccessibleLinkLabel } from './a11y-utils-8fc393f6.js';
-import { a as getLanguage, g as getLocaleString, c as connectLanguageChangeObserver, d as disconnectLanguageChangeObserver } from './language-utils-14969cef.js';
+import { g as getAccessibleLinkLabel } from './a11y-utils-c52606bf.js';
+import { a as getLanguage, g as getLocaleString, c as connectLanguageChangeObserver, d as disconnectLanguageChangeObserver } from './language-utils-1b413a6b.js';
 import { c as createID } from './create-id-149a1b6d.js';
-import './tokens.module-a746651a.js';
-import './slot-utils-4e5ed4eb.js';
+import './tokens.module-2d02f5ff.js';
+import './slot-utils-ae4dc467.js';
 
 const duetCaptionCss = ":host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-bottom:16px !important;display:flex;flex:0 0 100%;width:100%;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:1rem;font-weight:400;line-height:1.5;color:rgb(98, 121, 138);vertical-align:top}:host.duet-p-0{padding:0 !important}:host.duet-m-0{margin:0 !important}:host(.duet-caption-small){font-size:0.875rem;line-height:1.25}:host(.duet-theme-turva){font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(143, 147, 158)}:host(.duet-caption-selected){color:rgb(0, 119, 179)}:host(.duet-caption-selected.duet-theme-turva){color:rgb(23, 28, 58)}:host(.duet-m-0){margin:0 !important}";
 const DuetCaptionStyle0 = duetCaptionCss;
@@ -35,13 +35,13 @@ const DuetCaption = class {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: '3e38c62d454dfed7441c080efc8d3d836310bee6', class: {
+        return (h(Host, { key: 'cefb662c677d5a45cc8e007a68ab67b0698ce2ee', class: {
                 "duet-caption": true,
                 "duet-caption-selected": this.selected,
                 "duet-caption-small": this.size === "small",
                 "duet-theme-turva": this.theme === "turva",
                 "duet-m-0": this.margin === "none",
-            } }, h("slot", { key: 'a6a279b8c145c11eb9452b6b90e224a032a2232f' })));
+            } }, h("slot", { key: '4a38bee52925d9c7db4473dd0e5bc92797b0b058' })));
     }
     get element() { return getElement(this); }
 };
@@ -76,7 +76,7 @@ const DuetHeading = class {
     render() {
         const TagName = sanitizeString(this.level);
         const color = getColorByName(this.color);
-        return (h(TagName, { key: 'f606e3e4de6cf69ec6743328d4e9e8bbce5fe66b', class: {
+        return (h(TagName, { key: '639aa76baa836dd1154030602e491d5592976e29', class: {
                 "duet-heading": true,
                 "duet-heading-border": this.border !== false,
                 "duet-heading-border-solid": this.border === "solid",
@@ -87,7 +87,7 @@ const DuetHeading = class {
                 [this.visualLevel ? this.visualLevel : this.level]: true,
                 "duet-theme-turva": this.theme === "turva",
                 "fixed-size": this.fixedSize,
-            }, style: { color }, part: "duet-heading" }, h("slot", { key: '57fe6321051376c1b8dd03ceb22130a79d916745' })));
+            }, style: { color }, part: "duet-heading" }, h("slot", { key: '99875cdb1ebbbee0ac5a3b7821dcb8504f2f8bb9' })));
     }
     get element() { return getElement(this); }
 };
@@ -99,7 +99,7 @@ var actionDownloadSmall={"title":"action-download-small","tags":"action download
 
 var actionNewWindow={"title":"action-new-window","tags":"arrow open new window tab external link square box rectangle action","svg":"<svg fill=\"currentColor\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" role=\"img\"><path d=\"M10.25 2a.75.75 0 1 1 0 1.5h-6.5A2.252 2.252 0 0 0 1.5 5.75v14.5a2.252 2.252 0 0 0 2.25 2.25h14.5a2.252 2.252 0 0 0 2.25-2.25v-6.5a.75.75 0 0 1 1.5 0v6.5A3.754 3.754 0 0 1 18.25 24H3.75A3.754 3.754 0 0 1 0 20.25V5.75A3.754 3.754 0 0 1 3.75 2zm12.985-2c.1 0 .198.02.29.058l.025.011a.726.726 0 0 1 .15.091l.066.059a.755.755 0 0 1 .109.138l.051.1c.04.092.06.192.06.293l-.001 6.363c0 .2-.078.389-.22.53a.743.743 0 0 1-.53.22.743.743 0 0 1-.53-.22.743.743 0 0 1-.22-.53V2.559L15.28 9.764a.75.75 0 0 1-1.06-1.06l7.204-7.205h-4.553a.744.744 0 0 1-.75-.75c0-.2.078-.388.22-.53A.743.743 0 0 1 16.87 0z\"/></svg>"};
 
-const duetLinkCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;display:inline}:host(.duet-link-block){display:block}:host(.duet-link-button){margin-right:8px !important;margin-bottom:12px !important;display:inline-block;width:100%}:host(.duet-link-button):last-child,:host(.duet-link-button):last-of-type{margin-right:0 !important}:host(.duet-m-0){margin:0 !important}.duet-link{display:inline;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-style:normal;font-weight:400;color:rgb(0, 97, 155);text-decoration:underline;border-radius:4px;transition:300ms ease}.duet-link:focus{outline:0;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3 !important}.duet-theme-turva .duet-link:focus,.duet-link:focus.duet-theme-turva{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a !important}.duet-link.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(164, 4, 40)}.duet-link:hover{color:rgb(0, 75, 129);text-decoration:none}.duet-link:hover.duet-theme-turva{color:rgb(126, 2, 35)}.duet-link:active{opacity:0.75;transition:none}button{font-size:inherit;cursor:pointer}.duet-link-is-external.duet-link:not(.block,.button,.card),.duet-link-is-download.duet-link:not(.block,.button,.card){text-decoration:none}.duet-link-is-external.duet-link:not(.block,.button,.card) .duet-link-content,.duet-link-is-download.duet-link:not(.block,.button,.card) .duet-link-content{text-decoration:underline}.duet-link-is-external.duet-link:not(.block,.button,.card):hover>.duet-link-content,.duet-link-is-download.duet-link:not(.block,.button,.card):hover>.duet-link-content{text-decoration:none}.duet-link-is-external.duet-link:not(.block,.button,.card) .duet-link-icon-tail,.duet-link-is-download.duet-link:not(.block,.button,.card) .duet-link-icon-tail{text-decoration:none;white-space:nowrap}.duet-tab-to-link{padding:15px 28px 16px !important;position:absolute;top:-100%;left:-100%;z-index:200;width:1px;min-width:190px;height:1px;overflow:hidden;font-weight:600;color:rgb(0, 119, 179);text-align:center;text-decoration:none;background:rgb(255, 255, 255);border-radius:4px;opacity:0;transition:none}.duet-tab-to-link.duet-theme-turva{min-width:120px;color:rgb(23, 28, 58)}@media (min-width: 106.25em){.duet-tab-to-link{margin-left:20px}}.duet-tab-to-link:focus{top:12px;left:20px;width:auto;height:auto;outline:0;opacity:1}.block.duet-link{display:grid;grid-template-columns:1fr auto;gap:16px;align-items:start;padding:16px;font-weight:600;color:rgb(8, 42, 77);text-decoration:none}.block.duet-link.duet-link-has-icon{grid-template-columns:auto 1fr auto}.block.duet-link.none{padding:0}.block .block__icon{display:flex}.block .block__content{position:relative;bottom:2px}.block .block__chevron{align-self:center}.block .block__chevron-icon{transition:300ms ease}.block:not(.duet-link-is-external):hover .block__chevron-icon{transform:translateX(4px)}.duet-link.button,.duet-link.card{display:flex;gap:12px;align-items:center;width:100%;min-height:48px;padding:14px 16px;line-height:1.25;text-decoration:none;background-color:rgb(255, 255, 255);border:solid 1px rgb(181, 198, 208);border-radius:12px;outline:0 solid rgb(181, 198, 208);outline-offset:-2px;transition:all 300ms ease}.duet-link.button>*,.duet-link.card>*{flex-shrink:0}.duet-link.button .duet-link-content,.duet-link.card .duet-link-content{flex-grow:1;flex-shrink:1;font-size:1rem;font-weight:600;color:rgb(8, 42, 77);text-align:left}.duet-link.button .icon-wrap,.duet-link.card .icon-wrap{display:flex;align-items:center;justify-content:center}.duet-link.button.duet-link-has-icon-background,.duet-link.card.duet-link-has-icon-background{min-height:60px;padding:12px;padding-right:20px;line-height:1.5}.duet-link.button.duet-link-has-icon-background .icon-wrap,.duet-link.card.duet-link-has-icon-background .icon-wrap{width:36px;height:36px;border-radius:8px}.duet-link.button:hover,.duet-link.card:hover{border-color:rgb(0, 119, 179);outline:2px solid rgb(0, 119, 179)}@media (min-width: 48em){.duet-link.button,.duet-link.card{min-height:50px}.duet-link.button.duet-link-has-icon-background,.duet-link.card.duet-link-has-icon-background{gap:16px;min-height:72px;border-radius:16px}.duet-link.button.duet-link-has-icon-background .icon-wrap,.duet-link.card.duet-link-has-icon-background .icon-wrap{width:48px;height:48px;border-radius:12px}.duet-link.button.duet-link-has-icon-background .duet-link-content,.duet-link.card.duet-link-has-icon-background .duet-link-content{font-size:1.1rem}}.duet-link.button.duet-theme-turva,.duet-link.card.duet-theme-turva{border-color:rgb(199, 202, 207)}.duet-link.button.duet-theme-turva .duet-link-content,.duet-link.card.duet-theme-turva .duet-link-content{color:rgb(23, 28, 58)}.duet-link.button.duet-theme-turva:hover,.duet-link.card.duet-theme-turva:hover{border-color:rgb(198, 12, 48);outline-color:rgb(198, 12, 48)}.duet-link.button .block__chevron-icon,.duet-link.card .block__chevron-icon{transition:300ms ease}.duet-link.button:not(.duet-link-is-external):hover .block__chevron-icon,.duet-link.card:not(.duet-link-is-external):hover .block__chevron-icon{transform:translateX(4px)}.duet-link.card{border-color:rgb(228, 236, 239);box-shadow:0 2px 6px 0 rgba(0, 41, 77, 0.07), 0 -1px 0 0 rgba(0, 0, 0, 0.09), -1px 0 0 0 rgba(0, 0, 0, 0.07), 1px 0 0 0 rgba(0, 0, 0, 0.07), 0 1px 0 0 rgba(0, 0, 0, 0.07)}.duet-link.card.duet-theme-turva{border-color:rgb(234, 235, 239);box-shadow:0 2px 6px 0 rgba(117, 117, 117, 0.13)}.duet-link.card:not(.duet-link-has-icon){gap:12px;padding:16px}.duet-link.card .chevron-wrap{display:flex;align-items:center;height:100%}.duet-link.card.duet-link-has-icon{gap:12px;align-items:flex-start;padding:16px}.duet-link.card.duet-link-has-icon .icon-wrap{width:48px;height:48px;border-radius:12px}.duet-link.card.duet-link-has-icon .chevron-wrap{height:48px}@media (min-width: 48em){.duet-link.card:not(.duet-link-has-icon){gap:20px;padding:24px}.duet-link.card.duet-link-has-icon{gap:20px;padding:24px}.duet-link.card.duet-link-has-icon .icon-wrap{width:62px;height:62px;border-radius:16px}.duet-link.card.duet-link-has-icon .chevron-wrap{height:62px}}";
+const duetLinkCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;display:inline}:host(.duet-link-block){display:block}:host(.duet-link-button){margin-right:8px !important;margin-bottom:12px !important;display:inline-block;width:100%}:host(.duet-link-button):last-child,:host(.duet-link-button):last-of-type{margin-right:0 !important}:host(.duet-m-0){margin:0 !important}.duet-link{display:inline;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-style:normal;font-weight:400;color:rgb(0, 97, 155);text-decoration:underline;border-radius:4px;transition:300ms ease}.duet-link:focus{outline:0;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3 !important}.duet-theme-turva .duet-link:focus,.duet-link:focus.duet-theme-turva{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a !important}.duet-link.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(164, 4, 40)}.duet-link:hover{color:rgb(0, 75, 129);text-decoration:none}.duet-link:hover.duet-theme-turva{color:rgb(126, 2, 35)}.duet-link:active{opacity:0.75;transition:none}button{font-size:inherit;cursor:pointer}.duet-link-is-external.duet-link:not(.block,.button,.card),.duet-link-is-download.duet-link:not(.block,.button,.card){text-decoration:none}.duet-link-is-external.duet-link:not(.block,.button,.card) .duet-link-content,.duet-link-is-download.duet-link:not(.block,.button,.card) .duet-link-content{text-decoration:underline}.duet-link-is-external.duet-link:not(.block,.button,.card):hover>.duet-link-content,.duet-link-is-download.duet-link:not(.block,.button,.card):hover>.duet-link-content{text-decoration:none}.duet-link-is-external.duet-link:not(.block,.button,.card) .duet-link-icon-tail,.duet-link-is-download.duet-link:not(.block,.button,.card) .duet-link-icon-tail{text-decoration:none;white-space:nowrap}.duet-tab-to-link{padding:15px 28px 16px !important;position:absolute;top:-100%;left:-100%;z-index:200;width:1px;min-width:190px;height:1px;overflow:hidden;font-weight:600;color:rgb(0, 119, 179);text-align:center;text-decoration:none;background:rgb(255, 255, 255);border-radius:4px;opacity:0;transition:none}.duet-tab-to-link.duet-theme-turva{min-width:120px;color:rgb(23, 28, 58)}@media (min-width: 106.25em){.duet-tab-to-link{margin-left:20px}}.duet-tab-to-link:focus{top:12px;left:20px;width:auto;height:auto;outline:0;opacity:1}.block.duet-link{display:grid;grid-template-columns:1fr auto;gap:16px;align-items:start;padding:16px;font-weight:600;color:rgb(8, 42, 77);text-decoration:none}.block.duet-link.duet-link-has-icon{grid-template-columns:auto 1fr auto}.block.duet-link.none{padding:0}.block .block__icon{display:flex}.block .block__icon duet-icon{width:16px;height:16px}.block .block__icon duet-icon.icon-responsive{width:30px;height:30px}@media (max-width: 22.5em){.block .block__icon duet-icon.icon-responsive{width:24px;height:24px}}.block .block__content{position:relative;bottom:2px}.block .block__chevron{align-self:center}.block .block__chevron-icon{transition:300ms ease}.block:not(.duet-link-is-external):hover .block__chevron-icon{transform:translateX(4px)}.duet-link.button:not(.duet-link-has-icon-background) .icon-wrap duet-icon{width:20px;height:20px}.duet-link.button.duet-link-has-icon-background .icon-wrap duet-icon{width:20px;height:20px}@media (min-width: 48em){.duet-link.button.duet-link-has-icon-background .icon-wrap duet-icon{width:24px;height:24px}}.duet-link.button,.duet-link.card{display:flex;gap:12px;align-items:center;width:100%;min-height:48px;padding:14px 16px;line-height:1.25;text-decoration:none;background-color:rgb(255, 255, 255);border:solid 1px rgb(181, 198, 208);border-radius:12px;outline:0 solid rgb(181, 198, 208);outline-offset:-2px;transition:all 300ms ease}.duet-link.button>*,.duet-link.card>*{flex-shrink:0}.duet-link.button .duet-link-content,.duet-link.card .duet-link-content{flex-grow:1;flex-shrink:1;font-size:1rem;font-weight:600;color:rgb(8, 42, 77);text-align:left}.duet-link.button .icon-wrap,.duet-link.card .icon-wrap{display:flex;align-items:center;justify-content:center}.duet-link.button .icon-wrap duet-icon,.duet-link.card .icon-wrap duet-icon{width:24px;height:24px}@media (min-width: 48em){.duet-link.button .icon-wrap duet-icon,.duet-link.card .icon-wrap duet-icon{width:30px;height:30px}}.duet-link.button.duet-link-has-icon-background,.duet-link.card.duet-link-has-icon-background{min-height:60px;padding:12px;padding-right:20px;line-height:1.5}.duet-link.button.duet-link-has-icon-background .icon-wrap,.duet-link.card.duet-link-has-icon-background .icon-wrap{width:36px;height:36px;border-radius:8px}.duet-link.button:hover,.duet-link.card:hover{border-color:rgb(0, 119, 179);outline:2px solid rgb(0, 119, 179)}@media (min-width: 48em){.duet-link.button,.duet-link.card{min-height:50px}.duet-link.button.duet-link-has-icon-background,.duet-link.card.duet-link-has-icon-background{gap:16px;min-height:72px;border-radius:16px}.duet-link.button.duet-link-has-icon-background .icon-wrap,.duet-link.card.duet-link-has-icon-background .icon-wrap{width:48px;height:48px;border-radius:12px}.duet-link.button.duet-link-has-icon-background .duet-link-content,.duet-link.card.duet-link-has-icon-background .duet-link-content{font-size:1.1rem}}.duet-link.button.duet-theme-turva,.duet-link.card.duet-theme-turva{border-color:rgb(199, 202, 207)}.duet-link.button.duet-theme-turva .duet-link-content,.duet-link.card.duet-theme-turva .duet-link-content{color:rgb(23, 28, 58)}.duet-link.button.duet-theme-turva:hover,.duet-link.card.duet-theme-turva:hover{border-color:rgb(198, 12, 48);outline-color:rgb(198, 12, 48)}.duet-link.button .block__chevron-icon,.duet-link.card .block__chevron-icon{transition:300ms ease}.duet-link.button:not(.duet-link-is-external):hover .block__chevron-icon,.duet-link.card:not(.duet-link-is-external):hover .block__chevron-icon{transform:translateX(4px)}.duet-link.card{border-color:rgb(228, 236, 239);box-shadow:0 2px 6px 0 rgba(0, 41, 77, 0.07), 0 -1px 0 0 rgba(0, 0, 0, 0.09), -1px 0 0 0 rgba(0, 0, 0, 0.07), 1px 0 0 0 rgba(0, 0, 0, 0.07), 0 1px 0 0 rgba(0, 0, 0, 0.07)}.duet-link.card.duet-theme-turva{border-color:rgb(234, 235, 239);box-shadow:0 2px 6px 0 rgba(117, 117, 117, 0.13)}.duet-link.card:not(.duet-link-has-icon){gap:12px;padding:16px}.duet-link.card .chevron-wrap{display:flex;align-items:center;height:100%}.duet-link.card.duet-link-has-icon{gap:12px;align-items:flex-start;padding:16px}.duet-link.card.duet-link-has-icon .icon-wrap{width:48px;height:48px;border-radius:12px}.duet-link.card.duet-link-has-icon .chevron-wrap{height:48px}@media (min-width: 48em){.duet-link.card:not(.duet-link-has-icon){gap:20px;padding:24px}.duet-link.card.duet-link-has-icon{gap:20px;padding:24px}.duet-link.card.duet-link-has-icon .icon-wrap{width:62px;height:62px;border-radius:16px}.duet-link.card.duet-link-has-icon .chevron-wrap{height:62px}}";
 const DuetLinkStyle0 = duetLinkCss;
 
 const DuetLink = class {
@@ -126,7 +126,6 @@ const DuetLink = class {
         this.iconResponsive = false;
         this.margin = "auto";
         this.padding = "auto";
-        this.isSmallScreen = false;
         this.isMediumScreen = false;
     }
     /**
@@ -134,7 +133,6 @@ const DuetLink = class {
      */
     componentWillLoad() {
         inheritGlobalTheme(this);
-        this.initMediaQuery();
         this.resolvedDownload = this.resolveDownload();
         // button variation renders a button element when no url is provided
         if (this.variation === "button" && this.url === "#") {
@@ -149,7 +147,6 @@ const DuetLink = class {
     }
     disconnectedCallback() {
         disconnectLanguageChangeObserver(this);
-        this.destroyMediaQuery();
     }
     /**
      * Sets focus on the specified `duet-link`. Use this method instead of the global
@@ -158,27 +155,6 @@ const DuetLink = class {
     async setFocus(options) {
         this.nativeLink.focus(options);
     }
-    initMediaQuery() {
-        this.screenTestBound = this.screenTest.bind(this);
-        this.mediaQuerySmall = window.matchMedia(breakpointToToken["xx-small"]);
-        this.mediaQueryMedium = window.matchMedia(breakpointToToken["medium"]);
-        this.isSmallScreen = this.mediaQuerySmall.matches;
-        this.isMediumScreen = this.mediaQueryMedium.matches;
-        this.mediaQuerySmall.addEventListener("change", this.screenTestBound);
-        this.mediaQueryMedium.addEventListener("change", this.screenTestBound);
-    }
-    destroyMediaQuery() {
-        if (this.mediaQuerySmall) {
-            this.mediaQuerySmall.removeEventListener("change", this.screenTestBound);
-        }
-        if (this.mediaQueryMedium) {
-            this.mediaQueryMedium.removeEventListener("change", this.screenTestBound);
-        }
-    }
-    screenTest(event) {
-        this.isSmallScreen = event.matches;
-        this.isMediumScreen = event.matches;
-    }
     resolveDownload() {
         if (this.download === "") {
             return this.url.split("/").pop();
@@ -191,19 +167,13 @@ const DuetLink = class {
         return (h(Fragment, null, h("span", { class: "duet-link-content", part: "duet-link-content" }, h("slot", null)), (this.resolvedDownload || this.external) && this.variation === "default" && (h(Fragment, null, h("span", { class: "duet-link-icon-tail" }, "\u00A0", h("duet-icon", { icon: this.resolvedDownload ? actionDownloadSmall.svg : actionNewWindowSmall.svg, size: "xx-small", margin: "none", color: "currentColor" }))))));
     }
     renderBlockContent() {
-        return (h(Fragment, null, this.icon && (h("span", { class: "block__icon" }, h("duet-icon", { size: this.iconResponsive ? (this.isSmallScreen ? "medium" : "large") : "x-small", name: this.icon, margin: "none", color: this.iconColor }))), h("span", { class: "block__content" }, this.renderDefaultContent()), h("span", { class: "block__chevron", part: "block-chevron" }, h("duet-icon", { class: "block__chevron-icon", icon: this.external ? actionNewWindow.svg : actionArrowRight.svg, size: "x-small", margin: "none", color: "primary-dark" }))));
+        return (h(Fragment, null, this.icon && (h("span", { class: "block__icon" }, h("duet-icon", { class: this.iconResponsive ? "icon-responsive" : "", size: "auto", name: this.icon, margin: "none", color: this.iconColor }))), h("span", { class: "block__content" }, this.renderDefaultContent()), h("span", { class: "block__chevron", part: "block-chevron" }, h("duet-icon", { class: "block__chevron-icon", icon: this.external ? actionNewWindow.svg : actionArrowRight.svg, size: "x-small", margin: "none", color: "primary-dark" }))));
     }
     renderButtonCardContent() {
         const iconWrapStyle = {
             "background-color": getColorByName(this.iconBackground, this.theme),
         };
-        const iconSize = () => {
-            if (this.variation === "button") {
-                return this.iconBackground && this.isMediumScreen ? "medium" : "small";
-            }
-            return this.isMediumScreen ? "large" : "medium";
-        };
-        return (h(Fragment, null, this.icon && (h("span", { class: "icon-wrap", style: iconWrapStyle }, h("duet-icon", { size: iconSize(), name: this.icon, margin: "none", color: this.iconColor }))), h("div", { class: "duet-link-content", part: "duet-link-content" }, h("slot", null)), h("span", { class: "chevron-wrap" }, h("duet-icon", { class: "block__chevron-icon", icon: this.external ? actionNewWindow.svg : actionArrowRight.svg, size: "x-small", margin: "none", color: "primary-dark" }))));
+        return (h(Fragment, null, this.icon && (h("span", { class: "icon-wrap", style: iconWrapStyle }, h("duet-icon", { size: "auto", name: this.icon, margin: "none", color: this.iconColor }))), h("div", { class: "duet-link-content", part: "duet-link-content" }, h("slot", null)), h("span", { class: "chevron-wrap" }, h("duet-icon", { class: "block__chevron-icon", icon: this.external ? actionNewWindow.svg : actionArrowRight.svg, size: "x-small", margin: "none", color: "primary-dark" }))));
     }
     renderContent() {
         switch (this.variation) {
@@ -223,10 +193,10 @@ const DuetLink = class {
     render() {
         const Tag = !this.url ? "button" : "a";
         const isButton = Tag === "button";
-        return (h(Host, { key: 'e7cb6ea76d92ed46bca6c328a17e50755ea4c750', class: {
+        return (h(Host, { key: 'abc49b84dd9a522c921d5447f1b2ec451a456f44', class: {
                 [`duet-link-${this.variation}`]: true,
                 "duet-m-0": this.margin === "none",
-            } }, h(Tag, { key: 'c6c6d30ed3774822aeae25f20e0bd227f71b397b', href: this.url, class: {
+            } }, h(Tag, { key: '24ecdb7c1b3bbb33f2cf612170574b06931574fc', href: this.url, class: {
                 "duet-link": true,
                 "duet-link-is-external": this.external,
                 "duet-link-is-download": !!this.download,
@@ -272,7 +242,7 @@ const DuetParagraph = class {
         const color = getColorByName(this.color);
         // aria-describedby is to fix accessibility issue in Chrome where duet-paragraphs
         // are not announced when placed inside duet-modal
-        return (h(Host, { key: '3cf5f2bd4aeee4bd1c6314a7ac8d54539a87b895', "aria-describedby": this.id }, h("p", { key: '1f9c9162b385ac72e8a47f7f80b69293ea6bfc78', id: this.id, class: {
+        return (h(Host, { key: '4cdc1e2db953dc363eb77f14bf5c8473cd22c7ca', "aria-describedby": this.id }, h("p", { key: '6fc77faf20566dc0442bb36f20079aeca48ea41f', id: this.id, class: {
                 "duet-paragraph": true,
                 "duet-paragraph-small": this.size === "small",
                 "duet-paragraph-semi-bold": this.weight === "semi-bold",
@@ -280,7 +250,7 @@ const DuetParagraph = class {
                 "duet-m-0": this.margin === "none",
                 [this.variation]: true,
                 "duet-theme-turva": this.theme === "turva",
-            }, style: { color }, part: "duet-paragraph" }, h("slot", { key: 'd5c6a5b6d69f600454a85ad01f39406fd57b7188' }))));
+            }, style: { color }, part: "duet-paragraph" }, h("slot", { key: 'df2a9f9c672fe560e62f97addbef69d72b13fefe' }))));
     }
     get element() { return getElement(this); }
 };

package/lib/esm/duet-card.entry.js

@@ -1,13 +1,14 @@
 /*!
  * Built with Duet Design System
  */
-import { r as registerInstance, c as createEvent, h, F as Fragment, H as Host, g as getElement } from './index-1d0b7c66.js';
+import { r as registerInstance, c as createEvent, h, F as Fragment, H as Host, g as getElement } from './index-4b4e4ec8.js';
 import { i as inheritGlobalTheme } from './themeable-component-860041c5.js';
 import { c as createID } from './create-id-149a1b6d.js';
 import { i as isKeyboardClick, s as subscribeTabbingChange, u as unsubscribeTabbingChange } from './keyboard-utils-439bcc8b.js';
+import { g as getElementsFromNamedSlot } from './slot-utils-ae4dc467.js';
 import { s as sanitizeString } from './string-utils-192eb3c8.js';
-import { g as getColorByName } from './token-utils-a32eb753.js';
-import './tokens.module-a746651a.js';
+import { g as getColorByName } from './token-utils-b9ba8c5e.js';
+import './tokens.module-2d02f5ff.js';
 
 const duetHeadingLevels = ["h1", "h2", "h3", "h4", "h5", "h6"];
 const duetBlock = "div";
@@ -70,6 +71,7 @@ const DuetCard = class {
         unsubscribeTabbingChange(this);
     }
     renderHeading() {
+        var _a;
         const safeHeadingLevel = sanitizeString(this.headingLevel);
         const HeadingTag = [...duetHeadingLevels, duetBlock].some(tag => tag === safeHeadingLevel) ? safeHeadingLevel : "h2";
         const headingStyles = {
@@ -77,7 +79,8 @@ const DuetCard = class {
         };
         const headingContent = (h(Fragment, null, h("div", { class: "duet-card-heading-grid" }, this.icon && (h(Fragment, null, h("duet-icon", { class: "duet-card-icon", name: this.icon, size: "medium", margin: "none", color: "currentColor" }), h("duet-spacer", { direction: "horizontal", size: "small" }))), h("div", { class: "duet-card-heading-text" }, this.heading ? this.heading : h("slot", { name: "heading" })), this.secondaryHeading && (h(Fragment, null, h("duet-spacer", { direction: "horizontal", size: "small" }), h("div", { class: "duet-card-secondary-heading duet-card-secondary-heading--inline" }, this.secondaryHeading))), this.collapsible && (h(Fragment, null, h("duet-spacer", { direction: "horizontal", size: "small" }), h("duet-icon", { class: "duet-card-caret", icon: actionArrowUp.svg, size: "small", margin: "none", color: "currentColor" })))), this.secondaryHeading && (h("div", { class: "duet-card-secondary-heading duet-card-secondary-heading--new-line" }, this.secondaryHeading)), h("slot", { name: "below-heading" })));
         if (this.collapsible) {
-            return (h(HeadingTag, { style: headingStyles, class: "duet-card-heading duet-card-heading--collapsible", onClick: this.togglePanel, onKeyDown: this.handleKeyDown }, h("button", { "aria-controls": this.cardId, "aria-expanded": this.open ? "true" : "false" }, headingContent)));
+            const ariaLabel = (_a = getElementsFromNamedSlot(this.element, "heading")) === null || _a === void 0 ? void 0 : _a.map(e => e.textContent).join(" ");
+            return (h(HeadingTag, { style: headingStyles, class: "duet-card-heading duet-card-heading--collapsible", onClick: this.togglePanel, onKeyDown: this.handleKeyDown }, h("button", { type: "button", "aria-controls": this.cardId, "aria-expanded": this.open ? "true" : "false", "aria-label": ariaLabel }, headingContent)));
         }
         else {
             return (h(HeadingTag, { style: headingStyles, class: "duet-card-heading" }, headingContent));
@@ -102,10 +105,10 @@ const DuetCard = class {
         const styles = {
             backgroundColor: getColorByName(this.background),
         };
-        return (h(Host, { key: 'e2a8edb2493ebbebc92b63967e157beddacdbd4a', class: {
+        return (h(Host, { key: '81af7af276b2b67f13855aa9e11bd95e8abeaa2d', class: {
                 "duet-m-0": this.margin === "none",
                 "duet-card-info": this.variation === "info",
-            } }, h(TagName, { key: 'dc8a552ac6e2f01149a0c2c114f36e2e66a3df2e', href: this.url, style: styles, ref: card => (this.nativeCard = card), "aria-label": this.accessibleLabel, class: {
+            } }, h(TagName, { key: '9c121ca16ed478f72e8c5976cc73499de2c48de2', href: this.url, style: styles, ref: card => (this.nativeCard = card), "aria-label": this.accessibleLabel, class: {
                 "duet-card": true,
                 [this.padding]: true,
                 [this.variation]: true,
@@ -115,7 +118,7 @@ const DuetCard = class {
                 "duet-card-has-bg": this.background !== "gray-lightest",
                 "duet-card-has-icon": !!this.icon,
                 "duet-card-collapsed": this.collapsible && !this.open,
-            } }, this.image && (h("div", { key: 'd7ad8920cacfa8bcd8fa5c1fc306ea11c69f2c42', class: "duet-card-image-mask" }, h("img", { key: '83a4bf89bf9601a7d8924ab6a94d3bf37001bcf5', src: this.image, class: "duet-card-image", loading: "lazy", alt: "", "aria-hidden": "true" }))), (this.heading || this.hasHeadingSlot) && this.renderHeading(), h("div", { key: '1b43496f9e042da0c35ad3c090553acb0ac661ac', class: "duet-card-content", id: this.cardId }, h("slot", { key: '48e8abbabd5cd625b3faecd232e4a80cd0b58d44' }), this.hasFooter && (h("div", { key: '8fd234bb6cdfa1bc53f487b9051944e5c3c43439', class: "duet-card-footer" }, h("slot", { key: '664c4d55d042166647682eb00eb61e2d8f3fbd6c', name: "footer" })))))));
+            } }, this.image && (h("div", { key: '370ab67ee9e9e00267dfe6a034d9258fc41deb9c', class: "duet-card-image-mask" }, h("img", { key: 'f93b70812e33b71f9057b5a890baba36894012ea', src: this.image, class: "duet-card-image", loading: "lazy", alt: "", "aria-hidden": "true" }))), (this.heading || this.hasHeadingSlot) && this.renderHeading(), h("div", { key: '64b6d8e1e2d02085fa6101f54cf95f15c6c4e3b8', class: "duet-card-content", id: this.cardId }, h("slot", { key: '9a20c3971a53038f5786c9321214cd2dc19bdcef' }), this.hasFooter && (h("div", { key: '5009d44d6ffb5c7d6774a0c22664979d84a12561', class: "duet-card-footer" }, h("slot", { key: 'e177a2f18a636b5e6c093150e52614e56ad56c68', name: "footer" })))))));
     }
     get element() { return getElement(this); }
 };

package/lib/esm/duet-checkbox.entry.js

@@ -1,11 +1,11 @@
 /*!
  * Built with Duet Design System
  */
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-1d0b7c66.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-4b4e4ec8.js';
 import { i as inheritGlobalTheme } from './themeable-component-860041c5.js';
 import { c as createID } from './create-id-149a1b6d.js';
 
-const duetCheckboxCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-right:8px !important;margin-bottom:12px !important;display:inline-flex;width:100%;vertical-align:bottom;-webkit-tap-highlight-color:transparent}:host:last-child,:host:last-of-type{margin-right:0 !important}:host(:last-child:not(:only-child)){margin-bottom:0 !important}:host(.duet-m-0){margin:0 !important}.duet-label{position:relative;z-index:100;display:inline;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:1rem;font-weight:400;line-height:1.5;color:rgb(8, 42, 77);vertical-align:top;cursor:pointer;background:transparent;transition:300ms ease}.duet-theme-turva .duet-label{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(23, 28, 58)}.duet-label span{display:inline-block;width:calc(100% - 32px);font-size:1rem;font-weight:400;vertical-align:top}.duet-checkbox-container{position:relative;width:100%;height:100%}.duet-checkbox{padding:14px !important;position:absolute;top:0;left:0;z-index:2;width:100%;height:100%;cursor:pointer;opacity:0}.duet-checkbox+label::before{z-index:100;display:inline-block;width:20px;height:20px;margin:2px 10px 1px 1px;vertical-align:top;content:\"\";background:rgb(255, 255, 255);border:1px solid rgb(8, 42, 77);border-radius:4px}.duet-theme-turva .duet-checkbox+label::before{border-color:rgb(23, 28, 58)}.duet-checkbox:checked+label::before{background:rgb(0, 119, 179);border:1px solid rgb(0, 119, 179)}.duet-theme-turva .duet-checkbox:checked+label::before{background:rgb(23, 28, 58);border-color:rgb(23, 28, 58)}.duet-checkbox:focus+label::before{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.duet-theme-turva .duet-checkbox:focus+label::before{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-checkbox[aria-invalid=true]+label::before{background:#fdf4f6;border-color:rgb(214, 28, 82)}.duet-theme-turva .duet-checkbox[aria-invalid=true]+label::before{background:#fdf4f6;border-color:rgb(214, 28, 82)}.duet-checkbox+label{position:static}.duet-checkbox:checked+label::after{position:absolute;top:6px;left:5px;z-index:200;width:12px;height:12px;pointer-events:none;content:\"\";background:transparent url(\"data:image/svg+xml,%3Csvg%20fill%3D%27white%27%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20d%3D%27M23.374.287a1.5%2C1.5%2C0%2C0%2C0-2.093.345L7.246%2C20.2%2C2.561%2C15.511A1.5%2C1.5%2C0%2C1%2C0%2C.439%2C17.632l5.935%2C5.934a1.525%2C1.525%2C0%2C0%2C0%2C2.279-.186l15.066-21A1.5%2C1.5%2C0%2C0%2C0%2C23.374.287Z%27%20%2F%3E%3C%2Fsvg%3E\") no-repeat 0 0;background-size:100% auto}.duet-checkbox[disabled]{cursor:default}.duet-checkbox[disabled]+label{color:rgb(98, 121, 138)}.duet-theme-turva .duet-checkbox[disabled]+label{color:rgb(143, 147, 158)}.duet-checkbox[disabled]+label::before{border-color:rgb(181, 198, 208)}.duet-theme-turva .duet-checkbox[disabled]+label::before{border-color:rgb(199, 202, 207)}.duet-checkbox[disabled]:checked+label::before{background:rgb(127, 150, 165);border:1px solid rgb(127, 150, 165)}.duet-theme-turva .duet-checkbox[disabled]:checked+label::before{background:rgb(143, 147, 158);border-color:rgb(143, 147, 158)}.duet-checkbox-error{margin-left:31px;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:0.875rem;font-weight:400;line-height:1.25;color:rgb(214, 28, 82);border-radius:4px}.duet-theme-turva .duet-checkbox-error{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(214, 28, 82)}.duet-label-hidden .duet-label span,.duet-label-hidden .duet-checkbox-error span{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);border:0}";
+const duetCheckboxCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{margin-right:8px !important}:host(:last-child),:host(:last-of-type){margin-right:0 !important}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-bottom:12px !important;display:inline-flex;width:100%;vertical-align:bottom;-webkit-tap-highlight-color:transparent}:host(:last-child:not(:only-child)){margin-bottom:0 !important}:host(.duet-m-0){margin:0 !important}.duet-label{position:relative;z-index:100;display:inline;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:1rem;font-weight:400;line-height:1.5;color:rgb(8, 42, 77);vertical-align:top;cursor:pointer;background:transparent;transition:300ms ease}.duet-theme-turva .duet-label{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(23, 28, 58)}.duet-label span{display:inline-block;width:calc(100% - 32px);font-size:1rem;font-weight:400;vertical-align:top}.duet-checkbox-container{position:relative;width:100%;height:100%}.duet-checkbox{padding:14px !important;position:absolute;top:0;left:0;z-index:2;width:100%;height:100%;cursor:pointer;opacity:0}.duet-checkbox+label::before{z-index:100;display:inline-block;width:20px;height:20px;margin:2px 10px 1px 1px;vertical-align:top;content:\"\";background:rgb(255, 255, 255);border:1px solid rgb(8, 42, 77);border-radius:4px}.duet-theme-turva .duet-checkbox+label::before{border-color:rgb(23, 28, 58)}.duet-checkbox:checked+label::before{background:rgb(0, 119, 179);border:1px solid rgb(0, 119, 179)}.duet-theme-turva .duet-checkbox:checked+label::before{background:rgb(23, 28, 58);border-color:rgb(23, 28, 58)}.duet-checkbox:focus+label::before{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.duet-theme-turva .duet-checkbox:focus+label::before{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-checkbox[aria-invalid=true]+label::before{background:#fdf4f6;border-color:rgb(214, 28, 82)}.duet-theme-turva .duet-checkbox[aria-invalid=true]+label::before{background:#fdf4f6;border-color:rgb(214, 28, 82)}.duet-checkbox+label{position:static}.duet-checkbox:checked+label::after{position:absolute;top:6px;left:5px;z-index:200;width:12px;height:12px;pointer-events:none;content:\"\";background:transparent url(\"data:image/svg+xml,%3Csvg%20fill%3D%27white%27%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20d%3D%27M23.374.287a1.5%2C1.5%2C0%2C0%2C0-2.093.345L7.246%2C20.2%2C2.561%2C15.511A1.5%2C1.5%2C0%2C1%2C0%2C.439%2C17.632l5.935%2C5.934a1.525%2C1.525%2C0%2C0%2C0%2C2.279-.186l15.066-21A1.5%2C1.5%2C0%2C0%2C0%2C23.374.287Z%27%20%2F%3E%3C%2Fsvg%3E\") no-repeat 0 0;background-size:100% auto}.duet-checkbox[disabled]{cursor:default}.duet-checkbox[disabled]+label{color:rgb(98, 121, 138)}.duet-theme-turva .duet-checkbox[disabled]+label{color:rgb(143, 147, 158)}.duet-checkbox[disabled]+label::before{border-color:rgb(181, 198, 208)}.duet-theme-turva .duet-checkbox[disabled]+label::before{border-color:rgb(199, 202, 207)}.duet-checkbox[disabled]:checked+label::before{background:rgb(127, 150, 165);border:1px solid rgb(127, 150, 165)}.duet-theme-turva .duet-checkbox[disabled]:checked+label::before{background:rgb(143, 147, 158);border-color:rgb(143, 147, 158)}.duet-checkbox-error{margin-left:31px;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:0.875rem;font-weight:400;line-height:1.25;color:rgb(214, 28, 82);border-radius:4px}.duet-theme-turva .duet-checkbox-error{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(214, 28, 82)}.duet-label-hidden .duet-label span,.duet-label-hidden .duet-checkbox-error span{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);border:0}";
 const DuetCheckboxStyle0 = duetCheckboxCss;
 
 const DuetCheckbox = class {
@@ -102,11 +102,11 @@ const DuetCheckbox = class {
      */
     render() {
         const identifier = this.identifier || this.checkboxId;
-        return (h(Host, { class: { "duet-m-0": this.margin === "none" } }, h("div", { class: {
+        return (h(Host, { key: 'b766728b3dfefde1c6deefe6d0db2f549cd8aad3', class: { "duet-m-0": this.margin === "none" } }, h("div", { key: 'caeaf8e29cbfdc3f684a64a5c7e7e5ef6513432b', class: {
                 "duet-checkbox-container": true,
                 "duet-label-hidden": this.labelHidden,
                 "duet-theme-turva": this.theme === "turva",
-            } }, h("input", { ref: input => (this.nativeInput = input), type: "checkbox", onFocus: this.onFocus, onBlur: this.onBlur, onChange: this.onChange, value: this.value, class: { "duet-checkbox": true, disabled: this.disabled }, checked: this.checked, disabled: this.disabled, tabindex: this.accessibleIndex, "aria-invalid": this.error ? "true" : "false", "aria-controls": this.accessibleControls, "aria-activedescendant": this.accessibleActiveDescendant, "aria-owns": this.accessibleOwns, "aria-describedby": this.getDescribedBy(), "aria-labelledby": this.accessibleLabelledBy, "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, "aria-selected": this.accessibleSelected, required: this.required, role: this.role, name: this.name, id: identifier }), h("label", { class: "duet-label", htmlFor: identifier }, h("span", null, this.label)), h("div", { class: "duet-checkbox-error", id: this.errorId, "aria-atomic": "true", "aria-live": this.accessibleLiveError, "aria-relevant": "additions removals" }, this.error && h("span", null, this.error)))));
+            } }, h("input", { key: '6ab801fbe93327d25187b276878076bcfdf48b36', ref: input => (this.nativeInput = input), type: "checkbox", onFocus: this.onFocus, onBlur: this.onBlur, onChange: this.onChange, value: this.value, class: { "duet-checkbox": true, disabled: this.disabled }, checked: this.checked, disabled: this.disabled, tabindex: this.accessibleIndex, "aria-invalid": this.error ? "true" : "false", "aria-controls": this.accessibleControls, "aria-activedescendant": this.accessibleActiveDescendant, "aria-owns": this.accessibleOwns, "aria-describedby": this.getDescribedBy(), "aria-labelledby": this.accessibleLabelledBy, "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, "aria-selected": this.accessibleSelected, required: this.required, role: this.role, name: this.name, id: identifier }), h("label", { key: '68e27e7756a0db41709ff8a3ae200ee99ff786b1', class: "duet-label", htmlFor: identifier }, h("span", { key: '3db3ad22a9878f989e6dc47fee0c37c7d5195f42' }, this.label)), h("div", { key: '9d27e662b34db5a4db91e3a7e7d9f989ba933f94', class: "duet-checkbox-error", id: this.errorId, "aria-atomic": "true", "aria-live": this.accessibleLiveError, "aria-relevant": "additions removals" }, this.error && h("span", { key: '7901825f9db5ff2a62876fa4324b449155ffac6a' }, this.error)))));
     }
     get element() { return getElement(this); }
 };

package/lib/esm/duet-checkmark.entry.js

@@ -1,7 +1,7 @@
 /*!
  * Built with Duet Design System
  */
-import { r as registerInstance, h, H as Host } from './index-1d0b7c66.js';
+import { r as registerInstance, h, H as Host } from './index-4b4e4ec8.js';
 import { i as inheritGlobalTheme } from './themeable-component-860041c5.js';
 
 const duetCheckmarkCss = ".duet-checkmark-container{position:relative;width:20px;height:20px;margin-left:auto;border:1px solid rgb(127, 150, 165);border-radius:4px;transition:border 300ms ease}.duet-checkmark-container.center{margin-right:auto}.duet-theme-turva .duet-checkmark-container{border-color:rgb(143, 147, 158)}.checked .duet-checkmark-container{background:rgb(0, 119, 179);border-color:rgb(0, 119, 179);transition:none}.duet-theme-turva .checked .duet-checkmark-container{background:rgb(23, 28, 58);border-color:rgb(23, 28, 58) !important}.duet-checkmark-container.duet-checkmark-radio{border-radius:50%}[disabled]+label .duet-checkmark-container{border-color:rgb(181, 198, 208) !important}.duet-theme-turva [disabled]+label .duet-checkmark-container{border-color:rgb(199, 202, 207) !important}.checked [disabled]+label .duet-checkmark-container{background:rgb(181, 198, 208) !important}.duet-theme-turva .checked [disabled]+label .duet-checkmark-container{background:rgb(199, 202, 207) !important}.duet-checkmark{position:absolute;top:10px;left:3px;width:5.3333333333px;height:11.8518518519px;border-top:2px solid rgb(255, 255, 255);border-right:2px solid rgb(255, 255, 255);opacity:1;transform:scaleX(-1) rotate(135deg) translateZ(0);transform-origin:left top;animation-name:duet-checkmark;animation-duration:600ms;animation-timing-function:ease-out;animation-fill-mode:forwards}@keyframes duet-checkmark{0%{width:0;height:0;opacity:1}20%{width:5.3333333333px;height:0;opacity:1}40%,100%{width:5.3333333333px;height:11.8518518519px;opacity:1}}";
@@ -23,11 +23,11 @@ const DuetCheckmark = class {
         inheritGlobalTheme(this);
     }
     render() {
-        return (h(Host, { key: '4f894c8f4f3ec363b66b92d64106650948eddbd9', class: { "duet-theme-turva": this.theme === "turva" } }, h("div", { key: '97af2cb562ab2260fff669a97236d17119417883', role: this.presentationOnly ? "presentation" : null, class: { checked: this.checked } }, h("div", { key: '0017ec40a1dfa14357bb3ae08b409b537549b953', class: {
+        return (h(Host, { key: '621afec8eb7b55088937983fdd862cdf3876c01b', class: { "duet-theme-turva": this.theme === "turva" } }, h("div", { key: 'dd3020a77469f7c8d14006f2495f2fe7a6849290', role: this.presentationOnly ? "presentation" : null, class: { checked: this.checked } }, h("div", { key: '806bb3821f8947e99f10b031f8b20f3d0063f579', class: {
                 "duet-checkmark-container": true,
                 center: this.center,
                 "duet-checkmark-radio": this.type === "radio",
-            } }, this.checked && h("div", { key: 'bf36ed6a59e749c98ec6f3862c013998343c2077', class: "duet-checkmark" })))));
+            } }, this.checked && h("div", { key: 'cd19c44014e480d7b6a886cdd7200da58f2c8bf1', class: "duet-checkmark" })))));
     }
 };
 DuetCheckmark.style = DuetCheckmarkStyle0;

package/lib/esm/duet-chip_3.entry.js

@@ -1,14 +1,14 @@
 /*!
  * Built with Duet Design System
  */
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-1d0b7c66.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-4b4e4ec8.js';
 import { i as inheritGlobalTheme } from './themeable-component-860041c5.js';
 import { c as createID } from './create-id-149a1b6d.js';
 import { s as subscribeTabbingChange, u as unsubscribeTabbingChange, f as isEscapeKey, c as isArrowDownKey, b as isArrowUpKey, o as isTabKey } from './keyboard-utils-439bcc8b.js';
-import { g as getLocaleString } from './language-utils-14969cef.js';
-import { q as spaceXSmall } from './tokens.module-a746651a.js';
+import { g as getLocaleString } from './language-utils-1b413a6b.js';
+import { I as spaceXSmall } from './tokens.module-2d02f5ff.js';
 import { o as offset, f as flip, s as shift, c as computePosition, b as autoUpdate } from './floating-ui.dom.esm-ebc91b33.js';
-import { f as focusElement } from './focus-utils-adcd9463.js';
+import { f as focusElement } from './focus-utils-4226b57a.js';
 import { T as Teleport } from './teleport-546f382d.js';
 import { a as actionNewWindowSmall } from './action-new-window-small-1945be91.js';
 import './string-utils-192eb3c8.js';
@@ -316,7 +316,7 @@ const DuetChip = class {
             onBlur: this.onBlur,
             ref: el => (this.focusableElement = el),
         };
-        return (h(Host, { key: 'a1e4d371f57abce15c06aa88bf2faab012bde60a', class: { [this.variation]: true } }, this.variation === "button" && (h("span", { key: '48b8e4b70be8c4511a33be55c6fd25ec850fe1c2', class: classes }, h("button", Object.assign({ key: 'ec9084347d6c67fb665312422a36282f753900af', id: identifier, "aria-label": this.accessibleLabel, "aria-haspopup": this.getAccessiblePopup(), "aria-expanded": this.getAccessibleExpanded(), "aria-disabled": this.disabled ? "true" : undefined, name: this.name, value: this.value, onClick: this.disabled ? evt => evt.stopPropagation() : undefined }, focusHandlers), h("span", { key: '733df1c9acec6cd645b28f8ed86af4c48a79273a', class: "duet-chip-icon-container" }, this.icon && (h("duet-icon", { key: '001d0ccf56f2d072f7e861bbb950f75ff6673223', name: this.icon, size: "x-small", margin: "none", color: "currentColor" }))), h("slot", { key: '7ddfa4406408234c391bcf674c0ba8aaaec21ee0' })))), this.variation === "input" && (h("span", { key: '727e2fc07c26dff9c68fcae934c1925aca396155', class: classes, "aria-label": this.getAccessibleInputChipLabel() }, h("button", Object.assign({ key: 'ea5ee0837d8912fbb3434a2a38c7bc4d5d0975b5', id: identifier, class: "duet-chip-input-button", value: this.value, "aria-label": this.accessibleLabel, onMouseOver: () => (this.inputChipHover = true), onMouseOut: () => (this.inputChipHover = false), onClick: () => (this.selected = !this.selected) }, focusHandlers), h("span", { key: 'b318ffad1b0057ef1812018dc1e524ec8cf62091', class: "duet-chip-icon-container" }, this.icon && (h("duet-icon", { key: 'c85184dcc2864532c7820bc01eb1ad48d9ef0fbd', name: this.icon, size: "x-small", margin: "none", color: "currentColor" }))), h("slot", { key: 'd8871a7204049ace2b8295db0a13428caa96b57a' })), h("button", { key: 'ec772bd91b3a8131145348fc67703f3ee4515702', class: "duet-chip-remove-button", "aria-label": this.getAccessibleDeleteLabel(), onClick: this.onRemoveClick, onFocus: () => (this.inputChipDeleteFocus = true), onBlur: () => (this.inputChipDeleteFocus = false), ref: el => (this.deleteButtonElement = el) }, h("duet-icon", { key: '903ab2300e7a977392b42927034941e43292d983', name: "activity-close", size: "xx-small", margin: "none", color: "currentColor" })))), this.variation === "filter" && (h("span", { key: '3660c3e7ff2a0eaff17ebbe34981cbf5909d0f0d', class: classes }, h("input", Object.assign({ key: 'd46cb417fe2464eb10908d01929c125e9bea5677', "aria-haspopup": this.getAccessiblePopup(), "aria-controls": (_a = this.popupElement) === null || _a === void 0 ? void 0 : _a.id, "aria-expanded": this.getAccessibleExpanded(), "aria-disabled": this.disabled ? "true" : undefined, id: identifier, type: "checkbox", name: this.name, value: this.value, checked: this.checked, onClick: this.onFilterClick, onChange: this.onFilterChange }, focusHandlers)), h("label", { key: '4ee86b0611315406cbd1b6dfbcdd42106ba84554', htmlFor: identifier }, this.icon && (h("span", { key: '9514104bed3050807ea0b30550f9c0892d545daa', class: "duet-chip-icon-container" }, h("duet-icon", { key: 'f8000d1fce7ecbba8072545eaa78014913109aca', name: this.icon, size: "x-small", margin: "none", color: "currentColor" }), h("duet-icon", { key: '3d9ad0a9a4075b1d4e9339c485ee3180cf44cae1', name: "messaging-checked-small", size: "xx-small", margin: "none", color: "currentColor", class: "check-mark" }))), h("slot", { key: '2d5eef8328f0fa155877cb1f21017024140f81aa' }), this.popupElement && (h("span", { key: 'a8073e5008dd5aebab4ed7af69a2be3833cc5103', class: "duet-chip-popup-disclosure" }, h("duet-icon", { key: '124c026eecc172483e1988197edfa334736dbee4', name: "action-arrow-down-small", size: "xxx-small", margin: "none", color: "currentColor" })))))), this.variation === "radio" && (h("span", { key: '78b2f4b2f12a5d37a82a44ec03c121548ec26c05', class: classes }, h("slot", { key: '7d0f2d9039581110bad1cac19a35fc64b5554930', name: "input" }), h("label", { key: '12093ea0d2a2d97b73b7847384a80108e3e6eb3d', htmlFor: identifier }, this.icon && (h("span", { key: '073c4aeefdf6b0e9c4b39c2d821c157f3f8c7285', class: "duet-chip-icon-container" }, h("duet-icon", { key: '20a39d0858cfba1c30c25532485adbc904fb3fe4', name: this.icon, size: "x-small", margin: "none", color: "currentColor" }), h("duet-icon", { key: '2b7124ccc84b91f81b938a7f52e193daf7002cd0', name: "messaging-checked-small", size: "xx-small", margin: "none", color: "currentColor", class: "check-mark" }))), h("slot", { key: '9165ca7f004968f8c8505822c98281eec4583329' }))))));
+        return (h(Host, { key: 'f5866959a8c96e4c06f87b9da16bb1a1fce05235', class: { [this.variation]: true } }, this.variation === "button" && (h("span", { key: 'f118e5cb6fd7e7a36b783b6b136b85848493d7b2', class: classes }, h("button", Object.assign({ key: '8136c5fc8d81b414f102d52af06bef9a4b85bf8c', id: identifier, "aria-label": this.accessibleLabel, "aria-haspopup": this.getAccessiblePopup(), "aria-expanded": this.getAccessibleExpanded(), "aria-disabled": this.disabled ? "true" : undefined, name: this.name, value: this.value, onClick: this.disabled ? evt => evt.stopPropagation() : undefined }, focusHandlers), h("span", { key: 'bcbd7ed8bda270105ad63bda748c3e99440e210a', class: "duet-chip-icon-container" }, this.icon && (h("duet-icon", { key: '878b7a3bd90f777342a9f01ec3b9d6487c84ae62', name: this.icon, size: "x-small", margin: "none", color: "currentColor" }))), h("slot", { key: '80af3c2e2ed0326f64ba76df23cb013ad6453bc7' })))), this.variation === "input" && (h("span", { key: 'b58b2486ea2a68bf3cb4f7936acd3c1bae7a8f01', class: classes, "aria-label": this.getAccessibleInputChipLabel() }, h("button", Object.assign({ key: 'aab83e094723fea4006b2d6d5b7d0c7561741dc0', id: identifier, class: "duet-chip-input-button", value: this.value, "aria-label": this.accessibleLabel, onMouseOver: () => (this.inputChipHover = true), onMouseOut: () => (this.inputChipHover = false), onClick: () => (this.selected = !this.selected) }, focusHandlers), h("span", { key: '7060c0297c7a9ac439e1b8cacf331286076e49d3', class: "duet-chip-icon-container" }, this.icon && (h("duet-icon", { key: '285b4f499a36e796777a68ac9d625776bd01f8fe', name: this.icon, size: "x-small", margin: "none", color: "currentColor" }))), h("slot", { key: 'abad02d6dc1809c0bed85b1c51e9150835470e24' })), h("button", { key: '89239750f6c9738272cc92142889f59a7c8d4ea0', class: "duet-chip-remove-button", "aria-label": this.getAccessibleDeleteLabel(), onClick: this.onRemoveClick, onFocus: () => (this.inputChipDeleteFocus = true), onBlur: () => (this.inputChipDeleteFocus = false), ref: el => (this.deleteButtonElement = el) }, h("duet-icon", { key: 'da6a4b111356b20f82bfc083cbaaf35ce9facdaa', name: "activity-close", size: "xx-small", margin: "none", color: "currentColor" })))), this.variation === "filter" && (h("span", { key: 'a7f9ee8ddaf8f256bf6a43ec10e4df16da91fe01', class: classes }, h("input", Object.assign({ key: '9717dd6ef3002cb5bb0382bbcf0c93f4e4b9a7e6', "aria-haspopup": this.getAccessiblePopup(), "aria-controls": (_a = this.popupElement) === null || _a === void 0 ? void 0 : _a.id, "aria-expanded": this.getAccessibleExpanded(), "aria-disabled": this.disabled ? "true" : undefined, id: identifier, type: "checkbox", name: this.name, value: this.value, checked: this.checked, onClick: this.onFilterClick, onChange: this.onFilterChange }, focusHandlers)), h("label", { key: '1cf57481446293957a2a639afea5a72d847f82eb', htmlFor: identifier }, this.icon && (h("span", { key: '491a9eb7a0d9ea0fa1ed30e49826ecc51e5fa394', class: "duet-chip-icon-container" }, h("duet-icon", { key: '1ca20585deaa344a434a013fac217e8191432b31', name: this.icon, size: "x-small", margin: "none", color: "currentColor" }), h("duet-icon", { key: '6bfd6b12f71a7264b657c164a748de134d0e7976', name: "messaging-checked-small", size: "xx-small", margin: "none", color: "currentColor", class: "check-mark" }))), h("slot", { key: 'f51bf27633eb450f0469f43b569e6dc8ec19a5a2' }), this.popupElement && (h("span", { key: 'c8e24b22bc5dada17637c970f5c240a0ab1432dd', class: "duet-chip-popup-disclosure" }, h("duet-icon", { key: '77bff8f2d2d4d2bacfd35e466c8917af0dee3712', name: "action-arrow-down-small", size: "xxx-small", margin: "none", color: "currentColor" })))))), this.variation === "radio" && (h("span", { key: '9301ae9f35e1f8b98e9fb22581054a7d9e4e95f7', class: classes }, h("slot", { key: 'ef01900b142a3ccbb3df9609de81c765d171fc7a', name: "input" }), h("label", { key: '5803f303e6073ea2521400ad5a019668752dc72f', htmlFor: identifier }, this.icon && (h("span", { key: '3a02f6262d9409fd67f5dec28333813e00059ee2', class: "duet-chip-icon-container" }, h("duet-icon", { key: '782a8428f4516926dd572640670084f17f1a0a6c', name: this.icon, size: "x-small", margin: "none", color: "currentColor" }), h("duet-icon", { key: '20bbe0863bb89ba63507469f3d47c910ca08842c', name: "messaging-checked-small", size: "xx-small", margin: "none", color: "currentColor", class: "check-mark" }))), h("slot", { key: 'b9f66eeaa21825e40fde477edc0928e461ff3b62' }))))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -596,14 +596,14 @@ const DuetPopupMenu = class {
             overflowY: "auto",
             height: this.popupMenuStyleHeight,
         };
-        return (h(Host, { key: '4754c8522cdd93a4e90398840cb321821636b489' }, h("div", { key: '45ceb31093aa93bf21e61daed2c77c4ba816556f', ref: element => {
+        return (h(Host, { key: 'c5d59c4859a8b66d3fdc725163b4163599c70a6f' }, h("div", { key: '376869b621cf3f1899ef6d1e9c1e913bb47fc83f', 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 }, h("slot", { key: '88dde9607c352adc70eb6a27b5fab917585cef1e' }))));
+            }, role: this.accessibleRole, "aria-label": this.accessibleLabel }, h("slot", { key: '7a5793c36e4103077f1e8165478b410a5068e4a0' }))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -680,11 +680,11 @@ const DuetPopupMenuItem = class {
             "duet-theme-turva": this.theme === "turva",
             "active-descendant": this.activeDescendant,
         };
-        return (h(Host, { key: 'd8a0f9f62ecc1abedce8431e27331ff3d88f4c24', role: this.accessibleRole }, h(TagName, { key: '998d7156c8a1e789405240a5927923e83130eb48', ref: element => (this.itemElement = element), tabIndex: this.accessibleRole === "listitem" ? 0 : -1, onFocus: this.onFocus, onBlur: this.onBlur, role: `${TagName === "a" ? "link" : "button"}`, "aria-label": this.accessibleLabel, class: classes, value: this.value, href: this.url, target: this.external ? "_blank" : undefined, rel: this.external ? "noopener" : undefined, lang: TagName === "button" ? undefined : this.targetLanguage, hreflang: TagName === "button" ? undefined : this.targetLanguage }, this.leadingIcon && (h("duet-icon", { key: 'db04fcce497b69525b6dafe5179aaff15a61a98f', name: this.leadingIcon, size: "x-small", color: this.leadingIconColor ? this.leadingIconColor : "currentColor", class: "duet-popup-menu-item-leading", margin: "none" })), h("span", { key: 'f67feb833576c6272f80097877c16cc0c68f41f8', class: "duet-popup-menu-item-label" }, h("slot", { key: 'bd8abe74d51a7398ab7ba70813dc1449ad5e0bb4' })), (this.trailingIcon || this.active || (this.url && this.external)) && (h("duet-icon", { key: '3f75ee757d5ff1b5fa9055b897fd51c31f6919d5', name: this.url && this.external
+        return (h(Host, { key: 'cba4450c5f4e743f1c54c4736930fd263acba1db', role: this.accessibleRole }, h(TagName, { key: '94c16ad9906c2ea626f186a405a044f8c0fdc38b', ref: element => (this.itemElement = element), tabIndex: this.accessibleRole === "listitem" ? 0 : -1, onFocus: this.onFocus, onBlur: this.onBlur, role: `${TagName === "a" ? "link" : "button"}`, "aria-label": this.accessibleLabel, class: classes, value: this.value, href: this.url, target: this.external ? "_blank" : undefined, rel: this.external ? "noopener" : undefined, lang: TagName === "button" ? undefined : this.targetLanguage, hreflang: TagName === "button" ? undefined : this.targetLanguage }, this.leadingIcon && (h("duet-icon", { key: 'bc37f155bb1a3c6e0519f1b673682840e7cc2838', name: this.leadingIcon, size: "x-small", color: this.leadingIconColor ? this.leadingIconColor : "currentColor", class: "duet-popup-menu-item-leading", margin: "none" })), h("span", { key: '641cb769d15e68d2e05893737b2712cb22916084', class: "duet-popup-menu-item-label" }, h("slot", { key: 'c4e79af7b0a972b68a6a30ca479d3fe49ec0ac57' })), (this.trailingIcon || this.active || (this.url && this.external)) && (h("duet-icon", { key: 'd5ae36ac91afb6b5f9a6bfe461a10b68ee0f916e', name: this.url && this.external
                 ? actionNewWindowSmall.title
                 : this.active
                     ? "messaging-checked-small"
-                    : this.trailingIcon, size: (this.url && this.external) || this.active ? "xx-small" : "x-small", color: "currentColor", class: "duet-popup-menu-item-trailing", margin: "none" })), this.trailingText && h("span", { key: 'e716737df75eb8ee5512b2075e37ef539fe4ef2c', class: "duet-popup-menu-item-trailing" }, this.trailingText))));
+                    : this.trailingIcon, size: (this.url && this.external) || this.active ? "xx-small" : "x-small", color: "currentColor", class: "duet-popup-menu-item-trailing", margin: "none" })), this.trailingText && h("span", { key: '79631aaffd5c2b020ebc6f37f0770147ae8291fa', class: "duet-popup-menu-item-trailing" }, this.trailingText))));
     }
     get element() { return getElement(this); }
 };

package/lib/esm/duet-choice_2.entry.js

@@ -1,13 +1,13 @@
 /*!
  * Built with Duet Design System
  */
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-1d0b7c66.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-4b4e4ec8.js';
 import { i as inheritGlobalTheme } from './themeable-component-860041c5.js';
 import { D as DuetStringsExternalDefaults } from './common-strings-af765cad.js';
 import { c as createID } from './create-id-149a1b6d.js';
 import { i as isKeyboardClick, h as isQuestionKey, s as subscribeTabbingChange, u as unsubscribeTabbingChange, f as isEscapeKey } from './keyboard-utils-439bcc8b.js';
-import { g as getLocaleString, a as getLanguage, c as connectLanguageChangeObserver, d as disconnectLanguageChangeObserver } from './language-utils-14969cef.js';
-import { h as hasSlot, g as getElementsFromNamedSlot, c as checkNamedSlotElement } from './slot-utils-4e5ed4eb.js';
+import { g as getLocaleString, a as getLanguage, c as connectLanguageChangeObserver, d as disconnectLanguageChangeObserver } from './language-utils-1b413a6b.js';
+import { h as hasSlot, g as getElementsFromNamedSlot, c as checkNamedSlotElement } from './slot-utils-ae4dc467.js';
 import './string-utils-192eb3c8.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>"};
@@ -340,7 +340,7 @@ const DuetChoice = class {
      */
     render() {
         const identifier = this.identifier || this.choiceId;
-        return (h(Host, { key: '769363c98f975c9f2881acdc911ba2cd28c36351', class: {
+        return (h(Host, { key: 'e45e3d883ff601f42cda53bb745589a6cff07669', class: {
                 horizontal: this.groupDirection === "horizontal" && !this.groupResponsive,
                 "horizontal-responsive": this.groupDirection === "horizontal" && this.groupResponsive,
                 "duet-m-0": this.margin === "none",
@@ -348,10 +348,10 @@ const DuetChoice = class {
                 "duet-theme-turva": this.theme === "turva",
                 "no-hover": this.isHovering,
                 disabled: this.getDisabled(),
-            } }, h("div", { key: '93dea4566ff9694947713e14e172c338ae0c8d8c', class: {
+            } }, h("div", { key: '269cb0465b9088983bb4a9c3b0fab4ee0e4a2bd4', class: {
                 "duet-choice-card-flextainer": true,
                 "duet-theme-turva": this.theme === "turva",
-            } }, h("div", { key: '846c05b6a685ecba8be08d1c7bad60165452d98f', class: {
+            } }, h("div", { key: 'f58dab3ebe6b31f9284d609e62d8c97e3056160a', class: {
                 "duet-choice-card": true,
                 "has-icon": !!this.icon,
                 "has-info": this.hasInfo,
@@ -360,16 +360,16 @@ const DuetChoice = class {
                 collapsible: this.collapsible,
                 "collapsible-force-expanded": this.collapsibleForceExpanded,
                 "duet-p-0": this.padding === "none",
-            } }, this.type === "checkbox" && (h("input", { key: '033d896b5949802ed8031f649e5f82d438a59014', class: "duet-choice-input", type: this.type, onFocus: this.onFocus, onBlur: this.onBlur, onChange: this.onChange, disabled: this.getDisabled(), required: this.required, id: identifier, name: this.name, value: this.value, checked: this.checked, "aria-label": this.getLabel(), "aria-controls": this.accessibleControls, "aria-activedescendant": this.accessibleActiveDescendant, "aria-labelledby": this.accessibleLabelledBy, "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, "aria-owns": this.accessibleOwns, "aria-describedby": this.getAriaDescribedby(), onKeyDown: this.handleKeyDown, ref: input => (this.focusableElement = input) })), h("slot", { key: 'c9f2bf88993e31592ea467c16858bb8a57ac5e56', name: "choiceradioinput" }), h("label", { key: 'e038f367106ffd8712a0908d65d125b5f285a916', class: {
+            } }, this.type === "checkbox" && (h("input", { key: '0223b78eb319e469137a52e6b64898d0862eafac', class: "duet-choice-input", type: this.type, onFocus: this.onFocus, onBlur: this.onBlur, onChange: this.onChange, disabled: this.getDisabled(), required: this.required, id: identifier, name: this.name, value: this.value, checked: this.checked, "aria-label": this.getLabel(), "aria-controls": this.accessibleControls, "aria-activedescendant": this.accessibleActiveDescendant, "aria-labelledby": this.accessibleLabelledBy, "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, "aria-owns": this.accessibleOwns, "aria-describedby": this.getAriaDescribedby(), onKeyDown: this.handleKeyDown, ref: input => (this.focusableElement = input) })), h("slot", { key: 'b438afa42e1d50c6aa9a145e656aed1b0f801efa', name: "choiceradioinput" }), h("label", { key: 'c08ba3234495038c9dedce7247aef93e9171e4c1', class: {
                 "duet-choice-label": true,
                 "has-before-text": this.hasBeforeText,
                 checked: this.checked,
                 focus: this.focus,
                 disabled: this.getDisabled(),
-            }, onClick: this.onClick }, this.hasBeforeText && h("slot", { key: '1b19e1fa3fcf5a3a3e16f5330a513adff661798e', name: "before-text" }), this.icon && (h("div", { key: 'cf7b7dba99cf4c93a0af8348841a548a0e4153aa', class: "duet-choice-card-icon" }, h("duet-icon", { key: '3adb65bb97bad88b84472b408c2c7582ad3e6012', margin: "none", size: "small", name: this.icon, color: "currentColor" }))), h("div", { key: '8a85581545676b925ca39c614876f3cebb5553c4', class: "duet-choice-card-text" }, h("div", { key: '4baf1c808b3a8946f63cd5d64c135f29387910a1' }, this.hasLabel ? h("slot", { name: "label" }) : this.label), this.caption && (h("div", { key: 'd4d2e94b379c242853047e92b8ef3d02358d47ab' }, h("duet-spacer", { key: 'cb761b10de1afba742bcfb83cfcd0885e09d4da2', size: "xx-small" }), h("duet-caption", { key: 'f4238edc949718154d77c4a465d515b4eaeae3df', margin: "none", selected: this.checked }, this.caption))), this.hasAdditional && (h("div", { key: 'e932cefc8acedea9b152c66d50bbe591be8cf04d' }, h("duet-spacer", { key: '1ea7940f74edb2bb99405091097530836c0412eb', size: "xx-small" }), h("slot", { key: '63fc4d2ad4a0f5d14666ff703ad4defaf2e950ed', name: "additional" })))), h("div", { key: '9ca502e4e6929ed03c09818909b708e6174392c9' }, h("div", { key: 'e2ec3f18108f7be37e7d38a3a8a6b7126ac37367', class: { "duet-checkmark-container": true, "duet-checkmark-radio": this.type === "radio" } }, this.checked && h("div", { key: 'aed8333ed8fcc374095721d94a070fec03761d47', class: "duet-checkmark" }))))), this.hasInfo && !this.collapsible && (h("button", { key: '209184ed7ae21002ff718c2efce27aa498db02d3', ref: button => (this.infoButtonEl = button), id: this.infoButtonId, class: {
+            }, onClick: this.onClick }, this.hasBeforeText && h("slot", { key: '822b608190ed8058e5083664364f7802f36bbc12', name: "before-text" }), this.icon && (h("div", { key: '47be54fb7c3c00ab9cdff531a158e3bf8131d1eb', class: "duet-choice-card-icon" }, h("duet-icon", { key: 'ba85bd90adcc57f4f3b4641d10417f14c0a3d0a7', margin: "none", size: "small", name: this.icon, color: "currentColor" }))), h("div", { key: '9bffd97bdf78929c3e18eed10f9903c068f84284', class: "duet-choice-card-text" }, h("div", { key: '7378526d0c1be754eeef8acb758b800534710af6' }, this.hasLabel ? h("slot", { name: "label" }) : this.label), this.caption && (h("div", { key: '2c026043a64085f44ec11e2b59fa7d3625880b98' }, h("duet-spacer", { key: '23bd4874a25550df5c010a4ac2f4753b7bebe095', size: "xx-small" }), h("duet-caption", { key: '1e91ca0d61dcbb29b48095ade98d69f35f8d034e', margin: "none", selected: this.checked }, this.caption))), this.hasAdditional && (h("div", { key: 'af539e1466767e981b523efd118aaadec4c3ac7e' }, h("duet-spacer", { key: '3062fe17e11d61e8e02364762088fc33e3f123fd', size: "xx-small" }), h("slot", { key: '2a4faf03104769cf9c8c12b3700608ccbf353233', name: "additional" })))), h("div", { key: 'a31c056ac9d543e7ee157fd4e2dddfd64cc823a9' }, h("div", { key: '8e139394a6669f009546db7274152790fb099cb0', class: { "duet-checkmark-container": true, "duet-checkmark-radio": this.type === "radio" } }, this.checked && h("div", { key: '661c15b7dd0fbe9012e16841c1f082e85fd8f6de', class: "duet-checkmark" }))))), this.hasInfo && !this.collapsible && (h("button", { key: 'c8b30535f36197e9f435b806ca23f0c8cbf81e4a', ref: button => (this.infoButtonEl = button), id: this.infoButtonId, class: {
                 "duet-choice-info-toggle": true,
                 "duet-theme-turva": this.theme === "turva",
-            }, onMouseEnter: this.onMouseEnter, onMouseLeave: this.onMouseLeave, onClick: this.toggleInfo, disabled: this.getDisabled(), "aria-expanded": this.isInfoOpen ? "true" : "false", "aria-label": `${this.infoLabel} ${this.label}`, "aria-controls": this.expandId, tabindex: this.type === "radio" && !this.checked ? "-1" : "0", type: "button", onKeyUp: e => this.handleEscape(e) }, h("div", { key: 'eb76ae734893e6c9375d63a7ce73283437c3bf40', class: "duet-choice-info-icon" }, h("duet-icon", { key: '21eaedd36a86a68b74ccd1420dbe838f1e23d4f0', icon: messagingInfo.svg, margin: "none", size: "small", color: "currentColor" }))))), this.collapsible && (h("span", { key: 'a681b8c754aa3d6e24a70f95bf7d7c6bf7d31f5c', id: `${this.choiceId}-collapsible-notification`, hidden: true }, this.collapsibleNotification)), this.collapsible || this.hasInfo ? (h("div", { class: this.getClassNames(), id: this.expandId }, h("span", { class: {
+            }, onMouseEnter: this.onMouseEnter, onMouseLeave: this.onMouseLeave, onClick: this.toggleInfo, disabled: this.getDisabled(), "aria-expanded": this.isInfoOpen ? "true" : "false", "aria-label": `${this.infoLabel} ${this.label}`, "aria-controls": this.expandId, tabindex: this.type === "radio" && !this.checked ? "-1" : "0", type: "button", onKeyUp: e => this.handleEscape(e) }, h("div", { key: 'a658c863b61f1d5f8949e24ed9a59108c8a6fa76', class: "duet-choice-info-icon" }, h("duet-icon", { key: '6d4aae6cdecafd186807a43914409cb35e8fdb38', icon: messagingInfo.svg, margin: "none", size: "small", color: "currentColor" }))))), this.collapsible && (h("span", { key: '9796521f397d0b976a84884108d4138a054c3b92', id: `${this.choiceId}-collapsible-notification`, hidden: true }, this.collapsibleNotification)), this.collapsible || this.hasInfo ? (h("div", { class: this.getClassNames(), id: this.expandId }, h("span", { class: {
                 "duet-choice-section-visible": this.collapsible ? this.getExpanded() : this.isInfoOpen,
                 "duet-choice-section-hidden": this.collapsible ? !this.getExpanded() : !this.isInfoOpen,
             } }, h("span", { id: this.headerId }, h("slot", { name: "header" })), this.hasInfo ? (h("span", { ref: span => (this.infoContainer = span), tabindex: "0", class: "duet-choice-info-container", onKeyUp: e => this.handleEscape(e) }, h("span", null, h("slot", { name: "info" })), h("slot", null))) : (h("span", { id: `${this.choiceId}-collapsible-content` }, h("slot", null)))))) : null));
@@ -494,14 +494,14 @@ const DuetChoiceGroup = class {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: '0f05e4491b0ed604ed36ad5a20755a183f219e61', onDuetChange: this.onSelect, onDuetChoiceReady: this.onChoiceReady, onDuetChoiceRemove: this.onChoiceRemove, class: {
+        return (h(Host, { key: 'fda102de643d0654008818d2fcde77410c6cdde2', onDuetChange: this.onSelect, onDuetChoiceReady: this.onChoiceReady, onDuetChoiceRemove: this.onChoiceRemove, class: {
                 horizontal: this.direction === "horizontal",
                 "duet-choice-group-breakpoint-x-small": this.responsive && this.breakpoint === "x-small",
                 "duet-choice-group-breakpoint-small": this.responsive && this.breakpoint === "small",
                 "duet-choice-group-breakpoint-medium": this.responsive && this.breakpoint === "medium",
                 "duet-choice-group-breakpoint-large": this.responsive && this.breakpoint === "large",
                 "duet-choice-group-breakpoint-x-large": this.responsive && this.breakpoint === "x-large",
-            } }, h("duet-fieldset", { key: 'c6b16eb32fa18224f1fca5450a1a00609ee0800c', label: this.label, labelHidden: this.labelHidden, compactLabel: true, caption: this.caption, error: this.error, margin: this.margin, theme: this.theme, "accessible-live-error": this.accessibleLiveError }, this.tooltip && (h("duet-tooltip", { key: '23ea892920b10486ec2ff7dc5c6893d4f4b58028', slot: "tooltip", direction: this.tooltipDirection, accessibleInputLabel: this.label }, this.tooltip)), h("slot", { key: '6f067a2d955d9a60728e5f8746650480d5719491', name: "tooltip" }), h("div", { key: 'e3bfaa0355f3eb50844f4e5a47dc02d0816380e2', class: { [this.choiceGroupName]: true, "duet-no-stacking": !this.responsive } }, h("slot", { key: '8af6ad42073f04162bf0f7482e9987e1f386e7b5' })))));
+            } }, h("duet-fieldset", { key: '3f0fb7608260d92a4e92efedadb5e2a115a6d6c7', label: this.label, labelHidden: this.labelHidden, compactLabel: true, caption: this.caption, error: this.error, margin: this.margin, theme: this.theme, "accessible-live-error": this.accessibleLiveError }, this.tooltip && (h("duet-tooltip", { key: '8c3ec02a326faca65617b165b7746e5e2963cce4', slot: "tooltip", direction: this.tooltipDirection, accessibleInputLabel: this.label }, this.tooltip)), h("slot", { key: 'c5ae2e61d96374bca1b12acdea2f47596401f456', name: "tooltip" }), h("div", { key: '399845c3e169ceca3476e685bcd2ee76f8c45b02', class: { [this.choiceGroupName]: true, "duet-no-stacking": !this.responsive } }, h("slot", { key: 'ea9969eee1a0c2e454e59bffc03952c2247c119a' })))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {

package/lib/esm/duet-collapsible.entry.js

@@ -1,13 +1,13 @@
 /*!
  * Built with Duet Design System
  */
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-1d0b7c66.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-4b4e4ec8.js';
 import { a as actionArrowDownSmall } from './action-arrow-down-small-82273dc8.js';
 import { f as font_size_medium, t as tokens } from './tokens-84fb2357.js';
 import { i as inheritGlobalTheme } from './themeable-component-860041c5.js';
 import { c as createID } from './create-id-149a1b6d.js';
 import { i as isKeyboardClick, s as subscribeTabbingChange, u as unsubscribeTabbingChange } from './keyboard-utils-439bcc8b.js';
-import { h as hasSlot } from './slot-utils-4e5ed4eb.js';
+import { h as hasSlot } from './slot-utils-ae4dc467.js';
 import { s as sanitizeString } from './string-utils-192eb3c8.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(8, 42, 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(8, 42, 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(8, 42, 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(8, 42, 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)}:host(.negative) .duet-collapsible-heading,:host(.negative) .duet-collapsible-content,:host(.negative) .duet-collapsible-heading-icon{color:rgb(255, 255, 255)}";
@@ -105,14 +105,14 @@ const DuetCollapsible = class {
      */
     render() {
         const HeadingTagName = this.headingLevel ? sanitizeString(this.headingLevel) : "div";
-        return (h(Host, { key: 'e75871cb9a6fd0f3050c22c4ac9059c8daa8c2ca', class: { "duet-m-0": this.margin === "none", negative: this.negative } }, h(HeadingTagName, { key: '4b9571caa365df133f607952f427d5f2662a61d6' }, h("button", { key: '29f111d38aeac967f9ef9e2696fe0da79b07210c', class: {
+        return (h(Host, { key: '249132a1b5e58240d37d3d995a4ef53378eff63f', class: { "duet-m-0": this.margin === "none", negative: this.negative } }, h(HeadingTagName, { key: '7b9c2682402ac40049fa13406131a1d1a55eb051' }, h("button", { key: 'cb3b234ce9ee241fa3f63c81850ea418af00f045', class: {
                 "duet-collapsible-heading": true,
                 "duet-collapsible-heading-centered": this.centerHeading,
                 "duet-theme-turva": this.theme === "turva",
                 "duet-collapsible-normal-weight": this.headingWeight === "normal",
                 "has-after-heading": this.hasAfterHeading,
                 "full-width": this.headingFullWidth,
-            }, style: { "font-size": this.getFontSizeFromTokens() }, role: "button", ref: button => (this.nativeButton = button), "aria-label": this.accessibleLabel, "aria-expanded": this.open ? "true" : "false", "aria-controls": this.id, onClick: this.handleClick, onKeyDown: this.handleKeyDown }, h("div", { key: 'f22a73bf54b611968e8e9ecfac22c4a5d912942a', class: "duet-collapsible-heading-icon" }, h("duet-icon", { key: '3f1706b22520ee9e1856ba3d9bd8f4e04a026e20', margin: "none", size: this.getEquivalentIconSize(), icon: actionArrowDownSmall.svg })), h("div", { key: '88b89faf977d753d6d53f838d986b6ec567ed8e3', class: "duet-collapsible-heading-content", part: "duet-collapsible-heading-content" }, this.heading), this.hasAfterHeading && (h("div", { key: '97304f5806f809b1d7e86306b60901ce96df2f8e', part: "duet-collapsible-after-heading" }, h("slot", { key: '0d37e9e85c477aa0f4b3f0f9b7209b429c917bd6', name: "after-heading" }))))), h("div", { key: 'cc27c3dca50171f016f3a0991a67f07334223f9b', id: this.id, class: { "duet-collapsible-content": true, "duet-theme-turva": this.theme === "turva" }, part: "duet-collapsible-content" }, h("slot", { key: 'b17cc5907e981ea030f3a070e6cad046e15af55c' }))));
+            }, style: { "font-size": this.getFontSizeFromTokens() }, role: "button", ref: button => (this.nativeButton = button), "aria-label": this.accessibleLabel, "aria-expanded": this.open ? "true" : "false", "aria-controls": this.id, onClick: this.handleClick, onKeyDown: this.handleKeyDown }, h("div", { key: '4aebb0229f1a8436ef5413b696c8d8674d81bd7d', class: "duet-collapsible-heading-icon" }, h("duet-icon", { key: 'a67ec08b1f5f0ef4e3b7ece52664104d9d2df10b', margin: "none", size: this.getEquivalentIconSize(), icon: actionArrowDownSmall.svg })), h("div", { key: 'a2a5c24dd64f3bab25c8167c11f738953e78a948', class: "duet-collapsible-heading-content", part: "duet-collapsible-heading-content" }, this.heading), this.hasAfterHeading && (h("div", { key: '9d4820bb70777bfcaee8fc76f47fcba4e9ed9a91', part: "duet-collapsible-after-heading" }, h("slot", { key: 'cbe50074d804f79c746f29760d3536241e5d2717', name: "after-heading" }))))), h("div", { key: '8cd82a8d4e2aa518cd1c9ca8451ace90a4ff8ec9', id: this.id, class: { "duet-collapsible-content": true, "duet-theme-turva": this.theme === "turva" }, part: "duet-collapsible-content" }, h("slot", { key: '2bf409c9b05c884ce0c1de5358c4446ed0d6dc34' }))));
     }
     get element() { return getElement(this); }
 };