# `Plushie.Tree.Node`
[🔗](https://github.com/plushie-ui/plushie-elixir/blob/v0.7.2/lib/plushie/tree/node.ex#L1)

Protocol for converting typed structs to `ui_node()` maps.

Widgets and canvas elements define typed structs with builder
functions. This protocol converts those structs to the plain
`%{id, type, props, children}` maps that the runtime, tree differ,
and wire encoder expect.

The runtime calls this protocol automatically during tree normalization,
so structs can be returned directly from `view/1` without an
explicit `build/1` call.

## Example

    alias Plushie.Widget.Button

    # Builder pattern: struct returned, runtime converts automatically
    Button.new("btn", "Click me")
    |> Button.style(:primary)
    |> Button.width(:fill)

    # Explicit conversion if you want the map
    Button.new("btn", "Click me")
    |> Button.style(:primary)
    |> Button.build()
    #=> %{id: "btn", type: "button", props: %{label: "Click me", style: "primary"}, children: []}

# `t`

```elixir
@type t() :: term()
```

All the types that implement this protocol.

# `ui_node`

```elixir
@type ui_node() :: %{
  id: String.t(),
  type: String.t(),
  props: %{optional(atom()) =&gt; term()},
  children: [ui_node()]
}
```

A UI tree node map. Every widget builder returns this shape.

# `to_node`

```elixir
@spec to_node(t()) :: ui_node()
```

Converts a struct to a `Plushie.Tree.Node.ui_node()` map.

---

*Consult [api-reference.md](api-reference.md) for complete listing*
