@duetds/components 10.2.4 → 10.3.1

package/lib/collection/components/duet-cookie-consent/duet-cookie-consent.css

@@ -48,7 +48,7 @@
   outline-color: rgba(0, 119, 179, 0.8);
   border-radius: 4px;
 }
-.duet-theme-turva :host(.user-is-tabbing:not(.descendant-focused):focus), :host(.user-is-tabbing:not(.descendant-focused):focus).duet-theme-turva, .duet-theme-turva2 :host(.user-is-tabbing:not(.descendant-focused):focus), :host(.user-is-tabbing:not(.descendant-focused):focus).duet-theme-turva2 {
+.duet-theme-turva :host(.user-is-tabbing:not(.descendant-focused):focus), :host(.user-is-tabbing:not(.descendant-focused):focus).duet-theme-turva {
   outline-color: rgba(53, 79, 101, 0.8);
 }
 
@@ -66,15 +66,6 @@
     backdrop-filter: blur(4px);
   }
 }
-.duet-cookie-consent.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";
-  background-color: rgba(12, 21, 30, 0.9);
-}
-@supports (-webkit-backdrop-filter: none) or (backdrop-filter: none) {
-  .duet-cookie-consent.duet-theme-turva {
-    background: rgba(12, 21, 30, 0.8);
-  }
-}
 @media (min-width: 48em) {
   .duet-cookie-consent {
     padding: 20px;
@@ -110,15 +101,16 @@
   outline-offset: 2px;
   outline-color: rgba(0, 119, 179, 0.8);
 }
-.duet-theme-turva ::slotted(a:focus), ::slotted(a:focus).duet-theme-turva, .duet-theme-turva2 ::slotted(a:focus), ::slotted(a:focus).duet-theme-turva2 {
+.duet-theme-turva ::slotted(a:focus), ::slotted(a:focus).duet-theme-turva {
   outline-color: rgba(53, 79, 101, 0.8);
 }
 
-:host(.duet-theme-turva2) .duet-cookie-consent.duet-theme-turva {
+.duet-cookie-consent.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";
   background-color: rgba(12, 21, 30, 0.9);
 }
 @supports (-webkit-backdrop-filter: none) or (backdrop-filter: none) {
-  :host(.duet-theme-turva2) .duet-cookie-consent.duet-theme-turva {
+  .duet-cookie-consent.duet-theme-turva {
     background: rgba(12, 21, 30, 0.8);
   }
 }

package/lib/collection/components/duet-cookie-consent/duet-cookie-consent.js

@@ -46,7 +46,7 @@ export class DuetCookieConsent {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: 'a0945b87dc3ca428ebb77b5bafc937d26fe77b58', tabindex: "-1", class: { "duet-theme-turva": this.theme === "turva" } }, h("div", { key: 'e4870573df557f7b4d7a6075afbd04fc23f54ff1', class: { "duet-cookie-consent": true, "duet-theme-turva": this.theme === "turva" } }, h("div", { key: 'd0f1b43a014ccc35c9845c8c4117a8552eee8209', class: "duet-cookie-consent-content" }, h("div", { key: '98d8e55937ee5afda2a8d975ebb0d4e5aefc0014', class: "expand" }, h("slot", { key: '5529c9819da700b849bbf3e0f4b4c93cf4da6015' })), h("duet-spacer", { key: '82e710ce0de7d91f931cbb2177d6470f77701ec4', size: "large", direction: "horizontal" }), h("div", { key: '9cbf5dd3a7d82025a0912ca016b67e1b0f0022fc' }, h("duet-button", { key: '50a246e22443b54c881d40063c0405f07d7190dc', variation: "negative", size: "small", onClick: this.handleClick, margin: "none", "aria-label": this.accessibleLabel, theme: this.theme }, "OK"))))));
+        return (h(Host, { key: 'e79333a51d76cf03ac4fdaee8e2795e98d79319d', tabindex: "-1", class: { "duet-theme-turva": this.theme === "turva" } }, h("div", { key: 'befef096fcaaf1b57daa84ff54cbe665e84f3a86', class: { "duet-cookie-consent": true, "duet-theme-turva": this.theme === "turva" } }, h("div", { key: '78b54949afed67ada604c2ce9dea9c2fcb87a39f', class: "duet-cookie-consent-content" }, h("div", { key: '84a2a875986036aad4ba0b68fa2f902cf1148b01', class: "expand" }, h("slot", { key: 'd6402515233aaa20e4c1a3ff9b59647c674fe03d' })), h("duet-spacer", { key: 'aa7b8ad14f32db64dd72219593c7217567920556', size: "large", direction: "horizontal" }), h("div", { key: '9e7c71566df83cc4e3b6224b2fcf623e81a80db2' }, h("duet-button", { key: '5dc91aa2ae5b05394f1dce473b831d490d62eeae', variation: "negative", size: "small", onClick: this.handleClick, margin: "none", "aria-label": this.accessibleLabel, theme: this.theme }, "OK"))))));
     }
     static get is() { return "duet-cookie-consent"; }
     static get encapsulation() { return "shadow"; }

package/lib/collection/components/duet-date-picker/date-utils.js

@@ -25,13 +25,14 @@ function createDate(year, month, day) {
         }
         return date;
     }
