@agilemotion/oui-react-js 1.8.2 → 1.8.3

package/dist/components/Icon.js

@@ -4,43 +4,44 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _Add = _interopRequireDefault(require("@material-ui/icons/Add"));
-var _Remove = _interopRequireDefault(require("@material-ui/icons/Remove"));
-var _Edit = _interopRequireDefault(require("@material-ui/icons/Edit"));
-var _Save = _interopRequireDefault(require("@material-ui/icons/Save"));
-var _Info = _interopRequireDefault(require("@material-ui/icons/Info"));
-var _Delete = _interopRequireDefault(require("@material-ui/icons/Delete"));
-var _Search = _interopRequireDefault(require("@material-ui/icons/Search"));
-var _Error = _interopRequireDefault(require("@material-ui/icons/Error"));
-var _CloudDownload = _interopRequireDefault(require("@material-ui/icons/CloudDownload"));
-var _CloudUpload = _interopRequireDefault(require("@material-ui/icons/CloudUpload"));
-var _RotateLeft = _interopRequireDefault(require("@material-ui/icons/RotateLeft"));
-var _RotateRight = _interopRequireDefault(require("@material-ui/icons/RotateRight"));
-var _ZoomIn = _interopRequireDefault(require("@material-ui/icons/ZoomIn"));
-var _ZoomOut = _interopRequireDefault(require("@material-ui/icons/ZoomOut"));
-var _Clear = _interopRequireDefault(require("@material-ui/icons/Clear"));
-var _Work = _interopRequireDefault(require("@material-ui/icons/Work"));
-var _Home = _interopRequireDefault(require("@material-ui/icons/Home"));
-var _List = _interopRequireDefault(require("@material-ui/icons/List"));
-var _Notifications = _interopRequireDefault(require("@material-ui/icons/Notifications"));
-var _Person = _interopRequireDefault(require("@material-ui/icons/Person"));
-var _Refresh = _interopRequireDefault(require("@material-ui/icons/Refresh"));
-var _Folder = _interopRequireDefault(require("@material-ui/icons/Folder"));
-var _AttachFile = _interopRequireDefault(require("@material-ui/icons/AttachFile"));
-var _CalendarToday = _interopRequireDefault(require("@material-ui/icons/CalendarToday"));
+var _Add = _interopRequireDefault(require("@mui/icons-material/Add"));
+var _Remove = _interopRequireDefault(require("@mui/icons-material/Remove"));
+var _Edit = _interopRequireDefault(require("@mui/icons-material/Edit"));
+var _Save = _interopRequireDefault(require("@mui/icons-material/Save"));
+var _Info = _interopRequireDefault(require("@mui/icons-material/Info"));
+var _Delete = _interopRequireDefault(require("@mui/icons-material/Delete"));
+var _Search = _interopRequireDefault(require("@mui/icons-material/Search"));
+var _Error = _interopRequireDefault(require("@mui/icons-material/Error"));
+var _CloudDownload = _interopRequireDefault(require("@mui/icons-material/CloudDownload"));
+var _CloudUpload = _interopRequireDefault(require("@mui/icons-material/CloudUpload"));
+var _RotateLeft = _interopRequireDefault(require("@mui/icons-material/RotateLeft"));
+var _RotateRight = _interopRequireDefault(require("@mui/icons-material/RotateRight"));
+var _ZoomIn = _interopRequireDefault(require("@mui/icons-material/ZoomIn"));
+var _ZoomOut = _interopRequireDefault(require("@mui/icons-material/ZoomOut"));
+var _Clear = _interopRequireDefault(require("@mui/icons-material/Clear"));
+var _Work = _interopRequireDefault(require("@mui/icons-material/Work"));
+var _Home = _interopRequireDefault(require("@mui/icons-material/Home"));
+var _List = _interopRequireDefault(require("@mui/icons-material/List"));
+var _Notifications = _interopRequireDefault(require("@mui/icons-material/Notifications"));
+var _Person = _interopRequireDefault(require("@mui/icons-material/Person"));
+var _Refresh = _interopRequireDefault(require("@mui/icons-material/Refresh"));
+var _Folder = _interopRequireDefault(require("@mui/icons-material/Folder"));
+var _AttachFile = _interopRequireDefault(require("@mui/icons-material/AttachFile"));
+var _CalendarToday = _interopRequireDefault(require("@mui/icons-material/CalendarToday"));
 var _react = _interopRequireWildcard(require("react"));
