ods-component-lib 1.18.53 → 1.18.54

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -2,7 +2,6 @@ import React from 'react';
2
2
  import { IDataGridOptions, IButtonProps, ISelectionProps, IEditingProps, ISummaryProps } from 'devextreme-react/data-grid';
3
3
  import { ButtonType } from 'antd/es/button/buttonHelpers';
4
4
  export interface IOdsDataGridProps extends IDataGridOptions {
5
- ref?: any;
6
5
  dataGridPageName?: string;
7
6
  language: string;
8
7
  exportFileName: string;
package/dist/index.js CHANGED
@@ -16290,73 +16290,6 @@ function debounce(func, wait, options) {
16290
16290
 
16291
16291
  var debounce_1 = debounce;
16292
16292
 
16293
- /** Error message constants. */
16294
- var FUNC_ERROR_TEXT$1 = 'Expected a function';
16295
-
16296
- /**
16297
- * Creates a throttled function that only invokes `func` at most once per
16298
- * every `wait` milliseconds. The throttled function comes with a `cancel`
16299
- * method to cancel delayed `func` invocations and a `flush` method to
16300
- * immediately invoke them. Provide `options` to indicate whether `func`
16301
- * should be invoked on the leading and/or trailing edge of the `wait`
16302
- * timeout. The `func` is invoked with the last arguments provided to the
16303
- * throttled function. Subsequent calls to the throttled function return the
16304
- * result of the last `func` invocation.
16305
- *
16306
- * **Note:** If `leading` and `trailing` options are `true`, `func` is
16307
- * invoked on the trailing edge of the timeout only if the throttled function
16308
- * is invoked more than once during the `wait` timeout.
16309
- *
16310
- * If `wait` is `0` and `leading` is `false`, `func` invocation is deferred
16311
- * until to the next tick, similar to `setTimeout` with a timeout of `0`.
16312
- *
16313
- * See [David Corbacho's article](https://css-tricks.com/debouncing-throttling-explained-examples/)
16314
- * for details over the differences between `_.throttle` and `_.debounce`.
16315
- *
16316
- * @static
16317
- * @memberOf _
16318
- * @since 0.1.0
16319
- * @category Function
16320
- * @param {Function} func The function to throttle.
16321
- * @param {number} [wait=0] The number of milliseconds to throttle invocations to.
16322
- * @param {Object} [options={}] The options object.
16323
- * @param {boolean} [options.leading=true]
16324
- * Specify invoking on the leading edge of the timeout.
16325
- * @param {boolean} [options.trailing=true]
16326
- * Specify invoking on the trailing edge of the timeout.
16327
- * @returns {Function} Returns the new throttled function.
16328
- * @example
16329
- *
16330
- * // Avoid excessively updating the position while scrolling.
16331
- * jQuery(window).on('scroll', _.throttle(updatePosition, 100));
16332
- *
16333
- * // Invoke `renewToken` when the click event is fired, but not more than once every 5 minutes.
16334
- * var throttled = _.throttle(renewToken, 300000, { 'trailing': false });
16335
- * jQuery(element).on('click', throttled);
16336
- *
16337
- * // Cancel the trailing throttled invocation.
16338
- * jQuery(window).on('popstate', throttled.cancel);
16339
- */
16340
- function throttle(func, wait, options) {
16341
- var leading = true,
16342
- trailing = true;
16343
-
16344
- if (typeof func != 'function') {
16345
- throw new TypeError(FUNC_ERROR_TEXT$1);
16346
- }
16347
- if (isObject_1(options)) {
16348
- leading = 'leading' in options ? !!options.leading : leading;
16349
- trailing = 'trailing' in options ? !!options.trailing : trailing;
16350
- }
16351
- return debounce_1(func, wait, {
16352
- 'leading': leading,
16353
- 'maxWait': wait,
16354
- 'trailing': trailing
16355
- });
16356
- }
16357
-
16358
- var throttle_1 = throttle;
16359
-
16360
16293
  var iconComponents = {
16361
16294
  edit: outline.EditIcon,
16362
16295
  "delete": outline.Trash1Icon,
@@ -16386,20 +16319,13 @@ var OdsRemoteDataGrid = function OdsRemoteDataGrid(props) {
16386
16319
  var _useState = React.useState([]),
16387
16320
  data = _useState[0],
16388
16321
  setData = _useState[1];
16389
- var _useState2 = React.useState(false),
16390
- isLoading = _useState2[0],
16391
- setIsLoading = _useState2[1];
16392
16322
  var fileName = props.exportFileName ? props.exportFileName + moment().format("YYYYMMDD") : "DatagridExportFile" + moment().format("YYYYMMDD");
16393
- var _useState3 = React.useState(0),
16394
- filteredRowCount = _useState3[0],
16395
- setFilteredRowCount = _useState3[1];
16396
- var _useState4 = React.useState(props.columns),
16397
- columns = _useState4[0],
16398
- setColumns = _useState4[1];
16323
+ var _useState2 = React.useState(0),
16324
+ filteredRowCount = _useState2[0],
16325
+ setFilteredRowCount = _useState2[1];
16326
+ var columns = React.useRef(props.columns);
16399
16327
  var gridRef = React.useRef(null);
16400
- var _useState5 = React.useState(false),
16401
- filterApplied = _useState5[0],
16402
- setFilterApplied = _useState5[1];
16328
+ var filterApplied = React.useRef(false);
16403
16329
  var onCancelEditEvent = new CustomEvent('cancelEdit', {
16404
16330
  bubbles: true,
16405
16331
  detail: {
@@ -16427,13 +16353,8 @@ var OdsRemoteDataGrid = function OdsRemoteDataGrid(props) {
16427
16353
  }
16428
16354
  }, [(_props$axiosRequest2 = props.axiosRequest) === null || _props$axiosRequest2 === void 0 ? void 0 : _props$axiosRequest2.requestData]);
16429
16355
  React.useEffect(function () {
16430
- if (props.ref !== undefined) {
16431
- gridRef = props.ref;
16432
- }
16433
- }, [props.ref]);
16434
- React.useEffect(function () {
16435
- if (columns !== undefined && columns.length > 0) {
16436
- var newColumns = columns.map(function (colItem) {
16356
+ if (columns.current !== undefined && columns.current.length > 0) {
16357
+ var newColumns = columns.current.map(function (colItem) {
16437
16358
  if (colItem.tooltip !== undefined && colItem.tooltip.enable) {
16438
16359
  var headerCellRenderr = function headerCellRenderr() {
16439
16360
  return React__default.createElement("div", null, React__default.createElement("span", null, colItem.caption), React__default.createElement(antd.Tooltip, {
@@ -16448,7 +16369,7 @@ var OdsRemoteDataGrid = function OdsRemoteDataGrid(props) {
16448
16369
  }
16449
16370
  return colItem;
16450
16371
  });
16451
- setColumns(newColumns);
16372
+ columns.current = newColumns;
16452
16373
  }
16453
16374
  }, [props.columns]);
16454
16375
  React.useEffect(function () {
@@ -16488,7 +16409,6 @@ var OdsRemoteDataGrid = function OdsRemoteDataGrid(props) {
16488
16409
  var fetchData = React.useCallback(function () {
16489
16410
  try {
16490
16411
  if (props.axiosRequest == undefined) return Promise.resolve();
16491
- setIsLoading(true);
16492
16412
  var _temp2 = function () {
16493
16413
  if (props.isServerSide) {
16494
16414
  var apiUrl = props.axiosRequest.environmentUrl + "" + props.axiosRequest.apiUrl;
@@ -16560,30 +16480,20 @@ var OdsRemoteDataGrid = function OdsRemoteDataGrid(props) {
16560
16480
  }, [props.isServerSide]);
16561
16481
  var getServerSide = React.useCallback(function (type) {
16562
16482
  try {
16563
- var run = throttle_1(function (type) {
16564
- try {
16565
- return Promise.resolve(function () {
16566
- if (type === "reachedBottom") {
16567
- return function () {
16568
- if (totalPageCount <= loadedPageCount) {} else {
16569
- loadedPageCount = loadedPageCount + 1;
16570
- return Promise.resolve(fetchData()).then(function () {});
16571
- }
16572
- }();
16483
+ return Promise.resolve(function () {
16484
+ if (type === "reachedBottom") {
16485
+ return function () {
16486
+ if (totalPageCount <= loadedPageCount) {} else {
16487
+ loadedPageCount = loadedPageCount + 1;
16488
+ return Promise.resolve(fetchData()).then(function () {});
16573
16489
  }
16574
- }());
16575
- } catch (e) {
16576
- return Promise.reject(e);
16490
+ }();
16577
16491
  }
16578
- }, 5000, {
16579
- trailing: false
16580
- });
16581
- run(type);
16582
- return Promise.resolve();
16492
+ }());
16583
16493
  } catch (e) {
16584
16494
  return Promise.reject(e);
16585
16495
  }
16586
- }, [totalPageCount, loadedPageCount, fetchData]);
16496
+ }, [totalPageCount]);
16587
16497
  var onExporting = React.useCallback(function (e) {
16588
16498
  if (e.format === 'xlsx') {
16589
16499
  var workbook = new exceljs.Workbook();
@@ -16687,9 +16597,9 @@ var OdsRemoteDataGrid = function OdsRemoteDataGrid(props) {
16687
16597
  result = result + " - " + props.customSummary.summaryTotalPageCountLabel + " " + loadedPageCount + " / " + totalPageCount;
16688
16598
  }
16689
16599
  return result;
16690
- }, [data, filteredRowCount, loadedPageCount, props.pageSize, totalRecordCount, filterApplied]);
16600
+ }, [data, filteredRowCount, loadedPageCount, props.pageSize, totalRecordCount, filterApplied.current]);
16691
16601
  var concatFilteredLabel = function concatFilteredLabel(result, totalloaded) {
16692
- if (filteredRowCount > 0 && totalloaded !== filteredRowCount && filterApplied) {
16602
+ if (filteredRowCount > 0 && totalloaded !== filteredRowCount && filterApplied.current) {
16693
16603
  var filteredLabel = filteredRowCount + " " + props.customSummary.summaryFilteredDataLabel + "- ";
16694
16604
  result = filteredLabel + " " + result + " ";
16695
16605
  }
@@ -16739,10 +16649,13 @@ var OdsRemoteDataGrid = function OdsRemoteDataGrid(props) {
16739
16649
  var handleContentReady = function handleContentReady(e) {
16740
16650
  var dataGridInstance = e.component;
16741
16651
  var filteredDataCount = dataGridInstance.totalCount();
16742
- setFilteredRowCount(filteredDataCount);
16652
+ if (filterApplied.current && filteredDataCount > 0) setFilteredRowCount(filteredDataCount);
16743
16653
  };
16744
16654
  var onFilterValueChange = function onFilterValueChange(e) {
16745
- if (e !== null) setFilterApplied(true);else setFilterApplied(false);
16655
+ if (e !== null) filterApplied.current = true;else {
16656
+ filterApplied.current = false;
16657
+ setFilteredRowCount(0);
16658
+ }
16746
16659
  };
16747
16660
  return React__default.createElement(React__default.Fragment, null, React__default.createElement(DataGrid__default, {
16748
16661
  keyExpr: props.keyExpr,
@@ -16780,7 +16693,7 @@ var OdsRemoteDataGrid = function OdsRemoteDataGrid(props) {
16780
16693
  onEditCanceling: props.onEditCanceling,
16781
16694
  onContentReady: handleContentReady,
16782
16695
  onFilterValueChange: onFilterValueChange
16783
- }, columns.map(function (col) {
16696
+ }, columns.current.map(function (col) {
16784
16697
  return React__default.createElement(DataGrid.Column, Object.assign({
16785
16698
  key: col.dataField
16786
16699
  }, col, {
@@ -16807,8 +16720,9 @@ var OdsRemoteDataGrid = function OdsRemoteDataGrid(props) {
16807
16720
  caption: props.actionButtonGroupCaption,
16808
16721
  type: "buttons",
16809
16722
  showInColumnChooser: false
16810
- }, !props.edit && actionButtons.map(function (buttonItem) {
16723
+ }, !props.edit && actionButtons.map(function (buttonItem, index) {
16811
16724
  return React__default.createElement(DataGrid.Button, {
16725
+ key: "action-button-" + index,
16812
16726
  hint: buttonItem.hint,
16813
16727
  visible: buttonItem.visible,
16814
16728
  disabled: buttonItem.actionPermission == undefined ? false : !buttonItem.actionPermission,
@@ -16817,8 +16731,10 @@ var OdsRemoteDataGrid = function OdsRemoteDataGrid(props) {
16817
16731
  })),
16818
16732
  onClick: buttonItem.onClick
16819
16733
  });
16820
- }), props.edit && actionButtons.map(function (buttonItem) {
16821
- return React__default.createElement(DataGrid.Button, Object.assign({}, buttonItem));
16734
+ }), props.edit && actionButtons.map(function (buttonItem, index) {
16735
+ return React__default.createElement(DataGrid.Button, Object.assign({
16736
+ key: "action-button-" + index
16737
+ }, buttonItem));
16822
16738
  })), kebabMenuButtons.length > 0 && React__default.createElement(DataGrid.Column, {
16823
16739
  dataField: "Actionss",
16824
16740
  fixed: true,
@@ -16865,7 +16781,7 @@ var OdsRemoteDataGrid = function OdsRemoteDataGrid(props) {
16865
16781
  scrollByThumb: true,
16866
16782
  mode: "infinite"
16867
16783
  }), React__default.createElement(DataGrid.LoadPanel, {
16868
- enabled: isLoading,
16784
+ enabled: true,
16869
16785
  shadingColor: "rgba(0,0,0,0.4)"
16870
16786
  }), React__default.createElement(DataGrid.SearchPanel, {
16871
16787
  visible: true
@@ -16911,8 +16827,9 @@ var OdsRemoteDataGrid = function OdsRemoteDataGrid(props) {
16911
16827
  alignSelf: "stretch",
16912
16828
  margin: 0
16913
16829
  }
16914
- }, props.pageTitle)), props.toolbarButtonGroup && Array.isArray(props.toolbarButtonGroup) && props.toolbarButtonGroup.map(function (buttonGroupItem) {
16830
+ }, props.pageTitle)), props.toolbarButtonGroup && Array.isArray(props.toolbarButtonGroup) && props.toolbarButtonGroup.map(function (buttonGroupItem, index) {
16915
16831
  return React__default.createElement(DataGrid.Item, {
16832
+ key: "toolbar-button-" + index,
16916
16833
  location: "before"
16917
16834
  }, React__default.createElement(OdsButton, {
16918
16835
  style: {
@@ -16929,11 +16846,12 @@ var OdsRemoteDataGrid = function OdsRemoteDataGrid(props) {
16929
16846
  }), React__default.createElement(DataGrid.Item, {
16930
16847
  name: "exportButton",
16931
16848
  cssClass: 'toolbarPanelItems'
16932
- })), React__default.createElement(DataGrid.Summary, null, React__default.createElement(DataGrid.TotalItem, {
16933
- column: columns[0].dataField,
16849
+ })), React__default.createElement(DataGrid.Summary, {
16850
+ calculateCustomSummary: renderTotal
16851
+ }, React__default.createElement(DataGrid.TotalItem, {
16852
+ column: columns.current[0].dataField,
16934
16853
  summaryType: "custom",
16935
- displayFormat: "customizeText",
16936
- customizeText: renderTotal
16854
+ displayFormat: renderTotal()
16937
16855
  })), React__default.createElement(DataGrid.StateStoring, {
16938
16856
  enabled: true,
16939
16857
  type: "custom",