Estoy tratando de representar diferentes SVG en cada componente de opción del componente Seleccionar de Chakra UI, pero parece que no puedo mostrar ninguna imagen dentro del componente de opción.

Las dos implementaciones siguientes muestran [objeto Objeto] en la opción.

 import SVG from './file.svg' // Also tried both of the following: // import SVG from './file.tsx' // import {ReactComponent as SVG} from './file.svg'; return ( <Select> <option> <SVG /> </option> </Select> );

 import SVG from './file.svg' return ( <Select> <option> <img src={SVG} alt=''/> </option> </Select> );

La única forma en que pude mostrar SVG en el componente Seleccionar de Chakra fue a través del ícono prop, pero eso reemplazaría el ícono desplegable que no quiero hacer.

Avíseme si hay alguna forma en que pueda desglosar o minimizar aún más el problema.

¿Hay alguna forma de personalizar mi componente Select para renderizar SVG con Chakra UI?