@duetds/components 9.2.7 → 10.0.0-alpha.0

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

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

package/lib/dist-custom-elements/duet-popup-menu-item.js

@@ -1,7 +1,7 @@
 /*!
  * Built with Duet Design System
  */
-import { D as DuetPopupMenuItem$1, d as defineCustomElement$1 } from './p-23a9891b.js';
+import { D as DuetPopupMenuItem$1, d as defineCustomElement$1 } from './p-61282ed8.js';
 
 const DuetPopupMenuItem = DuetPopupMenuItem$1;
 const defineCustomElement = defineCustomElement$1;

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

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

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

@@ -3,10 +3,10 @@
  */
 import { p as proxyCustomElement, H, h, d as Host } from './p-f66602b0.js';
 import { i as inheritGlobalTheme } from './p-aaa7a7bd.js';
-import { h as hasSlot, c as checkNamedSlotElement } from './p-8b3decf2.js';
+import { h as hasSlot, c as checkNamedSlotElement } from './p-b5ea877d.js';
 import { g as getColorByName } from './p-88ed3495.js';
-import { d as defineCustomElement$3 } from './p-02e6b3aa.js';
-import { d as defineCustomElement$2 } from './p-a1c8f31d.js';
+import { d as defineCustomElement$3 } from './p-b33a176e.js';
+import { d as defineCustomElement$2 } from './p-fc92fc89.js';
 
 const duetPromoCardCss = "*,*::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;margin-right:4px !important;margin-bottom:2px !important;display:block;width:auto}:host:last-child,:host:last-of-type{margin-right:0 !important}:host(.duet-m-0){margin:0 !important}.duet-promo-card{display:flex;flex-direction:column;width:100%;height:100%;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-style:normal;color:rgb(8, 42, 77);text-align:left;border-radius:20px}.duet-promo-card.duet-p-0{padding:0 !important}.duet-promo-card.duet-m-0{margin:0 !important}.duet-promo-card .content-wrapper{display:flex;flex-direction:column;height:100%;color:inherit;text-decoration:none}.duet-promo-card .content-wrapper:focus{border-radius:20px;outline:0;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.duet-promo-card .image{position:relative;width:100%;overflow:hidden;border-top-left-radius:20px;border-top-right-radius:20px;object-fit:cover}.duet-promo-card .content{display:flex;flex-direction:column;flex-grow:1;gap:8px;padding:20px}@media (min-width: 36em){.duet-promo-card .content{padding:28px}}.duet-promo-card .action{display:flex;flex-grow:1;align-items:flex-end;padding-top:16px}.duet-promo-card.no-bg-color .content{padding:20px 0 0}.duet-promo-card.no-bg-color .image{border-radius:16px}.duet-promo-card.duet-theme-turva{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"}.duet-promo-card.duet-theme-turva .content-wrapper:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-promo-card-link{transition:box-shadow 300ms ease}.duet-promo-card-link:hover{box-shadow:0 2px 6px 0 rgba(0, 41, 77, 0.07), 0 -1px 0 0 rgba(0, 0, 0, 0.09), -1px 0 0 0 rgba(0, 0, 0, 0.07), 1px 0 0 0 rgba(0, 0, 0, 0.07), 0 1px 0 0 rgba(0, 0, 0, 0.07), 0 2px 10px 0 rgba(0, 41, 77, 0.1)}.duet-promo-card-link:hover.duet-theme-turva{box-shadow:0 2px 6px 0 rgba(117, 117, 117, 0.13), 0 -1px 0 0 rgba(0, 0, 0, 0.09), -1px 0 0 0 rgba(0, 0, 0, 0.07), 1px 0 0 0 rgba(0, 0, 0, 0.07), 0 1px 0 0 rgba(0, 0, 0, 0.07), 0 2px 10px 0 rgba(117, 117, 117, 0.15)}";
 const DuetPromoCardStyle0 = duetPromoCardCss;
@@ -56,12 +56,12 @@ const DuetPromoCard$1 = /*@__PURE__*/ proxyCustomElement(class DuetPromoCard ext
             backgroundColor: backgroundColor ? backgroundColor : "none",
         };
         const TagName = this.url ? "a" : "div";
-        return (h(Host, { key: 'c1a1de7dff739a9682d326b8d95ebc1a6b654116', class: { "duet-m-0": this.margin === "none" } }, h("aside", { key: 'ca9a98e6b0fd507a266e7df4ea2c9f633c025e94', class: {
+        return (h(Host, { key: 'cf0d6881f2f47a55a8143ca7b3456883bb2d772a', class: { "duet-m-0": this.margin === "none" } }, h("aside", { key: '928893cdc7ec06b1d2c063bb97534847c647272e', class: {
                 "duet-promo-card": true,
                 "duet-theme-turva": this.theme === "turva",
                 "no-bg-color": !this.backgroundColor,
                 "duet-promo-card-link": !!this.url,
-            }, style: bannerStyles }, h(TagName, { key: 'ecd0f55f11b5ab945cb5f8731bfcdf0f9896329f', href: this.url, class: "content-wrapper", ref: element => (this.aOrDivElement = element) }, h("img", { key: '5e172fe31a4f2f5f2a1a332fa8d8b5a1cbf3d01e', class: "image", src: this.image, alt: "", role: "presentation" }), h("div", { key: '0dd4c9c41fea8db65956d2c844fb78a97ab279ef', class: "content" }, this.hasPreHeadingSlot && (h("div", { key: '2d89e751682632487cfcefcdce063886070711a1', class: "pre-heading" }, h("slot", { key: '0e4a51c40d95dd0080de19cd45bf70e117f4a131', name: "pre-heading" }))), this.hasHeadingSlot && (h("div", { key: '72a74b257a084c3ddf7e7285da10875c21db8790', class: "heading" }, h("duet-heading", { key: 'b34a76dad87e9726296d775f3145b2c7b640bee4', theme: this.theme, level: this.headingLevel, "visual-level": "h3", margin: "none", color: this.textColor }, h("span", { key: '3fd56ffd4b2600856059091709f347f689e8a017' }, h("slot", { key: 'ce33481480a296bc9884ed1de8b77e31232b0f23', name: "heading" }))))), this.hasDescriptionSlot && (h("div", { key: 'a3c2f1b7a9bc92599183ce1ea8aabebd0849b30b', class: "description" }, h("duet-paragraph", { key: '2e90a512af33afbf6635faa626ff038d3beb2034', theme: this.theme, margin: "none", color: this.textColor }, h("span", { key: '0d774578043b823e14e314169fdcde5d4a4f002d' }, h("slot", { key: '2da893d28fe769d4d5b9bc46104be41223eb96d8', name: "description" }))))), this.hasActionSlot && (h("div", { key: 'b20a53961de0cf3392ab726634262978ecb3a6f1', class: "action" }, h("slot", { key: '1221939ab0a8061182f7b648c104ad75ae6f36b4', name: "action" }))))))));
+            }, style: bannerStyles }, h(TagName, { key: '364938761185a64da7aa41156bc9537a98214cd9', href: this.url, class: "content-wrapper", ref: element => (this.aOrDivElement = element) }, h("img", { key: '2c0cf1389b24e9f83d2ceaa0f8c9b7d61497be6d', class: "image", src: this.image, alt: "", role: "presentation" }), h("div", { key: '1d0b3d4c573a508916a2764704371938cde06015', class: "content" }, this.hasPreHeadingSlot && (h("div", { key: '2b37c5cdafaed100d881143c347afb3c61001204', class: "pre-heading" }, h("slot", { key: '25a7c6af10e95f45da8d0b541f62deef43e1425c', name: "pre-heading" }))), this.hasHeadingSlot && (h("div", { key: 'd442b4843e6ef12edaf638fa40ea1dfeb7530b67', class: "heading" }, h("duet-heading", { key: 'a958109c2ee15936268c1f4d2442c882b2201f23', theme: this.theme, level: this.headingLevel, "visual-level": "h3", margin: "none", color: this.textColor }, h("span", { key: 'c0e6cfbc00e165a7d268e523f70fb9bd35319d74' }, h("slot", { key: '0486de64216f817a4beea3c033cc8358b1c5e0e4', name: "heading" }))))), this.hasDescriptionSlot && (h("div", { key: '290862c134b87ef88be10e76b8bbcdd4d3b81e4a', class: "description" }, h("duet-paragraph", { key: '62c172d0ca03aaf5a07eebc9ba746522b3ad4111', theme: this.theme, margin: "none", color: this.textColor }, h("span", { key: '2e1aa4953e82e554989d540ea3457b4e3bf41ab1' }, h("slot", { key: 'e84b12f234411a1cc96e6e3162a1c0c18014dd2b', name: "description" }))))), this.hasActionSlot && (h("div", { key: '2fb7c4c6c1c6e1726ea7ae5b2dc98964523f7161', class: "action" }, h("slot", { key: '62ed799aa718b7dfe639a2c06e868ed5d019d881', name: "action" }))))))));
     }
     get element() { return this; }
     static get style() { return DuetPromoCardStyle0; }

