@vadimcomanescu/nadicode-design-system 4.0.11 → 5.0.0

package/dist/chunk-UT6MKK2S.js

@@ -0,0 +1,115 @@
+import { ShieldIcon } from './chunk-P6IRHPFM.js';
+import { AlertTriangleIcon } from './chunk-SXHYB7JB.js';
+import { ShieldCheckIcon } from './chunk-BFLN54VR.js';
+import { cn } from './chunk-QYZT24TS.js';
+import * as React from 'react';
+import { cva } from 'class-variance-authority';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var approvalCardVariants = cva(
+  "rounded-lg border p-4 glass-floating transition-colors",
+  {
+    variants: {
+      riskLevel: {
+        low: "border-success/40",
+        medium: "border-warning/40",
+        high: "border-destructive/40"
+      }
+    },
+    defaultVariants: {
+      riskLevel: "low"
+    }
+  }
+);
+var RiskIcon = ({
+  riskLevel
+}) => {
+  switch (riskLevel) {
+    case "high":
+      return /* @__PURE__ */ jsx(AlertTriangleIcon, { size: 18, className: "text-destructive" });
+    case "medium":
+      return /* @__PURE__ */ jsx(ShieldIcon, { size: 18, className: "text-warning" });
+    default:
+      return /* @__PURE__ */ jsx(ShieldCheckIcon, { size: 18, className: "text-success" });
+  }
+};
+function ApprovalCard({
+  className,
+  riskLevel,
+  title,
+  description,
+  onApprove,
+  onReject,
+  timeout,
+  ref,
+  ...props
+}) {
+  const [remaining, setRemaining] = React.useState(timeout);
+  React.useEffect(() => {
+    if (timeout == null) return;
+    setRemaining(timeout);
+    const interval = setInterval(() => {
+      setRemaining((prev) => {
+        if (prev == null || prev <= 1) {
+          clearInterval(interval);
+          return 0;
+        }
+        return prev - 1;
+      });
+    }, 1e3);
+    return () => clearInterval(interval);
+  }, [timeout]);
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ref,
+      className: cn(approvalCardVariants({ riskLevel }), className),
+      role: "alert",
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-4", children: [
+          /* @__PURE__ */ jsx(RiskIcon, { riskLevel }),
+          /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0", children: [
+            /* @__PURE__ */ jsx("h4", { className: "text-sm font-semibold text-text-primary", children: title }),
+            !!description && /* @__PURE__ */ jsx("p", { className: "mt-1.5 text-xs text-text-secondary", children: description })
+          ] })
+        ] }),
+        timeout != null && remaining != null && /* @__PURE__ */ jsxs("div", { className: "mt-4", children: [
+          /* @__PURE__ */ jsx("div", { className: "h-1 rounded-full bg-surface overflow-hidden", children: /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: "h-full bg-accent transition-all duration-1000 ease-linear rounded-full",
+              style: { width: `${remaining / timeout * 100}%` }
+            }
+          ) }),
+          /* @__PURE__ */ jsxs("span", { className: "text-[10px] text-text-tertiary mt-0.5 block", children: [
+            remaining,
+            "s remaining"
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 mt-4", children: [
+          !!onApprove && /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              onClick: onApprove,
+              className: "rounded-md bg-success/10 border border-success/30 px-4 py-1.5 text-xs font-medium text-success hover:bg-success/20 transition-colors",
+              children: "Approve"
+            }
+          ),
+          !!onReject && /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              onClick: onReject,
+              className: "rounded-md bg-destructive/10 border border-destructive/30 px-4 py-1.5 text-xs font-medium text-destructive hover:bg-destructive/20 transition-colors",
+              children: "Reject"
+            }
+          )
+        ] })
+      ]
+    }
+  );
+}
+
+export { ApprovalCard, approvalCardVariants };

package/dist/chunk-UXYLA2IV.js

