@duetds/components 7.0.11 → 7.0.13

package/lib/collection/components/duet-breadcrumbs/duet-breadcrumb.js

@@ -1,11 +1,19 @@
 /*!
  * Built with Duet Design System
  */
+import arrowRightSmallIcon from "@duetds/icons/lib/assets/action-arrow-right-small";
 import { h, Host } from "@stencil/core";
 import { inheritGlobalTheme } from "../../common/themeable-component";
+import { connectLanguageChangeObserver, disconnectLanguageChangeObserver, getLanguage, getLocaleString, } from "../../utils/language-utils";
 export class DuetBreadcrumb {
   constructor() {
+    this.currentCrumb = {
+      fi: "disabled. Nykyinen sivu",
+      sv: "disabled. Visa mer",
+      en: "disabled. Nuvarande sida",
+    };
     this.theme = "";
+    this.language = getLanguage();
     this.href = "";
     this.icon = "";
     this.accessibleLabel = undefined;
@@ -16,15 +24,22 @@ export class DuetBreadcrumb {
   componentWillLoad() {
     inheritGlobalTheme(this);
   }
+  connectedCallback() {
+    connectLanguageChangeObserver(this);
+  }
+  disconnectedCallback() {
+    disconnectLanguageChangeObserver(this);
+  }
   /**
    * render() function
    * Always the last one in the class.
    */
   render() {
-    return (h(Host, null, h("a", { class: {
+    var _a;
+    return (h(Host, { role: "listitem" }, h("div", { class: "container" }, !this.icon && (h("duet-icon", { class: "duet-breadrumbs-arrow", size: "auto", icon: arrowRightSmallIcon.svg, margin: "none", color: "currentColor" })), h("a", { class: {
         "duet-breadcrumb": true,
         "duet-theme-turva": this.theme === "turva",
-      }, href: this.href ? this.href : undefined, "aria-label": this.accessibleLabel }, this.icon && h("duet-icon", { size: "x-small", name: this.icon, margin: "none", color: "currentColor" }), !this.icon && h("slot", null))));
+      }, href: this.href ? this.href : undefined, "aria-label": `${!this.href ? `${getLocaleString(this.currentCrumb)} ` : ""}${(_a = this.accessibleLabel) !== null && _a !== void 0 ? _a : this.element.innerHTML}`, role: "link" }, this.icon && h("duet-icon", { size: "x-small", name: this.icon, margin: "none", color: "currentColor" }), !this.icon && h("slot", null)))));
   }
   static get is() { return "duet-breadcrumb"; }
   static get encapsulation() { return "shadow"; }
@@ -123,4 +138,10 @@ export class DuetBreadcrumb {
       }
     };
   }
+  static get states() {
+    return {
+      "language": {}
+    };
+  }
+  static get elementRef() { return "element"; }
 }

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

@@ -24,6 +24,14 @@
   width: 100%;
 }
 
+::slotted(duet-breadcrumb) {
+  font-weight: 400;
+}
+
+::slotted(duet-breadcrumb:last-of-type) {
+  font-weight: 600;
+}
+
 .duet-breadcrumbs {
   position: relative;
   display: flex;
@@ -41,7 +49,7 @@
   min-height: 36px;
   margin: 0 28px;
 }
