@vadimcomanescu/nadicode-design-system 2.0.8 → 4.0.0

package/dist/chunk-WSBLCWY7.js

@@ -0,0 +1,126 @@
+import { useSafeTimeout } from './chunk-MDAYDDTC.js';
+import { ScrollArea } from './chunk-GLU236NN.js';
+import { Input } from './chunk-AP3XXYAY.js';
+import { Avatar, AvatarFallback } from './chunk-NAAU5IWU.js';
+import { Button } from './chunk-7KIDDF3I.js';
+import { useMotionConfig, m, motionSpring } from './chunk-PD2YEH3H.js';
+import { MicIcon } from './chunk-4NXZIMYZ.js';
+import { BotIcon } from './chunk-LSPO6OBI.js';
+import { SendIcon } from './chunk-CRZ2JE24.js';
+import { UserIcon } from './chunk-UHXGBV5N.js';
+import { cn } from './chunk-QYZT24TS.js';
+import * as React from 'react';
+import { useTranslations } from 'next-intl';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var defaultInitialMessages = [
+  {
+    id: "1",
+    role: "assistant",
+    content: "Hello! How can I help you today?"
+  }
+];
+function ChatLayout({
+  initialMessages = defaultInitialMessages,
+  assistantName = "AI Assistant",
+  assistantStatus = "Online",
+  placeholder = "Type a message...",
+  className
+}) {
+  const t = useTranslations("blocks.chatLayout");
+  const motionConfig = useMotionConfig();
+  const [messages, setMessages] = React.useState(initialMessages);
+  const [input, setInput] = React.useState("");
+  const scrollRef = React.useRef(null);
+  const setSafeTimeout = useSafeTimeout();
+  const handleSend = () => {
+    if (!input.trim()) return;
+    const newMessage = {
+      id: Date.now().toString(),
+      role: "user",
+      content: input
+    };
+    setMessages((prev) => [...prev, newMessage]);
+    setInput("");
+    setSafeTimeout(() => {
+      setMessages((prev) => [
+        ...prev,
+        {
+          id: (Date.now() + 1).toString(),
+          role: "assistant",
+          content: "This is a simulated response matching the design system."
+        }
+      ]);
+    }, 1e3);
+  };
+  React.useEffect(() => {
+    if (scrollRef.current) {
+      scrollRef.current.scrollIntoView({ behavior: "smooth" });
+    }
+  }, [messages]);
+  return /* @__PURE__ */ jsxs("div", { className: cn("flex h-[350px] md:h-[500px] w-full flex-col overflow-hidden rounded-lg glass-panel", className), children: [
+    /* @__PURE__ */ jsx("div", { className: "flex items-center justify-between border-b border-border/50 p-4", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ jsx(Avatar, { className: "h-8 w-8", children: /* @__PURE__ */ jsx(AvatarFallback, { className: "bg-accent text-accent-foreground", children: /* @__PURE__ */ jsx(BotIcon, { size: 16 }) }) }),
+      /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx("p", { className: "text-sm font-medium", children: assistantName }),
+        /* @__PURE__ */ jsx("p", { className: "text-xs text-text-tertiary", children: assistantStatus })
+      ] })
+    ] }) }),
+    /* @__PURE__ */ jsx(ScrollArea, { className: "flex-1 p-4", children: /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
+      messages.map((message, index) => /* @__PURE__ */ jsxs(
+        m.div,
+        {
+          initial: { opacity: 0, y: 8 },
+          animate: { opacity: 1, y: 0 },
+          transition: { ...motionSpring.snappy, delay: index * 0.05, ...motionConfig },
+          className: cn(
+            "flex w-full gap-2",
+            message.role === "user" ? "justify-end" : "justify-start"
+          ),
+          children: [
+            message.role !== "user" && /* @__PURE__ */ jsx(Avatar, { className: "h-8 w-8 mt-1.5", children: /* @__PURE__ */ jsx(AvatarFallback, { className: "bg-accent text-accent-foreground", children: /* @__PURE__ */ jsx(BotIcon, { size: 16 }) }) }),
+            /* @__PURE__ */ jsx(
+              "div",
+              {
+                className: cn(
+                  "max-w-[80%] rounded-lg px-4 py-2 text-sm",
+                  message.role === "user" ? "bg-primary text-primary-foreground" : "bg-surface border border-border"
+                ),
+                children: message.content
+              }
+            ),
+            message.role === "user" && /* @__PURE__ */ jsx(Avatar, { className: "h-8 w-8 mt-1.5", children: /* @__PURE__ */ jsx(AvatarFallback, { className: "bg-secondary", children: /* @__PURE__ */ jsx(UserIcon, { size: 16 }) }) })
+          ]
+        },
+        message.id
+      )),
+      /* @__PURE__ */ jsx("div", { ref: scrollRef })
+    ] }) }),
+    /* @__PURE__ */ jsx("div", { className: "p-4 border-t border-border bg-surface/30", children: /* @__PURE__ */ jsxs(
+      "form",
+      {
+        onSubmit: (e) => {
+          e.preventDefault();
+          handleSend();
+        },
+        className: "flex items-center gap-2",
+        children: [
+          /* @__PURE__ */ jsx(Button, { type: "button", size: "icon", variant: "ghost", "aria-label": t("voiceInput"), children: /* @__PURE__ */ jsx(MicIcon, { size: 16 }) }),
+          /* @__PURE__ */ jsx(
+            Input,
+            {
+              name: "message",
+              placeholder,
+              value: input,
+              onChange: (e) => setInput(e.target.value),
+              className: "flex-1"
+            }
+          ),
+          /* @__PURE__ */ jsx(Button, { type: "submit", size: "icon", disabled: !input.trim(), "aria-label": t("sendMessage"), children: /* @__PURE__ */ jsx(SendIcon, { size: 16 }) })
+        ]
+      }
+    ) })
+  ] });
+}
+
+export { ChatLayout };

