Merge branch 'master' of https://github.com/stardust-ui/react into chore/enable-hmr

Author: layershifter

babel.config.js

@@ -1,3 +1,3 @@
 module.exports = {
-  babelrcRoots: ['./packages/*'],
+  babelrcRoots: ['./docs/*', './packages/*', './perf/*'],
 }

build/gulp/tasks/test-projects.tsx

@@ -45,6 +45,9 @@ const packStardustPackages = async (logger: Function): Promise<PackedPackages> =
   // as lernaAliases append 'src' by default
   const stardustPackages = lernaAliases({ sourceDirectory: false })
 
+  // We don't want to pack a package with our dev tools
+  delete stardustPackages['@stardust-ui/internal-tooling']
+
   await Promise.all(
     Object.keys(stardustPackages).map(async (packageName: string) => {
       const filename = tmp.tmpNameSync({ prefix: `stardust-`, postfix: '.tgz' })

build/tsconfig.common.json

@@ -14,6 +14,7 @@
     "typeRoots": ["../types", "../node_modules/@types"],
     "jsx": "react",
     "importHelpers": true,
+    "isolatedModules": true,
     "moduleResolution": "node",
     "sourceMap": true,
     "allowJs": false,

build/tsconfig.commonjs.json

@@ -1,6 +1,7 @@
 {
   "extends": "./tsconfig.common.json",
   "compilerOptions": {
+    "isolatedModules": false,
     "module": "commonjs"
   },
   "include": ["../packages/react/src", "../types"]

build/tsconfig.es.json

@@ -1,6 +1,7 @@
 {
   "extends": "./tsconfig.common.json",
   "compilerOptions": {
+    "isolatedModules": false,
     "module": "esnext"
   }
 }

build/webpack.config.perf.ts

@@ -1,4 +1,5 @@
 import * as CopyWebpackPlugin from 'copy-webpack-plugin'
+import * as ForkTsCheckerWebpackPlugin from 'fork-ts-checker-webpack-plugin'
 import { webpack as lernaAliases } from 'lerna-alias'
 import { argv } from 'yargs'
 
@@ -32,16 +33,16 @@ const webpackConfig: any = {
     rules: [
       {
         test: /\.(js|ts|tsx)$/,
-        loader: 'awesome-typescript-loader',
+        loader: 'babel-loader',
         exclude: /node_modules/,
         options: {
-          configFileName: paths.base('build/tsconfig.perf.json'),
-          useCache: true,
+          cacheDirectory: true,
         },
       },
     ],
   },
   plugins: [
+    new ForkTsCheckerWebpackPlugin({ tsconfig: paths.base('build/tsconfig.perf.json') }),
     new CopyWebpackPlugin([
       {
         from: paths.perfSrc('index.html'),

build/webpack.config.stats.ts

@@ -43,15 +43,10 @@ const makeConfig = (srcPath, name) => ({
     rules: [
       {
         test: /\.(js|ts|tsx)$/,
-        loader: 'ts-loader',
-        include: /src/,
+        loader: 'babel-loader',
+        exclude: /node_modules/,
         options: {
-          configFile: paths.base('build/tsconfig.es.json'),
-          transpileOnly: true,
-          onlyCompileBundledFiles: true,
-          compilerOptions: {
-            declaration: false,
-          },
+          cacheDirectory: true,
         },
       },
     ],

docs/.babelrc

@@ -0,0 +1,3 @@
+{
+  "extends": "@stardust-ui/internal-tooling/babel"
+}

docs/src/components/ComponentDoc/ComponentExample/index.tsx

@@ -1 +1,2 @@
-export { default, ComponentExampleProps } from './ComponentExample'
+export * from './ComponentExample'
+export { default } from './ComponentExample'

docs/src/components/ComponentDoc/ComponentSourceManager/index.ts

@@ -1,6 +1,4 @@
 export * from './componentAPIs'
-export {
-  default,
-  ComponentSourceManagerLanguage,
-  ComponentSourceManagerRenderProps,
-} from './ComponentSourceManager'
+
+export { default } from './ComponentSourceManager'
+export * from './ComponentSourceManager'

docs/src/components/Editor/index.tsx

@@ -1 +1,2 @@
-export { default, EditorProps, EDITOR_BACKGROUND_COLOR, EDITOR_GUTTER_COLOR } from './Editor'
+export { default } from './Editor'
+export * from './Editor'

package.json

@@ -64,7 +64,7 @@
     "@types/react-dom": "^16.8.3",
     "@types/react-is": "^16.7.1",
     "@types/react-router": "^4.0.27",
-    "awesome-typescript-loader": "^5.2.1",
+    "babel-loader": "^8.0.6",
     "circular-dependency-plugin": "^5.0.2",
     "clean-webpack-plugin": "^0.1.19",
     "color": "^3.1.0",
@@ -80,6 +80,7 @@
     "express": "^4.15.4",
     "extract-comments": "^1.0.0",
     "faker": "^4.1.0",
+    "fork-ts-checker-webpack-plugin": "^1.3.3",
     "gh-pages": "^1.0.0",
     "glob": "^7.1.2",
     "gulp": "^4.0.0",
@@ -126,7 +127,6 @@
     "syncpack": "^4.3.1",
     "through2": "^2.0.3",
     "tmp": "^0.0.33",
-    "ts-loader": "^5.3.0",
     "ts-node": "^6.1.0",
     "tsconfig-paths": "^3.7.0",
     "tslint": "^5.11.0",

packages/docs-components/.babelrc

@@ -0,0 +1,3 @@
+{
+  "extends": "@stardust-ui/internal-tooling/babel"
+}

packages/internal-tooling/babel/index.js

@@ -1,25 +1,16 @@
 module.exports = {
   presets: [
-    [
-      '@babel/preset-env',
-      {
-        useBuiltIns: 'entry',
-      },
-    ],
+    ['@babel/preset-env', { modules: false }],
     '@babel/preset-react',
     '@babel/preset-typescript',
   ],
-  plugins: ['@babel/plugin-proposal-class-properties'],
+  plugins: ['@babel/plugin-proposal-class-properties', '@babel/plugin-transform-runtime'],
   env: {
+    delelopment: {
+      plugins: ['react-hot-loader/babel'],
+    },
     test: {
-      plugins: [
-        [
-          '@babel/plugin-transform-runtime',
-          {
-            regenerator: true,
-          },
-        ],
-      ],
+      presets: [['@babel/preset-env', { modules: 'commonjs' }]],
     },
   },
 }

packages/react-component-event-listener/src/EventListener.ts

@@ -3,7 +3,8 @@ import * as React from 'react'
 import addEventListener from './lib/addEventListener'
 import removeEventListener from './lib/removeEventListener'
 import shouldUpdateListener from './lib/shouldUpdateListener'
-import { EventListenerProps, listenerPropTypes } from './types'
+import { EventListenerProps } from './types'
+import { listenerPropTypes } from './types.internal'
 
 class EventListener extends React.Component<EventListenerProps> {
   static displayName = 'EventListener'

packages/react-component-event-listener/src/StackableEventListener.ts

@@ -4,7 +4,8 @@ import addEventListener from './lib/addEventListener'
 import removeEventListener from './lib/removeEventListener'
 import * as listenerRegistries from './lib/listenerRegistries'
 import shouldUpdateListener from './lib/shouldUpdateListener'
-import { EventListenerProps, listenerPropTypes } from './types'
+import { EventListenerProps } from './types'
+import { listenerPropTypes } from './types.internal'
 
 class StackableEventListener extends React.Component<EventListenerProps> {
   static displayName = 'StackableEventListener'

packages/react-component-event-listener/src/index.ts

@@ -9,4 +9,4 @@ export const windowRef: TargetRef = {
 
 export { default as EventListener } from './EventListener'
 export { default as StackableEventListener } from './StackableEventListener'
-export { EventHandler, EventListenerProps, EventTypes, TargetRef } from './types'
+export * from './types'

packages/react-component-event-listener/src/lib/addEventListener.ts

@@ -1,4 +1,5 @@
-import { EventHandler, EventTypes, ListenerActionOptions } from '../types'
+import { EventHandler, EventTypes } from '../types'
+import { ListenerActionOptions } from '../types.internal'
 
 const addEventListener = (listener: EventHandler<EventTypes>, options: ListenerActionOptions) => {
   const { targetRef, type, capture } = options

packages/react-component-event-listener/src/lib/removeEventListener.ts

@@ -1,4 +1,5 @@
-import { EventHandler, EventTypes, ListenerActionOptions } from '../types'
+import { EventHandler, EventTypes } from '../types'
+import { ListenerActionOptions } from '../types.internal'
 
 const removeEventListener = (
   listener: EventHandler<EventTypes>,

packages/react-component-event-listener/src/types.internal.ts

@@ -0,0 +1,17 @@
+import * as PropTypes from 'prop-types'
+import { EventListenerProps, EventTypes, TargetRef } from './types'
+
+export type ListenerActionOptions = {
+  capture: boolean
+  targetRef: TargetRef
+  type: EventTypes
+}
+
+export const listenerPropTypes = {
+  capture: PropTypes.bool,
+  listener: PropTypes.func.isRequired,
+  targetRef: PropTypes.shape({
+    current: PropTypes.object,
+  }).isRequired,
+  type: PropTypes.string.isRequired,
+} as Record<keyof EventListenerProps, any>

packages/react-component-event-listener/src/types.ts

@@ -1,4 +1,3 @@
-import * as PropTypes from 'prop-types'
 import * as React from 'react'
 
 export interface EventListenerProps {
@@ -18,18 +17,4 @@ export interface EventListenerProps {
 export type EventHandler<T extends EventTypes> = (e: DocumentEventMap[T]) => void
 export type EventTypes = keyof DocumentEventMap
 
-export type ListenerActionOptions = {
-  capture: boolean
-  targetRef: TargetRef
-  type: EventTypes
-}
 export type TargetRef = React.RefObject<Node | Window>
-
-export const listenerPropTypes = {
-  capture: PropTypes.bool,
-  listener: PropTypes.func.isRequired,
-  targetRef: PropTypes.shape({
-    current: PropTypes.object,
-  }).isRequired,
-  type: PropTypes.string.isRequired,
-} as Record<keyof EventListenerProps, any>

packages/react-component-nesting-registry/src/index.ts

@@ -1,2 +1,2 @@
 export { default as Unstable_NestingAuto } from './NestingAuto'
-export { GetRefs, NodeRef } from './types'
+export * from './types'

packages/react-component-ref/src/index.ts

@@ -2,6 +2,7 @@ export { default as handleRef } from './handleRef'
 export { default as isRefObject } from './isRefObject'
 export { default as toRefObject } from './toRefObject'
 
-export { default as Ref, RefProps } from './Ref'
+export * from './Ref'
+export { default as Ref } from './Ref'
 export { default as RefFindNode } from './RefFindNode'
 export { default as RefForward } from './RefForward'

packages/react/src/components/Popup/positioningHelper.ts

@@ -1,6 +1,19 @@
-export { Placement } from 'popper.js'
-import { Placement } from 'popper.js'
-
+export type Placement =
+  | 'auto-start'
+  | 'auto'
+  | 'auto-end'
+  | 'top-start'
+  | 'top'
+  | 'top-end'
+  | 'right-start'
+  | 'right'
+  | 'right-end'
+  | 'bottom-end'
+  | 'bottom'
+  | 'bottom-start'
+  | 'left-end'
+  | 'left'
+  | 'left-start'
 export type Position = 'above' | 'below' | 'before' | 'after'
 export type Alignment = 'top' | 'bottom' | 'start' | 'end' | 'center'