svgwave icon indicating copy to clipboard operation
svgwave copied to clipboard

Published 20 hours ago • verified publisher icon anup-a

Export JSX version of svgs (waves)

Open quick007 opened this issue 2 years ago • 7 comments

Hi can you please add a "copy jsx" button ty!

quick007 avatar Oct 08 '21 15:10 quick007

@quick007 sure great idea. will put it up in the roadmap.

anup-a avatar Oct 09 '21 17:10 anup-a

Description - Right now, we support svgs and png as export option. Request is to also support the jsx version of svgs.

anup-a avatar Oct 09 '21 17:10 anup-a

@anup-a Hey, I am looking into this issue, am i allowed to add a external npm package?

dexterpuru avatar Oct 11 '21 08:10 dexterpuru

@dexterpuru hi sure. you can use npm package if it takes minimal space & effort. But I'll recommend you to just export the wave component (which we use in preview) as string. Let me know if there is any issue/ques with this approach.

anup-a avatar Oct 11 '21 08:10 anup-a

@anup-a I see that you pass the ref of whole svg tag to "Export SVG Code" component, I think converting some svg to jsx needs some parsing, i found a pkg that does the parsing, React-SVGR, check its bundle size also , let me know if i can go forward with this.

dexterpuru avatar Oct 11 '21 09:10 dexterpuru

~~If you want to do it the budget way, you could just replace all the class= to className=~~ That doesn't fix the gradient issue- nevermind.

quick007 avatar Oct 11 '21 21:10 quick007

@dexterpuru Sorry forgot to reply to your comment.

React-svgr looks quite bulky to add in this project, I will put some time to find a better solution. Thanks

anup-a avatar Oct 18 '21 13:10 anup-a