blocks-renderer 0.1.1

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Constructive
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,45 @@
+# blocks-renderer
+
+React adapter for `blocks-schema` UI documents: a recursive
+renderer with layerable widget registries, binding resolution, form state, and
+a visible unknown-block fallback.
+
+## Usage
+
+```tsx
+import { DocumentRenderer, composeRegistry } from 'blocks-renderer';
+
+const registry = composeRegistry(
+  baseRegistry,        // shadcn-style primitives
+  appRegistry,         // app-specific blocks
+  documentOverrides,   // per-document swaps
+);
+
+<DocumentRenderer
+  document={document}
+  registry={registry}
+  scope={{ row, user }}
+  initialValues={{ title: 'Draft' }}
+  onSubmit={(values) => save(values)}
+  onAction={(action, event) => runFlow(action)}
+/>;
+```
+
+## Concepts
+
+- **Registry layering** — `composeRegistry(...layers)` merges
+  `type → component` maps left-to-right, later layers winning. Hosts customize
+  widgets (inputs, textareas, rich text, custom blocks) by layering, never by
+  forking the renderer.
+- **Blocks** — every component receives `{ node, props, children }`, where
+  `props` has the node's `bindings` resolved against the current scope and
+  `children` are already rendered.
+- **Bindings** — `{{ path.to.value }}` templates resolve against
+  `scope + values`; a lone placeholder yields the raw value, mixed text
+  interpolates.
+- **Fields** — widget implementations call `useBlockField(name)` for
+  value/error wiring; constraints from the document (`required`, length,
+  range, `pattern`) validate on change and on submit.
+- **Unknown blocks** — unregistered node types render `UnknownBlock`, a
+  visible gap instead of a crash, so documents can name blocks a host has not
+  installed.

package/dist/index.cjs

@@ -0,0 +1,214 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.ts
+var index_exports = {};
+__export(index_exports, {
+  BlockRenderer: () => BlockRenderer,
+  DocumentRenderer: () => DocumentRenderer,
+  RendererProvider: () => RendererProvider,
+  UnknownBlock: () => UnknownBlock,
+  composeRegistry: () => composeRegistry,
+  readPath: () => readPath,
+  registeredTypes: () => registeredTypes,
+  resolveBinding: () => resolveBinding,
+  resolveBlock: () => resolveBlock,
+  resolveNodeProps: () => resolveNodeProps,
+  useBlockField: () => useBlockField,
+  useRenderer: () => useRenderer
+});
+module.exports = __toCommonJS(index_exports);
+
+// src/bindings.ts
+var TEMPLATE = /\{\{\s*([^}\s]+)\s*\}\}/g;
+function readPath(scope, path) {
+  let current = scope;
+  for (const segment of path.split(".")) {
+    if (current == null || typeof current !== "object") return void 0;
+    current = current[segment];
+  }
+  return current;
+}
+function resolveBinding(expression, scope) {
+  const single = expression.match(/^\{\{\s*([^}\s]+)\s*\}\}$/);
+  if (single) {
+    return readPath(scope, single[1]);
+  }
+  return expression.replace(TEMPLATE, (_match, path) => {
+    const value = readPath(scope, path);
+    return value == null ? "" : String(value);
+  });
+}
+function resolveNodeProps(node, scope) {
+  if (!node.bindings) return node.props ?? {};
+  const resolved = { ...node.props ?? {} };
+  for (const [prop, expression] of Object.entries(node.bindings)) {
+    resolved[prop] = resolveBinding(expression, scope);
+  }
+  return resolved;
+}
+
+// src/context.tsx
+var import_react = require("react");
+var import_jsx_runtime = require("react/jsx-runtime");
+var RendererContext = (0, import_react.createContext)(null);
+function RendererProvider({ children, value }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(RendererContext.Provider, { value, children });
+}
+function useRenderer() {
+  const context = (0, import_react.useContext)(RendererContext);
+  if (!context) {
+    throw new Error("useRenderer must be used within a RendererProvider (or a DocumentRenderer)");
+  }
+  return context;
+}
+function useBlockField(name) {
+  const { values, errors, setValue, setError, mode } = useRenderer();
+  if (!name) {
+    return { value: void 0, error: void 0, setValue: () => {
+    }, setError: () => {
+    }, mode };
+  }
+  return {
+    value: values[name],
+    error: errors[name],
+    setValue: (value) => setValue(name, value),
+    setError: (error) => setError(name, error),
+    mode
+  };
+}
+
+// src/registry.ts
+function composeRegistry(...layers) {
+  const composed = {};
+  for (const layer of layers) {
+    if (!layer) continue;
+    Object.assign(composed, layer);
+  }
+  return composed;
+}
+function resolveBlock(registry, type) {
+  return registry[type];
+}
+function registeredTypes(registry) {
+  return Object.keys(registry).sort();
+}
+
+// src/renderer.tsx
+var import_blocks_schema = require("blocks-schema");
+var import_react2 = require("react");
+
+// src/unknown-block.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+function UnknownBlock({ node }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { "data-block-unknown": node.type, role: "note", children: [
+    "Unknown block: ",
+    node.type
+  ] });
+}
+
+// src/renderer.tsx
+var import_jsx_runtime3 = require("react/jsx-runtime");
+function BlockRenderer({ node }) {
+  const { registry, scope } = useRenderer();
+  const Component = registry[node.type];
+  if (!Component) {
+    return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(UnknownBlock, { node });
+  }
+  const children = node.children?.length ? node.children.map((child) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(BlockRenderer, { node: child }, child.key)) : void 0;
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Component, { node, props: resolveNodeProps(node, scope), children });
+}
+function DocumentRenderer({
+  document,
+  registry,
+  initialValues,
+  scope: externalScope,
+  onSubmit,
+  onChange,
+  onAction,
+  mode = "preview",
+  className
+}) {
+  const defaults = (0, import_react2.useMemo)(() => (0, import_blocks_schema.collectDefaultValues)(document.page), [document]);
+  const constraints = (0, import_react2.useMemo)(() => (0, import_blocks_schema.collectFieldConstraints)(document.page), [document]);
+  const [values, setValues] = (0, import_react2.useState)(() => ({ ...defaults, ...initialValues }));
+  const [errors, setErrors] = (0, import_react2.useState)({});
+  (0, import_react2.useEffect)(() => {
+    setValues((previous) => ({ ...defaults, ...initialValues, ...previous }));
+  }, [defaults, initialValues]);
+  const setError = (0, import_react2.useCallback)((name, error) => {
+    setErrors((previous) => {
+      if (error) return { ...previous, [name]: error };
+      if (!(name in previous)) return previous;
+      const next = { ...previous };
+      delete next[name];
+      return next;
+    });
+  }, []);
+  const setValue = (0, import_react2.useCallback)(
+    (name, value) => {
+      setValues((previous) => {
+        const next = { ...previous, [name]: value };
+        onChange?.(next);
+        return next;
+      });
+      const field = constraints[name];
+      if (field) {
+        setError(name, (0, import_blocks_schema.validateField)(value, field.constraints, field.required));
+      }
+    },
+    [onChange, constraints, setError]
+  );
+  const handleAction = (0, import_react2.useCallback)(
+    (action, event) => {
+      if (event === "submit" && onSubmit) {
+        const failures = {};
+        for (const name of (0, import_blocks_schema.collectFieldNames)(document.page)) {
+          const field = constraints[name];
+          if (!field) continue;
+          const error = (0, import_blocks_schema.validateField)(values[name], field.constraints, field.required);
+          if (error) failures[name] = error;
+        }
+        if (Object.keys(failures).length > 0) {
+          setErrors(failures);
+          return;
+        }
+        onSubmit(values);
+      }
+      onAction?.(action, event);
+    },
+    [onSubmit, onAction, values, document.page, constraints]
+  );
+  const contextValue = (0, import_react2.useMemo)(
+    () => ({
+      document,
+      registry,
+      mode,
+      values,
+      errors,
+      setValue,
+      setError,
+      scope: { ...externalScope, values, ...values },
+      onAction: handleAction
+    }),
+    [document, registry, mode, values, errors, setValue, setError, externalScope, handleAction]
+  );
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(RendererProvider, { value: contextValue, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(BlockRenderer, { node: document.page }) }) });
+}
+//# sourceMappingURL=index.cjs.map

