@vitrosoftware/common-ui-ts 1.1.111 → 1.1.112

package/css/std/controls/criterion/criterion.css

@@ -6,18 +6,6 @@
     margin-bottom: 28px;
 }
 
-.vitro-criterion-container:first-child {
-    margin-top: 10px;
-}
-
-.vitro-criterion-container:last-child {
-    margin-bottom: 18px;
-}
-
-.vitro-block:last-child .vitro-criterion-container {
-    margin-bottom: 18px;
-}
-
 .vitro-control {
     position: relative;
 }

package/css/std/controls/date-picker/date-picker.css

@@ -159,6 +159,7 @@
 :global(.k-picker-wrap) {
     border-radius: 4px !important;
     border: 1px solid #C0CAD5 !important;
+    background-color: transparent !important;
 }
 
 :global(.k-picker-wrap.k-state-focused),

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

@@ -4,6 +4,14 @@
     font-family: 'InterRegular';
 }
 
+.vitro-dropdown-button :global(.ps) {
+    border-radius: 4px;
+}
+
+.vitro-dropdown-button :global(.ps) > div:first-child {
+    padding: 0 !important;
+}
+
 .vitro-dropdown-button button,
 .vitro-dropdown-button button:hover,
 .vitro-dropdown-button button:active,
@@ -110,14 +118,6 @@
     box-sizing: border-box;
 }
 
