@an-sdk/nextjs 0.0.1

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 AN Dev (an.dev)
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,147 @@
+# @an-sdk/nextjs
+
+Next.js integration for [AN](https://an.dev) AI agent chat. Provides a server-side token handler so your API key never reaches the client.
+
+## Install
+
+```bash
+npm install @an-sdk/nextjs @an-sdk/react ai @ai-sdk/react
+```
+
+## Quick Start
+
+### 1. Set your API key
+
+```env
+# .env.local
+AN_API_KEY=an_sk_your_key_here
+```
+
+Get your API key from [an.dev/agents/dashboard/api](https://an.dev/agents/dashboard/api).
+
+### 2. Create the token route (one line)
+
+```ts
+// app/api/an/token/route.ts
+import { createAnTokenHandler } from "@an-sdk/nextjs/server"
+
+export const POST = createAnTokenHandler({
+  apiKey: process.env.AN_API_KEY!,
+})
+```
+
+### 3. Use in your page
+
+```tsx
+// app/page.tsx
+"use client"
+
+import { useChat } from "@ai-sdk/react"
+import { AnAgentChat, createAnChat } from "@an-sdk/nextjs"
+import "@an-sdk/react/styles.css"
+import { useMemo } from "react"
+
+export default function Chat() {
+  const chat = useMemo(
+    () => createAnChat({
+      agent: "your-agent-slug",
+      tokenUrl: "/api/an/token",
+    }),
+    [],
+  )
+
+  const { messages, sendMessage, status, stop, error } = useChat({ chat })
+
+  return (
+    <AnAgentChat
+      messages={messages}
+      onSend={(msg) =>
+        sendMessage({ parts: [{ type: "text", text: msg.content }] })
+      }
+      status={status}
+      onStop={stop}
+      error={error}
+    />
+  )
+}
+```
+
+That's it. Your `an_sk_` API key stays on the server. The client only receives short-lived JWTs.
+
+## How It Works
+
+```
+Browser                     Your Next.js Server              AN Relay
+  |                                |                            |
+  |-- POST /api/an/token --------->|                            |
+  |                                |-- POST /v1/tokens -------->|
+  |                                |   (with an_sk_ key)        |
+  |                                |<-- { token, expiresAt } ---|
+  |<-- { token, expiresAt } ------|                            |
+  |                                                             |
+  |-- POST /v1/chat/:agent ------(with short-lived JWT)------->|
+  |<-- streaming response -----(SSE)---------------------------|
+```
+
+## Adding Your Own Auth
+
+For custom auth (Clerk, NextAuth, etc.), use `exchangeToken` directly:
+
+```ts
+// app/api/an/token/route.ts
+import { auth } from "@clerk/nextjs/server"
+import { exchangeToken } from "@an-sdk/nextjs/server"
+
+export async function POST(req: Request) {
+  const { userId } = await auth()
+  if (!userId) {
+    return Response.json({ error: "Unauthorized" }, { status: 401 })
+  }
+
+  const { agent } = await req.json()
+
+  const data = await exchangeToken({
+    apiKey: process.env.AN_API_KEY!,
+    agent,
+    userId,
+  })
+
+  return Response.json(data)
+}
+```
+
+## API
+
+### `createAnTokenHandler(options)` — Server
+
+Creates a Next.js `POST` route handler.
+
+| Option | Type | Default | Description |
+|--------|------|---------|-------------|
+| `apiKey` | `string` | required | Your `an_sk_` API key |
+| `relayUrl` | `string` | `"https://relay.an.dev"` | Relay API URL |
+| `expiresIn` | `string` | `"1h"` | Token expiry |
+
+### `exchangeToken(options)` — Server
+
+Low-level function to exchange an API key for a JWT.
+
+```ts
+const { token, expiresAt } = await exchangeToken({
+  apiKey: process.env.AN_API_KEY!,
+  agent: "my-agent",
+  userId: "user-123",
+})
+```
+
+### Re-exports
+
+`@an-sdk/nextjs` re-exports everything from `@an-sdk/react`:
+
+```ts
+import { AnAgentChat, createAnChat, applyTheme } from "@an-sdk/nextjs"
+```
+
+## License
+
+MIT

package/dist/index.cjs

@@ -0,0 +1,25 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.ts
+var src_exports = {};
+module.exports = __toCommonJS(src_exports);
+__reExport(src_exports, require("@an-sdk/react"), module.exports);
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  ...require("@an-sdk/react")
+});
+//# sourceMappingURL=index.cjs.map

