Skip to content

web-ai-sdk

Building blocks for the Web's built-in AI APIs. Composable. No runtime deps. Just lifecycle, streaming, and AbortSignals.

Composable wrappers. One philosophy.

@web-ai-sdk/all

Meta-package — install once, get all five wrappers under a single dependency. Read the guide →

@web-ai-sdk/prompt

Talk to the on-device language model. Sessions, streaming, AbortSignals. Read the guide →

@web-ai-sdk/webmcp

Register tools the browser’s model context can call. Real agents, real cleanup, no boilerplate. Read the guide →

@web-ai-sdk/summarizer

Key-points, TL;DR, headlines. Configurable type and length, streaming. Read the guide →

@web-ai-sdk/translator

Pair-based translation with block-level round-trip. Walks the DOM, swaps text, keeps markup intact. Read the guide →

@web-ai-sdk/detector

Detect the language of any text on-device. Confidence scores plus a sorted list of alternates. Read the guide →

Install

Pick a building block, or grab the whole suite under a single install:

Terminal window
pnpm add @web-ai-sdk/prompt # one block
pnpm add @web-ai-sdk/all # all five blocks

See the meta-package guide for the two import shapes (@web-ai-sdk/all/prompt subpath vs { prompt } from "@web-ai-sdk/all" namespaced root).

Each package ships:

  • Vanilla (@web-ai-sdk/<pkg>); TypeScript / DOM only, zero framework deps.
  • React (@web-ai-sdk/<pkg>/react); small hook adapter that wraps the vanilla core. react is an optional peer dependency.

Why composable

Browsers are shipping built-in AI APIs behind flags. The shape changes; the lifecycle is similar across them: feature-detect, lazily create a session, stream chunks, cache results, clean up. Those concerns are framework-agnostic and worth sharing.

We ship that lifecycle layer. Framework adapters, polyfills, UI primitives stay optional subpaths so they don’t constrain your design system, framework, or styling stack. Pick the layers you need; skip the rest.