ods-component-lib 1.19.15 → 1.20.0

package/dist/index.modern.js

@@ -23,6 +23,7 @@ import jsPDF, { jsPDF as jsPDF$1 } from 'jspdf';
 import { saveAs as saveAs$1 } from 'file-saver-es';
 import DataSource from 'devextreme/data/data_source';
 import query from 'devextreme/data/query';
+import queryString from 'query-string';
 import { Gantt, HeaderFilter as HeaderFilter$1, FilterRow as FilterRow$1, Toolbar as Toolbar$2, Item as Item$2, ContextMenu, Column as Column$1, Tasks, Sorting as Sorting$1 } from 'devextreme-react/gantt';
 import 'jspdf-autotable';
 import { Button as Button$2 } from 'devextreme-react/button';
@@ -34184,7 +34185,8 @@ var OdsBatchEditDataGrid = function OdsBatchEditDataGrid(props) {
     locale(localStorage.getItem("locale"));
     loadMessages(JSON.parse(localStorage.getItem("localTranslation")));
     if (props.dataGridRef.current) {
-      props.dataGridRef.current.instance.updateDimensions();
+      var _props$dataGridRef$cu, _props$dataGridRef$cu2, _props$dataGridRef$cu3, _props$dataGridRef$cu4;
+      (_props$dataGridRef$cu = props.dataGridRef.current) === null || _props$dataGridRef$cu === void 0 ? void 0 : (_props$dataGridRef$cu2 = _props$dataGridRef$cu.instance) === null || _props$dataGridRef$cu2 === void 0 ? void 0 : (_props$dataGridRef$cu3 = (_props$dataGridRef$cu4 = _props$dataGridRef$cu2.call(_props$dataGridRef$cu)).updateDimensions) === null || _props$dataGridRef$cu3 === void 0 ? void 0 : _props$dataGridRef$cu3.call(_props$dataGridRef$cu4);
     }
   }, []);
   useEffect(function () {
@@ -34193,8 +34195,9 @@ var OdsBatchEditDataGrid = function OdsBatchEditDataGrid(props) {
   var checkSortingPropertyForInitilaize = function checkSortingPropertyForInitilaize() {
     var onOptionChanged = props.onOptionChanged;
     if (onOptionChanged) {
-      var dataGridInstance = props.dataGridRef.current.instance;
-      var sortingState = dataGridInstance.getVisibleColumns().filter(function (p) {
+      var _props$dataGridRef$cu5, _props$dataGridRef$cu6;
+      var dataGridInstance = (_props$dataGridRef$cu5 = props.dataGridRef.current) === null || _props$dataGridRef$cu5 === void 0 ? void 0 : (_props$dataGridRef$cu6 = _props$dataGridRef$cu5.instance) === null || _props$dataGridRef$cu6 === void 0 ? void 0 : _props$dataGridRef$cu6.call(_props$dataGridRef$cu5);
+      var sortingState = dataGridInstance === null || dataGridInstance === void 0 ? void 0 : dataGridInstance.getVisibleColumns().filter(function (p) {
         return !p.command;
       }).map(function (column, index) {
         return {
@@ -34883,9 +34886,7 @@ var MasterDetailDataGrid = function MasterDetailDataGrid(_ref) {
     return React.createElement(Column, Object.assign({
       key: col.dataField
     }, col, {
-      headerFilter: {
-        visible: col.allowFiltering
-      }
+      allowHeaderFiltering: col.allowFiltering
     }));
   }), React.createElement(ColumnChooser, {
     enabled: masterDetailFeatures.columnChooser,
@@ -35033,7 +35034,8 @@ var OdsBasicDataGrid = function OdsBasicDataGrid(props) {
     locale(localStorage.getItem("locale"));
     loadMessages(JSON.parse(localStorage.getItem("localTranslation")));
     if (gridRef.current) {
-      gridRef.current.instance.updateDimensions();
+      var _gridRef$current, _gridRef$current$inst, _gridRef$current$inst2;
+      (_gridRef$current = gridRef.current) === null || _gridRef$current === void 0 ? void 0 : (_gridRef$current$inst = _gridRef$current.instance) === null || _gridRef$current$inst === void 0 ? void 0 : (_gridRef$current$inst2 = _gridRef$current$inst.call(_gridRef$current)) === null || _gridRef$current$inst2 === void 0 ? void 0 : _gridRef$current$inst2.updateDimensions();
     }
     hasFastUpdate && document.addEventListener("keydown", keydownEvent);
     return function () {
@@ -35046,8 +35048,9 @@ var OdsBasicDataGrid = function OdsBasicDataGrid(props) {
   var checkSortingPropertyForInitilaize = function checkSortingPropertyForInitilaize() {
     var onOptionChanged = props.onOptionChanged;
     if (onOptionChanged) {
-      var dataGridInstance = gridRef.current.instance;
-      var sortingState = dataGridInstance.getVisibleColumns().filter(function (p) {
+      var _gridRef$current2, _gridRef$current2$ins;
+      var dataGridInstance = (_gridRef$current2 = gridRef.current) === null || _gridRef$current2 === void 0 ? void 0 : (_gridRef$current2$ins = _gridRef$current2.instance) === null || _gridRef$current2$ins === void 0 ? void 0 : _gridRef$current2$ins.call(_gridRef$current2);
+      var sortingState = dataGridInstance === null || dataGridInstance === void 0 ? void 0 : dataGridInstance.getVisibleColumns().filter(function (p) {
         return !p.command;
       }).map(function (column, index) {
         return {
@@ -35061,7 +35064,7 @@ var OdsBasicDataGrid = function OdsBasicDataGrid(props) {
       });
       if (sortedColumn) {
         if (sortedColumn.sortOrder) {
-          dataGridInstance.option("columns[" + sortedColumn.index + "].sortOrder", sortedColumn.sortOrder);
+          dataGridInstance === null || dataGridInstance === void 0 ? void 0 : dataGridInstance.option("columns[" + sortedColumn.index + "].sortOrder", sortedColumn.sortOrder);
           var fullName = "columns[" + sortedColumn.index + "].sortOrder";
           var gridEvent = {
             component: dataGridInstance,
@@ -35128,13 +35131,16 @@ var OdsBasicDataGrid = function OdsBasicDataGrid(props) {
     }));
     for (var rowIndex = minRowIndex; rowIndex <= maxRowIndex; rowIndex++) {
       var _loop2 = function _loop2() {
-        var _column = gridRef.current.instance.columnOption(colIndex);
+        var _gridRef$current3, _gridRef$current3$ins, _gridRef$current3$ins2;
+        var _column = (_gridRef$current3 = gridRef.current) === null || _gridRef$current3 === void 0 ? void 0 : (_gridRef$current3$ins = _gridRef$current3.instance) === null || _gridRef$current3$ins === void 0 ? void 0 : (_gridRef$current3$ins2 = _gridRef$current3$ins.call(_gridRef$current3)) === null || _gridRef$current3$ins2 === void 0 ? void 0 : _gridRef$current3$ins2.columnOption(colIndex);
         if (constants$1.allowedDataTypesForMultiCellEditing.some(function (item) {
-          return item.toLocaleLowerCase() == _column.dataType.toLocaleLowerCase();
+          var _column$dataType;
+          return item.toLocaleLowerCase() == (_column === null || _column === void 0 ? void 0 : (_column$dataType = _column.dataType) === null || _column$dataType === void 0 ? void 0 : _column$dataType.toLocaleLowerCase());
         })) {
+          var _gridRef$current4, _gridRef$current4$ins, _gridRef$current4$ins2;
           result.push({
             dataField: _column.dataField,
-            pkValue: gridRef.current.instance.cellValue(rowIndex, pkName)
+            pkValue: (_gridRef$current4 = gridRef.current) === null || _gridRef$current4 === void 0 ? void 0 : (_gridRef$current4$ins = _gridRef$current4.instance) === null || _gridRef$current4$ins === void 0 ? void 0 : (_gridRef$current4$ins2 = _gridRef$current4$ins.call(_gridRef$current4)) === null || _gridRef$current4$ins2 === void 0 ? void 0 : _gridRef$current4$ins2.cellValue(rowIndex, pkName)
           });
         }
       };
@@ -35170,8 +35176,9 @@ var OdsBasicDataGrid = function OdsBasicDataGrid(props) {
     });
   };
   var removeSelectedCell = function removeSelectedCell(rowIndex, colIndex) {
-    var dataField = gridRef.current.instance.columnOption(colIndex).dataField;
-    var pkValue = gridRef.current.instance.cellValue(rowIndex, pkName);
+    var _gridRef$current5, _gridRef$current5$ins, _gridRef$current5$ins2, _gridRef$current5$ins3, _gridRef$current6, _gridRef$current6$ins, _gridRef$current6$ins2;
+    var dataField = (_gridRef$current5 = gridRef.current) === null || _gridRef$current5 === void 0 ? void 0 : (_gridRef$current5$ins = _gridRef$current5.instance) === null || _gridRef$current5$ins === void 0 ? void 0 : (_gridRef$current5$ins2 = _gridRef$current5$ins.call(_gridRef$current5)) === null || _gridRef$current5$ins2 === void 0 ? void 0 : (_gridRef$current5$ins3 = _gridRef$current5$ins2.columnOption(colIndex)) === null || _gridRef$current5$ins3 === void 0 ? void 0 : _gridRef$current5$ins3.dataField;
+    var pkValue = (_gridRef$current6 = gridRef.current) === null || _gridRef$current6 === void 0 ? void 0 : (_gridRef$current6$ins = _gridRef$current6.instance) === null || _gridRef$current6$ins === void 0 ? void 0 : (_gridRef$current6$ins2 = _gridRef$current6$ins.call(_gridRef$current6)) === null || _gridRef$current6$ins2 === void 0 ? void 0 : _gridRef$current6$ins2.cellValue(rowIndex, pkName);
     setSelectedCells(function (prev) {
       return prev.filter(function (cell) {
         return !(cell.dataField == dataField && cell.pkValue == pkValue);
@@ -36359,22 +36366,23 @@ var useOnExportingHandler$1 = function useOnExportingHandler(exportProps, getSum
 
 var useOnOptionChangedHandler = function useOnOptionChangedHandler(dataGridRef, totalFilteredCount, sortingProps, setFilterApplied, setUpdateTrigger, callback) {
   var onOptionChanged = useCallback(function (e) {
-    var dataGrid = dataGridRef.current.instance;
+    var _dataGridRef$current, _dataGridRef$current$;
+    var dataGrid = (_dataGridRef$current = dataGridRef.current) === null || _dataGridRef$current === void 0 ? void 0 : (_dataGridRef$current$ = _dataGridRef$current.instance) === null || _dataGridRef$current$ === void 0 ? void 0 : _dataGridRef$current$.call(_dataGridRef$current);
     var updateFilterStatus = function updateFilterStatus() {
-      var filters = dataGrid.getCombinedFilter(true);
+      var filters = dataGrid === null || dataGrid === void 0 ? void 0 : dataGrid.getCombinedFilter(true);
       var active = filters && filters.length > 0;
       setFilterApplied(active);
       return active;
     };
     if (e.fullName.includes("sortOrder")) {
-      dataGrid.getScrollable().scrollTo(0);
+      dataGrid === null || dataGrid === void 0 ? void 0 : dataGrid.getScrollable().scrollTo(0);
     }
     if (e.fullName.includes("filterValue") || e.fullName.includes("filter") || e.fullName === "searchPanel.text") {
       var active = updateFilterStatus();
       if (active) {
         setTimeout(function () {
-          dataGrid.refresh().done(function () {
-            totalFilteredCount.current = dataGrid.totalCount();
+          dataGrid === null || dataGrid === void 0 ? void 0 : dataGrid.refresh().done(function () {
+            totalFilteredCount.current = dataGrid === null || dataGrid === void 0 ? void 0 : dataGrid.totalCount();
             setUpdateTrigger(function (prev) {
               return !prev;
             });
@@ -54397,25 +54405,26 @@ var OdsMergeCellDataGrid = forwardRef(function (props, ref) {
     store: data,
     load: function load(options) {
       try {
-        var _refGrid$current$inst;
+        var _refGrid$current, _refGrid$current$inst, _instance$_firstLoad;
         var _data = [].concat(data);
-        var _firstLoad = (_refGrid$current$inst = refGrid.current.instance._firstLoad) != null ? _refGrid$current$inst : true;
-        if (_firstLoad) {
-          refGrid.current.instance._firstLoad = false;
+        var instance = (_refGrid$current = refGrid.current) === null || _refGrid$current === void 0 ? void 0 : (_refGrid$current$inst = _refGrid$current.instance) === null || _refGrid$current$inst === void 0 ? void 0 : _refGrid$current$inst.call(_refGrid$current);
+        var _firstLoad = (_instance$_firstLoad = instance === null || instance === void 0 ? void 0 : instance._firstLoad) != null ? _instance$_firstLoad : true;
+        if (_firstLoad && instance) {
+          instance._firstLoad = false;
         }
         if (options.filter) {
           _data = query(_data).filter(options.filter).toArray();
         }
-        var _prevSort = refGrid.current.instance._prevSortedColumns;
-        var _currentSort = getSortedColumns(refGrid.current.instance);
+        var _prevSort = instance === null || instance === void 0 ? void 0 : instance._prevSortedColumns;
+        var _currentSort = getSortedColumns(instance);
         if (!_firstLoad && isSortChanged(_prevSort, _currentSort)) {
           props.onSortingChanged && props.onSortingChanged(_currentSort);
         }
-        refGrid.current.instance._prevSortedColumns = _currentSort;
+        instance._prevSortedColumns = _currentSort;
         helper.columns = props.columns;
         helper.mergeDataFields = props.mergeDataFields;
         helper.dataSource = _data;
-        refGrid.current.instance._mergedCells = helper.mergeDataSource();
+        instance._mergedCells = helper.mergeDataSource();
         return Promise.resolve({
           data: _data,
           totalCount: _data.length
@@ -54428,7 +54437,8 @@ var OdsMergeCellDataGrid = forwardRef(function (props, ref) {
   useImperativeHandle(ref, function () {
     return {
       getSortedColumns: function getSortedColumns$1() {
-        return getSortedColumns(refGrid.current.instance);
+        var _refGrid$current2, _refGrid$current2$ins;
+        return getSortedColumns((_refGrid$current2 = refGrid.current) === null || _refGrid$current2 === void 0 ? void 0 : (_refGrid$current2$ins = _refGrid$current2.instance) === null || _refGrid$current2$ins === void 0 ? void 0 : _refGrid$current2$ins.call(_refGrid$current2));
       }
     };
   });
@@ -55106,309 +55116,6 @@ function debounce(func, wait, options) {
 
 var debounce_1 = debounce;
 
-var strictUriEncode = function (str) {
-	return encodeURIComponent(str).replace(/[!'()*]/g, function (c) {
-		return '%' + c.charCodeAt(0).toString(16).toUpperCase();
-	});
-};
-
-/*
-object-assign
-(c) Sindre Sorhus
-@license MIT
-*/
-/* eslint-disable no-unused-vars */
-var getOwnPropertySymbols = Object.getOwnPropertySymbols;
-var hasOwnProperty$1 = Object.prototype.hasOwnProperty;
-var propIsEnumerable = Object.prototype.propertyIsEnumerable;
-
-function toObject(val) {
-	if (val === null || val === undefined) {
-		throw new TypeError('Object.assign cannot be called with null or undefined');
-	}
-
-	return Object(val);
-}
-
-function shouldUseNative() {
-	try {
-		if (!Object.assign) {
-			return false;
-		}
-
-		// Detect buggy property enumeration order in older V8 versions.
-
-		// https://bugs.chromium.org/p/v8/issues/detail?id=4118
-		var test1 = new String('abc');  // eslint-disable-line no-new-wrappers
-		test1[5] = 'de';
-		if (Object.getOwnPropertyNames(test1)[0] === '5') {
-			return false;
-		}
-
-		// https://bugs.chromium.org/p/v8/issues/detail?id=3056
-		var test2 = {};
-		for (var i = 0; i < 10; i++) {
-			test2['_' + String.fromCharCode(i)] = i;
-		}
-		var order2 = Object.getOwnPropertyNames(test2).map(function (n) {
-			return test2[n];
-		});
-		if (order2.join('') !== '0123456789') {
-			return false;
-		}
-
-		// https://bugs.chromium.org/p/v8/issues/detail?id=3056
-		var test3 = {};
-		'abcdefghijklmnopqrst'.split('').forEach(function (letter) {
-			test3[letter] = letter;
-		});
-		if (Object.keys(Object.assign({}, test3)).join('') !==
-				'abcdefghijklmnopqrst') {
-			return false;
-		}
-
-		return true;
-	} catch (err) {
-		// We don't expect any of the above to throw, but better to be safe.
-		return false;
-	}
-}
-
-var objectAssign = shouldUseNative() ? Object.assign : function (target, source) {
-	var from;
-	var to = toObject(target);
-	var symbols;
-
-	for (var s = 1; s < arguments.length; s++) {
-		from = Object(arguments[s]);
-
-		for (var key in from) {
-			if (hasOwnProperty$1.call(from, key)) {
-				to[key] = from[key];
-			}
-		}
-
-		if (getOwnPropertySymbols) {
-			symbols = getOwnPropertySymbols(from);
-			for (var i = 0; i < symbols.length; i++) {
-				if (propIsEnumerable.call(from, symbols[i])) {
-					to[symbols[i]] = from[symbols[i]];
-				}
-			}
-		}
-	}
-
-	return to;
-};
-
-function encoderForArrayFormat(opts) {
-	switch (opts.arrayFormat) {
-		case 'index':
-			return function (key, value, index) {
-				return value === null ? [
-					encode(key, opts),
-					'[',
-					index,
-					']'
-				].join('') : [
-					encode(key, opts),
-					'[',
-					encode(index, opts),
-					']=',
-					encode(value, opts)
-				].join('');
-			};
-
-		case 'bracket':
-			return function (key, value) {
-				return value === null ? encode(key, opts) : [
-					encode(key, opts),
-					'[]=',
-					encode(value, opts)
-				].join('');
-			};
-
-		default:
-			return function (key, value) {
-				return value === null ? encode(key, opts) : [
-					encode(key, opts),
-					'=',
-					encode(value, opts)
-				].join('');
-			};
-	}
-}
-
-function parserForArrayFormat(opts) {
-	var result;
-
-	switch (opts.arrayFormat) {
-		case 'index':
-			return function (key, value, accumulator) {
-				result = /\[(\d*)\]$/.exec(key);
-
-				key = key.replace(/\[\d*\]$/, '');
-
-				if (!result) {
-					accumulator[key] = value;
-					return;
-				}
-
-				if (accumulator[key] === undefined) {
-					accumulator[key] = {};
-				}
-
-				accumulator[key][result[1]] = value;
-			};
-
-		case 'bracket':
-			return function (key, value, accumulator) {
-				result = /(\[\])$/.exec(key);
-				key = key.replace(/\[\]$/, '');
-
-				if (!result) {
-					accumulator[key] = value;
-					return;
-				} else if (accumulator[key] === undefined) {
-					accumulator[key] = [value];
-					return;
-				}
-
-				accumulator[key] = [].concat(accumulator[key], value);
-			};
-
-		default:
-			return function (key, value, accumulator) {
-				if (accumulator[key] === undefined) {
-					accumulator[key] = value;
-					return;
-				}
-
-				accumulator[key] = [].concat(accumulator[key], value);
-			};
-	}
-}
-
-function encode(value, opts) {
-	if (opts.encode) {
-		return opts.strict ? strictUriEncode(value) : encodeURIComponent(value);
-	}
-
-	return value;
-}
-
-function keysSorter(input) {
-	if (Array.isArray(input)) {
-		return input.sort();
-	} else if (typeof input === 'object') {
-		return keysSorter(Object.keys(input)).sort(function (a, b) {
-			return Number(a) - Number(b);
-		}).map(function (key) {
-			return input[key];
-		});
-	}
-
-	return input;
-}
-
-var extract = function (str) {
-	return str.split('?')[1] || '';
-};
-
-var parse = function (str, opts) {
-	opts = objectAssign({arrayFormat: 'none'}, opts);
-
-	var formatter = parserForArrayFormat(opts);
-
-	// Create an object with no prototype
-	// https://github.com/sindresorhus/query-string/issues/47
-	var ret = Object.create(null);
-
-	if (typeof str !== 'string') {
-		return ret;
-	}
-
-	str = str.trim().replace(/^(\?|#|&)/, '');
-
-	if (!str) {
-		return ret;
-	}
-
-	str.split('&').forEach(function (param) {
-		var parts = param.replace(/\+/g, ' ').split('=');
-		// Firefox (pre 40) decodes `%3D` to `=`
-		// https://github.com/sindresorhus/query-string/pull/37
-		var key = parts.shift();
-		var val = parts.length > 0 ? parts.join('=') : undefined;
-
-		// missing `=` should be `null`:
-		// http://w3.org/TR/2012/WD-url-20120524/#collect-url-parameters
-		val = val === undefined ? null : decodeURIComponent(val);
-
-		formatter(decodeURIComponent(key), val, ret);
-	});
-
-	return Object.keys(ret).sort().reduce(function (result, key) {
-		var val = ret[key];
-		if (Boolean(val) && typeof val === 'object' && !Array.isArray(val)) {
-			// Sort object keys, not values
-			result[key] = keysSorter(val);
-		} else {
-			result[key] = val;
-		}
-
-		return result;
-	}, Object.create(null));
-};
-
-var stringify = function (obj, opts) {
-	var defaults = {
-		encode: true,
-		strict: true,
-		arrayFormat: 'none'
-	};
-
-	opts = objectAssign(defaults, opts);
-
-	var formatter = encoderForArrayFormat(opts);
-
-	return obj ? Object.keys(obj).sort().map(function (key) {
-		var val = obj[key];
-
-		if (val === undefined) {
-			return '';
-		}
-
-		if (val === null) {
-			return encode(key, opts);
-		}
-
-		if (Array.isArray(val)) {
-			var result = [];
-
-			val.slice().forEach(function (val2) {
-				if (val2 === undefined) {
-					return;
-				}
-
-				result.push(formatter(key, val2, result.length));
-			});
-
-			return result.join('&');
-		}
-
-		return encode(key, opts) + '=' + encode(val, opts);
-	}).filter(function (x) {
-		return x.length > 0;
-	}).join('&') : '';
-};
-
-var queryString = {
-	extract: extract,
-	parse: parse,
-	stringify: stringify
-};
-
 var exportFormats$2 = ["xlsx"];
 var totalPageCount = 1;
 var loadedPageCount = 1;
@@ -55493,13 +55200,15 @@ var _OdsRemoteDataGrid = function OdsRemoteDataGrid(props) {
     locale(localStorage.getItem("locale"));
     loadMessages(JSON.parse(localStorage.getItem("localTranslation")));
     if (gridRef.current) {
-      gridRef.current.instance.updateDimensions();
+      var _gridRef$current, _gridRef$current$inst, _gridRef$current$inst2;
+      (_gridRef$current = gridRef.current) === null || _gridRef$current === void 0 ? void 0 : (_gridRef$current$inst = _gridRef$current.instance) === null || _gridRef$current$inst === void 0 ? void 0 : (_gridRef$current$inst2 = _gridRef$current$inst.call(_gridRef$current)) === null || _gridRef$current$inst2 === void 0 ? void 0 : _gridRef$current$inst2.updateDimensions();
     }
   }, []);
   useEffect(function () {
     if (contentReady) checkSortingPropertyForInitilaize();
   }, [contentReady]);
   useEffect(function () {
+    var _gridRef$current$inst4, _gridRef$current3;
     var cssRules = "\n            .data-exists .dx-datagrid-borders > .dx-datagrid-filter-panel,\n            .data-exists .dx-datagrid-borders > .dx-datagrid-headers {\n              border-top: 1px solid rgba(0, 0, 0, 0.06);\n              padding-right: 0px !important;\n            }\n            \n            .data-exists .dx-datagrid-headers .dx-datagrid-content {\n              margin-bottom: -1px;\n              padding-right: 17px !important;\n            }\n          ";
     var styleSheet = document.createElement('style');
     styleSheet.type = 'text/css';
@@ -55507,9 +55216,10 @@ var _OdsRemoteDataGrid = function OdsRemoteDataGrid(props) {
     document.head.appendChild(styleSheet);
     var checkData = function checkData() {
       if (gridRef.current) {
-        var _dataGridInstance = gridRef.current.instance;
+        var _gridRef$current$inst3, _gridRef$current2;
+        var _dataGridInstance = (_gridRef$current$inst3 = (_gridRef$current2 = gridRef.current).instance) === null || _gridRef$current$inst3 === void 0 ? void 0 : _gridRef$current$inst3.call(_gridRef$current2);
         var dataExists = data.length >= 15;
-        var gridElement = _dataGridInstance.element();
+        var gridElement = _dataGridInstance === null || _dataGridInstance === void 0 ? void 0 : _dataGridInstance.element();
         if (dataExists) {
           gridElement.classList.add('data-exists');
         } else {
@@ -55517,19 +55227,20 @@ var _OdsRemoteDataGrid = function OdsRemoteDataGrid(props) {
         }
       }
     };
-    var dataGridInstance = gridRef.current.instance;
-    dataGridInstance.on('dataChanged', checkData);
+    var dataGridInstance = (_gridRef$current$inst4 = (_gridRef$current3 = gridRef.current).instance) === null || _gridRef$current$inst4 === void 0 ? void 0 : _gridRef$current$inst4.call(_gridRef$current3);
+    dataGridInstance === null || dataGridInstance === void 0 ? void 0 : dataGridInstance.on('dataChanged', checkData);
     checkData();
     return function () {
       document.head.removeChild(styleSheet);
-      dataGridInstance.off('dataChanged', checkData);
+      dataGridInstance === null || dataGridInstance === void 0 ? void 0 : dataGridInstance.off('dataChanged', checkData);
     };
   }, [data]);
   var checkSortingPropertyForInitilaize = function checkSortingPropertyForInitilaize() {
     var onOptionChanged = props.onOptionChanged;
     if (onOptionChanged) {
-      var dataGridInstance = gridRef.current.instance;
-      var sortingState = dataGridInstance.getVisibleColumns().filter(function (p) {
+      var _gridRef$current$inst5, _gridRef$current4;
+      var dataGridInstance = (_gridRef$current$inst5 = (_gridRef$current4 = gridRef.current).instance) === null || _gridRef$current$inst5 === void 0 ? void 0 : _gridRef$current$inst5.call(_gridRef$current4);
+      var sortingState = dataGridInstance === null || dataGridInstance === void 0 ? void 0 : dataGridInstance.getVisibleColumns().filter(function (p) {
         return !p.command;
       }).map(function (column, index) {
         return {
@@ -55926,7 +55637,8 @@ var _OdsRemoteDataGrid = function OdsRemoteDataGrid(props) {
     run(e);
   };
   useEffect(function () {
-    var gridElement = gridRef.current.instance.element();
+    var _gridRef$current$inst6, _gridRef$current5, _gridRef$current$inst7;
+    var gridElement = (_gridRef$current$inst6 = (_gridRef$current5 = gridRef.current).instance) === null || _gridRef$current$inst6 === void 0 ? void 0 : (_gridRef$current$inst7 = _gridRef$current$inst6.call(_gridRef$current5)) === null || _gridRef$current$inst7 === void 0 ? void 0 : _gridRef$current$inst7.element();
     gridElement.scrollTop = scrollPosition;
   }, [data.length]);
   useEffect(function () {
@@ -56263,22 +55975,26 @@ var OdsServerSideDatagrid = function OdsServerSideDatagrid(props) {
     }
   }, [props.columns, filterApplied]);
   var handleOptionChanged = useCallback(function (e) {
-    var dataGrid = props.dataGridRef.current.instance;
+    var _props$dataGridRef$cu, _props$dataGridRef$cu2;
+    if (props.dataGridRef.current === null) {
+      return;
+    }
+    var dataGrid = (_props$dataGridRef$cu = props.dataGridRef.current) === null || _props$dataGridRef$cu === void 0 ? void 0 : (_props$dataGridRef$cu2 = _props$dataGridRef$cu.instance) === null || _props$dataGridRef$cu2 === void 0 ? void 0 : _props$dataGridRef$cu2.call(_props$dataGridRef$cu);
     var updateFilterStatus = function updateFilterStatus() {
-      var filters = dataGrid.getCombinedFilter(true);
+      var filters = dataGrid === null || dataGrid === void 0 ? void 0 : dataGrid.getCombinedFilter(true);
       var active = filters && filters.length > 0;
       setFilterApplied(active);
       return active;
     };
     if (e.fullName.includes("sortOrder")) {
-      dataGrid.getScrollable().scrollTo(0);
+      dataGrid === null || dataGrid === void 0 ? void 0 : dataGrid.getScrollable().scrollTo(0);
     }
     if (e.fullName.includes("filterValue") || e.fullName.includes("filter") || e.fullName === "searchPanel.text") {
       var active = updateFilterStatus();
       if (active) {
         setTimeout(function () {
-          dataGrid.refresh().done(function () {
-            totalFilteredCount.current = dataGrid.totalCount();
+          dataGrid === null || dataGrid === void 0 ? void 0 : dataGrid.refresh().done(function () {
+            totalFilteredCount.current = dataGrid === null || dataGrid === void 0 ? void 0 : dataGrid.totalCount();
             setUpdateTrigger(function (prev) {
               return !prev;
             });
@@ -57312,7 +57028,8 @@ var OdsTimelineTable = forwardRef(function (props, ref) {
         });
       });
     } else {
-      refGantt.current.instance.clearSorting();
+      var _refGantt$current, _refGantt$current$ins, _refGantt$current$ins2;
+      (_refGantt$current = refGantt.current) === null || _refGantt$current === void 0 ? void 0 : (_refGantt$current$ins = _refGantt$current.instance) === null || _refGantt$current$ins === void 0 ? void 0 : (_refGantt$current$ins2 = _refGantt$current$ins.call(_refGantt$current)) === null || _refGantt$current$ins2 === void 0 ? void 0 : _refGantt$current$ins2.clearSorting();
     }
     onSortingChanged && onSortingChanged([], undefined);
   };
@@ -57504,8 +57221,8 @@ var OdsTimelineTable = forwardRef(function (props, ref) {
     }));
   };
   var exportExcel = function exportExcel() {
-    var _toolbarSettings$expo, _toolbarSettings$expo2, _toolbarSettings$expo3, _toolbarSettings$expo4, _toolbarSettings$expo5, _toolbarSettings$expo6;
-    var exportableDataGrid = refDataGridExportable.current.instance;
+    var _refDataGridExportabl, _refDataGridExportabl2, _toolbarSettings$expo, _toolbarSettings$expo2, _toolbarSettings$expo3, _toolbarSettings$expo4, _toolbarSettings$expo5, _toolbarSettings$expo6;
+    var exportableDataGrid = (_refDataGridExportabl = refDataGridExportable.current) === null || _refDataGridExportabl === void 0 ? void 0 : (_refDataGridExportabl2 = _refDataGridExportabl.instance) === null || _refDataGridExportabl2 === void 0 ? void 0 : _refDataGridExportabl2.call(_refDataGridExportabl);
     exportToExcel({
       gridComponent: exportableDataGrid,
       baseFileName: toolbarSettings === null || toolbarSettings === void 0 ? void 0 : (_toolbarSettings$expo = toolbarSettings["export"]) === null || _toolbarSettings$expo === void 0 ? void 0 : _toolbarSettings$expo.fileName,
@@ -57519,8 +57236,8 @@ var OdsTimelineTable = forwardRef(function (props, ref) {
     });
   };
   var exportPdf = function exportPdf() {
-    var _toolbarSettings$expo7, _toolbarSettings$expo8, _toolbarSettings$expo9;
-    var exportableTimelineTable = refGanttExportable.current.instance;
+    var _refGanttExportable$c, _refGanttExportable$c2, _toolbarSettings$expo7, _toolbarSettings$expo8, _toolbarSettings$expo9;
+    var exportableTimelineTable = (_refGanttExportable$c = refGanttExportable.current) === null || _refGanttExportable$c === void 0 ? void 0 : (_refGanttExportable$c2 = _refGanttExportable$c.instance) === null || _refGanttExportable$c2 === void 0 ? void 0 : _refGanttExportable$c2.call(_refGanttExportable$c);
     exportGantt({
       component: exportableTimelineTable,
       createDocumentMethod: function createDocumentMethod(args) {
@@ -58073,16 +57790,13 @@ var OdsTransfer = function OdsTransfer(props) {
     }, (_props$showFilters = props.showFilters) != null ? _props$showFilters : React.createElement(FilterRow, {
       visible: true
     }), props.columns.map(function (column) {
-      return React.createElement(Column, Object.assign({
+      return React.createElement(Column, {
         dataField: column.dataField,
         caption: column.caption,
         dataType: column.dataType,
-        calculateSortValue: column.calculateSortValue
-      }, props.showFilters ? {
-        headerFilter: {
-          visible: true
-        }
-      } : {}));
+        calculateSortValue: column.calculateSortValue,
+        allowHeaderFiltering: props.showFilters
+      });
     }), props.displayPageTitle && React.createElement(Toolbar, null, React.createElement(Item, {
       location: "before",
       cssClass: "toolbarTitleItem"
@@ -58337,18 +58051,14 @@ var OdsTransferV2 = function OdsTransferV2(_ref) {
         key: column,
         dataField: column,
         caption: column,
-        headerFilter: {
-          visible: true
-        }
+        headerFilter: {}
       }) : React.createElement(Column, {
         key: column.dataIndex,
         dataField: column.dataField || column.dataIndex,
         caption: column.caption || column.title,
         dataType: column.dataType,
         calculateSortValue: column.calculateSortValue,
-        headerFilter: {
-          visible: true
-        }
+        headerFilter: {}
       });
     }), displayPageTitle && React.createElement(Toolbar, null, React.createElement(Item, {
       location: "before",