json-ui-lite-rn 0.12.0

package/lib/module/GenerativeUIView.js

@@ -0,0 +1,111 @@
+"use strict";
+
+import React from 'react';
+import { Pressable, StyleSheet, Text, View } from 'react-native';
+import { GenUINode } from './GenUINode';
+import { GEN_UI_STYLES } from './registry';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export function GenerativeUIView({
+  spec,
+  loading,
+  showCollapsibleJSON,
+  styles: stylesOverride,
+  GenUINodeComponent
+}) {
+  const [expanded, setExpanded] = React.useState(false);
+  const normalized = React.useMemo(() => {
+    if (!spec?.root || !spec.elements) return null;
+    const rootElement = spec.elements[spec.root];
+    if (!rootElement) return null;
+    return spec;
+  }, [spec]);
+  const styleValidators = React.useMemo(() => ({
+    ...GEN_UI_STYLES,
+    ...stylesOverride
+  }), [stylesOverride]);
+  if (!normalized) {
+    return /*#__PURE__*/_jsx(View, {
+      style: styles.placeholder,
+      children: /*#__PURE__*/_jsx(Text, {
+        style: styles.placeholderText,
+        children: loading ? 'Loading…' : 'Use tools getGenUIRootNode, addNode, etc. to build the UI.'
+      })
+    });
+  }
+  const NodeRenderer = GenUINodeComponent ?? GenUINode;
+  return /*#__PURE__*/_jsxs(View, {
+    style: styles.wrapper,
+    children: [/*#__PURE__*/_jsx(NodeRenderer, {
+      nodeId: normalized.root,
+      elements: normalized.elements,
+      styles: styleValidators,
+      GenUINodeComponent: GenUINodeComponent
+    }), showCollapsibleJSON ? /*#__PURE__*/_jsxs(View, {
+      style: styles.jsonPanel,
+      children: [/*#__PURE__*/_jsxs(Pressable, {
+        onPress: () => setExpanded(prev => !prev),
+        style: styles.jsonHeader,
+        children: [/*#__PURE__*/_jsx(Text, {
+          style: styles.jsonHeaderText,
+          children: "UI JSON"
+        }), /*#__PURE__*/_jsx(Text, {
+          style: styles.jsonHeaderIcon,
+          children: expanded ? '[-]' : '[+]'
+        })]
+      }), expanded ? /*#__PURE__*/_jsx(Text, {
+        selectable: true,
+        style: styles.jsonText,
+        children: JSON.stringify(normalized, null, 2)
+      }) : null]
+    }) : null]
+  });
+}
+const styles = StyleSheet.create({
+  wrapper: {
+    flex: 1,
+    justifyContent: 'center',
+    gap: 8
+  },
+  jsonPanel: {
+    borderWidth: 1,
+    borderColor: '#e5e7eb',
+    borderRadius: 12,
+    paddingHorizontal: 12,
+    paddingVertical: 10,
+    backgroundColor: '#f9fafb'
+  },
+  jsonHeader: {
+    flexDirection: 'row',
+    justifyContent: 'space-between',
+    alignItems: 'center',
+    gap: 8
+  },
+  jsonHeaderText: {
+    fontSize: 13,
+    color: '#4b5563',
+    fontWeight: '600'
+  },
+  jsonHeaderIcon: {
+    fontSize: 12,
+    color: '#9ca3af',
+    fontWeight: '600'
+  },
+  jsonText: {
+    marginTop: 8,
+    fontSize: 12,
+    lineHeight: 18,
+    color: '#374151',
+    fontFamily: 'Menlo'
+  },
+  placeholder: {
+    flex: 1,
+    justifyContent: 'center',
+    padding: 24
+  },
+  placeholderText: {
+    fontSize: 15,
+    color: '#6b7280',
+    textAlign: 'center'
+  }
+});
+//# sourceMappingURL=GenerativeUIView.js.map