package/dist/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/index.ts"],"sourcesContent":["// Re-export everything from @an-sdk/react for convenience\nexport * from \"@an-sdk/react\"\n"],"mappings":";;;;;;;;;;;;;;;;;AAAA;AAAA;AACA,wBAAc,0BADd;","names":[]}

package/dist/index.d.cts

@@ -0,0 +1 @@
+export * from '@an-sdk/react';

package/dist/index.d.ts

@@ -0,0 +1 @@
+export * from '@an-sdk/react';

package/dist/index.js

@@ -0,0 +1,3 @@
+// src/index.ts
+export * from "@an-sdk/react";
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/index.ts"],"sourcesContent":["// Re-export everything from @an-sdk/react for convenience\nexport * from \"@an-sdk/react\"\n"],"mappings":";AACA,cAAc;","names":[]}

package/dist/server.cjs

@@ -0,0 +1,71 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/server.ts
+var server_exports = {};
+__export(server_exports, {
+  createAnTokenHandler: () => createAnTokenHandler,
+  exchangeToken: () => exchangeToken
+});
+module.exports = __toCommonJS(server_exports);
+async function exchangeToken(options) {
+  const {
+    apiKey,
+    relayUrl = "https://relay.an.dev",
+    expiresIn = "1h",
+    agent,
+    userId
+  } = options;
+  const res = await fetch(`${relayUrl}/v1/tokens`, {
+    method: "POST",
+    headers: {
+      "Content-Type": "application/json",
+      Authorization: `Bearer ${apiKey}`
+    },
+    body: JSON.stringify({
+      userId,
+      agents: agent ? [agent] : void 0,
+      expiresIn
+    })
+  });
+  if (!res.ok) {
+    const err = await res.json().catch(() => ({ error: "Failed to exchange token" }));
+    throw new Error(err.error || `Token exchange failed: ${res.status}`);
+  }
+  return res.json();
+}
+function createAnTokenHandler(options) {
+  return async function POST(req) {
+    try {
+      const body = await req.json().catch(() => ({}));
+      const { agent, userId } = body;
+      const data = await exchangeToken({ ...options, agent, userId });
+      return Response.json(data);
+    } catch (err) {
+      const message = err instanceof Error ? err.message : "Internal error";
+      return Response.json({ error: message }, { status: 500 });
+    }
+  };
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  createAnTokenHandler,
+  exchangeToken
+});
+//# sourceMappingURL=server.cjs.map

