@vadimcomanescu/nadicode-design-system 5.0.0 → 5.0.1

package/.agents/skills/seed/SKILL.md

@@ -34,14 +34,27 @@ Each entry provides: `props` (Zod schema), `description`, `slots`, `events`, `ex
 import { seedComponents } from "@vadimcomanescu/nadicode-design-system/catalog/components"
 ```
 
-Usage:
+Usage — spec pattern (preferred):
 ```tsx
-const { LoginBlock, HeroBlock } = seedComponents
-// All catalog components use BaseComponentProps — pass props object and emit callback
-<LoginBlock
-  props={{ type: "login", showSocial: true }}
-  emit={(event) => { if (event === 'submit') handleLogin() }}
-/>
+import { PageRenderer } from '@json-render/next'
+import { registry } from '@/lib/registry'
+
+// Pages are JSON specs rendered via PageRenderer
+const spec: NextAppSpec = {
+  routes: {
+    '/login': {
+      page: {
+        root: 'shell',
+        elements: {
+          shell: { type: 'PageShell', props: { className: null }, children: ['login'] },
+          login: { type: 'LoginBlock', props: { type: 'login', error: null, email: null, password: null, fullName: null, showSocial: null, forgotPasswordHref: null, signUpHref: null, signInHref: null } },
+        },
+      },
+    },
+  },
+}
+
+<PageRenderer spec={spec} registry={registry} />
 ```
 
 **Catalog blocks** are imported exclusively from `seedComponents`. Do not import them via individual subpath exports (ADR 0009). The ESLint rule `nadicode/require-catalog-import` enforces this at lint time.
@@ -105,6 +118,47 @@ The catalog is machine-readable, tested, accessible, and themed. Hand-built bloc
 | Hardcoded hex in components | Map to semantic tokens | Brand colors via tokens only |
 | Building a block from 3+ primitives without checking catalog | Query `seedComponentDefinitions` first, use catalog block | Catalog-First Rule |
 | Reimplementing a catalog block locally | `const { BlockName } = seedComponents` | Prevents drift and wasted work |
+| `emit('submit')` without `$bindState` | Wire form fields with `$bindState` + action params | Events are signals; data flows through state |
+
+---
+
+## Form Data Flow
+
+`emit()` is a signal — it carries no data payload. Form field values travel through state bindings, not events.
+
+### The pattern
+
+Wire each field to a state path with `$bindState`. Reference those paths in the action `params` when the submit event fires.
+
+```json
+{
+  "type": "LoginBlock",
+  "props": {
+    "type": "login",
+    "email": { "$bindState": "/auth/email" },
+    "password": { "$bindState": "/auth/password" }
+  },
+  "on": {
+    "submit": {
+      "action": "login",
+      "params": {
+        "email": { "$state": "/auth/email" },
+        "password": { "$state": "/auth/password" }
+      }
+    }
+  }
+}
+```
+
+When the user submits, `emit('submit')` fires. The runtime resolves `$state` references against the current state store and passes `{ email, password }` to the `login` action handler.
+
+### Dual-mode guarantee
+
+Blocks work both with and without bindings. Without `$bindState`, the block manages its own internal state and `emit('submit')` still fires — bindings just add the two-way state-sync layer that lets the spec read back the values.
+
+### Binding path convention
+
+Use `/form/fieldName` for generic forms and `/auth/fieldName` for authentication fields. The leading slash is required. Paths are scoped to the `StateProvider` wrapping the page.
 
 ---
 

package/contracts/release-governance-baseline.json

@@ -15,7 +15,6 @@
     "./brand-icons",
     "./catalog",
     "./catalog/components",
-    "./catalog/types",
     "./consumer-intent-map",
     "./ds-check",
     "./ds-update",

package/dist/{TeamPage-BX3RMSZU.js → TeamPage-IYWL6N4I.js}

@@ -1,5 +1,5 @@
-import { seedComponents } from './chunk-LZ66ADSL.js';
-import './chunk-MT76BPYV.js';
+import { seedComponents } from './chunk-PIFVLS5S.js';
+import './chunk-PQOL3E2V.js';
 import './chunk-YGDO5KDY.js';
 import './chunk-EJQ73FJ5.js';
 import './chunk-4GLBFZVI.js';
