{
	"$schema": "https://ui.shadcn.com/schema/registry-item.json",
	"name": "generate-text-node-demo",
	"type": "registry:example",
	"files": [
		{
			"path": "./src/registry/examples/generate-text-node-demo.tsx",
			"content": "\"use client\";\n\nimport \"@xyflow/react/dist/style.css\";\n\nimport {\n\taddEdge,\n\tapplyEdgeChanges,\n\tapplyNodeChanges,\n\tBackground,\n\ttype Connection,\n\ttype EdgeChange,\n\ttype Node,\n\ttype NodeChange,\n\ttype NodeProps,\n\ttype NodeTypes,\n\tReactFlow,\n\tReactFlowProvider,\n} from \"@xyflow/react\";\nimport { nanoid } from \"nanoid\";\nimport { useCallback, useState } from \"react\";\nimport type { Model } from \"@/registry/ui/model-selector\";\nimport { GenerateTextNode } from \"../ui/flow/generate-text-node\";\n\nconst GenerateTextNodeController = ({\n\tid,\n\tdata,\n\t...props\n}: NodeProps<Node>) => {\n\tconst [model, setModel] = useState<Model>(\"deepseek-chat\");\n\tconst [toolHandles, setToolHandles] = useState({\n\t\ttools: [\n\t\t\t{\n\t\t\t\tid: \"name\",\n\t\t\t\tname: \"name\",\n\t\t\t},\n\t\t],\n\t});\n\n\tconst handleCreateTool = useCallback(() => {\n\t\tsetToolHandles({\n\t\t\t...toolHandles,\n\t\t\ttools: [...toolHandles.tools, { id: nanoid(), name: \"name\" }],\n\t\t});\n\t\treturn true;\n\t}, [toolHandles]);\n\n\tconst handleRemoveTool = useCallback(() => {\n\t\tsetToolHandles({\n\t\t\t...toolHandles,\n\t\t\ttools: toolHandles.tools.filter((tool) => tool.id !== \"name\"),\n\t\t});\n\t\treturn true;\n\t}, [toolHandles]);\n\n\tconst handleUpdateTool = useCallback(\n\t\t(toolId: string, newName: string, newDescription?: string) => {\n\t\t\tsetToolHandles({\n\t\t\t\t...toolHandles,\n\t\t\t\ttools: toolHandles.tools.map((tool) =>\n\t\t\t\t\ttool.id === toolId\n\t\t\t\t\t\t? {\n\t\t\t\t\t\t\t\t...tool,\n\t\t\t\t\t\t\t\tname: newName,\n\t\t\t\t\t\t\t\tdescription: newDescription,\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t: tool,\n\t\t\t\t),\n\t\t\t});\n\t\t\treturn true;\n\t\t},\n\t\t[toolHandles],\n\t);\n\n\treturn (\n\t\t<GenerateTextNode\n\t\t\tid={id}\n\t\t\tdata={{\n\t\t\t\tstatus: \"idle\",\n\t\t\t\tconfig: { model },\n\t\t\t\tdynamicHandles: toolHandles,\n\t\t\t}}\n\t\t\t{...props}\n\t\t\ttype=\"generate-text\"\n\t\t\tonModelChange={(model) => setModel(model)}\n\t\t\tonCreateTool={handleCreateTool}\n\t\t\tonRemoveTool={handleRemoveTool}\n\t\t\tonUpdateTool={handleUpdateTool}\n\t\t\tonDeleteNode={() => {}}\n\t\t/>\n\t);\n};\n\nconst nodeTypes: NodeTypes = {\n\t\"generate-text\": GenerateTextNodeController,\n};\n\nconst initialNodes = [\n\t{\n\t\tid: \"node-1\",\n\t\ttype: \"generate-text\",\n\t\tposition: { x: 0, y: -130 },\n\t\tdata: {},\n\t},\n];\n\nexport default function ResizableNodeDemo() {\n\tconst [nodes, setNodes] = useState<Node[]>(initialNodes);\n\tconst [edges, setEdges] = useState([]);\n\n\t// Add default viewport configuration\n\tconst defaultViewport = { x: 100, y: 200, zoom: 1 };\n\n\tconst onNodesChange = useCallback(\n\t\t(changes: NodeChange<Node>[]) =>\n\t\t\tsetNodes((nds) => applyNodeChanges(changes, nds)),\n\t\t[],\n\t);\n\tconst onEdgesChange = useCallback(\n\t\t(changes: EdgeChange<never>[]) =>\n\t\t\tsetEdges((eds) => applyEdgeChanges(changes, eds)),\n\t\t[],\n\t);\n\tconst onConnect = useCallback(\n\t\t(connection: Connection) => setEdges((eds) => addEdge(connection, eds)),\n\t\t[],\n\t);\n\treturn (\n\t\t<div className=\"w-full h-full\">\n\t\t\t<ReactFlowProvider>\n\t\t\t\t<ReactFlow\n\t\t\t\t\tnodes={nodes}\n\t\t\t\t\tedges={edges}\n\t\t\t\t\tonNodesChange={onNodesChange}\n\t\t\t\t\tonEdgesChange={onEdgesChange}\n\t\t\t\t\tonConnect={onConnect}\n\t\t\t\t\tnodeTypes={nodeTypes}\n\t\t\t\t\tdefaultViewport={defaultViewport}\n\t\t\t\t\t/* fitView */\n\t\t\t\t>\n\t\t\t\t\t<Background />\n\t\t\t\t</ReactFlow>\n\t\t\t</ReactFlowProvider>\n\t\t</div>\n\t);\n}\n",
			"type": "registry:example"
		}
	]
}