package/lib/dist-custom-elements/duet-radio-group.js

@@ -3,23 +3,24 @@
  */
 import { p as proxyCustomElement, H, h, d as Host } from './p-f66602b0.js';
 import { i as inheritGlobalTheme } from './p-aaa7a7bd.js';
-import { c as checkNamedSlotElement } from './p-8b3decf2.js';
+import { c as checkNamedSlotElement } from './p-b5ea877d.js';
 import { f as findCheckedOption, w as watchForOptions } from './p-7d8a2628.js';
 import { d as defineCustomElement$8 } from './p-a6b39855.js';
-import { d as defineCustomElement$7 } from './p-343f0aa2.js';
-import { d as defineCustomElement$6 } from './p-b5b250a2.js';
-import { d as defineCustomElement$5 } from './p-1a9028fa.js';
-import { d as defineCustomElement$4 } from './p-0bd5bcab.js';
-import { d as defineCustomElement$3 } from './p-aad0e9d5.js';
-import { d as defineCustomElement$2 } from './p-20906875.js';
+import { d as defineCustomElement$7 } from './p-c57a67d3.js';
+import { d as defineCustomElement$6 } from './p-8342a3e5.js';
+import { d as defineCustomElement$5 } from './p-98b1d4c1.js';
+import { d as defineCustomElement$4 } from './p-ee079d76.js';
+import { d as defineCustomElement$3 } from './p-c9a14c7b.js';
+import { d as defineCustomElement$2 } from './p-18c3a72b.js';
 
