SVG para Jsx

Transforma a marcação SVG bruta em um componente React pronto para colar. Ele reescreve os atributos SVG em props camelCase compatíveis com React (class para className, stroke-width para strokeWidth, xlink:href para xlinkHref e muitos outros), converte strings de estilo inline em objetos de estilo do React, fecha automaticamente elementos void e formas SVG e remove o namespace padrão xmlns="http://www.w3.org/2000/svg".

1. Cole sua marcação SVG (deve conter <svg> e </svg>) na caixa de entrada 2. Clique em Prettify para recuar automaticamente a marcação antes da conversão (opcional) 3. Defina um Nome de Componente (o padrão é SvgComponent, apenas caracteres alfanuméricos e sublinhado) 4. Ative ou desative a diretiva "use client" e/ou o hook useMemo conforme necessário 5. Clique em Convert para produzir o componente JSX e copie para a área de transferência

O campo Nome de Componente controla o identificador exportado. Com a caixa de seleção "use client" ativada, a saída é prefixada com "use client" em sua própria linha e exportada como default sem props; caso contrário, é exportada como um const nomeado que aceita props e retorna svg. Com useMemo ativado, a marcação SVG é envolvida em useMemo(() => (...), []). A entrada deve conter tanto <svg quanto </svg> ou a conversão será rejeitada com um erro de SVG inválido.