SignupButton.tsx

// your copy is the request, and the fallback
const f = useFragments({
  context: { page: "pricing" },
  fields: {
    cta: {
      kind: "cta",
      fallback: "Start your free trial",
    },
  },
});

<button>
  <FragmentText field={f.cta} />
</button>

Get started

Content that adapts to each visitor, in your own pages, from whole sections down to a single string. You write the fallback, SparkleTree generates the rest.

I'm a SparkleTree user I'm building with SparkleTree

Quickstart

Install @sparkletree/core and @sparkletree/react, wrap the page in the provider, point at copy you already have. One required fallback prop and you’re live. Get started.

Fragments

Name any copy in your app, from a button label to a form’s worth of fields, and get a version written for where it sits. No dashboard object first: your fallbacks are the schema. Declare a fragment.

What your visitors see

Adapted copy lands at most once and always carries its provenance; a visible AI label is yours to opt into. If it never lands, your copy is what they read. See the behaviour.

When things break

Slow network, paused campaign, outage: every failure path ends with your own copy on the page. Read the failure paths.

Runnable examples

Two Vite + React apps: a one-page integration you can read in a sitting, and eight recipes streaming from a built-in mock server. No account needed. Run them.

Agents & MCP

Connect an AI agent to the SparkleTree MCP server, or read a brand’s public agent surfaces with no auth at all. Start here.

API reference

Every public export of @sparkletree/core and @sparkletree/react, generated from the TSDoc in the source. Browse the reference.