package/lib/module/GenerativeUIView.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","Pressable","StyleSheet","Text","View","GenUINode","GEN_UI_STYLES","jsx","_jsx","jsxs","_jsxs","GenerativeUIView","spec","loading","showCollapsibleJSON","styles","stylesOverride","GenUINodeComponent","expanded","setExpanded","useState","normalized","useMemo","root","elements","rootElement","styleValidators","style","placeholder","children","placeholderText","NodeRenderer","wrapper","nodeId","jsonPanel","onPress","prev","jsonHeader","jsonHeaderText","jsonHeaderIcon","selectable","jsonText","JSON","stringify","create","flex","justifyContent","gap","borderWidth","borderColor","borderRadius","paddingHorizontal","paddingVertical","backgroundColor","flexDirection","alignItems","fontSize","color","fontWeight","marginTop","lineHeight","fontFamily","padding","textAlign"],"sourceRoot":"../../src","sources":["GenerativeUIView.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/index.js

@@ -0,0 +1,9 @@
+"use strict";
+
+export { GenerativeUIView } from './GenerativeUIView';
+export { GenUINode } from './GenUINode';
+export { parseGenUIElementProps } from './parseGenUIProps';
+export { buildGenUISystemPrompt } from './prompt';
+export { DEFAULT_GEN_UI_ROOT_ID, GEN_UI_NODE_HINTS, GEN_UI_NODE_NAMES, GEN_UI_NODE_NAMES_THAT_SUPPORT_CHILDREN, GEN_UI_STYLE_HINTS, GEN_UI_STYLES } from './registry';
+export { createGenUITools } from './tools';
+//# sourceMappingURL=index.js.map

package/lib/module/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["GenerativeUIView","GenUINode","parseGenUIElementProps","buildGenUISystemPrompt","DEFAULT_GEN_UI_ROOT_ID","GEN_UI_NODE_HINTS","GEN_UI_NODE_NAMES","GEN_UI_NODE_NAMES_THAT_SUPPORT_CHILDREN","GEN_UI_STYLE_HINTS","GEN_UI_STYLES","createGenUITools"],"sourceRoot":"../../src","sources":["index.ts"],"mappings":";;AAAA,SACEA,gBAAgB,QAEX,oBAAoB;AAC3B,SAASC,SAAS,QAA6B,aAAa;AAC5D,SAGEC,sBAAsB,QAEjB,mBAAmB;AAC1B,SACEC,sBAAsB,QAEjB,UAAU;AAEjB,SACEC,sBAAsB,EACtBC,iBAAiB,EACjBC,iBAAiB,EACjBC,uCAAuC,EACvCC,kBAAkB,EAClBC,aAAa,QACR,YAAY;AACnB,SAAuCC,gBAAgB,QAAQ,SAAS","ignoreList":[]}

package/lib/module/parseGenUIProps.js

@@ -0,0 +1,49 @@
+"use strict";
+
+/**
+ * Parses a JSON UI element's props into a baseStyle object (validated by style validators)
+ * and common fields (text, label). Use this in custom GenUINode implementations to reuse
+ * the same style and prop parsing as the default renderer.
+ */
+export function parseGenUIElementProps(element, styleValidators, options) {
+  const {
+    nodeId = '',
+    type = ''
+  } = options ?? {};
+  const props = element.props ?? {};
+  const style = props.style;
+  const flex = props.flex;
+  const padding = props.padding;
+  const gap = props.gap;
+  const text = props.text ?? props.value ?? props.label;
+  const label = props.label ?? props.text;
+  const baseStyle = {
+    ...(flex != null ? {
+      flex
+    } : {}),
+    ...(padding != null ? {
+      padding
+    } : {}),
+    ...(gap != null ? {
+      gap
+    } : {}),
+    ...style
+  };
+  for (const key of Object.keys(props)) {
+    const validator = styleValidators[key];
+    if (validator) {
+      if (validator.safeParse(props[key]).success) {
+        baseStyle[key] = props[key];
+      } else {
+        console.warn(`[json-ui-lite-rn] Invalid style prop: ${key} for node ${nodeId} of type ${type}: ${props[key]}`);
+      }
+    }
+  }
+  return {
+    baseStyle,
+    text,
+    label,
+    props
+  };
+}
+//# sourceMappingURL=parseGenUIProps.js.map

