SVG Icon does not get rendered properly

[vaibhav2601]

Expected Behaviour : Specific SVG Icon which is processed through decorateIcons does not get rendered properly.

SVG1 : https://adobe.sharepoint.com/:u:/r/sites/HelixProjects/Shared%20Documents/sites/sunstar/sunstar-engineering/icons/[auto-paint-shop.svg](https://adobe.sharepoint.com/:u:/r/sites/HelixProjects/Shared%20Documents/sites/sunstar/sunstar-engineering/icons/auto-paint-shop.svg?csf=1&web=1&e=lvJ21A)?csf=1&web=1&e=lvJ21A

SVG2 : https://adobe.sharepoint.com/:u:/r/sites/HelixProjects/Shared%20Documents/sites/sunstar/sunstar-engineering/icons/[auto-speciality.svg](https://adobe.sharepoint.com/:u:/r/sites/HelixProjects/Shared%20Documents/sites/sunstar/sunstar-engineering/icons/auto-speciality.svg?csf=1&web=1&e=6rOje0)?csf=1&web=1&e=6rOje0

Actual Behaviour

SVG1 over web page :

SVG2 over web page:

Slack Conversation for reference : https://cq-dev.slack.com/archives/C9KD0TT6G/p1690463563902089

Reproduce Scenario (including but not limited to)

Steps to Reproduce

Platform and Version

Sample Code that illustrates the problem

Logs taken while reproducing problem

[ramboz]

When icons use the same id property for various groups in their markup, we actually end up having id clashes in Chrome (at least). This would probably both apply to inlined (styled) SVGs and the sprite version, as both end up adding HTML nodes with clashing id properties.

One possible approach would be to rewrite all identifiers in the SVGs when we inline them, and prefix with the icon name for instance.

[github-actions]

🎉 This issue has been resolved in version 1.3.0 🎉

The release is available on GitHub release

Your semantic-release bot 📦🚀