@duetds/components 9.3.2 → 9.4.1

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

@@ -1,31 +1,31 @@
 /*!
  * Built with Duet Design System
  */
-import { p as proxyCustomElement, H, c as createEvent, h as h$1, F as Fragment, d as Host } from './p-e7a9cd6f.js';
+import { p as proxyCustomElement, H, c as createEvent, h as h$1, F as Fragment, d as Host } from './p-1080a6c7.js';
 import { i as inheritGlobalTheme } from './p-aaa7a7bd.js';
 import { c as createID } from './p-5e59e970.js';
 import { d as debounce } from './p-9e371678.js';
 import { g as getLocaleString, s as sanitizeString } from './p-35375593.js';
 import { p as parsePossibleJSON } from './p-9c3c64b9.js';
-import { g as getError, a as getI18nError, d as defineCustomElement$3 } from './p-962142a6.js';
+import { g as getError, a as getI18nError, d as defineCustomElement$3 } from './p-02060606.js';
 import { h } from './p-993aea39.js';
-import { d as defineCustomElement$j } from './p-9fb49035.js';
-import { d as defineCustomElement$i } from './p-7623dd11.js';
-import { d as defineCustomElement$h } from './p-8e60819a.js';
-import { d as defineCustomElement$g } from './p-c90eb69a.js';
-import { d as defineCustomElement$f } from './p-5d23c028.js';
-import { d as defineCustomElement$e } from './p-afe17ede.js';
-import { d as defineCustomElement$d } from './p-ac901dbf.js';
-import { d as defineCustomElement$c } from './p-396dec0e.js';
-import { d as defineCustomElement$b } from './p-167f1cfd.js';
-import { d as defineCustomElement$a } from './p-d5f00f7a.js';
-import { d as defineCustomElement$9 } from './p-712259e0.js';
-import { d as defineCustomElement$8 } from './p-c5dd5195.js';
-import { d as defineCustomElement$7 } from './p-33d21ff2.js';
-import { d as defineCustomElement$6 } from './p-25ea4a16.js';
-import { d as defineCustomElement$5 } from './p-7302dad1.js';
-import { d as defineCustomElement$4 } from './p-00371426.js';
-import { d as defineCustomElement$2 } from './p-18a780a8.js';
+import { d as defineCustomElement$j } from './p-9a854b9b.js';
+import { d as defineCustomElement$i } from './p-c1f97fa7.js';
+import { d as defineCustomElement$h } from './p-447bdf9c.js';
+import { d as defineCustomElement$g } from './p-1b3d1a63.js';
+import { d as defineCustomElement$f } from './p-d74ee462.js';
+import { d as defineCustomElement$e } from './p-8381740e.js';
+import { d as defineCustomElement$d } from './p-ef906a44.js';
+import { d as defineCustomElement$c } from './p-54a8c7e1.js';
+import { d as defineCustomElement$b } from './p-2ccad3d5.js';
+import { d as defineCustomElement$a } from './p-269887e7.js';
+import { d as defineCustomElement$9 } from './p-159ce59f.js';
+import { d as defineCustomElement$8 } from './p-a8859d41.js';
+import { d as defineCustomElement$7 } from './p-d8ca9bb0.js';
+import { d as defineCustomElement$6 } from './p-5c11ac99.js';
+import { d as defineCustomElement$5 } from './p-6617d6ac.js';
+import { d as defineCustomElement$4 } from './p-ccfdbbfd.js';
+import { d as defineCustomElement$2 } from './p-f2e41ed9.js';
 
 const errorCodes = [
 	{
@@ -1080,10 +1080,10 @@ const DuetUpload$1 = /*@__PURE__*/ proxyCustomElement(class DuetUpload extends H
             this.externalUploadButton.accessibleLabel = `${this.externalUploadButton.innerText}. ${caption}`;
         }
         // @ts-ignore
-        return (h$1(Host, { key: '34dabb707733d49a37d7665b2ce21dac3cb69b99', class: { "duet-m-0": this.margin === "none" } }, h$1("duet-fieldset", { key: '53da3e1d39ae3d0a72ea1e836ed84a7ed5505745', "label-heading-level": this.headerHeadingLevel, "label-hidden": this.hideHeader, label: this.label }, h$1("slot", { key: '50da1a23f5016f0666627e8455e072cfa5b96ca7', name: "header" }), !this.files.size && (h$1("duet-empty-state", { key: '6895fe8edf7ed8eec62bb4f141222ec699cbb00f', id: this.labelId, part: this.identifier ? `${this.identifier}-empty-state` : "duet-upload-empty-state", icon: "messaging-attachment" }, h$1("duet-paragraph", { key: '01b14bc9aef86e1044a9d4ebf56017068b10df4b', margin: "none" }, this.fileListEmpty))), !!this.files.size && h$1("slot", { key: '2c3b18a000bfeb370a6fc83a23fa5b534cd09b43', name: "fileheader" }), !!this.files.size && (h$1("duet-upload-aria-status", { key: '3b143bdded7b1feddd54867d6d4b2ed4e2d915cf', invalid: this.getFilesAsArray().invalid.length, valid: this.getFilesAsArray().valid.length, inprogress: this.filesInProgress.size, total: this.files.size, statusMessageLabel: this.internalStatusMessageLabel })), !!this.files.size && this.renderUploadedItems(), !!this.files.size && h$1("slot", { key: '85599b8ce8e5b05c80c5c3e5276356c7324bdef3', name: "filefooter" }), h$1("slot", { key: '425f33860900e6110a625c5c4c7da8bcc1313053', name: "uploadfooter" }), this.captionOnBottom && (h$1("duet-caption", { key: '881d401f134a7e3c412cd1f01bed6117f96bbc19', margin: "none", size: "small" }, h$1("div", { key: '5e498fd2880ec86684cf3da9690b139ad05fd97f', class: "upload-bottom-caption" }, caption))), h$1("slot", { key: 'a05a45a3f7efc7d767db95eeb75a5da261b08edb', name: "afterfooter" }), !this.hideButton && (h$1(Fragment, { key: '0d0ff9d5fad94af744e9632125af447fd7144fd0' }, h$1("duet-spacer", { key: 'fed503af8f9301defa2f2d8f29385e28fa1a8716', size: "large" }), h$1("duet-button", { key: '7a4f79bf0df839531c714f39202900a25d339612', id: this.buttonId, onClick: this.startUpload, "accessible-controls": identifier, disabled: this.fileMaxReached, "accessible-label": this.accessibleButtonLabel || `${this.buttonLabel}. ${caption}`, "accessible-owns": identifier, size: "small", variation: "secondary", fixed: true, icon: "action-add-circle", part: this.identifier ? `${this.identifier}-button-upload` : "duet-upload-button-upload" }, this.buttonLabel))), (this.fileMaxReached ||
+        return (h$1(Host, { key: '7f8970727b44bee3669b221659dd1f5a72df4ee2', class: { "duet-m-0": this.margin === "none" } }, h$1("duet-fieldset", { key: '074fc7ec948f6d0ab5c89c7d2d3d3ec3358343f4', "label-heading-level": this.headerHeadingLevel, "label-hidden": this.hideHeader, label: this.label }, h$1("slot", { key: '84797a77942534e80a641d8a2ce9badef0e77937', name: "header" }), !this.files.size && (h$1("duet-empty-state", { key: '224610821155dae048fd126b8d517486fa6efd38', id: this.labelId, part: this.identifier ? `${this.identifier}-empty-state` : "duet-upload-empty-state", icon: "messaging-attachment" }, h$1("duet-paragraph", { key: '6d01352482dd687520dd26d8d7c0d3863b61d4a4', margin: "none" }, this.fileListEmpty))), !!this.files.size && h$1("slot", { key: '328346632314eb8a8d0ae41de9761a488fc0bc1c', name: "fileheader" }), !!this.files.size && (h$1("duet-upload-aria-status", { key: 'cab1390fc0ff3a6eb197be8e7ea16d719c2b6dc4', invalid: this.getFilesAsArray().invalid.length, valid: this.getFilesAsArray().valid.length, inprogress: this.filesInProgress.size, total: this.files.size, statusMessageLabel: this.internalStatusMessageLabel })), !!this.files.size && this.renderUploadedItems(), !!this.files.size && h$1("slot", { key: '26051e329900efc2b29e6d8ebb6b2f1184ec547c', name: "filefooter" }), h$1("slot", { key: 'c9018b5e95065813d29ee08ce924794e1ee476ff', name: "uploadfooter" }), this.captionOnBottom && (h$1("duet-caption", { key: '8fffcc2935df87ccfa5bd89d3df773b9810d2f63', margin: "none", size: "small" }, h$1("div", { key: '17c320b6eeefbd2b5f047b77eb613aa4e912cbdb', class: "upload-bottom-caption" }, caption))), h$1("slot", { key: 'ada6f8c46784788c5900ad5a6dddfebed8a70e39', name: "afterfooter" }), !this.hideButton && (h$1(Fragment, { key: 'f352401910296a33c56ef5bb2e3f0b7e4be0594a' }, h$1("duet-spacer", { key: 'ae4ae0b0490a4e88dab0a7319fd2dde20f05e400', size: "large" }), h$1("duet-button", { key: 'ded36c705e15f44936844d057962cb731d47941c', id: this.buttonId, onClick: this.startUpload, "accessible-controls": identifier, disabled: this.fileMaxReached, "accessible-label": this.accessibleButtonLabel || `${this.buttonLabel}. ${caption}`, "accessible-owns": identifier, size: "small", variation: "secondary", fixed: true, icon: "action-add-circle", part: this.identifier ? `${this.identifier}-button-upload` : "duet-upload-button-upload" }, this.buttonLabel))), (this.fileMaxReached ||
             this.bytesMaxReached ||
             this.filesToUploadExceedsLimit ||
-            this.filesToUploadTotalSizeIsAboveMax) && (h$1(Fragment, { key: 'e649c65801873ad2a2bfa16b63b6f83249f0212b' }, h$1("duet-spacer", { key: 'da7ebf591d35cf11d0ecbb52246bf3e84feb711d', size: "medium" }), h$1("duet-alert", { key: 'e8fdb5af79535f54f65dcf0bebb0ffe5865dc699', part: this.identifier ? `${this.identifier}-error-notification` : "duet-upload-error-notification" }, this.fileMaxReached && getI18nError("duet-upload-301", this.errorCodes), this.bytesMaxReached && getI18nError("duet-upload-202", this.errorCodes), this.filesToUploadExceedsLimit && getI18nError("duet-upload-302", this.errorCodes), this.filesToUploadTotalSizeIsAboveMax && getI18nError("duet-upload-203", this.errorCodes)))), h$1("duet-visually-hidden", { key: '145eb761bd1a288de31527f8cfd1006deb6c2f4d', "aria-hidden": "true" }, h$1("input", { key: '38490151c6483827901990610b2a17ced63c27f6', ref: input => {
+            this.filesToUploadTotalSizeIsAboveMax) && (h$1(Fragment, { key: '385520d7dc48477cea039a0c71f1bcd5e1730cca' }, h$1("duet-spacer", { key: '79ea5d94a4eda84e3f8328a2ac1e42890e0bbde2', size: "medium" }), h$1("duet-alert", { key: '33e5de19e511439a04deeb8478e167558946c4a7', part: this.identifier ? `${this.identifier}-error-notification` : "duet-upload-error-notification" }, this.fileMaxReached && getI18nError("duet-upload-301", this.errorCodes), this.bytesMaxReached && getI18nError("duet-upload-202", this.errorCodes), this.filesToUploadExceedsLimit && getI18nError("duet-upload-302", this.errorCodes), this.filesToUploadTotalSizeIsAboveMax && getI18nError("duet-upload-203", this.errorCodes)))), h$1("duet-visually-hidden", { key: '2fc08bb48c1f47113399c63fd1a81dcef85fc0cf', "aria-hidden": "true" }, h$1("input", { key: '81268132202065717f2e21b1f8dc4ef3e2173394', ref: input => {
                 this.nativeInput = input;
             }, accept: !this.limitSelection ? undefined : `${this.allowedMimetypes},${this.allowedExtensions}`, onBlur: this.onBlur, onFocus: this.onFocus, onChange: e => this.onChange(e), type: "file", class: {
                 "duet-upload": true,

package/lib/dist-custom-elements/duet-visually-hidden.js

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

package/lib/dist-custom-elements/index.js

@@ -2,7 +2,7 @@
  * Built with Duet Design System
  */
 import './p-993aea39.js';
-export { g as getAssetPath, s as setAssetPath, a as setNonce, b as setPlatformOptions } from './p-e7a9cd6f.js';
+export { g as getAssetPath, s as setAssetPath, a as setNonce, b as setPlatformOptions } from './p-1080a6c7.js';
 
 const setupLoggers = () => {
     {

package/lib/dist-custom-elements/{p-962142a6.js → p-02060606.js}

@@ -1,19 +1,19 @@
 /*!
  * Built with Duet Design System
  */
-import { p as proxyCustomElement, H, h } from './p-e7a9cd6f.js';
+import { p as proxyCustomElement, H, h } from './p-1080a6c7.js';
 import { i as inheritGlobalTheme } from './p-aaa7a7bd.js';
 import { g as getLocaleString } from './p-35375593.js';
 import { p as parsePossibleJSON } from './p-9c3c64b9.js';
-import { d as defineCustomElement$9 } from './p-9fb49035.js';
-import { d as defineCustomElement$8 } from './p-8e60819a.js';
-import { d as defineCustomElement$7 } from './p-396dec0e.js';
-import { d as defineCustomElement$6 } from './p-167f1cfd.js';
-import { d as defineCustomElement$5 } from './p-d5f00f7a.js';
-import { d as defineCustomElement$4 } from './p-712259e0.js';
-import { d as defineCustomElement$3 } from './p-c5dd5195.js';
-import { d as defineCustomElement$2 } from './p-25ea4a16.js';
-import { d as defineCustomElement$1 } from './p-18a780a8.js';
+import { d as defineCustomElement$9 } from './p-9a854b9b.js';
+import { d as defineCustomElement$8 } from './p-447bdf9c.js';
+import { d as defineCustomElement$7 } from './p-54a8c7e1.js';
+import { d as defineCustomElement$6 } from './p-2ccad3d5.js';
+import { d as defineCustomElement$5 } from './p-269887e7.js';
+import { d as defineCustomElement$4 } from './p-159ce59f.js';
+import { d as defineCustomElement$3 } from './p-a8859d41.js';
+import { d as defineCustomElement$2 } from './p-5c11ac99.js';
+import { d as defineCustomElement$1 } from './p-f2e41ed9.js';
 
 const getError = (code, errorCodes) => {
     let error = {
@@ -130,9 +130,9 @@ const DuetUploadItem = /*@__PURE__*/ proxyCustomElement(class DuetUploadItem ext
         const { uid, meta, item } = this.data;
         const Badges = meta && meta.badges ? (h("span", null, meta.badges.map(badgeText => (h("duet-badge", { color: "primary" }, badgeText))))) : undefined;
         const actionDescription = `${meta && meta.badges ? meta.badges.join(",") : ""} ${item.name}`;
-        return (h("div", { key: '179fe6956ec8b8b935e73a289c0191de154768b4', class: {
+        return (h("div", { key: '9a4a5dc0a101ccb013a41d6b87a8c9ed8b0e2d7b', class: {
                 "upload-item-row": true,
-            } }, this.showCategory && (h("div", { key: 'b98fbb8879abe956b787710bd8988a535aece789', class: "item-categories" }, h("duet-heading", { key: '39b4c46eda25dc1f5017f7b3ae4770437b91edc1', class: "heading", color: "color-secondary", level: "h6", weight: "semibold" }, getLocaleString(this.categoryLabel)), Badges)), h("div", { key: '05f123dc1a55f5938d0a008337f16b262412f431', class: { "item-name": true, "no-category": !this.showCategory } }, !!this.label && (h("duet-heading", { key: '0825080f168d051916cd4f278dd0f7be3e713a17', class: "heading", color: "color-secondary", level: "h6", weight: "semibold" }, getLocaleString(this.label))), this.getFileNameLine()), h("div", { key: '991a499e99a6df39b0f7895bdd3019acaa751c3a', class: "item-actions" }, this.actions.map(actionItem => {
+            } }, this.showCategory && (h("div", { key: 'ecdfc43a5217eb4b917c54c728c751d7457fc4b8', class: "item-categories" }, h("duet-heading", { key: 'd8ebd5747f8a58146523c31cfe9a145fcaccb673', class: "heading", color: "color-secondary", level: "h6", weight: "semibold" }, getLocaleString(this.categoryLabel)), Badges)), h("div", { key: '8cff3489a1f96f62170c2653c3b10bca450db5e2', class: { "item-name": true, "no-category": !this.showCategory } }, !!this.label && (h("duet-heading", { key: '45f4bbb20e7a4d1f6b3ba0022e54c01c4340a740', class: "heading", color: "color-secondary", level: "h6", weight: "semibold" }, getLocaleString(this.label))), this.getFileNameLine()), h("div", { key: '2e20dafc9e776166217d42e921c942344d61c26f', class: "item-actions" }, this.actions.map(actionItem => {
             return (h("duet-action-button", { actionMeta: Object.assign({}, meta || {}), actionId: uid || null, actionName: actionItem.name, theme: this.theme, iconName: actionItem.icon, iconColor: actionItem.color, iconSize: actionItem.size, background: actionItem.background, "accessible-label": `${actionDescription} ${getLocaleString(actionItem.label)} `, accessibleTitle: this.getActionButtonTitle(actionItem), ref: button => (this.actionButton = button) }));
         }))));
     }

package/lib/dist-custom-elements/{p-c37a3d76.js → p-0323fc27.js}

@@ -1,10 +1,10 @@
 /*!
  * Built with Duet Design System
  */
-import { p as proxyCustomElement, H, h, d as Host } from './p-e7a9cd6f.js';
+import { p as proxyCustomElement, H, h, d as Host } from './p-1080a6c7.js';
 import { i as inheritGlobalTheme } from './p-aaa7a7bd.js';
-import { s as subscribeTabbingChange, u as unsubscribeTabbingChange } from './p-ca700701.js';
-import { d as defineCustomElement$1 } from './p-18a780a8.js';
+import { s as subscribeTabbingChange, u as unsubscribeTabbingChange } from './p-8db11326.js';
+import { d as defineCustomElement$1 } from './p-f2e41ed9.js';
 
 const duetTooltipButtonCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}.duet-tooltip-button{z-index:100;display:inline-block;align-items:center;justify-content:center;min-width:48px;height:48px;padding:0 !important;margin-right:-12px;line-height:normal !important;color:rgb(0, 119, 179);white-space:nowrap;cursor:pointer;background:transparent !important;border-radius:4px}.duet-tooltip-button.duet-theme-turva{color:rgb(198, 12, 48)}.duet-tooltip-button.duet-tooltip-button-negative{color:rgb(255, 255, 255)}.duet-tooltip-button:hover{color:rgb(0, 75, 129)}.duet-tooltip-button:hover.duet-theme-turva{color:rgb(126, 2, 35)}.duet-tooltip-button:hover.duet-tooltip-button-negative{color:rgb(255, 255, 255)}.duet-tooltip-button:focus{background:transparent !important;outline:0}:host(.user-is-tabbing) .duet-tooltip-button:focus{background:transparent !important;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3 !important}:host(.user-is-tabbing) .duet-tooltip-button.duet-theme-turva:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a !important}.duet-tooltip-button svg{width:20px;height:20px;pointer-events:none}.duet-tooltip-button-has-label{margin-right:0}.duet-tooltip-label{position:relative;z-index:100;display:inline-block;max-width:calc(100% - 30px);margin-left:12px !important;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.25;text-align:left;white-space:normal;vertical-align:top}.duet-theme-turva .duet-tooltip-label{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"}";
 const DuetTooltipButtonStyle0 = duetTooltipButtonCss;
@@ -43,12 +43,12 @@ const DuetTooltipButton = /*@__PURE__*/ proxyCustomElement(class DuetTooltipButt
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: '9e42fe5ece18df279fc2f1238b81ed751fcba6e3' }, h("button", { key: '46f7d00f60e8a681f745e888c9dd4eebaae7cdf1', ref: el => (this.buttonElement = el), "aria-controls": this.tooltipId, "aria-expanded": this.active ? "true" : "false", type: "button", class: {
+        return (h(Host, { key: '2a4a781b1045443be8dca56d456bab9ff7d9cdc4' }, h("button", { key: 'da62c139588718b4a57ff95d607cc65683219d20', ref: el => (this.buttonElement = el), "aria-controls": this.tooltipId, "aria-expanded": this.active ? "true" : "false", type: "button", class: {
                 "duet-tooltip-button": true,
                 "duet-tooltip-button-has-label": !!this.label,
                 "duet-theme-turva": this.theme === "turva",
                 "duet-tooltip-button-negative": this.negative,
-            } }, h("svg", { key: 'fc76763237d9e982e4674d8bb638372e67949119', "aria-hidden": "true", role: "img", fill: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '0fb1cf0c4d93b0cabd1330a217a84ef6af2c0851', d: "m13.5 17.25c-1.241 0-2.25-1.009-2.25-2.25v-3.75h-.75c-.414 0-.75-.336-.75-.75s.336-.75.75-.75h.75c.827 0 1.5.673 1.5 1.5v3.75c0 .414.336.75.75.75h.75c.414 0 .75.336.75.75s-.336.75-.75.75z" }), h("circle", { key: '521e808bdf960d1aafd66f16c46aa0d59708f5eb', cx: "11.625", cy: "7.125", r: "1.125" }), h("path", { key: '8292f492ecb67f52b30c7794ca3e7593621e90e4', d: "m12 24c-6.617 0-12-5.383-12-12s5.383-12 12-12 12 5.383 12 12-5.383 12-12 12zm0-22.5c-5.79 0-10.5 4.71-10.5 10.5s4.71 10.5 10.5 10.5 10.5-4.71 10.5-10.5-4.71-10.5-10.5-10.5z" })), this.label ? (h("span", { class: "duet-tooltip-label" }, this.label)) : (h("duet-visually-hidden", null, this.accessibleLabel)))));
+            } }, h("svg", { key: '9464bd42026038aa453d5035bb27519ebd90bae9', "aria-hidden": "true", role: "img", fill: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'fb7040dfd935553c00e6920989b23fc68fb296d5', d: "m13.5 17.25c-1.241 0-2.25-1.009-2.25-2.25v-3.75h-.75c-.414 0-.75-.336-.75-.75s.336-.75.75-.75h.75c.827 0 1.5.673 1.5 1.5v3.75c0 .414.336.75.75.75h.75c.414 0 .75.336.75.75s-.336.75-.75.75z" }), h("circle", { key: 'ac6c40e508076470433d4ddff60250249e6667d6', cx: "11.625", cy: "7.125", r: "1.125" }), h("path", { key: '4994c9b2523e6629b91505cb4aaa8d9a43b6aa9a', d: "m12 24c-6.617 0-12-5.383-12-12s5.383-12 12-12 12 5.383 12 12-5.383 12-12 12zm0-22.5c-5.79 0-10.5 4.71-10.5 10.5s4.71 10.5 10.5 10.5 10.5-4.71 10.5-10.5-4.71-10.5-10.5-10.5z" })), this.label ? (h("span", { class: "duet-tooltip-label" }, this.label)) : (h("duet-visually-hidden", null, this.accessibleLabel)))));
     }
     get element() { return this; }
     static get style() { return DuetTooltipButtonStyle0; }

package/lib/dist-custom-elements/{p-4dd5d18f.js → p-0a566079.js}

@@ -1,23 +1,23 @@
 /*!
  * Built with Duet Design System
  */
-import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-e7a9cd6f.js';
+import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-1080a6c7.js';
 import { f as formSearch } from './p-d004da5f.js';
 import { i as inheritGlobalTheme } from './p-aaa7a7bd.js';
 import { c as createID } from './p-5e59e970.js';
 import { c as cleanValue, r as resetCursor } from './p-df7874f9.js';
-import { b as isEscapeKey, c as isEnterKey, g as isBackspaceKey, h as isArrowLeftKey, j as isArrowRightKey } from './p-ca700701.js';
+import { b as isEscapeKey, c as isEnterKey, h as isBackspaceKey, j as isArrowLeftKey, k as isArrowRightKey } from './p-8db11326.js';
 import { a as getLanguage, c as connectLanguageChangeObserver, d as disconnectLanguageChangeObserver, g as getLocaleString } from './p-35375593.js';
 import { c as checkNamedSlotElement } from './p-f21662ea.js';
-import { d as defineCustomElement$9 } from './p-c90eb69a.js';
-import { d as defineCustomElement$8 } from './p-5d23c028.js';
-import { d as defineCustomElement$7 } from './p-167f1cfd.js';
-import { d as defineCustomElement$6 } from './p-f8c8174f.js';
-import { d as defineCustomElement$5 } from './p-7302dad1.js';
-import { d as defineCustomElement$4 } from './p-fd267007.js';
-import { d as defineCustomElement$3 } from './p-c37a3d76.js';
-import { d as defineCustomElement$2 } from './p-accdf258.js';
-import { d as defineCustomElement$1 } from './p-18a780a8.js';
+import { d as defineCustomElement$9 } from './p-1b3d1a63.js';
+import { d as defineCustomElement$8 } from './p-d74ee462.js';
+import { d as defineCustomElement$7 } from './p-2ccad3d5.js';
+import { d as defineCustomElement$6 } from './p-e95fb79b.js';
+import { d as defineCustomElement$5 } from './p-6617d6ac.js';
+import { d as defineCustomElement$4 } from './p-35014c4b.js';
+import { d as defineCustomElement$3 } from './p-0323fc27.js';
+import { d as defineCustomElement$2 } from './p-6657fbee.js';
+import { d as defineCustomElement$1 } from './p-f2e41ed9.js';
 
 var formEmail={"title":"form-email","tags":"form email","svg":"<svg fill=\"currentColor\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" role=\"img\"><path d=\"M12 23.999c-3.205 0-6.218-1.248-8.484-3.514S.001 15.206.001 12.001s1.248-6.218 3.514-8.485C5.782 1.25 8.795.001 12 .001s6.218 1.248 8.485 3.514A11.92 11.92 0 0 1 24 12v2.25A3.754 3.754 0 0 1 20.25 18a3.77 3.77 0 0 1-3.48-2.365A6.009 6.009 0 0 1 12 18c-3.308 0-6-2.692-6-6s2.692-6 6-6 6 2.692 6 6v2.25c0 1.241 1.009 2.25 2.25 2.25s2.25-1.009 2.25-2.25V12c0-2.804-1.092-5.441-3.075-7.424A10.433 10.433 0 0 0 12 1.501c-2.804 0-5.441 1.092-7.424 3.075S1.501 9.196 1.501 12c0 2.805 1.092 5.441 3.075 7.424s4.619 3.074 7.423 3.074c2.257 0 4.494-.746 6.299-2.1a.749.749 0 1 1 .9 1.199A12.049 12.049 0 0 1 12 23.999zM12 7.5c-2.481 0-4.5 2.019-4.5 4.5s2.019 4.5 4.5 4.5 4.5-2.019 4.5-4.5-2.019-4.5-4.5-4.5z\"/></svg>"};
 

package/lib/dist-custom-elements/{p-fd7b2557.js → p-0a959269.js}

@@ -1,10 +1,10 @@
 /*!
  * Built with Duet Design System
  */
-import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-e7a9cd6f.js';
+import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-1080a6c7.js';
 import { a as actionNewWindowSmall } from './p-f11208c3.js';
 import { i as inheritGlobalTheme } from './p-aaa7a7bd.js';
-import { d as defineCustomElement$1 } from './p-167f1cfd.js';
+import { d as defineCustomElement$1 } from './p-2ccad3d5.js';
 
 const duetPopupMenuItemCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;display:flex;flex-direction:row;gap:8px;align-items:center;justify-content:flex-start}.duet-popup-menu-item{display:flex;flex-grow:1;gap:12px;align-items:center;height:100%;padding:8px;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:1rem;font-weight:400;line-height:1.5;color:rgb(8, 42, 77);text-align:left;text-decoration:none;cursor:pointer}.duet-popup-menu-item:focus{outline:0;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.duet-theme-turva .duet-popup-menu-item:focus,.duet-popup-menu-item:focus.duet-theme-turva{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-popup-menu-item.duet-theme-turva{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(23, 28, 58)}.duet-popup-menu-item.active{background:rgb(240, 247, 250)}.duet-popup-menu-item.active.duet-theme-turva{background:rgb(245, 247, 250)}.duet-popup-menu-item:hover{background:rgb(228, 241, 247)}.duet-popup-menu-item:hover.duet-theme-turva{background:rgb(222, 224, 228)}.duet-popup-menu-item .duet-popup-menu-item-label{flex-grow:1}.duet-popup-menu-item .duet-popup-menu-item-trailing{padding-left:20px}.active-descendant{outline:0;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.duet-theme-turva .active-descendant,.active-descendant.duet-theme-turva{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}";
 const DuetPopupMenuItemStyle0 = duetPopupMenuItemCss;
@@ -76,11 +76,11 @@ const DuetPopupMenuItem = /*@__PURE__*/ proxyCustomElement(class DuetPopupMenuIt
             "duet-theme-turva": this.theme === "turva",
             "active-descendant": this.activeDescendant,
         };
-        return (h(Host, { key: '02e7a087e9f8df28e015c45b2182ab19167c39a2', role: this.accessibleRole }, h(TagName, { key: 'ac6c8e523bb7dbd6ce78dfb8e5ba1a34c765f538', ref: element => (this.itemElement = element), tabIndex: this.accessibleRole === "listitem" ? 0 : -1, onFocus: this.onFocus, onBlur: this.onBlur, role: `${TagName === "a" ? "link" : "button"}`, "aria-label": this.accessibleLabel, class: classes, value: this.value, href: this.url, target: this.external ? "_blank" : undefined, rel: this.external ? "noopener" : undefined, lang: TagName === "button" ? undefined : this.targetLanguage, hreflang: TagName === "button" ? undefined : this.targetLanguage }, this.leadingIcon && (h("duet-icon", { key: '003f72c807601366ce44ba41c92d01cc3867a995', name: this.leadingIcon, size: "x-small", color: this.leadingIconColor ? this.leadingIconColor : "currentColor", class: "duet-popup-menu-item-leading", margin: "none" })), h("span", { key: '5936e48916d5c665070e490074e5310b52ad0cd9', class: "duet-popup-menu-item-label" }, h("slot", { key: '4f365167fa1ae20a9a26f91352791b8b94007088' })), (this.trailingIcon || this.active || (this.url && this.external)) && (h("duet-icon", { key: '52e54059ac3b56ad022ed42085029a58b7010806', name: this.url && this.external
+        return (h(Host, { key: 'bf1b38aa7684c8cc3959b6b0725f83962341d58d', role: this.accessibleRole }, h(TagName, { key: '71cfa30d7780f2ab9a31f2aa3ff4bec91b8e0b7e', ref: element => (this.itemElement = element), tabIndex: this.accessibleRole === "listitem" ? 0 : -1, onFocus: this.onFocus, onBlur: this.onBlur, role: `${TagName === "a" ? "link" : "button"}`, "aria-label": this.accessibleLabel, class: classes, value: this.value, href: this.url, target: this.external ? "_blank" : undefined, rel: this.external ? "noopener" : undefined, lang: TagName === "button" ? undefined : this.targetLanguage, hreflang: TagName === "button" ? undefined : this.targetLanguage }, this.leadingIcon && (h("duet-icon", { key: '3552f0f0e6e303f23e012a9baa0b646d7f3eeb5e', name: this.leadingIcon, size: "x-small", color: this.leadingIconColor ? this.leadingIconColor : "currentColor", class: "duet-popup-menu-item-leading", margin: "none" })), h("span", { key: '1c26c319a37978618960dce5c0e5de9731a576c9', class: "duet-popup-menu-item-label" }, h("slot", { key: 'c3f9e10b0f5c5af06d79ba6760b924f5abfb02d9' })), (this.trailingIcon || this.active || (this.url && this.external)) && (h("duet-icon", { key: '2b5f54ffc9063c6ef1dfb38d59724a1ff9307ede', name: this.url && this.external
                 ? actionNewWindowSmall.title
                 : this.active
                     ? "messaging-checked-small"
-                    : this.trailingIcon, size: (this.url && this.external) || this.active ? "xx-small" : "x-small", color: "currentColor", class: "duet-popup-menu-item-trailing", margin: "none" })), this.trailingText && h("span", { key: '16fb5260a8d79c5b20bc7dcbb0d6fb078d41f0d5', class: "duet-popup-menu-item-trailing" }, this.trailingText))));
+                    : this.trailingIcon, size: (this.url && this.external) || this.active ? "xx-small" : "x-small", color: "currentColor", class: "duet-popup-menu-item-trailing", margin: "none" })), this.trailingText && h("span", { key: 'b9a42c7f906f16c62189ce82f8c1bbdeee169a7e', class: "duet-popup-menu-item-trailing" }, this.trailingText))));
     }
     get element() { return this; }
     static get style() { return DuetPopupMenuItemStyle0; }

package/lib/dist-custom-elements/{p-e7a9cd6f.js → p-1080a6c7.js}

@@ -3,7 +3,7 @@
  */
 const NAMESPACE = 'duet';
 const BUILD = /* duet */ { allRenderFn: true, appendChildSlotFix: false, asyncLoading: true, asyncQueue: false, attachStyles: true, cloneNodeFix: false, cmpDidLoad: true, cmpDidRender: true, cmpDidUnload: false, cmpDidUpdate: true, cmpShouldUpdate: false, cmpWillLoad: true, cmpWillRender: true, cmpWillUpdate: false, connectedCallback: true, constructableCSS: true, cssAnnotations: true, devTools: false, disconnectedCallback: true, element: false, event: true, experimentalScopedSlotChanges: false, experimentalSlotFixes: false, formAssociated: false, hasRenderFn: true, hostListener: true, hostListenerTarget: true, hostListenerTargetBody: true, hostListenerTargetDocument: true, hostListenerTargetParent: false, hostListenerTargetWindow: true, hotModuleReplacement: false, hydrateClientSide: true, hydrateServerSide: false, hydratedAttribute: false, hydratedClass: true, hydratedSelectorName: "hydrated", invisiblePrehydration: false, isDebug: false, isDev: false, isTesting: false, lazyLoad: false, lifecycle: true, lifecycleDOMEvents: false, member: true, method: true, mode: false, observeAttribute: true, profile: false, prop: true, propBoolean: true, propMutable: true, propNumber: true, propString: true, reflect: true, scoped: true, scopedSlotTextContentFix: false, scriptDataOpts: true, shadowDelegatesFocus: true, shadowDom: true, slot: true, slotChildNodesFix: true, slotRelocation: true, state: true, style: true, svg: true, taskQueue: true, updatable: true, vdomAttribute: true, vdomClass: true, vdomFunctional: true, vdomKey: true, vdomListener: true, vdomPropOrAttr: true, vdomRef: true, vdomRender: true, vdomStyle: true, vdomText: true, vdomXlink: true, watchCallback: true };
-const Env = /* duet */ {"cdnURILocal":"http://localhost:3334","cdnURIProd":"https://cdn.duetds.com/api","duetIconVersion":"4.1.7"};
+const Env = /* duet */ {"cdnURILocal":"http://localhost:3334","cdnURIProd":"https://cdn.duetds.com/api","duetIconVersion":"4.1.9"};
 
 /*
  Stencil Client Platform v4.23.0 | MIT Licensed | https://stenciljs.com

package/lib/dist-custom-elements/{p-712259e0.js → p-159ce59f.js}

@@ -1,7 +1,7 @@
 /*!
  * Built with Duet Design System
  */
-import { p as proxyCustomElement, H, h, d as Host } from './p-e7a9cd6f.js';
+import { p as proxyCustomElement, H, h, d as Host } from './p-1080a6c7.js';
 import { i as inheritGlobalTheme } from './p-aaa7a7bd.js';
 import { c as createID } from './p-5e59e970.js';
 import { g as getColorByName } from './p-6e022235.js';
@@ -36,7 +36,7 @@ const DuetParagraph = /*@__PURE__*/ proxyCustomElement(class DuetParagraph exten
         const color = getColorByName(this.color);
         // aria-describedby is to fix accessibility issue in Chrome where duet-paragraphs
         // are not announced when placed inside duet-modal
-        return (h(Host, { key: 'e9f8164c6795c950d1f1340cc8a723113f2e231a', "aria-describedby": this.id }, h("p", { key: '87942327cc0a685a6d1435adc090b8c0aa5c54ac', id: this.id, class: {
+        return (h(Host, { key: '64a84c4df04a399b3f9378b2fc4742c06767e0c3', "aria-describedby": this.id }, h("p", { key: '6d9c8a61f8506ecb6e8e8391ab5d645555e36055', id: this.id, class: {
                 "duet-paragraph": true,
                 "duet-paragraph-small": this.size === "small",
                 "duet-paragraph-semi-bold": this.weight === "semi-bold",
@@ -44,7 +44,7 @@ const DuetParagraph = /*@__PURE__*/ proxyCustomElement(class DuetParagraph exten
                 "duet-m-0": this.margin === "none",
                 [this.variation]: true,
                 "duet-theme-turva": this.theme === "turva",
-            }, style: { color }, part: "duet-paragraph" }, h("slot", { key: '858b0de4a678c0320e76f1479d7e9a7202a749ac' }))));
+            }, style: { color }, part: "duet-paragraph" }, h("slot", { key: '482892006f59215f0d9e7ba05b66bed8c5cee719' }))));
     }
     get element() { return this; }
     static get style() { return DuetParagraphStyle0; }

package/lib/dist-custom-elements/{p-fa2c423f.js → p-195bcbbc.js}

@@ -1,12 +1,12 @@
 /*!
  * Built with Duet Design System
  */
-import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-e7a9cd6f.js';
+import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-1080a6c7.js';
 import { s as spaceXSmall } from './p-4c179c1e.js';
 import { o as offset, f as flip, s as shift, c as computePosition, b as autoUpdate } from './p-81287261.js';
 import { i as inheritGlobalTheme } from './p-aaa7a7bd.js';
 import { f as focusElement } from './p-e30dc66d.js';
-import { b as isEscapeKey, f as isArrowDownKey, e as isArrowUpKey, d as isTabKey } from './p-ca700701.js';
+import { b as isEscapeKey, g as isArrowDownKey, f as isArrowUpKey, d as isTabKey } from './p-8db11326.js';
 import { T as Teleport } from './p-ca3cb21e.js';
 
 const duetPopupMenuCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}.duet-popup-menu-list{position:absolute;top:0;left:0;z-index:950;width:max-content;min-width:175px;padding:8px;margin:0;color:rgb(8, 42, 77);list-style:none;visibility:hidden !important;background:rgb(255, 255, 255);border-radius:8px;box-shadow:0 0 0 1px rgba(0, 0, 0, 0.07), 0 4px 10px 0 rgba(0, 41, 77, 0.15);opacity:0;transition:transform 300ms ease, visibility 300ms ease, opacity 300ms ease;transform:scaleY(0);transform-origin:top center}.duet-popup-menu-list.open{visibility:visible !important;opacity:1;transform:scaleY(1)}.duet-popup-menu-list.fixed{position:fixed}.duet-popup-menu-list.scroll-visible{overflow-y:scroll;scroll-margin:20px}.duet-popup-menu-list.duet-theme-turva{color:rgb(23, 28, 58) !important;background:rgb(255, 255, 255)}::slotted(duet-notification){max-width:360px}";
@@ -257,9 +257,11 @@ const DuetPopupMenu = /*@__PURE__*/ proxyCustomElement(class DuetPopupMenu exten
         return Array.from(this.element.querySelectorAll(":scope duet-popup-menu-item"));
     }
     get popupMenuStyleHeight() {
-        if (this.itemElements.length > 0 && this.scrollLimit) {
+        const selector = ":scope duet-popup-menu-item, :scope duet-notification";
+        const elements = Array.from(this.element.querySelectorAll(selector));
+        if (elements.length > 0 && this.scrollLimit) {
             const paddings = Number(spaceXSmall.replace("px", "")) * 2;
-            return `${this.itemElements[0].offsetHeight * this.scrollLimit + paddings}px`;
+            return `${elements[0].offsetHeight * this.scrollLimit + paddings}px`;
         }
         else {
             return "auto";
@@ -282,14 +284,14 @@ const DuetPopupMenu = /*@__PURE__*/ proxyCustomElement(class DuetPopupMenu exten
             overflowY: "auto",
             height: this.popupMenuStyleHeight,
         };
-        return (h(Host, { key: 'af39c297a7f2c03182e3671d23fc67162e7854e3' }, h("div", { key: '7c8fd36f7f0bbe630e5c47f942327700dd3ad3eb', ref: element => {
+        return (h(Host, { key: 'df95a1ca83bfed0e3c2e62e4de9a03563491b7a4' }, h("div", { key: '0da0cb7b5bf6b0950b867af9d93a8937d40c4223', ref: element => {
                 this.menuElement = element;
             }, style: styles, class: {
                 open: this.open,
                 "duet-popup-menu-list": true,
                 "duet-theme-turva": this.theme === "turva",
                 "scroll-visible": this.scrollLimit < this.itemElements.length,
-            }, role: this.accessibleRole, "aria-label": this.accessibleLabel }, h("slot", { key: '60c5bb890286cbbc5a9a33e8bc3d0fc1888dd193' }))));
+            }, role: this.accessibleRole, "aria-label": this.accessibleLabel }, h("slot", { key: 'f2e56ae51be1d5eb1b8c14a67496079e3dbcd3d1' }))));
     }
     get element() { return this; }
     static get watchers() { return {

package/lib/dist-custom-elements/{p-c90eb69a.js → p-1b3d1a63.js}

@@ -1,14 +1,14 @@
 /*!
  * Built with Duet Design System
  */
-import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-e7a9cd6f.js';
+import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-1080a6c7.js';
 import { i as inheritGlobalTheme } from './p-aaa7a7bd.js';
 import { D as DuetStringsExternalDefaults, a as DuetStringsLoadingDefaults } from './p-9df4cfa4.js';
 import { a as getLanguage, g as getLocaleString, c as connectLanguageChangeObserver, d as disconnectLanguageChangeObserver } from './p-35375593.js';
 import { g as getColorByName } from './p-6e022235.js';
-import { d as defineCustomElement$3 } from './p-167f1cfd.js';
-import { d as defineCustomElement$2 } from './p-7302dad1.js';
-import { d as defineCustomElement$1 } from './p-18a780a8.js';
+import { d as defineCustomElement$3 } from './p-2ccad3d5.js';
+import { d as defineCustomElement$2 } from './p-6617d6ac.js';
+import { d as defineCustomElement$1 } from './p-f2e41ed9.js';
 
 const duetButtonCss = "*,*::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: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{margin-right:0 !important}@media (max-width: 35.9375em){:host{width:100%}}:host(.square){margin-right:12px !important}:host(.square):last-child,:host(.square):last-of-type{margin-right:0 !important}:host(.input-button){z-index:250}:host(.duet-small),:host(.duet-x-small){margin-right:4px !important;margin-bottom:8px !important}:host(.duet-small):last-child,:host(.duet-small):last-of-type,:host(.duet-x-small):last-child,:host(.duet-x-small):last-of-type{margin-right:0 !important}@media (max-width: 35.9375em){:host(.duet-small),:host(.duet-x-small){width:auto}}:host(.duet-x-small){margin-right:2px !important}:host(.duet-x-small):last-child,:host(.duet-x-small):last-of-type{margin-right:0 !important}:host(.square.duet-small),:host(.square.duet-x-small){margin-right:8px !important}:host(.square.duet-small):last-child,:host(.square.duet-small):last-of-type,:host(.square.duet-x-small):last-child,:host(.square.duet-x-small):last-of-type{margin-right:0 !important}:host(.duet-expand){width:100% !important}:host(.duet-m-0){margin:0 !important}:host(.duet-fixed){width:auto !important}:host(:last-child){margin-right:0 !important}.duet-button-container{position:relative;display:block;width:100%}.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{padding:0 !important}.duet-button.duet-m-0{margin:0 !important}.duet-button:focus{outline:0;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.duet-theme-turva .duet-button:focus,.duet-button:focus.duet-theme-turva{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-button.duet-button-size-medium{height:50px;padding-right:30px;padding-left:30px;font-size:1rem;border-radius:25px}.duet-theme-turva .duet-button.duet-button-size-medium{padding-right:24px;padding-left:24px;border-radius:12.5px}.duet-button.duet-button-size-medium.square{border-radius:12.5px}.duet-button.duet-button-size-medium.icon-left{padding-left:24px}.duet-theme-turva .duet-button.duet-button-size-medium.icon-left{padding-left:18px}.duet-button.duet-button-size-medium.icon-right{padding-right:24px}.duet-theme-turva .duet-button.duet-button-size-medium.icon-right{padding-right:18px}.duet-button.duet-button-size-small{height:40px;padding-right:20px;padding-left:20px;font-size:0.875rem;border-radius:20px}.duet-theme-turva .duet-button.duet-button-size-small{padding-right:18px;padding-left:18px;border-radius:10px}.duet-button.duet-button-size-small.square{border-radius:10px}.duet-button.duet-button-size-small.icon-left{padding-left:18px}.duet-theme-turva .duet-button.duet-button-size-small.icon-left{padding-left:14px}.duet-button.duet-button-size-small.icon-right{padding-right:18px}.duet-theme-turva .duet-button.duet-button-size-small.icon-right{padding-right:14px}.duet-button.duet-button-size-x-small{height:32px;padding-right:12px;padding-left:12px;font-size:0.75rem;border-radius:8px}.duet-button.duet-button-size-x-small.icon-left{padding-left:10px}.duet-button.duet-button-size-x-small.icon-right{padding-right:10px}.duet-button.plain.duet-p-0{height:auto}.duet-button:not(.input-button-primary,.input-button-secondary,.input-button-embedded){font-variant-numeric:tabular-nums}.duet-button.duet-button-text-center{text-align:center !important}.duet-button.duet-button-is-small:not(.duet-button-icon-only){min-width:48px}.duet-button.duet-button-is-small: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{padding:0 !important}.duet-theme-turva .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{position:relative;display:flex;gap:10px;align-items:center;margin:0 auto;pointer-events:none}.duet-button .duet-button-contents.icon-right{flex-direction:row-reverse}.duet-button .duet-button-contents .duet-button-contents-slot{position:relative;top:0}.duet-button.duet-no-wrap{white-space:nowrap}.duet-button svg{width:100%;min-width:100%;fill:currentColor}.duet-button .duet-button-icon{display:flex;align-items:center}.duet-button .duet-button-icon duet-icon{width:16px;height:16px}.duet-button .duet-button-icon.large duet-icon{width:20px;height:20px}.duet-button .duet-button-icon.medium-small duet-icon{width:10px;height:10px}.duet-button .duet-button-icon.small duet-icon{width:7px;height:7px}.duet-button:active:not([disabled]){opacity:0.75;transition:none}.duet-button.default{background:rgb(255, 255, 255);border-color:rgb(181, 198, 208)}.duet-theme-turva .duet-button.default{color:rgb(198, 12, 48) !important;border-color:rgb(222, 224, 228)}.duet-button.default:hover{border-color:rgb(0, 119, 179);outline:2px solid rgb(0, 119, 179);outline-offset:-2px}.duet-theme-turva .duet-button.default:hover{border-color:rgb(198, 12, 48);outline-color:rgb(198, 12, 48)}.duet-button.default.duet-button-negative{background-color:rgb(255, 255, 255)}.duet-theme-turva .duet-button.default.duet-button-negative{background-color:rgb(222, 224, 228) !important}.duet-button.default.duet-button-negative:hover{color:rgb(0, 119, 179) !important;border-color:rgb(0, 119, 179)}.duet-theme-turva .duet-button.default.duet-button-negative:hover{color:rgb(198, 12, 48) !important;border-color:rgb(198, 12, 48)}.duet-button.primary,.duet-button.input-button-primary{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{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{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{background:rgb(126, 2, 35);border-color:rgb(126, 2, 35)}.duet-button.primary:focus,.duet-button.input-button-primary: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{box-shadow:0 0 0 1px #fff, 0 0 0 4px rgba(23, 28, 58, 0.75)}.duet-button.secondary,.duet-button.input-button-secondary,.duet-button.input-button-embedded{color:rgb(8, 42, 77) !important;background:transparent;border-color:rgb(8, 42, 77)}.duet-theme-turva .duet-button.secondary,.duet-theme-turva .duet-button.input-button-secondary,.duet-theme-turva .duet-button.input-button-embedded{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{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{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{color:rgb(212, 223, 229) !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{color:rgb(222, 224, 228) !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{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{color:rgb(198, 12, 48) !important;border-color:rgb(198, 12, 48)}.duet-button.input-button-embedded{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{height:auto}.duet-button.negative{color:rgb(8, 42, 77) !important;background:rgb(255, 255, 255);border-color:rgb(255, 255, 255)}.duet-theme-turva .duet-button.negative{color:rgb(23, 28, 58) !important}.duet-button.negative:hover{color:rgb(255, 255, 255) !important;background:transparent;border-color:rgb(255, 255, 255)}.duet-button.negative: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{box-shadow:0 0 0 1px #0077b3, 0 0 0 4px rgba(255, 255, 255, 0.7)}.duet-button.destructive-primary{color:rgb(255, 255, 255) !important;background:rgb(214, 28, 82);border-color:rgb(214, 28, 82)}.duet-theme-turva .duet-button.destructive-primary{color:rgb(255, 255, 255) !important;background:rgb(214, 28, 82);border-color:rgb(214, 28, 82)}.duet-button.destructive-primary:hover{background:#ab1642;border-color:#ab1642;box-shadow:0 4px 20px 0 rgba(34, 34, 34, 0.1)}.duet-theme-turva .duet-button.destructive-primary:hover{background:#ab1642}.duet-button.destructive,.duet-button.destructive-secondary{color:rgb(214, 28, 82) !important;background:rgb(255, 255, 255);border-color:rgb(214, 28, 82)}.duet-theme-turva .duet-button.destructive,.duet-theme-turva .duet-button.destructive-secondary{color:rgb(214, 28, 82) !important;background:rgb(255, 255, 255);border-color:rgb(214, 28, 82)}.duet-button.destructive:hover,.duet-button.destructive-secondary:hover{color:rgb(255, 255, 255) !important;background:#ab1642;border-color:#ab1642}.duet-theme-turva .duet-button.destructive:hover,.duet-theme-turva .duet-button.destructive-secondary:hover{color:rgb(255, 255, 255) !important;background:#ab1642;border-color:#ab1642}.duet-button.plain{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{color:rgb(198, 12, 48) !important;background:transparent;border-color:transparent}.duet-button.plain.duet-p-0 .duet-button-contents{height:auto}.duet-button.plain[disabled]{color:rgb(98, 121, 138) !important;cursor:not-allowed;background:transparent !important;border-color:transparent !important}.duet-theme-turva .duet-button.plain[disabled]{color:transparent !important;cursor:not-allowed;background:transparent !important;border-color:rgb(222, 224, 228) !important}.duet-button.plain:hover{color:rgb(0, 75, 129) !important;background:transparent !important}.duet-theme-turva .duet-button.plain:hover{color:rgb(126, 2, 35) !important}.duet-button.plain.duet-button-negative{color:rgb(255, 255, 255) !important}.duet-theme-turva .duet-button.plain.duet-button-negative{color:rgb(255, 255, 255) !important}.duet-button.plain.duet-button-negative:hover{color:rgba(255, 255, 255, 0.8) !important}.duet-button.duet-button-icon-only{min-width:48px;min-height:48px;padding:0 !important}.duet-button.duet-button-icon-only .duet-button-contents{position:static}.duet-button.duet-button-icon-only .duet-button-icon.left.large,.duet-button.duet-button-icon-only .duet-button-icon.left.medium,.duet-button.duet-button-icon-only .duet-button-icon.left.small{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{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{position:static}.duet-button.duet-button.input-button-primary .duet-button-icon.left.large,.duet-button.duet-button.input-button-primary .duet-button-icon.left.medium,.duet-button.duet-button.input-button-primary .duet-button-icon.left.small,.duet-button.duet-button.input-button-secondary .duet-button-icon.left.large,.duet-button.duet-button.input-button-secondary .duet-button-icon.left.medium,.duet-button.duet-button.input-button-secondary .duet-button-icon.left.small,.duet-button.duet-button.input-button-embedded .duet-button-icon.left.large,.duet-button.duet-button.input-button-embedded .duet-button-icon.left.medium,.duet-button.duet-button.input-button-embedded .duet-button-icon.left.small{position:absolute;top:50% !important;left:50% !important;padding:0;margin:0;transform:translateX(-50%) translateY(-50%)}.duet-button.duet-button.input-button-embedded{border-left-width:0}.duet-button.square{width:52px;min-width:auto !important;padding:0 !important;font-size:1rem;border-color:rgb(181, 198, 208);border-width:1px}.duet-button.square.duet-button-size-small{width:42px;font-size:0.875rem}.duet-button.square.duet-button-size-x-small{width:34px;font-size:0.875rem}.duet-button.square.duet-button-negative{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{color:rgb(255, 255, 255) !important;background:rgb(198, 12, 48);border-color:rgb(198, 12, 48)}.duet-theme-turva .duet-button.square{border-color:rgb(222, 224, 228)}.duet-button.square:hover{border-color:rgb(0, 119, 179);outline:2px solid rgb(0, 119, 179);outline-offset:-2px}.duet-theme-turva .duet-button.square:hover{border-color:rgb(198, 12, 48);outline-color:rgb(198, 12, 48)}.duet-button.square .duet-button-contents{gap:0}.duet-button[disabled],.duet-button[disabled]:hover,.duet-button.duet-button-negative[disabled],.duet-button.duet-button-negative[disabled]:hover{color:rgb(98, 121, 138) !important;cursor:not-allowed;background:rgb(212, 223, 229) !important;border-color:rgb(212, 223, 229) !important;outline-color:rgb(212, 223, 229) !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{color:rgb(143, 147, 158) !important;cursor:not-allowed;background:rgb(222, 224, 228) !important;border-color:rgb(222, 224, 228) !important;outline-color:rgb(222, 224, 228) !important}.duet-button-is-loading.primary,.duet-button-is-loading.input-button-primary{color:rgb(255, 255, 255)}.duet-button-is-loading.default{color:rgb(0, 119, 179)}.duet-button-is-loading.default.duet-theme-turva{color:rgb(198, 12, 48)}.duet-button-is-loading .duet-button-contents{visibility:hidden;opacity:0}";
 const DuetButtonStyle0 = duetButtonCss;

package/lib/dist-custom-elements/{p-64b0aebd.js → p-1e473975.js}

@@ -1,7 +1,7 @@
 /*!
  * Built with Duet Design System
  */
-import { p as proxyCustomElement, H, h } from './p-e7a9cd6f.js';
+import { p as proxyCustomElement, H, h } from './p-1080a6c7.js';
 import { i as inheritGlobalTheme } from './p-aaa7a7bd.js';
 import { w as watchForOptions } from './p-7d8a2628.js';
 
@@ -79,7 +79,7 @@ const DuetList = /*@__PURE__*/ proxyCustomElement(class DuetList extends H {
      * Always the last one in the class.
      */
     render() {
-        return (h("dl", { key: 'be789bab546df8b0ac070d09a5f5c47f5f428afe', class: { "duet-list-component": true, "duet-m-0": this.margin === "none" } }, h("slot", { key: '645ee0c7c623eeed042e25ac2ea7aab51ef1a2bc' })));
+        return (h("dl", { key: 'fb75b5a512a993e8478f5c82e38b8b82a5e199cc', class: { "duet-list-component": true, "duet-m-0": this.margin === "none" } }, h("slot", { key: 'b8c6ed37ea89e194ef5a2f9fb603b60cd204ff69' })));
     }
     get element() { return this; }
     static get watchers() { return {

package/lib/dist-custom-elements/{p-d5f00f7a.js → p-269887e7.js}

@@ -1,14 +1,14 @@
 /*!
  * Built with Duet Design System
  */
-import { p as proxyCustomElement, H, h, F as Fragment, d as Host } from './p-e7a9cd6f.js';
+import { p as proxyCustomElement, H, h, F as Fragment, d as Host } from './p-1080a6c7.js';
 import { a as actionNewWindowSmall } from './p-f11208c3.js';
 import { D as DuetStringsExternalDefaults, b as DuetStringsDownloadLinkDefaults } from './p-9df4cfa4.js';
 import { i as inheritGlobalTheme } from './p-aaa7a7bd.js';
 import { g as getAccessibleLinkLabel } from './p-1e3171d9.js';
 import { a as getLanguage, g as getLocaleString, c as connectLanguageChangeObserver, d as disconnectLanguageChangeObserver } from './p-35375593.js';
 import { g as getColorByName } from './p-6e022235.js';
-import { d as defineCustomElement$1 } from './p-167f1cfd.js';
+import { d as defineCustomElement$1 } from './p-2ccad3d5.js';
 
 var actionArrowRight={"title":"action-arrow-right","tags":"action arrow right caret","svg":"<svg fill=\"currentColor\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\" role=\"img\"><path d=\"M5.499 24a.752.752 0 0 1-.53-1.281L15.689 12 4.969 1.28c-.142-.141-.22-.33-.22-.53s.078-.389.22-.53c.141-.142.33-.22.53-.22s.389.078.53.22l10.72 10.72a1.5 1.5 0 0 1 .001 2.119L6.029 23.78a.743.743 0 0 1-.53.22z\"/></svg>"};
 
@@ -112,10 +112,10 @@ const DuetLink = /*@__PURE__*/ proxyCustomElement(class DuetLink extends H {
     render() {
         const Tag = !this.url ? "button" : "a";
         const isButton = Tag === "button";
-        return (h(Host, { key: '6bcdceb6f32843e5474b9a1d00f9afef631afc5b', class: {
+        return (h(Host, { key: '70bc31e1d10efda3453e16b689e38d3a4834a4bc', class: {
                 [`duet-link-${this.variation}`]: true,
                 "duet-m-0": this.margin === "none",
-            } }, h(Tag, { key: '8e65e4745097d5253535f228d9a2d61f9961cceb', href: this.url, class: {
+            } }, h(Tag, { key: '1989da3829486cf23e4a50a7e36d93156f816404', href: this.url, class: {
                 "duet-link": true,
                 "duet-link-is-external": this.external,
                 "duet-link-is-download": !!this.download,

package/lib/dist-custom-elements/{p-86494dae.js → p-283c8c77.js}

@@ -1,15 +1,15 @@
 /*!
  * Built with Duet Design System
  */
-import { p as proxyCustomElement, H, h, d as Host } from './p-e7a9cd6f.js';
+import { p as proxyCustomElement, H, h, d as Host } from './p-1080a6c7.js';
 import { i as inheritGlobalTheme } from './p-aaa7a7bd.js';
 import { h as hasSlot, a as getElementsFromDefaultSlot } from './p-f21662ea.js';
-import { d as defineCustomElement$4 } from './p-c90eb69a.js';
-import { d as defineCustomElement$3 } from './p-167f1cfd.js';
-import { d as defineCustomElement$2 } from './p-7302dad1.js';
-import { d as defineCustomElement$1 } from './p-18a780a8.js';
+import { d as defineCustomElement$4 } from './p-1b3d1a63.js';
+import { d as defineCustomElement$3 } from './p-2ccad3d5.js';
+import { d as defineCustomElement$2 } from './p-6617d6ac.js';
+import { d as defineCustomElement$1 } from './p-f2e41ed9.js';
 
-const duetScrollableCss = "*,*::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;-webkit-tap-highlight-color:transparent}:host{position:relative !important}:host .duet-scrollable-items{position:relative;display:flex}:host .duet-scrollable-items .duet-scrollable-fade-overlay{position:absolute;bottom:0;z-index:250;display:block;width:10px;height:100%;pointer-events:none;transition:transform 300ms ease}:host .duet-scrollable-items .duet-scrollable-fade-overlay--hidden{display:none}:host .duet-scrollable-items:not(.buttons) .duet-scrollable-fade-overlay{}:host .duet-scrollable-items:not(.buttons) .duet-scrollable-fade-overlay.left{left:calc(0px - 10px);background-image:linear-gradient(to right, rgb(255, 255, 255), rgba(255, 255, 255, 0))}:host .duet-scrollable-items:not(.buttons) .duet-scrollable-fade-overlay.right{right:calc(0px - 10px);background-image:linear-gradient(to left, rgb(255, 255, 255), rgba(255, 255, 255, 0))}:host .duet-scrollable-items.buttons .duet-scrollable-fade-overlay.left{left:calc(40px - 10px);background-image:linear-gradient(to right, rgb(255, 255, 255), rgba(255, 255, 255, 0))}:host .duet-scrollable-items.buttons .duet-scrollable-fade-overlay.right{right:calc(40px - 10px);background-image:linear-gradient(to left, rgb(255, 255, 255), rgba(255, 255, 255, 0))}:host .duet-scrollable-items.buttons .duet-scrollable-button-container{position:relative;flex:0 0 auto;flex-basis:40px}:host .duet-scrollable-items.buttons .duet-scrollable-button-container--occluded{flex-basis:0;flex-shrink:1;width:0;padding:10px 0;overflow:hidden;visibility:hidden}:host .duet-scrollable-items.buttons .duet-scrollable-button-container--absolute{position:absolute;top:0;z-index:202;width:auto;height:100%;padding:0 16px;background-color:rgb(255, 255, 255)}:host .duet-scrollable-items.buttons .duet-scrollable-button-container--absolute.left{left:-10px}:host .duet-scrollable-items.buttons .duet-scrollable-button-container--absolute.right{right:-10px}:host .duet-scrollable-items.buttons .duet-scrollable-button-container .duet-scrollable-button{position:absolute;display:flex;flex:0 0 auto;flex-basis:40px;align-items:center;height:100%;cursor:pointer;transition:transform 300ms ease}:host .duet-scrollable-items.buttons .duet-scrollable-button-container .duet-scrollable-button:active duet-icon{transition:transform 300ms ease;transform:scale(0.8)}:host .duet-scrollable-items.buttons .duet-scrollable-button-container .duet-scrollable-button--left{left:0;padding:10px 10px 10px 0}:host .duet-scrollable-items.buttons .duet-scrollable-button-container .duet-scrollable-button--right{right:0;padding:10px 0 10px 10px}:host .duet-scrollable-items.buttons .duet-scrollable-button-container .duet-scrollable-button--top{align-items:flex-start}:host .duet-scrollable-items.buttons .duet-scrollable-button-container .duet-scrollable-button--bottom{align-items:flex-end}:host .duet-scrollable-items.buttons .duet-scrollable-button-container .duet-scrollable-button--absolute{padding:0 7px;border:1px solid rgb(212, 223, 229)}:host .duet-scrollable-items.buttons .duet-scrollable-button-container .duet-scrollable-button--absolute.duet-scrollable-button--left{border-radius:8px 0 0 8px}:host .duet-scrollable-items.buttons .duet-scrollable-button-container .duet-scrollable-button--absolute.duet-scrollable-button--right{border-radius:0 8px 8px 0}:host .duet-scrollable-items.buttons .duet-scrollable-button-container .duet-scrollable-button--absolute:hover{border-color:rgb(0, 119, 179);border-width:2px;}.duet-theme-turva :host .duet-scrollable-items.buttons .duet-scrollable-button-container .duet-scrollable-button--absolute:hover{border-color:rgb(113, 118, 132)}:host .duet-scrollable-items.buttons .duet-scrollable-button-container .duet-scrollable-button[hidden]{display:none !important}:host .duet-scrollable-items.duet-theme-turva .duet-scrollable-button-container .duet-scrollable-button--absolute:hover{border-color:rgb(113, 118, 132)}:host .duet-scrollable-items .duet-scrollable-list{display:flex;flex-wrap:nowrap;padding-right:10px;padding-left:10px;margin:0 -10px;overflow-x:auto;overflow-y:hidden;white-space:nowrap;scroll-snap-type:x mandatory;scroll-behavior:smooth;scroll-margin:0 20px;-ms-overflow-style:-ms-autohiding-scrollbar;-webkit-overflow-scrolling:touch;}:host .duet-scrollable-items .duet-scrollable-list:not(.buttons){white-space:normal}:host .duet-scrollable-items .duet-scrollable-list::-webkit-scrollbar{display:none}:host .duet-scrollable-items .duet-scrollable-list.collapsed{flex-wrap:wrap}:host .duet-scrollable-items .duet-scrollable-list.gap-none{gap:0}:host .duet-scrollable-items .duet-scrollable-list.gap-large{gap:20px}:host .duet-scrollable-items .duet-scrollable-list.duet-overflow-padding--xx-small{padding-top:4px;padding-bottom:4px}:host .duet-scrollable-items .duet-scrollable-list.duet-overflow-padding--x-small{padding-top:8px;padding-bottom:8px}:host .duet-scrollable-items .duet-scrollable-list.duet-overflow-padding--small{padding-top:12px;padding-bottom:12px}:host .duet-scrollable-items .duet-scrollable-list.duet-overflow-padding--medium{padding-top:16px;padding-bottom:16px}:host .duet-scrollable-items.center{justify-content:center}:host .duet-scrollable-items.center .duet-scrollable-list.collapsed{justify-content:center}.collapse{width:100%;text-align:center}.collapse.hide{visibility:hidden}::slotted(*){flex-shrink:0;margin-left:0;-webkit-transition:-webkit-transform 0.2s ease-in-out;transition:-webkit-transform 0.2s ease-in-out;transition:transform 0.2s ease-in-out;transition:transform 0.2s ease-in-out, -webkit-transform 0.2s ease-in-out;scroll-snap-align:center}";
+const duetScrollableCss = "*,*::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;-webkit-tap-highlight-color:transparent}:host{position:relative !important}:host .duet-scrollable-items{position:relative;display:flex}:host .duet-scrollable-items.buttons .duet-scrollable-button-container{position:relative;flex:0 0 auto;flex-basis:40px}:host .duet-scrollable-items.buttons .duet-scrollable-button-container--occluded{flex-basis:0;flex-shrink:1;width:0;padding:10px 0;overflow:hidden;visibility:hidden}:host .duet-scrollable-items.buttons .duet-scrollable-button-container--absolute{position:absolute;top:0;z-index:202;width:auto;height:100%;padding:0 16px;background-color:rgb(255, 255, 255)}:host .duet-scrollable-items.buttons .duet-scrollable-button-container--absolute.left{left:-2px}:host .duet-scrollable-items.buttons .duet-scrollable-button-container--absolute.right{right:-2px}:host .duet-scrollable-items.buttons .duet-scrollable-button-container .duet-scrollable-button{position:absolute;display:flex;flex:0 0 auto;flex-basis:40px;align-items:center;height:100%;cursor:pointer;transition:transform 300ms ease}:host .duet-scrollable-items.buttons .duet-scrollable-button-container .duet-scrollable-button:active duet-icon{transition:transform 300ms ease;transform:scale(0.8)}:host .duet-scrollable-items.buttons .duet-scrollable-button-container .duet-scrollable-button--left{left:0;padding:10px 10px 10px 0}:host .duet-scrollable-items.buttons .duet-scrollable-button-container .duet-scrollable-button--right{right:0;padding:10px 0 10px 10px}:host .duet-scrollable-items.buttons .duet-scrollable-button-container .duet-scrollable-button--top{align-items:flex-start}:host .duet-scrollable-items.buttons .duet-scrollable-button-container .duet-scrollable-button--bottom{align-items:flex-end}:host .duet-scrollable-items.buttons .duet-scrollable-button-container .duet-scrollable-button--absolute{padding:0 7px;border:1px solid rgb(212, 223, 229)}:host .duet-scrollable-items.buttons .duet-scrollable-button-container .duet-scrollable-button--absolute.duet-scrollable-button--left{border-radius:8px 0 0 8px}:host .duet-scrollable-items.buttons .duet-scrollable-button-container .duet-scrollable-button--absolute.duet-scrollable-button--right{border-radius:0 8px 8px 0}:host .duet-scrollable-items.buttons .duet-scrollable-button-container .duet-scrollable-button--absolute:hover{border-color:rgb(0, 119, 179);border-width:2px;}.duet-theme-turva :host .duet-scrollable-items.buttons .duet-scrollable-button-container .duet-scrollable-button--absolute:hover{border-color:rgb(113, 118, 132)}:host .duet-scrollable-items.buttons .duet-scrollable-button-container .duet-scrollable-button[hidden]{display:none !important}:host .duet-scrollable-items.duet-theme-turva .duet-scrollable-button-container .duet-scrollable-button--absolute:hover{border-color:rgb(113, 118, 132)}:host .duet-scrollable-items .duet-scrollable-list{display:flex;flex-wrap:nowrap;padding-inline:10px;margin-inline:-10px;overflow-x:auto;overflow-y:hidden;white-space:nowrap;scroll-snap-type:x mandatory;scroll-behavior:smooth;scroll-margin:0 20px;-ms-overflow-style:-ms-autohiding-scrollbar;-webkit-overflow-scrolling:touch;-webkit-mask:linear-gradient(to right, transparent 0, #fff 10px), linear-gradient(to left, transparent 0, #fff 10px);-webkit-mask-size:50% 100%, 50% 100%;-webkit-mask-position:left, right;-webkit-mask-repeat:no-repeat;mask:linear-gradient(to right, transparent 0, #fff 10px), linear-gradient(to left, transparent 0, #fff 10px);mask-size:50% 100%, 50% 100%;mask-position:left, right;mask-repeat:no-repeat;}:host .duet-scrollable-items .duet-scrollable-list--absolute{padding-inline:2px;margin-inline:-2px;-webkit-mask:none !important;mask:none !important}:host .duet-scrollable-items .duet-scrollable-list:not(.buttons){white-space:normal}:host .duet-scrollable-items .duet-scrollable-list::-webkit-scrollbar{display:none}:host .duet-scrollable-items .duet-scrollable-list.collapsed{flex-wrap:wrap}:host .duet-scrollable-items .duet-scrollable-list.gap-none{gap:0}:host .duet-scrollable-items .duet-scrollable-list.gap-large{gap:20px}:host .duet-scrollable-items .duet-scrollable-list.duet-overflow-padding--xx-small{padding-top:4px;padding-bottom:4px}:host .duet-scrollable-items .duet-scrollable-list.duet-overflow-padding--x-small{padding-top:8px;padding-bottom:8px}:host .duet-scrollable-items .duet-scrollable-list.duet-overflow-padding--small{padding-top:12px;padding-bottom:12px}:host .duet-scrollable-items .duet-scrollable-list.duet-overflow-padding--medium{padding-top:16px;padding-bottom:16px}:host .duet-scrollable-items.center{justify-content:center}:host .duet-scrollable-items.center .duet-scrollable-list.collapsed{justify-content:center}.collapse{width:100%;text-align:center}.collapse.hide{visibility:hidden}::slotted(*){flex-shrink:0;margin-left:0;-webkit-transition:-webkit-transform 0.2s ease-in-out;transition:-webkit-transform 0.2s ease-in-out;transition:transform 0.2s ease-in-out;transition:transform 0.2s ease-in-out, -webkit-transform 0.2s ease-in-out;scroll-snap-align:center}";
 const DuetScrollableStyle0 = duetScrollableCss;
 
 const DuetScrollable = /*@__PURE__*/ proxyCustomElement(class DuetScrollable extends H {
@@ -29,7 +29,8 @@ const DuetScrollable = /*@__PURE__*/ proxyCustomElement(class DuetScrollable ext
          */
         this.resizeObserver = new ResizeObserver(entries => {
             if ((entries === null || entries === void 0 ? void 0 : entries.length) === 1) {
-                this.checkScrollingNeeded(entries[0].target);
+                const threshold = this.buttonPosition === "absolute" ? 0 : 5;
+                this.checkScrollingNeeded(entries[0].target, threshold);
             }
         });
         this.collapsedOnClick = () => {
@@ -63,7 +64,8 @@ const DuetScrollable = /*@__PURE__*/ proxyCustomElement(class DuetScrollable ext
     componentDidLoad() {
         requestAnimationFrame(() => {
             if (this.scrollPaneElement) {
-                this.checkScrollingNeeded();
+                const threshold = this.buttonPosition === "absolute" ? 0 : 5;
+                this.checkScrollingNeeded(this.scrollPaneElement, threshold);
                 this.updateScrollButtons();
                 this.resizeObserver.observe(this.scrollPaneElement);
             }
@@ -80,15 +82,20 @@ const DuetScrollable = /*@__PURE__*/ proxyCustomElement(class DuetScrollable ext
     }
     /**
      * Check if scrolling is needed.
+     *
+     * @param element - The element to check.
+     * @param threshold - The threshold to allow content to be slightly wider before showing buttons.
+     *                    Defaults to half of the overlay width, since gradient is 10px wide with 50/50 split.
      */
-    checkScrollingNeeded(element = this.scrollPaneElement, threshold = 10) {
+    checkScrollingNeeded(element = this.scrollPaneElement, threshold = 5) {
+        var _a;
         if (!element) {
             return;
         }
-        const scrollPaneWidth = element.getBoundingClientRect().width;
-        const totalContentWidth = element.scrollWidth;
-        this.needsScrolling = totalContentWidth > scrollPaneWidth + threshold;
-        // Update scroll buttons whenever we check if scrolling is needed
+        const parentWidth = ((_a = element.parentElement) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect().width) || 0;
+        const contentWidth = element.scrollWidth;
+        const overlayWidth = 10 * 2;
+        this.needsScrolling = contentWidth - overlayWidth > parentWidth + threshold;
         if (!this.needsScrolling) {
             this.scrollPaneAtStart = true;
             this.scrollPaneAtEnd = true;
@@ -192,13 +199,6 @@ const DuetScrollable = /*@__PURE__*/ proxyCustomElement(class DuetScrollable ext
         const last = this.getLastVisibleElement();
         this.scrollToElement(last + 1, "center");
     }
-    renderFadeOverlay(direction) {
-        return (h("div", { class: {
-                "duet-scrollable-fade-overlay": true,
-                "duet-scrollable-fade-overlay--hidden": !this.needsScrolling,
-                [`${direction}`]: true,
-            } }));
-    }
     renderButton(direction) {
         const arrowColor = this.theme === "turva" ? "color-primary-darker-turva" : "color-primary";
         const arrowColorDisabled = this.theme === "turva" ? "color-gray-turva" : "color-gray";
@@ -233,24 +233,25 @@ const DuetScrollable = /*@__PURE__*/ proxyCustomElement(class DuetScrollable ext
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: 'b504fd4028c66cb3f252f2457231201e8637e39d', class: {
+        return (h(Host, { key: 'f9d32985477e8239420fb052f9f621f9f8990f87', class: {
                 "duet-theme-turva": this.theme === "turva",
                 "duet-theme-default": this.theme === "default",
-            } }, this.hasCollapseButtonLabelSlot && (h("div", { key: 'a0c7fefc5d30e27c1fae3999c2966a3fcad784ac', class: {
+            } }, this.hasCollapseButtonLabelSlot && (h("div", { key: 'ba59942211ad1695d127b0523114e7a1f9e49e06', class: {
                 collapse: true,
                 hide: !this.needsScrolling && !this.collapsed,
-            } }, h("duet-button", { key: '84516dfa33b911b6d44b4ebc4a6bdb50bb453ac5', variation: "plain", margin: "none", "center-text": true, onClick: () => this.collapsedOnClick() }, h("slot", { key: 'fb5655a9fd34b75aad1058661758f82348a4a095', name: "collapse-button-label" })))), h("div", { key: 'd1e2cb7e141339d16c3b751ac6038be0a0249756', class: {
+            } }, h("duet-button", { key: '76946873948e27b8d40469f07a47ad3e90523b8d', variation: "plain", margin: "none", "center-text": true, onClick: () => this.collapsedOnClick() }, h("slot", { key: '05fec97266546725966d97fce471e9fe17a9ca39', name: "collapse-button-label" })))), h("div", { key: '60cc97e2e4231e59a28bd09f51652af060ef6e24', class: {
                 "duet-scrollable-items": true,
                 buttons: this.buttons,
                 center: this.center,
                 "duet-theme-turva": this.theme === "turva",
-            } }, this.buttons && this.renderButton("left"), this.buttonPosition !== "absolute" && this.renderFadeOverlay("left"), h("div", { key: '88ca7b1fee44baad88a375c3ce3c6771950676da', class: {
+            } }, this.buttons && this.renderButton("left"), h("div", { key: 'eebe387b2c90a47647bdd16514dfe79fbe2f6436', class: {
                 "duet-scrollable-list": true,
                 [`duet-scrollable-list--${this.buttonPosition}`]: true,
                 [`gap-${this.gap}`]: true,
                 collapsed: this.collapsed,
                 [`duet-overflow-padding--${this.padding}`]: this.padding !== "none",
-            }, onScroll: () => this.updateScrollButtons(), ref: element => (this.scrollPaneElement = element) }, h("slot", { key: '7897d6cc44537da418aab9644667129fdecef8b5' })), this.buttonPosition !== "absolute" && this.renderFadeOverlay("right"), this.buttons && this.renderButton("right"))));
+                [`duet-scrollable-list--${this.buttonPosition}`]: this.buttonPosition === "absolute",
+            }, onScroll: () => this.updateScrollButtons(), ref: element => (this.scrollPaneElement = element) }, h("slot", { key: '365952437c69244c0bd5e4917c3711a300e7509e' })), this.buttons && this.renderButton("right"))));
     }
     get element() { return this; }
     static get watchers() { return {