A demo app built with Elements.
Nested pages in markdown with live preview, version diffs and restore, presence on every page, and full-text search.
Demo: Lorebarn
- Agent: Claude Code, Opus 5.5 Medium
- Time: 17 min
- Cost: $5.99 at API rates, September 2026
elements create lorebarn -scaffold=elementscode/demo-lorebarnLorebarn needed a page tree that updates for everyone, a version kept on every save, presence on each page, full text search and email invites. Each of those is a part of Elements, so the agent spent its 17 minutes on the wiki itself.
-
Live pages and tree. Pages are a LiveTable split by space, so a save, a new page or a move in the tree shows up in every open tree, page and home screen at once.
-
A version on every save. Each edit is checked against the latest version, keeps a snapshot in the same transaction, and tells a late editor who saved first. History restores a version through the same live table, so every open copy updates.
-
Presence. A channel tracks who is on each page and who is editing, and every open copy of the page shows the same people as they arrive, start typing and leave.
-
Full text search. Search ranks matches across every page and highlights them, from a weighted search column the migration defines.
-
Invites and roles. Admins invite members by email and change roles with
@rpccalls that check for an admin first. -
Data from SQL files. Migrations define the wiki and seed one admin, three members, three spaces with 23 nested pages, 64 saved versions and a pending invite.
The project server runs alongside the agent and answers as soon as a file is saved: it type-checks the templates, TypeScript and SQL, applies migrations and reruns the tests, so every question came back right away and the agent kept building.
The app type-checks with zero errors and all 28 tests pass. Every page works on desktop and phone.
The seed writes the wiki of Crewline, a made-up company that makes scheduling software for field-service shops: three spaces (Engineering, Product, Handbook) with 23 pages nested up to three levels deep, and 64 saved versions, two to four per page, so every page has history to compare and restore. One invite, for sam@lorebarn.dev, is pending.
Every account's password is lorebarn, and the sign-in page lists them.
| Role | |
|---|---|
| maya@lorebarn.dev | admin |
| theo@lorebarn.dev | member |
| priya@lorebarn.dev | member |
| jonah@lorebarn.dev | member |
In development, invite emails are written to .elements/logs/program.log
instead of being sent; the Members page also has a "Copy link" button for each
pending invite.
Demo: Lorebarn
MIT. See LICENSE.