npm - @duetds/components - Versions diffs - 8.3.0 → 8.3.1 - Mend

@duetds/components 8.3.0 → 8.3.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (615) hide show

package/hydrate/index.js CHANGED Viewed

@@ -7574,11 +7574,6 @@ const inheritGlobalTheme = (component) => {
 const duetHeadingLevels = ["h1", "h2", "h3", "h4", "h5", "h6"];
 const duetBlock = "div";
-const hasSlot = (element, slotName) => {
-    return Array.from(element.children).filter(el => el.matches(`[slot='${slotName}']`)).length > 0
-        ;
-};
 function chr4() {
     return Math.random().toString(16).slice(-4);
 }
@@ -8681,17 +8676,47 @@ const DuetPicture = ({ img, sources }) => {
         hAsync("img", Object.assign({}, img))));
 };
-const slotElementCheck = (evt, component, requiredTagName) => {
-    var _a;
-    const slot = evt.target;
-    const slotDescription = slot.name ? `slot ${slot.name}` : "default slot";
-    const slotElement = slot.assignedElements()[0];
-    const slotTagName = slotElement === null || slotElement === void 0 ? void 0 : slotElement.tagName.toLowerCase();
-    const componentTagName = (_a = component.element) === null || _a === void 0 ? void 0 : _a.tagName.toLowerCase();
-    if (slotTagName && slotTagName !== requiredTagName) {
-        console.warn(`Duet warning:
-      Only <${requiredTagName}> should be used in <${componentTagName}> ${slotDescription}.
-      Found: <${slotTagName}>`);
+const getElementsFromNamedSlot = (element, slotName) => {
+    const childElements = Array.from(element.children );
+    return childElements.filter(el => el.matches(`[slot='${slotName}']`));
+};
+const hasSlot = (element, slotName) => {
+    return getElementsFromNamedSlot(element, slotName).length > 0;
+};
+/**
+ * Check if the slotted element matches the given selector.
+ * If not, log a warning, or log a error and remove the element.
+ * This function only works with named slots.
+ *
+ * @param hostElement Host element
+ * @param slotName Name of the slot to check.
+ * @param selector Css selector the slotted element should match
+ * @param maxChildren Maximum number of children allowed in the slot. For no limit use 0. Default is 0.
+ * @param remove If true, remove the elements that don't match. Default is false.
+ */
+const checkNamedSlotElement = (hostElement, slotName, selector, maxChildren = 0, remove = false) => {
+    const warnOrError = remove ? "error" : "warn";
+    const errors = [];
+    const slottedElements = getElementsFromNamedSlot(hostElement, slotName);
+    const nonRemovedElements = slottedElements.filter(el => {
+        if (el.matches(selector)) {
+            return true;
+        }
+        errors.push(`Only elements matcing selector "${selector}" may be used in slot ${slotName}, found:\n${el.outerHTML}`);
+        if (remove) {
+            el.remove();
+            return false;
+        }
+        return true;
+    });
+    if (maxChildren && nonRemovedElements.length > maxChildren) {
+        errors.push(`Only ${maxChildren} element${maxChildren > 1 ? "s" : ""} may be used in slot ${slotName}, found ${slottedElements.length}.`);
+        if (remove) {
+            nonRemovedElements.slice(maxChildren).forEach(el => el.remove());
+        }
+    }
+    if (errors.length > 0) {
+        console[warnOrError](`Duet ${warnOrError} in ${hostElement.tagName.toLowerCase()}:\n${errors.join("\n")}${remove ? `\nElement${errors.length > 1 ? "s" : ""} removed.` : ""}`);
     }
 };
@@ -8722,9 +8747,10 @@ class DuetBanner {
      */
     componentWillLoad() {
         inheritGlobalTheme(this);
-        this.hasHeadingSlot = !!this.element.querySelector('[slot="heading"]');
-        this.hasDescriptionSlot = !!this.element.querySelector('[slot="description"]');
-        this.hasActionSlot = !!this.element.querySelector('[slot="action"]');
+        this.hasHeadingSlot = hasSlot(this.element, "heading");
+        this.hasDescriptionSlot = hasSlot(this.element, "description");
+        this.hasActionSlot = hasSlot(this.element, "action");
+        checkNamedSlotElement(this.element, "heading", "span");
     }
     /**
      * render() function
@@ -8745,7 +8771,7 @@ class DuetBanner {
                 "duet-banner": true,
                 "duet-theme-turva": this.theme === "turva",
                 [this.size]: true,
-            }, style: bannerStyles }, hAsync("div", { class: "visual" }, hAsync("div", { class: "image-container" }, this.image && hAsync(DuetPicture, Object.assign({}, pictureSource))), this.icon && (hAsync("duet-icon", { theme: this.theme, class: "icon", name: this.icon, shape: "brand", size: "xx-large", color: this.iconColor, background: this.iconBackgroundColor, "background-rotation": "7", "background-opacity": "0.85", margin: "none" }))), hAsync("div", { class: "content" }, this.hasHeadingSlot && (hAsync("div", { class: "heading" }, hAsync("duet-heading", { theme: this.theme, level: this.headingLevel, "visual-level": "h2", margin: "none", color: this.textColor }, hAsync("span", null, hAsync("slot", { name: "heading", onSlotchange: ev => slotElementCheck(ev, this, "span") }))))), this.hasDescriptionSlot && (hAsync("div", { class: "description", style: { color } }, hAsync("slot", { name: "description" }))), this.hasActionSlot && (hAsync("div", { class: "action" }, hAsync("slot", { name: "action" })))))));
+            }, style: bannerStyles }, hAsync("div", { class: "visual" }, hAsync("div", { class: "image-container" }, this.image && hAsync(DuetPicture, Object.assign({}, pictureSource))), this.icon && (hAsync("duet-icon", { theme: this.theme, class: "icon", name: this.icon, shape: "brand", size: "xx-large", color: this.iconColor, background: this.iconBackgroundColor, "background-rotation": "7", "background-opacity": "0.85", margin: "none" }))), hAsync("div", { class: "content" }, this.hasHeadingSlot && (hAsync("div", { class: "heading" }, hAsync("duet-heading", { theme: this.theme, level: this.headingLevel, "visual-level": "h2", margin: "none", color: this.textColor }, hAsync("span", null, hAsync("slot", { name: "heading" }))))), this.hasDescriptionSlot && (hAsync("div", { class: "description", style: { color } }, hAsync("slot", { name: "description" }))), this.hasActionSlot && (hAsync("div", { class: "action" }, hAsync("slot", { name: "action" })))))));
     }
     get element() { return getElement(this); }
     static get style() { return duetBannerCss; }
@@ -8913,7 +8939,7 @@ const DuetStringsLoadingDefaults = {
     en: "Loading…",
 };
-const duetButtonCss = "/*!@*,\n*::after,\n*::before*/*.sc-duet-button,*.sc-duet-button::after,*.sc-duet-button::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@:host*/.sc-duet-button-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-right:8px !important;margin-bottom:12px !important;position:relative;z-index:1;display:inline-flex;width:auto;max-width:100%;font-size:0;vertical-align:bottom;-webkit-tap-highlight-color:transparent}/*!@:host:last-child, :host:last-of-type*/.sc-duet-button-h:last-child,.sc-duet-button-h:last-of-type{margin-right:0 !important}@media (max-width: 35.9375em){/*!@:host*/.sc-duet-button-h{width:100%}}/*!@:host(.square)*/.square.sc-duet-button-h{margin-right:12px !important}/*!@:host(.square):last-child, :host(.square):last-of-type*/.square.sc-duet-button-h:last-child,.square.sc-duet-button-h:last-of-type{margin-right:0 !important}/*!@:host(.input-button)*/.input-button.sc-duet-button-h{z-index:250}/*!@:host(.duet-small),\n:host(.duet-x-small)*/.duet-small.sc-duet-button-h,.duet-x-small.sc-duet-button-h{margin-right:4px !important;margin-bottom:8px !important}/*!@:host(.duet-small):last-child, :host(.duet-small):last-of-type,\n:host(.duet-x-small):last-child,\n:host(.duet-x-small):last-of-type*/.duet-small.sc-duet-button-h:last-child,.duet-small.sc-duet-button-h:last-of-type,.duet-x-small.sc-duet-button-h:last-child,.duet-x-small.sc-duet-button-h:last-of-type{margin-right:0 !important}@media (max-width: 35.9375em){/*!@:host(.duet-small),\n  :host(.duet-x-small)*/.duet-small.sc-duet-button-h,.duet-x-small.sc-duet-button-h{width:auto}}/*!@:host(.duet-x-small)*/.duet-x-small.sc-duet-button-h{margin-right:2px !important}/*!@:host(.duet-x-small):last-child, :host(.duet-x-small):last-of-type*/.duet-x-small.sc-duet-button-h:last-child,.duet-x-small.sc-duet-button-h:last-of-type{margin-right:0 !important}/*!@:host(.square.duet-small),\n:host(.square.duet-x-small)*/.square.duet-small.sc-duet-button-h,.square.duet-x-small.sc-duet-button-h{margin-right:8px !important}/*!@:host(.square.duet-small):last-child, :host(.square.duet-small):last-of-type,\n:host(.square.duet-x-small):last-child,\n:host(.square.duet-x-small):last-of-type*/.square.duet-small.sc-duet-button-h:last-child,.square.duet-small.sc-duet-button-h:last-of-type,.square.duet-x-small.sc-duet-button-h:last-child,.square.duet-x-small.sc-duet-button-h:last-of-type{margin-right:0 !important}/*!@:host(.duet-expand)*/.duet-expand.sc-duet-button-h{width:100% !important}/*!@:host(.duet-m-0)*/.duet-m-0.sc-duet-button-h{margin:0 !important}/*!@:host(.duet-fixed)*/.duet-fixed.sc-duet-button-h{width:auto !important}/*!@:host(:last-child)*/.sc-duet-button-h:last-child{margin-right:0 !important}/*!@.duet-button-container*/.duet-button-container.sc-duet-button{position:relative;display:block;width:100%}/*!@.duet-button*/.duet-button.sc-duet-button{-webkit-user-select:none;user-select:none;position:relative;z-index:100;display:flex;align-items:center;width:100%;min-width:8rem;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;line-height:1.1;color:rgb(0, 119, 179) !important;text-align:center;text-decoration:none;cursor:pointer;background:transparent;border-style:solid;border-width:1px;transition:background-color 300ms ease, color 300ms ease, border 300ms ease, outline 300ms ease, padding 300ms ease, box-shadow 300ms ease}/*!@.duet-button.duet-p-0*/.duet-button.duet-p-0.sc-duet-button{padding:0 !important}/*!@.duet-button.duet-m-0*/.duet-button.duet-m-0.sc-duet-button{margin:0 !important}/*!@.duet-button:focus*/.duet-button.sc-duet-button:focus{outline:0;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}/*!@.duet-theme-turva .duet-button:focus, .duet-button:focus.duet-theme-turva*/.duet-theme-turva.sc-duet-button .duet-button.sc-duet-button:focus,.duet-button.sc-duet-button:focus.duet-theme-turva{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}/*!@.duet-button.duet-button-size-medium*/.duet-button.duet-button-size-medium.sc-duet-button{height:50px;padding-right:30px;padding-left:30px;font-size:1rem;border-radius:25px}/*!@.duet-button.duet-button-size-medium.square*/.duet-button.duet-button-size-medium.square.sc-duet-button{border-radius:12.5px}/*!@.duet-button.duet-button-size-medium.icon-left*/.duet-button.duet-button-size-medium.icon-left.sc-duet-button{padding-left:24px}/*!@.duet-button.duet-button-size-medium.icon-right*/.duet-button.duet-button-size-medium.icon-right.sc-duet-button{padding-right:24px}/*!@.duet-button.duet-button-size-small*/.duet-button.duet-button-size-small.sc-duet-button{height:40px;padding-right:20px;padding-left:20px;font-size:0.875rem;border-radius:20px}/*!@.duet-button.duet-button-size-small.square*/.duet-button.duet-button-size-small.square.sc-duet-button{border-radius:10px}/*!@.duet-button.duet-button-size-small.icon-left*/.duet-button.duet-button-size-small.icon-left.sc-duet-button{padding-left:18px}/*!@.duet-button.duet-button-size-small.icon-right*/.duet-button.duet-button-size-small.icon-right.sc-duet-button{padding-right:18px}/*!@.duet-button.duet-button-size-x-small*/.duet-button.duet-button-size-x-small.sc-duet-button{height:32px;padding-right:12px;padding-left:12px;font-size:0.75rem;border-radius:8px}/*!@.duet-button.duet-button-size-x-small.icon-left*/.duet-button.duet-button-size-x-small.icon-left.sc-duet-button{padding-left:10px}/*!@.duet-button.duet-button-size-x-small.icon-right*/.duet-button.duet-button-size-x-small.icon-right.sc-duet-button{padding-right:10px}/*!@.duet-button.plain.duet-p-0*/.duet-button.plain.duet-p-0.sc-duet-button{height:auto}/*!@.duet-button:not(.input-button-primary, .input-button-secondary, .input-button-embedded)*/.duet-button.sc-duet-button:not(.input-button-primary,.input-button-secondary.sc-duet-button,.input-button-embedded).sc-duet-button{font-variant-numeric:tabular-nums}/*!@.duet-button.duet-button-text-center*/.duet-button.duet-button-text-center.sc-duet-button{text-align:center !important}/*!@.duet-button.duet-button-is-small:not(.duet-button-icon-only)*/.duet-button.duet-button-is-small.sc-duet-button:not(.duet-button-icon-only){min-width:48px}/*!@.duet-button.duet-button-is-small:not(.duet-button-icon-only).plain*/.duet-button.duet-button-is-small.sc-duet-button:not(.duet-button-icon-only).plain{padding-right:0 !important;padding-left:0 !important}/*!@.duet-button.duet-button-is-small:not(.duet-button-icon-only).duet-p-0*/.duet-button.duet-button-is-small.sc-duet-button:not(.duet-button-icon-only).duet-p-0{padding:0 !important}/*!@.duet-theme-turva .duet-button*/.duet-theme-turva.sc-duet-button .duet-button.sc-duet-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(198, 12, 48) !important}/*!@.duet-button .duet-button-contents*/.duet-button.sc-duet-button .duet-button-contents.sc-duet-button{position:relative;display:flex;gap:10px;align-items:center;margin:0 auto;pointer-events:none}/*!@.duet-button .duet-button-contents.icon-right*/.duet-button.sc-duet-button .duet-button-contents.icon-right.sc-duet-button{flex-direction:row-reverse}/*!@.duet-button .duet-button-contents .duet-button-contents-slot*/.duet-button.sc-duet-button .duet-button-contents.sc-duet-button .duet-button-contents-slot.sc-duet-button{position:relative;top:0}/*!@.duet-button.duet-no-wrap*/.duet-button.duet-no-wrap.sc-duet-button{white-space:nowrap}/*!@.duet-button svg*/.duet-button.sc-duet-button svg.sc-duet-button{width:100%;min-width:100%;fill:currentColor}/*!@.duet-button .duet-button-icon*/.duet-button.sc-duet-button .duet-button-icon.sc-duet-button{display:flex;align-items:center}/*!@.duet-button .duet-button-icon duet-icon*/.duet-button.sc-duet-button .duet-button-icon.sc-duet-button duet-icon.sc-duet-button{width:16px;height:16px}/*!@.duet-button .duet-button-icon.large duet-icon*/.duet-button.sc-duet-button .duet-button-icon.large.sc-duet-button duet-icon.sc-duet-button{width:20px;height:20px}/*!@.duet-button .duet-button-icon.medium-small duet-icon*/.duet-button.sc-duet-button .duet-button-icon.medium-small.sc-duet-button duet-icon.sc-duet-button{width:10px;height:10px}/*!@.duet-button .duet-button-icon.small duet-icon*/.duet-button.sc-duet-button .duet-button-icon.small.sc-duet-button duet-icon.sc-duet-button{width:7px;height:7px}/*!@.duet-button:active:not([disabled])*/.duet-button.sc-duet-button:active:not([disabled]){opacity:0.75;transition:none}/*!@.duet-button.default*/.duet-button.default.sc-duet-button{border-color:rgb(207, 210, 212)}/*!@.duet-theme-turva .duet-button.default*/.duet-theme-turva.sc-duet-button .duet-button.default.sc-duet-button{color:rgb(198, 12, 48) !important;border-color:rgb(228, 228, 230)}/*!@.duet-button.default:hover*/.duet-button.default.sc-duet-button:hover{border-color:rgb(0, 119, 179);outline:2px solid rgb(0, 119, 179);outline-offset:-2px}/*!@.duet-theme-turva .duet-button.default:hover*/.duet-theme-turva.sc-duet-button .duet-button.default.sc-duet-button:hover{border-color:rgb(198, 12, 48);outline-color:rgb(198, 12, 48)}/*!@.duet-button.default.duet-button-negative*/.duet-button.default.duet-button-negative.sc-duet-button{background-color:rgb(255, 255, 255)}/*!@.duet-theme-turva .duet-button.default.duet-button-negative*/.duet-theme-turva.sc-duet-button .duet-button.default.duet-button-negative.sc-duet-button{background-color:rgb(228, 228, 230) !important}/*!@.duet-button.default.duet-button-negative:hover*/.duet-button.default.duet-button-negative.sc-duet-button:hover{color:rgb(0, 119, 179) !important;border-color:rgb(0, 119, 179)}/*!@.duet-theme-turva .duet-button.default.duet-button-negative:hover*/.duet-theme-turva.sc-duet-button .duet-button.default.duet-button-negative.sc-duet-button:hover{color:rgb(198, 12, 48) !important;border-color:rgb(198, 12, 48)}/*!@.duet-button.primary, .duet-button.input-button-primary*/.duet-button.primary.sc-duet-button,.duet-button.input-button-primary.sc-duet-button{color:rgb(255, 255, 255) !important;background:rgb(0, 119, 179);border-color:rgb(0, 119, 179)}/*!@.duet-theme-turva .duet-button.primary, .duet-theme-turva .duet-button.input-button-primary*/.duet-theme-turva.sc-duet-button .duet-button.primary.sc-duet-button,.duet-theme-turva.sc-duet-button .duet-button.input-button-primary.sc-duet-button{color:rgb(255, 255, 255) !important;background:rgb(198, 12, 48);border-color:rgb(198, 12, 48)}/*!@.duet-button.primary:hover, .duet-button.input-button-primary:hover*/.duet-button.primary.sc-duet-button:hover,.duet-button.input-button-primary.sc-duet-button:hover{background:#005f8f;border-color:#005f8f;box-shadow:0 4px 20px 0 rgba(34, 34, 34, 0.1)}/*!@.duet-theme-turva .duet-button.primary:hover, .duet-theme-turva .duet-button.input-button-primary:hover*/.duet-theme-turva.sc-duet-button .duet-button.primary.sc-duet-button:hover,.duet-theme-turva.sc-duet-button .duet-button.input-button-primary.sc-duet-button:hover{background:rgb(148, 9, 37);border-color:rgb(148, 9, 37)}/*!@.duet-button.primary:focus, .duet-button.input-button-primary:focus*/.duet-button.primary.sc-duet-button:focus,.duet-button.input-button-primary.sc-duet-button:focus{outline:0;box-shadow:0 0 0 1px #fff, 0 0 0 4px rgba(0, 119, 179, 0.75)}/*!@.duet-theme-turva .duet-button.primary:focus, .duet-theme-turva .duet-button.input-button-primary:focus*/.duet-theme-turva.sc-duet-button .duet-button.primary.sc-duet-button:focus,.duet-theme-turva.sc-duet-button .duet-button.input-button-primary.sc-duet-button:focus{box-shadow:0 0 0 1px #fff, 0 0 0 4px rgba(23, 28, 58, 0.75)}/*!@.duet-button.secondary, .duet-button.input-button-secondary, .duet-button.input-button-embedded*/.duet-button.secondary.sc-duet-button,.duet-button.input-button-secondary.sc-duet-button,.duet-button.input-button-embedded.sc-duet-button{color:rgb(0, 41, 77) !important;background:transparent;border-color:rgb(0, 41, 77)}/*!@.duet-theme-turva .duet-button.secondary, .duet-theme-turva .duet-button.input-button-secondary, .duet-theme-turva .duet-button.input-button-embedded*/.duet-theme-turva.sc-duet-button .duet-button.secondary.sc-duet-button,.duet-theme-turva.sc-duet-button .duet-button.input-button-secondary.sc-duet-button,.duet-theme-turva.sc-duet-button .duet-button.input-button-embedded.sc-duet-button{color:rgb(23, 28, 58) !important;border-color:rgb(23, 28, 58)}/*!@.duet-button.secondary:hover, .duet-button.input-button-secondary:hover, .duet-button.input-button-embedded:hover*/.duet-button.secondary.sc-duet-button:hover,.duet-button.input-button-secondary.sc-duet-button:hover,.duet-button.input-button-embedded.sc-duet-button:hover{color:rgb(0, 119, 179) !important;border-color:rgb(0, 119, 179)}/*!@.duet-theme-turva .duet-button.secondary:hover, .duet-theme-turva .duet-button.input-button-secondary:hover, .duet-theme-turva .duet-button.input-button-embedded:hover*/.duet-theme-turva.sc-duet-button .duet-button.secondary.sc-duet-button:hover,.duet-theme-turva.sc-duet-button .duet-button.input-button-secondary.sc-duet-button:hover,.duet-theme-turva.sc-duet-button .duet-button.input-button-embedded.sc-duet-button:hover{color:rgb(198, 12, 48) !important;border-color:rgb(198, 12, 48)}/*!@.duet-button.secondary.duet-button-negative, .duet-button.input-button-secondary.duet-button-negative, .duet-button.input-button-embedded.duet-button-negative*/.duet-button.secondary.duet-button-negative.sc-duet-button,.duet-button.input-button-secondary.duet-button-negative.sc-duet-button,.duet-button.input-button-embedded.duet-button-negative.sc-duet-button{color:rgb(225, 227, 230) !important;border-color:rgb(255, 255, 255)}/*!@.duet-theme-turva .duet-button.secondary.duet-button-negative, .duet-theme-turva .duet-button.input-button-secondary.duet-button-negative, .duet-theme-turva .duet-button.input-button-embedded.duet-button-negative*/.duet-theme-turva.sc-duet-button .duet-button.secondary.duet-button-negative.sc-duet-button,.duet-theme-turva.sc-duet-button .duet-button.input-button-secondary.duet-button-negative.sc-duet-button,.duet-theme-turva.sc-duet-button .duet-button.input-button-embedded.duet-button-negative.sc-duet-button{color:rgb(228, 228, 230) !important}/*!@.duet-button.secondary.duet-button-negative:hover, .duet-button.input-button-secondary.duet-button-negative:hover, .duet-button.input-button-embedded.duet-button-negative:hover*/.duet-button.secondary.duet-button-negative.sc-duet-button:hover,.duet-button.input-button-secondary.duet-button-negative.sc-duet-button:hover,.duet-button.input-button-embedded.duet-button-negative.sc-duet-button:hover{color:rgb(0, 119, 179) !important;border-color:rgb(0, 119, 179)}/*!@.duet-theme-turva .duet-button.secondary.duet-button-negative:hover, .duet-theme-turva .duet-button.input-button-secondary.duet-button-negative:hover, .duet-theme-turva .duet-button.input-button-embedded.duet-button-negative:hover*/.duet-theme-turva.sc-duet-button .duet-button.secondary.duet-button-negative.sc-duet-button:hover,.duet-theme-turva.sc-duet-button .duet-button.input-button-secondary.duet-button-negative.sc-duet-button:hover,.duet-theme-turva.sc-duet-button .duet-button.input-button-embedded.duet-button-negative.sc-duet-button:hover{color:rgb(198, 12, 48) !important;border-color:rgb(198, 12, 48)}/*!@.duet-button.input-button-embedded*/.duet-button.input-button-embedded.sc-duet-button{width:40px;min-width:40px !important;min-height:40px !important;margin:4px !important;border-width:0 !important;border-radius:4px !important}/*!@.duet-button.input-button*/.duet-button.input-button.sc-duet-button{height:auto}/*!@.duet-button.negative*/.duet-button.negative.sc-duet-button{color:rgb(0, 41, 77) !important;background:rgb(255, 255, 255);border-color:rgb(255, 255, 255)}/*!@.duet-theme-turva .duet-button.negative*/.duet-theme-turva.sc-duet-button .duet-button.negative.sc-duet-button{color:rgb(23, 28, 58) !important}/*!@.duet-button.negative:hover*/.duet-button.negative.sc-duet-button:hover{color:rgb(255, 255, 255) !important;background:transparent;border-color:rgb(255, 255, 255)}/*!@.duet-button.negative:focus*/.duet-button.negative.sc-duet-button:focus{outline:0;box-shadow:0 0 0 1px #00294d, 0 0 0 4px rgba(255, 255, 255, 0.7)}/*!@.duet-theme-turva .duet-button.negative:focus*/.duet-theme-turva.sc-duet-button .duet-button.negative.sc-duet-button:focus{box-shadow:0 0 0 1px #0077b3, 0 0 0 4px rgba(255, 255, 255, 0.7)}/*!@.duet-button.destructive-primary*/.duet-button.destructive-primary.sc-duet-button{color:rgb(255, 255, 255) !important;background:rgb(222, 35, 98);border-color:rgb(222, 35, 98)}/*!@.duet-theme-turva .duet-button.destructive-primary*/.duet-theme-turva.sc-duet-button .duet-button.destructive-primary.sc-duet-button{color:rgb(255, 255, 255) !important;background:rgb(224, 42, 13);border-color:rgb(224, 42, 13)}/*!@.duet-button.destructive-primary:hover*/.duet-button.destructive-primary.sc-duet-button:hover{background:#b21c4e;border-color:#b21c4e;box-shadow:0 4px 20px 0 rgba(34, 34, 34, 0.1)}/*!@.duet-theme-turva .duet-button.destructive-primary:hover*/.duet-theme-turva.sc-duet-button .duet-button.destructive-primary.sc-duet-button:hover{background:#b3220a}/*!@.duet-button.destructive, .duet-button.destructive-secondary*/.duet-button.destructive.sc-duet-button,.duet-button.destructive-secondary.sc-duet-button{color:rgb(222, 35, 98) !important;background:rgb(255, 255, 255);border-color:rgb(222, 35, 98)}/*!@.duet-theme-turva .duet-button.destructive, .duet-theme-turva .duet-button.destructive-secondary*/.duet-theme-turva.sc-duet-button .duet-button.destructive.sc-duet-button,.duet-theme-turva.sc-duet-button .duet-button.destructive-secondary.sc-duet-button{color:rgb(224, 42, 13) !important;background:rgb(255, 255, 255);border-color:rgb(224, 42, 13)}/*!@.duet-button.destructive:hover, .duet-button.destructive-secondary:hover*/.duet-button.destructive.sc-duet-button:hover,.duet-button.destructive-secondary.sc-duet-button:hover{color:rgb(255, 255, 255) !important;background:#b21c4e;border-color:#b21c4e}/*!@.duet-theme-turva .duet-button.destructive:hover, .duet-theme-turva .duet-button.destructive-secondary:hover*/.duet-theme-turva.sc-duet-button .duet-button.destructive.sc-duet-button:hover,.duet-theme-turva.sc-duet-button .duet-button.destructive-secondary.sc-duet-button:hover{color:rgb(255, 255, 255) !important;background:#b3220a;border-color:#b3220a}/*!@.duet-button.plain*/.duet-button.plain.sc-duet-button{min-width:48px;padding-right:0 !important;padding-left:0 !important;line-height:1.5;text-align:left;background:transparent;border:0;border-color:transparent;border-radius:4px}/*!@.duet-theme-turva .duet-button.plain*/.duet-theme-turva.sc-duet-button .duet-button.plain.sc-duet-button{color:rgb(198, 12, 48) !important;background:transparent;border-color:transparent}/*!@.duet-button.plain.duet-p-0 .duet-button-contents*/.duet-button.plain.duet-p-0.sc-duet-button .duet-button-contents.sc-duet-button{height:auto}/*!@.duet-button.plain[disabled]*/.duet-button.plain[disabled].sc-duet-button{color:rgb(101, 119, 135) !important;cursor:not-allowed;background:transparent !important;border-color:transparent !important}/*!@.duet-theme-turva .duet-button.plain[disabled]*/.duet-theme-turva.sc-duet-button .duet-button.plain[disabled].sc-duet-button{color:transparent !important;cursor:not-allowed;background:transparent !important;border-color:rgb(228, 228, 230) !important}/*!@.duet-button.plain:hover*/.duet-button.plain.sc-duet-button:hover{color:rgb(0, 77, 128) !important;background:transparent !important}/*!@.duet-theme-turva .duet-button.plain:hover*/.duet-theme-turva.sc-duet-button .duet-button.plain.sc-duet-button:hover{color:rgb(148, 9, 37) !important}/*!@.duet-button.plain.duet-button-negative*/.duet-button.plain.duet-button-negative.sc-duet-button{color:rgb(255, 255, 255) !important}/*!@.duet-theme-turva .duet-button.plain.duet-button-negative*/.duet-theme-turva.sc-duet-button .duet-button.plain.duet-button-negative.sc-duet-button{color:rgb(228, 228, 230) !important}/*!@.duet-button.plain.duet-button-negative:hover*/.duet-button.plain.duet-button-negative.sc-duet-button:hover{color:rgb(0, 119, 179) !important}/*!@.duet-theme-turva .duet-button.plain.duet-button-negative:hover*/.duet-theme-turva.sc-duet-button .duet-button.plain.duet-button-negative.sc-duet-button:hover{color:rgb(198, 12, 48) !important}/*!@.duet-button.duet-button-icon-only*/.duet-button.duet-button-icon-only.sc-duet-button{min-width:48px;min-height:48px;padding:0 !important}/*!@.duet-button.duet-button-icon-only .duet-button-contents*/.duet-button.duet-button-icon-only.sc-duet-button .duet-button-contents.sc-duet-button{position:static}/*!@.duet-button.duet-button-icon-only .duet-button-icon.left.large,\n.duet-button.duet-button-icon-only .duet-button-icon.left.medium,\n.duet-button.duet-button-icon-only .duet-button-icon.left.small*/.duet-button.duet-button-icon-only.sc-duet-button .duet-button-icon.left.large.sc-duet-button,.duet-button.duet-button-icon-only.sc-duet-button .duet-button-icon.left.medium.sc-duet-button,.duet-button.duet-button-icon-only.sc-duet-button .duet-button-icon.left.small.sc-duet-button{position:absolute;top:50% !important;left:50% !important;padding:0;margin:0;transform:translateX(-50%) translateY(-50%)}/*!@.duet-button.duet-button.input-button-primary, .duet-button.duet-button.input-button-secondary, .duet-button.duet-button.input-button-embedded*/.duet-button.duet-button.input-button-primary.sc-duet-button,.duet-button.duet-button.input-button-secondary.sc-duet-button,.duet-button.duet-button.input-button-embedded.sc-duet-button{box-sizing:content-box;min-width:48px;min-height:48px;padding:0 !important;border-width:1px;border-top-left-radius:0;border-top-right-radius:4px;border-bottom-right-radius:4px;border-bottom-left-radius:0}/*!@.duet-button.duet-button.input-button-primary .duet-button-contents, .duet-button.duet-button.input-button-secondary .duet-button-contents, .duet-button.duet-button.input-button-embedded .duet-button-contents*/.duet-button.duet-button.input-button-primary.sc-duet-button .duet-button-contents.sc-duet-button,.duet-button.duet-button.input-button-secondary.sc-duet-button .duet-button-contents.sc-duet-button,.duet-button.duet-button.input-button-embedded.sc-duet-button .duet-button-contents.sc-duet-button{position:static}/*!@.duet-button.duet-button.input-button-primary .duet-button-icon.left.large,\n.duet-button.duet-button.input-button-primary .duet-button-icon.left.medium,\n.duet-button.duet-button.input-button-primary .duet-button-icon.left.small, .duet-button.duet-button.input-button-secondary .duet-button-icon.left.large,\n.duet-button.duet-button.input-button-secondary .duet-button-icon.left.medium,\n.duet-button.duet-button.input-button-secondary .duet-button-icon.left.small, .duet-button.duet-button.input-button-embedded .duet-button-icon.left.large,\n.duet-button.duet-button.input-button-embedded .duet-button-icon.left.medium,\n.duet-button.duet-button.input-button-embedded .duet-button-icon.left.small*/.duet-button.duet-button.input-button-primary.sc-duet-button .duet-button-icon.left.large.sc-duet-button,.duet-button.duet-button.input-button-primary.sc-duet-button .duet-button-icon.left.medium.sc-duet-button,.duet-button.duet-button.input-button-primary.sc-duet-button .duet-button-icon.left.small.sc-duet-button,.duet-button.duet-button.input-button-secondary.sc-duet-button .duet-button-icon.left.large.sc-duet-button,.duet-button.duet-button.input-button-secondary.sc-duet-button .duet-button-icon.left.medium.sc-duet-button,.duet-button.duet-button.input-button-secondary.sc-duet-button .duet-button-icon.left.small.sc-duet-button,.duet-button.duet-button.input-button-embedded.sc-duet-button .duet-button-icon.left.large.sc-duet-button,.duet-button.duet-button.input-button-embedded.sc-duet-button .duet-button-icon.left.medium.sc-duet-button,.duet-button.duet-button.input-button-embedded.sc-duet-button .duet-button-icon.left.small.sc-duet-button{position:absolute;top:50% !important;left:50% !important;padding:0;margin:0;transform:translateX(-50%) translateY(-50%)}/*!@.duet-button.duet-button.input-button-embedded*/.duet-button.duet-button.input-button-embedded.sc-duet-button{border-left-width:0}/*!@.duet-button.square*/.duet-button.square.sc-duet-button{width:52px;min-width:auto !important;padding:0 !important;font-size:1rem;border-color:rgb(207, 210, 212);border-width:1px}/*!@.duet-button.square.duet-button-size-small*/.duet-button.square.duet-button-size-small.sc-duet-button{width:42px;font-size:0.875rem}/*!@.duet-button.square.duet-button-size-x-small*/.duet-button.square.duet-button-size-x-small.sc-duet-button{width:34px;font-size:0.875rem}/*!@.duet-button.square.duet-button-negative*/.duet-button.square.duet-button-negative.sc-duet-button{color:rgb(255, 255, 255) !important;background:rgb(0, 119, 179);border-color:rgb(0, 119, 179)}/*!@.duet-theme-turva .duet-button.square.duet-button-negative*/.duet-theme-turva.sc-duet-button .duet-button.square.duet-button-negative.sc-duet-button{color:rgb(255, 255, 255) !important;background:rgb(198, 12, 48);border-color:rgb(198, 12, 48)}/*!@.duet-theme-turva .duet-button.square*/.duet-theme-turva.sc-duet-button .duet-button.square.sc-duet-button{border-color:rgb(228, 228, 230)}/*!@.duet-button.square:hover*/.duet-button.square.sc-duet-button:hover{border-color:rgb(0, 119, 179);outline:2px solid rgb(0, 119, 179);outline-offset:-2px}/*!@.duet-theme-turva .duet-button.square:hover*/.duet-theme-turva.sc-duet-button .duet-button.square.sc-duet-button:hover{border-color:rgb(198, 12, 48);outline-color:rgb(198, 12, 48)}/*!@.duet-button.square .duet-button-contents*/.duet-button.square.sc-duet-button .duet-button-contents.sc-duet-button{gap:0}/*!@.duet-button[disabled], .duet-button[disabled]:hover, .duet-button.duet-button-negative[disabled], .duet-button.duet-button-negative[disabled]:hover*/.duet-button[disabled].sc-duet-button,.duet-button[disabled].sc-duet-button:hover,.duet-button.duet-button-negative[disabled].sc-duet-button,.duet-button.duet-button-negative[disabled].sc-duet-button:hover{color:rgb(101, 119, 135) !important;cursor:not-allowed;background:rgb(225, 227, 230) !important;border-color:rgb(225, 227, 230) !important;box-shadow:none !important}/*!@.duet-theme-turva .duet-button[disabled], .duet-theme-turva .duet-button[disabled]:hover, .duet-theme-turva .duet-button.duet-button-negative [disabled], .duet-theme-turva .duet-button.duet-button-negative [disabled]:hover*/.duet-theme-turva.sc-duet-button .duet-button[disabled].sc-duet-button,.duet-theme-turva.sc-duet-button .duet-button[disabled].sc-duet-button:hover,.duet-theme-turva.sc-duet-button .duet-button.duet-button-negative.sc-duet-button [disabled].sc-duet-button,.duet-theme-turva.sc-duet-button .duet-button.duet-button-negative.sc-duet-button [disabled].sc-duet-button:hover{color:rgb(116, 116, 117) !important;cursor:not-allowed;background:rgb(228, 228, 230) !important;border-color:rgb(228, 228, 230) !important}/*!@.duet-button-is-loading.primary, .duet-button-is-loading.input-button-primary*/.duet-button-is-loading.primary.sc-duet-button,.duet-button-is-loading.input-button-primary.sc-duet-button{color:rgb(255, 255, 255)}/*!@.duet-button-is-loading.default*/.duet-button-is-loading.default.sc-duet-button{color:rgb(0, 119, 179)}/*!@.duet-button-is-loading.default.duet-theme-turva*/.duet-button-is-loading.default.duet-theme-turva.sc-duet-button{color:rgb(198, 12, 48)}/*!@.duet-button-is-loading .duet-button-contents*/.duet-button-is-loading.sc-duet-button .duet-button-contents.sc-duet-button{visibility:hidden;opacity:0}";
+const duetButtonCss = "/*!@*,\n*::after,\n*::before*/*.sc-duet-button,*.sc-duet-button::after,*.sc-duet-button::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@:host*/.sc-duet-button-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-right:8px !important;margin-bottom:12px !important;position:relative;z-index:1;display:inline-flex;width:auto;max-width:100%;font-size:0;vertical-align:bottom;-webkit-tap-highlight-color:transparent}/*!@:host:last-child, :host:last-of-type*/.sc-duet-button-h:last-child,.sc-duet-button-h:last-of-type{margin-right:0 !important}@media (max-width: 35.9375em){/*!@:host*/.sc-duet-button-h{width:100%}}/*!@:host(.square)*/.square.sc-duet-button-h{margin-right:12px !important}/*!@:host(.square):last-child, :host(.square):last-of-type*/.square.sc-duet-button-h:last-child,.square.sc-duet-button-h:last-of-type{margin-right:0 !important}/*!@:host(.input-button)*/.input-button.sc-duet-button-h{z-index:250}/*!@:host(.duet-small),\n:host(.duet-x-small)*/.duet-small.sc-duet-button-h,.duet-x-small.sc-duet-button-h{margin-right:4px !important;margin-bottom:8px !important}/*!@:host(.duet-small):last-child, :host(.duet-small):last-of-type,\n:host(.duet-x-small):last-child,\n:host(.duet-x-small):last-of-type*/.duet-small.sc-duet-button-h:last-child,.duet-small.sc-duet-button-h:last-of-type,.duet-x-small.sc-duet-button-h:last-child,.duet-x-small.sc-duet-button-h:last-of-type{margin-right:0 !important}@media (max-width: 35.9375em){/*!@:host(.duet-small),\n  :host(.duet-x-small)*/.duet-small.sc-duet-button-h,.duet-x-small.sc-duet-button-h{width:auto}}/*!@:host(.duet-x-small)*/.duet-x-small.sc-duet-button-h{margin-right:2px !important}/*!@:host(.duet-x-small):last-child, :host(.duet-x-small):last-of-type*/.duet-x-small.sc-duet-button-h:last-child,.duet-x-small.sc-duet-button-h:last-of-type{margin-right:0 !important}/*!@:host(.square.duet-small),\n:host(.square.duet-x-small)*/.square.duet-small.sc-duet-button-h,.square.duet-x-small.sc-duet-button-h{margin-right:8px !important}/*!@:host(.square.duet-small):last-child, :host(.square.duet-small):last-of-type,\n:host(.square.duet-x-small):last-child,\n:host(.square.duet-x-small):last-of-type*/.square.duet-small.sc-duet-button-h:last-child,.square.duet-small.sc-duet-button-h:last-of-type,.square.duet-x-small.sc-duet-button-h:last-child,.square.duet-x-small.sc-duet-button-h:last-of-type{margin-right:0 !important}/*!@:host(.duet-expand)*/.duet-expand.sc-duet-button-h{width:100% !important}/*!@:host(.duet-m-0)*/.duet-m-0.sc-duet-button-h{margin:0 !important}/*!@:host(.duet-fixed)*/.duet-fixed.sc-duet-button-h{width:auto !important}/*!@:host(:last-child)*/.sc-duet-button-h:last-child{margin-right:0 !important}/*!@.duet-button-container*/.duet-button-container.sc-duet-button{position:relative;display:block;width:100%}/*!@.duet-button*/.duet-button.sc-duet-button{-webkit-user-select:none;user-select:none;position:relative;z-index:100;display:flex;align-items:center;width:100%;min-width:8rem;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;line-height:1.1;color:rgb(0, 119, 179) !important;text-align:center;text-decoration:none;cursor:pointer;background:transparent;border-style:solid;border-width:1px;transition:background-color 300ms ease, color 300ms ease, border 300ms ease, outline 300ms ease, padding 300ms ease, box-shadow 300ms ease}/*!@.duet-button.duet-p-0*/.duet-button.duet-p-0.sc-duet-button{padding:0 !important}/*!@.duet-button.duet-m-0*/.duet-button.duet-m-0.sc-duet-button{margin:0 !important}/*!@.duet-button:focus*/.duet-button.sc-duet-button:focus{outline:0;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}/*!@.duet-theme-turva .duet-button:focus, .duet-button:focus.duet-theme-turva*/.duet-theme-turva.sc-duet-button .duet-button.sc-duet-button:focus,.duet-button.sc-duet-button:focus.duet-theme-turva{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}/*!@.duet-button.duet-button-size-medium*/.duet-button.duet-button-size-medium.sc-duet-button{height:50px;padding-right:30px;padding-left:30px;font-size:1rem;border-radius:25px}/*!@.duet-theme-turva .duet-button.duet-button-size-medium*/.duet-theme-turva.sc-duet-button .duet-button.duet-button-size-medium.sc-duet-button{padding-right:24px;padding-left:24px;border-radius:12.5px}/*!@.duet-button.duet-button-size-medium.square*/.duet-button.duet-button-size-medium.square.sc-duet-button{border-radius:12.5px}/*!@.duet-button.duet-button-size-medium.icon-left*/.duet-button.duet-button-size-medium.icon-left.sc-duet-button{padding-left:24px}/*!@.duet-theme-turva .duet-button.duet-button-size-medium.icon-left*/.duet-theme-turva.sc-duet-button .duet-button.duet-button-size-medium.icon-left.sc-duet-button{padding-left:18px}/*!@.duet-button.duet-button-size-medium.icon-right*/.duet-button.duet-button-size-medium.icon-right.sc-duet-button{padding-right:24px}/*!@.duet-theme-turva .duet-button.duet-button-size-medium.icon-right*/.duet-theme-turva.sc-duet-button .duet-button.duet-button-size-medium.icon-right.sc-duet-button{padding-right:18px}/*!@.duet-button.duet-button-size-small*/.duet-button.duet-button-size-small.sc-duet-button{height:40px;padding-right:20px;padding-left:20px;font-size:0.875rem;border-radius:20px}/*!@.duet-theme-turva .duet-button.duet-button-size-small*/.duet-theme-turva.sc-duet-button .duet-button.duet-button-size-small.sc-duet-button{padding-right:18px;padding-left:18px;border-radius:10px}/*!@.duet-button.duet-button-size-small.square*/.duet-button.duet-button-size-small.square.sc-duet-button{border-radius:10px}/*!@.duet-button.duet-button-size-small.icon-left*/.duet-button.duet-button-size-small.icon-left.sc-duet-button{padding-left:18px}/*!@.duet-theme-turva .duet-button.duet-button-size-small.icon-left*/.duet-theme-turva.sc-duet-button .duet-button.duet-button-size-small.icon-left.sc-duet-button{padding-left:14px}/*!@.duet-button.duet-button-size-small.icon-right*/.duet-button.duet-button-size-small.icon-right.sc-duet-button{padding-right:18px}/*!@.duet-theme-turva .duet-button.duet-button-size-small.icon-right*/.duet-theme-turva.sc-duet-button .duet-button.duet-button-size-small.icon-right.sc-duet-button{padding-right:14px}/*!@.duet-button.duet-button-size-x-small*/.duet-button.duet-button-size-x-small.sc-duet-button{height:32px;padding-right:12px;padding-left:12px;font-size:0.75rem;border-radius:8px}/*!@.duet-button.duet-button-size-x-small.icon-left*/.duet-button.duet-button-size-x-small.icon-left.sc-duet-button{padding-left:10px}/*!@.duet-button.duet-button-size-x-small.icon-right*/.duet-button.duet-button-size-x-small.icon-right.sc-duet-button{padding-right:10px}/*!@.duet-button.plain.duet-p-0*/.duet-button.plain.duet-p-0.sc-duet-button{height:auto}/*!@.duet-button:not(.input-button-primary, .input-button-secondary, .input-button-embedded)*/.duet-button.sc-duet-button:not(.input-button-primary,.input-button-secondary.sc-duet-button,.input-button-embedded).sc-duet-button{font-variant-numeric:tabular-nums}/*!@.duet-button.duet-button-text-center*/.duet-button.duet-button-text-center.sc-duet-button{text-align:center !important}/*!@.duet-button.duet-button-is-small:not(.duet-button-icon-only)*/.duet-button.duet-button-is-small.sc-duet-button:not(.duet-button-icon-only){min-width:48px}/*!@.duet-button.duet-button-is-small:not(.duet-button-icon-only).plain*/.duet-button.duet-button-is-small.sc-duet-button:not(.duet-button-icon-only).plain{padding-right:0 !important;padding-left:0 !important}/*!@.duet-button.duet-button-is-small:not(.duet-button-icon-only).duet-p-0*/.duet-button.duet-button-is-small.sc-duet-button:not(.duet-button-icon-only).duet-p-0{padding:0 !important}/*!@.duet-theme-turva .duet-button*/.duet-theme-turva.sc-duet-button .duet-button.sc-duet-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(198, 12, 48) !important}/*!@.duet-button .duet-button-contents*/.duet-button.sc-duet-button .duet-button-contents.sc-duet-button{position:relative;display:flex;gap:10px;align-items:center;margin:0 auto;pointer-events:none}/*!@.duet-button .duet-button-contents.icon-right*/.duet-button.sc-duet-button .duet-button-contents.icon-right.sc-duet-button{flex-direction:row-reverse}/*!@.duet-button .duet-button-contents .duet-button-contents-slot*/.duet-button.sc-duet-button .duet-button-contents.sc-duet-button .duet-button-contents-slot.sc-duet-button{position:relative;top:0}/*!@.duet-button.duet-no-wrap*/.duet-button.duet-no-wrap.sc-duet-button{white-space:nowrap}/*!@.duet-button svg*/.duet-button.sc-duet-button svg.sc-duet-button{width:100%;min-width:100%;fill:currentColor}/*!@.duet-button .duet-button-icon*/.duet-button.sc-duet-button .duet-button-icon.sc-duet-button{display:flex;align-items:center}/*!@.duet-button .duet-button-icon duet-icon*/.duet-button.sc-duet-button .duet-button-icon.sc-duet-button duet-icon.sc-duet-button{width:16px;height:16px}/*!@.duet-button .duet-button-icon.large duet-icon*/.duet-button.sc-duet-button .duet-button-icon.large.sc-duet-button duet-icon.sc-duet-button{width:20px;height:20px}/*!@.duet-button .duet-button-icon.medium-small duet-icon*/.duet-button.sc-duet-button .duet-button-icon.medium-small.sc-duet-button duet-icon.sc-duet-button{width:10px;height:10px}/*!@.duet-button .duet-button-icon.small duet-icon*/.duet-button.sc-duet-button .duet-button-icon.small.sc-duet-button duet-icon.sc-duet-button{width:7px;height:7px}/*!@.duet-button:active:not([disabled])*/.duet-button.sc-duet-button:active:not([disabled]){opacity:0.75;transition:none}/*!@.duet-button.default*/.duet-button.default.sc-duet-button{border-color:rgb(207, 210, 212)}/*!@.duet-theme-turva .duet-button.default*/.duet-theme-turva.sc-duet-button .duet-button.default.sc-duet-button{color:rgb(198, 12, 48) !important;border-color:rgb(228, 228, 230)}/*!@.duet-button.default:hover*/.duet-button.default.sc-duet-button:hover{border-color:rgb(0, 119, 179);outline:2px solid rgb(0, 119, 179);outline-offset:-2px}/*!@.duet-theme-turva .duet-button.default:hover*/.duet-theme-turva.sc-duet-button .duet-button.default.sc-duet-button:hover{border-color:rgb(198, 12, 48);outline-color:rgb(198, 12, 48)}/*!@.duet-button.default.duet-button-negative*/.duet-button.default.duet-button-negative.sc-duet-button{background-color:rgb(255, 255, 255)}/*!@.duet-theme-turva .duet-button.default.duet-button-negative*/.duet-theme-turva.sc-duet-button .duet-button.default.duet-button-negative.sc-duet-button{background-color:rgb(228, 228, 230) !important}/*!@.duet-button.default.duet-button-negative:hover*/.duet-button.default.duet-button-negative.sc-duet-button:hover{color:rgb(0, 119, 179) !important;border-color:rgb(0, 119, 179)}/*!@.duet-theme-turva .duet-button.default.duet-button-negative:hover*/.duet-theme-turva.sc-duet-button .duet-button.default.duet-button-negative.sc-duet-button:hover{color:rgb(198, 12, 48) !important;border-color:rgb(198, 12, 48)}/*!@.duet-button.primary, .duet-button.input-button-primary*/.duet-button.primary.sc-duet-button,.duet-button.input-button-primary.sc-duet-button{color:rgb(255, 255, 255) !important;background:rgb(0, 119, 179);border-color:rgb(0, 119, 179)}/*!@.duet-theme-turva .duet-button.primary, .duet-theme-turva .duet-button.input-button-primary*/.duet-theme-turva.sc-duet-button .duet-button.primary.sc-duet-button,.duet-theme-turva.sc-duet-button .duet-button.input-button-primary.sc-duet-button{color:rgb(255, 255, 255) !important;background:rgb(198, 12, 48);border-color:rgb(198, 12, 48)}/*!@.duet-button.primary:hover, .duet-button.input-button-primary:hover*/.duet-button.primary.sc-duet-button:hover,.duet-button.input-button-primary.sc-duet-button:hover{background:#005f8f;border-color:#005f8f;box-shadow:0 4px 20px 0 rgba(34, 34, 34, 0.1)}/*!@.duet-theme-turva .duet-button.primary:hover, .duet-theme-turva .duet-button.input-button-primary:hover*/.duet-theme-turva.sc-duet-button .duet-button.primary.sc-duet-button:hover,.duet-theme-turva.sc-duet-button .duet-button.input-button-primary.sc-duet-button:hover{background:rgb(148, 9, 37);border-color:rgb(148, 9, 37)}/*!@.duet-button.primary:focus, .duet-button.input-button-primary:focus*/.duet-button.primary.sc-duet-button:focus,.duet-button.input-button-primary.sc-duet-button:focus{outline:0;box-shadow:0 0 0 1px #fff, 0 0 0 4px rgba(0, 119, 179, 0.75)}/*!@.duet-theme-turva .duet-button.primary:focus, .duet-theme-turva .duet-button.input-button-primary:focus*/.duet-theme-turva.sc-duet-button .duet-button.primary.sc-duet-button:focus,.duet-theme-turva.sc-duet-button .duet-button.input-button-primary.sc-duet-button:focus{box-shadow:0 0 0 1px #fff, 0 0 0 4px rgba(23, 28, 58, 0.75)}/*!@.duet-button.secondary, .duet-button.input-button-secondary, .duet-button.input-button-embedded*/.duet-button.secondary.sc-duet-button,.duet-button.input-button-secondary.sc-duet-button,.duet-button.input-button-embedded.sc-duet-button{color:rgb(0, 41, 77) !important;background:transparent;border-color:rgb(0, 41, 77)}/*!@.duet-theme-turva .duet-button.secondary, .duet-theme-turva .duet-button.input-button-secondary, .duet-theme-turva .duet-button.input-button-embedded*/.duet-theme-turva.sc-duet-button .duet-button.secondary.sc-duet-button,.duet-theme-turva.sc-duet-button .duet-button.input-button-secondary.sc-duet-button,.duet-theme-turva.sc-duet-button .duet-button.input-button-embedded.sc-duet-button{color:rgb(23, 28, 58) !important;border-color:rgb(23, 28, 58)}/*!@.duet-button.secondary:hover, .duet-button.input-button-secondary:hover, .duet-button.input-button-embedded:hover*/.duet-button.secondary.sc-duet-button:hover,.duet-button.input-button-secondary.sc-duet-button:hover,.duet-button.input-button-embedded.sc-duet-button:hover{color:rgb(0, 119, 179) !important;border-color:rgb(0, 119, 179)}/*!@.duet-theme-turva .duet-button.secondary:hover, .duet-theme-turva .duet-button.input-button-secondary:hover, .duet-theme-turva .duet-button.input-button-embedded:hover*/.duet-theme-turva.sc-duet-button .duet-button.secondary.sc-duet-button:hover,.duet-theme-turva.sc-duet-button .duet-button.input-button-secondary.sc-duet-button:hover,.duet-theme-turva.sc-duet-button .duet-button.input-button-embedded.sc-duet-button:hover{color:rgb(198, 12, 48) !important;border-color:rgb(198, 12, 48)}/*!@.duet-button.secondary.duet-button-negative, .duet-button.input-button-secondary.duet-button-negative, .duet-button.input-button-embedded.duet-button-negative*/.duet-button.secondary.duet-button-negative.sc-duet-button,.duet-button.input-button-secondary.duet-button-negative.sc-duet-button,.duet-button.input-button-embedded.duet-button-negative.sc-duet-button{color:rgb(225, 227, 230) !important;border-color:rgb(255, 255, 255)}/*!@.duet-theme-turva .duet-button.secondary.duet-button-negative, .duet-theme-turva .duet-button.input-button-secondary.duet-button-negative, .duet-theme-turva .duet-button.input-button-embedded.duet-button-negative*/.duet-theme-turva.sc-duet-button .duet-button.secondary.duet-button-negative.sc-duet-button,.duet-theme-turva.sc-duet-button .duet-button.input-button-secondary.duet-button-negative.sc-duet-button,.duet-theme-turva.sc-duet-button .duet-button.input-button-embedded.duet-button-negative.sc-duet-button{color:rgb(228, 228, 230) !important}/*!@.duet-button.secondary.duet-button-negative:hover, .duet-button.input-button-secondary.duet-button-negative:hover, .duet-button.input-button-embedded.duet-button-negative:hover*/.duet-button.secondary.duet-button-negative.sc-duet-button:hover,.duet-button.input-button-secondary.duet-button-negative.sc-duet-button:hover,.duet-button.input-button-embedded.duet-button-negative.sc-duet-button:hover{color:rgb(0, 119, 179) !important;border-color:rgb(0, 119, 179)}/*!@.duet-theme-turva .duet-button.secondary.duet-button-negative:hover, .duet-theme-turva .duet-button.input-button-secondary.duet-button-negative:hover, .duet-theme-turva .duet-button.input-button-embedded.duet-button-negative:hover*/.duet-theme-turva.sc-duet-button .duet-button.secondary.duet-button-negative.sc-duet-button:hover,.duet-theme-turva.sc-duet-button .duet-button.input-button-secondary.duet-button-negative.sc-duet-button:hover,.duet-theme-turva.sc-duet-button .duet-button.input-button-embedded.duet-button-negative.sc-duet-button:hover{color:rgb(198, 12, 48) !important;border-color:rgb(198, 12, 48)}/*!@.duet-button.input-button-embedded*/.duet-button.input-button-embedded.sc-duet-button{width:40px;min-width:40px !important;min-height:40px !important;margin:4px !important;border-width:0 !important;border-radius:4px !important}/*!@.duet-button.input-button*/.duet-button.input-button.sc-duet-button{height:auto}/*!@.duet-button.negative*/.duet-button.negative.sc-duet-button{color:rgb(0, 41, 77) !important;background:rgb(255, 255, 255);border-color:rgb(255, 255, 255)}/*!@.duet-theme-turva .duet-button.negative*/.duet-theme-turva.sc-duet-button .duet-button.negative.sc-duet-button{color:rgb(23, 28, 58) !important}/*!@.duet-button.negative:hover*/.duet-button.negative.sc-duet-button:hover{color:rgb(255, 255, 255) !important;background:transparent;border-color:rgb(255, 255, 255)}/*!@.duet-button.negative:focus*/.duet-button.negative.sc-duet-button:focus{outline:0;box-shadow:0 0 0 1px #00294d, 0 0 0 4px rgba(255, 255, 255, 0.7)}/*!@.duet-theme-turva .duet-button.negative:focus*/.duet-theme-turva.sc-duet-button .duet-button.negative.sc-duet-button:focus{box-shadow:0 0 0 1px #0077b3, 0 0 0 4px rgba(255, 255, 255, 0.7)}/*!@.duet-button.destructive-primary*/.duet-button.destructive-primary.sc-duet-button{color:rgb(255, 255, 255) !important;background:rgb(222, 35, 98);border-color:rgb(222, 35, 98)}/*!@.duet-theme-turva .duet-button.destructive-primary*/.duet-theme-turva.sc-duet-button .duet-button.destructive-primary.sc-duet-button{color:rgb(255, 255, 255) !important;background:rgb(224, 42, 13);border-color:rgb(224, 42, 13)}/*!@.duet-button.destructive-primary:hover*/.duet-button.destructive-primary.sc-duet-button:hover{background:#b21c4e;border-color:#b21c4e;box-shadow:0 4px 20px 0 rgba(34, 34, 34, 0.1)}/*!@.duet-theme-turva .duet-button.destructive-primary:hover*/.duet-theme-turva.sc-duet-button .duet-button.destructive-primary.sc-duet-button:hover{background:#b3220a}/*!@.duet-button.destructive, .duet-button.destructive-secondary*/.duet-button.destructive.sc-duet-button,.duet-button.destructive-secondary.sc-duet-button{color:rgb(222, 35, 98) !important;background:rgb(255, 255, 255);border-color:rgb(222, 35, 98)}/*!@.duet-theme-turva .duet-button.destructive, .duet-theme-turva .duet-button.destructive-secondary*/.duet-theme-turva.sc-duet-button .duet-button.destructive.sc-duet-button,.duet-theme-turva.sc-duet-button .duet-button.destructive-secondary.sc-duet-button{color:rgb(224, 42, 13) !important;background:rgb(255, 255, 255);border-color:rgb(224, 42, 13)}/*!@.duet-button.destructive:hover, .duet-button.destructive-secondary:hover*/.duet-button.destructive.sc-duet-button:hover,.duet-button.destructive-secondary.sc-duet-button:hover{color:rgb(255, 255, 255) !important;background:#b21c4e;border-color:#b21c4e}/*!@.duet-theme-turva .duet-button.destructive:hover, .duet-theme-turva .duet-button.destructive-secondary:hover*/.duet-theme-turva.sc-duet-button .duet-button.destructive.sc-duet-button:hover,.duet-theme-turva.sc-duet-button .duet-button.destructive-secondary.sc-duet-button:hover{color:rgb(255, 255, 255) !important;background:#b3220a;border-color:#b3220a}/*!@.duet-button.plain*/.duet-button.plain.sc-duet-button{min-width:48px;padding-right:0 !important;padding-left:0 !important;line-height:1.5;text-align:left;background:transparent;border:0;border-color:transparent;border-radius:4px}/*!@.duet-theme-turva .duet-button.plain*/.duet-theme-turva.sc-duet-button .duet-button.plain.sc-duet-button{color:rgb(198, 12, 48) !important;background:transparent;border-color:transparent}/*!@.duet-button.plain.duet-p-0 .duet-button-contents*/.duet-button.plain.duet-p-0.sc-duet-button .duet-button-contents.sc-duet-button{height:auto}/*!@.duet-button.plain[disabled]*/.duet-button.plain[disabled].sc-duet-button{color:rgb(101, 119, 135) !important;cursor:not-allowed;background:transparent !important;border-color:transparent !important}/*!@.duet-theme-turva .duet-button.plain[disabled]*/.duet-theme-turva.sc-duet-button .duet-button.plain[disabled].sc-duet-button{color:transparent !important;cursor:not-allowed;background:transparent !important;border-color:rgb(228, 228, 230) !important}/*!@.duet-button.plain:hover*/.duet-button.plain.sc-duet-button:hover{color:rgb(0, 77, 128) !important;background:transparent !important}/*!@.duet-theme-turva .duet-button.plain:hover*/.duet-theme-turva.sc-duet-button .duet-button.plain.sc-duet-button:hover{color:rgb(148, 9, 37) !important}/*!@.duet-button.plain.duet-button-negative*/.duet-button.plain.duet-button-negative.sc-duet-button{color:rgb(255, 255, 255) !important}/*!@.duet-theme-turva .duet-button.plain.duet-button-negative*/.duet-theme-turva.sc-duet-button .duet-button.plain.duet-button-negative.sc-duet-button{color:rgb(228, 228, 230) !important}/*!@.duet-button.plain.duet-button-negative:hover*/.duet-button.plain.duet-button-negative.sc-duet-button:hover{color:rgb(0, 119, 179) !important}/*!@.duet-theme-turva .duet-button.plain.duet-button-negative:hover*/.duet-theme-turva.sc-duet-button .duet-button.plain.duet-button-negative.sc-duet-button:hover{color:rgb(198, 12, 48) !important}/*!@.duet-button.duet-button-icon-only*/.duet-button.duet-button-icon-only.sc-duet-button{min-width:48px;min-height:48px;padding:0 !important}/*!@.duet-button.duet-button-icon-only .duet-button-contents*/.duet-button.duet-button-icon-only.sc-duet-button .duet-button-contents.sc-duet-button{position:static}/*!@.duet-button.duet-button-icon-only .duet-button-icon.left.large,\n.duet-button.duet-button-icon-only .duet-button-icon.left.medium,\n.duet-button.duet-button-icon-only .duet-button-icon.left.small*/.duet-button.duet-button-icon-only.sc-duet-button .duet-button-icon.left.large.sc-duet-button,.duet-button.duet-button-icon-only.sc-duet-button .duet-button-icon.left.medium.sc-duet-button,.duet-button.duet-button-icon-only.sc-duet-button .duet-button-icon.left.small.sc-duet-button{position:absolute;top:50% !important;left:50% !important;padding:0;margin:0;transform:translateX(-50%) translateY(-50%)}/*!@.duet-button.duet-button.input-button-primary, .duet-button.duet-button.input-button-secondary, .duet-button.duet-button.input-button-embedded*/.duet-button.duet-button.input-button-primary.sc-duet-button,.duet-button.duet-button.input-button-secondary.sc-duet-button,.duet-button.duet-button.input-button-embedded.sc-duet-button{box-sizing:content-box;min-width:48px;min-height:48px;padding:0 !important;border-width:1px;border-top-left-radius:0;border-top-right-radius:4px;border-bottom-right-radius:4px;border-bottom-left-radius:0}/*!@.duet-button.duet-button.input-button-primary .duet-button-contents, .duet-button.duet-button.input-button-secondary .duet-button-contents, .duet-button.duet-button.input-button-embedded .duet-button-contents*/.duet-button.duet-button.input-button-primary.sc-duet-button .duet-button-contents.sc-duet-button,.duet-button.duet-button.input-button-secondary.sc-duet-button .duet-button-contents.sc-duet-button,.duet-button.duet-button.input-button-embedded.sc-duet-button .duet-button-contents.sc-duet-button{position:static}/*!@.duet-button.duet-button.input-button-primary .duet-button-icon.left.large,\n.duet-button.duet-button.input-button-primary .duet-button-icon.left.medium,\n.duet-button.duet-button.input-button-primary .duet-button-icon.left.small, .duet-button.duet-button.input-button-secondary .duet-button-icon.left.large,\n.duet-button.duet-button.input-button-secondary .duet-button-icon.left.medium,\n.duet-button.duet-button.input-button-secondary .duet-button-icon.left.small, .duet-button.duet-button.input-button-embedded .duet-button-icon.left.large,\n.duet-button.duet-button.input-button-embedded .duet-button-icon.left.medium,\n.duet-button.duet-button.input-button-embedded .duet-button-icon.left.small*/.duet-button.duet-button.input-button-primary.sc-duet-button .duet-button-icon.left.large.sc-duet-button,.duet-button.duet-button.input-button-primary.sc-duet-button .duet-button-icon.left.medium.sc-duet-button,.duet-button.duet-button.input-button-primary.sc-duet-button .duet-button-icon.left.small.sc-duet-button,.duet-button.duet-button.input-button-secondary.sc-duet-button .duet-button-icon.left.large.sc-duet-button,.duet-button.duet-button.input-button-secondary.sc-duet-button .duet-button-icon.left.medium.sc-duet-button,.duet-button.duet-button.input-button-secondary.sc-duet-button .duet-button-icon.left.small.sc-duet-button,.duet-button.duet-button.input-button-embedded.sc-duet-button .duet-button-icon.left.large.sc-duet-button,.duet-button.duet-button.input-button-embedded.sc-duet-button .duet-button-icon.left.medium.sc-duet-button,.duet-button.duet-button.input-button-embedded.sc-duet-button .duet-button-icon.left.small.sc-duet-button{position:absolute;top:50% !important;left:50% !important;padding:0;margin:0;transform:translateX(-50%) translateY(-50%)}/*!@.duet-button.duet-button.input-button-embedded*/.duet-button.duet-button.input-button-embedded.sc-duet-button{border-left-width:0}/*!@.duet-button.square*/.duet-button.square.sc-duet-button{width:52px;min-width:auto !important;padding:0 !important;font-size:1rem;border-color:rgb(207, 210, 212);border-width:1px}/*!@.duet-button.square.duet-button-size-small*/.duet-button.square.duet-button-size-small.sc-duet-button{width:42px;font-size:0.875rem}/*!@.duet-button.square.duet-button-size-x-small*/.duet-button.square.duet-button-size-x-small.sc-duet-button{width:34px;font-size:0.875rem}/*!@.duet-button.square.duet-button-negative*/.duet-button.square.duet-button-negative.sc-duet-button{color:rgb(255, 255, 255) !important;background:rgb(0, 119, 179);border-color:rgb(0, 119, 179)}/*!@.duet-theme-turva .duet-button.square.duet-button-negative*/.duet-theme-turva.sc-duet-button .duet-button.square.duet-button-negative.sc-duet-button{color:rgb(255, 255, 255) !important;background:rgb(198, 12, 48);border-color:rgb(198, 12, 48)}/*!@.duet-theme-turva .duet-button.square*/.duet-theme-turva.sc-duet-button .duet-button.square.sc-duet-button{border-color:rgb(228, 228, 230)}/*!@.duet-button.square:hover*/.duet-button.square.sc-duet-button:hover{border-color:rgb(0, 119, 179);outline:2px solid rgb(0, 119, 179);outline-offset:-2px}/*!@.duet-theme-turva .duet-button.square:hover*/.duet-theme-turva.sc-duet-button .duet-button.square.sc-duet-button:hover{border-color:rgb(198, 12, 48);outline-color:rgb(198, 12, 48)}/*!@.duet-button.square .duet-button-contents*/.duet-button.square.sc-duet-button .duet-button-contents.sc-duet-button{gap:0}/*!@.duet-button[disabled], .duet-button[disabled]:hover, .duet-button.duet-button-negative[disabled], .duet-button.duet-button-negative[disabled]:hover*/.duet-button[disabled].sc-duet-button,.duet-button[disabled].sc-duet-button:hover,.duet-button.duet-button-negative[disabled].sc-duet-button,.duet-button.duet-button-negative[disabled].sc-duet-button:hover{color:rgb(101, 119, 135) !important;cursor:not-allowed;background:rgb(225, 227, 230) !important;border-color:rgb(225, 227, 230) !important;box-shadow:none !important}/*!@.duet-theme-turva .duet-button[disabled], .duet-theme-turva .duet-button[disabled]:hover, .duet-theme-turva .duet-button.duet-button-negative [disabled], .duet-theme-turva .duet-button.duet-button-negative [disabled]:hover*/.duet-theme-turva.sc-duet-button .duet-button[disabled].sc-duet-button,.duet-theme-turva.sc-duet-button .duet-button[disabled].sc-duet-button:hover,.duet-theme-turva.sc-duet-button .duet-button.duet-button-negative.sc-duet-button [disabled].sc-duet-button,.duet-theme-turva.sc-duet-button .duet-button.duet-button-negative.sc-duet-button [disabled].sc-duet-button:hover{color:rgb(116, 116, 117) !important;cursor:not-allowed;background:rgb(228, 228, 230) !important;border-color:rgb(228, 228, 230) !important}/*!@.duet-button-is-loading.primary, .duet-button-is-loading.input-button-primary*/.duet-button-is-loading.primary.sc-duet-button,.duet-button-is-loading.input-button-primary.sc-duet-button{color:rgb(255, 255, 255)}/*!@.duet-button-is-loading.default*/.duet-button-is-loading.default.sc-duet-button{color:rgb(0, 119, 179)}/*!@.duet-button-is-loading.default.duet-theme-turva*/.duet-button-is-loading.default.duet-theme-turva.sc-duet-button{color:rgb(198, 12, 48)}/*!@.duet-button-is-loading .duet-button-contents*/.duet-button-is-loading.sc-duet-button .duet-button-contents.sc-duet-button{visibility:hidden;opacity:0}";
 class DuetButton {
     constructor(hostRef) {
@@ -9199,7 +9225,8 @@ class DuetCallout {
      */
     componentWillLoad() {
         inheritGlobalTheme(this);
-        this.hasAuthorSlot = !!this.element.querySelector('[slot="author"]');
+        this.hasAuthorSlot = hasSlot(this.element, "author");
+        checkNamedSlotElement(this.element, "author", "span");
     }
     /**
      * render() function
@@ -9214,7 +9241,7 @@ class DuetCallout {
                 "duet-callout": true,
                 "duet-theme-turva": this.theme === "turva",
                 "duet-m-0": this.margin === "none",
-            } }, hAsync("figure", { class: "container" }, hAsync("duet-icon", { class: "callout-icon", shape: "brand-rotated", background: "primary-lighter", "background-opacity": "0.75", "background-rotation": this.theme === "turva" ? "0" : "7", color: "secondary", icon: icon, size: "auto", margin: "none", theme: this.theme }), hAsync("blockquote", null, hAsync("slot", null)), this.hasAuthorSlot && (hAsync("figcaption", { class: "author" }, hAsync("span", null, "\u2014 "), hAsync("slot", { name: "author", onSlotchange: ev => slotElementCheck(ev, this, "span") })))))));
+            } }, hAsync("figure", { class: "container" }, hAsync("duet-icon", { class: "callout-icon", shape: "brand-rotated", background: "primary-lighter", "background-opacity": "0.75", "background-rotation": this.theme === "turva" ? "0" : "7", color: "secondary", icon: icon, size: "auto", margin: "none", theme: this.theme }), hAsync("blockquote", null, hAsync("slot", null)), this.hasAuthorSlot && (hAsync("figcaption", { class: "author" }, hAsync("span", null, "\u2014 "), hAsync("slot", { name: "author" })))))));
     }
     get element() { return getElement(this); }
     static get style() { return duetCalloutCss; }
@@ -9355,8 +9382,9 @@ class DuetCard {
         }
     }
     /**
-     * Sets focus on the specified `duet-card`. Use this method instead of the global
-     * `card.focus()`.
+     * Sets focus on underlying a element.
+     * Available only when url attribute is used.
+     * Use this method instead of the native `focus()`.
      */
     async setFocus(options) {
         if (this.nativeCard) {
@@ -10231,6 +10259,7 @@ class DuetChoiceGroup {
     }
     componentWillLoad() {
         inheritGlobalTheme(this);
+        checkNamedSlotElement(this.element, "tooltip", "duet-tooltip", 1, true);
     }
     /**
      * Local methods
@@ -11783,6 +11812,7 @@ class DuetDatePicker {
         inheritGlobalTheme(this);
         this.determineValidity(parseISODate(this.value));
         this.updateInternalValue();
+        checkNamedSlotElement(this.element, "tooltip", "duet-tooltip", 1, true);
     }
     componentDidUpdate() {
         // we want to run this code _after_ render
@@ -13688,9 +13718,12 @@ class DuetHero {
      */
     componentWillLoad() {
         inheritGlobalTheme(this);
-        this.hasPreHeadingSlot = !!this.element.querySelector('[slot="pre-heading"]');
-        this.hasHeadingSlot = !!this.element.querySelector('[slot="heading"]');
-        this.hasSubHeadingSlot = !!this.element.querySelector('[slot="subheading"]');
+        this.hasPreHeadingSlot = hasSlot(this.element, "pre-heading");
+        this.hasHeadingSlot = hasSlot(this.element, "heading");
+        this.hasSubHeadingSlot = hasSlot(this.element, "subheading");
+        checkNamedSlotElement(this.element, "pre-heading", "span");
+        checkNamedSlotElement(this.element, "heading", "span");
+        checkNamedSlotElement(this.element, "subheading", "span");
         this.refresh();
     }
     connectedCallback() {
@@ -13798,7 +13831,7 @@ class DuetHero {
                 href: this.processedBack.href,
                 id: this.processedBack.id,
                 analyticsId: this.processedBack.analyticsId,
-            }) }, this.processedBack.label))), (this.variation === "gray" || this.variation === "minimal") && this.categoryIcon && (hAsync("duet-icon", { class: { "duet-hero-icon": true, "duet-hero-icon-has-heading": this.preHeading !== "" }, size: "x-large", background: this.categoryIconColor, name: this.categoryIcon })), hAsync("div", { class: { "duet-hero-text": true }, part: "duet-hero-text" }, (this.preHeading || this.hasPreHeadingSlot) && (hAsync("duet-paragraph", { margin: "none", class: "duet-hero-pre", size: this.variation === "content" ? "small" : "medium" }, this.preHeading ? (this.preHeading) : (hAsync("span", null, hAsync("slot", { name: "pre-heading", onSlotchange: ev => slotElementCheck(ev, this, "span") }))))), hAsync("slot", { name: "badge" }), (this.heading || this.hasHeadingSlot) && (hAsync("duet-heading", { theme: this.theme, level: this.level, class: { "duet-hero-heading": true, "duet-hero-heading-has-pre": this.preHeading !== "" }, color: headingColor, visualLevel: headingVisualLevel, margin: campaignOrSection ? "none" : "auto" }, this.heading ? (this.heading) : (hAsync("span", null, hAsync("slot", { name: "heading", onSlotchange: ev => slotElementCheck(ev, this, "span") }))))), campaignOrSection && this.hasSubHeadingSlot && (hAsync("duet-heading", { theme: this.theme, level: this.subHeadingLevel, class: { "duet-hero-subheading": true }, color: this.theme === "turva" ? "secondary-turva" : "secondary", visualLevel: "h2" }, hAsync("span", null, hAsync("slot", { name: "subheading", onSlotchange: ev => slotElementCheck(ev, this, "span") })))), this.description && (hAsync("duet-paragraph", { theme: this.theme, color: textColor, variation: "intro" }, this.description)), (this.variation === "gray" || this.variation === "minimal") && this.processedListItems && (hAsync("duet-list", { theme: this.theme, "label-width": "30", breakpoint: "large", mobile: this.leftAlign ? undefined : "center" }, this.processedListItems.map(item => (hAsync("duet-list-item", null, hAsync("span", { slot: "label" }, item.label), hAsync("span", { slot: "value" }, item.value)))))), this.buttonLabel && (hAsync("duet-button", { url: this.buttonUrl, icon: this.icon, iconRight: this.iconRight, iconSize: this.iconSize, variation: buttonVariation, theme: this.theme, identifier: this.buttonId, onClick: event => this.handleClick(event, this.buttonData), fixed: true }, this.buttonLabel)), hAsync("div", { class: "duet-hero-slot-unnamed" }, hAsync("slot", null))), (this.variation === "gray" || this.variation === "minimal") && this.processedActions && (hAsync("div", { class: "duet-hero-links" }, this.processedActions.map(item => (hAsync("a", { class: "duet-hero-link", href: item.href, id: item.id, target: item.external ? "_blank" : "_self", onClick: event => this.handleClick(event, item) }, hAsync("div", { class: "duet-hero-action-icon" }, hAsync("duet-icon", { size: "small", margin: "none", name: item.icon, color: "currentColor", outline: outlineColor })), hAsync("span", null, item.label), item.external && hAsync("duet-visually-hidden", null, ", ", this.accessibleLabelExternal), item.external && (hAsync("div", { class: "duet-hero-action-arrow" }, hAsync("duet-icon", { icon: actionNewWindowSmall.svg, size: "xx-small", margin: "none", color: "currentColor" })))))))), this.image &&
+            }) }, this.processedBack.label))), (this.variation === "gray" || this.variation === "minimal") && this.categoryIcon && (hAsync("duet-icon", { class: { "duet-hero-icon": true, "duet-hero-icon-has-heading": this.preHeading !== "" }, size: "x-large", background: this.categoryIconColor, name: this.categoryIcon })), hAsync("div", { class: { "duet-hero-text": true }, part: "duet-hero-text" }, (this.preHeading || this.hasPreHeadingSlot) && (hAsync("duet-paragraph", { margin: "none", class: "duet-hero-pre", size: this.variation === "content" ? "small" : "medium" }, this.preHeading ? (this.preHeading) : (hAsync("span", null, hAsync("slot", { name: "pre-heading" }))))), hAsync("slot", { name: "badge" }), (this.heading || this.hasHeadingSlot) && (hAsync("duet-heading", { theme: this.theme, level: this.level, class: { "duet-hero-heading": true, "duet-hero-heading-has-pre": this.preHeading !== "" }, color: headingColor, visualLevel: headingVisualLevel, margin: campaignOrSection ? "none" : "auto" }, this.heading ? (this.heading) : (hAsync("span", null, hAsync("slot", { name: "heading" }))))), campaignOrSection && this.hasSubHeadingSlot && (hAsync("duet-heading", { theme: this.theme, level: this.subHeadingLevel, class: { "duet-hero-subheading": true }, color: this.theme === "turva" ? "secondary-turva" : "secondary", visualLevel: "h2" }, hAsync("span", null, hAsync("slot", { name: "subheading" })))), this.description && (hAsync("duet-paragraph", { theme: this.theme, color: textColor, variation: "intro" }, this.description)), (this.variation === "gray" || this.variation === "minimal") && this.processedListItems && (hAsync("duet-list", { theme: this.theme, "label-width": "30", breakpoint: "large", mobile: this.leftAlign ? undefined : "center" }, this.processedListItems.map(item => (hAsync("duet-list-item", null, hAsync("span", { slot: "label" }, item.label), hAsync("span", { slot: "value" }, item.value)))))), this.buttonLabel && (hAsync("duet-button", { url: this.buttonUrl, icon: this.icon, iconRight: this.iconRight, iconSize: this.iconSize, variation: buttonVariation, theme: this.theme, identifier: this.buttonId, onClick: event => this.handleClick(event, this.buttonData), fixed: true }, this.buttonLabel)), hAsync("div", { class: "duet-hero-slot-unnamed" }, hAsync("slot", null))), (this.variation === "gray" || this.variation === "minimal") && this.processedActions && (hAsync("div", { class: "duet-hero-links" }, this.processedActions.map(item => (hAsync("a", { class: "duet-hero-link", href: item.href, id: item.id, target: item.external ? "_blank" : "_self", onClick: event => this.handleClick(event, item) }, hAsync("div", { class: "duet-hero-action-icon" }, hAsync("duet-icon", { size: "small", margin: "none", name: item.icon, color: "currentColor", outline: outlineColor })), hAsync("span", null, item.label), item.external && hAsync("duet-visually-hidden", null, ", ", this.accessibleLabelExternal), item.external && (hAsync("div", { class: "duet-hero-action-arrow" }, hAsync("duet-icon", { icon: actionNewWindowSmall.svg, size: "xx-small", margin: "none", color: "currentColor" })))))))), this.image &&
             this.variation !== "image" &&
             !campaignOrSection &&
             this.variation !== "product" &&
