Add styletron-standard types (#35324)

* add styletron-standard types

* fix StyleObject type to accept nested StyleObject type

* use csstype package

types/styletron-standard/index.d.ts

@@ -0,0 +1,39 @@
+// Type definitions for styletron-standard 2.0
+// Project: https://github.com/styletron/styletron
+// Definitions by: Eric Taylor <https://github.com/erictaylor>
+// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
+// TypeScript Version: 2.9
+
+import * as CSS from 'csstype';
+
+export type Properties = CSS.Properties<string | number>;
+export type FontFace = CSS.FontFace;
+export interface KeyframesPercentageObject {
+    [key: string]: Properties;
+}
+
+export type KeyframesObject = KeyframesPercentageObject & {
+    from?: Properties;
+    to?: Properties;
+};
+
+// Unrecognized properties are assumed to be media queries
+// or pseudo selectors w/ nested style objects.
+// See: https://github.com/styletron/styletron-standard
+export type StyleObject = Properties &
+    { [key in string]: Properties[keyof Properties] | StyleObject };
+
+export interface StandardEngine {
+    renderStyle(style: StyleObject): string;
+    renderKeyframes(keyframes: KeyframesObject): string;
+    renderFontFace(fontFace: FontFace): string;
+}
+
+export function driver(style: StyleObject, styletron: StandardEngine): string;
+
+export function getInitialStyle(): StyleObject;
+
+export function renderDeclarativeRules(
+    style: StyleObject,
+    styletrong: StandardEngine
+): StyleObject;

types/styletron-standard/package.json

@@ -0,0 +1,6 @@
+{
+    "private": true,
+    "dependencies": {
+        "csstype": "^2.6.4"
+    }
+}

types/styletron-standard/styletron-standard-tests.ts

@@ -0,0 +1,34 @@
+import {
+    driver,
+    getInitialStyle,
+    renderDeclarativeRules,
+    StyleObject,
+    StandardEngine,
+    KeyframesObject,
+    FontFace,
+} from 'styletron-standard';
+
+const validStyleObject: StyleObject = {
+    display: 'block',
+    ':after': {
+        content: '" "',
+    },
+};
+
+const renderStyle = (style: StyleObject) => 'style';
+const renderKeyframes = (keyframes: KeyframesObject) => 'keyframes';
+const renderFontFace = (fontFace: FontFace) => 'font-face';
+
+const engine: StandardEngine = {
+    renderStyle,
+    renderKeyframes,
+    renderFontFace,
+};
+
+// driver tests
+driver(validStyleObject, engine); // $ExpectType string
+driver(getInitialStyle(), engine); // $ExpectType string
+
+// renderDeclarativeRules tests
+renderDeclarativeRules(getInitialStyle(), engine); // $ExpectType StyleObject
+renderDeclarativeRules(validStyleObject, engine); // $ExpectType StyleObject

types/styletron-standard/tsconfig.json

@@ -0,0 +1,16 @@
+{
+    "compilerOptions": {
+        "module": "commonjs",
+        "lib": ["es6"],
+        "noImplicitAny": true,
+        "noImplicitThis": true,
+        "strictNullChecks": true,
+        "strictFunctionTypes": true,
+        "baseUrl": "../",
+        "typeRoots": ["../"],
+        "types": [],
+        "noEmit": true,
+        "forceConsistentCasingInFileNames": true
+    },
+    "files": ["index.d.ts", "styletron-standard-tests.ts"]
+}

types/styletron-standard/tslint.json

@@ -0,0 +1 @@
+{ "extends": "dtslint/dt.json" }