chore: export flow types

.npmignore

@@ -2,11 +2,10 @@
 coverage
 dist
 e2e
-flow-typed
 node_modules
 rfcs
 scripts
-src
+flow-typed
 
 commitlint.config.js
 docker-compose.yml
@@ -15,3 +14,13 @@ jest-e2e.config.js
 jest.config.js
 rollup.config_e2e.js
 rollup.config.js
+
+# The parts below are due to flow type
+*.test.js
+*.setup.js
+*.stories.js
+stories.js
+*.test.js.snap
+test
+__mocks__
+e2e.js

package.json

@@ -18,12 +18,13 @@
   },
   "scripts": {
     "lint": "eslint ./",
+    "flow": "flow --show-all-errors",
     "commitmsg": "commitlint -e $GIT_PARAMS",
     "test": "yarn lint && yarn unit-test",
     "storybook": "start-storybook -p 6006",
     "build-storybook": "build-storybook -o docs",
     "precommit": "pretty-quick --staged && yarn run test",
-    "build": "rollup -c rollup.config.js",
+    "build": "rm -rf dist && rollup -c rollup.config.js",
     "unit-test": "yarn jest --coverage",
     "e2e": "node ./e2e/e2e.js",
     "build-e2e": "rollup -c rollup.config_e2e.js",

rollup.config.js

@@ -9,6 +9,8 @@ import commonjs from 'rollup-plugin-commonjs';
 import fs from 'fs';
 import path from 'path';
 
+import uberFlowEntry from './scripts/rollup-plugin-flow-entry';
+
 function getComponents() {
   return fs.readdirSync('./src/components').filter(filename => {
     const {ext, name} = path.parse(filename);
@@ -70,6 +72,7 @@ function getSharedConfig({filePath, name}) {
           'node_modules/create-react-context/index.js': ['createReactContext'],
         },
       }),
+      uberFlowEntry(),
     ],
   };
 }

scripts/rollup-plugin-flow-entry.js

@@ -0,0 +1,73 @@
+/* eslint-disable flowtype/require-valid-file-annotation */
+import fs from 'fs';
+import path from 'path';
+
+/*
+We can consider this as well:
+https://github.com/RichieAHB/rollup-plugin-flow-defs/blob/master/src/index.js
+
+This code is inspired by that npm package anyway.
+ */
+
+function getFlowFileContent(filePath) {
+  /*
+  Since we're going to copy `dist` dictionary into root in our publish step,
+  we will need to remove one level of the path.
+  Hence, instead of `../src` and `../../src`, they will become `./src` and `../src` respectively.
+  */
+  const regex = new RegExp(/\.\.\//, 'g');
+  const matched = filePath.match(regex);
+  if (matched.length > 0) {
+    // Check whether it's only one `..`
+    if (matched.length === 1) {
+      // Only 1, replace it with `./`
+      filePath = filePath.replace('../', './');
+    } else {
+      // Must be more than 1
+      filePath = filePath.replace('../', '');
+    }
+  }
+  return `// @flow
+// $FlowFixMe path is assuming that it's already in root directory
+export * from '${filePath}';`;
+}
+
+export default function uberFlowEntry() {
+  let input;
+  return {
+    name: '@uber/rollup-plugin-flow-entry',
+    options(opts) {
+      input = opts.input;
+    },
+    async generateBundle(opts) {
+      const {file = ''} = opts || {};
+
+      // Create file path if does not exist
+      await new Promise(resolve => {
+        const dirname = path.dirname(file);
+        if (!fs.existsSync(dirname)) {
+          fs.mkdirSync(dirname);
+        }
+        resolve('ok');
+      });
+
+      await new Promise((resolve, reject) => {
+        /*
+        path.dirname(input); // src/components/popover
+        path.basename(input); // index.js
+        path.dirname(file); // this is output, `dist/popover`
+         */
+        const relativePath = path.join(
+          path.relative(path.dirname(file), path.dirname(input)),
+          path.basename(input),
+        );
+        fs.writeFile(`${file}.flow`, getFlowFileContent(relativePath), err => {
+          if (err) {
+            reject(err);
+          }
+          resolve('ok');
+        });
+      });
+    },
+  };
+}

src/components/checkbox/index.js

@@ -10,3 +10,6 @@ export {
   Label as StyledLabel,
   Input as StyledInput,
 } from './styled-components';
+
+// Flow
+export * from './types';

src/components/input/index.js

@@ -13,3 +13,6 @@ export {
   Caption as StyledCaption,
 } from './styled-components';
 export {STATE_CHANGE_TYPE, ADJOINED, SIZE} from './constants';
+
+// Flow
+export * from './types';

src/components/popover/index.js

@@ -16,3 +16,6 @@ export {
   Inner as StyledInner,
   Padding as StyledPadding,
 } from './styled-components';
+
+// Flow
+export * from './types';

src/components/tooltip/index.js

@@ -15,3 +15,6 @@ export {
   Body as StyledBody,
   Inner as StyledInner,
 } from './styled-components';
+
+// Flow
+export * from './types';

src/helpers/overrides.js

@@ -1,4 +1,5 @@
 // @flow
+import * as React from 'react';
 
 export type OverrideT<T> =
   | {