@zeedhi/common 1.112.0 → 3.0.0

package/src/components/zd-tree-grid/interfaces.ts

@@ -0,0 +1,39 @@
+import { IDictionary } from '@zeedhi/core';
+import { ITreeComponent, ITreeDataStructure } from '../../utils/tree-data-structure/interfaces';
+import { IDataSelector, IGrid, IGridProps } from '../zd-grid';
+
+export interface ITreeDataSelector extends IDataSelector {
+	selectChildren(row: IDictionary<any>): void;
+	unselectChildren(row: IDictionary<any>): void;
+}
+
+export interface IIterableTree {
+	onMounted(element: HTMLElement): void;
+	buildTree(doGet?: boolean): void;
+	setViewUpdateScrollData(fn: () => void): void;
+	updateScrollData(): void;
+}
+
+export interface ITreeGridProps extends IGridProps {
+	parentField?: string;
+	openLevelOnLoad?: number | boolean;
+	fetchOnDemand?: boolean;
+	fieldHasChild?: string;
+	flat?: boolean;
+	detach?: boolean;
+	lazyLoad?: boolean;
+}
+
+export interface ITreeGrid extends ITreeComponent, IGrid, ITreeDataSelector, IIterableTree {
+	flat: boolean;
+	lazyLoad: boolean;
+	treeDataStructure: ITreeDataStructure;
+	getChildren(row: IDictionary): IDictionary[];
+	findDataIndex(data: IDictionary<any>[], value: any): number;
+	getParentRow(row: IDictionary): IDictionary;
+	buildTreeStructure(): void;
+	resetTree(): void;
+	filterRootData(): Promise<any>;
+	navigateToggle(collapse: boolean): void;
+	toggleExpand(row: IDictionary<any>, rowIndex?: number): Promise<IDictionary<any>[] | undefined>;
+}

package/src/components/zd-tree-grid/iterable-tree.ts

@@ -0,0 +1,39 @@
+import { IIterableTree, ITreeGrid } from './interfaces';
+
+export class IterableTree implements IIterableTree {
+	private treeGrid: ITreeGrid;
+
+	viewUpdateScrollData?: () => void;
+
+	constructor(treeGrid: ITreeGrid) {
+		this.treeGrid = treeGrid;
+	}
+
+	onMounted(): void {
+		if (!this.treeGrid.lazyLoad || this.treeGrid.getData().length) {
+			this.buildTree();
+		}
+	}
+
+	buildTree(doGet = true): void {
+		if (!doGet) {
+			this.treeGrid.buildTreeStructure();
+			return;
+		}
+
+		if (!this.treeGrid.fetchOnDemand) {
+			this.treeGrid.reload();
+			return;
+		}
+
+		this.treeGrid.filterRootData();
+	}
+
+	setViewUpdateScrollData(fn: () => void) {
+		this.viewUpdateScrollData = fn;
+	}
+
+	updateScrollData(): void {
+		if (this.treeGrid.virtualScroll && this.viewUpdateScrollData) this.viewUpdateScrollData();
+	}
+}

package/src/components/zd-tree-grid/keymap-tree.ts

@@ -0,0 +1,23 @@
+import { IKeyMap } from '@zeedhi/core';
+import { Component } from '../zd-component/component';
+import { IKeyMapConfig } from '../zd-grid';
+import { ITreeGrid } from './interfaces';
+
+export class KeyMapTree implements IKeyMapConfig<ITreeGrid> {
+	getMap(instance: Component & ITreeGrid): IKeyMap {
+		return {
+			right: {
+				event: instance.navigateToggle.bind(instance, false),
+				stop: true,
+				index: 99,
+				active: true,
+			},
+			left: {
+				event: instance.navigateToggle.bind(instance, true),
+				stop: true,
+				index: 99,
+				active: true,
+			},
+		};
+	}
+}

package/src/components/zd-tree-grid/tree-data-navigator.ts

