static cleanupSvg(svg, cleanup = []) {
return keys(cleanups)
.filter(key => includes(cleanup, key))
.reduce((acc, key) => {
return acc.replace(cleanups[key], '');
}, svg)
.trim();
}
_renderSVG = () => {
const { className, component, svg, fill } = this.props;
let cleanup = this.props.cleanup;
if (
// simple way to enable entire cleanup
cleanup === true ||
// passing cleanupExceptions enable cleanup as well
(
this.props.cleanup.length === 0 &&
this.props.cleanupExceptions.length > 0
)
) {
cleanup = keys(cleanups);
}
cleanup = cleanup.filter(
key => {
return !includes(this.props.cleanupExceptions, key);
}
);
let { width, height } = this.props;
if (width && height === undefined) {
height = width;
}
const props = {...this.props, svg: null, fill: null, width: null, height: null};
let classes = 'SVGICon';
if (cleanup.length) {
classes += ' SVGIcon--cleaned';
}
if (className) {
classes += ' ' + className;
}
const svgClasses = classes
.split(' ')
.join(this.props.classSuffix + ' ') + this.props.classSuffix;
return (
React.createElement(
component,
{
...props, // take most props
className: classes,
dangerouslySetInnerHTML: {
__html: SVGIcon.cleanupSvg(svg, cleanup).replace(
/<svg/,
`<svg class="${ svgClasses }"` +
(
fill
? ` fill="${ fill }"`
: ``
) +
(
width || height
? (
` style="` +
(width ? `width: ${width}px;` : ``) +
(height ? `height: ${height}px;` : ``) +
`"`
)
: ''
)
)
}
}
)
);
}