@vitrosoftware/common-ui-ts 1.1.212 → 1.1.213

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

@@ -21,6 +21,10 @@
     padding: 0 16px;
 }
 
+.vitro-dropdown-toggle:focus-visible {
+    box-shadow: none;
+}
+
 .vitro-dropdown-menu :global(.ps__rail-y) {
     border: none;
 }

package/css/std/controls/dxf-viewer/dxf-viewer-index.css

@@ -13739,10 +13739,10 @@ select {
     top: 48px;
     background-color: #fff;
     height: calc(100% - 48px);
-    border-left: 2px solid #eeeff0;
     display: none;
     z-index: 10;
     border-left: 1px solid #C0CAD5;
+    border-right: 1px solid transparent;
     box-shadow: 0 0 2.89px 0 rgba(0, 0, 0, 0.1), 0 0 7.22px 0 rgba(0, 0, 0, 0.08);
 }
 
@@ -14051,6 +14051,7 @@ select {
 }
 .vitro-panel {
     max-width: 40%;
+    box-sizing: border-box;
 }
 
 .vitro-resizer {

package/css/std/controls/dxf-viewer/dxf-viewer.css

@@ -166,10 +166,10 @@
     top: 48px;
     background-color: #fff;
     height: calc(100% - 48px);
-    border-left: 2px solid #eeeff0;
     display: none;
     z-index: 10;
     border-left: 1px solid #C0CAD5;
+    border-right: 1px solid transparent;
     box-shadow: 0 0 2.89px 0 rgba(0, 0, 0, 0.1), 0 0 7.22px 0 rgba(0, 0, 0, 0.08);
 }
 

package/css/std/controls/dxf-viewer/panel.css

@@ -1,5 +1,6 @@
 .vitro-panel {
     max-width: 40%;
+    box-sizing: border-box;
 }
 
 .vitro-resizer {

package/css/std/controls/search/search-dialog.css

@@ -110,22 +110,6 @@
     margin-top: auto;
 }
 
