ods-component-lib 1.17.65 → 1.17.67

package/dist/index.modern.js

@@ -7,14 +7,14 @@ import 'react-phone-input-2/lib/style.css';
 import PhoneInput from 'react-phone-input-2';
 import message from 'antd/es/message';
 import Parser from 'html-react-parser';
-import { DataGrid, LoadPanel, Paging, Pager, SearchPanel, FilterRow, FilterPanel, RemoteOperations, HeaderFilter, ColumnChooser, Position, ColumnChooserSearch, ColumnChooserSelection, Selection, Editing, Scrolling, Export, Column, RequiredRule, Button as Button$1, Toolbar, Item, Summary, TotalItem, StateStoring, Popup, Form as Form$1 } from 'devextreme-react/data-grid';
+import { DataGrid, LoadPanel, Paging, Pager, SearchPanel, FilterRow, FilterPanel, RemoteOperations, HeaderFilter, ColumnChooser, Position, ColumnChooserSearch, ColumnChooserSelection, Selection, Editing, Popup, Form as Form$1, Scrolling, Export, Column, RequiredRule, Button as Button$1, Toolbar, Item as Item$1, Summary, TotalItem, StateStoring } from 'devextreme-react/data-grid';
+import { Item } from 'devextreme-react/form';
 import { exportDataGrid as exportDataGrid$1 } from 'devextreme/pdf_exporter';
 import { exportDataGrid } from 'devextreme/excel_exporter';
 import jsPDF from 'jspdf';
 import { Workbook } from 'exceljs';
 import { saveAs } from 'file-saver-es';
 import moment from 'moment';
-import { Item as Item$1 } from 'devextreme-react/form';
 import { CheckBox, Lookup, TreeList } from 'devextreme-react';
 import { createStore } from 'devextreme-aspnet-data-nojquery';
 import { TreeView } from 'devextreme-react/tree-view';
@@ -1269,15 +1269,7 @@ function grid(props, dataGridRef) {
     onRowInserted: props.onRowInserted,
     onRowUpdated: props.onRowUpdated,
     onRowRemoved: props.onRowRemoved,
-    onEditingStart: props.onEditingStart,
-    onInitNewRow: props.onInitNewRow,
-    onRowInserting: props.onRowInserting,
-    onRowUpdating: props.onRowUpdating,
-    onRowRemoving: props.onRowRemoving,
     onSaving: props.onSaving,
-    onSaved: props.onSaved,
-    onEditCanceling: props.onEditCanceling,
-    onEditCanceled: props.onEditCanceled,
     allowColumnReordering: true,
     showRowLines: true,
     showBorders: true,
@@ -1285,6 +1277,7 @@ function grid(props, dataGridRef) {
     focusedRowEnabled: false,
     wordWrapEnabled: false,
     noDataText: "No Data",
+    onEditCanceling: props.onEditCanceling,
     onExporting: onExporting,
     height: window.innerHeight - 164,
     repaintChangesOnly: true,
@@ -1332,12 +1325,30 @@ function grid(props, dataGridRef) {
   })), props.selectEnable && React.createElement(Selection, {
     mode: "multiple",
     deferred: true
-  }), props.inlineEdit === true && React.createElement(Editing, {
+  }), props.editEnable === true && React.createElement(Editing, {
     mode: props.edit.mode,
     allowUpdating: props.edit.allowUpdating,
     allowDeleting: props.edit.allowDeleting,
-    allowAdding: props.edit.allowAdding
-  }), React.createElement(Scrolling, {
+    allowAdding: props.edit.allowAdding,
+    useIcons: true
+  }, props.edit.mode === "popup" && React.createElement(Popup, {
+    title: props.popupTitle,
+    showTitle: true,
+    width: 700,
+    height: 300,
+    showCloseButton: false
+  }), React.createElement(Form$1, null, props.formItems.map(function (formItem) {
+    return React.createElement(Item, {
+      itemType: formItem.itemType,
+      colCount: formItem.colCount,
+      colSpan: formItem.colSpan
+    }, formItem.items.map(function (subItem) {
+      return React.createElement(Item, {
+        key: subItem.dataField,
+        dataField: subItem.dataField
+      });
+    }));
+  }))), React.createElement(Scrolling, {
     mode: props.scroll.mode,
     showScrollbar: props.scroll.showScrollbar,
     scrollByContent: props.scroll.scrollByContent,
@@ -1365,25 +1376,41 @@ function grid(props, dataGridRef) {
         value: false
       }]
     }));
