@vadimcomanescu/nadicode-design-system 4.0.11 → 5.0.1

package/dist/chunk-IW36SVOH.js

@@ -0,0 +1,425 @@
+import { z } from 'zod';
+
+// src/catalog/definitions/blocks-crud.ts
+var blocksCrudDefinitions = {
+  ApiKeysBlock: {
+    props: z.object({
+      keys: z.array(
+        z.object({
+          id: z.string(),
+          name: z.string(),
+          prefix: z.string(),
+          createdAt: z.string(),
+          lastUsedAt: z.string().nullable(),
+          revokedAt: z.string().nullable()
+        })
+      ).nullable(),
+      title: z.string().nullable(),
+      description: z.string().nullable(),
+      newKeyName: z.string().nullable()
+    }),
+    events: ["create", "revoke"],
+    description: "API key management block with table display, create dialog, copy-once flow, and revoke functionality.",
+    example: {
+      keys: [
+        { id: "key_1", name: "Production API", prefix: "sk_live_7x...", createdAt: "2026-01-15T10:00:00Z", lastUsedAt: "2026-03-30T09:22:00Z", revokedAt: null },
+        { id: "key_2", name: "Staging API", prefix: "sk_test_3m...", createdAt: "2026-02-20T14:00:00Z", lastUsedAt: null, revokedAt: "2026-03-01T08:00:00Z" }
+      ],
+      title: "API Keys",
+      description: "Manage your API keys for programmatic access.",
+      newKeyName: null
+    }
+  },
+  CreateBlock: {
+    props: z.object({
+      title: z.string().nullable(),
+      description: z.string().nullable(),
+      submitLabel: z.string().nullable(),
+      username: z.string().nullable(),
+      email: z.string().nullable(),
+      bio: z.string().nullable()
+    }),
+    events: ["submit"],
+    description: "Profile creation form with username, email, and bio fields.",
+    example: { title: "Create Your Profile", description: "Tell us a bit about yourself to get started.", submitLabel: "Create Profile", username: null, email: null, bio: null }
+  },
+  CrudListBlock: {
+    props: z.object({
+      title: z.string().nullable(),
+      description: z.string().nullable(),
+      state: z.enum(["loading", "empty", "filtered", "selected-row", "error", "has-data"]).nullable(),
+      columns: z.array(z.object({ id: z.string(), header: z.string() })).nullable(),
+      rows: z.array(
+        z.object({
+          id: z.string(),
+          cells: z.record(z.string(), z.string()),
+          summaryLabel: z.string().nullable()
+        })
+      ).nullable(),
+      selectedRowId: z.string().nullable(),
+      filterControls: z.array(
+        z.object({
+          id: z.string(),
+          label: z.string(),
+          value: z.string(),
+          placeholder: z.string().nullable()
+        })
+      ).nullable(),
+      filterValue: z.string().nullable(),
+      pagination: z.object({ page: z.number(), totalPages: z.number() }),
+      errorMessage: z.string().nullable(),
+      emptyTitle: z.string().nullable(),
+      emptyDescription: z.string().nullable(),
+      className: z.string().nullable()
+    }),
+    slots: ["detailPanel", "headerActions"],
+    events: ["rowSelect", "pageChange", "filterChange"],
+    description: "Master-detail CRUD list with data table, filter controls, pagination, row selection, and detail panel slot.",
+    example: {
+      title: "Customers",
+      description: null,
+      state: "has-data",
+      columns: [
+        { id: "name", header: "Name" },
+        { id: "email", header: "Email" },
+        { id: "status", header: "Status" }
+      ],
+      rows: [
+        { id: "c1", cells: { name: "Acme Corp", email: "billing@acme.com", status: "Active" }, summaryLabel: null },
+        { id: "c2", cells: { name: "TechStart Ltd", email: "info@techstart.io", status: "Trial" }, summaryLabel: null }
+      ],
+      selectedRowId: null,
+      filterControls: null,
+      filterValue: null,
+      pagination: { page: 1, totalPages: 4 },
+      errorMessage: null,
+      emptyTitle: null,
+      emptyDescription: null,
+      className: null
+    }
+  },
+  DirectoryBlock: {
+    props: z.object({
+      navItems: z.array(
+        z.object({
+          name: z.string(),
+          icon: z.string(),
+          isActive: z.boolean().nullable()
+        })
+      ).nullable(),
+      projects: z.array(z.object({ name: z.string(), url: z.string() })).nullable()
+    }),
+    description: "Navigation directory with sidebar items and project listings.",
+    example: {
+      navItems: [
+        { name: "Dashboard", icon: "LayoutDashboard", isActive: true },
+        { name: "Projects", icon: "Folder", isActive: null }
+      ],
+      projects: [
+        { name: "Marketing Site", url: "/projects/marketing" },
+        { name: "Mobile App", url: "/projects/mobile" }
+      ]
+    }
+  },
+  FormFieldBlock: {
+    props: z.object({
+      title: z.string().nullable(),
+      description: z.string().nullable(),
+      state: z.enum([
+        "pristine",
+        "dirty",
+        "validating",
+        "validation-error",
+        "submitting",
+        "saved",
+        "fatal-error"
+      ]).nullable(),
+      sections: z.array(
+        z.object({
+          id: z.string(),
+          title: z.string(),
+          description: z.string().nullable(),
+          optional: z.boolean().nullable(),
+          fields: z.array(
+            z.object({
+              id: z.string(),
+              label: z.string(),
+              value: z.string(),
+              type: z.enum(["text", "email", "number", "textarea", "select"]).nullable(),
+              placeholder: z.string().nullable(),
+              required: z.boolean().nullable(),
+              readOnly: z.boolean().nullable(),
+              disabled: z.boolean().nullable(),
+              errorMessage: z.string().nullable(),
+              description: z.string().nullable(),
+              options: z.array(z.object({ value: z.string(), label: z.string() })).nullable()
+            })
+          ).nullable()
+        })
+      ).nullable(),
+      validationMessage: z.string().nullable(),
+      fatalErrorMessage: z.string().nullable(),
+      savedMessage: z.string().nullable(),
+      actionLabels: z.object({
+        primary: z.string().nullable(),
+        secondary: z.string().nullable(),
+        tertiary: z.string().nullable(),
+        destructive: z.string().nullable()
+      }).nullable(),
+      className: z.string().nullable()
+    }),
+    events: [
+      "fieldChange",
+      "primaryAction",
+      "secondaryAction",
+      "tertiaryAction",
+      "destructiveAction"
+    ],
+    description: "Generic form engine with sectioned field layout, field type switch (text/email/number/textarea/select), save-state badges, validation display, and configurable action buttons.",
+    example: {
+      title: "Company Settings",
+      description: null,
+      state: "pristine",
+      sections: [
+        {
+          id: "general",
+          title: "General",
+          description: null,
+          optional: null,
+          fields: [
+            { id: "companyName", label: "Company Name", value: "Northwind Traders", type: "text", placeholder: null, required: true, readOnly: false, disabled: false, errorMessage: null, description: null, options: null },
+            { id: "industry", label: "Industry", value: "technology", type: "select", placeholder: null, required: false, readOnly: null, disabled: null, errorMessage: null, description: null, options: [{ value: "technology", label: "Technology" }, { value: "finance", label: "Finance" }] }
+          ]
+        }
+      ],
+      validationMessage: null,
+      fatalErrorMessage: null,
+      savedMessage: null,
+      actionLabels: { primary: "Save", secondary: "Reset", tertiary: null, destructive: null },
+      className: null
+    }
+  },
+  IntegrationsBlock: {
+    props: z.object({
+      title: z.string().nullable(),
+      description: z.string().nullable(),
+      integrations: z.array(
+        z.object({
+          title: z.string(),
+          description: z.string(),
+          icon: z.string(),
+          link: z.string().nullable()
+        })
+      ).nullable()
+    }),
+    description: "Grid of integration cards with title, description, and optional link.",
+    example: {
+      title: "Integrations",
+      description: "Connect your favorite tools.",
+      integrations: [
+        { title: "Slack", description: "Get real-time notifications in your channels.", icon: "MessageSquare", link: "/integrations/slack" },
+        { title: "GitHub", description: "Sync issues and pull requests automatically.", icon: "Github", link: null }
+      ]
+    }
+  },
+  InviteUserModal: {
+    props: z.object({
+      email: z.string().nullable(),
+      role: z.enum(["admin", "member", "guest"]).nullable()
+    }),
+    events: ["submit"],
+    description: "Self-contained invite teammate modal triggered by a button. Renders a dialog with email and role (admin/member/guest) fields, Zod validation, and async submission. Use inside team management UIs.",
+    example: { email: null, role: null }
+  },
+  KanbanBoard: {
+    props: z.object({
+      activationDistance: z.number().nullable(),
+      className: z.string().nullable()
+    }),
+    slots: ["default"],
+    events: ["valueChange"],
+    description: "Headless drag-and-drop Kanban board primitive. Compose with KanbanColumn, KanbanColumnHeader, KanbanItem, and KanbanHandle sub-components. Controlled via value + onValueChange. Compose with json-render specs for full-page board views.",
+    example: { activationDistance: 8, className: null }
+  },
+  NavUser: {
+    props: z.object({
+      user: z.object({
+        name: z.string(),
+        email: z.string(),
+        avatar: z.string().nullable()
+      }),
+      items: z.array(
+        z.object({
+          label: z.string(),
+          href: z.string().nullable()
+        })
+      ).nullable()
+    }),
+    slots: ["footer"],
+    events: ["select"],
+    description: "Sidebar user menu button with avatar, name, email, and dropdown actions. Renders inside a SidebarMenu. Used in the sidebar footer of navigation shell layouts.",
+    example: {
+      user: { name: "Jordan Rivera", email: "jordan@acme.com", avatar: null },
+      items: [
+        { label: "Profile", href: "/settings/profile" },
+        { label: "Billing", href: "/settings/billing" },
+        { label: "Sign out", href: null }
+      ]
+    }
+  },
+  SettingsModal: {
+    props: z.object({
+      open: z.boolean().nullable(),
+      defaultTab: z.string().nullable(),
+      tabs: z.array(
+        z.object({
+          id: z.string(),
+          label: z.string().nullable()
+        })
+      ).nullable(),
+      className: z.string().nullable()
+    }),
+    slots: ["default"],
+    events: ["close", "tabChange"],
+    description: "Modal settings dialog with tab navigation sidebar. tabs defines the sidebar items. defaultTab selects the initial active tab. Children render as tab content. Fires close on dismiss and tabChange on tab switch.",
+    example: {
+      open: true,
+      defaultTab: "appearance",
+      tabs: [
+        { id: "appearance", label: "Appearance" },
+        { id: "notifications", label: "Notifications" },
+        { id: "shortcuts", label: "Keyboard Shortcuts" }
+      ],
+      className: null
+    }
+  },
+  SettingsNavBlock: {
+    props: z.object({
+      title: z.string().nullable(),
+      subtitle: z.string().nullable(),
+      sections: z.array(
+        z.object({
+          id: z.string(),
+          label: z.string(),
+          description: z.string().nullable(),
+          isAvailable: z.boolean().nullable(),
+          unavailableReason: z.string().nullable(),
+          badge: z.string().nullable()
+        })
+      ),
+      activeSectionId: z.string(),
+      saveState: z.enum([
+        "default",
+        "dirty",
+        "saving",
+        "saved",
+        "validation-error",
+        "fatal-error",
+        "loading"
+      ]).nullable(),
+      validationMessage: z.string().nullable(),
+      fatalErrorMessage: z.string().nullable(),
+      savedMessage: z.string().nullable(),
+      saveLabel: z.string().nullable(),
+      discardLabel: z.string().nullable(),
+      className: z.string().nullable()
+    }),
+    slots: ["sectionContent"],
+    events: ["sectionChange", "save", "discard"],
+    description: "Settings page with animated sidebar navigation (glass-panel, AnimatePresence transitions), save-state management, section availability gating, and save/discard footer.",
+    example: {
+      title: "Workspace Settings",
+      subtitle: "Manage your workspace configuration.",
+      sections: [
+        { id: "general", label: "General", description: "Name, URL, and workspace basics.", isAvailable: true, unavailableReason: null, badge: null },
+        { id: "billing", label: "Billing", description: "Subscription and payment methods.", isAvailable: true, unavailableReason: null, badge: null },
+        { id: "sso", label: "Single Sign-On", description: null, isAvailable: false, unavailableReason: "Available on Enterprise plan", badge: "Enterprise" }
+      ],
+      activeSectionId: "general",
+      saveState: "default",
+      validationMessage: null,
+      fatalErrorMessage: null,
+      savedMessage: null,
+      saveLabel: "Save",
+      discardLabel: "Discard",
+      className: null
+    }
+  },
+  TeamBlock: {
+    props: z.object({
+      title: z.string().nullable(),
+      sections: z.array(
+        z.object({
+          heading: z.string(),
+          members: z.array(
+            z.object({
+              name: z.string(),
+              role: z.string(),
+              avatar: z.string()
+            })
+          )
+        })
+      ).nullable()
+    }),
+    description: "Team showcase with sectioned member grids showing avatars, names, and roles.",
+    example: {
+      title: "Our Team",
+      sections: [
+        {
+          heading: "Leadership",
+          members: [
+            { name: "Sofia Reyes", role: "CEO", avatar: "https://avatars.githubusercontent.com/u/200" },
+            { name: "Marcus Okonkwo", role: "CTO", avatar: "https://avatars.githubusercontent.com/u/201" }
+          ]
+        }
+      ]
+    }
+  },
+  TimezonePickerBlock: {
+    props: z.object({
+      value: z.string().nullable(),
+      groups: z.array(
+        z.object({
+          region: z.string(),
+          timezones: z.array(
+            z.object({
+              value: z.string(),
+              label: z.string(),
+              region: z.string(),
+              offset: z.string(),
+              offsetMinutes: z.number()
+            })
+          )
+        })
+      ).nullable(),
+      name: z.string().nullable()
+    }),
+    events: ["change"],
+    description: "Searchable timezone picker with grouped IANA timezones, offset display, and form integration.",
+    example: {
+      value: "America/New_York",
+      groups: [
+        {
+          region: "Americas",
+          timezones: [
+            { value: "America/New_York", label: "New York", region: "Americas", offset: "UTC-5", offsetMinutes: -300 },
+            { value: "America/Chicago", label: "Chicago", region: "Americas", offset: "UTC-6", offsetMinutes: -360 }
+          ]
+        }
+      ],
+      name: "timezone"
+    }
+  },
+  WorkspaceSwitcherBlock: {
+    props: z.object({
+      name: z.string().nullable(),
+      plan: z.string().nullable(),
+      href: z.string().nullable()
+    }),
+    events: ["press"],
+    description: "Sidebar workspace switcher button with icon, workspace name, and plan label. Renders inside a SidebarMenu.",
+    example: { name: "Acme Corp", plan: "Enterprise", href: "/workspaces" }
+  }
+};
+
+export { blocksCrudDefinitions };