-.vitro-button,
-.vitro-button-cancel {
-    padding: 8px 16px;
-    font-family: 'InterRegular' !important;
-}
-
-.vitro-button-cancel {
-    background: #fff !important;
-    color: #222D44 !important;
-}
-
-.vitro-button-cancel:hover,
-.vitro-button-cancel:active {
-    background: #F3F8FF !important;
-}
-
 .vitro-settings-dialog-mobile {
     height: 100% !important;
     width: 100% !important;

package/dist/index.css

@@ -2276,6 +2276,10 @@ div._component-loader_vitro-component-loader_3J3a2or {
     padding: 0 16px;
 }
 
+._dropdown-button_vitro-dropdown-toggle_-Nj8qLe:focus-visible {
+    box-shadow: none;
+}
+
 ._dropdown-button_vitro-dropdown-menu_2B1Wr1Y .ps__rail-y {
     border: none;
 }
@@ -3552,22 +3556,6 @@ div._component-loader_vitro-component-loader_3J3a2or {
     margin-top: auto;
 }
 
-._search-dialog_vitro-button_2SQAGBl,
-._search-dialog_vitro-button-cancel_iBZogBR {
-    padding: 8px 16px;
-    font-family: 'InterRegular' !important;
-}
-
-._search-dialog_vitro-button-cancel_iBZogBR {
-    background: #fff !important;
-    color: #222D44 !important;
-}
-
-._search-dialog_vitro-button-cancel_iBZogBR:hover,
-._search-dialog_vitro-button-cancel_iBZogBR:active {
-    background: #F3F8FF !important;
-}
-
 ._search-dialog_vitro-settings-dialog-mobile_1vwSHz5 {
     height: 100% !important;
     width: 100% !important;
@@ -7707,12 +7695,6 @@ div._component-loader_vitro-component-loader_3J3a2or {
     background: #F7F9FC;
 }
 
-._header_vitro-header_ta9aLJn {
-    position: relative;
-    width: 100%;
-    background-color: #F7F9FC;
-}
-
 ._header-nav-bar-sidebar-button_vitro-nav-bar-sidebar-button_3IZcIOc {
     height: 24px;
     width: 24px;
@@ -7750,6 +7732,12 @@ div._component-loader_vitro-component-loader_3J3a2or {
         min-height: 56px;
     }
 }
+._header_vitro-header_ta9aLJn {
+    position: relative;
+    width: 100%;
+    background-color: #F7F9FC;
+}
+
 ._header-nav-service_vitro-nav-service_1-i4GOh {
     height: 34px;
     padding: 0 16px;

package/dist/index.js

@@ -61131,7 +61131,7 @@ var styles$q = {"vitro-dropdown-button-container":"_dropdown-button_vitro-dropdo
 var DropdownButtonItem = function DropdownButtonItem(props) {
   var onClick = function onClick(e) {
     if (props.onClick) {
-      props.onClick(e);
+      props.onClick(props.value, e);
     } else if (props.href) {
       var event = new CustomEvent(exports.EVENT.HISTORY_UPDATE, {
         detail: {
@@ -62798,7 +62798,7 @@ var List = React.forwardRef(function (props, ref) {
   }));
 });
 
-var styles$H = {"vitro-settings-dialog":"_search-dialog_vitro-settings-dialog_33Qiusl","vitro-settings-dialog-mobile":"_search-dialog_vitro-settings-dialog-mobile_1vwSHz5","vitro-filter-container":"_search-dialog_vitro-filter-container_MNoN_7M","vitro-filter":"_search-dialog_vitro-filter_3K68vOp","vitro-field-iterator":"_search-dialog_vitro-field-iterator_3R98th9","vitro-add-field":"_search-dialog_vitro-add-field_2PfsCO8","vitro-add-field-button":"_search-dialog_vitro-add-field-button_22vr5DQ","vitro-add-field-dialog":"_search-dialog_vitro-add-field-dialog_2EdLwVO","vitro-button-group":"_search-dialog_vitro-button-group_3Uxi9An","vitro-button":"_search-dialog_vitro-button_2SQAGBl","vitro-button-cancel":"_search-dialog_vitro-button-cancel_iBZogBR","vitro-settings-dialog-header":"_search-dialog_vitro-settings-dialog-header_2CYAOiA","vitro-settings-dialog-footer":"_search-dialog_vitro-settings-dialog-footer_2H_8ImR","vitro-scrollbar":"_search-dialog_vitro-scrollbar_241tkXw"};
+var styles$H = {"vitro-settings-dialog":"_search-dialog_vitro-settings-dialog_33Qiusl","vitro-settings-dialog-mobile":"_search-dialog_vitro-settings-dialog-mobile_1vwSHz5","vitro-filter-container":"_search-dialog_vitro-filter-container_MNoN_7M","vitro-filter":"_search-dialog_vitro-filter_3K68vOp","vitro-field-iterator":"_search-dialog_vitro-field-iterator_3R98th9","vitro-add-field":"_search-dialog_vitro-add-field_2PfsCO8","vitro-add-field-button":"_search-dialog_vitro-add-field-button_22vr5DQ","vitro-add-field-dialog":"_search-dialog_vitro-add-field-dialog_2EdLwVO","vitro-button-group":"_search-dialog_vitro-button-group_3Uxi9An","vitro-settings-dialog-header":"_search-dialog_vitro-settings-dialog-header_2CYAOiA","vitro-settings-dialog-footer":"_search-dialog_vitro-settings-dialog-footer_2H_8ImR","vitro-scrollbar":"_search-dialog_vitro-scrollbar_241tkXw"};
 
 var AddFieldButton = React.forwardRef(function (props, ref) {
   var _props$filterContaine;
@@ -66444,8 +66444,6 @@ var LOCALE$8;
 
 var CSS_CLASS_FILTER_CONTAINER$1 = 'vitro-filter-container';
 var CSS_CLASS_BUTTON_GROUP = 'vitro-button-group';
-var CSS_CLASS_BUTTON_CANCEL = 'vitro-button-cancel';
-var CSS_CLASS_BUTTON = 'vitro-button';
 var CSS_CLASS_SETTINGS_DIALOG_MOBILE = 'vitro-settings-dialog-mobile';
 var CSS_CLASS_SETTINGS_DIALOG_HEADER = 'vitro-settings-dialog-header';
 var CSS_CLASS_SETTINGS_DIALOG_FOOTER = 'vitro-settings-dialog-footer';
@@ -66484,14 +66482,13 @@ var SearchDialog = function SearchDialog(props) {
     feature: props.feature
   }), !props.isMobileView && React__default.createElement(ButtonGroup, {
     className: styles$H[CSS_CLASS_BUTTON_GROUP]
-  }, React__default.createElement(Button$2, {
+  }, React__default.createElement(ButtonCancel, {
     text: getSearchLabel(ACTION$2.CANCEL),
-    onClick: props.onCancel,
-    className: styles$H[CSS_CLASS_BUTTON_CANCEL]
+    onClick: props.onCancel
   }), React__default.createElement(Button$2, {
     text: getSearchLabel(ACTION$2.SEARCH),
     onClick: props.onSearch,
-    className: styles$H[CSS_CLASS_BUTTON]
+    className: STYLE.PRIMARY
   }))));
   return React__default.createElement(React__default.Fragment, null, props.isShowDialog && (props.isMobileView ? React__default.createElement(Dialog, {
     title: props.title || CTRL.EMPTY,
@@ -66556,6 +66553,7 @@ var Search = function Search(props) {
   }, []);
   var onViewChanged = React.useCallback(function () {
     setSearchCriterionList([]);
+    setSendedSearchCriterionList([]);
   }, []);
   React.useEffect(function () {
     eventService.register({
@@ -67014,7 +67012,7 @@ var Viewer = function Viewer(props) {
 };
 
 var name = "@vitrosoftware/common-ui-ts";
-var version$1 = "1.1.212";
+var version$1 = "1.1.213";
 var description = "vitro software common ui ts";
 var author = "";
 var license = "MIT";
@@ -83432,6 +83430,7 @@ var SplitterConstants = {
 
 var Splitter = function Splitter(props) {
   var ref = React.useRef();
+  var localStorageService = inversifyReact.useInjection(SERVICE.LOCAL_STORAGE);
   var resizeObserver = new window.ResizeObserver(function (entries) {
     for (var _iterator = _createForOfIteratorHelperLoose(entries), _step; !(_step = _iterator()).done;) {
       var entry = _step.value;
@@ -83459,17 +83458,45 @@ var Splitter = function Splitter(props) {
     }
     return value;
   };
+  var getPaneWidthFromLocalSorage = function getPaneWidthFromLocalSorage() {
+    return props.localStorageKey ? localStorageService.getItem(props.localStorageKey) : undefined;
+  };
+  var setPaneWidthToLocalSorage = function setPaneWidthToLocalSorage(width) {
+    if (props.localStorageKey) {
+      localStorageService.setItem(props.localStorageKey, width);
+    }
+  };
+  var getWidthPercent = function getWidthPercent(paneWidth, wrapperWidth) {
+    var width = wrapperWidth ? Math.round(paneWidth * 100 / wrapperWidth * 100) / 100 : 0;
+    return wrapperWidth ? getWidth(width) : getWidth(0);
+  };
+  var onDragFinished = function onDragFinished() {
+    if (props.localStorageKey) {
+      var paneWidth = ref.current.state.primaryPane;
+      var wrapperWidth = ref.current.paneWrapper.clientWidth;
+      var width = props.isWidthPx ? paneWidth : getWidthPercent(paneWidth, wrapperWidth);
+      setPaneWidthToLocalSorage(width);
+    }
+    if (props.onDragFinished) {
+      props.onDragFinished();
+    }
+  };
+  var getPrimaryPaneWidth = function getPrimaryPaneWidth() {
+    var localStorageWidth = getPaneWidthFromLocalSorage();
+    var primaryPaneWidth = localStorageWidth ? localStorageWidth : getWidth(props.width ? props.width : WIDTH.DEFAULT);
+    return primaryPaneWidth;
+  };
   return React__default.createElement(ReactSplitter, {
     ref: ref,
     position: props.position || POSITION$1.VERTICAL,
     primaryPaneMaxWidth: getWidth(props.maxWidth ? props.maxWidth : WIDTH.DEFAULT_MAX),
     primaryPaneMinWidth: getWidth(props.minWidth ? props.minWidth : WIDTH.DEFAULT_MIN),
-    primaryPaneWidth: getWidth(props.width ? props.width : WIDTH.DEFAULT),
+    primaryPaneWidth: getPrimaryPaneWidth(),
     postPoned: props.isPostPoned,
     maximizedPrimaryPane: props.isMaximizedPrimaryPane,
     minimalizedPrimaryPane: props.isMinimalizedPrimaryPane,
     dispatchResize: props.isDispatchResize,
-    onDragFinished: props.onDragFinished,
+    onDragFinished: onDragFinished,
     className: props.className
   }, props.children);
 };
@@ -83810,6 +83837,25 @@ var PageLayout = function PageLayout(props) {
   }, props.children);
 };
 
+var styles$1x = {"vitro-nav-bar-sidebar-button":"_header-nav-bar-sidebar-button_vitro-nav-bar-sidebar-button_3IZcIOc"};
+
+var SidebarButton = function SidebarButton(props) {
+  return React__default.createElement("button", {
+    className: styles$1x['vitro-nav-bar-sidebar-button'],
+    onClick: props.onClick
+  });
+};
+
+var styles$1y = {"vitro-nav-bar":"_header-nav-bar_vitro-nav-bar_EuyFIk8"};
+
+var HeaderNavBar = function HeaderNavBar(props) {
+  return React__default.createElement("nav", {
+    className: styles$1y['vitro-nav-bar'] + CTRL.SPACE + ['navbar', 'navbar-expand-lg', 'navbar-light'].join(CTRL.SPACE)
+  }, React__default.createElement(SidebarButton, {
+    onClick: props.onChangeSidebarMode
+  }), props.children);
+};
+
 var LOCAL_STORAGE_KEY;
 (function (LOCAL_STORAGE_KEY) {
   LOCAL_STORAGE_KEY["SIDEBAR_MODE"] = "app.common.sidebar.mode";
@@ -83820,72 +83866,44 @@ var HeaderConstants = {
     get LOCAL_STORAGE_KEY () { return LOCAL_STORAGE_KEY; }
 };
 
-var styles$1x = {"vitro-header":"_header_vitro-header_ta9aLJn"};
+var styles$1z = {"vitro-header":"_header_vitro-header_ta9aLJn"};
 
 var onChangeSidebarMode = function onChangeSidebarMode() {};
 var Header = function Header(props) {
+  var _useState = React.useState(),
+    sidebar = _useState[0],
+    setSidebar = _useState[1];
   var ref = React.useRef(null);
   var localStorageService = inversifyReact.useInjection(SERVICE.LOCAL_STORAGE);
   var allowedSidebarFullMode = props.cfgSidebar && props.cfgSidebar.overflowItemList && props.cfgSidebar.overflowItemList.length > 0;
-  var mobileView = function mobileView() {
-    return window.innerWidth <= exports.MOBILE_VIEW.WIDTH;
-  };
+  React.useEffect(function () {
+    if (sidebar === undefined) {
+      var sidebarMode = localStorageService.getItem(LOCAL_STORAGE_KEY.SIDEBAR_MODE);
+      onChange(parseInt(sidebarMode) >= MODE.TOGGLED_PINNED ? parseInt(sidebarMode) : MODE.TOGGLED_PINNED);
+    } else {
+      onChange(sidebar);
+    }
+  }, []);
   onChangeSidebarMode = function onChangeSidebarMode() {
-    var newMode = props.sidebar < MODE.PINNED ? props.sidebar + MODE.TOGGLED_HOVERED : MODE.TOGGLED_PINNED;
+    var oldMode = sidebar != null ? sidebar : MODE.TOGGLED_PINNED;
+    var newMode = oldMode < MODE.PINNED ? oldMode + MODE.TOGGLED_HOVERED : MODE.TOGGLED_PINNED;
     if (!allowedSidebarFullMode && newMode === MODE.TOGGLED_HOVERED) {
       newMode = MODE.PINNED;
     }
-    props.setSidebar(newMode);
+    onChange(newMode);
   };
-  var setSidebarMode = function setSidebarMode() {
-    var sidebar = window.document.getElementById('vitro-sidebar');
-    if (sidebar && ref && ref.current) {
-      sidebar.style.paddingTop = ref.current.clientHeight + UNIT.PX;
-    }
-    if (mobileView() && props.sidebar === MODE.TOGGLED_PINNED) {
-      props.setSidebar(MODE.PINNED);
-    }
+  var onChange = function onChange(mode) {
+    setSidebar(mode);
+    localStorageService.setItem(LOCAL_STORAGE_KEY.SIDEBAR_MODE, mode);
+    props.onChangeSidebar(mode);
   };
-  React.useEffect(function () {
-    setSidebarMode();
-    if (window.addResizeListener) {
-      window.addResizeListener(ref.current, function () {
-        setSidebarMode();
-      });
-    }
-  }, [ref.current]);
-  React.useEffect(function () {
-    if (props.sidebar >= 0 && props.sidebar !== null) {
-      localStorageService.setItem(LOCAL_STORAGE_KEY.SIDEBAR_MODE, props.sidebar);
-    } else {
-      var sidebarMode = localStorageService.getItem(LOCAL_STORAGE_KEY.SIDEBAR_MODE);
-      props.setSidebar(parseInt(sidebarMode) >= MODE.TOGGLED_PINNED ? parseInt(sidebarMode) : MODE.TOGGLED_PINNED);
-    }
-  }, [props.sidebar]);
   return React__default.createElement("div", {
-    className: styles$1x['vitro-header'],
+    className: styles$1z['vitro-header'],
     id: 'vitro-header',
     ref: ref
-  }, props.children);
-};
-
-var styles$1y = {"vitro-nav-bar-sidebar-button":"_header-nav-bar-sidebar-button_vitro-nav-bar-sidebar-button_3IZcIOc"};
-
-var SidebarButton = function SidebarButton(props) {
-  return React__default.createElement("button", {
-    className: styles$1y['vitro-nav-bar-sidebar-button'],
-    onClick: props.onClick
-  });
-};
-
-var styles$1z = {"vitro-nav-bar":"_header-nav-bar_vitro-nav-bar_EuyFIk8"};
-
-var HeaderNavBar = function HeaderNavBar(props) {
-  return React__default.createElement("nav", {
-    className: styles$1z['vitro-nav-bar'] + CTRL.SPACE + ['navbar', 'navbar-expand-lg', 'navbar-light'].join(CTRL.SPACE)
-  }, React__default.createElement(SidebarButton, {
-    onClick: onChangeSidebarMode
-  }), props.children);
+  }, React__default.createElement(HeaderNavBar, {
+    onChangeSidebarMode: onChangeSidebarMode
+  }, props.children));
 };
 
 var styles$1A = {"vitro-nav-service":"_header-nav-service_vitro-nav-service_1-i4GOh"};
@@ -85037,6 +85055,7 @@ var EditableList = function EditableList(props) {
   }, [props.activeItemId]);
   React.useEffect(function () {
     changedFieldValueMap.clear();
+    setActiveDropdownItemId(undefined);
   }, [props.itemList]);
   var onClick = function onClick(item, isTargetDropDownBtn) {
     if (!props.isMobileView || !isTargetDropDownBtn) {