@vitrosoftware/common-ui-ts 1.1.103 → 1.1.104

package/dist/index.css

@@ -86,22 +86,7 @@ html, body {
     display: flex;
 }
 
-.vitro-title.vitro-border-bottom {
-    border-bottom: 1px solid #E4E6EC;
-    margin-right: 12px;
-    margin-bottom: 0;
-    padding-bottom: 12px;
-}
-
 @media (max-width: 800px) {
-    .vitro-title {
-        padding-bottom: 8px;
-        font-size: 18px;
-        line-height: 27px;
-        margin: 0;
-        margin-right: 12px;
-    }
-
     .pane > .vitro-flex {
         flex-direction: column;
         align-items: flex-start;
@@ -1345,6 +1330,13 @@ html, body {
     font-weight: unset;
     margin-top: 0;
     margin-bottom: 0;
+}
+
+.vitro-border-bottom {
+    border-bottom: 1px solid #E4E6EC;
+    margin-right: 12px;
+    margin-bottom: 0;
+    padding-bottom: 12px;
 }
 ._dialog-header_vitro-dialog-header_2W3GraU {
     padding: 20px;
@@ -1586,7 +1578,7 @@ html, body {
     right: 0;
     top: 0;
     bottom: 0;
-    z-index: 1002;
+    z-index: 300;
     display: flex;
     align-items: center;
     justify-content: center;
@@ -1641,11 +1633,11 @@ html, body {
     transition: max-height 0.5s ease;
 }
 
-@media (max-width: 800px) {
-    ._dialog_vitro-dialog_2NzcRZg {
-        z-index: 10001 !important;
-    }
+._dialog_vitro-display-none_T-eWeyA {
+    display: none;
+}
 
+@media (max-width: 800px) {
     ._dialog_vitro-dialog_2NzcRZg > div {
         min-width: unset;
         max-width: calc(100% - 16px);
@@ -1679,6 +1671,12 @@ html, body {
     height: 88px;
     padding: 24px 20px;
     border-bottom: none;
+}
+
+@media (max-width: 800px) {
+    ._confirm-dialog_vitro-confirm-dialog_1r-CtWW {
+       width: 100% !important;
+    }
 }
 ._action-result-list_vitro-action-result-list_fJtJWdL {
     width: 100%;
@@ -2031,6 +2029,7 @@ html, body {
 ._tab-group_vitro-tab_1Qb50HL .nav {
     align-items: center;
     justify-content: center;
+    flex-wrap: nowrap;
 }
 
 ._tab-group_vitro-tab_1Qb50HL > .vitro-content {
@@ -2071,8 +2070,10 @@ html, body {
     padding: 8px 12px;
 }
 
-._tab-group_vitro-tab_1Qb50HL .nav .dropdown-item:hover {
+._tab-group_vitro-tab_1Qb50HL .nav .dropdown-item:hover,
+._tab-group_vitro-tab_1Qb50HL .nav .dropdown-item:active {
     background: #F3F8FF;
+    color: #222D44;
 }
 
 ._tab-group_vitro-tab_1Qb50HL .nav .dropdown-item:first-child {
@@ -2090,6 +2091,7 @@ html, body {
 ._tab-group_vitro-tab_1Qb50HL .nav > div._tab-group_vitro-item_2YnBcmb {
     flex-grow: 1;
     text-align: center;
+    overflow: hidden;
 }
 
 ._tab-group_vitro-tab_1Qb50HL .nav > div .nav-link {
@@ -2110,8 +2112,9 @@ html, body {
 }
 
 ._tab-group_vitro-tab_1Qb50HL .nav > div .nav-item a span {
-    display: inline-flex;
-    align-items: center;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
 }
 
 ._tab-group_vitro-tab_1Qb50HL .nav > div ._tab-group_active_3M-IIR2 span {
@@ -2133,6 +2136,11 @@ html, body {
     align-items: flex-start;
 }
 
+._tab-group_vitro-tab_1Qb50HL .nav > ._tab-group_vitro-dropdown-button_146jv_h .dropdown-menu {
+    width: 241px;
+    min-width: unset;
+}
+
 ._tab-group_vitro-tab_1Qb50HL .nav > div .nav-item._tab-group_active_3M-IIR2 a {
     color: #3274E0 !important;
     border-bottom: 2px solid #3274E0;
@@ -2674,6 +2682,7 @@ html, body {
     padding: 4px;
     text-align: center;
     overflow: hidden;
+    flex-shrink: 0;
 }
 
 ._file-version-select_vitro-file-version-item_38KWa8a ._file-version-select_vitro-version-name_1821bal {
@@ -5102,12 +5111,6 @@ li:first-child ._command-menu-item_vitro-item_2pVhk23:hover {
     overflow-wrap: anywhere;
 }
 
-._activity-item_vitro-message_1ndqhgR img {
-    max-width: calc(100% - 20px);
-    display: block;
-    margin: 4px 0;
-}
-
 ._activity-item_vitro-flex_37IxBWe {
     display: flex;
 }
@@ -5549,6 +5552,156 @@ li:first-child ._command-menu-item_vitro-item_2pVhk23:hover {
     position: relative;
 }
 
+._file_vitro-file_2xkXgkS {
+    border-radius: 4px;
+    height: 80px;
+    width: 142px;
+    display: flex;
+    justify-content: center;
+    flex-direction: column;
+    align-items: center;
+    padding: 8px;
+    position: relative;
+    box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.1), 0px 0px 2px 0px rgba(0, 0, 0, 0.12);
+}
+
+._file_vitro-preview_2RVdrbm {
+    padding: 0 !important;
+}
+
+._file_vitro-preview-container_2dmbDD7 {
+    max-width: 100%;
+    max-height: 100%;
+    min-width: 36px;
+    min-height: 36px;
+    width: auto;
+    height: auto;
+    cursor: pointer;
+}
+
+._file_vitro-preview_2RVdrbm ._file_vitro-preview-container_2dmbDD7 {
+    width: 100%;
+    height: 100%;
+    overflow: hidden;
+    border-radius: 4px;
+}
+
+._file_vitro-preview_2RVdrbm ._file_vitro-preview-container_2dmbDD7 img {
+    width: 100%;
+    height: 100%;
+    -o-object-fit: cover;
+       object-fit: cover;
+}
+
+._file_vitro-flex_3nGTlWX {
+    display: flex;
+    align-items: center;
+    grid-gap: 4px;
+    margin-top: 4px;
+    width: 100%;
+}
+
+._file_vitro-flex_3nGTlWX > div {
+    display: flex;
+    flex-direction: column;
+    overflow: hidden;
+}
+
+._file_vitro-image_2Bt3otk {
+    width: 24px;
+    height: 24px;
+    flex-shrink: 0;
+}
+
+._file_vitro-file-name_2t9Y643 {
+    color: #222D44;
+    font-size: 11px;
+    line-height: 145%;
+    overflow: hidden;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    display: block;
+}
+
+._file_vitro-file-size_15f_E_0 {
+    color: #6C757D;
+    font-size: 10px;
+    line-height: 145%;
+}
+
+._file_vitro-dropdown-button_3MgI2n9 {
+    position: absolute;
+    top: 4px;
+    right: 4px;
+    border-radius: 50%;
+    width: 24px;
+    height: 24px;
+    background-color: #E9ECEF;
+}
+
+._file_vitro-dropdown-button_3MgI2n9 .dropdown-menu {
+    width: 185px;
+    min-width: 185px;
+}
+
+._file_vitro-dropdown-button_3MgI2n9 .btn > span {
+    background-image: url('@vitrosoftware/common-ui-ts/css/std/controls/file/img/file-button-context.svg');
+}
+
+._attached-file-list_vitro-file-list-container_5PIFyI7 {
+    display: flex;
+    padding: 4px 6px;
+    grid-gap: 8px 12px;
+    flex-wrap: wrap;
+}
+
+._attached-file-list_vitro-overflow-button_39QxX1m {
+    width: -moz-fit-content;
+    width: fit-content;
+    height: -moz-fit-content;
+    height: fit-content;
+    position: relative;
+}
+
+._attached-file-list_vitro-item-count_35PIT1U {
+    background: rgba(192, 202, 213, 0.7);
+    width: 100%;
+    height: 100%;
+    border-radius: 4px;
+    position: absolute;
+    z-index: 1;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    cursor: pointer;
+}
+
+._attached-file-list_vitro-item-count_35PIT1U > div {
+    width: 36px;
+    height: 36px;
+    background-color: #fff;
+    border-radius: 50%;
+    font-size: 14px;
+    color: #222D44;
+    line-height: 130%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+@media (max-width: 800px) {
+    ._attached-file-list_vitro-overflow-button_39QxX1m,
+    ._attached-file-list_vitro-file_2mPE3Rq {
+        width: calc(100% / 2 - 12px);
+        max-width: 142px;
+    }
+
+    ._attached-file-list_vitro-overflow-button_39QxX1m ._attached-file-list_vitro-file_2mPE3Rq {
+        width: 100%;
+    }
+}
+
+
 ._activity-message_vitro-activity-message_3GdyQuC {
     display: flex;
     flex-direction: column;
@@ -5595,7 +5748,7 @@ li:first-child ._command-menu-item_vitro-item_2pVhk23:hover {
 
 ._activity-message_vitro-message_25otUOy {
     font-family: 'InterRegular' !important;
-    white-space: normal;
+    white-space: pre-wrap;
 }
 
 ._activity-message_vitro-field-name_hdjdQbg {
@@ -5617,33 +5770,54 @@ li:first-child ._command-menu-item_vitro-item_2pVhk23:hover {
     background-image: url('@vitrosoftware/common-ui-ts/css/std/controls/activity-item/img/activity-arrow.svg');
 }
 
+._attached-file_vitro-attached-file-container_3AhHHlm {
+    position: relative;
+}
+
+._attached-file_vitro-attached-file_1R6PPQN {
+    width: 80px;
+    height: 80px;
+    padding: 4px;
+    align-items: flex-start;
+}
+
+._attached-file_vitro-button-remove_3ehToHf {
+    width: 16px;
+    height: 16px;
+    background-size: 100%;
+    background-repeat: no-repeat;
+    background-color: #E9ECEF;
+    border: none;
+    border-radius: 50%;
+    outline: none;
+    position: absolute;
+    z-index: 1;
+    top: 4px;
+    right: 4px;
+    background-image: url('@vitrosoftware/common-ui-ts/css/std/controls/message-input/img/attached-file-remove.svg');
+}
+
+._flex-box_vitro-flex-box_3jGTD6k {
+    display: flex;
+    align-items: center;
+}
 ._message-input_vitro-message-input_3MkcjWD {
     display: flex;
     position: absolute;
-    width: calc(100% - 32px);
-    max-width: calc(100% - 32px);
-    bottom: 0;
+    width: calc(100%);
     align-items: flex-end;
-    background: #fff;
     bottom: 1px;
+    z-index: 2;
 }
 
 ._message-input_vitro-message-input_3MkcjWD ._message-input_vitro-control_1PUSjq9 {
-    cursor: text;
-    width: 100%;
+    width: calc(100% - 48px);
     position: relative;
     border-radius: 4px;
     border: 1px solid #C0CAD5;
     min-height: 36px;
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
     word-break: break-all;
-}
-
-._message-input_vitro-message-input_3MkcjWD .ps > div:first-child {
-    padding: 0;
-    padding: 6px 16px 6px 8px !important;
+    background-color: #fff;
 }
 
 ._message-input_vitro-message-input_3MkcjWD .ps__rail-y {
@@ -5662,6 +5836,7 @@ li:first-child ._command-menu-item_vitro-item_2pVhk23:hover {
 }
 
 ._message-input_vitro-placeholder_1FBfIqN {
+    display: block;
     color: #8E98A3;
     font-weight: unset;
     font-size: 12px;
@@ -5672,6 +5847,7 @@ li:first-child ._command-menu-item_vitro-item_2pVhk23:hover {
     -webkit-user-select: none;
        -moz-user-select: none;
             user-select: none;
+    white-space: nowrap;
 }
 
 ._message-input_vitro-button-add-file_1qdtHHq {
@@ -5679,6 +5855,7 @@ li:first-child ._command-menu-item_vitro-item_2pVhk23:hover {
     width: 24px;
     min-width: 24px;
     min-height: 24px;
+    margin-right: 7px;
     background-color: #fff;
     border: none;
     outline: none;
@@ -5688,7 +5865,9 @@ li:first-child ._command-menu-item_vitro-item_2pVhk23:hover {
     background-image: url('@vitrosoftware/common-ui-ts/css/std/controls/message-input/img/paperclip.svg');
 }
 
-._message-input_vitro-button-send_1vktQrZ {
+._message-input_vitro-button-send_1vktQrZ,
+._message-input_vitro-button-send_1vktQrZ:hover,
+._message-input_vitro-button-send_1vktQrZ:active {
     height: 36px;
     width: 36px;
     min-width: 36px;
@@ -5712,6 +5891,38 @@ li:first-child ._command-menu-item_vitro-item_2pVhk23:hover {
     background-color: none;
     border: none;
     outline: none;
+}
+
+._message-input_vitro-display-none_2dYTZ22 {
+    display: none;
+}
+
+._message-input_vitro-attached-file-list_l95S4VR {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+}
+
+._message-input_vitro-attached-file-list_l95S4VR::after {
+    content: '';
+    display: block;
+    height: 1px;
+    background: #E9ECEF;
+    width: calc(100% - 16px);
+}
+
+._message-input_vitro-attached-file-list_l95S4VR .ps {
+    max-height: 97px;
+    padding: 6px 8px 10px 8px;
+}
+
+._message-input_vitro-attached-file-list_l95S4VR .ps > div:first-child {
+    grid-gap: 12px;
+}
+
+._message-input_vitro-flex_18M_7xU .ps > div:first-child {
+    padding: 10px 16px 10px 8px !important;
+    min-height: 36px;
 }
 ._image-picker_vitro-image-picker-root_AqOYRhP {
     width: 88px;
@@ -6045,10 +6256,6 @@ li:first-child ._command-menu-item_vitro-item_2pVhk23:hover {
     height: 20px;
     width: 20px;
 }
-._flex-box_vitro-flex-box_3jGTD6k {
-    display: flex;
-    align-items: center;
-}
 ._search-input_vitro-search-input_3M9i4Gi {
     height: 32px;
     border-radius: 4px;
@@ -6534,6 +6741,137 @@ li:first-child ._command-menu-item_vitro-item_2pVhk23:hover {
     margin-right: 8px;
     border-radius: 50%;
 }
+._scroll-view_vitro-scroll-view_TXQ8QQh {
+    width: 100%;
+    height: 100%;
+}
+
+._scroll-view_vitro-scroll-view_TXQ8QQh .k-scrollview-next,
+._scroll-view_vitro-scroll-view_TXQ8QQh .k-scrollview-prev {
+    height: 60px;
+    width: 32px;
+}
+
+._scroll-view_vitro-scroll-view_TXQ8QQh .k-i-arrowhead-e::before {
+    content: url('@vitrosoftware/common-ui-ts/css/std/controls/scroll-view/img/scroll-view-next.svg');
+}
+
+._scroll-view_vitro-scroll-view_TXQ8QQh .k-i-arrowhead-w::before {
+    content: url('@vitrosoftware/common-ui-ts/css/std/controls/scroll-view/img/scroll-view-prev.svg');
+}
+
+._scroll-view_vitro-scroll-view_TXQ8QQh .k-scrollview-nav .k-link {
+    border-color: #E4E6EC !important;
+    background-color: #E4E6EC !important;
+}
+
+._scroll-view_vitro-scroll-view_TXQ8QQh .k-scrollview-nav .k-link.k-primary {
+    border-color: #2A63F6 !important;
+    background-color: #2A63F6 !important;
+}
+._page_vitro-image-container_QEXhGHE {
+    width: 100%;
+    height: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding: 0 60px;
+}
+
+._page_vitro-image-container_QEXhGHE img {
+    max-height: 100%;
+    max-width: 100%;
+}
+
+@media (max-width: 800px) {
+    ._page_vitro-image-container_QEXhGHE {
+        padding: 0;
+    }
+}
+
+._image-viewer_vitro-image-viewer_19T7Auc {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    z-index: 200;
+}
+
+._image-viewer_vitro-header_1KIbDWk {
+    width: 100%;
+    position: absolute;
+    left: 0;
+    top: 0;
+    z-index: 1;
+    padding: 20px;
+    display: flex;
+    justify-content: space-between;
+}
+
+._image-viewer_vitro-button-close_36TY-iY {
+    width: 32px;
+    height: 32px;
+    background: transparent;
+    outline: none;
+    border: none;
+    background-repeat: no-repeat;
+    background-size: 100%;
+    background-image: url('@vitrosoftware/common-ui-ts/css/std/controls/image-viewer/img/image-viewer-close.svg');
+}
+
+._image-viewer_vitro-scroll-view_3nuGD7c {
+    background-color: #212529 !important;
+    padding: 79px 0;
+}
+
+._image-viewer_vitro-scroll-view_3nuGD7c .k-scrollview-prev {
+    left: 20px !important;
+}
+
+._image-viewer_vitro-scroll-view_3nuGD7c .k-scrollview-next {
+    right: 20px !important;
+}
+
+._image-viewer_vitro-dropdown-button_2TOT1pw .btn,
+._image-viewer_vitro-dropdown-button_2TOT1pw .btn:hover,
+._image-viewer_vitro-dropdown-button_2TOT1pw .btn:focus,
+._image-viewer_vitro-dropdown-button_2TOT1pw .btn:active,
+._image-viewer_vitro-dropdown-button_2TOT1pw .btn > span {
+    width: 32px;
+    height: 32px;
+}
+
+._image-viewer_vitro-dropdown-button_2TOT1pw .btn > span {
+    background-image: url('@vitrosoftware/common-ui-ts/css/std/controls/image-viewer/img/context-button-white.svg');
+}
+
+._image-viewer_vitro-pager_1FiaoGR {
+    width: 60px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    color: #fff;
+    font-size: 20px;
+    line-height: 24px;
+    position: absolute;
+    bottom: 28px;
+    left: calc(50% - 30px);
+}
+
+@media (max-width: 800px) {
+    ._image-viewer_vitro-image-viewer_19T7Auc {
+        z-index: 301;
+    }
+
+    ._image-viewer_vitro-scroll-view_3nuGD7c .k-scrollview-prev {
+        left: 0 !important;
+    }
+
+    ._image-viewer_vitro-scroll-view_3nuGD7c .k-scrollview-next {
+        right: 0 !important;
+    }
+}
 ._page-layout_vitro-page_GzZ3agH {
     height: 100%;
     display: flex;
@@ -7190,3 +7528,44 @@ li:first-child ._command-menu-item_vitro-item_2pVhk23:hover {
     width: 100%;
     margin-top: 16px;
 }
+
+._linear-progress_vitro-linear-progress_1i4VVyb {
+    height: 2px;
+    position: relative;
+    overflow: hidden;
+}
+
+._linear-progress_vitro-bar_2rwmbp3 {
+    width: 22%;
+    height: 2px;
+    background-color: #326AD6;
+    animation: _linear-progress_progress_11DTdlB 2.7s ease-in-out infinite;
+    position: absolute;
+    left: 0;
+}
+
+@keyframes _linear-progress_progress_11DTdlB {
+    0% {
+        transform: scaleX(1);
+        transform-origin: bottom left;
+        left: 0;
+    }
+    25% {
+        transform: scaleX(1.75);
+        transform-origin: bottom left;
+    }
+    50% {
+        transform-origin: bottom left;
+        transform: scaleX(1);
+        left: 78%;
+    }
+    75% {
+        transform: scaleX(1.75);
+        transform-origin: bottom right;
+    }
+    100% {
+        transform: scaleX(1);
+        transform-origin: bottom right;
+        left: 0;
+    }
+}