diff --git a/src/utils/parseReactSvgContent.ts b/src/utils/parseReactSvgContent.ts index d5e56bf..b971384 100644 --- a/src/utils/parseReactSvgContent.ts +++ b/src/utils/parseReactSvgContent.ts @@ -6,12 +6,29 @@ interface ParseReactSvgOptions { typescript: boolean; } +const convertStyleStringToObject = (styleString: string): string => { + const styleObj: Record = {}; + styleString.split(";").forEach((style) => { + const [property, value] = style.split(":").map((s) => s.trim()); + if (property && value) { + const camelCaseProperty = property.replace(/-([a-z])/g, (g) => + g[1].toUpperCase(), + ); + styleObj[camelCaseProperty] = value; + } + }); + return JSON.stringify(styleObj); +}; + export const parseReactSvgContent = async ({ componentName, svgCode, typescript, }: ParseReactSvgOptions) => { - const reactifiedSvg = svgCode + const processedSvg = svgCode.replace(/style="([^"]*)"/g, (_, styleString) => { + return `style={${convertStyleStringToObject(styleString)}}`; + }); + const reactifiedSvg = processedSvg .replace("