Editor SDKOverviewPlaygroundPresentationBlocksshadcnFor authors

This page is a PageConfig rendered by Dollie Editor SDK — open it in the editor

For component authors

Make your shadcn registry editor-ready

Keep distributing source through the registry your users already understand. Add Dollie metadata so those components can also become guarded Sections for visual editors and AI Copilots.

See the registry contractStart with an existing component

Your registry remains the product

Dollie adds an editing contract around the source you already publish. It does not replace your components or distribution model.

Keep source distribution

Consumers continue to install components through a shadcn-compatible registry and own the resulting source.

Fixed or authorable

Ship visually locked Sections, fully authorable Sections, or a considered mix inside the same catalog.

Generated fields

Describe editable props once so the inspector, validation layer, and Copilot share the same contract.

Dollie metadata

Add editor-specific registry metadata without changing how the component itself is installed or rendered.

Sections and elements

Distribute page Sections, nested illustrations, and starter templates as a coherent component pack.

AI discoverability

Give coding agents and in-product Copilots precise vocabulary for when and how each component should be used.

Make your shadcn registry editor-ready

A small metadata extension connects source distribution to the Catalog contract. Your components remain useful in normal React projects and become discoverable inside compatible Dollie Editor SDK hosts.

  • Keep distributing source

    Your registry item stays an ordinary shadcn-compatible block. Integrators receive React source they can inspect, adapt, and own.

  • Carry the editor contract

    Add x-dollie-editor metadata for Sections, Fields, Elements, and Templates. Compatible hosts can discover the editing vocabulary without reverse-engineering the component.

  • Choose the depth

    Publish a fixed Section today or describe its authorable props. The same registry can carry simple layout blocks and fully editable product Sections.

{
  "name": "hero-newsletter",
  "type": "registry:block",
  "dependencies": ["@dollie_ai/editor"],
  "meta": {
    "x-dollie-editor": {
      "version": 1,
      "sections": [{
        "id": "acme-hero-newsletter",
        "name": "Newsletter hero",
        "category": "hero",
        "propsDriven": "full",
        "fields": [
          {
            "kind": "text",
            "key": "headline",
            "label": "Headline",
            "optional": true
          }
        ]
      }]
    },
    "tags": ["dollie-editor-ready"]
  }
}
The extension lives inside a standard registry item. Its schema ships with the Editor package.

One component, two distribution paths

npm distributes the Editor engine and versioned Catalog packages. shadcn-compatible registries distribute component source into the Integrator's application. Both can preserve the same stable Catalog contract.

Publish from a Catalog

# Build registry items from your Catalog
npx dollie-editor build

Generate registry payloads from the same definitions used by the editor and published renderer.

Install and discover

# Install source from a shadcn-compatible registry
npx shadcn@latest add https://your-registry.example/r/hero-newsletter.json

# Confirm what the Editor discovered
npx dollie-editor info --json

Installing source does not silently register it. The discovery command shows the active Catalog contract.

Build the first editor-ready pack

Start with one complete component, preserve its source-owned installation, and add the smallest useful Dollie contract around it.

Read the catalog guideSee the Core blocks