import { t as e } from "../chunks/clsx.js";
import { Button as t } from "./buttons/Button.js";
import { t as n } from "../chunks/Backdrop.js";
import { twMerge as r } from "./helpers/twMerge.js";
import { useSlots as i } from "./hooks/useSlots.js";
import { useRef as a } from "react";
import { jsx as o, jsxs as s } from "react/jsx-runtime";
//#region lib/ui/Popin.tsx
var c = ({ closeLabel: e, onClose: n }) => /* @__PURE__ */ o(t, {
	color: "black",
	variant: "circle",
	icon: "CrossDefault",
	className: "mx-auto",
	"aria-label": e,
	onClick: n
}), l = ({ title: t, children: l, closeLabel: u, onClose: d, isVisible: f, className: p = "sm:w-360", bodyClassName: m, Footer: h = c }) => {
	let { children: g, popinFooter: _ } = i(l, ["popinFooter"]), v = a(f), y = v.current, b = !f && y;
	return v.current = f, /* @__PURE__ */ o(n, {
		isVisible: f,
		onClose: d,
		children: /* @__PURE__ */ o("div", {
			className: r(e("border-lightGrey rounded-16 pointer-events-auto mx-20 w-full border bg-white origin-center will-change[transform,opacity]", {
				"animate-zoom-in": f,
				"animate-zoom-out": !f && b,
				"opacity-0 scale-90": !f && !b
			}), p),
			children: /* @__PURE__ */ s("div", {
				className: r("text-center max-h-[90vh] flex flex-col p-40 gap-40", m),
				children: [
					t && /* @__PURE__ */ o("div", {
						className: "text-h5 mt-0 -mb-20 text-start font-serif",
						children: t
					}),
					/* @__PURE__ */ o("div", {
						className: "text-start overflow-auto",
						children: g
					}),
					!_?.length && h && /* @__PURE__ */ o("div", { children: /* @__PURE__ */ o(h, {
						closeLabel: u,
						onClose: d
					}) }),
					_
				]
			})
		})
	});
};
//#endregion
export { l as Popin };

//# sourceMappingURL=Popin.js.map