igniteui-react-grids
Version:
Ignite UI React grid components.
353 lines (348 loc) • 9.86 kB
JavaScript
import * as React from 'react';
import { IgrTreeGridRecord } from "./igr-tree-grid-record";
import { IgrRowType } from "./igr-row-type";
import { IgrCellType } from "./igr-cell-type";
import { IgrGridBaseDirective } from "./igr-grid-base-directive";
import { TreeGrid } from "./TreeGrid";
import { isValidProp, ensureBool } from "igniteui-react-core";
import { ReactTemplateAdapter } from "igniteui-react-core";
import { html } from "lit-html";
export class IgrTreeGrid extends IgrGridBaseDirective {
createImplementation() {
var _a, _b;
let impl = new TreeGrid();
let nat;
if (typeof document !== 'undefined') {
nat = document.createElement("igc-tree-grid");
}
else {
nat = {
style: {}
};
}
if ((_a = this.props) === null || _a === void 0 ? void 0 : _a.className) {
nat.className = this.props.className;
}
if ((_b = this.props) === null || _b === void 0 ? void 0 : _b.id) {
nat.id = this.props.id;
}
impl.setNativeElement(nat);
return impl;
}
/**
* @hidden
*/
get i() {
return this._implementation;
}
constructor(props) {
super(props);
this._getMainRef = this._getMainRef.bind(this);
}
componentDidMount() {
this.mounted = true;
super.componentDidMount();
this._elRef.appendChild(this.i.nativeElement);
}
render() {
const nativePropsName = Object.keys(this.props).filter(prop => !isValidProp(this, prop) && prop !== "originalRef" && prop !== "className");
const nativeProps = {};
nativePropsName.forEach(propName => {
nativeProps[propName] = this.props[propName];
});
const visibleChildren = [];
React.Children.forEach(this.props.children, (ch) => {
if (ch) {
visibleChildren.push(ch);
}
});
let children = this._contentChildrenManager.getChildren(visibleChildren);
this._portalManager.onRender(children);
let style = {};
style.display = 'contents';
if (this.props.style) {
style = this.props.style;
}
let div = React.createElement("div", Object.assign(Object.assign({}, nativeProps), { ref: this._getMainRef, style: style, children: children }));
return div;
}
_getMainRef(ref) {
this._elRef = ref;
}
get childDataKey() {
return this.i.hf;
}
set childDataKey(v) {
this.i.hf = v;
}
get foreignKey() {
return this.i.hg;
}
set foreignKey(v) {
this.i.hg = v;
}
get hasChildrenKey() {
return this.i.hh;
}
set hasChildrenKey(v) {
this.i.hh = v;
}
get cascadeOnDelete() {
return this.i.g9;
}
set cascadeOnDelete(v) {
this.i.g9 = ensureBool(v);
}
get id() {
return this.i.hi;
}
set id(v) {
this.i.hi = v;
}
/**
* Returns an array of the root level `ITreeGridRecord`s.
* ```typescript
* // gets the root record with index=2
* const states = this.grid.rootRecords[2];
* ```
* @memberof IgxTreeGridComponent
*/
get rootRecords() {
if (!this.i.g3) {
return undefined;
}
let ret = [];
for (let i = 0; i < this.i.g3.length; i++) {
let impl = this.i.g3[i];
if (!impl.externalObject) {
if (impl instanceof IgrTreeGridRecord) {
ret.push(impl);
continue;
}
let e = new IgrTreeGridRecord();
e._implementation = impl;
impl.externalObject = e;
}
ret.push(impl.externalObject);
}
return ret;
}
set rootRecords(v) {
let arr = [];
for (let i = 0; i < v.length; i++) {
arr.push(v[i].i);
}
this.i.g3 = arr;
}
/**
* Returns an array of processed (filtered and sorted) root `ITreeGridRecord`s.
* ```typescript
* // gets the processed root record with index=2
* const states = this.grid.processedRootRecords[2];
* ```
* @memberof IgxTreeGridComponent
*/
get processedRootRecords() {
if (!this.i.g2) {
return undefined;
}
let ret = [];
for (let i = 0; i < this.i.g2.length; i++) {
let impl = this.i.g2[i];
if (!impl.externalObject) {
if (impl instanceof IgrTreeGridRecord) {
ret.push(impl);
continue;
}
let e = new IgrTreeGridRecord();
e._implementation = impl;
impl.externalObject = e;
}
ret.push(impl.externalObject);
}
return ret;
}
set processedRootRecords(v) {
let arr = [];
for (let i = 0; i < v.length; i++) {
arr.push(v[i].i);
}
this.i.g2 = arr;
}
get data() {
return this.i.g0;
}
set data(v) {
if (v && !Array.isArray(v) && typeof (v) == "string") {
const re = /\s*(?:,|\s|$)\s*/gm;
v = v.split(re);
}
this.i.g0 = v;
}
get expansionDepth() {
return this.i.hc;
}
set expansionDepth(v) {
this.i.hc = +v;
}
get rowLoadingIndicatorTemplate() {
return this._rowLoadingIndicatorTemplate;
}
set rowLoadingIndicatorTemplate(v) {
this._rowLoadingIndicatorTemplate = v;
if (!this._rowLoadingIndicatorTemplateAdapter) {
this._rowLoadingIndicatorTemplateAdapter = new ReactTemplateAdapter(this._renderer, this._portalManager, "he", { html: html });
}
this._rowLoadingIndicatorTemplateAdapter.setValue(this.i, this._rowLoadingIndicatorTemplate);
}
/**
* Returns an array of the selected `IgxGridCell`s.
* @example
* ```typescript
* const selectedCells = this.grid.selectedCells;
* ```
*/
get selectedCells() {
if (!this.i.g4) {
return undefined;
}
let ret = [];
for (let i = 0; i < this.i.g4.length; i++) {
let impl = this.i.g4[i];
if (!impl.externalObject) {
if (impl instanceof IgrCellType) {
ret.push(impl);
continue;
}
let e = new IgrCellType();
e._implementation = impl;
impl.externalObject = e;
}
ret.push(impl.externalObject);
}
return ret;
}
getDefaultExpandState(record) {
this.i.hn((record == null ? null : record.i));
}
/**
* Expands all rows.
* ```typescript
* this.grid.expandAll();
* ```
* @memberof IgxTreeGridComponent
*/
expandAll() {
this.i.hm();
}
/**
* Collapses all rows.
* ```typescript
* this.grid.collapseAll();
* ```
* @memberof IgxTreeGridComponent
*/
collapseAll() {
this.i.hl();
}
addRow(data, parentRowID) {
this.i.hj(data, parentRowID);
}
beginAddRowByIndex(index, asChild) {
this.i.hk(index, asChild);
}
getSelectedData(formatters, headers) {
let iv = this.i.g1(formatters, headers);
return (iv);
}
/**
* Returns the `IgxTreeGridRow` by index.
* @example
* ```typescript
* const myRow = treeGrid.getRowByIndex(1);
* ```
* index
* @param * index
*/
getRowByIndex(index) {
let iv = this.i.g7(index);
let ret = null;
if (iv && iv.externalObject) {
ret = iv.externalObject;
}
else {
if (iv) {
let e = new IgrRowType();
e._implementation = iv;
iv.externalObject = e;
ret = e;
}
}
return ret;
}
/**
* Returns the `RowType` object by the specified primary key.
* @example
* ```typescript
* const myRow = this.treeGrid.getRowByIndex(1);
* ```
* index
* @param * index
*/
getRowByKey(key) {
let iv = this.i.g8(key);
let ret = null;
if (iv && iv.externalObject) {
ret = iv.externalObject;
}
else {
if (iv) {
let e = new IgrRowType();
e._implementation = iv;
iv.externalObject = e;
ret = e;
}
}
return ret;
}
getCellByColumn(rowIndex, columnField) {
let iv = this.i.g5(rowIndex, columnField);
let ret = null;
if (iv && iv.externalObject) {
ret = iv.externalObject;
}
else {
if (iv) {
let e = new IgrCellType();
e._implementation = iv;
iv.externalObject = e;
ret = e;
}
}
return ret;
}
getCellByKey(rowSelector, columnField) {
let iv = this.i.g6(rowSelector, columnField);
let ret = null;
if (iv && iv.externalObject) {
ret = iv.externalObject;
}
else {
if (iv) {
let e = new IgrCellType();
e._implementation = iv;
iv.externalObject = e;
ret = e;
}
}
return ret;
}
pinRow(rowID, index) {
let iv = this.i.ha(rowID, index);
return (iv);
}
unpinRow(rowID) {
let iv = this.i.hb(rowID);
return (iv);
}
}