admin-ui-starter-kit 0.4.2 → 0.4.4

package/dist/_shared/overlays-CJs_syAu.js

@@ -0,0 +1,648 @@
+import { useStrings as e } from "../lib/strings.js";
+import { cn as t } from "../lib/utils.js";
+import { t as n } from "./button-BGKY8UY0.js";
+import { n as r } from "./heading-HeP06nXG.js";
+import { cloneElement as i, isValidElement as a, memo as o, useCallback as s, useEffect as c, useId as l, useMemo as u, useRef as d, useState as f } from "react";
+import { Fragment as p, jsx as m, jsxs as h } from "react/jsx-runtime";
+import { AlertCircle as g, AlertTriangle as _, CheckCircle as v, HelpCircle as y, Info as b, X as x } from "lucide-react";
+import { createPortal as S } from "react-dom";
+//#region src/components/features/overlays/hooks/use-native-dialog.ts
+var ee = 350, C = 0;
+function w() {
+	if (C === 0) {
+		let e = window.innerWidth - document.documentElement.clientWidth;
+		document.body.style.setProperty("--overlay-scrollbar-width", `${e}px`), document.documentElement.setAttribute("data-overlay-scroll-locked", "");
+	}
+	C += 1;
+	let e = !1;
+	return () => {
+		e || (e = !0, C = Math.max(0, C - 1), !(C > 0) && (document.documentElement.removeAttribute("data-overlay-scroll-locked"), document.body.style.removeProperty("--overlay-scrollbar-width")));
+	};
+}
+function T({ open: e, onOpenChange: t, onClose: n, closeOnEscape: r = !0, closeOnBackdropClick: i = !0, initialFocusRef: a } = {}) {
+	let o = d(null), [l, u] = f(!1), [p, m] = f(!1), h = d(null), g = d(null), _ = d(null), v = d(null), y = d(null), b = d(!1), x = e !== void 0, S = x ? e : l, C = d(S);
+	C.current = S;
+	let T = d(p);
+	T.current = p;
+	let E = s((e) => {
+		x || u(e), t?.(e), e || n?.();
+	}, [
+		x,
+		t,
+		n
+	]), D = s(() => {
+		_.current &&= (clearTimeout(_.current), null), v.current &&= (v.current(), null);
+	}, []), O = s(() => {
+		D(), b.current = !0;
+		let e = h.current;
+		h.current = null;
+		let t = g.current;
+		g.current = null;
+		try {
+			e?.();
+		} catch {}
+		try {
+			E(!1);
+		} catch {}
+		m(!1);
+		let n = o.current;
+		n && n.classList.remove("closing");
+		try {
+			t?.focus();
+		} catch {}
+	}, [D, E]), k = s(() => {
+		C.current || T.current || (g.current = document.activeElement, h.current = w(), E(!0), y.current = requestAnimationFrame(() => {
+			y.current = null, a?.current ? a.current.focus() : o.current?.focus();
+		}));
+	}, [E, a]), A = s(() => {
+		let e = o.current;
+		if (!(!e || !C.current || T.current)) if (m(!0), e.classList.add("closing"), e.offsetHeight, getComputedStyle(e).animationName !== "none") {
+			let t = () => {
+				O();
+			};
+			e.addEventListener("animationend", t, { once: !0 }), v.current = () => {
+				e.removeEventListener("animationend", t);
+			}, _.current = setTimeout(() => {
+				O();
+			}, ee);
+		} else O();
+	}, [O]), j = s(() => {
+		S ? A() : k();
+	}, [
+		S,
+		k,
+		A
+	]), M = s((e) => {
+		e.key === "Escape" && r && (e.preventDefault(), e.stopPropagation(), A());
+	}, [r, A]), N = s(() => {
+		i && A();
+	}, [i, A]);
+	return c(() => {
+		if (S && !p) g.current ||= document.activeElement, h.current ||= w(), y.current !== null && cancelAnimationFrame(y.current), y.current = requestAnimationFrame(() => {
+			y.current = null, a?.current ? a.current.focus() : o.current?.focus();
+		});
+		else if (!S) {
+			if (b.current) {
+				b.current = !1;
+				return;
+			}
+			if (h.current &&= (h.current(), null), p) {
+				D(), m(!1);
+				let e = o.current;
+				e && e.classList.remove("closing");
+			}
+			if (g.current) {
+				try {
+					g.current.focus();
+				} catch {}
+				g.current = null;
+			}
+		}
+		return () => {
+			y.current !== null && (cancelAnimationFrame(y.current), y.current = null);
+		};
+	}, [
+		S,
+		p,
+		a,
+		D
+	]), c(() => () => {
+		D(), y.current !== null && (cancelAnimationFrame(y.current), y.current = null), h.current &&= (h.current(), null);
+	}, [D]), {
+		dialogRef: o,
+		isOpen: S,
+		isClosing: p,
+		openDialog: k,
+		closeDialog: A,
+		toggleDialog: j,
+		dialogProps: {
+			ref: o,
+			open: S,
+			onKeyDown: M
+		},
+		handleBackdropClick: N
+	};
+}
+//#endregion
+//#region src/components/features/overlays/overlays.strings.ts
+var E = {
+	confirm: "Confirm",
+	cancel: "Cancel",
+	close: "Close",
+	loading: "Loading..."
+}, D = {
+	confirm: "Continue",
+	cancel: "Cancel",
+	close: "Close",
+	loading: "Loading..."
+};
+//#endregion
+//#region src/components/features/overlays/hooks/use-overlay-actions.ts
+function O({ closeDialog: t, onConfirm: n, onAsyncConfirm: r, closeOnAsyncComplete: i = !0, confirmVariant: a = "primary", isLoading: o = !1, formId: c, onCancel: l, customStrings: d, emphasis: p = !1, tone: m = "default", onError: h }) {
+	let g = e(E, d), [_, v] = f(!1), y = s(async () => {
+		if (n) {
+			n(), t();
+			return;
+		}
+		if (r) {
+			v(!0);
+			try {
+				await r(), i && t();
+			} catch (e) {
+				h?.(e);
+			} finally {
+				v(!1);
+			}
+			return;
+		}
+		t();
+	}, [
+		n,
+		r,
+		i,
+		t,
+		h
+	]), b = s(() => {
+		l?.(), t();
+	}, [l, t]), x = s(async () => {
+		if (!c) return;
+		let e = document.getElementById(c);
+		e instanceof HTMLFormElement && e.requestSubmit();
+	}, [c]);
+	return {
+		strings: g,
+		isExecuting: _,
+		handleConfirm: y,
+		handleCancel: b,
+		finalConfirmVariant: u(() => p ? m === "error" ? "error" : m === "warning" ? "warning" : m === "success" ? "success" : a ?? "primary" : a ?? "primary", [
+			p,
+			m,
+			a
+		]),
+		confirmButtonOnClick: c ? x : y,
+		effectiveLoading: _ || o
+	};
+}
+//#endregion
+//#region src/components/features/overlays/dialog.tsx
+var k = {
+	xs: "max-w-xs",
+	sm: "max-w-sm",
+	md: "max-w-md",
+	lg: "max-w-lg",
+	xl: "max-w-xl",
+	"2xl": "max-w-2xl",
+	"3xl": "max-w-3xl",
+	"4xl": "max-w-4xl",
+	"5xl": "max-w-5xl",
+	full: "max-w-[calc(100vw-2rem)]"
+}, A = {
+	default: {
+		icon: /* @__PURE__ */ m(y, { className: "text-muted-foreground h-5 w-5" }),
+		classes: ""
+	},
+	error: {
+		icon: /* @__PURE__ */ m(g, { className: "text-destructive h-5 w-5" }),
+		classes: "border-destructive/50"
+	},
+	warning: {
+		icon: /* @__PURE__ */ m(_, { className: "text-warning h-5 w-5" }),
+		classes: "border-warning/50"
+	},
+	info: {
+		icon: /* @__PURE__ */ m(b, { className: "text-info h-5 w-5" }),
+		classes: "border-info/50"
+	},
+	success: {
+		icon: /* @__PURE__ */ m(v, { className: "text-success h-5 w-5" }),
+		classes: "border-success/50"
+	}
+};
+function j({ open: e, onOpenChange: o, onClose: s, children: c, title: u, description: d, visuallyHideHeader: f = !1, className: g, contentClassName: _, initialFocusRef: v, closeOnEscape: y = !0, closeOnBackdropClick: b = !0, strings: ee, showCancel: C = !0, showConfirm: w = !0, onCancel: E, onConfirm: D, onAsyncConfirm: j, closeOnAsyncComplete: M = !0, confirmVariant: N = "primary", confirmStyle: te = "solid", isLoading: ne = !1, formId: re, footer: P, emphasis: F = !1, tone: I = "default", showIcon: L = !1, alertMessage: R, size: z = "lg", trigger: B }) {
+	let V = l(), H = l(), U = u ? V : void 0, ie = d ? H : void 0, { isOpen: W, isClosing: G, openDialog: K, closeDialog: q, dialogProps: J, handleBackdropClick: Y } = T({
+		open: e,
+		onOpenChange: o,
+		onClose: s,
+		closeOnEscape: y,
+		closeOnBackdropClick: b,
+		initialFocusRef: v
+	}), { strings: X, finalConfirmVariant: ae, confirmButtonOnClick: Z, effectiveLoading: Q, handleCancel: oe } = O({
+		closeDialog: q,
+		onConfirm: D,
+		onAsyncConfirm: j,
+		closeOnAsyncComplete: M,
+		confirmVariant: N,
+		isLoading: ne,
+		formId: re,
+		onCancel: E,
+		customStrings: ee,
+		emphasis: F,
+		tone: I
+	}), se = A[I], ce = !!(c || R), le = C || w || P, $ = B && a(B) ? i(B, { onClick: (e) => {
+		let t = B.props.onClick;
+		t?.(e), K();
+	} }) : B ? /* @__PURE__ */ m("span", {
+		role: "button",
+		tabIndex: 0,
+		onClick: K,
+		onKeyDown: (e) => {
+			(e.key === "Enter" || e.key === " ") && (e.preventDefault(), K());
+		},
+		className: "cursor-pointer",
+		children: B
+	}) : null;
+	return !W && !G && !B ? null : /* @__PURE__ */ h(p, { children: [$, !!(W || G) && S(/* @__PURE__ */ h("div", {
+		className: "fixed inset-0 z-50 flex items-center justify-center p-4",
+		children: [/* @__PURE__ */ m("div", {
+			className: t("absolute inset-0 bg-foreground/50 backdrop-blur-[1px]", "transition-opacity duration-200", G ? "opacity-0" : "animate-in fade-in-0 duration-200"),
+			onClick: Y,
+			"aria-hidden": "true"
+		}), /* @__PURE__ */ h("dialog", {
+			...J,
+			className: t("dialog--component relative z-10 m-0 p-0", "rounded-lg border shadow-lg", "bg-background text-foreground", "max-h-[90vh] w-full", "flex flex-col", k[z], "animate-in fade-in-0 zoom-in-95 duration-200", "[&.closing]:animate-out [&.closing]:fade-out-0 [&.closing]:zoom-out-95 [&.closing]:duration-150", "outline-none focus-visible:outline-none", F && se.classes, g),
+			"aria-modal": "true",
+			role: "dialog",
+			"aria-labelledby": U,
+			"aria-describedby": ie,
+			children: [
+				/* @__PURE__ */ m(n, {
+					type: "button",
+					variant: "secondary",
+					buttonStyle: "ghost",
+					size: "icon-sm",
+					onClick: q,
+					className: t("absolute right-3 top-3 z-10 size-7 rounded-md p-0", "text-muted-foreground transition-colors", "hover:bg-muted hover:text-foreground", "disabled:pointer-events-none"),
+					"aria-label": X.close,
+					children: /* @__PURE__ */ m(x, { className: "h-4 w-4" })
+				}),
+				!!(u || d) && /* @__PURE__ */ h("div", {
+					className: t("flex gap-3 px-6 pb-4 pt-6", L && "items-start", f && "sr-only"),
+					children: [!!L && /* @__PURE__ */ m("div", {
+						className: "shrink-0 pt-0.5",
+						children: se.icon
+					}), /* @__PURE__ */ h("div", {
+						className: "min-w-0 flex-1",
+						children: [!!u && /* @__PURE__ */ m(r, {
+							id: V,
+							tag: "div",
+							size: "lg",
+							weight: "semibold",
+							className: "pr-6",
+							children: u
+						}), !!d && /* @__PURE__ */ m(r, {
+							id: H,
+							tag: "p",
+							type: "secondary",
+							className: "mt-1",
+							children: d
+						})]
+					})]
+				}),
+				!!ce && /* @__PURE__ */ h("div", {
+					className: t("flex-1 overflow-auto px-6", u || d ? f ? "py-6" : "pb-6" : "py-6", _),
+					children: [!!R && /* @__PURE__ */ m("div", {
+						className: t("mb-4 rounded-md border p-3", I === "error" && "border-destructive/30 bg-destructive/5", I === "warning" && "border-warning/40 bg-warning/10", I === "info" && "border-info/40 bg-info/10", I === "success" && "border-success/40 bg-success/10", I === "default" && "border-border bg-muted/40"),
+						children: /* @__PURE__ */ m(r, {
+							tag: "p",
+							children: R
+						})
+					}), c]
+				}),
+				!!le && /* @__PURE__ */ m("div", {
+					className: "border-t px-6 py-4",
+					children: P ?? /* @__PURE__ */ h("div", {
+						className: "flex flex-col-reverse gap-3 sm:flex-row sm:justify-end",
+						children: [!!C && /* @__PURE__ */ m(n, {
+							type: "button",
+							variant: "secondary",
+							buttonStyle: "outline",
+							onClick: oe,
+							children: X.cancel
+						}), !!w && /* @__PURE__ */ m(n, {
+							type: "button",
+							variant: ae,
+							buttonStyle: te,
+							onClick: Z,
+							loading: Q,
+							loadingLabels: { loading: X.loading },
+							children: X.confirm
+						})]
+					})
+				})
+			]
+		})]
+	}), document.body)] });
+}
+var M = o(j);
+M.displayName = "Dialog";
+//#endregion
+//#region src/components/features/overlays/drawer.tsx
+var N = {
+	xs: "max-w-xs",
+	sm: "max-w-sm",
+	md: "max-w-md",
+	lg: "max-w-lg",
+	xl: "max-w-xl",
+	"2xl": "max-w-2xl",
+	"3xl": "max-w-3xl",
+	"4xl": "max-w-4xl",
+	"5xl": "max-w-5xl",
+	full: "max-w-[calc(100vw-2rem)]"
+}, te = {
+	right: {
+		position: "fixed top-0 right-0 bottom-0",
+		size: "h-full",
+		animation: "animate-in slide-in-from-right duration-300 [&.closing]:animate-out [&.closing]:slide-out-to-right [&.closing]:duration-200",
+		rounded: "rounded-l-xl"
+	},
+	left: {
+		position: "fixed top-0 left-0 bottom-0",
+		size: "h-full",
+		animation: "animate-in slide-in-from-left duration-300 [&.closing]:animate-out [&.closing]:slide-out-to-left [&.closing]:duration-200",
+		rounded: "rounded-r-xl"
+	},
+	top: {
+		position: "fixed top-0 left-0 right-0",
+		size: "w-full",
+		animation: "animate-in slide-in-from-top duration-300 [&.closing]:animate-out [&.closing]:slide-out-to-top [&.closing]:duration-200",
+		rounded: "rounded-b-xl"
+	},
+	bottom: {
+		position: "fixed bottom-0 left-0 right-0",
+		size: "w-full",
+		animation: "animate-in slide-in-from-bottom duration-300 [&.closing]:animate-out [&.closing]:slide-out-to-bottom [&.closing]:duration-200",
+		rounded: "rounded-t-xl"
+	}
+}, ne = {
+	default: /* @__PURE__ */ m(y, { className: "text-muted-foreground h-5 w-5" }),
+	error: /* @__PURE__ */ m(g, { className: "text-destructive h-5 w-5" }),
+	warning: /* @__PURE__ */ m(_, { className: "text-warning h-5 w-5" }),
+	info: /* @__PURE__ */ m(b, { className: "text-info h-5 w-5" }),
+	success: /* @__PURE__ */ m(v, { className: "text-success h-5 w-5" })
+};
+function re({ open: e, onOpenChange: o, onClose: s, children: c, title: u, description: d, visuallyHideHeader: f = !1, className: g, contentClassName: _, initialFocusRef: v, closeOnEscape: y = !0, closeOnBackdropClick: b = !0, strings: ee, showCancel: C = !0, showConfirm: w = !0, onCancel: E, onConfirm: D, onAsyncConfirm: k, closeOnAsyncComplete: A = !0, confirmVariant: j = "primary", confirmStyle: M = "solid", isLoading: re = !1, formId: P, footer: F, emphasis: I = !1, tone: L = "default", showIcon: R = !1, alertMessage: z, direction: B = "right", width: V = "lg", showFooter: H = !0, trigger: U }) {
+	let ie = l(), W = l(), G = u ? ie : void 0, K = d ? W : void 0, { isOpen: q, isClosing: J, openDialog: Y, closeDialog: X, dialogProps: ae, handleBackdropClick: Z } = T({
+		open: e,
+		onOpenChange: o,
+		onClose: s,
+		closeOnEscape: y,
+		closeOnBackdropClick: b,
+		initialFocusRef: v
+	}), { strings: Q, finalConfirmVariant: oe, confirmButtonOnClick: se, effectiveLoading: ce, handleCancel: le } = O({
+		closeDialog: X,
+		onConfirm: D,
+		onAsyncConfirm: k,
+		closeOnAsyncComplete: A,
+		confirmVariant: j,
+		isLoading: re,
+		formId: P,
+		onCancel: E,
+		customStrings: ee,
+		emphasis: I,
+		tone: L
+	}), $ = te[B], ue = B === "left" || B === "right", de = !!(c || z), fe = H && (C || w || F), pe = U && a(U) ? i(U, { onClick: (e) => {
+		let t = U.props.onClick;
+		t?.(e), Y();
+	} }) : U ? /* @__PURE__ */ m("span", {
+		role: "button",
+		tabIndex: 0,
+		onClick: Y,
+		onKeyDown: (e) => {
+			(e.key === "Enter" || e.key === " ") && (e.preventDefault(), Y());
+		},
+		className: "cursor-pointer",
+		children: U
+	}) : null;
+	return !q && !J && !U ? null : /* @__PURE__ */ h(p, { children: [pe, !!(q || J) && S(/* @__PURE__ */ h("div", {
+		className: "fixed inset-0 z-50",
+		children: [/* @__PURE__ */ m("div", {
+			className: t("absolute inset-0 bg-foreground/50 backdrop-blur-[1px]", "transition-opacity duration-300", J ? "opacity-0" : "animate-in fade-in-0 duration-300"),
+			onClick: Z,
+			"aria-hidden": "true"
+		}), /* @__PURE__ */ h("dialog", {
+			...ae,
+			className: t("drawer--component inset-auto m-0 p-0", $.position, $.size, "border shadow-xl", "bg-background text-foreground", $.rounded, ue && "w-full", ue && N[V], !ue && "max-h-[85vh]", $.animation, "outline-none focus-visible:outline-none", "flex flex-col", g),
+			"aria-modal": "true",
+			role: "dialog",
+			"aria-labelledby": G,
+			"aria-describedby": K,
+			children: [
+				/* @__PURE__ */ m(n, {
+					type: "button",
+					variant: "secondary",
+					buttonStyle: "ghost",
+					size: "icon-sm",
+					onClick: X,
+					className: t("absolute right-4 top-4 z-10 size-7 rounded-md p-0", "text-muted-foreground transition-colors", "hover:bg-muted hover:text-foreground", "disabled:pointer-events-none"),
+					"aria-label": Q.close,
+					children: /* @__PURE__ */ m(x, { className: "h-4 w-4" })
+				}),
+				!!(u || d) && /* @__PURE__ */ h("div", {
+					className: t("flex items-start gap-3 px-6 pb-4 pt-6", f && "sr-only"),
+					children: [!!R && /* @__PURE__ */ m("div", {
+						className: "shrink-0 pt-0.5",
+						children: ne[L]
+					}), /* @__PURE__ */ h("div", {
+						className: "min-w-0 flex-1 pr-6",
+						children: [!!u && /* @__PURE__ */ m(r, {
+							id: ie,
+							tag: "div",
+							size: "lg",
+							weight: "semibold",
+							children: u
+						}), !!d && /* @__PURE__ */ m(r, {
+							id: W,
+							tag: "p",
+							type: "secondary",
+							className: "mt-1",
+							children: d
+						})]
+					})]
+				}),
+				!!de && /* @__PURE__ */ h("div", {
+					className: t("flex-1 overflow-auto px-6", u || d ? "pb-6" : "py-6", _),
+					children: [!!z && /* @__PURE__ */ m("div", {
+						className: t("mb-4 rounded-md border p-3", L === "error" && "border-destructive/30 bg-destructive/5", L === "warning" && "border-warning/40 bg-warning/10", L === "info" && "border-info/40 bg-info/10", L === "success" && "border-success/40 bg-success/10", L === "default" && "border-border bg-muted/40"),
+						children: /* @__PURE__ */ m(r, {
+							tag: "p",
+							children: z
+						})
+					}), c]
+				}),
+				!!fe && /* @__PURE__ */ m("div", {
+					className: "border-t px-6 py-4",
+					children: F ?? /* @__PURE__ */ h("div", {
+						className: "flex flex-col-reverse gap-3 sm:flex-row sm:justify-end",
+						children: [!!C && /* @__PURE__ */ m(n, {
+							type: "button",
+							variant: "secondary",
+							buttonStyle: "outline",
+							onClick: le,
+							children: Q.cancel
+						}), !!w && /* @__PURE__ */ m(n, {
+							type: "button",
+							variant: oe,
+							buttonStyle: M,
+							onClick: se,
+							loading: ce,
+							loadingLabels: { loading: Q.loading },
+							children: Q.confirm
+						})]
+					})
+				})
+			]
+		})]
+	}), document.body)] });
+}
+var P = o(re);
+P.displayName = "Drawer";
+//#endregion
+//#region src/components/features/overlays/alert-dialog.tsx
+var F = {
+	default: {
+		icon: /* @__PURE__ */ m(y, { className: "h-6 w-6" }),
+		iconColor: "text-muted-foreground"
+	},
+	error: {
+		icon: /* @__PURE__ */ m(g, { className: "h-6 w-6" }),
+		iconColor: "text-destructive"
+	},
+	warning: {
+		icon: /* @__PURE__ */ m(_, { className: "h-6 w-6" }),
+		iconColor: "text-warning"
+	},
+	info: {
+		icon: /* @__PURE__ */ m(b, { className: "h-6 w-6" }),
+		iconColor: "text-info"
+	},
+	success: {
+		icon: /* @__PURE__ */ m(v, { className: "h-6 w-6" }),
+		iconColor: "text-success"
+	}
+};
+function I({ open: o, onOpenChange: s, onClose: c, children: d, title: f, description: g, visuallyHideHeader: _ = !1, className: v, contentClassName: y, initialFocusRef: b, closeOnEscape: x = !0, closeOnBackdropClick: ee = !1, strings: C, showCancel: w = !0, showConfirm: E = !0, onCancel: k, onConfirm: A, onAsyncConfirm: j, closeOnAsyncComplete: M = !0, confirmVariant: N, confirmStyle: te = "solid", isLoading: ne = !1, formId: re, footer: P, tone: I = "default", showIcon: L = !0, alertMessage: R, trigger: z, destructive: B = !1 }) {
+	let V = l(), H = l(), U = f ? V : void 0, ie = g ? H : void 0, { isOpen: W, isClosing: G, openDialog: K, closeDialog: q, dialogProps: J, handleBackdropClick: Y } = T({
+		open: o,
+		onOpenChange: s,
+		onClose: c,
+		closeOnEscape: x,
+		closeOnBackdropClick: ee,
+		initialFocusRef: b
+	}), X = e(D, C), ae = u(() => B ? "error" : N || {
+		default: "primary",
+		error: "error",
+		warning: "warning",
+		info: "primary",
+		success: "success"
+	}[I], [
+		B,
+		N,
+		I
+	]), { strings: Z, confirmButtonOnClick: Q, effectiveLoading: oe, handleCancel: se } = O({
+		closeDialog: q,
+		onConfirm: A,
+		onAsyncConfirm: j,
+		closeOnAsyncComplete: M,
+		confirmVariant: ae,
+		isLoading: ne,
+		formId: re,
+		onCancel: k,
+		customStrings: X
+	}), ce = F[I], le = z && a(z) ? i(z, { onClick: (e) => {
+		let t = z.props.onClick;
+		t?.(e), K();
+	} }) : z ? /* @__PURE__ */ m("span", {
+		role: "button",
+		tabIndex: 0,
+		onClick: K,
+		onKeyDown: (e) => {
+			(e.key === "Enter" || e.key === " ") && (e.preventDefault(), K());
+		},
+		className: "cursor-pointer",
+		children: z
+	}) : null;
+	return !W && !G && !z ? null : /* @__PURE__ */ h(p, { children: [le, !!(W || G) && S(/* @__PURE__ */ h("div", {
+		className: "fixed inset-0 z-50 flex items-center justify-center p-4",
+		children: [/* @__PURE__ */ m("div", {
+			className: t("absolute inset-0 bg-foreground/50 backdrop-blur-[1px]", "transition-opacity duration-200", G ? "opacity-0" : "animate-in fade-in-0 duration-200"),
+			onClick: Y,
+			"aria-hidden": "true"
+		}), /* @__PURE__ */ h("dialog", {
+			...J,
+			className: t("alert-dialog--component relative z-10 m-0 w-full max-w-md p-0", "max-h-[90vh] flex flex-col", "rounded-lg border shadow-lg", "bg-background text-foreground", "animate-in fade-in-0 zoom-in-95 duration-200", "[&.closing]:animate-out [&.closing]:fade-out-0 [&.closing]:zoom-out-95 [&.closing]:duration-150", "outline-none focus-visible:outline-none", v),
+			role: "alertdialog",
+			"aria-modal": "true",
+			"aria-labelledby": U,
+			"aria-describedby": ie,
+			children: [/* @__PURE__ */ h("div", {
+				className: "flex-1 overflow-auto p-6",
+				children: [
+					!!L && !_ && /* @__PURE__ */ m("div", {
+						className: t("mx-auto mb-4 flex h-12 w-12 items-center justify-center rounded-full", I === "error" && "bg-destructive/10", I === "warning" && "bg-warning/15", I === "info" && "bg-info/15", I === "success" && "bg-success/15", I === "default" && "bg-muted"),
+						children: /* @__PURE__ */ m("span", {
+							className: ce.iconColor,
+							children: ce.icon
+						})
+					}),
+					!!(f || g) && /* @__PURE__ */ h("div", {
+						className: t(_ && "sr-only"),
+						children: [!!f && /* @__PURE__ */ m(r, {
+							id: V,
+							tag: "div",
+							size: "lg",
+							weight: "semibold",
+							align: "center",
+							children: f
+						}), !!g && /* @__PURE__ */ m(r, {
+							id: H,
+							tag: "p",
+							type: "secondary",
+							align: "center",
+							className: "mt-2",
+							children: g
+						})]
+					}),
+					!!R && /* @__PURE__ */ m("div", {
+						className: t("mt-4 rounded-md border p-3 text-left", I === "error" && "border-destructive/30 bg-destructive/5", I === "warning" && "border-warning/40 bg-warning/10", I === "info" && "border-info/40 bg-info/10", I === "success" && "border-success/40 bg-success/10", I === "default" && "border-border bg-muted/40"),
+						children: /* @__PURE__ */ m(r, {
+							tag: "p",
+							children: R
+						})
+					}),
+					!!d && /* @__PURE__ */ m("div", {
+						className: t("mt-4", y),
+						children: d
+					})
+				]
+			}), !!(w || E || P) && /* @__PURE__ */ m("div", {
+				className: "border-t px-6 py-4",
+				children: P ?? /* @__PURE__ */ h("div", {
+					className: "flex flex-col-reverse gap-3 sm:flex-row sm:justify-end",
+					children: [!!w && /* @__PURE__ */ m(n, {
+						type: "button",
+						variant: "secondary",
+						buttonStyle: "outline",
+						onClick: se,
+						className: "w-full sm:w-auto",
+						children: Z.cancel
+					}), !!E && /* @__PURE__ */ m(n, {
+						type: "button",
+						variant: ae,
+						buttonStyle: te,
+						onClick: Q,
+						loading: oe,
+						loadingLabels: { loading: Z.loading },
+						className: "w-full sm:w-auto",
+						children: Z.confirm
+					})]
+				})
+			})]
+		})]
+	}), document.body)] });
+}
+var L = o(I);
+L.displayName = "AlertDialog";
+//#endregion
+export { D as a, O as i, P as n, E as o, M as r, T as s, L as t };
+
+//# sourceMappingURL=overlays-CJs_syAu.js.map