@getflip/swirl-components 0.477.0 → 0.478.0

package/dist/collection/components/swirl-tabs/swirl-tabs.js

@@ -70,7 +70,7 @@ export class SwirlTabs {
         }));
     }
     render() {
-        return (h(Host, { key: 'ade862927feadebd99edc97f409e9bf0df6b7f41' }, h("div", { key: 'af8fe0c9feca28faf0a21651ab5994f290bf63c6', class: "tabs" }, h("swirl-tab-bar", { key: '2b560b7fc640f90e06d2f26639207a230d167d31', label: this.label, onActivateNextTab: this.onActivateNextTab, onActivatePreviousTab: this.onActivatePreviousTab, onActivateTab: this.onActivateTab, tabs: this.tabBarTabs, justify: this.justifyTabBar, paddingBlockEnd: this.tabBarPaddingBlockEnd, paddingBlockStart: this.tabBarPaddingBlockStart, paddingInlineEnd: this.tabBarPaddingInlineEnd, paddingInlineStart: this.tabBarPaddingInlineStart, variant: this.tabBarVariant })), h("slot", { key: 'f07b0e2f1aa330fa17318600b91c93ec50959df4' })));
+        return (h(Host, { key: 'f53c016b427a80f924e8fbfdde2b800d273bb67a' }, h("div", { key: 'b213a0e6809608a7d4428015c5e1f0668a94dcb3', class: "tabs" }, h("swirl-tab-bar", { key: 'aa4b708904875e49656ca540fc3b90bb5017caff', label: this.label, onActivateNextTab: this.onActivateNextTab, onActivatePreviousTab: this.onActivatePreviousTab, onActivateTab: this.onActivateTab, tabs: this.tabBarTabs, justify: this.justifyTabBar, paddingBlockEnd: this.tabBarPaddingBlockEnd, paddingBlockStart: this.tabBarPaddingBlockStart, paddingInlineEnd: this.tabBarPaddingInlineEnd, paddingInlineStart: this.tabBarPaddingInlineStart, variant: this.tabBarVariant })), h("slot", { key: '06d3449a14c5c5e346dd4bffa4078ddcbf3cf6b6' })));
     }
     static get is() { return "swirl-tabs"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/swirl-tag/swirl-tag.js

@@ -32,7 +32,7 @@ export class SwirlTag {
     }
     render() {
         const className = classnames("tag", `tag--icon-position-${this.iconPosition}`, `tag--intent-${this.intent}`, `tag--size-${this.size}`, `tag--variant-${this.variant}`, { "tag--hide-label": this.hideLabel });
-        return (h(Host, { key: '1761004fec8f52ef477c14dfb032db0cb4a2cae2' }, h("span", { key: '1531d418beb787bf5a85b32bf10017d24fe458b7', class: className, part: "tag" }, this.icon && (h("span", { key: '95db9c8289b2e770af02cc6eeb370a002b2bd7b1', class: "tag__icon", innerHTML: this.icon, ref: (el) => (this.iconEl = el) })), !this.hideLabel ? (h("span", { class: "tag__label" }, this.label)) : (h("swirl-visually-hidden", null, this.label)), this.removable && (h("button", { key: '1b99be433002b0a62f07b93ff6dd6e95fafef4c9', "aria-label": this.removalButtonLabel, class: "tag__removal-button", onClick: this.onRemove, tabIndex: this.el.ariaHidden === "true" ? -1 : undefined, type: "button" }, h("swirl-icon-close", { key: '2afaee043cd6b5ce579a3aa675beb5dba764539a', size: 16 }))))));
+        return (h(Host, { key: '88a3bdc216f35b6605f40d40b568cef83d688801' }, h("span", { key: '4ac271db64187ff819a9822d8590a59128a7cf1f', class: className, part: "tag" }, this.icon && (h("span", { key: 'bd6f01a13f552a521d44bdce6f2954d75dc29cd3', class: "tag__icon", innerHTML: this.icon, ref: (el) => (this.iconEl = el) })), !this.hideLabel ? (h("span", { class: "tag__label" }, this.label)) : (h("swirl-visually-hidden", null, this.label)), this.removable && (h("button", { key: 'b133f5220d9410ea4bb9a07f47e58b44b34e53a3', "aria-label": this.removalButtonLabel, class: "tag__removal-button", onClick: this.onRemove, tabIndex: this.el.ariaHidden === "true" ? -1 : undefined, type: "button" }, h("swirl-icon-close", { key: '4acc2c82c4c575baf0e6f6bc05b82334c7313bb2', size: 16 }))))));
     }
     static get is() { return "swirl-tag"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/swirl-text/swirl-text.js

@@ -54,7 +54,7 @@ export class SwirlText {
         const styles = {
             whiteSpace: truncate ? "nowrap" : this.whiteSpace,
         };
-        return (h(Host, { key: 'c7e5c1fe48bf2922d59882164f2dbcbcdb886920' }, h(Tag, { key: 'e448f3f46c6debac61d339b3b0a948e74f334f2b', class: className, ref: (el) => (this.textEl = el), style: styles }, h("slot", { key: '7f7dfe2c44d3c3b8c9105643c7eaf493a980d6b7' }))));
+        return (h(Host, { key: '69e09d67f63509f13e6abbe4bf4d376d429ddcf0' }, h(Tag, { key: 'dbf9740fabf36e2cd302e448739ea9624efc5389', class: className, ref: (el) => (this.textEl = el), style: styles }, h("slot", { key: 'edccaa88f552a9cc6f5386175864d7b5e505749e' }))));
     }
     static get is() { return "swirl-text"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/swirl-theme-provider/swirl-theme-provider.js

@@ -144,7 +144,7 @@ export class SwirlThemeProvider {
         this.setDesignTokens = [];
     }
     render() {
-        return (h(Host, { key: '6b5bfc8cab86c36fb95cb295d13b600897fd270d' }, h("slot", { key: 'cd0def04469ea10152ef00bcc0146ef785ed800e' })));
+        return (h(Host, { key: 'ea7ecd424f9b5fce36effb1bdd793d9ec5aac2d2' }, h("slot", { key: '7f674a71a431721b6e51d77617c1e931c8cb678c' })));
     }
     static get is() { return "swirl-theme-provider"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/swirl-thumbnail/swirl-thumbnail.js

@@ -22,7 +22,7 @@ export class SwirlThumbnail {
             "thumbnail--interactive": this.interactive,
             "thumbnail--has-progress": this.progress !== undefined,
         });
-        return (h(Host, { key: '60fd36e9353a9a86a70d1b35b745a32151a09bfa' }, h("span", { key: 'b9f3c84e30a8c03bfa2c6ce15698938af3b900be', class: className, role: "group" }, h(ImageWrapper, { key: 'ddc9b7af21b039f28885dc1bf41ff5d60606c4f8', class: "thumbnail__image-wrapper", onClick: this.thumbnailClick.emit, type: this.interactive ? "button" : undefined }, h("img", { key: 'f0fa51d8a133fd468f869e87fd47d0774ba6ecbe', alt: this.alt, class: "thumbnail__image", loading: "lazy", src: this.src })), this.progress !== undefined && (h("span", { key: 'ffc442f88d1275a776599903c92ef409b793f70c', class: "thumbnail__progress-indicator" }, h("swirl-progress-indicator", { key: '1c48d20c34404dde48a155c19dad06fe663e75ab', label: this.progressLabel, value: this.progress }))), showButtonGroup && (h("swirl-button-group", { key: '4a95ec501ba7044a5412a587f409b9e7f0ac43ee', class: "thumbnail__buttons", segmented: showEditButton && showRemoveButton }, showEditButton && (h("span", { key: '044a398b54e024274fe3f221ac547385247ba1be' }, h("swirl-button", { key: 'a36fe962cfe305b2a72d4e9d830b36699f506ef8', hideLabel: true, icon: this.editButtonIcon, label: this.editButtonLabel, onClick: this.edit.emit, pill: this.size === "xl", variant: "on-image" }))), showRemoveButton && (h("span", { key: '3703ecf16bc15af27753e91ec1a44b850d2273a5' }, h("swirl-button", { key: '034d623775210846466ae6b233e3b3fb101ed001', hideLabel: true, icon: "<swirl-icon-delete></swirl-icon-delete>", label: this.removeButtonLabel, onClick: this.remove.emit, pill: this.size === "xl", variant: "on-image" }))))), showTimestamp && (h("span", { key: 'b38746e0e4ff3d9e1505c16da8393b24cd8a4d6d', class: "thumbnail__timestamp" }, this.timestamp)))));
+        return (h(Host, { key: '6232940ebf3d61ee0d851ce91fc4ab0410814c79' }, h("span", { key: '59a5c5a12aae494045d780b5c13f1293e38236a3', class: className, role: "group" }, h(ImageWrapper, { key: '7d6f9e830dc8dae7a4421e036334bd268b594ae1', class: "thumbnail__image-wrapper", onClick: this.thumbnailClick.emit, type: this.interactive ? "button" : undefined }, h("img", { key: '1220d7141acbb1a0985355a0dc1f1a75893fb5a7', alt: this.alt, class: "thumbnail__image", loading: "lazy", src: this.src })), this.progress !== undefined && (h("span", { key: '4ef46c3fbddd8e8fbdaa2ea30bf6c1e0a570b721', class: "thumbnail__progress-indicator" }, h("swirl-progress-indicator", { key: '00ce0cb6b4aef94bbca8dae9b4bff372d7c8c87a', label: this.progressLabel, value: this.progress }))), showButtonGroup && (h("swirl-button-group", { key: '08b0202094c676d85935fd2331c1b73aa7c3163a', class: "thumbnail__buttons", segmented: showEditButton && showRemoveButton }, showEditButton && (h("span", { key: 'aed0c7bd8dc5a9885eced979efa03d54edea1567' }, h("swirl-button", { key: '89eb1e51e35d5a7ce6d06e12da79681a8b285e87', hideLabel: true, icon: this.editButtonIcon, label: this.editButtonLabel, onClick: this.edit.emit, pill: this.size === "xl", variant: "on-image" }))), showRemoveButton && (h("span", { key: '839253223d48785b806b4c649cea6c7c927ac154' }, h("swirl-button", { key: '8aac033de19adbff2543f5385445867632b3c315', hideLabel: true, icon: "<swirl-icon-delete></swirl-icon-delete>", label: this.removeButtonLabel, onClick: this.remove.emit, pill: this.size === "xl", variant: "on-image" }))))), showTimestamp && (h("span", { key: '0ea04d69c205e22e7fcfc16cccbb8cfab3a6bd90', class: "thumbnail__timestamp" }, this.timestamp)))));
     }
     static get is() { return "swirl-thumbnail"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/swirl-time-input/swirl-time-input.js

@@ -161,7 +161,7 @@ export class SwirlTimeInput {
         const className = classnames("time-input", {
             "time-input--inline": this.inline,
         });
-        return (h(Host, { key: 'a79b3e8b2d712e97a646f86b150ffa3ae0bb4140' }, h("div", { key: '09d8b200b90eb10ef068f0c41463ad92e4162eaf', class: className }, h("input", { key: 'bc7e001212f32a7c762e18e23722e4e3ff6bf5bf', "aria-describedby": this.swirlAriaDescribedby, "aria-disabled": this.disabled ? "true" : undefined, "aria-invalid": ariaInvalid, autoFocus: this.autoFocus, class: "time-input__input", disabled: this.disabled, id: this.id, inputmode: "numeric", onBlur: this.onBlur, onClick: this.onClick, onFocus: this.onFocus, placeholder: this.placeholder, ref: (el) => (this.inputEl = el), required: this.required, type: "text", readonly: this.readonly }), h("span", { key: '991375f5186da7373823652f5c4ce81283cc44d0', class: "time-input__icon" }, h("swirl-icon-time-outlined", { key: '7c78121c4cb698c349b50f3046f6db95efd83233', size: this.iconSize })))));
+        return (h(Host, { key: '216daf5abbd3023a301056f8232c9409d96a18f6' }, h("div", { key: 'f6d1410135e5afb99e565519267f1a1f2ffdb553', class: className }, h("input", { key: '25c1bc3c08327719fcc778a76c1df0176b059274', "aria-describedby": this.swirlAriaDescribedby, "aria-disabled": this.disabled ? "true" : undefined, "aria-invalid": ariaInvalid, autoFocus: this.autoFocus, class: "time-input__input", disabled: this.disabled, id: this.id, inputmode: "numeric", onBlur: this.onBlur, onClick: this.onClick, onFocus: this.onFocus, placeholder: this.placeholder, ref: (el) => (this.inputEl = el), required: this.required, type: "text", readonly: this.readonly }), h("span", { key: '66cc990869f2c4f4d60c3c783d0de1b71dae1227', class: "time-input__icon" }, h("swirl-icon-time-outlined", { key: '873d59fee3d2a693dbf4aeaaa279a6c1f9daa536', size: this.iconSize })))));
     }
     static get is() { return "swirl-time-input"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/swirl-toast/swirl-toast.js

@@ -52,7 +52,7 @@ export class SwirlToast {
     }
     render() {
         const className = classnames("toast", `toast--intent-${this.intent}`);
-        return (h(Host, { key: '9a60bec945df3c15a823ee9350f7cf5eb7ec6c76' }, h("div", { key: '5fbf54732841cc7f56b480076e01c2c8130f62db', class: className }, this.icon && (h("span", { key: '32b7f3d945eca48dd6e06e1c09e6a8f251d95a1a', class: "toast__icon", innerHTML: this.icon, part: "toast__icon", ref: (el) => (this.iconEl = el) })), h("span", { key: '302223f8a851f542bff53fa2c77e14e8a8e6a6a9', class: "toast__content", innerHTML: this.content, part: "toast__content" }, h("slot", { key: '621340dbff7ac7b350776f323062ff6a6e0edb29' })), this.actionLabel && (h("swirl-button", { key: 'e3925dbdf646a44cc99cf4957e2d09a3c8c94644', class: "toast__action-button", label: this.actionLabel, onClick: this.onAction, variant: "plain" })), h("button", { key: 'b53ad57748fbe8665c3aa729949d5a49992008b8', "aria-label": this.dismissLabel || this.accessibleDismissLabel, class: "toast__dismiss-button", onClick: this.onDismiss, type: "button" }, this.dismissLabel, !Boolean(this.dismissLabel) && (h("swirl-icon-close", { key: '60429b81feafb9668ad4ce1e10426018bab30169', ref: (el) => (this.dismissIconEl = el) }))))));
+        return (h(Host, { key: 'bb09aa171a0b2c6b1a13cccb1a7d39224867aa95' }, h("div", { key: '4f513dd6adb090524ab8cea65cd43ea105f4abe3', class: className }, this.icon && (h("span", { key: '0ac020f9ccc652f4142442bb6779919552bb3178', class: "toast__icon", innerHTML: this.icon, part: "toast__icon", ref: (el) => (this.iconEl = el) })), h("span", { key: '7ddf0a7d05628f9168cca8f9c0ec443f8fd4f781', class: "toast__content", innerHTML: this.content, part: "toast__content" }, h("slot", { key: 'e2f1f701bf5d74a4d2aef6110866662cf2656418' })), this.actionLabel && (h("swirl-button", { key: '216a29fb8135688297da3ad54376dbc4686a9abd', class: "toast__action-button", label: this.actionLabel, onClick: this.onAction, variant: "plain" })), h("button", { key: 'cdac19936b6a86bc2d0696931c75dbfc07f86e75', "aria-label": this.dismissLabel || this.accessibleDismissLabel, class: "toast__dismiss-button", onClick: this.onDismiss, type: "button" }, this.dismissLabel, !Boolean(this.dismissLabel) && (h("swirl-icon-close", { key: '0c695b0f2915ebd5345edf24cf1e1f3c490100ef', ref: (el) => (this.dismissIconEl = el) }))))));
     }
     static get is() { return "swirl-toast"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/swirl-toast-provider/swirl-toast-provider.js

@@ -115,7 +115,7 @@ export class SwirlToastProvider {
         this.popoverEl.showPopover();
     }
     render() {
-        return (h(Host, { key: 'b814bfac33e13fa660a10ec5d29f5f45fbac8f8d', role: "status" }, h("swirl-stack", { key: '03972a88936dfd3697335295381889095f6fb3a8', class: "toast-provider__stack", part: "toast-provider__stack", popover: "manual", spacing: "12", align: "center", ref: (el) => (this.popoverEl = el) }, this.toasts.map((toast) => {
+        return (h(Host, { key: 'b8501278e44d6283f5b99429a23e6b9e7ada9104', role: "status" }, h("swirl-stack", { key: '78e1390fe33e326f0187b9a8a4bdb4a510cfe1e3', class: "toast-provider__stack", part: "toast-provider__stack", popover: "manual", spacing: "12", align: "center", ref: (el) => (this.popoverEl = el) }, this.toasts.map((toast) => {
             const props = {
                 ...toast,
                 content: undefined,

package/dist/collection/components/swirl-toggle-button/swirl-toggle-button.js

@@ -13,7 +13,7 @@ export class SwirlToggleButton {
             "button--pressed": this.isPressed,
         });
         const ariaLabel = this.hideLabel ? this.label : undefined;
-        return (h("button", { key: '0cd6453d6cf77f1c9f93c55505b3314cbe9b9563', class: classNames, type: "button", "aria-pressed": this.isPressed ? "true" : "false", "aria-label": ariaLabel, onClick: this.onClick }, this.icon && (h("swirl-icon", { key: '5cc066217c5e60ee65f29866e164a9801800f3fe', class: "button__icon", glyph: this.icon })), !this.hideLabel && h("span", { key: 'd920c72d3c64a259585415212c6a5db6e141326c', class: "button__label" }, this.label)));
+        return (h("button", { key: '67d3a5161526a7600afcbc7a83b107d9c5e9a088', class: classNames, type: "button", "aria-pressed": this.isPressed ? "true" : "false", "aria-label": ariaLabel, onClick: this.onClick }, this.icon && (h("swirl-icon", { key: '8fe2d70b0ad3749066365db625e5696e81ac21b5', class: "button__icon", glyph: this.icon })), !this.hideLabel && h("span", { key: '8c203735baf0386d63dcf3149f00de97b7c87d5f', class: "button__label" }, this.label)));
     }
     static get is() { return "swirl-toggle-button"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/swirl-toggle-group/swirl-toggle-group.js

@@ -55,7 +55,7 @@ export class SwirlToggleGroup {
         const className = classnames("toggle-group", `toggle-group--variant-${this.variant}`, {
             "toggle-group--elevated": this.elevated,
         });
-        return (h("swirl-stack", { key: 'd7d63a7cc5ae1b951bb5ecf1a92ae284cfd03ee9', class: className, "aria-label": this.swirlAriaLabel, spacing: "4", orientation: "horizontal", align: "center", role: "group" }, h("slot", { key: 'dab02efe5e0c516088452c64eab6fff4da4111f2', onSlotchange: this.onSlotChange })));
+        return (h("swirl-stack", { key: '1f6c938c5c60b51c9b72873360bf54f55181b233', class: className, "aria-label": this.swirlAriaLabel, spacing: "4", orientation: "horizontal", align: "center", role: "group" }, h("slot", { key: '260f2ae008e4ff331bf1d4d767af728ed4392244', onSlotchange: this.onSlotChange })));
     }
     static get is() { return "swirl-toggle-group"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/swirl-toolbar/swirl-toolbar.js

@@ -65,7 +65,7 @@ export class SwirlToolbar {
         });
     }
     render() {
-        return (h(Host, { key: 'c35364063a026fa37b25062bb3d2b3c428a48883' }, h("swirl-stack", { key: '4f098ba2e2ab10c84a163da9f7d2d6b602f5d2cd', align: "center", "aria-label": this.label, "aria-orientation": this.orientation, role: "toolbar", onKeyDown: this.onKeyDown, orientation: this.orientation, spacing: "8", wrap: true }, h("slot", { key: '5c9b3c4494d6732cc95f59675768ac66c6a5e0e8' }))));
+        return (h(Host, { key: 'e5bf35d2db73a711aed7b3be9a8eca3b416fa2d8' }, h("swirl-stack", { key: 'afec62b5180fbbf718f9fd6969317859bdd87d04', align: "center", "aria-label": this.label, "aria-orientation": this.orientation, role: "toolbar", onKeyDown: this.onKeyDown, orientation: this.orientation, spacing: "8", wrap: true }, h("slot", { key: '547745e4875f5144e40b3b39b40c1bc3496a3513' }))));
     }
     static get is() { return "swirl-toolbar"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/swirl-tooltip/swirl-tooltip.js

@@ -142,7 +142,7 @@ export class SwirlTooltip {
         const className = classnames("tooltip", `tooltip--actual-placement-${this.actualPosition?.placement}`, `tooltip--intent-${this.intent}`, {
             "tooltip--visible": this.visible,
         });
-        return (h(Host, { key: '348bb88243dd5eaad31ad27503d6f05170d9c271', onKeydown: this.onKeydown }, h("span", { key: '8447d5762b5967d5f12794b3591c0f1d52cc0d16', class: className }, h("span", { key: '83686934d4972e785c6176553dc096ee2c8917d3', class: "tooltip__reference", "aria-describedby": "tooltip", onFocusout: this.onFocusOut, onClick: this.hide, onFocusin: this.onFocusIn }, h("slot", { key: 'e8e3847654df05cc3e9ee6c3de31dffcf66d8125' })), h("span", { key: 'd69c95f45e5958bed03c131bbd88da0bc9df6d5c', class: "tooltip__popper", popover: "manual", ref: (el) => (this.popperEl = el), style: {
+        return (h(Host, { key: '081dd6c54be8fc69ea6d1539f96fbd255e7b554b', onKeydown: this.onKeydown }, h("span", { key: '7533ab531495af7c8322e49a8c6554d82a5297ad', class: className }, h("span", { key: '054338a0171d7d704e925afccc8e71a2e3ae2a9b', class: "tooltip__reference", "aria-describedby": "tooltip", onFocusout: this.onFocusOut, onClick: this.hide, onFocusin: this.onFocusIn }, h("slot", { key: '34248cfda512f0ec9af9f63250374b0ff044fc51' })), h("span", { key: 'c2068d16b37732ec06605dea3b5c589f2e1255d4', class: "tooltip__popper", popover: "manual", ref: (el) => (this.popperEl = el), style: {
                 top: Boolean(this.actualPosition)
                     ? `${this.actualPosition?.y}px`
                     : "",
@@ -150,7 +150,7 @@ export class SwirlTooltip {
                     ? `${this.actualPosition?.x}px`
                     : "",
                 maxWidth: this.maxWidth,
-            } }, this.visible && (h("span", { key: 'a3886adda66b6cf9b1d5cabe8b16302fd1183aaf', class: "tooltip__bubble", id: "tooltip", part: "tooltip__bubble", role: "tooltip" }, h("span", { key: 'd69febd1882783e7c873ecbb388a4cfff9317ad1', class: "tooltip__content", innerHTML: this.content }))), h("span", { key: '2da0cf92ffa3b68ca54bc093ece183f51bf4878a', class: "tooltip__arrow", ref: (el) => (this.arrowElement = el), style: {
+            } }, this.visible && (h("span", { key: '7953009404b0ef5d5d078652afd9f1d67dc6eef6', class: "tooltip__bubble", id: "tooltip", part: "tooltip__bubble", role: "tooltip" }, h("span", { key: '4cb0b43e4597f2921c4b072b0ab176dd6fb5e090', class: "tooltip__content", innerHTML: this.content }))), h("span", { key: '8001e74ba0027817ad476708c9c247cc31fe0847', class: "tooltip__arrow", ref: (el) => (this.arrowElement = el), style: {
                 ...this.arrowStyles,
                 visibility: this.visible ? "visible" : "hidden",
             } })))));

package/dist/collection/components/swirl-tree-navigation/swirl-tree-navigation.js

@@ -1,7 +1,7 @@
 import { h, Host } from "@stencil/core";
 export class SwirlTreeNavigation {
     render() {
-        return (h(Host, { key: 'f4ee31544ad3b79839bc0c1a92b5691cf0b28565' }, h("ul", { key: '1ed10a784d914feb64e0317f43a8666538c89e17', "aria-label": this.label, class: "tree-navigation", role: "tree" }, h("slot", { key: 'c264e6354d97bbcb48b8df27d8f7bbacefc44350' }))));
+        return (h(Host, { key: '995f8509335d420ac86e81298f559d77b8cf9ce4' }, h("ul", { key: '7e99fb58aba29b470dcb33d0774f2290a13779a1', "aria-label": this.label, class: "tree-navigation", role: "tree" }, h("slot", { key: 'c260ccc175c0d8290604fd8e3592fcbc8ae5fcb7' }))));
     }
     static get is() { return "swirl-tree-navigation"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/swirl-tree-navigation-item/swirl-tree-navigation-item.js

@@ -84,12 +84,12 @@ export class SwirlTreeNavigationItem {
             "tree-navigation-item__link--active": this.active,
             "tree-navigation-item__link--has-icon": Boolean(this.icon),
         });
-        return (h(Host, { key: '90b0f48981ad34ed6b8c684609cea3ddeab0e028', role: "none" }, h("li", { key: 'e05e7e363c00ff5f46bb4c8aa3224f96c91b8717', class: {
+        return (h(Host, { key: '65d7646b55d35359b8c95860d22954d036207aa0', role: "none" }, h("li", { key: '7723375b74a45cfad59ae7d3f598c4d60d828f49', class: {
                 "tree-navigation-item": true,
                 "tree-navigation-item--expanded": this.expanded,
-            }, role: "treeitem", "aria-expanded": this.hasChildren ? this.expanded : undefined, "aria-level": this.level }, h(Tag, { key: 'be1e8efcf51a5dbd3d901920810a71fc18718f85', onClick: this.toggleExpanded, onKeyDown: this.onKeyDown, class: linkClassName, href: this.href, target: this.target, type: isLink ? undefined : "button", id: this.buttonId, "aria-current": this.active ? "page" : undefined, "aria-controls": this.hasChildren ? this.childrenId : undefined, "aria-expanded": this.hasChildren ? this.expanded : undefined }, h("span", { key: '98122b2ae3cc7701312660ae05e31f65088103aa', class: "tree-navigation-item__content" }, this.icon && (h("swirl-icon", { key: 'a7002c3f53b60f4f0f31133e015e9edba79ea679', class: "tree-navigation-item__icon", glyph: this.icon, size: 20, "aria-hidden": "true", role: "img", "aria-label": `${this.label} icon` })), h("span", { key: 'f5bd2ebe90743feec9cd602ed5e0faeba5273bdf', class: "tree-navigation-item__label" }, h("span", { key: 'b02063dd4c2aeca6ab4a3e9e34a6d47e9be8fb76', class: "tree-navigation-item__label-text" }, this.label), this.expandable && this.hasChildren && !this.external && (h("span", { key: 'afca3f01f8322fd62f4dd8fe49323b90d637a714', class: "tree-navigation-item__toggle-icon", "aria-hidden": "true" }, h("swirl-icon-chevron-right", { key: '6db2980263fe73eb73d506c7f6b5e7cfba1c906a', size: 16, role: "img", "aria-label": "Expand" }))), this.external && (h("span", { key: '2969ff31ecceef68f69da7f275fec2fedf81e7a3', class: "tree-navigation-item__external-icon", "aria-hidden": "true" }, h("swirl-icon-open-in-new", { key: '4cd5b826f5b513ccc0f7a6100f44b97087b06cd5', size: 16, role: "img", "aria-label": "External link" })))), this.markAsNew && (h("swirl-tag", { key: 'a8b36db59b26a6d6683a0602795af64351baf7fd', class: "tree-navigation-item__is-new-tag", intent: "info", label: this.markAsNewLabel, size: "m", variant: "default" })))), this.hasChildren && (h("ul", { key: 'c98b39844168f33b788fbf5384463080b08ab5b1', class: "tree-navigation-item__children", id: this.childrenId, role: "group", "aria-label": `${this.label} submenu`, ref: (el) => (this.childrenRef = el), style: {
+            }, role: "treeitem", "aria-expanded": this.hasChildren ? this.expanded : undefined, "aria-level": this.level }, h(Tag, { key: 'a6d1eac39914535ad1b0a6fe23e969555d120cb9', onClick: this.toggleExpanded, onKeyDown: this.onKeyDown, class: linkClassName, href: this.href, target: this.target, type: isLink ? undefined : "button", id: this.buttonId, "aria-current": this.active ? "page" : undefined, "aria-controls": this.hasChildren ? this.childrenId : undefined, "aria-expanded": this.hasChildren ? this.expanded : undefined }, h("span", { key: 'f87f481405aed2919b55afb6de4c164e78a49b2c', class: "tree-navigation-item__content" }, this.icon && (h("swirl-icon", { key: '9d31be64560dd1ecc872188466fb8b878879e4aa', class: "tree-navigation-item__icon", glyph: this.icon, size: 20, "aria-hidden": "true", role: "img", "aria-label": `${this.label} icon` })), h("span", { key: '7c32eb7030266968458eca91410c1cc77bb3b203', class: "tree-navigation-item__label" }, h("span", { key: '5e2e7a03818dd30f5ea4ec73b501de134be3f0e6', class: "tree-navigation-item__label-text" }, this.label), this.expandable && this.hasChildren && !this.external && (h("span", { key: '9919dd1fc61939aa9359f8c42a34237d97ef25da', class: "tree-navigation-item__toggle-icon", "aria-hidden": "true" }, h("swirl-icon-chevron-right", { key: '2f3e288762d7104ab181ced82b2c67843439c941', size: 16, role: "img", "aria-label": "Expand" }))), this.external && (h("span", { key: '2afcea9fbcce0eac77afa8a717a047b51da9783e', class: "tree-navigation-item__external-icon", "aria-hidden": "true" }, h("swirl-icon-open-in-new", { key: 'ba863b611a8bb981e2a2ed80791e842f8ec765a9', size: 16, role: "img", "aria-label": "External link" })))), this.markAsNew && (h("swirl-tag", { key: '35caa4cd95b4b6a5f189f451a723c93b07c7d926', class: "tree-navigation-item__is-new-tag", intent: "info", label: this.markAsNewLabel, size: "m", variant: "default" })))), this.hasChildren && (h("ul", { key: '07f280ffc466d85dacadcfa24fdd4f9ea632a1c8', class: "tree-navigation-item__children", id: this.childrenId, role: "group", "aria-label": `${this.label} submenu`, ref: (el) => (this.childrenRef = el), style: {
                 height: this.childrenHeight,
-            } }, h("slot", { key: '552b23adea070d6b1951ae4f87b52eaf3c841db8' }))))));
+            } }, h("slot", { key: 'c504101b683a6f67223aa9b609ab0089cd261424' }))))));
     }
     static get is() { return "swirl-tree-navigation-item"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/swirl-tree-view/swirl-tree-view.js

@@ -327,7 +327,7 @@ export class SwirlTreeView {
         }
     }
     render() {
-        return (h(Host, { key: '16d74aad51e57f5fc909eec33f55ee95bee94950' }, this.enableDragDrop && (h("swirl-visually-hidden", { key: '7aa7785d4b14b0b1b206fbeb4ec3406e50db7ee4' }, h("span", { key: '4cb2256c612883094d69644e00095a37ed5a9b9d', "aria-live": "assertive" }, this.liveRegionText))), h("ul", { key: 'b7085ee5c4c9a7e14d43c025019da22da00b3e6c', "aria-label": this.label, class: "tree-view", onFocusin: this.onFocus, onFocusout: this.onBlur, role: this.semantics === "tree" ? "tree" : undefined, ref: (el) => (this.listElement = el), tabIndex: -1 }, h("slot", { key: '0cafa4fef896d51a2fbc46ccabf02cc61522e562', onSlotchange: this.onSlotChange }))));
+        return (h(Host, { key: '7176fa6a7a923aee1b4096a17fcf1c454c92b867' }, this.enableDragDrop && (h("swirl-visually-hidden", { key: '6ca04079a149024b5c50e7791ac93f50f2ae7abc' }, h("span", { key: '87a4c9cada8e897e268aa41bbd008c5a75d7d97e', "aria-live": "assertive" }, this.liveRegionText))), h("ul", { key: '1c70da89cca8f6b8515cf123c26834fd5b431c51', "aria-label": this.label, class: "tree-view", onFocusin: this.onFocus, onFocusout: this.onBlur, role: this.semantics === "tree" ? "tree" : undefined, ref: (el) => (this.listElement = el), tabIndex: -1 }, h("slot", { key: '61a04bc191597ee1e19083628d59680a97928355', onSlotchange: this.onSlotChange }))));
     }
     static get is() { return "swirl-tree-view"; }
     static get originalStyleUrls() {

package/dist/collection/components/swirl-tree-view-item/swirl-tree-view-item.js

@@ -329,17 +329,17 @@ export class SwirlTreeViewItem {
             "tree-view-item--disable-drag": this.disableDrag,
             "tree-view-item--has-tags": hasTags,
         });
-        return (h(Host, { key: '8cf5abd381089d2d67b4d04f8c7dd37c9a425104', id: this.itemId, role: semantics === "tree" ? "none" : "listitem" }, h(Tag, { key: '16fb5ddaa65f23ee06debfdd263c189b06b64d9f', class: className, role: semantics === "tree" ? "none" : undefined }, h("a", { key: '1005cc3067fac785b700879793ec97070fe48f18', "aria-current": this.active ? "page" : undefined, "aria-expanded": !hasChildren || semantics !== "tree"
+        return (h(Host, { key: '025f8c3650b421d770bb73dcba6ab0457030e34b', id: this.itemId, role: semantics === "tree" ? "none" : "listitem" }, h(Tag, { key: '6aa9b5fee7f36fbbfe19237440642354355927c0', class: className, role: semantics === "tree" ? "none" : undefined }, h("a", { key: 'e23851bd6c9529932c363b889985230aadb09be9', "aria-current": this.active ? "page" : undefined, "aria-expanded": !hasChildren || semantics !== "tree"
                 ? undefined
                 : String(expanded), "aria-level": semantics === "tree" ? this.level + 1 : undefined, "aria-owns": hasChildren && semantics === "tree"
                 ? `${this.itemId}-children`
-                : undefined, "aria-selected": semantics === "tree" ? String(this.selected) : undefined, class: "tree-view-item__link", href: this.href, onFocus: this.onFocus, onKeyDown: this.onKeyDown, ref: (el) => (this.link = el), role: semantics === "tree" ? "treeitem" : undefined, tabIndex: tabIndex }, !this.disableDrag && this.enableDragDrop && (h("span", { key: 'ccff29b00833ca770971896ad880fafc014f1ad9', class: "tree-view-item__drag-handle" }, h("swirl-icon-drag-handle", { key: '8134fba6fd6ca02497ee416550a2dc219133f03b', size: 20 }))), this.expandable && semantics === "tree" && (h("span", { key: 'e97db02e7f4cbf30d70880c749f21d423b72f390', class: "tree-view-item__toggle-icon" }, hasChildren && (h(Fragment, { key: '2d8b864460e55ac130f11ee594fab5b74e064bf3' }, expanded ? (h("swirl-icon-expand-more", { onClick: this.onClickCollapse, size: 24 })) : (h("swirl-icon-chevron-right", { onClick: this.onClickExpand, size: 24 })))))), Boolean(this.icon) && (h(Fragment, { key: 'ff85d76dd08e91a4f0feb0e3a7429cf3f2f25f89' }, h("span", { key: 'cee8cdca04d0a79d30af132aac01e3a7a93c7aa0', class: "tree-view-item__icon" }, iconIsEmoji ? (this.icon) : (h("swirl-icon", { glyph: this.icon, size: 24, color: this.iconColor }))))), h("span", { key: 'c047c655f57ddd32b25e53ed2895ee3a59387eb0', class: "tree-view-item__label" }, this.label), h("span", { key: 'ad951c79736e6a770bfae5d4eb0966d58d7bed12', class: "tree-view-item__tags" }, h("slot", { key: '15b80f3681a66f14e9fb86d81ad71d1c7e57a4c8', name: "tags" }))), h("ul", { key: 'b4ecc45f07511851c56c44c1f4c7c02ac94adf7e', "aria-label": this.label, class: `tree-view-item__children ${shouldShowChildrenDropZone
+                : undefined, "aria-selected": semantics === "tree" ? String(this.selected) : undefined, class: "tree-view-item__link", href: this.href, onFocus: this.onFocus, onKeyDown: this.onKeyDown, ref: (el) => (this.link = el), role: semantics === "tree" ? "treeitem" : undefined, tabIndex: tabIndex }, !this.disableDrag && this.enableDragDrop && (h("span", { key: '0c8af332f5a53ebd55593f060cd08f641a4a609d', class: "tree-view-item__drag-handle" }, h("swirl-icon-drag-handle", { key: 'db733b38096f884b6a44847a49a0dcc5bd830f90', size: 20 }))), this.expandable && semantics === "tree" && (h("span", { key: 'a833e59b123f5644aecd23554cdd749627447bc4', class: "tree-view-item__toggle-icon" }, hasChildren && (h(Fragment, { key: 'b127b065e2b5375bed399a3643657b8d746cf0d2' }, expanded ? (h("swirl-icon-expand-more", { onClick: this.onClickCollapse, size: 24 })) : (h("swirl-icon-chevron-right", { onClick: this.onClickExpand, size: 24 })))))), Boolean(this.icon) && (h(Fragment, { key: 'cd795ad9156ec5e444d8f47dac238123611b7cc2' }, h("span", { key: '94d627f8e6ac42e17c1df61dcb15c6c8bc46f8ac', class: "tree-view-item__icon" }, iconIsEmoji ? (this.icon) : (h("swirl-icon", { glyph: this.icon, size: 24, color: this.iconColor }))))), h("span", { key: '204b7de4cb8ce3e40a056d19cdb6c7e950e29acb', class: "tree-view-item__label" }, this.label), h("span", { key: '653a63ab674e1ca3e8c4b64e59111d40c13f8ba2', class: "tree-view-item__tags" }, h("slot", { key: '006112f69fab20ac4411635af4a01fd2349f12e9', name: "tags" }))), h("ul", { key: 'c4940050841aa411744f35b8a831ee9c0c1e5e07', "aria-label": this.label, class: `tree-view-item__children ${shouldShowChildrenDropZone
                 ? "tree-view-item__children--drop-zone"
                 : ""}`, id: `${this.itemId}-children`, ref: (el) => (this.childList = el), role: semantics === "tree" ? "group" : undefined, style: {
                 display: (!expanded || !hasChildren) && !shouldShowChildrenDropZone
                     ? "none"
                     : undefined,
-            } }, h("slot", { key: 'beb970cb39949293f27bdf215a56e9361cd12ee9' })))));
+            } }, h("slot", { key: '4ffc10009cea0a549b1bbbbb8857202c8e381ab2' })))));
     }
     static get is() { return "swirl-tree-view-item"; }
     static get originalStyleUrls() {

package/dist/collection/components/swirl-video-thumbnail/swirl-video-thumbnail.js

@@ -4,7 +4,7 @@ export class SwirlVideoThumbnail {
         this.durationLabel = "Duration";
     }
     render() {
-        return (h(Host, { key: '731b636659839397d5b6ef7088ad3deef85cbcce' }, h("button", { key: '33d5d1db9354ae1fa916365feb0bd296dc18c853', "aria-describedby": this.duration !== undefined ? "duration" : undefined, "aria-label": this.label, class: "video-thumbnail", type: "button" }, h("img", { key: '2bb290f3a630bc931abc6be96908edb86275e0b8', alt: "", class: "video-thumbnail__image", loading: "lazy", src: this.src }), this.duration && (h("span", { key: '5b76df9eccfcc6ee5c924a6d437431d91c20b45d', class: "video-thumbnail__duration", id: "duration" }, h("swirl-visually-hidden", { key: 'ef774404902e44ba51cd1b950c56920d3fad501f' }, this.durationLabel), this.duration)), h("svg", { key: 'd0aebbb3fd114b1ed1e7af8773f75abd98849c61', class: "video-thumbnail__play-icon", fill: "none", viewBox: "0 0 40 40", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '6fdbcaf6d772ec451315d5e3aaeaa1d5d54c4aef', d: "M15 14.65V25.35C15 26.1167 15.35 26.7 16.05 27.1C16.75 27.5 17.4333 27.4667 18.1 27L26.4 21.7C27.0333 21.3 27.35 20.7333 27.35 20C27.35 19.2667 27.0333 18.7 26.4 18.3L18.1 13C17.4333 12.5333 16.75 12.5 16.05 12.9C15.35 13.3 15 13.8833 15 14.65ZM20 40C17.2333 40 14.6333 39.4747 12.2 38.424C9.76667 37.3747 7.65 35.95 5.85 34.15C4.05 32.35 2.62533 30.2333 1.576 27.8C0.525334 25.3667 0 22.7667 0 20C0 17.2333 0.525334 14.6333 1.576 12.2C2.62533 9.76667 4.05 7.65 5.85 5.85C7.65 4.05 9.76667 2.62467 12.2 1.574C14.6333 0.524667 17.2333 0 20 0C22.7667 0 25.3667 0.524667 27.8 1.574C30.2333 2.62467 32.35 4.05 34.15 5.85C35.95 7.65 37.3747 9.76667 38.424 12.2C39.4747 14.6333 40 17.2333 40 20C40 22.7667 39.4747 25.3667 38.424 27.8C37.3747 30.2333 35.95 32.35 34.15 34.15C32.35 35.95 30.2333 37.3747 27.8 38.424C25.3667 39.4747 22.7667 40 20 40Z", fill: "white", "fill-opacity": "0.95" })))));
+        return (h(Host, { key: 'ff0ad8dc2d5fcd2cfd41e5b8ce19c7a2f3a47c12' }, h("button", { key: 'e425359024742f5fb3ca837d991acbc763a5d7b8', "aria-describedby": this.duration !== undefined ? "duration" : undefined, "aria-label": this.label, class: "video-thumbnail", type: "button" }, h("img", { key: '27cdb0a1d3f103c0a872771d86fa85c63564512d', alt: "", class: "video-thumbnail__image", loading: "lazy", src: this.src }), this.duration && (h("span", { key: 'c652939099a4f832fcb3a36039fcc925dc214476', class: "video-thumbnail__duration", id: "duration" }, h("swirl-visually-hidden", { key: 'a341e3846c63e3c28bfa23968024631537e55a79' }, this.durationLabel), this.duration)), h("svg", { key: '45ce359c4c221ca71a3878acd6f2c9f7a558401a', class: "video-thumbnail__play-icon", fill: "none", viewBox: "0 0 40 40", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'c1ba1cc7be2706804177f08c21d83be5e0f6a164', d: "M15 14.65V25.35C15 26.1167 15.35 26.7 16.05 27.1C16.75 27.5 17.4333 27.4667 18.1 27L26.4 21.7C27.0333 21.3 27.35 20.7333 27.35 20C27.35 19.2667 27.0333 18.7 26.4 18.3L18.1 13C17.4333 12.5333 16.75 12.5 16.05 12.9C15.35 13.3 15 13.8833 15 14.65ZM20 40C17.2333 40 14.6333 39.4747 12.2 38.424C9.76667 37.3747 7.65 35.95 5.85 34.15C4.05 32.35 2.62533 30.2333 1.576 27.8C0.525334 25.3667 0 22.7667 0 20C0 17.2333 0.525334 14.6333 1.576 12.2C2.62533 9.76667 4.05 7.65 5.85 5.85C7.65 4.05 9.76667 2.62467 12.2 1.574C14.6333 0.524667 17.2333 0 20 0C22.7667 0 25.3667 0.524667 27.8 1.574C30.2333 2.62467 32.35 4.05 34.15 5.85C35.95 7.65 37.3747 9.76667 38.424 12.2C39.4747 14.6333 40 17.2333 40 20C40 22.7667 39.4747 25.3667 38.424 27.8C37.3747 30.2333 35.95 32.35 34.15 34.15C32.35 35.95 30.2333 37.3747 27.8 38.424C25.3667 39.4747 22.7667 40 20 40Z", fill: "white", "fill-opacity": "0.95" })))));
     }
     static get is() { return "swirl-video-thumbnail"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/swirl-visually-hidden/swirl-visually-hidden.js

@@ -1,7 +1,7 @@
 import { h, Host } from "@stencil/core";
 export class SwirlVisuallyHidden {
     render() {
-        return (h(Host, { key: '30db53411b48553ccf29c89e7721c4d8d78dd6dd' }, h("slot", { key: '9e9983029ef3807879dd5451b3819d29a3dd1609' })));
+        return (h(Host, { key: '6b516ff521a539c78d97b8a2541c5252577a0f75' }, h("slot", { key: '0fdf49e6191664af465b6f9bf1257f31e367ba29' })));
     }
     static get is() { return "swirl-visually-hidden"; }
     static get encapsulation() { return "scoped"; }

package/dist/components/swirl-accordion-item.js

@@ -1 +1 @@
-import{proxyCustomElement as i,HTMLElement as e,createEvent as o,h as t,Host as a,transformTag as d}from"@stencil/core/internal/client";import{c as s}from"./index2.js";import{d as n}from"./swirl-icon2.js";import{d as c}from"./swirl-text2.js";import{v as r}from"./v4.js";const l=i(class extends e{constructor(i){super(),!1!==i&&this.__registerHost(),this.__attachShadow(),this.expansionChange=o(this,"expansionChange",7),this.headingLevel=2,this.itemId=r(),this.expanded=!1,this.headingId=r()+"-heading",this.onHeadingClick=()=>{this.toggle()}}componentWillLoad(){if(this.accordion=this.el.closest("swirl-accordion"),this.expanded=this.initiallyOpen&&!this.disabled||!1,!this.accordion)throw Error("[Swirl] swirl-accordion-item must be a child of a swirl-accordion.")}async collapse(){this.expanded&&!this.disabled&&(this.expanded=!1,this.expansionChange.emit(this.expanded))}async expand(){this.expanded||this.disabled||(this.expanded=!0,this.expansionChange.emit(this.expanded))}async toggle(){this.expanded?this.collapse():this.expand()}render(){const i="h"+this.headingLevel,e=s("accordion-item",{"accordion-item--expanded":this.expanded});return t(a,{key:"9eb402da9e5382bc658a3bf2bcc6a4e6fc83eb15"},t("div",{key:"baf87dc91914002c5c26dd360a11520b0059638f",class:e},t(i,{key:"a80584ad5c65a7f6a1ddbc504c456dedd4d8ae50",class:"accordion-item__heading"},t("button",{key:"2a99df8d96f34a7b7e0f9c7838e052f79881f5da","aria-controls":this.itemId,"aria-expanded":this.expanded+"",class:"accordion-item__toggle",disabled:this.disabled,id:this.headingId,onClick:this.onHeadingClick,type:"button"},t("slot",{key:"f81381e388c95ba7ab3fddaf9622cf8036289dfd",name:"media"}),t("span",{key:"bc855d5d5fc262c67478d00e5b4979f9f573c465",class:"accordion-item__toggle-text"},this.heading,this.description&&t("swirl-text",{key:"e84613303533dbc57b2e8fbf78ae0b8682631fd7",as:"span",color:"subdued",size:"sm"},this.description)),t("slot",{key:"c441d88ef4e97bb0a0be9b6b79f3c2a4976bc82f",name:"trailing"}),t("span",{key:"1fd5da1543bd83149408f79521aec30d8cfea3e8",class:"accordion-item__icon"},!this.expanded&&t("swirl-icon",{key:"05616a2e22f5f9154654bac3e015bb9ad968bd79",glyph:"chevron-right",size:20}),this.expanded&&t("swirl-icon",{key:"eb1e3be7c7ef2153c195d87d9170d76b56627f24",glyph:"expand-more",size:20})))),t("div",{key:"ea15a0c40f8b32194b1acd5f1c6be4db8fbf1f82","aria-labelledby":this.headingId,class:"accordion-item__content",id:this.itemId,role:"region"},t("slot",{key:"b85f37fcc199ba95c68f049bc15470dc224f5c2b"}))))}get el(){return this}static get style(){return":host{display:block}:host *{box-sizing:border-box}.accordion-item{display:grid;align-content:start;border-top:0.0625rem solid var(--s-border-default);transition:grid-template-rows 0.15s;grid-template-rows:auto 0fr;will-change:grid-template-rows}@media (prefers-reduced-motion){.accordion-item{transition:none}}.accordion-item--expanded{grid-template-rows:auto 1fr}.accordion-item--expanded .accordion-item__content{padding-top:var(--s-space-16);padding-bottom:var(--s-space-16);animation:accordion-overflow 0.01s;animation-delay:0.15s;animation-fill-mode:forwards}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.accordion-item--expanded .accordion-item__content{padding-top:var(--s-space-8)}}.accordion-item__heading{margin:0;padding:0;font-size:var(--s-font-size-base);font-weight:var(--s-font-weight-semibold)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.accordion-item__heading{font-size:var(--s-font-size-sm)}}.accordion-item__toggle{display:flex;width:100%;padding:0;padding-top:var(--s-space-16);padding-bottom:var(--s-space-16);padding-left:var(--s-space-8);align-items:center;border:none;color:var(--s-text-default);background-color:var(--swirl-accordion-item-toggle-default);font:inherit;line-height:var(--s-line-height-lg);text-align:start;cursor:pointer;gap:var(--s-space-16)}.accordion-item__toggle:hover{background-color:var(--swirl-accordion-item-toggle-hovered)}.accordion-item__toggle:active{background-color:var(--swirl-accordion-item-toggle-pressed)}.accordion-item__toggle:disabled{color:var(--s-text-disabled);background-color:var(--swirl-accordion-item-toggle-default);cursor:default}.accordion-item__toggle:disabled .text{color:var(--s-text-disabled)}.accordion-item__toggle:focus:not(:focus-visible){outline:none}.accordion-item__toggle:focus-visible{outline-color:var(--s-focus-default)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.accordion-item__toggle{line-height:var(--s-line-height-sm)}}.accordion-item__toggle-text{flex-grow:1}.accordion-item__icon{display:inline-flex;padding-right:var(--s-space-8);flex-shrink:0}.accordion-item__content{overflow:hidden;padding-top:0;padding-bottom:0;transition:padding-top 0.15s, padding-bottom 0.15s;animation:accordion-display 0.01s;animation-delay:0.15s;animation-fill-mode:forwards}@media (prefers-reduced-motion){.accordion-item__content{transition:none}}@keyframes accordion-overflow{from{overflow:hidden}to{overflow:visible}}@keyframes accordion-display{from{display:block}to{display:none}}"}},[257,"swirl-accordion-item",{description:[1],disabled:[4],heading:[1],headingLevel:[2,"heading-level"],initiallyOpen:[4,"initially-open"],itemId:[1,"item-id"],expanded:[32],collapse:[64],expand:[64],toggle:[64]}]),m=l,h=function(){"undefined"!=typeof customElements&&["swirl-accordion-item","swirl-icon","swirl-text"].forEach((i=>{switch(i){case"swirl-accordion-item":customElements.get(d(i))||customElements.define(d(i),l);break;case"swirl-icon":customElements.get(d(i))||n();break;case"swirl-text":customElements.get(d(i))||c()}}))};export{m as SwirlAccordionItem,h as defineCustomElement}
+import{proxyCustomElement as i,HTMLElement as e,createEvent as o,h as t,Host as a,transformTag as s}from"@stencil/core/internal/client";import{c as n}from"./index2.js";import{d}from"./swirl-icon2.js";import{d as r}from"./swirl-text2.js";import{v as c}from"./v4.js";const l=i(class extends e{constructor(i){super(),!1!==i&&this.__registerHost(),this.__attachShadow(),this.expansionChange=o(this,"expansionChange",7),this.headingLevel=2,this.itemId=c(),this.expanded=!1,this.headingId=c()+"-heading",this.onHeadingClick=()=>{this.toggle()}}componentWillLoad(){if(this.accordion=this.el.closest("swirl-accordion"),this.expanded=this.initiallyOpen&&!this.disabled||!1,!this.accordion)throw Error("[Swirl] swirl-accordion-item must be a child of a swirl-accordion.")}async collapse(){this.expanded&&!this.disabled&&(this.expanded=!1,this.expansionChange.emit(this.expanded))}async expand(){this.expanded||this.disabled||(this.expanded=!0,this.expansionChange.emit(this.expanded))}async toggle(){this.expanded?this.collapse():this.expand()}render(){const i="h"+this.headingLevel,e=n("accordion-item",{"accordion-item--expanded":this.expanded});return t(a,{key:"8bb6a122faacd867f39e4353a940df6af7b2ba76"},t("div",{key:"3be3ffe9363a210a98c68991399e7503748263d2",class:e},t(i,{key:"07c489b680fe8095fafa004f9bc1608139577ee3",class:"accordion-item__heading"},t("button",{key:"b38e3f39389521e94723b18db0c0f3d5fcf90bfc","aria-controls":this.itemId,"aria-expanded":this.expanded+"",class:"accordion-item__toggle",disabled:this.disabled,id:this.headingId,onClick:this.onHeadingClick,type:"button"},t("slot",{key:"204e1845b0d3f63561b371fa03d68f377320eeda",name:"media"}),t("span",{key:"c1aa8ab20c044912c24af3f09c785f5d96af921b",class:"accordion-item__toggle-text"},this.heading,this.description&&t("swirl-text",{key:"f5998797a790b61af9b0c178e4c28a4d1847100f",as:"span",color:"subdued",size:"sm"},this.description)),t("slot",{key:"b4944fc6a77e821fdb97f4e541b3b9546502dbdc",name:"trailing"}),t("span",{key:"de53edeeed8236627240fe19cb0505eee483368a",class:"accordion-item__icon"},!this.expanded&&t("swirl-icon",{key:"25e492eb2a30c4911db245fb6b5989783373b01a",glyph:"chevron-right",size:20}),this.expanded&&t("swirl-icon",{key:"aea7f2cafff322371cc3b7466b3a8662b73dc89e",glyph:"expand-more",size:20})))),t("div",{key:"31ea6150d9f34624b83fb16b44e76ce40c36e955","aria-labelledby":this.headingId,class:"accordion-item__content",id:this.itemId,role:"region"},t("slot",{key:"65645a003698925abcc1c0a320479d99b3cbb299"}))))}get el(){return this}static get style(){return":host{display:block}:host *{box-sizing:border-box}.accordion-item{display:grid;align-content:start;border-top:0.0625rem solid var(--s-border-default);transition:grid-template-rows 0.15s;grid-template-rows:auto 0fr;will-change:grid-template-rows}@media (prefers-reduced-motion){.accordion-item{transition:none}}.accordion-item--expanded{grid-template-rows:auto 1fr}.accordion-item--expanded .accordion-item__content{padding-top:var(--s-space-16);padding-bottom:var(--s-space-16);animation:accordion-overflow 0.01s;animation-delay:0.15s;animation-fill-mode:forwards}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.accordion-item--expanded .accordion-item__content{padding-top:var(--s-space-8)}}.accordion-item__heading{margin:0;padding:0;font-size:var(--s-font-size-base);font-weight:var(--s-font-weight-semibold)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.accordion-item__heading{font-size:var(--s-font-size-sm)}}.accordion-item__toggle{display:flex;width:100%;padding:0;padding-top:var(--s-space-16);padding-bottom:var(--s-space-16);padding-left:var(--s-space-8);align-items:center;border:none;color:var(--s-text-default);background-color:var(--swirl-accordion-item-toggle-default);font:inherit;line-height:var(--s-line-height-lg);text-align:start;cursor:pointer;gap:var(--s-space-16)}.accordion-item__toggle:hover{background-color:var(--swirl-accordion-item-toggle-hovered)}.accordion-item__toggle:active{background-color:var(--swirl-accordion-item-toggle-pressed)}.accordion-item__toggle:disabled{color:var(--s-text-disabled);background-color:var(--swirl-accordion-item-toggle-default);cursor:default}.accordion-item__toggle:disabled .text{color:var(--s-text-disabled)}.accordion-item__toggle:focus:not(:focus-visible){outline:none}.accordion-item__toggle:focus-visible{outline-color:var(--s-focus-default)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.accordion-item__toggle{line-height:var(--s-line-height-sm)}}.accordion-item__toggle-text{flex-grow:1}.accordion-item__icon{display:inline-flex;padding-right:var(--s-space-8);flex-shrink:0}.accordion-item__content{overflow:hidden;padding-top:0;padding-bottom:0;transition:padding-top 0.15s, padding-bottom 0.15s;animation:accordion-display 0.01s;animation-delay:0.15s;animation-fill-mode:forwards}@media (prefers-reduced-motion){.accordion-item__content{transition:none}}@keyframes accordion-overflow{from{overflow:hidden}to{overflow:visible}}@keyframes accordion-display{from{display:block}to{display:none}}"}},[257,"swirl-accordion-item",{description:[1],disabled:[4],heading:[1],headingLevel:[2,"heading-level"],initiallyOpen:[4,"initially-open"],itemId:[1,"item-id"],expanded:[32],collapse:[64],expand:[64],toggle:[64]}]),m=l,h=function(){"undefined"!=typeof customElements&&["swirl-accordion-item","swirl-icon","swirl-text"].forEach((i=>{switch(i){case"swirl-accordion-item":customElements.get(s(i))||customElements.define(s(i),l);break;case"swirl-icon":customElements.get(s(i))||d();break;case"swirl-text":customElements.get(s(i))||r()}}))};export{m as SwirlAccordionItem,h as defineCustomElement}

package/dist/components/swirl-accordion.js

@@ -1 +1 @@
-import{proxyCustomElement as t,HTMLElement as e,createEvent as s,h as i,Host as n,transformTag as o}from"@stencil/core/internal/client";const c=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.expandedItemChange=s(this,"expandedItemChange",7),this.multiExpand=!1,this.componentLoaded=!1,this.onExpansionChange=t=>{t.detail&&(this.expandedItemChange.emit(t.target.itemId),this.collapseInactiveItems(t.target))}}connectedCallback(){this.componentLoaded&&this.el.addEventListener("expansionChange",this.onExpansionChange)}componentDidLoad(){this.el.addEventListener("expansionChange",this.onExpansionChange),this.componentLoaded=!0}disconnectedCallback(){this.el.removeEventListener("expansionChange",this.onExpansionChange)}async collapseItem(t){const e=Array.from(this.el.querySelectorAll("swirl-accordion-item")).find((e=>e.itemId===t));e&&e.collapse()}async expandItem(t){const e=Array.from(this.el.querySelectorAll("swirl-accordion-item")).find((e=>e.itemId===t));e&&e.expand()}collapseInactiveItems(t){this.multiExpand||Array.from(this.el.querySelectorAll("swirl-accordion-item")).forEach((e=>{e!==t&&e.collapse()}))}render(){return i(n,{key:"380395f009a7fa44a47494bf0fa6aa4b36c24b74"},i("slot",{key:"0ce853754c9ec49e121cc3d07edfa860944f0909"}))}get el(){return this}static get style(){return":host{display:block}:host *{box-sizing:border-box}::slotted(*:last-child){border-bottom:0.0625rem solid var(--s-border-default)}"}},[257,"swirl-accordion",{multiExpand:[4,"multi-expand"],collapseItem:[64],expandItem:[64]}]),a=c,r=function(){"undefined"!=typeof customElements&&["swirl-accordion"].forEach((t=>{"swirl-accordion"===t&&(customElements.get(o(t))||customElements.define(o(t),c))}))};export{a as SwirlAccordion,r as defineCustomElement}
+import{proxyCustomElement as t,HTMLElement as e,createEvent as s,h as i,Host as n,transformTag as o}from"@stencil/core/internal/client";const c=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.expandedItemChange=s(this,"expandedItemChange",7),this.multiExpand=!1,this.componentLoaded=!1,this.onExpansionChange=t=>{t.detail&&(this.expandedItemChange.emit(t.target.itemId),this.collapseInactiveItems(t.target))}}connectedCallback(){this.componentLoaded&&this.el.addEventListener("expansionChange",this.onExpansionChange)}componentDidLoad(){this.el.addEventListener("expansionChange",this.onExpansionChange),this.componentLoaded=!0}disconnectedCallback(){this.el.removeEventListener("expansionChange",this.onExpansionChange)}async collapseItem(t){const e=Array.from(this.el.querySelectorAll("swirl-accordion-item")).find((e=>e.itemId===t));e&&e.collapse()}async expandItem(t){const e=Array.from(this.el.querySelectorAll("swirl-accordion-item")).find((e=>e.itemId===t));e&&e.expand()}collapseInactiveItems(t){this.multiExpand||Array.from(this.el.querySelectorAll("swirl-accordion-item")).forEach((e=>{e!==t&&e.collapse()}))}render(){return i(n,{key:"25937d2d042dc3753956ae3c72bc07e1560da417"},i("slot",{key:"29561d30f49651000871ee630788b08c48a159fd"}))}get el(){return this}static get style(){return":host{display:block}:host *{box-sizing:border-box}::slotted(*:last-child){border-bottom:0.0625rem solid var(--s-border-default)}"}},[257,"swirl-accordion",{multiExpand:[4,"multi-expand"],collapseItem:[64],expandItem:[64]}]),a=c,r=function(){"undefined"!=typeof customElements&&["swirl-accordion"].forEach((t=>{"swirl-accordion"===t&&(customElements.get(o(t))||customElements.define(o(t),c))}))};export{a as SwirlAccordion,r as defineCustomElement}

package/dist/components/swirl-action-list-section.js

@@ -1 +1 @@
-import{proxyCustomElement as s,HTMLElement as e,h as a,Host as t,transformTag as i}from"@stencil/core/internal/client";import{d as c}from"./swirl-separator2.js";import{d as r}from"./swirl-stack2.js";const l=s(class extends e{constructor(s){super(),!1!==s&&this.__registerHost(),this.__attachShadow(),this.separatorSpacing="4",this.spacing="0",this.hasSeparator=!1}render(){return a(t,{key:"7a63a8a0b9832c08eadcb85533b3ec9e1e03437e"},this.hasSeparator&&a("swirl-separator",{key:"aaa33960c8a3db74b8b5df83ae3d725c603e0535",spacing:this.separatorSpacing}),a("div",{key:"3baa8270c6c9dc3de037657506c42ecdc5d4f060","aria-labelledby":"label",class:"action-list-section",role:"group"},a("span",{key:"6187f12fa3081721f2d25e360076a27649cda8bd",class:"action-list-section__label",id:"label",part:"action-list-section__label"},this.label),a("swirl-stack",{key:"4f3fbff155ad75167bcd5469a2df41e7679c5dd3",spacing:this.spacing,align:"stretch"},a("slot",{key:"f610b47db6a58184d18c950c975666abe890ba3b"}))))}static get style(){return":host{display:block;width:100%}:host *{box-sizing:border-box}.action-list-section__label{display:block;width:100%;padding:var(--s-space-8) var(--s-space-16);color:var(--s-text-subdued);font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-base);text-align:left}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.action-list-section__label{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm);padding:var(--s-space-8) var(--s-space-12)}}"}},[257,"swirl-action-list-section",{label:[1],separatorSpacing:[1,"separator-spacing"],spacing:[1],hasSeparator:[4,"has-separator"]}]),o=l,n=function(){"undefined"!=typeof customElements&&["swirl-action-list-section","swirl-separator","swirl-stack"].forEach((s=>{switch(s){case"swirl-action-list-section":customElements.get(i(s))||customElements.define(i(s),l);break;case"swirl-separator":customElements.get(i(s))||c();break;case"swirl-stack":customElements.get(i(s))||r()}}))};export{o as SwirlActionListSection,n as defineCustomElement}
+import{proxyCustomElement as s,HTMLElement as e,h as t,Host as a,transformTag as i}from"@stencil/core/internal/client";import{d as r}from"./swirl-separator2.js";import{d as c}from"./swirl-stack2.js";const l=s(class extends e{constructor(s){super(),!1!==s&&this.__registerHost(),this.__attachShadow(),this.separatorSpacing="4",this.spacing="0",this.hasSeparator=!1}render(){return t(a,{key:"eb2a81e4bd5875cb6020c179b6975658eadad18a"},this.hasSeparator&&t("swirl-separator",{key:"2ce6c3e64060c279c3ca27f792d18d70627d0e11",spacing:this.separatorSpacing}),t("div",{key:"22d2da6b25a936945b7d91eb0d6f043f3b64fc2a","aria-labelledby":"label",class:"action-list-section",role:"group"},t("span",{key:"155784d36dd80f43157f538f0772fef4013f0bea",class:"action-list-section__label",id:"label",part:"action-list-section__label"},this.label),t("swirl-stack",{key:"0e3ffd2c8118ca7a06625e4c3919d30dd6691356",spacing:this.spacing,align:"stretch"},t("slot",{key:"9ff701259251598625a3b5ebe3f34180ad1d27f3"}))))}static get style(){return":host{display:block;width:100%}:host *{box-sizing:border-box}.action-list-section__label{display:block;width:100%;padding:var(--s-space-8) var(--s-space-16);color:var(--s-text-subdued);font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-base);text-align:left}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.action-list-section__label{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm);padding:var(--s-space-8) var(--s-space-12)}}"}},[257,"swirl-action-list-section",{label:[1],separatorSpacing:[1,"separator-spacing"],spacing:[1],hasSeparator:[4,"has-separator"]}]),o=l,n=function(){"undefined"!=typeof customElements&&["swirl-action-list-section","swirl-separator","swirl-stack"].forEach((s=>{switch(s){case"swirl-action-list-section":customElements.get(i(s))||customElements.define(i(s),l);break;case"swirl-separator":customElements.get(i(s))||r();break;case"swirl-stack":customElements.get(i(s))||c()}}))};export{o as SwirlActionListSection,n as defineCustomElement}

package/dist/components/swirl-action-list2.js

@@ -1 +1 @@
-import{proxyCustomElement as t,HTMLElement as s,h as i,Host as e,transformTag as o}from"@stencil/core/internal/client";import{q as n,k as r}from"./utils.js";const c=t(class extends s{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.onKeyDown=t=>{"ArrowDown"===t.code||"ArrowRight"===t.code?(t.preventDefault(),t.stopPropagation(),this.focusNextItem()):"ArrowUp"!==t.code&&"ArrowLeft"!==t.code||(t.preventDefault(),t.stopPropagation(),this.focusPreviousItem())},this.onFocusOut=t=>{if(this.isInsidePopover)return;const s=t.relatedTarget,i=t.target,e="SWIRL-ACTION-LIST-ITEM"===i?.tagName,o=null===s||!this.el.contains(s);!this.isInsidePopover&&o&&e&&this.container.setAttribute("tabindex","0")},this.onFocus=()=>{if(this.isInsidePopover)return;this.container.removeAttribute("tabindex");const t=this.getItems(),s=this.getActiveItemIndex();s>-1?t[s]?.focus():t[0]?.focus()}}componentDidLoad(){queueMicrotask((()=>{this.isInsidePopover=null!==this.el.closest("swirl-popover"),this.isInsidePopover||this.container.setAttribute("tabindex","0")})),this.setSectionSeparator()}getItems(){return n(this.el,'[role="menuitem"]')}focusNextItem(){const t=this.getItems();t[(this.getActiveItemIndex()+1)%t.length].focus()}focusPreviousItem(){const t=this.getItems(),s=this.getActiveItemIndex(),i=0===s?t.length-1:s-1;t[i]?.focus()}getActiveItemIndex(){const t=this.getItems(),s=r();return t.findIndex((t=>t===s||t===s?.querySelector('[role="menuitem"]')))}setSectionSeparator(){this.el&&Array.from(this.el.querySelectorAll("swirl-action-list-section")).filter((t=>t.isConnected)).forEach(((t,s)=>{0===s&&"SWIRL-ACTION-LIST-ITEM"!==t.previousElementSibling?.tagName&&(t.hasSeparator=!1)}))}render(){return i(e,{key:"1c75c3ab32ea63fa2f841926c7796cacca0927a7"},i("div",{key:"a1d22c1d56d559dd212da3223654bd1a8d7f173d","aria-orientation":"vertical",class:"action-list",onFocusout:this.isInsidePopover?void 0:this.onFocusOut,onFocus:this.isInsidePopover?void 0:this.onFocus,onKeyDown:this.onKeyDown,part:"action-list",ref:t=>this.container=t,role:"menu"},i("slot",{key:"16ca662b99182ed96909eb5ffbee2e4373a07325",onSlotchange:this.setSectionSeparator})))}get el(){return this}static get style(){return":host{display:block;width:100%}:host *{box-sizing:border-box}"}},[257,"swirl-action-list",{isInsidePopover:[32]}]);function h(){"undefined"!=typeof customElements&&["swirl-action-list"].forEach((t=>{"swirl-action-list"===t&&(customElements.get(o(t))||customElements.define(o(t),c))}))}export{c as S,h as d}
+import{proxyCustomElement as t,HTMLElement as s,h as i,Host as e,transformTag as o}from"@stencil/core/internal/client";import{q as n,k as r}from"./utils.js";const c=t(class extends s{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.onKeyDown=t=>{"ArrowDown"===t.code||"ArrowRight"===t.code?(t.preventDefault(),t.stopPropagation(),this.focusNextItem()):"ArrowUp"!==t.code&&"ArrowLeft"!==t.code||(t.preventDefault(),t.stopPropagation(),this.focusPreviousItem())},this.onFocusOut=t=>{if(this.isInsidePopover)return;const s=t.relatedTarget,i=t.target,e="SWIRL-ACTION-LIST-ITEM"===i?.tagName,o=null===s||!this.el.contains(s);!this.isInsidePopover&&o&&e&&this.container.setAttribute("tabindex","0")},this.onFocus=()=>{if(this.isInsidePopover)return;this.container.removeAttribute("tabindex");const t=this.getItems(),s=this.getActiveItemIndex();s>-1?t[s]?.focus():t[0]?.focus()}}componentDidLoad(){queueMicrotask((()=>{this.isInsidePopover=null!==this.el.closest("swirl-popover"),this.isInsidePopover||this.container.setAttribute("tabindex","0")})),this.setSectionSeparator()}getItems(){return n(this.el,'[role="menuitem"]')}focusNextItem(){const t=this.getItems();t[(this.getActiveItemIndex()+1)%t.length].focus()}focusPreviousItem(){const t=this.getItems(),s=this.getActiveItemIndex(),i=0===s?t.length-1:s-1;t[i]?.focus()}getActiveItemIndex(){const t=this.getItems(),s=r();return t.findIndex((t=>t===s||t===s?.querySelector('[role="menuitem"]')))}setSectionSeparator(){this.el&&Array.from(this.el.querySelectorAll("swirl-action-list-section")).filter((t=>t.isConnected)).forEach(((t,s)=>{0===s&&"SWIRL-ACTION-LIST-ITEM"!==t.previousElementSibling?.tagName&&(t.hasSeparator=!1)}))}render(){return i(e,{key:"8561874ccf5c51f8f49617a00e42baa5835d190f"},i("div",{key:"16c78337ead243d2478b7642bd3998666b71aad3","aria-orientation":"vertical",class:"action-list",onFocusout:this.isInsidePopover?void 0:this.onFocusOut,onFocus:this.isInsidePopover?void 0:this.onFocus,onKeyDown:this.onKeyDown,part:"action-list",ref:t=>this.container=t,role:"menu"},i("slot",{key:"bea28f4015aee347000c261c5cd2ecbae1ad6283",onSlotchange:this.setSectionSeparator})))}get el(){return this}static get style(){return":host{display:block;width:100%}:host *{box-sizing:border-box}"}},[257,"swirl-action-list",{isInsidePopover:[32]}]);function h(){"undefined"!=typeof customElements&&["swirl-action-list"].forEach((t=>{"swirl-action-list"===t&&(customElements.get(o(t))||customElements.define(o(t),c))}))}export{c as S,h as d}

package/dist/components/swirl-app-icon.js

@@ -1 +1 @@
-import{proxyCustomElement as i,HTMLElement as e,h as t,Host as s,transformTag as o}from"@stencil/core/internal/client";import{c as n}from"./index2.js";const c=i(class extends e{constructor(i){super(),!1!==i&&this.__registerHost(),this.__attachShadow(),this.setImageAvailable=()=>{this.imageAvailable=!0},this.setImageUnavailable=()=>{this.imageAvailable=!1},this.onImageElementUpdate=i=>{this.imgEl?.removeEventListener("load",this.setImageAvailable),this.imgEl?.removeEventListener("error",this.setImageUnavailable),this.imgEl=i,this.imgEl&&(this.imgEl.addEventListener("load",this.setImageAvailable),this.imgEl.addEventListener("error",this.setImageUnavailable))}}disconnectedCallback(){this.imgEl?.removeEventListener("load",this.setImageAvailable),this.imgEl?.removeEventListener("error",this.setImageUnavailable)}render(){const i=!!this.src&&(this.imageAvailable||void 0===this.imageAvailable),e=!i&&!!this.icon,o=n("app-icon",{"app-icon--has-icon":e||!i&&!e});return t(s,{key:"fe8d516e1120d072e2f4600ca610bc4c13fd21f5"},t("span",{key:"221e8a7f2eb9c1486b3958d81e124cf2bbe12247",class:o},i&&t("img",{key:"50a6602a09d6e1f41e218137c3bbeca0afe7954f",alt:"",height:"256",ref:this.onImageElementUpdate,src:this.src,width:"256"}),e&&t("span",{key:"06d45bf19f89194eed5db2398fb572d6cb3125bf",class:"app-icon__icon",innerHTML:this.icon})))}static get style(){return":host{display:inline-flex}:host *{box-sizing:border-box}.app-icon{position:relative;overflow:hidden;width:var(--swirl-app-icon-size);height:var(--swirl-app-icon-size);border-radius:var(--s-border-radius-sm)}.app-icon>img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.app-icon__icon{display:inline-flex;width:100%;height:100%;justify-content:center;align-items:center}"}},[1,"swirl-app-icon",{icon:[1],src:[1],imageAvailable:[32]}]),r=c,a=function(){"undefined"!=typeof customElements&&["swirl-app-icon"].forEach((i=>{"swirl-app-icon"===i&&(customElements.get(o(i))||customElements.define(o(i),c))}))};export{r as SwirlAppIcon,a as defineCustomElement}
+import{proxyCustomElement as i,HTMLElement as t,h as s,Host as e,transformTag as c}from"@stencil/core/internal/client";import{c as o}from"./index2.js";const n=i(class extends t{constructor(i){super(),!1!==i&&this.__registerHost(),this.__attachShadow(),this.setImageAvailable=()=>{this.imageAvailable=!0},this.setImageUnavailable=()=>{this.imageAvailable=!1},this.onImageElementUpdate=i=>{this.imgEl?.removeEventListener("load",this.setImageAvailable),this.imgEl?.removeEventListener("error",this.setImageUnavailable),this.imgEl=i,this.imgEl&&(this.imgEl.addEventListener("load",this.setImageAvailable),this.imgEl.addEventListener("error",this.setImageUnavailable))}}disconnectedCallback(){this.imgEl?.removeEventListener("load",this.setImageAvailable),this.imgEl?.removeEventListener("error",this.setImageUnavailable)}render(){const i=!!this.src&&(this.imageAvailable||void 0===this.imageAvailable),t=!i&&!!this.icon,c=o("app-icon",{"app-icon--has-icon":t||!i&&!t});return s(e,{key:"753e9265e74955a7adc3b292135f8af3f18567f2"},s("span",{key:"d00bc78f17abf98658ed31f5a95ccfd72dba115e",class:c},i&&s("img",{key:"c5d193878e58c1f52ca7cac4b0e2900156af560c",alt:"",height:"256",ref:this.onImageElementUpdate,src:this.src,width:"256"}),t&&s("span",{key:"325a4507db448319e9aac0cb4ff8e2fc0620ad29",class:"app-icon__icon",innerHTML:this.icon})))}static get style(){return":host{display:inline-flex}:host *{box-sizing:border-box}.app-icon{position:relative;overflow:hidden;width:var(--swirl-app-icon-size);height:var(--swirl-app-icon-size);border-radius:var(--s-border-radius-sm)}.app-icon>img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.app-icon__icon{display:inline-flex;width:100%;height:100%;justify-content:center;align-items:center}"}},[1,"swirl-app-icon",{icon:[1],src:[1],imageAvailable:[32]}]),a=n,r=function(){"undefined"!=typeof customElements&&["swirl-app-icon"].forEach((i=>{"swirl-app-icon"===i&&(customElements.get(c(i))||customElements.define(c(i),n))}))};export{a as SwirlAppIcon,r as defineCustomElement}

package/dist/components/swirl-carousel-slide.js

@@ -1 +1 @@
-import{proxyCustomElement as e,HTMLElement as s,h as t,Host as i,transformTag as o}from"@stencil/core/internal/client";import{c as l}from"./index2.js";const a=e(class extends s{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.width="15.5rem"}render(){const e=l("carousel-slide",{"carousel-slide--has-min-height":!!this.minHeight});return t(i,{key:"bd595d626cca6ad119cfe2ad89aa639ee44e06f9","aria-roledescription":"slide","aria-label":this.label,class:e,role:"group",style:{aspectRatio:this.aspectRatio,flexBasis:this.width,minHeight:this.minHeight},tabIndex:0},t("slot",{key:"dcfd8cdfa905e26eababb896a2f48413febbe51f"}))}static get style(){return":host{display:block;min-width:0}:host(.carousel-slide--has-min-height) ::slotted(*){height:100%}:host *{box-sizing:border-box}:host ::slotted(*){width:100%;min-height:100%}"}},[257,"swirl-carousel-slide",{aspectRatio:[1,"aspect-ratio"],label:[1],minHeight:[1,"min-height"],width:[1]}]),r=a,c=function(){"undefined"!=typeof customElements&&["swirl-carousel-slide"].forEach((e=>{"swirl-carousel-slide"===e&&(customElements.get(o(e))||customElements.define(o(e),a))}))};export{r as SwirlCarouselSlide,c as defineCustomElement}
+import{proxyCustomElement as e,HTMLElement as s,h as t,Host as i,transformTag as o}from"@stencil/core/internal/client";import{c as l}from"./index2.js";const r=e(class extends s{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.width="15.5rem"}render(){const e=l("carousel-slide",{"carousel-slide--has-min-height":!!this.minHeight});return t(i,{key:"45dbb2e0cd412fea8b03dcc0e4499f43423d3b1a","aria-roledescription":"slide","aria-label":this.label,class:e,role:"group",style:{aspectRatio:this.aspectRatio,flexBasis:this.width,minHeight:this.minHeight},tabIndex:0},t("slot",{key:"26a428590d691cb999d880523422bd146dfe5d21"}))}static get style(){return":host{display:block;min-width:0}:host(.carousel-slide--has-min-height) ::slotted(*){height:100%}:host *{box-sizing:border-box}:host ::slotted(*){width:100%;min-height:100%}"}},[257,"swirl-carousel-slide",{aspectRatio:[1,"aspect-ratio"],label:[1],minHeight:[1,"min-height"],width:[1]}]),a=r,c=function(){"undefined"!=typeof customElements&&["swirl-carousel-slide"].forEach((e=>{"swirl-carousel-slide"===e&&(customElements.get(o(e))||customElements.define(o(e),r))}))};export{a as SwirlCarouselSlide,c as defineCustomElement}

package/dist/components/swirl-chip.js

@@ -1 +1 @@
-import{proxyCustomElement as i,HTMLElement as r,createEvent as c,h as s,Host as e,transformTag as a}from"@stencil/core/internal/client";import{c as t}from"./index2.js";import{D as h}from"./media-query.service.js";import{d as p}from"./swirl-icon-close2.js";import{d as o}from"./swirl-progress-indicator2.js";const n=i(class extends r{constructor(i){super(),!1!==i&&this.__registerHost(),this.chipClick=c(this,"chipClick",7),this.removeChip=c(this,"remove",7),this.borderRadius="pill",this.iconColor="default",this.intent="default",this.interactive=!1,this.progressBarLabel="Loading progress",this.removeButtonLabel="Remove",this.size="m",this.variant="outline",this.mediaQueryUnsubscribe=()=>{}}componentDidLoad(){this.mediaQueryUnsubscribe=h.subscribe((i=>{this.forceIconProps(i)}))}disconnectedCallback(){this.mediaQueryUnsubscribe()}forceIconProps(i){if(!this.iconEl)return;const r=this.iconEl.children[0],c="s"===this.size?"16":i?"20":"24";r?.setAttribute("size",c)}render(){const i=this.interactive||void 0!==this.pressed?"button":"span",r=!!this.el.querySelector('[slot="avatar"]'),c=!r&&!!this.icon,a=t("chip","chip--border-radius-"+this.borderRadius,"chip--icon-color-"+this.iconColor,"chip--intent-"+this.intent,"chip--size-"+this.size,"chip--variant-"+this.variant,{"chip--pressed":this.pressed,"chip--has-progress":void 0!==this.progress,"chip--interactive":this.interactive||void 0!==this.pressed,"chip--removable":this.removable});return s(e,{key:"8441fd4d5bacd8af0852bf4cf15e6cfa4ca1442e"},s(i,{key:"191157afdfeaab3473c67ac6a83f86db2dfc6060","aria-pressed":void 0!==this.pressed?this.pressed+"":void 0,class:a,onClick:this.chipClick.emit,type:this.interactive?"button":void 0},s("span",{key:"d63ba61bb1dc4f4c324350aa37a70b5a049e5ea7",class:"chip__inner"},r&&s("span",{key:"4da4223573b8f735ef0bb303b91161ad92803964",class:"chip__avatar"},s("slot",{key:"5359c6b8704daf7e9a04b71f270d76bd1c4974c3",name:"avatar"})),c&&s("span",{key:"8f76d873765be71081b9cfffba885f7adc2858bf",class:"chip__icon",innerHTML:this.icon,ref:i=>this.iconEl=i}),s("span",{key:"1adc269a72b3c71101050eb549736ab00754fb85",class:"chip__label"},this.label)),void 0!==this.progress&&s("span",{key:"898d123f6aadb6a469d4fc46ea520e8c314643b2",class:"chip__progress-indicator"},s("swirl-progress-indicator",{key:"9a5682df6cd28c497c4e1da7539f1e70916062e2",label:this.progressBarLabel,value:this.progress}))),this.removable&&s("button",{key:"1176bebffc3ab6b04a2ca83db6999285a6342633","aria-label":this.removeButtonLabel,class:"chip__remove-button",onClick:this.removeChip.emit,type:"button"},s("swirl-icon-close",{key:"0dc3ed45a49f1f351316e9673ee4bb339cf555ad",size:20})))}get el(){return this}static get style(){return'.sc-swirl-chip-h{position:relative;display:inline-flex;max-width:100%}.sc-swirl-chip-h *.sc-swirl-chip{box-sizing:border-box}.chip.sc-swirl-chip{display:inline-flex;overflow:hidden;max-width:100%;height:2.25rem;padding:0;border:0.0625rem solid var(--s-border-default);border-radius:1.25rem;color:var(--s-text-subdued);background-color:transparent;font:inherit;font-size:var(--s-font-size-sm);font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-sm);flex-direction:column}.chip--size-s.sc-swirl-chip{height:2rem}.chip--size-s.chip--removable.sc-swirl-chip .chip__inner.sc-swirl-chip{padding-right:calc(1.5rem + var(--s-space-12))}.chip--size-s.sc-swirl-chip .chip__inner.sc-swirl-chip{padding-right:var(--s-space-12);padding-left:var(--s-space-12)}.chip--size-s.sc-swirl-chip+.chip__remove-button.sc-swirl-chip{top:var(--s-space-4);width:1.5rem;height:1.5rem}.chip--interactive.sc-swirl-chip{cursor:pointer}.chip--interactive.sc-swirl-chip:hover{background-color:var(--s-state-hovered)}.chip--interactive.sc-swirl-chip:hover .sc-swirl-chip::part(avatar),.chip--interactive.sc-swirl-chip:hover .sc-swirl-chip [part~="avatar"]{background-color:var(--s-surface-raised-hovered)}.chip--interactive.sc-swirl-chip:hover+.chip__remove-button.sc-swirl-chip{background-color:var(--s-surface-raised-default)}.chip--interactive.sc-swirl-chip:hover+.chip__remove-button.sc-swirl-chip:hover{background-color:var(--s-surface-raised-hovered)}.chip--interactive.sc-swirl-chip:hover+.chip__remove-button.sc-swirl-chip:active{background-color:var(--s-state-pressed)}.chip--interactive.sc-swirl-chip:active{background-color:var(--s-state-pressed)}.chip--interactive.sc-swirl-chip:active .sc-swirl-chip::part(avatar),.chip--interactive.sc-swirl-chip:active .sc-swirl-chip [part~="avatar"]{background-color:var(--s-surface-raised-pressed)}.chip--interactive.sc-swirl-chip:active+.chip__remove-button.sc-swirl-chip{background-color:var(--s-state-pressed)}.chip--icon-color-highlight.sc-swirl-chip .chip__icon.sc-swirl-chip{color:var(--s-icon-highlight)}.chip--removable.sc-swirl-chip .chip__inner.sc-swirl-chip{padding-right:calc(1.875rem + var(--s-space-12))}.chip--intent-critical.sc-swirl-chip{border-color:var(--s-border-critical);color:var(--s-text-critical)}.chip--intent-critical.sc-swirl-chip .chip__icon.sc-swirl-chip{color:var(--s-icon-critical)}.chip--border-radius-sm.sc-swirl-chip{border-radius:var(--s-border-radius-sm)}.chip--intent-success.sc-swirl-chip{border-color:var(--s-border-success);color:var(--s-text-success)}.chip--intent-success.sc-swirl-chip .chip__icon.sc-swirl-chip{color:var(--s-icon-success)}.chip--intent-highlight.sc-swirl-chip{border-color:var(--s-border-highlight);color:var(--s-text-highlight)}.chip--intent-highlight.sc-swirl-chip .chip__icon.sc-swirl-chip{color:var(--s-icon-highlight)}.chip--variant-outline.chip--pressed.sc-swirl-chip,.chip--variant-translucent.chip--pressed.sc-swirl-chip{color:var(--s-text-on-action-primary);background-color:var(--s-action-primary-default);border-color:var(--s-action-primary-default)}.chip--variant-outline.chip--pressed.sc-swirl-chip:hover,.chip--variant-translucent.chip--pressed.sc-swirl-chip:hover{background-color:var(--s-action-primary-hovered)}.chip--variant-outline.chip--pressed.sc-swirl-chip:hover+.chip__remove-button.sc-swirl-chip,.chip--variant-translucent.chip--pressed.sc-swirl-chip:hover+.chip__remove-button.sc-swirl-chip{background-color:var(--s-action-primary-hovered)}.chip--variant-outline.chip--pressed.sc-swirl-chip:active,.chip--variant-translucent.chip--pressed.sc-swirl-chip:active{background-color:var(--s-action-primary-pressed)}.chip--variant-outline.chip--pressed.sc-swirl-chip:active+.chip__remove-button.sc-swirl-chip,.chip--variant-translucent.chip--pressed.sc-swirl-chip:active+.chip__remove-button.sc-swirl-chip{background-color:var(--s-action-primary-pressed)}.chip--variant-outline.chip--pressed.sc-swirl-chip+.chip__remove-button.sc-swirl-chip,.chip--variant-translucent.chip--pressed.sc-swirl-chip+.chip__remove-button.sc-swirl-chip{color:var(--s-text-on-action-primary);background-color:var(--s-action-primary-default)}.chip--variant-outline.chip--pressed.sc-swirl-chip+.chip__remove-button.sc-swirl-chip:hover,.chip--variant-translucent.chip--pressed.sc-swirl-chip+.chip__remove-button.sc-swirl-chip:hover{background-color:var(--s-action-primary-hovered)}.chip--variant-outline.chip--pressed.sc-swirl-chip+.chip__remove-button.sc-swirl-chip:active,.chip--variant-translucent.chip--pressed.sc-swirl-chip+.chip__remove-button.sc-swirl-chip:active{background-color:var(--s-action-primary-pressed)}.chip--variant-translucent.sc-swirl-chip{background:var(--s-translucent-medium-default);-webkit-backdrop-filter:blur(var(--s-blur-s));backdrop-filter:blur(var(--s-blur-s))}.chip--variant-translucent.chip--interactive.sc-swirl-chip:hover{background:var(--s-translucent-medium-hovered)}.chip--variant-translucent.chip--interactive.sc-swirl-chip:active{background:var(--s-translucent-medium-pressed)}.chip--variant-plain.sc-swirl-chip{height:auto;border:none;border-radius:0;background-color:transparent}.chip--variant-plain.chip--interactive.sc-swirl-chip:hover{background-color:transparent;text-decoration:underline;text-underline-offset:var(--s-space-4)}.chip--variant-plain.chip--interactive.sc-swirl-chip:hover .sc-swirl-chip::part(avatar),.chip--variant-plain.chip--interactive.sc-swirl-chip:hover .sc-swirl-chip [part~="avatar"]{background-color:var(--s-surface-raised-hovered)}.chip--variant-plain.chip--interactive.sc-swirl-chip:active{background-color:transparent}.chip--variant-plain.chip--interactive.sc-swirl-chip:active .sc-swirl-chip::part(avatar),.chip--variant-plain.chip--interactive.sc-swirl-chip:active .sc-swirl-chip [part~="avatar"]{background-color:var(--s-surface-raised-pressed)}.chip--variant-plain.chip--removable.sc-swirl-chip .chip__inner.sc-swirl-chip{padding-right:var(--s-space-12)}.chip--variant-plain.sc-swirl-chip+.chip__remove-button.sc-swirl-chip{position:relative;top:0;right:auto}.chip--variant-plain.sc-swirl-chip .chip__inner.sc-swirl-chip{padding-right:0;padding-left:0}.chip--variant-plain.sc-swirl-chip .chip__icon.sc-swirl-chip,.chip--variant-plain.sc-swirl-chip .chip__avatar.sc-swirl-chip{margin-left:0}.chip--has-progress.sc-swirl-chip+.chip__remove-button.sc-swirl-chip{top:0.1875rem}.chip--has-progress.sc-swirl-chip:not(.chip--size-s)+.chip__remove-button.sc-swirl-chip{top:0.0625rem}.chip__inner.sc-swirl-chip{display:inline-flex;max-width:100%;height:100%;padding-right:var(--s-space-16);padding-left:var(--s-space-16);align-items:center}.chip__avatar.sc-swirl-chip,.chip__icon.sc-swirl-chip{display:inline-flex;margin-right:var(--s-space-8);flex-shrink:0}.chip__avatar.sc-swirl-chip{overflow:hidden;width:1.75rem;height:1.75rem;margin-left:-0.625rem}.chip__icon.sc-swirl-chip{margin-left:-0.25rem;color:var(--s-icon-default)}.chip__label.sc-swirl-chip{overflow:hidden;flex-grow:1;white-space:nowrap;text-overflow:ellipsis}.chip__progress-indicator.sc-swirl-chip{width:100%}.chip__remove-button.sc-swirl-chip{position:absolute;top:0.1875rem;right:var(--s-space-4);display:inline-flex;width:1.875rem;height:1.875rem;padding:0;justify-content:center;align-items:center;border:none;border-radius:50%;color:var(--s-icon-default);background-color:transparent;cursor:pointer}.chip__remove-button.sc-swirl-chip:hover{background-color:var(--s-state-hovered)}.chip__remove-button.sc-swirl-chip:active{background-color:var(--s-state-pressed)}'}},[262,"swirl-chip",{borderRadius:[1,"border-radius"],icon:[1],iconColor:[1,"icon-color"],intent:[1],interactive:[4],label:[1],progress:[2],pressed:[4],progressBarLabel:[1,"progress-bar-label"],removable:[4],removeButtonLabel:[1,"remove-button-label"],size:[1],variant:[1]}]),l=n,d=function(){"undefined"!=typeof customElements&&["swirl-chip","swirl-icon-close","swirl-progress-indicator"].forEach((i=>{switch(i){case"swirl-chip":customElements.get(a(i))||customElements.define(a(i),n);break;case"swirl-icon-close":customElements.get(a(i))||p();break;case"swirl-progress-indicator":customElements.get(a(i))||o()}}))};export{l as SwirlChip,d as defineCustomElement}
+import{proxyCustomElement as i,HTMLElement as c,createEvent as r,h as s,Host as e,transformTag as a}from"@stencil/core/internal/client";import{c as t}from"./index2.js";import{D as h}from"./media-query.service.js";import{d as p}from"./swirl-icon-close2.js";import{d as o}from"./swirl-progress-indicator2.js";const n=i(class extends c{constructor(i){super(),!1!==i&&this.__registerHost(),this.chipClick=r(this,"chipClick",7),this.removeChip=r(this,"remove",7),this.borderRadius="pill",this.iconColor="default",this.intent="default",this.interactive=!1,this.progressBarLabel="Loading progress",this.removeButtonLabel="Remove",this.size="m",this.variant="outline",this.mediaQueryUnsubscribe=()=>{}}componentDidLoad(){this.mediaQueryUnsubscribe=h.subscribe((i=>{this.forceIconProps(i)}))}disconnectedCallback(){this.mediaQueryUnsubscribe()}forceIconProps(i){if(!this.iconEl&&!this.trailingIconEl)return;const c="s"===this.size?"16":i?"20":"24";if(this.iconEl){const i=this.iconEl.children[0];i?.setAttribute("size",c)}if(this.trailingIconEl){const i=this.trailingIconEl.children[0];i?.setAttribute("size",c)}}render(){const i=this.interactive||void 0!==this.pressed?"button":"span",c=!!this.el.querySelector('[slot="avatar"]'),r=!c&&!!this.icon,a=t("chip","chip--border-radius-"+this.borderRadius,"chip--icon-color-"+this.iconColor,"chip--intent-"+this.intent,"chip--size-"+this.size,"chip--variant-"+this.variant,{"chip--pressed":this.pressed,"chip--has-progress":void 0!==this.progress,"chip--interactive":this.interactive||void 0!==this.pressed,"chip--removable":this.removable});return s(e,{key:"11ec56a6e280a2acdb711d845962a482d311d640"},s(i,{key:"b864dbaeef9a23e81bb4c3542ca0c612c9a92dd9","aria-pressed":void 0!==this.pressed?this.pressed+"":void 0,class:a,onClick:this.chipClick.emit,type:this.interactive?"button":void 0},s("span",{key:"de86d524451547b8de6099566e6d565d0d68338a",class:"chip__inner"},c&&s("span",{key:"304f0388d20c6b9c1fc29baff21c7ccf55fd2c1f",class:"chip__avatar"},s("slot",{key:"965703f6bd3d9398f842edc913d9a4e65f975408",name:"avatar"})),r&&s("span",{key:"7a56b983c691f940cdc334d23414efcd6e1cfb56",class:"chip__icon",innerHTML:this.icon,ref:i=>this.iconEl=i}),s("span",{key:"73ca0557469665c9670eb6a158bc7d6d1e9e77d0",class:"chip__label"},this.label),this.trailingIcon&&s("span",{key:"a877986a4663df2fc56e147f9c391786db751e0e",class:"chip__trailing-icon",innerHTML:this.trailingIcon,ref:i=>this.trailingIconEl=i})),void 0!==this.progress&&s("span",{key:"1d734b36fbd0fdaae00cbee86f4005c1f2eec323",class:"chip__progress-indicator"},s("swirl-progress-indicator",{key:"684360cd68977ddc35a42a470537fabd682b343a",label:this.progressBarLabel,value:this.progress}))),this.removable&&s("button",{key:"6a3f93c4a0759eca2c41197f6e518f4a94ed3771","aria-label":this.removeButtonLabel,class:"chip__remove-button",onClick:this.removeChip.emit,type:"button"},s("swirl-icon-close",{key:"d6248afa907c67186ccec3fba2e5f98c5918dd89",size:20})))}get el(){return this}static get style(){return'.sc-swirl-chip-h{position:relative;display:inline-flex;max-width:100%}.sc-swirl-chip-h *.sc-swirl-chip{box-sizing:border-box}.chip.sc-swirl-chip{display:inline-flex;overflow:hidden;max-width:100%;height:2.25rem;padding:0;border:0.0625rem solid var(--s-border-default);border-radius:1.25rem;color:var(--s-text-subdued);background-color:transparent;font:inherit;font-size:var(--s-font-size-sm);font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-sm);flex-direction:column}.chip--size-s.sc-swirl-chip{height:2rem}.chip--size-s.chip--removable.sc-swirl-chip .chip__inner.sc-swirl-chip{padding-right:calc(1.5rem + var(--s-space-12))}.chip--size-s.sc-swirl-chip .chip__inner.sc-swirl-chip{padding-right:var(--s-space-12);padding-left:var(--s-space-12)}.chip--size-s.sc-swirl-chip+.chip__remove-button.sc-swirl-chip{top:var(--s-space-4);width:1.5rem;height:1.5rem}.chip--interactive.sc-swirl-chip{cursor:pointer}.chip--interactive.sc-swirl-chip:hover{background-color:var(--s-state-hovered)}.chip--interactive.sc-swirl-chip:hover .sc-swirl-chip::part(avatar),.chip--interactive.sc-swirl-chip:hover .sc-swirl-chip [part~="avatar"]{background-color:var(--s-surface-raised-hovered)}.chip--interactive.sc-swirl-chip:hover+.chip__remove-button.sc-swirl-chip{background-color:var(--s-surface-raised-default)}.chip--interactive.sc-swirl-chip:hover+.chip__remove-button.sc-swirl-chip:hover{background-color:var(--s-surface-raised-hovered)}.chip--interactive.sc-swirl-chip:hover+.chip__remove-button.sc-swirl-chip:active{background-color:var(--s-state-pressed)}.chip--interactive.sc-swirl-chip:active{background-color:var(--s-state-pressed)}.chip--interactive.sc-swirl-chip:active .sc-swirl-chip::part(avatar),.chip--interactive.sc-swirl-chip:active .sc-swirl-chip [part~="avatar"]{background-color:var(--s-surface-raised-pressed)}.chip--interactive.sc-swirl-chip:active+.chip__remove-button.sc-swirl-chip{background-color:var(--s-state-pressed)}.chip--icon-color-highlight.sc-swirl-chip .chip__icon.sc-swirl-chip{color:var(--s-icon-highlight)}.chip--removable.sc-swirl-chip .chip__inner.sc-swirl-chip{padding-right:calc(1.875rem + var(--s-space-12))}.chip--intent-critical.sc-swirl-chip{border-color:var(--s-border-critical);color:var(--s-text-critical)}.chip--intent-critical.sc-swirl-chip .chip__icon.sc-swirl-chip{color:var(--s-icon-critical)}.chip--border-radius-sm.sc-swirl-chip{border-radius:var(--s-border-radius-sm)}.chip--intent-success.sc-swirl-chip{border-color:var(--s-border-success);color:var(--s-text-success)}.chip--intent-success.sc-swirl-chip .chip__icon.sc-swirl-chip{color:var(--s-icon-success)}.chip--intent-highlight.sc-swirl-chip{border-color:var(--s-border-highlight);color:var(--s-text-highlight)}.chip--intent-highlight.sc-swirl-chip .chip__icon.sc-swirl-chip{color:var(--s-icon-highlight)}.chip--variant-outline.chip--pressed.sc-swirl-chip,.chip--variant-translucent.chip--pressed.sc-swirl-chip{color:var(--s-text-on-action-primary);background-color:var(--s-action-primary-default);border-color:var(--s-action-primary-default)}.chip--variant-outline.chip--pressed.sc-swirl-chip .chip__icon.sc-swirl-chip,.chip--variant-translucent.chip--pressed.sc-swirl-chip .chip__icon.sc-swirl-chip{color:var(--s-text-on-action-primary)}.chip--variant-outline.chip--pressed.sc-swirl-chip:hover,.chip--variant-translucent.chip--pressed.sc-swirl-chip:hover{background-color:var(--s-action-primary-hovered)}.chip--variant-outline.chip--pressed.sc-swirl-chip:hover+.chip__remove-button.sc-swirl-chip,.chip--variant-translucent.chip--pressed.sc-swirl-chip:hover+.chip__remove-button.sc-swirl-chip{background-color:var(--s-action-primary-hovered)}.chip--variant-outline.chip--pressed.sc-swirl-chip:active,.chip--variant-translucent.chip--pressed.sc-swirl-chip:active{background-color:var(--s-action-primary-pressed)}.chip--variant-outline.chip--pressed.sc-swirl-chip:active+.chip__remove-button.sc-swirl-chip,.chip--variant-translucent.chip--pressed.sc-swirl-chip:active+.chip__remove-button.sc-swirl-chip{background-color:var(--s-action-primary-pressed)}.chip--variant-outline.chip--pressed.sc-swirl-chip+.chip__remove-button.sc-swirl-chip,.chip--variant-translucent.chip--pressed.sc-swirl-chip+.chip__remove-button.sc-swirl-chip{color:var(--s-text-on-action-primary);background-color:var(--s-action-primary-default)}.chip--variant-outline.chip--pressed.sc-swirl-chip+.chip__remove-button.sc-swirl-chip:hover,.chip--variant-translucent.chip--pressed.sc-swirl-chip+.chip__remove-button.sc-swirl-chip:hover{background-color:var(--s-action-primary-hovered)}.chip--variant-outline.chip--pressed.sc-swirl-chip+.chip__remove-button.sc-swirl-chip:active,.chip--variant-translucent.chip--pressed.sc-swirl-chip+.chip__remove-button.sc-swirl-chip:active{background-color:var(--s-action-primary-pressed)}.chip--variant-translucent.sc-swirl-chip{background:var(--s-translucent-medium-default);-webkit-backdrop-filter:blur(var(--s-blur-s));backdrop-filter:blur(var(--s-blur-s))}.chip--variant-translucent.chip--interactive.sc-swirl-chip:hover{background:var(--s-translucent-medium-hovered)}.chip--variant-translucent.chip--interactive.sc-swirl-chip:active{background:var(--s-translucent-medium-pressed)}.chip--variant-plain.sc-swirl-chip{height:auto;border:none;border-radius:0;background-color:transparent}.chip--variant-plain.chip--interactive.sc-swirl-chip:hover{background-color:transparent;text-decoration:underline;text-underline-offset:var(--s-space-4)}.chip--variant-plain.chip--interactive.sc-swirl-chip:hover .sc-swirl-chip::part(avatar),.chip--variant-plain.chip--interactive.sc-swirl-chip:hover .sc-swirl-chip [part~="avatar"]{background-color:var(--s-surface-raised-hovered)}.chip--variant-plain.chip--interactive.sc-swirl-chip:active{background-color:transparent}.chip--variant-plain.chip--interactive.sc-swirl-chip:active .sc-swirl-chip::part(avatar),.chip--variant-plain.chip--interactive.sc-swirl-chip:active .sc-swirl-chip [part~="avatar"]{background-color:var(--s-surface-raised-pressed)}.chip--variant-plain.chip--removable.sc-swirl-chip .chip__inner.sc-swirl-chip{padding-right:var(--s-space-12)}.chip--variant-plain.sc-swirl-chip+.chip__remove-button.sc-swirl-chip{position:relative;top:0;right:auto}.chip--variant-plain.sc-swirl-chip .chip__inner.sc-swirl-chip{padding-right:0;padding-left:0}.chip--variant-plain.sc-swirl-chip .chip__icon.sc-swirl-chip,.chip--variant-plain.sc-swirl-chip .chip__avatar.sc-swirl-chip{margin-left:0}.chip--has-progress.sc-swirl-chip+.chip__remove-button.sc-swirl-chip{top:0.1875rem}.chip--has-progress.sc-swirl-chip:not(.chip--size-s)+.chip__remove-button.sc-swirl-chip{top:0.0625rem}.chip__inner.sc-swirl-chip{display:inline-flex;max-width:100%;height:100%;padding-right:var(--s-space-16);padding-left:var(--s-space-16);align-items:center}.chip__avatar.sc-swirl-chip,.chip__icon.sc-swirl-chip{display:inline-flex;margin-right:var(--s-space-8);flex-shrink:0}.chip__avatar.sc-swirl-chip{overflow:hidden;width:1.75rem;height:1.75rem;margin-left:-0.625rem}.chip__icon.sc-swirl-chip{margin-left:-0.25rem;color:var(--s-icon-default)}.chip__trailing-icon.sc-swirl-chip{display:inline-flex;flex-shrink:0;margin-left:var(--s-space-8)}.chip__label.sc-swirl-chip{overflow:hidden;flex-grow:1;white-space:nowrap;text-overflow:ellipsis}.chip__progress-indicator.sc-swirl-chip{width:100%}.chip__remove-button.sc-swirl-chip{position:absolute;top:0.1875rem;right:var(--s-space-4);display:inline-flex;width:1.875rem;height:1.875rem;padding:0;justify-content:center;align-items:center;border:none;border-radius:50%;color:var(--s-icon-default);background-color:transparent;cursor:pointer}.chip__remove-button.sc-swirl-chip:hover{background-color:var(--s-state-hovered)}.chip__remove-button.sc-swirl-chip:active{background-color:var(--s-state-pressed)}'}},[262,"swirl-chip",{borderRadius:[1,"border-radius"],icon:[1],iconColor:[1,"icon-color"],trailingIcon:[1,"trailing-icon"],intent:[1],interactive:[4],label:[1],progress:[2],pressed:[4],progressBarLabel:[1,"progress-bar-label"],removable:[4],removeButtonLabel:[1,"remove-button-label"],size:[1],variant:[1]}]),l=n,d=function(){"undefined"!=typeof customElements&&["swirl-chip","swirl-icon-close","swirl-progress-indicator"].forEach((i=>{switch(i){case"swirl-chip":customElements.get(a(i))||customElements.define(a(i),n);break;case"swirl-icon-close":customElements.get(a(i))||p();break;case"swirl-progress-indicator":customElements.get(a(i))||o()}}))};export{l as SwirlChip,d as defineCustomElement}

package/dist/components/swirl-color-input.js

@@ -1 +1 @@
-import{proxyCustomElement as t,HTMLElement as e,createEvent as r,h as s,Host as i,transformTag as o}from"@stencil/core/internal/client";import{c as n}from"./index2.js";import{d as a}from"./swirl-box2.js";import{d as l}from"./swirl-popover2.js";import{d as c}from"./swirl-popover-trigger2.js";import{v as h}from"./v4.js";const d=(t,e=0,r=1)=>t>r?r:t<e?e:t,u=(t,e=0,r=Math.pow(10,e))=>Math.round(r*t)/r,p=t=>("#"===t[0]&&(t=t.substring(1)),t.length<6?{r:parseInt(t[0]+t[0],16),g:parseInt(t[1]+t[1],16),b:parseInt(t[2]+t[2],16),a:4===t.length?u(parseInt(t[3]+t[3],16)/255,2):1}:{r:parseInt(t.substring(0,2),16),g:parseInt(t.substring(2,4),16),b:parseInt(t.substring(4,6),16),a:8===t.length?u(parseInt(t.substring(6,8),16)/255,2):1}),b=t=>{const{h:e,s:r,l:s}=(({h:t,s:e,v:r,a:s})=>{const i=(200-e)*r/100;return{h:u(t),s:u(i>0&&i<200?e*r/100/(i<=100?i:200-i)*100:0),l:u(i/2),a:u(s,2)}})(t);return`hsl(${e}, ${r}%, ${s}%)`},m=t=>{const e=t.toString(16);return e.length<2?"0"+e:e},f=(t,e)=>{if(t===e)return!0;for(const r in t)if(t[r]!==e[r])return!1;return!0},g={},v=t=>{let e=g[t];return e||(e=document.createElement("template"),e.innerHTML=t,g[t]=e),e},w=(t,e,r)=>{t.dispatchEvent(new CustomEvent(e,{bubbles:!0,detail:r}))};let x=!1;const k=t=>"touches"in t,y=(t,e)=>{const r=k(e)?e.touches[0]:e,s=t.el.getBoundingClientRect();w(t.el,"move",t.getMove({x:d((r.pageX-(s.left+window.pageXOffset))/s.width),y:d((r.pageY-(s.top+window.pageYOffset))/s.height)}))};class _{constructor(t,e,r,s){const i=v(`<div role="slider" tabindex="0" part="${e}" ${r}><div part="${e}-pointer"></div></div>`);t.appendChild(i.content.cloneNode(!0));const o=t.querySelector(`[part=${e}]`);o.addEventListener("mousedown",this),o.addEventListener("touchstart",this),o.addEventListener("keydown",this),this.el=o,this.xy=s,this.nodes=[o.firstChild,o]}set dragging(t){const e=t?document.addEventListener:document.removeEventListener;e(x?"touchmove":"mousemove",this),e(x?"touchend":"mouseup",this)}handleEvent(t){switch(t.type){case"mousedown":case"touchstart":if(t.preventDefault(),!(t=>!(x&&!k(t)||(x||(x=k(t)),0)))(t)||!x&&0!=t.button)return;this.el.focus(),y(this,t),this.dragging=!0;break;case"mousemove":case"touchmove":t.preventDefault(),y(this,t);break;case"mouseup":case"touchend":this.dragging=!1;break;case"keydown":((t,e)=>{const r=e.keyCode;r>40||t.xy&&r<37||r<33||(e.preventDefault(),w(t.el,"move",t.getMove({x:39===r?.01:37===r?-.01:34===r?.05:33===r?-.05:35===r?1:36===r?-1:0,y:40===r?.01:38===r?-.01:0},!0)))})(this,t)}}style(t){t.forEach(((t,e)=>{for(const r in t)this.nodes[e].style.setProperty(r,t[r])}))}}class E extends _{constructor(t){super(t,"hue",'aria-label="Hue" aria-valuemin="0" aria-valuemax="360"',!1)}update({h:t}){this.h=t,this.style([{left:t/360*100+"%",color:b({h:t,s:100,v:100,a:1})}]),this.el.setAttribute("aria-valuenow",""+u(t))}getMove(t,e){return{h:e?d(this.h+360*t.x,0,360):360*t.x}}}class $ extends _{constructor(t){super(t,"saturation",'aria-label="Color"',!0)}update(t){this.hsva=t,this.style([{top:100-t.v+"%",left:t.s+"%",color:b(t)},{"background-color":b({h:t.h,s:100,v:100,a:1})}]),this.el.setAttribute("aria-valuetext",`Saturation ${u(t.s)}%, Brightness ${u(t.v)}%`)}getMove(t,e){return{s:e?d(this.hsva.s+100*t.x,0,100):100*t.x,v:e?d(this.hsva.v-100*t.y,0,100):Math.round(100-100*t.y)}}}const I=Symbol("same"),S=Symbol("color"),C=Symbol("hsva"),M=Symbol("update"),z=Symbol("parts"),B=Symbol("css"),L=Symbol("sliders");class j extends HTMLElement{static get observedAttributes(){return["color"]}get[B](){return[':host{display:flex;flex-direction:column;position:relative;width:200px;height:200px;user-select:none;-webkit-user-select:none;cursor:default}:host([hidden]){display:none!important}[role=slider]{position:relative;touch-action:none;user-select:none;-webkit-user-select:none;outline:0}[role=slider]:last-child{border-radius:0 0 8px 8px}[part$=pointer]{position:absolute;z-index:1;box-sizing:border-box;width:28px;height:28px;display:flex;place-content:center center;transform:translate(-50%,-50%);background-color:#fff;border:2px solid #fff;border-radius:50%;box-shadow:0 2px 4px rgba(0,0,0,.2)}[part$=pointer]::after{content:"";width:100%;height:100%;border-radius:inherit;background-color:currentColor}[role=slider]:focus [part$=pointer]{transform:translate(-50%,-50%) scale(1.1)}',"[part=hue]{flex:0 0 24px;background:linear-gradient(to right,red 0,#ff0 17%,#0f0 33%,#0ff 50%,#00f 67%,#f0f 83%,red 100%)}[part=hue-pointer]{top:50%;z-index:2}","[part=saturation]{flex-grow:1;border-color:transparent;border-bottom:12px solid #000;border-radius:8px 8px 0 0;background-image:linear-gradient(to top,#000,transparent),linear-gradient(to right,#fff,rgba(255,255,255,0));box-shadow:inset 0 0 0 1px rgba(0,0,0,.05)}[part=saturation-pointer]{z-index:3}"]}get[L](){return[$,E]}get color(){return this[S]}set color(t){if(!this[I](t)){const e=this.colorModel.toHsva(t);this[M](e),this[S]=t}}constructor(){super();const t=v(`<style>${this[B].join("")}</style>`),e=this.attachShadow({mode:"open"});e.appendChild(t.content.cloneNode(!0)),e.addEventListener("move",this),this[z]=this[L].map((t=>new t(e)))}connectedCallback(){if(this.hasOwnProperty("color")){const t=this.color;delete this.color,this.color=t}else this.color||(this.color=this.colorModel.defaultColor)}attributeChangedCallback(t,e,r){const s=this.colorModel.fromAttr(r);this[I](s)||(this.color=s)}handleEvent(t){const e=this[C],r={...e,...t.detail};let s;this[M](r),f(r,e)||this[I](s=this.colorModel.fromHsva(r))||(this[S]=s,w(this,"color-changed",{value:s}))}[I](t){return this.color&&this.colorModel.equal(t,this.color)}[M](t){this[C]=t,this[z].forEach((e=>e.update(t)))}}const H={defaultColor:"#000",toHsva:t=>(({r:t,g:e,b:r,a:s})=>{const i=Math.max(t,e,r),o=i-Math.min(t,e,r),n=o?i===t?(e-r)/o:i===e?2+(r-t)/o:4+(t-e)/o:0;return{h:u(60*(n<0?n+6:n)),s:u(i?o/i*100:0),v:u(i/255*100),a:s}})(p(t)),fromHsva:({h:t,s:e,v:r})=>(t=>(({r:t,g:e,b:r,a:s})=>{const i=s<1?m(u(255*s)):"";return"#"+m(t)+m(e)+m(r)+i})((({h:t,s:e,v:r,a:s})=>{e/=100,r/=100;const i=Math.floor(t=t/360*6),o=r*(1-e),n=r*(1-(t-i)*e),a=r*(1-(1-t+i)*e),l=i%6;return{r:u(255*[r,n,o,o,a,r][l]),g:u(255*[a,r,r,n,o,o][l]),b:u(255*[o,o,a,r,r,n][l]),a:u(s,2)}})(t)))({h:t,s:e,v:r,a:1}),equal:(t,e)=>t.toLowerCase()===e.toLowerCase()||f(p(t),p(e)),fromAttr:t=>t};class A extends j{get colorModel(){return H}}customElements.define("hex-color-picker",class extends A{});const F=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.inputBlur=r(this,"inputBlur",7),this.inputFocus=r(this,"inputFocus",7),this.valueChange=r(this,"valueChange",7),this.pickerButtonLabel="Open color picker",this.pickerLabel="Color picker",this.pickerId="color-picker-"+h(),this.onPickerChange=t=>{this.value=t.detail.value},this.onChange=t=>{this.value=t.target.value},this.onBlur=t=>{this.inputBlur.emit(t)},this.onFocus=t=>{this.inputFocus.emit(t),this.handleAutoSelect(t)},this.onInput=t=>{this.onChange(t)}}componentDidLoad(){this.autoFocus&&setTimeout((()=>{this.inputEl.focus()})),this.picker.addEventListener("color-changed",this.onPickerChange)}disconnectedCallback(){this.picker?.removeEventListener("color-changed",this.onPickerChange)}watchValue(t,e){t!==e&&this.valueChange.emit(t)}handleAutoSelect(t){this.autoSelect&&t.target.select()}render(){const t=!0===this.invalid||!1===this.invalid?this.invalid+"":void 0,e=n("color-input",{"color-input--inline":this.inline});return s(i,{key:"2ed3d40d8b69af36b2226c911cc5dae84742f0cb"},s("div",{key:"ef197f8e0a01ddf121df8f47a99691040663f286",class:e},s("input",{key:"34f8ae5eb9aaa8e664a6b47fac63917a2f7e2039","aria-describedby":this.swirlAriaDescribedby,"aria-disabled":this.disabled?"true":void 0,"aria-invalid":t,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:t=>this.inputEl=t,required:this.required,spellcheck:"false",type:"text",value:this.value,readonly:this.readonly}),s("swirl-popover-trigger",{key:"3e11abdfdf445802e84cf3e87de2499c3a402f9a",swirlPopover:this.pickerId},s("button",{key:"e99eb09576d3843aebd5c8803e0d9235bbb0139e",disabled:this.readonly,"aria-label":this.pickerButtonLabel,class:"color-input__preview-button",style:{backgroundColor:this.disabled?"var(--s-border-subdued)":this.value},type:"button"})),s("swirl-popover",{key:"b60e4424b971f6f76b5e0adc9d7b155cd7a0fdac",animation:"scale-in-y",id:this.pickerId,label:this.pickerLabel,placement:"bottom-end"},s("swirl-box",{key:"756f20986aeb68b92bd03649623b64f210b1f846",centerInline:!0,paddingBlockEnd:"8",paddingBlockStart:"8",paddingInlineEnd:"16",paddingInlineStart:"16"},s("hex-color-picker",{key:"5410df4ccf4537763171af4b15ab26898e007ff4",color:this.value,ref:t=>this.picker=t})))))}static get watchers(){return{value:[{watchValue:0}]}}static get style(){return".sc-swirl-color-input-h{display:block;width:100%}.sc-swirl-color-input-h *.sc-swirl-color-input{box-sizing:border-box}.color-input.sc-swirl-color-input{position:relative;display:flex;width:100%;align-items:center;color:var(--s-text-default);font:inherit;line-height:var(--s-line-height-sm);cursor:text}.color-input--inline.sc-swirl-color-input .color-input__preview-button.sc-swirl-color-input{width:1.5rem;height:1.5rem;margin-top:-0.125rem;margin-right:-0.25rem;margin-bottom:-0.125rem}.color-input__input.sc-swirl-color-input{display:inline-flex;width:100%;margin:0;padding:0;flex-grow:1;border:none;color:var(--s-text-default);background-color:transparent;font:inherit;font-size:var(--s-font-size-base);line-height:var(--s-line-height-base);caret-color:var(--s-border-highlight)}.color-input__input.sc-swirl-color-input:focus{outline:none}.color-input__input.sc-swirl-color-input:disabled{color:var(--s-text-disabled);background-color:transparent}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.color-input__input.sc-swirl-color-input{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.color-input__preview-button.sc-swirl-color-input{width:2.75rem;height:2.75rem;margin-top:-1.25rem;flex-shrink:0;border:0.0625rem solid var(--s-border-default);border-radius:var(--s-border-radius-s);cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}"}},[2,"swirl-color-input",{autoFocus:[4,"auto-focus"],autoSelect:[4,"auto-select"],disabled:[4],swirlAriaDescribedby:[1,"swirl-aria-describedby"],inline:[4],invalid:[4],pickerButtonLabel:[1,"picker-button-label"],pickerLabel:[1,"picker-label"],placeholder:[1],required:[4],value:[1537],readonly:[4]},void 0,{value:[{watchValue:0}]}]),q=F,T=function(){"undefined"!=typeof customElements&&["swirl-color-input","swirl-box","swirl-popover","swirl-popover-trigger"].forEach((t=>{switch(t){case"swirl-color-input":customElements.get(o(t))||customElements.define(o(t),F);break;case"swirl-box":customElements.get(o(t))||a();break;case"swirl-popover":customElements.get(o(t))||l();break;case"swirl-popover-trigger":customElements.get(o(t))||c()}}))};export{q as SwirlColorInput,T as defineCustomElement}
+import{proxyCustomElement as t,HTMLElement as e,createEvent as r,h as s,Host as i,transformTag as o}from"@stencil/core/internal/client";import{c as n}from"./index2.js";import{d as a}from"./swirl-box2.js";import{d as l}from"./swirl-popover2.js";import{d as c}from"./swirl-popover-trigger2.js";import{v as h}from"./v4.js";const d=(t,e=0,r=1)=>t>r?r:t<e?e:t,u=(t,e=0,r=Math.pow(10,e))=>Math.round(r*t)/r,p=t=>("#"===t[0]&&(t=t.substring(1)),t.length<6?{r:parseInt(t[0]+t[0],16),g:parseInt(t[1]+t[1],16),b:parseInt(t[2]+t[2],16),a:4===t.length?u(parseInt(t[3]+t[3],16)/255,2):1}:{r:parseInt(t.substring(0,2),16),g:parseInt(t.substring(2,4),16),b:parseInt(t.substring(4,6),16),a:8===t.length?u(parseInt(t.substring(6,8),16)/255,2):1}),b=t=>{const{h:e,s:r,l:s}=(({h:t,s:e,v:r,a:s})=>{const i=(200-e)*r/100;return{h:u(t),s:u(i>0&&i<200?e*r/100/(i<=100?i:200-i)*100:0),l:u(i/2),a:u(s,2)}})(t);return`hsl(${e}, ${r}%, ${s}%)`},m=t=>{const e=t.toString(16);return e.length<2?"0"+e:e},f=(t,e)=>{if(t===e)return!0;for(const r in t)if(t[r]!==e[r])return!1;return!0},g={},v=t=>{let e=g[t];return e||(e=document.createElement("template"),e.innerHTML=t,g[t]=e),e},w=(t,e,r)=>{t.dispatchEvent(new CustomEvent(e,{bubbles:!0,detail:r}))};let x=!1;const k=t=>"touches"in t,y=(t,e)=>{const r=k(e)?e.touches[0]:e,s=t.el.getBoundingClientRect();w(t.el,"move",t.getMove({x:d((r.pageX-(s.left+window.pageXOffset))/s.width),y:d((r.pageY-(s.top+window.pageYOffset))/s.height)}))};class _{constructor(t,e,r,s){const i=v(`<div role="slider" tabindex="0" part="${e}" ${r}><div part="${e}-pointer"></div></div>`);t.appendChild(i.content.cloneNode(!0));const o=t.querySelector(`[part=${e}]`);o.addEventListener("mousedown",this),o.addEventListener("touchstart",this),o.addEventListener("keydown",this),this.el=o,this.xy=s,this.nodes=[o.firstChild,o]}set dragging(t){const e=t?document.addEventListener:document.removeEventListener;e(x?"touchmove":"mousemove",this),e(x?"touchend":"mouseup",this)}handleEvent(t){switch(t.type){case"mousedown":case"touchstart":if(t.preventDefault(),!(t=>!(x&&!k(t)||(x||(x=k(t)),0)))(t)||!x&&0!=t.button)return;this.el.focus(),y(this,t),this.dragging=!0;break;case"mousemove":case"touchmove":t.preventDefault(),y(this,t);break;case"mouseup":case"touchend":this.dragging=!1;break;case"keydown":((t,e)=>{const r=e.keyCode;r>40||t.xy&&r<37||r<33||(e.preventDefault(),w(t.el,"move",t.getMove({x:39===r?.01:37===r?-.01:34===r?.05:33===r?-.05:35===r?1:36===r?-1:0,y:40===r?.01:38===r?-.01:0},!0)))})(this,t)}}style(t){t.forEach(((t,e)=>{for(const r in t)this.nodes[e].style.setProperty(r,t[r])}))}}class E extends _{constructor(t){super(t,"hue",'aria-label="Hue" aria-valuemin="0" aria-valuemax="360"',!1)}update({h:t}){this.h=t,this.style([{left:t/360*100+"%",color:b({h:t,s:100,v:100,a:1})}]),this.el.setAttribute("aria-valuenow",""+u(t))}getMove(t,e){return{h:e?d(this.h+360*t.x,0,360):360*t.x}}}class $ extends _{constructor(t){super(t,"saturation",'aria-label="Color"',!0)}update(t){this.hsva=t,this.style([{top:100-t.v+"%",left:t.s+"%",color:b(t)},{"background-color":b({h:t.h,s:100,v:100,a:1})}]),this.el.setAttribute("aria-valuetext",`Saturation ${u(t.s)}%, Brightness ${u(t.v)}%`)}getMove(t,e){return{s:e?d(this.hsva.s+100*t.x,0,100):100*t.x,v:e?d(this.hsva.v-100*t.y,0,100):Math.round(100-100*t.y)}}}const I=Symbol("same"),S=Symbol("color"),C=Symbol("hsva"),M=Symbol("update"),z=Symbol("parts"),B=Symbol("css"),L=Symbol("sliders");class j extends HTMLElement{static get observedAttributes(){return["color"]}get[B](){return[':host{display:flex;flex-direction:column;position:relative;width:200px;height:200px;user-select:none;-webkit-user-select:none;cursor:default}:host([hidden]){display:none!important}[role=slider]{position:relative;touch-action:none;user-select:none;-webkit-user-select:none;outline:0}[role=slider]:last-child{border-radius:0 0 8px 8px}[part$=pointer]{position:absolute;z-index:1;box-sizing:border-box;width:28px;height:28px;display:flex;place-content:center center;transform:translate(-50%,-50%);background-color:#fff;border:2px solid #fff;border-radius:50%;box-shadow:0 2px 4px rgba(0,0,0,.2)}[part$=pointer]::after{content:"";width:100%;height:100%;border-radius:inherit;background-color:currentColor}[role=slider]:focus [part$=pointer]{transform:translate(-50%,-50%) scale(1.1)}',"[part=hue]{flex:0 0 24px;background:linear-gradient(to right,red 0,#ff0 17%,#0f0 33%,#0ff 50%,#00f 67%,#f0f 83%,red 100%)}[part=hue-pointer]{top:50%;z-index:2}","[part=saturation]{flex-grow:1;border-color:transparent;border-bottom:12px solid #000;border-radius:8px 8px 0 0;background-image:linear-gradient(to top,#000,transparent),linear-gradient(to right,#fff,rgba(255,255,255,0));box-shadow:inset 0 0 0 1px rgba(0,0,0,.05)}[part=saturation-pointer]{z-index:3}"]}get[L](){return[$,E]}get color(){return this[S]}set color(t){if(!this[I](t)){const e=this.colorModel.toHsva(t);this[M](e),this[S]=t}}constructor(){super();const t=v(`<style>${this[B].join("")}</style>`),e=this.attachShadow({mode:"open"});e.appendChild(t.content.cloneNode(!0)),e.addEventListener("move",this),this[z]=this[L].map((t=>new t(e)))}connectedCallback(){if(this.hasOwnProperty("color")){const t=this.color;delete this.color,this.color=t}else this.color||(this.color=this.colorModel.defaultColor)}attributeChangedCallback(t,e,r){const s=this.colorModel.fromAttr(r);this[I](s)||(this.color=s)}handleEvent(t){const e=this[C],r={...e,...t.detail};let s;this[M](r),f(r,e)||this[I](s=this.colorModel.fromHsva(r))||(this[S]=s,w(this,"color-changed",{value:s}))}[I](t){return this.color&&this.colorModel.equal(t,this.color)}[M](t){this[C]=t,this[z].forEach((e=>e.update(t)))}}const H={defaultColor:"#000",toHsva:t=>(({r:t,g:e,b:r,a:s})=>{const i=Math.max(t,e,r),o=i-Math.min(t,e,r),n=o?i===t?(e-r)/o:i===e?2+(r-t)/o:4+(t-e)/o:0;return{h:u(60*(n<0?n+6:n)),s:u(i?o/i*100:0),v:u(i/255*100),a:s}})(p(t)),fromHsva:({h:t,s:e,v:r})=>(t=>(({r:t,g:e,b:r,a:s})=>{const i=s<1?m(u(255*s)):"";return"#"+m(t)+m(e)+m(r)+i})((({h:t,s:e,v:r,a:s})=>{e/=100,r/=100;const i=Math.floor(t=t/360*6),o=r*(1-e),n=r*(1-(t-i)*e),a=r*(1-(1-t+i)*e),l=i%6;return{r:u(255*[r,n,o,o,a,r][l]),g:u(255*[a,r,r,n,o,o][l]),b:u(255*[o,o,a,r,r,n][l]),a:u(s,2)}})(t)))({h:t,s:e,v:r,a:1}),equal:(t,e)=>t.toLowerCase()===e.toLowerCase()||f(p(t),p(e)),fromAttr:t=>t};class A extends j{get colorModel(){return H}}customElements.define("hex-color-picker",class extends A{});const F=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.inputBlur=r(this,"inputBlur",7),this.inputFocus=r(this,"inputFocus",7),this.valueChange=r(this,"valueChange",7),this.pickerButtonLabel="Open color picker",this.pickerLabel="Color picker",this.pickerId="color-picker-"+h(),this.onPickerChange=t=>{this.value=t.detail.value},this.onChange=t=>{this.value=t.target.value},this.onBlur=t=>{this.inputBlur.emit(t)},this.onFocus=t=>{this.inputFocus.emit(t),this.handleAutoSelect(t)},this.onInput=t=>{this.onChange(t)}}componentDidLoad(){this.autoFocus&&setTimeout((()=>{this.inputEl.focus()})),this.picker.addEventListener("color-changed",this.onPickerChange)}disconnectedCallback(){this.picker?.removeEventListener("color-changed",this.onPickerChange)}watchValue(t,e){t!==e&&this.valueChange.emit(t)}handleAutoSelect(t){this.autoSelect&&t.target.select()}render(){const t=!0===this.invalid||!1===this.invalid?this.invalid+"":void 0,e=n("color-input",{"color-input--inline":this.inline});return s(i,{key:"7191b1f701ded6567f879a2bd5b203b8be32532d"},s("div",{key:"968bd5c470d46b1344eccbeb75d7017c5ee327e2",class:e},s("input",{key:"4c4b74337ef38b1cb9e5d6d46ab9f1492f6a3a90","aria-describedby":this.swirlAriaDescribedby,"aria-disabled":this.disabled?"true":void 0,"aria-invalid":t,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:t=>this.inputEl=t,required:this.required,spellcheck:"false",type:"text",value:this.value,readonly:this.readonly}),s("swirl-popover-trigger",{key:"7db651cc85a8152e2e2968224b2e08f4ad0e29dc",swirlPopover:this.pickerId},s("button",{key:"d43c22fdf3e240c6c9cde90022fbf2766e79332c",disabled:this.readonly,"aria-label":this.pickerButtonLabel,class:"color-input__preview-button",style:{backgroundColor:this.disabled?"var(--s-border-subdued)":this.value},type:"button"})),s("swirl-popover",{key:"b4a139bbe942b650713bc05d338976ecc2006939",animation:"scale-in-y",id:this.pickerId,label:this.pickerLabel,placement:"bottom-end"},s("swirl-box",{key:"6399973c36ce0576ab338134f99625bfd92d6ed7",centerInline:!0,paddingBlockEnd:"8",paddingBlockStart:"8",paddingInlineEnd:"16",paddingInlineStart:"16"},s("hex-color-picker",{key:"d3799f25dcbd907606c35c2a5d4d62f1430d55cc",color:this.value,ref:t=>this.picker=t})))))}static get watchers(){return{value:[{watchValue:0}]}}static get style(){return".sc-swirl-color-input-h{display:block;width:100%}.sc-swirl-color-input-h *.sc-swirl-color-input{box-sizing:border-box}.color-input.sc-swirl-color-input{position:relative;display:flex;width:100%;align-items:center;color:var(--s-text-default);font:inherit;line-height:var(--s-line-height-sm);cursor:text}.color-input--inline.sc-swirl-color-input .color-input__preview-button.sc-swirl-color-input{width:1.5rem;height:1.5rem;margin-top:-0.125rem;margin-right:-0.25rem;margin-bottom:-0.125rem}.color-input__input.sc-swirl-color-input{display:inline-flex;width:100%;margin:0;padding:0;flex-grow:1;border:none;color:var(--s-text-default);background-color:transparent;font:inherit;font-size:var(--s-font-size-base);line-height:var(--s-line-height-base);caret-color:var(--s-border-highlight)}.color-input__input.sc-swirl-color-input:focus{outline:none}.color-input__input.sc-swirl-color-input:disabled{color:var(--s-text-disabled);background-color:transparent}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.color-input__input.sc-swirl-color-input{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.color-input__preview-button.sc-swirl-color-input{width:2.75rem;height:2.75rem;margin-top:-1.25rem;flex-shrink:0;border:0.0625rem solid var(--s-border-default);border-radius:var(--s-border-radius-s);cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}"}},[2,"swirl-color-input",{autoFocus:[4,"auto-focus"],autoSelect:[4,"auto-select"],disabled:[4],swirlAriaDescribedby:[1,"swirl-aria-describedby"],inline:[4],invalid:[4],pickerButtonLabel:[1,"picker-button-label"],pickerLabel:[1,"picker-label"],placeholder:[1],required:[4],value:[1537],readonly:[4]},void 0,{value:[{watchValue:0}]}]),q=F,T=function(){"undefined"!=typeof customElements&&["swirl-color-input","swirl-box","swirl-popover","swirl-popover-trigger"].forEach((t=>{switch(t){case"swirl-color-input":customElements.get(o(t))||customElements.define(o(t),F);break;case"swirl-box":customElements.get(o(t))||a();break;case"swirl-popover":customElements.get(o(t))||l();break;case"swirl-popover-trigger":customElements.get(o(t))||c()}}))};export{q as SwirlColorInput,T as defineCustomElement}

package/dist/components/swirl-columns.js

@@ -1 +1 @@
-import{proxyCustomElement as s,HTMLElement as e,h as t,Host as c,transformTag as n}from"@stencil/core/internal/client";const o=s(class extends e{constructor(s){super(),!1!==s&&this.__registerHost(),this.__attachShadow(),this.columns="repeat(3, minmax(0, 1fr))"}render(){return t(c,{key:"38f01f098c3a0cd7ca18731450796a5c9724e053"},t("div",{key:"35e0b361dde0251c2b720863a86eba6e55fdc8e9",class:"columns",style:{gridTemplateColumns:this.columns,gap:`var(--s-space-${this.spacing})`}},t("slot",{key:"0847d324dd44000299e7b12d1701860ad30f4dde"})))}static get style(){return":host{display:block}:host *{box-sizing:border-box}.columns{display:grid;width:100%}"}},[257,"swirl-columns",{columns:[1],spacing:[1]}]),i=o,l=function(){"undefined"!=typeof customElements&&["swirl-columns"].forEach((s=>{"swirl-columns"===s&&(customElements.get(n(s))||customElements.define(n(s),o))}))};export{i as SwirlColumns,l as defineCustomElement}
+import{proxyCustomElement as e,HTMLElement as s,h as t,Host as c,transformTag as n}from"@stencil/core/internal/client";const o=e(class extends s{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.columns="repeat(3, minmax(0, 1fr))"}render(){return t(c,{key:"58dca0f53eb7169ebed52d040da35e407e939fba"},t("div",{key:"2c0cb89f1f7029da7265531cfa38d2e49b76dd30",class:"columns",style:{gridTemplateColumns:this.columns,gap:`var(--s-space-${this.spacing})`}},t("slot",{key:"3c2f0ed4c1d8a60e9e9079fe17986bbdf79468f9"})))}static get style(){return":host{display:block}:host *{box-sizing:border-box}.columns{display:grid;width:100%}"}},[257,"swirl-columns",{columns:[1],spacing:[1]}]),i=o,l=function(){"undefined"!=typeof customElements&&["swirl-columns"].forEach((e=>{"swirl-columns"===e&&(customElements.get(n(e))||customElements.define(n(e),o))}))};export{i as SwirlColumns,l as defineCustomElement}