@duetds/components 9.1.1 → 9.1.2

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

@@ -144,10 +144,10 @@ export class DuetLink {
     render() {
         const Tag = !this.url ? "button" : "a";
         const isButton = Tag === "button";
-        return (h(Host, { key: '38d90e4467279d94a029c7ce5fdaf9fa3590d5ae', class: {
+        return (h(Host, { key: '75eb01922ce99815e41ce9ad2debcd3a7adf0289', class: {
                 [`duet-link-${this.variation}`]: true,
                 "duet-m-0": this.margin === "none",
-            } }, h(Tag, { key: '5b1b7b691a3d66382b593a07fd47b3072fcd12fb', href: this.url, class: {
+            } }, h(Tag, { key: '939df1d20c0a1e9beca877828c2e5aea3b6d6279', href: this.url, class: {
                 "duet-link": true,
                 "duet-link-is-external": this.external,
                 "duet-link-is-download": !!this.download,

package/lib/collection/components/duet-list-item/duet-list-item.js

@@ -16,14 +16,14 @@ export class DuetListItem {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: '5ca1067fca4b44ef1a3b57b52e775407879ab750', class: {
+        return (h(Host, { key: '51727fd3a93ff7c60c621ac1d7e7cc81f968c64c', class: {
                 "duet-no-stacking": !this.responsive,
                 "duet-list-item-breakpoint-x-small": this.breakpoint === "x-small",
                 "duet-list-item-breakpoint-small": this.breakpoint === "small",
                 "duet-list-item-breakpoint-medium": this.breakpoint === "medium",
                 "duet-list-item-breakpoint-large": this.breakpoint === "large",
                 "duet-list-item-breakpoint-x-large": this.breakpoint === "x-large",
-            } }, h("dt", { key: 'c8141e0af55f96c0dae8fbb8a50e74be470dc6bd' }, h("slot", { key: '583b9d7f5109da8f0185abcf07ca45d6d30944dc', name: "label" })), h("dd", { key: 'bfcb5056ec7fbb9412084e3eb95b610f168d7559' }, h("slot", { key: '3b844ecbbf9dbb82e2b4d9ac44cad328104865da', name: "value" }))));
+            } }, h("dt", { key: 'efa1422d25f7b0b30977b274edd33c65ffbb098a' }, h("slot", { key: '985fb259b41d4167c1b30101a8774672b3f04366', name: "label" })), h("dd", { key: 'b2708677ba4d4b9695f44dea7249243db286552d' }, h("slot", { key: 'fe82ff7e6aa8ba8862700260087dcc1e4cd9a5ed', name: "value" }))));
     }
     static get is() { return "duet-list-item"; }
     static get encapsulation() { return "shadow"; }

package/lib/collection/components/duet-menu-bar-button/duet-menu-bar-button.js

@@ -38,10 +38,10 @@ export class DuetMenuBarButton {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: '9206620e16533fa13b7b84f47b8543a70a7b2410', role: "listitem", onfocus: () => this.setFocus() }, h("button", { key: 'e172b1d487ac1b425e26b56485f03b6ee2453110', ref: button => (this.nativeButton = button), class: {
+        return (h(Host, { key: '010c3762832e9c231e6a5854d41fb1c7f4fa28c5', role: "listitem", onfocus: () => this.setFocus() }, h("button", { key: '6619916a523cc1fec742686d79f04ad770cc4fd9', ref: button => (this.nativeButton = button), class: {
                 "duet-menu-bar-button": true,
                 "duet-theme-turva": this.theme === "turva",
-            }, "aria-controls": this.accessibleControls, "aria-label": this.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-activedescendant": this.accessibleActiveDescendant, "aria-owns": this.accessibleOwns, "aria-describedby": this.accessibleDescribedBy, "aria-labelledby": this.accessibleLabelledBy, "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, "aria-pressed": this.accessiblePressed != null ? this.accessiblePressed.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined }, this.icon && (h("duet-icon", { key: '46afda060d34d192871f0601c64c188236389aed', class: "menu-bar-button-icon", theme: this.theme, size: "auto", name: this.icon, margin: "none", color: "currentColor" })), h("slot", { key: '61ead72d9ec280bc7a757582c62d7028ce400d22' }))));
+            }, "aria-controls": this.accessibleControls, "aria-label": this.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-activedescendant": this.accessibleActiveDescendant, "aria-owns": this.accessibleOwns, "aria-describedby": this.accessibleDescribedBy, "aria-labelledby": this.accessibleLabelledBy, "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, "aria-pressed": this.accessiblePressed != null ? this.accessiblePressed.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined }, this.icon && (h("duet-icon", { key: 'b0d060dca6c2cdca71babf45905f4ef7e4329c57', class: "menu-bar-button-icon", theme: this.theme, size: "auto", name: this.icon, margin: "none", color: "currentColor" })), h("slot", { key: '938d21747a7753f9bbfc91e10d39ff0b716fec43' }))));
     }
     static get is() { return "duet-menu-bar-button"; }
     static get encapsulation() { return "shadow"; }

package/lib/collection/components/duet-menu-bar-dropdown/duet-menu-bar-dropdown.js

@@ -54,17 +54,17 @@ export class DuetMenuBarDropdown {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: 'b7505ee892ea3ee2d0e0f37e3638b7d2b783712a', role: "listitem" }, h("div", { key: '751e646811727d6f6a24a416df10f1c543940879', class: {
+        return (h(Host, { key: '0b4e584af1d151a1e50ec8d9e4b573ceaaccf359', role: "listitem" }, h("div", { key: 'cdd13fd6b2c823bba5df313ba88c5b7d06db4ffb', class: {
                 "duet-menu-bar-dropdown": true,
                 "duet-theme-turva": this.theme === "turva",
                 active: this.open,
                 [`duet-menu-bar-dropdown--slot-${this.getVariant()}`]: true,
-            } }, h("button", { key: 'fef18c42d08e89e0db82ca29c0aacf1cb9ff5326', ref: element => (this.button = element), "aria-label": this.accessibleLabel, "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", id: "button", type: "button", class: {
+            } }, h("button", { key: '5674f60fef98e6e184f2fcccc764deef331caa12', ref: element => (this.button = element), "aria-label": this.accessibleLabel, "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", id: "button", type: "button", class: {
                 active: this.open,
-            }, onClick: this.onClick, onKeyUp: e => this.handleEscape(e) }, this.icon && (h("duet-icon", { key: '76888e1deea9cbb8e7bb3bdf5336669e2ae413e5', class: "menu-bar-dropdown-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), h("div", { key: 'd6d0c4bd9426aa41b4ba68b222669c922943150b', class: "label" }, h("slot", { key: '6478ad4df0cc0f954ef1a2ea8c4d7d6379e3ee83', name: "label" }), h("duet-icon", { key: '4118eec0a8f4d17b22aeab5efb9e7af3d9c6d096', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), h("div", { key: 'd7026456d474f327320675a3174ec3eb1caf706d', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
+            }, onClick: this.onClick, onKeyUp: e => this.handleEscape(e) }, this.icon && (h("duet-icon", { key: '2579445ac0540e1c097ad5af4197743ec84cb1c8', class: "menu-bar-dropdown-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), h("div", { key: '3f1783c651ff0c6d9350e4f69d38a029279c9aab', class: "label" }, h("slot", { key: '321d0f11ab687b2324cfdd4320a48cc343ead7bb', name: "label" }), h("duet-icon", { key: 'f3f61be24eec78ead6378f1810ec73f2ec8926e0', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), h("div", { key: 'cb3e00c6342991645136a04cdc2a8075df1cb25a', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
                 items: true,
                 hidden: !this.open,
-            } }, h("slot", { key: 'da2e4f2687f3aa80426a260df734e79cdb69c48a' })))));
+            } }, h("slot", { key: '8c626d701bb71d84458580a3c17a50ea34c894ed' })))));
     }
     static get is() { return "duet-menu-bar-dropdown"; }
     static get encapsulation() { return "shadow"; }

package/lib/collection/components/duet-menu-bar-dropdown-link/duet-menu-bar-dropdown-link.js

@@ -40,11 +40,11 @@ export class DuetMenuBarDropdownLink {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: 'e3310b8dfef57c95572f69574ab3f2844f0a8fd2' }, h("a", { key: '0bc7dc99b57576902aa56cf53e0f0a092d7d1606', class: {
+        return (h(Host, { key: '338a7ca1c696467944414aaf0ecdf7628803dc2b' }, h("a", { key: '1160b7ac731c82021899fa8d7c49b9f47517b942', class: {
                 "duet-menu-bar-dropdown-link": true,
                 [`duet-menu-bar-dropdown-link--slot-${this.getVariant()}`]: true,
                 "duet-theme-turva": this.theme === "turva",
-            }, href: this.href, role: "menuitem", onKeyUp: e => this.handleEscape(e), "aria-label": this.accessibleLabel }, this.icon && (h("duet-icon", { key: '0434d95f76ea5e61047da18bac14f7261626a161', theme: this.theme, name: this.icon, size: "x-small", margin: "none", color: "currentColor" })), h("slot", { key: '8b32a81bdf0bd30bb14486a8593e31f1cd86632e' }))));
+            }, href: this.href, role: "menuitem", onKeyUp: e => this.handleEscape(e), "aria-label": this.accessibleLabel }, this.icon && (h("duet-icon", { key: 'c82028bea753c8ef4199c146e8d30882284bfb81', theme: this.theme, name: this.icon, size: "x-small", margin: "none", color: "currentColor" })), h("slot", { key: 'fb472a9792cb0bcd581fac7ec95c08b5591034d1' }))));
     }
     static get is() { return "duet-menu-bar-dropdown-link"; }
     static get encapsulation() { return "shadow"; }

package/lib/collection/components/duet-menu-bar-item/duet-menu-bar-item.js

@@ -32,11 +32,11 @@ export class DuetMenuBarItem {
      */
     render() {
         const TagName = this.url ? "a" : "button";
-        return (h(Host, { key: 'd2a4ae5947cf7b820de11d1c92be082aefa72e3f', role: "listitem" }, h(TagName, { key: 'bb5eef2f76aed3e48357bc4cc399794df49ca320', ref: element => (this.itemElement = element), class: {
+        return (h(Host, { key: '8e7241649b951194c60825a37fe5510977544e0c', role: "listitem" }, h(TagName, { key: '5b09cb58b5161434694f4aed6d07d0c4e1b1cd55', ref: element => (this.itemElement = element), class: {
                 "duet-menu-bar-item": true,
                 "duet-theme-turva": this.theme === "turva",
                 active: this.active,
-            }, href: this.url, role: `${TagName === "a" ? "link" : "button"}`, "aria-current": this.active ? "true" : "false", "aria-label": this.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined }, this.leadingIcon && (h("duet-icon", { key: 'f0a8e147fe0b4e6beb3e9c0e68d73d17d8903179', class: "leading-icon", size: "auto", name: this.leadingIcon, margin: "none", theme: this.theme, color: "currentColor" })), h("slot", { key: '290f322579d4af32f271ae21d86be07e4938dced' }), this.trailingIcon && (h("duet-icon", { key: 'a34778af006706400452949461d96ab1dece7608', class: {
+            }, href: this.url, role: `${TagName === "a" ? "link" : "button"}`, "aria-current": this.active ? "true" : "false", "aria-label": this.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined }, this.leadingIcon && (h("duet-icon", { key: '09390cfac47f512732ef0e06d619dbbeeaf78e85', class: "leading-icon", size: "auto", name: this.leadingIcon, margin: "none", theme: this.theme, color: "currentColor" })), h("slot", { key: 'c40f41f6be5fa7273bcb2c74dc7eabbf99b8497d' }), this.trailingIcon && (h("duet-icon", { key: 'f5df545b4fab627ee14271992a8372992a78268d', class: {
                 "trailing-icon": true,
                 "trailing-icon-arrow": this.trailingIcon === "action-arrow-down-small",
                 rotate: this.trailingIcon === "action-arrow-down-small" && this.accessibleExpanded,

package/lib/collection/components/duet-menu-bar-link/duet-menu-bar-link.js

@@ -22,11 +22,11 @@ export class DuetMenuBarLink {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: '570640efc7db1d51c8ec33f775b2b13ffd8fd909', role: "listitem" }, h("a", { key: '62ed2f6bf339d40211f56ff0e78ab61aa71a6c9a', class: {
+        return (h(Host, { key: '0bd31ec6a4067c93d4aba6cc9f4944071a7941e8', role: "listitem" }, h("a", { key: 'b3457c0d37c58608940f7c4393bf527fd64a3bff', class: {
                 "duet-menu-bar-link": true,
                 "duet-theme-turva": this.theme === "turva",
                 active: this.active,
-            }, href: this.href, "aria-current": this.active ? "true" : "false", "aria-label": this.accessibleLabel }, this.icon && (h("duet-icon", { key: '45e66a513cff3cda4b8f4ab51fc0d404391265a1', class: "menu-bar-link-icon", theme: this.theme, size: "auto", name: this.icon, margin: "none", color: "currentColor" })), h("slot", { key: '144d7755346f5dc042b2ad7836a3020d954b6648' }))));
+            }, href: this.href, "aria-current": this.active ? "true" : "false", "aria-label": this.accessibleLabel }, this.icon && (h("duet-icon", { key: '2c208b3c951b892fb2370804517d0f0ade12c747', class: "menu-bar-link-icon", theme: this.theme, size: "auto", name: this.icon, margin: "none", color: "currentColor" })), h("slot", { key: '8153a5aa5771e0337219a845d80e5c5733152594' }))));
     }
     static get is() { return "duet-menu-bar-link"; }
     static get encapsulation() { return "shadow"; }

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

@@ -24,7 +24,7 @@ export class DuetNav {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: 'a92a1ddaae09ce96b5e5d11f75b90e890e405494' }, h("div", { key: '5ff997d4da49fc082af18866b7e19ded4d64566c', class: { container: true, sticky: this.sticky } }, h("slot", { key: 'e18cbf0c99d69c3457eda1ff7f291161f10547d4' }), h("slot", { key: '70b3b0456c5e4e3307b12ad9a44f87c4861b98a5', name: "mobile" }), h("slot", { key: '2ad5781a32b89b6857505c0bb6bfba2c95422dbe', name: "desktop" }))));
+        return (h(Host, { key: '925ca1d521d5335df3d278e2f48d2193cc55cc25' }, h("div", { key: '8fecbad03cf107aedec51281333d468522529c12', class: { container: true, sticky: this.sticky } }, h("slot", { key: 'b9f0bd0baee561747192ab5ed2ec1430a55e69eb' }), h("slot", { key: '61b7f4ee44f4527b53ba42cd24f149bbdb2d0d33', name: "mobile" }), h("slot", { key: 'bbacd508275e4ba6290f8dd66f0a657d5e647156', name: "desktop" }))));
     }
     static get is() { return "duet-nav"; }
     static get encapsulation() { return "shadow"; }

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

@@ -43,11 +43,11 @@ export class DuetNotification {
         this.linkElement.focus(options);
     }
     render() {
-        return (h("div", { key: '96c5142b088c958a661411f3995f673e2ccc621e', role: "listitem", class: {
+        return (h("div", { key: '7c7b69217ccc0410e4d2a3b33b241e0657a502d3', role: "listitem", class: {
                 "duet-notification": true,
                 "duet-notification-highlight": this.highlight,
                 "duet-theme-turva": this.theme === "turva",
-            } }, h("a", { key: 'd6f5d0be1b541438401decc771bc08a479bd8c2a', ref: element => (this.linkElement = element), href: this.url, target: this.external ? "_blank" : "_self" }, h("div", { key: 'f307a1aa045d07340852369a172d693e6f43cb7d', class: "duet-notification-container" }, h("div", { key: 'a06f1c5ee9ab33826b104403a91b1ed2697f14ce', class: "duet-notification-badge-container" }, this.highlight && (h("div", { key: 'b701ca3d7ab5b4156f79462881fea1c385ad781f', class: "duet-notification-badge" }, h("duet-visually-hidden", { key: 'd6b2303c79e50024cdeb903950c459f20cf312cd' }, this.accessibleLabelUnread, ":")))), h("div", { key: 'aebc83aece0fc83be95be876ad19edbce1fd7b70', class: "duet-notification-content" }, h("slot", { key: 'f26fa683fe898a8e53777d22757a2abef19d8b73' })), h("div", { key: '41600a1ef9c5ad18732f5f1de14a2904b8591fe2', class: "duet-notification-date" }, this.date)))));
+            } }, h("a", { key: 'cdf2aa9efddcb0471a0a967feb2534a3c37a93c4', ref: element => (this.linkElement = element), href: this.url, target: this.external ? "_blank" : "_self" }, h("div", { key: '668b15b89a94d14dc95f763e71db811832aa8df9', class: "duet-notification-container" }, h("div", { key: 'ed6d05d93c06e30bd35b5d0c8e00ea310b6d20a1', class: "duet-notification-badge-container" }, this.highlight && (h("div", { key: '28834605820009251e38ab8fc51f6cb91161ada6', class: "duet-notification-badge" }, h("duet-visually-hidden", { key: '613ae447d1252abb249ab19e2f08196f86c1a55c' }, this.accessibleLabelUnread, ":")))), h("div", { key: 'dece54d84ef9cb9306bff4932a0373d14fc67bf0', class: "duet-notification-content" }, h("slot", { key: '43d66402c4b87e0bc492e56178fd59b57fb2410e' })), h("div", { key: '04a0d2f31316d13ea68ee2b6de3d26f128c63113', class: "duet-notification-date" }, this.date)))));
     }
     static get is() { return "duet-notification"; }
     static get encapsulation() { return "shadow"; }

package/lib/collection/components/duet-page-heading/duet-page-heading.js

@@ -24,12 +24,12 @@ export class DuetPageHeading {
      */
     render() {
         const layout = this.layout === "narrow" ? "narrow" : this.layout === "fluid" ? "fluid" : "auto";
-        return (h("div", { key: '9f8446416ddfb863e8b7675694a941c8a5a08810', class: {
+        return (h("div", { key: '29388dc76adf582ffc0c740e5aa5de47acd172d8', class: {
                 "duet-page-heading": true,
                 "duet-theme-turva": this.theme === "turva",
                 "has-icon": !!this.icon,
                 [layout]: true,
-            } }, h("div", { key: 'd2c79bf4b43476d774997990f9ff2eb10bd5c5eb', class: "background" }, this.theme === "turva" && h("div", { key: '5f2cd53a57c83e72eea3cd6c8e05440282de604d', class: "background-mask" }), this.theme !== "turva" && h("div", { key: '5d076b45bd423d3ac5c829fb75e02310fc2de935', class: "brand-shape" }), this.theme !== "turva" && h("div", { key: '95f49a37ec75c6aeb261291ab21bcbf78c182d51', class: "brand-shape second-shape" }), this.icon && (h("div", { key: 'd7d88d2a72ea954d7b60a657e04df7af66e47f0f', class: "brand-shaped-icon" }, h("duet-icon", { key: '1b7e9dfb264e9d9442b5b4aa76fc86868586290c', background: "none", name: this.icon, margin: "none", size: "auto", responsive: false })))), h("div", { key: 'acca7abdb93a35bea48f112af238f61993dd1b1c', class: "heading" }, h("slot", { key: 'd236024e713e2924eabcd18e18260b348cd4dc53', name: "heading" }))));
+            } }, h("div", { key: '4e801223af0de7ca3a5769be9bc301780456c355', class: "background" }, this.theme === "turva" && h("div", { key: '50806ffa6f4c5bb7fabce5e9e905666f892e4918', class: "background-mask" }), this.theme !== "turva" && h("div", { key: '0e8a41703460f97a1450564687d16ba5efabcb77', class: "brand-shape" }), this.theme !== "turva" && h("div", { key: '8ffbcc8fb0c4aa7b3caa062053cd880375ae12fb', class: "brand-shape second-shape" }), this.icon && (h("div", { key: '8014cb4af987c4cc71a0443bdafdca54f9536be5', class: "brand-shaped-icon" }, h("duet-icon", { key: '829eaf116a734165393a70782266df6d0ab85484', background: "none", name: this.icon, margin: "none", size: "auto", responsive: false })))), h("div", { key: '23c3d146c237f9929b71fe2c22f36b77b6afab6f', class: "heading" }, h("slot", { key: '325ae5ac88d1a6e66fd3bad80b101703bbf69175', name: "heading" }))));
     }
     static get is() { return "duet-page-heading"; }
     static get encapsulation() { return "shadow"; }

package/lib/collection/components/duet-promo-card/duet-promo-card.js

@@ -53,12 +53,12 @@ export class DuetPromoCard {
             backgroundColor: backgroundColor ? backgroundColor : "none",
         };
         const TagName = this.url ? "a" : "div";
-        return (h(Host, { key: 'c4abd3dcbfce62f8d79b4948d6877b88035b799d', class: { "duet-m-0": this.margin === "none" } }, h("aside", { key: '0a0cb04c17ed4fb89fb540be922681b117385e58', class: {
+        return (h(Host, { key: '15e241ca4500fba19ae5c931200d929f7c26feab', class: { "duet-m-0": this.margin === "none" } }, h("aside", { key: '762dec6d01cff5f5850f16176f306ac1cbf2f4d2', class: {
                 "duet-promo-card": true,
                 "duet-theme-turva": this.theme === "turva",
                 "no-bg-color": !this.backgroundColor,
                 "duet-promo-card-link": !!this.url,
-            }, style: bannerStyles }, h(TagName, { key: '103edb4446ea96b3fafcf007f4dd5426d76a3bf8', href: this.url, class: "content-wrapper", ref: element => (this.aOrDivElement = element) }, h("img", { key: 'cad7f76340247352ca42807969ba24731378fab4', class: "image", src: this.image, alt: "", role: "presentation" }), h("div", { key: 'f388d58abec244fffea258a4a347213c55a110ba', class: "content" }, this.hasPreHeadingSlot && (h("div", { key: 'ee1e4ca580ec8d513309964e6df6baba25ed23d7', class: "pre-heading" }, h("slot", { key: '861cb83e332ce81f0b60f2936f21c08011cd3a2c', name: "pre-heading" }))), this.hasHeadingSlot && (h("div", { key: '728983cfce0b1c8f845a8003d89567a07ed19403', class: "heading" }, h("duet-heading", { key: '9939b4871591c4e9d0beabffc3b6ff7461760103', theme: this.theme, level: this.headingLevel, "visual-level": "h3", margin: "none", color: this.textColor }, h("span", { key: 'db91646994b5b78998e63025cbdf05555a9ca4ba' }, h("slot", { key: 'c34869098de09a738c6c0c58e9a2c3c0c87d9aae', name: "heading" }))))), this.hasDescriptionSlot && (h("div", { key: 'e4ffd1e72292e51750c1ce63c43a7c8cb7886258', class: "description" }, h("duet-paragraph", { key: 'b945d624bea9304f8b106d71f87e9bf002603b84', theme: this.theme, margin: "none", color: this.textColor }, h("span", { key: '683854299aa779f9482ecb786f9a51be703076b4' }, h("slot", { key: '517f9561d2283fca8f78441392e2f5ad16b9c4a5', name: "description" }))))), this.hasActionSlot && (h("div", { key: 'f7eb0d7f9dd83178e0ca0e05bb9cc7a8b719e102', class: "action" }, h("slot", { key: 'faee8e1a520ff2b41717d43a356dfb0659391506', name: "action" }))))))));
+            }, style: bannerStyles }, h(TagName, { key: '76e2710c25b70b7310756f47d072e762e88bc247', href: this.url, class: "content-wrapper", ref: element => (this.aOrDivElement = element) }, h("img", { key: '699f6cf997f4a59c46fe2ede3a6b4ae74cab3ab6', class: "image", src: this.image, alt: "", role: "presentation" }), h("div", { key: 'bfa918f0068b2aec0496cfd9a681b8ff89ddbc4f', class: "content" }, this.hasPreHeadingSlot && (h("div", { key: '4a5504dac64db3f856e37425b2af6bc88c82cf2c', class: "pre-heading" }, h("slot", { key: 'f83e1dd97784f9544dcf8bc638d91da52e1552f5', name: "pre-heading" }))), this.hasHeadingSlot && (h("div", { key: '5588c3bf5dfb560a7b778a6bd644b67853b7d52f', class: "heading" }, h("duet-heading", { key: 'f5940bc4f214466b485a1836683e1aeead0e87c7', theme: this.theme, level: this.headingLevel, "visual-level": "h3", margin: "none", color: this.textColor }, h("span", { key: '23f5ffc9111c2a40cacbb9b7c5b6bda3dd142b23' }, h("slot", { key: '2b5c24d08332aa20d04287b5694e9bc03b183481', name: "heading" }))))), this.hasDescriptionSlot && (h("div", { key: 'e076b2091a72aa687e188f96e26260d92a7c348e', class: "description" }, h("duet-paragraph", { key: 'bbf71a9b26b3e84c028b53680c024fd3dd644761', theme: this.theme, margin: "none", color: this.textColor }, h("span", { key: '73f2a19b25f92101b65d3c2a81becdb2d03c13ff' }, h("slot", { key: 'a7da789756ddc98fec9cdc3dcd988a7d9b8ddcc4', name: "description" }))))), this.hasActionSlot && (h("div", { key: '02e40e9d53bb5d954455a63340af25b95e5c2e03', class: "action" }, h("slot", { key: '5db34d5353f04f26a5934c35f8a21dfbb7d753ed', name: "action" }))))))));
     }
     static get is() { return "duet-promo-card"; }
     static get encapsulation() { return "shadow"; }

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

@@ -200,21 +200,21 @@ export class DuetScrollable {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: '3b54a0e0a539b3669e6b960b63d4db530828a6d3', class: {
+        return (h(Host, { key: 'e45f073935f1dc5ed9c7a7cfe10bf0c5f10bc02b', class: {
                 "duet-theme-turva": this.theme === "turva",
                 "duet-theme-default": this.theme === "default",
-            } }, this.hasCollapseButtonLabelSlot && (h("div", { key: 'c99af39d9c1b2c6ddd640a5517c9aba227b374d0', class: {
+            } }, this.hasCollapseButtonLabelSlot && (h("div", { key: '59991362841374b6289f057ed20af29deddd9a5c', class: {
                 collapse: true,
                 hide: !this.needsScrolling && !this.collapsed,
-            } }, h("duet-button", { key: '232d85eeb640f814572de158f1a54643a0c4e728', variation: "plain", margin: "none", "center-text": true, onClick: () => this.collapsedOnClick() }, h("slot", { key: 'd1797003948509cbc143a4b0dfea35972007e5ad', name: "collapse-button-label" })))), h("div", { key: '0f5f7e114c90cb2dedeaefc7d14cb2d53f4dab3f', class: {
+            } }, h("duet-button", { key: '0364196174423e4e415838c766406ad5cee801f4', variation: "plain", margin: "none", "center-text": true, onClick: () => this.collapsedOnClick() }, h("slot", { key: '26fc22d06a9f9309531f2eb95f33197c24b461aa', name: "collapse-button-label" })))), h("div", { key: '0675d0c8473a5da30b830dc02a16dab57e24c717', class: {
                 "duet-scrollable-items": true,
                 buttons: this.buttons,
                 center: this.center,
-            } }, this.buttons && this.renderButton("left"), this.renderFadeOverlay("left"), h("div", { key: '1af5b1b3ec4fa3e357540d6660f7f820a8c78a87', class: {
+            } }, this.buttons && this.renderButton("left"), this.renderFadeOverlay("left"), h("div", { key: 'e173cea4d9d7885e100240341d74bf154a7e92a9', class: {
                 "duet-scrollable-list": true,
                 collapsed: this.collapsed,
                 [`duet-overflow-padding--${this.padding}`]: this.padding !== "none",
-            }, onScroll: () => this.updateScrollButtons(), ref: element => (this.scrollPaneElement = element) }, h("slot", { key: '1865d32a0479ba27dbd8afcdc7e9397f5d649600' })), this.renderFadeOverlay("right"), this.buttons && this.renderButton("right"))));
+            }, onScroll: () => this.updateScrollButtons(), ref: element => (this.scrollPaneElement = element) }, h("slot", { key: '11baceae175809b6f60d8c16ef5a33bd72db7793' })), this.renderFadeOverlay("right"), this.buttons && this.renderButton("right"))));
     }
     static get is() { return "duet-scrollable"; }
     static get encapsulation() { return "shadow"; }

package/lib/collection/components/duet-section-layout/duet-section-layout.css

@@ -54,7 +54,6 @@
   position: relative;
   padding: 0 16px;
   margin: 48px auto 36px;
-  overflow-x: clip;
 }
 @media (max-width: 20.5em) {
   .duet-layout.padding-xxx-small {

package/lib/collection/components/duet-section-layout/duet-section-layout.js

@@ -14,14 +14,14 @@ export class DuetSectionLayout {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: '0513022fd72635b7a29f28bd2d4c499efab5924f', class: {
+        return (h(Host, { key: '6ba318c87d1857d74fcd7668a442061cb3582e40', class: {
                 "duet-middle": this.middle,
                 "duet-ie": isInternetExplorer(),
-            } }, h("div", { key: 'f63b99c09e8b7d188e7dee578d6ed7f6f9b3a274', class: {
+            } }, h("div", { key: 'a21b547f2d8b9b38db4208e86f6d462a643e8fb3', class: {
                 "duet-layout": true,
                 "duet-m-0": this.margin === "none",
                 [`padding-${this.paddingBreakpoint}`]: !!this.paddingBreakpoint,
-            } }, h("section", { key: 'fc795216eaedfd65b6e2638a2735c8555b20400a', class: "duet-main" }, h("slot", { key: '852e1dc28d14c80a9127b0ca9004a5cba7098c76' })))));
+            } }, h("section", { key: '542b565867aec7ff0736c6847e3e1760375daf5c', class: "duet-main" }, h("slot", { key: 'bf878319707f25d3305e61ce8a3d9b4061b18d4f' })))));
     }
     static get is() { return "duet-section-layout"; }
     static get encapsulation() { return "shadow"; }

package/lib/collection/components/duet-shaped-image/duet-shaped-image.js

@@ -25,9 +25,9 @@ export class DuetShapedImage {
         const style = {
             "--rotation": `${this.rotation}deg`,
         };
-        return (h(Host, { key: '9a388c03cd8794d8a5c78322b756eceb14f9f0b7', class: { "duet-theme-turva": this.theme === "turva", "duet-m-0": this.margin === "none" } }, h("span", { key: 'd46a7b16b69201e05928ea5515b99c76fccb659e', class: {
+        return (h(Host, { key: 'a8c6768d6fd86592319c1ad2e5223a59a2be138f', class: { "duet-theme-turva": this.theme === "turva", "duet-m-0": this.margin === "none" } }, h("span", { key: '18ecd687fd2a3d951a8910cca4a90aa73d239243', class: {
                 "shaped-image": true,
-            }, role: "img", "aria-label": this.accessibleLabel, style: style }, h("span", { key: '500823451da6d3ccb92c830a281871c73a1c1a6a', class: "shaped-image-mask", role: "presentation" }, h("span", { key: 'b6a32e8b7ed72ff300b8f6a1b8f0ac9c3fe7507b', class: "shaped-image-img", role: "presentation", style: { backgroundImage: `url("${this.src}")` } })))));
+            }, role: "img", "aria-label": this.accessibleLabel, style: style }, h("span", { key: 'ede5d048662220a9ef915ff561823aef9f14f0e4', class: "shaped-image-mask", role: "presentation" }, h("span", { key: 'abb799417eb975033305e86b49a7c94d2e295465', class: "shaped-image-img", role: "presentation", style: { backgroundImage: `url("${this.src}")` } })))));
     }
     static get is() { return "duet-shaped-image"; }
     static get encapsulation() { return "shadow"; }

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

@@ -35,7 +35,7 @@ export class DuetSlideoutLang {
      */
     render() {
         const langTranslation = getLocaleString(this.chooseLangObject);
-        return (h(Host, { key: '1ffa97535d84470e1212e2edd8e7c5b9f67c2116' }, h("div", { key: '10d65fcbf9c3000eb34125021d51af4efbf4eba0', class: "duet-slideout-lang", role: "group", "aria-label": langTranslation }, h("duet-icon", { key: '737d762ca01b63971b9d61c3e5ca67f8d92cd94c', name: "navigation-language", margin: "none", color: "secondary" }), h("slot", { key: '9964f1c2b7baf17d4aad489c6d508fdd24703e80' }))));
+        return (h(Host, { key: 'b832cca7ed377a76ec8d9143183c7372e350d638' }, h("div", { key: 'efc13c835605f4db9b0aa5834b2228fb89978acc', class: "duet-slideout-lang", role: "group", "aria-label": langTranslation }, h("duet-icon", { key: 'a4e0267ea4b034d2efd5829caf0e63e320a84f75', name: "navigation-language", margin: "none", color: "secondary" }), h("slot", { key: '9aeec3a4b303eba1e710eb507f9de2a6ad0b6cb3' }))));
     }
     static get is() { return "duet-slideout-lang"; }
     static get encapsulation() { return "shadow"; }

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

@@ -26,12 +26,12 @@ export class DuetSlideoutLink {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: '267e75e5afb886c43533da89f39a6937447a5bc1' }, h("a", { key: 'ab6062843ce76d39f9408dee693d37834bb8041b', class: {
+        return (h(Host, { key: 'a28cb226d2a99a20bb467c357756e2c18cbb89e9' }, h("a", { key: 'a0ff0473ac78ec679ca5aeb7812e93730340225e', class: {
                 "duet-slideout-link": true,
                 "duet-theme-turva": this.theme === "turva",
                 active: this.active,
                 [this.size]: true,
-            }, href: this.href, "aria-current": this.active ? "true" : "false", lang: this.targetLanguage, hreflang: this.targetLanguage, "aria-label": this.accessibleLabel }, this.icon && (h("duet-icon", { key: 'cf170dcab30ff6147ec97cfea8cf80ae91a07e52', name: this.icon, color: "secondary", size: this.menuItem ? "x-small" : "medium", margin: "none" })), h("div", { key: 'e3bfb77a0f8b3661936ab9578d27229be577b3a1', class: "label" }, h("span", { key: '2dbb1c5eab8c0bd7893987effe7f830a74c11579' }, h("slot", { key: '67daf8ce8bed028f853bf5a8999aa0ffc6ae88fd' }), h("slot", { key: 'c62fd4e6ae9d31b1f2391485d77d9e4a0dc09b7f', name: "description" })), this.caret && (h("duet-icon", { key: '822173dad75ff048010488b1c28494bd89152ec5', name: "action-arrow-right", color: "secondary", size: "x-small", margin: "none" }))))));
+            }, href: this.href, "aria-current": this.active ? "true" : "false", lang: this.targetLanguage, hreflang: this.targetLanguage, "aria-label": this.accessibleLabel }, this.icon && (h("duet-icon", { key: '5f15da3846d0e66ee2fba545d3007455ba5d569a', name: this.icon, color: "secondary", size: this.menuItem ? "x-small" : "medium", margin: "none" })), h("div", { key: '12f98f82b672d208352a8655682af03b203f1f40', class: "label" }, h("span", { key: '9c91eb6ede7be21f17ed1587e1ff5051bd670ab3' }, h("slot", { key: '29819c368acb2787ac703e21675a98d243c07285' }), h("slot", { key: '80397b73456e7963d4c276ca69cd07c9d85f814f', name: "description" })), this.caret && (h("duet-icon", { key: '55ce9fab82642277d1246130397dc0c5c7248ed6', name: "action-arrow-right", color: "secondary", size: "x-small", margin: "none" }))))));
     }
     static get is() { return "duet-slideout-link"; }
     static get encapsulation() { return "shadow"; }

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

@@ -158,21 +158,21 @@ export class DuetSlideoutPanel {
         };
         const exitTranslation = getLocaleString(this.exitLangObject);
         const backTranslation = getLocaleString(this.backLangObject);
-        return (h(Host, { key: '805cfaa182eb761f1ce6217e1c62ed5dd007a947' }, h("div", { key: '363f2f3eaf901468c5f15ad7dcba4d3b781cc500', class: {
+        return (h(Host, { key: 'a5c1eec78534ae8db8761d48b76978ca2ded8e35' }, h("div", { key: 'aa93bb12f4f97f9bbef331eb7cea1e931e65b7cc', class: {
                 "duet-slideout-panel": true,
                 "duet-theme-turva": this.theme === "turva",
                 active: this.open,
-            } }, h("button", { key: '5ec34b3ecd11c56416277f0f4753d6dc1f8efed6', ref: element => (this.openButton = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", "aria-current": this.active ? "true" : "false", id: "button", type: "button", class: {
+            } }, h("button", { key: '5990bb80c52d510fce212b4cc8fad608739f8d42', ref: element => (this.openButton = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", "aria-current": this.active ? "true" : "false", id: "button", type: "button", class: {
                 link: true,
                 active: this.active,
-            }, onClick: this.onClick, inert: this.open }, this.icon && h("duet-icon", { key: '5d6a27c57dc78e388b271f0f2d6eb2cd7821c202', name: this.icon, size: "medium", margin: "none", color: "secondary" }), h("span", { key: 'd64964aca9eea3caa8ae881296e258f08146e487', class: "label" }, h("span", { key: '6b4148f10a5d1b3065758fb5625da769c52f72ec', class: { "label-text": true, [this.labelSize]: true } }, h("slot", { key: '81eb240dd33e6fb12e4a7cca81de48fdcee2af19', name: "label" })), h("duet-icon", { key: '50cc29a5a19817e58bfcf90efa70b59b2fba9fdd', class: "caret", name: "action-arrow-right", margin: "none", size: "x-small", color: "secondary" }))), h("div", { key: '37829b24562f4b2815f7d4ab2affd231e7850d9e', ref: element => (this.dialog = element), class: {
+            }, onClick: this.onClick, inert: this.open }, this.icon && h("duet-icon", { key: 'ea71530dd8a823272b2ea36de72dd21199dd445a', name: this.icon, size: "medium", margin: "none", color: "secondary" }), h("span", { key: '575f875b4d6f064432a97287d9e684cdf9b20669', class: "label" }, h("span", { key: 'bebaf60d3c1fd76a4ec6dccc9323a1bbb9566694', class: { "label-text": true, [this.labelSize]: true } }, h("slot", { key: '5e6ac4f9f3bc0010630a09bf81994e04222501b1', name: "label" })), h("duet-icon", { key: 'e076639dc902c33f9f0c42e53b3b2b752a9157f9', class: "caret", name: "action-arrow-right", margin: "none", size: "x-small", color: "secondary" }))), h("div", { key: 'bf5b0f13572d5d9b9545df036812d02bce2620a1', ref: element => (this.dialog = element), class: {
                 dialog: true,
                 hidden: !this.open,
-            }, style: styles }, h(FocusGuard, { key: '866309235d2682686f46604d200cb8fb7789fd78', moveFocusTo: this.closeButton }), h("div", { key: 'bf2bc641f6c8818f917fb40b13f6b7fe5e6f208f', class: { "top-container": true, "has-sticky-header-slot": this.hasStickyHeaderSlot } }, h("div", { key: '67071ec5db130b7f92587562eec7b5ebac45e1bd', class: "top" }, h("button", { key: '33da125c06f6246cd7b6a388ffa332c32b8fd374', ref: element => (this.closeButton = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", "aria-label": `${backTranslation}`, type: "button", class: {
+            }, style: styles }, h(FocusGuard, { key: '541fecb5051d8b6806c5aa7b50326b1f46eeefe9', moveFocusTo: this.closeButton }), h("div", { key: 'db0146241dce60a5cfc5bd3322639b513a015311', class: { "top-container": true, "has-sticky-header-slot": this.hasStickyHeaderSlot } }, h("div", { key: '905caaacb647cf1c9dc9af4c03b69476653d1138', class: "top" }, h("button", { key: '8ae12cbb18bcf43399b1ea04b24b07d70910edc7', ref: element => (this.closeButton = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", "aria-label": `${backTranslation}`, type: "button", class: {
                 back: true,
-            }, onClick: this.onClick }, h("duet-icon", { key: '24b7d7426f408b7aa4043495bbf6647851f7d162', class: "caret", name: "action-arrow-left", margin: "none", size: "small", color: "secondary" })), h("span", { key: 'cd331fba8d0793d7c2b59d96e9796a50d77b4224' }, this.label.innerHTML), h("button", { key: '62fd9e793ff023422c32a9024a74b9befeb1c056', class: "close", type: "button", onClick: this.onCloseClick, "aria-label": `${exitTranslation}` }, h("duet-icon", { key: 'de1281dc825979a6cb290a8e4faf24e53ed3c49a', name: "navigation-close", size: "small", margin: "none", color: "secondary" }))), h("div", { key: 'c7e160049359ff2cef0e1713fc416b81461a8e44', class: "sticky-header" }, h("slot", { key: '8d216879c47672cc6479b1aa9ba76c3379d5e0ec', name: "sticky-header" }))), h("div", { key: 'b0bd9025bc1021ff7771105fc79e2c2fe4545ddc', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
+            }, onClick: this.onClick }, h("duet-icon", { key: '003116e8f89c352b9df846a570d1e422fac49a57', class: "caret", name: "action-arrow-left", margin: "none", size: "small", color: "secondary" })), h("span", { key: '5005dc1a683188c01552fae3476249deda621e0f' }, this.label.innerHTML), h("button", { key: 'bd452a3c82b967e03c8a0e3d02af9e1c3798597d', class: "close", type: "button", onClick: this.onCloseClick, "aria-label": `${exitTranslation}` }, h("duet-icon", { key: '8ee0d03ef0e79382c30379f32d2d9a1a8d75402d', name: "navigation-close", size: "small", margin: "none", color: "secondary" }))), h("div", { key: 'c3cef830db93ac7895786faa7b9a5d5d54c6e35e', class: "sticky-header" }, h("slot", { key: '198f7584ed3a2694c1669a4378b93ddf7ddfea9d', name: "sticky-header" }))), h("div", { key: '73b1becefc58307429e8cbf003376efda1817526', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
                 items: true,
-            } }, h("slot", { key: 'd48e80a480587c2dd49773b14f31ddd56fe790dc' })), h(FocusGuard, { key: '4dd1a90579416304992efa312c3999f7941d1a65', moveFocusTo: this.closeButton })))));
+            } }, h("slot", { key: '86e3442c8f251c91e30b3c9e279a2080106a3d84' })), h(FocusGuard, { key: '4c88ff3bd62b5183cc5647c1874e10964b14b6be', moveFocusTo: this.closeButton })))));
     }
     static get is() { return "duet-slideout-panel"; }
     static get encapsulation() { return "shadow"; }

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

@@ -40,16 +40,16 @@ export class DuetSlideoutPanelDropdown {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: 'ae396c94bb6581cc91e2757c2c86232728315498' }, h("div", { key: '1fbc63be41621dbe711387dec4c733272b58aae4', class: {
+        return (h(Host, { key: '4dd2ace190b42dc603842e0a68bede86a0576849' }, h("div", { key: '3bcae1d437eb66927c58c9d6394668f7e89b96c0', class: {
                 "duet-slideout-panel-dropdown": true,
                 "duet-theme-turva": this.theme === "turva",
                 active: this.open,
-            } }, h("button", { key: 'd3956f08bb9197d68db47cd8ce31b222a825862e', ref: element => (this.button = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", "aria-current": this.active ? "true" : "false", id: "button", type: "button", class: {
+            } }, h("button", { key: '0dc6a0b34fe49504c0a3d50e2d3bc5b46f0edf47', ref: element => (this.button = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", "aria-current": this.active ? "true" : "false", id: "button", type: "button", class: {
                 active: this.active,
-            }, onClick: this.onClick }, this.icon && h("duet-icon", { key: '36278cab4355f36e54ff0bc873ebc27e49b146c1', name: this.icon, size: "medium", margin: "none", color: "secondary" }), h("span", { key: '5babf16dbd6ae3686423c4ece8779d69819e79e3', class: "label" }, h("slot", { key: '0d3d0f41eaf979d05c21aba744c26ffd043f9d64', name: "label" }), h("duet-icon", { key: 'd6abff8f46d22a4bbd7f4635f53e82a5a1498db1', class: "caret", name: "action-arrow-down-small", margin: "none", size: "xx-small", color: "secondary" }))), h("div", { key: '6ee1b74a69107abab5c9af91a9bd9fe824741d55', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
+            }, onClick: this.onClick }, this.icon && h("duet-icon", { key: '0210db38d3f9ddcfb8d06635554d6d59a655fdf9', name: this.icon, size: "medium", margin: "none", color: "secondary" }), h("span", { key: '4cd6d589071a450df12bad944193b1cb1ad884ce', class: "label" }, h("slot", { key: '9426c6a0c178440bb061f2beab412bc89aaab672', name: "label" }), h("duet-icon", { key: '1e1c91b9e194bc0e96b46659e469447ea8a189f2', class: "caret", name: "action-arrow-down-small", margin: "none", size: "xx-small", color: "secondary" }))), h("div", { key: '05ac5933fa4af767dd52ac778b7a95a9fdf30a1c', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
                 items: true,
                 hidden: !this.open,
-            } }, h("slot", { key: '8bc5889a6505974a8929651a8abd6b4fd98e5f74' })))));
+            } }, h("slot", { key: '5d9e9507bb4d8ec3ce3dcc4101b9a1ff432af55a' })))));
     }
     static get is() { return "duet-slideout-panel-dropdown"; }
     static get encapsulation() { return "shadow"; }

