react-native-vector-icons icon indicating copy to clipboard operation
react-native-vector-icons copied to clipboard

feat: export types for icon names

Open johnf opened this issue 6 months ago • 1 comments

johnf avatar Jun 07 '25 08:06 johnf

does this pr fix this https://github.com/oblador/react-native-vector-icons/issues/1760, and update the glyphmaps file

Prajwaltechversant avatar Jun 13 '25 04:06 Prajwaltechversant

@vonovak thanks!

johnf avatar Jul 12 '25 12:07 johnf

Instead of doing export type FontAwesome5ProLightIconName = keyof typeof lightGM; can't we do export type FontAwesome5ProLightIconName = ComponentProps<typeof LightIcon>['name'];

This is just a suggestion as the types exported are still not useful if we are creating a reusable component which renders the icon by accepting the icon name as prop to that component. In this case FontAwesome5ProLightIconName = ComponentProps<typeof LightIcon>['name']; works well.

abitling avatar Jul 23 '25 08:07 abitling

hello,

Instead of doing export type FontAwesome5ProLightIconName = keyof typeof lightGM; can't we do export type FontAwesome5ProLightIconName = ComponentProps<typeof LightIcon>['name'];

Those are the same thing. They are equivalent. Not sure I understand what you have in mind?

vonovak avatar Jul 23 '25 10:07 vonovak

@vonovak What I mean is, with the current implementation i.e export type FontAwesome5ProSolidIconName = keyof typeof solidGM; when I do the following I faced type errors.

import FontAwesome5Pro, {
    FontAwesome5ProSolidIconName,
} from '@react-native-vector-icons/fontawesome5-pro';

const IconComponent = ({
    name,
    size = 24,
    color = '#000',
}: {
    size: number;
    color: string;
    name: FontAwesome5ProSolidIconName;
}) => (
    <FontAwesome5Pro
        name={name}                //  This line throws type error "Type 'string | number | symbol' is not assignable to type 
                          //  '"function" | "font-awesome-logo-full" ... 2296 more ... | "zhihu"'
        size={size}
        color={color}
        iconStyle={'solid'}
    />
);

const IconComponentExample = () => (
    <IconComponent name='home' size={30} color='#000' />
);

export default IconComponentExample;

This error goes away when I do export type FontAwesome5ProSolidIconName = ComponentProps<typeof SolidIcon>['name'];. I hope this helps

abitling avatar Jul 23 '25 14:07 abitling

@abitling master has a fix and new release coming shortly

johnf avatar Jul 23 '25 14:07 johnf

@abitling master has a fix and new release coming shortly

@johnf Thank you 🙏🏻

abitling avatar Jul 24 '25 19:07 abitling