@getflip/swirl-components 0.307.0 → 0.309.0

package/dist/cjs/swirl-app-layout_5.cjs.entry.js

@@ -383,7 +383,7 @@ const SwirlEmptyState = class {
             "empty-state--has-controls": hasControls,
             "empty-state--has-slotted-illustration": hasSlottedIllustration,
         });
-        return (index.h(index.Host, { key: '286c730a3fadeaf72a36a6f73d9fc880f2fd9c02' }, index.h("div", { key: 'be9336531a7847c52744dd36589cee036868ca43', class: className }, this.illustration && !hasSlottedIllustration && (index.h("img", { key: '66fab130e08d74d17747a2102763a4674e13801e', alt: "", class: "empty-state__illustration", src: this.illustration })), index.h("div", { key: '595cd0b45540fc83465a3658aa5a359daf656ecf', class: "empty-state__slotted-illustration" }, index.h("slot", { key: '982563b416cbd955c18a2d363e5b896bb8bd042d', name: "illustration" })), index.h("div", { key: '25ae1dab82e2e2e23a540f538ade26fb96be9792', class: "empty-state__body" }, index.h("swirl-stack", { key: 'dadc5ec9c0b08c89bf978f4b2863c1855ff413e1', align: "stretch", spacing: "8" }, this.heading && (index.h("swirl-heading", { key: '51a8ed0830df3f13ca39d4510f14a371838a22cc', align: "center", as: "p", level: 4, text: this.heading })), index.h("div", { key: '1c4921010535e1e7ef104fee151fe15df6980ec3', class: "empty-state__content" }, index.h("swirl-text", { key: '482956169cbbc7784fe5f56470fc2b28e5028212', align: "center", color: "subdued" }, index.h("slot", { key: '4b1cf923b92a366e9f987841d726dc7f59bc292a' })))), index.h("div", { key: 'cca112fd02b3118f46db3c4f4baf883ca7432231', class: "empty-state__controls" }, index.h("slot", { key: '87c4bc50c92830fc64abc393c64309a0a4664d50', name: "controls" }))))));
+        return (index.h(index.Host, { key: 'c408d7bb8dc59304e0a734fab8a7206b0888aa6e' }, index.h("div", { key: 'a2c05e810b83c523a656d1f180b28a1c877d8d47', class: className }, this.illustration && !hasSlottedIllustration && (index.h("img", { key: '77b154b7fbb550e2fb6224e8b02f9734e0478bce', alt: "", class: "empty-state__illustration", src: this.illustration })), index.h("div", { key: 'f315e5fbb6c2f618fdf8044fa12bcf4986fab244', class: "empty-state__slotted-illustration" }, index.h("slot", { key: '36def917ad3f786684e7e6ddcf5245d953e1532e', name: "illustration" })), index.h("div", { key: 'c878ffa444942d4d008d91bb0584c85d54b11a9c', class: "empty-state__body" }, index.h("swirl-stack", { key: '5e3eba6a14feae9ffd56269bf2e9de2f0efcc421', align: "stretch", spacing: "8" }, this.heading && (index.h("swirl-heading", { key: '25c15811c899b0ff446faea4e6b2805b1d8b8ffe', align: "center", as: "p", level: 4, text: this.heading })), index.h("div", { key: 'a6e37e1fb802e3319d6c3730dc7d98817808c271', class: "empty-state__content" }, index.h("swirl-text", { key: '6ec54e9999dcc00a6ce4aeb3b2be52ded7484013', align: "center", color: "subdued" }, index.h("slot", { key: 'b883a52b33e55de4aa72c149100c659430d3504b' })))), index.h("div", { key: '2116877fe43559d2ea489d80e9172aeab2d599ed', class: "empty-state__controls" }, index.h("slot", { key: 'c6765e152cb9e666eb37beb09077c1e6c16beacc', name: "controls" }))))));
     }
     get el() { return index.getElement(this); }
 };
@@ -404,7 +404,7 @@ const SwirlIconFolderShared = class {
             color: Boolean(this.color) ? `var(--s-icon-${this.color})` : undefined,
         };
         const className = index$1.classnames("swirl-icon", `swirl-icon--size-${this.size}`);
