@duetds/components 10.2.4 → 10.3.1

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

@@ -197,23 +197,23 @@ export class DuetSelect {
      */
     render() {
         const identifier = this.identifier || this.selectId;
-        return (h(Host, { key: 'd4455f68cbe21a6307b6c31fc5d1861e9b709308', class: {
+        return (h(Host, { key: '6937ee7615e75fb35ef3b6f1f43a4ac91fe13147', class: {
                 "duet-m-0": this.margin === "none",
                 "duet-expand": this.expand,
                 [`duet-select-variation-${this.variation}`]: true,
-            } }, h("div", { key: '40ddd5f7ed270fd9bbee28fe22f73087956bf129', class: {
+            } }, h("div", { key: 'df3ab43299a88a3560e41ac9efa1049f8cf472c6', class: {
                 "duet-select-container": true,
                 "duet-label-hidden": this.labelHidden,
                 "duet-theme-turva": this.theme === "turva",
                 [`duet-select-variation-${this.variation}`]: true,
                 "duet-input-top-caption-shown": this.isCaptionVisible,
                 "has-error": !!this.error,
-            } }, h(DuetInternalLabel, { key: 'e4e51bfc77281cf1fc4f160ecd4853ecbed2d8f4', theme: this.theme === "turva" ? "turva" : "default", class: { "duet-has-tooltip": !!this.tooltip }, color: this.labelColor, weight: this.labelWeight, id: this.labelId, for: identifier }, this.label), this.tooltip && (h("duet-tooltip", { key: '775a1132a55071285222eb159dab2cad6c53ed23', direction: this.tooltipDirection, accessibleInputLabel: this.label }, this.tooltip)), h("slot", { key: 'c9f5f7f6cba8f1ab8fe8b97d9bc0f477b0c0c35d', name: "tooltip" }), this.caption && (h("duet-caption", { key: '730da616b797488390632e9736282d318d18573b', id: this.topCaptionId, size: "medium" }, this.caption)), h("div", { key: '869eef60d494256461d86930a200bce7a1f5b6a6', class: "duet-select-wrapper" }, this.placeholder && this.echoPlaceholder && this.value && (h("duet-caption", { key: '4606845937218a919ab4b8aa8ca7d5c03cdb7b53', id: this.topCaptionPlaceholderId, class: "duet-select-placeholder", size: "small" }, this.placeholder)), h("slot", { key: '595fe0d02b48772d88098c21cc0d4d9f67e40eee' }), h("select", { key: 'ac4a661cb6210673febb02da37f5c0f4310874db', ref: select => (this.nativeSelect = select), disabled: this.disabled, name: this.name, id: identifier, role: this.role, "aria-labelledby": this.labelId, "aria-describedby": this.getDescribedBy(), "aria-controls": this.accessibleControls, "aria-activedescendant": this.accessibleActiveDescendant, "aria-owns": this.accessibleOwns, onFocus: this.onFocus, onBlur: this.onBlur, onChange: this.onChange, required: this.required }, this.placeholder && (h("option", { key: '4d043e787efa622f3e396a2103439339fd2a73b8', disabled: true, selected: true, value: "" }, this.placeholder)), !this.processedItems ? (h("option", null, "Virhe valintoja ladattaessa. P\u00E4ivit\u00E4 sivu ja kokeile uusiksi.")) : (this.processedItems.map(item => {
+            } }, h(DuetInternalLabel, { key: 'eed7661618d92026e2080a232a08acfc6bbb9286', theme: this.theme === "turva" ? "turva" : "default", class: { "duet-has-tooltip": !!this.tooltip }, color: this.labelColor, weight: this.labelWeight, id: this.labelId, for: identifier }, this.label), this.tooltip && (h("duet-tooltip", { key: '6c32da93490aa3bd28ed7c9dbc5c93f4ef7509b8', direction: this.tooltipDirection, accessibleInputLabel: this.label }, this.tooltip)), h("slot", { key: 'cbf1942699874feda3b94159477533fc722f9736', name: "tooltip" }), this.caption && (h("duet-caption", { key: 'bf4bfd734e9a973d14d98c96985d46c7dd1c5ceb', id: this.topCaptionId, size: "medium" }, this.caption)), h("div", { key: '251e263a892f221b586587aefbe55fe725ac2301', class: "duet-select-wrapper" }, this.placeholder && this.echoPlaceholder && this.value && (h("duet-caption", { key: 'c55fc0f969e5fff221ff765b1a85aa81a6949ca8', id: this.topCaptionPlaceholderId, class: "duet-select-placeholder", size: "small" }, this.placeholder)), h("slot", { key: 'a2eec6e452861fcceff707f25d390a04db8a36c8' }), h("select", { key: '3048fa80ccd46b95236fe4dfa2ce96571bcc3aed', ref: select => (this.nativeSelect = select), disabled: this.disabled, name: this.name, id: identifier, role: this.role, "aria-labelledby": this.labelId, "aria-describedby": this.getDescribedBy(), "aria-controls": this.accessibleControls, "aria-activedescendant": this.accessibleActiveDescendant, "aria-owns": this.accessibleOwns, onFocus: this.onFocus, onBlur: this.onBlur, onChange: this.onChange, required: this.required }, this.placeholder && (h("option", { key: 'cd9c69cc0437ec1201fee0a2ce5a401597e5fae9', disabled: true, selected: true, value: "" }, this.placeholder)), !this.processedItems ? (h("option", null, "Virhe valintoja ladattaessa. P\u00E4ivit\u00E4 sivu ja kokeile uusiksi.")) : (this.processedItems.map(item => {
             return isOptionGroup(item) ? this.renderOptionGroup(item) : this.renderOption(item);
-        }))), h("div", { key: 'c49def1bb08120461f4f4dc48ca9d2bfc3db1dba', class: {
+        }))), h("div", { key: 'af172a36f2e54f6ffe90e83d561258cc8aa91d6e', class: {
                 "duet-select": true,
                 [`duet-select-variation-${this.variation}`]: true,
-            }, "aria-hidden": "true" }, h("span", { key: this.value, class: "duet-select-selected-value" }, this.getSelectedItemLabel()), (this.variation === "default" && (h("svg", { key: 'fea29d4166e04f520240f5d61eed6dc2a007a3b0', role: "img", class: "duet-select-icon", fill: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '39476404793f72829c0b759d9ac21e6436e56dde', d: "m12 18.999c-.4 0-.776-.156-1.059-.438l-10.721-10.72c-.142-.142-.22-.33-.22-.531 0-.2.078-.389.22-.53.142-.142.33-.22.53-.22s.389.078.53.22l10.72 10.719 10.72-10.719c.142-.142.33-.22.53-.22s.389.078.53.22c.142.142.22.33.22.53s-.078.389-.22.53l-10.72 10.72c-.282.283-.659.439-1.06.439z" })))) || (h("duet-icon", { key: '9101a0f62cdb9392fb1c291919a9db1a951ce8fb', theme: this.theme, name: "action-arrow-down-small", color: "currentColor", margin: "none", size: this.variation === "compact" ? "xxx-small" : "xx-small" }))), h("span", { key: 'd9cd1eba5ce25f3a5d62a1cf5a91a34dde31e551', class: "duet-keep-container-height", role: "presention", "aria-hidden": "true" }, "_")), h("span", { key: 'bdcb742b9b81e76d4767210a505d388b11b8a9ca', class: "duet-select-help", id: this.errorId, "aria-live": this.accessibleLiveError, "aria-atomic": "true", "aria-relevant": "additions removals" }, this.error && h("span", { key: '4b60b8d44ad7e984a2a97fdcc82383edce1efbc4', class: "duet-select-error" }, this.error)))));
+            }, "aria-hidden": "true" }, h("span", { key: this.value, class: "duet-select-selected-value" }, this.getSelectedItemLabel()), (this.variation === "default" && (h("svg", { key: 'd8ff427b3fd8eb4d5605a7fc103f74757088364d', role: "img", class: "duet-select-icon", fill: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '5a6494284c14a3b4d35df44cb3250a827f17532d', d: "m12 18.999c-.4 0-.776-.156-1.059-.438l-10.721-10.72c-.142-.142-.22-.33-.22-.531 0-.2.078-.389.22-.53.142-.142.33-.22.53-.22s.389.078.53.22l10.72 10.719 10.72-10.719c.142-.142.33-.22.53-.22s.389.078.53.22c.142.142.22.33.22.53s-.078.389-.22.53l-10.72 10.72c-.282.283-.659.439-1.06.439z" })))) || (h("duet-icon", { key: 'ac74f1f426f66a3908be1444c828a321e4e45db2', theme: this.theme, name: "action-arrow-down-small", color: "currentColor", margin: "none", size: this.variation === "compact" ? "xxx-small" : "xx-small" }))), h("span", { key: 'e947148f3aa7b0d0f2da4db20b59d3d9be2aac44', class: "duet-keep-container-height", role: "presention", "aria-hidden": "true" }, "_")), h("span", { key: '39dc9f995207b67e9910b02768c532cdfbb05385', class: "duet-select-help", id: this.errorId, "aria-live": this.accessibleLiveError, "aria-atomic": "true", "aria-relevant": "additions removals" }, this.error && h("span", { key: '160c339a192e1941339eb15f1d127049b896bd9b', class: "duet-select-error" }, this.error)))));
     }
     static get is() { return "duet-select"; }
     static get encapsulation() { return "shadow"; }

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

