@preprio/toolkit

Prepr Toolkit

A framework-agnostic TypeScript library that provides preview functionality, visual editing, and A/B testing for Prepr CMS. One vanilla core, with thin wrappers for React, Next.js, Nuxt, Astro, and SvelteKit.

This is the monorepo. The published package lives in packages/toolkit — its README is the user-facing documentation: quick start, per-framework guides, and the complete API reference.

Quick Start

npm install @preprio/toolkit

Then follow the Quick Start for your framework: Next.js, Astro, SvelteKit, Nuxt, React, or anything else.

Upgrading from the old Next.js-only @preprio/prepr-nextjs package? See the migration guide.

What's In Here

A pnpm workspace (packages/*, examples/*) built with Turborepo.

Running the Examples

Each example needs its own .env. Copy the template and fill in your Prepr GraphQL URL (Settings → Access tokens in Prepr):

cp examples/nextjs/.env.example examples/nextjs/.env

Install once at the root, build the package, then start the example you want:

pnpm install
pnpm build
pnpm --filter example-nextjs dev

The other examples follow the same pattern — example-astro, example-sveltekit, example-nuxt, example-express.

Development

pnpm install       # install all workspace dependencies
pnpm build         # build the published packages
pnpm test          # run the test suites
pnpm typecheck     # typecheck the published packages

These cover packages/* only — they are what the release workflow runs, so a release is never blocked by an example. The examples have their own commands:

pnpm build:examples       # build every example
pnpm typecheck:examples   # typecheck every example
pnpm check:all            # everything, packages and examples

The examples build and typecheck without a .env (examples/sveltekit reads PUBLIC_PREPR_GRAPHQL_URL through $env/dynamic/public at runtime, so nothing has to exist at compile time). They stay out of the release path anyway: a broken example should never block publishing the packages.

All commands run through Turborepo, so they are cached and only re-run what changed. To scope one to a single workspace:

pnpm --filter @preprio/toolkit test

The toolbar's CSS is compiled from .css sources into *.generated.ts files by scripts/compile-css.mjs. This runs automatically before build, test, and typecheck — the generated files are gitignored, so a fresh clone has none until you run one of those commands.

There is no CI on pushes or pull requests: checks run only when you push a v* tag, as the first half of the Release workflow. Nothing verifies a branch for you, so run pnpm check:all locally before you push — a mistake that reaches main stays invisible until someone cuts a release.

Releasing

Push a v* tag and the Release workflow lints, typechecks, tests, builds and publishes to npm. See RELEASING.md for the full walkthrough.

Support

• Documentation: Prepr Documentation
• Support: Prepr Support