@anyreach/component-library-ui
Version:
React component library built on shadcn/ui foundation following atomic design principles
1,475 lines (1,474 loc) • 102 kB
JavaScript
import { clsx as Vt } from "clsx";
import { twMerge as St } from "tailwind-merge";
import * as e from "react";
import B from "react";
import { Slot as Ct } from "@radix-ui/react-slot";
import { cva as o } from "class-variance-authority";
import { Loader2 as Le, Search as ue, Minus as Rt, Check as fe, Circle as Fe, ChevronRight as pe, MoreHorizontal as ge, ChevronLeft as Ue, ChevronDown as he, ChevronUp as Ae, Upload as Mt, Image as Dt, File as zt, X as ie, CheckCircle as It, AlertCircle as Tt, Info as Pt, ChevronsUpDown as jt, Building2 as Be, Sun as Lt, Moon as Ft, PanelLeftOpen as Ut, User as Oe, LogOut as _e, PanelLeftClose as At, Filter as Bt, List as Ot, Grid as Re, Plus as ve, Edit as _t, Trash2 as Gt, Bell as Ht } from "lucide-react";
import * as Ge from "@radix-ui/react-label";
import * as Ee from "@radix-ui/react-checkbox";
import * as re from "@radix-ui/react-radio-group";
import * as M from "@radix-ui/react-select";
import { startOfMonth as $t, endOfMonth as Yt, startOfWeek as qt, endOfWeek as Jt, getYear as Me, format as De, isSameMonth as ze, addDays as Qt, subMonths as Zt, getMonth as Xt, addMonths as Wt, isToday as Kt, setMonth as ea, setYear as ta, isSameDay as ce } from "date-fns";
import * as S from "@radix-ui/react-dialog";
import * as G from "@radix-ui/react-toast";
import * as W from "@radix-ui/react-popover";
import * as A from "@radix-ui/react-dropdown-menu";
function n(...t) {
return St(Vt(t));
}
const Jn = typeof window < "u" ? B.useLayoutEffect : B.useEffect;
function aa() {
const [t, r] = B.useState(!1);
return B.useEffect(() => {
r(!0);
}, []), t;
}
function Qn() {
const [t, r] = B.useState({
width: typeof window < "u" ? window.innerWidth : 0,
height: typeof window < "u" ? window.innerHeight : 0
});
return B.useEffect(() => {
if (typeof window > "u") return;
function a() {
r({
width: window.innerWidth,
height: window.innerHeight
});
}
return window.addEventListener("resize", a), () => window.removeEventListener("resize", a);
}, []), t;
}
const ra = o(
"inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
{
variants: {
variant: {
default: "bg-primary text-primary-foreground shadow hover:bg-primary/90",
destructive: "bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90",
secondary: "bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80",
ghost: "hover:bg-accent hover:text-accent-foreground"
},
size: {
default: "h-9 px-4 py-2",
icon: "h-9 w-9"
}
},
defaultVariants: {
variant: "default",
size: "default"
}
}
), U = B.forwardRef(
({
className: t,
variant: r,
size: a,
asChild: s = !1,
icon: l,
loading: i = !1,
children: m,
disabled: u,
...p
}, g) => {
const h = s ? Ct : "button", b = l ? B.cloneElement(l, {
className: n("h-4 w-4", l.props.className)
}) : null, x = a === "icon" || !m && (b || i) ? "icon" : a, N = u || i;
return /* @__PURE__ */ B.createElement(
h,
{
className: n(ra({ variant: r, size: x, className: t })),
ref: g,
disabled: N,
...p
},
i ? /* @__PURE__ */ B.createElement(Le, { className: "h-4 w-4 animate-spin" }) : b,
m
);
}
);
U.displayName = "Button";
const Ie = o(
"flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-base shadow-sm transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
{
variants: {
variant: {
default: "",
search: ""
}
},
defaultVariants: {
variant: "default"
}
}
), we = e.forwardRef(
({ className: t, type: r, variant: a, icon: s, ...l }, i) => {
const m = s ? e.cloneElement(s, {
className: n("h-4 w-4 text-muted-foreground", s.props.className)
}) : null, p = m || (a === "search" && !m ? /* @__PURE__ */ e.createElement(ue, { className: "h-4 w-4 text-muted-foreground" }) : null);
return p ? /* @__PURE__ */ e.createElement("div", { className: "relative" }, /* @__PURE__ */ e.createElement(
"input",
{
type: a === "search" ? "search" : r,
className: n(Ie({ variant: a, className: t }), "pr-10"),
ref: i,
...l
}
), /* @__PURE__ */ e.createElement("div", { className: "absolute right-3 top-1/2 transform -translate-y-1/2 pointer-events-none" }, p)) : /* @__PURE__ */ e.createElement(
"input",
{
type: a === "search" ? "search" : r,
className: n(Ie({ variant: a, className: t })),
ref: i,
...l
}
);
}
);
we.displayName = "Input";
const na = o(
"text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
), sa = e.forwardRef(({ className: t, ...r }, a) => /* @__PURE__ */ e.createElement(
Ge.Root,
{
ref: a,
className: n(na(), t),
...r
}
));
sa.displayName = Ge.Root.displayName;
const oa = e.forwardRef(({ className: t, ...r }, a) => /* @__PURE__ */ e.createElement(
Ee.Root,
{
ref: a,
className: n(
"peer h-4 w-4 shrink-0 rounded-sm border border-primary ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground data-[state=indeterminate]:bg-primary data-[state=indeterminate]:text-primary-foreground",
t
),
...r
},
/* @__PURE__ */ e.createElement(
Ee.Indicator,
{
className: n("flex items-center justify-center text-current")
},
r.checked === "indeterminate" ? /* @__PURE__ */ e.createElement(Rt, { className: "h-4 w-4" }) : /* @__PURE__ */ e.createElement(fe, { className: "h-4 w-4" })
)
));
oa.displayName = Ee.Root.displayName;
const la = e.forwardRef(({ className: t, ...r }, a) => /* @__PURE__ */ e.createElement(
re.Root,
{
className: n("grid gap-2", t),
...r,
ref: a
}
));
la.displayName = re.Root.displayName;
const ia = e.forwardRef(({ className: t, ...r }, a) => /* @__PURE__ */ e.createElement(
re.Item,
{
ref: a,
className: n(
"aspect-square h-4 w-4 rounded-full border border-primary text-primary ring-offset-background focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
t
),
...r
},
/* @__PURE__ */ e.createElement(re.Indicator, { className: "flex items-center justify-center" }, /* @__PURE__ */ e.createElement(Fe, { className: "h-2.5 w-2.5 fill-current text-current" }))
));
ia.displayName = re.Item.displayName;
const ca = o(
"flex min-h-[60px] w-full rounded-md border border-input bg-transparent px-3 py-2 text-base shadow-sm placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
{
variants: {
state: {
default: "",
required: "border-destructive focus-visible:ring-destructive",
disabled: "cursor-not-allowed opacity-50"
}
},
defaultVariants: {
state: "default"
}
}
), da = e.forwardRef(
({ className: t, state: r, required: a, disabled: s, ...l }, i) => {
const m = s ? "disabled" : a ? "required" : "default";
return /* @__PURE__ */ e.createElement(
"textarea",
{
className: n(ca({ state: m, className: t })),
ref: i,
required: a,
disabled: s,
...l
}
);
}
);
da.displayName = "Textarea";
const ma = o(
"relative flex w-full touch-none select-none items-center",
{
variants: {
state: {
default: "",
disabled: "cursor-not-allowed opacity-50"
}
},
defaultVariants: {
state: "default"
}
}
), ua = o(
"relative h-2 w-full grow overflow-hidden rounded-full bg-secondary",
{
variants: {
state: {
default: "",
disabled: "opacity-50"
}
},
defaultVariants: {
state: "default"
}
}
), fa = o("absolute h-full bg-primary", {
variants: {
state: {
default: "",
disabled: "opacity-50"
}
},
defaultVariants: {
state: "default"
}
}), pa = o(
"block h-5 w-5 rounded-full border-2 border-primary bg-background shadow transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50",
{
variants: {
state: {
default: "",
disabled: "cursor-not-allowed opacity-50"
}
},
defaultVariants: {
state: "default"
}
}
), ga = e.forwardRef(
({
className: t,
state: r,
value: a = 0,
onValueChange: s,
min: l = 0,
max: i = 100,
step: m = 1,
disabled: u,
...p
}, g) => {
const [h, b] = e.useState(a), x = u ? "disabled" : "default", N = (h - l) / (i - l) * 100, C = (j) => {
const E = Number(j.target.value);
b(E), s == null || s(E);
};
return e.useEffect(() => {
b(a);
}, [a]), /* @__PURE__ */ e.createElement("div", { className: n(ma({ state: x, className: t })) }, /* @__PURE__ */ e.createElement("div", { className: n(ua({ state: x })) }, /* @__PURE__ */ e.createElement(
"div",
{
className: n(fa({ state: x })),
style: { width: `${N}%` }
}
)), /* @__PURE__ */ e.createElement(
"input",
{
ref: g,
type: "range",
value: h,
onChange: C,
min: l,
max: i,
step: m,
disabled: u,
className: "absolute inset-0 w-full h-full opacity-0 cursor-pointer disabled:cursor-not-allowed",
...p
}
), /* @__PURE__ */ e.createElement(
"div",
{
className: n(pa({ state: x })),
style: {
left: `calc(${N}% - 10px)`,
// Adjust for thumb width
position: "absolute",
top: "50%",
transform: "translateY(-50%)"
}
}
));
}
);
ga.displayName = "Slider";
const ha = o(
"relative flex shrink-0 overflow-hidden rounded-full",
{
variants: {
size: {
sm: "h-8 w-8",
md: "h-10 w-10",
lg: "h-12 w-12"
}
},
defaultVariants: {
size: "md"
}
}
), ba = o("aspect-square h-full w-full object-cover"), va = o(
"flex h-full w-full items-center justify-center rounded-full bg-muted text-muted-foreground font-medium",
{
variants: {
size: {
sm: "text-xs",
md: "text-sm",
lg: "text-base"
}
},
defaultVariants: {
size: "md"
}
}
), Ea = o(
"absolute bottom-0 right-0 h-3 w-3 rounded-full border-2 border-background",
{
variants: {
status: {
online: "bg-green-500",
offline: "bg-gray-500",
away: "bg-yellow-500",
busy: "bg-red-500"
}
}
}
), xe = B.forwardRef(
({ className: t, size: r, src: a, alt: s, fallback: l, status: i, ...m }, u) => {
const [p, g] = B.useState(!1), h = aa(), b = (N) => N.split(" ").map((C) => C.charAt(0).toUpperCase()).slice(0, 2).join(""), x = () => {
g(!0);
};
return /* @__PURE__ */ B.createElement(
"div",
{
ref: u,
className: n(ha({ size: r, className: t })),
...m
},
a && !p && h ? /* @__PURE__ */ B.createElement(
"img",
{
src: a,
alt: s || "Avatar",
className: n(ba()),
onError: x
}
) : /* @__PURE__ */ B.createElement("div", { className: n(va({ size: r })) }, l ? b(l) : "?"),
i && /* @__PURE__ */ B.createElement("div", { className: n(Ea({ status: i })) })
);
}
);
xe.displayName = "Avatar";
const wa = o(
"inline-flex items-center rounded-md border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",
{
variants: {
variant: {
default: "border-transparent bg-zinc-50 text-zinc-900 shadow hover:bg-zinc-100 dark:bg-zinc-800 dark:text-zinc-100 dark:hover:bg-zinc-700",
info: "border-transparent bg-blue-50 text-blue-900 shadow hover:bg-blue-100 dark:bg-blue-900/20 dark:text-blue-100 dark:hover:bg-blue-900/30",
success: "border-transparent bg-green-50 text-green-900 shadow hover:bg-green-100 dark:bg-green-900/20 dark:text-green-100 dark:hover:bg-green-900/30",
warning: "border-transparent bg-amber-50 text-amber-900 shadow hover:bg-amber-100 dark:bg-amber-900/20 dark:text-amber-100 dark:hover:bg-amber-900/30",
danger: "border-transparent bg-red-50 text-red-900 shadow hover:bg-red-100 dark:bg-red-900/20 dark:text-red-100 dark:hover:bg-red-900/30"
}
},
defaultVariants: {
variant: "default"
}
}
);
function Zn({ className: t, variant: r, ...a }) {
return /* @__PURE__ */ e.createElement("div", { className: n(wa({ variant: r }), t), ...a });
}
const xa = o(
"relative h-2 w-full overflow-hidden rounded-full bg-secondary",
{
variants: {
size: {
sm: "h-1",
md: "h-2",
lg: "h-3"
}
},
defaultVariants: {
size: "md"
}
}
), Na = o(
"h-full w-full flex-1 bg-primary transition-all duration-300 ease-in-out"
), He = e.forwardRef(
({ className: t, value: r = 0, max: a = 100, size: s, ...l }, i) => {
const m = Math.min(Math.max(r / a * 100, 0), 100);
return /* @__PURE__ */ e.createElement(
"div",
{
ref: i,
className: n(xa({ size: s, className: t })),
...l
},
/* @__PURE__ */ e.createElement(
"div",
{
className: n(Na()),
style: { transform: `translateX(-${100 - m}%)` }
}
)
);
}
);
He.displayName = "Progress";
const ya = o(
"shrink-0 bg-border",
{
variants: {
orientation: {
horizontal: "h-[1px] w-full",
vertical: "h-full w-[1px]"
}
},
defaultVariants: {
orientation: "horizontal"
}
}
), ne = e.forwardRef(
({ className: t, orientation: r, ...a }, s) => /* @__PURE__ */ e.createElement(
"div",
{
ref: s,
className: n(ya({ orientation: r }), t),
...a
}
)
);
ne.displayName = "Separator";
const ka = o(
"rounded-lg border bg-card text-card-foreground shadow-md",
{
variants: {
variant: {
default: "bg-background",
active: "bg-zinc-50 dark:bg-zinc-800/50"
}
},
defaultVariants: {
variant: "default"
}
}
), Va = o(
"flex flex-col space-y-1.5 p-6"
), Sa = o(
"text-2xl font-semibold leading-none tracking-tight"
), Ca = o(
"text-sm text-muted-foreground"
), Ra = o(
"p-6 pt-0"
), Ma = o(
"flex items-center p-6 pt-0"
), $e = e.forwardRef(
({ className: t, variant: r, ...a }, s) => /* @__PURE__ */ e.createElement(
"div",
{
ref: s,
className: n(ka({ variant: r, className: t })),
...a
}
)
);
$e.displayName = "Card";
const Ye = e.forwardRef(
({ className: t, ...r }, a) => /* @__PURE__ */ e.createElement("div", { ref: a, className: n(Va(), t), ...r })
);
Ye.displayName = "CardHeader";
const Da = e.forwardRef(
({ className: t, ...r }, a) => /* @__PURE__ */ e.createElement("h3", { ref: a, className: n(Sa(), t), ...r })
);
Da.displayName = "CardTitle";
const za = e.forwardRef(
({ className: t, ...r }, a) => /* @__PURE__ */ e.createElement("p", { ref: a, className: n(Ca(), t), ...r })
);
za.displayName = "CardDescription";
const qe = e.forwardRef(
({ className: t, ...r }, a) => /* @__PURE__ */ e.createElement("div", { ref: a, className: n(Ra(), t), ...r })
);
qe.displayName = "CardContent";
const Ia = e.forwardRef(
({ className: t, ...r }, a) => /* @__PURE__ */ e.createElement("div", { ref: a, className: n(Ma(), t), ...r })
);
Ia.displayName = "CardFooter";
const Je = o(
"flex flex-wrap items-center gap-1.5 break-words text-sm text-muted-foreground"
), Ta = o(
"inline-flex items-center gap-1.5"
), Pa = o(
"transition-colors hover:text-foreground"
), ja = o(
"font-normal text-foreground"
), La = o(
"text-muted-foreground"
), Fa = o(
"flex h-9 w-9 items-center justify-center"
), Qe = e.forwardRef(
({ className: t, ...r }, a) => /* @__PURE__ */ e.createElement("nav", { ref: a, "aria-label": "breadcrumb", ...r }, /* @__PURE__ */ e.createElement("ol", { className: n(Je(), t), ...r }))
);
Qe.displayName = "Breadcrumb";
const Ze = e.forwardRef(
({ className: t, ...r }, a) => /* @__PURE__ */ e.createElement(
"ol",
{
ref: a,
className: n(Je(), t),
...r
}
)
);
Ze.displayName = "BreadcrumbList";
const Xe = e.forwardRef(
({ className: t, ...r }, a) => /* @__PURE__ */ e.createElement(
"li",
{
ref: a,
className: n(Ta(), t),
...r
}
)
);
Xe.displayName = "BreadcrumbItem";
const We = e.forwardRef(
({ className: t, ...r }, a) => /* @__PURE__ */ e.createElement(
"a",
{
ref: a,
className: n(Pa(), t),
...r
}
)
);
We.displayName = "BreadcrumbLink";
const Ke = e.forwardRef(
({ className: t, ...r }, a) => /* @__PURE__ */ e.createElement(
"span",
{
ref: a,
role: "link",
"aria-disabled": "true",
"aria-current": "page",
className: n(ja(), t),
...r
}
)
);
Ke.displayName = "BreadcrumbPage";
const et = e.forwardRef(
({ className: t, children: r, ...a }, s) => /* @__PURE__ */ e.createElement(
"li",
{
ref: s,
role: "presentation",
"aria-hidden": "true",
className: n(La(), t),
...a
},
r ?? /* @__PURE__ */ e.createElement(pe, { className: "h-4 w-4" })
)
);
et.displayName = "BreadcrumbSeparator";
const Ua = e.forwardRef(
({ className: t, ...r }, a) => /* @__PURE__ */ e.createElement(
"span",
{
ref: a,
role: "presentation",
"aria-hidden": "true",
className: n(Fa(), t),
...r
},
/* @__PURE__ */ e.createElement(ge, { className: "h-4 w-4" }),
/* @__PURE__ */ e.createElement("span", { className: "sr-only" }, "More")
)
);
Ua.displayName = "BreadcrumbEllipsis";
const Aa = o(
"mx-auto flex w-full justify-center"
), Ba = o(
"flex flex-row items-center gap-1"
), Oa = o(
"inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",
{
variants: {
variant: {
default: "hover:bg-accent hover:text-accent-foreground h-10 px-4 py-2",
ghost: "hover:bg-accent hover:text-accent-foreground h-10 px-4 py-2",
outline: "border border-input bg-background hover:bg-accent hover:text-accent-foreground h-10 px-4 py-2",
current: "border border-input bg-background text-foreground h-10 px-4 py-2 bg-primary text-primary-foreground hover:bg-primary/90"
},
size: {
default: "h-10 px-4 py-2",
sm: "h-9 rounded-md px-3",
lg: "h-11 rounded-md px-8",
icon: "h-10 w-10"
}
},
defaultVariants: {
variant: "ghost",
size: "default"
}
}
), tt = ({ className: t, ...r }) => /* @__PURE__ */ e.createElement(
"nav",
{
role: "navigation",
"aria-label": "pagination",
className: n(Aa(), t),
...r
}
);
tt.displayName = "Pagination";
const at = e.forwardRef(
({ className: t, ...r }, a) => /* @__PURE__ */ e.createElement("ul", { ref: a, className: n(Ba(), t), ...r })
);
at.displayName = "PaginationContent";
const ae = e.forwardRef(
({ className: t, ...r }, a) => /* @__PURE__ */ e.createElement("li", { ref: a, className: n("", t), ...r })
);
ae.displayName = "PaginationItem";
const be = e.forwardRef(
({ className: t, isActive: r, size: a = "icon", variant: s, ...l }, i) => /* @__PURE__ */ e.createElement(
"a",
{
ref: i,
"aria-current": r ? "page" : void 0,
className: n(
Oa({
variant: r ? "current" : s || "ghost",
size: a
}),
t
),
...l
}
)
);
be.displayName = "PaginationLink";
const rt = e.forwardRef(
({ className: t, ...r }, a) => /* @__PURE__ */ e.createElement(
be,
{
ref: a,
"aria-label": "Go to previous page",
size: "default",
className: n("gap-1 pl-2.5", t),
...r
},
/* @__PURE__ */ e.createElement(Ue, { className: "h-4 w-4" }),
/* @__PURE__ */ e.createElement("span", null, "Previous")
)
);
rt.displayName = "PaginationPrevious";
const nt = e.forwardRef(
({ className: t, ...r }, a) => /* @__PURE__ */ e.createElement(
be,
{
ref: a,
"aria-label": "Go to next page",
size: "default",
className: n("gap-1 pr-2.5", t),
...r
},
/* @__PURE__ */ e.createElement("span", null, "Next"),
/* @__PURE__ */ e.createElement(pe, { className: "h-4 w-4" })
)
);
nt.displayName = "PaginationNext";
const st = e.forwardRef(
({ className: t, ...r }, a) => /* @__PURE__ */ e.createElement(
"span",
{
ref: a,
"aria-hidden": !0,
className: n("flex h-9 w-9 items-center justify-center", t),
...r
},
/* @__PURE__ */ e.createElement(ge, { className: "h-4 w-4" }),
/* @__PURE__ */ e.createElement("span", { className: "sr-only" }, "More pages")
)
);
st.displayName = "PaginationEllipsis";
const _a = o(
"flex h-10 w-full items-center justify-between rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1",
{
variants: {
variant: {
default: ""
}
},
defaultVariants: {
variant: "default"
}
}
), Ga = o(
"relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2"
), Ha = o(
"relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50"
), $a = o(
"-mx-1 my-1 h-px bg-muted"
), Ya = o(
"py-1.5 pl-8 pr-2 text-sm font-semibold"
), de = M.Root, Xn = M.Group, me = M.Value, se = e.forwardRef(({ className: t, variant: r, children: a, ...s }, l) => /* @__PURE__ */ e.createElement(
M.Trigger,
{
ref: l,
className: n(_a({ variant: r, className: t })),
...s
},
a,
/* @__PURE__ */ e.createElement(M.Icon, { asChild: !0 }, /* @__PURE__ */ e.createElement(he, { className: "h-4 w-4 opacity-50" }))
));
se.displayName = M.Trigger.displayName;
const ot = e.forwardRef(({ className: t, ...r }, a) => /* @__PURE__ */ e.createElement(
M.ScrollUpButton,
{
ref: a,
className: n(
"flex cursor-default items-center justify-center py-1",
t
),
...r
},
/* @__PURE__ */ e.createElement(Ae, { className: "h-4 w-4" })
));
ot.displayName = M.ScrollUpButton.displayName;
const lt = e.forwardRef(({ className: t, ...r }, a) => /* @__PURE__ */ e.createElement(
M.ScrollDownButton,
{
ref: a,
className: n(
"flex cursor-default items-center justify-center py-1",
t
),
...r
},
/* @__PURE__ */ e.createElement(he, { className: "h-4 w-4" })
));
lt.displayName = M.ScrollDownButton.displayName;
const oe = e.forwardRef(({ className: t, children: r, position: a = "popper", ...s }, l) => /* @__PURE__ */ e.createElement(M.Portal, null, /* @__PURE__ */ e.createElement(
M.Content,
{
ref: l,
className: n(Ga(), t),
position: a,
...s
},
/* @__PURE__ */ e.createElement(ot, null),
/* @__PURE__ */ e.createElement(
M.Viewport,
{
className: n(
"p-1",
a === "popper" && "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]"
)
},
r
),
/* @__PURE__ */ e.createElement(lt, null)
)));
oe.displayName = M.Content.displayName;
const qa = e.forwardRef(({ className: t, ...r }, a) => /* @__PURE__ */ e.createElement(
M.Label,
{
ref: a,
className: n(Ya(), t),
...r
}
));
qa.displayName = M.Label.displayName;
const X = e.forwardRef(({ className: t, children: r, ...a }, s) => /* @__PURE__ */ e.createElement(
M.Item,
{
ref: s,
className: n(Ha(), t),
...a
},
/* @__PURE__ */ e.createElement("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center" }, /* @__PURE__ */ e.createElement(M.ItemIndicator, null, /* @__PURE__ */ e.createElement(fe, { className: "h-4 w-4" }))),
/* @__PURE__ */ e.createElement(M.ItemText, null, r)
));
X.displayName = M.Item.displayName;
const Ja = e.forwardRef(({ className: t, ...r }, a) => /* @__PURE__ */ e.createElement(
M.Separator,
{
ref: a,
className: n($a(), t),
...r
}
));
Ja.displayName = M.Separator.displayName;
const Qa = o(
"p-3 bg-background border rounded-lg shadow-sm"
), Za = o(
"flex items-center justify-between w-full mb-4"
), Te = o(
"grid grid-cols-7 gap-1"
), Xa = o(
"h-8 w-8 text-center text-sm font-medium text-muted-foreground flex items-center justify-center"
), Wa = o(
"h-8 w-8 text-center text-sm p-0 font-normal aria-selected:opacity-100 relative flex items-center justify-center cursor-pointer rounded-sm transition-colors",
{
variants: {
variant: {
default: "hover:bg-accent hover:text-accent-foreground",
selected: "bg-primary text-primary-foreground hover:bg-primary hover:text-primary-foreground focus:bg-primary focus:text-primary-foreground",
today: "bg-accent text-accent-foreground",
outside: "text-muted-foreground opacity-50",
disabled: "text-muted-foreground opacity-50 cursor-not-allowed",
range: "bg-accent text-accent-foreground",
rangeStart: "bg-primary text-primary-foreground rounded-l-sm rounded-r-none",
rangeEnd: "bg-primary text-primary-foreground rounded-r-sm rounded-l-none",
rangeMiddle: "bg-accent text-accent-foreground rounded-none"
}
},
defaultVariants: {
variant: "default"
}
}
), Ka = e.forwardRef(
({
className: t,
selected: r,
onSelect: a,
keepRange: s = !1,
disabled: l,
showOutsideDays: i = !0,
showDropdowns: m = !0,
...u
}, p) => {
const [g, h] = e.useState(r instanceof Date ? r : /* @__PURE__ */ new Date()), [b, x] = e.useState(null), N = $t(g), C = Yt(N), j = qt(N), E = Jt(C), P = "d", L = [];
let D = [], R = j, O = "";
const y = (d) => r ? Array.isArray(r) ? r.some((w) => ce(w, d)) : ce(r, d) : !1, H = (d) => {
if (!s || !Array.isArray(r) || r.length !== 2) return !1;
const [w, T] = r.sort((z, c) => z.getTime() - c.getTime());
return d >= w && d <= T;
}, I = (d) => {
if (!s || !Array.isArray(r) || r.length !== 2) return !1;
const [w] = r.sort((T, z) => T.getTime() - z.getTime());
return ce(d, w);
}, f = (d) => {
if (!s || !Array.isArray(r) || r.length !== 2) return !1;
const [, w] = r.sort((T, z) => T.getTime() - z.getTime());
return ce(d, w);
}, J = (d) => {
if (!(l != null && l(d))) {
if (!s) {
a == null || a(d);
return;
}
if (!b)
x(d), a == null || a([d]);
else {
const w = [b, d].sort((T, z) => T.getTime() - z.getTime());
a == null || a(w), x(null);
}
}
}, q = (d) => {
const w = parseInt(d);
h(ea(g, w));
}, _ = (d) => {
const w = parseInt(d);
h(ta(g, w));
}, K = [
"January",
"February",
"March",
"April",
"May",
"June",
"July",
"August",
"September",
"October",
"November",
"December"
], ee = Me(/* @__PURE__ */ new Date()), Q = 1900, v = ee + 10, F = Array.from({ length: v - Q + 1 }, (d, w) => Q + w).reverse(), Y = (d) => {
if (l != null && l(d)) return "disabled";
if (!ze(d, N)) return "outside";
if (Kt(d)) return "today";
if (s) {
if (I(d)) return "rangeStart";
if (f(d)) return "rangeEnd";
if (H(d)) return "rangeMiddle";
}
return y(d) ? "selected" : "default";
};
for (; R <= E; ) {
for (let d = 0; d < 7; d++) {
O = De(R, P);
const w = new Date(R), T = Y(w), z = i || ze(R, N);
D.push(
/* @__PURE__ */ e.createElement(
"div",
{
key: R.toString(),
className: n(
Wa({ variant: T }),
!z && "invisible"
),
onClick: () => z && J(w)
},
/* @__PURE__ */ e.createElement("span", null, O)
)
), R = Qt(R, 1);
}
L.push(
/* @__PURE__ */ e.createElement("div", { className: n(Te()), key: R.toString() }, D)
), D = [];
}
const $ = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"];
return /* @__PURE__ */ e.createElement("div", { ref: p, className: n(Qa(), t), ...u }, /* @__PURE__ */ e.createElement("div", { className: n(Za()) }, /* @__PURE__ */ e.createElement(
U,
{
variant: "ghost",
size: "icon",
onClick: () => h(Zt(g, 1))
},
/* @__PURE__ */ e.createElement(Ue, { className: "h-4 w-4" })
), m ? /* @__PURE__ */ e.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ e.createElement(
de,
{
value: Xt(g).toString(),
onValueChange: q
},
/* @__PURE__ */ e.createElement(se, { className: "w-[140px]" }, /* @__PURE__ */ e.createElement(me, null)),
/* @__PURE__ */ e.createElement(oe, null, K.map((d, w) => /* @__PURE__ */ e.createElement(X, { key: d, value: w.toString() }, d)))
), /* @__PURE__ */ e.createElement(
de,
{
value: Me(g).toString(),
onValueChange: _
},
/* @__PURE__ */ e.createElement(se, { className: "w-[80px]" }, /* @__PURE__ */ e.createElement(me, null)),
/* @__PURE__ */ e.createElement(oe, null, F.map((d) => /* @__PURE__ */ e.createElement(X, { key: d, value: d.toString() }, d)))
)) : /* @__PURE__ */ e.createElement("div", { className: "font-semibold" }, De(g, "MMMM yyyy")), /* @__PURE__ */ e.createElement(
U,
{
variant: "ghost",
size: "icon",
onClick: () => h(Wt(g, 1))
},
/* @__PURE__ */ e.createElement(pe, { className: "h-4 w-4" })
)), /* @__PURE__ */ e.createElement("div", { className: n(Te()) }, $.map((d) => /* @__PURE__ */ e.createElement("div", { key: d, className: n(Xa()) }, d))), /* @__PURE__ */ e.createElement("div", { className: "space-y-1" }, L));
}
);
Ka.displayName = "Calendar";
const er = o("relative w-full"), tr = o(
"border-2 border-dashed rounded-lg p-6 text-center cursor-pointer transition-colors",
{
variants: {
variant: {
default: "border-border hover:border-border/80 hover:bg-accent/50",
active: "border-primary bg-primary/5",
error: "border-destructive bg-destructive/5"
}
},
defaultVariants: {
variant: "default"
}
}
), ar = o("mt-4 space-y-2"), rr = o(
"flex items-center gap-3 p-3 border rounded-lg bg-background"
), nr = o(
"w-10 h-10 rounded bg-muted flex items-center justify-center flex-shrink-0"
), sr = o("flex-1 min-w-0"), or = o("text-sm font-medium truncate"), lr = o("text-xs text-muted-foreground"), ir = e.forwardRef(
({
className: t,
onFilesChange: r,
onFileUpload: a,
allowMultiple: s = !1,
allowDragDrop: l = !0,
allowClickToSelect: i = !0,
accept: m,
maxSize: u,
showProgress: p = !0,
showPreviews: g = !0,
disabled: h,
...b
}, x) => {
const [N, C] = e.useState([]), [j, E] = e.useState(!1), [P, L] = e.useState(null), D = e.useRef(null), R = (v) => {
if (v === 0) return "0 Bytes";
const F = 1024, Y = ["Bytes", "KB", "MB", "GB"], $ = Math.floor(Math.log(v) / Math.log(F));
return parseFloat((v / Math.pow(F, $)).toFixed(2)) + " " + Y[$];
}, O = (v) => u && v.size > u ? `File size exceeds ${R(u)}` : null, y = () => Math.random().toString(36).substring(2, 15), H = (v) => {
L(null);
const F = [];
let Y = !1;
for (const d of v) {
const w = O(d);
if (w) {
L(w), Y = !0;
break;
}
F.push(d);
}
if (Y) return;
const $ = F.map((d) => ({
file: d,
progress: 0,
status: "uploading",
id: y()
}));
C(s ? (d) => [...d, ...$] : $), r == null || r(F), a && $.forEach(async (d) => {
try {
const w = setInterval(() => {
C(
(T) => T.map(
(z) => z.id === d.id ? { ...z, progress: Math.min(z.progress + 10, 90) } : z
)
);
}, 200);
await a(d.file), clearInterval(w), C(
(T) => T.map(
(z) => z.id === d.id ? { ...z, progress: 100, status: "success" } : z
)
);
} catch {
C(
(w) => w.map(
(T) => T.id === d.id ? { ...T, status: "error" } : T
)
);
}
});
}, I = (v) => {
if (v.preventDefault(), E(!1), h || !l) return;
const F = Array.from(v.dataTransfer.files);
H(F);
}, f = (v) => {
v.preventDefault(), !h && l && E(!0);
}, J = (v) => {
v.preventDefault(), E(!1);
}, q = (v) => {
const F = Array.from(v.target.files || []);
F.length > 0 && H(F);
}, _ = () => {
var v;
h || !i || (v = D.current) == null || v.click();
}, K = (v) => {
C((F) => F.filter((Y) => Y.id !== v));
}, ee = (v) => v.type.startsWith("image/"), Q = () => P ? "error" : j ? "active" : "default";
return /* @__PURE__ */ e.createElement("div", { ref: x, className: n(er(), t) }, /* @__PURE__ */ e.createElement(
"div",
{
className: n(
tr({ variant: Q() })
),
onDrop: I,
onDragOver: f,
onDragLeave: J,
onClick: _
},
/* @__PURE__ */ e.createElement(
"input",
{
ref: D,
type: "file",
multiple: s,
accept: m,
onChange: q,
disabled: h,
className: "hidden",
...b
}
),
/* @__PURE__ */ e.createElement("div", { className: "flex flex-col items-center gap-2" }, /* @__PURE__ */ e.createElement(Mt, { className: "h-8 w-8 text-muted-foreground" }), /* @__PURE__ */ e.createElement("div", { className: "text-sm" }, l && i && /* @__PURE__ */ e.createElement("span", null, "Drag & drop files here, or", " ", /* @__PURE__ */ e.createElement("span", { className: "font-medium text-primary" }, "click to select")), l && !i && /* @__PURE__ */ e.createElement("span", null, "Drag & drop files here"), !l && i && /* @__PURE__ */ e.createElement("span", null, /* @__PURE__ */ e.createElement("span", { className: "font-medium text-primary" }, "Click to select files"))), m && /* @__PURE__ */ e.createElement("div", { className: "text-xs text-muted-foreground" }, "Supported formats: ", m), u && /* @__PURE__ */ e.createElement("div", { className: "text-xs text-muted-foreground" }, "Max size: ", R(u)))
), P && /* @__PURE__ */ e.createElement("div", { className: "mt-2 text-sm text-destructive" }, P), N.length > 0 && /* @__PURE__ */ e.createElement("div", { className: n(ar()) }, N.map((v) => /* @__PURE__ */ e.createElement("div", { key: v.id, className: n(rr()) }, g && /* @__PURE__ */ e.createElement("div", { className: n(nr()) }, ee(v.file) ? /* @__PURE__ */ e.createElement(Dt, { className: "h-5 w-5 text-muted-foreground" }) : /* @__PURE__ */ e.createElement(zt, { className: "h-5 w-5 text-muted-foreground" })), /* @__PURE__ */ e.createElement("div", { className: n(sr()) }, /* @__PURE__ */ e.createElement("div", { className: n(or()) }, v.file.name), /* @__PURE__ */ e.createElement("div", { className: n(lr()) }, R(v.file.size), v.status === "success" && " • Uploaded", v.status === "error" && " • Failed"), p && v.status === "uploading" && /* @__PURE__ */ e.createElement("div", { className: "mt-1" }, /* @__PURE__ */ e.createElement(He, { value: v.progress, size: "sm" }))), /* @__PURE__ */ e.createElement(
U,
{
variant: "ghost",
size: "icon",
onClick: () => K(v.id),
className: "h-8 w-8"
},
/* @__PURE__ */ e.createElement(ie, { className: "h-4 w-4" })
)))));
}
);
ir.displayName = "FileInput";
const cr = o(
"fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] rounded-lg border-muted",
{
variants: {
size: {
default: "max-w-lg",
sm: "max-w-md",
lg: "max-w-2xl",
xl: "max-w-4xl"
}
},
defaultVariants: {
size: "default"
}
}
), dr = o(
"fixed inset-0 z-50 bg-background/80 backdrop-blur-sm data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0"
), mr = o(
"flex flex-col space-y-1.5 text-center sm:text-left"
), ur = o(
"flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2"
), fr = o(
"text-lg font-semibold leading-none tracking-tight"
), pr = o(
"text-sm text-muted-foreground"
), Wn = S.Root, Kn = S.Trigger, gr = S.Portal, es = S.Close, it = e.forwardRef(({ className: t, ...r }, a) => /* @__PURE__ */ e.createElement(
S.Overlay,
{
ref: a,
className: n(dr(), t),
...r
}
));
it.displayName = S.Overlay.displayName;
const hr = e.forwardRef(({ className: t, size: r, children: a, ...s }, l) => /* @__PURE__ */ e.createElement(gr, null, /* @__PURE__ */ e.createElement(it, null), /* @__PURE__ */ e.createElement(
S.Content,
{
ref: l,
className: n(cr({ size: r, className: t })),
...s
},
a,
/* @__PURE__ */ e.createElement(S.Close, { className: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground" }, /* @__PURE__ */ e.createElement(ie, { className: "h-4 w-4" }), /* @__PURE__ */ e.createElement("span", { className: "sr-only" }, "Close"))
)));
hr.displayName = S.Content.displayName;
const br = e.forwardRef(
({ className: t, ...r }, a) => /* @__PURE__ */ e.createElement(
"div",
{
ref: a,
className: n(mr(), t),
...r
}
)
);
br.displayName = "ModalHeader";
const vr = e.forwardRef(
({ className: t, ...r }, a) => /* @__PURE__ */ e.createElement(
"div",
{
ref: a,
className: n(ur(), t),
...r
}
)
);
vr.displayName = "ModalFooter";
const Er = e.forwardRef(({ className: t, ...r }, a) => /* @__PURE__ */ e.createElement(
S.Title,
{
ref: a,
className: n(fr(), t),
...r
}
));
Er.displayName = S.Title.displayName;
const wr = e.forwardRef(({ className: t, ...r }, a) => /* @__PURE__ */ e.createElement(
S.Description,
{
ref: a,
className: n(pr(), t),
...r
}
));
wr.displayName = S.Description.displayName;
const xr = o(
"fixed z-50 gap-4 bg-background p-6 shadow-lg transition ease-in-out data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:duration-300 data-[state=open]:duration-500",
{
variants: {
side: {
left: "inset-y-0 left-0 h-full w-3/4 border-r data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm",
right: "inset-y-0 right-0 h-full w-3/4 border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm",
top: "inset-x-0 top-0 border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top",
bottom: "inset-x-0 bottom-0 border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom"
}
},
defaultVariants: {
side: "right"
}
}
), Nr = o(
"fixed inset-0 z-50 bg-background/80 backdrop-blur-sm data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0"
), yr = o(
"flex flex-col space-y-2 text-center sm:text-left"
), kr = o(
"flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2"
), Vr = o(
"text-lg font-semibold text-foreground"
), Sr = o(
"text-sm text-muted-foreground"
), ts = S.Root, as = S.Trigger, rs = S.Close, Cr = S.Portal, ct = e.forwardRef(({ className: t, ...r }, a) => /* @__PURE__ */ e.createElement(
S.Overlay,
{
className: n(Nr(), t),
...r,
ref: a
}
));
ct.displayName = S.Overlay.displayName;
const Rr = e.forwardRef(({ side: t = "right", className: r, children: a, ...s }, l) => /* @__PURE__ */ e.createElement(Cr, null, /* @__PURE__ */ e.createElement(ct, null), /* @__PURE__ */ e.createElement(
S.Content,
{
ref: l,
className: n(xr({ side: t }), r),
...s
},
a,
/* @__PURE__ */ e.createElement(S.Close, { className: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-secondary" }, /* @__PURE__ */ e.createElement(ie, { className: "h-4 w-4" }), /* @__PURE__ */ e.createElement("span", { className: "sr-only" }, "Close"))
)));
Rr.displayName = S.Content.displayName;
const Mr = e.forwardRef(
({ className: t, ...r }, a) => /* @__PURE__ */ e.createElement(
"div",
{
ref: a,
className: n(yr(), t),
...r
}
)
);
Mr.displayName = "SheetHeader";
const Dr = e.forwardRef(
({ className: t, ...r }, a) => /* @__PURE__ */ e.createElement(
"div",
{
ref: a,
className: n(kr(), t),
...r
}
)
);
Dr.displayName = "SheetFooter";
const zr = e.forwardRef(({ className: t, ...r }, a) => /* @__PURE__ */ e.createElement(
S.Title,
{
ref: a,
className: n(Vr(), t),
...r
}
));
zr.displayName = S.Title.displayName;
const Ir = e.forwardRef(({ className: t, ...r }, a) => /* @__PURE__ */ e.createElement(
S.Description,
{
ref: a,
className: n(Sr(), t),
...r
}
));
Ir.displayName = S.Description.displayName;
const Tr = o(
"group pointer-events-auto relative flex w-full items-center justify-between space-x-4 overflow-hidden rounded-md border p-6 pr-8 shadow-lg transition-all data-[swipe=cancel]:translate-x-0 data-[swipe=end]:translate-x-[var(--radix-toast-swipe-end-x)] data-[swipe=move]:translate-x-[var(--radix-toast-swipe-move-x)] data-[swipe=move]:transition-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[swipe=end]:animate-out data-[state=closed]:fade-out-80 data-[state=closed]:slide-out-to-right-full data-[state=open]:slide-in-from-top-full data-[state=open]:sm:slide-in-from-bottom-full",
{
variants: {
variant: {
info: "border bg-blue-50 text-blue-900 dark:bg-blue-900/20 dark:text-blue-100",
success: "border bg-green-50 text-green-900 dark:bg-green-900/20 dark:text-green-100",
error: "border bg-red-50 text-red-900 dark:bg-red-900/20 dark:text-red-100"
}
},
defaultVariants: {
variant: "info"
}
}
), Pr = o(
"fixed top-0 z-[100] flex max-h-screen w-full flex-col-reverse p-4 sm:bottom-0 sm:right-0 sm:top-auto sm:flex-col md:max-w-[420px]"
), jr = o(
"text-sm font-semibold"
), Lr = o(
"text-sm opacity-90"
), Fr = o(
"inline-flex h-8 shrink-0 items-center justify-center rounded-md border bg-transparent px-3 text-xs font-medium ring-offset-background transition-colors hover:bg-secondary focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 group-[.info]:border-blue-200 group-[.info]:hover:border-blue-300 group-[.success]:border-green-200 group-[.success]:hover:border-green-300 group-[.error]:border-red-200 group-[.error]:hover:border-red-300"
), Ur = o(
"absolute right-2 top-2 rounded-md p-1 text-foreground/50 opacity-0 transition-opacity hover:text-foreground focus:opacity-100 focus:outline-none focus:ring-2 group-hover:opacity-100"
), ns = G.Provider, Ar = e.forwardRef(({ className: t, ...r }, a) => /* @__PURE__ */ e.createElement(
G.Viewport,
{
ref: a,
className: n(Pr(), t),
...r
}
));
Ar.displayName = G.Viewport.displayName;
const Br = e.forwardRef(({ className: t, variant: r, ...a }, s) => {
const l = r === "success" ? It : r === "error" ? Tt : Pt;
return /* @__PURE__ */ e.createElement(
G.Root,
{
ref: s,
className: n(Tr({ variant: r }), t),
duration: 5e3,
...a
},
/* @__PURE__ */ e.createElement("div", { className: "flex items-start space-x-3" }, /* @__PURE__ */ e.createElement(l, { className: "h-5 w-5 mt-0.5 flex-shrink-0" }), /* @__PURE__ */ e.createElement("div", { className: "flex-1" }, a.children))
);
});
Br.displayName = G.Root.displayName;
const Or = e.forwardRef(({ className: t, ...r }, a) => /* @__PURE__ */ e.createElement(
G.Action,
{
ref: a,
className: n(Fr(), t),
...r
}
));
Or.displayName = G.Action.displayName;
const _r = e.forwardRef(({ className: t, ...r }, a) => /* @__PURE__ */ e.createElement(
G.Close,
{
ref: a,
className: n(Ur(), t),
"toast-close": "",
...r
},
/* @__PURE__ */ e.createElement(ie, { className: "h-4 w-4" })
));
_r.displayName = G.Close.displayName;
const Gr = e.forwardRef(({ className: t, ...r }, a) => /* @__PURE__ */ e.createElement(
G.Title,
{
ref: a,
className: n(jr(), t),
...r
}
));
Gr.displayName = G.Title.displayName;
const Hr = e.forwardRef(({ className: t, ...r }, a) => /* @__PURE__ */ e.createElement(
G.Description,
{
ref: a,
className: n(Lr(), t),
...r
}
));
Hr.displayName = G.Description.displayName;
const $r = o(
"w-full border-collapse rounded-md border border-border",
{
variants: {
variant: {
default: "bg-background"
}
},
defaultVariants: {
variant: "default"
}
}
), Yr = o(
"bg-zinc-100 dark:bg-zinc-800 border-b border-border"
), qr = o(
"px-4 py-3 text-left text-sm font-medium text-foreground"
), Jr = o(
"border-b border-border transition-colors hover:bg-muted/50",
{
variants: {
variant: {
default: "",
selected: "bg-muted"
}
},
defaultVariants: {
variant: "default"
}
}
), Pe = o("px-4 py-3 text-sm text-foreground"), dt = e.forwardRef(
({
className: t,
variant: r,
data: a,
columns: s,
totalCount: l,
loading: i = !1,
keepSearch: m = !0,
keepFilters: u = !0,
keepPagination: p = !0,
keepSort: g = !0,
pageSize: h = 10,
actionButtons: b = [],
onRowClick: x,
selectedRows: N = [],
onSelectionChange: C,
filterOptions: j = {},
initialState: E = {},
onStateChange: P,
onSearchChange: L,
onFilterChange: D,
onSortChange: R,
onPageChange: O,
onPageSizeChange: y,
...H
}, I) => {
const [f, J] = e.useState({
search: "",
filters: {},
sortColumn: null,
sortDirection: "asc",
currentPage: 1,
pageSize: h,
...E
}), q = e.useRef(), _ = e.useCallback(
(c) => {
J(c), P == null || P(c);
},
[P]
), K = e.useCallback(
(c) => {
const k = { ...f, search: c, currentPage: 1 };
q.current && clearTimeout(q.current), q.current = setTimeout(() => {
_(k), L == null || L(c, k);
}, 300), J(k);
},
[f, _, L]
), ee = e.useCallback(
(c, k) => {
const V = { ...f.filters };
k === "__all__" || k === "" ? delete V[c] : V[c] = k;
const Z = {
...f,
filters: V,
currentPage: 1
};
_(Z), D == null || D(V, Z);
},
[f, _, D]
), Q = e.useCallback(
(c) => {
if (!g) return;
const k = f.sortColumn === c && f.sortDirection === "asc" ? "desc" : "asc", V = {
...f,
sortColumn: c,
sortDirection: k
};
_(V), R == null || R(c, k, V);
},
[f, g, _, R]
), v = e.useCallback(
(c) => {
const k = { ...f, currentPage: c };
_(k), O == null || O(c, k);
},
[f, _, O]
), F = e.useCallback(
(c) => {
const k = { ...f, pageSize: c, currentPage: 1 };