@@ -0,0 +1,50 @@
+import { DataNavigator, IDataNavigator, VerticalDirection } from '../zd-grid';
+import { ITreeGrid } from './interfaces';
+
+export class TreeDataNavigator implements IDataNavigator {
+	private treeGrid: ITreeGrid;
+
+	private dataNavigator: IDataNavigator;
+
+	constructor(treeGrid: ITreeGrid) {
+		this.treeGrid = treeGrid;
+		this.dataNavigator = new DataNavigator(treeGrid);
+	}
+
+	navigateDatasource(direction: VerticalDirection): void {
+		const { uniqueKey, currentRow } = this.treeGrid.datasource;
+		const data = this.treeGrid.getData();
+		const rowIndex = this.treeGrid.findDataIndex(data, currentRow[uniqueKey]);
+
+		if (direction === 'up') {
+			if (rowIndex === -1) {
+				const lastOpenedRowIdx = this.treeGrid.treeDataStructure.previousOpenedRow(data.length);
+				this.treeGrid.setCurrentRow(data[lastOpenedRowIdx]);
+				return;
+			}
+			const previousRowIdx = this.treeGrid.treeDataStructure.previousOpenedRow(rowIndex);
+			if (previousRowIdx > -1) {
+				this.treeGrid.setCurrentRow(data[previousRowIdx]);
+			}
+			return;
+		}
+
+		if (rowIndex === -1) {
+			this.treeGrid.setCurrentRow(data[0]);
+			return;
+		}
+
+		const nextRowIdx = this.treeGrid.treeDataStructure.nextOpenedRow(rowIndex);
+		if (nextRowIdx > -1) {
+			this.treeGrid.setCurrentRow(data[nextRowIdx]);
+		}
+	}
+
+	navigatePageUp(): void {
+		this.dataNavigator.navigatePageUp();
+	}
+
+	navigatePageDown(): void {
+		this.dataNavigator.navigatePageDown();
+	}
+}

package/src/components/zd-tree-grid/tree-data-selector.ts