package/dist/{chunk-F2TNOCXQ.js → chunk-IYK2ABFE.js}

@@ -6,52 +6,63 @@ import { Replit } from './chunk-DT6DGTVW.js';
 import { VSCodium } from './chunk-J5DRK4RF.js';
 import { StaggerChildren } from './chunk-DQPK2XRL.js';
 import { Heading } from './chunk-UXX6HHPS.js';
-import { ScrollFadeIn } from './chunk-I23DDSU7.js';
 import { Card } from './chunk-7UY24UWL.js';
+import { ScrollFadeIn } from './chunk-I23DDSU7.js';
 import { Button } from './chunk-7KIDDF3I.js';
 import { ChevronRightIcon } from './chunk-G24VV5NO.js';
 import Link from 'next/link';
 import { jsx, jsxs } from 'react/jsx-runtime';
 
+var ICON_MAP = {
+  Gemini: /* @__PURE__ */ jsx(Gemini, {}),
+  Replit: /* @__PURE__ */ jsx(Replit, {}),
+  MagicUI: /* @__PURE__ */ jsx(MagicUI, {}),
+  VSCodium: /* @__PURE__ */ jsx(VSCodium, {}),
+  MediaWiki: /* @__PURE__ */ jsx(MediaWiki, {}),
+  GooglePaLM: /* @__PURE__ */ jsx(GooglePaLM, {})
+};
+function resolveIntegrationIcon(iconKey) {
+  return ICON_MAP[iconKey] ?? /* @__PURE__ */ jsx("span", { children: iconKey });
+}
 var defaultIntegrations = [
   {
     title: "Google Gemini",
     description: "Advanced multimodal AI for reasoning, code generation, and creative tasks.",
-    icon: /* @__PURE__ */ jsx(Gemini, {})
+    icon: "Gemini"
   },
   {
     title: "Replit",
     description: "Cloud-based IDE with real-time collaboration and instant deployment.",
-    icon: /* @__PURE__ */ jsx(Replit, {})
+    icon: "Replit"
   },
   {
     title: "Magic UI",
     description: "Beautiful animated components to elevate your interface design.",
-    icon: /* @__PURE__ */ jsx(MagicUI, {})
+    icon: "MagicUI"
   },
   {
     title: "VSCodium",
     description: "Open-source code editor with full extension ecosystem support.",
-    icon: /* @__PURE__ */ jsx(VSCodium, {})
+    icon: "VSCodium"
   },
   {
     title: "MediaWiki",
     description: "Structured knowledge management with powerful search and versioning.",
-    icon: /* @__PURE__ */ jsx(MediaWiki, {})
+    icon: "MediaWiki"
   },
   {
     title: "Google PaLM",
     description: "Large language model API for text generation and understanding.",
-    icon: /* @__PURE__ */ jsx(GooglePaLM, {})
+    icon: "GooglePaLM"
   }
 ];
 function IntegrationsBlock({
-  title = "Integrate with your favorite tools",
-  description = "Connect seamlessly with popular platforms and services to enhance your workflow.",
-  integrations = defaultIntegrations,
-  className
-} = {}) {
-  return /* @__PURE__ */ jsx(ScrollFadeIn, { children: /* @__PURE__ */ jsx("section", { className, children: /* @__PURE__ */ jsx("div", { className: "py-32", children: /* @__PURE__ */ jsxs("div", { className: "mx-auto max-w-5xl px-6", children: [
+  props
+}) {
+  const title = props.title ?? "Integrate with your favorite tools";
+  const description = props.description ?? "Connect seamlessly with popular platforms and services to enhance your workflow.";
+  const integrations = props.integrations ? props.integrations.map((i) => ({ title: i.title, description: i.description, icon: i.icon, link: i.link ?? void 0 })) : defaultIntegrations;
+  return /* @__PURE__ */ jsx(ScrollFadeIn, { children: /* @__PURE__ */ jsx("section", { children: /* @__PURE__ */ jsx("div", { className: "py-32", children: /* @__PURE__ */ jsxs("div", { className: "mx-auto max-w-5xl px-6", children: [
     /* @__PURE__ */ jsxs("div", { className: "text-center", children: [
       /* @__PURE__ */ jsx(Heading, { level: 2, size: "section", className: "md:text-4xl", children: title }),
       /* @__PURE__ */ jsx("p", { className: "text-text-tertiary mt-6", children: description })
@@ -62,7 +73,7 @@ function IntegrationsBlock({
         title: integration.title,
         description: integration.description,
         link: integration.link,
-        children: integration.icon
+        children: resolveIntegrationIcon(integration.icon)
       },
       i
     )) })

package/dist/{chunk-WSBLCWY7.js → chunk-IZ7A62GI.js}

@@ -1,6 +1,6 @@
-import { useSafeTimeout } from './chunk-MDAYDDTC.js';
 import { ScrollArea } from './chunk-GLU236NN.js';
 import { Input } from './chunk-AP3XXYAY.js';
+import { useSafeTimeout } from './chunk-MDAYDDTC.js';
 import { Avatar, AvatarFallback } from './chunk-NAAU5IWU.js';
 import { Button } from './chunk-7KIDDF3I.js';
 import { useMotionConfig, m, motionSpring } from './chunk-PD2YEH3H.js';
@@ -21,12 +21,13 @@ var defaultInitialMessages = [
   }
 ];
 function ChatLayout({
-  initialMessages = defaultInitialMessages,
-  assistantName = "AI Assistant",
-  assistantStatus = "Online",
-  placeholder = "Type a message...",
-  className
+  props
 }) {
+  const initialMessages = props.initialMessages ?? defaultInitialMessages;
+  const assistantName = props.assistantName ?? "AI Assistant";
+  const assistantStatus = props.assistantStatus ?? "Online";
+  const placeholder = props.placeholder ?? "Type a message...";
+  const className = props.className;
   const t = useTranslations("blocks.chatLayout");
   const motionConfig = useMotionConfig();
   const [messages, setMessages] = React.useState(initialMessages);

package/dist/chunk-JDHD4L6N.js

@@ -0,0 +1,31 @@
+import { seedComponentDefinitions } from './chunk-CTVV6JS6.js';
+import { defineCatalog } from '@json-render/core';
+import { schema } from '@json-render/next/server';
+import { z } from 'zod';
+
+var pageComponentDefinitions = {
+  AuthLayout: seedComponentDefinitions.AuthLayout,
+  PageShell: { props: z.object({ className: z.string().nullable() }), slots: ["default"], description: "Minimal full-page wrapper rendering children" },
+  HeaderBlock: seedComponentDefinitions.HeaderBlock,
+  HeroBlock: seedComponentDefinitions.HeroBlock,
+  LogoCloud: seedComponentDefinitions.LogoCloud,
+  FeatureBlock: seedComponentDefinitions.FeatureBlock,
+  StatsMarketingBlock: seedComponentDefinitions.StatsMarketingBlock,
+  PricingBlock: seedComponentDefinitions.PricingBlock,
+  ComparisonBlock: seedComponentDefinitions.ComparisonBlock,
+  TestimonialsBlock: seedComponentDefinitions.TestimonialsBlock,
+  CallToActionBlock: seedComponentDefinitions.CallToActionBlock,
+  FAQBlock: seedComponentDefinitions.FAQBlock,
+  NewsletterBlock: seedComponentDefinitions.NewsletterBlock,
+  BlogDetailBlock: seedComponentDefinitions.BlogDetailBlock,
+  ChangelogBlock: seedComponentDefinitions.ChangelogBlock,
+  FooterBlock: seedComponentDefinitions.FooterBlock,
+  DashboardBlock: seedComponentDefinitions.DashboardBlock,
+  OnboardingFlowBlock: seedComponentDefinitions.OnboardingFlowBlock
+};
+var showcaseCatalog = defineCatalog(schema, {
+  components: pageComponentDefinitions,
+  actions: { noop: { description: "No-op action for showcase event bindings" } }
+});
+
+export { pageComponentDefinitions, showcaseCatalog };

package/dist/chunk-JDLCIPSC.js

@@ -0,0 +1,18 @@
+import { cn } from './chunk-QYZT24TS.js';
+import { jsx } from 'react/jsx-runtime';
+
+function ButtonGroup({ className, ref, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref,
+      className: cn(
+        "inline-flex -space-x-px rounded-md shadow-sm *:rounded-none first:*:rounded-l-md last:*:rounded-r-md",
+        className
+      ),
+      ...props
+    }
+  );
+}
+
+export { ButtonGroup };