search

tailwindlabs / heroicons

A set of free MIT-licensed high-quality SVG icons for UI development.
https://heroicons.com
MIT License
21.45k stars 1.28k forks source link

Add typescript note to README #700

Closed danieltott closed 2 years ago

danieltott commented 2 years ago

Based on this comment - I was thinking passing an Icon prop might be common enough to warrant a note in the README.

rmcauley commented 2 years ago

This hint proved useful for me today!

We use a shared component library at my job, and previously all Hero Icons were being imported so we could use an icon component as e.g. <Icon name="ArchiveIcon">. This broke tree-shaking though as all icons needed to be bundled with the <Icon> component. Your solution with e.g. <Icon icon={<ArchiveIcon>}> is a fantastic workaround for us to apply universal styling with something resembling an HOC.

paabloLC commented 2 years ago

Make sense to get implement this small piece since it will be useful for many people.

kpostekk commented 2 years ago

If you are using Vite, you can import svg directly from package.

import { ExclamationCircleIcon } from '@heroicons/react/20/solid/'
adamwathan commented 2 years ago

Hey! For now just going to let people who need this info find it via these existing discussions about it online 👍 Thanks though.