@vitrosoftware/common-ui-ts 1.1.21 → 1.1.22

package/dist/index.js

@@ -207,6 +207,50 @@ var Item = function Item(props) {
   }, props.text);
 };
 
+var styles = {"vitro-scrollbar-content":"_scrollbar_vitro-scrollbar-content_3HXSt5u"};
+
+var w = window;
+var ScrollBar = function ScrollBar(props) {
+  var ref = React.useRef(null);
+  var _useState = React.useState(null),
+    element = _useState[0],
+    setElement = _useState[1];
+  React.useEffect(function () {
+    var scrollElement;
+    if (ref.current) {
+      if (w.PerfectScrollbar) {
+        scrollElement = new w.PerfectScrollbar(ref.current, {
+          suppressScrollX: props.isHideScrollX
+        });
+        setElement(scrollElement);
+      }
+      if (w.addResizeListener && ref.current) {
+        w.addResizeListener(ref.current.firstChild, function () {
+          return scrollElement.update();
+        });
+      }
+      if (props.onInit) {
+        props.onInit(ref.current);
+      }
+      if (props.isFocusOnScroll && ref.current) {
+        ref.current.addEventListener('ps-scroll-y', function () {
+          return ref.current.click();
+        });
+      }
+    }
+    return function () {
+      if (scrollElement) {
+        scrollElement.destroy();
+      }
+    };
+  }, []);
+  return React__default.createElement("div", {
+    ref: ref
+  }, React__default.createElement("div", {
+    className: styles['vitro-scrollbar-content']
+  }, element && props.children));
+};
+
 (function (EVENT) {
   EVENT["MOUSEDOWN"] = "mousedown";
   EVENT["MOUSEUP"] = "mouseup";
@@ -216,9 +260,10 @@ var Item = function Item(props) {
   EVENT["DRAGLEAVE"] = "dragleave";
   EVENT["HISTORY_UPDATE"] = "vitro.history.update";
   EVENT["HISTORY_CHANGED"] = "vitro.history.changed";
+  EVENT["DROP"] = "drop";
 })(exports.EVENT || (exports.EVENT = {}));
 
-var styles = {"vitro-breadcrumbs":"_breadcrumbs_vitro-breadcrumbs_3r4NcQY","vitro-breadcrumbs-list-wrap":"_breadcrumbs_vitro-breadcrumbs-list-wrap_1_JBrw0","vitro-breadcrumbs-list":"_breadcrumbs_vitro-breadcrumbs-list_1SNtgtJ","vitro-breadcrumbs-button":"_breadcrumbs_vitro-breadcrumbs-button_3fazq3c","vitro-root":"_breadcrumbs_vitro-root_1S5-6AY","vitro-drop-down-list":"_breadcrumbs_vitro-drop-down-list_2PhrR2a"};
+var styles$1 = {"vitro-breadcrumbs":"_breadcrumbs_vitro-breadcrumbs_3r4NcQY","vitro-breadcrumbs-list-wrap":"_breadcrumbs_vitro-breadcrumbs-list-wrap_1_JBrw0","vitro-breadcrumbs-list":"_breadcrumbs_vitro-breadcrumbs-list_1SNtgtJ","vitro-breadcrumbs-button":"_breadcrumbs_vitro-breadcrumbs-button_3fazq3c","vitro-root":"_breadcrumbs_vitro-root_1S5-6AY","vitro-drop-down-list":"_breadcrumbs_vitro-drop-down-list_2PhrR2a"};
 
 var Breadcrumbs = function Breadcrumbs(props) {
   var _useState = React.useState([]),
@@ -322,7 +367,7 @@ var Breadcrumbs = function Breadcrumbs(props) {
     setWindowWidth(window.innerWidth);
   };
   var clickOutside = function clickOutside(e) {
-    if (menuRef.current && !menuRef.current.contains(e.target) && e.target.className !== styles['vitro-breadcrumbs-button']) {
+    if (menuRef.current && !menuRef.current.contains(e.target) && e.target.className !== styles$1['vitro-breadcrumbs-button']) {
       setDropDown(false);
     }
   };
@@ -333,15 +378,15 @@ var Breadcrumbs = function Breadcrumbs(props) {
   var showDropdownMenu = function showDropdownMenu() {
     setDropDown(!dropDown);
   };
-  var titleClassName = styles['vitro-site-name'] + CTRL.SPACE + (displayItemList.length ? styles['opened'] : styles['closed']);
+  var titleClassName = styles$1['vitro-site-name'] + CTRL.SPACE + (displayItemList.length ? styles$1['opened'] : styles$1['closed']);
   return React__default.createElement("div", {
-    className: styles['vitro-breadcrumbs']
+    className: styles$1['vitro-breadcrumbs']
   }, props.text ? React__default.createElement("h2", {
     className: titleClassName
   }, props.text) : null, React__default.createElement("div", {
-    className: styles['vitro-breadcrumbs-list-wrap']
+    className: styles$1['vitro-breadcrumbs-list-wrap']
   }, React__default.createElement("ul", {
-    className: styles['vitro-breadcrumbs-list']
+    className: styles$1['vitro-breadcrumbs-list']
   }, displayItemList.map(function (item) {
     return React__default.createElement(Item, {
       text: item.text,
@@ -352,17 +397,17 @@ var Breadcrumbs = function Breadcrumbs(props) {
     });
   })), dropdownItemList.length ? React__default.createElement("div", {
     onClick: showDropdownMenu,
-    className: styles['vitro-breadcrumbs-button']
+    className: styles$1['vitro-breadcrumbs-button']
   }) : null, !props.wrapRoot && rootItem ? React__default.createElement(Item, {
     id: rootItem.id,
     onClick: function onClick() {
       return onItemClick(rootItem);
     },
-    className: styles['vitro-root']
+    className: styles$1['vitro-root']
   }) : null), dropDown && dropdownItemList.length > 0 && React__default.createElement("div", {
-    className: styles['vitro-drop-down-list'],
+    className: styles$1['vitro-drop-down-list'],
     ref: menuRef
-  }, React__default.createElement("ul", null, React__default.createElement(commonUi.ScrollBar, null, dropdownItemList.map(function (item) {
+  }, React__default.createElement("ul", null, React__default.createElement(ScrollBar, null, dropdownItemList.map(function (item) {
     return React__default.createElement(Item, {
       text: item.text,
       id: item.id,
@@ -373,11 +418,11 @@ var Breadcrumbs = function Breadcrumbs(props) {
   })))));
 };
 
-var styles$1 = {"vitro-top-level-menu":"_top-level-menu_vitro-top-level-menu_38-ZEUx","vitro-active":"_top-level-menu_vitro-active_2hLMadw"};
+var styles$2 = {"vitro-top-level-menu":"_top-level-menu_vitro-top-level-menu_38-ZEUx","vitro-active":"_top-level-menu_vitro-active_2hLMadw"};
 
 var LinkItem = function LinkItem(props) {
   return React__default.createElement("li", {
-    className: props.isActive ? styles$1['vitro-active'] : ''
+    className: props.isActive ? styles$2['vitro-active'] : ''
   }, React__default.createElement("a", {
     href: props.url,
     onClick: props.onClick
@@ -427,7 +472,7 @@ var TopLevelMenu = function TopLevelMenu(props) {
     props.onClick(item);
   };
   return React__default.createElement("ul", {
-    className: styles$1['vitro-top-level-menu']
+    className: styles$2['vitro-top-level-menu']
   }, props.itemList && props.itemList.slice(0, maxNum).map(function (item) {
     return React__default.createElement(LinkItem, {
       text: item.text,
@@ -20231,7 +20276,7 @@ var JsTreeViewContextImpl = /*#__PURE__*/function () {
   return JsTreeViewContextImpl;
 }();
 
-var styles$2 = {"vitro-tree-view":"_tree-view_vitro-tree-view_3oii-CW"};
+var styles$3 = {"vitro-tree-view":"_tree-view_vitro-tree-view_3oii-CW"};
 
 var TreeView = function TreeView(props) {
   var _useState = React.useState(null),
@@ -20260,7 +20305,7 @@ var TreeView = function TreeView(props) {
   return React__default.createElement(React__default.Fragment, null, React__default.createElement("div", {
     ref: jsTreeRef,
     id: props.id,
-    className: styles$2["vitro-tree-view"]
+    className: styles$3["vitro-tree-view"]
   }));
 };
 
@@ -20322,11 +20367,11 @@ function _toPropertyKey(arg) {
   return typeof key === "symbol" ? key : String(key);
 }
 
-var w = window;
-if (!w.tableViewList) {
-  w.tableViewList = new Map();
+var w$1 = window;
+if (!w$1.tableViewList) {
+  w$1.tableViewList = new Map();
 }
-var tableViewList = w.tableViewList;
+var tableViewList = w$1.tableViewList;
 function getTableViewById(id) {
   return tableViewList.get(id);
 }
@@ -20443,7 +20488,7 @@ var TreeGridTableViewContextImpl = /*#__PURE__*/function () {
   };
   _proto.setEventHandler = function setEventHandler(eventHandler) {
     var grid = this;
-    w.TGSetEvent(eventHandler.id, this.id, function () {
+    w$1.TGSetEvent(eventHandler.id, this.id, function () {
       for (var _len = arguments.length, params = new Array(_len), _key = 0; _key < _len; _key++) {
         params[_key] = arguments[_key];
       }
@@ -20741,20 +20786,20 @@ var TableViewConstants = {
     get SECTION () { return SECTION; }
 };
 
-var styles$3 = {"vitro-table-view":"_table-view_vitro-table-view_1tTs32D"};
+var styles$4 = {"vitro-table-view":"_table-view_vitro-table-view_1tTs32D"};
 
-var w$1 = window;
-if (!w$1.tableViewList) {
-  w$1.tableViewList = new Map();
+var w$2 = window;
+if (!w$2.tableViewList) {
+  w$2.tableViewList = new Map();
 }
 var TreeGrid = function TreeGrid(props) {
   var disposeTableViewById = function disposeTableViewById(gridId) {
-    if (gridId && w$1.Grids) {
+    if (gridId && w$2.Grids) {
       var tableView = getTableViewById(gridId);
       if (tableView && tableView.dispose) {
         tableView.dispose();
       }
-      var grid = w$1.Grids[gridId];
+      var grid = w$2.Grids[gridId];
       if (grid && grid.Dispose) {
         grid.Dispose();
       }
@@ -20813,11 +20858,11 @@ var TreeGrid = function TreeGrid(props) {
   };
   React.useEffect(function () {
     disposeTableViewById(props.id);
-    w$1.TGSetEvent(EVENT$1.ON_LOADED, props.id, function (grid, next) {
+    w$2.TGSetEvent(EVENT$1.ON_LOADED, props.id, function (grid, next) {
       return onGridLoaded(grid, next);
     });
     if (props.layout || props.data) {
-      w$1.TreeGrid({
+      w$2.TreeGrid({
         id: props.id,
         Layout: {
           Data: props.layout
@@ -20833,7 +20878,7 @@ var TreeGrid = function TreeGrid(props) {
         CacheVersion: props.cacheVersion
       }, "vitro-table-view" + props.id);
     } else {
-      w$1.TreeGrid({
+      w$2.TreeGrid({
         id: props.id,
         Layout: {
           Url: createGridUrl(URL.LAYOUT)
@@ -20857,7 +20902,7 @@ var TreeGrid = function TreeGrid(props) {
     };
   }, []);
   return React__default.createElement("div", {
-    className: styles$3["vitro-table-view"]
+    className: styles$4["vitro-table-view"]
   }, React__default.createElement("div", {
     id: "vitro-table-view" + props.id
   }));
@@ -21222,7 +21267,7 @@ var TelerikUploaderContextImpl = /*#__PURE__*/function () {
 var SERVICE = function SERVICE() {};
 SERVICE.LOCALE = 'LocaleService';
 
-var styles$4 = {"vitro-uploader":"_uploader_vitro-uploader_237vX7T","vitro-upload-container":"_uploader_vitro-upload-container_2ASGHSS","vitro-drop-zone":"_uploader_vitro-drop-zone_3w2dluc","vitro-progress-info":"_uploader_vitro-progress-info_J4BRjZ0","vitro-button-close":"_uploader_vitro-button-close_30As0AM","vitro-button-show":"_uploader_vitro-button-show_uUmWVJc","vitro-button-hide":"_uploader_vitro-button-hide_LYS1px9","vitro-hidden":"_uploader_vitro-hidden_12825pc","vitro-progress":"_uploader_vitro-progress_2NtaSj2","vitro-dropzone-image":"_uploader_vitro-dropzone-image_ianU_0j","vitro-drop-zone-text":"_uploader_vitro-drop-zone-text_KLjek2K","vitro-progress-bar":"_uploader_vitro-progress-bar_3YXLbbu"};
+var styles$5 = {"vitro-uploader":"_uploader_vitro-uploader_237vX7T","vitro-upload-container":"_uploader_vitro-upload-container_2ASGHSS","vitro-drop-zone":"_uploader_vitro-drop-zone_3w2dluc","vitro-progress-info":"_uploader_vitro-progress-info_J4BRjZ0","vitro-button-close":"_uploader_vitro-button-close_30As0AM","vitro-button-show":"_uploader_vitro-button-show_uUmWVJc","vitro-button-hide":"_uploader_vitro-button-hide_LYS1px9","vitro-hidden":"_uploader_vitro-hidden_12825pc","vitro-progress":"_uploader_vitro-progress_2NtaSj2","vitro-dropzone-image":"_uploader_vitro-dropzone-image_ianU_0j","vitro-drop-zone-text":"_uploader_vitro-drop-zone-text_KLjek2K","vitro-progress-bar":"_uploader_vitro-progress-bar_3YXLbbu"};
 
 var $$2 = window.$;
 var TYPE_FILES = 'Files';
@@ -21264,6 +21309,9 @@ var TelerikUploader = function TelerikUploader(props) {
       window.addEventListener(exports.EVENT.DRAGLEAVE, function (e) {
         return onDragLeave(e);
       });
+      window.addEventListener(exports.EVENT.DROP, function (e) {
+        return onDrop();
+      });
     }
     return function () {
       window.removeEventListener(EVENT$2.ADD_FILE, addFile);
@@ -21273,6 +21321,9 @@ var TelerikUploader = function TelerikUploader(props) {
       window.removeEventListener(exports.EVENT.DRAGLEAVE, function (e) {
         return onDragLeave(e);
       });
+      window.removeEventListener(exports.EVENT.DROP, function (e) {
+        return onDrop();
+      });
     };
   }, [kendoUploader]);
   var addFile = function addFile() {
@@ -21300,35 +21351,39 @@ var TelerikUploader = function TelerikUploader(props) {
       containerRef.current.classList.add('vitro-dropzone-active');
     }
   };
-  var onDragLeave = function onDragLeave(e) {
-    e.preventDefault();
+  var onDrop = function onDrop(e) {
     if (containerRef.current) {
       containerRef.current.classList.remove('vitro-dropzone-active');
     }
   };
+  var onDragLeave = function onDragLeave(e) {
+    if (!e.fromElement) {
+      onDrop();
+    }
+  };
   return React__default.createElement("div", {
     id: componentName,
-    className: styles$4['vitro-uploader'],
+    className: styles$5['vitro-uploader'],
     ref: containerRef
   }, showClose && React__default.createElement(React__default.Fragment, null, React__default.createElement("button", {
-    className: styles$4['vitro-button-close'],
+    className: styles$5['vitro-button-close'],
     onClick: clearUploadResult
   }), React__default.createElement("button", {
-    className: hide ? styles$4['vitro-button-show'] : styles$4['vitro-button-hide'],
+    className: hide ? styles$5['vitro-button-show'] : styles$5['vitro-button-hide'],
     onClick: hideUploadResult
   })), React__default.createElement("div", {
-    className: styles$4['vitro-drop-zone'],
+    className: styles$5['vitro-drop-zone'],
     id: 'vitro-uploader-drop-zone',
     ref: dropZoneRef,
     onClick: addFile
   }, React__default.createElement("div", null, React__default.createElement("div", {
-    className: styles$4['vitro-dropzone-image']
+    className: styles$5['vitro-dropzone-image']
   }), React__default.createElement("div", {
-    className: styles$4['vitro-drop-zone-text']
+    className: styles$5['vitro-drop-zone-text']
   }, localeService.create(LOCALE.DROPZONE_TEXT)))), React__default.createElement("div", {
-    className: styles$4['vitro-upload-container'] + (hide ? CTRL.SPACE + styles$4['vitro-hidden'] : CTRL.EMPTY)
+    className: styles$5['vitro-upload-container'] + (hide ? CTRL.SPACE + styles$5['vitro-hidden'] : CTRL.EMPTY)
   }, React__default.createElement("div", {
-    className: styles$4['vitro-progress-info'],
+    className: styles$5['vitro-progress-info'],
     id: 'vitro-uploader-progress-info',
     ref: progressInfoRef
   }, React__default.createElement("span", {
@@ -21336,10 +21391,10 @@ var TelerikUploader = function TelerikUploader(props) {
   }), React__default.createElement("span", {
     id: 'vitro-uploader-subtitle'
   }), React__default.createElement("div", {
-    className: styles$4['vitro-progress'],
+    className: styles$5['vitro-progress'],
     ref: progressBarRef
   }, React__default.createElement("div", {
-    className: styles$4['vitro-progress-bar'],
+    className: styles$5['vitro-progress-bar'],
     id: 'vitro-progress-bar'
   }))), React__default.createElement("input", {
     name: 'fileList',
@@ -21871,11 +21926,11 @@ function style(node, property) {
  * LICENSE file in the root directory of this source tree.
  */
 var b="function"===typeof Symbol&&Symbol.for,c=b?Symbol.for("react.element"):60103,d=b?Symbol.for("react.portal"):60106,e=b?Symbol.for("react.fragment"):60107,f=b?Symbol.for("react.strict_mode"):60108,g=b?Symbol.for("react.profiler"):60114,h=b?Symbol.for("react.provider"):60109,k=b?Symbol.for("react.context"):60110,l=b?Symbol.for("react.async_mode"):60111,m=b?Symbol.for("react.concurrent_mode"):60111,n=b?Symbol.for("react.forward_ref"):60112,p=b?Symbol.for("react.suspense"):60113,q=b?
-Symbol.for("react.suspense_list"):60120,r=b?Symbol.for("react.memo"):60115,t=b?Symbol.for("react.lazy"):60116,v=b?Symbol.for("react.block"):60121,w$2=b?Symbol.for("react.fundamental"):60117,x=b?Symbol.for("react.responder"):60118,y=b?Symbol.for("react.scope"):60119;
+Symbol.for("react.suspense_list"):60120,r=b?Symbol.for("react.memo"):60115,t=b?Symbol.for("react.lazy"):60116,v=b?Symbol.for("react.block"):60121,w$3=b?Symbol.for("react.fundamental"):60117,x=b?Symbol.for("react.responder"):60118,y=b?Symbol.for("react.scope"):60119;
 function z(a){if("object"===typeof a&&null!==a){var u=a.$$typeof;switch(u){case c:switch(a=a.type,a){case l:case m:case e:case g:case f:case p:return a;default:switch(a=a&&a.$$typeof,a){case k:case n:case t:case r:case h:return a;default:return u}}case d:return u}}}function A(a){return z(a)===m}var AsyncMode=l;var ConcurrentMode=m;var ContextConsumer=k;var ContextProvider=h;var Element$1=c;var ForwardRef=n;var Fragment=e;var Lazy=t;var Memo=r;var Portal=d;
 var Profiler=g;var StrictMode=f;var Suspense=p;var isAsyncMode=function(a){return A(a)||z(a)===l};var isConcurrentMode=A;var isContextConsumer=function(a){return z(a)===k};var isContextProvider=function(a){return z(a)===h};var isElement=function(a){return "object"===typeof a&&null!==a&&a.$$typeof===c};var isForwardRef=function(a){return z(a)===n};var isFragment=function(a){return z(a)===e};var isLazy=function(a){return z(a)===t};
 var isMemo=function(a){return z(a)===r};var isPortal=function(a){return z(a)===d};var isProfiler=function(a){return z(a)===g};var isStrictMode=function(a){return z(a)===f};var isSuspense=function(a){return z(a)===p};
-var isValidElementType=function(a){return "string"===typeof a||"function"===typeof a||a===e||a===m||a===g||a===f||a===p||a===q||"object"===typeof a&&null!==a&&(a.$$typeof===t||a.$$typeof===r||a.$$typeof===h||a.$$typeof===k||a.$$typeof===n||a.$$typeof===w$2||a.$$typeof===x||a.$$typeof===y||a.$$typeof===v)};var typeOf=z;
+var isValidElementType=function(a){return "string"===typeof a||"function"===typeof a||a===e||a===m||a===g||a===f||a===p||a===q||"object"===typeof a&&null!==a&&(a.$$typeof===t||a.$$typeof===r||a.$$typeof===h||a.$$typeof===k||a.$$typeof===n||a.$$typeof===w$3||a.$$typeof===x||a.$$typeof===y||a.$$typeof===v)};var typeOf=z;
 
 var reactIs_production_min = {
 	AsyncMode: AsyncMode,
@@ -59315,7 +59370,7 @@ var Icon = function Icon(props) {
   }));
 };
 
-var styles$5 = {"vitro-button":"_button_vitro-button_hVfBuSO","vitro-animation-ripple":"_button_vitro-animation-ripple_7CFAk_a"};
+var styles$6 = {"vitro-button":"_button_vitro-button_hVfBuSO","vitro-animation-ripple":"_button_vitro-animation-ripple_7CFAk_a"};
 
 var PX_UNIT = 'px';
 var HTML_ELEMENT_SPAN = 'span';
@@ -59373,7 +59428,7 @@ var Button$2 = function Button(props) {
     },
     disabled: pending || props.isDisabled,
     type: TYPE_BUTTON,
-    className: styles$5['vitro-button'] + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY),
+    className: styles$6['vitro-button'] + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY),
     title: CTRL.EMPTY,
     onClick: onClick,
     onMouseDown: props.isCreateRipple ? createRipple : function () {}
@@ -59386,14 +59441,14 @@ var Button$2 = function Button(props) {
   return button;
 };
 
-var styles$6 = {"vitro-action-handler":"_action-handler_vitro-action-handler_1wgWRHB","vitro-icon-before":"_action-handler_vitro-icon-before_2OomEjN","vitro-icon-progress":"_action-handler_vitro-icon-progress_2QurHaw","vitro-icon-success":"_action-handler_vitro-icon-success_3Pt7XlJ","vitro-icon-error":"_action-handler_vitro-icon-error_2elcVFa","vitro-icon-warning":"_action-handler_vitro-icon-warning_3X_YncE","vitro-content":"_action-handler_vitro-content_1UEsgWV","vitro-flex":"_action-handler_vitro-flex_ryggQ_S","vitro-interface-blur":"_action-handler_vitro-interface-blur_3p_JKB_","vitro-action-handler-dialog-confirm":"_action-handler_vitro-action-handler-dialog-confirm_30dwuBp","vitro-action-handler-dialog":"_action-handler_vitro-action-handler-dialog_1rRT66e","vitro-content-container":"_action-handler_vitro-content-container_DBST6Nz","vitro-confirm":"_action-handler_vitro-confirm_24pI7Nj","vitro-progress":"_action-handler_vitro-progress_2RheviN","vitro-progress-bar":"_action-handler_vitro-progress-bar_1dwFpsn","vitro-small":"_action-handler_vitro-small_oqifqlS","vitro-button-close":"_action-handler_vitro-button-close_3mRTgQq","vitro-success":"_action-handler_vitro-success_1bfGHQQ","vitro-warning":"_action-handler_vitro-warning_2uE9UfG","vitro-error":"_action-handler_vitro-error_1XXlWG-","vitro-button-cancel":"_action-handler_vitro-button-cancel_GE8JsGp","vitro-button":"_action-handler_vitro-button_1wSNAYT","vitro-button-collapse-up":"_action-handler_vitro-button-collapse-up_2lQ6JWm","vitro-button-collapse-bottom":"_action-handler_vitro-button-collapse-bottom_aocIZUX"};
+var styles$7 = {"vitro-action-handler":"_action-handler_vitro-action-handler_1wgWRHB","vitro-icon-before":"_action-handler_vitro-icon-before_2OomEjN","vitro-icon-progress":"_action-handler_vitro-icon-progress_2QurHaw","vitro-icon-success":"_action-handler_vitro-icon-success_3Pt7XlJ","vitro-icon-error":"_action-handler_vitro-icon-error_2elcVFa","vitro-icon-warning":"_action-handler_vitro-icon-warning_3X_YncE","vitro-content":"_action-handler_vitro-content_1UEsgWV","vitro-flex":"_action-handler_vitro-flex_ryggQ_S","vitro-interface-blur":"_action-handler_vitro-interface-blur_3p_JKB_","vitro-action-handler-dialog-confirm":"_action-handler_vitro-action-handler-dialog-confirm_30dwuBp","vitro-action-handler-dialog":"_action-handler_vitro-action-handler-dialog_1rRT66e","vitro-content-container":"_action-handler_vitro-content-container_DBST6Nz","vitro-confirm":"_action-handler_vitro-confirm_24pI7Nj","vitro-progress":"_action-handler_vitro-progress_2RheviN","vitro-progress-bar":"_action-handler_vitro-progress-bar_1dwFpsn","vitro-small":"_action-handler_vitro-small_oqifqlS","vitro-button-close":"_action-handler_vitro-button-close_3mRTgQq","vitro-success":"_action-handler_vitro-success_1bfGHQQ","vitro-warning":"_action-handler_vitro-warning_2uE9UfG","vitro-error":"_action-handler_vitro-error_1XXlWG-","vitro-button-cancel":"_action-handler_vitro-button-cancel_GE8JsGp","vitro-button":"_action-handler_vitro-button_1wSNAYT","vitro-button-collapse-up":"_action-handler_vitro-button-collapse-up_2lQ6JWm","vitro-button-collapse-bottom":"_action-handler_vitro-button-collapse-bottom_aocIZUX"};
 
 var _excluded$7 = ["popper", "children", "show"];
 var UpdatingPopover = React__default.forwardRef(function (_ref, ref) {
   var children = _ref.children,
     props = _objectWithoutPropertiesLoose(_ref, _excluded$7);
   return React__default.createElement("div", {
-    className: styles$6["vitro-action-handler"]
+    className: styles$7["vitro-action-handler"]
   }, React__default.createElement(Popover$1, Object.assign({
     ref: ref,
     body: true,
@@ -59401,24 +59456,24 @@ var UpdatingPopover = React__default.forwardRef(function (_ref, ref) {
   }, props), children));
 });
 
-var styles$7 = {"vitro-info-container":"_action-handler-info_vitro-info-container_eNvJr3n","vitro-action-info":"_action-handler-info_vitro-action-info_40N4L4N","vitro-item-container":"_action-handler-info_vitro-item-container__hZvMvH","vitro-item":"_action-handler-info_vitro-item_2pXL5Ks","vitro-title":"_action-handler-info_vitro-title_kdIhxqv","vitro-subtitle":"_action-handler-info_vitro-subtitle_29cfoD0","vitro-progress-bar":"_action-handler-info_vitro-progress-bar_2IxowO0","vitro-button-cancel":"_action-handler-info_vitro-button-cancel_3eqrIKx","vitro-success":"_action-handler-info_vitro-success_22wks7Q","vitro-progress":"_action-handler-info_vitro-progress_1pVf3VJ","vitro-error":"_action-handler-info_vitro-error_2JNd137","vitro-status":"_action-handler-info_vitro-status_3Ey3f6C"};
+var styles$8 = {"vitro-info-container":"_action-handler-info_vitro-info-container_eNvJr3n","vitro-action-info":"_action-handler-info_vitro-action-info_40N4L4N","vitro-item-container":"_action-handler-info_vitro-item-container__hZvMvH","vitro-item":"_action-handler-info_vitro-item_2pXL5Ks","vitro-title":"_action-handler-info_vitro-title_kdIhxqv","vitro-subtitle":"_action-handler-info_vitro-subtitle_29cfoD0","vitro-progress-bar":"_action-handler-info_vitro-progress-bar_2IxowO0","vitro-button-cancel":"_action-handler-info_vitro-button-cancel_3eqrIKx","vitro-success":"_action-handler-info_vitro-success_22wks7Q","vitro-progress":"_action-handler-info_vitro-progress_1pVf3VJ","vitro-error":"_action-handler-info_vitro-error_2JNd137","vitro-status":"_action-handler-info_vitro-status_3Ey3f6C"};
 
 var ActionInfoItem = function ActionInfoItem(props) {
   var getClassName = function getClassName() {
     if (props.info.success) {
-      return styles$7['vitro-success'];
+      return styles$8['vitro-success'];
     } else if (props.info.error) {
-      return styles$7['vitro-error'];
+      return styles$8['vitro-error'];
     } else if (props.info.progress) {
-      return styles$7['vitro-progress'];
+      return styles$8['vitro-progress'];
     }
-    return styles$7['vitro-status'];
+    return styles$8['vitro-status'];
   };
   return React__default.createElement("div", {
-    className: styles$7['vitro-item'],
+    className: styles$8['vitro-item'],
     key: props.id
   }, React__default.createElement("span", {
-    className: styles$7['vitro-title']
+    className: styles$8['vitro-title']
   }, props.name), React__default.createElement("span", {
     className: getClassName()
   }, props.info.text));
@@ -59537,11 +59592,11 @@ var ActionInfo = function ActionInfo(props) {
     return CTRL.EMPTY;
   };
   return React__default.createElement("div", {
-    className: styles$7['vitro-info-container']
+    className: styles$8['vitro-info-container']
   }, React__default.createElement("div", {
-    className: styles$7['vitro-action-info']
+    className: styles$8['vitro-action-info']
   }, getText()), React__default.createElement("div", {
-    className: styles$7['vitro-item-container']
+    className: styles$8['vitro-item-container']
   }, props.itemList.map(function (item) {
     return React__default.createElement(ActionInfoItem, {
       id: item.id,
@@ -59582,7 +59637,7 @@ var ActionHandler = function ActionHandler(props) {
   var _useState8 = React.useState(null),
     icon = _useState8[0],
     setIcon = _useState8[1];
-  var _useState9 = React.useState(props.isConfirm ? styles$6['vitro-confirm'] : CTRL.EMPTY),
+  var _useState9 = React.useState(props.isConfirm ? styles$7['vitro-confirm'] : CTRL.EMPTY),
     state = _useState9[0],
     setState = _useState9[1];
   var _useState10 = React.useState(true),
@@ -59617,15 +59672,15 @@ var ActionHandler = function ActionHandler(props) {
   React.useEffect(function () {
     setIsCloseEnabled(currentAction !== actionMap$1.progress);
     if (currentAction === actionMap$1.before) {
-      setState(styles$6['vitro-confirm']);
+      setState(styles$7['vitro-confirm']);
       setShowItemCount(true);
-      setIcon(styles$6['vitro-icon-before']);
+      setIcon(styles$7['vitro-icon-before']);
     }
     if (currentAction === actionMap$1.progress) {
       setState(CTRL.EMPTY);
       setShowProgressBar(!props.isHideProgressBar);
       setShowItemCount(false);
-      setIcon(styles$6['vitro-icon-progress']);
+      setIcon(styles$7['vitro-icon-progress']);
     }
     if (currentAction !== actionMap$1.progress) {
       setShowProgressBar(false);
@@ -59708,24 +59763,24 @@ var ActionHandler = function ActionHandler(props) {
   };
   var setActionResult = function setActionResult(success, successResult, failResult) {
     if (success) {
-      setIcon(styles$6['vitro-icon-success']);
-      setState(styles$6['vitro-success']);
+      setIcon(styles$7['vitro-icon-success']);
+      setState(styles$7['vitro-success']);
       var key = [LOCALE$1.ACTION_MSG, props.actionCode, LOCALE$1.SUCCESS].join(CTRL.DOT);
       setText(localeService.create(key, {
         actionCode: action,
         count: successResult.length
       }));
     } else if (successResult.length && failResult.length) {
-      setIcon(styles$6['vitro-icon-warning']);
-      setState(styles$6['vitro-warning']);
+      setIcon(styles$7['vitro-icon-warning']);
+      setState(styles$7['vitro-warning']);
       var _key = data.itemCount === 1 ? LOCALE$1.WARNING_SINGLE : LOCALE$1.WARNING_MULTI;
       setText(localeService.create(_key, {
         actionCode: action,
         itemCount: data.itemCount
       }));
     } else {
-      setIcon(styles$6['vitro-icon-error']);
-      setState(styles$6['vitro-error']);
+      setIcon(styles$7['vitro-icon-error']);
+      setState(styles$7['vitro-error']);
       var _key2 = data.itemCount === 1 ? LOCALE$1.ERROR_SINGLE : LOCALE$1.ERROR_MULTI;
       setText(localeService.create(_key2, {
         actionCode: action,
@@ -59886,23 +59941,23 @@ var ActionHandler = function ActionHandler(props) {
   var showCloseButtonGroup = currentAction !== actionMap$1.before;
   var positionCenter = !props.target && !props.children;
   var content = React__default.createElement("div", {
-    className: styles$6['vitro-content'] + CTRL.SPACE + state
+    className: styles$7['vitro-content'] + CTRL.SPACE + state
   }, React__default.createElement("div", {
-    className: styles$6['vitro-content-container']
+    className: styles$7['vitro-content-container']
   }, React__default.createElement("div", {
-    className: styles$6['vitro-flex']
+    className: styles$7['vitro-flex']
   }, icon && React__default.createElement("div", {
     className: icon
   }), React__default.createElement("span", null, text), showCloseButtonGroup && React__default.createElement(React__default.Fragment, null, React__default.createElement("div", {
-    className: showInfo ? styles$6['vitro-button-collapse-up'] : styles$6['vitro-button-collapse-bottom'],
+    className: showInfo ? styles$7['vitro-button-collapse-up'] : styles$7['vitro-button-collapse-bottom'],
     onClick: function onClick() {
       return setShowInfo(!showInfo);
     }
   }), currentAction != actionMap$1.before && React__default.createElement("div", {
-    className: styles$6['vitro-button-close'],
+    className: styles$7['vitro-button-close'],
     onClick: close
   }))), showItemCount && React__default.createElement("span", {
-    className: styles$6['vitro-small']
+    className: styles$7['vitro-small']
   }, getSelectedItemText()), showInfo && React__default.createElement(ActionInfo, {
     itemList: data.itemList,
     successResult: successResult,
@@ -59912,19 +59967,19 @@ var ActionHandler = function ActionHandler(props) {
     isSuccess: success,
     currentItem: currentItem
   })), showProgressBar && React__default.createElement("div", {
-    className: styles$6['vitro-progress']
+    className: styles$7['vitro-progress']
   }, React__default.createElement("div", {
-    className: styles$6['vitro-progress-bar'],
+    className: styles$7['vitro-progress-bar'],
     ref: progressBarRef
   })), showConfirmButtonGroup && React__default.createElement(commonUi.ButtonGroup, null, React__default.createElement(Button$2, {
     onClick: close,
     text: localeService.create(LOCALE$1.CANCEL) || props.labelNo || CTRL.EMPTY,
-    className: styles$6['vitro-button-cancel']
+    className: styles$7['vitro-button-cancel']
   }), React__default.createElement(Button$2, {
     onClick: onStart,
     text: action || props.labelYes || CTRL.EMPTY,
     isDisabled: currentAction !== actionMap$1.before,
-    className: styles$6['vitro-button']
+    className: styles$7['vitro-button']
   })));
   return React__default.createElement(React__default.Fragment, null, props.children && React__default.createElement(OverlayTrigger, {
     trigger: TRIGGER.CLICK,
@@ -59939,13 +59994,13 @@ var ActionHandler = function ActionHandler(props) {
     onHide: close,
     placement: props.placement || PLACEMENT.TOP
   }, React__default.createElement(UpdatingPopover, null, content)), positionCenter && show && React__default.createElement("div", {
-    className: currentAction === actionMap$1.before ? styles$6['vitro-action-handler-dialog-confirm'] : styles$6['vitro-action-handler-dialog']
+    className: currentAction === actionMap$1.before ? styles$7['vitro-action-handler-dialog-confirm'] : styles$7['vitro-action-handler-dialog']
   }, content), blockInterface && React__default.createElement("div", {
-    className: styles$6['vitro-interface-blur']
+    className: styles$7['vitro-interface-blur']
   }));
 };
 
-var styles$8 = {"vitro-view-part":"_view-part_vitro-view-part_3j_gZpl"};
+var styles$9 = {"vitro-view-part":"_view-part_vitro-view-part_3j_gZpl"};
 
 var ViewPart = function ViewPart(props) {
   var _useState = React.useState(null),
@@ -59961,29 +60016,29 @@ var ViewPart = function ViewPart(props) {
     }
   }, [props.component, props.settings, props.item]);
   return React__default.createElement("div", {
-    className: styles$8["vitro-view-part"]
+    className: styles$9["vitro-view-part"]
   }, component);
 };
 
-var styles$9 = {"vitro-view":"_view_vitro-view_1NKb-kU"};
+var styles$a = {"vitro-view":"_view_vitro-view_1NKb-kU"};
 
-var styles$a = {"vitro-dropdown-button":"_dropdown-button_vitro-dropdown-button_1myvkhB","vitro-dropdown-icon":"_dropdown-button_vitro-dropdown-icon_2aKCNii","vitro-text":"_dropdown-button_vitro-text_1FRiwp0","vitro-dropdown-button-item-overflow":"_dropdown-button_vitro-dropdown-button-item-overflow_2aWEhD4","vitro-icon":"_dropdown-button_vitro-icon_2NCEoeb","dropdown-item":"_dropdown-button_dropdown-item_1c2DhhE"};
+var styles$b = {"vitro-dropdown-button":"_dropdown-button_vitro-dropdown-button_1myvkhB","vitro-dropdown-icon":"_dropdown-button_vitro-dropdown-icon_2aKCNii","vitro-text":"_dropdown-button_vitro-text_1FRiwp0","vitro-dropdown-button-item-overflow":"_dropdown-button_vitro-dropdown-button-item-overflow_2aWEhD4","vitro-icon":"_dropdown-button_vitro-icon_2NCEoeb","dropdown-item":"_dropdown-button_dropdown-item_1c2DhhE"};
 
-var w$3 = window;
+var w$4 = window;
 var ALIGN_END = 'end';
 var POSITION_ABSOLUTE = 'absolute';
 var DropdownButton = function DropdownButton(props) {
   React.useEffect(function () {
     return function () {
-      w$3.$('body > .dropdown-menu').remove();
+      w$4.$('body > .dropdown-menu').remove();
     };
   }, []);
   var hideMenu = function hideMenu() {
-    var button = w$3.$('.vitro-dropdown-button-active');
+    var button = w$4.$('.vitro-dropdown-button-active');
     if (button.length > 0) {
       button.removeClass('vitro-dropdown-button-active');
       if (button.next().length < 1) {
-        button.after(w$3.$('body > .dropdown-menu').css({
+        button.after(w$4.$('body > .dropdown-menu').css({
           position: false,
           left: false,
           top: false
@@ -59995,10 +60050,10 @@ var DropdownButton = function DropdownButton(props) {
     if (props.isIgnoreOverflow) {
       if (state) {
         hideMenu();
-        var target = w$3.$(e.currentTarget);
+        var target = w$4.$(e.currentTarget);
         var menu = target.next();
         if (menu.length > 0) {
-          w$3.$('body').append(menu.css({
+          w$4.$('body').append(menu.css({
             position: POSITION_ABSOLUTE,
             left: menu.offset().left,
             top: menu.offset().top
@@ -60018,10 +60073,10 @@ var DropdownButton = function DropdownButton(props) {
     return !x.isOverflow;
   });
   return React__default.createElement("div", {
-    className: styles$a['vitro-dropdown-button'] + CTRL.SPACE + (props.className || CTRL.EMPTY)
+    className: styles$b['vitro-dropdown-button'] + CTRL.SPACE + (props.className || CTRL.EMPTY)
   }, overflowItemList.map(function (item) {
     return React__default.createElement("div", {
-      className: styles$a['vitro-dropdown-button-item-overflow'],
+      className: styles$b['vitro-dropdown-button-item-overflow'],
       key: item.key,
       onClick: function onClick(e) {
         return item.onClick(item.value, e);
@@ -60029,15 +60084,15 @@ var DropdownButton = function DropdownButton(props) {
     }, item.imageUrl && React__default.createElement(Icon, {
       defaultUrl: item.imageUrl,
       hoverUrl: item.imageHoverUrl,
-      className: styles$a['vitro-icon']
+      className: styles$b['vitro-icon']
     }), React__default.createElement("span", null, item.text));
   }), dropItemList.length > 0 && React__default.createElement(BootstrapDropdown, {
     align: ALIGN_END,
     onToggle: onDropdownToggle
   }, React__default.createElement(BootstrapDropdown.Toggle, null, props.title && React__default.createElement("span", {
-    className: styles$a['vitro-title']
+    className: styles$b['vitro-title']
   }, props.title), React__default.createElement("span", {
-    className: styles$a['vitro-dropdown-icon']
+    className: styles$b['vitro-dropdown-icon']
   }, props.title)), React__default.createElement(BootstrapDropdown.Menu, {
     renderOnMount: true,
     flip: false
@@ -60051,7 +60106,7 @@ var DropdownButton = function DropdownButton(props) {
       item: x,
       isConfirm: true
     }, React__default.createElement("a", {
-      className: styles$a['dropdown-item'],
+      className: styles$b['dropdown-item'],
       role: 'button'
     }, x.text)) : React__default.createElement(BootstrapDropdown.Item, {
       key: x.key,
@@ -60062,17 +60117,17 @@ var DropdownButton = function DropdownButton(props) {
     }, x.imageUrl && React__default.createElement(Icon, {
       defaultUrl: x.imageUrl,
       hoverUrl: x.imageHoverUrl,
-      className: styles$a['vitro-icon']
+      className: styles$b['vitro-icon']
     }), React__default.createElement("span", null, x.text));
   }))));
 };
 
-var styles$b = {"vitro-tab":"_tab-group_vitro-tab_1Qb50HL","vitro-item":"_tab-group_vitro-item_2YnBcmb","active":"_tab-group_active_3M-IIR2","vitro-dropdown-button":"_tab-group_vitro-dropdown-button_146jv_h"};
+var styles$c = {"vitro-tab":"_tab-group_vitro-tab_1Qb50HL","vitro-item":"_tab-group_vitro-item_2YnBcmb","active":"_tab-group_active_3M-IIR2","vitro-dropdown-button":"_tab-group_vitro-dropdown-button_146jv_h"};
 
 var OverflowButton = function OverflowButton(props) {
   if (!props.list || !props.list.length) return null;
   return React__default.createElement(DropdownButton, {
-    className: styles$b['vitro-dropdown-button'],
+    className: styles$c['vitro-dropdown-button'],
     itemList: props.list.map(function (x, i) {
       return _extends({}, x, {
         value: props.offset + i,
@@ -60088,9 +60143,9 @@ var OverflowButton = function OverflowButton(props) {
 var Tab = function Tab(props) {
   return React__default.createElement("div", {
     key: props.index,
-    className: styles$b['vitro-item']
+    className: styles$c['vitro-item']
   }, React__default.createElement(Nav$2.Item, {
-    className: props.active ? styles$b['active'] : undefined,
+    className: props.active ? styles$c['active'] : undefined,
     onClick: function onClick() {
       return props.onClick(props.index);
     }
@@ -60125,7 +60180,7 @@ var TabGroupHeader = function TabGroupHeader(props) {
   }));
 };
 
-var w$4 = window;
+var w$5 = window;
 var TabGroupComponent = function TabGroupComponent(props) {
   var _useState = React.useState(0),
     width = _useState[0],
@@ -60147,8 +60202,8 @@ var TabGroupComponent = function TabGroupComponent(props) {
     if (ref.current) {
       setWidth(ref.current.offsetWidth);
       if (props.wrap) {
-        if (w$4.addResizeListener) {
-          w$4.addResizeListener(ref.current, function () {
+        if (w$5.addResizeListener) {
+          w$5.addResizeListener(ref.current, function () {
             return setWidth(ref.current.offsetWidth);
           });
         }
@@ -60168,7 +60223,7 @@ var TabGroupComponent = function TabGroupComponent(props) {
     }
   }, [currentTab, props.itemList]);
   return React__default.createElement("div", {
-    className: styles$b['vitro-tab'],
+    className: styles$c['vitro-tab'],
     ref: ref
   }, React__default.createElement(TabGroupHeader, {
     itemList: props.itemList,
@@ -60189,10 +60244,10 @@ var tabScriptList = [{
   id: 'vitro-script-perfect-scroll'
 }];
 
-var w$5 = window;
+var w$6 = window;
 var TabGroup = function TabGroup(props) {
   var scriptList = [];
-  if (!w$5.addResizeListener) {
+  if (!w$6.addResizeListener) {
     scriptList = tabScriptList;
   }
   return props.wrap ? React__default.createElement(commonUi.ScriptLoader, {
@@ -60206,18 +60261,18 @@ var TabGroup = function TabGroup(props) {
   }, React__default.createElement(TabGroupComponent, Object.assign({}, props))) : React__default.createElement(TabGroupComponent, Object.assign({}, props));
 };
 
-var styles$c = {"vitro-control":"_control-group_vitro-control_2h_sXQv","vitro-control-row":"_control-group_vitro-control-row_6l8m5Wh","vitro-label":"_control-group_vitro-label_3J193Ml"};
+var styles$d = {"vitro-control":"_control-group_vitro-control_2h_sXQv","vitro-control-row":"_control-group_vitro-control-row_6l8m5Wh","vitro-label":"_control-group_vitro-label_3J193Ml"};
 
 var ControlGroup = function ControlGroup(props) {
   if (props.horizontal) {
     return React__default.createElement("div", {
-      className: 'container ' + styles$c['vitro-control']
+      className: 'container ' + styles$d['vitro-control']
     }, React__default.createElement("div", {
       className: props.as
     }, props.children));
   }
   return React__default.createElement("div", {
-    className: styles$c['vitro-control-row']
+    className: styles$d['vitro-control-row']
   }, props.children);
 };
 
@@ -60245,7 +60300,7 @@ var View = function View(props) {
     }
   }, [props.tabList]);
   return tabList && React__default.createElement("div", {
-    className: styles$9["vitro-view"]
+    className: styles$a["vitro-view"]
   }, React__default.createElement(TabGroup, {
     itemList: tabList,
     wrap: true
@@ -60264,17 +60319,17 @@ var GetGroupControl = function GetGroupControl(props) {
   }));
 };
 
-var styles$d = {"vitro-label":"_label_vitro-label_it8WNUE","vitro-required":"_label_vitro-required_2-bSGif"};
+var styles$e = {"vitro-label":"_label_vitro-label_it8WNUE","vitro-required":"_label_vitro-required_2-bSGif"};
 
 var PX_UNIT$1 = 'px';
 var Label = function Label(props) {
   return React__default.createElement("div", {
-    className: styles$d['vitro-label'] + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY),
+    className: styles$e['vitro-label'] + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY),
     style: props.width ? {
       width: props.width + PX_UNIT$1
     } : undefined
   }, props.text, props.isRequired && React__default.createElement("span", {
-    className: styles$d['vitro-required']
+    className: styles$e['vitro-required']
   }, CTRL.ASTERISK));
 };
 
@@ -60298,7 +60353,7 @@ var REGEXP;
   REGEXP["INT"] = "^[0-9]+$";
 })(REGEXP || (REGEXP = {}));
 
-var styles$e = {"vitro-control":"_input_vitro-control_1DmPFkF","vitro-focus":"_input_vitro-focus_1txynr8","vitro-label":"_input_vitro-label_2XBESiY","vitro-read-only":"_input_vitro-read-only_3f-cBbK","vitro-error":"_input_vitro-error_1T3dLzB","vitro-left-label":"_input_vitro-left-label_D9Fpvpd","vitro-error-text":"_input_vitro-error-text_QpZK56k","vitro-button-copy":"_input_vitro-button-copy_jjyktjx"};
+var styles$f = {"vitro-control":"_input_vitro-control_1DmPFkF","vitro-focus":"_input_vitro-focus_1txynr8","vitro-label":"_input_vitro-label_2XBESiY","vitro-read-only":"_input_vitro-read-only_3f-cBbK","vitro-error":"_input_vitro-error_1T3dLzB","vitro-left-label":"_input_vitro-left-label_D9Fpvpd","vitro-error-text":"_input_vitro-error-text_QpZK56k","vitro-button-copy":"_input_vitro-button-copy_jjyktjx"};
 
 var PX_UNIT$2 = 'px';
 var Input = function Input(props) {
@@ -60329,7 +60384,7 @@ var Input = function Input(props) {
     if (inputValue !== value) updateValue(value, true);
   }, [props.value]);
   React.useEffect(function () {
-    setState(props.errorMessage ? styles$e['vitro-error'] : CTRL.EMPTY);
+    setState(props.errorMessage ? styles$f['vitro-error'] : CTRL.EMPTY);
   }, [props.errorMessage]);
   React.useEffect(function () {
     var jsonStyle = {};
@@ -60370,7 +60425,7 @@ var Input = function Input(props) {
     }
   };
   var onBlur = function onBlur(e) {
-    setState(props.errorMessage ? styles$e['vitro-error'] : CTRL.EMPTY);
+    setState(props.errorMessage ? styles$f['vitro-error'] : CTRL.EMPTY);
     if (props.onBlur) {
       props.onBlur(e);
     }
@@ -60379,7 +60434,7 @@ var Input = function Input(props) {
     }
   };
   var onFocus = function onFocus(e) {
-    setState(styles$e['vitro-focus']);
+    setState(styles$f['vitro-focus']);
     if (props.onFocus) {
       props.onFocus(e);
     }
@@ -60435,19 +60490,19 @@ var Input = function Input(props) {
     });
     if (props.isIcon) {
       control = React__default.createElement("div", {
-        className: styles$e['vitro-icon-control'] + CTRL.SPACE + state
+        className: styles$f['vitro-icon-control'] + CTRL.SPACE + state
       }, input);
     } else {
       control = input;
     }
   }
   var getClassName = function getClassName() {
-    var classList = [styles$e['vitro-control'], props.className];
+    var classList = [styles$f['vitro-control'], props.className];
     if (props.isDisabled || props.isReadOnly) {
-      classList.push(styles$e['vitro-read-only']);
+      classList.push(styles$f['vitro-read-only']);
     }
     if (props.labelPosition === POSITION.LEFT) {
-      classList.push(styles$e['vitro-left-label']);
+      classList.push(styles$f['vitro-left-label']);
     }
     classList.push(state);
     return classList.join(CTRL.SPACE);
@@ -60458,34 +60513,34 @@ var Input = function Input(props) {
     text: props.label,
     isRequired: props.isRequired,
     width: props.labelWidth,
-    className: styles$e['vitro-label']
+    className: styles$f['vitro-label']
   }), control, props.isReadOnly ? React__default.createElement("span", {
-    className: styles$e['vitro-button-copy'],
+    className: styles$f['vitro-button-copy'],
     onClick: copyValue
   }) : null, props.children, props.errorMessage && React__default.createElement("span", {
-    className: styles$e['vitro-error-text']
+    className: styles$f['vitro-error-text']
   }, props.errorMessage));
 };
 
-var styles$f = {"vitro-issue-tile-footer":"_issue-tile-footer_vitro-issue-tile-footer_KtHOieL","vitro-issue-tile-status":"_issue-tile-footer_vitro-issue-tile-status_3OjC56L","vitro-status-color":"_issue-tile-footer_vitro-status-color_hhLb22J","vitro-button-more":"_issue-tile-footer_vitro-button-more_1RyVAeR"};
+var styles$g = {"vitro-issue-tile-footer":"_issue-tile-footer_vitro-issue-tile-footer_KtHOieL","vitro-issue-tile-status":"_issue-tile-footer_vitro-issue-tile-status_3OjC56L","vitro-status-color":"_issue-tile-footer_vitro-status-color_hhLb22J","vitro-button-more":"_issue-tile-footer_vitro-button-more_1RyVAeR"};
 
 var IssueTileFooter = function IssueTileFooter(props) {
   return React__default.createElement("div", {
-    className: styles$f['vitro-issue-tile-footer']
+    className: styles$g['vitro-issue-tile-footer']
   }, React__default.createElement("div", {
-    className: styles$f['vitro-issue-tile-status']
+    className: styles$g['vitro-issue-tile-status']
   }, props.statusColor && React__default.createElement("div", {
-    className: styles$f['vitro-status-color'],
+    className: styles$g['vitro-status-color'],
     style: {
       background: props.statusColor
     }
   }), props.status), props.onShowMoreClick && React__default.createElement("div", {
     onClick: props.onShowMoreClick,
-    className: styles$f['vitro-button-more']
+    className: styles$g['vitro-button-more']
   }));
 };
 
-var styles$g = {"vitro-avatar":"_avatar_vitro-avatar_P2tU-_r","vitro-avatar-big":"_avatar_vitro-avatar-big_pEmlX3a"};
+var styles$h = {"vitro-avatar":"_avatar_vitro-avatar_P2tU-_r","vitro-avatar-big":"_avatar_vitro-avatar-big_pEmlX3a"};
 
 var Avatar = function Avatar(props) {
   var getInitials = function getInitials() {
@@ -60526,7 +60581,7 @@ var Avatar = function Avatar(props) {
   var getBgColor = function getBgColor(name) {
     return "linear-gradient(0deg, hsla(" + getHue(name) + ", 58%, 55%, 1), hsla(" + (getHue(name) + 50) + ", 100%, 78%, 1))";
   };
-  var className = styles$g['vitro-avatar'] + (props.isBigSize ? CTRL.SPACE + styles$g['vitro-avatar-big'] : CTRL.EMPTY) + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY);
+  var className = styles$h['vitro-avatar'] + (props.isBigSize ? CTRL.SPACE + styles$h['vitro-avatar-big'] : CTRL.EMPTY) + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY);
   return React__default.createElement("div", {
     className: className,
     style: {
@@ -60535,30 +60590,30 @@ var Avatar = function Avatar(props) {
   }, getInitials());
 };
 
-var styles$h = {"vitro-issue-tile-header":"_issue-tile-header_vitro-issue-tile-header_jTcaXBE","vitro-link":"_issue-tile-header_vitro-link_9DQ3Bqk","vitro-user-info":"_issue-tile-header_vitro-user-info_16Yhluy","vitro-avatar":"_issue-tile-header_vitro-avatar_3rf1BME","vitro-dropdown-button":"_issue-tile-header_vitro-dropdown-button_1-7nI-k"};
+var styles$i = {"vitro-issue-tile-header":"_issue-tile-header_vitro-issue-tile-header_jTcaXBE","vitro-link":"_issue-tile-header_vitro-link_9DQ3Bqk","vitro-user-info":"_issue-tile-header_vitro-user-info_16Yhluy","vitro-avatar":"_issue-tile-header_vitro-avatar_3rf1BME","vitro-dropdown-button":"_issue-tile-header_vitro-dropdown-button_1-7nI-k"};
 
 var VERSION = 'V';
 var TARGET_BLANK = '_blank';
 var IssueTileHeader = function IssueTileHeader(props) {
   return React__default.createElement("div", {
-    className: styles$h['vitro-issue-tile-header']
+    className: styles$i['vitro-issue-tile-header']
   }, React__default.createElement("a", {
-    className: styles$h['vitro-link'],
+    className: styles$i['vitro-link'],
     href: props.url,
     target: TARGET_BLANK
   }, CTRL.SHARP + props.id), React__default.createElement("div", {
-    className: styles$h['vitro-user-info']
+    className: styles$i['vitro-user-info']
   }, React__default.createElement(Avatar, {
     image: props.userImage,
     userName: props.userName,
-    className: styles$h['vitro-avatar']
+    className: styles$i['vitro-avatar']
   }), React__default.createElement("div", null, React__default.createElement("span", null, props.userName), React__default.createElement("span", null, props.date))), React__default.createElement("a", {
-    className: styles$h['vitro-link'],
+    className: styles$i['vitro-link'],
     href: props.fileVersionUrl,
     target: TARGET_BLANK
   }, VERSION + CTRL.SQUARE_BRACKET_OPEN + props.fileVersion + CTRL.SQUARE_BRACKET_CLOSE), props.actionList && props.actionList.length ? React__default.createElement(DropdownButton, {
     itemList: props.actionList,
-    className: styles$h['vitro-dropdown-button']
+    className: styles$i['vitro-dropdown-button']
   }) : null);
 };
 
@@ -60567,12 +60622,12 @@ var LOCALE$2;
   LOCALE["TEXTAREA_LABEL"] = "app.common.issueTile.textareaLabel";
 })(LOCALE$2 || (LOCALE$2 = {}));
 
-var styles$i = {"vitro-issue-tile":"_issue-tile_vitro-issue-tile_2D7E9Y-","vitro-control":"_issue-tile_vitro-control_3V6_Ze7"};
+var styles$j = {"vitro-issue-tile":"_issue-tile_vitro-issue-tile_2D7E9Y-","vitro-control":"_issue-tile_vitro-control_3V6_Ze7"};
 
 var IssueTile = function IssueTile(props) {
   return React__default.createElement("div", {
     id: 'vitro-issue-tile-' + props.id,
-    className: styles$i['vitro-issue-tile'] + (props.isActive ? CTRL.SPACE + styles$i['vitro-active'] : CTRL.EMPTY),
+    className: styles$j['vitro-issue-tile'] + (props.isActive ? CTRL.SPACE + styles$j['vitro-active'] : CTRL.EMPTY),
     onClick: props.onClick
   }, React__default.createElement(IssueTileHeader, {
     id: props.id,
@@ -60587,7 +60642,7 @@ var IssueTile = function IssueTile(props) {
     isMultiline: true,
     label: props.createLocale(LOCALE$2.TEXTAREA_LABEL),
     onBlur: props.onBlur,
-    className: styles$i['vitro-control'],
+    className: styles$j['vitro-control'],
     value: props.text,
     rows: 7
   }), React__default.createElement(IssueTileFooter, {
@@ -60597,7 +60652,7 @@ var IssueTile = function IssueTile(props) {
   }));
 };
 
-var w$6 = window;
+var w$7 = window;
 var Viewer = function Viewer(props) {
   React.useEffect(function () {
     if (props.context.file) {
@@ -60605,11 +60660,11 @@ var Viewer = function Viewer(props) {
     }
   }, [props.context.file]);
   var init = function init() {
-    if (w$6.initPdfViewer) {
+    if (w$7.initPdfViewer) {
       var context = _extends({}, props.context, {
         initIssueList: initIssueList
       });
-      w$6.initPdfViewer(context);
+      w$7.initPdfViewer(context);
     }
   };
   var initIssueList = function initIssueList() {
@@ -60632,10 +60687,10 @@ var Viewer = function Viewer(props) {
     var markup = JSON.parse(issue.markup);
     $('.body__sidebar-content').children().removeClass('vitro-active');
     $(CTRL.SHARP + 'vitro-issue-tile-' + id).addClass('vitro-active');
-    var numPages = w$6.PDFViewerApplication.pagesCount;
+    var numPages = w$7.PDFViewerApplication.pagesCount;
     if (markup && markup.pageNr <= numPages && markup.pageNr >= 1) {
-      if (markup.pageNr != w$6.PDFViewerApplication.pdfViewer.currentPageNumber) {
-        w$6.PDFViewerApplication.page = markup.pageNr;
+      if (markup.pageNr != w$7.PDFViewerApplication.pdfViewer.currentPageNumber) {
+        w$7.PDFViewerApplication.page = markup.pageNr;
       }
       if ($(CTRL.SHARP + id).length) {
         scrollToMarkup(id);
@@ -60681,7 +60736,7 @@ var PdfViewer = function PdfViewer(props) {
   }));
 };
 
-var styles$j = {"vitro-control":"_checkbox_vitro-control_DfB5DDM","vitro-checkbox-content":"_checkbox_vitro-checkbox-content_2fBG1zl","vitro-label":"_checkbox_vitro-label_qZxCbCP","vitro-left-label":"_checkbox_vitro-left-label_Uu1Tp31"};
+var styles$k = {"vitro-control":"_checkbox_vitro-control_DfB5DDM","vitro-checkbox-content":"_checkbox_vitro-checkbox-content_2fBG1zl","vitro-label":"_checkbox_vitro-label_qZxCbCP","vitro-left-label":"_checkbox_vitro-left-label_Uu1Tp31"};
 
 var Checkbox = function Checkbox(props) {
   var _useState = React.useState(props.value ? true : false),
@@ -60694,14 +60749,14 @@ var Checkbox = function Checkbox(props) {
   React.useEffect(function () {
     setValue(props.value ? true : false);
   }, [props.value]);
-  var className = styles$j['vitro-control'] + (props.labelPosition === POSITION.LEFT ? CTRL.SPACE + styles$j['vitro-left-label'] : CTRL.EMPTY) + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY);
+  var className = styles$k['vitro-control'] + (props.labelPosition === POSITION.LEFT ? CTRL.SPACE + styles$k['vitro-left-label'] : CTRL.EMPTY) + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY);
   return React__default.createElement("div", {
     className: className
   }, props.labelPosition === POSITION.LEFT && React__default.createElement(Label, {
     text: props.label,
-    className: styles$j['vitro-label']
+    className: styles$k['vitro-label']
   }), React__default.createElement("div", {
-    className: styles$j['vitro-checkbox-content']
+    className: styles$k['vitro-checkbox-content']
   }, React__default.createElement("input", {
     disabled: props.isDisabled,
     type: 'checkbox',
@@ -60710,7 +60765,7 @@ var Checkbox = function Checkbox(props) {
     onChange: onChange
   }), props.labelPosition !== POSITION.LEFT && React__default.createElement(Label, {
     text: props.label,
-    className: styles$j['vitro-label']
+    className: styles$k['vitro-label']
   })));
 };
 
@@ -60735,7 +60790,7 @@ var INPUT_TYPE;
   INPUT_TYPE["TEXT"] = "text";
 })(INPUT_TYPE || (INPUT_TYPE = {}));
 
-var styles$k = {"vitro-login-layout":"_login_vitro-login-layout_1C8owlz","vitro-form-login":"_login_vitro-form-login_2nyw95B","vitro-logo":"_login_vitro-logo_3-qTjgy","vitro-title":"_login_vitro-title_nfoHltS","vitro-flex":"_login_vitro-flex_2CffX6W","vitro-link":"_login_vitro-link_az1ZWIc","vitro-separator":"_login_vitro-separator_2jHZJHO","vitro-login-control":"_login_vitro-login-control_cksptcC","vitro-error":"_login_vitro-error_1Nk25em","vitro-control":"_login_vitro-control_3YqxIR2","vitro-login-checkbox":"_login_vitro-login-checkbox_39NOnZg","vitro-button":"_login_vitro-button_2OCqKtD","vitro-button-show-password":"_login_vitro-button-show-password_3NpbpN5","vitro-button-hide-password":"_login_vitro-button-hide-password_27R-yFe","vitro-footer":"_login_vitro-footer_1lceaP0","vitro-link-list":"_login_vitro-link-list_1rQQg9u","vitro-copyright":"_login_vitro-copyright_1gm65Ao","vitro-language":"_login_vitro-language_2T3uktL"};
+var styles$l = {"vitro-login-layout":"_login_vitro-login-layout_1C8owlz","vitro-form-login":"_login_vitro-form-login_2nyw95B","vitro-logo":"_login_vitro-logo_3-qTjgy","vitro-title":"_login_vitro-title_nfoHltS","vitro-flex":"_login_vitro-flex_2CffX6W","vitro-link":"_login_vitro-link_az1ZWIc","vitro-separator":"_login_vitro-separator_2jHZJHO","vitro-login-control":"_login_vitro-login-control_cksptcC","vitro-error":"_login_vitro-error_1Nk25em","vitro-control":"_login_vitro-control_3YqxIR2","vitro-login-checkbox":"_login_vitro-login-checkbox_39NOnZg","vitro-button":"_login_vitro-button_2OCqKtD","vitro-button-show-password":"_login_vitro-button-show-password_3NpbpN5","vitro-button-hide-password":"_login_vitro-button-hide-password_27R-yFe","vitro-footer":"_login_vitro-footer_1lceaP0","vitro-link-list":"_login_vitro-link-list_1rQQg9u","vitro-copyright":"_login_vitro-copyright_1gm65Ao","vitro-language":"_login_vitro-language_2T3uktL"};
 
 var LoginInput = function LoginInput(props) {
   var _useState = React.useState(CTRL.EMPTY),
@@ -60744,7 +60799,7 @@ var LoginInput = function LoginInput(props) {
   var _useState2 = React.useState(props.type || INPUT_TYPE.TEXT),
     type = _useState2[0],
     setType = _useState2[1];
-  var _useState3 = React.useState(styles$k['vitro-button-show-password']),
+  var _useState3 = React.useState(styles$l['vitro-button-show-password']),
     icon = _useState3[0],
     setIcon = _useState3[1];
   var _useState4 = React.useState(CTRL.EMPTY),
@@ -60761,7 +60816,7 @@ var LoginInput = function LoginInput(props) {
   }, [props.isValidate]);
   React.useEffect(function () {
     if (props.error) {
-      setState(styles$k['vitro-error']);
+      setState(styles$l['vitro-error']);
       setError(props.error);
     }
   }, [props.error]);
@@ -60787,10 +60842,10 @@ var LoginInput = function LoginInput(props) {
   var togglePassword = function togglePassword() {
     if (type === INPUT_TYPE.PASSWORD) {
       setType(INPUT_TYPE.TEXT);
-      setIcon(styles$k['vitro-button-hide-password']);
+      setIcon(styles$l['vitro-button-hide-password']);
     } else {
       setType(INPUT_TYPE.PASSWORD);
-      setIcon(styles$k['vitro-button-show-password']);
+      setIcon(styles$l['vitro-button-show-password']);
     }
   };
   var validate = function validate() {
@@ -60800,14 +60855,14 @@ var LoginInput = function LoginInput(props) {
         fieldName: fieldName
       });
       setError(text);
-      setState(styles$k['vitro-error']);
+      setState(styles$l['vitro-error']);
     } else {
       setError(CTRL.EMPTY);
       setState(CTRL.EMPTY);
     }
   };
   return React__default.createElement("div", {
-    className: styles$k['vitro-login-control'] + CTRL.SPACE + state
+    className: styles$l['vitro-login-control'] + CTRL.SPACE + state
   }, React__default.createElement(Input, {
     type: type,
     name: props.name,
@@ -60820,7 +60875,7 @@ var LoginInput = function LoginInput(props) {
     onFocus: onFocus,
     onBlur: onBlur,
     errorMessage: error,
-    className: styles$k['vitro-control']
+    className: styles$l['vitro-control']
   }), props.type === INPUT_TYPE.PASSWORD && React__default.createElement("span", {
     className: icon,
     onClick: togglePassword
@@ -60829,17 +60884,17 @@ var LoginInput = function LoginInput(props) {
 
 var LoginFooter = function LoginFooter(props) {
   return React__default.createElement("div", {
-    className: styles$k['vitro-footer']
+    className: styles$l['vitro-footer']
   }, React__default.createElement("div", {
-    className: styles$k['vitro-language']
+    className: styles$l['vitro-language']
   }), React__default.createElement("ul", {
-    className: styles$k['vitro-link-list']
+    className: styles$l['vitro-link-list']
   }, props.itemList && props.itemList.map(function (item) {
     return React__default.createElement("li", null, React__default.createElement("a", {
       href: item.url
     }, item.text));
   })), React__default.createElement("div", {
-    className: styles$k['vitro-copyright']
+    className: styles$l['vitro-copyright']
   }, props.copyright));
 };
 
@@ -60895,13 +60950,13 @@ var Login = function Login(props) {
     }
   };
   return React__default.createElement("div", {
-    className: styles$k['vitro-login-layout']
+    className: styles$l['vitro-login-layout']
   }, React__default.createElement("div", {
-    className: styles$k['vitro-form-login']
+    className: styles$l['vitro-form-login']
   }, React__default.createElement("div", {
-    className: styles$k['vitro-logo']
+    className: styles$l['vitro-logo']
   }), React__default.createElement("div", {
-    className: styles$k['vitro-title']
+    className: styles$l['vitro-title']
   }, localeService.create(LOCALE$3.TITLE)), React__default.createElement(LoginInput, {
     label: localeService.create(LOCALE$3.PLACEHOLDER_NAME),
     name: FIELD_USER_NAME,
@@ -60924,24 +60979,24 @@ var Login = function Login(props) {
     isValidate: validateData,
     error: error[FIELD_PASSWORD]
   }), React__default.createElement("div", {
-    className: styles$k['vitro-flex']
+    className: styles$l['vitro-flex']
   }, React__default.createElement(Checkbox, {
     label: localeService.create(LOCALE$3.ACTION_SAVE_DATA),
     name: CHECKBOX_SAVE_DATA,
     onChange: props.onSaveData,
-    className: styles$k['vitro-login-checkbox']
+    className: styles$l['vitro-login-checkbox']
   }), React__default.createElement("a", {
-    className: styles$k['vitro-link'],
+    className: styles$l['vitro-link'],
     onClick: props.onResetPassword
   }, localeService.create(LOCALE$3.ACTION_RESET_PASSWORD))), React__default.createElement(Button$2, {
-    className: styles$k['vitro-button'],
+    className: styles$l['vitro-button'],
     text: localeService.create(LOCALE$3.ACTION_LOGIN),
     onClick: submit,
     isDisabled: loading
   }), React__default.createElement("div", {
-    className: styles$k['vitro-separator']
+    className: styles$l['vitro-separator']
   }, localeService.create(LOCALE$3.SEPARATOR_TEXT)), React__default.createElement("a", {
-    className: styles$k['vitro-link'],
+    className: styles$l['vitro-link'],
     onClick: props.onRegister
   }, localeService.create(LOCALE$3.ACTION_REGISTER))), React__default.createElement(LoginFooter, {
     copyright: props.copyright || localeService.create(LOCALE$3.COPYRIGHT),
@@ -60965,7 +61020,7 @@ var LABEL_POSITION;
   LABEL_POSITION["LEFT"] = "left";
 })(LABEL_POSITION || (LABEL_POSITION = {}));
 
-var styles$l = {"vitro-control":"_date-picker_vitro-control_2AYXegb","vitro-button-copy":"_date-picker_vitro-button-copy_1cGY1Uu","vitro-control-container":"_date-picker_vitro-control-container_2CVwecs","vitro-focus":"_date-picker_vitro-focus_2cJKcKr","vitro-label":"_date-picker_vitro-label_2jh9qxb","vitro-read-only":"_date-picker_vitro-read-only_2NZoMN5","vitro-error":"_date-picker_vitro-error_3DkgZiN","vitro-left-label":"_date-picker_vitro-left-label_ZFhZFS9","vitro-error-text":"_date-picker_vitro-error-text_15CdrRj"};
+var styles$m = {"vitro-control":"_date-picker_vitro-control_2AYXegb","vitro-button-copy":"_date-picker_vitro-button-copy_1cGY1Uu","vitro-control-container":"_date-picker_vitro-control-container_2CVwecs","vitro-focus":"_date-picker_vitro-focus_2cJKcKr","vitro-label":"_date-picker_vitro-label_2jh9qxb","vitro-read-only":"_date-picker_vitro-read-only_2NZoMN5","vitro-error":"_date-picker_vitro-error_3DkgZiN","vitro-left-label":"_date-picker_vitro-left-label_ZFhZFS9","vitro-error-text":"_date-picker_vitro-error-text_15CdrRj"};
 
 var $$3 = window.$;
 var DatePicker = function DatePicker(props) {
@@ -61031,24 +61086,24 @@ var DatePicker = function DatePicker(props) {
     if (props.maxValue) $$3(ref.current).data(componentName).max(props.maxValue);
   }, [props.maxValue]);
   React.useEffect(function () {
-    props.errorMessage ? setState(styles$l['vitro-error']) : setState(CTRL.EMPTY);
+    props.errorMessage ? setState(styles$m['vitro-error']) : setState(CTRL.EMPTY);
   }, [props.errorMessage]);
   var onFocus = function onFocus() {
-    setState(styles$l['vitro-focus']);
+    setState(styles$m['vitro-focus']);
   };
   var onBlur = function onBlur() {
-    setState(props.errorMessage ? styles$l['vitro-error'] : styles$l[CTRL.EMPTY]);
+    setState(props.errorMessage ? styles$m['vitro-error'] : styles$m[CTRL.EMPTY]);
   };
   var copyValue = function copyValue() {
     navigator.clipboard.writeText("" + props.value);
   };
   var getClassName = function getClassName() {
-    var classList = [styles$l['vitro-control'], props.className];
+    var classList = [styles$m['vitro-control'], props.className];
     if (props.isDisabled || props.isReadOnly) {
-      classList.push(styles$l['vitro-read-only']);
+      classList.push(styles$m['vitro-read-only']);
     }
     if (props.labelPosition === POSITION.LEFT) {
-      classList.push(styles$l['vitro-left-label']);
+      classList.push(styles$m['vitro-left-label']);
     }
     classList.push(state);
     return classList.join(CTRL.SPACE);
@@ -61059,20 +61114,20 @@ var DatePicker = function DatePicker(props) {
     text: props.label,
     isRequired: props.isRequired,
     width: props.labelWidth,
-    className: styles$l['vitro-label']
+    className: styles$m['vitro-label']
   }), React__default.createElement("input", {
     ref: ref,
     placeholder: props.placeholder,
     onFocus: onFocus,
     onBlur: onBlur
   }), props.isReadOnly ? React__default.createElement("span", {
-    className: styles$l['vitro-button-copy'],
+    className: styles$m['vitro-button-copy'],
     onClick: copyValue
   }) : null, React__default.createElement("div", {
     ref: container,
-    className: styles$l['vitro-control-container']
+    className: styles$m['vitro-control-container']
   }), props.errorMessage && React__default.createElement("span", {
-    className: styles$l['vitro-error-text']
+    className: styles$m['vitro-error-text']
   }, props.errorMessage));
 };
 
@@ -61093,7 +61148,7 @@ var COMPONENT_TYPE;
   COMPONENT_TYPE["MODERN"] = "modern";
 })(COMPONENT_TYPE || (COMPONENT_TYPE = {}));
 
-var styles$m = {"vitro-control":"_time-picker_vitro-control_1sx07It","vitro-button-copy":"_time-picker_vitro-button-copy_QZg3bTW","vitro-control-container":"_time-picker_vitro-control-container_3ys3rMN","vitro-focus":"_time-picker_vitro-focus_wmhPjvE","vitro-label":"_time-picker_vitro-label_2b97aCy","vitro-error":"_time-picker_vitro-error_2ZmK0I5","vitro-read-only":"_time-picker_vitro-read-only_NlE18Zm","vitro-left-label":"_time-picker_vitro-left-label_3NRmFYH","vitro-error-text":"_time-picker_vitro-error-text_2BNoBKW"};
+var styles$n = {"vitro-control":"_time-picker_vitro-control_1sx07It","vitro-button-copy":"_time-picker_vitro-button-copy_QZg3bTW","vitro-control-container":"_time-picker_vitro-control-container_3ys3rMN","vitro-focus":"_time-picker_vitro-focus_wmhPjvE","vitro-label":"_time-picker_vitro-label_2b97aCy","vitro-error":"_time-picker_vitro-error_2ZmK0I5","vitro-read-only":"_time-picker_vitro-read-only_NlE18Zm","vitro-left-label":"_time-picker_vitro-left-label_3NRmFYH","vitro-error-text":"_time-picker_vitro-error-text_2BNoBKW"};
 
 var $$4 = window.$;
 var TimePicker = function TimePicker(props) {
@@ -61139,21 +61194,21 @@ var TimePicker = function TimePicker(props) {
     $$4(ref.current).data(componentName).value(props.value);
   }, [props.value]);
   var onFocus = function onFocus() {
-    setState(styles$m['vitro-focus']);
+    setState(styles$n['vitro-focus']);
   };
   var onBlur = function onBlur() {
-    setState(props.errorMessage ? styles$m['vitro-error'] : styles$m[CTRL.EMPTY]);
+    setState(props.errorMessage ? styles$n['vitro-error'] : styles$n[CTRL.EMPTY]);
   };
   var copyValue = function copyValue() {
     navigator.clipboard.writeText("" + props.value);
   };
   var getClassName = function getClassName() {
-    var classList = [styles$m['vitro-control'], props.className];
+    var classList = [styles$n['vitro-control'], props.className];
     if (props.isDisabled || props.isReadOnly) {
-      classList.push(styles$m['vitro-read-only']);
+      classList.push(styles$n['vitro-read-only']);
     }
     if (props.labelPosition === POSITION.LEFT) {
-      classList.push(styles$m['vitro-left-label']);
+      classList.push(styles$n['vitro-left-label']);
     }
     classList.push(state);
     return classList.join(CTRL.SPACE);
@@ -61164,24 +61219,24 @@ var TimePicker = function TimePicker(props) {
     text: props.label,
     isRequired: props.isRequired,
     width: props.labelWidth,
-    className: styles$m['vitro-label']
+    className: styles$n['vitro-label']
   }), React__default.createElement("input", {
     ref: ref,
     placeholder: props.placeholder,
     onFocus: onFocus,
     onBlur: onBlur
   }), props.isReadOnly ? React__default.createElement("span", {
-    className: styles$m['vitro-button-copy'],
+    className: styles$n['vitro-button-copy'],
     onClick: copyValue
   }) : null, React__default.createElement("div", {
     ref: container,
-    className: styles$m['vitro-control-container']
+    className: styles$n['vitro-control-container']
   }), props.errorMessage && React__default.createElement("span", {
-    className: styles$m['vitro-error-text']
+    className: styles$n['vitro-error-text']
   }, props.errorMessage));
 };
 
-var styles$n = {"vitro-selected-item":"_lookup-picker-selected-item_vitro-selected-item_hw-euth"};
+var styles$o = {"vitro-selected-item":"_lookup-picker-selected-item_vitro-selected-item_hw-euth"};
 
 var htmlValueStyles = {"vitro-item-html-value":"_lookup-picker-html-value_vitro-item-html-value_2QBoTey"};
 
@@ -61190,7 +61245,7 @@ var SelectedValueList = function SelectedValueList(props) {
     var title = props.selectedValueTemplate(x);
     return React__default.createElement("div", {
       key: x.id,
-      className: styles$n['vitro-selected-item'],
+      className: styles$o['vitro-selected-item'],
       title: title
     }, props.getHtmlValue ? React__default.createElement("div", {
       className: htmlValueStyles['vitro-item-html-value']
@@ -61198,17 +61253,17 @@ var SelectedValueList = function SelectedValueList(props) {
       onClick: function onClick() {
         return props.onOptionValueDelete(x.id);
       },
-      className: styles$n['vitro-button-close']
+      className: styles$o['vitro-button-close']
     }));
   }));
 };
 
-var styles$o = {"vitro-value-list":"_lookup-picker-value-list_vitro-value-list_LSdCMjq","vitro-item":"_lookup-picker-value-list_vitro-item_7yZBz5u","vitro-item-html-value":"_lookup-picker-value-list_vitro-item-html-value_1yl9tXx","vitro-placeholder-empty":"_lookup-picker-value-list_vitro-placeholder-empty_fTVHWwc","vitro-keyword-highlight":"_lookup-picker-value-list_vitro-keyword-highlight_1uESHan","vitro-display-none":"_lookup-picker-value-list_vitro-display-none_2kDzC6K"};
+var styles$p = {"vitro-value-list":"_lookup-picker-value-list_vitro-value-list_LSdCMjq","vitro-item":"_lookup-picker-value-list_vitro-item_7yZBz5u","vitro-item-html-value":"_lookup-picker-value-list_vitro-item-html-value_1yl9tXx","vitro-placeholder-empty":"_lookup-picker-value-list_vitro-placeholder-empty_fTVHWwc","vitro-keyword-highlight":"_lookup-picker-value-list_vitro-keyword-highlight_1uESHan","vitro-display-none":"_lookup-picker-value-list_vitro-display-none_2kDzC6K"};
 
 var ValueListItem = function ValueListItem(props) {
   return React__default.createElement("div", {
     key: props.item.id,
-    className: styles$o['vitro-item'],
+    className: styles$p['vitro-item'],
     onClick: function onClick() {
       return props.onSelect(props.item.id);
     }
@@ -61234,12 +61289,12 @@ var ValueList = function ValueList(props) {
   });
   var createDisplayValue = function createDisplayValue(item) {
     return props.inputValue ? props.filterValueTemplate(item).replace(reg, function (str) {
-      return "<span class=" + styles$o['vitro-keyword-highlight'] + ">" + str + '</span>';
+      return "<span class=" + styles$p['vitro-keyword-highlight'] + ">" + str + '</span>';
     }) : props.filterValueTemplate(item);
   };
   return React__default.createElement("div", {
-    className: styles$o['vitro-value-list'] + (props.isVisible ? CTRL.EMPTY : CTRL.SPACE + styles$o['vitro-display-none'])
-  }, React__default.createElement(commonUi.ScrollBar, {
+    className: styles$p['vitro-value-list'] + (props.isVisible ? CTRL.EMPTY : CTRL.SPACE + styles$p['vitro-display-none'])
+  }, React__default.createElement(ScrollBar, {
     onInit: setScrollableElement
   }, props.isPending && React__default.createElement(commonUi.Progress, null), !props.isPending && React__default.createElement(React__default.Fragment, null, props.list.length > 0 ? props.list.map(function (x) {
     return React__default.createElement(ValueListItem, {
@@ -61249,7 +61304,7 @@ var ValueList = function ValueList(props) {
       htmlValue: props.getHtmlValue && props.getHtmlValue(x)
     });
   }) : React__default.createElement("div", {
-    className: styles$o['vitro-placeholder-empty']
+    className: styles$p['vitro-placeholder-empty']
   }, props.emptyPlaceholder))));
 };
 
@@ -61258,7 +61313,7 @@ var LOCALE$4;
   LOCALE["PLACEHOLDER_EMPTY"] = "app.common.lookupPicker.empty";
 })(LOCALE$4 || (LOCALE$4 = {}));
 
-var styles$p = {"vitro-lookup-picker":"_lookup-picker_vitro-lookup-picker_1aXYQEG","vitro-content":"_lookup-picker_vitro-content_37L0slb","vitro-focus":"_lookup-picker_vitro-focus_2UGpxXD","vitro-label":"_lookup-picker_vitro-label_2QoJkUz","vitro-read-only":"_lookup-picker_vitro-read-only_32NOdGB","vitro-error":"_lookup-picker_vitro-error_dF7iopC","vitro-error-text":"_lookup-picker_vitro-error-text_273lqvD","vitro-button-copy":"_lookup-picker_vitro-button-copy_2UIHHZD","vitro-right":"_lookup-picker_vitro-right_1XFsL1w","vitro-button-close":"_lookup-picker_vitro-button-close_3_Qndrj","vitro-button-collapse-up":"_lookup-picker_vitro-button-collapse-up_3i0OJub","vitro-button-collapse-bottom":"_lookup-picker_vitro-button-collapse-bottom_3o0Pl83"};
+var styles$q = {"vitro-lookup-picker":"_lookup-picker_vitro-lookup-picker_1aXYQEG","vitro-content":"_lookup-picker_vitro-content_37L0slb","vitro-focus":"_lookup-picker_vitro-focus_2UGpxXD","vitro-label":"_lookup-picker_vitro-label_2QoJkUz","vitro-read-only":"_lookup-picker_vitro-read-only_32NOdGB","vitro-error":"_lookup-picker_vitro-error_dF7iopC","vitro-error-text":"_lookup-picker_vitro-error-text_273lqvD","vitro-button-copy":"_lookup-picker_vitro-button-copy_2UIHHZD","vitro-right":"_lookup-picker_vitro-right_1XFsL1w","vitro-button-close":"_lookup-picker_vitro-button-close_3_Qndrj","vitro-button-collapse-up":"_lookup-picker_vitro-button-collapse-up_3i0OJub","vitro-button-collapse-bottom":"_lookup-picker_vitro-button-collapse-bottom_3o0Pl83"};
 
 var $$5 = window.$;
 var LookupPicker = function LookupPicker(props) {
@@ -61281,7 +61336,7 @@ var LookupPicker = function LookupPicker(props) {
   var _useState6 = React.useState(null),
     valueListRequestToken = _useState6[0],
     setValueListRequestToken = _useState6[1];
-  var _useState7 = React.useState(props.isDisabled || props.isReadOnly ? styles$p['vitro-read-only'] : CTRL.EMPTY),
+  var _useState7 = React.useState(props.isDisabled || props.isReadOnly ? styles$q['vitro-read-only'] : CTRL.EMPTY),
     state = _useState7[0],
     setState = _useState7[1];
   var localeService = inversifyReact.useInjection(SERVICE.LOCALE);
@@ -61358,7 +61413,7 @@ var LookupPicker = function LookupPicker(props) {
     }
   }, [selectedValueList]);
   React.useEffect(function () {
-    setState(props.errorMessage ? styles$p['vitro-error'] : CTRL.EMPTY);
+    setState(props.errorMessage ? styles$q['vitro-error'] : CTRL.EMPTY);
   }, [props.errorMessage]);
   var updateFilteredValueList = function updateFilteredValueList(valueList) {
     var availableValueList = inputValue ? filteredValueList : valueList;
@@ -61379,8 +61434,9 @@ var LookupPicker = function LookupPicker(props) {
   var selectedValueTemplate = function selectedValueTemplate(value) {
     return props.selectedValueTemplate ? props.selectedValueTemplate(value) : value.title;
   };
-  var onInput = function onInput(e) {
-    return setInputValue(e.target.value);
+  var onChange = function onChange(e) {
+    setState(styles$q['vitro-focus']);
+    setInputValue(e.target.value);
   };
   var onKeyDown = function onKeyDown(e) {
     var keyBoardBackSpace = 8;
@@ -61432,7 +61488,7 @@ var LookupPicker = function LookupPicker(props) {
   };
   var onFocusOut = function onFocusOut(e) {
     var target = e.currentTarget;
-    setState(props.errorMessage ? styles$p['vitro-error'] : CTRL.EMPTY);
+    setState(props.errorMessage ? styles$q['vitro-error'] : CTRL.EMPTY);
     setTimeout(function () {
       if (!target.contains(document.activeElement)) {
         setValueListVisible(false);
@@ -61446,19 +61502,19 @@ var LookupPicker = function LookupPicker(props) {
     });
   };
   var onFocus = function onFocus() {
-    setState(styles$p['vitro-focus']);
+    setState(styles$q['vitro-focus']);
     setValueListVisible(true);
   };
   var copyValue = function copyValue() {
     navigator.clipboard.writeText(selectedValueList.join(CTRL.COMMA));
   };
   var getClassName = function getClassName() {
-    var classList = [styles$p['vitro-lookup-picker'], props.className];
+    var classList = [styles$q['vitro-lookup-picker'], props.className];
     if (props.isDisabled || props.isReadOnly) {
-      classList.push(styles$p['vitro-read-only']);
+      classList.push(styles$q['vitro-read-only']);
     }
     if (props.isMultiSelect) {
-      classList.push(styles$p['vitro-lookup-picker-multi-select']);
+      classList.push(styles$q['vitro-lookup-picker-multi-select']);
     }
     classList.push(state);
     return classList.join(CTRL.SPACE);
@@ -61477,9 +61533,9 @@ var LookupPicker = function LookupPicker(props) {
     text: props.label,
     isRequired: props.isRequired,
     width: props.labelWidth,
-    className: styles$p['vitro-label']
+    className: styles$q['vitro-label']
   }), React__default.createElement("div", {
-    className: styles$p['vitro-content'],
+    className: styles$q['vitro-content'],
     onClick: onFocus
   }, selectedValueList && selectedValueList.length > 0 && (props.isMultiSelect ? true : inputValue.length === 0) ? React__default.createElement(SelectedValueList, {
     list: selectedValueList,
@@ -61491,14 +61547,14 @@ var LookupPicker = function LookupPicker(props) {
     ref: inputRef,
     value: inputValue,
     onKeyDown: onKeyDown,
-    onChange: onInput,
+    onChange: onChange,
     onClick: onFocus,
     disabled: props.isDisabled,
     readOnly: props.isReadOnly
   }), !props.isDisabled && props.children, React__default.createElement("div", {
-    className: styles$p['vitro-right']
+    className: styles$q['vitro-right']
   }, !props.isMultiSelect && selectedValueList && selectedValueList.length > 0 && !props.isDisabled && !props.isReadOnly && React__default.createElement("div", {
-    className: styles$p['vitro-button-close'],
+    className: styles$q['vitro-button-close'],
     onClick: function onClick() {
       return onOptionValueDelete();
     }
@@ -61506,9 +61562,9 @@ var LookupPicker = function LookupPicker(props) {
     onClick: function onClick() {
       return setValueListVisible(!valueListVisible);
     },
-    className: valueListVisible ? styles$p['vitro-button-collapse-up'] : styles$p['vitro-button-collapse-bottom']
+    className: valueListVisible ? styles$q['vitro-button-collapse-up'] : styles$q['vitro-button-collapse-bottom']
   }), props.isReadOnly ? React__default.createElement("span", {
-    className: styles$p['vitro-button-copy'],
+    className: styles$q['vitro-button-copy'],
     onClick: copyValue
   }) : null)), !props.isDisabled && (!props.filterMinLength || props.filterMinLength <= inputValue.length) && React__default.createElement(ValueList, {
     isPending: pending,
@@ -61520,38 +61576,38 @@ var LookupPicker = function LookupPicker(props) {
     emptyPlaceholder: props.emptyPlaceholder || localeService.create(LOCALE$4.PLACEHOLDER_EMPTY),
     getHtmlValue: getHtmlValue
   }), props.errorMessage && React__default.createElement("span", {
-    className: styles$p['vitro-error-text']
+    className: styles$q['vitro-error-text']
   }, props.errorMessage));
 };
 
-var styles$q = {"vitro-command-menu":"_command-menu_vitro-command-menu_l82vtIh"};
+var styles$r = {"vitro-command-menu":"_command-menu_vitro-command-menu_l82vtIh"};
 
 var CommandMenu = function CommandMenu(props) {
   return React__default.createElement("nav", {
-    className: styles$q['vitro-command-menu'] + CTRL.SPACE + 'navbar'
+    className: styles$r['vitro-command-menu'] + CTRL.SPACE + 'navbar'
   }, React__default.createElement("ul", {
     className: 'nav'
   }, props.children));
 };
 
-var styles$r = {"vitro-command-menu-button":"_command-menu-button_vitro-command-menu-button_2IiXVbP","vitro-icon":"_command-menu-button_vitro-icon_1xB4d09"};
+var styles$s = {"vitro-command-menu-button":"_command-menu-button_vitro-command-menu-button_2IiXVbP","vitro-icon":"_command-menu-button_vitro-icon_1xB4d09"};
 
 var CommandMenuButton = function CommandMenuButton(props) {
   return React__default.createElement("li", null, React__default.createElement(Button$2, Object.assign({
-    className: styles$r['vitro-command-menu-button'] + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY),
-    imageClassName: styles$r['vitro-icon']
+    className: styles$s['vitro-command-menu-button'] + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY),
+    imageClassName: styles$s['vitro-icon']
   }, props)));
 };
 
 var itemStyles = {"vitro-item":"_command-menu-item_vitro-item_2pVhk23"};
 
-var styles$s = {"vitro-item-lookup-picker":"_command-menu-lookup-picker_vitro-item-lookup-picker_28SsSpP","vitro-command-menu-lookup-picker":"_command-menu-lookup-picker_vitro-command-menu-lookup-picker_1840wlg","vitro-content":"_command-menu-lookup-picker_vitro-content_3fNJUmC","vitro-value-list":"_command-menu-lookup-picker_vitro-value-list_3_OCO0r","ps":"_command-menu-lookup-picker_ps_2nXaPqA","ps--active-y":"_command-menu-lookup-picker_ps--active-y_1PYkoqT","vitro-selected-item":"_command-menu-lookup-picker_vitro-selected-item_2oLYUbH","vitro-item":"_command-menu-lookup-picker_vitro-item_16ocUuf","vitro-right":"_command-menu-lookup-picker_vitro-right_3sBWu8H"};
+var styles$t = {"vitro-item-lookup-picker":"_command-menu-lookup-picker_vitro-item-lookup-picker_28SsSpP","vitro-command-menu-lookup-picker":"_command-menu-lookup-picker_vitro-command-menu-lookup-picker_1840wlg","vitro-content":"_command-menu-lookup-picker_vitro-content_3fNJUmC","vitro-value-list":"_command-menu-lookup-picker_vitro-value-list_3_OCO0r","ps":"_command-menu-lookup-picker_ps_2nXaPqA","ps--active-y":"_command-menu-lookup-picker_ps--active-y_1PYkoqT","vitro-selected-item":"_command-menu-lookup-picker_vitro-selected-item_2oLYUbH","vitro-item":"_command-menu-lookup-picker_vitro-item_16ocUuf","vitro-right":"_command-menu-lookup-picker_vitro-right_3sBWu8H"};
 
 var CommandMenuLookupPicker = function CommandMenuLookupPicker(props) {
   return React__default.createElement("li", {
-    className: itemStyles['vitro-item'] + CTRL.SPACE + 'nav-item ' + styles$s['vitro-item-lookup-picker']
+    className: itemStyles['vitro-item'] + CTRL.SPACE + 'nav-item ' + styles$t['vitro-item-lookup-picker']
   }, React__default.createElement(LookupPicker, Object.assign({}, props, {
-    className: styles$s['vitro-command-menu-lookup-picker'] + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY)
+    className: styles$t['vitro-command-menu-lookup-picker'] + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY)
   })));
 };
 
@@ -63118,7 +63174,7 @@ UncontrolledDropdown.propTypes = _objectSpread$2({
   onToggle: propTypes.func
 }, Dropdown$2.propTypes);
 
-var styles$t = {"vitro-command-menu-dropdown-button":"_command-menu-dropdown-button_vitro-command-menu-dropdown-button_2ImIuc3","vitro-dropdown-button-container":"_command-menu-dropdown-button_vitro-dropdown-button-container_29qd-_O","vitro-icon":"_command-menu-dropdown-button_vitro-icon_36InzPx","vitro-button-collapse-bottom":"_command-menu-dropdown-button_vitro-button-collapse-bottom_1OS_X_a"};
+var styles$u = {"vitro-command-menu-dropdown-button":"_command-menu-dropdown-button_vitro-command-menu-dropdown-button_2ImIuc3","vitro-dropdown-button-container":"_command-menu-dropdown-button_vitro-dropdown-button-container_29qd-_O","vitro-icon":"_command-menu-dropdown-button_vitro-icon_36InzPx","vitro-button-collapse-bottom":"_command-menu-dropdown-button_vitro-button-collapse-bottom_1OS_X_a"};
 
 var CommandMenuSubItem = function CommandMenuSubItem(props) {
   var onClick = function onClick(e) {
@@ -63139,7 +63195,7 @@ var CommandMenuSubItem = function CommandMenuSubItem(props) {
   }, props.imageUrl && React__default.createElement(Icon, {
     defaultUrl: props.imageUrl,
     hoverUrl: props.imageHoverUrl,
-    className: styles$t['vitro-icon']
+    className: styles$u['vitro-icon']
   }), React__default.createElement("span", null, props.text));
 };
 
@@ -63154,15 +63210,15 @@ var CommandMenuItemHeader = function CommandMenuItemHeader(props) {
     onMouseLeave: function onMouseLeave() {
       return setIsHover(false);
     },
-    className: itemStyles['vitro-item'] + CTRL.SPACE + styles$t['vitro-command-menu-dropdown-button'] + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY),
+    className: itemStyles['vitro-item'] + CTRL.SPACE + styles$u['vitro-command-menu-dropdown-button'] + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY),
     "data-show": props.isVisibleFunction
   }, props.imageUrl && React__default.createElement(Icon, {
     isHover: isHover,
     defaultUrl: props.imageUrl,
     hoverUrl: props.imageHoverUrl,
-    className: styles$t['vitro-icon']
+    className: styles$u['vitro-icon']
   }), React__default.createElement("span", null, props.text), !props.isHideChevronDown && React__default.createElement("div", {
-    className: styles$t['vitro-button-collapse-bottom']
+    className: styles$u['vitro-button-collapse-bottom']
   }));
 };
 
@@ -63170,7 +63226,7 @@ var CommandMenuDropdownButton = function CommandMenuDropdownButton(props) {
   return React__default.createElement(UncontrolledDropdown, {
     nav: true,
     inNavbar: true,
-    className: styles$t['vitro-dropdown-button-container']
+    className: styles$u['vitro-dropdown-button-container']
   }, React__default.createElement(DropdownToggle$2, {
     nav: true,
     caret: true
@@ -63184,18 +63240,18 @@ var CommandMenuDropdownButton = function CommandMenuDropdownButton(props) {
   }), props.children));
 };
 
-var styles$u = {"vitro-icon-text":"_sidebar-item_vitro-icon-text_3ROhyLK","vitro-item-text":"_sidebar-item_vitro-item-text_1kK_aIZ","vitro-active":"_sidebar-item_vitro-active_7p5iOhY","vitro-hover":"_sidebar-item_vitro-hover_1mECzme","vitro-icon":"_sidebar-item_vitro-icon_2B88tow","vitro-item":"_sidebar-item_vitro-item_1BR_7F0"};
+var styles$v = {"vitro-icon-text":"_sidebar-item_vitro-icon-text_3ROhyLK","vitro-item-text":"_sidebar-item_vitro-item-text_1kK_aIZ","vitro-active":"_sidebar-item_vitro-active_7p5iOhY","vitro-hover":"_sidebar-item_vitro-hover_1mECzme","vitro-icon":"_sidebar-item_vitro-icon_2B88tow","vitro-item":"_sidebar-item_vitro-item_1BR_7F0"};
 
 var Item$1 = function Item(props) {
   return React__default.createElement(React__default.Fragment, null, React__default.createElement("div", null, React__default.createElement(Icon, {
     defaultUrl: props.imageUrl,
     hoverUrl: props.imageHoverUrl,
     isHover: props.isHover,
-    className: styles$u['vitro-icon']
+    className: styles$v['vitro-icon']
   }), React__default.createElement("span", {
-    className: styles$u['vitro-icon-text']
+    className: styles$v['vitro-icon-text']
   }, props.text)), React__default.createElement("span", {
-    className: styles$u['vitro-item-text']
+    className: styles$v['vitro-item-text']
   }, props.text));
 };
 
@@ -63205,7 +63261,7 @@ var TARGET;
   TARGET["SELF"] = "_self";
 })(TARGET || (TARGET = {}));
 
-var w$7 = window;
+var w$8 = window;
 var PX_UNIT$3 = 'px';
 var WIDTH_AUTO = 'auto';
 var LinkItem$1 = function LinkItem(props) {
@@ -63213,7 +63269,7 @@ var LinkItem$1 = function LinkItem(props) {
     isHover = _useState[0],
     setIsHover = _useState[1];
   var isActive = props.link === props.currentUrl || props.activeItem === props.id;
-  var className = isActive ? styles$u['vitro-active'] : isHover ? styles$u['vitro-hover'] : CTRL.EMPTY;
+  var className = isActive ? styles$v['vitro-active'] : isHover ? styles$v['vitro-hover'] : CTRL.EMPTY;
   var onClick = function onClick(e) {
     if (props.link) {
       var event = new CustomEvent(exports.EVENT.HISTORY_UPDATE, {
@@ -63234,7 +63290,7 @@ var LinkItem$1 = function LinkItem(props) {
     style: {
       width: props.linkItemWidth ? props.linkItemWidth + PX_UNIT$3 : WIDTH_AUTO
     },
-    className: styles$u['vitro-item']
+    className: styles$v['vitro-item']
   }, props.link && React__default.createElement("a", {
     onClick: onClick,
     className: className
@@ -63242,7 +63298,7 @@ var LinkItem$1 = function LinkItem(props) {
     isHover: isHover || isActive
   }))), props.onClick && React__default.createElement("a", {
     onClick: function onClick() {
-      return w$7[props.onClick || CTRL.EMPTY]();
+      return w$8[props.onClick || CTRL.EMPTY]();
     },
     className: className
   }, React__default.createElement(Item$1, Object.assign({}, props, {
@@ -63282,7 +63338,7 @@ var SectionList = React.forwardRef(function (props, ref) {
   }));
 });
 
-var styles$v = {"vitro-sidebar":"_sidebar_vitro-sidebar_1IxGYiU","vitro-scroll-container":"_sidebar_vitro-scroll-container_3K-iJy8","vitro-button-more":"_sidebar_vitro-button-more_3s9oZY9"};
+var styles$w = {"vitro-sidebar":"_sidebar_vitro-sidebar_1IxGYiU","vitro-scroll-container":"_sidebar_vitro-scroll-container_3K-iJy8","vitro-button-more":"_sidebar_vitro-button-more_3s9oZY9"};
 
 var Sidebar = function Sidebar(props) {
   var _useState = React.useState(window.location.pathname),
@@ -63357,7 +63413,7 @@ var Sidebar = function Sidebar(props) {
     var width = containerWidth / count;
     setLinkItemWidth(width);
   };
-  var className = styles$v['vitro-sidebar'] + (props.theme ? CTRL.SPACE + props.theme : CTRL.EMPTY) + CTRL.SPACE + (isMobileView ? 'vitro-bottom-menu' : CTRL.EMPTY);
+  var className = styles$w['vitro-sidebar'] + (props.theme ? CTRL.SPACE + props.theme : CTRL.EMPTY) + CTRL.SPACE + (isMobileView ? 'vitro-bottom-menu' : CTRL.EMPTY);
   return React__default.createElement("div", {
     className: className,
     id: 'vitro-sidebar'
@@ -63370,7 +63426,7 @@ var Sidebar = function Sidebar(props) {
     currentUrl: currentUrl,
     activeItem: props.activeItem
   })) : React__default.createElement(React__default.Fragment, null, React__default.createElement("div", {
-    className: styles$v['vitro-scroll-container'],
+    className: styles$w['vitro-scroll-container'],
     ref: menuRef
   }, React__default.createElement(SectionList, {
     itemList: itemList,
@@ -63380,40 +63436,40 @@ var Sidebar = function Sidebar(props) {
     linkItemWidth: linkItemWidth
   })), React__default.createElement("button", {
     onClick: scroll,
-    className: styles$v['vitro-button-more']
+    className: styles$w['vitro-button-more']
   })));
 };
 
-var styles$w = {"vitro-task-tile":"_task-tile_vitro-task-tile_35bZu48","vitro-active":"_task-tile_vitro-active_11W9nJz","vitro-content":"_task-tile_vitro-content_rl2ERCQ","vitro-description":"_task-tile_vitro-description_qtyUbLy","vitro-comment":"_task-tile_vitro-comment_2im2AJj","vitro-title":"_task-tile_vitro-title_1pXrIrB","vitro-top-right":"_task-tile_vitro-top-right_19tbPX4","vitro-dropdown-button":"_task-tile_vitro-dropdown-button_2YgEUdg","vitro-bottom-right":"_task-tile_vitro-bottom-right_2E9WAle","vitro-button-cancel":"_task-tile_vitro-button-cancel_1lgja1K"};
+var styles$x = {"vitro-task-tile":"_task-tile_vitro-task-tile_35bZu48","vitro-active":"_task-tile_vitro-active_11W9nJz","vitro-content":"_task-tile_vitro-content_rl2ERCQ","vitro-description":"_task-tile_vitro-description_qtyUbLy","vitro-comment":"_task-tile_vitro-comment_2im2AJj","vitro-title":"_task-tile_vitro-title_1pXrIrB","vitro-top-right":"_task-tile_vitro-top-right_19tbPX4","vitro-dropdown-button":"_task-tile_vitro-dropdown-button_2YgEUdg","vitro-bottom-right":"_task-tile_vitro-bottom-right_2E9WAle","vitro-button-cancel":"_task-tile_vitro-button-cancel_1lgja1K"};
 
 var TaskTile = function TaskTile(props) {
   return React__default.createElement("div", {
-    className: styles$w['vitro-task-tile'] + (props.isActive ? CTRL.SPACE + styles$w['vitro-active'] : CTRL.EMPTY),
+    className: styles$x['vitro-task-tile'] + (props.isActive ? CTRL.SPACE + styles$x['vitro-active'] : CTRL.EMPTY),
     onClick: props.onClick
   }, props.dropdownItemList && React__default.createElement("div", {
-    className: styles$w['vitro-top-right']
+    className: styles$x['vitro-top-right']
   }, React__default.createElement(DropdownButton, {
     itemList: props.dropdownItemList,
-    className: styles$w['vitro-dropdown-button']
+    className: styles$x['vitro-dropdown-button']
   })), props.isShowDeleteButton && React__default.createElement("div", {
-    className: styles$w['vitro-button-cancel'],
+    className: styles$x['vitro-button-cancel'],
     onClick: props.onDeleteClick
   }), props.description && React__default.createElement("div", {
-    className: styles$w['vitro-description']
+    className: styles$x['vitro-description']
   }, props.description), React__default.createElement("div", {
-    className: styles$w['vitro-title']
+    className: styles$x['vitro-title']
   }, props.title), props.comment && React__default.createElement("div", {
-    className: styles$w['vitro-comment']
+    className: styles$x['vitro-comment']
   }, props.comment), React__default.createElement("div", {
-    className: styles$w['vitro-content']
+    className: styles$x['vitro-content']
   }, props.userList && React__default.createElement(commonUi.TaskUserList, {
     itemList: props.userList
   })), React__default.createElement("div", {
-    className: styles$w['vitro-bottom-right']
+    className: styles$x['vitro-bottom-right']
   }, props.dateComment, " \xA0 ", props.date), props.children);
 };
 
-var styles$x = {"vitro-alert":"_alert_vitro-alert_3sPAkJb","vitro-alert-content":"_alert_vitro-alert-content_10fW1n4","vitro-button-close":"_alert_vitro-button-close_39K9cqW","vitro-icon":"_alert_vitro-icon_pK385gF","vitro-text":"_alert_vitro-text_37Erxqj","vitro-alert-action-list":"_alert_vitro-alert-action-list_2XzbaCO","vitro-position-center":"_alert_vitro-position-center_1r_lK_e"};
+var styles$y = {"vitro-alert":"_alert_vitro-alert_3sPAkJb","vitro-alert-content":"_alert_vitro-alert-content_10fW1n4","vitro-button-close":"_alert_vitro-button-close_39K9cqW","vitro-icon":"_alert_vitro-icon_pK385gF","vitro-text":"_alert_vitro-text_37Erxqj","vitro-alert-action-list":"_alert_vitro-alert-action-list_2XzbaCO","vitro-position-center":"_alert_vitro-position-center_1r_lK_e"};
 
 var Alert$1 = function Alert(props) {
   var ref = React.useRef(null);
@@ -63445,7 +63501,7 @@ var Alert$1 = function Alert(props) {
     }
   };
   var actionList = props.actionList && React__default.createElement("div", {
-    className: styles$x['vitro-alert-action-list']
+    className: styles$y['vitro-alert-action-list']
   }, props.actionList.map(function (a) {
     return React__default.createElement(Button$1, {
       key: a.text,
@@ -63454,7 +63510,7 @@ var Alert$1 = function Alert(props) {
       }
     }, a.text);
   }));
-  var className = styles$x['vitro-alert'] + CTRL.SPACE + (props.isPositionCenter && styles$x['vitro-position-center']) + CTRL.SPACE + (props.className ? props.className : CTRL.EMPTY);
+  var className = styles$y['vitro-alert'] + CTRL.SPACE + (props.isPositionCenter && styles$y['vitro-position-center']) + CTRL.SPACE + (props.className ? props.className : CTRL.EMPTY);
   return React__default.createElement("div", {
     tabIndex: 1,
     onBlur: onFocusOut,
@@ -63464,13 +63520,13 @@ var Alert$1 = function Alert(props) {
     variant: props.type,
     onClose: props.onClose
   }, React__default.createElement("div", {
-    className: styles$x['vitro-alert-content']
+    className: styles$y['vitro-alert-content']
   }, React__default.createElement("div", {
-    className: styles$x['vitro-icon']
+    className: styles$y['vitro-icon']
   }), React__default.createElement("div", {
-    className: styles$x['vitro-text']
+    className: styles$y['vitro-text']
   }, props.title && React__default.createElement("strong", null, props.title), props.text, !props.text && props.children), !props.isMultiline && actionList, props.isDismissible && React__default.createElement("div", {
-    className: styles$x['vitro-button-close'],
+    className: styles$y['vitro-button-close'],
     onClick: onClose
   })), props.text && props.children, props.isMultiline && actionList));
 };
@@ -63506,7 +63562,7 @@ var DialogHeader = function DialogHeader(props) {
 
 var dialogStyles = {"vitro-dialog":"_dialog_vitro-dialog_2NzcRZg"};
 
-var styles$y = {"vitro-dialog-button-close":"_dialog-button-close_vitro-dialog-button-close_1p27cEz","vitro-button-close":"_dialog-button-close_vitro-button-close_2BpzTR0"};
+var styles$z = {"vitro-dialog-button-close":"_dialog-button-close_vitro-dialog-button-close_1p27cEz","vitro-button-close":"_dialog-button-close_vitro-button-close_2BpzTR0"};
 
 var Dialog = function Dialog(props) {
   var className = dialogStyles['vitro-dialog'];
@@ -63527,7 +63583,7 @@ var Dialog = function Dialog(props) {
     width: props.width,
     height: props.height
   }, props.isDismissible && React__default.createElement("button", {
-    className: styles$y['vitro-dialog-button-close'],
+    className: styles$z['vitro-dialog-button-close'],
     onClick: onClose
   }), React__default.createElement(DialogHeader, {
     title: props.title
@@ -63536,19 +63592,19 @@ var Dialog = function Dialog(props) {
   }) : React__default.cloneElement(props.children, _extends({}, props))));
 };
 
-var styles$z = {"vitro-dialog-content":"_dialog-content_vitro-dialog-content_qQNWu6x"};
+var styles$A = {"vitro-dialog-content":"_dialog-content_vitro-dialog-content_qQNWu6x"};
 
 var DialogContent = function DialogContent(props) {
   return React__default.createElement("div", {
-    className: styles$z['vitro-dialog-content']
+    className: styles$A['vitro-dialog-content']
   }, props.children);
 };
 
-var styles$A = {"vitro-dialog-button":"_dialog-button_vitro-dialog-button_1fQ5l22"};
+var styles$B = {"vitro-dialog-button":"_dialog-button_vitro-dialog-button_1fQ5l22"};
 
 var DialogButton = function DialogButton(props) {
   return React__default.createElement(Button$2, Object.assign({}, props, {
-    className: styles$A['vitro-dialog-button'] + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY)
+    className: styles$B['vitro-dialog-button'] + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY)
   }));
 };
 
@@ -63568,7 +63624,7 @@ var DialogCloseButton = function DialogCloseButton(props) {
     onClick: props.onClose,
     text: props.text,
     isDisabled: props.isDisabled,
-    className: styles$y['vitro-button-close']
+    className: styles$z['vitro-button-close']
   });
 };
 
@@ -63579,14 +63635,14 @@ var LOCALE$5;
   LOCALE["ACTION_SAVE"] = "app.common.action.save";
 })(LOCALE$5 || (LOCALE$5 = {}));
 
-var styles$B = {"vitro-dialog-footer":"_dialog-footer_vitro-dialog-footer_2vUQ3aG"};
+var styles$C = {"vitro-dialog-footer":"_dialog-footer_vitro-dialog-footer_2vUQ3aG"};
 
 var DialogFooter = function DialogFooter(props) {
   var localeService = inversifyReact.useInjection(SERVICE.LOCALE);
   var labelClose = props.labelClose || localeService.create(props.onActionClick ? LOCALE$5.ACTION_CANCEL : LOCALE$5.ACTION_CLOSE);
   var labelAction = props.labelAction || localeService.create(LOCALE$5.ACTION_SAVE);
   return React__default.createElement("div", {
-    className: styles$B['vitro-dialog-footer']
+    className: styles$C['vitro-dialog-footer']
   }, props.children, props.onActionClick && React__default.createElement(DialogButton, {
     text: labelAction,
     onClick: props.onActionClick
@@ -63596,7 +63652,7 @@ var DialogFooter = function DialogFooter(props) {
   }));
 };
 
-var styles$C = {"vitro-user-profile":"_user-profile_vitro-user-profile_11XpBoQ","vitro-dropdown-item":"_user-profile_vitro-dropdown-item_dSErsta"};
+var styles$D = {"vitro-user-profile":"_user-profile_vitro-user-profile_11XpBoQ","vitro-dropdown-item":"_user-profile_vitro-dropdown-item_dSErsta"};
 
 var UserProfileMenuItem = function UserProfileMenuItem(props) {
   var onClick = function onClick() {
@@ -63607,7 +63663,7 @@ var UserProfileMenuItem = function UserProfileMenuItem(props) {
   };
   if (props.link) {
     return React__default.createElement("div", {
-      className: styles$C['vitro-dropdown-item'],
+      className: styles$D['vitro-dropdown-item'],
       onClick: onClick
     }, React__default.createElement("a", {
       href: props.link
@@ -63618,7 +63674,7 @@ var UserProfileMenuItem = function UserProfileMenuItem(props) {
   }
   if (props.onClick) {
     return React__default.createElement("div", {
-      className: styles$C['vitro-dropdown-item'],
+      className: styles$D['vitro-dropdown-item'],
       key: props.text,
       onClick: onClick
     }, props.imageUrl && React__default.createElement(Icon, {
@@ -63652,11 +63708,11 @@ var UserProfile = function UserProfile(props) {
   return React__default.createElement(Dropdown$2, {
     isOpen: dropdownOpen,
     toggle: toggle,
-    className: styles$C['vitro-user-profile']
+    className: styles$D['vitro-user-profile']
   }, React__default.createElement(DropdownToggle$2, {
     caret: true
   }, React__default.createElement("div", null, React__default.createElement("span", {
-    className: styles$C['vitro-text-color-white']
+    className: styles$D['vitro-text-color-white']
   }, createSurnameWithInitials(props.userName)), React__default.createElement(Avatar, {
     userName: props.userName,
     isBigSize: true
@@ -63676,48 +63732,48 @@ var UserLookupPicker = function UserLookupPicker(props) {
   }));
 };
 
-var styles$D = {"vitro-title":"_activity_vitro-title_1rdvvaa","vitro-dropdown-button":"_activity_vitro-dropdown-button_12258nJ","vitro-activity":"_activity_vitro-activity_1u7YeF3"};
+var styles$E = {"vitro-title":"_activity_vitro-title_1rdvvaa","vitro-dropdown-button":"_activity_vitro-dropdown-button_12258nJ","vitro-activity":"_activity_vitro-activity_1u7YeF3"};
 
 var Activity = function Activity(props) {
   return React__default.createElement("div", {
     className: 'vitro-activity'
   }, React__default.createElement("div", {
-    className: styles$D['vitro-title']
+    className: styles$E['vitro-title']
   }, props.filterDropdownList && React__default.createElement(DropdownButton, {
     itemList: props.filterDropdownList,
-    className: styles$D['vitro-dropdown-button']
+    className: styles$E['vitro-dropdown-button']
   }), React__default.createElement("h3", null, props.title)), React__default.createElement("div", {
     className: 'vitro-content'
   }, props.children));
 };
 
-var styles$E = {"vitro-item":"_activity-item_vitro-item_3Tprske","vitro-active":"_activity-item_vitro-active_2kENgvf","vitro-title":"_activity-item_vitro-title__QItISm","vitro-due-date":"_activity-item_vitro-due-date_1mBIraY","vitro-content":"_activity-item_vitro-content_3Lt7XRy","vitro-message":"_activity-item_vitro-message_1ndqhgR","vitro-flex":"_activity-item_vitro-flex_37IxBWe","vitro-dropdown-button":"_activity-item_vitro-dropdown-button_1J50ja7","vitro-avatar":"_activity-item_vitro-avatar_218ZqAk"};
+var styles$F = {"vitro-item":"_activity-item_vitro-item_3Tprske","vitro-active":"_activity-item_vitro-active_2kENgvf","vitro-title":"_activity-item_vitro-title__QItISm","vitro-due-date":"_activity-item_vitro-due-date_1mBIraY","vitro-content":"_activity-item_vitro-content_3Lt7XRy","vitro-message":"_activity-item_vitro-message_1ndqhgR","vitro-flex":"_activity-item_vitro-flex_37IxBWe","vitro-dropdown-button":"_activity-item_vitro-dropdown-button_1J50ja7","vitro-avatar":"_activity-item_vitro-avatar_218ZqAk"};
 
 var ActivityItem = function ActivityItem(props) {
   return React__default.createElement("div", {
-    className: styles$E['vitro-item'] + (props.isActive ? CTRL.SPACE + styles$E['vitro-active'] : CTRL.EMPTY)
+    className: styles$F['vitro-item'] + (props.isActive ? CTRL.SPACE + styles$F['vitro-active'] : CTRL.EMPTY)
   }, React__default.createElement("div", {
-    className: styles$E['vitro-flex']
+    className: styles$F['vitro-flex']
   }, React__default.createElement(Avatar, {
     userName: props.userName,
     image: props.userImageUrl,
-    className: styles$E['vitro-avatar']
+    className: styles$F['vitro-avatar']
   }), React__default.createElement("div", {
-    className: styles$E['vitro-content']
+    className: styles$F['vitro-content']
   }, React__default.createElement("div", null, React__default.createElement("div", {
-    className: styles$E['vitro-title']
+    className: styles$F['vitro-title']
   }, React__default.createElement("span", null, props.title || props.userName)), React__default.createElement("div", {
-    className: styles$E['vitro-message'] + (props.variant ? CTRL.SPACE + props.variant : CTRL.EMPTY)
+    className: styles$F['vitro-message'] + (props.variant ? CTRL.SPACE + props.variant : CTRL.EMPTY)
   }, React__default.createElement("p", {
     dangerouslySetInnerHTML: {
       __html: props.message
     }
   }), props.children)), props.isShowDetail && React__default.createElement("span", {
-    className: styles$E['vitro-due-date']
+    className: styles$F['vitro-due-date']
   }, props.date)), props.isShowDetail && props.dropdownItemList && React__default.createElement(DropdownButton, {
     itemList: props.dropdownItemList,
     onToggle: props.onDropdownToggle,
-    className: styles$E['vitro-dropdown-button']
+    className: styles$F['vitro-dropdown-button']
   })));
 };
 
@@ -63752,6 +63808,7 @@ exports.Login = Login;
 exports.LookupPicker = LookupPicker;
 exports.MicroFrontend = MicroFrontend;
 exports.PdfViewer = PdfViewer;
+exports.ScrollBar = ScrollBar;
 exports.Sidebar = Sidebar;
 exports.TABLE_VIEW = TableViewConstants;
 exports.TREE_VIEW = TreeViewConstants;