-.vitro-dropdown-button :global(.dropdown-item):first-child {
-    border-radius: 4px 4px 0 0;
-}
-
-.vitro-dropdown-button :global(.dropdown-item):last-child {
-    border-radius: 0 0 4px 4px;
-}
-
 .vitro-dropdown-button :global(.dropdown-menu) :global(.dropdown-item):hover,
 .vitro-dropdown-button :global(.dropdown-menu) :global(.dropdown-item):focus,
 .vitro-dropdown-button :global(.dropdown-menu) :global(.dropdown-item):active {

package/css/std/controls/expand-control-group/expand-control-group.css

@@ -1,39 +1,17 @@
-.vitro-title {
-    cursor: pointer;
-    color: #222D44;
-    font-size: 12pt;
-    padding: 2px 0 8px 0;
-    -webkit-touch-callout: none;
-    -webkit-user-select: none;
-    -khtml-user-select: none;
-    -moz-user-select: none;
-    -ms-user-select: none;
-    user-select: none;
-    position: relative;
+.vitro-expand-control-group {
+    width: 100%;
+    display: flex;
+    flex-direction: column;
 }
 
-.vitro-expand-collapse-button {
-    vertical-align: middle;
-    margin-right: 8px;
-    margin-top: -2px;
-    width: 12px;
-    height: 12px;
+.vitro-expand-control-group.vitro-top {
+    flex-direction: column-reverse;
 }
 
-.vitro-expand-control-group > .vitro-content {
-    margin: 8px 0 16px 0;
+.vitro-expand-control-group :global(.vitro-content) {
+    width: 100%;
 }
 
 .vitro-display-none {
-    display: none;
-}
-
-.vitro-right.vitro-button-collapse,
-.vitro-right.vitro-button-expand {
-    vertical-align: middle;
-    width: 12px;
-    height: 12px;
-    margin-right: 35px !important;
-    margin-top: 2px !important;
-    float: right !important;
-}
+    display: none !important;
+}

package/css/std/controls/field-iterator/field-iterator.css

@@ -1,4 +1,12 @@
-:global(.vitro-inline) {
+.vitro-field-iterator {
+    padding-top: 10px;
+    display: flex;
+    flex-wrap: wrap;
+    grid-gap: 0 16px;
+    align-content: flex-start;
+}
+
+.vitro-field-iterator :global(.vitro-inline) {
     display: inline-flex;
     flex: 1 1;
     min-width: 180px;
@@ -6,18 +14,58 @@
     flex-basis: 40%;
 }
 
-:global(.vitro-inline) > div {
+.vitro-field-iterator :global(.vitro-inline) > div {
     width: 100%;
 }
 
-:global(.vitro-block) {
+.vitro-field-iterator :global(.vitro-block) {
     width: 100%;
 }
 
-:global(.vitro-block):nth-child(2) {
-    margin-top: 8px;
+.vitro-field-iterator :global(.vitro-block):last-child > div > div {
+    margin-bottom: 0;
+}
+
+.vitro-expand-control-group {
+    padding-bottom: 36px;
+}
+
+.vitro-expand-control-group:global(.vitro-collapsed) {
+    margin-top: -10px;
+}
+
+.vitro-expand-control-group button,
+.vitro-expand-control-group button:hover,
+.vitro-expand-control-group button:active,
+.vitro-expand-control-group button:focus {
+    width: 100%;
+    height: 36px;
+    background-color: #F3F8FF;
+    display: flex;
+    flex-direction: row-reverse;
+    justify-content: center;
+    color: #4A556C;
+    gap: 4px;
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    border-radius: 0 0 4px 4px;
+}
+
+.vitro-collapse,
+.vitro-expand {
+    height: 20px;
+    width: 20px;
+    flex-shrink: 0;
+    background-size: 100%;
+    background-position: center;
+    background-repeat: no-repeat;
+}
+
+.vitro-expand {
+    background-image: url('@vitrosoftware/common-ui-ts/css/std/controls/field-iterator/img/collapse-bottom.svg');
 }
 
-:global(.vitro-block):last-child > div > div {
-    margin: 0;
+.vitro-collapse {
+    background-image: url('@vitrosoftware/common-ui-ts/css/std/controls/field-iterator/img/collapse-up.svg');
 }

package/css/std/controls/field-iterator/img/collapse-bottom.svg

@@ -0,0 +1,4 @@
+<svg width="21" height="20" viewBox="0 0 21 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M14.5 6.11032L10.5 9.44287L6.5 6.11032" stroke="#4A556C" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M14.5 10.5571L10.5 13.8896L6.5 10.5571" stroke="#4A556C" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/css/std/controls/field-iterator/img/collapse-up.svg

@@ -0,0 +1,4 @@
+<svg width="21" height="20" viewBox="0 0 21 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M14.5 13.8897L10.5 10.5571L6.5 13.8897" stroke="#4A556C" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M14.5 9.4429L10.5 6.11035L6.5 9.4429" stroke="#4A556C" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/css/std/controls/input/input.css

@@ -9,7 +9,7 @@
     width: 100%;
     min-height: 40px;
     padding: 8px 16px;
-    background: #fff;
+    background: transparent;
     border: 1px solid #C0CAD5;
     border-radius: 4px;
     width: 100%;

package/css/std/controls/message-input/message-input.css

@@ -111,7 +111,9 @@
 }
 
 .vitro-attached-file-list :global(.ps) > div:first-child {
-    grid-gap: 12px;
+    display: flex;
+    flex-wrap: wrap;
+    gap: 12px;
 }
 
 .vitro-flex :global(.ps) > div:first-child {

package/css/std/controls/search/search.css

@@ -26,18 +26,14 @@
     width: 449px;
 }
 
-.vitro-filter :global(.ps) {
+.vitro-scrollbar {
     max-height: 300px;
 }
 
-.vitro-filter :global(.ps.ps--active-y) {
+.vitro-scrollbar:global(.ps--active-y) {
     padding-right: 14px;
 }
 
-.vitro-filter :global(.vitro-block:last-child) > div > div {
-    margin-bottom: 0;
-}
-
 .vitro-add-field {
     position: relative;
     margin-bottom: 16px;

package/css/std/controls/tab-group/tab-group.css

@@ -25,14 +25,6 @@
     display: flex;
 }
 
-.vitro-tab :global(.ps) > div:first-child {
-    padding: 22px 16px 0 16px;
-    display: flex;
-    flex-wrap: wrap;
-    grid-gap: 0 16px;
-    align-content: flex-start;
-}
-
 .vitro-tab :global(.nav) :global(.dropdown-menu) {
     color: #222D44;
     font-family: 'InterRegular';

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

@@ -3,9 +3,16 @@
     overflow: hidden;
 }
 
-.vitro-view-part {
+.vitro-view :global(.vitro-view-part) {
     width: 100%;
-    flex-grow: 1;
+}
+
+.vitro-view :global(.vitro-view-part) :global(.ps) > div:first-child {
+    padding: 22px 16px 0 16px;
+    display: flex;
+    flex-wrap: wrap;
+    grid-gap: 0 16px;
+    align-content: flex-start;
 }
 
 .vitro-tab :global(.nav) {
@@ -15,3 +22,9 @@
 .vitro-tab > :global(.vitro-content) {
     overflow: hidden;
 }
+
+.vitro-content {
+    padding: 22px 16px 0 16px;
+    display: flex;
+    flex-direction: column;
+}

package/dist/index.css

@@ -1888,16 +1888,20 @@ html, body {
     background-position: center;
     background-image: url('@vitrosoftware/common-ui-ts/css/std/controls/action-handler/img/save-blue.svg');
 }
-._view-part_vitro-view-part_3j_gZpl:last-child {
-    flex-grow: 1;
-    max-height: 100%;
-}
 ._dropdown-button_vitro-dropdown-button_1myvkhB {
     display: flex;
     align-items: center;
     font-family: 'InterRegular';
 }
 
+._dropdown-button_vitro-dropdown-button_1myvkhB .ps {
+    border-radius: 4px;
+}
+
+._dropdown-button_vitro-dropdown-button_1myvkhB .ps > div:first-child {
+    padding: 0 !important;
+}
+
 ._dropdown-button_vitro-dropdown-button_1myvkhB button,
 ._dropdown-button_vitro-dropdown-button_1myvkhB button:hover,
 ._dropdown-button_vitro-dropdown-button_1myvkhB button:active,
@@ -2003,14 +2007,6 @@ html, body {
     box-sizing: border-box;
 }
 
-._dropdown-button_vitro-dropdown-button_1myvkhB .dropdown-item:first-child {
-    border-radius: 4px 4px 0 0;
-}
-
-._dropdown-button_vitro-dropdown-button_1myvkhB .dropdown-item:last-child {
-    border-radius: 0 0 4px 4px;
-}
-
 ._dropdown-button_vitro-dropdown-button_1myvkhB .dropdown-menu .dropdown-item:hover,
 ._dropdown-button_vitro-dropdown-button_1myvkhB .dropdown-menu .dropdown-item:focus,
 ._dropdown-button_vitro-dropdown-button_1myvkhB .dropdown-menu .dropdown-item:active {
@@ -2050,14 +2046,6 @@ html, body {
     display: flex;
 }
 
-._tab-group_vitro-tab_1Qb50HL .ps > div:first-child {
-    padding: 22px 16px 0 16px;
-    display: flex;
-    flex-wrap: wrap;
-    grid-gap: 0 16px;
-    align-content: flex-start;
-}
-
 ._tab-group_vitro-tab_1Qb50HL .nav .dropdown-menu {
     color: #222D44;
     font-family: 'InterRegular';
@@ -2149,6 +2137,10 @@ html, body {
     border-bottom: 2px solid #3274E0;
 }
 
+._view-part_vitro-view-part_3j_gZpl:last-child {
+    flex-grow: 1;
+    max-height: 100%;
+}
 ._control-group_vitro-control_2h_sXQv {
     padding: 0 !important;
     width: 100%;
@@ -2182,9 +2174,16 @@ html, body {
     overflow: hidden;
 }
 
-._view_vitro-view-part_X1Zzk97 {
+._view_vitro-view_1NKb-kU .vitro-view-part {
     width: 100%;
-    flex-grow: 1;
+}
+
+._view_vitro-view_1NKb-kU .vitro-view-part .ps > div:first-child {
+    padding: 22px 16px 0 16px;
+    display: flex;
+    flex-wrap: wrap;
+    grid-gap: 0 16px;
+    align-content: flex-start;
 }
 
 ._view_vitro-tab_2sqf0L9 .nav {
@@ -2195,6 +2194,12 @@ html, body {
     overflow: hidden;
 }
 
+._view_vitro-content_17HzDlb {
+    padding: 22px 16px 0 16px;
+    display: flex;
+    flex-direction: column;
+}
+
 ._label_vitro-label_it8WNUE {
     font-size: inherit;
     margin-left: 0;
@@ -2233,7 +2238,7 @@ html, body {
     width: 100%;
     min-height: 40px;
     padding: 8px 16px;
-    background: #fff;
+    background: transparent;
     border: 1px solid #C0CAD5;
     border-radius: 4px;
     width: 100%;
@@ -3475,6 +3480,7 @@ html, body {
 .k-picker-wrap {
     border-radius: 4px !important;
     border: 1px solid #C0CAD5 !important;
+    background-color: transparent !important;
 }
 
 .k-picker-wrap.k-state-focused,
@@ -5906,7 +5912,9 @@ li:first-child ._command-menu-item_vitro-item_2pVhk23:hover {
 }
 
 ._message-input_vitro-attached-file-list_l95S4VR .ps > div:first-child {
-    grid-gap: 12px;
+    display: flex;
+    flex-wrap: wrap;
+    gap: 12px;
 }
 
 ._message-input_vitro-flex_18M_7xU .ps > div:first-child {
@@ -6029,18 +6037,6 @@ li:first-child ._command-menu-item_vitro-item_2pVhk23:hover {
     margin-bottom: 28px;
 }
 
-._criterion_vitro-criterion-container_2cYcSkL:first-child {
-    margin-top: 10px;
-}
-
-._criterion_vitro-criterion-container_2cYcSkL:last-child {
-    margin-bottom: 18px;
-}
-
-._criterion_vitro-block_3E9-RXM:last-child ._criterion_vitro-criterion-container_2cYcSkL {
-    margin-bottom: 18px;
-}
-
 ._criterion_vitro-control_2JLaybj {
     position: relative;
 }
@@ -6360,7 +6356,32 @@ li:first-child ._command-menu-item_vitro-item_2pVhk23:hover {
         background-color: #DCEEFF;
     }
 }
-.vitro-inline {
+._expand-control-group_vitro-expand-control-group_1qSUMoN {
+    width: 100%;
+    display: flex;
+    flex-direction: column;
+}
+
+._expand-control-group_vitro-expand-control-group_1qSUMoN._expand-control-group_vitro-top_pV-8fhr {
+    flex-direction: column-reverse;
+}
+
+._expand-control-group_vitro-expand-control-group_1qSUMoN .vitro-content {
+    width: 100%;
+}
+
+._expand-control-group_vitro-display-none_Zs_5rQL {
+    display: none !important;
+}
+._field-iterator_vitro-field-iterator_2zUPyUF {
+    padding-top: 10px;
+    display: flex;
+    flex-wrap: wrap;
+    grid-gap: 0 16px;
+    align-content: flex-start;
+}
+
+._field-iterator_vitro-field-iterator_2zUPyUF .vitro-inline {
     display: inline-flex;
     flex: 1 1;
     min-width: 180px;
@@ -6368,20 +6389,60 @@ li:first-child ._command-menu-item_vitro-item_2pVhk23:hover {
     flex-basis: 40%;
 }
 
-.vitro-inline > div {
+._field-iterator_vitro-field-iterator_2zUPyUF .vitro-inline > div {
     width: 100%;
 }
 
-.vitro-block {
+._field-iterator_vitro-field-iterator_2zUPyUF .vitro-block {
     width: 100%;
 }
 
-.vitro-block:nth-child(2) {
-    margin-top: 8px;
+._field-iterator_vitro-field-iterator_2zUPyUF .vitro-block:last-child > div > div {
+    margin-bottom: 0;
 }
 
-.vitro-block:last-child > div > div {
-    margin: 0;
+._field-iterator_vitro-expand-control-group_3R-v8Nb {
+    padding-bottom: 36px;
+}
+
+._field-iterator_vitro-expand-control-group_3R-v8Nb.vitro-collapsed {
+    margin-top: -10px;
+}
+
+._field-iterator_vitro-expand-control-group_3R-v8Nb button,
+._field-iterator_vitro-expand-control-group_3R-v8Nb button:hover,
+._field-iterator_vitro-expand-control-group_3R-v8Nb button:active,
+._field-iterator_vitro-expand-control-group_3R-v8Nb button:focus {
+    width: 100%;
+    height: 36px;
+    background-color: #F3F8FF;
+    display: flex;
+    flex-direction: row-reverse;
+    justify-content: center;
+    color: #4A556C;
+    gap: 4px;
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    border-radius: 0 0 4px 4px;
+}
+
+._field-iterator_vitro-collapse_SZoovCi,
+._field-iterator_vitro-expand_ToLTBVI {
+    height: 20px;
+    width: 20px;
+    flex-shrink: 0;
+    background-size: 100%;
+    background-position: center;
+    background-repeat: no-repeat;
+}
+
+._field-iterator_vitro-expand_ToLTBVI {
+    background-image: url('@vitrosoftware/common-ui-ts/css/std/controls/field-iterator/img/collapse-bottom.svg');
+}
+
+._field-iterator_vitro-collapse_SZoovCi {
+    background-image: url('@vitrosoftware/common-ui-ts/css/std/controls/field-iterator/img/collapse-up.svg');
 }
 
 ._search_vitro-search_QkJksC_ {
@@ -6412,18 +6473,14 @@ li:first-child ._command-menu-item_vitro-item_2pVhk23:hover {
     width: 449px;
 }
 
-._search_vitro-filter_2n-Y-mS .ps {
+._search_vitro-scrollbar_3Xg3VXI {
     max-height: 300px;
 }
 
-._search_vitro-filter_2n-Y-mS .ps.ps--active-y {
+._search_vitro-scrollbar_3Xg3VXI.ps--active-y {
     padding-right: 14px;
 }
 
-._search_vitro-filter_2n-Y-mS .vitro-block:last-child > div > div {
-    margin-bottom: 0;
-}
-
 ._search_vitro-add-field_2hHt1Z2 {
     position: relative;
     margin-bottom: 16px;
@@ -7008,44 +7065,6 @@ li:first-child ._command-menu-item_vitro-item_2pVhk23:hover {
 .vitro-task-detail-group {
     padding: 16px;
 }
-._expand-control-group_vitro-title_3nqqfyQ {
-    cursor: pointer;
-    color: #222D44;
-    font-size: 12pt;
-    padding: 2px 0 8px 0;
-    -webkit-touch-callout: none;
-    -webkit-user-select: none;
-    -moz-user-select: none;
-    user-select: none;
-    position: relative;
-}
-
-._expand-control-group_vitro-expand-collapse-button_hBX5TTj {
-    vertical-align: middle;
-    margin-right: 8px;
-    margin-top: -2px;
-    width: 12px;
-    height: 12px;
-}
-
-._expand-control-group_vitro-expand-control-group_1qSUMoN > ._expand-control-group_vitro-content_2UPEUhm {
-    margin: 8px 0 16px 0;
-}
-
-._expand-control-group_vitro-display-none_Zs_5rQL {
-    display: none;
-}
-
-._expand-control-group_vitro-right_jD5r2aS._expand-control-group_vitro-button-collapse_14wEdB1,
-._expand-control-group_vitro-right_jD5r2aS._expand-control-group_vitro-button-expand_bwV3dXl {
-    vertical-align: middle;
-    width: 12px;
-    height: 12px;
-    margin-right: 35px !important;
-    margin-top: 2px !important;
-    float: right !important;
-}
-
 ._radio_vitro-control_1pRRp6K {
     width: 100%;
     position: relative;