@@ -0,0 +1,121 @@
+import { IDictionary } from '@zeedhi/core';
+import { DataSelector, IDataSelector } from '../zd-grid';
+import { ITreeDataSelector, ITreeGrid } from './interfaces';
+
+export class TreeDataSelector implements ITreeDataSelector {
+	private treeGrid: ITreeGrid;
+
+	private dataSelector: IDataSelector;
+
+	constructor(treeGrid: ITreeGrid) {
+		this.treeGrid = treeGrid;
+		this.dataSelector = new DataSelector(treeGrid);
+	}
+
+	private removeDuplicates<T extends { [key: string]: unknown }>(arr: T[], key: string): T[] {
+		return [...new Map(arr.map((item: T) => [item[key], item])).values()];
+	}
+
+	selectChildren(row: IDictionary<any>): void {
+		const childrenRows = this.treeGrid.getChildren(row);
+		const rows = this.treeGrid.flat ? childrenRows : [row, ...childrenRows];
+		this.treeGrid.selectedRows = this.removeDuplicates(
+			this.treeGrid.selectedRows.concat(rows),
+			this.treeGrid.datasource.uniqueKey,
+		);
+	}
+
+	unselectChildren(row: IDictionary<any>): void {
+		const childrenRows = this.treeGrid.getChildren(row);
+		const rows = this.treeGrid.flat ? childrenRows : [row, ...childrenRows];
+		rows.forEach((item: IDictionary<any>) => {
+			const key = this.treeGrid.getRowKey(item);
+			const index = this.treeGrid.findDataIndex(this.treeGrid.selectedRows, key);
+			if (index > -1) this.treeGrid.selectedRows.splice(index, 1);
+		});
+	}
+
+	private selectParents(row: IDictionary<any>) {
+		const { parentField, selectAllPages } = this.treeGrid;
+		if (!row[parentField]) return;
+
+		let arrSelection = selectAllPages ? this.treeGrid.selectionState.except : this.treeGrid.selectedRows;
+
+		const parentRow = this.treeGrid.getParentRow(row);
+		const every = this.treeGrid.getChildren(parentRow).every((item: IDictionary<any>) => {
+			const key = this.treeGrid.getRowKey(item);
+			const index = this.treeGrid.findDataIndex(arrSelection, key);
+			if (index > -1) return true;
+			return false;
+		});
+		const rows = [];
+		if (every || (selectAllPages && this.treeGrid.selectionState.allSelected)) rows.push(parentRow);
+		arrSelection = this.removeDuplicates(arrSelection.concat(rows), this.treeGrid.datasource.uniqueKey);
+
+		if (selectAllPages) {
+			this.treeGrid.selectionState.except = arrSelection;
+		} else {
+			this.treeGrid.selectedRows = arrSelection;
+		}
+		this.selectParents(parentRow);
+	}
+
+	private unselectParents(row: IDictionary<any>) {
+		const { parentField, selectAllPages, selectionState, selectedRows } = this.treeGrid;
+		if (!row[parentField]) return;
+
+		const arrSelection = selectAllPages ? selectionState.except : selectedRows;
+
+		const index = this.treeGrid.findDataIndex(arrSelection, row[parentField]);
+		if (index > -1) arrSelection.splice(index, 1);
+		const parentRow = this.treeGrid.getParentRow(row);
+		this.unselectParents(parentRow);
+	}
+
+	selectRow(row: IDictionary<any>, select: boolean) {
+		const childrenRows = !this.treeGrid.flat ? this.treeGrid.getChildren(row) : [];
+		const rows = [row, ...childrenRows];
+
+		// stores whether this row should be added/removed from arrSelection
+		let shouldBeSelected: boolean;
+
+		if (this.treeGrid.selectAllPages) {
+			shouldBeSelected = select !== this.treeGrid.selectionState.allSelected;
+		} else {
+			shouldBeSelected = select;
+		}
+
+		rows.forEach((rowToSelect) => {
+			this.dataSelector.selectRow(rowToSelect, select);
+		});
+
+		if (this.treeGrid.flat) return;
+
+		if (shouldBeSelected) {
+			// check if all the children of the parent are selected.
+			this.selectParents(row);
+		} else {
+			this.unselectParents(row);
+		}
+	}
+
+	selectAll(isSelected: boolean): void {
+		this.dataSelector.selectAll(isSelected);
+	}
+
+	toggleRow(row: IDictionary): void {
+		this.dataSelector.toggleRow(row);
+	}
+
+	callDisableSelection(row: IDictionary): boolean {
+		return this.dataSelector.callDisableSelection(row);
+	}
+
+	selectClick(row: IDictionary<any>, isSelected: boolean, event: Event, element?: HTMLElement): void {
+		this.dataSelector.selectClick(row, isSelected, event, element);
+	}
+
+	selectAllClick(isSelected: boolean, event: Event, element?: HTMLElement): void {
+		this.dataSelector.selectAllClick(isSelected, event, element);
+	}
+}

package/src/components/zd-tree-grid/tree-grid.ts

