@vadimcomanescu/nadicode-design-system 2.0.0

package/dist/components/blocks/OnboardingBlock.js

@@ -0,0 +1,181 @@
+'use client';
+import { Typography } from '../../chunk-N53OMWW2.js';
+import { Progress } from '../../chunk-JWQXBRE7.js';
+import { Checkbox } from '../../chunk-756Q7AC5.js';
+import { Card, CardHeader, CardTitle, CardContent } from '../../chunk-AH6YSYYT.js';
+import '../../chunk-PD2YEH3H.js';
+import '../../chunk-CRY67BIF.js';
+import '../../chunk-HJC6U46F.js';
+import '../../chunk-GO35FTNJ.js';
+import '../../chunk-PSVQ7ZNX.js';
+import '../../chunk-FLF5AMNO.js';
+import '../../chunk-WFJQ43SM.js';
+import '../../chunk-S4GKGKON.js';
+import '../../chunk-LCDDAE7J.js';
+import '../../chunk-R674XI7C.js';
+import '../../chunk-WUO7OONN.js';
+import '../../chunk-BPCCTJSK.js';
+import '../../chunk-CGUCH322.js';
+import '../../chunk-ELKIUARM.js';
+import '../../chunk-ZU2GYVAP.js';
+import '../../chunk-KSHJQ2VT.js';
+import '../../chunk-3CLXYQKB.js';
+import '../../chunk-JHQ5NMLZ.js';
+import '../../chunk-CRZ2JE24.js';
+import '../../chunk-TXGANOAX.js';
+import '../../chunk-OITJWGFV.js';
+import '../../chunk-Z74D6D2W.js';
+import '../../chunk-HNY45VUQ.js';
+import '../../chunk-IJJI4RQU.js';
+import '../../chunk-E7RBK6ML.js';
+import '../../chunk-UBIGDGOP.js';
+import '../../chunk-Q7LVUGFL.js';
+import '../../chunk-ALMGJVMT.js';
+import '../../chunk-QPXTBZWN.js';
+import '../../chunk-GAKU7DFY.js';
+import '../../chunk-T6BRD7TS.js';
+import '../../chunk-R5XP45PD.js';
+import '../../chunk-G5EO5FWC.js';
+import '../../chunk-NCULQXJE.js';
+import '../../chunk-VDYPDMYR.js';
+import '../../chunk-WDGIQDQG.js';
+import '../../chunk-WKRIKCJC.js';
+import '../../chunk-7WDT2PRI.js';
+import '../../chunk-AP5Y5M3R.js';
+import '../../chunk-JZ4G2SJH.js';
+import '../../chunk-KYGKJ553.js';
+import '../../chunk-M7YSMMAC.js';
+import '../../chunk-XQ2UDMPO.js';
+import '../../chunk-JMCSAGZ3.js';
+import '../../chunk-QUKDUSHD.js';
+import '../../chunk-4NXZIMYZ.js';
+import '../../chunk-TBKJ34BB.js';
+import '../../chunk-2IZC7HSV.js';
+import '../../chunk-2SDZMTB2.js';
+import '../../chunk-R3AO6AZM.js';
+import '../../chunk-RYOTIXZO.js';
+import '../../chunk-W3B3UOEG.js';
+import '../../chunk-ACRVOD7W.js';
+import '../../chunk-QSU23VYZ.js';
+import '../../chunk-BJYCQ2NV.js';
+import '../../chunk-VM462WZC.js';
+import '../../chunk-O74AEVHW.js';
+import '../../chunk-ZUHIWALK.js';
+import '../../chunk-5UZDOF6V.js';
+import '../../chunk-PKVTEDKO.js';
+import '../../chunk-I3TH7PIB.js';
+import '../../chunk-WGPK3FQ7.js';
+import '../../chunk-JL4MVVFH.js';
+import '../../chunk-IQEBXXB5.js';
+import '../../chunk-AZUJNRQU.js';
+import '../../chunk-WA45EC4Y.js';
+import '../../chunk-2MOEOEOI.js';
+import '../../chunk-5LCXASRW.js';
+import '../../chunk-2ZJVU7NV.js';
+import '../../chunk-5ESF6N36.js';
+import '../../chunk-RBPLOM3A.js';
+import '../../chunk-GCUTJI7M.js';
+import '../../chunk-2NT57K4U.js';
+import '../../chunk-6G3RRWJT.js';
+import '../../chunk-JRJGSNI4.js';
+import '../../chunk-RF6ECFS5.js';
+import '../../chunk-TV4RSQH4.js';
+import '../../chunk-4FEAWXJD.js';
+import '../../chunk-JHQTKMKG.js';
+import '../../chunk-CI7GPGCJ.js';
+import '../../chunk-226EBOTK.js';
+import '../../chunk-G5YLGJXR.js';
+import '../../chunk-G24VV5NO.js';
+import '../../chunk-6BAV4TZ5.js';
+import '../../chunk-SW6QPJM4.js';
+import '../../chunk-V6WNRZT3.js';
+import '../../chunk-JBK2LA6U.js';
+import '../../chunk-55U27XY4.js';
+import '../../chunk-LSPO6OBI.js';
+import '../../chunk-Y56WBNCY.js';
+import '../../chunk-KYZT3RNW.js';
+import '../../chunk-UEG2LI7Z.js';
+import '../../chunk-JJTQOH7J.js';
+import '../../chunk-72X6SXOX.js';
+import '../../chunk-SR5U52V3.js';
+import '../../chunk-74RKVIBV.js';
+import '../../chunk-AWIJHDNK.js';
+import '../../chunk-BRP6D56U.js';
+import '../../chunk-S733NAYS.js';
+import '../../chunk-MAUTIHQG.js';
+import '../../chunk-666N6OTL.js';
+import '../../chunk-FMH55OKV.js';
+import '../../chunk-WXVNTJIB.js';
+import { CheckIcon } from '../../chunk-CXACRCZ4.js';
+import '../../chunk-T7H53CK2.js';
+import '../../chunk-BFLN54VR.js';
+import '../../chunk-P6IRHPFM.js';
+import '../../chunk-SXHYB7JB.js';
+import '../../chunk-ONGJ7AC2.js';
+import '../../chunk-UHXGBV5N.js';
+import '../../chunk-UIUMTURU.js';
+import '../../chunk-PRUXIDBD.js';
+import '../../chunk-NURPUVUV.js';
+import '../../chunk-HJBXUXTD.js';
+import '../../chunk-ASKFAYYR.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 defaultSteps = [
+  { id: "account", title: "Create your account", description: "Sign up and verify your email address.", completed: true },
+  { id: "profile", title: "Complete your profile", description: "Add your name, avatar, and bio.", completed: true },
+  { id: "team", title: "Invite your team", description: "Add collaborators to your workspace.", completed: false },
+  { id: "project", title: "Create first project", description: "Set up your first design system project.", completed: false },
+  { id: "deploy", title: "Deploy to production", description: "Publish your component library.", completed: false }
+];
+function OnboardingBlock({
+  steps = defaultSteps,
+  title = "Getting started",
+  onToggle,
+  className
+}) {
+  const t = useTranslations("blocks.onboardingBlock");
+  const completedCount = React.useMemo(() => steps.filter((s) => s.completed).length, [steps]);
+  const progressPercent = steps.length > 0 ? Math.round(completedCount / steps.length * 100) : 0;
+  return /* @__PURE__ */ jsxs(Card, { className: cn("w-full max-w-lg", className), children: [
+    /* @__PURE__ */ jsxs(CardHeader, { children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+        /* @__PURE__ */ jsx(CardTitle, { className: "text-text-primary", children: title }),
+        /* @__PURE__ */ jsxs(Typography, { variant: "small", className: "text-text-tertiary tabular-nums", children: [
+          completedCount,
+          "/",
+          steps.length
+        ] })
+      ] }),
+      /* @__PURE__ */ jsx(Progress, { value: progressPercent, "aria-label": t("onboardingProgress"), className: "mt-4" })
+    ] }),
+    /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsx("ul", { className: "space-y-4", children: steps.map((step) => /* @__PURE__ */ jsxs("li", { className: "flex items-start gap-4", children: [
+      /* @__PURE__ */ jsx("div", { className: "pt-0.5", children: step.completed ? /* @__PURE__ */ jsx("div", { className: "flex h-5 w-5 items-center justify-center rounded-full bg-success text-success-foreground", children: /* @__PURE__ */ jsx(CheckIcon, { size: 12 }) }) : /* @__PURE__ */ jsx(
+        Checkbox,
+        {
+          checked: step.completed,
+          onCheckedChange: (checked) => onToggle?.(step.id, checked === true),
+          "aria-label": step.title
+        }
+      ) }),
+      /* @__PURE__ */ jsxs("div", { className: "flex-1", children: [
+        /* @__PURE__ */ jsx(
+          Typography,
+          {
+            variant: "small",
+            className: cn(
+              "font-medium",
+              step.completed ? "text-text-tertiary line-through" : "text-text-primary"
+            ),
+            children: step.title
+          }
+        ),
+        /* @__PURE__ */ jsx(Typography, { variant: "muted", className: "text-xs", children: step.description })
+      ] })
+    ] }, step.id)) }) })
+  ] });
+}
+
+export { OnboardingBlock };