-const duetRadioGroupCss = "*.sc-duet-radio-group,*.sc-duet-radio-group::after,*.sc-duet-radio-group::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}.sc-duet-radio-group-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;display:block;width:100%}.horizontal.sc-duet-radio-group-h .duet-radio-group.sc-duet-radio-group{display:block}@media (min-width: 48em){.horizontal.sc-duet-radio-group-h .duet-radio-group.sc-duet-radio-group{display:flex}}.horizontal.sc-duet-radio-group-h .duet-radio-group.duet-no-stacking.sc-duet-radio-group{display:flex}.deut-radio-group.sc-duet-radio-group{width:100%}";
+const duetRadioGroupCss = "*,*::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%}:host(.horizontal) .duet-radio-group{display:block}@media (min-width: 48em){:host(.horizontal) .duet-radio-group{display:flex}}:host(.horizontal) .duet-radio-group.duet-no-stacking{display:flex}.deut-radio-group{width:100%}";
 const DuetRadioGroupStyle0 = duetRadioGroupCss;
 
 const DuetRadioGroup$1 = /*@__PURE__*/ proxyCustomElement(class DuetRadioGroup extends H {
     constructor() {
         super();
         this.__registerHost();
+        this.__attachShadow();
         /**
          * Component event handling.
          */
@@ -123,7 +124,7 @@ const DuetRadioGroup$1 = /*@__PURE__*/ proxyCustomElement(class DuetRadioGroup e
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { onDuetChange: this.onSelect, class: { horizontal: this.direction === "horizontal" } }, h("duet-fieldset", { label: this.label, labelHidden: this.labelHidden, caption: this.caption, error: this.error, margin: this.margin, theme: this.theme, "accessible-live-error": this.accessibleLiveError }, this.tooltip && (h("duet-tooltip", { slot: "tooltip", direction: this.tooltipDirection, accessibleInputLabel: this.label }, this.tooltip)), h("slot", { name: "tooltip" }), h("div", { class: { "duet-radio-group": true, "duet-no-stacking": !this.responsive } }, h("slot", null)))));
+        return (h(Host, { key: 'e516156e7c44831a8e14c4025a5533d4b2a4b7c9', onDuetChange: this.onSelect, class: { horizontal: this.direction === "horizontal" } }, h("duet-fieldset", { key: 'dec5b7cb93bc57ea111b05a52dc0a3c2bf34cd79', label: this.label, labelHidden: this.labelHidden, caption: this.caption, error: this.error, margin: this.margin, theme: this.theme, "accessible-live-error": this.accessibleLiveError }, this.tooltip && (h("duet-tooltip", { key: 'e26e641c572e513574e148f6fb7132a6456a5692', slot: "tooltip", direction: this.tooltipDirection, accessibleInputLabel: this.label }, this.tooltip)), h("slot", { key: '27b29b5694912bcbac44b04c4842eaf18acfb941', name: "tooltip" }), h("div", { key: '6ddeead79d117c688fcb68166a7eecbd51f5b7df', class: { "duet-radio-group": true, "duet-no-stacking": !this.responsive } }, h("slot", { key: '3b8f61ca49010d8ebd8aed718c514a5e51f9feaf' })))));
     }
     get element() { return this; }
     static get watchers() { return {
@@ -134,7 +135,7 @@ const DuetRadioGroup$1 = /*@__PURE__*/ proxyCustomElement(class DuetRadioGroup e
         "responsive": ["updateRadios"]
     }; }
     static get style() { return DuetRadioGroupStyle0; }
-}, [6, "duet-radio-group", {
+}, [1, "duet-radio-group", {
         "direction": [1],
         "margin": [1],
         "theme": [1025],

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

@@ -4,14 +4,16 @@
 import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-f66602b0.js';
 import { i as inheritGlobalTheme } from './p-aaa7a7bd.js';
 import { c as createID } from './p-5e59e970.js';
+import { g as getElementsFromNamedSlot, h as hasSlot } from './p-b5ea877d.js';
 
-const duetRadioCss = "*.sc-duet-radio,*.sc-duet-radio::after,*.sc-duet-radio::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}.sc-duet-radio-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-right:28px !important;margin-bottom:12px !important;display:inline-flex;width:100%;vertical-align:bottom;-webkit-tap-highlight-color:transparent}.sc-duet-radio-h:last-child,.sc-duet-radio-h:last-of-type{margin-right:0 !important}.vertical.sc-duet-radio-h{margin-right:0 !important}.horizontal.sc-duet-radio-h{margin-bottom:0 !important;width:auto}.horizontal.sc-duet-radio-h .duet-label.sc-duet-radio .duet-label-content.sc-duet-radio{max-width:100%}@media (min-width: 48em){.horizontal-responsive.sc-duet-radio-h{margin-right:28px !important;margin-bottom:0 !important;width:auto}.horizontal-responsive.sc-duet-radio-h:last-child,.horizontal-responsive.sc-duet-radio-h:last-of-type{margin-right:0 !important}.horizontal-responsive.sc-duet-radio-h .duet-label.sc-duet-radio .duet-label-content.sc-duet-radio{max-width:100%}}.duet-m-0.sc-duet-radio-h{margin:0 !important}.sc-duet-radio-h:last-child:not(:only-child){margin-right:0 !important;margin-bottom:0 !important}.duet-label.sc-duet-radio{position:relative;z-index:100;display:flex;width:100%;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:400;hyphens:auto;line-height:1.5;color:rgb(8, 42, 77);word-break:break-word;overflow-wrap:break-word;cursor:pointer;background:transparent}.duet-theme-turva.sc-duet-radio .duet-label.sc-duet-radio{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(23, 28, 58)}.duet-label.sc-duet-radio .duet-label-content.sc-duet-radio{flex-grow:1;font-size:1rem}.duet-label-hidden.sc-duet-radio .duet-label.sc-duet-radio{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);border:0}.duet-radio-container.sc-duet-radio{position:relative;width:100%;height:100%}.duet-radio.sc-duet-radio{padding:14px !important;position:absolute;top:0;left:0;z-index:200;width:100%;height:100%;cursor:pointer;opacity:0}.duet-radio.sc-duet-radio+label.sc-duet-radio::before{z-index:100;flex-shrink:0;width:20px;height:20px;margin:2px 10px 1px 1px;content:\"\";background:rgb(255, 255, 255);border:1px solid rgb(8, 42, 77);border-radius:50%}.duet-theme-turva.sc-duet-radio .duet-radio.sc-duet-radio+label.sc-duet-radio::before{border-color:rgb(23, 28, 58)}.duet-radio.sc-duet-radio:focus+label.sc-duet-radio::before{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.duet-theme-turva.sc-duet-radio .duet-radio.sc-duet-radio:focus+label.sc-duet-radio::before{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-radio.sc-duet-radio:checked+label.sc-duet-radio::after{position:absolute;top:6px;left:5px;z-index:200;flex-shrink:0;width:12px;height:12px;content:\"\";background:rgb(0, 119, 179);border-radius:50%}.duet-theme-turva.sc-duet-radio .duet-radio.sc-duet-radio:checked+label.sc-duet-radio::after{background:rgb(23, 28, 58)}.duet-radio[disabled].sc-duet-radio{cursor:default}.duet-radio[disabled].sc-duet-radio+label.sc-duet-radio{color:rgb(98, 121, 138)}.duet-theme-turva.sc-duet-radio .duet-radio[disabled].sc-duet-radio+label.sc-duet-radio{color:rgb(143, 147, 158)}.duet-radio[disabled].sc-duet-radio+label.sc-duet-radio::before{border-color:rgb(181, 198, 208)}.duet-theme-turva.sc-duet-radio .duet-radio[disabled].sc-duet-radio+label.sc-duet-radio::before{border-color:rgb(143, 147, 158)}.duet-radio[disabled].sc-duet-radio:checked+label.sc-duet-radio::before{border:1px solid rgb(127, 150, 165)}.duet-radio[disabled].sc-duet-radio:checked+label.sc-duet-radio::after{background:rgb(127, 150, 165)}.duet-theme-turva.sc-duet-radio .duet-radio[disabled].sc-duet-radio:checked+label.sc-duet-radio::after{background:rgb(143, 147, 158);border-color:rgb(143, 147, 158)}";
+const duetRadioCss = "*,*::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;margin-right:28px !important;margin-bottom:12px !important;display:inline-flex;width:100%;vertical-align:bottom;-webkit-tap-highlight-color:transparent}:host:last-child,:host:last-of-type{margin-right:0 !important}:host(.vertical){margin-right:0 !important}:host(.horizontal){margin-bottom:0 !important;width:auto}:host(.horizontal) .duet-label .duet-label-content{max-width:100%}@media (min-width: 48em){:host(.horizontal-responsive){margin-right:28px !important;margin-bottom:0 !important;width:auto}:host(.horizontal-responsive):last-child,:host(.horizontal-responsive):last-of-type{margin-right:0 !important}:host(.horizontal-responsive) .duet-label .duet-label-content{max-width:100%}}:host(.duet-m-0){margin:0 !important}:host(:last-child:not(:only-child)){margin-right:0 !important;margin-bottom:0 !important}.duet-label{position:relative;z-index:100;display:flex;width:100%;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:400;hyphens:auto;line-height:1.5;color:rgb(8, 42, 77);word-break:break-word;overflow-wrap:break-word;cursor:pointer;background:transparent}.duet-theme-turva .duet-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, 28, 58)}.duet-label .duet-label-content{flex-grow:1;font-size:1rem}.duet-label-hidden .duet-label{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);border:0}.duet-radio-container{position:relative;width:100%;height:100%}.duet-label::before{z-index:100;flex-shrink:0;width:20px;height:20px;margin:2px 10px 1px 1px;content:\"\";background:rgb(255, 255, 255);border:1px solid rgb(8, 42, 77);border-radius:50%}.duet-theme-turva .duet-label::before{border-color:rgb(23, 28, 58)}.duet-label.focus::before{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.duet-theme-turva .duet-label.focus::before{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-label.checked::after{position:absolute;top:6px;left:5px;z-index:200;flex-shrink:0;width:12px;height:12px;content:\"\";background:rgb(0, 119, 179);border-radius:50%}.duet-theme-turva .duet-label.checked::after{background:rgb(23, 28, 58)}.duet-label.disabled{color:rgb(98, 121, 138)}.duet-theme-turva .duet-label.disabled{color:rgb(143, 147, 158)}.duet-label.disabled::before{border-color:rgb(181, 198, 208)}.duet-theme-turva .duet-label.disabled::before{border-color:rgb(143, 147, 158)}.duet-label.disabled.checked::before{border:1px solid rgb(127, 150, 165)}.duet-label.disabled.checked::after{background:rgb(127, 150, 165)}.duet-theme-turva .duet-label.disabled.checked::after{background:rgb(143, 147, 158);border-color:rgb(143, 147, 158)}*::slotted([slot=input]){padding:14px !important;position:absolute;top:0;left:0;z-index:200;width:100%;height:100%;cursor:pointer;opacity:0}*::slotted([slot=input][disabled]){cursor:default}";
 const DuetRadioStyle0 = duetRadioCss;
 
 const DuetRadio$1 = /*@__PURE__*/ proxyCustomElement(class DuetRadio extends H {
     constructor() {
         super();
         this.__registerHost();
+        this.__attachShadow();
         this.duetChange = createEvent(this, "duetChange", 7);
         this.duetFocus = createEvent(this, "duetFocus", 7);
         this.duetBlur = createEvent(this, "duetBlur", 7);
@@ -19,6 +21,70 @@ const DuetRadio$1 = /*@__PURE__*/ proxyCustomElement(class DuetRadio extends H {
          * Own Properties.
          */
         this.radioId = createID("DuetRadio");
+        this.radioInputListenersRemove = radioInput => {
+            radioInput.removeEventListener("change", this.onChange);
+            //radioInput.removeEventListener("click", this.onRadioClick)
+            radioInput.removeEventListener("focus", this.onFocus);
+            radioInput.removeEventListener("blur", this.onBlur);
+        };
+        this.radioInputListenersAdd = radioInput => {
+            radioInput.addEventListener("change", this.onChange);
+            //radioInput.addEventListener("click", this.onRadioClick)
+            radioInput.addEventListener("focus", this.onFocus);
+            radioInput.addEventListener("blur", this.onBlur);
+        };
+        this.radioInputSetUp = () => {
+            const slotInput = this.element.querySelector("input[slot=input]");
+            const radioInput = slotInput || document.createElement("input");
+            radioInput.slot = "input";
+            radioInput.disabled = this.disabled || this.groupDisabled ? true : undefined;
+            radioInput.id = this.identifier || this.radioId;
+            radioInput.type = "radio";
+            radioInput.name = this.name;
+            radioInput.value = this.value;
+            radioInput.checked = this.checked;
+            if (this.accessibleIndex) {
+                radioInput.tabIndex = Number(this.accessibleIndex);
+            }
+            radioInput.required = this.required;
+            radioInput.role = this.role;
+            if (this.accessibleControls) {
+                radioInput.setAttribute("aria-controls", this.accessibleControls);
+            }
+            if (this.accessibleActiveDescendant) {
+                radioInput.setAttribute("aria-activedescendant", this.accessibleActiveDescendant);
+            }
+            if (this.accessibleOwns) {
+                radioInput.setAttribute("aria-owns", this.accessibleOwns);
+            }
+            if (this.accessibleDescribedBy) {
+                radioInput.setAttribute("aria-describedby", this.accessibleDescribedBy);
+            }
+            if (this.accessibleLabelledBy) {
+                radioInput.setAttribute("aria-labelledby", this.accessibleLabelledBy);
+            }
+            if (this.accessibleDetails) {
+                radioInput.setAttribute("aria-details", this.accessibleDetails);
+            }
+            if (this.accessibleDescription) {
+                radioInput.setAttribute("aria-description", this.accessibleDescription);
+            }
+            if (this.hasLabel) {
+                const slotContent = getElementsFromNamedSlot(this.element, "label");
+                radioInput.ariaLabel = slotContent.length > 0 ? slotContent[0].textContent : this.labelElement.textContent;
+            }
+            else {
+                radioInput.ariaLabel = this.labelElement.textContent;
+            }
+            if (slotInput) {
+                this.radioInputListenersRemove(radioInput);
+            }
+            else {
+                this.element.appendChild(radioInput);
+            }
+            this.radioInputListenersAdd(radioInput);
+            this.focusableElement = radioInput;
+        };
         /**
          * Component event handling.
          */
@@ -26,7 +92,9 @@ const DuetRadio$1 = /*@__PURE__*/ proxyCustomElement(class DuetRadio extends H {
             ev.stopPropagation();
         };
         this.onChange = (ev) => {
-            this.checked = this.nativeInput.checked || false;
+            const input = this.focusableElement;
+            const inputChecked = input.checked;
+            this.checked = inputChecked;
             if (this.checked && !this.blockEvents) {
                 this.duetChange.emit({
                     originalEvent: ev,
@@ -37,6 +105,7 @@ const DuetRadio$1 = /*@__PURE__*/ proxyCustomElement(class DuetRadio extends H {
             }
         };
         this.onBlur = (ev) => {
+            this.focus = false;
             this.duetBlur.emit({
                 originalEvent: ev,
                 checked: this.checked,
@@ -45,6 +114,7 @@ const DuetRadio$1 = /*@__PURE__*/ proxyCustomElement(class DuetRadio extends H {
             });
         };
         this.onFocus = (ev) => {
+            this.focus = true;
             this.duetFocus.emit({
                 originalEvent: ev,
                 checked: this.checked,
@@ -52,6 +122,7 @@ const DuetRadio$1 = /*@__PURE__*/ proxyCustomElement(class DuetRadio extends H {
                 component: "duet-radio",
             });
         };
+        this.focus = false;
         this.accessibleActiveDescendant = undefined;
         this.accessibleDetails = undefined;
         this.accessibleLabelledBy = undefined;
@@ -80,33 +151,40 @@ const DuetRadio$1 = /*@__PURE__*/ proxyCustomElement(class DuetRadio extends H {
      */
     componentWillLoad() {
         inheritGlobalTheme(this);
-        this.hasLabel = !!this.element.querySelector(":scope > [slot='label']");
+        this.hasLabel = hasSlot(this.element, "label");
         if (this.value === undefined) {
             this.value = this.identifier;
         }
     }
+    componentDidRender() {
+        this.radioInputSetUp();
+    }
     /**
      * Sets focus on the specified `duet-radio`. Use this method instead of the global
      * `input.focus()`.
      */
     async setFocus(options) {
-        this.nativeInput.focus(options);
+        this.focusableElement.focus(options);
     }
     /**
      * render() function
      * Always the last one in the class.
      */
     render() {
-        const identifier = this.identifier || this.radioId;
-        return (h(Host, { onClick: this.onClick, class: {
+        return (h(Host, { key: '45b1545ee1fba45f0e798ecc8d00e3a1008626f8', onClick: this.onClick, class: {
                 horizontal: this.groupDirection === "horizontal" && !this.groupResponsive,
                 "horizontal-responsive": this.groupDirection === "horizontal" && this.groupResponsive,
                 "duet-m-0": this.margin === "none",
-            } }, h("div", { class: { "duet-radio-container": true, "duet-theme-turva": this.theme === "turva" } }, h("input", { type: "radio", onFocus: this.onFocus, onBlur: this.onBlur, onChange: this.onChange, value: this.value, tabindex: this.accessibleIndex, class: { "duet-radio": true, disabled: this.disabled || this.groupDisabled }, checked: this.checked, disabled: this.disabled || this.groupDisabled, required: this.required, "aria-controls": this.accessibleControls, "aria-activedescendant": this.accessibleActiveDescendant, "aria-owns": this.accessibleOwns, "aria-describedby": this.accessibleDescribedBy, "aria-labelledby": this.accessibleLabelledBy, "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, role: this.role, name: this.name, id: identifier, ref: input => (this.nativeInput = input) }), h("label", { class: "duet-label", htmlFor: identifier }, h("div", { class: "duet-label-content" }, this.hasLabel ? h("slot", { name: "label" }) : this.label)))));
+            } }, h("div", { key: '08a710d7eba8d2d525f28914ee1a607772193aad', class: { "duet-radio-container": true, "duet-theme-turva": this.theme === "turva" } }, h("slot", { key: '0ae4454c2bbca3802ff1e39a9a8cc9fa8e5a0f55', name: "input" }), h("label", { key: '135a95b34307d57a9af5fe5768da8df2a74e7803', inert: true, ref: element => (this.labelElement = element), class: {
+                "duet-label": true,
+                checked: this.checked,
+                focus: this.focus,
+                disabled: this.disabled || this.groupDisabled,
+            } }, h("div", { key: '908ecfc2809c9ff575ded9cc37c034921d7c4966', class: "duet-label-content" }, this.hasLabel ? h("slot", { name: "label" }) : this.label)))));
     }
     get element() { return this; }
     static get style() { return DuetRadioStyle0; }
-}, [6, "duet-radio", {
+}, [1, "duet-radio", {
         "accessibleActiveDescendant": [1, "accessible-active-descendant"],
         "accessibleDetails": [1, "accessible-details"],
         "accessibleLabelledBy": [1, "accessible-labelled-by"],
@@ -129,6 +207,7 @@ const DuetRadio$1 = /*@__PURE__*/ proxyCustomElement(class DuetRadio extends H {
         "groupResponsive": [4, "group-responsive"],
         "checked": [1540],
         "value": [1537],
+        "focus": [32],
         "setFocus": [64]
     }]);
 function defineCustomElement$1() {

package/lib/dist-custom-elements/duet-range-slider.js

@@ -7,9 +7,10 @@ import { i as inheritGlobalTheme } from './p-aaa7a7bd.js';
 import { c as createID } from './p-5e59e970.js';
 import { i as isInternetExplorer } from './p-43b89e38.js';
 import { s as subscribeTabbingChange, u as unsubscribeTabbingChange } from './p-ca700701.js';
+import { p as proxyInputToSlot } from './p-b5ea877d.js';
 import { d as defineCustomElement$2 } from './p-d0aaf2cd.js';
 
-const duetRangeSliderCss = "*.sc-duet-range-slider,*.sc-duet-range-slider::after,*.sc-duet-range-slider::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}.sc-duet-range-slider-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-right:16px !important;margin-bottom:12px !important;display:inline-flex;width:100%;max-width:100%;text-align:left;vertical-align:bottom}.sc-duet-range-slider-h:last-child,.sc-duet-range-slider-h:last-of-type{margin-right:0 !important}@media (min-width: 36em){.sc-duet-range-slider-h{width:calc(50% - 16px - 3px)}.duet-expand.sc-duet-range-slider-h{width:100% !important}}.duet-m-0.sc-duet-range-slider-h{margin:0 !important}.duet-range-container.sc-duet-range-slider{position:relative;width:100%}.duet-output.sc-duet-range-slider{position:absolute;top:12px;right:0;z-index:200;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:0.875rem;font-weight:400;font-variant-numeric:tabular-nums;line-height:1.25;color:rgb(8, 42, 77);background:rgb(255, 255, 255)}.duet-theme-turva.sc-duet-range-slider .duet-output.sc-duet-range-slider{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(23, 28, 58)}.duet-range-disabled.sc-duet-range-slider .duet-output.sc-duet-range-slider{color:rgb(127, 150, 165)}.duet-range-disabled.duet-theme-turva.sc-duet-range-slider .duet-output.sc-duet-range-slider{color:rgb(143, 147, 158)}.duet-range.sc-duet-range-slider{position:relative;z-index:100;width:100%;height:4px;background:rgb(181, 198, 208);border-radius:4px}.duet-theme-turva.sc-duet-range-slider .duet-range.sc-duet-range-slider{background:rgb(199, 202, 207)}.duet-ie.sc-duet-range-slider .duet-range.sc-duet-range-slider{display:block;width:auto;height:26px;background:transparent !important}.duet-range.sc-duet-range-slider::-moz-range-track{height:1px;background:transparent !important;border:0;-moz-appearance:none}.duet-range.sc-duet-range-slider::-ms-track{color:transparent;background:transparent;border:0}.duet-range.sc-duet-range-slider:focus,.duet-range.sc-duet-range-slider:active{outline:0}.user-is-tabbing.sc-duet-range-slider-h .duet-range.sc-duet-range-slider:focus{box-shadow:0 0 0 1px #fff, 0 0 0 3px rgba(0, 119, 179, 0.75)}.user-is-tabbing.sc-duet-range-slider-h .duet-theme-turva.sc-duet-range-slider .duet-range.sc-duet-range-slider:focus{box-shadow:0 0 0 1px #fff, 0 0 0 3px rgba(23, 28, 58, 0.75)}.duet-range.sc-duet-range-slider::-webkit-slider-runnable-track{background:transparent}.duet-range.sc-duet-range-slider::-webkit-slider-thumb{position:relative;width:24px;height:24px;cursor:-webkit-grab;background:rgb(255, 255, 255);border:1px solid rgb(127, 150, 165);border-radius:50%;transition:box-shadow 300ms ease;-webkit-appearance:none}.duet-theme-turva.sc-duet-range-slider .duet-range.sc-duet-range-slider::-webkit-slider-thumb{border-color:rgb(143, 147, 158)}.duet-range.sc-duet-range-slider:active::-webkit-slider-thumb{cursor:-webkit-grabbing}.duet-range.sc-duet-range-slider::-moz-range-thumb{position:relative;width:24px;height:24px;cursor:-moz-grab;background:rgb(255, 255, 255);border:1px solid rgb(127, 150, 165);border-radius:50%;appearance:none}.duet-theme-turva.sc-duet-range-slider .duet-range.sc-duet-range-slider::-moz-range-thumb{border-color:rgb(143, 147, 158)}.duet-range.sc-duet-range-slider:active::-moz-range-thumb{cursor:-moz-grabbing}.duet-range.sc-duet-range-slider::-ms-thumb{position:relative;width:24px;height:24px;overflow:visible;background:rgb(255, 255, 255);border:1px solid rgb(127, 150, 165);border-radius:50%}.duet-theme-turva.sc-duet-range-slider .duet-range.sc-duet-range-slider::-ms-thumb{border-color:rgb(143, 147, 158)}.duet-range.sc-duet-range-slider:disabled{background:rgb(181, 198, 208) !important}.duet-theme-turva.sc-duet-range-slider .duet-range.sc-duet-range-slider:disabled{background:rgb(199, 202, 207) !important}.duet-range.sc-duet-range-slider:disabled::-webkit-slider-thumb{cursor:default;background:rgb(181, 198, 208);border-color:transparent}.duet-theme-turva.sc-duet-range-slider .duet-range.sc-duet-range-slider:disabled::-webkit-slider-thumb{background:rgb(199, 202, 207);border-color:transparent}.duet-range.sc-duet-range-slider:disabled::-moz-range-thumb{cursor:default;background:rgb(181, 198, 208);border-color:transparent}.duet-theme-turva.sc-duet-range-slider .duet-range.sc-duet-range-slider:disabled::-moz-range-thumb{background:rgb(199, 202, 207);border-color:transparent}.duet-range.sc-duet-range-slider:disabled::-ms-thumb{cursor:default;background:rgb(181, 198, 208);border-color:transparent}.duet-theme-turva.sc-duet-range-slider .duet-range.sc-duet-range-slider:disabled::-ms-thumb{background:rgb(199, 202, 207);border-color:transparent}.duet-range.sc-duet-range-slider::-ms-fill-lower{height:4px;background:rgb(0, 119, 179)}.duet-theme-turva.sc-duet-range-slider .duet-range.sc-duet-range-slider::-ms-fill-lower{background:rgb(198, 12, 48)}.duet-range.sc-duet-range-slider::-ms-fill-upper{height:4px;background:rgb(181, 198, 208)}.duet-theme-turva.sc-duet-range-slider .duet-range.sc-duet-range-slider::-ms-fill-upper{background:rgb(199, 202, 207)}.duet-label-hidden.sc-duet-range-slider duet-label.sc-duet-range-slider,.duet-label-hidden.sc-duet-range-slider output.sc-duet-range-slider{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);border:0}";
+const duetRangeSliderCss = "*,*::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;margin-right:16px !important;margin-bottom:12px !important;display:inline-flex;width:100%;max-width:100%;text-align:left;vertical-align:bottom}:host:last-child,:host:last-of-type{margin-right:0 !important}@media (min-width: 36em){:host{width:calc(50% - 16px - 3px)}:host.duet-expand{width:100% !important}}:host(.duet-m-0){margin:0 !important}.duet-range-container{position:relative;width:100%}.duet-output{position:absolute;top:12px;right:0;z-index:200;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:0.875rem;font-weight:400;font-variant-numeric:tabular-nums;line-height:1.25;color:rgb(8, 42, 77);background:rgb(255, 255, 255)}.duet-theme-turva .duet-output{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(23, 28, 58)}.duet-range-disabled .duet-output{color:rgb(127, 150, 165)}.duet-range-disabled.duet-theme-turva .duet-output{color:rgb(143, 147, 158)}.duet-range{position:relative;z-index:100;width:100%;height:4px;background:rgb(181, 198, 208);border-radius:4px}.duet-theme-turva .duet-range{background:rgb(199, 202, 207)}.duet-ie .duet-range{display:block;width:auto;height:26px;background:transparent !important}.duet-range::-moz-range-track{height:1px;background:transparent !important;border:0;-moz-appearance:none}.duet-range::-ms-track{color:transparent;background:transparent;border:0}.duet-range:focus,.duet-range:active{outline:0}:host(.user-is-tabbing) .duet-range:focus{box-shadow:0 0 0 1px #fff, 0 0 0 3px rgba(0, 119, 179, 0.75)}:host(.user-is-tabbing) .duet-theme-turva .duet-range:focus{box-shadow:0 0 0 1px #fff, 0 0 0 3px rgba(23, 28, 58, 0.75)}.duet-range::-webkit-slider-runnable-track{background:transparent}.duet-range::-webkit-slider-thumb{position:relative;width:24px;height:24px;cursor:-webkit-grab;background:rgb(255, 255, 255);border:1px solid rgb(127, 150, 165);border-radius:50%;transition:box-shadow 300ms ease;-webkit-appearance:none}.duet-theme-turva .duet-range::-webkit-slider-thumb{border-color:rgb(143, 147, 158)}.duet-range:active::-webkit-slider-thumb{cursor:-webkit-grabbing}.duet-range::-moz-range-thumb{position:relative;width:24px;height:24px;cursor:-moz-grab;background:rgb(255, 255, 255);border:1px solid rgb(127, 150, 165);border-radius:50%;appearance:none}.duet-theme-turva .duet-range::-moz-range-thumb{border-color:rgb(143, 147, 158)}.duet-range:active::-moz-range-thumb{cursor:-moz-grabbing}.duet-range::-ms-thumb{position:relative;width:24px;height:24px;overflow:visible;background:rgb(255, 255, 255);border:1px solid rgb(127, 150, 165);border-radius:50%}.duet-theme-turva .duet-range::-ms-thumb{border-color:rgb(143, 147, 158)}.duet-range:disabled{background:rgb(181, 198, 208) !important}.duet-theme-turva .duet-range:disabled{background:rgb(199, 202, 207) !important}.duet-range:disabled::-webkit-slider-thumb{cursor:default;background:rgb(181, 198, 208);border-color:transparent}.duet-theme-turva .duet-range:disabled::-webkit-slider-thumb{background:rgb(199, 202, 207);border-color:transparent}.duet-range:disabled::-moz-range-thumb{cursor:default;background:rgb(181, 198, 208);border-color:transparent}.duet-theme-turva .duet-range:disabled::-moz-range-thumb{background:rgb(199, 202, 207);border-color:transparent}.duet-range:disabled::-ms-thumb{cursor:default;background:rgb(181, 198, 208);border-color:transparent}.duet-theme-turva .duet-range:disabled::-ms-thumb{background:rgb(199, 202, 207);border-color:transparent}.duet-range::-ms-fill-lower{height:4px;background:rgb(0, 119, 179)}.duet-theme-turva .duet-range::-ms-fill-lower{background:rgb(198, 12, 48)}.duet-range::-ms-fill-upper{height:4px;background:rgb(181, 198, 208)}.duet-theme-turva .duet-range::-ms-fill-upper{background:rgb(199, 202, 207)}.duet-label-hidden duet-label,.duet-label-hidden output{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);border:0}";
 const DuetRangeSliderStyle0 = duetRangeSliderCss;
 
 const colors = {
@@ -26,12 +27,14 @@ const DuetRangeSlider$1 = /*@__PURE__*/ proxyCustomElement(class DuetRangeSlider
     constructor() {
         super();
         this.__registerHost();
+        this.__attachShadow();
         this.duetChange = createEvent(this, "duetChange", 3);
         this.duetInput = createEvent(this, "duetInput", 7);
         /**
          * Own Properties
          */
         this.rangeId = createID("DuetRange");
+        this.proxyId = createID("DuetRange");
         /**
          * Component event handling.
          */
@@ -95,6 +98,9 @@ const DuetRangeSlider$1 = /*@__PURE__*/ proxyCustomElement(class DuetRangeSlider
     disconnectedCallback() {
         unsubscribeTabbingChange(this);
     }
+    componentDidRender() {
+        proxyInputToSlot(this.element, this.proxyId, this.name, this.value, this.required);
+    }
     /**
      * Sets focus on the specified `duet-range-slider`. Use this method instead of the global
      * `input.focus()`.
@@ -120,17 +126,17 @@ const DuetRangeSlider$1 = /*@__PURE__*/ proxyCustomElement(class DuetRangeSlider
         const rangeStyles = {
             background: `-webkit-linear-gradient(left,${active} 0%,${active} ${percentage}%,${inactive} ${percentage}%)`,
         };
-        return (h(Host, { class: { "duet-m-0": this.margin === "none", "duet-expand": this.expand } }, h("div", { class: {
+        return (h(Host, { key: '88829030a8bbb0f4f4029de9ec16b04e3e476798', class: { "duet-m-0": this.margin === "none", "duet-expand": this.expand } }, h("div", { key: 'be11c8a8f243506acbd30ee4676104dbcea9a1ba', class: {
                 "duet-range-container": true,
                 "duet-label-hidden": this.labelHidden,
                 "duet-theme-turva": this.theme === "turva",
                 "duet-ie": isInternetExplorer(),
                 "duet-range-disabled": this.disabled,
-            } }, h("duet-label", { theme: theme, color: this.labelColor, weight: this.labelWeight, margin: "small", for: identifier }, this.label), h("output", { "aria-hidden": "true", htmlFor: identifier, class: "duet-output" }, this.value.toLocaleString(this.locale), this.unit), h("input", { onInput: this.onInput, onChange: this.onChange, ref: input => (this.nativeInput = input), type: "range", min: this.min, max: this.max, step: this.step, value: this.value, style: rangeStyles, "aria-valuemin": this.min, "aria-valuemax": this.max, "aria-valuenow": this.value, "aria-valuetext": `${this.value} ${this.unit}`, "aria-controls": this.accessibleControls, "aria-activedescendant": this.accessibleActiveDescendant, "aria-owns": this.accessibleOwns, "aria-describedby": this.accessibleDescribedBy, id: identifier, name: this.name, disabled: this.disabled, required: this.required, class: "duet-range" }))));
+            } }, h("duet-label", { key: 'c732b5fee1e4bfdb9873dfea49c26fdc34d6b03d', theme: theme, color: this.labelColor, weight: this.labelWeight, margin: "small" }, this.label), h("output", { key: '43e6503a9b071299e557c6e39b64679e32f8f483', "aria-hidden": "true", htmlFor: identifier, class: "duet-output" }, this.value.toLocaleString(this.locale), this.unit), h("input", { key: '2cc4a064e002ac2c4ae45d6fd13f0bdc3401f5de', onInput: this.onInput, onChange: this.onChange, ref: input => (this.nativeInput = input), type: "range", min: this.min, max: this.max, step: this.step, value: this.value, style: rangeStyles, "aria-label": this.label, "aria-valuemin": this.min, "aria-valuemax": this.max, "aria-valuenow": this.value, "aria-valuetext": `${this.value} ${this.unit}`, "aria-controls": this.accessibleControls, "aria-activedescendant": this.accessibleActiveDescendant, "aria-owns": this.accessibleOwns, "aria-describedby": this.accessibleDescribedBy, id: identifier, name: this.name, disabled: this.disabled, required: this.required, class: "duet-range" }))));
     }
     get element() { return this; }
     static get style() { return DuetRangeSliderStyle0; }
-}, [2, "duet-range-slider", {
+}, [1, "duet-range-slider", {
         "theme": [1025],
         "margin": [1],
         "expand": [4],

package/lib/dist-custom-elements/duet-range-stepper.js

@@ -6,9 +6,9 @@ import { i as inheritGlobalTheme } from './p-aaa7a7bd.js';
 import { c as createID } from './p-5e59e970.js';
 import { h as isArrowLeftKey, e as isArrowUpKey, n as isMinusKey, l as isArrowKey, j as isArrowRightKey, f as isArrowDownKey, o as isPlusKey } from './p-ca700701.js';
 import { g as getLocaleString, c as connectLanguageChangeObserver, d as disconnectLanguageChangeObserver } from './p-35375593.js';
-import { d as defineCustomElement$4 } from './p-6f149d10.js';
-import { d as defineCustomElement$3 } from './p-b5b250a2.js';
-import { d as defineCustomElement$2 } from './p-20906875.js';
+import { d as defineCustomElement$4 } from './p-649a8c3e.js';
+import { d as defineCustomElement$3 } from './p-8342a3e5.js';
+import { d as defineCustomElement$2 } from './p-18c3a72b.js';
 
 const duetRangeStepperCss = "*,*::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:inline-block;margin:0 auto}.duet-range-stepper{display:flex;flex-wrap:wrap;gap:0;align-items:baseline;justify-content:center;min-width:30px;min-height:30px;font-weight:600;text-decoration:none;border-left-width:0}.duet-range-stepper{white-space:nowrap}.duet-range-stepper .duet-range-step-counter{font-weight:600;color:rgb(8, 42, 77)}.duet-range-stepper ::part(button){border:0}";
 const DuetRangeStepperStyle0 = duetRangeStepperCss;
@@ -173,10 +173,10 @@ const DuetRangeStepper$1 = /*@__PURE__*/ proxyCustomElement(class DuetRangeStepp
      * Always the last one in the class.
      */
     render() {
-        return (h("div", { key: '43d93bf62ed3c3b091933da841d015662b158e50', class: {
+        return (h("div", { key: 'e398ec0cf2d35150c78f4e3475fd7e4c95d646ad', class: {
                 "duet-range-stepper": true,
                 "duet-theme-turva": this.theme === "turva",
-            }, onKeyDown: e => this.onKeyboardDown(e), "aria-controls": this.ariaControls }, h("span", { key: '0eb7fa8f8e1f5853a16c85f8d9670c70d531f13a', class: "duet-range-step-counter", part: "range-numbers" }, this.generateStepSize()), h("duet-action-button", { key: 'b89f2b93dfe5a510bf6acbdf30ce694ff1ac59dc', disabled: this.disabled || this.buttonLeftDisabled, class: "duet-range-step-button duet-range-step-minus", onClick: e => this.handleClick(e, -1), id: this.leftBn, "accessible-label": `${this.ariaLabels.previous_increment} ${this.generatePreviousIncrementLabel()}`, ref: el => (this.leftBnRef = el), part: "navigation-arrow", iconName: "action-arrow-left-small", title: "" }), h("duet-action-button", { key: 'a9d84ec5096ae382828ee82ba75bd558b08d49ea', disabled: this.disabled || this.buttonRightDisabled, class: "duet-range-step-button duet-range-step-plus", onClick: e => this.handleClick(e, 1), "accessible-label": `${this.ariaLabels.next_increment} ${this.generateNextIncrementLabel()}`, id: this.rightBn, ref: el => (this.rightBnRef = el), part: "navigation-arrow", iconName: "action-arrow-right-small", title: "" })));
+            }, onKeyDown: e => this.onKeyboardDown(e), "aria-controls": this.ariaControls }, h("span", { key: '24a874579791e03416eb316216ea44c6d35d7e0b', class: "duet-range-step-counter", part: "range-numbers" }, this.generateStepSize()), h("duet-action-button", { key: '13d2b13c96b44797b61192a0e99c63ec0098e7a6', disabled: this.disabled || this.buttonLeftDisabled, class: "duet-range-step-button duet-range-step-minus", onClick: e => this.handleClick(e, -1), id: this.leftBn, "accessible-label": `${this.ariaLabels.previous_increment} ${this.generatePreviousIncrementLabel()}`, ref: el => (this.leftBnRef = el), part: "navigation-arrow", iconName: "action-arrow-left-small", title: "" }), h("duet-action-button", { key: 'd8b25262e3f9549252640e5479b83dd2c7ea4930', disabled: this.disabled || this.buttonRightDisabled, class: "duet-range-step-button duet-range-step-plus", onClick: e => this.handleClick(e, 1), "accessible-label": `${this.ariaLabels.next_increment} ${this.generateNextIncrementLabel()}`, id: this.rightBn, ref: el => (this.rightBnRef = el), part: "navigation-arrow", iconName: "action-arrow-right-small", title: "" })));
     }
     get element() { return this; }
     static get watchers() { return {

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

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

package/lib/dist-custom-elements/duet-section-layout.js

@@ -21,13 +21,13 @@ const DuetSectionLayout$1 = /*@__PURE__*/ proxyCustomElement(class DuetSectionLa
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: '5a0fe7bda2f99a571bb9a91389d22bb429b92176', class: {
+        return (h(Host, { key: '7f434babace607653e64faabeddb9c27bb616862', class: {
                 "duet-middle": this.middle,
                 "duet-ie": isInternetExplorer(),
-            } }, h("div", { key: 'fa8ce66fb4314c7b613db9d9c8a41a6184998e6f', class: { "duet-layout-wrapper": true, "duet-m-0": this.margin === "none" } }, h("div", { key: 'eec70679e3914498d52cf5fabc0b6f107afcb263', class: {
+            } }, h("div", { key: '9fbdea587d94910e97eb9ecbea464c1778fc1ff8', class: { "duet-layout-wrapper": true, "duet-m-0": this.margin === "none" } }, h("div", { key: 'f4c957ebabd014d3ebf626d7539f3542314ce0a1', class: {
                 "duet-layout": true,
                 [`padding-${this.paddingBreakpoint}`]: !!this.paddingBreakpoint,
-            } }, h("section", { key: 'a6816d9b522355e91cd3e226d5501b50b27ca0cc', class: "duet-main" }, h("slot", { key: 'be71578ddc8566d81734e0e036416767b0c42899' }))))));
+            } }, h("section", { key: 'd803f587fb3f7f481d22d2a3e3566bcd85c7f98b', class: "duet-main" }, h("slot", { key: 'fb1c82948b2d25d0437c41743abf0f9ed666b4d5' }))))));
     }
     get element() { return this; }
     static get style() { return DuetSectionLayoutStyle0; }

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

@@ -1,7 +1,7 @@
 /*!
  * Built with Duet Design System
  */
-import { D as DuetSelect$1, d as defineCustomElement$1 } from './p-05a0e048.js';
+import { D as DuetSelect$1, d as defineCustomElement$1 } from './p-145c94a8.js';
 
 const DuetSelect = DuetSelect$1;
 const defineCustomElement = defineCustomElement$1;

package/lib/dist-custom-elements/duet-shaped-image.js

@@ -32,9 +32,9 @@ const DuetShapedImage$1 = /*@__PURE__*/ proxyCustomElement(class DuetShapedImage
         const style = {
             "--rotation": `${this.rotation}deg`,
         };
-        return (h(Host, { key: 'cb4154853051eec78a10658344407c1653d737b3', class: { "duet-theme-turva": this.theme === "turva", "duet-m-0": this.margin === "none" } }, h("span", { key: '5cab0035d46b9e020cf7e4a18105a999646ad437', class: {
+        return (h(Host, { key: '555cbcb9c76cbda51c3c4cede13d764de7334c4e', class: { "duet-theme-turva": this.theme === "turva", "duet-m-0": this.margin === "none" } }, h("span", { key: '11704c842ec39f85048625cc78eb3dac55c18508', class: {
                 "shaped-image": true,
-            }, role: "img", "aria-label": this.accessibleLabel, style: style }, h("span", { key: '8c2d2bb60ac9042377402dea4453e4ec17885aac', class: "shaped-image-mask", role: "presentation" }, h("span", { key: '765b32769035c6746c0412be9fe3b70bf8c75039', class: "shaped-image-img", role: "presentation", style: { backgroundImage: `url("${this.src}")` } })))));
+            }, role: "img", "aria-label": this.accessibleLabel, style: style }, h("span", { key: 'f4ebb6576b8d69bc929ccae1662a87bc7c2481c7', class: "shaped-image-mask", role: "presentation" }, h("span", { key: 'd7d83206a5d52dd0ec81ea25256ace0b0f68df6c', class: "shaped-image-img", role: "presentation", style: { backgroundImage: `url("${this.src}")` } })))));
     }
     static get style() { return DuetShapedImageStyle0; }
 }, [1, "duet-shaped-image", {

package/lib/dist-custom-elements/duet-show-more.js

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

package/lib/dist-custom-elements/duet-slideout-lang.js

@@ -4,7 +4,7 @@
 import { p as proxyCustomElement, H, h, d as Host } from './p-f66602b0.js';
 import { i as inheritGlobalTheme } from './p-aaa7a7bd.js';
 import { a as getLanguage, c as connectLanguageChangeObserver, d as disconnectLanguageChangeObserver, g as getLocaleString } from './p-35375593.js';
-import { d as defineCustomElement$2 } from './p-b5b250a2.js';
+import { d as defineCustomElement$2 } from './p-8342a3e5.js';
 
 const duetSlideoutLangCss = "*,*::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}.duet-slideout-lang{display:flex;gap:20px;align-items:center;justify-content:flex-start;width:min-content;white-space:nowrap}::slotted(*){position:relative}::slotted(:not(:first-child)){padding-right:0;padding-left:0.5rem}::slotted(:not(:last-child))::after{position:absolute;top:25%;right:-16px;width:2px;height:50%;content:\"\";background:rgb(8, 42, 77)}.duet-theme-turva ::slotted(:not(:last-child))::after{background:rgb(23, 28, 58)}";
 const DuetSlideoutLangStyle0 = duetSlideoutLangCss;
@@ -43,7 +43,7 @@ const DuetSlideoutLang$1 = /*@__PURE__*/ proxyCustomElement(class DuetSlideoutLa
      */
     render() {
         const langTranslation = getLocaleString(this.chooseLangObject);
-        return (h(Host, { key: 'a3f0902bcc3942cfdd9bd39d753bfcfeeebf8bd4' }, h("div", { key: 'e4b2d5245b065602e7b74bab03d2ad9a6390d5ab', class: "duet-slideout-lang", role: "group", "aria-label": langTranslation }, h("duet-icon", { key: '10f383d1179787ca4dda410b10ac2785bcbbcc36', name: "navigation-language", margin: "none", color: "secondary" }), h("slot", { key: '3a3f899dd72eb996f48ac588474810a95fa6fc19' }))));
+        return (h(Host, { key: 'd163f56230650efc540cf21892239905271a775e' }, h("div", { key: '7b1d95d36da23db34a90055407a7f307ab0d4ffa', class: "duet-slideout-lang", role: "group", "aria-label": langTranslation }, h("duet-icon", { key: '07ed0679705221e14ba5e20d0db83a5b3073a7cf', name: "navigation-language", margin: "none", color: "secondary" }), h("slot", { key: 'e847d0a2bf84e7099988d6bc9f6e59dfa0ba99d7' }))));
     }
     get element() { return this; }
     static get style() { return DuetSlideoutLangStyle0; }

package/lib/dist-custom-elements/duet-slideout-link.js

@@ -3,7 +3,7 @@
  */
 import { p as proxyCustomElement, H, h, d as Host } from './p-f66602b0.js';
 import { i as inheritGlobalTheme } from './p-aaa7a7bd.js';
-import { d as defineCustomElement$2 } from './p-b5b250a2.js';
+import { d as defineCustomElement$2 } from './p-8342a3e5.js';
 
 const duetSlideoutLinkCss = "*,*::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;width:100%;height:100%}.duet-slideout-link{position:relative;display:flex;gap:20px;align-items:center;justify-content:flex-start;width:100%;height:100%;padding:8px 0;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:inherit;font-weight:inherit;line-height:1.25;color:inherit;text-align:left;text-decoration:none}.duet-slideout-link:focus{outline:0;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.duet-theme-turva .duet-slideout-link:focus,.duet-slideout-link:focus.duet-theme-turva{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-slideout-link.duet-theme-turva{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"}.duet-slideout-link.active span{position:relative}.duet-slideout-link.active span::after{position:absolute;top:auto;bottom:0;left:0;display:block;width:100%;height:var(--active-height, 2px);content:\"\";background:rgb(0, 119, 179);transform:var(--active-translate-y, translateY(2px))}.duet-slideout-link.active.duet-theme-turva span::after{background:rgb(198, 12, 48)}.duet-slideout-link.small{font-size:1rem;font-weight:600}.duet-slideout-link.small span::after{--active-height:1px;--active-translate-y:1px}.duet-slideout-link.medium{font-size:1.25rem;font-weight:600}.duet-slideout-link.large{font-size:1.5rem;font-weight:800}.duet-slideout-link .label{display:flex;gap:0.5rem;align-items:center;justify-content:space-between;width:100%}slot[name=description]::slotted(*){display:block;padding:8px 0 0;font-size:1rem;font-size:1.25;font-weight:400;color:rgb(98, 121, 138)}.duet-theme-turva slot[name=description]::slotted(*){color:rgb(113, 118, 132)}";
 const DuetSlideoutLinkStyle0 = duetSlideoutLinkCss;
@@ -34,12 +34,12 @@ const DuetSlideoutLink$1 = /*@__PURE__*/ proxyCustomElement(class DuetSlideoutLi
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: '756d30871c5f34ca3520a5bdecf5269c6a0b4afb' }, h("a", { key: '16dfc8d2bcae2379ab25ce353eda255e79d6ad6b', class: {
+        return (h(Host, { key: 'dbcb8bf6b8c65743fb716cbdda625cf4ea5162f8' }, h("a", { key: '542c9910bad183af64eff3b965ef1cec19b4ac7b', class: {
                 "duet-slideout-link": true,
                 "duet-theme-turva": this.theme === "turva",
                 active: this.active,
                 [this.size]: true,
-            }, href: this.href, "aria-current": this.active ? "true" : "false", lang: this.targetLanguage, hreflang: this.targetLanguage, "aria-label": this.accessibleLabel }, this.icon && (h("duet-icon", { key: '6551aa92fee9498b1fc2b4ebb18a89ff1c72e607', name: this.icon, color: "secondary", size: this.menuItem ? "x-small" : "medium", margin: "none" })), h("div", { key: 'f841f0d234ffca0d1dbaaae18e9de9f1de02de55', class: "label" }, h("span", { key: '452f28fecf67c0da43ea807dd572d1db83e10ae6' }, h("slot", { key: '896258d4f5fbcc5efa21d49cd867e0578302dbef' }), h("slot", { key: '6de4aa964201a5ffe68d7f894a499289db302527', name: "description" })), this.caret && (h("duet-icon", { key: '3b7c9337d8d76eb9bcc71fe7277e84599692bce4', name: "action-arrow-right", color: "secondary", size: "x-small", margin: "none" }))))));
+            }, href: this.href, "aria-current": this.active ? "true" : "false", lang: this.targetLanguage, hreflang: this.targetLanguage, "aria-label": this.accessibleLabel }, this.icon && (h("duet-icon", { key: 'c192e191c1323e742022c48651a75c16017b4837', name: this.icon, color: "secondary", size: this.menuItem ? "x-small" : "medium", margin: "none" })), h("div", { key: 'b0e214e358e524f13a884c78e1d78118b171e3ed', class: "label" }, h("span", { key: 'af8697663031dc729bc98cf7c15cd2d58a03f861' }, h("slot", { key: '84b1b365ac8fabcbf3c6451a8aa51caa18010aa9' }), h("slot", { key: '82b78e911b41cfd441fb9eab798093f6b726c993', name: "description" })), this.caret && (h("duet-icon", { key: 'ee835e2bd7427531239041e03b19ed4335b8ad74', name: "action-arrow-right", color: "secondary", size: "x-small", margin: "none" }))))));
     }
     get element() { return this; }
     static get style() { return DuetSlideoutLinkStyle0; }

package/lib/dist-custom-elements/duet-slideout-panel-dropdown.js

@@ -3,7 +3,7 @@
  */
 import { p as proxyCustomElement, H, h, d as Host } from './p-f66602b0.js';
 import { i as inheritGlobalTheme } from './p-aaa7a7bd.js';
-import { d as defineCustomElement$2 } from './p-b5b250a2.js';
+import { d as defineCustomElement$2 } from './p-8342a3e5.js';
 
 const duetSlideoutPanelDropdownCss = "*,*::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;width:100%;height:100%}:host slot:not([name=label])::slotted(*){position:relative;top:-0.5rem;opacity:0;transition:top 0.3s ease-in, opacity 0.3s ease-in}:host([open]) slot:not([name=label])::slotted(*){top:0;opacity:1}.duet-slideout-panel-dropdown{position:relative;width:100%;height:100%}.duet-slideout-panel-dropdown button{position:relative;display:flex;gap:20px;align-items:center;justify-content:flex-start;width:100%;height:100%;padding:8px 0;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:1.25rem;font-weight:800;line-height:1.25;color:rgb(8, 42, 77);text-align:center;text-decoration:none;cursor:pointer}.duet-slideout-panel-dropdown button .label{position:relative;display:flex;gap:0.5rem;align-items:center;justify-content:center}.duet-slideout-panel-dropdown button:focus{outline:0;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.duet-slideout-panel-dropdown button.active .label::after{position:absolute;top:auto;bottom:0;left:0;display:block;width:calc(100% - 18px);height:1px;content:\"\";background:rgb(0, 119, 179);transform:translateY(1px)}.duet-slideout-panel-dropdown .items{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;max-height:1000px;padding:4px 20px 8px 44px;overflow-y:auto;visibility:visible;transition:max-height 0.3s ease-in, padding-bottom 0.3s ease-in;-ms-overflow-style:none;scrollbar-width:none}.duet-slideout-panel-dropdown .items::-webkit-scrollbar{display:none}.duet-slideout-panel-dropdown .items.hidden{max-height:0;padding:0;overflow:hidden;visibility:hidden;transition:max-height 0.3s ease-out, padding-bottom 0.3s ease-out}.duet-slideout-panel-dropdown.duet-theme-turva button{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(23, 28, 58)}.duet-slideout-panel-dropdown.duet-theme-turva button:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-slideout-panel-dropdown.duet-theme-turva button.active .label::after{background:rgb(198, 12, 48)}slot{--active-height:1px;--active-translate-y:translateY(1px);font-size:1rem;font-weight:400;color:rgb(8, 42, 77)}.duet-theme-turva slot{color:rgb(23, 28, 58)}slot[name=label]{font-size:1rem;font-weight:600}";
 const DuetSlideoutPanelDropdownStyle0 = duetSlideoutPanelDropdownCss;
@@ -48,16 +48,16 @@ const DuetSlideoutPanelDropdown$1 = /*@__PURE__*/ proxyCustomElement(class DuetS
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: '79b5b5d923940bc3b0ab0515ccab7d498b327d5e' }, h("div", { key: 'b66ac749e1950d6c70c1c465479604cd91c03cfd', class: {
+        return (h(Host, { key: 'f7a1b3521e799c7792945551a66c1c295dd5ffdc' }, h("div", { key: 'd63da6a1f3650e633c97795042a7b34b8ad48302', class: {
                 "duet-slideout-panel-dropdown": true,
                 "duet-theme-turva": this.theme === "turva",
                 active: this.open,
-            } }, h("button", { key: '7155b74267a0786267237b0170e30a4c20d8d180', ref: element => (this.button = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", "aria-current": this.active ? "true" : "false", id: "button", type: "button", class: {
+            } }, h("button", { key: 'ed40e8b4d2a431e4f578ea26583a70b8977d951c', ref: element => (this.button = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", "aria-current": this.active ? "true" : "false", id: "button", type: "button", class: {
                 active: this.active,
-            }, onClick: this.onClick }, this.icon && h("duet-icon", { key: '014c5790e8eb52f02d10ecf398271b233b88f7b0', name: this.icon, size: "medium", margin: "none", color: "secondary" }), h("span", { key: 'be3875ea25d4f094220b3599aa15bf7e014e81bd', class: "label" }, h("slot", { key: '36b0112f4b2aa6ed192c19da3397beca24b8b29c', name: "label" }), h("duet-icon", { key: '2d4c1df9d41e97d1c7bb031252d31baa865a587c', class: "caret", name: "action-arrow-down-small", margin: "none", size: "xx-small", color: "secondary" }))), h("div", { key: 'a9729a27afa76ccee3c7d3b14e7d48dab1dcb7a3', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
+            }, onClick: this.onClick }, this.icon && h("duet-icon", { key: '44a4510103738db121e37e1d18f3a5f2484e7683', name: this.icon, size: "medium", margin: "none", color: "secondary" }), h("span", { key: 'b2ce145800f498a7382885190458bb49205b7ada', class: "label" }, h("slot", { key: '6ce00dfcd2d2ef3ac62143b9150b80f1ecc9a69d', name: "label" }), h("duet-icon", { key: 'e6890351789e07002b0b9fc85d79baf6862bd239', class: "caret", name: "action-arrow-down-small", margin: "none", size: "xx-small", color: "secondary" }))), h("div", { key: '81a201018140f6519e9ed18baec3855790ef4cb4', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
                 items: true,
                 hidden: !this.open,
-            } }, h("slot", { key: '63761e3a8bbea310fbc531dd63eae808be5cf3e4' })))));
+            } }, h("slot", { key: '473c54c7f46f6cb77f5656ff8c7d60106836aa73' })))));
     }
     get element() { return this; }
     static get style() { return DuetSlideoutPanelDropdownStyle0; }