package/dist/chunk-XKKFSFYO.js

@@ -0,0 +1,93 @@
+import { Step } from './chunk-HS7QNBCO.js';
+import { Stepper } from './chunk-2WEUTBDI.js';
+import { Heading } from './chunk-WI547C47.js';
+import { Field, FieldLabel } from './chunk-RX5EUODB.js';
+import { Input } from './chunk-AP3XXYAY.js';
+import { Card, CardHeader, CardTitle, CardDescription, CardContent, CardFooter } from './chunk-AH6YSYYT.js';
+import { Button } from './chunk-7KIDDF3I.js';
+import { SettingsIcon } from './chunk-OITJWGFV.js';
+import { RocketIcon } from './chunk-QPXTBZWN.js';
+import { CreditCardIcon } from './chunk-JHQTKMKG.js';
+import { UserIcon } from './chunk-UHXGBV5N.js';
+import { useState } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var defaultSteps = [
+  { title: "Account", description: "Setup your account", icon: /* @__PURE__ */ jsx(UserIcon, { size: 16 }) },
+  { title: "Profile", description: "Add personal info", icon: /* @__PURE__ */ jsx(SettingsIcon, { size: 16 }) },
+  { title: "Plan", description: "Choose a plan", icon: /* @__PURE__ */ jsx(CreditCardIcon, { size: 16 }) },
+  { title: "Launch", description: "Ready to go", icon: /* @__PURE__ */ jsx(RocketIcon, { size: 16 }) }
+];
+function WizardBlock({
+  title = "Create Project",
+  description = "Follow the steps to setup your new project workspace.",
+  steps = defaultSteps,
+  onFinish,
+  className
+}) {
+  const [activeStep, setActiveStep] = useState(0);
+  const handleNext = () => setActiveStep((p) => Math.min(p + 1, steps.length - 1));
+  const handlePrev = () => setActiveStep((p) => Math.max(p - 1, 0));
+  return /* @__PURE__ */ jsxs(Card, { className: className ?? "w-full max-w-2xl mx-auto", children: [
+    /* @__PURE__ */ jsxs(CardHeader, { children: [
+      /* @__PURE__ */ jsx(CardTitle, { children: title }),
+      /* @__PURE__ */ jsx(CardDescription, { children: description })
+    ] }),
+    /* @__PURE__ */ jsxs(CardContent, { className: "space-y-8", children: [
+      /* @__PURE__ */ jsx(Stepper, { activeStep, onStepChange: setActiveStep, className: "justify-between", children: steps.map((step, index) => /* @__PURE__ */ jsx(
+        Step,
+        {
+          index,
+          title: step.title,
+          description: step.description,
+          icon: step.icon,
+          completed: index < activeStep
+        },
+        index
+      )) }),
+      /* @__PURE__ */ jsxs("div", { className: "min-h-[200px] border rounded-lg p-6 bg-muted/20 animate-in fade-in slide-in-from-bottom-2 duration-300", children: [
+        activeStep === 0 && /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
+          /* @__PURE__ */ jsxs(Field, { children: [
+            /* @__PURE__ */ jsx(FieldLabel, { children: "Username" }),
+            /* @__PURE__ */ jsx(Input, { placeholder: "jdoe" })
+          ] }),
+          /* @__PURE__ */ jsxs(Field, { children: [
+            /* @__PURE__ */ jsx(FieldLabel, { children: "Email" }),
+            /* @__PURE__ */ jsx(Input, { placeholder: "john@example.com" })
+          ] })
+        ] }),
+        activeStep === 1 && /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
+          /* @__PURE__ */ jsxs(Field, { children: [
+            /* @__PURE__ */ jsx(FieldLabel, { children: "Full Name" }),
+            /* @__PURE__ */ jsx(Input, { placeholder: "John Doe" })
+          ] }),
+          /* @__PURE__ */ jsxs(Field, { children: [
+            /* @__PURE__ */ jsx(FieldLabel, { children: "Bio" }),
+            /* @__PURE__ */ jsx(Input, { placeholder: "Tell us about yourself" })
+          ] })
+        ] }),
+        activeStep === 2 && /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
+          /* @__PURE__ */ jsxs("div", { className: "border p-4 rounded-lg bg-background hover:bg-accent/50 cursor-pointer transition-colors", children: [
+            /* @__PURE__ */ jsx(Heading, { level: 3, size: "title", className: "font-bold", children: "Free" }),
+            /* @__PURE__ */ jsx("p", { className: "text-sm text-text-tertiary", children: "For hobbyists" })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "border border-primary p-4 rounded-lg bg-primary/10 cursor-pointer", children: [
+            /* @__PURE__ */ jsx(Heading, { level: 3, size: "title", className: "font-bold text-primary", children: "Pro" }),
+            /* @__PURE__ */ jsx("p", { className: "text-sm text-text-tertiary", children: "For professionals" })
+          ] })
+        ] }),
+        activeStep === 3 && /* @__PURE__ */ jsxs("div", { className: "text-center space-y-4 py-8", children: [
+          /* @__PURE__ */ jsx(RocketIcon, { size: 64, className: "mx-auto text-primary animate-[float_2s_ease-in-out_infinite] motion-reduce:animate-none" }),
+          /* @__PURE__ */ jsx(Heading, { level: 3, size: "title", children: "Ready to Launch!" }),
+          /* @__PURE__ */ jsx("p", { className: "text-text-tertiary", children: "Review your settings and click Finish to deploy." })
+        ] })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs(CardFooter, { className: "flex justify-between", children: [
+      /* @__PURE__ */ jsx(Button, { variant: "outline", onClick: handlePrev, disabled: activeStep === 0, children: "Previous" }),
+      /* @__PURE__ */ jsx(Button, { onClick: activeStep === steps.length - 1 ? onFinish : handleNext, children: activeStep === steps.length - 1 ? "Finish" : "Next" })
+    ] })
+  ] });
+}
+
+export { WizardBlock };

