Row Status

Module Extensions

ColumnRegular (Extended from @revolist/revogrid)

interface ColumnRegular {
  /**
       * Renders a source-backed row-status checkbox for this column.
       *
       * The column `prop` stores a strict boolean. When it is `true`, the plugin
       * applies the configured attribute and the common `row-status` attribute
       * to the rendered row.
       */
      rowStatus?: RowStatusColumnConfig
}

---

HTMLRevoGridElementEventMap (Extended from global)

interface HTMLRevoGridElementEventMap {
  /** Emitted after a row-status edit and all hierarchy propagation finishes. */
      [ROW_STATUS_CHANGE_EVENT]: RowStatusChangeEvent
}

Plugin API

isValidRowStatusAttribute

Returns whether a row-status attribute can safely be rendered.

export function isValidRowStatusAttribute(attribute: unknown): attribute is string;

---

ROW_STATUS_ACTIVE_ATTRIBUTE

ROW_STATUS_ACTIVE_ATTRIBUTE: string;

---

ROW_STATUS_CELL_CLASS

ROW_STATUS_CELL_CLASS: string;

---

RowStatusPlugin

Adds source-backed todo/status checkboxes to RevoGrid columns.

A status column is configured with rowStatus: { attribute: 'data-done' }. The column prop stores a strict boolean, active rows receive both the configured attribute and [row-status], and the default stylesheet strikes through non-checkbox cells. Multiple status columns are independent.

When TreeDataPlugin and grid.tree are active, editing a parent cascades to all descendants. Child edits recompute ancestors and mixed subtrees render an indeterminate parent checkbox. Filtering, sorting, collapsing, pinned rows, and virtualization remain stable because updates use physical source indexes. Classic grouping rows render one checkbox per status column in the synthetic group label. Group edits update every real descendant, while checked and indeterminate state is derived from those descendants without persisting values on synthetic group rows. Derived attributes are placed on the .row-status-group-label element because core grouping headers do not pass through the normal data-row renderer.

The direct checkbox uses RevoGrid’s normal beforeedit/afteredit lifecycle. After the complete hierarchy batch, the plugin emits rowstatuschange.

import { RowStatusPlugin, TreeDataPlugin } from '@revolist/revogrid-pro';

const grid = document.createElement('revo-grid');
grid.plugins = [TreeDataPlugin, RowStatusPlugin];
grid.tree = {
  idField: 'id',
  parentIdField: 'parentId',
  rootParentId: null,
  expandAll: true,
};
grid.columns = [
  { prop: 'done', name: 'Done', rowStatus: { attribute: 'data-done' } },
  { prop: 'archived', name: 'Archived', rowStatus: { attribute: 'data-archived' } },
  { prop: 'task', name: 'Task', tree: true },
];
grid.source = [
  { id: 1, parentId: null, task: 'Release', done: false, archived: false },
  { id: 2, parentId: 1, task: 'Write notes', done: false, archived: false },
];
grid.addEventListener('rowstatuschange', event => {
  console.log(event.detail.physicalIndexes, event.detail.models);
});

class RowStatusPlugin {
  destroy();
}

---

RowStatusColumnConfig

Configures a source-backed checkbox status column.

interface RowStatusColumnConfig {
  /**
     * Attribute applied to the rendered row when the column value is `true`.
     * Use a safe semantic `data-*` or `aria-*` attribute such as `data-done`.
     */
    attribute: string
}

---

RowStatusChangeEvent

Complete source update emitted after a row-status edit and tree propagation.

interface RowStatusChangeEvent {
  /** Row viewport containing the changed models. */
    type: DimensionRows;
  /** Status column property written to the source models. */
    prop: ColumnProp;
  /** Configured row attribute for the status column. */
    attribute: string;
  /** Boolean value requested by the direct checkbox edit. */
    value: boolean;
  /**
     * Physical application-source indexes changed by the edit and hierarchy roll-up.
     * Synthetic classic-grouping rows are excluded.
     */
    physicalIndexes: number[];
  /** Updated real source models in the same order as `physicalIndexes`. */
    models: DataType[]
}