@duetds/components 10.2.3 → 10.3.0

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

@@ -185,9 +185,6 @@ duet-tooltip,
   font-weight: 400;
   line-height: 1.25;
 }
-.duet-theme-turva .duet-select-wrapper {
-  font-family: "turva-sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
-}
 .duet-select-variation-tiny .duet-select-wrapper {
   width: 81px;
   padding: 0 !important;
@@ -214,21 +211,15 @@ duet-tooltip,
   border: 0;
   opacity: 0;
 }
-.duet-theme-turva .duet-select-wrapper select {
-  font-family: "turva-sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
-}
 .duet-select-wrapper select:hover + .duet-select {
   outline: 2px solid;
   outline-color: rgb(98, 121, 138);
   outline-offset: -1px;
   border-color: rgb(127, 150, 165);
 }
-.duet-theme-turva .duet-select-wrapper select:hover + .duet-select, .duet-select-wrapper select:hover + .duet-select.duet-theme-turva, .duet-theme-turva2 .duet-select-wrapper select:hover + .duet-select, .duet-select-wrapper select:hover + .duet-select.duet-theme-turva2 {
+.duet-theme-turva .duet-select-wrapper select:hover + .duet-select, .duet-select-wrapper select:hover + .duet-select.duet-theme-turva, .duet-theme-turva .duet-select-wrapper select:hover + .duet-select, .duet-select-wrapper select:hover + .duet-select.duet-theme-turva {
   outline-color: rgb(120, 145, 164);
 }
-.duet-theme-turva .duet-select-wrapper select:hover + .duet-select {
-  border-color: rgb(143, 147, 158);
-}
 .has-error .duet-select-wrapper select:hover + .duet-select {
   outline: 1px solid;
   outline-color: rgb(214, 28, 82);
@@ -241,15 +232,9 @@ duet-tooltip,
   border-color: rgb(0, 119, 179);
   transition: none;
 }
-.duet-theme-turva .duet-select-wrapper select:focus + .duet-select, .duet-select-wrapper select:focus + .duet-select.duet-theme-turva, .duet-theme-turva2 .duet-select-wrapper select:focus + .duet-select, .duet-select-wrapper select:focus + .duet-select.duet-theme-turva2 {
+.duet-theme-turva .duet-select-wrapper select:focus + .duet-select, .duet-select-wrapper select:focus + .duet-select.duet-theme-turva, .duet-theme-turva .duet-select-wrapper select:focus + .duet-select, .duet-select-wrapper select:focus + .duet-select.duet-theme-turva {
   outline-color: rgba(53, 79, 101, 0.8);
 }
-.duet-theme-turva .duet-select-wrapper select:focus + .duet-select {
-  border-color: rgb(23, 28, 58);
-}
-.duet-theme-turva .duet-select-wrapper select:focus + .duet-select .duet-select-icon {
-  color: rgb(23, 28, 58);
-}
 .duet-select-wrapper select:focus + .duet-select .duet-select-icon {
   color: rgb(0, 119, 179);
 }
@@ -270,12 +255,6 @@ duet-tooltip,
   opacity: 1 !important;
   -webkit-text-fill-color: rgb(8, 42, 77) !important;
 }
-.duet-theme-turva .duet-select-wrapper select[disabled] + .duet-select {
-  color: rgb(23, 28, 58) !important;
-  background: rgb(245, 247, 250) !important;
-  border-color: rgb(245, 247, 250) !important;
-  -webkit-text-fill-color: rgb(23, 28, 58) !important;
-}
 .duet-select-wrapper span.duet-keep-container-height {
   opacity: 0;
 }
@@ -316,17 +295,6 @@ duet-tooltip,
 .has-error .duet-select .duet-select-icon {
   color: rgb(214, 28, 82) !important;
 }
-.duet-theme-turva.has-error .duet-select {
-  border-color: rgb(214, 28, 82) !important;
-}
-.duet-theme-turva.has-error .duet-select .duet-select-icon {
-  color: rgb(214, 28, 82) !important;
-}
-.duet-theme-turva .duet-select {
-  font-family: "turva-sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
-  color: rgb(23, 28, 58);
-  border-color: rgb(143, 147, 158);
-}
 .duet-select svg {
   position: absolute;
   top: 50%;
@@ -338,9 +306,6 @@ duet-tooltip,
   pointer-events: none;
   transform: translateY(-50%);
 }
-.duet-theme-turva .duet-select svg {
-  color: rgb(23, 28, 58);
-}
 .duet-select-variation-tiny .duet-select, .duet-select-variation-compact .duet-select {
   width: 72px;
   min-width: inherit;
@@ -376,16 +341,9 @@ duet-tooltip,
   display: block;
   margin-top: 8px;
 }
-.duet-theme-turva .duet-select-help {
-  font-family: "turva-sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
-  color: rgb(143, 147, 158);
-}
 .has-error .duet-select-help {
   color: rgb(214, 28, 82);
 }
-.duet-theme-turva.has-error .duet-select-help {
-  color: rgb(214, 28, 82);
-}
 
 .duet-label-hidden .duet-internal-label {
   position: absolute;
@@ -398,25 +356,47 @@ duet-tooltip,
   clip: rect(0 0 0 0);
 }
 
-:host(.duet-theme-turva2) .duet-theme-turva .duet-select-wrapper select:hover + .duet-select {
+.duet-theme-turva .duet-select-wrapper {
+  font-family: "turva-sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+}
+
+.duet-theme-turva .duet-select-wrapper select:hover + .duet-select {
   border-color: rgb(120, 145, 164);
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-select-wrapper select:focus + .duet-select {
+.duet-theme-turva .duet-select-wrapper select:focus + .duet-select {
   border-color: rgb(23, 42, 59);
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-select-wrapper select:focus + .duet-select .duet-select-icon {
+.duet-theme-turva .duet-select-wrapper select:focus + .duet-select .duet-select-icon {
   color: rgb(23, 42, 59);
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-select-wrapper select[disabled] + .duet-select {
+.duet-theme-turva .duet-select-wrapper select[disabled] + .duet-select {
   color: rgb(23, 42, 59) !important;
   background: rgb(245, 246, 247) !important;
   border-color: rgb(245, 246, 247) !important;
   -webkit-text-fill-color: rgb(23, 42, 59) !important;
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-select {
+
+.duet-theme-turva.has-error .duet-select {
+  border-color: rgb(214, 28, 82) !important;
+}
+.duet-theme-turva.has-error .duet-select .duet-select-icon {
+  color: rgb(214, 28, 82) !important;
+}
+
+.duet-theme-turva .duet-select {
+  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);
   border-color: rgb(120, 145, 164);
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-select svg {
+.duet-theme-turva .duet-select svg {
   color: rgb(23, 42, 59);
+}
+
+.duet-theme-turva .duet-select-help {
+  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(120, 145, 164);
+}
+
+.duet-theme-turva.has-error .duet-select-help {
+  color: rgb(214, 28, 82);
 }

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, 28, 58);
-}
 .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-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, .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, 28, 58);
-}
-
-:host(.duet-theme-turva2) .duet-show-more.duet-theme-turva {
   color: rgb(23, 42, 59);
 }

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, 28, 58);
-}
-@media (min-width: 62em) {
-  .duet-slideout.duet-theme-turva .desktop-bg {
-    background: rgb(23, 28, 58);
-  }
-}
 .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, .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;
 }
-.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, 28, 58);
-}
-.duet-slideout.duet-theme-turva button.active {
-  color: rgb(198, 12, 48);
-}
-.duet-slideout.duet-theme-turva button.active::after {
-  background: rgb(198, 12, 48);
-}
-.duet-slideout.duet-theme-turva .has-sticky-header-slot .sticky-header {
-  border-bottom: 1px solid rgb(222, 224, 228);
-}
 
 slot {
   color: rgb(8, 42, 77);
 }
-.duet-theme-turva slot {
-  color: rgb(23, 28, 58);
-}
 
-:host(.duet-theme-turva2) .duet-slideout.duet-theme-turva {
+.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) {
-  :host(.duet-theme-turva2) .duet-slideout.duet-theme-turva .desktop-bg {
+  .duet-slideout.duet-theme-turva .desktop-bg {
     background: rgb(23, 42, 59);
   }
 }
-:host(.duet-theme-turva2) .duet-slideout.duet-theme-turva button {
+
+.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);
 }
-:host(.duet-theme-turva2) .duet-slideout.duet-theme-turva button.active {
+
+.duet-slideout.duet-theme-turva button.active {
   color: rgb(230, 23, 64);
 }
-:host(.duet-theme-turva2) .duet-slideout.duet-theme-turva button.active::after {
+
+.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 {
+
+.duet-slideout.duet-theme-turva .has-sticky-header-slot .sticky-header {
   border-bottom-color: rgb(212, 221, 226);
 }
-:host(.duet-theme-turva2) slot {
+
+.duet-theme-turva slot {
   color: rgb(23, 42, 59);
 }

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

@@ -63,12 +63,7 @@ export class DuetSlideout {
                 addClickListener = false;
             }
             else {
-                if (typeof this.opener === "string") {
-                    element = typeof this.opener === "string" ? document.getElementById(this.opener) : undefined;
-                }
-                else {
-                    element = this.opener;
-                }
+                element = typeof this.controller === "string" ? document.getElementById(this.controller) : this.controller;
                 if (element && this.openButton === element) {
                     return;
                 }
@@ -163,7 +158,12 @@ export class DuetSlideout {
         if (this.mutationObserver) {
             this.mutationObserver.observe(this.element, { childList: true, attributeFilter: ["open"], subtree: true });
         }
-        this.setOpenButton();
+        if (this.opener && typeof this.opener !== "string") {
+            this.setOpenButton(this.opener);
+        }
+        else {
+            this.setOpenButton();
+        }
     }
     disconnectedCallback() {
         disconnectLanguageChangeObserver(this);
@@ -294,17 +294,17 @@ export class DuetSlideout {
         };
         const topLevelOpenMenuBarTranslation = getLocaleString(this.topLevelOpenMenuBarLangObject);
         const exitTranslation = getLocaleString(this.exitLangObject);
-        return (h(Host, { key: 'caa2d4aaf502159fc88254ad81019fdc23d03077' }, h("div", { key: 'd8608bf34db74e3ac3e652024f689db40af9284d', class: { "duet-slideout": true, "duet-theme-turva": this.theme === "turva" } }, this.modal && h("duet-overlay", { key: '10f8e7f301624b2fcad5ce710cd75e6febcba1bd', visible: this.open, zIndex: "600" }), h("div", { key: '5e841060cbb940a91266cb5e42d12a16bda8097b', 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: '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: {
                 dialog: true,
                 hidden: !this.open,
                 modal: this.modal,
-            }, style: styles }, h(FocusGuard, { key: '72270e11e6c5fcbb6f8c55456975c88adb9ba213', moveFocusTo: this.closeButton }), h("div", { key: 'f88bb02a237361ab0bde75663eb99b659c1c6471', class: { "top-container": true, "has-sticky-header-slot": this.hasStickyHeaderSlot } }, h("div", { key: 'ad57422ab4f6f14528a487c4a7bf98568fa2ca35', class: "top" }, h("button", { key: '23ff1871ebc24e6ee03e3bbeb4593c2099b545d6', 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: '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: {
                 "slideout-close": true,
                 active: this.open,
                 "duet-theme-turva": this.theme === "turva",
-            }, onClick: this.onClick, inert: this.openPanel }, h("duet-icon", { key: '15cfafb84a258a1005eac6d28f49b838b7c1ed9f', name: "navigation-close", size: "small", margin: "none", color: "secondary" }))), h("div", { key: '32b724d54613edd0646672ed0fc79c1ae414f4c1', class: "sticky-header" }, h("slot", { key: 'e6750058c55d427d89eeecb7c99a0327ad3c72c2', name: "sticky-header" }))), h("div", { key: 'ed3a11356f224d5d0305f13ed63db838d7ca6e00', id: "slot-container", role: this.accessibleRole, "aria-label": this.openPanel ? topLevelOpenMenuBarTranslation : null, class: {
+            }, 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: {
                 items: true,
-            } }, h("slot", { key: '3255a6c639d8c8c13044f72cd55fa3132ea99545' })), h(FocusGuard, { key: '461421f76f88fd46a741033acb090e753aef8f1c', moveFocusTo: this.closeButton })))));
+            } }, h("slot", { key: '9981a5f609c93d9b666edc3d8f13cbacbf78becc' })), h(FocusGuard, { key: 'a18fb90c02f65dde3dc192f77c5b7460e626f641', 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

@@ -51,9 +51,5 @@
 }
 
 .duet-theme-turva ::slotted(:not(:last-child))::after {
-  background: rgb(23, 28, 58);
-}
-
-:host(.duet-theme-turva2) .duet-theme-turva ::slotted(:not(:last-child))::after {
   background: rgb(23, 42, 59);
 }

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, .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(198, 12, 48);
-}
 .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(113, 118, 132);
-}
 
-: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-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, .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,11 @@
   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 .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-theme-turva .duet-slideout-panel .top .close:focus,
+.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 +208,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, 28, 58);
-}
-.duet-slideout-panel.duet-theme-turva .link.active .label-text::after {
-  background: rgb(198, 12, 48);
-}
-.duet-slideout-panel.duet-theme-turva .has-sticky-header-slot .top {
-  background: rgb(245, 247, 250);
-}
-.duet-slideout-panel.duet-theme-turva .has-sticky-header-slot .sticky-header {
-  background: rgb(245, 247, 250);
-  border-bottom: 1px solid rgb(222, 224, 228);
-}
-.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, 28, 58);
-}
 
 slot:not([name=label]) {
   --active-height: 1px;
@@ -234,26 +216,30 @@ slot:not([name=label]) {
   font-weight: 600;
   color: rgb(8, 42, 77);
 }
-.duet-theme-turva slot:not([name=label]) {
-  color: rgb(23, 28, 58);
-}
 
-: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-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, .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, 28, 58);
-}
-.duet-slideout-panel-dropdown.duet-theme-turva button.active .label::after {
-  background: rgb(198, 12, 48);
-}
 
 slot {
   --active-height: 1px;
@@ -127,21 +120,21 @@ slot {
   font-weight: 400;
   color: rgb(8, 42, 77);
 }
-.duet-theme-turva slot {
-  color: rgb(23, 28, 58);
-}
 
 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-spinner/duet-spinner.css

@@ -44,9 +44,6 @@
   transform-origin: 0% 0%;
   animation: duetRotate 0.6s linear infinite;
 }
