@agilemotion/oui-react-js 1.8.44 → 1.8.46

package/dist/BasicApp.css

@@ -1,37 +1,42 @@
 .App {
-  text-align: center;
+    text-align: center;
 }
 
 .App-logo {
-  animation: App-logo-spin infinite 20s linear;
-  height: 80px;
+    animation: App-logo-spin infinite 20s linear;
+    height: 80px;
 }
 
 .App-header {
-  background-color: #222;
-  height: 150px;
-  padding: 20px;
-  color: white;
+    background-color: #222;
+    height: 150px;
+    padding: 20px;
+    color: white;
 }
 
 .App-intro {
-  font-size: large;
+    font-size: large;
 }
 
 @keyframes App-logo-spin {
-  from { transform: rotate(0deg); }
-  to { transform: rotate(360deg); }
+    from {
+        transform: rotate(0deg);
+    }
+    to {
+        transform: rotate(360deg);
+    }
 }
 
 #pdf-frame {
-  display: none;
-  align-items: stretch;
-  position: absolute;
-  width: 100%;
-  height: 100%
+    display: none;
+    align-items: stretch;
+    position: absolute;
+    width: 100%;
+    height: 100%
 }
 
 #root {
-  height: 100%;
-  background-color: #ffffff;
+    height: 100%;
+    background-color: #ffffff;
+    overflow: hidden;
 }

package/dist/InteractionPortalApp.css

@@ -1,37 +1,42 @@
 .App {
-  text-align: center;
+    text-align: center;
 }
 
 .App-logo {
-  animation: App-logo-spin infinite 20s linear;
-  height: 80px;
+    animation: App-logo-spin infinite 20s linear;
+    height: 80px;
 }
 
 .App-header {
-  background-color: #f1f1f1;
-  height: 150px;
-  padding: 20px;
-  color: white;
+    background-color: #f1f1f1;
+    height: 150px;
+    padding: 20px;
+    color: white;
 }
 
 .App-intro {
-  font-size: large;
+    font-size: large;
 }
 
 @keyframes App-logo-spin {
-  from { transform: rotate(0deg); }
-  to { transform: rotate(360deg); }
+    from {
+        transform: rotate(0deg);
+    }
+    to {
+        transform: rotate(360deg);
+    }
 }
 
 #pdf-frame {
-  display: none;
-  align-items: stretch;
-  position: absolute;
-  width: 100%;
-  height: 100%
+    display: none;
+    align-items: stretch;
+    position: absolute;
+    width: 100%;
+    height: 100%
 }
 
 #root {
-  height: 100%;
-  background-color: #ffffff;
+    height: 100%;
+    background-color: #ffffff;
+    overflow: hidden;
 }

package/dist/components/PopupView.js

