> ## Documentation Index
> Fetch the complete documentation index at: https://docs.platform.decart.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# Overview

> A JavaScript SDK for Decart's models

<Card title="GitHub" icon="github" href="https://github.com/DecartAI/sdk">
  View source code and contribute
</Card>

## Installation

```bash theme={null}
npm install @decartai/sdk
# or
pnpm add @decartai/sdk
# or
yarn add @decartai/sdk
```

## Quick Start

```typescript theme={null}
import { createDecartClient, models } from "@decartai/sdk";
import { writeFileSync } from "fs";

const client = createDecartClient({
  apiKey: process.env.DECART_API_KEY,
});

// Edit a video using the Queue API
const result = await client.queue.submitAndPoll({
  model: models.video("lucy-2.1"),
  data: videoFile,
  prompt: "Transform into anime style",
  resolution: "720p",
  onStatusChange: (job) => {
    console.log(`Status: ${job.status}`);
  },
});

if (result.status === "completed") {
  const buffer = Buffer.from(await result.data.arrayBuffer());
  writeFileSync("output.mp4", buffer);
  console.log("Video saved!");
}
```

## What can you build?

The SDK provides three main APIs for different use cases:

| If you need to...                   | Use          | Main method                    |
| ----------------------------------- | ------------ | ------------------------------ |
| Transform live streams over WebRTC  | Realtime API | `client.realtime.connect()`    |
| Generate/edit videos asynchronously | Queue API    | `client.queue.submitAndPoll()` |
| Generate/edit images synchronously  | Process API  | `client.process()`             |

<CardGroup cols={3}>
  <Card title="Realtime API" href="/sdks/javascript-realtime">
    Realtime video streams
  </Card>

  <Card title="Queue API" href="/sdks/javascript-queue">
    Video processing
  </Card>

  <Card title="Process API" href="/sdks/javascript-process">
    Image editing
  </Card>
</CardGroup>

<Tip>
  If you're building a browser app and want to avoid exposing API keys, route SDK calls through your backend proxy. See the proxy examples in `sdks/sdk/examples/nextjs-proxy` and `sdks/sdk/examples/express-proxy`.
</Tip>

## Client Setup

All APIs share the same client initialization:

```typescript theme={null}
import { createDecartClient } from "@decartai/sdk";

const client = createDecartClient({
  apiKey: process.env.DECART_API_KEY,
});
```

**Parameters:**

* `apiKey` (required) - Your Decart API key from the [platform](https://platform.decart.ai)
* `baseUrl` (optional) - Custom API endpoint (defaults to Decart's production API)
* `telemetry` (optional) - Enable SDK telemetry for realtime observability (default: `true`)

<Note>
  Store your API key in environment variables. Never commit API keys to version control.
</Note>

## Client Tokens

For client-side applications (browsers, mobile apps) using the Realtime API, create short-lived client tokens instead of exposing your permanent API key:

```typescript theme={null}
// On your backend — basic (60s TTL, unrestricted)
const { apiKey, expiresAt } = await client.tokens.create();

// Or scoped to specific models and origins with a longer TTL
const token = await client.tokens.create({
  expiresIn: 300,
  allowedModels: ["lucy-2.1"],
  allowedOrigins: ["https://app.example.com"], // browser-enforced; canonical origin
});
// Send token.apiKey to your frontend for secure client-side authentication
```

<Tip>
  See [Client Tokens](/getting-started/client-tokens) for details on secure realtime auth.
</Tip>

## Available Models

Import models from the SDK to use with either API:

```typescript theme={null}
import { models } from "@decartai/sdk";

// Realtime models
models.realtime("lucy-2.1");              // Realtime video editing (latest)
models.realtime("lucy-2.1-vton");         // Virtual try-on
models.realtime("lucy-restyle-2");        // Realtime video restyling

// Video models
models.video("lucy-2.1");                // Video editing (latest)
models.video("lucy-2.1-vton");           // Virtual try-on
models.video("lucy-restyle-2");          // Video restyling

// Image models
models.image("lucy-image-2");            // Image editing

// Latest aliases — always point to the newest version
models.realtime("lucy-latest");           // Latest realtime editing model
models.video("lucy-latest");              // Latest video editing model
models.video("lucy-vton-latest");         // Latest virtual try-on model
models.video("lucy-restyle-latest");      // Latest video restyling model
models.image("lucy-image-latest");        // Latest image editing model
```

<Accordion title="Previous generation models">
  ```typescript theme={null}
  // Video models
  models.video("lucy-clip");         // Lucy Clip
  ```
</Accordion>

## TypeScript Support

The SDK is written in TypeScript with full type definitions. Each model enforces its own required inputs, so you'll get autocomplete and helpful errors if something is missing.

```typescript theme={null}
// Video editing requires 'data' field
await client.queue.submitAndPoll({
  model: models.video("lucy-2.1"),
  prompt: "Transform into anime style",
  data: videoFile, // ✅ Required
});

// Image editing requires 'data' field
await client.process({
  model: models.image("lucy-image-2"),
  prompt: "Change the background to a beach",
  data: imageFile, // ✅ Required
});
```

## Ready to start building?

<CardGroup cols={3}>
  <Card title="Realtime API Guide" href="/sdks/javascript-realtime">
    **Build realtime experiences**

    Learn WebRTC integration, camera handling, and how to create interactive video applications.
  </Card>

  <Card title="Queue API Guide" href="/sdks/javascript-queue">
    **Video processing**

    Edit videos, control motion, and transform videos with style transfer.
  </Card>

  <Card title="Process API Guide" href="/sdks/javascript-process">
    **Image editing**

    Edit and transform images on-demand with synchronous processing.
  </Card>
</CardGroup>