-.duet-spinner.duet-theme-turva {
-  color: rgb(198, 12, 48);
-}
 .duet-spinner::after {
   position: absolute;
   top: 50%;
@@ -88,6 +85,6 @@
     transform: translateZ(0) rotate(360deg) translateX(-50%) translateY(-50%);
   }
 }
-:host(.duet-theme-turva2) .duet-theme-turva.duet-spinner {
+.duet-theme-turva.duet-spinner {
   color: rgb(230, 23, 64);
 }

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

@@ -31,10 +31,6 @@
   background: rgb(255, 255, 255);
   box-shadow: 0 2px 6px 0 rgba(0, 41, 77, 0.07), 0 -1px 0 0 rgba(0, 0, 0, 0.09), -1px 0 0 0 rgba(0, 0, 0, 0.07), 1px 0 0 0 rgba(0, 0, 0, 0.07), 0 1px 0 0 rgba(0, 0, 0, 0.07);
 }
-.duet-step.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";
-  box-shadow: 0 2px 6px 0 rgba(117, 117, 117, 0.13), 0 -1px 0 0 rgba(0, 0, 0, 0.09), -1px 0 0 0 rgba(0, 0, 0, 0.07), 1px 0 0 0 rgba(0, 0, 0, 0.07), 0 1px 0 0 rgba(0, 0, 0, 0.07);
-}
 .duet-step.rounded-top {
   border-top-left-radius: 4px;
   border-top-right-radius: 4px;
@@ -71,7 +67,7 @@
   outline-offset: 2px;
   outline-color: rgba(0, 119, 179, 0.8);
 }