@@ -16,7 +16,7 @@ var _ApplicationManager = _interopRequireDefault(require("../ApplicationManager"
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function PopupViewDialog(props) {
   const [title, setTitle] = _react.default.useState(null);
-  const height = _Utils.default.getComponentStyleAttribute(props.view.config, 'height', '38vh');
+  const height = _Utils.default.getComponentStyleAttribute(props.view.config, 'height', '80vh');
   const width = _Utils.default.getComponentStyleAttribute(props.view.config, 'width', '60vw');
   const useStyles = (0, _styles.makeStyles)(theme => ({
     dialogPaper: {

package/dist/components/SocketManager.js

@@ -101,7 +101,7 @@ class SocketManager {
   registerOnline() {
     let userDetails = _ApplicationManager.default.getUserDetails();
     // TODO : Resolve the hardcoding
-    let profile = typeof JSON.parse(userDetails.profile) === 'string' ? userDetails.profile : 'COJ';
+    let profile = typeof (typeof userDetails.profile === 'string' || JSON.parse(userDetails.profile) === 'string') ? userDetails.profile : 'COJ';
     console.log('***** REGISTERING ONLINE ***** [' + profile + ']');
     this.emitEvent(_SocketRequest.default.REGISTER_ONLINE, {
       user: {

package/dist/components/TabPanel.js

@@ -25,6 +25,7 @@ function a11yProps(index) {
 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 [visibleTabPages, setVisibleTabPages] = _react.default.useState(null);
   const [componentHandles] = _react.default.useState({});
   const handleTabChange = (event, newValue) => {
     setTabValue(newValue);
@@ -56,6 +57,21 @@ const TabPanel = /*#__PURE__*/_react.default.memo(/*#__PURE__*/_react.default.fo
         }
       });
     }
+    if (props.config.tabPages) {
+      let allVisibleTabPages = [];
+      for (const page of props.config.tabPages) {
+        if (_Utils.default.isNull(page.id)) {
+          page.id = index + '-tab-page';
+        }
+        let parsedConfig = _Utils.default.parseConfig(page, props.viewId);
+        let visible = _Utils.default.isNull(parsedConfig.visible) || _Utils.default.evaluateBooleanExpression(parsedConfig.visible, page.id);
+        console.log("VISIBLE : " + page.id + " = " + visible + " - " + parsedConfig.visible);
+        if (visible) {
+          allVisibleTabPages.push(page);
+        }
+      }
+      setVisibleTabPages(allVisibleTabPages);
+    }
   }, []);
   function renderTabPageComponent(component, tabId, index) {
     if (_Utils.default.isNull(component.id)) {
@@ -63,7 +79,7 @@ const TabPanel = /*#__PURE__*/_react.default.memo(/*#__PURE__*/_react.default.fo
     }
     return component.type === 'formSection' ? /*#__PURE__*/_react.default.createElement(_Section.default, {
       keyHandler: props.keyHandler,
-      key: index,
+      key: component.id,
       config: component,
       handle: createComponentHandle(component),
       form: props.form,
@@ -73,12 +89,12 @@ const TabPanel = /*#__PURE__*/_react.default.memo(/*#__PURE__*/_react.default.fo
     }) : component.type === 'toolbar' ? /*#__PURE__*/_react.default.createElement(_Toolbar.default, {
       config: component,
       handle: createComponentHandle(component),
-      key: index,
+      key: component.id,
       viewId: props.viewId
     }) : component.type === 'layout' ? /*#__PURE__*/_react.default.createElement(_Layout.Layout, {
       config: component,
       handle: createComponentHandle(component),
-      key: index,
+      key: component.id,
       viewId: props.viewId
     }) : /*#__PURE__*/_react.default.createElement("div", null, 'Unsupported component type ' + component.type);
   }
@@ -103,7 +119,7 @@ const TabPanel = /*#__PURE__*/_react.default.memo(/*#__PURE__*/_react.default.fo
         for (const property of properties) {
           let componentHandle = componentHandles[property];
           children.push(componentHandle);
-          if (!_Utils.default.isNull(componentHandle.api.getChildren)) {
+          if (!_Utils.default.isNull(componentHandle.api?.getChildren)) {
             for (const child of componentHandle.api.getChildren()) {
               children.push(child);
             }
@@ -128,7 +144,7 @@ const TabPanel = /*#__PURE__*/_react.default.memo(/*#__PURE__*/_react.default.fo
       }
     };
   };
-  return /*#__PURE__*/_react.default.createElement("div", {
+  return !_Utils.default.isNull(visibleTabPages) && /*#__PURE__*/_react.default.createElement("div", {
     style: _Utils.default.mergeStyles({
       width: '100%'
     }, props.config)
@@ -158,7 +174,7 @@ const TabPanel = /*#__PURE__*/_react.default.memo(/*#__PURE__*/_react.default.fo
         minWidth: 120
       }
     }
-  }, props?.config?.tabPages?.length > 0 ? props.config.tabPages.map((page, index) => /*#__PURE__*/_react.default.createElement(_Tab.default, _extends({
+  }, visibleTabPages.map((page, index) => /*#__PURE__*/_react.default.createElement(_Tab.default, _extends({
     key: index,
     label: page.attributes['label'],
     wrapped: true // allow multi-line label
@@ -174,16 +190,13 @@ const TabPanel = /*#__PURE__*/_react.default.memo(/*#__PURE__*/_react.default.fo
       // keep original casing
       color: _ApplicationManager.default.isFormMarkersEnabled() && errors !== null && errors[page.id] === true ? '#ed5249' : undefined
     }
-  }))) : null)), !_Utils.default.isNull(props.config) && !_Utils.default.isNull(props.config.tabPages) && props.config.tabPages.length > 0 ? props.config.tabPages.map((page, index) => {
-    if (_Utils.default.isNull(page.id)) {
-      page.id = index + '-tab-page';
-    }
+  }))))), visibleTabPages.map((page, index) => {
     return /*#__PURE__*/_react.default.createElement(_TabPage.default, {
       value: tabValue,
       key: index,
       index: index,
       config: page
     }, renderPage(page, index));
-  }) : null);
+  }));
 }));
 var _default = exports.default = TabPanel;

package/dist/components/Toolbar.js

@@ -203,6 +203,20 @@ const Toolbar = props => {
       }, renderItem(item, defaultId));
     })));
   }
