igniteui-react-grids
Version:
Ignite UI React grid components.
588 lines (581 loc) • 23.4 kB
JavaScript
import { __assign, __extends } from "tslib";
import * as React from 'react';
import { delegateCombine, delegateRemove } from "igniteui-react-core";
import { IgrPivotConfiguration } from "./igr-pivot-configuration";
import { IgrDimensionsChangeEventArgs } from "./igr-dimensions-change-event-args";
import { IgrPivotConfigurationChangedEventArgs } from "./igr-pivot-configuration-changed-event-args";
import { IgrPivotDimensionEventArgs } from "./igr-pivot-dimension-event-args";
import { IgrPivotValueEventArgs } from "./igr-pivot-value-event-args";
import { IgrSortingExpressionEventArgs } from "./igr-sorting-expression-event-args";
import { IgrValuesChangeEventArgs } from "./igr-values-change-event-args";
import { IgrPivotDimension } from "./igr-pivot-dimension";
import { IgrGridBaseDirective } from "./igr-grid-base-directive";
import { PivotGrid } from "./PivotGrid";
import { isValidProp, ensureBool, interfaceToInternal } from "igniteui-react-core";
import { IgrPivotGridValueTemplateContext } from "./igr-pivot-grid-value-template-context";
import { ReactTemplateAdapter } from "igniteui-react-core";
import { html } from "lit-html";
import { IgrColumnTemplateContext } from "./igr-column-template-context";
import { PivotUISettings } from "./PivotUISettings";
var IgrPivotGrid = /** @class */ /*@__PURE__*/ (function (_super) {
__extends(IgrPivotGrid, _super);
function IgrPivotGrid(props) {
var _this = _super.call(this, props) || this;
_this._dimensionsChange = null;
_this._dimensionsChange_wrapped = null;
_this._pivotConfigurationChange = null;
_this._pivotConfigurationChange_wrapped = null;
_this._dimensionInit = null;
_this._dimensionInit_wrapped = null;
_this._valueInit = null;
_this._valueInit_wrapped = null;
_this._dimensionsSortingExpressionsChange = null;
_this._dimensionsSortingExpressionsChange_wrapped = null;
_this._valuesChange = null;
_this._valuesChange_wrapped = null;
_this._getMainRef = _this._getMainRef.bind(_this);
return _this;
}
IgrPivotGrid.prototype.createImplementation = function () {
var _a, _b;
var impl = new PivotGrid();
var nat;
if (typeof document !== 'undefined') {
nat = document.createElement("igc-pivot-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;
};
Object.defineProperty(IgrPivotGrid.prototype, "i", {
/**
* @hidden
*/
get: function () {
return this._implementation;
},
enumerable: false,
configurable: true
});
IgrPivotGrid.prototype.componentDidMount = function () {
this.mounted = true;
_super.prototype.componentDidMount.call(this);
this._elRef.appendChild(this.i.nativeElement);
};
IgrPivotGrid.prototype.render = function () {
var _this = this;
var nativePropsName = Object.keys(this.props).filter(function (prop) { return !isValidProp(_this, prop) && prop !== "originalRef" && prop !== "className"; });
var nativeProps = {};
nativePropsName.forEach(function (propName) {
nativeProps[propName] = _this.props[propName];
});
var visibleChildren = [];
React.Children.forEach(this.props.children, function (ch) {
if (ch) {
visibleChildren.push(ch);
}
});
var children = this._contentChildrenManager.getChildren(visibleChildren);
this._portalManager.onRender(children);
var style = {};
style.display = 'contents';
if (this.props.style) {
style = this.props.style;
}
var div = React.createElement("div", __assign(__assign({}, nativeProps), { ref: this._getMainRef, style: style, children: children }));
return div;
};
IgrPivotGrid.prototype._getMainRef = function (ref) {
this._elRef = ref;
};
Object.defineProperty(IgrPivotGrid.prototype, "dimensionsSortingExpressions", {
/**
* Gets the sorting expressions generated for the dimensions.
* @example
* ```typescript
* const expressions = this.grid.dimensionsSortingExpressions;
* ```
*/
get: function () {
if (!this.i.g1) {
return undefined;
}
var ret = [];
for (var i = 0; i < this.i.g1.length; i++) {
var impl = this.i.g1[i];
ret.push(impl.nativeElement);
}
return ret;
},
enumerable: false,
configurable: true
});
Object.defineProperty(IgrPivotGrid.prototype, "valueChipTemplate", {
get: function () {
return this._valueChipTemplate;
},
set: function (v) {
this._valueChipTemplate = v;
if (!this._valueChipTemplateAdapter) {
this._valueChipTemplateAdapter = new ReactTemplateAdapter(this._renderer, this._portalManager, "hj", { html: html }, function () { return new IgrPivotGridValueTemplateContext(); });
}
this._valueChipTemplateAdapter.setValue(this.i, this._valueChipTemplate);
},
enumerable: false,
configurable: true
});
Object.defineProperty(IgrPivotGrid.prototype, "rowDimensionHeaderTemplate", {
get: function () {
return this._rowDimensionHeaderTemplate;
},
set: function (v) {
this._rowDimensionHeaderTemplate = v;
if (!this._rowDimensionHeaderTemplateAdapter) {
this._rowDimensionHeaderTemplateAdapter = new ReactTemplateAdapter(this._renderer, this._portalManager, "hi", { html: html }, function () { return new IgrColumnTemplateContext(); });
}
this._rowDimensionHeaderTemplateAdapter.setValue(this.i, this._rowDimensionHeaderTemplate);
},
enumerable: false,
configurable: true
});
Object.defineProperty(IgrPivotGrid.prototype, "pivotConfiguration", {
get: function () {
var r = this.i.g3;
if (r == null) {
return null;
}
if (!r.externalObject) {
var e = new IgrPivotConfiguration();
if (r.$type) {
e._implementation = r;
}
else {
if (e.i.setNativeElement) {
e.i.setNativeElement(r);
}
}
r.externalObject = e;
}
return r.externalObject;
},
set: function (v) {
v == null ? this.i.g3 = null : this.i.g3 = v.i;
},
enumerable: false,
configurable: true
});
Object.defineProperty(IgrPivotGrid.prototype, "autoGenerateConfig", {
get: function () {
return this.i.ha;
},
set: function (v) {
this.i.ha = ensureBool(v);
},
enumerable: false,
configurable: true
});
Object.defineProperty(IgrPivotGrid.prototype, "pivotUI", {
get: function () {
return this.i.g6.nativeElement;
},
set: function (v) {
this.i.g6 = interfaceToInternal(v, function () { return new PivotUISettings(); });
},
enumerable: false,
configurable: true
});
Object.defineProperty(IgrPivotGrid.prototype, "superCompactMode", {
get: function () {
return this.i.hc;
},
set: function (v) {
this.i.hc = ensureBool(v);
},
enumerable: false,
configurable: true
});
Object.defineProperty(IgrPivotGrid.prototype, "defaultExpandState", {
/**
* Gets/Sets the default expand state for all rows.
*/
get: function () {
return this.i.hb;
},
set: function (v) {
this.i.hb = ensureBool(v);
},
enumerable: false,
configurable: true
});
Object.defineProperty(IgrPivotGrid.prototype, "allDimensions", {
/**
* Gets the full list of dimensions.
* @example
* ```typescript
* const dimensions = this.grid.allDimensions;
* ```
*/
get: function () {
if (!this.i.g0) {
return undefined;
}
var ret = [];
for (var i = 0; i < this.i.g0.length; i++) {
var impl = this.i.g0[i];
if (!impl.externalObject) {
if (impl instanceof IgrPivotDimension) {
ret.push(impl);
continue;
}
var e = new IgrPivotDimension();
e._implementation = impl;
impl.externalObject = e;
}
ret.push(impl.externalObject);
}
return ret;
},
enumerable: false,
configurable: true
});
Object.defineProperty(IgrPivotGrid.prototype, "data", {
get: function () {
return this.i.hd;
},
set: function (v) {
this.i.hd = v;
},
enumerable: false,
configurable: true
});
Object.defineProperty(IgrPivotGrid.prototype, "emptyPivotGridTemplate", {
get: function () {
return this._emptyPivotGridTemplate;
},
set: function (v) {
this._emptyPivotGridTemplate = v;
if (!this._emptyPivotGridTemplateAdapter) {
this._emptyPivotGridTemplateAdapter = new ReactTemplateAdapter(this._renderer, this._portalManager, "hh", { html: html });
}
this._emptyPivotGridTemplateAdapter.setValue(this.i, this._emptyPivotGridTemplate);
},
enumerable: false,
configurable: true
});
IgrPivotGrid.prototype.findByName = function (name) {
var baseResult = _super.prototype.findByName.call(this, name);
if (baseResult) {
return baseResult;
}
if (this.pivotConfiguration && this.pivotConfiguration.name && this.pivotConfiguration.name == name) {
return this.pivotConfiguration;
}
if (this.pivotUI && this.pivotUI.name && this.pivotUI.name == name) {
return this.pivotUI;
}
return null;
};
/**
* Notifies for dimension change.
*/
IgrPivotGrid.prototype.notifyDimensionChange = function (regenerateColumns) {
this.i.hu(regenerateColumns);
};
IgrPivotGrid.prototype.toggleColumn = function (col) {
this.i.hz((col == null ? null : col.i));
};
IgrPivotGrid.prototype.getColumnGroupExpandState = function (col) {
this.i.hp((col == null ? null : col.i));
};
IgrPivotGrid.prototype.toggleRowGroup = function (col, newState) {
this.i.h1((col == null ? null : col.i), newState);
};
/**
* Auto-sizes row dimension cells.
* @remarks
* Only sizes based on the dimension cells in view.
* @example
* ```typescript
* this.grid.autoSizeRowDimension(dimension);
* ```
* dimension The row dimension to size.
* @param dimension * The row dimension to size.
*/
IgrPivotGrid.prototype.autoSizeRowDimension = function (dimension) {
this.i.hk((dimension == null ? null : dimension.i));
};
IgrPivotGrid.prototype.insertDimensionAt = function (dimension, targetCollectionType, index) {
this.i.hq((dimension == null ? null : dimension.i), (targetCollectionType == null ? null : targetCollectionType), index);
};
IgrPivotGrid.prototype.moveDimension = function (dimension, targetCollectionType, index) {
this.i.hs((dimension == null ? null : dimension.i), (targetCollectionType == null ? null : targetCollectionType), index);
};
/**
* Removes dimension from its currently collection.
* @remarks
* This is different than toggleDimension that enabled/disables the dimension.
* This completely removes the specified dimension from the collection.
* @example
* ```typescript
* this.grid.removeDimension(dimension);
* ```
* dimension The dimension to be removed.
* @param dimension * The dimension to be removed.
*/
IgrPivotGrid.prototype.removeDimension = function (dimension) {
this.i.hw((dimension == null ? null : dimension.i));
};
/**
* Toggles the dimension's enabled state on or off.
* @remarks
* The dimension remains in its current collection. This just changes its enabled state.
* @example
* ```typescript
* this.grid.toggleDimension(dimension);
* ```
* dimension The dimension to be toggled.
* @param dimension * The dimension to be toggled.
*/
IgrPivotGrid.prototype.toggleDimension = function (dimension) {
this.i.h0((dimension == null ? null : dimension.i));
};
IgrPivotGrid.prototype.insertValueAt = function (value, index) {
this.i.hr((value == null ? null : value.i), index);
};
IgrPivotGrid.prototype.moveValue = function (value, index) {
this.i.ht((value == null ? null : value.i), index);
};
/**
* Removes value from collection.
* @remarks
* This is different than toggleValue that enabled/disables the value.
* This completely removes the specified value from the collection.
* @example
* ```typescript
* this.grid.removeValue(dimension);
* ```
* value The value to be removed.
* @param value * The value to be removed.
*/
IgrPivotGrid.prototype.removeValue = function (value) {
this.i.hx((value == null ? null : value.i));
};
/**
* Toggles the value's enabled state on or off.
* @remarks
* The value remains in its current collection. This just changes its enabled state.
* @example
* ```typescript
* this.grid.toggleValue(value);
* ```
* value The value to be toggled.
* @param value * The value to be toggled.
*/
IgrPivotGrid.prototype.toggleValue = function (value) {
this.i.h2((value == null ? null : value.i));
};
IgrPivotGrid.prototype.sortDimension = function (dimension, sortDirection) {
this.i.hy((dimension == null ? null : dimension.i), (sortDirection == null ? null : sortDirection));
};
IgrPivotGrid.prototype.filterDimension = function (dimension, value, conditionOrExpressionTree) {
this.i.ho((dimension == null ? null : dimension.i), value, (conditionOrExpressionTree == null ? null : conditionOrExpressionTree.i));
};
Object.defineProperty(IgrPivotGrid.prototype, "dimensionsChange", {
get: function () {
return this._dimensionsChange;
},
set: function (ev) {
var _this = this;
if (this._dimensionsChange_wrapped !== null) {
this.i.dimensionsChange = delegateRemove(this.i.dimensionsChange, this._dimensionsChange_wrapped);
this._dimensionsChange_wrapped = null;
this._dimensionsChange = null;
}
this._dimensionsChange = ev;
this._dimensionsChange_wrapped = function (o, e) {
var outerArgs = new IgrDimensionsChangeEventArgs();
outerArgs._provideImplementation(e);
if (_this.beforeDimensionsChange) {
_this.beforeDimensionsChange(_this, outerArgs);
}
if (_this._dimensionsChange) {
_this._dimensionsChange(_this, outerArgs);
}
};
this.i.dimensionsChange = delegateCombine(this.i.dimensionsChange, this._dimensionsChange_wrapped);
if (this.i.dimensionsChangeChanged) {
this.i.dimensionsChangeChanged();
}
;
},
enumerable: false,
configurable: true
});
Object.defineProperty(IgrPivotGrid.prototype, "pivotConfigurationChange", {
get: function () {
return this._pivotConfigurationChange;
},
set: function (ev) {
var _this = this;
if (this._pivotConfigurationChange_wrapped !== null) {
this.i.pivotConfigurationChange = delegateRemove(this.i.pivotConfigurationChange, this._pivotConfigurationChange_wrapped);
this._pivotConfigurationChange_wrapped = null;
this._pivotConfigurationChange = null;
}
this._pivotConfigurationChange = ev;
this._pivotConfigurationChange_wrapped = function (o, e) {
var outerArgs = new IgrPivotConfigurationChangedEventArgs();
outerArgs._provideImplementation(e);
if (_this.beforePivotConfigurationChange) {
_this.beforePivotConfigurationChange(_this, outerArgs);
}
if (_this._pivotConfigurationChange) {
_this._pivotConfigurationChange(_this, outerArgs);
}
};
this.i.pivotConfigurationChange = delegateCombine(this.i.pivotConfigurationChange, this._pivotConfigurationChange_wrapped);
if (this.i.pivotConfigurationChangeChanged) {
this.i.pivotConfigurationChangeChanged();
}
;
},
enumerable: false,
configurable: true
});
Object.defineProperty(IgrPivotGrid.prototype, "dimensionInit", {
get: function () {
return this._dimensionInit;
},
set: function (ev) {
var _this = this;
if (this._dimensionInit_wrapped !== null) {
this.i.dimensionInit = delegateRemove(this.i.dimensionInit, this._dimensionInit_wrapped);
this._dimensionInit_wrapped = null;
this._dimensionInit = null;
}
this._dimensionInit = ev;
this._dimensionInit_wrapped = function (o, e) {
var outerArgs = new IgrPivotDimensionEventArgs();
outerArgs._provideImplementation(e);
if (_this.beforeDimensionInit) {
_this.beforeDimensionInit(_this, outerArgs);
}
if (_this._dimensionInit) {
_this._dimensionInit(_this, outerArgs);
}
};
this.i.dimensionInit = delegateCombine(this.i.dimensionInit, this._dimensionInit_wrapped);
if (this.i.dimensionInitChanged) {
this.i.dimensionInitChanged();
}
;
},
enumerable: false,
configurable: true
});
Object.defineProperty(IgrPivotGrid.prototype, "valueInit", {
get: function () {
return this._valueInit;
},
set: function (ev) {
var _this = this;
if (this._valueInit_wrapped !== null) {
this.i.valueInit = delegateRemove(this.i.valueInit, this._valueInit_wrapped);
this._valueInit_wrapped = null;
this._valueInit = null;
}
this._valueInit = ev;
this._valueInit_wrapped = function (o, e) {
var outerArgs = new IgrPivotValueEventArgs();
outerArgs._provideImplementation(e);
if (_this.beforeValueInit) {
_this.beforeValueInit(_this, outerArgs);
}
if (_this._valueInit) {
_this._valueInit(_this, outerArgs);
}
};
this.i.valueInit = delegateCombine(this.i.valueInit, this._valueInit_wrapped);
if (this.i.valueInitChanged) {
this.i.valueInitChanged();
}
;
},
enumerable: false,
configurable: true
});
Object.defineProperty(IgrPivotGrid.prototype, "dimensionsSortingExpressionsChange", {
get: function () {
return this._dimensionsSortingExpressionsChange;
},
set: function (ev) {
var _this = this;
if (this._dimensionsSortingExpressionsChange_wrapped !== null) {
this.i.dimensionsSortingExpressionsChange = delegateRemove(this.i.dimensionsSortingExpressionsChange, this._dimensionsSortingExpressionsChange_wrapped);
this._dimensionsSortingExpressionsChange_wrapped = null;
this._dimensionsSortingExpressionsChange = null;
}
this._dimensionsSortingExpressionsChange = ev;
this._dimensionsSortingExpressionsChange_wrapped = function (o, e) {
var outerArgs = new IgrSortingExpressionEventArgs();
outerArgs._provideImplementation(e);
if (_this.beforeDimensionsSortingExpressionsChange) {
_this.beforeDimensionsSortingExpressionsChange(_this, outerArgs);
}
if (_this._dimensionsSortingExpressionsChange) {
_this._dimensionsSortingExpressionsChange(_this, outerArgs);
}
};
this.i.dimensionsSortingExpressionsChange = delegateCombine(this.i.dimensionsSortingExpressionsChange, this._dimensionsSortingExpressionsChange_wrapped);
if (this.i.dimensionsSortingExpressionsChangeChanged) {
this.i.dimensionsSortingExpressionsChangeChanged();
}
;
},
enumerable: false,
configurable: true
});
Object.defineProperty(IgrPivotGrid.prototype, "valuesChange", {
get: function () {
return this._valuesChange;
},
set: function (ev) {
var _this = this;
if (this._valuesChange_wrapped !== null) {
this.i.valuesChange = delegateRemove(this.i.valuesChange, this._valuesChange_wrapped);
this._valuesChange_wrapped = null;
this._valuesChange = null;
}
this._valuesChange = ev;
this._valuesChange_wrapped = function (o, e) {
var outerArgs = new IgrValuesChangeEventArgs();
outerArgs._provideImplementation(e);
if (_this.beforeValuesChange) {
_this.beforeValuesChange(_this, outerArgs);
}
if (_this._valuesChange) {
_this._valuesChange(_this, outerArgs);
}
};
this.i.valuesChange = delegateCombine(this.i.valuesChange, this._valuesChange_wrapped);
if (this.i.valuesChangeChanged) {
this.i.valuesChangeChanged();
}
;
},
enumerable: false,
configurable: true
});
return IgrPivotGrid;
}(IgrGridBaseDirective));
export { IgrPivotGrid };