auto generate interface

Author: stefanexivity

.storybook/config.js

@@ -8,7 +8,6 @@ import WebfontLoader from '@dr-kobros/react-webfont-loader'
 import theme from '../src/theme'
 import { fontConfig } from '../src/fontConfig'
 
-
 const styles = {
   display: 'flex',
   height: '100%',

package.json

@@ -6,6 +6,7 @@
     "@dr-kobros/react-webfont-loader": "^8.0.0",
     "@storybook/cli": "^5.0.0-rc.3",
     "fontfaceobserver": "^2.1.0",
+    "fs": "^0.0.1-security",
     "react": "^16.8.2",
     "react-dom": "^16.8.2",
     "react-icons": "^3.4.0",
@@ -18,7 +19,7 @@
     "build": "react-scripts build",
     "test": "react-scripts test",
     "eject": "react-scripts eject",
-    "storybook": "start-storybook -p 9009 -s public",
+    "storybook": "node pre-storybook.js && start-storybook -p 9009 -s public",
     "build-storybook": "build-storybook -s public"
   },
   "eslintConfig": {
@@ -39,6 +40,7 @@
     "@types/enzyme": "^3.1.18",
     "@types/enzyme-adapter-react-16": "^1.0.4",
     "@types/jest": "^24.0.6",
+    "@types/node": "^11.9.5",
     "@types/react-icons": "^3.0.0",
     "@types/react-test-renderer": "^16.8.1",
     "@types/storybook__addon-actions": "^3.4.2",

pre-storybook.js

@@ -0,0 +1,6 @@
+const fs = require('fs')
+
+const theme = fs.readFileSync('src/theme.json', { encoding: 'utf8' })
+fs.writeFileSync('src/ITheme.ts', `/*This is a generated file. Do not edit pls.*/\nexport default interface ITheme ${theme}`)
+
+

src/ITheme.ts

@@ -0,0 +1,10 @@
+/*This is a generated file. Do not edit pls.*/
+export default interface ITheme {
+  "global": {
+    "margin": "20px !default",
+    "fontFamily": "Fira Mono Latin Regular"
+  },
+  "colors": {
+    "gray": "#aaa"
+  }
+}

src/theme.json

@@ -0,0 +1,9 @@
+{
+  "global": {
+    "margin": "20px !default",
+    "fontFamily": "Fira Mono Latin Regular"
+  },
+  "colors": {
+    "gray": "#aaa"
+  }
+}

src/theme.ts

@@ -1,14 +1,9 @@
-const theme = {
-  global: {
-    margin: '20px !default',
-    fontFamily: 'Fira Mono Latin Regular'
-  },
-  colors: {
-    gray: '#aaa'
-  }
-}
+import fs from 'fs'
+import ITheme from './ITheme'
+import { DeepReadonly } from './utils/types'
 
-type Readonly<T> = { readonly [P in keyof T]-?: T[P] };
-export type Theme = Readonly<typeof theme>
+export type Theme = DeepReadonly<ITheme>
 
-export default theme as Theme
+const theme: Theme = JSON.parse(fs.readFileSync('./theme.json', { encoding: 'utf8' }))
+
+export default theme

src/utils/types.ts

@@ -0,0 +1,5 @@
+export type primitive = string | number | boolean | undefined | null
+export type DeepReadonly<T> = T extends primitive ? T : DeepReadonlyObject<T>
+export type DeepReadonlyObject<T> = {
+  readonly [P in keyof T]: DeepReadonly<T[P]>
+}

tsconfig.json

@@ -20,6 +20,6 @@
     "isolatedModules": true
   },
   "include": [
-    "src"
+    "src", ".storybook/generateThemeInterface.js"
   ]
 }

yarn.lock

@@ -951,14 +951,6 @@
   resolved "https://registry.yarnpkg.com/@emotion/weak-memoize/-/weak-memoize-0.2.2.tgz#63985d3d8b02530e0869962f4da09142ee8e200e"
   integrity sha512-n/VQ4mbfr81aqkx/XmVicOLjviMuy02eenSdJY33SVA7S2J42EU0P1H0mOogfYedb3wXA0d/LVtBrgTSm04WEA==
 
-"@material-ui/icons@^3.0.2":
-  version "3.0.2"
-  resolved "https://registry.yarnpkg.com/@material-ui/icons/-/icons-3.0.2.tgz#d67a6dd1ec8312d3a88ec97944a63daeef24fe10"
-  integrity sha512-QY/3gJnObZQ3O/e6WjH+0ah2M3MOgLOzCy8HTUoUx9B6dDrS18vP7Ycw3qrDEKlB6q1KNxy6CZHm5FCauWGy2g==
-  dependencies:
-    "@babel/runtime" "^7.2.0"
-    recompose "0.28.0 - 0.30.0"
-
 "@mrmlnc/readdir-enhanced@^2.2.1":
   version "2.2.1"
   resolved "https://registry.yarnpkg.com/@mrmlnc/readdir-enhanced/-/readdir-enhanced-2.2.1.tgz#524af240d1a360527b730475ecfa1344aa540dde"