@@ -11,24 +11,24 @@ import './chunk-5B3GLRX3.js';
 import './chunk-GXUQFXT7.js';
 import './chunk-65CUE2WL.js';
 import './chunk-L55GVKLY.js';
-import './chunk-56TNQ2P4.js';
+import './chunk-YMAEXGD2.js';
 import './chunk-2NMP3J5R.js';
-import './chunk-JPNNAU26.js';
+import './chunk-XLN4NVKU.js';
 import './chunk-A4TQNK7R.js';
 import './chunk-PD6WW7E5.js';
 import './chunk-XMGWLDNG.js';
 import './chunk-PYRHNONA.js';
 import './chunk-HF2HNDE7.js';
 import './chunk-PTJPPKDR.js';
-import './chunk-ZNF6S3DQ.js';
+import './chunk-QCFDSOTV.js';
 import './chunk-HZTWLK7C.js';
-import './chunk-5MLOZVOQ.js';
-import './chunk-C7LO3JEF.js';
-import './chunk-ID3N3MHQ.js';
+import './chunk-B4373MDA.js';
+import './chunk-33UWVOQ6.js';
+import './chunk-R4SBK6Y5.js';
 import './chunk-PQBVNNEG.js';
 import './chunk-B4YCI5NM.js';
 import './chunk-L77KWJJB.js';
-import './chunk-YNBDA24W.js';
+import './chunk-ZKA5X3E4.js';
 import './chunk-PJ7DVYWA.js';
 import './chunk-HX3VXWNJ.js';
 import './chunk-IYK2ABFE.js';
@@ -39,28 +39,28 @@ import './chunk-BZYMCJHW.js';
 import './chunk-H466RJCI.js';
 import './chunk-DT6DGTVW.js';
 import './chunk-J5DRK4RF.js';
-import './chunk-IHGZJS7N.js';
+import './chunk-3FJG5MAT.js';
 import './chunk-STNVWBJH.js';
 import { createAvatarDataUri } from './chunk-OWWQP3YW.js';
-import './chunk-3TYPQWKD.js';
+import './chunk-FSU7ZM5V.js';
 import './chunk-DARC2ACH.js';
 import './chunk-4EHXVFQY.js';
-import './chunk-7SRNVMBY.js';
-import './chunk-NVBF4OWT.js';
+import './chunk-7LYRUSWM.js';
+import './chunk-BY6LWOHB.js';
 import './chunk-DSNPOAE6.js';
 import './chunk-JPA45CDE.js';
 import './chunk-Q4CRHV5T.js';
 import './chunk-KANK5FAG.js';
 import './chunk-6NL36QN3.js';
 import './chunk-CQ75K2DH.js';
-import './chunk-NA6ZPKIK.js';
-import './chunk-A44E44UV.js';
+import './chunk-UCFR7GLW.js';
+import './chunk-UPMSE6PQ.js';
 import './chunk-JVIRZNQ6.js';
 import './chunk-GE4WUAAE.js';
-import './chunk-OMI2LLXM.js';
-import './chunk-TNDMBLYP.js';
-import './chunk-P7CTBRHO.js';
-import './chunk-CPHVCY3M.js';
+import './chunk-H3KTAHJP.js';
+import './chunk-NDQO7AO6.js';
+import './chunk-AP5SGSN7.js';
+import './chunk-XX4XJJSH.js';
 import './chunk-D6MFOI3N.js';
 import './chunk-7AUNUDHM.js';
 import './chunk-4ZST7OY5.js';
@@ -73,10 +73,10 @@ import './chunk-IZ7A62GI.js';
 import './chunk-BVXSAVKY.js';
 import './chunk-GVOWGEGX.js';
 import './chunk-KMTLCN6S.js';