@@ -33,9 +33,9 @@ export class DuetShapedImage {
         const style = {
             "--rotation": `${this.rotation}deg`,
         };
-        return (h(Host, { key: '30bd1e8a895453ef9ba0ef177efb3d0e7dcf6e51', class: { "duet-theme-turva": this.theme === "turva", "duet-m-0": this.margin === "none" } }, h("span", { key: '41ad8a12f4f501eeedbf68d8826fb03418d79167', class: {
+        return (h(Host, { key: 'a3b54614560cad8b7ebfab7fcdcd281d5cf2698d', class: { "duet-theme-turva": this.theme === "turva", "duet-m-0": this.margin === "none" } }, h("span", { key: '70fabf21da7e7198739b45dece77a4c45ee9b297', class: {
                 "shaped-image": true,
-            }, role: "img", "aria-label": this.accessibleLabel, style: style }, h("span", { key: 'bf49040fd93cb6b26f9af4b4182b734d6f38fd1e', class: "shaped-image-mask", role: "presentation" }, h("span", { key: 'bdb6b17ad7c5f5d599d5a26d0eee16cafaf478a2', class: "shaped-image-img", role: "presentation", style: { backgroundImage: `url("${this.src}")` } })))));
+            }, role: "img", "aria-label": this.accessibleLabel, style: style }, h("span", { key: '01d1367bf5fa537aa2c6bd76499f304338cae661', class: "shaped-image-mask", role: "presentation" }, h("span", { key: 'd57e561e61e250d305d8c7ab3b4cf2bb973dafc8', 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-share-chart/duet-share-chart.css

@@ -58,10 +58,6 @@
   font-variant-numeric: tabular-nums;
   color: rgb(8, 42, 77);
 }
-.duet-share-chart-item-list li.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, 42, 59);
-}
 .duet-share-chart-item-list span {
   display: inline-block;
 }
@@ -77,6 +73,7 @@
   font-weight: 600;
 }
 
-:host(.duet-theme-turva2) .duet-share-chart-item-list li.duet-theme-turva {
+.duet-share-chart-item-list li.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, 42, 59);
 }

package/lib/collection/components/duet-share-chart/duet-share-chart.js

@@ -63,12 +63,12 @@ export class DuetShareChart {
         this.itemsTotalValue = this.items.reduce((total, { value }) => total + value, 0);
     }
     render() {
-        return (h(Host, { key: 'a8331a4750680d3263cbb297663da80b23a61474' }, h("div", { key: '776a72d2c016b76c0020a0336379f6f50c767108', class: "duet-share-chart-horizontal-bar", role: "presentation" }, this.items
+        return (h(Host, { key: '41d1aab509a8e28586ffb62a223378a3c2d97552' }, h("div", { key: '22552a2eae668cc0a293e61b46a10655188e2ef8', class: "duet-share-chart-horizontal-bar", role: "presentation" }, this.items
             .filter(i => !!i.value)
             .map(item => (h("span", { class: "duet-share-chart-share", style: {
                 width: `${(item.value / this.itemsTotalValue) * 100}%`,
                 backgroundColor: getColorByName(item.color, this.theme),
-            } })))), h("ul", { key: '56ea054fcb62eb2b444f8359abb3bfd322f2f7e2', class: "duet-share-chart-item-list" }, this.items.map(item => (h("li", { class: { "duet-theme-turva": this.theme === "turva" } }, h("span", { class: "duet-share-chart-item-color", style: { background: getColorByName(item.color, this.theme) } }), h("span", { class: "duet-share-chart-item-text" }, item.text, ":"), h("span", { class: "duet-share-chart-item-value" }, "\u00A0", formatNumber(item.value), "\u00A0", this.unit), this.unit !== "%" && (h("duet-visually-hidden", null, `${formatNumber((item.value / this.itemsTotalValue) * 100, 0)} %`)))))), h("slot", { key: '38276b55daac849b429a9ec4e963c2d308a66267' })));
+            } })))), h("ul", { key: '72a0977595b3a0145eea22372114b18be3a24a0c', class: "duet-share-chart-item-list" }, this.items.map(item => (h("li", { class: { "duet-theme-turva": this.theme === "turva" } }, h("span", { class: "duet-share-chart-item-color", style: { background: getColorByName(item.color, this.theme) } }), h("span", { class: "duet-share-chart-item-text" }, item.text, ":"), h("span", { class: "duet-share-chart-item-value" }, "\u00A0", formatNumber(item.value), "\u00A0", this.unit), this.unit !== "%" && (h("duet-visually-hidden", null, `${formatNumber((item.value / this.itemsTotalValue) * 100, 0)} %`)))))), h("slot", { key: '36c475fc18913c91bb22e3eda0aa5f0c76b02cde' })));
     }
     static get is() { return "duet-share-chart"; }
     static get encapsulation() { return "shadow"; }

