ods-component-lib 1.18.41 → 1.18.43

package/dist/index.modern.js

@@ -18,7 +18,6 @@ import { saveAs } from 'file-saver-es';
 import moment from 'moment';
 import { GridIcon, EditIcon, Trash1Icon, CopyIcon, DiscountIcon, KebabMenuIcon, RefreshIcon } from 'ods-icon/react/24/outline';
 import { TreeList, DropDownButton, Lookup } from 'devextreme-react';
-import { TreeView } from 'devextreme-react/tree-view';
 
 function _extends() {
   _extends = Object.assign ? Object.assign.bind() : function (target) {
@@ -1119,14 +1118,16 @@ var dayjs_min = createCommonjsModule(function (module, exports) {
 !function(t,e){module.exports=e();}(commonjsGlobal,(function(){var t=1e3,e=6e4,n=36e5,r="millisecond",i="second",s="minute",u="hour",a="day",o="week",c="month",f="quarter",h="year",d="date",l="Invalid Date",$=/^(\d{4})[-/]?(\d{1,2})?[-/]?(\d{0,2})[Tt\s]*(\d{1,2})?:?(\d{1,2})?:?(\d{1,2})?[.:]?(\d+)?$/,y=/\[([^\]]+)]|Y{1,4}|M{1,4}|D{1,2}|d{1,4}|H{1,2}|h{1,2}|a|A|m{1,2}|s{1,2}|Z{1,2}|SSS/g,M={name:"en",weekdays:"Sunday_Monday_Tuesday_Wednesday_Thursday_Friday_Saturday".split("_"),months:"January_February_March_April_May_June_July_August_September_October_November_December".split("_"),ordinal:function(t){var e=["th","st","nd","rd"],n=t%100;return "["+t+(e[(n-20)%10]||e[n]||e[0])+"]"}},m=function(t,e,n){var r=String(t);return !r||r.length>=e?t:""+Array(e+1-r.length).join(n)+t},v={s:m,z:function(t){var e=-t.utcOffset(),n=Math.abs(e),r=Math.floor(n/60),i=n%60;return (e<=0?"+":"-")+m(r,2,"0")+":"+m(i,2,"0")},m:function t(e,n){if(e.date()<n.date())return -t(n,e);var r=12*(n.year()-e.year())+(n.month()-e.month()),i=e.clone().add(r,c),s=n-i<0,u=e.clone().add(r+(s?-1:1),c);return +(-(r+(n-i)/(s?i-u:u-i))||0)},a:function(t){return t<0?Math.ceil(t)||0:Math.floor(t)},p:function(t){return {M:c,y:h,w:o,d:a,D:d,h:u,m:s,s:i,ms:r,Q:f}[t]||String(t||"").toLowerCase().replace(/s$/,"")},u:function(t){return void 0===t}},g="en",D={};D[g]=M;var p="$isDayjsObject",S=function(t){return t instanceof _||!(!t||!t[p])},w=function t(e,n,r){var i;if(!e)return g;if("string"==typeof e){var s=e.toLowerCase();D[s]&&(i=s),n&&(D[s]=n,i=s);var u=e.split("-");if(!i&&u.length>1)return t(u[0])}else {var a=e.name;D[a]=e,i=a;}return !r&&i&&(g=i),i||!r&&g},O=function(t,e){if(S(t))return t.clone();var n="object"==typeof e?e:{};return n.date=t,n.args=arguments,new _(n)},b=v;b.l=w,b.i=S,b.w=function(t,e){return O(t,{locale:e.$L,utc:e.$u,x:e.$x,$offset:e.$offset})};var _=function(){function M(t){this.$L=w(t.locale,null,!0),this.parse(t),this.$x=this.$x||t.x||{},this[p]=!0;}var m=M.prototype;return m.parse=function(t){this.$d=function(t){var e=t.date,n=t.utc;if(null===e)return new Date(NaN);if(b.u(e))return new Date;if(e instanceof Date)return new Date(e);if("string"==typeof e&&!/Z$/i.test(e)){var r=e.match($);if(r){var i=r[2]-1||0,s=(r[7]||"0").substring(0,3);return n?new Date(Date.UTC(r[1],i,r[3]||1,r[4]||0,r[5]||0,r[6]||0,s)):new Date(r[1],i,r[3]||1,r[4]||0,r[5]||0,r[6]||0,s)}}return new Date(e)}(t),this.init();},m.init=function(){var t=this.$d;this.$y=t.getFullYear(),this.$M=t.getMonth(),this.$D=t.getDate(),this.$W=t.getDay(),this.$H=t.getHours(),this.$m=t.getMinutes(),this.$s=t.getSeconds(),this.$ms=t.getMilliseconds();},m.$utils=function(){return b},m.isValid=function(){return !(this.$d.toString()===l)},m.isSame=function(t,e){var n=O(t);return this.startOf(e)<=n&&n<=this.endOf(e)},m.isAfter=function(t,e){return O(t)<this.startOf(e)},m.isBefore=function(t,e){return this.endOf(e)<O(t)},m.$g=function(t,e,n){return b.u(t)?this[e]:this.set(n,t)},m.unix=function(){return Math.floor(this.valueOf()/1e3)},m.valueOf=function(){return this.$d.getTime()},m.startOf=function(t,e){var n=this,r=!!b.u(e)||e,f=b.p(t),l=function(t,e){var i=b.w(n.$u?Date.UTC(n.$y,e,t):new Date(n.$y,e,t),n);return r?i:i.endOf(a)},$=function(t,e){return b.w(n.toDate()[t].apply(n.toDate("s"),(r?[0,0,0,0]:[23,59,59,999]).slice(e)),n)},y=this.$W,M=this.$M,m=this.$D,v="set"+(this.$u?"UTC":"");switch(f){case h:return r?l(1,0):l(31,11);case c:return r?l(1,M):l(0,M+1);case o:var g=this.$locale().weekStart||0,D=(y<g?y+7:y)-g;return l(r?m-D:m+(6-D),M);case a:case d:return $(v+"Hours",0);case u:return $(v+"Minutes",1);case s:return $(v+"Seconds",2);case i:return $(v+"Milliseconds",3);default:return this.clone()}},m.endOf=function(t){return this.startOf(t,!1)},m.$set=function(t,e){var n,o=b.p(t),f="set"+(this.$u?"UTC":""),l=(n={},n[a]=f+"Date",n[d]=f+"Date",n[c]=f+"Month",n[h]=f+"FullYear",n[u]=f+"Hours",n[s]=f+"Minutes",n[i]=f+"Seconds",n[r]=f+"Milliseconds",n)[o],$=o===a?this.$D+(e-this.$W):e;if(o===c||o===h){var y=this.clone().set(d,1);y.$d[l]($),y.init(),this.$d=y.set(d,Math.min(this.$D,y.daysInMonth())).$d;}else l&&this.$d[l]($);return this.init(),this},m.set=function(t,e){return this.clone().$set(t,e)},m.get=function(t){return this[b.p(t)]()},m.add=function(r,f){var d,l=this;r=Number(r);var $=b.p(f),y=function(t){var e=O(l);return b.w(e.date(e.date()+Math.round(t*r)),l)};if($===c)return this.set(c,this.$M+r);if($===h)return this.set(h,this.$y+r);if($===a)return y(1);if($===o)return y(7);var M=(d={},d[s]=e,d[u]=n,d[i]=t,d)[$]||1,m=this.$d.getTime()+r*M;return b.w(m,this)},m.subtract=function(t,e){return this.add(-1*t,e)},m.format=function(t){var e=this,n=this.$locale();if(!this.isValid())return n.invalidDate||l;var r=t||"YYYY-MM-DDTHH:mm:ssZ",i=b.z(this),s=this.$H,u=this.$m,a=this.$M,o=n.weekdays,c=n.months,f=n.meridiem,h=function(t,n,i,s){return t&&(t[n]||t(e,r))||i[n].slice(0,s)},d=function(t){return b.s(s%12||12,t,"0")},$=f||function(t,e,n){var r=t<12?"AM":"PM";return n?r.toLowerCase():r};return r.replace(y,(function(t,r){return r||function(t){switch(t){case"YY":return String(e.$y).slice(-2);case"YYYY":return b.s(e.$y,4,"0");case"M":return a+1;case"MM":return b.s(a+1,2,"0");case"MMM":return h(n.monthsShort,a,c,3);case"MMMM":return h(c,a);case"D":return e.$D;case"DD":return b.s(e.$D,2,"0");case"d":return String(e.$W);case"dd":return h(n.weekdaysMin,e.$W,o,2);case"ddd":return h(n.weekdaysShort,e.$W,o,3);case"dddd":return o[e.$W];case"H":return String(s);case"HH":return b.s(s,2,"0");case"h":return d(1);case"hh":return d(2);case"a":return $(s,u,!0);case"A":return $(s,u,!1);case"m":return String(u);case"mm":return b.s(u,2,"0");case"s":return String(e.$s);case"ss":return b.s(e.$s,2,"0");case"SSS":return b.s(e.$ms,3,"0");case"Z":return i}return null}(t)||i.replace(":","")}))},m.utcOffset=function(){return 15*-Math.round(this.$d.getTimezoneOffset()/15)},m.diff=function(r,d,l){var $,y=this,M=b.p(d),m=O(r),v=(m.utcOffset()-this.utcOffset())*e,g=this-m,D=function(){return b.m(y,m)};switch(M){case h:$=D()/12;break;case c:$=D();break;case f:$=D()/3;break;case o:$=(g-v)/6048e5;break;case a:$=(g-v)/864e5;break;case u:$=g/n;break;case s:$=g/e;break;case i:$=g/t;break;default:$=g;}return l?$:b.a($)},m.daysInMonth=function(){return this.endOf(c).$D},m.$locale=function(){return D[this.$L]},m.locale=function(t,e){if(!t)return this.$L;var n=this.clone(),r=w(t,e,!0);return r&&(n.$L=r),n},m.clone=function(){return b.w(this.$d,this)},m.toDate=function(){return new Date(this.valueOf())},m.toJSON=function(){return this.isValid()?this.toISOString():null},m.toISOString=function(){return this.$d.toISOString()},m.toString=function(){return this.$d.toUTCString()},M}(),k=_.prototype;return O.prototype=k,[["$ms",r],["$s",i],["$m",s],["$H",u],["$W",a],["$M",c],["$y",h],["$D",d]].forEach((function(t){k[t[1]]=function(e){return this.$g(e,t[0],t[1])};})),O.extend=function(t,e){return t.$i||(t(e,_,O),t.$i=!0),O},O.locale=w,O.isDayjs=S,O.unix=function(t){return O(1e3*t)},O.en=D[g],O.Ls=D,O.p={},O}));
 });
 
+var format = "HH:mm";
 function StyledOdsTimepicker(props) {
-  var format = "HH:mm";
   return React.createElement(React.Fragment, null, React.createElement(StyledTimepicker, Object.assign({}, props, {
     defaultValue: dayjs_min("00:00", format)
   })));
 }
 var OdsTimepicker = function OdsTimepicker(props) {
-  return React.createElement(StyledOdsTimepicker, Object.assign({}, props));
+  return React.createElement(StyledOdsTimepicker, Object.assign({}, props, {
+    defaultValue: dayjs_min("00:00", format)
+  }));
 };
 
 var _templateObject$m;
@@ -1573,75 +1574,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);
-    }
-  })));
-};
-
-var DxTreeView = function DxTreeView(props) {
-  return React.createElement(React.Fragment, null, React.createElement(TreeView, {
-    id: "treeView",
-    dataSource: props.dataSource,
-    dataStructure: props.dataStructure !== undefined ? props.dataStructure : "plain",
-    keyExpr: props.keyExpr,
-    displayExpr: props.displayExpr,
-    parentIdExpr: props.parentIdExp,
-    searchEnabled: true,
-    searchMode: "contains",
-    expandAllEnabled: props.expandAllEnabled !== undefined ? props.expandAllEnabled : false,
-    expandedExpr: "expanded",
-    scrollDirection: "vertical",
-    selectNodesRecursive: true,
-    visible: true
-  }));
+  return React.createElement(React.Fragment, null, React.createElement(TreeList, Object.assign({}, props), props.children));
 };
 
 // A type of promise-like that resolves synchronously and supports only one observer
