@itcase/ui 1.8.0 → 1.8.3

package/dist/css/components/Dropdown/Dropdown.css

@@ -1,6 +1,9 @@
 .dropdown {
   position: relative;
   display: flex;
+  &__wrapper {
+    width: 100%;
+  }
 }
 .dropdown {
   &_animation {
@@ -17,29 +20,15 @@
   }
 }
 .dropdown {
-  &_set {
-    &_default {
-      ^^&__wrapper {
-        padding: var(--dropdown-default-padding);
-        display: flex;
-        flex-direction: column;
-        gap: var(--dropdown-default-gap);
-      }
-    }
-    &_normal {
-      ^^&__wrapper {
-        padding: var(--dropdown-normal-padding);
-        display: flex;
-        flex-direction: column;
-        gap: var(--dropdown-normal-gap);
-      }
-    }
-    &_compact {
-      ^^&__wrapper {
-        padding: var(--dropdown-compact-padding);
-        display: flex;
-        flex-direction: column;
-        gap: var(--dropdown-compact-gap);
+  &_size {
+    @each $size in xxl, xl, l, m, s, xs, xxs {
+      &_$(size) {
+        ^^&__wrapper {
+          padding: var(--dropdown-$(size)-padding);
+          display: flex;
+          flex-direction: column;
+          gap: var(--dropdown-$(size)-gap);
+        }
       }
     }
   }
@@ -57,13 +46,15 @@
 }
 .dropdown {
   &_state_close {
-    visibility: hidden;
+    /* visibility: hidden; */
+    display: none;
     opacity: 0%;
   }
 }
 .dropdown {
   &&_state_open {
-    visibility: visible;
+    /* visibility: visible; */
+    display: block;
     opacity: 100%;
   }
 }
@@ -101,7 +92,7 @@
 .dropdown {
   &__item {
     &_size {
-      @each $size in xxl, xl, l, m, s, xs, xxs {
+      @each $size in xs, s, l {
         &_$(size) {
           ^^&-wrapper {
             gap: var(--dropdown-item-size-$(size)-gap);
@@ -128,15 +119,30 @@
   }
 }
 :root {
+  /* Default */
+  --dropdown-default-padding: 0;
+  --dropdown-default-gap: 0;
+
+  /* Common */
+  --dropdown-shape-rounded: 0;
+  --dropdown-item-shape-rounded: 0;
+  --dropdown-item-width-fixed: 0;
+  --dropdown-compact-padding: 0;
+  --dropdown-compact-gap: 0;
+
+  /* Sizes XS */
   --dropdown-item-size-xs-padding: 0;
   --dropdown-item-size-xs-gap: 8px;
 
-  --dropdown-item-size-m-padding: 0px;
-  --dropdown-item-size-m-gap: 0px;
+  /* Sizes M */
+  --dropdown-item-size-s-padding: 0px;
+  --dropdown-item-size-s-gap: 0px;
 
+  /* Sizes L */
   --dropdown-item-size-l-padding: 10px 12px;
   --dropdown-item-size-l-gap: 12px;
 
+  /* Normal */
   --dropdown-normal-padding: 16px;
   --dropdown-normal-gap: 16px;
 }

package/dist/css/components/Grid/Grid.css

@@ -1,7 +1,7 @@
 .grid {
-  display: grid;
   width: 100%;
   position: relative;
+  display: grid;
   &__before {
     position: relative;
     overflow: hidden;
@@ -22,8 +22,8 @@
     max-width: var(--max);
     margin: 0 auto;
     &-inner {
-      display: grid;
       position: relative;
+      display: grid;
     }
     ^&__item {
       position: relative;
@@ -38,9 +38,9 @@
   }
 }
 .grid {
-  @each $val in auto, normal, stretch, center, start, end, space-around, space-between, space-evenly,
-    safe center, unsafe center, self-start, self-end, first, baseline, first, baseline,
-    last baseline {
+  @each $val in auto, normal, stretch, center, start, end, space-around,
+    space-between, space-evenly, safe center, unsafe center, self-start,
+    self-end, first, baseline, first, baseline, last baseline {
     &_align-content_$(val) {
       align-content: $(val);
     }
@@ -50,7 +50,18 @@
   }
 }
 .grid {
-  @each $val in 1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31,32,33,34,35,36,37,38,39,40,41,42,43,44,45,46,47,48,49,50,51,52,53,54,55,56,57,58,59,60,61,62,63,64,65,66,67,68,69,70,71,72,73,74,75,76,77,78,79,80,81,82,83,84,85,86,87,88,89,90,91,92,93,94,95,96,97,98,99,100,101,102,103,104,105,106,107,108,109,110,111,112,113,114,115,116,117,118,119,120,121,122,123,124,125,126,127,128,129,130,131,132,133,134,135,136,137,138,139,140,141,142,143,144,145,146,147,148,149,150,151,152,153,154,155,156,157,158,159,160,161,162,163,164,165,166,167,168,169,170,171,172,173,174,175,176,177,178,179,180,181,182,183,184,185,186,187,188,189,190,191,192,193,194,195,196,197,198,199,200 {
+  @each $val in 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18,
+    19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31, 32, 33, 34, 35, 36, 37,
+    38, 39, 40, 41, 42, 43, 44, 45, 46, 47, 48, 49, 50, 51, 52, 53, 54, 55, 56,
+    57, 58, 59, 60, 61, 62, 63, 64, 65, 66, 67, 68, 69, 70, 71, 72, 73, 74, 75,
+    76, 77, 78, 79, 80, 81, 82, 83, 84, 85, 86, 87, 88, 89, 90, 91, 92, 93, 94,
+    95, 96, 97, 98, 99, 100, 101, 102, 103, 104, 105, 106, 107, 108, 109, 110,
+    111, 112, 113, 114, 115, 116, 117, 118, 119, 120, 121, 122, 123, 124, 125,
+    126, 127, 128, 129, 130, 131, 132, 133, 134, 135, 136, 137, 138, 139, 140,
+    141, 142, 143, 144, 145, 146, 147, 148, 149, 150, 151, 152, 153, 154, 155,
+    156, 157, 158, 159, 160, 161, 162, 163, 164, 165, 166, 167, 168, 169, 170,
+    171, 172, 173, 174, 175, 176, 177, 178, 179, 180, 181, 182, 183, 184, 185,
+    186, 187, 188, 189, 190, 191, 192, 193, 194, 195, 196, 197, 198, 199, 200 {
     &_columns_$(val) {
       grid-template-columns: repeat($(val), 1fr);
       & > ^&__wrapper {
@@ -101,7 +112,18 @@
   }
 }
 .grid {
-  @each $val in 1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31,32,33,34,35,36,37,38,39,40,41,42,43,44,45,46,47,48,49,50,51,52,53,54,55,56,57,58,59,60,61,62,63,64,65,66,67,68,69,70,71,72,73,74,75,76,77,78,79,80,81,82,83,84,85,86,87,88,89,90,91,92,93,94,95,96,97,98,99,100,101,102,103,104,105,106,107,108,109,110,111,112,113,114,115,116,117,118,119,120,121,122,123,124,125,126,127,128,129,130,131,132,133,134,135,136,137,138,139,140,141,142,143,144,145,146,147,148,149,150,151,152,153,154,155,156,157,158,159,160,161,162,163,164,165,166,167,168,169,170,171,172,173,174,175,176,177,178,179,180,181,182,183,184,185,186,187,188,189,190,191,192,193,194,195,196,197,198,199,200 {
+  @each $val in 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18,
+    19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31, 32, 33, 34, 35, 36, 37,
+    38, 39, 40, 41, 42, 43, 44, 45, 46, 47, 48, 49, 50, 51, 52, 53, 54, 55, 56,
+    57, 58, 59, 60, 61, 62, 63, 64, 65, 66, 67, 68, 69, 70, 71, 72, 73, 74, 75,
+    76, 77, 78, 79, 80, 81, 82, 83, 84, 85, 86, 87, 88, 89, 90, 91, 92, 93, 94,
+    95, 96, 97, 98, 99, 100, 101, 102, 103, 104, 105, 106, 107, 108, 109, 110,
+    111, 112, 113, 114, 115, 116, 117, 118, 119, 120, 121, 122, 123, 124, 125,
+    126, 127, 128, 129, 130, 131, 132, 133, 134, 135, 136, 137, 138, 139, 140,
+    141, 142, 143, 144, 145, 146, 147, 148, 149, 150, 151, 152, 153, 154, 155,
+    156, 157, 158, 159, 160, 161, 162, 163, 164, 165, 166, 167, 168, 169, 170,
+    171, 172, 173, 174, 175, 176, 177, 178, 179, 180, 181, 182, 183, 184, 185,
+    186, 187, 188, 189, 190, 191, 192, 193, 194, 195, 196, 197, 198, 199, 200 {
     &_rows_$(val) {
       grid-template-columns: repeat($(val), 1fr);
       & > ^&__wrapper {
@@ -178,7 +200,19 @@
 }
 .grid {
   &__item {
-    @each $val in -1,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31,32,33,34,35,36,37,38,39,40,41,42,43,44,45,46,47,48,49,50,51,52,53,54,55,56,57,58,59,60,61,62,63,64,65,66,67,68,69,70,71,72,73,74,75,76,77,78,79,80,81,82,83,84,85,86,87,88,89,90,91,92,93,94,95,96,97,98,99,100,101,102,103,104,105,106,107,108,109,110,111,112,113,114,115,116,117,118,119,120,121,122,123,124,125,126,127,128,129,130,131,132,133,134,135,136,137,138,139,140,141,142,143,144,145,146,147,148,149,150,151,152,153,154,155,156,157,158,159,160,161,162,163,164,165,166,167,168,169,170,171,172,173,174,175,176,177,178,179,180,181,182,183,184,185,186,187,188,189,190,191,192,193,194,195,196,197,198,199,200 {
+    @each $val in -1, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17,
+      18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31, 32, 33, 34, 35,
+      36, 37, 38, 39, 40, 41, 42, 43, 44, 45, 46, 47, 48, 49, 50, 51, 52, 53,
+      54, 55, 56, 57, 58, 59, 60, 61, 62, 63, 64, 65, 66, 67, 68, 69, 70, 71,
+      72, 73, 74, 75, 76, 77, 78, 79, 80, 81, 82, 83, 84, 85, 86, 87, 88, 89,
+      90, 91, 92, 93, 94, 95, 96, 97, 98, 99, 100, 101, 102, 103, 104, 105, 106,
+      107, 108, 109, 110, 111, 112, 113, 114, 115, 116, 117, 118, 119, 120, 121,
+      122, 123, 124, 125, 126, 127, 128, 129, 130, 131, 132, 133, 134, 135, 136,
+      137, 138, 139, 140, 141, 142, 143, 144, 145, 146, 147, 148, 149, 150, 151,
+      152, 153, 154, 155, 156, 157, 158, 159, 160, 161, 162, 163, 164, 165, 166,
+      167, 168, 169, 170, 171, 172, 173, 174, 175, 176, 177, 178, 179, 180, 181,
+      182, 183, 184, 185, 186, 187, 188, 189, 190, 191, 192, 193, 194, 195, 196,
+      197, 198, 199, 200 {
       &_column {
         &-start_$(val) {
           grid-column-start: $(val);
@@ -195,7 +229,10 @@
 }
 .grid {
   &__item {
-    @each $val in auto, legacy, normal, stretch, center, start, end, left, right, space-around, space-between, space-evenly, safe, center, unsafe center, self-start, self-end, left, right, baseline, first baseline, last baseline {
+    @each $val in auto, legacy, normal, stretch, center, start, end, left,
+      right, space-around, space-between, space-evenly, safe, center,
+      unsafe center, self-start, self-end, left, right, baseline,
+      first baseline, last baseline {
       &_justify-self_$(val) {
         justify-self: $(val);
       }
@@ -204,7 +241,8 @@
 }
 .grid {
   &__item {
-    @each $val in -1, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24 {
+    @each $val in -1, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17,
+      18, 19, 20, 21, 22, 23, 24 {
       &_row {
         &-start_$(val) {
           grid-row-start: $(val);
@@ -224,4 +262,17 @@
     display: grid;
     transition: var(--grid-row-transition);
   }
-}
+}
+:root {
+  --max: 0;
+  --grid-shape-rounded: 0;
+
+  /* Transition */
+  --grid-row-transition: all 0.2s ease 0s;
+  --grid-item-transition: all 0.2s ease 0s;
+
+  /* System */
+  --grid-system-margin: 0;
+  --grid-system-columns: 0;
+  --grid-system-gutter: 0;
+}

package/dist/css/components/Grid/css/__item/grid__item_column.css

@@ -1,6 +1,18 @@
 .grid {
   &__item {
-    @each $val in -1,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31,32,33,34,35,36,37,38,39,40,41,42,43,44,45,46,47,48,49,50,51,52,53,54,55,56,57,58,59,60,61,62,63,64,65,66,67,68,69,70,71,72,73,74,75,76,77,78,79,80,81,82,83,84,85,86,87,88,89,90,91,92,93,94,95,96,97,98,99,100,101,102,103,104,105,106,107,108,109,110,111,112,113,114,115,116,117,118,119,120,121,122,123,124,125,126,127,128,129,130,131,132,133,134,135,136,137,138,139,140,141,142,143,144,145,146,147,148,149,150,151,152,153,154,155,156,157,158,159,160,161,162,163,164,165,166,167,168,169,170,171,172,173,174,175,176,177,178,179,180,181,182,183,184,185,186,187,188,189,190,191,192,193,194,195,196,197,198,199,200 {
+    @each $val in -1, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17,
+      18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31, 32, 33, 34, 35,
+      36, 37, 38, 39, 40, 41, 42, 43, 44, 45, 46, 47, 48, 49, 50, 51, 52, 53,
+      54, 55, 56, 57, 58, 59, 60, 61, 62, 63, 64, 65, 66, 67, 68, 69, 70, 71,
+      72, 73, 74, 75, 76, 77, 78, 79, 80, 81, 82, 83, 84, 85, 86, 87, 88, 89,
+      90, 91, 92, 93, 94, 95, 96, 97, 98, 99, 100, 101, 102, 103, 104, 105, 106,
+      107, 108, 109, 110, 111, 112, 113, 114, 115, 116, 117, 118, 119, 120, 121,
+      122, 123, 124, 125, 126, 127, 128, 129, 130, 131, 132, 133, 134, 135, 136,
+      137, 138, 139, 140, 141, 142, 143, 144, 145, 146, 147, 148, 149, 150, 151,
+      152, 153, 154, 155, 156, 157, 158, 159, 160, 161, 162, 163, 164, 165, 166,
+      167, 168, 169, 170, 171, 172, 173, 174, 175, 176, 177, 178, 179, 180, 181,
+      182, 183, 184, 185, 186, 187, 188, 189, 190, 191, 192, 193, 194, 195, 196,
+      197, 198, 199, 200 {
       &_column {
         &-start_$(val) {
           grid-column-start: $(val);

package/dist/css/components/Grid/css/__item/grid__item_justify-self.css

@@ -1,6 +1,9 @@
 .grid {
   &__item {
-    @each $val in auto, legacy, normal, stretch, center, start, end, left, right, space-around, space-between, space-evenly, safe, center, unsafe center, self-start, self-end, left, right, baseline, first baseline, last baseline {
+    @each $val in auto, legacy, normal, stretch, center, start, end, left,
+      right, space-around, space-between, space-evenly, safe, center,
+      unsafe center, self-start, self-end, left, right, baseline,
+      first baseline, last baseline {
       &_justify-self_$(val) {
         justify-self: $(val);
       }

package/dist/css/components/Grid/css/__item/grid__item_row.css

@@ -1,6 +1,7 @@
 .grid {
   &__item {
-    @each $val in -1, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24 {
+    @each $val in -1, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17,
+      18, 19, 20, 21, 22, 23, 24 {
       &_row {
         &-start_$(val) {
           grid-row-start: $(val);

package/dist/css/components/Group/Group.css

@@ -158,7 +158,7 @@
       ^^&__wrapper {
         overflow: hidden scroll;
         display: flex;
-      flex-direction: column;
+        flex-direction: column;
       }
     }
     &_horizontal {

package/dist/css/components/Icon/Icon.css

@@ -140,4 +140,10 @@
   --icon-transition: all 0.2s ease 0s;
   --icon-size-24-badge-position: 12px, 12px;
   --icon-shape-rounded: 6px;
+
+  /* Size */
+  @each $size, $value in (14, 16, 20, 24, 32, 40, 56, 60, 72),
+    (14px, 16px, 20px, 24px, 32px, 40px, 56px, 60px, 72px) {
+    --icon-size-$(size)-badge-position: $value;
+  }
 }

package/dist/css/components/Input/Input.css

@@ -19,10 +19,6 @@
   &:focus {
     outline: none;
   }
-  &:hover {
-    background: var(--input-state-hover-background);
-    border: solid 1px var(--input-state-hover-border);
-  }
 }
 .input {
   &_shape {
@@ -40,7 +36,7 @@
 }
 .input {
   &&_size {
-    @each $size in xxl, xl, l, m, s, xs, xxs, normal, tiny, compact, large {
+    @each $size in xxl, xl, l, m, s, xs, xxs {
       &_$(size) {
         padding: var(--input-size-$(size)-padding);
       }
@@ -76,7 +72,7 @@
 :root {
   --input-shape-rounded: 8px;
 
-  --input-size-xs-padding: 1px 8px;
+  /* Size */
   --input-size-s-padding: 5px 10px;
   --input-size-m-padding: 7px 12px;
   --input-size-l-padding: 9px 15px;
@@ -85,6 +81,7 @@
 
   --input-caret-color: var(--color-accent-primary);
 
+  /* State */
   --input-state-success-background: none;
   --input-state-success-border: var(--color-success-border-primary);
   --input-state-focus-border: var(--color-surface-border-quaternary);
@@ -97,4 +94,8 @@
   --input-state-custom-background: none;
   --input-state-hover-border: var(--color-surface-border-quaternary);
   --input-state-hover-background: none;
+
+  /* Dosabled */
+  --input-state-disabled-background: none;
+  --input-state-disabled-border: none;
 }

package/dist/css/components/InputMask/{Input.css → InputMask.css}

@@ -1,4 +1,4 @@
-.input {
+.input-mask {
   min-width: unset;
   padding: 0;
   margin: 0;
@@ -38,7 +38,7 @@
     }
   }
 }
-.input {
+.input-mask {
   &_shape {
     &_rounded {
       border-radius: var(--input-shape-rounded);
@@ -52,7 +52,7 @@
     }
   }
 }
-.input {
+.input-mask {
   &&_size {
     @each $size in xxl, xl, l, m, s, xs, xxs, normal, tiny, compact, large {
       &_$(size) {
@@ -61,7 +61,7 @@
     }
   }
 }
-.input {
+.input-mask {
   &_type {
     &_number {
       appearance: none;

package/dist/css/components/InputPassword/InputPassword.css

@@ -88,4 +88,5 @@
   --input-password-state-hover-border: var(--color-surface-border-quaternary);
   --input-password-state-hover-background: none;
   --input-password-caret-color: var(--color-accent-primary);
+  --input-password-shape-rounded: 0;
 }

package/dist/css/components/Loader/Loader.css

@@ -102,4 +102,10 @@
   --loader-s-min-height: 24px;
   --loader-s-item: 6px;
   --loader-s-gap: 8px;
+
+  /* Rounded */
+  --loader-shape-rounded-default: 0;
+  @each $size, $value in (xxl, xl, l, m, s, xs, xxs), (0, 0, 0, 0, 0, 0, 0) {
+    --loader-$(size)-shape-rounded: $value;
+  }
 }

package/dist/css/components/Modal/Modal.css

@@ -38,5 +38,6 @@
   }
 }
 :root {
+  --modal-shape-rounded: 0;
   --modal-max-width: 450px;
 }

package/dist/css/components/ModalSheetBottom/ModalSheetBottom.css

@@ -34,3 +34,9 @@
     right: 8px;
   }
 }
+:root {
+  --modal-sheet-bottom-container-background: none;
+  --modal-sheet-bottom-container-border-radius: 0;
+  --modal-sheet-bottom-header-grabber: none;
+  --modal-sheet-bottom-backdrop: 0;
+}

package/dist/css/components/Pagination/Pagination.css

@@ -5,18 +5,21 @@
   align-items: center;
   &__container {
     padding: 0;
-    margin: 60px 0;
     display: flex;
     list-style: none;
-    gap: 16px;
+    gap: 12px;
   }
   &__count {
     display: flex;
     align-items: center;
+    gap: 8px;
+    &-text {
+      color: var(--surface-text-primary);
+      display: block;
+    }
   }
   &__input {
     background: var(--color-surface-primary);
-    padding: 3px 7px;
     border: solid 1px
       var(--pagination-input-color, --color-surface-border-tertiary);
     border-radius: 8px;
@@ -39,12 +42,11 @@
 }
 .pagination {
   &__container {
-    margin: var(--paginator-margin, initial);
+    margin: var(--paginator-margin);
     ^&__item {
-      min-width: var(--paginator-item-width);
-      min-height: var(--paginator-item-height);
+      width: var(--paginator-item-width);
+      height: var(--paginator-item-height);
       background: var(--paginator-item-default-fill);
-      padding: 0 8px;
       border: var(
         --paginator-item-border,
         solid 1px var(--paginator-item-default-border)
@@ -70,7 +72,7 @@
         display: flex;
         justify-content: center;
         align-items: center;
-        @mixin text-l;
+        @mixin text-m;
       }
     }
   }
@@ -80,10 +82,7 @@
     border: solid 1px var(--paginator-item-active-border);
     &&_state {
       &_active {
-        background: var(
-          --paginator-item-active-background,
-          var(--color-accent-primary)
-        );
+        background: var(--paginator-item-active-fill);
         &:hover {
           background: var(--paginator-item-active-fill-hover);
         }
@@ -121,6 +120,11 @@
   --paginator-item-height: 32px;
   --paginator-item-border: none;
   --paginator-item-border-radius: 50%;
+  --pagination-input-color: none;
+  --paginator-item-default-border: none;
+  --paginator-item-active-border: none;
+  --paginator-item-active-background: none;
+  --paginator-item-disabled-border: none;
 
   --pagination-item-state-disabled-display: none;
 

package/dist/css/components/Pagination/css/__item/pagination__item.css

@@ -1,11 +1,10 @@
 .pagination {
   &__container {
-    margin: var(--paginator-margin, initial);
+    margin: var(--paginator-margin);
     ^&__item {
-      min-width: var(--paginator-item-width);
-      min-height: var(--paginator-item-height);
+      width: var(--paginator-item-width);
+      height: var(--paginator-item-height);
       background: var(--paginator-item-default-fill);
-      padding: 0 8px;
       border: var(
         --paginator-item-border,
         solid 1px var(--paginator-item-default-border)
@@ -31,7 +30,7 @@
         display: flex;
         justify-content: center;
         align-items: center;
-        @mixin text-l;
+        @mixin text-m;
       }
     }
   }

package/dist/css/components/Pagination/css/__item/pagination__item_state_active.css

@@ -3,10 +3,7 @@
     border: solid 1px var(--paginator-item-active-border);
     &&_state {
       &_active {
-        background: var(
-          --paginator-item-active-background,
-          var(--color-accent-primary)
-        );
+        background: var(--paginator-item-active-fill);
         &:hover {
           background: var(--paginator-item-active-fill-hover);
         }

package/dist/css/components/Radio/Radio.css

@@ -115,4 +115,6 @@
 :root {
   --radio-state-border-hover: var(--color-surface-border-tertiary);
   --radio-success-border: var(--color-surface-border-tertiary);
+  --radio-shape-rounded: 0;
+  --radio-item-shape-rounded: 0;
 }

package/dist/css/components/Search/Search.css

@@ -1,10 +1,9 @@
 .search {
-
 }
 .search {
   &_shape {
     &_rounded {
-      border-radius: var(--search-shape-rounded, 6px);
+      border-radius: var(--search-shape-rounded);
       position: relative;
     }
   }
@@ -93,6 +92,7 @@
   &_size {
     @each $size in xxl, xl, l, m, s, xs, xxs {
       &_$(size) {
+        min-height: var(--search-input-$(size)-min-height);
         padding: var(--search-input-$(size)-padding);
         gap: var(--search-input-$(size)-gap);
       }
@@ -128,12 +128,15 @@
 
   --search-input-s-padding: 2px 7px;
   --search-input-s-gap: 6px;
+  --search-input-s-min-height: 32px;
 
   --search-input-xs-padding: 2px 7px;
   --search-input-xs-gap: 6px;
+  --search-input-xs-min-height: 24px;
 
   --search-input-xxs-padding: 2px 7px;
   --search-input-xxs-gap: 6px;
 
   --search-shape-rounded: 8px;
+  --search-input-shape-rounded: 0;
 }

package/dist/css/components/Search/css/search-input/search-input_size.css

@@ -2,6 +2,7 @@
   &_size {
     @each $size in xxl, xl, l, m, s, xs, xxs {
       &_$(size) {
+        min-height: var(--search-input-$(size)-min-height);
         padding: var(--search-input-$(size)-padding);
         gap: var(--search-input-$(size)-gap);
       }

package/dist/css/components/Segmented/Segmented.css

@@ -123,4 +123,7 @@
   --segmented-item-size-s-padding: 4px 16px;
   --segmented-item-size-xs-padding: 4px 16px;
   --segmented-item-size-xxs-padding: 4px 16px;
+
+  --segmented-active-width: 0;
+  --segmented-active-x-pos: 0;
 }

package/dist/css/components/Select/Select.css

@@ -397,4 +397,6 @@
   --select-menu-list-item-m-padding: 8px 12px;
   --select-menu-list-item-s-padding: 6px 10px;
   --select-menu-list-item-xs-padding: 2px 8px;
+
+  --select-multi-value-border-radius: 0;
 }

package/dist/css/components/Swiper/Swiper.css

@@ -1,5 +1,5 @@
 /**
- * Swiper 11.2.6
+ * Swiper 11.2.7
  * Most modern mobile touch slider and framework with hardware accelerated transitions
  * https://swiperjs.com
  *
@@ -7,7 +7,7 @@
  *
  * Released under the MIT License
  *
- * Released on: March 19, 2025
+ * Released on: May 19, 2025
  */
 
 /* FONT_START */
@@ -902,7 +902,7 @@ div.swiper-block__item {
 
 .swiper-block {
   &&_type_step {
-    height: 100%;
+    min-height: 100vh;
     ^&__swiper {
       height: 100%;
       display: flex;

package/dist/css/components/Tab/Tab.css

@@ -56,12 +56,12 @@ div.tab-reset {
 }
 .tab {
   &_size {
-    @each $size in normal, compact, xxl, xl, l, m, s, xs, xxs {
+    @each $size in xxl, xl, l, m, s, xs, xxs {
       &_$(size) {
         ^^&__wrapper {
+          padding: var(--tab-size-$(size)-padding);
           display: flex;
           align-items: center;
-          padding: var(--tab-size-$(size)-padding);
           gap: var(--tab-size-$(size)-gap);
         }
       }