package/dist/chunk-XO7TBM47.js

@@ -0,0 +1,32 @@
+import { AnimatedGradientText } from './chunk-XZ3A33GP.js';
+import { Typography } from './chunk-N53OMWW2.js';
+import { MeteorShower } from './chunk-ZU55E4A7.js';
+import { Heading } from './chunk-WI547C47.js';
+import { Button } from './chunk-7KIDDF3I.js';
+import { ArrowLeftIcon } from './chunk-74RKVIBV.js';
+import { cn } from './chunk-QYZT24TS.js';
+import Link from 'next/link';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+function NotFoundBlock({
+  title = "404",
+  description = "The page you're looking for doesn't exist or has been moved.",
+  backHref = "/",
+  backLabel = "Back home",
+  className
+}) {
+  return /* @__PURE__ */ jsxs("div", { className: cn("relative flex min-h-[60vh] items-center justify-center overflow-hidden", className), children: [
+    /* @__PURE__ */ jsx(MeteorShower, { className: "absolute inset-0" }),
+    /* @__PURE__ */ jsx("div", { className: "relative z-10 mx-auto max-w-md px-6 text-center", children: /* @__PURE__ */ jsxs("div", { className: "glass-panel rounded-2xl border border-border/50 p-10 shadow-2xl", children: [
+      /* @__PURE__ */ jsx(AnimatedGradientText, { className: "text-8xl font-extrabold tracking-tighter sm:text-9xl", children: title }),
+      /* @__PURE__ */ jsx(Heading, { level: 3, size: "subsection", className: "mt-4 text-text-primary", children: "Page not found" }),
+      /* @__PURE__ */ jsx(Typography, { variant: "body", className: "mt-2 text-text-secondary", children: description }),
+      /* @__PURE__ */ jsx(Button, { asChild: true, size: "lg", variant: "accent", className: "mt-8", children: /* @__PURE__ */ jsxs(Link, { href: backHref, children: [
+        /* @__PURE__ */ jsx(ArrowLeftIcon, { size: 16, className: "mr-2" }),
+        backLabel
+      ] }) })
+    ] }) })
+  ] });
+}
+
+export { NotFoundBlock };