-var _Minimize = _interopRequireDefault(require("@material-ui/icons/Minimize"));
-var _Launch = _interopRequireDefault(require("@material-ui/icons/Launch"));
-var _Close = _interopRequireDefault(require("@material-ui/icons/Close"));
-var _Videocam = _interopRequireDefault(require("@material-ui/icons/Videocam"));
-var _VideocamOff = _interopRequireDefault(require("@material-ui/icons/VideocamOff"));
-var _Mic = _interopRequireDefault(require("@material-ui/icons/Mic"));
-var _MicOff = _interopRequireDefault(require("@material-ui/icons/MicOff"));
-var _CallEnd = _interopRequireDefault(require("@material-ui/icons/CallEnd"));
-var _Dock = _interopRequireDefault(require("@material-ui/icons/Dock"));
-var _Settings = _interopRequireDefault(require("@material-ui/icons/Settings"));
-var _WarningRounded = _interopRequireDefault(require("@material-ui/icons/WarningRounded"));
-var _icons = require("@material-ui/icons");
+var _Minimize = _interopRequireDefault(require("@mui/icons-material/Minimize"));
+var _Launch = _interopRequireDefault(require("@mui/icons-material/Launch"));
+var _Close = _interopRequireDefault(require("@mui/icons-material/Close"));
+var _Videocam = _interopRequireDefault(require("@mui/icons-material/Videocam"));
+var _VideocamOff = _interopRequireDefault(require("@mui/icons-material/VideocamOff"));
+var _Mic = _interopRequireDefault(require("@mui/icons-material/Mic"));
+var _MicOff = _interopRequireDefault(require("@mui/icons-material/MicOff"));
+var _CallEnd = _interopRequireDefault(require("@mui/icons-material/CallEnd"));
+var _Dock = _interopRequireDefault(require("@mui/icons-material/Dock"));
+var _Settings = _interopRequireDefault(require("@mui/icons-material/Settings"));
+var _WarningRounded = _interopRequireDefault(require("@mui/icons-material/WarningRounded"));
+var _Help = _interopRequireDefault(require("@mui/icons-material/Help"));
+var _iconsMaterial = require("@mui/icons-material");
 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); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
