# XWUIListMaster

The shared parent for the two list masters (`XWUIListRecordMaster` + `XWUIListEntityMaster`): one configurable data-table renderer so both "Record List" and "Entity List" render identically and share the same action model. Extending `XWUICRUD`, it maps a flat `ListMasterColumn[]` + `ListMasterRow[]` into a table whose visible columns are controlled by `cols` (a `columnId→boolean` map or an allow-list array) and whose Actions column is built cumulatively from four independent CRUD toggles - `action_create_state` (header "+" add button), `action_read_state` (per-row eye), `action_update_state` (per-row edit), `action_delete_state` (per-row trash) - all rendered as icon-only `XWUIButtonIcon`s. Subclasses feed their domain by overriding `getColumns()`/`getRows()`/`getTitle()` and wire the generic `handleView`/`handleAdd`/`handleEdit`/`handleDelete` hooks to their own callbacks (or pass `onView`/`onAdd`/`onEdit`/`onDelete` directly). `updateConfig()` and `setActionStates()` flip the toggles live. As a concrete component it auto-mounts; as a base it waits for the subclass to finish setup.

## Usage

```ts
import { XWUIListMaster } from './XWUIListMaster';

const list = new XWUIListMaster(
  document.getElementById('app')!,
  {
    title: 'Users',
    columns: [
      { id: 'id', label: 'ID' },
      { id: 'name', label: 'Name' },
      { id: 'email', label: 'Email' },
    ],
    rows: [
      { id: 1, cells: { name: 'Ada Lovelace', email: 'ada@example.com' } },
      { id: 2, cells: { name: 'Alan Turing', email: 'alan@example.com' } },
    ],
    state: 'update',
  },
  {
    action_read_state: true,
    action_update_state: true,
    action_delete_state: true,
    onView: (row) => console.log('view', row.id),
    onDelete: (row) => console.log('delete', row.id),
  }
);

list.setActionStates({ action_create_state: true });
```

## Team directory

A staff directory in the read state with every action toggle enabled, so each row carries view/edit/delete buttons and the header gains an Add button.

```example
file: examples/TeamDirectory.ts
html: examples/TeamDirectory.html
title: Team directory
description: Staff directory with per-row view/edit/delete and a header Add button.
```

## Stock export (JSON state)

A warehouse stock list opened in the JSON state, exporting the full column and row model while `cols` hides the internal SKU column from the table.

```example
file: examples/StockExportJson.ts
html: examples/StockExportJson.html
title: Stock export (JSON state)
description: Stock list in JSON state with a hidden SKU column and locked CRUD states.
```

```api
```