@vitrosoftware/common-ui-ts 1.1.83 → 1.1.85

package/css/{common.css → std/common.css}

@@ -1,14 +1,4 @@
 @import url('@vitrosoftware/common-ui-ts/css/third-party/kendo/kendo.css');
-@import url('@vitrosoftware/common-ui-ts/css/third-party/perfect-scrollbar/perfect-scrollbar.css');
-@import url('@vitrosoftware/common-ui-ts/css/third-party/jstree/style.min.css');
-@import url('@vitrosoftware/common-ui-ts/css/third-party/jquery-ui/jquery-ui.min.css');
-@import url('@vitrosoftware/common-ui-ts/css/third-party/jquery-ui/jquery-ui.structure.css');
-@import url('@vitrosoftware/common-ui-ts/css/third-party/jquery-ui/jquery-ui.theme.min.css');
-@import url('@vitrosoftware/common-ui-ts/css/third-party/jquery-contextMenu/jquery.contextMenu.min.css');
-@import url('@vitrosoftware/common-ui-ts/css/third-party/jquery-svg/jquery.svg.css');
-@import url('@vitrosoftware/common-ui-ts/css/third-party/sweetalert2/sweetalert2.css');
-@import url('@vitrosoftware/common-ui-ts/css/third-party/jquery-growl/jquery.growl.css');
-@import url('@vitrosoftware/common-ui-ts/css/third-party/uikit/uikit.css');
 
 html, body {
     overscroll-behavior-x: none;

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

@@ -1045,6 +1045,12 @@ a.ui-button:active,
     margin-right: 0;
 }
 