@@ -0,0 +1,435 @@
+import { Config, IDictionary, IEventParam } from '@zeedhi/core';
+import clonedeep from 'lodash.clonedeep';
+import { IIterableProps } from '..';
+import { ITreeDataStructure, TreeDataStructure } from '../../utils';
+import { IComponent, IComponentRender } from '../zd-component/interfaces';
+import {
+	Direction,
+	GridColumn,
+	GridEvents,
+	IDataNavigator,
+	IGrid,
+	IGridColumn,
+	IGridEvents,
+	IIterableTable,
+	IKeyMapMerger,
+	ITableActionBuilder,
+	IViewNavigator,
+	IterableTable,
+	KeyMapMerger,
+	KeyMapNavigation,
+	TableActionBuilder,
+	VerticalDirection,
+	ViewNavigator,
+} from '../zd-grid';
+import { Iterable } from '../zd-iterable/iterable';
+import { IIterableTree, ITreeDataSelector, ITreeGrid, ITreeGridProps } from './interfaces';
+import { IterableTree } from './iterable-tree';
+import { KeyMapTree } from './keymap-tree';
+import { TreeDataNavigator } from './tree-data-navigator';
+import { TreeDataSelector } from './tree-data-selector';
+
+export class TreeGrid extends Iterable<GridColumn> implements ITreeGrid {
+	private tableActionBuilder: ITableActionBuilder;
+
+	private iterableTable: IIterableTable;
+
+	private dataSelector: ITreeDataSelector;
+
+	private gridEvents: IGridEvents;
+
+	private dataNavigator: IDataNavigator;
+
+	private viewNavigator: IViewNavigator;
+
+	private keyMapMerger!: IKeyMapMerger;
+
+	private iterableTree: IIterableTree;
+
+	public treeDataStructure!: ITreeDataStructure;
+
+	currentColumn: GridColumn | null = null;
+
+	selectedRows: IDictionary<any>[] = [];
+
+	selectionState: { allSelected: boolean; except: IDictionary<any>[] } = {
+		allSelected: false,
+		except: [],
+	};
+
+	rowStyleConditions?: (row: IDictionary) => IDictionary;
+
+	selectAllPages: boolean = Config.gridSelectAllPages;
+
+	selectable = false;
+
+	disableSelection?: (args: { row: IDictionary<any>; component: IGrid }) => boolean;
+
+	cellSelection = false;
+
+	toolbarSlot: IComponentRender[] = [{ name: '<<NAME>>_gridSearch', component: 'ZdSearch' }];
+
+	footerSlot: IComponentRender[] = [
+		{ name: '<<NAME>>_iterablePagination', component: 'ZdIterablePagination' },
+		{
+			name: '<<NAME>>_iterableInfoDiv',
+			component: 'ZdTag',
+			cssClass: 'zd-grid-div-footer',
+			tag: 'div',
+			children: [
+				{
+					name: '<<NAME>>_iterablePageSize',
+					component: 'ZdIterablePageSize',
+					iterableComponentName: '<<NAME>>',
+				},
+				{
+					name: '<<NAME>>_iterablePageInfo',
+					component: 'ZdIterablePageInfo',
+					iterableComponentName: '<<NAME>>',
+				},
+			],
+		},
+	];
+
+	noResultsText = 'NO_RESULT';
+
+	noResultSlot: IComponentRender[] = [
+		{
+			name: '<<NAME>>_no-result',
+			component: 'ZdText',
+			cssClass: 'no-result',
+			text: this.noResultsText,
+		},
+	];
+
+	errorSlot: IComponentRender[] = [];
+
+	dense = true;
+
+	dragColumns = false;
+
+	headerBackground = '';
+
+	headerCellTextColor = '';
+
+	height: string | number = 'auto';
+
+	loadingText = 'LOADING';
+
+	maxHeight: string | number = 'none';
+
+	maxWidth: string | number = 'none';
+
+	minHeight: string | number = 'auto';
+
+	minWidth: string | number = 'auto';
+
+	noDataText = 'NO_DATA';
+
+	noDataSlot: IComponentRender[] = [
+		{
+			name: '<<NAME>>_no-data',
+			component: 'ZdText',
+			cssClass: 'no-data',
+			text: this.noDataText,
+		},
+	];
+
+	resizeColumns = false;
+
+	showFooter = true;
+
+	showHeader = true;
+
+	showSelectAll = true;
+
+	width: string | number = '100%';
+
+	backgroundColor = 'transparent';
+
+	parentField = '';
+
+	openLevelOnLoad: number | boolean = false;
+
+	fetchOnDemand = true;
+
+	fieldHasChild?: string;
+
+	flat = false;
+
+	detach = false;
+
+	lazyLoad = true;
+
+	constructor(props: ITreeGridProps) {
+		super(props);
+		this.cellSelection = this.getInitValue('cellSelection', props.cellSelection, this.cellSelection);
+		this.dense = this.getInitValue('dense', props.dense, this.dense);
+		this.disableSelection = this.getInitValue('disableSelection', props.disableSelection, this.disableSelection);
+		this.dragColumns = this.getInitValue('dragColumns', props.dragColumns, this.dragColumns);
+		this.fillHeight = this.getInitValue('fillHeight', props.fillHeight, this.fillHeight);
+		this.headerCellTextColor = this.getInitValue(
+			'headerCellTextColor',
+			props.headerCellTextColor,
+			this.headerCellTextColor,
+		);
+		this.height = this.getInitValue('height', props.height, this.height);
+		this.loadingText = this.getInitValue('loadingText', props.loadingText, this.loadingText);
+		this.maxHeight = this.getInitValue('maxHeight', props.maxHeight, this.maxHeight);
+		this.maxWidth = this.getInitValue('maxWidth', props.maxWidth, this.maxWidth);
+		this.minHeight = this.getInitValue('minHeight', props.minHeight, this.minHeight);
+		this.minWidth = this.getInitValue('minWidth', props.minWidth, this.minWidth);
+		this.noDataText = this.getInitValue('noDataText', props.noDataText, this.noDataText);
+		this.noResultsText = this.getInitValue('noResultsText', props.noResultsText, this.noResultsText);
+		this.resizeColumns = this.getInitValue('resizeColumns', props.resizeColumns, this.resizeColumns);
+		this.rowStyleConditions = this.getInitValue(
+			'rowStyleConditions',
+			props.rowStyleConditions,
+			this.rowStyleConditions,
+		);
+		this.selectable = this.getInitValue('selectable', props.selectable, this.selectable);
+		this.selectAllPages = this.getInitValue('selectAllPages', props.selectAllPages, this.selectAllPages);
+		this.showFooter = this.getInitValue('showFooter', props.showFooter, this.showFooter);
+		this.showHeader = this.getInitValue('showHeader', props.showHeader, this.showHeader);
+		this.showSelectAll = this.getInitValue('showSelectAll', props.showSelectAll, this.showSelectAll);
+		this.width = this.getInitValue('width', props.width, this.width);
+		this.backgroundColor = this.getInitValue('backgroundColor', props.backgroundColor, this.backgroundColor);
+		// headerBackground defaults to the backgroundColor, unless backgroundColor is transparent
+		const defaultHeaderBackground = this.backgroundColor === 'transparent' ? '' : this.backgroundColor;
+		this.headerBackground = this.getInitValue('headerBackground', props.headerBackground, defaultHeaderBackground);
+
+		this.parentField = this.getInitValue('parentField', props.parentField, this.parentField);
+		this.openLevelOnLoad = this.getInitValue('openLevelOnLoad', props.openLevelOnLoad, this.openLevelOnLoad);
+		this.fetchOnDemand = this.getInitValue('fetchOnDemand', props.fetchOnDemand, this.fetchOnDemand);
+		this.fieldHasChild = this.getInitValue('fieldHasChild', props.fieldHasChild, this.fieldHasChild);
+		this.flat = this.getInitValue('flat', props.flat, this.flat);
+		this.detach = this.getInitValue('detach', props.detach, this.detach);
+		this.lazyLoad = props.datasource?.lazyLoad !== false;
+
+		this.toolbarSlot = props.toolbarSlot || this.toolbarSlot;
+		this.footerSlot = props.footerSlot || this.footerSlot;
+		this.noDataSlot = props.noDataSlot || this.noDataSlot;
+		this.noResultSlot = props.noResultSlot || this.noResultSlot;
+		this.errorSlot = props.errorSlot || this.errorSlot;
+		this.noDataSlot = this.changeDefaultSlotNames(this.noDataSlot);
+		this.footerSlot = this.changeDefaultSlotNames(this.footerSlot);
+		this.toolbarSlot = this.changeDefaultSlotNames(this.toolbarSlot);
+		this.noResultSlot = this.changeDefaultSlotNames(this.noResultSlot);
+		this.errorSlot = this.changeDefaultSlotNames(this.errorSlot);
+
+		this.tableActionBuilder = new TableActionBuilder(this);
+		this.iterableTable = new IterableTable(this);
+		this.dataSelector = new TreeDataSelector(this);
+		this.gridEvents = new GridEvents(this);
+		this.dataNavigator = new TreeDataNavigator(this);
+		this.viewNavigator = new ViewNavigator();
+		this.iterableTree = new IterableTree(this);
+		this.treeDataStructure = new TreeDataStructure(this);
+	}
+
+	protected initializeDatasource(props: IIterableProps) {
+		const treeProps = clonedeep(props);
+		if (treeProps.datasource) {
+			treeProps.datasource.lazyLoad = true;
+			treeProps.datasource.loadAll = true;
+		}
+		super.initializeDatasource(treeProps);
+		this.treeDataStructure.initialize();
+	}
+
+	public onCreated(): void {
+		super.onCreated();
+	}
+
+	public onMounted(element: HTMLElement): void {
+		super.onMounted(element);
+		this.keyMapMerger = new KeyMapMerger(this, [KeyMapNavigation, KeyMapTree]);
+		this.keyMapMerger.bind(element);
+
+		this.iterableTree.onMounted(element);
+	}
+
+	public onBeforeDestroy(): void {
+		super.onBeforeDestroy();
+		this.keyMapMerger.unbind();
+	}
+
+	/**
+	 * toggleExpand
+	 */
+	public async toggleExpand(row: IDictionary<any>, rowIndex?: number): Promise<IDictionary<any>[] | undefined> {
+		const result = await this.treeDataStructure.toggleExpand(row, rowIndex);
+		this.updateScrollData();
+		return result;
+	}
+
+	/**
+	 * Toggle expand/collapse using navigation keys
+	 * @param collapse Should collapse
+	 */
+	public navigateToggle(collapse: boolean) {
+		this.treeDataStructure.navigateToggle(collapse);
+	}
+
+	getChildren(row: IDictionary): IDictionary[] {
+		return this.treeDataStructure.getChildren(row);
+	}
+
+	findDataIndex(data: IDictionary<any>[], value: any): number {
+		return this.treeDataStructure.findDataIndex(data, value);
+	}
+
+	getParentRow(row: IDictionary): IDictionary {
+		return this.treeDataStructure.getParentRow(row);
+	}
+
+	buildTreeStructure(): void {
+		this.treeDataStructure.buildTree();
+	}
+
+	resetTree(): void {
+		this.treeDataStructure.resetTree();
+	}
+
+	filterRootData() {
+		return this.datasource.addFilter(this.parentField, 'NULL');
+	}
+
+	getConditionalProps({ row, column }: { row: IDictionary; column: GridColumn }): Partial<IComponentRender> {
+		const rowStyle = this.getRowStyleConditions(row);
+		const cellsApplied = this.getAppliedConditions({ row, column });
+
+		return { ...rowStyle, ...cellsApplied };
+	}
+
+	navigatePageUp(): void {
+		this.dataNavigator.navigatePageUp();
+	}
+
+	navigatePageDown(): void {
+		this.dataNavigator.navigatePageDown();
+	}
+
+	setViewNavigate(viewNavigate: (direction: Direction, event?: Event) => void): void {
+		this.viewNavigator.setViewNavigate(viewNavigate);
+	}
+
+	navigateLeft(params: IEventParam<any>): void {
+		if (!this.cellSelection) return;
+		this.viewNavigator.navigateLeft(params);
+	}
+
+	navigateRight(params: IEventParam<any>): void {
+		if (!this.cellSelection) return;
+		this.viewNavigator.navigateRight(params);
+	}
+
+	navigateUp(): void {
+		this.viewNavigator.navigateUp();
+	}
+
+	navigateDown(): void {
+		this.viewNavigator.navigateDown();
+	}
+
+	navigateDatasource(direction: VerticalDirection): void {
+		this.dataNavigator.navigateDatasource(direction);
+	}
+
+	createColumn(column: IGridColumn): GridColumn {
+		return new GridColumn(column);
+	}
+
+	rowClick(row: IDictionary<any>, event: Event, element?: HTMLElement): void {
+		this.gridEvents.rowClick(this.treeDataStructure.clearRow(row), event, element);
+	}
+
+	cellClick(row: IDictionary<any>, column: GridColumn, event: Event, element?: HTMLElement): void {
+		this.gridEvents.cellClick(row, column, event, element);
+	}
+
+	selectClick(row: IDictionary<any>, isSelected: boolean, event: Event, element?: HTMLElement): void {
+		this.dataSelector.selectClick(row, isSelected, event, element);
+	}
+
+	selectAllClick(isSelected: boolean, event: Event, element?: HTMLElement): void {
+		this.dataSelector.selectAllClick(isSelected, event, element);
+	}
+
+	selectAll(isSelected: boolean): void {
+		this.dataSelector.selectAll(isSelected);
+	}
+
+	toggleRow(row: IDictionary): void {
+		this.dataSelector.toggleRow(row);
+	}
+
+	selectRow(row: IDictionary, select: boolean): void {
+		this.dataSelector.selectRow(row, select);
+	}
+
+	callDisableSelection(row: IDictionary): boolean {
+		return this.dataSelector.callDisableSelection(row);
+	}
+
+	changeOrder(sortBy: { key: string; order: 'asc' | 'desc' }[]): Promise<void> {
+		return this.iterableTable.changeOrder(sortBy);
+	}
+
+	selectCell(row: IDictionary, column: GridColumn): void {
+		this.iterableTable.selectCell(row, column);
+	}
+
+	reapplyRowStyleConditions(row: IDictionary): IDictionary {
+		return this.iterableTable.reapplyRowStyleConditions(row);
+	}
+
+	getRowStyleConditions(row: IDictionary): IDictionary {
+		return this.iterableTable.getRowStyleConditions(row);
+	}
+
+	deleteRows(): Promise<any[]> {
+		return this.iterableTable.deleteRows();
+	}
+
+	getActionComponent(
+		actionComponent: IComponent,
+		column: GridColumn,
+		row: IDictionary,
+		parentPath?: string,
+	): IComponent {
+		return this.tableActionBuilder.getActionComponent(actionComponent, column, row, parentPath);
+	}
+
+	public changeData(data = this.datasource.data): void {
+		super.changeData(data);
+		data.forEach((row) => this.iterableTable.reapplyRowStyleConditions(row));
+	}
+
+	selectChildren(row: IDictionary<any>): void {
+		this.dataSelector.selectChildren(row);
+	}
+
+	unselectChildren(row: IDictionary<any>): void {
+		this.dataSelector.unselectChildren(row);
+	}
+
+	buildTree(doGet?: boolean): void {
+		this.iterableTree.buildTree(doGet);
+	}
+
+	setViewUpdateScrollData(fn: () => void): void {
+		this.iterableTree.setViewUpdateScrollData(fn);
+	}
+
+	updateScrollData(): void {
+		this.iterableTree.updateScrollData();
+	}
+
+	updateData(data: IDictionary[]): Promise<any> {
+		this.datasource.data = data;
+		this.resetTree();
+
+		return Promise.resolve(data);
+	}
+}