ods-component-lib 1.18.53 → 1.18.55

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,80 +16290,16 @@ 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,
16363
16296
  copy: outline.CopyIcon,
16364
16297
  discount: outline.DiscountIcon,
16365
16298
  kebabMenu: outline.KebabMenuIcon,
16366
- refresh: outline.RefreshIcon
16299
+ refresh: outline.RefreshIcon,
16300
+ unmap: outline.LinkBreakIcon,
16301
+ save: outline.FloppyDiskIcon,
16302
+ cancel: outline.Loop1Icon
16367
16303
  };
16368
16304
  var DynamicIcon = function DynamicIcon(_ref) {
16369
16305
  var iconName = _ref.iconName;
@@ -16386,20 +16322,13 @@ var OdsRemoteDataGrid = function OdsRemoteDataGrid(props) {
16386
16322
  var _useState = React.useState([]),
16387
16323
  data = _useState[0],
16388
16324
  setData = _useState[1];
16389
- var _useState2 = React.useState(false),
16390
- isLoading = _useState2[0],
16391
- setIsLoading = _useState2[1];
16392
16325
  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];
16326
+ var _useState2 = React.useState(0),
16327
+ filteredRowCount = _useState2[0],
16328
+ setFilteredRowCount = _useState2[1];
16329
+ var columns = React.useRef(props.columns);
16399
16330
  var gridRef = React.useRef(null);
16400
- var _useState5 = React.useState(false),
16401
- filterApplied = _useState5[0],
16402
- setFilterApplied = _useState5[1];
16331
+ var filterApplied = React.useRef(false);
16403
16332
  var onCancelEditEvent = new CustomEvent('cancelEdit', {
16404
16333
  bubbles: true,
16405
16334
  detail: {
@@ -16427,13 +16356,8 @@ var OdsRemoteDataGrid = function OdsRemoteDataGrid(props) {
16427
16356
  }
16428
16357
  }, [(_props$axiosRequest2 = props.axiosRequest) === null || _props$axiosRequest2 === void 0 ? void 0 : _props$axiosRequest2.requestData]);
16429
16358
  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) {
16359
+ if (columns.current !== undefined && columns.current.length > 0) {
16360
+ var newColumns = columns.current.map(function (colItem) {
16437
16361
  if (colItem.tooltip !== undefined && colItem.tooltip.enable) {
16438
16362
  var headerCellRenderr = function headerCellRenderr() {
16439
16363
  return React__default.createElement("div", null, React__default.createElement("span", null, colItem.caption), React__default.createElement(antd.Tooltip, {
@@ -16448,7 +16372,7 @@ var OdsRemoteDataGrid = function OdsRemoteDataGrid(props) {
16448
16372
  }
16449
16373
  return colItem;
16450
16374
  });
16451
- setColumns(newColumns);
16375
+ columns.current = newColumns;
16452
16376
  }
16453
16377
  }, [props.columns]);
16454
16378
  React.useEffect(function () {
@@ -16488,7 +16412,6 @@ var OdsRemoteDataGrid = function OdsRemoteDataGrid(props) {
16488
16412
  var fetchData = React.useCallback(function () {
16489
16413
  try {
16490
16414
  if (props.axiosRequest == undefined) return Promise.resolve();
16491
- setIsLoading(true);
16492
16415
  var _temp2 = function () {
16493
16416
  if (props.isServerSide) {
16494
16417
  var apiUrl = props.axiosRequest.environmentUrl + "" + props.axiosRequest.apiUrl;
@@ -16560,30 +16483,20 @@ var OdsRemoteDataGrid = function OdsRemoteDataGrid(props) {
16560
16483
  }, [props.isServerSide]);
16561
16484
  var getServerSide = React.useCallback(function (type) {
16562
16485
  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
- }();
16486
+ return Promise.resolve(function () {
16487
+ if (type === "reachedBottom") {
16488
+ return function () {
16489
+ if (totalPageCount <= loadedPageCount) {} else {
16490
+ loadedPageCount = loadedPageCount + 1;
16491
+ return Promise.resolve(fetchData()).then(function () {});
16573
16492
  }
16574
- }());
16575
- } catch (e) {
16576
- return Promise.reject(e);
16493
+ }();
16577
16494
  }
16578
- }, 5000, {
16579
- trailing: false
16580
- });
16581
- run(type);
16582
- return Promise.resolve();
16495
+ }());
16583
16496
  } catch (e) {
16584
16497
  return Promise.reject(e);
16585
16498
  }
16586
- }, [totalPageCount, loadedPageCount, fetchData]);
16499
+ }, [totalPageCount]);
16587
16500
  var onExporting = React.useCallback(function (e) {
16588
16501
  if (e.format === 'xlsx') {
16589
16502
  var workbook = new exceljs.Workbook();
@@ -16687,9 +16600,9 @@ var OdsRemoteDataGrid = function OdsRemoteDataGrid(props) {
16687
16600
  result = result + " - " + props.customSummary.summaryTotalPageCountLabel + " " + loadedPageCount + " / " + totalPageCount;
16688
16601
  }
16689
16602
  return result;
16690
- }, [data, filteredRowCount, loadedPageCount, props.pageSize, totalRecordCount, filterApplied]);
16603
+ }, [data, filteredRowCount, loadedPageCount, props.pageSize, totalRecordCount, filterApplied.current]);
16691
16604
  var concatFilteredLabel = function concatFilteredLabel(result, totalloaded) {
16692
- if (filteredRowCount > 0 && totalloaded !== filteredRowCount && filterApplied) {
16605
+ if (filteredRowCount > 0 && totalloaded !== filteredRowCount && filterApplied.current) {
16693
16606
  var filteredLabel = filteredRowCount + " " + props.customSummary.summaryFilteredDataLabel + "- ";
16694
16607
  result = filteredLabel + " " + result + " ";
16695
16608
  }
@@ -16739,10 +16652,13 @@ var OdsRemoteDataGrid = function OdsRemoteDataGrid(props) {
16739
16652
  var handleContentReady = function handleContentReady(e) {
16740
16653
  var dataGridInstance = e.component;
16741
16654
  var filteredDataCount = dataGridInstance.totalCount();
16742
- setFilteredRowCount(filteredDataCount);
16655
+ if (filterApplied.current && filteredDataCount > 0) setFilteredRowCount(filteredDataCount);
16743
16656
  };
16744
16657
  var onFilterValueChange = function onFilterValueChange(e) {
16745
- if (e !== null) setFilterApplied(true);else setFilterApplied(false);
16658
+ if (e !== null) filterApplied.current = true;else {
16659
+ filterApplied.current = false;
16660
+ setFilteredRowCount(0);
16661
+ }
16746
16662
  };
16747
16663
  return React__default.createElement(React__default.Fragment, null, React__default.createElement(DataGrid__default, {
16748
16664
  keyExpr: props.keyExpr,
@@ -16780,7 +16696,7 @@ var OdsRemoteDataGrid = function OdsRemoteDataGrid(props) {
16780
16696
  onEditCanceling: props.onEditCanceling,
16781
16697
  onContentReady: handleContentReady,
16782
16698
  onFilterValueChange: onFilterValueChange
16783
- }, columns.map(function (col) {
16699
+ }, columns.current.map(function (col) {
16784
16700
  return React__default.createElement(DataGrid.Column, Object.assign({
16785
16701
  key: col.dataField
16786
16702
  }, col, {
@@ -16807,8 +16723,21 @@ var OdsRemoteDataGrid = function OdsRemoteDataGrid(props) {
16807
16723
  caption: props.actionButtonGroupCaption,
16808
16724
  type: "buttons",
16809
16725
  showInColumnChooser: false
16810
- }, !props.edit && actionButtons.map(function (buttonItem) {
16726
+ }, !props.edit && actionButtons.map(function (buttonItem, index) {
16811
16727
  return React__default.createElement(DataGrid.Button, {
16728
+ key: "action-button-" + index,
16729
+ hint: buttonItem.hint,
16730
+ visible: buttonItem.visible,
16731
+ disabled: buttonItem.actionPermission == undefined ? false : !buttonItem.actionPermission,
16732
+ icon: server_browser.renderToString(React__default.createElement(DynamicIcon, {
16733
+ iconName: buttonItem.icon
16734
+ })),
16735
+ onClick: buttonItem.onClick
16736
+ });
16737
+ }), props.edit && actionButtons.map(function (buttonItem, index) {
16738
+ return React__default.createElement(DataGrid.Button, {
16739
+ key: "action-button-" + index,
16740
+ name: buttonItem.name,
16812
16741
  hint: buttonItem.hint,
16813
16742
  visible: buttonItem.visible,
16814
16743
  disabled: buttonItem.actionPermission == undefined ? false : !buttonItem.actionPermission,
@@ -16817,8 +16746,6 @@ var OdsRemoteDataGrid = function OdsRemoteDataGrid(props) {
16817
16746
  })),
16818
16747
  onClick: buttonItem.onClick
16819
16748
  });
16820
- }), props.edit && actionButtons.map(function (buttonItem) {
16821
- return React__default.createElement(DataGrid.Button, Object.assign({}, buttonItem));
16822
16749
  })), kebabMenuButtons.length > 0 && React__default.createElement(DataGrid.Column, {
16823
16750
  dataField: "Actionss",
16824
16751
  fixed: true,
@@ -16865,7 +16792,7 @@ var OdsRemoteDataGrid = function OdsRemoteDataGrid(props) {
16865
16792
  scrollByThumb: true,
16866
16793
  mode: "infinite"
16867
16794
  }), React__default.createElement(DataGrid.LoadPanel, {
16868
- enabled: isLoading,
16795
+ enabled: true,
16869
16796
  shadingColor: "rgba(0,0,0,0.4)"
16870
16797
  }), React__default.createElement(DataGrid.SearchPanel, {
16871
16798
  visible: true
@@ -16911,8 +16838,9 @@ var OdsRemoteDataGrid = function OdsRemoteDataGrid(props) {
16911
16838
  alignSelf: "stretch",
16912
16839
  margin: 0
16913
16840
  }
16914
- }, props.pageTitle)), props.toolbarButtonGroup && Array.isArray(props.toolbarButtonGroup) && props.toolbarButtonGroup.map(function (buttonGroupItem) {
16841
+ }, props.pageTitle)), props.toolbarButtonGroup && Array.isArray(props.toolbarButtonGroup) && props.toolbarButtonGroup.map(function (buttonGroupItem, index) {
16915
16842
  return React__default.createElement(DataGrid.Item, {
16843
+ key: "toolbar-button-" + index,
16916
16844
  location: "before"
16917
16845
  }, React__default.createElement(OdsButton, {
16918
16846
  style: {
@@ -16929,11 +16857,12 @@ var OdsRemoteDataGrid = function OdsRemoteDataGrid(props) {
16929
16857
  }), React__default.createElement(DataGrid.Item, {
16930
16858
  name: "exportButton",
16931
16859
  cssClass: 'toolbarPanelItems'
16932
- })), React__default.createElement(DataGrid.Summary, null, React__default.createElement(DataGrid.TotalItem, {
16933
- column: columns[0].dataField,
16860
+ })), React__default.createElement(DataGrid.Summary, {
16861
+ calculateCustomSummary: renderTotal
16862
+ }, React__default.createElement(DataGrid.TotalItem, {
16863
+ column: columns.current[0].dataField,
16934
16864
  summaryType: "custom",
16935
- displayFormat: "customizeText",
16936
- customizeText: renderTotal
16865
+ displayFormat: renderTotal()
16937
16866
  })), React__default.createElement(DataGrid.StateStoring, {
16938
16867
  enabled: true,
16939
16868
  type: "custom",