package/lib/module/parseGenUIProps.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["parseGenUIElementProps","element","styleValidators","options","nodeId","type","props","style","flex","padding","gap","text","value","label","baseStyle","key","Object","keys","validator","safeParse","success","console","warn"],"sourceRoot":"../../src","sources":["parseGenUIProps.ts"],"mappings":";;AAkBA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASA,sBAAsBA,CACpCC,OAAsB,EACtBC,eAAkC,EAClCC,OAAuC,EACrB;EAClB,MAAM;IAAEC,MAAM,GAAG,EAAE;IAAEC,IAAI,GAAG;EAAG,CAAC,GAAGF,OAAO,IAAI,CAAC,CAAC;EAChD,MAAMG,KAAK,GAAGL,OAAO,CAACK,KAAK,IAAI,CAAC,CAAC;EACjC,MAAMC,KAAK,GAAGD,KAAK,CAACC,KAA4C;EAChE,MAAMC,IAAI,GAAGF,KAAK,CAACE,IAA0B;EAC7C,MAAMC,OAAO,GAAGH,KAAK,CAACG,OAA6B;EACnD,MAAMC,GAAG,GAAGJ,KAAK,CAACI,GAAyB;EAC3C,MAAMC,IAAI,GAAIL,KAAK,CAACK,IAAI,IAAIL,KAAK,CAACM,KAAK,IAAIN,KAAK,CAACO,KAA4B;EAC7E,MAAMA,KAAK,GAAIP,KAAK,CAACO,KAAK,IAAIP,KAAK,CAACK,IAA2B;EAE/D,MAAMG,SAAS,GAAG;IAChB,IAAIN,IAAI,IAAI,IAAI,GAAG;MAAEA;IAAK,CAAC,GAAG,CAAC,CAAC,CAAC;IACjC,IAAIC,OAAO,IAAI,IAAI,GAAG;MAAEA;IAAQ,CAAC,GAAG,CAAC,CAAC,CAAC;IACvC,IAAIC,GAAG,IAAI,IAAI,GAAG;MAAEA;IAAI,CAAC,GAAG,CAAC,CAAC,CAAC;IAC/B,GAAGH;EACL,CAA4B;EAE5B,KAAK,MAAMQ,GAAG,IAAIC,MAAM,CAACC,IAAI,CAACX,KAAK,CAAC,EAAE;IACpC,MAAMY,SAAS,GAAGhB,eAAe,CAACa,GAAG,CAAC;IACtC,IAAIG,SAAS,EAAE;MACb,IAAIA,SAAS,CAACC,SAAS,CAACb,KAAK,CAACS,GAAG,CAAC,CAAC,CAACK,OAAO,EAAE;QAC3CN,SAAS,CAACC,GAAG,CAAC,GAAGT,KAAK,CAACS,GAAG,CAAC;MAC7B,CAAC,MAAM;QACLM,OAAO,CAACC,IAAI,CACV,yCAAyCP,GAAG,aAAaX,MAAM,YAAYC,IAAI,KAAKC,KAAK,CAACS,GAAG,CAAC,EAChG,CAAC;MACH;IACF;EACF;EAEA,OAAO;IAAED,SAAS;IAAEH,IAAI;IAAEE,KAAK;IAAEP;EAAM,CAAC;AAC1C","ignoreList":[]}

package/lib/module/prompt.js

@@ -0,0 +1,23 @@
+"use strict";
+
+import { GEN_UI_STYLE_HINTS } from './registry';
+export function buildGenUISystemPrompt({
+  additionalInstructions,
+  requireLayoutReadBeforeAddingNodes = true,
+  styleHints = GEN_UI_STYLE_HINTS
+} = {}) {
+  const styleKeysText = Object.entries(styleHints).map(([key, entry]) => {
+    let text = `${key} [${entry.type}]`;
+    if (entry.description) text += ` (${entry.description})`;
+    return text;
+  }).join(', ');
+  const parts = ['You are a helpful assistant.', 'You have tools to create and update UI nodes. Before any tool calls for UI, ALWAYS CALL getUILayout before and after.', 'Remember this is React Native, not web, and use simple props.', `If you set the "style" prop on a UI node, the possible keys are: ${styleKeysText}.`, 'Remember NEVER use web values.'];
+  if (requireLayoutReadBeforeAddingNodes) {
+    parts.push('BEFORE ADDING ANY UI ELEMENTS, GET THE WHOLE UI TREE with getGenUILayout.');
+  }
+  if (additionalInstructions?.trim()) {
+    parts.push(additionalInstructions.trim());
+  }
+  return parts.join(' ');
+}
+//# sourceMappingURL=prompt.js.map

