Merge pull request #2473 from gluestack/fix/v2-icons

fix: lucide icon issue
gluestack · Sep 18, 2024 · a44b27b · a44b27b
2 parents 7ad0ea9 + 0ea5cbf
commit a44b27b
Show file tree

Hide file tree

Showing 11 changed files with 49 additions and 35 deletions.
diff --git a/example/storybook-nativewind/src/core-components/nativewind/accordion/index.tsx b/example/storybook-nativewind/src/core-components/nativewind/accordion/index.tsx
@@ -105,7 +105,7 @@ const PrimitiveIcon = React.forwardRef<
       color,
       classNameColor,
       size,
-      stroke,
+      stroke = 'currentColor',
       as: AsComp,
       ...props
     },

diff --git a/example/storybook-nativewind/src/core-components/nativewind/actionsheet/index.tsx b/example/storybook-nativewind/src/core-components/nativewind/actionsheet/index.tsx
@@ -48,7 +48,7 @@ const PrimitiveIcon = React.forwardRef<
       color,
       classNameColor,
       size,
-      stroke,
+      stroke = 'currentColor',
       as: AsComp,
       ...props
     },

diff --git a/example/storybook-nativewind/src/core-components/nativewind/alert/index.tsx b/example/storybook-nativewind/src/core-components/nativewind/alert/index.tsx
@@ -128,7 +128,7 @@ const PrimitiveIcon = React.forwardRef<
       color,
       classNameColor,
       size,
-      stroke,
+      stroke = 'currentColor',
       as: AsComp,
       ...props
     },

diff --git a/example/storybook-nativewind/src/core-components/nativewind/badge/index.tsx b/example/storybook-nativewind/src/core-components/nativewind/badge/index.tsx
@@ -117,7 +117,7 @@ const PrimitiveIcon = React.forwardRef<
       color,
       classNameColor,
       size,
-      stroke,
+      stroke = 'currentColor',
       as: AsComp,
       ...props
     },

diff --git a/example/storybook-nativewind/src/core-components/nativewind/button/index.tsx b/example/storybook-nativewind/src/core-components/nativewind/button/index.tsx
@@ -52,7 +52,7 @@ const PrimitiveIcon = React.forwardRef<
       color,
       classNameColor,
       size,
-      stroke,
+      stroke = 'currentColor',
       as: AsComp,
       ...props
     },

diff --git a/example/storybook-nativewind/src/core-components/nativewind/checkbox/index.tsx b/example/storybook-nativewind/src/core-components/nativewind/checkbox/index.tsx
@@ -59,7 +59,7 @@ const PrimitiveIcon = React.forwardRef<
       color,
       classNameColor,
       size,
-      stroke,
+      stroke = 'currentColor',
       as: AsComp,
       ...props
     },

diff --git a/example/storybook-nativewind/src/core-components/nativewind/fab/index.tsx b/example/storybook-nativewind/src/core-components/nativewind/fab/index.tsx
@@ -37,7 +37,7 @@ const PrimitiveIcon = React.forwardRef<
       color,
       classNameColor,
       size,
-      stroke,
+      stroke = 'currentColor',
       as: AsComp,
       ...props
     },

diff --git a/example/storybook-nativewind/src/core-components/nativewind/form-control/index.tsx b/example/storybook-nativewind/src/core-components/nativewind/form-control/index.tsx
@@ -27,32 +27,46 @@ type IPrimitiveIcon = React.ComponentPropsWithoutRef<typeof Svg> & {
 const PrimitiveIcon = React.forwardRef<
   React.ElementRef<typeof Svg>,
   IPrimitiveIcon
->(({ height, width, fill, color, size, stroke, as: AsComp, ...props }, ref) => {
-  const sizeProps = useMemo(() => {
-    if (size) return { size };
-    if (height && width) return { height, width };
-    if (height) return { height };
-    if (width) return { width };
-    return {};
-  }, [size, height, width]);
-
-  let colorProps = {};
-  if (color) {
-    colorProps = { ...colorProps, color: color };
-  }
-  if (stroke) {
-    colorProps = { ...colorProps, stroke: stroke };
-  }
-  if (fill) {
-    colorProps = { ...colorProps, fill: fill };
-  }
-  if (AsComp) {
-    return <AsComp ref={ref} {...sizeProps} {...colorProps} {...props} />;
+>(
+  (
+    {
+      height,
+      width,
+      fill,
+      color,
+      size,
+      stroke = 'currentColor',
+      as: AsComp,
+      ...props
+    },
+    ref
+  ) => {
+    const sizeProps = useMemo(() => {
+      if (size) return { size };
+      if (height && width) return { height, width };
+      if (height) return { height };
+      if (width) return { width };
+      return {};
+    }, [size, height, width]);
+
+    let colorProps = {};
+    if (color) {
+      colorProps = { ...colorProps, color: color };
+    }
+    if (stroke) {
+      colorProps = { ...colorProps, stroke: stroke };
+    }
+    if (fill) {
+      colorProps = { ...colorProps, fill: fill };
+    }
+    if (AsComp) {
+      return <AsComp ref={ref} {...sizeProps} {...colorProps} {...props} />;
+    }
+    return (
+      <Svg ref={ref} height={height} width={width} {...colorProps} {...props} />
+    );
   }
-  return (
-    <Svg ref={ref} height={height} width={width} {...colorProps} {...props} />
-  );
-});
+);
 
 const formControlStyle = tva({
   base: 'flex flex-col',

diff --git a/example/storybook-nativewind/src/core-components/nativewind/input/index.tsx b/example/storybook-nativewind/src/core-components/nativewind/input/index.tsx
@@ -38,7 +38,7 @@ const PrimitiveIcon = React.forwardRef<
       color,
       classNameColor,
       size,
-      stroke,
+      stroke = 'currentColor',
       as: AsComp,
       ...props
     },

diff --git a/example/storybook-nativewind/src/core-components/nativewind/radio/index.tsx b/example/storybook-nativewind/src/core-components/nativewind/radio/index.tsx
@@ -58,7 +58,7 @@ const PrimitiveIcon = React.forwardRef<
       color,
       classNameColor,
       size,
-      stroke,
+      stroke = 'currentColor',
       as: AsComp,
       ...props
     },

diff --git a/example/storybook-nativewind/src/core-components/nativewind/select/index.tsx b/example/storybook-nativewind/src/core-components/nativewind/select/index.tsx
@@ -111,7 +111,7 @@ const PrimitiveIcon = React.forwardRef<
       color,
       classNameColor,
       size,
-      stroke,
+      stroke = 'currentColor',
       as: AsComp,
       ...props
     },