package/dist/chunk-YDYDGG5K.js

@@ -0,0 +1,132 @@
+import { RoleBadge } from './chunk-OHCQPI3W.js';
+import { Select, SelectTrigger, SelectValue, SelectContent, SelectItem } from './chunk-WH62BE24.js';
+import { Field, FieldLabel } from './chunk-RX5EUODB.js';
+import { Dialog, DialogTrigger, DialogContent, DialogHeader, DialogTitle, DialogDescription, DialogFooter } from './chunk-W73JAOHW.js';
+import { Input } from './chunk-AP3XXYAY.js';
+import { Button } from './chunk-7KIDDF3I.js';
+import { PlusIcon } from './chunk-E7RBK6ML.js';
+import { MailIcon } from './chunk-XQ2UDMPO.js';
+import { CheckIcon } from './chunk-CXACRCZ4.js';
+import * as React from 'react';
+import { useForm } from 'react-hook-form';
+import { zodResolver } from '@hookform/resolvers/zod';
+import * as z from 'zod';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+
+var inviteSchema = z.object({
+  email: z.string().email({ message: "Please enter a valid email address." }),
+  role: z.enum(["admin", "member", "guest"])
+});
+function InviteUserModal({ onInvite, onInvited }) {
+  const [open, setOpen] = React.useState(false);
+  const [isPending, startTransition] = React.useTransition();
+  const [submitError, setSubmitError] = React.useState();
+  const {
+    register,
+    handleSubmit,
+    setValue,
+    reset,
+    formState: { errors }
+  } = useForm({
+    resolver: zodResolver(inviteSchema),
+    defaultValues: {
+      role: "member"
+    }
+  });
+  function onSubmit(values) {
+    setSubmitError(void 0);
+    startTransition(() => {
+      void Promise.resolve(onInvite?.(values)).then((result) => {
+        if (result === false) {
+          setSubmitError("Failed to send invitation.");
+          return;
+        }
+        if (typeof result === "object" && result !== null && "success" in result && result.success === false) {
+          setSubmitError(result.error ?? "Failed to send invitation.");
+          return;
+        }
+        setOpen(false);
+        reset();
+        onInvited?.();
+      }).catch(() => {
+        setSubmitError("Failed to send invitation.");
+      });
+    });
+  }
+  return /* @__PURE__ */ jsxs(Dialog, { open, onOpenChange: setOpen, children: [
+    /* @__PURE__ */ jsx(DialogTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(Button, { variant: "accent", className: "gap-2", children: [
+      /* @__PURE__ */ jsx(PlusIcon, { size: 16 }),
+      "Invite User"
+    ] }) }),
+    /* @__PURE__ */ jsxs(DialogContent, { className: "sm:max-w-[425px]", children: [
+      /* @__PURE__ */ jsxs(DialogHeader, { children: [
+        /* @__PURE__ */ jsx(DialogTitle, { children: "Invite Teammate" }),
+        /* @__PURE__ */ jsx(DialogDescription, { children: "Send an invitation to join your workspace. They will receive an email with a magic link." })
+      ] }),
+      /* @__PURE__ */ jsxs("form", { onSubmit: handleSubmit(onSubmit), className: "space-y-6 pt-4", children: [
+        /* @__PURE__ */ jsxs(Field, { children: [
+          /* @__PURE__ */ jsx(FieldLabel, { htmlFor: "email", children: "Email Address" }),
+          /* @__PURE__ */ jsxs("div", { className: "relative", children: [
+            /* @__PURE__ */ jsx(MailIcon, { size: 16, className: "absolute left-4 top-2.5 text-text-tertiary" }),
+            /* @__PURE__ */ jsx(
+              Input,
+              {
+                id: "email",
+                placeholder: "colleague@company.com",
+                className: "pl-10",
+                ...register("email")
+              }
+            )
+          ] }),
+          errors.email && /* @__PURE__ */ jsx("p", { className: "text-xs font-medium text-destructive", children: errors.email.message })
+        ] }),
+        /* @__PURE__ */ jsxs(Field, { children: [
+          /* @__PURE__ */ jsx(FieldLabel, { children: "Role" }),
+          /* @__PURE__ */ jsxs(
+            Select,
+            {
+              defaultValue: "member",
+              onValueChange: (val) => setValue("role", val),
+              children: [
+                /* @__PURE__ */ jsx(SelectTrigger, { children: /* @__PURE__ */ jsx(SelectValue, { placeholder: "Select a role" }) }),
+                /* @__PURE__ */ jsxs(SelectContent, { children: [
+                  /* @__PURE__ */ jsx(SelectItem, { value: "admin", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+                    /* @__PURE__ */ jsx(RoleBadge, { role: "admin" }),
+                    /* @__PURE__ */ jsx("span", { className: "text-text-secondary", children: "Full access" })
+                  ] }) }),
+                  /* @__PURE__ */ jsx(SelectItem, { value: "member", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+                    /* @__PURE__ */ jsx(RoleBadge, { role: "member" }),
+                    /* @__PURE__ */ jsx("span", { className: "text-text-secondary", children: "Can view and edit" })
+                  ] }) }),
+                  /* @__PURE__ */ jsx(SelectItem, { value: "guest", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+                    /* @__PURE__ */ jsx(RoleBadge, { role: "guest" }),
+                    /* @__PURE__ */ jsx("span", { className: "text-text-secondary", children: "View only" })
+                  ] }) })
+                ] })
+              ]
+            }
+          ),
+          errors.role && /* @__PURE__ */ jsx("p", { className: "text-xs font-medium text-destructive", children: errors.role.message })
+        ] }),
+        /* @__PURE__ */ jsxs(DialogFooter, { children: [
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              type: "button",
+              variant: "outline",
+              onClick: () => setOpen(false),
+              children: "Cancel"
+            }
+          ),
+          /* @__PURE__ */ jsx(Button, { type: "submit", variant: "accent", disabled: isPending, children: isPending ? /* @__PURE__ */ jsx(Fragment, { children: "Sending..." }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx(CheckIcon, { size: 16, className: "mr-2" }),
+            " Send Invite"
+          ] }) })
+        ] }),
+        !!submitError && /* @__PURE__ */ jsx("p", { className: "text-xs font-medium text-destructive", children: submitError })
+      ] })
+    ] })
+  ] });
+}
+
+export { InviteUserModal };

