DEV Community

Cover image for Actionpackd AI SDK: 2 Lines to Typed, Streaming AI Magic
Ramasundaram S
Ramasundaram S

Posted on

Actionpackd AI SDK: 2 Lines to Typed, Streaming AI Magic

#ai #typescript #webdev #opensource

AI is everywhere right now — but if you’ve ever tried building an AI-powered app, you know the pain:

  • Outputs that almost look like JSON but break your parser.
  • Copy-pasted prompts scattered across files.
  • Swapping providers means rewriting your whole app.
  • Demos that look cool on Twitter but break in production.

We built Actionpackd AI SDK to fix this. It’s tiny, schema-first, and developer-delightful — designed to make building AI apps fun again.

🚀 What is it?

Actionpackd AI SDK is an open-source toolkit for working with large language models (LLMs). It gives you:

  • serverCompose → safe, schema-validated AI calls (goodbye brittle JSON parsing).
  • useCompose → stream tokens into your UI, with structured events mid-stream.
  • flowBuilder → orchestrate multi-step flows with retries and typed outputs.
  • Mocks included → demo instantly, no API keys required.

👉 And the best part: you can get started in just 2 lines.

⚡ Quickstart (2 lines to magic)

Install:

npm install @actionpackd/sdk-core zod
Enter fullscreen mode Exit fullscreen mode

Use it:

import { createProvider, serverCompose } from '@actionpackd/sdk-core';
import { z } from 'zod';

const openai = createProvider({ id: 'openai', apiKey: process.env.OPENAI_KEY });

const ProductSchema = z.object({ title: z.string(), bullets: z.array(z.string()) });

const product = await serverCompose({
  provider: openai,
  prompt: 'Write product JSON for {{name}}',
  inputs: { name: 'Cord Jacket' },
  schema: ProductSchema
});

console.log(product.title); // ✅ typed, validated
Enter fullscreen mode Exit fullscreen mode

No brittle parsing, no hacks — just typed JSON, streaming if you want it.

🎨 Streaming Demo (UI in 5 lines) 

'use client';
import { useCompose } from '@actionpackd/sdk-core';

export default function Demo() {
  const { stream } = useCompose({ provider: openai, prompt: 'Tell a story about lighthouses' });
  return <div>{[...stream]}</div>;
}
Enter fullscreen mode Exit fullscreen mode

That’s it. You now have token-by-token streaming in your React component.

🔄 Multi-step Flows

When your app logic needs more than one AI step:

import { flowBuilder } from '@actionpackd/sdk-core';

const flow = flowBuilder()
  .step('extract', { prompt: 'Extract bullets from {{text}}', schema: BulletsSchema })
  .step('rewrite', { prompt: 'Write ad copy for {{extract.bullets}}', schema: CopySchema });

const result = await flow.run({ provider: openai, inputs: { text: 'Long product description...' } });

console.log(result.rewrite.copy);
Enter fullscreen mode Exit fullscreen mode

Flows are first-class here — retries and validation included.

🎯 Why Actionpackd?

Compared to other SDKs, Actionpackd is:

  • Schema-first → every output is typed and validated.
  • Provider-agnostic → OpenAI, Anthropic, Gemini, or mocks.
  • Demo-friendly → run with no API key in under a minute.
  • Secure by default → safe interpolation, PII redaction, opt-in telemetry.

Think of it like TypeScript for AI outputs: a little more upfront, a lot less pain later.

🌍 Open Source, Built Together

This is our contribution to the open-source community. The SDK is live on npm and GitHub:

We’d love your feedback, ideas, and contributions — whether that’s a bugfix, docs improvement, or a new provider adapter.

✨ Closing thought

If you’ve been burned by brittle JSON parsing or clunky AI demos, give Actionpackd a try.
It’s 2 lines to typed, streaming AI magic — and we can’t wait to see what you’ll build.

Top comments (0)