v0-sdk 0.0.8 → 0.0.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -29,6 +29,8 @@ pnpm add v0-sdk
29
29
 
30
30
  Get your API key from [v0.dev/chat/settings/keys](https://v0.dev/chat/settings/keys).
31
31
 
32
+ ### Create Chat and Generate Code
33
+
32
34
  ```typescript
33
35
  import { v0 } from 'v0-sdk'
34
36
 
@@ -41,6 +43,25 @@ const chat = await v0.chats.create({
41
43
  console.log(`Chat created: ${chat.url}`)
42
44
  ```
43
45
 
46
+ ### Preview Generated Code
47
+
48
+ ```typescript
49
+ // Get the latest version for live preview
50
+ const latestMessage = chat.messages[chat.messages.length - 1]
51
+ const versionId = latestMessage.id
52
+
53
+ // Get the iframe URL for live preview
54
+ const iframe = await v0.chats.findIframe({
55
+ chatId: chat.id,
56
+ versionId: versionId,
57
+ })
58
+
59
+ console.log(`Preview URL: ${iframe.url}`)
60
+
61
+ // Use in your application
62
+ const previewHtml = `<iframe src="${iframe.url}" width="100%" height="600px"></iframe>`
63
+ ```
64
+
44
65
  ## Authentication
45
66
 
46
67
  The client requires a v0 API key, which you can create at [v0.dev/chat/settings/keys](https://v0.dev/chat/settings/keys).
@@ -89,6 +110,32 @@ const response = await v0.chats.createMessage({
89
110
  })
90
111
  ```
91
112
 
113
+ ### Live Preview with iframes
114
+
115
+ One of the most powerful features of the v0 SDK is the ability to render live previews of generated code using iframes. This allows you to see the AI-generated components and applications running in real-time.
116
+
117
+ ```typescript
118
+ // Create a chat and get the generated code
119
+ const chat = await v0.chats.create({
120
+ message: 'Create a todo app with React',
121
+ })
122
+
123
+ // Get the latest version from the chat messages
124
+ const latestMessage = chat.messages[chat.messages.length - 1]
125
+ const versionId = latestMessage.id // or extract from chat.latestBlockId
126
+
127
+ // Get the iframe URL for live preview
128
+ const iframe = await v0.chats.findIframe({
129
+ chatId: chat.id,
130
+ versionId: versionId,
131
+ })
132
+
133
+ console.log(`Preview URL: ${iframe.url}`)
134
+
135
+ // Use in your application
136
+ const previewHtml = `<iframe src="${iframe.url}" width="100%" height="600px"></iframe>`
137
+ ```
138
+
92
139
  #### Other Chat Operations
93
140
 
94
141
  - `v0.chats.find()` - Get chat history
package/dist/index.d.ts CHANGED
@@ -8,7 +8,10 @@ type ChatDetail = {
8
8
  updatedAt?: string;
9
9
  favorite: boolean;
10
10
  authorId: string;
11
- latestBlockId?: string;
11
+ latestVersion?: {
12
+ id: string;
13
+ status: 'pending' | 'completed' | 'failed';
14
+ };
12
15
  messages: {
13
16
  id: string;
14
17
  object: 'message';
@@ -17,7 +20,7 @@ type ChatDetail = {
17
20
  type: 'message' | 'refinement' | 'forked-block' | 'forked-chat' | 'open-in-v0' | 'added-environment-variables' | 'added-integration' | 'deleted-file' | 'moved-file' | 'renamed-file' | 'edited-file' | 'replace-src' | 'reverted-block' | 'fix-with-v0' | 'sync-git';
18
21
  }[];
19
22
  };
20
- interface ChatSummary {
23
+ type ChatSummary = {
21
24
  id: string;
22
25
  object: 'chat';
23
26
  shareable: boolean;
@@ -26,8 +29,11 @@ interface ChatSummary {
26
29
  updatedAt: string;
27
30
  favorite: boolean;
28
31
  authorId: string;
29
- latestVersionId?: string;
30
- }
32
+ latestVersion?: {
33
+ id: string;
34
+ status: 'pending' | 'completed' | 'failed';
35
+ };
36
+ };
31
37
  type MessageDetail = {
32
38
  id: string;
33
39
  object: 'message';
@@ -123,7 +129,7 @@ interface ChatsFavoriteResponse {
123
129
  favorited: boolean;
124
130
  }
125
131
  interface ChatsForkRequest {
126
- versionId: string;
132
+ versionId?: string;
127
133
  }
128
134
  type ChatsForkResponse = ChatDetail;
129
135
  type ProjectsGetByChatIdResponse = ProjectDetail;
@@ -353,3 +359,4 @@ declare const v0: {
353
359
  };
354
360
 
355
361
  export { v0 };
362
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sources":["../src/sdk/v0.ts"],"sourcesContent":["import { fetcher } from './core'\n\nexport type ChatDetail = {\n id: string\n object: 'chat'\n url: string\n shareable: boolean\n privacy?: 'public' | 'private' | 'team' | 'team-edit' | 'unlisted'\n title?: string\n updatedAt?: string\n favorite: boolean\n authorId: string\n latestVersion?: {\n id: string\n status: 'pending' | 'completed' | 'failed'\n }\n messages: {\n id: string\n object: 'message'\n content: string\n createdAt: string\n type:\n | 'message'\n | 'refinement'\n | 'forked-block'\n | 'forked-chat'\n | 'open-in-v0'\n | 'added-environment-variables'\n | 'added-integration'\n | 'deleted-file'\n | 'moved-file'\n | 'renamed-file'\n | 'edited-file'\n | 'replace-src'\n | 'reverted-block'\n | 'fix-with-v0'\n | 'sync-git'\n }[]\n}\n\nexport type ChatSummary = {\n id: string\n object: 'chat'\n shareable: boolean\n privacy: string\n title?: string\n updatedAt: string\n favorite: boolean\n authorId: string\n latestVersion?: {\n id: string\n status: 'pending' | 'completed' | 'failed'\n }\n}\n\nexport type MessageDetail = {\n id: string\n object: 'message'\n chatId: string\n url: string\n files?: {\n lang: string\n meta: Record<string, any>\n source: string\n }[]\n demo?: string\n text: string\n modelConfiguration: {\n modelId: 'v0-1.5-sm' | 'v0-1.5-md' | 'v0-1.5-lg'\n imageGenerations?: boolean\n thinking?: boolean\n }\n}\n\nexport interface ProjectDetail {\n id: string\n object: 'project'\n name: string\n vercelProjectId?: string\n}\n\nexport interface ProjectSummary {\n id: string\n object: 'project'\n name: string\n vercelProjectId?: string\n}\n\nexport interface ScopeSummary {\n id: string\n object: 'scope'\n name?: string\n}\n\nexport interface UserDetail {\n id: string\n object: 'user'\n name?: string\n email: string\n avatar: string\n}\n\nexport interface VercelProjectDetail {\n id: string\n object: 'vercel_project'\n name: string\n}\n\nexport interface ChatsCreateRequest {\n message: string\n attachments?: {\n url: string\n }[]\n system?: string\n chatPrivacy?: 'public' | 'private' | 'team-edit' | 'team' | 'unlisted'\n projectId?: string\n modelConfiguration?: {\n modelId: 'v0-1.5-sm' | 'v0-1.5-md' | 'v0-1.5-lg'\n imageGenerations?: boolean\n thinking?: boolean\n }\n}\n\nexport type ChatsCreateResponse = {\n id: string\n object: 'chat'\n url: string\n files?: {\n lang: string\n meta: Record<string, any>\n source: string\n }[]\n demo?: string\n text: string\n modelConfiguration: {\n modelId: 'v0-1.5-sm' | 'v0-1.5-md' | 'v0-1.5-lg'\n imageGenerations?: boolean\n thinking?: boolean\n }\n}\n\nexport interface ChatsFindResponse {\n object: 'list'\n data: ChatSummary[]\n}\n\nexport interface ChatsDeleteResponse {\n id: string\n object: 'chat'\n deleted: true\n}\n\nexport type ChatsGetByIdResponse = ChatDetail\n\nexport interface ChatsUpdateRequest {\n privacy?: 'public' | 'private' | 'team' | 'team-edit' | 'unlisted'\n}\n\nexport type ChatsUpdateResponse = ChatDetail\n\nexport interface ChatsFavoriteRequest {\n isFavorite: boolean\n}\n\nexport interface ChatsFavoriteResponse {\n id: string\n object: 'chat'\n favorited: boolean\n}\n\nexport interface ChatsForkRequest {\n versionId?: string\n}\n\nexport type ChatsForkResponse = ChatDetail\n\nexport type ProjectsGetByChatIdResponse = ProjectDetail\n\nexport interface ChatsCreateMessageRequest {\n message: string\n attachments?: {\n url: string\n }[]\n modelConfiguration?: {\n modelId: 'v0-1.5-sm' | 'v0-1.5-md' | 'v0-1.5-lg'\n imageGenerations?: boolean\n thinking?: boolean\n }\n}\n\nexport type ChatsCreateMessageResponse = MessageDetail\n\nexport interface ChatsFindIframeResponse {\n id: string\n object: 'iframe'\n url: string\n}\n\nexport interface ChatsGetVersionFrameTokenResponse {\n token: string\n}\n\nexport interface ChatsGetMetadataResponse {\n git: {\n branch: string\n commit: string\n }\n deployment: {\n id: string\n }\n project: {\n id: string\n name: string\n url: string\n }\n}\n\nexport interface ChatsUploadRequest {\n file: any\n}\n\nexport interface ChatsUploadResponse {\n url: string\n}\n\nexport type ChatsResumeResponse = MessageDetail\n\nexport interface DeploymentsFindLogsResponse {\n error?: string\n logs: string[]\n nextSince?: number\n}\n\nexport interface DeploymentsFindErrorsResponse {\n error?: string\n fullErrorText?: string\n errorType?: string\n formattedError?: string\n}\n\nexport interface IntegrationsVercelProjectsFindResponse {\n object: 'list'\n data: VercelProjectDetail[]\n}\n\nexport interface IntegrationsVercelProjectsCreateRequest {\n projectId: string\n name: string\n}\n\nexport type IntegrationsVercelProjectsCreateResponse = VercelProjectDetail\n\nexport interface ProjectsFindResponse {\n object: 'list'\n data: ProjectDetail[]\n}\n\nexport interface ProjectsCreateRequest {\n name: string\n description?: string\n icon?: string\n environmentVariables?: {\n key: string\n value: string\n }[]\n instructions?: string\n}\n\nexport type ProjectsCreateResponse = ProjectDetail\n\nexport interface ProjectsAssignRequest {\n chatId: string\n}\n\nexport interface ProjectsAssignResponse {\n object: 'project'\n id: string\n assigned: true\n}\n\nexport interface RateLimitsFindResponse {\n remaining?: number\n reset?: number\n limit: number\n}\n\nexport type UserGetResponse = UserDetail\n\nexport type UserGetBillingResponse =\n | {\n billingType: 'token'\n data: {\n plan: string\n billingMode?: 'test'\n role: string\n billingCycle: {\n start: number\n end: number\n }\n balance: {\n remaining: number\n total: number\n }\n onDemand: {\n balance: number\n blocks?: {\n expirationDate?: number\n effectiveDate: number\n originalBalance: number\n currentBalance: number\n }[]\n }\n }\n }\n | {\n billingType: 'legacy'\n data: {\n remaining?: number\n reset?: number\n limit: number\n }\n }\n\nexport interface UserGetPlanResponse {\n object: 'plan'\n plan: string\n billingCycle: {\n start: number\n end: number\n }\n balance: {\n remaining: number\n total: number\n }\n}\n\nexport interface UserGetScopesResponse {\n object: 'list'\n data: ScopeSummary[]\n}\n\nexport const v0 = {\n chats: {\n async create(params: ChatsCreateRequest): Promise<ChatsCreateResponse> {\n const body = {\n message: params.message,\n attachments: params.attachments,\n system: params.system,\n chatPrivacy: params.chatPrivacy,\n projectId: params.projectId,\n modelConfiguration: params.modelConfiguration,\n }\n return fetcher(`/chats`, 'POST', { body })\n },\n\n async find(params?: {\n limit?: string\n offset?: string\n isFavorite?: string\n }): Promise<ChatsFindResponse> {\n const query = params\n ? (Object.fromEntries(\n Object.entries({\n limit: params.limit,\n offset: params.offset,\n isFavorite: params.isFavorite,\n }).filter(([_, value]) => value !== undefined),\n ) as Record<string, string>)\n : {}\n const hasQuery = Object.keys(query).length > 0\n return fetcher(`/chats`, 'GET', { ...(hasQuery ? { query } : {}) })\n },\n\n async delete(params: { chatId: string }): Promise<ChatsDeleteResponse> {\n const pathParams = { chatId: params.chatId }\n return fetcher(`/chats/${pathParams.chatId}`, 'DELETE', { pathParams })\n },\n\n async getById(params: { chatId: string }): Promise<ChatsGetByIdResponse> {\n const pathParams = { chatId: params.chatId }\n return fetcher(`/chats/${pathParams.chatId}`, 'GET', { pathParams })\n },\n\n async update(\n params: { chatId: string } & ChatsUpdateRequest,\n ): Promise<ChatsUpdateResponse> {\n const pathParams = { chatId: params.chatId }\n const body = { privacy: params.privacy }\n return fetcher(`/chats/${pathParams.chatId}`, 'PATCH', {\n pathParams,\n body,\n })\n },\n\n async favorite(\n params: { chatId: string } & ChatsFavoriteRequest,\n ): Promise<ChatsFavoriteResponse> {\n const pathParams = { chatId: params.chatId }\n const body = { isFavorite: params.isFavorite }\n return fetcher(`/chats/${pathParams.chatId}/favorite`, 'PUT', {\n pathParams,\n body,\n })\n },\n\n async fork(\n params: { chatId: string } & ChatsForkRequest,\n ): Promise<ChatsForkResponse> {\n const pathParams = { chatId: params.chatId }\n const body = { versionId: params.versionId }\n return fetcher(`/chats/${pathParams.chatId}/fork`, 'POST', {\n pathParams,\n body,\n })\n },\n\n async createMessage(\n params: { chatId: string } & ChatsCreateMessageRequest,\n ): Promise<ChatsCreateMessageResponse> {\n const pathParams = { chatId: params.chatId }\n const body = {\n message: params.message,\n attachments: params.attachments,\n modelConfiguration: params.modelConfiguration,\n }\n return fetcher(`/chats/${pathParams.chatId}/messages`, 'POST', {\n pathParams,\n body,\n })\n },\n\n async findIframe(params: {\n chatId: string\n versionId: string\n }): Promise<ChatsFindIframeResponse> {\n const pathParams = { chatId: params.chatId, versionId: params.versionId }\n return fetcher(\n `/chats/${pathParams.chatId}/versions/${pathParams.versionId}/iframe`,\n 'GET',\n { pathParams },\n )\n },\n\n async getVersionFrameToken(params: {\n chatId: string\n versionId: string\n }): Promise<ChatsGetVersionFrameTokenResponse> {\n const pathParams = { chatId: params.chatId, versionId: params.versionId }\n return fetcher(\n `/chats/${pathParams.chatId}/versions/${pathParams.versionId}/frame-token`,\n 'GET',\n { pathParams },\n )\n },\n\n async getMetadata(params: {\n chatId: string\n }): Promise<ChatsGetMetadataResponse> {\n const pathParams = { chatId: params.chatId }\n return fetcher(`/chats/${pathParams.chatId}/metadata`, 'GET', {\n pathParams,\n })\n },\n\n async upload(\n params: { chatId: string } & ChatsUploadRequest,\n ): Promise<ChatsUploadResponse> {\n const pathParams = { chatId: params.chatId }\n const body = { file: params.file }\n return fetcher(`/chats/${pathParams.chatId}/upload`, 'POST', {\n pathParams,\n body,\n })\n },\n\n async resume(params: {\n chatId: string\n messageId: string\n }): Promise<ChatsResumeResponse> {\n const pathParams = { chatId: params.chatId, messageId: params.messageId }\n return fetcher(\n `/chats/${pathParams.chatId}/messages/${pathParams.messageId}/resume`,\n 'POST',\n { pathParams },\n )\n },\n },\n\n projects: {\n async getByChatId(params: {\n chatId: string\n }): Promise<ProjectsGetByChatIdResponse> {\n const pathParams = { chatId: params.chatId }\n return fetcher(`/chats/${pathParams.chatId}/project`, 'GET', {\n pathParams,\n })\n },\n\n async find(): Promise<ProjectsFindResponse> {\n return fetcher(`/projects`, 'GET', {})\n },\n\n async create(\n params: ProjectsCreateRequest,\n ): Promise<ProjectsCreateResponse> {\n const body = {\n name: params.name,\n description: params.description,\n icon: params.icon,\n environmentVariables: params.environmentVariables,\n instructions: params.instructions,\n }\n return fetcher(`/projects`, 'POST', { body })\n },\n\n async assign(\n params: { projectId: string } & ProjectsAssignRequest,\n ): Promise<ProjectsAssignResponse> {\n const pathParams = { projectId: params.projectId }\n const body = { chatId: params.chatId }\n return fetcher(`/projects/${pathParams.projectId}/assign`, 'POST', {\n pathParams,\n body,\n })\n },\n },\n\n deployments: {\n async findLogs(params: {\n deploymentId: string\n since?: string\n }): Promise<DeploymentsFindLogsResponse> {\n const pathParams = { deploymentId: params.deploymentId }\n const query = Object.fromEntries(\n Object.entries({\n since: params.since,\n }).filter(([_, value]) => value !== undefined),\n ) as Record<string, string>\n const hasQuery = Object.keys(query).length > 0\n return fetcher(`/deployments/${pathParams.deploymentId}/logs`, 'GET', {\n pathParams,\n ...(hasQuery ? { query } : {}),\n })\n },\n\n async findErrors(params: {\n deploymentId: string\n }): Promise<DeploymentsFindErrorsResponse> {\n const pathParams = { deploymentId: params.deploymentId }\n return fetcher(`/deployments/${pathParams.deploymentId}/errors`, 'GET', {\n pathParams,\n })\n },\n },\n\n integrations: {\n vercel: {\n projects: {\n async find(): Promise<IntegrationsVercelProjectsFindResponse> {\n return fetcher(`/integrations/vercel/projects`, 'GET', {})\n },\n\n async create(\n params: IntegrationsVercelProjectsCreateRequest,\n ): Promise<IntegrationsVercelProjectsCreateResponse> {\n const body = { projectId: params.projectId, name: params.name }\n return fetcher(`/integrations/vercel/projects`, 'POST', { body })\n },\n },\n },\n },\n\n rateLimits: {\n async find(params?: { scope?: string }): Promise<RateLimitsFindResponse> {\n const query = params\n ? (Object.fromEntries(\n Object.entries({\n scope: params.scope,\n }).filter(([_, value]) => value !== undefined),\n ) as Record<string, string>)\n : {}\n const hasQuery = Object.keys(query).length > 0\n return fetcher(`/rate-limits`, 'GET', { ...(hasQuery ? { query } : {}) })\n },\n },\n\n user: {\n async get(): Promise<UserGetResponse> {\n return fetcher(`/user`, 'GET', {})\n },\n\n async getBilling(params?: {\n scope?: string\n }): Promise<UserGetBillingResponse> {\n const query = params\n ? (Object.fromEntries(\n Object.entries({\n scope: params.scope,\n }).filter(([_, value]) => value !== undefined),\n ) as Record<string, string>)\n : {}\n const hasQuery = Object.keys(query).length > 0\n return fetcher(`/user/billing`, 'GET', { ...(hasQuery ? { query } : {}) })\n },\n\n async getPlan(): Promise<UserGetPlanResponse> {\n return fetcher(`/user/plan`, 'GET', {})\n },\n\n async getScopes(): Promise<UserGetScopesResponse> {\n return fetcher(`/user/scopes`, 'GET', {})\n },\n },\n}\n"],"names":[],"mappings":"AAAO;AACP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO;AACP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO;AACP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO;AACP;AACA;AACA;AACA;AACA;AAOO;AACP;AACA;AACA;AACA;AACO;AACP;AACA;AACA;AACA;AACA;AACA;AACO;AACP;AACA;AACA;AACA;AACO;AACP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO;AACP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO;AACP;AACA;AACA;AACO;AACP;AACA;AACA;AACA;AACO;AACA;AACP;AACA;AACO;AACA;AACP;AACA;AACO;AACP;AACA;AACA;AACA;AACO;AACP;AACA;AACO;AACA;AACA;AACP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO;AACA;AACP;AACA;AACA;AACA;AACO;AACP;AACA;AACO;AACP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO;AACP;AACA;AACO;AACP;AACA;AACO;AACA;AACP;AACA;AACA;AACA;AACO;AACP;AACA;AACA;AACA;AACA;AACO;AACP;AACA;AACA;AACO;AACP;AACA;AACA;AACO;AACA;AACP;AACA;AACA;AACO;AACP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO;AACA;AACP;AACA;AACO;AACP;AACA;AACA;AACA;AACO;AACP;AACA;AACA;AACA;AACO;AACA;AACP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO;AACP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO;AACP;AACA;AACA;AACO;AACP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "v0-sdk",
3
- "version": "0.0.8",
3
+ "version": "0.0.9",
4
4
  "description": "TypeScript SDK for the v0 Chats API",
5
5
  "type": "module",
6
6
  "main": "dist/index.js",
@@ -38,6 +38,12 @@
38
38
  "bunchee": "^6.5.2",
39
39
  "prettier": "^3.3.3",
40
40
  "tsx": "^4.19.2",
41
- "typescript": "5.7.3"
41
+ "typescript": "5.7.3",
42
+ "vitest": "^3.2.4"
43
+ },
44
+ "prettier": {
45
+ "semi": false,
46
+ "singleQuote": true,
47
+ "trailingComma": "all"
42
48
  }
43
49
  }