@vitrosoftware/common-ui-ts 1.1.108 → 1.1.110

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

@@ -14199,4 +14199,348 @@ a.ui-button:active,
 
 #fileVersionSelect {
     top: calc(50% - 16px);
+}
+
+.compare-dlg-body,
+.compare-dlg-header,
+.compare-dlg-footer {
+    font-family: 'InterRegular';
+}
+
+.compare-dlg-wrap {
+    position: absolute;
+    z-index: 99000007;
+    width: 600px;
+    max-width: 100%;
+    background: #fff;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    font-family: 'InterRegular';
+    border-radius: 4px;
+    border: 1px solid rgba(74, 85, 108, 0.35);
+    user-select: none;
+    box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.14), 0 12px 34px 0 rgba(0, 0, 0, 0.19);
+}
+
+.compare-dlg-body {
+    display: flex;
+    padding: 0 24px 16px;
+}
+
+.compare-dlg_doc-sep {
+    width: 68px;
+    background-repeat: no-repeat;
+    background-position: center;
+    background-image: url('img/compare-dlg-separator.svg');
+}
+
+.compare-dlg_doc-a-wrap .wrap-inner,
+.compare-dlg_doc-b-wrap .wrap-inner {
+    width: 230px;
+    max-width: 100%;
+}
+
+.compare-dlg_doc-a-wrap .wrap-inner {
+    margin-left: auto;
+}
+
+.compare-dlg_doc-b-wrap .wrap-inner {
+    margin-right: auto;
+}
+
+.compare-dlg_doc-a-wrap,
+.compare-dlg_doc-b-wrap {
+    width: calc(50% - 34px);
+}
+
+.compare-dlg-header {
+    position: relative;
+    font-size: 18px;
+    line-height: 150%;
+    background: transparent;
+    border-bottom: none;
+    padding: 24px 20px;
+}
+
+.compare-dlg-footer {
+    padding: 0;
+    display: flex;
+    justify-content: flex-end;
+    padding: 24px;
+    background-color: #F8F9FA;
+    border-top: 1px solid #E4E6EC;
+    border-radius: 0 0 4px 4px;
+}
+
+.dlg-overlay {
+    width: 100%;
+    height: 100%;
+    position: fixed;
+    z-index: 99000006;
+    background: #222D44;
+    opacity: 0.2;
+    display: none;
+    top: 0;
+    left: 0;
+}
+
+.wrap-inner-bg {
+    background: #F7F9FA;
+    border: 1px solid #EDF0F2;
+    padding: 15px;
+}
+
+.wrap-inner-subtitle {
+    font-size: 16px;
+    padding-bottom: 16px;
+}
+
+.compare-dlg_doc-b_name,
+.compare-dlg_doc-a_name {
+    font-size: 14px;
+}
+
+.compare-dlg-wrap .close {
+    cursor: pointer;
+    position: absolute;
+    width: 30px;
+    height: 30px;
+    top: 0;
+    right: -42px;
+    opacity: 1;
+    background-image: url('img/cancel-white.svg');
+}
+
+.field-grp,
+.uk-margin {
+    position: relative;
+    padding: 0 !important;
+    margin-bottom: 22px;
+}
+
+.field-grp label,
+.uk-margin label {
+    color: #4A556C;
+    padding: 0 6px;
+    background: #fff;
+    width: fit-content;
+    position: absolute;
+    top: -10px;
+    left: 10px;
+    z-index: 1000;
+}
+
+.uk-margin-last {
+    margin-bottom: 0;
+}
+
+.form-body .field-grp:last-child {
+    margin-bottom: 0;
+}
+
+.compare-dlg-wrap .wrap-inner {
+    width: unset;
+}
+
+.compare-dlg-wrap .wrap-inner-bg {
+    background: #fff;
+    border: none;
+    padding: 0;
+}
+
+.compare-dlg_warning {
+    display: none;
+    color: #ff495c;
+    font-size: 14px;
+    padding: 0 24px 16px;
+}
+
+.uk-button {
+    font-family: 'InterRegular';
+    outline: none;
+    font-size: 16px;
+    line-height: 24px;
+    cursor: pointer;
+    background: #fff;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin-left: 12px;
+    margin-right: 0;
+    min-width: 139px;
+    height: 40px;
+    padding: 0;
+    border-radius: 4px;
+    border: 1px solid #E4E6EC !important;
+    text-transform: none;
+}
+
+.uk-button:active,
+.uk-button:focus,
+.uk-button:hover {
+    background: #F3F8FF;
+}
+
+.uk-button.disabled {
+    opacity: 0.4;
+    cursor: default;
+}
+
+.uk-button-primary:active,
+.uk-button-primary:focus,
+.uk-button-primary:hover {
+    background: #3274E0;
+    border: none !important;
+}
+
+.uk-button-primary {
+    background: #347FDE;
+    color: #fff;
+    border: none !important;
+}
+
+.uk-button-primary span {
+    font-family: 'InterMedium' !important;
+}
+
+.select {
+    position: relative;
+    border: 1px solid #C0CAD5;
+    border-radius: 4px;
+    height: 40px;
+    background: #fff;
+    display: flex;
+    align-items: center;
+}
+
+.select > input {
+    border: none;
+    cursor: pointer;
+    box-sizing: border-box;
+    color: #222D44;
+    font-size: 14px;
+    line-height: 16px;
+    padding: 8px 16px;
+    height: 100%;
+    width: 100%;
+    background: transparent;
+}
+
+.select > input:disabled {
+    background: #fff !important;
+    user-select: none;
+}
+
+.select > input:focus-visible {
+    outline: none;
+}
+
+.select > span {
+    display: block;
+    background-image: url('img/collapse-bottom.svg');
+    width: 24px;
+    height: 24px;
+    position: absolute;
+    top: calc(50% - 12px);
+    right: 16px;
+    background-size: 100%;
+    background-position: center;
+    background-repeat: no-repeat;
+    cursor: pointer;
+}
+
+.select.active > span {
+    transform: rotate(-180deg);
+    background-image: url('img/collapse-bottom-blue.svg');
+}
+
+.select.active {
+    border-color: #3274E0;
+}
+
+.field-grp:has(.select.active) > label,
+.uk-margin:has(.select.active) > label {
+    color: #3274E0;
+}
+
+.select.readonly input {
+    color: #4A556C;
+    user-select: none;
+}
+
+.select.readonly::selection {
+    background: #fff;
+    color: #4A556C;
+}
+
+.field-grp:has(.select.readonly) > label,
+.uk-margin:has(.select.readonly) > label {
+    color: #8E98A3;
+}
+
+.select ul {
+    background: #fff;
+    width: 100%;
+    padding: 0;
+    margin: 0;
+    list-style: none;
+    border-radius: 4px;
+    font-size: 14px;
+    max-height: 100px;
+    overflow-y: auto;
+}
+
+.select > div {
+    overflow: hidden;
+    display: none;
+    position: absolute;
+    background: #fff;
+    width: 100%;
+    border-radius: 4px;
+    box-shadow: 0px 4px 14px 0px rgba(0, 0, 0, 0.18), 0px 0px 4px 0px rgba(0, 0, 0, 0.14);
+    top: calc(100% + 4px);
+    left: 0;
+    z-index: 10000;
+}
+
+.select.active > div {
+    display: block;
+}
+
+.select ul > li {
+    line-height: 16px;
+    padding: 8px 12px;
+    cursor: pointer;
+}
+
+.select ul > li:hover {
+    background: #F3F8FF;
+}
+
+.select ul::-webkit-scrollbar {
+    width: 4px;
+}
+
+.select ul::-webkit-scrollbar-track {
+    background: #fff;
+    border-radius: 8px;
+}
+
+.select ul::-webkit-scrollbar-thumb {
+    background: #E4E6EC;
+    border-radius: 2px;
+    height: 20px;
+}
+
+.select ul::-webkit-scrollbar-thumb:hover {
+    background: #E4E6EC;
+}
+
+.ui-widget {
+    font-family: 'InterRegular';
+}
+
+.ui-icon, .ui-widget-content .ui-icon {
+    background-image: url("img/ui-icons_444444_256x240.png");
 }

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

