# `PhiaUi.Components.HeatmapChart`
[🔗](https://github.com/charlenopires/PhiaUI/blob/v0.1.17/lib/phia_ui/components/data/heatmap_chart.ex#L1)

Two-dimensional color-coded grid heatmap — pure SVG, zero JS.

Cells fade in with staggered animation. Color intensity is mapped
linearly from the minimum to maximum value in the dataset.

## Examples

    <.heatmap_chart
      data={[[10, 20, 5], [30, 15, 25], [8, 40, 12]]}
      row_labels={["Mon", "Tue", "Wed"]}
      col_labels={["AM", "PM", "Night"]}
    />

    <.heatmap_chart
      data={[[1, 2, 3], [4, 5, 6]]}
      color_scale={["oklch(0.95 0.05 240)", "oklch(0.55 0.22 240)"]}
    />

# `heatmap_chart`

## Attributes

* `data` (`:list`) (required) - 2D list of numbers: `[[row_vals...], ...]`.
* `row_labels` (`:list`) - Labels for each row (left side). Defaults to `[]`.
* `col_labels` (`:list`) - Labels for each column (top). Defaults to `[]`.
* `color_scale` (`:list`) - Two-element list: `[low_color, high_color]`. Defaults to `["oklch(0.95 0.05 240)", "oklch(0.55 0.22 240)"]`.
* `animate` (`:boolean`) - Defaults to `true`.
* `animation_duration` (`:integer`) - Defaults to `500`.
* `theme` (`:map`) - Chart theme overrides. Defaults to `%{}`.
* `id` (`:string`) - Unique ID for the chart (auto-generated if not provided). Defaults to `nil`.
* `title` (`:string`) - Chart title rendered above the visualization. Defaults to `nil`.
* `description` (`:string`) - Chart description for context (rendered below title). Defaults to `nil`.
* `class` (`:string`) - Defaults to `nil`.
* Global attributes are accepted.

---

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