@vitrosoftware/common-ui-ts 1.1.84 → 1.1.86

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

@@ -37,8 +37,7 @@
     background-size: 100%;
     background-position: center;
     margin-right: 8px;
-    /* search.svg URL-encoder for SVG */
-    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='circum:search'%3E%3Cpath id='Vector' d='M18.3236 18.8832C18.6858 19.2434 19.2449 18.6875 18.8827 18.3351L15.9297 15.3909C16.9656 14.2512 17.5381 12.7692 17.5361 11.233C17.5361 7.79544 14.725 5 11.2681 5C7.81118 5 5 7.79544 5 11.233C5 14.6705 7.81118 17.4659 11.2681 17.4659C12.8272 17.4659 14.2682 16.8943 15.3707 15.9468L18.3236 18.8832ZM5.78666 11.233C5.78666 8.22611 8.25136 5.78304 11.2673 5.78304C14.2911 5.78304 16.7479 8.22611 16.7479 11.233C16.7479 14.2398 14.2911 16.6829 11.2673 16.6829C8.25136 16.6829 5.78666 14.2398 5.78666 11.233Z' fill='%23222D44'/%3E%3C/g%3E%3C/svg%3E");
+    background-image: url('@vitrosoftware/common-ui-ts/css/std/controls/search/img/search.svg');
 }
 
 .vitro-button-search:hover,
@@ -71,8 +70,7 @@
 
 .vitro-button-settings {
     border-radius: 4px;
-    /* search-settings.svg URL-encoder for SVG */
-    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='iconamoon:options-thin'%3E%3Cg id='Group'%3E%3Cpath id='Vector' d='M5.60156 8.80469H12.8016M16.0016 8.80469H18.4016M11.2016 15.2047H18.4016M5.60156 15.2047H8.00156' stroke='%23222D44' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath id='Vector_2' d='M9.6 16.8016C10.4837 16.8016 11.2 16.0852 11.2 15.2016C11.2 14.3179 10.4837 13.6016 9.6 13.6016C8.71634 13.6016 8 14.3179 8 15.2016C8 16.0852 8.71634 16.8016 9.6 16.8016Z' stroke='%23222D44'/%3E%3Cpath id='Vector_3' d='M14.4047 10.4031C15.2883 10.4031 16.0047 9.68678 16.0047 8.80313C16.0047 7.91947 15.2883 7.20312 14.4047 7.20312C13.521 7.20312 12.8047 7.91947 12.8047 8.80313C12.8047 9.68678 13.521 10.4031 14.4047 10.4031Z' stroke='%23222D44'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A");
+    background-image: url('@vitrosoftware/common-ui-ts/css/std/controls/search/img/search-settings.svg');
 }
 
 .vitro-button-settings.vitro-active,
