@getflip/swirl-components 0.434.0 → 0.435.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components.json +121 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/swirl-components.cjs.js +1 -1
- package/dist/cjs/swirl-inline-notification.cjs.entry.js +4 -3
- package/dist/cjs/swirl-menu.cjs.entry.js +4 -3
- package/dist/cjs/swirl-modal.cjs.entry.js +9 -9
- package/dist/cjs/swirl-radio.cjs.entry.js +1 -1
- package/dist/collection/components/swirl-inline-notification/swirl-inline-notification.css +8 -1
- package/dist/collection/components/swirl-inline-notification/swirl-inline-notification.js +30 -2
- package/dist/collection/components/swirl-inline-notification/swirl-inline-notification.stories.js +6 -0
- package/dist/collection/components/swirl-menu/swirl-menu.js +30 -3
- package/dist/collection/components/swirl-modal/swirl-modal.js +9 -9
- package/dist/collection/components/swirl-radio/swirl-radio.css +1 -0
- package/dist/components/assets/pdfjs/pdf.worker.min.mjs +1 -1
- package/dist/components/swirl-inline-notification.js +6 -4
- package/dist/components/swirl-menu.js +5 -3
- package/dist/components/swirl-modal.js +9 -9
- package/dist/components/swirl-radio.js +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/esm/swirl-components.js +1 -1
- package/dist/esm/swirl-inline-notification.entry.js +4 -3
- package/dist/esm/swirl-menu.entry.js +4 -3
- package/dist/esm/swirl-modal.entry.js +9 -9
- package/dist/esm/swirl-radio.entry.js +1 -1
- package/dist/swirl-components/p-4bd7d553.entry.js +1 -0
- package/dist/swirl-components/p-5a396046.entry.js +1 -0
- package/dist/swirl-components/p-69145b3c.entry.js +1 -0
- package/dist/swirl-components/p-dc5a34f5.entry.js +1 -0
- package/dist/swirl-components/swirl-components.esm.js +1 -1
- package/dist/types/components/swirl-inline-notification/swirl-inline-notification.d.ts +4 -0
- package/dist/types/components/swirl-inline-notification/swirl-inline-notification.stories.d.ts +6 -0
- package/dist/types/components/swirl-menu/swirl-menu.d.ts +2 -1
- package/dist/types/components.d.ts +20 -4
- package/package.json +1 -1
- package/vscode-data.json +46 -0
- package/dist/swirl-components/p-114e47f6.entry.js +0 -1
- package/dist/swirl-components/p-322f18d4.entry.js +0 -1
- package/dist/swirl-components/p-5e8359de.entry.js +0 -1
- package/dist/swirl-components/p-b1168a4f.entry.js +0 -1
|
@@ -200,7 +200,7 @@ const SwirlModal = class {
|
|
|
200
200
|
this.hasSidebarFooter = Boolean(this.el.querySelector(':scope > [slot="sidebar-footer"]'));
|
|
201
201
|
}
|
|
202
202
|
handleAutoFocus() {
|
|
203
|
-
this.
|
|
203
|
+
this.el.querySelector("input[autofocus]")?.focus();
|
|
204
204
|
}
|
|
205
205
|
lockBodyScroll() {
|
|
206
206
|
disableBodyScroll(this.scrollContainer);
|
|
@@ -260,29 +260,29 @@ const SwirlModal = class {
|
|
|
260
260
|
"modal--sidebar-scrolled-down": this.sidebarScrolledDown,
|
|
261
261
|
"modal--sidebar-scrollable": this.sidebarScrollable,
|
|
262
262
|
});
|
|
263
|
-
return (h(Host, { key: '
|
|
263
|
+
return (h(Host, { key: '7b1f5a6a54ec9fa0a3dda86850372896844b2eae' }, h("dialog", { key: 'a2774d27715548e06a6792e5e311e36b4ea7a79c', "aria-label": this.label, class: className, onClose: this.onClose, onKeyDown: this.onKeyDown, onToggle: this.onToggle, ref: (el) => (this.modalEl = el) }, h("div", { key: '49484b321480f4b34bf49f4dd85777a0d1056068', class: "modal__backdrop", onClick: this.onBackdropClick }), h("div", { key: '40793d682b216240714a79c428d7e2d3d6c94ae1', class: "modal__body", part: "modal__body", style: !this.isFullscreen
|
|
264
264
|
? {
|
|
265
265
|
"--swirl-modal-max-height": this.maxHeight,
|
|
266
266
|
"--swirl-modal-height": this.height,
|
|
267
267
|
minHeight: this.minHeight,
|
|
268
268
|
maxWidth: this.maxWidth,
|
|
269
269
|
}
|
|
270
|
-
: {} }, h("aside", { key: '
|
|
270
|
+
: {} }, h("aside", { key: '5fadaafa6aa3261dc2630d96279c3dc88774a1a7', class: "modal__sidebar" }, this.sidebarLabel && (h("header", { key: 'd121df205c2bc8ba63160a8ca528a09f1d0aa61b', class: classnames("modal__sidebar-header", {
|
|
271
271
|
"modal__sidebar-header--has-close-button": this.hasSidebarCloseButton,
|
|
272
|
-
}) }, this.hasSidebarCloseButton && (h("swirl-button", { key: '
|
|
272
|
+
}) }, this.hasSidebarCloseButton && (h("swirl-button", { key: '94c5c1332d23bfc47bbc92e5eaa3e0b1cf4051fe', hideLabel: true, icon: "<swirl-icon-double-arrow-right></swirl-icon-double-arrow-right>", label: this.sidebarCloseButtonLabel, onClick: this.onSidebarCloseButtonClick })), h("swirl-heading", { key: '9a641f1f2182e9f910d79a035969e93458b07907', as: "h3", class: "modal__sidebar-heading", level: 5, text: this.sidebarLabel }))), h("div", { key: 'b706d96b44f51292a6a4cdcee91799353db55802', class: "modal__sidebar-content", onScroll: this.determineSidebarScrollStatus, ref: (el) => (this.sidebarScrollContainer = el) }, h("slot", { key: '4af9fbd8763fb09fd55062ff3ff99fc36fa529ce', name: "sidebar-content" })), h("div", { key: 'a3f355dd62cef5429549b1f06d44e57f49e36e88', class: "modal__sidebar-footer", part: "modal__sidebar-footer" }, h("slot", { key: 'd741cd69fa8a0804e07be5fd03768144433672ca', name: "sidebar-footer" }))), h("div", { key: '9ba4bf6aec690768fd3062ff7672aa745f80db4b', class: "modal__main-content" }, h("header", { key: 'b5105c12dbe115537c6cc46cbc662a1c70ef696f', class: "modal__custom-header", part: "modal__custom-header" }, h("slot", { key: '5401148d6b09414ca04a330e2c2c647644d261a7', name: "custom-header" })), (!this.hideLabel || !this.hideCloseButton) && (h("header", { key: 'b909d69b879ecfbea57a545bd0fd3abe911fc5ea', class: "modal__header" }, h("div", { key: 'a463e28ab5af6ef439a0768fc4d405419e3e933c', class: "modal__header-bar" }, !this.hideCloseButton && (h("swirl-button", { key: '221a4cb8ba8224e3f539d333280b780777a19428', class: "modal__close-button", hideLabel: true, icon: this.variant === "default"
|
|
273
273
|
? "<swirl-icon-close></swirl-icon-close>"
|
|
274
|
-
: "<swirl-icon-double-arrow-right></swirl-icon-double-arrow-right>", label: this.closeButtonLabel, onClick: this.onCloseButtonClick })), this.showFullscreenButton && (h("swirl-button", { key: '
|
|
274
|
+
: "<swirl-icon-double-arrow-right></swirl-icon-double-arrow-right>", label: this.closeButtonLabel, onClick: this.onCloseButtonClick })), this.showFullscreenButton && (h("swirl-button", { key: '4a83a1a763e032b542c81644a549964bc6fd1208', class: "modal__fullscreen-button", hideLabel: true, icon: this.isFullscreen
|
|
275
275
|
? "<swirl-icon-close-fullscreen></swirl-icon-close-fullscreen>"
|
|
276
276
|
: "<swirl-icon-open-in-full></swirl-icon-open-in-full>", label: this.isFullscreen
|
|
277
277
|
? this.fullscreenDisableButtonLabel
|
|
278
|
-
: this.fullscreenEnableButtonLabel, onClick: this.onFullscreenButtonClick })), !this.hideLabel && (h("swirl-heading", { key: '
|
|
278
|
+
: this.fullscreenEnableButtonLabel, onClick: this.onFullscreenButtonClick })), !this.hideLabel && (h("swirl-heading", { key: 'c491a2cd384d29ab781d0790bad8fce476a90bf8', as: "h2", class: "modal__heading", level: 3, text: this.label }))))), h("div", { key: 'dfddf8429c3910924f5efe63334e33f87bfb475f', class: "modal__content-container", style: {
|
|
279
279
|
gap: this.contentGap
|
|
280
280
|
? `var(--s-space-${this.contentGap})`
|
|
281
281
|
: undefined,
|
|
282
|
-
} }, h("div", { key: '
|
|
282
|
+
} }, h("div", { key: 'b367c401864d309ca26aca350c7b7cf0bfb526db', class: "modal__primary-content", style: {
|
|
283
283
|
maxWidth: this.primaryContentMaxWidth,
|
|
284
284
|
flex: this.primaryContentFlex,
|
|
285
|
-
} }, h("div", { key: '
|
|
285
|
+
} }, h("div", { key: '745de57b314184940b0ba3174d694176a094db57', class: "modal__header-tools", part: "modal__header-tools" }, h("slot", { key: 'c5722ce7afde24de61a7aad6d3e6a09fbf264f38', name: "header-tools" })), h("div", { key: '3cb2597374be9238e7002ae256d8b1b7d618715f', class: "modal__content", onScroll: this.determineMainScrollStatus, part: "modal__content", ref: (el) => (this.scrollContainer = el) }, h("slot", { key: 'c0248efeab322efb766db428bfce71879aec2c11' }))), h("div", { key: '01eb5918af059310d3c3a96dacbf2b4d9a7502a8', class: "modal__secondary-content", style: {
|
|
286
286
|
maxWidth: this.secondaryContentMaxWidth,
|
|
287
287
|
flex: this.secondaryContentFlex,
|
|
288
288
|
padding: Boolean(this.secondaryContentPadding)
|
|
@@ -300,7 +300,7 @@ const SwirlModal = class {
|
|
|
300
300
|
paddingInlineStart: Boolean(this.secondaryContentPaddingInlineStart)
|
|
301
301
|
? `var(--s-space-${this.secondaryContentPaddingInlineStart})`
|
|
302
302
|
: undefined,
|
|
303
|
-
} }, h("slot", { key: '
|
|
303
|
+
} }, h("slot", { key: '2e962ff3e2305b62bea138f9181cf112d5c73c0f', name: "secondary-content" }))), h("div", { key: '7557c5bf249bb0611ad4d56cf04300409636740b', class: "modal__custom-footer" }, h("slot", { key: 'df270671beab0f6cf5b0693f62b1d7140e080685', name: "custom-footer" })), showControls && (h("footer", { key: '37bd816e3058549f70820045839aa0273b2ea7a2', class: "modal__controls" }, h("swirl-button-group", { key: '13a7664eb9b5d8356becf61cef74fdffe85a307e', wrap: true }, this.secondaryActionLabel && (h("swirl-button", { key: '5afbc606a31c569d0bb692819bc965c4a499d56c', label: this.secondaryActionLabel, onClick: this.onSecondaryAction })), this.primaryActionLabel && (h("swirl-button", { key: 'd635317b7da366eacec12d6018c1c92e7fb6af72', intent: "primary", label: this.primaryActionLabel, onClick: this.onPrimaryAction, variant: "flat" }))))))))));
|
|
304
304
|
}
|
|
305
305
|
get el() { return getElement(this); }
|
|
306
306
|
};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { r as registerInstance, c as createEvent, h, H as Host } from './index-Dj_4Fda9.js';
|
|
2
2
|
import { c as classnames } from './index-orsBiyT_.js';
|
|
3
3
|
|
|
4
|
-
const swirlRadioCss = ".sc-swirl-radio-h{display:inline-flex}.sc-swirl-radio-h *.sc-swirl-radio{box-sizing:border-box}.radio.sc-swirl-radio{display:inline-flex;line-height:var(--s-line-height-base);cursor:pointer}.radio.sc-swirl-radio:focus-within .radio__box.sc-swirl-radio{box-shadow:0 0 0 0.0625rem var(--s-background-default),\n 0 0 0 0.1875rem var(--s-focus-default)}.radio--variant-card.sc-swirl-radio{width:100%;padding:var(--s-space-16);border:0.0625rem solid var(--s-border-default);border-radius:var(--s-border-radius-sm);background-color:var(--s-surface)}.radio--variant-card.sc-swirl-radio:focus-within{box-shadow:0 0 0 0.125rem var(--s-background-default),\n 0 0 0 0.25rem var(--s-focus-default)}.radio--variant-card.sc-swirl-radio:focus-within .radio__box.sc-swirl-radio{box-shadow:none}.radio--variant-card.sc-swirl-radio:hover:not(.radio--disabled){background-color:var(--s-surface-hovered)}.radio--variant-card.sc-swirl-radio:active:not(.radio--disabled){background-color:var(--s-surface-pressed)}.radio--variant-card.radio--checked.sc-swirl-radio:not(.radio--disabled){border-color:var(--s-border-highlight)}.radio--variant-card.radio--invalid.sc-swirl-radio:not(.radio--disabled){border-color:var(--s-border-critical)}.radio--checked.sc-swirl-radio .radio__control.sc-swirl-radio:hover .radio__box.sc-swirl-radio{border-color:var(--s-interactive-primary-hovered);background-color:var(--s-interactive-primary-hovered)}.radio--checked.sc-swirl-radio .radio__box.sc-swirl-radio{position:relative;border-color:var(--s-icon-highlight);background-color:var(--s-icon-highlight)}.radio--checked.sc-swirl-radio .radio__box.sc-swirl-radio:after{position:absolute;top:50%;left:50%;width:0.5rem;height:0.5rem;border-radius:50%;background-color:var(--s-background-default);content:\"\";transform:translate3d(-50%, -50%, 0)}.radio--invalid.radio--checked.sc-swirl-radio .radio__box.sc-swirl-radio,.radio--invalid.radio--indeterminate.sc-swirl-radio .radio__box.sc-swirl-radio{background-color:var(--s-icon-critical)}.radio--invalid.sc-swirl-radio .radio__box.sc-swirl-radio{border-color:var(--s-icon-critical)}.radio--disabled.sc-swirl-radio{cursor:default}.radio--disabled.radio--checked.sc-swirl-radio .radio__control.sc-swirl-radio:hover .radio__box.sc-swirl-radio{border-color:var(--s-icon-disabled);background-color:transparent}.radio--disabled.radio--checked.sc-swirl-radio .radio__box.sc-swirl-radio{border-color:var(--s-icon-disabled);background-color:var(--s-background-default)}.radio--disabled.radio--checked.sc-swirl-radio .radio__box.sc-swirl-radio:after{background-color:var(--s-icon-disabled)}.radio--disabled.sc-swirl-radio .radio__control.sc-swirl-radio:hover .radio__box.sc-swirl-radio{background-color:transparent}.radio--disabled.sc-swirl-radio .radio__box.sc-swirl-radio{border-color:var(--s-icon-disabled)}.radio--disabled.sc-swirl-radio .radio__description.sc-swirl-radio,.radio--disabled.sc-swirl-radio .radio__label.sc-swirl-radio{color:var(--s-text-disabled)}.radio__control.sc-swirl-radio{position:relative;display:inline-flex;width:1.5rem;height:1.5rem;padding:var(--s-space-2);flex-shrink:0}.radio__control.sc-swirl-radio:hover .radio__box.sc-swirl-radio{background-color:var(--s-action-neutral-hovered)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.radio__control.sc-swirl-radio{width:1.375rem;height:1.375rem}}.radio__box.sc-swirl-radio{position:relative;display:flex;width:100%;height:100%;justify-content:center;align-items:center;border:0.125rem solid var(--s-icon-default);border-radius:50%}.radio__label-container.sc-swirl-radio{display:inline-flex;margin-left:var(--s-space-8);padding-top:var(--s-space-2);flex-direction:column}.radio__label.sc-swirl-radio{display:flex;align-items:center;font-weight:var(--s-font-weight-medium);gap:var(--s-space-8)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.radio__label.sc-swirl-radio{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.radio__description.sc-swirl-radio{color:var(--s-text-subdued)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.radio__description.sc-swirl-radio{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}";
|
|
4
|
+
const swirlRadioCss = ".sc-swirl-radio-h{display:inline-flex}.sc-swirl-radio-h *.sc-swirl-radio{box-sizing:border-box}.radio.sc-swirl-radio{display:inline-flex;line-height:var(--s-line-height-base);cursor:pointer;align-items:center}.radio.sc-swirl-radio:focus-within .radio__box.sc-swirl-radio{box-shadow:0 0 0 0.0625rem var(--s-background-default),\n 0 0 0 0.1875rem var(--s-focus-default)}.radio--variant-card.sc-swirl-radio{width:100%;padding:var(--s-space-16);border:0.0625rem solid var(--s-border-default);border-radius:var(--s-border-radius-sm);background-color:var(--s-surface)}.radio--variant-card.sc-swirl-radio:focus-within{box-shadow:0 0 0 0.125rem var(--s-background-default),\n 0 0 0 0.25rem var(--s-focus-default)}.radio--variant-card.sc-swirl-radio:focus-within .radio__box.sc-swirl-radio{box-shadow:none}.radio--variant-card.sc-swirl-radio:hover:not(.radio--disabled){background-color:var(--s-surface-hovered)}.radio--variant-card.sc-swirl-radio:active:not(.radio--disabled){background-color:var(--s-surface-pressed)}.radio--variant-card.radio--checked.sc-swirl-radio:not(.radio--disabled){border-color:var(--s-border-highlight)}.radio--variant-card.radio--invalid.sc-swirl-radio:not(.radio--disabled){border-color:var(--s-border-critical)}.radio--checked.sc-swirl-radio .radio__control.sc-swirl-radio:hover .radio__box.sc-swirl-radio{border-color:var(--s-interactive-primary-hovered);background-color:var(--s-interactive-primary-hovered)}.radio--checked.sc-swirl-radio .radio__box.sc-swirl-radio{position:relative;border-color:var(--s-icon-highlight);background-color:var(--s-icon-highlight)}.radio--checked.sc-swirl-radio .radio__box.sc-swirl-radio:after{position:absolute;top:50%;left:50%;width:0.5rem;height:0.5rem;border-radius:50%;background-color:var(--s-background-default);content:\"\";transform:translate3d(-50%, -50%, 0)}.radio--invalid.radio--checked.sc-swirl-radio .radio__box.sc-swirl-radio,.radio--invalid.radio--indeterminate.sc-swirl-radio .radio__box.sc-swirl-radio{background-color:var(--s-icon-critical)}.radio--invalid.sc-swirl-radio .radio__box.sc-swirl-radio{border-color:var(--s-icon-critical)}.radio--disabled.sc-swirl-radio{cursor:default}.radio--disabled.radio--checked.sc-swirl-radio .radio__control.sc-swirl-radio:hover .radio__box.sc-swirl-radio{border-color:var(--s-icon-disabled);background-color:transparent}.radio--disabled.radio--checked.sc-swirl-radio .radio__box.sc-swirl-radio{border-color:var(--s-icon-disabled);background-color:var(--s-background-default)}.radio--disabled.radio--checked.sc-swirl-radio .radio__box.sc-swirl-radio:after{background-color:var(--s-icon-disabled)}.radio--disabled.sc-swirl-radio .radio__control.sc-swirl-radio:hover .radio__box.sc-swirl-radio{background-color:transparent}.radio--disabled.sc-swirl-radio .radio__box.sc-swirl-radio{border-color:var(--s-icon-disabled)}.radio--disabled.sc-swirl-radio .radio__description.sc-swirl-radio,.radio--disabled.sc-swirl-radio .radio__label.sc-swirl-radio{color:var(--s-text-disabled)}.radio__control.sc-swirl-radio{position:relative;display:inline-flex;width:1.5rem;height:1.5rem;padding:var(--s-space-2);flex-shrink:0}.radio__control.sc-swirl-radio:hover .radio__box.sc-swirl-radio{background-color:var(--s-action-neutral-hovered)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.radio__control.sc-swirl-radio{width:1.375rem;height:1.375rem}}.radio__box.sc-swirl-radio{position:relative;display:flex;width:100%;height:100%;justify-content:center;align-items:center;border:0.125rem solid var(--s-icon-default);border-radius:50%}.radio__label-container.sc-swirl-radio{display:inline-flex;margin-left:var(--s-space-8);padding-top:var(--s-space-2);flex-direction:column}.radio__label.sc-swirl-radio{display:flex;align-items:center;font-weight:var(--s-font-weight-medium);gap:var(--s-space-8)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.radio__label.sc-swirl-radio{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.radio__description.sc-swirl-radio{color:var(--s-text-subdued)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.radio__description.sc-swirl-radio{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}";
|
|
5
5
|
|
|
6
6
|
const SwirlRadio = class {
|
|
7
7
|
constructor(hostRef) {
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
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(){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()}),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")}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:"7b1f5a6a54ec9fa0a3dda86850372896844b2eae"},e("dialog",{key:"a2774d27715548e06a6792e5e311e36b4ea7a79c","aria-label":this.label,class:o,onClose:this.onClose,onKeyDown:this.onKeyDown,onToggle:this.onToggle,ref:a=>this.modalEl=a},e("div",{key:"49484b321480f4b34bf49f4dd85777a0d1056068",class:"modal__backdrop",onClick:this.onBackdropClick}),e("div",{key:"40793d682b216240714a79c428d7e2d3d6c94ae1",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:"5fadaafa6aa3261dc2630d96279c3dc88774a1a7",class:"modal__sidebar"},this.sidebarLabel&&e("header",{key:"d121df205c2bc8ba63160a8ca528a09f1d0aa61b",class:r("modal__sidebar-header",{"modal__sidebar-header--has-close-button":this.hasSidebarCloseButton})},this.hasSidebarCloseButton&&e("swirl-button",{key:"94c5c1332d23bfc47bbc92e5eaa3e0b1cf4051fe",hideLabel:!0,icon:"<swirl-icon-double-arrow-right></swirl-icon-double-arrow-right>",label:this.sidebarCloseButtonLabel,onClick:this.onSidebarCloseButtonClick}),e("swirl-heading",{key:"9a641f1f2182e9f910d79a035969e93458b07907",as:"h3",class:"modal__sidebar-heading",level:5,text:this.sidebarLabel})),e("div",{key:"b706d96b44f51292a6a4cdcee91799353db55802",class:"modal__sidebar-content",onScroll:this.determineSidebarScrollStatus,ref:a=>this.sidebarScrollContainer=a},e("slot",{key:"4af9fbd8763fb09fd55062ff3ff99fc36fa529ce",name:"sidebar-content"})),e("div",{key:"a3f355dd62cef5429549b1f06d44e57f49e36e88",class:"modal__sidebar-footer",part:"modal__sidebar-footer"},e("slot",{key:"d741cd69fa8a0804e07be5fd03768144433672ca",name:"sidebar-footer"}))),e("div",{key:"9ba4bf6aec690768fd3062ff7672aa745f80db4b",class:"modal__main-content"},e("header",{key:"b5105c12dbe115537c6cc46cbc662a1c70ef696f",class:"modal__custom-header",part:"modal__custom-header"},e("slot",{key:"5401148d6b09414ca04a330e2c2c647644d261a7",name:"custom-header"})),(!this.hideLabel||!this.hideCloseButton)&&e("header",{key:"b909d69b879ecfbea57a545bd0fd3abe911fc5ea",class:"modal__header"},e("div",{key:"a463e28ab5af6ef439a0768fc4d405419e3e933c",class:"modal__header-bar"},!this.hideCloseButton&&e("swirl-button",{key:"221a4cb8ba8224e3f539d333280b780777a19428",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:"4a83a1a763e032b542c81644a549964bc6fd1208",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:"c491a2cd384d29ab781d0790bad8fce476a90bf8",as:"h2",class:"modal__heading",level:3,text:this.label}))),e("div",{key:"dfddf8429c3910924f5efe63334e33f87bfb475f",class:"modal__content-container",style:{gap:this.contentGap?`var(--s-space-${this.contentGap})`:void 0}},e("div",{key:"b367c401864d309ca26aca350c7b7cf0bfb526db",class:"modal__primary-content",style:{maxWidth:this.primaryContentMaxWidth,flex:this.primaryContentFlex}},e("div",{key:"745de57b314184940b0ba3174d694176a094db57",class:"modal__header-tools",part:"modal__header-tools"},e("slot",{key:"c5722ce7afde24de61a7aad6d3e6a09fbf264f38",name:"header-tools"})),e("div",{key:"3cb2597374be9238e7002ae256d8b1b7d618715f",class:"modal__content",onScroll:this.determineMainScrollStatus,part:"modal__content",ref:a=>this.scrollContainer=a},e("slot",{key:"c0248efeab322efb766db428bfce71879aec2c11"}))),e("div",{key:"01eb5918af059310d3c3a96dacbf2b4d9a7502a8",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:"2e962ff3e2305b62bea138f9181cf112d5c73c0f",name:"secondary-content"}))),e("div",{key:"7557c5bf249bb0611ad4d56cf04300409636740b",class:"modal__custom-footer"},e("slot",{key:"df270671beab0f6cf5b0693f62b1d7140e080685",name:"custom-footer"})),a&&e("footer",{key:"37bd816e3058549f70820045839aa0273b2ea7a2",class:"modal__controls"},e("swirl-button-group",{key:"13a7664eb9b5d8356becf61cef74fdffe85a307e",wrap:!0},this.secondaryActionLabel&&e("swirl-button",{key:"5afbc606a31c569d0bb692819bc965c4a499d56c",label:this.secondaryActionLabel,onClick:this.onSecondaryAction}),this.primaryActionLabel&&e("swirl-button",{key:"d635317b7da366eacec12d6018c1c92e7fb6af72",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}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{r as t,c as i,h as e,H as s,d as n}from"./p-Dj_4Fda9.js";import{c as o,a,o as h,s as r,f as l}from"./p-CLsTbQHn.js";import{c}from"./p-orsBiyT_.js";import{q as m,l as u,p as d,i as b,k as f}from"./p-Dn2SWlGn.js";const p=class{constructor(e){t(this,e),this.done=i(this,"done",7),this.valueChange=i(this,"valueChange",7),this.active=!0,this.level=0,this.mobileBackButtonLabel="Back",this.mobileCloseMenuButtonLabel="Close menu",this.placement="right-start",this.mobileDoneButtonLabel="Done",this.variant="action",this.activeLevel=0,this.mobileMediaQuery=window.matchMedia("(min-width: 768px)"),this.mediaQueryHandler=()=>{this.updateMobileState()},this.resetMenu=()=>{this.items.forEach((t=>{t.tabIndex=-1})),this.level>0||setTimeout((()=>{this.activeLevel=0,m(this.el,"swirl-menu").forEach((t=>{t.active=!1,t.parentElement.expanded=!1}))}),this.mobile?200:60)},this.closeMenu=()=>{this.disableAutoUpdate&&this.disableAutoUpdate(),this.swirlPopover.close(),this.resetMenu()},this.reposition=async()=>{if(this.mobile||0===this.level)return void(this.position=void 0);const t=this.el.parentElement;Boolean(t)&&Boolean(this.menuContainer)&&requestAnimationFrame((async()=>{this.position=await o(t,this.menuContainer,{placement:this.placement,strategy:"fixed",middleware:[h({mainAxis:-10,crossAxis:0}),r(),l()]})}))},this.onKeyDown=t=>{if("ArrowDown"===t.code)t.preventDefault(),t.stopPropagation(),this.focusNextItem();else if("ArrowUp"===t.code)t.preventDefault(),t.stopPropagation(),this.focusPreviousItem();else if("ArrowLeft"===t.code)t.preventDefault(),t.stopPropagation(),this.rootMenu.goBack();else if("ArrowRight"===t.code){t.preventDefault();const i=u(this.items[this.getActiveItemIndex()],"swirl-menu-item");if(!Boolean(i))return;this.rootMenu.activateMenuItem(i)}},this.onClose=()=>{this.closeMenu()},this.onDone=()=>{this.closeMenu(),this.done.emit()},this.onGoBack=()=>{this.rootMenu.goBack()}}componentWillLoad(){this.updateMobileState(),this.updateLevel(),this.observeSlotChanges()}componentDidLoad(){this.mobileMediaQuery.addEventListener("change",this.mediaQueryHandler),this.parentMenu=u(this.el.parentElement,"swirl-menu"),this.swirlPopover=u(this.el,"swirl-popover"),this.rootMenu=d(this.el,"swirl-menu").pop(),Boolean(this.parentMenu)&&queueMicrotask((()=>{this.active=!1})),this.swirlPopover.addEventListener("popoverClose",this.resetMenu),this.updateItems()}disconnectedCallback(){this.swirlPopover?.removeEventListener("popoverClose",this.resetMenu),this.mobileMediaQuery.removeEventListener?.("change",this.mediaQueryHandler),this.observer?.disconnect()}watchActive(){this.reposition(),this.disableAutoUpdate&&this.disableAutoUpdate(),this.disableAutoUpdate=a(this.el.parentElement,this.menuContainer,this.reposition)}watchValue(){this.updateActiveItem()}async activateMenuItem(t){if(Boolean(this.parentMenu))return;const i=await t.getParentMenu(),e=m(this.el,"swirl-menu").filter((t=>t.level>=i.level&&t!==i));e.forEach((t=>{t.active=!1,t.parentElement.expanded=!1}));const s=await t.getSubMenu();Boolean(s)&&(t.expanded=!0,s.active=!0,this.activeLevel=s.level,setTimeout((()=>{s.focusFirstItem()}),this.mobile?200:60))}async close(){this.closeMenu()}async goBack(){if(Boolean(this.parentMenu)||0===this.activeLevel)return;const t=(m(this.el,"swirl-menu").find((t=>t.level===this.activeLevel&&t.active))||this.rootMenu).parentElement;t.expanded=!1,this.activeLevel=Math.max(this.activeLevel-1,0),m(this.el,"swirl-menu").filter((t=>t.level>this.activeLevel)).forEach((t=>{t.active=!1})),(m(this.el,"swirl-menu").find((t=>t.level===this.activeLevel&&t.active))||this.rootMenu).focusItemAtIndex(Array.from(t.parentElement.children).indexOf(t))}async focusFirstItem(){this.focusItem(this.items[0])}async focusItemAtIndex(t){this.focusItem(this.items[t])}async updateSelection(t){this.valueChange.emit(t.value)}async updateActiveItem(){m(this.el,"swirl-menu-item").filter((t=>u(t,"swirl-menu")===this.el)).forEach((t=>{t.updateValue()})),this.parentMenu&&"action"===this.parentMenu.variant&&this.parentMenu.updateActiveItem()}observeSlotChanges(){this.observer=new MutationObserver((()=>{requestAnimationFrame((()=>{this.updateItems()}))})),this.observer.observe(this.el,{childList:!0})}updateMobileState(){const t=b();t!==this.mobile&&(this.mobile=t)}updateItems(){this.items=[...m(this.el,'[role="menuitem"]'),...m(this.el,'[role="menuitemradio"]')].filter((t=>u(t,"swirl-menu")===this.el))}updateLevel(){const t=d(this.el.parentNode,"swirl-menu");this.level=t.length}focusItem(t){[...m(this.rootMenu,'[role="menuitem"]'),...m(this.rootMenu,'[role="menuitemradio"]')].forEach((t=>{t.tabIndex=-1})),Boolean(t)&&(t.tabIndex=0,t.focus())}focusNextItem(){const t=this.getActiveItemIndex();this.focusItem(this.items[(t+1)%this.items.length])}focusPreviousItem(){const t=this.getActiveItemIndex();this.focusItem(this.items[0===t?this.items.length-1:t-1])}getActiveItemIndex(){const t=f();return this.items.findIndex((i=>i===t||i===t?.querySelector('[role="menuitem"]')||i===t?.querySelector('[role="menuitemradio"]')))}render(){const t=!Boolean(this.parentMenu),i=t&&this.mobile?void 0:this.label,n=t&&this.mobile?"menu-title":void 0,o=t?"menubar":"menu",a=c("menu",`menu--level-${this.level}`,{"menu--active":this.active,"menu--mobile":this.mobile,"menu--root":t});return e(s,{key:"ff7dc78b34de44f75761e3fef892a664dda325d4"},e("div",{key:"96de7c486cbe4993f13f778b30009440eb10438b",class:a},this.mobile&&t&&e("div",{key:"9a6d7bfe576f5b206523fc5faaa55d8fa600f07a",class:"menu__mobile-header"},0===this.activeLevel&&e("swirl-button",{key:"09c69f7b6a959f014d7c950f2c4c70016f4cb35a",hideLabel:!0,icon:"<swirl-icon-close></swirl-icon-close>",label:this.mobileCloseMenuButtonLabel,onClick:this.onClose,variant:"plain"}),this.activeLevel>0&&e("swirl-button",{key:"dfc166ee814c57f741489a55f69436c3d9ff77f6",hideLabel:!0,icon:"<swirl-icon-chevron-left></swirl-icon-chevron-left>",label:this.mobileBackButtonLabel,onClick:this.onGoBack,variant:"plain"}),e("span",{key:"575bccde2daa0210f8654d22df9507212f72471d",class:"menu__title",id:"menu-title"},e("swirl-heading",{key:"3d03690f27e4edeba985187c7c1b82ae127d6abe",align:"center",as:"span",level:4,text:this.label,truncate:!0})),e("swirl-button",{key:"3f60b1d2bbb17d60cd31e4df37ee533cac4b7601",class:"menu__done-button",intent:"primary",label:this.mobileDoneButtonLabel,onClick:this.onDone})),e("div",{key:"657fa5c11b3189197dfc552b0f0753d3560164cd","aria-label":i,"aria-labelledby":n,"aria-orientation":"vertical",class:"menu__menu",onKeyDown:this.onKeyDown,ref:t=>this.menuContainer=t,role:o,style:!this.mobile&&this.level>0?{top:Boolean(this.position)?`${this.position?.y}px`:"",left:Boolean(this.position)?`${this.position?.x}px`:""}:this.mobile?{left:t?`calc(-100% * ${this.activeLevel})`:"100%"}:void 0},e("slot",{key:"05b7c154737d2245d4623ab6898a93e279068cab"}))))}get el(){return n(this)}static get watchers(){return{active:["watchActive"],value:["watchValue"]}}};p.style=":host{display:block}:host *{box-sizing:border-box}.menu{width:100%;--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)}.menu--mobile.menu--root{position:relative}.menu--mobile.menu--root .menu__menu{top:3.5rem;transition:left 0.2s}.menu--mobile.menu--active .menu__menu{display:block}.menu--mobile .menu__menu{position:absolute;top:0;left:0;display:none;width:100%}:not(.menu--mobile).menu--root{position:relative}:not(.menu--mobile).menu--root .menu__menu{position:relative;padding-top:0;padding-bottom:0}:not(.menu--mobile):not(.menu--root) .menu__menu{z-index:1;max-width:22.5rem;border-radius:var(--s-border-radius-base);box-shadow:var(--s-shadow-level-1);padding:var(--s-space-4)}:not(.menu--mobile).menu--active .menu__menu{display:block}:not(.menu--mobile) .menu__menu{position:fixed;display:none}.menu__mobile-header{display:flex;height:3.5rem;padding-right:var(--s-space-16);padding-left:var(--s-space-16);justify-content:space-between;align-items:center;border-bottom:var(--s-border-width-default) solid var(--s-border-default);gap:var(--s-space-8)}.menu__mobile-header>*{display:inline-flex;flex-shrink:0}.menu__title{min-width:0;flex-grow:1;flex-shrink:1}.menu__title swirl-heading{min-width:0}.menu__done-button{margin-right:calc(-1 * var(--s-space-8))}.menu__menu{background-color:var(--s-surface-overlay-default);}";export{p as swirl_menu}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{r,c as i,h as a,H as d}from"./p-Dj_4Fda9.js";import{c as o}from"./p-orsBiyT_.js";const s=class{constructor(a){r(this,a),this.valueChange=i(this,"valueChange",7),this.checked=!1,this.disabled=!1,this.variant="default",this.onChange=()=>{this.checked=!0,this.valueChange.emit(this.value)}}getAriaCheckedLabel(r,i){return r?"true":i?"false":"mixed"}render(){const r=!1===this.checked||"false"===this.checked,i=!0===this.checked||"true"===this.checked,s=this.getAriaCheckedLabel(i,r),e=this.invalid,c=o("radio",`radio--variant-${this.variant}`,{"radio--checked":i,"radio--disabled":this.disabled,"radio--invalid":this.invalid,"radio--unchecked":r});return a(d,{key:"b9e64b24cee436738b154cfcbd2cf01cbeb6a728",style:{width:"card"===this.variant?"100%":void 0}},a("label",{key:"60eeca9a2146478f9ede706d56fc51b728eda97f",class:c,htmlFor:this.inputId},a("span",{key:"934171e05fca6b1f936deb73e4ad490b17791a8d",class:"radio__control"},a("swirl-visually-hidden",{key:"6617f95f516cb4b9c18e6a0636a6c440cb0dba82"},a("input",{key:"68ecf60b1873b5c56c1a862876840d5b74de8899","aria-checked":s,"aria-invalid":e,checked:i,class:"radio__input",disabled:this.disabled,id:this.inputId,name:this.inputName,onChange:this.onChange,type:"radio",value:this.value})),a("span",{key:"0fc478b4cee70968250beabef24895b1ac457247","aria-hidden":"true",class:"radio__box"})),a("span",{key:"c6a282ffdb707275f3c51603107a61ddc59a0114",class:"radio__label-container"},this.label&&a("span",{key:"fe8df563b595badc02fa36c3becbe58925a75c4d",class:"radio__label"},this.label,this.tooltip&&a("swirl-tooltip",{key:"2e619d4527c2908959f35e241c7e703c699d43c3",content:this.tooltip,position:"top"},a("swirl-icon-help",{key:"7c2d8e70450d7fdac7a1520dbd990a2879befa36",color:"default",size:20,tabIndex:0}))),this.description&&a("span",{key:"c57f52cdf180822ddfdf096a92607e4a9236f65b",class:"radio__description",innerHTML:this.description}))))}};s.style='.sc-swirl-radio-h{display:inline-flex}.sc-swirl-radio-h *.sc-swirl-radio{box-sizing:border-box}.radio.sc-swirl-radio{display:inline-flex;line-height:var(--s-line-height-base);cursor:pointer;align-items:center}.radio.sc-swirl-radio:focus-within .radio__box.sc-swirl-radio{box-shadow:0 0 0 0.0625rem var(--s-background-default),\n 0 0 0 0.1875rem var(--s-focus-default)}.radio--variant-card.sc-swirl-radio{width:100%;padding:var(--s-space-16);border:0.0625rem solid var(--s-border-default);border-radius:var(--s-border-radius-sm);background-color:var(--s-surface)}.radio--variant-card.sc-swirl-radio:focus-within{box-shadow:0 0 0 0.125rem var(--s-background-default),\n 0 0 0 0.25rem var(--s-focus-default)}.radio--variant-card.sc-swirl-radio:focus-within .radio__box.sc-swirl-radio{box-shadow:none}.radio--variant-card.sc-swirl-radio:hover:not(.radio--disabled){background-color:var(--s-surface-hovered)}.radio--variant-card.sc-swirl-radio:active:not(.radio--disabled){background-color:var(--s-surface-pressed)}.radio--variant-card.radio--checked.sc-swirl-radio:not(.radio--disabled){border-color:var(--s-border-highlight)}.radio--variant-card.radio--invalid.sc-swirl-radio:not(.radio--disabled){border-color:var(--s-border-critical)}.radio--checked.sc-swirl-radio .radio__control.sc-swirl-radio:hover .radio__box.sc-swirl-radio{border-color:var(--s-interactive-primary-hovered);background-color:var(--s-interactive-primary-hovered)}.radio--checked.sc-swirl-radio .radio__box.sc-swirl-radio{position:relative;border-color:var(--s-icon-highlight);background-color:var(--s-icon-highlight)}.radio--checked.sc-swirl-radio .radio__box.sc-swirl-radio:after{position:absolute;top:50%;left:50%;width:0.5rem;height:0.5rem;border-radius:50%;background-color:var(--s-background-default);content:"";transform:translate3d(-50%, -50%, 0)}.radio--invalid.radio--checked.sc-swirl-radio .radio__box.sc-swirl-radio,.radio--invalid.radio--indeterminate.sc-swirl-radio .radio__box.sc-swirl-radio{background-color:var(--s-icon-critical)}.radio--invalid.sc-swirl-radio .radio__box.sc-swirl-radio{border-color:var(--s-icon-critical)}.radio--disabled.sc-swirl-radio{cursor:default}.radio--disabled.radio--checked.sc-swirl-radio .radio__control.sc-swirl-radio:hover .radio__box.sc-swirl-radio{border-color:var(--s-icon-disabled);background-color:transparent}.radio--disabled.radio--checked.sc-swirl-radio .radio__box.sc-swirl-radio{border-color:var(--s-icon-disabled);background-color:var(--s-background-default)}.radio--disabled.radio--checked.sc-swirl-radio .radio__box.sc-swirl-radio:after{background-color:var(--s-icon-disabled)}.radio--disabled.sc-swirl-radio .radio__control.sc-swirl-radio:hover .radio__box.sc-swirl-radio{background-color:transparent}.radio--disabled.sc-swirl-radio .radio__box.sc-swirl-radio{border-color:var(--s-icon-disabled)}.radio--disabled.sc-swirl-radio .radio__description.sc-swirl-radio,.radio--disabled.sc-swirl-radio .radio__label.sc-swirl-radio{color:var(--s-text-disabled)}.radio__control.sc-swirl-radio{position:relative;display:inline-flex;width:1.5rem;height:1.5rem;padding:var(--s-space-2);flex-shrink:0}.radio__control.sc-swirl-radio:hover .radio__box.sc-swirl-radio{background-color:var(--s-action-neutral-hovered)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.radio__control.sc-swirl-radio{width:1.375rem;height:1.375rem}}.radio__box.sc-swirl-radio{position:relative;display:flex;width:100%;height:100%;justify-content:center;align-items:center;border:0.125rem solid var(--s-icon-default);border-radius:50%}.radio__label-container.sc-swirl-radio{display:inline-flex;margin-left:var(--s-space-8);padding-top:var(--s-space-2);flex-direction:column}.radio__label.sc-swirl-radio{display:flex;align-items:center;font-weight:var(--s-font-weight-medium);gap:var(--s-space-8)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.radio__label.sc-swirl-radio{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.radio__description.sc-swirl-radio{color:var(--s-text-subdued)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.radio__description.sc-swirl-radio{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}';export{s as swirl_radio}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{r as i,h as n,H as e}from"./p-Dj_4Fda9.js";import{c as o}from"./p-orsBiyT_.js";const a=class{constructor(n){i(this,n),this.importance="status",this.intent="info",this.borderRadius="sm"}render(){const i=o("inline-notification",`inline-notification--intent-${this.intent}`,`inline-notification--border-radius-${this.borderRadius}`);return n(e,{key:"fa77165ae472bd850f4294c37d70a2a2e4eee257"},n("div",{key:"78e2776eb474fafdfca1cb5e02d67edb21241be6","aria-describedby":"content",class:i,role:this.importance,tabIndex:0},n("span",{key:"752a158ce2060bf763574422e5d06a4d312f1d59","aria-hidden":"true",class:"inline-notification__icon"},"critical"===this.intent&&n("swirl-icon-error",{key:"5d0ba503015f47244c430485d19f0c38f6d88d49",size:20}),"success"===this.intent&&n("swirl-icon-check-circle",{key:"995699baa483bc94bb9fcd86a461c486f7ef446d",size:20}),"warning"===this.intent&&n("swirl-icon-warning",{key:"618ebb5ee867ba4932bc19ee8f3a368508144358",size:20}),"info"===this.intent&&n("swirl-icon-info",{key:"3e1b266041aa3a0ff3e13dfd5f7b39324608bad2",size:20})),n("span",{key:"d7617d90c119750a919bf053f89d7961bab594b5",class:"inline-notification__content",id:"content"},this.hideHeading&&n("swirl-visually-hidden",{key:"cc536e61d82dc0c9e51502215a52bac58e442275"},this.heading)||n("swirl-text",{key:"f736c7954dc61999c8540ff826f9270f8ecb58f0",class:"inline-notification__heading",size:"sm",weight:"semibold"},this.heading),n("slot",{key:"47667315c5fdf48ca4127f2afa1cf5e93e2c1cf6"}))))}};a.style=":host{display:block}:host *{box-sizing:border-box}.inline-notification{display:flex;max-width:100%;padding:var(--s-space-12);gap:var(--s-space-8)}@media (min-width: 768px){.inline-notification{padding:var(--s-space-16)}}.inline-notification--border-radius-xs{border-radius:var(--s-border-radius-xs)}.inline-notification--border-radius-sm{border-radius:var(--s-border-radius-sm)}.inline-notification--intent-info{background-color:var(--s-surface-info-subdued)}.inline-notification--intent-info .inline-notification__icon{color:var(--s-icon-info)}.inline-notification--intent-critical{background-color:var(--s-surface-critical-subdued)}.inline-notification--intent-critical .inline-notification__icon{color:var(--s-icon-critical)}.inline-notification--intent-warning{background-color:var(--s-surface-warning-subdued)}.inline-notification--intent-warning .inline-notification__icon{color:var(--s-icon-warning)}.inline-notification--intent-success{background-color:var(--s-surface-success-subdued)}.inline-notification--intent-success .inline-notification__icon{color:var(--s-icon-success)}.inline-notification__icon{display:inline-flex;flex-shrink:0}.inline-notification__content{position:relative;top:0.0625rem;font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}";export{a as swirl_inline_notification}
|