laif-ds
Version:
Design System di Laif con componenti React basati su principi di Atomic Design
131 lines (130 loc) • 4.19 kB
JavaScript
"use client";
import { jsx as l, jsxs as i } from "react/jsx-runtime";
import { DialogTitle as C, DialogDescription as b } from "../../node_modules/@radix-ui/react-dialog/dist/index.js";
import { cva as z } from "../../node_modules/class-variance-authority/dist/index.js";
import { Button as j } from "./button.js";
import { Dialog as T, DialogTrigger as A, DialogContent as B, DialogHeader as E, DialogClose as I, DialogFooter as K } from "./dialog.js";
import { Typo as c } from "./typo.js";
import { cn as f } from "../../lib/utils.js";
const V = z(
[
"flex flex-col justify-between gap-2 w-full h-dvh max-w-[initial] p-6",
"max-sm:rounded-none max-sm:px-2 max-sm:py-3 max-sm:min-w-full max-sm:min-h-full max-sm:w-full max-sm:h-full max-sm:max-w-full max-sm:max-h-full"
],
{
variants: {
size: {
sm: "min-w-5/12 min-h-5/12 w-5/12 h-5/12 max-w-5/12 max-h-5/12",
default: "min-w-7/12 min-h-7/12 w-7/12 h-7/12 max-w-7/12 max-h-7/12",
lg: "min-w-9/12 min-h-9/12 w-9/12 h-9/12 max-w-9/12 max-h-9/12",
xl: "min-w-11/12 min-h-11/12 w-11/12 h-11/12 max-w-11/12 max-h-11/12",
full: "min-w-full min-h-full w-full h-full max-w-full max-h-full rounded-none"
}
},
defaultVariants: {
size: "default"
}
}
);
function G({
children: r,
trigger: m,
title: t,
description: o,
footer: s,
size: w = "default",
open: u,
defaultOpen: p,
onOpenChange: x,
triggerClassName: d,
headerClassName: D,
bodyClassName: g,
footerClassName: v,
disabled: h = !1,
asChild: N = !1,
preventClose: n,
...e
}) {
const y = u !== void 0;
return h ? /* @__PURE__ */ l("div", { className: d, children: m }) : /* @__PURE__ */ i(
T,
{
open: y ? u : void 0,
defaultOpen: p,
onOpenChange: x,
children: [
m && /* @__PURE__ */ l(
A,
{
asChild: N,
className: d,
disabled: h,
children: m
}
),
/* @__PURE__ */ i(
B,
{
...e,
className: f(
V({
size: w
}),
e.className
),
onInteractOutside: (a) => {
e.onInteractOutside?.(a), (n === "overlay" || n === "all") && a.preventDefault();
},
onEscapeKeyDown: (a) => {
e.onEscapeKeyDown?.(a), n === "all" && a.preventDefault();
},
showCloseButton: !1,
children: [
/* @__PURE__ */ i(E, { className: f("gap-1", D), children: [
/* @__PURE__ */ i("div", { className: "flex w-full flex-row items-start gap-2", children: [
/* @__PURE__ */ l(C, { asChild: !0, children: /* @__PURE__ */ l(c, { variant: "h5", className: "flex flex-1", children: t }) }),
/* @__PURE__ */ l(I, { asChild: !0, children: /* @__PURE__ */ l(
j,
{
iconLeft: "X",
variant: "ghost",
size: "icon",
className: "size-7",
onClick: () => x?.(!1)
}
) })
] }),
o && /* @__PURE__ */ l(b, { asChild: !0, children: /* @__PURE__ */ l(
c,
{
variant: "caption",
className: "text-d-secondary-foreground flex flex-1",
children: o
}
) })
] }),
r && /* @__PURE__ */ l(
"div",
{
className: f(
"border-d-border flex min-h-0 w-full flex-1 flex-col gap-2 overflow-auto py-2",
(!!t || !!o) && "border-t",
!!s && "border-b",
g
),
children: r
}
),
s && /* @__PURE__ */ l(K, { className: v, children: s })
]
}
)
]
}
);
}
export {
G as AppDialog,
I as AppDialogClose,
G as default
};