package/lib/collection/components/duet-share-chart-item/duet-share-chart-item.js

@@ -10,7 +10,7 @@ export class DuetShareChartItem {
         this.value = 0;
     }
     render() {
-        return (h(Host, { key: 'd35a290305ffe6ec034caf3d8f5d21e4c85ed7b5' }, h("div", { key: '885469b4f2ea9629da7f0baed471c5034eb9e979', hidden: true }, h("slot", { key: 'b4ecc6c43546845aaffb210b38a35cdafd88b403' }))));
+        return (h(Host, { key: 'cfc906f48f161844e43f30fa14e0ff41939f38c6' }, h("div", { key: '526a5bf599b352d289abf6057991d0407e7a7ff6', hidden: true }, h("slot", { key: '8c8b501ea1fc3e556214a8b43afca95d24aae001' }))));
     }
     static get is() { return "duet-share-chart-item"; }
     static get encapsulation() { return "shadow"; }

package/lib/collection/components/duet-show-more/duet-show-more.css

@@ -45,16 +45,13 @@
   outline-offset: 2px;
   outline-color: rgba(0, 119, 179, 0.8);
 }
-.duet-theme-turva .duet-show-more .content:focus, .duet-show-more .content:focus.duet-theme-turva, .duet-theme-turva2 .duet-show-more .content:focus, .duet-show-more .content:focus.duet-theme-turva2 {
+.duet-theme-turva .duet-show-more .content:focus, .duet-show-more .content:focus.duet-theme-turva {
   outline: 2px solid;
   outline-offset: 2px;
   outline-color: rgba(53, 79, 101, 0.8);
 }
+
 .duet-show-more.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, 42, 59);
-}
-
-:host(.duet-theme-turva2) .duet-show-more.duet-theme-turva {
-  color: rgb(23, 42, 59);
 }

package/lib/collection/components/duet-show-more/duet-show-more.js

@@ -136,12 +136,12 @@ export class DuetShowMore {
      * Always the last one of the class.
      */
     render() {
-        return (h(Host, { key: '9b7b230463671d2192e210969a461b48251cae0e' }, h("div", { key: '241c4328ff06cb3582ccef14dc4798dfdfa79f9e', class: {
+        return (h(Host, { key: '514e5c439744a2960e711811f696d2ee9e49dba3' }, h("div", { key: '40788025130f4b8570cbacfa6371b11ea4bbdb42', class: {
                 "duet-show-more": true,
                 "duet-theme-turva": this.theme === "turva",
                 "duet-m-0": this.margin === "none",
                 open: this.open,
-            } }, h("div", { key: 'ec5a0385c4fa9014a0d218ff6e9219be7412b0dd', ref: ref => (this.contentElement = ref), class: { content: true, "duet-theme-turva": this.theme === "turva" }, id: this.contentId, tabindex: this.open ? "-1" : "" }, h("div", { key: '55832cd10199162f413b2d99a4a1d2053ac4e665', class: { "slotted-content": true } }, h("slot", { key: 'c6b5fdd8c48f8ace2e8bf1bba830c21a9e2a1bb1' }))), h("duet-button", { key: '7357d2b3e0aad58f27e4809cf8b727bee905f1e0', id: this.buttonId, variation: "plain", "accessible-label": this.buttonAriaOpen ? this.showLessAccessibleLabel : this.showMoreAccessibleLabel, "accessible-expanded": this.buttonAriaOpen ? "true" : "false", "accessible-controls": this.contentId, accessiblePressed: this.isSafariBrowser ? this.open : null, onClick: this.handleClick, onKeyDown: this.handleKeyDown, "icon-right": true, icon: this.open ? "action-arrow-up-small" : "action-arrow-down-small", "icon-size": "medium-small", size: "small", margin: this.buttonMargin, padding: this.buttonPadding, theme: this.theme === "turva" ? "turva" : "default" }, h("span", { key: '762004e8bd6923114c75c638e6987f40e9bbf96d' }, this.open ? this.showLessLabel : this.showMoreLabel)))));
+            } }, h("div", { key: '42f30cd3ffc5c33651d4d0c7e36c913eab6d8147', ref: ref => (this.contentElement = ref), class: { content: true, "duet-theme-turva": this.theme === "turva" }, id: this.contentId, tabindex: this.open ? "-1" : "" }, h("div", { key: 'a319d301f1ed7130671aa529592270c4b708b7f9', class: { "slotted-content": true } }, h("slot", { key: '81b3e98809cee2a52c358af50383272ddebd8ee6' }))), h("duet-button", { key: '9789882dceda992bd6107cc84fa92ca4289f3679', id: this.buttonId, variation: "plain", "accessible-label": this.buttonAriaOpen ? this.showLessAccessibleLabel : this.showMoreAccessibleLabel, "accessible-expanded": this.buttonAriaOpen ? "true" : "false", "accessible-controls": this.contentId, accessiblePressed: this.isSafariBrowser ? this.open : null, onClick: this.handleClick, onKeyDown: this.handleKeyDown, "icon-right": true, icon: this.open ? "action-arrow-up-small" : "action-arrow-down-small", "icon-size": "medium-small", size: "small", margin: this.buttonMargin, padding: this.buttonPadding, theme: this.theme === "turva" ? "turva" : "default" }, h("span", { key: '9d664617e12985187968c239189df78e3ce87a40' }, this.open ? this.showLessLabel : this.showMoreLabel)))));
     }
     static get is() { return "duet-show-more"; }
     static get encapsulation() { return "shadow"; }

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

@@ -52,15 +52,6 @@
   line-height: 1.5;
   color: rgb(8, 42, 77);
 }