package/dist/components/blocks/PasswordRecoveryBlock.d.ts

@@ -0,0 +1,12 @@
+interface PasswordRecoveryBlockProps {
+    className?: string;
+    mode?: "reset" | "magic-link";
+    onSubmit?: (email: string) => void;
+    onBackToLogin?: () => void;
+    title?: string;
+    description?: string;
+    buttonText?: string;
+    successTitle?: string;
+}
+export declare function PasswordRecoveryBlock({ className, mode, onSubmit, onBackToLogin, title, description, buttonText, successTitle, }: PasswordRecoveryBlockProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/blocks/PasswordRecoveryBlock.js

@@ -0,0 +1,146 @@
+'use client';
+import { useSafeTimeout } from '../../chunk-MDAYDDTC.js';
+import { Spinner } from '../../chunk-ZLSWCV55.js';
+import { Separator } from '../../chunk-CUZJIDU7.js';
+import { Input } from '../../chunk-AP3XXYAY.js';
+import { Label } from '../../chunk-LIBXYD5Q.js';
+import { Card, CardHeader, CardTitle, CardDescription, CardContent, CardFooter } from '../../chunk-AH6YSYYT.js';
+import { Button } from '../../chunk-7KIDDF3I.js';
+import { m, fadeInUp, scaleIn } from '../../chunk-PD2YEH3H.js';
+import '../../chunk-CRY67BIF.js';
+import '../../chunk-HJC6U46F.js';
+import { SparklesIcon } from '../../chunk-CGUCH322.js';
+import { MailIcon } from '../../chunk-XQ2UDMPO.js';
+import { CheckIcon } from '../../chunk-CXACRCZ4.js';
+import { Badge } from '../../chunk-S4JAHKOP.js';
+import '../../chunk-ASKFAYYR.js';
+import { cn } from '../../chunk-QYZT24TS.js';
+import * as React from 'react';
+import { useTranslations } from 'next-intl';
+import { useReducedMotion } from 'motion/react';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+
+var MODE_ICONS = {
+  reset: /* @__PURE__ */ jsx(MailIcon, { size: 32, className: "text-text-secondary" }),
+  "magic-link": /* @__PURE__ */ jsx(SparklesIcon, { size: 32, className: "text-accent" })
+};
+var INSTRUCTION_STEPS = ["step1", "step2", "step3"];
+function PasswordRecoveryBlock({
+  className,
+  mode = "reset",
+  onSubmit,
+  onBackToLogin,
+  title,
+  description,
+  buttonText,
+  successTitle
+}) {
+  const prefersReduced = useReducedMotion();
+  const tShared = useTranslations("auth.passwordRecovery.shared");
+  const tMode = useTranslations(mode === "magic-link" ? "auth.passwordRecovery.magicLink" : "auth.passwordRecovery.reset");
+  const [email, setEmail] = React.useState("");
+  const [state, setState] = React.useState("entry");
+  const [resendState, setResendState] = React.useState("idle");
+  const setSafeTimeout = useSafeTimeout();
+  const resolvedTitle = title ?? tMode("title");
+  const resolvedDescription = description ?? tMode("description");
+  const resolvedButtonText = buttonText ?? tMode("button");
+  const resolvedSuccessTitle = successTitle ?? tShared("checkEmail");
+  const handleSubmit = (e) => {
+    e.preventDefault();
+    if (!email) return;
+    setState("loading");
+    onSubmit?.(email);
+    setSafeTimeout(() => setState("success"), 1500);
+  };
+  const handleResend = () => {
+    setResendState("sending");
+    onSubmit?.(email);
+    setSafeTimeout(() => {
+      setResendState("sent");
+      setSafeTimeout(() => setResendState("idle"), 3e3);
+    }, 1e3);
+  };
+  if (state === "success") {
+    return /* @__PURE__ */ jsx(m.div, { ...prefersReduced ? {} : fadeInUp, className: cn("w-full max-w-sm mx-auto", className), children: /* @__PURE__ */ jsxs(Card, { children: [
+      /* @__PURE__ */ jsxs(CardHeader, { className: "text-center", children: [
+        /* @__PURE__ */ jsx("div", { className: "mx-auto mb-2", children: /* @__PURE__ */ jsx(MailIcon, { size: 48, className: "text-accent" }) }),
+        /* @__PURE__ */ jsx(CardTitle, { className: "text-2xl", children: resolvedSuccessTitle }),
+        /* @__PURE__ */ jsx(CardDescription, { children: tMode("successDescription") })
+      ] }),
+      /* @__PURE__ */ jsxs(CardContent, { className: "grid gap-4", children: [
+        /* @__PURE__ */ jsx("div", { className: "flex justify-center", children: /* @__PURE__ */ jsx(Badge, { variant: "outline", className: "font-mono text-xs", children: email }) }),
+        /* @__PURE__ */ jsx("ol", { className: "space-y-2 text-sm text-text-secondary list-none", children: INSTRUCTION_STEPS.map((key) => /* @__PURE__ */ jsxs("li", { className: "flex items-start gap-2", children: [
+          /* @__PURE__ */ jsx(CheckIcon, { size: 16, className: "text-success mt-0.5 shrink-0" }),
+          /* @__PURE__ */ jsx("span", { children: tMode(`instructions.${key}`) })
+        ] }, key)) }),
+        /* @__PURE__ */ jsx(Separator, {}),
+        /* @__PURE__ */ jsxs("div", { className: "text-center space-y-2", children: [
+          /* @__PURE__ */ jsx("p", { className: "text-sm text-text-tertiary", children: tShared("didNotReceiveEmail") }),
+          /* @__PURE__ */ jsxs(
+            Button,
+            {
+              variant: "outline",
+              size: "sm",
+              onClick: handleResend,
+              disabled: resendState === "sending",
+              children: [
+                resendState === "sending" && /* @__PURE__ */ jsx(Spinner, { className: "mr-2" }),
+                resendState === "sent" ? tShared("emailResent") : tShared("resendEmail")
+              ]
+            }
+          )
+        ] })
+      ] }),
+      /* @__PURE__ */ jsx(CardFooter, { className: "justify-center", children: /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          onClick: onBackToLogin,
+          className: "text-sm text-text-tertiary hover:text-text-primary transition-colors",
+          children: tShared("backToLogin")
+        }
+      ) })
+    ] }) });
+  }
+  return /* @__PURE__ */ jsx(m.div, { ...prefersReduced ? {} : scaleIn, className: cn("w-full max-w-sm mx-auto", className), children: /* @__PURE__ */ jsxs(Card, { children: [
+    /* @__PURE__ */ jsxs(CardHeader, { className: "text-center", children: [
+      /* @__PURE__ */ jsx("div", { className: "mx-auto mb-2", children: MODE_ICONS[mode] }),
+      /* @__PURE__ */ jsx(CardTitle, { className: "text-2xl", children: resolvedTitle }),
+      /* @__PURE__ */ jsx(CardDescription, { children: resolvedDescription })
+    ] }),
+    /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsxs("form", { noValidate: true, onSubmit: handleSubmit, className: "grid gap-4", children: [
+      /* @__PURE__ */ jsxs("div", { className: "grid gap-2", children: [
+        /* @__PURE__ */ jsx(Label, { htmlFor: "recovery-email", children: tShared("email") }),
+        /* @__PURE__ */ jsx(
+          Input,
+          {
+            name: "email",
+            id: "recovery-email",
+            type: "email",
+            placeholder: tShared("emailPlaceholder"),
+            value: email,
+            onChange: (e) => setEmail(e.target.value),
+            autoComplete: "email",
+            required: true
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsx(Button, { variant: "accent", className: "w-full", disabled: state === "loading", children: state === "loading" ? /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(Spinner, { className: "mr-2" }),
+        tShared("sending")
+      ] }) : resolvedButtonText })
+    ] }) }),
+    /* @__PURE__ */ jsx(CardFooter, { className: "justify-center", children: /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        onClick: onBackToLogin,
+        className: "text-sm text-text-tertiary hover:text-text-primary transition-colors",
+        children: mode === "magic-link" ? tMode("backToPassword") : tShared("backToLogin")
+      }
+    ) })
+  ] }) });
+}
+
+export { PasswordRecoveryBlock };