@@ -14233,6 +14266,7 @@ class DuetInput {
         inheritGlobalTheme(this);
         this.disallowedPatternChange();
         this.isCaptionVisible = !!this.caption;
+        checkNamedSlotElement(this.element, "tooltip", "duet-tooltip", 1, true);
     }
     componentDidLoad() {
         if (this.variation === "revealable" && this.nativeInput.form) {
@@ -14549,11 +14583,10 @@ class DuetLink {
         if (this.accessibleLabel) {
             return this.accessibleLabel;
         }
-        if (!this.element.innerHTML) {
-            return "";
+        if (this.external && this.element.textContent) {
+            return `${this.element.textContent}. ${this.accessibleLabelExternal}.`;
         }
-        const capitalized = this.element.innerHTML[0].toUpperCase() + this.element.innerHTML.slice(1);
-        return `${capitalized}. ${this.external ? `${this.accessibleLabelExternal}.` : ""}`;
+        return null;
     }
     renderContent() {
         return (hAsync(Fragment, null, hAsync("span", { class: "duet-link-content", part: "duet-link-content" }, hAsync("slot", null)), Build.isBrowser  ));
@@ -15887,6 +15920,7 @@ class DuetMultiselect {
     componentWillLoad() {
         inheritGlobalTheme(this);
         this.isCaptionVisible = !!this.caption;
+        checkNamedSlotElement(this.element, "tooltip", "duet-tooltip", 1, true);
         this.refresh();
     }
     connectedCallback() {
@@ -15924,7 +15958,7 @@ class DuetMultiselect {
                 "duet-theme-turva": this.theme === "turva",
                 "duet-input-top-caption-shown": this.isCaptionVisible,
                 "has-error": !!this.error,
-            }, onKeyDown: (e) => this.onMultiselectKeyDown(e) }, hAsync("duet-label", { theme: this.theme === "turva" ? "turva" : "default", class: { "duet-has-tooltip": !!this.tooltip }, color: this.labelColor, weight: this.labelWeight, id: this.labelId, for: this.identifier }, this.label), this.tooltip && (hAsync("duet-tooltip", { class: "duet-multiselect-tooltip", direction: this.tooltipDirection, accessibleInputLabel: this.label }, this.tooltip)), hAsync("slot", { name: "tooltip", onSlotchange: ev => slotElementCheck(ev, this, "duet-tooltip") }), this.caption && (hAsync("duet-caption", { id: this.topCaptionId, size: "medium" }, this.caption)), hAsync("div", { class: "duet-multiselect-wrapper" }, hAsync("button", { id: this.identifier, ref: el => (this.multiselectElement = el), class: { "duet-multiselect": true, "duet-multiselect-active": this.checkboxesVisible }, tabindex: "0", onClick: () => this.toggleCheckboxes(), onFocus: e => this.onFocus(e), onBlur: e => this.onBlur(e), role: "combobox", "aria-expanded": this.checkboxesVisible ? "true" : "false", "aria-haspopup": "listbox", "aria-labelledby": this.labelId, "aria-describedby": this.getDescribedBy(), "aria-owns": `${this.identifier}-checkboxes`, onKeyDown: (e) => this.onMultiselectInputKeyDown(e), disabled: this.disabled }, hAsync("span", { role: "textbox", "aria-readonly": "true", "aria-multiline": "false", "aria-autocomplete": "none", "aria-controls": `${this.identifier}-checkboxes`, "aria-label": this.placeholderLabel[this.language], class: "duet-multiselect-label" }, this.placeholder), this.value && this.value.length > 0 && (hAsync("span", { class: "duet-multiselect-badge" }, this.value.length, hAsync("duet-visually-hidden", null, this.selectedLangObject[this.language], ", ", this.value.map(item => item.label).join(", ")))), hAsync("svg", { class: { "duet-multiselect-icon": true, "duet-multiselect-icon--rotate": this.checkboxesVisible }, fill: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, hAsync("path", { d: "m12 18.999c-.4 0-.776-.156-1.059-.438l-10.721-10.72c-.142-.142-.22-.33-.22-.531 0-.2.078-.389.22-.53.142-.142.33-.22.53-.22s.389.078.53.22l10.72 10.719 10.72-10.719c.142-.142.33-.22.53-.22s.389.078.53.22c.142.142.22.33.22.53s-.078.389-.22.53l-10.72 10.72c-.282.283-.659.439-1.06.439z" }))), hAsync("div", { id: `${this.identifier}-checkboxes`, role: "listbox", class: {
+            }, onKeyDown: (e) => this.onMultiselectKeyDown(e) }, hAsync("duet-label", { theme: this.theme === "turva" ? "turva" : "default", class: { "duet-has-tooltip": !!this.tooltip }, color: this.labelColor, weight: this.labelWeight, id: this.labelId, for: this.identifier }, this.label), this.tooltip && (hAsync("duet-tooltip", { class: "duet-multiselect-tooltip", direction: this.tooltipDirection, accessibleInputLabel: this.label }, this.tooltip)), hAsync("slot", { name: "tooltip" }), this.caption && (hAsync("duet-caption", { id: this.topCaptionId, size: "medium" }, this.caption)), hAsync("div", { class: "duet-multiselect-wrapper" }, hAsync("button", { id: this.identifier, ref: el => (this.multiselectElement = el), class: { "duet-multiselect": true, "duet-multiselect-active": this.checkboxesVisible }, tabindex: "0", onClick: () => this.toggleCheckboxes(), onFocus: e => this.onFocus(e), onBlur: e => this.onBlur(e), role: "combobox", "aria-expanded": this.checkboxesVisible ? "true" : "false", "aria-haspopup": "listbox", "aria-labelledby": this.labelId, "aria-describedby": this.getDescribedBy(), "aria-owns": `${this.identifier}-checkboxes`, onKeyDown: (e) => this.onMultiselectInputKeyDown(e), disabled: this.disabled }, hAsync("span", { role: "textbox", "aria-readonly": "true", "aria-multiline": "false", "aria-autocomplete": "none", "aria-controls": `${this.identifier}-checkboxes`, "aria-label": this.placeholderLabel[this.language], class: "duet-multiselect-label" }, this.placeholder), this.value && this.value.length > 0 && (hAsync("span", { class: "duet-multiselect-badge" }, this.value.length, hAsync("duet-visually-hidden", null, this.selectedLangObject[this.language], ", ", this.value.map(item => item.label).join(", ")))), hAsync("svg", { class: { "duet-multiselect-icon": true, "duet-multiselect-icon--rotate": this.checkboxesVisible }, fill: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, hAsync("path", { d: "m12 18.999c-.4 0-.776-.156-1.059-.438l-10.721-10.72c-.142-.142-.22-.33-.22-.531 0-.2.078-.389.22-.53.142-.142.33-.22.53-.22s.389.078.53.22l10.72 10.719 10.72-10.719c.142-.142.33-.22.53-.22s.389.078.53.22c.142.142.22.33.22.53s-.078.389-.22.53l-10.72 10.72c-.282.283-.659.439-1.06.439z" }))), hAsync("div", { id: `${this.identifier}-checkboxes`, role: "listbox", class: {
                 "duet-multiselect-checkboxes": true,
                 "duet-multiselect-checkboxes-active": this.checkboxesVisible,
             }, "aria-activedescendant": this.activeDescendant, "aria-multiselectable": "true" }, this.processedItems && this.allControls && (hAsync("div", { class: "duet-multiselect-all-control-buttons" }, hAsync("button", { class: "duet-multiselect-select-all", onClick: this.handleSelectAllClick, id: this.getOptionIdentifier(-2), onKeyDown: (e) => this.onCheckboxKeyDown(e, -2) }, this.selectAllLabel[this.language]), hAsync("button", { class: "duet-multiselect-clear-all", onClick: this.handleClearAllClick, id: this.getOptionIdentifier(-1), onKeyDown: (e) => this.onCheckboxKeyDown(e, -1) }, this.clearAllLabel[this.language]))), this.processedItems &&
@@ -16521,6 +16555,7 @@ class DuetNumberInput {
         if (this.value) {
             this.value = this.localizeValue(SafeParseFloat(this.value, this.locale));
         }
+        checkNamedSlotElement(this.element, "tooltip", "duet-tooltip", 1, true);
     }
     connectedCallback() {
         connectLanguageChangeObserver(this, [
@@ -18694,7 +18729,7 @@ class DuetProgress {
     }; }
 }
-const duetPromoCardCss = "/*!@*,\n*::after,\n*::before*/*.sc-duet-promo-card,*.sc-duet-promo-card::after,*.sc-duet-promo-card::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@:host*/.sc-duet-promo-card-h{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*/.sc-duet-promo-card-h:last-child,.sc-duet-promo-card-h:last-of-type{margin-right:0 !important}/*!@:host(.duet-m-0)*/.duet-m-0.sc-duet-promo-card-h{margin:0 !important}/*!@.duet-promo-card*/.duet-promo-card.sc-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(0, 41, 77);text-align:left;border-radius:20px}/*!@.duet-promo-card.duet-p-0*/.duet-promo-card.duet-p-0.sc-duet-promo-card{padding:0 !important}/*!@.duet-promo-card.duet-m-0*/.duet-promo-card.duet-m-0.sc-duet-promo-card{margin:0 !important}/*!@.duet-promo-card .content-wrapper*/.duet-promo-card.sc-duet-promo-card .content-wrapper.sc-duet-promo-card{display:flex;flex-direction:column;height:100%;color:inherit;text-decoration:none}/*!@.duet-promo-card .content-wrapper:focus*/.duet-promo-card.sc-duet-promo-card .content-wrapper.sc-duet-promo-card: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*/.duet-promo-card.sc-duet-promo-card .image.sc-duet-promo-card{position:relative;width:100%;overflow:hidden;border-top-left-radius:20px;border-top-right-radius:20px;object-fit:cover}/*!@.duet-promo-card .content*/.duet-promo-card.sc-duet-promo-card .content.sc-duet-promo-card{display:flex;flex-direction:column;flex-grow:1;gap:8px;padding:20px}@media (min-width: 36em){/*!@.duet-promo-card .content*/.duet-promo-card.sc-duet-promo-card .content.sc-duet-promo-card{padding:28px}}/*!@.duet-promo-card .action*/.duet-promo-card.sc-duet-promo-card .action.sc-duet-promo-card{display:flex;flex-grow:1;align-items:flex-end;padding-top:16px}/*!@.duet-promo-card.no-bg-color .content*/.duet-promo-card.no-bg-color.sc-duet-promo-card .content.sc-duet-promo-card{padding:20px 0 0}/*!@.duet-promo-card.no-bg-color .image*/.duet-promo-card.no-bg-color.sc-duet-promo-card .image.sc-duet-promo-card{border-radius:16px}/*!@.duet-promo-card.duet-theme-turva*/.duet-promo-card.duet-theme-turva.sc-duet-promo-card{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*/.duet-promo-card.duet-theme-turva.sc-duet-promo-card .content-wrapper.sc-duet-promo-card:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}";
+const duetPromoCardCss = "/*!@*,\n*::after,\n*::before*/*.sc-duet-promo-card,*.sc-duet-promo-card::after,*.sc-duet-promo-card::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@:host*/.sc-duet-promo-card-h{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*/.sc-duet-promo-card-h:last-child,.sc-duet-promo-card-h:last-of-type{margin-right:0 !important}/*!@:host(.duet-m-0)*/.duet-m-0.sc-duet-promo-card-h{margin:0 !important}/*!@.duet-promo-card*/.duet-promo-card.sc-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(0, 41, 77);text-align:left;border-radius:20px}/*!@.duet-promo-card.duet-p-0*/.duet-promo-card.duet-p-0.sc-duet-promo-card{padding:0 !important}/*!@.duet-promo-card.duet-m-0*/.duet-promo-card.duet-m-0.sc-duet-promo-card{margin:0 !important}/*!@.duet-promo-card .content-wrapper*/.duet-promo-card.sc-duet-promo-card .content-wrapper.sc-duet-promo-card{display:flex;flex-direction:column;height:100%;color:inherit;text-decoration:none}/*!@.duet-promo-card .content-wrapper:focus*/.duet-promo-card.sc-duet-promo-card .content-wrapper.sc-duet-promo-card: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*/.duet-promo-card.sc-duet-promo-card .image.sc-duet-promo-card{position:relative;width:100%;overflow:hidden;border-top-left-radius:20px;border-top-right-radius:20px;object-fit:cover}/*!@.duet-promo-card .content*/.duet-promo-card.sc-duet-promo-card .content.sc-duet-promo-card{display:flex;flex-direction:column;flex-grow:1;gap:8px;padding:20px}@media (min-width: 36em){/*!@.duet-promo-card .content*/.duet-promo-card.sc-duet-promo-card .content.sc-duet-promo-card{padding:28px}}/*!@.duet-promo-card .action*/.duet-promo-card.sc-duet-promo-card .action.sc-duet-promo-card{display:flex;flex-grow:1;align-items:flex-end;padding-top:16px}/*!@.duet-promo-card.no-bg-color .content*/.duet-promo-card.no-bg-color.sc-duet-promo-card .content.sc-duet-promo-card{padding:20px 0 0}/*!@.duet-promo-card.no-bg-color .image*/.duet-promo-card.no-bg-color.sc-duet-promo-card .image.sc-duet-promo-card{border-radius:16px}/*!@.duet-promo-card.duet-theme-turva*/.duet-promo-card.duet-theme-turva.sc-duet-promo-card{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*/.duet-promo-card.duet-theme-turva.sc-duet-promo-card .content-wrapper.sc-duet-promo-card:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}/*!@.duet-promo-card-link*/.duet-promo-card-link.sc-duet-promo-card{transition:box-shadow 300ms ease}/*!@.duet-promo-card-link:hover*/.duet-promo-card-link.sc-duet-promo-card: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*/.duet-promo-card-link.sc-duet-promo-card: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)}";
 /**
  * @slot pre-heading - Slot for pre-heading content.
@@ -18718,13 +18753,17 @@ class DuetPromoCard {
      */
     componentWillLoad() {
         inheritGlobalTheme(this);
-        this.hasPreHeadingSlot = !!this.element.querySelector('[slot="pre-heading"]');
-        this.hasHeadingSlot = !!this.element.querySelector('[slot="heading"]');
-        this.hasDescriptionSlot = !!this.element.querySelector('[slot="description"]');
-        this.hasActionSlot = !!this.element.querySelector('[slot="action"]');
+        this.hasPreHeadingSlot = hasSlot(this.element, "pre-heading");
+        this.hasHeadingSlot = hasSlot(this.element, "heading");
+        this.hasDescriptionSlot = hasSlot(this.element, "description");
+        this.hasActionSlot = hasSlot(this.element, "action");
+        checkNamedSlotElement(this.element, "heading", "span");
+        checkNamedSlotElement(this.element, "description", "span");
     }
     /**
-     * Sets focus on underlying a element when url attribute is used.
+     * Sets focus on underlying a element.
+     * Available only when url attribute is used.
+     * Use this method instead of the native `focus()`.
      */
     async setFocus(options) {
         if (this.url && this.aOrDivElement) {
@@ -18745,7 +18784,8 @@ class DuetPromoCard {
                 "duet-promo-card": true,
                 "duet-theme-turva": this.theme === "turva",
                 "no-bg-color": !this.backgroundColor,
-            }, style: bannerStyles }, hAsync(TagName, { href: this.url, class: "content-wrapper", ref: element => (this.aOrDivElement = element) }, hAsync("img", { class: "image", src: this.image, alt: "", role: "presentation" }), hAsync("div", { class: "content" }, this.hasPreHeadingSlot && (hAsync("div", { class: "pre-heading" }, hAsync("slot", { name: "pre-heading" }))), this.hasHeadingSlot && (hAsync("div", { class: "heading" }, hAsync("duet-heading", { theme: this.theme, level: this.headingLevel, "visual-level": "h3", margin: "none", color: this.textColor }, hAsync("span", null, hAsync("slot", { name: "heading", onSlotchange: ev => slotElementCheck(ev, this, "span") }))))), this.hasDescriptionSlot && (hAsync("div", { class: "description" }, hAsync("duet-paragraph", { theme: this.theme, margin: "none", color: this.textColor }, hAsync("span", null, hAsync("slot", { name: "description", onSlotchange: ev => slotElementCheck(ev, this, "span") }))))), this.hasActionSlot && (hAsync("div", { class: "action" }, hAsync("slot", { name: "action" }))))))));
+                "duet-promo-card-link": !!this.url,
+            }, style: bannerStyles }, hAsync(TagName, { href: this.url, class: "content-wrapper", ref: element => (this.aOrDivElement = element) }, hAsync("img", { class: "image", src: this.image, alt: "", role: "presentation" }), hAsync("div", { class: "content" }, this.hasPreHeadingSlot && (hAsync("div", { class: "pre-heading" }, hAsync("slot", { name: "pre-heading" }))), this.hasHeadingSlot && (hAsync("div", { class: "heading" }, hAsync("duet-heading", { theme: this.theme, level: this.headingLevel, "visual-level": "h3", margin: "none", color: this.textColor }, hAsync("span", null, hAsync("slot", { name: "heading" }))))), this.hasDescriptionSlot && (hAsync("div", { class: "description" }, hAsync("duet-paragraph", { theme: this.theme, margin: "none", color: this.textColor }, hAsync("span", null, hAsync("slot", { name: "description" }))))), this.hasActionSlot && (hAsync("div", { class: "action" }, hAsync("slot", { name: "action" }))))))));
     }
     get element() { return getElement(this); }
     static get style() { return duetPromoCardCss; }
@@ -18972,6 +19012,7 @@ class DuetRadioGroup {
     }
     componentWillLoad() {
         inheritGlobalTheme(this);
+        checkNamedSlotElement(this.element, "tooltip", "duet-tooltip", 1, true);
     }
     /**
      * Local methods.
@@ -19710,6 +19751,7 @@ class DuetSelect {
     componentWillLoad() {
         inheritGlobalTheme(this);
         this.isCaptionVisible = !!this.caption;
+        checkNamedSlotElement(this.element, "tooltip", "duet-tooltip", 1, true);
         this.refresh();
     }
     /**
@@ -21846,6 +21888,7 @@ class DuetTextarea {
         inheritGlobalTheme(this);
         this.disallowedPatternChange();
         this.isCaptionVisible = !!this.caption;
+        checkNamedSlotElement(this.element, "tooltip", "duet-tooltip", 1, true);
         if (this.counter && this.maxlength == null) {
             console.warn("[DUET WARNING]: counter will only take effect if maxlength is set");
         }
@@ -22384,6 +22427,7 @@ class DuetTooltip {
      */
     componentWillLoad() {
         inheritGlobalTheme(this);
+        this.buttonActive = this.active;
     }
     async componentDidLoad() {
         {

package/lib/cjs/duet-action-button.cjs.entry.js CHANGED Viewed

@@ -5,7 +5,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-34b8e765.js');
+const index = require('./index-a515d5ff.js');
 const themeableComponent = require('./themeable-component-83a2a0d4.js');
 const createId = require('./create-id-1f8c438f.js');
 const jsUtils = require('./js-utils-92e24ba1.js');

package/lib/cjs/duet-alert.cjs.entry.js CHANGED Viewed

@@ -5,7 +5,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-34b8e765.js');
+const index = require('./index-a515d5ff.js');
 const themeableComponent = require('./themeable-component-83a2a0d4.js');
 const createId = require('./create-id-1f8c438f.js');
 const keyboardUtils = require('./keyboard-utils-66010749.js');

package/lib/cjs/duet-badge.cjs.entry.js CHANGED Viewed

@@ -5,7 +5,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-34b8e765.js');
+const index = require('./index-a515d5ff.js');
 const themeableComponent = require('./themeable-component-83a2a0d4.js');
 const duetBadgeCss = "*,*::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:inline-block;width:auto;vertical-align:middle}:host:last-child,:host:last-of-type{margin-right:0 !important}:host(.duet-m-0){margin:0 !important}.duet-badge{display:inline-block;width:100%;padding:4.4444444444px 12px 5.4444444444px;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.75rem;font-style:normal;font-weight:600;line-height:1.25;color:rgb(0, 41, 77);text-align:center;word-break:break-word;vertical-align:middle;background:#d9ebf4;border-radius:20rem}.duet-badge.duet-p-0{padding:0 !important}.duet-badge.duet-m-0{margin:0 !important}.duet-badge.duet-theme-turva{padding:5.4444444444px 12px 4.4444444444px;font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-weight:700;color:rgb(23, 28, 58);background:#e8e8eb}.duet-badge.warning{background:#fdecc9}.duet-badge.warning.duet-theme-turva{background:#fee8c3}.duet-badge.danger{background:#f8d3e0}.duet-badge.danger.duet-theme-turva{background:#f9d4cf}.duet-badge.success{background:#cce7de}.duet-badge.success.duet-theme-turva{background:#cee7dc}.duet-badge.subtle{color:rgb(101, 119, 135);background:none;outline:1px solid rgb(225, 227, 230);outline-offset:-1px}.duet-badge.subtle.duet-theme-turva{color:rgb(68, 68, 69);background:none;outline-color:rgb(228, 228, 230)}.duet-badge.background-strong.default{color:rgb(255, 255, 255);background:rgb(0, 119, 179)}.duet-badge.background-strong.default.duet-theme-turva{color:rgb(255, 255, 255);background:rgb(23, 28, 58)}.duet-badge.background-strong.warning{background:#f9c153}.duet-badge.background-strong.warning.duet-theme-turva{background:#fbb63f}.duet-badge.background-strong.danger{color:rgb(255, 255, 255);background:rgb(222, 35, 98)}.duet-badge.background-strong.danger.duet-theme-turva{color:rgb(255, 255, 255);background:rgb(224, 42, 13)}.duet-badge.background-strong.success{color:rgb(255, 255, 255);background:rgb(0, 135, 90)}.duet-badge.background-strong.success.duet-theme-turva{color:rgb(255, 255, 255);background:rgb(8, 135, 78)}.duet-badge.background-strong.subtle{border-color:rgb(207, 210, 212);outline-color:rgb(0, 41, 77)}.duet-badge.background-strong.subtle.duet-theme-turva{border-color:rgb(207, 207, 209);outline-color:rgb(23, 28, 58)}";

package/lib/cjs/duet-banner.cjs.entry.js CHANGED Viewed

@@ -5,9 +5,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-34b8e765.js');
+const index = require('./index-a515d5ff.js');
 const themeableComponent = require('./themeable-component-83a2a0d4.js');
-const slotUtils = require('./slot-utils-6c81bd09.js');
+const slotUtils = require('./slot-utils-0b8037ab.js');
 const stringUtils = require('./string-utils-053749ff.js');
 const tokenUtils = require('./token-utils-7a618677.js');
 require('./tokens.module-bc323a09.js');
@@ -41,9 +41,10 @@ const DuetBanner = class {
      */
     componentWillLoad() {
         themeableComponent.inheritGlobalTheme(this);
-        this.hasHeadingSlot = !!this.element.querySelector('[slot="heading"]');
-        this.hasDescriptionSlot = !!this.element.querySelector('[slot="description"]');
-        this.hasActionSlot = !!this.element.querySelector('[slot="action"]');
+        this.hasHeadingSlot = slotUtils.hasSlot(this.element, "heading");
+        this.hasDescriptionSlot = slotUtils.hasSlot(this.element, "description");
+        this.hasActionSlot = slotUtils.hasSlot(this.element, "action");
+        slotUtils.checkNamedSlotElement(this.element, "heading", "span");
     }
     /**
      * render() function
@@ -64,7 +65,7 @@ const DuetBanner = class {
                 "duet-banner": true,
                 "duet-theme-turva": this.theme === "turva",
                 [this.size]: true,
-            }, style: bannerStyles }, index.h("div", { class: "visual" }, index.h("div", { class: "image-container" }, this.image && index.h(DuetPicture, Object.assign({}, pictureSource))), this.icon && (index.h("duet-icon", { theme: this.theme, class: "icon", name: this.icon, shape: "brand", size: "xx-large", color: this.iconColor, background: this.iconBackgroundColor, "background-rotation": "7", "background-opacity": "0.85", margin: "none" }))), index.h("div", { class: "content" }, this.hasHeadingSlot && (index.h("div", { class: "heading" }, index.h("duet-heading", { theme: this.theme, level: this.headingLevel, "visual-level": "h2", margin: "none", color: this.textColor }, index.h("span", null, index.h("slot", { name: "heading", onSlotchange: ev => slotUtils.slotElementCheck(ev, this, "span") }))))), this.hasDescriptionSlot && (index.h("div", { class: "description", style: { color } }, index.h("slot", { name: "description" }))), this.hasActionSlot && (index.h("div", { class: "action" }, index.h("slot", { name: "action" })))))));
+            }, style: bannerStyles }, index.h("div", { class: "visual" }, index.h("div", { class: "image-container" }, this.image && index.h(DuetPicture, Object.assign({}, pictureSource))), this.icon && (index.h("duet-icon", { theme: this.theme, class: "icon", name: this.icon, shape: "brand", size: "xx-large", color: this.iconColor, background: this.iconBackgroundColor, "background-rotation": "7", "background-opacity": "0.85", margin: "none" }))), index.h("div", { class: "content" }, this.hasHeadingSlot && (index.h("div", { class: "heading" }, index.h("duet-heading", { theme: this.theme, level: this.headingLevel, "visual-level": "h2", margin: "none", color: this.textColor }, index.h("span", null, index.h("slot", { name: "heading" }))))), this.hasDescriptionSlot && (index.h("div", { class: "description", style: { color } }, index.h("slot", { name: "description" }))), this.hasActionSlot && (index.h("div", { class: "action" }, index.h("slot", { name: "action" })))))));
     }
     get element() { return index.getElement(this); }
 };

package/lib/cjs/duet-breadcrumb.cjs.entry.js CHANGED Viewed

@@ -5,7 +5,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-34b8e765.js');
+const index = require('./index-a515d5ff.js');
 const themeableComponent = require('./themeable-component-83a2a0d4.js');
 const keyboardUtils = require('./keyboard-utils-66010749.js');
 const languageUtils = require('./language-utils-e8a527e5.js');

package/lib/cjs/duet-breadcrumbs.cjs.entry.js CHANGED Viewed

@@ -5,7 +5,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-34b8e765.js');
+const index = require('./index-a515d5ff.js');
 const themeableComponent = require('./themeable-component-83a2a0d4.js');
 const languageUtils = require('./language-utils-e8a527e5.js');
 const tokenUtils = require('./token-utils-7a618677.js');