Skip to content

Commit 91d65db

Browse files
satya164satya164
committed
feat: add typescript definitions
fixes #197
1 parent b1d1490 commit 91d65db

File tree

9 files changed

+195
-7
lines changed

9 files changed

+195
-7
lines changed

‎.gitignore

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -41,9 +41,6 @@ build/Release
4141
node_modules/
4242
jspm_packages/
4343

44-
# Typescript v1 declaration files
45-
typings/
46-
4744
# Optional npm cache directory
4845
.npm
4946

‎package.json

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,10 @@
33
"version": "1.0.0-alpha.13",
44
"description": "Blazing fast zero-runtime CSS in JS library",
55
"main": "lib/index.js",
6+
"types": "typings/index.d.ts",
67
"files": [
78
"lib/",
9+
"typings/",
810
"react.js",
911
"server.js",
1012
"babel.js",
@@ -49,6 +51,8 @@
4951
"@babel/preset-env": "^7.0.0",
5052
"@babel/preset-flow": "^7.0.0",
5153
"@callstack/eslint-config": "^2.0.0",
54+
"@types/react": "^16.4.18",
55+
"@types/react-dom": "^16.0.9",
5256
"all-contributors-cli": "^5.4.0",
5357
"babel-core": "^7.0.0-bridge.0",
5458
"codecov": "^3.1.0",
@@ -63,7 +67,8 @@
6367
"prettier": "^1.14.2",
6468
"puppeteer": "^1.8.0",
6569
"react": "^16.5.1",
66-
"release-it": "^7.6.1"
70+
"release-it": "^7.6.1",
71+
"typescript": "^3.1.3"
6772
},
6873
"dependencies": {
6974
"@babel/core": "^7.0.1",

‎src/react/styled.js

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -68,12 +68,13 @@ if (process.env.NODE_ENV !== 'production') {
6868
}
6969

7070
/* ::
71-
type StyledComponent<T> = React.ComponentType<T & { as?: React$ElementType }>;
71+
type StyledComponent<T> = React.ComponentType<{ ...T, as?: React$ElementType, className?: string }>;
7272
7373
type StyledTag<T> = (strings: string[], ...exprs: Array<string | number | {} | (T => string | number)>) => StyledComponent<T>;
7474
75-
declare module.exports: {|
75+
type StyledJSXIntrinsics = $ObjMap<$JSXIntrinsics, <T>({ props: T }) => StyledTag<T>>;
76+
77+
declare module.exports: StyledJSXIntrinsics & {|
7678
<T>(T): StyledTag<React.ElementConfig<T>>,
77-
[string]: StyledTag<{ children?: React.Node, [key: string]: any }>,
7879
|};
7980
*/

‎tsconfig.json

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
{
2+
"compilerOptions": {
3+
"module": "commonjs",
4+
"lib": ["es6", "dom"],
5+
"noImplicitAny": true,
6+
"noImplicitThis": true,
7+
"strictNullChecks": true,
8+
"strictFunctionTypes": true,
9+
"noEmit": true,
10+
"forceConsistentCasingInFileNames": true,
11+
"jsx": "react"
12+
}
13+
}

‎typings/__fixtures__/index.tsx

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
/// <reference path="../index.d.ts" />
2+
3+
import * as React from 'react';
4+
import { css, cx } from 'linaria';
5+
6+
const tomato = 'tomato';
7+
const border = 1;
8+
9+
const absoluteFill = {
10+
position: 'absolute',
11+
top: 0,
12+
left: 0,
13+
bottom: 0,
14+
right: 0,
15+
};
16+
17+
const title = css`
18+
color: ${tomato};
19+
border-width: ${border}px;
20+
21+
&.abs {
22+
${absoluteFill};
23+
}
24+
`;
25+
26+
const heading = css`
27+
font-family: sans-serif;
28+
`;
29+
30+
<h1 className={cx(title, heading, false, 0, null, undefined)}>Hello world</h1>;

‎typings/__fixtures__/react.tsx

Lines changed: 46 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,46 @@
1+
/// <reference path="../index.d.ts" />
2+
3+
import * as React from 'react';
4+
import { styled } from 'linaria/react';
5+
6+
const white = 'white';
7+
const tomato = 'tomato';
8+
const border = 1;
9+
10+
const absoluteFill = {
11+
position: 'absolute',
12+
top: 0,
13+
left: 0,
14+
bottom: 0,
15+
right: 0,
16+
};
17+
18+
const Button = styled.button`
19+
color: ${white};
20+
background-color: ${props => props.background};
21+
border-width: ${border}px;
22+
23+
&.abs {
24+
${absoluteFill};
25+
}
26+
`;
27+
28+
const CustomButton = styled(Button)`
29+
&:hover {
30+
background-color: ${tomato};
31+
}
32+
`;
33+
34+
class Title extends React.Component<{ label: string; className: string }> {
35+
render() {
36+
return <h1 className={this.props.className}>{this.props.label}</h1>;
37+
}
38+
}
39+
40+
const CustomTitle = styled(Title)`
41+
font-family: sans-serif;
42+
`;
43+
44+
<Button as="a">Hello world</Button>;
45+
<CustomButton onClick={() => alert('Clicked')}>Hello world</CustomButton>;
46+
<CustomTitle label="Hello world" />;

‎typings/__fixtures__/server.tsx

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
/// <reference path="../index.d.ts" />
2+
3+
import { collect } from 'linaria/server';
4+
5+
const { critical, other } = collect(
6+
'<div class="foo">Hello</div>',
7+
'.foo { color: blue; }'
8+
);
9+
10+
critical.toLowerCase();
11+
other.toLowerCase();

‎typings/index.d.ts

Lines changed: 49 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,49 @@
1+
declare module 'linaria' {
2+
export const css: (
3+
strings: TemplateStringsArray,
4+
...exprs: Array<string | number | object>
5+
) => string;
6+
7+
export const cx: (
8+
...classNames: Array<string | false | undefined | null | 0>
9+
) => string;
10+
}
11+
12+
declare module 'linaria/react' {
13+
import * as React from 'react';
14+
15+
type Overwrite<T1, T2> = { [P in Exclude<keyof T1, keyof T2>]: T1[P] } & T2;
16+
17+
type InterpolationFunction<T> = (props: T) => string | number;
18+
19+
type StyledComponent<T> = React.ComponentType<
20+
Overwrite<T, { as?: React.ReactType<any>; className?: string }>
21+
>;
22+
23+
type StyledTag<T> = (
24+
strings: TemplateStringsArray,
25+
...exprs: Array<string | number | object | InterpolationFunction<T>>
26+
) => StyledComponent<T>;
27+
28+
type StyledJSXIntrinsics = {
29+
[P in keyof JSX.IntrinsicElements]: StyledTag<
30+
JSX.IntrinsicElements[P] & { [key: string]: any }
31+
>
32+
};
33+
34+
export const styled: StyledJSXIntrinsics & {
35+
<T>(component: React.ReactType<T>): StyledTag<T>;
36+
37+
[tag: string]: StyledTag<{
38+
children?: React.ReactNode;
39+
[key: string]: any;
40+
}>;
41+
};
42+
}
43+
44+
declare module 'linaria/server' {
45+
export const collect: (
46+
html: string,
47+
css: string
48+
) => { critical: string; other: string };
49+
}

‎yarn.lock

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -949,6 +949,32 @@
949949
resolved "https://registry.yarnpkg.com/@sindresorhus/is/-/is-0.7.0.tgz#9a06f4f137ee84d7df0460c1fdb1135ffa6c50fd"
950950
integrity sha512-ONhaKPIufzzrlNbqtWFFd+jlnemX6lJAgq9ZeiZtS7I1PIf/la7CW4m83rTXRnVnsMbW2k56pGYu7AUFJD9Pow==
951951

952+
"@types/node@*":
953+
version "10.12.0"
954+
resolved "https://registry.yarnpkg.com/@types/node/-/node-10.12.0.tgz#ea6dcbddbc5b584c83f06c60e82736d8fbb0c235"
955+
integrity sha512-3TUHC3jsBAB7qVRGxT6lWyYo2v96BMmD2PTcl47H25Lu7UXtFH/2qqmKiVrnel6Ne//0TFYf6uvNX+HW2FRkLQ==
956+
957+
"@types/prop-types@*":
958+
version "15.5.6"
959+
resolved "https://registry.yarnpkg.com/@types/prop-types/-/prop-types-15.5.6.tgz#9c03d3fed70a8d517c191b7734da2879b50ca26c"
960+
integrity sha512-ZBFR7TROLVzCkswA3Fmqq+IIJt62/T7aY/Dmz+QkU7CaW2QFqAitCE8Ups7IzmGhcN1YWMBT4Qcoc07jU9hOJQ==
961+
962+
"@types/react-dom@^16.0.9":
963+
version "16.0.9"
964+
resolved "https://registry.yarnpkg.com/@types/react-dom/-/react-dom-16.0.9.tgz#73ceb7abe6703822eab6600e65c5c52efd07fb91"
965+
integrity sha512-4Z0bW+75zeQgsEg7RaNuS1k9MKhci7oQqZXxrV5KUGIyXZHHAAL3KA4rjhdH8o6foZ5xsRMSqkoM5A3yRVPR5w==
966+
dependencies:
967+
"@types/node" "*"
968+
"@types/react" "*"
969+
970+
"@types/react@*", "@types/react@^16.4.18":
971+
version "16.4.18"
972+
resolved "https://registry.yarnpkg.com/@types/react/-/react-16.4.18.tgz#2e28a2e7f92d3fa7d6a65f2b73275c3e3138a13d"
973+
integrity sha512-eFzJKEg6pdeaukVLVZ8Xb79CTl/ysX+ExmOfAAqcFlCCK5TgFDD9kWR0S18sglQ3EmM8U+80enjUqbfnUyqpdA==
974+
dependencies:
975+
"@types/prop-types" "*"
976+
csstype "^2.2.0"
977+
952978
JSONStream@^1.0.4:
953979
version "1.3.4"
954980
resolved "https://registry.yarnpkg.com/JSONStream/-/JSONStream-1.3.4.tgz#615bb2adb0cd34c8f4c447b5f6512fa1d8f16a2e"
@@ -2676,6 +2702,11 @@ cssstyle@^1.0.0:
26762702
dependencies:
26772703
cssom "0.3.x"
26782704

2705+
csstype@^2.2.0:
2706+
version "2.5.7"
2707+
resolved "https://registry.yarnpkg.com/csstype/-/csstype-2.5.7.tgz#bf9235d5872141eccfb2d16d82993c6b149179ff"
2708+
integrity sha512-Nt5VDyOTIIV4/nRFswoCKps1R5CD1hkiyjBE9/thNaNZILLEviVw9yWQw15+O+CpNjQKB/uvdcxFFOrSflY3Yw==
2709+
26792710
currently-unhandled@^0.4.1:
26802711
version "0.4.1"
26812712
resolved "https://registry.yarnpkg.com/currently-unhandled/-/currently-unhandled-0.4.1.tgz#988df33feab191ef799a61369dd76c17adf957ea"
@@ -7826,6 +7857,11 @@ typedarray@^0.0.6:
78267857
resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777"
78277858
integrity sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=
78287859

7860+
typescript@^3.1.3:
7861+
version "3.1.3"
7862+
resolved "https://registry.yarnpkg.com/typescript/-/typescript-3.1.3.tgz#01b70247a6d3c2467f70c45795ef5ea18ce191d5"
7863+
integrity sha512-+81MUSyX+BaSo+u2RbozuQk/UWx6hfG0a5gHu4ANEM4sU96XbuIyAB+rWBW1u70c6a5QuZfuYICn3s2UjuHUpA==
7864+
78297865
uglify-js@^2.6:
78307866
version "2.8.29"
78317867
resolved "https://registry.yarnpkg.com/uglify-js/-/uglify-js-2.8.29.tgz#29c5733148057bb4e1f75df35b7a9cb72e6a59dd"

0 commit comments

Comments
 (0)