@@ -0,0 +1,124 @@
+import { z } from 'zod';
+
+// src/catalog/definitions/text-effects.ts
+var textEffectsDefinitions = {
+  AnimatedGradientText: {
+    props: z.object({
+      className: z.string().nullable()
+    }),
+    slots: ["default"],
+    description: "Inline span that applies an animated gradient sweep (accent to info to accent) via background-clip text. Animation pauses when out of viewport and respects prefers-reduced-motion.",
+    example: { className: null }
+  },
+  CountingNumber: {
+    props: z.object({
+      number: z.number(),
+      fromNumber: z.number().nullable(),
+      padStart: z.boolean().nullable(),
+      decimalSeparator: z.string().nullable(),
+      decimalPlaces: z.number().nullable(),
+      delay: z.number().nullable(),
+      initiallyStable: z.boolean().nullable(),
+      inView: z.boolean().nullable(),
+      inViewMargin: z.string().nullable(),
+      inViewOnce: z.boolean().nullable(),
+      className: z.string().nullable()
+    }),
+    description: "Spring-animated counting number that interpolates from fromNumber to number. Formats with configurable decimal places and separator. Triggers on viewport entry when inView is true.",
+    example: { number: 1284, fromNumber: 0, padStart: null, decimalSeparator: null, decimalPlaces: null, delay: null, initiallyStable: null, inView: true, inViewMargin: null, inViewOnce: true, className: null }
+  },
+  FlipWords: {
+    props: z.object({
+      words: z.array(z.string()),
+      interval: z.number().nullable(),
+      className: z.string().nullable()
+    }),
+    description: "Cycles through a list of words with a 3D flip entrance/exit animation at a configurable interval (ms). Respects prefers-reduced-motion.",
+    example: { words: ["innovative", "scalable", "reliable", "fast"], interval: 3e3, className: null }
+  },
+  HighlightText: {
+    props: z.object({
+      color: z.string().nullable(),
+      duration: z.number().nullable(),
+      delay: z.number().nullable(),
+      inView: z.boolean().nullable(),
+      inViewOnce: z.boolean().nullable(),
+      inViewMargin: z.string().nullable(),
+      className: z.string().nullable()
+    }),
+    slots: ["default"],
+    description: "Inline span that animates a coloured highlight underlay expanding from left on scroll entry. color defaults to var(--color-accent). duration and delay are in seconds.",
+    example: { color: null, duration: 0.6, delay: 0.2, inView: true, inViewOnce: true, inViewMargin: null, className: null }
+  },
+  MorphingText: {
+    props: z.object({
+      text: z.union([z.string(), z.array(z.string())]),
+      delay: z.number().nullable(),
+      loop: z.boolean().nullable(),
+      holdDelay: z.number().nullable(),
+      inView: z.boolean().nullable(),
+      inViewOnce: z.boolean().nullable(),
+      inViewMargin: z.string().nullable(),
+      className: z.string().nullable()
+    }),
+    description: "Per-character shared-layout morphing text. When text is an array, cycles through strings with holdDelay pause between each. Blurs and scales individual characters in and out.",
+    example: { text: ["Build faster", "Ship smarter", "Scale globally"], delay: 80, loop: true, holdDelay: 2e3, inView: true, inViewOnce: null, inViewMargin: null, className: null }
+  },
+  ShimmeringText: {
+    props: z.object({
+      text: z.string(),
+      duration: z.number().nullable(),
+      color: z.string().nullable(),
+      shimmeringColor: z.string().nullable(),
+      className: z.string().nullable()
+    }),
+    description: "Per-character shimmer sweep animation. Each character briefly brightens to shimmeringColor before fading back to color. Animation pauses when out of viewport.",
+    example: { text: "Enterprise-grade infrastructure", duration: 2, color: null, shimmeringColor: null, className: null }
+  },
+  SlidingNumber: {
+    props: z.object({
+      number: z.number(),
+      fromNumber: z.number().nullable(),
+      padStart: z.boolean().nullable(),
+      decimalSeparator: z.string().nullable(),
+      decimalPlaces: z.number().nullable(),
+      thousandSeparator: z.string().nullable(),
+      delay: z.number().nullable(),
+      initiallyStable: z.boolean().nullable(),
+      inView: z.boolean().nullable(),
+      inViewOnce: z.boolean().nullable(),
+      inViewMargin: z.string().nullable(),
+      className: z.string().nullable()
+    }),
+    description: "Slot-machine style number animation. Each digit column slides to its target value independently via a spring. Supports thousands separators and decimal places.",
+    example: { number: 9847, fromNumber: 0, padStart: null, decimalSeparator: ".", decimalPlaces: null, thousandSeparator: ",", delay: null, initiallyStable: null, inView: true, inViewOnce: true, inViewMargin: null, className: null }
+  },
+  StreamingText: {
+    props: z.object({
+      text: z.string(),
+      speed: z.number().nullable(),
+      interval: z.number().nullable(),
+      showCursor: z.boolean().nullable(),
+      cursorStyle: z.enum(["block", "line", "underscore"]).nullable(),
+      streaming: z.boolean().nullable(),
+      variant: z.enum(["default", "muted", "accent"]).nullable(),
+      size: z.enum(["sm", "default", "lg"]).nullable(),
+      className: z.string().nullable()
+    }),
+    events: ["complete"],
+    description: "Character-by-character text streaming effect with optional blinking cursor. speed controls characters per tick; interval controls ms between ticks. Set streaming false to pause.",
+    example: { text: "Analyzing your codebase for potential optimizations...", speed: 2, interval: 30, showCursor: true, cursorStyle: "line", streaming: true, variant: "default", size: "default", className: null }
+  },
+  TextReveal: {
+    props: z.object({
+      text: z.string(),
+      by: z.enum(["word", "char"]).nullable(),
+      delay: z.number().nullable(),
+      className: z.string().nullable()
+    }),
+    description: "Staggered blur-reveal animation for text. by word splits on spaces; by char splits on every character. delay is the base offset in ms before the first unit animates.",
+    example: { text: "Deploy with confidence", by: "word", delay: 100, className: null }
+  }
+};
+
+export { textEffectsDefinitions };