+    return undefined;
 }
 /**
  * @param value date string in format dd.mm.yyyy
  */
 export function parseDate(value) {
     if (!value) {
-        return;
+        return undefined;
     }
     const matches = value.match(DATE_FORMAT);
     if (matches) {

package/lib/collection/components/duet-date-picker/duet-date-picker.css

@@ -158,11 +158,6 @@
   border-radius: 0 4px 4px 0;
   transition: box-shadow 150ms ease, border 150ms ease !important;
 }
-.duet-theme-turva .duet-date-button {
-  color: rgb(23, 42, 59);
-  border-color: rgb(120, 145, 164);
-  border-left-color: rgb(178, 194, 205);
-}
 .duet-date-button::before {
   position: absolute;
   top: 0;
@@ -174,11 +169,11 @@
 }
 .duet-date-button:hover:not(:disabled) {
   outline: 2px solid;
-  outline-color: rgb(98, 121, 138);
+  outline-color: rgb(127, 150, 165) !important;
   outline-offset: -1px;
 }
-.duet-theme-turva .duet-date-button:hover:not(:disabled), .duet-date-button:hover:not(:disabled).duet-theme-turva, .duet-theme-turva2 .duet-date-button:hover:not(:disabled), .duet-date-button:hover:not(:disabled).duet-theme-turva2 {
-  outline-color: rgb(120, 145, 164);
+.duet-theme-turva .duet-date-button:hover:not(:disabled), .duet-date-button:hover:not(:disabled).duet-theme-turva {
+  outline-color: rgb(120, 145, 164) !important;
 }
 .duet-date-button:disabled {
   pointer-events: none;
@@ -186,9 +181,6 @@
   background: rgb(245, 248, 250) !important;
   border: 0 !important;
 }
-.duet-theme-turva .duet-date-button:disabled {
-  background: rgb(245, 246, 247) !important;
-}
 .duet-date-button:disabled::before {
   display: none;
 }
@@ -210,14 +202,11 @@
   outline-offset: 2px;
   outline-color: rgba(0, 119, 179, 0.8);
 }
-.duet-theme-turva .duet-date-input-has-focus .duet-date-button:focus, .duet-date-input-has-focus .duet-date-button:focus.duet-theme-turva, .duet-theme-turva2 .duet-date-input-has-focus .duet-date-button:focus, .duet-date-input-has-focus .duet-date-button:focus.duet-theme-turva2, .duet-theme-turva .duet-date-button:focus:focus, .duet-date-button:focus:focus.duet-theme-turva, .duet-theme-turva2 .duet-date-button:focus:focus, .duet-date-button:focus:focus.duet-theme-turva2 {
+.duet-theme-turva .duet-date-input-has-focus .duet-date-button:focus, .duet-date-input-has-focus .duet-date-button:focus.duet-theme-turva, .duet-theme-turva .duet-date-button:focus:focus, .duet-date-button:focus:focus.duet-theme-turva {
   outline: 2px solid;
   outline-offset: 2px;
   outline-color: rgba(53, 79, 101, 0.8);
 }
-.duet-theme-turva.duet-date-input-has-focus .duet-date-button, .duet-theme-turva .duet-date-button:focus {
-  color: rgb(23, 42, 59);
-}
 
 .input-error {
   border-top-color: rgb(214, 28, 82);
@@ -284,9 +273,6 @@
   box-shadow: 0 4px 10px 0 rgba(0, 41, 77, 0.15);
   transform: none;
 }
-.duet-theme-turva .duet-date-dialog-wrapper {
-  border-color: rgb(212, 221, 226);
-}
 @media (max-width: 35.9375em) {
   .duet-date-dialog-wrapper {
     position: absolute;
@@ -325,10 +311,6 @@
   border-spacing: 0;
   border-collapse: collapse;
 }
-.duet-date-table.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-date-table th {
   padding-bottom: 8px;
   font-size: 0.75rem;
@@ -367,36 +349,20 @@
   border-radius: 50% !important;
   transition: initial !important;
 }
-.duet-theme-turva .duet-date-table-button {
-  font-family: "turva-sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol" !important;
-  color: rgb(23, 42, 59) !important;
-}
 .duet-date-table-button:hover {
   background: rgb(228, 241, 247) !important;
 }
-.duet-theme-turva .duet-date-table-button:hover {
-  background: rgb(255, 236, 236) !important;
-}
 .duet-date-table-button.today {
   z-index: 200;
   color: rgb(0, 75, 129) !important;
   background: rgb(240, 247, 250) !important;
   box-shadow: 0 0 0 1px #0077b3 !important;
 }
-.duet-theme-turva .duet-date-table-button.today {
-  color: rgb(140, 0, 30) !important;
-  background: rgb(255, 242, 242) !important;
-  box-shadow: 0 0 0 1px #171c3a !important;
-}
 .selected .duet-date-table-button, :focus .duet-date-table-button {
   color: rgb(255, 255, 255) !important;
   outline: 0;
   background: rgb(0, 119, 179) !important;
 }
-.duet-theme-turva .selected .duet-date-table-button, .duet-theme-turva :focus .duet-date-table-button {
-  color: rgb(255, 255, 255) !important;
-  background: rgb(230, 23, 64) !important;
-}
 .duet-date-table-button:active {
   outline: 2px solid;
   outline-offset: 2px;
@@ -405,20 +371,16 @@
   color: rgb(255, 255, 255) !important;
   background: rgb(0, 119, 179) !important;
 }
-.duet-theme-turva .duet-date-table-button:active, .duet-date-table-button:active.duet-theme-turva, .duet-theme-turva2 .duet-date-table-button:active, .duet-date-table-button:active.duet-theme-turva2 {
+.duet-theme-turva .duet-date-table-button:active, .duet-date-table-button:active.duet-theme-turva {
   outline-color: rgba(53, 79, 101, 0.8);
 }
-.duet-theme-turva .duet-date-table-button:active {
-  color: rgb(255, 255, 255) !important;
-  background: rgb(230, 23, 64) !important;
-}
 :focus .duet-date-table-button {
   outline: 2px solid;
   outline-offset: 2px;
   outline-color: rgba(0, 119, 179, 0.8);
   z-index: 200;
 }
-.duet-theme-turva :focus .duet-date-table-button, :focus .duet-date-table-button.duet-theme-turva, .duet-theme-turva2 :focus .duet-date-table-button, :focus .duet-date-table-button.duet-theme-turva2 {
+.duet-theme-turva :focus .duet-date-table-button, :focus .duet-date-table-button.duet-theme-turva {
   outline-color: rgba(53, 79, 101, 0.8);
 }
 .duet-date-table-button.disabled {
@@ -427,11 +389,6 @@
   outline: none !important;
   background: transparent !important;
 }
-.duet-theme-turva .duet-date-table-button.disabled {
-  color: rgb(120, 145, 164) !important;
-  outline: none !important;
-  background: transparent !important;
-}
 .duet-date-table-button.outside {
   color: rgb(127, 150, 165) !important;
   pointer-events: none;
@@ -440,11 +397,6 @@
   background: rgb(245, 248, 250) !important;
   opacity: 0.75;
 }
-.duet-theme-turva .duet-date-table-button.outside {
-  color: rgb(120, 145, 164);
-  outline: none;
-  background: rgb(245, 246, 247);
-}
 
 .duet-date-dialog-header {
   margin-bottom: 16px !important;
@@ -481,10 +433,6 @@
   pointer-events: none;
   border-radius: 4px;
 }
-.duet-theme-turva .duet-date-dialog-select .duet-date-dialog-select-label {
-  font-family: "turva-sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
-  color: rgb(23, 42, 59);
-}
 .duet-date-dialog-select span {
   margin-right: 4px;
 }
@@ -504,7 +452,7 @@
   outline-offset: 2px;
   outline-color: rgba(0, 119, 179, 0.8);
 }
-.duet-theme-turva .duet-date-dialog-select select:focus + .duet-date-dialog-select-label, .duet-date-dialog-select select:focus + .duet-date-dialog-select-label.duet-theme-turva, .duet-theme-turva2 .duet-date-dialog-select select:focus + .duet-date-dialog-select-label, .duet-date-dialog-select select:focus + .duet-date-dialog-select-label.duet-theme-turva2 {
+.duet-theme-turva .duet-date-dialog-select select:focus + .duet-date-dialog-select-label, .duet-date-dialog-select select:focus + .duet-date-dialog-select-label.duet-theme-turva {
   outline-color: rgba(53, 79, 101, 0.8);
 }
 
@@ -534,9 +482,6 @@
     border: 0;
   }
 }
-.duet-theme-turva .duet-date-dialog-mobile-header {
-  border-color: rgb(178, 194, 205);
-}
 .duet-date-dialog-mobile-header label {
   display: inline-block;
   max-width: 84%;
@@ -569,21 +514,15 @@
     opacity: 0;
   }
 }
-.duet-theme-turva .duet-date-picker-close {
-  background: rgb(245, 246, 247) !important;
-}
 .duet-date-picker-close:hover {
   background: rgb(245, 248, 250) !important;
 }
-.duet-theme-turva .duet-date-picker-close:hover {
-  background: rgb(245, 246, 247) !important;
-}
 .duet-date-picker-close:focus {
   outline: 2px solid;
   outline-offset: 2px;
   outline-color: rgba(0, 119, 179, 0.8);
 }
-.duet-theme-turva .duet-date-picker-close:focus, .duet-date-picker-close:focus.duet-theme-turva, .duet-theme-turva2 .duet-date-picker-close:focus, .duet-date-picker-close:focus.duet-theme-turva2 {
+.duet-theme-turva .duet-date-picker-close:focus, .duet-date-picker-close:focus.duet-theme-turva {
   outline-color: rgba(53, 79, 101, 0.8);
 }
 @media (min-width: 36em) {
@@ -592,37 +531,74 @@
   }
 }
 
-:host(.duet-theme-turva2) .duet-theme-turva .duet-date-button {
+.duet-theme-turva .duet-date-button {
   color: rgb(23, 42, 59);
+  border-color: rgb(120, 145, 164);
+  border-left-color: rgb(178, 194, 205);
 }
-:host(.duet-theme-turva2) .duet-theme-turva.duet-date-input-has-focus :host(.duet-theme-turva2) .duet-theme-turva, :host(.duet-theme-turva2) .duet-theme-turva:focus {
+.duet-theme-turva:disabled {
+  background: rgb(245, 246, 247) !important;
+}
+.duet-theme-turva.duet-date-input-has-focus .duet-theme-turva, .duet-theme-turva:focus {
   color: rgb(23, 42, 59);
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-date-table-button {
+.duet-theme-turva .duet-date-dialog-wrapper {
+  border-color: rgb(212, 221, 226);
+}
+.duet-theme-turva .duet-date-table-button {
+  font-family: "turva-sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol" !important;
   color: rgb(23, 42, 59) !important;
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-date-table-button:hover:not(.disabled) {
+.duet-theme-turva .duet-date-table-button:hover:not(.disabled) {
   background: rgb(251, 225, 209) !important;
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-date-table-button.today {
+.duet-theme-turva .duet-date-table-button.today {
+  color: rgb(140, 0, 30) !important;
   background: rgb(253, 247, 242) !important;
+  box-shadow: 0 0 0 1px #171c3a !important;
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-date-table-button:active {
+.duet-theme-turva .duet-date-table-button:active {
   color: rgb(255, 255, 255) !important;
   background: rgb(230, 23, 64) !important;
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-date-table-button.outside {
+.duet-theme-turva .duet-date-table-button.outside {
   color: rgb(120, 145, 164) !important;
+  outline: none;
   background: rgb(245, 246, 247) !important;
 }
-:host(.duet-theme-turva2) .duet-theme-turva .duet-date-table-button.disabled {
+.duet-theme-turva .duet-date-table-button.disabled {
   color: rgb(178, 194, 205) !important;
+  outline: none !important;
+  background: transparent !important;
+}
+.duet-theme-turva .selected .duet-date-table-button,
+.duet-theme-turva :focus .duet-date-table-button {
+  color: rgb(255, 255, 255) !important;
+  background: rgb(230, 23, 64) !important;
+}
+.duet-theme-turva :active.duet-date-table-button {
+  color: rgb(255, 255, 255) !important;
+  background: rgb(230, 23, 64) !important;
+}
+.duet-theme-turva .duet-date-dialog-select .duet-date-dialog-select-label {
+  font-family: "turva-sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  color: rgb(23, 42, 59);
+}
+.duet-theme-turva .duet-date-dialog-mobile-header {
+  border-color: rgb(178, 194, 205);
 }
-:host(.duet-theme-turva2) .duet-theme-turva [aria-pressed=true] .duet-date-table-button,
-:host(.duet-theme-turva2) .duet-theme-turva :focus .duet-date-table-button {
+.duet-theme-turva .duet-date-picker-close {
+  background: rgb(245, 246, 247) !important;
+}
+.duet-theme-turva .duet-date-picker-close:hover {
+  background: rgb(245, 246, 247) !important;
+}
+.duet-theme-turva [aria-pressed=true] .duet-date-table-button,
+.duet-theme-turva :focus .duet-date-table-button {
   color: rgb(255, 255, 255) !important;
   background: rgb(230, 23, 64) !important;
 }
-:host(.duet-theme-turva2) .duet-theme-turva.duet-date-table {
+.duet-theme-turva.duet-date-table {
+  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-date-picker/duet-date-picker.js

@@ -51,7 +51,6 @@ export class DuetDatePicker {
         this.focusedDay = new Date();
         this.inputValue = "";
         this.inputHasFocus = false;
-        this.internalValidityError = "";
         /**
          * Theme of the component.
          */
@@ -179,10 +178,9 @@ export class DuetDatePicker {
         this.handleBlur = (event) => {
             event.stopPropagation();
             this.inputHasFocus = false;
-            if (!this._validity.valid) {
-                this.value = null;
+            if (!this._validity.valid && !this.disableBuiltInErrors) {
                 const errorKey = Object.entries(this._validity).find(entry => !!entry[1])[0];
-                this.internalValidityError = getLocaleString(this.dateErrorMessages[errorKey]);
+                this.error = getLocaleString(this.dateErrorMessages[errorKey]);
             }
             this.duetBlur.emit({
                 component: "duet-date-picker",
@@ -258,7 +256,6 @@ export class DuetDatePicker {
         this.handleDaySelect = (_event, day) => {
             const min = parseISODate(this.min);
             const max = parseISODate(this.max);
-            this.determineValidity(day);
             if (inRange(day, min, max)) {
                 this.setValue(day);
                 this.hide();
@@ -273,10 +270,7 @@ export class DuetDatePicker {
         this.handleInputChange = (e) => {
             this.inputValue = e.detail.value;
             const parsed = parseDate(this.inputValue);
-            this.determineValidity(parsed);
-            if (parsed || this.inputValue === "") {
-                this.setValue(parsed);
-            }
+            this.setValue(parsed);
         };
     }
     /**
@@ -285,19 +279,15 @@ export class DuetDatePicker {
      * Useful properties to inspect are badInput, valueMissing, rangeOverflow, rangeUnderflow.
      */
     get validity() {
+        this.determineValidity();
         return this._validity;
     }
-    updateValidity(newValue, _oldValue, propName) {
-        if (propName === "value" && newValue === null) {
-            return;
-        }
-        this.determineValidity(parseISODate(this.value));
-        if (this._validity.valid) {
-            this.internalValidityError = "";
-        }
+    updateValidity() {
+        this.determineValidity();
     }
     updateInternalValue() {
-        if (this.value === null) {
+        // don't clear input when user has focus there
+        if (!this.value && this.inputHasFocus) {
             return;
         }
         const parsedValue = parseISODate(this.value);
@@ -316,7 +306,7 @@ export class DuetDatePicker {
      */
     componentWillLoad() {
         inheritGlobalTheme(this);
-        this.determineValidity(parseISODate(this.value));
+        this.determineValidity();
         this.updateInternalValue();
         checkNamedSlotElement(this.element, "tooltip", "duet-tooltip", 1, true);
     }
@@ -403,13 +393,14 @@ export class DuetDatePicker {
     setFocusedDay(day) {
         this.focusedDay = clamp(day, parseISODate(this.min), parseISODate(this.max));
     }
-    determineValidity(date) {
+    determineValidity() {
         var _a, _b;
+        const valueAsDate = parseISODate(this.value);
         const inputValue = (_b = (_a = this.datePickerInput) === null || _a === void 0 ? void 0 : _a.value) !== null && _b !== void 0 ? _b : "";
-        const badInput = inputValue !== "" && date == null;
-        const valueMissing = this.required && date == null;
-        const rangeOverflow = date ? !inRange(date, null, parseISODate(this.max)) : false;
-        const rangeUnderflow = date ? !inRange(date, parseISODate(this.min)) : false;
+        const badInput = !valueAsDate && inputValue !== "";
+        const valueMissing = !valueAsDate && this.required;
+        const rangeOverflow = valueAsDate ? !inRange(valueAsDate, null, parseISODate(this.max)) : false;
+        const rangeUnderflow = valueAsDate ? !inRange(valueAsDate, parseISODate(this.min)) : false;
         this._validity = {
             patternMismatch: false,
             customError: false,
@@ -423,6 +414,9 @@ export class DuetDatePicker {
             valueMissing,
             valid: !(valueMissing || badInput || rangeUnderflow || rangeOverflow),
         };
+        if (this._validity.valid) {
+            this.error = "";
+        }
     }
     setValue(date) {
         const newValue = printISODate(date);
@@ -430,6 +424,7 @@ export class DuetDatePicker {
             return;
         }
         this.value = newValue;
+        this.determineValidity();
         this.duetChange.emit({
             component: "duet-date-picker",
             value: this.value,
@@ -480,13 +475,13 @@ export class DuetDatePicker {
         if (maxDate) {
             maxYear = Math.min(maxYear, maxDate.getFullYear());
         }
-        return (h(Host, { key: '2f9dd355a80f9ed65cc0cfa90d674f426bad4c59', class: { "duet-expand": this.expand, "duet-m-0": this.margin === "none" } }, h("div", { key: '8c023088cf474e2b460139486e85974f53963981', class: "duet-date" }, h(DatePickerInput, { key: '0c678c083138be043f01d6df1522e385a7ee122a', hasFocus: this.inputHasFocus, value: this.value, valueAsDate: valueAsDate, formattedValue: this.inputValue, language: this.language, onInput: this.handleInputChange, onBlur: this.handleBlur, onFocus: this.handleFocus, onClick: this.toggleOpen, name: this.name, disabled: this.disabled, error: this.error || (!this.disableBuiltInErrors && this.internalValidityError) || null, role: this.role, required: this.required, theme: this.theme, tooltip: this.tooltip, tooltipDirection: this.tooltipDirection, labelHidden: this.labelHidden, placeholder: this.placeholder, inputLabel: this.label, identifier: this.identifier, buttonRef: element => (this.datePickerButton = element), inputRef: element => (this.datePickerInput = element), accessibleActiveDescendant: this.accessibleActiveDescendant, accessibleControls: this.accessibleControls, accessibleOwns: this.accessibleOwns, accessibleDescribedBy: this.accessibleDescribedBy, accessibleLiveError: this.accessibleLiveError, echoPlaceholder: this.echoPlaceholder, caption: this.caption })), h("div", { key: 'efec9f5c773e36d4e418dac06036390b50bff2a5', class: {
+        return (h(Host, { key: '5ebd34bf6ba1033b890138e5523f45fecd17eaf4', class: { "duet-expand": this.expand, "duet-m-0": this.margin === "none" } }, h("div", { key: '8c4b995485be3c6b070ce738f3416db0d9683771', class: "duet-date" }, h(DatePickerInput, { key: 'c0b308099cd5c56790a1160d10a682551ce9da7e', hasFocus: this.inputHasFocus, value: this.value, valueAsDate: valueAsDate, formattedValue: this.inputValue, language: this.language, onInput: this.handleInputChange, onBlur: this.handleBlur, onFocus: this.handleFocus, onClick: this.toggleOpen, name: this.name, disabled: this.disabled, error: this.error, role: this.role, required: this.required, theme: this.theme, tooltip: this.tooltip, tooltipDirection: this.tooltipDirection, labelHidden: this.labelHidden, placeholder: this.placeholder, inputLabel: this.label, identifier: this.identifier, buttonRef: element => (this.datePickerButton = element), inputRef: element => (this.datePickerInput = element), accessibleActiveDescendant: this.accessibleActiveDescendant, accessibleControls: this.accessibleControls, accessibleOwns: this.accessibleOwns, accessibleDescribedBy: this.accessibleDescribedBy, accessibleLiveError: this.accessibleLiveError, echoPlaceholder: this.echoPlaceholder, caption: this.caption })), h("div", { key: 'cca008327d5a939054a1b2abd748b08170b19a07', class: {
                 "duet-theme-turva": this.theme === "turva",
                 "duet-date-dialog": true,
                 left: this.direction === "left",
                 error: !!this.error,
                 active: this.open,
-            }, role: "dialog", "aria-modal": "true", "aria-hidden": this.open ? "false" : "true", "aria-labelledby": this.dialogLabelId, onTouchMove: this.handleTouchMove, onTouchStart: this.handleTouchStart, onTouchEnd: this.handleTouchEnd }, h("duet-overlay", { key: '130f52a0f0194b1186619bf6426f97a68c079c11', visible: this.open, "display-device": "x-small" }), h(FocusGuard, { key: 'b4c229e9d91c822d87702677e213f8753f344017', moveFocusTo: this.focusedDayNode }), h("div", { key: '3ce07367a559781b9872669665186af5572305ca', class: "duet-date-dialog-wrapper", onKeyDown: this.handleEscKey, ref: element => (this.dialogWrapperNode = element) }, h("duet-visually-hidden", { key: '7740bce6549fc3423947947f68d7e8950baa440d', "aria-live": "polite" }, text.keyboardInstruction), h("div", { key: '2d80551888be784d8ea12b74c43df593c4701e83', class: "duet-date-dialog-mobile-header" }, h(DuetInternalLabel, { key: '27d2994191b94efe00484fbd25d96537d6ed11b2', margin: "none" }, this.label), h("button", { key: '82cf74d2d7aff047562d13320496248d352c1e82', class: "duet-date-picker-close", ref: element => (this.closeButtonNode = element), onClick: () => this.hide(), type: "button" }, h("duet-icon", { key: '92b2e5fd52e4206c00acfd56e0d515d08e4527b1', name: "navigation-close-small", margin: "none", color: "currentColor", size: "xx-small" }), h("duet-visually-hidden", { key: '738da11657cbac3ed52ef22490165f4ac76c6ea6' }, text.closeLabel))), h("div", { key: 'e8922fed8ac11149bb603c912d278c0b3843b214', class: "duet-date-dialog-header" }, h("div", { key: 'e922554dbea94dfa70e62983ee6a0b08f8e159d7', class: "duet-date-dialog-dropdowns" }, h("duet-visually-hidden", { key: '873ba9c661e3c280c88fffc510dcceab0b2d5863' }, h("h2", { key: 'c769e12a0c0c668164d25d7864a711d0f9268f09', id: this.dialogLabelId, "aria-live": "polite", "aria-atomic": "true" }, text.monthLabels[focusedMonth], " ", this.focusedDay.getFullYear())), h("duet-visually-hidden", { key: '5941e8d2cd0f5baec6001808c68cb4c51b37db86' }, h("label", { key: 'bee65da8486f65afe8d18e90b1daed308dda8864', htmlFor: this.monthSelectId }, text.monthSelectLabel)), h("div", { key: 'f9fd8b52eaa90fd555d737e2691b51260592101a', class: "duet-date-dialog-select" }, h("select", { key: '83b7003769bf0042228e2ed36ad4118e8f0f1ab2', id: this.monthSelectId, class: "duet-date-month-select", ref: element => (this.monthSelectNode = element), onChange: this.handleMonthSelect }, text.monthLabels.map((month, i) => (h("option", { key: month, value: i, selected: i === focusedMonth, disabled: !inRange(new Date(focusedYear, i, 1), minDate ? startOfMonth(minDate) : null, maxDate ? endOfMonth(maxDate) : null) }, month)))), h("div", { key: '1d9bbde4fcc96fbcaf2d714ecc34a58c755dfc7d', class: "duet-date-dialog-select-label", "aria-hidden": "true" }, h("span", { key: '3c4be7bf8fefa6ee1f5cede7eeb34ebfeaae35a1' }, text.monthLabelsShort[focusedMonth]), h("duet-icon", { key: '4eece4a65cb58ba45a30e4fd2cf179d61b05625f', name: "action-arrow-down-small", color: "currentColor", margin: "none", size: "xxx-small" }))), h("duet-visually-hidden", { key: '700e9f50a74a6113c33f149427169ae9917badc0' }, h("label", { key: 'c5f8403791830d9b0ad68ed66af8c3f1c26310e3', htmlFor: this.yearSelectId }, text.yearSelectLabel)), h("div", { key: '2c69022a45ab3effd4c907cc6d5c5a508bbb99f7', class: "duet-date-dialog-select" }, h("select", { key: 'fee0495e004775929f7b7aeb66278ac8b4fd003d', id: this.yearSelectId, class: "duet-date-year-select", onChange: this.handleYearSelect }, range(minYear, maxYear).map(year => (h("option", { key: year, selected: year === focusedYear }, year)))), h("div", { key: 'e50ff66c34ee36e965843e68e1fb3d26690ce1ed', class: "duet-date-dialog-select-label", "aria-hidden": "true" }, h("span", { key: '9808b372ac9fea0ce5c51acee5ee407d5906e3f1' }, this.focusedDay.getFullYear()), h("duet-icon", { key: '90c5c74c91d9e3df13e70987f66c2964feca8cf5', name: "action-arrow-down-small", color: "currentColor", margin: "none", size: "xxx-small" })))), h("div", { key: 'f66a8e9e9fba23a7a8c9d871f1ff0bbfa6b39b37', class: "duet-date-dialog-buttons" }, h("duet-action-button", { key: 'fe1df2d1456357c2ae731b66c302c45a33f40d06', accessibleLabel: i18n[this.language].prevMonthLabel, actionName: i18n[this.language].prevMonthLabel, class: "duet-date-dialog-prev", onClick: this.handlePreviousMonthClick, disabled: prevMonthDisabled, "icon-name": "action-arrow-left-small" }, text.prevMonthLabel), h("duet-action-button", { key: '86db10ad2c3d1ab190690ae65d4c778084194089', accessibleLabel: i18n[this.language].nextMonthLabel, actionName: i18n[this.language].nextMonthLabel, class: "duet-date-dialog-next", onClick: this.handleNextMonthClick, disabled: nextMonthDisabled, "icon-name": "action-arrow-right-small" }, text.nextMonthLabel))), h(DatePickerMonth, { key: '741527916476f5959328595373dc3e11b02b0df2', selectedDate: valueAsDate, focusedDate: this.focusedDay, onDateSelect: this.handleDaySelect, onKeyboardNavigation: this.handleKeyboardNavigation, labelledById: this.dialogLabelId, language: this.language, theme: this.theme, min: minDate, max: maxDate, focusedDayRef: element => (this.focusedDayNode = element), onFocusEnter: this.enableActiveFocus, onFocusExit: this.disableActiveFocus })), h(FocusGuard, { key: 'de920ae43a19a7ca9790056fd3a9f51a08039d4f', moveFocusTo: this.closeButtonNode }))));
+            }, role: "dialog", "aria-modal": "true", "aria-hidden": this.open ? "false" : "true", "aria-labelledby": this.dialogLabelId, onTouchMove: this.handleTouchMove, onTouchStart: this.handleTouchStart, onTouchEnd: this.handleTouchEnd }, h("duet-overlay", { key: 'fcb2d3f3fd5333529c2ebc82590a6a543112a5f4', visible: this.open, "display-device": "x-small" }), h(FocusGuard, { key: '0de38fdb796337ec9448bcff1bb652776fdf6f60', moveFocusTo: this.focusedDayNode }), h("div", { key: '9950afbc58987e498e2e6734fd6af177c65d94a8', class: "duet-date-dialog-wrapper", onKeyDown: this.handleEscKey, ref: element => (this.dialogWrapperNode = element) }, h("duet-visually-hidden", { key: '2394f33f1efd2e0626b2a1bc3642a73193798b13', "aria-live": "polite" }, text.keyboardInstruction), h("div", { key: '74b68ad35d92ab0c2616be5466ea6b8b2c1a1451', class: "duet-date-dialog-mobile-header" }, h(DuetInternalLabel, { key: '7385d9ef814cf4557cf903f705b38a7571369d0f', margin: "none" }, this.label), h("button", { key: '5ba61af3c6b024f1f3ef531b412e5c20243d83ca', class: "duet-date-picker-close", ref: element => (this.closeButtonNode = element), onClick: () => this.hide(), type: "button" }, h("duet-icon", { key: '14e320af49eb06c184cfe918a67f278bdac888bf', name: "navigation-close-small", margin: "none", color: "currentColor", size: "xx-small" }), h("duet-visually-hidden", { key: 'b58668ebd6f0849ae6e8f0454800b4ceb916443e' }, text.closeLabel))), h("div", { key: '79a07d6373ca479f45808ff3eef1ea6239148b26', class: "duet-date-dialog-header" }, h("div", { key: '6f08a300db74dd1562c658334c8220fc1569228c', class: "duet-date-dialog-dropdowns" }, h("duet-visually-hidden", { key: '400b1451a2180e0a189a5c1e7c27139647ec5539' }, h("h2", { key: '47225d656584304da5b114f0430e17cb74a38e53', id: this.dialogLabelId, "aria-live": "polite", "aria-atomic": "true" }, text.monthLabels[focusedMonth], " ", this.focusedDay.getFullYear())), h("duet-visually-hidden", { key: 'b66a24df41db7807ed3c0d3f36d380a897360fa6' }, h("label", { key: 'aae8cf780c5452e1399421e177309ad7a9179803', htmlFor: this.monthSelectId }, text.monthSelectLabel)), h("div", { key: 'f2bad2498489114a7bc0ffd6fc8c4f842b507e43', class: "duet-date-dialog-select" }, h("select", { key: '9d58e711523ace0781cc27947fb9ecc52bda8499', id: this.monthSelectId, class: "duet-date-month-select", ref: element => (this.monthSelectNode = element), onChange: this.handleMonthSelect }, text.monthLabels.map((month, i) => (h("option", { key: month, value: i, selected: i === focusedMonth, disabled: !inRange(new Date(focusedYear, i, 1), minDate ? startOfMonth(minDate) : null, maxDate ? endOfMonth(maxDate) : null) }, month)))), h("div", { key: '914f0bef1d172d4d5391991fd9f8206f7d0576df', class: "duet-date-dialog-select-label", "aria-hidden": "true" }, h("span", { key: '7aebf3e0cbc22a117a5e155e0dd4518189f9b946' }, text.monthLabelsShort[focusedMonth]), h("duet-icon", { key: 'faf140d4032093b37db295f06e23ea761fa27c65', name: "action-arrow-down-small", color: "currentColor", margin: "none", size: "xxx-small" }))), h("duet-visually-hidden", { key: '66399d5d57f605fe4db9c13ee13bcf89f4d38efd' }, h("label", { key: '76256efb6db83d4165a903420b70e9a6d43a2e49', htmlFor: this.yearSelectId }, text.yearSelectLabel)), h("div", { key: 'e871aa90559d85cad33752f52a6e538571e6984f', class: "duet-date-dialog-select" }, h("select", { key: 'af2e90cb3d28123c36c83853753be30beff06400', id: this.yearSelectId, class: "duet-date-year-select", onChange: this.handleYearSelect }, range(minYear, maxYear).map(year => (h("option", { key: year, selected: year === focusedYear }, year)))), h("div", { key: 'a1487d1853c56fc62c20bf2b3df60cc73d666017', class: "duet-date-dialog-select-label", "aria-hidden": "true" }, h("span", { key: 'ad43c7efa4a93e4417c2051e000fe0f786b35612' }, this.focusedDay.getFullYear()), h("duet-icon", { key: '5c42115e3dd7c4a48e5cae87b5f03ed274087ba5', name: "action-arrow-down-small", color: "currentColor", margin: "none", size: "xxx-small" })))), h("div", { key: 'bc63edbea7a3b069774fc0b8766983f570479501', class: "duet-date-dialog-buttons" }, h("duet-action-button", { key: 'e3cb3ade86eeedbaf914d104ce9b638109708eb6', accessibleLabel: i18n[this.language].prevMonthLabel, actionName: i18n[this.language].prevMonthLabel, class: "duet-date-dialog-prev", onClick: this.handlePreviousMonthClick, disabled: prevMonthDisabled, "icon-name": "action-arrow-left-small" }, text.prevMonthLabel), h("duet-action-button", { key: '3d1b9df7ab5852d770d6c98285b73e002a9f4468', accessibleLabel: i18n[this.language].nextMonthLabel, actionName: i18n[this.language].nextMonthLabel, class: "duet-date-dialog-next", onClick: this.handleNextMonthClick, disabled: nextMonthDisabled, "icon-name": "action-arrow-right-small" }, text.nextMonthLabel))), h(DatePickerMonth, { key: 'fb66dbdf2065a158a265490a6f7c0ace038919d5', selectedDate: valueAsDate, focusedDate: this.focusedDay, onDateSelect: this.handleDaySelect, onKeyboardNavigation: this.handleKeyboardNavigation, labelledById: this.dialogLabelId, language: this.language, theme: this.theme, min: minDate, max: maxDate, focusedDayRef: element => (this.focusedDayNode = element), onFocusEnter: this.enableActiveFocus, onFocusExit: this.disableActiveFocus })), h(FocusGuard, { key: 'b40a59659930ae4a47fb6d8dd45f334e5fcdf026', moveFocusTo: this.closeButtonNode }))));
     }
     static get is() { return "duet-date-picker"; }
     static get encapsulation() { return "shadow"; }
@@ -780,7 +775,7 @@ export class DuetDatePicker {
             "error": {
                 "type": "string",
                 "attribute": "error",
-                "mutable": false,
+                "mutable": true,
                 "complexType": {
                     "original": "string",
                     "resolved": "string",
@@ -1154,8 +1149,7 @@ export class DuetDatePicker {
             "open": {},
             "focusedDay": {},
             "inputValue": {},
-            "inputHasFocus": {},
-            "internalValidityError": {}
+            "inputHasFocus": {}
         };
     }
     static get events() {

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

@@ -46,10 +46,7 @@
   margin-bottom: 16px !important;
   margin-top: 0 !important;
 }
-.duet-divider.duet-theme-turva {
-  background: rgb(212, 221, 226);
-}
 
-:host(.duet-theme-turva2) .duet-divider.duet-theme-turva {
+.duet-divider.duet-theme-turva {
   background: rgb(212, 221, 226);
 }

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

@@ -32,7 +32,7 @@ export class DuetDivider {
      */
     render() {
         const background = getColorByName(this.color);
-        return (h("div", { key: 'fc0e7562cb30da77115c7a07938f9d586df909d5', class: {
+        return (h("div", { key: 'a833c22a31c93caea94753696848ad720b5dc06d', class: {
                 "duet-m-0": this.margin === "none",
                 "duet-m-s": this.margin === "small",
                 "duet-divider": true,

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

@@ -206,7 +206,7 @@ export class DuetEditableTable {
      * Render Methods
      */
     render() {
-        return (h(Host, { key: '5b1b28e6321b07a1d385c1945f15b0c110a8b068', class: {
+        return (h(Host, { key: 'a0c3202194fcc3910b50193f2a4fcb3bd7d3a5d8', class: {
                 [`duet-editable-table-${this.variation}`]: true,
                 "duet-editable-table": true,
                 [`duet-editable-table-${this.theme}`]: true,
@@ -216,7 +216,7 @@ export class DuetEditableTable {
                 "duet-editable-table-actions": !!this.actions,
                 "duet-m-0": this.margin === "none",
                 "duet-theme-turva": this.theme === "turva",
-            } }, h("duet-table", { key: '47a4b4e9d3acf3ca83e70c1aa4e7758e1f6cbbbe', class: "duet-editable-table-table", sticky: this.sticky, stickyDistance: this.stickyDistance, margin: this.margin, theme: this.theme, variation: this.variation, breakpoint: this.breakpoint, "hide-head-visually": this.hideHeadVisually }, h("table", { key: '975344f17b9271b8ffa4264751aa2dae69279f45', role: this.accessibleRole }, h("caption", { key: 'e9039bfd4c5bf90f96856d13d993be7f13fa2d73' }, h("slot", { key: '38a7cd2c82e45ebcc080e1e20f3f77aa2a46973d', name: "tcaption" })), h("thead", { key: 'c4a02a18bfae96669f45328f6198dc52f43dd887' }, this.hasHeadSlotFirst && (h("tr", { key: 'af846dfeba040ddec43065803327195bea76a404' }, h("td", { key: 'c002827f8c8c6cce8d8d4415c80e4f39d4bb1ed6', class: "duet-editable-table-actions-menu", colSpan: 99 }, h("slot", { key: '5673bc937f4bc87b67f6112f59a1981ff7f02c79', name: "thead-first" })))), this.renderTableHeader(), this.hasHeadSlotLast && (h("tr", { key: '79a45db93db0d6e5e35aade928f23032efdb821b' }, h("td", { key: 'fddd1434bf5a20188be229e5c3d9bde03b8d8dca', class: "duet-editable-table-actions-menu", colSpan: 99 }, h("slot", { key: '53b1ea3494b7e0f39426232f922a040eacf3a0f0', name: "thead-last" }))))), h("tbody", { key: 'b5d38eed528592d29f64f749e1938d0ff5b772b3' }, this.renderTableBody()), this.hasFootSlot && (h("tfoot", { key: 'e2ef34f7d078a7ac7b4a38cd5953b449ce682a23' }, h("tr", { key: '9f2a92be2f425c419abd5fa1a0a7fb763cc0426b' }, h("td", { key: 'da2eeda1f65004cc2c197dad36038dc4a60c2e8e', class: "duet-editable-table-footer-menu", colSpan: 99 }, h("slot", { key: '988c400cb8046f0544293b8e1555f7b213f9def6', name: "tfoot" })))))))));
+            } }, h("duet-table", { key: '6e53631c212527e8702f9e9c8a1b9bc2b390c830', class: "duet-editable-table-table", sticky: this.sticky, stickyDistance: this.stickyDistance, margin: this.margin, theme: this.theme, variation: this.variation, breakpoint: this.breakpoint, "hide-head-visually": this.hideHeadVisually }, h("table", { key: '990481c1affeb11d6a6541a36a8f0118c961915c', role: this.accessibleRole }, h("caption", { key: 'f7b1bc44ab9fef0194485fdd6e49e11a306e365c' }, h("slot", { key: '2caecec6e5c024bdde6fa6bf72917914e2626752', name: "tcaption" })), h("thead", { key: 'c892dcd586814dcecddc46fbaf0319b04b6d9f16' }, this.hasHeadSlotFirst && (h("tr", { key: 'bfbac21dbab8afab7f34e952bd5803954be4991d' }, h("td", { key: '0a491ed1c4855d55b4dbc493a52029d657a08cc5', class: "duet-editable-table-actions-menu", colSpan: 99 }, h("slot", { key: '87c033e72a1bd3b87a51a4981b1b4939de66578d', name: "thead-first" })))), this.renderTableHeader(), this.hasHeadSlotLast && (h("tr", { key: '2ab66f9b14fe592f7ee7e6293cdd56b3aed0190e' }, h("td", { key: 'edb3ae066371b6f5dc990f10f088246c0d9388d9', class: "duet-editable-table-actions-menu", colSpan: 99 }, h("slot", { key: 'f57ebf07ee01c40cb47469b2fa07a706c4724dae', name: "thead-last" }))))), h("tbody", { key: '538b2de606132fcb272e5af1650cafb947fc5b2a' }, this.renderTableBody()), this.hasFootSlot && (h("tfoot", { key: '2f1a98dd550705933222f7179bc3ff4d6554d117' }, h("tr", { key: 'ecb9667d57ea85de7efa6fa0035fbfbb16c78a9e' }, h("td", { key: 'c78b25495de0621c55f70cce5131b1d192fc5e0e', class: "duet-editable-table-footer-menu", colSpan: 99 }, h("slot", { key: 'ed051b0e66c28fdbee565b33c1c394034a817a82', name: "tfoot" })))))))));
     }
     static get is() { return "duet-editable-table"; }
     static get encapsulation() { return "shadow"; }

package/lib/collection/components/duet-empty-state/duet-empty-state.css

@@ -42,12 +42,8 @@
   background: rgb(245, 248, 250);
   border-radius: 4px;
 }
-.duet-empty-state.duet-theme-turva {
-  color: rgb(23, 42, 59);
-  background: rgb(245, 246, 247);
-}
 
-:host(.duet-theme-turva2) .duet-empty-state.duet-theme-turva {
+.duet-empty-state.duet-theme-turva {
   color: rgb(23, 42, 59);
   background: rgb(245, 246, 247);
 }

package/lib/collection/components/duet-empty-state/duet-empty-state.js

@@ -29,11 +29,11 @@ export class DuetEmptyState {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: '6b61854be0ee8b668d513de66e117b928cb4671b' }, h("div", { key: '62ab8dddad16464e202f9225d080cee855a8193d', class: {
+        return (h(Host, { key: '9018087936c4abe5adead5d4fe62991ea84b3dc1' }, h("div", { key: 'a0aa84fb06673f4d741891019a98fd7d4f03b174', class: {
                 "duet-empty-state": true,
                 "duet-theme-turva": this.theme === "turva",
                 "duet-is-small": this.size === "small",
-            } }, h("duet-icon", { key: '237ea5cd85e1be42a856c7b30e14022bb4cd824e', color: "currentColor", name: this.icon, size: this.size === "small" ? "large" : "x-large" }), h("div", { key: '9bb0471dfd59d78fc51b71eccce4830d47506a42' }, h("slot", { key: 'cdf540cdcc74733367bfc04d13ec9659bd2adb52' })))));
+            } }, h("duet-icon", { key: '8d9265fb0946a832c1c386b139b28b775ade9936', color: "currentColor", name: this.icon, size: this.size === "small" ? "large" : "x-large" }), h("div", { key: '87abfa72d165e96e3ca1798ab0023e13d540d757' }, h("slot", { key: 'fc437b4821cbc146906f8c33aa06d4718a0584b2' })))));
     }
     static get is() { return "duet-empty-state"; }
     static get encapsulation() { return "shadow"; }

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

@@ -61,10 +61,6 @@ fieldset legend {
 .duet-legend-wrapper.duet-legend-compact:not(.duet-legend-has-caption) {
   line-height: 1.25;
 }
-.duet-theme-turva .duet-legend-wrapper {
-  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-fieldset-label {
   margin-bottom: 12px !important;
@@ -121,6 +117,11 @@ fieldset legend {
   clip: rect(0 0 0 0);
 }
 
-:host(.duet-theme-turva2) .duet-theme-turva .duet-legend-wrapper {
+.duet-theme-turva .duet-legend-wrapper {
+  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-theme-turva .duet-fieldset-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(214, 28, 82);
 }