Skip to content

Commit 21b6209

Browse files
feat: upgrade to svgo v3 (#798)
BREAKING CHANGE: svgr now requires Node.js v14+
1 parent ce55cc0 commit 21b6209

File tree

10 files changed

+388
-299
lines changed

10 files changed

+388
-299
lines changed

package-lock.json

+202-110
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

packages/cli/src/__snapshots__/index.test.ts.snap

+59-59
Original file line numberDiff line numberDiff line change
@@ -9,8 +9,8 @@ export { default as File } from './File'
99
exports[`cli should not override config with cli defaults 1`] = `
1010
"import * as React from 'react'
1111
const SvgFile = () => (
12-
<svg width={48} height={1} xmlns="http://www.w3.org/2000/svg">
13-
<path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
12+
<svg xmlns="http://www.w3.org/2000/svg" width={48} height={1}>
13+
<path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
1414
</svg>
1515
)
1616
export default SvgFile
@@ -32,8 +32,8 @@ exports[`cli should support --no-index 1`] = `
3232
exports[`cli should support --prettier-config as file 1`] = `
3333
"import * as React from 'react'
3434
const SvgFile = (props) => (
35-
<svg width={48} height={1} xmlns="http://www.w3.org/2000/svg" {...props}>
36-
<path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
35+
<svg xmlns="http://www.w3.org/2000/svg" width={48} height={1} {...props}>
36+
<path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
3737
</svg>
3838
)
3939
export default SvgFile
@@ -44,8 +44,8 @@ export default SvgFile
4444
exports[`cli should support --prettier-config as json 1`] = `
4545
"import * as React from 'react'
4646
const SvgFile = (props) => (
47-
<svg width={48} height={1} xmlns="http://www.w3.org/2000/svg" {...props}>
48-
<path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
47+
<svg xmlns="http://www.w3.org/2000/svg" width={48} height={1} {...props}>
48+
<path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
4949
</svg>
5050
)
5151
export default SvgFile
@@ -56,9 +56,9 @@ export default SvgFile
5656
exports[`cli should support --svgo-config as file 1`] = `
5757
"import * as React from 'react'
5858
const SvgFile = (props) => (
59-
<svg width={48} height={1} xmlns="http://www.w3.org/2000/svg" {...props}>
59+
<svg xmlns="http://www.w3.org/2000/svg" width={48} height={1} {...props}>
6060
<title>{'Rectangle 5'}</title>
61-
<path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
61+
<path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
6262
</svg>
6363
)
6464
export default SvgFile
@@ -69,9 +69,9 @@ export default SvgFile
6969
exports[`cli should support --svgo-config as json 1`] = `
7070
"import * as React from 'react'
7171
const SvgFile = (props) => (
72-
<svg width={48} height={1} xmlns="http://www.w3.org/2000/svg" {...props}>
72+
<svg xmlns="http://www.w3.org/2000/svg" width={48} height={1} {...props}>
7373
<title>{'Rectangle 5'}</title>
74-
<path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
74+
<path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
7575
</svg>
7676
)
7777
export default SvgFile
@@ -134,8 +134,8 @@ exports[`cli should support different filename cases with directory output: --fi
134134
exports[`cli should support stdin filepath 1`] = `
135135
"import * as React from 'react'
136136
const SvgFile = (props) => (
137-
<svg width={48} height={1} xmlns="http://www.w3.org/2000/svg" {...props}>
138-
<path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
137+
<svg xmlns="http://www.w3.org/2000/svg" width={48} height={1} {...props}>
138+
<path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
139139
</svg>
140140
)
141141
export default SvgFile
@@ -147,14 +147,14 @@ exports[`cli should support various args: --desc-prop 1`] = `
147147
"import * as React from 'react'
148148
const SvgFile = ({ desc, descId, ...props }) => (
149149
<svg
150+
xmlns="http://www.w3.org/2000/svg"
150151
width={48}
151152
height={1}
152-
xmlns="http://www.w3.org/2000/svg"
153153
aria-describedby={descId}
154154
{...props}
155155
>
156156
{desc ? <desc id={descId}>{desc}</desc> : null}
157-
<path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
157+
<path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
158158
</svg>
159159
)
160160
export default SvgFile
@@ -165,8 +165,8 @@ export default SvgFile
165165
exports[`cli should support various args: --expand-props none 1`] = `
166166
"import * as React from 'react'
167167
const SvgFile = () => (
168-
<svg width={48} height={1} xmlns="http://www.w3.org/2000/svg">
169-
<path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
168+
<svg xmlns="http://www.w3.org/2000/svg" width={48} height={1}>
169+
<path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
170170
</svg>
171171
)
172172
export default SvgFile
@@ -177,8 +177,8 @@ export default SvgFile
177177
exports[`cli should support various args: --expand-props start 1`] = `
178178
"import * as React from 'react'
179179
const SvgFile = (props) => (
180-
<svg {...props} width={48} height={1} xmlns="http://www.w3.org/2000/svg">
181-
<path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
180+
<svg {...props} xmlns="http://www.w3.org/2000/svg" width={48} height={1}>
181+
<path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
182182
</svg>
183183
)
184184
export default SvgFile
@@ -190,13 +190,13 @@ exports[`cli should support various args: --icon 1`] = `
190190
"import * as React from 'react'
191191
const SvgFile = (props) => (
192192
<svg
193+
xmlns="http://www.w3.org/2000/svg"
193194
width="1em"
194195
height="1em"
195196
viewBox="0 0 48 1"
196-
xmlns="http://www.w3.org/2000/svg"
197197
{...props}
198198
>
199-
<path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
199+
<path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
200200
</svg>
201201
)
202202
export default SvgFile
@@ -208,13 +208,13 @@ exports[`cli should support various args: --icon 2em 1`] = `
208208
"import * as React from 'react'
209209
const SvgFile = (props) => (
210210
<svg
211+
xmlns="http://www.w3.org/2000/svg"
211212
width="2em"
212213
height="2em"
213214
viewBox="0 0 48 1"
214-
xmlns="http://www.w3.org/2000/svg"
215215
{...props}
216216
>
217-
<path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
217+
<path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
218218
</svg>
219219
)
220220
export default SvgFile
@@ -226,13 +226,13 @@ exports[`cli should support various args: --icon 24 1`] = `
226226
"import * as React from 'react'
227227
const SvgFile = (props) => (
228228
<svg
229+
xmlns="http://www.w3.org/2000/svg"
229230
width={24}
230231
height={24}
231232
viewBox="0 0 48 1"
232-
xmlns="http://www.w3.org/2000/svg"
233233
{...props}
234234
>
235-
<path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
235+
<path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
236236
</svg>
237237
)
238238
export default SvgFile
@@ -242,8 +242,8 @@ export default SvgFile
242242

243243
exports[`cli should support various args: --jsx-runtime automatic 1`] = `
244244
"const SvgFile = (props) => (
245-
<svg width={48} height={1} xmlns="http://www.w3.org/2000/svg" {...props}>
246-
<path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
245+
<svg xmlns="http://www.w3.org/2000/svg" width={48} height={1} {...props}>
246+
<path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
247247
</svg>
248248
)
249249
export default SvgFile
@@ -254,8 +254,8 @@ export default SvgFile
254254
exports[`cli should support various args: --jsx-runtime classic-preact 1`] = `
255255
"import { h } from 'preact'
256256
const SvgFile = (props) => (
257-
<svg width={48} height={1} xmlns="http://www.w3.org/2000/svg" {...props}>
258-
<path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
257+
<svg xmlns="http://www.w3.org/2000/svg" width={48} height={1} {...props}>
258+
<path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
259259
</svg>
260260
)
261261
export default SvgFile
@@ -267,8 +267,8 @@ exports[`cli should support various args: --native --expand-props none 1`] = `
267267
"import * as React from 'react'
268268
import Svg, { Path } from 'react-native-svg'
269269
const SvgFile = () => (
270-
<Svg width={48} height={1} xmlns="http://www.w3.org/2000/svg">
271-
<Path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
270+
<Svg xmlns="http://www.w3.org/2000/svg" width={48} height={1}>
271+
<Path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
272272
</Svg>
273273
)
274274
export default SvgFile
@@ -281,13 +281,13 @@ exports[`cli should support various args: --native --icon 1`] = `
281281
import Svg, { Path } from 'react-native-svg'
282282
const SvgFile = (props) => (
283283
<Svg
284+
xmlns="http://www.w3.org/2000/svg"
284285
width={24}
285286
height={24}
286287
viewBox="0 0 48 1"
287-
xmlns="http://www.w3.org/2000/svg"
288288
{...props}
289289
>
290-
<Path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
290+
<Path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
291291
</Svg>
292292
)
293293
export default SvgFile
@@ -301,13 +301,13 @@ import Svg, { Path } from 'react-native-svg'
301301
import { forwardRef } from 'react'
302302
const SvgFile = (props, ref) => (
303303
<Svg
304+
xmlns="http://www.w3.org/2000/svg"
304305
width={48}
305306
height={1}
306-
xmlns="http://www.w3.org/2000/svg"
307307
ref={ref}
308308
{...props}
309309
>
310-
<Path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
310+
<Path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
311311
</Svg>
312312
)
313313
const ForwardRef = forwardRef(SvgFile)
@@ -320,8 +320,8 @@ exports[`cli should support various args: --native 1`] = `
320320
"import * as React from 'react'
321321
import Svg, { Path } from 'react-native-svg'
322322
const SvgFile = (props) => (
323-
<Svg width={48} height={1} xmlns="http://www.w3.org/2000/svg" {...props}>
324-
<Path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
323+
<Svg xmlns="http://www.w3.org/2000/svg" width={48} height={1} {...props}>
324+
<Path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
325325
</Svg>
326326
)
327327
export default SvgFile
@@ -332,8 +332,8 @@ export default SvgFile
332332
exports[`cli should support various args: --no-dimensions 1`] = `
333333
"import * as React from 'react'
334334
const SvgFile = (props) => (
335-
<svg viewBox="0 0 48 1" xmlns="http://www.w3.org/2000/svg" {...props}>
336-
<path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
335+
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 1" {...props}>
336+
<path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
337337
</svg>
338338
)
339339
export default SvgFile
@@ -343,7 +343,7 @@ export default SvgFile
343343

344344
exports[`cli should support various args: --no-prettier 1`] = `
345345
"import * as React from "react";
346-
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>;
346+
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>;
347347
export default SvgFile;
348348
"
349349
`;
@@ -391,13 +391,13 @@ exports[`cli should support various args: --ref 1`] = `
391391
import { forwardRef } from 'react'
392392
const SvgFile = (props, ref) => (
393393
<svg
394+
xmlns="http://www.w3.org/2000/svg"
394395
width={48}
395396
height={1}
396-
xmlns="http://www.w3.org/2000/svg"
397397
ref={ref}
398398
{...props}
399399
>
400-
<path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
400+
<path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
401401
</svg>
402402
)
403403
const ForwardRef = forwardRef(SvgFile)
@@ -409,8 +409,8 @@ export default ForwardRef
409409
exports[`cli should support various args: --replace-attr-values "#063855=currentColor" 1`] = `
410410
"import * as React from 'react'
411411
const SvgFile = (props) => (
412-
<svg width={48} height={1} xmlns="http://www.w3.org/2000/svg" {...props}>
413-
<path d="M0 0h48v1H0z" fill="currentColor" fillRule="evenodd" />
412+
<svg xmlns="http://www.w3.org/2000/svg" width={48} height={1} {...props}>
413+
<path fill="currentColor" fillRule="evenodd" d="M0 0h48v1H0z" />
414414
</svg>
415415
)
416416
export default SvgFile
@@ -422,14 +422,14 @@ exports[`cli should support various args: --svg-props "hidden={true},id=hello" 1
422422
"import * as React from 'react'
423423
const SvgFile = (props) => (
424424
<svg
425+
xmlns="http://www.w3.org/2000/svg"
425426
width={48}
426427
height={1}
427-
xmlns="http://www.w3.org/2000/svg"
428428
hidden={true}
429429
id="hello"
430430
{...props}
431431
>
432-
<path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
432+
<path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
433433
</svg>
434434
)
435435
export default SvgFile
@@ -441,14 +441,14 @@ exports[`cli should support various args: --title-prop 1`] = `
441441
"import * as React from 'react'
442442
const SvgFile = ({ title, titleId, ...props }) => (
443443
<svg
444+
xmlns="http://www.w3.org/2000/svg"
444445
width={48}
445446
height={1}
446-
xmlns="http://www.w3.org/2000/svg"
447447
aria-labelledby={titleId}
448448
{...props}
449449
>
450450
{title ? <title id={titleId}>{title}</title> : null}
451-
<path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
451+
<path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
452452
</svg>
453453
)
454454
export default SvgFile
@@ -468,15 +468,15 @@ const SvgFile = (
468468
ref: Ref<SVGSVGElement>,
469469
) => (
470470
<svg
471+
xmlns="http://www.w3.org/2000/svg"
471472
width={48}
472473
height={1}
473-
xmlns="http://www.w3.org/2000/svg"
474474
ref={ref}
475475
aria-describedby={descId}
476476
{...props}
477477
>
478478
{desc ? <desc id={descId}>{desc}</desc> : null}
479-
<path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
479+
<path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
480480
</svg>
481481
)
482482
const ForwardRef = forwardRef(SvgFile)
@@ -497,15 +497,15 @@ const SvgFile = (
497497
ref: Ref<SVGSVGElement>,
498498
) => (
499499
<svg
500+
xmlns="http://www.w3.org/2000/svg"
500501
width={48}
501502
height={1}
502-
xmlns="http://www.w3.org/2000/svg"
503503
ref={ref}
504504
aria-labelledby={titleId}
505505
{...props}
506506
>
507507
{title ? <title id={titleId}>{title}</title> : null}
508-
<path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
508+
<path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
509509
</svg>
510510
)
511511
const ForwardRef = forwardRef(SvgFile)
@@ -519,13 +519,13 @@ exports[`cli should support various args: --typescript --ref 1`] = `
519519
import { SVGProps, Ref, forwardRef } from 'react'
520520
const SvgFile = (props: SVGProps<SVGSVGElement>, ref: Ref<SVGSVGElement>) => (
521521
<svg
522+
xmlns="http://www.w3.org/2000/svg"
522523
width={48}
523524
height={1}
524-
xmlns="http://www.w3.org/2000/svg"
525525
ref={ref}
526526
{...props}
527527
>
528-
<path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
528+
<path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
529529
</svg>
530530
)
531531
const ForwardRef = forwardRef(SvgFile)
@@ -538,8 +538,8 @@ exports[`cli should support various args: --typescript 1`] = `
538538
"import * as React from 'react'
539539
import { SVGProps } from 'react'
540540
const SvgFile = (props: SVGProps<SVGSVGElement>) => (
541-
<svg width={48} height={1} xmlns="http://www.w3.org/2000/svg" {...props}>
542-
<path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
541+
<svg xmlns="http://www.w3.org/2000/svg" width={48} height={1} {...props}>
542+
<path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
543543
</svg>
544544
)
545545
export default SvgFile
@@ -590,8 +590,8 @@ __fixtures__/withsvgrrc/file.svg -> __fixtures_build__/whole/withsvgrrc/file.tsx
590590
exports[`cli should work with a simple file 1`] = `
591591
"import * as React from 'react'
592592
const SvgFile = (props) => (
593-
<svg width={48} height={1} xmlns="http://www.w3.org/2000/svg" {...props}>
594-
<path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
593+
<svg xmlns="http://www.w3.org/2000/svg" width={48} height={1} {...props}>
594+
<path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
595595
</svg>
596596
)
597597
export default SvgFile
@@ -602,8 +602,8 @@ export default SvgFile
602602
exports[`cli should work with stdin 1`] = `
603603
"import * as React from 'react'
604604
const SvgComponent = (props) => (
605-
<svg width={48} height={1} xmlns="http://www.w3.org/2000/svg" {...props}>
606-
<path d="M0 0h48v1H0z" fill="#063855" fillRule="evenodd" />
605+
<svg xmlns="http://www.w3.org/2000/svg" width={48} height={1} {...props}>
606+
<path fill="#063855" fillRule="evenodd" d="M0 0h48v1H0z" />
607607
</svg>
608608
)
609609
export default SvgComponent

0 commit comments

Comments
 (0)