ngx-json-render 0.7.8 → 0.8.1

package/fesm2022/ngx-json-render-schema.mjs

@@ -0,0 +1,107 @@
+import { defineSchema } from '@json-render/core';
+
+/**
+ * The schema for ngx-json-render.
+ *
+ * Defines:
+ * - Spec: A flat tree of elements with keys, types, props, and children references
+ * - Catalog: Components with props schemas, and optional actions
+ *
+ * This is the same spec grammar the other json-render renderers use, so
+ * catalogs and specs are portable across frameworks.
+ */
+const schema = defineSchema((s) => ({
+    // What the AI-generated SPEC looks like
+    spec: s.object({
+        /** Root element key */
+        root: s.string(),
+        /** Flat map of elements by key */
+        elements: s.record(s.object({
+            /** Component type from catalog */
+            type: s.ref('catalog.components'),
+            /** Component props */
+            props: s.propsOf('catalog.components'),
+            /** Child element keys (flat reference) */
+            children: s.array(s.string()),
+            /** Visibility condition */
+            visible: { ...s.any(), ...s.optional() },
+            /** Repeat children from a state array */
+            repeat: { ...s.any(), ...s.optional() },
+        })),
+    }),
+    // What the CATALOG must provide
+    catalog: s.object({
+        /** Component definitions */
+        components: s.map({
+            /** Zod schema for component props */
+            props: s.zod(),
+            /** Slots for this component. Use ['default'] for children, or named slots like ['header', 'footer'] */
+            slots: s.array(s.string()),
+            /** Description for AI generation hints */
+            description: s.string(),
+            /** Example prop values used in prompt examples (auto-generated from Zod schema if omitted) */
+            example: s.any(),
+        }),
+        /** Action definitions (optional) */
+        actions: s.map({
+            /** Zod schema for action params */
+            params: s.zod(),
+            /** Description for AI generation hints */
+            description: s.string(),
+        }),
+    }),
+}), {
+    builtInActions: [
+        {
+            name: 'setState',
+            description: 'Update a value in the state model at the given statePath. Params: { statePath: string, value: any }',
+        },
+        {
+            name: 'pushState',
+            description: 'Append an item to an array in state. Params: { statePath: string, value: any, clearStatePath?: string }. Value can contain {"$state":"/path"} refs and "$id" for auto IDs.',
+        },
+        {
+            name: 'removeState',
+            description: 'Remove an item from an array in state by index. Params: { statePath: string, index: number }',
+        },
+        {
+            name: 'validateForm',
+            description: 'Validate all registered form fields and write the result to state. Params: { statePath?: string }. Defaults to /formValidation. Result: { valid: boolean, errors: Record<string, string[]> }.',
+        },
+        {
+            name: 'submitForm',
+            description: "Validate all registered form fields and, only if every one passes, dispatch another action. Params: { action: string, params?: object, statePath?: string }. Writes the same { valid, errors } result as validateForm. Use this on a form's submit button: it is validateForm and the submit in one binding, and the submit is skipped when the form is invalid.",
+        },
+    ],
+    defaultRules: [
+        // Element integrity
+        "CRITICAL INTEGRITY CHECK: Before outputting ANY element that references children, you MUST have already output (or will output) each child as its own element. If an element has children: ['a', 'b'], then elements 'a' and 'b' MUST exist. A missing child element causes that entire branch of the UI to be invisible.",
+        'SELF-CHECK: After generating all elements, mentally walk the tree from root. Every key in every children array must resolve to a defined element. If you find a gap, output the missing element immediately.',
+        'REQUIRED FIELDS: Every element MUST include a "children" array. Leaf elements (text, badges, inputs, images) use an empty array: "children": []. Omitting "children" fails validation.',
+        // Field placement
+        'CRITICAL: The "visible" field goes on the ELEMENT object, NOT inside "props". Correct: {"type":"<ComponentName>","props":{},"visible":{"$state":"/tab","eq":"home"},"children":[...]}.',
+        'CRITICAL: The "on" field goes on the ELEMENT object, NOT inside "props". Use on.press, on.change, on.submit etc. NEVER put action/actionParams inside props.',
+        // State and data
+        'When the user asks for a UI that displays data (e.g. blog posts, products, users), ALWAYS include a state field with realistic sample data. The state field is a top-level field on the spec (sibling of root/elements).',
+        'When building repeating content backed by a state array (e.g. posts, products, items), use the "repeat" field on a container element. Example: { "type": "<ContainerComponent>", "props": {}, "repeat": { "statePath": "/posts", "key": "id" }, "children": ["post-card"] }. For a nested list stored on the enclosing item, use "repeat": { "statePath": { "$item": "comments" }, "key": "id" }. The $item statePath form is valid only inside another repeat. Inside repeated children, use { "$item": "field" } to read a field from the current item, and { "$index": true } for the current array index. For two-way binding to an item field use { "$bindItem": "completed" }. Do NOT hardcode individual elements for each array item.',
+        // Design quality
+        'Design with visual hierarchy: use container components to group content, heading components for section titles, proper spacing, and status indicators. ONLY use components from the AVAILABLE COMPONENTS list.',
+        'For data-rich UIs, use multi-column layout components if available. For forms and single-column content, use vertical layout components. ONLY use components from the AVAILABLE COMPONENTS list.',
+        'Always include realistic, professional-looking sample data. For blogs include 3-4 posts with varied titles, authors, dates, categories. For products include names, prices, images. Never leave data empty.',
+    ],
+});
+
+/*
+ * Public API Surface of ngx-json-render/schema
+ *
+ * The spec grammar alone, with nothing but `@json-render/core` behind it, so
+ * a server can define a catalog without loading Angular. The primary entry
+ * point re-exports it.
+ */
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { schema };
+//# sourceMappingURL=ngx-json-render-schema.mjs.map

