npm - @vitrosoftware/common-ui-ts - Versions diffs - 1.1.218 → 1.1.220 - Mend

@vitrosoftware/common-ui-ts 1.1.218 → 1.1.220

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (28) hide show

package/css/std/controls/alert/alert.css +10 -47
package/css/std/controls/bim-viewer/bim-viewer-index.css +4 -0
package/css/std/controls/bim-viewer/style.css +4 -0
package/css/std/controls/dialog/dialog-footer.css +2 -0
package/css/std/controls/dxf-viewer/common.css +4 -0
package/css/std/controls/dxf-viewer/dxf-viewer-index.css +4 -0
package/css/std/controls/filter/filter.css +1 -1
package/css/std/controls/lookup-picker/lookup-picker.css +4 -0
package/css/std/controls/pdf-viewer/custom.css +4 -0
package/css/std/controls/pdf-viewer/pdf-viewer-index.css +4 -0
package/css/std/controls/select/select.css +25 -1
package/css/std/controls/tab-group/tab-group.css +6 -3
package/dist/index.css +48 -52
package/dist/index.js +292 -262
package/dist/index.js.map +1 -1
package/dist/src/constants/Factory.d.ts +1 -0
package/dist/src/controls/Alert/Alert.d.ts +0 -4
package/dist/src/controls/TabGroup/Tab.d.ts +3 -3
package/dist/src/controls/TabGroup/models/Tab.d.ts +1 -1
package/dist/src/controls/TableView/TableView.d.ts +2 -0
package/dist/src/controls/TableView/TableViewConstants.d.ts +4 -1
package/dist/src/controls/TableView/services/impl/TableViewOnCustomAjaxServiceImpl.d.ts +21 -0
package/dist/src/services/AjaxService.d.ts +4 -0
package/lib/dxf-viewer/OrbitControls.js +6 -2
package/package.json +1 -1
package/src/controls/BimViewer/js/bim-viewer.js +2 -2
package/src/controls/DxfViewer/js/dxf-viewer.js +67 -33
package/src/controls/PdfViewer/js/pdf-viewer.js +1 -1

package/dist/index.js CHANGED Viewed

@@ -21482,6 +21482,9 @@ var ATTRIBUTE$1;
   ATTRIBUTE["FORMULA"] = "Formula";
   ATTRIBUTE["FORMAT"] = "Format";
   ATTRIBUTE["SPAN"] = "Span";
