@getflip/swirl-components 0.444.0 → 0.445.0

package/dist/components/swirl-dialog.js

@@ -67,8 +67,9 @@ const SwirlDialog$1 = /*@__PURE__*/ proxyCustomElement(class SwirlDialog extends
     /**
      * Open the dialog.
      */
-    async open() {
+    async open(returnFocusTo) {
         this.opening = true;
+        this.temporaryReturnFocusTo = returnFocusTo;
         if (!this.dialogEl) {
             return;
         }
@@ -85,15 +86,17 @@ const SwirlDialog$1 = /*@__PURE__*/ proxyCustomElement(class SwirlDialog extends
         this.closing = true;
         setTimeout(() => {
             this.dialogEl.close();
-            if (this.returnFocusTo) {
-                this.customFocusReturn();
-            }
+            this.customFocusReturn();
         }, 150);
     }
     customFocusReturn() {
-        const element = typeof this.returnFocusTo === "string"
-            ? document.querySelector(this.returnFocusTo)
-            : this.returnFocusTo;
+        const customReturnFocusTo = this.temporaryReturnFocusTo ?? this.returnFocusTo;
+        if (!customReturnFocusTo) {
+            return;
+        }
+        const element = typeof customReturnFocusTo === "string"
+            ? document.querySelector(customReturnFocusTo)
+            : customReturnFocusTo;
         const focusableElements = tabbable(element, {
             includeContainer: true,
             getShadowRoot: true,
@@ -101,11 +104,12 @@ const SwirlDialog$1 = /*@__PURE__*/ proxyCustomElement(class SwirlDialog extends
         if (focusableElements.length > 0) {
             focusableElements[0].focus();
         }
+        this.temporaryReturnFocusTo = undefined;
     }
     render() {
         const className = classNames("dialog", { "dialog--closing": this.closing });
         const hasLeftControls = Boolean(this.el.querySelector('[slot="left-controls"]'));
-        return (h(Host, { key: '96dda6293b1d08c47f87f939eacfb089f21f8e85' }, h("dialog", { key: '792f1f6afd587fae84fc52a62449a794e3f03e33', "aria-describedby": "content", "aria-labelledby": this.hideLabel ? undefined : "label", "aria-label": this.hideLabel ? this.label : undefined, class: className, onClose: this.onClose, onKeyDown: this.onKeyDown, onToggle: this.onToggle, role: "alertdialog", ref: (el) => (this.dialogEl = el) }, h("div", { key: '2bca81bc4a2e538f7e080a7d77dc648657938659', class: "dialog__backdrop", onClick: this.onBackdropClick }), h("div", { key: 'f65ff30e4e5b968beb4173e80998a03e1ca39fca', class: "dialog__body", part: "dialog__body", role: "document" }, !this.hideLabel && (h("h2", { key: 'e1f6baa4050471e29eec852df3a6e8e71925bd9c', class: "dialog__heading", part: "dialog__heading", id: "label" }, this.label)), h("div", { key: 'd8f4cc8d93de3aad7d45d3699aa49b73ec5efdcb', class: "dialog__content", part: "dialog__content", id: "content" }, h("slot", { key: '729e24ecc1de0624279a38723a58ccd7e92f119f' })), h("div", { key: '5340b93042e36af091648b0893a4090d124e7f95', class: "dialog__controls" }, hasLeftControls && (h("div", { key: 'd7064763e1a2f3cd7e7b64f9c36cb0ccb72c595e', class: "dialog__left_controls" }, h("slot", { key: '52525262d65555376b3dc911265dc35f7c801cdb', name: "left-controls" }))), this.secondaryActionLabel && (h("swirl-button", { key: '9adbe0bf902960014f25adcd8ab203a3e2e3a773', label: this.secondaryActionLabel, onClick: this.onSecondaryAction })), this.primaryActionLabel && (h("swirl-button", { key: '842263d779c24ecd30928d040cdaa4600eab3fc6', intent: this.intent, label: this.primaryActionLabel, onClick: this.onPrimaryAction, variant: "flat" })))))));
+        return (h(Host, { key: '877320d3ccc13ee8c4cef6fabd6db827645337ff' }, h("dialog", { key: 'db36f0e390d1e1593dff372cce290e53a9574fd9', "aria-describedby": "content", "aria-labelledby": this.hideLabel ? undefined : "label", "aria-label": this.hideLabel ? this.label : undefined, class: className, onClose: this.onClose, onKeyDown: this.onKeyDown, onToggle: this.onToggle, role: "alertdialog", ref: (el) => (this.dialogEl = el) }, h("div", { key: 'be03c2bb83506aeb3df08335a25795033e6ddd7a', class: "dialog__backdrop", onClick: this.onBackdropClick }), h("div", { key: 'da39ef70b86e76cd0d48ca83a3e92b4b957067b3', class: "dialog__body", part: "dialog__body", role: "document" }, !this.hideLabel && (h("h2", { key: '5705ab0984f1cbdc0b7740648f1c78a270212f7d', class: "dialog__heading", part: "dialog__heading", id: "label" }, this.label)), h("div", { key: '8b5278de16d40a25eb0427ba0d1af851b4a2f075', class: "dialog__content", part: "dialog__content", id: "content" }, h("slot", { key: '932e8cfc88ffcc6c2d154d25e824d6416db875ed' })), h("div", { key: 'c4e98c3e727108344e51db4a6d4ea6d3bcc901c8', class: "dialog__controls" }, hasLeftControls && (h("div", { key: 'c1a106b74a2caa5d4e590b40d91a6869bf8774e3', class: "dialog__left_controls" }, h("slot", { key: '298cf1ba398a58df9b310358388d3646e4601f41', name: "left-controls" }))), this.secondaryActionLabel && (h("swirl-button", { key: 'b40eb78e6f186610ee58c277a684c69fd952889b', label: this.secondaryActionLabel, onClick: this.onSecondaryAction })), this.primaryActionLabel && (h("swirl-button", { key: 'df4422f6a81d33cf7abb3f304558181a27f8aa2a', intent: this.intent, label: this.primaryActionLabel, onClick: this.onPrimaryAction, variant: "flat" })))))));
     }
     get el() { return this; }
     static get style() { return swirlDialogCss; }

package/dist/components/swirl-modal.js

@@ -137,8 +137,9 @@ const SwirlModal$1 = /*@__PURE__*/ proxyCustomElement(class SwirlModal extends H
     /**
      * Open the modal.
      */
-    async open() {
+    async open(returnFocusTo) {
         this.opening = true;
+        this.temporaryReturnFocusTo = returnFocusTo;
         if (!this.modalEl) {
             return;
         }
@@ -173,9 +174,7 @@ const SwirlModal$1 = /*@__PURE__*/ proxyCustomElement(class SwirlModal extends H
         setTimeout(() => {
             this.mutationObserver?.disconnect();
             this.modalEl.close();
-            if (this.returnFocusTo) {
-                this.customFocusReturn();
-            }
+            this.customFocusReturn();
         }, 150);
     }
     async setFullscreen(isFullscreen) {
@@ -243,9 +242,13 @@ const SwirlModal$1 = /*@__PURE__*/ proxyCustomElement(class SwirlModal extends H
         this.modalEl.setAttribute("closedby", "none");
     }
     customFocusReturn() {
-        const element = typeof this.returnFocusTo === "string"
-            ? document.querySelector(this.returnFocusTo)
-            : this.returnFocusTo;
+        const customReturnFocusTo = this.temporaryReturnFocusTo ?? this.returnFocusTo;
+        if (!customReturnFocusTo) {
+            return;
+        }
+        const element = typeof customReturnFocusTo === "string"
+            ? document.querySelector(customReturnFocusTo)
+            : customReturnFocusTo;
         const focusableElements = tabbable(element, {
             includeContainer: true,
             getShadowRoot: true,
@@ -253,6 +256,7 @@ const SwirlModal$1 = /*@__PURE__*/ proxyCustomElement(class SwirlModal extends H
         if (focusableElements.length > 0) {
             focusableElements[0].focus();
         }
+        this.temporaryReturnFocusTo = undefined;
     }
     render() {
         const showControls = Boolean(this.primaryActionLabel) || Boolean(this.secondaryActionLabel);
@@ -281,29 +285,29 @@ const SwirlModal$1 = /*@__PURE__*/ proxyCustomElement(class SwirlModal extends H
             "modal--sidebar-scrolled-down": this.sidebarScrolledDown,
             "modal--sidebar-scrollable": this.sidebarScrollable,
         });
-        return (h(Host, { key: 'c53283aad7f87ad05cc74bf68d39e33e57665cea' }, h("dialog", { key: 'f3e9a0b61a94b0b1d574265536a39d8bbe3aeaa1', "aria-label": this.label, class: className, onClose: this.onClose, onKeyDown: this.onKeyDown, onToggle: this.onToggle, ref: (el) => (this.modalEl = el) }, h("div", { key: '75bf8d418a4d77ffc37e42fb891047b39f99b6ab', class: "modal__backdrop", onClick: this.onBackdropClick }), h("div", { key: 'f5bcf112f23d9fb77bb2cba66a6203d5b9951a33', class: "modal__body", part: "modal__body", style: !this.isFullscreen
+        return (h(Host, { key: '9607d76894163f9cea92112aa01bfc6e22a605ed' }, h("dialog", { key: '493f4a8502ac1bd48885f0be516bae1924bf2811', "aria-label": this.label, class: className, onClose: this.onClose, onKeyDown: this.onKeyDown, onToggle: this.onToggle, ref: (el) => (this.modalEl = el) }, h("div", { key: '8336b77b80c345349280e458eacd0ad27a82dd2e', class: "modal__backdrop", onClick: this.onBackdropClick }), h("div", { key: 'ddea931cf61e89694478dc990a79fd7547786447', class: "modal__body", part: "modal__body", style: !this.isFullscreen
                 ? {
                     "--swirl-modal-max-height": this.maxHeight,
                     "--swirl-modal-height": this.height,
                     minHeight: this.minHeight,
                     maxWidth: this.maxWidth,
                 }
-                : {} }, h("aside", { key: '382e8b1e9592b3a9752bb1ef2fc0f1b556cd2d7c', class: "modal__sidebar" }, this.sidebarLabel && (h("header", { key: '41cf73ab5aaca279a88eb6532f2144242f78ea47', class: classNames("modal__sidebar-header", {
+                : {} }, h("aside", { key: '7e68933ae1f88a30ac4391d8840f5de4f013f2b5', class: "modal__sidebar" }, this.sidebarLabel && (h("header", { key: '937372760da5f51336f94501b8c85b0b09ecaba5', class: classNames("modal__sidebar-header", {
                 "modal__sidebar-header--has-close-button": this.hasSidebarCloseButton,
-            }) }, this.hasSidebarCloseButton && (h("swirl-button", { key: '9ead40c49960b2d69feca469bbc91ea91b4ab3d1', hideLabel: true, icon: "<swirl-icon-double-arrow-right></swirl-icon-double-arrow-right>", label: this.sidebarCloseButtonLabel, onClick: this.onSidebarCloseButtonClick })), h("swirl-heading", { key: '487f65c82081100e09be212f2e400900ac6c8bfc', as: "h3", class: "modal__sidebar-heading", level: 5, text: this.sidebarLabel }))), h("div", { key: '147a03cbb62653955ad302b782774812cc9f9068', class: "modal__sidebar-content", onScroll: this.determineSidebarScrollStatus, ref: (el) => (this.sidebarScrollContainer = el) }, h("slot", { key: 'ecde4d85fc8ab0ae0b9e0559ba8a779ab41a5d3a', name: "sidebar-content" })), h("div", { key: '5c0aeac2179557eea8953cc8809fa3cdeec58f7a', class: "modal__sidebar-footer", part: "modal__sidebar-footer" }, h("slot", { key: '0149eae26b53fdc7727e8fe355d39ef1aa6d2313', name: "sidebar-footer" }))), h("div", { key: '9c5b37271a1e158f8a45fe79705034a48fb565ed', class: "modal__main-content" }, h("header", { key: '9ac62c6974e74c144c3c8ca80b530d73912b0137', class: "modal__custom-header", part: "modal__custom-header" }, h("slot", { key: '55c475bfa35b12376efac0b67f26a0c3b31a20af', name: "custom-header" })), (!this.hideLabel || !this.hideCloseButton) && (h("header", { key: '54b61a7b591f367d8a3c916021e7159e0eeed068', class: "modal__header" }, h("div", { key: '159e1b20bd85579ed7fdfe1e1459edca776bf6b6', class: "modal__header-bar" }, !this.hideCloseButton && (h("swirl-button", { key: '473b559c8b3629a1071ca687a0f1ee52dc7d15d3', class: "modal__close-button", hideLabel: true, icon: this.variant === "default"
+            }) }, this.hasSidebarCloseButton && (h("swirl-button", { key: 'c40db31ae401fcde5e68c59a91cc80a507201edb', hideLabel: true, icon: "<swirl-icon-double-arrow-right></swirl-icon-double-arrow-right>", label: this.sidebarCloseButtonLabel, onClick: this.onSidebarCloseButtonClick })), h("swirl-heading", { key: '470f47fbe55f98b48b5f364b0461d1c973c1b131', as: "h3", class: "modal__sidebar-heading", level: 5, text: this.sidebarLabel }))), h("div", { key: '4f09f2abcec1a34a6caa57788ced9cfecdfcf28e', class: "modal__sidebar-content", onScroll: this.determineSidebarScrollStatus, ref: (el) => (this.sidebarScrollContainer = el) }, h("slot", { key: '4884f0e09c450b961636631b07c39627c58024fc', name: "sidebar-content" })), h("div", { key: '3a6568ff8eee6b3633c9fab8a51531619b0740ff', class: "modal__sidebar-footer", part: "modal__sidebar-footer" }, h("slot", { key: '87fc8362aa752cad6a8dfcb7f3dcb73dde97c4f5', name: "sidebar-footer" }))), h("div", { key: '7083bdd06f61cac7d98b6f9ace6ece3d3e584ba4', class: "modal__main-content" }, h("header", { key: 'b0b07efe07d43dc60267ff98f2967f87ca4d4fd8', class: "modal__custom-header", part: "modal__custom-header" }, h("slot", { key: '55f676f976dea97d8007d5f5877ca6dc9919f167', name: "custom-header" })), (!this.hideLabel || !this.hideCloseButton) && (h("header", { key: '00b190cde34d936f78338c7855459623f99a0baf', class: "modal__header" }, h("div", { key: '7feda4612420ed6643b8bfd83b0562d22995dcdd', class: "modal__header-bar" }, !this.hideCloseButton && (h("swirl-button", { key: 'f044e9d305151fb188be9a4639a0f40be1f59062', class: "modal__close-button", hideLabel: true, icon: this.variant === "default"
                 ? "<swirl-icon-close></swirl-icon-close>"
-                : "<swirl-icon-double-arrow-right></swirl-icon-double-arrow-right>", label: this.closeButtonLabel, onClick: this.onCloseButtonClick })), this.showFullscreenButton && (h("swirl-button", { key: 'fd40a806fceca676a41b2253f82e18e960da806f', class: "modal__fullscreen-button", hideLabel: true, icon: this.isFullscreen
+                : "<swirl-icon-double-arrow-right></swirl-icon-double-arrow-right>", label: this.closeButtonLabel, onClick: this.onCloseButtonClick })), this.showFullscreenButton && (h("swirl-button", { key: 'a0f5f7dbda18e36ef6a006bbf901f6f58f2a7ee9', class: "modal__fullscreen-button", hideLabel: true, icon: this.isFullscreen
                 ? "<swirl-icon-close-fullscreen></swirl-icon-close-fullscreen>"
                 : "<swirl-icon-open-in-full></swirl-icon-open-in-full>", label: this.isFullscreen
                 ? this.fullscreenDisableButtonLabel
-                : this.fullscreenEnableButtonLabel, onClick: this.onFullscreenButtonClick })), !this.hideLabel && (h("swirl-heading", { key: '3d54e1b6df57be9faafc96e0aba51e1f7cc5493f', as: "h2", class: "modal__heading", level: 3, text: this.label }))))), h("div", { key: '460cff9a5b1d6c5775a39534678af201909b3388', class: "modal__content-container", style: {
+                : this.fullscreenEnableButtonLabel, onClick: this.onFullscreenButtonClick })), !this.hideLabel && (h("swirl-heading", { key: '0b4ce16103c4ebadf58b823168a80c727493a991', as: "h2", class: "modal__heading", level: 3, text: this.label }))))), h("div", { key: 'a5ff003a51bb82b58e299090e14e5061af014206', class: "modal__content-container", style: {
                 gap: this.contentGap
                     ? `var(--s-space-${this.contentGap})`
                     : undefined,
-            } }, h("div", { key: '2c314687bf9553212f41be41d7ba40092cf4adbf', class: "modal__primary-content", style: {
+            } }, h("div", { key: '7998558a65f2f550d6a904f92879d8cba407afcf', class: "modal__primary-content", style: {
                 maxWidth: this.primaryContentMaxWidth,
                 flex: this.primaryContentFlex,
-            } }, h("div", { key: 'd791af57ae248b9ad5e0872bcb193fefd1fef44b', class: "modal__header-tools", part: "modal__header-tools" }, h("slot", { key: '8e5b801755e617dbae380c86d9b9a6c72203f915', name: "header-tools" })), h("div", { key: '460a2c618a871d1fed8927a676c0cef86607939f', class: "modal__content", onScroll: this.determineMainScrollStatus, part: "modal__content", ref: (el) => (this.scrollContainer = el) }, h("slot", { key: '91b8d1223e10c107392c4a6913d3483ccbe3c689' }))), h("div", { key: '8d7757d3ad4921e649e47e4052dc30c069bbb082', class: "modal__secondary-content", style: {
+            } }, h("div", { key: 'f6f396758cb0c9339f100e00f282408e927bc9d6', class: "modal__header-tools", part: "modal__header-tools" }, h("slot", { key: '2f85693e7244246afe09ea082c9128cfae96afee', name: "header-tools" })), h("div", { key: '311c59649ff26753ba0e361be1eb79b43d57e3d0', class: "modal__content", onScroll: this.determineMainScrollStatus, part: "modal__content", ref: (el) => (this.scrollContainer = el) }, h("slot", { key: 'a7594eac7292ce9392143d72560829d1e5af9294' }))), h("div", { key: 'a2ffc74c4b81dd0d08060d248c5caa4a4df3b355', class: "modal__secondary-content", style: {
                 maxWidth: this.secondaryContentMaxWidth,
                 flex: this.secondaryContentFlex,
                 padding: Boolean(this.secondaryContentPadding)
@@ -321,7 +325,7 @@ const SwirlModal$1 = /*@__PURE__*/ proxyCustomElement(class SwirlModal extends H
                 paddingInlineStart: Boolean(this.secondaryContentPaddingInlineStart)
                     ? `var(--s-space-${this.secondaryContentPaddingInlineStart})`
                     : undefined,
-            } }, h("slot", { key: '0fee540e1ffcd87a4efd66394b9506073720d4f9', name: "secondary-content" }))), h("div", { key: 'e3d7e34eeb3a852801494b01590605736359ff93', class: "modal__custom-footer" }, h("slot", { key: 'f9152641cfe89640ded1ca29eecb6672b0c1db5a', name: "custom-footer" })), showControls && (h("footer", { key: '794fdc1f5f62174bb7e8dd22ebd2cf66263e78e4', class: "modal__controls" }, h("swirl-button-group", { key: 'eb5b75263ab691ea70dca2608ee4e3bae836dbe4', wrap: true }, this.secondaryActionLabel && (h("swirl-button", { key: 'bd4f677b1b4fc4cd26a2d1bf4bdb3e2f54c43159', label: this.secondaryActionLabel, onClick: this.onSecondaryAction })), this.primaryActionLabel && (h("swirl-button", { key: '6228911c5e114668d9a4dce63aff4c3931cfdb8a', intent: "primary", label: this.primaryActionLabel, onClick: this.onPrimaryAction, variant: "flat" }))))))))));
+            } }, h("slot", { key: '37c3f309468170109de45aebfbe1c2e7a70929bc', name: "secondary-content" }))), h("div", { key: '235c9a2e6eed9359f8018b18473855a2e6569b16', class: "modal__custom-footer" }, h("slot", { key: '81d43e3d64e9793a8cbb594f22249411c143edb5', name: "custom-footer" })), showControls && (h("footer", { key: '039c1db115c9b719240d9f6b6b775e3be2ab1e9f', class: "modal__controls" }, h("swirl-button-group", { key: '31020e04e3a0329448bbcb787160980bb4cc5d96', wrap: true }, this.secondaryActionLabel && (h("swirl-button", { key: 'dd2da3b453d272f21d07cff0bb3bc4b612269bf2', label: this.secondaryActionLabel, onClick: this.onSecondaryAction })), this.primaryActionLabel && (h("swirl-button", { key: '9407812f0e5cf0d997d875df326606ed9c735c74', intent: "primary", label: this.primaryActionLabel, onClick: this.onPrimaryAction, variant: "flat" }))))))))));
     }
     get el() { return this; }
     static get style() { return swirlModalCss; }

package/dist/esm/swirl-dialog.entry.js

@@ -64,8 +64,9 @@ const SwirlDialog = class {
     /**
      * Open the dialog.
      */
-    async open() {
+    async open(returnFocusTo) {
         this.opening = true;
+        this.temporaryReturnFocusTo = returnFocusTo;
         if (!this.dialogEl) {
             return;
         }
@@ -82,15 +83,17 @@ const SwirlDialog = class {
         this.closing = true;
         setTimeout(() => {
             this.dialogEl.close();
-            if (this.returnFocusTo) {
-                this.customFocusReturn();
-            }
+            this.customFocusReturn();
         }, 150);
     }
     customFocusReturn() {
-        const element = typeof this.returnFocusTo === "string"
-            ? document.querySelector(this.returnFocusTo)
-            : this.returnFocusTo;
+        const customReturnFocusTo = this.temporaryReturnFocusTo ?? this.returnFocusTo;
+        if (!customReturnFocusTo) {
+            return;
+        }
+        const element = typeof customReturnFocusTo === "string"
+            ? document.querySelector(customReturnFocusTo)
+            : customReturnFocusTo;
         const focusableElements = tabbable(element, {
             includeContainer: true,
             getShadowRoot: true,
@@ -98,11 +101,12 @@ const SwirlDialog = class {
         if (focusableElements.length > 0) {
             focusableElements[0].focus();
         }
+        this.temporaryReturnFocusTo = undefined;
     }
     render() {
         const className = classnames("dialog", { "dialog--closing": this.closing });
         const hasLeftControls = Boolean(this.el.querySelector('[slot="left-controls"]'));
-        return (h(Host, { key: '96dda6293b1d08c47f87f939eacfb089f21f8e85' }, h("dialog", { key: '792f1f6afd587fae84fc52a62449a794e3f03e33', "aria-describedby": "content", "aria-labelledby": this.hideLabel ? undefined : "label", "aria-label": this.hideLabel ? this.label : undefined, class: className, onClose: this.onClose, onKeyDown: this.onKeyDown, onToggle: this.onToggle, role: "alertdialog", ref: (el) => (this.dialogEl = el) }, h("div", { key: '2bca81bc4a2e538f7e080a7d77dc648657938659', class: "dialog__backdrop", onClick: this.onBackdropClick }), h("div", { key: 'f65ff30e4e5b968beb4173e80998a03e1ca39fca', class: "dialog__body", part: "dialog__body", role: "document" }, !this.hideLabel && (h("h2", { key: 'e1f6baa4050471e29eec852df3a6e8e71925bd9c', class: "dialog__heading", part: "dialog__heading", id: "label" }, this.label)), h("div", { key: 'd8f4cc8d93de3aad7d45d3699aa49b73ec5efdcb', class: "dialog__content", part: "dialog__content", id: "content" }, h("slot", { key: '729e24ecc1de0624279a38723a58ccd7e92f119f' })), h("div", { key: '5340b93042e36af091648b0893a4090d124e7f95', class: "dialog__controls" }, hasLeftControls && (h("div", { key: 'd7064763e1a2f3cd7e7b64f9c36cb0ccb72c595e', class: "dialog__left_controls" }, h("slot", { key: '52525262d65555376b3dc911265dc35f7c801cdb', name: "left-controls" }))), this.secondaryActionLabel && (h("swirl-button", { key: '9adbe0bf902960014f25adcd8ab203a3e2e3a773', label: this.secondaryActionLabel, onClick: this.onSecondaryAction })), this.primaryActionLabel && (h("swirl-button", { key: '842263d779c24ecd30928d040cdaa4600eab3fc6', intent: this.intent, label: this.primaryActionLabel, onClick: this.onPrimaryAction, variant: "flat" })))))));
+        return (h(Host, { key: '877320d3ccc13ee8c4cef6fabd6db827645337ff' }, h("dialog", { key: 'db36f0e390d1e1593dff372cce290e53a9574fd9', "aria-describedby": "content", "aria-labelledby": this.hideLabel ? undefined : "label", "aria-label": this.hideLabel ? this.label : undefined, class: className, onClose: this.onClose, onKeyDown: this.onKeyDown, onToggle: this.onToggle, role: "alertdialog", ref: (el) => (this.dialogEl = el) }, h("div", { key: 'be03c2bb83506aeb3df08335a25795033e6ddd7a', class: "dialog__backdrop", onClick: this.onBackdropClick }), h("div", { key: 'da39ef70b86e76cd0d48ca83a3e92b4b957067b3', class: "dialog__body", part: "dialog__body", role: "document" }, !this.hideLabel && (h("h2", { key: '5705ab0984f1cbdc0b7740648f1c78a270212f7d', class: "dialog__heading", part: "dialog__heading", id: "label" }, this.label)), h("div", { key: '8b5278de16d40a25eb0427ba0d1af851b4a2f075', class: "dialog__content", part: "dialog__content", id: "content" }, h("slot", { key: '932e8cfc88ffcc6c2d154d25e824d6416db875ed' })), h("div", { key: 'c4e98c3e727108344e51db4a6d4ea6d3bcc901c8', class: "dialog__controls" }, hasLeftControls && (h("div", { key: 'c1a106b74a2caa5d4e590b40d91a6869bf8774e3', class: "dialog__left_controls" }, h("slot", { key: '298cf1ba398a58df9b310358388d3646e4601f41', name: "left-controls" }))), this.secondaryActionLabel && (h("swirl-button", { key: 'b40eb78e6f186610ee58c277a684c69fd952889b', label: this.secondaryActionLabel, onClick: this.onSecondaryAction })), this.primaryActionLabel && (h("swirl-button", { key: 'df4422f6a81d33cf7abb3f304558181a27f8aa2a', intent: this.intent, label: this.primaryActionLabel, onClick: this.onPrimaryAction, variant: "flat" })))))));
     }
     get el() { return getElement(this); }
 };

package/dist/esm/swirl-modal.entry.js

@@ -131,8 +131,9 @@ const SwirlModal = class {
     /**
      * Open the modal.
      */
-    async open() {
+    async open(returnFocusTo) {
         this.opening = true;
+        this.temporaryReturnFocusTo = returnFocusTo;
         if (!this.modalEl) {
             return;
         }
@@ -167,9 +168,7 @@ const SwirlModal = class {
         setTimeout(() => {
             this.mutationObserver?.disconnect();
             this.modalEl.close();
-            if (this.returnFocusTo) {
-                this.customFocusReturn();
-            }
+            this.customFocusReturn();
         }, 150);
     }
     async setFullscreen(isFullscreen) {
@@ -237,9 +236,13 @@ const SwirlModal = class {
         this.modalEl.setAttribute("closedby", "none");
     }
     customFocusReturn() {
-        const element = typeof this.returnFocusTo === "string"
-            ? document.querySelector(this.returnFocusTo)
-            : this.returnFocusTo;
+        const customReturnFocusTo = this.temporaryReturnFocusTo ?? this.returnFocusTo;
+        if (!customReturnFocusTo) {
+            return;
+        }
+        const element = typeof customReturnFocusTo === "string"
+            ? document.querySelector(customReturnFocusTo)
+            : customReturnFocusTo;
         const focusableElements = tabbable(element, {
             includeContainer: true,
             getShadowRoot: true,
@@ -247,6 +250,7 @@ const SwirlModal = class {
         if (focusableElements.length > 0) {
             focusableElements[0].focus();
         }
+        this.temporaryReturnFocusTo = undefined;
     }
     render() {
         const showControls = Boolean(this.primaryActionLabel) || Boolean(this.secondaryActionLabel);
@@ -275,29 +279,29 @@ const SwirlModal = class {
             "modal--sidebar-scrolled-down": this.sidebarScrolledDown,
             "modal--sidebar-scrollable": this.sidebarScrollable,
         });
-        return (h(Host, { key: 'c53283aad7f87ad05cc74bf68d39e33e57665cea' }, h("dialog", { key: 'f3e9a0b61a94b0b1d574265536a39d8bbe3aeaa1', "aria-label": this.label, class: className, onClose: this.onClose, onKeyDown: this.onKeyDown, onToggle: this.onToggle, ref: (el) => (this.modalEl = el) }, h("div", { key: '75bf8d418a4d77ffc37e42fb891047b39f99b6ab', class: "modal__backdrop", onClick: this.onBackdropClick }), h("div", { key: 'f5bcf112f23d9fb77bb2cba66a6203d5b9951a33', class: "modal__body", part: "modal__body", style: !this.isFullscreen
+        return (h(Host, { key: '9607d76894163f9cea92112aa01bfc6e22a605ed' }, h("dialog", { key: '493f4a8502ac1bd48885f0be516bae1924bf2811', "aria-label": this.label, class: className, onClose: this.onClose, onKeyDown: this.onKeyDown, onToggle: this.onToggle, ref: (el) => (this.modalEl = el) }, h("div", { key: '8336b77b80c345349280e458eacd0ad27a82dd2e', class: "modal__backdrop", onClick: this.onBackdropClick }), h("div", { key: 'ddea931cf61e89694478dc990a79fd7547786447', class: "modal__body", part: "modal__body", style: !this.isFullscreen
                 ? {
                     "--swirl-modal-max-height": this.maxHeight,
                     "--swirl-modal-height": this.height,
                     minHeight: this.minHeight,
                     maxWidth: this.maxWidth,
                 }
-                : {} }, h("aside", { key: '382e8b1e9592b3a9752bb1ef2fc0f1b556cd2d7c', class: "modal__sidebar" }, this.sidebarLabel && (h("header", { key: '41cf73ab5aaca279a88eb6532f2144242f78ea47', class: classnames("modal__sidebar-header", {
+                : {} }, h("aside", { key: '7e68933ae1f88a30ac4391d8840f5de4f013f2b5', class: "modal__sidebar" }, this.sidebarLabel && (h("header", { key: '937372760da5f51336f94501b8c85b0b09ecaba5', class: classnames("modal__sidebar-header", {
                 "modal__sidebar-header--has-close-button": this.hasSidebarCloseButton,
-            }) }, this.hasSidebarCloseButton && (h("swirl-button", { key: '9ead40c49960b2d69feca469bbc91ea91b4ab3d1', hideLabel: true, icon: "<swirl-icon-double-arrow-right></swirl-icon-double-arrow-right>", label: this.sidebarCloseButtonLabel, onClick: this.onSidebarCloseButtonClick })), h("swirl-heading", { key: '487f65c82081100e09be212f2e400900ac6c8bfc', as: "h3", class: "modal__sidebar-heading", level: 5, text: this.sidebarLabel }))), h("div", { key: '147a03cbb62653955ad302b782774812cc9f9068', class: "modal__sidebar-content", onScroll: this.determineSidebarScrollStatus, ref: (el) => (this.sidebarScrollContainer = el) }, h("slot", { key: 'ecde4d85fc8ab0ae0b9e0559ba8a779ab41a5d3a', name: "sidebar-content" })), h("div", { key: '5c0aeac2179557eea8953cc8809fa3cdeec58f7a', class: "modal__sidebar-footer", part: "modal__sidebar-footer" }, h("slot", { key: '0149eae26b53fdc7727e8fe355d39ef1aa6d2313', name: "sidebar-footer" }))), h("div", { key: '9c5b37271a1e158f8a45fe79705034a48fb565ed', class: "modal__main-content" }, h("header", { key: '9ac62c6974e74c144c3c8ca80b530d73912b0137', class: "modal__custom-header", part: "modal__custom-header" }, h("slot", { key: '55c475bfa35b12376efac0b67f26a0c3b31a20af', name: "custom-header" })), (!this.hideLabel || !this.hideCloseButton) && (h("header", { key: '54b61a7b591f367d8a3c916021e7159e0eeed068', class: "modal__header" }, h("div", { key: '159e1b20bd85579ed7fdfe1e1459edca776bf6b6', class: "modal__header-bar" }, !this.hideCloseButton && (h("swirl-button", { key: '473b559c8b3629a1071ca687a0f1ee52dc7d15d3', class: "modal__close-button", hideLabel: true, icon: this.variant === "default"
+            }) }, this.hasSidebarCloseButton && (h("swirl-button", { key: 'c40db31ae401fcde5e68c59a91cc80a507201edb', hideLabel: true, icon: "<swirl-icon-double-arrow-right></swirl-icon-double-arrow-right>", label: this.sidebarCloseButtonLabel, onClick: this.onSidebarCloseButtonClick })), h("swirl-heading", { key: '470f47fbe55f98b48b5f364b0461d1c973c1b131', as: "h3", class: "modal__sidebar-heading", level: 5, text: this.sidebarLabel }))), h("div", { key: '4f09f2abcec1a34a6caa57788ced9cfecdfcf28e', class: "modal__sidebar-content", onScroll: this.determineSidebarScrollStatus, ref: (el) => (this.sidebarScrollContainer = el) }, h("slot", { key: '4884f0e09c450b961636631b07c39627c58024fc', name: "sidebar-content" })), h("div", { key: '3a6568ff8eee6b3633c9fab8a51531619b0740ff', class: "modal__sidebar-footer", part: "modal__sidebar-footer" }, h("slot", { key: '87fc8362aa752cad6a8dfcb7f3dcb73dde97c4f5', name: "sidebar-footer" }))), h("div", { key: '7083bdd06f61cac7d98b6f9ace6ece3d3e584ba4', class: "modal__main-content" }, h("header", { key: 'b0b07efe07d43dc60267ff98f2967f87ca4d4fd8', class: "modal__custom-header", part: "modal__custom-header" }, h("slot", { key: '55f676f976dea97d8007d5f5877ca6dc9919f167', name: "custom-header" })), (!this.hideLabel || !this.hideCloseButton) && (h("header", { key: '00b190cde34d936f78338c7855459623f99a0baf', class: "modal__header" }, h("div", { key: '7feda4612420ed6643b8bfd83b0562d22995dcdd', class: "modal__header-bar" }, !this.hideCloseButton && (h("swirl-button", { key: 'f044e9d305151fb188be9a4639a0f40be1f59062', class: "modal__close-button", hideLabel: true, icon: this.variant === "default"
                 ? "<swirl-icon-close></swirl-icon-close>"
-                : "<swirl-icon-double-arrow-right></swirl-icon-double-arrow-right>", label: this.closeButtonLabel, onClick: this.onCloseButtonClick })), this.showFullscreenButton && (h("swirl-button", { key: 'fd40a806fceca676a41b2253f82e18e960da806f', class: "modal__fullscreen-button", hideLabel: true, icon: this.isFullscreen
+                : "<swirl-icon-double-arrow-right></swirl-icon-double-arrow-right>", label: this.closeButtonLabel, onClick: this.onCloseButtonClick })), this.showFullscreenButton && (h("swirl-button", { key: 'a0f5f7dbda18e36ef6a006bbf901f6f58f2a7ee9', class: "modal__fullscreen-button", hideLabel: true, icon: this.isFullscreen
                 ? "<swirl-icon-close-fullscreen></swirl-icon-close-fullscreen>"
                 : "<swirl-icon-open-in-full></swirl-icon-open-in-full>", label: this.isFullscreen
                 ? this.fullscreenDisableButtonLabel
-                : this.fullscreenEnableButtonLabel, onClick: this.onFullscreenButtonClick })), !this.hideLabel && (h("swirl-heading", { key: '3d54e1b6df57be9faafc96e0aba51e1f7cc5493f', as: "h2", class: "modal__heading", level: 3, text: this.label }))))), h("div", { key: '460cff9a5b1d6c5775a39534678af201909b3388', class: "modal__content-container", style: {
+                : this.fullscreenEnableButtonLabel, onClick: this.onFullscreenButtonClick })), !this.hideLabel && (h("swirl-heading", { key: '0b4ce16103c4ebadf58b823168a80c727493a991', as: "h2", class: "modal__heading", level: 3, text: this.label }))))), h("div", { key: 'a5ff003a51bb82b58e299090e14e5061af014206', class: "modal__content-container", style: {
                 gap: this.contentGap
                     ? `var(--s-space-${this.contentGap})`
                     : undefined,
-            } }, h("div", { key: '2c314687bf9553212f41be41d7ba40092cf4adbf', class: "modal__primary-content", style: {
+            } }, h("div", { key: '7998558a65f2f550d6a904f92879d8cba407afcf', class: "modal__primary-content", style: {
                 maxWidth: this.primaryContentMaxWidth,
                 flex: this.primaryContentFlex,
-            } }, h("div", { key: 'd791af57ae248b9ad5e0872bcb193fefd1fef44b', class: "modal__header-tools", part: "modal__header-tools" }, h("slot", { key: '8e5b801755e617dbae380c86d9b9a6c72203f915', name: "header-tools" })), h("div", { key: '460a2c618a871d1fed8927a676c0cef86607939f', class: "modal__content", onScroll: this.determineMainScrollStatus, part: "modal__content", ref: (el) => (this.scrollContainer = el) }, h("slot", { key: '91b8d1223e10c107392c4a6913d3483ccbe3c689' }))), h("div", { key: '8d7757d3ad4921e649e47e4052dc30c069bbb082', class: "modal__secondary-content", style: {
+            } }, h("div", { key: 'f6f396758cb0c9339f100e00f282408e927bc9d6', class: "modal__header-tools", part: "modal__header-tools" }, h("slot", { key: '2f85693e7244246afe09ea082c9128cfae96afee', name: "header-tools" })), h("div", { key: '311c59649ff26753ba0e361be1eb79b43d57e3d0', class: "modal__content", onScroll: this.determineMainScrollStatus, part: "modal__content", ref: (el) => (this.scrollContainer = el) }, h("slot", { key: 'a7594eac7292ce9392143d72560829d1e5af9294' }))), h("div", { key: 'a2ffc74c4b81dd0d08060d248c5caa4a4df3b355', class: "modal__secondary-content", style: {
                 maxWidth: this.secondaryContentMaxWidth,
                 flex: this.secondaryContentFlex,
                 padding: Boolean(this.secondaryContentPadding)
@@ -315,7 +319,7 @@ const SwirlModal = class {
                 paddingInlineStart: Boolean(this.secondaryContentPaddingInlineStart)
                     ? `var(--s-space-${this.secondaryContentPaddingInlineStart})`
                     : undefined,
-            } }, h("slot", { key: '0fee540e1ffcd87a4efd66394b9506073720d4f9', name: "secondary-content" }))), h("div", { key: 'e3d7e34eeb3a852801494b01590605736359ff93', class: "modal__custom-footer" }, h("slot", { key: 'f9152641cfe89640ded1ca29eecb6672b0c1db5a', name: "custom-footer" })), showControls && (h("footer", { key: '794fdc1f5f62174bb7e8dd22ebd2cf66263e78e4', class: "modal__controls" }, h("swirl-button-group", { key: 'eb5b75263ab691ea70dca2608ee4e3bae836dbe4', wrap: true }, this.secondaryActionLabel && (h("swirl-button", { key: 'bd4f677b1b4fc4cd26a2d1bf4bdb3e2f54c43159', label: this.secondaryActionLabel, onClick: this.onSecondaryAction })), this.primaryActionLabel && (h("swirl-button", { key: '6228911c5e114668d9a4dce63aff4c3931cfdb8a', intent: "primary", label: this.primaryActionLabel, onClick: this.onPrimaryAction, variant: "flat" }))))))))));
+            } }, h("slot", { key: '37c3f309468170109de45aebfbe1c2e7a70929bc', name: "secondary-content" }))), h("div", { key: '235c9a2e6eed9359f8018b18473855a2e6569b16', class: "modal__custom-footer" }, h("slot", { key: '81d43e3d64e9793a8cbb594f22249411c143edb5', name: "custom-footer" })), showControls && (h("footer", { key: '039c1db115c9b719240d9f6b6b775e3be2ab1e9f', class: "modal__controls" }, h("swirl-button-group", { key: '31020e04e3a0329448bbcb787160980bb4cc5d96', wrap: true }, this.secondaryActionLabel && (h("swirl-button", { key: 'dd2da3b453d272f21d07cff0bb3bc4b612269bf2', label: this.secondaryActionLabel, onClick: this.onSecondaryAction })), this.primaryActionLabel && (h("swirl-button", { key: '9407812f0e5cf0d997d875df326606ed9c735c74', intent: "primary", label: this.primaryActionLabel, onClick: this.onPrimaryAction, variant: "flat" }))))))))));
     }
     get el() { return getElement(this); }
 };

package/dist/swirl-components/{p-4e496744.entry.js → p-5336fc61.entry.js}

@@ -1 +1 @@
-import{r as i,c as a,h as o,H as e,d as t}from"./p-Dj_4Fda9.js";import{c as s}from"./p-orsBiyT_.js";import{t as d}from"./p-DBTxpXCn.js";const n=class{constructor(o){i(this,o),this.dialogClose=a(this,"dialogClose",7),this.dialogOpen=a(this,"dialogOpen",7),this.primaryAction=a(this,"primaryAction",7),this.secondaryAction=a(this,"secondaryAction",7),this.toggleDialog=a(this,"toggleDialog",7),this.intent="primary",this.closing=!1,this.opening=!1,this.onClose=()=>{this.closing=!1,this.dialogClose.emit()},this.onToggle=i=>{this.toggleDialog.emit({newState:i.newState,dialog:this.dialogEl})},this.onKeyDown=i=>{"Escape"===i.code&&(i.stopImmediatePropagation(),i.preventDefault(),this.close())},this.onBackdropClick=()=>{this.close()},this.onPrimaryAction=i=>{this.primaryAction.emit(i),this.close()},this.onSecondaryAction=i=>{this.secondaryAction.emit(i),this.close()}}componentDidLoad(){this.ensureOpening(),this.setDialogCustomProps()}disconnectedCallback(){this.dialogEl?.open&&this.dialogEl.close()}ensureOpening(){this.opening&&!this.dialogEl?.open&&this.open()}setDialogCustomProps(){this.dialogEl.setAttribute("closedby","none")}async open(){this.opening=!0,this.dialogEl&&(this.dialogEl.showModal(),this.dialogOpen.emit())}async close(){this.closing||(this.closing=!0,setTimeout((()=>{this.dialogEl.close(),this.returnFocusTo&&this.customFocusReturn()}),150))}customFocusReturn(){const i="string"==typeof this.returnFocusTo?document.querySelector(this.returnFocusTo):this.returnFocusTo,a=d(i,{includeContainer:!0,getShadowRoot:!0});a.length>0&&a[0].focus()}render(){const i=s("dialog",{"dialog--closing":this.closing}),a=Boolean(this.el.querySelector('[slot="left-controls"]'));return o(e,{key:"96dda6293b1d08c47f87f939eacfb089f21f8e85"},o("dialog",{key:"792f1f6afd587fae84fc52a62449a794e3f03e33","aria-describedby":"content","aria-labelledby":this.hideLabel?void 0:"label","aria-label":this.hideLabel?this.label:void 0,class:i,onClose:this.onClose,onKeyDown:this.onKeyDown,onToggle:this.onToggle,role:"alertdialog",ref:i=>this.dialogEl=i},o("div",{key:"2bca81bc4a2e538f7e080a7d77dc648657938659",class:"dialog__backdrop",onClick:this.onBackdropClick}),o("div",{key:"f65ff30e4e5b968beb4173e80998a03e1ca39fca",class:"dialog__body",part:"dialog__body",role:"document"},!this.hideLabel&&o("h2",{key:"e1f6baa4050471e29eec852df3a6e8e71925bd9c",class:"dialog__heading",part:"dialog__heading",id:"label"},this.label),o("div",{key:"d8f4cc8d93de3aad7d45d3699aa49b73ec5efdcb",class:"dialog__content",part:"dialog__content",id:"content"},o("slot",{key:"729e24ecc1de0624279a38723a58ccd7e92f119f"})),o("div",{key:"5340b93042e36af091648b0893a4090d124e7f95",class:"dialog__controls"},a&&o("div",{key:"d7064763e1a2f3cd7e7b64f9c36cb0ccb72c595e",class:"dialog__left_controls"},o("slot",{key:"52525262d65555376b3dc911265dc35f7c801cdb",name:"left-controls"})),this.secondaryActionLabel&&o("swirl-button",{key:"9adbe0bf902960014f25adcd8ab203a3e2e3a773",label:this.secondaryActionLabel,onClick:this.onSecondaryAction}),this.primaryActionLabel&&o("swirl-button",{key:"842263d779c24ecd30928d040cdaa4600eab3fc6",intent:this.intent,label:this.primaryActionLabel,onClick:this.onPrimaryAction,variant:"flat"})))))}get el(){return t(this)}};n.style=":host{display:block}:host *{box-sizing:border-box}.dialog{--swirl-ghost-button-background-default:var(--s-surface-overlay-default);--swirl-ghost-button-background-hovered:var(--s-surface-overlay-hovered);--swirl-ghost-button-background-pressed:var(--s-surface-overlay-pressed);position:fixed;z-index:var(--s-z-40);display:flex;justify-content:center;align-items:center;inset:0;border:none;padding:0;width:auto;background:transparent;max-width:none;max-height:none;overflow:visible}.dialog::backdrop{display:none}.dialog:not([open]){display:none}.dialog:not(.dialog--closing) .dialog__backdrop{animation:0.15s dialog-backdrop-fade-in}@media (prefers-reduced-motion){.dialog:not(.dialog--closing) .dialog__backdrop{animation:none}}.dialog:not(.dialog--closing) .dialog__body{animation:0.15s dialog-scale-in}@media (prefers-reduced-motion){.dialog:not(.dialog--closing) .dialog__body{animation:none}}.dialog--closing{animation:0.15s dialog-fade-out;animation-fill-mode:forwards}@media (prefers-reduced-motion){.dialog--closing{animation:none}}.dialog__backdrop{position:fixed;background-color:rgba(0, 0, 0, 0.2);inset:0}.dialog__body{z-index:var(--s-z-40);overflow-x:hidden;overflow-y:auto;width:18.5rem;max-height:90vh;padding-top:var(--s-space-24);padding-right:var(--s-space-16);padding-bottom:var(--s-space-16);padding-left:var(--s-space-16);border-radius:var(--s-border-radius-l);background-color:var(--s-surface-overlay-default);text-align:center;box-shadow:var(--s-shadow-level-3)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.dialog__body{width:25rem;border-radius:var(--s-border-radius-base)}}@media (min-width: 992px){.dialog__body{text-align:start}}.dialog__heading{margin:0;margin-bottom:var(--s-space-8);padding-right:var(--s-space-8);padding-left:var(--s-space-8);font-size:var(--s-font-size-lg);font-weight:var(--s-font-weight-semibold);line-height:var(--s-line-height-lg)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.dialog__heading{line-height:var(--s-line-height-base)}}.dialog__content{margin-bottom:var(--s-space-20);padding-right:var(--s-space-8);padding-left:var(--s-space-8);line-height:var(--s-line-height-base)}.dialog__content ::slotted(*){margin:0}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.dialog__content{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}@media (min-width: 992px){.dialog__content{margin-bottom:var(--s-space-24)}}.dialog__controls{display:flex;flex-wrap:wrap;justify-content:stretch;gap:var(--s-space-8)}.dialog__controls>*{flex-grow:1}@media (min-width: 992px){.dialog__controls>*{flex-grow:0}}@media (min-width: 992px){.dialog__controls{flex-wrap:nowrap;justify-content:flex-end}}.dialog__left_controls{display:flex;align-items:center;flex-grow:1;padding-left:var(--s-space-8);width:100%;min-width:0}@media (min-width: 992px){.dialog__left_controls{width:auto}}@keyframes dialog-scale-in{from{transform:scale(0)}to{transform:scale(1)}}@keyframes dialog-backdrop-fade-in{from{opacity:0}to{opacity:1}}@keyframes dialog-fade-out{from{opacity:1}to{opacity:0}}";export{n as swirl_dialog}
+import{r as i,c as a,h as o,H as t,d as e}from"./p-Dj_4Fda9.js";import{c as s}from"./p-orsBiyT_.js";import{t as d}from"./p-DBTxpXCn.js";const n=class{constructor(o){i(this,o),this.dialogClose=a(this,"dialogClose",7),this.dialogOpen=a(this,"dialogOpen",7),this.primaryAction=a(this,"primaryAction",7),this.secondaryAction=a(this,"secondaryAction",7),this.toggleDialog=a(this,"toggleDialog",7),this.intent="primary",this.closing=!1,this.opening=!1,this.onClose=()=>{this.closing=!1,this.dialogClose.emit()},this.onToggle=i=>{this.toggleDialog.emit({newState:i.newState,dialog:this.dialogEl})},this.onKeyDown=i=>{"Escape"===i.code&&(i.stopImmediatePropagation(),i.preventDefault(),this.close())},this.onBackdropClick=()=>{this.close()},this.onPrimaryAction=i=>{this.primaryAction.emit(i),this.close()},this.onSecondaryAction=i=>{this.secondaryAction.emit(i),this.close()}}componentDidLoad(){this.ensureOpening(),this.setDialogCustomProps()}disconnectedCallback(){this.dialogEl?.open&&this.dialogEl.close()}ensureOpening(){this.opening&&!this.dialogEl?.open&&this.open()}setDialogCustomProps(){this.dialogEl.setAttribute("closedby","none")}async open(i){this.opening=!0,this.temporaryReturnFocusTo=i,this.dialogEl&&(this.dialogEl.showModal(),this.dialogOpen.emit())}async close(){this.closing||(this.closing=!0,setTimeout((()=>{this.dialogEl.close(),this.customFocusReturn()}),150))}customFocusReturn(){const i=this.temporaryReturnFocusTo??this.returnFocusTo;if(!i)return;const a="string"==typeof i?document.querySelector(i):i,o=d(a,{includeContainer:!0,getShadowRoot:!0});o.length>0&&o[0].focus(),this.temporaryReturnFocusTo=void 0}render(){const i=s("dialog",{"dialog--closing":this.closing}),a=Boolean(this.el.querySelector('[slot="left-controls"]'));return o(t,{key:"877320d3ccc13ee8c4cef6fabd6db827645337ff"},o("dialog",{key:"db36f0e390d1e1593dff372cce290e53a9574fd9","aria-describedby":"content","aria-labelledby":this.hideLabel?void 0:"label","aria-label":this.hideLabel?this.label:void 0,class:i,onClose:this.onClose,onKeyDown:this.onKeyDown,onToggle:this.onToggle,role:"alertdialog",ref:i=>this.dialogEl=i},o("div",{key:"be03c2bb83506aeb3df08335a25795033e6ddd7a",class:"dialog__backdrop",onClick:this.onBackdropClick}),o("div",{key:"da39ef70b86e76cd0d48ca83a3e92b4b957067b3",class:"dialog__body",part:"dialog__body",role:"document"},!this.hideLabel&&o("h2",{key:"5705ab0984f1cbdc0b7740648f1c78a270212f7d",class:"dialog__heading",part:"dialog__heading",id:"label"},this.label),o("div",{key:"8b5278de16d40a25eb0427ba0d1af851b4a2f075",class:"dialog__content",part:"dialog__content",id:"content"},o("slot",{key:"932e8cfc88ffcc6c2d154d25e824d6416db875ed"})),o("div",{key:"c4e98c3e727108344e51db4a6d4ea6d3bcc901c8",class:"dialog__controls"},a&&o("div",{key:"c1a106b74a2caa5d4e590b40d91a6869bf8774e3",class:"dialog__left_controls"},o("slot",{key:"298cf1ba398a58df9b310358388d3646e4601f41",name:"left-controls"})),this.secondaryActionLabel&&o("swirl-button",{key:"b40eb78e6f186610ee58c277a684c69fd952889b",label:this.secondaryActionLabel,onClick:this.onSecondaryAction}),this.primaryActionLabel&&o("swirl-button",{key:"df4422f6a81d33cf7abb3f304558181a27f8aa2a",intent:this.intent,label:this.primaryActionLabel,onClick:this.onPrimaryAction,variant:"flat"})))))}get el(){return e(this)}};n.style=":host{display:block}:host *{box-sizing:border-box}.dialog{--swirl-ghost-button-background-default:var(--s-surface-overlay-default);--swirl-ghost-button-background-hovered:var(--s-surface-overlay-hovered);--swirl-ghost-button-background-pressed:var(--s-surface-overlay-pressed);position:fixed;z-index:var(--s-z-40);display:flex;justify-content:center;align-items:center;inset:0;border:none;padding:0;width:auto;background:transparent;max-width:none;max-height:none;overflow:visible}.dialog::backdrop{display:none}.dialog:not([open]){display:none}.dialog:not(.dialog--closing) .dialog__backdrop{animation:0.15s dialog-backdrop-fade-in}@media (prefers-reduced-motion){.dialog:not(.dialog--closing) .dialog__backdrop{animation:none}}.dialog:not(.dialog--closing) .dialog__body{animation:0.15s dialog-scale-in}@media (prefers-reduced-motion){.dialog:not(.dialog--closing) .dialog__body{animation:none}}.dialog--closing{animation:0.15s dialog-fade-out;animation-fill-mode:forwards}@media (prefers-reduced-motion){.dialog--closing{animation:none}}.dialog__backdrop{position:fixed;background-color:rgba(0, 0, 0, 0.2);inset:0}.dialog__body{z-index:var(--s-z-40);overflow-x:hidden;overflow-y:auto;width:18.5rem;max-height:90vh;padding-top:var(--s-space-24);padding-right:var(--s-space-16);padding-bottom:var(--s-space-16);padding-left:var(--s-space-16);border-radius:var(--s-border-radius-l);background-color:var(--s-surface-overlay-default);text-align:center;box-shadow:var(--s-shadow-level-3)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.dialog__body{width:25rem;border-radius:var(--s-border-radius-base)}}@media (min-width: 992px){.dialog__body{text-align:start}}.dialog__heading{margin:0;margin-bottom:var(--s-space-8);padding-right:var(--s-space-8);padding-left:var(--s-space-8);font-size:var(--s-font-size-lg);font-weight:var(--s-font-weight-semibold);line-height:var(--s-line-height-lg)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.dialog__heading{line-height:var(--s-line-height-base)}}.dialog__content{margin-bottom:var(--s-space-20);padding-right:var(--s-space-8);padding-left:var(--s-space-8);line-height:var(--s-line-height-base)}.dialog__content ::slotted(*){margin:0}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.dialog__content{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}@media (min-width: 992px){.dialog__content{margin-bottom:var(--s-space-24)}}.dialog__controls{display:flex;flex-wrap:wrap;justify-content:stretch;gap:var(--s-space-8)}.dialog__controls>*{flex-grow:1}@media (min-width: 992px){.dialog__controls>*{flex-grow:0}}@media (min-width: 992px){.dialog__controls{flex-wrap:nowrap;justify-content:flex-end}}.dialog__left_controls{display:flex;align-items:center;flex-grow:1;padding-left:var(--s-space-8);width:100%;min-width:0}@media (min-width: 992px){.dialog__left_controls{width:auto}}@keyframes dialog-scale-in{from{transform:scale(0)}to{transform:scale(1)}}@keyframes dialog-backdrop-fade-in{from{opacity:0}to{opacity:1}}@keyframes dialog-fade-out{from{opacity:1}to{opacity:0}}";export{n as swirl_dialog}

package/dist/swirl-components/{p-f6e7c45b.entry.js → p-b321139a.entry.js}

@@ -1 +1 @@
-import{r as a,c as e,h as o,H as d,d as t}from"./p-Dj_4Fda9.js";import{d as s,e as i}from"./p-B0kNlhKL.js";import{c as r}from"./p-orsBiyT_.js";import{t as l}from"./p-DBTxpXCn.js";const n=class{constructor(o){a(this,o),this.toggleFullscreen=e(this,"toggleFullscreen",3),this.modalClose=e(this,"modalClose",3),this.modalOpen=e(this,"modalOpen",3),this.primaryAction=e(this,"primaryAction",3),this.requestModalClose=e(this,"requestModalClose",3),this.secondaryAction=e(this,"secondaryAction",3),this.sidebarClose=e(this,"sidebarClose",3),this.toggleDialog=e(this,"toggleDialog",7),this.closable=!0,this.closeButtonLabel="Close modal",this.fullscreenEnableButtonLabel="Full screen",this.fullscreenDisableButtonLabel="Exit full screen",this.padded=!0,this.variant="default",this.sidebarPadded=!0,this.sidebarFooterPadded=!0,this.sidebarCloseButtonLabel="Close sidebar",this.opening=!1,this.isFullscreen=!1,this.isFullscreenTransitioning=!1,this.closing=!1,this.scrollable=!1,this.scrolled=!1,this.scrolledDown=!1,this.sidebarScrolled=!1,this.sidebarScrolledDown=!1,this.sidebarScrollable=!1,this.onKeyDown=a=>{"Escape"===a.code&&(a.stopImmediatePropagation(),a.preventDefault(),this.close())},this.onClose=()=>{this.closing=!1,this.unlockBodyScroll(),this.modalClose.emit()},this.onToggle=a=>{this.toggleDialog.emit({newState:a.newState,dialog:this.modalEl})},this.onBackdropClick=()=>{this.close()},this.onCloseButtonClick=()=>{this.close()},this.onFullscreenButtonClick=()=>{this.setFullscreen(!this.isFullscreen)},this.onSidebarCloseButtonClick=()=>{this.hideSidebarContent=!0,this.sidebarClose.emit()},this.onPrimaryAction=a=>{this.primaryAction.emit(a)},this.onSecondaryAction=a=>{this.secondaryAction.emit(a)},this.determineScrollStatus=()=>{this.determineMainScrollStatus(),this.determineSidebarScrollStatus()},this.determineMainScrollStatus=()=>{const a=this.scrollContainer?.scrollTop>0,e=Math.ceil(this.scrollContainer?.scrollTop+this.scrollContainer?.offsetHeight)>=this.scrollContainer?.scrollHeight,o=this.scrollContainer?.scrollHeight>this.scrollContainer?.offsetHeight;a!==this.scrolled&&(this.scrolled=a),e!==this.scrolledDown&&(this.scrolledDown=e),o!==this.scrollable&&(this.scrollable=o)},this.determineSidebarScrollStatus=()=>{const a=this.sidebarScrollContainer?.scrollTop>0,e=Math.ceil(this.sidebarScrollContainer?.scrollTop+this.sidebarScrollContainer?.offsetHeight)>=this.sidebarScrollContainer?.scrollHeight,o=this.sidebarScrollContainer?.scrollHeight>this.sidebarScrollContainer?.offsetHeight;a!==this.sidebarScrolled&&(this.sidebarScrolled=a),e!==this.sidebarScrolledDown&&(this.sidebarScrolledDown=e),o!==this.sidebarScrollable&&(this.sidebarScrollable=o)}}componentDidLoad(){this.ensureOpening(),this.setDialogCustomProps(),this.determineScrollStatus(),this.updateCustomFooterStatus(),this.updateCustomHeaderStatus(),this.updateHeaderToolsStatus(),this.updateSecondaryContentStatus(),this.updateSidebarContentStatus(),this.updateSidebarFooterStatus()}disconnectedCallback(){this.mutationObserver?.disconnect(),this.modalEl?.open&&this.modalEl.close(),this.unlockBodyScroll()}onWindowResize(){this.determineScrollStatus()}async open(){this.opening=!0,this.modalEl&&(this.setupMutationObserver(),this.modalEl.showModal(),this.modalOpen.emit(),this.mutationObserver.observe(this.modalEl,{subtree:!0,childList:!0}),this.lockBodyScroll(),this.determineScrollStatus(),setTimeout((()=>{this.handleAutoFocus()}),200))}async close(a){this.closing||(a||this.requestModalClose.emit(),(this.closable||a)&&(this.closing=!0,this.unlockBodyScroll(),setTimeout((()=>{this.mutationObserver?.disconnect(),this.modalEl.close(),this.returnFocusTo&&this.customFocusReturn()}),150)))}async setFullscreen(a){this.isFullscreen!==a&&(this.isFullscreenTransitioning=!0,this.isFullscreen=a,this.toggleFullscreen.emit(this.isFullscreen),setTimeout((()=>this.isFullscreenTransitioning=!1),150))}async getScrollContainer(){return this.scrollContainer}updateCustomFooterStatus(){this.hasCustomFooter=Boolean(this.el.querySelector(':scope > [slot="custom-footer"]'))}updateCustomHeaderStatus(){this.hasCustomHeader=Boolean(this.el.querySelector(':scope > [slot="custom-header"]'))}updateHeaderToolsStatus(){this.hasHeaderTools=Boolean(this.el.querySelector(':scope > [slot="header-tools"]'))}updateSecondaryContentStatus(){this.hasSecondaryContent=Boolean(this.el.querySelector(':scope > [slot="secondary-content"]'))}updateSidebarContentStatus(){this.hasSidebarContent=Boolean(this.el.querySelector(':scope > [slot="sidebar-content"]'))}updateSidebarFooterStatus(){this.hasSidebarFooter=Boolean(this.el.querySelector(':scope > [slot="sidebar-footer"]'))}handleAutoFocus(){this.el.querySelector("input[autofocus]")?.focus()}lockBodyScroll(){s(this.scrollContainer),s(this.sidebarScrollContainer)}setupMutationObserver(){this.mutationObserver=new MutationObserver((()=>{this.modalEl?.open&&document.activeElement===document.body&&l(this.modalEl).at(0)?.focus()}))}unlockBodyScroll(){this.scrollContainer&&i(this.scrollContainer),this.sidebarScrollContainer&&i(this.sidebarScrollContainer)}ensureOpening(){this.opening&&!this.modalEl?.open&&this.open()}setDialogCustomProps(){this.modalEl.setAttribute("closedby","none")}customFocusReturn(){const a="string"==typeof this.returnFocusTo?document.querySelector(this.returnFocusTo):this.returnFocusTo,e=l(a,{includeContainer:!0,getShadowRoot:!0});e.length>0&&e[0].focus()}render(){const a=Boolean(this.primaryActionLabel)||Boolean(this.secondaryActionLabel),e=r("modal",`modal--variant-${this.variant}`,{"modal--closing":this.closing,"modal--fullscreen":this.isFullscreen,"modal--fullscreen-transitioning":this.isFullscreenTransitioning,"modal--has-custom-footer":this.hasCustomFooter,"modal--has-custom-header":this.hasCustomHeader,"modal--has-header-tools":this.hasHeaderTools,"modal--has-secondary-content":this.hasSecondaryContent&&!this.hideSecondaryContent,"modal--hide-label":this.hideLabel,"modal--padded":this.padded,"modal--scrollable":this.scrollable,"modal--scrolled":this.scrolled,"modal--hide-scrolled-header-border":this.hideScrolledHeaderBorder,"modal--scrolled-down":this.scrolledDown,"modal--hide-secondary-content-borders":this.hideSecondaryContentBorders,"modal--has-sidebar-content":this.hasSidebarContent&&!this.hideSidebarContent,"modal--sidebar-padded":this.sidebarPadded,"modal--has-sidebar-footer":this.hasSidebarFooter&&this.hasSidebarContent&&!this.hideSidebarContent,"modal--sidebar-footer-padded":this.sidebarFooterPadded,"modal--sidebar-scrolled":this.sidebarScrolled,"modal--sidebar-scrolled-down":this.sidebarScrolledDown,"modal--sidebar-scrollable":this.sidebarScrollable});return o(d,{key:"c53283aad7f87ad05cc74bf68d39e33e57665cea"},o("dialog",{key:"f3e9a0b61a94b0b1d574265536a39d8bbe3aeaa1","aria-label":this.label,class:e,onClose:this.onClose,onKeyDown:this.onKeyDown,onToggle:this.onToggle,ref:a=>this.modalEl=a},o("div",{key:"75bf8d418a4d77ffc37e42fb891047b39f99b6ab",class:"modal__backdrop",onClick:this.onBackdropClick}),o("div",{key:"f5bcf112f23d9fb77bb2cba66a6203d5b9951a33",class:"modal__body",part:"modal__body",style:this.isFullscreen?{}:{"--swirl-modal-max-height":this.maxHeight,"--swirl-modal-height":this.height,minHeight:this.minHeight,maxWidth:this.maxWidth}},o("aside",{key:"382e8b1e9592b3a9752bb1ef2fc0f1b556cd2d7c",class:"modal__sidebar"},this.sidebarLabel&&o("header",{key:"41cf73ab5aaca279a88eb6532f2144242f78ea47",class:r("modal__sidebar-header",{"modal__sidebar-header--has-close-button":this.hasSidebarCloseButton})},this.hasSidebarCloseButton&&o("swirl-button",{key:"9ead40c49960b2d69feca469bbc91ea91b4ab3d1",hideLabel:!0,icon:"<swirl-icon-double-arrow-right></swirl-icon-double-arrow-right>",label:this.sidebarCloseButtonLabel,onClick:this.onSidebarCloseButtonClick}),o("swirl-heading",{key:"487f65c82081100e09be212f2e400900ac6c8bfc",as:"h3",class:"modal__sidebar-heading",level:5,text:this.sidebarLabel})),o("div",{key:"147a03cbb62653955ad302b782774812cc9f9068",class:"modal__sidebar-content",onScroll:this.determineSidebarScrollStatus,ref:a=>this.sidebarScrollContainer=a},o("slot",{key:"ecde4d85fc8ab0ae0b9e0559ba8a779ab41a5d3a",name:"sidebar-content"})),o("div",{key:"5c0aeac2179557eea8953cc8809fa3cdeec58f7a",class:"modal__sidebar-footer",part:"modal__sidebar-footer"},o("slot",{key:"0149eae26b53fdc7727e8fe355d39ef1aa6d2313",name:"sidebar-footer"}))),o("div",{key:"9c5b37271a1e158f8a45fe79705034a48fb565ed",class:"modal__main-content"},o("header",{key:"9ac62c6974e74c144c3c8ca80b530d73912b0137",class:"modal__custom-header",part:"modal__custom-header"},o("slot",{key:"55c475bfa35b12376efac0b67f26a0c3b31a20af",name:"custom-header"})),(!this.hideLabel||!this.hideCloseButton)&&o("header",{key:"54b61a7b591f367d8a3c916021e7159e0eeed068",class:"modal__header"},o("div",{key:"159e1b20bd85579ed7fdfe1e1459edca776bf6b6",class:"modal__header-bar"},!this.hideCloseButton&&o("swirl-button",{key:"473b559c8b3629a1071ca687a0f1ee52dc7d15d3",class:"modal__close-button",hideLabel:!0,icon:"default"===this.variant?"<swirl-icon-close></swirl-icon-close>":"<swirl-icon-double-arrow-right></swirl-icon-double-arrow-right>",label:this.closeButtonLabel,onClick:this.onCloseButtonClick}),this.showFullscreenButton&&o("swirl-button",{key:"fd40a806fceca676a41b2253f82e18e960da806f",class:"modal__fullscreen-button",hideLabel:!0,icon:this.isFullscreen?"<swirl-icon-close-fullscreen></swirl-icon-close-fullscreen>":"<swirl-icon-open-in-full></swirl-icon-open-in-full>",label:this.isFullscreen?this.fullscreenDisableButtonLabel:this.fullscreenEnableButtonLabel,onClick:this.onFullscreenButtonClick}),!this.hideLabel&&o("swirl-heading",{key:"3d54e1b6df57be9faafc96e0aba51e1f7cc5493f",as:"h2",class:"modal__heading",level:3,text:this.label}))),o("div",{key:"460cff9a5b1d6c5775a39534678af201909b3388",class:"modal__content-container",style:{gap:this.contentGap?`var(--s-space-${this.contentGap})`:void 0}},o("div",{key:"2c314687bf9553212f41be41d7ba40092cf4adbf",class:"modal__primary-content",style:{maxWidth:this.primaryContentMaxWidth,flex:this.primaryContentFlex}},o("div",{key:"d791af57ae248b9ad5e0872bcb193fefd1fef44b",class:"modal__header-tools",part:"modal__header-tools"},o("slot",{key:"8e5b801755e617dbae380c86d9b9a6c72203f915",name:"header-tools"})),o("div",{key:"460a2c618a871d1fed8927a676c0cef86607939f",class:"modal__content",onScroll:this.determineMainScrollStatus,part:"modal__content",ref:a=>this.scrollContainer=a},o("slot",{key:"91b8d1223e10c107392c4a6913d3483ccbe3c689"}))),o("div",{key:"8d7757d3ad4921e649e47e4052dc30c069bbb082",class:"modal__secondary-content",style:{maxWidth:this.secondaryContentMaxWidth,flex:this.secondaryContentFlex,padding:Boolean(this.secondaryContentPadding)?`var(--s-space-${this.secondaryContentPadding})`:void 0,paddingBlockEnd:Boolean(this.secondaryContentPaddingBlockEnd)?`var(--s-space-${this.secondaryContentPaddingBlockEnd})`:void 0,paddingBlockStart:Boolean(this.secondaryContentPaddingBlockStart)?`var(--s-space-${this.secondaryContentPaddingBlockStart})`:void 0,paddingInlineEnd:Boolean(this.secondaryContentPaddingInlineEnd)?`var(--s-space-${this.secondaryContentPaddingInlineEnd})`:void 0,paddingInlineStart:Boolean(this.secondaryContentPaddingInlineStart)?`var(--s-space-${this.secondaryContentPaddingInlineStart})`:void 0}},o("slot",{key:"0fee540e1ffcd87a4efd66394b9506073720d4f9",name:"secondary-content"}))),o("div",{key:"e3d7e34eeb3a852801494b01590605736359ff93",class:"modal__custom-footer"},o("slot",{key:"f9152641cfe89640ded1ca29eecb6672b0c1db5a",name:"custom-footer"})),a&&o("footer",{key:"794fdc1f5f62174bb7e8dd22ebd2cf66263e78e4",class:"modal__controls"},o("swirl-button-group",{key:"eb5b75263ab691ea70dca2608ee4e3bae836dbe4",wrap:!0},this.secondaryActionLabel&&o("swirl-button",{key:"bd4f677b1b4fc4cd26a2d1bf4bdb3e2f54c43159",label:this.secondaryActionLabel,onClick:this.onSecondaryAction}),this.primaryActionLabel&&o("swirl-button",{key:"6228911c5e114668d9a4dce63aff4c3931cfdb8a",intent:"primary",label:this.primaryActionLabel,onClick:this.onPrimaryAction,variant:"flat"})))))))}get el(){return t(this)}};n.style=":host{display:block}:host *{box-sizing:border-box}.modal{--swirl-ghost-button-background-default:var(--s-surface-overlay-default);--swirl-ghost-button-background-hovered:var(--s-surface-overlay-hovered);--swirl-ghost-button-background-pressed:var(--s-surface-overlay-pressed);--swirl-resource-list-item-background-default:var(\n    --s-surface-overlay-default\n  );--swirl-resource-list-item-background-hovered:var(\n    --s-surface-overlay-hovered\n  );--swirl-resource-list-item-background-pressed:var(\n    --s-surface-overlay-pressed\n  );--swirl-modal-height:auto;--swirl-modal-max-height:90vh;--swirl-modal-view-height:100vh;--swirl-modal-header-height:3.75rem;--swirl-modal-max-width:40rem;--swirl-modal-sidebar-width:25rem;--swirl-modal-max-secondary-content-width:24rem;--swirl-modal-footer-padding-small:var(--s-space-12) var(--s-space-16)\n    var(--s-space-12) var(--s-space-16);--swirl-modal-footer-padding-large:var(--s-space-16) var(--s-space-24)\n    var(--s-space-16) var(--s-space-24)}@supports (height: 100dvh){.modal{--swirl-modal-max-height:90dvh;--swirl-modal-view-height:100dvh}}.modal{position:fixed;z-index:var(--s-z-40);display:flex;justify-content:center;align-items:center;height:var(--swirl-modal-view-height);inset:0;border:none;padding:0;width:auto;background:transparent;max-width:none;max-height:none;overflow:visible}.modal::backdrop{display:none}.modal:not([open]){display:none}.modal--variant-default.modal--closing{animation:0.15s modal-fade-out;animation-fill-mode:forwards}@media (prefers-reduced-motion){.modal--variant-default.modal--closing{animation:none}}.modal--variant-default:not(.modal--closing) .modal__backdrop{animation:0.15s modal-backdrop-fade-in}@media (prefers-reduced-motion){.modal--variant-default:not(.modal--closing) .modal__backdrop{animation:none}}.modal--variant-default:not(.modal--closing) .modal__body{animation:0.15s modal-scale-in}@media (prefers-reduced-motion){.modal--variant-default:not(.modal--closing) .modal__body{animation:none}}.modal--variant-drawer{justify-content:end;align-items:stretch}.modal--variant-drawer.modal--closing{animation:0.15s modal-drawer-slide-out;animation-fill-mode:forwards}@media (prefers-reduced-motion){.modal--variant-drawer.modal--closing{animation:none}}@media (min-width: 768px){.modal--variant-drawer.modal--hide-label .modal__header-bar{height:auto;padding-top:var(--s-space-4);padding-bottom:var(--s-space-4)}}.modal--variant-drawer .modal__backdrop{background-color:transparent;animation:none}.modal--variant-drawer .modal__body{height:100%;max-height:none;border-radius:0;animation:0.15s modal-drawer-slide-in;box-shadow:var(--s-shadow-level-3)}@media (prefers-reduced-motion){.modal--variant-drawer .modal__body{animation:none}}.modal--variant-drawer .modal__header-bar{background-color:var(--s-surface-overlay-default)}.modal--variant-drawer .modal__header-bar .modal__close-button{margin-left:calc(-1 * var(--s-space-8))}.modal--variant-drawer .modal__header-bar .modal__fullscreen-button{display:none}@media (min-width: 768px){.modal--variant-drawer .modal__header-bar{flex-direction:row}}@media (min-width: 768px){.modal--variant-drawer.modal--padded .modal__content{padding-top:var(--s-space-8)}}.modal--padded .modal__content{padding-top:var(--s-space-24);padding-right:var(--s-space-16);padding-bottom:var(--s-space-24);padding-left:var(--s-space-16)}@media (min-width: 768px){.modal--padded .modal__content{padding-top:0;padding-right:var(--s-space-24);padding-bottom:var(--s-space-16);padding-left:var(--s-space-24)}}@media (min-width: 768px){.modal--scrollable .modal__content{padding-bottom:0}}.modal--scrollable:not(.modal--scrolled-down).modal--has-custom-footer .modal__custom-footer{border-top:var(--s-border-width-default) solid var(--s-border-default)}.modal--scrollable:not(.modal--scrolled-down):not(.modal--has-custom-footer) .modal__controls{border-top:var(--s-border-width-default) solid var(--s-border-default)}.modal--has-custom-header .modal__custom-header{display:block}.modal--has-custom-header .modal__content{padding-top:var(--s-space-16)}.modal--has-custom-footer .modal__custom-footer{padding:var(--swirl-modal-footer-padding-small)}@media (min-width: 768px){.modal--has-custom-footer .modal__custom-footer{padding:var(--swirl-modal-footer-padding-large)}}.modal--has-header-tools .modal__header{border-bottom-color:transparent}.modal--has-header-tools .modal__header-tools{display:block}.modal--has-secondary-content.modal.modal--variant-default:not(.modal--fullscreen) .modal__body,.modal--has-secondary-content.modal.modal--variant-drawer:not(.modal--fullscreen) .modal__body{max-width:calc(\n      var(--swirl-modal-max-width) +\n        var(--swirl-modal-max-secondary-content-width)\n    )}.modal--has-secondary-content:not(.modal--has-header-tools):not(.modal--hide-secondary-content-borders) .modal__header{border-bottom-color:var(--s-border-default)}.modal--has-secondary-content.modal--has-header-tools:not(.modal--hide-secondary-content-borders) .modal__header-tools{border-bottom-color:var(--s-border-default)}.modal--has-secondary-content.modal--has-custom-footer:not(.modal--hide-secondary-content-borders) .modal__custom-footer{border-top:var(--s-border-width-default) solid var(--s-border-default)}.modal--has-secondary-content:not(.modal--has-custom-footer):not(.modal--hide-secondary-content-borders) .modal__controls{border-top:var(--s-border-width-default) solid var(--s-border-default)}@media (min-width: 992px){.modal--has-secondary-content .modal__header-tools,.modal--has-secondary-content .modal__content{padding-right:0}}.modal--has-secondary-content .modal__primary-content{overflow:visible;max-height:60%;flex-basis:auto}@media (min-width: 992px){.modal--has-secondary-content .modal__primary-content{max-width:calc(100% - var(--swirl-modal-max-secondary-content-width));max-height:none;flex-basis:calc(100% - var(--swirl-modal-max-secondary-content-width))}}.modal--has-secondary-content .modal__secondary-content{display:block}.modal__main-content{display:flex;flex-direction:column;overflow-y:auto;flex-grow:1}.modal__sidebar{display:none}.modal.modal--has-sidebar-content.modal.modal--variant-default:not(.modal--fullscreen) .modal__body,.modal.modal--has-sidebar-content.modal.modal--variant-drawer:not(.modal--fullscreen) .modal__body{max-width:calc(\n      var(--swirl-modal-max-width) + var(--swirl-modal-sidebar-width)\n    )}@media (min-width: 768px){.modal.modal--has-sidebar-content .modal__sidebar{display:flex;flex-direction:column;overflow-y:auto;flex-shrink:0;width:var(--swirl-modal-sidebar-width);border-right:var(--s-border-width-default) solid var(--s-border-default)}.modal.modal--has-sidebar-content .modal__sidebar .modal__sidebar-header{border-bottom:var(--s-border-width-default) solid transparent;display:flex;align-items:center;gap:var(--s-space-8);padding-right:var(--s-space-24);padding-left:var(--s-space-24)}.modal.modal--has-sidebar-content .modal__sidebar .modal__sidebar-header.modal__sidebar-header--has-close-button{padding-left:var(--s-space-16)}.modal.modal--has-sidebar-content .modal__sidebar .modal__sidebar-header .modal__sidebar-heading{display:flex;align-items:center;height:var(--swirl-modal-header-height)}.modal.modal--has-sidebar-content .modal__sidebar .modal__sidebar-content{display:block;flex-grow:1;overflow-y:auto}}@media (min-width: 992px){.modal.modal--has-sidebar-content .modal__primary-content{flex-basis:calc(100% - 20rem)}}.modal--sidebar-padded .modal__sidebar .modal__sidebar-content{padding-left:var(--s-space-24);padding-right:var(--s-space-24);padding-bottom:var(--s-space-16);padding-top:var(--s-space-16)}@media (min-width: 768px){.modal--scrolled:not(.modal--hide-scrolled-header-border):not(.modal--has-header-tools) .modal__header{border-bottom-color:var(--s-border-default)}.modal--scrolled:not(.modal--hide-scrolled-header-border).modal--has-header-tools .modal__header-tools{border-bottom-color:var(--s-border-default)}.modal--scrolled:not(.modal--hide-scrolled-header-border) .modal__custom-header{border-bottom-color:var(--s-border-default)}}@media (min-width: 768px){.modal--sidebar-scrolled .modal__sidebar .modal__sidebar-header{border-bottom-color:var(--s-border-default)}}.modal--has-sidebar-footer.modal--sidebar-footer-padded .modal__sidebar-footer{padding:var(--swirl-modal-footer-padding-small)}@media (min-width: 768px){.modal--has-sidebar-footer.modal--sidebar-footer-padded .modal__sidebar-footer{padding:var(--swirl-modal-footer-padding-large)}}@media (min-width: 768px){.modal--sidebar-scrollable .modal__sidebar-content{padding-bottom:0 !important}}.modal--sidebar-scrollable:not(.modal--sidebar-scrolled-down).modal--has-sidebar-footer .modal__sidebar-footer{border-top:var(--s-border-width-default) solid var(--s-border-default)}.modal__backdrop{position:fixed;background-color:rgba(0, 0, 0, 0.2);inset:0}.modal__body{--swirl-card-background-default:var(--s-surface-overlay-default);--swirl-card-background-hovered:var(--s-surface-overlay-hovered);--swirl-card-background-pressed:var(--s-surface-overlay-pressed);--swirl-accordion-item-toggle-default:var(--s-surface-overlay-default);--swirl-accordion-item-toggle-hovered:var(--s-surface-overlay-hovered);--swirl-accordion-item-toggle-pressed:var(--s-surface-overlay-pressed);position:relative;z-index:var(--s-z-40);display:flex;flex-direction:row;overflow:hidden;width:100vw;max-width:100vw;height:var(--swirl-modal-view-height);max-height:var(--swirl-modal-view-height);background-color:var(--s-surface-overlay-default)}.modal--fullscreen .modal__body{min-height:var(--swirl-modal-view-height)}.modal--fullscreen-transitioning .modal__body{transition:width 0.15s ease-out, max-width 0.15s ease-out,\n    max-height 0.15s ease-out, min-height 0.15s ease-out}@media (min-width: 768px){.modal.modal--variant-default:not(.modal--fullscreen) .modal__body{width:90vw;max-width:var(--swirl-modal-max-width);max-height:var(--swirl-modal-max-height);min-height:0;border-radius:var(--s-border-radius-base);box-shadow:var(--s-shadow-level-3)}}@media (min-width: 992px){.modal.modal--variant-default:not(.modal--fullscreen) .modal__body{height:var(--swirl-modal-height)}}.modal__header{border-bottom:var(--s-border-width-default) solid var(--s-border-default)}@media (min-width: 768px){.modal__header{border-bottom:var(--s-border-width-default) solid transparent}}.modal__header-bar{display:flex;height:3.5rem;padding-top:var(--s-space-8);padding-right:var(--s-space-16);padding-bottom:var(--s-space-8);padding-left:var(--s-space-16);flex-shrink:0;align-items:center;gap:var(--s-space-8)}@media (min-width: 768px){.modal__header-bar{height:var(--swirl-modal-header-height);padding-top:var(--s-space-12);padding-right:var(--s-space-24);padding-bottom:var(--s-space-12);padding-left:var(--s-space-24);flex-direction:row-reverse}}.modal__fullscreen-button{display:none}@media (min-width: 768px){.modal__fullscreen-button{display:block}}.modal__header-tools{display:none;padding-right:var(--s-space-16);padding-left:var(--s-space-16);border-bottom:var(--s-border-width-default) solid var(--s-border-default)}@media (min-width: 768px){.modal__header-tools{padding-right:var(--s-space-24);padding-left:var(--s-space-24);border-bottom-color:transparent}}.modal__custom-header{display:none;flex-shrink:0;border-bottom:var(--s-border-width-default) solid var(--s-border-default)}@media (min-width: 768px){.modal__custom-header{border-bottom-color:transparent}}.modal__heading{overflow:hidden}.modal__heading .heading{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.modal__content-container{display:flex;overflow:hidden;flex-grow:1;flex-direction:column;gap:var(--s-space-24)}@media (min-width: 992px){.modal__content-container{flex-direction:row}}.modal__primary-content{display:flex;overflow:hidden;overflow-y:auto;min-width:0;flex-basis:100%;flex-grow:1;flex-direction:column}.modal__content{overflow-x:hidden;overflow-y:auto;height:100%}.modal__content ::slotted(*){margin:0}.modal__secondary-content{display:none;overflow:visible;overflow-x:hidden;overflow-y:auto;min-width:0;max-width:none;max-height:40%;padding-right:var(--s-space-16);padding-left:var(--s-space-16)}@media (min-width: 768px){.modal__secondary-content{padding-left:var(--s-space-24)}}@media (min-width: 992px){.modal__secondary-content{overflow-x:hidden;overflow-y:auto;max-width:var(--swirl-modal-max-secondary-content-width);max-height:none;padding-right:var(--s-space-24);padding-bottom:var(--s-space-16);padding-left:0;flex-basis:50%;flex-grow:1}}.modal__custom-footer{flex-shrink:0}.modal__controls{display:flex;padding:var(--swirl-modal-footer-padding-small);flex-shrink:0;justify-content:flex-end}@media (min-width: 768px){.modal__controls{padding:var(--swirl-modal-footer-padding-large)}}.modal--has-secondary-content.modal--has-sidebar-content:not(.modal--fullscreen) .modal__body{max-width:calc(\n      var(--swirl-modal-max-width) + var(--swirl-modal-sidebar-width) +\n        var(--swirl-modal-max-secondary-content-width)\n    )}@keyframes modal-scale-in{from{transform:scale(0)}to{transform:scale(1)}}@keyframes modal-backdrop-fade-in{from{opacity:0}to{opacity:1}}@keyframes modal-fade-out{from{opacity:1}to{opacity:0}}@keyframes modal-drawer-slide-in{from{transform:translate3d(100%, 0, 0)}to{transform:translate3d(0, 0, 0)}}@keyframes modal-drawer-slide-out{from{transform:translate3d(0, 0, 0)}to{transform:translate3d(100%, 0, 0)}}";export{n as swirl_modal}
+import{r as a,c as o,h as e,H as d,d as t}from"./p-Dj_4Fda9.js";import{d as s,e as i}from"./p-B0kNlhKL.js";import{c as r}from"./p-orsBiyT_.js";import{t as l}from"./p-DBTxpXCn.js";const n=class{constructor(e){a(this,e),this.toggleFullscreen=o(this,"toggleFullscreen",3),this.modalClose=o(this,"modalClose",3),this.modalOpen=o(this,"modalOpen",3),this.primaryAction=o(this,"primaryAction",3),this.requestModalClose=o(this,"requestModalClose",3),this.secondaryAction=o(this,"secondaryAction",3),this.sidebarClose=o(this,"sidebarClose",3),this.toggleDialog=o(this,"toggleDialog",7),this.closable=!0,this.closeButtonLabel="Close modal",this.fullscreenEnableButtonLabel="Full screen",this.fullscreenDisableButtonLabel="Exit full screen",this.padded=!0,this.variant="default",this.sidebarPadded=!0,this.sidebarFooterPadded=!0,this.sidebarCloseButtonLabel="Close sidebar",this.opening=!1,this.isFullscreen=!1,this.isFullscreenTransitioning=!1,this.closing=!1,this.scrollable=!1,this.scrolled=!1,this.scrolledDown=!1,this.sidebarScrolled=!1,this.sidebarScrolledDown=!1,this.sidebarScrollable=!1,this.onKeyDown=a=>{"Escape"===a.code&&(a.stopImmediatePropagation(),a.preventDefault(),this.close())},this.onClose=()=>{this.closing=!1,this.unlockBodyScroll(),this.modalClose.emit()},this.onToggle=a=>{this.toggleDialog.emit({newState:a.newState,dialog:this.modalEl})},this.onBackdropClick=()=>{this.close()},this.onCloseButtonClick=()=>{this.close()},this.onFullscreenButtonClick=()=>{this.setFullscreen(!this.isFullscreen)},this.onSidebarCloseButtonClick=()=>{this.hideSidebarContent=!0,this.sidebarClose.emit()},this.onPrimaryAction=a=>{this.primaryAction.emit(a)},this.onSecondaryAction=a=>{this.secondaryAction.emit(a)},this.determineScrollStatus=()=>{this.determineMainScrollStatus(),this.determineSidebarScrollStatus()},this.determineMainScrollStatus=()=>{const a=this.scrollContainer?.scrollTop>0,o=Math.ceil(this.scrollContainer?.scrollTop+this.scrollContainer?.offsetHeight)>=this.scrollContainer?.scrollHeight,e=this.scrollContainer?.scrollHeight>this.scrollContainer?.offsetHeight;a!==this.scrolled&&(this.scrolled=a),o!==this.scrolledDown&&(this.scrolledDown=o),e!==this.scrollable&&(this.scrollable=e)},this.determineSidebarScrollStatus=()=>{const a=this.sidebarScrollContainer?.scrollTop>0,o=Math.ceil(this.sidebarScrollContainer?.scrollTop+this.sidebarScrollContainer?.offsetHeight)>=this.sidebarScrollContainer?.scrollHeight,e=this.sidebarScrollContainer?.scrollHeight>this.sidebarScrollContainer?.offsetHeight;a!==this.sidebarScrolled&&(this.sidebarScrolled=a),o!==this.sidebarScrolledDown&&(this.sidebarScrolledDown=o),e!==this.sidebarScrollable&&(this.sidebarScrollable=e)}}componentDidLoad(){this.ensureOpening(),this.setDialogCustomProps(),this.determineScrollStatus(),this.updateCustomFooterStatus(),this.updateCustomHeaderStatus(),this.updateHeaderToolsStatus(),this.updateSecondaryContentStatus(),this.updateSidebarContentStatus(),this.updateSidebarFooterStatus()}disconnectedCallback(){this.mutationObserver?.disconnect(),this.modalEl?.open&&this.modalEl.close(),this.unlockBodyScroll()}onWindowResize(){this.determineScrollStatus()}async open(a){this.opening=!0,this.temporaryReturnFocusTo=a,this.modalEl&&(this.setupMutationObserver(),this.modalEl.showModal(),this.modalOpen.emit(),this.mutationObserver.observe(this.modalEl,{subtree:!0,childList:!0}),this.lockBodyScroll(),this.determineScrollStatus(),setTimeout((()=>{this.handleAutoFocus()}),200))}async close(a){this.closing||(a||this.requestModalClose.emit(),(this.closable||a)&&(this.closing=!0,this.unlockBodyScroll(),setTimeout((()=>{this.mutationObserver?.disconnect(),this.modalEl.close(),this.customFocusReturn()}),150)))}async setFullscreen(a){this.isFullscreen!==a&&(this.isFullscreenTransitioning=!0,this.isFullscreen=a,this.toggleFullscreen.emit(this.isFullscreen),setTimeout((()=>this.isFullscreenTransitioning=!1),150))}async getScrollContainer(){return this.scrollContainer}updateCustomFooterStatus(){this.hasCustomFooter=Boolean(this.el.querySelector(':scope > [slot="custom-footer"]'))}updateCustomHeaderStatus(){this.hasCustomHeader=Boolean(this.el.querySelector(':scope > [slot="custom-header"]'))}updateHeaderToolsStatus(){this.hasHeaderTools=Boolean(this.el.querySelector(':scope > [slot="header-tools"]'))}updateSecondaryContentStatus(){this.hasSecondaryContent=Boolean(this.el.querySelector(':scope > [slot="secondary-content"]'))}updateSidebarContentStatus(){this.hasSidebarContent=Boolean(this.el.querySelector(':scope > [slot="sidebar-content"]'))}updateSidebarFooterStatus(){this.hasSidebarFooter=Boolean(this.el.querySelector(':scope > [slot="sidebar-footer"]'))}handleAutoFocus(){this.el.querySelector("input[autofocus]")?.focus()}lockBodyScroll(){s(this.scrollContainer),s(this.sidebarScrollContainer)}setupMutationObserver(){this.mutationObserver=new MutationObserver((()=>{this.modalEl?.open&&document.activeElement===document.body&&l(this.modalEl).at(0)?.focus()}))}unlockBodyScroll(){this.scrollContainer&&i(this.scrollContainer),this.sidebarScrollContainer&&i(this.sidebarScrollContainer)}ensureOpening(){this.opening&&!this.modalEl?.open&&this.open()}setDialogCustomProps(){this.modalEl.setAttribute("closedby","none")}customFocusReturn(){const a=this.temporaryReturnFocusTo??this.returnFocusTo;if(!a)return;const o="string"==typeof a?document.querySelector(a):a,e=l(o,{includeContainer:!0,getShadowRoot:!0});e.length>0&&e[0].focus(),this.temporaryReturnFocusTo=void 0}render(){const a=Boolean(this.primaryActionLabel)||Boolean(this.secondaryActionLabel),o=r("modal",`modal--variant-${this.variant}`,{"modal--closing":this.closing,"modal--fullscreen":this.isFullscreen,"modal--fullscreen-transitioning":this.isFullscreenTransitioning,"modal--has-custom-footer":this.hasCustomFooter,"modal--has-custom-header":this.hasCustomHeader,"modal--has-header-tools":this.hasHeaderTools,"modal--has-secondary-content":this.hasSecondaryContent&&!this.hideSecondaryContent,"modal--hide-label":this.hideLabel,"modal--padded":this.padded,"modal--scrollable":this.scrollable,"modal--scrolled":this.scrolled,"modal--hide-scrolled-header-border":this.hideScrolledHeaderBorder,"modal--scrolled-down":this.scrolledDown,"modal--hide-secondary-content-borders":this.hideSecondaryContentBorders,"modal--has-sidebar-content":this.hasSidebarContent&&!this.hideSidebarContent,"modal--sidebar-padded":this.sidebarPadded,"modal--has-sidebar-footer":this.hasSidebarFooter&&this.hasSidebarContent&&!this.hideSidebarContent,"modal--sidebar-footer-padded":this.sidebarFooterPadded,"modal--sidebar-scrolled":this.sidebarScrolled,"modal--sidebar-scrolled-down":this.sidebarScrolledDown,"modal--sidebar-scrollable":this.sidebarScrollable});return e(d,{key:"9607d76894163f9cea92112aa01bfc6e22a605ed"},e("dialog",{key:"493f4a8502ac1bd48885f0be516bae1924bf2811","aria-label":this.label,class:o,onClose:this.onClose,onKeyDown:this.onKeyDown,onToggle:this.onToggle,ref:a=>this.modalEl=a},e("div",{key:"8336b77b80c345349280e458eacd0ad27a82dd2e",class:"modal__backdrop",onClick:this.onBackdropClick}),e("div",{key:"ddea931cf61e89694478dc990a79fd7547786447",class:"modal__body",part:"modal__body",style:this.isFullscreen?{}:{"--swirl-modal-max-height":this.maxHeight,"--swirl-modal-height":this.height,minHeight:this.minHeight,maxWidth:this.maxWidth}},e("aside",{key:"7e68933ae1f88a30ac4391d8840f5de4f013f2b5",class:"modal__sidebar"},this.sidebarLabel&&e("header",{key:"937372760da5f51336f94501b8c85b0b09ecaba5",class:r("modal__sidebar-header",{"modal__sidebar-header--has-close-button":this.hasSidebarCloseButton})},this.hasSidebarCloseButton&&e("swirl-button",{key:"c40db31ae401fcde5e68c59a91cc80a507201edb",hideLabel:!0,icon:"<swirl-icon-double-arrow-right></swirl-icon-double-arrow-right>",label:this.sidebarCloseButtonLabel,onClick:this.onSidebarCloseButtonClick}),e("swirl-heading",{key:"470f47fbe55f98b48b5f364b0461d1c973c1b131",as:"h3",class:"modal__sidebar-heading",level:5,text:this.sidebarLabel})),e("div",{key:"4f09f2abcec1a34a6caa57788ced9cfecdfcf28e",class:"modal__sidebar-content",onScroll:this.determineSidebarScrollStatus,ref:a=>this.sidebarScrollContainer=a},e("slot",{key:"4884f0e09c450b961636631b07c39627c58024fc",name:"sidebar-content"})),e("div",{key:"3a6568ff8eee6b3633c9fab8a51531619b0740ff",class:"modal__sidebar-footer",part:"modal__sidebar-footer"},e("slot",{key:"87fc8362aa752cad6a8dfcb7f3dcb73dde97c4f5",name:"sidebar-footer"}))),e("div",{key:"7083bdd06f61cac7d98b6f9ace6ece3d3e584ba4",class:"modal__main-content"},e("header",{key:"b0b07efe07d43dc60267ff98f2967f87ca4d4fd8",class:"modal__custom-header",part:"modal__custom-header"},e("slot",{key:"55f676f976dea97d8007d5f5877ca6dc9919f167",name:"custom-header"})),(!this.hideLabel||!this.hideCloseButton)&&e("header",{key:"00b190cde34d936f78338c7855459623f99a0baf",class:"modal__header"},e("div",{key:"7feda4612420ed6643b8bfd83b0562d22995dcdd",class:"modal__header-bar"},!this.hideCloseButton&&e("swirl-button",{key:"f044e9d305151fb188be9a4639a0f40be1f59062",class:"modal__close-button",hideLabel:!0,icon:"default"===this.variant?"<swirl-icon-close></swirl-icon-close>":"<swirl-icon-double-arrow-right></swirl-icon-double-arrow-right>",label:this.closeButtonLabel,onClick:this.onCloseButtonClick}),this.showFullscreenButton&&e("swirl-button",{key:"a0f5f7dbda18e36ef6a006bbf901f6f58f2a7ee9",class:"modal__fullscreen-button",hideLabel:!0,icon:this.isFullscreen?"<swirl-icon-close-fullscreen></swirl-icon-close-fullscreen>":"<swirl-icon-open-in-full></swirl-icon-open-in-full>",label:this.isFullscreen?this.fullscreenDisableButtonLabel:this.fullscreenEnableButtonLabel,onClick:this.onFullscreenButtonClick}),!this.hideLabel&&e("swirl-heading",{key:"0b4ce16103c4ebadf58b823168a80c727493a991",as:"h2",class:"modal__heading",level:3,text:this.label}))),e("div",{key:"a5ff003a51bb82b58e299090e14e5061af014206",class:"modal__content-container",style:{gap:this.contentGap?`var(--s-space-${this.contentGap})`:void 0}},e("div",{key:"7998558a65f2f550d6a904f92879d8cba407afcf",class:"modal__primary-content",style:{maxWidth:this.primaryContentMaxWidth,flex:this.primaryContentFlex}},e("div",{key:"f6f396758cb0c9339f100e00f282408e927bc9d6",class:"modal__header-tools",part:"modal__header-tools"},e("slot",{key:"2f85693e7244246afe09ea082c9128cfae96afee",name:"header-tools"})),e("div",{key:"311c59649ff26753ba0e361be1eb79b43d57e3d0",class:"modal__content",onScroll:this.determineMainScrollStatus,part:"modal__content",ref:a=>this.scrollContainer=a},e("slot",{key:"a7594eac7292ce9392143d72560829d1e5af9294"}))),e("div",{key:"a2ffc74c4b81dd0d08060d248c5caa4a4df3b355",class:"modal__secondary-content",style:{maxWidth:this.secondaryContentMaxWidth,flex:this.secondaryContentFlex,padding:Boolean(this.secondaryContentPadding)?`var(--s-space-${this.secondaryContentPadding})`:void 0,paddingBlockEnd:Boolean(this.secondaryContentPaddingBlockEnd)?`var(--s-space-${this.secondaryContentPaddingBlockEnd})`:void 0,paddingBlockStart:Boolean(this.secondaryContentPaddingBlockStart)?`var(--s-space-${this.secondaryContentPaddingBlockStart})`:void 0,paddingInlineEnd:Boolean(this.secondaryContentPaddingInlineEnd)?`var(--s-space-${this.secondaryContentPaddingInlineEnd})`:void 0,paddingInlineStart:Boolean(this.secondaryContentPaddingInlineStart)?`var(--s-space-${this.secondaryContentPaddingInlineStart})`:void 0}},e("slot",{key:"37c3f309468170109de45aebfbe1c2e7a70929bc",name:"secondary-content"}))),e("div",{key:"235c9a2e6eed9359f8018b18473855a2e6569b16",class:"modal__custom-footer"},e("slot",{key:"81d43e3d64e9793a8cbb594f22249411c143edb5",name:"custom-footer"})),a&&e("footer",{key:"039c1db115c9b719240d9f6b6b775e3be2ab1e9f",class:"modal__controls"},e("swirl-button-group",{key:"31020e04e3a0329448bbcb787160980bb4cc5d96",wrap:!0},this.secondaryActionLabel&&e("swirl-button",{key:"dd2da3b453d272f21d07cff0bb3bc4b612269bf2",label:this.secondaryActionLabel,onClick:this.onSecondaryAction}),this.primaryActionLabel&&e("swirl-button",{key:"9407812f0e5cf0d997d875df326606ed9c735c74",intent:"primary",label:this.primaryActionLabel,onClick:this.onPrimaryAction,variant:"flat"})))))))}get el(){return t(this)}};n.style=":host{display:block}:host *{box-sizing:border-box}.modal{--swirl-ghost-button-background-default:var(--s-surface-overlay-default);--swirl-ghost-button-background-hovered:var(--s-surface-overlay-hovered);--swirl-ghost-button-background-pressed:var(--s-surface-overlay-pressed);--swirl-resource-list-item-background-default:var(\n    --s-surface-overlay-default\n  );--swirl-resource-list-item-background-hovered:var(\n    --s-surface-overlay-hovered\n  );--swirl-resource-list-item-background-pressed:var(\n    --s-surface-overlay-pressed\n  );--swirl-modal-height:auto;--swirl-modal-max-height:90vh;--swirl-modal-view-height:100vh;--swirl-modal-header-height:3.75rem;--swirl-modal-max-width:40rem;--swirl-modal-sidebar-width:25rem;--swirl-modal-max-secondary-content-width:24rem;--swirl-modal-footer-padding-small:var(--s-space-12) var(--s-space-16)\n    var(--s-space-12) var(--s-space-16);--swirl-modal-footer-padding-large:var(--s-space-16) var(--s-space-24)\n    var(--s-space-16) var(--s-space-24)}@supports (height: 100dvh){.modal{--swirl-modal-max-height:90dvh;--swirl-modal-view-height:100dvh}}.modal{position:fixed;z-index:var(--s-z-40);display:flex;justify-content:center;align-items:center;height:var(--swirl-modal-view-height);inset:0;border:none;padding:0;width:auto;background:transparent;max-width:none;max-height:none;overflow:visible}.modal::backdrop{display:none}.modal:not([open]){display:none}.modal--variant-default.modal--closing{animation:0.15s modal-fade-out;animation-fill-mode:forwards}@media (prefers-reduced-motion){.modal--variant-default.modal--closing{animation:none}}.modal--variant-default:not(.modal--closing) .modal__backdrop{animation:0.15s modal-backdrop-fade-in}@media (prefers-reduced-motion){.modal--variant-default:not(.modal--closing) .modal__backdrop{animation:none}}.modal--variant-default:not(.modal--closing) .modal__body{animation:0.15s modal-scale-in}@media (prefers-reduced-motion){.modal--variant-default:not(.modal--closing) .modal__body{animation:none}}.modal--variant-drawer{justify-content:end;align-items:stretch}.modal--variant-drawer.modal--closing{animation:0.15s modal-drawer-slide-out;animation-fill-mode:forwards}@media (prefers-reduced-motion){.modal--variant-drawer.modal--closing{animation:none}}@media (min-width: 768px){.modal--variant-drawer.modal--hide-label .modal__header-bar{height:auto;padding-top:var(--s-space-4);padding-bottom:var(--s-space-4)}}.modal--variant-drawer .modal__backdrop{background-color:transparent;animation:none}.modal--variant-drawer .modal__body{height:100%;max-height:none;border-radius:0;animation:0.15s modal-drawer-slide-in;box-shadow:var(--s-shadow-level-3)}@media (prefers-reduced-motion){.modal--variant-drawer .modal__body{animation:none}}.modal--variant-drawer .modal__header-bar{background-color:var(--s-surface-overlay-default)}.modal--variant-drawer .modal__header-bar .modal__close-button{margin-left:calc(-1 * var(--s-space-8))}.modal--variant-drawer .modal__header-bar .modal__fullscreen-button{display:none}@media (min-width: 768px){.modal--variant-drawer .modal__header-bar{flex-direction:row}}@media (min-width: 768px){.modal--variant-drawer.modal--padded .modal__content{padding-top:var(--s-space-8)}}.modal--padded .modal__content{padding-top:var(--s-space-24);padding-right:var(--s-space-16);padding-bottom:var(--s-space-24);padding-left:var(--s-space-16)}@media (min-width: 768px){.modal--padded .modal__content{padding-top:0;padding-right:var(--s-space-24);padding-bottom:var(--s-space-16);padding-left:var(--s-space-24)}}@media (min-width: 768px){.modal--scrollable .modal__content{padding-bottom:0}}.modal--scrollable:not(.modal--scrolled-down).modal--has-custom-footer .modal__custom-footer{border-top:var(--s-border-width-default) solid var(--s-border-default)}.modal--scrollable:not(.modal--scrolled-down):not(.modal--has-custom-footer) .modal__controls{border-top:var(--s-border-width-default) solid var(--s-border-default)}.modal--has-custom-header .modal__custom-header{display:block}.modal--has-custom-header .modal__content{padding-top:var(--s-space-16)}.modal--has-custom-footer .modal__custom-footer{padding:var(--swirl-modal-footer-padding-small)}@media (min-width: 768px){.modal--has-custom-footer .modal__custom-footer{padding:var(--swirl-modal-footer-padding-large)}}.modal--has-header-tools .modal__header{border-bottom-color:transparent}.modal--has-header-tools .modal__header-tools{display:block}.modal--has-secondary-content.modal.modal--variant-default:not(.modal--fullscreen) .modal__body,.modal--has-secondary-content.modal.modal--variant-drawer:not(.modal--fullscreen) .modal__body{max-width:calc(\n      var(--swirl-modal-max-width) +\n        var(--swirl-modal-max-secondary-content-width)\n    )}.modal--has-secondary-content:not(.modal--has-header-tools):not(.modal--hide-secondary-content-borders) .modal__header{border-bottom-color:var(--s-border-default)}.modal--has-secondary-content.modal--has-header-tools:not(.modal--hide-secondary-content-borders) .modal__header-tools{border-bottom-color:var(--s-border-default)}.modal--has-secondary-content.modal--has-custom-footer:not(.modal--hide-secondary-content-borders) .modal__custom-footer{border-top:var(--s-border-width-default) solid var(--s-border-default)}.modal--has-secondary-content:not(.modal--has-custom-footer):not(.modal--hide-secondary-content-borders) .modal__controls{border-top:var(--s-border-width-default) solid var(--s-border-default)}@media (min-width: 992px){.modal--has-secondary-content .modal__header-tools,.modal--has-secondary-content .modal__content{padding-right:0}}.modal--has-secondary-content .modal__primary-content{overflow:visible;max-height:60%;flex-basis:auto}@media (min-width: 992px){.modal--has-secondary-content .modal__primary-content{max-width:calc(100% - var(--swirl-modal-max-secondary-content-width));max-height:none;flex-basis:calc(100% - var(--swirl-modal-max-secondary-content-width))}}.modal--has-secondary-content .modal__secondary-content{display:block}.modal__main-content{display:flex;flex-direction:column;overflow-y:auto;flex-grow:1}.modal__sidebar{display:none}.modal.modal--has-sidebar-content.modal.modal--variant-default:not(.modal--fullscreen) .modal__body,.modal.modal--has-sidebar-content.modal.modal--variant-drawer:not(.modal--fullscreen) .modal__body{max-width:calc(\n      var(--swirl-modal-max-width) + var(--swirl-modal-sidebar-width)\n    )}@media (min-width: 768px){.modal.modal--has-sidebar-content .modal__sidebar{display:flex;flex-direction:column;overflow-y:auto;flex-shrink:0;width:var(--swirl-modal-sidebar-width);border-right:var(--s-border-width-default) solid var(--s-border-default)}.modal.modal--has-sidebar-content .modal__sidebar .modal__sidebar-header{border-bottom:var(--s-border-width-default) solid transparent;display:flex;align-items:center;gap:var(--s-space-8);padding-right:var(--s-space-24);padding-left:var(--s-space-24)}.modal.modal--has-sidebar-content .modal__sidebar .modal__sidebar-header.modal__sidebar-header--has-close-button{padding-left:var(--s-space-16)}.modal.modal--has-sidebar-content .modal__sidebar .modal__sidebar-header .modal__sidebar-heading{display:flex;align-items:center;height:var(--swirl-modal-header-height)}.modal.modal--has-sidebar-content .modal__sidebar .modal__sidebar-content{display:block;flex-grow:1;overflow-y:auto}}@media (min-width: 992px){.modal.modal--has-sidebar-content .modal__primary-content{flex-basis:calc(100% - 20rem)}}.modal--sidebar-padded .modal__sidebar .modal__sidebar-content{padding-left:var(--s-space-24);padding-right:var(--s-space-24);padding-bottom:var(--s-space-16);padding-top:var(--s-space-16)}@media (min-width: 768px){.modal--scrolled:not(.modal--hide-scrolled-header-border):not(.modal--has-header-tools) .modal__header{border-bottom-color:var(--s-border-default)}.modal--scrolled:not(.modal--hide-scrolled-header-border).modal--has-header-tools .modal__header-tools{border-bottom-color:var(--s-border-default)}.modal--scrolled:not(.modal--hide-scrolled-header-border) .modal__custom-header{border-bottom-color:var(--s-border-default)}}@media (min-width: 768px){.modal--sidebar-scrolled .modal__sidebar .modal__sidebar-header{border-bottom-color:var(--s-border-default)}}.modal--has-sidebar-footer.modal--sidebar-footer-padded .modal__sidebar-footer{padding:var(--swirl-modal-footer-padding-small)}@media (min-width: 768px){.modal--has-sidebar-footer.modal--sidebar-footer-padded .modal__sidebar-footer{padding:var(--swirl-modal-footer-padding-large)}}@media (min-width: 768px){.modal--sidebar-scrollable .modal__sidebar-content{padding-bottom:0 !important}}.modal--sidebar-scrollable:not(.modal--sidebar-scrolled-down).modal--has-sidebar-footer .modal__sidebar-footer{border-top:var(--s-border-width-default) solid var(--s-border-default)}.modal__backdrop{position:fixed;background-color:rgba(0, 0, 0, 0.2);inset:0}.modal__body{--swirl-card-background-default:var(--s-surface-overlay-default);--swirl-card-background-hovered:var(--s-surface-overlay-hovered);--swirl-card-background-pressed:var(--s-surface-overlay-pressed);--swirl-accordion-item-toggle-default:var(--s-surface-overlay-default);--swirl-accordion-item-toggle-hovered:var(--s-surface-overlay-hovered);--swirl-accordion-item-toggle-pressed:var(--s-surface-overlay-pressed);position:relative;z-index:var(--s-z-40);display:flex;flex-direction:row;overflow:hidden;width:100vw;max-width:100vw;height:var(--swirl-modal-view-height);max-height:var(--swirl-modal-view-height);background-color:var(--s-surface-overlay-default)}.modal--fullscreen .modal__body{min-height:var(--swirl-modal-view-height)}.modal--fullscreen-transitioning .modal__body{transition:width 0.15s ease-out, max-width 0.15s ease-out,\n    max-height 0.15s ease-out, min-height 0.15s ease-out}@media (min-width: 768px){.modal.modal--variant-default:not(.modal--fullscreen) .modal__body{width:90vw;max-width:var(--swirl-modal-max-width);max-height:var(--swirl-modal-max-height);min-height:0;border-radius:var(--s-border-radius-base);box-shadow:var(--s-shadow-level-3)}}@media (min-width: 992px){.modal.modal--variant-default:not(.modal--fullscreen) .modal__body{height:var(--swirl-modal-height)}}.modal__header{border-bottom:var(--s-border-width-default) solid var(--s-border-default)}@media (min-width: 768px){.modal__header{border-bottom:var(--s-border-width-default) solid transparent}}.modal__header-bar{display:flex;height:3.5rem;padding-top:var(--s-space-8);padding-right:var(--s-space-16);padding-bottom:var(--s-space-8);padding-left:var(--s-space-16);flex-shrink:0;align-items:center;gap:var(--s-space-8)}@media (min-width: 768px){.modal__header-bar{height:var(--swirl-modal-header-height);padding-top:var(--s-space-12);padding-right:var(--s-space-24);padding-bottom:var(--s-space-12);padding-left:var(--s-space-24);flex-direction:row-reverse}}.modal__fullscreen-button{display:none}@media (min-width: 768px){.modal__fullscreen-button{display:block}}.modal__header-tools{display:none;padding-right:var(--s-space-16);padding-left:var(--s-space-16);border-bottom:var(--s-border-width-default) solid var(--s-border-default)}@media (min-width: 768px){.modal__header-tools{padding-right:var(--s-space-24);padding-left:var(--s-space-24);border-bottom-color:transparent}}.modal__custom-header{display:none;flex-shrink:0;border-bottom:var(--s-border-width-default) solid var(--s-border-default)}@media (min-width: 768px){.modal__custom-header{border-bottom-color:transparent}}.modal__heading{overflow:hidden}.modal__heading .heading{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.modal__content-container{display:flex;overflow:hidden;flex-grow:1;flex-direction:column;gap:var(--s-space-24)}@media (min-width: 992px){.modal__content-container{flex-direction:row}}.modal__primary-content{display:flex;overflow:hidden;overflow-y:auto;min-width:0;flex-basis:100%;flex-grow:1;flex-direction:column}.modal__content{overflow-x:hidden;overflow-y:auto;height:100%}.modal__content ::slotted(*){margin:0}.modal__secondary-content{display:none;overflow:visible;overflow-x:hidden;overflow-y:auto;min-width:0;max-width:none;max-height:40%;padding-right:var(--s-space-16);padding-left:var(--s-space-16)}@media (min-width: 768px){.modal__secondary-content{padding-left:var(--s-space-24)}}@media (min-width: 992px){.modal__secondary-content{overflow-x:hidden;overflow-y:auto;max-width:var(--swirl-modal-max-secondary-content-width);max-height:none;padding-right:var(--s-space-24);padding-bottom:var(--s-space-16);padding-left:0;flex-basis:50%;flex-grow:1}}.modal__custom-footer{flex-shrink:0}.modal__controls{display:flex;padding:var(--swirl-modal-footer-padding-small);flex-shrink:0;justify-content:flex-end}@media (min-width: 768px){.modal__controls{padding:var(--swirl-modal-footer-padding-large)}}.modal--has-secondary-content.modal--has-sidebar-content:not(.modal--fullscreen) .modal__body{max-width:calc(\n      var(--swirl-modal-max-width) + var(--swirl-modal-sidebar-width) +\n        var(--swirl-modal-max-secondary-content-width)\n    )}@keyframes modal-scale-in{from{transform:scale(0)}to{transform:scale(1)}}@keyframes modal-backdrop-fade-in{from{opacity:0}to{opacity:1}}@keyframes modal-fade-out{from{opacity:1}to{opacity:0}}@keyframes modal-drawer-slide-in{from{transform:translate3d(100%, 0, 0)}to{transform:translate3d(0, 0, 0)}}@keyframes modal-drawer-slide-out{from{transform:translate3d(0, 0, 0)}to{transform:translate3d(100%, 0, 0)}}";export{n as swirl_modal}