package/fesm2022/ngx-json-render-schema.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ngx-json-render-schema.mjs","sources":["../../../projects/ngx-json-render/schema/src/schema.ts","../../../projects/ngx-json-render/schema/src/public-api.ts","../../../projects/ngx-json-render/schema/src/ngx-json-render-schema.ts"],"sourcesContent":["import { defineSchema } from '@json-render/core';\n\n/**\n * The schema for ngx-json-render.\n *\n * Defines:\n * - Spec: A flat tree of elements with keys, types, props, and children references\n * - Catalog: Components with props schemas, and optional actions\n *\n * This is the same spec grammar the other json-render renderers use, so\n * catalogs and specs are portable across frameworks.\n */\nexport const schema = defineSchema(\n  (s) => ({\n    // What the AI-generated SPEC looks like\n    spec: s.object({\n      /** Root element key */\n      root: s.string(),\n      /** Flat map of elements by key */\n      elements: s.record(\n        s.object({\n          /** Component type from catalog */\n          type: s.ref('catalog.components'),\n          /** Component props */\n          props: s.propsOf('catalog.components'),\n          /** Child element keys (flat reference) */\n          children: s.array(s.string()),\n          /** Visibility condition */\n          visible: { ...s.any(), ...s.optional() },\n          /** Repeat children from a state array */\n          repeat: { ...s.any(), ...s.optional() },\n        }),\n      ),\n    }),\n\n    // What the CATALOG must provide\n    catalog: s.object({\n      /** Component definitions */\n      components: s.map({\n        /** Zod schema for component props */\n        props: s.zod(),\n        /** Slots for this component. Use ['default'] for children, or named slots like ['header', 'footer'] */\n        slots: s.array(s.string()),\n        /** Description for AI generation hints */\n        description: s.string(),\n        /** Example prop values used in prompt examples (auto-generated from Zod schema if omitted) */\n        example: s.any(),\n      }),\n      /** Action definitions (optional) */\n      actions: s.map({\n        /** Zod schema for action params */\n        params: s.zod(),\n        /** Description for AI generation hints */\n        description: s.string(),\n      }),\n    }),\n  }),\n  {\n    builtInActions: [\n      {\n        name: 'setState',\n        description:\n          'Update a value in the state model at the given statePath. Params: { statePath: string, value: any }',\n      },\n      {\n        name: 'pushState',\n        description:\n          'Append an item to an array in state. Params: { statePath: string, value: any, clearStatePath?: string }. Value can contain {\"$state\":\"/path\"} refs and \"$id\" for auto IDs.',\n      },\n      {\n        name: 'removeState',\n        description:\n          'Remove an item from an array in state by index. Params: { statePath: string, index: number }',\n      },\n      {\n        name: 'validateForm',\n        description:\n          'Validate all registered form fields and write the result to state. Params: { statePath?: string }. Defaults to /formValidation. Result: { valid: boolean, errors: Record<string, string[]> }.',\n      },\n      {\n        name: 'submitForm',\n        description:\n          \"Validate all registered form fields and, only if every one passes, dispatch another action. Params: { action: string, params?: object, statePath?: string }. Writes the same { valid, errors } result as validateForm. Use this on a form's submit button: it is validateForm and the submit in one binding, and the submit is skipped when the form is invalid.\",\n      },\n    ],\n    defaultRules: [\n      // Element integrity\n      \"CRITICAL INTEGRITY CHECK: Before outputting ANY element that references children, you MUST have already output (or will output) each child as its own element. If an element has children: ['a', 'b'], then elements 'a' and 'b' MUST exist. A missing child element causes that entire branch of the UI to be invisible.\",\n      'SELF-CHECK: After generating all elements, mentally walk the tree from root. Every key in every children array must resolve to a defined element. If you find a gap, output the missing element immediately.',\n      'REQUIRED FIELDS: Every element MUST include a \"children\" array. Leaf elements (text, badges, inputs, images) use an empty array: \"children\": []. Omitting \"children\" fails validation.',\n\n      // Field placement\n      'CRITICAL: The \"visible\" field goes on the ELEMENT object, NOT inside \"props\". Correct: {\"type\":\"<ComponentName>\",\"props\":{},\"visible\":{\"$state\":\"/tab\",\"eq\":\"home\"},\"children\":[...]}.',\n      'CRITICAL: The \"on\" field goes on the ELEMENT object, NOT inside \"props\". Use on.press, on.change, on.submit etc. NEVER put action/actionParams inside props.',\n\n      // State and data\n      'When the user asks for a UI that displays data (e.g. blog posts, products, users), ALWAYS include a state field with realistic sample data. The state field is a top-level field on the spec (sibling of root/elements).',\n      'When building repeating content backed by a state array (e.g. posts, products, items), use the \"repeat\" field on a container element. Example: { \"type\": \"<ContainerComponent>\", \"props\": {}, \"repeat\": { \"statePath\": \"/posts\", \"key\": \"id\" }, \"children\": [\"post-card\"] }. For a nested list stored on the enclosing item, use \"repeat\": { \"statePath\": { \"$item\": \"comments\" }, \"key\": \"id\" }. The $item statePath form is valid only inside another repeat. Inside repeated children, use { \"$item\": \"field\" } to read a field from the current item, and { \"$index\": true } for the current array index. For two-way binding to an item field use { \"$bindItem\": \"completed\" }. Do NOT hardcode individual elements for each array item.',\n\n      // Design quality\n      'Design with visual hierarchy: use container components to group content, heading components for section titles, proper spacing, and status indicators. ONLY use components from the AVAILABLE COMPONENTS list.',\n      'For data-rich UIs, use multi-column layout components if available. For forms and single-column content, use vertical layout components. ONLY use components from the AVAILABLE COMPONENTS list.',\n      'Always include realistic, professional-looking sample data. For blogs include 3-4 posts with varied titles, authors, dates, categories. For products include names, prices, images. Never leave data empty.',\n    ],\n  },\n);\n\n/**\n * Type for the Angular schema\n */\nexport type AngularSchema = typeof schema;\n\n/**\n * Infer the spec type from a catalog\n */\nexport type AngularSpec<TCatalog> = typeof schema extends {\n  createCatalog: (catalog: TCatalog) => { _specType: infer S };\n}\n  ? S\n  : never;\n","/*\n * Public API Surface of ngx-json-render/schema\n *\n * The spec grammar alone, with nothing but `@json-render/core` behind it, so\n * a server can define a catalog without loading Angular. The primary entry\n * point re-exports it.\n */\n\nexport { schema, type AngularSchema, type AngularSpec } from './schema';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;AAEA;;;;;;;;;AASG;AACI,MAAM,MAAM,GAAG,YAAY,CAChC,CAAC,CAAC,MAAM;;AAEN,IAAA,IAAI,EAAE,CAAC,CAAC,MAAM,CAAC;;AAEb,QAAA,IAAI,EAAE,CAAC,CAAC,MAAM,EAAE;;QAEhB,QAAQ,EAAE,CAAC,CAAC,MAAM,CAChB,CAAC,CAAC,MAAM,CAAC;;AAEP,YAAA,IAAI,EAAE,CAAC,CAAC,GAAG,CAAC,oBAAoB,CAAC;;AAEjC,YAAA,KAAK,EAAE,CAAC,CAAC,OAAO,CAAC,oBAAoB,CAAC;;YAEtC,QAAQ,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,EAAE,CAAC;;AAE7B,YAAA,OAAO,EAAE,EAAE,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,GAAG,CAAC,CAAC,QAAQ,EAAE,EAAE;;AAExC,YAAA,MAAM,EAAE,EAAE,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,GAAG,CAAC,CAAC,QAAQ,EAAE,EAAE;AACxC,SAAA,CAAC,CACH;KACF,CAAC;;AAGF,IAAA,OAAO,EAAE,CAAC,CAAC,MAAM,CAAC;;AAEhB,QAAA,UAAU,EAAE,CAAC,CAAC,GAAG,CAAC;;AAEhB,YAAA,KAAK,EAAE,CAAC,CAAC,GAAG,EAAE;;YAEd,KAAK,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,EAAE,CAAC;;AAE1B,YAAA,WAAW,EAAE,CAAC,CAAC,MAAM,EAAE;;AAEvB,YAAA,OAAO,EAAE,CAAC,CAAC,GAAG,EAAE;SACjB,CAAC;;AAEF,QAAA,OAAO,EAAE,CAAC,CAAC,GAAG,CAAC;;AAEb,YAAA,MAAM,EAAE,CAAC,CAAC,GAAG,EAAE;;AAEf,YAAA,WAAW,EAAE,CAAC,CAAC,MAAM,EAAE;SACxB,CAAC;KACH,CAAC;AACH,CAAA,CAAC,EACF;AACE,IAAA,cAAc,EAAE;AACd,QAAA;AACE,YAAA,IAAI,EAAE,UAAU;AAChB,YAAA,WAAW,EACT,qGAAqG;AACxG,SAAA;AACD,QAAA;AACE,YAAA,IAAI,EAAE,WAAW;AACjB,YAAA,WAAW,EACT,4KAA4K;AAC/K,SAAA;AACD,QAAA;AACE,YAAA,IAAI,EAAE,aAAa;AACnB,YAAA,WAAW,EACT,8FAA8F;AACjG,SAAA;AACD,QAAA;AACE,YAAA,IAAI,EAAE,cAAc;AACpB,YAAA,WAAW,EACT,+LAA+L;AAClM,SAAA;AACD,QAAA;AACE,YAAA,IAAI,EAAE,YAAY;AAClB,YAAA,WAAW,EACT,kWAAkW;AACrW,SAAA;AACF,KAAA;AACD,IAAA,YAAY,EAAE;;QAEZ,2TAA2T;QAC3T,8MAA8M;QAC9M,wLAAwL;;QAGxL,wLAAwL;QACxL,8JAA8J;;QAG9J,0NAA0N;QAC1N,+sBAA+sB;;QAG/sB,gNAAgN;QAChN,kMAAkM;QAClM,6MAA6M;AAC9M,KAAA;AACF,CAAA;;ACxGH;;;;;;AAMG;;ACNH;;AAEG;;"}

package/fesm2022/ngx-json-render.mjs

@@ -1,8 +1,9 @@
 import { NgComponentOutlet } from '@angular/common';
 import * as i0 from '@angular/core';
 import { signal, Injectable, isDevMode, inject, computed, untracked, effect, DestroyRef, InjectionToken, input, output, viewChild, afterNextRender, ChangeDetectionStrategy, Component, Injector, forwardRef } from '@angular/core';
-import { createStateStore, getByPath, runValidation, resolveAction, nextActionDispatchId, notifyActionDispatch, notifyActionSettle, executeAction, isDevtoolsActive, subscribeDevtoolsActive, resolveRepeatStatePath, evaluateVisibility, resolveElementProps, resolveBindings, resolveActionParam, autoFixSpec, validateSpec, createDirectiveRegistry, resolveRepeatItemStatePath, removeByPath, addByPath, setByPath, SPEC_DATA_PART_TYPE, nestedToFlat, createMixedStreamParser, defineSchema } from '@json-render/core';
+import { createStateStore, getByPath, runValidation, resolveAction, nextActionDispatchId, notifyActionDispatch, notifyActionSettle, executeAction, isDevtoolsActive, subscribeDevtoolsActive, resolveRepeatStatePath, evaluateVisibility, resolveElementProps, resolveBindings, resolveActionParam, autoFixSpec, validateSpec, createDirectiveRegistry, resolveRepeatItemStatePath, removeByPath, addByPath, setByPath, SPEC_DATA_PART_TYPE, nestedToFlat, createMixedStreamParser } from '@json-render/core';
 export { autoFixSpec, createStateStore, formatSpecIssues, nestedToFlat, validateSpec } from '@json-render/core';
+export { schema } from 'ngx-json-render/schema';
 
 const EMPTY = signal(undefined, ...(ngDevMode ? [{ debugName: "EMPTY" }] : /* istanbul ignore next */ []));
 /**
@@ -3138,6 +3139,34 @@ function applyPatch(spec, patch) {
     return newSpec;
 }
 
+const observers = new Set();
+/**
+ * Register an observer for every stream in the app. Returns the function that
+ * removes it. Private API for `ngx-json-render/devtools`.
+ */
+function ɵregisterStreamObserver(observer) {
+    observers.add(observer);
+    return () => {
+        observers.delete(observer);
+    };
+}
+/**
+ * Tell every observer. An observer that throws is a devtools bug, and it must
+ * not become a failed generation in the app it is inspecting.
+ */
+function notifyStreamObservers(event, ...args) {
+    if (observers.size === 0)
+        return;
+    for (const observer of observers) {
+        try {
+            observer[event]?.(...args);
+        }
+        catch (error) {
+            console.error('[ngx-json-render] A stream observer threw:', error);
+        }
+    }
+}
+
 /**
  * Convert a flat element list to a Spec.
  * Input elements use key/parentKey to establish identity and relationships.
@@ -3461,6 +3490,8 @@ function injectUIStream(options) {
             ? { ...previousSpec, elements: { ...previousSpec.elements } }
             : { root: '', elements: {} };
         spec.set(currentSpec);
+        notifyStreamObservers('onStart');
+        let failed = false;
         const handleLine = (line) => {
             const parsed = parseLine(line);
             if (!parsed)
@@ -3468,11 +3499,13 @@ function injectUIStream(options) {
             gate.commit(() => {
                 if (parsed.type === 'usage') {
                     usage.set(parsed.usage);
+                    notifyStreamObservers('onUsage', parsed.usage);
                     return;
                 }
                 rawLines.update((prev) => [...prev, line]);
                 currentSpec = applyPatch(currentSpec, parsed.patch);
                 spec.set(currentSpec);
+                notifyStreamObservers('onPatch', parsed.patch);
             });
         };
         try {
@@ -3503,6 +3536,7 @@ function injectUIStream(options) {
                 // not want rendered.
                 if (check.blocked || (validate === 'strict' && check.hasErrors)) {
                     const invalid = new Error(`Generated spec failed validation:\n${formatSpecCheckIssues(check.issues)}`);
+                    failed = true;
                     error.set(invalid);
                     options.onError?.(invalid);
                     return;
@@ -3513,6 +3547,7 @@ function injectUIStream(options) {
         catch (err) {
             if (isAbortError(err))
                 return;
+            failed = true;
             const resolvedError = err instanceof Error ? err : new Error(String(err));
             gate.commit(() => {
                 error.set(resolvedError);
@@ -3521,6 +3556,7 @@ function injectUIStream(options) {
         }
         finally {
             gate.commit(() => isStreaming.set(false));
+            notifyStreamObservers('onEnd', !failed);
         }
     };
     return {
@@ -3621,6 +3657,8 @@ function injectChatUI(options) {
         messages.update((prev) => [...prev, userMessage, assistantMessage]);
         isStreaming.set(true);
         error.set(null);
+        notifyStreamObservers('onStart');
+        let failed = false;
         // Mutable state for accumulating the assistant response
         let accumulatedText = '';
         let currentSpec = { root: '', elements: {} };
@@ -3632,12 +3670,18 @@ function injectChatUI(options) {
                 // touch, so the message can hold it directly — no snapshot copy.
                 currentSpec = applyPatch(currentSpec, patch);
                 const snapshot = currentSpec;
-                gate.commit(() => messages.update((prev) => prev.map((m) => m.id === assistantId ? { ...m, spec: snapshot } : m)));
+                gate.commit(() => {
+                    messages.update((prev) => prev.map((m) => m.id === assistantId ? { ...m, spec: snapshot } : m));
+                    notifyStreamObservers('onPatch', patch);
+                });
             },
             onText(line) {
                 accumulatedText += (accumulatedText ? '\n' : '') + line;
                 const snapshot = accumulatedText;
-                gate.commit(() => messages.update((prev) => prev.map((m) => m.id === assistantId ? { ...m, text: snapshot } : m)));
+                gate.commit(() => {
+                    messages.update((prev) => prev.map((m) => m.id === assistantId ? { ...m, text: snapshot } : m));
+                    notifyStreamObservers('onText', line);
+                });
             },
         });
         try {
@@ -3671,6 +3715,7 @@ function injectChatUI(options) {
                 // not want rendered.
                 if (check.blocked || (validate === 'strict' && check.hasErrors)) {
                     const invalid = new Error(`Generated spec failed validation:\n${formatSpecCheckIssues(check.issues)}`);
+                    failed = true;
                     error.set(invalid);
                     options.onError?.(invalid);
                     return;
@@ -3686,6 +3731,7 @@ function injectChatUI(options) {
             dropEmptyPlaceholder();
             if (isAbortError(err))
                 return;
+            failed = true;
             const resolvedError = err instanceof Error ? err : new Error(String(err));
             gate.commit(() => {
                 error.set(resolvedError);
@@ -3694,6 +3740,7 @@ function injectChatUI(options) {
         }
         finally {
             gate.commit(() => isStreaming.set(false));
+            notifyStreamObservers('onEnd', !failed);
         }
     };
     return {
@@ -3716,97 +3763,6 @@ function injectChatUI(options) {
  * - `ui-stream` / `chat-ui` — the two hooks, composed from the above.
  */
 
-/**
- * The schema for ngx-json-render.
- *
- * Defines:
- * - Spec: A flat tree of elements with keys, types, props, and children references
- * - Catalog: Components with props schemas, and optional actions
- *
- * This is the same spec grammar the other json-render renderers use, so
- * catalogs and specs are portable across frameworks.
- */
-const schema = defineSchema((s) => ({
-    // What the AI-generated SPEC looks like
-    spec: s.object({
-        /** Root element key */
-        root: s.string(),
-        /** Flat map of elements by key */
-        elements: s.record(s.object({
-            /** Component type from catalog */
-            type: s.ref('catalog.components'),
-            /** Component props */
-            props: s.propsOf('catalog.components'),
-            /** Child element keys (flat reference) */
-            children: s.array(s.string()),
-            /** Visibility condition */
-            visible: { ...s.any(), ...s.optional() },
-            /** Repeat children from a state array */
-            repeat: { ...s.any(), ...s.optional() },
-        })),
-    }),
-    // What the CATALOG must provide
-    catalog: s.object({
-        /** Component definitions */
-        components: s.map({
-            /** Zod schema for component props */
-            props: s.zod(),
-            /** Slots for this component. Use ['default'] for children, or named slots like ['header', 'footer'] */
-            slots: s.array(s.string()),
-            /** Description for AI generation hints */
-            description: s.string(),
-            /** Example prop values used in prompt examples (auto-generated from Zod schema if omitted) */
-            example: s.any(),
-        }),
-        /** Action definitions (optional) */
-        actions: s.map({
-            /** Zod schema for action params */
-            params: s.zod(),
-            /** Description for AI generation hints */
-            description: s.string(),
-        }),
-    }),
-}), {
-    builtInActions: [
-        {
-            name: 'setState',
-            description: 'Update a value in the state model at the given statePath. Params: { statePath: string, value: any }',
-        },
-        {
-            name: 'pushState',
-            description: 'Append an item to an array in state. Params: { statePath: string, value: any, clearStatePath?: string }. Value can contain {"$state":"/path"} refs and "$id" for auto IDs.',
-        },
-        {
-            name: 'removeState',
-            description: 'Remove an item from an array in state by index. Params: { statePath: string, index: number }',
-        },
-        {
-            name: 'validateForm',
-            description: 'Validate all registered form fields and write the result to state. Params: { statePath?: string }. Defaults to /formValidation. Result: { valid: boolean, errors: Record<string, string[]> }.',
-        },
-        {
-            name: 'submitForm',
-            description: "Validate all registered form fields and, only if every one passes, dispatch another action. Params: { action: string, params?: object, statePath?: string }. Writes the same { valid, errors } result as validateForm. Use this on a form's submit button: it is validateForm and the submit in one binding, and the submit is skipped when the form is invalid.",
-        },
-    ],
-    defaultRules: [
-        // Element integrity
-        "CRITICAL INTEGRITY CHECK: Before outputting ANY element that references children, you MUST have already output (or will output) each child as its own element. If an element has children: ['a', 'b'], then elements 'a' and 'b' MUST exist. A missing child element causes that entire branch of the UI to be invisible.",
-        'SELF-CHECK: After generating all elements, mentally walk the tree from root. Every key in every children array must resolve to a defined element. If you find a gap, output the missing element immediately.',
-        'REQUIRED FIELDS: Every element MUST include a "children" array. Leaf elements (text, badges, inputs, images) use an empty array: "children": []. Omitting "children" fails validation.',
-        // Field placement
-        'CRITICAL: The "visible" field goes on the ELEMENT object, NOT inside "props". Correct: {"type":"<ComponentName>","props":{},"visible":{"$state":"/tab","eq":"home"},"children":[...]}.',
-        'CRITICAL: The "on" field goes on the ELEMENT object, NOT inside "props". Use on.press, on.change, on.submit etc. NEVER put action/actionParams inside props.',
-        // State and data
-        'When the user asks for a UI that displays data (e.g. blog posts, products, users), ALWAYS include a state field with realistic sample data. The state field is a top-level field on the spec (sibling of root/elements).',
-        'When building repeating content backed by a state array (e.g. posts, products, items), use the "repeat" field on a container element. Example: { "type": "<ContainerComponent>", "props": {}, "repeat": { "statePath": "/posts", "key": "id" }, "children": ["post-card"] }. For a nested list stored on the enclosing item, use "repeat": { "statePath": { "$item": "comments" }, "key": "id" }. The $item statePath form is valid only inside another repeat. Inside repeated children, use { "$item": "field" } to read a field from the current item, and { "$index": true } for the current array index. For two-way binding to an item field use { "$bindItem": "completed" }. Do NOT hardcode individual elements for each array item.',
-        // Design quality
-        'Design with visual hierarchy: use container components to group content, heading components for section titles, proper spacing, and status indicators. ONLY use components from the AVAILABLE COMPONENTS list.',
-        'For data-rich UIs, use multi-column layout components if available. For forms and single-column content, use vertical layout components. ONLY use components from the AVAILABLE COMPONENTS list.',
-        'Always include realistic, professional-looking sample data. For blogs include 3-4 posts with varied titles, authors, dates, categories. For products include names, prices, images. Never leave data empty.',
-    ],
-});
-
 /*
  * Public API Surface of ngx-json-render
  */
@@ -3816,5 +3772,5 @@ const schema = defineSchema((s) => ({
  * Generated bundle index. Do not edit.
  */
 
-export { CONFIRM_CONTEXT, ELEMENT_KEY, JR_CONFIRM_DIALOG, JR_CONFIRM_LABELS, JrChildren, JrConfirmDialog, JrElement, JrRepeatScope, JsonRenderActionsService, JsonRenderRootContext, JsonRenderStateService, JsonRenderValidationService, JsonRenderer, RENDER_CONTEXT, REPEAT_SCOPE, applyPatch, buildSpecFromParts, checkSpec, createStoreSetState, defineRegistry, flatToTree, formatSpecCheckIssues, getTextFromParts, injectAction, injectActions, injectBoundProp, injectChatUI, injectConfirmContext, injectDevtoolsActive, injectElementKey, injectFieldValidation, injectRenderContext, injectRepeatScope, injectStateBinding, injectStateStore, injectStateValue, injectUIStream, injectValidation, isActionCancelled, jsonRenderMessage, schema };
+export { CONFIRM_CONTEXT, ELEMENT_KEY, JR_CONFIRM_DIALOG, JR_CONFIRM_LABELS, JrChildren, JrConfirmDialog, JrElement, JrRepeatScope, JsonRenderActionsService, JsonRenderRootContext, JsonRenderStateService, JsonRenderValidationService, JsonRenderer, RENDER_CONTEXT, REPEAT_SCOPE, applyPatch, buildSpecFromParts, checkSpec, createStoreSetState, defineRegistry, flatToTree, formatSpecCheckIssues, getTextFromParts, injectAction, injectActions, injectBoundProp, injectChatUI, injectConfirmContext, injectDevtoolsActive, injectElementKey, injectFieldValidation, injectRenderContext, injectRepeatScope, injectStateBinding, injectStateStore, injectStateValue, injectUIStream, injectValidation, isActionCancelled, jsonRenderMessage, ɵregisterStreamObserver };
 //# sourceMappingURL=ngx-json-render.mjs.map