@kivid/native-components 1.0.0-alpha.2 → 1.0.0-alpha.20

package/src/components/InformationStatus/components/GradientAdd/index.tsx

@@ -1,3 +1,4 @@
+import React from "react";
 import Svg, {
   Path,
   Defs,
@@ -11,64 +12,114 @@ import Svg, {
   G,
 } from "react-native-svg";
 import { GradientAddProps } from "./types";
+import { SizeEnum } from "../../../../enums";
+import { View } from "react-native";
 
-export function GradientAdd(props: GradientAddProps, ref?: React.Ref<Svg>) {
-  const { size = 24, color = "currentColor" } = props;
+export const GradientAdd = React.forwardRef((props: GradientAddProps, ref?: React.Ref<Svg>) => {
+  const { size = SizeEnum.MEDIUM, color = "currentColor", style, ...rest } = props;
+
+  const ICON_CONFIG = {
+    [SizeEnum.SMALL]: {
+      path: "M7.99999 2.66663C8.72036 2.66663 9.30434 3.26358 9.30434 3.99996V6.66663H12.029C12.7493 6.66663 13.3333 7.26358 13.3333 7.99996C13.3333 8.73634 12.7493 9.33329 12.029 9.33329H9.30434V12C9.30434 12.7363 8.72036 13.3333 7.99999 13.3333C7.27962 13.3333 6.69564 12.7363 6.69564 12V9.33329H3.971C3.25063 9.33329 2.66666 8.73634 2.66666 7.99996C2.66666 7.26358 3.25063 6.66663 3.971 6.66663H6.69564V3.99996C6.69564 3.26358 7.27962 2.66663 7.99999 2.66663Z",
+      viewBox: "0 0 16 16",
+      filter: {
+        id: "filter0_i_8151_1877",
+        x: "2.66666",
+        y: "2.66663",
+        width: "11.6667",
+        height: "11.6666",
+      },
+    },
+    [SizeEnum.MEDIUM]: {
+      path: "M12 4C13.0806 4 13.9565 4.89543 13.9565 6V10H18.0435C19.124 10 20 10.8954 20 12C20 13.1046 19.124 14 18.0435 14H13.9565V18C13.9565 19.1046 13.0806 20 12 20C10.9194 20 10.0435 19.1046 10.0435 18V14H5.95652C4.87596 14 4 13.1046 4 12C4 10.8954 4.87596 10 5.95652 10H10.0435V6C10.0435 4.89543 10.9194 4 12 4Z",
+      viewBox: "0 0 24 24",
+      filter: {
+        id: "filter0_i_8151_1873",
+        x: "4",
+        y: "4",
+        width: "17",
+        height: "17",
+      },
+    },
+    [SizeEnum.LARGE]: {
+      path: "M16 5.33337C17.4408 5.33337 18.6087 6.52728 18.6087 8.00004V13.3334H24.058C25.4987 13.3334 26.6667 14.5273 26.6667 16C26.6667 17.4728 25.4987 18.6667 24.058 18.6667H18.6087V24C18.6087 25.4728 17.4408 26.6667 16 26.6667C14.5593 26.6667 13.3913 25.4728 13.3913 24V18.6667H7.94204C6.5013 18.6667 5.33334 17.4728 5.33334 16C5.33334 14.5273 6.5013 13.3334 7.94204 13.3334H13.3913V8.00004C13.3913 6.52728 14.5593 5.33337 16 5.33337Z",
+      viewBox: "0 0 32 32",
+      filter: {
+        id: "filter0_i_8151_1881",
+        x: "5.33334",
+        y: "5.33337",
+        width: "22.3333",
+        height: "22.3334",
+      },
+    },
+  };
+
+  const SIZE_MAP = {
+    [SizeEnum.SMALL]: 16,
+    [SizeEnum.MEDIUM]: 24,
+    [SizeEnum.LARGE]: 32,
+  };
+
+  const config = ICON_CONFIG[size] || ICON_CONFIG[SizeEnum.MEDIUM];
+  const filterId = config.filter.id;
+  const iconSize = SIZE_MAP[size] || 24;
 
   return (
-    <Svg
-      viewBox="0 0 16 16"
-      fill="none"
-      width={size}
-      height={size}
-      color={color}
-      ref={ref}
-      {...props}
-    >
-      <G filter="url(#filter0_i_3359_12285)">
-        <Path
-          fillRule="evenodd"
-          clipRule="evenodd"
-          d="M7.99999 2.6665C8.72036 2.6665 9.30434 3.26346 9.30434 3.99984V6.6665H12.029C12.7493 6.6665 13.3333 7.26346 13.3333 7.99984C13.3333 8.73622 12.7493 9.33317 12.029 9.33317H9.30434V11.9998C9.30434 12.7362 8.72036 13.3332 7.99999 13.3332C7.27962 13.3332 6.69564 12.7362 6.69564 11.9998V9.33317H3.971C3.25063 9.33317 2.66666 8.73622 2.66666 7.99984C2.66666 7.26346 3.25063 6.6665 3.971 6.6665H6.69564V3.99984C6.69564 3.26346 7.27962 2.6665 7.99999 2.6665Z"
-          fill="currentColor"
-        />
-      </G>
-      <Defs>
-        <Filter
-          id="filter0_i_3359_12285"
-          x="2.66666"
-          y="2.6665"
-          width="11.6667"
-          height="11.6665"
-          filterUnits="userSpaceOnUse"
-        >
-          <FeFlood floodOpacity="0" result="BackgroundImageFix" />
-          <FeBlend
-            mode="normal"
-            in="SourceGraphic"
-            in2="BackgroundImageFix"
-            result="shape"
-          />
-          <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 dx="1" dy="1" />
-          <FeGaussianBlur stdDeviation="1" />
-          <FeComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1" />
-          <FeColorMatrix
-            type="matrix"
-            values="0 0 0 0 0.447059 0 0 0 0 0.403922 0 0 0 0 0.894118 0 0 0 0.4 0"
-          />
-          <FeBlend
-            mode="normal"
-            in2="shape"
-            result="effect1_innerShadow_3359_12285"
+    <View style={[{ width: iconSize, height: iconSize }, style]}>
+      <Svg
+        width="100%"
+        height="100%"
+        viewBox={config.viewBox}
+        fill="none"
+        color={color}
+        ref={ref}
+        {...rest}
+      >
+        <G filter={`url(#${filterId})`}>
+          <Path
+            fillRule="evenodd"
+            clipRule="evenodd"
+            d={config.path}
+            fill="currentColor"
           />
-        </Filter>
-      </Defs>
-    </Svg>
+        </G>
+        <Defs>
+          <Filter
+            id={filterId}
+            x={config.filter.x}
+            y={config.filter.y}
+            width={config.filter.width}
+            height={config.filter.height}
+            filterUnits="userSpaceOnUse"
+          >
+            <FeFlood floodOpacity="0" result="BackgroundImageFix" />
+            <FeBlend
+              mode="normal"
+              in="SourceGraphic"
+              in2="BackgroundImageFix"
+              result="shape"
+            />
+            <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 dx="1" dy="1" />
+            <FeGaussianBlur stdDeviation="1" />
+            <FeComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1" />
+            <FeColorMatrix
+              type="matrix"
+              values="0 0 0 0 0.447059 0 0 0 0 0.403922 0 0 0 0 0.894118 0 0 0 0.4 0"
+            />
+            <FeBlend
+              mode="normal"
+              in2="shape"
+              result={`effect1_innerShadow_${filterId}`}
+            />
+          </Filter>
+        </Defs>
+      </Svg>
+    </View>
   );
-}
+});

package/src/components/InformationStatus/components/GradientAdd/types.ts

@@ -1,6 +1,7 @@
 import { SvgProps } from "react-native-svg";
+import { SizeEnum } from "../../../../enums";
 
-export interface GradientAddProps extends SvgProps {
-  size?: number;
+export interface GradientAddProps extends Omit<SvgProps, "width" | "height"> {
+  size?: SizeEnum.SMALL | SizeEnum.MEDIUM | SizeEnum.LARGE;
   color?: string;
 }

package/src/components/InformationStatus/components/GradientAlert/index.tsx

@@ -1,3 +1,4 @@
+import React from "react";
 import Svg, {
   Path,
   Defs,
@@ -9,73 +10,126 @@ import Svg, {
   FeGaussianBlur,
   FeComposite,
   G,
-  SvgProps,
 } from "react-native-svg";
 import { GradientAlertProps } from "./types";
+import { SizeEnum } from "../../../../enums";
+import { View } from "react-native";
 
 export function GradientAlert(props: GradientAlertProps, ref?: React.Ref<Svg>) {
-  const { size = 24, color = "currentColor" } = props;
+  const { size = SizeEnum.MEDIUM, color = "currentColor", style, ...rest } = props;
+
+  const ICON_CONFIG = {
+    [SizeEnum.SMALL]: {
+      paths: [
+        "M8.00001 2C8.73638 2 9.33334 2.58216 9.33334 3.30028V9.36639C9.33334 10.0845 8.73638 10.6667 8.00001 10.6667C7.26363 10.6667 6.66667 10.0845 6.66667 9.36639V3.30028C6.66667 2.58216 7.26363 2 8.00001 2Z",
+        "M8.00001 11.3333C8.73638 11.3333 9.33334 11.9154 9.33334 12.6336V12.6997C9.33334 13.4178 8.73638 14 8.00001 14C7.26363 14 6.66667 13.4178 6.66667 12.6997V12.6336C6.66667 11.9154 7.26363 11.3333 8.00001 11.3333Z",
+      ],
+      viewBox: "0 0 16 16",
+      filter: {
+        id: "filter0_i_8151_1867",
+        x: "6.66667",
+        y: "2",
+        width: "3.66667",
+        height: "13",
+        colorMatrix:
+          "0 0 0 0 0.960784 0 0 0 0 0.541176 0 0 0 0 0.239216 0 0 0 0.4 0",
+      },
+    },
+
+    [SizeEnum.MEDIUM]: {
+      paths: [
+        "M12 3C13.1046 3 14 3.87323 14 4.95042V14.0496C14 15.1268 13.1046 16 12 16C10.8954 16 10 15.1268 10 14.0496V4.95042C10 3.87323 10.8954 3 12 3Z",
+        "M12 16.9999C13.1046 16.9999 14 17.8732 14 18.9503V19.0495C14 20.1267 13.1046 20.9999 12 20.9999C10.8954 20.9999 10 20.1267 10 19.0495V18.9503C10 17.8732 10.8954 16.9999 12 16.9999Z",
+      ],
+      viewBox: "0 0 24 24",
+      filter: {
+        id: "filter0_i_8151_1859",
+        x: "10",
+        y: "3",
+        width: "5",
+        height: "18.9999",
+        colorMatrix:
+          "0 0 0 0 0.960784 0 0 0 0 0.541176 0 0 0 0 0.239216 0 0 0 0.4 0",
+      },
+    },
+
+    [SizeEnum.LARGE]: {
+      paths: [
+        "M16 4C17.4728 4 18.6667 5.16431 18.6667 6.60056V18.7328C18.6667 20.169 17.4728 21.3333 16 21.3333C14.5272 21.3333 13.3333 20.169 13.3333 18.7328V6.60056C13.3333 5.16431 14.5272 4 16 4Z",
+        "M16 22.6666C17.4728 22.6666 18.6667 23.8309 18.6667 25.2671V25.3993C18.6667 26.8356 17.4728 27.9999 16 27.9999C14.5272 27.9999 13.3333 26.8356 13.3333 25.3993V25.2671C13.3333 23.8309 14.5272 22.6666 16 22.6666Z",
+      ],
+      viewBox: "0 0 32 32",
+      filter: {
+        id: "filter0_i_8151_1869",
+        x: "13.3333",
+        y: "4",
+        width: "6.33333",
+        height: "24.9999",
+        colorMatrix:
+          "0 0 0 0 0.960784 0 0 0 0 0.541176 0 0 0 0 0.239216 0 0 0 0.4 0",
+      },
+    },
+  };
+
+  const SIZE_MAP = {
+    [SizeEnum.SMALL]: 16,
+    [SizeEnum.MEDIUM]: 24,
+    [SizeEnum.LARGE]: 32,
+  };
+
+  const config = ICON_CONFIG[size] || ICON_CONFIG[SizeEnum.MEDIUM];
+  const { paths, viewBox, filter } = config;
+  const iconSize = SIZE_MAP[size] || 24;
+  const filterId = filter.id;
 
   return (
-    <Svg
-      viewBox="0 0 16 16"
-      fill="none"
-      width={size}
-      height={size}
-      color={color}
-      ref={ref}
-      {...props}
-    >
-      <G filter="url(#filter0_i_3359_12282)">
-        <Path
-          fillRule="evenodd"
-          clipRule="evenodd"
-          d="M8.00001 2C8.73638 2 9.33334 2.58216 9.33334 3.30028V9.36639C9.33334 10.0845 8.73638 10.6667 8.00001 10.6667C7.26363 10.6667 6.66667 10.0845 6.66667 9.36639V3.30028C6.66667 2.58216 7.26363 2 8.00001 2Z"
-          fill="currentColor"
-        />
-        <Path
-          fillRule="evenodd"
-          clipRule="evenodd"
-          d="M8.00001 11.3333C8.73638 11.3333 9.33334 11.9154 9.33334 12.6336V12.6997C9.33334 13.4178 8.73638 14 8.00001 14C7.26363 14 6.66667 13.4178 6.66667 12.6997V12.6336C6.66667 11.9154 7.26363 11.3333 8.00001 11.3333Z"
-          fill="currentColor"
-        />
-      </G>
-      <Defs>
-        <Filter
-          id="filter0_i_3359_12282"
-          x="6.66667"
-          y="2"
-          width="3.66667"
-          height="13"
-          filterUnits="userSpaceOnUse"
-        >
-          <FeFlood floodOpacity="0" result="BackgroundImageFix" />
-          <FeBlend
-            mode="normal"
-            in="SourceGraphic"
-            in2="BackgroundImageFix"
-            result="shape"
-          />
-          <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 dx="1" dy="1" />
-          <FeGaussianBlur stdDeviation="1" />
-          <FeComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1" />
-          <FeColorMatrix
-            type="matrix"
-            values="0 0 0 0 0.960784 0 0 0 0 0.541176 0 0 0 0 0.239216 0 0 0 0.4 0"
-          />
-          <FeBlend
-            mode="normal"
-            in2="shape"
-            result="effect1_innerShadow_3359_12282"
-          />
-        </Filter>
-      </Defs>
-    </Svg>
+    <View style={[{ width: iconSize, height: iconSize }, style]}>
+      <Svg
+        width="100%"
+        height="100%"
+        viewBox={viewBox}
+        fill="none"
+        color={color}
+        ref={ref}
+        {...rest}
+      >
+        <G filter={`url(#${filterId})`}>
+          {paths.map((d, i) => (
+            <Path
+              key={i}
+              fillRule="evenodd"
+              clipRule="evenodd"
+              d={d}
+              fill="currentColor"
+            />
+          ))}
+        </G>
+
+        <Defs>
+          <Filter
+            id={filter.id}
+            x={filter.x}
+            y={filter.y}
+            width={filter.width}
+            height={filter.height}
+            filterUnits="userSpaceOnUse"
+          >
+            <FeFlood floodOpacity="0" result="BackgroundImageFix" />
+            <FeBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape" />
+            <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 dx="1" dy="1" />
+            <FeGaussianBlur stdDeviation="1" />
+            <FeComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1" />
+            <FeColorMatrix type="matrix" values={filter.colorMatrix} />
+            <FeBlend mode="normal" in2="shape" result="effect1_innerShadow" />
+          </Filter>
+        </Defs>
+      </Svg>
+    </View>
   );
 }

package/src/components/InformationStatus/components/GradientAlert/types.ts

@@ -1,6 +1,7 @@
 import { SvgProps } from "react-native-svg";
+import { SizeEnum } from "../../../../enums";
 
-export interface GradientAlertProps extends SvgProps {
-  size?: number;
+export interface GradientAlertProps extends Omit<SvgProps, "width" | "height"> {
+  size?: SizeEnum.SMALL | SizeEnum.MEDIUM | SizeEnum.LARGE;
   color?: string;
 }

package/src/components/InformationStatus/components/GradientCheck/index.tsx

@@ -1,3 +1,4 @@
+import React from 'react';
 import Svg, {
   Path,
   Defs,
@@ -8,68 +9,119 @@ import Svg, {
   FeOffset,
   FeGaussianBlur,
   FeComposite,
-  G,
-  SvgProps,
-} from "react-native-svg";
-import { GradientCheckProps } from "./types";
+  G
+} from 'react-native-svg';
+import { GradientCheckProps } from './types';
+import { SizeEnum } from '../../../../enums';
+import { View } from 'react-native';
 
 export function GradientCheck(props: GradientCheckProps, ref?: React.Ref<Svg>) {
-  const { size = 24, color = "currentColor" } = props;
+  const { size = SizeEnum.MEDIUM, color = 'currentColor', style, ...rest } = props;
+
+  const ICON_CONFIG = {
+    [SizeEnum.SMALL]: {
+      path: "M12.8985 4.39037C13.4574 4.93089 13.4806 5.83095 12.9504 6.40072L7.97736 11.5567C7.71389 11.8398 7.34787 12.0001 6.96506 12C6.58225 11.9999 6.2163 11.8394 5.95297 11.5562L3.04912 8.40463C2.51919 7.8346 2.54288 6.93454 3.10203 6.3943C3.66118 5.85406 4.54404 5.87821 5.07397 6.44825L6.96589 8.51126L10.9265 4.44334C11.4567 3.87357 12.3396 3.84985 12.8985 4.39037Z",
+      viewBox: "0 0 16 16",
+      filter: {
+        id: "filter0_i_3359_12276",
+        x: "0",
+        y: "0",
+        width: "16",
+        height: "16"
+      }
+    },
+    [SizeEnum.MEDIUM]: {
+
+      path: "M19.3477 6.58556C20.186 7.39633 20.2209 8.74643 19.4256 9.60108L11.966 17.335C11.5708 17.7597 11.0218 18.0001 10.4476 18C9.87337 17.9999 9.32445 17.7591 8.92946 17.3342L4.57368 12.6069C3.77879 11.7519 3.81432 10.4018 4.65304 9.59146C5.49176 8.7811 6.81606 8.81732 7.61095 9.67237L10.4488 12.7669L16.3897 6.66501C17.185 5.81035 18.5094 5.77478 19.3477 6.58556Z",
+      viewBox: "0 0 24 24",
+      filter: {
+        id: "filter0_i_8151_259",
+        x: "4",
+        y: "6",
+        width: "17",
+        height: "13",
+      },
+    },
+
+    [SizeEnum.LARGE]: {
+      path: "M25.7969 8.78074C26.9147 9.86178 26.9612 11.6619 25.9008 12.8014L15.9547 23.1133C15.4278 23.6796 14.6957 24.0002 13.9301 24C13.1645 23.9998 12.4326 23.6789 11.9059 23.1123L6.09823 16.8093C5.03838 15.6692 5.08576 13.8691 6.20406 12.7886C7.32235 11.7081 9.08808 11.7564 10.1479 12.8965L13.9318 17.0225L21.853 8.88667C22.9134 7.74713 24.6791 7.69971 25.7969 8.78074Z",
+      viewBox: "0 0 32 32",
+      filter: {
+        id: "filter0_i_8151_249",
+        x: "5.33333",
+        y: "8",
+        width: "22.3333",
+        height: "17",
+      },
+    },
+  };
+
+  const SIZE_MAP = {
+    [SizeEnum.SMALL]: 16,
+    [SizeEnum.MEDIUM]: 24,
+    [SizeEnum.LARGE]: 32,
+  };
+
+  const config = ICON_CONFIG[size];
+  const filterId = config.filter.id;
+  const sizeMapped = SIZE_MAP[size];
 
   return (
-    <Svg
-      viewBox="0 0 16 16"
-      fill="none"
-      width={size}
-      height={size}
-      color={color}
-      ref={ref}
-      {...props}
-    >
-      <G filter="url(#filter0_i_3359_12276)">
-        <Path
-          fillRule="evenodd"
-          clipRule="evenodd"
-          d="M12.8985 4.39037C13.4574 4.93089 13.4806 5.83095 12.9504 6.40072L7.97736 11.5567C7.71389 11.8398 7.34787 12.0001 6.96506 12C6.58225 11.9999 6.2163 11.8394 5.95297 11.5562L3.04912 8.40463C2.51919 7.8346 2.54288 6.93454 3.10203 6.3943C3.66118 5.85406 4.54404 5.87821 5.07397 6.44825L6.96589 8.51126L10.9265 4.44334C11.4567 3.87357 12.3396 3.84985 12.8985 4.39037Z"
-          fill="currentColor"
-        />
-      </G>
-      <Defs>
-        <Filter
-          id="filter0_i_3359_12276"
-          x="2.66667"
-          y="4"
-          width="11.6667"
-          height="9"
-          filterUnits="userSpaceOnUse"
-        >
-          <FeFlood floodOpacity="0" result="BackgroundImageFix" />
-          <FeBlend
-            mode="normal"
-            in="SourceGraphic"
-            in2="BackgroundImageFix"
-            result="shape"
-          />
-          <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 dx="1" dy="1" />
-          <FeGaussianBlur stdDeviation="1" />
-          <FeComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1" />
-          <FeColorMatrix
-            type="matrix"
-            values="0 0 0 0 0.215686 0 0 0 0 0.886275 0 0 0 0 0.439216 0 0 0 0.4 0"
-          />
-          <FeBlend
-            mode="normal"
-            in2="shape"
-            result="effect1_innerShadow_3359_12276"
+    <View style={[{ width: sizeMapped, height: sizeMapped }, style]}>
+      <Svg
+        width="100%"
+        height="100%"
+        viewBox={config.viewBox}
+        fill="none"
+        color={color}
+        ref={ref}
+        {...rest}
+      >
+        <G filter={`url(#${filterId})`}>
+          <Path
+            fillRule="evenodd"
+            clipRule="evenodd"
+            d={config.path}
+            fill="currentColor"
           />
-        </Filter>
-      </Defs>
-    </Svg>
+        </G>
+        <Defs>
+          <Filter
+            id={filterId}
+            x={config.filter.x}
+            y={config.filter.y}
+            width={config.filter.width}
+            height={config.filter.height}
+            filterUnits="userSpaceOnUse"
+          >
+            <FeFlood floodOpacity="0" result="BackgroundImageFix" />
+            <FeBlend
+              mode="normal"
+              in="SourceGraphic"
+              in2="BackgroundImageFix"
+              result="shape"
+            />
+            <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 dx="1" dy="1" />
+            <FeGaussianBlur stdDeviation="1" />
+            <FeComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1" />
+            <FeColorMatrix
+              type="matrix"
+              values="0 0 0 0 0.215686 0 0 0 0 0.886275 0 0 0 0 0.439216 0 0 0 0.4 0"
+            />
+            <FeBlend
+              mode="normal"
+              in2="shape"
+              result={`effect1_innerShadow_${filterId}`}
+            />
+          </Filter>
+        </Defs>
+      </Svg>
+    </View>
   );
-}
+}

package/src/components/InformationStatus/components/GradientCheck/types.ts

@@ -1,6 +1,6 @@
 import { SvgProps } from "react-native-svg";
-
-export interface GradientCheckProps extends SvgProps {
-  size?: number;
+import { SizeEnum } from "../../../../enums";
+export interface GradientCheckProps extends Omit<SvgProps, "width" | "height"> {
+  size?: SizeEnum.SMALL | SizeEnum.MEDIUM | SizeEnum.LARGE;
   color?: string;
 }