package/lib/collection/components/duet-submenu-bar/duet-submenu-bar.js

@@ -122,19 +122,19 @@ export class DuetSubmenuBar {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: 'd23feaeb59a6a54db129042cc984d77237de92c4' }, h("nav", { key: 'c1a5e23bf7598285828acc0df6ba04d10777d816', class: {
+        return (h(Host, { key: '46b42aaf1cf7b5948285be8b8fada1fbb895c29c' }, h("nav", { key: '24fb21f0c3223068128475fee9e711c407c6cc42', class: {
                 "duet-submenu-bar": true,
                 "duet-theme-turva": this.theme === "turva",
                 hidden: this.hidden,
-            }, "aria-label": this.accessibleLabel }, this.hasItems && (h("button", { key: '37bef492a5c920f7c63f33cef8496079b25151dd', ref: element => (this.button = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", id: "button", type: "button", class: {
+            }, "aria-label": this.accessibleLabel }, this.hasItems && (h("button", { key: 'fdae5917434838629bea146c0fecd71d6eba5a49', ref: element => (this.button = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", id: "button", type: "button", class: {
                 active: this.open,
-            }, onClick: this.onClick }, h("span", { key: '3627d9e5b49dca1946bbcea8b30139afa373da36', class: "label" }, h("slot", { key: 'e129c5ce82224625f3bec58dec0c20085664b4c8', name: "label" }), h("duet-icon", { key: 'acf4f3367afe06a7068b3120bf8f12951b2a8845', theme: this.theme, class: "caret", name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" })))), h("div", { key: '882629e17e25bbddaa56c909a298d69d534abe08', class: {
+            }, onClick: this.onClick }, h("span", { key: '741ee52c89789d6f29807af0318e7ad3ce387ea2', class: "label" }, h("slot", { key: 'cc032638072e4bf611fa6f90f4e87a06d6d62011', name: "label" }), h("duet-icon", { key: 'e5d275e6378ca608e4770cf01548db63c53fc921', theme: this.theme, class: "caret", name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" })))), h("div", { key: '4b3528bc077697f379eee779e85cbd8a0ddb407e', class: {
                 "menu-container": true,
                 hidden: !this.open,
-            }, role: "presentation" }, h("div", { key: 'f06adcfe1330258fdf9395766e0e6a2a44bb1540', role: this.mobile ? "menu" : null, id: "menu", "aria-labelledby": this.mobile ? "button" : null, "aria-expanded": this.mobile ? (this.open ? "true" : "false") : null, class: {
+            }, role: "presentation" }, h("div", { key: '22d201c917df952f74c4ce0f28786cfca78c6e5c', role: this.mobile ? "menu" : null, id: "menu", "aria-labelledby": this.mobile ? "button" : null, "aria-expanded": this.mobile ? (this.open ? "true" : "false") : null, class: {
                 items: true,
                 hidden: !this.open,
-            }, ref: element => (this.itemsContainer = element) }, h("div", { key: 'c0b7893f4beafab4ea530f6c7a0723988bd986c8', class: "list", role: this.mobile ? "presentation" : "list" }, h("slot", { key: '81800724eb1fdc99ebf058a192746cd64ff5f2f4' }), h("div", { key: '33615812b5ac6e839c6487696a1a3bc31f620744', class: "list-padding" }))), h("duet-overlay", { key: '09b4069d8369250684e4a51c085d0b804f57ad29', "keep-stacking-context": true, visible: this.open, "display-device": "not-large", transition: "immediate" })))));
+            }, ref: element => (this.itemsContainer = element) }, h("div", { key: 'c602c78831309546c9e825b1b7b77fc92dc3f0fa', class: "list", role: this.mobile ? "presentation" : "list" }, h("slot", { key: '0a329fa6a2e485a50588f108544dfe414480a3b6' }), h("div", { key: 'cbe81c72e9210a0384d82a5a827a54edf890f020', class: "list-padding" }))), h("duet-overlay", { key: 'e802c1912aa5dc34d0dbf0e265190fc7ba27a1d3', "keep-stacking-context": true, visible: this.open, "display-device": "not-large", transition: "immediate" })))));
     }
     static get is() { return "duet-submenu-bar"; }
     static get encapsulation() { return "shadow"; }

package/lib/collection/components/duet-submenu-bar-dropdown/duet-submenu-bar-dropdown.js

@@ -96,18 +96,18 @@ export class DuetSubmenuBarDropdown {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: 'ced56417d146eb3149884a6acf9d2f0c2a63441f', role: "listitem" }, h("div", { key: '166bb208b5185668b66feb8dbd14e7afb38bb649', class: {
+        return (h(Host, { key: '361b820b8f227befb95bc64b87c761c2d0396a4f', role: "listitem" }, h("div", { key: '53210cb90b3d5e714d1d8e30cca928b9ca22e416', class: {
                 "duet-submenu-bar-dropdown": true,
                 "duet-theme-turva": this.theme === "turva",
                 open: this.open,
                 active: this.active,
-            } }, h("button", { key: 'de45f25e558d837a8325f7f33a4f30e3c1071902', ref: element => (this.button = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", "aria-current": this.active ? "true" : "false", id: "button", type: "button", class: {
+            } }, h("button", { key: '2df474dfe088be14b042114456474c876f4b61a0', ref: element => (this.button = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", "aria-current": this.active ? "true" : "false", id: "button", type: "button", class: {
                 open: this.open,
                 active: this.active,
-            }, onClick: this.onClick, onKeyUp: e => this.handleEscape(e) }, this.icon && (h("duet-icon", { key: '8308454f3cc3c2771afaad1632f2eeb812ad8e84', class: "submenu-bar-dropdown-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), h("div", { key: 'f34879f5749b92e79c2e16ac83261526f958d6a1', class: "label" }, h("span", { key: 'f8be24eef6e5e42e40b1e05fa1a6c391670849a7', class: "label-text" }, h("slot", { key: 'a5e526a73c39672ab1c5cd81f58cb6c362b249eb', name: "label" })), h("duet-icon", { key: '160ce4e95b62545c0432587ee7510bb74607697e', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), h("div", { key: 'eb0c9fbe5a4001f406eaa529a7909f148100e8de', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
+            }, onClick: this.onClick, onKeyUp: e => this.handleEscape(e) }, this.icon && (h("duet-icon", { key: '89d102ebae36a02c887f3824fffaa4271590d92a', class: "submenu-bar-dropdown-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), h("div", { key: '31866b710f3df48bfb0aa0dcff165e617e8cc327', class: "label" }, h("span", { key: '193d3e662d773b7ce3bc8e67265469fb254d8f1f', class: "label-text" }, h("slot", { key: 'a1c2a3a7d385a99ad697244ea8ff303bc9f62d34', name: "label" })), h("duet-icon", { key: '7190348fc2dd0ea59e407be5b60de9476a349594', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), h("div", { key: 'c0cad51034312dcdb9ff9ca435f9091ae9ecfc55', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
                 items: true,
                 hidden: !this.open,
-            } }, h("slot", { key: '9648718ea62884b361f4cf695b8bc08fcaf42434' })))));
+            } }, h("slot", { key: 'e53f34efca52841432dd37b703f1ffdaa68eb940' })))));
     }
     static get is() { return "duet-submenu-bar-dropdown"; }
     static get encapsulation() { return "shadow"; }

