marianoguerra/tutuca
A MoonBit port of
tutuca, a small UI framework built
around a reactive value language, a declarative view notation, and a virtual
DOM.
A component declares its spec, its logic and its views in one .tutu file,
and all three compile ahead of time into typed MoonBit. Every handler is
checked against the state it mutates, and so is every field a view reads —
including inside a loop. It runs on all three
backends: wasm-gc (the default), js (the real-DOM adapter) and
native (the CLI).
Follow the same five components everywhere: Quantity picker → Notification preferences → Task list → Contact directory → Document workspace.
Try them in your browser or follow the tutorial. The small examples run directly as cards; the MoonBit examples show host integration and compiled assembly.
Start here
- README.mbt.md — the detailed guide: the package stack,
ahead-of-time views, the value language, the CLI, and what each backend
adapter does. Every code block in it is compiled and run by
moon test.
- docs/ — the guides. Start with
tutorial.mbt.md, which builds five practical components; first_principles.mbt.md rebuilds the
framework layer by layer if you want to know why it works. Their examples have interaction tests. dynamic-components.md is the part
that is not decided before the program runs: a WebAssembly module fetched at
runtime, from someone you have no reason to trust, mounted into a page that is
already running.
- skill/tutuca/ — the authoring reference an agent reads,
shipped inside the CLI: the spec and script languages, views, events,
protocols, testing and cards.
tutuca install-skill writes it out.
- tgc/SPEC.md — the component format itself: the frozen rec
group, the freeze rule, the op space, the exports, and the JSON encoding.
tgc/SECURITY.md is what a loaded module can and cannot
do, tested rather than asserted.
- AGENTS.md — repo layout, tooling and testing conventions.
- CONTRIBUTING.md — how to propose a change.
Live demos, playground and storybook:
https://marianoguerra.github.io/tutuca-moonbit/
Install
As a library:
moon add marianoguerra/tutuca
The CLI is the cmd/tutuca package, and moon install names the binary after
that package's last segment:
moon install marianoguerra/tutuca/cmd/tutuca
That lands tutuca in ~/.moon/bin/, which the MoonBit toolchain already puts
on your PATH — no symlink needed. Check it with tutuca help.
Build and test
Common workflows live in a MoonBit task runner rather than loose commands; run
it with no task to print the list.
moon run --target native cmd/dev -- setup # npm install (happy-dom) + git hooks
moon run --target native cmd/dev -- ci # check + test, across all targets
License
MIT — see LICENSE.
