Skip to content

Commit 388acea

Browse files
TrySoundTrySound
authoredFeb 23, 2020
refactor: migrate to import * as React from 'react' (#401)
Ref facebook/react#18102
·
v8.1.0v5.2.0
1 parent 5a90553 commit 388acea

File tree

35 files changed

+106
-104
lines changed

35 files changed

+106
-104
lines changed
 

‎README.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -78,7 +78,7 @@ npx @svgr/cli --icon --replace-attr-values "#063855=currentColor" icon.svg
7878
**Output**
7979

8080
```js
81-
import React from 'react'
81+
import * as React from 'react'
8282

8383
const SvgComponent = props => (
8484
<svg width="1em" height="1em" viewBox="0 0 48 1" {...props}>

‎__fixtures__/template.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
module.exports = () => (code, state) => `
2-
import React from 'react'
2+
import * as React from 'react'
33
44
export default function ${state.componentName}() {
55
return ${code}

‎packages/babel-plugin-transform-svg-component/src/index.test.js

+8-8
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ describe('plugin', () => {
1616
state: { componentName: 'SvgComponent' },
1717
})
1818
expect(code).toMatchInlineSnapshot(`
19-
"import React from \\"react\\";
19+
"import * as React from \\"react\\";
2020
2121
function SvgComponent() {
2222
return <svg><div /></svg>;
@@ -32,7 +32,7 @@ describe('plugin', () => {
3232
native: true,
3333
})
3434
expect(code).toMatchInlineSnapshot(`
35-
"import React from \\"react\\";
35+
"import * as React from \\"react\\";
3636
import Svg from \\"react-native-svg\\";
3737
3838
function SvgComponent() {
@@ -49,7 +49,7 @@ describe('plugin', () => {
4949
native: { expo: true },
5050
})
5151
expect(code).toMatchInlineSnapshot(`
52-
"import React from \\"react\\";
52+
"import * as React from \\"react\\";
5353
import \\"expo\\";
5454
5555
function SvgComponent() {
@@ -66,14 +66,14 @@ describe('plugin', () => {
6666
{ template },
6767
opts,
6868
{ jsx },
69-
) => template.ast`import React from 'react';
69+
) => template.ast`import * as React from 'react';
7070
const MyComponent = () => ${jsx}
7171
export default MyComponent
7272
`,
7373
state: { componentName: 'SvgComponent' },
7474
})
7575
expect(code).toMatchInlineSnapshot(`
76-
"import React from 'react';
76+
"import * as React from 'react';
7777
7878
const MyComponent = () => <svg><div /></svg>;
7979
@@ -116,7 +116,7 @@ describe('plugin', () => {
116116
ref: true,
117117
})
118118
expect(code).toMatchInlineSnapshot(`
119-
"import React from \\"react\\";
119+
"import * as React from \\"react\\";
120120
121121
function SvgComponent({
122122
svgRef
@@ -135,7 +135,7 @@ describe('plugin', () => {
135135
memo: true,
136136
})
137137
expect(code).toMatchInlineSnapshot(`
138-
"import React from \\"react\\";
138+
"import * as React from \\"react\\";
139139
140140
function SvgComponent() {
141141
return <svg><div /></svg>;
@@ -153,7 +153,7 @@ describe('plugin', () => {
153153
ref: true,
154154
})
155155
expect(code).toMatchInlineSnapshot(`
156-
"import React from \\"react\\";
156+
"import * as React from \\"react\\";
157157
158158
function SvgComponent({
159159
svgRef

‎packages/babel-plugin-transform-svg-component/src/util.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -50,7 +50,7 @@ export const getProps = ({ types: t }, opts) => {
5050
export const getImport = ({ types: t }, opts) => {
5151
const importDeclarations = [
5252
t.importDeclaration(
53-
[t.importDefaultSpecifier(t.identifier('React'))],
53+
[t.importNamespaceSpecifier(t.identifier('React'))],
5454
t.stringLiteral('react'),
5555
),
5656
]

‎packages/babel-preset/src/index.test.js

+7-7
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ describe('preset', () => {
2424
},
2525
}),
2626
).toMatchInlineSnapshot(`
27-
"import React from \\"react\\";
27+
"import * as React from \\"react\\";
2828
2929
function SvgComponent() {
3030
return <svg foo=\\"bar\\" x={y} />;
@@ -43,7 +43,7 @@ describe('preset', () => {
4343
},
4444
}),
4545
).toMatchInlineSnapshot(`
46-
"import React from \\"react\\";
46+
"import * as React from \\"react\\";
4747
import { Svg } from \\"expo\\";
4848
4949
function SvgComponent() {
@@ -63,7 +63,7 @@ describe('preset', () => {
6363
},
6464
}),
6565
).toMatchInlineSnapshot(`
66-
"import React from \\"react\\";
66+
"import * as React from \\"react\\";
6767
6868
function SvgComponent({
6969
title,
@@ -85,7 +85,7 @@ describe('preset', () => {
8585
},
8686
}),
8787
).toMatchInlineSnapshot(`
88-
"import React from \\"react\\";
88+
"import * as React from \\"react\\";
8989
9090
function SvgComponent({
9191
title,
@@ -105,7 +105,7 @@ describe('preset', () => {
105105
},
106106
}),
107107
).toMatchInlineSnapshot(`
108-
"import React from \\"react\\";
108+
"import * as React from \\"react\\";
109109
110110
function SvgComponent({
111111
title,
@@ -130,7 +130,7 @@ describe('preset', () => {
130130
},
131131
}),
132132
).toMatchInlineSnapshot(`
133-
"import React from \\"react\\";
133+
"import * as React from \\"react\\";
134134
135135
function SvgComponent() {
136136
return <svg a=\\"black\\" b={props.white} />;
@@ -151,7 +151,7 @@ describe('preset', () => {
151151
},
152152
}),
153153
).toMatchInlineSnapshot(`
154-
"import React from \\"react\\";
154+
"import * as React from \\"react\\";
155155
156156
function SvgComponent(props) {
157157
return <svg a=\\"#000\\" b=\\"#fff\\" width=\\"1em\\" height=\\"1em\\" {...props} />;

‎packages/cli/src/__snapshots__/index.test.js.snap

+22-22
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ export { default as File } from './File'"
66
`;
77

88
exports[`cli should not override config with cli defaults 1`] = `
9-
"import React from \\"react\\";
9+
"import * as React from \\"react\\";
1010
1111
function SvgFile() {
1212
return <svg viewBox=\\"0 0 48 1\\"><title>{\\"Rectangle 5\\"}</title><desc>{\\"Created with Sketch.\\"}</desc><defs /><g id=\\"Page-1\\" stroke=\\"none\\" strokeWidth={1} fill=\\"none\\" fillRule=\\"evenodd\\"><g id=\\"19-Separator\\" transform=\\"translate(-129.000000, -156.000000)\\" fill=\\"#063855\\"><g id=\\"Controls/Settings\\" transform=\\"translate(80.000000, 0.000000)\\"><g id=\\"Content\\" transform=\\"translate(0.000000, 64.000000)\\"><g id=\\"Group\\" transform=\\"translate(24.000000, 56.000000)\\"><g id=\\"Group-2\\"><rect id=\\"Rectangle-5\\" x={25} y={36} width={48} height={1} /></g></g></g></g></g></g></svg>;
@@ -19,7 +19,7 @@ export default SvgFile;
1919
exports[`cli should support --index-template in cli 1`] = `"export { File } from './File'"`;
2020

2121
exports[`cli should support --prettier-config as file 1`] = `
22-
"import React from 'react'
22+
"import * as React from 'react'
2323
2424
function SvgFile(props) {
2525
return (
@@ -35,7 +35,7 @@ export default SvgFile
3535
`;
3636

3737
exports[`cli should support --prettier-config as json 1`] = `
38-
"import React from 'react'
38+
"import * as React from 'react'
3939
4040
function SvgFile(props) {
4141
return (
@@ -51,7 +51,7 @@ export default SvgFile
5151
`;
5252

5353
exports[`cli should support --svgo-config as file 1`] = `
54-
"import React from 'react'
54+
"import * as React from 'react'
5555
5656
function SvgFile(props) {
5757
return (
@@ -68,7 +68,7 @@ export default SvgFile
6868
`;
6969

7070
exports[`cli should support --svgo-config as json 1`] = `
71-
"import React from 'react'
71+
"import * as React from 'react'
7272
7373
function SvgFile(props) {
7474
return (
@@ -134,7 +134,7 @@ Array [
134134
`;
135135

136136
exports[`cli should support stdin filepath 1`] = `
137-
"import React from 'react'
137+
"import * as React from 'react'
138138
139139
function SvgFile(props) {
140140
return (
@@ -150,7 +150,7 @@ export default SvgFile
150150
`;
151151

152152
exports[`cli should support various args: --expand-props none 1`] = `
153-
"import React from 'react'
153+
"import * as React from 'react'
154154
155155
function SvgFile() {
156156
return (
@@ -166,7 +166,7 @@ export default SvgFile
166166
`;
167167

168168
exports[`cli should support various args: --expand-props start 1`] = `
169-
"import React from 'react'
169+
"import * as React from 'react'
170170
171171
function SvgFile(props) {
172172
return (
@@ -182,7 +182,7 @@ export default SvgFile
182182
`;
183183

184184
exports[`cli should support various args: --icon 1`] = `
185-
"import React from 'react'
185+
"import * as React from 'react'
186186
187187
function SvgFile(props) {
188188
return (
@@ -198,7 +198,7 @@ export default SvgFile
198198
`;
199199

200200
exports[`cli should support various args: --native --expand-props none 1`] = `
201-
"import React from 'react'
201+
"import * as React from 'react'
202202
import Svg, { Path } from 'react-native-svg'
203203
204204
function SvgFile() {
@@ -215,7 +215,7 @@ export default SvgFile
215215
`;
216216

217217
exports[`cli should support various args: --native --icon 1`] = `
218-
"import React from 'react'
218+
"import * as React from 'react'
219219
import Svg, { Path } from 'react-native-svg'
220220
221221
function SvgFile(props) {
@@ -232,7 +232,7 @@ export default SvgFile
232232
`;
233233

234234
exports[`cli should support various args: --native --ref 1`] = `
235-
"import React from 'react'
235+
"import * as React from 'react'
236236
import Svg, { Path } from 'react-native-svg'
237237
238238
function SvgFile({ svgRef, ...props }) {
@@ -252,7 +252,7 @@ export default ForwardRef
252252
`;
253253

254254
exports[`cli should support various args: --native 1`] = `
255-
"import React from 'react'
255+
"import * as React from 'react'
256256
import Svg, { Path } from 'react-native-svg'
257257
258258
function SvgFile(props) {
@@ -269,7 +269,7 @@ export default SvgFile
269269
`;
270270

271271
exports[`cli should support various args: --no-dimensions 1`] = `
272-
"import React from 'react'
272+
"import * as React from 'react'
273273
274274
function SvgFile(props) {
275275
return (
@@ -285,7 +285,7 @@ export default SvgFile
285285
`;
286286

287287
exports[`cli should support various args: --no-prettier 1`] = `
288-
"import React from \\"react\\";
288+
"import * as React from \\"react\\";
289289
290290
function SvgFile(props) {
291291
return <svg width={48} height={1} {...props}><path d=\\"M0 0h48v1H0z\\" fill=\\"#063855\\" fillRule=\\"evenodd\\" /></svg>;
@@ -296,7 +296,7 @@ export default SvgFile;
296296
`;
297297

298298
exports[`cli should support various args: --no-svgo 1`] = `
299-
"import React from 'react'
299+
"import * as React from 'react'
300300
301301
function SvgFile(props) {
302302
return (
@@ -337,7 +337,7 @@ export default SvgFile
337337
`;
338338

339339
exports[`cli should support various args: --ref 1`] = `
340-
"import React from 'react'
340+
"import * as React from 'react'
341341
342342
function SvgFile({ svgRef, ...props }) {
343343
return (
@@ -356,7 +356,7 @@ export default ForwardRef
356356
`;
357357

358358
exports[`cli should support various args: --replace-attr-values "#063855=currentColor" 1`] = `
359-
"import React from 'react'
359+
"import * as React from 'react'
360360
361361
function SvgFile(props) {
362362
return (
@@ -372,7 +372,7 @@ export default SvgFile
372372
`;
373373

374374
exports[`cli should support various args: --svg-props "hidden={true},id=hello" 1`] = `
375-
"import React from 'react'
375+
"import * as React from 'react'
376376
377377
function SvgFile(props) {
378378
return (
@@ -388,7 +388,7 @@ export default SvgFile
388388
`;
389389

390390
exports[`cli should support various args: --title-prop 1`] = `
391-
"import React from 'react'
391+
"import * as React from 'react'
392392
393393
function SvgFile({ title, titleId, ...props }) {
394394
return (
@@ -426,7 +426,7 @@ __fixtures__/withSvgrRc/file.svg -> __fixtures_build__/whole/withSvgrRc/File.js"
426426
`;
427427

428428
exports[`cli should work with a simple file 1`] = `
429-
"import React from 'react'
429+
"import * as React from 'react'
430430
431431
function SvgFile(props) {
432432
return (
@@ -442,7 +442,7 @@ export default SvgFile
442442
`;
443443

444444
exports[`cli should work with stdin 1`] = `
445-
"import React from 'react'
445+
"import * as React from 'react'
446446
447447
function SvgComponent(props) {
448448
return (

‎packages/cli/src/__snapshots__/util.test.js.snap

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
// Jest Snapshot v1, https://goo.gl/fbAQLP
22

33
exports[`util #convertFile should convert a file 1`] = `
4-
"import React from 'react'
4+
"import * as React from 'react'
55
66
function SvgFile(props) {
77
return (
@@ -16,7 +16,7 @@ export default SvgFile
1616
`;
1717

1818
exports[`util #convertFile should support a custom config path 1`] = `
19-
"import React from 'react'
19+
"import * as React from 'react'
2020
2121
function SvgFile(props) {
2222
return (

‎packages/core/src/__snapshots__/convert.test.js.snap

+24-24
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
// Jest Snapshot v1, https://goo.gl/fbAQLP
22

33
exports[`convert config should support options 0 1`] = `
4-
"import React from 'react'
4+
"import * as React from 'react'
55
66
function SvgComponent(props) {
77
return (
@@ -24,7 +24,7 @@ export default SvgComponent
2424
`;
2525

2626
exports[`convert config should support options 1 1`] = `
27-
"import React from 'react'
27+
"import * as React from 'react'
2828
2929
function SvgComponent() {
3030
return (
@@ -47,7 +47,7 @@ export default SvgComponent
4747
`;
4848

4949
exports[`convert config should support options 2 1`] = `
50-
"import React from 'react'
50+
"import * as React from 'react'
5151
5252
function SvgComponent(props) {
5353
return (
@@ -70,7 +70,7 @@ export default SvgComponent
7070
`;
7171

7272
exports[`convert config should support options 3 1`] = `
73-
"import React from 'react'
73+
"import * as React from 'react'
7474
7575
function SvgComponent(props) {
7676
return (
@@ -93,7 +93,7 @@ export default SvgComponent
9393
`;
9494

9595
exports[`convert config should support options 4 1`] = `
96-
"import React from 'react'
96+
"import * as React from 'react'
9797
import Svg, { G, Path } from 'react-native-svg'
9898
9999
function SvgComponent(props) {
@@ -117,7 +117,7 @@ export default SvgComponent
117117
`;
118118

119119
exports[`convert config should support options 5 1`] = `
120-
"import React from 'react'
120+
"import * as React from 'react'
121121
import { Svg } from 'expo'
122122
123123
function SvgComponent(props) {
@@ -141,7 +141,7 @@ export default SvgComponent
141141
`;
142142

143143
exports[`convert config should support options 6 1`] = `
144-
"import React from 'react'
144+
"import * as React from 'react'
145145
import Svg, { G, Path } from 'react-native-svg'
146146
147147
function SvgComponent(props) {
@@ -165,7 +165,7 @@ export default SvgComponent
165165
`;
166166

167167
exports[`convert config should support options 7 1`] = `
168-
"import React from 'react'
168+
"import * as React from 'react'
169169
import Svg, { G, Path } from 'react-native-svg'
170170
171171
function SvgComponent() {
@@ -189,7 +189,7 @@ export default SvgComponent
189189
`;
190190

191191
exports[`convert config should support options 8 1`] = `
192-
"import React from 'react'
192+
"import * as React from 'react'
193193
import Svg, { G, Path } from 'react-native-svg'
194194
195195
function SvgComponent({ svgRef, ...props }) {
@@ -216,7 +216,7 @@ export default ForwardRef
216216
`;
217217

218218
exports[`convert config should support options 9 1`] = `
219-
"import React from 'react'
219+
"import * as React from 'react'
220220
221221
function SvgComponent({ svgRef, ...props }) {
222222
return (
@@ -242,7 +242,7 @@ export default ForwardRef
242242
`;
243243

244244
exports[`convert config should support options 10 1`] = `
245-
"import React from 'react'
245+
"import * as React from 'react'
246246
247247
function SvgComponent(props) {
248248
return (
@@ -265,7 +265,7 @@ export default SvgComponent
265265
`;
266266

267267
exports[`convert config should support options 11 1`] = `
268-
"import React from 'react'
268+
"import * as React from 'react'
269269
270270
function SvgComponent(props) {
271271
return (
@@ -288,7 +288,7 @@ export default SvgComponent
288288
`;
289289

290290
exports[`convert config should support options 12 1`] = `
291-
"import React from 'react'
291+
"import * as React from 'react'
292292
293293
function SvgComponent(props) {
294294
return (
@@ -311,7 +311,7 @@ export default SvgComponent
311311
`;
312312

313313
exports[`convert config should support options 13 1`] = `
314-
"import React from 'react'
314+
"import * as React from 'react'
315315
316316
function SvgComponent(props) {
317317
return (
@@ -341,7 +341,7 @@ export default SvgComponent
341341
`;
342342

343343
exports[`convert config should support options 14 1`] = `
344-
"import React from \\"react\\";
344+
"import * as React from \\"react\\";
345345
346346
function SvgComponent(props) {
347347
return <svg width={88} height={88} {...props}><g stroke=\\"#063855\\" strokeWidth={2} fill=\\"none\\" fillRule=\\"evenodd\\" strokeLinecap=\\"square\\"><path d=\\"M51 37L37 51M51 51L37 37\\" /></g></svg>;
@@ -358,7 +358,7 @@ export default noop
358358
`;
359359

360360
exports[`convert config should support options 16 1`] = `
361-
"import React from 'react'
361+
"import * as React from 'react'
362362
363363
function SvgComponent({ title, titleId, ...props }) {
364364
return (
@@ -382,7 +382,7 @@ export default SvgComponent
382382
`;
383383

384384
exports[`convert config should support options 17 1`] = `
385-
"import React from 'react'
385+
"import * as React from 'react'
386386
387387
function SvgComponent(props) {
388388
return (
@@ -406,7 +406,7 @@ export default MemoSvgComponent
406406
`;
407407

408408
exports[`convert config titleProp: without title added 1`] = `
409-
"import React from 'react'
409+
"import * as React from 'react'
410410
411411
function SvgComponent({ title, titleId, ...props }) {
412412
return (
@@ -430,7 +430,7 @@ export default SvgComponent
430430
`;
431431

432432
exports[`convert should convert 1`] = `
433-
"import React from 'react'
433+
"import * as React from 'react'
434434
435435
function SvgComponent(props) {
436436
return (
@@ -453,7 +453,7 @@ export default SvgComponent
453453
`;
454454

455455
exports[`convert should convert style attribute 1`] = `
456-
"import React from 'react'
456+
"import * as React from 'react'
457457
458458
function SvgComponent(props) {
459459
return (
@@ -500,7 +500,7 @@ export default SvgComponent
500500
`;
501501

502502
exports[`convert should handle special SVG attributes 1`] = `
503-
"import React from 'react'
503+
"import * as React from 'react'
504504
505505
function SvgComponent(props) {
506506
return (
@@ -515,7 +515,7 @@ export default SvgComponent
515515
`;
516516

517517
exports[`convert should not remove all style tags 1`] = `
518-
"import React from 'react'
518+
"import * as React from 'react'
519519
520520
function SvgComponent(props) {
521521
return (
@@ -543,7 +543,7 @@ export default SvgComponent
543543
`;
544544

545545
exports[`convert should remove null characters 1`] = `
546-
"import React from 'react'
546+
"import * as React from 'react'
547547
548548
function SvgComponent(props) {
549549
return (
@@ -563,7 +563,7 @@ export default SvgComponent
563563
`;
564564

565565
exports[`convert should remove style tags 1`] = `
566-
"import React from 'react'
566+
"import * as React from 'react'
567567
568568
function SvgComponent(props) {
569569
return (

‎packages/parcel-plugin-svgr/src/__snapshots__/index.test.js.snap

+7-5
Original file line numberDiff line numberDiff line change
@@ -10,9 +10,11 @@ Object.defineProperty(exports, \\"__esModule\\", {
1010
});
1111
exports.default = void 0;
1212
13-
var _react = _interopRequireDefault(require(\\"react\\"));
13+
var React = _interopRequireWildcard(require(\\"react\\"));
1414
15-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
15+
function _getRequireWildcardCache() { if (typeof WeakMap !== \\"function\\") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
16+
17+
function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== \\"object\\" && typeof obj !== \\"function\\") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
1618
1719
function _extends() {
1820
_extends = Object.assign || function (target) {
@@ -34,18 +36,18 @@ function _extends() {
3436
3537
var _ref =
3638
/*#__PURE__*/
37-
_react.default.createElement(\\"g\\", {
39+
React.createElement(\\"g\\", {
3840
stroke: \\"#063855\\",
3941
strokeWidth: 2,
4042
fill: \\"none\\",
4143
fillRule: \\"evenodd\\",
4244
strokeLinecap: \\"square\\"
43-
}, _react.default.createElement(\\"path\\", {
45+
}, React.createElement(\\"path\\", {
4446
d: \\"M51 37L37 51M51 51L37 37\\"
4547
}));
4648
4749
function SvgIcon(props) {
48-
return _react.default.createElement(\\"svg\\", _extends({
50+
return React.createElement(\\"svg\\", _extends({
4951
width: 88,
5052
height: 88
5153
}, props), _ref);

‎packages/plugin-jsx/src/index.test.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ describe('plugin', () => {
2020
it('should transform code', () => {
2121
const result = jsx(svgBaseCode, {}, { componentName: 'SvgComponent' })
2222
expect(result).toMatchInlineSnapshot(`
23-
"import React from \\"react\\";
23+
"import * as React from \\"react\\";
2424
2525
function SvgComponent() {
2626
return <svg viewBox=\\"0 0 88 88\\"><title>{\\"Dismiss\\"}</title><desc>{\\"Created with Sketch.\\"}</desc><defs /><g id=\\"Blocks\\" stroke=\\"none\\" strokeWidth={1} fill=\\"none\\" fillRule=\\"evenodd\\" strokeLinecap=\\"square\\"><g id=\\"Dismiss\\" stroke=\\"#063855\\" strokeWidth={2}><path d=\\"M51,37 L37,51\\" id=\\"Shape\\" /><path d=\\"M51,51 L37,37\\" id=\\"Shape\\" /></g></g></svg>;
@@ -49,7 +49,7 @@ describe('plugin', () => {
4949
{ componentName: 'SvgComponent' },
5050
)
5151
expect(result).toMatchInlineSnapshot(`
52-
"import React from \\"react\\";
52+
"import * as React from \\"react\\";
5353
5454
function SvgComponent() {
5555
return <svg viewBox=\\"0 0 88 88\\"><desc>{\\"Created with Sketch.\\"}</desc><defs /><g id=\\"Blocks\\" stroke=\\"none\\" strokeWidth={1} fill=\\"none\\" fillRule=\\"evenodd\\" strokeLinecap=\\"square\\"><g id=\\"Dismiss\\" stroke=\\"#063855\\" strokeWidth={2}><path d=\\"M51,37 L37,51\\" id=\\"Shape\\" /><path d=\\"M51,51 L37,37\\" id=\\"Shape\\" /></g></g></svg>;

‎packages/rollup/src/__snapshots__/index.test.js.snap

+4-4
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
exports[`rollup loader should convert file 1`] = `
44
"function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
55
6-
import React from \\"react\\";
6+
import * as React from \\"react\\";
77
88
var _ref =
99
/*#__PURE__*/
@@ -24,7 +24,7 @@ export default SvgFile;"
2424
`;
2525

2626
exports[`rollup loader should convert file with previousExport of image plugin 1`] = `
27-
"import React from \\"react\\";
27+
"import * as React from \\"react\\";
2828
2929
function SvgFile(props) {
3030
return <svg width={48} height={1} {...props}><path d=\\"M0 0h48v1H0z\\" fill=\\"#063855\\" fillRule=\\"evenodd\\" /></svg>;
@@ -37,7 +37,7 @@ export { SvgFile as ReactComponent };"
3737
`;
3838

3939
exports[`rollup loader should convert file with previousExport of url plugin 1`] = `
40-
"import React from \\"react\\";
40+
"import * as React from \\"react\\";
4141
4242
function SvgFile(props) {
4343
return <svg width={48} height={1} {...props}><path d=\\"M0 0h48v1H0z\\" fill=\\"#063855\\" fillRule=\\"evenodd\\" /></svg>;
@@ -48,7 +48,7 @@ export { SvgFile as ReactComponent };"
4848
`;
4949

5050
exports[`rollup loader should convert file without babel 1`] = `
51-
"import React from \\"react\\";
51+
"import * as React from \\"react\\";
5252
5353
function SvgFile(props) {
5454
return <svg width={48} height={1} {...props}><path d=\\"M0 0h48v1H0z\\" fill=\\"#063855\\" fillRule=\\"evenodd\\" /></svg>;

‎packages/webpack/src/__snapshots__/index.test.js.snap

+3-3
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
// Jest Snapshot v1, https://goo.gl/fbAQLP
22

33
exports[`webpack loader should convert file (babel: false) 1`] = `
4-
"import React from \\"react\\";
4+
"import * as React from \\"react\\";
55
66
function SvgIcon() {
77
return React.createElement(\\"svg\\", {
@@ -22,7 +22,7 @@ export default SvgIcon;"
2222
`;
2323

2424
exports[`webpack loader should convert file 1`] = `
25-
"import React from \\"react\\";
25+
"import * as React from \\"react\\";
2626
2727
var _ref =
2828
/*#__PURE__*/
@@ -47,7 +47,7 @@ export default SvgIcon;"
4747
`;
4848

4949
exports[`webpack loader should support url-loader 1`] = `
50-
"import React from \\"react\\";
50+
"import * as React from \\"react\\";
5151
5252
var _ref =
5353
/*#__PURE__*/

‎website/src/components/playground/CodeFund.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React from 'react'
1+
import * as React from 'react'
22

33
function useScript(src) {
44
React.useEffect(() => {

‎website/src/components/playground/DropArea.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React from 'react'
1+
import * as React from 'react'
22
import styled from '@xstyled/styled-components'
33

44
const FullWidth = styled.div`

‎website/src/components/playground/Editor.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React from 'react'
1+
import * as React from 'react'
22
import { useColorMode } from '@xstyled/styled-components'
33

44
import AceEditor from 'react-ace'

‎website/src/components/playground/Loading.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React from 'react'
1+
import * as React from 'react'
22
import styled, { keyframes } from 'styled-components'
33
import { graphql, StaticQuery } from 'gatsby'
44

‎website/src/components/playground/Playground.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
/* eslint-disable jsx-a11y/accessible-emoji */
2-
import React from 'react'
2+
import * as React from 'react'
33
import styled, {
44
Box,
55
createGlobalStyle,

‎website/src/components/playground/Query.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React from 'react'
1+
import * as React from 'react'
22
import qs from 'query-string'
33
import { createBrowserHistory } from 'history'
44

‎website/src/components/playground/Settings.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React from 'react'
1+
import * as React from 'react'
22
import styled, { up, css } from '@xstyled/styled-components'
33
import { Form, FormSpy } from 'react-final-form'
44
import { SettingsFieldBoolean } from './SettingsFieldBoolean'

‎website/src/components/playground/SettingsFieldBoolean.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React from 'react'
1+
import * as React from 'react'
22
import { Box } from '@xstyled/styled-components'
33
import { FormCheck, FormCheckLabel } from '@smooth-ui/core-sc'
44
import { CheckboxControl } from './controls/CheckboxControl'

‎website/src/components/playground/SettingsFieldEnum.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React from 'react'
1+
import * as React from 'react'
22
import { Box } from '@xstyled/styled-components'
33
import { FormField, FormCheck, FormCheckLabel } from '@smooth-ui/core-sc'
44
import { RadioControl } from 'components/playground/controls/RadioControl'

‎website/src/components/playground/SettingsFieldInteger.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React from 'react'
1+
import * as React from 'react'
22
import { Box } from '@xstyled/styled-components'
33
import { FormField } from '@smooth-ui/core-sc'
44
import { InputControl } from './controls/InputControl'

‎website/src/components/playground/SettingsFieldString.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React from 'react'
1+
import * as React from 'react'
22
import { Box } from '@xstyled/styled-components'
33
import { FormField } from '@smooth-ui/core-sc'
44
import { TextareaControl } from 'components/playground/controls/TextareaControl'

‎website/src/components/playground/SettingsGroup.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React from 'react'
1+
import * as React from 'react'
22
import styled, { up, css, Box } from '@xstyled/styled-components'
33
import { useHiddenState, Hidden, HiddenDisclosure } from 'reakit/Hidden'
44
import { ChevronLeft } from 'components/playground/icons/ChevronLeft'

‎website/src/components/playground/controls/CheckboxControl.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React from 'react'
1+
import * as React from 'react'
22
import { Field } from 'react-final-form'
33
import { Checkbox } from '@smooth-ui/core-sc'
44

‎website/src/components/playground/controls/InputControl.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React from 'react'
1+
import * as React from 'react'
22
import { Field } from 'react-final-form'
33
import { Input } from '@smooth-ui/core-sc'
44

‎website/src/components/playground/controls/RadioControl.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React from 'react'
1+
import * as React from 'react'
22
import { Field } from 'react-final-form'
33
import { Radio } from '@smooth-ui/core-sc'
44

‎website/src/components/playground/controls/TextareaControl.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React from 'react'
1+
import * as React from 'react'
22
import { Field } from 'react-final-form'
33
import { Textarea } from '@smooth-ui/core-sc'
44

‎website/src/components/playground/icons/ChevronLeft.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React from 'react'
1+
import * as React from 'react'
22

33
export const ChevronLeft = props => (
44
<svg

‎website/src/pages/docs/getting-started.mdx

+1-1
Original file line numberDiff line numberDiff line change
@@ -53,7 +53,7 @@ npx @svgr/cli --icon --replace-attr-values "#063855=currentColor" icon.svg
5353
**Output**
5454

5555
```js
56-
import React from 'react'
56+
import * as React from 'react'
5757

5858
const SvgComponent = props => (
5959
<svg width="1em" height="1em" viewBox="0 0 48 1" {...props}>

‎website/src/pages/docs/jest.mdx

+1-1
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ Create a simple mock for the svgr loader and map this in the jest config:
1313
Create a mock file `__mocks__/svgrMock.js`:
1414

1515
```jsx
16-
import React from 'react'
16+
import * as React from 'react'
1717

1818
export default 'SvgrURL'
1919
export const ReactComponent = 'div'

‎website/src/pages/docs/testing.mdx

+1-1
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ This section helps you to integrate SVGR with your test framework.
1313
Create a mock file:
1414

1515
```js
16-
import React from 'react'
16+
import * as React from 'react'
1717

1818
export default 'SvgrURL'
1919

‎website/src/pages/docs/typescript.mdx

+2-2
Original file line numberDiff line numberDiff line change
@@ -46,8 +46,8 @@ module.exports = {
4646
) {
4747
const typeScriptTpl = template.smart({ plugins: ['typescript'] })
4848
return typeScriptTpl.ast`
49-
import React, { SVGProps } from 'react';
50-
const ${componentName} = (props: SVGProps<SVGSVGElement>) => ${jsx};
49+
import * as React from 'react';
50+
const ${componentName} = (props: React.SVGProps<SVGSVGElement>) => ${jsx};
5151
export default ${componentName};
5252
`
5353
},

‎website/src/pages/index.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
/* eslint-disable react/jsx-one-expression-per-line */
22
/* eslint-disable jsx-a11y/accessible-emoji */
3-
import React from 'react'
3+
import * as React from 'react'
44
import { Box } from '@xstyled/styled-components'
55
import Helmet from 'react-helmet'
66
import { HomeHero, ShowCase, BaseLayout } from 'smooth-doc/components'

‎website/src/smooth-doc/components/ThemeProvider.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React from 'react'
1+
import * as React from 'react'
22
import { ThemeProvider as SCThemeProvider } from '@xstyled/styled-components'
33
import deepmerge from 'deepmerge'
44
import { theme as suiTheme } from '@smooth-ui/core-sc'

1 commit comments

Comments
 (1)
Please sign in to comment.