ods-component-lib 1.18.165 → 1.18.166

package/dist/index.modern.js

@@ -33683,6 +33683,7 @@ var OdsBasicDataGrid = function OdsBasicDataGrid(props) {
       key: col.dataField
     }, col, {
       minWidth: 50,
+      width: 160,
       cssClass: col.cssClass + " " + (hasFastUpdate ? "grid-cell-disable-text-selection" : "")
     }), col.lookUp && React.createElement(Lookup, Object.assign({}, col.lookUp)), (col.dataField === "IsActive" || col.dataField === "isActive") && React.createElement(HeaderFilter, {
       dataSource: [{
@@ -34503,6 +34504,11 @@ var OdsServerSideDatagrid = function OdsServerSideDatagrid(props) {
     var currentPageIndex = dataGridInstance.pageCount();
     var currentTotalCount = currentPageIndex == 0 ? 50 : dataGridInstance.totalCount();
     var newData = dataGridInstance === null || dataGridInstance === void 0 ? void 0 : (_dataGridInstance$get = dataGridInstance.getDataSource()) === null || _dataGridInstance$get === void 0 ? void 0 : _dataGridInstance$get.items();
+    if (filterApplied) {
+      totalFilteredCount.current = currentTotalCount;
+    } else {
+      totalUnfilteredCount.current = currentTotalCount;
+    }
     if ((!filterApplied && currentPageIndex == 1 && currentTotalCount != totalUnfilteredCount.current || lastPageIndexRef.current !== currentPageIndex) && newData && newData.length > 0) {
       setCurrentPage(currentPageIndex);
       setCurrentPageSize(dataGridInstance.pageSize());
@@ -34512,16 +34518,6 @@ var OdsServerSideDatagrid = function OdsServerSideDatagrid(props) {
       });
       lastPageIndexRef.current = currentPageIndex;
     }
-    if (currentTotalCount > 0) {
-      if (filterApplied) {
-        totalFilteredCount.current = currentTotalCount;
-      } else {
-        totalUnfilteredCount.current = currentTotalCount;
-      }
-      if (!filterApplied && totalFilteredCount.current === 0) {
-        totalFilteredCount.current = totalUnfilteredCount.current;
-      }
-    }
   }, [props.columns, filterApplied]);
   var handleOptionChanged = useCallback(function (e) {
     var dataGrid = props.dataGridRef.current.instance;
@@ -34742,7 +34738,8 @@ var OdsServerSideDatagrid = function OdsServerSideDatagrid(props) {
     return React.createElement(Column, Object.assign({
       key: col.dataField
     }, col, {
-      minWidth: 10
+      minWidth: 10,
+      width: 160
     }), col.lookUp && React.createElement(Lookup, Object.assign({}, col.lookUp)), col.dataField === "IsActive" && React.createElement(HeaderFilter, {
       dataSource: [{
         text: "Active",
@@ -34905,17 +34902,17 @@ var useOnContentReadyHandler = function useOnContentReadyHandler(columns, lastPa
     var currentPageIndex = dataGridInstance.pageIndex();
     var currentTotalCount = dataGridInstance.totalCount();
     var newData = dataGridInstance === null || dataGridInstance === void 0 ? void 0 : (_dataGridInstance$get = dataGridInstance.getDataSource()) === null || _dataGridInstance$get === void 0 ? void 0 : _dataGridInstance$get.items();
+    if (filterApplied) {
+      totalFilteredCount.current = currentTotalCount;
+    } else {
+      totalUnfilteredCount.current = currentTotalCount;
+    }
+    if (!filterApplied && totalFilteredCount.current === 0) {
+      totalFilteredCount.current = totalUnfilteredCount.current;
+    }
     if (lastPageIndexRef.current !== currentPageIndex && newData && newData.length > 0) {
       setCurrentPage(currentPageIndex);
       setCurrentPageSize(dataGridInstance.pageSize());
-      if (filterApplied) {
-        totalFilteredCount.current = currentTotalCount;
-      } else {
-        totalUnfilteredCount.current = currentTotalCount;
-      }
-      if (!filterApplied && totalFilteredCount.current === 0) {
-        totalFilteredCount.current = totalUnfilteredCount.current;
-      }
       setUpdateTrigger(function (prev) {
         return !prev;
       });
@@ -35163,7 +35160,8 @@ var OdsInlineEditDataGrid = function OdsInlineEditDataGrid(props) {
       return React.createElement(Column, Object.assign({
         key: col.dataField
       }, col, {
-        minWidth: 10
+        minWidth: 10,
+        width: 160
       }), col.lookup && React.createElement(Lookup$1, Object.assign({}, col.lookup)), col.headerFilter && React.createElement(HeaderFilter, Object.assign({}, col.headerFilter, {
         visible: true,
         allowSearch: true
@@ -35255,6 +35253,193 @@ var OdsInlineEditDataGrid = function OdsInlineEditDataGrid(props) {
   }, React.createElement("p", null, renderTotal())));
 };
 
+var useOnActionCellRenderHandler$1 = function useOnActionCellRenderHandler(visibleActionButtons, actionButtonGroup, edit, actionButtonsTooltipType) {
+  var onActionCellRender = useCallback(function (cellData) {
+    if (!cellData || !visibleActionButtons) return null;
+    var kebabMenuButtons = actionButtonGroup && actionButtonGroup.length >= 2 && !edit ? actionButtonGroup.slice(2).map(function (button) {
+      return {
+        icon: button.icon,
+        onClick: function onClick(event) {
+          var customEvent = {
+            column: cellData.column,
+            component: cellData.component,
+            element: cellData.element,
+            event: event,
+            model: cellData.data,
+            row: cellData.row
+          };
+          button.onClick(customEvent);
+        }
+      };
+    }) : [];
+    var buttonElements = visibleActionButtons.map(function (buttonItem) {
+      var isVisible = typeof buttonItem.visible === "function" ? buttonItem.visible({
+        column: cellData.column,
+        component: cellData.component,
+        row: cellData.row
+      }) : buttonItem.visible;
+      return React.createElement(OdsDataGrdiRowButton, Object.assign({
+        key: "action-button-" + buttonItem.name,
+        name: buttonItem.name,
+        hint: buttonItem.hint,
+        visible: isVisible,
+        size: "small",
+        type: "text",
+        disabled: buttonItem.actionPermission === undefined ? false : !buttonItem.actionPermission,
+        icon: buttonItem.icon
+      }, actionButtonsTooltipType === "styled" && {
+        tooltip: buttonItem.hint
+      }, {
+        onClick: function onClick(event) {
+          if (buttonItem.onClick) {
+            var customEvent = {
+              column: cellData.column,
+              component: cellData.component,
+              element: cellData.element,
+              event: event,
+              model: cellData.data,
+              row: cellData.row
+            };
+            buttonItem.onClick(customEvent);
+          }
+        }
+      }));
+    });
+    if (kebabMenuButtons.length > 0) {
+      buttonElements.push(React.createElement(OdsDropdown, {
+        key: "dropdown-" + (cellData.rowIndex || cellData.data.ID),
+        menuItems: kebabMenuButtons
+      }, React.createElement(OdsDataGrdiRowButton, {
+        type: "text",
+        icon: React.createElement(DynamicIcon, {
+          iconName: "kebabMenu"
+        })
+      })));
+    }
+    return React.createElement(React.Fragment, null, buttonElements);
+  }, [visibleActionButtons]);
+  return onActionCellRender;
+};
+
+var useOnExportingHandler$1 = function useOnExportingHandler(exportProps, getSummary, callback) {
+  var onExporting = useCallback(function (e) {
+    if (exportProps) {
+      var _exportProps$fileName, _exportProps$activeTe, _exportProps$passiveT;
+      ExportDataGridToExcel({
+        gridComponent: e.component,
+        baseFileName: (_exportProps$fileName = exportProps.fileName) != null ? _exportProps$fileName : "DataGrid",
+        selectedText: exportProps.selectedText,
+        getSummary: getSummary,
+        selectedRowsOnly: e.selectedRowsOnly,
+        activeText: (_exportProps$activeTe = exportProps.activeText) != null ? _exportProps$activeTe : "Active",
+        passiveText: (_exportProps$passiveT = exportProps.passiveText) != null ? _exportProps$passiveT : "Passive"
+      });
+    }
+    if (callback) {
+      callback(e);
+    }
+  }, [getSummary]);
+  return onExporting;
+};
+
+var MasterDetailDataGrid = function MasterDetailDataGrid(_ref) {
+  var columns = _ref.columns,
+    dataSource = _ref.dataSource,
+    _ref$masterDetailFeat = _ref.masterDetailFeatures,
+    masterDetailFeatures = _ref$masterDetailFeat === void 0 ? {} : _ref$masterDetailFeat,
+    masterDetailData = _ref.masterDetailData;
+  var visibleActionButtons = useMemo(function () {
+    if (masterDetailFeatures.masterActionButtonGroup && masterDetailFeatures.masterActionButtonGroup.length >= 2) {
+      return masterDetailFeatures.masterActionButtonGroup.slice(0, 2);
+    }
+    return masterDetailFeatures.masterActionButtonGroup || [];
+  }, [masterDetailFeatures.masterActionButtonGroup]);
+  var onActionCellRender = useOnActionCellRenderHandler$1(visibleActionButtons, masterDetailFeatures.masterActionButtonGroup);
+  var getTotalDataCount = function getTotalDataCount() {
+    return "" + dataSource.length;
+  };
+  var handleExporting = useOnExportingHandler$1(masterDetailFeatures.exportProps, getTotalDataCount);
+  var effectiveColumns = (masterDetailData === null || masterDetailData === void 0 ? void 0 : masterDetailData.detailGridColumns) || columns || (dataSource[0] ? Object.keys(dataSource[0]).map(function (key) {
+    return {
+      dataField: key,
+      caption: key.charAt(0).toUpperCase() + key.slice(1),
+      allowFiltering: true
+    };
+  }) : []);
+  return React.createElement(DataGrid$1, {
+    style: {
+      maxHeight: masterDetailFeatures.maxHeight ? masterDetailFeatures.maxHeight + "px" : "400px",
+      overflow: "auto"
+    },
+    dataSource: dataSource,
+    showBorders: true,
+    columnAutoWidth: true,
+    allowColumnReordering: true,
+    selection: {
+      mode: masterDetailFeatures.showCheckbox ? "multiple" : "none"
+    },
+    paging: {
+      enabled: true,
+      pageSize: masterDetailFeatures.pageSize || 20
+    },
+    filterRow: {
+      visible: masterDetailFeatures.createFilter
+    },
+    onExporting: handleExporting,
+    onToolbarPreparing: masterDetailFeatures.detailToolbar
+  }, effectiveColumns.map(function (col) {
+    return React.createElement(Column, Object.assign({
+      key: col.dataField
+    }, col, {
+      headerFilter: {
+        visible: col.allowFiltering
+      }
+    }));
+  }), React.createElement(ColumnChooser, {
+    enabled: masterDetailFeatures.columnChooser,
+    mode: "select"
+  }, React.createElement(Position, {
+    my: "right top",
+    at: "right bottom",
+    of: document.querySelector("." + "props.dataGridPageName") ? "." + "props.dataGridPageName" + " .dx-datagrid-column-chooser-button" : ".dx-datagrid-column-chooser-button"
+  }), React.createElement(ColumnChooserSearch, {
+    enabled: true,
+    editorOptions: {
+      placeholder: ""
+    }
+  }), React.createElement(HeaderFilter, {
+    visible: true
+  }), React.createElement(ColumnChooserSelection, {
+    allowSelectAll: true,
+    selectByClick: true,
+    recursive: true
+  })), (masterDetailFeatures === null || masterDetailFeatures === void 0 ? void 0 : masterDetailFeatures.exportEnabled) && React.createElement(Export, Object.assign({}, masterDetailFeatures.exportProps)), masterDetailFeatures.actionColumnEnable && React.createElement(Column, {
+    dataField: "Actions",
+    caption: "",
+    minWidth: 10,
+    width: 160,
+    fixed: true,
+    allowSorting: false,
+    type: "buttons",
+    showInColumnChooser: false,
+    cellRender: onActionCellRender
+  }), React.createElement(FilterRow, {
+    visible: masterDetailFeatures.createFilter
+  }), React.createElement(Selection, {
+    mode: masterDetailFeatures.showCheckbox ? "multiple" : "none"
+  }), React.createElement(SearchPanel, {
+    visible: masterDetailFeatures.showSearchPanel
+  }), React.createElement(Toolbar, null, React.createElement(Item$1, {
+    name: "searchPanel"
+  }), React.createElement(Item$1, {
+    name: "columnChooserButton",
+    cssClass: "toolbarPanelItems"
+  }), React.createElement(Item$1, {
+    name: "exportButton",
+    cssClass: "toolbarPanelItems"
+  })));
+};
+
 /**
  * Checks if `value` is the
  * [language type](http://www.ecma-international.org/ecma-262/7.0/#sec-ecmascript-language-types)
@@ -36903,5 +37088,5 @@ var OdsRemoteDataGrid = function OdsRemoteDataGrid(props) {
   })));
 };
 
-export { DxTreeList, OdsAlert, OdsAutoComplete, OdsBadge, OdsBadgeRibbon, OdsBannerAlert, OdsBasicDataGrid, OdsBasicTable, OdsButton, OdsCalendar, OdsCard, OdsCheckbox, OdsCheckboxGroup, OdsCollapse, OdsDataGrid, OdsDateRangePicker, OdsDatepicker, OdsDisplayGrid, OdsDivider, OdsDropdown, OdsDropdownButton, OdsFileUpload, OdsFilter, OdsFilterTagView, OdsImage, OdsInlineEditDataGrid, OdsInput, OdsInputNumber, OdsLink, OdsList, OdsModal, OdsModalOld, OdsMultiSelect, OdsNotification, OdsParagraph, OdsPassword, OdsPhoneInput, OdsRadio, OdsRadioGroup, OdsRangeTimepicker, OdsRate, OdsRemoteDataGrid, OdsSearch, OdsSelect, OdsSelectableTable, OdsServerSideDatagrid, OdsSpin, OdsSwitch, OdsTab, OdsBasicTable as OdsTable, OdsTag, OdsText, OdsTextArea, OdsTimeline, OdsTimepicker, OdsTitle, OdsTransfer };
+export { DxTreeList, OdsAlert, OdsAutoComplete, OdsBadge, OdsBadgeRibbon, OdsBannerAlert, OdsBasicDataGrid, OdsBasicTable, OdsButton, OdsCalendar, OdsCard, OdsCheckbox, OdsCheckboxGroup, OdsCollapse, OdsDataGrid, OdsDateRangePicker, OdsDatepicker, OdsDisplayGrid, OdsDivider, OdsDropdown, OdsDropdownButton, OdsFileUpload, OdsFilter, OdsFilterTagView, OdsImage, OdsInlineEditDataGrid, OdsInput, OdsInputNumber, OdsLink, OdsList, MasterDetailDataGrid as OdsMasterDetailDataGrid, OdsModal, OdsModalOld, OdsMultiSelect, OdsNotification, OdsParagraph, OdsPassword, OdsPhoneInput, OdsRadio, OdsRadioGroup, OdsRangeTimepicker, OdsRate, OdsRemoteDataGrid, OdsSearch, OdsSelect, OdsSelectableTable, OdsServerSideDatagrid, OdsSpin, OdsSwitch, OdsTab, OdsBasicTable as OdsTable, OdsTag, OdsText, OdsTextArea, OdsTimeline, OdsTimepicker, OdsTitle, OdsTransfer };
 //# sourceMappingURL=index.modern.js.map