-.duet-slideout.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, 42, 59);
-}
-@media (min-width: 62em) {
-  .duet-slideout.duet-theme-turva .desktop-bg {
-    background: rgb(23, 42, 59);
-  }
-}
 .duet-slideout .dialog {
   position: fixed;
   top: 0;
@@ -107,7 +98,7 @@
   outline-offset: 2px;
   outline-color: rgba(0, 119, 179, 0.8);
 }
-.duet-theme-turva .duet-slideout .dialog .top button:focus, .duet-slideout .dialog .top button:focus.duet-theme-turva, .duet-theme-turva2 .duet-slideout .dialog .top button:focus, .duet-slideout .dialog .top button:focus.duet-theme-turva2 {
+.duet-theme-turva .duet-slideout .dialog .top button:focus, .duet-slideout .dialog .top button:focus.duet-theme-turva {
   outline: 2px solid;
   outline-offset: 2px;
   outline-color: rgba(53, 79, 101, 0.8);
@@ -157,53 +148,46 @@
 .duet-slideout .dialog.hidden .top {
   opacity: 0;
 }
+
+slot {
+  color: rgb(8, 42, 77);
+}
+
+.duet-slideout.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, 42, 59);
+}
+
+@media (min-width: 62em) {
+  .duet-slideout.duet-theme-turva .desktop-bg {
+    background: rgb(23, 42, 59);
+  }
+}
+
 .duet-slideout.duet-theme-turva .dialog {
   box-shadow: 0 3px 6px 0 rgba(23, 28, 58, 0.1) inset;
 }
 .duet-slideout.duet-theme-turva .dialog:not(.modal) {
   box-shadow: 0 2px 20px 0 rgba(0, 0, 0, 0.2);
 }
+
 .duet-slideout.duet-theme-turva button {
   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, 42, 59);
 }
+
 .duet-slideout.duet-theme-turva button.active {
   color: rgb(230, 23, 64);
 }
+
 .duet-slideout.duet-theme-turva button.active::after {
   background: rgb(230, 23, 64);
 }
+
 .duet-slideout.duet-theme-turva .has-sticky-header-slot .sticky-header {
-  border-bottom: 1px solid rgb(212, 221, 226);
+  border-bottom-color: rgb(212, 221, 226);
 }
 
-slot {
-  color: rgb(8, 42, 77);
-}
 .duet-theme-turva slot {
   color: rgb(23, 42, 59);
-}
-
-:host(.duet-theme-turva2) .duet-slideout.duet-theme-turva {
-  color: rgb(23, 42, 59);
-}
-@media (min-width: 62em) {
-  :host(.duet-theme-turva2) .duet-slideout.duet-theme-turva .desktop-bg {
-    background: rgb(23, 42, 59);
-  }
-}
-:host(.duet-theme-turva2) .duet-slideout.duet-theme-turva button {
-  color: rgb(23, 42, 59);
-}
-:host(.duet-theme-turva2) .duet-slideout.duet-theme-turva button.active {
-  color: rgb(230, 23, 64);
-}
-:host(.duet-theme-turva2) .duet-slideout.duet-theme-turva button.active::after {
-  background: rgb(230, 23, 64);
-}
-:host(.duet-theme-turva2) .duet-slideout.duet-theme-turva .has-sticky-header-slot .sticky-header {
-  border-bottom-color: rgb(212, 221, 226);
-}
-:host(.duet-theme-turva2) slot {
-  color: rgb(23, 42, 59);
 }

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

@@ -158,12 +158,14 @@ export class DuetSlideout {
         if (this.mutationObserver) {
             this.mutationObserver.observe(this.element, { childList: true, attributeFilter: ["open"], subtree: true });
         }
-        if (this.opener && typeof this.opener !== "string") {
-            this.setOpenButton(this.opener);
-        }
-        else {
-            this.setOpenButton();
-        }
+        requestAnimationFrame(() => {
+            if (this.opener && typeof this.opener !== "string") {
+                this.setOpenButton(this.opener);
+            }
+            else {
+                this.setOpenButton();
+            }
+        });
     }
     disconnectedCallback() {
         disconnectLanguageChangeObserver(this);
@@ -294,17 +296,17 @@ export class DuetSlideout {
         };
         const topLevelOpenMenuBarTranslation = getLocaleString(this.topLevelOpenMenuBarLangObject);
         const exitTranslation = getLocaleString(this.exitLangObject);
-        return (h(Host, { key: 'd7b06f4616c56fe0a9deb3df7218be41d262556c' }, h("div", { key: '4413b3aa5b8a3c01cc4016e3846b10dd136c393c', class: { "duet-slideout": true, "duet-theme-turva": this.theme === "turva" } }, this.modal && h("duet-overlay", { key: 'abe01c506ded568802ba19de8f24d872f81b24dd', visible: this.open, zIndex: "600" }), h("div", { key: '888233b81ba64512ccd9785b4b5a290da3a8eb43', ref: element => (this.dialog = element), tabindex: "-1", role: "dialog", id: "dialog", "aria-labelledby": "button", "aria-modal": this.isSafariBrowser ? false : true, "aria-flowto": "slot-container", class: {
+        return (h(Host, { key: '15926d51d888fbafb80d0c06a903dd7dda144588' }, h("div", { key: '137390c821f9878bde46d7c2ac728649efebd957', class: { "duet-slideout": true, "duet-theme-turva": this.theme === "turva" } }, this.modal && h("duet-overlay", { key: 'ecd721dba56b60c66d6f275c727c955d62cd1e3d', visible: this.open, zIndex: "600" }), h("div", { key: 'b7a642e04eed19e4fd7e36b1835d6e4c74aec27c', ref: element => (this.dialog = element), tabindex: "-1", role: "dialog", id: "dialog", "aria-labelledby": "button", "aria-modal": this.isSafariBrowser ? false : true, "aria-flowto": "slot-container", class: {
                 dialog: true,
                 hidden: !this.open,
                 modal: this.modal,
-            }, style: styles }, h(FocusGuard, { key: '7c2b5eb4d236ddd5b7baa9062b0ea2bd49cc5522', moveFocusTo: this.closeButton }), h("div", { key: '3635b98dc3bf6414d914c38dbbc6bc1c020dda7a', class: { "top-container": true, "has-sticky-header-slot": this.hasStickyHeaderSlot } }, h("div", { key: 'e6bc2f2ca5ba5f05d225b3f700eaad4a8d207ef1', class: "top" }, h("button", { key: '8bdb551c5dabba2bdbbc4a7a08ada1bfad2a8d0b', ref: element => (this.closeButton = element), "aria-haspopup": "dialog", "aria-controls": "dialog", "aria-expanded": this.open ? "true" : "false", "aria-label": `${exitTranslation}`, type: "button", class: {
+            }, style: styles }, h(FocusGuard, { key: 'b77f1894f5398ba5a2cb46f0e03bf61b62316375', moveFocusTo: this.closeButton }), h("div", { key: '1ed24174eedb22702423e2360902d86bb5d88130', class: { "top-container": true, "has-sticky-header-slot": this.hasStickyHeaderSlot } }, h("div", { key: 'a5c52f4c5699fdf82e6032db15a59952c699da21', class: "top" }, h("button", { key: 'c12113cdf3c775016253f6372e5acad37e06b552', ref: element => (this.closeButton = element), "aria-haspopup": "dialog", "aria-controls": "dialog", "aria-expanded": this.open ? "true" : "false", "aria-label": `${exitTranslation}`, type: "button", class: {
                 "slideout-close": true,
                 active: this.open,
                 "duet-theme-turva": this.theme === "turva",
-            }, onClick: this.onClick, inert: this.openPanel }, h("duet-icon", { key: '2134ec846a523228214b9ae75da36c2b52daaa63', name: "navigation-close", size: "small", margin: "none", color: "secondary" }))), h("div", { key: '915b4da81dc28d593fb081e7fb261adde35a7859', class: "sticky-header" }, h("slot", { key: '882f60d86cc80ee465f4ab6e0a46ec58103a1611', name: "sticky-header" }))), h("div", { key: '6cdddc38ce0abd27431f702054a17b971c5098c9', id: "slot-container", role: this.accessibleRole, "aria-label": this.openPanel ? topLevelOpenMenuBarTranslation : null, class: {
+            }, onClick: this.onClick, inert: this.openPanel }, h("duet-icon", { key: 'e19e950ae4db64d0dd6a1f5423849e4825da08f9', name: "navigation-close", size: "small", margin: "none", color: "secondary" }))), h("div", { key: '87c7d146ca56c79f17bfae9d658bf6b161724b6e', class: "sticky-header" }, h("slot", { key: 'cfe4f5cba7c3fc4e69b9d0934be5cc9062f15669', name: "sticky-header" }))), h("div", { key: 'decd4a9a7d6ebd9468f1c6b3572985120e83fabd', id: "slot-container", role: this.accessibleRole, "aria-label": this.openPanel ? topLevelOpenMenuBarTranslation : null, class: {
                 items: true,
-            } }, h("slot", { key: '9981a5f609c93d9b666edc3d8f13cbacbf78becc' })), h(FocusGuard, { key: 'a18fb90c02f65dde3dc192f77c5b7460e626f641', moveFocusTo: this.closeButton })))));
+            } }, h("slot", { key: '895e292fa85f1ec87523600aba207a414997c32f' })), h(FocusGuard, { key: 'ead70e05106da19d4ca705b9716b1f9257563373', moveFocusTo: this.closeButton })))));
     }
     static get is() { return "duet-slideout"; }
     static get encapsulation() { return "shadow"; }

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

