A full-stack toolkit for building delightful apps on Cloudflare. Svelte 5 components, a block editor, edge-native auth, a reactive Durable-Object database, real-time websockets, image processing, billing, and AI — designed to work together, usable on their own.
🌐 thedelight.co · 📚 docs.thedelight.co · 🧪 example.thedelight.co
| Package | What it does |
|---|---|
@delightstack/components |
Svelte 5 component library — actions, forms, media, navigation, feedback, display |
@delightstack/utilities |
Shared utilities + the DelightError error class |
@delightstack/styles |
OKLCH design tokens and base CSS |
@delightstack/editor |
Rich-text / block editor for Svelte 5 (ProseMirror) — slash commands, drag & drop blocks, optimistic uploads, zero-dependency server renderer |
@delightstack/auth |
JWT sessions, Argon2id, OAuth, SvelteKit guards (Durable Objects) |
@delightstack/database |
Reactive SQLite over Durable Objects with full-text search |
@delightstack/websocket |
Real-time presence & messaging (Durable Objects) |
@delightstack/rate-limiter |
Sliding-window rate limiting (Durable Objects) |
@delightstack/images |
Image processing via Cloudflare Containers + Sharp |
@delightstack/ai |
Embeddings, AI Gateway, and a reactive streaming client |
@delightstack/stripe |
Stripe billing, metered usage, webhooks |
The frontend packages (components, editor, utilities, styles) are framework-agnostic-ish and
work in any Svelte 5 / Vite app. The backend packages target Cloudflare Workers + Durable Objects; the
example-app is the canonical reference for wiring them together.
pnpm add @delightstack/components @delightstack/styles @delightstack/utilities@delightstack/components reads all of its colors, typography, spacing, and motion from the CSS
custom properties shipped by @delightstack/styles — install it alongside the components and import
it once at the root of your app (import '@delightstack/styles';).
All packages are published as ESM and target moduleResolution: "bundler" (SvelteKit, Vite, and
Wrangler all use this). Svelte 5 is an optional peer dependency for packages with reactive clients.
DelightStack is agent-friendly: every docs page is plain markdown at <page-url>.md, the whole
site is indexed at docs.thedelight.co/llms.txt, and the
component library ships a ready-made agent skill. Set up Claude Code / Cursor / Codex in one
command from your project root:
pnpm exec delightstack-agentsSee the AI Agents guide for details.
Every package uses DelightError from @delightstack/utilities as the single operational error
class. Never throw plain objects, new Error(), or other custom error classes for operational errors.
import { DelightError } from '@delightstack/utilities';
throw DelightError.badRequest('Invalid input'); // 400
throw DelightError.notFound('Resource not found'); // 404
throw new DelightError({ message: 'Boom', status: 500, code: 'INTERNAL_ERROR' });
const err = DelightError.from(unknownError); // normalize unknowns
return err.toResponse(); // → ResponseThis is a pnpm + Turborepo monorepo.
pnpm install # install everything
pnpm build # build all packages (in dependency order)
pnpm dev # marketing site + components + utilities in watch mode
pnpm dev:docs # docs site
pnpm dev:example # full example app (SvelteKit + Worker)
pnpm typecheck # tsgo across the monorepoVersions and changelogs are managed with Changesets.
pnpm changeset # describe a change (bumps the linked package group together)On merge to main, the release workflow opens a "Version
Packages" PR; merging that PR publishes the packages to npm with provenance.
MIT © Brian Schwabauer