-.duet-breadcrumbs ol {
+.duet-breadcrumbs .list {
   display: flex;
   flex-direction: row;
   flex-wrap: wrap;
@@ -52,22 +60,6 @@
   color: inherit;
   list-style: none;
 }
-.duet-breadcrumbs ol li {
-  font-weight: 400;
-}
-.duet-breadcrumbs ol li:last-of-type {
-  font-weight: 600;
-}
-.duet-breadcrumbs .duet-breadrumbs-arrow {
-  display: inherit;
-  align-items: center;
-  justify-content: center;
-  width: 0.375rem;
-  height: 0.375rem;
-}
-.duet-breadcrumbs .hide {
-  display: none;
-}
 .duet-breadcrumbs .bottom-border {
   position: absolute;
   bottom: 0;
@@ -79,7 +71,7 @@
   color: rgb(0, 41, 77);
   background: rgb(243, 249, 252);
 }
-.duet-breadcrumbs.header ol duet-breadcrumb[href]:hover {
+.duet-breadcrumbs.header .list duet-breadcrumb[href]:hover {
   color: rgb(0, 77, 128);
 }
 .duet-breadcrumbs.header .bottom-border--nav {
@@ -115,15 +107,15 @@
     margin: 0 72px 0 48px;
   }
 }
-.duet-breadcrumbs.footer ol {
+.duet-breadcrumbs.footer .list {
   padding: 20px 0;
 }
 @media (min-width: 62em) {
-  .duet-breadcrumbs.footer ol {
+  .duet-breadcrumbs.footer .list {
     padding: 20px 8px;
   }
 }
-.duet-breadcrumbs.footer ol duet-breadcrumb[href]:hover {
+.duet-breadcrumbs.footer .list duet-breadcrumb[href]:hover {
   text-decoration: underline;
 }
 .duet-breadcrumbs.footer .bottom-border--container {

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

@@ -1,8 +1,7 @@
 /*!
  * Built with Duet Design System
  */
-import arrowRightSmallIcon from "@duetds/icons/lib/assets/action-arrow-right-small";
-import { Build, Fragment, h, Host } from "@stencil/core";
+import { Build, h, Host } from "@stencil/core";
 import { inheritGlobalTheme } from "../../common/themeable-component";
 import { getLocaleString } from "../../utils/language-utils";
 export class DuetBreadcrumbs {
@@ -55,7 +54,7 @@ export class DuetBreadcrumbs {
         "duet-breadcrumbs": true,
         "duet-theme-turva": this.theme === "turva",
         [this.variation]: true,
-      } }, h("div", { class: "container" }, h("ol", null, this.children.map((child, index) => (h(Fragment, null, index > 0 && (h("li", { "aria-hidden": "true" }, h("duet-icon", { class: "duet-breadrumbs-arrow", size: "auto", icon: arrowRightSmallIcon.svg, margin: "none", color: "currentColor" }))), h("li", { innerHTML: child.outerHTML }), h("div", { class: "hide" }, h("slot", null)))))), h("div", { class: "bottom-border bottom-border--container" })), h("div", { class: "bottom-border bottom-border--nav" }))));
+      } }, h("div", { class: "container" }, h("div", { role: "list", class: "list" }, h("slot", null)), h("div", { class: "bottom-border bottom-border--container" })), h("div", { class: "bottom-border bottom-border--nav" }))));
   }
   static get is() { return "duet-breadcrumbs"; }
   static get encapsulation() { return "shadow"; }

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

@@ -108,6 +108,13 @@
 .duet-button.duet-m-0 {
   margin: 0 !important;
 }
+.duet-button:focus {
+  outline: 0;
+  box-shadow: 0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3;
+}
+.duet-theme-turva .duet-button:focus, .duet-button:focus.duet-theme-turva {
+  box-shadow: 0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a;
+}
 .duet-button:not(.input-button-primary, .input-button-secondary, .input-button-embedded) {
   font-variant-numeric: tabular-nums;
 }
@@ -218,13 +225,6 @@
   right: -16px;
   left: auto;
 }