@@ -52,8 +52,4 @@
 
 .duet-theme-turva ::slotted(:not(:last-child))::after {
   background: rgb(23, 42, 59);
-}
-
-:host(.duet-theme-turva2) .duet-theme-turva ::slotted(:not(:last-child))::after {
-  background: rgb(23, 42, 59);
 }

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

@@ -38,7 +38,7 @@ export class DuetSlideoutLang {
      */
     render() {
         const langTranslation = getLocaleString(this.chooseLangObject);
-        return (h(Host, { key: '2c744c1b9d32b518b879daf12ffafe26ba74c43b' }, h("div", { key: 'ddb19f0b54c8a3f8680e76c8b3e565ff9c114e3b', class: "duet-slideout-lang", role: "group", "aria-label": langTranslation }, h("duet-icon", { key: '09e40a1777dc671deffa188ccecfc9ce78089ecb', name: "navigation-language", margin: "none", color: "secondary", size: "small" }), h("slot", { key: '6e35a0b19bab97a7810f90ddd99f399a60e9f3dc' }))));
+        return (h(Host, { key: '6236540dfcccb46cc3a8c843bb55a41f53778097' }, h("div", { key: 'a3599eb69fdf0503f8171faca040233b9bdfed06', class: "duet-slideout-lang", role: "group", "aria-label": langTranslation }, h("duet-icon", { key: '414eb1bcd9833eb5c86f133a3f0755a33549f1d5', name: "navigation-language", margin: "none", color: "secondary", size: "small" }), h("slot", { key: 'b747ac7d3d69368b38dbc39d794ee4aea592d3d6' }))));
     }
     static get is() { return "duet-slideout-lang"; }
     static get encapsulation() { return "shadow"; }

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

@@ -46,14 +46,11 @@
   outline-offset: 2px;
   outline-color: rgba(0, 119, 179, 0.8);
 }
-.duet-theme-turva .duet-slideout-link:focus, .duet-slideout-link:focus.duet-theme-turva, .duet-theme-turva2 .duet-slideout-link:focus, .duet-slideout-link:focus.duet-theme-turva2 {
+.duet-theme-turva .duet-slideout-link:focus, .duet-slideout-link:focus.duet-theme-turva {
   outline: 2px solid;
   outline-offset: 2px;
   outline-color: rgba(53, 79, 101, 0.8);
 }
-.duet-slideout-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";
-}
 .duet-slideout-link.active span {
   position: relative;
 }
@@ -69,9 +66,6 @@
   background: rgb(0, 119, 179);
   transform: var(--active-translate-y, translateY(2px));
 }