-        return (index.h("svg", { key: '6c9beabb2082824e4dcc92f571f55458829045bb', "aria-hidden": "true", class: className, fill: "none", height: this.size, part: "icon", style: styles, viewBox: `0 0 ${viewBoxSize} ${viewBoxSize}`, width: this.size, xmlns: "http://www.w3.org/2000/svg" }, this.size === 16 && (index.h(index.Fragment, { key: 'ae170cd5f9f37f41c2445ad23f6108b1eb6cdf91' }, index.h("path", { key: '8408d06603a16acec43a0b68b94b446d7271b2ca', d: "M9.99998 8.66669C10.3666 8.66669 10.6806 8.53602 10.942 8.27469C11.2029 8.0138 11.3333 7.70002 11.3333 7.33335C11.3333 6.96669 11.2029 6.65269 10.942 6.39135C10.6806 6.13046 10.3666 6.00002 9.99998 6.00002C9.63331 6.00002 9.31953 6.13046 9.05865 6.39135C8.79731 6.65269 8.66665 6.96669 8.66665 7.33335C8.66665 7.70002 8.79731 8.0138 9.05865 8.27469C9.31953 8.53602 9.63331 8.66669 9.99998 8.66669ZM7.33331 11.3334H12.6666V10.9667C12.6666 10.4667 12.4222 10.0694 11.9333 9.77469C11.4444 9.48046 10.8 9.33335 9.99998 9.33335C9.19998 9.33335 8.55553 9.48046 8.06665 9.77469C7.57776 10.0694 7.33331 10.4667 7.33331 10.9667V11.3334ZM2.66665 13.3334C2.29998 13.3334 1.9862 13.2029 1.72531 12.942C1.46398 12.6807 1.33331 12.3667 1.33331 12V4.00002C1.33331 3.63335 1.46398 3.31958 1.72531 3.05869C1.9862 2.79735 2.29998 2.66669 2.66665 2.66669H6.11665C6.29442 2.66669 6.46398 2.70002 6.62531 2.76669C6.7862 2.83335 6.92776 2.9278 7.04998 3.05002L7.99998 4.00002H13.3333C13.7 4.00002 14.014 4.13069 14.2753 4.39202C14.5362 4.65291 14.6666 4.96669 14.6666 5.33335V12C14.6666 12.3667 14.5362 12.6807 14.2753 12.942C14.014 13.2029 13.7 13.3334 13.3333 13.3334H2.66665ZM2.66665 4.00002V12H13.3333V5.33335H7.44998L6.11665 4.00002H2.66665Z", fill: "currentColor" }))), (this.size === 20 || this.size === 24) && (index.h(index.Fragment, { key: 'f348acb138eacdce65b96361b310b4d2e334dd70' }, index.h("path", { key: '42b67d8bb8a1bcbe40b1c91c8a8b900ff61c9c8b', d: "M15 13C15.55 13 16.021 12.804 16.413 12.412C16.8043 12.0207 17 11.55 17 11C17 10.45 16.8043 9.979 16.413 9.587C16.021 9.19567 15.55 9 15 9C14.45 9 13.9793 9.19567 13.588 9.587C13.196 9.979 13 10.45 13 11C13 11.55 13.196 12.0207 13.588 12.412C13.9793 12.804 14.45 13 15 13ZM11 17H19V16.45C19 15.7 18.6333 15.104 17.9 14.662C17.1667 14.2207 16.2 14 15 14C13.8 14 12.8333 14.2207 12.1 14.662C11.3667 15.104 11 15.7 11 16.45V17ZM4 20C3.45 20 2.97933 19.8043 2.588 19.413C2.196 19.021 2 18.55 2 18V6C2 5.45 2.196 4.97933 2.588 4.588C2.97933 4.196 3.45 4 4 4H9.175C9.44167 4 9.696 4.05 9.938 4.15C10.1793 4.25 10.3917 4.39167 10.575 4.575L12 6H20C20.55 6 21.021 6.196 21.413 6.588C21.8043 6.97933 22 7.45 22 8V18C22 18.55 21.8043 19.021 21.413 19.413C21.021 19.8043 20.55 20 20 20H4ZM4 6V18H20V8H11.175L9.175 6H4Z", fill: "currentColor" }))), this.size === 28 && (index.h(index.Fragment, { key: '72ded59476f7a7c42e35c3ab54b75afb768a1608' }, index.h("path", { key: '59c4ddd33e74ea103bc5d7af0396357b157bb023', d: "M17.5 15.1667C18.1416 15.1667 18.6911 14.938 19.1485 14.4807C19.605 14.0241 19.8333 13.475 19.8333 12.8334C19.8333 12.1917 19.605 11.6422 19.1485 11.1849C18.6911 10.7283 18.1416 10.5 17.5 10.5C16.8583 10.5 16.3092 10.7283 15.8526 11.1849C15.3953 11.6422 15.1666 12.1917 15.1666 12.8334C15.1666 13.475 15.3953 14.0241 15.8526 14.4807C16.3092 14.938 16.8583 15.1667 17.5 15.1667ZM12.8333 19.8334H22.1666V19.1917C22.1666 18.3167 21.7389 17.6214 20.8833 17.1057C20.0278 16.5908 18.9 16.3334 17.5 16.3334C16.1 16.3334 14.9722 16.5908 14.1166 17.1057C13.2611 17.6214 12.8333 18.3167 12.8333 19.1917V19.8334ZM4.66665 23.3334C4.02498 23.3334 3.47587 23.1051 3.01931 22.6485C2.56198 22.1912 2.33331 21.6417 2.33331 21V7.00002C2.33331 6.35835 2.56198 5.80924 3.01931 5.35269C3.47587 4.89535 4.02498 4.66669 4.66665 4.66669H10.7041C11.0153 4.66669 11.312 4.72502 11.5943 4.84169C11.8759 4.95835 12.1236 5.12363 12.3375 5.33752L14 7.00002H23.3333C23.975 7.00002 24.5245 7.22869 24.9818 7.68602C25.4384 8.14258 25.6666 8.69169 25.6666 9.33335V21C25.6666 21.6417 25.4384 22.1912 24.9818 22.6485C24.5245 23.1051 23.975 23.3334 23.3333 23.3334H4.66665ZM4.66665 7.00002V21H23.3333V9.33335H13.0375L10.7041 7.00002H4.66665Z", fill: "currentColor" })))));
+        return (index.h("svg", { key: '3a23fd957bbc465bc9eafda92d32297c0aa9728f', "aria-hidden": "true", class: className, fill: "none", height: this.size, part: "icon", style: styles, viewBox: `0 0 ${viewBoxSize} ${viewBoxSize}`, width: this.size, xmlns: "http://www.w3.org/2000/svg" }, this.size === 16 && (index.h(index.Fragment, { key: 'cb00f2f2404747b248aeefc3ac55eb5c97608fdb' }, index.h("path", { key: '3dfe47ced62896bb8f7f964efd076f020a506b11', d: "M9.99998 8.66669C10.3666 8.66669 10.6806 8.53602 10.942 8.27469C11.2029 8.0138 11.3333 7.70002 11.3333 7.33335C11.3333 6.96669 11.2029 6.65269 10.942 6.39135C10.6806 6.13046 10.3666 6.00002 9.99998 6.00002C9.63331 6.00002 9.31953 6.13046 9.05865 6.39135C8.79731 6.65269 8.66665 6.96669 8.66665 7.33335C8.66665 7.70002 8.79731 8.0138 9.05865 8.27469C9.31953 8.53602 9.63331 8.66669 9.99998 8.66669ZM7.33331 11.3334H12.6666V10.9667C12.6666 10.4667 12.4222 10.0694 11.9333 9.77469C11.4444 9.48046 10.8 9.33335 9.99998 9.33335C9.19998 9.33335 8.55553 9.48046 8.06665 9.77469C7.57776 10.0694 7.33331 10.4667 7.33331 10.9667V11.3334ZM2.66665 13.3334C2.29998 13.3334 1.9862 13.2029 1.72531 12.942C1.46398 12.6807 1.33331 12.3667 1.33331 12V4.00002C1.33331 3.63335 1.46398 3.31958 1.72531 3.05869C1.9862 2.79735 2.29998 2.66669 2.66665 2.66669H6.11665C6.29442 2.66669 6.46398 2.70002 6.62531 2.76669C6.7862 2.83335 6.92776 2.9278 7.04998 3.05002L7.99998 4.00002H13.3333C13.7 4.00002 14.014 4.13069 14.2753 4.39202C14.5362 4.65291 14.6666 4.96669 14.6666 5.33335V12C14.6666 12.3667 14.5362 12.6807 14.2753 12.942C14.014 13.2029 13.7 13.3334 13.3333 13.3334H2.66665ZM2.66665 4.00002V12H13.3333V5.33335H7.44998L6.11665 4.00002H2.66665Z", fill: "currentColor" }))), (this.size === 20 || this.size === 24) && (index.h(index.Fragment, { key: '44cf69864983f204af407240f3e214630283c2bb' }, index.h("path", { key: 'c58c6a95bbabebffc36d14b9e77a655ad0325e0a', d: "M15 13C15.55 13 16.021 12.804 16.413 12.412C16.8043 12.0207 17 11.55 17 11C17 10.45 16.8043 9.979 16.413 9.587C16.021 9.19567 15.55 9 15 9C14.45 9 13.9793 9.19567 13.588 9.587C13.196 9.979 13 10.45 13 11C13 11.55 13.196 12.0207 13.588 12.412C13.9793 12.804 14.45 13 15 13ZM11 17H19V16.45C19 15.7 18.6333 15.104 17.9 14.662C17.1667 14.2207 16.2 14 15 14C13.8 14 12.8333 14.2207 12.1 14.662C11.3667 15.104 11 15.7 11 16.45V17ZM4 20C3.45 20 2.97933 19.8043 2.588 19.413C2.196 19.021 2 18.55 2 18V6C2 5.45 2.196 4.97933 2.588 4.588C2.97933 4.196 3.45 4 4 4H9.175C9.44167 4 9.696 4.05 9.938 4.15C10.1793 4.25 10.3917 4.39167 10.575 4.575L12 6H20C20.55 6 21.021 6.196 21.413 6.588C21.8043 6.97933 22 7.45 22 8V18C22 18.55 21.8043 19.021 21.413 19.413C21.021 19.8043 20.55 20 20 20H4ZM4 6V18H20V8H11.175L9.175 6H4Z", fill: "currentColor" }))), this.size === 28 && (index.h(index.Fragment, { key: '5ee25d16e65e04b22ce86b9fd737a205f683479e' }, index.h("path", { key: '75e123171af42f9a8a3cddfcc9377ca1d9d2437f', d: "M17.5 15.1667C18.1416 15.1667 18.6911 14.938 19.1485 14.4807C19.605 14.0241 19.8333 13.475 19.8333 12.8334C19.8333 12.1917 19.605 11.6422 19.1485 11.1849C18.6911 10.7283 18.1416 10.5 17.5 10.5C16.8583 10.5 16.3092 10.7283 15.8526 11.1849C15.3953 11.6422 15.1666 12.1917 15.1666 12.8334C15.1666 13.475 15.3953 14.0241 15.8526 14.4807C16.3092 14.938 16.8583 15.1667 17.5 15.1667ZM12.8333 19.8334H22.1666V19.1917C22.1666 18.3167 21.7389 17.6214 20.8833 17.1057C20.0278 16.5908 18.9 16.3334 17.5 16.3334C16.1 16.3334 14.9722 16.5908 14.1166 17.1057C13.2611 17.6214 12.8333 18.3167 12.8333 19.1917V19.8334ZM4.66665 23.3334C4.02498 23.3334 3.47587 23.1051 3.01931 22.6485C2.56198 22.1912 2.33331 21.6417 2.33331 21V7.00002C2.33331 6.35835 2.56198 5.80924 3.01931 5.35269C3.47587 4.89535 4.02498 4.66669 4.66665 4.66669H10.7041C11.0153 4.66669 11.312 4.72502 11.5943 4.84169C11.8759 4.95835 12.1236 5.12363 12.3375 5.33752L14 7.00002H23.3333C23.975 7.00002 24.5245 7.22869 24.9818 7.68602C25.4384 8.14258 25.6666 8.69169 25.6666 9.33335V21C25.6666 21.6417 25.4384 22.1912 24.9818 22.6485C24.5245 23.1051 23.975 23.3334 23.3333 23.3334H4.66665ZM4.66665 7.00002V21H23.3333V9.33335H13.0375L10.7041 7.00002H4.66665Z", fill: "currentColor" })))));
     }
 };
 SwirlIconFolderShared.style = SwirlIconFolderSharedStyle0;
