The demos

• A blog studio and its site

  Drafts beside the row, revisions, scheduled publishing and a page builder, with the public site rendered at build time.

  Open the demo

  Try this

  1. As Wren, a writer, start a post. It saves as you type; a writer cannot publish.
  2. Switch to Edda, an editor, open it and publish it.
  3. View the site as a visitor: only what was published is there.

  Read first: examples/cms/src/server/server.ts

  • foldkit-cms
  • foldkit-cms-drizzle
  • foldkit-remote
  • foldkit-crud
  • foldkit-form
  • foldkit-builder
  • foldkit-ssr

• Two devices, one registry

  Two devices edit 10,000 products in a data grid, offline and in conflict, and agree once both are back.

  Open the demo

  Try this

  1. Change a price in Device A. It shows in Device B a moment later.
  2. Tick “Work offline” in Device B, edit the same price in both, then untick it. The later edit wins, and the device that lost says so.
  3. Reload Device B while it is offline. Its edits are still waiting, and go when it is back.

  Read first: examples/registry/src/domain.ts

  • foldkit-data-grid
  • foldkit-mixins-data-grid
  • foldkit-remote
  • foldkit-sync
  • foldkit-durable

• Pages two tabs edit at once

  Rich text two people edit at the same time, online or not, converging through one journal.

  Open the demo

  Try this

  1. Open the page in two tabs, and make a page in one: it appears in the other.
  2. Type in the page from both tabs; each sees the other’s typing.
  3. Reload a tab: the page is read back from the journal.

  Read first: examples/pages/src/app.ts

  • foldkit-richtext
  • foldkit-richtext-dom
  • foldkit-richtext-markdown
  • foldkit-sync
  • foldkit-durable

• A todo list an agent can use

  One application definition drives the view, the tools an agent calls, the document replicas share, and the policy the server enforces.

  Open the demo

  Try this

  1. Add a todo, and open the page in a second tab: it is there.
  2. Open it as Bob (add ?token=bob) and tick the todo: the first tab shows it ticked.
  3. Reload a tab: what it shows is read back from the journal.

  Read first: examples/todo-app/src/app.ts

  • foldkit-surface
  • foldkit-sync
  • foldkit-durable
  • foldkit-agent
  • foldkit-agent-webmcp
  • foldkit-mixins
  • foldkit-mirror

• A data grid over 100,000 rows

  A grid that owns focus, selection, columns and the open editor, while the application owns every row.

  Open the demo

  Try this

  1. Pick a price and press Enter to edit it; one that is not a price, like 4.999, is refused.
  2. Select a range with Shift and the arrow keys, and copy it into a spreadsheet.
  3. Open a column’s menu to pin or hide it, or drag its header to move it.

  Read first: examples/data-grid/src/main.ts

  • foldkit-data-grid
  • foldkit-mixins-data-grid
  • foldkit-bundle

This page is one too: rendered at build time with foldkit-ssr and styled with foldkit-mixins. Its source.