Vector icons names in SDK 40 cannot be correctly type hinted

Expo SDK
1

Please provide the following:

  1. SDK Version: 40
  2. Platforms(Android/iOS/web/all): all
  3. Add the appropriate “Tag” based on what Expo library you have a question on.

After update to SDK 40 vector icons names became typehinted but it also introduced annoying typesript error “type ‘string’ is not assignable” when using variables as names like here:

<MaterialCommunityIcons
    style={iconStyle}
    name={this.props.icon}
    size={iconSize}
    color={iconColor}
/>

Problem is that I cannot typehint props.icon because icons names are not expoted by MaterialCommunityIcons and it seems like there is no way to do this other then create wrapper component that just ignores icon name type hinting.

1 Like
2

Hey @swayok ,

each icons component has a “glyph map” property containing a map of all icon names as keys.

If you’re using Typescript, you can do:

type IconsNames = keyof typeof MaterialCommunityIcons.glyphMap

And it should return a string union of all possible MaterialCommunityIcons names. Not sure if it works the same in Flow or JSDoc.

However, it could probably be exported directly. Maybe we should open a pull request?

3 Likes
3

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.