package/lib/module/prompt.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["GEN_UI_STYLE_HINTS","buildGenUISystemPrompt","additionalInstructions","requireLayoutReadBeforeAddingNodes","styleHints","styleKeysText","Object","entries","map","key","entry","text","type","description","join","parts","push","trim"],"sourceRoot":"../../src","sources":["prompt.ts"],"mappings":";;AAAA,SAASA,kBAAkB,QAAQ,YAAY;AAgB/C,OAAO,SAASC,sBAAsBA,CAAC;EACrCC,sBAAsB;EACtBC,kCAAkC,GAAG,IAAI;EACzCC,UAAU,GAAGJ;AACgB,CAAC,GAAG,CAAC,CAAC,EAAE;EACrC,MAAMK,aAAa,GAAGC,MAAM,CAACC,OAAO,CAACH,UAAU,CAAC,CAC7CI,GAAG,CAAC,CAAC,CAACC,GAAG,EAAEC,KAAK,CAAC,KAAK;IACrB,IAAIC,IAAI,GAAG,GAAGF,GAAG,KAAKC,KAAK,CAACE,IAAI,GAAG;IACnC,IAAIF,KAAK,CAACG,WAAW,EAAEF,IAAI,IAAI,KAAKD,KAAK,CAACG,WAAW,GAAG;IACxD,OAAOF,IAAI;EACb,CAAC,CAAC,CACDG,IAAI,CAAC,IAAI,CAAC;EAEb,MAAMC,KAAK,GAAG,CACZ,8BAA8B,EAC9B,uHAAuH,EACvH,+DAA+D,EAC/D,oEAAoEV,aAAa,GAAG,EACpF,gCAAgC,CACjC;EAED,IAAIF,kCAAkC,EAAE;IACtCY,KAAK,CAACC,IAAI,CACR,2EACF,CAAC;EACH;EAEA,IAAId,sBAAsB,EAAEe,IAAI,CAAC,CAAC,EAAE;IAClCF,KAAK,CAACC,IAAI,CAACd,sBAAsB,CAACe,IAAI,CAAC,CAAC,CAAC;EAC3C;EAEA,OAAOF,KAAK,CAACD,IAAI,CAAC,GAAG,CAAC;AACxB","ignoreList":[]}

package/lib/module/registry.js

@@ -0,0 +1,66 @@
+"use strict";
+
+import { z } from 'zod';
+export const DEFAULT_GEN_UI_ROOT_ID = 'root';
+export const GEN_UI_NODE_NAMES = {
+  Text: 'Text',
+  Paragraph: 'Paragraph',
+  Label: 'Label',
+  Heading: 'Heading',
+  Button: 'Button',
+  TextInput: 'TextInput'
+};
+export const GEN_UI_NODE_NAMES_THAT_SUPPORT_CHILDREN = [];
+export const GEN_UI_NODE_HINTS = {
+  Text: 'Single line text. Props: text [string], style [object].',
+  Paragraph: 'Long text. Props: text [string], style [object].',
+  Label: 'Small label. Props: text [string], style [object].',
+  Heading: 'Title text. Props: text [string], style [object].',
+  Button: 'Tap button. Props: text [string], style [object].',
+  TextInput: 'Single line text input. Props: placeholder [string], style [object].'
+};
+export const GEN_UI_STYLES = {
+  flex: z.number(),
+  padding: z.number(),
+  gap: z.number(),
+  backgroundColor: z.string(),
+  color: z.string(),
+  fontSize: z.number(),
+  fontWeight: z.string(),
+  textAlign: z.string()
+};
+export const GEN_UI_STYLE_HINTS = {
+  flex: {
+    type: 'number',
+    description: 'Flex grow/shrink basis value.'
+  },
+  padding: {
+    type: 'number',
+    description: 'Padding in density-independent px.'
+  },
+  gap: {
+    type: 'number',
+    description: 'Spacing between children in density-independent px.'
+  },
+  backgroundColor: {
+    type: 'string',
+    description: 'React Native color value.'
+  },
+  color: {
+    type: 'string',
+    description: 'Text color value.'
+  },
+  fontSize: {
+    type: 'number',
+    description: 'Font size in points.'
+  },
+  fontWeight: {
+    type: 'string',
+    description: 'Font weight string like "400", "600", "bold".'
+  },
+  textAlign: {
+    type: 'string',
+    description: 'Text alignment, for example "left", "center", "right".'
+  }
+};
+//# sourceMappingURL=registry.js.map