+  function getChildren() {
+    let children = [];
+    let properties = Object.getOwnPropertyNames(buttonItemHandles);
+    for (const property of properties) {
+      let itemHandle = buttonItemHandles[property];
+      children.push(itemHandle);
+    }
+    properties = Object.getOwnPropertyNames(menuItemHandles);
+    for (const property of properties) {
+      let itemHandle = menuItemHandles[property];
+      children.push(itemHandle);
+    }
+    return children;
+  }
   const api = () => {
     return {
       get id() {
@@ -213,18 +227,7 @@ const Toolbar = props => {
         return props.tableRow;
       },
       getChildren: () => {
-        let children = [];
-        let properties = Object.getOwnPropertyNames(buttonItemHandles);
-        for (const property of properties) {
-          let itemHandle = buttonItemHandles[property];
-          children.push(itemHandle);
-        }
-        properties = Object.getOwnPropertyNames(menuItemHandles);
-        for (const property of properties) {
-          let itemHandle = menuItemHandles[property];
-          children.push(itemHandle);
-        }
-        return children;
+        return getChildren();
       },
       set visible(visible) {
         setVisible(visible);
@@ -232,7 +235,11 @@ const Toolbar = props => {
       refresh() {
         let parsedConfig = _Utils.default.parseConfig(props.config, props.viewId);
         setVisible(_Utils.default.evaluateBooleanExpression(parsedConfig.visible, parsedConfig.id, true));
-        let requiredNewVal = !_Utils.default.isNull(parsedConfig.validator) ? !_Utils.default.evaluateBooleanExpression(parsedConfig.validator.nullable, parsedConfig.id, true) || _Utils.default.evaluateBooleanExpression(parsedConfig.validator.required, parsedConfig.id, false) : false;
+        for (const child of getChildren()) {
+          if (child.api && child.api.refresh) {
+            child.api.refresh();
+          }
+        }
       }
     };
   };

package/dist/components/dashboard/SideMenuModuleDashboard.css

@@ -60,6 +60,5 @@
 
     .side-menu-module-dashboard  .sidebar {
         width: 260px !important;
-        border: 20px solid red;
     }
 }

package/dist/components/form/BaseField.js

@@ -42,16 +42,23 @@ const BaseField = props => {
     if (boundValue && !initialValueBound.current) {
       initialValueBound.current = true;
       if (props.config.fieldType === 'SELECT' || props.config.fieldType === 'LOOKUP') {
-        console.log("BINDING : " + props.config.id, valueObject[valueProperty]);
         if (!boundValue || _Utils.default.isNull(boundValue.id)) {
           setValue(null);
           valueRef.current = null;
         } else {
-          setValue(boundValue);
+          if (props.valueParser) {
+            setValue(props.valueParser(boundValue, true));
+          } else {
+            setValue(boundValue);
+          }
           valueRef.current = boundValue;
         }
       } else {
-        setValue(boundValue);
+        if (props.valueParser) {
+          setValue(props.valueParser(boundValue, true));
+        } else {
+          setValue(boundValue);
+        }
         valueRef.current = boundValue;
       }
     }

package/dist/components/form/GridField.js

@@ -66,11 +66,25 @@ const GridFieldWrapper = /*#__PURE__*/_react.default.memo(/*#__PURE__*/_react.de
       setLabel(_Utils.default.getComponentAttribute(props.config, 'label', ''));
     }
   }, []);
+  function setNewRows(values) {
+    if (Array.isArray(values)) {
+      let newRows = [];
+      for (const value of values) {
+        if (value) {
+          newRows.push(value);
+        }
+      }
+      setRows(newRows);
+    }
+  }
   _react.default.useEffect(() => {
     if (!_Utils.default.isNull(base.value) && !initialValueSet.current) {
-      setRows([].concat(base.value));
+      setNewRows(base.value);
     }
   }, [base.value]);
+  _react.default.useEffect(() => {
+    initialValueSet.current = false;
+  }, [base.valueObject[base.valueProperty]]);
   return /*#__PURE__*/_react.default.createElement("div", {
     className: "MuiFormControl-root MuiTextField-root MuiFormControl-marginDense",
     style: _Utils.default.mergeStyles({}, props.config)

package/dist/components/form/SelectItem.js

@@ -20,18 +20,27 @@ const SelectItemComponent = props => {
   const width = !_Utils.default.isNull(props.config.attributes?.style?.width) ? props.config.attributes.style.width : "100%";
   const maxWidth = !_Utils.default.isNull(props.config.attributes?.style?.maxWidth) ? props.config.attributes.style.maxWidth : null;
   const minWidth = !_Utils.default.isNull(props.config.attributes?.style?.minWidth) ? props.config.attributes.style.minWidth : "240px";
-  _react.default.useEffect(() => {
-    if (!_Utils.default.isNull(base.value) && !optionsLoaded) {
+  function processValueChange(newValue, isOptionsLoaded) {
+    console.log("\n\n\n\nPROCESSING : ", newValue, isOptionsLoaded);
+    if (!_Utils.default.isNull(newValue) && !isOptionsLoaded) {
       let defaultOptions = [];
-      defaultOptions.push(base.value);
+      defaultOptions.push(newValue);
       base.setSelectOptions(defaultOptions);
       setOptionsLoaded(true);
+      console.log("DEFAULT SETTINGS SET");
     }
-    if (_Utils.default.isNull(initialValue.current) && !_Utils.default.isNull(base.value)) {
-      initialValue.current = base.value;
+    if (_Utils.default.isNull(initialValue.current) && !_Utils.default.isNull(newValue)) {
+      initialValue.current = newValue;
     }
-    setValue(base.value?.id);
+    setValue(newValue ? newValue.id : '');
+  }
+  _react.default.useEffect(() => {
+    processValueChange(base.value, optionsLoaded);
   }, [base.value]);
+  _react.default.useEffect(() => {
+    initialValue.current = null;
+    processValueChange(base.valueObject[base.valueProperty], false);
+  }, [base.valueObject[base.valueProperty]]);
   _react.default.useEffect(() => {
     if (!_Utils.default.isNull(base.selectOptions) && base.selectOptions.length > 0) {
       if (initialValue.current) {
@@ -60,7 +69,9 @@ const SelectItemComponent = props => {
         base.setSelectOptions(options);
       }).catch(e => {
         console.error(e);
-        _Utils.default.publishErrorMessage(e, props.viewId);
+        if (e.errorType !== 'INVALID_PARAMETER') {
+          _Utils.default.publishErrorMessage(e, props.viewId);
+        }
       });
       setOptionsLoaded(true);
     }

package/dist/components/form/TimePicker.js

@@ -19,7 +19,6 @@ 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 CustomTimePickerComponent = props => {
   const base = props.base;
-  const defaultDate = !_Utils.default.isNull(base.valueObject[base.valueProperty]) ? new Date(base.valueObject[base.valueProperty]) : null;
   let minWidth = _Utils.default.getComponentAttribute(props.config, 'minWidth', '240px');
   let width = _Utils.default.getComponentAttribute(props.config, 'width', '100%');
   const handleDateChange = date => {
@@ -27,8 +26,8 @@ const CustomTimePickerComponent = props => {
     base.handleValueChange(date);
   };
   _react.default.useEffect(() => {
-    base.setValue(defaultDate);
-  }, [props.base.valueObject[props.base.valueProperty]]);
+    base.setValue(base.value);
+  }, [base.value]);
   const secondaryColor = (0, _reactRedux.useSelector)(state => state.dashboard.secondaryThemeColor);
   const style = {
     minWidth: minWidth,
@@ -68,16 +67,24 @@ const TimePicker = props => {
     valueParser: (value, inbound) => {
       if (!_Utils.default.isNull(value)) {
         if (!value.toString().includes("T")) {
-          if (typeof value === 'string') {
-            const [hours, minutes] = value.split(":").map(Number);
+          if (typeof value === "string") {
+            const parts = value.split(":");
+            const hours = Number(parts[0] ?? 0);
+            const minutes = Number(parts[1] ?? 0);
+            let seconds = 0;
+            if (parts[2]) {
+              seconds = Number(parts[2].split(".")[0] ?? 0);
+            }
             const dateObject = new Date();
-            dateObject.setHours(hours, minutes, 0, 0);
-            return inbound ? dateObject : dateObject.toLocaleTimeString('it-IT');
+            dateObject.setHours(hours, minutes, seconds, 0);
+            return inbound ? dateObject : dateObject.toLocaleTimeString("it-IT");
           }
           return value;
         }
       }
-      return !_Utils.default.isNull(value) ? inbound ? new Date(value) : new Date(value).toLocaleTimeString('it-IT') : null;
+
+      // date-time value (contains "T") or something parsable by Date
+      return !_Utils.default.isNull(value) ? inbound ? new Date(value) : new Date(value).toLocaleTimeString("it-IT") : null;
     }
   }), base => /*#__PURE__*/_react.default.createElement(CustomTimePickerComponent, _extends({
     base: base

package/dist/components/layout/Layout.js

@@ -301,6 +301,23 @@ const Layout = props => {
       }
     }
   }
+  function getChildren() {
+    let children = [];
+    let properties = Object.getOwnPropertyNames(componentHandles);
+    for (const property of properties) {
+      let componentHandle = componentHandles[property];
+      children.push(componentHandle);
+      if (!_Utils.default.isNull(componentHandle.api) && !_Utils.default.isNull(componentHandle.api.getChildren)) {
+        let moreChildren = componentHandle.api.getChildren();
+        if (!_Utils.default.isNull(moreChildren)) {
+          for (const child of moreChildren) {
+            children.push(child);
+          }
+        }
+      }
+    }
+    return children;
+  }
   const api = () => {
     return {
       get id() {
@@ -311,27 +328,18 @@ const Layout = props => {
         setVisible(val);
       },
       getChildren: () => {
-        let children = [];
-        let properties = Object.getOwnPropertyNames(componentHandles);
-        for (const property of properties) {
-          let componentHandle = componentHandles[property];
-          children.push(componentHandle);
-          if (!_Utils.default.isNull(componentHandle.api) && !_Utils.default.isNull(componentHandle.api.getChildren)) {
-            let moreChildren = componentHandle.api.getChildren();
-            if (!_Utils.default.isNull(moreChildren)) {
-              for (const child of moreChildren) {
-                children.push(child);
-              }
-            }
-          }
-        }
-        return children;
+        return getChildren();
       },
       refresh() {
         if (!_Utils.default.isNull(props.config.visible)) {
           let parsedConfig = _Utils.default.parseConfig(props.config, props.viewId);
           setVisible(_Utils.default.evaluateBooleanExpression(parsedConfig.visible, props.config.id));
         }
+        for (const child of getChildren()) {
+          if (child.api && child.api.refresh) {
+            child.api.refresh();
+          }
+        }
       }
     };
   };

package/dist/components/layout/Window.js

@@ -216,7 +216,6 @@ const Window = props => {
       paper.style.right = '0';
       paper.style.position = 'absolute';
       paper.style.top = '72px';
-      paper.style.border = '20px solid red';
       paper.style.left = (isNaN(getLeftOffset()) ? '328' : getLeftOffset()) + 'px';
       let header = document.getElementsByClassName('dialogHeader')[0];
       header.getElementsByTagName('button')[0].style.color = 'rgba(0, 0, 0, 0.54)';

package/dist/components/layout/WindowDialog.js

@@ -16,7 +16,8 @@ const withStyledDialog = Component => (0, _withStyles.default)(theme => ({
     pointerEvents: "none",
     zIndex: 0,
     left: 'unset',
-    borderRadius: '4px'
+    borderRadius: '4px',
+    position: 'unset'
   },
   paper: props => ({
     pointerEvents: "auto",

package/dist/components/media/Toolbar.js

@@ -730,7 +730,7 @@ const Toolbar = props => {
     }
   }, /*#__PURE__*/_react.default.createElement(_material.ListItemIcon, null, /*#__PURE__*/_react.default.createElement(_Icon.default, {
     id: 'CHAT_BUBBLE'
-  })), /*#__PURE__*/_react.default.createElement("div", null, hasUnreadChats ? '1' : '', "\xA0Chat"))), !buttonVisibility.minutes && roomStatus === 'SESSION' && /*#__PURE__*/_react.default.createElement("div", {
+  })), /*#__PURE__*/_react.default.createElement("div", null, hasUnreadChats ? '1' : '', "\xA0Chat"))), isHost && !buttonVisibility.minutes && roomStatus === 'SESSION' && /*#__PURE__*/_react.default.createElement("div", {
     className: 'button-wrapper no-margin no-padding'
   }, /*#__PURE__*/_react.default.createElement(_material.MenuItem, {
     onClick: () => {

package/dist/components/media/VCRoomParticipant.css

@@ -10,6 +10,17 @@
   background-color: #f9f9f9;
 }
 
+.people-content-list {
+    margin: 4px;
+}
+
+.person-card-wrapper {
+    border: 1px solid rgb(233, 233, 233);
+    border-radius: 4px;
+    background-color: rgb(233, 233, 233);
+    margin-bottom: 2px;
+}
+
 .meeting-participant-container-current-user {
   min-width: 212px;
   min-height: 150px;

package/dist/components/media/VCRoomParticipant.js

@@ -586,14 +586,26 @@ const VCRoomParticipant = props => {
   }), /*#__PURE__*/_react.default.createElement("div", {
     className: props.sizing === 'sm' ? 'name-label-sm' : 'name-label',
     style: {
+      display: 'flex',
       position: 'absolute',
+      width: '100%',
       bottom: props.isCurrentUser ? '12px' : '0',
       padding: props.isCurrentUser ? '4px 16px' : props.sizing !== 'sm' ? '4px' : '4px'
     }
-  }, !props.isCurrentUser && getParticipantName(), !props.isCurrentUser && /*#__PURE__*/_react.default.createElement("span", {
+  }, /*#__PURE__*/_react.default.createElement("div", {
     style: {
+      width: '50%',
+      display: 'flex',
+      justifyContent: 'flex-start',
       marginLeft: '4px'
     }
+  }, !props.isCurrentUser && getParticipantName(), props.isCurrentUser && 'You'), !props.isCurrentUser && /*#__PURE__*/_react.default.createElement("div", {
+    style: {
+      marginLeft: '4px',
+      display: 'flex',
+      justifyContent: 'flex-end',
+      width: '50%'
+    }
   }, props.isHost && !audioMuted ? /*#__PURE__*/_react.default.createElement(_IconButton.default, {
     onClick: e => {
       props.onHostAudioMute(props.data);
@@ -623,22 +635,14 @@ const VCRoomParticipant = props => {
   }, /*#__PURE__*/_react.default.createElement(_Icon.default, {
     id: 'CAMERA'
   }))), props.isCurrentUser && /*#__PURE__*/_react.default.createElement("div", {
-    className: 'row',
+    className: 'row no-margin no-padding',
     style: {
-      width: '216px'
+      width: '100%'
     }
   }, /*#__PURE__*/_react.default.createElement("div", {
     className: 'col no-margin no-padding',
     style: {
-      textAlign: 'left'
-    }
-  }, /*#__PURE__*/_react.default.createElement("span", {
-    style: {
-      marginLeft: '4px'
-    }
-  }, "You")), /*#__PURE__*/_react.default.createElement("div", {
-    className: 'col no-margin no-padding',
-    style: {
+      width: '50%',
       display: 'flex',
       justifyContent: 'flex-end'
     }
@@ -681,7 +685,8 @@ const VCRoomParticipant = props => {
         filter: 'drop-shadow(0px 2px 8px rgba(0,0,0,0.32))',
         mt: 1.5,
         '& .MuiList-root': {
-          border: '1px solid red'
+          border: '1px solid #e1e1e1',
+          borderRadius: '4px'
         },
         '& .MuiAvatar-root': {
           width: 32,

package/dist/components/media/VCRoomWorkspace.js

@@ -810,10 +810,15 @@ const VCRoomWorkspace = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
       height: '100%'
     }
   }, renderStrip())), /*#__PURE__*/_react.default.createElement("div", {
-    className: `${(displayState === 'MAXIMIZED' ? 'col ' : '') + 'no-margin no-padding'}`,
+    className: `${displayState === 'MAXIMIZED' ? 'col ' : ''}`,
     style: {
       width: '200px',
-      height: '148px'
+      height: '148px',
+      display: 'flex',
+      alignItems: 'center',
+      justifyContent: 'flex-end',
+      marginLeft: '16px',
+      marginRight: '0'
     }
   }, renderCurrentParticipant())), waitingList && waitingList.length > 0 && /*#__PURE__*/_react.default.createElement("div", {
     className: 'no-side-margin no-side-padding grid-side-bar',

package/dist/components/menu/MenuItem.js

@@ -72,6 +72,6 @@ const MenuItem = props => {
     },
     righticon: props.mode === 'cascaded' && !_Utils.default.isNull(props.menuItems) && props.menuItems.length > 0 ? /*#__PURE__*/_react.default.createElement(_chevronRight.default, null) : null,
     menuitems: props.menuItems
-  }, config.attributes['label']);
+  }, config.attributes?.label);
 };
 var _default = exports.default = MenuItem;

package/dist/js/ProcurementMeetings.js

@@ -16,21 +16,23 @@ class ProcurementMeetings {
   emitSocketEvent = (viewId, systemEventType, data, meeting) => {
     return new Promise((resolve, reject) => {
       let recipientIds = [];
-      for (const attendee of meeting.attendees) {
-        let username = attendee.username;
-        if (username !== _ApplicationManager.default.getUserDetails().username) {
-          recipientIds.push(username);
+      if (meeting) {
+        for (const attendee of meeting.attendees) {
+          let username = attendee.username;
+          if (username !== _ApplicationManager.default.getUserDetails().username) {
+            recipientIds.push(username);
+          }
         }
+        let eventData = {
+          systemEventType: systemEventType,
+          recipients: recipientIds,
+          data: data
+        };
+        _SocketManager.default.emitEvent(_VCEventType.VCEventType.SYSTEM_EVENT, eventData).then(result => resolve(result)).catch(e => {
+          _ApplicationManager.default.alert(viewId, "You are currently offline. Please check your network connectivity", "ERROR");
+          reject(e);
+        });
       }
-      let eventData = {
-        systemEventType: systemEventType,
-        recipients: recipientIds,
-        data: data
-      };
-      _SocketManager.default.emitEvent(_VCEventType.VCEventType.SYSTEM_EVENT, eventData).then(result => resolve(result)).catch(e => {
-        _ApplicationManager.default.alert(viewId, "You are currently offline. Please check your network connectivity", "ERROR");
-        reject(e);
-      });
     });
   };
   startMeeting = meeting => {
@@ -64,14 +66,10 @@ class ProcurementMeetings {
       _ApplicationManager.default.resolveComponentApi("vcRoom").loadChats();
     } else if (event.systemEventType === 'meetingStepChanged') {
       let api = _ApplicationManager.default.resolveComponentApi(viewId);
-      if (api.model.currentMeetingStep === 'QUORUM' && data.step === 'COMPLIANCE_EVALUATION') {
-        this.showComponent("preEvaluationNext");
-      } else if (api.model.currentMeetingStep === 'PRE_COMPLIANCE_EVALUATION' && data.step === 'FUNCTIONAL_EVALUATION') {
-        this.showComponent("complianceEvaluationNext");
-      } else if (api.model.currentMeetingStep === 'COMPLIANCE_EVALUATION' && data.step === 'PRICE_EVALUATION') {
-        this.showComponent("functionalEvaluationNext");
-      } else if (api.model.currentMeetingStep === 'FUNCTIONAL_EVALUATION' && data.step === 'CONDITION_OF_AWARD') {
-        this.showComponent("priceEvaluationNext");
+      api.model.currentStep = data.step;
+      let component = _ApplicationManager.default.resolveComponentApi("toolbar");
+      if (component) {
+        component.refresh();
       }
     }
   };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@agilemotion/oui-react-js",
-  "version": "1.8.44",
+  "version": "1.8.46",
   "description": "AgileMotion React UI Component Library - A comprehensive collection of dashboard components, forms, media controls, and more",
   "license": "ISC",
   "author": "",