package/dist/chunk-YMJOUYMT.js

@@ -0,0 +1,171 @@
+import { HeatmapChartBlock } from './chunk-VDONTZZX.js';
+import { RadialBarChart } from './chunk-WAP7DBSW.js';
+import { AreaChart } from './chunk-IPXL7WX7.js';
+import { BarChart } from './chunk-UWHKZX4Y.js';
+import { LineChart } from './chunk-HRIEX66J.js';
+import { PieChart } from './chunk-U7V6TREO.js';
+import { RadarChart } from './chunk-LDW4LHUM.js';
+import { StaggerChildren } from './chunk-DQPK2XRL.js';
+import { Card, CardHeader, CardTitle, CardDescription, CardContent } from './chunk-AH6YSYYT.js';
+import { cn } from './chunk-QYZT24TS.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var areaData = [
+  { month: "Jan", desktop: 186, mobile: 80 },
+  { month: "Feb", desktop: 305, mobile: 200 },
+  { month: "Mar", desktop: 237, mobile: 120 },
+  { month: "Apr", desktop: 73, mobile: 190 },
+  { month: "May", desktop: 209, mobile: 130 },
+  { month: "Jun", desktop: 214, mobile: 140 }
+];
+var chartData = [
+  { browser: "chrome", visitors: 275, fill: "rgb(var(--chart-1))" },
+  { browser: "safari", visitors: 200, fill: "rgb(var(--chart-2))" },
+  { browser: "firefox", visitors: 187, fill: "rgb(var(--chart-3))" },
+  { browser: "edge", visitors: 173, fill: "rgb(var(--chart-4))" },
+  { browser: "other", visitors: 90, fill: "rgb(var(--chart-5))" }
+];
+var radarData = [
+  { month: "January", desktop: 186 },
+  { month: "February", desktop: 305 },
+  { month: "March", desktop: 237 },
+  { month: "April", desktop: 273 },
+  { month: "May", desktop: 209 },
+  { month: "June", desktop: 214 }
+];
+var radialData = [
+  { browser: "chrome", visitors: 275, fill: "rgb(var(--chart-1))" },
+  { browser: "safari", visitors: 200, fill: "rgb(var(--chart-2))" },
+  { browser: "firefox", visitors: 187, fill: "rgb(var(--chart-3))" },
+  { browser: "edge", visitors: 173, fill: "rgb(var(--chart-4))" },
+  { browser: "other", visitors: 90, fill: "rgb(var(--chart-5))" }
+];
+var areaConfig = {
+  desktop: {
+    label: "Desktop",
+    color: "rgb(var(--chart-1))"
+  }
+};
+var barLineConfig = {
+  desktop: {
+    label: "Desktop",
+    color: "rgb(var(--chart-1))"
+  }
+};
+var pieConfig = {
+  chrome: { label: "Chrome", color: "rgb(var(--chart-1))" },
+  safari: { label: "Safari", color: "rgb(var(--chart-2))" },
+  firefox: { label: "Firefox", color: "rgb(var(--chart-3))" },
+  edge: { label: "Edge", color: "rgb(var(--chart-4))" },
+  other: { label: "Other", color: "rgb(var(--chart-5))" }
+};
+var radarConfig = {
+  desktop: {
+    label: "Desktop",
+    color: "rgb(var(--chart-1))"
+  }
+};
+var radialConfig = {
+  chrome: { label: "Chrome", color: "rgb(var(--chart-1))" },
+  safari: { label: "Safari", color: "rgb(var(--chart-2))" },
+  firefox: { label: "Firefox", color: "rgb(var(--chart-3))" },
+  edge: { label: "Edge", color: "rgb(var(--chart-4))" },
+  other: { label: "Other", color: "rgb(var(--chart-5))" }
+};
+function ChartCollectionBlock({ className }) {
+  return /* @__PURE__ */ jsxs(StaggerChildren, { staggerMs: 100, className: cn("grid gap-6 md:grid-cols-2 lg:grid-cols-3", className), children: [
+    /* @__PURE__ */ jsxs(Card, { children: [
+      /* @__PURE__ */ jsxs(CardHeader, { children: [
+        /* @__PURE__ */ jsx(CardTitle, { children: "Area Chart" }),
+        /* @__PURE__ */ jsx(CardDescription, { children: "Usage overview" })
+      ] }),
+      /* @__PURE__ */ jsx(CardContent, { children: areaData.length > 0 && /* @__PURE__ */ jsx(
+        AreaChart,
+        {
+          data: areaData,
+          config: areaConfig,
+          indexKey: "month",
+          areas: ["desktop"],
+          className: "h-[250px] w-full",
+          showLegend: false
+        }
+      ) })
+    ] }),
+    /* @__PURE__ */ jsxs(Card, { children: [
+      /* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsx(CardTitle, { children: "Bar Chart" }) }),
+      /* @__PURE__ */ jsx(CardContent, { children: areaData.length > 0 && /* @__PURE__ */ jsx(
+        BarChart,
+        {
+          data: areaData,
+          config: barLineConfig,
+          indexKey: "month",
+          bars: ["desktop"],
+          className: "h-[250px] w-full",
+          showLegend: false
+        }
+      ) })
+    ] }),
+    /* @__PURE__ */ jsxs(Card, { children: [
+      /* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsx(CardTitle, { children: "Line Chart" }) }),
+      /* @__PURE__ */ jsx(CardContent, { children: areaData.length > 0 && /* @__PURE__ */ jsx(
+        LineChart,
+        {
+          data: areaData,
+          config: barLineConfig,
+          indexKey: "month",
+          lines: ["desktop"],
+          className: "h-[250px] w-full",
+          showLegend: false
+        }
+      ) })
+    ] }),
+    /* @__PURE__ */ jsxs(Card, { children: [
+      /* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsx(CardTitle, { children: "Pie Chart" }) }),
+      /* @__PURE__ */ jsx(CardContent, { children: chartData.length > 0 && /* @__PURE__ */ jsx(
+        PieChart,
+        {
+          data: chartData,
+          config: pieConfig,
+          dataKey: "visitors",
+          nameKey: "browser",
+          variant: "donut",
+          innerRadius: 60,
+          showLegend: false
+        }
+      ) })
+    ] }),
+    /* @__PURE__ */ jsxs(Card, { children: [
+      /* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsx(CardTitle, { children: "Radar Chart" }) }),
+      /* @__PURE__ */ jsx(CardContent, { children: radarData.length > 0 && /* @__PURE__ */ jsx(
+        RadarChart,
+        {
+          data: radarData,
+          config: radarConfig,
+          indexKey: "month",
+          series: ["desktop"],
+          className: "h-[250px] w-full",
+          showLegend: false
+        }
+      ) })
+    ] }),
+    /* @__PURE__ */ jsxs(Card, { children: [
+      /* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsx(CardTitle, { children: "Radial Chart" }) }),
+      /* @__PURE__ */ jsx(CardContent, { children: radialData.length > 0 && /* @__PURE__ */ jsx(
+        RadialBarChart,
+        {
+          data: radialData,
+          config: radialConfig,
+          dataKey: "visitors",
+          nameKey: "browser",
+          innerRadius: 40,
+          outerRadius: 100,
+          className: "h-[250px] w-full",
+          showLegend: false
+        }
+      ) })
+    ] }),
+    /* @__PURE__ */ jsx(HeatmapChartBlock, {})
+  ] });
+}
+
+export { ChartCollectionBlock };

