A [SVGR][] v3 component template to inject the ref
prop and spreaded props
to SVG fragments/fractals which are SVG files that contain [SVG elements][mdn-svg-elements-ref] not wrapped into <svg>
allowing to compose these in JSX / React components.
When the extendProps
option of SVGR v3 is enabled all props
are added to the root <svg>
element. Enabling the ref
option also adds the ref={svgRef}
using [React's (16.3+) forwardRef
API][react-docs-forward-ref]. Unfortunately this only applies to root <svg>
elements but not to any other element that represents the root of the SVG file and therefore prevents to compose fragments / fractals to a single SVG for use cases like animations and styling with CSS-in-JSS techniques. The reason is that when props
are not spreaded to the root element necessary props like className
and any other (custom) prop are not set on the element.
Another use case is the fact that awesome animations libraries like [react-pose][] are [reliant on a f