@@ -667,7 +667,7 @@ const SwirlResourceList = class {
         });
     }
     render() {
-        return (index.h(index.Host, { key: '9cdbf7e982b7fad16ddde568da0ffd8cd229afbe', onKeyDown: this.onKeyDown }, index.h("swirl-visually-hidden", { key: 'c673f945e917844046c6d97df7ae74750b27ffd8', role: "alert" }, this.assistiveText), index.h("swirl-box", { key: 'd0db754c2f51e535a5f17cc6c25478fcbe7c6c52', paddingBlockEnd: this.paddingBlockEnd ?? this.padding, paddingBlockStart: this.paddingBlockStart ?? this.padding, paddingInlineEnd: this.paddingInlineEnd ?? this.padding ?? "8", paddingInlineStart: this.paddingInlineStart ?? this.padding ?? "8" }, index.h("swirl-stack", { key: 'b63e230dcf9fd95576034611ae088f0768d4c300', "aria-label": this.label, class: "resource-list", id: this.listId, ref: (el) => (this.gridEl = el), role: "grid", spacing: this.spacing }, index.h("slot", { key: '6fda1e77604a0ac9fac43aa95937d1274926dd36' })))));
+        return (index.h(index.Host, { key: '49ea535f5acb9fc68e3ae1f7136b8dc6380d17d9', onKeyDown: this.onKeyDown }, index.h("swirl-visually-hidden", { key: 'cc24d6e02aa79b0b0747892880b25dd3c7eaab16', role: "alert" }, this.assistiveText), index.h("swirl-box", { key: '0b7168d12e7c114cc05a572c95cc8b1d62a01130', paddingBlockEnd: this.paddingBlockEnd ?? this.padding, paddingBlockStart: this.paddingBlockStart ?? this.padding, paddingInlineEnd: this.paddingInlineEnd ?? this.padding ?? "8", paddingInlineStart: this.paddingInlineStart ?? this.padding ?? "8" }, index.h("swirl-stack", { key: '98e4699a1280896d410219ba9438083abb502963', "aria-label": this.label, class: "resource-list", id: this.listId, ref: (el) => (this.gridEl = el), role: "grid", spacing: this.spacing }, index.h("slot", { key: '0239aabdc15dd9088a2bdc47f25a7d5ebce551ef' })))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {
@@ -831,7 +831,7 @@ const SwirlResourceListItem = class {
             "resource-list-item--wrap-description": this.descriptionWrap,
             "resource-list-item--wrap-label": this.labelWrap,
         });
-        return (index.h(index.Host, { key: 'dba563ccfce21fd0bdf87f8f970c6c368de5a384', role: "row" }, index.h("div", { key: '0fa0e2578e7f6b8bf6500f84389fba8a483bb80d', class: className, role: "gridcell" }, index.h(Tag, { key: '9ecc89bed26925125740c4c02673dbe9fa4feaa3', "aria-checked": ariaChecked, "aria-disabled": disabled ? "true" : undefined, "aria-label": ariaLabel, "aria-labelledby": Boolean(this.swirlAriaLabel) ? undefined : this.elementId, class: "resource-list-item__content", href: href, disabled: disabled, onClick: this.onClick, onBlur: this.onBlur, onFocus: this.onFocus, part: "resource-list-item__content", role: role, tabIndex: 0, type: Tag === "button" ? "button" : undefined }, this.hasMedia && (index.h("span", { key: '01c7349268e6fdb135a6a41fcf29522b8a112863', class: "resource-list-item__media" }, index.h("slot", { key: 'd6aa58d73f26c54536f79ff5e4b1db14e270cb7d', name: "media" }))), index.h("span", { key: 'd240bf48129aebffc4d5135697547bf1b41bb7b2', class: "resource-list-item__label-container", style: labelContainerStyles }, index.h("span", { key: '9e87098fd6738cf2a3e158bff7f281ae6d49b366', class: "resource-list-item__label", id: this.elementId, innerHTML: this.allowHtml ? this.label : undefined }, !this.allowHtml && this.label), this.description && (index.h("span", { key: '25483b5b986d8f2c7a72b27fd06d0a33938f7a65', class: "resource-list-item__description", innerHTML: this.allowHtml ? this.description : undefined }, !this.allowHtml && this.description))), showMeta && (index.h("span", { key: '372eb1b0e328dfaef3ace6320d7a937354f63860', class: "resource-list-item__meta" }, index.h("span", { key: '9f90bbb431c0aa25609467a865b503236ab9a2f5', class: "resource-list-item__meta-text" }, this.meta), index.h("span", { key: '45ab81e3d6a8203ec69e857f74e9498023ea63d3', class: "resource-list-item__badges" }, index.h("slot", { key: 'd1afdb5262dbc03f14159912072e9c3ef4a21c4d', name: "badges" }))))), this.selectable && (index.h("span", { key: '4a26342beaf34ffbb3e3210b76c44a55991a44eb', "aria-hidden": "true", class: "resource-list-item__checkbox" }, index.h("span", { key: '460cb54db0405975abfc082f82673db8c4c21282', class: "resource-list-item__checkbox-icon" }, this.checked && (index.h("swirl-icon-check-strong", { key: '9afc4ea48861dab4a7e7f3cdad3268d07d27a04c' }))))), index.h("span", { key: '83eaca909478d7105b04ec659465519ca8c17353', class: "resource-list-item__control", onClick: this.onControlClick, ref: (el) => (this.controlContainer = el) }, index.h("slot", { key: '648105d5982c765f38ad6b9d8ca6dfcb55d06e57', name: "control" })), showMenu && (index.h("swirl-popover-trigger", { key: '520fd38947f92c9e2f0a0fc3806e6d3ac925d3ad', swirlPopover: this.menuTriggerId }, index.h("swirl-button", { key: '24c0513133f9bbcd1fb349ea224731a8551cede5', "aria-disabled": disabled ? "true" : undefined, class: "resource-list-item__menu-trigger", disabled: disabled, hideLabel: true, icon: "<swirl-icon-more-horizontal></swirl-icon-more-horizontal>", intent: "primary", label: this.menuTriggerLabel, onClick: this.onMenuTriggerClick })))), this.allowDrag && (index.h("button", { key: 'caff3db0cabeb8f08ead65294dd67cd45d42433d', "aria-describedby": this.dragHandleDescription, "aria-label": `${this.dragHandleLabel} "${this.label}"`, class: "resource-list-item__drag-handle", onKeyDown: this.onDragHandleKeyDown, type: "button" }, index.h("swirl-icon-drag-handle", { key: '3ff4db283081cc1d2da46cac766463b4e9170132', size: this.iconSize })))));
+        return (index.h(index.Host, { key: '3bc3fa72a1abff66fb5c3651fa9014588ac55056', role: "row" }, index.h("div", { key: 'bc5b097590569b20c6e3c12dc81579d1106b3154', class: className, role: "gridcell" }, index.h(Tag, { key: 'ebf3bbd3e7e43bb7eca43a08bd871e8e2bbbfe43', "aria-checked": ariaChecked, "aria-disabled": disabled ? "true" : undefined, "aria-label": ariaLabel, "aria-labelledby": Boolean(this.swirlAriaLabel) ? undefined : this.elementId, class: "resource-list-item__content", href: href, disabled: disabled, onClick: this.onClick, onBlur: this.onBlur, onFocus: this.onFocus, part: "resource-list-item__content", role: role, tabIndex: 0, type: Tag === "button" ? "button" : undefined }, this.hasMedia && (index.h("span", { key: 'ba3f13bf18694ab2196e4a39f75c9c0f63aa8300', class: "resource-list-item__media" }, index.h("slot", { key: 'a984289394867903e6c6de0c4857df6c38af7abf', name: "media" }))), index.h("span", { key: 'eae163ca5e7872144ed2f88ad0ffb9c2ead37c30', class: "resource-list-item__label-container", style: labelContainerStyles }, index.h("span", { key: 'ecf7765c077159faf1c635581f969f3ab854eacd', class: "resource-list-item__label", id: this.elementId, innerHTML: this.allowHtml ? this.label : undefined }, !this.allowHtml && this.label), this.description && (index.h("span", { key: '117cc94c6884e001b38c86255e8bdf80adc8b409', class: "resource-list-item__description", innerHTML: this.allowHtml ? this.description : undefined }, !this.allowHtml && this.description))), showMeta && (index.h("span", { key: '6ce54162920cffd718c2099537290e9e2e64af9a', class: "resource-list-item__meta" }, index.h("span", { key: '9021d55561a83a5b17bacf80a6c4efeeede0e1ad', class: "resource-list-item__meta-text" }, this.meta), index.h("span", { key: 'f6c795ac584af2d38573167b3b3673d56867c8c1', class: "resource-list-item__badges" }, index.h("slot", { key: '7804eb9c844ef7320af6d0081590c343953058a2', name: "badges" }))))), this.selectable && (index.h("span", { key: '436f7ec288c6c934155dd063671a536a826b0ba9', "aria-hidden": "true", class: "resource-list-item__checkbox" }, index.h("span", { key: 'cd29d807d629d145c65aac56105da892daa9ad92', class: "resource-list-item__checkbox-icon" }, this.checked && (index.h("swirl-icon-check-strong", { key: 'de2514fbb35ec904896ccb0cf80b71f7722657eb' }))))), index.h("span", { key: '2a446937a24714758d4fc89c690189f0dd7b7ea8', class: "resource-list-item__control", onClick: this.onControlClick, ref: (el) => (this.controlContainer = el) }, index.h("slot", { key: 'f6edad002358c9c080c8da9c2f27bd6d33e30351', name: "control" })), showMenu && (index.h("swirl-popover-trigger", { key: '4b1b5cfb61c208bd0c3858356c69c7618d8c8e89', swirlPopover: this.menuTriggerId }, index.h("swirl-button", { key: 'db5c75794ec64e4ee42ef72017da4265536981f5', "aria-disabled": disabled ? "true" : undefined, class: "resource-list-item__menu-trigger", disabled: disabled, hideLabel: true, icon: "<swirl-icon-more-horizontal></swirl-icon-more-horizontal>", intent: "primary", label: this.menuTriggerLabel, onClick: this.onMenuTriggerClick })))), this.allowDrag && (index.h("button", { key: '2902462ef1a182de4887a97aabb68b8d98533410', "aria-describedby": this.dragHandleDescription, "aria-label": `${this.dragHandleLabel} "${this.label}"`, class: "resource-list-item__drag-handle", onKeyDown: this.onDragHandleKeyDown, type: "button" }, index.h("swirl-icon-drag-handle", { key: '8596f6557cdb8699b6f06b79e40170a166879b94', size: this.iconSize })))));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/swirl-avatar-group.cjs.entry.js

@@ -31,7 +31,7 @@ const SwirlAvatarGroup = class {
             "avatar-group--has-badge": Boolean(this.badge),
         });
         const badgeClassName = index$1.classnames("avatar-group__badge");
-        return (index.h(index.Host, { key: '6a6a87484916f4341bee75573255a70c04e7d51e' }, index.h("div", { key: '9cc05ce558e9aa6cbff457cbe5af38ec12e1df72', class: className, role: "group" }, index.h("slot", { key: '01cccb097c967e19657206b92b8c4e32409e03fe' }), this.badge && (index.h("span", { key: '6a1dce168468030d60280364483e5c83e8a48652', class: badgeClassName, innerHTML: this.badge, ref: (el) => (this.badgeEl = el) })))));
+        return (index.h(index.Host, { key: '462ffec151cda454d434014c1bd838f400a1be9a' }, index.h("div", { key: 'e9281967c4eb7900495a3dda9b36394ac8c045b3', class: className, role: "group" }, index.h("slot", { key: 'ae8f0ebece8a2b0291958abff5f021dafe23a184' }), this.badge && (index.h("span", { key: 'eca85606e9f0c0d60a43860543c1fb06ef785a82', class: badgeClassName, innerHTML: this.badge, ref: (el) => (this.badgeEl = el) })))));
     }
 };
 SwirlAvatarGroup.style = SwirlAvatarGroupStyle0;

