@agilemotion/oui-react-js 1.8.2 → 1.8.4

package/dist/components/AlertBar.js

@@ -10,7 +10,7 @@ var _Alert = _interopRequireDefault(require("react-bootstrap/Alert"));
 var _EventType = _interopRequireDefault(require("../event/EventType"));
 var _Observable = _interopRequireDefault(require("../event/Observable"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const AlertBar = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwardRef((props, ref) => {
+const AlertBar = /*#__PURE__*/_react.default.memo(props => {
   const [message, setMessage] = _react.default.useState(props.config.message);
   const [variant, setVariant] = _react.default.useState(props.config.variant ? props.config.variant : 'info');
   _react.default.useEffect(() => {
@@ -74,12 +74,12 @@ const AlertBar = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.f
     onClose: () => setMessage(null),
     dismissible: true,
     style: {
-      with: '100%'
+      width: '100%'
     }
   }, /*#__PURE__*/_react.default.createElement("p", {
     style: {
       color: 'rgba(255, 255, 255, 0.8)'
     }
   }, message))) : null;
-}));
+});
 var _default = exports.default = AlertBar;

package/dist/components/AlertItem.js

@@ -5,9 +5,9 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = AlertItem;
 var _react = _interopRequireDefault(require("react"));
-var _Alert = _interopRequireDefault(require("@material-ui/lab/Alert"));
-var _AlertTitle = _interopRequireDefault(require("@material-ui/lab/AlertTitle"));
-var _styles = require("@material-ui/core/styles");
+var _Alert = _interopRequireDefault(require("@mui/lab/Alert"));
+var _AlertTitle = _interopRequireDefault(require("@mui/lab/AlertTitle"));
+var _styles = require("@mui/styles");
 var _Utils = _interopRequireDefault(require("../Utils"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 const useStyles = (0, _styles.makeStyles)(theme => ({

package/dist/components/Button.js

@@ -5,12 +5,12 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
-var _Button = _interopRequireDefault(require("@material-ui/core/Button"));
+var _Button = _interopRequireDefault(require("@mui/material/Button"));
 var _Observable = _interopRequireDefault(require("../event/Observable"));
 var _Utils = _interopRequireDefault(require("../Utils"));
-var _IconButton = _interopRequireDefault(require("@material-ui/core/IconButton"));
+var _IconButton = _interopRequireDefault(require("@mui/material/IconButton"));
 var _Icon = _interopRequireDefault(require("./Icon"));
-var _styles = require("@material-ui/core/styles");
+var _styles = require("@mui/styles");
 var _Event = _interopRequireDefault(require("../event/Event"));
 var _EventType = _interopRequireDefault(require("../event/EventType"));
 var _ApplicationManager = _interopRequireDefault(require("../ApplicationManager"));
@@ -26,10 +26,10 @@ const useStyles = (0, _styles.makeStyles)(theme => ({
     zIndex: 2
   }
 }));
-const Button = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
+const Button = props => {
   const classes = useStyles();
   const [disabled, setDisabled] = _react.default.useState(false);
-  const [visible, setVisible] = _react.default.useState(true);
+  const [visible, setVisible] = _react.default.useState(false);
   const [config, setConfig] = _react.default.useState(null);
   let color = _Utils.default.getComponentAttribute(props.config, 'color', 'default');
   let label = _Utils.default.getComponentAttribute(props.config, 'label', null);
@@ -97,7 +97,6 @@ const Button = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
     variant: color === 'secondary' || color === 'primary' ? 'contained' : 'text',
     size: "large",
     color: !_Utils.default.isNull(color) ? color : null,
-    ref: ref,
     style: props.config.attributes?.style,
     disabled: disabled,
     onClick: handleClick,
@@ -106,7 +105,6 @@ const Button = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
     })
   }, label) : !_Utils.default.isNull(props.config.icon) ? /*#__PURE__*/_react.default.createElement(_IconButton.default, {
     "aria-controls": "menu-list-grow",
-    ref: ref,
     disabled: disabled,
     style: props.config.attributes?.style,
     "aria-haspopup": "true",
@@ -118,11 +116,10 @@ const Button = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
     variant: color === 'secondary' || color === 'primary' ? 'contained' : 'text',
     "aria-controls": "menu-list-grow",
     color: color,
-    ref: ref,
     style: props.config.attributes?.style,
     disabled: disabled,
     onClick: handleClick,
     "aria-haspopup": "true"
   }, label))));
-});
+};
 var _default = exports.default = Button;

package/dist/components/Calendar.js

@@ -19,11 +19,11 @@ var _reactHotToast = _interopRequireDefault(require("react-hot-toast"));
 var _Event = _interopRequireDefault(require("../event/Event"));
 var _EventType = _interopRequireDefault(require("../event/EventType"));
 var _ApplicationManager = _interopRequireDefault(require("../ApplicationManager"));
