@getflip/swirl-components-react 0.456.0 → 0.456.1-beta-20260305113737
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.
|
@@ -11140,7 +11140,8 @@ const T6 = "yyyy-MM-dd", av = _(class extends x {
|
|
|
11140
11140
|
super(), e !== !1 && this.__registerHost(), this.__attachShadow(), this.dialogClose = U(this, "dialogClose", 7), this.dialogOpen = U(this, "dialogOpen", 7), this.primaryAction = U(this, "primaryAction", 7), this.secondaryAction = U(this, "secondaryAction", 7), this.toggleDialog = U(this, "toggleDialog", 7), this.intent = "primary", this.closing = !1, this.opening = !1, this.onClose = () => {
|
|
11141
11141
|
this.closing = !1, this.dialogClose.emit();
|
|
11142
11142
|
}, this.onToggle = (t) => {
|
|
11143
|
-
|
|
11143
|
+
const r = { newState: t.newState, dialog: this.dialogEl };
|
|
11144
|
+
this.el.isConnected ? this.toggleDialog.emit(r) : document.dispatchEvent(new CustomEvent("toggleDialog", { bubbles: !0, composed: !0, detail: r }));
|
|
11144
11145
|
}, this.onKeyDown = (t) => {
|
|
11145
11146
|
t.code === "Escape" && (t.stopImmediatePropagation(), t.preventDefault(), this.close());
|
|
11146
11147
|
}, this.onBackdropClick = () => {
|
|
@@ -11183,7 +11184,7 @@ const T6 = "yyyy-MM-dd", av = _(class extends x {
|
|
|
11183
11184
|
}
|
|
11184
11185
|
render() {
|
|
11185
11186
|
const e = L("dialog", { "dialog--closing": this.closing }), t = !!this.el.querySelector('[slot="left-controls"]');
|
|
11186
|
-
return o(X, { key: "
|
|
11187
|
+
return o(X, { key: "aed27fd60b073318b2bd447fbdea62b28a27b2bb" }, o("dialog", { key: "717b703063cc4f7dc4d6ebd0cb4e32cdd41fc6da", "aria-describedby": "content", "aria-labelledby": this.hideLabel ? void 0 : "label", "aria-label": this.hideLabel ? this.label : void 0, class: e, onClose: this.onClose, onKeyDown: this.onKeyDown, onToggle: this.onToggle, role: "alertdialog", ref: (r) => this.dialogEl = r }, o("div", { key: "11cff9977346162bc0e379a2c6b12860efa9756e", class: "dialog__backdrop", onClick: this.onBackdropClick }), o("div", { key: "c537c3eaeb2688e7829163f1bb855f803fbd22b2", class: "dialog__body", part: "dialog__body", role: "document" }, !this.hideLabel && o("h2", { key: "b673f936615fff1714137c5e3a0047e153103e2d", class: "dialog__heading", part: "dialog__heading", id: "label" }, this.label), o("div", { key: "6078b644042f60e89dfe55debeb8aad6a80bed34", class: "dialog__content", part: "dialog__content", id: "content" }, o("slot", { key: "708bb8495998e1b91cebf23c4aba27d6225bdbe6" })), o("div", { key: "b47c30c0db1a42257dd198a985fd3c26bcad4094", class: "dialog__controls" }, t && o("div", { key: "bc4cdcd98a8e57faa1f182ff8a85b261e7757c22", class: "dialog__left_controls" }, o("slot", { key: "c3fc5d235a740e1bbd5e8e5b19fb5901188f82d2", name: "left-controls" })), this.secondaryActionLabel && o("swirl-button", { key: "f728634b91e50864b1179267da1d465efae28f2a", label: this.secondaryActionLabel, onClick: this.onSecondaryAction }), this.primaryActionLabel && o("swirl-button", { key: "87f838d8b11dfa270ba12c02a981b855029cf69c", intent: this.intent, label: this.primaryActionLabel, onClick: this.onPrimaryAction, variant: "flat" })))));
|
|
11187
11188
|
}
|
|
11188
11189
|
get el() {
|
|
11189
11190
|
return this;
|
|
@@ -29743,7 +29744,8 @@ const vE = _(class extends x {
|
|
|
29743
29744
|
}, this.onClose = () => {
|
|
29744
29745
|
this.closing = !1, this.unlockBodyScroll(), this.modalClose.emit();
|
|
29745
29746
|
}, this.onToggle = (t) => {
|
|
29746
|
-
|
|
29747
|
+
const r = { newState: t.newState, dialog: this.modalEl };
|
|
29748
|
+
this.el.isConnected ? this.toggleDialog.emit(r) : document.dispatchEvent(new CustomEvent("toggleDialog", { bubbles: !0, composed: !0, detail: r }));
|
|
29747
29749
|
}, this.onBackdropClick = () => {
|
|
29748
29750
|
this.close();
|
|
29749
29751
|
}, this.onCloseButtonClick = () => {
|
|
@@ -29846,7 +29848,7 @@ const vE = _(class extends x {
|
|
|
29846
29848
|
}
|
|
29847
29849
|
render() {
|
|
29848
29850
|
const e = !!this.primaryActionLabel || !!this.secondaryActionLabel, t = L("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 });
|
|
29849
|
-
return o(X, { key: "
|
|
29851
|
+
return o(X, { key: "5d7e303e02d067ed79ee08245beeb3505b23d0c8" }, o("dialog", { key: "499c2d3cf4d1db9c814fbd08de35103c653d8f53", "aria-label": this.label, class: t, onClose: this.onClose, onKeyDown: this.onKeyDown, onToggle: this.onToggle, ref: (r) => this.modalEl = r }, o("div", { key: "fdafa4289dc0e7b1c52f7aba9a78e59e5461b4c3", class: "modal__backdrop", onClick: this.onBackdropClick }), o("div", { key: "d32e5cf93fd3527fa8959a07c489809bf3b5d524", 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: "e0d0d96518649aca453d6ae1859d63c7476d0a16", class: "modal__sidebar" }, this.sidebarLabel && o("header", { key: "7ddd6756a831afdf032390da6252810050118818", class: L("modal__sidebar-header", { "modal__sidebar-header--has-close-button": this.hasSidebarCloseButton }) }, this.hasSidebarCloseButton && o("swirl-button", { key: "512cebb0e33e605045841149b23a20242f32cb1f", hideLabel: !0, icon: "<swirl-icon-double-arrow-right></swirl-icon-double-arrow-right>", label: this.sidebarCloseButtonLabel, onClick: this.onSidebarCloseButtonClick }), o("swirl-heading", { key: "c644af6fa65c441cb5561dbaf524b52887132501", as: "h3", class: "modal__sidebar-heading", level: 5, text: this.sidebarLabel })), o("div", { key: "4195cc1058fc42910fbf2827fa62315391870d69", class: "modal__sidebar-content", onScroll: this.determineSidebarScrollStatus, ref: (r) => this.sidebarScrollContainer = r }, o("slot", { key: "621611853e79dd708997fbd79b2378a0e76f5560", name: "sidebar-content" })), o("div", { key: "8c2639486b76993821009975a0cffceb619ff665", class: "modal__sidebar-footer", part: "modal__sidebar-footer" }, o("slot", { key: "51bbc2dff3eebdd9ad2ffbd67c6f97f192d5a1b8", name: "sidebar-footer" }))), o("div", { key: "2ce672d9d91a657d900cb7b467c67d1141d25af2", class: "modal__main-content" }, o("header", { key: "1deb15b62f8d97fcfc2dcff227a1c4f7810e96c1", class: "modal__custom-header", part: "modal__custom-header" }, o("slot", { key: "971bab2b2bf9702423a0029e1377c92f27031216", name: "custom-header" })), (!this.hideLabel || !this.hideCloseButton) && o("header", { key: "f79ba8354749823c6ecff8d16a69a0692bc91116", class: "modal__header" }, o("div", { key: "5a782f2522d504b3159ad4dd16169ba559985c4d", class: "modal__header-bar" }, !this.hideCloseButton && o("swirl-button", { key: "d5ce47698af572d9c496e57166d2fd7758ba2501", class: "modal__close-button", hideLabel: !0, 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 && o("swirl-button", { key: "12158b9b8e9e198d50f9bfe1966d0647fc4c8d42", 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: "eb66384e6bdd0591720155f875d7c8113d47bf40", as: "h2", class: "modal__heading", level: 3, text: this.label }))), o("div", { key: "cc0c0a5b1f8eadbf37e2ba0876481a68fbb213c2", class: "modal__content-container", style: { gap: this.contentGap ? `var(--s-space-${this.contentGap})` : void 0 } }, o("div", { key: "4a540785ad16b194d2bf912c987854ef0aefaeb8", class: "modal__primary-content", style: { maxWidth: this.primaryContentMaxWidth, flex: this.primaryContentFlex } }, o("div", { key: "95f7eb2354c5449b18f432a07c4912491ed701ab", class: "modal__header-tools", part: "modal__header-tools" }, o("slot", { key: "1d60b63d1000042a1448ee0244ccbd31d42bf8a2", name: "header-tools" })), o("div", { key: "4d16d27052062e70f03fa81bc01bbfea0c0805ba", class: "modal__content", onScroll: this.determineMainScrollStatus, part: "modal__content", ref: (r) => this.scrollContainer = r }, o("slot", { key: "05d0c4d3a5430691ca9e5074db7ef3e3ad37e03d" }))), o("div", { key: "78deb8ecfbacb2577219ee0859a45a5da7f93d8b", class: "modal__secondary-content", style: { maxWidth: this.secondaryContentMaxWidth, flex: this.secondaryContentFlex, padding: this.secondaryContentPadding ? `var(--s-space-${this.secondaryContentPadding})` : void 0, paddingBlockEnd: this.secondaryContentPaddingBlockEnd ? `var(--s-space-${this.secondaryContentPaddingBlockEnd})` : void 0, paddingBlockStart: this.secondaryContentPaddingBlockStart ? `var(--s-space-${this.secondaryContentPaddingBlockStart})` : void 0, paddingInlineEnd: this.secondaryContentPaddingInlineEnd ? `var(--s-space-${this.secondaryContentPaddingInlineEnd})` : void 0, paddingInlineStart: this.secondaryContentPaddingInlineStart ? `var(--s-space-${this.secondaryContentPaddingInlineStart})` : void 0 } }, o("slot", { key: "cd72bf9a5874503c9bc7b17733b6fbe84ce6cae4", name: "secondary-content" }))), o("div", { key: "0ca496f691300e9fbc4ee6a6b867b6501c1f292a", class: "modal__custom-footer" }, o("slot", { key: "e428f004ed058339b520198f110064e625f8e03b", name: "custom-footer" })), e && o("footer", { key: "d457989e84d2e354abd444f27458dab14021cb8b", class: "modal__controls" }, o("swirl-button-group", { key: "74b3bba2bb32d70f080de8f7e212385805fc1a49", wrap: !0 }, this.secondaryActionLabel && o("swirl-button", { key: "7fcfe9e269a81e0fcb9039a52071878c58951a78", label: this.secondaryActionLabel, onClick: this.onSecondaryAction }), this.primaryActionLabel && o("swirl-button", { key: "da1cb3c478d8f0d8bf41c4e6adfd76d2e16966ec", intent: "primary", label: this.primaryActionLabel, onClick: this.onPrimaryAction, variant: "flat" })))))));
|
|
29850
29852
|
}
|
|
29851
29853
|
get el() {
|
|
29852
29854
|
return this;
|
|
@@ -33970,11 +33972,12 @@ const yM = _(class extends x {
|
|
|
33970
33972
|
this.activeDialogStack = this.activeDialogStack.filter((t) => t != e), this.toasts.length > 0 && this.ensureCorrectPosition();
|
|
33971
33973
|
}
|
|
33972
33974
|
ensureCorrectPosition() {
|
|
33975
|
+
this.activeDialogStack = this.activeDialogStack.filter((t) => t.isConnected);
|
|
33973
33976
|
const e = this.activeDialogStack[this.activeDialogStack.length - 1] || this.originalParent;
|
|
33974
33977
|
this.el.parentElement !== e && e.appendChild(this.el), this.popoverEl.hidePopover(), this.popoverEl.showPopover();
|
|
33975
33978
|
}
|
|
33976
33979
|
render() {
|
|
33977
|
-
return o(X, { key: "
|
|
33980
|
+
return o(X, { key: "b814bfac33e13fa660a10ec5d29f5f45fbac8f8d", role: "status" }, o("swirl-stack", { key: "03972a88936dfd3697335295381889095f6fb3a8", class: "toast-provider__stack", part: "toast-provider__stack", popover: "manual", spacing: "12", align: "center", ref: (e) => this.popoverEl = e }, this.toasts.map((e) => {
|
|
33978
33981
|
const t = { ...e, content: void 0, onDismiss: void 0, onAction: void 0 };
|
|
33979
33982
|
return o("swirl-toast", { key: e.toastId, ...t, onDismiss: this.onDismiss, onAction: this.onAction }, e.content);
|
|
33980
33983
|
})));
|