package/dist/cjs/swirl-card.cjs.entry.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-2c919933.js');
 const index$1 = require('./index-9f94303c.js');
 
-const swirlCardCss = ":host{display:contents}:host *{box-sizing:border-box}.card{--swirl-ghost-button-background-default:var(--s-surface-default);--swirl-ghost-button-background-hovered:var(--s-surface-hovered);--swirl-ghost-button-background-pressed:var(--s-surface-pressed);--swirl-resource-list-item-background-default:var(--s-surface-default);--swirl-resource-list-item-background-hovered:var(--s-surface-hovered);--swirl-resource-list-item-background-pressed:var(--s-surface-pressed);display:flex;overflow:hidden;width:100%;margin:0;padding:0;border:var(--s-border-width-default) solid var(--s-border-default);border-radius:var(--s-border-radius-base);color:var(--s-text-default);background-color:var(--swirl-card-background-default);font:inherit;text-decoration:none;flex-direction:column;transition:background-color 0.2s}.card:not(.card--has-image) .card__image{overflow:hidden;height:0}a.card,button.card,.card--interactive{cursor:pointer}a.card:hover,button.card:hover,.card--interactive:hover{background-color:var(--swirl-card-background-hovered)}a.card:active,button.card:active,.card--interactive:active{background-color:var(--swirl-card-background-pressed)}a.card:focus:not(:focus-visible),button.card:focus:not(:focus-visible),.card--interactive:focus:not(:focus-visible){outline:none}a.card:focus-visible,button.card:focus-visible,.card--interactive:focus-visible{outline-color:var(--s-focus-default);outline-offset:var(--s-space-4)}.card--is--borderless{border:0}.card--elevated.card--elevation-level-1{box-shadow:var(--s-shadow-level-1)}.card--elevated.card--elevation-level-2{box-shadow:var(--s-shadow-level-2)}.card--elevated.card--elevation-level-3{box-shadow:var(--s-shadow-level-3)}.card--flashing{background-color:var(--swirl-card-background-pressed)}.card--flashing.card--intent-default-subdued{background-color:var(--s-surface-raised-pressed)}.card--flashing.card--intent-highlight{background-color:var(--s-surface-highlight-pressed)}.card--highlighted{border-width:0.1875rem;border-color:var(--s-border-highlight)}.card--justify-content-start .card__body{justify-content:flex-start}.card--justify-content-center .card__body{justify-content:center}.card--justify-content-end .card__body{justify-content:flex-end}.card--intent-critical-subdued{background-color:var(--s-surface-critical-subdued)}.card--intent-default-subdued{--swirl-resource-list-item-background-default:var(\n    --s-surface-raised-default\n  );--swirl-resource-list-item-background-hovered:var(\n    --s-surface-raised-hovered\n  );--swirl-resource-list-item-background-pressed:var(\n    --s-surface-raised-pressed\n  );--swirl-ghost-button-background-default:var(--s-surface-raised-default);--swirl-ghost-button-background-hovered:var(--s-surface-raised-hovered);--swirl-ghost-button-background-pressed:var(--s-surface-raised-pressed);background-color:var(--s-surface-raised-default)}.card--intent-info-subdued{background-color:var(--s-surface-info-subdued)}.card--intent-success-subdued{background-color:var(--s-surface-success-subdued)}.card--intent-warning-subdued{background-color:var(--s-surface-warning-subdued)}.card--intent-highlight{color:var(--s-text-on-surface-highlight);background-color:var(--s-surface-highlight-default)}.content-section{padding:0 var(--s-space-16)}.card__image{overflow:hidden;min-height:0}.card__image ::slotted(img){display:inline-flex;width:100%;max-height:100%;-o-object-fit:cover;object-fit:cover}.card__body{display:flex;min-height:0;padding:var(--s-space-12) var(--s-space-16) var(--s-space-16);flex-grow:1;flex-direction:column;gap:var(--s-space-16)}";
+const swirlCardCss = ":host{display:contents}:host *{box-sizing:border-box}.card{--swirl-ghost-button-background-default:var(--s-surface-default);--swirl-ghost-button-background-hovered:var(--s-surface-hovered);--swirl-ghost-button-background-pressed:var(--s-surface-pressed);--swirl-resource-list-item-background-default:var(--s-surface-default);--swirl-resource-list-item-background-hovered:var(--s-surface-hovered);--swirl-resource-list-item-background-pressed:var(--s-surface-pressed);display:flex;overflow:hidden;width:100%;margin:0;padding:0;border:var(--s-border-width-default) solid var(--s-border-default);border-radius:var(--s-border-radius-base);color:var(--s-text-default);background-color:var(--swirl-card-background-default);font:inherit;text-decoration:none;flex-direction:column;transition:background-color 0.2s}.card:not(.card--has-image) .card__image{overflow:hidden;height:0}a.card,button.card,.card--interactive{cursor:pointer}a.card:hover,button.card:hover,.card--interactive:hover{background-color:var(--swirl-card-background-hovered)}a.card:active,button.card:active,.card--interactive:active{background-color:var(--swirl-card-background-pressed)}a.card:focus:not(:focus-visible),button.card:focus:not(:focus-visible),.card--interactive:focus:not(:focus-visible){outline:none}a.card:focus-visible,button.card:focus-visible,.card--interactive:focus-visible{outline-color:var(--s-focus-default);outline-offset:var(--s-space-4)}.card--is--borderless{border:0}.card--elevated.card--elevation-level-1{box-shadow:var(--s-shadow-level-1)}.card--elevated.card--elevation-level-2{box-shadow:var(--s-shadow-level-2)}.card--elevated.card--elevation-level-3{box-shadow:var(--s-shadow-level-3)}.card--flashing{background-color:var(--swirl-card-background-pressed)}.card--flashing.card--intent-default-subdued{background-color:var(--s-surface-raised-pressed)}.card--flashing.card--intent-highlight{background-color:var(--s-surface-highlight-pressed)}.card--highlighted{border-width:0.1875rem;border-color:var(--s-border-highlight)}.card--justify-content-start .card__body{justify-content:flex-start}.card--justify-content-center .card__body{justify-content:center}.card--justify-content-end .card__body{justify-content:flex-end}.card--intent-critical-subdued{background-color:var(--s-surface-critical-subdued)}.card--intent-default-subdued{--swirl-resource-list-item-background-default:var(\n    --s-surface-raised-default\n  );--swirl-resource-list-item-background-hovered:var(\n    --s-surface-raised-hovered\n  );--swirl-resource-list-item-background-pressed:var(\n    --s-surface-raised-pressed\n  );--swirl-ghost-button-background-default:var(--s-surface-raised-default);--swirl-ghost-button-background-hovered:var(--s-surface-raised-hovered);--swirl-ghost-button-background-pressed:var(--s-surface-raised-pressed);background-color:var(--s-surface-raised-default)}.card--intent-info-subdued{background-color:var(--s-surface-info-subdued)}.card--intent-success-subdued{background-color:var(--s-surface-success-subdued)}.card--intent-warning-subdued{background-color:var(--s-surface-warning-subdued)}.card--intent-highlight{color:var(--s-text-on-surface-highlight);background-color:var(--s-surface-highlight-default)}.content-section{padding:0 var(--s-space-16)}.card__image{overflow:hidden;min-height:0}.card__image ::slotted(img){display:inline-flex;width:100%;max-height:100%;-o-object-fit:cover;object-fit:cover}.card__body{display:flex;min-height:0;padding:var(--s-space-12) var(--s-space-16) var(--s-space-16);flex-grow:1;flex-direction:column;gap:var(--s-space-16)}.card__content{min-height:100%}";
 const SwirlCardStyle0 = swirlCardCss;
 
 const swirlCardBorderRadiusTokens = ["xs", "sm", "base", "l", "xl"];

