multiple output schemas

[nalaso]

Hey, I am creating an ai code generator application and need some help structuring the llm call. I am looking for the best way to define the LLM function for such cases. I referred the bolt.new repo, and they are only using system prompts with no tools or schema, but this requires heavy parsing of reponse to retrieve the code on the frontend. This is what bolt.new is doing.

---

systemprompt

Wrap the content in opening and closing `` tags. These tags contain more specific `` elements.

Add a title for the artifact to the `title` attribute of the opening ``.

Add a unique identifier to the `id` attribute of the of the opening ``. For updates, reuse the prior identifier. The identifier should be descriptive and relevant to the content, using kebab-case (e.g., "example-code-snippet"). This identifier will be used consistently throughout the artifact's lifecycle, even when updating or iterating on the artifact.

Use `` tags to define specific actions to perform.

For each ``, add a type to the `type` attribute of the opening `` tag to specify the type of the action. Assign one of the following values to the `type` attribute:

{ "name": "bouncing-ball", "private": true, "version": "0.0.0", "type": "module", "scripts": { "dev": "vite", "build": "vite build", "preview": "vite preview" }, "dependencies": { "react": "^18.2.0", "react-dom": "^18.2.0", "react-spring": "^9.7.1" }, "devDependencies": { "@types/react": "^18.0.28", "@types/react-dom": "^18.0.11", "@vitejs/plugin-react": "^3.1.0", "vite": "^4.2.0" } }

    <boltAction type="file" filePath="index.html">
      ...
    </boltAction>

    <boltAction type="file" filePath="src/main.jsx">
      ...
    </boltAction>

    <boltAction type="file" filePath="src/index.css">
      ...
    </boltAction>

    <boltAction type="file" filePath="src/App.jsx">
      ...
    </boltAction>

    <boltAction type="shell">
      npm run dev
    </boltAction>
  </boltArtifact>

---

instead i want to use tools or schema for my application.

These are the 2 possible methods i came up with(not tested though)

1. using schema

const { object } = await generateObject({
  model: yourModel,
  schema: {
    newFileSchema: z.object({
      path: z.string().optional().describe("File path where the content should be saved"),
      content: z.string().optional().describe("Content of the file")
    }).optional().describe("Creates a new file with the specified content"),

    newFolderSchema: z.object({
      path: z.string().optional().describe("Folder path to be created")
    }).optional().describe("Creates a new folder at the specified path"),

    newTerminalActionSchema: z.object({
      command: z.string().optional().describe("Terminal command to execute")
    }).optional().describe("Executes a command in the terminal"),
  },
  prompt: 'Generate a weather app.',
});

2. using tools

const fileTool = tool({
  description: 'Creates a new file with the specified content',
  parameters: z.object({
    path: z.string().optional().describe("File path where the content should be saved"),
    content: z.string().optional().describe("Content of the file"),
  }),
  execute: async ({ path, content }) => ({
    path,
    content,
  }),
});

const folderTool = tool({
  description: 'Creates a new folder at the specified path',
  parameters: z.object({
    path: z.string().optional().describe("Folder path to be created"),
  }),
  execute: async ({ path }) => ({
    path,
  }),
});

const terminalTool = tool({
  description: 'Executes a command in the terminal',
  parameters: z.object({
    command: z.string().optional().describe("Terminal command to execute"),
  }),
  execute: async ({ command }) => ({
    command,
  }),
});

const result = await generateText({
  model: yourModel,
  tools: {
    createFile: fileTool,
    createFolder: folderTool,
    executeCommand: terminalTool,
  },
  prompt: 'Generate a weather app',
});

this approach requires multiple steps to complete the request, even though there are no server side execution within the tool calling. however, this method allows me to access the required code within tool_invocation in useChat() messages.

Let me know if these 2 approaches are ideal or not for my requirement or is there any another way that would meet my needs? My requirement is that it should stream code file by file so that i can stream it in the editor panel. Also i am planning to integrate multiple tasks like remove folder, remove file so is it ideal to everything in the prompt like bolt.new?

[pavi2410]

I also have looking for an elegant solution to generate multiple files like Claude Artifacts and Bolt. I believe that JSON schema would be in-efficient because XML defines a clear boundary with the tags. However, tool calling seems like a smart idea...

[lgrammel]

You can use tools w/o an execute method to achieve this. Set toolChoice to required and then process the tool calls that you get out of generateText.