package/dist/components/blocks/PricingBlock.d.ts

@@ -0,0 +1,19 @@
+interface PricingPlan {
+    name: string;
+    description: string;
+    price: string | ((isYearly: boolean) => string);
+    period: string;
+    features: string[];
+    action: string;
+    variant: string;
+    popular?: boolean;
+}
+interface PricingTableProps {
+    title?: string;
+    description?: string;
+    plans?: PricingPlan[];
+    showBillingToggle?: boolean;
+    className?: string;
+}
+export declare function PricingTable({ title, description, plans, showBillingToggle, className, }: PricingTableProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/blocks/PricingBlock.js

@@ -0,0 +1,125 @@
+'use client';
+import { Shine } from '../../chunk-DARC2ACH.js';
+import '../../chunk-G5EO22OR.js';
+import '../../chunk-ANBJ2OLC.js';
+import '../../chunk-LV4LBWCS.js';
+import '../../chunk-XZ3A33GP.js';
+import { CountingNumber } from '../../chunk-F3T2U7YL.js';
+import '../../chunk-6DYFX5IR.js';
+import '../../chunk-EB5PYS7Q.js';
+import '../../chunk-OHX2LFAH.js';
+import '../../chunk-SGI25ZJ6.js';
+import { Switch } from '../../chunk-R7N7YLFT.js';
+import { StaggerChildren } from '../../chunk-DQPK2XRL.js';
+import '../../chunk-ULLTRLBD.js';
+import '../../chunk-4O6L5YWT.js';
+import { Heading } from '../../chunk-WI547C47.js';
+import { Card, CardHeader, CardTitle, CardContent, CardFooter } from '../../chunk-AH6YSYYT.js';
+import { Button } from '../../chunk-7KIDDF3I.js';
+import '../../chunk-PD2YEH3H.js';
+import '../../chunk-CRY67BIF.js';
+import '../../chunk-HJC6U46F.js';
+import { CheckIcon } from '../../chunk-CXACRCZ4.js';
+import { Badge } from '../../chunk-S4JAHKOP.js';
+import '../../chunk-ASKFAYYR.js';
+import { cn } from '../../chunk-QYZT24TS.js';
+import { useTranslations } from 'next-intl';
+import { useState } from 'react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+var defaultPlans = [
+  {
+    name: "Starter",
+    description: "Perfect for hobbyists and side projects.",
+    price: "$0",
+    period: "/forever",
+    features: ["1,000 requests/mo", "Community support", "1 project", "Basic analytics"],
+    action: "Get Started",
+    variant: "outline"
+  },
+  {
+    name: "Pro",
+    description: "For professional developers and small teams.",
+    price: (isYearly) => isYearly ? "$29" : "$39",
+    period: "/month",
+    features: ["100,000 requests/mo", "Priority support", "Unlimited projects", "Advanced analytics", "Custom domains"],
+    action: "Upgrade to Pro",
+    variant: "accent",
+    popular: true
+  },
+  {
+    name: "Enterprise",
+    description: "Custom solutions for large organizations.",
+    price: "Custom",
+    period: "",
+    features: ["Unlimited requests", "24/7 Dedicated support", "SSO & Audit logs", "SLA guarantees", "On-premise deployment"],
+    action: "Contact Sales",
+    variant: "outline"
+  }
+];
+function resolvePrice(price, isYearly) {
+  return typeof price === "function" ? price(isYearly) : price;
+}
+function PricingTable({
+  title = "Simple, transparent pricing",
+  description = "Choose the plan that's right for you. Change or cancel anytime.",
+  plans = defaultPlans,
+  showBillingToggle = true,
+  className
+}) {
+  const t = useTranslations("blocks.pricingBlock");
+  const [isYearly, setIsYearly] = useState(false);
+  return /* @__PURE__ */ jsx("section", { className: className ?? "py-16 md:py-24", children: /* @__PURE__ */ jsxs("div", { className: "container mx-auto px-6 lg:px-8", children: [
+    /* @__PURE__ */ jsxs("div", { className: "mb-12 text-center", children: [
+      /* @__PURE__ */ jsx(Heading, { level: 2, size: "section", className: "mb-4 sm:text-4xl", children: title }),
+      /* @__PURE__ */ jsx("p", { className: "mb-8 text-lg text-text-secondary", children: description }),
+      !!showBillingToggle && /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-center gap-4", children: [
+        /* @__PURE__ */ jsx("span", { className: cn("text-sm font-medium", !isYearly ? "text-text-primary" : "text-text-tertiary"), children: t("monthly") }),
+        /* @__PURE__ */ jsx(Switch, { checked: isYearly, onCheckedChange: setIsYearly, "aria-label": t("toggleYearlyBilling") }),
+        /* @__PURE__ */ jsxs("span", { className: cn("text-sm font-medium", isYearly ? "text-text-primary" : "text-text-tertiary"), children: [
+          t("yearly"),
+          " ",
+          /* @__PURE__ */ jsx("span", { className: "ml-1.5 text-accent", children: t("savePercent") })
+        ] })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx(StaggerChildren, { staggerMs: 120, className: "grid gap-8 md:grid-cols-3", children: plans.map((plan) => {
+      const priceStr = resolvePrice(plan.price, isYearly);
+      const card = /* @__PURE__ */ jsxs(
+        Card,
+        {
+          interactive: true,
+          className: cn(
+            "flex flex-col relative overflow-hidden transition-all duration-300",
+            plan.popular ? "border-accent shadow-lg shadow-accent/5 z-10" : "border-border/50 hover:border-border"
+          ),
+          children: [
+            plan.popular && /* @__PURE__ */ jsx("div", { className: "absolute -top-4 left-0 ring-0 w-full flex justify-center", children: /* @__PURE__ */ jsx(Badge, { variant: "accent", className: "shadow-lg", children: t("mostPopular") }) }),
+            /* @__PURE__ */ jsxs(CardHeader, { className: "pb-8 pt-8", children: [
+              /* @__PURE__ */ jsx(CardTitle, { className: "text-xl font-semibold text-text-primary", children: plan.name }),
+              /* @__PURE__ */ jsx("p", { className: "text-sm text-text-secondary", children: plan.description })
+            ] }),
+            /* @__PURE__ */ jsxs(CardContent, { className: "flex-1", children: [
+              /* @__PURE__ */ jsxs("div", { className: "mb-8 flex items-baseline", children: [
+                priceStr === "Custom" ? /* @__PURE__ */ jsx("span", { className: "text-4xl font-extrabold text-text-primary", children: priceStr }) : /* @__PURE__ */ jsxs("span", { className: "text-4xl font-extrabold text-text-primary tabular-nums", children: [
+                  "$",
+                  /* @__PURE__ */ jsx(CountingNumber, { number: parseInt(priceStr.slice(1), 10), inViewOnce: true })
+                ] }),
+                /* @__PURE__ */ jsx("span", { className: "ml-1.5 text-text-tertiary", children: plan.period })
+              ] }),
+              /* @__PURE__ */ jsx("ul", { className: "space-y-4", children: plan.features.map((feature) => /* @__PURE__ */ jsxs("li", { className: "flex items-center gap-4 text-sm text-text-secondary", children: [
+                /* @__PURE__ */ jsx("div", { className: cn("flex h-5 w-5 items-center justify-center rounded-full bg-primary/10 text-primary"), children: /* @__PURE__ */ jsx(CheckIcon, { size: 12 }) }),
+                feature
+              ] }, feature)) })
+            ] }),
+            /* @__PURE__ */ jsx(CardFooter, { children: /* @__PURE__ */ jsx(Button, { className: "w-full", variant: plan.variant, children: plan.action }) })
+          ]
+        },
+        plan.name
+      );
+      return plan.popular ? /* @__PURE__ */ jsx(Shine, { enable: true, loop: true, loopDelay: 3e3, color: "var(--color-accent)", opacity: 0.12, duration: 1500, children: card }, plan.name) : /* @__PURE__ */ jsx("div", { children: card }, plan.name);
+    }) })
+  ] }) });
+}
+
+export { PricingTable };

package/dist/components/blocks/ProcessFlowBlock.d.ts

@@ -0,0 +1,15 @@
+import type { ReactNode } from 'react';
+interface ProcessStep {
+    title: string;
+    description: string;
+    icon?: ReactNode;
+}
+interface ProcessFlowBlockProps {
+    title?: string;
+    description?: string;
+    badge?: string;
+    steps?: ProcessStep[];
+    className?: string;
+}
+export declare function ProcessFlowBlock({ title, description, badge, steps, className, }: ProcessFlowBlockProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/blocks/ProcessFlowBlock.js

@@ -0,0 +1,82 @@
+'use client';
+import { StaggerChildren } from '../../chunk-DQPK2XRL.js';
+import { Heading } from '../../chunk-WI547C47.js';
+import { ScrollFadeIn } from '../../chunk-I23DDSU7.js';
+import { Card } from '../../chunk-AH6YSYYT.js';
+import '../../chunk-PD2YEH3H.js';
+import '../../chunk-CRY67BIF.js';
+import '../../chunk-HJC6U46F.js';
+import { SparklesIcon } from '../../chunk-CGUCH322.js';
+import { SettingsIcon } from '../../chunk-OITJWGFV.js';
+import { SearchIcon } from '../../chunk-T6BRD7TS.js';
+import { Badge } from '../../chunk-S4JAHKOP.js';
+import '../../chunk-ASKFAYYR.js';
+import { cn } from '../../chunk-QYZT24TS.js';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+var defaultSteps = [
+  {
+    title: "Discovery",
+    description: "We analyze your workflows and identify automation opportunities.",
+    icon: /* @__PURE__ */ jsx(SearchIcon, { size: 24, "aria-hidden": true })
+  },
+  {
+    title: "Implementation",
+    description: "Our team builds and integrates AI solutions tailored to your needs.",
+    icon: /* @__PURE__ */ jsx(SettingsIcon, { size: 24, "aria-hidden": true })
+  },
+  {
+    title: "Optimization",
+    description: "Continuous monitoring and refinement to maximize ROI.",
+    icon: /* @__PURE__ */ jsx(SparklesIcon, { size: 24, "aria-hidden": true })
+  }
+];
+function ProcessFlowBlock({
+  title = "How it works",
+  description,
+  badge,
+  steps = defaultSteps,
+  className
+}) {
+  const colsClass = steps.length === 4 ? "md:grid-cols-4" : "md:grid-cols-3";
+  return /* @__PURE__ */ jsx("section", { className: cn("py-16 md:py-32", className), children: /* @__PURE__ */ jsxs("div", { className: "mx-auto max-w-5xl px-6", children: [
+    /* @__PURE__ */ jsx(ScrollFadeIn, { children: /* @__PURE__ */ jsxs("div", { className: "text-center", children: [
+      !!badge && /* @__PURE__ */ jsx(Badge, { variant: "outline", className: "mb-4", children: badge }),
+      /* @__PURE__ */ jsx(Heading, { level: 2, size: "section", className: "text-4xl lg:text-5xl", children: title }),
+      !!description && /* @__PURE__ */ jsx("p", { className: "mt-4 text-text-secondary", children: description })
+    ] }) }),
+    /* @__PURE__ */ jsxs("div", { className: "relative mt-8 md:mt-16", children: [
+      /* @__PURE__ */ jsx(
+        "div",
+        {
+          "aria-hidden": true,
+          className: "absolute left-6 top-0 hidden h-full w-px border-l border-dashed border-border md:left-0 md:right-0 md:top-10 md:mx-auto md:block md:h-px md:w-full md:border-l-0 md:border-t"
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "div",
+        {
+          "aria-hidden": true,
+          className: "absolute left-6 top-0 block h-full w-px border-l border-dashed border-border md:hidden"
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        StaggerChildren,
+        {
+          staggerMs: 120,
+          className: cn("relative grid gap-8", colsClass),
+          children: steps.map((step, i) => /* @__PURE__ */ jsxs("div", { className: "relative flex flex-col items-center text-center", children: [
+            /* @__PURE__ */ jsx("div", { className: "mb-4 flex size-10 items-center justify-center rounded-full bg-accent text-accent-foreground text-sm font-bold", children: String(i + 1).padStart(2, "0") }),
+            /* @__PURE__ */ jsxs(Card, { className: "w-full", children: [
+              step.icon && /* @__PURE__ */ jsx("div", { className: "mb-2 flex justify-center text-accent", children: step.icon }),
+              /* @__PURE__ */ jsx(Heading, { level: 3, size: "title", className: "font-medium", children: step.title }),
+              /* @__PURE__ */ jsx("p", { className: "mt-2 text-sm text-text-secondary", children: step.description })
+            ] })
+          ] }, step.title))
+        }
+      )
+    ] })
+  ] }) });
+}
+
+export { ProcessFlowBlock };

package/dist/components/blocks/ResetPasswordBlock.d.ts

@@ -0,0 +1,9 @@
+interface ResetPasswordBlockProps {
+    className?: string;
+    onSubmit?: (password: string) => void;
+    onBackToLogin?: () => void;
+    title?: string;
+    description?: string;
+}
+export declare function ResetPasswordBlock({ className, onSubmit, onBackToLogin, title, description, }: ResetPasswordBlockProps): import("react/jsx-runtime").JSX.Element;
+export {};