package/lib/module/registry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["z","DEFAULT_GEN_UI_ROOT_ID","GEN_UI_NODE_NAMES","Text","Paragraph","Label","Heading","Button","TextInput","GEN_UI_NODE_NAMES_THAT_SUPPORT_CHILDREN","GEN_UI_NODE_HINTS","GEN_UI_STYLES","flex","number","padding","gap","backgroundColor","string","color","fontSize","fontWeight","textAlign","GEN_UI_STYLE_HINTS","type","description"],"sourceRoot":"../../src","sources":["registry.ts"],"mappings":";;AAAA,SAASA,CAAC,QAAQ,KAAK;AAavB,OAAO,MAAMC,sBAAsB,GAAG,MAAM;AAE5C,OAAO,MAAMC,iBAAiB,GAAG;EAC/BC,IAAI,EAAE,MAAM;EACZC,SAAS,EAAE,WAAW;EACtBC,KAAK,EAAE,OAAO;EACdC,OAAO,EAAE,SAAS;EAClBC,MAAM,EAAE,QAAQ;EAChBC,SAAS,EAAE;AACb,CAAU;AAEV,OAAO,MAAMC,uCAAiD,GAAG,EAAE;AAEnE,OAAO,MAAMC,iBAAiE,GAC5E;EACEP,IAAI,EAAE,yDAAyD;EAC/DC,SAAS,EAAE,kDAAkD;EAC7DC,KAAK,EAAE,oDAAoD;EAC3DC,OAAO,EAAE,mDAAmD;EAC5DC,MAAM,EAAE,mDAAmD;EAC3DC,SAAS,EACP;AACJ,CAAC;AAEH,OAAO,MAAMG,aAAa,GAAG;EAC3BC,IAAI,EAAEZ,CAAC,CAACa,MAAM,CAAC,CAAC;EAChBC,OAAO,EAAEd,CAAC,CAACa,MAAM,CAAC,CAAC;EACnBE,GAAG,EAAEf,CAAC,CAACa,MAAM,CAAC,CAAC;EACfG,eAAe,EAAEhB,CAAC,CAACiB,MAAM,CAAC,CAAC;EAC3BC,KAAK,EAAElB,CAAC,CAACiB,MAAM,CAAC,CAAC;EACjBE,QAAQ,EAAEnB,CAAC,CAACa,MAAM,CAAC,CAAC;EACpBO,UAAU,EAAEpB,CAAC,CAACiB,MAAM,CAAC,CAAC;EACtBI,SAAS,EAAErB,CAAC,CAACiB,MAAM,CAAC;AACtB,CAAC;AAED,OAAO,MAAMK,kBAGZ,GAAG;EACFV,IAAI,EAAE;IAAEW,IAAI,EAAE,QAAQ;IAAEC,WAAW,EAAE;EAAgC,CAAC;EACtEV,OAAO,EAAE;IACPS,IAAI,EAAE,QAAQ;IACdC,WAAW,EAAE;EACf,CAAC;EACDT,GAAG,EAAE;IACHQ,IAAI,EAAE,QAAQ;IACdC,WAAW,EAAE;EACf,CAAC;EACDR,eAAe,EAAE;IAAEO,IAAI,EAAE,QAAQ;IAAEC,WAAW,EAAE;EAA4B,CAAC;EAC7EN,KAAK,EAAE;IAAEK,IAAI,EAAE,QAAQ;IAAEC,WAAW,EAAE;EAAoB,CAAC;EAC3DL,QAAQ,EAAE;IAAEI,IAAI,EAAE,QAAQ;IAAEC,WAAW,EAAE;EAAuB,CAAC;EACjEJ,UAAU,EAAE;IACVG,IAAI,EAAE,QAAQ;IACdC,WAAW,EAAE;EACf,CAAC;EACDH,SAAS,EAAE;IACTE,IAAI,EAAE,QAAQ;IACdC,WAAW,EAAE;EACf;AACF,CAAC","ignoreList":[]}