package/dist/{chunk-PDSQC6VE.js → chunk-V5RSV4ZV.js}

@@ -1,5 +1,5 @@
 import { Table, TableHeader, TableRow, TableHead, TableBody, TableCell } from './chunk-PXDHNGTG.js';
-import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuCheckboxItem } from './chunk-CQEUNASC.js';
+import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuCheckboxItem } from './chunk-ETS5O4ZQ.js';
 import { Input } from './chunk-AP3XXYAY.js';
 import { Button } from './chunk-7KIDDF3I.js';
 import { Settings2Icon } from './chunk-TXGANOAX.js';
@@ -12,7 +12,8 @@ import { jsxs, jsx } from 'react/jsx-runtime';
 function DataTable({
   columns,
   data,
-  searchKey
+  searchKey,
+  onRowClick
 }) {
   const [sorting, setSorting] = React.useState([]);
   const [columnFilters, setColumnFilters] = React.useState(
@@ -84,6 +85,8 @@ function DataTable({
         TableRow,
         {
           "data-state": row.getIsSelected() ? "selected" : void 0,
+          onClick: onRowClick ? () => onRowClick(row.original) : void 0,
+          className: onRowClick ? "cursor-pointer" : void 0,
           children: row.getVisibleCells().map((cell) => /* @__PURE__ */ jsx(TableCell, { className: "tabular-nums", children: flexRender(
             cell.column.columnDef.cell,
             cell.getContext()

package/dist/chunk-VUNXVYOH.js

@@ -0,0 +1,129 @@
+import { z } from 'zod';
+
+// src/catalog/definitions/blocks-auth.ts
+var blocksAuthDefinitions = {
+  AccountLockedBlock: {
+    props: z.object({
+      reason: z.enum(["too_many_attempts", "suspicious_activity", "admin"]).nullable(),
+      unlockMinutes: z.number().nullable(),
+      title: z.string().nullable(),
+      description: z.string().nullable()
+    }),
+    events: ["contactSupport", "backToLogin"],
+    description: "Account locked notification with reason, countdown timer, and support/login actions.",
+    example: { reason: "too_many_attempts", unlockMinutes: 15, title: null, description: null }
+  },
+  AuthLayout: {
+    props: z.object({
+      mode: z.enum(["login", "signup"]).nullable(),
+      error: z.string().nullable(),
+      labels: z.object({
+        headline: z.string().nullable(),
+        quote: z.string().nullable(),
+        quoteAttribution: z.string().nullable()
+      }).nullable(),
+      className: z.string().nullable()
+    }),
+    slots: ["default"],
+    description: "Full-page split auth layout with animated visual side and form side. Renders a LoginBlock internally. Use as the shell for login and signup pages when you need the branded two-column layout.",
+    example: {
+      mode: "login",
+      error: null,
+      labels: {
+        headline: "Welcome back",
+        quote: "The best way to predict the future is to create it.",
+        quoteAttribution: "Peter Drucker"
+      },
+      className: null
+    }
+  },
+  AuthSuccessBlock: {
+    props: z.object({
+      title: z.string(),
+      description: z.string(),
+      iconName: z.string().nullable(),
+      buttonText: z.string().nullable(),
+      autoRedirectSeconds: z.number().nullable()
+    }),
+    slots: ["icon"],
+    events: ["continue"],
+    description: "Success confirmation card with serializable icon (ICON_MAP: CheckCircle, ShieldCheck, Sparkles, Rocket), title, description, continue button, and optional auto-redirect countdown. Use after successful auth flows (email verified, password reset). Children override iconName when present.",
+    example: { title: "Email Verified", description: "Your email address has been confirmed. You can now access all features.", iconName: "CheckCircle", buttonText: "Go to Dashboard", autoRedirectSeconds: 5 }
+  },
+  CheckEmailBlock: {
+    props: z.object({
+      email: z.string().nullable(),
+      type: z.enum(["verification", "reset", "magic-link"]).nullable()
+    }),
+    events: ["resend", "backToLogin"],
+    description: "Post-submission email check prompt with resend action and step-by-step instructions.",
+    example: { email: "alex@company.com", type: "verification" }
+  },
+  LoginBlock: {
+    props: z.object({
+      type: z.enum(["login", "signup"]).nullable(),
+      showSocial: z.boolean().nullable(),
+      error: z.string().nullable(),
+      forgotPasswordHref: z.string().nullable(),
+      signUpHref: z.string().nullable(),
+      signInHref: z.string().nullable()
+    }),
+    events: ["submit", "socialLogin"],
+    description: "Authentication login form with email/password fields and optional social login buttons.",
+    example: { type: "login", showSocial: true, error: null, forgotPasswordHref: "/reset-password", signUpHref: null, signInHref: null }
+  },
+  OTPBlock: {
+    props: z.object({
+      title: z.string().nullable(),
+      description: z.string().nullable(),
+      maxLength: z.number().nullable(),
+      buttonText: z.string().nullable(),
+      error: z.string().nullable(),
+      backupCodeLink: z.string().nullable()
+    }),
+    events: ["verify", "useBackupCode", "backToLogin"],
+    description: "OTP verification card with configurable code length, title, verify callback, optional error shake, and optional backup code link.",
+    example: { title: "Two-Factor Authentication", description: "Enter the 6-digit code from your authenticator app.", maxLength: 6, buttonText: "Verify", error: null, backupCodeLink: "/auth/backup-codes" }
+  },
+  PasswordRecoveryBlock: {
+    props: z.object({
+      mode: z.enum(["reset", "magic-link"]).nullable(),
+      title: z.string().nullable(),
+      description: z.string().nullable(),
+      buttonText: z.string().nullable(),
+      successTitle: z.string().nullable()
+    }),
+    events: ["submit", "backToLogin"],
+    description: "Password recovery form with email input. Supports reset and magic-link modes.",
+    example: { mode: "reset", title: "Forgot your password?", description: "Enter your email and we will send a reset link.", buttonText: "Send Reset Link", successTitle: "Check your inbox" }
+  },
+  ResetPasswordBlock: {
+    props: z.object({
+      title: z.string().nullable(),
+      description: z.string().nullable()
+    }),
+    events: ["submit", "backToLogin"],
+    description: "New password form with password confirmation. Shown after recovery link click.",
+    example: { title: "Set New Password", description: "Choose a strong password for your account." }
+  },
+  TwoFactorSetupBlock: {
+    props: z.object({
+      qrCodeUrl: z.string().nullable(),
+      secret: z.string().nullable(),
+      backupCodes: z.array(z.string()).nullable(),
+      title: z.string().nullable(),
+      description: z.string().nullable()
+    }),
+    events: ["verify", "complete"],
+    description: "Two-factor setup wizard with QR code, secret key display, backup codes, and verification.",
+    example: {
+      qrCodeUrl: "https://api.qrserver.com/v1/create-qr-code/?size=200x200&data=otpauth://totp/Acme:user@acme.com",
+      secret: "JBSWY3DPEHPK3PXP",
+      backupCodes: ["a1b2c3d4", "e5f6g7h8", "i9j0k1l2"],
+      title: "Enable Two-Factor Authentication",
+      description: "Scan the QR code with your authenticator app."
+    }
+  }
+};
+
+export { blocksAuthDefinitions };