Return a more suitable ref

[Bowen7]

Previously, the ref will always return an SVGGElement when the element's type is one of path, circle, line, rect, ellipse, polygon, polyline. Because we wrap these types of elements in an SVGGElement and return the SVGGElement as the ref.

react-rough-fiber/packages/react-rough-fiber/src/renderer.ts

Lines 26 to 32 in 70f91aa

	if (namespace === SVG_NAMESPACE || type === 'svg') {
	// roughjs renders a shape as a fill path(if fill is not none) and a stroke path(if stroke is not none)
	// so we need to wrap the shape in a g element
	if (!inDefs && type in SVG_SHAPE_MAP) {
	type = 'g';
	}
	domElement = ownerDocument.createElementNS(SVG_NAMESPACE, type);

Now, I have changed it to return the first path element of the SVGGElement.

It's just a better, not a perfect way to handle the ref. Because roughjs renders all shapes to SVGPathElement, we can't get the original ref.

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
react-rough-fiber-docs	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	May 3, 2024 7:44am