npm - @duetds/components - Versions diffs - 8.5.1 → 8.5.2 - Mend

@duetds/components 8.5.1 → 8.5.2

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 (617) hide show

package/hydrate/index.js CHANGED Viewed

@@ -11047,12 +11047,13 @@ class DuetCollapsible {
     }; }
 }
-const duetComboboxCss = ".sc-duet-combobox-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;position:relative;display:inline-block;width:100%;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(0, 41, 77)}.sc-duet-combobox-h a.sc-duet-combobox{color:rgb(0, 41, 77);transition:none}.duet-theme-turva.sc-duet-combobox-h{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(23, 28, 58)}.duet-theme-turva.sc-duet-combobox-h a.sc-duet-combobox{color:rgb(23, 28, 58)}.duet-theme-turva.sc-duet-combobox-h .duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.option.sc-duet-combobox .option-tags.sc-duet-combobox{color:rgb(116, 116, 117)}.duet-theme-turva.sc-duet-combobox-h .duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.option.selected.sc-duet-combobox{background:rgb(244, 207, 214)}.duet-theme-turva.sc-duet-combobox-h .duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.active.sc-duet-combobox,.duet-theme-turva.sc-duet-combobox-h .duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.sc-duet-combobox:focus,.duet-theme-turva.sc-duet-combobox-h .duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.sc-duet-combobox:hover{color:rgb(255, 255, 255);background:rgb(198, 12, 48)}.duet-theme-turva.sc-duet-combobox-h .duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.active.sc-duet-combobox .option-tags.sc-duet-combobox,.duet-theme-turva.sc-duet-combobox-h .duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.sc-duet-combobox:focus .option-tags.sc-duet-combobox,.duet-theme-turva.sc-duet-combobox-h .duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.sc-duet-combobox:hover .option-tags.sc-duet-combobox{color:rgb(255, 255, 255)}.duet-theme-turva.sc-duet-combobox-h .duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.active.sc-duet-combobox a.sc-duet-combobox,.duet-theme-turva.sc-duet-combobox-h .duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.sc-duet-combobox:focus a.sc-duet-combobox,.duet-theme-turva.sc-duet-combobox-h .duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.sc-duet-combobox:hover a.sc-duet-combobox{color:rgb(255, 255, 255)}.duet-combobox-list.sc-duet-combobox{position:absolute;top:calc(100% - 12px);height:0;overflow:hidden;background:rgb(255, 255, 255);border-radius:0 4px;box-shadow:0 2px 10px 0 rgba(0, 41, 77, 0.1);opacity:0}.duet-combobox-list.open.sc-duet-combobox{z-index:700;display:block;height:auto;opacity:1}.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox{max-height:200px;padding:0.75rem 0;margin:0;overflow-y:scroll;font-weight:600;list-style:none;cursor:pointer;scroll-behavior:smooth}.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.sc-duet-combobox{padding:4px 0}.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.sc-duet-combobox:not(.selected){padding-left:16px}.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.sc-duet-combobox:not(.selected) .highlight.sc-duet-combobox{text-decoration:underline}.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.option.sc-duet-combobox .option-link.sc-duet-combobox{display:block;width:100%}.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.option.sc-duet-combobox .option-tags.sc-duet-combobox{float:right;padding-right:0.875rem;font-weight:400;color:rgb(144, 149, 153)}.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.option-link.sc-duet-combobox{display:block;width:100%}.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.selected.sc-duet-combobox{padding-left:0;background:rgb(205, 229, 241)}.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.selected.option.sc-duet-combobox .option-icon.sc-duet-combobox{padding:0 8px 0 8px}.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.selected.option.sc-duet-combobox .option-tags.sc-duet-combobox{color:rgb(144, 149, 153)}.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.active.sc-duet-combobox,.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.sc-duet-combobox:focus,.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.sc-duet-combobox:hover{color:rgb(255, 255, 255);background:rgb(0, 119, 179)}.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.active.sc-duet-combobox .option-tags.sc-duet-combobox,.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.sc-duet-combobox:focus .option-tags.sc-duet-combobox,.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.sc-duet-combobox:hover .option-tags.sc-duet-combobox{color:rgb(255, 255, 255)}.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.active.sc-duet-combobox a.sc-duet-combobox,.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.sc-duet-combobox:focus a.sc-duet-combobox,.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.sc-duet-combobox:hover a.sc-duet-combobox{color:rgb(255, 255, 255)}";
+const duetComboboxCss = ".sc-duet-combobox-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;position:relative;display:inline-block;width:100%;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(0, 41, 77)}.sc-duet-combobox-h a.sc-duet-combobox{color:rgb(0, 41, 77);transition:none}.duet-theme-turva.sc-duet-combobox-h{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(23, 28, 58)}.duet-theme-turva.sc-duet-combobox-h a.sc-duet-combobox{color:rgb(23, 28, 58)}.duet-theme-turva.sc-duet-combobox-h .duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.option.sc-duet-combobox .option-tags.sc-duet-combobox{color:rgb(116, 116, 117)}.duet-theme-turva.sc-duet-combobox-h .duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.option.selected.sc-duet-combobox{background:rgb(244, 207, 214)}.duet-theme-turva.sc-duet-combobox-h .duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.active.sc-duet-combobox,.duet-theme-turva.sc-duet-combobox-h .duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.sc-duet-combobox:focus,.duet-theme-turva.sc-duet-combobox-h .duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.sc-duet-combobox:hover{color:rgb(255, 255, 255);background:rgb(198, 12, 48)}.duet-theme-turva.sc-duet-combobox-h .duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.active.sc-duet-combobox .option-tags.sc-duet-combobox,.duet-theme-turva.sc-duet-combobox-h .duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.sc-duet-combobox:focus .option-tags.sc-duet-combobox,.duet-theme-turva.sc-duet-combobox-h .duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.sc-duet-combobox:hover .option-tags.sc-duet-combobox{color:rgb(255, 255, 255)}.duet-theme-turva.sc-duet-combobox-h .duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.active.sc-duet-combobox a.sc-duet-combobox,.duet-theme-turva.sc-duet-combobox-h .duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.sc-duet-combobox:focus a.sc-duet-combobox,.duet-theme-turva.sc-duet-combobox-h .duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.sc-duet-combobox:hover a.sc-duet-combobox{color:rgb(255, 255, 255)}.duet-combobox-list.sc-duet-combobox{position:absolute;top:calc(100% - 12px);z-index:700;display:none;background:rgb(255, 255, 255);border-radius:0 4px;box-shadow:0 2px 10px 0 rgba(0, 41, 77, 0.1)}.duet-combobox-list.open.sc-duet-combobox{display:block}.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox{max-height:200px;padding:0.75rem 0;margin:0;overflow-y:scroll;font-weight:600;list-style:none;cursor:pointer;scroll-behavior:smooth}.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.sc-duet-combobox{padding:4px 0}.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.sc-duet-combobox:not(.selected){padding-left:16px}.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.sc-duet-combobox:not(.selected) .highlight.sc-duet-combobox{text-decoration:underline}.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.option.sc-duet-combobox .option-link.sc-duet-combobox{display:block;width:100%}.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.option.sc-duet-combobox .option-tags.sc-duet-combobox{float:right;padding-right:0.875rem;font-weight:400;color:rgb(144, 149, 153)}.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.option-link.sc-duet-combobox{display:block;width:100%}.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.selected.sc-duet-combobox{padding-left:0;background:rgb(205, 229, 241)}.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.selected.option.sc-duet-combobox .option-icon.sc-duet-combobox{padding:0 8px 0 8px}.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.selected.option.sc-duet-combobox .option-tags.sc-duet-combobox{color:rgb(144, 149, 153)}.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.active.sc-duet-combobox,.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.sc-duet-combobox:focus,.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.sc-duet-combobox:hover{color:rgb(255, 255, 255);background:rgb(0, 119, 179)}.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.active.sc-duet-combobox .option-tags.sc-duet-combobox,.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.sc-duet-combobox:focus .option-tags.sc-duet-combobox,.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.sc-duet-combobox:hover .option-tags.sc-duet-combobox{color:rgb(255, 255, 255)}.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.active.sc-duet-combobox a.sc-duet-combobox,.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.sc-duet-combobox:focus a.sc-duet-combobox,.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.sc-duet-combobox:hover a.sc-duet-combobox{color:rgb(255, 255, 255)}";
 class DuetCombobox {
     constructor(hostRef) {
         registerInstance(this, hostRef);
         this.duetChange = createEvent$2(this, "duetChange", 3);
+        this.listBoxId = createID("duet-combobox-list-element");
         this.resizeObserver = new ResizeObserver(debounce(entries => {
             var _a, _b;
             // otherwise, something is wrong, expecting 1 element only
@@ -11175,6 +11176,7 @@ class DuetCombobox {
         if (this.openListOnClick) {
             this.input.icon = this.listOpen ? "action-arrow-up" : "action-arrow-down";
         }
+        this.input.accessibleExpanded = this.listOpen ? "true" : "false";
     }
     /**
      * Component lifecycle events.
@@ -11279,13 +11281,20 @@ class DuetCombobox {
             this.activeItem = undefined;
             this.value = item[0].value;
         }
-        if (isBlurred && this.selectedItems.size === 0) {
-            //if nothing is selected and a user clicks outside, we want the input field to clearly illustrate that nothing was selected
-            if (this.force) {
-                this.inputValue = "";
-                this.input.value = "";
+        if (isBlurred) {
+            if (this.selectedItems.size === 0) {
+                this.activeItem = undefined;
+                if (this.force) {
+                    this.inputValue = "";
+                    this.input.value = "";
+                }
+            }
+            else if (this.force) {
+                const selectedValueIndex = [...this.selectedItems][0];
+                const selectedValueLabel = await this.formatItem(this.items[selectedValueIndex]);
+                this.inputValue = selectedValueLabel;
+                this.input.value = selectedValueLabel;
             }
-            this.activeItem = undefined;
         }
         this.listOpen = false;
     }
@@ -13984,7 +13993,7 @@ class DuetHero {
     }; }
 }
-const duetIconCss = "/*!@*,\n*::after,\n*::before*/*.sc-duet-icon,*.sc-duet-icon::after,*.sc-duet-icon::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@:host*/.sc-duet-icon-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-bottom:16px !important;display:inline-block;width:auto;max-width:100%;color:inherit;-webkit-tap-highlight-color:transparent}@media (max-width: 35.9375em){/*!@:host(.duet-icon-has-outline)*/.duet-icon-has-outline.sc-duet-icon-h{margin-bottom:0 !important}}@media (max-width: 35.9375em){/*!@:host(.duet-icon-has-background)*/.duet-icon-has-background.sc-duet-icon-h{margin-bottom:0 !important}}/*!@:host(.duet-m-0)*/.duet-m-0.sc-duet-icon-h{margin:0 !important}@media (max-width: 35.9375em){/*!@:host(.duet-m-0)*/.duet-m-0.sc-duet-icon-h{margin:0 !important}}/*!@.duet-icon*/.duet-icon.sc-duet-icon{-webkit-user-select:none;user-select:none;display:block;width:100%;height:100%;transform-origin:top center}/*!@.duet-icon.duet-icon-has-outline*/.duet-icon.duet-icon-has-outline.sc-duet-icon{padding:12px;border-style:solid;border-width:1px}@media (max-width: 35.9375em){/*!@.duet-icon.duet-icon-has-outline*/.duet-icon.duet-icon-has-outline.sc-duet-icon{outline:1px solid transparent;transform:scale(0.8)}}/*!@.duet-icon.duet-icon-has-background*/.duet-icon.duet-icon-has-background.sc-duet-icon{padding:16px;color:rgb(255, 255, 255)}@media (max-width: 35.9375em){/*!@.duet-icon.duet-icon-has-background*/.duet-icon.duet-icon-has-background.sc-duet-icon{outline:1px solid transparent;transform:scale(0.8)}}/*!@.duet-icon.duet-icon-has-background.duet-theme-turva, .duet-icon.duet-icon-has-background.duet-theme-default*/.duet-icon.duet-icon-has-background.duet-theme-turva.sc-duet-icon,.duet-icon.duet-icon-has-background.duet-theme-default.sc-duet-icon{color:rgb(255, 255, 255)}/*!@.duet-icon.duet-icon-shape-circle*/.duet-icon.duet-icon-shape-circle.sc-duet-icon{border-radius:50%}/*!@.duet-icon.duet-icon-shape-brand*/.duet-icon.duet-icon-shape-brand.sc-duet-icon{border-radius:25%}/*!@.duet-icon.duet-icon-has-background.xxx-small .duet-icon-svg, .duet-icon.duet-icon-has-outline.xxx-small .duet-icon-svg*/.duet-icon.duet-icon-has-background.xxx-small.sc-duet-icon .duet-icon-svg.sc-duet-icon,.duet-icon.duet-icon-has-outline.xxx-small.sc-duet-icon .duet-icon-svg.sc-duet-icon{width:10px;height:10px}/*!@.duet-icon.duet-icon-has-background.xx-small .duet-icon-svg, .duet-icon.duet-icon-has-outline.xx-small .duet-icon-svg*/.duet-icon.duet-icon-has-background.xx-small.sc-duet-icon .duet-icon-svg.sc-duet-icon,.duet-icon.duet-icon-has-outline.xx-small.sc-duet-icon .duet-icon-svg.sc-duet-icon{width:16px;height:16px}@media (max-width: 35.9375em){/*!@.duet-icon.duet-icon-not-responsive*/.duet-icon.duet-icon-not-responsive.sc-duet-icon{transform:scale(1) !important}}/*!@.duet-icon.duet-theme-default*/.duet-icon.duet-theme-default.sc-duet-icon{color:rgb(0, 119, 179)}/*!@.duet-icon.duet-theme-turva*/.duet-icon.duet-theme-turva.sc-duet-icon{color:rgb(198, 12, 48)}/*!@.duet-icon.auto .duet-icon-svg*/.duet-icon.auto.sc-duet-icon .duet-icon-svg.sc-duet-icon{width:100%;height:100%}/*!@.duet-icon.xxx-small .duet-icon-svg*/.duet-icon.xxx-small.sc-duet-icon .duet-icon-svg.sc-duet-icon{width:7px;height:7px}/*!@.duet-icon.duet-icon-has-background.xxx-small*/.duet-icon.duet-icon-has-background.xxx-small.sc-duet-icon{padding:6px}/*!@.duet-icon.duet-icon-has-outline.xxx-small*/.duet-icon.duet-icon-has-outline.xxx-small.sc-duet-icon{padding:4px}/*!@.duet-icon.xx-small .duet-icon-svg*/.duet-icon.xx-small.sc-duet-icon .duet-icon-svg.sc-duet-icon{width:10px;height:10px}/*!@.duet-icon.duet-icon-has-background.xx-small*/.duet-icon.duet-icon-has-background.xx-small.sc-duet-icon{padding:8px}/*!@.duet-icon.duet-icon-has-outline.xx-small*/.duet-icon.duet-icon-has-outline.xx-small.sc-duet-icon{padding:7px}/*!@.duet-icon.x-small .duet-icon-svg*/.duet-icon.x-small.sc-duet-icon .duet-icon-svg.sc-duet-icon{width:16px;height:16px}/*!@.duet-icon.duet-icon-has-outline.x-small*/.duet-icon.duet-icon-has-outline.x-small.sc-duet-icon{padding:10px}/*!@.duet-icon.duet-icon-has-background.x-small*/.duet-icon.duet-icon-has-background.x-small.sc-duet-icon{padding:12px}/*!@.duet-icon.small .duet-icon-svg*/.duet-icon.small.sc-duet-icon .duet-icon-svg.sc-duet-icon{width:20px;height:20px}/*!@.duet-icon.duet-icon-has-background.small*/.duet-icon.duet-icon-has-background.small.sc-duet-icon{padding:14px}/*!@.duet-icon.large .duet-icon-svg*/.duet-icon.large.sc-duet-icon .duet-icon-svg.sc-duet-icon{width:30px;height:30px}/*!@.duet-icon.x-large .duet-icon-svg*/.duet-icon.x-large.sc-duet-icon .duet-icon-svg.sc-duet-icon{width:36px;height:36px}/*!@.duet-icon.xx-large .duet-icon-svg*/.duet-icon.xx-large.sc-duet-icon .duet-icon-svg.sc-duet-icon{width:48px;height:48px}/*!@.duet-icon.xxx-large .duet-icon-svg*/.duet-icon.xxx-large.sc-duet-icon .duet-icon-svg.sc-duet-icon{width:48px;height:48px}@media (min-width: 48em){/*!@.duet-icon.xxx-large .duet-icon-svg*/.duet-icon.xxx-large.sc-duet-icon .duet-icon-svg.sc-duet-icon{width:72px;height:72px}}/*!@.duet-icon.duet-icon-shape-brand.rotated*/.duet-icon.duet-icon-shape-brand.rotated.sc-duet-icon{transform:rotate(20deg) scale(0.875);transform-origin:center}/*!@.duet-icon.duet-icon-shape-brand.duet-theme-turva*/.duet-icon.duet-icon-shape-brand.duet-theme-turva.sc-duet-icon{display:flex;align-items:center;justify-content:center;-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 144 130' fill='currentColor' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M67.4002 0.00277722C71.354 0.0260204 75.7751 0.261773 80.1626 0.90262C83.3916 1.37412 86.6046 1.97513 89.824 2.51802C91.5585 2.81022 93.3026 3.05925 95.0291 3.3996C102.623 4.89215 109.884 7.35924 116.592 11.4152C122.597 15.0478 127.726 19.7163 131.919 25.4756C135.024 29.7374 137.515 34.3662 139.4 39.3319C140.317 41.7459 141.075 44.2262 141.854 46.695C142.021 47.2196 141.984 47.8157 142.021 48.3801C142.354 53.5833 142.664 58.7864 143.018 63.9879C143.237 67.2021 143.528 70.4097 143.768 73.6206C144.067 77.5985 144.095 81.578 143.746 85.5576C143.501 88.3567 143.106 91.1293 142.437 93.8537C141.117 99.2395 138.941 104.207 135.603 108.58C132.414 112.759 128.49 116.036 123.975 118.561C120.429 120.544 116.702 122.058 112.824 123.175C109.121 124.241 105.361 125.011 101.548 125.493C100.916 125.572 100.351 125.768 99.783 126.074C98.1525 126.95 96.3956 127.47 94.6163 127.912C91.4225 128.705 88.1775 129.168 84.9149 129.495C83.0572 129.681 81.1978 129.838 79.3385 129.995C79.1337 130.012 78.9097 129.985 78.7161 129.916C76.2087 129.009 73.6566 128.255 71.0356 127.825C68.8547 127.467 66.6529 127.135 64.4512 127.047C58.4156 126.809 52.54 125.717 46.7989 123.809C40.8193 121.822 35.1245 119.181 29.8458 115.634C24.3911 111.97 19.5668 107.566 15.4705 102.313C10.9582 96.5267 7.406 90.1597 4.73864 83.2598C2.95772 78.6544 1.67604 73.8978 0.898394 68.9935C0.328759 65.3975 0.0183391 61.7798 0.000737963 58.1373C-0.0120628 55.3132 0.141547 52.4992 0.471168 49.6934C0.867992 46.3131 1.46643 42.9728 2.35449 39.6955C2.6121 38.7458 3.02813 37.8327 3.44735 36.9395C4.105 35.5366 4.70343 34.0773 5.54829 32.8006C7.15959 30.3683 8.51487 27.8182 9.53734 25.0705C9.60134 24.8962 9.71655 24.7302 9.84136 24.5957C12.1119 22.1535 14.5201 19.8674 17.0514 17.7191C23.9622 11.8551 31.6315 7.39743 40.0769 4.39076C44.0019 2.99285 48.023 1.97015 52.1144 1.24795C56.6011 0.45934 62.4495 -0.0420489 67.4002 0.00277722Z' /%3E%3C/svg%3E\");-webkit-mask-repeat:no-repeat;mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 144 130' fill='currentColor' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M67.4002 0.00277722C71.354 0.0260204 75.7751 0.261773 80.1626 0.90262C83.3916 1.37412 86.6046 1.97513 89.824 2.51802C91.5585 2.81022 93.3026 3.05925 95.0291 3.3996C102.623 4.89215 109.884 7.35924 116.592 11.4152C122.597 15.0478 127.726 19.7163 131.919 25.4756C135.024 29.7374 137.515 34.3662 139.4 39.3319C140.317 41.7459 141.075 44.2262 141.854 46.695C142.021 47.2196 141.984 47.8157 142.021 48.3801C142.354 53.5833 142.664 58.7864 143.018 63.9879C143.237 67.2021 143.528 70.4097 143.768 73.6206C144.067 77.5985 144.095 81.578 143.746 85.5576C143.501 88.3567 143.106 91.1293 142.437 93.8537C141.117 99.2395 138.941 104.207 135.603 108.58C132.414 112.759 128.49 116.036 123.975 118.561C120.429 120.544 116.702 122.058 112.824 123.175C109.121 124.241 105.361 125.011 101.548 125.493C100.916 125.572 100.351 125.768 99.783 126.074C98.1525 126.95 96.3956 127.47 94.6163 127.912C91.4225 128.705 88.1775 129.168 84.9149 129.495C83.0572 129.681 81.1978 129.838 79.3385 129.995C79.1337 130.012 78.9097 129.985 78.7161 129.916C76.2087 129.009 73.6566 128.255 71.0356 127.825C68.8547 127.467 66.6529 127.135 64.4512 127.047C58.4156 126.809 52.54 125.717 46.7989 123.809C40.8193 121.822 35.1245 119.181 29.8458 115.634C24.3911 111.97 19.5668 107.566 15.4705 102.313C10.9582 96.5267 7.406 90.1597 4.73864 83.2598C2.95772 78.6544 1.67604 73.8978 0.898394 68.9935C0.328759 65.3975 0.0183391 61.7798 0.000737963 58.1373C-0.0120628 55.3132 0.141547 52.4992 0.471168 49.6934C0.867992 46.3131 1.46643 42.9728 2.35449 39.6955C2.6121 38.7458 3.02813 37.8327 3.44735 36.9395C4.105 35.5366 4.70343 34.0773 5.54829 32.8006C7.15959 30.3683 8.51487 27.8182 9.53734 25.0705C9.60134 24.8962 9.71655 24.7302 9.84136 24.5957C12.1119 22.1535 14.5201 19.8674 17.0514 17.7191C23.9622 11.8551 31.6315 7.39743 40.0769 4.39076C44.0019 2.99285 48.023 1.97015 52.1144 1.24795C56.6011 0.45934 62.4495 -0.0420489 67.4002 0.00277722Z' /%3E%3C/svg%3E\");mask-repeat:no-repeat}/*!@.duet-icon.duet-icon-shape-brand.duet-theme-turva .duet-icon-svg*/.duet-icon.duet-icon-shape-brand.duet-theme-turva.sc-duet-icon .duet-icon-svg.sc-duet-icon{min-width:auto}/*!@.duet-icon.duet-icon-shape-brand.duet-theme-turva.xx-small*/.duet-icon.duet-icon-shape-brand.duet-theme-turva.xx-small.sc-duet-icon{width:18px;height:15px;padding:0}/*!@.duet-icon.duet-icon-shape-brand.duet-theme-turva.x-small*/.duet-icon.duet-icon-shape-brand.duet-theme-turva.x-small.sc-duet-icon{width:32px;height:30px;padding:0}/*!@.duet-icon.duet-icon-shape-brand.duet-theme-turva.small*/.duet-icon.duet-icon-shape-brand.duet-theme-turva.small.sc-duet-icon{width:36px;height:34px;padding:0}/*!@.duet-icon.duet-icon-shape-brand.duet-theme-turva.medium*/.duet-icon.duet-icon-shape-brand.duet-theme-turva.medium.sc-duet-icon{width:48px;height:44px;padding:0}/*!@.duet-icon.duet-icon-shape-brand.duet-theme-turva.large*/.duet-icon.duet-icon-shape-brand.duet-theme-turva.large.sc-duet-icon{width:62px;height:56px;padding:0}/*!@.duet-icon.duet-icon-shape-brand.duet-theme-turva.x-large*/.duet-icon.duet-icon-shape-brand.duet-theme-turva.x-large.sc-duet-icon{width:76px;height:68px;padding:0}/*!@.duet-icon.duet-icon-shape-brand.duet-theme-turva.xx-large*/.duet-icon.duet-icon-shape-brand.duet-theme-turva.xx-large.sc-duet-icon{width:95px;height:86px;padding:0}/*!@.duet-icon.duet-icon-shape-brand.duet-theme-turva.xxx-large*/.duet-icon.duet-icon-shape-brand.duet-theme-turva.xxx-large.sc-duet-icon{width:144px;height:130px;padding:0}/*!@.duet-icon.duet-icon-shape-brand.xxx-small*/.duet-icon.duet-icon-shape-brand.xxx-small.sc-duet-icon{padding:0}/*!@.duet-icon.duet-icon-shape-brand.xxx-small .duet-icon-svg*/.duet-icon.duet-icon-shape-brand.xxx-small.sc-duet-icon .duet-icon-svg.sc-duet-icon{width:0;height:0}/*!@.duet-icon.duet-icon-shape-brand.xx-small*/.duet-icon.duet-icon-shape-brand.xx-small.sc-duet-icon{padding:4px}/*!@.duet-icon.duet-icon-shape-brand.xx-small .duet-icon-svg*/.duet-icon.duet-icon-shape-brand.xx-small.sc-duet-icon .duet-icon-svg.sc-duet-icon{width:10px;height:10px}/*!@.duet-icon.duet-icon-shape-brand.x-small*/.duet-icon.duet-icon-shape-brand.x-small.sc-duet-icon{padding:8px}/*!@.duet-icon.duet-icon-shape-brand.x-small .duet-icon-svg*/.duet-icon.duet-icon-shape-brand.x-small.sc-duet-icon .duet-icon-svg.sc-duet-icon{width:16px;height:16px}/*!@.duet-icon.duet-icon-shape-brand.small*/.duet-icon.duet-icon-shape-brand.small.sc-duet-icon{padding:8px}/*!@.duet-icon.duet-icon-shape-brand.small .duet-icon-svg*/.duet-icon.duet-icon-shape-brand.small.sc-duet-icon .duet-icon-svg.sc-duet-icon{width:20px;height:20px}/*!@.duet-icon.duet-icon-shape-brand.medium*/.duet-icon.duet-icon-shape-brand.medium.sc-duet-icon{padding:12px}/*!@.duet-icon.duet-icon-shape-brand.medium .duet-icon-svg*/.duet-icon.duet-icon-shape-brand.medium.sc-duet-icon .duet-icon-svg.sc-duet-icon{width:24px;height:24px}/*!@.duet-icon.duet-icon-shape-brand.large*/.duet-icon.duet-icon-shape-brand.large.sc-duet-icon{padding:16px}/*!@.duet-icon.duet-icon-shape-brand.large .duet-icon-svg*/.duet-icon.duet-icon-shape-brand.large.sc-duet-icon .duet-icon-svg.sc-duet-icon{width:30px;height:30px}/*!@.duet-icon.duet-icon-shape-brand.x-large*/.duet-icon.duet-icon-shape-brand.x-large.sc-duet-icon{padding:20px}/*!@.duet-icon.duet-icon-shape-brand.x-large .duet-icon-svg*/.duet-icon.duet-icon-shape-brand.x-large.sc-duet-icon .duet-icon-svg.sc-duet-icon{width:36px;height:36px}/*!@.duet-icon.duet-icon-shape-brand.xx-large*/.duet-icon.duet-icon-shape-brand.xx-large.sc-duet-icon{padding:24px}/*!@.duet-icon.duet-icon-shape-brand.xx-large .duet-icon-svg*/.duet-icon.duet-icon-shape-brand.xx-large.sc-duet-icon .duet-icon-svg.sc-duet-icon{width:48px;height:48px}/*!@.duet-icon.duet-icon-shape-brand.xxx-large*/.duet-icon.duet-icon-shape-brand.xxx-large.sc-duet-icon{padding:36px}/*!@.duet-icon.duet-icon-shape-brand.xxx-large .duet-icon-svg*/.duet-icon.duet-icon-shape-brand.xxx-large.sc-duet-icon .duet-icon-svg.sc-duet-icon{width:72px;height:72px}/*!@.duet-icon .duet-icon-svg*/.duet-icon.sc-duet-icon .duet-icon-svg.sc-duet-icon{display:block;width:24px;min-width:100%;height:24px;font-size:0}/*!@.duet-icon .duet-icon-svg.rotated*/.duet-icon.sc-duet-icon .duet-icon-svg.rotated.sc-duet-icon{transform:rotate(-20deg) scale(1.14)}/*!@.duet-icon svg*/.duet-icon.sc-duet-icon svg.sc-duet-icon{width:100%;min-width:100%;fill:currentColor}";
+const duetIconCss = "/*!@*,\n*::after,\n*::before*/*.sc-duet-icon,*.sc-duet-icon::after,*.sc-duet-icon::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@:host*/.sc-duet-icon-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-bottom:16px !important;display:inline-block;width:auto;max-width:100%;color:inherit;-webkit-tap-highlight-color:transparent}@media (max-width: 35.9375em){/*!@:host(.duet-icon-has-outline)*/.duet-icon-has-outline.sc-duet-icon-h{margin-bottom:0 !important}}@media (max-width: 35.9375em){/*!@:host(.duet-icon-has-background)*/.duet-icon-has-background.sc-duet-icon-h{margin-bottom:0 !important}}/*!@:host(.duet-m-0)*/.duet-m-0.sc-duet-icon-h{margin:0 !important}@media (max-width: 35.9375em){/*!@:host(.duet-m-0)*/.duet-m-0.sc-duet-icon-h{margin:0 !important}}/*!@.duet-icon*/.duet-icon.sc-duet-icon{-webkit-user-select:none;user-select:none;display:block;width:100%;height:100%;transform-origin:top center}/*!@.duet-icon.duet-icon-has-outline*/.duet-icon.duet-icon-has-outline.sc-duet-icon{padding:12px;border-style:solid;border-width:1px}@media (max-width: 35.9375em){/*!@.duet-icon.duet-icon-has-outline*/.duet-icon.duet-icon-has-outline.sc-duet-icon{outline:1px solid transparent;transform:scale(0.8)}}/*!@.duet-icon.duet-icon-has-background*/.duet-icon.duet-icon-has-background.sc-duet-icon{padding:16px;color:rgb(255, 255, 255)}@media (max-width: 35.9375em){/*!@.duet-icon.duet-icon-has-background*/.duet-icon.duet-icon-has-background.sc-duet-icon{outline:1px solid transparent;transform:scale(0.8)}}/*!@.duet-icon.duet-icon-has-background.duet-theme-turva, .duet-icon.duet-icon-has-background.duet-theme-default*/.duet-icon.duet-icon-has-background.duet-theme-turva.sc-duet-icon,.duet-icon.duet-icon-has-background.duet-theme-default.sc-duet-icon{color:rgb(255, 255, 255)}/*!@.duet-icon.duet-icon-shape-circle*/.duet-icon.duet-icon-shape-circle.sc-duet-icon{border-radius:50%}/*!@.duet-icon.duet-icon-shape-brand*/.duet-icon.duet-icon-shape-brand.sc-duet-icon{border-radius:25%}/*!@.duet-icon.duet-icon-has-background.xxx-small .duet-icon-svg, .duet-icon.duet-icon-has-outline.xxx-small .duet-icon-svg*/.duet-icon.duet-icon-has-background.xxx-small.sc-duet-icon .duet-icon-svg.sc-duet-icon,.duet-icon.duet-icon-has-outline.xxx-small.sc-duet-icon .duet-icon-svg.sc-duet-icon{width:10px;height:10px}/*!@.duet-icon.duet-icon-has-background.xx-small .duet-icon-svg, .duet-icon.duet-icon-has-outline.xx-small .duet-icon-svg*/.duet-icon.duet-icon-has-background.xx-small.sc-duet-icon .duet-icon-svg.sc-duet-icon,.duet-icon.duet-icon-has-outline.xx-small.sc-duet-icon .duet-icon-svg.sc-duet-icon{width:16px;height:16px}@media (max-width: 35.9375em){/*!@.duet-icon.duet-icon-not-responsive*/.duet-icon.duet-icon-not-responsive.sc-duet-icon{transform:scale(1) !important}}/*!@.duet-icon.duet-theme-default*/.duet-icon.duet-theme-default.sc-duet-icon{color:rgb(0, 119, 179)}/*!@.duet-icon.duet-theme-turva*/.duet-icon.duet-theme-turva.sc-duet-icon{color:rgb(198, 12, 48)}/*!@.duet-icon.auto .duet-icon-svg*/.duet-icon.auto.sc-duet-icon .duet-icon-svg.sc-duet-icon{width:100%;height:100%}/*!@.duet-icon.xxx-small .duet-icon-svg*/.duet-icon.xxx-small.sc-duet-icon .duet-icon-svg.sc-duet-icon{width:7px;height:7px}/*!@.duet-icon.duet-icon-has-background.xxx-small*/.duet-icon.duet-icon-has-background.xxx-small.sc-duet-icon{padding:6px}/*!@.duet-icon.duet-icon-has-outline.xxx-small*/.duet-icon.duet-icon-has-outline.xxx-small.sc-duet-icon{padding:4px}/*!@.duet-icon.xx-small .duet-icon-svg*/.duet-icon.xx-small.sc-duet-icon .duet-icon-svg.sc-duet-icon{width:10px;height:10px}/*!@.duet-icon.duet-icon-has-background.xx-small*/.duet-icon.duet-icon-has-background.xx-small.sc-duet-icon{padding:8px}/*!@.duet-icon.duet-icon-has-outline.xx-small*/.duet-icon.duet-icon-has-outline.xx-small.sc-duet-icon{padding:7px}/*!@.duet-icon.x-small .duet-icon-svg*/.duet-icon.x-small.sc-duet-icon .duet-icon-svg.sc-duet-icon{width:16px;height:16px}/*!@.duet-icon.duet-icon-has-outline.x-small*/.duet-icon.duet-icon-has-outline.x-small.sc-duet-icon{padding:10px}/*!@.duet-icon.duet-icon-has-background.x-small*/.duet-icon.duet-icon-has-background.x-small.sc-duet-icon{padding:12px}/*!@.duet-icon.small .duet-icon-svg*/.duet-icon.small.sc-duet-icon .duet-icon-svg.sc-duet-icon{width:20px;height:20px}/*!@.duet-icon.duet-icon-has-background.small*/.duet-icon.duet-icon-has-background.small.sc-duet-icon{padding:14px}/*!@.duet-icon.large .duet-icon-svg*/.duet-icon.large.sc-duet-icon .duet-icon-svg.sc-duet-icon{width:30px;height:30px}/*!@.duet-icon.x-large .duet-icon-svg*/.duet-icon.x-large.sc-duet-icon .duet-icon-svg.sc-duet-icon{width:36px;height:36px}/*!@.duet-icon.xx-large .duet-icon-svg*/.duet-icon.xx-large.sc-duet-icon .duet-icon-svg.sc-duet-icon{width:48px;height:48px}/*!@.duet-icon.xxx-large .duet-icon-svg*/.duet-icon.xxx-large.sc-duet-icon .duet-icon-svg.sc-duet-icon{width:48px;height:48px}@media (min-width: 48em){/*!@.duet-icon.xxx-large .duet-icon-svg*/.duet-icon.xxx-large.sc-duet-icon .duet-icon-svg.sc-duet-icon{width:72px;height:72px}}/*!@.duet-icon.duet-icon-shape-brand.rotated*/.duet-icon.duet-icon-shape-brand.rotated.sc-duet-icon{transform:rotate(20deg) scale(0.875);transform-origin:center}/*!@.duet-icon.duet-icon-shape-brand.duet-theme-turva*/.duet-icon.duet-icon-shape-brand.duet-theme-turva.sc-duet-icon{display:flex;align-items:center;justify-content:center;-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 144 130' fill='currentColor' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M67.4002 0.00277722C71.354 0.0260204 75.7751 0.261773 80.1626 0.90262C83.3916 1.37412 86.6046 1.97513 89.824 2.51802C91.5585 2.81022 93.3026 3.05925 95.0291 3.3996C102.623 4.89215 109.884 7.35924 116.592 11.4152C122.597 15.0478 127.726 19.7163 131.919 25.4756C135.024 29.7374 137.515 34.3662 139.4 39.3319C140.317 41.7459 141.075 44.2262 141.854 46.695C142.021 47.2196 141.984 47.8157 142.021 48.3801C142.354 53.5833 142.664 58.7864 143.018 63.9879C143.237 67.2021 143.528 70.4097 143.768 73.6206C144.067 77.5985 144.095 81.578 143.746 85.5576C143.501 88.3567 143.106 91.1293 142.437 93.8537C141.117 99.2395 138.941 104.207 135.603 108.58C132.414 112.759 128.49 116.036 123.975 118.561C120.429 120.544 116.702 122.058 112.824 123.175C109.121 124.241 105.361 125.011 101.548 125.493C100.916 125.572 100.351 125.768 99.783 126.074C98.1525 126.95 96.3956 127.47 94.6163 127.912C91.4225 128.705 88.1775 129.168 84.9149 129.495C83.0572 129.681 81.1978 129.838 79.3385 129.995C79.1337 130.012 78.9097 129.985 78.7161 129.916C76.2087 129.009 73.6566 128.255 71.0356 127.825C68.8547 127.467 66.6529 127.135 64.4512 127.047C58.4156 126.809 52.54 125.717 46.7989 123.809C40.8193 121.822 35.1245 119.181 29.8458 115.634C24.3911 111.97 19.5668 107.566 15.4705 102.313C10.9582 96.5267 7.406 90.1597 4.73864 83.2598C2.95772 78.6544 1.67604 73.8978 0.898394 68.9935C0.328759 65.3975 0.0183391 61.7798 0.000737963 58.1373C-0.0120628 55.3132 0.141547 52.4992 0.471168 49.6934C0.867992 46.3131 1.46643 42.9728 2.35449 39.6955C2.6121 38.7458 3.02813 37.8327 3.44735 36.9395C4.105 35.5366 4.70343 34.0773 5.54829 32.8006C7.15959 30.3683 8.51487 27.8182 9.53734 25.0705C9.60134 24.8962 9.71655 24.7302 9.84136 24.5957C12.1119 22.1535 14.5201 19.8674 17.0514 17.7191C23.9622 11.8551 31.6315 7.39743 40.0769 4.39076C44.0019 2.99285 48.023 1.97015 52.1144 1.24795C56.6011 0.45934 62.4495 -0.0420489 67.4002 0.00277722Z' /%3E%3C/svg%3E\");-webkit-mask-repeat:no-repeat;mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 144 130' fill='currentColor' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M67.4002 0.00277722C71.354 0.0260204 75.7751 0.261773 80.1626 0.90262C83.3916 1.37412 86.6046 1.97513 89.824 2.51802C91.5585 2.81022 93.3026 3.05925 95.0291 3.3996C102.623 4.89215 109.884 7.35924 116.592 11.4152C122.597 15.0478 127.726 19.7163 131.919 25.4756C135.024 29.7374 137.515 34.3662 139.4 39.3319C140.317 41.7459 141.075 44.2262 141.854 46.695C142.021 47.2196 141.984 47.8157 142.021 48.3801C142.354 53.5833 142.664 58.7864 143.018 63.9879C143.237 67.2021 143.528 70.4097 143.768 73.6206C144.067 77.5985 144.095 81.578 143.746 85.5576C143.501 88.3567 143.106 91.1293 142.437 93.8537C141.117 99.2395 138.941 104.207 135.603 108.58C132.414 112.759 128.49 116.036 123.975 118.561C120.429 120.544 116.702 122.058 112.824 123.175C109.121 124.241 105.361 125.011 101.548 125.493C100.916 125.572 100.351 125.768 99.783 126.074C98.1525 126.95 96.3956 127.47 94.6163 127.912C91.4225 128.705 88.1775 129.168 84.9149 129.495C83.0572 129.681 81.1978 129.838 79.3385 129.995C79.1337 130.012 78.9097 129.985 78.7161 129.916C76.2087 129.009 73.6566 128.255 71.0356 127.825C68.8547 127.467 66.6529 127.135 64.4512 127.047C58.4156 126.809 52.54 125.717 46.7989 123.809C40.8193 121.822 35.1245 119.181 29.8458 115.634C24.3911 111.97 19.5668 107.566 15.4705 102.313C10.9582 96.5267 7.406 90.1597 4.73864 83.2598C2.95772 78.6544 1.67604 73.8978 0.898394 68.9935C0.328759 65.3975 0.0183391 61.7798 0.000737963 58.1373C-0.0120628 55.3132 0.141547 52.4992 0.471168 49.6934C0.867992 46.3131 1.46643 42.9728 2.35449 39.6955C2.6121 38.7458 3.02813 37.8327 3.44735 36.9395C4.105 35.5366 4.70343 34.0773 5.54829 32.8006C7.15959 30.3683 8.51487 27.8182 9.53734 25.0705C9.60134 24.8962 9.71655 24.7302 9.84136 24.5957C12.1119 22.1535 14.5201 19.8674 17.0514 17.7191C23.9622 11.8551 31.6315 7.39743 40.0769 4.39076C44.0019 2.99285 48.023 1.97015 52.1144 1.24795C56.6011 0.45934 62.4495 -0.0420489 67.4002 0.00277722Z' /%3E%3C/svg%3E\");mask-repeat:no-repeat}/*!@.duet-icon.duet-icon-shape-brand.duet-theme-turva .duet-icon-svg*/.duet-icon.duet-icon-shape-brand.duet-theme-turva.sc-duet-icon .duet-icon-svg.sc-duet-icon{min-width:auto}/*!@.duet-icon.duet-icon-shape-brand.duet-theme-turva.xx-small*/.duet-icon.duet-icon-shape-brand.duet-theme-turva.xx-small.sc-duet-icon{width:18px;height:15px;padding:0}/*!@.duet-icon.duet-icon-shape-brand.duet-theme-turva.x-small*/.duet-icon.duet-icon-shape-brand.duet-theme-turva.x-small.sc-duet-icon{width:32px;height:30px;padding:0}/*!@.duet-icon.duet-icon-shape-brand.duet-theme-turva.small*/.duet-icon.duet-icon-shape-brand.duet-theme-turva.small.sc-duet-icon{width:36px;height:34px;padding:0}/*!@.duet-icon.duet-icon-shape-brand.duet-theme-turva.medium*/.duet-icon.duet-icon-shape-brand.duet-theme-turva.medium.sc-duet-icon{width:48px;height:44px;padding:0}/*!@.duet-icon.duet-icon-shape-brand.duet-theme-turva.large*/.duet-icon.duet-icon-shape-brand.duet-theme-turva.large.sc-duet-icon{width:62px;height:56px;padding:0}/*!@.duet-icon.duet-icon-shape-brand.duet-theme-turva.x-large*/.duet-icon.duet-icon-shape-brand.duet-theme-turva.x-large.sc-duet-icon{width:76px;height:68px;padding:0}/*!@.duet-icon.duet-icon-shape-brand.duet-theme-turva.xx-large*/.duet-icon.duet-icon-shape-brand.duet-theme-turva.xx-large.sc-duet-icon{width:95px;height:86px;padding:0}/*!@.duet-icon.duet-icon-shape-brand.duet-theme-turva.xxx-large*/.duet-icon.duet-icon-shape-brand.duet-theme-turva.xxx-large.sc-duet-icon{width:144px;height:130px;padding:0}/*!@.duet-icon.duet-icon-shape-brand.xxx-small*/.duet-icon.duet-icon-shape-brand.xxx-small.sc-duet-icon{padding:0}/*!@.duet-icon.duet-icon-shape-brand.xxx-small .duet-icon-svg*/.duet-icon.duet-icon-shape-brand.xxx-small.sc-duet-icon .duet-icon-svg.sc-duet-icon{width:0;height:0}/*!@.duet-icon.duet-icon-shape-brand.xx-small*/.duet-icon.duet-icon-shape-brand.xx-small.sc-duet-icon{padding:4px}/*!@.duet-icon.duet-icon-shape-brand.xx-small .duet-icon-svg*/.duet-icon.duet-icon-shape-brand.xx-small.sc-duet-icon .duet-icon-svg.sc-duet-icon{width:10px;height:10px}/*!@.duet-icon.duet-icon-shape-brand.x-small*/.duet-icon.duet-icon-shape-brand.x-small.sc-duet-icon{padding:8px}/*!@.duet-icon.duet-icon-shape-brand.x-small .duet-icon-svg*/.duet-icon.duet-icon-shape-brand.x-small.sc-duet-icon .duet-icon-svg.sc-duet-icon{width:16px;height:16px}/*!@.duet-icon.duet-icon-shape-brand.small*/.duet-icon.duet-icon-shape-brand.small.sc-duet-icon{padding:8px}/*!@.duet-icon.duet-icon-shape-brand.small .duet-icon-svg*/.duet-icon.duet-icon-shape-brand.small.sc-duet-icon .duet-icon-svg.sc-duet-icon{width:20px;height:20px}/*!@.duet-icon.duet-icon-shape-brand.medium*/.duet-icon.duet-icon-shape-brand.medium.sc-duet-icon{padding:12px}/*!@.duet-icon.duet-icon-shape-brand.medium .duet-icon-svg*/.duet-icon.duet-icon-shape-brand.medium.sc-duet-icon .duet-icon-svg.sc-duet-icon{width:24px;height:24px}/*!@.duet-icon.duet-icon-shape-brand.large*/.duet-icon.duet-icon-shape-brand.large.sc-duet-icon{padding:16px}/*!@.duet-icon.duet-icon-shape-brand.large .duet-icon-svg*/.duet-icon.duet-icon-shape-brand.large.sc-duet-icon .duet-icon-svg.sc-duet-icon{width:30px;height:30px}/*!@.duet-icon.duet-icon-shape-brand.x-large*/.duet-icon.duet-icon-shape-brand.x-large.sc-duet-icon{padding:20px}/*!@.duet-icon.duet-icon-shape-brand.x-large .duet-icon-svg*/.duet-icon.duet-icon-shape-brand.x-large.sc-duet-icon .duet-icon-svg.sc-duet-icon{width:36px;height:36px}/*!@.duet-icon.duet-icon-shape-brand.xx-large*/.duet-icon.duet-icon-shape-brand.xx-large.sc-duet-icon{padding:24px}/*!@.duet-icon.duet-icon-shape-brand.xx-large .duet-icon-svg*/.duet-icon.duet-icon-shape-brand.xx-large.sc-duet-icon .duet-icon-svg.sc-duet-icon{width:48px;height:48px}/*!@.duet-icon.duet-icon-shape-brand.xxx-large*/.duet-icon.duet-icon-shape-brand.xxx-large.sc-duet-icon{padding:36px}/*!@.duet-icon.duet-icon-shape-brand.xxx-large .duet-icon-svg*/.duet-icon.duet-icon-shape-brand.xxx-large.sc-duet-icon .duet-icon-svg.sc-duet-icon{width:72px;height:72px}/*!@.duet-icon .duet-icon-svg*/.duet-icon.sc-duet-icon .duet-icon-svg.sc-duet-icon{display:block;width:24px;min-width:100%;height:24px;font-size:0}/*!@.duet-icon .duet-icon-svg.rotated*/.duet-icon.sc-duet-icon .duet-icon-svg.rotated.sc-duet-icon{transform:rotate(-20deg) scale(1.14)}/*!@.duet-icon svg*/.duet-icon.sc-duet-icon svg.sc-duet-icon{width:100%;min-width:100%;overflow:clip;fill:currentColor;overflow-clip-margin:1px}";
 class DuetIcon {
     constructor(hostRef) {
@@ -14614,7 +14623,7 @@ class DuetLayout {
     }; }
 }
-const duetLinkCss = "/*!@*,\n*::after,\n*::before*/*.sc-duet-link,*.sc-duet-link::after,*.sc-duet-link::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@:host*/.sc-duet-link-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;display:inline}/*!@:host(.duet-link-block)*/.duet-link-block.sc-duet-link-h{display:block}/*!@:host(.duet-link-button)*/.duet-link-button.sc-duet-link-h{margin-right:8px !important;margin-bottom:12px !important;display:inline-block;width:100%}/*!@:host(.duet-link-button):last-child, :host(.duet-link-button):last-of-type*/.duet-link-button.sc-duet-link-h:last-child,.duet-link-button.sc-duet-link-h:last-of-type{margin-right:0 !important}/*!@.duet-link*/.duet-link.sc-duet-link{display:inline;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;font-weight:400;color:rgb(0, 98, 154);text-decoration:underline;border-radius:4px;transition:300ms ease}/*!@.duet-link:focus*/.duet-link.sc-duet-link:focus{outline:0;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}/*!@.duet-theme-turva .duet-link:focus, .duet-link:focus.duet-theme-turva*/.duet-theme-turva.sc-duet-link .duet-link.sc-duet-link:focus,.duet-link.sc-duet-link:focus.duet-theme-turva{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}/*!@.duet-link.duet-theme-turva*/.duet-link.duet-theme-turva.sc-duet-link{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(173, 11, 43)}/*!@.duet-link:hover*/.duet-link.sc-duet-link:hover{color:rgb(0, 77, 128);text-decoration:none}/*!@.duet-link:hover.duet-theme-turva*/.duet-link.sc-duet-link:hover.duet-theme-turva{color:rgb(148, 9, 37)}/*!@.duet-link:active*/.duet-link.sc-duet-link:active{opacity:0.75;transition:none}/*!@button*/button.sc-duet-link{font-size:inherit;cursor:pointer}/*!@.duet-link-is-external.duet-link:not(.block, .button),\n.duet-link-is-download.duet-link:not(.block, .button)*/.duet-link-is-external.duet-link.sc-duet-link:not(.block,.button).sc-duet-link,.duet-link-is-download.duet-link.sc-duet-link:not(.block,.button).sc-duet-link{text-decoration:none}/*!@.duet-link-is-external.duet-link:not(.block, .button) .duet-link-content,\n.duet-link-is-download.duet-link:not(.block, .button) .duet-link-content*/.duet-link-is-external.duet-link.sc-duet-link:not(.block,.button).sc-duet-link .duet-link-content.sc-duet-link,.duet-link-is-download.duet-link.sc-duet-link:not(.block,.button).sc-duet-link .duet-link-content.sc-duet-link{text-decoration:underline}/*!@.duet-link-is-external.duet-link:not(.block, .button):hover > .duet-link-content,\n.duet-link-is-download.duet-link:not(.block, .button):hover > .duet-link-content*/.duet-link-is-external.duet-link.sc-duet-link:not(.block,.button).sc-duet-link:hover>.duet-link-content.sc-duet-link,.duet-link-is-download.duet-link.sc-duet-link:not(.block,.button).sc-duet-link:hover>.duet-link-content.sc-duet-link{text-decoration:none}/*!@.duet-link-is-external.duet-link:not(.block, .button) .duet-link-icon-tail,\n.duet-link-is-download.duet-link:not(.block, .button) .duet-link-icon-tail*/.duet-link-is-external.duet-link.sc-duet-link:not(.block,.button).sc-duet-link .duet-link-icon-tail.sc-duet-link,.duet-link-is-download.duet-link.sc-duet-link:not(.block,.button).sc-duet-link .duet-link-icon-tail.sc-duet-link{text-decoration:none;white-space:nowrap}/*!@.duet-tab-to-link*/.duet-tab-to-link.sc-duet-link{padding:15px 28px 16px !important;position:absolute;top:-100%;left:-100%;z-index:200;width:1px;min-width:190px;height:1px;overflow:hidden;font-weight:600;color:rgb(0, 119, 179);text-align:center;text-decoration:none;background:rgb(255, 255, 255);border-radius:4px;opacity:0;transition:none}/*!@.duet-tab-to-link.duet-theme-turva*/.duet-tab-to-link.duet-theme-turva.sc-duet-link{min-width:120px;color:rgb(23, 28, 58)}@media (min-width: 106.25em){/*!@.duet-tab-to-link*/.duet-tab-to-link.sc-duet-link{margin-left:20px}}/*!@.duet-tab-to-link:focus*/.duet-tab-to-link.sc-duet-link:focus{top:12px;left:20px;width:auto;height:auto;outline:0;opacity:1}/*!@.block.duet-link*/.block.duet-link.sc-duet-link{display:grid;grid-template-columns:1fr auto;gap:16px;align-items:start;padding:16px;font-weight:600;color:rgb(0, 41, 77);text-decoration:none}/*!@.block.duet-link.duet-link-has-icon*/.block.duet-link.duet-link-has-icon.sc-duet-link{grid-template-columns:auto 1fr auto}/*!@.block.duet-link.none*/.block.duet-link.none.sc-duet-link{padding:0}/*!@.block .block__content*/.block.sc-duet-link .block__content.sc-duet-link{position:relative;bottom:2px}/*!@.block .block__chevron*/.block.sc-duet-link .block__chevron.sc-duet-link{align-self:center}/*!@.block .block__chevron-icon*/.block.sc-duet-link .block__chevron-icon.sc-duet-link{transition:300ms ease}/*!@.block:not(.duet-link-is-external):hover .block__chevron-icon*/.block.sc-duet-link:not(.duet-link-is-external):hover .block__chevron-icon.sc-duet-link{transform:translateX(4px)}/*!@.duet-link.button*/.duet-link.button.sc-duet-link{display:flex;gap:12px;align-items:center;width:100%;min-height:48px;padding:12px;padding-right:20px;text-decoration:none;background-color:rgb(255, 255, 255);border:solid 1px rgb(207, 210, 212);border-radius:12px;outline:0 solid rgb(207, 210, 212);outline-offset:-2px;transition:all 300ms ease}/*!@.duet-link.button > **/.duet-link.button.sc-duet-link>*.sc-duet-link{flex-shrink:0}/*!@.duet-link.button .duet-link-content*/.duet-link.button.sc-duet-link .duet-link-content.sc-duet-link{flex-grow:1;flex-shrink:1;font-size:1rem;font-weight:600;color:rgb(0, 41, 77);text-align:left}/*!@.duet-link.button .icon-wrap*/.duet-link.button.sc-duet-link .icon-wrap.sc-duet-link{display:flex;align-items:center;justify-content:center}/*!@.duet-link.button.duet-link-has-icon-background*/.duet-link.button.duet-link-has-icon-background.sc-duet-link{min-height:60px}/*!@.duet-link.button.duet-link-has-icon-background .icon-wrap*/.duet-link.button.duet-link-has-icon-background.sc-duet-link .icon-wrap.sc-duet-link{width:36px;height:36px;border-radius:8px}/*!@.duet-link.button:hover*/.duet-link.button.sc-duet-link:hover{border-color:rgb(0, 119, 179);outline:2px solid rgb(0, 119, 179)}@media (min-width: 48em){/*!@.duet-link.button*/.duet-link.button.sc-duet-link{gap:16px;min-height:60px;border-radius:16px}/*!@.duet-link.button.duet-link-has-icon-background*/.duet-link.button.duet-link-has-icon-background.sc-duet-link{min-height:72px}/*!@.duet-link.button.duet-link-has-icon-background .icon-wrap*/.duet-link.button.duet-link-has-icon-background.sc-duet-link .icon-wrap.sc-duet-link{width:48px;height:48px;border-radius:12px}/*!@.duet-link.button .duet-link-content*/.duet-link.button.sc-duet-link .duet-link-content.sc-duet-link{font-size:1.1rem}}/*!@.duet-link.button.duet-theme-turva*/.duet-link.button.duet-theme-turva.sc-duet-link{border-color:rgb(207, 207, 209)}/*!@.duet-link.button.duet-theme-turva .duet-link-content*/.duet-link.button.duet-theme-turva.sc-duet-link .duet-link-content.sc-duet-link{color:rgb(23, 28, 58)}/*!@.duet-link.button.duet-theme-turva:hover*/.duet-link.button.duet-theme-turva.sc-duet-link:hover{border-color:rgb(198, 12, 48);outline-color:rgb(198, 12, 48)}/*!@.duet-link.button:not(.duet-link-is-external):hover .block__chevron-icon*/.duet-link.button.sc-duet-link:not(.duet-link-is-external):hover .block__chevron-icon.sc-duet-link{transform:translateX(4px)}";
+const duetLinkCss = "/*!@*,\n*::after,\n*::before*/*.sc-duet-link,*.sc-duet-link::after,*.sc-duet-link::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@:host*/.sc-duet-link-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;display:inline}/*!@:host(.duet-link-block)*/.duet-link-block.sc-duet-link-h{display:block}/*!@:host(.duet-link-button)*/.duet-link-button.sc-duet-link-h{margin-right:8px !important;margin-bottom:12px !important;display:inline-block;width:100%}/*!@:host(.duet-link-button):last-child, :host(.duet-link-button):last-of-type*/.duet-link-button.sc-duet-link-h:last-child,.duet-link-button.sc-duet-link-h:last-of-type{margin-right:0 !important}/*!@:host(.duet-m-0)*/.duet-m-0.sc-duet-link-h{margin:0 !important}/*!@.duet-link*/.duet-link.sc-duet-link{display:inline;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;font-weight:400;color:rgb(0, 98, 154);text-decoration:underline;border-radius:4px;transition:300ms ease}/*!@.duet-link:focus*/.duet-link.sc-duet-link:focus{outline:0;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}/*!@.duet-theme-turva .duet-link:focus, .duet-link:focus.duet-theme-turva*/.duet-theme-turva.sc-duet-link .duet-link.sc-duet-link:focus,.duet-link.sc-duet-link:focus.duet-theme-turva{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}/*!@.duet-link.duet-theme-turva*/.duet-link.duet-theme-turva.sc-duet-link{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(173, 11, 43)}/*!@.duet-link:hover*/.duet-link.sc-duet-link:hover{color:rgb(0, 77, 128);text-decoration:none}/*!@.duet-link:hover.duet-theme-turva*/.duet-link.sc-duet-link:hover.duet-theme-turva{color:rgb(148, 9, 37)}/*!@.duet-link:active*/.duet-link.sc-duet-link:active{opacity:0.75;transition:none}/*!@button*/button.sc-duet-link{font-size:inherit;cursor:pointer}/*!@.duet-link-is-external.duet-link:not(.block, .button),\n.duet-link-is-download.duet-link:not(.block, .button)*/.duet-link-is-external.duet-link.sc-duet-link:not(.block,.button).sc-duet-link,.duet-link-is-download.duet-link.sc-duet-link:not(.block,.button).sc-duet-link{text-decoration:none}/*!@.duet-link-is-external.duet-link:not(.block, .button) .duet-link-content,\n.duet-link-is-download.duet-link:not(.block, .button) .duet-link-content*/.duet-link-is-external.duet-link.sc-duet-link:not(.block,.button).sc-duet-link .duet-link-content.sc-duet-link,.duet-link-is-download.duet-link.sc-duet-link:not(.block,.button).sc-duet-link .duet-link-content.sc-duet-link{text-decoration:underline}/*!@.duet-link-is-external.duet-link:not(.block, .button):hover > .duet-link-content,\n.duet-link-is-download.duet-link:not(.block, .button):hover > .duet-link-content*/.duet-link-is-external.duet-link.sc-duet-link:not(.block,.button).sc-duet-link:hover>.duet-link-content.sc-duet-link,.duet-link-is-download.duet-link.sc-duet-link:not(.block,.button).sc-duet-link:hover>.duet-link-content.sc-duet-link{text-decoration:none}/*!@.duet-link-is-external.duet-link:not(.block, .button) .duet-link-icon-tail,\n.duet-link-is-download.duet-link:not(.block, .button) .duet-link-icon-tail*/.duet-link-is-external.duet-link.sc-duet-link:not(.block,.button).sc-duet-link .duet-link-icon-tail.sc-duet-link,.duet-link-is-download.duet-link.sc-duet-link:not(.block,.button).sc-duet-link .duet-link-icon-tail.sc-duet-link{text-decoration:none;white-space:nowrap}/*!@.duet-tab-to-link*/.duet-tab-to-link.sc-duet-link{padding:15px 28px 16px !important;position:absolute;top:-100%;left:-100%;z-index:200;width:1px;min-width:190px;height:1px;overflow:hidden;font-weight:600;color:rgb(0, 119, 179);text-align:center;text-decoration:none;background:rgb(255, 255, 255);border-radius:4px;opacity:0;transition:none}/*!@.duet-tab-to-link.duet-theme-turva*/.duet-tab-to-link.duet-theme-turva.sc-duet-link{min-width:120px;color:rgb(23, 28, 58)}@media (min-width: 106.25em){/*!@.duet-tab-to-link*/.duet-tab-to-link.sc-duet-link{margin-left:20px}}/*!@.duet-tab-to-link:focus*/.duet-tab-to-link.sc-duet-link:focus{top:12px;left:20px;width:auto;height:auto;outline:0;opacity:1}/*!@.block.duet-link*/.block.duet-link.sc-duet-link{display:grid;grid-template-columns:1fr auto;gap:16px;align-items:start;padding:16px;font-weight:600;color:rgb(0, 41, 77);text-decoration:none}/*!@.block.duet-link.duet-link-has-icon*/.block.duet-link.duet-link-has-icon.sc-duet-link{grid-template-columns:auto 1fr auto}/*!@.block.duet-link.none*/.block.duet-link.none.sc-duet-link{padding:0}/*!@.block .block__content*/.block.sc-duet-link .block__content.sc-duet-link{position:relative;bottom:2px}/*!@.block .block__chevron*/.block.sc-duet-link .block__chevron.sc-duet-link{align-self:center}/*!@.block .block__chevron-icon*/.block.sc-duet-link .block__chevron-icon.sc-duet-link{transition:300ms ease}/*!@.block:not(.duet-link-is-external):hover .block__chevron-icon*/.block.sc-duet-link:not(.duet-link-is-external):hover .block__chevron-icon.sc-duet-link{transform:translateX(4px)}/*!@.duet-link.button*/.duet-link.button.sc-duet-link{display:flex;gap:12px;align-items:center;width:100%;min-height:48px;padding:12px;padding-right:20px;text-decoration:none;background-color:rgb(255, 255, 255);border:solid 1px rgb(207, 210, 212);border-radius:12px;outline:0 solid rgb(207, 210, 212);outline-offset:-2px;transition:all 300ms ease}/*!@.duet-link.button > **/.duet-link.button.sc-duet-link>*.sc-duet-link{flex-shrink:0}/*!@.duet-link.button .duet-link-content*/.duet-link.button.sc-duet-link .duet-link-content.sc-duet-link{flex-grow:1;flex-shrink:1;font-size:1rem;font-weight:600;color:rgb(0, 41, 77);text-align:left}/*!@.duet-link.button .icon-wrap*/.duet-link.button.sc-duet-link .icon-wrap.sc-duet-link{display:flex;align-items:center;justify-content:center}/*!@.duet-link.button.duet-link-has-icon-background*/.duet-link.button.duet-link-has-icon-background.sc-duet-link{min-height:60px}/*!@.duet-link.button.duet-link-has-icon-background .icon-wrap*/.duet-link.button.duet-link-has-icon-background.sc-duet-link .icon-wrap.sc-duet-link{width:36px;height:36px;border-radius:8px}/*!@.duet-link.button:hover*/.duet-link.button.sc-duet-link:hover{border-color:rgb(0, 119, 179);outline:2px solid rgb(0, 119, 179)}@media (min-width: 48em){/*!@.duet-link.button*/.duet-link.button.sc-duet-link{gap:16px;min-height:60px;border-radius:16px}/*!@.duet-link.button.duet-link-has-icon-background*/.duet-link.button.duet-link-has-icon-background.sc-duet-link{min-height:72px}/*!@.duet-link.button.duet-link-has-icon-background .icon-wrap*/.duet-link.button.duet-link-has-icon-background.sc-duet-link .icon-wrap.sc-duet-link{width:48px;height:48px;border-radius:12px}/*!@.duet-link.button .duet-link-content*/.duet-link.button.sc-duet-link .duet-link-content.sc-duet-link{font-size:1.1rem}}/*!@.duet-link.button.duet-theme-turva*/.duet-link.button.duet-theme-turva.sc-duet-link{border-color:rgb(207, 207, 209)}/*!@.duet-link.button.duet-theme-turva .duet-link-content*/.duet-link.button.duet-theme-turva.sc-duet-link .duet-link-content.sc-duet-link{color:rgb(23, 28, 58)}/*!@.duet-link.button.duet-theme-turva:hover*/.duet-link.button.duet-theme-turva.sc-duet-link:hover{border-color:rgb(198, 12, 48);outline-color:rgb(198, 12, 48)}/*!@.duet-link.button:not(.duet-link-is-external):hover .block__chevron-icon*/.duet-link.button.sc-duet-link:not(.duet-link-is-external):hover .block__chevron-icon.sc-duet-link{transform:translateX(4px)}";
 /**
  * @part duet-link - piercing selector for styling the link
@@ -14641,6 +14650,7 @@ class DuetLink {
         this.iconColor = "currentColor";
         this.iconBackground = null;
         this.iconResponsive = false;
+        this.margin = "auto";
         this.padding = "auto";
         this.isSmallScreen = false;
         this.isMediumScreen = false;
@@ -14737,6 +14747,7 @@ class DuetLink {
         const Tag = !this.url ? "button" : "a";
         return (hAsync(Host, { class: {
                 [`duet-link-${this.variation}`]: true,
+                "duet-m-0": this.margin === "none",
             } }, hAsync(Tag, { href: this.url, class: {
                 "duet-link": true,
                 "duet-link-is-external": this.external,
@@ -14774,6 +14785,7 @@ class DuetLink {
             "iconColor": [1, "icon-color"],
             "iconBackground": [1, "icon-background"],
             "iconResponsive": [4, "icon-responsive"],
+            "margin": [1],
             "padding": [1],
             "isSmallScreen": [32],
             "isMediumScreen": [32],
@@ -15629,10 +15641,11 @@ class DuetMenuBarLink {
 /**
  * Teleport helps resolving z-index issues of overlapping popup elements.
- * Initiate it in your component's willLoad or didLoad lifecycle hook.
- * When you open the popup, call teleport.go() and move focus to the popup.
- * When you close the popup, call teleport.resume() and move focus to the element that opened the popup.
- * If your popup has closing animation, use the timeout parameter.
+ * Initiate it in your component's connectedCallback.
+ * Call activate() to teleport the object.
+ * Call deactivate() to resume the object to its original place.
+ * Call makeSiblingsInert() to add inert attribute to sibling elements.
+ * Call removeInertFromSiblings() to remove inert attribute from sibling elements.
  */
 class Teleport {
     constructor(element, target) {
@@ -15641,44 +15654,51 @@ class Teleport {
         this.target = target || document.body;
         this.teleportId = `${Math.random()}-${Date.now()}`.substring(2);
     }
-    /**
-     * @param makeSiblingsInert - make all siblings of the element inert, use only with modals
-     */
-    go(makeSiblingsInert = false) {
-        const skipTeleport = this.element.getAttribute("skip-teleport");
-        if (skipTeleport !== null && skipTeleport !== "false") {
+    activate() {
+        if (this._isTeleportSkipped() || this.isActive) {
             return;
         }
-        // React handles teleporting itself with portals
-        if (!this.element.dataset.reactPortal) {
-            this.stub = document.createElement("template");
-            this.element.insertAdjacentElement("afterend", this.stub);
-            this.target.appendChild(this.element);
-        }
-        if (makeSiblingsInert) {
-            this._makeSiblingsInert();
-        }
-        this.deletionObserver = new MutationObserver(this._deletionObserverCallback.bind(this));
-        this.deletionObserver.observe(document.documentElement, { childList: true, subtree: true });
         this.isActive = true;
+        this._activate();
     }
-    resume(delay = 0) {
-        const skipTeleport = this.element.getAttribute("skip-teleport");
-        if (skipTeleport !== null && skipTeleport !== "false") {
+    deactivate() {
+        if (this._isTeleportSkipped() || !this.isActive) {
             return;
         }
-        if (!this.isActive) {
+        this.isActive = false;
+        this._deactivate();
+    }
+    makeSiblingsInert() {
+        if (this._isTeleportSkipped() || !this.isActive) {
+            return;
+        }
+        this._makeSiblingsInert();
+    }
+    removeInertFromSiblings(delay = 0) {
+        if (this._isTeleportSkipped() || !this.isActive) {
             return;
         }
-        this.isActive = false;
         if (delay) {
-            setTimeout(this._resume.bind(this), delay);
+            setTimeout(this._removeInertFromSiblings.bind(this), delay);
         }
         else {
-            this._resume();
+            this._removeInertFromSiblings();
         }
     }
-    _resume() {
+    _isTeleportSkipped() {
+        const skipTeleport = this.element.getAttribute("skip-teleport");
+        return skipTeleport !== null && skipTeleport !== "false";
+    }
+    _activate() {
+        if (!this.element.dataset.reactPortal) {
+            this.stub = document.createElement("template");
+            this.element.insertAdjacentElement("afterend", this.stub);
+            this.target.appendChild(this.element);
+        }
+        this.deletionObserver = new MutationObserver(this._deletionObserverCallback.bind(this));
+        this.deletionObserver.observe(document.documentElement, { childList: true, subtree: true });
+    }
+    _deactivate() {
         if (!this.element.dataset.reactPortal) {
             this.stub.insertAdjacentElement("beforebegin", this.element);
             this.stub.remove();
@@ -15745,11 +15765,6 @@ class DuetModal {
         this.duetClose = createEvent$2(this, "duetClose", 7);
         this.duetBeforeClose = createEvent$2(this, "duetBeforeClose", 7);
         var _a, _b;
-        /**
-         * Own Properties.
-         */
-        this.modalId = createID("DuetModal");
-        this.slotDefaultId = createID("DuetModal-default-slot");
         this.hasStickyHeader = false;
         this.isAndroidDevice = ((_b = (_a = navigator === null || navigator === void 0 ? void 0 : navigator.userAgent) === null || _a === void 0 ? void 0 : _a.toLowerCase()) === null || _b === void 0 ? void 0 : _b.indexOf("android")) > -1 || null;
         this.isSafariBrowser = /^((?!chrome|android).)*safari/i.test(navigator === null || navigator === void 0 ? void 0 : navigator.userAgent);
@@ -15801,7 +15816,7 @@ class DuetModal {
             }
             this.focusedElBeforeOpen = document.activeElement;
             disableBodyScroll(this.modalEl, { reserveScrollBarGap: true });
-            this.teleport.go(true);
+            this.teleport.makeSiblingsInert();
             this.slotContainerEl.querySelectorAll(".duet-loader-message").forEach(el => el.remove());
             setTimeout(() => {
                 if (this.variation === "loader") {
@@ -15825,7 +15840,7 @@ class DuetModal {
             this.modalEl.classList.remove("duet-disable-transitions");
             enableBodyScroll(this.modalEl);
             this.duetClose.emit();
-            this.teleport.resume(TRANSITION_MS);
+            this.teleport.removeInertFromSiblings(TRANSITION_MS);
             setTimeout(() => {
                 focusElement(this.focusedElBeforeOpen);
             }, TRANSITION_MS);
@@ -15850,14 +15865,15 @@ class DuetModal {
         }
     }
     connectedCallback() {
-        connectLanguageChangeObserver(this, [
-            { prop: "accessibleCloseLabel", defaults: "accessibleCloseLabelDefaults" },
-            { prop: "accessibleLoaderAnnouncement", defaults: "accessibleLoaderAnnouncementDefaults" },
-        ]);
+        {
+            return;
+        }
     }
     disconnectedCallback() {
         disconnectLanguageChangeObserver(this);
-        enableBodyScroll(this.modalEl);
+        if (this.modalEl) {
+            enableBodyScroll(this.modalEl);
+        }
     }
     /**
      * Component event handling.
@@ -15924,7 +15940,7 @@ class DuetModal {
      * Always the last one in the class.
      */
     render() {
-        var _a;
+        var _a, _b;
         let iconColor = "primary";
         let closeColor = "secondary";
         const closingButton = (hAsync("div", { class: "duet-modal-close" }, hAsync("duet-button", { ref: button => (this.buttonEl = button), variation: "plain", accessibleLabel: this.accessibleCloseLabel, color: closeColor, iconSize: "large", icon: "navigation-close", iconOnly: true, margin: "none", theme: this.theme, onClick: ev => this.closeModal(ev), fixed: true })));
@@ -15932,13 +15948,13 @@ class DuetModal {
             iconColor = "primary-turva";
             closeColor = "secondary-turva";
         }
-        return (hAsync("div", { ref: modal => (this.modalEl = modal), "aria-label": this.accessibleLabel, "aria-labelledby": this.heading ? this.modalId : false, "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, "aria-describedby": this.accessibleDescribedBy, role: this.variation === "loader" ? "alert" : "dialog", "aria-modal": this.isSafariBrowser ? false : true, tabindex: "-1", "aria-flowto": this.slotDefaultId, class: {
+        return (hAsync("div", { ref: modal => (this.modalEl = modal), "aria-label": (_a = this.accessibleLabel) !== null && _a !== void 0 ? _a : this.heading, "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, "aria-describedby": this.accessibleDescribedBy, role: this.variation === "loader" ? "alert" : "dialog", "aria-modal": this.isSafariBrowser ? false : true, tabindex: "-1", class: {
                 "duet-modal-container": true,
                 "duet-theme-turva": this.theme === "turva",
                 "duet-modal-active": this.open,
                 "duet-modal-slide-up": this.variation === "slide-up",
                 "duet-modal-has-sticky-header": this.hasStickyHeader,
-            } }, hAsync(FocusGuard, { moveFocusTo: this.buttonEl }), hAsync("duet-overlay", { "z-index": "-1", visible: this.open, variation: this.variation === "loader" ? "white" : "default" }), hAsync("div", { ref: modalInner => (this.modalInnerEl = modalInner), class: {
+            } }, hAsync("duet-overlay", { "z-index": "-1", visible: this.open, variation: this.variation === "loader" ? "white" : "default" }), hAsync("div", { ref: modalInner => (this.modalInnerEl = modalInner), class: {
                 "duet-modal-inner": true,
                 [this.size]: true,
                 "duet-modal-slide-up": this.variation === "slide-up",
@@ -15960,7 +15976,7 @@ class DuetModal {
                 "duet-modal-gutter-small": this.gutterSize === "small",
                 "duet-modal-gutter-medium": this.gutterSize === "medium",
                 "duet-modal-gutter-large": this.gutterSize === "large",
-            } }, hAsync("div", { class: "duet-modal-header" }, hAsync("span", { class: "duet-modal-inner-slot-top" }, hAsync("slot", { name: "top" })), this.icon && hAsync("duet-icon", { name: this.icon, size: "xx-large", color: this.color || iconColor }), this.heading && (hAsync("duet-heading", { "visual-level": (_a = this.headingVisualLevel) !== null && _a !== void 0 ? _a : this.headingLevel, level: this.headingLevel, theme: this.theme, id: this.modalId }, this.heading))), this.variation === "loader" && (hAsync("div", { class: "duet-modal-spinner" }, hAsync("duet-spinner", { size: "large", color: "primary" }))), hAsync("div", { class: "duet-modal-inner-slot-default", id: this.slotDefaultId, ref: el => (this.slotContainerEl = el), "aria-live": this.variation === "loader" ? "assertive" : "off" }, hAsync("slot", null))))), hAsync(FocusGuard, { moveFocusTo: this.buttonEl })));
+            } }, hAsync("div", { class: "duet-modal-header" }, hAsync("span", { class: "duet-modal-inner-slot-top" }, hAsync("slot", { name: "top" })), this.icon && hAsync("duet-icon", { name: this.icon, size: "xx-large", color: this.color || iconColor }), this.heading && (hAsync("duet-heading", { "visual-level": (_b = this.headingVisualLevel) !== null && _b !== void 0 ? _b : this.headingLevel, level: this.headingLevel, theme: this.theme }, this.heading))), this.variation === "loader" && (hAsync("div", { class: "duet-modal-spinner" }, hAsync("duet-spinner", { size: "large", color: "primary" }))), hAsync("div", { class: "duet-modal-inner-slot-default", ref: el => (this.slotContainerEl = el), "aria-live": this.variation === "loader" ? "assertive" : "off" }, hAsync("slot", null)))))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -16940,7 +16956,7 @@ class DuetOverlay {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, null, hAsync("div", { style: { zIndex: this.zIndex }, class: {
+        return (hAsync(Host, { "aria-hidden": "true" }, hAsync("div", { style: { zIndex: this.zIndex }, class: {
                 "duet-overlay": true,
                 "duet-theme-turva": this.theme === "turva",
                 "keep-stacking-context": this.keepStackingContext,
@@ -18719,6 +18735,74 @@ const platform = {
   isRTL: element => getComputedStyle$1(element).direction === 'rtl'
 };
+/**
+ * Automatically updates the position of the floating element when necessary.
+ * Should only be called when the floating element is mounted on the DOM or
+ * visible on the screen.
+ * @returns cleanup function that should be invoked when the floating element is
+ * removed from the DOM or hidden from the screen.
+ * @see https://floating-ui.com/docs/autoUpdate
+ */
+function autoUpdate(reference, floating, update, options) {
+  if (options === void 0) {
+    options = {};
+  }
+  const {
+    ancestorScroll = true,
+    ancestorResize = true,
+    elementResize = true,
+    animationFrame = false
+  } = options;
+  const ancestors = ancestorScroll || ancestorResize ? [...(isElement(reference) ? getOverflowAncestors(reference) : reference.contextElement ? getOverflowAncestors(reference.contextElement) : []), ...getOverflowAncestors(floating)] : [];
+  ancestors.forEach(ancestor => {
+    // ignores Window, checks for [object VisualViewport]
+    const isVisualViewport = !isElement(ancestor) && ancestor.toString().includes('V');
+    if (ancestorScroll && (animationFrame ? isVisualViewport : true)) {
+      ancestor.addEventListener('scroll', update, {
+        passive: true
+      });
+    }
+    ancestorResize && ancestor.addEventListener('resize', update);
+  });
+  let observer = null;
+  if (elementResize) {
+    observer = new ResizeObserver(() => {
+      update();
+    });
+    isElement(reference) && !animationFrame && observer.observe(reference);
+    if (!isElement(reference) && reference.contextElement && !animationFrame) {
+      observer.observe(reference.contextElement);
+    }
+    observer.observe(floating);
+  }
+  let frameId;
+  let prevRefRect = animationFrame ? getBoundingClientRect(reference) : null;
+  if (animationFrame) {
+    frameLoop();
+  }
+  function frameLoop() {
+    const nextRefRect = getBoundingClientRect(reference);
+    if (prevRefRect && (nextRefRect.x !== prevRefRect.x || nextRefRect.y !== prevRefRect.y || nextRefRect.width !== prevRefRect.width || nextRefRect.height !== prevRefRect.height)) {
+      update();
+    }
+    prevRefRect = nextRefRect;
+    frameId = requestAnimationFrame(frameLoop);
+  }
+  update();
+  return () => {
+    var _observer;
+    ancestors.forEach(ancestor => {
+      ancestorScroll && ancestor.removeEventListener('scroll', update);
+      ancestorResize && ancestor.removeEventListener('resize', update);
+    });
+    (_observer = observer) == null ? void 0 : _observer.disconnect();
+    observer = null;
+    if (animationFrame) {
+      cancelAnimationFrame(frameId);
+    }
+  };
+}
 /**
  * Computes the `x` and `y` coordinates that will place the floating element
  * next to a reference element when it is given a certain CSS positioning
@@ -18805,6 +18889,9 @@ class DuetPopupMenu {
     }
     connectedCallback() {
         this.handleControllerChange(this.controller, null);
+        {
+            return;
+        }
     }
     disconnectedCallback() {
         if (this.openButton) {
@@ -18913,7 +19000,7 @@ class DuetPopupMenu {
             if (this.openButton) {
                 this.openButton.accessibleExpanded = true;
             }
-            this.teleport.go(true);
+            this.teleport.makeSiblingsInert();
             this.updatePlacement();
             setTimeout(() => {
                 if (this.accessibleRole === "menu") {
@@ -18931,7 +19018,7 @@ class DuetPopupMenu {
                     this.focusOpenButton();
                 }
                 this.duetToggle.emit({ open: this.open, component: "duet-popup-menu" });
-                this.teleport.resume();
+                this.teleport.removeInertFromSiblings();
             }, 200);
         }
     }
@@ -20524,7 +20611,9 @@ class DuetSlideout {
     }
     disconnectedCallback() {
         disconnectLanguageChangeObserver(this);
-        enableBodyScroll(this.dialog);
+        if (this.dialog) {
+            enableBodyScroll(this.dialog);
+        }
         if (this.mutationObserver) {
             this.mutationObserver.disconnect();
         }
@@ -20542,7 +20631,7 @@ class DuetSlideout {
                 this.openButton.accessibleExpanded = true;
             }
             const openPanel = this.getOpenPanel();
-            this.teleport.go(true);
+            this.teleport.makeSiblingsInert();
             disableBodyScroll(this.dialog, { reserveScrollBarGap: true });
             if (openPanel) {
                 openPanel.setFocus();
@@ -20560,7 +20649,7 @@ class DuetSlideout {
             setTimeout(() => {
                 focusElement(this.openButton);
                 enableBodyScroll(this.dialog);
-                this.teleport.resume();
+                this.teleport.removeInertFromSiblings();
             }, 200);
         }
     }
@@ -23033,23 +23122,6 @@ class DuetTooltip {
     disconnectedCallback() {
         disconnectLanguageChangeObserver(this);
     }
-    /**
-     * Component event handling.
-     */
-    onScroll() {
-        clearTimeout(this.scrollTimer);
-        this.scrollTimer = setTimeout(() => {
-            if (this.active) {
-                this.updatePlacement();
-            }
-        }, 100);
-    }
-    handleWindowResize() {
-        clearTimeout(this.resizeTimer);
-        this.resizeTimer = setTimeout(() => {
-            this.updatePlacement();
-        }, 100);
-    }
     handleDocumentClick(e) {
         if (!this.active) {
             return;
@@ -23072,10 +23144,10 @@ class DuetTooltip {
     }
     async handleActiveChange(newActiveValue) {
         if (newActiveValue) {
-            setTimeout(() => this.updatePlacement(), 10);
+            this.autoUpdateCleanup = autoUpdate(this.buttonEl, this.popupElement, this.updatePlacement);
         }
         else {
-            setTimeout(() => this.updatePlacement(), 300);
+            this.autoUpdateCleanup();
         }
     }
     /**
@@ -23117,7 +23189,7 @@ class DuetTooltip {
             "arrowY": [32],
             "buttonActive": [32]
         },
-        "$listeners$": [[9, "scroll", "onScroll"], [9, "resize", "handleWindowResize"], [4, "click", "handleDocumentClick"], [4, "keydown", "handleKeyDown"], [4, "tooltipPopupClosed", "handlePopupClose"]],
+        "$listeners$": [[4, "click", "handleDocumentClick"], [4, "keydown", "handleKeyDown"], [4, "tooltipPopupClosed", "handlePopupClose"]],
         "$lazyBundleId$": "-",
         "$attrsToReflect$": [["positionVertical", "position-vertical"], ["positionHorizontal", "position-horizontal"], ["active", "active"]]
     }; }
@@ -23205,14 +23277,6 @@ class DuetTooltipPopup {
         this.placement = undefined;
         this.accessibleCloseLabel = undefined;
     }
-    handleActiveChange() {
-        if (this.active) {
-            this.teleport.go();
-        }
-        else {
-            this.teleport.resume(200);
-        }
-    }
     /**
      * Component lifecycle events.
      */
@@ -23222,6 +23286,9 @@ class DuetTooltipPopup {
     }
     connectedCallback() {
         subscribeTabbingChange(this);
+        {
+            return;
+        }
     }
     disconnectedCallback() {
         unsubscribeTabbingChange(this);
@@ -23243,9 +23310,6 @@ class DuetTooltipPopup {
             } }, hAsync(FocusGuard, { moveFocusTo: this.buttonEl }), hAsync("div", { ref: element => (this.contentEl = element), class: "duet-tooltip-content-area", tabindex: 0, id: this.tooltipId }, hAsync("slot", null)), hAsync("div", { ref: element => (this.arrowEl = element), class: { arrow: true, [this.placement]: true }, style: this.arrowStyles }, hAsync("div", { class: { "arrow-container": true, [this.placement]: true } })), hAsync("button", { type: "button", class: "duet-tooltip-close", onClick: this.handleCloseClick, ref: el => (this.buttonEl = el) }, hAsync("duet-icon", { name: "navigation-close-small", margin: "none", color: "currentColor", size: "xxx-small" }), hAsync("duet-visually-hidden", null, this.accessibleCloseLabel)), hAsync(FocusGuard, { moveFocusTo: this.contentEl }))));
     }
     get element() { return getElement(this); }
-    static get watchers() { return {
-        "active": ["handleActiveChange"]
-    }; }
     static get style() { return duetTooltipPopupCss; }
     static get cmpMeta() { return {
         "$flags$": 9,

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-549a7702.js');
+const index = require('./index-16863efb.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-549a7702.js');
+const index = require('./index-16863efb.js');
 const themeableComponent = require('./themeable-component-83a2a0d4.js');
 const createId = require('./create-id-1f8c438f.js');
 const keyboardUtils = require('./keyboard-utils-681e11ec.js');