Component exposed from @expo/vector-icons cannot be used as a JSX component

VS code give me the above alert, when I am using the AntDesign exposed from "expo/vector-icons".

import { AntDesign } from "@expo/vector-icons";export type Icon = {  name: "home" | "crafts";};export function Icon({ name }: Icon) {  return (<AntDesign      size={24}      name={(() => {        switch (name) {          case "crafts":            return "appstore-o";          case "home":          default:            return "home";        }      })()}      color="black"    />  );}

I think I am following the practice shared by the official document, isn't it?Need help.