package/dist/chunk-Z2WION42.js

@@ -0,0 +1,32 @@
+import { LoginBlock } from './chunk-RGE5OQMZ.js';
+import { cn } from './chunk-QYZT24TS.js';
+import { jsx } from 'react/jsx-runtime';
+
+function LoginPageKit({
+  action,
+  googleAction,
+  error,
+  showSocial = true,
+  labels,
+  forgotPasswordHref,
+  signUpHref,
+  className,
+  cardClassName
+}) {
+  return /* @__PURE__ */ jsx("section", { className: cn("min-h-dvh w-full bg-background px-4 py-12 md:px-8 md:py-20", className), children: /* @__PURE__ */ jsx("div", { className: "mx-auto flex w-full max-w-5xl items-center justify-center", children: /* @__PURE__ */ jsx(
+    LoginBlock,
+    {
+      className: cn("w-full", cardClassName),
+      type: "login",
+      action,
+      googleAction,
+      error,
+      showSocial,
+      labels,
+      forgotPasswordHref,
+      signUpHref
+    }
+  ) }) });
+}
+
+export { LoginPageKit };

package/dist/chunk-ZFKSVEYW.js

@@ -0,0 +1,35 @@
+import { LOCAL_CLOUD_LOGOS } from './chunk-QQOWC53X.js';
+import { Heading } from './chunk-WI547C47.js';
+import { cn } from './chunk-QYZT24TS.js';
+import Image from 'next/image';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+var defaultLogos = LOCAL_CLOUD_LOGOS;
+function heightClass(h) {
+  if (h <= 16) return "h-4";
+  if (h <= 20) return "h-5";
+  if (h <= 24) return "h-6";
+  return "h-7";
+}
+function LogoCloud({
+  title = "Your favorite companies are our partners.",
+  logos = defaultLogos,
+  className
+}) {
+  return /* @__PURE__ */ jsx("section", { className: className ?? "bg-background py-16", children: /* @__PURE__ */ jsxs("div", { className: "mx-auto max-w-5xl px-6", children: [
+    /* @__PURE__ */ jsx(Heading, { level: 2, size: "eyebrow", className: "text-center", children: title }),
+    /* @__PURE__ */ jsx("div", { className: "mx-auto mt-20 flex max-w-4xl flex-wrap items-center justify-center gap-x-12 gap-y-8 sm:gap-x-16 sm:gap-y-12", children: logos.map((logo) => /* @__PURE__ */ jsx(
+      Image,
+      {
+        className: cn(heightClass(logo.height), "w-auto dark:invert"),
+        src: logo.src,
+        alt: logo.alt,
+        height: logo.height,
+        width: logo.height * 4
+      },
+      logo.alt
+    )) })
+  ] }) });
+}
+
+export { LogoCloud };