@@ -81,8 +79,7 @@
 }
 
 .vitro-button-cancel {
-    /* cancel-black.svg URL-encoder for SVG */
-    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6.75781 17.2438L12.0008 12.0008L17.2438 17.2438M17.2438 6.75781L11.9998 12.0008L6.75781 6.75781' stroke='%23222D44' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
+    background-image: url('@vitrosoftware/common-ui-ts/css/std/controls/search/img/cancel-black.svg');
 }
 
 .vitro-search-value {
@@ -107,8 +104,7 @@
 
 .vitro-search-value .vitro-button-cancel {
     margin: 0;
-    /* close.svg URL-encoder for SVG */
-    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='iconoir:cancel'%3E%3Cpath id='Vector' d='M6.75781 17.2438L12.0008 12.0008L17.2438 17.2438M17.2438 6.75781L11.9998 12.0008L6.75781 6.75781' stroke='%234A556C' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/g%3E%3C/svg%3E%0A");
+    background-image: url('@vitrosoftware/common-ui-ts/css/std/controls/search/img/cancel-dark-grey.svg');
 }
 
 @media (max-width: 800px) {

package/css/std/controls/sidebar/img/bottom-menu-button-more.svg

@@ -0,0 +1,5 @@
+<svg viewBox="0 0 41 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<circle cx="10.5" cy="20" r="2.5" transform="rotate(-90 10.5 20)" fill="#4A556C"/>
+<circle cx="20.5" cy="20" r="2.5" transform="rotate(-90 20.5 20)" fill="#4A556C"/>
+<circle cx="30.5" cy="20" r="2.5" transform="rotate(-90 30.5 20)" fill="#4A556C"/>
+</svg>

package/css/std/controls/sidebar/img/collapse-bottom-black.svg

@@ -0,0 +1 @@
+<svg viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M13 6L8 11L3 6' stroke='#222D44' stroke-linecap='round' stroke-linejoin='round'/></svg>

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

@@ -0,0 +1,3 @@
+<svg viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'>
+	<path d='M13 6L8 11L3 6' stroke='#326AD6' stroke-linecap='round' stroke-linejoin='round'/>
+</svg>

package/css/std/controls/sidebar/img/list-marker-active.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<circle cx="12" cy="12" r="3" fill="#326AD6"/>
+</svg>

package/css/std/controls/sidebar/img/list-marker.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<circle cx="12" cy="12" r="3" fill="#222D44"/>
+</svg>

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

@@ -1,61 +1,132 @@
-.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;
+}
+
+.vitro-image {
+    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;
 }
 
-:global(.toggled.pinned) .vitro-icon-text {
-    display: inline-block;
+.vitro-item-text {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
 }
 
 .vitro-item-text {
-    display: none;
+    color: #222D44;
+    font-size: 14px;
 }
 
 .vitro-active {
-    background-color: #DCEEFF;
+    background-color: #DCEEFF !important;
 }
 
-.vitro-hover .vitro-icon-text {
+.vitro-hover .vitro-item-text {
     color: #326AD6;
 }
 
-ul > li:last-child > ul > li:last-child .vitro-active {
-    background-color: transparent;
-}
-
-.vitro-active .vitro-icon-text,
 .vitro-active .vitro-item-text {
     color: #326AD6;
     font-weight: 500;
     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;
+    background-image: url('@vitrosoftware/common-ui-ts/css/std/controls/sidebar/img/list-marker.svg');
+}
+
+.vitro-group-item > .vitro-item-list > .vitro-item > .vitro-active::before,
+.vitro-group-item > .vitro-item-list > .vitro-item > .vitro-hover::before {
+    background-image: url('@vitrosoftware/common-ui-ts/css/std/controls/sidebar/img/list-marker-active.svg');
+}
+
+.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('@vitrosoftware/common-ui-ts/css/std/controls/sidebar/img/collapse-bottom-black.svg');
+}
+
+.vitro-expanded {
+    transform: rotateX(180deg);
+}
+
+.vitro-active .vitro-expanded,
+.vitro-hover .vitro-expanded,
+.vitro-active .vitro-collapsed,
+.vitro-hover .vitro-collapsed {
+    content: url('@vitrosoftware/common-ui-ts/css/std/controls/sidebar/img/collapse-bottom-blue.svg');
+}
+
+.vitro-display-none {
+    display: none;
 }
 
 :global(.vitro-bottom-menu) .vitro-item-text {
@@ -64,14 +135,16 @@ ul > li:last-child > ul > li:last-child .vitro-active {
     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-image {
+    margin-right: 0;
 }
 
 :global(.vitro-bottom-menu) .vitro-active {
-    background: transparent;
+    background: transparent !important;
     position: relative;
 }
 
@@ -86,17 +159,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 +176,98 @@ 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;
+    background-image: url('@vitrosoftware/common-ui-ts/css/std/controls/sidebar/img/list-marker.svg');
+}
+
+.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;
 }
 
@@ -92,8 +105,7 @@
     background-size: 100%;
     background-position: center;
     background-repeat: no-repeat;
-    /* bottom-menu-button-more.svg URL-encoder for SVG */
-    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 41 40' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='10.5' cy='20' r='2.5' transform='rotate(-90 10.5 20)' fill='%234A556C'/%3E%3Ccircle cx='20.5' cy='20' r='2.5' transform='rotate(-90 20.5 20)' fill='%234A556C'/%3E%3Ccircle cx='30.5' cy='20' r='2.5' transform='rotate(-90 30.5 20)' fill='%234A556C'/%3E%3C/svg%3E%0A");
+    background-image: url('@vitrosoftware/common-ui-ts/css/std/controls/sidebar/img/bottom-menu-button-more.svg');
 }
 
 .vitro-button-more:hover,

package/css/std/controls/splitter/img/splitter-handle-bar-drag.svg

@@ -0,0 +1,6 @@
+<svg viewBox="0 0 6 30" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="Spliter">
+<path id="Rectangle 4359" d="M0 0H4.5C5.32843 0 6 0.671573 6 1.5V28.5C6 29.3284 5.32843 30 4.5 30H0V0Z" fill="#326AD6"/>
+<path id="Polygon 3" d="M1.5 12.911C1.5 12.6251 1.80945 12.4464 2.05701 12.5894L5.12058 14.3581C5.36814 14.501 5.36814 14.8584 5.12058 15.0013L2.05701 16.7701C1.80945 16.913 1.5 16.7343 1.5 16.4485L1.5 12.911Z" fill="white"/>
+</g>
+</svg>

package/css/std/controls/splitter/splitter.css

@@ -44,8 +44,7 @@
 
 :global(.handle-bar_drag)::after {
     left: 3px;
-    /* splitter-handle-bar-drag.svg URL-encoder for SVG */
-    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 6 30' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='Spliter'%3E%3Cpath id='Rectangle 4359' d='M0 0H4.5C5.32843 0 6 0.671573 6 1.5V28.5C6 29.3284 5.32843 30 4.5 30H0V0Z' fill='%23326AD6'/%3E%3Cpath id='Polygon 3' d='M1.5 12.911C1.5 12.6251 1.80945 12.4464 2.05701 12.5894L5.12058 14.3581C5.36814 14.501 5.36814 14.8584 5.12058 15.0013L2.05701 16.7701C1.80945 16.913 1.5 16.7343 1.5 16.4485L1.5 12.911Z' fill='white'/%3E%3C/g%3E%3C/svg%3E%0A");
+    background-image: url('@vitrosoftware/common-ui-ts/css/std/controls/splitter/img/splitter-handle-bar-drag.svg');
 }
 
 :global(.pane.vertical.primary) {

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

@@ -9,10 +9,10 @@
     justify-content: center;
 }
 
-    .vitro-tab > :global(.vitro-content) {
-        position: relative;
-        height: 100%;
-    }
+.vitro-tab > :global(.vitro-content) {
+    position: relative;
+    height: 100%;
+}
 
 .vitro-tab > :global(.vitro-content) > :global(.container),
 .vitro-tab > :global(.vitro-content) > :global(.container) > div {
@@ -43,8 +43,6 @@
     box-shadow: 0px 4px 14px 0px rgba(0, 0, 0, 0.18), 0px 0px 4px 0px rgba(0, 0, 0, 0.14);
 }
 
-
-
 .vitro-tab :global(.nav) :global(.dropdown-item) {
     padding: 8px 12px;
 }

package/css/std/controls/table-view/img/cancel-grey.svg

@@ -0,0 +1,3 @@
+<svg viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M4.50781 11.4946L8.00315 7.99924L11.4985 11.4946M11.4985 4.50391L8.00248 7.99924L4.50781 4.50391" stroke="#8E98A3" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/css/std/controls/table-view/img/cancel-white.svg

@@ -0,0 +1,3 @@
+<svg width="60" height="60" viewBox="0 0 60 60" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M16.8906 43.1056L29.9981 29.9981L43.1056 43.1056M43.1056 16.8906L29.9956 29.9981L16.8906 16.8906" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/css/std/controls/table-view/img/check.svg

@@ -0,0 +1,10 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="check-one /Line/Black" clip-path="url(#clip0_2166_122689)">
+<path id="Vector" d="M4 8L7 11L12 6" stroke="#222D44" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+<defs>
+<clipPath id="clip0_2166_122689">
+<rect width="16" height="16" fill="white"/>
+</clipPath>
+</defs>
+</svg>

package/css/std/controls/table-view/img/checkbox-active.svg

@@ -0,0 +1,4 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="4" y="4" width="16" height="16" rx="2" fill="#4292F7"/>
+<path d="M15.765 9.20474C16.0661 9.48915 16.0797 9.96383 15.7953 10.265L11.5453 14.765C11.4061 14.9123 11.2133 14.997 11.0107 14.9999C10.8081 15.0028 10.6129 14.9236 10.4697 14.7803L8.21967 12.5303C7.92678 12.2374 7.92678 11.7626 8.21967 11.4697C8.51256 11.1768 8.98744 11.1768 9.28033 11.4697L10.9846 13.174L14.7047 9.23503C14.9891 8.9339 15.4638 8.92033 15.765 9.20474Z" fill="white"/>
+</svg>

package/css/std/controls/table-view/img/checkbox-big-active.svg

@@ -0,0 +1,4 @@
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="2" y="2" width="20" height="20" rx="2.5" fill="#4292F7"/>
+<path d="M16.7062 8.50593C17.0826 8.86144 17.0996 9.45479 16.7441 9.83121L11.4316 15.4562C11.2577 15.6404 11.0166 15.7463 10.7634 15.7499C10.5101 15.7535 10.2662 15.6545 10.0871 15.4754L7.27459 12.6629C6.90847 12.2968 6.90847 11.7032 7.27459 11.3371C7.6407 10.971 8.2343 10.971 8.60041 11.3371L10.7308 13.4675L15.3809 8.54379C15.7364 8.16737 16.3298 8.15042 16.7062 8.50593Z" fill="white"/>
+</svg>

package/css/std/controls/table-view/img/checkbox-big-empty.svg

@@ -0,0 +1,5 @@
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="Checkbox-big">
+<rect id="Background" x="2.5" y="2.5" width="19" height="19" rx="3.5" stroke="#C0CAD5"/>
+</g>
+</svg>

package/css/std/controls/table-view/img/checkbox-big-undetermined.svg

@@ -0,0 +1,4 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="7" y="7" width="10" height="10" rx="1" fill="#4292F7"/>
+<rect x="2.625" y="2.625" width="18.75" height="18.75" rx="1.875" stroke="#C0CAD5" stroke-width="1.25"/>
+</svg>

package/css/std/controls/table-view/img/checkbox-empty.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="4.5" y="4.5" width="15" height="15" rx="1.5" stroke="#C0CAD5"/>
+</svg>

package/css/std/controls/table-view/img/collapse-bottom-black.svg

@@ -0,0 +1,5 @@
+<svg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'>
+	<g id='Chevron-tree-down'>
+		<path id='Vector 9' d='M17 10L12 15L7 10' stroke='#222D44' stroke-linecap='round' stroke-linejoin='round'/>
+	</g>
+</svg>

package/css/std/controls/table-view/img/collapse-right-grey.svg

@@ -0,0 +1,3 @@
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M9.5 7L14.5 12L9.5 17" stroke="#8E98A3" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/css/std/controls/table-view/img/dropdown-menu-arrow.svg

@@ -0,0 +1 @@
+<svg viewBox='0 0 44 42' fill='none' xmlns='http://www.w3.org/2000/svg'><g filter='url(#filter0_dd_778_105705)'><path 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'/></g><defs><filter id='filter0_dd_778_105705' x='0.109375' y='0.730469' width='43.7812' height='41.2695' filterUnits='userSpaceOnUse' color-interpolation-filters='sRGB'><feFlood flood-opacity='0' result='BackgroundImageFix'/><feColorMatrix 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'/><feOffset dy='4'/><feGaussianBlur stdDeviation='7'/><feComposite in2='hardAlpha' operator='out'/><feColorMatrix type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.18 0'/><feBlend mode='normal' in2='BackgroundImageFix' result='effect1_dropShadow_778_105705'/><feColorMatrix 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'/><feOffset/><feGaussianBlur stdDeviation='2'/><feComposite in2='hardAlpha' operator='out'/><feColorMatrix type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.14 0'/><feBlend mode='normal' in2='effect1_dropShadow_778_105705' result='effect2_dropShadow_778_105705'/><feBlend mode='normal' in='SourceGraphic' in2='effect2_dropShadow_778_105705' result='shape'/></filter></defs></svg>

package/css/std/controls/table-view/img/filter/filter-cancel-white.svg

@@ -0,0 +1,4 @@
+<svg width="16" height="17" viewBox="0 0 16 17" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect y="0.203125" width="16" height="16" rx="2" fill="white"/>
+<path d="M3.80469 12.3966L7.99909 8.20221L12.1935 12.3966M12.1935 4.00781L7.99829 8.20221L3.80469 4.00781" stroke="#4A556C" stroke-width="0.8" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/css/std/controls/table-view/img/filter/filter-contains-white.svg

@@ -0,0 +1,8 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect width="16" height="16" rx="2" transform="matrix(-1 0 0 1 16 0)" fill="white"/>
+<path d="M7.99609 12.7969L7.99609 3.19687" stroke="#4A556C" stroke-width="0.8" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M9.59844 3.19531H6.39844" stroke="#4A556C" stroke-width="0.8" stroke-linecap="round"/>
+<path d="M9.59844 12.7969H6.39844" stroke="#4A556C" stroke-width="0.8" stroke-linecap="round"/>
+<path d="M6.16234 7.85987C6.26901 7.92146 6.26901 8.07542 6.16234 8.137L4.24234 9.24551C4.13568 9.3071 4.00234 9.23012 4.00234 9.10695L4.00234 6.88993C4.00234 6.76676 4.13568 6.68978 4.24234 6.75136L6.16234 7.85987Z" fill="#4A556C"/>
+<path d="M9.84156 7.85987C9.7349 7.92146 9.7349 8.07542 9.84156 8.137L11.7616 9.24551C11.8682 9.3071 12.0016 9.23012 12.0016 9.10695L12.0016 6.88993C12.0016 6.76676 11.8682 6.68978 11.7616 6.75136L9.84156 7.85987Z" fill="#4A556C"/>
+</svg>

package/css/std/controls/table-view/img/filter/filter-contains.svg

@@ -0,0 +1,7 @@
+<svg width="20" height="21" viewBox="0 0 20 21" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M10 16.5L10 4.5" stroke="#4A556C" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M12 4.5H8" stroke="#4A556C" stroke-linecap="round"/>
+<path d="M12 16.5H8" stroke="#4A556C" stroke-linecap="round"/>
+<path d="M7.7 10.3268C7.83333 10.4038 7.83333 10.5962 7.7 10.6732L5.3 12.0588C5.16667 12.1358 5 12.0396 5 11.8856L5 9.11436C5 8.9604 5.16667 8.86417 5.3 8.94115L7.7 10.3268Z" fill="#4A556C"/>
+<path d="M12.3 10.3268C12.1667 10.4038 12.1667 10.5962 12.3 10.6732L14.7 12.0588C14.8333 12.1358 15 12.0396 15 11.8856L15 9.11436C15 8.9604 14.8333 8.86417 14.7 8.94115L12.3 10.3268Z" fill="#4A556C"/>
+</svg>

package/css/std/controls/table-view/img/filter/filter-ends-in-white.svg

@@ -0,0 +1,7 @@
+<svg width="16" height="17" viewBox="0 0 16 17" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect width="16" height="16" rx="2" transform="matrix(-1 0 0 1 16 0.398438)" fill="white"/>
+<path d="M7.99609 13.1953L7.99609 3.59531" stroke="#4A556C" stroke-width="0.8" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M9.59844 3.59375H6.39844" stroke="#4A556C" stroke-width="0.8" stroke-linecap="round"/>
+<path d="M9.59844 13.1953H6.39844" stroke="#4A556C" stroke-width="0.8" stroke-linecap="round"/>
+<path d="M6.15844 8.25831C6.2651 8.31989 6.2651 8.47386 6.15844 8.53544L4.23844 9.64395C4.13177 9.70554 3.99844 9.62856 3.99844 9.50539L3.99844 7.28836C3.99844 7.16519 4.13177 7.08821 4.23844 7.1498L6.15844 8.25831Z" fill="#4A556C"/>
+</svg>

package/css/std/controls/table-view/img/filter/filter-ends-in.svg

@@ -0,0 +1,6 @@
+<svg width="20" height="21" viewBox="0 0 20 21" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M10 16.5L10 4.5" stroke="#4A556C" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M12 4.5H8" stroke="#4A556C" stroke-linecap="round"/>
+<path d="M12 16.5H8" stroke="#4A556C" stroke-linecap="round"/>
+<path d="M7.7 10.3268C7.83333 10.4038 7.83333 10.5962 7.7 10.6732L5.3 12.0588C5.16667 12.1358 5 12.0396 5 11.8856L5 9.11436C5 8.9604 5.16667 8.86417 5.3 8.94115L7.7 10.3268Z" fill="#4A556C"/>
+</svg>

package/css/std/controls/table-view/img/filter/filter-equal-white.svg

@@ -0,0 +1,5 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect width="16" height="16" rx="2" fill="white"/>
+<path d="M3.19922 6H12.7992" stroke="#4A556C" stroke-width="0.8" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M3.19922 10H12.7992" stroke="#4A556C" stroke-width="0.8" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/css/std/controls/table-view/img/filter/filter-equal.svg

@@ -0,0 +1,4 @@
+<svg width="20" height="21" viewBox="0 0 20 21" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M4 8H16" stroke="#4A556C" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M4 13H16" stroke="#4A556C" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/css/std/controls/table-view/img/filter/filter-math-equal-lower-white.svg

@@ -0,0 +1,5 @@
+<svg width="16" height="17" viewBox="0 0 16 17" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect y="0.398438" width="16" height="16" rx="2" fill="white"/>
+<path d="M12.7992 11.3984L3.19922 7.3971L12.7992 3.39844" stroke="#4A556C" stroke-width="0.8" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M3.19922 13.3984L12.7992 13.3984" stroke="#4A556C" stroke-width="0.8" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/css/std/controls/table-view/img/filter/filter-math-equal-lower.svg

@@ -0,0 +1,4 @@
+<svg width="20" height="21" viewBox="0 0 20 21" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M16 14.5L4 9.49833L16 4.5" stroke="#4A556C" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M4 17.5L16 17.5" stroke="#4A556C" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/css/std/controls/table-view/img/filter/filter-math-equal-more-white.svg

@@ -0,0 +1,5 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect width="16" height="16" rx="2" transform="matrix(-1 0 0 1 16 0)" fill="white"/>
+<path d="M3.20078 11L12.8008 6.99866L3.20078 3" stroke="#4A556C" stroke-width="0.8" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M12.8008 13L3.20078 13" stroke="#4A556C" stroke-width="0.8" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/css/std/controls/table-view/img/filter/filter-math-equal-more.svg

@@ -0,0 +1,4 @@
+<svg width="20" height="21" viewBox="0 0 20 21" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M4 14.5L16 9.49833L4 4.5" stroke="#4A556C" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M16 17.5L4 17.5" stroke="#4A556C" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>