@duetds/components 6.5.2 → 6.6.0

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

@@ -135,9 +135,6 @@
 .duet-slideout.duet-theme-turva button.active::after {
   background: #c60c30;
 }
-.duet-slideout.duet-theme-turva .items {
-  background: white;
-}
 
 ::slotted(*) {
   width: 100%;

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

@@ -5,7 +5,9 @@ import { h, Host } from "@stencil/core";
 import { inheritGlobalTheme } from "../../common/themeable-component";
 export class DuetSlideoutLink {
   constructor() {
+    this.accessibleLabel = undefined;
     this.theme = "";
+    this.targetLanguage = undefined;
     this.active = false;
     this.href = "#";
     this.icon = undefined;
@@ -29,7 +31,7 @@ export class DuetSlideoutLink {
         "duet-theme-turva": this.theme === "turva",
         active: this.active,
         [this.size]: true,
-      }, href: this.href, role: this.menuItem && "menuitem" }, this.icon && (h("duet-icon", { name: this.icon, color: this.menuItem && "currentColor", size: this.menuItem ? "x-small" : "medium", margin: "none" })), h("span", null, h("slot", null), h("slot", { name: "description" })), this.caret && h("duet-icon", { name: "action-arrow-right", color: "primary", size: "x-small", margin: "none" }))));
+      }, href: this.href, role: this.menuItem && "menuitem", lang: this.targetLanguage, hreflang: this.targetLanguage, "aria-label": this.accessibleLabel }, this.icon && (h("duet-icon", { name: this.icon, color: this.menuItem && "currentColor", size: this.menuItem ? "x-small" : "medium", margin: "none" })), h("span", null, h("slot", null), h("slot", { name: "description" })), this.caret && h("duet-icon", { name: "action-arrow-right", color: "primary", size: "x-small", margin: "none" }))));
   }
   static get is() { return "duet-slideout-link"; }
   static get encapsulation() { return "shadow"; }