@@ -49,4 +49,348 @@
 
 #fileVersionSelect {
     top: calc(50% - 16px);
+}
+
+.compare-dlg-body,
+.compare-dlg-header,
+.compare-dlg-footer {
+    font-family: 'InterRegular';
+}
+
+.compare-dlg-wrap {
+    position: absolute;
+    z-index: 99000007;
+    width: 600px;
+    max-width: 100%;
+    background: #fff;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    font-family: 'InterRegular';
+    border-radius: 4px;
+    border: 1px solid rgba(74, 85, 108, 0.35);
+    user-select: none;
+    box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.14), 0 12px 34px 0 rgba(0, 0, 0, 0.19);
+}
+
+.compare-dlg-body {
+    display: flex;
+    padding: 0 24px 16px;
+}
+
+.compare-dlg_doc-sep {
+    width: 68px;
+    background-repeat: no-repeat;
+    background-position: center;
+    background-image: url('img/compare-dlg-separator.svg');
+}
+
+.compare-dlg_doc-a-wrap .wrap-inner,
+.compare-dlg_doc-b-wrap .wrap-inner {
+    width: 230px;
+    max-width: 100%;
+}
+
+.compare-dlg_doc-a-wrap .wrap-inner {
+    margin-left: auto;
+}
+
+.compare-dlg_doc-b-wrap .wrap-inner {
+    margin-right: auto;
+}
+
+.compare-dlg_doc-a-wrap,
+.compare-dlg_doc-b-wrap {
+    width: calc(50% - 34px);
+}
+
+.compare-dlg-header {
+    position: relative;
+    font-size: 18px;
+    line-height: 150%;
+    background: transparent;
+    border-bottom: none;
+    padding: 24px 20px;
+}
+
+.compare-dlg-footer {
+    padding: 0;
+    display: flex;
+    justify-content: flex-end;
+    padding: 24px;
+    background-color: #F8F9FA;
+    border-top: 1px solid #E4E6EC;
+    border-radius: 0 0 4px 4px;
+}
+
+.dlg-overlay {
+    width: 100%;
+    height: 100%;
+    position: fixed;
+    z-index: 99000006;
+    background: #222D44;
+    opacity: 0.2;
+    display: none;
+    top: 0;
+    left: 0;
+}
+
+.wrap-inner-bg {
+    background: #F7F9FA;
+    border: 1px solid #EDF0F2;
+    padding: 15px;
+}
+
+.wrap-inner-subtitle {
+    font-size: 16px;
+    padding-bottom: 16px;
+}
+
+.compare-dlg_doc-b_name,
+.compare-dlg_doc-a_name {
+    font-size: 14px;
+}
+
+.compare-dlg-wrap .close {
+    cursor: pointer;
+    position: absolute;
+    width: 30px;
+    height: 30px;
+    top: 0;
+    right: -42px;
+    opacity: 1;
+    background-image: url('img/cancel-white.svg');
+}
+
+.field-grp,
+.uk-margin {
+    position: relative;
+    padding: 0 !important;
+    margin-bottom: 22px;
+}
+
+.field-grp label,
+.uk-margin label {
+    color: #4A556C;
+    padding: 0 6px;
+    background: #fff;
+    width: fit-content;
+    position: absolute;
+    top: -10px;
+    left: 10px;
+    z-index: 1000;
+}
+
+.uk-margin-last {
+    margin-bottom: 0;
+}
+
+.form-body .field-grp:last-child {
+    margin-bottom: 0;
+}
+
+.compare-dlg-wrap .wrap-inner {
+    width: unset;
+}
+
+.compare-dlg-wrap .wrap-inner-bg {
+    background: #fff;
+    border: none;
+    padding: 0;
+}
+
+.compare-dlg_warning {
+    display: none;
+    color: #ff495c;
+    font-size: 14px;
+    padding: 0 24px 16px;
+}
+
+.uk-button {
+    font-family: 'InterRegular';
+    outline: none;
+    font-size: 16px;
+    line-height: 24px;
+    cursor: pointer;
+    background: #fff;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin-left: 12px;
+    margin-right: 0;
+    min-width: 139px;
+    height: 40px;
+    padding: 0;
+    border-radius: 4px;
+    border: 1px solid #E4E6EC !important;
+    text-transform: none;
+}
+
+.uk-button:active,
+.uk-button:focus,
+.uk-button:hover {
+    background: #F3F8FF;
+}
+
+.uk-button.disabled {
+    opacity: 0.4;
+    cursor: default;
+}
+
+.uk-button-primary:active,
+.uk-button-primary:focus,
+.uk-button-primary:hover {
+    background: #3274E0;
+    border: none !important;
+}
+
+.uk-button-primary {
+    background: #347FDE;
+    color: #fff;
+    border: none !important;
+}
+
+.uk-button-primary span {
+    font-family: 'InterMedium' !important;
+}
+
+.select {
+    position: relative;
+    border: 1px solid #C0CAD5;
+    border-radius: 4px;
+    height: 40px;
+    background: #fff;
+    display: flex;
+    align-items: center;
+}
+
+.select > input {
+    border: none;
+    cursor: pointer;
+    box-sizing: border-box;
+    color: #222D44;
+    font-size: 14px;
+    line-height: 16px;
+    padding: 8px 16px;
+    height: 100%;
+    width: 100%;
+    background: transparent;
+}
+
+.select > input:disabled {
+    background: #fff !important;
+    user-select: none;
+}
+
+.select > input:focus-visible {
+    outline: none;
+}
+
+.select > span {
+    display: block;
+    background-image: url('img/collapse-bottom.svg');
+    width: 24px;
+    height: 24px;
+    position: absolute;
+    top: calc(50% - 12px);
+    right: 16px;
+    background-size: 100%;
+    background-position: center;
+    background-repeat: no-repeat;
+    cursor: pointer;
+}
+
+.select.active > span {
+    transform: rotate(-180deg);
+    background-image: url('img/collapse-bottom-blue.svg');
+}
+
+.select.active {
+    border-color: #3274E0;
+}
+
+.field-grp:has(.select.active) > label,
+.uk-margin:has(.select.active) > label {
+    color: #3274E0;
+}
+
+.select.readonly input {
+    color: #4A556C;
+    user-select: none;
+}
+
+.select.readonly::selection {
+    background: #fff;
+    color: #4A556C;
+}
+
+.field-grp:has(.select.readonly) > label,
+.uk-margin:has(.select.readonly) > label {
+    color: #8E98A3;
+}
+
+.select ul {
+    background: #fff;
+    width: 100%;
+    padding: 0;
+    margin: 0;
+    list-style: none;
+    border-radius: 4px;
+    font-size: 14px;
+    max-height: 100px;
+    overflow-y: auto;
+}
+
+.select > div {
+    overflow: hidden;
+    display: none;
+    position: absolute;
+    background: #fff;
+    width: 100%;
+    border-radius: 4px;
+    box-shadow: 0px 4px 14px 0px rgba(0, 0, 0, 0.18), 0px 0px 4px 0px rgba(0, 0, 0, 0.14);
+    top: calc(100% + 4px);
+    left: 0;
+    z-index: 10000;
+}
+
+.select.active > div {
+    display: block;
+}
+
+.select ul > li {
+    line-height: 16px;
+    padding: 8px 12px;
+    cursor: pointer;
+}
+
+.select ul > li:hover {
+    background: #F3F8FF;
+}
+
+.select ul::-webkit-scrollbar {
+    width: 4px;
+}
+
+.select ul::-webkit-scrollbar-track {
+    background: #fff;
+    border-radius: 8px;
+}
+
+.select ul::-webkit-scrollbar-thumb {
+    background: #E4E6EC;
+    border-radius: 2px;
+    height: 20px;
+}
+
+.select ul::-webkit-scrollbar-thumb:hover {
+    background: #E4E6EC;
+}
+
+.ui-widget {
+    font-family: 'InterRegular';
+}
+
+.ui-icon, .ui-widget-content .ui-icon {
+    background-image: url("img/ui-icons_444444_256x240.png");
 }

