#Tools

createGenUITools returns a set of tool definitions the model can call to read and mutate a JSON UI spec.

#createGenUITools(options)

Creates tools that operate on a spec with shape { root, elements }. Options:

#Tool list

• getUIRootNode — Return the root node id and element
• getUINode — Return a node by id
• getUILayout — Return layout (root + children structure)
• getAvailableUINodes — List available node types and hints
• setUINodeProps — Set props on a node ({ id, props, replace? }; default merge, use replace: true to replace all)
• deleteUINode — Remove a node
• addUINode — Add a node ({ parentId?, type, props? }; omit parentId to use root)
• reorderUINodes — Move a sibling by index (nodeId, offset; negative = earlier, positive = later; clamped to valid range)

All mutations are serialized so concurrent tool calls do not interleave writes.

#buildGenUISystemPrompt(options?)

Builds the reusable system instructions for JSON UI tooling. Use as the system option for streamText / generateText.

Options:

Example:

system: buildGenUISystemPrompt({
  additionalInstructions:
    'Your name is John. Prefer short labels. Use Button for primary actions only.',
  styleHints: {
    borderRadius: { type: 'number', description: 'Border radius in px.' },
  },
})

Need React or React Native expertise you can count on?

Let's talkLet's talk