@agilemotion/oui-react-js 1.8.9 → 1.8.12

package/dist/Utils.js

@@ -324,7 +324,7 @@ class Utils {
     let properties = Object.getOwnPropertyNames(source);
     let result = JSON.parse(JSON.stringify(target));
     for (const property of properties) {
-      result[property] = source[property];
+      result[property] = _ApplicationManager.default.isExpression(source[property]) ? Utils.evaluateBooleanExpression(source[property], property) : source[property];
     }
     return result;
   }

package/dist/components/DataGrid.js

@@ -811,7 +811,7 @@ const DataGrid = exports.DataGrid = /*#__PURE__*/_react.default.memo(/*#__PURE__
         height: '100%'
       },
       align: "left",
-      className: isItemSelected && !_Utils.default.isNull(props.form) && !_Utils.default.isNull(column.editor) ? 'editCell' : null,
+      className: !props.disabled && isItemSelected && !_Utils.default.isNull(props.form) && !_Utils.default.isNull(column.editor) ? 'editCell' : null,
       key: index + "_" + column.id
     }, /*#__PURE__*/_react.default.createElement(_Layout.Layout, {
       handle: createColumnLayoutHandle(column, index),
@@ -827,14 +827,14 @@ const DataGrid = exports.DataGrid = /*#__PURE__*/_react.default.memo(/*#__PURE__
         height: '100%'
       },
       align: "left",
-      className: isItemSelected && !_Utils.default.isNull(column.editor) ? 'editCell' : null,
+      className: !props.disabled && isItemSelected && !_Utils.default.isNull(column.editor) ? 'editCell' : null,
       key: index + "_" + column.id,
       onClick: event => handleCellClick(event, row.id, column)
     }, /*#__PURE__*/_react.default.createElement(_TableCellContent.default, {
       onRowError: rowErrorHandler,
       handle: createCellEditorHandle(column),
       viewId: props.viewId,
-      editor: column.editor,
+      editor: !props.disabled ? column.editor : null,
       ref: /*#__PURE__*/_react.default.createRef(),
       refCallback: createCell,
       selected: isItemSelected,

package/dist/components/TableCellContent.js

@@ -92,6 +92,11 @@ const TableCellContent = /*#__PURE__*/_react.default.memo(/*#__PURE__*/_react.de
       valueChangeHandler(_Utils.default.isNull(value) ? null : value);
     }
   }, [props.editor]);
+  const formatDate = contentValue => {
+    const date = new Date(contentValue);
+    const formatted = `${String(date.getDate()).padStart(2, '0')}/` + `${String(date.getMonth() + 1).padStart(2, '0')}/` + `${date.getFullYear()}`;
+    return formatted;
+  };
   const getStaticDisplayValue = () => {
     let displayValue;
     let contentValue;
@@ -116,7 +121,7 @@ const TableCellContent = /*#__PURE__*/_react.default.memo(/*#__PURE__*/_react.de
       if (_Utils.default.isNull(contentValue)) {
         displayValue = '';
       } else if (contentType === 'DATE') {
-        displayValue = new Date(contentValue).toLocaleDateString();
+        displayValue = formatDate(contentValue);
       } else if (contentType === 'TIME') {
         displayValue = new Date(contentValue).toLocaleTimeString();
       } else if (contentType === 'CHECKBOX') {

package/dist/components/form/BaseField.js

@@ -27,6 +27,8 @@ const BaseField = props => {
   const [disabled, setDisabled] = _react.default.useState(false);
   const [visible, setVisible] = _react.default.useState(false);
   const [required, setRequired] = _react.default.useState(null);
+  const [minDate, setMinDate] = _react.default.useState(null);
+  const [maxDate, setMaxDate] = _react.default.useState(null);
   const validateOnChange = _react.default.useRef();
   const ref = _react.default.useRef(null);
   const valid = _react.default.useRef(false);
@@ -258,6 +260,12 @@ const BaseField = props => {
       set required(isRequired) {
         setRequired(isRequired);
       },
+      set minDate(minDate) {
+        setMinDate(minDate);
+      },
+      set maxDate(maxDate) {
+        setMaxDate(maxDate);
+      },
       setFieldRequired(newVal) {
         let validate = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
         validateOnChange.current = validate;
@@ -286,6 +294,8 @@ const BaseField = props => {
       display: !visible || _Utils.default.getComponentAttribute(config, 'hidden', false) === true ? 'none' : 'block'
     }
   }, /*#__PURE__*/_react.default.createElement("span", null, props.children({
+    minDate: minDate,
+    maxDate: maxDate,
     required: required,
     disabled: disabled,
     valueObject: valueObject,

package/dist/components/form/DatePicker.js

@@ -11,7 +11,6 @@ var _BaseField = require("./BaseField");
 var _reactRedux = require("react-redux");
 var _DynamicJS = _interopRequireDefault(require("../../DynamicJS"));
 var _xDatePickers = require("@mui/x-date-pickers");
-var _demo = require("@mui/x-date-pickers/internals/demo");
 var _AdapterDayjs = require("@mui/x-date-pickers/AdapterDayjs");
 var _dayjs = _interopRequireDefault(require("dayjs"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
@@ -34,7 +33,7 @@ const CustomDatePickerComponent = /*#__PURE__*/_react.default.memo(/*#__PURE__*/
     return n < 10 ? '0' + n : n;
   };
   const getLimitDate = id => {
-    let dateAttr = props.config[id];
+    let dateAttr = props.config.attributes ? props.config.attributes[id] : null;
     if (dateAttr) {
       if (dateAttr.toString().includes('now')) {
         let operator = dateAttr.toString().includes("-") ? '-' : '+';
@@ -64,17 +63,19 @@ const CustomDatePickerComponent = /*#__PURE__*/_react.default.memo(/*#__PURE__*/
   _react.default.useEffect(() => {
     if (minDate === null) {
       setMinDate(getLimitDate("minDate"));
-    } else {
-      setMinDate(minDate);
     }
   }, [minDate]);
   _react.default.useEffect(() => {
     if (maxDate === null) {
       setMaxDate(getLimitDate("maxDate"));
-    } else {
-      setMaxDate(maxDate);
     }
   }, [maxDate]);
+  _react.default.useEffect(() => {
+    setMinDate(base.minDate);
+  }, [base.minDate]);
+  _react.default.useEffect(() => {
+    setMaxDate(base.maxDate);
+  }, [maxDate]);
   const secondaryColor = (0, _reactRedux.useSelector)(state => state.dashboard.secondaryThemeColor);
   const style = _Utils.default.mergeStyles({
     minWidth: minWidth,
@@ -83,8 +84,6 @@ const CustomDatePickerComponent = /*#__PURE__*/_react.default.memo(/*#__PURE__*/
   }, props.config);
   return /*#__PURE__*/_react.default.createElement(_xDatePickers.LocalizationProvider, {
     dateAdapter: _AdapterDayjs.AdapterDayjs
-  }, /*#__PURE__*/_react.default.createElement(_demo.DemoContainer, {
-    components: ['DatePicker', 'DatePicker']
   }, /*#__PURE__*/_react.default.createElement(_xDatePickers.DatePicker, {
     disabled: base.disabled,
     label: props.config.attributes['label'],
@@ -92,6 +91,7 @@ const CustomDatePickerComponent = /*#__PURE__*/_react.default.memo(/*#__PURE__*/
     className: props.className,
     onChange: newValue => handleDateChange(newValue.toDate()),
     error: base.hasError,
+    format: "DD/MM/YYYY",
     slotProps: {
       textField: {
         variant: "outlined",
@@ -106,7 +106,7 @@ const CustomDatePickerComponent = /*#__PURE__*/_react.default.memo(/*#__PURE__*/
     },
     minDate: (0, _dayjs.default)(minDate),
     maxDate: (0, _dayjs.default)(maxDate)
-  })));
+  }));
 }));
 const DatePicker = props => {
   return /*#__PURE__*/_react.default.createElement(_BaseField.BaseField, _extends({}, props, {

package/dist/components/form/GridField.js

@@ -135,6 +135,7 @@ const GridFieldWrapper = /*#__PURE__*/_react.default.memo(/*#__PURE__*/_react.de
     handle: props.gridHandle,
     ref: /*#__PURE__*/_react.default.createRef(),
     viewId: props.viewId,
+    disabled: base.disabled,
     rows: rows,
     formValues: props.values,
     valueChangeHandler: newRows => {

package/dist/components/layout/CollapsiblePanel.css

@@ -1,9 +1,9 @@
-.coll-panel-container {
-    font-family: sans-serif;
-    text-align: center;
-}
-
-.coll-panel-btn:focus {
-    outline: 0;
-    box-shadow: none;
-}
+.coll-panel-container {
+    font-family: sans-serif;
+    text-align: center;
+}
+
+.coll-panel-btn:focus {
+    outline: 0;
+    box-shadow: none;
+}

package/dist/components/layout/View.css

@@ -1,68 +1,68 @@
-.view {
-    padding: 0 32px;
-    background-color: #ffffff;
-    border-radius: 4px;
-}
-
-.window-unpinned .view {
-    width: 0 !important;;
-}
-
-.window-pinned .view {
-    padding: 0 8px;
-}
-
-.no-margin {
-    margin-left: 0 !important;
-    margin-right: 0 !important;
-}
-
-.no-padding {
-    padding-left: 0 !important;
-    padding-right: 0 !important;
-}
-
-.centered-flex-box {
-    display: flex;
-    align-Items: center;
-    justify-content: center
-}
-
-/* Smartphones (landscape); */
-@media only screen and (min-device-width : 361px) and (max-device-width : 480px) {
-    .view {
-        padding: 0 16px;
-    }
-}
-
-/* Smartphones (portrait); */
-@media only screen and (min-device-width : 280px) and (max-device-width : 360px) {
-    .view {
-        padding: 0 16px;
-    }
-}
-
-/* iPads (portrait and landscape); */
-@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
-    .view {
-        padding: 0 24px;
-    }
-}
-
-/* iPad 3 */
-@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) and (-webkit-min-device-pixel-ratio : 2) {
-    .view {
-        padding: 0 24px;
-    }
-}
-
-/* small desktop screens */
-@media only screen and (max-width : 600px) {
-}
-
-/* low resolution desktop */
-@media only screen and (max-width : 1200px) {
-    .view {
-
-    }
-}
+.view {
+    padding: 0 32px;
+    background-color: #ffffff;
+    border-radius: 4px;
+}
+
+.window-unpinned .view {
+    width: 0 !important;;
+}
+
+.window-pinned .view {
+    padding: 0 8px;
+}
+
+.no-margin {
+    margin-left: 0 !important;
+    margin-right: 0 !important;
+}
+
+.no-padding {
+    padding-left: 0 !important;
+    padding-right: 0 !important;
+}
+
+.centered-flex-box {
+    display: flex;
+    align-Items: center;
+    justify-content: center
+}
+
+/* Smartphones (landscape); */
+@media only screen and (min-device-width : 361px) and (max-device-width : 480px) {
+    .view {
+        padding: 0 16px;
+    }
+}
+
+/* Smartphones (portrait); */
+@media only screen and (min-device-width : 280px) and (max-device-width : 360px) {
+    .view {
+        padding: 0 16px;
+    }
+}
+
+/* iPads (portrait and landscape); */
+@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
+    .view {
+        padding: 0 24px;
+    }
+}
+
+/* iPad 3 */
+@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) and (-webkit-min-device-pixel-ratio : 2) {
+    .view {
+        padding: 0 24px;
+    }
+}
+
+/* small desktop screens */
+@media only screen and (max-width : 600px) {
+}
+
+/* low resolution desktop */
+@media only screen and (max-width : 1200px) {
+    .view {
+
+    }
+}

package/dist/components/loader.css

@@ -1,36 +1,36 @@
-.loaderModal {
-	display: block; /* Hidden by default */
-	position: fixed; /* Stay in place */
-	z-index: 3000; /* Sit on top */
-	left: 0;
-	top: 0;
-	width: 100vw; /* Full width */
-	height: 100vh; /* Full height */
-	overflow: auto; /* Enable scroll if needed */
-	background-color: rgb(0,0,0); /* Fallback color */
-	background-color: rgba(0,0,0,0.1); /* Black w/ opacity */
-}
-
-/* Modal Content/Box */
-.modal-content {
-	background-color: transparent;
-	margin: 30% auto; /* 15% from the top and centered */
-	padding: 20px;
-	border: 1px solid #888;
-	width: 10%; /* Could be more or less, depending on screen size */
-}
-
-/* The Close Button */
-.close {
-	color: #aaa;
-	float: right;
-	font-size: 28px;
-	font-weight: bold;
-}
-
-.close:hover,
-.close:focus {
-	color: black;
-	text-decoration: none;
-	cursor: pointer;
-}
+.loaderModal {
+	display: block; /* Hidden by default */
+	position: fixed; /* Stay in place */
+	z-index: 3000; /* Sit on top */
+	left: 0;
+	top: 0;
+	width: 100vw; /* Full width */
+	height: 100vh; /* Full height */
+	overflow: auto; /* Enable scroll if needed */
+	background-color: rgb(0,0,0); /* Fallback color */
+	background-color: rgba(0,0,0,0.1); /* Black w/ opacity */
+}
+
+/* Modal Content/Box */
+.modal-content {
+	background-color: transparent;
+	margin: 30% auto; /* 15% from the top and centered */
+	padding: 20px;
+	border: 1px solid #888;
+	width: 10%; /* Could be more or less, depending on screen size */
+}
+
+/* The Close Button */
+.close {
+	color: #aaa;
+	float: right;
+	font-size: 28px;
+	font-weight: bold;
+}
+
+.close:hover,
+.close:focus {
+	color: black;
+	text-decoration: none;
+	cursor: pointer;
+}

package/dist/components/media/Video.css

@@ -1,4 +1,4 @@
-.user-video {
-    min-width: 280px;
-    height: 280px;
-}
+.user-video {
+    min-width: 280px;
+    height: 280px;
+}

package/dist/components/signatures/ResponsiveTable.css

@@ -1,91 +1,91 @@
-.table thead th {
-}
-
-table.responsive-table {
-    display: table;
-    /* required for table-layout to be used (not normally necessary; included for completeness) */
-    table-layout: fixed;
-    /* this keeps your columns with fixed with exactly the right width */
-    width: 100% !important;
-    /* table must have width set for fixed layout to work as expected */
-    height: 100%;
-}
-
-table.responsive-table thead {
-        position: fixed;
-        top: 50px;
-        left: 0;
-        right: 0;
-        width: 100%;
-        min-height: 50px;
-        line-height: 3em;
-        background: #eee;
-        table-layout: fixed;
-        display: table;
-    }
-
-    table.responsive-table th {
-        background: #eee;
-    }
-
-    table.responsive-table td {
-        line-height: 2em;
-    }
-
-    table.responsive-table tr > td,
-    table.responsive-table th {
-        text-align: left;
-    }
-
-.table td, .table th {
-    white-space: nowrap;
-    overflow: hidden !important;
-    text-overflow: ellipsis;
-    min-width: 0 !important;
-    border-bottom: 1px solid rgba(224, 224, 224, 1) !important;
-    border-top: none !important;
-}
-
-.selectCell {
-    white-space: normal !important;
-    text-overflow: unset !important;
-}
-
-.selectCell span{
-    padding: 0 !important;
-}
-
-.table td {
-    padding: 6px 24px 6px 16px;
-    border-top: none !important;
-    display: table-cell;
-    font-size: 0.875rem;
-    text-align: left;
-    font-family: "Roboto", "Helvetica", "Arial", sans-serif;
-    font-weight: 400;
-    line-height: 1.43;
-    border-bottom: 1px solid rgba(224, 224, 224, 1);
-    letter-spacing: 0.01071em;
-    vertical-align: inherit
-}
-
-.table th {
-    color: rgba(0, 0, 0, 0.54);
-    font-size: 0.75rem;
-    font-weight: 500;
-    line-height: 1.3125rem;
-}
-
-.table {
-    table-layout: fixed;
-}
-
-    .table-scrollbar {
-    position: relative;
-    overflow: auto;
-}
-
-@media screen and (max-width: 40em) {
- 
-  
-}
+.table thead th {
+}
+
+table.responsive-table {
+    display: table;
+    /* required for table-layout to be used (not normally necessary; included for completeness) */
+    table-layout: fixed;
+    /* this keeps your columns with fixed with exactly the right width */
+    width: 100% !important;
+    /* table must have width set for fixed layout to work as expected */
+    height: 100%;
+}
+
+table.responsive-table thead {
+        position: fixed;
+        top: 50px;
+        left: 0;
+        right: 0;
+        width: 100%;
+        min-height: 50px;
+        line-height: 3em;
+        background: #eee;
+        table-layout: fixed;
+        display: table;
+    }
+
+    table.responsive-table th {
+        background: #eee;
+    }
+
+    table.responsive-table td {
+        line-height: 2em;
+    }
+
+    table.responsive-table tr > td,
+    table.responsive-table th {
+        text-align: left;
+    }
+
+.table td, .table th {
+    white-space: nowrap;
+    overflow: hidden !important;
+    text-overflow: ellipsis;
+    min-width: 0 !important;
+    border-bottom: 1px solid rgba(224, 224, 224, 1) !important;
+    border-top: none !important;
+}
+
+.selectCell {
+    white-space: normal !important;
+    text-overflow: unset !important;
+}
+
+.selectCell span{
+    padding: 0 !important;
+}
+
+.table td {
+    padding: 6px 24px 6px 16px;
+    border-top: none !important;
+    display: table-cell;
+    font-size: 0.875rem;
+    text-align: left;
+    font-family: "Roboto", "Helvetica", "Arial", sans-serif;
+    font-weight: 400;
+    line-height: 1.43;
+    border-bottom: 1px solid rgba(224, 224, 224, 1);
+    letter-spacing: 0.01071em;
+    vertical-align: inherit
+}
+
+.table th {
+    color: rgba(0, 0, 0, 0.54);
+    font-size: 0.75rem;
+    font-weight: 500;
+    line-height: 1.3125rem;
+}
+
+.table {
+    table-layout: fixed;
+}
+
+    .table-scrollbar {
+    position: relative;
+    overflow: auto;
+}
+
+@media screen and (max-width: 40em) {
+ 
+  
+}

package/dist/components/signatures/widgets.css

@@ -1,126 +1,126 @@
-@media all and (min-width: 480px) {
-    .btn-primary {
-        border-color: transparent;
-    }
-
-    #menubar-scroll::-webkit-scrollbar-track {
-        -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
-        background-color: #F5F5F5;
-    }
-
-    #menubar-scroll::-webkit-scrollbar {
-        width: 6px !important;
-        background-color: #F5F5F5;
-    }
-
-    #menubar-scroll::-webkit-scrollbar-thumb {
-        background-color: #939393 !important;
-    }
-
-    .menu-table button {
-        height: 96px;
-        width: 100%;
-        border-radius: 0 !important;
-        text-decoration:none;
-    }
-
-    .menu-table .toolStripButtonSelected {
-        text-decoration: none;
-    }
-
-    .menu-table .btn-primary:focus {
-        box-shadow: none;
-        text-decoration: none;
-    }
-    .footer {
-        font-size: 14px;
-        text-align: center;
-        color: white;
-        height: 10vh;
-        padding-top: 8px;
-    }
-
-    .react-pdf__Page__canvas{
-        width: 100% !important;
-    }
-
-    .header {
-        background-clip:border-box;
-        border-bottom: 1px solid #e1e1e1;
-    }
-
-    .header shadow {
-        /**box-shadow: 0 0.15rem 1.75rem 0 rgba(40, 41, 55, 0.15) !important;**/
-    }
-
-        .header span {
-            /**color: #fff;**/
-    }
-
-    .header .form-inline .form-control {
-        border-top-right-radius: 0;
-        border-bottom-right-radius: 0;
-        position: relative;
-        flex: 1 1 auto;
-        width: 1%;
-        margin-bottom: 0;
-        display: inline-block;
-        width: auto;
-        vertical-align: middle;
-        background-color: #f8f9fc !important;
-        border: 0 !important;
-    }
-
-    .btn-primary, .btn, .btn-primary:hover, .btn:hover, .btn-primary:focus, .btn:focus {
-        outline: none !important;
-        outline-offset: unset !important;
-        border-color: transparent !important;
-        box-shadow: none !important;
-        text-decoration: none;
-    }
-
-    .header .btn-primary {
-        display: block;
-        color: #fff;
-        border-radius: 0px;
-        /*box-shadow: 0px 4px 6px 2px rgba(0,0,0,0.2);*/
-        //background-color: #114084;
-        border-top: 1px solid rgba(255,255,255,0.5) !important;
-        margin-top: -5px;
-        text-decoration: none;
-    }
-
-    .header .btn {
-        font-weight: 400;
-        text-align: center;
-        vertical-align: middle;
-        -ms-user-select: none;
-        user-select: none;
-        border: 1px solid transparent;
-        padding: 0.375rem 0.75rem;
-        font-size: 1rem;
-        line-height: 2;
-        width: 100%;
-        text-align:left;
-        text-decoration:none;
-        transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
-    }
-    .border {
-        border: 0px solid #dee2e6 !important;
-    }
-
-    .header .dropdown-toggle::after {
-        display: inline-block;
-        margin-left: .255em;
-        vertical-align: .255em;
-        content: none !important;
-        border-top: .3em solid;
-        border-right: .3em solid transparent;
-        border-bottom: 0;
-        border-left: .3em solid transparent;
-    }
-
-    .search .card-body{
-       height: 60vh !important;  
-    }
-}
+@media all and (min-width: 480px) {
+    .btn-primary {
+        border-color: transparent;
+    }
+
+    #menubar-scroll::-webkit-scrollbar-track {
+        -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
+        background-color: #F5F5F5;
+    }
+
+    #menubar-scroll::-webkit-scrollbar {
+        width: 6px !important;
+        background-color: #F5F5F5;
+    }
+
+    #menubar-scroll::-webkit-scrollbar-thumb {
+        background-color: #939393 !important;
+    }
+
+    .menu-table button {
+        height: 96px;
+        width: 100%;
+        border-radius: 0 !important;
+        text-decoration:none;
+    }
+
+    .menu-table .toolStripButtonSelected {
+        text-decoration: none;
+    }
+
+    .menu-table .btn-primary:focus {
+        box-shadow: none;
+        text-decoration: none;
+    }
+    .footer {
+        font-size: 14px;
+        text-align: center;
+        color: white;
+        height: 10vh;
+        padding-top: 8px;
+    }
+
+    .react-pdf__Page__canvas{
+        width: 100% !important;
+    }
+
+    .header {
+        background-clip:border-box;
+        border-bottom: 1px solid #e1e1e1;
+    }
+
+    .header shadow {
+        /**box-shadow: 0 0.15rem 1.75rem 0 rgba(40, 41, 55, 0.15) !important;**/
+    }
+
+        .header span {
+            /**color: #fff;**/
+    }
+
+    .header .form-inline .form-control {
+        border-top-right-radius: 0;
+        border-bottom-right-radius: 0;
+        position: relative;
+        flex: 1 1 auto;
+        width: 1%;
+        margin-bottom: 0;
+        display: inline-block;
+        width: auto;
+        vertical-align: middle;
+        background-color: #f8f9fc !important;
+        border: 0 !important;
+    }
+
+    .btn-primary, .btn, .btn-primary:hover, .btn:hover, .btn-primary:focus, .btn:focus {
+        outline: none !important;
+        outline-offset: unset !important;
+        border-color: transparent !important;
+        box-shadow: none !important;
+        text-decoration: none;
+    }
+
+    .header .btn-primary {
+        display: block;
+        color: #fff;
+        border-radius: 0px;
+        /*box-shadow: 0px 4px 6px 2px rgba(0,0,0,0.2);*/
+        //background-color: #114084;
+        border-top: 1px solid rgba(255,255,255,0.5) !important;
+        margin-top: -5px;
+        text-decoration: none;
+    }
+
+    .header .btn {
+        font-weight: 400;
+        text-align: center;
+        vertical-align: middle;
+        -ms-user-select: none;
+        user-select: none;
+        border: 1px solid transparent;
+        padding: 0.375rem 0.75rem;
+        font-size: 1rem;
+        line-height: 2;
+        width: 100%;
+        text-align:left;
+        text-decoration:none;
+        transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
+    }
+    .border {
+        border: 0px solid #dee2e6 !important;
+    }
+
+    .header .dropdown-toggle::after {
+        display: inline-block;
+        margin-left: .255em;
+        vertical-align: .255em;
+        content: none !important;
+        border-top: .3em solid;
+        border-right: .3em solid transparent;
+        border-bottom: 0;
+        border-left: .3em solid transparent;
+    }
+
+    .search .card-body{
+       height: 60vh !important;  
+    }
+}

package/dist/view/Dashboard.js

@@ -404,10 +404,10 @@ const Dashboard = /*#__PURE__*/_react.default.memo(/*#__PURE__*/_react.default.f
     }
   }
   _react.default.useEffect(() => {
-    /*let rpcConfig = {
-        "type": "rpc",
-        "procedureName": "getWorkFlowSummary",
-        "serviceId": "BPM.WorkFlow"
+    /*let rpcConfig = {
+        "type": "rpc",
+        "procedureName": "getWorkFlowSummary",
+        "serviceId": "BPM.WorkFlow"
     };*/
 
     let cardsPerRow = 2;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@agilemotion/oui-react-js",
-  "version": "1.8.9",
+  "version": "1.8.12",
   "files": [
     "dist"
   ],