smastrom / react-rating

⭐ Zero-dependency, highly customizable rating component for React.
https://reactrating.netlify.app
MIT License
337 stars 6 forks source link

Stars not rendering in production #22

Open naumanafsar opened 1 month ago

naumanafsar commented 1 month ago

I have Vite + React + Typescript application and I am using this react-rating library for displaying ratings in a modal.

Versions: "react": "^18.2.0", "@smastrom/react-rating": "^1.5.0",

It is working as expected in in dev but as soon as I build it, the stars disappears.

Here's what I found:

Svgs in development:

<svg aria-hidden="true" class="rr--svg" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 60 58" preserveAspectRatio="xMidYMid meet"><g shape-rendering="geometricPrecision" transform="translate(-2 -3)"><path d="M62 25.154H39.082L32 3l-7.082 22.154H2l18.541 13.693L13.459 61L32 47.309L50.541 61l-7.082-22.152L62 25.154z"></path></g></svg>

The same svg in production: `

` I noticed that viewBox is set to "0 0 0 0", if I manually edit the html, I can see my svg icons. Oh! and I should also mention that the Rating is rendered inside a headlessui modal.
G-Milevski commented 1 day ago

I have the same issue (

@naumanafsar do you have some workaround ?