svg is wrapped two times

[michaellill-corefihub]

The following code

<ReactSVG
                                        src="/website-assets/icons/timer.svg"
                                        wrapper="svg"
                                        className="fill-cfm-green d-flex align-items-center width-20 mr-1"
                                    />

produces something like:

<svg  class="fill-cfm-green d-flex align-items-center width-20 mr-1">
<svg>
<svg>
 the actual svg content...
</svg>
</svg>
</svg>

Expected:

<svg class="fill-cfm-green d-flex align-items-center width-20 mr-1">
 the actual svg content...
</svg>

this code:

<ReactSVG
                                        src="/website-assets/icons/timer.svg"
                                        wrapper="div"
                                        className="fill-cfm-green d-flex align-items-center width-20 mr-1"
                                    />

produces something like:

<div  class="fill-cfm-green d-flex align-items-center width-20 mr-1">
<div>
<svg>
 the actual svg content...
</svg>
</div>
</div>

Expected:

<div  class="fill-cfm-green d-flex align-items-center width-20 mr-1">
<svg>
 the actual svg content...
</svg>
</div>

[Tane Morgan]

This is deliberate, please see "Why are there two wrapping elements?" in the FAQ.

[michaellill-corefihub]

@tanem I see. Thank you for the explanation.