# `Masu.Grid`
[🔗](https://github.com/hattoriai/masu/blob/v0.1.0/lib/masu/grid.ex#L1)

The LiveComponent behind `Masu.Components.data_grid/1`.

Render the grid with `data_grid/1`, not with this module: it is public
for its events, which the browser sends and `Masu.Test` sends in tests.

The component holds the grid's source (`Masu.Source`) and query
(`Masu.Query`). The browser asks it for blocks of rows:

  * `"masu:rows"` with `from` and `count`: the rows of the current query
    from row `from`, at most 500 of them;
  * `"masu:query"` with `sorts`, `filters` and `search`: applies a new
    query, and answers with its count and its first rows;
  * `"masu:values"` with `key`: the values of a column, for its filter
    menu;
  * `"masu:edit"` with `edits`, a list of `id`, `key` and `value`: saves
    the edits of each row together (see `Masu.Components.data_grid/1`'s
    `changeset` and `update`), and answers with the errors of the cells
    that were not saved.

Each answer carries the grid's `revision`, which changes whenever its
rows do (a new query, or new rows from the LiveView), so that the
browser drops the blocks of an older one.

A row goes to the browser as a list: its id, then a value for each
column, the column's value in JSON (see `Masu.Column` for the types) or,
for a column with content, the HTML of its cell (with its value, as
`[html, value]`, when the column is editable). In a grid whose cells
edit by the row's state (`row_editable`, or a column's `editable`
function), a row ends with its read-only cells: `true` for every cell,
or the indexes of their columns.

---

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