package/dist/server.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/server.ts"],"sourcesContent":["export interface TokenHandlerOptions {\n  /** Your an_sk_ API key — keep in process.env, never expose to client */\n  apiKey: string\n  /** Relay URL. Default: \"https://relay.an.dev\" */\n  relayUrl?: string\n  /** Token expiry. Default: \"1h\" */\n  expiresIn?: string\n}\n\nexport interface ExchangeTokenOptions extends TokenHandlerOptions {\n  /** Agent slug to scope the token to */\n  agent?: string\n  /** User identifier for the token */\n  userId?: string\n}\n\n/** Exchange an an_sk_ API key for a short-lived JWT via the relay */\nexport async function exchangeToken(options: ExchangeTokenOptions) {\n  const {\n    apiKey,\n    relayUrl = \"https://relay.an.dev\",\n    expiresIn = \"1h\",\n    agent,\n    userId,\n  } = options\n\n  const res = await fetch(`${relayUrl}/v1/tokens`, {\n    method: \"POST\",\n    headers: {\n      \"Content-Type\": \"application/json\",\n      Authorization: `Bearer ${apiKey}`,\n    },\n    body: JSON.stringify({\n      userId,\n      agents: agent ? [agent] : undefined,\n      expiresIn,\n    }),\n  })\n\n  if (!res.ok) {\n    const err = await res.json().catch(() => ({ error: \"Failed to exchange token\" }))\n    throw new Error(err.error || `Token exchange failed: ${res.status}`)\n  }\n\n  return res.json() as Promise<{ token: string; expiresAt: string }>\n}\n\n/** Create a Next.js API route handler that exchanges an_sk_ keys for JWTs */\nexport function createAnTokenHandler(options: TokenHandlerOptions) {\n  return async function POST(req: Request) {\n    try {\n      const body = await req.json().catch(() => ({}))\n      const { agent, userId } = body as { agent?: string; userId?: string }\n\n      const data = await exchangeToken({ ...options, agent, userId })\n      return Response.json(data)\n    } catch (err) {\n      const message = err instanceof Error ? err.message : \"Internal error\"\n      return Response.json({ error: message }, { status: 500 })\n    }\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAiBA,eAAsB,cAAc,SAA+B;AACjE,QAAM;AAAA,IACJ;AAAA,IACA,WAAW;AAAA,IACX,YAAY;AAAA,IACZ;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,QAAM,MAAM,MAAM,MAAM,GAAG,QAAQ,cAAc;AAAA,IAC/C,QAAQ;AAAA,IACR,SAAS;AAAA,MACP,gBAAgB;AAAA,MAChB,eAAe,UAAU,MAAM;AAAA,IACjC;AAAA,IACA,MAAM,KAAK,UAAU;AAAA,MACnB;AAAA,MACA,QAAQ,QAAQ,CAAC,KAAK,IAAI;AAAA,MAC1B;AAAA,IACF,CAAC;AAAA,EACH,CAAC;AAED,MAAI,CAAC,IAAI,IAAI;AACX,UAAM,MAAM,MAAM,IAAI,KAAK,EAAE,MAAM,OAAO,EAAE,OAAO,2BAA2B,EAAE;AAChF,UAAM,IAAI,MAAM,IAAI,SAAS,0BAA0B,IAAI,MAAM,EAAE;AAAA,EACrE;AAEA,SAAO,IAAI,KAAK;AAClB;AAGO,SAAS,qBAAqB,SAA8B;AACjE,SAAO,eAAe,KAAK,KAAc;AACvC,QAAI;AACF,YAAM,OAAO,MAAM,IAAI,KAAK,EAAE,MAAM,OAAO,CAAC,EAAE;AAC9C,YAAM,EAAE,OAAO,OAAO,IAAI;AAE1B,YAAM,OAAO,MAAM,cAAc,EAAE,GAAG,SAAS,OAAO,OAAO,CAAC;AAC9D,aAAO,SAAS,KAAK,IAAI;AAAA,IAC3B,SAAS,KAAK;AACZ,YAAM,UAAU,eAAe,QAAQ,IAAI,UAAU;AACrD,aAAO,SAAS,KAAK,EAAE,OAAO,QAAQ,GAAG,EAAE,QAAQ,IAAI,CAAC;AAAA,IAC1D;AAAA,EACF;AACF;","names":[]}

package/dist/server.d.cts

@@ -0,0 +1,23 @@
+interface TokenHandlerOptions {
+    /** Your an_sk_ API key — keep in process.env, never expose to client */
+    apiKey: string;
+    /** Relay URL. Default: "https://relay.an.dev" */
+    relayUrl?: string;
+    /** Token expiry. Default: "1h" */
+    expiresIn?: string;
+}
+interface ExchangeTokenOptions extends TokenHandlerOptions {
+    /** Agent slug to scope the token to */
+    agent?: string;
+    /** User identifier for the token */
+    userId?: string;
+}
+/** Exchange an an_sk_ API key for a short-lived JWT via the relay */
+declare function exchangeToken(options: ExchangeTokenOptions): Promise<{
+    token: string;
+    expiresAt: string;
+}>;
+/** Create a Next.js API route handler that exchanges an_sk_ keys for JWTs */
+declare function createAnTokenHandler(options: TokenHandlerOptions): (req: Request) => Promise<Response>;
+
+export { type ExchangeTokenOptions, type TokenHandlerOptions, createAnTokenHandler, exchangeToken };

package/dist/server.d.ts

@@ -0,0 +1,23 @@
+interface TokenHandlerOptions {
+    /** Your an_sk_ API key — keep in process.env, never expose to client */
+    apiKey: string;
+    /** Relay URL. Default: "https://relay.an.dev" */
+    relayUrl?: string;
+    /** Token expiry. Default: "1h" */
+    expiresIn?: string;
+}
+interface ExchangeTokenOptions extends TokenHandlerOptions {
+    /** Agent slug to scope the token to */
+    agent?: string;
+    /** User identifier for the token */
+    userId?: string;
+}
+/** Exchange an an_sk_ API key for a short-lived JWT via the relay */
+declare function exchangeToken(options: ExchangeTokenOptions): Promise<{
+    token: string;
+    expiresAt: string;
+}>;
+/** Create a Next.js API route handler that exchanges an_sk_ keys for JWTs */
+declare function createAnTokenHandler(options: TokenHandlerOptions): (req: Request) => Promise<Response>;
+
+export { type ExchangeTokenOptions, type TokenHandlerOptions, createAnTokenHandler, exchangeToken };

package/dist/server.js

@@ -0,0 +1,45 @@
+// src/server.ts
+async function exchangeToken(options) {
+  const {
+    apiKey,
+    relayUrl = "https://relay.an.dev",
+    expiresIn = "1h",
+    agent,
+    userId
+  } = options;
+  const res = await fetch(`${relayUrl}/v1/tokens`, {
+    method: "POST",
+    headers: {
+      "Content-Type": "application/json",
+      Authorization: `Bearer ${apiKey}`
+    },
+    body: JSON.stringify({
+      userId,
+      agents: agent ? [agent] : void 0,
+      expiresIn
+    })
+  });
+  if (!res.ok) {
+    const err = await res.json().catch(() => ({ error: "Failed to exchange token" }));
+    throw new Error(err.error || `Token exchange failed: ${res.status}`);
+  }
+  return res.json();
+}
+function createAnTokenHandler(options) {
+  return async function POST(req) {
+    try {
+      const body = await req.json().catch(() => ({}));
+      const { agent, userId } = body;
+      const data = await exchangeToken({ ...options, agent, userId });
+      return Response.json(data);
+    } catch (err) {
+      const message = err instanceof Error ? err.message : "Internal error";
+      return Response.json({ error: message }, { status: 500 });
+    }
+  };
+}
+export {
+  createAnTokenHandler,
+  exchangeToken
+};
+//# sourceMappingURL=server.js.map

package/dist/server.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/server.ts"],"sourcesContent":["export interface TokenHandlerOptions {\n  /** Your an_sk_ API key — keep in process.env, never expose to client */\n  apiKey: string\n  /** Relay URL. Default: \"https://relay.an.dev\" */\n  relayUrl?: string\n  /** Token expiry. Default: \"1h\" */\n  expiresIn?: string\n}\n\nexport interface ExchangeTokenOptions extends TokenHandlerOptions {\n  /** Agent slug to scope the token to */\n  agent?: string\n  /** User identifier for the token */\n  userId?: string\n}\n\n/** Exchange an an_sk_ API key for a short-lived JWT via the relay */\nexport async function exchangeToken(options: ExchangeTokenOptions) {\n  const {\n    apiKey,\n    relayUrl = \"https://relay.an.dev\",\n    expiresIn = \"1h\",\n    agent,\n    userId,\n  } = options\n\n  const res = await fetch(`${relayUrl}/v1/tokens`, {\n    method: \"POST\",\n    headers: {\n      \"Content-Type\": \"application/json\",\n      Authorization: `Bearer ${apiKey}`,\n    },\n    body: JSON.stringify({\n      userId,\n      agents: agent ? [agent] : undefined,\n      expiresIn,\n    }),\n  })\n\n  if (!res.ok) {\n    const err = await res.json().catch(() => ({ error: \"Failed to exchange token\" }))\n    throw new Error(err.error || `Token exchange failed: ${res.status}`)\n  }\n\n  return res.json() as Promise<{ token: string; expiresAt: string }>\n}\n\n/** Create a Next.js API route handler that exchanges an_sk_ keys for JWTs */\nexport function createAnTokenHandler(options: TokenHandlerOptions) {\n  return async function POST(req: Request) {\n    try {\n      const body = await req.json().catch(() => ({}))\n      const { agent, userId } = body as { agent?: string; userId?: string }\n\n      const data = await exchangeToken({ ...options, agent, userId })\n      return Response.json(data)\n    } catch (err) {\n      const message = err instanceof Error ? err.message : \"Internal error\"\n      return Response.json({ error: message }, { status: 500 })\n    }\n  }\n}\n"],"mappings":";AAiBA,eAAsB,cAAc,SAA+B;AACjE,QAAM;AAAA,IACJ;AAAA,IACA,WAAW;AAAA,IACX,YAAY;AAAA,IACZ;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,QAAM,MAAM,MAAM,MAAM,GAAG,QAAQ,cAAc;AAAA,IAC/C,QAAQ;AAAA,IACR,SAAS;AAAA,MACP,gBAAgB;AAAA,MAChB,eAAe,UAAU,MAAM;AAAA,IACjC;AAAA,IACA,MAAM,KAAK,UAAU;AAAA,MACnB;AAAA,MACA,QAAQ,QAAQ,CAAC,KAAK,IAAI;AAAA,MAC1B;AAAA,IACF,CAAC;AAAA,EACH,CAAC;AAED,MAAI,CAAC,IAAI,IAAI;AACX,UAAM,MAAM,MAAM,IAAI,KAAK,EAAE,MAAM,OAAO,EAAE,OAAO,2BAA2B,EAAE;AAChF,UAAM,IAAI,MAAM,IAAI,SAAS,0BAA0B,IAAI,MAAM,EAAE;AAAA,EACrE;AAEA,SAAO,IAAI,KAAK;AAClB;AAGO,SAAS,qBAAqB,SAA8B;AACjE,SAAO,eAAe,KAAK,KAAc;AACvC,QAAI;AACF,YAAM,OAAO,MAAM,IAAI,KAAK,EAAE,MAAM,OAAO,CAAC,EAAE;AAC9C,YAAM,EAAE,OAAO,OAAO,IAAI;AAE1B,YAAM,OAAO,MAAM,cAAc,EAAE,GAAG,SAAS,OAAO,OAAO,CAAC;AAC9D,aAAO,SAAS,KAAK,IAAI;AAAA,IAC3B,SAAS,KAAK;AACZ,YAAM,UAAU,eAAe,QAAQ,IAAI,UAAU;AACrD,aAAO,SAAS,KAAK,EAAE,OAAO,QAAQ,GAAG,EAAE,QAAQ,IAAI,CAAC;AAAA,IAC1D;AAAA,EACF;AACF;","names":[]}

package/package.json

@@ -0,0 +1,72 @@
+{
+  "name": "@an-sdk/nextjs",
+  "version": "0.0.1",
+  "license": "MIT",
+  "description": "Next.js integration for AN AI agent chat — server-side token handler",
+  "homepage": "https://an.dev",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/21st-dev/an-sdk"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "type": "module",
+  "exports": {
+    ".": {
+      "import": {
+        "types": "./dist/index.d.ts",
+        "default": "./dist/index.js"
+      },
+      "require": {
+        "types": "./dist/index.d.cts",
+        "default": "./dist/index.cjs"
+      }
+    },
+    "./server": {
+      "import": {
+        "types": "./dist/server.d.ts",
+        "default": "./dist/server.js"
+      },
+      "require": {
+        "types": "./dist/server.d.cts",
+        "default": "./dist/server.cjs"
+      }
+    }
+  },
+  "files": [
+    "dist",
+    "LICENSE",
+    "README.md"
+  ],
+  "keywords": [
+    "nextjs",
+    "react",
+    "ai",
+    "agent",
+    "chat",
+    "ai-sdk",
+    "an",
+    "an.dev"
+  ],
+  "scripts": {
+    "build": "tsup",
+    "lint": "tsc --noEmit"
+  },
+  "dependencies": {
+    "@an-sdk/react": "^0.1.0"
+  },
+  "peerDependencies": {
+    "next": ">=14.0.0",
+    "react": "^18.0.0 || ^19.0.0",
+    "react-dom": "^18.0.0 || ^19.0.0"
+  },
+  "devDependencies": {
+    "@types/react": "^19.0.0",
+    "next": "^15.0.0",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
+    "tsup": "^8.0.0",
+    "typescript": "^5.4.5"
+  }
+}