Get started – F

The F# tier is the reference host: Fuaran.UI is the ergonomic author surface, and its canonical encoder generates the fixture corpus every other host is held byte-identical to.

Install

dotnet add package Fuaran.UI

Author a tree

Build the UI with the Fuaran.* smart constructors – each injects the per-kind defaults and ARIA. A bare string where a TextSource is expected becomes a Literal.

open Fuaran.UI
open Fuaran.UI.Types
open Fuaran.UI.OpStream.Abstractions

let tree : Node<obj> =
    Fuaran.dashboard "root" {
        Children =
            [ Fuaran.heading "title" { Defaults.heading with Text = TextSource.Literal "Channel performance" }
              Fuaran.markdown "note" "**Hello** from a Fuaran tree." ] }

Serialise to canonical wire JSON

let wire : string = CanonicalJson.encodeNode tree
// canonical JSON – byte-identical to every other conformant host's output

The tree you just built

Rendered by this very site from the exact JSON encodeNode produces – with a one-click link into the playground:

Channel performance

Hello from a Fuaran tree.

{"accessibility":{"role":"main"},"id":"root","kind":{"$type":"Box","children":[{"id":"title","kind":{"$type":"Heading","level":2,"text":"Channel performance","variant":"Standard"}},{"id":"note","kind":{"$type":"Markdown","text":"**Hello** from a Fuaran tree."}}],"layout":{"$type":"Auto"},"role":"Dashboard"}}

Open in fuaran-live ↗

Render it server-side with Fuaran.UI.Renderer.Server (this site does) or in the browser with the Fable renderer.
Mutate it as data – apply typed TreeOps from Fuaran.UI.Ops instead of rebuilding, and persist the op-stream for replay.
Prefer C# or VB? The same tree ships two more .NET author surfaces – the C# fluent factory and VB XML literals, both encoding through this exact canonical encoder.
See the component reference for every node kind and the guide for the wire format.