From 45c8dffc88e4779d6fb242c8d9df09e018185428 Mon Sep 17 00:00:00 2001 From: Melvin Groenhoff Date: Tue, 29 May 2018 15:06:23 +0200 Subject: [PATCH] Add Typescript definitions for 'create-emotion-server' and 'emotion-server' --- packages/create-emotion-server/package.json | 11 +++++--- .../create-emotion-server/types/index.d.ts | 12 +++++++++ .../create-emotion-server/types/tests.tsx | 15 +++++++++++ .../create-emotion-server/types/tsconfig.json | 26 ++++++++++++++++++ .../create-emotion-server/types/tslint.json | 6 +++++ packages/emotion-server/package.json | 11 +++++--- packages/emotion-server/types/index.d.ts | 7 +++++ packages/emotion-server/types/tests.tsx | 11 ++++++++ packages/emotion-server/types/tsconfig.json | 27 +++++++++++++++++++ packages/emotion-server/types/tslint.json | 6 +++++ 10 files changed, 126 insertions(+), 6 deletions(-) create mode 100644 packages/create-emotion-server/types/index.d.ts create mode 100644 packages/create-emotion-server/types/tests.tsx create mode 100644 packages/create-emotion-server/types/tsconfig.json create mode 100644 packages/create-emotion-server/types/tslint.json create mode 100644 packages/emotion-server/types/index.d.ts create mode 100644 packages/emotion-server/types/tests.tsx create mode 100644 packages/emotion-server/types/tsconfig.json create mode 100644 packages/emotion-server/types/tslint.json diff --git a/packages/create-emotion-server/package.json b/packages/create-emotion-server/package.json index ef07fa7b3..4cea6c5a0 100644 --- a/packages/create-emotion-server/package.json +++ b/packages/create-emotion-server/package.json @@ -3,15 +3,18 @@ "version": "9.1.3", "description": "SSR and style extraction tooling for emotion, The Next Generation of CSS-in-JS.", "main": "lib/index.js", + "types": "types/index.d.ts", "files": [ "src", - "lib" + "lib", + "types" ], "scripts": { "build": "npm-run-all clean babel", "babel": "babel src -d lib", - "watch": "babel src -d lib --watch", - "clean": "rimraf lib" + "clean": "rimraf lib", + "test:typescript": "dtslint types", + "watch": "babel src -d lib --watch" }, "dependencies": { "html-tokenize": "^2.0.0", @@ -19,7 +22,9 @@ "through": "^2.3.8" }, "devDependencies": { + "@types/node": "*", "babel-cli": "^6.24.1", + "dtslint": "^0.3.0", "emotion": "^9.1.3", "npm-run-all": "^4.0.2", "react-emotion": "^9.1.3", diff --git a/packages/create-emotion-server/types/index.d.ts b/packages/create-emotion-server/types/index.d.ts new file mode 100644 index 000000000..6c64b78cc --- /dev/null +++ b/packages/create-emotion-server/types/index.d.ts @@ -0,0 +1,12 @@ +/// +// TypeScript Version: 2.3 + +import { Emotion } from 'create-emotion'; + +export interface EmotionServer { + extractCritical(html: string): { html: string; ids: string[]; css: string; }; + renderStylesToString(html: string): string; + renderStylesToNodeStream(): NodeJS.ReadWriteStream; +} + +export default function createEmotionServer(emotion: Emotion): EmotionServer; diff --git a/packages/create-emotion-server/types/tests.tsx b/packages/create-emotion-server/types/tests.tsx new file mode 100644 index 000000000..e80fceb91 --- /dev/null +++ b/packages/create-emotion-server/types/tests.tsx @@ -0,0 +1,15 @@ +import { Emotion } from 'create-emotion'; + +import createEmotionServer from '../'; + +declare const emotion: Emotion; + +const emotionServer = createEmotionServer(emotion); + +const { html, css, ids } = emotionServer.extractCritical("
"); + +emotionServer.renderStylesToString("
"); + +declare const stream: NodeJS.ReadableStream; + +stream.pipe(emotionServer.renderStylesToNodeStream()); diff --git a/packages/create-emotion-server/types/tsconfig.json b/packages/create-emotion-server/types/tsconfig.json new file mode 100644 index 000000000..838017f13 --- /dev/null +++ b/packages/create-emotion-server/types/tsconfig.json @@ -0,0 +1,26 @@ +{ + "compilerOptions": { + "baseUrl": "../", + "forceConsistentCasingInFileNames": true, + "jsx": "react", + "lib": [ + "es6" + ], + "module": "commonjs", + "noEmit": true, + "noImplicitAny": true, + "noImplicitThis": true, + "strict": true, + "strictNullChecks": true, + "strictFunctionTypes": true, + "target": "es5", + "typeRoots": [ + "../" + ], + "types": [] + }, + "include": [ + "./*.ts", + "./*.tsx" + ] +} diff --git a/packages/create-emotion-server/types/tslint.json b/packages/create-emotion-server/types/tslint.json new file mode 100644 index 000000000..b48934d7b --- /dev/null +++ b/packages/create-emotion-server/types/tslint.json @@ -0,0 +1,6 @@ +{ + "extends": "dtslint/dtslint.json", + "rules": { + "no-relative-import-in-test": false + } +} diff --git a/packages/emotion-server/package.json b/packages/emotion-server/package.json index 9d94f0228..1bdd3e364 100644 --- a/packages/emotion-server/package.json +++ b/packages/emotion-server/package.json @@ -3,15 +3,18 @@ "version": "9.1.3", "description": "Extract and inline critical css with emotion for server side rendering.", "main": "lib/index.js", + "types": "types/index.d.ts", "files": [ "src", - "lib" + "lib", + "types" ], "scripts": { "build": "npm-run-all clean babel", "babel": "babel src -d lib", - "watch": "babel src -d lib --watch", - "clean": "rimraf lib" + "clean": "rimraf lib", + "test:typescript": "dtslint types", + "watch": "babel src -d lib --watch" }, "dependencies": { "create-emotion-server": "^9.1.3" @@ -20,8 +23,10 @@ "emotion": "^9.1.3" }, "devDependencies": { + "@types/react-dom": "16.0.5", "babel-cli": "^6.24.1", "babel-plugin-emotion": "^9.1.2", + "dtslint": "^0.3.0", "emotion": "^9.1.3", "npm-run-all": "^4.0.2", "react-emotion": "^9.1.3", diff --git a/packages/emotion-server/types/index.d.ts b/packages/emotion-server/types/index.d.ts new file mode 100644 index 000000000..fe56aa3af --- /dev/null +++ b/packages/emotion-server/types/index.d.ts @@ -0,0 +1,7 @@ +// TypeScript Version: 2.3 + +import { EmotionServer } from 'create-emotion-server'; + +export const renderStylesToString: EmotionServer["renderStylesToString"]; +export const renderStylesToNodeStream: EmotionServer["renderStylesToNodeStream"]; +export const extractCritical: EmotionServer["extractCritical"]; diff --git a/packages/emotion-server/types/tests.tsx b/packages/emotion-server/types/tests.tsx new file mode 100644 index 000000000..290345c64 --- /dev/null +++ b/packages/emotion-server/types/tests.tsx @@ -0,0 +1,11 @@ +import React from 'react'; +import { renderToNodeStream, renderToString } from 'react-dom/server'; +import { extractCritical, renderStylesToNodeStream, renderStylesToString } from '../'; + +declare const element: React.ReactElement; + +const { html, css, ids } = extractCritical(renderToString(element)); + +renderStylesToString(renderToString(element)); + +renderToNodeStream(element).pipe(renderStylesToNodeStream()); diff --git a/packages/emotion-server/types/tsconfig.json b/packages/emotion-server/types/tsconfig.json new file mode 100644 index 000000000..e5314a3a6 --- /dev/null +++ b/packages/emotion-server/types/tsconfig.json @@ -0,0 +1,27 @@ +{ + "compilerOptions": { + "allowSyntheticDefaultImports": true, + "baseUrl": "../", + "forceConsistentCasingInFileNames": true, + "jsx": "react", + "lib": [ + "es6" + ], + "module": "commonjs", + "noEmit": true, + "noImplicitAny": true, + "noImplicitThis": true, + "strict": true, + "strictNullChecks": true, + "strictFunctionTypes": true, + "target": "es5", + "typeRoots": [ + "../" + ], + "types": [] + }, + "include": [ + "./*.ts", + "./*.tsx" + ] +} diff --git a/packages/emotion-server/types/tslint.json b/packages/emotion-server/types/tslint.json new file mode 100644 index 000000000..bf4329881 --- /dev/null +++ b/packages/emotion-server/types/tslint.json @@ -0,0 +1,6 @@ +{ + "extends": "dtslint/dtslint.json", + "rules": { + "no-relative-import-in-test": false + } +} \ No newline at end of file