package/css/std/controls/bim-viewer/img/cancel-white.svg

@@ -0,0 +1 @@
+<svg viewBox='0 0 32 32' fill='none' stroke-width='2px' stroke='#fff' xmlns='http://www.w3.org/2000/svg'><path d='M0 32.333l16-16m0 0l-16-16m16 16l16 16m-16-16l16-16'></path></svg>

package/css/std/controls/bim-viewer/img/collapse-bottom-blue.svg

@@ -0,0 +1 @@
+<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'><path d='M19.5 9L12 16.5L4.5 9' stroke='#3274E0' stroke-linecap='round' stroke-linejoin='round'/></svg>

package/css/std/controls/bim-viewer/img/collapse-bottom.svg

@@ -0,0 +1 @@
+<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'><path d='M19.5 9L12 16.5L4.5 9' stroke='#4A556C' stroke-linecap='round' stroke-linejoin='round'/></svg>

package/css/std/controls/bim-viewer/img/compare-dlg-separator.svg

@@ -0,0 +1 @@
+<svg width='38' height='22' viewBox='0 0 38 22' fill='none' xmlns='http://www.w3.org/2000/svg'><g clip-path='url(#clip0_1743_100928)'><path d='M1.12227 5.08646C0.792376 5.26348 0.79238 5.73656 1.12228 5.91357L9.91038 10.6291C10.223 10.7969 10.6016 10.5704 10.6016 10.2155L10.6016 7.50613C10.6016 7.24693 10.8117 7.0368 11.0709 7.0368L26.1755 7.0368C26.4347 7.0368 26.6448 6.82667 26.6448 6.56747L26.6448 4.43239C26.6448 4.17318 26.4347 3.96306 26.1755 3.96306L11.0709 3.96306C10.8117 3.96306 10.6016 3.75293 10.6016 3.49373L10.6016 0.784335C10.6016 0.429502 10.223 0.203005 9.91037 0.37078L1.12227 5.08646Z' fill='#4A556C'/><path d='M36.8777 16.9135C37.2076 16.7364 37.2076 16.2634 36.8777 16.0864L28.0897 11.3709C27.7771 11.2031 27.3985 11.4296 27.3985 11.7845L27.3985 14.4938C27.3985 14.753 27.1884 14.9632 26.9292 14.9632L11.8248 14.9632C11.5656 14.9632 11.3554 15.1733 11.3554 15.4325L11.3554 17.5675C11.3554 17.8267 11.5656 18.0368 11.8248 18.0368L26.9292 18.0368C27.1884 18.0368 27.3985 18.247 27.3985 18.5062L27.3985 21.2155C27.3985 21.5704 27.7771 21.7969 28.0897 21.6291L36.8777 16.9135Z' fill='#4A556C'/></g><defs><clipPath id='clip0_1743_100928'><rect width='22' height='38' fill='white' transform='translate(0 22) rotate(-90)'/></clipPath></defs></svg>

package/css/std/controls/header/header-nav-bar-sidebar-button.css

@@ -9,6 +9,7 @@
     background-repeat: no-repeat;
     background-size: 100%;
     z-index: 100;
+    margin-right: 32px;
     background-image: url('@vitrosoftware/common-ui-ts/css/std/controls/header/img/nav-bar-button.svg');
 }
 

package/css/std/controls/product-title/product-title.css

@@ -7,7 +7,7 @@
 .vitro-product-title img {
     max-height: 25px;
 	min-height: 25px;
-    margin: 0px 32px;
+    margin-right: 32px;
 }
 
 @media (max-width: 800px) {