-.duet-theme-turva :host(.user-is-tabbing) .duet-step-heading:focus, :host(.user-is-tabbing) .duet-step-heading:focus.duet-theme-turva, .duet-theme-turva2 :host(.user-is-tabbing) .duet-step-heading:focus, :host(.user-is-tabbing) .duet-step-heading:focus.duet-theme-turva2 {
+.duet-theme-turva :host(.user-is-tabbing) .duet-step-heading:focus, :host(.user-is-tabbing) .duet-step-heading:focus.duet-theme-turva, .duet-theme-turva :host(.user-is-tabbing) .duet-step-heading:focus, :host(.user-is-tabbing) .duet-step-heading:focus.duet-theme-turva {
   outline-color: rgba(53, 79, 101, 0.8);
 }
 .duet-step-heading[aria-disabled=false] {
@@ -83,9 +79,6 @@
 .is-complete .duet-step-heading:hover .duet-step-counter, .is-disabled .duet-step-heading:hover .duet-step-counter {
   background-color: #005f8f;
 }
-.duet-theme-turva.is-complete .duet-step-heading:hover .duet-step-counter, .duet-theme-turva.is-disabled .duet-step-heading:hover .duet-step-counter {
-  background-color: #9e0a26;
-}
 .is-current .duet-step-heading {
   margin-bottom: 20px;
 }
@@ -126,15 +119,9 @@
 .is-complete .duet-step-counter, .is-current .duet-step-counter, .is-disabled .duet-step-counter {
   background-color: rgb(0, 119, 179);
 }
-.duet-theme-turva.is-complete .duet-step-counter, .duet-theme-turva.is-current .duet-step-counter, .duet-theme-turva.is-disabled .duet-step-counter {
-  background-color: rgb(198, 12, 48);
-}
 .is-incomplete .duet-step-counter {
   background-color: rgb(98, 121, 138);
 }
-.duet-theme-turva.is-incomplete .duet-step-counter {
-  background-color: rgb(143, 147, 158);
-}
 
 .duet-step-icon {
   display: flex;
@@ -167,9 +154,6 @@
     margin-left: 19px;
     border-left: 2px solid rgb(212, 223, 229);
   }
-  .duet-theme-turva .duet-step-content-wrapper {
-    border-color: rgb(222, 224, 228);
-  }
   :host(:last-of-type) .duet-step-content-wrapper {
     min-height: 0;
     border: transparent;
@@ -199,15 +183,26 @@
   }
 }
 
-:host(.duet-theme-turva2) .duet-theme-turva.is-complete .duet-step-counter,
-:host(.duet-theme-turva2) .duet-theme-turva.is-current .duet-step-counter,
-:host(.duet-theme-turva2) .duet-theme-turva.is-disabled .duet-step-counter {
+.duet-theme-turva.duet-step {
+  font-family: "turva-sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  box-shadow: 0 2px 6px 0 rgba(117, 117, 117, 0.13), 0 -1px 0 0 rgba(0, 0, 0, 0.09), -1px 0 0 0 rgba(0, 0, 0, 0.07), 1px 0 0 0 rgba(0, 0, 0, 0.07), 0 1px 0 0 rgba(0, 0, 0, 0.07);
+}
+
+.duet-theme-turva.is-complete .duet-step-counter,
+.duet-theme-turva.is-current .duet-step-counter,
+.duet-theme-turva.is-disabled .duet-step-counter {
   background-color: rgb(230, 23, 64);
 }
-:host(.duet-theme-turva2) .duet-theme-turva.is-complete .duet-step-heading:hover .duet-step-counter,
-:host(.duet-theme-turva2) .duet-theme-turva.is-disabled .duet-step-heading:hover .duet-step-counter {
+
+.duet-theme-turva.is-complete .duet-step-heading:hover .duet-step-counter,
+.duet-theme-turva.is-disabled .duet-step-heading:hover .duet-step-counter {
   background-color: #b81233;
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-step-content-wrapper {
+
+.duet-theme-turva.is-incomplete .duet-step-counter {
+  background-color: rgb(120, 145, 164);
+}
+
+.duet-theme-turva .duet-step-content-wrapper {
   border-color: rgb(251, 225, 209);
 }