Upgrade Parcel and other dev dependencies (#2701)

Author: devongovett

.circleci/comment.js

@@ -19,7 +19,7 @@ async function run() {
     body: `Build successful! 🎉
 
 * [View the storybook](https://reactspectrum.blob.core.windows.net/reactspectrum/${process.env.CIRCLE_SHA1}/storybook/index.html)
-* [View the storybook-17](https://reactspectrum.blob.core.windows.net/reactspectrum/${process.env.CIRCLE_SHA1}/storybook-17/index.html)
+* [View the storybook-16](https://reactspectrum.blob.core.windows.net/reactspectrum/${process.env.CIRCLE_SHA1}/storybook-16/index.html)
 * [View the documentation](https://reactspectrum.blob.core.windows.net/reactspectrum/${process.env.CIRCLE_SHA1}/docs/index.html)`
   });
 }

.circleci/config.yml

@@ -6,22 +6,22 @@ orbs:
 executors:
   rsp:
     docker:
-      - image: cimg/node:12.22
+      - image: cimg/node:14.16.0
     environment:
       CACHE_VERSION: v1
     working_directory: ~/react-spectrum
 
   rsp-large:
     docker:
-      - image: cimg/node:12.22
+      - image: cimg/node:14.16.0
     resource_class: large
     environment:
       CACHE_VERSION: v1
     working_directory: ~/react-spectrum
 
   rsp-xlarge:
     docker:
-      - image: cimg/node:12.22
+      - image: cimg/node:14.16.0
     resource_class: xlarge
     environment:
       CACHE_VERSION: v1
@@ -60,7 +60,7 @@ jobs:
             - ~/react-spectrum
           key: react-spectrum-{{ .Environment.CACHE_VERSION }}-{{ .Environment.CIRCLE_SHA1 }}
 
-  install-17:
+  install-16:
     executor: rsp-large
     steps:
       - checkout
@@ -73,12 +73,12 @@ jobs:
       - run:
           name: build
           command: |
-            yarn install --pure-lockfile --cache-folder ~/.cache/yarn && yarn install-17 --cache-folder ~/.cache/yarn
+            yarn install --pure-lockfile --cache-folder ~/.cache/yarn && yarn install-16 --cache-folder ~/.cache/yarn
 
       - save_cache:
           paths:
             - ~/react-spectrum
-          key: react-spectrum17-{{ .Environment.CACHE_VERSION }}-{{ .Environment.CIRCLE_SHA1 }}
+          key: react-spectrum16-{{ .Environment.CACHE_VERSION }}-{{ .Environment.CIRCLE_SHA1 }}
 
   test-ssr:
     executor: rsp-xlarge
@@ -116,23 +116,23 @@ jobs:
       - store_artifacts:
           path: ~/junit
 
-  test-ssr-17:
+  test-ssr-16:
     executor: rsp-xlarge
     steps:
       - restore_cache:
-          key: react-spectrum17-{{ .Environment.CACHE_VERSION }}-{{ .Environment.CIRCLE_SHA1 }}
+          key: react-spectrum16-{{ .Environment.CACHE_VERSION }}-{{ .Environment.CIRCLE_SHA1 }}
 
       - run:
           name: test ssr
           command: |
             yarn test:ssr
 
-  test-17:
+  test-16:
     parallelism: 3
     executor: rsp-xlarge
     steps:
       - restore_cache:
-          key: react-spectrum17-{{ .Environment.CACHE_VERSION }}-{{ .Environment.CIRCLE_SHA1 }}
+          key: react-spectrum16-{{ .Environment.CACHE_VERSION }}-{{ .Environment.CIRCLE_SHA1 }}
 
       - run: mkdir ~/junit
 
@@ -141,10 +141,10 @@ jobs:
           command: |
             shopt -s globstar
             TESTFILES=$(circleci tests glob "packages/**/*.test.[tj]{s,sx}" | circleci tests split --split-by=timings)
-            JEST_JUNIT_OUTPUT_NAME="junit-17.xml" yarn test ${TESTFILES}
+            JEST_JUNIT_OUTPUT_NAME="junit-16.xml" yarn test ${TESTFILES}
 
       - run:
-          command: cp junit-17.xml ~/junit/
+          command: cp junit-16.xml ~/junit/
           when: always
       - store_test_results:
           path: ~/junit
@@ -176,20 +176,20 @@ jobs:
           paths:
             - '*/storybook/'
 
-  storybook-17:
+  storybook-16:
     executor: rsp-large
     steps:
       - restore_cache:
-          key: react-spectrum17-{{ .Environment.CACHE_VERSION }}-{{ .Environment.CIRCLE_SHA1 }}
+          key: react-spectrum16-{{ .Environment.CACHE_VERSION }}-{{ .Environment.CIRCLE_SHA1 }}
 
       - run:
-          name: build storybook-17
-          command: make storybook-17
+          name: build storybook-16
+          command: make storybook-16
 
       - persist_to_workspace:
           root: dist
           paths:
-            - '*/storybook-17/'
+            - '*/storybook-16/'
 
   docs:
     executor: rsp-xlarge
@@ -275,28 +275,28 @@ workflows:
   commit:
     jobs:
       - install
-      - install-17
+      - install-16
       - test-ssr:
           requires:
             - install
       - test:
           requires:
             - install
-      - test-ssr-17:
+      - test-ssr-16:
           requires:
-            - install-17
-      - test-17:
+            - install-16
+      - test-16:
           requires:
-            - install-17
+            - install-16
       - lint:
           requires:
             - install
       - storybook:
           requires:
             - install
-      - storybook-17:
+      - storybook-16:
           requires:
-            - install-17
+            - install-16
       - docs:
           requires:
             - install
@@ -311,10 +311,10 @@ workflows:
             - lint
             - test-ssr
             - test
-            - test-ssr-17
-            - test-17
+            - test-ssr-16
+            - test-16
             - storybook
-            - storybook-17
+            - storybook-16
             - docs
       - deploy-production:
           filters:

.eslintrc.js