package/lib/collection/components/duet-submenu-bar-dropdown-link/duet-submenu-bar-dropdown-link.js

@@ -31,12 +31,12 @@ export class DuetSubmenuBarDropdownLink {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: 'becb2a65396836f75dd2107bbca7b490a721ec9f' }, h("a", { key: 'd5e322c29ea914b48d57fad90136d18fe17229ac', class: {
+        return (h(Host, { key: '64c7a859f5b865bc0308445b9d0156156837fe49' }, h("a", { key: 'c44943bce8c5a15f3ede97c010eff57f7f7941c7', class: {
                 "duet-submenu-bar-dropdown-link": true,
                 "duet-theme-turva": this.theme === "turva",
                 highlight: this.highlight,
                 active: this.active,
-            }, "aria-current": this.active ? "true" : "false", href: this.href, onKeyUp: e => this.handleEscape(e) }, this.icon && h("duet-icon", { key: '6172f90356d35fba7e533fb632c212b400244666', name: this.icon, size: "x-small", margin: "none", color: "currentColor" }), h("span", { key: '4612a1f95f7d0d41b37d856ac49f8455fb4bca40', class: "label-container" }, h("span", { key: '44b1a2a55750d0eff61f8057f8730a2ef2167131', class: "label" }, h("slot", { key: '1c1bbf56491ce130a990833ad158ce64dfb55c04' })), this.caret && h("duet-icon", { key: 'b1a63e742eadf1244fcd90b98a9df90f37e87fee', name: "action-arrow-right-small", size: "xxx-small", margin: "none" })), this.active && (h("duet-icon", { key: '22ae20117fc0318b97289382cfc6727b101058c1', class: "active-check", name: "messaging-checked-small", size: "xx-small", margin: "none", color: "currentColor" })))));
+            }, "aria-current": this.active ? "true" : "false", href: this.href, onKeyUp: e => this.handleEscape(e) }, this.icon && h("duet-icon", { key: '83939de1b509ebcfc60714398b51dcaf374d6b30', name: this.icon, size: "x-small", margin: "none", color: "currentColor" }), h("span", { key: 'ce3588496af8ffac960897c667027edd97ae5e65', class: "label-container" }, h("span", { key: '752537ca0a31718f20089bb9804ba19b20c0c443', class: "label" }, h("slot", { key: '16331721c331936cb46311d02038526b00b7bcac' })), this.caret && h("duet-icon", { key: 'ac8613eceb672049fc7d6c05c51e2216d93b61df', name: "action-arrow-right-small", size: "xxx-small", margin: "none" })), this.active && (h("duet-icon", { key: 'f18ca26aca59468eac301dd11a1f13a0c77aaa31', class: "active-check", name: "messaging-checked-small", size: "xx-small", margin: "none", color: "currentColor" })))));
     }
     static get is() { return "duet-submenu-bar-dropdown-link"; }
     static get encapsulation() { return "shadow"; }

