Dollie Editor SDK
Playground

Dollie Editor SDK guide

Try the TanStack Start Starter

Run a complete editor and Copilot locally before integrating Dollie Editor into your application

The TanStack Start starter is the fastest way to explore the complete product loop:

  • the Core catalog;
  • one application-owned Section;
  • a full-screen editor;
  • in-memory persistence;
  • full-page and single-section Copilot proposals;
  • validation before apply.

The starter is a working example, not the required architecture for your application.

Run it locally

Clone the DollieAI/editor repository, then run:

npm install
cp examples/tanstack-start/.env.example examples/tanstack-start/.env
npm run dev --workspace example-tanstack-start

Add either ANTHROPIC_API_KEY or OPENAI_API_KEY to the copied .env file if you want to use the Copilot.

The starter runs at http://localhost:3200.

What to try

Edit the example hero

Select Example hero and change its headline. The canvas updates from the Page definition rather than from a separately maintained preview.

Rearrange the page

Move Sections in the layers panel and add a Section from the Core catalog.

Inspect the stored Page

Open the Page tab. The JSON is the portable PageConfig your application stores.

Ask the Copilot

Ask for a landing page or a focused change to the selected Section. The starter validates each proposal against the same Catalog before presenting Apply.

Save a revision

The example uses an in-memory TransportClient. Saving demonstrates the document and revision contract without requiring a database.

Read the example in this order

  1. src/catalog.tsx — Core discovery plus one application-owned Section.
  2. src/routes/index.tsx — editor runtime, document state, save, and proposal application.
  3. src/copilot.tsx — proposal cards and apply behavior.
  4. src/routes/api/chat.ts — catalog lookup, prompting, and server-side validation.
  5. src/styles.css — Tailwind and SDK style contracts.

When to leave the starter

Move to your application once you can answer:

  • Which page type will Editor users customize first?
  • Which React Sections will you approve?
  • Where will the PageConfig live?
  • Which users may edit or publish?
  • Will you add a runtime Copilot now or later?

Then follow Set Up with a Coding Agent or Manual Installation.