Add types for SVG Props + SVG Ref

[mrousavy]

• I let the props (BaseProps and AvatarProps) extend from SvgProps, so the { ...rest } spread made sense. (Before it only had type {})
• I added a ref to the <Svg> component, this is useful if I want to convert the SVG into a PNG to store it on my users objects in the database, because the <Avatar> SVG Component from this library is really slow at rendering, especially in large lists (sorry).

For anyone wondering how to convert this to a PNG, use the svgRef= property to attach a ref created by React.useRef(), then call toDataURL on that ref instance (ref.current object)

[felipecespedes]

@mrousavy Thanks for opening this PR. I really like the idea of including the svgRef prop, however I didn't get why extending BaseProps & AvatarProps from SvgProps would be beneficial. I see BaseProps & AvatarProps as a high-level data models, so if you want to get the raw SVG just use the svgRef prop

[mrousavy]

@felipecespedes Well, in Base you use every prop to assign it do some part, and the container/style props get assigned to the View. Then, for every other prop, you use {...rest} at the <Svg, which doesn't make sense, since there are no properties left. If you hover over that rest var using VSCode, you can see that the type of that is empty. So I've extended from SvgProps to let the user also manually specify width, height, x, y (viewport), and whatever other properties there might be. There are no new required props anyways, just more options

[felipecespedes]

@mrousavy I see your point and makes sense, thanks for clarifying.

[mrousavy]

Thanks for merging. Could you create a release once you have some time? I'm not really comfortable with using patches for that lol

[felipecespedes]

the new version 1.1.0 is now live :rocket: