diegomura / diegomura/react-pdf
Having more than one `<Defs />` tag in an `<Svg />` doesn't work
- Dominant language
- TypeScript
- Stars
- 16.8k
- Forks
- 1.3k
- Avg merge
- 5h 6m
- Merged PRs (30d)
- 52
Description
**Describe the bug**
When rendering `` elements in `react-pdf`, if you have more than one `` component, only the children of the first one will be applied.
**To Reproduce**
```
const Test = () => (
);
ReactPDF.render();
```
https://react-pdf.org/repl?code=3187b0760ce02e00402a05368c0bc30050129503e0c0a061801e0044460057016c130a1d0a24801404301cc1479e78819401b871801dc025801328002c5002200ac001997c98321388e32a0280ccabd60f1094402110003c172987655dc36a7af6601bc03d002a18012400cc60013c412860009c11a84104106165c42049481003933cf141a8001dc0e8a000681334603822d9254de860008c10006c4144c5c41a1ac4402201ac61bd3c017df0012186c8d2215cdcf80065c4c010d82201c42aaa0a60a41528c128201125d4ac01196c8e0098ce434fe4d4432fe58fe4a7a6f9f8a04072604003d210f56eea6827c00c220268441451438e1889e77a7c5eaf12022be3f3f8029e30604e4c110852d41a940433ce1a8a45b8e1730592d56956a83098d3386a5d214a238cd94cd7b11a98b159ac199b4902820323083524f53d81c8e373b9581e7760bcbd4c10793dd994d477d7efb005dc7178ae94365b0f847c725ade0092dba8c428b146f049be484e26922d88ee7333c7cda60a0a5a9644d8320f1045800d78b006c8f3bb01828ebb804da0d6d8441ae8003118a2552840cb249875243e340a804440dd040128924f378723d18a593842f387b0b8ae164506841fc26000dcf87c0009516c0280b1480031001d144c09204045d0c44432132c3fc10000
If you remove the first `` component, the gradient in the circle will start to work. In HTML, this SVG works as expected.
**Expected behavior**
You should be able to reference the `id` of any `` inside the ``, not just the first one.
**Screenshots**

**Desktop (please complete the following information):**
- OS: All
- Browser: Chrome
- React-pdf version: @react-pdf/renderer@4.1.5
Contributor guide
Assessment
This issue has not been assessed yet.