@genui-a3/create 0.1.4 → 0.1.6

package/README.md

@@ -5,14 +5,16 @@ Scaffold a new [A3](https://www.npmjs.com/package/@genui-a3/core) agentic app in
 ## Quick Start
 
 ```bash
-npx @genui-a3/create@latest my-app
+npx @genui-a3/create@latest
 ```
 
-This will:
+This starts an **interactive session** that will:
 
-1. Create a new directory with your project name
-1. Copy a production-ready Next.js template
-1. Install all dependencies automatically
+1. Prompt for your project name and directory
+2. Let you select and configure LLM providers (OpenAI, Anthropic, Bedrock)
+3. Generate a production-ready Next.js template
+4. Automatically create your `.env` with the provided credentials
+5. Install all dependencies
 
 Then start developing:
 
@@ -34,6 +36,23 @@ A fully configured Next.js application with:
 - **Material UI** — pre-configured theming with MUI components
 - **TypeScript** — strict type-checking out of the box
 
+## Configuration & Providers
+
+The CLI guides you through setting up your LLM providers and authentication during scaffolding.
+
+### Supported Providers
+
+| Provider | Authentication | Auto-Generated Config |
+|----------|---------------|------------------------|
+| **OpenAI** | API Key | `OPENAI_API_KEY` |
+| **Anthropic** | API Key | `ANTHROPIC_API_KEY` |
+| **AWS Bedrock** | AWS Profile or Access Keys | `AWS_REGION`, `AWS_ACCESS_KEY_ID`, etc. |
+
+### Automatic Setup
+
+- **Environment Variables**: A `.env` file is generated with your keys so you can run the app immediately.
+- **Provider Registry**: The CLI generates `app/lib/provider.ts`, pre-configuring the A3 `Provider` factory with your primary model selection.
+
 ## Usage
 
 ```bash

package/dist/index.js

@@ -14,45 +14,39 @@ import fs from "fs-extra";
 
 // src/utils/providers.ts
 var PROVIDER_META = {
-  openai: {
-    label: "OpenAI",
-    importPath: "@genui-a3/providers/openai",
-    factory: "createOpenAIProvider",
-    models: ["gpt-4o", "gpt-4o-mini"]
-  },
-  bedrock: {
-    label: "AWS Bedrock",
-    importPath: "@genui-a3/providers/bedrock",
-    factory: "createBedrockProvider",
-    models: ["us.anthropic.claude-sonnet-4-5-20250929-v1:0", "us.anthropic.claude-haiku-4-5-20251001-v1:0"]
-  }
+  openai: { label: "OpenAI", exportName: "openaiProvider", file: "openai.ts" },
+  bedrock: { label: "AWS Bedrock", exportName: "bedrockProvider", file: "bedrock.ts" },
+  anthropic: { label: "Anthropic", exportName: "anthropicProvider", file: "anthropic.ts" }
 };
 
 // src/utils/generators.ts
-function generateProviderFile(targetDir, primaryProvider) {
-  const { importPath, factory, models } = PROVIDER_META[primaryProvider];
-  const modelsLiteral = models.map((m) => `'${m}'`).join(", ");
-  const content = `import { ${factory} } from '${importPath}'
-import type { Provider } from '@genui-a3/core'
-
-let _provider: Provider
-
-export function getProvider(): Provider {
-  if (!_provider) {
-    _provider = ${factory}({
-      models: [${modelsLiteral}],
-    })
+function generateProviderFiles(targetDir, config) {
+  const providersDir = path.join(targetDir, "app", "lib", "providers");
+  for (const [key, meta] of Object.entries(PROVIDER_META)) {
+    if (!config.providers.includes(key)) {
+      const filePath = path.join(providersDir, meta.file);
+      if (fs.existsSync(filePath)) fs.unlinkSync(filePath);
+    }
   }
-  return _provider
-}
-`;
-  fs.outputFileSync(path.join(targetDir, "app", "lib", "provider.ts"), content);
+  const primaryMeta = PROVIDER_META[config.primaryProvider];
+  const lines = [];
+  for (const provKey of config.providers) {
+    const meta = PROVIDER_META[provKey];
+    const baseName = meta.file.replace(".ts", "");
+    lines.push(`export { ${meta.exportName} } from './${baseName}'`);
+  }
+  lines.push(`export { ${primaryMeta.exportName} as provider } from './${primaryMeta.file.replace(".ts", "")}'`);
+  lines.push("");
+  fs.outputFileSync(path.join(providersDir, "index.ts"), lines.join("\n"));
 }
 function generateEnvFile(targetDir, config) {
   const lines = ["# Generated by create-genui-a3", "# This file is git-ignored. Do not commit credentials.", ""];
   if (config.providers.includes("openai")) {
     lines.push("# OpenAI", `OPENAI_API_KEY=${config.openaiApiKey || ""}`, "");
   }
+  if (config.providers.includes("anthropic")) {
+    lines.push("# Anthropic", `ANTHROPIC_API_KEY=${config.anthropicApiKey || ""}`, "");
+  }
   if (config.providers.includes("bedrock")) {
     if (config.bedrockAuthMode === "profile") {
       lines.push("# AWS Bedrock (profile mode)", `AWS_PROFILE=${config.awsProfile || "default"}`);
@@ -187,6 +181,18 @@ async function promptOpenAIConfig(config) {
   handleCancel(openaiApiKey);
   config.openaiApiKey = openaiApiKey;
 }
+async function promptAnthropicConfig(config) {
+  p.log.step(PROVIDER_META.anthropic.label);
+  const anthropicApiKey = await p.text({
+    message: "Anthropic API key:",
+    placeholder: "sk-ant-...",
+    validate(input) {
+      if (!input) return "API key is required. Get one at https://console.anthropic.com/settings/keys";
+    }
+  });
+  handleCancel(anthropicApiKey);
+  config.anthropicApiKey = anthropicApiKey;
+}
 async function promptBedrockConfig(config) {
   p.log.step(PROVIDER_META.bedrock.label);
   const authMode = await p.select({
@@ -281,7 +287,8 @@ async function promptProviders() {
     message: "Which LLM provider(s) do you want to configure?",
     options: [
       { label: "OpenAI", value: "openai" },
-      { label: "AWS Bedrock", value: "bedrock" }
+      { label: "AWS Bedrock", value: "bedrock" },
+      { label: "Anthropic", value: "anthropic" }
     ],
     required: true
   });
@@ -296,6 +303,9 @@ async function promptProviders() {
   if (providers.includes("bedrock")) {
     await promptBedrockConfig(config);
   }
+  if (providers.includes("anthropic")) {
+    await promptAnthropicConfig(config);
+  }
   if (providers.length > 1) {
     await promptPrimaryProvider(providers, config);
   }
@@ -359,8 +369,8 @@ async function main() {
   const spin = p2.spinner();
   spin.start("Scaffolding project files");
   scaffoldProject(templateDir, targetDir, projectName);
-  spin.message("Configuring provider");
-  generateProviderFile(targetDir, providerConfig.primaryProvider);
+  spin.message("Configuring providers");
+  generateProviderFiles(targetDir, providerConfig);
   spin.message("Generating .env file");
   generateEnvFile(targetDir, providerConfig);
   spin.stop("Project scaffolded");

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@genui-a3/create",
-  "version": "0.1.4",
+  "version": "0.1.6",
   "description": "CLI scaffolding tool for A3 agentic apps",
   "keywords": [
     "genui",

package/template/app/api/agui/route.ts

@@ -2,7 +2,7 @@ import { NextRequest } from 'next/server'
 import { EventType, type RunAgentInput } from '@ag-ui/client'
 import { EventEncoder } from '@ag-ui/encoder'
 import { AgentRegistry, ChatSession, MemorySessionStore, AGUIAgent } from '@genui-a3/core'
-import { getProvider } from '../../lib/provider'
+import { provider } from '../../lib/providers'
 import { greetingAgent, State } from '../../agents/greeting'
 import { ageAgent } from '../../agents/age'
 
@@ -23,7 +23,7 @@ const a3Agent = new AGUIAgent({
       sessionId: input.threadId,
       store,
       initialAgentId: 'greeting',
-      provider: getProvider(),
+      provider,
     }),
 })
 

package/template/app/api/chat/route.ts

@@ -5,7 +5,7 @@
  */
 import { NextRequest, NextResponse } from 'next/server'
 import { AgentRegistry, ChatSession, MemorySessionStore } from '@genui-a3/core'
-import { getProvider } from '../../lib/provider'
+import { provider } from '../../lib/providers'
 import { greetingAgent, State } from '../../agents/greeting'
 import { ageAgent } from '../../agents/age'
 
@@ -36,7 +36,7 @@ export async function POST(request: NextRequest) {
       store,
       initialAgentId: 'greeting',
       initialState: { userName: undefined },
-      provider: getProvider(),
+      provider,
     })
 
     const result = await session.send({ message })

package/template/app/api/stream/route.ts

@@ -1,6 +1,6 @@
 import { NextRequest } from 'next/server'
 import { AgentRegistry, ChatSession, MemorySessionStore } from '@genui-a3/core'
-import { getProvider } from '../../lib/provider'
+import { provider } from '../../lib/providers'
 import { greetingAgent, State } from '../../agents/greeting'
 import { ageAgent } from '../../agents/age'
 
@@ -31,7 +31,7 @@ export async function POST(request: NextRequest) {
     store,
     initialAgentId: 'greeting',
     initialState: { userName: undefined },
-    provider: getProvider(),
+    provider,
   })
 
   const encoder = new TextEncoder()

package/template/app/components/molecules/ChatInput.tsx

@@ -1,6 +1,6 @@
 'use client'
 
-import { useState, useCallback } from 'react'
+import { useState, useCallback, useEffect, useRef } from 'react'
 import styled from 'styled-components'
 import { TextField, Button, Box } from '@mui/material'
 import type { Theme } from '@mui/material/styles'
@@ -26,6 +26,18 @@ const InputForm = styled.form`
 
 export function ChatInput({ onSubmit, disabled, placeholder = 'Type a message...' }: Props) {
   const [value, setValue] = useState('')
+  const inputRef = useRef<HTMLInputElement>(null)
+  const prevDisabled = useRef(disabled)
+
+  useEffect(() => {
+    // When transitioning from disabled (true) back to enabled (false), restore focus
+    if (prevDisabled.current && !disabled) {
+      // Small timeout to ensure the clear-disabled DOM update finishes
+      const timer = setTimeout(() => inputRef.current?.focus(), 10)
+      return () => clearTimeout(timer)
+    }
+    prevDisabled.current = disabled
+  }, [disabled])
 
   const handleSubmit = useCallback(
     (e: React.FormEvent) => {
@@ -42,6 +54,7 @@ export function ChatInput({ onSubmit, disabled, placeholder = 'Type a message...
     <InputContainer>
       <InputForm onSubmit={handleSubmit}>
         <TextField
+          inputRef={inputRef}
           fullWidth
           value={value}
           onChange={(e) => setValue(e.target.value)}

package/template/app/lib/providers/anthropic.ts

@@ -0,0 +1,5 @@
+import { createAnthropicProvider } from '@genui-a3/providers/anthropic'
+
+export const anthropicProvider = createAnthropicProvider({
+  models: ['claude-sonnet-4-5-20250929', 'claude-haiku-4-5-20251001'],
+})

package/template/app/lib/providers/bedrock.ts

@@ -0,0 +1,5 @@
+import { createBedrockProvider } from '@genui-a3/providers/bedrock'
+
+export const bedrockProvider = createBedrockProvider({
+  models: ['us.anthropic.claude-sonnet-4-5-20250929-v1:0', 'us.anthropic.claude-haiku-4-5-20251001-v1:0'],
+})

package/template/app/lib/providers/openai.ts

@@ -0,0 +1,3 @@
+import { createOpenAIProvider } from '@genui-a3/providers/openai'
+
+export const openaiProvider = createOpenAIProvider({ models: ['gpt-4o', 'gpt-4o-mini'] })

package/template/package.json

@@ -11,8 +11,8 @@
     "@ag-ui/encoder": "0.0.45",
     "@emotion/react": "11.14.0",
     "@emotion/styled": "11.14.1",
-    "@genui-a3/core": "^0.1.8",
-    "@genui-a3/providers": "^0.0.1",
+    "@genui-a3/core": "^0.1.10",
+    "@genui-a3/providers": "^0.0.2",
     "@mui/icons-material": "7.3.7",
     "@mui/material": "7.3.7",
     "next": "16.1.6",