-var _Dialog = _interopRequireDefault(require("@material-ui/core/Dialog"));
-var _withStyles = _interopRequireDefault(require("@material-ui/core/styles/withStyles"));
-var _IconButton = _interopRequireDefault(require("@material-ui/core/IconButton"));
+var _Dialog = _interopRequireDefault(require("@mui/material/Dialog"));
+var _withStyles = _interopRequireDefault(require("@mui/styles/withStyles"));
+var _IconButton = _interopRequireDefault(require("@mui/material/IconButton"));
 var _Icon = _interopRequireDefault(require("./Icon"));
-var _Button = _interopRequireDefault(require("@material-ui/core/Button"));
+var _Button = _interopRequireDefault(require("@mui/material/Button"));
 var _Calendar = _interopRequireDefault(require("../js/Calendar"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
@@ -150,9 +150,9 @@ const Calendar = props => {
       start: 'sidebarToggle, prev,next, title',
       end: 'dayGridMonth,timeGridWeek,timeGridDay,listMonth'
     },
-    /*
-      Enable dragging and resizing event
-      ? Docs: https://fullcalendar.io/docs/editable
+    /*
+      Enable dragging and resizing event
+      ? Docs: https://fullcalendar.io/docs/editable
     */
     editable: true,
     height: '100%',
@@ -163,24 +163,24 @@ const Calendar = props => {
       minute: "2-digit",
       hour12: false
     },
-    /*
-      Enable resizing event from start
-      ? Docs: https://fullcalendar.io/docs/eventResizableFromStart
+    /*
+      Enable resizing event from start
+      ? Docs: https://fullcalendar.io/docs/eventResizableFromStart
     */
     eventResizableFromStart: true,
-    /*
-      Automatically scroll the scroll-containers during event drag-and-drop and date selecting
-      ? Docs: https://fullcalendar.io/docs/dragScroll
+    /*
+      Automatically scroll the scroll-containers during event drag-and-drop and date selecting
+      ? Docs: https://fullcalendar.io/docs/dragScroll
     */
     dragScroll: true,
-    /*
-      Max number of events within a given day
-      ? Docs: https://fullcalendar.io/docs/dayMaxEvents
+    /*
+      Max number of events within a given day
+      ? Docs: https://fullcalendar.io/docs/dayMaxEvents
     */
     dayMaxEvents: 2,
-    /*
-      Determines if day names and week names are clickable
-      ? Docs: https://fullcalendar.io/docs/navLinks
+    /*
+      Determines if day names and week names are clickable
+      ? Docs: https://fullcalendar.io/docs/navLinks
     */
     navLinks: true,
     eventClassNames(_ref) {
@@ -260,10 +260,10 @@ const Calendar = props => {
         _Observable.default.fireEvent(_EventType.default.CALENDAR_DATE_CLICK, event);
       }
     },
-    /*
-      Handle event drop (Also include dragged event)
-      ? Docs: https://fullcalendar.io/docs/eventDrop
-      ? We can use `eventDragStop` but it doesn't return updated event so we have to use `eventDrop` which returns updated event
+    /*
+      Handle event drop (Also include dragged event)
+      ? Docs: https://fullcalendar.io/docs/eventDrop
+      ? We can use `eventDragStop` but it doesn't return updated event so we have to use `eventDrop` which returns updated event
     */
     eventDrop(_ref3) {
       let {
@@ -272,9 +272,9 @@ const Calendar = props => {
       //dispatch(updateEvent(droppedEvent));
       _reactHotToast.default.success('Event Updated');
     },
-    /*
-      Handle event resize
-      ? Docs: https://fullcalendar.io/docs/eventResize
+    /*
+      Handle event resize
+      ? Docs: https://fullcalendar.io/docs/eventResize
     */
     eventResize(_ref4) {
       let {
@@ -283,9 +283,9 @@ const Calendar = props => {
       //dispatch(updateEvent(resizedEvent));
       _reactHotToast.default.success('Event Updated');
     },
-    /*
-      Handle event mouse enter
-      ? Docs: https://fullcalendar.io/docs/eventMouseEnter
+    /*
+      Handle event mouse enter
+      ? Docs: https://fullcalendar.io/docs/eventMouseEnter
     */
     eventMouseEnter(_ref5) {
       let {
@@ -293,9 +293,9 @@ const Calendar = props => {
         event: event
       } = _ref5;
     },
-    /*
-      Handle event mouse enter
-      ? Docs: https://fullcalendar.io/docs/eventMouseEnter
+    /*
+      Handle event mouse enter
+      ? Docs: https://fullcalendar.io/docs/eventMouseEnter
     */
     eventMouseLeave(_ref6) {
       let {

package/dist/components/ConfirmationDialog.js

@@ -5,12 +5,12 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.ConfirmationDialog = void 0;
 var _react = _interopRequireDefault(require("react"));
-var _Button = _interopRequireDefault(require("@material-ui/core/Button"));
-var _Dialog = _interopRequireDefault(require("@material-ui/core/Dialog"));
-var _DialogActions = _interopRequireDefault(require("@material-ui/core/DialogActions"));
-var _DialogContent = _interopRequireDefault(require("@material-ui/core/DialogContent"));
-var _DialogContentText = _interopRequireDefault(require("@material-ui/core/DialogContentText"));
-var _DialogTitle = _interopRequireDefault(require("@material-ui/core/DialogTitle"));
+var _Button = _interopRequireDefault(require("@mui/material/Button"));
+var _Dialog = _interopRequireDefault(require("@mui/material/Dialog"));
+var _DialogActions = _interopRequireDefault(require("@mui/material/DialogActions"));
+var _DialogContent = _interopRequireDefault(require("@mui/material/DialogContent"));
+var _DialogContentText = _interopRequireDefault(require("@mui/material/DialogContentText"));
+var _DialogTitle = _interopRequireDefault(require("@mui/material/DialogTitle"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 const ConfirmationDialog = exports.ConfirmationDialog = /*#__PURE__*/_react.default.memo(props => {
   const [open, setOpen] = _react.default.useState(false);

package/dist/components/DataGrid.css

@@ -100,21 +100,21 @@ table.responsive-table thead {
     padding-bottom: 0 !important;
 }
 
-.transferListFilterWraper .row, .editCell .row {
+.transferListFilterWrapper .row, .editCell .row {
     margin-left: 0 !important;
     margin-right: -8px !important;
 }
 
-.transferListFilterWraper, .filterWraper, .filterWraperBlank {
+.transferListFilterWrapper, .filterWraper, .filterWraperBlank {
     height: 54px;
 }
 
-.transferListFilterWraper table tr, .filterWraper table tr {
+.transferListFilterWrapper table tr, .filterWraper table tr {
     border-top: none !important;
     border-bottom: none !important;
 }
 
-.transferListFilterWraper table td, .filterWraper table td {
+.transferListFilterWrapper table td, .filterWraper table td {
     height: 54px;
     padding: 0 !important;
     border-top: none !important;

package/dist/components/DataGrid.js

@@ -5,24 +5,23 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.MULTI_SELECT_CHECKBOX_COL_WIDTH = exports.DataGrid = void 0;
 var _react = _interopRequireDefault(require("react"));
-var _styles = require("@material-ui/core/styles");
+var _styles = require("@mui/styles");
 var _reactSuperResponsiveTable = require("react-super-responsive-table");
 require("react-super-responsive-table/dist/SuperResponsiveTableStyle.css");
-var _Checkbox = _interopRequireDefault(require("@material-ui/core/Checkbox"));
+var _Checkbox = _interopRequireDefault(require("@mui/material/Checkbox"));
 var _Utils = _interopRequireDefault(require("../Utils"));
 require("./DataGrid.css");
-var _RestUtils = require("../RestUtils");
+var _RestService = require("../RestService");
 var _DataGridFilter = _interopRequireDefault(require("./DataGridFilter"));
 var _DataGridHeading = _interopRequireDefault(require("./DataGridHeading"));
 var _TableCellContent = _interopRequireDefault(require("./TableCellContent"));
-var _TablePagination = _interopRequireDefault(require("@material-ui/core/TablePagination"));
+var _TablePagination = _interopRequireDefault(require("@mui/material/TablePagination"));
 var _colors = require("material-ui/styles/colors");
 var _Event = _interopRequireDefault(require("../event/Event"));
 var _Observable = _interopRequireDefault(require("../event/Observable"));
 var _EventType = _interopRequireDefault(require("../event/EventType"));
-var _Grid = _interopRequireDefault(require("@material-ui/core/Grid"));
-var _Button = _interopRequireDefault(require("@material-ui/core/Button"));
-var _mobx = require("mobx");
+var _Grid = _interopRequireDefault(require("@mui/material/Grid"));
+var _Button = _interopRequireDefault(require("@mui/material/Button"));
 var $ = _interopRequireWildcard(require("jquery"));
 var _Alert = _interopRequireDefault(require("react-bootstrap/Alert"));
 var _ApplicationManager = _interopRequireDefault(require("../ApplicationManager"));
@@ -107,7 +106,7 @@ const useStyles = (0, _styles.makeStyles)(theme => ({
     width: 1
   }
 }));
-const DataGrid = exports.DataGrid = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwardRef((props, ref) => {
+const DataGrid = exports.DataGrid = /*#__PURE__*/_react.default.memo(/*#__PURE__*/_react.default.forwardRef((props, ref) => {
   const classes = useStyles();
   const [order, setOrder] = _react.default.useState('desc');
   const [config] = _react.default.useState(_Utils.default.parseConfig(props.config, props.viewId));
@@ -406,12 +405,15 @@ const DataGrid = exports.DataGrid = /*#__PURE__*/_react.default.memo( /*#__PURE_
         serviceType = 'rpc';
       }
       if (serviceType === 'rpc' || serviceType === 'rest') {
-        let method = serviceType === 'rpc' ? _RestUtils.invokeRpc : _RestUtils.invokeRest;
-        method(service, props.handle, props.viewId, result => {
+        let method = serviceType === 'rpc' ? _RestService.invokeRpc : _RestService.invokeRest;
+        method({
+          service: service,
+          component: props.handle,
+          viewId: props.viewId
+        }).then(result => {
           processData(result, conf);
-        }, e => {
+        }).catch(e => {
           console.error(e);
-          //Utils.publishSystemErrorMessage(props.viewId);
         });
       } else {
         throw new Error('Unknown service type : ' + serviceType);
@@ -548,7 +550,7 @@ const DataGrid = exports.DataGrid = /*#__PURE__*/_react.default.memo( /*#__PURE_
   const editorChangeHandler = (rowId, field, value) => {
     for (const row of rows) {
       if (row.id === rowId) {
-        row[field] = value;
+        _Utils.default.updateNestedProperty(row, field, value);
         break;
       }
     }
@@ -655,7 +657,6 @@ const DataGrid = exports.DataGrid = /*#__PURE__*/_react.default.memo( /*#__PURE_
     return editorHandles[column.id + "_editor"];
   }
   return /*#__PURE__*/_react.default.createElement("div", {
-    ref: ref,
     style: _Utils.default.isNull(props.hasBorder) || props.hasBorder === true ? _Utils.default.mergeStyles({
       margin: '0',
       border: '1px solid #e2e2e2',
@@ -717,8 +718,7 @@ const DataGrid = exports.DataGrid = /*#__PURE__*/_react.default.memo( /*#__PURE_
     className: 'filterHead',
     style: {
       width: 'calc(100% - ' + props.scrollWidth + 'px)'
-    },
-    ref: ref
+    }
   }, isFilterable() ? /*#__PURE__*/_react.default.createElement(_DataGridFilter.default, {
     handle: filterHandle,
     ref: /*#__PURE__*/_react.default.createRef(),
@@ -748,7 +748,8 @@ const DataGrid = exports.DataGrid = /*#__PURE__*/_react.default.memo( /*#__PURE_
     const labelId = `enhanced-table-checkbox-${index}`;
     let defaultRowStyle = {
       display: 'flex',
-      flexWrap: 'wrap'
+      flexWrap: 'wrap',
+      alignItems: 'center'
     };
     return /*#__PURE__*/_react.default.createElement(_reactSuperResponsiveTable.Tr, {
       style: props.config.rowAttributes && props.config.rowAttributes.style ? _Utils.default.mergeObjects(props.config.rowAttributes.style, defaultRowStyle) : defaultRowStyle,
@@ -772,7 +773,8 @@ const DataGrid = exports.DataGrid = /*#__PURE__*/_react.default.memo( /*#__PURE_
     })) : null, config.columns.map(column => column.attributes['hidden'] === true ? null : column.layout ? /*#__PURE__*/_react.default.createElement(_reactSuperResponsiveTable.Td, {
       style: {
         padding: 0,
-        width: column.attributes.width ? column.attributes.width : 100 / config.columns.length + '%'
+        width: column.attributes.width ? column.attributes.width : 100 / config.columns.length + '%',
+        height: '100%'
       },
       align: "left",
       className: isItemSelected && !_Utils.default.isNull(props.form) && !_Utils.default.isNull(column.editor) ? 'editCell' : null,
@@ -787,7 +789,8 @@ const DataGrid = exports.DataGrid = /*#__PURE__*/_react.default.memo( /*#__PURE_
       parent: false
     })) : /*#__PURE__*/_react.default.createElement(_reactSuperResponsiveTable.Td, {
       style: {
-        width: column.attributes.width ? column.attributes.width : 100 / config.columns.length + '%'
+        width: column.attributes.width ? column.attributes.width : 100 / config.columns.length + '%',
+        height: '100%'
       },
       align: "left",
       className: isItemSelected && !_Utils.default.isNull(column.editor) ? 'editCell' : null,
@@ -819,7 +822,7 @@ const DataGrid = exports.DataGrid = /*#__PURE__*/_react.default.memo( /*#__PURE_
     nextIconButtonProps: {
       'aria-label': 'next page'
     },
-    onChangePage: handleChangePage,
-    onChangeRowsPerPage: handleChangeRowsPerPage
+    onPageChange: handleChangePage,
+    onRowsPerPageChange: handleChangeRowsPerPage
   }) : null) : null);
 }));