@@ -1453,6 +1445,11 @@
   resolved "https://registry.yarnpkg.com/@types/node/-/node-10.12.26.tgz#2dec19f1f7981c95cb54bab8f618ecb5dc983d0e"
   integrity sha512-nMRqS+mL1TOnIJrL6LKJcNZPB8V3eTfRo9FQA2b5gDvrHurC8XbSA86KNe0dShlEL7ReWJv/OU9NL7Z0dnqWTg==
 
+"@types/node@^11.9.5":
+  version "11.9.5"
+  resolved "https://registry.yarnpkg.com/@types/node/-/node-11.9.5.tgz#011eece9d3f839a806b63973e228f85967b79ed3"
+  integrity sha512-vVjM0SVzgaOUpflq4GYBvCpozes8OgIIS5gVXVka+OfK3hvnkC1i93U8WiY2OtNE4XUWyyy/86Kf6e0IHTQw1Q==
+
 "@types/prop-types@*":
   version "15.5.9"
   resolved "https://registry.yarnpkg.com/@types/prop-types/-/prop-types-15.5.9.tgz#f2d14df87b0739041bc53a7d75e3d77d726a3ec0"
@@ -5973,6 +5970,11 @@ fs.realpath@^1.0.0:
   resolved "https://registry.yarnpkg.com/fs.realpath/-/fs.realpath-1.0.0.tgz#1504ad2523158caa40db4a2787cb01411994ea4f"
   integrity sha1-FQStJSMVjKpA20onh8sBQRmU6k8=
 
+fs@^0.0.1-security:
+  version "0.0.1-security"
+  resolved "https://registry.yarnpkg.com/fs/-/fs-0.0.1-security.tgz#8a7bd37186b6dddf3813f23858b57ecaaf5e41d4"
+  integrity sha1-invTcYa23d84E/I4WLV+yq9eQdQ=
+
 [email protected]:
   version "1.2.4"
   resolved "https://registry.yarnpkg.com/fsevents/-/fsevents-1.2.4.tgz#f41dcb1af2582af3692da36fc55cbd8e1041c426"
@@ -10938,24 +10940,24 @@ rechoir@^0.6.2:
   dependencies:
     resolve "^1.1.6"
 
-"recompose@0.28.0 - 0.30.0", recompose@^0.30.0:
-  version "0.30.0"
-  resolved "https://registry.yarnpkg.com/recompose/-/recompose-0.30.0.tgz#82773641b3927e8c7d24a0d87d65aeeba18aabd0"
-  integrity sha512-ZTrzzUDa9AqUIhRk4KmVFihH0rapdCSMFXjhHbNrjAWxBuUD/guYlyysMnuHjlZC/KRiOKRtB4jf96yYSkKE8w==
+recompose@^0.27.1:
+  version "0.27.1"
+  resolved "https://registry.yarnpkg.com/recompose/-/recompose-0.27.1.tgz#1a49e931f183634516633bbb4f4edbfd3f38a7ba"
+  integrity sha512-p7xsyi/rfNjHfdP7vPU02uSFa+Q1eHhjKrvO+3+kRP4Ortj+MxEmpmd+UQtBGM2D2iNAjzNI5rCyBKp9Ob5McA==
   dependencies:
-    "@babel/runtime" "^7.0.0"
+    babel-runtime "^6.26.0"
     change-emitter "^0.1.2"
     fbjs "^0.8.1"
     hoist-non-react-statics "^2.3.1"
     react-lifecycles-compat "^3.0.2"
     symbol-observable "^1.0.4"
 
-recompose@^0.27.1:
-  version "0.27.1"
-  resolved "https://registry.yarnpkg.com/recompose/-/recompose-0.27.1.tgz#1a49e931f183634516633bbb4f4edbfd3f38a7ba"
-  integrity sha512-p7xsyi/rfNjHfdP7vPU02uSFa+Q1eHhjKrvO+3+kRP4Ortj+MxEmpmd+UQtBGM2D2iNAjzNI5rCyBKp9Ob5McA==
+recompose@^0.30.0:
+  version "0.30.0"
+  resolved "https://registry.yarnpkg.com/recompose/-/recompose-0.30.0.tgz#82773641b3927e8c7d24a0d87d65aeeba18aabd0"
+  integrity sha512-ZTrzzUDa9AqUIhRk4KmVFihH0rapdCSMFXjhHbNrjAWxBuUD/guYlyysMnuHjlZC/KRiOKRtB4jf96yYSkKE8w==
   dependencies:
-    babel-runtime "^6.26.0"
+    "@babel/runtime" "^7.0.0"
     change-emitter "^0.1.2"
     fbjs "^0.8.1"
     hoist-non-react-statics "^2.3.1"