-import './chunk-BAB6AHOM.js';
-import './chunk-UIYX2EMT.js';
-import './chunk-R4DPHCHJ.js';
-import './chunk-QLPU2IEO.js';
+import './chunk-U43JTK45.js';
+import './chunk-5RBO2IMZ.js';
+import './chunk-UMEBNHKR.js';
+import './chunk-FX3GYS5O.js';
 import './chunk-OMGVZWRM.js';
 import './chunk-JVQQQS2M.js';
 import './chunk-DGSNEGJP.js';
@@ -86,7 +86,7 @@ import './chunk-ANBJ2OLC.js';
 import './chunk-LV4LBWCS.js';
 import './chunk-7OOO22KB.js';
 import './chunk-KWIIKHIB.js';
-import './chunk-GNKNT52O.js';
+import './chunk-TTDKPZ75.js';
 import './chunk-STKNMEJA.js';
 import './chunk-SIXPY62Q.js';
 import './chunk-XZ3A33GP.js';
@@ -156,7 +156,7 @@ import './chunk-C4SNHMYC.js';
 import './chunk-B5QL76GA.js';
 import './chunk-KPO4PD6C.js';
 import './chunk-LO3MDQSJ.js';
-import './chunk-KV726HMK.js';
+import './chunk-BOWKE7OE.js';
 import './chunk-B3BYBSF2.js';
 import './chunk-FOFGPWFS.js';
 import './chunk-VTAOHSPW.js';
@@ -179,7 +179,7 @@ import './chunk-RX5EUODB.js';
 import './chunk-4GQ5EMWR.js';
 import './chunk-TXRGQO5M.js';
 import './chunk-UN2SJ42K.js';
-import './chunk-WHYKEOUV.js';
+import './chunk-U5QLJHYN.js';
 import './chunk-S2WSXZ7Y.js';
 import './chunk-KXZP6XI2.js';
 import './chunk-VJ5VD4UT.js';
@@ -208,7 +208,7 @@ import './chunk-MDAYDDTC.js';
 import './chunk-TV6CJ5NI.js';
 import './chunk-756Q7AC5.js';
 import './chunk-MB75U2OV.js';
-import './chunk-4ACR6NGQ.js';
+import './chunk-UAN2YEI5.js';
 import './chunk-SEJXMNMK.js';
 import './chunk-VJIL7W55.js';
 import './chunk-JDLCIPSC.js';
@@ -411,7 +411,7 @@ function TeamPage() {
       /* @__PURE__ */ jsx(
         InviteUserModal,
         {
-          props: {},
+          props: { email: null, role: null },
           emit: () => {
           },
           on: () => ({ emit: () => {

package/dist/catalog/catalog.d.ts

@@ -329,6 +329,7 @@ export declare const seedComponentDefinitions: {
                 group: z.ZodNullable<z.ZodString>;
             }, z.core.$strip>>>;
             placeholder: z.ZodNullable<z.ZodString>;
+            searchValue: z.ZodNullable<z.ZodString>;
         }, z.core.$strip>;
         events: string[];
         description: string;
@@ -339,6 +340,7 @@ export declare const seedComponentDefinitions: {
                 group: string;
             }[];
             placeholder: string;
+            searchValue: null;
         };
     };
     FormWizard: {
@@ -373,6 +375,7 @@ export declare const seedComponentDefinitions: {
                 description: z.ZodString;
                 completed: z.ZodBoolean;
             }, z.core.$strip>>>;
+            toggledStepId: z.ZodNullable<z.ZodString>;
         }, z.core.$strip>;
         events: string[];
         description: string;
@@ -384,6 +387,7 @@ export declare const seedComponentDefinitions: {
                 description: string;
                 completed: boolean;
             }[];
+            toggledStepId: null;
         };
     };
     OnboardingFlowBlock: {
@@ -428,6 +432,12 @@ export declare const seedComponentDefinitions: {
             reviewStepTitle: z.ZodNullable<z.ZodString>;
             reviewHeading: z.ZodNullable<z.ZodString>;
             reviewBody: z.ZodNullable<z.ZodString>;
+            displayName: z.ZodNullable<z.ZodString>;
+            organization: z.ZodNullable<z.ZodString>;
+            bio: z.ZodNullable<z.ZodString>;
+            framework: z.ZodNullable<z.ZodString>;
+            teamSize: z.ZodNullable<z.ZodString>;
+            useCase: z.ZodNullable<z.ZodString>;
         }, z.core.$strip>;
         events: string[];
         description: string;
@@ -472,6 +482,12 @@ export declare const seedComponentDefinitions: {
             reviewStepTitle: string;
             reviewHeading: string;
             reviewBody: string;
+            displayName: null;
+            organization: null;
+            bio: null;
+            framework: null;
+            teamSize: null;
+            useCase: null;
         };
     };
     PricingBlock: {
@@ -563,6 +579,7 @@ export declare const seedComponentDefinitions: {
                 icon: z.ZodNullable<z.ZodString>;
             }, z.core.$strip>>>;
             className: z.ZodNullable<z.ZodString>;
+            activeStep: z.ZodNullable<z.ZodNumber>;
         }, z.core.$strip>;
         events: string[];
         description: string;
@@ -575,6 +592,7 @@ export declare const seedComponentDefinitions: {
                 icon: string;
             }[];
             className: null;
+            activeStep: null;
         };
     };
     UsageDonutBlock: {
@@ -822,7 +840,6 @@ export declare const seedComponentDefinitions: {
                     system: "system";
                     user: "user";
                     assistant: "assistant";
-                    agent: "agent";
                 }>;
                 content: z.ZodString;
                 timestamp: z.ZodNullable<z.ZodString>;
@@ -977,6 +994,7 @@ export declare const seedComponentDefinitions: {
             }, z.core.$strip>>>;
             title: z.ZodNullable<z.ZodString>;
             description: z.ZodNullable<z.ZodString>;
+            newKeyName: z.ZodNullable<z.ZodString>;
         }, z.core.$strip>;
         events: string[];
         description: string;
