Skip to content

Commit

Permalink
feat: upgrade to svgo v3 (#798)
Browse files Browse the repository at this point in the history 
BREAKING CHANGE: svgr now requires Node.js v14+
  • Loading branch information
@AndresPuglia98
AndresPuglia98 authored Mar 24, 2023
1 parent ce55cc0 commit 21b6209
Show file tree
Hide file tree
Showing 10 changed files with 388 additions and 299 deletions.
312 changes: 202 additions & 110 deletions package-lock.json
View file

Large diffs are not rendered by default.

118 changes: 59 additions & 59 deletions packages/cli/src/__snapshots__/index.test.ts.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,8 +9,8 @@ export { default as File } from './File'
exports[`cli should not override config with cli defaults 1`] = `
"import * as React from 'react'
const SvgFile = () => (
<svg width={48} height={1} xmlns="http://www.w3.org/2000/svg">
<path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
<svg xmlns="http://www.w3.org/2000/svg" width={48} height={1}>
<path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
</svg>
)
export default SvgFile
Expand All @@ -32,8 +32,8 @@ exports[`cli should support --no-index 1`] = `
exports[`cli should support --prettier-config as file 1`] = `
"import * as React from 'react'
const SvgFile = (props) => (
<svg width={48} height={1} xmlns="http://www.w3.org/2000/svg" {...props}>
<path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
<svg xmlns="http://www.w3.org/2000/svg" width={48} height={1} {...props}>
<path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
</svg>
)
export default SvgFile
Expand All @@ -44,8 +44,8 @@ export default SvgFile
exports[`cli should support --prettier-config as json 1`] = `
"import * as React from 'react'
const SvgFile = (props) => (
<svg width={48} height={1} xmlns="http://www.w3.org/2000/svg" {...props}>
<path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
<svg xmlns="http://www.w3.org/2000/svg" width={48} height={1} {...props}>
<path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
</svg>
)
export default SvgFile
Expand All @@ -56,9 +56,9 @@ export default SvgFile
exports[`cli should support --svgo-config as file 1`] = `
"import * as React from 'react'
const SvgFile = (props) => (
<svg width={48} height={1} xmlns="http://www.w3.org/2000/svg" {...props}>
<svg xmlns="http://www.w3.org/2000/svg" width={48} height={1} {...props}>
<title>{'Rectangle 5'}</title>
<path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
<path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
</svg>
)
export default SvgFile
Expand All @@ -69,9 +69,9 @@ export default SvgFile
exports[`cli should support --svgo-config as json 1`] = `
"import * as React from 'react'
const SvgFile = (props) => (
<svg width={48} height={1} xmlns="http://www.w3.org/2000/svg" {...props}>
<svg xmlns="http://www.w3.org/2000/svg" width={48} height={1} {...props}>
<title>{'Rectangle 5'}</title>
<path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
<path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
</svg>
)
export default SvgFile
Expand Down Expand Up @@ -134,8 +134,8 @@ exports[`cli should support different filename cases with directory output: --fi
exports[`cli should support stdin filepath 1`] = `
"import * as React from 'react'
const SvgFile = (props) => (
<svg width={48} height={1} xmlns="http://www.w3.org/2000/svg" {...props}>
<path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
<svg xmlns="http://www.w3.org/2000/svg" width={48} height={1} {...props}>
<path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
</svg>
)
export default SvgFile
Expand All @@ -147,14 +147,14 @@ exports[`cli should support various args: --desc-prop 1`] = `
"import * as React from 'react'
const SvgFile = ({ desc, descId, ...props }) => (
<svg
xmlns="http://www.w3.org/2000/svg"
width={48}
height={1}
xmlns="http://www.w3.org/2000/svg"
aria-describedby={descId}
{...props}
>
{desc ? <desc id={descId}>{desc}</desc> : null}
<path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
<path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
</svg>
)
export default SvgFile
Expand All @@ -165,8 +165,8 @@ export default SvgFile
exports[`cli should support various args: --expand-props none 1`] = `
"import * as React from 'react'
const SvgFile = () => (
<svg width={48} height={1} xmlns="http://www.w3.org/2000/svg">
<path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
<svg xmlns="http://www.w3.org/2000/svg" width={48} height={1}>
<path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
</svg>
)
export default SvgFile
Expand All @@ -177,8 +177,8 @@ export default SvgFile
exports[`cli should support various args: --expand-props start 1`] = `
"import * as React from 'react'
const SvgFile = (props) => (
<svg {...props} width={48} height={1} xmlns="http://www.w3.org/2000/svg">
<path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
<svg {...props} xmlns="http://www.w3.org/2000/svg" width={48} height={1}>
<path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
</svg>
)
export default SvgFile
Expand All @@ -190,13 +190,13 @@ exports[`cli should support various args: --icon 1`] = `
"import * as React from 'react'
const SvgFile = (props) => (
<svg
xmlns="http://www.w3.org/2000/svg"
width="1em"
height="1em"
viewBox="0 0 48 1"
xmlns="http://www.w3.org/2000/svg"
{...props}
>
<path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
<path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
</svg>
)
export default SvgFile
Expand All @@ -208,13 +208,13 @@ exports[`cli should support various args: --icon 2em 1`] = `
"import * as React from 'react'
const SvgFile = (props) => (
<svg
xmlns="http://www.w3.org/2000/svg"
width="2em"
height="2em"
viewBox="0 0 48 1"
xmlns="http://www.w3.org/2000/svg"
{...props}
>
<path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
<path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
</svg>
)
export default SvgFile
Expand All @@ -226,13 +226,13 @@ exports[`cli should support various args: --icon 24 1`] = `
"import * as React from 'react'
const SvgFile = (props) => (
<svg
xmlns="http://www.w3.org/2000/svg"
width={24}
height={24}
viewBox="0 0 48 1"
xmlns="http://www.w3.org/2000/svg"
{...props}
>
<path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
<path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
</svg>
)
export default SvgFile
Expand All @@ -242,8 +242,8 @@ export default SvgFile

exports[`cli should support various args: --jsx-runtime automatic 1`] = `
"const SvgFile = (props) => (
<svg width={48} height={1} xmlns="http://www.w3.org/2000/svg" {...props}>
<path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
<svg xmlns="http://www.w3.org/2000/svg" width={48} height={1} {...props}>
<path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
</svg>
)
export default SvgFile
Expand All @@ -254,8 +254,8 @@ export default SvgFile
exports[`cli should support various args: --jsx-runtime classic-preact 1`] = `
"import { h } from 'preact'
const SvgFile = (props) => (
<svg width={48} height={1} xmlns="http://www.w3.org/2000/svg" {...props}>
<path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
<svg xmlns="http://www.w3.org/2000/svg" width={48} height={1} {...props}>
<path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
</svg>
)
export default SvgFile
Expand All @@ -267,8 +267,8 @@ exports[`cli should support various args: --native --expand-props none 1`] = `
"import * as React from 'react'
import Svg, { Path } from 'react-native-svg'
const SvgFile = () => (
<Svg width={48} height={1} xmlns="http://www.w3.org/2000/svg">
<Path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
<Svg xmlns="http://www.w3.org/2000/svg" width={48} height={1}>
<Path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
</Svg>
)
export default SvgFile
Expand All @@ -281,13 +281,13 @@ exports[`cli should support various args: --native --icon 1`] = `
import Svg, { Path } from 'react-native-svg'
const SvgFile = (props) => (
<Svg
xmlns="http://www.w3.org/2000/svg"
width={24}
height={24}
viewBox="0 0 48 1"
xmlns="http://www.w3.org/2000/svg"
{...props}
>
<Path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
<Path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
</Svg>
)
export default SvgFile
Expand All @@ -301,13 +301,13 @@ import Svg, { Path } from 'react-native-svg'
import { forwardRef } from 'react'
const SvgFile = (props, ref) => (
<Svg
xmlns="http://www.w3.org/2000/svg"
width={48}
height={1}
xmlns="http://www.w3.org/2000/svg"
ref={ref}
{...props}
>
<Path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
<Path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
</Svg>
)
const ForwardRef = forwardRef(SvgFile)
Expand All @@ -320,8 +320,8 @@ exports[`cli should support various args: --native 1`] = `
"import * as React from 'react'
import Svg, { Path } from 'react-native-svg'
const SvgFile = (props) => (
<Svg width={48} height={1} xmlns="http://www.w3.org/2000/svg" {...props}>
<Path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
<Svg xmlns="http://www.w3.org/2000/svg" width={48} height={1} {...props}>
<Path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
</Svg>
)
export default SvgFile
Expand All @@ -332,8 +332,8 @@ export default SvgFile
exports[`cli should support various args: --no-dimensions 1`] = `
"import * as React from 'react'
const SvgFile = (props) => (
<svg viewBox="0 0 48 1" xmlns="http://www.w3.org/2000/svg" {...props}>
<path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 1" {...props}>
<path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
</svg>
)
export default SvgFile
Expand All @@ -343,7 +343,7 @@ export default SvgFile

exports[`cli should support various args: --no-prettier 1`] = `
"import * as React from "react";
const SvgFile = props => <svg width={48} height={1} xmlns="http://www.w3.org/2000/svg" {...props}><path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" /></svg>;
const SvgFile = props => <svg xmlns="http://www.w3.org/2000/svg" width={48} height={1} {...props}><path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" /></svg>;
export default SvgFile;
"
`;
Expand Down Expand Up @@ -391,13 +391,13 @@ exports[`cli should support various args: --ref 1`] = `
import { forwardRef } from 'react'
const SvgFile = (props, ref) => (
<svg
xmlns="http://www.w3.org/2000/svg"
width={48}
height={1}
xmlns="http://www.w3.org/2000/svg"
ref={ref}
{...props}
>
<path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
<path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
</svg>
)
const ForwardRef = forwardRef(SvgFile)
Expand All @@ -409,8 +409,8 @@ export default ForwardRef
exports[`cli should support various args: --replace-attr-values "#063855=currentColor" 1`] = `
"import * as React from 'react'
const SvgFile = (props) => (
<svg width={48} height={1} xmlns="http://www.w3.org/2000/svg" {...props}>
<path d="M0 0h48v1H0z" fill="currentColor" fillRule="evenodd" />
<svg xmlns="http://www.w3.org/2000/svg" width={48} height={1} {...props}>
<path fill="currentColor" fillRule="evenodd" d="M0 0h48v1H0z" />
</svg>
)
export default SvgFile
Expand All @@ -422,14 +422,14 @@ exports[`cli should support various args: --svg-props "hidden={true},id=hello" 1
"import * as React from 'react'
const SvgFile = (props) => (
<svg
xmlns="http://www.w3.org/2000/svg"
width={48}
height={1}
xmlns="http://www.w3.org/2000/svg"
hidden={true}
id="hello"
{...props}
>
<path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
<path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
</svg>
)
export default SvgFile
Expand All @@ -441,14 +441,14 @@ exports[`cli should support various args: --title-prop 1`] = `
"import * as React from 'react'
const SvgFile = ({ title, titleId, ...props }) => (
<svg
xmlns="http://www.w3.org/2000/svg"
width={48}
height={1}
xmlns="http://www.w3.org/2000/svg"
aria-labelledby={titleId}
{...props}
>
{title ? <title id={titleId}>{title}</title> : null}
<path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
<path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
</svg>
)
export default SvgFile
Expand All @@ -468,15 +468,15 @@ const SvgFile = (
ref: Ref<SVGSVGElement>,
) => (
<svg
xmlns="http://www.w3.org/2000/svg"
width={48}
height={1}
xmlns="http://www.w3.org/2000/svg"
ref={ref}
aria-describedby={descId}
{...props}
>
{desc ? <desc id={descId}>{desc}</desc> : null}
<path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
<path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
</svg>
)
const ForwardRef = forwardRef(SvgFile)
Expand All @@ -497,15 +497,15 @@ const SvgFile = (
ref: Ref<SVGSVGElement>,
) => (
<svg
xmlns="http://www.w3.org/2000/svg"
width={48}
height={1}
xmlns="http://www.w3.org/2000/svg"
ref={ref}
aria-labelledby={titleId}
{...props}
>
{title ? <title id={titleId}>{title}</title> : null}
<path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
<path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
</svg>
)
const ForwardRef = forwardRef(SvgFile)
Expand All @@ -519,13 +519,13 @@ exports[`cli should support various args: --typescript --ref 1`] = `
import { SVGProps, Ref, forwardRef } from 'react'
const SvgFile = (props: SVGProps<SVGSVGElement>, ref: Ref<SVGSVGElement>) => (
<svg
xmlns="http://www.w3.org/2000/svg"
width={48}
height={1}
xmlns="http://www.w3.org/2000/svg"
ref={ref}
{...props}
>
<path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
<path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
</svg>
)
const ForwardRef = forwardRef(SvgFile)
Expand All @@ -538,8 +538,8 @@ exports[`cli should support various args: --typescript 1`] = `
"import * as React from 'react'
import { SVGProps } from 'react'
const SvgFile = (props: SVGProps<SVGSVGElement>) => (
<svg width={48} height={1} xmlns="http://www.w3.org/2000/svg" {...props}>
<path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
<svg xmlns="http://www.w3.org/2000/svg" width={48} height={1} {...props}>
<path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
</svg>
)
export default SvgFile
Expand Down Expand Up @@ -590,8 +590,8 @@ __fixtures__/withsvgrrc/file.svg -> __fixtures_build__/whole/withsvgrrc/file.tsx
exports[`cli should work with a simple file 1`] = `
"import * as React from 'react'
const SvgFile = (props) => (
<svg width={48} height={1} xmlns="http://www.w3.org/2000/svg" {...props}>
<path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
<svg xmlns="http://www.w3.org/2000/svg" width={48} height={1} {...props}>
<path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
</svg>
)
export default SvgFile
Expand All @@ -602,8 +602,8 @@ export default SvgFile
exports[`cli should work with stdin 1`] = `
"import * as React from 'react'
const SvgComponent = (props) => (
<svg width={48} height={1} xmlns="http://www.w3.org/2000/svg" {...props}>
<path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
<svg xmlns="http://www.w3.org/2000/svg" width={48} height={1} {...props}>
<path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
</svg>
)
export default SvgComponent
Expand Down
Loading

1 comment on commit 21b6209

@vercel
Copy link

@vercel vercel bot commented on 21b6209 Mar 24, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Successfully deployed to the following URLs:

svgr – ./

svgr-git-main-gregberge.vercel.app
svgr-gregberge.vercel.app
api.react-svgr.com

Please sign in to comment.