@@ -16500,11 +16433,15 @@ 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];
   var gridRef = useRef(null);
+  var _useState5 = useState(false),
+    filterApplied = _useState5[0],
+    setFilterApplied = _useState5[1];
   var onCancelEditEvent = new CustomEvent('cancelEdit', {
     bubbles: true,
     detail: {
@@ -16619,7 +16556,7 @@ var OdsRemoteDataGrid = function OdsRemoteDataGrid(props) {
                   } else if (totalPageCount >= loadedPageCount) {
                     setData(function (prevData) {
                       var uniqueData = newData.Data.filter(function (newItem) {
-                        return !prevData.some(function (prevItem) {
+                        return !newItem.Id || newItem.Id <= 0 || !prevData.some(function (prevItem) {
                           return prevItem.Id === newItem.Id;
                         });
                       });
@@ -16663,9 +16600,7 @@ var OdsRemoteDataGrid = function OdsRemoteDataGrid(props) {
     }
     if (e.editorOptions && e.rowType === 'data' && e.parentType === 'dataRow') {
       e.editorOptions.onValueChanged = function (args) {
-        if (args.event && args.event.type === 'cancel') {
-          e.cellElement.dispatchEvent(onCancelEditEvent);
-        }
+        if (args.event && args.event.type === 'cancel') e.cellElement.dispatchEvent(onCancelEditEvent);
       };
     }
   }, [props.isServerSide]);
@@ -16756,6 +16691,11 @@ var OdsRemoteDataGrid = function OdsRemoteDataGrid(props) {
     };else state.filterPanel = {
       filterEnabled: true
     };
+    if (data.length === 0) {
+      if (!state.filterValue && state.filterValue !== null) {
+        state.filterValue = null;
+      }
+    }
     localStorage.setItem(props.exportFileName + "Storage", JSON.stringify(state));
   }, [props.filterEnabledShow]);
   var onEditorPrepared = useCallback(function (info) {
@@ -16774,8 +16714,30 @@ var OdsRemoteDataGrid = function OdsRemoteDataGrid(props) {
     }
   }, []);
   var renderTotal = useCallback(function () {
-    return totalRecordCount > 0 ? props.customSummary.summaryTotalDataLabel + " : " + totalRecordCount : "";
-  }, [data, filteredRowCount, loadedPageCount, props.pageSize, totalRecordCount]);
+    var result = "";
+    var totalloaded = 0;
+    if (data.length < 50 || !props.isServerSide || loadedPageCount == totalPageCount) {
+      totalloaded = data.length;
+    } else {
+      totalloaded = loadedPageCount * props.pageSize;
+    }
+    if (props.isServerSide) {
+      result = totalRecordCount > 0 ? totalloaded + " " + props.customSummary.summaryLoadedDataLabel + ("- " + totalRecordCount) + props.customSummary.summaryTotalDataLabel : "";
+      result = concatFilteredLabel(result, totalloaded);
+    }
+    if (props.customSummary.summaryTotalCount !== undefined && !props.isServerSide) {
+      result = props.customSummary.summaryTotalDataLabel + " : " + props.customSummary.summaryTotalCount;
+      result = concatFilteredLabel(result, totalloaded);
+    }
+    return result;
+  }, [data, filteredRowCount, loadedPageCount, props.pageSize, totalRecordCount, filterApplied]);
+  var concatFilteredLabel = function concatFilteredLabel(result, totalloaded) {
+    if (filteredRowCount > 0 && totalloaded !== filteredRowCount && filterApplied) {
+      var filteredLabel = filteredRowCount + " " + props.customSummary.summaryFilteredDataLabel + "- ";
+      result = filteredLabel + " " + result;
+    }
+    return result;
+  };
   var renderTotalPaging = useCallback(function () {
     var result = "";
     if (totalPageCount > 1) {
@@ -16805,18 +16767,12 @@ var OdsRemoteDataGrid = function OdsRemoteDataGrid(props) {
       var height = (_scrollable$clientHei = scrollable === null || scrollable === void 0 ? void 0 : scrollable.clientHeight) != null ? _scrollable$clientHei : 0;
       var scrollHeight = (_scrollable$scrollHei = scrollable === null || scrollable === void 0 ? void 0 : scrollable.scrollHeight) != null ? _scrollable$scrollHei : 0;
       var maxHeight = Math.max(top, height, scrollHeight) - 1;
-      if (scrollHeight <= height) {
-        return;
-      }
+      if (scrollHeight <= height) return;
       var reachedBottom = Math.ceil(top + height) >= maxHeight;
       var lastScrollTop = 0;
-      if (top < lastScrollTop) {
-        return;
-      }
+      if (top < lastScrollTop) return;
       lastScrollTop = top <= 0 ? 0 : top;
-      if (reachedBottom) {
-        onScrollEnd();
-      }
+      if (reachedBottom) onScrollEnd();
     }, 200);
     run(e);
   };
@@ -16830,6 +16786,14 @@ var OdsRemoteDataGrid = function OdsRemoteDataGrid(props) {
       });
     };
   }, [data.length]);
+  var handleContentReady = function handleContentReady(e) {
+    var dataGridInstance = e.component;
+    var filteredDataCount = dataGridInstance.totalCount();
+    setFilteredRowCount(filteredDataCount);
+  };
+  var onFilterValueChange = function onFilterValueChange(e) {
+    if (e !== null) setFilterApplied(true);else setFilterApplied(false);
+  };
   return React.createElement(React.Fragment, null, React.createElement(DataGrid$1, {
     keyExpr: props.keyExpr,
     dataSource: data,
@@ -16863,7 +16827,9 @@ var OdsRemoteDataGrid = function OdsRemoteDataGrid(props) {
     noDataText: props.noDataText,
     onSaved: props.onSaved,
     onSaving: props.onSaving,
-    onEditCanceling: props.onEditCanceling
+    onEditCanceling: props.onEditCanceling,
+    onContentReady: handleContentReady,
+    onFilterValueChange: onFilterValueChange
   }, columns.map(function (col) {
     return React.createElement(Column, Object.assign({
       key: col.dataField
@@ -17031,5 +16997,5 @@ var OdsRemoteDataGrid = function OdsRemoteDataGrid(props) {
   })));
 };
 
-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 };
+export { DxTreeList, 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