Public Row API Specification

Public Row API Specification

Contents

1. Task
2. Overview
3. Implementation

Revision History

Version	User	Date	Notes
0.1	Hristo Anastasov	March 18, 2021	Initial Draft

1. Task

Currently, grid APIs which return "row objects" are returning the actual row component from current state of the DOM. However this is far from useful as with the current implementation virtualization state is not taken into account (#6158) as well as exposing API which should not be usable by users of the grid.

As a solution, a new row-like interface should be exposed by the grids as the type returned from certain public API calls. This new interface will act as a façade for the core row API (while also taking the current virtualization state into account.

1. Overview

IgxGridRow, IgxTreeGridRow and IgxHierarchicalGridRow are the new classes, which implement the new interface. These classes act as a façade for the corresponding row components: IgxGridRowComponent, IgxTreeGridRowComponent, IgxHierarchicalGridRowComponent. (see below).

1. Implementation

1. Declare the new interface, which defines the public properties/methods to be exposed in the public API. PublicRowType is just an example name.

export interface PublicRowType { 
    rowID: any; 
    rowData: any; 
    disabled: boolean; 
    index: number; 
    gridID: string; 
    added: boolean; 
    pinned: boolean; 
    selected: boolean; 
    expanded: boolean; 
    addRow: boolean; 
    cells: QueryList<IgxGridCellComponent>; 
    inEditMode: boolean; 
    update: (value: any) => void; 
    delete: () => any; 
    isCellActive: (visibleColumIndex: number) => boolean; 
    pin: () => boolean; 
    unpin: () => boolean; 
    beginAddRow: () => void; 
}

export interface PublicTreeGridRowType extends PublicRowType { 
    treeRow: ITreeGridRecord; 
} 

2. Implement the new façade classes, which should implement the interface. This façade class takes the corresponding row component in the constructor, and implements proxy members for the public properties/methods, i.e. redirects all calls to core API:

export class IgxGridRow implements PublicRowType { 
    public get rowID(): any { 
        return this._row.rowID; 
    }
    constructor( 
        private _row: IgxRowDirective<IgxGridBaseDirective & GridType>) { 
    }
    public pin(): boolean { 
        return this._row.pin(); 
    }  
} 

3. Make the public row API’s work with instances of the new classes. Those instances are created on demand in corresponding calls:

// grid-base.directive.ts 
public getRowByIndex(index: number): PublicRowType { 
    const row = this.gridAPI.get_row_by_index(index); 
    const publicRow = new IgxGridRow(row); 
    return publicRow; 
}