@@ -79,7 +79,10 @@ module.exports = {
     'expect': true,
     'JSX': 'readonly',
     'NodeJS': 'readonly',
-    'AsyncIterable': 'readonly'
+    'AsyncIterable': 'readonly',
+    'FileSystemFileEntry': 'readonly',
+    'FileSystemDirectoryEntry': 'readonly',
+    'FileSystemEntry': 'readonly'
   },
   settings: {
     jsdoc: {

.parcelrc

@@ -1,19 +1,25 @@
 {
   "extends": "@parcel/config-default",
-  "resolvers": ["parcel-resolver-docs", "..."],
+  "resolvers": ["@parcel/resolver-glob", "parcel-resolver-docs", "..."],
+  "bundler": "@parcel/bundler-experimental",
   "transformers": {
     "apiCheck:*.{js,ts,tsx,json}": ["parcel-transformer-docs"],
     "docs:*.{js,ts,tsx,json}": ["parcel-transformer-docs", "@parcel/transformer-inline"],
     "docs-json:*.{js,ts,tsx,json}": ["parcel-transformer-docs"],
     "*.{md,mdx}": ["parcel-transformer-mdx-docs"],
     "*.svg": ["@parcel/transformer-svg-react"],
-    "*.css": ["...", "parcel-transformer-css-env"]
+    "*.css": ["...", "parcel-transformer-css-env"],
+    "*.{js,mjs,jsm,jsx,es6,cjs,ts,tsx}": [
+      "@parcel/transformer-js",
+      "@parcel/transformer-react-refresh-wrap"
+    ]
   },
   "namers": ["parcel-namer-docs", "..."],
   "packagers": {
     "*.json": "parcel-packager-docs",
+    "*.html": "@parcel/packager-js"
   },
   "optimizers": {
-    "*.js": ["parcel-optimizer-ssg", "..."]
+    "*.html": ["parcel-optimizer-ssg", "..."]
   }
 }

Makefile

@@ -65,8 +65,8 @@ icons: packages/@spectrum-icons/workflow/src packages/@spectrum-icons/color/src
 storybook:
 	NODE_ENV=production yarn build:storybook
 
-storybook-17:
-	yarn build:storybook-17
+storybook-16:
+	yarn build:storybook-16
 
 # for now doesn't have deploy since v3 doesn't have a place for docs and stuff yet
 ci:
@@ -79,7 +79,7 @@ publish-nightly: build
 	yarn publish:nightly
 
 build:
-	parcel build packages/@react-{spectrum,aria,stately}/*/ packages/@internationalized/*/ --no-minify
+	parcel build packages/@react-{spectrum,aria,stately}/*/ packages/@internationalized/*/ --no-optimize
 
 website:
 	yarn build:docs --public-url /reactspectrum/$$(git rev-parse HEAD)/docs --dist-dir dist/$$(git rev-parse HEAD)/docs

babel.config.json

@@ -2,7 +2,7 @@
   "presets": [
     "@babel/preset-typescript",
     "@babel/preset-react",
-    ["@parcel/babel-preset-env",
+    ["@babel/preset-env",
       {
         "loose": true
       }
@@ -12,7 +12,7 @@
     "storybook": {
       "presets": [
         [
-          "@parcel/babel-preset-env",
+          "@babel/preset-env",
           {
             "loose": true,
             "targets": {
@@ -42,7 +42,7 @@
   },
   "plugins": [
     [
-      "@parcel/babel-plugin-transform-runtime",
+      "@babel/plugin-transform-runtime",
       {
         "version": "^7.6.2"
       }
@@ -53,15 +53,6 @@
         "legacy": true
       }
     ],
-    [
-      "@babel/plugin-proposal-class-properties",
-      {
-        "loose": true
-      }
-    ],
-    "@babel/plugin-proposal-export-default-from",
-    "@babel/plugin-proposal-export-namespace-from",
-    "@babel/plugin-syntax-class-properties",
     "transform-glob-import",
     "babel-plugin-macros"
   ],

package.json

@@ -15,19 +15,19 @@
   ],
   "scripts": {
     "check-types": "tsc",
-    "install-17": "yarn add -W react@^17.0.1 react-dom@^17.0.1",
+    "install-16": "yarn add -W react@^16.8.0 react-dom@^16.8.0",
     "start": "cross-env NODE_ENV=storybook start-storybook -p 9003 --ci -c '.storybook'",
     "build:storybook": "build-storybook -c .storybook -o dist/$(git rev-parse HEAD)/storybook",
-    "build:storybook-17": "build-storybook -c .storybook -o dist/$(git rev-parse HEAD)/storybook-17",
+    "build:storybook-16": "build-storybook -c .storybook -o dist/$(git rev-parse HEAD)/storybook-16",
     "start:chromatic": "NODE_ENV=storybook start-storybook -p 9004 --ci -c '.chromatic'",
     "build:chromatic": "build-storybook -c .chromatic -o dist/$(git rev-parse HEAD)/chromatic",
     "start:docs": "PARCEL_WORKER_BACKEND=process DOCS_ENV=dev parcel 'packages/@react-{spectrum,aria,stately}/*/docs/*.mdx' 'packages/dev/docs/pages/**/*.mdx'",
-    "build:docs": "PARCEL_WORKER_BACKEND=process DOCS_ENV=staging parcel build 'packages/@react-{spectrum,aria,stately}/*/docs/*.mdx' 'packages/dev/docs/pages/**/*.mdx' --no-scope-hoist",
+    "build:docs": "PARCEL_WORKER_BACKEND=process DOCS_ENV=staging parcel build 'packages/@react-{spectrum,aria,stately}/*/docs/*.mdx' 'packages/dev/docs/pages/**/*.mdx'",
     "test": "yarn jest",
     "build": "make build",
     "test:ssr": "yarn jest --config jest.ssr.config.js",
     "ci-test": "yarn jest --maxWorkers=2 && yarn test:ssr --runInBand",
-    "ci-test-17": "yarn jest --maxWorkers=2 && yarn test:ssr --runInBand",
+    "ci-test-16": "yarn jest --maxWorkers=2 && yarn test:ssr --runInBand",
     "lint": "concurrently \"yarn check-types\" \"eslint packages --ext .js,.ts,.tsx\" \"node scripts/lint-packages.js\"",
     "jest": "node scripts/jest.js",
     "copyrights": "babel-node --presets @babel/env ./scripts/addHeaders.js",
@@ -56,26 +56,21 @@
     "@babel/cli": "^7.12.10",
     "@babel/core": "^7.12.10",
     "@babel/node": "^7.12.10",
-    "@babel/plugin-proposal-class-properties": "^7.12.1",
     "@babel/plugin-proposal-decorators": "^7.12.1",
-    "@babel/plugin-proposal-export-default-from": "^7.12.1",
-    "@babel/plugin-proposal-export-namespace-from": "^7.12.1",
-    "@babel/plugin-proposal-object-rest-spread": "^7.12.1",
-    "@babel/plugin-syntax-class-properties": "^7.12.1",
     "@babel/plugin-syntax-decorators": "^7.12.1",
-    "@babel/plugin-syntax-object-rest-spread": "^7.8.3",
-    "@babel/plugin-transform-async-to-generator": "^7.12.1",
     "@babel/plugin-transform-runtime": "^7.12.10",
     "@babel/preset-env": "^7.12.11",
     "@babel/preset-react": "^7.12.10",
     "@babel/preset-typescript": "^7.12.7",
     "@babel/register": "^7.12.10",
     "@babel/runtime": "^7.12.5",
     "@octokit/rest": "*",
-    "@parcel/babel-plugin-transform-runtime": "nightly",
-    "@parcel/babel-preset-env": "nightly",
-    "@parcel/transformer-inline": "nightly",
-    "@parcel/transformer-svg-react": "nightly",
+    "@parcel/bundler-experimental": "2.0.0-nightly.2573",
+    "@parcel/packager-ts": "2.0.0-nightly.951",
+    "@parcel/resolver-glob": "2.0.2-nightly.2573",
+    "@parcel/transformer-inline": "2.0.0-nightly.951",
+    "@parcel/transformer-svg-react": "2.0.2-nightly.2573",
+    "@parcel/transformer-typescript-types": "2.0.0-nightly.951",
     "@spectrum-css/component-builder": "^1.0.0",
     "@spectrum-css/vars": "^2.3.0",
     "@storybook/addon-a11y": "^6.1.10",
@@ -89,9 +84,9 @@
     "@testing-library/dom": "^8.0.0",
     "@testing-library/jest-dom": "^5.14.1",
     "@testing-library/react": "^12.0.0",
-    "@testing-library/react-hooks": "^3.4.1",
+    "@testing-library/react-hooks": "^7.0.2",
     "@testing-library/user-event": "^12.1.3",
-    "@types/react": "^16.9.23",
+    "@types/react": "^17.0.37",
     "@types/storybook__react": "^5.2.1",
     "@typescript-eslint/eslint-plugin": "^4.3.0",
     "@typescript-eslint/parser": "^4.3.0",
@@ -140,9 +135,10 @@
     "md5": "^2.2.1",
     "nyc": "^10.2.0",
     "p-queue": "^6.2.1",
-    "parcel": "nightly",
+    "parcel": "2.0.0-nightly.949",
     "patch-package": "^6.2.0",
     "plop": "^2.4.0",
+    "postcss": "^7.0.0",
     "postcss-calc": "^6.0.0",
     "postcss-custom-properties": "6.3.1",
     "postcss-dir-pseudo-class": "^5.0.0",
@@ -157,9 +153,9 @@
     "postcss-svg": "^3.0.0",
     "prop-types": "^15.6.0",
     "raf": "^3.4.0",
-    "react": "^16.8.0 || ^17.0.0-rc.1",
+    "react": "^17.0.2",
     "react-axe": "^3.0.2",
-    "react-dom": "^16.8.0 || ^17.0.0-rc.1",
+    "react-dom": "^17.0.2",
     "react-overlays": "0.8.3",
     "react-test-renderer": "^16.9.0",
     "recursive-readdir": "^2.2.2",
@@ -169,7 +165,7 @@
     "storybook-dark-mode": "^1.0.3",
     "style-loader": "^0.23.1",
     "tempy": "^0.5.0",
-    "typescript": "^3.8.3",
+    "typescript": "^4.5.2",
     "url-loader": "^1.1.2",
     "walk-object": "^4.0.0",
     "webpack": "^4.44.2",