Merge pull request #4 from sure-thing/typescript

typescript

.prettierignore

@@ -1 +1,2 @@
 dist
+*.d.ts

index.d.ts

@@ -0,0 +1,64 @@
+import { Properties as CSSProperties, Pseudos as CSSPsuedos } from 'csstype';
+import { KeyframesAddon } from 'nano-css/addon/keyframes'
+
+type Unitless = string | number;
+type StringKeyValue = { [name: string]: string }
+type UnitlessKeyValue = { [name: string]: Unitless }
+type AnyKeyValue = { [name: string]: any }
+type CSSPropertyNames = keyof CSSProperties
+
+export interface Tokens {
+  color?: StringKeyValue | string[];
+  space?: Unitless[] | UnitlessKeyValue;
+  width?: UnitlessKeyValue | Unitless[];
+  zIndex?: Unitless[] | UnitlessKeyValue;
+  fontSize?: string[] | StringKeyValue;
+  fontFamily?: StringKeyValue;
+  fontWeight?: Unitless[] | UnitlessKeyValue;
+  lineHeight?: Unitless[] | UnitlessKeyValue;
+}
+
+export interface Shorthands {
+  [shorthand: string]: {
+    properties: CSSPropertyNames[];
+    token?: keyof Tokens;
+    unit?: (v: any) => string;
+  }
+}
+
+export interface Macros {
+  [macro: string]: {
+    [prop: string]: Unitless;
+  }
+}
+
+export interface UserTheme {}
+
+export type Theme = {
+  breakpoints?: Unitless[];
+  tokens?: Tokens;
+  shorthands?: Shorthands;
+  macros?: Macros;
+} & UserTheme
+
+export type Options = {}
+
+export type StyleObject = CSSProperties | CSSPsuedos | {
+  [property: string]: StyleObject;
+}
+export type HypostyleProperties = CSSPropertyNames | CSSPsuedos | string;
+export type HypostyleObject = CSSProperties | CSSPsuedos | {
+  [property in HypostyleProperties]: HypostyleObject | string | number | boolean | undefined;
+}
+
+export declare function hypostyle(theme?: Theme, options?: Options): {
+  css(props: Partial<HypostyleObject>): string;
+  injectGlobal(props: Partial<HypostyleObject>): any;
+  keyframes: KeyframesAddon['keyframes'];
+  flush(): string;
+  style(props: Partial<HypostyleObject>): StyleObject;
+  pick(props: Partial<HypostyleObject>): {
+    props: AnyKeyValue;
+    styles: HypostyleObject;
+  };
+}

package.json

@@ -3,6 +3,7 @@
   "version": "0.1.0",
   "description": "",
   "main": "index.js",
+  "types": "index.d.js",
   "files": [
     "index.js",
     "utils",
@@ -46,6 +47,7 @@
     }
   },
   "dependencies": {
+    "csstype": "^3.0.6",
     "nano-css": "^5.3.1"
   }
 }

utils/shorthands.js

@@ -154,7 +154,8 @@ const shorthands = {
   },
   fe: {
     properties: ['fontWeight'],
-    token: 'fontWeight'
+    token: 'fontWeight',
+    unit: str
   },
   ta: {
     properties: ['textAlign']