+  ATTRIBUTE["LANG"] = "Lang";
+  ATTRIBUTE["GMT"] = "GMT";
+  ATTRIBUTE["ACTIONS"] = "Actions";
 })(ATTRIBUTE$1 || (ATTRIBUTE$1 = {}));
 var DRAG_ITEM_TYPE;
 (function (DRAG_ITEM_TYPE) {
@@ -22281,6 +22284,72 @@ var TableViewServiceImpl = /*#__PURE__*/function () {
   return TableViewServiceImpl;
 }();
+var TableViewOnCustomAjaxServiceImpl = /*#__PURE__*/function () {
+  function TableViewOnCustomAjaxServiceImpl(ajaxService) {
+    this.id = EVENT$1.ON_CUSTOM_AJAX;
+    this.data = 'Data';
+    this.dataRequestUrl = '/api/tableViewRequest/' + this.data;
+    this.dataResultString = '<Grid><Body><B /></Body></Grid>';
+    this.getRequest = 'Get';
+    this.treeGrid = 'treegrid/';
+    this.api = '/api/';
+    this.cacheVersionParam = 'CacheVersion';
+    this.ajaxService = ajaxService;
+  }
+  var _proto = TableViewOnCustomAjaxServiceImpl.prototype;
+  _proto.process = function process(tableView, source, data, func) {
+    var success = function success(ret) {
+      return func(0, ret);
+    };
+    if (source.Url && source.Url.indexOf(this.dataRequestUrl) === 0) {
+      success(this.dataResultString);
+      return true;
+    }
+    var fail = function fail() {
+      return func(0, '<Grid><IO / > <Body><B Pos="0" Count = "0" /> </Body></Grid>');
+    };
+    var url = source.Url;
+    if (url.indexOf(this.api) !== 0) {
+      url = this.getTreeGridFileUrl(tableView[this.cacheVersionParam], source);
+    }
+    if (source.Method === this.getRequest) {
+      this.ajaxService.get(url, tableView.scope).then(success)["catch"](fail);
+    } else {
+      var formData = new FormData();
+      formData.set(this.data, data);
+      this.ajaxService.post(url, formData, tableView.scope).then(success)["catch"](fail);
+    }
+    return true;
+  };
+  _proto.getTreeGridFileUrl = function getTreeGridFileUrl(cacheVersion, source) {
+    var url = source.Url;
+    if (url[0] !== CTRL.SLASH) {
+      if (url.indexOf(this.treeGrid) !== 0) {
+        url = this.treeGrid + source.Url;
+      }
+      url = CTRL.SLASH + url;
+    }
+    if (url.indexOf(CTRL.QUESTION) === -1) {
+      url += CTRL.QUESTION + this.cacheVersionParam + CTRL.EQUAL + cacheVersion;
+    }
+    return url;
+  };
+  return TableViewOnCustomAjaxServiceImpl;
+}();
+var SERVICE = function SERVICE() {};
+SERVICE.LOCALE = 'LocaleService';
+SERVICE.LOCAL_STORAGE = 'LocalStorageService';
+SERVICE.COLUMN = 'ColumnService';
+SERVICE.GUID = 'GuidService';
+SERVICE.EVENT = 'EventService';
+SERVICE.IMAGE = 'ImageService';
+SERVICE.ITEM = 'ItemService';
+SERVICE.CONTENT_TYPE = 'ContentTypeService';
+SERVICE.LOOKUP_LIST_ITEM = 'LookupListItemService';
+SERVICE.ITEM_SELECT_DIALOG = 'ItemSelectDialogService';
+SERVICE.AJAX = 'AjaxService';
 var styles$5 = {"vitro-table-view":"_table-view_vitro-table-view_1tTs32D"};
 var w$2 = window;
@@ -22352,6 +22421,22 @@ var TreeGrid = function TreeGrid(props) {
       return [URL.API, controller, dataKey, props.listCode].join(CTRL.SLASH);
     }
   };
+  var initOnCustomAjax = function initOnCustomAjax() {
+    if (props.onCustomAjax) {
+      var onCustomAjax = props.onCustomAjax;
+      w$2.TGSetEvent(EVENT$1.ON_CUSTOM_AJAX, props.id, function (grid, source, data, func) {
+        return onCustomAjax(grid, source, data, func);
+      });
+    } else if (props.container) {
+      var ajaxService = props.container.get(SERVICE.AJAX);
+      if (ajaxService) {
+        var tableViewOnCustomAjaxService = new TableViewOnCustomAjaxServiceImpl(ajaxService);
+        w$2.TGSetEvent(EVENT$1.ON_CUSTOM_AJAX, props.id, function (grid, source, data, func) {
+          return tableViewOnCustomAjaxService.process(grid, source, data, func);
+        });
+      }
+    }
+  };
   React.useEffect(function () {
     if (prevGridIdRef.current) {
       disposeTableViewById(prevGridIdRef.current);
@@ -22361,15 +22446,10 @@ var TreeGrid = function TreeGrid(props) {
       w$2.TGSetEvent(EVENT$1.ON_LOADED, props.id, function (grid, next) {
         return onGridLoaded(grid, next);
       });
-      w$2.TGSetEvent(EVENT$1.ON_INIT, props.id, function (grid, reload) {
+      w$2.TGSetEvent(EVENT$1.ON_INIT, props.id, function (grid) {
         return onGridInit(grid);
       });
-      if (props.onCustomAjax) {
-        var onCustomAjax = props.onCustomAjax;
-        w$2.TGSetEvent(EVENT$1.ON_CUSTOM_AJAX, props.id, function (grid, source, data, func) {
-          return onCustomAjax(grid, source, data, func);
-        });
-      }
+      initOnCustomAjax();
     }
     if (w$2.TreeGrid) {
       if (props.layout || props.data) {
@@ -23021,18 +23101,6 @@ var DropZone = React.forwardRef(function (props, ref) {
   }, props.label)));
 });
-var SERVICE = function SERVICE() {};
-SERVICE.LOCALE = 'LocaleService';
-SERVICE.LOCAL_STORAGE = 'LocalStorageService';
-SERVICE.COLUMN = 'ColumnService';
-SERVICE.GUID = 'GuidService';
-SERVICE.EVENT = 'EventService';
-SERVICE.IMAGE = 'ImageService';
-SERVICE.ITEM = 'ItemService';
-SERVICE.CONTENT_TYPE = 'ContentTypeService';
-SERVICE.LOOKUP_LIST_ITEM = 'LookupListItemService';
-SERVICE.ITEM_SELECT_DIALOG = 'ItemSelectDialogService';
 var styles$a = {"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-progress-bar":"_uploader_vitro-progress-bar_3YXLbbu"};
 var $$2 = window.$;
@@ -56683,35 +56751,6 @@ var BootstrapAlert = Object.assign(Alert, {
   Heading: AlertHeading
 });
-const Button$1 = /*#__PURE__*/React.forwardRef(({
-  as,
-  bsPrefix,
-  variant = 'primary',
-  size,
-  active = false,
-  disabled = false,
-  className,
-  ...props
-}, ref) => {
-  const prefix = useBootstrapPrefix(bsPrefix, 'btn');
-  const [buttonProps, {
-    tagName
-  }] = useButtonProps({
-    tagName: as,
-    disabled,
-    ...props
-  });
-  const Component = tagName;
-  return /*#__PURE__*/jsxRuntime.jsx(Component, {
-    ...buttonProps,
-    ...props,
-    ref: ref,
-    disabled: disabled,
-    className: classnames(className, prefix, active && 'active', variant && `${prefix}-${variant}`, size && `${prefix}-${size}`, props.href && disabled && 'disabled')
-  });
-});
-Button$1.displayName = 'Button';
 const context = /*#__PURE__*/React.createContext(null);
 context.displayName = 'CardHeaderContext';
@@ -60281,7 +60320,7 @@ var styles$h = {"vitro-button":"_button_vitro-button_hVfBuSO","vitro-animation-r
 var HTML_ELEMENT_SPAN = 'span';
 var TYPE_BUTTON = 'button';
-var Button$2 = React.forwardRef(function (props, ref) {
+var Button$1 = React.forwardRef(function (props, ref) {
   var _useState = React.useState(false),
     pending = _useState[0],
     setPending = _useState[1];
@@ -60360,7 +60399,7 @@ var Button$2 = React.forwardRef(function (props, ref) {
 });
 var ButtonCancel = function ButtonCancel(props) {
-  return React__default.createElement(Button$2, Object.assign({}, props, {
+  return React__default.createElement(Button$1, Object.assign({}, props, {
     className: STYLE.OUTLINE_LIGHT + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY)
   }));
 };
@@ -60372,7 +60411,7 @@ var ButtonGroup = React.forwardRef(function (props, ref) {
     ref: ref,
     className: styles$i['vitro-button-group'] + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY)
   }, props.itemList && props.itemList.length > 0 ? props.itemList.map(function (item, index) {
-    return React__default.createElement(Button$2, Object.assign({}, item, {
+    return React__default.createElement(Button$1, Object.assign({}, item, {
       key: index
     }));
   }) : null, props.children);
@@ -60448,7 +60487,7 @@ var DialogFooter = function DialogFooter(props) {
     onClick: props.onClose,
     className: styles$k['vitro-button']
   }), (_props$buttonList2 = props.buttonList) !== null && _props$buttonList2 !== void 0 && _props$buttonList2.length ? props.buttonList.map(function (button) {
-    return React__default.createElement(Button$2, Object.assign({}, button, {
+    return React__default.createElement(Button$1, Object.assign({}, button, {
       onClick: function onClick() {
         var _button$onClick;
         return (_button$onClick = button.onClick) === null || _button$onClick === void 0 ? void 0 : _button$onClick.call(button, props.dialog);
@@ -61400,25 +61439,188 @@ var OverflowButton = function OverflowButton(props) {
   });
 };
+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),
+    isEnabled = _useState[0],
+    setIsEnabled = _useState[1];
+  var _useState2 = React.useState(false),
+    isShow = _useState2[0],
+    setIsShow = _useState2[1];
+  var _useState3 = React.useState(props.text),
+    text = _useState3[0],
+    _setText = _useState3[1];
+  var canvasRef = React.useRef();
+  var containerRef = React.useRef();
+  var onShowTimeout = React.useMemo(function () {
+    return {
+      id: null
+    };
+  }, []);
+  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;
+        setIsEnabled(isValueOverflow(text, entry.target));
+      }
+    });
+  }, [text]);
+  React.useEffect(function () {
+    if (props.containerRef && props.containerRef.current) {
+      containerRef.current = props.containerRef.current;
+      resizeObserver.observe(containerRef.current);
+      containerRef.current.addEventListener(exports.EVENT.MOUSEENTER, onMouseEnter);
+      containerRef.current.addEventListener(exports.EVENT.MOUSELEAVE, onMouseLeave);
+    }
+    return function () {
+      if (containerRef.current) {
+        containerRef.current.removeEventListener(exports.EVENT.MOUSEENTER, onMouseEnter);
+        containerRef.current.removeEventListener(exports.EVENT.MOUSELEAVE, onMouseLeave);
+      }
+    };
+  }, [props.containerRef, resizeObserver]);
+  React.useEffect(function () {
+    return function () {
+      resizeObserver.disconnect();
+    };
+  }, []);
+  React.useEffect(function () {
+    _setText(props.text);
+    if (containerRef.current) {
+      setIsEnabled(isValueOverflow(props.text, containerRef.current));
+    } else {
+      setIsEnabled(true);
+    }
+  }, [props.text]);
+  React.useEffect(function () {
+    if (props.onUpdate) {
+      props.onUpdate(isEnabled);
+    }
+  }, [isEnabled]);
+  React.useImperativeHandle(ref, function () {
+    return {
+      update: function update() {
+        if (containerRef.current) {
+          setIsEnabled(isValueOverflow(text, containerRef.current));
+        }
+      },
+      setIsShow: function setIsShow(value) {
+        if (value === false) {
+          setIsEnabled(false);
+        } else {
+          if (containerRef.current) {
+            setIsEnabled(isValueOverflow(text, containerRef.current));
+          } else {
+            setIsEnabled(true);
+          }
+        }
+      },
+      setText: function setText(value) {
+        _setText(value);
+      }
+    };
+  });
+  var isValueOverflow = function isValueOverflow(value, container) {
+    if (props.isMultiline) {
+      return isValueVerticalOverflow(container);
+    }
+    return isValueHorizontalOverflow(value, container);
+  };
+  var isValueHorizontalOverflow = function isValueHorizontalOverflow(value, container) {
+    var textWidth = getTextWidth(value, getCanvasFont(container), container.scrollWidth);
+    if (container && textWidth > getAvailableWidth(container)) {
+      return true;
+    } else {
+      return false;
+    }
+  };
+  var isValueVerticalOverflow = function isValueVerticalOverflow(container) {
+    return container.clientHeight + 1 < container.scrollHeight;
+  };
+  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;
+  };
+  var onMouseEnter = function onMouseEnter(e) {
+    if (onShowTimeout.id) {
+      clearTimeout(onShowTimeout.id);
+    }
+    if (e.target == containerRef.current) {
+      onShowTimeout.id = setTimeout(function () {
+        setIsShow(true);
+      }, 750);
+    }
+  };
+  var onMouseLeave = function onMouseLeave(e) {
+    if (onShowTimeout.id) {
+      clearTimeout(onShowTimeout.id);
+    }
+    setTimeout(function () {
+      return setIsShow(false);
+    }, 300);
+  };
+  return React__default.createElement(Tooltip$1, Object.assign({}, props, {
+    text: text,
+    isShow: isEnabled ? isShow : false,
+    isHideOnHover: false
+  }), props.children);
+});
 var styles$r = {"vitro-tab":"_tab-group_vitro-tab_1Qb50HL","vitro-item":"_tab-group_vitro-item_2YnBcmb","active":"_tab-group_active_3M-IIR2"};
 var Tab = function Tab(props) {
-  if (!props.icon && !props.title) {
-    return null;
-  }
+  var linkRef = React.useRef(null);
   return React__default.createElement("div", {
     key: props.index,
     className: styles$r['vitro-item']
+  }, React__default.createElement(ValueTooltip, {
+    text: props.text,
+    containerRef: linkRef
   }, React__default.createElement(Nav$2.Item, {
     className: props.active ? styles$r['active'] : undefined,
     onClick: function onClick() {
       return props.onClick(props.index);
     }
   }, React__default.createElement(Nav$2.Link, {
-    eventKey: props.eventKey
-  }, React__default.createElement("span", null, props.icon && React__default.createElement(Image, {
-    defaultUrl: props.icon
-  }), props.title))));
+    eventKey: props.eventKey,
+    ref: linkRef
+  }, React__default.createElement("span", null, props.imageUrl && React__default.createElement(Image, {
+    defaultUrl: props.imageUrl
+  }), props.text)))));
 };
 var TabGroupHeader = function TabGroupHeader(props) {
@@ -61466,8 +61668,8 @@ var TabGroupHeader = function TabGroupHeader(props) {
         active: index === props.currentTab,
         onClick: onClick,
         eventKey: item.eventKey,
-        icon: item.icon,
-        title: item.text
+        imageUrl: item.imageUrl,
+        text: item.text
       });
     }
     if (activeItem && activeItem.index === index) {
@@ -61481,8 +61683,8 @@ var TabGroupHeader = function TabGroupHeader(props) {
     active: true,
     onClick: function onClick() {},
     eventKey: activeItem.eventKey,
-    icon: activeItem.icon,
-    title: activeItem.text
+    imageUrl: activeItem.imageUrl,
+    text: activeItem.text
   }), props.itemList && props.wrap && React__default.createElement(OverflowButton, {
     list: overflowTabList,
     offset: props.itemList.length - overflowTabList.length,
@@ -61813,7 +62015,7 @@ var TabButtonGroup = function TabButtonGroup(props) {
     return ((_tabList$index = tabList[index]) === null || _tabList$index === void 0 ? void 0 : _tabList$index.id) == activeItem;
   };
   var getTabButton = function getTabButton(item, index) {
-    return React__default.createElement(Button$2, {
+    return React__default.createElement(Button$1, {
       key: item.id,
       className: isTabButtonActive(index) ? styles$v[CSS_CLASS_ACTIVE] : CTRL.EMPTY,
       text: item.text,
@@ -61844,7 +62046,7 @@ var TabButtonGroup = function TabButtonGroup(props) {
     }
     overflowTabList.push(item);
     return null;
-  }), activeItemTabBtn && React__default.createElement(Button$2, {
+  }), activeItemTabBtn && React__default.createElement(Button$1, {
     key: activeItemTabBtn.id,
     className: styles$v[CSS_CLASS_ACTIVE],
     text: activeItemTabBtn.text,
@@ -62866,7 +63068,7 @@ var AddFieldButton = React.forwardRef(function (props, ref) {
   };
   return React__default.createElement("div", {
     className: styles$H['vitro-add-field']
-  }, React__default.createElement(Button$2, {
+  }, React__default.createElement(Button$1, {
     ref: addFieldButtonRef,
     text: props.labelAddField,
     onClick: props.onAddField,
@@ -63234,170 +63436,9 @@ var CriterionFieldIterator = function CriterionFieldIterator(props) {
   })));
 };
-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),
-    isEnabled = _useState[0],
-    setIsEnabled = _useState[1];
-  var _useState2 = React.useState(false),
-    isShow = _useState2[0],
-    setIsShow = _useState2[1];
-  var _useState3 = React.useState(props.text),
-    text = _useState3[0],
-    _setText = _useState3[1];
-  var canvasRef = React.useRef();
-  var containerRef = React.useRef();
-  var onShowTimeout = React.useMemo(function () {
-    return {
-      id: null
-    };
-  }, []);
-  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;
-        setIsEnabled(isValueOverflow(text, entry.target));
-      }
-    });
-  }, [text]);
-  React.useEffect(function () {
-    if (props.containerRef && props.containerRef.current) {
-      containerRef.current = props.containerRef.current;
-      resizeObserver.observe(containerRef.current);
-      containerRef.current.addEventListener(exports.EVENT.MOUSEENTER, onMouseEnter);
-      containerRef.current.addEventListener(exports.EVENT.MOUSELEAVE, onMouseLeave);
-    }
-    return function () {
-      if (containerRef.current) {
-        containerRef.current.removeEventListener(exports.EVENT.MOUSEENTER, onMouseEnter);
-        containerRef.current.removeEventListener(exports.EVENT.MOUSELEAVE, onMouseLeave);
-      }
-    };
-  }, [props.containerRef, resizeObserver]);
-  React.useEffect(function () {
-    return function () {
-      resizeObserver.disconnect();
-    };
-  }, []);
-  React.useEffect(function () {
-    _setText(props.text);
-    if (containerRef.current) {
-      setIsEnabled(isValueOverflow(props.text, containerRef.current));
-    } else {
-      setIsEnabled(true);
-    }
-  }, [props.text]);
-  React.useEffect(function () {
-    if (props.onUpdate) {
-      props.onUpdate(isEnabled);
-    }
-  }, [isEnabled]);
-  React.useImperativeHandle(ref, function () {
-    return {
-      update: function update() {
-        if (containerRef.current) {
-          setIsEnabled(isValueOverflow(text, containerRef.current));
-        }
-      },
-      setIsShow: function setIsShow(value) {
-        if (value === false) {
-          setIsEnabled(false);
-        } else {
-          if (containerRef.current) {
-            setIsEnabled(isValueOverflow(text, containerRef.current));
-          } else {
-            setIsEnabled(true);
-          }
-        }
-      },
-      setText: function setText(value) {
-        _setText(value);
-      }
-    };
-  });
-  var isValueOverflow = function isValueOverflow(value, container) {
-    if (props.isMultiline) {
-      return isValueVerticalOverflow(container);
-    }
-    return isValueHorizontalOverflow(value, container);
-  };
-  var isValueHorizontalOverflow = function isValueHorizontalOverflow(value, container) {
-    var textWidth = getTextWidth(value, getCanvasFont(container), container.scrollWidth);
-    if (container && textWidth > getAvailableWidth(container)) {
-      return true;
-    } else {
-      return false;
-    }
-  };
-  var isValueVerticalOverflow = function isValueVerticalOverflow(container) {
-    return container.clientHeight + 1 < container.scrollHeight;
-  };
-  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;
-  };
-  var onMouseEnter = function onMouseEnter(e) {
-    if (onShowTimeout.id) {
-      clearTimeout(onShowTimeout.id);
-    }
-    if (e.target == containerRef.current) {
-      onShowTimeout.id = setTimeout(function () {
-        setIsShow(true);
-      }, 750);
-    }
-  };
-  var onMouseLeave = function onMouseLeave(e) {
-    if (onShowTimeout.id) {
-      clearTimeout(onShowTimeout.id);
-    }
-    setTimeout(function () {
-      return setIsShow(false);
-    }, 300);
-  };
-  return React__default.createElement(Tooltip$1, Object.assign({}, props, {
-    text: text,
-    isShow: isEnabled ? isShow : false,
-    isHideOnHover: false
-  }), props.children);
-});
 var styles$M = {"vitro-selected-item-multi":"_lookup-picker-selected-item_vitro-selected-item-multi_bzL7ugZ","vitro-selected-item":"_lookup-picker-selected-item_vitro-selected-item_hw-euth","vitro-button-close":"_lookup-picker-selected-item_vitro-button-close_1SRnr_0"};
-var styles$N = {"vitro-lookup-picker":"_lookup-picker_vitro-lookup-picker_1aXYQEG","vitro-content":"_lookup-picker_vitro-content_37L0slb","vitro-read-only":"_lookup-picker_vitro-read-only_32NOdGB","vitro-label":"_lookup-picker_vitro-label_2QoJkUz","vitro-focus":"_lookup-picker_vitro-focus_2UGpxXD","vitro-error":"_lookup-picker_vitro-error_dF7iopC","vitro-error-message":"_lookup-picker_vitro-error-message_2iBjyRP","vitro-copy-button":"_lookup-picker_vitro-copy-button_3UItrZb","vitro-value-container":"_lookup-picker_vitro-value-container_3GeBIaW","vitro-multi-value-container":"_lookup-picker_vitro-multi-value-container_2ScQ_Ua","vitro-lookup-picker-multi-select":"_lookup-picker_vitro-lookup-picker-multi-select_3Lkq2tk","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","vitro-tooltip":"_lookup-picker_vitro-tooltip_2a12Z4P","vitro-right":"_lookup-picker_vitro-right_1XFsL1w","vitro-library-button":"_lookup-picker_vitro-library-button_1zwNYAA"};
+var styles$N = {"vitro-lookup-picker":"_lookup-picker_vitro-lookup-picker_1aXYQEG","vitro-content":"_lookup-picker_vitro-content_37L0slb","vitro-read-only":"_lookup-picker_vitro-read-only_32NOdGB","vitro-label":"_lookup-picker_vitro-label_2QoJkUz","vitro-focus":"_lookup-picker_vitro-focus_2UGpxXD","vitro-error":"_lookup-picker_vitro-error_dF7iopC","vitro-error-message":"_lookup-picker_vitro-error-message_2iBjyRP","vitro-copy-button":"_lookup-picker_vitro-copy-button_3UItrZb","vitro-value-container":"_lookup-picker_vitro-value-container_3GeBIaW","vitro-multi-value-container":"_lookup-picker_vitro-multi-value-container_2ScQ_Ua","vitro-lookup-picker-multi-select":"_lookup-picker_vitro-lookup-picker-multi-select_3Lkq2tk","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","vitro-tooltip":"_lookup-picker_vitro-tooltip_2a12Z4P","vitro-right":"_lookup-picker_vitro-right_1XFsL1w","vitro-library-button":"_lookup-picker_vitro-library-button_1zwNYAA","vitro-placeholder":"_lookup-picker_vitro-placeholder_2Soq8bU"};
 var htmlValueStyles = {"vitro-item-html-value":"_lookup-picker-html-value_vitro-item-html-value_2QBoTey"};
@@ -63545,7 +63586,7 @@ var ValueList = function ValueList(props) {
     className: valueListStyles['vitro-placeholder-empty']
   }, props.emptyPlaceholder))), props.button && React__default.createElement(FlexBox, {
     className: valueListStyles['vitro-flex']
-  }, React__default.createElement(Button$2, Object.assign({}, props.button, {
+  }, React__default.createElement(Button$1, Object.assign({}, props.button, {
     className: valueListStyles['vitro-button']
   })))));
 };
