@vadimcomanescu/nadicode-design-system 5.0.0 → 5.0.2

package/dist/{chunk-UOUERAB4.js → chunk-3LROWCZE.js}

@@ -175,7 +175,8 @@ var blocksContentDefinitions = {
           group: z.string().nullable()
         })
       ).nullable(),
-      placeholder: z.string().nullable()
+      placeholder: z.string().nullable(),
+      searchValue: z.string().nullable()
     }),
     events: ["select"],
     description: "Keyboard-driven command palette with fuzzy search, hotkey trigger (Cmd+K), and responsive trigger button.",
@@ -185,7 +186,8 @@ var blocksContentDefinitions = {
         { id: "team", title: "Team Members", group: "Settings" },
         { id: "deploy", title: "Deploy to Production", group: "Actions" }
       ],
-      placeholder: "Search commands..."
+      placeholder: "Search commands...",
+      searchValue: null
     }
   },
   FormWizard: {
@@ -213,7 +215,8 @@ var blocksContentDefinitions = {
           description: z.string(),
           completed: z.boolean()
         })
-      ).nullable()
+      ).nullable(),
+      toggledStepId: z.string().nullable()
     }),
     events: ["toggle"],
     description: "Onboarding checklist with toggleable step completion tracking.",
@@ -223,7 +226,8 @@ var blocksContentDefinitions = {
         { id: "profile", title: "Complete your profile", description: "Add your name, avatar, and bio.", completed: true },
         { id: "invite", title: "Invite teammates", description: "Bring your team onboard for collaboration.", completed: false },
         { id: "project", title: "Create your first project", description: "Set up a workspace and start building.", completed: false }
-      ]
+      ],
+      toggledStepId: null
     }
   },
   OnboardingFlowBlock: {
@@ -258,7 +262,13 @@ var blocksContentDefinitions = {
       useCaseOptions: z.array(z.object({ value: z.string(), label: z.string() })).nullable(),
       reviewStepTitle: z.string().nullable(),
       reviewHeading: z.string().nullable(),
-      reviewBody: z.string().nullable()
+      reviewBody: z.string().nullable(),
+      displayName: z.string().nullable(),
+      organization: z.string().nullable(),
+      bio: z.string().nullable(),
+      framework: z.string().nullable(),
+      teamSize: z.string().nullable(),
+      useCase: z.string().nullable()
     }),
     events: ["complete"],
     description: "Self-contained onboarding wizard flow with 4 steps (Welcome, Profile, Preferences, Review). Manages FormWizard and completion state internally. Accepts serializable config for step titles, field labels, and select options.",
@@ -308,7 +318,13 @@ var blocksContentDefinitions = {
       ],
       reviewStepTitle: "Complete",
       reviewHeading: "All set!",
-      reviewBody: "Review your details and click Complete to launch your workspace."
+      reviewBody: "Review your details and click Complete to launch your workspace.",
+      displayName: null,
+      organization: null,
+      bio: null,
+      framework: null,
+      teamSize: null,
+      useCase: null
     }
   },
   PricingBlock: {
@@ -395,7 +411,8 @@ var blocksContentDefinitions = {
           icon: z.string().nullable()
         })
       ).nullable(),
-      className: z.string().nullable()
+      className: z.string().nullable(),
+      activeStep: z.number().nullable()
     }),
     events: ["finish"],
     description: "Opinionated multi-step wizard card with Stepper progress indicator and built-in step content slots. Handles account, profile, plan, and launch steps by default. Use for onboarding and setup flows. Step icons are string keys resolved through ICON_MAP (User, Settings, CreditCard, Rocket); unknown keys render no icon.",
@@ -407,7 +424,8 @@ var blocksContentDefinitions = {
         { title: "Team Details", description: "Name your workspace and invite members.", icon: "Settings" },
         { title: "Choose Plan", description: "Select the plan that fits your needs.", icon: "CreditCard" }
       ],