-  }), props.inlinedit === false && React.createElement(Column, {
-    dataField: "Actions",
-    caption: "Actions",
-    type: "buttons",
-    width: 110,
-    showInColumnChooser: false
-  }, props.edit.allowUpdating && React.createElement(Button$1, {
-    hint: "Edit",
-    visible: true,
-    disabled: false,
-    icon: "edit",
-    onClick: props.editButtonClick
-  }), props.edit.allowDeleting && React.createElement(Button$1, {
-    hint: "Delete",
-    visible: true,
-    disabled: false,
-    icon: "trash",
-    onClick: props.deleteButtonClick
-  })), React.createElement(Toolbar, null, props.pageTitle && React.createElement(Item, {
+  }), function () {
+    if (props.customPopup !== undefined) {
+      return React.createElement(Column, {
+        dataField: "Actions",
+        caption: "Actions",
+        type: "buttons",
+        width: 110,
+        showInColumnChooser: false
+      }, props.edit.allowUpdating && React.createElement(Button$1, {
+        hint: "Edit",
+        visible: true,
+        disabled: false,
+        icon: "edit",
+        onClick: props.editButtonClick
+      }), props.edit.allowDeleting && React.createElement(Button$1, {
+        hint: "Delete",
+        visible: true,
+        disabled: false,
+        icon: "trash",
+        onClick: props.deleteButtonClick
+      }));
+    } else {
+      return React.createElement(Column, {
+        dataField: "Actions",
+        caption: "Actions",
+        type: "buttons",
+        width: 110,
+        showInColumnChooser: false
+      }, React.createElement(React.Fragment, null, props.edit.allowUpdating && React.createElement(Button$1, {
+        name: "edit"
+      }), props.edit.allowDeleting && React.createElement(Button$1, {
+        name: "delete"
+      })));
+    }
+  }(), React.createElement(Toolbar, null, props.pageTitle && React.createElement(Item$1, {
     location: "before"
   }, React.createElement(Typography.Title, {
     level: 5,
@@ -1394,7 +1421,7 @@ function grid(props, dataGridRef) {
       gap: "4px",
       alignSelf: "stretch"
     }
-  }, props.pageTitle)), props.inlinedit === false && React.createElement(Item, {
+  }, props.pageTitle)), React.createElement(Item$1, {
     location: "before"
   }, React.createElement(OdsButton, {
     type: "primary",
@@ -1402,15 +1429,15 @@ function grid(props, dataGridRef) {
     style: {
       marginBottom: "10px"
     }
-  }, "Add New")), React.createElement(Item, {
+  }, "Add New")), React.createElement(Item$1, {
     name: "searchPanel"
-  }), React.createElement(Item, {
+  }), React.createElement(Item$1, {
     name: "applyFilterButton"
-  }), React.createElement(Item, {
+  }), React.createElement(Item$1, {
     name: "columnChooserButton"
-  }), React.createElement(Item, {
+  }), React.createElement(Item$1, {
     name: "exportButton"
-  }), React.createElement(Item, {
+  }), React.createElement(Item$1, {
     menuItemRender: renderMenuItem
   })), React.createElement(Summary, null, React.createElement(TotalItem, {
     column: "Id",
@@ -1703,12 +1730,12 @@ function OdsProfDataGrid(props) {
     height: 300,
     showCloseButton: false
   }), React.createElement(Form$1, null, props.formItems && props.formItems.map(function (formItem) {
-    return React.createElement(Item$1, {
+    return React.createElement(Item, {
       itemType: formItem.itemType,
       colCount: formItem.colCount,
       colSpan: formItem.colSpan
     }, formItem.items.map(function (subItem) {
-      return React.createElement(Item$1, {
+      return React.createElement(Item, {
         key: subItem.dataField,
         dataField: subItem.dataField
       });
@@ -1765,25 +1792,25 @@ function OdsProfDataGrid(props) {
         name: "delete"
       })));
     }
-  }(), React.createElement(Toolbar, null, React.createElement(Item, {
+  }(), React.createElement(Toolbar, null, React.createElement(Item$1, {
     location: "after"
   }, React.createElement(Button$1, {
     onClick: props.onAddButton
-  }, "Add New")), React.createElement(Item, {
+  }, "Add New")), React.createElement(Item$1, {
     location: "after"
   }, React.createElement(CheckBox, {
     id: 'showPageSizes',
     text: 'Show Page Size',
     value: showPageSizeSelector,
     onValueChanged: handleCheckboxChange
-  })), React.createElement(Item, {
+  })), React.createElement(Item$1, {
     location: "after"
   }, React.createElement(CheckBox, {
     id: 'showPages',
     text: 'Enable Paging',
     value: enablePaging,
     onValueChanged: onEnablePagingChange
-  })), React.createElement(Item, {
+  })), React.createElement(Item$1, {
     location: "after"
   }, React.createElement(Lookup, {
     value: scrollingType,
@@ -1798,13 +1825,13 @@ function OdsProfDataGrid(props) {
       label: "infinite"
     }],
     onValueChange: handleScrollingTypeChange
-  })), React.createElement(Item, {
+  })), React.createElement(Item$1, {
     name: "columnChooserButton"
-  }), React.createElement(Item, {
+  }), React.createElement(Item$1, {
     name: "searchPanel"
-  }), React.createElement(Item, {
+  }), React.createElement(Item$1, {
     name: "exportButton"
-  }), React.createElement(Item, {
+  }), React.createElement(Item$1, {
     menuItemRender: renderMenuItem$1
   })))));
 }
@@ -1955,12 +1982,12 @@ function grid$2(props) {
     height: 300,
     showCloseButton: false
   }), React.createElement(Form$1, null, props.formItems.map(function (formItem) {
-    return React.createElement(Item$1, {
+    return React.createElement(Item, {
       itemType: formItem.itemType,
       colCount: formItem.colCount,
       colSpan: formItem.colSpan
     }, formItem.items.map(function (subItem) {
-      return React.createElement(Item$1, {
+      return React.createElement(Item, {
         key: subItem.dataField,
         dataField: subItem.dataField
       });
@@ -1985,18 +2012,18 @@ function grid$2(props) {
         value: false
       }]
     }));
-  }), React.createElement(Toolbar, null, React.createElement(Item, {
+  }), React.createElement(Toolbar, null, React.createElement(Item$1, {
     location: "after"
   }, React.createElement(OdsButton, {
     type: "primary",
     onClick: props.onAddButton
-  }, "Add New")), React.createElement(Item, {
+  }, "Add New")), React.createElement(Item$1, {
     name: "searchPanel"
-  }), React.createElement(Item, {
+  }), React.createElement(Item$1, {
     name: "columnChooserButton"
-  }), React.createElement(Item, {
+  }), React.createElement(Item$1, {
     name: "exportButton"
-  }), React.createElement(Item, {
+  }), React.createElement(Item$1, {
     menuItemRender: renderMenuItem$2
   })), React.createElement(Summary, null, React.createElement(TotalItem, {
     column: "Id",