d2coreui 21.0.33 → 23.0.0

package/components/grid/dataGrid.js

@@ -1,1539 +1,1630 @@
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-import React from "react";
-import { ColumnWidthOutlined, ControlOutlined, DownloadOutlined, FileSearchOutlined, LoadingOutlined, ReloadOutlined, SearchOutlined, SettingOutlined, TableOutlined } from "@ant-design/icons";
-import { Button, Card, Dropdown, Empty, Input, Menu } from "antd";
-import { AgGridReact } from "ag-grid-react";
-import 'ag-grid-community/dist/styles/ag-grid.css';
-import 'ag-grid-community/dist/styles/ag-theme-balham.css';
-import 'd2coreui/style/ag-grid/aggrid-adaptations.css';
-import TextColumnFilter from "d2coreui/components/grid/filter/textColumnFilter";
-import CustomColumnFilter from "d2coreui/components/grid/filter/customColumnFilter";
-import SimpleHeader from "d2coreui/components/grid/header/simpleHeader";
-import DataGridEditor from "d2coreui/components/grid/config/dataGridEditor";
-import i18n from "d2core/i18n/i18n";
-import AutoCompleteInput from "d2coreui/components/input/autoCompleteInput";
-import isEqual from "lodash/isEqual";
-import ContextMenu from "d2coreui/components/grid/export/contextMenu";
-import LoadingOverlay from "d2coreui/components/grid/panel/loadingOverlay";
-import NoRecordsOverlay from "d2coreui/components/grid/panel/noRecordsOverlay";
-import at from "lodash/at";
-import ColumnTransfer from "d2coreui/components/grid/config/columnTransfer";
-import cloneDeep from "lodash/cloneDeep";
-import escape from "lodash/escape";
-import { RangeSelector } from "d2coreui/components/grid/cell/rangeSelector";
-import { WildcardQuickFilter } from "d2coreui/components/grid/cell/wildcardQuickFilter";
-import { ColDefUtil } from "ag-grid-community";
-import { LocaleHolder } from "d2core/i18n/localeHolder";
-import tableDefaultRowStyleRules, { GRID_DEFAULT_FONT_SIZE } from "d2coreui/components/grid/cell/tableDefaultRowStyleRules";
-import { ModalDialog } from "d2coreui/components/modal/modalDialog";
-import debounce from "lodash/debounce";
-import { Key } from "ts-key-enum";
-import { ClipboardUtils } from "d2coreui/components/clipboard/clipboardUtils";
-import TimeUtils from "d2core/utils/timeUtils";
-import KeyboardUtils from "d2coreui/components/keyboard/keyboardUtils";
-import NumberCellEditor from "d2coreui/components/grid/cell/numberCellEditor";
-import TextCellEditor from "d2coreui/components/grid/cell/textCellEditor";
-import StatusTextCellEditor from "d2coreui/components/grid/cell/statusTextCellEditor";
-import DateCellEditor from "d2coreui/components/grid/cell/dateCellEditor";
-import memoizeOne from "memoize-one";
-import SimpleStatusTextCellEditor from "d2coreui/components/grid/cell/simpleStatusTextCellEditor";
-import DurationCellEditor from "d2coreui/components/grid/cell/durationCellEditor";
-import CustomEnumCellEditor from "d2coreui/components/grid/cell/customEnumCellEditor";
-import HexaValueCellEditor from "d2coreui/components/grid/cell/hexaValueCellEditor";
-import HexaOctetStringCellEditor from "d2coreui/components/grid/cell/hexaOctetStringCellEditor";
-import ReactDOM from "react-dom";
-import { D2000UnixTimeNullValue, unixTimeToMoment } from "d2core/types/unixTimeUtils";
-import { compileExpression } from "filtrex";
-import DataGridPagination from "./panel/dataGridPagination";
-const gridFrameworkComponents = {
-    customColumnFilter: CustomColumnFilter,
-    textColumnFilter: TextColumnFilter,
-    numberCellEditor: NumberCellEditor,
-    textCellEditor: TextCellEditor,
-    simpleStatusTextCellEditor: SimpleStatusTextCellEditor,
-    statusTextCellEditor: StatusTextCellEditor,
-    dateCellEditor: DateCellEditor,
-    durationCellEditor: DurationCellEditor,
-    customEnumCellEditor: CustomEnumCellEditor,
-    hexaValueCellEditor: HexaValueCellEditor,
-    hexaOctetStringCellEditor: HexaOctetStringCellEditor,
-    simpleHeader: SimpleHeader,
-    loadingOverlay: LoadingOverlay,
-    noRecordsOverlay: NoRecordsOverlay
-};
-const ROW_HEIGHT_DELTA_FROM_FONT_SIZE = 16;
-function getRowNodeId(item) {
-    return item.id + "";
-}
-const rowStyleRuleCompiledExpressions = {};
-export const EXPORT_SEPARATOR = "\n";
-var NavigationEventEnum;
-(function (NavigationEventEnum) {
-    NavigationEventEnum[NavigationEventEnum["KEYBOARD"] = 0] = "KEYBOARD";
-    NavigationEventEnum[NavigationEventEnum["MOUSE"] = 1] = "MOUSE";
-})(NavigationEventEnum || (NavigationEventEnum = {}));
-ColDefUtil.FRAMEWORK_PROPERTIES.push("group", "context", "cellStyle", "renderFilter");
-export default class DataGrid extends React.Component {
-    constructor(props) {
-        super(props);
-        this.wrappingDiv = null;
-        this.state = {
-            pageIndex: 0,
-            pageSize: null,
-            recordsCount: undefined,
-            columnModel: [],
-            sortModel: [],
-            tableConfigVisible: !!this.props.tableConfigVisible,
-            columnsConfigVisible: !!this.props.columnsConfigVisible,
-            rowHeight: 28,
-            viewport: [0, 0],
-            contextMenuVisible: false,
-            firstLoadDone: false,
-            loading: false,
-            columnTransferHeight: 500
-        };
-        this.indexToJump = null;
-        this.columnToJump = null;
-        this.onGridReady = this.onGridReady.bind(this);
-        this.onPaginationChanged = this.onPaginationChanged.bind(this);
-        this.onViewportChanged = this.onViewportChanged.bind(this);
-        this.onCellContextMenu = this.onCellContextMenu.bind(this);
-        this.onCellFocused = this.onCellFocused.bind(this);
-        this.onCellMouseDown = this.onCellMouseDown.bind(this);
-        this.setFocusedCellDebounced = debounce(this.setFocusedCellDebounced.bind(this), 200);
-        this.noRecordsOverlayRenderer = this.noRecordsOverlayRenderer.bind(this);
-        this.loadingOverlayRenderer = this.loadingOverlayRenderer.bind(this);
-        this.changePagination = this.changePagination.bind(this);
-        this.onColumnsChanged = this.onColumnsChanged.bind(this);
-        this.onFilterModified = this.onFilterModified.bind(this);
-        this.onFilterChanged = this.onFilterChanged.bind(this);
-        this.onFilterConfirmed = this.onFilterConfirmed.bind(this);
-        this.onSortChanged = this.onSortChanged.bind(this);
-        this.showTableConfiguration = this.showTableConfiguration.bind(this);
-        this.showColumnsConfig = this.showColumnsConfig.bind(this);
-        this.navigateToNextCell = this.navigateToNextCell.bind(this);
-        this.suppressKeyboardEvent = this.suppressKeyboardEvent.bind(this);
-        this.onRowDataUpdated = this.onRowDataUpdated.bind(this);
-        this._getRowStyle = this._getRowStyle.bind(this);
-        this._getRowHeight = this._getRowHeight.bind(this);
-        this._getCellStyle = this._getCellStyle.bind(this);
-        this.textCustomComparator = this.textCustomComparator.bind(this);
-        this.getExportContent = this.getExportContent.bind(this);
-        this.getDefaultColDefinition = memoizeOne(this.getDefaultColDefinition.bind(this));
-        this.getAdaptedColumnDefs = memoizeOne(this.getAdaptedColumnDefs.bind(this));
-        this.getCustomFrameworkComponents = memoizeOne(this.getCustomFrameworkComponents.bind(this));
-        this.table_context = {
-            loadingOverlayRenderer: this.loadingOverlayRenderer,
-            noRecordsOverlayRenderer: this.noRecordsOverlayRenderer,
-            onFilterConfirmed: this.onFilterConfirmed,
-            fontSize: this.state.rowHeight - ROW_HEIGHT_DELTA_FROM_FONT_SIZE,
-            lineHeight: this.state.rowHeight - 2
-        };
-        this.wildcardQuickFilter = new WildcardQuickFilter();
-        this.columnTypes = {
-            "localizedArrayColumn": {
-                cellRenderer: (params) => {
-                    const value = DataGrid.getCellValue(params);
-                    if (value !== undefined) {
-                        return value.map((s) => i18n(s)).join(",");
-                    }
-                    else {
-                        return "";
-                    }
-                },
-                filterParams: {
-                    textCustomComparator: this.textCustomComparator
-                },
-                filterValueGetter: function (params) {
-                    const value = DataGrid.getCellValue(params);
-                    if (value !== undefined) {
-                        return value.map((s) => i18n(s)).join(",");
-                    }
-                    return null;
-                },
-                getQuickFilterText: function (params) {
-                    const value = DataGrid.getCellValue(params);
-                    if (value !== undefined) {
-                        return value.map((s) => i18n(s)).join(",");
-                    }
-                    return "";
-                }
-            },
-            "numberColumn": {
-                cellRenderer: (params) => {
-                    const value = DataGrid.getCellValue(params);
-                    if (value !== undefined && value !== null) {
-                        return LocaleHolder.formatNumber(value);
-                    }
-                    else {
-                        return "";
-                    }
-                },
-                filterParams: {
-                    textCustomComparator: this.textCustomComparator
-                },
-                filterValueGetter: function (params) {
-                    const value = DataGrid.getCellValue(params);
-                    if (value) {
-                        return LocaleHolder.formatNumber(value);
-                    }
-                    else {
-                        return "";
-                    }
-                },
-                getQuickFilterText: function (params) {
-                    const value = DataGrid.getCellValue(params);
-                    if (value !== undefined) {
-                        return LocaleHolder.formatNumber(value);
-                    }
-                    else {
-                        return "";
-                    }
-                }
-            },
-            "dateColumn": {
-                cellRenderer: (params) => {
-                    const value = DataGrid.getCellValue(params);
-                    if (value !== undefined) {
-                        if (value === D2000UnixTimeNullValue) {
-                            return "---";
-                        }
-                        let tooltipValue;
-                        tooltipValue = unixTimeToMoment(value).format(LocaleHolder.getDateTimeFormat(true, true, true));
-                        return `<span title="${tooltipValue}">${unixTimeToMoment(value).format(LocaleHolder.getDateFormat(!this.props.hideYear))}</span>`;
-                    }
-                    else {
-                        return "---";
-                    }
-                },
-                valueFormatter: (params) => {
-                    const value = DataGrid.getCellValue(params);
-                    if (value !== undefined) {
-                        return unixTimeToMoment(value).format(LocaleHolder.getDateFormat(!this.props.hideYear));
-                    }
-                    return "---";
-                },
-                filterParams: {
-                    textCustomComparator: this.textCustomComparator
-                },
-                filterValueGetter: (params) => {
-                    const value = DataGrid.getCellValue(params);
-                    if (value !== undefined) {
-                        return unixTimeToMoment(value).format(LocaleHolder.getDateFormat(!this.props.hideYear));
-                    }
-                    return null;
-                },
-                getQuickFilterText: (params) => {
-                    const value = DataGrid.getCellValue(params);
-                    if (value !== undefined) {
-                        return unixTimeToMoment(value).format(LocaleHolder.getDateFormat(!this.props.hideYear));
-                    }
-                    return "";
-                }
-            },
-            "dateTimeColumn": {
-                cellRenderer: (params) => {
-                    const value = DataGrid.getCellValue(params);
-                    if (value) {
-                        if (value === D2000UnixTimeNullValue) {
-                            return "Null Time";
-                        }
-                        let tooltipValue;
-                        tooltipValue = unixTimeToMoment(value).format(LocaleHolder.getDateTimeFormat(true, true, true));
-                        return `<span title="${tooltipValue}">${unixTimeToMoment(value).format(LocaleHolder.getDateTimeFormat(!this.props.hideYear, true, this.props.showMilliseconds))}</span>`;
-                    }
-                    else {
-                        return "---";
-                    }
-                },
-                valueFormatter: (params) => {
-                    const value = DataGrid.getCellValue(params);
-                    if (value !== undefined) {
-                        return unixTimeToMoment(value).format(LocaleHolder.getDateTimeFormat(!this.props.hideYear, true, this.props.showMilliseconds));
-                    }
-                    return "---";
-                },
-                filterParams: {
-                    textCustomComparator: this.textCustomComparator
-                },
-                filterValueGetter: (params) => {
-                    const value = DataGrid.getCellValue(params);
-                    if (value !== undefined) {
-                        return unixTimeToMoment(value).format(LocaleHolder.getDateTimeFormat(!this.props.hideYear, true, this.props.showMilliseconds));
-                    }
-                    return null;
-                },
-                getQuickFilterText: (params) => {
-                    const value = DataGrid.getCellValue(params);
-                    if (value !== undefined) {
-                        return unixTimeToMoment(value).format(LocaleHolder.getDateTimeFormat(!this.props.hideYear, true, this.props.showMilliseconds));
-                    }
-                    return "";
-                }
-            },
-            "fromNowDateTimeColumn": {
-                cellRenderer: (params) => {
-                    const value = DataGrid.getCellValue(params);
-                    if (value !== undefined) {
-                        let tooltipValue;
-                        tooltipValue = unixTimeToMoment(value).format(LocaleHolder.getDateTimeFormat(true, true, true));
-                        return `<span title="${tooltipValue}">${unixTimeToMoment(value).fromNow()}</span>`;
-                    }
-                    else {
-                        return "---";
-                    }
-                },
-                valueFormatter: (params) => {
-                    const value = DataGrid.getCellValue(params);
-                    if (value !== undefined) {
-                        return unixTimeToMoment(value).format(LocaleHolder.getDateTimeFormat(!this.props.hideYear, true, this.props.showMilliseconds));
-                    }
-                    return "---";
-                },
-                filterParams: {
-                    textCustomComparator: this.textCustomComparator
-                },
-                filterValueGetter: (params) => {
-                    const value = DataGrid.getCellValue(params);
-                    if (value !== undefined) {
-                        return unixTimeToMoment(value).format(LocaleHolder.getDateTimeFormat(!this.props.hideYear, true, this.props.showMilliseconds));
-                    }
-                    return null;
-                },
-                getQuickFilterText: (params) => {
-                    const value = DataGrid.getCellValue(params);
-                    if (value !== undefined) {
-                        return unixTimeToMoment(value).format(LocaleHolder.getDateTimeFormat(!this.props.hideYear, true, this.props.showMilliseconds));
-                    }
-                    return "";
-                }
-            },
-            "escapedValueColumn": {
-                cellRenderer: (params) => {
-                    const value = DataGrid.getCellValue(params);
-                    if (value !== undefined) {
-                        return `<span style="white-space: pre" title="${escape(value)}">${typeof value === "string" ? escape(value.replace(/[\r\n]+/g, ' ')) : value}</span>`;
-                    }
-                    else {
-                        return "";
-                    }
-                },
-                valueFormatter: (params) => {
-                    const value = DataGrid.getCellValue(params);
-                    if (value !== undefined) {
-                        return typeof value === "string" ? value.replace(/[\r\n]+/g, ' ') : value;
-                    }
-                    else {
-                        return "";
-                    }
-                }
-            },
-            "textColumnFilter": {
-                filter: "agTextColumnFilter",
-                floatingFilter: true,
-                floatingFilterComponent: "textColumnFilter",
-                filterParams: {
-                    textCustomComparator: this.textCustomComparator
-                },
-                floatingFilterComponentParams: {
-                    suppressFilterButton: true,
-                },
-            },
-            "textColumnServerFilter": {
-                filter: "agTextColumnFilter",
-                floatingFilter: true,
-                floatingFilterComponent: "textColumnFilter",
-                filterParams: {
-                    buttons: ['apply'],
-                    textCustomComparator: this.textCustomComparator
-                },
-                floatingFilterComponentParams: {
-                    suppressFilterButton: true,
-                },
-            },
-            "customColumnServerFilter": {
-                filter: "agTextColumnFilter",
-                floatingFilter: true,
-                floatingFilterComponent: "customColumnFilter",
-                filterParams: {
-                    buttons: ['apply'],
-                    textCustomComparator: this.textCustomComparator
-                },
-                floatingFilterComponentParams: {
-                    suppressFilterButton: true,
-                },
-            },
-            "alignRight": {}
-        };
-    }
-    static getCellValue(props) {
-        if (props) {
-            if (props.colDef.field && typeof props.getValue === "function") {
-                return props.getValue(props.colDef.field);
-            }
-            if (props.data && props.colDef && props.colDef.field) {
-                return at(props.data, props.colDef.field)[0];
-            }
-            if (props.value !== undefined) {
-                return props.value;
-            }
-        }
-        return undefined;
-    }
-    textCustomComparator(filter, value, filterText) {
-        const filterTextLowerCase = filterText.toLowerCase();
-        const valueLowerCase = value.toString().toLowerCase();
-        switch (filter) {
-            case 'contains':
-                if (filterTextLowerCase.indexOf("*") >= 0 || filterTextLowerCase.indexOf("?") >= 0) {
-                    const wildcardFilterRegExp = this.wildcardQuickFilter.getWildcardFilterRegExp(filterTextLowerCase);
-                    if (wildcardFilterRegExp) {
-                        return wildcardFilterRegExp.test(valueLowerCase);
-                    }
-                    else {
-                        return valueLowerCase.indexOf(filterTextLowerCase) >= 0;
-                    }
-                }
-                else {
-                    return valueLowerCase.indexOf(filterTextLowerCase) >= 0;
-                }
-            case 'notContains':
-                return valueLowerCase.indexOf(filterTextLowerCase) === -1;
-            case 'equals':
-                return valueLowerCase === filterTextLowerCase;
-            case 'notEqual':
-                return valueLowerCase != filterTextLowerCase;
-            case 'startsWith':
-                return valueLowerCase.indexOf(filterTextLowerCase) === 0;
-            case 'endsWith':
-                var index = valueLowerCase.lastIndexOf(filterTextLowerCase);
-                return index >= 0 && index === (valueLowerCase.length - filterTextLowerCase.length);
-            default:
-                console.warn('invalid filter type ' + filter);
-                return false;
-        }
-    }
-    componentDidUpdate(prevProps) {
-        if (!this.gridApi) {
-            return;
-        }
-        if (this.props.filter && prevProps.filter && this.props.filter.columnSearchVisible !== prevProps.filter.columnSearchVisible) {
-            setTimeout(() => {
-                if (this.gridApi) {
-                    this.gridApi.refreshHeader();
-                    if (this.props.filter && !this.props.filter.columnSearchVisible) {
-                        this.gridApi.setFilterModel(null);
-                        this.gridApi.onFilterChanged();
-                    }
-                }
-            }, 0);
-        }
-        if (this.props.rowData && this.props.rowData !== prevProps.rowData) {
-            if (this.props.filter && this.props.filter.getFilterModel) {
-                this.gridApi.setFilterModel(this.props.filter.getFilterModel());
-                this.gridApi.onFilterChanged();
-            }
-            this.setSortModel(this.state.sortModel);
-            this.gridApi.refreshClientSideRowModel("group");
-            this.gridApi.redrawRows();
-            const selectedObjectsVisibleInGrid = this.props.rowData.filter((object) => {
-                return this.props.selectedIds ? this.props.selectedIds.indexOf(object.id) >= 0 : false;
-            });
-            if (selectedObjectsVisibleInGrid.length > 0) {
-                selectedObjectsVisibleInGrid.forEach((object) => {
-                    const rowNode = this.gridApi ? this.gridApi.getRowNode(object.id + "") : null;
-                    if (rowNode && !rowNode.isSelected()) {
-                        rowNode.setSelected(true, true);
-                    }
-                });
-            }
-            else {
-                this.gridApi.deselectAll();
-            }
-        }
-        if (this.props.datasource && this.props.datasource !== prevProps.datasource) {
-            this.gridApi.setDatasource(this.props.datasource);
-        }
-        this.updateRowHeight();
-    }
-    setColumnState(columnModel) {
-        var _a;
-        const columnStates = [];
-        if (columnModel) {
-            columnModel.forEach((item) => {
-                const columnState = Object.assign({}, item);
-                item.sortIndex = undefined;
-                item.sort = undefined;
-                columnStates.push(columnState);
-            });
-        }
-        (_a = this.gridColumnApi) === null || _a === void 0 ? void 0 : _a.applyColumnState({ state: columnStates, defaultState: { sort: null }, applyOrder: true });
-    }
-    setSortModel(sortModel) {
-        var _a;
-        const columnState = [];
-        if (sortModel) {
-            sortModel.forEach((item, index) => {
-                columnState.push({
-                    colId: item.colId,
-                    sort: item.sort,
-                    sortIndex: index
-                });
-            });
-        }
-        (_a = this.gridColumnApi) === null || _a === void 0 ? void 0 : _a.applyColumnState({ state: columnState, defaultState: { sort: null }, applyOrder: true });
-    }
-    getSortModel() {
-        var _a, _b;
-        const columnState = (_b = (_a = this.gridColumnApi) === null || _a === void 0 ? void 0 : _a.getColumnState()) !== null && _b !== void 0 ? _b : [];
-        const filteredStates = columnState === null || columnState === void 0 ? void 0 : columnState.filter(item => item.sort != null);
-        const indexes = {};
-        filteredStates.forEach((state) => {
-            if (state.colId) {
-                indexes[state.colId] = state.sortIndex;
-            }
-        });
-        const res = filteredStates.map(s => {
-            return { colId: s.colId, sort: s.sort };
-        });
-        res.sort((a, b) => indexes[a.colId] - indexes[b.colId]);
-        return res;
-    }
-    updateRowHeight() {
-        let rowHeight = this.calculateRowHeight(this.props.rowStyleRules);
-        if (rowHeight && rowHeight !== this.state.rowHeight) {
-            this.changeRowHeight(rowHeight);
-        }
-    }
-    calculateRowHeight(rowStyleRules) {
-        let rowHeight;
-        if (rowStyleRules) {
-            for (let i = 0; i < rowStyleRules.length; i++) {
-                if (rowStyleRules[i].key === "table-font-size") {
-                    const currentFontSize = rowStyleRules[i].style.fontSize;
-                    if (typeof currentFontSize === "number") {
-                        rowHeight = (currentFontSize ? currentFontSize : GRID_DEFAULT_FONT_SIZE) + ROW_HEIGHT_DELTA_FROM_FONT_SIZE;
-                    }
-                    else {
-                        rowHeight = GRID_DEFAULT_FONT_SIZE + ROW_HEIGHT_DELTA_FROM_FONT_SIZE;
-                    }
-                }
-            }
-        }
-        return rowHeight;
-    }
-    static getDerivedStateFromProps(props, state) {
-        const newState = {};
-        if (props.tableConfigVisible === true || props.tableConfigVisible === false) {
-            if (props.tableConfigVisible !== state.tableConfigVisible) {
-                newState.tableConfigVisible = props.tableConfigVisible;
-            }
-        }
-        return newState;
-    }
-    onGridReady(gridReadyEvent) {
-        const gridApi = gridReadyEvent.api;
-        const gridColumnApi = gridReadyEvent.columnApi;
-        if (!this.gridApi || this.gridApi !== gridApi) {
-            const rangeSelector = new RangeSelector(this.wrappingDiv);
-            rangeSelector.init(gridApi, gridColumnApi);
-            this.wildcardQuickFilter.adaptFilterEngine(gridApi);
-            this.gridApi = gridApi;
-            this.gridColumnApi = gridColumnApi;
-            if (this.props.onGridReady) {
-                this.props.onGridReady(gridReadyEvent);
-            }
-            this.setState({
-                sortModel: this.getSortModel(),
-                columnModel: this.gridColumnApi.getColumnState(),
-            });
-            this.updateRowHeight();
-        }
-    }
-    onPaginationChanged(event) {
-        if (!this.gridApi) {
-            this.onGridReady({ type: "gridReady", api: event.api, columnApi: event.columnApi });
-        }
-        if (this.gridApi) {
-            const currentPage = this.gridApi.paginationGetCurrentPage();
-            const currentPageSize = this.gridApi.paginationGetPageSize();
-            let recordsCount = this.props.paging.pageSize >= 0 ? (this.gridApi.paginationIsLastPageFound() ? this.gridApi.paginationGetRowCount() : 0) : this.gridApi.getDisplayedRowCount();
-            if (this.state.pageSize !== currentPageSize) {
-                if (this.props.paging.onPaginationChanged) {
-                    this.props.paging.onPaginationChanged(currentPageSize, this.props.paging.pageSize);
-                }
-                if (!this.state.firstLoadDone) {
-                    this.loadData();
-                    this.setState({ firstLoadDone: true });
-                }
-            }
-            this.setState({ pageSize: currentPageSize, recordsCount: recordsCount, pageIndex: currentPage });
-            if (this.indexToJump !== null && this.columnToJump !== null) {
-                this.gridApi.setFocusedCell(this.indexToJump, this.columnToJump);
-                this.indexToJump = null;
-            }
-        }
-        if (this.props.onPaginationChanged) {
-            this.props.onPaginationChanged(event);
-        }
-    }
-    onViewportChanged(event) {
-        const dataGridEvent = event;
-        const rowsScrollingDelta = this.state.viewport[1] ? event.lastRow + 1 - this.state.viewport[1] : event.lastRow + 1;
-        dataGridEvent.rowsScrollingDelta = rowsScrollingDelta;
-        this.setState({ viewport: [event.firstRow + 1, event.lastRow + 1] });
-        if (this.props.onViewportChanged) {
-            this.props.onViewportChanged(event);
-        }
-    }
-    changePagination(pageSize) {
-        if (!this.gridApi) {
-            return;
-        }
-        const gridApiWithPrivateAccess = this.gridApi;
-        if (pageSize > 0) {
-            gridApiWithPrivateAccess.gridOptionsWrapper.setProperty('pagination', true);
-            gridApiWithPrivateAccess.gridOptionsWrapper.setProperty('paginationAutoPageSize', false);
-            this.gridApi.paginationSetPageSize(pageSize);
-            if (this.props.paging.onPaginationChanged) {
-                this.props.paging.onPaginationChanged(pageSize, pageSize);
-            }
-        }
-        else if (pageSize === 0) {
-            gridApiWithPrivateAccess.gridOptionsWrapper.setProperty('pagination', true);
-            gridApiWithPrivateAccess.gridOptionsWrapper.setProperty('paginationAutoPageSize', true);
-            const rowHeight = gridApiWithPrivateAccess.gridOptionsWrapper.getRowHeightAsNumber();
-            const bodyHeight = gridApiWithPrivateAccess.ctrlsService.centerRowContainerCtrl.viewportSizeFeature.getBodyHeight();
-            let availablePageSize = 1000;
-            if (bodyHeight > 0) {
-                availablePageSize = Math.floor(bodyHeight / rowHeight);
-            }
-            if (this.props.paging.pageSize > availablePageSize) {
-                this.gridApi.paginationSetPageSize(1);
-            }
-            else {
-                this.gridApi.paginationSetPageSize(null);
-            }
-            if (this.props.paging && this.props.paging.onPaginationChanged) {
-                this.props.paging.onPaginationChanged(this.state.pageSize, 0);
-            }
-        }
-        else {
-            gridApiWithPrivateAccess.gridOptionsWrapper.setProperty('pagination', false);
-            gridApiWithPrivateAccess.gridOptionsWrapper.setProperty('paginationAutoPageSize', false);
-            if (this.props.paging && this.props.paging.onPaginationChanged) {
-                this.props.paging.onPaginationChanged(this.state.pageSize, -1);
-            }
-        }
-    }
-    showMilliseconds(showMilis) {
-        var _a, _b;
-        (_b = (_a = this.props).onShowMilliseconds) === null || _b === void 0 ? void 0 : _b.call(_a, showMilis, () => {
-            if (!this.gridApi) {
-                return;
-            }
-            if (!this.props.rowModelType || this.props.rowModelType === "clientSide") {
-                this.gridApi.refreshClientSideRowModel("group");
-            }
-            this.gridApi.redrawRows();
-        });
-    }
-    showYear(showYear) {
-        var _a, _b;
-        (_b = (_a = this.props).onShowYear) === null || _b === void 0 ? void 0 : _b.call(_a, showYear, () => {
-            if (!this.gridApi) {
-                return;
-            }
-            if (!this.props.rowModelType || this.props.rowModelType === "clientSide") {
-                this.gridApi.refreshClientSideRowModel("group");
-            }
-            this.gridApi.redrawRows();
-        });
-    }
-    changeRowHeight(rowHeight) {
-        this.setState({ rowHeight: rowHeight }, () => {
-            if (this.gridApi) {
-                if (this.props.headerHeight === undefined) {
-                    this.gridApi.setHeaderHeight(rowHeight + 4);
-                }
-                if (this.props.floatingFiltersHeight === undefined) {
-                    this.gridApi.setFloatingFiltersHeight(rowHeight + 4);
-                }
-                this.gridApi.gridOptionsWrapper.setProperty('rowHeight', rowHeight);
-                this.gridApi.resetRowHeights();
-                this.gridApi.refreshHeader();
-                this.gridApi.redrawRows();
-                if (this.props.rowModelType === "infinite" && this.props.datasource) {
-                    this.gridApi.setDatasource(this.props.datasource);
-                }
-            }
-            if (this.props.onRowHeightChanged) {
-                this.props.onRowHeightChanged(rowHeight);
-            }
-        });
-    }
-    onGoToPage(pageIndex) {
-        if (this.gridApi) {
-            this.gridApi.paginationGoToPage(pageIndex);
-        }
-    }
-    loadData(callback) {
-        if (!this.gridApi) {
-            return;
-        }
-        this.setState({ loading: true });
-        if (!this.props.loadingOverlayRenderer) {
-            this.gridApi.showLoadingOverlay();
-        }
-        this.props.onLoadData((totalRecords) => {
-            if (!this.gridApi) {
-                return;
-            }
-            this.gridApi.hideOverlay();
-            this.setState({ loading: false });
-            if (callback) {
-                callback();
-            }
-            if (totalRecords === 0) {
-                setTimeout(() => {
-                    var _a;
-                    if (!this.isActive()) {
-                        return;
-                    }
-                    (_a = this.gridApi) === null || _a === void 0 ? void 0 : _a.showNoRowsOverlay();
-                }, 400);
-            }
-            if (this.props.autofocus) {
-                this.focus();
-            }
-        });
-    }
-    focus() {
-        setTimeout(() => {
-            var _a, _b, _c, _d;
-            if (!this.isActive()) {
-                return;
-            }
-            const columnModel = (_a = this.gridColumnApi) === null || _a === void 0 ? void 0 : _a.getColumnState();
-            let columnIdToFocus = ((_b = columnModel === null || columnModel === void 0 ? void 0 : columnModel[0]) === null || _b === void 0 ? void 0 : _b.colId) || "name";
-            const selectedNodes = (_c = this.gridApi) === null || _c === void 0 ? void 0 : _c.getSelectedNodes();
-            const selectedRowIndex = (selectedNodes && selectedNodes.length > 0 && selectedNodes[selectedNodes.length - 1].rowIndex) || 0;
-            (_d = this.gridApi) === null || _d === void 0 ? void 0 : _d.setFocusedCell(selectedRowIndex, columnIdToFocus);
-        }, 200);
-    }
-    isActive() {
-        return !!this.gridApi && !this.gridApi.destroyCalled;
-    }
-    onColumnsChanged(event) {
-        const columnModel = event.columnApi.getColumnState();
-        if (this.props.onColumnsChanged) {
-            this.props.onColumnsChanged(columnModel, event);
-        }
-        this.setState({ columnModel: columnModel });
-    }
-    setColumnSearchVisible(visible) {
-        if (this.gridApi && this.props.filter && this.props.filter.getFilterModel) {
-            this.gridApi.setFilterModel(this.props.filter.getFilterModel());
-        }
-        if (this.props.filter && this.props.filter.onColumnSearchVisible) {
-            this.props.filter.onColumnSearchVisible(visible);
-        }
-    }
-    onFilterModified(event) {
-        if (this.props.filter && this.props.filter.onFilterModified) {
-            this.props.filter.onFilterModified(event);
-        }
-    }
-    onFilterChanged(event) {
-        if (this.props.filter && this.props.filter.onFilterChanged) {
-            this.props.filter.onFilterChanged(event);
-        }
-    }
-    onFilterConfirmed() {
-        if (this.props.filter && this.props.filter.onFilterConfirmed) {
-            this.props.filter.onFilterConfirmed();
-        }
-    }
-    onSortChanged(event) {
-        if (this.props.onSortChanged && this.gridApi) {
-            const currentSortModel = this.getSortModel();
-            if (!isEqual(this.state.sortModel, currentSortModel)) {
-                this.setState({ sortModel: currentSortModel }, () => {
-                    if (this.props.onSortChanged) {
-                        this.props.onSortChanged(event);
-                    }
-                });
-            }
-        }
-    }
-    showTableConfiguration(show) {
-        if (this.props.onTableConfigVisible) {
-            this.props.onTableConfigVisible(show);
-        }
-        this.setState({ tableConfigVisible: show }, () => {
-            if (this.gridApi && !this.state.tableConfigVisible) {
-                if (!this.props.rowModelType || this.props.rowModelType === "clientSide") {
-                    this.gridApi.refreshClientSideRowModel("group");
-                }
-                this.gridApi.redrawRows();
-            }
-        });
-    }
-    showColumnsConfig(show) {
-        if (this.props.onColumnsConfigVisible) {
-            this.props.onColumnsConfigVisible(show);
-        }
-        this.columnModelBeforeEdit = cloneDeep(this.state.columnModel);
-        this.setState({ columnsConfigVisible: show });
-    }
-    navigateToNextCell(params) {
-        var _a;
-        this.lastNavigationEvent = 0;
-        var suggestedNextCell = params.nextCellPosition;
-        if (!this.gridApi) {
-            return suggestedNextCell !== null && suggestedNextCell !== void 0 ? suggestedNextCell : params.previousCellPosition;
-        }
-        const pageIndex = this.gridApi.paginationGetCurrentPage();
-        const totalPages = this.gridApi.paginationGetTotalPages();
-        var previousCell = params.previousCellPosition;
-        switch ((_a = params.event) === null || _a === void 0 ? void 0 : _a.code) {
-            case Key.ArrowDown:
-                if ((previousCell.rowIndex + 1) >= this.gridApi.getModel().getRowCount()) {
-                    if (pageIndex < (totalPages - 1)) {
-                        this.onGoToPage(pageIndex + 1);
-                        return {
-                            rowIndex: 0,
-                            column: previousCell.column,
-                            rowPinned: previousCell.rowPinned
-                        };
-                    }
-                    else {
-                        return {
-                            rowIndex: previousCell.rowIndex,
-                            column: previousCell.column,
-                            rowPinned: previousCell.rowPinned
-                        };
-                    }
-                }
-                break;
-            case Key.ArrowUp:
-                if ((previousCell.rowIndex - 1) < 0) {
-                    if (pageIndex > 0) {
-                        this.onGoToPage(pageIndex - 1);
-                        return {
-                            rowIndex: this.gridApi.getModel().getRowCount() - 1,
-                            column: previousCell.column,
-                            rowPinned: previousCell.rowPinned
-                        };
-                    }
-                    else {
-                        return {
-                            rowIndex: previousCell.rowIndex,
-                            column: previousCell.column,
-                            rowPinned: previousCell.rowPinned
-                        };
-                    }
-                }
-                break;
-        }
-        return suggestedNextCell !== null && suggestedNextCell !== void 0 ? suggestedNextCell : params.previousCellPosition;
-    }
-    suppressKeyboardEvent(params) {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
-        if (!this.gridApi) {
-            return false;
-        }
-        const pageIndex = this.gridApi.paginationGetCurrentPage();
-        const totalPages = this.gridApi.paginationGetTotalPages();
-        switch (params.event.code) {
-            case Key.ArrowDown:
-            case Key.ArrowUp:
-            case Key.ArrowLeft:
-            case Key.ArrowRight:
-                if (params.editing && params.event.altKey) {
-                    const focusedCell = this.gridApi.getFocusedCell();
-                    if (focusedCell) {
-                        let indexToJump;
-                        let columnToJump;
-                        if (params.event.code === Key.ArrowDown) {
-                            indexToJump = focusedCell.rowIndex + 1;
-                            columnToJump = focusedCell.column;
-                            if (indexToJump >= this.gridApi.getModel().getRowCount()) {
-                                if (pageIndex < (totalPages - 1)) {
-                                    this.onGoToPage(pageIndex + 1);
-                                    indexToJump = 0;
-                                }
-                                else {
-                                    indexToJump = focusedCell.rowIndex;
-                                }
-                            }
-                            this.lastNavigationEvent = 0;
-                            this.indexToJump = indexToJump;
-                            this.columnToJump = columnToJump;
-                            setTimeout(() => {
-                                var _a;
-                                (_a = this.gridApi) === null || _a === void 0 ? void 0 : _a.startEditingCell({
-                                    rowIndex: indexToJump,
-                                    colKey: columnToJump,
-                                    keyPress: 13
-                                });
-                            }, 0);
-                            return true;
-                        }
-                        else if (params.event.code === Key.ArrowUp) {
-                            indexToJump = focusedCell.rowIndex - 1;
-                            columnToJump = focusedCell.column;
-                            if (indexToJump < 0) {
-                                if (pageIndex > 0) {
-                                    this.onGoToPage(pageIndex - 1);
-                                    indexToJump = this.gridApi.getModel().getRowCount() - 1;
-                                }
-                                else {
-                                    indexToJump = focusedCell.rowIndex;
-                                }
-                            }
-                            this.lastNavigationEvent = 0;
-                            this.indexToJump = indexToJump;
-                            this.columnToJump = columnToJump;
-                            setTimeout(() => {
-                                var _a;
-                                (_a = this.gridApi) === null || _a === void 0 ? void 0 : _a.startEditingCell({
-                                    rowIndex: indexToJump,
-                                    colKey: columnToJump,
-                                    keyPress: 13
-                                });
-                            }, 0);
-                            return true;
-                        }
-                        else if (params.event.code === Key.ArrowLeft) {
-                            this.gridApi.tabToPreviousCell();
-                            break;
-                        }
-                        else {
-                            this.gridApi.tabToNextCell();
-                            break;
-                        }
-                    }
-                }
-                break;
-            case Key.PageDown:
-                this.lastNavigationEvent = 0;
-                if (pageIndex < (totalPages - 1)) {
-                    this.gridApi.paginationGoToNextPage();
-                    const focusedCell = this.gridApi.getFocusedCell();
-                    if (focusedCell) {
-                        this.indexToJump = Math.min(focusedCell.rowIndex + this.gridApi.paginationGetPageSize(), this.gridApi.paginationGetRowCount());
-                        this.columnToJump = focusedCell.column;
-                        return true;
-                    }
-                }
-                break;
-            case Key.PageUp:
-                this.lastNavigationEvent = 0;
-                if (pageIndex > 0) {
-                    this.gridApi.paginationGoToPreviousPage();
-                    const focusedCell = this.gridApi.getFocusedCell();
-                    if (focusedCell) {
-                        this.indexToJump = Math.max(focusedCell.rowIndex - this.gridApi.paginationGetPageSize(), 0);
-                        this.columnToJump = focusedCell.column;
-                        return true;
-                    }
-                }
-                break;
-            case Key.End:
-                this.lastNavigationEvent = 0;
-                if (pageIndex < (totalPages - 1)) {
-                    this.gridApi.paginationGoToLastPage();
-                    const focusedCell = this.gridApi.getFocusedCell();
-                    if (focusedCell) {
-                        this.indexToJump = this.gridApi.paginationGetRowCount() - 1;
-                        this.columnToJump = focusedCell.column;
-                        return true;
-                    }
-                }
-                break;
-            case Key.Home:
-                this.lastNavigationEvent = 0;
-                if (pageIndex > 0) {
-                    this.gridApi.paginationGoToFirstPage();
-                    const focusedCell = this.gridApi.getFocusedCell();
-                    if (focusedCell) {
-                        this.indexToJump = 0;
-                        this.columnToJump = focusedCell.column;
-                        return true;
-                    }
-                }
-                break;
-            case "KeyA":
-                if (params.event.ctrlKey && !params.editing) {
-                    var firstRow = this.gridApi.getFirstDisplayedRow();
-                    var lastRow = this.gridApi.getLastDisplayedRow();
-                    this.gridApi.deselectAll();
-                    if (this.props.rowModelType === "infinite") {
-                        for (let i = firstRow; i <= lastRow; i++) {
-                            (_a = this.gridApi.getDisplayedRowAtIndex(i)) === null || _a === void 0 ? void 0 : _a.setSelected(true);
-                        }
-                    }
-                    else {
-                        this.gridApi.forEachNodeAfterFilter(function (node, index) {
-                            if (index >= firstRow && index <= lastRow) {
-                                node.setSelected(true);
-                            }
-                        });
-                    }
-                }
-                break;
-            case "KeyI":
-                if (params.event.ctrlKey) {
-                    const focusedCell = this.gridApi.getFocusedCell();
-                    const column = (_c = (_b = this.gridColumnApi) === null || _b === void 0 ? void 0 : _b.getColumn("objectId")) !== null && _c !== void 0 ? _c : (_d = this.gridColumnApi) === null || _d === void 0 ? void 0 : _d.getColumn("id");
-                    if (focusedCell && column) {
-                        const displayedRowAtIndex = this.gridApi.getDisplayedRowAtIndex(focusedCell.rowIndex);
-                        if (displayedRowAtIndex) {
-                            ClipboardUtils.copyToClipboard(this.getValue(column, displayedRowAtIndex));
-                        }
-                        this.gridApi.setFocusedCell(focusedCell.rowIndex, focusedCell.column.getId());
-                    }
-                }
-                break;
-            case "KeyB":
-                if (params.event.ctrlKey) {
-                    const focusedCell = this.gridApi.getFocusedCell();
-                    const column = (_f = (_e = this.gridColumnApi) === null || _e === void 0 ? void 0 : _e.getColumn("objectName")) !== null && _f !== void 0 ? _f : (_g = this.gridColumnApi) === null || _g === void 0 ? void 0 : _g.getColumn("name");
-                    if (focusedCell && column) {
-                        const displayedRowAtIndex1 = this.gridApi.getDisplayedRowAtIndex(focusedCell.rowIndex);
-                        if (displayedRowAtIndex1) {
-                            ClipboardUtils.copyToClipboard(this.getValue(column, displayedRowAtIndex1));
-                        }
-                        this.gridApi.setFocusedCell(focusedCell.rowIndex, focusedCell.column.getId());
-                    }
-                }
-                break;
-            case "KeyC":
-                if (params.event.ctrlKey && !params.editing) {
-                    const focusedCell = this.gridApi.getFocusedCell();
-                    if (focusedCell) {
-                        const displayedRowAtIndex2 = this.gridApi.getDisplayedRowAtIndex(focusedCell.rowIndex);
-                        if (displayedRowAtIndex2) {
-                            ClipboardUtils.copyToClipboard(this.getValue(focusedCell.column, displayedRowAtIndex2, true));
-                        }
-                        this.gridApi.setFocusedCell(focusedCell.rowIndex, focusedCell.column.getId());
-                    }
-                }
-                break;
-            case Key.Enter:
-                (_j = (_h = this.props).onEnter) === null || _j === void 0 ? void 0 : _j.call(_h);
-                break;
-        }
-        (_l = (_k = this.props).onKeyPressed) === null || _l === void 0 ? void 0 : _l.call(_k, params.event);
-        return false;
-    }
-    getValue(column, row, doNotReplaceNewline) {
-        var _a;
-        let formattedValue = (_a = this.gridApi) === null || _a === void 0 ? void 0 : _a.getValue(column, row);
-        if (formattedValue && typeof formattedValue === "string" && formattedValue.indexOf(EXPORT_SEPARATOR) > 0 && !doNotReplaceNewline) {
-            formattedValue = formattedValue.replace(/[\n\r]+/, ' ');
-        }
-        const valueFormatter = column.getColDef().valueFormatter;
-        if (valueFormatter) {
-            const params = {
-                data: row.data,
-                node: row,
-                column: column,
-                colDef: column.getColDef(),
-                api: this.gridApi,
-                columnApi: this.gridApi.gridOptionsWrapper.columnApi,
-                context: this.gridApi.gridOptionsWrapper.getContext(),
-                value: formattedValue
-            };
-            if (typeof valueFormatter === 'function') {
-                formattedValue = valueFormatter === null || valueFormatter === void 0 ? void 0 : valueFormatter(params);
-            }
-            else if (typeof valueFormatter === 'string') {
-                formattedValue = at(row.data, valueFormatter)[0];
-            }
-        }
-        return formattedValue;
-    }
-    async getExportContent(progressPopup, props) {
-        if (!this.gridApi) {
-            return [];
-        }
-        const model = this.gridApi.getModel();
-        const tableContent = [];
-        const columns = this.gridApi.columnModel.getAllDisplayedColumns().map((column) => {
-            const columnTypes = column.getColDef().type;
-            return {
-                column: column,
-                displayName: column.getColDef().headerName,
-                isDateField: columnTypes && columnTypes.indexOf("dateColumn") >= 0,
-                isDateTimeField: columnTypes && columnTypes.indexOf("dateTimeColumn") >= 0
-            };
-        });
-        if (columns.length === 0) {
-            return tableContent;
-        }
-        tableContent.push(columns.map((column) => column.displayName));
-        let rowCount;
-        let tableNodes = [];
-        if (model.getType() === "clientSide") {
-            if (props.onlySelectedNodes) {
-                rowCount = 0;
-                this.gridApi.forEachNodeAfterFilterAndSort((node) => {
-                    if (node.isSelected()) {
-                        tableNodes.push(node);
-                        rowCount++;
-                    }
-                });
-            }
-            else {
-                rowCount = model.getRowCount();
-                this.gridApi.forEachNodeAfterFilterAndSort((node) => {
-                    tableNodes.push(node);
-                });
-            }
-        }
-        else {
-            if (props.onlySelectedNodes) {
-                const selectedNodes = this.gridApi.getSelectedNodes();
-                rowCount = selectedNodes.length;
-                selectedNodes.forEach((node) => {
-                    tableNodes.push(node);
-                });
-                tableNodes.sort((a, b) => { var _a, _b; return ((_a = a.rowIndex) !== null && _a !== void 0 ? _a : 0) > ((_b = b.rowIndex) !== null && _b !== void 0 ? _b : 0) ? 1 : (a.rowIndex === b.rowIndex) ? 0 : -1; });
-            }
-            else {
-                const virtualRowCount = model.getRowCount();
-                rowCount = virtualRowCount ? virtualRowCount : 0;
-            }
-        }
-        progressPopup === null || progressPopup === void 0 ? void 0 : progressPopup.setRecordCount(rowCount);
-        let percentStep = Math.floor(rowCount / 100);
-        if (percentStep < 100) {
-            percentStep = 100;
-        }
-        if (model.getType() === "clientSide" || props.onlySelectedNodes) {
-            for (let index = 0; index < tableNodes.length; index++) {
-                const record = [];
-                columns.forEach((column) => {
-                    let value = this.getValue(column.column, tableNodes[index]);
-                    record.push(value);
-                });
-                tableContent.push(record);
-                if (index % percentStep === 0) {
-                    progressPopup === null || progressPopup === void 0 ? void 0 : progressPopup.update(Math.floor(index / rowCount * 100) - 1);
-                    await TimeUtils.sleep(100);
-                }
-            }
-        }
-        else {
-            for (let index = 0; index < rowCount; index++) {
-                let row = undefined;
-                let record = [];
-                do {
-                    record = [];
-                    do {
-                        row = model.getRow(index);
-                        if (!row || !row.data) {
-                            await TimeUtils.sleep(100);
-                        }
-                    } while (!row || !row.data);
-                    columns.forEach((column) => {
-                        record.push(this.getValue(column.column, row));
-                    });
-                    if (record.filter((cell) => !!cell).length === 0) {
-                        await TimeUtils.sleep(100);
-                    }
-                } while (record.filter((cell) => !!cell).length === 0);
-                tableContent.push(record);
-                if (index % percentStep === 0) {
-                    progressPopup === null || progressPopup === void 0 ? void 0 : progressPopup.update(Math.floor(index / rowCount * 100) - 1);
-                    await TimeUtils.sleep(100);
-                }
-            }
-        }
-        progressPopup === null || progressPopup === void 0 ? void 0 : progressPopup.update(99);
-        await TimeUtils.sleep(300);
-        return tableContent;
-    }
-    onCellFocused(event) {
-        var _a, _b, _c, _d, _e;
-        const row = event.rowIndex !== null ? (_a = this.gridApi) === null || _a === void 0 ? void 0 : _a.getDisplayedRowAtIndex(event.rowIndex) : undefined;
-        if (row) {
-            if (this.lastNavigationEvent === 0 && KeyboardUtils.isKeyPressed(Key.Shift) && this.lastCellFocus && this.lastCellFocus.rowIndex !== event.rowIndex) {
-                if (!row.isSelected()) {
-                    row.setSelected(true, false);
-                }
-                else if (((_b = this.lastCellFocus) === null || _b === void 0 ? void 0 : _b.rowIndex) !== null) {
-                    const lastFocusedRow = (_c = this.gridApi) === null || _c === void 0 ? void 0 : _c.getDisplayedRowAtIndex(this.lastCellFocus.rowIndex);
-                    if (lastFocusedRow === null || lastFocusedRow === void 0 ? void 0 : lastFocusedRow.isSelected()) {
-                        lastFocusedRow.setSelected(false, false);
-                    }
-                }
-            }
-            else if (!row.isSelected() && !KeyboardUtils.isKeyPressed(Key.Control) && !KeyboardUtils.isKeyPressed(Key.Shift)) {
-                row.setSelected(true, true);
-            }
-        }
-        (_e = (_d = this.props).onCellFocused) === null || _e === void 0 ? void 0 : _e.call(_d, event);
-        this.lastCellFocus = event;
-    }
-    onCellMouseDown(e) {
-        var _a, _b;
-        this.lastNavigationEvent = 1;
-        if (e.rowIndex !== null) {
-            this.setFocusedCellDebounced(e.rowIndex, e.column, e.rowPinned !== null ? e.rowPinned : undefined);
-        }
-        (_b = (_a = this.props).onCellMouseDown) === null || _b === void 0 ? void 0 : _b.call(_a, e);
-    }
-    setFocusedCellDebounced(rowIndex, column, rowPinned) {
-        var _a;
-        (_a = this.gridApi) === null || _a === void 0 ? void 0 : _a.setFocusedCell(rowIndex, column, rowPinned);
-    }
-    onCellContextMenu(event) {
-        this.setState({ contextMenuVisible: !!event });
-        if (event.node) {
-            if (!event.node.isSelected()) {
-                event.node.setSelected(true, true, false);
-            }
-        }
-    }
-    loadingOverlayRenderer() {
-        if (this.props.loadingOverlayRenderer) {
-            const loadingOverlay = this.props.loadingOverlayRenderer();
-            if (loadingOverlay) {
-                return loadingOverlay;
-            }
-        }
-        return React.createElement("div", null,
-            React.createElement(LoadingOutlined, { style: { fontSize: 40, color: "#1890ff" } }));
-    }
-    noRecordsOverlayRenderer() {
-        if (this.props.noRecordsOverlayRenderer) {
-            const noRecordsOverlay = this.props.noRecordsOverlayRenderer();
-            if (noRecordsOverlay) {
-                return noRecordsOverlay;
-            }
-        }
-        return (React.createElement(Empty, { description: i18n("No records found."), imageStyle: { height: "8vh" } },
-            React.createElement(Button, { type: "primary", onClick: () => {
-                    if (this.props.search && this.props.search.onSearch) {
-                        this.props.search.onSearch();
-                    }
-                } },
-                React.createElement(SearchOutlined, null),
-                " ",
-                i18n("Search"))));
-    }
-    onRowDataUpdated(event) {
-        if (!this.gridApi) {
-            return;
-        }
-        const currentPage = this.gridApi.paginationGetCurrentPage();
-        const recordsCount = this.props.paging.pageSize >= 0 ? (this.gridApi.paginationIsLastPageFound() ? this.gridApi.paginationGetRowCount() : 0) : this.gridApi.getDisplayedRowCount();
-        this.setState({ recordsCount: recordsCount, pageIndex: currentPage });
-        if (this.props.onRowDataUpdated) {
-            this.props.onRowDataUpdated(event);
-        }
-    }
-    _getRowStyle(params) {
-        const rowStyleRules = this.props.rowStyleRules;
-        if (rowStyleRules) {
-            const style = {};
-            rowStyleRules.forEach((rowStyleRule) => {
-                if (rowStyleRule.expression) {
-                    if (!rowStyleRuleCompiledExpressions[rowStyleRule.expression]) {
-                        rowStyleRuleCompiledExpressions[rowStyleRule.expression] = compileExpression(rowStyleRule.expression);
-                    }
-                    if (rowStyleRuleCompiledExpressions[rowStyleRule.expression](params.node.data)) {
-                        Object.assign(style, rowStyleRule.style);
-                    }
-                }
-                else {
-                    Object.assign(style, rowStyleRule.style);
-                }
-            });
-            if (!style.color) {
-                style.color = null;
-            }
-            else if (typeof style.color === "object") {
-                style.color = `rgba(${style.color.r},${style.color.g},${style.color.b},${style.color.a})`;
-            }
-            if (!style.backgroundColor) {
-                style.backgroundColor = "inherit";
-            }
-            else if (typeof style.backgroundColor === "object") {
-                style.backgroundColor = `rgba(${style.backgroundColor.r},${style.backgroundColor.g},${style.backgroundColor.b},${style.backgroundColor.a})`;
-            }
-            if (!style.fontWeight) {
-                style.fontWeight = "inherit";
-            }
-            if (style.fontSize) {
-                const lineHeight = style.fontSize + ROW_HEIGHT_DELTA_FROM_FONT_SIZE - 2;
-                style.fontSize = style.fontSize + "px";
-                style.lineHeight = lineHeight + "px";
-            }
-            else {
-                style.fontSize = "inherit";
-            }
-            if (this.props.getRowStyle) {
-                const rowStyle = this.props.getRowStyle(params);
-                if (rowStyle) {
-                    return Object.assign(style, rowStyle);
-                }
-            }
-            return style;
-        }
-        return DataGrid.EMPTY_STYLE;
-    }
-    _getRowHeight() {
-        return this.state.rowHeight;
-    }
-    _getCellStyle(params) {
-        var _a;
-        const fontSize = this.state.rowHeight - ROW_HEIGHT_DELTA_FROM_FONT_SIZE;
-        const cellStyles = { "font-size": fontSize + "px" };
-        if (params.colDef.type && params.colDef.type.indexOf("alignRight") >= 0) {
-            cellStyles["text-align"] = "right";
-        }
-        if ((_a = params.colDef.cellRendererParams) === null || _a === void 0 ? void 0 : _a.originalCellStyle) {
-            const originalCellStylesOrHandler = params.colDef.cellRendererParams.originalCellStyle;
-            if (typeof originalCellStylesOrHandler === "object") {
-                Object.assign(cellStyles, originalCellStylesOrHandler);
-            }
-            else if (typeof originalCellStylesOrHandler === "function") {
-                const originalCellStyles = originalCellStylesOrHandler(params);
-                if (originalCellStyles) {
-                    Object.assign(cellStyles, originalCellStyles);
-                }
-            }
-        }
-        return cellStyles;
-    }
-    getDefaultColDefinition(colDef) {
-        if (colDef) {
-            return Object.assign(Object.assign({}, colDef), { suppressKeyboardEvent: this.suppressKeyboardEvent });
-        }
-        else {
-            return { suppressKeyboardEvent: this.suppressKeyboardEvent };
-        }
-    }
-    getCustomFrameworkComponents(frameworkComponents) {
-        let customFrameworkComponents = gridFrameworkComponents;
-        if (frameworkComponents) {
-            customFrameworkComponents = Object.assign(gridFrameworkComponents, frameworkComponents);
-        }
-        return customFrameworkComponents;
-    }
-    renderNavigationPanel() {
-        var _a, _b;
-        return (React.createElement(React.Fragment, null,
-            this.props.toolbar && this.props.toolbar.renderToolbar ? this.props.toolbar.renderToolbar(this.renderToolBarWithSearch()) : this.renderToolBarWithSearch(),
-            this.props.paging.pageSize >= 0 &&
-                React.createElement(DataGridPagination, { disabled: this.state.loading, current: this.state.pageIndex ? this.state.pageIndex + 1 : 1, pageSize: this.state.pageSize ? this.state.pageSize : 20, total: (_a = this.state.recordsCount) !== null && _a !== void 0 ? _a : 1, onGoToPage: page => {
-                        this.onGoToPage(page - 1);
-                    } }),
-            this.props.paging.pageSize < 0 && this.state.recordsCount && !((_b = this.props.toolbar) === null || _b === void 0 ? void 0 : _b.hideRecordCount) ?
-                React.createElement("span", { className: "ant-pagination-total-text", style: {
-                        flex: "0 1 auto",
-                        textAlign: "right",
-                        whiteSpace: "nowrap",
-                        marginLeft: "24px"
-                    } }, `${this.state.viewport[0]}-${this.state.viewport[1]} ${i18n('of')} ${this.state.recordsCount}`)
-                : undefined));
-    }
-    renderToolBarWithSearch() {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
-        return (React.createElement(Input.Group, { key: "filter-panel", compact: true, size: "default", style: { whiteSpace: "nowrap", flexGrow: 1, display: "flex" } }, (_a = this.props.toolbar) === null || _a === void 0 ? void 0 :
-            _a.toolbarButtons,
-            React.createElement(Dropdown, { trigger: ["click"], overlay: React.createElement(ContextMenu, { showMilliseconds: !!this.props.showMilliseconds, showYear: !this.props.hideYear, renderer: (_b = this.props.exportMenu) === null || _b === void 0 ? void 0 : _b.renderer, onClick: (_c = this.props.exportMenu) === null || _c === void 0 ? void 0 : _c.onClick, getExportContent: this.getExportContent }), disabled: this.state.loading },
-                React.createElement(Button, { title: i18n("Export") },
-                    React.createElement(DownloadOutlined, null))),
-            React.createElement(Dropdown, { trigger: ["click"], overlay: this.renderSettingsMenu() },
-                React.createElement(Button, { title: i18n("Extended table features"), disabled: this.state.loading },
-                    React.createElement(TableOutlined, null))),
-            !((_d = this.props.search) === null || _d === void 0 ? void 0 : _d.hidden) && !((_e = this.props.search) === null || _e === void 0 ? void 0 : _e.searchRenderer) && React.createElement(AutoCompleteInput, { style: { minWidth: 100, flexGrow: 1 }, placeholder: this.props.search ? this.props.search.placeholder : undefined, stringFormatter: this.props.search ? this.props.search.stringFormatter : undefined, value: this.props.search ? this.props.search.searchString : undefined, inputReadonly: this.props.search ? this.props.search.inputReadonly : undefined, options: this.props.search ? this.props.search.searchHistory : undefined, onChange: this.props.search ? this.props.search.onChange : undefined, onSearch: this.props.search ? this.props.search.onSearch : undefined, disabled: this.state.loading || (this.props.filter && this.props.filter.columnSearchVisible) }), (_g = (_f = this.props.search) === null || _f === void 0 ? void 0 : _f.searchRenderer) === null || _g === void 0 ? void 0 :
-            _g.call(_f),
-            React.createElement(Button, { title: ((_h = this.props.search) === null || _h === void 0 ? void 0 : _h.hidden) ? i18n("Refresh") : i18n("Search"), className: "search-btn " + (this.props.search && this.props.search.searchButtonClassName ? this.props.search.searchButtonClassName : ""), disabled: (_j = this.props.search) === null || _j === void 0 ? void 0 : _j.searchButtonDisabled, type: "primary", onClick: () => {
-                    if (this.props.search && this.props.search.onSearch) {
-                        this.props.search.onSearch();
-                    }
-                } }, this.state.loading ? React.createElement(LoadingOutlined, null) : (((_k = this.props.search) === null || _k === void 0 ? void 0 : _k.hidden) ? React.createElement(ReloadOutlined, null) :
-                React.createElement(SearchOutlined, null)))));
-    }
-    renderSettingsMenu() {
-        var _a;
-        let menuItems = [
-            React.createElement(Menu.Item, { key: "columnFilter", icon: React.createElement(FileSearchOutlined, null), className: this.props.filter && this.props.filter.columnSearchVisible ? "ant-dropdown-menu-item-selected" : "", title: i18n("Turn on/off column filter") }, i18n("Column Filter")),
-            React.createElement(Menu.Item, { key: "autosizeAllColumns", icon: React.createElement(ColumnWidthOutlined, null) }, i18n("Autosize All Columns")),
-            React.createElement(Menu.Item, { key: "columnsConfig", icon: React.createElement(ControlOutlined, null) }, i18n("Columns Configuration")),
-            React.createElement(Menu.Divider, { key: "columnsAndAdvancedConfigDivider" }),
-            React.createElement(Menu.Item, { key: "advancedConfig", icon: React.createElement(SettingOutlined, null) }, i18n("Advanced Settings"))
-        ];
-        if ((_a = this.props.settingsMenu) === null || _a === void 0 ? void 0 : _a.renderer) {
-            menuItems = this.props.settingsMenu.renderer(menuItems);
-        }
-        return React.createElement(Menu, { onClick: ({ key }) => {
-                var _a, _b;
-                switch (key) {
-                    case "columnFilter":
-                        const visible = !(this.props.filter && this.props.filter.columnSearchVisible);
-                        this.setColumnSearchVisible(visible);
-                        break;
-                    case "autosizeAllColumns":
-                        (_a = this.gridColumnApi) === null || _a === void 0 ? void 0 : _a.autoSizeAllColumns();
-                        break;
-                    case "columnsConfig":
-                        this.showColumnsConfig(true);
-                        break;
-                    case "advancedConfig":
-                        this.showTableConfiguration(true);
-                        break;
-                    default:
-                        if ((_b = this.props.settingsMenu) === null || _b === void 0 ? void 0 : _b.onClick) {
-                            this.props.settingsMenu.onClick(key + "");
-                        }
-                }
-            } }, menuItems);
-    }
-    renderContextMenu() {
-        var _a, _b;
-        return React.createElement(ContextMenu, { onlySelectedNodes: true, showMilliseconds: !!this.props.showMilliseconds, showYear: !this.props.hideYear, renderer: (_a = this.props.contextMenu) === null || _a === void 0 ? void 0 : _a.renderer, onClick: (_b = this.props.contextMenu) === null || _b === void 0 ? void 0 : _b.onClick, getExportContent: this.getExportContent, hideNotificationOnClipboardCopy: true });
-    }
-    getAdaptedColumnDefs(columnDefs, floatingFilterEnabled, disableColumnDefsPreprocessing) {
-        if (columnDefs.length === 0) {
-            return undefined;
-        }
-        if (disableColumnDefsPreprocessing) {
-            return columnDefs;
-        }
-        const adaptedColumnDefs = columnDefs ? columnDefs.map((columnDef) => {
-            var _a, _b;
-            const _c = columnDef, { group, floatingFilter, hide } = _c, rest = __rest(_c, ["group", "floatingFilter", "hide"]);
-            let floatingFilterEnabledForColumn = !!floatingFilter;
-            if (typeof columnDef.type === "string") {
-                if (!!((_a = this.columnTypes[columnDef.type]) === null || _a === void 0 ? void 0 : _a.floatingFilter)) {
-                    floatingFilterEnabledForColumn = true;
-                }
-            }
-            else {
-                (_b = columnDef.type) === null || _b === void 0 ? void 0 : _b.forEach((type) => {
-                    var _a;
-                    if (!!((_a = this.columnTypes[type]) === null || _a === void 0 ? void 0 : _a.floatingFilter)) {
-                        floatingFilterEnabledForColumn = true;
-                    }
-                });
-            }
-            return Object.assign(Object.assign({}, rest), { floatingFilter: floatingFilterEnabledForColumn && floatingFilterEnabled, resizable: true, headerComponent: "simpleHeader", headerComponentParams: {
-                    onColumnsConfigVisible: this.showColumnsConfig
-                }, hide: hide === undefined ? rest.initialHide : hide, cellStyle: this._getCellStyle, cellRendererParams: columnDef.cellStyle ? { originalCellStyle: columnDef.cellStyle } : undefined });
-        }) : undefined;
-        if (adaptedColumnDefs) {
-            setTimeout(() => {
-                var _a, _b;
-                (_b = (_a = this.props).onColumnDefsAdapted) === null || _b === void 0 ? void 0 : _b.call(_a, adaptedColumnDefs);
-            }, 0);
-        }
-        return adaptedColumnDefs;
-    }
-    render() {
-        var _a, _b, _c, _d;
-        const _e = this.props, { onGridReady, columnDefs, disableColumnDefsPreprocessing, onColumnsChanged, paging, onPaginationChanged, onViewportChanged, selectedIds, search, toolbar, filter, onFilterChanged, onFilterModified, onCellFocused, onSortChanged, frameworkComponents, tableConfigVisible, onTableConfigVisible, noRecordsOverlayRenderer, loadingOverlayRenderer, onRowDataUpdated, rowStyleRules, onChangeRowStyleRules, defaultShowMilliseconds, onShowMilliseconds, defaultHideYear, onShowYear, suppressLoadingOverlay, defaultColDef, headerHeight } = _e, passedProperties = __rest(_e, ["onGridReady", "columnDefs", "disableColumnDefsPreprocessing", "onColumnsChanged", "paging", "onPaginationChanged", "onViewportChanged", "selectedIds", "search", "toolbar", "filter", "onFilterChanged", "onFilterModified", "onCellFocused", "onSortChanged", "frameworkComponents", "tableConfigVisible", "onTableConfigVisible", "noRecordsOverlayRenderer", "loadingOverlayRenderer", "onRowDataUpdated", "rowStyleRules", "onChangeRowStyleRules", "defaultShowMilliseconds", "onShowMilliseconds", "defaultHideYear", "onShowYear", "suppressLoadingOverlay", "defaultColDef", "headerHeight"]);
-        let key;
-        let paginationPageSize = undefined;
-        if (paging.pageSize > 0) {
-            paginationPageSize = paging.pageSize;
-            passedProperties.pagination = true;
-            key = "paginated-table";
-        }
-        else if (paging.pageSize === 0) {
-            passedProperties.paginationAutoPageSize = true;
-            passedProperties.pagination = true;
-            key = "paginated-table";
-        }
-        else {
-            passedProperties.pagination = false;
-            key = "non-paginated-table";
-        }
-        const floatingFilterEnabled = !!filter && !!filter.columnSearchVisible;
-        const adaptedColumnDefs = this.getAdaptedColumnDefs(columnDefs, floatingFilterEnabled, !!disableColumnDefsPreprocessing);
-        const customFrameworkComponents = this.getCustomFrameworkComponents(frameworkComponents);
-        const debugMode = process.env.NODE_ENV === 'development';
-        const panelStyle = {
-            display: "flex",
-            flexFlow: "column",
-            height: "100%",
-            width: "100%",
-            paddingBottom: 8,
-        };
-        if (this.props.panelStyle) {
-            Object.assign(panelStyle, this.props.panelStyle);
-        }
-        const tablePanelStyle = { flex: "1 1 auto", marginTop: 16, overflow: "auto" };
-        if (this.props.tablePanelStyle) {
-            Object.assign(tablePanelStyle, this.props.tablePanelStyle);
-        }
-        return (React.createElement(React.Fragment, null,
-            React.createElement(Card, { size: "small", bordered: false, style: { height: "100%" }, bodyStyle: panelStyle },
-                React.createElement("div", { style: { display: "flex" } }, this.renderNavigationPanel()),
-                React.createElement("div", { style: tablePanelStyle },
-                    React.createElement(Dropdown, { trigger: ["contextMenu"], getPopupContainer: () => {
-                            var _a, _b;
-                            return ((_b = (_a = ReactDOM.findDOMNode(this)) === null || _a === void 0 ? void 0 : _a.parentNode) !== null && _b !== void 0 ? _b : document.body);
-                        }, overlay: this.renderContextMenu(), overlayStyle: !this.state.contextMenuVisible ? { display: "none" } : undefined, onVisibleChange: (visible) => {
-                            if (!visible) {
-                                this.setState({ contextMenuVisible: false });
-                            }
-                        } },
-                        React.createElement("div", { className: "ag-theme-balham", style: { width: "100%", height: "100%" }, ref: (wrapingDiv) => {
-                                this.wrappingDiv = wrapingDiv;
-                            } },
-                            React.createElement(AgGridReact, Object.assign({ key: key, debug: debugMode, paginationPageSize: paginationPageSize, maxConcurrentDatasourceRequests: this.props.rowModelType === "infinite" ? 1 : undefined, onGridReady: this.onGridReady, onPaginationChanged: this.onPaginationChanged, onFilterModified: this.onFilterModified, onFilterChanged: this.onFilterChanged, onSortChanged: this.onSortChanged, defaultColDef: this.getDefaultColDefinition(defaultColDef), columnDefs: adaptedColumnDefs }, passedProperties, { onCellFocused: this.onCellFocused, suppressPaginationPanel: true, getRowNodeId: getRowNodeId, frameworkComponents: customFrameworkComponents, columnTypes: this.columnTypes, onColumnVisible: this.onColumnsChanged, onColumnPinned: this.onColumnsChanged, onColumnResized: this.onColumnsChanged, onColumnMoved: this.onColumnsChanged, onCellMouseDown: this.onCellMouseDown, navigateToNextCell: this.navigateToNextCell, onViewportChanged: this.onViewportChanged, onCellContextMenu: this.onCellContextMenu, loadingOverlayComponent: 'loadingOverlay', noRowsOverlayComponent: 'noRecordsOverlay', onRowDataUpdated: this.onRowDataUpdated, context: this.table_context, rowHeight: this.state.rowHeight, getRowStyle: this._getRowStyle, getRowHeight: this._getRowHeight, headerHeight: headerHeight !== undefined ? headerHeight : this.state.rowHeight + 4, floatingFiltersHeight: this.state.rowHeight + 4, suppressLoadingOverlay: this.props.loadingOverlayRenderer ? true : this.props.suppressLoadingOverlay })),
-                            this.state.loading && this.props.loadingOverlayRenderer &&
-                                React.createElement("div", { className: "ag-overlay", "aria-hidden": "true", ref: "overlayWrapper" },
-                                    React.createElement("div", { className: "ag-overlay-panel" },
-                                        React.createElement("div", { className: "ag-overlay-wrapper ag-layout-normal ag-overlay-loading-wrapper" },
-                                            React.createElement("div", { className: "ag-react-container" }, (_b = (_a = this.props).loadingOverlayRenderer) === null || _b === void 0 ? void 0 : _b.call(_a))))))), (_d = (_c = this.props).tableOverlayRenderer) === null || _d === void 0 ? void 0 :
-                    _d.call(_c))),
-            !!this.gridApi && !!this.gridColumnApi && this.state.pageSize !== null &&
-                React.createElement(DataGridEditor, { dataGrid: this, gridApi: this.gridApi, gridColumnApi: this.gridColumnApi, columnDefinitions: columnDefs, columnModel: this.state.columnModel, visible: !!this.props.tableConfigVisible, onTableConfigVisible: this.showTableConfiguration, paginationPageSize: paging.pageSize, paginationDefaultPageSize: paging.defaultPageSize, currentPageSize: this.state.pageSize, showMilliseconds: !!this.props.showMilliseconds, defaultShowMilliseconds: !!this.props.defaultShowMilliseconds, showYear: !this.props.hideYear, defaultShowYear: !this.props.defaultHideYear, rowStyleRules: this.props.rowStyleRules, defaultRowStyleRules: this.props.defaultRowStyleRules, onChangeRowStyleRules: onChangeRowStyleRules }),
-            !!this.gridApi && !!this.gridColumnApi && React.createElement(ModalDialog, { mode: "OK_CANCEL", open: this.state.columnsConfigVisible, initialWidth: 700, initialHeight: this.state.columnTransferHeight, title: React.createElement("span", null,
-                    React.createElement(ControlOutlined, { style: {
-                            color: "#faad14",
-                            fontSize: 22,
-                            marginRight: 16
-                        } }),
-                    i18n("Columns Configuration")), cancelText: i18n("Cancel"), onCancel: () => {
-                    if (this.gridColumnApi && this.columnModelBeforeEdit) {
-                        this.gridColumnApi.applyColumnState({ state: this.columnModelBeforeEdit, applyOrder: true });
-                        delete this.columnModelBeforeEdit;
-                        this.showColumnsConfig(false);
-                    }
-                }, onOk: () => {
-                    delete this.columnModelBeforeEdit;
-                    this.showColumnsConfig(false);
-                }, onResize: ({ height }) => {
-                    this.setState({ columnTransferHeight: height });
-                }, zIndex: 100 },
-                React.createElement(ColumnTransfer, { columnDefinitions: columnDefs, columnModel: this.state.columnModel, gridApi: this.gridApi, gridColumnApi: this.gridColumnApi, height: this.state.columnTransferHeight - 154 }))));
-    }
-}
-DataGrid.defaultProps = {
-    paging: {
-        pageSize: 0,
-        defaultPageSize: 0
-    },
-    rowStyleRules: tableDefaultRowStyleRules()
-};
-DataGrid.EMPTY_STYLE = {};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import React from "react";
+import { ColumnWidthOutlined, ControlOutlined, DownloadOutlined, FileSearchOutlined, LoadingOutlined, ReloadOutlined, SearchOutlined, SettingOutlined, TableOutlined } from "@ant-design/icons";
+import { Button, Card, Dropdown, Empty, Space } from "antd";
+import { AgGridReact } from "ag-grid-react";
+import 'ag-grid-community/styles/ag-grid.css';
+import 'ag-grid-community/styles/ag-theme-balham.css';
+import 'd2coreui/style/ag-grid/aggrid-adaptations.css';
+import TextColumnFilter from "d2coreui/components/grid/filter/textColumnFilter";
+import CustomColumnFilter from "d2coreui/components/grid/filter/customColumnFilter";
+import SimpleHeader from "d2coreui/components/grid/header/simpleHeader";
+import DataGridEditor from "d2coreui/components/grid/config/dataGridEditor";
+import i18n from "d2core/i18n/i18n";
+import AutoCompleteInput from "d2coreui/components/input/autoCompleteInput";
+import isEqual from "lodash/isEqual";
+import getContextMenu from "d2coreui/components/grid/export/contextMenu";
+import LoadingOverlay from "d2coreui/components/grid/panel/loadingOverlay";
+import NoRecordsOverlay from "d2coreui/components/grid/panel/noRecordsOverlay";
+import at from "lodash/at";
+import ColumnTransfer from "d2coreui/components/grid/config/columnTransfer";
+import cloneDeep from "lodash/cloneDeep";
+import escape from "lodash/escape";
+import { RangeSelector } from "d2coreui/components/grid/cell/rangeSelector";
+import { _defineModule, CellCtrl, ModuleRegistry } from "ag-grid-community";
+import { LocaleHolder } from "d2core/i18n/localeHolder";
+import tableDefaultRowStyleRules from "d2coreui/components/grid/cell/tableDefaultRowStyleRules";
+import { ModalDialog } from "d2coreui/components/modal/modalDialog";
+import debounce from "lodash/debounce";
+import { Key } from "ts-key-enum";
+import { ClipboardUtils } from "d2coreui/components/clipboard/clipboardUtils";
+import TimeUtils from "d2core/utils/timeUtils";
+import KeyboardUtils from "d2coreui/components/keyboard/keyboardUtils";
+import NumberCellEditor from "d2coreui/components/grid/cell/numberCellEditor";
+import TextCellEditor from "d2coreui/components/grid/cell/textCellEditor";
+import StatusTextCellEditor from "d2coreui/components/grid/cell/statusTextCellEditor";
+import DateCellEditor from "d2coreui/components/grid/cell/dateCellEditor";
+import memoizeOne from "memoize-one";
+import SimpleStatusTextCellEditor from "d2coreui/components/grid/cell/simpleStatusTextCellEditor";
+import DurationCellEditor from "d2coreui/components/grid/cell/durationCellEditor";
+import CustomEnumCellEditor from "d2coreui/components/grid/cell/customEnumCellEditor";
+import HexaValueCellEditor from "d2coreui/components/grid/cell/hexaValueCellEditor";
+import HexaOctetStringCellEditor from "d2coreui/components/grid/cell/hexaOctetStringCellEditor";
+import ReactDOM from "react-dom";
+import { D2000UnixTimeNullValue, unixTimeToMoment } from "d2core/types/unixTimeUtils";
+import { compileExpression } from "filtrex";
+import DataGridPagination from "./panel/dataGridPagination";
+import { calculateLineHeight, calculateRowHeight, getFontSize, getLineHeight, getRowHeightDelta, GRID_DEFAULT_FONT_SIZE, GRID_DEFAULT_ROW_HEIGHT_DELTA } from "./config/rowHeightCalculator";
+import BeanAccessor from "./cell/beanAccessor";
+import WildcardQuickFilterEngine from "./filter/wildcardQuickFilterEngine";
+const gridFrameworkComponents = {
+    customColumnFilter: CustomColumnFilter,
+    textColumnFilter: TextColumnFilter,
+    numberCellEditor: NumberCellEditor,
+    textCellEditor: TextCellEditor,
+    simpleStatusTextCellEditor: SimpleStatusTextCellEditor,
+    statusTextCellEditor: StatusTextCellEditor,
+    dateCellEditor: DateCellEditor,
+    durationCellEditor: DurationCellEditor,
+    customEnumCellEditor: CustomEnumCellEditor,
+    hexaValueCellEditor: HexaValueCellEditor,
+    hexaOctetStringCellEditor: HexaOctetStringCellEditor,
+    simpleHeader: SimpleHeader,
+    loadingOverlay: LoadingOverlay,
+    noRecordsOverlay: NoRecordsOverlay
+};
+const DataGridModule = _defineModule({
+    version: "32.2.0",
+    moduleName: `dataGridModule`,
+    beans: [RangeSelector, BeanAccessor],
+    dependantModules: [],
+});
+ModuleRegistry.__register(DataGridModule, false, undefined);
+CellCtrl.prototype.onPopupEditorClosed = function () {
+    if (!this.isEditing()) {
+        return;
+    }
+    this.stopEditingAndFocus(true);
+};
+function getRowId(item) {
+    return item.data.id + "";
+}
+const rowStyleRuleCompiledExpressions = {};
+export const EXPORT_SEPARATOR = "\n";
+var NavigationEventEnum;
+(function (NavigationEventEnum) {
+    NavigationEventEnum[NavigationEventEnum["KEYBOARD"] = 0] = "KEYBOARD";
+    NavigationEventEnum[NavigationEventEnum["MOUSE"] = 1] = "MOUSE";
+})(NavigationEventEnum || (NavigationEventEnum = {}));
+class DataGrid extends React.Component {
+    constructor(props) {
+        super(props);
+        this.lastPaginationEvent = null;
+        this.wrappingDiv = null;
+        this.state = {
+            pageIndex: 0,
+            pageSize: null,
+            recordsCount: undefined,
+            columnModel: [],
+            sortModel: [],
+            tableConfigVisible: !!this.props.tableConfigVisible,
+            columnsConfigVisible: !!this.props.columnsConfigVisible,
+            fontSize: GRID_DEFAULT_FONT_SIZE,
+            rowHeight: calculateRowHeight(GRID_DEFAULT_FONT_SIZE, GRID_DEFAULT_ROW_HEIGHT_DELTA),
+            viewport: [0, 0],
+            contextMenuVisible: false,
+            firstLoadDone: false,
+            loading: false,
+            columnTransferHeight: 500,
+            pageOrientation: "PORTRAIT",
+            exporting: false
+        };
+        this.indexToJump = null;
+        this.columnToJump = null;
+        this.onGridReady = this.onGridReady.bind(this);
+        this.onPaginationChanged = this.onPaginationChanged.bind(this);
+        this.onViewportChanged = this.onViewportChanged.bind(this);
+        this.onCellContextMenu = this.onCellContextMenu.bind(this);
+        this.onCellFocused = this.onCellFocused.bind(this);
+        this.onCellMouseDown = this.onCellMouseDown.bind(this);
+        this.setFocusedCellDebounced = debounce(this.setFocusedCellDebounced.bind(this), 200);
+        this.noRecordsOverlayRenderer = this.noRecordsOverlayRenderer.bind(this);
+        this.loadingOverlayRenderer = this.loadingOverlayRenderer.bind(this);
+        this.changePagination = this.changePagination.bind(this);
+        this.onColumnsChanged = this.onColumnsChanged.bind(this);
+        this.onFilterModified = this.onFilterModified.bind(this);
+        this.onFilterChanged = this.onFilterChanged.bind(this);
+        this.onFilterConfirmed = this.onFilterConfirmed.bind(this);
+        this.onSortChanged = this.onSortChanged.bind(this);
+        this.showTableConfiguration = this.showTableConfiguration.bind(this);
+        this.showColumnsConfig = this.showColumnsConfig.bind(this);
+        this.navigateToNextCell = this.navigateToNextCell.bind(this);
+        this.suppressKeyboardEvent = this.suppressKeyboardEvent.bind(this);
+        this.onRowDataUpdated = this.onRowDataUpdated.bind(this);
+        this._getRowStyle = this._getRowStyle.bind(this);
+        this._getRowHeight = this._getRowHeight.bind(this);
+        this._getCellStyle = this._getCellStyle.bind(this);
+        this.textCustomComparator = this.textCustomComparator.bind(this);
+        this.onPageOrientationChange = this.onPageOrientationChange.bind(this);
+        this.onExport = this.onExport.bind(this);
+        this.getExportContent = this.getExportContent.bind(this);
+        this.getDefaultColDefinition = memoizeOne(this.getDefaultColDefinition.bind(this));
+        this.getAdaptedColumnDefs = memoizeOne(this.getAdaptedColumnDefs.bind(this));
+        this.getCustomComponents = memoizeOne(this.getCustomComponents.bind(this));
+        this.table_context = {
+            loadingOverlayRenderer: this.loadingOverlayRenderer,
+            noRecordsOverlayRenderer: this.noRecordsOverlayRenderer,
+            onFilterConfirmed: this.onFilterConfirmed,
+            fontSize: this.state.fontSize,
+            lineHeight: getLineHeight(this.state.rowHeight)
+        };
+        this.wildcardQuickFilter = new WildcardQuickFilterEngine();
+        this.columnTypes = {
+            "localizedArrayColumn": {
+                cellRenderer: (params) => {
+                    const value = DataGrid.getCellValue(params);
+                    if (value !== undefined) {
+                        return value.map((s) => i18n(s)).join(",");
+                    }
+                    else {
+                        return "";
+                    }
+                },
+                filterParams: {
+                    textCustomComparator: this.textCustomComparator
+                },
+                filterValueGetter: function (params) {
+                    const value = DataGrid.getCellValue(params);
+                    if (value !== undefined) {
+                        return value.map((s) => i18n(s)).join(",");
+                    }
+                    return null;
+                },
+                getQuickFilterText: function (params) {
+                    const value = DataGrid.getCellValue(params);
+                    if (value !== undefined) {
+                        return value.map((s) => i18n(s)).join(",");
+                    }
+                    return "";
+                }
+            },
+            "numberColumn": {
+                cellRenderer: (params) => {
+                    var _a, _b;
+                    const value = DataGrid.getCellValue(params);
+                    if (value !== undefined && value !== null) {
+                        return LocaleHolder.formatNumber(value, (_b = (_a = params.colDef) === null || _a === void 0 ? void 0 : _a.cellRendererParams) === null || _b === void 0 ? void 0 : _b.fractionDigits);
+                    }
+                    else {
+                        return "";
+                    }
+                },
+                filterParams: {
+                    textCustomComparator: this.textCustomComparator
+                },
+                filterValueGetter: function (params) {
+                    var _a, _b;
+                    const value = DataGrid.getCellValue(params);
+                    if (value) {
+                        return LocaleHolder.formatNumber(value, (_b = (_a = params.colDef) === null || _a === void 0 ? void 0 : _a.cellRendererParams) === null || _b === void 0 ? void 0 : _b.fractionDigits);
+                    }
+                    else {
+                        return "";
+                    }
+                },
+                getQuickFilterText: function (params) {
+                    var _a, _b;
+                    const value = DataGrid.getCellValue(params);
+                    if (value !== undefined) {
+                        return LocaleHolder.formatNumber(value, (_b = (_a = params.colDef) === null || _a === void 0 ? void 0 : _a.cellRendererParams) === null || _b === void 0 ? void 0 : _b.fractionDigits);
+                    }
+                    else {
+                        return "";
+                    }
+                }
+            },
+            "dateColumn": {
+                cellRenderer: (params) => {
+                    const value = DataGrid.getCellValue(params);
+                    if (value !== undefined) {
+                        if (value === D2000UnixTimeNullValue) {
+                            return "---";
+                        }
+                        let tooltipValue;
+                        tooltipValue = unixTimeToMoment(value).format(LocaleHolder.getDateTimeFormat(true, true, true));
+                        return React.createElement("span", { title: tooltipValue }, unixTimeToMoment(value).format(LocaleHolder.getDateFormat(!this.props.hideYear)));
+                    }
+                    else {
+                        return "---";
+                    }
+                },
+                valueFormatter: (params) => {
+                    const value = DataGrid.getCellValue(params);
+                    if (value !== undefined) {
+                        return unixTimeToMoment(value).format(LocaleHolder.getDateFormat(!this.props.hideYear));
+                    }
+                    return "---";
+                },
+                filterParams: {
+                    textCustomComparator: this.textCustomComparator
+                },
+                filterValueGetter: (params) => {
+                    const value = DataGrid.getCellValue(params);
+                    if (value !== undefined) {
+                        return unixTimeToMoment(value).format(LocaleHolder.getDateFormat(!this.props.hideYear));
+                    }
+                    return null;
+                },
+                getQuickFilterText: (params) => {
+                    const value = DataGrid.getCellValue(params);
+                    if (value !== undefined) {
+                        return unixTimeToMoment(value).format(LocaleHolder.getDateFormat(!this.props.hideYear));
+                    }
+                    return "";
+                }
+            },
+            "dateTimeColumn": {
+                cellRenderer: (params) => {
+                    const value = DataGrid.getCellValue(params);
+                    if (value) {
+                        if (value === D2000UnixTimeNullValue) {
+                            return "Null Time";
+                        }
+                        let tooltipValue;
+                        tooltipValue = unixTimeToMoment(value).format(LocaleHolder.getDateTimeFormat(true, true, true));
+                        return React.createElement("span", { title: tooltipValue }, unixTimeToMoment(value).format(LocaleHolder.getDateTimeFormat(!this.props.hideYear, true, this.props.showMilliseconds)));
+                    }
+                    else {
+                        return "---";
+                    }
+                },
+                valueFormatter: (params) => {
+                    const value = DataGrid.getCellValue(params);
+                    if (value !== undefined) {
+                        return unixTimeToMoment(value).format(LocaleHolder.getDateTimeFormat(!this.props.hideYear, true, this.props.showMilliseconds));
+                    }
+                    return "---";
+                },
+                filterParams: {
+                    textCustomComparator: this.textCustomComparator
+                },
+                filterValueGetter: (params) => {
+                    const value = DataGrid.getCellValue(params);
+                    if (value !== undefined) {
+                        return unixTimeToMoment(value).format(LocaleHolder.getDateTimeFormat(!this.props.hideYear, true, this.props.showMilliseconds));
+                    }
+                    return null;
+                },
+                getQuickFilterText: (params) => {
+                    const value = DataGrid.getCellValue(params);
+                    if (value !== undefined) {
+                        return unixTimeToMoment(value).format(LocaleHolder.getDateTimeFormat(!this.props.hideYear, true, this.props.showMilliseconds));
+                    }
+                    return "";
+                }
+            },
+            "fromNowDateTimeColumn": {
+                cellRenderer: (params) => {
+                    const value = DataGrid.getCellValue(params);
+                    if (value !== undefined) {
+                        let tooltipValue;
+                        tooltipValue = unixTimeToMoment(value).format(LocaleHolder.getDateTimeFormat(true, true, true));
+                        return React.createElement("span", { title: tooltipValue }, unixTimeToMoment(value).fromNow());
+                    }
+                    else {
+                        return "---";
+                    }
+                },
+                valueFormatter: (params) => {
+                    const value = DataGrid.getCellValue(params);
+                    if (value !== undefined) {
+                        return unixTimeToMoment(value).format(LocaleHolder.getDateTimeFormat(!this.props.hideYear, true, this.props.showMilliseconds));
+                    }
+                    return "---";
+                },
+                filterParams: {
+                    textCustomComparator: this.textCustomComparator
+                },
+                filterValueGetter: (params) => {
+                    const value = DataGrid.getCellValue(params);
+                    if (value !== undefined) {
+                        return unixTimeToMoment(value).format(LocaleHolder.getDateTimeFormat(!this.props.hideYear, true, this.props.showMilliseconds));
+                    }
+                    return null;
+                },
+                getQuickFilterText: (params) => {
+                    const value = DataGrid.getCellValue(params);
+                    if (value !== undefined) {
+                        return unixTimeToMoment(value).format(LocaleHolder.getDateTimeFormat(!this.props.hideYear, true, this.props.showMilliseconds));
+                    }
+                    return "";
+                }
+            },
+            "escapedValueColumn": {
+                cellRenderer: (params) => {
+                    const value = DataGrid.getCellValue(params);
+                    if (value !== undefined) {
+                        return React.createElement("span", { style: { whiteSpace: "pre" }, title: escape(value) }, typeof value === "string" ? escape(value.replace(/[\r\n]+/g, ' ')) : value);
+                    }
+                    else {
+                        return "";
+                    }
+                },
+                valueFormatter: (params) => {
+                    const value = DataGrid.getCellValue(params);
+                    if (value !== undefined) {
+                        return typeof value === "string" ? value.replace(/[\r\n]+/g, ' ') : value;
+                    }
+                    else {
+                        return "";
+                    }
+                }
+            },
+            "textColumnFilter": {
+                filter: "agTextColumnFilter",
+                floatingFilter: true,
+                floatingFilterComponent: "textColumnFilter",
+                filterParams: {
+                    textCustomComparator: this.textCustomComparator
+                },
+                suppressFloatingFilterButton: true,
+            },
+            "textColumnServerFilter": {
+                filter: "agTextColumnFilter",
+                floatingFilter: true,
+                floatingFilterComponent: "textColumnFilter",
+                filterParams: {
+                    buttons: ['apply'],
+                    textCustomComparator: this.textCustomComparator
+                },
+                suppressFloatingFilterButton: true,
+            },
+            "customColumnServerFilter": {
+                filter: "agTextColumnFilter",
+                floatingFilter: true,
+                floatingFilterComponent: "customColumnFilter",
+                filterParams: {
+                    buttons: ['apply'],
+                    textCustomComparator: this.textCustomComparator
+                },
+                suppressFloatingFilterButton: true,
+            },
+            "alignRight": {}
+        };
+    }
+    static getCellValue(props) {
+        if (props) {
+            if (props.colDef.field && typeof props.getValue === "function") {
+                return props.getValue(props.colDef.field);
+            }
+            if (props.data && props.colDef && props.colDef.field) {
+                return at(props.data, props.colDef.field)[0];
+            }
+            if (props.value !== undefined) {
+                return props.value;
+            }
+        }
+        return undefined;
+    }
+    textCustomComparator(filter, value, filterText) {
+        const filterTextLowerCase = filterText.toLowerCase();
+        const valueLowerCase = value.toString().toLowerCase();
+        switch (filter) {
+            case 'contains':
+                if (filterTextLowerCase.indexOf("*") >= 0 || filterTextLowerCase.indexOf("?") >= 0) {
+                    const wildcardFilterRegExp = this.wildcardQuickFilter.getWildcardFilterRegExp(filterTextLowerCase);
+                    if (typeof wildcardFilterRegExp == "string") {
+                        return valueLowerCase.indexOf(filterTextLowerCase) >= 0;
+                    }
+                    else {
+                        return wildcardFilterRegExp.test(valueLowerCase);
+                    }
+                }
+                else {
+                    return valueLowerCase.indexOf(filterTextLowerCase) >= 0;
+                }
+            case 'notContains':
+                return valueLowerCase.indexOf(filterTextLowerCase) === -1;
+            case 'equals':
+                return valueLowerCase === filterTextLowerCase;
+            case 'notEqual':
+                return valueLowerCase != filterTextLowerCase;
+            case 'startsWith':
+                return valueLowerCase.indexOf(filterTextLowerCase) === 0;
+            case 'endsWith':
+                var index = valueLowerCase.lastIndexOf(filterTextLowerCase);
+                return index >= 0 && index === (valueLowerCase.length - filterTextLowerCase.length);
+            default:
+                console.warn('invalid filter type ' + filter);
+                return false;
+        }
+    }
+    componentDidUpdate(prevProps) {
+        if (!this.gridApi) {
+            return;
+        }
+        if (this.props.filter && prevProps.filter && this.props.filter.columnSearchVisible !== prevProps.filter.columnSearchVisible) {
+            setTimeout(() => {
+                if (this.gridApi) {
+                    this.gridApi.refreshHeader();
+                    if (this.props.filter && !this.props.filter.columnSearchVisible) {
+                        this.gridApi.setFilterModel(null);
+                        this.gridApi.onFilterChanged();
+                    }
+                }
+            }, 0);
+        }
+        if (this.props.rowData && this.props.rowData !== prevProps.rowData) {
+            if (this.props.filter && this.props.filter.getFilterModel) {
+                this.gridApi.setFilterModel(this.props.filter.getFilterModel());
+                this.gridApi.onFilterChanged();
+            }
+            this.setSortModel(this.state.sortModel);
+            this.gridApi.refreshClientSideRowModel("group");
+            this.gridApi.redrawRows();
+            const selectedObjectsVisibleInGrid = this.props.rowData.filter((object) => {
+                return this.props.selectedIds ? this.props.selectedIds.indexOf(object.id) >= 0 : false;
+            });
+            if (selectedObjectsVisibleInGrid.length > 0) {
+                selectedObjectsVisibleInGrid.forEach((object) => {
+                    const rowNode = this.gridApi ? this.gridApi.getRowNode(object.id + "") : null;
+                    if (rowNode && !rowNode.isSelected()) {
+                        rowNode.setSelected(true, true);
+                    }
+                });
+            }
+            else {
+                this.gridApi.deselectAll();
+            }
+        }
+        if (this.props.datasource && this.props.datasource !== prevProps.datasource) {
+            this.gridApi.updateGridOptions({ datasource: this.props.datasource });
+        }
+        this.updateRowHeight();
+    }
+    setColumnState(columnModel) {
+        var _a;
+        const columnStates = [];
+        if (columnModel) {
+            columnModel.forEach((item) => {
+                const columnState = Object.assign({}, item);
+                item.sortIndex = undefined;
+                item.sort = undefined;
+                columnStates.push(columnState);
+            });
+        }
+        (_a = this.gridApi) === null || _a === void 0 ? void 0 : _a.applyColumnState({ state: columnStates, defaultState: { sort: null }, applyOrder: true });
+    }
+    setSortModel(sortModel) {
+        var _a;
+        const columnState = [];
+        if (sortModel) {
+            sortModel.forEach((item, index) => {
+                columnState.push({
+                    colId: item.colId,
+                    sort: item.sort,
+                    sortIndex: index
+                });
+            });
+        }
+        (_a = this.gridApi) === null || _a === void 0 ? void 0 : _a.applyColumnState({ state: columnState, defaultState: { sort: null }, applyOrder: true });
+    }
+    getSortModel() {
+        var _a, _b;
+        const columnState = (_b = (_a = this.gridApi) === null || _a === void 0 ? void 0 : _a.getColumnState()) !== null && _b !== void 0 ? _b : [];
+        const filteredStates = columnState === null || columnState === void 0 ? void 0 : columnState.filter(item => item.sort != null);
+        const indexes = {};
+        filteredStates.forEach((state) => {
+            if (state.colId) {
+                indexes[state.colId] = state.sortIndex;
+            }
+        });
+        const res = filteredStates.map(s => {
+            return { colId: s.colId, sort: s.sort };
+        });
+        res.sort((a, b) => indexes[a.colId] - indexes[b.colId]);
+        return res;
+    }
+    updateRowHeight() {
+        let rowAndFontHeight = this.calculateRowAndFontHeight(this.props.rowStyleRules);
+        if (rowAndFontHeight.rowHeight !== this.state.rowHeight) {
+            this.changeRowHeight(rowAndFontHeight.fontSize, rowAndFontHeight.rowHeight);
+        }
+        if (rowAndFontHeight.fontSize !== this.state.fontSize) {
+            this.setState({ fontSize: rowAndFontHeight.fontSize });
+        }
+    }
+    calculateRowAndFontHeight(rowStyleRules) {
+        let rowHeightDelta = GRID_DEFAULT_ROW_HEIGHT_DELTA;
+        let fontSize = GRID_DEFAULT_FONT_SIZE;
+        let rowHeight = calculateRowHeight(fontSize, rowHeightDelta);
+        if (rowStyleRules) {
+            for (let i = 0; i < rowStyleRules.length; i++) {
+                if (rowStyleRules[i].key === "table-font-size") {
+                    const currentFontSize = rowStyleRules[i].style.fontSize;
+                    fontSize = getFontSize(currentFontSize);
+                    rowHeight = calculateRowHeight(currentFontSize, rowHeightDelta);
+                }
+                if (rowStyleRules[i].key === "table-line-indentation") {
+                    const currentRowHeightDelta = rowStyleRules[i].style.rowHeightDelta;
+                    rowHeightDelta = getRowHeightDelta(currentRowHeightDelta);
+                    rowHeight = calculateRowHeight(fontSize, currentRowHeightDelta);
+                }
+            }
+        }
+        return { rowHeight: rowHeight, fontSize: fontSize };
+    }
+    static getDerivedStateFromProps(props, state) {
+        const newState = {};
+        if (props.tableConfigVisible === true || props.tableConfigVisible === false) {
+            if (props.tableConfigVisible !== state.tableConfigVisible) {
+                newState.tableConfigVisible = props.tableConfigVisible;
+            }
+        }
+        return newState;
+    }
+    onGridReady(gridReadyEvent) {
+        const gridApi = gridReadyEvent.api;
+        if (!this.gridApi || this.gridApi !== gridApi) {
+            this.gridApi = gridApi;
+            if (this.props.onGridReady) {
+                this.props.onGridReady(gridReadyEvent);
+            }
+            this.setState({
+                sortModel: this.getSortModel(),
+                columnModel: this.gridApi.getColumnState(),
+            });
+            this.updateRowHeight();
+        }
+        setTimeout(() => {
+            if (!!this.lastPaginationEvent) {
+                this.onPaginationChanged(this.lastPaginationEvent);
+            }
+        });
+    }
+    onPaginationChanged(event) {
+        if (this.gridApi) {
+            const currentPage = this.gridApi.paginationGetCurrentPage();
+            const currentPageSize = this.gridApi.paginationGetPageSize();
+            let recordsCount = this.props.paging.pageSize >= 0 ? (this.gridApi.paginationIsLastPageFound() ? this.gridApi.paginationGetRowCount() : 0) : this.gridApi.getDisplayedRowCount();
+            if (this.state.pageSize !== currentPageSize) {
+                if (this.props.paging.onPaginationChanged) {
+                    this.props.paging.onPaginationChanged(currentPageSize, this.props.paging.pageSize);
+                }
+                if (!this.state.firstLoadDone) {
+                    this.loadData();
+                    this.setState({ firstLoadDone: true });
+                }
+            }
+            this.setState({ pageSize: currentPageSize, recordsCount: recordsCount, pageIndex: currentPage });
+            if (this.indexToJump !== null && this.columnToJump !== null) {
+                this.gridApi.setFocusedCell(this.indexToJump, this.columnToJump);
+                this.indexToJump = null;
+            }
+            this.lastPaginationEvent = null;
+        }
+        else {
+            this.lastPaginationEvent = event;
+        }
+        if (this.props.onPaginationChanged) {
+            this.props.onPaginationChanged(event);
+        }
+    }
+    onViewportChanged(event) {
+        const dataGridEvent = event;
+        const rowsScrollingDelta = this.state.viewport[1] ? event.lastRow + 1 - this.state.viewport[1] : event.lastRow + 1;
+        dataGridEvent.rowsScrollingDelta = rowsScrollingDelta;
+        this.setState({ viewport: [event.firstRow + 1, event.lastRow + 1] });
+        if (this.props.onViewportChanged) {
+            this.props.onViewportChanged(event);
+        }
+    }
+    changePagination(pageSize) {
+        var _a, _b, _c;
+        if (!this.gridApi) {
+            return;
+        }
+        const gridApiWithPrivateAccess = this.gridApi;
+        if (pageSize > 0) {
+            this.gridApi.updateGridOptions({
+                pagination: true,
+                paginationAutoPageSize: false,
+                paginationPageSize: pageSize
+            });
+            if (this.props.paging.onPaginationChanged) {
+                this.props.paging.onPaginationChanged(pageSize, pageSize);
+            }
+        }
+        else if (pageSize === 0) {
+            this.gridApi.updateGridOptions({ pagination: true, paginationAutoPageSize: true });
+            const rowHeight = (_c = (_b = (_a = gridApiWithPrivateAccess.beans.gos).getRowHeightAsNumber) === null || _b === void 0 ? void 0 : _b.call(_a)) !== null && _c !== void 0 ? _c : 1;
+            const bodyHeight = gridApiWithPrivateAccess.beans.ctrlsService.params.center.viewportSizeFeature.getBodyHeight();
+            let availablePageSize = 1000;
+            if (bodyHeight > 0) {
+                availablePageSize = Math.floor(bodyHeight / rowHeight);
+            }
+            if (this.props.paging.pageSize > availablePageSize) {
+                this.gridApi.updateGridOptions({ paginationPageSize: 1 });
+            }
+            else {
+                this.gridApi.updateGridOptions({ paginationPageSize: null });
+            }
+            if (this.props.paging && this.props.paging.onPaginationChanged) {
+                this.props.paging.onPaginationChanged(this.state.pageSize, 0);
+            }
+        }
+        else {
+            this.gridApi.updateGridOptions({ pagination: false, paginationAutoPageSize: false });
+            if (this.props.paging && this.props.paging.onPaginationChanged) {
+                this.props.paging.onPaginationChanged(this.state.pageSize, -1);
+            }
+        }
+    }
+    showMilliseconds(showMilis) {
+        var _a, _b;
+        (_b = (_a = this.props).onShowMilliseconds) === null || _b === void 0 ? void 0 : _b.call(_a, showMilis, () => {
+            if (!this.gridApi) {
+                return;
+            }
+            if (!this.props.rowModelType || this.props.rowModelType === "clientSide") {
+                this.gridApi.refreshClientSideRowModel("group");
+            }
+            this.gridApi.redrawRows();
+        });
+    }
+    showYear(showYear) {
+        var _a, _b;
+        (_b = (_a = this.props).onShowYear) === null || _b === void 0 ? void 0 : _b.call(_a, showYear, () => {
+            if (!this.gridApi) {
+                return;
+            }
+            if (!this.props.rowModelType || this.props.rowModelType === "clientSide") {
+                this.gridApi.refreshClientSideRowModel("group");
+            }
+            this.gridApi.redrawRows();
+        });
+    }
+    changeRowHeight(fontSize, rowHeight) {
+        this.setState({ rowHeight: rowHeight }, () => {
+            if (this.gridApi) {
+                if (this.props.headerHeight === undefined) {
+                    this.gridApi.updateGridOptions({ headerHeight: calculateRowHeight(fontSize, GRID_DEFAULT_ROW_HEIGHT_DELTA + 2) });
+                }
+                if (this.props.floatingFiltersHeight === undefined) {
+                    this.gridApi.updateGridOptions({ floatingFiltersHeight: calculateRowHeight(fontSize, GRID_DEFAULT_ROW_HEIGHT_DELTA + 2) });
+                }
+                this.gridApi.updateGridOptions({ rowHeight: rowHeight });
+                this.gridApi.resetRowHeights();
+                this.gridApi.refreshHeader();
+                this.gridApi.redrawRows();
+                if (this.props.rowModelType === "infinite" && this.props.datasource) {
+                    this.gridApi.getModel().rowHeight = rowHeight;
+                    this.gridApi.updateGridOptions({ datasource: this.props.datasource });
+                }
+            }
+            if (this.props.onRowHeightChanged) {
+                this.props.onRowHeightChanged(rowHeight);
+            }
+        });
+    }
+    onGoToPage(pageIndex) {
+        if (this.gridApi) {
+            this.gridApi.paginationGoToPage(pageIndex);
+        }
+    }
+    loadData(callback) {
+        if (!this.gridApi) {
+            return;
+        }
+        this.setState({ loading: true });
+        if (!this.props.loadingOverlayRenderer) {
+            this.gridApi.setGridOption("loading", true);
+        }
+        this.props.onLoadData((totalRecords) => {
+            if (!this.gridApi) {
+                return;
+            }
+            this.gridApi.setGridOption("loading", false);
+            this.gridApi.hideOverlay();
+            this.setState({ loading: false });
+            if (callback) {
+                callback();
+            }
+            if (totalRecords === 0) {
+                setTimeout(() => {
+                    var _a;
+                    if (!this.isActive()) {
+                        return;
+                    }
+                    (_a = this.gridApi) === null || _a === void 0 ? void 0 : _a.showNoRowsOverlay();
+                }, 400);
+            }
+            if (this.props.autofocus) {
+                this.focus();
+            }
+        });
+    }
+    focus() {
+        setTimeout(() => {
+            var _a, _b, _c, _d;
+            if (!this.isActive()) {
+                return;
+            }
+            const columnModel = (_a = this.gridApi) === null || _a === void 0 ? void 0 : _a.getColumnState();
+            let columnIdToFocus = ((_b = columnModel === null || columnModel === void 0 ? void 0 : columnModel[0]) === null || _b === void 0 ? void 0 : _b.colId) || "name";
+            const selectedNodes = (_c = this.gridApi) === null || _c === void 0 ? void 0 : _c.getSelectedNodes();
+            const selectedRowIndex = (selectedNodes && selectedNodes.length > 0 && selectedNodes[selectedNodes.length - 1].rowIndex) || 0;
+            (_d = this.gridApi) === null || _d === void 0 ? void 0 : _d.setFocusedCell(selectedRowIndex, columnIdToFocus);
+        }, 200);
+    }
+    isActive() {
+        return !!this.gridApi && !this.gridApi.isDestroyed();
+    }
+    onColumnsChanged(event) {
+        const columnModel = event.api.getColumnState();
+        if (this.props.onColumnsChanged) {
+            this.props.onColumnsChanged(columnModel, event);
+        }
+        this.setState({ columnModel: columnModel });
+    }
+    setColumnSearchVisible(visible) {
+        if (this.gridApi && this.props.filter && this.props.filter.getFilterModel) {
+            this.gridApi.setFilterModel(this.props.filter.getFilterModel());
+        }
+        if (this.props.filter && this.props.filter.onColumnSearchVisible) {
+            this.props.filter.onColumnSearchVisible(visible);
+        }
+    }
+    onFilterModified(event) {
+        if (this.props.filter && this.props.filter.onFilterModified) {
+            this.props.filter.onFilterModified(event);
+        }
+    }
+    onFilterChanged(event) {
+        if (this.props.filter && this.props.filter.onFilterChanged) {
+            this.props.filter.onFilterChanged(event);
+        }
+    }
+    onFilterConfirmed() {
+        if (this.props.filter && this.props.filter.onFilterConfirmed) {
+            this.props.filter.onFilterConfirmed();
+        }
+    }
+    onSortChanged(event) {
+        if (this.props.onSortChanged && this.gridApi) {
+            const currentSortModel = this.getSortModel();
+            if (!isEqual(this.state.sortModel, currentSortModel)) {
+                this.setState({ sortModel: currentSortModel }, () => {
+                    if (this.props.onSortChanged) {
+                        this.props.onSortChanged(event);
+                    }
+                });
+            }
+        }
+    }
+    showTableConfiguration(show) {
+        if (this.props.onTableConfigVisible) {
+            this.props.onTableConfigVisible(show);
+        }
+        this.setState({ tableConfigVisible: show }, () => {
+            if (this.gridApi && !this.state.tableConfigVisible) {
+                if (!this.props.rowModelType || this.props.rowModelType === "clientSide") {
+                    this.gridApi.refreshClientSideRowModel("group");
+                }
+                this.gridApi.redrawRows();
+            }
+        });
+    }
+    showColumnsConfig(show) {
+        if (this.props.onColumnsConfigVisible) {
+            this.props.onColumnsConfigVisible(show);
+        }
+        this.columnModelBeforeEdit = cloneDeep(this.state.columnModel);
+        this.setState({ columnsConfigVisible: show });
+    }
+    navigateToNextCell(params) {
+        var _a;
+        this.lastNavigationEvent = 0;
+        var suggestedNextCell = params.nextCellPosition;
+        if (!this.gridApi) {
+            return suggestedNextCell !== null && suggestedNextCell !== void 0 ? suggestedNextCell : params.previousCellPosition;
+        }
+        const pageIndex = this.gridApi.paginationGetCurrentPage();
+        const totalPages = this.gridApi.paginationGetTotalPages();
+        var previousCell = params.previousCellPosition;
+        switch ((_a = params.event) === null || _a === void 0 ? void 0 : _a.code) {
+            case Key.ArrowDown:
+                if ((previousCell.rowIndex + 1) >= this.gridApi.getModel().getRowCount()) {
+                    if (pageIndex < (totalPages - 1)) {
+                        this.onGoToPage(pageIndex + 1);
+                        return {
+                            rowIndex: 0,
+                            column: previousCell.column,
+                            rowPinned: previousCell.rowPinned
+                        };
+                    }
+                    else {
+                        return {
+                            rowIndex: previousCell.rowIndex,
+                            column: previousCell.column,
+                            rowPinned: previousCell.rowPinned
+                        };
+                    }
+                }
+                break;
+            case Key.ArrowUp:
+                if ((previousCell.rowIndex - 1) < 0) {
+                    if (pageIndex > 0) {
+                        this.onGoToPage(pageIndex - 1);
+                        return {
+                            rowIndex: this.gridApi.getModel().getRowCount() - 1,
+                            column: previousCell.column,
+                            rowPinned: previousCell.rowPinned
+                        };
+                    }
+                    else {
+                        return {
+                            rowIndex: previousCell.rowIndex,
+                            column: previousCell.column,
+                            rowPinned: previousCell.rowPinned
+                        };
+                    }
+                }
+                break;
+        }
+        return suggestedNextCell !== null && suggestedNextCell !== void 0 ? suggestedNextCell : params.previousCellPosition;
+    }
+    suppressKeyboardEvent(params) {
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
+        if (!this.gridApi || params.event.type === "keypress") {
+            return false;
+        }
+        const pageIndex = this.gridApi.paginationGetCurrentPage();
+        const totalPages = this.gridApi.paginationGetTotalPages();
+        switch (params.event.code) {
+            case Key.ArrowDown:
+            case Key.ArrowUp:
+            case Key.ArrowLeft:
+            case Key.ArrowRight:
+                if (params.editing && params.event.altKey) {
+                    const focusedCell = this.gridApi.getFocusedCell();
+                    if (focusedCell) {
+                        let indexToJump;
+                        let columnToJump;
+                        if (params.event.code === Key.ArrowDown) {
+                            indexToJump = focusedCell.rowIndex + 1;
+                            columnToJump = focusedCell.column;
+                            if (indexToJump >= this.gridApi.getModel().getRowCount()) {
+                                if (pageIndex < (totalPages - 1)) {
+                                    this.onGoToPage(pageIndex + 1);
+                                    indexToJump = 0;
+                                }
+                                else {
+                                    indexToJump = focusedCell.rowIndex;
+                                }
+                            }
+                            this.lastNavigationEvent = 0;
+                            this.indexToJump = indexToJump;
+                            this.columnToJump = columnToJump;
+                            setTimeout(() => {
+                                var _a;
+                                (_a = this.gridApi) === null || _a === void 0 ? void 0 : _a.startEditingCell({
+                                    rowIndex: indexToJump,
+                                    colKey: columnToJump,
+                                    key: Key.Enter
+                                });
+                            }, 0);
+                            return true;
+                        }
+                        else if (params.event.code === Key.ArrowUp) {
+                            indexToJump = focusedCell.rowIndex - 1;
+                            columnToJump = focusedCell.column;
+                            if (indexToJump < 0) {
+                                if (pageIndex > 0) {
+                                    this.onGoToPage(pageIndex - 1);
+                                    indexToJump = this.gridApi.getModel().getRowCount() - 1;
+                                }
+                                else {
+                                    indexToJump = focusedCell.rowIndex;
+                                }
+                            }
+                            this.lastNavigationEvent = 0;
+                            this.indexToJump = indexToJump;
+                            this.columnToJump = columnToJump;
+                            setTimeout(() => {
+                                var _a;
+                                (_a = this.gridApi) === null || _a === void 0 ? void 0 : _a.startEditingCell({
+                                    rowIndex: indexToJump,
+                                    colKey: columnToJump,
+                                    key: Key.Enter
+                                });
+                            }, 0);
+                            return true;
+                        }
+                        else if (params.event.code === Key.ArrowLeft) {
+                            this.gridApi.tabToPreviousCell();
+                            break;
+                        }
+                        else {
+                            this.gridApi.tabToNextCell();
+                            break;
+                        }
+                    }
+                }
+                break;
+            case Key.PageDown:
+                this.lastNavigationEvent = 0;
+                if (pageIndex < (totalPages - 1)) {
+                    this.gridApi.paginationGoToNextPage();
+                    const focusedCell = this.gridApi.getFocusedCell();
+                    if (focusedCell) {
+                        this.indexToJump = Math.min(focusedCell.rowIndex + this.gridApi.paginationGetPageSize(), this.gridApi.paginationGetRowCount());
+                        this.columnToJump = focusedCell.column;
+                        return true;
+                    }
+                }
+                break;
+            case Key.PageUp:
+                this.lastNavigationEvent = 0;
+                if (pageIndex > 0) {
+                    this.gridApi.paginationGoToPreviousPage();
+                    const focusedCell = this.gridApi.getFocusedCell();
+                    if (focusedCell) {
+                        this.indexToJump = Math.max(focusedCell.rowIndex - this.gridApi.paginationGetPageSize(), 0);
+                        this.columnToJump = focusedCell.column;
+                        return true;
+                    }
+                }
+                break;
+            case Key.End:
+                this.lastNavigationEvent = 0;
+                if (pageIndex < (totalPages - 1)) {
+                    this.gridApi.paginationGoToLastPage();
+                    const focusedCell = this.gridApi.getFocusedCell();
+                    if (focusedCell) {
+                        this.indexToJump = this.gridApi.paginationGetRowCount() - 1;
+                        this.columnToJump = focusedCell.column;
+                        return true;
+                    }
+                }
+                break;
+            case Key.Home:
+                this.lastNavigationEvent = 0;
+                if (pageIndex > 0) {
+                    this.gridApi.paginationGoToFirstPage();
+                    const focusedCell = this.gridApi.getFocusedCell();
+                    if (focusedCell) {
+                        this.indexToJump = 0;
+                        this.columnToJump = focusedCell.column;
+                        return true;
+                    }
+                }
+                break;
+            case "KeyA":
+                if (params.event.ctrlKey && !params.editing) {
+                    var firstRow = this.gridApi.getFirstDisplayedRowIndex();
+                    var lastRow = this.gridApi.getLastDisplayedRowIndex();
+                    this.gridApi.deselectAll();
+                    if (this.props.rowModelType === "infinite") {
+                        for (let i = firstRow; i <= lastRow; i++) {
+                            (_a = this.gridApi.getDisplayedRowAtIndex(i)) === null || _a === void 0 ? void 0 : _a.setSelected(true);
+                        }
+                    }
+                    else {
+                        this.gridApi.forEachNodeAfterFilter(function (node, index) {
+                            if (index >= firstRow && index <= lastRow) {
+                                node.setSelected(true);
+                            }
+                        });
+                    }
+                }
+                break;
+            case "KeyI":
+                if (params.event.ctrlKey) {
+                    const focusedCell = this.gridApi.getFocusedCell();
+                    const column = (_c = (_b = this.gridApi) === null || _b === void 0 ? void 0 : _b.getColumn("objectId")) !== null && _c !== void 0 ? _c : (_d = this.gridApi) === null || _d === void 0 ? void 0 : _d.getColumn("id");
+                    if (focusedCell && column) {
+                        const displayedRowAtIndex = this.gridApi.getDisplayedRowAtIndex(focusedCell.rowIndex);
+                        if (displayedRowAtIndex) {
+                            ClipboardUtils.copyToClipboard(this.getValue(column, displayedRowAtIndex));
+                        }
+                        this.gridApi.setFocusedCell(focusedCell.rowIndex, focusedCell.column.getId());
+                    }
+                }
+                break;
+            case "KeyB":
+                if (params.event.ctrlKey) {
+                    const focusedCell = this.gridApi.getFocusedCell();
+                    const column = (_f = (_e = this.gridApi) === null || _e === void 0 ? void 0 : _e.getColumn("objectName")) !== null && _f !== void 0 ? _f : (_g = this.gridApi) === null || _g === void 0 ? void 0 : _g.getColumn("name");
+                    if (focusedCell && column) {
+                        const displayedRowAtIndex1 = this.gridApi.getDisplayedRowAtIndex(focusedCell.rowIndex);
+                        if (displayedRowAtIndex1) {
+                            ClipboardUtils.copyToClipboard(this.getValue(column, displayedRowAtIndex1));
+                        }
+                        this.gridApi.setFocusedCell(focusedCell.rowIndex, focusedCell.column.getId());
+                    }
+                }
+                break;
+            case "KeyC":
+                if (params.event.ctrlKey && !params.editing) {
+                    const focusedCell = this.gridApi.getFocusedCell();
+                    if (focusedCell) {
+                        const displayedRowAtIndex2 = this.gridApi.getDisplayedRowAtIndex(focusedCell.rowIndex);
+                        if (displayedRowAtIndex2) {
+                            ClipboardUtils.copyToClipboard(this.getValue(focusedCell.column, displayedRowAtIndex2, true));
+                        }
+                        this.gridApi.setFocusedCell(focusedCell.rowIndex, focusedCell.column.getId());
+                    }
+                }
+                break;
+            case Key.Enter:
+                (_j = (_h = this.props).onEnter) === null || _j === void 0 ? void 0 : _j.call(_h);
+                break;
+        }
+        (_l = (_k = this.props).onKeyPressed) === null || _l === void 0 ? void 0 : _l.call(_k, params.event);
+        return false;
+    }
+    getValue(column, row, doNotReplaceNewline) {
+        var _a, _b;
+        let formattedValue = (_a = this.gridApi) === null || _a === void 0 ? void 0 : _a.getCellValue({ rowNode: row, colKey: column });
+        if (formattedValue && typeof formattedValue === "string" && formattedValue.indexOf(EXPORT_SEPARATOR) > 0 && !doNotReplaceNewline) {
+            formattedValue = formattedValue.replace(/[\n\r]+/, ' ');
+        }
+        const valueFormatter = column.getColDef().valueFormatter;
+        if (valueFormatter) {
+            const params = {
+                data: row.data,
+                node: row,
+                column: column,
+                colDef: column.getColDef(),
+                api: this.gridApi,
+                context: (_b = this.gridApi) === null || _b === void 0 ? void 0 : _b.getGridOption('context'),
+                value: formattedValue
+            };
+            if (typeof valueFormatter === 'function') {
+                formattedValue = valueFormatter === null || valueFormatter === void 0 ? void 0 : valueFormatter(params);
+            }
+            else if (typeof valueFormatter === 'string') {
+                formattedValue = at(row.data, valueFormatter)[0];
+            }
+        }
+        return formattedValue;
+    }
+    async getExportContent(progressPopup, props) {
+        if (!this.gridApi) {
+            return [];
+        }
+        const model = this.gridApi.getModel();
+        const tableContent = [];
+        const columns = this.gridApi.getAllDisplayedColumns().map((column) => {
+            const columnTypes = column.getColDef().type;
+            return {
+                column: column,
+                displayName: column.getColDef().headerName,
+                isDateField: columnTypes && columnTypes.indexOf("dateColumn") >= 0,
+                isDateTimeField: columnTypes && columnTypes.indexOf("dateTimeColumn") >= 0
+            };
+        });
+        if (columns.length === 0) {
+            return tableContent;
+        }
+        tableContent.push(columns.map((column) => { var _a; return (_a = column.displayName) !== null && _a !== void 0 ? _a : ""; }));
+        let rowCount;
+        let tableNodes = [];
+        if (model.getType() === "clientSide") {
+            if (props.onlySelectedNodes) {
+                rowCount = 0;
+                this.gridApi.forEachNodeAfterFilterAndSort((node) => {
+                    if (node.isSelected()) {
+                        tableNodes.push(node);
+                        rowCount++;
+                    }
+                });
+            }
+            else {
+                rowCount = model.getRowCount();
+                this.gridApi.forEachNodeAfterFilterAndSort((node) => {
+                    tableNodes.push(node);
+                });
+            }
+        }
+        else {
+            if (props.onlySelectedNodes) {
+                const selectedNodes = this.gridApi.getSelectedNodes();
+                rowCount = selectedNodes.length;
+                selectedNodes.forEach((node) => {
+                    tableNodes.push(node);
+                });
+                tableNodes.sort((a, b) => { var _a, _b; return ((_a = a.rowIndex) !== null && _a !== void 0 ? _a : 0) > ((_b = b.rowIndex) !== null && _b !== void 0 ? _b : 0) ? 1 : (a.rowIndex === b.rowIndex) ? 0 : -1; });
+            }
+            else {
+                const virtualRowCount = model.getRowCount();
+                rowCount = virtualRowCount ? virtualRowCount : 0;
+            }
+        }
+        progressPopup === null || progressPopup === void 0 ? void 0 : progressPopup.setRecordCount(rowCount);
+        let percentStep = Math.floor(rowCount / 100);
+        if (percentStep < 100) {
+            percentStep = 100;
+        }
+        if (model.getType() === "clientSide" || props.onlySelectedNodes) {
+            for (let index = 0; index < tableNodes.length; index++) {
+                const record = [];
+                columns.forEach((column) => {
+                    let value = this.getValue(column.column, tableNodes[index]);
+                    record.push(value);
+                });
+                tableContent.push(record);
+                if (index % percentStep === 0) {
+                    progressPopup === null || progressPopup === void 0 ? void 0 : progressPopup.update(Math.floor(index / rowCount * 100) - 1);
+                    await TimeUtils.sleep(100);
+                }
+            }
+        }
+        else {
+            for (let index = 0; index < rowCount; index++) {
+                let row = undefined;
+                let record = [];
+                do {
+                    record = [];
+                    do {
+                        row = model.getRow(index);
+                        if (!row || !row.data) {
+                            await TimeUtils.sleep(100);
+                        }
+                    } while (!row || !row.data);
+                    columns.forEach((column) => {
+                        record.push(this.getValue(column.column, row));
+                    });
+                    if (record.filter((cell) => !!cell).length === 0) {
+                        await TimeUtils.sleep(100);
+                    }
+                } while (record.filter((cell) => !!cell).length === 0);
+                tableContent.push(record);
+                if (index % percentStep === 0) {
+                    progressPopup === null || progressPopup === void 0 ? void 0 : progressPopup.update(Math.floor(index / rowCount * 100) - 1);
+                    await TimeUtils.sleep(100);
+                }
+            }
+        }
+        progressPopup === null || progressPopup === void 0 ? void 0 : progressPopup.update(99);
+        await TimeUtils.sleep(300);
+        return tableContent;
+    }
+    onCellFocused(event) {
+        var _a, _b, _c, _d, _e;
+        const row = event.rowIndex !== null ? (_a = this.gridApi) === null || _a === void 0 ? void 0 : _a.getDisplayedRowAtIndex(event.rowIndex) : undefined;
+        if (row) {
+            if (this.lastNavigationEvent === 0 && KeyboardUtils.isKeyPressed(Key.Shift) && this.lastCellFocus && this.lastCellFocus.rowIndex !== event.rowIndex) {
+                if (!row.isSelected()) {
+                    row.setSelected(true, false);
+                }
+                else if (((_b = this.lastCellFocus) === null || _b === void 0 ? void 0 : _b.rowIndex) !== null) {
+                    const lastFocusedRow = (_c = this.gridApi) === null || _c === void 0 ? void 0 : _c.getDisplayedRowAtIndex(this.lastCellFocus.rowIndex);
+                    if (lastFocusedRow === null || lastFocusedRow === void 0 ? void 0 : lastFocusedRow.isSelected()) {
+                        lastFocusedRow.setSelected(false, false);
+                    }
+                }
+            }
+            else if (!row.isSelected() && !KeyboardUtils.isKeyPressed(Key.Control) && !KeyboardUtils.isKeyPressed(Key.Shift)) {
+                row.setSelected(true, true);
+            }
+        }
+        (_e = (_d = this.props).onCellFocused) === null || _e === void 0 ? void 0 : _e.call(_d, event);
+        this.lastCellFocus = event;
+    }
+    onCellMouseDown(e) {
+        var _a, _b;
+        this.lastNavigationEvent = 1;
+        if (e.rowIndex !== null) {
+            this.setFocusedCellDebounced(e.rowIndex, e.column, e.rowPinned !== null ? e.rowPinned : undefined);
+        }
+        (_b = (_a = this.props).onCellMouseDown) === null || _b === void 0 ? void 0 : _b.call(_a, e);
+    }
+    setFocusedCellDebounced(rowIndex, column, rowPinned) {
+        var _a;
+        (_a = this.gridApi) === null || _a === void 0 ? void 0 : _a.setFocusedCell(rowIndex, column, rowPinned);
+    }
+    onCellContextMenu(event) {
+        this.setState({ contextMenuVisible: !!event });
+        if (event.node) {
+            if (!event.node.isSelected()) {
+                event.node.setSelected(true, true);
+            }
+        }
+    }
+    loadingOverlayRenderer() {
+        if (this.props.loadingOverlayRenderer) {
+            const loadingOverlay = this.props.loadingOverlayRenderer();
+            if (loadingOverlay) {
+                return loadingOverlay;
+            }
+        }
+        return React.createElement("div", null,
+            React.createElement(LoadingOutlined, { style: { fontSize: 40, color: "#1890ff" } }));
+    }
+    noRecordsOverlayRenderer() {
+        if (this.props.noRecordsOverlayRenderer) {
+            const noRecordsOverlay = this.props.noRecordsOverlayRenderer();
+            if (noRecordsOverlay) {
+                return noRecordsOverlay;
+            }
+        }
+        return (React.createElement(Empty, { description: i18n("No records found."), imageStyle: { height: "8vh" } },
+            React.createElement(Button, { type: "primary", onClick: () => {
+                    if (this.props.search && this.props.search.onSearch) {
+                        this.props.search.onSearch();
+                    }
+                } },
+                React.createElement(SearchOutlined, null),
+                " ",
+                i18n("Search"))));
+    }
+    setRowData(dataArray) {
+        var _a;
+        (_a = this.gridApi) === null || _a === void 0 ? void 0 : _a.updateGridOptions({ rowData: dataArray });
+    }
+    onRowDataUpdated(event) {
+        if (!this.gridApi) {
+            return;
+        }
+        const currentPage = this.gridApi.paginationGetCurrentPage();
+        const recordsCount = this.props.paging.pageSize >= 0 ? (this.gridApi.paginationIsLastPageFound() ? this.gridApi.paginationGetRowCount() : 0) : this.gridApi.getDisplayedRowCount();
+        this.setState({ recordsCount: recordsCount, pageIndex: currentPage });
+        if (this.props.onRowDataUpdated) {
+            this.props.onRowDataUpdated(event);
+        }
+    }
+    _getRowStyle(params) {
+        const rowStyleRules = this.props.rowStyleRules;
+        if (rowStyleRules) {
+            const style = {};
+            rowStyleRules.forEach((rowStyleRule) => {
+                if (rowStyleRule.expression) {
+                    if (!rowStyleRuleCompiledExpressions[rowStyleRule.expression]) {
+                        rowStyleRuleCompiledExpressions[rowStyleRule.expression] = compileExpression(rowStyleRule.expression);
+                    }
+                    if (rowStyleRuleCompiledExpressions[rowStyleRule.expression](params.node.data)) {
+                        Object.assign(style, rowStyleRule.style);
+                    }
+                }
+                else {
+                    Object.assign(style, rowStyleRule.style);
+                }
+            });
+            if (!style.color) {
+                style.color = null;
+            }
+            else if (typeof style.color === "object") {
+                style.color = `rgba(${style.color.r},${style.color.g},${style.color.b},${style.color.a})`;
+            }
+            if (!style.backgroundColor) {
+                style.backgroundColor = "inherit";
+            }
+            else if (typeof style.backgroundColor === "object") {
+                style.backgroundColor = `rgba(${style.backgroundColor.r},${style.backgroundColor.g},${style.backgroundColor.b},${style.backgroundColor.a})`;
+            }
+            if (!style.fontWeight) {
+                style.fontWeight = "inherit";
+            }
+            const fontSize = style.fontSize;
+            if (style.fontSize) {
+                style.fontSize = style.fontSize + "px";
+            }
+            else {
+                style.fontSize = "inherit";
+            }
+            if (style.rowHeightDelta) {
+                const lineHeight = calculateLineHeight(fontSize, style.rowHeightDelta);
+                if (style.rowHeightDelta) {
+                    delete style.rowHeightDelta;
+                }
+                style.lineHeight = lineHeight + "px";
+            }
+            else {
+                const lineHeight = calculateLineHeight(fontSize, GRID_DEFAULT_ROW_HEIGHT_DELTA);
+                style.lineHeight = lineHeight + "px";
+            }
+            if (this.props.getRowStyle) {
+                const rowStyle = this.props.getRowStyle(params);
+                if (rowStyle) {
+                    return Object.assign(style, rowStyle);
+                }
+            }
+            return style;
+        }
+        return DataGrid.EMPTY_STYLE;
+    }
+    _getRowHeight() {
+        return this.state.rowHeight;
+    }
+    _getCellStyle(params) {
+        var _a;
+        const fontSize = this.state.fontSize;
+        const cellStyles = { "fontSize": fontSize + "px" };
+        if (params.colDef.type && params.colDef.type.indexOf("alignRight") >= 0) {
+            cellStyles["textAlign"] = "right";
+        }
+        if ((_a = params.colDef.cellRendererParams) === null || _a === void 0 ? void 0 : _a.originalCellStyle) {
+            const originalCellStylesOrHandler = params.colDef.cellRendererParams.originalCellStyle;
+            if (typeof originalCellStylesOrHandler === "object") {
+                Object.assign(cellStyles, originalCellStylesOrHandler);
+            }
+            else if (typeof originalCellStylesOrHandler === "function") {
+                const originalCellStyles = originalCellStylesOrHandler(params);
+                if (originalCellStyles) {
+                    Object.assign(cellStyles, originalCellStyles);
+                }
+            }
+        }
+        return cellStyles;
+    }
+    getDefaultColDefinition(colDef) {
+        if (colDef) {
+            return Object.assign(Object.assign({}, colDef), { suppressKeyboardEvent: this.suppressKeyboardEvent });
+        }
+        else {
+            return { suppressKeyboardEvent: this.suppressKeyboardEvent };
+        }
+    }
+    getCustomComponents(components) {
+        let customComponents = gridFrameworkComponents;
+        if (components) {
+            customComponents = Object.assign(gridFrameworkComponents, components);
+        }
+        return customComponents;
+    }
+    onPageOrientationChange(pageOrientation) {
+        this.setState({ pageOrientation: pageOrientation });
+    }
+    onExport(start) {
+        this.setState({ exporting: start });
+    }
+    renderNavigationPanel() {
+        var _a, _b;
+        return (React.createElement(React.Fragment, null,
+            this.props.toolbar && this.props.toolbar.renderToolbar ? this.props.toolbar.renderToolbar(this.renderToolBarWithSearch()) : this.renderToolBarWithSearch(),
+            this.props.paging.pageSize >= 0 &&
+                React.createElement(DataGridPagination, { disabled: this.state.loading, current: this.state.pageIndex ? this.state.pageIndex + 1 : 1, pageSize: this.state.pageSize ? this.state.pageSize : 20, total: (_a = this.state.recordsCount) !== null && _a !== void 0 ? _a : 1, onGoToPage: page => {
+                        this.onGoToPage(page - 1);
+                    } }),
+            this.props.paging.pageSize < 0 && this.state.recordsCount && !((_b = this.props.toolbar) === null || _b === void 0 ? void 0 : _b.hideRecordCount) ?
+                React.createElement("span", { style: {
+                        flex: "0 1 auto",
+                        textAlign: "right",
+                        whiteSpace: "nowrap",
+                        margin: "0 12px",
+                        lineHeight: "32px",
+                    } }, `${this.state.viewport[0]}-${this.state.viewport[1]} ${i18n('of')} ${this.state.recordsCount}`)
+                : undefined));
+    }
+    renderToolBarWithSearch() {
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
+        return (React.createElement(Space.Compact, { key: "filter-panel", className: "datagrid-autocomplete-input-group", style: { whiteSpace: "nowrap", flexGrow: 1, display: "flex" } }, (_a = this.props.toolbar) === null || _a === void 0 ? void 0 :
+            _a.toolbarButtons,
+            React.createElement(Dropdown, { trigger: ["click"], menu: getContextMenu({
+                    showMilliseconds: !!this.props.showMilliseconds,
+                    showYear: !this.props.hideYear,
+                    renderer: (_b = this.props.exportMenu) === null || _b === void 0 ? void 0 : _b.renderer,
+                    onClick: (_c = this.props.exportMenu) === null || _c === void 0 ? void 0 : _c.onClick,
+                    getExportContent: this.getExportContent,
+                    pageOrientation: this.state.pageOrientation,
+                    exporting: this.state.exporting,
+                    onPageOrientationChange: this.onPageOrientationChange,
+                    onExport: this.onExport
+                }), disabled: this.state.loading },
+                React.createElement(Button, { title: i18n("Export") },
+                    React.createElement(DownloadOutlined, null))),
+            React.createElement(Dropdown, { trigger: ["click"], menu: this.getSettingsMenu() },
+                React.createElement(Button, { title: i18n("Extended table features"), disabled: this.state.loading },
+                    React.createElement(TableOutlined, null))),
+            !((_d = this.props.search) === null || _d === void 0 ? void 0 : _d.hidden) && !((_e = this.props.search) === null || _e === void 0 ? void 0 : _e.searchRenderer) && React.createElement(AutoCompleteInput, { style: { minWidth: 100, flexGrow: 1 }, placeholder: this.props.search ? this.props.search.placeholder : undefined, stringFormatter: this.props.search ? this.props.search.stringFormatter : undefined, value: this.props.search ? this.props.search.searchString : undefined, inputReadonly: this.props.search ? this.props.search.inputReadonly : undefined, options: this.props.search ? this.props.search.searchHistory : undefined, onChange: this.props.search ? this.props.search.onChange : undefined, onSearch: this.props.search ? this.props.search.onSearch : undefined, disabled: this.state.loading || (this.props.filter && this.props.filter.columnSearchVisible) }), (_g = (_f = this.props.search) === null || _f === void 0 ? void 0 : _f.searchRenderer) === null || _g === void 0 ? void 0 :
+            _g.call(_f),
+            React.createElement(Button, { title: ((_h = this.props.search) === null || _h === void 0 ? void 0 : _h.hidden) ? i18n("Refresh") : i18n("Search"), className: "search-btn " + (this.props.search && this.props.search.searchButtonClassName ? this.props.search.searchButtonClassName : ""), disabled: (_j = this.props.search) === null || _j === void 0 ? void 0 : _j.searchButtonDisabled, type: "primary", onClick: () => {
+                    if (this.props.search && this.props.search.onSearch) {
+                        this.props.search.onSearch();
+                    }
+                } }, this.state.loading ? React.createElement(LoadingOutlined, null) : (((_k = this.props.search) === null || _k === void 0 ? void 0 : _k.hidden) ? React.createElement(ReloadOutlined, null) :
+                React.createElement(SearchOutlined, null)))));
+    }
+    getSettingsMenu() {
+        var _a;
+        let menuItems = [
+            {
+                key: "columnFilter",
+                icon: React.createElement(FileSearchOutlined, null),
+                className: this.props.filter && this.props.filter.columnSearchVisible ? "ant-dropdown-menu-item-selected" : "",
+                title: i18n("Turn on/off column filter"),
+                label: i18n("Column Filter"),
+            },
+            {
+                key: "autosizeAllColumns",
+                icon: React.createElement(ColumnWidthOutlined, null),
+                label: i18n("Autosize All Columns"),
+            },
+            {
+                key: "columnsConfig",
+                icon: React.createElement(ControlOutlined, null),
+                label: i18n("Columns Configuration"),
+            },
+            {
+                key: "columnsAndAdvancedConfigDivider",
+                type: "divider"
+            },
+            {
+                key: "advancedConfig",
+                icon: React.createElement(SettingOutlined, null),
+                label: i18n("Advanced Settings"),
+            }
+        ];
+        if ((_a = this.props.settingsMenu) === null || _a === void 0 ? void 0 : _a.renderer) {
+            menuItems = this.props.settingsMenu.renderer(menuItems);
+        }
+        return {
+            items: menuItems,
+            onClick: (menuInfo) => {
+                var _a, _b;
+                switch (menuInfo.key) {
+                    case "columnFilter":
+                        const visible = !(this.props.filter && this.props.filter.columnSearchVisible);
+                        this.setColumnSearchVisible(visible);
+                        break;
+                    case "autosizeAllColumns":
+                        (_a = this.gridApi) === null || _a === void 0 ? void 0 : _a.autoSizeAllColumns();
+                        break;
+                    case "columnsConfig":
+                        this.showColumnsConfig(true);
+                        break;
+                    case "advancedConfig":
+                        this.showTableConfiguration(true);
+                        break;
+                    default:
+                        if ((_b = this.props.settingsMenu) === null || _b === void 0 ? void 0 : _b.onClick) {
+                            this.props.settingsMenu.onClick(menuInfo.key + "");
+                        }
+                }
+            }
+        };
+    }
+    getAdaptedColumnDefs(columnDefs, floatingFilterEnabled, disableColumnDefsPreprocessing) {
+        if (columnDefs.length === 0) {
+            return undefined;
+        }
+        if (disableColumnDefsPreprocessing) {
+            return columnDefs;
+        }
+        const adaptedColumnDefs = columnDefs ? columnDefs.map((columnDef) => {
+            var _a, _b;
+            const _c = columnDef, { group, floatingFilter, hide, cellEditorPopup, editable } = _c, rest = __rest(_c, ["group", "floatingFilter", "hide", "cellEditorPopup", "editable"]);
+            let floatingFilterEnabledForColumn = !!floatingFilter;
+            if (typeof columnDef.type === "string") {
+                if (!!((_a = this.columnTypes[columnDef.type]) === null || _a === void 0 ? void 0 : _a.floatingFilter)) {
+                    floatingFilterEnabledForColumn = true;
+                }
+            }
+            else {
+                (_b = columnDef.type) === null || _b === void 0 ? void 0 : _b.forEach((type) => {
+                    var _a;
+                    if (!!((_a = this.columnTypes[type]) === null || _a === void 0 ? void 0 : _a.floatingFilter)) {
+                        floatingFilterEnabledForColumn = true;
+                    }
+                });
+            }
+            return Object.assign(Object.assign({}, rest), { floatingFilter: floatingFilterEnabledForColumn && floatingFilterEnabled, resizable: true, headerComponent: "simpleHeader", headerComponentParams: {
+                    onColumnsConfigVisible: this.showColumnsConfig
+                }, hide: hide === undefined ? rest.initialHide : hide, cellStyle: this._getCellStyle, cellRendererParams: columnDef.cellStyle ? Object.assign(columnDef.cellRendererParams !== undefined ? columnDef.cellRendererParams : {}, { originalCellStyle: columnDef.cellStyle }) : columnDef.cellRendererParams, editable: editable, cellEditorPopup: !editable ? undefined : cellEditorPopup !== false });
+        }) : undefined;
+        if (adaptedColumnDefs) {
+            setTimeout(() => {
+                var _a, _b;
+                (_b = (_a = this.props).onColumnDefsAdapted) === null || _b === void 0 ? void 0 : _b.call(_a, adaptedColumnDefs);
+            }, 0);
+        }
+        return adaptedColumnDefs;
+    }
+    render() {
+        var _a, _b, _c, _d, _e, _f;
+        const _g = this.props, { onGridReady, columnDefs, disableColumnDefsPreprocessing, onColumnsChanged, paging, onPaginationChanged, onViewportChanged, selectedIds, search, toolbar, filter, onFilterChanged, onFilterModified, onCellFocused, onSortChanged, components, tableConfigVisible, onTableConfigVisible, noRecordsOverlayRenderer, loadingOverlayRenderer, onRowDataUpdated, rowStyleRules, onChangeRowStyleRules, defaultShowMilliseconds, onShowMilliseconds, defaultHideYear, onShowYear, suppressLoadingOverlay, defaultColDef, headerHeight, rowData, rowDataManualMode, gridRef, quickFilterParser, quickFilterMatcher } = _g, passedProperties = __rest(_g, ["onGridReady", "columnDefs", "disableColumnDefsPreprocessing", "onColumnsChanged", "paging", "onPaginationChanged", "onViewportChanged", "selectedIds", "search", "toolbar", "filter", "onFilterChanged", "onFilterModified", "onCellFocused", "onSortChanged", "components", "tableConfigVisible", "onTableConfigVisible", "noRecordsOverlayRenderer", "loadingOverlayRenderer", "onRowDataUpdated", "rowStyleRules", "onChangeRowStyleRules", "defaultShowMilliseconds", "onShowMilliseconds", "defaultHideYear", "onShowYear", "suppressLoadingOverlay", "defaultColDef", "headerHeight", "rowData", "rowDataManualMode", "gridRef", "quickFilterParser", "quickFilterMatcher"]);
+        let key;
+        let paginationPageSize = undefined;
+        if (paging.pageSize > 0) {
+            paginationPageSize = paging.pageSize;
+            passedProperties.pagination = true;
+            key = "paginated-table";
+        }
+        else if (paging.pageSize === 0) {
+            passedProperties.paginationAutoPageSize = true;
+            passedProperties.pagination = true;
+            key = "paginated-table";
+        }
+        else {
+            passedProperties.pagination = false;
+            key = "non-paginated-table";
+        }
+        const floatingFilterEnabled = !!filter && !!filter.columnSearchVisible;
+        const adaptedColumnDefs = this.getAdaptedColumnDefs(columnDefs, floatingFilterEnabled, !!disableColumnDefsPreprocessing);
+        const customComponents = this.getCustomComponents(components);
+        const debugMode = process.env.NODE_ENV === 'development';
+        const panelStyle = {
+            display: "flex",
+            flexFlow: "column",
+            height: "100%",
+            width: "100%",
+            paddingBottom: 8,
+        };
+        if (this.props.panelStyle) {
+            Object.assign(panelStyle, this.props.panelStyle);
+        }
+        const tablePanelStyle = { flex: "1 1 auto", marginTop: 16, overflow: "auto" };
+        if (this.props.tablePanelStyle) {
+            Object.assign(tablePanelStyle, this.props.tablePanelStyle);
+        }
+        const headerFilterRowHeight = calculateRowHeight(this.state.fontSize, GRID_DEFAULT_ROW_HEIGHT_DELTA + 2);
+        return (React.createElement(React.Fragment, null,
+            React.createElement(Card, { size: "small", bordered: false, style: { height: "100%" }, styles: { body: panelStyle } },
+                React.createElement("div", { style: { display: "flex" } }, this.renderNavigationPanel()),
+                React.createElement("div", { style: tablePanelStyle },
+                    React.createElement(Dropdown, { trigger: ["contextMenu"], getPopupContainer: () => {
+                            var _a, _b;
+                            const parentNode = ((_b = (_a = ReactDOM.findDOMNode(this)) === null || _a === void 0 ? void 0 : _a.parentNode) !== null && _b !== void 0 ? _b : document.body);
+                            return parentNode;
+                        }, menu: getContextMenu({
+                            onlySelectedNodes: true,
+                            showMilliseconds: !!this.props.showMilliseconds,
+                            showYear: !this.props.hideYear,
+                            renderer: (_a = this.props.contextMenu) === null || _a === void 0 ? void 0 : _a.renderer,
+                            onClick: (_b = this.props.contextMenu) === null || _b === void 0 ? void 0 : _b.onClick,
+                            getExportContent: this.getExportContent,
+                            hideNotificationOnClipboardCopy: true,
+                            pageOrientation: this.state.pageOrientation,
+                            exporting: this.state.exporting,
+                            onPageOrientationChange: this.onPageOrientationChange,
+                            onExport: this.onExport
+                        }), open: this.state.contextMenuVisible, onOpenChange: (visible) => {
+                            if (!visible) {
+                                this.setState({ contextMenuVisible: false });
+                            }
+                        } },
+                        React.createElement("div", { className: "ag-theme-balham", style: { width: "100%", height: "100%" }, ref: (wrapingDiv) => {
+                                this.wrappingDiv = wrapingDiv;
+                            } },
+                            React.createElement(AgGridReact, Object.assign({ key: key, debug: debugMode, ref: gridRef, paginationPageSize: paginationPageSize, maxConcurrentDatasourceRequests: this.props.rowModelType === "infinite" ? 1 : undefined, onGridReady: this.onGridReady, onPaginationChanged: this.onPaginationChanged, onFilterModified: this.onFilterModified, onFilterChanged: this.onFilterChanged, onSortChanged: this.onSortChanged, defaultColDef: this.getDefaultColDefinition(defaultColDef), columnDefs: adaptedColumnDefs, rowData: !rowDataManualMode ? rowData : undefined }, passedProperties, { onCellFocused: this.onCellFocused, suppressPaginationPanel: true, getRowId: getRowId, components: customComponents, columnTypes: this.columnTypes, onColumnVisible: this.onColumnsChanged, onColumnPinned: this.onColumnsChanged, onColumnResized: this.onColumnsChanged, onColumnMoved: this.onColumnsChanged, onCellMouseDown: this.onCellMouseDown, navigateToNextCell: this.navigateToNextCell, onViewportChanged: this.onViewportChanged, onCellContextMenu: this.onCellContextMenu, loadingOverlayComponent: 'loadingOverlay', noRowsOverlayComponent: 'noRecordsOverlay', onRowDataUpdated: this.onRowDataUpdated, context: this.table_context, rowHeight: this.state.rowHeight, getRowStyle: this._getRowStyle, getRowHeight: this._getRowHeight, headerHeight: headerHeight !== undefined ? headerHeight : headerFilterRowHeight, floatingFiltersHeight: headerFilterRowHeight, suppressLoadingOverlay: this.props.loadingOverlayRenderer ? true : this.props.suppressLoadingOverlay, quickFilterParser: this.wildcardQuickFilter.quickFilterParser, quickFilterMatcher: this.wildcardQuickFilter.quickFilterMatcher })),
+                            this.state.loading && this.props.loadingOverlayRenderer &&
+                                React.createElement("div", { className: "ag-overlay", "aria-hidden": "true", ref: "overlayWrapper" },
+                                    React.createElement("div", { className: "ag-overlay-panel" },
+                                        React.createElement("div", { className: "ag-overlay-wrapper ag-layout-normal ag-overlay-loading-wrapper" },
+                                            React.createElement("div", { className: "ag-react-container" }, (_d = (_c = this.props).loadingOverlayRenderer) === null || _d === void 0 ? void 0 : _d.call(_c))))))), (_f = (_e = this.props).tableOverlayRenderer) === null || _f === void 0 ? void 0 :
+                    _f.call(_e))),
+            !!this.gridApi && !!this.gridApi && this.state.pageSize !== null &&
+                React.createElement(DataGridEditor, { dataGrid: this, gridApi: this.gridApi, columnDefinitions: columnDefs, columnModel: this.state.columnModel, visible: !!this.props.tableConfigVisible, onTableConfigVisible: this.showTableConfiguration, paginationPageSize: paging.pageSize, paginationDefaultPageSize: paging.defaultPageSize, currentPageSize: this.state.pageSize, showMilliseconds: !!this.props.showMilliseconds, defaultShowMilliseconds: !!this.props.defaultShowMilliseconds, showYear: !this.props.hideYear, defaultShowYear: !this.props.defaultHideYear, rowStyleRules: this.props.rowStyleRules, defaultRowStyleRules: this.props.defaultRowStyleRules, onChangeRowStyleRules: onChangeRowStyleRules }),
+            !!this.gridApi && React.createElement(ModalDialog, { mode: "OK_CANCEL", open: this.state.columnsConfigVisible, initialWidth: 700, initialHeight: this.state.columnTransferHeight, title: React.createElement("span", null,
+                    React.createElement(ControlOutlined, { style: {
+                            color: "#faad14",
+                            fontSize: 22,
+                            marginRight: 16
+                        } }),
+                    i18n("Columns Configuration")), cancelText: i18n("Cancel"), onCancel: () => {
+                    if (this.gridApi && this.columnModelBeforeEdit) {
+                        this.gridApi.applyColumnState({ state: this.columnModelBeforeEdit, applyOrder: true });
+                        delete this.columnModelBeforeEdit;
+                        this.showColumnsConfig(false);
+                    }
+                }, onOk: () => {
+                    delete this.columnModelBeforeEdit;
+                    this.showColumnsConfig(false);
+                }, onResize: ({ height }) => {
+                    this.setState({ columnTransferHeight: height });
+                }, zIndex: 100 },
+                React.createElement(ColumnTransfer, { columnDefinitions: columnDefs, columnModel: this.state.columnModel, gridApi: this.gridApi, height: this.state.columnTransferHeight - 154 }))));
+    }
+}
+DataGrid.defaultProps = {
+    paging: {
+        pageSize: 0,
+        defaultPageSize: 0
+    },
+    rowStyleRules: tableDefaultRowStyleRules()
+};
+DataGrid.EMPTY_STYLE = {};
+export default DataGrid;
 //# sourceMappingURL=dataGrid.js.map