-      className: null
+      className: null,
+      activeStep: null
     }
   },
   UsageDonutBlock: {

package/dist/{chunk-UIYX2EMT.js → chunk-5RBO2IMZ.js}

@@ -10,16 +10,21 @@ import { KeyIcon } from './chunk-QSU23VYZ.js';
 import { Badge } from './chunk-S4JAHKOP.js';
 import { CopyIcon } from './chunk-TV4RSQH4.js';
 import { cn } from './chunk-QYZT24TS.js';
+import { useBoundProp } from '@json-render/react';
 import { useState, useMemo } from 'react';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 
 var DEFAULT_KEYS = [];
-function ApiKeysBlock({ props, emit }) {
+function ApiKeysBlock({ props, emit, bindings }) {
   const keys = props.keys ?? DEFAULT_KEYS;
   const title = props.title ?? "API Keys";
   const description = props.description ?? "Manage your API keys";
   const [dialogOpen, setDialogOpen] = useState(false);
-  const [newKeyName, setNewKeyName] = useState("");
+  const [boundNewKeyName, setBoundNewKeyName] = useBoundProp(props.newKeyName, bindings?.newKeyName);
+  const [localNewKeyName, setLocalNewKeyName] = useState("");
+  const isBound = !!bindings?.newKeyName;
+  const newKeyName = isBound ? boundNewKeyName ?? "" : localNewKeyName;
+  const setNewKeyName = isBound ? setBoundNewKeyName : setLocalNewKeyName;
   const [creating, setCreating] = useState(false);
   const [createdKey, setCreatedKey] = useState(null);
   const [copied, setCopied] = useState(false);

package/dist/{chunk-7SRNVMBY.js → chunk-7LYRUSWM.js}

@@ -7,17 +7,22 @@ import { bezier } from './chunk-CRY67BIF.js';
 import { Alert, AlertDescription } from './chunk-6CLSVCWP.js';
 import { cn } from './chunk-QYZT24TS.js';
 import * as React from 'react';
+import { useBoundProp } from '@json-render/react';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 
 var SHAKE_TRANSITION = { duration: 0.3, ease: bezier["out-cubic"] };
-function OTPBlock({ props, emit }) {
+function OTPBlock({ props, bindings, emit }) {
   const title = props.title ?? "One-Time Password";
   const description = props.description ?? "Please enter the one-time password sent to your phone.";
   const maxLength = props.maxLength ?? 6;
   const buttonText = props.buttonText ?? "Verify";
   const error = props.error ?? null;
   const backupCodeLink = props.backupCodeLink ?? null;
-  const [otp, setOtp] = React.useState("");
+  const [boundOtp, setBoundOtp] = useBoundProp(props.value, bindings?.value);
+  const [localOtp, setLocalOtp] = React.useState("");
+  const isOtpBound = !!bindings?.value;
+  const otp = isOtpBound ? boundOtp ?? "" : localOtp;
+  const setOtp = isOtpBound ? setBoundOtp : setLocalOtp;
   const [shake, setShake] = React.useState(false);
   React.useEffect(() => {
     if (error) {
@@ -26,7 +31,7 @@ function OTPBlock({ props, emit }) {
       const timeout = setTimeout(() => setShake(false), 300);
       return () => clearTimeout(timeout);
     }
-  }, [error]);
+  }, [error, setOtp]);
   return /* @__PURE__ */ jsx(m.div, { ...scaleIn, className: cn("w-full max-w-sm mx-auto"), children: /* @__PURE__ */ jsxs(Card, { className: "text-center", children: [
     /* @__PURE__ */ jsxs(CardHeader, { children: [
       /* @__PURE__ */ jsx(CardTitle, { className: "text-2xl", children: title }),

package/dist/{chunk-ZND7AAWG.js → chunk-A4QNTJUR.js}

@@ -188,7 +188,8 @@ var blocksDataDefinitions = {
           label: z.string(),
           days: z.number()
         })
-      ).nullable()
+      ).nullable(),
+      timeRange: z.string().nullable()
     }),
     events: ["timeRangeChange"],
     description: "Interactive area chart with time range selector and configurable data series.",
@@ -205,7 +206,8 @@ var blocksDataDefinitions = {
         { value: "7d", label: "Last 7 days", days: 7 },
         { value: "30d", label: "Last 30 days", days: 30 },
         { value: "90d", label: "Last 90 days", days: 90 }
-      ]
+      ],
+      timeRange: null
     }
   },
   ProcessFlowBlock: {

package/dist/{chunk-P7CTBRHO.js → chunk-AP5SGSN7.js}

@@ -7,6 +7,7 @@ import { Empty, EmptyTitle, EmptyDescription } from './chunk-4TF4QFIM.js';
 import { Card, CardHeader, CardTitle, CardContent } from './chunk-7UY24UWL.js';
 import { Button } from './chunk-7KIDDF3I.js';
 import { cn } from './chunk-QYZT24TS.js';
+import { useBoundProp } from '@json-render/react';
 import { useMemo } from 'react';
 import { jsxs, jsx } from 'react/jsx-runtime';
 
@@ -32,13 +33,16 @@ function clampPage(value, min, max) {
 function CrudListBlock({
   props,
   emit,
+  bindings,
   children
 }) {
   const title = props.title;
   const description = props.description;
   const columns = props.columns ?? EMPTY_COLUMNS;
   const rows = props.rows ?? EMPTY_ROWS;
-  const selectedRowId = props.selectedRowId ?? null;
+  const [boundSelectedRowId, setBoundSelectedRowId] = useBoundProp(props.selectedRowId, bindings?.selectedRowId);
+  const [boundFilterValue, setBoundFilterValue] = useBoundProp(props.filterValue, bindings?.filterValue);
+  const selectedRowId = bindings?.selectedRowId ? boundSelectedRowId ?? null : props.selectedRowId ?? null;
   const filterControls = props.filterControls ?? EMPTY_FILTERS;
   const pagination = props.pagination;
   const errorMessage = props.errorMessage ?? null;
@@ -65,15 +69,18 @@ function CrudListBlock({
     ] }) : null,
     filterControls.length > 0 ? /* @__PURE__ */ jsxs(Card, { children: [
       /* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsx(CardTitle, { children: "Filters" }) }),
-      /* @__PURE__ */ jsx(CardContent, { className: "grid gap-3 md:grid-cols-2 xl:grid-cols-3", children: filterControls.map((filter) => /* @__PURE__ */ jsxs("label", { className: "space-y-1", children: [
+      /* @__PURE__ */ jsx(CardContent, { className: "grid gap-3 md:grid-cols-2 xl:grid-cols-3", children: filterControls.map((filter, filterIndex) => /* @__PURE__ */ jsxs("label", { className: "space-y-1", children: [
         /* @__PURE__ */ jsx(Typography, { variant: "small", className: "font-medium", children: filter.label }),
         /* @__PURE__ */ jsx(
           Input,
           {
             "aria-label": filter.label,
-            value: filter.value,
+            value: filterIndex === 0 && bindings?.filterValue ? boundFilterValue ?? filter.value : filter.value,
             placeholder: filter.placeholder ?? void 0,
-            onChange: () => emit("filterChange")
+            onChange: (e) => {
+              if (filterIndex === 0) setBoundFilterValue(e.target.value);
+              emit("filterChange");
+            }
           }
         )
       ] }, filter.id)) })
@@ -110,7 +117,10 @@ function CrudListBlock({
                     {
                       variant: "ghost",
                       className: "h-auto p-0 font-normal",
-                      onClick: () => emit("rowSelect"),
+                      onClick: () => {
+                        setBoundSelectedRowId(row.id);
+                        emit("rowSelect");
+                      },
                       "aria-label": `Select ${rowLabel}`,
                       children: cell
                     }

package/dist/{chunk-5MLOZVOQ.js → chunk-B4373MDA.js}

@@ -11,6 +11,7 @@ import { CreditCardIcon } from './chunk-JHQTKMKG.js';
 import { UserIcon } from './chunk-UHXGBV5N.js';
 import { cn } from './chunk-QYZT24TS.js';
 import { useState } from 'react';
+import { useBoundProp } from '@json-render/react';
 import { jsxs, jsx } from 'react/jsx-runtime';
 
 var ICON_MAP = {
@@ -25,13 +26,17 @@ var defaultSteps = [
   { title: "Plan", description: "Choose a plan", icon: "CreditCard" },
   { title: "Launch", description: "Ready to go", icon: "Rocket" }
 ];
-function WizardBlock({ props, emit }) {
+function WizardBlock({ props, bindings, emit }) {
   const title = props.title ?? "Create Project";
   const description = props.description ?? "Follow the steps to setup your new project workspace.";
   const steps = props.steps ?? defaultSteps;
-  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));
+  const [boundActiveStep, setBoundActiveStep] = useBoundProp(props.activeStep, bindings?.activeStep);
+  const [localActiveStep, setLocalActiveStep] = useState(0);
+  const isActiveStepBound = !!bindings?.activeStep;
+  const activeStep = isActiveStepBound ? boundActiveStep ?? 0 : localActiveStep;
+  const setActiveStep = isActiveStepBound ? setBoundActiveStep : setLocalActiveStep;
+  const handleNext = () => setActiveStep(Math.min(activeStep + 1, steps.length - 1));
+  const handlePrev = () => setActiveStep(Math.max(activeStep - 1, 0));
   return /* @__PURE__ */ jsxs(Card, { className: cn("w-full max-w-2xl mx-auto", props.className), children: [
     /* @__PURE__ */ jsxs(CardHeader, { children: [
       /* @__PURE__ */ jsx(CardTitle, { children: title }),

package/dist/{chunk-KV726HMK.js → chunk-BOWKE7OE.js}

@@ -11,7 +11,7 @@ import { CSS } from '@dnd-kit/utilities';
 import { useReducedMotion } from 'motion/react';
 import { jsx, jsxs } from 'react/jsx-runtime';
 
-function KanbanBoard({
+function KanbanBoardImpl({
   value,
   onValueChange,
   getItemId,
@@ -262,14 +262,14 @@ function KanbanHandle({
     }
   );
 }
-function KanbanBoardCatalog({ props, emit, children }) {
+function KanbanBoard({ props, emit, children }) {
   const [value, setValue] = React.useState([]);
   const handleValueChange = (next) => {
     setValue(next);
     emit("valueChange");
   };
   return /* @__PURE__ */ jsx(
-    KanbanBoard,
+    KanbanBoardImpl,
     {
       value,
       onValueChange: handleValueChange,
@@ -281,4 +281,4 @@ function KanbanBoardCatalog({ props, emit, children }) {
   );
 }
 
-export { KanbanBoard, KanbanBoardCatalog, KanbanColumn, KanbanColumnHeader, KanbanHandle, KanbanItem };
+export { KanbanBoard, KanbanBoardImpl, KanbanColumn, KanbanColumnHeader, KanbanHandle, KanbanItem };

package/dist/{chunk-NVBF4OWT.js → chunk-BY6LWOHB.js}

@@ -5,6 +5,7 @@ import { Card, CardHeader, CardTitle, CardContent } from './chunk-7UY24UWL.js';
 import { CheckIcon } from './chunk-CXACRCZ4.js';
 import { cn } from './chunk-QYZT24TS.js';
 import * as React from 'react';
+import { useBoundProp } from '@json-render/react';
 import { useTranslations } from 'next-intl';
 import { jsxs, jsx } from 'react/jsx-runtime';
 
@@ -15,12 +16,13 @@ var defaultSteps = [
   { 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({ props, emit }) {
+function OnboardingBlock({ props, bindings, emit }) {
   const steps = props.steps ?? defaultSteps;
   const title = props.title ?? "Getting started";
   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;
+  const [, setToggledStepId] = useBoundProp(void 0, bindings?.toggledStepId);
   return /* @__PURE__ */ jsxs(Card, { className: cn("w-full max-w-lg"), children: [
     /* @__PURE__ */ jsxs(CardHeader, { children: [
       /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
@@ -38,7 +40,10 @@ function OnboardingBlock({ props, emit }) {
         Checkbox,
         {
           checked: step.completed,
-          onCheckedChange: () => emit("toggle"),
+          onCheckedChange: () => {
+            setToggledStepId(step.id);
+            emit("toggle");
+          },
           "aria-label": step.title
         }
       ) }),

package/dist/{chunk-4TK2PXMJ.js → chunk-CTVV6JS6.js}

@@ -1,4 +1,4 @@
-import { allDefinitions } from './chunk-HMN4K4L6.js';
+import { allDefinitions } from './chunk-VQVWFCHF.js';
 
 // src/catalog/catalog.ts
 var seedComponentDefinitions = allDefinitions;

package/dist/{chunk-6KRT337C.js → chunk-E4KUPYHE.js}

@@ -13,7 +13,7 @@ var chatDefinitions = {
   },
   ChatMessage: {
     props: z.object({
-      role: z.enum(["user", "assistant", "agent", "system"]),
+      role: z.enum(["user", "assistant", "system"]),
       isStreaming: z.boolean().nullable(),
       status: z.enum(["default", "error"]).nullable(),
       className: z.string().nullable()

package/dist/{chunk-3TYPQWKD.js → chunk-FSU7ZM5V.js}

@@ -9,12 +9,17 @@ import { Button } from './chunk-7KIDDF3I.js';
 import { CheckIcon } from './chunk-CXACRCZ4.js';
 import { cn } from './chunk-QYZT24TS.js';
 import { useState } from 'react';
+import { useBoundProp } from '@json-render/react';
 import { jsx, jsxs } from 'react/jsx-runtime';
 
-function NewsletterBlock({ props, emit }) {
+function NewsletterBlock({ props, bindings, emit }) {
   const title = props.title ?? "Stay in the loop";
   const description = props.description ?? "Get notified about new components, updates, and design system tips. No spam.";
-  const [email, setEmail] = useState("");
+  const [boundEmail, setBoundEmail] = useBoundProp(props.email, bindings?.email);
+  const [localEmail, setLocalEmail] = useState("");
+  const isEmailBound = !!bindings?.email;
+  const email = isEmailBound ? boundEmail ?? "" : localEmail;
+  const setEmail = isEmailBound ? setBoundEmail : setLocalEmail;
   const [status, setStatus] = useState("idle");
   const setSafeTimeout = useSafeTimeout();
   const handleSubmit = async (e) => {

package/dist/{chunk-QLPU2IEO.js → chunk-FX3GYS5O.js}

@@ -6,6 +6,8 @@ import { Card, CardHeader, CardDescription, CardContent, CardFooter } from './ch
 import { GoogleIcon, MicrosoftIcon } from './chunk-EL4XPFOD.js';
 import { Button } from './chunk-7KIDDF3I.js';
 import { cn } from './chunk-QYZT24TS.js';
+import { useState } from 'react';
+import { useBoundProp } from '@json-render/react';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 
 var FIELD_STAGGER_MS = 60;
@@ -33,7 +35,7 @@ var defaultLabels = {
   forgotPassword: "Forgot password?"
 };
 var accentButtonClass = "w-full bg-accent hover:bg-accent/90 text-accent-foreground shadow-[0_0_20px_rgb(var(--color-accent)/0.4)] transition-colors font-semibold";
-function LoginBlock({ props, emit }) {
+function LoginBlock({ props, bindings, emit }) {
   const labels = { ...defaultLabels };
   const type = props.type ?? "login";
   const showSocial = props.showSocial ?? true;
@@ -41,6 +43,21 @@ function LoginBlock({ props, emit }) {
   const forgotPasswordHref = props.forgotPasswordHref ?? "/reset-password";
   const signUpHref = props.signUpHref ?? "/signup";
   const signInHref = props.signInHref ?? "/login";
+  const [boundEmail, setBoundEmail] = useBoundProp(props.email, bindings?.email);
+  const [localEmail, setLocalEmail] = useState("");
+  const isEmailBound = !!bindings?.email;
+  const email = isEmailBound ? boundEmail ?? "" : localEmail;
+  const setEmail = isEmailBound ? setBoundEmail : setLocalEmail;
+  const [boundPassword, setBoundPassword] = useBoundProp(props.password, bindings?.password);
+  const [localPassword, setLocalPassword] = useState("");
+  const isPasswordBound = !!bindings?.password;
+  const password = isPasswordBound ? boundPassword ?? "" : localPassword;
+  const setPassword = isPasswordBound ? setBoundPassword : setLocalPassword;
+  const [boundFullName, setBoundFullName] = useBoundProp(props.fullName, bindings?.fullName);
+  const [localFullName, setLocalFullName] = useState("");
+  const isFullNameBound = !!bindings?.fullName;
+  const fullName = isFullNameBound ? boundFullName ?? "" : localFullName;
+  const setFullName = isFullNameBound ? setBoundFullName : setLocalFullName;
   const resolvedTitle = type === "login" ? labels.loginTitle : labels.signupTitle;
   const resolvedDescription = type === "login" ? labels.loginDescription : labels.signupDescription;
   const resolvedButtonText = type === "login" ? labels.loginSubmit : labels.signupSubmit;
@@ -84,7 +101,9 @@ function LoginBlock({ props, emit }) {
               required: true,
               placeholder: labels.fullNamePlaceholder,
               autoComplete: "name",
-              className: "border-border/50 focus:border-accent/50 transition-colors"
+              className: "border-border/50 focus:border-accent/50 transition-colors",
+              value: fullName,
+              onChange: (e) => setFullName(e.target.value)
             }
           )
         ] }),
@@ -101,7 +120,9 @@ function LoginBlock({ props, emit }) {
               autoCapitalize: "none",
               autoComplete: "email",
               autoCorrect: "off",
-              className: "border-border/50 focus:border-accent/50 transition-colors"
+              className: "border-border/50 focus:border-accent/50 transition-colors",
+              value: email,
+              onChange: (e) => setEmail(e.target.value)
             }
           )
         ] }),
@@ -125,7 +146,9 @@ function LoginBlock({ props, emit }) {
               type: "password",
               required: true,
               autoComplete: type === "login" ? "current-password" : "new-password",
-              className: "border-border/50 focus:border-accent/50 transition-colors"
+              className: "border-border/50 focus:border-accent/50 transition-colors",
+              value: password,
+              onChange: (e) => setPassword(e.target.value)
             }
           )
         ] }),

package/dist/{chunk-OMI2LLXM.js → chunk-H3KTAHJP.js}

@@ -9,10 +9,12 @@ import { Button } from './chunk-7KIDDF3I.js';
 import { CheckIcon } from './chunk-CXACRCZ4.js';
 import { cn } from './chunk-QYZT24TS.js';
 import { useState } from 'react';
+import { useBoundProp } from '@json-render/react';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 
 function ContactBlock({
   props,
+  bindings,
   emit
 }) {
   const title = props.title ?? "Get in touch";
@@ -22,9 +24,21 @@ function ContactBlock({
   const messagePlaceholder = props.messagePlaceholder ?? "Tell us what you need...";
   const successTitle = props.successTitle ?? "Message sent";
   const submitLabel = props.submitLabel ?? "Send message";
-  const [name, setName] = useState("");
-  const [email, setEmail] = useState("");
-  const [message, setMessage] = useState("");
+  const [boundName, setBoundName] = useBoundProp(props.name, bindings?.name);
+  const [localName, setLocalName] = useState("");
+  const isNameBound = !!bindings?.name;
+  const name = isNameBound ? boundName ?? "" : localName;
+  const setName = isNameBound ? setBoundName : setLocalName;
+  const [boundEmail, setBoundEmail] = useBoundProp(props.email, bindings?.email);
+  const [localEmail, setLocalEmail] = useState("");
+  const isEmailBound = !!bindings?.email;
+  const email = isEmailBound ? boundEmail ?? "" : localEmail;
+  const setEmail = isEmailBound ? setBoundEmail : setLocalEmail;
+  const [boundMessage, setBoundMessage] = useBoundProp(props.message, bindings?.message);
+  const [localMessage, setLocalMessage] = useState("");
+  const isMessageBound = !!bindings?.message;
+  const message = isMessageBound ? boundMessage ?? "" : localMessage;
+  const setMessage = isMessageBound ? setBoundMessage : setLocalMessage;
   const [status, setStatus] = useState("idle");
   const setSafeTimeout = useSafeTimeout();
   const handleSubmit = async (e) => {

package/dist/{chunk-UGXI4PES.js → chunk-IW36SVOH.js}

@@ -15,7 +15,8 @@ var blocksCrudDefinitions = {
         })
       ).nullable(),
       title: z.string().nullable(),
-      description: 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.",
@@ -25,18 +26,22 @@ var blocksCrudDefinitions = {
         { 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."
+      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()
+      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" }
+    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({
@@ -60,6 +65,7 @@ var blocksCrudDefinitions = {
           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(),
@@ -84,6 +90,7 @@ var blocksCrudDefinitions = {
       ],
       selectedRowId: null,
       filterControls: null,
+      filterValue: null,
       pagination: { page: 1, totalPages: 4 },
       errorMessage: null,
       emptyTitle: null,
@@ -216,10 +223,13 @@ var blocksCrudDefinitions = {
     }
   },
   InviteUserModal: {
-    props: z.object({}),
-    events: ["invite", "invited"],
+    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: {}
+    example: { email: null, role: null }
   },
   KanbanBoard: {
     props: z.object({

package/dist/{chunk-5L2RFJZR.js → chunk-JDHD4L6N.js}

@@ -1,4 +1,4 @@
-import { seedComponentDefinitions } from './chunk-4TK2PXMJ.js';
+import { seedComponentDefinitions } from './chunk-CTVV6JS6.js';
 import { defineCatalog } from '@json-render/core';
 import { schema } from '@json-render/next/server';
 import { z } from 'zod';

package/dist/{chunk-CAET62YQ.js → chunk-NBDUZA66.js}

@@ -15,7 +15,7 @@ var ROUTE_TREES = {
     root: "shell",
     elements: {
       shell: { type: "PageShell", props: { className: null }, children: ["auth"] },
-      auth: { type: "AuthLayout", props: { mode: "login", error: null, labels: null, className: null } }
+      auth: { type: "AuthLayout", props: { mode: "login", error: null, labels: null, className: null }, on: { submit: { action: "noop" } } }
     }
   },
   "/dashboard": {
@@ -66,7 +66,7 @@ var ROUTE_TREES = {
       testimonials: { type: "TestimonialsBlock", props: { title: null, description: null, testimonials: null } },
       cta: { type: "CallToActionBlock", props: { title: null, description: null, primaryAction: null, secondaryAction: null } },
       faq: { type: "FAQBlock", props: { title: null, description: null, items: null }, on: { expand: { action: "noop" } } },
-      newsletter: { type: "NewsletterBlock", props: { title: null, description: null }, on: { subscribe: { action: "noop" } } },
+      newsletter: { type: "NewsletterBlock", props: { title: null, description: null, email: null }, on: { subscribe: { action: "noop" } } },
       footer: { type: "FooterBlock", props: { brandDescription: null, brandName: null, socialLinks: null, newsletterPlaceholder: null, productLinks: null, companyLinks: null, legalLinks: null } }
     }
   },
@@ -152,7 +152,8 @@ var ROUTE_TREES = {
         type: "NewsletterBlock",
         props: {
           title: "Enjoyed this article?",
-          description: "Get more design system insights delivered to your inbox."
+          description: "Get more design system insights delivered to your inbox.",
+          email: null
         },
         on: { subscribe: { action: "noop" } }
       },
@@ -195,7 +196,13 @@ var ROUTE_TREES = {
           useCaseOptions: null,
           reviewStepTitle: null,
           reviewHeading: null,
-          reviewBody: null
+          reviewBody: null,
+          displayName: null,
+          organization: null,
+          bio: null,
+          framework: null,
+          teamSize: null,
+          useCase: null
         },
         on: { complete: { action: "noop" } }
       }

package/dist/{chunk-TNDMBLYP.js → chunk-NDQO7AO6.js}

@@ -8,6 +8,7 @@ import { Button } from './chunk-7KIDDF3I.js';
 import { zodResolver } from '@hookform/resolvers/zod';
 import { useForm } from 'react-hook-form';
 import { z } from 'zod';
+import { useBoundProp } from '@json-render/react';
 import { jsxs, jsx } from 'react/jsx-runtime';
 
 var profileFormSchema = z.object({
@@ -24,16 +25,27 @@ var profileFormSchema = z.object({
 var defaultFormValues = {
   bio: "I own a computer."
 };
-function CreateBlock({ props, emit }) {
+function CreateBlock({ props, emit, bindings }) {
   const title = props.title ?? "Create Profile";
   const description = props.description ?? "Example of a complex form with Zod validation.";
   const submitLabel = props.submitLabel ?? "Update profile";
+  const [, setBoundUsername] = useBoundProp(props.username, bindings?.username);
+  const [, setBoundEmail] = useBoundProp(props.email, bindings?.email);
+  const [, setBoundBio] = useBoundProp(props.bio, bindings?.bio);
   const form = useForm({
     resolver: zodResolver(profileFormSchema),
-    defaultValues: defaultFormValues,
+    defaultValues: {
+      ...defaultFormValues,
+      ...props.username ? { username: props.username } : {},
+      ...props.email ? { email: props.email } : {},
+      ...props.bio ? { bio: props.bio } : {}
+    },
     mode: "onChange"
   });
-  function handleSubmit(_data) {
+  function handleSubmit(data) {
+    if (bindings?.username) setBoundUsername(data.username);
+    if (bindings?.email) setBoundEmail(data.email);
+    if (bindings?.bio) setBoundBio(data.bio);
     emit("submit");
   }
   return /* @__PURE__ */ jsxs(Card, { className: "w-full max-w-2xl mx-auto", children: [

package/dist/{chunk-MT76BPYV.js → chunk-PQOL3E2V.js}

@@ -9,7 +9,7 @@ import { textEffectsComponents } from './chunk-5B3GLRX3.js';
 import { actionComponents } from './chunk-GXUQFXT7.js';
 import { agentComponents } from './chunk-65CUE2WL.js';
 import { chartComponents } from './chunk-L55GVKLY.js';
-import { chatComponents } from './chunk-56TNQ2P4.js';
+import { chatComponents } from './chunk-YMAEXGD2.js';
 
 // src/catalog/primitives/index.ts
 var primitiveComponents = {