package/lib/collection/components/duet-submenu-bar-item/duet-submenu-bar-item.js

@@ -41,7 +41,7 @@ export class DuetSubmenuBarItem {
     render() {
         const TagName = this.url ? "a" : "button";
         const role = this.url ? "link" : "button";
-        return (h(Host, { key: '003b6e77d31a2b55fcfbb5c07708a96e7a687224', role: "listitem" }, h(TagName, { key: '65bb3b4ae0bc56ffa9425e410026685f09f4cff3', ref: element => (this.itemElement = element), class: { "duet-submenu-bar-item": true, "duet-theme-turva": this.theme === "turva", active: this.active }, href: this.url, onKeyUp: e => this.handleEscape(e), "aria-current": this.active ? "true" : "false", "aria-label": this.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined, role: role }, this.leadingIcon && (h("duet-icon", { key: '75babe76dbd89f0a7fe44760ea40c2d318132163', class: "leading-icon", theme: this.theme, name: this.leadingIcon, size: "auto", margin: "none", color: "currentColor" })), h("div", { key: 'f7d6d855c464595ce3ed2e3682b0b469e8d9f0ba', class: "label" }, h("span", { key: '3cfdea86b60ad0e7584374489ae068fabd9b5480', class: "label-text" }, h("slot", { key: '9703e9c022f42456bb4f3237343a256116815731' })), this.trailingIcon && (h("duet-icon", { key: '4da2be3263bfda5b511034edeef0e9308302f7d1', class: {
+        return (h(Host, { key: '0e1724544b134f6de86d56dd739a9635f337e717', role: "listitem" }, h(TagName, { key: '6f04e57ea3e9bf27a1967283e2375a281d675529', ref: element => (this.itemElement = element), class: { "duet-submenu-bar-item": true, "duet-theme-turva": this.theme === "turva", active: this.active }, href: this.url, onKeyUp: e => this.handleEscape(e), "aria-current": this.active ? "true" : "false", "aria-label": this.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined, role: role }, this.leadingIcon && (h("duet-icon", { key: 'e1b98f949d70182538731d1d7f07bd961fd79836', class: "leading-icon", theme: this.theme, name: this.leadingIcon, size: "auto", margin: "none", color: "currentColor" })), h("div", { key: 'af220f398f6bdc969c4de91c5bdf03cb814631f0', class: "label" }, h("span", { key: '6b376bcca90ac606bd44f4dc04026d8eda710004', class: "label-text" }, h("slot", { key: 'cec40ee0c2ca47ee02e3b0ede33d41d8a0e6d797' })), this.trailingIcon && (h("duet-icon", { key: '243fd913a9c6d73489e2d1bcfa60566fa72bfcf6', class: {
                 "trailing-icon": true,
                 "trailing-icon-arrow": this.trailingIcon === "action-arrow-down-small",
                 rotate: this.trailingIcon === "action-arrow-down-small" && this.accessibleExpanded,

package/lib/collection/components/duet-submenu-bar-link/duet-submenu-bar-link.js

@@ -29,7 +29,7 @@ export class DuetSubmenuBarLink {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: 'c48d47c5e033d5ca70c1d1c80bac45c29f348341', role: "listitem" }, h("a", { key: '8ed842cbabe3a496e0f5736573a9981a74ce8257', class: { "duet-submenu-bar-link": true, "duet-theme-turva": this.theme === "turva", active: this.active }, href: this.href, onKeyUp: e => this.handleEscape(e), "aria-current": this.active ? "true" : "false" }, this.icon && (h("duet-icon", { key: '3a930062f0a0a0f79b178cedaf990f8b74112603', class: "submenu-bar-link-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), h("span", { key: '8e9b0e67db2502fdc4616342944576a648002b70', class: "label" }, h("slot", { key: '0c5445ad8aa0dee1c593548e14c91ae7a467d1ee' })))));
+        return (h(Host, { key: 'ab3dd8345454b3f0c20458f6302dffaaee6cc002', role: "listitem" }, h("a", { key: 'bcc31509ceddcef3f2c3c58e29c5b108eb8b432f', class: { "duet-submenu-bar-link": true, "duet-theme-turva": this.theme === "turva", active: this.active }, href: this.href, onKeyUp: e => this.handleEscape(e), "aria-current": this.active ? "true" : "false" }, this.icon && (h("duet-icon", { key: 'f5d87725bdb14e435d6d4b04ef0c84b1de5d1a3e', class: "submenu-bar-link-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), h("span", { key: 'f24d079552fa8ce924d8dd3125afe01bbd331ab5', class: "label" }, h("slot", { key: '669772430086a3f897f68ab40b5703a75e631f3a' })))));
     }
     static get is() { return "duet-submenu-bar-link"; }
     static get encapsulation() { return "shadow"; }

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

@@ -113,7 +113,7 @@ export class DuetTable {
         });
     }
     render() {
-        return (h(Host, { key: 'ae58f00a875348e1bfe6a6c15baa15ec447ceb56', class: {
+        return (h(Host, { key: '0ba86b55e9fd8e291fc94aad48b312107970d243', class: {
                 [`duet-table-${this.variation}`]: true,
                 "duet-table-flattened": !this.matchesBreakpoint,
                 // sticky only valid when in regular table layout
@@ -122,7 +122,7 @@ export class DuetTable {
                 "duet-m-0": this.margin === "none",
                 "duet-theme-turva": this.theme === "turva",
                 "duet-table-hide-head-visually": this.hideHeadVisually,
-            } }, h("slot", { key: '4bcaeb88b3f25d2bf172207b2d0dc4b0187830e6' })));
+            } }, h("slot", { key: '886e2b664a351ba71a333ee8c256ed02465b0114' })));
     }
     static get is() { return "duet-table"; }
     static get originalStyleUrls() {

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

@@ -1,7 +1,7 @@
 /*!
  * Built with Duet Design System
  */
-import { Build, h, Host, } from "@stencil/core";
+import { h, Host, } from "@stencil/core";
 import { inheritGlobalTheme } from "../../common";
 import { createID } from "../../utils/create-id";
 import { cleanValue } from "../../utils/input-utils";
@@ -162,26 +162,23 @@ export class DuetTextarea {
      * Always the last one in the class.
      */
     render() {
-        if (Build.isServer) {
-            return;
-        }
         const identifier = this.identifier || this.textareaId;
-        return (h(Host, { class: {
+        return (h(Host, { key: '95fd5e5a71db0cbdbdb4e4f51c031eb38e98eb20', class: {
                 "duet-m-0": this.margin === "none",
                 "duet-has-counter": this.counter && !this.error,
                 "duet-expand": this.expand,
-            } }, h("div", { class: {
+            } }, h("div", { key: '417ef9e56fbc4667adfcddd29e709b86b3c29496', class: {
                 "duet-textarea-container": true,
                 "duet-theme-turva": this.theme === "turva",
                 "duet-label-hidden": this.labelHidden,
                 "duet-input-top-caption-shown": this.isCaptionVisible,
                 "has-error": !!this.error,
-            } }, h("duet-label", { theme: this.theme === "turva" ? "turva" : "default", class: { "duet-has-tooltip": !!this.tooltip }, margin: this.isCaptionVisible ? "small" : "auto", color: this.labelColor, weight: this.labelWeight, id: this.labelId, for: identifier }, this.label), this.tooltip && (h("duet-tooltip", { direction: this.tooltipDirection, accessibleInputLabel: this.label, theme: this.theme === "turva" ? "turva" : "default" }, this.tooltip)), h("slot", { name: "tooltip" }), this.caption && (h("duet-caption", { id: this.topCaptionId, size: "medium", theme: this.theme === "turva" ? "turva" : "default" }, this.caption)), h("div", { class: "duet-textarea-wrapper" }, this.placeholder && this.echoPlaceholder && this.value && (h("duet-caption", { id: this.topCaptionPlaceholderId, class: "duet-textarea-placeholder", size: "small" }, this.placeholder)), h("textarea", { onInput: this.handleInput, onChange: this.handleChange, onBlur: this.handleBlur, onFocus: this.handleFocus, ref: input => (this.nativeInput = input), class: { "duet-textarea": true, disabled: this.disabled }, value: this.value, disabled: this.disabled, "aria-labelledby": this.accessibleLabelledBy ? `${this.labelId} ${this.accessibleLabelledBy}` : this.labelId, "aria-controls": this.accessibleControls, "aria-autocomplete": this.accessibleAutocomplete, "aria-activedescendant": this.accessibleActiveDescendant, "aria-owns": this.accessibleOwns, "aria-describedby": this.getDescribedBy(), "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, placeholder: this.placeholder, spellcheck: "false", required: this.required, minlength: this.minlength, maxlength: this.maxlength, role: this.role, name: this.name, id: identifier })), h("duet-grid", { alignment: "stretch" }, h("duet-grid-item", { margin: "none", fill: true }, h("div", { class: "duet-textarea-help", id: this.errorId, "aria-atomic": "true", "aria-live": this.accessibleLiveError, "aria-relevant": "additions removals" }, this.error && h("span", null, this.error))), h("duet-grid-item", { margin: "none", class: "duet-character-count-caption" }, this.counter && (h(CharacterCount, { theme: this.theme, value: this.value, maxlength: this.maxlength, label: this.counterLabel })))), this.counter && (h("duet-visually-hidden", { class: "duet-visually-hidden", id: this.characterCountId, ref: el => {
+            } }, h("duet-label", { key: 'c970faa68895f7c718c3461ff56b36ba51ca2b39', theme: this.theme === "turva" ? "turva" : "default", class: { "duet-has-tooltip": !!this.tooltip }, margin: this.isCaptionVisible ? "small" : "auto", color: this.labelColor, weight: this.labelWeight, id: this.labelId, for: identifier }, this.label), this.tooltip && (h("duet-tooltip", { key: 'e819a4b2a028a99b64c2065f4c9f6029600d2acb', direction: this.tooltipDirection, accessibleInputLabel: this.label, theme: this.theme === "turva" ? "turva" : "default" }, this.tooltip)), h("slot", { key: '3ec4fdbb3f16f533c56b73d7f9c435345f4ce0ce', name: "tooltip" }), this.caption && (h("duet-caption", { key: 'ac0b106adb6889cb8eb4878fb26f4e8e2dda7188', id: this.topCaptionId, size: "medium", theme: this.theme === "turva" ? "turva" : "default" }, this.caption)), h("div", { key: '7214df64bab9dce0d99d3ff2a96ff2e010d2fb83', class: "duet-textarea-wrapper" }, this.placeholder && this.echoPlaceholder && this.value && (h("duet-caption", { key: 'ff3814fd43da859de1cf2269bf6e2b55cc34fd9c', id: this.topCaptionPlaceholderId, class: "duet-textarea-placeholder", size: "small" }, this.placeholder)), h("textarea", { key: '56f4f30b7d7ee1407aefe788835ada1305f7bcf9', onInput: this.handleInput, onChange: this.handleChange, onBlur: this.handleBlur, onFocus: this.handleFocus, ref: input => (this.nativeInput = input), class: { "duet-textarea": true, disabled: this.disabled }, value: this.value, disabled: this.disabled, "aria-labelledby": this.accessibleLabelledBy ? `${this.labelId} ${this.accessibleLabelledBy}` : this.labelId, "aria-controls": this.accessibleControls, "aria-autocomplete": this.accessibleAutocomplete, "aria-activedescendant": this.accessibleActiveDescendant, "aria-owns": this.accessibleOwns, "aria-describedby": this.getDescribedBy(), "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, placeholder: this.placeholder, spellcheck: "false", required: this.required, minlength: this.minlength, maxlength: this.maxlength, role: this.role, name: this.name, id: identifier })), h("duet-grid", { key: '622cfa8317fe37f645b1180c6ad35f59b8351fa4', alignment: "stretch" }, h("duet-grid-item", { key: '9a1ef5419a5f72b2d23986eef1681b547067c5f4', margin: "none", fill: true }, h("div", { key: 'd7e0dcd97261a2ee0744b19efb5c6f78ab6b2a9f', class: "duet-textarea-help", id: this.errorId, "aria-atomic": "true", "aria-live": this.accessibleLiveError, "aria-relevant": "additions removals" }, this.error && h("span", { key: 'e1673fe8bdc7e4560a701074a103b0ef8f6fd5f8' }, this.error))), h("duet-grid-item", { key: '8be9f6e9ca8afbe0734c4a366d4a7c43fdc01cdb', margin: "none", class: "duet-character-count-caption" }, this.counter && (h(CharacterCount, { key: '853baf2df8a6816d1af92476a4af383e5d656ea2', theme: this.theme, value: this.value, maxlength: this.maxlength, label: this.counterLabel })))), this.counter && (h("duet-visually-hidden", { key: '9f13bfdda388bd779ebad2bcbd33058f3242f79c', class: "duet-visually-hidden", id: this.characterCountId, ref: el => {
                 this.hiddenCounterLabel = el;
             } })))));
     }
     static get is() { return "duet-textarea"; }
-    static get encapsulation() { return "scoped"; }
+    static get encapsulation() { return "shadow"; }
     static get originalStyleUrls() {
         return {
             "$": ["duet-textarea.scss"]