+@import url('@vitrosoftware/common-ui-ts/css/third-party/jquery-ui/jquery-ui.min.css');
+@import url('@vitrosoftware/common-ui-ts/css/third-party/jquery-ui/jquery-ui.structure.css');
+@import url('@vitrosoftware/common-ui-ts/css/third-party/jquery-ui/jquery-ui.theme.min.css');
+@import url('@vitrosoftware/common-ui-ts/css/third-party/jquery-growl/jquery.growl.css');
+@import url('@vitrosoftware/common-ui-ts/css/third-party/uikit/uikit.css');
+
 .vitro-bim-viewer-issue-detail {
     position: absolute;
     bottom: 0px;

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

@@ -1,3 +1,9 @@
+@import url('@vitrosoftware/common-ui-ts/css/third-party/jquery-ui/jquery-ui.min.css');
+@import url('@vitrosoftware/common-ui-ts/css/third-party/jquery-ui/jquery-ui.structure.css');
+@import url('@vitrosoftware/common-ui-ts/css/third-party/jquery-ui/jquery-ui.theme.min.css');
+@import url('@vitrosoftware/common-ui-ts/css/third-party/jquery-growl/jquery.growl.css');
+@import url('@vitrosoftware/common-ui-ts/css/third-party/uikit/uikit.css');
+
 .vitro-bim-viewer-issue-detail {
     position: absolute;
     bottom: 0px;

package/css/std/controls/file-version-select/file-version-select.css

@@ -13,6 +13,7 @@
     overflow: hidden;
     min-width: 0;
     align-items: center;
+    cursor: pointer;
 }
 
 .vitro-file-name {
@@ -94,6 +95,16 @@
     background-image: url("data:image/svg+xml,%3Csvg width='44' height='42' viewBox='0 0 44 42' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg filter='url(%23filter0_dd_778_105705)'%3E%3Cpath d='M20.3117 11.6584C21.0973 10.4213 22.9027 10.4213 23.6883 11.6584L29.5752 20.9278C30.4208 22.2593 29.4642 24 27.8869 24H16.1131C14.5358 24 13.5792 22.2593 14.4248 20.9278L20.3117 11.6584Z' fill='white'/%3E%3C/g%3E%3Cdefs%3E%3Cfilter id='filter0_dd_778_105705' x='0.109375' y='0.730469' width='43.7812' height='41.2695' filterUnits='userSpaceOnUse' color-interpolation-filters='sRGB'%3E%3CfeFlood flood-opacity='0' result='BackgroundImageFix'/%3E%3CfeColorMatrix in='SourceAlpha' type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0' result='hardAlpha'/%3E%3CfeOffset dy='4'/%3E%3CfeGaussianBlur stdDeviation='7'/%3E%3CfeComposite in2='hardAlpha' operator='out'/%3E%3CfeColorMatrix type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.18 0'/%3E%3CfeBlend mode='normal' in2='BackgroundImageFix' result='effect1_dropShadow_778_105705'/%3E%3CfeColorMatrix in='SourceAlpha' type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0' result='hardAlpha'/%3E%3CfeOffset/%3E%3CfeGaussianBlur stdDeviation='2'/%3E%3CfeComposite in2='hardAlpha' operator='out'/%3E%3CfeColorMatrix type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.14 0'/%3E%3CfeBlend mode='normal' in2='effect1_dropShadow_778_105705' result='effect2_dropShadow_778_105705'/%3E%3CfeBlend mode='normal' in='SourceGraphic' in2='effect2_dropShadow_778_105705' result='shape'/%3E%3C/filter%3E%3C/defs%3E%3C/svg%3E%0A");
 }
 
+.vitro-version-list :global(.ps) {
+    max-height: 364px;
+    border-radius: 4px;
+}
+
+.vitro-version-list :global(.ps__rail-y) {
+    border: none;
+    background-color: transparent !important;
+}
+
 .vitro-file-version-item {
     padding: 8px 12px;
     display: flex;

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

@@ -4561,6 +4561,13 @@ html[dir="ltr"] .treeItemToggler::before {
   color: rgba(0, 0, 0, 1);
 }
 
+@import url('@vitrosoftware/common-ui-ts/css/third-party/jquery-ui/jquery-ui.min.css');
+@import url('@vitrosoftware/common-ui-ts/css/third-party/jquery-ui/jquery-ui.structure.css');
+@import url('@vitrosoftware/common-ui-ts/css/third-party/jquery-ui/jquery-ui.theme.min.css');
+@import url('@vitrosoftware/common-ui-ts/css/third-party/jquery-contextMenu/jquery.contextMenu.min.css');
+@import url('@vitrosoftware/common-ui-ts/css/third-party/jquery-svg/jquery.svg.css');
+@import url('@vitrosoftware/common-ui-ts/css/third-party/sweetalert2/sweetalert2.css');
+
 html[dir='ltr'] body {
     background-color: #F5F6FA;
 }
@@ -4920,8 +4927,7 @@ a:focus > .thumbnail > .thumbnailSelectionRing,
     user-select: none;
 }
 
-.select::after {
-    content: '';
+.select > span {
     display: block;
     background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M19.5 9L12 16.5L4.5 9' stroke='%234A556C' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
     width: 24px;
@@ -4932,9 +4938,10 @@ a:focus > .thumbnail > .thumbnailSelectionRing,
     background-size: 100%;
     background-position: center;
     background-repeat: no-repeat;
+    cursor: pointer;
 }
 
-.select.active::after {
+.select.active > span {
     transform: rotate(-180deg);
     background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M19.5 9L12 16.5L4.5 9' stroke='%233274E0' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
 }

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

@@ -1,3 +1,10 @@
+@import url('@vitrosoftware/common-ui-ts/css/third-party/jquery-ui/jquery-ui.min.css');
+@import url('@vitrosoftware/common-ui-ts/css/third-party/jquery-ui/jquery-ui.structure.css');
+@import url('@vitrosoftware/common-ui-ts/css/third-party/jquery-ui/jquery-ui.theme.min.css');
+@import url('@vitrosoftware/common-ui-ts/css/third-party/jquery-contextMenu/jquery.contextMenu.min.css');
+@import url('@vitrosoftware/common-ui-ts/css/third-party/jquery-svg/jquery.svg.css');
+@import url('@vitrosoftware/common-ui-ts/css/third-party/sweetalert2/sweetalert2.css');
+
 html[dir='ltr'] body {
     background-color: #F5F6FA;
 }
@@ -357,8 +364,7 @@ a:focus > .thumbnail > .thumbnailSelectionRing,
     user-select: none;
 }
 
-.select::after {
-    content: '';
+.select > span {
     display: block;
     background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M19.5 9L12 16.5L4.5 9' stroke='%234A556C' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
     width: 24px;
@@ -369,9 +375,10 @@ a:focus > .thumbnail > .thumbnailSelectionRing,
     background-size: 100%;
     background-position: center;
     background-repeat: no-repeat;
+    cursor: pointer;
 }
 
-.select.active::after {
+.select.active > span {
     transform: rotate(-180deg);
     background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M19.5 9L12 16.5L4.5 9' stroke='%233274E0' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
 }

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

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

package/css/std/controls/sidebar/sidebar-item.css

@@ -1,28 +1,68 @@
-.vitro-icon-text {
-    display: none;
-    color: #222D44;
-    font-size: 14px;
-    margin-left: 16px;
+.vitro-item {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    margin-bottom: 8px;
 }
 
-:global(.toggled.pinned) .vitro-icon-text {
-    display: inline-block;
+.vitro-icon {
+    width: 24px;
+    height: 24px;
+    flex-shrink: 0;
+    margin-right: 16px;
+}
+
+.vitro-item button,
+.vitro-item a {
+    text-decoration: none;
+    outline: none;
+    border: none;
+    background-color: transparent;
+    height: 40px;
+    width: 100%;
+    border-radius: 8px;
+    padding: 8px;
+    cursor: pointer;
+    display: flex;
+    align-items: center;
+}
+
+.vitro-item a > div,
+.vitro-item button > div {
+    display: flex;
+    width: fit-content;
+    align-items: center;
+    overflow: hidden;
+    flex-shrink: 0;
+}
+
+ul > li:last-child > ul > li:last-child .vitro-active {
+    background-color: transparent;
 }
 
 .vitro-item-text {
-    display: none;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
 }
 
-.vitro-active {
-    background-color: #DCEEFF;
+.vitro-icon-text {
+    text-align: center;
 }
 
-.vitro-hover .vitro-icon-text {
-    color: #326AD6;
+.vitro-icon-text,
+.vitro-item-text {
+    color: #222D44;
+    font-size: 14px;
 }
 
-ul > li:last-child > ul > li:last-child .vitro-active {
-    background-color: transparent;
+.vitro-active {
+    background-color: #DCEEFF !important;
+}
+
+.vitro-hover .vitro-icon-text,
+.vitro-hover .vitro-item-text {
+    color: #326AD6;
 }
 
 .vitro-active .vitro-icon-text,
@@ -32,46 +72,89 @@ ul > li:last-child > ul > li:last-child .vitro-active {
     font-family: 'InterMedium';
 }
 
-.vitro-icon {
-    width: 24px;
-    height: 24px;
+.vitro-group-item > button,
+.vitro-group-item > a {
+    display: flex;
+    align-items: center;
 }
 
-:global(.toggled.pinned) .vitro-item a {
-    width: 100%;
+
+.vitro-group-item > .vitro-item-list > .vitro-item:last-child {
+    margin-bottom: 0;
 }
 
-.vitro-item a > div {
+.vitro-group-item > .vitro-item-list > .vitro-item a,
+.vitro-group-item > .vitro-item-list > .vitro-item button {
     display: flex;
-    width: fit-content;
+    flex-direction: row;
     align-items: center;
+    padding-left: 24px;
 }
 
-.vitro-item a {
-    text-decoration: none;
-    height: 40px;
-    width: 40px;
-    border-radius: 8px;
-    padding: 8px;
+.vitro-group-item > .vitro-item-list > .vitro-item > a::before,
+.vitro-group-item > .vitro-item-list > .vitro-item > button::before {
+    content: '';
+    display: block;
+    flex-shrink: 0;
+    height: 24px;
+    width: 24px;
+    background-size: 100%;
+    background-position: center;
+    /* list-marker.svg URL-encoder for svg */
+    background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='12' cy='12' r='3' fill='%23222D44'/%3E%3C/svg%3E%0A");
+}
+
+.vitro-group-item > .vitro-item-list > .vitro-item > .vitro-active::before,
+.vitro-group-item > .vitro-item-list > .vitro-item > .vitro-hover::before {
+    /* list-marker-active.svg URL-encoder for svg */
+    background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='12' cy='12' r='3' fill='%23326AD6'/%3E%3C/svg%3E%0A");
+}
+
+.vitro-expanded,
+.vitro-collapsed {
     cursor: pointer;
-    margin-bottom: 8px;
     display: block;
+    flex-shrink: 0;
+    margin-left: auto;
+    width: 16px;
+    height: 16px;
+    background-size: 100%;
+    background-repeat: no-repeat;
+    background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13 6L8 11L3 6' stroke='%23222D44' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
+}
+
+.vitro-expanded {
+    transform: rotateX(180deg);
+}
+
+.vitro-active .vitro-expanded,
+.vitro-hover .vitro-expanded,
+.vitro-active .vitro-collapsed,
+.vitro-hover .vitro-collapsed {
+    content: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13 6L8 11L3 6' stroke='%23326AD6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
 }
 
+.vitro-display-none {
+    display: none;
+}
+
+:global(.vitro-bottom-menu) .vitro-icon-text,
 :global(.vitro-bottom-menu) .vitro-item-text {
     display: block;
     color: #4A556C;
     font-size: 12px;
     line-height: 12px;
     text-align: center;
+    overflow: visible;
+    white-space: normal;
 }
 
-:global(.vitro-bottom-menu) .vitro-icon-text {
-    display: none;
+:global(.vitro-bottom-menu) .vitro-icon {
+    margin-right: 0;
 }
 
 :global(.vitro-bottom-menu) .vitro-active {
-    background: transparent;
+    background: transparent !important;
     position: relative;
 }
 
@@ -86,17 +169,13 @@ ul > li:last-child > ul > li:last-child .vitro-active {
     bottom: -8px;
 }
 
-.vitro-active .vitro-item-text {
-    color: #4A556C;
-    font-family: 'InterRegular' !important;
-}
-
-.vitro-item {
-    display: flex;
-    justify-content: center;
+:global(.vitro-bottom-menu) .vitro-item {
+    margin-bottom: 0;
+    align-items: center;
 }
 
-:global(.vitro-bottom-menu) .vitro-item > a {
+:global(.vitro-bottom-menu) .vitro-item > a,
+:global(.vitro-bottom-menu) .vitro-item > button {
     background: transparent;
     position: relative;
     display: flex;
@@ -107,4 +186,99 @@ ul > li:last-child > ul > li:last-child .vitro-active {
     height: 100%;
     padding: 0;
     margin-bottom: 0;
+}
+
+.vitro-popup-container {
+    transform: translate3d(0px, 0, 0px) !important;
+    height: 100%;
+    width: 100%;
+    padding: 0 0 56px 0;
+    display: flex;
+    flex-direction: column;
+    background: rgba(34, 45, 68, 0.56);
+    z-index: 1;
+}
+
+.vitro-scrollbar {
+    max-height: 292px;
+}
+
+.vitro-scrollbar :global(.ps__rail-y) {
+    background: transparent !important;
+    border: none;
+}
+
+.vitro-scrollbar :global(.ps__thumb-y) {
+    width: 2px !important;
+    right: 3px !important;
+    background-color: #E4E6EC !important;
+}
+
+.vitro-scrollbar > div:first-child {
+    max-height: 292px;
+    height: fit-content;
+    padding: 0 24px;
+}
+
+.vitro-popup-item-list {
+    background: #F7F9FC;
+    width: 100%;
+    border-radius: 8px 8px 0 0;
+    padding: 0 0 4px 0;
+    margin: auto 0 0 0;
+}
+
+.vitro-popup-item-list .vitro-item {
+    margin-bottom: 8px;
+    width: 100% !important;
+}
+
+.vitro-popup-item-list .vitro-item > a,
+.vitro-popup-item-list .vitro-item > button {
+    background-color: #fff;
+    padding: 12px;
+    height: 48px;
+    border-radius: 8px;
+    width: 100%;
+    box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.25);
+    justify-content: flex-start;
+}
+
+.vitro-popup-item-list .vitro-item > a::before,
+.vitro-popup-item-list .vitro-item > button::before {
+    content: '';
+    display: block;
+    flex-shrink: 0;
+    height: 24px;
+    width: 24px;
+    margin-right: 8px;
+    background-size: 100%;
+    background-position: center;
+    /* list-marker.svg URL-encoder for svg */
+    background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='12' cy='12' r='3' fill='%23222D44'/%3E%3C/svg%3E%0A");
+}
+
+.vitro-popup-item-list .vitro-active {
+    background-color: #DCEEFF !important;
+}
+
+.vitro-popup-item-list .vitro-active .vitro-item-text {
+    font-family: 'InterRegular';
+}
+
+.vitro-popup-item-list .vitro-item-text {
+    font-size: 16px;
+    line-height: 24px;
+    color: #222D44;
+}
+
+.vitro-button-close {
+    background-color: #8E98A3;
+    width: 32px;
+    height: 4px;
+    display: block;
+    outline: none;
+    border: none;
+    border-radius: 2px;
+    margin: 12px auto;
 }

package/css/std/controls/sidebar/sidebar.css

@@ -9,7 +9,6 @@
     align-items: center;
     flex-direction: column;
     padding-top: 80px !important;
-    padding: 0 8px 6px 8px;
     top: 0;
 }
 
@@ -35,10 +34,6 @@
     justify-content: space-between;
 }
 
-.vitro-sidebar ul > li:last-child > ul > li:last-child a {
-    margin-bottom: 0;
-}
-
 .vitro-sidebar ul > li:last-child > ul > li:last-child a:hover {
     background-color: transparent;
 }
@@ -52,9 +47,25 @@
     font-weight: 400 !important;
 }
 
+.vitro-scrollbar :global(.ps__rail-y) {
+    background-color: transparent !important;
+    border: none;
+}
+
+.vitro-scrollbar > div:first-child {
+    padding: 0 8px;
+}
+
+.vitro-sidebar-section-list {
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+}
+
 :global(.vitro-bottom-menu) {
     width: 100%;
-    z-index: 1;
+    z-index: 2;
     flex-direction: row;
     height: 60px;
     padding: 0 21px !important;
@@ -63,6 +74,7 @@
     top: initial;
     box-shadow: 0px 4px 14px 0px rgba(0, 0, 0, 0.18), 0px 0px 4px 0px rgba(0, 0, 0, 0.14);
     border-radius: 4px 4px 0 0;
+    overflow: visible;
 }
 
 :global(.vitro-bottom-menu) ul {
@@ -74,7 +86,8 @@
 .vitro-scroll-container {
     height: 100%;
     flex: 0 1 auto;
-    overflow: hidden;
+    overflow-x: hidden;
+    overflow-y: visible;
     padding: 8px 0;
 }