Updates build, improves types, changes onChange behavior

Author: jaredLunde

.babelrc

@@ -20,11 +20,16 @@
     "@typescript-eslint/camelcase": "off",
     "@typescript-eslint/explicit-function-return-type": "off",
     "@typescript-eslint/no-use-before-define": "off",
+    "@typescript-eslint/no-empty-function": "off",
+    "@typescript-eslint/explicit-module-boundary-types": "off",
+    "@typescript-eslint/ban-ts-comment": "off",
     "no-console": "off",
     "no-prototype-builtins": "off",
     "react/no-children-prop": "off",
     "react/display-name": "off",
-    "react/prop-types": "off"
+    "react/prop-types": "off",
+    "react-hooks/rules-of-hooks": "error",
+    "react-hooks/exhaustive-deps": "warn"
   },
   "settings": {
     "react": {

.eslintrc

@@ -1,3 +1,4 @@
 node_modules
 dist
-coverage
+coverage
+*.log

.gitignore

@@ -6,7 +6,7 @@ cache:
     - node_modules
 notifications:
   email: false
-node_js: '10'
+node_js: '12'
 install: yarn install
 script: yarn validate
 after_script: npx codecov@3

.travis.yml

@@ -0,0 +1,27 @@
+module.exports = (api) => {
+  const module = api.env('module')
+  const esm = api.env('esm')
+  const presetEnv = [
+    '@lunde/es',
+    {
+      env: {
+        modules: esm || module ? false : 'commonjs',
+        targets: module
+          ? {
+              browsers: 'cover 80% in US',
+            }
+          : {
+              node: esm ? '12' : '10',
+            },
+      },
+      restSpread: false,
+      devExpression: false,
+      objectAssign: false,
+    },
+  ]
+
+  return {
+    presets: [['@babel/preset-react', {useSpread: true}], presetEnv],
+    plugins: ['optimize-react', 'annotate-pure-calls'],
+  }
+}

babel.config.js

@@ -1,6 +1,6 @@
 {
   "name": "@accessible/checkbox",
-  "version": "2.0.1",
+  "version": "3.0.0",
   "homepage": "https://github.com/accessible-ui/checkbox#readme",
   "repository": "github:accessible-ui/checkbox",
   "bugs": "https://github.com/accessible-ui/checkbox/issues",
@@ -19,35 +19,53 @@
     "react checkbox component",
     "react checkbox"
   ],
-  "main": "dist/cjs/index.js",
-  "module": "dist/es/index.js",
+  "main": "dist/main/index.js",
+  "module": "dist/module/index.js",
+  "source": "src/index.tsx",
+  "types": "types/index.d.ts",
   "files": [
-    "/dist"
+    "/dist",
+    "/src",
+    "/types"
   ],
+  "exports": {
+    ".": {
+      "browser": "./dist/module/index.js",
+      "import": "./dist/esm/index.mjs",
+      "require": "./dist/main/index.js",
+      "source": "./src/index.tsx",
+      "types": "./types/index.d.ts",
+      "default": "./dist/main/index.js"
+    },
+    "./package.json": "./package.json",
+    "./": "./"
+  },
   "sideEffects": false,
   "scripts": {
-    "build": "npm run build:cjs && npm run build:es && npm run build:types",
-    "build:cjs": "babel src -d dist/cjs -x .ts,.tsx --ignore \"**/*.test.ts\",\"**/test.ts\",\"**/*.test.tsx\",\"**/test.tsx\" --delete-dir-on-start",
-    "build:es": "cross-env BABEL_ENV=es babel src -d dist/es -x .ts,.tsx --ignore \"**/*.test.ts\",\"**/test.ts\",\"**/*.test.tsx\",\"**/test.tsx\" --delete-dir-on-start",
-    "build:types": "tsc -p tsconfig.json -d --outDir dist/es --emitDeclarationOnly && mkdir -p dist/cjs && cp -R dist/es/**.d.ts dist/cjs && rimraf dist/**/*.test.d.ts",
+    "build": "npm run build-esm && npm run build-main && npm run build-module && npm run build-types",
+    "build-esm": "npm run compile -- -d dist/esm --env-name esm --out-file-extension .mjs",
+    "build-main": "npm run compile -- -d dist/main --env-name main",
+    "build-module": "npm run compile -- -d dist/module --env-name module",
+    "build-types": "tsc -p tsconfig.json -d --outDir types --emitDeclarationOnly",
     "check-types": "tsc --noEmit -p tsconfig.json",
-    "format": "prettier --write \"**/*.{ts,tsx,js,jsx,md,yml,json,babelrc,eslintrc,prettierrc}\"",
+    "compile": "babel src -x .ts,.tsx --ignore \"**/*.test.ts\",\"**/*.test.tsx\" --delete-dir-on-start",
+    "format": "prettier --write \"**/*.{ts,tsx,js,jsx,md,yml,json,eslintrc,prettierrc}\"",
     "lint": "eslint . --ext .ts,.tsx",
     "prepublishOnly": "npm run lint && npm run test && npm run build && npm run format",
     "test": "jest",
     "validate": "npm run check-types && npm run lint && npm run test -- --coverage"
   },
   "husky": {
     "hooks": {
-      "pre-commit": "lint-staged && npm run build:types"
+      "pre-commit": "npm run build-types && git add types && lint-staged"
     }
   },
   "lint-staged": {
     "**/*.{ts,tsx,js,jsx}": [
       "eslint",
       "prettier --write"
     ],
-    "**/*.{md,yml,json,babelrc,eslintrc,prettierrc}": [
+    "**/*.{md,yml,json,eslintrc,prettierrc}": [
       "prettier --write"
     ]
   },
@@ -57,14 +75,14 @@
     "@testing-library/jest-dom": "latest",
     "@testing-library/react": "latest",
     "@testing-library/react-hooks": "latest",
+    "@testing-library/user-event": "latest",
     "@types/jest": "latest",
     "@types/react": "latest",
     "@types/react-dom": "latest",
     "@typescript-eslint/eslint-plugin": "latest",
     "@typescript-eslint/parser": "latest",
-    "babel-plugin-optimize-react": "^0.0.4",
-    "babel-plugin-typescript-to-proptypes": "^1.1.0",
-    "cross-env": "latest",
+    "babel-plugin-annotate-pure-calls": "latest",
+    "babel-plugin-optimize-react": "latest",
     "eslint": "latest",
     "eslint-import-resolver-jest": "latest",
     "eslint-plugin-jest": "latest",
@@ -77,18 +95,15 @@
     "react": "latest",
     "react-dom": "latest",
     "react-test-renderer": "latest",
-    "rimraf": "^2.6.3",
     "ts-jest": "latest",
-    "typescript": "latest",
-    "typescript-to-proptypes": "^1.4.0"
+    "typescript": "latest"
   },
   "dependencies": {
-    "@accessible/visually-hidden": "^1.0.1",
-    "@react-hook/switch": "^1.0.4",
-    "clsx": "^1.0.4"
+    "@accessible/visually-hidden": "^1.1.0",
+    "@react-hook/switch": "^1.1.0",
+    "clsx": "^1.1.1"
   },
   "peerDependencies": {
-    "prop-types": ">=15.7.2",
     "react": ">=16.8",
     "react-dom": ">=16.8"
   }

package.json

@@ -93,7 +93,7 @@ describe('<Checkbox>', () => {
 
     render(
       <Checkbox>
-        {context => {
+        {(context) => {
           cxt = context
           return <div />
         }}