mirror of
https://github.com/CopilotKit/CopilotKit.git
synced 2026-09-14 16:26:20 +08:00
Alem Tuzlak
4b11b995a2
## Summary
Adds full multimodal attachment support to CopilotKit's v2 chat
components. Users can send images, audio, video, and documents alongside
text messages to any AG-UI-compatible agent.
### Frontend
- **`attachments` prop** on `CopilotChat` — `{ enabled, accept, maxSize,
onUpload, onUploadFailed }`
- **`useAttachments` hook** — reusable, referentially stable hook for
custom chat UIs (all callbacks memoized, zero unnecessary re-renders)
- **Attachment queue** with lightbox previews (View Transition API),
video player, PDF/text document viewer
- **Drag-and-drop**, **clipboard paste**, and **file picker** upload
flows
- **Drop zone overlay** with visual indicator
- **Filename preservation** via `InputContent` metadata
- **`onUploadFailed` callback** with typed error reasons
(`file-too-large`, `invalid-type`, `upload-failed`)
- **`AttachmentUploadResult` discriminated union** for type-safe
`onUpload` returns
- Memoized attachment renderer components (v1 and v2)
### Backend
- `BuiltInAgent` properly converts multimodal `InputContent[]` to Vercel
AI SDK format
- Handles image, audio, video, document, and legacy binary content parts
### Deprecation lifecycle
- `@deprecated` JSDoc on all legacy image upload APIs (9 symbols) with
`@since 1.56.0`
- **Codemod** at `codemods/migrate-attachments.ts` — transforms props +
imports (18 tests)
- Migration guide moved to new **Migration Guides** docs section
### Docs
- New guide: `docs/(root)/multimodal-attachments.mdx`
- Updated migration guide with codemod instructions, new `onUpload`
type, metadata
- Cross-links from prebuilt-components page
- New **Migration Guides** section (moved from troubleshooting)
### AG-UI
- Bumped `@ag-ui/client`, `@ag-ui/core`, `@ag-ui/encoder`,
`@ag-ui/proto` to 0.0.51
### Example
- React Router example with dual agent setup (BuiltInAgent + TanStack
AI)
- Multimodal content properly forwarded to TanStack AI `chat()`
## Test plan
- [x] `useAttachments` hook stability tests — 9 tests (referential
stability, re-render counting, state defaults)
- [x] `CopilotChat.attachments` tests — 5 tests (onUploadFailed for
invalid-type, file-too-large, upload-failed, multiple rejections, valid
files)
- [x] Codemod tests — 18 tests (prop transforms, import renames,
idempotency, edge cases)
- [x] Full react-core suite — 966 tests passing
- [x] Tool call streaming tests pass (messagesMemoKey fingerprint fix)
203 lines
4.9 KiB
JSON
203 lines
4.9 KiB
JSON
{
|
|
"name": "@copilotkit/runtime",
|
|
"version": "1.55.0-next.8",
|
|
"private": false,
|
|
"keywords": [
|
|
"ai",
|
|
"assistant",
|
|
"automation",
|
|
"copilot",
|
|
"copilotkit",
|
|
"javascript",
|
|
"nextjs",
|
|
"nodejs",
|
|
"react",
|
|
"textarea"
|
|
],
|
|
"homepage": "https://github.com/CopilotKit/CopilotKit",
|
|
"license": "MIT",
|
|
"repository": {
|
|
"type": "git",
|
|
"url": "https://github.com/CopilotKit/CopilotKit.git"
|
|
},
|
|
"sideEffects": [
|
|
"./dist/index.mjs",
|
|
"./dist/index.cjs",
|
|
"./dist/v2/index.mjs",
|
|
"./dist/v2/index.cjs"
|
|
],
|
|
"main": "./dist/index.cjs",
|
|
"module": "./dist/index.mjs",
|
|
"types": "./dist/index.d.cts",
|
|
"typesVersions": {
|
|
"*": {
|
|
"v2": [
|
|
"./dist/v2/index.d.cts"
|
|
],
|
|
"v2/express": [
|
|
"./dist/v2/express.d.cts"
|
|
],
|
|
"v2/hono": [
|
|
"./dist/v2/hono.d.cts"
|
|
],
|
|
"v2/node": [
|
|
"./dist/v2/node.d.cts"
|
|
]
|
|
}
|
|
},
|
|
"exports": {
|
|
".": {
|
|
"import": "./dist/index.mjs",
|
|
"require": "./dist/index.cjs"
|
|
},
|
|
"./langgraph": {
|
|
"import": "./dist/langgraph.mjs",
|
|
"require": "./dist/langgraph.cjs"
|
|
},
|
|
"./v2": {
|
|
"import": "./dist/v2/index.mjs",
|
|
"require": "./dist/v2/index.cjs"
|
|
},
|
|
"./v2/express": {
|
|
"import": "./dist/v2/express.mjs",
|
|
"require": "./dist/v2/express.cjs"
|
|
},
|
|
"./v2/hono": {
|
|
"import": "./dist/v2/hono.mjs",
|
|
"require": "./dist/v2/hono.cjs"
|
|
},
|
|
"./v2/node": {
|
|
"import": "./dist/v2/node.mjs",
|
|
"require": "./dist/v2/node.cjs"
|
|
},
|
|
"./package.json": "./package.json"
|
|
},
|
|
"publishConfig": {
|
|
"access": "public"
|
|
},
|
|
"scripts": {
|
|
"build": "tsdown",
|
|
"dev": "tsdown --watch",
|
|
"test": "vitest run",
|
|
"test:watch": "vitest",
|
|
"check-types": "tsc --noEmit",
|
|
"generate-graphql-schema": "rm -rf __snapshots__ && ts-node --transpile-only ./scripts/generate-gql-schema.ts",
|
|
"link:global": "pnpm link --global",
|
|
"unlink:global": "pnpm unlink --global",
|
|
"publint": "publint .",
|
|
"attw": "attw --pack . --profile node16"
|
|
},
|
|
"dependencies": {
|
|
"@ag-ui/a2ui-middleware": "0.0.2",
|
|
"@ag-ui/client": "0.0.51",
|
|
"@ag-ui/core": "0.0.51",
|
|
"@ag-ui/encoder": "0.0.51",
|
|
"@ag-ui/langgraph": "^0.0.26",
|
|
"@ag-ui/mcp-apps-middleware": "0.0.2",
|
|
"@ai-sdk/anthropic": "^3.0.49",
|
|
"@ai-sdk/google": "^3.0.33",
|
|
"@ai-sdk/google-vertex": "^3.0.97",
|
|
"@ai-sdk/mcp": "^1.0.21",
|
|
"@ai-sdk/openai": "^3.0.36",
|
|
"@copilotkit/license-verifier": "0.0.1-a1",
|
|
"@copilotkit/shared": "workspace:*",
|
|
"@graphql-yoga/plugin-defer-stream": "^3.3.1",
|
|
"@hono/node-server": "^1.13.5",
|
|
"@modelcontextprotocol/sdk": "^1.18.2",
|
|
"@remix-run/node-fetch-server": "^0.13.0",
|
|
"@scarf/scarf": "^1.3.0",
|
|
"@segment/analytics-node": "^2.1.2",
|
|
"ai": "^6.0.104",
|
|
"class-transformer": "^0.5.1",
|
|
"class-validator": "^0.14.1",
|
|
"cors": "^2.8.5",
|
|
"express": "^4.21.2",
|
|
"graphql": "^16.8.1",
|
|
"graphql-scalars": "^1.23.0",
|
|
"graphql-yoga": "^5.3.1",
|
|
"hono": "^4.11.4",
|
|
"openai": "^4.85.1",
|
|
"partial-json": "^0.1.7",
|
|
"phoenix": "^1.8.4",
|
|
"pino": "^9.2.0",
|
|
"pino-pretty": "^11.2.1",
|
|
"reflect-metadata": "^0.2.2",
|
|
"rxjs": "7.8.1",
|
|
"type-graphql": "2.0.0-rc.1",
|
|
"uuid": "^10.0.0",
|
|
"ws": "^8.18.0",
|
|
"zod": "^3.23.3"
|
|
},
|
|
"devDependencies": {
|
|
"@swc/core": "1.5.28",
|
|
"@types/cors": "^2.8.17",
|
|
"@types/express": "^4.17.21",
|
|
"@types/node": "^18.11.17",
|
|
"@types/phoenix": "^1.6.6",
|
|
"@valibot/to-json-schema": "^1.5.0",
|
|
"@vitest/coverage-v8": "^3.2.4",
|
|
"@whatwg-node/server": "^0.9.34",
|
|
"arktype": "^2.1.29",
|
|
"elysia": "^1.2.25",
|
|
"eslint": "^8.56.0",
|
|
"nodemon": "^3.1.3",
|
|
"supertest": "^7.1.1",
|
|
"ts-node": "^10.9.2",
|
|
"tsconfig": "workspace:*",
|
|
"tsdown": "^0.20.3",
|
|
"typescript": "^5.2.3",
|
|
"valibot": "^1.2.0",
|
|
"vitest": "^3.2.4"
|
|
},
|
|
"peerDependencies": {
|
|
"@anthropic-ai/sdk": "^0.57.0",
|
|
"@langchain/aws": ">=0.1.9",
|
|
"@langchain/community": ">=0.3.58",
|
|
"@langchain/core": ">=0.3.66",
|
|
"@langchain/google-gauth": ">=0.1.0",
|
|
"@langchain/langgraph-sdk": ">=0.1.2",
|
|
"@langchain/openai": ">=0.4.2",
|
|
"groq-sdk": ">=0.3.0 <1.0.0",
|
|
"langchain": ">=0.3.3"
|
|
},
|
|
"peerDependenciesMeta": {
|
|
"@anthropic-ai/sdk": {
|
|
"optional": true
|
|
},
|
|
"@langchain/aws": {
|
|
"optional": true
|
|
},
|
|
"@langchain/community": {
|
|
"optional": true
|
|
},
|
|
"@langchain/google-gauth": {
|
|
"optional": true
|
|
},
|
|
"@langchain/langgraph-sdk": {
|
|
"optional": true
|
|
},
|
|
"@langchain/openai": {
|
|
"optional": true
|
|
},
|
|
"groq-sdk": {
|
|
"optional": true
|
|
},
|
|
"langchain": {
|
|
"optional": true
|
|
},
|
|
"openai": {
|
|
"optional": true
|
|
}
|
|
},
|
|
"nx": {
|
|
"targets": {
|
|
"build": {
|
|
"dependsOn": [
|
|
"generate-graphql-schema",
|
|
"^build"
|
|
]
|
|
}
|
|
}
|
|
}
|
|
}
|