package/lib/module/tools.js

@@ -0,0 +1,383 @@
+"use strict";
+
+import { tool } from 'ai';
+import { z } from 'zod';
+import { DEFAULT_GEN_UI_ROOT_ID, GEN_UI_NODE_HINTS, GEN_UI_NODE_NAMES_THAT_SUPPORT_CHILDREN } from './registry';
+
+/**
+ * Sometimes LLMs call tools with a string instead of an object.
+ */
+function smartParse(props) {
+  return typeof props === 'string' ? JSON.parse(props) : props;
+}
+const defaultCreateId = () => `UI-${Date.now().toString(36)}-${Math.random().toString(16).slice(2)}`;
+const cloneSpec = spec => ({
+  ...spec,
+  elements: Object.fromEntries(Object.entries(spec.elements).map(([id, element]) => [id, {
+    ...element,
+    props: {
+      ...(element.props ?? {})
+    },
+    children: [...(element.children ?? [])]
+  }]))
+});
+let mutationQueue = Promise.resolve();
+const withMutationLock = async run => {
+  let release = () => {};
+  const pending = new Promise(resolve => {
+    release = resolve;
+  });
+  const previous = mutationQueue;
+  mutationQueue = mutationQueue.then(() => pending);
+  await previous;
+  try {
+    return await run();
+  } finally {
+    release();
+  }
+};
+
+/**
+ * Creates generative UI tools that read/update a JSON UI spec.
+ */
+export function createGenUITools({
+  contextId,
+  getSpec,
+  updateSpec,
+  createId = defaultCreateId,
+  rootId = DEFAULT_GEN_UI_ROOT_ID,
+  nodeHints = GEN_UI_NODE_HINTS,
+  nodeNamesThatSupportChildren = GEN_UI_NODE_NAMES_THAT_SUPPORT_CHILDREN,
+  toolWrapper = (_, execute) => execute
+}) {
+  // Serialize mutating tool calls to avoid interleaving writes.
+  let cachedSpec = null;
+  const readSpec = () => {
+    if (cachedSpec) return cloneSpec(cachedSpec);
+    const spec = getSpec(contextId);
+    if (!spec) return null;
+    cachedSpec = cloneSpec(spec);
+    return cloneSpec(cachedSpec);
+  };
+  const commitSpec = spec => {
+    cachedSpec = spec ? cloneSpec(spec) : null;
+    updateSpec(contextId, spec ? cloneSpec(spec) : null);
+  };
+  const getUIRootNode = tool({
+    description: 'Get the root node of the generative UI tree. Returns id, type, props, and children (array of { id, type }). Root always exists with id "root".',
+    inputSchema: z.object({}),
+    execute: toolWrapper('getUIRootNode', async () => {
+      const spec = readSpec();
+      if (!spec?.root || !spec.elements[spec.root]) return {
+        root: null
+      };
+      const element = spec.elements[spec.root];
+      const children = (element.children ?? []).map(id => ({
+        id,
+        type: spec.elements[id]?.type ?? 'unknown'
+      }));
+      return {
+        root: {
+          id: spec.root,
+          type: element.type,
+          props: element.props,
+          children
+        }
+      };
+    })
+  });
+  const getUINode = tool({
+    description: 'Get a node by id. Returns id, type, props, and children (array of { id, type }). If id is omitted, returns root node.',
+    inputSchema: z.object({
+      id: z.string().optional().describe('Node id; omit for root')
+    }),
+    execute: toolWrapper('getUINode', async ({
+      id
+    }) => {
+      const spec = readSpec();
+      if (!spec) return {
+        node: null
+      };
+      const nodeId = id ?? spec.root;
+      const element = spec.elements[nodeId];
+      if (!element) return {
+        node: null
+      };
+      const children = (element.children ?? []).map(childId => ({
+        id: childId,
+        type: spec.elements[childId]?.type ?? 'unknown'
+      }));
+      return {
+        node: {
+          id: nodeId,
+          type: element.type,
+          props: element.props,
+          children
+        }
+      };
+    })
+  });
+  const getUILayout = tool({
+    description: 'Get compact UI layout.',
+    inputSchema: z.object({}),
+    execute: toolWrapper('getUILayout', async () => {
+      const spec = readSpec();
+      if (!spec) return {
+        root: null,
+        nodes: []
+      };
+      const parentByChild = {};
+      for (const [id, element] of Object.entries(spec.elements)) {
+        for (const childId of element.children ?? []) {
+          parentByChild[childId] = id;
+        }
+      }
+      const nodes = Object.entries(spec.elements).map(([id, element]) => ({
+        id,
+        type: element.type,
+        parentId: parentByChild[id] ?? null,
+        children: element.children ?? [],
+        props: Object.keys(element.props ?? {})
+      }));
+      return {
+        root: spec.root,
+        nodes
+      };
+    })
+  });
+  const getAvailableUINodes = tool({
+    description: 'List nodes + props.',
+    inputSchema: z.object({}),
+    execute: toolWrapper('getAvailableUINodes', async () => ({
+      nodes: Object.entries(nodeHints).map(([name, props]) => ({
+        name,
+        props
+      }))
+    }))
+  });
+  const setUINodeProps = tool({
+    description: 'Set or add props for a node by id.',
+    inputSchema: z.object({
+      id: z.string().describe('Node id'),
+      props: z.string().describe('Props object for the node'),
+      replace: z.boolean().optional().describe('Replace existing props')
+    }),
+    execute: toolWrapper('setUINodeProps', async ({
+      id,
+      props: propsArg,
+      replace = false
+    }) => withMutationLock(async () => {
+      const parsedProps = smartParse(propsArg);
+      const spec = readSpec();
+      if (!spec) return {
+        success: false,
+        message: 'No UI spec'
+      };
+      if (!spec.elements[id]) {
+        return {
+          success: false,
+          message: 'Node not found'
+        };
+      }
+      const elements = {
+        ...spec.elements
+      };
+      const current = elements[id];
+      const nextProps = replace ? parsedProps : {
+        ...current.props,
+        ...parsedProps
+      };
+      elements[id] = {
+        ...current,
+        props: nextProps
+      };
+      commitSpec({
+        root: spec.root,
+        elements
+      });
+      return {
+        success: true
+      };
+    }))
+  });
+  const deleteUINode = tool({
+    description: 'Delete a node by id. Cannot delete the root node (id "root"). Removes the node and its reference from the parent\'s children.',
+    inputSchema: z.object({
+      id: z.string().describe('Node id to delete')
+    }),
+    execute: toolWrapper('deleteUINode', async ({
+      id
+    }) => withMutationLock(async () => {
+      if (id === rootId) {
+        return {
+          success: false,
+          message: 'Cannot delete root node'
+        };
+      }
+      const spec = readSpec();
+      if (!spec) return {
+        success: false,
+        message: 'No UI spec'
+      };
+      const elements = {
+        ...spec.elements
+      };
+      delete elements[id];
+      for (const key of Object.keys(elements)) {
+        const element = elements[key];
+        if (element.children?.includes(id)) {
+          elements[key] = {
+            ...element,
+            children: element.children.filter(childId => childId !== id)
+          };
+        }
+      }
+      commitSpec({
+        root: spec.root,
+        elements
+      });
+      return {
+        success: true
+      };
+    }))
+  });
+  const addUINode = tool({
+    description: 'Add a new node as a child of parentId. Creates element with type and props. Returns new node id. Props must be a valid JSON object.',
+    inputSchema: z.object({
+      parentId: z.string().optional().describe('Parent node id; omit for root'),
+      type: z.string().describe('Component type (e.g. Container, Column, Text, Button)'),
+      props: z.string().optional().describe('Props object for the node')
+    }),
+    execute: toolWrapper('addUINode', async ({
+      parentId,
+      type,
+      props: propsArg
+    }) => withMutationLock(async () => {
+      const parsedProps = smartParse(propsArg ?? '{}');
+      const spec = readSpec();
+      if (!spec) {
+        console.warn('[json-ui-lite-rn tool addNode] No UI spec, aborting');
+        return {
+          success: false,
+          message: 'No UI spec'
+        };
+      }
+      parentId ??= spec.root;
+      if (!spec.elements[parentId]) {
+        console.warn('[json-ui-lite-rn tool addNode] Parent not found, aborting');
+        return {
+          success: false,
+          message: 'Parent not found'
+        };
+      }
+      const newId = createId();
+      spec.elements[newId] = {
+        type,
+        props: parsedProps ?? {},
+        children: []
+      };
+      let parent = spec.elements[parentId];
+      if (!nodeNamesThatSupportChildren.includes(parent.type)) {
+        parent = spec.elements[spec.root];
+        parentId = spec.root;
+      }
+      spec.elements[parentId].children ??= [];
+      spec.elements[parentId].children.push(newId);
+      commitSpec({
+        root: spec.root,
+        elements: spec.elements
+      });
+      return {
+        success: true,
+        id: newId
+      };
+    }))
+  });
+  const reorderUINodes = tool({
+    description: 'Move one node among siblings by offset (negative = up, positive = down).',
+    inputSchema: z.object({
+      nodeId: z.string().describe('Node id to move'),
+      offset: z.number().describe('Relative index shift among siblings; negative moves earlier, positive moves later')
+    }),
+    execute: toolWrapper('reorderUINodes', async ({
+      nodeId,
+      offset
+    }) => withMutationLock(async () => {
+      const spec = readSpec();
+      if (!spec) return {
+        success: false,
+        message: 'No UI spec'
+      };
+      const findParentId = childId => {
+        for (const [id, element] of Object.entries(spec.elements)) {
+          if (element.children?.includes(childId)) return id;
+        }
+        return null;
+      };
+      const nodeParentId = findParentId(nodeId);
+      if (!nodeParentId) {
+        return {
+          success: false,
+          message: 'nodeId must exist and have a parent'
+        };
+      }
+      const parentId = nodeParentId;
+      const parent = spec.elements[parentId];
+      if (!parent) return {
+        success: false,
+        message: 'Parent not found'
+      };
+      const currentChildren = [...(parent.children ?? [])];
+      const nodeIndex = currentChildren.indexOf(nodeId);
+      if (nodeIndex === -1) {
+        return {
+          success: false,
+          message: 'nodeId must be a direct child'
+        };
+      }
+      if (offset === 0) {
+        return {
+          success: true,
+          parentId,
+          nodeId,
+          fromIndex: nodeIndex,
+          toIndex: nodeIndex,
+          appliedOffset: 0,
+          childIds: currentChildren
+        };
+      }
+      const maxIndex = currentChildren.length - 1;
+      const toIndex = Math.min(Math.max(nodeIndex + offset, 0), maxIndex);
+      currentChildren.splice(nodeIndex, 1);
+      currentChildren.splice(toIndex, 0, nodeId);
+      const elements = {
+        ...spec.elements
+      };
+      elements[parentId].children = currentChildren;
+      commitSpec({
+        root: spec.root,
+        elements
+      });
+      return {
+        success: true,
+        parentId,
+        nodeId,
+        fromIndex: nodeIndex,
+        toIndex,
+        appliedOffset: toIndex - nodeIndex,
+        childIds: currentChildren
+      };
+    }))
+  });
+  return {
+    getUIRootNode,
+    getUINode,
+    getUILayout,
+    getAvailableUINodes,
+    setUINodeProps,
+    deleteUINode,
+    addUINode,
+    reorderUINodes
+  };
+}
+//# sourceMappingURL=tools.js.map