Hello,
I'm working on an icon selector at the moment. Once an icon is chosen, the selector returns the icon as a string, like "AirBalloon". Then, i want to display that icon in my page, so i need to import it (I'm using https://www.npmjs.com/package/tabler-icons-react).
Normally, i would do it like import {AirBallon} from 'tabler-icons-react';.
So i tried this:
<IconSelector
active={iconSelectorActive}
setIcon={setIcon}
additionalEvent={async () => {
console.log(icon); // Logs the icon I selected
setActiveIcon((await import('../../node_modules/tabler-icons-react/dist/icons/' + icon)));
}}
></IconSelector>
But if i try to embed it into my jsx like that:
<Button
onClick={() =>
setIconSelectorActive(!iconSelectorActive)
}
variant="PRIMARY"
>
{activeIcon}
</Button>
It throws the error Error: Cannot find module './' when i click an item from the selector.
How do i fix this?
Thanks in advance,
PixelPage