openui-forge-langchainlisted

# OpenUI Forge — LangChain Build generative UI apps with OpenUI + LangChain. Stream from ChatOpenAI or ChatAnthropic, convert to OpenAI NDJSON. ## Activation Triggers - "openui langchain", "openui langgraph", "openui langsmith" - "generative ui langchain", "langchain streaming ui" ## Prerequisites - Node.js >= 22 (24 LTS recommended), React >= 18.3.1 (19+ recommended) - `OPENAI_API_KEY` or `ANTHROPIC_API_KEY` set - Next.js project (App Router recommended) ## Quick Start 1. Install dependencies (pick one or both LLM providers): ```bash npm install @openuidev/react-ui @openuidev/react-headless @openuidev/react-lang lucide-react zod @langchain/openai @langchain/core # For Anthropic: npm install @langchain/anthropic ``` 2. Add the CSS import to `app/layout.tsx`: ```tsx import "@openuidev/react-ui/components.css"; ``` 3. Create the API route and frontend page below 4. Run `npm run dev` and test ## Full Code ### Backend (OpenAI): `app/api/chat/route.ts` ```typescript import { openuiChatLibrary } from "@openuidev/react-ui/genui-lib"; import { ChatOpenAI } from "@langchain/openai"; import { HumanMessage, SystemMessage, AIMessage } from "@langchain/core/messages"; const model = new ChatOpenAI({ model: process.env.OPENAI_MODEL ?? "gpt-5.5", streaming: true }); export async function POST(req: Request) { const { messages } = await req.json(); const systemPrompt = openuiChatLibrary.prompt({ preamble: "You are a helpful assistant that generates interactive UIs.", });