-.duet-button:focus {
-  outline: 0;
-  box-shadow: 0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px rgb(0, 119, 179);
-}
-.duet-theme-turva .duet-button:focus {
-  box-shadow: 0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px rgb(23, 28, 58);
-}
 .duet-button:active:not([disabled]) {
   opacity: 0.75;
   transition: none;
@@ -269,7 +269,7 @@
 .duet-button.primary:hover, .duet-button.input-button-primary:hover {
   background: #005f8f;
   border-color: #005f8f;
-  box-shadow: 0 4px 20px rgba(34, 34, 34, 0.1);
+  box-shadow: 0 4px 20px 0 rgba(34, 34, 34, 0.1);
 }
 .duet-theme-turva .duet-button.primary:hover, .duet-theme-turva .duet-button.input-button-primary:hover {
   background: rgb(148, 9, 37);
@@ -277,10 +277,10 @@
 }
 .duet-button.primary:focus, .duet-button.input-button-primary:focus {
   outline: 0;
-  box-shadow: 0 0 0 1px rgb(255, 255, 255), 0 0 0 4px rgba(0, 119, 179, 0.75);
+  box-shadow: 0 0 0 1px #fff, 0 0 0 4px rgba(0, 119, 179, 0.75);
 }
 .duet-theme-turva .duet-button.primary:focus, .duet-theme-turva .duet-button.input-button-primary:focus {
-  box-shadow: 0 0 0 1px rgb(255, 255, 255), 0 0 0 4px rgba(23, 28, 58, 0.7);
+  box-shadow: 0 0 0 1px #fff, 0 0 0 4px rgba(23, 28, 58, 0.75);
 }
 .duet-button.secondary, .duet-button.input-button-secondary, .duet-button.input-button-embedded {
   color: rgb(0, 41, 77) !important;
@@ -337,10 +337,10 @@
 }
 .duet-button.negative:focus {
   outline: 0;
-  box-shadow: 0 0 0 1px rgb(0, 41, 77), 0 0 0 4px rgba(255, 255, 255, 0.7);
+  box-shadow: 0 0 0 1px #00294d, 0 0 0 4px rgba(255, 255, 255, 0.7);
 }
 .duet-theme-turva .duet-button.negative:focus {
-  box-shadow: 0 0 0 1px rgb(23, 28, 58), 0 0 0 4px rgba(255, 255, 255, 0.7);
+  box-shadow: 0 0 0 1px #0077b3, 0 0 0 4px rgba(255, 255, 255, 0.7);
 }
 .duet-button.destructive-primary {
   color: rgb(255, 255, 255) !important;
@@ -355,7 +355,7 @@
 .duet-button.destructive-primary:hover {
   background: #b21c4e;
   border-color: #b21c4e;
-  box-shadow: 0 4px 20px rgba(34, 34, 34, 0.1);
+  box-shadow: 0 4px 20px 0 rgba(34, 34, 34, 0.1);
 }
 .duet-theme-turva .duet-button.destructive-primary:hover {
   background: #b3220a;

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

@@ -412,7 +412,7 @@ export class DuetButton {
           "references": {
             "DuetButtonVariation": {
               "location": "local",
-              "path": "/Users/mgibas/workspace/duet/packages/components/src/components/duet-button/duet-button.tsx"
+              "path": "/Users/laaksju3/duetds/packages/components/src/components/duet-button/duet-button.tsx"
             }
           }
         },
@@ -528,7 +528,7 @@ export class DuetButton {
           "references": {
             "DuetButtonTextCentering": {
               "location": "local",
-              "path": "/Users/mgibas/workspace/duet/packages/components/src/components/duet-button/duet-button.tsx"
+              "path": "/Users/laaksju3/duetds/packages/components/src/components/duet-button/duet-button.tsx"
             }
           }
         },
@@ -551,7 +551,7 @@ export class DuetButton {
           "references": {
             "DuetButtonWrapping": {
               "location": "local",
-              "path": "/Users/mgibas/workspace/duet/packages/components/src/components/duet-button/duet-button.tsx"
+              "path": "/Users/laaksju3/duetds/packages/components/src/components/duet-button/duet-button.tsx"
             }
           }
         },
@@ -855,7 +855,7 @@ export class DuetButton {
           "references": {
             "DuetButtonIconSize": {
               "location": "local",
-              "path": "/Users/mgibas/workspace/duet/packages/components/src/components/duet-button/duet-button.tsx"
+              "path": "/Users/laaksju3/duetds/packages/components/src/components/duet-button/duet-button.tsx"
             }
           }
         },
@@ -878,7 +878,7 @@ export class DuetButton {
           "references": {
             "DuetButtonSize": {
               "location": "local",
-              "path": "/Users/mgibas/workspace/duet/packages/components/src/components/duet-button/duet-button.tsx"
+              "path": "/Users/laaksju3/duetds/packages/components/src/components/duet-button/duet-button.tsx"
             }
           }
         },

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

@@ -116,7 +116,7 @@ export class DuetCaption {
           "references": {
             "DuetCaptionSize": {
               "location": "local",
-              "path": "/Users/mgibas/workspace/duet/packages/components/src/components/duet-caption/duet-caption.tsx"
+              "path": "/Users/laaksju3/duetds/packages/components/src/components/duet-caption/duet-caption.tsx"
             }
           }
         },

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

@@ -58,10 +58,10 @@
 }
 .duet-card:focus {
   outline: 0;
-  box-shadow: 0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px rgb(0, 119, 179);
+  box-shadow: 0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3;
 }
 .duet-theme-turva .duet-card:focus, .duet-card:focus.duet-theme-turva {
-  box-shadow: 0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px rgb(23, 28, 58);
+  box-shadow: 0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a;
 }
 @media (max-width: 20.5em) {
   .duet-card.shadow-xxx-small {
@@ -266,10 +266,10 @@
 }
 :host(.user-is-tabbing) .duet-card-heading.duet-card-heading--collapsible button:focus {
   border-radius: 4px;
-  box-shadow: 0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px rgb(0, 119, 179);
+  box-shadow: 0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3;
 }
 :host(.user-is-tabbing) .duet-theme-turva .duet-card-heading.duet-card-heading--collapsible button:focus {
-  box-shadow: 0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px rgb(23, 28, 58);
+  box-shadow: 0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a;
 }
 .duet-card-collapsed .duet-card-heading {
   margin-bottom: 0 !important;

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

@@ -183,7 +183,7 @@ export class DuetCard {
           "references": {
             "DuetCardVariation": {
               "location": "local",
-              "path": "/Users/mgibas/workspace/duet/packages/components/src/components/duet-card/duet-card.tsx"
+              "path": "/Users/laaksju3/duetds/packages/components/src/components/duet-card/duet-card.tsx"
             }
           }
         },
@@ -349,7 +349,7 @@ export class DuetCard {
           "references": {
             "DuetCardPadding": {
               "location": "local",
-              "path": "/Users/mgibas/workspace/duet/packages/components/src/components/duet-card/duet-card.tsx"
+              "path": "/Users/laaksju3/duetds/packages/components/src/components/duet-card/duet-card.tsx"
             }
           }
         },
@@ -468,7 +468,7 @@ export class DuetCard {
           "references": {
             "DuetCardToggleEvent": {
               "location": "local",
-              "path": "/Users/mgibas/workspace/duet/packages/components/src/components/duet-card/duet-card.tsx"
+              "path": "/Users/laaksju3/duetds/packages/components/src/components/duet-card/duet-card.tsx"
             }
           }
         }

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

@@ -106,10 +106,10 @@
   border-color: rgb(23, 28, 58);
 }
 .duet-checkbox:focus + label::before {
-  box-shadow: 0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px rgb(0, 119, 179);
+  box-shadow: 0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3;
 }
 .duet-theme-turva .duet-checkbox:focus + label::before {
-  box-shadow: 0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px rgb(23, 28, 58);
+  box-shadow: 0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a;
 }
 .duet-checkbox + label {
   position: static;

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

@@ -481,7 +481,7 @@ export class DuetCheckbox {
           "references": {
             "DuetCheckboxEvent": {
               "location": "local",
-              "path": "/Users/mgibas/workspace/duet/packages/components/src/components/duet-checkbox/duet-checkbox.tsx"
+              "path": "/Users/laaksju3/duetds/packages/components/src/components/duet-checkbox/duet-checkbox.tsx"
             }
           }
         }
@@ -501,7 +501,7 @@ export class DuetCheckbox {
           "references": {
             "DuetCheckboxEvent": {
               "location": "local",
-              "path": "/Users/mgibas/workspace/duet/packages/components/src/components/duet-checkbox/duet-checkbox.tsx"
+              "path": "/Users/laaksju3/duetds/packages/components/src/components/duet-checkbox/duet-checkbox.tsx"
             }
           }
         }
@@ -521,7 +521,7 @@ export class DuetCheckbox {
           "references": {
             "DuetCheckboxEvent": {
               "location": "local",
-              "path": "/Users/mgibas/workspace/duet/packages/components/src/components/duet-checkbox/duet-checkbox.tsx"
+              "path": "/Users/laaksju3/duetds/packages/components/src/components/duet-checkbox/duet-checkbox.tsx"
             }
           }
         }

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

@@ -215,10 +215,10 @@
 }
 
 :host(.user-is-tabbing) .duet-chip-focus {
-  box-shadow: 0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px rgb(0, 119, 179);
+  box-shadow: 0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3;
 }
 :host(.user-is-tabbing) .duet-chip-focus.duet-theme-turva {
-  box-shadow: 0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px rgb(23, 28, 58);
+  box-shadow: 0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a;
 }
 
 .duet-chip-container input {

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

@@ -225,7 +225,7 @@ export class DuetChip {
           "references": {
             "DuetChipVariation": {
               "location": "local",
-              "path": "/Users/mgibas/workspace/duet/packages/components/src/components/duet-chip/duet-chip.tsx"
+              "path": "/Users/laaksju3/duetds/packages/components/src/components/duet-chip/duet-chip.tsx"
             }
           }
         },
@@ -398,7 +398,7 @@ export class DuetChip {
           "references": {
             "DuetChipEvent": {
               "location": "local",
-              "path": "/Users/mgibas/workspace/duet/packages/components/src/components/duet-chip/duet-chip.tsx"
+              "path": "/Users/laaksju3/duetds/packages/components/src/components/duet-chip/duet-chip.tsx"
             }
           }
         }
@@ -418,7 +418,7 @@ export class DuetChip {
           "references": {
             "DuetChipEvent": {
               "location": "local",
-              "path": "/Users/mgibas/workspace/duet/packages/components/src/components/duet-chip/duet-chip.tsx"
+              "path": "/Users/laaksju3/duetds/packages/components/src/components/duet-chip/duet-chip.tsx"
             }
           }
         }
@@ -438,7 +438,7 @@ export class DuetChip {
           "references": {
             "DuetChipEvent": {
               "location": "local",
-              "path": "/Users/mgibas/workspace/duet/packages/components/src/components/duet-chip/duet-chip.tsx"
+              "path": "/Users/laaksju3/duetds/packages/components/src/components/duet-chip/duet-chip.tsx"
             }
           }
         }

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

@@ -203,7 +203,7 @@ input:focus {
 }
 
 :host(.user-is-tabbing) input:not(:checked):focus + .duet-choice-label {
-  box-shadow: 0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px rgb(0, 119, 179);
+  box-shadow: 0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3;
 }
 
 :host(.user-is-tabbing).duet-theme-turva input:checked:focus + .duet-choice-label {
@@ -211,7 +211,7 @@ input:focus {
 }
 
 :host(.user-is-tabbing).duet-theme-turva input:not(:checked):focus + .duet-choice-label {
-  box-shadow: 0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px rgb(23, 28, 58);
+  box-shadow: 0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a;
 }
 
 input[disabled] + .duet-choice-label {
@@ -455,7 +455,10 @@ input[disabled] + .duet-choice-label:hover, input[disabled] + .duet-choice-label
   outline: none;
 }
 :host(.user-is-tabbing) .duet-choice-info-toggle:focus {
-  box-shadow: 0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px rgb(0, 119, 179);
+  box-shadow: 0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3;
+}
+:host(.user-is-tabbing) .duet-theme-turva .duet-choice-info-toggle:focus {
+  box-shadow: 0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a;
 }
 .checked + .duet-choice-info-toggle {
   border-left-color: rgb(0, 119, 179) !important;

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

@@ -890,7 +890,7 @@ export class DuetChoice {
           "references": {
             "DuetChoiceEvent": {
               "location": "local",
-              "path": "/Users/mgibas/workspace/duet/packages/components/src/components/duet-choice/duet-choice.tsx"
+              "path": "/Users/laaksju3/duetds/packages/components/src/components/duet-choice/duet-choice.tsx"
             }
           }
         }
@@ -910,7 +910,7 @@ export class DuetChoice {
           "references": {
             "DuetChoiceEvent": {
               "location": "local",
-              "path": "/Users/mgibas/workspace/duet/packages/components/src/components/duet-choice/duet-choice.tsx"
+              "path": "/Users/laaksju3/duetds/packages/components/src/components/duet-choice/duet-choice.tsx"
             }
           }
         }
@@ -930,7 +930,7 @@ export class DuetChoice {
           "references": {
             "DuetChoiceEvent": {
               "location": "local",
-              "path": "/Users/mgibas/workspace/duet/packages/components/src/components/duet-choice/duet-choice.tsx"
+              "path": "/Users/laaksju3/duetds/packages/components/src/components/duet-choice/duet-choice.tsx"
             }
           }
         }

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

@@ -109,10 +109,10 @@
 }
 :host(.user-is-tabbing) .duet-collapsible-heading:focus {
   border-radius: 4px;
-  box-shadow: 0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px rgb(0, 119, 179);
+  box-shadow: 0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3;
 }
 :host(.user-is-tabbing) .duet-collapsible-heading.duet-theme-turva:focus {
-  box-shadow: 0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px rgb(23, 28, 58);
+  box-shadow: 0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a;
 }
 
 .duet-collapsible-heading-icon {

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

@@ -223,7 +223,7 @@ export class DuetCollapsible {
           "references": {
             "DuetCollapsibleWeight": {
               "location": "local",
-              "path": "/Users/mgibas/workspace/duet/packages/components/src/components/duet-collapsible/duet-collapsible.tsx"
+              "path": "/Users/laaksju3/duetds/packages/components/src/components/duet-collapsible/duet-collapsible.tsx"
             }
           }
         },
@@ -246,7 +246,7 @@ export class DuetCollapsible {
           "references": {
             "DuetCollapsibleHeadingFontSize": {
               "location": "local",
-              "path": "/Users/mgibas/workspace/duet/packages/components/src/components/duet-collapsible/duet-collapsible.tsx"
+              "path": "/Users/laaksju3/duetds/packages/components/src/components/duet-collapsible/duet-collapsible.tsx"
             }
           }
         },
@@ -343,7 +343,7 @@ export class DuetCollapsible {
           "references": {
             "DuetCollapsibleToggleEvent": {
               "location": "local",
-              "path": "/Users/mgibas/workspace/duet/packages/components/src/components/duet-collapsible/duet-collapsible.tsx"
+              "path": "/Users/laaksju3/duetds/packages/components/src/components/duet-collapsible/duet-collapsible.tsx"
             }
           }
         }

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

@@ -497,7 +497,7 @@ export class DuetCombobox {
           "references": {
             "DuetComboboxItem": {
               "location": "local",
-              "path": "/Users/mgibas/workspace/duet/packages/components/src/components/duet-combobox/duet-combobox.tsx"
+              "path": "/Users/laaksju3/duetds/packages/components/src/components/duet-combobox/duet-combobox.tsx"
             }
           }
         },
@@ -616,7 +616,7 @@ export class DuetCombobox {
           "references": {
             "DuetComboboxEvent": {
               "location": "local",
-              "path": "/Users/mgibas/workspace/duet/packages/components/src/components/duet-combobox/duet-combobox.tsx"
+              "path": "/Users/laaksju3/duetds/packages/components/src/components/duet-combobox/duet-combobox.tsx"
             }
           }
         }
@@ -640,7 +640,7 @@ export class DuetCombobox {
             },
             "DuetComboboxItem": {
               "location": "local",
-              "path": "/Users/mgibas/workspace/duet/packages/components/src/components/duet-combobox/duet-combobox.tsx"
+              "path": "/Users/laaksju3/duetds/packages/components/src/components/duet-combobox/duet-combobox.tsx"
             }
           },
           "return": "Promise<string>"

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

@@ -42,13 +42,13 @@
   outline: 0;
 }
 
-:host(.user-is-tabbing:focus) {
+:host(.user-is-tabbing:not(.descendant-focused):focus) {
   border-radius: 4px;
-  box-shadow: 0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px rgb(0, 119, 179);
+  box-shadow: 0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3;
 }
 
-:host(.user-is-tabbing.duet-theme-turva:focus) {
-  box-shadow: 0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px rgb(23, 28, 58);
+:host(.user-is-tabbing:not(.descendant-focused).duet-theme-turva:focus) {
+  box-shadow: 0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a;
 }
 
 .duet-cookie-consent {
@@ -106,10 +106,10 @@
 
 ::slotted(a:focus) {
   outline: 0;
-  box-shadow: 0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px rgb(0, 119, 179);
+  box-shadow: 0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3;
 }
 
 .duet-theme-turva ::slotted(a:focus) {
   outline: 0;
-  box-shadow: 0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px rgb(23, 28, 58);
+  box-shadow: 0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a;
 }

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

@@ -12,6 +12,16 @@ export class DuetCookieConsent {
     this.accessibleLabel = "Hyväksyn evästeiden käytön";
     this.theme = "";
   }
+  handleFocusIn(event) {
+    const eventPath = event.composedPath();
+    const actualEventTarget = eventPath[0];
+    if (actualEventTarget !== this.element) {
+      this.element.classList.add("descendant-focused");
+    }
+  }
+  handleFocusOut() {
+    this.element.classList.remove("descendant-focused");
+  }
   /**
    * Component lifecycle events.
    */
@@ -23,7 +33,7 @@ export class DuetCookieConsent {
    * Always the last one in the class.
    */
   render() {
-    return (h(Host, { tabindex: "0" }, h("div", { class: { "duet-cookie-consent": true, "duet-theme-turva": this.theme === "turva" } }, h("div", { class: "duet-cookie-consent-content" }, h("div", { class: "expand" }, h("slot", null)), h("duet-spacer", { size: "large", direction: "horizontal" }), h("div", null, h("duet-button", { variation: "negative", size: "small", onClick: this.handleClick, margin: "none", "aria-label": this.accessibleLabel, theme: this.theme }, "OK"))))));
+    return (h(Host, { tabindex: "0", class: { "duet-theme-turva": this.theme === "turva" } }, h("div", { class: { "duet-cookie-consent": true, "duet-theme-turva": this.theme === "turva" } }, h("div", { class: "duet-cookie-consent-content" }, h("div", { class: "expand" }, h("slot", null)), h("duet-spacer", { size: "large", direction: "horizontal" }), h("div", null, h("duet-button", { 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"; }
@@ -99,11 +109,26 @@ export class DuetCookieConsent {
           "references": {
             "DuetCookieConsentEvent": {
               "location": "local",
-              "path": "/Users/mgibas/workspace/duet/packages/components/src/components/duet-cookie-consent/duet-cookie-consent.tsx"
+              "path": "/Users/laaksju3/duetds/packages/components/src/components/duet-cookie-consent/duet-cookie-consent.tsx"
             }
           }
         }
       }];
   }
   static get elementRef() { return "element"; }
+  static get listeners() {
+    return [{
+        "name": "focusin",
+        "method": "handleFocusIn",
+        "target": undefined,
+        "capture": false,
+        "passive": false
+      }, {
+        "name": "focusout",
+        "method": "handleFocusOut",
+        "target": undefined,
+        "capture": false,
+        "passive": false
+      }];
+  }
 }