# `Dala.Renderer`
[🔗](https://github.com/manhvu/dala/blob/main/lib/dala/renderer.ex#L1)

Serializes a component tree to a binary command stream and passes it to the
platform NIF in a single call. Compose (Android) and SwiftUI (iOS) handle
diffing and rendering internally.

## Node format

    %{
      type: :column,
      props: %{padding: :space_md, background: :surface},
      children: [
        %{type: :text,   props: %{text: "Hello", text_size: :xl, text_color: :on_surface}, children: []},
        %{type: :button, props: %{text: "Tap", on_tap: self()},    children: []}
      ]
    }

## Token resolution

Atom values for color props, spacing props, radius props, and text sizes are
resolved at render time through the active `Dala.Theme` and the base palette.

## Component defaults

When a component's props omit styling keys, the renderer injects sensible
defaults from the active theme. Explicit props always win over defaults.

## Platform blocks

Props scoped to one platform are silently ignored on the other:

    props: %{padding: 12, ios: %{padding: 20}}
    # iOS sees padding: 20; Android sees padding: 12

## Injecting a mock NIF

    Dala.Renderer.render(tree, :android, MockNIF)

## Binary protocol

See `Dala.Renderer` module docs and `guides/binary_protocol.md` for the full
binary protocol specification (v3).

# `colors`

```elixir
@spec colors() :: map()
```

Get available colors from theme.

# `compute_layout_hash`

```elixir
@spec compute_layout_hash(Dala.Node.t()) :: non_neg_integer()
```

Compute a stable layout hash for a node tree.

Delegates to `Dala.Ui.Renderer.compute_layout_hash/1`.

# `encode_event`

```elixir
@spec encode_event(String.t(), non_neg_integer(), non_neg_integer(), binary()) ::
  binary()
```

Encode a native event frame.

Delegates to `Dala.Ui.Renderer.encode_event/4`.

# `encode_frame`

```elixir
@spec encode_frame([Dala.Diff.patch()]) :: binary()
```

Encode patches to binary frame format for the native side.

# `encode_patch_node`

```elixir
@spec encode_patch_node(String.t(), non_neg_integer(), map()) :: binary()
```

Encode a field-mask node patch frame.

Delegates to `Dala.Ui.Renderer.encode_patch_node/3`.

# `encode_register_string`

```elixir
@spec encode_register_string(non_neg_integer(), String.t()) :: binary()
```

Encode a string-table registration entry.

Delegates to `Dala.Ui.Renderer.encode_register_string/2`.

# `encode_set_text`

```elixir
@spec encode_set_text(String.t(), String.t()) :: binary()
```

Encode a targeted text update for an existing node.

Delegates to `Dala.Ui.Renderer.encode_set_text/2`.

# `render`

```elixir
@spec render(Dala.Node.t() | map(), atom(), term(), atom()) ::
  {:ok, :binary_tree} | {:error, term()}
```

Render a UI tree for the given platform.

# `render_fast`

```elixir
@spec render_fast(Dala.Node.t() | map(), atom(), term(), atom()) ::
  {:ok, :binary_tree} | {:error, term()}
```

Fast render path for simple updates.

# `render_patches`

```elixir
@spec render_patches(
  Dala.Node.t() | map() | nil,
  Dala.Node.t() | map(),
  atom(),
  term(),
  atom()
) ::
  {:ok, [Dala.Diff.patch()]} | {:error, term()}
```

Compute patches between old and new trees.

# `text_sizes`

```elixir
@spec text_sizes() :: map()
```

Get text sizes from theme.

---

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