Skip to content

SVG attrubutes return lowercase. I want to svg attributes return camelcase..  #103

Open
@kakonbarman

Description

@kakonbarman

`import ReactHtmlParser from "react-html-parser";

export const JltIconText = ({ attributes }) => {
const { text, iconSvg } = attributes;

console.log("iconSvg", iconSvg);
// result: iconSvg <svg width="24" height="23" viewBox="0 0 24 23" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M15.3478 1.45654H1V21.5435H21.087V14.8478" stroke="#EB5E81" strokeWidth="1.875" strokeLinecap="round" strokeLinejoin="round"/><path d="M6.73901 11.0217L11.5216 15.8044L22.9999 3.36957" stroke="#EB5E81" strokeWidth="1.875" strokeLinecap="round" strokeLinejoin="round"/></svg>

//ReactHtmlParser(iconSvg)
// result <svg width="24" height="23" viewbox="0 0 24 23" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M15.3478 1.45654H1V21.5435H21.087V14.8478" stroke="#EB5E81" strokewidth="1.875" strokelinecap="round" strokelinejoin="round"></path><path d="M6.73901 11.0217L11.5216 15.8044L22.9999 3.36957" stroke="#EB5E81" strokewidth="1.875" strokelinecap="round" strokelinejoin="round"></path></svg>

// compare this
// strokeLinecap="round" not equal to strokelinecap="round"

return (
    <div className="jlt-flex jlt-items-center">
        <span className="jlt_svg__icon">{ReactHtmlParser(iconSvg)}</span>
        <span className="jlt-ml-2">{text}</span>
    </div>
);

};
`

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions