@vitrosoftware/common-ui-ts 1.1.177 → 1.1.179

package/dist/index.js

@@ -7,6 +7,12 @@ var jsxRuntime = require('react/jsx-runtime');
 var reactstrap = require('reactstrap');
 var ReactSplitter = _interopDefault(require('m-react-splitters'));
 
+(function (models) {
+})(exports.models || (exports.models = {}));
+
+(function (services) {
+})(exports.services || (exports.services = {}));
+
 var app = {
 	common: {
 		action: {
@@ -575,8 +581,8 @@ var ScrollBar = function ScrollBar(props) {
   EVENT["HISTORY_CHANGED"] = "vitro.history.changed";
   EVENT["DROP"] = "drop";
   EVENT["CONTEXTMENU"] = "contextmenu";
-  EVENT["COMMANDMENU_TOGGLE"] = "vitro.commandmenu.toggle";
-  EVENT["PDFVIEWER_PAN_START"] = "vitro.pdfviewer.pan.start";
+  EVENT["COMMAND_MENU_TOGGLE"] = "vitro.commandmenu.toggle";
+  EVENT["PDF_VIEWER_PAN_START"] = "vitro.pdfviewer.pan.start";
   EVENT["CHANGE"] = "change";
   EVENT["TOUCHEND"] = "touchend";
   EVENT["TOUCHMOVE"] = "touchmove";
@@ -708,7 +714,9 @@ var Breadcrumbs = function Breadcrumbs(props) {
     var lastItem = list[list.length - 1];
     if (!props.wrapRoot) {
       var root = list.shift();
-      setRootItem(root);
+      if (root) {
+        setRootItem(root);
+      }
     }
     setDisplayItemList([lastItem]);
     setDropdownItemList(list.slice(0, list.length - 1).reverse());
@@ -20594,79 +20602,11 @@ var TreeViewConstants = {
     get CASCADE () { return CASCADE; }
 };
 
-var TreeViewConfig = /*#__PURE__*/function () {
-  function TreeViewConfig() {}
-  TreeViewConfig.getConfig = function getConfig(id, checkboxSelect, saveChecked, expandNodeIdList, selectNodeId) {
-    return {
-      core: {
-        check_callback: true,
-        themes: {
-          dots: false
-        },
-        multiple: false,
-        data: function data(obj, cb) {}
-      },
-      plugins: function () {
-        var pluginList = [PLUGIN.UNIQUE, PLUGIN.TYPES, PLUGIN.WHOLEROW, PLUGIN.THEMES, PLUGIN.SORT, PLUGIN.STATE, PLUGIN.DND];
-        if (checkboxSelect) {
-          pluginList.push(PLUGIN.CHECKBOX);
-        }
-        return pluginList;
-      }(),
-      types: {
-        folder: {
-          icon: NODE_TYPE.FOLDER
-        },
-        file: {
-          icon: NODE_TYPE.FILE,
-          valid_children: [CTRL.EMPTY]
-        }
-      },
-      state: {
-        key: id,
-        filter: function filter(state) {
-          if (!saveChecked) {
-            delete state.checkbox;
-          }
-          if (expandNodeIdList) {
-            if (!state.core) {
-              state.core = {};
-            }
-            state.core.open = expandNodeIdList;
-          }
-          if (selectNodeId) {
-            if (!state.core) {
-              state.core = {};
-            }
-            state.core.selected = [selectNodeId];
-          }
-          return state;
-        }
-      },
-      checkbox: {
-        visible: true,
-        three_state: false,
-        tie_selection: false,
-        cascade: CASCADE.DOWN
-      },
-      dnd: {
-        is_draggable: function is_draggable() {
-          return false;
-        }
-      },
-      contextmenu: function contextmenu() {
-        return [];
-      }
-    };
-  };
-  return TreeViewConfig;
-}();
-
-var JsTreeViewContextImpl = /*#__PURE__*/function () {
-  function JsTreeViewContextImpl(jsTree) {
+var TreeViewServiceImpl = /*#__PURE__*/function () {
+  function TreeViewServiceImpl(jsTree) {
     this.jsTree = jsTree;
   }
-  var _proto = JsTreeViewContextImpl.prototype;
+  var _proto = TreeViewServiceImpl.prototype;
   _proto.setEventHandler = function setEventHandler(eventHandler) {
     var _this = this;
     this.jsTree.on(eventHandler.id, function () {
@@ -20774,7 +20714,75 @@ var JsTreeViewContextImpl = /*#__PURE__*/function () {
   _proto.setIcon = function setIcon(obj, icon) {
     this.jsTree.jstree(METHOD.SET_ICON, obj, icon);
   };
-  return JsTreeViewContextImpl;
+  return TreeViewServiceImpl;
+}();
+
+var TreeViewConfigServiceImpl = /*#__PURE__*/function () {
+  function TreeViewConfigServiceImpl() {}
+  TreeViewConfigServiceImpl.getConfig = function getConfig(id, checkboxSelect, saveChecked, expandNodeIdList, selectNodeId) {
+    return {
+      core: {
+        check_callback: true,
+        themes: {
+          dots: false
+        },
+        multiple: false,
+        data: function data(obj, cb) {}
+      },
+      plugins: function () {
+        var pluginList = [PLUGIN.UNIQUE, PLUGIN.TYPES, PLUGIN.WHOLEROW, PLUGIN.THEMES, PLUGIN.SORT, PLUGIN.STATE, PLUGIN.DND];
+        if (checkboxSelect) {
+          pluginList.push(PLUGIN.CHECKBOX);
+        }
+        return pluginList;
+      }(),
+      types: {
+        folder: {
+          icon: NODE_TYPE.FOLDER
+        },
+        file: {
+          icon: NODE_TYPE.FILE,
+          valid_children: [CTRL.EMPTY]
+        }
+      },
+      state: {
+        key: id,
+        filter: function filter(state) {
+          if (!saveChecked) {
+            delete state.checkbox;
+          }
+          if (expandNodeIdList) {
+            if (!state.core) {
+              state.core = {};
+            }
+            state.core.open = expandNodeIdList;
+          }
+          if (selectNodeId) {
+            if (!state.core) {
+              state.core = {};
+            }
+            state.core.selected = [selectNodeId];
+          }
+          return state;
+        }
+      },
+      checkbox: {
+        visible: true,
+        three_state: false,
+        tie_selection: false,
+        cascade: CASCADE.DOWN
+      },
+      dnd: {
+        is_draggable: function is_draggable() {
+          return false;
+        }
+      },
+      contextmenu: function contextmenu() {
+        return [];
+      }
+    };
+  };
+  return TreeViewConfigServiceImpl;
 }();
 
 var styles$3 = {"vitro-scrollbar":"_tree-view_vitro-scrollbar_1hvFNoY","vitro-tree-view":"_tree-view_vitro-tree-view_3oii-CW","vitro-arrow-right":"_tree-view_vitro-arrow-right_dVxSsID"};
@@ -20795,7 +20803,7 @@ var TreeView = function TreeView(props) {
   var jsTreeRef = React.useRef(null);
   var jsTreeView;
   React.useEffect(function () {
-    setConfig(TreeViewConfig.getConfig(props.id, props.isCheckboxSelect, props.isSaveCheckboxState, props.expandNodeIdList, props.selectNodeId));
+    setConfig(TreeViewConfigServiceImpl.getConfig(props.id, props.isCheckboxSelect, props.isSaveCheckboxState, props.expandNodeIdList, props.selectNodeId));
   }, [props.id]);
   React.useEffect(function () {
     if (jsTreeTreeView && jsTreeRef.current) {
@@ -20852,20 +20860,22 @@ var TreeView = function TreeView(props) {
   };
   var init = function init() {
     config.core.data = getData;
-    jquery(jsTreeRef.current).jstree(config);
-    var jsTree = jquery(jsTreeRef.current);
-    jsTreeView = new JsTreeViewContextImpl(jsTree);
-    setJsTreeTreeView(jsTreeView);
-    if (props.isCheckboxSelect) {
-      jquery(document).on(exports.EVENT.CONTEXTMENU, CTRL.DOT + CSS_CLASS_JSTREE_NODE, function (e) {
-        return checkNode(e, jsTreeView);
-      });
-    }
-    if (props.isSaveState === false) {
-      jsTreeView.clearState();
-    }
-    if (props.onInit) {
-      props.onInit(jsTreeView);
+    if (jsTreeRef.current) {
+      jquery(jsTreeRef.current).jstree(config);
+      var jsTree = jquery(jsTreeRef.current);
+      jsTreeView = new TreeViewServiceImpl(jsTree);
+      setJsTreeTreeView(jsTreeView);
+      if (props.isCheckboxSelect) {
+        jquery(document).on(exports.EVENT.CONTEXTMENU, CTRL.DOT + CSS_CLASS_JSTREE_NODE, function (e) {
+          return checkNode(e, jsTreeView);
+        });
+      }
+      if (props.isSaveState === false) {
+        jsTreeView.clearState();
+      }
+      if (props.onInit) {
+        props.onInit(jsTreeView);
+      }
     }
   };
   var getData = function getData(obj, cb) {
@@ -21327,6 +21337,22 @@ var EVENT$1;
   EVENT["ON_GET_TYPE"] = "OnGetType";
   EVENT["ON_BUTTON_CLICK"] = "OnButtonClick";
 })(EVENT$1 || (EVENT$1 = {}));
+var CFG_ATTRIBUTE;
+(function (CFG_ATTRIBUTE) {
+  CFG_ATTRIBUTE["SELECTING_SINGLE"] = "SelectingSingle";
+  CFG_ATTRIBUTE["STANDARD_TIP"] = "StandardTip";
+  CFG_ATTRIBUTE["CALCULATED"] = "Calculated";
+  CFG_ATTRIBUTE["GANTT"] = "Gantt";
+  CFG_ATTRIBUTE["REMOVE_COLLAPSED"] = "RemoveCollapsed";
+  CFG_ATTRIBUTE["REMOVE_CHANGED"] = "RemoveChanged";
+  CFG_ATTRIBUTE["MAIN_COL"] = "MainCol";
+  CFG_ATTRIBUTE["GROUPING"] = "Grouping";
+  CFG_ATTRIBUTE["SUPPRESS_MESSAGE"] = "SuppressMessage";
+  CFG_ATTRIBUTE["MAX_V_SCROLL"] = "MaxVScroll";
+  CFG_ATTRIBUTE["CONST_WIDTH"] = "ConstWidth";
+  CFG_ATTRIBUTE["CALCULATED_CHANGES"] = "CalculatedChanges";
+  CFG_ATTRIBUTE["CUSTOM_SCROLL"] = "CustomScroll";
+})(CFG_ATTRIBUTE || (CFG_ATTRIBUTE = {}));
 var URL;
 (function (URL) {
   URL["LAYOUT"] = "Layout";
@@ -21552,6 +21578,7 @@ var GANTT_MENU_ACTION;
 var TableViewConstants = {
     __proto__: null,
     get EVENT () { return EVENT$1; },
+    get CFG_ATTRIBUTE () { return CFG_ATTRIBUTE; },
     get URL () { return URL; },
     get CONTROLLER () { return CONTROLLER; },
     get CACHE () { return CACHE; },
@@ -21593,9 +21620,9 @@ var tableViewList = w$1.tableViewList;
 function getTableViewById(id) {
   return tableViewList.get(id);
 }
-var TreeGridTableViewContextImpl = /*#__PURE__*/function () {
-  function TreeGridTableViewContextImpl(grid) {
-    this.suggestValue = '';
+var TableViewServiceImpl = /*#__PURE__*/function () {
+  function TableViewServiceImpl(grid) {
+    this.suggestValue = CTRL.EMPTY;
     this.filterOneLevel = false;
     this.gridChangesFormat = 'JSON';
     this.searchCriterionMap = new Map();
@@ -21604,7 +21631,7 @@ var TreeGridTableViewContextImpl = /*#__PURE__*/function () {
     this.grid.Source.Upload.Format = this.gridChangesFormat;
     tableViewList.set(this.id, this);
   }
-  var _proto = TreeGridTableViewContextImpl.prototype;
+  var _proto = TableViewServiceImpl.prototype;
   _proto.setSearchCriterionList = function setSearchCriterionList(searchCriterionList, searchId) {
     if (searchCriterionList && searchCriterionList.length) {
       this.searchCriterionMap.set(searchId, [].concat(searchCriterionList));
@@ -21612,6 +21639,34 @@ var TreeGridTableViewContextImpl = /*#__PURE__*/function () {
       this.clearSearchCriterionList(searchId);
     }
   };
+  _proto.setCfgAttribute = function setCfgAttribute(attr, value) {
+    var attrList = attr.split(CTRL.DOT);
+    var obj = this.grid;
+    attrList.forEach(function (key, index) {
+      if (obj) {
+        if (index === attrList.length - 1) {
+          obj[key] = value;
+        } else {
+          obj = obj[key];
+        }
+      }
+    });
+  };
+  _proto.getCfgAttribute = function getCfgAttribute(attr) {
+    var attrList = attr.split(CTRL.DOT);
+    var obj = this.grid;
+    var val = CTRL.EMPTY;
+    attrList.forEach(function (key, index) {
+      if (obj) {
+        if (index === attrList.length - 1) {
+          val = obj[key];
+        } else {
+          obj = obj[key];
+        }
+      }
+    });
+    return val;
+  };
   _proto.clearSearchCriterionList = function clearSearchCriterionList(searchId) {
     if (this.searchCriterionMap.has(searchId)) {
       this.searchCriterionMap["delete"](searchId);
@@ -21899,7 +21954,7 @@ var TreeGridTableViewContextImpl = /*#__PURE__*/function () {
     return this.grid.ExpandAll(parent, loaded, levels, max, test, render);
   };
   _proto.correctAllDependencies = function correctAllDependencies() {
-    return this.grid.CorrectAllDependencies();
+    return this.grid.ActionCorrectAllDependencies();
   };
   _proto.scrollToDate = function scrollToDate(date, align) {
     this.grid.ScrollToDate(date, align);
@@ -21943,10 +21998,16 @@ var TreeGridTableViewContextImpl = /*#__PURE__*/function () {
   _proto.removeCol = function removeCol(col) {
     this.grid.RemoveCol(col);
   };
+  _proto.changeColsPositions = function changeColsPositions(leftCols, cols, rightCols) {
+    this.grid.ChangeColsPositions(leftCols, cols, rightCols);
+  };
   _proto.changeDef = function changeDef(row, def, show, undo) {
     this.grid.ChangeDef(row, def, show, undo);
   };
-  _createClass(TreeGridTableViewContextImpl, [{
+  _proto.expand = function expand(row) {
+    this.grid.Expand(row);
+  };
+  _createClass(TableViewServiceImpl, [{
     key: "columnList",
     get: function get() {
       return this.grid.Cols;
@@ -22013,13 +22074,21 @@ var TreeGridTableViewContextImpl = /*#__PURE__*/function () {
   }, {
     key: "header",
     get: function get() {
-      return this.grid.Rows.Header;
+      return this.grid.Header;
     }
   }, {
     key: "mainTag",
     get: function get() {
       return this.grid.MainTag;
     }
+  }, {
+    key: "mainCol",
+    get: function get() {
+      return this.grid.MainCol;
+    },
+    set: function set(val) {
+      this.grid.MainCol = val;
+    }
   }, {
     key: "event",
     get: function get() {
@@ -22038,8 +22107,21 @@ var TreeGridTableViewContextImpl = /*#__PURE__*/function () {
     get: function get() {
       return this.grid.Rows.Group1;
     }
+  }, {
+    key: "group",
+    get: function get() {
+      return this.grid.Group;
+    },
+    set: function set(val) {
+      this.grid.Group = val;
+    }
+  }, {
+    key: "def",
+    get: function get() {
+      return this.grid.Def;
+    }
   }]);
-  return TreeGridTableViewContextImpl;
+  return TableViewServiceImpl;
 }();
 
 var styles$5 = {"vitro-table-view":"_table-view_vitro-table-view_1tTs32D"};
@@ -22123,7 +22205,7 @@ var TreeGrid = function TreeGrid(props) {
     if (props.layout || props.data) {
       g.Paging = 0;
     }
-    var grid = new TreeGridTableViewContextImpl(g);
+    var grid = new TableViewServiceImpl(g);
     if (props.filterOneLevel) {
       grid.filterOneLevel = props.filterOneLevel;
     }
@@ -22156,7 +22238,7 @@ var TreeGrid = function TreeGrid(props) {
   };
   var createGridUrl = function createGridUrl(dataKey) {
     if (props.layout || props.data) {
-      return null;
+      return CTRL.EMPTY;
     }
     if (props.createGridUrl) {
       return props.createGridUrl(dataKey);
@@ -22243,14 +22325,14 @@ var TableView = function TableView(props) {
   }, React__default.createElement(TreeGrid, Object.assign({}, props)));
 };
 
-var MicroFrontendState = /*#__PURE__*/function () {
-  function MicroFrontendState() {
+var MicroFrontendServiceImpl = /*#__PURE__*/function () {
+  function MicroFrontendServiceImpl() {
     this.unmountAction = null;
     this.name = null;
     this.renderInProgress = false;
     this.init = false;
   }
-  var _proto = MicroFrontendState.prototype;
+  var _proto = MicroFrontendServiceImpl.prototype;
   _proto.unmount = function unmount() {
     if (this.unmountAction != null) {
       this.unmountAction();
@@ -22259,35 +22341,35 @@ var MicroFrontendState = /*#__PURE__*/function () {
     this.unmountAction = null;
     this.init = false;
   };
-  return MicroFrontendState;
-}();
-
-var renderMicrofrontend = function renderMicrofrontend(rendererName, microFrontendState, rootElement, data, isReloadOnChange, tryCnt) {
-  if (!window[rendererName]) {
-    if (tryCnt < 10) {
-      setTimeout(function () {
-        renderMicrofrontend(rendererName, microFrontendState, rootElement, data, isReloadOnChange, tryCnt++);
-      }, 100);
-    }
-    console.log(rendererName + " load error. tryCnt: " + tryCnt);
-  } else {
-    if (isReloadOnChange !== false && microFrontendState.unmountAction) {
-      microFrontendState.unmountAction();
+  _proto.render = function render(rendererName, rootElement, data, isReloadOnChange, tryCnt) {
+    var _this = this;
+    if (!window[rendererName]) {
+      if (tryCnt < 10) {
+        setTimeout(function () {
+          _this.render(rendererName, rootElement, data, isReloadOnChange, tryCnt++);
+        }, 100);
+      }
+      console.log(rendererName + " load error. tryCnt: " + tryCnt);
+    } else {
+      if (isReloadOnChange !== false && this.unmountAction) {
+        this.unmountAction();
+      }
+      this.unmountAction = window[rendererName](rootElement, data);
     }
-    microFrontendState.unmountAction = window[rendererName](rootElement, data);
-  }
-};
+  };
+  return MicroFrontendServiceImpl;
+}();
 
 var MicroFrontend = React.forwardRef(function (props, ref) {
   var rootRef = ref || React.useRef(null);
   var containerId = props.data && props.data.containerId ? props.data.containerId : props.name;
   var microFrontendState = React.useMemo(function () {
-    return new MicroFrontendState();
+    return new MicroFrontendServiceImpl();
   }, []);
   var renderMicroFrontend = function renderMicroFrontend() {
     if (rootRef != null && rootRef.current != null) {
       var rendererName = "render" + props.name;
-      renderMicrofrontend(rendererName, microFrontendState, rootRef.current, props.data, props.isReloadOnChange, 0);
+      microFrontendState.render(rendererName, rootRef.current, props.data, props.isReloadOnChange, 0);
     }
     microFrontendState.renderInProgress = false;
   };
@@ -22367,8 +22449,8 @@ var LOCALE;
 var $$1 = window.$;
 var KENDO_UPLOAD = 'kendoUpload';
 var AUTHORIZATION_TOKEN_HEADER = 'AuthorizationToken';
-var TelerikUploaderContextImpl = /*#__PURE__*/function () {
-  function TelerikUploaderContextImpl(uploader, container, dropZone, progressBar, settings, localeService, toggleButtons) {
+var TelerikUploaderServiceImpl = /*#__PURE__*/function () {
+  function TelerikUploaderServiceImpl(uploader, container, dropZone, progressBar, settings, localeService, toggleButtons) {
     this.token = CTRL.EMPTY;
     this.successCount = 0;
     this.errorCount = 0;
@@ -22435,7 +22517,7 @@ var TelerikUploaderContextImpl = /*#__PURE__*/function () {
     this.initOnDrop();
     this.uploader.kendoUpload(telerikConfig);
   }
-  var _proto = TelerikUploaderContextImpl.prototype;
+  var _proto = TelerikUploaderServiceImpl.prototype;
   _proto.clearAllFiles = function clearAllFiles() {
     $$1("" + CTRL.SHARP + this.id).data(KENDO_UPLOAD).clearAllFiles();
     this.resetUploader();
@@ -22714,7 +22796,7 @@ var TelerikUploaderContextImpl = /*#__PURE__*/function () {
       };
     }
   };
-  return TelerikUploaderContextImpl;
+  return TelerikUploaderServiceImpl;
 }();
 
 var styles$6 = {"vitro-progress-bar":"_progress-bar_vitro-progress-bar_u2VLQeW","vitro-bar":"_progress-bar_vitro-bar_7V1N3eH","progressBar":"_progress-bar_progressBar_2l9PJjC"};
@@ -22829,7 +22911,7 @@ var TelerikUploader = function TelerikUploader(props) {
       var dropZone = dropZoneRef.current ? $$2(dropZoneRef.current) : null;
       var container = $$2(containerRef.current);
       var progressBar = progressBarRef.current;
-      var _kendoUploader = new TelerikUploaderContextImpl(input, container, dropZone, progressBar, props.settings, localeService, toggleButtons);
+      var _kendoUploader = new TelerikUploaderServiceImpl(input, container, dropZone, progressBar, props.settings, localeService, toggleButtons);
       setKendoUploader(_kendoUploader);
       if (props.onInit) {
         props.onInit(_kendoUploader);
@@ -22941,11 +23023,11 @@ var ComponentLoader = function ComponentLoader(props) {
   }, componentList));
 };
 
-var ComponentLoaderContextImpl = /*#__PURE__*/function () {
-  function ComponentLoaderContextImpl() {
+var ComponentLoaderServiceImpl = /*#__PURE__*/function () {
+  function ComponentLoaderServiceImpl() {
     this.componentList = [];
   }
-  var _proto = ComponentLoaderContextImpl.prototype;
+  var _proto = ComponentLoaderServiceImpl.prototype;
   _proto.setReactComponent = function setReactComponent(createComponent, setComponentList) {
     this.createComponent = createComponent;
     this.setComponentList = setComponentList;
@@ -22964,7 +23046,7 @@ var ComponentLoaderContextImpl = /*#__PURE__*/function () {
       this.setComponentList(this.componentList);
     }
   };
-  return ComponentLoaderContextImpl;
+  return ComponentLoaderServiceImpl;
 }();
 
 var PLACEMENT;
@@ -23251,7 +23333,7 @@ function ownerWindow(node) {
  * @param psuedoElement the style property
  */
 
-function getComputedStyle(node, psuedoElement) {
+function getComputedStyle$1(node, psuedoElement) {
   return ownerWindow(node).getComputedStyle(node, psuedoElement);
 }
 
@@ -23280,7 +23362,7 @@ function style(node, property) {
   var transforms = '';
 
   if (typeof property === 'string') {
-    return node.style.getPropertyValue(hyphenateStyleName(property)) || getComputedStyle(node).getPropertyValue(hyphenateStyleName(property));
+    return node.style.getPropertyValue(hyphenateStyleName(property)) || getComputedStyle$1(node).getPropertyValue(hyphenateStyleName(property));
   }
 
   Object.keys(property).forEach(function (key) {
@@ -56991,7 +57073,7 @@ function getNodeName(element) {
   return element ? (element.nodeName || '').toLowerCase() : null;
 }
 
-function getComputedStyle$1(element) {
+function getComputedStyle$2(element) {
   return getWindow(element).getComputedStyle(element);
 }
 
@@ -57024,7 +57106,7 @@ function getParentNode(element) {
 
 function getTrueOffsetParent(element) {
   if (!isHTMLElement(element) || // https://github.com/popperjs/popper-core/issues/837
-  getComputedStyle$1(element).position === 'fixed') {
+  getComputedStyle$2(element).position === 'fixed') {
     return null;
   }
 
@@ -57039,7 +57121,7 @@ function getContainingBlock(element) {
 
   if (isIE && isHTMLElement(element)) {
     // In IE 9, 10 and 11 fixed elements containing block is always established by the viewport
-    var elementCss = getComputedStyle$1(element);
+    var elementCss = getComputedStyle$2(element);
 
     if (elementCss.position === 'fixed') {
       return null;
@@ -57053,7 +57135,7 @@ function getContainingBlock(element) {
   }
 
   while (isHTMLElement(currentNode) && ['html', 'body'].indexOf(getNodeName(currentNode)) < 0) {
-    var css = getComputedStyle$1(currentNode); // This is non-exhaustive but covers the most common CSS properties that
+    var css = getComputedStyle$2(currentNode); // This is non-exhaustive but covers the most common CSS properties that
     // create a containing block.
     // https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block
 
@@ -57073,11 +57155,11 @@ function getOffsetParent(element) {
   var window = getWindow(element);
   var offsetParent = getTrueOffsetParent(element);
 
-  while (offsetParent && isTableElement(offsetParent) && getComputedStyle$1(offsetParent).position === 'static') {
+  while (offsetParent && isTableElement(offsetParent) && getComputedStyle$2(offsetParent).position === 'static') {
     offsetParent = getTrueOffsetParent(offsetParent);
   }
 
-  if (offsetParent && (getNodeName(offsetParent) === 'html' || getNodeName(offsetParent) === 'body' && getComputedStyle$1(offsetParent).position === 'static')) {
+  if (offsetParent && (getNodeName(offsetParent) === 'html' || getNodeName(offsetParent) === 'body' && getComputedStyle$2(offsetParent).position === 'static')) {
     return window;
   }
 
@@ -57262,7 +57344,7 @@ function mapToStyles(_ref2) {
     if (offsetParent === getWindow(popper)) {
       offsetParent = getDocumentElement(popper);
 
-      if (getComputedStyle$1(offsetParent).position !== 'static' && position === 'absolute') {
+      if (getComputedStyle$2(offsetParent).position !== 'static' && position === 'absolute') {
         heightProp = 'scrollHeight';
         widthProp = 'scrollWidth';
       }
@@ -57494,7 +57576,7 @@ function getDocumentRect(element) {
   var x = -winScroll.scrollLeft + getWindowScrollBarX(element);
   var y = -winScroll.scrollTop;
 
-  if (getComputedStyle$1(body || html).direction === 'rtl') {
+  if (getComputedStyle$2(body || html).direction === 'rtl') {
     x += max(html.clientWidth, body ? body.clientWidth : 0) - width;
   }
 
@@ -57508,7 +57590,7 @@ function getDocumentRect(element) {
 
 function isScrollParent(element) {
   // Firefox wants us to check `-x` and `-y` variations as well
-  var _getComputedStyle = getComputedStyle$1(element),
+  var _getComputedStyle = getComputedStyle$2(element),
       overflow = _getComputedStyle.overflow,
       overflowX = _getComputedStyle.overflowX,
       overflowY = _getComputedStyle.overflowY;
@@ -57583,7 +57665,7 @@ function getClientRectFromMixedType(element, clippingParent, strategy) {
 
 function getClippingParents(element) {
   var clippingParents = listScrollParents(getParentNode(element));
-  var canEscapeClipping = ['absolute', 'fixed'].indexOf(getComputedStyle$1(element).position) >= 0;
+  var canEscapeClipping = ['absolute', 'fixed'].indexOf(getComputedStyle$2(element).position) >= 0;
   var clipperElement = canEscapeClipping && isHTMLElement(element) ? getOffsetParent(element) : element;
 
   if (!isElement$1(clipperElement)) {
@@ -60823,14 +60905,14 @@ var Tooltip$1 = function Tooltip(props) {
 var Image = function Image(props) {
   return React__default.createElement(React__default.Fragment, null, React__default.createElement("img", {
     src: props.defaultUrl,
-    alt: props.caption,
+    alt: props.alt || CTRL.EMPTY,
     className: (props.className || 'vitro-image') + (!props.hoverUrl || !props.isHover ? CTRL.EMPTY : CTRL.SPACE + 'vitro-display-none') + (props.hoverUrl ? CTRL.SPACE + 'vitro-image-default' : CTRL.EMPTY),
     onClick: function onClick() {
       return props.onClick && props.onClick();
     }
   }), props.hoverUrl && React__default.createElement("img", {
     src: props.hoverUrl,
-    alt: props.caption,
+    alt: props.alt || CTRL.EMPTY,
     className: (props.className || 'vitro-image') + CTRL.SPACE + 'vitro-image-hover' + (props.isHover ? CTRL.EMPTY : CTRL.SPACE + 'vitro-display-none'),
     onClick: function onClick() {
       return props.onClick && props.onClick();
@@ -60903,7 +60985,7 @@ var DialogHeader = function DialogHeader(props) {
   }, props.imageUrl && React__default.createElement(Image, {
     defaultUrl: props.imageUrl,
     className: styles$f['vitro-image']
-  }), props.image, React__default.createElement("div", null, React__default.createElement(Heading, {
+  }), props.image, React__default.createElement("div", null, props.title && React__default.createElement(Heading, {
     tag: TAG.H1,
     text: props.title
   }), props.subtitle && React__default.createElement(Heading, {
@@ -62328,6 +62410,118 @@ var Label = React.forwardRef(function (props, ref) {
   }, CTRL.ASTERISK));
 });
 
+var CSS_PROPERTY = function CSS_PROPERTY() {};
+CSS_PROPERTY.FONT_WEIGHT = 'font-weight';
+CSS_PROPERTY.FONT_SIZE = 'font-size';
+CSS_PROPERTY.FONT_FAMILY = 'font-family';
+
+var ValueTooltip = React.forwardRef(function (props, ref) {
+  var _useState = React.useState(false),
+    isShow = _useState[0],
+    _setIsShow = _useState[1];
+  var _useState2 = React.useState(props.text),
+    text = _useState2[0],
+    _setText = _useState2[1];
+  var canvasRef = React.useRef();
+  var containerRef = React.useRef();
+  var resizeObserver = React__default.useMemo(function () {
+    return new window.ResizeObserver(function (entries) {
+      for (var _iterator = _createForOfIteratorHelperLoose(entries), _step; !(_step = _iterator()).done;) {
+        var entry = _step.value;
+        _setIsShow(isValueOverflow(text, entry.target));
+      }
+    });
+  }, [text]);
+  React.useEffect(function () {
+    if (props.containerRef && props.containerRef.current) {
+      containerRef.current = props.containerRef.current;
+      resizeObserver.observe(containerRef.current);
+    }
+  }, [props.containerRef, resizeObserver]);
+  React.useEffect(function () {
+    return function () {
+      resizeObserver.disconnect();
+    };
+  }, []);
+  React.useEffect(function () {
+    _setText(props.text);
+    if (containerRef.current) {
+      _setIsShow(isValueOverflow(props.text, containerRef.current));
+    } else {
+      _setIsShow(true);
+    }
+  }, [props.text]);
+  React.useImperativeHandle(ref, function () {
+    return {
+      update: function update() {
+        if (containerRef.current) {
+          _setIsShow(isValueOverflow(text, containerRef.current));
+        }
+      },
+      setIsShow: function setIsShow(value) {
+        if (value === false) {
+          _setIsShow(false);
+        } else {
+          if (containerRef.current) {
+            _setIsShow(isValueOverflow(text, containerRef.current));
+          } else {
+            _setIsShow(true);
+          }
+        }
+      },
+      setText: function setText(value) {
+        _setText(value);
+      }
+    };
+  });
+  var isValueOverflow = function isValueOverflow(value, container) {
+    var textWidth = getTextWidth(value, getCanvasFont(container), container.scrollWidth);
+    if (container && textWidth > getAvailableWidth(container)) {
+      return true;
+    } else {
+      return false;
+    }
+  };
+  var getTextWidth = function getTextWidth(text, font, scrollWidth) {
+    if (!canvasRef.current) {
+      canvasRef.current = document.createElement('canvas');
+    }
+    var canvas = canvasRef.current;
+    var context = canvas.getContext('2d');
+    if (context) {
+      context.font = font;
+      var metrics = context.measureText(text);
+      return metrics.width;
+    }
+    return scrollWidth;
+  };
+  var getAvailableWidth = function getAvailableWidth(element) {
+    var style = getComputedStyle(element);
+    var paddingX = getNumber(style.paddingLeft) + getNumber(style.paddingRight);
+    var borderX = getNumber(style.borderLeftWidth) + getNumber(style.borderRightWidth);
+    return element.offsetWidth - paddingX - borderX;
+  };
+  var getNumber = function getNumber(value) {
+    return parseFloat(value) || 0;
+  };
+  var getCssStyle = function getCssStyle(element, prop) {
+    return window.getComputedStyle(element, null).getPropertyValue(prop);
+  };
+  var getCanvasFont = function getCanvasFont(el) {
+    if (el === void 0) {
+      el = document.body;
+    }
+    var fontWeight = getCssStyle(el, CSS_PROPERTY.FONT_WEIGHT);
+    var fontSize = getCssStyle(el, CSS_PROPERTY.FONT_SIZE);
+    var fontFamily = getCssStyle(el, CSS_PROPERTY.FONT_FAMILY);
+    return fontWeight + " " + fontSize + " " + fontFamily;
+  };
+  return React__default.createElement(Tooltip$1, Object.assign({}, props, {
+    text: text,
+    isShow: isShow ? undefined : false
+  }), props.children);
+});
+
 var styles$w = {"vitro-error-message":"_error-message_vitro-error-message_2lHJjgO"};
 
 var ErrorMessage = function ErrorMessage(props) {
@@ -62457,8 +62651,8 @@ var TOOLBAR_GRP_MARGIN = 15;
 var EVENT_KEY_ENTER = 'Enter';
 var TYPE_STRING = 'string';
 var SVG = 'svg';
-var QuillRichEditorContextImpl = /*#__PURE__*/function () {
-  function QuillRichEditorContextImpl(textarea, settings) {
+var QuillRichEditorServiceImpl = /*#__PURE__*/function () {
+  function QuillRichEditorServiceImpl(textarea, settings) {
     var _this2 = this;
     this.textarea = textarea;
     this.name = textarea.name;
@@ -62493,7 +62687,7 @@ var QuillRichEditorContextImpl = /*#__PURE__*/function () {
     this.fixPickerPosition();
     this.initAdaptiveMenu();
   }
-  var _proto = QuillRichEditorContextImpl.prototype;
+  var _proto = QuillRichEditorServiceImpl.prototype;
   _proto.initAdaptiveMenu = function initAdaptiveMenu() {
     this.initBtnMore();
     this.bindToolbarResizeHandler();
@@ -62794,7 +62988,7 @@ var QuillRichEditorContextImpl = /*#__PURE__*/function () {
   _proto.clearHistory = function clearHistory() {
     this.editor.history.clear();
   };
-  return QuillRichEditorContextImpl;
+  return QuillRichEditorServiceImpl;
 }();
 
 var ROWS_DEFAULT = 3;
@@ -62806,7 +63000,7 @@ var Textarea = React.forwardRef(function (props, ref) {
     if (props.isRichText && ref) {
       var textarea = ref.current;
       var settings = getSettings();
-      var _editor = new QuillRichEditorContextImpl(textarea, settings);
+      var _editor = new QuillRichEditorServiceImpl(textarea, settings);
       setEditor(_editor);
       _editor.setText(props.inputValue ? props.inputValue : CTRL.EMPTY);
       ref.current.onchange = function (e) {
@@ -62926,18 +63120,11 @@ var Input = React.forwardRef(function (props, ref) {
   var _useState3 = React.useState(CTRL.EMPTY),
     state = _useState3[0],
     setState = _useState3[1];
-  var _useState4 = React.useState(false),
-    isShowTooltip = _useState4[0],
-    setIsShowTooltip = _useState4[1];
   var inputRef = React.useRef(null);
+  var valueTooltipRef = React.useRef(null);
   React.useEffect(function () {
     var value = props.value ? getValue(props.value) : CTRL.EMPTY;
     setInputValue(value);
-    if (isValueOverflow()) {
-      setIsShowTooltip(true);
-    } else {
-      setIsShowTooltip(false);
-    }
   }, [props.value]);
   React.useEffect(function () {
     setState(props.errorMessage || props.isError ? styles$y['vitro-error'] : CTRL.EMPTY);
@@ -62989,19 +63176,19 @@ var Input = React.forwardRef(function (props, ref) {
     setState(props.errorMessage || props.isError ? styles$y['vitro-error'] : CTRL.EMPTY);
   };
   var onBlur = function onBlur(e) {
+    var _valueTooltipRef$curr, _valueTooltipRef$curr2;
     setStateOnBlur();
-    if (isValueOverflow()) {
-      setIsShowTooltip(true);
-    }
+    (_valueTooltipRef$curr = valueTooltipRef.current) === null || _valueTooltipRef$curr === void 0 ? void 0 : _valueTooltipRef$curr.setText(inputValue);
+    (_valueTooltipRef$curr2 = valueTooltipRef.current) === null || _valueTooltipRef$curr2 === void 0 ? void 0 : _valueTooltipRef$curr2.setIsShow(true);
     if (props.onBlur) {
       props.onBlur(e);
     }
   };
   var onFocus = function onFocus(e) {
-    var _inputRef$current;
+    var _valueTooltipRef$curr3, _inputRef$current;
+    (_valueTooltipRef$curr3 = valueTooltipRef.current) === null || _valueTooltipRef$curr3 === void 0 ? void 0 : _valueTooltipRef$curr3.setIsShow(false);
     setState(styles$y['vitro-focus']);
     (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.focus();
-    setIsShowTooltip(false);
     if (props.onFocus) {
       props.onFocus(e);
     }
@@ -63026,13 +63213,6 @@ var Input = React.forwardRef(function (props, ref) {
     }
     window.removeEventListener(exports.EVENT.MOUSEUP, remainHeight);
   };
-  var isValueOverflow = function isValueOverflow() {
-    if (inputRef.current && inputRef.current.scrollWidth > inputRef.current.clientWidth) {
-      return true;
-    } else {
-      return false;
-    }
-  };
   var getMaxLength = function getMaxLength() {
     if (props.maxLength && props.maxLength < MAX_LENGTH.SINGLELINE) {
       return props.maxLength;
@@ -63107,11 +63287,12 @@ var Input = React.forwardRef(function (props, ref) {
     classList.push(state);
     return classList.join(CTRL.SPACE);
   };
-  return React__default.createElement(Tooltip$1, {
-    text: props.isMultiline || isShowTooltip === false ? CTRL.EMPTY : inputValue,
+  return React__default.createElement(ValueTooltip, {
+    containerRef: inputRef,
+    text: props.isMultiline || !props.value ? CTRL.EMPTY : props.value,
     placement: PLACEMENT.BOTTOM,
-    isShow: isShowTooltip === false ? false : undefined,
-    className: styles$y['vitro-tooltip']
+    className: styles$y['vitro-tooltip'],
+    ref: valueTooltipRef
   }, React__default.createElement("div", {
     className: getClassName()
   }, props.label && React__default.createElement(Label, {
@@ -63273,16 +63454,22 @@ var IssueTile = function IssueTile(props) {
         isAfterBlurRef.current = true;
       }
     }
-    if (inputRef && (_inputRef$current2 = inputRef.current) !== null && _inputRef$current2 !== void 0 && _inputRef$current2.getValue()) {
+    if (inputRef && (_inputRef$current2 = inputRef.current) !== null && _inputRef$current2 !== void 0 && _inputRef$current2.getValue() && props.onBlur) {
       props.onBlur(e);
     }
   };
   var setInputNameError = function setInputNameError() {
-    setErrorMsg(props.createLocale(LOCALE$3.ERROR_EMPTY));
+    setErrorMsg(getLocalizedText(LOCALE$3.ERROR_EMPTY));
   };
   var clearInputNameError = function clearInputNameError() {
     setErrorMsg(CTRL.EMPTY);
   };
+  var getLocalizedText = function getLocalizedText(value) {
+    if (props.createLocale) {
+      props.createLocale(value);
+    }
+    return value;
+  };
   return React__default.createElement("div", {
     id: 'vitro-issue-tile-' + props.id,
     className: styles$C['vitro-issue-tile'] + (props.isActive ? CTRL.SPACE + 'vitro-active' : CTRL.EMPTY),
@@ -63299,7 +63486,7 @@ var IssueTile = function IssueTile(props) {
   }), React__default.createElement("div", {
     className: 'vitro-block'
   }, React__default.createElement("div", null, React__default.createElement(Input, {
-    label: props.createLocale(LOCALE$3.INPUT_NAME_LABEL),
+    label: getLocalizedText(LOCALE$3.INPUT_NAME_LABEL),
     onBlur: _onBlurInputName,
     className: styles$C['vitro-control'],
     value: nameVal,
@@ -63309,7 +63496,7 @@ var IssueTile = function IssueTile(props) {
     errorMessage: errMsg
   }))), React__default.createElement(Input, {
     isMultiline: true,
-    label: props.createLocale(LOCALE$3.TEXTAREA_LABEL),
+    label: getLocalizedText(LOCALE$3.TEXTAREA_LABEL),
     onBlur: props.onBlur,
     className: styles$C['vitro-control'],
     value: props.text,
@@ -63373,10 +63560,10 @@ var FileVersionSelect = function FileVersionSelect(props) {
   var versionWidthRef = React.useRef(0);
   React.useEffect(function () {
     window.addEventListener(exports.EVENT.MOUSEDOWN, onBlur);
-    window.addEventListener(exports.EVENT.PDFVIEWER_PAN_START, onPanStart);
+    window.addEventListener(exports.EVENT.PDF_VIEWER_PAN_START, onPanStart);
     return function () {
       window.removeEventListener(exports.EVENT.MOUSEDOWN, onBlur);
-      window.removeEventListener(exports.EVENT.PDFVIEWER_PAN_START, onPanStart);
+      window.removeEventListener(exports.EVENT.PDF_VIEWER_PAN_START, onPanStart);
     };
   }, []);
   React.useEffect(function () {
@@ -63545,13 +63732,14 @@ var Viewer = function Viewer(props) {
 };
 
 var name = "@vitrosoftware/common-ui-ts";
-var version$1 = "1.1.177";
+var version$1 = "1.1.179";
 var description = "vitro software common ui ts";
 var author = "";
 var license = "MIT";
 var repository = "/common-ui-ts";
 var main$1 = "dist/index.js";
 var source = "src/index.tsx";
+var types = "dist/src/index.d.ts";
 var engines = {
 	node: ">=10"
 };
@@ -63634,6 +63822,7 @@ var Package = {
 	repository: repository,
 	main: main$1,
 	source: source,
+	types: types,
 	engines: engines,
 	scripts: scripts,
 	peerDependencies: peerDependencies,
@@ -64254,7 +64443,7 @@ var NumberInputConstants = {
 
 var PRECISION = 'precision';
 var NumberInput = React.forwardRef(function (props, ref) {
-  var _useState = React.useState(null),
+  var _useState = React.useState(CTRL.EMPTY),
     inputValue = _useState[0],
     setInputValue = _useState[1];
   var inputRef = React.useRef();
@@ -64741,12 +64930,26 @@ var htmlValueStyles = {"vitro-item-html-value":"_lookup-picker-html-value_vitro-
 var SelectedValueListItem = function SelectedValueListItem(props) {
   var className = props.isMultiSelect ? styles$R['vitro-selected-item-multi'] : styles$R['vitro-selected-item'];
   var title = props.selectedValueTemplate(props.item);
-  return React__default.createElement(Tooltip$1, {
+  var ref = React.useRef(null);
+  var valueTooltipRef = React.useRef(null);
+  React.useEffect(function () {
+    if (valueTooltipRef.current && !props.isMultiSelect) {
+      if (props.isValueListVisible) {
+        valueTooltipRef.current.setIsShow(false);
+      } else {
+        valueTooltipRef.current.setIsShow(true);
+      }
+    }
+  }, [props.isValueListVisible]);
+  return React__default.createElement(ValueTooltip, {
+    ref: valueTooltipRef,
+    containerRef: ref,
     text: title,
     placement: PLACEMENT.BOTTOM,
     className: styles$S['vitro-tooltip'],
     isFlip: true
   }, React__default.createElement("div", {
+    ref: ref,
     className: className
   }, props.getHtmlValue && props.getHtmlValue(props.item) ? React__default.createElement(FlexBox, {
     className: htmlValueStyles['vitro-item-html-value']
@@ -64765,6 +64968,7 @@ var SelectedValueList = function SelectedValueList(props) {
       item: x,
       isMultiSelect: props.isMultiSelect,
       isReadOnly: props.isReadOnly,
+      isValueListVisible: props.isValueListVisible,
       selectedValueTemplate: props.selectedValueTemplate,
       onOptionValueDelete: props.onOptionValueDelete,
       getHtmlValue: props.getHtmlValue
@@ -64902,7 +65106,9 @@ var LookupPicker = React.forwardRef(function (props, ref) {
   var _useState5 = React.useState(createDefaultSelectedValueList),
     selectedValueList = _useState5[0],
     setSelectedValueList = _useState5[1];
-  var _useState6 = React.useState(null),
+  var _useState6 = React.useState({
+      cancel: false
+    }),
     valueListRequestToken = _useState6[0],
     setValueListRequestToken = _useState6[1];
   var _useState7 = React.useState(props.isDisabled || props.isReadOnly ? styles$S['vitro-read-only'] : CTRL.EMPTY),
@@ -65186,6 +65392,7 @@ var LookupPicker = React.forwardRef(function (props, ref) {
     selectedValueTemplate: selectedValueTemplate,
     isMultiSelect: props.isMultiSelect,
     isReadOnly: props.isReadOnly,
+    isValueListVisible: valueListVisible,
     getHtmlValue: getHtmlValue
   }) : !valueListVisible && React__default.createElement(React__default.Fragment, null, props.placeholder), isEditable && React__default.createElement("input", {
     ref: inputRef,
@@ -65354,7 +65561,7 @@ var CommandMenuDropdownButton = function CommandMenuDropdownButton(props) {
     if (props.onClick) {
       props.onClick(e);
     } else {
-      var event = new CustomEvent(exports.EVENT.COMMANDMENU_TOGGLE, {
+      var event = new CustomEvent(exports.EVENT.COMMAND_MENU_TOGGLE, {
         detail: {
           isToggle: true
         }
@@ -66248,7 +66455,7 @@ var styles$13 = {"vitro-avatar":"_user-lookup-picker_vitro-avatar_2vI-SeH"};
 var UserLookupPicker = React.forwardRef(function (props, ref) {
   var lookupPickerRef = React.useRef(null);
   var getHtmlValueTemplateProps = function getHtmlValueTemplateProps(item) {
-    var prop = props.getHtmlValueTemplateProps(item);
+    var prop = props.getHtmlValueTemplateProps ? props.getHtmlValueTemplateProps(item) : item;
     if (props.isMultiSelect) {
       return _extends({}, prop, {
         className: styles$13['vitro-avatar']
@@ -66999,8 +67206,8 @@ var Criterion = function Criterion(props) {
         setOperator(_operator);
         value.operator = _operator.type;
       }
-      value.valueList = componentProps.value ? componentProps.value.valueList : [];
     }
+    value.valueList = componentProps.value ? componentProps.value.valueList : [];
   }, [props.content]);
   var onOperatorClick = function onOperatorClick(operator) {
     setOperator(operator);
@@ -67204,6 +67411,9 @@ var FieldIterator = React.forwardRef(function (props, ref) {
         } else {
           focusStatus.focus = true;
         }
+      },
+      reset: function reset() {
+        changedFieldValueMap.clear();
       }
     };
   });
@@ -67232,7 +67442,6 @@ var FieldIterator = React.forwardRef(function (props, ref) {
         return !x.isReadOnly && !x.isDisabled && !x.value;
       });
     }
-    return null;
   };
   var isControlRow = function isControlRow(controlName) {
     if (props.rowFieldList) {
@@ -67253,7 +67462,7 @@ var FieldIterator = React.forwardRef(function (props, ref) {
       isRequired: field.isRequired,
       isReadOnly: props.isReadOnly || field.isReadOnly,
       isDisabled: field.isDisabled,
-      data: field.fieldValueMap,
+      data: props.controlData ? _extends({}, field.fieldValueMap, props.controlData) : field.fieldValueMap,
       errorMessage: null,
       isAutoComplete: false,
       multiline: (_field$fieldValueMap = field.fieldValueMap) === null || _field$fieldValueMap === void 0 ? void 0 : _field$fieldValueMap.multiline,
@@ -68638,9 +68847,9 @@ var styles$1w = {"vitro-product-title":"_product-title_vitro-product-title_2gZcA
 var ProductTitle = function ProductTitle(props) {
   var content = React__default.createElement(React__default.Fragment, null, React__default.createElement(Image, {
     defaultUrl: props.image,
-    caption: props.imageCaption
+    alt: props.imageCaption
   }), props.title && React__default.createElement("h1", null, props.title), props.children);
-  var onClick = function onClick(e) {
+  var onClick = function onClick() {
     var href = props.link ? props.link : CTRL.SLASH;
     var event = new CustomEvent(exports.EVENT.HISTORY_UPDATE, {
       detail: {
@@ -68720,7 +68929,7 @@ var Radio = React.forwardRef(function (props, ref) {
         if (radioRef.current) {
           return radioRef.current.value;
         }
-        return null;
+        return false;
       }
     };
   });
@@ -68769,7 +68978,7 @@ var LinkInput = React.forwardRef(function (props, ref) {
     isEditMode = _useState[0],
     setIsEditMode = _useState[1];
   var _useState2 = React.useState(props.value || {
-      url: CTRL.EMPTY,
+      uri: CTRL.EMPTY,
       name: CTRL.EMPTY
     }),
     value = _useState2[0],
@@ -68793,7 +69002,7 @@ var LinkInput = React.forwardRef(function (props, ref) {
   });
   React.useEffect(function () {
     _setValue(props.value || {
-      url: CTRL.EMPTY,
+      uri: CTRL.EMPTY,
       name: CTRL.EMPTY
     });
   }, [props.value]);
@@ -68808,7 +69017,7 @@ var LinkInput = React.forwardRef(function (props, ref) {
   var onChange = function onChange(val) {
     _setValue(function (prevState) {
       return _extends({}, prevState, {
-        url: val
+        uri: val
       });
     });
     if (props.onChange) {
@@ -68822,11 +69031,11 @@ var LinkInput = React.forwardRef(function (props, ref) {
     }
   };
   var onMouseDown = function onMouseDown(e) {
-    if (!isEditMode && value.url) {
+    if (!isEditMode && value.uri) {
       e.preventDefault();
       e.stopPropagation();
       var link = document.createElement('a');
-      link.href = value.url;
+      link.href = value.uri;
       link.target = TARGET$2.BLANK;
       link.click();
       link.remove();
@@ -68836,13 +69045,13 @@ var LinkInput = React.forwardRef(function (props, ref) {
   return React__default.createElement("div", {
     className: className
   }, React__default.createElement(Tooltip$1, {
-    text: !isEditMode && value.url ? localeService.create(LOCALE$b.TOOLTIP_OPEN) : CTRL.EMPTY
+    text: !isEditMode && value.uri ? localeService.create(LOCALE$b.TOOLTIP_OPEN) : CTRL.EMPTY
   }, React__default.createElement("div", {
     onMouseDown: onMouseDown
   }, React__default.createElement(Input, {
     ref: inputRef,
     label: props.label,
-    value: value.name || value.url,
+    value: value.name || value.uri,
     onBlur: onBlur,
     onFocus: props.onFocus,
     onChange: onChange,
@@ -68990,7 +69199,7 @@ var StarButton = function StarButton(props) {
 
 var styles$1F = {"vitro-item":"_site-item_vitro-item_1eSpRGl","vitro-active":"_site-item_vitro-active_1d0nDLb","vitro-name":"_site-item_vitro-name_141-LTn","vitro-image":"_site-item_vitro-image_3wrW9q4","vitro-default-image":"_site-item_vitro-default-image_fcWWNwv","vitro-hidden":"_site-item_vitro-hidden_d6n2ocz","vitro-mobile-view":"_site-item_vitro-mobile-view_3bXuBr6"};
 
-var SiteItem = function SiteItem(props) {
+var SiteSelectItem = function SiteSelectItem(props) {
   var _useState = React.useState(props.isStarActive || false),
     isShowStar = _useState[0],
     setIsShowStar = _useState[1];
@@ -69086,7 +69295,7 @@ var SiteSelect = function SiteSelect(props) {
     }
   };
   var getItem = function getItem(item) {
-    return React__default.createElement(SiteItem, {
+    return React__default.createElement(SiteSelectItem, {
       key: item.id,
       id: item.id,
       name: item.name,
@@ -69140,7 +69349,7 @@ var SiteSelect = function SiteSelect(props) {
     filterValueTemplate: filterValueTemplate,
     className: styles$1G['vitro-search-value-list'],
     inputClassName: styles$1G['vitro-search-input']
-  }, React__default.createElement(SiteItem, Object.assign({}, props.rootItem, {
+  }, React__default.createElement(SiteSelectItem, Object.assign({}, props.rootItem, {
     isMobileView: isMobileView,
     onClick: function onClick() {
       return onItemSelect(props.rootItem);
@@ -83923,7 +84132,7 @@ var CSS_CLASS_HEADER = 'vitro-header';
 var CSS_CLASS_HEADER_MOBILE = 'vitro-header-mobile';
 var CSS_CLASS_CREATE_BUTTON = 'vitro-create-button';
 var EditableList = function EditableList(props) {
-  var _useState = React.useState(),
+  var _useState = React.useState(CTRL.EMPTY),
     editedItem = _useState[0],
     setEditedItem = _useState[1];
   var _useState2 = React.useState(),
@@ -83939,7 +84148,7 @@ var EditableList = function EditableList(props) {
     return new Map();
   }, []);
   React.useEffect(function () {
-    setEditedItem(props.editedItemId);
+    setEditedItem(props.editedItemId || CTRL.EMPTY);
     if (props.editedItemId) {
       if (props.onStartEdit) {
         props.onStartEdit(props.itemList.find(function (val) {
@@ -83969,7 +84178,7 @@ var EditableList = function EditableList(props) {
       changedFieldValueMap.clear();
     }
     if (item.id !== editedItem && item.id !== activeItem) {
-      setEditedItem(null);
+      setEditedItem(CTRL.EMPTY);
       if (props.onClick) {
         props.onClick(item, isTargetDropDownBtn);
       }
@@ -83982,14 +84191,14 @@ var EditableList = function EditableList(props) {
     }
   };
   var _onBlur = function onBlur(item, value) {
-    setEditedItem(undefined);
+    setEditedItem(CTRL.EMPTY);
     if (props.onEndEdit) {
       props.onEndEdit(item, value);
     }
   };
   var onCreate = function onCreate() {
-    setEditedItem(undefined);
-    setActiveItem(undefined);
+    setEditedItem(CTRL.EMPTY);
+    setActiveItem(CTRL.EMPTY);
     if (props.onCreate) {
       props.onCreate();
     }
@@ -84246,6 +84455,9 @@ var ReorderableList = function ReorderableList(props) {
     }
   }, [isTouchEnd]);
   var sort = function sort(a, b) {
+    if (a.index === -1 || b.index === -1) {
+      return 0;
+    }
     if (a.index < b.index) {
       return -1;
     }
@@ -84682,15 +84894,15 @@ var LOCALE$e;
 
 var KENDO_MEDIA_PLAYER = 'kendoMediaPlayer';
 var VOLUME_DEFAULT = 100;
-var TelerikMediaPlayerContextImpl = /*#__PURE__*/function () {
-  function TelerikMediaPlayerContextImpl(playerContainer, settings, localeService) {
+var TelerikMediaPlayerServiceImpl = /*#__PURE__*/function () {
+  function TelerikMediaPlayerServiceImpl(playerContainer, settings, localeService) {
     this.localeService = localeService;
     this.playerContainer = playerContainer;
     var playerConfig = this.getPlayerConfig(settings);
     this.playerContainer.kendoMediaPlayer(playerConfig);
     this.player = window.$(this.playerContainer).data(KENDO_MEDIA_PLAYER);
   }
-  var _proto = TelerikMediaPlayerContextImpl.prototype;
+  var _proto = TelerikMediaPlayerServiceImpl.prototype;
   _proto.getPlayerConfig = function getPlayerConfig(settings) {
     var playerConfig = {
       media: {
@@ -84761,7 +84973,7 @@ var TelerikMediaPlayerContextImpl = /*#__PURE__*/function () {
   _proto.getIsFullScreen = function getIsFullScreen() {
     return this.player.fullScreen();
   };
-  return TelerikMediaPlayerContextImpl;
+  return TelerikMediaPlayerServiceImpl;
 }();
 
 var styles$1R = {"vitro-video-viewer":"_video-viewer_vitro-video-viewer_1KHO5IM","vitro-header":"_video-viewer_vitro-header_hwAjLDd","vitro-body":"_video-viewer_vitro-body_124aVK2","vitro-button-close":"_video-viewer_vitro-button-close_TB-QCiO","vitro-player":"_video-viewer_vitro-player_2JJVj_u"};
@@ -84796,7 +85008,7 @@ var VideoViewer = React.forwardRef(function (props, ref) {
   var init = function init() {
     var playerContainer = window.$(playerContainerRef.current);
     var settings = getSettings();
-    var _player = new TelerikMediaPlayerContextImpl(playerContainer, settings, localeService);
+    var _player = new TelerikMediaPlayerServiceImpl(playerContainer, settings, localeService);
     setPlayer(_player);
   };
   var getSettings = function getSettings() {
@@ -84859,7 +85071,7 @@ exports.CommandMenuDropdownButton = CommandMenuDropdownButton;
 exports.CommandMenuLookupPicker = CommandMenuLookupPicker;
 exports.CommandMenuSubItem = CommandMenuSubItem;
 exports.ComponentLoader = ComponentLoader;
-exports.ComponentLoaderContextImpl = ComponentLoaderContextImpl;
+exports.ComponentLoaderServiceImpl = ComponentLoaderServiceImpl;
 exports.ControlGroup = ControlGroup;
 exports.CopyButton = CopyButton;
 exports.Criterion = Criterion;
@@ -84947,7 +85159,6 @@ exports.TableViewDetail = TableViewDetail;
 exports.TaskTile = TaskTile;
 exports.TaskUserList = TaskUserList;
 exports.TelerikUploader = TelerikUploader;
-exports.TelerikUploaderContextImpl = TelerikUploaderContextImpl;
 exports.TimePicker = TimePicker;
 exports.Tooltip = Tooltip$1;
 exports.TopLevelMenu = TopLevelMenu;
@@ -84956,6 +85167,7 @@ exports.TwoFactorAuthenticationForm = TwoFactorAuthenticationForm;
 exports.UNIT = UNIT;
 exports.UserLookupPicker = UserLookupPicker;
 exports.UserProfile = UserProfile;
+exports.ValueTooltip = ValueTooltip;
 exports.VideoViewer = VideoViewer;
 exports.View = View;
 exports.commonEn = commonEn;