@@ -45,6 +47,23 @@ export class DuetSlideoutLink {
   }
   static get properties() {
     return {
+      "accessibleLabel": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Adds accessible label for the button that is only shown for screen readers.\nTypically, this label text replaces the visible text on the button for\nusers who use assistive technology."
+        },
+        "attribute": "accessible-label",
+        "reflect": false
+      },
       "theme": {
         "type": "string",
         "mutable": true,
@@ -68,6 +87,24 @@ export class DuetSlideoutLink {
         "reflect": false,
         "defaultValue": "\"\""
       },
+      "targetLanguage": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "\"en\" | \"fi\" | \"sv\"",
+          "resolved": "\"en\" | \"fi\" | \"sv\"",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Language of the link. Use this only for language selection links."
+        },
+        "attribute": "target-language",
+        "reflect": false,
+        "defaultValue": "undefined"
+      },
       "active": {
         "type": "boolean",
         "mutable": true,

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

@@ -42,7 +42,7 @@
 .duet-slideout-panel .link {
   position: relative;
   display: flex;
-  gap: 8px;
+  gap: 20px;
   align-items: center;
   justify-content: flex-start;
   width: 100%;
@@ -104,7 +104,6 @@
   height: 100%;
   overflow-y: auto;
   visibility: visible;
-  background: #f3f9fc;
 }
 .duet-slideout-panel .dialog.hidden {
   visibility: hidden;
@@ -151,16 +150,10 @@
 .duet-slideout-panel.duet-theme-turva .link.active .label-text::after {
   background: #c60c30;
 }
-.duet-slideout-panel.duet-theme-turva .dialog {
-  background: #f5f5f7;
-}
 .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: #171c3a;
 }
-.duet-slideout-panel.duet-theme-turva .items {
-  background: #f5f5f7;
-}
 
 slot:not([name=label]) {
   --active-height: 1px;

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

@@ -5,6 +5,7 @@ import { h, Host } from "@stencil/core";
 import { inheritGlobalTheme } from "../../common/themeable-component";
 import { FocusGuard } from "../../utils/focus-utils";
 import { getLocaleString } from "../../utils/language-utils";
+import { getColorByName } from "../../utils/token-utils";
 export class DuetSlideoutPanel {
   constructor() {
     this.exitLangObject = {
@@ -44,6 +45,7 @@ export class DuetSlideoutPanel {
     this.open = false;
     this.icon = undefined;
     this.labelSize = "medium";
+    this.backgroundColor = "primary-lightest";
   }
   /**
    * Component lifecycle events.
@@ -57,6 +59,14 @@ export class DuetSlideoutPanel {
    * Always the last one in the class.
    */
   render() {
+    const defaultBackgroundColor = this.backgroundColor === "primary-lightest"
+      ? this.theme === "turva"
+        ? "gray-lighter"
+        : this.backgroundColor
+      : this.backgroundColor;
+    const styles = {
+      background: getColorByName(defaultBackgroundColor, this.theme),
+    };
     const exitTranslation = getLocaleString(this.exitLangObject);
     return (h(Host, null, h("div", { class: {
         "duet-slideout-panel": true,
@@ -65,10 +75,10 @@ export class DuetSlideoutPanel {
       } }, h("button", { ref: element => (this.openButton = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", id: "button", type: "button", class: {
         link: true,
         active: this.active,
-      }, onClick: this.onToggleClick }, this.icon && h("duet-icon", { name: this.icon, size: "x-small", margin: "none" }), h("div", { class: "label" }, h("span", { class: { "label-text": true, [this.labelSize]: true } }, h("slot", { name: "label" })), h("duet-icon", { class: "caret", name: "action-arrow-right", margin: "none", size: "x-small" }))), h("div", { class: {
+      }, onClick: this.onToggleClick }, this.icon && h("duet-icon", { name: this.icon, size: "medium", margin: "none" }), h("div", { class: "label" }, h("span", { class: { "label-text": true, [this.labelSize]: true } }, h("slot", { name: "label" })), h("duet-icon", { class: "caret", name: "action-arrow-right", margin: "none", size: "x-small" }))), h("div", { class: {
         dialog: true,
         hidden: !this.open,
-      } }, h(FocusGuard, { moveFocusTo: this.closeButton }), h("div", { class: "top" }, h("button", { ref: element => (this.closeButton = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", type: "button", class: {
+      }, style: styles }, h(FocusGuard, { moveFocusTo: this.closeButton }), h("div", { class: "top" }, h("button", { ref: element => (this.closeButton = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", type: "button", class: {
         back: true,
       }, onClick: this.onToggleClick }, h("duet-icon", { class: "caret", name: "action-arrow-left", margin: "none", size: "small" })), h("span", null, this.label.innerHTML), h("button", { type: "button", onClick: this.onCloseClick, "aria-label": `${exitTranslation}` }, h("duet-icon", { name: "navigation-close", size: "small", margin: "none" }))), h("div", { tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
         items: true,
@@ -182,6 +192,29 @@ export class DuetSlideoutPanel {
         "attribute": "label-size",
         "reflect": true,
         "defaultValue": "\"medium\""
+      },
+      "backgroundColor": {
+        "type": "string",
+        "mutable": true,
+        "complexType": {
+          "original": "DuetColor",
+          "resolved": "string",
+          "references": {
+            "DuetColor": {
+              "location": "import",
+              "path": "../../common-types"
+            }
+          }
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Background color. Use one of the color tokens."
+        },
+        "attribute": "background-color",
+        "reflect": true,
+        "defaultValue": "\"primary-lightest\""
       }
     };
   }

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

@@ -6,6 +6,7 @@ import { getLocaleString } from "../../utils/language-utils";
 export class DuetTab {
   constructor() {
     this.label = undefined;
+    this.caption = undefined;
     this.selected = undefined;
     this.accessibleDescriptionDefault = null;
     this.accessibleDescription = this.accessibleDescriptionDefault
@@ -52,6 +53,23 @@ export class DuetTab {
         "attribute": "label",
         "reflect": true
       },
+      "caption": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Caption for the tab."
+        },
+        "attribute": "caption",
+        "reflect": true
+      },
       "selected": {
         "type": "boolean",
         "mutable": false,

package/lib/collection/components/duet-tab-group/duet-tab-group.css

@@ -51,6 +51,28 @@
   border-bottom-color: #e4e4e6;
 }
 
+.duet-tab-variation-checked .duet-tab-group-tabs {
+  display: flex;
+  gap: 8px;
+  padding-right: 16px;
+  padding-left: 16px;
+  overflow-x: scroll;
+  /* Hide scrollbar for IE, Edge and Firefox */
+  -ms-overflow-style: none;
+  /* IE and Edge */
+  scrollbar-width: none;
+  /* Firefox */
+  /* Hide scrollbar for Chrome, Safari and Opera */
+}
+.duet-tab-variation-checked .duet-tab-group-tabs::-webkit-scrollbar {
+  display: none;
+}
+@media (min-width: 36em) {
+  .duet-tab-variation-checked .duet-tab-group-tabs {
+    overflow: visible;
+  }
+}
+
 @media (min-width: 36em) {
   duet-select {
     display: none !important;
@@ -66,6 +88,7 @@
   width: 100%;
   padding: 20px;
   margin-top: -2px;
+  overflow: visible;
   font-family: "localtapiola-sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
   font-size: 1rem;
   font-weight: 600;
@@ -179,6 +202,108 @@
   border-bottom-color: #c60c30;
 }
 
+.duet-tab-variation-checked .duet-tab-button {
+  position: relative;
+  display: inline-block;
+  flex-basis: 0;
+  flex-grow: 1;
+  width: 200px;
+  min-width: 200px;
+  padding: 16px;
+  border-color: #cfd2d4;
+  border-bottom-color: #0077b3;
+  border-radius: 4px 4px 0 0;
+  transition: none;
+}
+.duet-theme-turva.duet-tab-variation-checked .duet-tab-button {
+  border-color: #cfd2d4;
+  border-bottom-color: #444445;
+}
+
+@media (min-width: 36em) {
+  .duet-tab-variation-checked .duet-tab-button {
+    min-width: 0;
+  }
+}
+.duet-tab-variation-checked .duet-tab-button.stackable-tab {
+  min-width: 0;
+}
+.duet-tab-variation-checked .duet-tab-button:first-child {
+  margin-left: auto;
+}
+.duet-tab-variation-checked .duet-tab-button:last-child {
+  margin-right: auto;
+}
+.duet-tab-variation-checked .duet-tab-button:active {
+  opacity: 1;
+  transition: none;
+}
+.duet-tab-variation-checked .duet-tab-button.selected {
+  color: #0077b3;
+  background: linear-gradient(180deg, #f3f9fc 0%, white 100%);
+  border-color: #0077b3;
+  border-bottom-color: #fff;
+}
+.duet-theme-turva.duet-tab-variation-checked .duet-tab-button.selected {
+  color: #171c3a;
+  background: linear-gradient(180deg, #f5f5f7 0%, white 100%);
+  border-color: #444445;
+  border-bottom-color: #fff;
+}
+
+.duet-tab-variation-checked .duet-tab-button .checked-tab-content {
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+}
+.duet-tab-variation-checked .duet-tab-button .checked-tab-content.stackable-checked-tab-content {
+  flex-direction: column;
+  height: 100%;
+}
+@media (min-width: 36em) {
+  .duet-tab-variation-checked .duet-tab-button .checked-tab-content.stackable-checked-tab-content {
+    flex-direction: row;
+  }
+}
+.duet-tab-variation-checked .duet-tab-button .checked-tab-content .checked-tab-description {
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+  overflow-wrap: break-word;
+}
+.duet-tab-variation-checked .duet-tab-button .checked-tab-content .checked-tab-description.stackable-description {
+  text-align: center;
+}
+@media (min-width: 36em) {
+  .duet-tab-variation-checked .duet-tab-button .checked-tab-content .checked-tab-description.stackable-description {
+    text-align: left;
+  }
+}
+.duet-tab-variation-checked .duet-tab-button .checked-tab-content .checked-tab-description .tab-caption {
+  margin-top: 4px;
+  font-weight: 400;
+  color: #657787;
+}
+.duet-theme-turva.duet-tab-variation-checked .duet-tab-button .checked-tab-content .checked-tab-description .tab-caption {
+  color: #444445;
+}
+
+.duet-tab-variation-checked .duet-tab-button .checked-tab-content .checked-tab-description .tab-caption.selected {
+  color: #0077b3;
+}
+.duet-theme-turva.duet-tab-variation-checked .duet-tab-button .checked-tab-content .checked-tab-description .tab-caption.selected {
+  color: #444445;
+}
+
+.duet-tab-variation-checked .duet-tab-button .checked-tab-content .stackable-checkmark {
+  order: -1;
+}
+@media (min-width: 36em) {
+  .duet-tab-variation-checked .duet-tab-button .checked-tab-content .stackable-checkmark {
+    order: 1;
+  }
+}
+
 .duet-tab-group-content {
   position: relative;
   width: 100%;
@@ -189,7 +314,22 @@
   color: #00294d;
   text-align: left;
 }
+.duet-tab-group-content.checked-group-content {
+  padding: 28px 0 28px 0;
+}
+.duet-tab-group-content.checked-group-content::after {
+  position: absolute;
+  top: -2px;
+  left: 0;
+  width: 100%;
+  height: 2px;
+  content: " ";
+  background-color: #0077b3;
+}
 .duet-theme-turva .duet-tab-group-content {
   font-family: "turva-sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
   color: #171c3a;
+}
+.duet-theme-turva .duet-tab-group-content.checked-group-content::after {
+  background-color: #444445;
 }

package/lib/collection/components/duet-tab-group/duet-tab-group.js

@@ -30,13 +30,20 @@ export class DuetTabGroup {
         button.focus();
       }
     };
+    this.scrollToActive = () => {
+      const active = this.tabsContainer.querySelector(".selected");
+      if (active) {
+        active.scrollIntoView({ behavior: "smooth", inline: "center", block: "nearest" });
+      }
+    };
     this.renderTab = () => {
       const renderedTabs = this.tabs.map((element, index) => {
         return (h("button", { role: "tab", id: this.getButtonId(index), "aria-controls": this.getTabId(index), "aria-selected": element.selected ? "true" : "false", "aria-description": this.getAccessibleDescription(index), tabindex: index === 0 ? "0" : "-1", part: `${this.identifier}-button ${element.selected ? `${this.identifier}-button--selected` : ""}`, type: "button", class: {
             "duet-p-0": this.padding === "none",
             "duet-tab-button": true,
+            "stackable-tab": this.variation === "checked" && this.tabs.length <= 3,
             selected: element.selected,
-          }, onClick: () => this.openTab(index), onKeyDown: ev => this.handleKeyDown(ev) }, element.label));
+          }, onClick: () => this.openTab(index), onKeyDown: ev => this.handleKeyDown(ev) }, this.variation === "checked" ? (h("div", { class: { "checked-tab-content": true, "stackable-checked-tab-content": this.tabs.length <= 3 } }, h("div", { class: { "checked-tab-description": true, "stackable-description": this.tabs.length <= 3 } }, h("p", null, element.label), h("p", { class: { "tab-caption": true, selected: element.selected } }, element.caption)), h("div", { class: { "stackable-checkmark": this.tabs.length <= 3 } }, h("duet-checkmark", { theme: this.theme, checked: element.selected, type: "radio", "presentation-only": true, center: true })))) : (element.label)));
       });
       if (this.scrolls) {
         return (h("duet-scrollable", { selected: this.selected, identifier: this.identifier }, renderedTabs));
@@ -90,6 +97,13 @@ export class DuetTabGroup {
   componentWillLoad() {
     inheritGlobalTheme(this);
   }
+  componentDidLoad() {
+    if (this.variation === "checked") {
+      setTimeout(() => {
+        this.scrollToActive();
+      }, 50);
+    }
+  }
   /**
    * This method allows you to open any of the tabs by calling the method and
    * passing the index of the tab. Please note that index starts from zero.
@@ -102,6 +116,11 @@ export class DuetTabGroup {
     this.tabs.forEach((tab, i) => {
       tab.selected = i === tabIndex;
     });
+    if (this.variation === "checked") {
+      setTimeout(() => {
+        this.scrollToActive();
+      }, 50);
+    }
     const event = {
       value: tabIndex,
       component: "duet-tab-group",
@@ -161,14 +180,20 @@ export class DuetTabGroup {
         [`duet-tab-variation-${this.variation}`]: true,
         "duet-tab-group-scrolls": this.scrolls,
         "duet-tab-group-collapses": this.collapses,
-      }, "aria-label": this.accessibleLabel }, this.tabs.length > 3 && this.collapses && (h("duet-select", { value: this.selected.toString(), expand: true, label: this.label, labelHidden: this.labelHidden, theme: this.theme, onDuetChange: event => this.openTab(Number(event.detail.value)), items: this.tabs.map((tab, index) => {
+      }, "aria-label": this.accessibleLabel }, this.variation !== "checked" && this.tabs.length > 3 && this.collapses && (h("duet-select", { value: this.selected.toString(), expand: true, label: this.label, labelHidden: this.labelHidden, theme: this.theme, onDuetChange: event => this.openTab(Number(event.detail.value)), items: this.tabs.map((tab, index) => {
         return { label: tab.label, value: index.toString() };
       }) })), h("div", { role: "tablist", class: {
-        "duet-m-0": this.margin === "none",
+        "duet-m-0": this.margin === "none" || this.variation === "checked",
         "duet-tab-group-tabs": true,
-        "duet-tab-group-hidden": this.tabs.length > 3,
+        "duet-tab-group-hidden": this.tabs.length > 3 && this.variation !== "checked",
         "duet-tab-group-collapses": this.collapses,
-      } }, this.renderTab()), h("div", { role: "tabpanel", tabindex: this.setTabIndex ? null : "0", class: { "duet-tab-group-content": true, "duet-m-0": this.margin === "none" } }, h("slot", null))));
+      }, ref: el => {
+        this.tabsContainer = el;
+      } }, this.renderTab()), h("div", { role: "tabpanel", tabindex: this.setTabIndex ? null : "0", class: {
+        "duet-tab-group-content": true,
+        "duet-m-0": this.margin === "none",
+        "checked-group-content": this.variation === "checked",
+      } }, h("slot", null))));
   }
   static get is() { return "duet-tab-group"; }
   static get encapsulation() { return "shadow"; }
@@ -266,7 +291,7 @@ export class DuetTabGroup {
         "mutable": false,
         "complexType": {
           "original": "DuetTabVariation",
-          "resolved": "\"default\" | \"plain\"",
+          "resolved": "\"checked\" | \"default\" | \"plain\"",
           "references": {
             "DuetTabVariation": {
               "location": "local"

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

@@ -18,7 +18,7 @@ const stickyTopValues = {
  */
 export class DuetTable {
   constructor() {
-    this.headingSelector = "thead tr > :not(*.duet-editable-table-actions-menu";
+    this.headingSelector = "thead tr > :not(*.duet-editable-table-actions-menu)";
     this.handleMediaQueryChange = (mq) => {
       this.matchesBreakpoint = mq.matches;
     };

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

@@ -5,7 +5,9 @@ import { h, Host } from "@stencil/core";
 import { inheritGlobalTheme } from "../../common/themeable-component";
 export class DuetToolbarDropdownLink {
   constructor() {
+    this.accessibleLabel = undefined;
     this.theme = "";
+    this.targetLanguage = undefined;
     this.href = "#";
     this.icon = undefined;
     this.active = false;
@@ -25,7 +27,7 @@ export class DuetToolbarDropdownLink {
         "duet-toolbar-dropdown-link": true,
         "duet-theme-turva": this.theme === "turva",
         active: this.active,
-      }, href: this.href, role: "menuitem" }, this.icon && h("duet-icon", { name: this.icon, size: "x-small", margin: "none" }), h("slot", null))));
+      }, href: this.href, lang: this.targetLanguage, hreflang: this.targetLanguage, role: "menuitem", "aria-label": this.accessibleLabel }, this.icon && h("duet-icon", { name: this.icon, size: "x-small", margin: "none" }), h("slot", null))));
   }
   static get is() { return "duet-toolbar-dropdown-link"; }
   static get encapsulation() { return "shadow"; }
@@ -41,6 +43,23 @@ export class DuetToolbarDropdownLink {
   }
   static get properties() {
     return {
+      "accessibleLabel": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Adds accessible label for the button that is only shown for screen readers.\nTypically, this label text replaces the visible text on the button for\nusers who use assistive technology."
+        },
+        "attribute": "accessible-label",
+        "reflect": false
+      },
       "theme": {
         "type": "string",
         "mutable": true,
@@ -64,6 +83,24 @@ export class DuetToolbarDropdownLink {
         "reflect": false,
         "defaultValue": "\"\""
       },
+      "targetLanguage": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "\"en\" | \"fi\" | \"sv\"",
+          "resolved": "\"en\" | \"fi\" | \"sv\"",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Language of the link. Use this only for language selection links."
+        },
+        "attribute": "target-language",
+        "reflect": false,
+        "defaultValue": "undefined"
+      },
       "href": {
         "type": "string",
         "mutable": true,

package/lib/dist-custom-elements/duet-action-button.js

@@ -1,7 +1,7 @@
 /*!
  * Built with Duet Design System
  */
-import { D as DuetActionButton$1, d as defineCustomElement$1 } from './p-a623d58c.js';
+import { D as DuetActionButton$1, d as defineCustomElement$1 } from './p-dc195b26.js';
 
 const DuetActionButton = DuetActionButton$1;
 const defineCustomElement = defineCustomElement$1;

package/lib/dist-custom-elements/duet-alert.js

@@ -1,7 +1,7 @@
 /*!
  * Built with Duet Design System
  */
-import { D as DuetAlert$1, d as defineCustomElement$1 } from './p-c933203e.js';
+import { D as DuetAlert$1, d as defineCustomElement$1 } from './p-a0db949c.js';
 
 const DuetAlert = DuetAlert$1;
 const defineCustomElement = defineCustomElement$1;

package/lib/dist-custom-elements/duet-badge.js

@@ -1,7 +1,7 @@
 /*!
  * Built with Duet Design System
  */
-import { D as DuetBadge$1, d as defineCustomElement$1 } from './p-68604dde.js';
+import { D as DuetBadge$1, d as defineCustomElement$1 } from './p-090c4f84.js';
 
 const DuetBadge = DuetBadge$1;
 const defineCustomElement = defineCustomElement$1;

package/lib/dist-custom-elements/duet-breadcrumb.js

@@ -1,9 +1,9 @@
 /*!
  * Built with Duet Design System
  */
-import { p as proxyCustomElement, H, h, b as Host } from './p-4cf27349.js';
+import { p as proxyCustomElement, H, h, b as Host } from './p-58d5e801.js';
 import { i as inheritGlobalTheme } from './p-4ebf1618.js';
-import { d as defineCustomElement$2 } from './p-246bd550.js';
+import { d as defineCustomElement$2 } from './p-83dc78d3.js';
 
 const duetBreadcrumbCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;display:block;width:100%}.duet-breadcrumb{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;height:100%;font-size:0.875rem;color:#00294d;text-decoration:none}.duet-breadcrumb:hover{color:#004d80}.duet-breadcrumb.duet-theme-turva{color:#171c3a}.duet-breadcrumb.duet-theme-turva:hover{color:#940925}.duet-breadcrumb:focus{outline:0}.duet-breadcrumb:active{opacity:0.75}:host(.user-is-tabbing) .duet-breadcrumb:focus{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}:host(.user-is-tabbing) .duet-breadcrumb.duet-theme-turva:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}";
 

package/lib/dist-custom-elements/duet-breadcrumbs.js

@@ -1,10 +1,10 @@
 /*!
  * Built with Duet Design System
  */
-import { p as proxyCustomElement, H, h, F as Fragment, b as Host } from './p-4cf27349.js';
+import { p as proxyCustomElement, H, h, F as Fragment, b as Host } from './p-58d5e801.js';
 import { i as inheritGlobalTheme } from './p-4ebf1618.js';
 import { g as getLocaleString } from './p-ede854e1.js';
-import { d as defineCustomElement$2 } from './p-246bd550.js';
+import { d as defineCustomElement$2 } from './p-83dc78d3.js';
 
 var actionArrowRightSmall={"title":"action-arrow-right-small","tags":"action arrow right small caret","svg":"<svg fill=\"currentColor\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" role=\"img\"><path d=\"M19.5 12a2.3 2.3 0 0 1-.78 1.729L7.568 23.54a1.847 1.847 0 0 1-2.439-2.773l9.752-8.579a.25.25 0 0 0 0-.376L5.129 3.233A1.847 1.847 0 0 1 7.568.46l11.148 9.808A2.31 2.31 0 0 1 19.5 12z\"/></svg>"};
 

package/lib/dist-custom-elements/duet-button.js

@@ -1,7 +1,7 @@
 /*!
  * Built with Duet Design System
  */
-import { D as DuetButton$1, d as defineCustomElement$1 } from './p-bed64271.js';
+import { D as DuetButton$1, d as defineCustomElement$1 } from './p-0b3c5fd3.js';
 
 const DuetButton = DuetButton$1;
 const defineCustomElement = defineCustomElement$1;

package/lib/dist-custom-elements/duet-caption.js

@@ -1,7 +1,7 @@
 /*!
  * Built with Duet Design System
  */
-import { D as DuetCaption$1, d as defineCustomElement$1 } from './p-98ae1730.js';
+import { D as DuetCaption$1, d as defineCustomElement$1 } from './p-d2842398.js';
 
 const DuetCaption = DuetCaption$1;
 const defineCustomElement = defineCustomElement$1;

package/lib/dist-custom-elements/duet-card.js

@@ -1,14 +1,14 @@
 /*!
  * Built with Duet Design System
  */
-import { p as proxyCustomElement, H, c as createEvent, h, F as Fragment, b as Host } from './p-4cf27349.js';
+import { p as proxyCustomElement, H, c as createEvent, h, F as Fragment, b as Host } from './p-58d5e801.js';
 import { i as inheritGlobalTheme } from './p-4ebf1618.js';
 import { c as createID } from './p-c1325e35.js';
 import { i as isKeyboardClick } from './p-d8549efe.js';
 import { s as sanitizeString } from './p-5a9d75e1.js';
 import { g as getColorByName } from './p-535ce3ec.js';
-import { d as defineCustomElement$3 } from './p-246bd550.js';
-import { d as defineCustomElement$2 } from './p-d7d50d4f.js';
+import { d as defineCustomElement$3 } from './p-83dc78d3.js';
+import { d as defineCustomElement$2 } from './p-5243162f.js';
 
 var actionArrowUp={"title":"action-arrow-up","tags":"action arrow up caret","svg":"<svg fill=\"currentColor\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" role=\"img\"><path d=\"M.75 17.939a.752.752 0 0 1-.53-1.281L10.94 5.94c.283-.284.659-.44 1.059-.44.401 0 .777.156 1.06.438l10.721 10.72a.752.752 0 0 1-.53 1.281.743.743 0 0 1-.53-.22L12 7 1.28 17.719a.743.743 0 0 1-.53.22z\"/></svg>"};
 

package/lib/dist-custom-elements/duet-checkbox.js

@@ -1,7 +1,7 @@
 /*!
  * Built with Duet Design System
  */
-import { D as DuetCheckbox$1, d as defineCustomElement$1 } from './p-15968e9a.js';
+import { D as DuetCheckbox$1, d as defineCustomElement$1 } from './p-94317ac7.js';
 
 const DuetCheckbox = DuetCheckbox$1;
 const defineCustomElement = defineCustomElement$1;