-.duet-slideout-link.active.duet-theme-turva span::after {
-  background: rgb(230, 23, 64);
-}
 .duet-slideout-link.small {
   font-size: 1rem;
   font-weight: 600;
@@ -119,16 +113,16 @@ slot[name=description]::slotted(*) {
   font-weight: 400;
   color: rgb(98, 121, 138);
 }
-.duet-theme-turva slot[name=description]::slotted(*) {
-  color: rgb(95, 122, 143);
-}
 
-:host(.duet-theme-turva2) .duet-slideout-link.duet-theme-turva {
+.duet-slideout-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(23, 42, 59);
 }
-:host(.duet-theme-turva2) .duet-slideout-link.duet-theme-turva.active .label-content::after {
+
+.duet-slideout-link.duet-theme-turva.active .label-content::after {
   background: rgb(230, 23, 64);
 }
-:host(.duet-theme-turva2) slot[name=description]::slotted(*) {
+
+slot[name=description]::slotted(*) {
   color: rgb(23, 42, 59);
 }

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

@@ -77,12 +77,12 @@ export class DuetSlideoutLink {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: 'ddd58c7a2dd10eb703260af1101339c6294f9d3a' }, h("a", { key: 'e2be40572ff1c774d51cb6f8170c2e73b72948cf', target: !this.href ? null : this.external ? "_blank" : "_self", class: {
+        return (h(Host, { key: '11544751fda9c0d6dd5f84af34e2f87b732d42a4' }, h("a", { key: '0a773bdb78c74a758242bd8bdfeaf3b4b9aa5b60', target: !this.href ? null : this.external ? "_blank" : "_self", 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.href && getAccessibleLinkLabel(this)) || this.accessibleLabel, rel: this.external ? "noopener" : undefined }, this.icon && (h("duet-icon", { key: 'c1f75fd56387b7811d990bc9bba9f7114f960fd5', name: this.icon, color: "secondary", size: this.menuItem ? "x-small" : "small", margin: "none" })), h("div", { key: '6794b7cfe9a5e985e9123a1896b9b71292955930', class: "label" }, h("span", { key: '02eef0aae26c07d79209c083769c83096aaaddf5' }, h("span", { key: '869ba809178272b72d91830a2d0544e601bcc1f8', class: "label-container" }, h("span", { key: '432f855593996fb8a470b68982662beb6cce16fd', class: "label-content" }, h("slot", { key: '8be35ac79ca5ef94119a05b9f712c24e5c6760ab' })), this.external && (h("duet-icon", { key: 'c80f5df7d3c816a6235150c3a89e9b685e3a1205', class: "external-icon", theme: this.theme, name: newWindowIcon.title, margin: "none", size: "auto", color: "currentColor" }))), h("slot", { key: 'b685c8cc67e5e780536c46d949951516cdea46d1', name: "description" })), this.caret && (h("duet-icon", { key: 'c53c92133453d2421b92f8ab7ae7741c71a686e5', 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.href && getAccessibleLinkLabel(this)) || this.accessibleLabel, rel: this.external ? "noopener" : undefined }, this.icon && (h("duet-icon", { key: '1861478a046aef9645f066fb23d1f4c912f1ef0c', name: this.icon, color: "secondary", size: this.menuItem ? "x-small" : "small", margin: "none" })), h("div", { key: '1dd2d3ef5f287cd454ddf9b6612e97d473b82ba9', class: "label" }, h("span", { key: '5a90dffe20806ee7b52e790f7dced30ebfb904e5' }, h("span", { key: '8ba44b556e13a4aa99d59650cfdd0e896c826111', class: "label-container" }, h("span", { key: '768831387964eaead94ddca5d1f1782bfb12223b', class: "label-content" }, h("slot", { key: 'd202274b8de9e89862986f27d070010b161a1efa' })), this.external && (h("duet-icon", { key: '6dfa5809ad21343f1b8a705406b6a436ddc0e93f', class: "external-icon", theme: this.theme, name: newWindowIcon.title, margin: "none", size: "auto", color: "currentColor" }))), h("slot", { key: '8222d3a0078e850548ee64ead0b4d0030e37aa3f', name: "description" })), this.caret && (h("duet-icon", { key: 'f0dd79d575afa645415a239c2a1d545d079edc84', 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.css

@@ -62,7 +62,7 @@
   outline-offset: 2px;
   outline-color: rgba(0, 119, 179, 0.8);
 }
-.duet-theme-turva .duet-slideout-panel .link:focus, .duet-slideout-panel .link:focus.duet-theme-turva, .duet-theme-turva2 .duet-slideout-panel .link:focus, .duet-slideout-panel .link:focus.duet-theme-turva2 {
+.duet-theme-turva .duet-slideout-panel .link:focus, .duet-slideout-panel .link:focus.duet-theme-turva {
   outline: 2px solid;
   outline-offset: 2px;
   outline-color: rgba(53, 79, 101, 0.8);
@@ -162,11 +162,9 @@
   outline-offset: 2px;
   outline-color: rgba(0, 119, 179, 0.8);
 }
-.duet-theme-turva .duet-slideout-panel .top .back:focus, .duet-slideout-panel .top .back:focus.duet-theme-turva, .duet-theme-turva2 .duet-slideout-panel .top .back:focus, .duet-slideout-panel .top .back:focus.duet-theme-turva2,
+.duet-theme-turva .duet-slideout-panel .top .back:focus, .duet-slideout-panel .top .back:focus.duet-theme-turva,
 .duet-theme-turva .duet-slideout-panel .top .close:focus,
-.duet-slideout-panel .top .close:focus.duet-theme-turva,
-.duet-theme-turva2 .duet-slideout-panel .top .close:focus,
-.duet-slideout-panel .top .close:focus.duet-theme-turva2 {
+.duet-slideout-panel .top .close:focus.duet-theme-turva {
   outline: 2px solid;
   outline-offset: 2px;
   outline-color: rgba(53, 79, 101, 0.8);
@@ -208,24 +206,6 @@
 .duet-slideout-panel duet-indicator {
   top: 4px;
 }
-.duet-slideout-panel.duet-theme-turva .link {
-  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, 42, 59);
-}
-.duet-slideout-panel.duet-theme-turva .link.active .label-text::after {
-  background: rgb(230, 23, 64);
-}
-.duet-slideout-panel.duet-theme-turva .has-sticky-header-slot .top {
-  background: rgb(245, 246, 247);
-}
-.duet-slideout-panel.duet-theme-turva .has-sticky-header-slot .sticky-header {
-  background: rgb(245, 246, 247);
-  border-bottom: 1px solid rgb(212, 221, 226);
-}
-.duet-slideout-panel.duet-theme-turva .top span {
-  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, 42, 59);
-}
 
 slot:not([name=label]) {
   --active-height: 1px;
@@ -234,26 +214,30 @@ slot:not([name=label]) {
   font-weight: 600;
   color: rgb(8, 42, 77);
 }
-.duet-theme-turva slot:not([name=label]) {
-  color: rgb(23, 42, 59);
-}
 
-:host(.duet-theme-turva2) .duet-slideout-panel.duet-theme-turva .link {
+.duet-slideout-panel.duet-theme-turva .link {
+  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, 42, 59);
 }
-:host(.duet-theme-turva2) .duet-slideout-panel.duet-theme-turva .link.active .label-text::after {
+
+.duet-slideout-panel.duet-theme-turva .link.active .label-text::after {
   background: rgb(230, 23, 64);
 }
-:host(.duet-theme-turva2) .duet-slideout-panel.duet-theme-turva .has-sticky-header-slot .top {
+
+.duet-slideout-panel.duet-theme-turva .has-sticky-header-slot .top {
   background: rgb(253, 247, 242);
 }
-:host(.duet-theme-turva2) .duet-slideout-panel.duet-theme-turva .has-sticky-header-slot .sticky-header {
+
+.duet-slideout-panel.duet-theme-turva .has-sticky-header-slot .sticky-header {
   background: rgb(253, 247, 242);
   border-bottom-color: rgb(251, 225, 209);
 }
-:host(.duet-theme-turva2) .duet-slideout-panel.duet-theme-turva .top span {
+
+.duet-slideout-panel.duet-theme-turva .top span {
+  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, 42, 59);
 }
-:host(.duet-theme-turva2) slot:not([name=label]) {
+
+.duet-theme-turva slot:not([name=label]) {
   color: rgb(23, 42, 59);
 }

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

@@ -174,25 +174,25 @@ export class DuetSlideoutPanel {
         };
         const exitTranslation = getLocaleString(this.exitLangObject);
         const backTranslation = getLocaleString(this.backLangObject);
-        return (h(Host, { key: '8136756acde9cd9a5038e49c14049295ef2a50ee' }, h("div", { key: 'bd5e9a275c149b6a52172d9349fefb6aef42282e', class: {
+        return (h(Host, { key: 'b7ca9da2d68d44f8c144355d8b42e9b822129768' }, h("div", { key: '1cd22b150660a032f6307460a5394f9bdd2f8356', class: {
                 "duet-slideout-panel": true,
                 "duet-theme-turva": this.theme === "turva",
                 active: this.open,
-            } }, this.badge && h("duet-indicator", { key: '240033e4afa0a5e32dc708eceee5cd3c35fad16f', variation: "change" }), h("button", { key: '2fcac219bc058445a3f744e99beb1ce8d1be7c27', 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: {
+            } }, this.badge && h("duet-indicator", { key: '6343757ff3eee8a8c6965b4709958f65b784876c', variation: "change" }), h("button", { key: '9c9deae0fcf64337dcf2a5ffc10b90cd1805f726', 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,
                 "duet-theme-turva": this.theme === "turva",
-            }, onClick: this.onClick, inert: this.open }, this.icon && (h("div", { key: '9a7ea3d7682510b7a94c7e7bfff417dabfd833b0', class: "duet-slideout-icon" }, h("duet-icon", { key: '29e67edcad14dd8f20f1a0a319bdbe3bba7d0495', name: this.icon, size: "small", margin: "none", color: "secondary" }))), h("span", { key: '02d2e2107083535c6bf1d2b89c92681ed0ff5257', class: "label" }, h("span", { key: 'ce6a1f30ee04677c584d98a228d0302f0b02c0f8', class: { "label-text": true, [this.labelSize]: true } }, h("slot", { key: 'd7c645fa7153a803b3e63b3614ec65ff1cb775dd', name: "label" })), h("duet-icon", { key: 'fc24304d004fc06d1f44d6611555af3aa57b91f0', class: "caret", name: "action-arrow-right", margin: "none", size: "x-small", color: "secondary" }))), h("div", { key: '893f838b0476b45a35c5c5df009ea25be382748f', ref: element => (this.dialog = element), class: {
+            }, onClick: this.onClick, inert: this.open }, this.icon && (h("div", { key: 'e713cc239aaee89e8e57d2d0fbd5f5c03f75a932', class: "duet-slideout-icon" }, h("duet-icon", { key: '647a923e7b9a57135779172c56a9ce3f4784eca5', name: this.icon, size: "small", margin: "none", color: "secondary" }))), h("span", { key: '0efd846db68b6ddec41deb3b98e95b578f600c9b', class: "label" }, h("span", { key: '35be3389257b208d50bfc51d9aed16149d01a927', class: { "label-text": true, [this.labelSize]: true } }, h("slot", { key: 'cc261654761ea7dce912746e520042d05c534fc8', name: "label" })), h("duet-icon", { key: '634184d119a894c2eda07e6c474d058e125f6257', class: "caret", name: "action-arrow-right", margin: "none", size: "x-small", color: "secondary" }))), h("div", { key: 'adc63cfa083c247dfb0053c0628a34036bb1c6cc', ref: element => (this.dialog = element), class: {
                 dialog: true,
                 hidden: !this.open,
-            }, style: styles }, h(FocusGuard, { key: '75cd1ca13074e4edf114d7e016b30e77503f6766', moveFocusTo: this.closeButton }), h("div", { key: '53f51c39c3e701be9b0fc9f402507a1315669820', class: { "top-container": true, "has-sticky-header-slot": this.hasStickyHeaderSlot } }, h("div", { key: '08f9a0174b2a902a46f6f8a722783740e2c03f01', class: "top" }, h("button", { key: '70ec35736850d5740cf7940e1195202266ba64b3', 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: 'c2f8a9ba339619c3c0f17e925e43ac421da03fde', moveFocusTo: this.closeButton }), h("div", { key: 'ea23a8d999173132d21ef23e83835c89b892ec9e', class: { "top-container": true, "has-sticky-header-slot": this.hasStickyHeaderSlot } }, h("div", { key: '883f2a295c1e8450973a2c69f533fba8352c6b5b', class: "top" }, h("button", { key: '5d51c88ad14f8e0cd711e653378ac9901ad9334b', 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,
                 "duet-theme-turva": this.theme === "turva",
-            }, onClick: this.onClick }, h("duet-icon", { key: '8fd080b3ddde0fcc9edc8e3b65c71f038e9a641b', class: "caret", name: "action-arrow-left", margin: "none", size: "small", color: "secondary" })), h("span", { key: '6c5bf9eee61b85d3b334a3b76f8568a91f3ede8a' }, this.label.innerHTML), h("button", { key: '3de010c98fc4a25b160f0bb321652db95372b529', class: { close: true, "duet-theme-turva": this.theme === "turva" }, type: "button", onClick: this.onCloseClick, "aria-label": `${exitTranslation}` }, h("duet-icon", { key: '3d98d30425ce462e8d14ffa07cb631c452bdbf36', name: "navigation-close", size: "small", margin: "none", color: "secondary" }))), h("div", { key: '9714f189c3e45aa70201006fee01f0daab33acc8', class: "sticky-header" }, h("slot", { key: 'bda41ebde4391bdce90a2d9c3c9c2b3f59a484b1', name: "sticky-header" }))), h("div", { key: '7c97e9932da1cfbca0d045f7744d64a697c6849e', tabindex: "-1", role: "menu",
+            }, onClick: this.onClick }, h("duet-icon", { key: 'da662ca8ebf14ed3a2d4157ff900884a111fa52a', class: "caret", name: "action-arrow-left", margin: "none", size: "small", color: "secondary" })), h("span", { key: 'd3faed89bc59ca1c0ba2623e7a8e162bdaa4e326' }, this.label.innerHTML), h("button", { key: 'b90b5a03a91f92b65f1b06f9fea40fcbfff799b5', class: { close: true, "duet-theme-turva": this.theme === "turva" }, type: "button", onClick: this.onCloseClick, "aria-label": `${exitTranslation}` }, h("duet-icon", { key: 'fe6676540e447c796bb2b38cc704a5a753a48e0b', name: "navigation-close", size: "small", margin: "none", color: "secondary" }))), h("div", { key: '8b1965807e40adc74947c170d8ad50172829f4da', class: "sticky-header" }, h("slot", { key: 'a51428e89962c2e10cf96ab92f462df6c20b05f2', name: "sticky-header" }))), h("div", { key: '4e4f74bac3d36949a9fd193ee9989c2ba757468b', tabindex: "-1", role: "menu",
             //TODO: slideout menu fades out, needs to be instant
             id: "menu", "aria-labelledby": "button", class: {
                 items: true,
-            } }, h("slot", { key: '760f770c9b134fddb61954aa9bda6d2f7c1ec3d5' })), h(FocusGuard, { key: '0f423c9da48756f6e1f7be813e8a9e948e650293', moveFocusTo: this.closeButton })))));
+            } }, h("slot", { key: 'dab429efe653f73142b8cd615311c5a8953c6343' })), h(FocusGuard, { key: '70c7027c0f655e46753addde7928facb096b0481', 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.css

@@ -64,7 +64,7 @@
   outline-offset: 2px;
   outline-color: rgba(0, 119, 179, 0.8);
 }
-.duet-theme-turva .duet-slideout-panel-dropdown button:focus, .duet-slideout-panel-dropdown button:focus.duet-theme-turva, .duet-theme-turva2 .duet-slideout-panel-dropdown button:focus, .duet-slideout-panel-dropdown button:focus.duet-theme-turva2 {
+.duet-theme-turva .duet-slideout-panel-dropdown button:focus, .duet-slideout-panel-dropdown button:focus.duet-theme-turva {
   outline: 2px solid;
   outline-offset: 2px;
   outline-color: rgba(53, 79, 101, 0.8);
@@ -112,13 +112,6 @@
   overflow: hidden;
   transition: max-height 0.3s ease-out, padding-bottom 0.3s ease-out;
 }
-.duet-slideout-panel-dropdown.duet-theme-turva button {
-  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, 42, 59);
-}
-.duet-slideout-panel-dropdown.duet-theme-turva button.active .label::after {
-  background: rgb(230, 23, 64);
-}
 
 slot {
   --active-height: 1px;
@@ -127,21 +120,21 @@ slot {
   font-weight: 400;
   color: rgb(8, 42, 77);
 }
-.duet-theme-turva slot {
-  color: rgb(23, 42, 59);
-}
 
 slot[name=label] {
   font-size: 1rem;
   font-weight: 600;
 }
 
-:host(.duet-theme-turva2) .duet-slideout-panel-dropdown.duet-theme-turva button {
+.duet-slideout-panel-dropdown.duet-theme-turva button {
+  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, 42, 59);
 }
-:host(.duet-theme-turva2) .duet-slideout-panel-dropdown.duet-theme-turva button.active .label::after {
+
+.duet-slideout-panel-dropdown.duet-theme-turva button.active .label::after {
   background: rgb(230, 23, 64);
 }
-:host(.duet-theme-turva2) slot {
+
+.duet-theme-turva slot {
   color: rgb(23, 42, 59);
 }

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

@@ -52,18 +52,18 @@ export class DuetSlideoutPanelDropdown {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: 'c07d09acdc3ae629d1ade84a8f38ba5a4400c93c' }, h("div", { key: '5c460268ab843fd63034f39baaabb0217610742e', class: {
+        return (h(Host, { key: 'bc86e96a57db15bb14d665edb554ef6372633c1e' }, h("div", { key: '210b0bc2779a333ea5da5d9aa80f52ff94e31bab', class: {
                 "duet-slideout-panel-dropdown": true,
                 "duet-theme-turva": this.theme === "turva",
                 active: this.open,
-            } }, h("button", { key: 'fda35d3ebe560638a7684ff895a1a07fae2795dc', 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: 'ec70dde7f96e71aebf294a8effe5c86887e6579a', 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,
                 "duet-theme-turva": this.theme === "turva",
-            }, onClick: this.onClick }, this.icon && h("duet-icon", { key: 'adbef98fc7e1c01c4db93fc890adca55a968c3ed', name: this.icon, size: "small", margin: "none", color: "secondary" }), h("span", { key: '9a9e035c35cfc2bd40ca504dfb755db6598072ab', class: "label" }, h("slot", { key: '69b970d13d166d320f423480e93e721a8ca0791a', name: "label" }), h("duet-icon", { key: '48e456eb714c1f276c30d1830c4335a2c78b7674', class: "caret", name: "action-arrow-down-small", margin: "none", size: "xx-small", color: "secondary" }))), h("div", { key: 'bb3730e96c82aab35530c476c78880b73ac4c2c2', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
+            }, onClick: this.onClick }, this.icon && h("duet-icon", { key: 'c2e90527626b6f3206a3e4d1cfeefad2f51aaea8', name: this.icon, size: "small", margin: "none", color: "secondary" }), h("span", { key: 'd746147d5a9a5740daa2c4418394e5dca3d28f00', class: "label" }, h("slot", { key: 'b28cd31ec212453b5548759a5b882c64b9b04b9d', name: "label" }), h("duet-icon", { key: 'f53de55018fb41696fd32f55b6a365bcb8c4fae9', class: "caret", name: "action-arrow-down-small", margin: "none", size: "xx-small", color: "secondary" }))), h("div", { key: '5fe02a87f042543eeb9c978ca3aedb2e973547f8', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
                 items: true,
                 hidden: !this.open,
                 "duet-theme-turva": this.theme === "turva",
-            } }, h("slot", { key: '206ff67b3dab6d9e5b35814a26e572bca137b925' })))));
+            } }, h("slot", { key: '277a15c1a43715a4562f4e99e644972ade293982' })))));
     }
     static get is() { return "duet-slideout-panel-dropdown"; }
     static get encapsulation() { return "shadow"; }

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

@@ -23,7 +23,7 @@ export class DuetSpacer {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: '7fc6e73749913f00710655bd9f3245417e7ea2d4', class: {
+        return (h(Host, { key: 'c528bde6cb4834c7b89630a87a1d9add5438473b', class: {
                 "duet-spacer": true,
                 "duet-spacer-xx-small": this.breakpoint === "xx-small",
                 "duet-spacer-x-small": this.breakpoint === "x-small",