@itcase/ui 1.8.62 → 1.8.64

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

@@ -1,21 +1,20 @@
 .search {
 }
-.search {
-  &_shape {
-    &_rounded {
-      border-radius: var(--search-shape-rounded);
-      position: relative;
-    }
-  }
-}
+
 .search-input {
   position: relative;
   overflow: hidden;
   display: flex;
   justify-content: center;
   &__icon {
-    display: flex;
-    align-items: center;
+    &-before {
+      display: flex;
+      align-items: center;
+    }
+    &-after {
+      display: flex;
+      align-items: center;
+    }
   }
   &__wrapper {
     width: 100%;
@@ -62,31 +61,8 @@
     z-index: 2;
     transform: translate(0, -50%);
   }
-  &&_state_focus,
-  &&_state_filled {
-    ^&__input {
-      &-wrapper {
-        left: 0;
-      }
-    }
-  }
-}
-@keyframes searchPlaceHolderHide {
-  from {
-    opacity: 100%;
-  }
-  to {
-    opacity: 0%;
-  }
-}
-.search-input {
-  &_shape {
-    &_rounded {
-      border-radius: var(--search-input-shape-rounded);
-      position: relative;
-    }
-  }
 }
+
 .search-input {
   &_size {
     @each $size in xxl, xl, l, m, s, xs, xxs {
@@ -98,6 +74,7 @@
     }
   }
 }
+
 .search-input {
   &&_skeleton {
     background-size: 200% !important;
@@ -114,6 +91,7 @@
     }
   }
 }
+
 @keyframes searchInput {
   0% {
     background-position: 200%;
@@ -122,20 +100,14 @@
     background-position: -200%;
   }
 }
+
 .search-result {
   width: 100%;
   &__wrapper {
     width: 100%;
   }
 }
-.search-result {
-  &_shape {
-    &_rounded {
-      border-radius: 6px;
-      position: relative;
-    }
-  }
-}
+
 :root {
   --search-input-xxl-padding: 16px 12px;
   --search-input-xxl-gap: 4px;

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

@@ -4,8 +4,14 @@
   display: flex;
   justify-content: center;
   &__icon {
-    display: flex;
-    align-items: center;
+    &-before {
+      display: flex;
+      align-items: center;
+    }
+    &-after {
+      display: flex;
+      align-items: center;
+    }
   }
   &__wrapper {
     width: 100%;
@@ -52,21 +58,4 @@
     z-index: 2;
     transform: translate(0, -50%);
   }
-  &&_state_focus,
-  &&_state_filled {
-    ^&__input {
-      &-wrapper {
-        left: 0;
-      }
-    }
-  }
-}
-
-@keyframes searchPlaceHolderHide {
-  from {
-    opacity: 100%;
-  }
-  to {
-    opacity: 0%;
-  }
 }

package/dist/css/components/Tile/Tile.css

@@ -17,16 +17,6 @@
     }
   }
 }
-.tile {
-  &_shape {
-    &_rounded {
-      border-radius: var(--tile-shape-rounded);
-    }
-    &_circular {
-      border-radius: 50%;
-    }
-  }
-}
 .tile {
   &_size {
     @each $size in xl, l, m, s, xs, xxs {
@@ -77,8 +67,6 @@
   }
 }
 :root {
-  --tile-shape-rounded: 0;
-
   --tile-size-xxl-min-width: 400px;
   --tile-size-xxl-padding: 24px;
   --tile-size-xxl-gap: 24px;

package/dist/css/components/Title/Title.css

@@ -27,7 +27,6 @@
     background-position: -200%;
   }
 }