@@ -57,7 +58,7 @@ class Icon extends _react.Component {
     } else if (this.props.id === 'CALL_END') {
       return /*#__PURE__*/_react.default.createElement(_CallEnd.default, null);
     } else if (this.props.id === 'MORE') {
-      return /*#__PURE__*/_react.default.createElement(_icons.MoreHoriz, {
+      return /*#__PURE__*/_react.default.createElement(_iconsMaterial.MoreHoriz, {
         style: {
           color: this.props.color
         }
@@ -80,16 +81,22 @@ class Icon extends _react.Component {
           color: 'red'
         }
       });
+    } else if (this.props.id === 'HELP') {
+      return /*#__PURE__*/_react.default.createElement(_Help.default, {
+        style: {
+          color: this.props.color
+        }
+      });
     } else if (this.props.id === 'PAN_TOOL') {
-      return /*#__PURE__*/_react.default.createElement(_icons.PanTool, null);
+      return /*#__PURE__*/_react.default.createElement(_iconsMaterial.PanTool, null);
     } else if (this.props.id === 'PEOPLE') {
-      return /*#__PURE__*/_react.default.createElement(_icons.People, null);
+      return /*#__PURE__*/_react.default.createElement(_iconsMaterial.People, null);
     } else if (this.props.id === 'CANCEL_PRESENTATION') {
-      return /*#__PURE__*/_react.default.createElement(_icons.CancelPresentation, null);
+      return /*#__PURE__*/_react.default.createElement(_iconsMaterial.CancelPresentation, null);
     } else if (this.props.id === 'PRESENT_TO_ALL') {
-      return /*#__PURE__*/_react.default.createElement(_icons.PresentToAll, null);
+      return /*#__PURE__*/_react.default.createElement(_iconsMaterial.PresentToAll, null);
     } else if (this.props.id === 'CHAT_BUBBLE') {
-      return /*#__PURE__*/_react.default.createElement(_icons.ChatBubbleOutline, _extends({}, this.props, {
+      return /*#__PURE__*/_react.default.createElement(_iconsMaterial.ChatBubbleOutline, _extends({}, this.props, {
         style: {
           color: this.props.color
         }
@@ -210,11 +217,11 @@ class Icon extends _react.Component {
         }
       });
     } else if (this.props.id === 'RECORD') {
-      return /*#__PURE__*/_react.default.createElement(_icons.FiberManualRecord, null);
+      return /*#__PURE__*/_react.default.createElement(_iconsMaterial.FiberManualRecord, null);
     } else if (this.props.id === 'PLAY') {
-      return /*#__PURE__*/_react.default.createElement(_icons.PlayArrow, null);
+      return /*#__PURE__*/_react.default.createElement(_iconsMaterial.PlayArrow, null);
     } else if (this.props.id === 'STOP') {
-      return /*#__PURE__*/_react.default.createElement(_icons.Stop, {
+      return /*#__PURE__*/_react.default.createElement(_iconsMaterial.Stop, {
         style: {
           color: this.props.color
         }

package/dist/components/LoadingIndicator.js

@@ -3,13 +3,13 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = LoadingIndicator;
+exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _reactPromiseTracker = require("react-promise-tracker");
-var _reactLoaderSpinner = _interopRequireDefault(require("react-loader-spinner"));
+var _reactLoaderSpinner = require("react-loader-spinner");
 require("./loader.css");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function LoadingIndicator(props) {
+const LoadingIndicator = props => {
   const {
     promiseInProgress
   } = (0, _reactPromiseTracker.usePromiseTracker)();
@@ -25,11 +25,14 @@ function LoadingIndicator(props) {
       justifyContent: "center",
       alignItems: "center"
     }
-  }, /*#__PURE__*/_react.default.createElement(_reactLoaderSpinner.default, {
-    type: "Oval",
-    color: props.color,
-    height: 60,
-    width: 60
+  }, /*#__PURE__*/_react.default.createElement(_reactLoaderSpinner.Oval, {
+    visible: true,
+    height: "80",
+    width: "80",
+    color: "#4fa94d",
+    ariaLabel: "oval-loading",
+    wrapperStyle: {},
+    wrapperClass: ""
   })));
-}
-;
+};
+var _default = exports.default = LoadingIndicator;

package/dist/components/PopupView.js

@@ -5,11 +5,11 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = PopupView;
 var _react = _interopRequireDefault(require("react"));
-var _Dialog = _interopRequireDefault(require("@material-ui/core/Dialog"));
-var _DialogContent = _interopRequireDefault(require("@material-ui/core/DialogContent"));
-var _DialogTitle = _interopRequireDefault(require("@material-ui/core/DialogTitle"));
+var _Dialog = _interopRequireDefault(require("@mui/material/Dialog"));
+var _DialogContent = _interopRequireDefault(require("@mui/material/DialogContent"));
+var _DialogTitle = _interopRequireDefault(require("@mui/material/DialogTitle"));
 var _Utils = _interopRequireDefault(require("../Utils"));
-var _styles = require("@material-ui/core/styles");
+var _styles = require("@mui/styles");
 var _View = require("./layout/View");
 var _DynamicJS = _interopRequireDefault(require("../DynamicJS"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
@@ -54,8 +54,8 @@ function PopupViewDialog(props) {
   })));
 }
 
-/**
- * @return {null}
+/**
+ * @return {null}
  */
 function PopupView(props) {
   const [view, setView] = _react.default.useState(null);

package/dist/components/Portlet.js

@@ -9,7 +9,7 @@ var _Utils = _interopRequireDefault(require("../Utils"));
 var _Observable = _interopRequireDefault(require("../event/Observable"));
 require("./Portlet.css");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const Portlet = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwardRef((props, ref) => {
+const Portlet = /*#__PURE__*/_react.default.memo(/*#__PURE__*/_react.default.forwardRef((props, ref) => {
   const [url, setUrl] = _react.default.useState(null);
   const [visible, setVisible] = _react.default.useState(true);
   const urlTemp = _react.default.useRef(null);
@@ -57,7 +57,6 @@ const Portlet = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.fo
     };
   };
   return /*#__PURE__*/_react.default.createElement("div", {
-    ref: ref,
     className: 'iframe_container',
     style: {
       display: visible ? 'block' : 'none'

package/dist/components/RegularButton.js

@@ -7,13 +7,13 @@ exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
-var _styles = require("@material-ui/core/styles");
-var _Button = _interopRequireDefault(require("@material-ui/core/Button"));
+var _styles = require("@mui/styles");
+var _Button = _interopRequireDefault(require("@mui/material/Button"));
 var _buttonStyle = _interopRequireDefault(require("../assets/jss/components/buttonStyle"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 const useStyles = (0, _styles.makeStyles)(_buttonStyle.default);
-const RegularButton = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
+const RegularButton = props => {
   const classes = useStyles();
   const {
     color,
@@ -48,7 +48,7 @@ const RegularButton = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
     classes: muiClasses,
     className: btnClasses
   }), children);
-});
+};
 RegularButton.propTypes = {
   color: _propTypes.default.oneOf(["primary", "info", "success", "warning", "danger", "rose", "white", "twitter", "facebook", "google", "linkedin", "pinterest", "youtube", "tumblr", "github", "behance", "dribbble", "reddit", "transparent"]),
   size: _propTypes.default.oneOf(["sm", "lg"]),

package/dist/components/SignaturePanel.js

@@ -7,13 +7,13 @@ exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _Utils = _interopRequireDefault(require("../Utils"));
 var _Observable = _interopRequireDefault(require("../event/Observable"));
-var _RestUtils = require("../RestUtils");
+var _RestService = require("../RestService");
 var _ServiceCallActionHandler = _interopRequireDefault(require("../event/ServiceCallActionHandler"));
 var _AgilitySignaturePanel = _interopRequireDefault(require("./signatures/AgilitySignaturePanel"));
 var _Event = _interopRequireDefault(require("../event/Event"));
 var _EventType = _interopRequireDefault(require("../event/EventType"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const SignaturePanel = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwardRef((props, ref) => {
+const SignaturePanel = /*#__PURE__*/_react.default.memo(/*#__PURE__*/_react.default.forwardRef((props, ref) => {
   const [config, setConfig] = _react.default.useState(null);
   const [value, setValue] = _react.default.useState(null);
   const [handle] = _react.default.useState({});
@@ -44,9 +44,11 @@ const SignaturePanel = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.def
         let service = !_Utils.default.isNull(props.config.dataService) ? props.config.dataService : actionConfig !== null ? actionConfig.dataService : null;
         if (!_Utils.default.isNull(service)) {
           if (service.type === 'rpc') {
-            (0, _RestUtils.invokeRpc)(service, props.handle, props.viewId, result => {
-              setConfig(result);
-            }, e => {}, parameter => {}, null, null, event);
+            (0, _RestService.invokeRpc)({
+              service: service,
+              component: props.handle,
+              viewId: props.viewId
+            }).then(response => {}).catch(e => {});
           } else {
             if (_Utils.default.isNull(actionConfig)) {
               actionConfig = {};
@@ -60,9 +62,7 @@ const SignaturePanel = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.def
       }
     };
   };
-  return /*#__PURE__*/_react.default.createElement("div", {
-    ref: ref
-  }, config !== null ? config.documents ? props.config.provider === 'AGILITY' ? /*#__PURE__*/_react.default.createElement(_AgilitySignaturePanel.default, {
+  return /*#__PURE__*/_react.default.createElement("div", null, config !== null ? config.documents ? props.config.provider === 'AGILITY' ? /*#__PURE__*/_react.default.createElement(_AgilitySignaturePanel.default, {
     valueChangeHandler: value => {
       console.log(value);
       setValue(value);

package/dist/components/StepperTitleBar.js

@@ -9,11 +9,11 @@ var _Utils = _interopRequireDefault(require("../Utils"));
 var _ApplicationManager = _interopRequireDefault(require("../ApplicationManager"));
 var _Observable = _interopRequireDefault(require("../event/Observable"));
 var _EventType = _interopRequireDefault(require("../event/EventType"));
-var _core = require("@material-ui/core");
+var _styles = require("@mui/styles");
 require("./StepperTitleBar.css");
 var _jquery = _interopRequireDefault(require("jquery"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const useStyles = (0, _core.makeStyles)(theme => ({
+const useStyles = (0, _styles.makeStyles)(theme => ({
   theme: {
     backgroundColor: theme.palette.secondary.main
   },
@@ -21,7 +21,7 @@ const useStyles = (0, _core.makeStyles)(theme => ({
     borderColor: theme.palette.secondary.main
   }
 }));
-const StepperTitleBar = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwardRef((props, ref) => {
+const StepperTitleBar = /*#__PURE__*/_react.default.memo(/*#__PURE__*/_react.default.forwardRef((props, ref) => {
   const [steps, setSteps] = _react.default.useState(null);
   const [activeSegmentPercentage, setActiveSegmentPercentage] = _react.default.useState(null);
   const currentIndex = _react.default.useRef(null);
@@ -131,9 +131,7 @@ const StepperTitleBar = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.de
       id: 'step-container-' + counter++
     }, renderStep(step)))))));
   }
-  return /*#__PURE__*/_react.default.createElement("div", {
-    ref: ref
-  }, !_Utils.default.isNull(props.config) ? /*#__PURE__*/_react.default.createElement("div", {
+  return /*#__PURE__*/_react.default.createElement("div", null, !_Utils.default.isNull(props.config) ? /*#__PURE__*/_react.default.createElement("div", {
     style: _Utils.default.mergeStyles({
       fontSize: '24px',
       color: '#202124',

package/dist/components/TabPage.js

@@ -6,9 +6,9 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
-var _Typography = _interopRequireDefault(require("@material-ui/core/Typography"));
-var _Box = _interopRequireDefault(require("@material-ui/core/Box"));
-var _styles = require("@material-ui/core/styles");
+var _Typography = _interopRequireDefault(require("@mui/material/Typography"));
+var _Box = _interopRequireDefault(require("@mui/material/Box"));
+var _styles = require("@mui/styles");
 var _Utils = _interopRequireDefault(require("../Utils"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
@@ -28,7 +28,7 @@ const useStyles = (0, _styles.makeStyles)(theme => ({
     paddingLeft: "0px"
   }
 }));
-const TabPage = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwardRef((props, ref) => {
+const TabPage = /*#__PURE__*/_react.default.memo(/*#__PURE__*/_react.default.forwardRef((props, ref) => {
   const {
     children,
     value,
@@ -38,7 +38,6 @@ const TabPage = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.fo
   const classes = useStyles();
   let componentKey = 0;
   return /*#__PURE__*/_react.default.createElement("div", {
-    ref: ref,
     style: _Utils.default.mergeStyles({
       width: "inherit"
     }, props.config)

package/dist/components/TabPanel.js

@@ -6,9 +6,9 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _Utils = _interopRequireDefault(require("../Utils"));
-var _AppBar = _interopRequireDefault(require("@material-ui/core/AppBar"));
-var _Tab = _interopRequireDefault(require("@material-ui/core/Tab"));
-var _Tabs = _interopRequireDefault(require("@material-ui/core/Tabs"));
+var _AppBar = _interopRequireDefault(require("@mui/material/AppBar"));
+var _Tab = _interopRequireDefault(require("@mui/material/Tab"));
+var _Tabs = _interopRequireDefault(require("@mui/material/Tabs"));
 var _TabPage = _interopRequireDefault(require("./TabPage"));
 var _Section = _interopRequireDefault(require("./form/Section"));
 var _Toolbar = _interopRequireDefault(require("./Toolbar"));
@@ -22,7 +22,7 @@ function a11yProps(index) {
     'aria-controls': `simple-tabpanel-${index}`
   };
 }
-const TabPanel = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwardRef((props, ref) => {
+const TabPanel = /*#__PURE__*/_react.default.memo(/*#__PURE__*/_react.default.forwardRef((props, ref) => {
   const [tabValue, setTabValue] = _react.default.useState(0);
   const [errors, setErrors] = _react.default.useState({});
   const [componentHandles] = _react.default.useState({});
@@ -122,7 +122,6 @@ const TabPanel = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.f
     };
   };
   return /*#__PURE__*/_react.default.createElement("div", {
-    ref: ref,
     style: _Utils.default.mergeStyles({
       width: '100%'
     }, props.config)

package/dist/components/TableCellContent.js

@@ -6,43 +6,45 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _Utils = _interopRequireDefault(require("../Utils"));
-var _Error = _interopRequireDefault(require("@material-ui/icons/Error"));
+var _Error = _interopRequireDefault(require("@mui/icons-material/Error"));
 var _Tooltip = _interopRequireDefault(require("./Tooltip"));
 var _Form = _interopRequireDefault(require("./form/Form"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const TableCellContent = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwardRef((props, ref) => {
+const TableCellContent = /*#__PURE__*/_react.default.memo(/*#__PURE__*/_react.default.forwardRef((props, ref) => {
   const [contentType] = _react.default.useState(props.contentType);
   const [refresher, setRefresher] = _react.default.useState(true);
   const [editor, setEditor] = _react.default.useState(null);
   const editorValue = _react.default.useRef(null);
   const validate = value => {
-    let validator = props.validator;
-    let errors = props.row.errors;
-    if (!_Utils.default.isNull(errors)) {
-      errors = errors.filter(error => {
-        return error.column !== props.dataBinding;
-      });
-      props.row.errors = errors;
-    }
-    if (!_Utils.default.isNull(validator)) {
-      let required = false;
-      if (!_Utils.default.isNull(validator.nullable)) {
-        let nullableExpression = validator.nullable.replace(/\[#i]/g, `[${props.row.index}]`);
-        required = !_Utils.default.evaluateBooleanExpression(nullableExpression, props.dataBinding);
+    if (props.editor) {
+      let validator = props.validator;
+      let errors = props.row.errors;
+      if (!_Utils.default.isNull(errors)) {
+        errors = errors.filter(error => {
+          return error.column !== props.dataBinding;
+        });
+        props.row.errors = errors;
       }
-      let formValue = {};
-      formValue[props.editor.id] = value;
-      let validation = _Utils.default.validateField(props.dataBinding, required, formValue, value, validator);
-      if (!validation.valid) {
-        let error = {};
-        error.column = props.dataBinding;
-        error.message = validation.message;
-        if (_Utils.default.isNull(errors)) {
-          errors = [];
-          props.row.errors = errors;
+      if (!_Utils.default.isNull(validator)) {
+        let required = false;
+        if (!_Utils.default.isNull(validator.nullable)) {
+          let nullableExpression = validator.nullable.replace(/\[#i]/g, `[${props.row.index}]`);
+          required = !_Utils.default.evaluateBooleanExpression(nullableExpression, props.dataBinding);
+        }
+        let formValue = {};
+        formValue[props.editor.id] = value;
+        let validation = _Utils.default.validateField(props.dataBinding, required, formValue, value, validator);
+        if (!validation.valid) {
+          let error = {};
+          error.column = props.dataBinding;
+          error.message = validation.message;
+          if (_Utils.default.isNull(errors)) {
+            errors = [];
+            props.row.errors = errors;
+          }
+          props.row.errors.push(error);
+          return error;
         }
-        props.row.errors.push(error);
-        return error;
       }
     }
     return null;
@@ -114,6 +116,10 @@ const TableCellContent = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.d
         displayValue = new Date(contentValue).toLocaleDateString();
       } else if (contentType === 'TIME') {
         displayValue = new Date(contentValue).toLocaleTimeString();
+      } else if (contentType === 'CHECKBOX') {
+        displayValue = contentValue ? "Yes" : "No";
+      } else if (contentType === 'MULTI_FILE_UPLOAD') {
+        displayValue = contentValue.map(file => file.name).join(", ");
       } else {
         if (typeof contentValue === 'object') {
           // TODO : First check if the editor has a display template. If it does, use it to get the display value
@@ -156,8 +162,8 @@ const TableCellContent = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.d
           handle: props.handle,
           values: formValue,
           valueChangeHandler: value => {
-            editorValue.current = value[props.editor.id];
-            valueChangeHandler(value[props.editor.id]);
+            editorValue.current = value[editor.id];
+            valueChangeHandler(editorValue.current);
           },
           viewId: props.viewId
         });
@@ -171,8 +177,7 @@ const TableCellContent = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.d
     let hasError = !_Utils.default.isNull(error);
     return /*#__PURE__*/_react.default.createElement("table", {
       className: 'tableCellContentContainer',
-      border: "0",
-      ref: ref
+      border: "0"
     }, /*#__PURE__*/_react.default.createElement("tbody", null, /*#__PURE__*/_react.default.createElement("tr", null, hasError ? /*#__PURE__*/_react.default.createElement("td", {
       style: {
         width: '8px'

package/dist/components/TemplateDesigner.js

@@ -7,14 +7,14 @@ exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _Utils = _interopRequireDefault(require("../Utils"));
 var _Observable = _interopRequireDefault(require("../event/Observable"));
-var _IconButton = _interopRequireDefault(require("@material-ui/core/IconButton"));
-var _core = require("@material-ui/core");
+var _IconButton = _interopRequireDefault(require("@mui/material/IconButton"));
+var _styles = require("@mui/styles");
 var _Icon = _interopRequireDefault(require("./Icon"));
-var _Dialog = _interopRequireDefault(require("@material-ui/core/Dialog"));
-var _DialogContent = _interopRequireDefault(require("@material-ui/core/DialogContent"));
-var _DialogTitle = _interopRequireDefault(require("@material-ui/core/DialogTitle"));
+var _Dialog = _interopRequireDefault(require("@mui/material/Dialog"));
+var _DialogContent = _interopRequireDefault(require("@mui/material/DialogContent"));
+var _DialogTitle = _interopRequireDefault(require("@mui/material/DialogTitle"));
 var _Form = _interopRequireDefault(require("./form/Form"));
-var _Button = _interopRequireDefault(require("@material-ui/core/Button"));
+var _Button = _interopRequireDefault(require("@mui/material/Button"));
 var _reactPromiseTracker = require("react-promise-tracker");
 var _ApplicationManager = _interopRequireDefault(require("../ApplicationManager"));
 var _reactHtmlRenderer = _interopRequireDefault(require("react-html-renderer"));
@@ -57,7 +57,7 @@ const OPEN_DIALOG_CONFIG = {
     }]
   }]
 };
-const useStyles = (0, _core.makeStyles)(theme => ({
+const useStyles = (0, _styles.makeStyles)(theme => ({
   button: {
     margin: theme.spacing(1)
   },
@@ -116,7 +116,7 @@ const json = response => {
 };
 const templateItemEventHandler = new _TemplateItemEventHandler.default();
 const location = window.location.protocol + '//' + window.location.hostname;
-const TemplateDesigner = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwardRef((props, ref) => {
+const TemplateDesigner = /*#__PURE__*/_react.default.memo(/*#__PURE__*/_react.default.forwardRef((props, ref) => {
   const classes = useStyles();
   const [loading, setLoading] = _react.default.useState(true);
   const [value, setValue] = _react.default.useState(null);

package/dist/components/TitleBar.js

@@ -11,7 +11,7 @@ var _Observable = _interopRequireDefault(require("../event/Observable"));
 var _EventType = _interopRequireDefault(require("../event/EventType"));
 var _reactHtmlRenderer = _interopRequireDefault(require("react-html-renderer"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const TitleBar = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwardRef((props, ref) => {
+const TitleBar = /*#__PURE__*/_react.default.memo(/*#__PURE__*/_react.default.forwardRef((props, ref) => {
   const [title, setTitle] = _react.default.useState('');
   _react.default.useLayoutEffect(() => {
     props.handle.api = api();
@@ -55,7 +55,6 @@ const TitleBar = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.f
     };
   };
   return /*#__PURE__*/_react.default.createElement("div", {
-    ref: ref,
     className: 'title-bar'
   }, /*#__PURE__*/_react.default.createElement("div", {
     style: {