package/dist/cjs/swirl-carousel-slide.cjs.entry.js

@@ -20,11 +20,11 @@ const SwirlCarouselSlide = class {
         const className = index$1.classnames("carousel-slide", {
             "carousel-slide--has-min-height": Boolean(this.minHeight),
         });
-        return (index.h(index.Host, { key: '8f38c4750269af5d8d18043ec381e0ca743a94a4', "aria-roledescription": "slide", "aria-label": this.label, class: className, role: "group", style: {
+        return (index.h(index.Host, { key: 'd4c547449bbd4632987fdfe578647d580f8fd71f', "aria-roledescription": "slide", "aria-label": this.label, class: className, role: "group", style: {
                 aspectRatio: this.aspectRatio,
                 flexBasis: this.width,
                 minHeight: this.minHeight,
-            }, tabIndex: 0 }, index.h("slot", { key: '1a0d7f1017befb23e997c88c92ce2077436fba9b' })));
+            }, tabIndex: 0 }, index.h("slot", { key: '7d644fe684414bd3675eb2dd6543bd4a7e7e40ef' })));
     }
 };
 SwirlCarouselSlide.style = SwirlCarouselSlideStyle0;

package/dist/cjs/swirl-carousel.cjs.entry.js

@@ -79,7 +79,7 @@ const SwirlCarousel = class {
         this.scrollToElement(slide);
     }
     scrollToElement(element) {
-        if (this.slidesContainer && element.offsetLeft) {
+        if (this.slidesContainer && element) {
             this.slidesContainer?.scroll({
                 left: element.offsetLeft,
                 behavior: "smooth",
@@ -162,7 +162,7 @@ const SwirlCarousel = class {
             "carousel--is-at-start": this.isAtStart,
             "carousel--is-at-end": this.isAtEnd,
         });
-        return (index.h(index.Host, { key: '055531e5e1dd75459da73cdfb2e8fe292ce3fcfc', "aria-label": this.label, "aria-roledescription": "carousel", role: "group" }, index.h("div", { key: 'a7a12f0f26c078c84b01fc2cbcca40008df7c4d6', class: className }, this.isScrollable && !this.isAtStart && (index.h("swirl-button", { key: '2f2da78b3ed307ee553e34149ade756e5d5684b1', class: "carousel__previous-slide-button", hideLabel: true, icon: "<swirl-icon-arrow-back></swirl-icon-arrow-back>", label: this.previousSlideButtonLabel, onClick: this.onPreviousSlideButtonClick, pill: true, variant: "floating" })), this.isScrollable && !this.isAtEnd && (index.h("swirl-button", { key: '3e5e26b5ee417057aa7ae07c0eca370358a09636', class: "carousel__next-slide-button", hideLabel: true, icon: "<swirl-icon-arrow-forward></swirl-icon-arrow-forward>", label: this.nextSlideButtonLabel, onClick: this.onNextSlideButtonClick, pill: true, variant: "floating" })), index.h("div", { key: '322b809d76dfb2bf8291d6b5fe82a3cf5f210f9d', "aria-live": "polite", class: "carousel__slides", style: slidesStyles, onScroll: this.onScroll, ref: (el) => (this.slidesContainer = el) }, index.h("slot", { key: '7004b131c7dfdb6eeae338e89d68485f183f1a62', onSlotchange: this.onSlotChange })))));
+        return (index.h(index.Host, { key: '4a31eea643388a6ebcf52cdd818a9bb3c689fdd8', "aria-label": this.label, "aria-roledescription": "carousel", role: "group" }, index.h("div", { key: '0c514ec843a103b11a01ea3d82e2096dca5a7aef', class: className }, this.isScrollable && !this.isAtStart && (index.h("swirl-button", { key: '2fbf655f2234d14e06ff47d2f439f0bad3ce1e10', class: "carousel__previous-slide-button", hideLabel: true, icon: "<swirl-icon-arrow-back></swirl-icon-arrow-back>", label: this.previousSlideButtonLabel, onClick: this.onPreviousSlideButtonClick, pill: true, variant: "floating" })), this.isScrollable && !this.isAtEnd && (index.h("swirl-button", { key: 'aef153d9d78f45024d7c4eb122b505001a80112e', class: "carousel__next-slide-button", hideLabel: true, icon: "<swirl-icon-arrow-forward></swirl-icon-arrow-forward>", label: this.nextSlideButtonLabel, onClick: this.onNextSlideButtonClick, pill: true, variant: "floating" })), index.h("div", { key: '4dd88527e9bdb0f57b415f46d3f04ebf66d24895', "aria-live": "polite", class: "carousel__slides", style: slidesStyles, onScroll: this.onScroll, ref: (el) => (this.slidesContainer = el) }, index.h("slot", { key: 'a4b6b640183b5355c064ae8fe6fb4c910580c846', onSlotchange: this.onSlotChange })))));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/swirl-color-input.cjs.entry.js

@@ -458,11 +458,11 @@ const SwirlColorInput = class {
         const className = index$1.classnames("color-input", {
             "color-input--inline": this.inline,
         });
-        return (index.h(index.Host, { key: '4654ff5bc5df257853068a43bcaf52d02097df71' }, index.h("div", { key: 'e53f99ef8f3b2f4ec1b53d79fb5d7dc6c201f46f', class: className }, index.h("input", { key: 'e868bf74207fd39366e7182942e51e377f8f51a6', "aria-describedby": this.swirlAriaDescribedby, "aria-disabled": this.disabled ? "true" : undefined, "aria-invalid": ariaInvalid, autoFocus: this.autoFocus, class: "color-input__input", disabled: this.disabled, maxLength: 7, onBlur: this.onBlur, onFocus: this.onFocus, onInput: this.onInput, placeholder: this.placeholder, ref: (el) => (this.inputEl = el), required: this.required, spellcheck: "false", type: "text", value: this.value }), index.h("swirl-popover-trigger", { key: 'da79dc9a8ad10e420d9924aeaab92969ab342909', swirlPopover: this.pickerId }, index.h("button", { key: '268c45d7a455c1682e1d40da424f66ed29de9c72', "aria-label": this.pickerButtonLabel, class: "color-input__preview-button", style: {
+        return (index.h(index.Host, { key: '91c008000f02c75b9247f36cadb45c89c1dd3217' }, index.h("div", { key: '5ad12b4cb85d6520b772fcf4f334b25c471e7b77', class: className }, index.h("input", { key: 'ca0c14b1b26413beab2c2bb845fad19a59d3d111', "aria-describedby": this.swirlAriaDescribedby, "aria-disabled": this.disabled ? "true" : undefined, "aria-invalid": ariaInvalid, autoFocus: this.autoFocus, class: "color-input__input", disabled: this.disabled, maxLength: 7, onBlur: this.onBlur, onFocus: this.onFocus, onInput: this.onInput, placeholder: this.placeholder, ref: (el) => (this.inputEl = el), required: this.required, spellcheck: "false", type: "text", value: this.value }), index.h("swirl-popover-trigger", { key: '433090f7540ffaf70472d8f36bfa01a558c6276b', swirlPopover: this.pickerId }, index.h("button", { key: '287d1ba7933e956749de674566ebcc6f04a77965', "aria-label": this.pickerButtonLabel, class: "color-input__preview-button", style: {
                 backgroundColor: this.disabled
                     ? "var(--s-border-subdued)"
                     : this.value,
-            }, type: "button" })), index.h("swirl-popover", { key: 'e3df1808566ec26d254a993afd897ebe8d6149b9', animation: "scale-in-y", id: this.pickerId, label: this.pickerLabel, placement: "bottom-end" }, index.h("swirl-box", { key: 'acb8684dd6b9130cbe6b69f82cd820f7a54a0c10', centerInline: true, paddingBlockEnd: "8", paddingBlockStart: "8", paddingInlineEnd: "16", paddingInlineStart: "16" }, index.h("hex-color-picker", { key: 'fbdbe7bcb65c8c72cb6a454d49b7f0b96b833f0f', color: this.value, ref: (el) => (this.picker = el) }))))));
+            }, type: "button" })), index.h("swirl-popover", { key: 'efd88723c418f45977a8bc9a10e60c542209bab1', animation: "scale-in-y", id: this.pickerId, label: this.pickerLabel, placement: "bottom-end" }, index.h("swirl-box", { key: '524dc0d20d5e5b6fc048c0fa436b8489d4f47924', centerInline: true, paddingBlockEnd: "8", paddingBlockStart: "8", paddingInlineEnd: "16", paddingInlineStart: "16" }, index.h("hex-color-picker", { key: '0d428dc7b8cd6bbb186e11bcf58cf7ac6b6e6543', color: this.value, ref: (el) => (this.picker = el) }))))));
     }
     static get watchers() { return {
         "value": ["watchValue"]