-/* stylelint-disable prettier/prettier */
 .title {
   &_size {
     @each $size in h1, h2, h3, h4, h5, h6 {
@@ -35,6 +34,7 @@
         padding: 0;
         margin: 0;
         display: flex;
+        gap: 8px;
         @mixin $(size);
         ^^&__wrapper {
           gap: var(--title-size-$(size)-gap);

package/dist/types/components/Badge/appearance/badgeShape.d.ts

@@ -5,7 +5,7 @@ declare const badgeAppearanceShape: {
     rounded: {
         shape: string;
     };
-    roundedL: {
+    roundedS: {
         shape: string;
         shapeStrength: string;
     };
@@ -13,7 +13,7 @@ declare const badgeAppearanceShape: {
         shape: string;
         shapeStrength: string;
     };
-    roundedS: {
+    roundedL: {
         shape: string;
         shapeStrength: string;
     };

package/dist/types/components/Button/appearance/buttonShape.d.ts

@@ -5,7 +5,7 @@ declare const buttonAppearanceShape: {
     rounded: {
         shape: string;
     };
-    roundedL: {
+    roundedS: {
         shape: string;
         shapeStrength: string;
     };
@@ -13,7 +13,7 @@ declare const buttonAppearanceShape: {
         shape: string;
         shapeStrength: string;
     };
-    roundedS: {
+    roundedL: {
         shape: string;
         shapeStrength: string;
     };

package/dist/types/components/Label/appearance/labelShape.d.ts

@@ -5,7 +5,7 @@ declare const labelAppearanceShape: {
     rounded: {
         shape: string;
     };
-    roundedL: {
+    roundedS: {
         shape: string;
         shapeStrength: string;
     };
@@ -13,7 +13,7 @@ declare const labelAppearanceShape: {
         shape: string;
         shapeStrength: string;
     };
-    roundedS: {
+    roundedL: {
         shape: string;
         shapeStrength: string;
     };

package/dist/types/components/Search/appearance/searchShape.d.ts

@@ -0,0 +1,25 @@
+declare const searchAppearanceShape: {
+    circular: {
+        shape: string;
+    };
+    rounded: {
+        shape: string;
+    };
+    roundedS: {
+        shape: string;
+        shapeStrength: string;
+    };
+    roundedM: {
+        shape: string;
+        shapeStrength: string;
+    };
+    roundedL: {
+        shape: string;
+        shapeStrength: string;
+    };
+    roundedXL: {
+        shape: string;
+        shapeStrength: string;
+    };
+};
+export { searchAppearanceShape };

package/dist/types/components/Tile/appearance/tileShape.d.ts

@@ -0,0 +1,25 @@
+declare const tileAppearanceShape: {
+    circular: {
+        shape: string;
+    };
+    rounded: {
+        shape: string;
+    };
+    roundedS: {
+        shape: string;
+        shapeStrength: string;
+    };
+    roundedM: {
+        shape: string;
+        shapeStrength: string;
+    };
+    roundedL: {
+        shape: string;
+        shapeStrength: string;
+    };
+    roundedXL: {
+        shape: string;
+        shapeStrength: string;
+    };
+};
+export { tileAppearanceShape };

package/dist/types/components/Tile/appearance/tileStyle.d.ts

@@ -1,15 +1,13 @@
 declare const tileAppearanceStyle: {
-    full: {
-        borderColor: string;
-    };
-    ghost: {
-        fill: string;
+    solid: {
         borderColor: string;
     };
     outlined: {
         fill: string;
     };
-    solid: {
+    full: {};
+    ghost: {
+        fill: string;
         borderColor: string;
     };
 };

package/dist/types/components/Tile/appearance/tileSurface.d.ts

@@ -4,6 +4,7 @@ declare const tileAppearanceSurface: {
         fillHover: string;
         titleTextColor: string;
         descTextColor: string;
+        borderColor: string;
         badgeAppearance: string;
         iconFillIcon: string;
     };
@@ -12,6 +13,7 @@ declare const tileAppearanceSurface: {
         fillHover: string;
         titleTextColor: string;
         descTextColor: string;
+        borderColor: string;
         badgeAppearance: string;
         iconFillIcon: string;
     };
@@ -20,6 +22,7 @@ declare const tileAppearanceSurface: {
         fillHover: string;
         titleTextColor: string;
         descTextColor: string;
+        borderColor: string;
         badgeAppearance: string;
         iconFillIcon: string;
     };
@@ -28,6 +31,7 @@ declare const tileAppearanceSurface: {
         fillHover: string;
         titleTextColor: string;
         descTextColor: string;
+        borderColor: string;
         badgeAppearance: string;
         iconFillIcon: string;
     };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@itcase/ui",
-  "version": "1.8.62",
+  "version": "1.8.64",
   "description": "UI components (Modal, Loader, Popup, etc)",
   "keywords": [
     "Modal",

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

@@ -1,8 +0,0 @@
-.search-input {
-  &_shape {
-    &_rounded {
-      border-radius: var(--search-input-shape-rounded);
-      position: relative;
-    }
-  }
-}

package/dist/css/components/Search/css/search-result/search-result_shape.css

@@ -1,8 +0,0 @@
-.search-result {
-  &_shape {
-    &_rounded {
-      border-radius: 6px;
-      position: relative;
-    }
-  }
-}