@vitrosoftware/common-ui-ts 1.1.213 → 1.1.214

package/css/std/controls/dropdown-button/dropdown-button.css

@@ -176,12 +176,11 @@
     padding-right: 8px;
 }
 
-.vitro-dropdown-menu :global(.dropdown-divider) {
-    margin: 0;
+.vitro-dropdown-menu .vitro-separator {
     border-top: 1px solid #E4E6EC;
 }
 
-.vitro-dropdown-menu :global(.dropdown-divider):nth-child(2) {
+.vitro-dropdown-menu .vitro-separator:nth-child(2) {
     border: none;
 }
 

package/css/std/controls/scrollbar/scrollbar.css

@@ -1,8 +1,8 @@
 @import url('@vitrosoftware/common-ui-ts/css/third-party/perfect-scrollbar/perfect-scrollbar.css');
 
 .vitro-scrollbar-content {
-    height: 100%;
-    width: 100%;
+    min-height: 100%;
+    min-width: 100%;
 }
 
 :global(.ps) {

package/css/std/controls/view/view.css

@@ -27,4 +27,6 @@
     padding: 22px 16px 0 16px;
     display: flex;
     flex-direction: column;
+    width: 100%;
+    height: 100%;
 }

package/css/std/controls/view-part/view-part.css

@@ -1,4 +1,4 @@
-.vitro-view-part:last-child {
+.vitro-view-part:last-of-type {
     flex-grow: 1;
     max-height: 100%;
 }

package/dist/index.css

@@ -273,8 +273,8 @@ body em {
 @import url('@vitrosoftware/common-ui-ts/css/third-party/perfect-scrollbar/perfect-scrollbar.css');
 
 ._scrollbar_vitro-scrollbar-content_3HXSt5u {
-    height: 100%;
-    width: 100%;
+    min-height: 100%;
+    min-width: 100%;
 }
 
 .ps {
@@ -2431,12 +2431,11 @@ div._component-loader_vitro-component-loader_3J3a2or {
     padding-right: 8px;
 }
 
-._dropdown-button_vitro-dropdown-menu_2B1Wr1Y .dropdown-divider {
-    margin: 0;
+._dropdown-button_vitro-dropdown-menu_2B1Wr1Y ._dropdown-button_vitro-separator_3UJOlCk {
     border-top: 1px solid #E4E6EC;
 }
 
-._dropdown-button_vitro-dropdown-menu_2B1Wr1Y .dropdown-divider:nth-child(2) {
+._dropdown-button_vitro-dropdown-menu_2B1Wr1Y ._dropdown-button_vitro-separator_3UJOlCk:nth-child(2) {
     border: none;
 }
 
@@ -2611,7 +2610,7 @@ div._component-loader_vitro-component-loader_3J3a2or {
     }
    
 }
-._view-part_vitro-view-part_3j_gZpl:last-child {
+._view-part_vitro-view-part_3j_gZpl:last-of-type {
     flex-grow: 1;
     max-height: 100%;
 }
@@ -2673,6 +2672,8 @@ div._component-loader_vitro-component-loader_3J3a2or {
     padding: 22px 16px 0 16px;
     display: flex;
     flex-direction: column;
+    width: 100%;
+    height: 100%;
 }
 
 ._tab-button-group_vitro-tab-button-group_18mZ_Ds {

package/dist/index.js

@@ -505,54 +505,65 @@ var Item = function Item(props) {
   }));
 };
 
+var ATTRIBUTE = function ATTRIBUTE() {};
+ATTRIBUTE.STYLE = 'style';
+ATTRIBUTE.CLASS = 'class';
+
+var DISPLAY = function DISPLAY() {};
+DISPLAY.NONE = 'none';
+
 var styles$1 = {"vitro-scrollbar-content":"_scrollbar_vitro-scrollbar-content_3HXSt5u"};
 
+var CSS_CLASS_SCROLL_Y = 'ps-scroll-y';
 var w = window;
 var ScrollBar = function ScrollBar(props) {
-  var _useState = React.useState(null),
-    element = _useState[0],
-    setElement = _useState[1];
   var ref = React.useRef(null);
+  var scrollElementRef = React.useRef(null);
   var observerRef = React.useRef();
   React.useEffect(function () {
-    var checkRendered = function checkRendered() {
-      var _ref$current;
-      if ((_ref$current = ref.current) !== null && _ref$current !== void 0 && _ref$current.offsetHeight && observerRef.current) {
-        ref.current.scrollTop = 3;
-        ref.current.scrollLeft = 3;
-        ref.current.scrollTop = 0;
-        ref.current.scrollLeft = 0;
-        observerRef.current.disconnect();
-      }
-    };
-    observerRef.current = new MutationObserver(function () {
-      return setTimeout(checkRendered, 50);
-    });
-    checkRendered();
-    if (ref.current) {
-      observerRef.current.observe(ref.current, {
-        childList: true,
-        subtree: true,
-        attributes: true
-      });
-    }
     return function () {
       if (observerRef.current) {
         observerRef.current.disconnect();
       }
     };
   }, []);
+  var isDisplayNone = function isDisplayNone(element) {
+    var style = window.getComputedStyle(element);
+    return style.display === DISPLAY.NONE;
+  };
+  var update = function update() {
+    if (scrollElementRef.current) {
+      if (ref.current && !isDisplayNone(ref.current.parentElement) && observerRef.current) {
+        scrollElementRef.current.update();
+        observerRef.current.disconnect();
+      }
+    }
+  };
+  var addObserver = function addObserver() {
+    if (ref.current && isDisplayNone(ref.current.parentElement)) {
+      var _ref$current;
+      if ((_ref$current = ref.current) !== null && _ref$current !== void 0 && _ref$current.parentElement) {
+        observerRef.current = new MutationObserver(function () {
+          return setTimeout(update, 50);
+        });
+        observerRef.current.observe(ref.current.parentElement, {
+          attributes: true,
+          attributeFilter: [ATTRIBUTE.STYLE, ATTRIBUTE.CLASS]
+        });
+      }
+    }
+  };
   React.useEffect(function () {
     if (ref.current) {
-      ref.current.addEventListener('ps-scroll-y', onScrollY);
+      ref.current.addEventListener(CSS_CLASS_SCROLL_Y, onScrollY);
       init();
     }
     return function () {
-      if (element) {
-        element.destroy();
+      if (scrollElementRef.current) {
+        scrollElementRef.current.destroy();
       }
       if (ref.current) {
-        ref.current.removeEventListener('ps-scroll-y', onScrollY);
+        ref.current.removeEventListener(CSS_CLASS_SCROLL_Y, onScrollY);
       }
     };
   }, []);
@@ -561,7 +572,7 @@ var ScrollBar = function ScrollBar(props) {
       var scrollElement = new w.PerfectScrollbar(ref.current, {
         suppressScrollX: props.isHideScrollX
       });
-      setElement(scrollElement);
+      scrollElementRef.current = scrollElement;
       if (w.addResizeListener && ref.current) {
         w.addResizeListener(ref.current.firstChild, function () {
           return scrollElement.update();
@@ -571,11 +582,12 @@ var ScrollBar = function ScrollBar(props) {
         props.onInit(ref.current);
       }
       if (props.isFocusOnScroll && ref.current) {
-        ref.current.addEventListener('ps-scroll-y', function () {
+        ref.current.addEventListener(CSS_CLASS_SCROLL_Y, function () {
           var _ref$current2;
           return (_ref$current2 = ref.current) === null || _ref$current2 === void 0 ? void 0 : _ref$current2.click();
         });
       }
+      addObserver();
     }
   };
   var onWheel = function onWheel(e) {
@@ -593,7 +605,7 @@ var ScrollBar = function ScrollBar(props) {
     ref: props.contentRef,
     onWheel: onWheel,
     className: styles$1['vitro-scrollbar-content'] + (props.contentClassName ? CTRL.SPACE + props.contentClassName : CTRL.EMPTY)
-  }, element && props.children));
+  }, props.children));
 };
 
 (function (EVENT) {
@@ -21440,7 +21452,7 @@ var CELL_TYPE;
   CELL_TYPE["LIST"] = "List";
   CELL_TYPE["BOOL"] = "Bool";
 })(CELL_TYPE || (CELL_TYPE = {}));
-var ATTRIBUTE;
+var ATTRIBUTE$1;
 (function (ATTRIBUTE) {
   ATTRIBUTE["BUTTON"] = "Button";
   ATTRIBUTE["BUTTON_CLASS"] = "ButtonClass";
@@ -21463,7 +21475,7 @@ var ATTRIBUTE;
   ATTRIBUTE["ADDED"] = "Added";
   ATTRIBUTE["FORMULA"] = "Formula";
   ATTRIBUTE["FORMAT"] = "Format";
-})(ATTRIBUTE || (ATTRIBUTE = {}));
+})(ATTRIBUTE$1 || (ATTRIBUTE$1 = {}));
 var DRAG_ITEM_TYPE;
 (function (DRAG_ITEM_TYPE) {
   DRAG_ITEM_TYPE[DRAG_ITEM_TYPE["CANNOT_DROP"] = 0] = "CANNOT_DROP";
@@ -21633,7 +21645,7 @@ var TableViewConstants = {
     get COLUMN () { return COLUMN; },
     get ROW_TYPE () { return ROW_TYPE; },
     get CELL_TYPE () { return CELL_TYPE; },
-    get ATTRIBUTE () { return ATTRIBUTE; },
+    get ATTRIBUTE () { return ATTRIBUTE$1; },
     get DRAG_ITEM_TYPE () { return DRAG_ITEM_TYPE; },
     get FILTER_TYPE () { return FILTER_TYPE; },
     get REFRESH_MODE () { return REFRESH_MODE; },
@@ -21758,7 +21770,7 @@ var TableViewServiceImpl = /*#__PURE__*/function () {
     } else {
       var row = this.grid.GetRowById(id);
       if (!row) {
-        row = this.grid.GetRowById(id, ATTRIBUTE.ID, false);
+        row = this.grid.GetRowById(id, ATTRIBUTE$1.ID, false);
       }
       return row;
     }
@@ -22105,7 +22117,7 @@ var TableViewServiceImpl = /*#__PURE__*/function () {
     return data;
   };
   _proto.setVisibleColumnListXml = function setVisibleColumnListXml(data) {
-    var visibleColumnNameList = this.getCols(ATTRIBUTE.VISIBLE);
+    var visibleColumnNameList = this.getCols(ATTRIBUTE$1.VISIBLE);
     if (this.visibleColumnList && this.visibleColumnList.length) {
       visibleColumnNameList = visibleColumnNameList.concat(this.visibleColumnList);
     }
@@ -61126,7 +61138,7 @@ var ActionHandler = function ActionHandler(props) {
   }));
 };
 
-var styles$q = {"vitro-dropdown-button-container":"_dropdown-button_vitro-dropdown-button-container_zx8iZtY","vitro-dropdown-toggle":"_dropdown-button_vitro-dropdown-toggle_-Nj8qLe","vitro-dropdown-menu":"_dropdown-button_vitro-dropdown-menu_2B1Wr1Y","vitro-right":"_dropdown-button_vitro-right_gHoXO9n","vitro-dropdown-button-item":"_dropdown-button_vitro-dropdown-button-item_2XZNxoG","vitro-dropdown-button-dropdown-item":"_dropdown-button_vitro-dropdown-button-dropdown-item_3Nwnp_-","vitro-image-container":"_dropdown-button_vitro-image-container_3Kf-a2A","vitro-button-collapse-bottom":"_dropdown-button_vitro-button-collapse-bottom_Ivm3AkU","vitro-image":"_dropdown-button_vitro-image_3bX1quk","vitro-scrollbar":"_dropdown-button_vitro-scrollbar_2DCwQvu","vitro-dropdown-button-dropdown-item-menu":"_dropdown-button_vitro-dropdown-button-dropdown-item-menu_39eSYtN"};
+var styles$q = {"vitro-dropdown-button-container":"_dropdown-button_vitro-dropdown-button-container_zx8iZtY","vitro-dropdown-toggle":"_dropdown-button_vitro-dropdown-toggle_-Nj8qLe","vitro-dropdown-menu":"_dropdown-button_vitro-dropdown-menu_2B1Wr1Y","vitro-right":"_dropdown-button_vitro-right_gHoXO9n","vitro-dropdown-button-item":"_dropdown-button_vitro-dropdown-button-item_2XZNxoG","vitro-dropdown-button-dropdown-item":"_dropdown-button_vitro-dropdown-button-dropdown-item_3Nwnp_-","vitro-image-container":"_dropdown-button_vitro-image-container_3Kf-a2A","vitro-button-collapse-bottom":"_dropdown-button_vitro-button-collapse-bottom_Ivm3AkU","vitro-image":"_dropdown-button_vitro-image_3bX1quk","vitro-scrollbar":"_dropdown-button_vitro-scrollbar_2DCwQvu","vitro-separator":"_dropdown-button_vitro-separator_3UJOlCk","vitro-dropdown-button-dropdown-item-menu":"_dropdown-button_vitro-dropdown-button-dropdown-item-menu_39eSYtN"};
 
 var DropdownButtonItem = function DropdownButtonItem(props) {
   var onClick = function onClick(e) {
@@ -61144,8 +61156,7 @@ var DropdownButtonItem = function DropdownButtonItem(props) {
   return React__default.createElement(reactstrap.DropdownItem, {
     onClick: onClick,
     toggle: props.isToggle === false ? false : true,
-    divider: props.isShowSeparator,
-    className: styles$q['vitro-dropdown-button-item']
+    className: styles$q['vitro-dropdown-button-item'] + (props.isShowSeparator ? CTRL.SPACE + styles$q['vitro-separator'] : CTRL.EMPTY)
   }, (props.isShowImage || props.imageUrl) && React__default.createElement("div", {
     className: styles$q['vitro-image-container']
   }, props.imageUrl && React__default.createElement(Image, {
@@ -67012,7 +67023,7 @@ var Viewer = function Viewer(props) {
 };
 
 var name = "@vitrosoftware/common-ui-ts";
-var version$1 = "1.1.213";
+var version$1 = "1.1.214";
 var description = "vitro software common ui ts";
 var author = "";
 var license = "MIT";