Port over minimal TS configs, deps and port Pane

brandongregoryscott commented 1 year ago

Overview

This was bit of a stretch goal of mine for V7 - bringing TypeScript into the project and kicking off the port! Instead of doing a massive one-pass refactor from JS -> TS like #1467, I pulled out the parts of the migration utils I wrote and reworked them to act on one component at a time, and (for the most part) be re-runnable without side effects if the component has already been ported.

In the interest of keeping this PR smaller and not littering the repo with temporary codemod scripts that aren't necessarily battle-tested yet, I kept them out of this PR. I may break out another repo or just keep a branch alive that has the utilities to use when I'm porting over more components.

Summary of changes:

Added a rollup plugin for bundling our UMD build to TS
Added the babel TS preset for bundling our ESM build
CommonJS build now uses tsc
Switched to @typescript-eslint instead of babel-eslint for parsing
Prettier was updated to support newer TS syntax (i.e. type import/exports)
Generated types from tsc will be re-exported through the manually written index.d.ts until we can re-point our package.json to the generated index.d.ts
PropTypes will stay in for now - we are parsing them for our doc site, so until we can parse prop interfaces instead, we have to maintain both 😞

I'm not convinced bundling of @types/react as a production dependency is necessary, but it does seem like @types/react-transition-group is necessary (or the OverlayProps break for consumers), so I've removed the former.

Screenshots (if applicable)

Documentation

[x] Updated Typescript types and/or component PropTypes
[ ] Added / modified component docs
[ ] Added / modified Storybook stories

brandongregoryscott commented 1 year ago

Pulled this into app and there's definitely something jacked up with the Pane types - going to do some further investigation!

brandongregoryscott commented 1 year ago

After updating the type cast of the memoized Pane and re-adding the react-transition-group types, I'm not seeing any more ts errors in app!

netlify[bot] commented 1 year ago

Deploy Preview for evergreen-storybook ready!

Name	Link
Latest commit	d74a01f38ef38a979cc5afb5ad402f4d07041eec
Latest deploy log	https://app.netlify.com/sites/evergreen-storybook/deploys/63d92e54deb2d40009ba5d67
Deploy Preview	https://deploy-preview-1590--evergreen-storybook.netlify.app
Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site settings.

segmentio / evergreen