@@ -63950,7 +63991,9 @@ var LookupPicker = React.forwardRef(function (props, ref) {
     isReadOnly: props.isReadOnly,
     isValueListVisible: valueListVisible,
     getHtmlValue: getHtmlValue
-  }) : !valueListVisible && React__default.createElement(React__default.Fragment, null, props.placeholder), isEditable && React__default.createElement("input", {
+  }) : !valueListVisible && React__default.createElement("div", {
+    className: styles$N['vitro-placeholder']
+  }, props.placeholder), isEditable && React__default.createElement("input", {
     ref: inputRef,
     value: inputValue,
     onKeyDown: onKeyDown,
@@ -66378,7 +66421,7 @@ var SortFilter = function SortFilter(props) {
     isClearChangedFieldValueMap: true
   }) : CTRL.EMPTY, React__default.createElement("div", {
     className: CSS_CLASS_ADD_FIELD
-  }, React__default.createElement(Button$2, {
+  }, React__default.createElement(Button$1, {
     ref: addFieldButtonRef,
     text: props.labelAddField,
     onClick: onAddSortField,
@@ -66534,7 +66577,7 @@ var SearchDialog = function SearchDialog(props) {
   }, React__default.createElement(ButtonCancel, {
     text: getSearchLabel(ACTION$2.CANCEL),
     onClick: props.onCancel
-  }), React__default.createElement(Button$2, {
+  }), React__default.createElement(Button$1, {
     text: getSearchLabel(ACTION$2.SEARCH),
     onClick: props.onSearch,
     className: STYLE.PRIMARY
@@ -67061,7 +67104,7 @@ var Viewer = function Viewer(props) {
 };
 var name = "@vitrosoftware/common-ui-ts";
-var version$1 = "1.1.218";
+var version$1 = "1.1.220";
 var description = "vitro software common ui ts";
 var author = "";
 var license = "MIT";
@@ -67363,7 +67406,7 @@ var styles$12 = {"vitro-submit-button":"_login-submit-button_vitro-submit-button
 var LoginSubmitButton = function LoginSubmitButton(props) {
   var localeService = inversifyReact.useInjection(SERVICE.LOCALE);
-  return React__default.createElement(Button$2, {
+  return React__default.createElement(Button$1, {
     className: STYLE.PRIMARY + CTRL.SPACE + styles$12['vitro-submit-button'] + (props.className ? CTRL.SPACE + props.className : CTRL.EMPTY),
     text: localeService.create(LOCALE$9.ACTION_LOGIN),
     onClick: props.onClick,
@@ -67530,7 +67573,7 @@ var LoginForm = React.forwardRef(function (props, ref) {
   }, localeService.create(LOCALE$9.LOGIN_FORM_SEPARATOR_TEXT)), React__default.createElement("div", {
     className: styles$14['vitro-button-list']
   }, props.buttonList.map(function (button) {
-    return React__default.createElement(Button$2, Object.assign({}, button, {
+    return React__default.createElement(Button$1, Object.assign({}, button, {
       className: styles$14['vitro-button']
     }));
   }))) : React__default.createElement(React__default.Fragment, null), props.onRegister && React__default.createElement(Link, {
@@ -67725,7 +67768,7 @@ var CommandMenu = React.forwardRef(function (props, ref) {
 var styles$19 = {"vitro-command-menu-button":"_command-menu-button_vitro-command-menu-button_2IiXVbP","vitro-image":"_command-menu-button_vitro-image_27yILgG"};
 var CommandMenuButton = function CommandMenuButton(props) {
-  return React__default.createElement("li", null, React__default.createElement(Button$2, Object.assign({}, props, {
+  return React__default.createElement("li", null, React__default.createElement(Button$1, Object.assign({}, props, {
     className: styles$19['vitro-command-menu-button'] + CTRL.SPACE + (props.className ? props.className : STYLE.LIGHT)
   })));
 };
@@ -68468,7 +68511,7 @@ var AlertConstants = {
     get TYPE () { return TYPE$2; }
 };
-var styles$1h = {"vitro-alert":"_alert_vitro-alert_3sPAkJb","vitro-position-absolute":"_alert_vitro-position-absolute_2A33Lq4","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$1h = {"vitro-alert":"_alert_vitro-alert_3sPAkJb","vitro-position-absolute":"_alert_vitro-position-absolute_2A33Lq4","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-position-center":"_alert_vitro-position-center_1r_lK_e","vitro-content-container":"_alert_vitro-content-container_M2-akFp"};
 var TYPE_DANGER = 'danger';
 var Alert$1 = function Alert(props) {
@@ -68478,12 +68521,6 @@ var Alert$1 = function Alert(props) {
       ref.current.focus();
     }
   }, [props]);
-  var actionOnClick = function actionOnClick(action) {
-    if (action) {
-      action();
-    }
-    props.setMessage(null);
-  };
   var onClose = function onClose() {
     if (props.onClose) {
       props.onClose();
@@ -68500,16 +68537,6 @@ var Alert$1 = function Alert(props) {
       }, 100);
     }
   };
-  var actionList = props.actionList && React__default.createElement("div", {
-    className: styles$1h['vitro-alert-action-list']
-  }, props.actionList.map(function (a) {
-    return React__default.createElement(Button$1, {
-      key: a.text,
-      onClick: function onClick() {
-        return actionOnClick(a.onClick);
-      }
-    }, a.text);
-  }));
   var className = [styles$1h['vitro-alert'], props.isPositionCenter ? styles$1h['vitro-position-center'] : CTRL.EMPTY, props.isPositionAbsolute ? styles$1h['vitro-position-absolute'] : CTRL.EMPTY, props.className || CTRL.EMPTY].join(CTRL.SPACE);
   return React__default.createElement("div", {
     tabIndex: 1,
@@ -68523,12 +68550,15 @@ var Alert$1 = function Alert(props) {
     className: styles$1h['vitro-alert-content']
   }, React__default.createElement("div", {
     className: styles$1h['vitro-icon']
-  }), React__default.createElement("div", {
+  }), React__default.createElement(FlexBox, {
+    className: styles$1h['vitro-content-container'],
+    isColumn: true
+  }, React__default.createElement("div", {
     className: styles$1h['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", {
+  }, props.title && React__default.createElement("strong", null, props.title), props.text, !props.text && props.children), props.children), props.isDismissible && React__default.createElement("div", {
     className: styles$1h['vitro-button-close'],
     onClick: onClose
-  })), props.text && props.children, props.isMultiline && actionList));
+  }))));
 };
 var styles$1i = {"vitro-user-profile":"_user-profile_vitro-user-profile_11XpBoQ","vitro-dropdown-item":"_user-profile_vitro-dropdown-item_dSErsta","vitro-avatar":"_user-profile_vitro-avatar_3SzDPAi"};
@@ -83444,7 +83474,6 @@ var EditableFieldIterator = function EditableFieldIterator(props) {
     changedFieldValueMap: changedFieldValueMap,
     componentMap: componentMap,
     onChange: onChange,
-    isVisibleOverflow: true,
     className: styles$1r['vitro-field-iterator']
   }) : React__default.createElement(ScrollBar, {
     className: styles$1r['vitro-scrollbar']
@@ -83454,7 +83483,6 @@ var EditableFieldIterator = function EditableFieldIterator(props) {
     changedFieldValueMap: changedFieldValueMap,
     componentMap: componentMap,
     onChange: onChange,
-    isVisibleOverflow: true,
     className: styles$1r['vitro-field-iterator']
   })));
 };
@@ -84856,7 +84884,7 @@ var DxfViewer = function DxfViewer(props) {
   });
 };
-var styles$1O = {"vitro-select":"_select_vitro-select_EObExkL","vitro-active":"_select_vitro-active_3I2oZ9Y","vitro-label":"_select_vitro-label_1sD79dR","vitro-list-container":"_select_vitro-list-container_1iaPtG5","vitro-item":"_select_vitro-item_3Q88bWt"};
+var styles$1O = {"vitro-select":"_select_vitro-select_EObExkL","vitro-active":"_select_vitro-active_3I2oZ9Y","vitro-label":"_select_vitro-label_1sD79dR","vitro-list-container":"_select_vitro-list-container_1iaPtG5","vitro-item":"_select_vitro-item_3Q88bWt","vitro-scrollbar":"_select_vitro-scrollbar_1T9-kjS"};
 var Select = function Select(props) {
   var _useState = React.useState(null),
@@ -84922,11 +84950,13 @@ var Select = function Select(props) {
   }), React__default.createElement(itemTemplate, value), React__default.createElement("div", {
     className: styles$1O['vitro-list-container'],
     ref: listRef
+  }, React__default.createElement(ScrollBar, {
+    className: styles$1O['vitro-scrollbar']
   }, React__default.createElement(List$1, {
     itemList: props.itemList,
     onClick: onClick,
     itemTemplate: itemTemplate
-  })));
+  }))));
 };
 var styles$1P = {"vitro-switch":"_switch_vitro-switch_1noCcra","vitro-slider":"_switch_vitro-slider_3wesxda","vitro-active":"_switch_vitro-active_3LJI9TW"};
@@ -86132,7 +86162,7 @@ var SlideUpButton = function SlideUpButton(props) {
       props.onClick(e);
     }
   };
-  return React__default.createElement(React__default.Fragment, null, React__default.createElement(Button$2, {
+  return React__default.createElement(React__default.Fragment, null, React__default.createElement(Button$1, {
     onClick: onClick,
     text: CTRL.EMPTY,
     imageUrl: props.imageUrl,
@@ -86170,7 +86200,7 @@ exports.BUTTON = ButtonConstants;
 exports.BimViewer = BimViewer;
 exports.BottomAlignControlGroup = BottomAlignControlGroup;
 exports.Breadcrumbs = Breadcrumbs;
-exports.Button = Button$2;
+exports.Button = Button$1;
 exports.ButtonCancel = ButtonCancel;
 exports.ButtonGroup = ButtonGroup;
 exports.CONTROL = CONTROL;