mwg API
    Preparing search index...

    Class DataTable<T>

    A columned table with a highlighted row, a sort order and paging - the roster or inventory grid that wants headers and a stable sort, where ListView is a flat one-column list.

    Renderer-free, like TabbedList: it holds the columns, the rows, the sort, the highlight and the current page, and a game draws the cells. The page is derived from the highlighted row rather than tracked beside it, so the two can never disagree; setPage is the only thing that moves the highlight on its own, and it lands on the first selectable row of that page.

    import { DataTable } from '@datamoc/mw_games/two-d/ui';

    const roster = new DataTable({
      columns: [{ key: 'name' }, { key: 'level' }],
      rows: [{ name: 'Ash', level: 3 }, { name: 'Bo', level: 1 }],
    });
    roster.sortBy('level');
    console.log(roster.rows[0].name); // 'Bo'

    Type Parameters

    • T
    Index
    constructor
    onChange
    columns page pageCount pageRows pageSize rows selected selectedIndex sortAscending sortKey
    move nextPage select setColumns setPage setPageSize setRows sortBy
    onChange: Signal<void> = ...

    page

    • get pageCount(): number

      how many pages there are; at least one, so an empty table still has a page 0

      Returns number

    • moves the highlight a row at a time, skipping disabled rows and stopping at the ends

      Parameters

      • delta: number

      Returns void

    • moves to a page and highlights its first selectable row

      Parameters

      • page: number

      Returns void

    • Sorts by a column, ascending the first time and toggling on a repeat of the same key. The highlight returns to the first selectable row, since the row it pointed at moved.

      Parameters

      • key: string

      Returns void

    Settings
    Member Visibility

    On This Page
    Constructors
    Properties
    Accessors
    Methods