ods-component-lib 1.18.40 → 1.18.42

package/dist/index.modern.js

@@ -924,38 +924,79 @@ function OdsRate(props) {
 var _templateObject$e;
 var StyledSelect = styled(Select)(_templateObject$e || (_templateObject$e = _taggedTemplateLiteralLoose(["\n  width: 100%;\n"])));
 
-function OdsCustomMultiSelect(props) {
-  var _useState = useState(false),
-    open = _useState[0],
-    setOpen = _useState[1];
+var OdsMultiSelect = function OdsMultiSelect(props) {
+  var options = props.options,
+    selectAllEnabled = props.selectAllEnabled,
+    selectAllText = props.selectAllText,
+    closeButtonText = props.closeButtonText;
+  var _useState = useState([]),
+    value = _useState[0],
+    setValue = _useState[1];
+  var _useState2 = useState(false),
+    open = _useState2[0],
+    setOpen = _useState2[1];
+  var selectAllValue = "OdsMultiSelectOptionAll";
+  var newOptions = selectAllEnabled ? [{
+    value: selectAllValue,
+    label: selectAllText
+  }].concat(options) : options;
+  var handleChange = function handleChange(newValues) {
+    if (newValues && newValues.length && newValues.includes(selectAllValue)) {
+      if (newValues.length === options.length + 1) {
+        setValue([]);
+        return;
+      }
+      setValue(options.map(function (item) {
+        return item.value;
+      }));
+      return;
+    }
+    setValue(newValues);
+    return;
+  };
+  var dropdownRender = function dropdownRender(menu) {
+    return React.createElement(React.Fragment, null, menu, React.createElement(OdsDivider, {
+      style: {
+        margin: "8px 0"
+      }
+    }), React.createElement(Space, {
+      style: {
+        padding: "0 8px 4px"
+      }
+    }, React.createElement(OdsButton, {
+      style: {
+        width: "100%"
+      },
+      type: "primary",
+      onClick: function onClick() {
+        return setOpen(false);
+      }
+    }, closeButtonText != null ? closeButtonText : "Close")));
+  };
+  var optionRender = function optionRender(option, __info) {
+    return React.createElement("div", null, option.data.label, option.data.value == selectAllValue ? React.createElement(OdsDivider, {
+      style: {
+        margin: "8px 0px 0px 0px"
+      }
+    }) : "");
+  };
   return React.createElement(React.Fragment, null, React.createElement(ThemeProvider, {
     theme: lightTheme
-  }, React.createElement(StyledSelect, Object.assign({}, props, {
+  }, React.createElement(StyledSelect, Object.assign({
+    mode: "multiple",
+    allowClear: true,
+    value: value,
     open: open,
+    onChange: handleChange,
+    optionRender: optionRender,
+    dropdownRender: dropdownRender,
     onDropdownVisibleChange: function onDropdownVisibleChange(visible) {
       return setOpen(visible);
-    },
-    dropdownRender: function dropdownRender(menu) {
-      return React.createElement(React.Fragment, null, menu, React.createElement(OdsDivider, {
-        style: {
-          margin: '8px 0'
-        }
-      }), React.createElement(Space, {
-        style: {
-          padding: '0 8px 4px'
-        }
-      }, React.createElement(OdsButton, {
-        style: {
-          width: "100%"
-        },
-        type: "primary",
-        onClick: function onClick() {
-          return setOpen(false);
-        }
-      }, props.buttonLabel)));
     }
+  }, props, {
+    options: newOptions
   }))));
-}
+};
 
 function OdsSelect(props) {
   return React.createElement(React.Fragment, null, React.createElement(ThemeProvider, {
@@ -1532,57 +1573,7 @@ function grid(props) {
 }
 
 var DxTreeList = function DxTreeList(props) {
-  var _useState = useState(props.dataSource),
-    dataSource = _useState[0];
-  var renderReadButtons = function renderReadButtons(data) {
-    return React.createElement("div", null, React.createElement(OdsSwitch, {
-      onChange: function onChange(checked) {
-        return onchangeRead(checked, data);
-      },
-      checked: data.ReadPermission
-    }));
-  };
-  var renderModifyButtons = function renderModifyButtons(data) {
-    return React.createElement("div", null, React.createElement(OdsSwitch, {
-      onChange: function onChange(checked) {
-        return onchangeModify(checked, data);
-      },
-      checked: data.ModifyPermission
-    }));
-  };
-  var onchangeModify = function onchangeModify(checked, data) {
-    data.ModifyPermission = checked;
-    props.onDataChange(dataSource);
-  };
-  var onchangeRead = function onchangeRead(checked, data) {
-    data.ReadPermission = checked;
-    props.onDataChange(dataSource);
-  };
-  return React.createElement(React.Fragment, null, React.createElement(TreeList, {
-    id: "Id",
-    dataSource: dataSource,
-    showRowLines: true,
-    showBorders: true,
-    columnAutoWidth: true,
-    itemsExpr: props.itemsExpr,
-    wordWrapEnabled: true,
-    dataStructure: "tree"
-  }, React.createElement(Column, {
-    dataField: "Name",
-    caption: "Name"
-  }), React.createElement(Column, {
-    caption: "Read",
-    cellRender: function cellRender(_ref) {
-      var data = _ref.data;
-      return renderReadButtons(data);
-    }
-  }), React.createElement(Column, {
-    caption: "Modify",
-    cellRender: function cellRender(_ref2) {
-      var data = _ref2.data;
-      return renderModifyButtons(data);
-    }
-  })));
+  return React.createElement(React.Fragment, null, React.createElement(TreeList, Object.assign({}, props), props.children));
 };
 
 var DxTreeView = function DxTreeView(props) {
@@ -16459,7 +16450,8 @@ var OdsRemoteDataGrid = function OdsRemoteDataGrid(props) {
     setIsLoading = _useState2[1];
   var fileName = props.exportFileName ? props.exportFileName + moment().format("YYYYMMDD") : "DatagridExportFile" + moment().format("YYYYMMDD");
   var _useState3 = useState(0),
-    filteredRowCount = _useState3[0];
+    filteredRowCount = _useState3[0],
+    setFilteredRowCount = _useState3[1];
   var _useState4 = useState(props.columns),
     columns = _useState4[0],
     setColumns = _useState4[1];
@@ -16733,19 +16725,22 @@ var OdsRemoteDataGrid = function OdsRemoteDataGrid(props) {
     }
   }, []);
   var renderTotal = useCallback(function () {
+    var result = "";
     var totalloaded = 0;
     if (data.length < 50 || !props.isServerSide || loadedPageCount == totalPageCount) {
       totalloaded = data.length;
     } else {
       totalloaded = loadedPageCount * props.pageSize;
     }
-    var result = "";
-    if (filteredRowCount > 0) {
-      result = "" + totalloaded + props.customSummary.summaryFilteredDataLabel + (totalRecordCount > 0 ? totalloaded + " " + props.customSummary.summaryLoadedDataLabel + ("- " + totalRecordCount) + props.customSummary.summaryTotalDataLabel : " ");
-    } else if (!props.isServerSide && totalloaded > 0) {
-      result = totalloaded + " " + props.customSummary.summaryLoadedDataLabel + ("- " + totalloaded) + props.customSummary.summaryTotalDataLabel;
-    } else {
+    if (props.isServerSide) {
       result = totalRecordCount > 0 ? totalloaded + " " + props.customSummary.summaryLoadedDataLabel + ("- " + totalRecordCount) + props.customSummary.summaryTotalDataLabel : "";
+      if (filteredRowCount > 0 && totalloaded !== filteredRowCount) {
+        var filteredLabel = filteredRowCount + " " + props.customSummary.summaryFilteredDataLabel + "- ";
+        result = filteredLabel + " " + result;
+      }
+    }
+    if (props.customSummary.summaryTotalCount !== undefined && !props.isServerSide) {
+      result = props.customSummary.summaryTotalDataLabel + " : " + props.customSummary.summaryTotalCount;
     }
     return result;
   }, [data, filteredRowCount, loadedPageCount, props.pageSize, totalRecordCount]);
@@ -16803,6 +16798,11 @@ var OdsRemoteDataGrid = function OdsRemoteDataGrid(props) {
       });
     };
   }, [data.length]);
+  var handleContentReady = function handleContentReady(e) {
+    var dataGridInstance = e.component;
+    var filteredDataCount = dataGridInstance.totalCount();
+    setFilteredRowCount(filteredDataCount);
+  };
   return React.createElement(React.Fragment, null, React.createElement(DataGrid$1, {
     keyExpr: props.keyExpr,
     dataSource: data,
@@ -16836,7 +16836,8 @@ var OdsRemoteDataGrid = function OdsRemoteDataGrid(props) {
     noDataText: props.noDataText,
     onSaved: props.onSaved,
     onSaving: props.onSaving,
-    onEditCanceling: props.onEditCanceling
+    onEditCanceling: props.onEditCanceling,
+    onContentReady: handleContentReady
   }, columns.map(function (col) {
     return React.createElement(Column, Object.assign({
       key: col.dataField
@@ -17004,5 +17005,5 @@ var OdsRemoteDataGrid = function OdsRemoteDataGrid(props) {
   })));
 };
 
-export { DxTreeList, DxTreeView, OdsAlert, OdsAutoComplete, OdsBannerAlert, OdsBasicTable, OdsButton, OdsCalendar, OdsCard, OdsCheckbox, OdsCheckboxGroup, OdsCollapse, OdsCustomMultiSelect, OdsDataGrid, OdsDateRangePicker, OdsDatepicker, OdsDisplayGrid, OdsDivider, OdsCollapse as OdsDropdown, OdsDropdownButton, OdsImage, OdsInput, OdsInputNumber, OdsLink, OdsList, OdsModal, OdsNotification, OdsParagraph, OdsPassword, OdsPhoneInput, OdsRadio, OdsRadioGroup, OdsRangeTimepicker, OdsRate, OdsRemoteDataGrid, OdsSearch, OdsSelect, OdsSelectableTable, OdsSpin, OdsSwitch, OdsTab, OdsBasicTable as OdsTable, OdsTag, OdsText, OdsTextArea, OdsTimeline, OdsTimepicker, OdsTitle };
+export { DxTreeList, DxTreeView, OdsAlert, OdsAutoComplete, OdsBannerAlert, OdsBasicTable, OdsButton, OdsCalendar, OdsCard, OdsCheckbox, OdsCheckboxGroup, OdsCollapse, OdsDataGrid, OdsDateRangePicker, OdsDatepicker, OdsDisplayGrid, OdsDivider, OdsCollapse as OdsDropdown, OdsDropdownButton, OdsImage, OdsInput, OdsInputNumber, OdsLink, OdsList, OdsModal, OdsMultiSelect, OdsNotification, OdsParagraph, OdsPassword, OdsPhoneInput, OdsRadio, OdsRadioGroup, OdsRangeTimepicker, OdsRate, OdsRemoteDataGrid, OdsSearch, OdsSelect, OdsSelectableTable, OdsSpin, OdsSwitch, OdsTab, OdsBasicTable as OdsTable, OdsTag, OdsText, OdsTextArea, OdsTimeline, OdsTimepicker, OdsTitle };
 //# sourceMappingURL=index.modern.js.map