Merge pull request #2163 from gluestack/fix/web-icon

fix: icon size in web
gluestack · May 17, 2024 · 32f98ff · 32f98ff
2 parents 841a940 + 8e74d88
commit 32f98ff
Show file tree

Hide file tree

Showing 5 changed files with 443 additions and 463 deletions.
diff --git a/example/storybook-nativewind/src/components/Icon/Icon.tsx b/example/storybook-nativewind/src/components/Icon/Icon.tsx
@@ -68,7 +68,7 @@ import {
   Camera,
 } from 'lucide-react-native';
 const IconBasic = ({ size, ...props }: any) => {
-  return <Icon as={AddIcon} size={size} {...props} />;
+  return <Icon as={SearchIcon} size={size} {...props} />;
 };
 
 IconBasic.description =

diff --git a/example/storybook-nativewind/src/components/Radio/Radio.tsx b/example/storybook-nativewind/src/components/Radio/Radio.tsx
@@ -1,34 +1,24 @@
 /* eslint-disable no-console */
 import React from 'react';
-import {
-  Center,
-  VStack,
-  HStack,
-  Box,
-  Heading,
-  Text,
-  FormControl,
-  CircleIcon,
-} from '@gluestack-ui/themed';
 import {
   Radio,
   RadioGroup,
   RadioIcon,
   RadioIndicator,
   RadioLabel,
 } from '@/components/ui/radio';
+import { CircleIcon } from '@/components/ui/icon';
 
 const RadioBasic = ({ ...props }: any) => {
   const [values, setValues] = React.useState('Label 1');
 
   return (
-    <RadioGroup value={values} onChange={setValues} gap="$2">
+    <RadioGroup value={values} onChange={setValues}>
       <Radio
         {...props}
         value="Label 1"
         aria-label="Radio"
         onChange={(nextValue: boolean) => console.log(nextValue, 'nextValue')}
-        gap="$2"
       >
         <RadioIndicator>
           <RadioIcon as={CircleIcon} />
@@ -40,7 +30,6 @@ const RadioBasic = ({ ...props }: any) => {
         value="Label 2"
         aria-label="Radio"
         onChange={(nextValue: boolean) => console.log(nextValue, 'nextValue')}
-        gap="$2"
       >
         <RadioIndicator>
           <RadioIcon as={CircleIcon} />
@@ -56,18 +45,4 @@ RadioBasic.description =
 
 export default RadioBasic;
 
-export {
-  Radio,
-  RadioGroup,
-  RadioIcon,
-  RadioIndicator,
-  RadioLabel,
-  CircleIcon,
-  Center,
-  VStack,
-  HStack,
-  Box,
-  Heading,
-  Text,
-  FormControl,
-};
+export { Radio, RadioGroup, RadioIcon, RadioIndicator, RadioLabel, CircleIcon };
diff --git a/example/storybook-nativewind/src/core-components/nativewind/icon/index.tsx b/example/storybook-nativewind/src/core-components/nativewind/icon/index.tsx
@@ -7,16 +7,7 @@ import { cssInterop } from 'nativewind';
 
 const PrimitiveIcon = React.forwardRef(
   (
-    {
-      height,
-      width,
-      fill = 'none',
-      color,
-      size,
-      stroke = 'currentColor',
-      as: AsComp,
-      ...props
-    }: any,
+    { height, width, fill, color, size, stroke, as: AsComp, ...props }: any,
     ref?: any
   ) => {
     const sizeProps = useMemo(() => {
@@ -55,7 +46,7 @@ export const UIIcon = createIcon({
 });
 
 const iconStyle = tva({
-  base: '',
+  base: 'stroke-typography-950 fill-none',
   variants: {
     size: {
       '2xs': 'h-3 w-3',