package/dist/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/index.ts","../src/bindings.ts","../src/context.tsx","../src/registry.ts","../src/renderer.tsx","../src/unknown-block.tsx"],"sourcesContent":["export { readPath, resolveBinding, resolveNodeProps } from './bindings';\nexport { RendererProvider, useBlockField, useRenderer } from './context';\nexport { composeRegistry, registeredTypes, resolveBlock } from './registry';\nexport { BlockRenderer, DocumentRenderer } from './renderer';\nexport type { DocumentRendererProps } from './renderer';\nexport { UnknownBlock } from './unknown-block';\nexport type { BlockComponent, BlockProps, BlockRegistry, RenderMode, RendererContextValue } from './types';\n","import type { UINode, UINodeProps } from 'blocks-schema';\n\nconst TEMPLATE = /\\{\\{\\s*([^}\\s]+)\\s*\\}\\}/g;\n\n/** Read a dotted path (`row.author.name`) out of a scope object. */\nexport function readPath(scope: Record<string, unknown>, path: string): unknown {\n\tlet current: unknown = scope;\n\tfor (const segment of path.split('.')) {\n\t\tif (current == null || typeof current !== 'object') return undefined;\n\t\tcurrent = (current as Record<string, unknown>)[segment];\n\t}\n\treturn current;\n}\n\n/**\n * Resolve a binding expression. A template that is exactly one placeholder\n * yields the raw value (so a boolean or an object survives); a template mixed\n * with text is interpolated as a string.\n */\nexport function resolveBinding(expression: string, scope: Record<string, unknown>): unknown {\n\tconst single = expression.match(/^\\{\\{\\s*([^}\\s]+)\\s*\\}\\}$/);\n\tif (single) {\n\t\treturn readPath(scope, single[1]);\n\t}\n\n\treturn expression.replace(TEMPLATE, (_match, path: string) => {\n\t\tconst value = readPath(scope, path);\n\t\treturn value == null ? '' : String(value);\n\t});\n}\n\n/** Apply a node's `bindings` over its static props. */\nexport function resolveNodeProps(node: UINode, scope: Record<string, unknown>): UINodeProps {\n\tif (!node.bindings) return node.props ?? {};\n\n\tconst resolved: UINodeProps = { ...(node.props ?? {}) };\n\tfor (const [prop, expression] of Object.entries(node.bindings)) {\n\t\tresolved[prop] = resolveBinding(expression, scope);\n\t}\n\treturn resolved;\n}\n","'use client';\n\nimport { createContext, useContext } from 'react';\nimport type { ReactNode } from 'react';\n\nimport type { RendererContextValue } from './types';\n\nconst RendererContext = createContext<RendererContextValue | null>(null);\n\nexport function RendererProvider({ children, value }: { children: ReactNode; value: RendererContextValue }) {\n\treturn <RendererContext.Provider value={value}>{children}</RendererContext.Provider>;\n}\n\nexport function useRenderer(): RendererContextValue {\n\tconst context = useContext(RendererContext);\n\tif (!context) {\n\t\tthrow new Error('useRenderer must be used within a RendererProvider (or a DocumentRenderer)');\n\t}\n\treturn context;\n}\n\n/**\n * Resolved props plus the value/error wiring for a field node. Widget\n * implementations use this instead of reaching into the document themselves.\n */\nexport function useBlockField(name: string | undefined) {\n\tconst { values, errors, setValue, setError, mode } = useRenderer();\n\tif (!name) {\n\t\treturn { value: undefined, error: undefined, setValue: () => {}, setError: () => {}, mode };\n\t}\n\treturn {\n\t\tvalue: values[name],\n\t\terror: errors[name],\n\t\tsetValue: (value: unknown) => setValue(name, value),\n\t\tsetError: (error: string | null) => setError(name, error),\n\t\tmode,\n\t};\n}\n","import type { BlockComponent, BlockRegistry } from './types';\n\n/**\n * Layer registries left-to-right, later layers winning. This is how a host\n * customizes rendering: base primitives, then an app registry, then per-document\n * overrides — no forking of the renderer, and no single global map.\n */\nexport function composeRegistry(...layers: (BlockRegistry | undefined)[]): BlockRegistry {\n\tconst composed: BlockRegistry = {};\n\tfor (const layer of layers) {\n\t\tif (!layer) continue;\n\t\tObject.assign(composed, layer);\n\t}\n\treturn composed;\n}\n\nexport function resolveBlock(registry: BlockRegistry, type: string): BlockComponent | undefined {\n\treturn registry[type];\n}\n\n/** Node types the registry can render, sorted for stable output. */\nexport function registeredTypes(registry: BlockRegistry): string[] {\n\treturn Object.keys(registry).sort();\n}\n","'use client';\n\nimport {\n\tcollectDefaultValues,\n\tcollectFieldConstraints,\n\tcollectFieldNames,\n\tvalidateField,\n\ttype UIAction,\n\ttype UIDocument,\n\ttype UINode,\n} from 'blocks-schema';\nimport { useCallback, useEffect, useMemo, useState } from 'react';\n\nimport { resolveNodeProps } from './bindings';\nimport { RendererProvider, useRenderer } from './context';\nimport { UnknownBlock } from './unknown-block';\nimport type { BlockRegistry, RenderMode, RendererContextValue } from './types';\n\n/**\n * Renders one node and, recursively, its children: resolve the node type in the\n * registry, resolve bindings against the current scope, render children first,\n * fall back to {@link UnknownBlock}.\n */\nexport function BlockRenderer({ node }: { node: UINode }) {\n\tconst { registry, scope } = useRenderer();\n\tconst Component = registry[node.type];\n\n\tif (!Component) {\n\t\treturn <UnknownBlock node={node} />;\n\t}\n\n\tconst children = node.children?.length\n\t\t? node.children.map((child) => <BlockRenderer key={child.key} node={child} />)\n\t\t: undefined;\n\n\treturn (\n\t\t<Component node={node} props={resolveNodeProps(node, scope)}>\n\t\t\t{children}\n\t\t</Component>\n\t);\n}\n\nexport interface DocumentRendererProps {\n\tdocument: UIDocument;\n\tregistry: BlockRegistry;\n\tinitialValues?: Record<string, unknown>;\n\t/** Extra data for binding expressions, e.g. `{ row, user, params }`. */\n\tscope?: Record<string, unknown>;\n\tonSubmit?: (values: Record<string, unknown>) => void;\n\tonChange?: (values: Record<string, unknown>) => void;\n\tonAction?: (action: UIAction, event: string) => void;\n\tmode?: RenderMode;\n\tclassName?: string;\n}\n\nexport function DocumentRenderer({\n\tdocument,\n\tregistry,\n\tinitialValues,\n\tscope: externalScope,\n\tonSubmit,\n\tonChange,\n\tonAction,\n\tmode = 'preview',\n\tclassName,\n}: DocumentRendererProps) {\n\tconst defaults = useMemo(() => collectDefaultValues(document.page), [document]);\n\tconst constraints = useMemo(() => collectFieldConstraints(document.page), [document]);\n\n\tconst [values, setValues] = useState<Record<string, unknown>>(() => ({ ...defaults, ...initialValues }));\n\tconst [errors, setErrors] = useState<Record<string, string>>({});\n\n\tuseEffect(() => {\n\t\tsetValues((previous) => ({ ...defaults, ...initialValues, ...previous }));\n\t}, [defaults, initialValues]);\n\n\tconst setError = useCallback((name: string, error: string | null) => {\n\t\tsetErrors((previous) => {\n\t\t\tif (error) return { ...previous, [name]: error };\n\t\t\tif (!(name in previous)) return previous;\n\t\t\tconst next = { ...previous };\n\t\t\tdelete next[name];\n\t\t\treturn next;\n\t\t});\n\t}, []);\n\n\tconst setValue = useCallback(\n\t\t(name: string, value: unknown) => {\n\t\t\tsetValues((previous) => {\n\t\t\t\tconst next = { ...previous, [name]: value };\n\t\t\t\tonChange?.(next);\n\t\t\t\treturn next;\n\t\t\t});\n\n\t\t\tconst field = constraints[name];\n\t\t\tif (field) {\n\t\t\t\tsetError(name, validateField(value, field.constraints, field.required));\n\t\t\t}\n\t\t},\n\t\t[onChange, constraints, setError],\n\t);\n\n\tconst handleAction = useCallback(\n\t\t(action: UIAction, event: string) => {\n\t\t\tif (event === 'submit' && onSubmit) {\n\t\t\t\tconst failures: Record<string, string> = {};\n\t\t\t\tfor (const name of collectFieldNames(document.page)) {\n\t\t\t\t\tconst field = constraints[name];\n\t\t\t\t\tif (!field) continue;\n\t\t\t\t\tconst error = validateField(values[name], field.constraints, field.required);\n\t\t\t\t\tif (error) failures[name] = error;\n\t\t\t\t}\n\n\t\t\t\tif (Object.keys(failures).length > 0) {\n\t\t\t\t\tsetErrors(failures);\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tonSubmit(values);\n\t\t\t}\n\n\t\t\tonAction?.(action, event);\n\t\t},\n\t\t[onSubmit, onAction, values, document.page, constraints],\n\t);\n\n\tconst contextValue: RendererContextValue = useMemo(\n\t\t() => ({\n\t\t\tdocument,\n\t\t\tregistry,\n\t\t\tmode,\n\t\t\tvalues,\n\t\t\terrors,\n\t\t\tsetValue,\n\t\t\tsetError,\n\t\t\tscope: { ...externalScope, values, ...values },\n\t\t\tonAction: handleAction,\n\t\t}),\n\t\t[document, registry, mode, values, errors, setValue, setError, externalScope, handleAction],\n\t);\n\n\treturn (\n\t\t<RendererProvider value={contextValue}>\n\t\t\t<div className={className}>\n\t\t\t\t<BlockRenderer node={document.page} />\n\t\t\t</div>\n\t\t</RendererProvider>\n\t);\n}\n","'use client';\n\nimport type { UINode } from 'blocks-schema';\n\n/**\n * Rendered when no registry layer satisfies a node type. A document may name\n * blocks a given host has not installed, so an unknown type is a visible gap,\n * never a thrown render.\n */\nexport function UnknownBlock({ node }: { node: UINode }) {\n\treturn (\n\t\t<div data-block-unknown={node.type} role=\"note\">\n\t\t\tUnknown block: {node.type}\n\t\t</div>\n\t);\n}\n"],"mappings":"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","names":["import_react","import_jsx_runtime","import_jsx_runtime"]}

package/dist/index.d.cts

@@ -0,0 +1,106 @@
+import { UINode, UINodeProps, UIDocument, UIAction } from 'blocks-schema';
+import * as react from 'react';
+import { ComponentType, ReactNode } from 'react';
+
+/** Read a dotted path (`row.author.name`) out of a scope object. */
+declare function readPath(scope: Record<string, unknown>, path: string): unknown;
+/**
+ * Resolve a binding expression. A template that is exactly one placeholder
+ * yields the raw value (so a boolean or an object survives); a template mixed
+ * with text is interpolated as a string.
+ */
+declare function resolveBinding(expression: string, scope: Record<string, unknown>): unknown;
+/** Apply a node's `bindings` over its static props. */
+declare function resolveNodeProps(node: UINode, scope: Record<string, unknown>): UINodeProps;
+
+type RenderMode = 'preview' | 'edit';
+/**
+ * Props every block component receives. Children are already rendered, and
+ * `props` has the node's bindings resolved against the current scope.
+ */
+interface BlockProps {
+    node: UINode;
+    props: UINodeProps;
+    children?: ReactNode;
+}
+type BlockComponent = ComponentType<BlockProps>;
+/** Node type → component. Layered by {@link composeRegistry}. */
+type BlockRegistry = Record<string, BlockComponent>;
+interface RendererContextValue {
+    document: UIDocument;
+    registry: BlockRegistry;
+    mode: RenderMode;
+    values: Record<string, unknown>;
+    errors: Record<string, string>;
+    setValue: (name: string, value: unknown) => void;
+    setError: (name: string, error: string | null) => void;
+    /** Scope for binding expressions (`{{ row.title }}`), merged with `values`. */
+    scope: Record<string, unknown>;
+    onAction?: (action: UIAction, event: string) => void;
+}
+
+declare function RendererProvider({ children, value }: {
+    children: ReactNode;
+    value: RendererContextValue;
+}): react.JSX.Element;
+declare function useRenderer(): RendererContextValue;
+/**
+ * Resolved props plus the value/error wiring for a field node. Widget
+ * implementations use this instead of reaching into the document themselves.
+ */
+declare function useBlockField(name: string | undefined): {
+    value: undefined;
+    error: undefined;
+    setValue: () => void;
+    setError: () => void;
+    mode: RenderMode;
+} | {
+    value: unknown;
+    error: string;
+    setValue: (value: unknown) => void;
+    setError: (error: string | null) => void;
+    mode: RenderMode;
+};
+
+/**
+ * Layer registries left-to-right, later layers winning. This is how a host
+ * customizes rendering: base primitives, then an app registry, then per-document
+ * overrides — no forking of the renderer, and no single global map.
+ */
+declare function composeRegistry(...layers: (BlockRegistry | undefined)[]): BlockRegistry;
+declare function resolveBlock(registry: BlockRegistry, type: string): BlockComponent | undefined;
+/** Node types the registry can render, sorted for stable output. */
+declare function registeredTypes(registry: BlockRegistry): string[];
+
+/**
+ * Renders one node and, recursively, its children: resolve the node type in the
+ * registry, resolve bindings against the current scope, render children first,
+ * fall back to {@link UnknownBlock}.
+ */
+declare function BlockRenderer({ node }: {
+    node: UINode;
+}): react.JSX.Element;
+interface DocumentRendererProps {
+    document: UIDocument;
+    registry: BlockRegistry;
+    initialValues?: Record<string, unknown>;
+    /** Extra data for binding expressions, e.g. `{ row, user, params }`. */
+    scope?: Record<string, unknown>;
+    onSubmit?: (values: Record<string, unknown>) => void;
+    onChange?: (values: Record<string, unknown>) => void;
+    onAction?: (action: UIAction, event: string) => void;
+    mode?: RenderMode;
+    className?: string;
+}
+declare function DocumentRenderer({ document, registry, initialValues, scope: externalScope, onSubmit, onChange, onAction, mode, className, }: DocumentRendererProps): react.JSX.Element;
+
+/**
+ * Rendered when no registry layer satisfies a node type. A document may name
+ * blocks a given host has not installed, so an unknown type is a visible gap,
+ * never a thrown render.
+ */
+declare function UnknownBlock({ node }: {
+    node: UINode;
+}): react.JSX.Element;
+
+export { type BlockComponent, type BlockProps, type BlockRegistry, BlockRenderer, DocumentRenderer, type DocumentRendererProps, type RenderMode, type RendererContextValue, RendererProvider, UnknownBlock, composeRegistry, readPath, registeredTypes, resolveBinding, resolveBlock, resolveNodeProps, useBlockField, useRenderer };

package/dist/index.d.ts

@@ -0,0 +1,106 @@
+import { UINode, UINodeProps, UIDocument, UIAction } from 'blocks-schema';
+import * as react from 'react';
+import { ComponentType, ReactNode } from 'react';
+
+/** Read a dotted path (`row.author.name`) out of a scope object. */
+declare function readPath(scope: Record<string, unknown>, path: string): unknown;
+/**
+ * Resolve a binding expression. A template that is exactly one placeholder
+ * yields the raw value (so a boolean or an object survives); a template mixed
+ * with text is interpolated as a string.
+ */
+declare function resolveBinding(expression: string, scope: Record<string, unknown>): unknown;
+/** Apply a node's `bindings` over its static props. */
+declare function resolveNodeProps(node: UINode, scope: Record<string, unknown>): UINodeProps;
+
+type RenderMode = 'preview' | 'edit';
+/**
+ * Props every block component receives. Children are already rendered, and
+ * `props` has the node's bindings resolved against the current scope.
+ */
+interface BlockProps {
+    node: UINode;
+    props: UINodeProps;
+    children?: ReactNode;
+}
+type BlockComponent = ComponentType<BlockProps>;
+/** Node type → component. Layered by {@link composeRegistry}. */
+type BlockRegistry = Record<string, BlockComponent>;
+interface RendererContextValue {
+    document: UIDocument;
+    registry: BlockRegistry;
+    mode: RenderMode;
+    values: Record<string, unknown>;
+    errors: Record<string, string>;
+    setValue: (name: string, value: unknown) => void;
+    setError: (name: string, error: string | null) => void;
+    /** Scope for binding expressions (`{{ row.title }}`), merged with `values`. */
+    scope: Record<string, unknown>;
+    onAction?: (action: UIAction, event: string) => void;
+}
+
+declare function RendererProvider({ children, value }: {
+    children: ReactNode;
+    value: RendererContextValue;
+}): react.JSX.Element;
+declare function useRenderer(): RendererContextValue;
+/**
+ * Resolved props plus the value/error wiring for a field node. Widget
+ * implementations use this instead of reaching into the document themselves.
+ */
+declare function useBlockField(name: string | undefined): {
+    value: undefined;
+    error: undefined;
+    setValue: () => void;
+    setError: () => void;
+    mode: RenderMode;
+} | {
+    value: unknown;
+    error: string;
+    setValue: (value: unknown) => void;
+    setError: (error: string | null) => void;
+    mode: RenderMode;
+};
+
+/**
+ * Layer registries left-to-right, later layers winning. This is how a host
+ * customizes rendering: base primitives, then an app registry, then per-document
+ * overrides — no forking of the renderer, and no single global map.
+ */
+declare function composeRegistry(...layers: (BlockRegistry | undefined)[]): BlockRegistry;
+declare function resolveBlock(registry: BlockRegistry, type: string): BlockComponent | undefined;
+/** Node types the registry can render, sorted for stable output. */
+declare function registeredTypes(registry: BlockRegistry): string[];
+
+/**
+ * Renders one node and, recursively, its children: resolve the node type in the
+ * registry, resolve bindings against the current scope, render children first,
+ * fall back to {@link UnknownBlock}.
+ */
+declare function BlockRenderer({ node }: {
+    node: UINode;
+}): react.JSX.Element;
+interface DocumentRendererProps {
+    document: UIDocument;
+    registry: BlockRegistry;
+    initialValues?: Record<string, unknown>;
+    /** Extra data for binding expressions, e.g. `{ row, user, params }`. */
+    scope?: Record<string, unknown>;
+    onSubmit?: (values: Record<string, unknown>) => void;
+    onChange?: (values: Record<string, unknown>) => void;
+    onAction?: (action: UIAction, event: string) => void;
+    mode?: RenderMode;
+    className?: string;
+}
+declare function DocumentRenderer({ document, registry, initialValues, scope: externalScope, onSubmit, onChange, onAction, mode, className, }: DocumentRendererProps): react.JSX.Element;
+
+/**
+ * Rendered when no registry layer satisfies a node type. A document may name
+ * blocks a given host has not installed, so an unknown type is a visible gap,
+ * never a thrown render.
+ */
+declare function UnknownBlock({ node }: {
+    node: UINode;
+}): react.JSX.Element;
+
+export { type BlockComponent, type BlockProps, type BlockRegistry, BlockRenderer, DocumentRenderer, type DocumentRendererProps, type RenderMode, type RendererContextValue, RendererProvider, UnknownBlock, composeRegistry, readPath, registeredTypes, resolveBinding, resolveBlock, resolveNodeProps, useBlockField, useRenderer };

package/dist/index.js

@@ -0,0 +1,196 @@
+// src/bindings.ts
+var TEMPLATE = /\{\{\s*([^}\s]+)\s*\}\}/g;
+function readPath(scope, path) {
+  let current = scope;
+  for (const segment of path.split(".")) {
+    if (current == null || typeof current !== "object") return void 0;
+    current = current[segment];
+  }
+  return current;
+}
+function resolveBinding(expression, scope) {
+  const single = expression.match(/^\{\{\s*([^}\s]+)\s*\}\}$/);
+  if (single) {
+    return readPath(scope, single[1]);
+  }
+  return expression.replace(TEMPLATE, (_match, path) => {
+    const value = readPath(scope, path);
+    return value == null ? "" : String(value);
+  });
+}
+function resolveNodeProps(node, scope) {
+  if (!node.bindings) return node.props ?? {};
+  const resolved = { ...node.props ?? {} };
+  for (const [prop, expression] of Object.entries(node.bindings)) {
+    resolved[prop] = resolveBinding(expression, scope);
+  }
+  return resolved;
+}
+
+// src/context.tsx
+import { createContext, useContext } from "react";
+import { jsx } from "react/jsx-runtime";
+var RendererContext = createContext(null);
+function RendererProvider({ children, value }) {
+  return /* @__PURE__ */ jsx(RendererContext.Provider, { value, children });
+}
+function useRenderer() {
+  const context = useContext(RendererContext);
+  if (!context) {
+    throw new Error("useRenderer must be used within a RendererProvider (or a DocumentRenderer)");
+  }
+  return context;
+}
+function useBlockField(name) {
+  const { values, errors, setValue, setError, mode } = useRenderer();
+  if (!name) {
+    return { value: void 0, error: void 0, setValue: () => {
+    }, setError: () => {
+    }, mode };
+  }
+  return {
+    value: values[name],
+    error: errors[name],
+    setValue: (value) => setValue(name, value),
+    setError: (error) => setError(name, error),
+    mode
+  };
+}
+
+// src/registry.ts
+function composeRegistry(...layers) {
+  const composed = {};
+  for (const layer of layers) {
+    if (!layer) continue;
+    Object.assign(composed, layer);
+  }
+  return composed;
+}
+function resolveBlock(registry, type) {
+  return registry[type];
+}
+function registeredTypes(registry) {
+  return Object.keys(registry).sort();
+}
+
+// src/renderer.tsx
+import {
+  collectDefaultValues,
+  collectFieldConstraints,
+  collectFieldNames,
+  validateField
+} from "blocks-schema";
+import { useCallback, useEffect, useMemo, useState } from "react";
+
+// src/unknown-block.tsx
+import { jsxs } from "react/jsx-runtime";
+function UnknownBlock({ node }) {
+  return /* @__PURE__ */ jsxs("div", { "data-block-unknown": node.type, role: "note", children: [
+    "Unknown block: ",
+    node.type
+  ] });
+}
+
+// src/renderer.tsx
+import { jsx as jsx2 } from "react/jsx-runtime";
+function BlockRenderer({ node }) {
+  const { registry, scope } = useRenderer();
+  const Component = registry[node.type];
+  if (!Component) {
+    return /* @__PURE__ */ jsx2(UnknownBlock, { node });
+  }
+  const children = node.children?.length ? node.children.map((child) => /* @__PURE__ */ jsx2(BlockRenderer, { node: child }, child.key)) : void 0;
+  return /* @__PURE__ */ jsx2(Component, { node, props: resolveNodeProps(node, scope), children });
+}
+function DocumentRenderer({
+  document,
+  registry,
+  initialValues,
+  scope: externalScope,
+  onSubmit,
+  onChange,
+  onAction,
+  mode = "preview",
+  className
+}) {
+  const defaults = useMemo(() => collectDefaultValues(document.page), [document]);
+  const constraints = useMemo(() => collectFieldConstraints(document.page), [document]);
+  const [values, setValues] = useState(() => ({ ...defaults, ...initialValues }));
+  const [errors, setErrors] = useState({});
+  useEffect(() => {
+    setValues((previous) => ({ ...defaults, ...initialValues, ...previous }));
+  }, [defaults, initialValues]);
+  const setError = useCallback((name, error) => {
+    setErrors((previous) => {
+      if (error) return { ...previous, [name]: error };
+      if (!(name in previous)) return previous;
+      const next = { ...previous };
+      delete next[name];
+      return next;
+    });
+  }, []);
+  const setValue = useCallback(
+    (name, value) => {
+      setValues((previous) => {
+        const next = { ...previous, [name]: value };
+        onChange?.(next);
+        return next;
+      });
+      const field = constraints[name];
+      if (field) {
+        setError(name, validateField(value, field.constraints, field.required));
+      }
+    },
+    [onChange, constraints, setError]
+  );
+  const handleAction = useCallback(
+    (action, event) => {
+      if (event === "submit" && onSubmit) {
+        const failures = {};
+        for (const name of collectFieldNames(document.page)) {
+          const field = constraints[name];
+          if (!field) continue;
+          const error = validateField(values[name], field.constraints, field.required);
+          if (error) failures[name] = error;
+        }
+        if (Object.keys(failures).length > 0) {
+          setErrors(failures);
+          return;
+        }
+        onSubmit(values);
+      }
+      onAction?.(action, event);
+    },
+    [onSubmit, onAction, values, document.page, constraints]
+  );
+  const contextValue = useMemo(
+    () => ({
+      document,
+      registry,
+      mode,
+      values,
+      errors,
+      setValue,
+      setError,
+      scope: { ...externalScope, values, ...values },
+      onAction: handleAction
+    }),
+    [document, registry, mode, values, errors, setValue, setError, externalScope, handleAction]
+  );
+  return /* @__PURE__ */ jsx2(RendererProvider, { value: contextValue, children: /* @__PURE__ */ jsx2("div", { className, children: /* @__PURE__ */ jsx2(BlockRenderer, { node: document.page }) }) });
+}
+export {
+  BlockRenderer,
+  DocumentRenderer,
+  RendererProvider,
+  UnknownBlock,
+  composeRegistry,
+  readPath,
+  registeredTypes,
+  resolveBinding,
+  resolveBlock,
+  resolveNodeProps,
+  useBlockField,
+  useRenderer
+};
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/bindings.ts","../src/context.tsx","../src/registry.ts","../src/renderer.tsx","../src/unknown-block.tsx"],"sourcesContent":["import type { UINode, UINodeProps } from 'blocks-schema';\n\nconst TEMPLATE = /\\{\\{\\s*([^}\\s]+)\\s*\\}\\}/g;\n\n/** Read a dotted path (`row.author.name`) out of a scope object. */\nexport function readPath(scope: Record<string, unknown>, path: string): unknown {\n\tlet current: unknown = scope;\n\tfor (const segment of path.split('.')) {\n\t\tif (current == null || typeof current !== 'object') return undefined;\n\t\tcurrent = (current as Record<string, unknown>)[segment];\n\t}\n\treturn current;\n}\n\n/**\n * Resolve a binding expression. A template that is exactly one placeholder\n * yields the raw value (so a boolean or an object survives); a template mixed\n * with text is interpolated as a string.\n */\nexport function resolveBinding(expression: string, scope: Record<string, unknown>): unknown {\n\tconst single = expression.match(/^\\{\\{\\s*([^}\\s]+)\\s*\\}\\}$/);\n\tif (single) {\n\t\treturn readPath(scope, single[1]);\n\t}\n\n\treturn expression.replace(TEMPLATE, (_match, path: string) => {\n\t\tconst value = readPath(scope, path);\n\t\treturn value == null ? '' : String(value);\n\t});\n}\n\n/** Apply a node's `bindings` over its static props. */\nexport function resolveNodeProps(node: UINode, scope: Record<string, unknown>): UINodeProps {\n\tif (!node.bindings) return node.props ?? {};\n\n\tconst resolved: UINodeProps = { ...(node.props ?? {}) };\n\tfor (const [prop, expression] of Object.entries(node.bindings)) {\n\t\tresolved[prop] = resolveBinding(expression, scope);\n\t}\n\treturn resolved;\n}\n","'use client';\n\nimport { createContext, useContext } from 'react';\nimport type { ReactNode } from 'react';\n\nimport type { RendererContextValue } from './types';\n\nconst RendererContext = createContext<RendererContextValue | null>(null);\n\nexport function RendererProvider({ children, value }: { children: ReactNode; value: RendererContextValue }) {\n\treturn <RendererContext.Provider value={value}>{children}</RendererContext.Provider>;\n}\n\nexport function useRenderer(): RendererContextValue {\n\tconst context = useContext(RendererContext);\n\tif (!context) {\n\t\tthrow new Error('useRenderer must be used within a RendererProvider (or a DocumentRenderer)');\n\t}\n\treturn context;\n}\n\n/**\n * Resolved props plus the value/error wiring for a field node. Widget\n * implementations use this instead of reaching into the document themselves.\n */\nexport function useBlockField(name: string | undefined) {\n\tconst { values, errors, setValue, setError, mode } = useRenderer();\n\tif (!name) {\n\t\treturn { value: undefined, error: undefined, setValue: () => {}, setError: () => {}, mode };\n\t}\n\treturn {\n\t\tvalue: values[name],\n\t\terror: errors[name],\n\t\tsetValue: (value: unknown) => setValue(name, value),\n\t\tsetError: (error: string | null) => setError(name, error),\n\t\tmode,\n\t};\n}\n","import type { BlockComponent, BlockRegistry } from './types';\n\n/**\n * Layer registries left-to-right, later layers winning. This is how a host\n * customizes rendering: base primitives, then an app registry, then per-document\n * overrides — no forking of the renderer, and no single global map.\n */\nexport function composeRegistry(...layers: (BlockRegistry | undefined)[]): BlockRegistry {\n\tconst composed: BlockRegistry = {};\n\tfor (const layer of layers) {\n\t\tif (!layer) continue;\n\t\tObject.assign(composed, layer);\n\t}\n\treturn composed;\n}\n\nexport function resolveBlock(registry: BlockRegistry, type: string): BlockComponent | undefined {\n\treturn registry[type];\n}\n\n/** Node types the registry can render, sorted for stable output. */\nexport function registeredTypes(registry: BlockRegistry): string[] {\n\treturn Object.keys(registry).sort();\n}\n","'use client';\n\nimport {\n\tcollectDefaultValues,\n\tcollectFieldConstraints,\n\tcollectFieldNames,\n\tvalidateField,\n\ttype UIAction,\n\ttype UIDocument,\n\ttype UINode,\n} from 'blocks-schema';\nimport { useCallback, useEffect, useMemo, useState } from 'react';\n\nimport { resolveNodeProps } from './bindings';\nimport { RendererProvider, useRenderer } from './context';\nimport { UnknownBlock } from './unknown-block';\nimport type { BlockRegistry, RenderMode, RendererContextValue } from './types';\n\n/**\n * Renders one node and, recursively, its children: resolve the node type in the\n * registry, resolve bindings against the current scope, render children first,\n * fall back to {@link UnknownBlock}.\n */\nexport function BlockRenderer({ node }: { node: UINode }) {\n\tconst { registry, scope } = useRenderer();\n\tconst Component = registry[node.type];\n\n\tif (!Component) {\n\t\treturn <UnknownBlock node={node} />;\n\t}\n\n\tconst children = node.children?.length\n\t\t? node.children.map((child) => <BlockRenderer key={child.key} node={child} />)\n\t\t: undefined;\n\n\treturn (\n\t\t<Component node={node} props={resolveNodeProps(node, scope)}>\n\t\t\t{children}\n\t\t</Component>\n\t);\n}\n\nexport interface DocumentRendererProps {\n\tdocument: UIDocument;\n\tregistry: BlockRegistry;\n\tinitialValues?: Record<string, unknown>;\n\t/** Extra data for binding expressions, e.g. `{ row, user, params }`. */\n\tscope?: Record<string, unknown>;\n\tonSubmit?: (values: Record<string, unknown>) => void;\n\tonChange?: (values: Record<string, unknown>) => void;\n\tonAction?: (action: UIAction, event: string) => void;\n\tmode?: RenderMode;\n\tclassName?: string;\n}\n\nexport function DocumentRenderer({\n\tdocument,\n\tregistry,\n\tinitialValues,\n\tscope: externalScope,\n\tonSubmit,\n\tonChange,\n\tonAction,\n\tmode = 'preview',\n\tclassName,\n}: DocumentRendererProps) {\n\tconst defaults = useMemo(() => collectDefaultValues(document.page), [document]);\n\tconst constraints = useMemo(() => collectFieldConstraints(document.page), [document]);\n\n\tconst [values, setValues] = useState<Record<string, unknown>>(() => ({ ...defaults, ...initialValues }));\n\tconst [errors, setErrors] = useState<Record<string, string>>({});\n\n\tuseEffect(() => {\n\t\tsetValues((previous) => ({ ...defaults, ...initialValues, ...previous }));\n\t}, [defaults, initialValues]);\n\n\tconst setError = useCallback((name: string, error: string | null) => {\n\t\tsetErrors((previous) => {\n\t\t\tif (error) return { ...previous, [name]: error };\n\t\t\tif (!(name in previous)) return previous;\n\t\t\tconst next = { ...previous };\n\t\t\tdelete next[name];\n\t\t\treturn next;\n\t\t});\n\t}, []);\n\n\tconst setValue = useCallback(\n\t\t(name: string, value: unknown) => {\n\t\t\tsetValues((previous) => {\n\t\t\t\tconst next = { ...previous, [name]: value };\n\t\t\t\tonChange?.(next);\n\t\t\t\treturn next;\n\t\t\t});\n\n\t\t\tconst field = constraints[name];\n\t\t\tif (field) {\n\t\t\t\tsetError(name, validateField(value, field.constraints, field.required));\n\t\t\t}\n\t\t},\n\t\t[onChange, constraints, setError],\n\t);\n\n\tconst handleAction = useCallback(\n\t\t(action: UIAction, event: string) => {\n\t\t\tif (event === 'submit' && onSubmit) {\n\t\t\t\tconst failures: Record<string, string> = {};\n\t\t\t\tfor (const name of collectFieldNames(document.page)) {\n\t\t\t\t\tconst field = constraints[name];\n\t\t\t\t\tif (!field) continue;\n\t\t\t\t\tconst error = validateField(values[name], field.constraints, field.required);\n\t\t\t\t\tif (error) failures[name] = error;\n\t\t\t\t}\n\n\t\t\t\tif (Object.keys(failures).length > 0) {\n\t\t\t\t\tsetErrors(failures);\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tonSubmit(values);\n\t\t\t}\n\n\t\t\tonAction?.(action, event);\n\t\t},\n\t\t[onSubmit, onAction, values, document.page, constraints],\n\t);\n\n\tconst contextValue: RendererContextValue = useMemo(\n\t\t() => ({\n\t\t\tdocument,\n\t\t\tregistry,\n\t\t\tmode,\n\t\t\tvalues,\n\t\t\terrors,\n\t\t\tsetValue,\n\t\t\tsetError,\n\t\t\tscope: { ...externalScope, values, ...values },\n\t\t\tonAction: handleAction,\n\t\t}),\n\t\t[document, registry, mode, values, errors, setValue, setError, externalScope, handleAction],\n\t);\n\n\treturn (\n\t\t<RendererProvider value={contextValue}>\n\t\t\t<div className={className}>\n\t\t\t\t<BlockRenderer node={document.page} />\n\t\t\t</div>\n\t\t</RendererProvider>\n\t);\n}\n","'use client';\n\nimport type { UINode } from 'blocks-schema';\n\n/**\n * Rendered when no registry layer satisfies a node type. A document may name\n * blocks a given host has not installed, so an unknown type is a visible gap,\n * never a thrown render.\n */\nexport function UnknownBlock({ node }: { node: UINode }) {\n\treturn (\n\t\t<div data-block-unknown={node.type} role=\"note\">\n\t\t\tUnknown block: {node.type}\n\t\t</div>\n\t);\n}\n"],"mappings":"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","names":["jsx"]}

package/package.json

@@ -0,0 +1,69 @@
+{
+  "name": "blocks-renderer",
+  "version": "0.1.1",
+  "description": "Recursive React renderer for Constructive Blocks JSON UI documents, with layerable widget registries",
+  "private": false,
+  "license": "MIT",
+  "homepage": "https://constructive-io.github.io/blocks/",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/constructive-io/blocks.git",
+    "directory": "packages/blocks-renderer"
+  },
+  "bugs": {
+    "url": "https://github.com/constructive-io/blocks/issues"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "type": "module",
+  "sideEffects": false,
+  "exports": {
+    ".": {
+      "import": {
+        "types": "./dist/index.d.ts",
+        "default": "./dist/index.js"
+      },
+      "require": {
+        "types": "./dist/index.d.cts",
+        "default": "./dist/index.cjs"
+      }
+    },
+    "./package.json": "./package.json"
+  },
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "files": [
+    "dist",
+    "LICENSE",
+    "README.md"
+  ],
+  "scripts": {
+    "build": "tsup",
+    "dev": "tsup --watch",
+    "lint:types": "tsc --noEmit",
+    "test": "vitest run",
+    "test:watch": "vitest",
+    "clean": "rm -rf dist"
+  },
+  "dependencies": {
+    "blocks-schema": "^0.2.0"
+  },
+  "peerDependencies": {
+    "react": "^18.0.0 || ^19.0.0"
+  },
+  "devDependencies": {
+    "@types/react": "^19.2.7",
+    "@types/react-dom": "^19.2.3",
+    "react": "^19.2.3",
+    "react-dom": "^19.2.3",
+    "tsup": "^8.5.1",
+    "typescript": "^5.9.3",
+    "vitest": "^3.2.4"
+  },
+  "engines": {
+    "node": ">=24.0.0"
+  },
+  "gitHead": "b0fd1126b68b23543a51949c1e847c4d820863d3"
+}