Skip to content
This repository was archived by the owner on Nov 27, 2023. It is now read-only.

Commit 173eeb7

Browse files
committed
fix: for SFCs export a const and not a type
Since there is no such thing as `export default type Component = React.SFC` we instead declare a const (`const Component: React.SFC`) and export this const as default (`export default Component`). For non-default exports this is done in a single line (`export const Component: React.SFC`).
1 parent 75b6a6d commit 173eeb7

10 files changed

+47
-17
lines changed

package-lock.json

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

package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -69,7 +69,7 @@
6969
"babel-generator": "^6.26.0",
7070
"babylon": "7.0.0-beta.40",
7171
"chalk": "^2.3.0",
72-
"dts-dom": "^2.0.1",
72+
"dts-dom": "^2.1.0",
7373
"get-stdin": "^6.0.0",
7474
"meow": "^4.0.0",
7575
"pascal-case": "2.0.1",

src/typings.ts

+10-7
Original file line numberDiff line numberDiff line change
@@ -70,7 +70,7 @@ export function createTypings(moduleName: string|null, programAst: any, options:
7070
if (moduleName === null) {
7171
return m.members.map(member => dom.emit(member)).join('');
7272
} else {
73-
return dom.emit(m, { rootFlags: dom.ContextFlags.Module, tripleSlashDirectives });
73+
return dom.emit(m, { tripleSlashDirectives });
7474
}
7575
}
7676

@@ -107,13 +107,16 @@ function createExportedClassComponent(m: dom.ModuleDeclaration, componentName: s
107107
}
108108

109109
function createExportedFunctionalComponent(m: dom.ModuleDeclaration, componentName: string, propTypes: any,
110-
exportType: dom.DeclarationFlags, interf: dom.InterfaceDeclaration): void {
110+
exportType: dom.DeclarationFlags, interf: dom.InterfaceDeclaration): void {
111+
const typeDecl = dom.create.namedTypeReference(`React.SFC${ propTypes ? `<${interf.name}>` : '' }`);
112+
const constDecl = dom.create.const(componentName, typeDecl);
113+
m.members.push(constDecl);
111114

112-
const typeDecl = dom.create.alias(
113-
componentName,
114-
dom.create.namedTypeReference(`React.SFC${ propTypes ? `<${interf.name}>` : '' }`));
115-
typeDecl.flags = exportType;
116-
m.members.push(typeDecl);
115+
if (exportType === dom.DeclarationFlags.ExportDefault) {
116+
m.members.push(dom.create.exportDefault(componentName));
117+
} else {
118+
constDecl.flags = exportType;
119+
}
117120
}
118121

119122
function createPropTypeTypings(interf: dom.InterfaceDeclaration, ast: AstQuery, propTypes: any,

tests/component-without-proptypes.d.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -8,5 +8,5 @@ declare module 'component' {
88
render(): JSX.Element;
99
}
1010

11-
export type test = React.SFC;
11+
export const test: React.SFC;
1212
}

tests/named-export-specifiers.d.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ declare module 'component' {
55
optionalAny?: any;
66
}
77

8-
export type Component = React.SFC<ComponentProps>;
8+
export const Component: React.SFC<ComponentProps>;
99

10-
export type Component2 = React.SFC;
10+
export const Component2: React.SFC;
1111
}

tests/parsing-test.ts

+3
Original file line numberDiff line numberDiff line change
@@ -108,6 +108,9 @@ test('Parsing should suppport props-types repo', t => {
108108
test('Parsing should suppport props-types repo (with a default import)', t => {
109109
compare(t, 'path', 'prop-types-default-import.jsx', 'prop-types.d.ts', {});
110110
});
111+
test('Parsing should support an SFC with default export', t => {
112+
compare(t, 'component', 'stateless-default-export.jsx', 'stateless-default-export.d.ts');
113+
});
111114
test('Parsing should support an SFC with default export babeled to es6', t => {
112115
compare(t, 'component', 'stateless-export-as-default.js', 'stateless-export-as-default.d.ts');
113116
});

tests/stateless-default-export.d.ts

+12
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
declare module 'component' {
2+
import * as React from 'react';
3+
4+
export interface ComponentProps {
5+
optionalString?: string;
6+
}
7+
8+
const Component: React.SFC<ComponentProps>;
9+
export default Component;
10+
11+
export const Component2: React.SFC;
12+
}

tests/stateless-default-export.jsx

+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
import * as React from 'react';
2+
3+
export default function Component({optionalString}) {
4+
return <div />;
5+
}
6+
7+
Component.propTypes = {
8+
optionalString: React.PropTypes.string,
9+
};
10+
11+
export const Component2 = () => <div />;

tests/stateless-export-as-default.d.ts

+2-1
Original file line numberDiff line numberDiff line change
@@ -6,5 +6,6 @@ declare module 'component' {
66
className?: string;
77
}
88

9-
export default type Component = React.SFC<ComponentProps>;
9+
const Component: React.SFC<ComponentProps>;
10+
export default Component;
1011
}

tests/stateless.d.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ declare module 'component' {
55
optionalAny?: any;
66
}
77

8-
export type Component = React.SFC<ComponentProps>;
8+
export const Component: React.SFC<ComponentProps>;
99

10-
export type Component2 = React.SFC;
10+
export const Component2: React.SFC;
1111
}

0 commit comments

Comments
 (0)