@@ -998,6 +1016,7 @@ export declare const seedComponentDefinitions: {
             })[];
             title: string;
             description: string;
+            newKeyName: null;
         };
     };
     CreateBlock: {
@@ -1005,6 +1024,9 @@ export declare const seedComponentDefinitions: {
             title: z.ZodNullable<z.ZodString>;
             description: z.ZodNullable<z.ZodString>;
             submitLabel: z.ZodNullable<z.ZodString>;
+            username: z.ZodNullable<z.ZodString>;
+            email: z.ZodNullable<z.ZodString>;
+            bio: z.ZodNullable<z.ZodString>;
         }, z.core.$strip>;
         events: string[];
         description: string;
@@ -1012,6 +1034,9 @@ export declare const seedComponentDefinitions: {
             title: string;
             description: string;
             submitLabel: string;
+            username: null;
+            email: null;
+            bio: null;
         };
     };
     CrudListBlock: {
@@ -1042,6 +1067,7 @@ export declare const seedComponentDefinitions: {
                 value: z.ZodString;
                 placeholder: z.ZodNullable<z.ZodString>;
             }, z.core.$strip>>>;
+            filterValue: z.ZodNullable<z.ZodString>;
             pagination: z.ZodObject<{
                 page: z.ZodNumber;
                 totalPages: z.ZodNumber;
@@ -1073,6 +1099,7 @@ export declare const seedComponentDefinitions: {
             }[];
             selectedRowId: null;
             filterControls: null;
+            filterValue: null;
             pagination: {
                 page: number;
                 totalPages: number;
@@ -1245,10 +1272,20 @@ export declare const seedComponentDefinitions: {
         };
     };
     InviteUserModal: {
-        props: z.ZodObject<{}, z.core.$strip>;
+        props: z.ZodObject<{
+            email: z.ZodNullable<z.ZodString>;
+            role: z.ZodNullable<z.ZodEnum<{
+                admin: "admin";
+                member: "member";
+                guest: "guest";
+            }>>;
+        }, z.core.$strip>;
         events: string[];
         description: string;
-        example: {};
+        example: {
+            email: null;
+            role: null;
+        };
     };
     KanbanBoard: {
         props: z.ZodObject<{
@@ -1641,6 +1678,7 @@ export declare const seedComponentDefinitions: {
                 label: z.ZodString;
                 days: z.ZodNumber;
             }, z.core.$strip>>>;
+            timeRange: z.ZodNullable<z.ZodString>;
         }, z.core.$strip>;
         events: string[];
         description: string;
@@ -1667,6 +1705,7 @@ export declare const seedComponentDefinitions: {
                 label: string;
                 days: number;
             }[];
+            timeRange: null;
         };
     };
     ProcessFlowBlock: {
@@ -1840,6 +1879,9 @@ export declare const seedComponentDefinitions: {
             messagePlaceholder: z.ZodNullable<z.ZodString>;
             successTitle: z.ZodNullable<z.ZodString>;
             submitLabel: z.ZodNullable<z.ZodString>;
+            name: z.ZodNullable<z.ZodString>;
+            email: z.ZodNullable<z.ZodString>;
+            message: z.ZodNullable<z.ZodString>;
         }, z.core.$strip>;
         events: string[];
         description: string;
@@ -1851,6 +1893,9 @@ export declare const seedComponentDefinitions: {
             messagePlaceholder: null;
             successTitle: null;
             submitLabel: string;
+            name: null;
+            email: null;
+            message: null;
         };
     };
     FAQBlock: {
@@ -2063,12 +2108,14 @@ export declare const seedComponentDefinitions: {
         props: z.ZodObject<{
             title: z.ZodNullable<z.ZodString>;
             description: z.ZodNullable<z.ZodString>;
+            email: z.ZodNullable<z.ZodString>;
         }, z.core.$strip>;
         events: string[];
         description: string;
         example: {
             title: string;
             description: string;
+            email: null;
         };
     };
     SolutionShowcaseBlock: {
@@ -2224,6 +2271,9 @@ export declare const seedComponentDefinitions: {
             forgotPasswordHref: z.ZodNullable<z.ZodString>;
             signUpHref: z.ZodNullable<z.ZodString>;
             signInHref: z.ZodNullable<z.ZodString>;
+            email: z.ZodNullable<z.ZodString>;
+            password: z.ZodNullable<z.ZodString>;
+            fullName: z.ZodNullable<z.ZodString>;
         }, z.core.$strip>;
         events: string[];
         description: string;
@@ -2234,6 +2284,9 @@ export declare const seedComponentDefinitions: {
             forgotPasswordHref: string;
             signUpHref: null;
             signInHref: null;
+            email: null;
+            password: null;
+            fullName: null;
         };
     };
     OTPBlock: {
@@ -2244,6 +2297,7 @@ export declare const seedComponentDefinitions: {
             buttonText: z.ZodNullable<z.ZodString>;
             error: z.ZodNullable<z.ZodString>;
             backupCodeLink: z.ZodNullable<z.ZodString>;
+            value: z.ZodNullable<z.ZodString>;
         }, z.core.$strip>;
         events: string[];
         description: string;
@@ -2254,6 +2308,7 @@ export declare const seedComponentDefinitions: {
             buttonText: string;
             error: null;
             backupCodeLink: string;
+            value: null;
         };
     };
     PasswordRecoveryBlock: {
@@ -2266,6 +2321,7 @@ export declare const seedComponentDefinitions: {
             description: z.ZodNullable<z.ZodString>;
             buttonText: z.ZodNullable<z.ZodString>;
             successTitle: z.ZodNullable<z.ZodString>;
+            email: z.ZodNullable<z.ZodString>;
         }, z.core.$strip>;
         events: string[];
         description: string;
@@ -2275,18 +2331,23 @@ export declare const seedComponentDefinitions: {
             description: string;
             buttonText: string;
             successTitle: string;
+            email: null;
         };
     };
     ResetPasswordBlock: {
         props: z.ZodObject<{
             title: z.ZodNullable<z.ZodString>;
             description: z.ZodNullable<z.ZodString>;
+            password: z.ZodNullable<z.ZodString>;
+            confirmPassword: z.ZodNullable<z.ZodString>;
         }, z.core.$strip>;
         events: string[];
         description: string;
         example: {
             title: string;
             description: string;
+            password: null;
+            confirmPassword: null;
         };
     };
     TwoFactorSetupBlock: {
@@ -2296,6 +2357,7 @@ export declare const seedComponentDefinitions: {
             backupCodes: z.ZodNullable<z.ZodArray<z.ZodString>>;
             title: z.ZodNullable<z.ZodString>;
             description: z.ZodNullable<z.ZodString>;
+            verifyCode: z.ZodNullable<z.ZodString>;
         }, z.core.$strip>;
         events: string[];
         description: string;
@@ -2305,6 +2367,7 @@ export declare const seedComponentDefinitions: {
             backupCodes: string[];
             title: string;
             description: string;
+            verifyCode: null;
         };
     };
     ChatGreeting: {
@@ -2326,7 +2389,6 @@ export declare const seedComponentDefinitions: {
                 system: "system";
                 user: "user";
                 assistant: "assistant";
-                agent: "agent";
             }>;
             isStreaming: z.ZodNullable<z.ZodBoolean>;
             status: z.ZodNullable<z.ZodEnum<{

package/dist/catalog/catalog.js

@@ -1,22 +1,22 @@
-export { seedComponentDefinitions } from '../chunk-4TK2PXMJ.js';
-import '../chunk-HMN4K4L6.js';
+export { seedComponentDefinitions } from '../chunk-CTVV6JS6.js';
+import '../chunk-VQVWFCHF.js';
 import '../chunk-LYI5YMC6.js';
 import '../chunk-UXYLA2IV.js';
 import '../chunk-YXRIXTXW.js';
 import '../chunk-UQB54LIA.js';
-import '../chunk-6KRT337C.js';
+import '../chunk-E4KUPYHE.js';
 import '../chunk-W4KI424V.js';
 import '../chunk-7SOMHO2L.js';
 import '../chunk-XI775QZZ.js';
 import '../chunk-P7JS4B7U.js';
 import '../chunk-QCL76CM6.js';
 import '../chunk-5XDYCBR6.js';
-import '../chunk-XYYZRQES.js';
-import '../chunk-VUNXVYOH.js';
-import '../chunk-UOUERAB4.js';
-import '../chunk-UGXI4PES.js';
-import '../chunk-ZND7AAWG.js';
+import '../chunk-ZU7MDRCI.js';
+import '../chunk-ZL6BPQNN.js';
+import '../chunk-3LROWCZE.js';
+import '../chunk-IW36SVOH.js';
+import '../chunk-A4QNTJUR.js';
 export { validateOnSchema, validationCheckSchema } from '../chunk-BJVCZI2B.js';
-import '../chunk-FAKTXE3F.js';
+import '../chunk-YEAJLVGB.js';
 import '../chunk-WAIZR4CR.js';
 import '../chunk-XLIFWBE7.js';

package/dist/catalog/components.d.ts

@@ -39,7 +39,7 @@ import { DirectoryBlock } from '../components/blocks/DirectoryBlock';
 import { FormFieldBlock } from '../components/blocks/FormFieldBlock';
 import { IntegrationsBlock } from '../components/blocks/IntegrationsBlock';
 import { InviteUserModal } from '../components/blocks/user/InviteUserModal';
-import { KanbanBoard, KanbanBoardCatalog, KanbanColumn, KanbanColumnHeader, KanbanHandle, KanbanItem } from '../components/ui/KanbanBoard';
+import { KanbanBoard, KanbanColumn, KanbanColumnHeader, KanbanHandle, KanbanItem } from '../components/ui/KanbanBoard';
 import { NavUser } from '../components/ui/NavUser';
 import { SettingsNavBlock } from '../components/blocks/SettingsNavBlock';
 import { TeamBlock } from '../components/blocks/TeamBlock';
@@ -109,7 +109,6 @@ export declare const seedComponents: {
     readonly InviteUserModal: typeof InviteUserModal;
     readonly KanbanBoard: {
         readonly KanbanBoard: typeof KanbanBoard;
-        readonly KanbanBoardCatalog: typeof KanbanBoardCatalog;
         readonly KanbanColumn: typeof KanbanColumn;
         readonly KanbanColumnHeader: typeof KanbanColumnHeader;
         readonly KanbanHandle: typeof KanbanHandle;