@mankindui/core
Version:
- a react component library - you can see how @mankindui/core can be used via examples: [usage examples](https://github.com/clarklindev/mankindui-test)
72 lines (71 loc) • 1.97 kB
JavaScript
import { j as a } from "../../_virtual/jsx-runtime.js";
import { cva as o } from "../../node_modules/class-variance-authority/dist/index.js";
import { twMerge as n } from "../../node_modules/tailwind-merge/dist/bundle-mjs.js";
const d = o(
"fixed inset-0 bg-black bg-opacity-50 flex z-50 justify-center items-center transition-opacity duration-300 ease-in-out",
{
variants: {
animation: {
fade: "",
slide: ""
}
},
defaultVariants: {
animation: "fade"
}
}
), c = o(
"bg-white dark:bg-black dark:bg-neutral-900 rounded-lg p-6 transition-all duration-300 ease-in-out",
{
variants: {
size: {
small: "w-1/3 max-w-md",
medium: "w-2/3 max-w-lg",
large: "w-full max-w-2xl"
},
animation: {
fade: "opacity-0 scale-95",
slide: "opacity-0 translate-y-10"
}
},
defaultVariants: {
size: "medium",
animation: "fade"
}
}
), x = ({
isOpen: t,
onClose: e,
size: s = "medium",
animation: i = "fade",
className: l = ""
}) => /* @__PURE__ */ a.jsx(
"div",
{
className: n(
d({ animation: i }),
t ? "opacity-100" : "opacity-0 pointer-events-none"
),
onClick: e,
children: /* @__PURE__ */ a.jsxs(
"div",
{
className: n(
c({ size: s, animation: i }),
t ? "opacity-100 scale-100 translate-y-0" : "",
l
),
onClick: (r) => r.stopPropagation(),
children: [
/* @__PURE__ */ a.jsx("h2", { className: "text-xl font-semibold mb-4", children: "Modal Header" }),
/* @__PURE__ */ a.jsx("p", { className: "mb-4", children: "This is the modal content. Add any components or content here." }),
/* @__PURE__ */ a.jsx("button", { className: "bg-blue-500 text-white px-4 py-2 rounded", onClick: e, children: "Close" })
]
}
)
}
);
export {
x as Dialog
};
//# sourceMappingURL=index.js.map