From 221d2b9aa0ba10bac3a595f9c22729888d1a7a90 Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Sun, 2 Aug 2020 07:45:36 +0000 Subject: [PATCH 001/456] Bump elliptic from 6.5.2 to 6.5.3 in /website (#259) --- website/yarn.lock | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/website/yarn.lock b/website/yarn.lock index 446ab443..d84d2a41 100644 --- a/website/yarn.lock +++ b/website/yarn.lock @@ -3745,9 +3745,9 @@ electron-to-chromium@^1.3.390: integrity sha512-gaCDfX7IUH0s3JmBiHCDPrvVcdnTTP1r4WLJc2dHkYYbLmXZ2XHiJCcGQ9Balf91aKTvuCKCyu2JjJYRykoI1w== elliptic@^6.0.0, elliptic@^6.5.2: - version "6.5.2" - resolved "https://registry.yarnpkg.com/elliptic/-/elliptic-6.5.2.tgz#05c5678d7173c049d8ca433552224a495d0e3762" - integrity sha512-f4x70okzZbIQl/NSRLkI/+tteV/9WqL98zx+SQ69KbXxmVrmjwsNUPn/gYJJ0sHvEak24cZgHIPegRePAtA/xw== + version "6.5.3" + resolved "https://registry.yarnpkg.com/elliptic/-/elliptic-6.5.3.tgz#cb59eb2efdaf73a0bd78ccd7015a62ad6e0f93d6" + integrity sha512-IMqzv5wNQf+E6aHeIqATs0tOLeOTwj1QKbRcS3jBbYkl5oLAserA8yJTT7/VyHUYG91PRmPyeQDObKLPpeS4dw== dependencies: bn.js "^4.4.0" brorand "^1.0.1" From da85af250c99af9a6694f0b32ffbdf772730ffc8 Mon Sep 17 00:00:00 2001 From: Arvind Srinivasan Date: Mon, 3 Aug 2020 01:30:47 +0530 Subject: [PATCH 002/456] Troubleshooting : Type an untyped module (#254) * Troubleshooting : Type an untyped module Added Docs for Exporting types for Untyped libraries. PR for the Issue #245 * Updated Readme for Troubleshooting Updated Readme for Troubleshooting for the issue Typing an untyped library. Addresses issue #245. * Changed to appropriate Language Format * Updated Readme Troubleshooting code formatting * Update types.md * Update README.md * Update docs/basic/troubleshooting/types.md Co-authored-by: swyx * Update README.md Co-authored-by: swyx * Update README.md Co-authored-by: swyx * Update README.md Co-authored-by: swyx * Typing an untyped library Explained workarounds and possible solutions for typing an untyped React Hook or a React Component with Code Examples. * fix formatting * tweaks * fix typescript spelling Co-authored-by: swyx --- README.md | 31 ++++++ docs/basic/troubleshooting/types.md | 159 +++++++++++++++++++++++++++- 2 files changed, 189 insertions(+), 1 deletion(-) diff --git a/README.md b/README.md index b0e5905b..753b2a3b 100644 --- a/README.md +++ b/README.md @@ -88,6 +88,7 @@ - [Using Inferred Types](#using-inferred-types) - [Using Partial Types](#using-partial-types) - [The Types I need Weren't Exported!](#the-types-i-need-werent-exported) + - [The Types I need Don't Exist!](#the-types-i-need-dont-exist) - [Troubleshooting Handbook: Operators](#troubleshooting-handbook-operators) - [Troubleshooting Handbook: Utilties](#troubleshooting-handbook-utilities) - [Troubleshooting Handbook: tsconfig.json](#troubleshooting-handbook-tsconfigjson) @@ -1539,6 +1540,36 @@ let baz2: SubIsntType2 = { - TS also ships with a `Parameters` utility type for extracting the parameters of a function - for anything more "custom", the `infer` keyword is the basic building block for this, but takes a bit of getting used to. Look at the source code for the above utility types, and [this example](https://twitter.com/mgechev/status/1211030455224422401?s=20) to get the idea. +## The Types I need don't exist! + +What's more annoying than modules with unexported types? Modules that are **untyped**! + +Fret not! It's just a simple two step process. + +- Create a new type declaration file, say `typedec.d.ts`– if you don't already have one. Ensure that the path to file is resolvable by Typescript. To do so, check the `include` array in the `tsconfig.json` file at the root of your directory. + +```json +// inside tsconfig.json +{ +... + "include": [ + "src" // automatically resolves if path to declaration is src/typedec.d.ts + ], +... +} +``` + +- Add the `declare` syntax for your desired module, say `my-untyped-module`– to the declaration file. + +```ts +// inside typedec.d.ts +declare module "my-untyped-module"; +``` + +This one-line alone is enough if you just need it to work without errors. If you need to, you can include your type definitions inferred from the untyped module's source or docs within curly braces following this declaration. + +If you're working with untyped class components in React, you can also checkout this [short post](https://templecoding.com/blog/2016/03/31/creating-typescript-typings-for-existing-react-components) as a reference. + # Troubleshooting Handbook: Images and other non-TS/TSX files Use [declaration merging](https://www.typescriptlang.org/docs/handbook/declaration-merging.html): diff --git a/docs/basic/troubleshooting/types.md b/docs/basic/troubleshooting/types.md index ca6b01e7..f923ad71 100644 --- a/docs/basic/troubleshooting/types.md +++ b/docs/basic/troubleshooting/types.md @@ -8,7 +8,7 @@ sidebar_label: Types Facing weird type errors? You aren't alone. This is the hardest part of using TypeScript with React. Be patient - you are learning a new language after all. However, the more you get good at this, the less time you'll be working _against_ the compiler and the more the compiler will be working _for_ you! -Try to avoid typing with `any` as much as possible to experience the full benefits of typescript. Instead, let's try to be familiar with some of the common strategies to solve these issues. +Try to avoid typing with `any` as much as possible to experience the full benefits of TypeScript. Instead, let's try to be familiar with some of the common strategies to solve these issues. ## Union Types and Type Guarding @@ -367,3 +367,160 @@ let baz2: SubIsntType2 = { - TS also ships with a `Parameters` utility type for extracting the parameters of a function - for anything more "custom", the `infer` keyword is the basic building block for this, but takes a bit of getting used to. Look at the source code for the above utility types, and [this example](https://twitter.com/mgechev/status/1211030455224422401?s=20) to get the idea. Basarat [also has a good video on `infer`](https://www.youtube.com/watch?v=ijK-1R-LFII&list=PLYvdvJlnTOjF6aJsWWAt7kZRJvzw-en8B&index=3&t=0s). + +## The Types I need don't exist! + +What's more annoying than modules with unexported types? Modules that are **untyped**! + +Fret not! There are more than a couple of ways in which you can solve this problem. + +A **lazier** way would be to create a new type declaration file, say `typedec.d.ts`– if you don't already have one. Ensure that the path to file is resolvable by TypeScript by checking the `include` array in the `tsconfig.json` file at the root of your directory. + +```json +// inside tsconfig.json +{ + // ... + "include": [ + "src" // automatically resolves if the path to declaration is src/typedec.d.ts + ] + // ... +} +``` + +Within this file, add the `declare` syntax for your desired module, say `my-untyped-module`– to the declaration file: + +```ts +// inside typedec.d.ts +declare module "my-untyped-module"; +``` + +This one-liner alone is enough if you just need it to work without errors. A even hackier, write-once-and-forget way would be to use `"*"` instead which would then apply the `Any` type for all existing and future untyped modules. + +This solution works well as a workaround if you have less than a couple untyped modules. Anything more, you now have a ticking type-bomb in your hands. The only way of circumventing this problem would be to define the missing types for those untyped modules as explained in the following sections. + +### Typing Exported Hooks + +Typing Hooks is just like typing pure functions. + +The following steps work under two assumptions: + +- You have already created a type declaration file as stated earlier in the section. +- You have access to the source code - specifically the code that directly exports the functions you will be using. In most cases, it would be housed in an `index.js` file. + Typically you need a minimum of **two** type declarations (one for **Input Prop** and the other for **Return Prop**) to define a hook completely. Suppose the hook you wish to type follows the following structure, + +```js +// ... +const useUntypedHook = (prop) => { + // some processing happens here + return { + /* ReturnProps */ + }; +}; +export default useUntypedHook; +``` + +then, your type declaration should most likely follow the following syntax. + +```ts +declare module 'use-untyped-hook' { + export interface InputProps { ... } // type declaration for prop + export interface ReturnProps { ... } // type declaration for return props + export default function useUntypedHook( + prop: InputProps + // ... + ): ReturnProps; +} +``` + +
+ + +For instance, the [useDarkMode hook](https://github.com/donavon/use-dark-mode) exports the functions that follows a similar structure. + + + +```js +// inside src/index.js +const useDarkMode = ( + initialValue = false, // -> input props / config props to be exported + { + // -> input props / config props to be exported + element, + classNameDark, + classNameLight, + onChange, + storageKey = "darkMode", + storageProvider, + global, + } = {} +) => { + // ... + return { + // -> return props to be exported + value: state, + enable: useCallback(() => setState(true), [setState]), + disable: useCallback(() => setState(false), [setState]), + toggle: useCallback(() => setState((current) => !current), [setState]), + }; +}; +export default useDarkMode; +``` + +As the comments suggest, exporting these config props and return props following the aforementioned structure will result in the following type export. + +```ts +declare module "use-dark-mode" { + /** + * A config object allowing you to specify certain aspects of `useDarkMode` + */ + export interface DarkModeConfig { + classNameDark?: string; // A className to set "dark mode". Default = "dark-mode". + classNameLight?: string; // A className to set "light mode". Default = "light-mode". + element?: HTMLElement; // The element to apply the className. Default = `document.body` + onChange?: (val?: boolean) => void; // Overide the default className handler with a custom callback. + storageKey?: string; // Specify the `localStorage` key. Default = "darkMode". Set to `null` to disable persistent storage. + storageProvider?: WindowLocalStorage; // A storage provider. Default = `localStorage`. + global?: Window; // The global object. Default = `window`. + } + /** + * An object returned from a call to `useDarkMode`. + */ + export interface DarkMode { + readonly value: boolean; + enable: () => void; + disable: () => void; + toggle: () => void; + } + /** + * A custom React Hook to help you implement a "dark mode" component for your application. + */ + export default function useDarkMode( + initialState?: boolean, + config?: DarkModeConfig + ): DarkMode; +} +``` + +
+ +### Typing Exported Components + +In case of typing untyped class components, there's almost no difference in approach except for the fact that after declaring the types, you export the extend the type using `class UntypedClassComponent extends React.Component {}` where `UntypedClassComponentProps` holds the type declaration. + +For instance, [sw-yx's Gist on React Router 6 types](https://gist.github.com/sw-yx/37a6a3d248c2d4031801f0d568904df8) implemented a similar method for typing the then untyped RR6. + +```ts +declare module "react-router-dom" { + import * as React from 'react'; + // ... + type NavigateProps = { + to: string | number, + replace?: boolean, + state?: T + } + //... + export class Navigate extends React.Component>{} + // ... +``` + +For more information on creating type definitions for class components, you can refer to this [post](https://templecoding.com/blog/2016/03/31/creating-typescript-typings-for-existing-react-components) for reference. From 7902bf063d5202367d70fe293600f309d5c90bd0 Mon Sep 17 00:00:00 2001 From: Arvind Srinivasan Date: Tue, 4 Aug 2020 00:57:55 +0530 Subject: [PATCH 003/456] Update README.md with Troubleshooting Changes (#260) * Update README.md with Types Added changes to Troubleshooting types from #254 to README.md * Update README.md * fix prettier Co-authored-by: swyx --- README.md | 147 ++++++++++++++++++++++++++++++++++++++++++++++++++---- 1 file changed, 137 insertions(+), 10 deletions(-) diff --git a/README.md b/README.md index 753b2a3b..6f94bfbd 100644 --- a/README.md +++ b/README.md @@ -1544,31 +1544,158 @@ let baz2: SubIsntType2 = { What's more annoying than modules with unexported types? Modules that are **untyped**! -Fret not! It's just a simple two step process. +Fret not! There are more than a couple of ways in which you can solve this problem. -- Create a new type declaration file, say `typedec.d.ts`– if you don't already have one. Ensure that the path to file is resolvable by Typescript. To do so, check the `include` array in the `tsconfig.json` file at the root of your directory. +A **lazier** way would be to create a new type declaration file, say `typedec.d.ts`– if you don't already have one. Ensure that the path to file is resolvable by TypeScript by checking the `include` array in the `tsconfig.json` file at the root of your directory. ```json // inside tsconfig.json { -... - "include": [ - "src" // automatically resolves if path to declaration is src/typedec.d.ts - ], -... + // ... + "include": [ + "src" // automatically resolves if the path to declaration is src/typedec.d.ts + ] + // ... } ``` -- Add the `declare` syntax for your desired module, say `my-untyped-module`– to the declaration file. +Within this file, add the `declare` syntax for your desired module, say `my-untyped-module`– to the declaration file: ```ts // inside typedec.d.ts declare module "my-untyped-module"; ``` -This one-line alone is enough if you just need it to work without errors. If you need to, you can include your type definitions inferred from the untyped module's source or docs within curly braces following this declaration. +This one-liner alone is enough if you just need it to work without errors. A even hackier, write-once-and-forget way would be to use `"*"` instead which would then apply the `Any` type for all existing and future untyped modules. + +This solution works well as a workaround if you have less than a couple untyped modules. Anything more, you now have a ticking type-bomb in your hands. The only way of circumventing this problem would be to define the missing types for those untyped modules as explained in the following sections. + +### Typing Exported Hooks + +Typing Hooks is just like typing pure functions. + +The following steps work under two assumptions: + +- You have already created a type declaration file as stated earlier in the section. +- You have access to the source code - specifically the code that directly exports the functions you will be using. In most cases, it would be housed in an `index.js` file. + Typically you need a minimum of **two** type declarations (one for **Input Prop** and the other for **Return Prop**) to define a hook completely. Suppose the hook you wish to type follows the following structure, + +```js +// ... +const useUntypedHook = (prop) => { + // some processing happens here + return { + /* ReturnProps */ + }; +}; +export default useUntypedHook; +``` + +then, your type declaration should most likely follow the following syntax. + +```ts +declare module 'use-untyped-hook' { + export interface InputProps { ... } // type declaration for prop + export interface ReturnProps { ... } // type declaration for return props + export default function useUntypedHook( + prop: InputProps + // ... + ): ReturnProps; +} +``` + +
+ + +For instance, the [useDarkMode hook](https://github.com/donavon/use-dark-mode) exports the functions that follows a similar structure. + + + +```js +// inside src/index.js +const useDarkMode = ( + initialValue = false, // -> input props / config props to be exported + { + // -> input props / config props to be exported + element, + classNameDark, + classNameLight, + onChange, + storageKey = "darkMode", + storageProvider, + global, + } = {} +) => { + // ... + return { + // -> return props to be exported + value: state, + enable: useCallback(() => setState(true), [setState]), + disable: useCallback(() => setState(false), [setState]), + toggle: useCallback(() => setState((current) => !current), [setState]), + }; +}; +export default useDarkMode; +``` + +As the comments suggest, exporting these config props and return props following the aforementioned structure will result in the following type export. + +```ts +declare module "use-dark-mode" { + /** + * A config object allowing you to specify certain aspects of `useDarkMode` + */ + export interface DarkModeConfig { + classNameDark?: string; // A className to set "dark mode". Default = "dark-mode". + classNameLight?: string; // A className to set "light mode". Default = "light-mode". + element?: HTMLElement; // The element to apply the className. Default = `document.body` + onChange?: (val?: boolean) => void; // Overide the default className handler with a custom callback. + storageKey?: string; // Specify the `localStorage` key. Default = "darkMode". Set to `null` to disable persistent storage. + storageProvider?: WindowLocalStorage; // A storage provider. Default = `localStorage`. + global?: Window; // The global object. Default = `window`. + } + /** + * An object returned from a call to `useDarkMode`. + */ + export interface DarkMode { + readonly value: boolean; + enable: () => void; + disable: () => void; + toggle: () => void; + } + /** + * A custom React Hook to help you implement a "dark mode" component for your application. + */ + export default function useDarkMode( + initialState?: boolean, + config?: DarkModeConfig + ): DarkMode; +} +``` + +
+ +### Typing Exported Components + +In case of typing untyped class components, there's almost no difference in approach except for the fact that after declaring the types, you export the extend the type using `class UntypedClassComponent extends React.Component {}` where `UntypedClassComponentProps` holds the type declaration. + +For instance, [sw-yx's Gist on React Router 6 types](https://gist.github.com/sw-yx/37a6a3d248c2d4031801f0d568904df8) implemented a similar method for typing the then untyped RR6. + +```ts +declare module "react-router-dom" { + import * as React from 'react'; + // ... + type NavigateProps = { + to: string | number, + replace?: boolean, + state?: T + } + //... + export class Navigate extends React.Component>{} + // ... +``` -If you're working with untyped class components in React, you can also checkout this [short post](https://templecoding.com/blog/2016/03/31/creating-typescript-typings-for-existing-react-components) as a reference. +For more information on creating type definitions for class components, you can refer to this [post](https://templecoding.com/blog/2016/03/31/creating-typescript-typings-for-existing-react-components) for reference. # Troubleshooting Handbook: Images and other non-TS/TSX files From f5f63ae57b7000dca5b77df50f46504954b4ab48 Mon Sep 17 00:00:00 2001 From: swyx Date: Sat, 8 Aug 2020 00:23:16 +0800 Subject: [PATCH 004/456] Update index.md --- docs/advanced/index.md | 1 + 1 file changed, 1 insertion(+) diff --git a/docs/advanced/index.md b/docs/advanced/index.md index bab17304..870d0563 100644 --- a/docs/advanced/index.md +++ b/docs/advanced/index.md @@ -15,4 +15,5 @@ title: Advanced Cheatsheet The best tool for creating React + TS libraries right now is [`tsdx`](https://github.com/palmerhq/tsdx). Run `npx tsdx create` and select the "react" option. You can view [the React User Guide](https://github.com/palmerhq/tsdx/issues/5) for a few tips on React+TS library best practices and optimizations for production. - Be sure to also check [`basarat`'s guide](https://basarat.gitbooks.io/typescript/content/docs/quick/library.html) for library tsconfig settings. +- Alec Larson: [The best Rollup config for TypeScript libraries](https://gist.github.com/aleclarson/9900ed2a9a3119d865286b218e14d226) - From the Angular world, check out https://github.com/bitjson/typescript-starter From c7b351a7b08d37e5e29d4c42b61d12a6462a3d88 Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Sat, 8 Aug 2020 00:24:12 +0000 Subject: [PATCH 005/456] Bump prismjs from 1.20.0 to 1.21.0 in /website (#261) --- website/yarn.lock | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/website/yarn.lock b/website/yarn.lock index d84d2a41..bc17784b 100644 --- a/website/yarn.lock +++ b/website/yarn.lock @@ -7665,9 +7665,9 @@ prism-react-renderer@^1.1.0: integrity sha512-MgMhSdHuHymNRqD6KM3eGS0PNqgK9q4QF5P0yoQQvpB6jNjeSAi3jcSAz0Sua/t9fa4xDOMar9HJbLa08gl9ug== prismjs@^1.20.0: - version "1.20.0" - resolved "https://registry.yarnpkg.com/prismjs/-/prismjs-1.20.0.tgz#9b685fc480a3514ee7198eac6a3bf5024319ff03" - integrity sha512-AEDjSrVNkynnw6A+B1DsFkd6AVdTnp+/WoUixFRULlCLZVRZlVQMVWio/16jv7G1FscUxQxOQhWwApgbnxr6kQ== + version "1.21.0" + resolved "https://registry.yarnpkg.com/prismjs/-/prismjs-1.21.0.tgz#36c086ec36b45319ec4218ee164c110f9fc015a3" + integrity sha512-uGdSIu1nk3kej2iZsLyDoJ7e9bnPzIgY0naW/HdknGj61zScaprVEVGHrPoXqI+M9sP0NDnTK2jpkvmldpuqDw== optionalDependencies: clipboard "^2.0.0" From a2f739a546f7ec26c796167aa7a14f79551aa068 Mon Sep 17 00:00:00 2001 From: swyx Date: Mon, 10 Aug 2020 19:56:37 +0800 Subject: [PATCH 006/456] Update other-resources.md --- docs/basic/recommended/other-resources.md | 1 + 1 file changed, 1 insertion(+) diff --git a/docs/basic/recommended/other-resources.md b/docs/basic/recommended/other-resources.md index 7c2e153f..b91f8a06 100644 --- a/docs/basic/recommended/other-resources.md +++ b/docs/basic/recommended/other-resources.md @@ -5,6 +5,7 @@ sidebar_label: Other resources --- - me! +- https://www.freecodecamp.org/news/how-to-build-a-todo-app-with-react-typescript-nodejs-and-mongodb/ - - **HIGHLY HIGHLY RECOMMENDED**, i wrote this repo before knowing about this one, this has a lot of stuff I don't cover, including **REDUX** and **JEST**. - [Ultimate React Component Patterns with TypeScript 2.8](https://levelup.gitconnected.com/ultimate-react-component-patterns-with-typescript-2-8-82990c516935) - [Basarat's TypeScript gitbook has a React section](https://basarat.gitbook.io/typescript/tsx/react) with an [Egghead.io course](https://egghead.io/courses/use-typescript-to-develop-react-applications) as well. From 39eba7881f709ba9075bfd3b8eff4950c1899b87 Mon Sep 17 00:00:00 2001 From: jlei523 Date: Tue, 11 Aug 2020 20:35:11 +0700 Subject: [PATCH 007/456] Clarify how to type the dispatch function from useReducer (#263) --- README.md | 11 +++++++++++ 1 file changed, 11 insertions(+) diff --git a/README.md b/README.md index 6f94bfbd..c1b2bc7e 100644 --- a/README.md +++ b/README.md @@ -338,6 +338,17 @@ export function reducer(state: AppState, action: Action): AppState { } ``` +Setting the type for `dispatch` function: + +```jsx +import { Dispatch } from "react"; +import { Action } from "./reducer"; + +const handleClick = (dispatch: Dispatch) => { + dispatch({ type: "SET_ONE", payload: "some string" }); +}; +``` + [View in the TypeScript Playground](https://www.typescriptlang.org/play/?jsx=2#code/C4TwDgpgBAgmYGVgENjQLxQN4F8CwAUKJLAMbACWA9gHZTqFRQA+2UxEAXFAEQICiAFQD6AeQBy-HgG4oYZCAA2VZABNuAZ2AAnCjQDmUfASass7cF14CRggOqiZchcrXcaAVwC2AIwjajaUJCCAAPMCptYCgAMw8acmo6bQhVD1J-AAotVCs4RBQ0ABooZETabhhymgBKSvgkXOxGKA0AdwpgUgALKEyyyloAOg4a5pMmKFJkDWg+ITFJHk4WyagU4A9tOixVtaghw5zivbXaKwGkofklFVUoAHoHqAADG9dVF6gKDVadPX0p0Ce2ms2sC3sjhWEzWGy2OyBTEOQ2OECKiPYbSo3Euw3ed0ezzeLjuXx+UE8vn8QJwQRhUFUEBiyA8imA0P26wgm22f1ydKYxhwQA) **Custom Hooks** From 843200836b168332d31e3c991a883d49dbcaf3f8 Mon Sep 17 00:00:00 2001 From: swyx Date: Tue, 11 Aug 2020 21:37:09 +0800 Subject: [PATCH 008/456] temporarily disable danger spellcheck until we can figure out our own settings --- dangerfile.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/dangerfile.js b/dangerfile.js index 61a68420..8a24840f 100644 --- a/dangerfile.js +++ b/dangerfile.js @@ -13,8 +13,11 @@ edited.forEach((file) => { } }); +/* +// Spellcheck would be nice but this is a little too eager // Spell check all the things spellcheck({ - settings: "artsy/peril-settings@spellcheck.json", + settings: "artsy/peril-settings@spellcheck.json", // need to customize someday codeSpellCheck: ["website/**/*.js"], }); +*/ From 8dcfe667d3f00a25a4c675d485824a38dd4bc66a Mon Sep 17 00:00:00 2001 From: swyx Date: Mon, 17 Aug 2020 02:51:44 +0800 Subject: [PATCH 009/456] wow this spellcheck is so brittle --- dangerfile.js | 6 +----- 1 file changed, 1 insertion(+), 5 deletions(-) diff --git a/dangerfile.js b/dangerfile.js index 8a24840f..facae35f 100644 --- a/dangerfile.js +++ b/dangerfile.js @@ -15,9 +15,5 @@ edited.forEach((file) => { /* // Spellcheck would be nice but this is a little too eager -// Spell check all the things -spellcheck({ - settings: "artsy/peril-settings@spellcheck.json", // need to customize someday - codeSpellCheck: ["website/**/*.js"], -}); +// TODO: add back spellcheck? https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/commit/843200836b168332d31e3c991a883d49dbcaf3f8 */ From 20d59a6f2f9cdfb0a16df1fe3f5a9021214d9907 Mon Sep 17 00:00:00 2001 From: swyx Date: Mon, 17 Aug 2020 06:10:59 +0800 Subject: [PATCH 010/456] add recursive conditional types --- docs/advanced/patterns.md | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/docs/advanced/patterns.md b/docs/advanced/patterns.md index 41feb55f..15729e7f 100644 --- a/docs/advanced/patterns.md +++ b/docs/advanced/patterns.md @@ -422,6 +422,10 @@ You can [convert these in bulk](https://github.com/microsoft/TypeScript/pull/374 - [Variadic Tuple Types](https://devblogs.microsoft.com/typescript/announcing-typescript-4-0-beta/#variadic-tuple-types) - useful for [simplified Reducer-like State](https://www.reddit.com/r/reactjs/comments/hu0ytg/simplified_reducerlike_state_using_typescript_40/) + +Possibly in 4.1 + +- [Recursive Conditional Types](https://github.com/microsoft/TypeScript/pull/40002) ## TypeScript Roadmap and Spec From 1b352c3de349ea6e594bd0114014832790a652a0 Mon Sep 17 00:00:00 2001 From: swyx Date: Mon, 17 Aug 2020 17:17:21 +0800 Subject: [PATCH 011/456] add more notes on @types/react exports (#266) Co-authored-by: Sebastian Silbermann --- docs/advanced/types-react-ap.md | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/docs/advanced/types-react-ap.md b/docs/advanced/types-react-ap.md index 41af4d97..1bd8e231 100644 --- a/docs/advanced/types-react-ap.md +++ b/docs/advanced/types-react-ap.md @@ -29,6 +29,7 @@ Not Commonly Used but Good to know - `Ref` - used to type `innerRef` - `ElementType` - used for higher order components or operations on components +- `ReactElement` - [can be used if you want to pass it to `cloneElement`](https://www.reddit.com/r/reactjs/comments/ia8sdi/any_other_typescript_users_constantly_confused/g1npahe/) aka it's pretty rarely used - `ComponentType` - used for higher order components where you don't specifically deal with the intrinsic components - `ReactPortal` - used if you specifically need to type a prop as a portal, otherwise it is part of `ReactNode` - `ComponentClass` - a complete interface for the produced constructor function of a class declaration that extends `Component`, often used to type external components instead of typing your own @@ -42,7 +43,7 @@ Not Commonly Used but Good to know **Namespace: JSX** -- `Element` - the type of any JSX expression +- `Element` - the type of any JSX expression. You should ideally never need to see or use this, but you do because of [a limitation of TypeScript](https://github.com/microsoft/TypeScript/issues/21699). - `LibraryManagedAttributes` - It specifies other places where JSX elements can declare and initialize property types. Used to resolve static `defaultProps` and `propTypes` with the internal props type of a component. - `IntrinsicElements` - every possible built-in component that can be typed in as a lowercase tag name in JSX From b90afef4a69a212789b54ee288b76df727b1b562 Mon Sep 17 00:00:00 2001 From: swyx Date: Mon, 17 Aug 2020 17:18:08 +0800 Subject: [PATCH 012/456] fix format --- docs/advanced/patterns.md | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/docs/advanced/patterns.md b/docs/advanced/patterns.md index 15729e7f..ca8817fd 100644 --- a/docs/advanced/patterns.md +++ b/docs/advanced/patterns.md @@ -421,8 +421,9 @@ You can [convert these in bulk](https://github.com/microsoft/TypeScript/pull/374 [[Release Candidate](https://devblogs.microsoft.com/typescript/announcing-typescript-4-0-beta/#variadic-tuple-types)] - [Variadic Tuple Types](https://devblogs.microsoft.com/typescript/announcing-typescript-4-0-beta/#variadic-tuple-types) + - useful for [simplified Reducer-like State](https://www.reddit.com/r/reactjs/comments/hu0ytg/simplified_reducerlike_state_using_typescript_40/) - + Possibly in 4.1 - [Recursive Conditional Types](https://github.com/microsoft/TypeScript/pull/40002) From e7973ed306a66fe7321a468df36213166d35e1b1 Mon Sep 17 00:00:00 2001 From: Arvind Srinivasan Date: Mon, 17 Aug 2020 18:56:32 +0530 Subject: [PATCH 013/456] Automate basic documentation in README.md (#264) Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> Co-authored-by: swyx --- .github/workflows/readme.js.yml | 28 +++ .gitignore | 1 + README.md | 416 +++++++++++++++++++++++++++++--- docs/basic/recommended/talks.md | 1 + genReadme.js | 299 +++++++++++++++++++++++ package.json | 7 + yarn.lock | 222 ++++++++++++++++- 7 files changed, 927 insertions(+), 47 deletions(-) create mode 100644 .github/workflows/readme.js.yml create mode 100644 genReadme.js diff --git a/.github/workflows/readme.js.yml b/.github/workflows/readme.js.yml new file mode 100644 index 00000000..1fe4348d --- /dev/null +++ b/.github/workflows/readme.js.yml @@ -0,0 +1,28 @@ +name: Generate README +on: + pull_request: + paths: 'docs/basic/*' + branches: [master] + push: + paths: 'docs/basic/*' + branches: [master] +jobs: + build: + runs-on: ubuntu-latest + steps: + - uses: actions/checkout@v2 + - uses: franzdiebold/github-env-vars-action@v1.0.0 + + - name: Setup Node.js Environment + uses: actions/setup-node@v1 + + - name: Install dependencies + run: npm i + + - name: Generate README from /docs/basic + run: npm run gen-readme --if-present + env: + ENV_GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} + + - name: Format README + run: npm run format-readme diff --git a/.gitignore b/.gitignore index cb109043..36df2864 100644 --- a/.gitignore +++ b/.gitignore @@ -119,6 +119,7 @@ dist # Miscellaneous .history +.DS_Store # Docusaurus files website/build diff --git a/README.md b/README.md index c1b2bc7e..5684e950 100644 --- a/README.md +++ b/README.md @@ -25,7 +25,7 @@
-:wave: This repo is maintained by [@swyx](https://twitter.com/swyx), [@ferdaber](https://twitter.com/ferdaber), [@eps1lon](https://twitter.com/sebsilbermann), [@IslamAttrash](https://twitter.com/IslamAttrash), and [@jsjoeio](https://twitter.com/jsjoeio), we're so happy you want to try out TypeScript with React! If you see anything wrong or missing, please [file an issue](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/issues/new/choose)! :+1: +:wave: This repo is maintained by [@swyx](https://twitter.com/swyx), [@ferdaber](https://twitter.com/ferdaber), [@eps1lon](https://twitter.com/sebsilbermann), [@IslamAttrash](https://twitter.com/IslamAttrash), [@jsjoeio](https://twitter.com/jsjoeio) and [@arvindcheenu](https://twitter.com/arvincheenu), we're so happy you want to try out TypeScript with React! If you see anything wrong or missing, please [file an issue](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/issues/new/choose)! :+1:
@@ -61,9 +61,10 @@ Expand Table of Contents - [Section 1: Setup](#section-1-setup) - - [Prerequisites](#prerequisites) - - [React + TypeScript Starter Kits](#react--typescript-starter-kits) - - [Import React](#import-react) + + - [Prerequisites](#prerequisites) + - [React + TypeScript Starter Kits](#react--typescript-starter-kits) + - [Import React](#import-react) - [Section 2: Getting Started](#section-2-getting-started) - [Function Components](#function-components) - [Hooks](#hooks) @@ -80,37 +81,42 @@ - [Error Boundaries](#error-boundaries) - [Concurrent React/React Suspense](#concurrent-reactreact-suspense) - [Basic Troubleshooting Handbook: Types](#basic-troubleshooting-handbook-types) - - [Union Types and Type Guarding](#union-types-and-type-guarding) - - [Optional Types](#optional-types) - - [Enum Types](#enum-types) - - [Type Assertion](#type-assertion) - - [Intersection Types](#intersection-types) - - [Using Inferred Types](#using-inferred-types) - - [Using Partial Types](#using-partial-types) - - [The Types I need Weren't Exported!](#the-types-i-need-werent-exported) - - [The Types I need Don't Exist!](#the-types-i-need-dont-exist) + + - [Union Types and Type Guarding](#union-types-and-type-guarding) + - [Optional Types](#optional-types) + - [Enum Types](#enum-types) + - [Type Assertion](#type-assertion) + - [Simulating Nominal Types](#simulating-nominal-types) + - [Intersection Types](#intersection-types) + - [Union Types](#union-types) + - [Overloading Function Types](#overloading-function-types) + - [Using Inferred Types](#using-inferred-types) + - [Using Partial Types](#using-partial-types) + - [The Types I need weren't exported!](#the-types-i-need-werent-exported) + - [The Types I need Don't Exist!](#the-types-i-need-dont-exist) - [Troubleshooting Handbook: Operators](#troubleshooting-handbook-operators) - [Troubleshooting Handbook: Utilties](#troubleshooting-handbook-utilities) - [Troubleshooting Handbook: tsconfig.json](#troubleshooting-handbook-tsconfigjson) - [Troubleshooting Handbook: Bugs in official typings](#troubleshooting-handbook-bugs-in-official-typings) - [Recommended React + TypeScript codebases to learn from](#recommended-react--typescript-codebases-to-learn-from) -- [Recommended React + TypeScript talks](#recommended-react--typescript-talks) - [Editor Tooling and Integration](#editor-tooling-and-integration) - [Linting](#linting) - [Other React + TypeScript resources](#other-react--typescript-resources) +- [Recommended React + TypeScript talks](#recommended-react--typescript-talks) - [Time to Really Learn TypeScript](#time-to-really-learn-typescript) - [Example App](#example-app) - [My question isn't answered here!](#my-question-isnt-answered-here) + # Section 1: Setup ## Prerequisites -1. Good understanding of [React](https://reactjs.org). -2. Familiarity with [TypeScript Types](https://www.typescriptlang.org/docs/handbook/basic-types.html) ([2ality's guide](http://2ality.com/2018/04/type-notation-typescript.html) is helpful. If you’re an absolute beginner in TypeScript, check out [chibicode’s tutorial](https://ts.chibicode.com/todo/).) -3. Having read [the TypeScript section in the official React docs](https://reactjs.org/docs/static-type-checking.html#typescript). -4. Having read [the React section of the new TypeScript playground](http://www.typescriptlang.org/play/index.html?jsx=2&esModuleInterop=true&e=181#example/typescript-with-react) (optional: also step through the 40+ examples under [the playground's](http://www.typescriptlang.org/play/index.html) Examples section). +1. good understanding of [React](https://reactjs.org) +2. familiarity with [TypeScript Types](https://www.typescriptlang.org/docs/handbook/basic-types.html) ([2ality's guide](http://2ality.com/2018/04/type-notation-typescript.html) is helpful. If you’re an absolute beginner in TypeScript, check out [chibicode’s tutorial](https://ts.chibicode.com/todo/).) +3. having read [the TypeScript section in the official React docs](https://reactjs.org/docs/static-type-checking.html#typescript). +4. having read [the React section of the new TypeScript playground](http://www.typescriptlang.org/play/index.html?jsx=2&esModuleInterop=true&e=181#example/typescript-with-react) (optional: also step through the 40+ examples under [the playground's](http://www.typescriptlang.org/play/index.html) Examples section) This guide will always assume you are starting with the latest TypeScript version. Notes for older versions will be in expandable `
` tags. @@ -145,12 +151,15 @@ import ReactDOM from "react-dom"; Why `allowSyntheticDefaultImports` over `esModuleInterop`? [Daniel Rosenwasser](https://twitter.com/drosenwasser/status/1003097042653073408) has said that it's better for webpack/parcel. For more discussion check out -You should also check [the TypeScript docs for official descriptions of each compiler flag](https://www.typescriptlang.org/tsconfig#allowSyntheticDefaultImports)! +You should also check [the new TypeScript docs for official descriptions between each compiler flag](https://www.typescriptlang.org/v2/en/tsconfig#allowSyntheticDefaultImports)!
+ + # Section 2: Getting Started + ## Function Components These can be written as normal functions that take a `props` argument and return a JSX element. @@ -227,6 +236,9 @@ const MyArrayComponent = () => (Array(5).fill(
) as any) as JSX.Element; + + + ## Hooks Hooks are [supported in `@types/react` from v16.8 up](https://github.com/DefinitelyTyped/DefinitelyTyped/blob/a05cc538a42243c632f054e42eab483ebf1560ab/types/react/index.d.ts#L800-L1031). @@ -261,6 +273,23 @@ const ref2 = useRef(null); The first option will make `ref1.current` read-only, and is intended to be passed in to built-in `ref` attributes that React will manage (because React handles setting the `current` value for you). +
+ What is the ! at the end of null!? + +`null!` is a non-null assertion operator (the `!`). It asserts that any expression before it is not `null` or `undefined`, so if you have `useRef(null!)` it means that you're instantiating the ref with a current value of `null` but lying to TypeScript that it's not `null`. + +```ts +function MyComponent() { + const ref1 = useRef(null!); + useEffect(() => { + doSomethingWith(ref1.current); // TypeScript won't require null-check e.g. ref1 && ref1.current + }); + return
etc
; +} +``` + +
+ The second option will make `ref2.current` mutable, and is intended for "instance variables" that you manage yourself. **useEffect** @@ -317,7 +346,7 @@ You can use [Discriminated Unions](https://www.typescriptlang.org/docs/handbook/ ```tsx type AppState = {}; type Action = - | { type: "SET_ONE"; payload: string } + | { type: "SET_ONE"; payload: string } // typescript union types allow for leading |'s to have nicer layout | { type: "SET_TWO"; payload: number }; export function reducer(state: AppState, action: Action): AppState { @@ -351,6 +380,22 @@ const handleClick = (dispatch: Dispatch) => { [View in the TypeScript Playground](https://www.typescriptlang.org/play/?jsx=2#code/C4TwDgpgBAgmYGVgENjQLxQN4F8CwAUKJLAMbACWA9gHZTqFRQA+2UxEAXFAEQICiAFQD6AeQBy-HgG4oYZCAA2VZABNuAZ2AAnCjQDmUfASass7cF14CRggOqiZchcrXcaAVwC2AIwjajaUJCCAAPMCptYCgAMw8acmo6bQhVD1J-AAotVCs4RBQ0ABooZETabhhymgBKSvgkXOxGKA0AdwpgUgALKEyyyloAOg4a5pMmKFJkDWg+ITFJHk4WyagU4A9tOixVtaghw5zivbXaKwGkofklFVUoAHoHqAADG9dVF6gKDVadPX0p0Ce2ms2sC3sjhWEzWGy2OyBTEOQ2OECKiPYbSo3Euw3ed0ezzeLjuXx+UE8vn8QJwQRhUFUEBiyA8imA0P26wgm22f1ydKYxhwQA) +
+ +Usage with `Reducer` from `redux` + +In case you use the [redux](https://github.com/reduxjs/redux) library to write reducer function, It provides a convenient helper of the format `Reducer` which takes care of the return type for you. + +So the above reducer example becomes: + +```tsx +import { Reducer } from 'redux'; + +export function reducer: Reducer() {} +``` + +
+ **Custom Hooks** If you are returning an array in your Custom Hook, you will want to avoid type inference as TypeScript will infer a union type (when you actually want different types in each position of the array). Instead, use [TS 3.4 const assertions](https://devblogs.microsoft.com/typescript/announcing-typescript-3-4/#const-assertions): @@ -428,6 +473,9 @@ Example React Hooks + TypeScript Libraries: [Something to add? File an issue](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/issues/new). + + + ## Class Components Within TypeScript, `React.Component` is a generic type (aka `React.Component`), so you want to provide it with (optional) prop and state type parameters: @@ -460,7 +508,7 @@ class App extends React.Component { Don't forget that you can export/import/extend these types/interfaces for reuse.
-Why annotate `state` twice? +Why annotate state twice? It isn't strictly necessary to annotate the `state` class property, but it allows better type inference when accessing `this.state` and also initializing the state. @@ -535,6 +583,9 @@ class App extends React.Component<{ [Something to add? File an issue](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/issues/new). + + + ## Typing defaultProps For TypeScript 3.0+, type inference [should work](https://www.typescriptlang.org/docs/handbook/release-notes/typescript-3-0.html), although [some edge cases are still problematic](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/issues/61). Just type your props like normal, except don't use `React.FC`. @@ -543,12 +594,12 @@ For TypeScript 3.0+, type inference [should work](https://www.typescriptlang.org // //////////////// // function components // //////////////// -type Props = { age: number } & typeof defaultProps; +type GreetProps = { age: number } & typeof defaultProps; const defaultProps = { - who: "Johny Five", + age: 21, }; -const Greet = (props: Props) => { +const Greet = (props: GreetProps) => { /*...*/ }; Greet.defaultProps = defaultProps; @@ -563,7 +614,7 @@ type GreetProps = typeof Greet.defaultProps & { class Greet extends React.Component { static defaultProps = { - name: "world", + age: 21, }; /*...*/ } @@ -572,6 +623,44 @@ class Greet extends React.Component { let el = ; ``` +
+ An alternative approach + +As per [this tweet](https://twitter.com/dan_abramov/status/1133878326358171650), defaultProps will eventually be deprecated. You can check the discussions here: + +- https://twitter.com/hswolff/status/1133759319571345408 + +The consensus is to use object default values. + +```tsx +// //////////////// +// function components +// //////////////// +type GreetProps = { age: number }; + +const Greet = ({ age = 21 }: GreetProps) => { + /*...*/ +}; +``` + +```tsx +// //////////////// +// class components +// //////////////// +type GreetProps = { + age: number; +}; + +class Greet extends React.Component { + const { age = 21 } = this.props + /*...*/ +} + +let el = ; +``` + +
+
Why does React.FC break defaultProps? @@ -625,13 +714,18 @@ The problem with this approach is it causes complex issues with the type inferen [Something to add? File an issue](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/issues/new). + + + ## Types or Interfaces? `interface`s are different from `type`s in TypeScript, but they can be used for very similar things as far as common React uses cases are concerned. Here's a helpful rule of thumb: -- Always use `interface` for public API's definition when authoring a library or 3rd party ambient type definitions. +- always use `interface` for public API's definition when authoring a library or 3rd party ambient type definitions, as this allows a consumer to extend them via _declaration merging_ if some definitions are missing. -- Consider using `type` for your React Component Props and State, because it is more constrained. +- consider using `type` for your React Component Props and State, for consistency and because it is more constrained. + +You can read more about the reasoning behind this rule of thumb in [Interface vs Type alias in TypeScript 2.7](https://medium.com/@martin_hotell/interface-vs-type-alias-in-typescript-2-7-2a8f1777af4c). Types are useful for union types (e.g. `type MyType = TypeA | TypeB`) whereas Interfaces are better for declaring dictionary shapes and then `implementing` or `extending` them. @@ -647,6 +741,9 @@ It's a nuanced topic, don't get too hung up on it. Here's a handy graphic: [Something to add? File an issue](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/issues/new). + + + ## Basic Prop Types Examples ```tsx @@ -686,6 +783,9 @@ type AppProps = { Notice we have used the TSDoc `/** comment */` style here on each prop. You can and are encouraged to leave descriptive comments on reusable components. For a fuller example and discussion, see our [Commenting Components](/ADVANCED.md#commenting-components) section in the Advanced Cheatsheet. + + + ## Useful React Prop Type Examples ```tsx @@ -709,12 +809,16 @@ Quote [@ferdaber](https://github.com/typescript-cheatsheets/react-typescript-che - `JSX.Element` -> Return value of `React.createElement` - `React.ReactNode` -> Return value of a component -
+ +
[More discussion: Where ReactNode does not overlap with JSX.Element](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/issues/129) [Something to add? File an issue](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/issues/new). + + + ## getDerivedStateFromProps Before you start using `getDerivedStateFromProps`, please go through the [documentation](https://reactjs.org/docs/react-component.html#static-getderivedstatefromprops) and [You Probably Don't Need Derived State](https://reactjs.org/blog/2018/06/07/you-probably-dont-need-derived-state.html). Derived State can be easily achieved using hooks which can also help set up memoization easily. @@ -779,6 +883,9 @@ class Comp extends React.PureComponent { [View in the TypeScript Playground](https://www.typescriptlang.org/play/?jsx=2#code/JYWwDg9gTgLgBAJQKYEMDG8BmUIjgcilQ3wFgAoUSWOYAZwFEBHAVxQBs5tcD2IATFHQAWAOnpJWHMuQowAnmCRwAwizoxcANQ4tlAXjgoAdvIDcFYMZhIomdMoAKOMHTgBvCnDhgXAQQAuVXVNEB12PQtyAF9La1t7NGUAESRMKyR+AGUYFBsPLzgIGGFbHLykADFgJHZ+II0oKwBzKNjyBSU4cvzDVPTjTJ7lADJEJBgWKGMAFUUkAB5OpAhMOBgoEzpMaBBnCFcZiGGAPijMFmMMYAhjdc3jbd39w+PcmwAKXwO6IJe6ACUBXI3iIk2mwO83joKAAbpkXoEfC46KJvmA-AAaOAAehxcBh8K40DgICQIAgwAAXnkbsZCt5+LZgPDsu8kEF0aj0X5CtE2hQ0OwhG4VLgwHAkAAPGzGfhuZDoGCiRxTJBi8C3JDWBb-bGnSFwNC3RosDDQL4ov4ooGeEFQugsJRQS0-AFRKHrYT0UQaCpwQx2z3eYqlKDDaq1epwABEAEYAEwAZhjmIZUNEmY2Wx2UD2KKOw1drgB6f5fMKfpgwDQcGaE1STVZEZw+Z+xd+cD1BPZQWGtvTwDWH3ozDY7A7aP82KrSF9cIR-gBQLBUzuxhY7HYHqhq4h2ceubbryLXPdFZiQA) + + + ## Forms and Events If performance is not an issue, inlining handlers is easiest as you can just use [type inference and contextual typing](https://www.typescriptlang.org/docs/handbook/type-inference.html#contextual-typing): @@ -880,9 +987,24 @@ If you don't quite care about the type of the event, you can just use React.Synt Of course, if you're making any sort of significant form, [you should use Formik](https://jaredpalmer.com/formik), which is written in TypeScript. + + + ## Context -You can use the `useContext` API in mostly the same way you would in JavaScript, but it takes a bit of boilerplate out of the box under TypeScript's `strictNullChecks` mode. Here's the most basic example: +Using `React.createContext` with an empty object as default value. + +```tsx +interface ContextState { + // set the type of state you want to handle with context e.g. + name: string | null; +} +//set an empty object as default state +const Context = React.createContext({} as ContextState); +// set up context provider as you normally would in JavaScript [React Context API](https://reactjs.org/docs/context.html#api) +``` + +Using `React.createContext` and [context getters](https://kentcdodds.com/blog/application-state-management-with-react/) to make a `createCtx` with **no `defaultValue`, yet no need to check for `undefined`**: ```ts import * as React from "react"; @@ -1103,6 +1225,9 @@ const Consumer = Context.Consumer; [Something to add? File an issue](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/issues/new). + + + ## forwardRef/createRef Check the [Hooks section](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/blob/master/README.md#hooks) for `useRef`. @@ -1138,6 +1263,9 @@ You may also wish to do [Conditional Rendering with `forwardRef`](https://github [Something to add? File an issue](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/issues/new). + + + ## Portals Using `ReactDOM.createPortal`: @@ -1173,19 +1301,28 @@ This example is based on the [Event Bubbling Through Portal](https://reactjs.org + + + ## Error Boundaries _Not written yet._ [Something to add? File an issue](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/issues/new). + + + ## Concurrent React/React Suspense _Not written yet._ watch for more on React Suspense and Time Slicing. [Something to add? File an issue](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/issues/new). -# Basic Troubleshooting Handbook: Types + + + +# Troubleshooting Handbook: Types > ⚠️ Have you read [the TypeScript FAQ](https://github.com/microsoft/TypeScript/wiki/FAQ)?) Your answer might be there! @@ -1549,7 +1686,7 @@ let baz2: SubIsntType2 = { ``` - TS also ships with a `Parameters` utility type for extracting the parameters of a function -- for anything more "custom", the `infer` keyword is the basic building block for this, but takes a bit of getting used to. Look at the source code for the above utility types, and [this example](https://twitter.com/mgechev/status/1211030455224422401?s=20) to get the idea. +- for anything more "custom", the `infer` keyword is the basic building block for this, but takes a bit of getting used to. Look at the source code for the above utility types, and [this example](https://twitter.com/mgechev/status/1211030455224422401?s=20) to get the idea. Basarat [also has a good video on `infer`](https://www.youtube.com/watch?v=ijK-1R-LFII&list=PLYvdvJlnTOjF6aJsWWAt7kZRJvzw-en8B&index=3&t=0s). ## The Types I need don't exist! @@ -1710,21 +1847,168 @@ For more information on creating type definitions for class components, you can # Troubleshooting Handbook: Images and other non-TS/TSX files -Use [declaration merging](https://www.typescriptlang.org/docs/handbook/declaration-merging.html): +What's more annoying than modules with unexported types? Modules that are **untyped**! + +Fret not! There are more than a couple of ways in which you can solve this problem. + +A **lazier** way would be to create a new type declaration file, say `typedec.d.ts`– if you don't already have one. Ensure that the path to file is resolvable by TypeScript by checking the `include` array in the `tsconfig.json` file at the root of your directory. + +```json +// inside tsconfig.json +{ + // ... + "include": [ + "src" // automatically resolves if the path to declaration is src/typedec.d.ts + ] + // ... +} +``` + +Within this file, add the `declare` syntax for your desired module, say `my-untyped-module`– to the declaration file: ```ts -// declaration.d.ts -// anywhere in your project, NOT the same name as any of your .ts/tsx files -declare module "*.png"; +// inside typedec.d.ts +declare module "my-untyped-module"; +``` -// importing in a tsx file -import * as logo from "./logo.png"; +This one-liner alone is enough if you just need it to work without errors. A even hackier, write-once-and-forget way would be to use `"*"` instead which would then apply the `Any` type for all existing and future untyped modules. + +This solution works well as a workaround if you have less than a couple untyped modules. Anything more, you now have a ticking type-bomb in your hands. The only way of circumventing this problem would be to define the missing types for those untyped modules as explained in the following sections. + +### Typing Exported Hooks + +Typing Hooks is just like typing pure functions. + +The following steps work under two assumptions: + +- You have already created a type declaration file as stated earlier in the section. +- You have access to the source code - specifically the code that directly exports the functions you will be using. In most cases, it would be housed in an `index.js` file. + Typically you need a minimum of **two** type declarations (one for **Input Prop** and the other for **Return Prop**) to define a hook completely. Suppose the hook you wish to type follows the following structure, + +```js +// ... +const useUntypedHook = (prop) => { + // some processing happens here + return { + /* ReturnProps */ + }; +}; +export default useUntypedHook; ``` -Note that `tsc` cannot bundle these files for you, you will have to use Webpack or Parcel. +then, your type declaration should most likely follow the following syntax. -Related issue: https://github.com/Microsoft/TypeScript-React-Starter/issues/12 and [StackOverflow](https://stackoverflow.com/a/49715468/4216035) +```ts +declare module 'use-untyped-hook' { + export interface InputProps { ... } // type declaration for prop + export interface ReturnProps { ... } // type declaration for return props + export default function useUntypedHook( + prop: InputProps + // ... + ): ReturnProps; +} +``` + +
+ + +For instance, the [useDarkMode hook](https://github.com/donavon/use-dark-mode) exports the functions that follows a similar structure. + + + +```js +// inside src/index.js +const useDarkMode = ( + initialValue = false, // -> input props / config props to be exported + { + // -> input props / config props to be exported + element, + classNameDark, + classNameLight, + onChange, + storageKey = "darkMode", + storageProvider, + global, + } = {} +) => { + // ... + return { + // -> return props to be exported + value: state, + enable: useCallback(() => setState(true), [setState]), + disable: useCallback(() => setState(false), [setState]), + toggle: useCallback(() => setState((current) => !current), [setState]), + }; +}; +export default useDarkMode; +``` + +As the comments suggest, exporting these config props and return props following the aforementioned structure will result in the following type export. + +```ts +declare module "use-dark-mode" { + /** + * A config object allowing you to specify certain aspects of `useDarkMode` + */ + export interface DarkModeConfig { + classNameDark?: string; // A className to set "dark mode". Default = "dark-mode". + classNameLight?: string; // A className to set "light mode". Default = "light-mode". + element?: HTMLElement; // The element to apply the className. Default = `document.body` + onChange?: (val?: boolean) => void; // Overide the default className handler with a custom callback. + storageKey?: string; // Specify the `localStorage` key. Default = "darkMode". Set to `null` to disable persistent storage. + storageProvider?: WindowLocalStorage; // A storage provider. Default = `localStorage`. + global?: Window; // The global object. Default = `window`. + } + /** + * An object returned from a call to `useDarkMode`. + */ + export interface DarkMode { + readonly value: boolean; + enable: () => void; + disable: () => void; + toggle: () => void; + } + /** + * A custom React Hook to help you implement a "dark mode" component for your application. + */ + export default function useDarkMode( + initialState?: boolean, + config?: DarkModeConfig + ): DarkMode; +} +``` + +
+ +### Typing Exported Components + +In case of typing untyped class components, there's almost no difference in approach except for the fact that after declaring the types, you export the extend the type using `class UntypedClassComponent extends React.Component {}` where `UntypedClassComponentProps` holds the type declaration. + +For instance, [sw-yx's Gist on React Router 6 types](https://gist.github.com/sw-yx/37a6a3d248c2d4031801f0d568904df8) implemented a similar method for typing the then untyped RR6. + +```ts +declare module "react-router-dom" { + import * as React from 'react'; + // ... + type NavigateProps = { + to: string | number, + replace?: boolean, + state?: T + } + //... + export class Navigate extends React.Component>{} + // ... +``` + +For more information on creating type definitions for class components, you can refer to this [post](https://templecoding.com/blog/2016/03/31/creating-typescript-typings-for-existing-react-components) for reference. +# Troubleshooting Handbook: Images and other non-TS/TSX files + +Use [declaration merging](https://www.typescriptlang.org/docs/handbook/declaration-merging.html): + + + + # Troubleshooting Handbook: Operators - `typeof` and `instanceof`: type query used for refinement @@ -1742,7 +2026,11 @@ Conditional Types are a difficult topic to get around so here are some extra res - fully walked through explanation https://artsy.github.io/blog/2018/11/21/conditional-types-in-typescript/ - Bailing out and other advanced topics https://github.com/sw-yx/ts-spec/blob/master/conditional-types.md +- Basarat's video https://www.youtube.com/watch?v=SbVgPQDealg&list=PLYvdvJlnTOjF6aJsWWAt7kZRJvzw-en8B&index=2&t=0s + + + # Troubleshooting Handbook: Utilities these are all built in, [see source in es5.d.ts](https://github.com/microsoft/TypeScript/blob/2c458c0d1ccb96442bca9ce43aa987fb0becf8a9/src/lib/es5.d.ts#L1401-L1474): @@ -1763,9 +2051,12 @@ these are all built in, [see source in es5.d.ts](https://github.com/microsoft/Ty This section needs writing, but you can probably find a good starting point with [Wes Bos' ESLint config](https://github.com/wesbos/eslint-config-wesbos) (which comes with a [YouTube intro](https://www.youtube.com/watch?v=lHAeK8t94as)). + + + # Troubleshooting Handbook: tsconfig.json -You can find [all the Compiler options in the TypeScript docs](https://www.typescriptlang.org/docs/handbook/compiler-options.html). [The TS docs also has per-flag annotations of what each does](https://www.typescriptlang.org/tsconfig#allowSyntheticDefaultImports). This is the setup I roll with for APPS (not libraries - for libraries you may wish to see the settings we use in `tsdx`): +You can find [all the Compiler options in the TypeScript docs](https://www.typescriptlang.org/docs/handbook/compiler-options.html). [The new TS docs also has per-flag annotations of what each does](https://www.typescriptlang.org/v2/en/tsconfig#allowSyntheticDefaultImports). This is the setup I roll with for APPS (not libraries - for libraries you may wish to see the settings we use in `tsdx`): ```json { @@ -1809,6 +2100,9 @@ Selected flags and why we like them: Compilation speed grows linearly with size of codebase. For large projects, you will want to use [Project References](https://www.typescriptlang.org/docs/handbook/project-references.html). See our [ADVANCED](ADVANCED.md) cheatsheet for commentary. + + + # Troubleshooting Handbook: Bugs in official typings If you run into bugs with your library's official typings, you can copy them locally and tell TypeScript to use your local version using the "paths" field. In your `tsconfig.json`: @@ -1872,6 +2166,29 @@ process = { You can see examples of these included in the built in type declarations in the `lib` field of `tsconfig.json` + + + +# Troubleshooting Handbook: Images and other non-TS/TSX files + +Use [declaration merging](https://www.typescriptlang.org/docs/handbook/declaration-merging.html): + +```ts +// declaration.d.ts +// anywhere in your project, NOT the same name as any of your .ts/tsx files +declare module "*.png"; + +// importing in a tsx file +import * as logo from "./logo.png"; +``` + +Note that `tsc` cannot bundle these files for you, you will have to use Webpack or Parcel. + +Related issue: https://github.com/Microsoft/TypeScript-React-Starter/issues/12 and [StackOverflow](https://stackoverflow.com/a/49715468/4216035) + + + + # Recommended React + TypeScript codebases to learn from - https://github.com/jaredpalmer/formik @@ -1898,6 +2215,9 @@ React Native Boilerplates: _contributed by [@spoeck](https://github.com/typescri - https://github.com/emin93/react-native-template-typescript - + + + # Editor Tooling and Integration - VSCode @@ -1911,6 +2231,9 @@ React Native Boilerplates: _contributed by [@spoeck](https://github.com/typescri - NeoVim: https://github.com/neoclide/coc.nvim - other discussion: https://mobile.twitter.com/ryanflorence/status/1085715595994095620 + + + # Linting > ⚠️Note that [TSLint is now in maintenance and you should try to use ESLint instead](https://medium.com/palantir/tslint-in-2019-1a144c2317a9). If you are interested in TSLint tips, please check this PR from [@azdanov](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/pull/14). The rest of this section just focuses on ESLint. [You can convert TSlint to ESlint with this tool](https://github.com/typescript-eslint/tslint-to-eslint-config). @@ -2014,6 +2337,9 @@ Another great resource is ["Using ESLint and Prettier in a TypeScript Project"]( If you're looking for information on Prettier, check out the [Prettier](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/blob/master/ADVANCED.md#prettier). + + + # Other React + TypeScript resources - me! @@ -2031,11 +2357,16 @@ If you're looking for information on Prettier, check out the [Prettier](https:// - [Microsoft React TypeScript conversion guide](https://github.com/Microsoft/TypeScript-React-Conversion-Guide#typescript-react-conversion-guide) - [You?](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/issues/new). + + + # Recommended React + TypeScript talks - [Ultimate React Component Patterns with TypeScript](https://www.youtube.com/watch?v=_PBQ3if6Fmg), by Martin Hochel, GeeCon Prague 2018 - Please help contribute this new section! + + # Time to Really Learn TypeScript Believe it or not, we have only barely introduced TypeScript here in this cheatsheet. There is a whole world of generic type logic that you will eventually get into, however it becomes far less dealing with React than just getting good at TypeScript so it is out of scope here. But at least you can get productive in React now :) @@ -2049,10 +2380,15 @@ It is worth mentioning some resources to help you get started: - Rares Matei: [Egghead.io course](https://egghead.io/courses/practical-advanced-typescript)'s advanced TypeScript course on Egghead.io is great for newer typescript features and practical type logic applications (e.g. recursively making all properties of a type `readonly`) - Shu Uesugi: [TypeScript for Beginner Programmers](https://ts.chibicode.com/) + + + # Example App - [Create React App TypeScript Todo Example 2020](https://github.com/laststance/create-react-app-typescript-todo-example-2020) + + # My question isn't answered here! - [File an issue](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/issues/new). diff --git a/docs/basic/recommended/talks.md b/docs/basic/recommended/talks.md index 2cdce871..827537b7 100644 --- a/docs/basic/recommended/talks.md +++ b/docs/basic/recommended/talks.md @@ -4,4 +4,5 @@ title: Recommended React + TypeScript talks sidebar_label: Talks --- +- [Ultimate React Component Patterns with TypeScript](https://www.youtube.com/watch?v=_PBQ3if6Fmg), by Martin Hochel, GeeCon Prague 2018 - Please help contribute this new section! diff --git a/genReadme.js b/genReadme.js new file mode 100644 index 00000000..b2cbc5d4 --- /dev/null +++ b/genReadme.js @@ -0,0 +1,299 @@ +const { Octokit } = require("@octokit/rest"); +const Toc = require("markdown-toc"); +const Fm = require("front-matter"); +const octokit = new Octokit({ auth: `token ${process.env.ENV_GITHUB_TOKEN}` }); +const repo_info = process.env.GITHUB_REPOSITORY.split("/"); +const repo_details = { + owner: repo_info[0], + repo: repo_info[1], +}; +const default_options = { + withKey: "title", + withToc: false, + showHeading: true, + headingLevel: 2, + tabLevel: 1, + prefix: "", + suffix: "", +}; +async function getReadme() { + let res = await octokit.repos.getReadme(repo_details); + let encoded = res.data.content; + let decoded = Buffer.from(encoded, "base64").toString("utf8"); + return { + content: decoded, + sha: res.data.sha, + }; +} +(async function main() { + try { + let readme = await getReadme(); + default_options["from"] = readme; + let initialContent = readme.content; + initialContent = await updateSectionWith({ + name: "setup", + path: "docs/basic/setup.md", + to: initialContent, + withToc: true, + headingLevel: 1, + prefix: "Section 1: ", + }); + initialContent = await updateSectionWith({ + name: "function-components", + path: "docs/basic/getting-started/function-components.md", + to: initialContent, + }); + initialContent = await updateSectionWith({ + name: "hooks", + path: "docs/basic/getting-started/hooks.md", + to: initialContent, + }); + initialContent = await updateSectionWith({ + name: "class-components", + path: "docs/basic/getting-started/class-components.md", + to: initialContent, + }); + initialContent = await updateSectionWith({ + name: "default-props", + path: "docs/basic/getting-started/default-props.md", + to: initialContent, + showHeading: false, + }); + initialContent = await updateSectionWith({ + name: "type-or-interface", + path: "docs/basic/getting-started/type-or-inteface.md", + to: initialContent, + }); + initialContent = await updateSectionWith({ + name: "basic-type-examples", + path: "docs/basic/getting-started/basic-type-examples.md", + to: initialContent, + }); + initialContent = await updateSectionWith({ + name: "react-prop-type-examples", + path: "docs/basic/getting-started/react-prop-type-examples.md", + to: initialContent, + }); + initialContent = await updateSectionWith({ + name: "get-derived-state-from-props", + path: "docs/basic/getting-started/get-derived-state-from-props.md", + to: initialContent, + }); + initialContent = await updateSectionWith({ + name: "forms-and-events", + path: "docs/basic/getting-started/forms-and-events.md", + to: initialContent, + }); + initialContent = await updateSectionWith({ + name: "context", + path: "docs/basic/getting-started/context.md", + to: initialContent, + }); + initialContent = await updateSectionWith({ + name: "forward-create-ref", + path: "docs/basic/getting-started/forward-create-ref.md", + to: initialContent, + }); + initialContent = await updateSectionWith({ + name: "portals", + path: "docs/basic/getting-started/portals.md", + to: initialContent, + }); + initialContent = await updateSectionWith({ + name: "error-boundaries", + path: "docs/basic/getting-started/error-boundaries.md", + to: initialContent, + }); + initialContent = await updateSectionWith({ + name: "concurrent", + path: "docs/basic/getting-started/concurrent.md", + to: initialContent, + }); + initialContent = await updateSectionWith({ + name: "types", + path: "docs/basic/troubleshooting/types.md", + to: initialContent, + withToc: true, + headingLevel: 1, + }); + initialContent = await updateSectionWith({ + name: "operators", + path: "docs/basic/troubleshooting/operators.md", + to: initialContent, + headingLevel: 1, + }); + initialContent = await updateSectionWith({ + name: "utilities", + path: "docs/basic/troubleshooting/utilities.md", + to: initialContent, + headingLevel: 1, + }); + initialContent = await updateSectionWith({ + name: "ts-config", + path: "docs/basic/troubleshooting/ts-config.md", + to: initialContent, + headingLevel: 1, + }); + initialContent = await updateSectionWith({ + name: "official-typings-bugs", + path: "docs/basic/troubleshooting/official-typings-bugs.md", + to: initialContent, + headingLevel: 1, + withKey: "sidebar_label", + prefix: "Troubleshooting Handbook: ", + }); + initialContent = await updateSectionWith({ + name: "non-ts-files", + path: "docs/basic/troubleshooting/non-ts-files.md", + to: initialContent, + headingLevel: 1, + }); + initialContent = await updateSectionWith({ + name: "resources", + path: "docs/basic/recommended/resources.md", + to: initialContent, + headingLevel: 1, + }); + initialContent = await updateSectionWith({ + name: "editor-integration", + path: "docs/basic/editor-integration.md", + to: initialContent, + headingLevel: 1, + }); + initialContent = await updateSectionWith({ + name: "linting", + path: "docs/basic/linting.md", + to: initialContent, + headingLevel: 1, + }); + initialContent = await updateSectionWith({ + name: "other-resources", + path: "docs/basic/recommended/other-resources.md", + to: initialContent, + headingLevel: 1, + }); + initialContent = await updateSectionWith({ + name: "talks", + path: "docs/basic/recommended/talks.md", + to: initialContent, + headingLevel: 1, + }); + initialContent = await updateSectionWith({ + name: "learn-ts", + path: "docs/basic/troubleshooting/learn-ts.md", + to: initialContent, + headingLevel: 1, + withKey: "sidebar_label", + }); + initialContent = await updateSectionWith({ + name: "examples", + path: "docs/basic/examples.md", + to: initialContent, + headingLevel: 1, + }); + await octokit.repos.createOrUpdateFile({ + ...repo_details, + content: Buffer.from(initialContent).toString("base64"), + path: "README.md", + message: `Updated README on ${new Date().toISOString()}`, + sha: readme.sha, + branch: "master", + }); + } catch (err) { + console.error( + `🚨 You've encountered a ${err.name} ➜ ${err.message} \n` + + `💡 ProTip ➜ Please ensure your credentials are up-to-date or the path to your file exists.` + ); + } +})(); +async function updateSectionWith(options) { + let update_options = Object.assign({}, { ...default_options }, options); + let md = await readContentFromPath(update_options.path); + let oldFences = getFenceForSection(update_options.from, update_options.name); + let fence_options = { + name: update_options.name, + content: md, + tabLevel: update_options.tabLevel, + headingLevel: update_options.headingLevel, + showHeading: update_options.showHeading, + withKey: update_options.withKey, + prefix: update_options.prefix, + suffix: update_options.suffix, + }; + let newFences = generateContentForSection({ + ...fence_options, + withToc: false, + }); + let oldTocFences = getFenceForSection( + update_options.from, + update_options.name, + (isToc = true) + ); + let newTocFences = generateContentForSection({ + ...fence_options, + withToc: true, + }); + let updatedContents = update_options.to.replace(oldFences.regex, newFences); + updatedContents = updatedContents.replace(oldTocFences.regex, newTocFences); + if (update_options.withToc) + console.log( + `✅ 🗜️ Rewrote Table of Contents for '${md.frontmatter.title}'` + ); + console.log(`✅ 📝 Rewrote Section for '${md.frontmatter.title}'`); + return updatedContents; +} +async function readContentFromPath(relative_path) { + let MdDoc = await octokit.repos.getContents({ + ...repo_details, + path: relative_path, + }); + let MdContent = Fm(Buffer.from(MdDoc.data.content, "base64").toString()); + let TableOfContents = Toc(MdContent.body).content; + return { + frontmatter: MdContent.attributes, + body: MdContent.body, + toc: TableOfContents, + }; +} +function generateContentForSection(options) { + let section_options = Object.assign({}, { ...default_options }, options); + let fence = getFence(section_options.name, section_options.withToc); + let fenceContent = fence.start + "\n"; + if (section_options.withToc) { + let lines = section_options.content.toc.split("\n"); + for (let i = 0, len = lines.length; i < len; i += 1) + fenceContent += + "\t".repeat(section_options.tabLevel) + + lines[i] + + (i !== len - 1 ? "\n" : ""); + } else { + fenceContent += section_options.showHeading + ? `${"#".repeat(section_options.headingLevel)} ` + + section_options.prefix + + section_options.content.frontmatter[section_options.withKey] + + section_options.suffix + + "\n\n" + : ""; + fenceContent += section_options.content.body + "\n"; + } + fenceContent += fence.end; + return fenceContent; +} +function getFenceForSection(readme, sectionName, isToc = false) { + try { + let fence = getFence(sectionName, isToc); + let regex = new RegExp(`(${fence.start}[\\s\\S]+${fence.end})`, "gm"); + return { regex: regex, content: regex.exec(readme.content) }; + } catch (err) { + console.error( + `🚨 You've encountered a ${err.name} ➜ ${err.message} \n` + + `💡 ProTip ➜ Please ensure the comments exist and are separated by a newline.` + ); + } +} +function getFence(sectionName, isToc = false) { + let name = isToc ? sectionName + "-toc" : sectionName; + let START_COMMENT = ""; + let END_COMMENT = ""; + return { start: START_COMMENT, end: END_COMMENT }; +} diff --git a/package.json b/package.json index a770b087..c994fa65 100644 --- a/package.json +++ b/package.json @@ -18,9 +18,16 @@ }, "homepage": "https://github.com/typescript-cheatsheets/react-typescript-cheatsheet#readme", "scripts": { + "format-readme": "prettier --write \"README.md\"", + "gen-readme": "node genReadme.js", "format": "prettier --write \"**/*.md\"", "start": "yarn --cwd website start" }, + "dependencies": { + "@octokit/rest": "^16.43.1", + "front-matter": "^4.0.2", + "markdown-toc": "^1.2.0" + }, "devDependencies": { "danger": "^10.1.1", "danger-plugin-spellcheck": "^1.5.0", diff --git a/yarn.lock b/yarn.lock index c56468ca..3bd20447 100644 --- a/yarn.lock +++ b/yarn.lock @@ -201,6 +201,13 @@ ansi-escapes@^1.1.0: resolved "https://registry.yarnpkg.com/ansi-escapes/-/ansi-escapes-1.4.0.tgz#d3a8a83b319aa67793662b13e761c7911422306e" integrity sha1-06ioOzGapneTZisT52HHkRQiMG4= +ansi-red@^0.1.1: + version "0.1.1" + resolved "https://registry.yarnpkg.com/ansi-red/-/ansi-red-0.1.1.tgz#8c638f9d1080800a353c9c28c8a81ca4705d946c" + integrity sha1-jGOPnRCAgAo1PJwoyKgcpHBdlGw= + dependencies: + ansi-wrap "0.1.0" + ansi-regex@^2.0.0: version "2.1.1" resolved "https://registry.yarnpkg.com/ansi-regex/-/ansi-regex-2.1.1.tgz#c3b33ab5ee360d86e0e628f0468ae7ef27d654df" @@ -226,7 +233,12 @@ ansi-styles@^4.1.0: "@types/color-name" "^1.1.1" color-convert "^2.0.1" -argparse@^1.0.7: +ansi-wrap@0.1.0: + version "0.1.0" + resolved "https://registry.yarnpkg.com/ansi-wrap/-/ansi-wrap-0.1.0.tgz#a82250ddb0015e9a27ca82e82ea603bbfa45efaf" + integrity sha1-qCJQ3bABXponyoLoLqYDu/pF768= + +argparse@^1.0.10, argparse@^1.0.7: version "1.0.10" resolved "https://registry.yarnpkg.com/argparse/-/argparse-1.0.10.tgz#bcd6791ea5ae09725e17e5ad988134cd40b3d911" integrity sha512-o5Roy6tNG4SL/FOkCAN6RzjiakZS25RLYFrcMttJqbdd8BWrnA+fGz57iN5Pb06pvBGvl5gQ0B48dJlslXvoTg== @@ -326,6 +338,13 @@ atob@^2.1.2: resolved "https://registry.yarnpkg.com/atob/-/atob-2.1.2.tgz#6d9517eb9e030d2436666651e86bd9f6f13533c9" integrity sha512-Wm6ukoaOGJi/73p/cl2GvLjTI5JM1k/O14isD73YML8StrH/7/lRFgmg8nICZgD3bZZvjwCGxtMOD3wWNAu8cg== +autolinker@~0.28.0: + version "0.28.1" + resolved "https://registry.yarnpkg.com/autolinker/-/autolinker-0.28.1.tgz#0652b491881879f0775dace0cdca3233942a4e47" + integrity sha1-BlK0kYgYefB3XazgzcoyM5QqTkc= + dependencies: + gulp-header "^1.7.1" + aws-sign2@~0.7.0: version "0.7.0" resolved "https://registry.yarnpkg.com/aws-sign2/-/aws-sign2-0.7.0.tgz#b46e890934a9591f2d2f6f86d7e6a9f1b3fe76a8" @@ -595,6 +614,11 @@ code-point-at@^1.0.0: resolved "https://registry.yarnpkg.com/code-point-at/-/code-point-at-1.1.0.tgz#0d070b4d043a5bea33a2f1a40e2edb3d9a4ccf77" integrity sha1-DQcLTQQ6W+ozovGkDi7bPZpMz3c= +coffee-script@^1.12.4: + version "1.12.7" + resolved "https://registry.yarnpkg.com/coffee-script/-/coffee-script-1.12.7.tgz#c05dae0cb79591d05b3070a8433a98c9a89ccc53" + integrity sha512-fLeEhqwymYat/MpTPUjSKHVYYl0ec2mOyALEMLmzr5i1isuG+6jfI2j2d5oBO3VIzgUXgBVIcOT9uH1TFxBckw== + collection-visit@^1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/collection-visit/-/collection-visit-1.0.0.tgz#4bc0373c164bc3291b4d368c829cf1a80a59dca0" @@ -676,7 +700,7 @@ concat-map@0.0.1: resolved "https://registry.yarnpkg.com/concat-map/-/concat-map-0.0.1.tgz#d8a96bd77fd68df7793a73036a3ba0d5405d477b" integrity sha1-2Klr13/Wjfd5OnMDajug1UBdR3s= -concat-stream@^1.4.7: +concat-stream@^1.4.7, concat-stream@^1.5.2: version "1.6.2" resolved "https://registry.yarnpkg.com/concat-stream/-/concat-stream-1.6.2.tgz#904bdf194cd3122fc675c77fc4ac3d4ff0fd1a34" integrity sha512-27HBghJxjiZtIk3Ycvn/4kbJk/1uZuJFfuPEns6LaEvpvG1f0hTea8lilrouyo9mVc2GWdcEZ8OLoGmSADlrCw== @@ -686,6 +710,13 @@ concat-stream@^1.4.7: readable-stream "^2.2.2" typedarray "^0.0.6" +concat-with-sourcemaps@*: + version "1.1.0" + resolved "https://registry.yarnpkg.com/concat-with-sourcemaps/-/concat-with-sourcemaps-1.1.0.tgz#d4ea93f05ae25790951b99e7b3b09e3908a4082e" + integrity sha512-4gEjHJFT9e+2W/77h/DS5SGUgwDaOwprX8L/gl5+3ixnzkVJJsZWDSelmN3Oilw3LNDZjZV0yqH1hLG3k6nghg== + dependencies: + source-map "^0.6.1" + configstore@^5.0.0, configstore@^5.0.1: version "5.0.1" resolved "https://registry.yarnpkg.com/configstore/-/configstore-5.0.1.tgz#d365021b5df4b98cdd187d6a3b0e3f6a7cc5ed96" @@ -1171,6 +1202,11 @@ detect-indent@^4.0.0: dependencies: repeating "^2.0.0" +diacritics-map@^0.1.0: + version "0.1.0" + resolved "https://registry.yarnpkg.com/diacritics-map/-/diacritics-map-0.1.0.tgz#6dfc0ff9d01000a2edf2865371cac316e94977af" + integrity sha1-bfwP+dAQAKLt8oZTccrDFulJd68= + dom-serializer@0: version "0.2.2" resolved "https://registry.yarnpkg.com/dom-serializer/-/dom-serializer-0.2.2.tgz#1afb81f533717175d478655debc5e332d9f9bb51" @@ -1400,6 +1436,13 @@ expand-brackets@^2.1.4: snapdragon "^0.8.1" to-regex "^3.0.1" +expand-range@^1.8.1: + version "1.8.2" + resolved "https://registry.yarnpkg.com/expand-range/-/expand-range-1.8.2.tgz#a299effd335fe2721ebae8e257ec79644fc85337" + integrity sha1-opnv/TNf4nIeuujiV+x5ZE/IUzc= + dependencies: + fill-range "^2.1.0" + expand-tilde@^2.0.2: version "2.0.2" resolved "https://registry.yarnpkg.com/expand-tilde/-/expand-tilde-2.0.2.tgz#97e801aa052df02454de46b02bf621642cdc8502" @@ -1488,6 +1531,17 @@ figures@^1.3.5: escape-string-regexp "^1.0.5" object-assign "^4.1.0" +fill-range@^2.1.0: + version "2.2.4" + resolved "https://registry.yarnpkg.com/fill-range/-/fill-range-2.2.4.tgz#eb1e773abb056dcd8df2bfdf6af59b8b3a936565" + integrity sha512-cnrcCbj01+j2gTG921VZPnHbjmdAf8oQV/iGeV2kZxGSyfYjjTyY79ErsK1WJWMpw6DaApEX72binqJE+/d+5Q== + dependencies: + is-number "^2.1.0" + isobject "^2.0.0" + randomatic "^3.0.0" + repeat-element "^1.1.2" + repeat-string "^1.5.2" + fill-range@^4.0.0: version "4.0.0" resolved "https://registry.yarnpkg.com/fill-range/-/fill-range-4.0.0.tgz#d544811d428f98eb06a63dc402d2403c328c38f7" @@ -1562,6 +1616,13 @@ fragment-cache@^0.2.1: dependencies: map-cache "^0.2.2" +front-matter@^4.0.2: + version "4.0.2" + resolved "https://registry.yarnpkg.com/front-matter/-/front-matter-4.0.2.tgz#b14e54dc745cfd7293484f3210d15ea4edd7f4d5" + integrity sha512-I8ZuJ/qG92NWX8i5x1Y8qyj3vizhXS31OxjKDu3LKP+7/qBgfIKValiZIEwoVoJKUHlhWtYrktkxV1XsX+pPlg== + dependencies: + js-yaml "^3.13.1" + fs-exists-sync@^0.1.0: version "0.1.0" resolved "https://registry.yarnpkg.com/fs-exists-sync/-/fs-exists-sync-0.1.0.tgz#982d6893af918e72d08dec9e8673ff2b5a8d6add" @@ -1686,6 +1747,26 @@ graceful-fs@^4.1.2, graceful-fs@^4.1.6, graceful-fs@^4.2.0: resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.2.4.tgz#2256bde14d3632958c465ebc96dc467ca07a29fb" integrity sha512-WjKPNJF79dtJAVniUlGGWHYGz2jWxT6VhN/4m1NdkbZ2nOsEF+cI1Edgql5zCRhs/VsQYRvrXctxktVXZUkixw== +gray-matter@^2.1.0: + version "2.1.1" + resolved "https://registry.yarnpkg.com/gray-matter/-/gray-matter-2.1.1.tgz#3042d9adec2a1ded6a7707a9ed2380f8a17a430e" + integrity sha1-MELZrewqHe1qdwep7SOA+KF6Qw4= + dependencies: + ansi-red "^0.1.1" + coffee-script "^1.12.4" + extend-shallow "^2.0.1" + js-yaml "^3.8.1" + toml "^2.3.2" + +gulp-header@^1.7.1: + version "1.8.12" + resolved "https://registry.yarnpkg.com/gulp-header/-/gulp-header-1.8.12.tgz#ad306be0066599127281c4f8786660e705080a84" + integrity sha512-lh9HLdb53sC7XIZOYzTXM4lFuXElv3EVkSDhsd7DoJBj7hm+Ni7D3qYbb+Rr8DuM8nRanBvkVO9d7askreXGnQ== + dependencies: + concat-with-sourcemaps "*" + lodash.template "^4.4.0" + through2 "^2.0.0" + har-schema@^2.0.0: version "2.0.0" resolved "https://registry.yarnpkg.com/har-schema/-/har-schema-2.0.0.tgz#a94c2224ebcac04782a0d9035521f24735b7ec92" @@ -2001,6 +2082,13 @@ is-fullwidth-code-point@^1.0.0: dependencies: number-is-nan "^1.0.0" +is-number@^2.1.0: + version "2.1.0" + resolved "https://registry.yarnpkg.com/is-number/-/is-number-2.1.0.tgz#01fcbbb393463a548f2f466cce16dece49db908f" + integrity sha1-Afy7s5NGOlSPL0ZszhbezknbkI8= + dependencies: + kind-of "^3.0.2" + is-number@^3.0.0: version "3.0.0" resolved "https://registry.yarnpkg.com/is-number/-/is-number-3.0.0.tgz#24fd6201a4782cf50561c810276afc7d12d71195" @@ -2008,6 +2096,11 @@ is-number@^3.0.0: dependencies: kind-of "^3.0.2" +is-number@^4.0.0: + version "4.0.0" + resolved "https://registry.yarnpkg.com/is-number/-/is-number-4.0.0.tgz#0026e37f5454d73e356dfe6564699867c6a7f0ff" + integrity sha512-rSklcAIlf1OmFdyAqbnWTLVelsQ58uvZ66S/ZyawjWqIviTWCjg2PzVGw8WUA+nNuPTqb4wgA+NszrJ+08LlgQ== + is-number@^7.0.0: version "7.0.0" resolved "https://registry.yarnpkg.com/is-number/-/is-number-7.0.0.tgz#7535345b896734d5f80c4d06c50955527a14f12b" @@ -2112,6 +2205,14 @@ js-yaml@^3.10.0: argparse "^1.0.7" esprima "^4.0.0" +js-yaml@^3.13.1, js-yaml@^3.8.1: + version "3.14.0" + resolved "https://registry.yarnpkg.com/js-yaml/-/js-yaml-3.14.0.tgz#a7a34170f26a21bb162424d8adacb4113a69e482" + integrity sha512-/4IbIeHcD9VMHFqDR/gQ7EdZdLimOvW2DdcxFjdyyZ9NsbS+ccrXqVWDtab/lRl5AlUqmpBx8EhPaWR+OtY17A== + dependencies: + argparse "^1.0.7" + esprima "^4.0.0" + jsbn@~0.1.0: version "0.1.1" resolved "https://registry.yarnpkg.com/jsbn/-/jsbn-0.1.1.tgz#a5e654c2e5a2deb5f201d96cefbca80c0ef2f513" @@ -2269,6 +2370,13 @@ ky@^0.12.0: resolved "https://registry.yarnpkg.com/ky/-/ky-0.12.0.tgz#c05be95e6745ba422a6d2cc8ae964164962279f9" integrity sha512-t9b7v3V2fGwAcQnnDDQwKQGF55eWrf4pwi1RN08Fy8b/9GEwV7Ea0xQiaSW6ZbeghBHIwl8kgnla4vVo9seepQ== +lazy-cache@^2.0.2: + version "2.0.2" + resolved "https://registry.yarnpkg.com/lazy-cache/-/lazy-cache-2.0.2.tgz#b9190a4f913354694840859f8a8f7084d8822264" + integrity sha1-uRkKT5EzVGlIQIWfio9whNiCImQ= + dependencies: + set-getter "^0.1.0" + levn@~0.3.0: version "0.3.0" resolved "https://registry.yarnpkg.com/levn/-/levn-0.3.0.tgz#3b09924edf9f083c0490fdd4c0bc4421e04764ee" @@ -2287,6 +2395,16 @@ lines-and-columns@^1.1.6: resolved "https://registry.yarnpkg.com/lines-and-columns/-/lines-and-columns-1.1.6.tgz#1c00c743b433cd0a4e80758f7b64a57440d9ff00" integrity sha1-HADHQ7QzzQpOgHWPe2SldEDZ/wA= +list-item@^1.1.1: + version "1.1.1" + resolved "https://registry.yarnpkg.com/list-item/-/list-item-1.1.1.tgz#0c65d00e287cb663ccb3cb3849a77e89ec268a56" + integrity sha1-DGXQDih8tmPMs8s4Sad+iewmilY= + dependencies: + expand-range "^1.8.1" + extend-shallow "^2.0.1" + is-number "^2.1.0" + repeat-string "^1.5.2" + locate-path@^5.0.0: version "5.0.0" resolved "https://registry.yarnpkg.com/locate-path/-/locate-path-5.0.0.tgz#1afba396afd676a6d42504d0a67a3a7eb9f62aa0" @@ -2294,6 +2412,11 @@ locate-path@^5.0.0: dependencies: p-locate "^4.1.0" +lodash._reinterpolate@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/lodash._reinterpolate/-/lodash._reinterpolate-3.0.0.tgz#0ccf2d89166af03b3663c796538b75ac6e114d9d" + integrity sha1-DM8tiRZq8Ds2Y8eWU4t1rG4RTZ0= + lodash.find@^4.6.0: version "4.6.0" resolved "https://registry.yarnpkg.com/lodash.find/-/lodash.find-4.6.0.tgz#cb0704d47ab71789ffa0de8b97dd926fb88b13b1" @@ -2369,6 +2492,21 @@ lodash.sortby@^4.7.0: resolved "https://registry.yarnpkg.com/lodash.sortby/-/lodash.sortby-4.7.0.tgz#edd14c824e2cc9c1e0b0a1b42bb5210516a42438" integrity sha1-7dFMgk4sycHgsKG0K7UhBRakJDg= +lodash.template@^4.4.0: + version "4.5.0" + resolved "https://registry.yarnpkg.com/lodash.template/-/lodash.template-4.5.0.tgz#f976195cf3f347d0d5f52483569fe8031ccce8ab" + integrity sha512-84vYFxIkmidUiFxidA/KjjH9pAycqW+h980j7Fuz5qxRtO9pgB7MDFTdys1N7A5mcucRiDyEq4fusljItR1T/A== + dependencies: + lodash._reinterpolate "^3.0.0" + lodash.templatesettings "^4.0.0" + +lodash.templatesettings@^4.0.0: + version "4.2.0" + resolved "https://registry.yarnpkg.com/lodash.templatesettings/-/lodash.templatesettings-4.2.0.tgz#e481310f049d3cf6d47e912ad09313b154f0fb33" + integrity sha512-stgLz+i3Aa9mZgnjr/O+v9ruKZsPsndy7qPZOchbqk2cnTU1ZaldKK+v7m54WoKIyxiuMZTKT2H81F8BeAc3ZQ== + dependencies: + lodash._reinterpolate "^3.0.0" + lodash.uniq@^4.5.0: version "4.5.0" resolved "https://registry.yarnpkg.com/lodash.uniq/-/lodash.uniq-4.5.0.tgz#d0225373aeb652adc1bc82e4945339a842754773" @@ -2410,6 +2548,11 @@ map-visit@^1.0.0: dependencies: object-visit "^1.0.0" +markdown-link@^0.1.1: + version "0.1.1" + resolved "https://registry.yarnpkg.com/markdown-link/-/markdown-link-0.1.1.tgz#32c5c65199a6457316322d1e4229d13407c8c7cf" + integrity sha1-MsXGUZmmRXMWMi0eQinRNAfIx88= + markdown-spellcheck@^1.3.1: version "1.3.1" resolved "https://registry.yarnpkg.com/markdown-spellcheck/-/markdown-spellcheck-1.3.1.tgz#e901b04631e759ad8903470db3261013c2712602" @@ -2425,11 +2568,34 @@ markdown-spellcheck@^1.3.1: marked "^0.3.5" sinon-as-promised "^4.0.0" +markdown-toc@^1.2.0: + version "1.2.0" + resolved "https://registry.yarnpkg.com/markdown-toc/-/markdown-toc-1.2.0.tgz#44a15606844490314afc0444483f9e7b1122c339" + integrity sha512-eOsq7EGd3asV0oBfmyqngeEIhrbkc7XVP63OwcJBIhH2EpG2PzFcbZdhy1jutXSlRBBVMNXHvMtSr5LAxSUvUg== + dependencies: + concat-stream "^1.5.2" + diacritics-map "^0.1.0" + gray-matter "^2.1.0" + lazy-cache "^2.0.2" + list-item "^1.1.1" + markdown-link "^0.1.1" + minimist "^1.2.0" + mixin-deep "^1.1.3" + object.pick "^1.2.0" + remarkable "^1.7.1" + repeat-string "^1.6.1" + strip-color "^0.1.0" + marked@0.3.19, marked@^0.3.5: version "0.3.19" resolved "https://registry.yarnpkg.com/marked/-/marked-0.3.19.tgz#5d47f709c4c9fc3c216b6d46127280f40b39d790" integrity sha512-ea2eGWOqNxPcXv8dyERdSr/6FmzvWwzjMxpfGB/sbMccXoct+xY+YukPD+QTUZwyvK7BZwcr4m21WBOW41pAkg== +math-random@^1.0.1: + version "1.0.4" + resolved "https://registry.yarnpkg.com/math-random/-/math-random-1.0.4.tgz#5dd6943c938548267016d4e34f057583080c514c" + integrity sha512-rUxjysqif/BZQH2yhd5Aaq7vXMSx9NdEsQcyA07uEzIvxgI7zIr33gGsh+RU0/XjmQpCW7RsVof1vlkvQVCK5A== + memfs-or-file-map-to-github-branch@^1.1.0: version "1.2.0" resolved "https://registry.yarnpkg.com/memfs-or-file-map-to-github-branch/-/memfs-or-file-map-to-github-branch-1.2.0.tgz#a56cd13443144a8c7fbe2a4b90b5f570fb39c845" @@ -2503,7 +2669,7 @@ minimist@^1.2.0, minimist@^1.2.5: resolved "https://registry.yarnpkg.com/minimist/-/minimist-1.2.5.tgz#67d66014b66a6a8aaa0c083c5fd58df4e4e97602" integrity sha512-FM9nNUYrRBAELZQT3xeZQ7fmMOBg6nWNmJKTcgsJeaLstP/UODVpGsr5OhXhhXg6f+qtJ8uiZ+PUxkDWcgIXLw== -mixin-deep@^1.2.0: +mixin-deep@^1.1.3, mixin-deep@^1.2.0: version "1.3.2" resolved "https://registry.yarnpkg.com/mixin-deep/-/mixin-deep-1.3.2.tgz#1120b43dc359a785dce65b55b82e257ccf479566" integrity sha512-WRoDn//mXBiJ1H40rqa3vH0toePwSsGb45iInWlTySa+Uu4k3tYUSxa2v1KqAiLtvlrSzaExqS1gtk96A9zvEA== @@ -2644,7 +2810,7 @@ object.omit@~2.0.0: for-own "^0.1.4" is-extendable "^0.1.1" -object.pick@^1.3.0: +object.pick@^1.2.0, object.pick@^1.3.0: version "1.3.0" resolved "https://registry.yarnpkg.com/object.pick/-/object.pick-1.3.0.tgz#87a10ac4c1694bd2e1cbf53591a66141fb5dd747" integrity sha1-h6EKxMFpS9Lhy/U1kaZhQftd10c= @@ -2952,6 +3118,15 @@ query-string@^6.8.2: split-on-first "^1.0.0" strict-uri-encode "^2.0.0" +randomatic@^3.0.0: + version "3.1.1" + resolved "https://registry.yarnpkg.com/randomatic/-/randomatic-3.1.1.tgz#b776efc59375984e36c537b2f51a1f0aff0da1ed" + integrity sha512-TuDE5KxZ0J461RVjrJZCJc+J+zCkTb1MbH9AQUq68sMhOMcy9jLcb3BrZKgp9q9Ncltdg4QVqWrH02W2EFFVYw== + dependencies: + is-number "^4.0.0" + kind-of "^6.0.0" + math-random "^1.0.1" + readable-stream@1.1: version "1.1.13" resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-1.1.13.tgz#f6eef764f514c89e2b9e23146a75ba106756d23e" @@ -2962,7 +3137,7 @@ readable-stream@1.1: isarray "0.0.1" string_decoder "~0.10.x" -readable-stream@^2.2.2: +readable-stream@^2.2.2, readable-stream@~2.3.6: version "2.3.7" resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-2.3.7.tgz#1eca1cf711aef814c04f62252a36a62f6cb23b57" integrity sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw== @@ -3007,12 +3182,20 @@ regex-not@^1.0.0, regex-not@^1.0.2: extend-shallow "^3.0.2" safe-regex "^1.1.0" +remarkable@^1.7.1: + version "1.7.4" + resolved "https://registry.yarnpkg.com/remarkable/-/remarkable-1.7.4.tgz#19073cb960398c87a7d6546eaa5e50d2022fcd00" + integrity sha512-e6NKUXgX95whv7IgddywbeN/ItCkWbISmc2DiqHJb0wTrqZIexqdco5b8Z3XZoo/48IdNVKM9ZCvTPJ4F5uvhg== + dependencies: + argparse "^1.0.10" + autolinker "~0.28.0" + repeat-element@^1.1.2: version "1.1.3" resolved "https://registry.yarnpkg.com/repeat-element/-/repeat-element-1.1.3.tgz#782e0d825c0c5a3bb39731f84efee6b742e6b1ce" integrity sha512-ahGq0ZnV5m5XtZLMb+vP76kcAM5nkLqk0lpqAuojSKGgQtn4eRi4ZZGm2olo2zKFH+sMsWaqOCW1dqAnOru72g== -repeat-string@^1.6.1: +repeat-string@^1.5.2, repeat-string@^1.6.1: version "1.6.1" resolved "https://registry.yarnpkg.com/repeat-string/-/repeat-string-1.6.1.tgz#8dcae470e1c88abc2d600fff4a776286da75e637" integrity sha1-jcrkcOHIirwtYA//Sndihtp15jc= @@ -3140,6 +3323,13 @@ semver@^6.0.0: resolved "https://registry.yarnpkg.com/semver/-/semver-6.3.0.tgz#ee0a64c8af5e8ceea67687b133761e1becbd1d3d" integrity sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw== +set-getter@^0.1.0: + version "0.1.0" + resolved "https://registry.yarnpkg.com/set-getter/-/set-getter-0.1.0.tgz#d769c182c9d5a51f409145f2fba82e5e86e80376" + integrity sha1-12nBgsnVpR9AkUXy+6guXoboA3Y= + dependencies: + to-object-path "^0.3.0" + set-value@^2.0.0, set-value@^2.0.1: version "2.0.1" resolved "https://registry.yarnpkg.com/set-value/-/set-value-2.0.1.tgz#a18d40530e6f07de4228c7defe4227af8cad005b" @@ -3243,7 +3433,7 @@ source-map@^0.5.6, source-map@^0.5.7: resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.5.7.tgz#8a039d2d1021d22d1ea14c80d8ea468ba2ef3fcc" integrity sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w= -source-map@~0.6.1: +source-map@^0.6.1, source-map@~0.6.1: version "0.6.1" resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.6.1.tgz#74722af32e9614e9c287a8d0bbde48b5e2f1a263" integrity sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g== @@ -3336,6 +3526,11 @@ strip-ansi@^3.0.0: dependencies: ansi-regex "^2.0.0" +strip-color@^0.1.0: + version "0.1.0" + resolved "https://registry.yarnpkg.com/strip-color/-/strip-color-0.1.0.tgz#106f65d3d3e6a2d9401cac0eb0ce8b8a702b4f7b" + integrity sha1-EG9l09PmotlAHKwOsM6LinArT3s= + strip-eof@^1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/strip-eof/-/strip-eof-1.0.0.tgz#bb43ff5598a6eb05d89b59fcd129c983313606bf" @@ -3383,6 +3578,14 @@ taffydb@2.7.3: resolved "https://registry.yarnpkg.com/taffydb/-/taffydb-2.7.3.tgz#2ad37169629498fca5bc84243096d3cde0ec3a34" integrity sha1-KtNxaWKUmPylvIQkMJbTzeDsOjQ= +through2@^2.0.0: + version "2.0.5" + resolved "https://registry.yarnpkg.com/through2/-/through2-2.0.5.tgz#01c1e39eb31d07cb7d03a96a70823260b23132cd" + integrity sha512-/mrRod8xqpA+IHSLyGCQ2s8SPHiCDEeQJSep1jqLYeEUClOFG2Qsh+4FU6G9VeqpZnGW/Su8LQGc4YKni5rYSQ== + dependencies: + readable-stream "~2.3.6" + xtend "~4.0.1" + through@^2.3.6: version "2.3.8" resolved "https://registry.yarnpkg.com/through/-/through-2.3.8.tgz#0dd4c9ffaabc357960b1b724115d7e0e86a2e1f5" @@ -3432,6 +3635,11 @@ to-regex@^3.0.1, to-regex@^3.0.2: regex-not "^1.0.2" safe-regex "^1.1.0" +toml@^2.3.2: + version "2.3.6" + resolved "https://registry.yarnpkg.com/toml/-/toml-2.3.6.tgz#25b0866483a9722474895559088b436fd11f861b" + integrity sha512-gVweAectJU3ebq//Ferr2JUY4WKSDe5N+z0FvjDncLGyHmIDoxgY/2Ie4qfEIDm4IS7OA6Rmdm7pdEEdMcV/xQ== + tough-cookie@^2.2.0, tough-cookie@~2.5.0: version "2.5.0" resolved "https://registry.yarnpkg.com/tough-cookie/-/tough-cookie-2.5.0.tgz#cd9fb2a0aa1d5a12b473bd9fb96fa3dcff65ade2" From 4956423486cccc67af924680a2243459e1e89f91 Mon Sep 17 00:00:00 2001 From: swyx Date: Mon, 17 Aug 2020 21:28:29 +0800 Subject: [PATCH 014/456] Update basic-cheatsheet.md --- .github/ISSUE_TEMPLATE/basic-cheatsheet.md | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/.github/ISSUE_TEMPLATE/basic-cheatsheet.md b/.github/ISSUE_TEMPLATE/basic-cheatsheet.md index c5a39477..c3e34307 100644 --- a/.github/ISSUE_TEMPLATE/basic-cheatsheet.md +++ b/.github/ISSUE_TEMPLATE/basic-cheatsheet.md @@ -13,3 +13,7 @@ Basic cheatsheet **What's your issue or idea?** _Write here_ + +**(If applicable) Reproduction of issue in TypeScript Playground** + +_[start with the basic TS + React template](https://www.typescriptlang.org/play/?jsx=2&esModuleInterop=true&q=222#example/typescript-with-react)_ From 728b1e295d904a58f88b29bdd35f197e9660958b Mon Sep 17 00:00:00 2001 From: swyx Date: Mon, 17 Aug 2020 21:28:44 +0800 Subject: [PATCH 015/456] Update general-react-ts-question.md --- .github/ISSUE_TEMPLATE/general-react-ts-question.md | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/.github/ISSUE_TEMPLATE/general-react-ts-question.md b/.github/ISSUE_TEMPLATE/general-react-ts-question.md index da18488a..625056d8 100644 --- a/.github/ISSUE_TEMPLATE/general-react-ts-question.md +++ b/.github/ISSUE_TEMPLATE/general-react-ts-question.md @@ -5,3 +5,9 @@ title: "[Question] QUESTION_TITLE_HERE" labels: good first issue assignees: sw-yx --- + + + +**(If applicable) Reproduction of issue in TypeScript Playground** + +_[start with the basic TS + React template](https://www.typescriptlang.org/play/?jsx=2&esModuleInterop=true&q=222#example/typescript-with-react)_ From cd3ed2e2389c651e6794b1681870f7cac418d121 Mon Sep 17 00:00:00 2001 From: "allcontributors[bot]" <46447321+allcontributors[bot]@users.noreply.github.com> Date: Mon, 17 Aug 2020 21:48:20 +0800 Subject: [PATCH 016/456] docs: add arvindcheenu as a contributor (#267) Co-authored-by: allcontributors[bot] <46447321+allcontributors[bot]@users.noreply.github.com> --- .all-contributorsrc | 17 +++++++++++++++-- CONTRIBUTORS.md | 18 +++++++++++------- 2 files changed, 26 insertions(+), 9 deletions(-) diff --git a/.all-contributorsrc b/.all-contributorsrc index c9b6269c..abccff30 100644 --- a/.all-contributorsrc +++ b/.all-contributorsrc @@ -72,11 +72,24 @@ "doc", "infra" ] + }, + { + "login": "arvindcheenu", + "name": "Arvind Srinivasan", + "avatar_url": "https://avatars2.githubusercontent.com/u/13925213?v=4", + "profile": "https://github.com/arvindcheenu", + "contributions": [ + "code", + "content", + "doc", + "maintenance" + ] } ], "contributorsPerLine": 7, - "projectName": "react-typescript-cheatsheet", + "projectName": "react", "projectOwner": "typescript-cheatsheets", "repoType": "github", - "repoHost": "https://github.com" + "repoHost": "https://github.com", + "skipCi": true } diff --git a/CONTRIBUTORS.md b/CONTRIBUTORS.md index feb954fe..de0fc3a5 100644 --- a/CONTRIBUTORS.md +++ b/CONTRIBUTORS.md @@ -1,18 +1,22 @@ ## Contributors - + + - - - - - - + + + + + + +
Ferdy Budhidharma
Ferdy Budhidharma
👀 🚧 🖋		swyx
swyx
🤔 👀 🚧 🖋 💬		Sebastian Silbermann
Sebastian Silbermann
👀 🚧 🖋		Islam Attrash
Islam Attrash
🚧 🖋		Stephen Koo
Stephen Koo
💬 💡		Andreas
Andreas
💻 📖 🚇
Ferdy Budhidharma
👀 🚧 🖋
swyx
🤔 👀 🚧 🖋 💬
Sebastian Silbermann
👀 🚧 🖋
Islam Attrash
🚧 🖋
Stephen Koo
💬 💡
Andreas
💻 📖 🚇
Arvind Srinivasan
💻 🖋 📖 🚧
+ + Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)): From 8b96e976c4c2666d02b678fd61c86064e8f27c60 Mon Sep 17 00:00:00 2001 From: swyx Date: Mon, 17 Aug 2020 21:48:58 +0800 Subject: [PATCH 017/456] fix format --- .../general-react-ts-question.md | 2 - CONTRIBUTORS.md | 1 + README.md | 56 ++++++++++++++----- 3 files changed, 43 insertions(+), 16 deletions(-) diff --git a/.github/ISSUE_TEMPLATE/general-react-ts-question.md b/.github/ISSUE_TEMPLATE/general-react-ts-question.md index 625056d8..a0f7946f 100644 --- a/.github/ISSUE_TEMPLATE/general-react-ts-question.md +++ b/.github/ISSUE_TEMPLATE/general-react-ts-question.md @@ -6,8 +6,6 @@ labels: good first issue assignees: sw-yx --- - - **(If applicable) Reproduction of issue in TypeScript Playground** _[start with the basic TS + React template](https://www.typescriptlang.org/play/?jsx=2&esModuleInterop=true&q=222#example/typescript-with-react)_ diff --git a/CONTRIBUTORS.md b/CONTRIBUTORS.md index de0fc3a5..1161a203 100644 --- a/CONTRIBUTORS.md +++ b/CONTRIBUTORS.md @@ -17,6 +17,7 @@ + Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)): diff --git a/README.md b/README.md index 5684e950..eaa5dd55 100644 --- a/README.md +++ b/README.md @@ -62,9 +62,9 @@ - [Section 1: Setup](#section-1-setup) - - [Prerequisites](#prerequisites) - - [React + TypeScript Starter Kits](#react--typescript-starter-kits) - - [Import React](#import-react) + - [Prerequisites](#prerequisites) + - [React + TypeScript Starter Kits](#react--typescript-starter-kits) + - [Import React](#import-react) - [Section 2: Getting Started](#section-2-getting-started) - [Function Components](#function-components) - [Hooks](#hooks) @@ -82,17 +82,17 @@ - [Concurrent React/React Suspense](#concurrent-reactreact-suspense) - [Basic Troubleshooting Handbook: Types](#basic-troubleshooting-handbook-types) - - [Union Types and Type Guarding](#union-types-and-type-guarding) - - [Optional Types](#optional-types) - - [Enum Types](#enum-types) - - [Type Assertion](#type-assertion) - - [Simulating Nominal Types](#simulating-nominal-types) - - [Intersection Types](#intersection-types) - - [Union Types](#union-types) - - [Overloading Function Types](#overloading-function-types) - - [Using Inferred Types](#using-inferred-types) - - [Using Partial Types](#using-partial-types) - - [The Types I need weren't exported!](#the-types-i-need-werent-exported) + - [Union Types and Type Guarding](#union-types-and-type-guarding) + - [Optional Types](#optional-types) + - [Enum Types](#enum-types) + - [Type Assertion](#type-assertion) + - [Simulating Nominal Types](#simulating-nominal-types) + - [Intersection Types](#intersection-types) + - [Union Types](#union-types) + - [Overloading Function Types](#overloading-function-types) + - [Using Inferred Types](#using-inferred-types) + - [Using Partial Types](#using-partial-types) + - [The Types I need weren't exported!](#the-types-i-need-werent-exported) - [The Types I need Don't Exist!](#the-types-i-need-dont-exist) - [Troubleshooting Handbook: Operators](#troubleshooting-handbook-operators) - [Troubleshooting Handbook: Utilties](#troubleshooting-handbook-utilities) @@ -109,6 +109,7 @@ + # Section 1: Setup ## Prerequisites @@ -160,6 +161,7 @@ You should also check [the new TypeScript docs for official descriptions between # Section 2: Getting Started + ## Function Components These can be written as normal functions that take a `props` argument and return a JSX element. @@ -239,6 +241,7 @@ const MyArrayComponent = () => (Array(5).fill(
) as any) as JSX.Element; + ## Hooks Hooks are [supported in `@types/react` from v16.8 up](https://github.com/DefinitelyTyped/DefinitelyTyped/blob/a05cc538a42243c632f054e42eab483ebf1560ab/types/react/index.d.ts#L800-L1031). @@ -476,6 +479,7 @@ Example React Hooks + TypeScript Libraries: + ## Class Components Within TypeScript, `React.Component` is a generic type (aka `React.Component`), so you want to provide it with (optional) prop and state type parameters: @@ -586,6 +590,7 @@ class App extends React.Component<{ + ## Typing defaultProps For TypeScript 3.0+, type inference [should work](https://www.typescriptlang.org/docs/handbook/release-notes/typescript-3-0.html), although [some edge cases are still problematic](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/issues/61). Just type your props like normal, except don't use `React.FC`. @@ -717,6 +722,7 @@ The problem with this approach is it causes complex issues with the type inferen + ## Types or Interfaces? `interface`s are different from `type`s in TypeScript, but they can be used for very similar things as far as common React uses cases are concerned. Here's a helpful rule of thumb: @@ -744,6 +750,7 @@ It's a nuanced topic, don't get too hung up on it. Here's a handy graphic: + ## Basic Prop Types Examples ```tsx @@ -786,6 +793,7 @@ Notice we have used the TSDoc `/** comment */` style here on each prop. You can + ## Useful React Prop Type Examples ```tsx @@ -819,6 +827,7 @@ Quote [@ferdaber](https://github.com/typescript-cheatsheets/react-typescript-che + ## getDerivedStateFromProps Before you start using `getDerivedStateFromProps`, please go through the [documentation](https://reactjs.org/docs/react-component.html#static-getderivedstatefromprops) and [You Probably Don't Need Derived State](https://reactjs.org/blog/2018/06/07/you-probably-dont-need-derived-state.html). Derived State can be easily achieved using hooks which can also help set up memoization easily. @@ -886,6 +895,7 @@ class Comp extends React.PureComponent { + ## Forms and Events If performance is not an issue, inlining handlers is easiest as you can just use [type inference and contextual typing](https://www.typescriptlang.org/docs/handbook/type-inference.html#contextual-typing): @@ -990,6 +1000,7 @@ Of course, if you're making any sort of significant form, [you should use Formik + ## Context Using `React.createContext` with an empty object as default value. @@ -1228,6 +1239,7 @@ const Consumer = Context.Consumer; + ## forwardRef/createRef Check the [Hooks section](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/blob/master/README.md#hooks) for `useRef`. @@ -1266,6 +1278,7 @@ You may also wish to do [Conditional Rendering with `forwardRef`](https://github + ## Portals Using `ReactDOM.createPortal`: @@ -1304,6 +1317,7 @@ This example is based on the [Event Bubbling Through Portal](https://reactjs.org + ## Error Boundaries _Not written yet._ @@ -1313,6 +1327,7 @@ _Not written yet._ + ## Concurrent React/React Suspense _Not written yet._ watch for more on React Suspense and Time Slicing. @@ -1322,6 +1337,7 @@ _Not written yet._ watch for more o + # Troubleshooting Handbook: Types > ⚠️ Have you read [the TypeScript FAQ](https://github.com/microsoft/TypeScript/wiki/FAQ)?) Your answer might be there! @@ -2009,6 +2025,7 @@ Use [declaration merging](https://www.typescriptlang.org/docs/handbook/declarati + # Troubleshooting Handbook: Operators - `typeof` and `instanceof`: type query used for refinement @@ -2031,6 +2048,7 @@ Conditional Types are a difficult topic to get around so here are some extra res + # Troubleshooting Handbook: Utilities these are all built in, [see source in es5.d.ts](https://github.com/microsoft/TypeScript/blob/2c458c0d1ccb96442bca9ce43aa987fb0becf8a9/src/lib/es5.d.ts#L1401-L1474): @@ -2054,6 +2072,7 @@ This section needs writing, but you can probably find a good starting point with + # Troubleshooting Handbook: tsconfig.json You can find [all the Compiler options in the TypeScript docs](https://www.typescriptlang.org/docs/handbook/compiler-options.html). [The new TS docs also has per-flag annotations of what each does](https://www.typescriptlang.org/v2/en/tsconfig#allowSyntheticDefaultImports). This is the setup I roll with for APPS (not libraries - for libraries you may wish to see the settings we use in `tsdx`): @@ -2103,6 +2122,7 @@ Compilation speed grows linearly with size of codebase. For large projects, you + # Troubleshooting Handbook: Bugs in official typings If you run into bugs with your library's official typings, you can copy them locally and tell TypeScript to use your local version using the "paths" field. In your `tsconfig.json`: @@ -2169,6 +2189,7 @@ You can see examples of these included in the built in type declarations in the + # Troubleshooting Handbook: Images and other non-TS/TSX files Use [declaration merging](https://www.typescriptlang.org/docs/handbook/declaration-merging.html): @@ -2189,6 +2210,7 @@ Related issue: https://github.com/Microsoft/TypeScript-React-Starter/issues/12 a + # Recommended React + TypeScript codebases to learn from - https://github.com/jaredpalmer/formik @@ -2218,6 +2240,7 @@ React Native Boilerplates: _contributed by [@spoeck](https://github.com/typescri + # Editor Tooling and Integration - VSCode @@ -2234,6 +2257,7 @@ React Native Boilerplates: _contributed by [@spoeck](https://github.com/typescri + # Linting > ⚠️Note that [TSLint is now in maintenance and you should try to use ESLint instead](https://medium.com/palantir/tslint-in-2019-1a144c2317a9). If you are interested in TSLint tips, please check this PR from [@azdanov](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/pull/14). The rest of this section just focuses on ESLint. [You can convert TSlint to ESlint with this tool](https://github.com/typescript-eslint/tslint-to-eslint-config). @@ -2340,6 +2364,7 @@ If you're looking for information on Prettier, check out the [Prettier](https:// + # Other React + TypeScript resources - me! @@ -2360,6 +2385,7 @@ If you're looking for information on Prettier, check out the [Prettier](https:// + # Recommended React + TypeScript talks - [Ultimate React Component Patterns with TypeScript](https://www.youtube.com/watch?v=_PBQ3if6Fmg), by Martin Hochel, GeeCon Prague 2018 @@ -2367,6 +2393,7 @@ If you're looking for information on Prettier, check out the [Prettier](https:// + # Time to Really Learn TypeScript Believe it or not, we have only barely introduced TypeScript here in this cheatsheet. There is a whole world of generic type logic that you will eventually get into, however it becomes far less dealing with React than just getting good at TypeScript so it is out of scope here. But at least you can get productive in React now :) @@ -2383,6 +2410,7 @@ It is worth mentioning some resources to help you get started: + # Example App - [Create React App TypeScript Todo Example 2020](https://github.com/laststance/create-react-app-typescript-todo-example-2020) From 9c879e9704defad4870d463f320ee06167236564 Mon Sep 17 00:00:00 2001 From: swyx Date: Wed, 19 Aug 2020 18:23:41 +0800 Subject: [PATCH 018/456] Update from-js.md --- docs/migration/from-js.md | 1 + 1 file changed, 1 insertion(+) diff --git a/docs/migration/from-js.md b/docs/migration/from-js.md index ea799855..cf03a5f1 100644 --- a/docs/migration/from-js.md +++ b/docs/migration/from-js.md @@ -8,6 +8,7 @@ title: From JS - [TypeStat](https://github.com/JoshuaKGoldberg/TypeStat) ([used by Codecademy](https://mobile.twitter.com/JoshuaKGoldberg/status/1159090281314160640)) - [TypeWiz](https://github.com/urish/typewiz) - [js-to-ts-converter](https://github.com/gregjacobs/js-to-ts-converter) +- [TS-migrate](https://medium.com/airbnb-engineering/ts-migrate-a-tool-for-migrating-to-typescript-at-scale-cd23bfeb5cc) from Airbnb ## Manual JS to TS Conversion From 3100ee39c8df9b1f7d84c2636716ec519831ca63 Mon Sep 17 00:00:00 2001 From: swyx Date: Thu, 20 Aug 2020 23:17:06 +0800 Subject: [PATCH 019/456] Update examples.md --- docs/basic/examples.md | 1 + 1 file changed, 1 insertion(+) diff --git a/docs/basic/examples.md b/docs/basic/examples.md index 47ed105e..0a94e128 100644 --- a/docs/basic/examples.md +++ b/docs/basic/examples.md @@ -5,3 +5,4 @@ sidebar_label: Examples --- - [Create React App TypeScript Todo Example 2020](https://github.com/laststance/create-react-app-typescript-todo-example-2020) +- [Ben Awad's 14 hour Fullstack React/GraphQL/TypeScript Tutorial](https://www.youtube.com/watch?v=I6ypD7qv3Z8) From 4f7b67aa1401949aacd00b0deec60e944a856e14 Mon Sep 17 00:00:00 2001 From: swyx Date: Fri, 21 Aug 2020 00:41:27 +0800 Subject: [PATCH 020/456] Create stale.yml --- .github/workflows/stale.yml | 17 +++++++++++++++++ 1 file changed, 17 insertions(+) create mode 100644 .github/workflows/stale.yml diff --git a/.github/workflows/stale.yml b/.github/workflows/stale.yml new file mode 100644 index 00000000..982f7d4d --- /dev/null +++ b/.github/workflows/stale.yml @@ -0,0 +1,17 @@ +# Number of days of inactivity before an issue becomes stale +daysUntilStale: 60 +# Number of days of inactivity before a stale issue is closed +daysUntilClose: 7 +# Issues with these labels will never be considered stale +exemptLabels: + - pinned + - security +# Label to use when marking an issue as stale +staleLabel: wontfix +# Comment to post when marking an issue as stale. Set to `false` to disable +markComment: > + This issue has been automatically marked as stale because it has not had + recent activity. It will be closed if no further activity occurs. Thank you + for your contributions! +# Comment to post when closing a stale issue. Set to `false` to disable +closeComment: false From 924e32e2662c4c89716cc8b1fe4c2b66607ff649 Mon Sep 17 00:00:00 2001 From: swyx Date: Fri, 21 Aug 2020 00:43:09 +0800 Subject: [PATCH 021/456] Rename .github/workflows/stale.yml to .github/stale.yml --- .github/{workflows => }/stale.yml | 0 1 file changed, 0 insertions(+), 0 deletions(-) rename .github/{workflows => }/stale.yml (100%) diff --git a/.github/workflows/stale.yml b/.github/stale.yml similarity index 100% rename from .github/workflows/stale.yml rename to .github/stale.yml From 671046fceafa55e271bba6fcdc288120eb6acada Mon Sep 17 00:00:00 2001 From: swyx Date: Fri, 21 Aug 2020 00:55:37 +0800 Subject: [PATCH 022/456] Update from-js.md --- docs/migration/from-js.md | 1 + 1 file changed, 1 insertion(+) diff --git a/docs/migration/from-js.md b/docs/migration/from-js.md index cf03a5f1..c0f6e110 100644 --- a/docs/migration/from-js.md +++ b/docs/migration/from-js.md @@ -9,6 +9,7 @@ title: From JS - [TypeWiz](https://github.com/urish/typewiz) - [js-to-ts-converter](https://github.com/gregjacobs/js-to-ts-converter) - [TS-migrate](https://medium.com/airbnb-engineering/ts-migrate-a-tool-for-migrating-to-typescript-at-scale-cd23bfeb5cc) from Airbnb +- [dts-gen](https://github.com/microsoft/dts-gen) - `dts-gen` is a tool that generates TypeScript definition files (.d.ts) from any JavaScript object. ## Manual JS to TS Conversion From 28506bf42ef6f700b27cf27f93808cec304d30a4 Mon Sep 17 00:00:00 2001 From: swyx Date: Fri, 21 Aug 2020 01:10:00 +0800 Subject: [PATCH 023/456] Update types.md --- docs/basic/troubleshooting/types.md | 19 ++++++++++++++++++- 1 file changed, 18 insertions(+), 1 deletion(-) diff --git a/docs/basic/troubleshooting/types.md b/docs/basic/troubleshooting/types.md index f923ad71..4a50e4ed 100644 --- a/docs/basic/troubleshooting/types.md +++ b/docs/basic/troubleshooting/types.md @@ -370,10 +370,14 @@ let baz2: SubIsntType2 = { ## The Types I need don't exist! -What's more annoying than modules with unexported types? Modules that are **untyped**! +What's more annoying than modules with unexported types? Modules that are **untyped**! + +> Before you proceed - make sure you have checked that types don't exist in [DefinitelyTyped](https://github.com/DefinitelyTyped/DefinitelyTyped) or [TypeSearch](https://microsoft.github.io/TypeSearch/) Fret not! There are more than a couple of ways in which you can solve this problem. +### Slapping `any` on everything + A **lazier** way would be to create a new type declaration file, say `typedec.d.ts`– if you don't already have one. Ensure that the path to file is resolvable by TypeScript by checking the `include` array in the `tsconfig.json` file at the root of your directory. ```json @@ -398,6 +402,19 @@ This one-liner alone is enough if you just need it to work without errors. A eve This solution works well as a workaround if you have less than a couple untyped modules. Anything more, you now have a ticking type-bomb in your hands. The only way of circumventing this problem would be to define the missing types for those untyped modules as explained in the following sections. +### Autogenerate types + +You can use TypeScript with `--allowJs` and `--declaration` to see TypeScript's "best guess" at the types of the library. + +If this doesn't work well enough, use [`dts-gen`](https://github.com/Microsoft/dts-gen) to use the runtime shape of the object to accurately enumerate all available properties. This tends to be very accurate, BUT the tool does not yet support scraping JSDoc comments to populate additional types. + +```bash +npm install -g dts-gen +dts-gen -m +``` + +There are other automated JS to TS conversion tools and migration strategies - see [our MIGRATION cheatsheet](https://react-typescript-cheatsheet.netlify.app/docs/migration/from_js). + ### Typing Exported Hooks Typing Hooks is just like typing pure functions. From 4d3cf61143c9b50b990e4171fede2589d609d6df Mon Sep 17 00:00:00 2001 From: swyx Date: Fri, 21 Aug 2020 01:10:17 +0800 Subject: [PATCH 024/456] Update types.md --- docs/basic/troubleshooting/types.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/basic/troubleshooting/types.md b/docs/basic/troubleshooting/types.md index 4a50e4ed..8077043b 100644 --- a/docs/basic/troubleshooting/types.md +++ b/docs/basic/troubleshooting/types.md @@ -4,7 +4,7 @@ title: "Troubleshooting Handbook: Types" sidebar_label: Types --- -> ⚠️ Have you read [the TypeScript FAQ](https://github.com/microsoft/TypeScript/wiki/FAQ)?) Your answer might be there! +> ⚠️ Have you read [the TypeScript FAQ](https://github.com/microsoft/TypeScript/wiki/FAQ?) Your answer might be there! Facing weird type errors? You aren't alone. This is the hardest part of using TypeScript with React. Be patient - you are learning a new language after all. However, the more you get good at this, the less time you'll be working _against_ the compiler and the more the compiler will be working _for_ you! From 1eafe42bc411c4f14fd298fc8a9ab4921aaa8e0d Mon Sep 17 00:00:00 2001 From: swyx Date: Fri, 21 Aug 2020 02:24:54 +0800 Subject: [PATCH 025/456] Update context.md --- docs/basic/getting-started/context.md | 49 +++++++++++++++++++++++++++ 1 file changed, 49 insertions(+) diff --git a/docs/basic/getting-started/context.md b/docs/basic/getting-started/context.md index 57292287..1a7d475d 100644 --- a/docs/basic/getting-started/context.md +++ b/docs/basic/getting-started/context.md @@ -3,6 +3,55 @@ id: context title: Context --- +## Basic Example + + +```tsx +import * as React from 'react'; + +interface AppContextInterface { + name: string, + author: string, + url: string +} + +const AppCtx = React.createContext(null); + +// Provider in your app + +const sampleAppContext: AppContextInterface = { + name: 'Using React Context in a Typescript App', + author: 'thehappybug', + url: 'http://www.example.com' +}; + +export const App = () => ( + + ... + +); + +// Consume in your app + +export const PostInfo = () => { + const appContext = React.useContext(AppCtx) + return ( +
+ Name: {appContext.name}, + Author: {appContext.author}, + Url: {appContext.url} +
+ ) +} +``` + +You can also use the [Class.contextType](https://reactjs.org/docs/context.html#classcontexttype) or [Context.Consumer](https://reactjs.org/docs/context.html#contextconsumer) API, let us know if you have trouble with that. + + +*[Thanks to @AlvSovereign](https://github.com/typescript-cheatsheets/react/issues/97)* + +## Extended Example + Using `React.createContext` with an empty object as default value. ```tsx From 39736acb62c00d7975425ff475271970badff6d3 Mon Sep 17 00:00:00 2001 From: swyx Date: Fri, 21 Aug 2020 02:29:58 +0800 Subject: [PATCH 026/456] add record type example closes https://github.com/typescript-cheatsheets/react/issues/247 --- docs/basic/getting-started/basic-type-examples.md | 9 +++++++-- 1 file changed, 7 insertions(+), 2 deletions(-) diff --git a/docs/basic/getting-started/basic-type-examples.md b/docs/basic/getting-started/basic-type-examples.md index a3bc27a1..17c24e3f 100644 --- a/docs/basic/getting-started/basic-type-examples.md +++ b/docs/basic/getting-started/basic-type-examples.md @@ -12,10 +12,10 @@ type AppProps = { names: string[]; /** string literals to specify exact string values, with a union type to join them together */ status: "waiting" | "success"; - /** any object as long as you dont use its properties (not common) */ + /** any object as long as you dont use its properties (NOT COMMON but useful as placeholder) */ obj: object; obj2: {}; // almost the same as `object`, exactly the same as `Object` - /** an object with defined properties (preferred) */ + /** an object with any number of properties (PREFERRED) */ obj3: { id: string; title: string; @@ -25,6 +25,11 @@ type AppProps = { id: string; title: string; }[]; + /** a dict object with any number of properties of the same type */ + dict1: { + [key: string]: MyTypeHere; + }; + dict2: Record; // equivalent to dict1 /** any function as long as you don't invoke it (not recommended) */ onSomething: Function; /** function that doesn't take or return anything (VERY COMMON) */ From 417d163b3910a042067db0b6f4be2630109fd3c3 Mon Sep 17 00:00:00 2001 From: swyx Date: Fri, 21 Aug 2020 02:36:27 +0800 Subject: [PATCH 027/456] format' gpom --- docs/basic/getting-started/context.md | 37 ++++++++++++--------------- docs/basic/troubleshooting/types.md | 6 ++--- docs/migration/from-js.md | 2 +- 3 files changed, 20 insertions(+), 25 deletions(-) diff --git a/docs/basic/getting-started/context.md b/docs/basic/getting-started/context.md index 1a7d475d..900c4b3d 100644 --- a/docs/basic/getting-started/context.md +++ b/docs/basic/getting-started/context.md @@ -5,14 +5,13 @@ title: Context ## Basic Example - ```tsx -import * as React from 'react'; +import * as React from "react"; interface AppContextInterface { - name: string, - author: string, - url: string + name: string; + author: string; + url: string; } const AppCtx = React.createContext(null); @@ -20,35 +19,31 @@ const AppCtx = React.createContext(null); // Provider in your app const sampleAppContext: AppContextInterface = { - name: 'Using React Context in a Typescript App', - author: 'thehappybug', - url: 'http://www.example.com' + name: "Using React Context in a Typescript App", + author: "thehappybug", + url: "http://www.example.com", }; export const App = () => ( - - ... - + ... ); // Consume in your app export const PostInfo = () => { - const appContext = React.useContext(AppCtx) + const appContext = React.useContext(AppCtx); return ( -
- Name: {appContext.name}, - Author: {appContext.author}, - Url: {appContext.url} -
- ) -} +
+ Name: {appContext.name}, Author: {appContext.author}, Url:{" "} + {appContext.url} +
+ ); +}; ``` You can also use the [Class.contextType](https://reactjs.org/docs/context.html#classcontexttype) or [Context.Consumer](https://reactjs.org/docs/context.html#contextconsumer) API, let us know if you have trouble with that. - -*[Thanks to @AlvSovereign](https://github.com/typescript-cheatsheets/react/issues/97)* +_[Thanks to @AlvSovereign](https://github.com/typescript-cheatsheets/react/issues/97)_ ## Extended Example diff --git a/docs/basic/troubleshooting/types.md b/docs/basic/troubleshooting/types.md index 8077043b..a7182ce6 100644 --- a/docs/basic/troubleshooting/types.md +++ b/docs/basic/troubleshooting/types.md @@ -370,7 +370,7 @@ let baz2: SubIsntType2 = { ## The Types I need don't exist! -What's more annoying than modules with unexported types? Modules that are **untyped**! +What's more annoying than modules with unexported types? Modules that are **untyped**! > Before you proceed - make sure you have checked that types don't exist in [DefinitelyTyped](https://github.com/DefinitelyTyped/DefinitelyTyped) or [TypeSearch](https://microsoft.github.io/TypeSearch/) @@ -404,9 +404,9 @@ This solution works well as a workaround if you have less than a couple untyped ### Autogenerate types -You can use TypeScript with `--allowJs` and `--declaration` to see TypeScript's "best guess" at the types of the library. +You can use TypeScript with `--allowJs` and `--declaration` to see TypeScript's "best guess" at the types of the library. -If this doesn't work well enough, use [`dts-gen`](https://github.com/Microsoft/dts-gen) to use the runtime shape of the object to accurately enumerate all available properties. This tends to be very accurate, BUT the tool does not yet support scraping JSDoc comments to populate additional types. +If this doesn't work well enough, use [`dts-gen`](https://github.com/Microsoft/dts-gen) to use the runtime shape of the object to accurately enumerate all available properties. This tends to be very accurate, BUT the tool does not yet support scraping JSDoc comments to populate additional types. ```bash npm install -g dts-gen diff --git a/docs/migration/from-js.md b/docs/migration/from-js.md index c0f6e110..66ec7670 100644 --- a/docs/migration/from-js.md +++ b/docs/migration/from-js.md @@ -8,7 +8,7 @@ title: From JS - [TypeStat](https://github.com/JoshuaKGoldberg/TypeStat) ([used by Codecademy](https://mobile.twitter.com/JoshuaKGoldberg/status/1159090281314160640)) - [TypeWiz](https://github.com/urish/typewiz) - [js-to-ts-converter](https://github.com/gregjacobs/js-to-ts-converter) -- [TS-migrate](https://medium.com/airbnb-engineering/ts-migrate-a-tool-for-migrating-to-typescript-at-scale-cd23bfeb5cc) from Airbnb +- [TS-migrate](https://medium.com/airbnb-engineering/ts-migrate-a-tool-for-migrating-to-typescript-at-scale-cd23bfeb5cc) from Airbnb - [dts-gen](https://github.com/microsoft/dts-gen) - `dts-gen` is a tool that generates TypeScript definition files (.d.ts) from any JavaScript object. ## Manual JS to TS Conversion From d467788fe6a0e8db13bc3528e3f4c8556a40d59e Mon Sep 17 00:00:00 2001 From: swyx Date: Fri, 21 Aug 2020 09:53:59 +0800 Subject: [PATCH 028/456] reorg Advanced guides (#272) Co-authored-by: swyx --- CONTRIBUTING.md | 36 + README.md | 2 +- .../guides/conditionally-rendering.md | 54 -- docs/advanced/guides/extract-props.md | 47 - docs/advanced/guides/generic-components.md | 203 ---- docs/advanced/guides/handling-exceptions.md | 109 --- docs/advanced/guides/hocs.md | 6 - docs/advanced/guides/omit-attr.md | 47 - .../advanced/guides/polymorphic-components.md | 23 - docs/advanced/guides/props-must-pass-both.md | 18 - .../guides/props-one-other-not-both.md | 32 - .../guides/props-optionally-pass-one.md | 51 - docs/advanced/guides/render-props.md | 31 - docs/advanced/guides/third-party-libs.md | 6 - .../guides/type-component-diff-props.md | 171 ---- docs/advanced/guides/type-zoo.md | 6 - docs/advanced/patterns_by_usecase.md | 868 ++++++++++++++++++ .../{patterns.md => patterns_by_version.md} | 30 +- docs/advanced/utility-types.md | 4 +- docs/basic/recommended/codebases.md | 29 + docs/basic/recommended/other-resources.md | 20 - docs/basic/recommended/resources.md | 42 +- docs/migration/from-js.md | 4 +- package.json | 1 + website/sidebars.json | 28 +- 25 files changed, 988 insertions(+), 880 deletions(-) delete mode 100644 docs/advanced/guides/conditionally-rendering.md delete mode 100644 docs/advanced/guides/extract-props.md delete mode 100644 docs/advanced/guides/generic-components.md delete mode 100644 docs/advanced/guides/handling-exceptions.md delete mode 100644 docs/advanced/guides/hocs.md delete mode 100644 docs/advanced/guides/omit-attr.md delete mode 100644 docs/advanced/guides/polymorphic-components.md delete mode 100644 docs/advanced/guides/props-must-pass-both.md delete mode 100644 docs/advanced/guides/props-one-other-not-both.md delete mode 100644 docs/advanced/guides/props-optionally-pass-one.md delete mode 100644 docs/advanced/guides/render-props.md delete mode 100644 docs/advanced/guides/third-party-libs.md delete mode 100644 docs/advanced/guides/type-component-diff-props.md delete mode 100644 docs/advanced/guides/type-zoo.md create mode 100644 docs/advanced/patterns_by_usecase.md rename docs/advanced/{patterns.md => patterns_by_version.md} (93%) create mode 100644 docs/basic/recommended/codebases.md delete mode 100644 docs/basic/recommended/other-resources.md diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index eb21ae9d..6d43425c 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -10,3 +10,39 @@ I thought I should lay out some core principles that we will follow so that this 4. **Add TypeScript Playground Links**: Whenever adding a code example longer than four lines, add a link to the TypeScript Playground with the code. Use the default compiler Playground options. That's all I've got! Again, really happy you are thinking about helping out, who knows, the person who you might be helping is yourself in future! + +## Project structure + +- All content is in `/docs` + - the `/docs/basic` is compiled into `README.md` to preserve GitHub readability via GitHub action, thanks +- `/website` consumes the `/docs` content, which is a [Docusaurus 2](https://docusaurus.io/) site, which also has [Algolia search](https://www.algolia.com/) (thanks to both teams for their support!) + +The website is deployed to Netlify on swyx's personal account. + +To run the docsite locally: + +```bash +yarn # install deps +## make sure deps are installed in /website too +cd website && yarn start +``` + +example output from successful startup + +``` +yarn run v1.22.4 +warning package.json: No license field +$ docusaurus start +Starting the development server... + +✔ Client + Compiled successfully in 9.61s + +ℹ ｢wds｣: Project is running at http://localhost:3000/ +ℹ ｢wds｣: webpack output is served from / +ℹ ｢wds｣: Content not from webpack is served from /Users/wanshawn/Work/react-typescript-cheatsheet/website +ℹ ｢wds｣: 404s will fallback to /index.html + +✔ Client + Compiled successfully in 116.41ms +``` diff --git a/README.md b/README.md index eaa5dd55..4f19bd25 100644 --- a/README.md +++ b/README.md @@ -25,7 +25,7 @@
-:wave: This repo is maintained by [@swyx](https://twitter.com/swyx), [@ferdaber](https://twitter.com/ferdaber), [@eps1lon](https://twitter.com/sebsilbermann), [@IslamAttrash](https://twitter.com/IslamAttrash), [@jsjoeio](https://twitter.com/jsjoeio) and [@arvindcheenu](https://twitter.com/arvincheenu), we're so happy you want to try out TypeScript with React! If you see anything wrong or missing, please [file an issue](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/issues/new/choose)! :+1: +:wave: This repo is maintained by [@swyx](https://twitter.com/swyx), [@ferdaber](https://twitter.com/ferdaber), [@eps1lon](https://twitter.com/sebsilbermann), [@jsjoeio](https://twitter.com/jsjoeio) and [@arvindcheenu](https://twitter.com/arvincheenu), we're so happy you want to try out TypeScript with React! If you see anything wrong or missing, please [file an issue](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/issues/new/choose)! :+1:
diff --git a/docs/advanced/guides/conditionally-rendering.md b/docs/advanced/guides/conditionally-rendering.md deleted file mode 100644 index c18bca78..00000000 --- a/docs/advanced/guides/conditionally-rendering.md +++ /dev/null @@ -1,54 +0,0 @@ ---- -id: conditionally_rendering -title: Conditionally Rendering Components ---- - -Use [type guards](https://basarat.gitbooks.io/typescript/docs/types/typeGuard.html#user-defined-type-guards)! - -```tsx -// Button props -type ButtonProps = React.ButtonHTMLAttributes & { - href?: undefined; -}; - -// Anchor props -type AnchorProps = React.AnchorHTMLAttributes & { - href?: string; -}; - -// Input/output options -type Overload = { - (props: ButtonProps): JSX.Element; - (props: AnchorProps): JSX.Element; -}; - -// Guard to check if href exists in props -const hasHref = (props: ButtonProps | AnchorProps): props is AnchorProps => - "href" in props; - -// Component -const Button: Overload = (props: ButtonProps | AnchorProps) => { - // anchor render - if (hasHref(props)) return ; - // button render - return - {/* 😭 Error, `disabled` doesnt exist on anchor element */} - - - ); -} -``` - -[View in the TypeScript Playground](https://www.typescriptlang.org/play/?jsx=2#code/JYWwDg9gTgLgBAJQKYEMDG8BmUIjgcilQ3wFgAoAekrgCEBXGGCAOzjBzAGcKYBPMEjqNmLAAqcucALyJiMAHQMmrABIAVALIAZAIJMowAEaMkXADwady0QFEANkhBIWMAHxwAZHADeFOHAAFkSYAPwAXHD0LAAmSJjALEgxANwUAL5p5BTUcLosaIHQ7JK8AkL5hdASENwycuiKlUVQVnoGxqYWbc3QDk4u7l6+-kEhEXBcMIYsAOZZmRQ5NACSLGCMlBCMG-C1MMCsPOT8gnAA8gBuSFD2ECgx9X7kAQAUHLVckTasNdwAlJEAFIAZQAGgp+s5XFk3h9uJFelA-lxAXBQRCoYMFlllnAAOL0FBQR7MOCFJBoADWcGAmDG8TgSAAHsAplJEiVPhQ0Ed4IEUFxVCF6u9JN8RL9JHAAD55AotFFo+EcqRIlEyNyjABEwXi2tpbBVuKoNAAwrhIElXDy+cIVCxIlcbncHqKVRKHRq5erJP9NSMXnBcigFcUiLEbqM6XBXgKhSExZ9-v6iDB6FA2OYUL4FHmVelg25YcGaCYHXAI3EoKM0xms+XRLn85JC5RixkTbkAKpcFCzJAUTDRDCHNi6MBgV7+54BOuZ2OjALmLVBgIBHyUABUcEAvBuAOD28vZ7HBZhAII8t5R0kv1+YfmwYMSBzBpNqAPpGeyhqkGvWYN9AiYBFqAAd3AhQzwgWZHAUXkQG1Vd12QuB1DMGBb2XSgHyQlDNx3XdAFo9uBbCgHAoAAGjgAADGI2RQL9kmouAYggMxXCZVkpjgVg4FDKooCZRxoXgK8bzXO8HxY+jGMef832ZRDMPXNCpmU8xsMlFhcKw3D-gWIA) diff --git a/docs/advanced/guides/extract-props.md b/docs/advanced/guides/extract-props.md deleted file mode 100644 index d7ef6673..00000000 --- a/docs/advanced/guides/extract-props.md +++ /dev/null @@ -1,47 +0,0 @@ ---- -id: extract_props -title: "Props: Extracting Prop Types of a Component" ---- - -_(Contributed by [@ferdaber](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/issues/63))_ - -There are a lot of places where you want to reuse some slices of props because of prop drilling, -so you can either export the props type as part of the module or extract them (either way works). - -The advantage of extracting the prop types is that you won't need to export everything, and a refactor of the source of truth component will propagate to all consuming components. - -```ts -import { ComponentProps, JSXElementConstructor } from "react"; - -// goes one step further and resolves with propTypes and defaultProps properties -type ApparentComponentProps< - C extends keyof JSX.IntrinsicElements | JSXElementConstructor -> = C extends JSXElementConstructor - ? JSX.LibraryManagedAttributes - : ComponentProps; -``` - -You can also use them to strongly type custom event handlers if they're not written at the call sites themselves -(i.e. inlined with the JSX attribute): - -```tsx -// my-inner-component.tsx -export function MyInnerComponent(props: { - onSomeEvent( - event: ComplexEventObj, - moreArgs: ComplexArgs - ): SomeWeirdReturnType; -}) { - /* ... */ -} - -// my-consuming-component.tsx -export function MyConsumingComponent() { - // event and moreArgs are contextually typed along with the return value - const theHandler: Props["onSomeEvent"] = ( - event, - moreArgs - ) => {}; - return ; -} -``` diff --git a/docs/advanced/guides/generic-components.md b/docs/advanced/guides/generic-components.md deleted file mode 100644 index c5393db3..00000000 --- a/docs/advanced/guides/generic-components.md +++ /dev/null @@ -1,203 +0,0 @@ ---- -id: generic_components -title: Generic Components ---- - -Just as you can make generic functions and classes in TypeScript, you can also make generic components to take advantage of the type system for reusable type safety. Both Props and State can take advantage of the same generic types, although it probably makes more sense for Props than for State. You can then use the generic type to annotate types of any variables defined inside your function / class scope. - -```tsx -interface Props { - items: T[]; - renderItem: (item: T) => React.ReactNode; -} -function List(props: Props) { - const { items, renderItem } = props; - const [state, setState] = React.useState([]); // You can use type T in List function scope. - return ( -
- {items.map(renderItem)} - - {JSON.stringify(state, null, 2)} -
- ); -} -``` - -You can then use the generic components and get nice type safety through type inference: - -```tsx -ReactDOM.render( - ( -
  • - {/* Error: Property 'toPrecision' does not exist on type 'string'. */} - {item.toPrecision(3)} -
    • - )} - />, - document.body -); -``` - -As of [TS 2.9](#typescript-29), you can also supply the type parameter in your JSX to opt out of type inference: - -```tsx -ReactDOM.render( - - items={["a", "b"]} // Error: Type 'string' is not assignable to type 'number'. - renderItem={(item) =>
  • {item.toPrecision(3)}
    • } - />, - document.body -); -``` - -You can also use Generics using fat arrow function style: - -```tsx -interface Props { - items: T[]; - renderItem: (item: T) => React.ReactNode; -} - -// Note the before the function definition. -// You can't use just `` as it will confuse the TSX parser whether it's a JSX tag or a Generic Declaration. -// You can also use https://github.com/microsoft/TypeScript/issues/15713#issuecomment-499474386 -const List = (props: Props) => { - const { items, renderItem } = props; - const [state, setState] = React.useState([]); // You can use type T in List function scope. - return ( -
    - {items.map(renderItem)} - - {JSON.stringify(state, null, 2)} -
    - ); -}; -``` - -The same for using classes: (Credit: [Karol Majewski](https://twitter.com/WrocTypeScript/status/1163234064343736326)'s [gist](https://gist.github.com/karol-majewski/befaf05af73c7cb3248b4e084ae5df71)) - -```tsx -interface Props { - items: T[]; - renderItem: (item: T) => React.ReactNode; -} - -interface State { - items: T[]; -} - -class List extends React.PureComponent, State> { - // You can use type T inside List class. - state: Readonly> = { - items: [], - }; - render() { - const { items, renderItem } = this.props; - // You can use type T inside List class. - const clone: T[] = items.slice(0); - return ( -
    - {items.map(renderItem)} - - {JSON.stringify(this.state, null, 2)} -
    - ); - } -} -``` - -Though you can't use Generic Type Parameters for Static Members: - -```tsx -class List extends React.PureComponent, State> { - // Static members cannot reference class type parameters.ts(2302) - static getDerivedStateFromProps(props: Props, state: State) { - return { items: props.items }; - } -} -``` - -To fix this you need to convert your static function to a type inferred function: - -```tsx -class List extends React.PureComponent, State> { - static getDerivedStateFromProps(props: Props, state: State) { - return { items: props.items }; - } -} -``` - -### Generic components with children - -`children` is usually not defined as a part of the props type. Unless `children` are explicitly defined as a part of the `props` type, an attempt to use `props.children` in JSX or in the function body will fail: - -```tsx -interface WrapperProps { - item: T; - renderItem: (item: T) => React.ReactNode; -} - -/* Property 'children' does not exist on type 'WrapperProps'. */ -const Wrapper = (props: WrapperProps) => { - return ( -
    - {props.renderItem(props.item)} - {props.children} -
    - ); -}; - -/* -Type '{ children: string; item: string; renderItem: (item: string) => string; }' is not assignable to type 'IntrinsicAttributes & WrapperProps'. - Property 'children' does not exist on type 'IntrinsicAttributes & WrapperProps'. -*/ - -const wrapper = ( - item}> - {test} - -); -``` - -[View in the TypeScript Playground](https://www.typescriptlang.org/play/?jsx=2#code/JYWwDg9gTgLgBAJQKYEMDG8BmUIjgcilQ3wFgAoC4AOxiSk3STgHUoUwx6AFHMAZwA8AFQB8cAN4U4cYHRAAuOMIDc0uEWoATegEl5SgBRyki5QEo4AXnHJ0MAHR2MAOQg615GWgAWwADZamkrOjqFuHhQAvhQUAPQAVHC8EFywAJ4EvgFBSNT4cFoQSPxw1BDwSAAewPzwENRwMOlcBGwcaSkCIqL4DnAJcRRoDXWs7Jz01nAicNV02qUSUaKGYHz8Su2TUF1CYpY2kupEMACuUI2G6jKCWsAAbqI3MpLrqfwOmjpQ+qZrGwcJhA5hiXleMgk7wEDmygU0YIhgji9ye6nMniinniCQowhazHwEjgcNy1CUdSgNAA5ipZAY4JSaXTvnoGcYGUzqNTDuIubS4FECrUyhU4Ch+PxgNTqCgAEb+ZgwCBNAkEXS0KnUKVoACCMBgVLlZzopQAZOMOjwNoJ+b0HOouvRmlk-PC8gUiiVRZUamMGqrWvgNYaaDr9aHjaa4Bbtp0bXa+hRBrFyCNtfBTfArHBDLyZqjRAAJJD+fwqrPIwvDUbwADuEzS02u4MEcamwKsACIs12NHkfn8QFYJMDrOJgSsXhIs4iZnF21BnuQMUA) - -To work around that, either add `children` to the `WrapperProps` definition (possibly narrowing down its type, as needed): - -```tsx -interface WrapperProps { - item: T; - renderItem: (item: T) => React.ReactNode; - children: string; // The component will only accept a single string child -} - -const Wrapper = (props: WrapperProps) => { - return ( -
    - {props.renderItem(props.item)} - {props.children} -
    - ); -}; -``` - -or wrap the type of the props in `React.PropsWithChildren` (this is what `React.FC<>` does): - -```tsx -interface WrapperProps { - item: T; - renderItem: (item: T) => React.ReactNode; -} - -const Wrapper = ( - props: React.PropsWithChildren> -) => { - return ( -
    - {props.renderItem(props.item)} - {props.children} -
    - ); -}; -``` diff --git a/docs/advanced/guides/handling-exceptions.md b/docs/advanced/guides/handling-exceptions.md deleted file mode 100644 index 03813912..00000000 --- a/docs/advanced/guides/handling-exceptions.md +++ /dev/null @@ -1,109 +0,0 @@ ---- -id: handling_exceptions -title: Handling Exceptions ---- - -You can provide good information when bad things happen. - -```ts -class InvalidDateFormatError extends RangeError {} -class DateIsInFutureError extends RangeError {} - -/** - * // optional docblock - * @throws {InvalidDateFormatError} The user entered date incorrectly - * @throws {DateIsInFutureError} The user entered date in future - * - */ -function parse(date: string) { - if (!isValid(date)) - throw new InvalidDateFormatError("not a valid date format"); - if (isInFuture(date)) throw new DateIsInFutureError("date is in the future"); - // ... -} - -try { - // call parse(date) somewhere -} catch (e) { - if (e instanceof InvalidDateFormatError) { - console.error("invalid date format", e); - } else if (e instanceof DateIsInFutureError) { - console.warn("date is in future", e); - } else { - throw e; - } -} -``` - -[View in TypeScript Playground](https://www.typescriptlang.org/play/?jsx=2#code/JYWwDg9gTgLgBAJQKYEMDG8BmUIjgcilQ3wFgAoCtAGxQGc64BJAOwDcVrgATAERRhIAYtBACAolBxQ4SAB6CW3RghQsA5kknS4AbwC+VWgzj9BTOqyEBXGNaLboshUiUq1mxzIMUKmaywYwBAscMB0AGqcPAAU3AJIAFxwdDBQwBoAlHoUcHBEdlCh8YJwAPxwadZIcMmYnHRIANwUhpTk-oEwwaHhVrb2SHEJyanpWTnkeWghqXAlSAByEADucAC8cCxIa2ZDmS1TcDMsc2j2RCwwextbO6YJw4KZuXCvBfah51Ku1wkAdJoYAAVUD7OAAPnmCWWK0BSBBYJiB1avnIAHoAFSY3KYuDo9FwCBgbohTjzCBoABG1EpAGtcXAAAIwAAWOBWjF0rA4XD4CREUDEMC8+jgwNZNWsjRkvyQRG40NKGRmPww1AAnoyWezVly9hZ+oUtFJoGKJVKZbIrvKkIqFmFQv5jbjcei-AEgiE4GAUFBGk8kik0hl1NldK9gJg4DEAIThKJ8wOZF5HPJsjl3NY86L8wSC4VeGIAIhYEHgKDgvJ4SpqmFEAmLKKOUZjfRYNmNyeyGdWWYe5ksHYGDlNUBLDvCjsqkrgzsGTcOeQJcH+a9R7TSGsmy8JaE41B9foDC2ydFwO0lRFaxwEaFZMaQ4cj0ZiNQyqTUaCQEGjOb5ewFhIY7PmmxyzBA1BIP88rSCWGTVvaCRzg2MDFgANLIzZ5GKSDUI0YSvu+pwwF+P7RgaQ6doMXigXk0wQVB-wrH6LATshU4ZHOI5IBhWFLnAuH4TUEZgb2azNK8bT6EAA) - -Simply throwing an exception is fine, however it would be nice to make TypeScript remind the consumer of your code to handle your exception. We can do that just by returning instead of throwing: - -```ts -function parse( - date: string -): Date | InvalidDateFormatError | DateIsInFutureError { - if (!isValid(date)) - return new InvalidDateFormatError("not a valid date format"); - if (isInFuture(date)) return new DateIsInFutureError("date is in the future"); - // ... -} - -// now consumer *has* to handle the errors -let result = parse("mydate"); -if (result instanceof InvalidDateFormatError) { - console.error("invalid date format", result.message); -} else if (result instanceof DateIsInFutureError) { - console.warn("date is in future", result.message); -} else { - /// use result safely -} - -// alternately you can just handle all errors -if (result instanceof Error) { - console.error("error", result); -} else { - /// use result safely -} -``` - -You can also describe exceptions with special-purpose data types (don't say monads...) like the `Try`, `Option` (or `Maybe`), and `Either` data types: - -```ts -interface Option { - flatMap(f: (value: T) => None): None; - flatMap(f: (value: T) => Option): FormikOption; - getOrElse(value: T): T; -} -class Some implements Option { - constructor(private value: T) {} - flatMap(f: (value: T) => None): None; - flatMap(f: (value: T) => Some): Some; - flatMap(f: (value: T) => Option): Option { - return f(this.value); - } - getOrElse(): T { - return this.value; - } -} -class None implements Option { - flatMap(): None { - return this; - } - getOrElse(value: U): U { - return value; - } -} - -// now you can use it like: -let result = Option(6) // Some - .flatMap((n) => Option(n * 3)) // Some - .flatMap((n = new None())) // None - .getOrElse(7); - -// or: -let result = ask() // Option - .flatMap(parse) // Option - .flatMap((d) => new Some(d.toISOString())) // Option - .getOrElse("error parsing string"); -``` diff --git a/docs/advanced/guides/hocs.md b/docs/advanced/guides/hocs.md deleted file mode 100644 index 6ae06582..00000000 --- a/docs/advanced/guides/hocs.md +++ /dev/null @@ -1,6 +0,0 @@ ---- -id: hocs -title: Higher Order Components (HOCs) ---- - -**There is now a dedicated [HOC cheatsheet](../../hoc/index.md) you can refer to get some practice on HOCs.** diff --git a/docs/advanced/guides/omit-attr.md b/docs/advanced/guides/omit-attr.md deleted file mode 100644 index ebeb9e84..00000000 --- a/docs/advanced/guides/omit-attr.md +++ /dev/null @@ -1,47 +0,0 @@ ---- -id: omit_attr -title: Omit attribute from a type ---- - -Note: [Omit was added as a first class utility in TS 3.5](https://www.typescriptlang.org/docs/handbook/utility-types.html#omittk)! 🎉 - -Sometimes when intersecting types, we want to define our own version of an attribute. For example, I want my component to have a `label`, but the type I am intersecting with also has a `label` attribute. Here's how to extract that out: - -```tsx -export interface Props { - label: React.ReactNode; // this will conflict with the InputElement's label -} - -// this comes inbuilt with TS 3.5 -type Omit = Pick>; - -// usage -export const Checkbox = ( - props: Props & Omit, "label"> -) => { - const { label } = props; - return ( -
    - - {label} -
    - ); -}; -``` - -When your component defines multiple props, chances of those conflicts increase. However you can explicitly state that all your fields should be removed from the underlying component using the `keyof` operator: - -```tsx -export interface Props { - label: React.ReactNode; // conflicts with the InputElement's label - onChange: (text: string) => void; // conflicts with InputElement's onChange -} - -export const Textbox = ( - props: Props & Omit, keyof Props> -) => { - // implement Textbox component ... -}; -``` diff --git a/docs/advanced/guides/polymorphic-components.md b/docs/advanced/guides/polymorphic-components.md deleted file mode 100644 index 5a5266d9..00000000 --- a/docs/advanced/guides/polymorphic-components.md +++ /dev/null @@ -1,23 +0,0 @@ ---- -id: polymorphic_components -title: Polymorphic Components ---- - -> passing a component to be rendered, e.g. with `as` props - -`ElementType` is pretty useful to cover most types that can be passed to createElement e.g. - -```tsx -function PassThrough(props: { as: React.ElementType }) { - const { as: Component } = props; - - return ; -} -``` - -For more info you can refer to these resources: - -- https://blog.andrewbran.ch/polymorphic-react-components/ -- https://github.com/kripod/react-polymorphic-box - -[Thanks @eps1lon](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/pull/69) for this diff --git a/docs/advanced/guides/props-must-pass-both.md b/docs/advanced/guides/props-must-pass-both.md deleted file mode 100644 index 42f09037..00000000 --- a/docs/advanced/guides/props-must-pass-both.md +++ /dev/null @@ -1,18 +0,0 @@ ---- -id: props_one_other_not_both -title: "Props: Must Pass Both" ---- - -```tsx -type OneOrAnother = - | (T1 & { [K in keyof T2]?: undefined }) - | (T2 & { [K in keyof T1]?: undefined }); - -type Props = OneOrAnother<{ a: string; b: string }, {}>; - -const a: Props = { a: "a" }; // error -const b: Props = { b: "b" }; // error -const ab: Props = { a: "a", b: "b" }; // ok -``` - -Thanks [diegohaz](https://twitter.com/kentcdodds/status/1085655423611367426) diff --git a/docs/advanced/guides/props-one-other-not-both.md b/docs/advanced/guides/props-one-other-not-both.md deleted file mode 100644 index 47fc823f..00000000 --- a/docs/advanced/guides/props-one-other-not-both.md +++ /dev/null @@ -1,32 +0,0 @@ ---- -id: props_one_other_not_both -title: "Props: One or the Other but not Both" ---- - -Use the `in` keyword, function overloading, and union types to make components that take either one or another sets of props, but not both: - -```tsx -type Props1 = { foo: string }; -type Props2 = { bar: string }; - -function MyComponent(props: Props1 | Props2) { - if ("foo" in props) { - // props.bar // error - return
    {props.foo}
    ; - } else { - // props.foo // error - return
    {props.bar}
    ; - } -} -const UsageComponent: React.FC = () => ( -
    - - - {/* // invalid */} -
    -); -``` - -[View in the TypeScript Playground](https://www.typescriptlang.org/play/?jsx=2#code/JYWwDg9gTgLgBAJQKYEMDG8BmUIjgcilQ3wFgAoCmATzCTgAUcwBnARjgF44BvOTCBABccFjCjAAdgHM4AXwDcVWvSYRWAJi684AIxRQRYiTPlLK5TAFdJGYBElwAstQDCuSJKSSYACjDMLCJqrBwAPoyBGgCUvBRwcMCYcL4ARAIQqYmOAeossTzxCXAA9CVwuawAdPpQpeVIUDhQRQlEMFZQjgA8ACbAAG4AfDyVLFUZct0l-cPmCXJwSAA2LPSF5MX1FYETgtuNza1w7Z09syNjNQZTM4ND8-IUchRoDmJwAKosKNJI7uAHN4YCJkOgYFUAGKubS+WKcIYpIp9e7HbouAGeYH8QScdKCLIlIZojEeIE+PQGPG1QnEzbFHglABUcHRbjJXgpGTxGSytWpBlSRO2UgGKGWwF6cCZJRe9OmFwo0QUQA) - -Further reading: [how to ban passing `{}` if you have a `NoFields` type.](http://www.javiercasas.com/articles/typescript-impossible-states-irrepresentable) diff --git a/docs/advanced/guides/props-optionally-pass-one.md b/docs/advanced/guides/props-optionally-pass-one.md deleted file mode 100644 index 86df3a32..00000000 --- a/docs/advanced/guides/props-optionally-pass-one.md +++ /dev/null @@ -1,51 +0,0 @@ ---- -id: props_optionally_pass_one -title: "Props: Can Optionally Pass One Only If the Other Is Passed" ---- - -Say you want a Text component that gets truncated if `truncate` prop is passed but expands to show the full text when `expanded` prop is passed (e.g. when the user clicks the text). - -You want to allow `expanded` to be passed only if `truncate` is also passed, because there is no use for `expanded` if the text is not truncated. - -You can do this by function overloads: - -```tsx -type CommonProps = { - children: React.ReactNode; - miscProps?: any; -}; - -type NoTruncateProps = CommonProps & { truncate?: false }; - -type TruncateProps = CommonProps & { truncate: true; expanded?: boolean }; - -// Function overloads to accept both prop types NoTruncateProps & TruncateProps -function Text(props: NoTruncateProps): JSX.Element; -function Text(props: TruncateProps): JSX.Element; -function Text(props: CommonProps & { truncate?: boolean; expanded?: boolean }) { - const { children, truncate, expanded, ...otherProps } = props; - const classNames = truncate ? ".truncate" : ""; - return ( -
    - {children} -
    - ); -} -``` - -Using the Text component: - -```tsx -const App: React.FC = () => ( - <> - {/* these all typecheck */} - not truncated - truncated - - truncate-able but expanded - - {/* TS error: Property 'truncate' is missing in type '{ children: string; expanded: true; }' but required in type '{ truncate: true; expanded?: boolean | undefined; }'. */} - truncate-able but expanded - -); -``` diff --git a/docs/advanced/guides/render-props.md b/docs/advanced/guides/render-props.md deleted file mode 100644 index f9e43c10..00000000 --- a/docs/advanced/guides/render-props.md +++ /dev/null @@ -1,31 +0,0 @@ ---- -id: render_props -title: Render Props ---- - -Sometimes you will want to write a function that can take a React element or a string or something else as a prop. The best Type to use for such a situation is `React.ReactNode` which fits anywhere a normal, well, React Node would fit: - -```tsx -export interface Props { - label?: React.ReactNode; - children: React.ReactNode; -} -export const Card = (props: Props) => { - return ( -
    - {props.label &&
    {props.label}
    } - {props.children} -
    - ); -}; -``` - -If you are using a function-as-a-child render prop: - -```tsx -export interface Props { - children: (foo: string) => React.ReactNode; -} -``` - -[Something to add? File an issue](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/issues/new/choose). diff --git a/docs/advanced/guides/third-party-libs.md b/docs/advanced/guides/third-party-libs.md deleted file mode 100644 index f69d6958..00000000 --- a/docs/advanced/guides/third-party-libs.md +++ /dev/null @@ -1,6 +0,0 @@ ---- -id: third_party_libs -title: "Props: Third Party Libraries" ---- - -Sometimes DefinitelyTyped can get it wrong, or isn't quite addressing your use case. You can declare your own file with the same interface name. TypeScript will merge interfaces with the same name. diff --git a/docs/advanced/guides/type-component-diff-props.md b/docs/advanced/guides/type-component-diff-props.md deleted file mode 100644 index be812a8f..00000000 --- a/docs/advanced/guides/type-component-diff-props.md +++ /dev/null @@ -1,171 +0,0 @@ ---- -id: type_component_diff_props -title: Typing a Component that Accepts Different Props ---- - -Components, and JSX in general, are analogous to functions. When a component can render differently based on their props, it's similar to how a function can be overloaded to have multiple call signatures. In the same way, you can overload a function component's call signature to list all of its different "versions". - -A very common use case for this is to render something as either a button or an anchor, based on if it receives a `href` attribute. - -```tsx -type ButtonProps = JSX.IntrinsicElements["button"]; -type AnchorProps = JSX.IntrinsicElements["a"]; - -// optionally use a custom type guard -function isPropsForAnchorElement( - props: ButtonProps | AnchorProps -): props is AnchorProps { - return "href" in props; -} - -function Clickable(props: ButtonProps | AnchorProps) { - if (isPropsForAnchorElement(props)) { - return     ; - } else { - return + {JSON.stringify(state, null, 2)} +
    + ); +} +``` + +You can then use the generic components and get nice type safety through type inference: + +```tsx +ReactDOM.render( + ( +
  • + {/* Error: Property 'toPrecision' does not exist on type 'string'. */} + {item.toPrecision(3)} +
    • + )} + />, + document.body +); +``` + +As of [TS 2.9](#typescript-29), you can also supply the type parameter in your JSX to opt out of type inference: + +```tsx +ReactDOM.render( + + items={["a", "b"]} // Error: Type 'string' is not assignable to type 'number'. + renderItem={(item) =>
  • {item.toPrecision(3)}
    • } + />, + document.body +); +``` + +You can also use Generics using fat arrow function style: + +```tsx +interface Props { + items: T[]; + renderItem: (item: T) => React.ReactNode; +} + +// Note the before the function definition. +// You can't use just `` as it will confuse the TSX parser whether it's a JSX tag or a Generic Declaration. +// You can also use https://github.com/microsoft/TypeScript/issues/15713#issuecomment-499474386 +const List = (props: Props) => { + const { items, renderItem } = props; + const [state, setState] = React.useState([]); // You can use type T in List function scope. + return ( +
    + {items.map(renderItem)} + + {JSON.stringify(state, null, 2)} +
    + ); +}; +``` + +The same for using classes: (Credit: [Karol Majewski](https://twitter.com/WrocTypeScript/status/1163234064343736326)'s [gist](https://gist.github.com/karol-majewski/befaf05af73c7cb3248b4e084ae5df71)) + +```tsx +interface Props { + items: T[]; + renderItem: (item: T) => React.ReactNode; +} + +interface State { + items: T[]; +} + +class List extends React.PureComponent, State> { + // You can use type T inside List class. + state: Readonly> = { + items: [], + }; + render() { + const { items, renderItem } = this.props; + // You can use type T inside List class. + const clone: T[] = items.slice(0); + return ( +
    + {items.map(renderItem)} + + {JSON.stringify(this.state, null, 2)} +
    + ); + } +} +``` + +Though you can't use Generic Type Parameters for Static Members: + +```tsx +class List extends React.PureComponent, State> { + // Static members cannot reference class type parameters.ts(2302) + static getDerivedStateFromProps(props: Props, state: State) { + return { items: props.items }; + } +} +``` + +To fix this you need to convert your static function to a type inferred function: + +```tsx +class List extends React.PureComponent, State> { + static getDerivedStateFromProps(props: Props, state: State) { + return { items: props.items }; + } +} +``` + +### Generic components with children + +`children` is usually not defined as a part of the props type. Unless `children` are explicitly defined as a part of the `props` type, an attempt to use `props.children` in JSX or in the function body will fail: + +```tsx +interface WrapperProps { + item: T; + renderItem: (item: T) => React.ReactNode; +} + +/* Property 'children' does not exist on type 'WrapperProps'. */ +const Wrapper = (props: WrapperProps) => { + return ( +
    + {props.renderItem(props.item)} + {props.children} +
    + ); +}; + +/* +Type '{ children: string; item: string; renderItem: (item: string) => string; }' is not assignable to type 'IntrinsicAttributes & WrapperProps'. + Property 'children' does not exist on type 'IntrinsicAttributes & WrapperProps'. +*/ + +const wrapper = ( + item}> + {test} + +); +``` + +[View in the TypeScript Playground](https://www.typescriptlang.org/play/?jsx=2#code/JYWwDg9gTgLgBAJQKYEMDG8BmUIjgcilQ3wFgAoC4AOxiSk3STgHUoUwx6AFHMAZwA8AFQB8cAN4U4cYHRAAuOMIDc0uEWoATegEl5SgBRyki5QEo4AXnHJ0MAHR2MAOQg615GWgAWwADZamkrOjqFuHhQAvhQUAPQAVHC8EFywAJ4EvgFBSNT4cFoQSPxw1BDwSAAewPzwENRwMOlcBGwcaSkCIqL4DnAJcRRoDXWs7Jz01nAicNV02qUSUaKGYHz8Su2TUF1CYpY2kupEMACuUI2G6jKCWsAAbqI3MpLrqfwOmjpQ+qZrGwcJhA5hiXleMgk7wEDmygU0YIhgji9ye6nMniinniCQowhazHwEjgcNy1CUdSgNAA5ipZAY4JSaXTvnoGcYGUzqNTDuIubS4FECrUyhU4Ch+PxgNTqCgAEb+ZgwCBNAkEXS0KnUKVoACCMBgVLlZzopQAZOMOjwNoJ+b0HOouvRmlk-PC8gUiiVRZUamMGqrWvgNYaaDr9aHjaa4Bbtp0bXa+hRBrFyCNtfBTfArHBDLyZqjRAAJJD+fwqrPIwvDUbwADuEzS02u4MEcamwKsACIs12NHkfn8QFYJMDrOJgSsXhIs4iZnF21BnuQMUA) + +To work around that, either add `children` to the `WrapperProps` definition (possibly narrowing down its type, as needed): + +```tsx +interface WrapperProps { + item: T; + renderItem: (item: T) => React.ReactNode; + children: string; // The component will only accept a single string child +} + +const Wrapper = (props: WrapperProps) => { + return ( +
    + {props.renderItem(props.item)} + {props.children} +
    + ); +}; +``` + +or wrap the type of the props in `React.PropsWithChildren` (this is what `React.FC<>` does): + +```tsx +interface WrapperProps { + item: T; + renderItem: (item: T) => React.ReactNode; +} + +const Wrapper = ( + props: React.PropsWithChildren> +) => { + return ( +
    + {props.renderItem(props.item)} + {props.children} +
    + ); +}; +``` + +## Typing Children + +Some API designs require some restriction on `children` passed to a parent component. It is common to want to enforce these in types, but you should be aware of limitations to this ability. + +### What You CAN Do + +You can type the **structure** of your children: just one child, or a tuple of children. + +The following are valid: + +```ts +type OneChild = React.ReactElement; +type TwoChildren = [React.ReactElement, React.ReactElement]; +type ArrayOfProps = SomeProp[]; +type NumbersChildren = number[]; +type TwoNumbersChildren = [number, number]; +``` + +### What You CANNOT Do + +The thing you cannot do is **specify which components** the children are, e.g. If you want to express the fact that "React Router `` can only have `` as children, nothing else is allowed" in TypeScript. + +This is because when you write a JSX expression (const foo = ), the resultant type is blackboxed into a generic JSX.Element type. (_[thanks @ferdaber](https://github.com/typescript-cheatsheets/react/issues/271)_) + +## Type Narrowing based on Props + +What you want: + +```tsx +// Usage +function App() { + return ( + <> + {/* 😎 All good */} + + {/* 😭 Error, `disabled` doesnt exist on anchor element */} + + + ); +} +``` + +How to implement: Use [type guards](https://basarat.gitbooks.io/typescript/docs/types/typeGuard.html#user-defined-type-guards)! + +```tsx +// Button props +type ButtonProps = React.ButtonHTMLAttributes & { + href?: undefined; +}; + +// Anchor props +type AnchorProps = React.AnchorHTMLAttributes & { + href?: string; +}; + +// Input/output options +type Overload = { + (props: ButtonProps): JSX.Element; + (props: AnchorProps): JSX.Element; +}; + +// Guard to check if href exists in props +const hasHref = (props: ButtonProps | AnchorProps): props is AnchorProps => + "href" in props; + +// Component +const Button: Overload = (props: ButtonProps | AnchorProps) => { + // anchor render + if (hasHref(props)) return     ; + // button render + return
    From bb18d84bed67713058f8aadf11122ba036fc9368 Mon Sep 17 00:00:00 2001 From: swyx Date: Sat, 22 Aug 2020 01:48:51 +0800 Subject: [PATCH 031/456] address old issues in cheatsheet (#275) * batch1 * make age optional in defaultprops example * talk about prop-types * add useimperativehandle Co-authored-by: swyx --- README.md | 1 + docs/advanced/patterns_by_usecase.md | 18 +++ docs/basic/getting-started/default-props.md | 4 +- docs/basic/getting-started/hooks.md | 140 +++++++++++--------- docs/hoc/full-example.md | 2 +- 5 files changed, 100 insertions(+), 65 deletions(-) diff --git a/README.md b/README.md index 70800d68..f4dd5048 100644 --- a/README.md +++ b/README.md @@ -2405,6 +2405,7 @@ It is worth mentioning some resources to help you get started: - Marius Schultz: https://blog.mariusschulz.com/series/typescript-evolution with an [Egghead.io course](https://egghead.io/courses/advanced-static-types-in-typescript) - Basarat's Deep Dive: https://basarat.gitbook.io/typescript/ - Rares Matei: [Egghead.io course](https://egghead.io/courses/practical-advanced-typescript)'s advanced TypeScript course on Egghead.io is great for newer typescript features and practical type logic applications (e.g. recursively making all properties of a type `readonly`) +- Go through [Remo Jansen's TypeScript ladder](http://www.techladder.io/?tech=typescript) - Shu Uesugi: [TypeScript for Beginner Programmers](https://ts.chibicode.com/) diff --git a/docs/advanced/patterns_by_usecase.md b/docs/advanced/patterns_by_usecase.md index 2a2b59b5..6355f9ef 100644 --- a/docs/advanced/patterns_by_usecase.md +++ b/docs/advanced/patterns_by_usecase.md @@ -315,6 +315,24 @@ type NumbersChildren = number[]; type TwoNumbersChildren = [number, number]; ``` +
    + +Don't forget that you can also use `prop-types` if TS fails you. + + +```ts +Parent.propTypes = { + children: PropTypes.shape({ + props: PropTypes.shape({ + // could share `propTypes` to the child + value: PropTypes.string.isRequired, + }), + }).isRequired, +}; +``` + +
    + ### What You CANNOT Do The thing you cannot do is **specify which components** the children are, e.g. If you want to express the fact that "React Router `` can only have `` as children, nothing else is allowed" in TypeScript. diff --git a/docs/basic/getting-started/default-props.md b/docs/basic/getting-started/default-props.md index f0364890..7bb7c944 100644 --- a/docs/basic/getting-started/default-props.md +++ b/docs/basic/getting-started/default-props.md @@ -65,7 +65,7 @@ const Greet = ({ age = 21 }: GreetProps) => { // class components // //////////////// type GreetProps = { - age: number; + age?: number; }; class Greet extends React.Component { @@ -125,7 +125,7 @@ export class MyComponent extends React.Component { The problem with this approach is it causes complex issues with the type inference working with `JSX.LibraryManagedAttributes`. Basically it causes the compiler to think that when creating a JSX expression with that component, that all of its props are optional. -[See commentary by @ferdaber here](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/issues/57). +[See commentary by @ferdaber here](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/issues/57) and [here](https://github.com/typescript-cheatsheets/react/issues/61). diff --git a/docs/basic/getting-started/hooks.md b/docs/basic/getting-started/hooks.md index 4fd6986f..04116d58 100644 --- a/docs/basic/getting-started/hooks.md +++ b/docs/basic/getting-started/hooks.md @@ -5,7 +5,7 @@ title: Hooks Hooks are [supported in `@types/react` from v16.8 up](https://github.com/DefinitelyTyped/DefinitelyTyped/blob/a05cc538a42243c632f054e42eab483ebf1560ab/types/react/index.d.ts#L800-L1031). -**useState** +## useState Type inference works very well most of the time: @@ -24,37 +24,53 @@ const [user, setUser] = React.useState(null); setUser(newUser); ``` -**useRef** +## useReducer -When using `useRef`, you have two options when creating a ref container that does not have an initial value: +You can use [Discriminated Unions](https://www.typescriptlang.org/docs/handbook/advanced-types.html#discriminated-unions) for reducer actions. Don't forget to define the return type of reducer, otherwise TypeScript will infer it. -```ts -const ref1 = useRef(null!); -const ref2 = useRef(null); +```tsx +type AppState = {}; +type Action = + | { type: "SET_ONE"; payload: string } // typescript union types allow for leading |'s to have nicer layout + | { type: "SET_TWO"; payload: number }; + +export function reducer(state: AppState, action: Action): AppState { + switch (action.type) { + case "SET_ONE": + return { + ...state, + one: action.payload, // `payload` is string + }; + case "SET_TWO": + return { + ...state, + two: action.payload, // `payload` is number + }; + default: + return state; + } +} ``` -The first option will make `ref1.current` read-only, and is intended to be passed in to built-in `ref` attributes that React will manage (because React handles setting the `current` value for you). +[View in the TypeScript Playground](https://www.typescriptlang.org/play/?jsx=2#code/C4TwDgpgBAgmYGVgENjQLxQN4F8CwAUKJLAMbACWA9gHZTqFRQA+2UxEAXFAEQICiAFQD6AeQBy-HgG4oYZCAA2VZABNuAZ2AAnCjQDmUfASass7cF14CRggOqiZchcrXcaAVwC2AIwjajaUJCCAAPMCptYCgAMw8acmo6bQhVD1J-AAotVCs4RBQ0ABooZETabhhymgBKSvgkXOxGKA0AdwpgUgALKEyyyloAOg4a5pMmKFJkDWg+ITFJHk4WyagU4A9tOixVtaghw5zivbXaKwGkofklFVUoAHoHqAADG9dVF6gKDVadPX0p0Ce2ms2sC3sjhWEzWGy2OyBTEOQ2OECKiPYbSo3Euw3ed0ezzeLjuXx+UE8vn8QJwQRhUFUEBiyA8imA0P26wgm22f1ydKYxhwQA)
    - What is the ! at the end of null!? -`null!` is a non-null assertion operator (the `!`). It asserts that any expression before it is not `null` or `undefined`, so if you have `useRef(null!)` it means that you're instantiating the ref with a current value of `null` but lying to TypeScript that it's not `null`. +Usage with `Reducer` from `redux` -```ts -function MyComponent() { - const ref1 = useRef(null!); - useEffect(() => { - doSomethingWith(ref1.current); // TypeScript won't require null-check e.g. ref1 && ref1.current - }); - return
    etc
    ; -} +In case you use the [redux](https://github.com/reduxjs/redux) library to write reducer function, It provides a convenient helper of the format `Reducer` which takes care of the return type for you. + +So the above reducer example becomes: + +```tsx +import { Reducer } from 'redux'; + +export function reducer: Reducer() {} ```
    -The second option will make `ref2.current` mutable, and is intended for "instance variables" that you manage yourself. - -**useEffect** +## useEffect When using `useEffect`, take care not to return anything other than a function or `undefined`, otherwise both TypeScript and React will yell at you. This can be subtle when using arrow functions: @@ -73,7 +89,35 @@ function DelayedEffect(props: { timerMs: number }) { } ``` -**useRef** +## useRef + +When using `useRef`, you have two options when creating a ref container that does not have an initial value: + +```ts +const ref1 = useRef(null!); +const ref2 = useRef(null); +``` + +The first option will make `ref1.current` read-only, and is intended to be passed in to built-in `ref` attributes that React will manage (because React handles setting the `current` value for you). + +
    + What is the ! at the end of null!? + +`null!` is a non-null assertion operator (the `!`). It asserts that any expression before it is not `null` or `undefined`, so if you have `useRef(null!)` it means that you're instantiating the ref with a current value of `null` but lying to TypeScript that it's not `null`. + +```ts +function MyComponent() { + const ref1 = useRef(null!); + useEffect(() => { + doSomethingWith(ref1.current); // TypeScript won't require null-check e.g. ref1 && ref1.current + }); + return
    etc
    ; +} +``` + +
    + +The second option will make `ref2.current` mutable, and is intended for "instance variables" that you manage yourself. ```tsx function TextInputWithFocusButton() { @@ -101,53 +145,25 @@ function TextInputWithFocusButton() { example from [Stefan Baumgartner](https://fettblog.eu/typescript-react/hooks/#useref) -**useReducer** +## useImperativeHandle -You can use [Discriminated Unions](https://www.typescriptlang.org/docs/handbook/advanced-types.html#discriminated-unions) for reducer actions. Don't forget to define the return type of reducer, otherwise TypeScript will infer it. +_we dont have much here, but this is from [a discussion in our issues](https://github.com/typescript-cheatsheets/react/issues/106)_ ```tsx -type AppState = {}; -type Action = - | { type: "SET_ONE"; payload: string } // typescript union types allow for leading |'s to have nicer layout - | { type: "SET_TWO"; payload: number }; - -export function reducer(state: AppState, action: Action): AppState { - switch (action.type) { - case "SET_ONE": - return { - ...state, - one: action.payload, // `payload` is string - }; - case "SET_TWO": - return { - ...state, - two: action.payload, // `payload` is number - }; - default: - return state; - } +type ListProps = { + items: ItemType[]; + innerRef?: React.Ref<{ scrollToItem(item: ItemType): void }>; +}; + +function List(props: ListProps) { + useImperativeHandle(props.innerRef, () => ({ + scrollToItem() {}, + })); + return null; } ``` -[View in the TypeScript Playground](https://www.typescriptlang.org/play/?jsx=2#code/C4TwDgpgBAgmYGVgENjQLxQN4F8CwAUKJLAMbACWA9gHZTqFRQA+2UxEAXFAEQICiAFQD6AeQBy-HgG4oYZCAA2VZABNuAZ2AAnCjQDmUfASass7cF14CRggOqiZchcrXcaAVwC2AIwjajaUJCCAAPMCptYCgAMw8acmo6bQhVD1J-AAotVCs4RBQ0ABooZETabhhymgBKSvgkXOxGKA0AdwpgUgALKEyyyloAOg4a5pMmKFJkDWg+ITFJHk4WyagU4A9tOixVtaghw5zivbXaKwGkofklFVUoAHoHqAADG9dVF6gKDVadPX0p0Ce2ms2sC3sjhWEzWGy2OyBTEOQ2OECKiPYbSo3Euw3ed0ezzeLjuXx+UE8vn8QJwQRhUFUEBiyA8imA0P26wgm22f1ydKYxhwQA) - -
    - -Usage with `Reducer` from `redux` - -In case you use the [redux](https://github.com/reduxjs/redux) library to write reducer function, It provides a convenient helper of the format `Reducer` which takes care of the return type for you. - -So the above reducer example becomes: - -```tsx -import { Reducer } from 'redux'; - -export function reducer: Reducer() {} -``` - -
    - -**Custom Hooks** +## Custom Hooks If you are returning an array in your Custom Hook, you will want to avoid type inference as TypeScript will infer a union type (when you actually want different types in each position of the array). Instead, use [TS 3.4 const assertions](https://devblogs.microsoft.com/typescript/announcing-typescript-3-4/#const-assertions): diff --git a/docs/hoc/full-example.md b/docs/hoc/full-example.md index 5a6ae49c..74e64860 100644 --- a/docs/hoc/full-example.md +++ b/docs/hoc/full-example.md @@ -92,4 +92,4 @@ export function inject( ### Using `forwardRef` -For "true" reusability you should also consider exposing a ref for your HOC. You can use `React.forwardRef` as documented in [the basic cheatsheet](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/blob/master/README.md#forwardrefcreateref), but we are interested in more real world examples. [Here is a nice example in practice](https://gist.github.com/OliverJAsh/d2f462b03b3e6c24f5588ca7915d010e) from @OliverJAsh. +For "true" reusability you should also consider exposing a ref for your HOC. You can use `React.forwardRef` as documented in [the basic cheatsheet](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/blob/master/README.md#forwardrefcreateref), but we are interested in more real world examples. [Here is a nice example in practice](https://gist.github.com/OliverJAsh/d2f462b03b3e6c24f5588ca7915d010e) from @OliverJAsh (note - it still has some rough edges, we need help to test this out/document this). From 8ccb5f4ee53c7819624cabe9d86afd5b5c4c5f0c Mon Sep 17 00:00:00 2001 From: swyx Date: Sat, 22 Aug 2020 10:38:54 +0800 Subject: [PATCH 032/456] add discord to page --- website/docusaurus.config.js | 5 +++++ website/src/pages/index.js | 8 +++++++- 2 files changed, 12 insertions(+), 1 deletion(-) diff --git a/website/docusaurus.config.js b/website/docusaurus.config.js index 704b6a59..0e4c48a2 100644 --- a/website/docusaurus.config.js +++ b/website/docusaurus.config.js @@ -68,6 +68,11 @@ module.exports = { label: "Help", position: "right", }, + { + to: "https://discord.gg/y88evmj", + label: "Discord", + position: "right", + }, // {to: 'blog', label: 'Blog', position: 'right'}, ], }, diff --git a/website/src/pages/index.js b/website/src/pages/index.js index 252ae569..58a61f24 100644 --- a/website/src/pages/index.js +++ b/website/src/pages/index.js @@ -19,7 +19,13 @@ export default function Home() {

    {siteConfig.title}

    {siteConfig.tagline}

    -
    +
    Date: Sun, 23 Aug 2020 01:42:11 +0800 Subject: [PATCH 033/456] update discord --- README.md | 2 +- website/docusaurus.config.js | 6 +++--- website/src/pages/index.js | 2 +- 3 files changed, 5 insertions(+), 5 deletions(-) diff --git a/README.md b/README.md index f4dd5048..354f8049 100644 --- a/README.md +++ b/README.md @@ -31,7 +31,7 @@ --- -[![All Contributors](https://img.shields.io/github/contributors/typescript-cheatsheets/react-typescript-cheatsheet?color=orange&style=flat-square)](/CONTRIBUTORS.md) | [![Discord](https://img.shields.io/discord/746055213462585435.svg?label=&logo=discord&logoColor=ffffff&color=7389D8&labelColor=6A7EC2)](https://discord.gg/y88evmj) | [![Tweet](https://img.shields.io/twitter/url?label=Help%20spread%20the%20word%21&style=social&url=https%3A%2F%2Fgithub.amrom.workers.dev%2Ftypescript-cheatsheets%2Freact)](http://twitter.com/home?status=Awesome%20%40Reactjs%20%2B%20%40TypeScript%20cheatsheet%20by%20%40ferdaber%2C%20%40sebsilbermann%2C%20%40swyx%20%26%20others!%20https%3A%2F%2Fgithub.amrom.workers.dev%2Ftypescript-cheatsheets%2Freact) +[![All Contributors](https://img.shields.io/github/contributors/typescript-cheatsheets/react-typescript-cheatsheet?color=orange&style=flat-square)](/CONTRIBUTORS.md) | [![Discord](https://img.shields.io/discord/508357248330760243.svg?label=&logo=discord&logoColor=ffffff&color=7389D8&labelColor=6A7EC2)](https://discord.gg/wTGS5z9) | [![Tweet](https://img.shields.io/twitter/url?label=Help%20spread%20the%20word%21&style=social&url=https%3A%2F%2Fgithub.amrom.workers.dev%2Ftypescript-cheatsheets%2Freact)](http://twitter.com/home?status=Awesome%20%40Reactjs%20%2B%20%40TypeScript%20cheatsheet%20by%20%40ferdaber%2C%20%40sebsilbermann%2C%20%40swyx%20%26%20others!%20https%3A%2F%2Fgithub.amrom.workers.dev%2Ftypescript-cheatsheets%2Freact) ## All React + TypeScript Cheatsheets diff --git a/website/docusaurus.config.js b/website/docusaurus.config.js index 0e4c48a2..e6bb163c 100644 --- a/website/docusaurus.config.js +++ b/website/docusaurus.config.js @@ -69,7 +69,7 @@ module.exports = { position: "right", }, { - to: "https://discord.gg/y88evmj", + to: "https://discord.gg/wTGS5z9", label: "Discord", position: "right", }, @@ -140,8 +140,8 @@ module.exports = { }, { label: "Discord", - html: ` - + html: ` + `, }, { diff --git a/website/src/pages/index.js b/website/src/pages/index.js index 58a61f24..0cd3d5a1 100644 --- a/website/src/pages/index.js +++ b/website/src/pages/index.js @@ -33,7 +33,7 @@ export default function Home() { Getting started Join Official Discord From 6bb152e8d0109a888137c624eb832dfea4cfa02c Mon Sep 17 00:00:00 2001 From: swyx Date: Sun, 23 Aug 2020 01:47:02 +0800 Subject: [PATCH 034/456] add manual trigger to readme workflow --- .github/workflows/readme.js.yml | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/.github/workflows/readme.js.yml b/.github/workflows/readme.js.yml index 1fe4348d..c6336e59 100644 --- a/.github/workflows/readme.js.yml +++ b/.github/workflows/readme.js.yml @@ -1,11 +1,12 @@ name: Generate README on: + workflow_dispatch: pull_request: paths: 'docs/basic/*' - branches: [master] + branches: [main] push: paths: 'docs/basic/*' - branches: [master] + branches: [main] jobs: build: runs-on: ubuntu-latest From 05bbc55931d3cff948330a98f82ab7a7387135b8 Mon Sep 17 00:00:00 2001 From: swyx Date: Sun, 23 Aug 2020 07:06:17 +0800 Subject: [PATCH 035/456] fix responsiveness --- website/src/css/custom.css | 10 ++++++++++ website/src/pages/index.js | 8 +------- 2 files changed, 11 insertions(+), 7 deletions(-) diff --git a/website/src/css/custom.css b/website/src/css/custom.css index dc04b464..f63aec9c 100644 --- a/website/src/css/custom.css +++ b/website/src/css/custom.css @@ -26,3 +26,13 @@ main details { main details summary { margin-bottom: 1rem; } + +.homePageBtns { + display: grid; + gap: 20px; +} +@media (min-width: 480px) { + .homePageBtns { + grid-template-columns: 1fr 1fr; + } +} diff --git a/website/src/pages/index.js b/website/src/pages/index.js index 0cd3d5a1..354cf671 100644 --- a/website/src/pages/index.js +++ b/website/src/pages/index.js @@ -19,13 +19,7 @@ export default function Home() {

    {siteConfig.title}

    {siteConfig.tagline}

    -
    +
    Date: Mon, 24 Aug 2020 17:36:00 +0800 Subject: [PATCH 036/456] address React.HTMLProps issue (#276) Co-authored-by: swyx --- docs/advanced/patterns_by_usecase.md | 89 ++++++++++++++++++++++++---- docs/advanced/types-react-ap.md | 70 +++++++++++++++++++++- 2 files changed, 144 insertions(+), 15 deletions(-) diff --git a/docs/advanced/patterns_by_usecase.md b/docs/advanced/patterns_by_usecase.md index 6355f9ef..f6fc881b 100644 --- a/docs/advanced/patterns_by_usecase.md +++ b/docs/advanced/patterns_by_usecase.md @@ -10,34 +10,99 @@ sidebar_label: Useful Patterns by Use Case Usecase: you want to make a ` + + // no error + return ; +} + +// implementation +export interface ButtonProps extends React.ComponentProps<"button"> { + specialProp?: string; +} +export function Button(props: ButtonProps) { + const { specialProp, ...rest } = props; + // do something with specialProp + return ; +} +``` + + + +### Wrapping/Mirroring a Component Usecase: same as above, but for a React Component you don't have access to ```tsx const Box = (props: React.CSSProperties) =>
    ; -const Card = ({ - title, - children, - ...props -}: { title: string } & $ElementProps) => ( +const Card = ( + { title, children, ...props }: { title: string } & $ElementProps // new utility, see below +) => ( {title}: {children} @@ -57,7 +122,7 @@ declare type $ElementProps = T extends React.ComponentType : never; ``` -Advanced Example: +Usage: ```tsx import * as Recompose from "recompose"; @@ -73,7 +138,7 @@ export const defaultProps = < _thanks [dmisdm](https://github.com/typescript-cheatsheets/react/issues/23)_ -\*TODO: check how this conflicts/merges/duplicates with the Troubleshooting Handbook "Types I need weren't Exported" advice +_TODO: check how this conflicts/merges/duplicates with the Troubleshooting Handbook "Types I need weren't Exported" advice_ ## Polymorphic Components diff --git a/docs/advanced/types-react-ap.md b/docs/advanced/types-react-ap.md index 1bd8e231..baa19e88 100644 --- a/docs/advanced/types-react-ap.md +++ b/docs/advanced/types-react-ap.md @@ -28,15 +28,79 @@ Most Commonly Used Interfaces and Types Not Commonly Used but Good to know - `Ref` - used to type `innerRef` -- `ElementType` - used for higher order components or operations on components +- `ElementType` - used for higher order components or operations on components, e.g. [Polymorphic Components](https://react-typescript-cheatsheet.netlify.app/docs/advanced/patterns_by_usecase#polymorphic-components) - `ReactElement` - [can be used if you want to pass it to `cloneElement`](https://www.reddit.com/r/reactjs/comments/ia8sdi/any_other_typescript_users_constantly_confused/g1npahe/) aka it's pretty rarely used - `ComponentType` - used for higher order components where you don't specifically deal with the intrinsic components - `ReactPortal` - used if you specifically need to type a prop as a portal, otherwise it is part of `ReactNode` - `ComponentClass` - a complete interface for the produced constructor function of a class declaration that extends `Component`, often used to type external components instead of typing your own - `JSXElementConstructor` - anything that TypeScript considers to be a valid thing that can go into the opening tag of a JSX expression -- `ComponentProps` - props of a component +- `ComponentProps` - props of a component - most useful for [Wrapping/Mirroring a HTML Element](https://react-typescript-cheatsheet.netlify.app/docs/advanced/patterns_by_usecase#wrappingmirroring-a-html-element) - `ComponentPropsWithRef` - props of a component where if it is a class-based component it will replace the `ref` prop with its own instance type - `ComponentPropsWithoutRef` - props of a component without its `ref` prop +- `HTMLProps` and `HTMLAttributes` - these are the most generic versions, for global attributes (see a list of [attributes marked as "global attribute" on MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes)). In general, prefer `React.ComponentProps`, `JSX.IntrinsicElements`, or [specialized HTMLAttributes interfaces](https://github.com/DefinitelyTyped/DefinitelyTyped/blob/a2aa0406e7bf269eef01292fcb2b24dee89a7d2b/types/react/index.d.ts#L1914-L2625): + +
    + + + List of specialized HTMLAttributes + + + Note that there are about 50 of these, which means there are some HTML elements which are not covered. + + - `AnchorHTMLAttributes` + - `AudioHTMLAttributes` + - `AreaHTMLAttributes` + - `BaseHTMLAttributes` + - `BlockquoteHTMLAttributes` + - `ButtonHTMLAttributes` + - `CanvasHTMLAttributes` + - `ColHTMLAttributes` + - `ColgroupHTMLAttributes` + - `DataHTMLAttributes` + - `DetailsHTMLAttributes` + - `DelHTMLAttributes` + - `DialogHTMLAttributes` + - `EmbedHTMLAttributes` + - `FieldsetHTMLAttributes` + - `FormHTMLAttributes` + - `HtmlHTMLAttributes` + - `IframeHTMLAttributes` + - `ImgHTMLAttributes` + - `InsHTMLAttributes` + - `InputHTMLAttributes` + - `KeygenHTMLAttributes` + - `LabelHTMLAttributes` + - `LiHTMLAttributes` + - `LinkHTMLAttributes` + - `MapHTMLAttributes` + - `MenuHTMLAttributes` + - `MediaHTMLAttributes` + - `MetaHTMLAttributes` + - `MeterHTMLAttributes` + - `QuoteHTMLAttributes` + - `ObjectHTMLAttributes` + - `OlHTMLAttributes` + - `OptgroupHTMLAttributes` + - `OptionHTMLAttributes` + - `OutputHTMLAttributes` + - `ParamHTMLAttributes` + - `ProgressHTMLAttributes` + - `SlotHTMLAttributes` + - `ScriptHTMLAttributes` + - `SelectHTMLAttributes` + - `SourceHTMLAttributes` + - `StyleHTMLAttributes` + - `TableHTMLAttributes` + - `TextareaHTMLAttributes` + - `TdHTMLAttributes` + - `ThHTMLAttributes` + - `TimeHTMLAttributes` + - `TrackHTMLAttributes` + - `VideoHTMLAttributes` + - `WebViewHTMLAttributes` + +
    + - all methods: `createElement`, `cloneElement`, ... are all public and reflect the React runtime API [@Ferdaber's note](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/pull/69): I discourage the use of most `...Element` types because of how black-boxy `JSX.Element` is. You should almost always assume that anything produced by `React.createElement` is the base type `React.ReactElement`. @@ -45,7 +109,7 @@ Not Commonly Used but Good to know - `Element` - the type of any JSX expression. You should ideally never need to see or use this, but you do because of [a limitation of TypeScript](https://github.com/microsoft/TypeScript/issues/21699). - `LibraryManagedAttributes` - It specifies other places where JSX elements can declare and initialize property types. Used to resolve static `defaultProps` and `propTypes` with the internal props type of a component. -- `IntrinsicElements` - every possible built-in component that can be typed in as a lowercase tag name in JSX +- `IntrinsicElements` - every possible built-in component that can be typed in as a lowercase tag name in JSX. If you're using this to get the attributes for a HTML element, `React.ComponentProps` may be more readable as it doesn't require knowing what "Intrinsic" means. Not commonly used but good to know From c8fec1490ae956ee50c353fd88039b80de173c23 Mon Sep 17 00:00:00 2001 From: swyx Date: Mon, 24 Aug 2020 18:05:16 +0800 Subject: [PATCH 037/456] netlify.toml --- netlify.toml | 3 +++ 1 file changed, 3 insertions(+) diff --git a/netlify.toml b/netlify.toml index 88c1f930..cf9f2912 100644 --- a/netlify.toml +++ b/netlify.toml @@ -3,6 +3,9 @@ # This is where we will look for package.json/.nvmrc/etc. base = "website" + # otherwise netlify keeps ignoring changes in /docs + ignore = "/bin/false" + # Directory (relative to root of your repo) that contains the deploy-ready # HTML files and assets generated by the build. If a base directory has # been specified, include it in the publish directory path. From 49df823edd77dda7b5c33cd18d0e91f1df6d93b4 Mon Sep 17 00:00:00 2001 From: swyx Date: Thu, 27 Aug 2020 01:40:03 +0800 Subject: [PATCH 038/456] update notes on `defaultProps` (#277) Co-authored-by: swyx --- docs/basic/getting-started/default-props.md | 134 ++++++++++++++++---- 1 file changed, 106 insertions(+), 28 deletions(-) diff --git a/docs/basic/getting-started/default-props.md b/docs/basic/getting-started/default-props.md index 7bb7c944..5a2ffdcd 100644 --- a/docs/basic/getting-started/default-props.md +++ b/docs/basic/getting-started/default-props.md @@ -3,25 +3,57 @@ id: default_props title: Typing defaultProps --- -## Typing defaultProps +## You May Not Need `defaultProps` -For TypeScript 3.0+, type inference [should work](https://www.typescriptlang.org/docs/handbook/release-notes/typescript-3-0.html), although [some edge cases are still problematic](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/issues/61). Just type your props like normal, except don't use `React.FC`. +As per [this tweet](https://twitter.com/dan_abramov/status/1133878326358171650), defaultProps will eventually be deprecated. You can check the discussions here: + +- https://twitter.com/hswolff/status/1133759319571345408 + +The consensus is to use object default values. + +Function Components: + +```tsx +type GreetProps = { age?: number }; + +const Greet = ({ age = 21 }: GreetProps) => // etc +``` + +Class Components: + +```tsx +type GreetProps = { + age?: number; +}; + +class Greet extends React.Component { + const { age = 21 } = this.props + /*...*/ +} + +let el = ; +``` + +## Typing `defaultProps` + +Type inference improved greatly for `defaultProps` in [TypeScript 3.0+](https://www.typescriptlang.org/docs/handbook/release-notes/typescript-3-0.html), although [some edge cases are still problematic](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/issues/61). + +**Function Components** ```tsx -// //////////////// -// function components -// //////////////// type GreetProps = { age: number } & typeof defaultProps; const defaultProps = { age: 21, }; const Greet = (props: GreetProps) => { - /*...*/ + // etc }; Greet.defaultProps = defaultProps; ``` +_[See this in TS Playground](https://www.typescriptlang.org/play?#code/JYWwDg9gTgLgBAKjgQwM5wEoFNkGN4BmUEIcARFDvmQNwBQdMAnmFnAOKVYwAKxY6ALxwA3igDmWAFxwAdgFcQAIyxQ4AXzgAyOM1YQCcACZYCyeQBte-VPVwRZqeCbOXrEAXGEi6cCdLgAJgBGABo6dXo6e0d4TixuLzgACjAbGXjuPg9UAEovAD5RXzhKGHkoWTgAHiNgADcCkTScgDpkSTgAeiQFZVVELvVqrrrGiPpMmFaXcytsz2FZtwXbOiA)_ + For **Class components**, there are [a couple ways to do it](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/pull/103#issuecomment-481061483)(including using the `Pick` utility type) but the recommendation is to "reverse" the props definition: ```tsx @@ -41,42 +73,88 @@ let el = ; ```
    - An alternative approach + + + `JSX.LibraryManagedAttributes` nuance for library authors + + -As per [this tweet](https://twitter.com/dan_abramov/status/1133878326358171650), defaultProps will eventually be deprecated. You can check the discussions here: +The above implementations work fine for App creators, but sometimes you want to be able to export `GreetProps` so that others can consume it. The problem here is that the way `GreetProps` is defined, `age` is a required prop when it isn't because of `defaultProps`. -- https://twitter.com/hswolff/status/1133759319571345408 +The insight to have here is that [`GreetProps` is the _internal_ contract for your component, not the _external_, consumer facing contract](https://github.com/typescript-cheatsheets/react/issues/66#issuecomment-453878710). You could create a separate type specifically for export, or you could make use of the `JSX.LibraryManagedAttributes` utility: -The consensus is to use object default values. +```tsx +// internal contract, should not be exported out +type GreetProps = { + age?: number; +}; + +class Greet extends Component { + static defaultProps = { age: 21 }; +} + +// external contract +export type ApparentGreetProps = JSX.LibraryManagedAttributes< + typeof Greet, + GreetProps +>; +``` + +`` +This will work properly, although hovering over `ApparentGreetProps` may be a little intimidating. You can reduce this boilerplate with the `ComponentProps` utility detailed below. + +
    + +## Consuming Props of a Component with defaultProps + +A component with `defaultProps` may seem to have some required props that actually aren't. + +### Problem Statement + +Here's what you want to do: ```tsx -// //////////////// -// function components -// //////////////// -type GreetProps = { age: number }; +interface IProps { + name: string; +} +const defaultProps = { + age: 25, +}; +const GreetComponent = ({ name, age }: IProps & typeof defaultProps) => ( +
    {`Hello, my name is ${name}, ${age}`}
    +); +GreetComponent.defaultProps = defaultProps; -const Greet = ({ age = 21 }: GreetProps) => { - /*...*/ +const TestComponent = (props: React.ComponentProps) => { + return

    ; }; + +// Property 'age' is missing in type '{ name: string; }' but required in type '{ age: number; }' +const el = ; ``` +### Solution + +Define a utility that applies `JSX.LibraryManagedAttributes`: + ```tsx -// //////////////// -// class components -// //////////////// -type GreetProps = { - age?: number; +type ComponentProps = T extends + | React.ComponentType + | React.Component + ? JSX.LibraryManagedAttributes + : never; + +const TestComponent = (props: ComponentProps) => { + return

    ; }; -class Greet extends React.Component { - const { age = 21 } = this.props - /*...*/ -} - -let el = ; +// No error +const el = ; ``` - +[_See this in TS Playground_](https://www.typescriptlang.org/play?#code/JYWwDg9gTgLgBAKjgQwM5wEoFNkGN4BmUEIcARFDvmQNwBQdMAnmFnAMImQB2W3MABWJhUAHgAqAPjgBeOOLhYAHjD4ATdNjwwAdJ3ARe-cSyyjg3AlihwB0gD6Yqu-Tz4xzl67cl04cAH44ACkAZQANHQAZYAAjKGQoJgBZZG5kAHMsNQBBGBgoOIBXVTFxABofPzgALjheADdrejoLVSgCPDYASSEIETgAb2r0kCw61AKLDPoAXzpcQ0m4NSxOooAbQWF0OWH-TPG4ACYAVnK6WfpF7mWAcUosGFdDd1k4AApB+uQxysO4LM6r0dnAAGRwZisCAEFZrZCbbb9VAASlk0g+1VEamADUkgwABgAJLAbDYQSogJg-MZwYDoAAkg1GWFmlSZh1mBNmogA9Di8XQUfQHlgni8jLpVustn0BnJpQjZTsWrzeXANsh2gwbstxFhJhK3nIPmAdnUjfw5WIoVgYXBReKuK9+JI0TJpPs4JQYEUoNw4KIABYARjgvN8VwYargADkIIooMQoAslvBSe8JAbns7JTSsDIyAQIBAyOHJDQgA) + +## Misc Discussions and Knowledge
    Why does React.FC break defaultProps? From c08b8df3e0b315014898de0a568abc19c71db7b8 Mon Sep 17 00:00:00 2001 From: swyx Date: Thu, 27 Aug 2020 01:50:55 +0800 Subject: [PATCH 039/456] test update to docusaurus v2, alpha.61 for algolia docsearch v3 (#278) Co-authored-by: swyx --- .../getting-started/basic-type-examples.md | 2 +- docs/basic/troubleshooting/ts-config.md | 2 +- package.json | 3 +- website/docusaurus.config.js | 14 +- website/package.json | 4 +- website/yarn.lock | 3919 +++++++++-------- 6 files changed, 1992 insertions(+), 1952 deletions(-) diff --git a/docs/basic/getting-started/basic-type-examples.md b/docs/basic/getting-started/basic-type-examples.md index 17c24e3f..b057acd3 100644 --- a/docs/basic/getting-started/basic-type-examples.md +++ b/docs/basic/getting-started/basic-type-examples.md @@ -43,4 +43,4 @@ type AppProps = { }; ``` -Notice we have used the TSDoc `/** comment */` style here on each prop. You can and are encouraged to leave descriptive comments on reusable components. For a fuller example and discussion, see our [Commenting Components](/ADVANCED.md#commenting-components) section in the Advanced Cheatsheet. +Notice we have used the TSDoc `/** comment */` style here on each prop. You can and are encouraged to leave descriptive comments on reusable components. For a fuller example and discussion, see our [Commenting Components](https://react-typescript-cheatsheet.netlify.app/docs/advanced/misc_concerns/#commenting-components) section in the Advanced Cheatsheet. diff --git a/docs/basic/troubleshooting/ts-config.md b/docs/basic/troubleshooting/ts-config.md index dc25e4c3..c530507d 100644 --- a/docs/basic/troubleshooting/ts-config.md +++ b/docs/basic/troubleshooting/ts-config.md @@ -46,4 +46,4 @@ Selected flags and why we like them: - `strict`: `strictPropertyInitialization` forces you to initialize class properties or explicitly declare that they can be undefined. You can opt out of this with a definite assignment assertion. - `"typeRoots": ["./typings", "./node_modules/@types"]`: By default, TypeScript looks in `node_modules/@types` and parent folders for third party type declarations. You may wish to override this default resolution so you can put all your global type declarations in a special `typings` folder. -Compilation speed grows linearly with size of codebase. For large projects, you will want to use [Project References](https://www.typescriptlang.org/docs/handbook/project-references.html). See our [ADVANCED](ADVANCED.md) cheatsheet for commentary. +Compilation speed grows linearly with size of codebase. For large projects, you will want to use [Project References](https://www.typescriptlang.org/docs/handbook/project-references.html). See our [ADVANCED](https://react-typescript-cheatsheet.netlify.app/docs/advanced/) cheatsheet for commentary. diff --git a/package.json b/package.json index 606da144..6dcd78a3 100644 --- a/package.json +++ b/package.json @@ -22,7 +22,8 @@ "gen-readme": "node genReadme.js", "format": "prettier --write \"**/*.md\"", "postinstall": "cd website && yarn", - "start": "yarn --cwd website start" + "start": "yarn --cwd website start", + "build": "yarn --cwd website build" }, "dependencies": { "@octokit/rest": "^16.43.1", diff --git a/website/docusaurus.config.js b/website/docusaurus.config.js index e6bb163c..4f064557 100644 --- a/website/docusaurus.config.js +++ b/website/docusaurus.config.js @@ -39,7 +39,9 @@ module.exports = { ], themeConfig: { - defaultDarkMode: true, + colorMode: { + defaultMode: "dark", + }, image: "https://user-images.githubusercontent.com/6764957/53868378-2b51fc80-3fb3-11e9-9cee-0277efe8a927.png", @@ -57,7 +59,7 @@ module.exports = { alt: "Logo", src: "img/icon.png", }, - links: [ + items: [ { to: setupDoc, label: "Docs", @@ -82,8 +84,8 @@ module.exports = { logo: { alt: "TypeScript Cheatsheets Logo", src: "img/icon.png", - maxWidth: 128, - style: { maxWidth: 128, maxHeight: 128 }, + // maxWidth: 128, + // style: { maxWidth: 128, maxHeight: 128 }, }, copyright: `Copyright © ${new Date().getFullYear()} TypeScript Cheatsheets`, links: [ @@ -139,13 +141,13 @@ module.exports = { `, }, { - label: "Discord", + // label: "Discord", html: ` `, }, { - label: "Spread the word", + // label: "Spread the word", html: ` `, diff --git a/website/package.json b/website/package.json index 729529e2..3b0072ee 100644 --- a/website/package.json +++ b/website/package.json @@ -6,8 +6,8 @@ "deploy": "docusaurus deploy" }, "dependencies": { - "@docusaurus/core": "^2.0.0-alpha.56", - "@docusaurus/preset-classic": "^2.0.0-alpha.56", + "@docusaurus/core": "^2.0.0-alpha.61", + "@docusaurus/preset-classic": "^2.0.0-alpha.61", "classnames": "^2.2.6", "react": "^16.13.1", "react-dom": "^16.13.1" diff --git a/website/yarn.lock b/website/yarn.lock index bc17784b..62b168c6 100644 --- a/website/yarn.lock +++ b/website/yarn.lock @@ -2,545 +2,530 @@ # yarn lockfile v1 -"@babel/code-frame@7.8.3", "@babel/code-frame@^7.8.3": +"@algolia/cache-browser-local-storage@4.4.0": + version "4.4.0" + resolved "https://registry.yarnpkg.com/@algolia/cache-browser-local-storage/-/cache-browser-local-storage-4.4.0.tgz#f58055bdf798d7b31b6d5f86e465cb0fc7dd6694" + integrity sha512-2AiKgN7DpFypkRCRkpqH7waXXyFdcnsPWzmN8sLHrB/FfXqgmsQb3pGft+9YHZIDQ0vAnfgMxSGgMhMGW+0Qnw== + dependencies: + "@algolia/cache-common" "4.4.0" + +"@algolia/cache-common@4.4.0": + version "4.4.0" + resolved "https://registry.yarnpkg.com/@algolia/cache-common/-/cache-common-4.4.0.tgz#bfe84790230f5d2de495238b29e9397c5ed2b26e" + integrity sha512-PrIgoMnXaDWUfwOekahro543pgcJfgRu/nd/ZQS5ffem3+Ow725eZY6HDpPaQ1k3cvLii9JH6V2sNJConjqUKA== + +"@algolia/cache-in-memory@4.4.0": + version "4.4.0" + resolved "https://registry.yarnpkg.com/@algolia/cache-in-memory/-/cache-in-memory-4.4.0.tgz#54a089094c2afa5b9cacab4b60a5f1ba29013a7c" + integrity sha512-9+XlUB0baDU/Dp9URRHPp6Q37YmTO0QmgPWt9+n+wqZrRL0jR3Jezr4jCT7RemqGMxBiR+YpnqaUv0orpb0ptw== + dependencies: + "@algolia/cache-common" "4.4.0" + +"@algolia/client-account@4.4.0": + version "4.4.0" + resolved "https://registry.yarnpkg.com/@algolia/client-account/-/client-account-4.4.0.tgz#7dbeff83e1c85d853b3ad224674a924e02b94d1b" + integrity sha512-Kynu3cMEs0clTLf674rtrCF+FWR/JwlQxKlIWsPzvLBRmNXdvYej9YBcNaOr4OTQFCCZn9JVE8ib91Z7J4IL1Q== + dependencies: + "@algolia/client-common" "4.4.0" + "@algolia/client-search" "4.4.0" + "@algolia/transporter" "4.4.0" + +"@algolia/client-analytics@4.4.0": + version "4.4.0" + resolved "https://registry.yarnpkg.com/@algolia/client-analytics/-/client-analytics-4.4.0.tgz#50dde68b067c615fc91434c98db9b5ca429be33d" + integrity sha512-GQyjQimKAc9sZbafxln9Wk7j4pEYiORv28MZkZ+0Bjt7WNXIeO7OgOOECVpQHm9buyV6hCKpNtJcbb5/syRzdQ== + dependencies: + "@algolia/client-common" "4.4.0" + "@algolia/client-search" "4.4.0" + "@algolia/requester-common" "4.4.0" + "@algolia/transporter" "4.4.0" + +"@algolia/client-common@4.4.0": + version "4.4.0" + resolved "https://registry.yarnpkg.com/@algolia/client-common/-/client-common-4.4.0.tgz#b9fa987bc7a148f9756da59ada51fe2494a4aa9a" + integrity sha512-a3yr6UhzjWPHDG/8iGp9UvrDOm1aeHVWJIf0Nj/cIvqX5tNCEIo4IMe59ovApkDgLOIpt/cLsyhn9/FiPXRhJA== + dependencies: + "@algolia/requester-common" "4.4.0" + "@algolia/transporter" "4.4.0" + +"@algolia/client-recommendation@4.4.0": + version "4.4.0" + resolved "https://registry.yarnpkg.com/@algolia/client-recommendation/-/client-recommendation-4.4.0.tgz#82410f7a346ed8518b8dcd28bc47571e850ab74f" + integrity sha512-sBszbQH46rko6w2fdEG77ma8+fAg0SDkLZGxWhv4trgcnYGUBFl2dcpEPt/6koto9b4XYlf+eh+qi6iGvYqRPg== + dependencies: + "@algolia/client-common" "4.4.0" + "@algolia/requester-common" "4.4.0" + "@algolia/transporter" "4.4.0" + +"@algolia/client-search@4.4.0": + version "4.4.0" + resolved "https://registry.yarnpkg.com/@algolia/client-search/-/client-search-4.4.0.tgz#c1e107206f3ae719cd3a9877889eea5e5cbcdc62" + integrity sha512-jqWcxCUyPPHnHreoMb2PnN9iHTP+V/nL62R84XuTRDE3VgTnhm4ZnqyuRdzZQqaz+gNy5znav64TmQ9FN9WW5g== + dependencies: + "@algolia/client-common" "4.4.0" + "@algolia/requester-common" "4.4.0" + "@algolia/transporter" "4.4.0" + +"@algolia/logger-common@4.4.0": + version "4.4.0" + resolved "https://registry.yarnpkg.com/@algolia/logger-common/-/logger-common-4.4.0.tgz#8115d95d5f6227f0127d33130a9c4622cde64f6f" + integrity sha512-2vjmSENLaKNuF+ytRDysfWxxgFG95WXCHwHbueThdPMCK3hskkwqJ0Y/pugKfzl+54mZxegb4BYfgcCeuaHVUw== + +"@algolia/logger-console@4.4.0": + version "4.4.0" + resolved "https://registry.yarnpkg.com/@algolia/logger-console/-/logger-console-4.4.0.tgz#1e0eaaf0879f152f9a1fa333c4cd8cb55e071552" + integrity sha512-st/GUWyKvr6YM72OOfF+RmpdVGda3BPXbQ+chpntUq1WyVkyZXGjSmH1IcBVlua27GzxabwOUYON39cF3x10/g== + dependencies: + "@algolia/logger-common" "4.4.0" + +"@algolia/requester-browser-xhr@4.4.0": + version "4.4.0" + resolved "https://registry.yarnpkg.com/@algolia/requester-browser-xhr/-/requester-browser-xhr-4.4.0.tgz#f5877397ed92d2d64d08846ea969aeb559a5efb6" + integrity sha512-V3a4hXlNch355GnWaT1f5QfXhROpsjT6sd0Znq29gAhwLqfBExhLW6Khdkv5pENC0Qy7ClVhdXFrBL9QCQer1g== + dependencies: + "@algolia/requester-common" "4.4.0" + +"@algolia/requester-common@4.4.0": + version "4.4.0" + resolved "https://registry.yarnpkg.com/@algolia/requester-common/-/requester-common-4.4.0.tgz#0e977939aae32ff81a6d27480a71771a65db6051" + integrity sha512-jPinHlFJEFokxQ5b3JWyjQKKn+FMy0hH99PApzOgQAYOSiFRXiPEZp6LeIexDeLLu7Y3eRt/3nHvjPKa6PmRRw== + +"@algolia/requester-node-http@4.4.0": + version "4.4.0" + resolved "https://registry.yarnpkg.com/@algolia/requester-node-http/-/requester-node-http-4.4.0.tgz#6ffba93d54eeadf64cb1be67fae5c4e3f7c8f390" + integrity sha512-b7HC9C/GHxiV4+0GpCRTtjscvwarPr3dGm4CAhb6AkNjgjRcFUNr1NfsF75w3WVmzmt79/7QZihddztDdVMGjw== + dependencies: + "@algolia/requester-common" "4.4.0" + +"@algolia/transporter@4.4.0": + version "4.4.0" + resolved "https://registry.yarnpkg.com/@algolia/transporter/-/transporter-4.4.0.tgz#6ec79aac43bc515c8e4f6d6e27dc8d8cd7112f7e" + integrity sha512-Xxzq91DEEeKIzT3DU46n4LEyTGAKZNtSHc2H9wvIY5MYwhZwEribmXXZ6k8W1FvBvzggv3juu0SP+xwGoR7F0w== + dependencies: + "@algolia/cache-common" "4.4.0" + "@algolia/logger-common" "4.4.0" + "@algolia/requester-common" "4.4.0" + +"@babel/code-frame@7.8.3": version "7.8.3" resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.8.3.tgz#33e25903d7481181534e12ec0a25f16b6fcf419e" integrity sha512-a9gxpmdXtZEInkCSHUJDLHZVBgb1QS0jhss4cPP93EW7s+uC5bikET2twEF3KV+7rDblJcmNvTR7VJejqd2C2g== dependencies: "@babel/highlight" "^7.8.3" -"@babel/code-frame@^7.0.0", "@babel/code-frame@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.10.1.tgz#d5481c5095daa1c57e16e54c6f9198443afb49ff" - integrity sha512-IGhtTmpjGbYzcEDOw7DcQtbQSXcG9ftmAXtWTu9V936vDye4xjjekktFAtgZsWpzTj/X01jocB46mTywm/4SZw== +"@babel/code-frame@^7.0.0", "@babel/code-frame@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.10.4.tgz#168da1a36e90da68ae8d49c0f1b48c7c6249213a" + integrity sha512-vG6SvB6oYEhvgisZNFRmRCUkLz11c7rp+tbNTynGqc6mS1d5ATd/sGyV6W0KZZnXRKMTzZDRgQT3Ou9jhpAfUg== dependencies: - "@babel/highlight" "^7.10.1" + "@babel/highlight" "^7.10.4" -"@babel/compat-data@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/compat-data/-/compat-data-7.10.1.tgz#b1085ffe72cd17bf2c0ee790fc09f9626011b2db" - integrity sha512-CHvCj7So7iCkGKPRFUfryXIkU2gSBw7VSZFYLsqVhrS47269VK2Hfi9S/YcublPMW8k1u2bQBlbDruoQEm4fgw== +"@babel/compat-data@^7.10.4", "@babel/compat-data@^7.11.0": + version "7.11.0" + resolved "https://registry.yarnpkg.com/@babel/compat-data/-/compat-data-7.11.0.tgz#e9f73efe09af1355b723a7f39b11bad637d7c99c" + integrity sha512-TPSvJfv73ng0pfnEOh17bYMPQbI95+nGWc71Ss4vZdRBHTDqmM9Z8ZV4rYz8Ks7sfzc95n30k6ODIq5UGnXcYQ== dependencies: browserslist "^4.12.0" invariant "^2.2.4" semver "^5.5.0" -"@babel/core@7.9.6": - version "7.9.6" - resolved "https://registry.yarnpkg.com/@babel/core/-/core-7.9.6.tgz#d9aa1f580abf3b2286ef40b6904d390904c63376" - integrity sha512-nD3deLvbsApbHAHttzIssYqgb883yU/d9roe4RZymBCDaZryMJDbptVpEpeQuRh4BJ+SYI8le9YGxKvFEvl1Wg== - dependencies: - "@babel/code-frame" "^7.8.3" - "@babel/generator" "^7.9.6" - "@babel/helper-module-transforms" "^7.9.0" - "@babel/helpers" "^7.9.6" - "@babel/parser" "^7.9.6" - "@babel/template" "^7.8.6" - "@babel/traverse" "^7.9.6" - "@babel/types" "^7.9.6" +"@babel/core@7.10.5": + version "7.10.5" + resolved "https://registry.yarnpkg.com/@babel/core/-/core-7.10.5.tgz#1f15e2cca8ad9a1d78a38ddba612f5e7cdbbd330" + integrity sha512-O34LQooYVDXPl7QWCdW9p4NR+QlzOr7xShPPJz8GsuCU3/8ua/wqTr7gmnxXv+WBESiGU/G5s16i6tUvHkNb+w== + dependencies: + "@babel/code-frame" "^7.10.4" + "@babel/generator" "^7.10.5" + "@babel/helper-module-transforms" "^7.10.5" + "@babel/helpers" "^7.10.4" + "@babel/parser" "^7.10.5" + "@babel/template" "^7.10.4" + "@babel/traverse" "^7.10.5" + "@babel/types" "^7.10.5" convert-source-map "^1.7.0" debug "^4.1.0" gensync "^1.0.0-beta.1" json5 "^2.1.2" - lodash "^4.17.13" + lodash "^4.17.19" resolve "^1.3.2" semver "^5.4.1" source-map "^0.5.0" "@babel/core@^7.7.5", "@babel/core@^7.9.0": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/core/-/core-7.10.1.tgz#2a0ad0ea693601820defebad2140206503d89af3" - integrity sha512-u8XiZ6sMXW/gPmoP5ijonSUln4unazG291X0XAQ5h0s8qnAFr6BRRZGUEK+jtRWdmB0NTJQt7Uga25q8GetIIg== - dependencies: - "@babel/code-frame" "^7.10.1" - "@babel/generator" "^7.10.1" - "@babel/helper-module-transforms" "^7.10.1" - "@babel/helpers" "^7.10.1" - "@babel/parser" "^7.10.1" - "@babel/template" "^7.10.1" - "@babel/traverse" "^7.10.1" - "@babel/types" "^7.10.1" + version "7.11.4" + resolved "https://registry.yarnpkg.com/@babel/core/-/core-7.11.4.tgz#4301dfdfafa01eeb97f1896c5501a3f0655d4229" + integrity sha512-5deljj5HlqRXN+5oJTY7Zs37iH3z3b++KjiKtIsJy1NrjOOVSEaJHEetLBhyu0aQOSNNZ/0IuEAan9GzRuDXHg== + dependencies: + "@babel/code-frame" "^7.10.4" + "@babel/generator" "^7.11.4" + "@babel/helper-module-transforms" "^7.11.0" + "@babel/helpers" "^7.10.4" + "@babel/parser" "^7.11.4" + "@babel/template" "^7.10.4" + "@babel/traverse" "^7.11.0" + "@babel/types" "^7.11.0" convert-source-map "^1.7.0" debug "^4.1.0" gensync "^1.0.0-beta.1" json5 "^2.1.2" - lodash "^4.17.13" + lodash "^4.17.19" resolve "^1.3.2" semver "^5.4.1" source-map "^0.5.0" -"@babel/generator@^7.10.1", "@babel/generator@^7.9.6": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.10.1.tgz#4d14458e539bcb04ffe34124143f5c489f2dbca9" - integrity sha512-AT0YPLQw9DI21tliuJIdplVfLHya6mcGa8ctkv7n4Qv+hYacJrKmNWIteAK1P9iyLikFIAkwqJ7HAOqIDLFfgA== - dependencies: - "@babel/types" "^7.10.1" - jsesc "^2.5.1" - lodash "^4.17.13" - source-map "^0.5.0" - -"@babel/generator@^7.9.5": - version "7.9.5" - resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.9.5.tgz#27f0917741acc41e6eaaced6d68f96c3fa9afaf9" - integrity sha512-GbNIxVB3ZJe3tLeDm1HSn2AhuD/mVcyLDpgtLXa5tplmWrJdF/elxB56XNqCuD6szyNkDi6wuoKXln3QeBmCHQ== +"@babel/generator@^7.10.5", "@babel/generator@^7.11.0", "@babel/generator@^7.11.4": + version "7.11.4" + resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.11.4.tgz#1ec7eec00defba5d6f83e50e3ee72ae2fee482be" + integrity sha512-Rn26vueFx0eOoz7iifCN2UHT6rGtnkSGWSoDRIy8jZN3B91PzeSULbswfLoOWuTuAcNwpG/mxy+uCTDnZ9Mp1g== dependencies: - "@babel/types" "^7.9.5" + "@babel/types" "^7.11.0" jsesc "^2.5.1" - lodash "^4.17.13" source-map "^0.5.0" -"@babel/helper-annotate-as-pure@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.10.1.tgz#f6d08acc6f70bbd59b436262553fb2e259a1a268" - integrity sha512-ewp3rvJEwLaHgyWGe4wQssC2vjks3E80WiUe2BpMb0KhreTjMROCbxXcEovTrbeGVdQct5VjQfrv9EgC+xMzCw== +"@babel/helper-annotate-as-pure@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.10.4.tgz#5bf0d495a3f757ac3bda48b5bf3b3ba309c72ba3" + integrity sha512-XQlqKQP4vXFB7BN8fEEerrmYvHp3fK/rBkRFz9jaJbzK0B1DSfej9Kc7ZzE8Z/OnId1jpJdNAZ3BFQjWG68rcA== dependencies: - "@babel/types" "^7.10.1" + "@babel/types" "^7.10.4" -"@babel/helper-annotate-as-pure@^7.8.3": - version "7.8.3" - resolved "https://registry.yarnpkg.com/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.8.3.tgz#60bc0bc657f63a0924ff9a4b4a0b24a13cf4deee" - integrity sha512-6o+mJrZBxOoEX77Ezv9zwW7WV8DdluouRKNY/IR5u/YTMuKHgugHOzYWlYvYLpLA9nPsQCAAASpCIbjI9Mv+Uw== +"@babel/helper-builder-binary-assignment-operator-visitor@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/helper-builder-binary-assignment-operator-visitor/-/helper-builder-binary-assignment-operator-visitor-7.10.4.tgz#bb0b75f31bf98cbf9ff143c1ae578b87274ae1a3" + integrity sha512-L0zGlFrGWZK4PbT8AszSfLTM5sDU1+Az/En9VrdT8/LmEiJt4zXt+Jve9DCAnQcbqDhCI+29y/L93mrDzddCcg== dependencies: - "@babel/types" "^7.8.3" + "@babel/helper-explode-assignable-expression" "^7.10.4" + "@babel/types" "^7.10.4" -"@babel/helper-builder-binary-assignment-operator-visitor@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/helper-builder-binary-assignment-operator-visitor/-/helper-builder-binary-assignment-operator-visitor-7.10.1.tgz#0ec7d9be8174934532661f87783eb18d72290059" - integrity sha512-cQpVq48EkYxUU0xozpGCLla3wlkdRRqLWu1ksFMXA9CM5KQmyyRpSEsYXbao7JUkOw/tAaYKCaYyZq6HOFYtyw== +"@babel/helper-builder-react-jsx-experimental@^7.10.4": + version "7.10.5" + resolved "https://registry.yarnpkg.com/@babel/helper-builder-react-jsx-experimental/-/helper-builder-react-jsx-experimental-7.10.5.tgz#f35e956a19955ff08c1258e44a515a6d6248646b" + integrity sha512-Buewnx6M4ttG+NLkKyt7baQn7ScC/Td+e99G914fRU8fGIUivDDgVIQeDHFa5e4CRSJQt58WpNHhsAZgtzVhsg== dependencies: - "@babel/helper-explode-assignable-expression" "^7.10.1" - "@babel/types" "^7.10.1" + "@babel/helper-annotate-as-pure" "^7.10.4" + "@babel/helper-module-imports" "^7.10.4" + "@babel/types" "^7.10.5" -"@babel/helper-builder-react-jsx-experimental@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/helper-builder-react-jsx-experimental/-/helper-builder-react-jsx-experimental-7.10.1.tgz#9a7d58ad184d3ac3bafb1a452cec2bad7e4a0bc8" - integrity sha512-irQJ8kpQUV3JasXPSFQ+LCCtJSc5ceZrPFVj6TElR6XCHssi3jV8ch3odIrNtjJFRZZVbrOEfJMI79TPU/h1pQ== +"@babel/helper-builder-react-jsx@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/helper-builder-react-jsx/-/helper-builder-react-jsx-7.10.4.tgz#8095cddbff858e6fa9c326daee54a2f2732c1d5d" + integrity sha512-5nPcIZ7+KKDxT1427oBivl9V9YTal7qk0diccnh7RrcgrT/pGFOjgGw1dgryyx1GvHEpXVfoDF6Ak3rTiWh8Rg== dependencies: - "@babel/helper-annotate-as-pure" "^7.10.1" - "@babel/helper-module-imports" "^7.10.1" - "@babel/types" "^7.10.1" + "@babel/helper-annotate-as-pure" "^7.10.4" + "@babel/types" "^7.10.4" -"@babel/helper-builder-react-jsx@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/helper-builder-react-jsx/-/helper-builder-react-jsx-7.10.1.tgz#a327f0cf983af5554701b1215de54a019f09b532" - integrity sha512-KXzzpyWhXgzjXIlJU1ZjIXzUPdej1suE6vzqgImZ/cpAsR/CC8gUcX4EWRmDfWz/cs6HOCPMBIJ3nKoXt3BFuw== +"@babel/helper-compilation-targets@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/helper-compilation-targets/-/helper-compilation-targets-7.10.4.tgz#804ae8e3f04376607cc791b9d47d540276332bd2" + integrity sha512-a3rYhlsGV0UHNDvrtOXBg8/OpfV0OKTkxKPzIplS1zpx7CygDcWWxckxZeDd3gzPzC4kUT0A4nVFDK0wGMh4MQ== dependencies: - "@babel/helper-annotate-as-pure" "^7.10.1" - "@babel/types" "^7.10.1" - -"@babel/helper-compilation-targets@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/helper-compilation-targets/-/helper-compilation-targets-7.10.1.tgz#ad6f69b4c3bae955081ef914a84e5878ffcaca63" - integrity sha512-YuF8IrgSmX/+MV2plPkjEnzlC2wf+gaok8ehMNN0jodF3/sejZauExqpEVGbJua62oaWoNYIXwz4RmAsVcGyHw== - dependencies: - "@babel/compat-data" "^7.10.1" + "@babel/compat-data" "^7.10.4" browserslist "^4.12.0" invariant "^2.2.4" levenary "^1.1.1" semver "^5.5.0" -"@babel/helper-create-class-features-plugin@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/helper-create-class-features-plugin/-/helper-create-class-features-plugin-7.10.1.tgz#6d8a45aafe492378d0e6fc0b33e5dea132eae21c" - integrity sha512-bwhdehBJZt84HuPUcP1HaTLuc/EywVS8rc3FgsEPDcivg+DCW+SHuLHVkYOmcBA1ZfI+Z/oZjQc/+bPmIO7uAA== - dependencies: - "@babel/helper-function-name" "^7.10.1" - "@babel/helper-member-expression-to-functions" "^7.10.1" - "@babel/helper-optimise-call-expression" "^7.10.1" - "@babel/helper-plugin-utils" "^7.10.1" - "@babel/helper-replace-supers" "^7.10.1" - "@babel/helper-split-export-declaration" "^7.10.1" - -"@babel/helper-create-regexp-features-plugin@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/helper-create-regexp-features-plugin/-/helper-create-regexp-features-plugin-7.10.1.tgz#1b8feeab1594cbcfbf3ab5a3bbcabac0468efdbd" - integrity sha512-Rx4rHS0pVuJn5pJOqaqcZR4XSgeF9G/pO/79t+4r7380tXFJdzImFnxMU19f83wjSrmKHq6myrM10pFHTGzkUA== - dependencies: - "@babel/helper-annotate-as-pure" "^7.10.1" - "@babel/helper-regex" "^7.10.1" - regexpu-core "^4.7.0" - -"@babel/helper-create-regexp-features-plugin@^7.8.3", "@babel/helper-create-regexp-features-plugin@^7.8.8": - version "7.8.8" - resolved "https://registry.yarnpkg.com/@babel/helper-create-regexp-features-plugin/-/helper-create-regexp-features-plugin-7.8.8.tgz#5d84180b588f560b7864efaeea89243e58312087" - integrity sha512-LYVPdwkrQEiX9+1R29Ld/wTrmQu1SSKYnuOk3g0CkcZMA1p0gsNxJFj/3gBdaJ7Cg0Fnek5z0DsMULePP7Lrqg== - dependencies: - "@babel/helper-annotate-as-pure" "^7.8.3" - "@babel/helper-regex" "^7.8.3" +"@babel/helper-create-class-features-plugin@^7.10.4", "@babel/helper-create-class-features-plugin@^7.10.5": + version "7.10.5" + resolved "https://registry.yarnpkg.com/@babel/helper-create-class-features-plugin/-/helper-create-class-features-plugin-7.10.5.tgz#9f61446ba80e8240b0a5c85c6fdac8459d6f259d" + integrity sha512-0nkdeijB7VlZoLT3r/mY3bUkw3T8WG/hNw+FATs/6+pG2039IJWjTYL0VTISqsNHMUTEnwbVnc89WIJX9Qed0A== + dependencies: + "@babel/helper-function-name" "^7.10.4" + "@babel/helper-member-expression-to-functions" "^7.10.5" + "@babel/helper-optimise-call-expression" "^7.10.4" + "@babel/helper-plugin-utils" "^7.10.4" + "@babel/helper-replace-supers" "^7.10.4" + "@babel/helper-split-export-declaration" "^7.10.4" + +"@babel/helper-create-regexp-features-plugin@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/helper-create-regexp-features-plugin/-/helper-create-regexp-features-plugin-7.10.4.tgz#fdd60d88524659a0b6959c0579925e425714f3b8" + integrity sha512-2/hu58IEPKeoLF45DBwx3XFqsbCXmkdAay4spVr2x0jYgRxrSNp+ePwvSsy9g6YSaNDcKIQVPXk1Ov8S2edk2g== + dependencies: + "@babel/helper-annotate-as-pure" "^7.10.4" + "@babel/helper-regex" "^7.10.4" regexpu-core "^4.7.0" -"@babel/helper-define-map@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/helper-define-map/-/helper-define-map-7.10.1.tgz#5e69ee8308648470dd7900d159c044c10285221d" - integrity sha512-+5odWpX+OnvkD0Zmq7panrMuAGQBu6aPUgvMzuMGo4R+jUOvealEj2hiqI6WhxgKrTpFoFj0+VdsuA8KDxHBDg== +"@babel/helper-define-map@^7.10.4": + version "7.10.5" + resolved "https://registry.yarnpkg.com/@babel/helper-define-map/-/helper-define-map-7.10.5.tgz#b53c10db78a640800152692b13393147acb9bb30" + integrity sha512-fMw4kgFB720aQFXSVaXr79pjjcW5puTCM16+rECJ/plGS+zByelE8l9nCpV1GibxTnFVmUuYG9U8wYfQHdzOEQ== dependencies: - "@babel/helper-function-name" "^7.10.1" - "@babel/types" "^7.10.1" - lodash "^4.17.13" - -"@babel/helper-explode-assignable-expression@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/helper-explode-assignable-expression/-/helper-explode-assignable-expression-7.10.1.tgz#e9d76305ee1162ca467357ae25df94f179af2b7e" - integrity sha512-vcUJ3cDjLjvkKzt6rHrl767FeE7pMEYfPanq5L16GRtrXIoznc0HykNW2aEYkcnP76P0isoqJ34dDMFZwzEpJg== + "@babel/helper-function-name" "^7.10.4" + "@babel/types" "^7.10.5" + lodash "^4.17.19" + +"@babel/helper-explode-assignable-expression@^7.10.4": + version "7.11.4" + resolved "https://registry.yarnpkg.com/@babel/helper-explode-assignable-expression/-/helper-explode-assignable-expression-7.11.4.tgz#2d8e3470252cc17aba917ede7803d4a7a276a41b" + integrity sha512-ux9hm3zR4WV1Y3xXxXkdG/0gxF9nvI0YVmKVhvK9AfMoaQkemL3sJpXw+Xbz65azo8qJiEz2XVDUpK3KYhH3ZQ== dependencies: - "@babel/traverse" "^7.10.1" - "@babel/types" "^7.10.1" - -"@babel/helper-function-name@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/helper-function-name/-/helper-function-name-7.10.1.tgz#92bd63829bfc9215aca9d9defa85f56b539454f4" - integrity sha512-fcpumwhs3YyZ/ttd5Rz0xn0TpIwVkN7X0V38B9TWNfVF42KEkhkAAuPCQ3oXmtTRtiPJrmZ0TrfS0GKF0eMaRQ== + "@babel/types" "^7.10.4" + +"@babel/helper-function-name@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/helper-function-name/-/helper-function-name-7.10.4.tgz#d2d3b20c59ad8c47112fa7d2a94bc09d5ef82f1a" + integrity sha512-YdaSyz1n8gY44EmN7x44zBn9zQ1Ry2Y+3GTA+3vH6Mizke1Vw0aWDM66FOYEPw8//qKkmqOckrGgTYa+6sceqQ== dependencies: - "@babel/helper-get-function-arity" "^7.10.1" - "@babel/template" "^7.10.1" - "@babel/types" "^7.10.1" + "@babel/helper-get-function-arity" "^7.10.4" + "@babel/template" "^7.10.4" + "@babel/types" "^7.10.4" -"@babel/helper-function-name@^7.9.5": - version "7.9.5" - resolved "https://registry.yarnpkg.com/@babel/helper-function-name/-/helper-function-name-7.9.5.tgz#2b53820d35275120e1874a82e5aabe1376920a5c" - integrity sha512-JVcQZeXM59Cd1qanDUxv9fgJpt3NeKUaqBqUEvfmQ+BCOKq2xUgaWZW2hr0dkbyJgezYuplEoh5knmrnS68efw== +"@babel/helper-get-function-arity@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/helper-get-function-arity/-/helper-get-function-arity-7.10.4.tgz#98c1cbea0e2332f33f9a4661b8ce1505b2c19ba2" + integrity sha512-EkN3YDB+SRDgiIUnNgcmiD361ti+AVbL3f3Henf6dqqUyr5dMsorno0lJWJuLhDhkI5sYEpgj6y9kB8AOU1I2A== dependencies: - "@babel/helper-get-function-arity" "^7.8.3" - "@babel/template" "^7.8.3" - "@babel/types" "^7.9.5" + "@babel/types" "^7.10.4" -"@babel/helper-get-function-arity@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/helper-get-function-arity/-/helper-get-function-arity-7.10.1.tgz#7303390a81ba7cb59613895a192b93850e373f7d" - integrity sha512-F5qdXkYGOQUb0hpRaPoetF9AnsXknKjWMZ+wmsIRsp5ge5sFh4c3h1eH2pRTTuy9KKAA2+TTYomGXAtEL2fQEw== - dependencies: - "@babel/types" "^7.10.1" - -"@babel/helper-get-function-arity@^7.8.3": - version "7.8.3" - resolved "https://registry.yarnpkg.com/@babel/helper-get-function-arity/-/helper-get-function-arity-7.8.3.tgz#b894b947bd004381ce63ea1db9f08547e920abd5" - integrity sha512-FVDR+Gd9iLjUMY1fzE2SR0IuaJToR4RkCDARVfsBBPSP53GEqSFjD8gNyxg246VUyc/ALRxFaAK8rVG7UT7xRA== +"@babel/helper-hoist-variables@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/helper-hoist-variables/-/helper-hoist-variables-7.10.4.tgz#d49b001d1d5a68ca5e6604dda01a6297f7c9381e" + integrity sha512-wljroF5PgCk2juF69kanHVs6vrLwIPNp6DLD+Lrl3hoQ3PpPPikaDRNFA+0t81NOoMt2DL6WW/mdU8k4k6ZzuA== dependencies: - "@babel/types" "^7.8.3" - -"@babel/helper-hoist-variables@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/helper-hoist-variables/-/helper-hoist-variables-7.10.1.tgz#7e77c82e5dcae1ebf123174c385aaadbf787d077" - integrity sha512-vLm5srkU8rI6X3+aQ1rQJyfjvCBLXP8cAGeuw04zeAM2ItKb1e7pmVmLyHb4sDaAYnLL13RHOZPLEtcGZ5xvjg== - dependencies: - "@babel/types" "^7.10.1" - -"@babel/helper-member-expression-to-functions@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/helper-member-expression-to-functions/-/helper-member-expression-to-functions-7.10.1.tgz#432967fd7e12a4afef66c4687d4ca22bc0456f15" - integrity sha512-u7XLXeM2n50gb6PWJ9hoO5oO7JFPaZtrh35t8RqKLT1jFKj9IWeD1zrcrYp1q1qiZTdEarfDWfTIP8nGsu0h5g== - dependencies: - "@babel/types" "^7.10.1" - -"@babel/helper-member-expression-to-functions@^7.8.3": - version "7.8.3" - resolved "https://registry.yarnpkg.com/@babel/helper-member-expression-to-functions/-/helper-member-expression-to-functions-7.8.3.tgz#659b710498ea6c1d9907e0c73f206eee7dadc24c" - integrity sha512-fO4Egq88utkQFjbPrSHGmGLFqmrshs11d46WI+WZDESt7Wu7wN2G2Iu+NMMZJFDOVRHAMIkB5SNh30NtwCA7RA== - dependencies: - "@babel/types" "^7.8.3" - -"@babel/helper-module-imports@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/helper-module-imports/-/helper-module-imports-7.10.1.tgz#dd331bd45bccc566ce77004e9d05fe17add13876" - integrity sha512-SFxgwYmZ3HZPyZwJRiVNLRHWuW2OgE5k2nrVs6D9Iv4PPnXVffuEHy83Sfx/l4SqF+5kyJXjAyUmrG7tNm+qVg== - dependencies: - "@babel/types" "^7.10.1" - -"@babel/helper-module-imports@^7.8.3": - version "7.8.3" - resolved "https://registry.yarnpkg.com/@babel/helper-module-imports/-/helper-module-imports-7.8.3.tgz#7fe39589b39c016331b6b8c3f441e8f0b1419498" - integrity sha512-R0Bx3jippsbAEtzkpZ/6FIiuzOURPcMjHp+Z6xPe6DtApDJx+w7UYyOLanZqO8+wKR9G10s/FmHXvxaMd9s6Kg== - dependencies: - "@babel/types" "^7.8.3" - -"@babel/helper-module-transforms@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/helper-module-transforms/-/helper-module-transforms-7.10.1.tgz#24e2f08ee6832c60b157bb0936c86bef7210c622" - integrity sha512-RLHRCAzyJe7Q7sF4oy2cB+kRnU4wDZY/H2xJFGof+M+SJEGhZsb+GFj5j1AD8NiSaVBJ+Pf0/WObiXu/zxWpFg== - dependencies: - "@babel/helper-module-imports" "^7.10.1" - "@babel/helper-replace-supers" "^7.10.1" - "@babel/helper-simple-access" "^7.10.1" - "@babel/helper-split-export-declaration" "^7.10.1" - "@babel/template" "^7.10.1" - "@babel/types" "^7.10.1" - lodash "^4.17.13" - -"@babel/helper-module-transforms@^7.9.0": - version "7.9.0" - resolved "https://registry.yarnpkg.com/@babel/helper-module-transforms/-/helper-module-transforms-7.9.0.tgz#43b34dfe15961918707d247327431388e9fe96e5" - integrity sha512-0FvKyu0gpPfIQ8EkxlrAydOWROdHpBmiCiRwLkUiBGhCUPRRbVD2/tm3sFr/c/GWFrQ/ffutGUAnx7V0FzT2wA== - dependencies: - "@babel/helper-module-imports" "^7.8.3" - "@babel/helper-replace-supers" "^7.8.6" - "@babel/helper-simple-access" "^7.8.3" - "@babel/helper-split-export-declaration" "^7.8.3" - "@babel/template" "^7.8.6" - "@babel/types" "^7.9.0" - lodash "^4.17.13" - -"@babel/helper-optimise-call-expression@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/helper-optimise-call-expression/-/helper-optimise-call-expression-7.10.1.tgz#b4a1f2561870ce1247ceddb02a3860fa96d72543" - integrity sha512-a0DjNS1prnBsoKx83dP2falChcs7p3i8VMzdrSbfLhuQra/2ENC4sbri34dz/rWmDADsmF1q5GbfaXydh0Jbjg== - dependencies: - "@babel/types" "^7.10.1" - -"@babel/helper-optimise-call-expression@^7.8.3": - version "7.8.3" - resolved "https://registry.yarnpkg.com/@babel/helper-optimise-call-expression/-/helper-optimise-call-expression-7.8.3.tgz#7ed071813d09c75298ef4f208956006b6111ecb9" - integrity sha512-Kag20n86cbO2AvHca6EJsvqAd82gc6VMGule4HwebwMlwkpXuVqrNRj6CkCV2sKxgi9MyAUnZVnZ6lJ1/vKhHQ== - dependencies: - "@babel/types" "^7.8.3" - -"@babel/helper-plugin-utils@7.8.3", "@babel/helper-plugin-utils@^7.0.0", "@babel/helper-plugin-utils@^7.8.0", "@babel/helper-plugin-utils@^7.8.3": - version "7.8.3" - resolved "https://registry.yarnpkg.com/@babel/helper-plugin-utils/-/helper-plugin-utils-7.8.3.tgz#9ea293be19babc0f52ff8ca88b34c3611b208670" - integrity sha512-j+fq49Xds2smCUNYmEHF9kGNkhbet6yVIBp4e6oeQpH1RUs/Ir06xUKzDjDkGcaaokPiTNs2JBWHjaE4csUkZQ== - -"@babel/helper-plugin-utils@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/helper-plugin-utils/-/helper-plugin-utils-7.10.1.tgz#ec5a5cf0eec925b66c60580328b122c01230a127" - integrity sha512-fvoGeXt0bJc7VMWZGCAEBEMo/HAjW2mP8apF5eXK0wSqwLAVHAISCWRoLMBMUs2kqeaG77jltVqu4Hn8Egl3nA== - -"@babel/helper-regex@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/helper-regex/-/helper-regex-7.10.1.tgz#021cf1a7ba99822f993222a001cc3fec83255b96" - integrity sha512-7isHr19RsIJWWLLFn21ubFt223PjQyg1HY7CZEMRr820HttHPpVvrsIN3bUOo44DEfFV4kBXO7Abbn9KTUZV7g== - dependencies: - lodash "^4.17.13" - -"@babel/helper-regex@^7.8.3": - version "7.8.3" - resolved "https://registry.yarnpkg.com/@babel/helper-regex/-/helper-regex-7.8.3.tgz#139772607d51b93f23effe72105b319d2a4c6965" - integrity sha512-BWt0QtYv/cg/NecOAZMdcn/waj/5P26DR4mVLXfFtDokSR6fyuG0Pj+e2FqtSME+MqED1khnSMulkmGl8qWiUQ== - dependencies: - lodash "^4.17.13" - -"@babel/helper-remap-async-to-generator@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/helper-remap-async-to-generator/-/helper-remap-async-to-generator-7.10.1.tgz#bad6aaa4ff39ce8d4b82ccaae0bfe0f7dbb5f432" - integrity sha512-RfX1P8HqsfgmJ6CwaXGKMAqbYdlleqglvVtht0HGPMSsy2V6MqLlOJVF/0Qyb/m2ZCi2z3q3+s6Pv7R/dQuZ6A== - dependencies: - "@babel/helper-annotate-as-pure" "^7.10.1" - "@babel/helper-wrap-function" "^7.10.1" - "@babel/template" "^7.10.1" - "@babel/traverse" "^7.10.1" - "@babel/types" "^7.10.1" - -"@babel/helper-replace-supers@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/helper-replace-supers/-/helper-replace-supers-7.10.1.tgz#ec6859d20c5d8087f6a2dc4e014db7228975f13d" - integrity sha512-SOwJzEfpuQwInzzQJGjGaiG578UYmyi2Xw668klPWV5n07B73S0a9btjLk/52Mlcxa+5AdIYqws1KyXRfMoB7A== - dependencies: - "@babel/helper-member-expression-to-functions" "^7.10.1" - "@babel/helper-optimise-call-expression" "^7.10.1" - "@babel/traverse" "^7.10.1" - "@babel/types" "^7.10.1" - -"@babel/helper-replace-supers@^7.8.6": - version "7.8.6" - resolved "https://registry.yarnpkg.com/@babel/helper-replace-supers/-/helper-replace-supers-7.8.6.tgz#5ada744fd5ad73203bf1d67459a27dcba67effc8" - integrity sha512-PeMArdA4Sv/Wf4zXwBKPqVj7n9UF/xg6slNRtZW84FM7JpE1CbG8B612FyM4cxrf4fMAMGO0kR7voy1ForHHFA== - dependencies: - "@babel/helper-member-expression-to-functions" "^7.8.3" - "@babel/helper-optimise-call-expression" "^7.8.3" - "@babel/traverse" "^7.8.6" - "@babel/types" "^7.8.6" - -"@babel/helper-simple-access@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/helper-simple-access/-/helper-simple-access-7.10.1.tgz#08fb7e22ace9eb8326f7e3920a1c2052f13d851e" - integrity sha512-VSWpWzRzn9VtgMJBIWTZ+GP107kZdQ4YplJlCmIrjoLVSi/0upixezHCDG8kpPVTBJpKfxTH01wDhh+jS2zKbw== - dependencies: - "@babel/template" "^7.10.1" - "@babel/types" "^7.10.1" - -"@babel/helper-simple-access@^7.8.3": - version "7.8.3" - resolved "https://registry.yarnpkg.com/@babel/helper-simple-access/-/helper-simple-access-7.8.3.tgz#7f8109928b4dab4654076986af575231deb639ae" - integrity sha512-VNGUDjx5cCWg4vvCTR8qQ7YJYZ+HBjxOgXEl7ounz+4Sn7+LMD3CFrCTEU6/qXKbA2nKg21CwhhBzO0RpRbdCw== - dependencies: - "@babel/template" "^7.8.3" - "@babel/types" "^7.8.3" - -"@babel/helper-split-export-declaration@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/helper-split-export-declaration/-/helper-split-export-declaration-7.10.1.tgz#c6f4be1cbc15e3a868e4c64a17d5d31d754da35f" - integrity sha512-UQ1LVBPrYdbchNhLwj6fetj46BcFwfS4NllJo/1aJsT+1dLTEnXJL0qHqtY7gPzF8S2fXBJamf1biAXV3X077g== - dependencies: - "@babel/types" "^7.10.1" - -"@babel/helper-split-export-declaration@^7.8.3": - version "7.8.3" - resolved "https://registry.yarnpkg.com/@babel/helper-split-export-declaration/-/helper-split-export-declaration-7.8.3.tgz#31a9f30070f91368a7182cf05f831781065fc7a9" - integrity sha512-3x3yOeyBhW851hroze7ElzdkeRXQYQbFIb7gLK1WQYsw2GWDay5gAJNw1sWJ0VFP6z5J1whqeXH/WCdCjZv6dA== - dependencies: - "@babel/types" "^7.8.3" - -"@babel/helper-validator-identifier@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/helper-validator-identifier/-/helper-validator-identifier-7.10.1.tgz#5770b0c1a826c4f53f5ede5e153163e0318e94b5" - integrity sha512-5vW/JXLALhczRCWP0PnFDMCJAchlBvM7f4uk/jXritBnIa6E1KmqmtrS3yn1LAnxFBypQ3eneLuXjsnfQsgILw== - -"@babel/helper-validator-identifier@^7.9.0", "@babel/helper-validator-identifier@^7.9.5": - version "7.9.5" - resolved "https://registry.yarnpkg.com/@babel/helper-validator-identifier/-/helper-validator-identifier-7.9.5.tgz#90977a8e6fbf6b431a7dc31752eee233bf052d80" - integrity sha512-/8arLKUFq882w4tWGj9JYzRpAlZgiWUJ+dtteNTDqrRBz9Iguck9Rn3ykuBDoUwh2TO4tSAJlrxDUOXWklJe4g== - -"@babel/helper-wrap-function@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/helper-wrap-function/-/helper-wrap-function-7.10.1.tgz#956d1310d6696257a7afd47e4c42dfda5dfcedc9" - integrity sha512-C0MzRGteVDn+H32/ZgbAv5r56f2o1fZSA/rj/TYo8JEJNHg+9BdSmKBUND0shxWRztWhjlT2cvHYuynpPsVJwQ== - dependencies: - "@babel/helper-function-name" "^7.10.1" - "@babel/template" "^7.10.1" - "@babel/traverse" "^7.10.1" - "@babel/types" "^7.10.1" - -"@babel/helpers@^7.10.1", "@babel/helpers@^7.9.6": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/helpers/-/helpers-7.10.1.tgz#a6827b7cb975c9d9cef5fd61d919f60d8844a973" - integrity sha512-muQNHF+IdU6wGgkaJyhhEmI54MOZBKsFfsXFhboz1ybwJ1Kl7IHlbm2a++4jwrmY5UYsgitt5lfqo1wMFcHmyw== - dependencies: - "@babel/template" "^7.10.1" - "@babel/traverse" "^7.10.1" - "@babel/types" "^7.10.1" - -"@babel/highlight@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/highlight/-/highlight-7.10.1.tgz#841d098ba613ba1a427a2b383d79e35552c38ae0" - integrity sha512-8rMof+gVP8mxYZApLF/JgNDAkdKa+aJt3ZYxF8z6+j/hpeXL7iMsKCPHa2jNMHu/qqBwzQF4OHNoYi8dMA/rYg== - dependencies: - "@babel/helper-validator-identifier" "^7.10.1" + "@babel/types" "^7.10.4" + +"@babel/helper-member-expression-to-functions@^7.10.4", "@babel/helper-member-expression-to-functions@^7.10.5": + version "7.11.0" + resolved "https://registry.yarnpkg.com/@babel/helper-member-expression-to-functions/-/helper-member-expression-to-functions-7.11.0.tgz#ae69c83d84ee82f4b42f96e2a09410935a8f26df" + integrity sha512-JbFlKHFntRV5qKw3YC0CvQnDZ4XMwgzzBbld7Ly4Mj4cbFy3KywcR8NtNctRToMWJOVvLINJv525Gd6wwVEx/Q== + dependencies: + "@babel/types" "^7.11.0" + +"@babel/helper-module-imports@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/helper-module-imports/-/helper-module-imports-7.10.4.tgz#4c5c54be04bd31670a7382797d75b9fa2e5b5620" + integrity sha512-nEQJHqYavI217oD9+s5MUBzk6x1IlvoS9WTPfgG43CbMEeStE0v+r+TucWdx8KFGowPGvyOkDT9+7DHedIDnVw== + dependencies: + "@babel/types" "^7.10.4" + +"@babel/helper-module-transforms@^7.10.4", "@babel/helper-module-transforms@^7.10.5", "@babel/helper-module-transforms@^7.11.0": + version "7.11.0" + resolved "https://registry.yarnpkg.com/@babel/helper-module-transforms/-/helper-module-transforms-7.11.0.tgz#b16f250229e47211abdd84b34b64737c2ab2d359" + integrity sha512-02EVu8COMuTRO1TAzdMtpBPbe6aQ1w/8fePD2YgQmxZU4gpNWaL9gK3Jp7dxlkUlUCJOTaSeA+Hrm1BRQwqIhg== + dependencies: + "@babel/helper-module-imports" "^7.10.4" + "@babel/helper-replace-supers" "^7.10.4" + "@babel/helper-simple-access" "^7.10.4" + "@babel/helper-split-export-declaration" "^7.11.0" + "@babel/template" "^7.10.4" + "@babel/types" "^7.11.0" + lodash "^4.17.19" + +"@babel/helper-optimise-call-expression@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/helper-optimise-call-expression/-/helper-optimise-call-expression-7.10.4.tgz#50dc96413d594f995a77905905b05893cd779673" + integrity sha512-n3UGKY4VXwXThEiKrgRAoVPBMqeoPgHVqiHZOanAJCG9nQUL2pLRQirUzl0ioKclHGpGqRgIOkgcIJaIWLpygg== + dependencies: + "@babel/types" "^7.10.4" + +"@babel/helper-plugin-utils@7.10.4", "@babel/helper-plugin-utils@^7.0.0", "@babel/helper-plugin-utils@^7.10.4", "@babel/helper-plugin-utils@^7.8.0", "@babel/helper-plugin-utils@^7.8.3": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/helper-plugin-utils/-/helper-plugin-utils-7.10.4.tgz#2f75a831269d4f677de49986dff59927533cf375" + integrity sha512-O4KCvQA6lLiMU9l2eawBPMf1xPP8xPfB3iEQw150hOVTqj/rfXz0ThTb4HEzqQfs2Bmo5Ay8BzxfzVtBrr9dVg== + +"@babel/helper-regex@^7.10.4": + version "7.10.5" + resolved "https://registry.yarnpkg.com/@babel/helper-regex/-/helper-regex-7.10.5.tgz#32dfbb79899073c415557053a19bd055aae50ae0" + integrity sha512-68kdUAzDrljqBrio7DYAEgCoJHxppJOERHOgOrDN7WjOzP0ZQ1LsSDRXcemzVZaLvjaJsJEESb6qt+znNuENDg== + dependencies: + lodash "^4.17.19" + +"@babel/helper-remap-async-to-generator@^7.10.4": + version "7.11.4" + resolved "https://registry.yarnpkg.com/@babel/helper-remap-async-to-generator/-/helper-remap-async-to-generator-7.11.4.tgz#4474ea9f7438f18575e30b0cac784045b402a12d" + integrity sha512-tR5vJ/vBa9wFy3m5LLv2faapJLnDFxNWff2SAYkSE4rLUdbp7CdObYFgI7wK4T/Mj4UzpjPwzR8Pzmr5m7MHGA== + dependencies: + "@babel/helper-annotate-as-pure" "^7.10.4" + "@babel/helper-wrap-function" "^7.10.4" + "@babel/template" "^7.10.4" + "@babel/types" "^7.10.4" + +"@babel/helper-replace-supers@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/helper-replace-supers/-/helper-replace-supers-7.10.4.tgz#d585cd9388ea06e6031e4cd44b6713cbead9e6cf" + integrity sha512-sPxZfFXocEymYTdVK1UNmFPBN+Hv5mJkLPsYWwGBxZAxaWfFu+xqp7b6qWD0yjNuNL2VKc6L5M18tOXUP7NU0A== + dependencies: + "@babel/helper-member-expression-to-functions" "^7.10.4" + "@babel/helper-optimise-call-expression" "^7.10.4" + "@babel/traverse" "^7.10.4" + "@babel/types" "^7.10.4" + +"@babel/helper-simple-access@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/helper-simple-access/-/helper-simple-access-7.10.4.tgz#0f5ccda2945277a2a7a2d3a821e15395edcf3461" + integrity sha512-0fMy72ej/VEvF8ULmX6yb5MtHG4uH4Dbd6I/aHDb/JVg0bbivwt9Wg+h3uMvX+QSFtwr5MeItvazbrc4jtRAXw== + dependencies: + "@babel/template" "^7.10.4" + "@babel/types" "^7.10.4" + +"@babel/helper-skip-transparent-expression-wrappers@^7.11.0": + version "7.11.0" + resolved "https://registry.yarnpkg.com/@babel/helper-skip-transparent-expression-wrappers/-/helper-skip-transparent-expression-wrappers-7.11.0.tgz#eec162f112c2f58d3af0af125e3bb57665146729" + integrity sha512-0XIdiQln4Elglgjbwo9wuJpL/K7AGCY26kmEt0+pRP0TAj4jjyNq1MjoRvikrTVqKcx4Gysxt4cXvVFXP/JO2Q== + dependencies: + "@babel/types" "^7.11.0" + +"@babel/helper-split-export-declaration@^7.10.4", "@babel/helper-split-export-declaration@^7.11.0": + version "7.11.0" + resolved "https://registry.yarnpkg.com/@babel/helper-split-export-declaration/-/helper-split-export-declaration-7.11.0.tgz#f8a491244acf6a676158ac42072911ba83ad099f" + integrity sha512-74Vejvp6mHkGE+m+k5vHY93FX2cAtrw1zXrZXRlG4l410Nm9PxfEiVTn1PjDPV5SnmieiueY4AFg2xqhNFuuZg== + dependencies: + "@babel/types" "^7.11.0" + +"@babel/helper-validator-identifier@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/helper-validator-identifier/-/helper-validator-identifier-7.10.4.tgz#a78c7a7251e01f616512d31b10adcf52ada5e0d2" + integrity sha512-3U9y+43hz7ZM+rzG24Qe2mufW5KhvFg/NhnNph+i9mgCtdTCtMJuI1TMkrIUiK7Ix4PYlRF9I5dhqaLYA/ADXw== + +"@babel/helper-wrap-function@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/helper-wrap-function/-/helper-wrap-function-7.10.4.tgz#8a6f701eab0ff39f765b5a1cfef409990e624b87" + integrity sha512-6py45WvEF0MhiLrdxtRjKjufwLL1/ob2qDJgg5JgNdojBAZSAKnAjkyOCNug6n+OBl4VW76XjvgSFTdaMcW0Ug== + dependencies: + "@babel/helper-function-name" "^7.10.4" + "@babel/template" "^7.10.4" + "@babel/traverse" "^7.10.4" + "@babel/types" "^7.10.4" + +"@babel/helpers@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/helpers/-/helpers-7.10.4.tgz#2abeb0d721aff7c0a97376b9e1f6f65d7a475044" + integrity sha512-L2gX/XeUONeEbI78dXSrJzGdz4GQ+ZTA/aazfUsFaWjSe95kiCuOZ5HsXvkiw3iwF+mFHSRUfJU8t6YavocdXA== + dependencies: + "@babel/template" "^7.10.4" + "@babel/traverse" "^7.10.4" + "@babel/types" "^7.10.4" + +"@babel/highlight@^7.10.4", "@babel/highlight@^7.8.3": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/highlight/-/highlight-7.10.4.tgz#7d1bdfd65753538fabe6c38596cdb76d9ac60143" + integrity sha512-i6rgnR/YgPEQzZZnbTHHuZdlE8qyoBNalD6F+q4vAFlcMEcqmkoG+mPqJYJCo63qPf74+Y1UZsl3l6f7/RIkmA== + dependencies: + "@babel/helper-validator-identifier" "^7.10.4" chalk "^2.0.0" js-tokens "^4.0.0" -"@babel/highlight@^7.8.3": - version "7.9.0" - resolved "https://registry.yarnpkg.com/@babel/highlight/-/highlight-7.9.0.tgz#4e9b45ccb82b79607271b2979ad82c7b68163079" - integrity sha512-lJZPilxX7Op3Nv/2cvFdnlepPXDxi29wxteT57Q965oc5R9v86ztx0jfxVrTcBk8C2kcPkkDa2Z4T3ZsPPVWsQ== - dependencies: - "@babel/helper-validator-identifier" "^7.9.0" - chalk "^2.0.0" - js-tokens "^4.0.0" - -"@babel/parser@^7.10.1", "@babel/parser@^7.9.4", "@babel/parser@^7.9.6": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.10.1.tgz#2e142c27ca58aa2c7b119d09269b702c8bbad28c" - integrity sha512-AUTksaz3FqugBkbTZ1i+lDLG5qy8hIzCaAxEtttU6C0BtZZU9pkNZtWSVAht4EW9kl46YBiyTGMp9xTTGqViNg== +"@babel/parser@^7.10.4", "@babel/parser@^7.10.5", "@babel/parser@^7.11.0", "@babel/parser@^7.11.4", "@babel/parser@^7.9.4": + version "7.11.4" + resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.11.4.tgz#6fa1a118b8b0d80d0267b719213dc947e88cc0ca" + integrity sha512-MggwidiH+E9j5Sh8pbrX5sJvMcsqS5o+7iB42M9/k0CD63MjYbdP4nhSh7uB5wnv2/RVzTZFTxzF/kIa5mrCqA== -"@babel/parser@^7.8.6", "@babel/parser@^7.9.0": - version "7.9.4" - resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.9.4.tgz#68a35e6b0319bbc014465be43828300113f2f2e8" - integrity sha512-bC49otXX6N0/VYhgOMh4gnP26E9xnDZK3TmbNpxYzzz9BQLBosQwfyOe9/cXUU3txYhTzLCbcqd5c8y/OmCjHA== - -"@babel/plugin-proposal-async-generator-functions@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-async-generator-functions/-/plugin-proposal-async-generator-functions-7.10.1.tgz#6911af5ba2e615c4ff3c497fe2f47b35bf6d7e55" - integrity sha512-vzZE12ZTdB336POZjmpblWfNNRpMSua45EYnRigE2XsZxcXcIyly2ixnTJasJE4Zq3U7t2d8rRF7XRUuzHxbOw== +"@babel/plugin-proposal-async-generator-functions@^7.10.4": + version "7.10.5" + resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-async-generator-functions/-/plugin-proposal-async-generator-functions-7.10.5.tgz#3491cabf2f7c179ab820606cec27fed15e0e8558" + integrity sha512-cNMCVezQbrRGvXJwm9fu/1sJj9bHdGAgKodZdLqOQIpfoH3raqmRPBM17+lh7CzhiKRRBrGtZL9WcjxSoGYUSg== dependencies: - "@babel/helper-plugin-utils" "^7.10.1" - "@babel/helper-remap-async-to-generator" "^7.10.1" + "@babel/helper-plugin-utils" "^7.10.4" + "@babel/helper-remap-async-to-generator" "^7.10.4" "@babel/plugin-syntax-async-generators" "^7.8.0" -"@babel/plugin-proposal-class-properties@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-class-properties/-/plugin-proposal-class-properties-7.10.1.tgz#046bc7f6550bb08d9bd1d4f060f5f5a4f1087e01" - integrity sha512-sqdGWgoXlnOdgMXU+9MbhzwFRgxVLeiGBqTrnuS7LC2IBU31wSsESbTUreT2O418obpfPdGUR2GbEufZF1bpqw== +"@babel/plugin-proposal-class-properties@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-class-properties/-/plugin-proposal-class-properties-7.10.4.tgz#a33bf632da390a59c7a8c570045d1115cd778807" + integrity sha512-vhwkEROxzcHGNu2mzUC0OFFNXdZ4M23ib8aRRcJSsW8BZK9pQMD7QB7csl97NBbgGZO7ZyHUyKDnxzOaP4IrCg== dependencies: - "@babel/helper-create-class-features-plugin" "^7.10.1" - "@babel/helper-plugin-utils" "^7.10.1" + "@babel/helper-create-class-features-plugin" "^7.10.4" + "@babel/helper-plugin-utils" "^7.10.4" -"@babel/plugin-proposal-dynamic-import@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-dynamic-import/-/plugin-proposal-dynamic-import-7.10.1.tgz#e36979dc1dc3b73f6d6816fc4951da2363488ef0" - integrity sha512-Cpc2yUVHTEGPlmiQzXj026kqwjEQAD9I4ZC16uzdbgWgitg/UHKHLffKNCQZ5+y8jpIZPJcKcwsr2HwPh+w3XA== +"@babel/plugin-proposal-dynamic-import@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-dynamic-import/-/plugin-proposal-dynamic-import-7.10.4.tgz#ba57a26cb98b37741e9d5bca1b8b0ddf8291f17e" + integrity sha512-up6oID1LeidOOASNXgv/CFbgBqTuKJ0cJjz6An5tWD+NVBNlp3VNSBxv2ZdU7SYl3NxJC7agAQDApZusV6uFwQ== dependencies: - "@babel/helper-plugin-utils" "^7.10.1" + "@babel/helper-plugin-utils" "^7.10.4" "@babel/plugin-syntax-dynamic-import" "^7.8.0" -"@babel/plugin-proposal-json-strings@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-json-strings/-/plugin-proposal-json-strings-7.10.1.tgz#b1e691ee24c651b5a5e32213222b2379734aff09" - integrity sha512-m8r5BmV+ZLpWPtMY2mOKN7wre6HIO4gfIiV+eOmsnZABNenrt/kzYBwrh+KOfgumSWpnlGs5F70J8afYMSJMBg== +"@babel/plugin-proposal-export-namespace-from@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-export-namespace-from/-/plugin-proposal-export-namespace-from-7.10.4.tgz#570d883b91031637b3e2958eea3c438e62c05f54" + integrity sha512-aNdf0LY6/3WXkhh0Fdb6Zk9j1NMD8ovj3F6r0+3j837Pn1S1PdNtcwJ5EG9WkVPNHPxyJDaxMaAOVq4eki0qbg== dependencies: - "@babel/helper-plugin-utils" "^7.10.1" + "@babel/helper-plugin-utils" "^7.10.4" + "@babel/plugin-syntax-export-namespace-from" "^7.8.3" + +"@babel/plugin-proposal-json-strings@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-json-strings/-/plugin-proposal-json-strings-7.10.4.tgz#593e59c63528160233bd321b1aebe0820c2341db" + integrity sha512-fCL7QF0Jo83uy1K0P2YXrfX11tj3lkpN7l4dMv9Y9VkowkhkQDwFHFd8IiwyK5MZjE8UpbgokkgtcReH88Abaw== + dependencies: + "@babel/helper-plugin-utils" "^7.10.4" "@babel/plugin-syntax-json-strings" "^7.8.0" -"@babel/plugin-proposal-nullish-coalescing-operator@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-nullish-coalescing-operator/-/plugin-proposal-nullish-coalescing-operator-7.10.1.tgz#02dca21673842ff2fe763ac253777f235e9bbf78" - integrity sha512-56cI/uHYgL2C8HVuHOuvVowihhX0sxb3nnfVRzUeVHTWmRHTZrKuAh/OBIMggGU/S1g/1D2CRCXqP+3u7vX7iA== +"@babel/plugin-proposal-logical-assignment-operators@^7.11.0": + version "7.11.0" + resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-logical-assignment-operators/-/plugin-proposal-logical-assignment-operators-7.11.0.tgz#9f80e482c03083c87125dee10026b58527ea20c8" + integrity sha512-/f8p4z+Auz0Uaf+i8Ekf1iM7wUNLcViFUGiPxKeXvxTSl63B875YPiVdUDdem7hREcI0E0kSpEhS8tF5RphK7Q== + dependencies: + "@babel/helper-plugin-utils" "^7.10.4" + "@babel/plugin-syntax-logical-assignment-operators" "^7.10.4" + +"@babel/plugin-proposal-nullish-coalescing-operator@^7.10.1", "@babel/plugin-proposal-nullish-coalescing-operator@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-nullish-coalescing-operator/-/plugin-proposal-nullish-coalescing-operator-7.10.4.tgz#02a7e961fc32e6d5b2db0649e01bf80ddee7e04a" + integrity sha512-wq5n1M3ZUlHl9sqT2ok1T2/MTt6AXE0e1Lz4WzWBr95LsAZ5qDXe4KnFuauYyEyLiohvXFMdbsOTMyLZs91Zlw== dependencies: - "@babel/helper-plugin-utils" "^7.10.1" + "@babel/helper-plugin-utils" "^7.10.4" "@babel/plugin-syntax-nullish-coalescing-operator" "^7.8.0" -"@babel/plugin-proposal-numeric-separator@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-numeric-separator/-/plugin-proposal-numeric-separator-7.10.1.tgz#a9a38bc34f78bdfd981e791c27c6fdcec478c123" - integrity sha512-jjfym4N9HtCiNfyyLAVD8WqPYeHUrw4ihxuAynWj6zzp2gf9Ey2f7ImhFm6ikB3CLf5Z/zmcJDri6B4+9j9RsA== +"@babel/plugin-proposal-numeric-separator@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-numeric-separator/-/plugin-proposal-numeric-separator-7.10.4.tgz#ce1590ff0a65ad12970a609d78855e9a4c1aef06" + integrity sha512-73/G7QoRoeNkLZFxsoCCvlg4ezE4eM+57PnOqgaPOozd5myfj7p0muD1mRVJvbUWbOzD+q3No2bWbaKy+DJ8DA== dependencies: - "@babel/helper-plugin-utils" "^7.10.1" - "@babel/plugin-syntax-numeric-separator" "^7.10.1" + "@babel/helper-plugin-utils" "^7.10.4" + "@babel/plugin-syntax-numeric-separator" "^7.10.4" -"@babel/plugin-proposal-object-rest-spread@7.9.6": - version "7.9.6" - resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-object-rest-spread/-/plugin-proposal-object-rest-spread-7.9.6.tgz#7a093586fcb18b08266eb1a7177da671ac575b63" - integrity sha512-Ga6/fhGqA9Hj+y6whNpPv8psyaK5xzrQwSPsGPloVkvmH+PqW1ixdnfJ9uIO06OjQNYol3PMnfmJ8vfZtkzF+A== +"@babel/plugin-proposal-object-rest-spread@7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-object-rest-spread/-/plugin-proposal-object-rest-spread-7.10.4.tgz#50129ac216b9a6a55b3853fdd923e74bf553a4c0" + integrity sha512-6vh4SqRuLLarjgeOf4EaROJAHjvu9Gl+/346PbDH9yWbJyfnJ/ah3jmYKYtswEyCoWZiidvVHjHshd4WgjB9BA== dependencies: - "@babel/helper-plugin-utils" "^7.8.3" + "@babel/helper-plugin-utils" "^7.10.4" "@babel/plugin-syntax-object-rest-spread" "^7.8.0" - "@babel/plugin-transform-parameters" "^7.9.5" + "@babel/plugin-transform-parameters" "^7.10.4" -"@babel/plugin-proposal-object-rest-spread@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-object-rest-spread/-/plugin-proposal-object-rest-spread-7.10.1.tgz#cba44908ac9f142650b4a65b8aa06bf3478d5fb6" - integrity sha512-Z+Qri55KiQkHh7Fc4BW6o+QBuTagbOp9txE+4U1i79u9oWlf2npkiDx+Rf3iK3lbcHBuNy9UOkwuR5wOMH3LIQ== +"@babel/plugin-proposal-object-rest-spread@^7.11.0": + version "7.11.0" + resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-object-rest-spread/-/plugin-proposal-object-rest-spread-7.11.0.tgz#bd81f95a1f746760ea43b6c2d3d62b11790ad0af" + integrity sha512-wzch41N4yztwoRw0ak+37wxwJM2oiIiy6huGCoqkvSTA9acYWcPfn9Y4aJqmFFJ70KTJUu29f3DQ43uJ9HXzEA== dependencies: - "@babel/helper-plugin-utils" "^7.10.1" + "@babel/helper-plugin-utils" "^7.10.4" "@babel/plugin-syntax-object-rest-spread" "^7.8.0" - "@babel/plugin-transform-parameters" "^7.10.1" + "@babel/plugin-transform-parameters" "^7.10.4" -"@babel/plugin-proposal-optional-catch-binding@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-optional-catch-binding/-/plugin-proposal-optional-catch-binding-7.10.1.tgz#c9f86d99305f9fa531b568ff5ab8c964b8b223d2" - integrity sha512-VqExgeE62YBqI3ogkGoOJp1R6u12DFZjqwJhqtKc2o5m1YTUuUWnos7bZQFBhwkxIFpWYJ7uB75U7VAPPiKETA== +"@babel/plugin-proposal-optional-catch-binding@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-optional-catch-binding/-/plugin-proposal-optional-catch-binding-7.10.4.tgz#31c938309d24a78a49d68fdabffaa863758554dd" + integrity sha512-LflT6nPh+GK2MnFiKDyLiqSqVHkQnVf7hdoAvyTnnKj9xB3docGRsdPuxp6qqqW19ifK3xgc9U5/FwrSaCNX5g== dependencies: - "@babel/helper-plugin-utils" "^7.10.1" + "@babel/helper-plugin-utils" "^7.10.4" "@babel/plugin-syntax-optional-catch-binding" "^7.8.0" -"@babel/plugin-proposal-optional-chaining@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-optional-chaining/-/plugin-proposal-optional-chaining-7.10.1.tgz#15f5d6d22708629451a91be28f8facc55b0e818c" - integrity sha512-dqQj475q8+/avvok72CF3AOSV/SGEcH29zT5hhohqqvvZ2+boQoOr7iGldBG5YXTO2qgCgc2B3WvVLUdbeMlGA== +"@babel/plugin-proposal-optional-chaining@^7.10.3", "@babel/plugin-proposal-optional-chaining@^7.11.0": + version "7.11.0" + resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-optional-chaining/-/plugin-proposal-optional-chaining-7.11.0.tgz#de5866d0646f6afdaab8a566382fe3a221755076" + integrity sha512-v9fZIu3Y8562RRwhm1BbMRxtqZNFmFA2EG+pT2diuU8PT3H6T/KXoZ54KgYisfOFZHV6PfvAiBIZ9Rcz+/JCxA== dependencies: - "@babel/helper-plugin-utils" "^7.10.1" + "@babel/helper-plugin-utils" "^7.10.4" + "@babel/helper-skip-transparent-expression-wrappers" "^7.11.0" "@babel/plugin-syntax-optional-chaining" "^7.8.0" -"@babel/plugin-proposal-private-methods@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-private-methods/-/plugin-proposal-private-methods-7.10.1.tgz#ed85e8058ab0fe309c3f448e5e1b73ca89cdb598" - integrity sha512-RZecFFJjDiQ2z6maFprLgrdnm0OzoC23Mx89xf1CcEsxmHuzuXOdniEuI+S3v7vjQG4F5sa6YtUp+19sZuSxHg== - dependencies: - "@babel/helper-create-class-features-plugin" "^7.10.1" - "@babel/helper-plugin-utils" "^7.10.1" - -"@babel/plugin-proposal-unicode-property-regex@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-unicode-property-regex/-/plugin-proposal-unicode-property-regex-7.10.1.tgz#dc04feb25e2dd70c12b05d680190e138fa2c0c6f" - integrity sha512-JjfngYRvwmPwmnbRZyNiPFI8zxCZb8euzbCG/LxyKdeTb59tVciKo9GK9bi6JYKInk1H11Dq9j/zRqIH4KigfQ== +"@babel/plugin-proposal-private-methods@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-private-methods/-/plugin-proposal-private-methods-7.10.4.tgz#b160d972b8fdba5c7d111a145fc8c421fc2a6909" + integrity sha512-wh5GJleuI8k3emgTg5KkJK6kHNsGEr0uBTDBuQUBJwckk9xs1ez79ioheEVVxMLyPscB0LfkbVHslQqIzWV6Bw== dependencies: - "@babel/helper-create-regexp-features-plugin" "^7.10.1" - "@babel/helper-plugin-utils" "^7.10.1" + "@babel/helper-create-class-features-plugin" "^7.10.4" + "@babel/helper-plugin-utils" "^7.10.4" -"@babel/plugin-proposal-unicode-property-regex@^7.4.4": - version "7.8.8" - resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-unicode-property-regex/-/plugin-proposal-unicode-property-regex-7.8.8.tgz#ee3a95e90cdc04fe8cd92ec3279fa017d68a0d1d" - integrity sha512-EVhjVsMpbhLw9ZfHWSx2iy13Q8Z/eg8e8ccVWt23sWQK5l1UdkoLJPN5w69UA4uITGBnEZD2JOe4QOHycYKv8A== +"@babel/plugin-proposal-unicode-property-regex@^7.10.4", "@babel/plugin-proposal-unicode-property-regex@^7.4.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-unicode-property-regex/-/plugin-proposal-unicode-property-regex-7.10.4.tgz#4483cda53041ce3413b7fe2f00022665ddfaa75d" + integrity sha512-H+3fOgPnEXFL9zGYtKQe4IDOPKYlZdF1kqFDQRRb8PK4B8af1vAGK04tF5iQAAsui+mHNBQSAtd2/ndEDe9wuA== dependencies: - "@babel/helper-create-regexp-features-plugin" "^7.8.8" - "@babel/helper-plugin-utils" "^7.8.3" + "@babel/helper-create-regexp-features-plugin" "^7.10.4" + "@babel/helper-plugin-utils" "^7.10.4" "@babel/plugin-syntax-async-generators@^7.8.0": version "7.8.4" @@ -549,12 +534,12 @@ dependencies: "@babel/helper-plugin-utils" "^7.8.0" -"@babel/plugin-syntax-class-properties@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-class-properties/-/plugin-syntax-class-properties-7.10.1.tgz#d5bc0645913df5b17ad7eda0fa2308330bde34c5" - integrity sha512-Gf2Yx/iRs1JREDtVZ56OrjjgFHCaldpTnuy9BHla10qyVT3YkIIGEtoDWhyop0ksu1GvNjHIoYRBqm3zoR1jyQ== +"@babel/plugin-syntax-class-properties@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-class-properties/-/plugin-syntax-class-properties-7.10.4.tgz#6644e6a0baa55a61f9e3231f6c9eeb6ee46c124c" + integrity sha512-GCSBF7iUle6rNugfURwNmCGG3Z/2+opxAMLs1nND4bhEG5PuxTIggDBoeYYSujAlLtsupzOHYJQgPS3pivwXIA== dependencies: - "@babel/helper-plugin-utils" "^7.10.1" + "@babel/helper-plugin-utils" "^7.10.4" "@babel/plugin-syntax-dynamic-import@^7.8.0", "@babel/plugin-syntax-dynamic-import@^7.8.3": version "7.8.3" @@ -563,6 +548,13 @@ dependencies: "@babel/helper-plugin-utils" "^7.8.0" +"@babel/plugin-syntax-export-namespace-from@^7.8.3": + version "7.8.3" + resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-export-namespace-from/-/plugin-syntax-export-namespace-from-7.8.3.tgz#028964a9ba80dbc094c915c487ad7c4e7a66465a" + integrity sha512-MXf5laXo6c1IbEbegDmzGPwGNTsHZmEy6QGznu5Sh2UCWvueywb2ee+CCE4zQiZstxU9BMoQO9i6zUFSY0Kj0Q== + dependencies: + "@babel/helper-plugin-utils" "^7.8.3" + "@babel/plugin-syntax-json-strings@^7.8.0": version "7.8.3" resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-json-strings/-/plugin-syntax-json-strings-7.8.3.tgz#01ca21b668cd8218c9e640cb6dd88c5412b2c96a" @@ -570,19 +562,19 @@ dependencies: "@babel/helper-plugin-utils" "^7.8.0" -"@babel/plugin-syntax-jsx@7.8.3": - version "7.8.3" - resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-jsx/-/plugin-syntax-jsx-7.8.3.tgz#521b06c83c40480f1e58b4fd33b92eceb1d6ea94" - integrity sha512-WxdW9xyLgBdefoo0Ynn3MRSkhe5tFVxxKNVdnZSh318WrG2e2jH+E9wd/++JsqcLJZPfz87njQJ8j2Upjm0M0A== +"@babel/plugin-syntax-jsx@7.10.4", "@babel/plugin-syntax-jsx@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-jsx/-/plugin-syntax-jsx-7.10.4.tgz#39abaae3cbf710c4373d8429484e6ba21340166c" + integrity sha512-KCg9mio9jwiARCB7WAcQ7Y1q+qicILjoK8LP/VkPkEKaf5dkaZZK1EcTe91a3JJlZ3qy6L5s9X52boEYi8DM9g== dependencies: - "@babel/helper-plugin-utils" "^7.8.3" + "@babel/helper-plugin-utils" "^7.10.4" -"@babel/plugin-syntax-jsx@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-jsx/-/plugin-syntax-jsx-7.10.1.tgz#0ae371134a42b91d5418feb3c8c8d43e1565d2da" - integrity sha512-+OxyOArpVFXQeXKLO9o+r2I4dIoVoy6+Uu0vKELrlweDM3QJADZj+Z+5ERansZqIZBcLj42vHnDI8Rz9BnRIuQ== +"@babel/plugin-syntax-logical-assignment-operators@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-logical-assignment-operators/-/plugin-syntax-logical-assignment-operators-7.10.4.tgz#ca91ef46303530448b906652bac2e9fe9941f699" + integrity sha512-d8waShlpFDinQ5MtvGU9xDAOzKH47+FFoney2baFIoMr952hKOLp1HR7VszoZvOsV/4+RRszNY7D17ba0te0ig== dependencies: - "@babel/helper-plugin-utils" "^7.10.1" + "@babel/helper-plugin-utils" "^7.10.4" "@babel/plugin-syntax-nullish-coalescing-operator@^7.8.0": version "7.8.3" @@ -591,12 +583,12 @@ dependencies: "@babel/helper-plugin-utils" "^7.8.0" -"@babel/plugin-syntax-numeric-separator@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-numeric-separator/-/plugin-syntax-numeric-separator-7.10.1.tgz#25761ee7410bc8cf97327ba741ee94e4a61b7d99" - integrity sha512-uTd0OsHrpe3tH5gRPTxG8Voh99/WCU78vIm5NMRYPAqC8lR4vajt6KkCAknCHrx24vkPdd/05yfdGSB4EIY2mg== +"@babel/plugin-syntax-numeric-separator@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-numeric-separator/-/plugin-syntax-numeric-separator-7.10.4.tgz#b9b070b3e33570cd9fd07ba7fa91c0dd37b9af97" + integrity sha512-9H6YdfkcK/uOnY/K7/aA2xpzaAgkQn37yzWUMRK7OaPOqOpGS1+n0H5hxT9AUw9EsSjPW8SVyMJwYRtWs3X3ug== dependencies: - "@babel/helper-plugin-utils" "^7.10.1" + "@babel/helper-plugin-utils" "^7.10.4" "@babel/plugin-syntax-object-rest-spread@7.8.3", "@babel/plugin-syntax-object-rest-spread@^7.8.0": version "7.8.3" @@ -619,427 +611,415 @@ dependencies: "@babel/helper-plugin-utils" "^7.8.0" -"@babel/plugin-syntax-top-level-await@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-top-level-await/-/plugin-syntax-top-level-await-7.10.1.tgz#8b8733f8c57397b3eaa47ddba8841586dcaef362" - integrity sha512-hgA5RYkmZm8FTFT3yu2N9Bx7yVVOKYT6yEdXXo6j2JTm0wNxgqaGeQVaSHRjhfnQbX91DtjFB6McRFSlcJH3xQ== +"@babel/plugin-syntax-top-level-await@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-top-level-await/-/plugin-syntax-top-level-await-7.10.4.tgz#4bbeb8917b54fcf768364e0a81f560e33a3ef57d" + integrity sha512-ni1brg4lXEmWyafKr0ccFWkJG0CeMt4WV1oyeBW6EFObF4oOHclbkj5cARxAPQyAQ2UTuplJyK4nfkXIMMFvsQ== dependencies: - "@babel/helper-plugin-utils" "^7.10.1" + "@babel/helper-plugin-utils" "^7.10.4" -"@babel/plugin-syntax-typescript@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-typescript/-/plugin-syntax-typescript-7.10.1.tgz#5e82bc27bb4202b93b949b029e699db536733810" - integrity sha512-X/d8glkrAtra7CaQGMiGs/OGa6XgUzqPcBXCIGFCpCqnfGlT0Wfbzo/B89xHhnInTaItPK8LALblVXcUOEh95Q== +"@babel/plugin-syntax-typescript@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-typescript/-/plugin-syntax-typescript-7.10.4.tgz#2f55e770d3501e83af217d782cb7517d7bb34d25" + integrity sha512-oSAEz1YkBCAKr5Yiq8/BNtvSAPwkp/IyUnwZogd8p+F0RuYQQrLeRUzIQhueQTTBy/F+a40uS7OFKxnkRvmvFQ== dependencies: - "@babel/helper-plugin-utils" "^7.10.1" + "@babel/helper-plugin-utils" "^7.10.4" -"@babel/plugin-transform-arrow-functions@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-transform-arrow-functions/-/plugin-transform-arrow-functions-7.10.1.tgz#cb5ee3a36f0863c06ead0b409b4cc43a889b295b" - integrity sha512-6AZHgFJKP3DJX0eCNJj01RpytUa3SOGawIxweHkNX2L6PYikOZmoh5B0d7hIHaIgveMjX990IAa/xK7jRTN8OA== +"@babel/plugin-transform-arrow-functions@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/plugin-transform-arrow-functions/-/plugin-transform-arrow-functions-7.10.4.tgz#e22960d77e697c74f41c501d44d73dbf8a6a64cd" + integrity sha512-9J/oD1jV0ZCBcgnoFWFq1vJd4msoKb/TCpGNFyyLt0zABdcvgK3aYikZ8HjzB14c26bc7E3Q1yugpwGy2aTPNA== dependencies: - "@babel/helper-plugin-utils" "^7.10.1" + "@babel/helper-plugin-utils" "^7.10.4" -"@babel/plugin-transform-async-to-generator@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-transform-async-to-generator/-/plugin-transform-async-to-generator-7.10.1.tgz#e5153eb1a3e028f79194ed8a7a4bf55f862b2062" - integrity sha512-XCgYjJ8TY2slj6SReBUyamJn3k2JLUIiiR5b6t1mNCMSvv7yx+jJpaewakikp0uWFQSF7ChPPoe3dHmXLpISkg== +"@babel/plugin-transform-async-to-generator@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/plugin-transform-async-to-generator/-/plugin-transform-async-to-generator-7.10.4.tgz#41a5017e49eb6f3cda9392a51eef29405b245a37" + integrity sha512-F6nREOan7J5UXTLsDsZG3DXmZSVofr2tGNwfdrVwkDWHfQckbQXnXSPfD7iO+c/2HGqycwyLST3DnZ16n+cBJQ== dependencies: - "@babel/helper-module-imports" "^7.10.1" - "@babel/helper-plugin-utils" "^7.10.1" - "@babel/helper-remap-async-to-generator" "^7.10.1" + "@babel/helper-module-imports" "^7.10.4" + "@babel/helper-plugin-utils" "^7.10.4" + "@babel/helper-remap-async-to-generator" "^7.10.4" -"@babel/plugin-transform-block-scoped-functions@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-transform-block-scoped-functions/-/plugin-transform-block-scoped-functions-7.10.1.tgz#146856e756d54b20fff14b819456b3e01820b85d" - integrity sha512-B7K15Xp8lv0sOJrdVAoukKlxP9N59HS48V1J3U/JGj+Ad+MHq+am6xJVs85AgXrQn4LV8vaYFOB+pr/yIuzW8Q== +"@babel/plugin-transform-block-scoped-functions@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/plugin-transform-block-scoped-functions/-/plugin-transform-block-scoped-functions-7.10.4.tgz#1afa595744f75e43a91af73b0d998ecfe4ebc2e8" + integrity sha512-WzXDarQXYYfjaV1szJvN3AD7rZgZzC1JtjJZ8dMHUyiK8mxPRahynp14zzNjU3VkPqPsO38CzxiWO1c9ARZ8JA== dependencies: - "@babel/helper-plugin-utils" "^7.10.1" + "@babel/helper-plugin-utils" "^7.10.4" -"@babel/plugin-transform-block-scoping@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-transform-block-scoping/-/plugin-transform-block-scoping-7.10.1.tgz#47092d89ca345811451cd0dc5d91605982705d5e" - integrity sha512-8bpWG6TtF5akdhIm/uWTyjHqENpy13Fx8chg7pFH875aNLwX8JxIxqm08gmAT+Whe6AOmaTeLPe7dpLbXt+xUw== +"@babel/plugin-transform-block-scoping@^7.10.4": + version "7.11.1" + resolved "https://registry.yarnpkg.com/@babel/plugin-transform-block-scoping/-/plugin-transform-block-scoping-7.11.1.tgz#5b7efe98852bef8d652c0b28144cd93a9e4b5215" + integrity sha512-00dYeDE0EVEHuuM+26+0w/SCL0BH2Qy7LwHuI4Hi4MH5gkC8/AqMN5uWFJIsoXZrAphiMm1iXzBw6L2T+eA0ew== dependencies: - "@babel/helper-plugin-utils" "^7.10.1" - lodash "^4.17.13" + "@babel/helper-plugin-utils" "^7.10.4" -"@babel/plugin-transform-classes@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-transform-classes/-/plugin-transform-classes-7.10.1.tgz#6e11dd6c4dfae70f540480a4702477ed766d733f" - integrity sha512-P9V0YIh+ln/B3RStPoXpEQ/CoAxQIhRSUn7aXqQ+FZJ2u8+oCtjIXR3+X0vsSD8zv+mb56K7wZW1XiDTDGiDRQ== +"@babel/plugin-transform-classes@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/plugin-transform-classes/-/plugin-transform-classes-7.10.4.tgz#405136af2b3e218bc4a1926228bc917ab1a0adc7" + integrity sha512-2oZ9qLjt161dn1ZE0Ms66xBncQH4In8Sqw1YWgBUZuGVJJS5c0OFZXL6dP2MRHrkU/eKhWg8CzFJhRQl50rQxA== dependencies: - "@babel/helper-annotate-as-pure" "^7.10.1" - "@babel/helper-define-map" "^7.10.1" - "@babel/helper-function-name" "^7.10.1" - "@babel/helper-optimise-call-expression" "^7.10.1" - "@babel/helper-plugin-utils" "^7.10.1" - "@babel/helper-replace-supers" "^7.10.1" - "@babel/helper-split-export-declaration" "^7.10.1" + "@babel/helper-annotate-as-pure" "^7.10.4" + "@babel/helper-define-map" "^7.10.4" + "@babel/helper-function-name" "^7.10.4" + "@babel/helper-optimise-call-expression" "^7.10.4" + "@babel/helper-plugin-utils" "^7.10.4" + "@babel/helper-replace-supers" "^7.10.4" + "@babel/helper-split-export-declaration" "^7.10.4" globals "^11.1.0" -"@babel/plugin-transform-computed-properties@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-transform-computed-properties/-/plugin-transform-computed-properties-7.10.1.tgz#59aa399064429d64dce5cf76ef9b90b7245ebd07" - integrity sha512-mqSrGjp3IefMsXIenBfGcPXxJxweQe2hEIwMQvjtiDQ9b1IBvDUjkAtV/HMXX47/vXf14qDNedXsIiNd1FmkaQ== +"@babel/plugin-transform-computed-properties@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/plugin-transform-computed-properties/-/plugin-transform-computed-properties-7.10.4.tgz#9ded83a816e82ded28d52d4b4ecbdd810cdfc0eb" + integrity sha512-JFwVDXcP/hM/TbyzGq3l/XWGut7p46Z3QvqFMXTfk6/09m7xZHJUN9xHfsv7vqqD4YnfI5ueYdSJtXqqBLyjBw== dependencies: - "@babel/helper-plugin-utils" "^7.10.1" + "@babel/helper-plugin-utils" "^7.10.4" -"@babel/plugin-transform-destructuring@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-transform-destructuring/-/plugin-transform-destructuring-7.10.1.tgz#abd58e51337815ca3a22a336b85f62b998e71907" - integrity sha512-V/nUc4yGWG71OhaTH705pU8ZSdM6c1KmmLP8ys59oOYbT7RpMYAR3MsVOt6OHL0WzG7BlTU076va9fjJyYzJMA== +"@babel/plugin-transform-destructuring@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/plugin-transform-destructuring/-/plugin-transform-destructuring-7.10.4.tgz#70ddd2b3d1bea83d01509e9bb25ddb3a74fc85e5" + integrity sha512-+WmfvyfsyF603iPa6825mq6Qrb7uLjTOsa3XOFzlYcYDHSS4QmpOWOL0NNBY5qMbvrcf3tq0Cw+v4lxswOBpgA== dependencies: - "@babel/helper-plugin-utils" "^7.10.1" + "@babel/helper-plugin-utils" "^7.10.4" -"@babel/plugin-transform-dotall-regex@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-transform-dotall-regex/-/plugin-transform-dotall-regex-7.10.1.tgz#920b9fec2d78bb57ebb64a644d5c2ba67cc104ee" - integrity sha512-19VIMsD1dp02RvduFUmfzj8uknaO3uiHHF0s3E1OHnVsNj8oge8EQ5RzHRbJjGSetRnkEuBYO7TG1M5kKjGLOA== +"@babel/plugin-transform-dotall-regex@^7.10.4", "@babel/plugin-transform-dotall-regex@^7.4.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/plugin-transform-dotall-regex/-/plugin-transform-dotall-regex-7.10.4.tgz#469c2062105c1eb6a040eaf4fac4b488078395ee" + integrity sha512-ZEAVvUTCMlMFAbASYSVQoxIbHm2OkG2MseW6bV2JjIygOjdVv8tuxrCTzj1+Rynh7ODb8GivUy7dzEXzEhuPaA== dependencies: - "@babel/helper-create-regexp-features-plugin" "^7.10.1" - "@babel/helper-plugin-utils" "^7.10.1" - -"@babel/plugin-transform-dotall-regex@^7.4.4": - version "7.8.3" - resolved "https://registry.yarnpkg.com/@babel/plugin-transform-dotall-regex/-/plugin-transform-dotall-regex-7.8.3.tgz#c3c6ec5ee6125c6993c5cbca20dc8621a9ea7a6e" - integrity sha512-kLs1j9Nn4MQoBYdRXH6AeaXMbEJFaFu/v1nQkvib6QzTj8MZI5OQzqmD83/2jEM1z0DLilra5aWO5YpyC0ALIw== - dependencies: - "@babel/helper-create-regexp-features-plugin" "^7.8.3" - "@babel/helper-plugin-utils" "^7.8.3" + "@babel/helper-create-regexp-features-plugin" "^7.10.4" + "@babel/helper-plugin-utils" "^7.10.4" -"@babel/plugin-transform-duplicate-keys@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-transform-duplicate-keys/-/plugin-transform-duplicate-keys-7.10.1.tgz#c900a793beb096bc9d4d0a9d0cde19518ffc83b9" - integrity sha512-wIEpkX4QvX8Mo9W6XF3EdGttrIPZWozHfEaDTU0WJD/TDnXMvdDh30mzUl/9qWhnf7naicYartcEfUghTCSNpA== +"@babel/plugin-transform-duplicate-keys@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/plugin-transform-duplicate-keys/-/plugin-transform-duplicate-keys-7.10.4.tgz#697e50c9fee14380fe843d1f306b295617431e47" + integrity sha512-GL0/fJnmgMclHiBTTWXNlYjYsA7rDrtsazHG6mglaGSTh0KsrW04qml+Bbz9FL0LcJIRwBWL5ZqlNHKTkU3xAA== dependencies: - "@babel/helper-plugin-utils" "^7.10.1" + "@babel/helper-plugin-utils" "^7.10.4" -"@babel/plugin-transform-exponentiation-operator@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-transform-exponentiation-operator/-/plugin-transform-exponentiation-operator-7.10.1.tgz#279c3116756a60dd6e6f5e488ba7957db9c59eb3" - integrity sha512-lr/przdAbpEA2BUzRvjXdEDLrArGRRPwbaF9rvayuHRvdQ7lUTTkZnhZrJ4LE2jvgMRFF4f0YuPQ20vhiPYxtA== +"@babel/plugin-transform-exponentiation-operator@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/plugin-transform-exponentiation-operator/-/plugin-transform-exponentiation-operator-7.10.4.tgz#5ae338c57f8cf4001bdb35607ae66b92d665af2e" + integrity sha512-S5HgLVgkBcRdyQAHbKj+7KyuWx8C6t5oETmUuwz1pt3WTWJhsUV0WIIXuVvfXMxl/QQyHKlSCNNtaIamG8fysw== dependencies: - "@babel/helper-builder-binary-assignment-operator-visitor" "^7.10.1" - "@babel/helper-plugin-utils" "^7.10.1" + "@babel/helper-builder-binary-assignment-operator-visitor" "^7.10.4" + "@babel/helper-plugin-utils" "^7.10.4" -"@babel/plugin-transform-for-of@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-transform-for-of/-/plugin-transform-for-of-7.10.1.tgz#ff01119784eb0ee32258e8646157ba2501fcfda5" - integrity sha512-US8KCuxfQcn0LwSCMWMma8M2R5mAjJGsmoCBVwlMygvmDUMkTCykc84IqN1M7t+agSfOmLYTInLCHJM+RUoz+w== +"@babel/plugin-transform-for-of@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/plugin-transform-for-of/-/plugin-transform-for-of-7.10.4.tgz#c08892e8819d3a5db29031b115af511dbbfebae9" + integrity sha512-ItdQfAzu9AlEqmusA/65TqJ79eRcgGmpPPFvBnGILXZH975G0LNjP1yjHvGgfuCxqrPPueXOPe+FsvxmxKiHHQ== dependencies: - "@babel/helper-plugin-utils" "^7.10.1" + "@babel/helper-plugin-utils" "^7.10.4" -"@babel/plugin-transform-function-name@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-transform-function-name/-/plugin-transform-function-name-7.10.1.tgz#4ed46fd6e1d8fde2a2ec7b03c66d853d2c92427d" - integrity sha512-//bsKsKFBJfGd65qSNNh1exBy5Y9gD9ZN+DvrJ8f7HXr4avE5POW6zB7Rj6VnqHV33+0vXWUwJT0wSHubiAQkw== +"@babel/plugin-transform-function-name@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/plugin-transform-function-name/-/plugin-transform-function-name-7.10.4.tgz#6a467880e0fc9638514ba369111811ddbe2644b7" + integrity sha512-OcDCq2y5+E0dVD5MagT5X+yTRbcvFjDI2ZVAottGH6tzqjx/LKpgkUepu3hp/u4tZBzxxpNGwLsAvGBvQ2mJzg== dependencies: - "@babel/helper-function-name" "^7.10.1" - "@babel/helper-plugin-utils" "^7.10.1" + "@babel/helper-function-name" "^7.10.4" + "@babel/helper-plugin-utils" "^7.10.4" -"@babel/plugin-transform-literals@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-transform-literals/-/plugin-transform-literals-7.10.1.tgz#5794f8da82846b22e4e6631ea1658bce708eb46a" - integrity sha512-qi0+5qgevz1NHLZroObRm5A+8JJtibb7vdcPQF1KQE12+Y/xxl8coJ+TpPW9iRq+Mhw/NKLjm+5SHtAHCC7lAw== +"@babel/plugin-transform-literals@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/plugin-transform-literals/-/plugin-transform-literals-7.10.4.tgz#9f42ba0841100a135f22712d0e391c462f571f3c" + integrity sha512-Xd/dFSTEVuUWnyZiMu76/InZxLTYilOSr1UlHV+p115Z/Le2Fi1KXkJUYz0b42DfndostYlPub3m8ZTQlMaiqQ== dependencies: - "@babel/helper-plugin-utils" "^7.10.1" + "@babel/helper-plugin-utils" "^7.10.4" -"@babel/plugin-transform-member-expression-literals@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-transform-member-expression-literals/-/plugin-transform-member-expression-literals-7.10.1.tgz#90347cba31bca6f394b3f7bd95d2bbfd9fce2f39" - integrity sha512-UmaWhDokOFT2GcgU6MkHC11i0NQcL63iqeufXWfRy6pUOGYeCGEKhvfFO6Vz70UfYJYHwveg62GS83Rvpxn+NA== +"@babel/plugin-transform-member-expression-literals@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/plugin-transform-member-expression-literals/-/plugin-transform-member-expression-literals-7.10.4.tgz#b1ec44fcf195afcb8db2c62cd8e551c881baf8b7" + integrity sha512-0bFOvPyAoTBhtcJLr9VcwZqKmSjFml1iVxvPL0ReomGU53CX53HsM4h2SzckNdkQcHox1bpAqzxBI1Y09LlBSw== dependencies: - "@babel/helper-plugin-utils" "^7.10.1" + "@babel/helper-plugin-utils" "^7.10.4" -"@babel/plugin-transform-modules-amd@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-transform-modules-amd/-/plugin-transform-modules-amd-7.10.1.tgz#65950e8e05797ebd2fe532b96e19fc5482a1d52a" - integrity sha512-31+hnWSFRI4/ACFr1qkboBbrTxoBIzj7qA69qlq8HY8p7+YCzkCT6/TvQ1a4B0z27VeWtAeJd6pr5G04dc1iHw== +"@babel/plugin-transform-modules-amd@^7.10.4": + version "7.10.5" + resolved "https://registry.yarnpkg.com/@babel/plugin-transform-modules-amd/-/plugin-transform-modules-amd-7.10.5.tgz#1b9cddaf05d9e88b3aad339cb3e445c4f020a9b1" + integrity sha512-elm5uruNio7CTLFItVC/rIzKLfQ17+fX7EVz5W0TMgIHFo1zY0Ozzx+lgwhL4plzl8OzVn6Qasx5DeEFyoNiRw== dependencies: - "@babel/helper-module-transforms" "^7.10.1" - "@babel/helper-plugin-utils" "^7.10.1" + "@babel/helper-module-transforms" "^7.10.5" + "@babel/helper-plugin-utils" "^7.10.4" babel-plugin-dynamic-import-node "^2.3.3" -"@babel/plugin-transform-modules-commonjs@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-transform-modules-commonjs/-/plugin-transform-modules-commonjs-7.10.1.tgz#d5ff4b4413ed97ffded99961056e1fb980fb9301" - integrity sha512-AQG4fc3KOah0vdITwt7Gi6hD9BtQP/8bhem7OjbaMoRNCH5Djx42O2vYMfau7QnAzQCa+RJnhJBmFFMGpQEzrg== +"@babel/plugin-transform-modules-commonjs@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/plugin-transform-modules-commonjs/-/plugin-transform-modules-commonjs-7.10.4.tgz#66667c3eeda1ebf7896d41f1f16b17105a2fbca0" + integrity sha512-Xj7Uq5o80HDLlW64rVfDBhao6OX89HKUmb+9vWYaLXBZOma4gA6tw4Ni1O5qVDoZWUV0fxMYA0aYzOawz0l+1w== dependencies: - "@babel/helper-module-transforms" "^7.10.1" - "@babel/helper-plugin-utils" "^7.10.1" - "@babel/helper-simple-access" "^7.10.1" + "@babel/helper-module-transforms" "^7.10.4" + "@babel/helper-plugin-utils" "^7.10.4" + "@babel/helper-simple-access" "^7.10.4" babel-plugin-dynamic-import-node "^2.3.3" -"@babel/plugin-transform-modules-systemjs@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-transform-modules-systemjs/-/plugin-transform-modules-systemjs-7.10.1.tgz#9962e4b0ac6aaf2e20431ada3d8ec72082cbffb6" - integrity sha512-ewNKcj1TQZDL3YnO85qh9zo1YF1CHgmSTlRQgHqe63oTrMI85cthKtZjAiZSsSNjPQ5NCaYo5QkbYqEw1ZBgZA== +"@babel/plugin-transform-modules-systemjs@^7.10.4": + version "7.10.5" + resolved "https://registry.yarnpkg.com/@babel/plugin-transform-modules-systemjs/-/plugin-transform-modules-systemjs-7.10.5.tgz#6270099c854066681bae9e05f87e1b9cadbe8c85" + integrity sha512-f4RLO/OL14/FP1AEbcsWMzpbUz6tssRaeQg11RH1BP/XnPpRoVwgeYViMFacnkaw4k4wjRSjn3ip1Uw9TaXuMw== dependencies: - "@babel/helper-hoist-variables" "^7.10.1" - "@babel/helper-module-transforms" "^7.10.1" - "@babel/helper-plugin-utils" "^7.10.1" + "@babel/helper-hoist-variables" "^7.10.4" + "@babel/helper-module-transforms" "^7.10.5" + "@babel/helper-plugin-utils" "^7.10.4" babel-plugin-dynamic-import-node "^2.3.3" -"@babel/plugin-transform-modules-umd@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-transform-modules-umd/-/plugin-transform-modules-umd-7.10.1.tgz#ea080911ffc6eb21840a5197a39ede4ee67b1595" - integrity sha512-EIuiRNMd6GB6ulcYlETnYYfgv4AxqrswghmBRQbWLHZxN4s7mupxzglnHqk9ZiUpDI4eRWewedJJNj67PWOXKA== +"@babel/plugin-transform-modules-umd@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/plugin-transform-modules-umd/-/plugin-transform-modules-umd-7.10.4.tgz#9a8481fe81b824654b3a0b65da3df89f3d21839e" + integrity sha512-mohW5q3uAEt8T45YT7Qc5ws6mWgJAaL/8BfWD9Dodo1A3RKWli8wTS+WiQ/knF+tXlPirW/1/MqzzGfCExKECA== dependencies: - "@babel/helper-module-transforms" "^7.10.1" - "@babel/helper-plugin-utils" "^7.10.1" + "@babel/helper-module-transforms" "^7.10.4" + "@babel/helper-plugin-utils" "^7.10.4" -"@babel/plugin-transform-named-capturing-groups-regex@^7.8.3": - version "7.8.3" - resolved "https://registry.yarnpkg.com/@babel/plugin-transform-named-capturing-groups-regex/-/plugin-transform-named-capturing-groups-regex-7.8.3.tgz#a2a72bffa202ac0e2d0506afd0939c5ecbc48c6c" - integrity sha512-f+tF/8UVPU86TrCb06JoPWIdDpTNSGGcAtaD9mLP0aYGA0OS0j7j7DHJR0GTFrUZPUU6loZhbsVZgTh0N+Qdnw== - dependencies: - "@babel/helper-create-regexp-features-plugin" "^7.8.3" - -"@babel/plugin-transform-new-target@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-transform-new-target/-/plugin-transform-new-target-7.10.1.tgz#6ee41a5e648da7632e22b6fb54012e87f612f324" - integrity sha512-MBlzPc1nJvbmO9rPr1fQwXOM2iGut+JC92ku6PbiJMMK7SnQc1rytgpopveE3Evn47gzvGYeCdgfCDbZo0ecUw== +"@babel/plugin-transform-named-capturing-groups-regex@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/plugin-transform-named-capturing-groups-regex/-/plugin-transform-named-capturing-groups-regex-7.10.4.tgz#78b4d978810b6f3bcf03f9e318f2fc0ed41aecb6" + integrity sha512-V6LuOnD31kTkxQPhKiVYzYC/Jgdq53irJC/xBSmqcNcqFGV+PER4l6rU5SH2Vl7bH9mLDHcc0+l9HUOe4RNGKA== dependencies: - "@babel/helper-plugin-utils" "^7.10.1" + "@babel/helper-create-regexp-features-plugin" "^7.10.4" -"@babel/plugin-transform-object-super@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-transform-object-super/-/plugin-transform-object-super-7.10.1.tgz#2e3016b0adbf262983bf0d5121d676a5ed9c4fde" - integrity sha512-WnnStUDN5GL+wGQrJylrnnVlFhFmeArINIR9gjhSeYyvroGhBrSAXYg/RHsnfzmsa+onJrTJrEClPzgNmmQ4Gw== +"@babel/plugin-transform-new-target@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/plugin-transform-new-target/-/plugin-transform-new-target-7.10.4.tgz#9097d753cb7b024cb7381a3b2e52e9513a9c6888" + integrity sha512-YXwWUDAH/J6dlfwqlWsztI2Puz1NtUAubXhOPLQ5gjR/qmQ5U96DY4FQO8At33JN4XPBhrjB8I4eMmLROjjLjw== dependencies: - "@babel/helper-plugin-utils" "^7.10.1" - "@babel/helper-replace-supers" "^7.10.1" + "@babel/helper-plugin-utils" "^7.10.4" -"@babel/plugin-transform-parameters@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-transform-parameters/-/plugin-transform-parameters-7.10.1.tgz#b25938a3c5fae0354144a720b07b32766f683ddd" - integrity sha512-tJ1T0n6g4dXMsL45YsSzzSDZCxiHXAQp/qHrucOq5gEHncTA3xDxnd5+sZcoQp+N1ZbieAaB8r/VUCG0gqseOg== +"@babel/plugin-transform-object-super@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/plugin-transform-object-super/-/plugin-transform-object-super-7.10.4.tgz#d7146c4d139433e7a6526f888c667e314a093894" + integrity sha512-5iTw0JkdRdJvr7sY0vHqTpnruUpTea32JHmq/atIWqsnNussbRzjEDyWep8UNztt1B5IusBYg8Irb0bLbiEBCQ== dependencies: - "@babel/helper-get-function-arity" "^7.10.1" - "@babel/helper-plugin-utils" "^7.10.1" + "@babel/helper-plugin-utils" "^7.10.4" + "@babel/helper-replace-supers" "^7.10.4" -"@babel/plugin-transform-parameters@^7.9.5": - version "7.9.5" - resolved "https://registry.yarnpkg.com/@babel/plugin-transform-parameters/-/plugin-transform-parameters-7.9.5.tgz#173b265746f5e15b2afe527eeda65b73623a0795" - integrity sha512-0+1FhHnMfj6lIIhVvS4KGQJeuhe1GI//h5uptK4PvLt+BGBxsoUJbd3/IW002yk//6sZPlFgsG1hY6OHLcy6kA== +"@babel/plugin-transform-parameters@^7.10.4": + version "7.10.5" + resolved "https://registry.yarnpkg.com/@babel/plugin-transform-parameters/-/plugin-transform-parameters-7.10.5.tgz#59d339d58d0b1950435f4043e74e2510005e2c4a" + integrity sha512-xPHwUj5RdFV8l1wuYiu5S9fqWGM2DrYc24TMvUiRrPVm+SM3XeqU9BcokQX/kEUe+p2RBwy+yoiR1w/Blq6ubw== dependencies: - "@babel/helper-get-function-arity" "^7.8.3" - "@babel/helper-plugin-utils" "^7.8.3" + "@babel/helper-get-function-arity" "^7.10.4" + "@babel/helper-plugin-utils" "^7.10.4" -"@babel/plugin-transform-property-literals@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-transform-property-literals/-/plugin-transform-property-literals-7.10.1.tgz#cffc7315219230ed81dc53e4625bf86815b6050d" - integrity sha512-Kr6+mgag8auNrgEpbfIWzdXYOvqDHZOF0+Bx2xh4H2EDNwcbRb9lY6nkZg8oSjsX+DH9Ebxm9hOqtKW+gRDeNA== +"@babel/plugin-transform-property-literals@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/plugin-transform-property-literals/-/plugin-transform-property-literals-7.10.4.tgz#f6fe54b6590352298785b83edd815d214c42e3c0" + integrity sha512-ofsAcKiUxQ8TY4sScgsGeR2vJIsfrzqvFb9GvJ5UdXDzl+MyYCaBj/FGzXuv7qE0aJcjWMILny1epqelnFlz8g== dependencies: - "@babel/helper-plugin-utils" "^7.10.1" + "@babel/helper-plugin-utils" "^7.10.4" "@babel/plugin-transform-react-constant-elements@^7.9.0": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-transform-react-constant-elements/-/plugin-transform-react-constant-elements-7.10.1.tgz#c7f117a54657cba3f9d32012e050fc89982df9e1" - integrity sha512-V4os6bkWt/jbrzfyVcZn2ZpuHZkvj3vyBU0U/dtS8SZuMS7Rfx5oknTrtfyXJ2/QZk8gX7Yls5Z921ItNpE30Q== + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/plugin-transform-react-constant-elements/-/plugin-transform-react-constant-elements-7.10.4.tgz#0f485260bf1c29012bb973e7e404749eaac12c9e" + integrity sha512-cYmQBW1pXrqBte1raMkAulXmi7rjg3VI6ZLg9QIic8Hq7BtYXaWuZSxsr2siOMI6SWwpxjWfnwhTUrd7JlAV7g== dependencies: - "@babel/helper-plugin-utils" "^7.10.1" + "@babel/helper-plugin-utils" "^7.10.4" -"@babel/plugin-transform-react-display-name@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-transform-react-display-name/-/plugin-transform-react-display-name-7.10.1.tgz#e6a33f6d48dfb213dda5e007d0c7ff82b6a3d8ef" - integrity sha512-rBjKcVwjk26H3VX8pavMxGf33LNlbocMHdSeldIEswtQ/hrjyTG8fKKILW1cSkODyRovckN/uZlGb2+sAV9JUQ== +"@babel/plugin-transform-react-display-name@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/plugin-transform-react-display-name/-/plugin-transform-react-display-name-7.10.4.tgz#b5795f4e3e3140419c3611b7a2a3832b9aef328d" + integrity sha512-Zd4X54Mu9SBfPGnEcaGcOrVAYOtjT2on8QZkLKEq1S/tHexG39d9XXGZv19VfRrDjPJzFmPfTAqOQS1pfFOujw== dependencies: - "@babel/helper-plugin-utils" "^7.10.1" + "@babel/helper-plugin-utils" "^7.10.4" -"@babel/plugin-transform-react-jsx-development@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-transform-react-jsx-development/-/plugin-transform-react-jsx-development-7.10.1.tgz#1ac6300d8b28ef381ee48e6fec430cc38047b7f3" - integrity sha512-XwDy/FFoCfw9wGFtdn5Z+dHh6HXKHkC6DwKNWpN74VWinUagZfDcEJc3Y8Dn5B3WMVnAllX8Kviaw7MtC5Epwg== +"@babel/plugin-transform-react-jsx-development@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/plugin-transform-react-jsx-development/-/plugin-transform-react-jsx-development-7.10.4.tgz#6ec90f244394604623880e15ebc3c34c356258ba" + integrity sha512-RM3ZAd1sU1iQ7rI2dhrZRZGv0aqzNQMbkIUCS1txYpi9wHQ2ZHNjo5TwX+UD6pvFW4AbWqLVYvKy5qJSAyRGjQ== dependencies: - "@babel/helper-builder-react-jsx-experimental" "^7.10.1" - "@babel/helper-plugin-utils" "^7.10.1" - "@babel/plugin-syntax-jsx" "^7.10.1" + "@babel/helper-builder-react-jsx-experimental" "^7.10.4" + "@babel/helper-plugin-utils" "^7.10.4" + "@babel/plugin-syntax-jsx" "^7.10.4" -"@babel/plugin-transform-react-jsx-self@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-transform-react-jsx-self/-/plugin-transform-react-jsx-self-7.10.1.tgz#22143e14388d72eb88649606bb9e46f421bc3821" - integrity sha512-4p+RBw9d1qV4S749J42ZooeQaBomFPrSxa9JONLHJ1TxCBo3TzJ79vtmG2S2erUT8PDDrPdw4ZbXGr2/1+dILA== +"@babel/plugin-transform-react-jsx-self@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/plugin-transform-react-jsx-self/-/plugin-transform-react-jsx-self-7.10.4.tgz#cd301a5fed8988c182ed0b9d55e9bd6db0bd9369" + integrity sha512-yOvxY2pDiVJi0axdTWHSMi5T0DILN+H+SaeJeACHKjQLezEzhLx9nEF9xgpBLPtkZsks9cnb5P9iBEi21En3gg== dependencies: - "@babel/helper-plugin-utils" "^7.10.1" - "@babel/plugin-syntax-jsx" "^7.10.1" + "@babel/helper-plugin-utils" "^7.10.4" + "@babel/plugin-syntax-jsx" "^7.10.4" -"@babel/plugin-transform-react-jsx-source@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-transform-react-jsx-source/-/plugin-transform-react-jsx-source-7.10.1.tgz#30db3d4ee3cdebbb26a82a9703673714777a4273" - integrity sha512-neAbaKkoiL+LXYbGDvh6PjPG+YeA67OsZlE78u50xbWh2L1/C81uHiNP5d1fw+uqUIoiNdCC8ZB+G4Zh3hShJA== +"@babel/plugin-transform-react-jsx-source@^7.10.4": + version "7.10.5" + resolved "https://registry.yarnpkg.com/@babel/plugin-transform-react-jsx-source/-/plugin-transform-react-jsx-source-7.10.5.tgz#34f1779117520a779c054f2cdd9680435b9222b4" + integrity sha512-wTeqHVkN1lfPLubRiZH3o73f4rfon42HpgxUSs86Nc+8QIcm/B9s8NNVXu/gwGcOyd7yDib9ikxoDLxJP0UiDA== dependencies: - "@babel/helper-plugin-utils" "^7.10.1" - "@babel/plugin-syntax-jsx" "^7.10.1" + "@babel/helper-plugin-utils" "^7.10.4" + "@babel/plugin-syntax-jsx" "^7.10.4" -"@babel/plugin-transform-react-jsx@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-transform-react-jsx/-/plugin-transform-react-jsx-7.10.1.tgz#91f544248ba131486decb5d9806da6a6e19a2896" - integrity sha512-MBVworWiSRBap3Vs39eHt+6pJuLUAaK4oxGc8g+wY+vuSJvLiEQjW1LSTqKb8OUPtDvHCkdPhk7d6sjC19xyFw== +"@babel/plugin-transform-react-jsx@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/plugin-transform-react-jsx/-/plugin-transform-react-jsx-7.10.4.tgz#673c9f913948764a4421683b2bef2936968fddf2" + integrity sha512-L+MfRhWjX0eI7Js093MM6MacKU4M6dnCRa/QPDwYMxjljzSCzzlzKzj9Pk4P3OtrPcxr2N3znR419nr3Xw+65A== dependencies: - "@babel/helper-builder-react-jsx" "^7.10.1" - "@babel/helper-builder-react-jsx-experimental" "^7.10.1" - "@babel/helper-plugin-utils" "^7.10.1" - "@babel/plugin-syntax-jsx" "^7.10.1" + "@babel/helper-builder-react-jsx" "^7.10.4" + "@babel/helper-builder-react-jsx-experimental" "^7.10.4" + "@babel/helper-plugin-utils" "^7.10.4" + "@babel/plugin-syntax-jsx" "^7.10.4" -"@babel/plugin-transform-react-pure-annotations@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-transform-react-pure-annotations/-/plugin-transform-react-pure-annotations-7.10.1.tgz#f5e7c755d3e7614d4c926e144f501648a5277b70" - integrity sha512-mfhoiai083AkeewsBHUpaS/FM1dmUENHBMpS/tugSJ7VXqXO5dCN1Gkint2YvM1Cdv1uhmAKt1ZOuAjceKmlLA== +"@babel/plugin-transform-react-pure-annotations@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/plugin-transform-react-pure-annotations/-/plugin-transform-react-pure-annotations-7.10.4.tgz#3eefbb73db94afbc075f097523e445354a1c6501" + integrity sha512-+njZkqcOuS8RaPakrnR9KvxjoG1ASJWpoIv/doyWngId88JoFlPlISenGXjrVacZUIALGUr6eodRs1vmPnF23A== dependencies: - "@babel/helper-annotate-as-pure" "^7.10.1" - "@babel/helper-plugin-utils" "^7.10.1" + "@babel/helper-annotate-as-pure" "^7.10.4" + "@babel/helper-plugin-utils" "^7.10.4" -"@babel/plugin-transform-regenerator@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-transform-regenerator/-/plugin-transform-regenerator-7.10.1.tgz#10e175cbe7bdb63cc9b39f9b3f823c5c7c5c5490" - integrity sha512-B3+Y2prScgJ2Bh/2l9LJxKbb8C8kRfsG4AdPT+n7ixBHIxJaIG8bi8tgjxUMege1+WqSJ+7gu1YeoMVO3gPWzw== +"@babel/plugin-transform-regenerator@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/plugin-transform-regenerator/-/plugin-transform-regenerator-7.10.4.tgz#2015e59d839074e76838de2159db421966fd8b63" + integrity sha512-3thAHwtor39A7C04XucbMg17RcZ3Qppfxr22wYzZNcVIkPHfpM9J0SO8zuCV6SZa265kxBJSrfKTvDCYqBFXGw== dependencies: regenerator-transform "^0.14.2" -"@babel/plugin-transform-reserved-words@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-transform-reserved-words/-/plugin-transform-reserved-words-7.10.1.tgz#0fc1027312b4d1c3276a57890c8ae3bcc0b64a86" - integrity sha512-qN1OMoE2nuqSPmpTqEM7OvJ1FkMEV+BjVeZZm9V9mq/x1JLKQ4pcv8riZJMNN3u2AUGl0ouOMjRr2siecvHqUQ== +"@babel/plugin-transform-reserved-words@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/plugin-transform-reserved-words/-/plugin-transform-reserved-words-7.10.4.tgz#8f2682bcdcef9ed327e1b0861585d7013f8a54dd" + integrity sha512-hGsw1O6Rew1fkFbDImZIEqA8GoidwTAilwCyWqLBM9f+e/u/sQMQu7uX6dyokfOayRuuVfKOW4O7HvaBWM+JlQ== dependencies: - "@babel/helper-plugin-utils" "^7.10.1" + "@babel/helper-plugin-utils" "^7.10.4" "@babel/plugin-transform-runtime@^7.9.0": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-transform-runtime/-/plugin-transform-runtime-7.10.1.tgz#fd1887f749637fb2ed86dc278e79eb41df37f4b1" - integrity sha512-4w2tcglDVEwXJ5qxsY++DgWQdNJcCCsPxfT34wCUwIf2E7dI7pMpH8JczkMBbgBTNzBX62SZlNJ9H+De6Zebaw== + version "7.11.0" + resolved "https://registry.yarnpkg.com/@babel/plugin-transform-runtime/-/plugin-transform-runtime-7.11.0.tgz#e27f78eb36f19448636e05c33c90fd9ad9b8bccf" + integrity sha512-LFEsP+t3wkYBlis8w6/kmnd6Kb1dxTd+wGJ8MlxTGzQo//ehtqlVL4S9DNUa53+dtPSQobN2CXx4d81FqC58cw== dependencies: - "@babel/helper-module-imports" "^7.10.1" - "@babel/helper-plugin-utils" "^7.10.1" + "@babel/helper-module-imports" "^7.10.4" + "@babel/helper-plugin-utils" "^7.10.4" resolve "^1.8.1" semver "^5.5.1" -"@babel/plugin-transform-shorthand-properties@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-transform-shorthand-properties/-/plugin-transform-shorthand-properties-7.10.1.tgz#e8b54f238a1ccbae482c4dce946180ae7b3143f3" - integrity sha512-AR0E/lZMfLstScFwztApGeyTHJ5u3JUKMjneqRItWeEqDdHWZwAOKycvQNCasCK/3r5YXsuNG25funcJDu7Y2g== +"@babel/plugin-transform-shorthand-properties@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/plugin-transform-shorthand-properties/-/plugin-transform-shorthand-properties-7.10.4.tgz#9fd25ec5cdd555bb7f473e5e6ee1c971eede4dd6" + integrity sha512-AC2K/t7o07KeTIxMoHneyX90v3zkm5cjHJEokrPEAGEy3UCp8sLKfnfOIGdZ194fyN4wfX/zZUWT9trJZ0qc+Q== dependencies: - "@babel/helper-plugin-utils" "^7.10.1" + "@babel/helper-plugin-utils" "^7.10.4" -"@babel/plugin-transform-spread@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-transform-spread/-/plugin-transform-spread-7.10.1.tgz#0c6d618a0c4461a274418460a28c9ccf5239a7c8" - integrity sha512-8wTPym6edIrClW8FI2IoaePB91ETOtg36dOkj3bYcNe7aDMN2FXEoUa+WrmPc4xa1u2PQK46fUX2aCb+zo9rfw== +"@babel/plugin-transform-spread@^7.11.0": + version "7.11.0" + resolved "https://registry.yarnpkg.com/@babel/plugin-transform-spread/-/plugin-transform-spread-7.11.0.tgz#fa84d300f5e4f57752fe41a6d1b3c554f13f17cc" + integrity sha512-UwQYGOqIdQJe4aWNyS7noqAnN2VbaczPLiEtln+zPowRNlD+79w3oi2TWfYe0eZgd+gjZCbsydN7lzWysDt+gw== dependencies: - "@babel/helper-plugin-utils" "^7.10.1" + "@babel/helper-plugin-utils" "^7.10.4" + "@babel/helper-skip-transparent-expression-wrappers" "^7.11.0" -"@babel/plugin-transform-sticky-regex@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-transform-sticky-regex/-/plugin-transform-sticky-regex-7.10.1.tgz#90fc89b7526228bed9842cff3588270a7a393b00" - integrity sha512-j17ojftKjrL7ufX8ajKvwRilwqTok4q+BjkknmQw9VNHnItTyMP5anPFzxFJdCQs7clLcWpCV3ma+6qZWLnGMA== +"@babel/plugin-transform-sticky-regex@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/plugin-transform-sticky-regex/-/plugin-transform-sticky-regex-7.10.4.tgz#8f3889ee8657581130a29d9cc91d7c73b7c4a28d" + integrity sha512-Ddy3QZfIbEV0VYcVtFDCjeE4xwVTJWTmUtorAJkn6u/92Z/nWJNV+mILyqHKrUxXYKA2EoCilgoPePymKL4DvQ== dependencies: - "@babel/helper-plugin-utils" "^7.10.1" - "@babel/helper-regex" "^7.10.1" + "@babel/helper-plugin-utils" "^7.10.4" + "@babel/helper-regex" "^7.10.4" -"@babel/plugin-transform-template-literals@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-transform-template-literals/-/plugin-transform-template-literals-7.10.1.tgz#914c7b7f4752c570ea00553b4284dad8070e8628" - integrity sha512-t7B/3MQf5M1T9hPCRG28DNGZUuxAuDqLYS03rJrIk2prj/UV7Z6FOneijhQhnv/Xa039vidXeVbvjK2SK5f7Gg== +"@babel/plugin-transform-template-literals@^7.10.4": + version "7.10.5" + resolved "https://registry.yarnpkg.com/@babel/plugin-transform-template-literals/-/plugin-transform-template-literals-7.10.5.tgz#78bc5d626a6642db3312d9d0f001f5e7639fde8c" + integrity sha512-V/lnPGIb+KT12OQikDvgSuesRX14ck5FfJXt6+tXhdkJ+Vsd0lDCVtF6jcB4rNClYFzaB2jusZ+lNISDk2mMMw== dependencies: - "@babel/helper-annotate-as-pure" "^7.10.1" - "@babel/helper-plugin-utils" "^7.10.1" + "@babel/helper-annotate-as-pure" "^7.10.4" + "@babel/helper-plugin-utils" "^7.10.4" -"@babel/plugin-transform-typeof-symbol@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-transform-typeof-symbol/-/plugin-transform-typeof-symbol-7.10.1.tgz#60c0239b69965d166b80a84de7315c1bc7e0bb0e" - integrity sha512-qX8KZcmbvA23zDi+lk9s6hC1FM7jgLHYIjuLgULgc8QtYnmB3tAVIYkNoKRQ75qWBeyzcoMoK8ZQmogGtC/w0g== +"@babel/plugin-transform-typeof-symbol@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/plugin-transform-typeof-symbol/-/plugin-transform-typeof-symbol-7.10.4.tgz#9509f1a7eec31c4edbffe137c16cc33ff0bc5bfc" + integrity sha512-QqNgYwuuW0y0H+kUE/GWSR45t/ccRhe14Fs/4ZRouNNQsyd4o3PG4OtHiIrepbM2WKUBDAXKCAK/Lk4VhzTaGA== dependencies: - "@babel/helper-plugin-utils" "^7.10.1" + "@babel/helper-plugin-utils" "^7.10.4" -"@babel/plugin-transform-typescript@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-transform-typescript/-/plugin-transform-typescript-7.10.1.tgz#2c54daea231f602468686d9faa76f182a94507a6" - integrity sha512-v+QWKlmCnsaimLeqq9vyCsVRMViZG1k2SZTlcZvB+TqyH570Zsij8nvVUZzOASCRiQFUxkLrn9Wg/kH0zgy5OQ== +"@babel/plugin-transform-typescript@^7.10.4": + version "7.11.0" + resolved "https://registry.yarnpkg.com/@babel/plugin-transform-typescript/-/plugin-transform-typescript-7.11.0.tgz#2b4879676af37342ebb278216dd090ac67f13abb" + integrity sha512-edJsNzTtvb3MaXQwj8403B7mZoGu9ElDJQZOKjGUnvilquxBA3IQoEIOvkX/1O8xfAsnHS/oQhe2w/IXrr+w0w== dependencies: - "@babel/helper-create-class-features-plugin" "^7.10.1" - "@babel/helper-plugin-utils" "^7.10.1" - "@babel/plugin-syntax-typescript" "^7.10.1" + "@babel/helper-create-class-features-plugin" "^7.10.5" + "@babel/helper-plugin-utils" "^7.10.4" + "@babel/plugin-syntax-typescript" "^7.10.4" -"@babel/plugin-transform-unicode-escapes@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-transform-unicode-escapes/-/plugin-transform-unicode-escapes-7.10.1.tgz#add0f8483dab60570d9e03cecef6c023aa8c9940" - integrity sha512-zZ0Poh/yy1d4jeDWpx/mNwbKJVwUYJX73q+gyh4bwtG0/iUlzdEu0sLMda8yuDFS6LBQlT/ST1SJAR6zYwXWgw== +"@babel/plugin-transform-unicode-escapes@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/plugin-transform-unicode-escapes/-/plugin-transform-unicode-escapes-7.10.4.tgz#feae523391c7651ddac115dae0a9d06857892007" + integrity sha512-y5XJ9waMti2J+e7ij20e+aH+fho7Wb7W8rNuu72aKRwCHFqQdhkdU2lo3uZ9tQuboEJcUFayXdARhcxLQ3+6Fg== dependencies: - "@babel/helper-plugin-utils" "^7.10.1" + "@babel/helper-plugin-utils" "^7.10.4" -"@babel/plugin-transform-unicode-regex@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/plugin-transform-unicode-regex/-/plugin-transform-unicode-regex-7.10.1.tgz#6b58f2aea7b68df37ac5025d9c88752443a6b43f" - integrity sha512-Y/2a2W299k0VIUdbqYm9X2qS6fE0CUBhhiPpimK6byy7OJ/kORLlIX+J6UrjgNu5awvs62k+6RSslxhcvVw2Tw== +"@babel/plugin-transform-unicode-regex@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/plugin-transform-unicode-regex/-/plugin-transform-unicode-regex-7.10.4.tgz#e56d71f9282fac6db09c82742055576d5e6d80a8" + integrity sha512-wNfsc4s8N2qnIwpO/WP2ZiSyjfpTamT2C9V9FDH/Ljub9zw6P3SjkXcFmc0RQUt96k2fmIvtla2MMjgTwIAC+A== dependencies: - "@babel/helper-create-regexp-features-plugin" "^7.10.1" - "@babel/helper-plugin-utils" "^7.10.1" + "@babel/helper-create-regexp-features-plugin" "^7.10.4" + "@babel/helper-plugin-utils" "^7.10.4" "@babel/preset-env@^7.9.0", "@babel/preset-env@^7.9.5": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/preset-env/-/preset-env-7.10.1.tgz#099e1b76379739bdcbfab3d548dc7e7edb2ac808" - integrity sha512-bGWNfjfXRLnqbN2T4lB3pMfoic8dkRrmHpVZamSFHzGy5xklyHTobZ28TVUD2grhE5WDnu67tBj8oslIhkiOMQ== - dependencies: - "@babel/compat-data" "^7.10.1" - "@babel/helper-compilation-targets" "^7.10.1" - "@babel/helper-module-imports" "^7.10.1" - "@babel/helper-plugin-utils" "^7.10.1" - "@babel/plugin-proposal-async-generator-functions" "^7.10.1" - "@babel/plugin-proposal-class-properties" "^7.10.1" - "@babel/plugin-proposal-dynamic-import" "^7.10.1" - "@babel/plugin-proposal-json-strings" "^7.10.1" - "@babel/plugin-proposal-nullish-coalescing-operator" "^7.10.1" - "@babel/plugin-proposal-numeric-separator" "^7.10.1" - "@babel/plugin-proposal-object-rest-spread" "^7.10.1" - "@babel/plugin-proposal-optional-catch-binding" "^7.10.1" - "@babel/plugin-proposal-optional-chaining" "^7.10.1" - "@babel/plugin-proposal-private-methods" "^7.10.1" - "@babel/plugin-proposal-unicode-property-regex" "^7.10.1" + version "7.11.0" + resolved "https://registry.yarnpkg.com/@babel/preset-env/-/preset-env-7.11.0.tgz#860ee38f2ce17ad60480c2021ba9689393efb796" + integrity sha512-2u1/k7rG/gTh02dylX2kL3S0IJNF+J6bfDSp4DI2Ma8QN6Y9x9pmAax59fsCk6QUQG0yqH47yJWA+u1I1LccAg== + dependencies: + "@babel/compat-data" "^7.11.0" + "@babel/helper-compilation-targets" "^7.10.4" + "@babel/helper-module-imports" "^7.10.4" + "@babel/helper-plugin-utils" "^7.10.4" + "@babel/plugin-proposal-async-generator-functions" "^7.10.4" + "@babel/plugin-proposal-class-properties" "^7.10.4" + "@babel/plugin-proposal-dynamic-import" "^7.10.4" + "@babel/plugin-proposal-export-namespace-from" "^7.10.4" + "@babel/plugin-proposal-json-strings" "^7.10.4" + "@babel/plugin-proposal-logical-assignment-operators" "^7.11.0" + "@babel/plugin-proposal-nullish-coalescing-operator" "^7.10.4" + "@babel/plugin-proposal-numeric-separator" "^7.10.4" + "@babel/plugin-proposal-object-rest-spread" "^7.11.0" + "@babel/plugin-proposal-optional-catch-binding" "^7.10.4" + "@babel/plugin-proposal-optional-chaining" "^7.11.0" + "@babel/plugin-proposal-private-methods" "^7.10.4" + "@babel/plugin-proposal-unicode-property-regex" "^7.10.4" "@babel/plugin-syntax-async-generators" "^7.8.0" - "@babel/plugin-syntax-class-properties" "^7.10.1" + "@babel/plugin-syntax-class-properties" "^7.10.4" "@babel/plugin-syntax-dynamic-import" "^7.8.0" + "@babel/plugin-syntax-export-namespace-from" "^7.8.3" "@babel/plugin-syntax-json-strings" "^7.8.0" + "@babel/plugin-syntax-logical-assignment-operators" "^7.10.4" "@babel/plugin-syntax-nullish-coalescing-operator" "^7.8.0" - "@babel/plugin-syntax-numeric-separator" "^7.10.1" + "@babel/plugin-syntax-numeric-separator" "^7.10.4" "@babel/plugin-syntax-object-rest-spread" "^7.8.0" "@babel/plugin-syntax-optional-catch-binding" "^7.8.0" "@babel/plugin-syntax-optional-chaining" "^7.8.0" - "@babel/plugin-syntax-top-level-await" "^7.10.1" - "@babel/plugin-transform-arrow-functions" "^7.10.1" - "@babel/plugin-transform-async-to-generator" "^7.10.1" - "@babel/plugin-transform-block-scoped-functions" "^7.10.1" - "@babel/plugin-transform-block-scoping" "^7.10.1" - "@babel/plugin-transform-classes" "^7.10.1" - "@babel/plugin-transform-computed-properties" "^7.10.1" - "@babel/plugin-transform-destructuring" "^7.10.1" - "@babel/plugin-transform-dotall-regex" "^7.10.1" - "@babel/plugin-transform-duplicate-keys" "^7.10.1" - "@babel/plugin-transform-exponentiation-operator" "^7.10.1" - "@babel/plugin-transform-for-of" "^7.10.1" - "@babel/plugin-transform-function-name" "^7.10.1" - "@babel/plugin-transform-literals" "^7.10.1" - "@babel/plugin-transform-member-expression-literals" "^7.10.1" - "@babel/plugin-transform-modules-amd" "^7.10.1" - "@babel/plugin-transform-modules-commonjs" "^7.10.1" - "@babel/plugin-transform-modules-systemjs" "^7.10.1" - "@babel/plugin-transform-modules-umd" "^7.10.1" - "@babel/plugin-transform-named-capturing-groups-regex" "^7.8.3" - "@babel/plugin-transform-new-target" "^7.10.1" - "@babel/plugin-transform-object-super" "^7.10.1" - "@babel/plugin-transform-parameters" "^7.10.1" - "@babel/plugin-transform-property-literals" "^7.10.1" - "@babel/plugin-transform-regenerator" "^7.10.1" - "@babel/plugin-transform-reserved-words" "^7.10.1" - "@babel/plugin-transform-shorthand-properties" "^7.10.1" - "@babel/plugin-transform-spread" "^7.10.1" - "@babel/plugin-transform-sticky-regex" "^7.10.1" - "@babel/plugin-transform-template-literals" "^7.10.1" - "@babel/plugin-transform-typeof-symbol" "^7.10.1" - "@babel/plugin-transform-unicode-escapes" "^7.10.1" - "@babel/plugin-transform-unicode-regex" "^7.10.1" + "@babel/plugin-syntax-top-level-await" "^7.10.4" + "@babel/plugin-transform-arrow-functions" "^7.10.4" + "@babel/plugin-transform-async-to-generator" "^7.10.4" + "@babel/plugin-transform-block-scoped-functions" "^7.10.4" + "@babel/plugin-transform-block-scoping" "^7.10.4" + "@babel/plugin-transform-classes" "^7.10.4" + "@babel/plugin-transform-computed-properties" "^7.10.4" + "@babel/plugin-transform-destructuring" "^7.10.4" + "@babel/plugin-transform-dotall-regex" "^7.10.4" + "@babel/plugin-transform-duplicate-keys" "^7.10.4" + "@babel/plugin-transform-exponentiation-operator" "^7.10.4" + "@babel/plugin-transform-for-of" "^7.10.4" + "@babel/plugin-transform-function-name" "^7.10.4" + "@babel/plugin-transform-literals" "^7.10.4" + "@babel/plugin-transform-member-expression-literals" "^7.10.4" + "@babel/plugin-transform-modules-amd" "^7.10.4" + "@babel/plugin-transform-modules-commonjs" "^7.10.4" + "@babel/plugin-transform-modules-systemjs" "^7.10.4" + "@babel/plugin-transform-modules-umd" "^7.10.4" + "@babel/plugin-transform-named-capturing-groups-regex" "^7.10.4" + "@babel/plugin-transform-new-target" "^7.10.4" + "@babel/plugin-transform-object-super" "^7.10.4" + "@babel/plugin-transform-parameters" "^7.10.4" + "@babel/plugin-transform-property-literals" "^7.10.4" + "@babel/plugin-transform-regenerator" "^7.10.4" + "@babel/plugin-transform-reserved-words" "^7.10.4" + "@babel/plugin-transform-shorthand-properties" "^7.10.4" + "@babel/plugin-transform-spread" "^7.11.0" + "@babel/plugin-transform-sticky-regex" "^7.10.4" + "@babel/plugin-transform-template-literals" "^7.10.4" + "@babel/plugin-transform-typeof-symbol" "^7.10.4" + "@babel/plugin-transform-unicode-escapes" "^7.10.4" + "@babel/plugin-transform-unicode-regex" "^7.10.4" "@babel/preset-modules" "^0.1.3" - "@babel/types" "^7.10.1" + "@babel/types" "^7.11.0" browserslist "^4.12.0" core-js-compat "^3.6.2" invariant "^2.2.2" @@ -1058,104 +1038,72 @@ esutils "^2.0.2" "@babel/preset-react@^7.9.4": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/preset-react/-/preset-react-7.10.1.tgz#e2ab8ae9a363ec307b936589f07ed753192de041" - integrity sha512-Rw0SxQ7VKhObmFjD/cUcKhPTtzpeviEFX1E6PgP+cYOhQ98icNqtINNFANlsdbQHrmeWnqdxA4Tmnl1jy5tp3Q== - dependencies: - "@babel/helper-plugin-utils" "^7.10.1" - "@babel/plugin-transform-react-display-name" "^7.10.1" - "@babel/plugin-transform-react-jsx" "^7.10.1" - "@babel/plugin-transform-react-jsx-development" "^7.10.1" - "@babel/plugin-transform-react-jsx-self" "^7.10.1" - "@babel/plugin-transform-react-jsx-source" "^7.10.1" - "@babel/plugin-transform-react-pure-annotations" "^7.10.1" + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/preset-react/-/preset-react-7.10.4.tgz#92e8a66d816f9911d11d4cc935be67adfc82dbcf" + integrity sha512-BrHp4TgOIy4M19JAfO1LhycVXOPWdDbTRep7eVyatf174Hff+6Uk53sDyajqZPu8W1qXRBiYOfIamek6jA7YVw== + dependencies: + "@babel/helper-plugin-utils" "^7.10.4" + "@babel/plugin-transform-react-display-name" "^7.10.4" + "@babel/plugin-transform-react-jsx" "^7.10.4" + "@babel/plugin-transform-react-jsx-development" "^7.10.4" + "@babel/plugin-transform-react-jsx-self" "^7.10.4" + "@babel/plugin-transform-react-jsx-source" "^7.10.4" + "@babel/plugin-transform-react-pure-annotations" "^7.10.4" "@babel/preset-typescript@^7.9.0": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/preset-typescript/-/preset-typescript-7.10.1.tgz#a8d8d9035f55b7d99a2461a0bdc506582914d07e" - integrity sha512-m6GV3y1ShiqxnyQj10600ZVOFrSSAa8HQ3qIUk2r+gcGtHTIRw0dJnFLt1WNXpKjtVw7yw1DAPU/6ma2ZvgJuA== + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/preset-typescript/-/preset-typescript-7.10.4.tgz#7d5d052e52a682480d6e2cc5aa31be61c8c25e36" + integrity sha512-SdYnvGPv+bLlwkF2VkJnaX/ni1sMNetcGI1+nThF1gyv6Ph8Qucc4ZZAjM5yZcE/AKRXIOTZz7eSRDWOEjPyRQ== dependencies: - "@babel/helper-plugin-utils" "^7.10.1" - "@babel/plugin-transform-typescript" "^7.10.1" + "@babel/helper-plugin-utils" "^7.10.4" + "@babel/plugin-transform-typescript" "^7.10.4" -"@babel/runtime@^7.1.2", "@babel/runtime@^7.5.5", "@babel/runtime@^7.9.2": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.10.1.tgz#b6eb75cac279588d3100baecd1b9894ea2840822" - integrity sha512-nQbbCbQc9u/rpg1XCxoMYQTbSMVZjCDxErQ1ClCn9Pvcmv1lGads19ep0a2VsEiIJeHqjZley6EQGEC3Yo1xMA== +"@babel/runtime-corejs3@^7.10.4": + version "7.11.2" + resolved "https://registry.yarnpkg.com/@babel/runtime-corejs3/-/runtime-corejs3-7.11.2.tgz#02c3029743150188edeb66541195f54600278419" + integrity sha512-qh5IR+8VgFz83VBa6OkaET6uN/mJOhHONuy3m1sgF0CV6mXdPSEBdA7e1eUbVvyNtANjMbg22JUv71BaDXLY6A== dependencies: + core-js-pure "^3.0.0" regenerator-runtime "^0.13.4" -"@babel/runtime@^7.8.4": - version "7.9.2" - resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.9.2.tgz#d90df0583a3a252f09aaa619665367bae518db06" - integrity sha512-NE2DtOdufG7R5vnfQUTehdTfNycfUANEtCa9PssN9O/xmTzP4E08UI797ixaei6hBEVL9BI/PsdJS5x7mWoB9Q== +"@babel/runtime@^7.1.2", "@babel/runtime@^7.5.5", "@babel/runtime@^7.8.4", "@babel/runtime@^7.9.2": + version "7.11.2" + resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.11.2.tgz#f549c13c754cc40b87644b9fa9f09a6a95fe0736" + integrity sha512-TeWkU52so0mPtDcaCTxNBI/IHiz0pZgr8VEFqXFtZWpYD08ZB6FaSwVAS8MKRQAP3bYKiVjwysOJgMFY28o6Tw== dependencies: regenerator-runtime "^0.13.4" -"@babel/template@^7.10.1": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.10.1.tgz#e167154a94cb5f14b28dc58f5356d2162f539811" - integrity sha512-OQDg6SqvFSsc9A0ej6SKINWrpJiNonRIniYondK2ViKhB06i3c0s+76XUft71iqBEe9S1OKsHwPAjfHnuvnCig== - dependencies: - "@babel/code-frame" "^7.10.1" - "@babel/parser" "^7.10.1" - "@babel/types" "^7.10.1" - -"@babel/template@^7.8.3", "@babel/template@^7.8.6": - version "7.8.6" - resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.8.6.tgz#86b22af15f828dfb086474f964dcc3e39c43ce2b" - integrity sha512-zbMsPMy/v0PWFZEhQJ66bqjhH+z0JgMoBWuikXybgG3Gkd/3t5oQ1Rw2WQhnSrsOmsKXnZOx15tkC4qON/+JPg== - dependencies: - "@babel/code-frame" "^7.8.3" - "@babel/parser" "^7.8.6" - "@babel/types" "^7.8.6" - -"@babel/traverse@^7.10.1", "@babel/traverse@^7.9.6": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.10.1.tgz#bbcef3031e4152a6c0b50147f4958df54ca0dd27" - integrity sha512-C/cTuXeKt85K+p08jN6vMDz8vSV0vZcI0wmQ36o6mjbuo++kPMdpOYw23W2XH04dbRt9/nMEfA4W3eR21CD+TQ== - dependencies: - "@babel/code-frame" "^7.10.1" - "@babel/generator" "^7.10.1" - "@babel/helper-function-name" "^7.10.1" - "@babel/helper-split-export-declaration" "^7.10.1" - "@babel/parser" "^7.10.1" - "@babel/types" "^7.10.1" - debug "^4.1.0" - globals "^11.1.0" - lodash "^4.17.13" - -"@babel/traverse@^7.8.6", "@babel/traverse@^7.9.0": - version "7.9.5" - resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.9.5.tgz#6e7c56b44e2ac7011a948c21e283ddd9d9db97a2" - integrity sha512-c4gH3jsvSuGUezlP6rzSJ6jf8fYjLj3hsMZRx/nX0h+fmHN0w+ekubRrHPqnMec0meycA2nwCsJ7dC8IPem2FQ== - dependencies: - "@babel/code-frame" "^7.8.3" - "@babel/generator" "^7.9.5" - "@babel/helper-function-name" "^7.9.5" - "@babel/helper-split-export-declaration" "^7.8.3" - "@babel/parser" "^7.9.0" - "@babel/types" "^7.9.5" +"@babel/template@^7.10.4": + version "7.10.4" + resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.10.4.tgz#3251996c4200ebc71d1a8fc405fba940f36ba278" + integrity sha512-ZCjD27cGJFUB6nmCB1Enki3r+L5kJveX9pq1SvAUKoICy6CZ9yD8xO086YXdYhvNjBdnekm4ZnaP5yC8Cs/1tA== + dependencies: + "@babel/code-frame" "^7.10.4" + "@babel/parser" "^7.10.4" + "@babel/types" "^7.10.4" + +"@babel/traverse@^7.10.4", "@babel/traverse@^7.10.5", "@babel/traverse@^7.11.0", "@babel/traverse@^7.9.0": + version "7.11.0" + resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.11.0.tgz#9b996ce1b98f53f7c3e4175115605d56ed07dd24" + integrity sha512-ZB2V+LskoWKNpMq6E5UUCrjtDUh5IOTAyIl0dTjIEoXum/iKWkoIEKIRDnUucO6f+2FzNkE0oD4RLKoPIufDtg== + dependencies: + "@babel/code-frame" "^7.10.4" + "@babel/generator" "^7.11.0" + "@babel/helper-function-name" "^7.10.4" + "@babel/helper-split-export-declaration" "^7.11.0" + "@babel/parser" "^7.11.0" + "@babel/types" "^7.11.0" debug "^4.1.0" globals "^11.1.0" - lodash "^4.17.13" + lodash "^4.17.19" -"@babel/types@^7.10.1", "@babel/types@^7.9.6": - version "7.10.1" - resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.10.1.tgz#6886724d31c8022160a7db895e6731ca33483921" - integrity sha512-L2yqUOpf3tzlW9GVuipgLEcZxnO+96SzR6fjXMuxxNkIgFJ5+07mHCZ+HkHqaeZu8+3LKnNJJ1bKbjBETQAsrA== +"@babel/types@^7.10.4", "@babel/types@^7.10.5", "@babel/types@^7.11.0", "@babel/types@^7.4.4", "@babel/types@^7.9.5": + version "7.11.0" + resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.11.0.tgz#2ae6bf1ba9ae8c3c43824e5861269871b206e90d" + integrity sha512-O53yME4ZZI0jO1EVGtF1ePGl0LHirG4P1ibcD80XyzZcKhcMFeCXmh4Xb1ifGBIV233Qg12x4rBfQgA+tmOukA== dependencies: - "@babel/helper-validator-identifier" "^7.10.1" - lodash "^4.17.13" - to-fast-properties "^2.0.0" - -"@babel/types@^7.4.4", "@babel/types@^7.8.3", "@babel/types@^7.8.6", "@babel/types@^7.9.0", "@babel/types@^7.9.5": - version "7.9.5" - resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.9.5.tgz#89231f82915a8a566a703b3b20133f73da6b9444" - integrity sha512-XjnvNqenk818r5zMaba+sLQjnbda31UfUURv3ei0qPQw4u+j2jMyJ5b11y8ZHYTRSI3NnInQkkkRT4fLqqPdHg== - dependencies: - "@babel/helper-validator-identifier" "^7.9.5" - lodash "^4.17.13" + "@babel/helper-validator-identifier" "^7.10.4" + lodash "^4.17.19" to-fast-properties "^2.0.0" "@csstools/convert-colors@^1.4.0": @@ -1163,40 +1111,65 @@ resolved "https://registry.yarnpkg.com/@csstools/convert-colors/-/convert-colors-1.4.0.tgz#ad495dc41b12e75d588c6db8b9834f08fa131eb7" integrity sha512-5a6wqoJV/xEdbRNKVo6I4hO3VjyDq//8q2f9I6PBAvMesJHFauXDorcNCsr9RzvsZnaWi5NYCcfyqP1QeFHFbw== -"@docusaurus/core@^2.0.0-alpha.56": - version "2.0.0-alpha.56" - resolved "https://registry.yarnpkg.com/@docusaurus/core/-/core-2.0.0-alpha.56.tgz#8e0ded61e3b19fbc5f483a300497e674f6452ea4" - integrity sha512-+P/2T6aeBcwJbg4a7Y/6CrGL4GKDjTESKwhf41naGsA4v98o5P23eIiKngBvfTPVwHXu3MDShE6UU+lnFqBXyQ== +"@docsearch/css@^1.0.0-alpha.27": + version "1.0.0-alpha.27" + resolved "https://registry.yarnpkg.com/@docsearch/css/-/css-1.0.0-alpha.27.tgz#7f50985869ebab10ffb901b94ed7545269a3393c" + integrity sha512-Kw6R/gAHMZW2tKZO2a0gd3I8Yf6bJgTk3Dp+L0ZFrvEHEh8v3yQKvoxVify3ML9YVyvCxxAPQQuF9u3JNUwvXw== + +"@docsearch/react@^1.0.0-alpha.25": + version "1.0.0-alpha.27" + resolved "https://registry.yarnpkg.com/@docsearch/react/-/react-1.0.0-alpha.27.tgz#eae61d648ddc3667c5dee82c4cd9d47bf35a3c85" + integrity sha512-jcgUHZsrNNRsaVsplqKhXWheh4VzRTCdhsPuVhJMRvfsFUqXEPo/7kVt5xIybtOj9u+/FVdeSO+APJEE2rakYA== + dependencies: + "@docsearch/css" "^1.0.0-alpha.27" + "@francoischalifour/autocomplete-core" "^1.0.0-alpha.27" + "@francoischalifour/autocomplete-preset-algolia" "^1.0.0-alpha.27" + algoliasearch "^4.0.0" + +"@docusaurus/core@^2.0.0-alpha.61": + version "2.0.0-alpha.61" + resolved "https://registry.yarnpkg.com/@docusaurus/core/-/core-2.0.0-alpha.61.tgz#4b736d36687bd12fb9399f9ce352e87da4bf8fe7" + integrity sha512-Ev0v5J7L/Pm3VJMdhhyR8I9tUQo8MhVRUUT+Bf0W3TMYG6jp2cIXE88yCfxOsTDducS7EMrdtUXfvePGH9CE/A== dependencies: "@babel/core" "^7.9.0" + "@babel/plugin-proposal-nullish-coalescing-operator" "^7.10.1" + "@babel/plugin-proposal-optional-chaining" "^7.10.3" "@babel/plugin-syntax-dynamic-import" "^7.8.3" "@babel/plugin-transform-runtime" "^7.9.0" "@babel/preset-env" "^7.9.0" "@babel/preset-react" "^7.9.4" "@babel/preset-typescript" "^7.9.0" "@babel/runtime" "^7.9.2" - "@docusaurus/utils" "^2.0.0-alpha.56" + "@babel/runtime-corejs3" "^7.10.4" + "@docusaurus/types" "^2.0.0-alpha.61" + "@docusaurus/utils" "^2.0.0-alpha.61" "@endiliey/static-site-generator-webpack-plugin" "^4.0.0" + "@hapi/joi" "^17.1.1" "@svgr/webpack" "^5.4.0" babel-loader "^8.1.0" babel-plugin-dynamic-import-node "^2.3.0" + boxen "^4.2.0" cache-loader "^4.1.0" chalk "^3.0.0" chokidar "^3.3.0" - classnames "^2.2.6" commander "^4.0.1" copy-webpack-plugin "^5.0.5" core-js "^2.6.5" css-loader "^3.4.2" del "^5.1.0" + detect-port "^1.3.0" eta "^1.1.1" express "^4.17.1" + file-loader "^6.0.0" fs-extra "^8.1.0" globby "^10.0.1" html-minifier-terser "^5.0.5" html-tags "^3.1.0" html-webpack-plugin "^4.0.4" import-fresh "^3.2.1" + inquirer "^7.2.0" + is-root "^2.1.0" + lodash "^4.5.2" lodash.has "^4.5.2" lodash.isplainobject "^4.0.6" lodash.isstring "^4.0.1" @@ -1205,20 +1178,23 @@ null-loader "^3.0.0" optimize-css-assets-webpack-plugin "^5.0.3" pnp-webpack-plugin "^1.6.4" - portfinder "^1.0.25" postcss-loader "^3.0.0" postcss-preset-env "^6.7.0" react-dev-utils "^10.2.1" react-helmet "^6.0.0-beta" react-loadable "^5.5.0" - react-loadable-ssr-addon "^0.2.0" + react-loadable-ssr-addon "^0.2.3" react-router "^5.1.2" react-router-config "^5.1.1" react-router-dom "^5.1.2" + resolve-pathname "^3.0.0" semver "^6.3.0" + serve-handler "^6.1.3" shelljs "^0.8.4" std-env "^2.2.1" terser-webpack-plugin "^2.3.5" + update-notifier "^4.1.0" + url-loader "^4.1.0" wait-file "^1.0.5" webpack "^4.41.2" webpack-bundle-analyzer "^3.6.1" @@ -1226,16 +1202,18 @@ webpack-merge "^4.2.2" webpackbar "^4.0.0" -"@docusaurus/mdx-loader@^2.0.0-alpha.56": - version "2.0.0-alpha.56" - resolved "https://registry.yarnpkg.com/@docusaurus/mdx-loader/-/mdx-loader-2.0.0-alpha.56.tgz#0336592b332c9f14d45b0b314c33167bee348372" - integrity sha512-GXlQMB6z5Zl6f1zAjE3PaUOAPGPYF0vYQR8Qz8RETyVmDCHumoAAT4/NSDrPYMLrdcp4BrMUn4PoNK4MK5462w== +"@docusaurus/mdx-loader@^2.0.0-alpha.61": + version "2.0.0-alpha.61" + resolved "https://registry.yarnpkg.com/@docusaurus/mdx-loader/-/mdx-loader-2.0.0-alpha.61.tgz#90b33f928c72d47c51a3d438990e30f143b2b1ee" + integrity sha512-n7VMfyshgMjoVI2YdQFlPVcMTSR+XOl2UbOTgJXDmD4yCeLOSaj63g8fwVoCy+NRkPgjpWGTGCeLNs63dk9jYg== dependencies: "@babel/parser" "^7.9.4" "@babel/traverse" "^7.9.0" + "@docusaurus/core" "^2.0.0-alpha.61" "@mdx-js/mdx" "^1.5.8" "@mdx-js/react" "^1.5.8" escape-html "^1.0.3" + file-loader "^6.0.0" fs-extra "^8.1.0" github-slugger "^1.3.0" gray-matter "^4.0.2" @@ -1244,14 +1222,19 @@ remark-emoji "^2.1.0" stringify-object "^3.3.0" unist-util-visit "^2.0.2" - -"@docusaurus/plugin-content-blog@^2.0.0-alpha.56": - version "2.0.0-alpha.56" - resolved "https://registry.yarnpkg.com/@docusaurus/plugin-content-blog/-/plugin-content-blog-2.0.0-alpha.56.tgz#a5d754433e154a2fe0f8a8e33aa5169eeae7283e" - integrity sha512-oqCRv3PQe7sXI5+IqOpezluUs5oG39ctO8M2ZHNqf5vG+5tafr82rpKTpwp2uL3AahVlp7xkWRKF6LGNLCHQZA== - dependencies: - "@docusaurus/mdx-loader" "^2.0.0-alpha.56" - "@docusaurus/utils" "^2.0.0-alpha.56" + url-loader "^4.1.0" + +"@docusaurus/plugin-content-blog@^2.0.0-alpha.61": + version "2.0.0-alpha.61" + resolved "https://registry.yarnpkg.com/@docusaurus/plugin-content-blog/-/plugin-content-blog-2.0.0-alpha.61.tgz#fd4df3eedfd5ac8b32f2a4fcfe562804b30164eb" + integrity sha512-C2U5NTKYeDm7AViMt4fqmkLuk2kwxvvkzAK84EvEA3tVy3Q58qTfRqbDyFJGN63OL1Os+1HwQvGjPjCUWVbJ3Q== + dependencies: + "@docusaurus/core" "^2.0.0-alpha.61" + "@docusaurus/mdx-loader" "^2.0.0-alpha.61" + "@docusaurus/types" "^2.0.0-alpha.61" + "@docusaurus/utils" "^2.0.0-alpha.61" + "@docusaurus/utils-validation" "^2.0.0-alpha.61" + "@hapi/joi" "^17.1.1" feed "^4.1.0" fs-extra "^8.1.0" globby "^10.0.1" @@ -1260,13 +1243,17 @@ reading-time "^1.2.0" remark-admonitions "^1.2.1" -"@docusaurus/plugin-content-docs@^2.0.0-alpha.56": - version "2.0.0-alpha.56" - resolved "https://registry.yarnpkg.com/@docusaurus/plugin-content-docs/-/plugin-content-docs-2.0.0-alpha.56.tgz#1e2cdb8b00cbbebf5abdd2b6614bc8f3776660fb" - integrity sha512-vRM/Zi80PV7+U/rQ+5e4XknqqELgCAoNr+bc8+aA6je6CgHLjxwySVJvEChe/36QCYhax9eSnpWgoQKkfSXHdg== - dependencies: - "@docusaurus/mdx-loader" "^2.0.0-alpha.56" - "@docusaurus/utils" "^2.0.0-alpha.56" +"@docusaurus/plugin-content-docs@^2.0.0-alpha.61": + version "2.0.0-alpha.61" + resolved "https://registry.yarnpkg.com/@docusaurus/plugin-content-docs/-/plugin-content-docs-2.0.0-alpha.61.tgz#aa9746aa6302ae6bb7df96152734a138fba649c6" + integrity sha512-1WojgF+0ZQoARVF3I++2ghzG0sY4panxNiWv8Mzo2MdqECj3lgmR8jaVUSXj4bcTzX7uAEVS9MqKYIf3DBpgYg== + dependencies: + "@docusaurus/core" "^2.0.0-alpha.61" + "@docusaurus/mdx-loader" "^2.0.0-alpha.61" + "@docusaurus/types" "^2.0.0-alpha.61" + "@docusaurus/utils" "^2.0.0-alpha.61" + "@docusaurus/utils-validation" "^2.0.0-alpha.61" + "@hapi/joi" "17.1.1" execa "^3.4.0" fs-extra "^8.1.0" globby "^10.0.1" @@ -1276,60 +1263,79 @@ lodash.groupby "^4.6.0" lodash.pick "^4.4.0" lodash.pickby "^4.6.0" + lodash.sortby "^4.6.0" remark-admonitions "^1.2.1" shelljs "^0.8.4" -"@docusaurus/plugin-content-pages@^2.0.0-alpha.56": - version "2.0.0-alpha.56" - resolved "https://registry.yarnpkg.com/@docusaurus/plugin-content-pages/-/plugin-content-pages-2.0.0-alpha.56.tgz#84d7740adb1d0adeec511e51b28ceef8a3d721f3" - integrity sha512-8mHqiWyk90ExFprE7S7O2N7oW6jOLOtf64JVCGzDdMVKkKJJZY8VHWb7EP2D/pkMiByunrD1yJj933ZIjFD+0g== +"@docusaurus/plugin-content-pages@^2.0.0-alpha.61": + version "2.0.0-alpha.61" + resolved "https://registry.yarnpkg.com/@docusaurus/plugin-content-pages/-/plugin-content-pages-2.0.0-alpha.61.tgz#3fdc401fe4693fc3ec1f481022ccaaeac296a36e" + integrity sha512-UQmXnGQCQoMltnL0Zvf0Dhqis+tKPwAdtcoBcQN4dvaDp4iEsS8eJjG9QZqvPzqJv+giVyuCT/KeZj/pxCitNw== dependencies: - "@docusaurus/types" "^2.0.0-alpha.56" - "@docusaurus/utils" "^2.0.0-alpha.56" + "@docusaurus/mdx-loader" "^2.0.0-alpha.61" + "@docusaurus/types" "^2.0.0-alpha.61" + "@docusaurus/utils" "^2.0.0-alpha.61" + "@docusaurus/utils-validation" "^2.0.0-alpha.61" + "@hapi/joi" "17.1.1" globby "^10.0.1" + loader-utils "^1.2.3" + remark-admonitions "^1.2.1" + +"@docusaurus/plugin-debug@^2.0.0-alpha.61": + version "2.0.0-alpha.61" + resolved "https://registry.yarnpkg.com/@docusaurus/plugin-debug/-/plugin-debug-2.0.0-alpha.61.tgz#b1fab0775def0587d9e995004e117225f853b6f1" + integrity sha512-v0qbGwT/yd5Dy/dcwn5fBCdlFE60IOOhllBDuKUsjJwKCvFDKHZ6jtxrZY+ujIlDfj/Tkc4ban0w46JGWnMj+w== + dependencies: + "@docusaurus/types" "^2.0.0-alpha.61" + "@docusaurus/utils" "^2.0.0-alpha.61" -"@docusaurus/plugin-google-analytics@^2.0.0-alpha.56": - version "2.0.0-alpha.56" - resolved "https://registry.yarnpkg.com/@docusaurus/plugin-google-analytics/-/plugin-google-analytics-2.0.0-alpha.56.tgz#5556ca3c97dd99f5443cec8707755f78bd24b4b2" - integrity sha512-nL1hfPqUWJSAoMBqlLSF/ZlQ/HlOnZc4VQSqR5FkZV2UNhPI0kQKiIeBjzQFtODxfWfDBs2PQLMiA2Qx3Hme6A== +"@docusaurus/plugin-google-analytics@^2.0.0-alpha.61": + version "2.0.0-alpha.61" + resolved "https://registry.yarnpkg.com/@docusaurus/plugin-google-analytics/-/plugin-google-analytics-2.0.0-alpha.61.tgz#c57a48a1878050400631bd928f1cb74c94ba6791" + integrity sha512-f+KmaoM6eTledmgyijMNREvekZVLJ3nll6aUNDXPod9+MF673Hs4RGDyveMAjLiq03+VCgtXAniTSYsFIHcuAQ== -"@docusaurus/plugin-google-gtag@^2.0.0-alpha.56": - version "2.0.0-alpha.56" - resolved "https://registry.yarnpkg.com/@docusaurus/plugin-google-gtag/-/plugin-google-gtag-2.0.0-alpha.56.tgz#baae39045278b0d477d78d2ac3d03f9276b1238a" - integrity sha512-5BAMGvplzortF+wKpabGKqATa+WtNCHQeqRZwQtGLNZFgYEcJR55DAlb3+YHEAspAE39VGk16GQAWkni6j123g== +"@docusaurus/plugin-google-gtag@^2.0.0-alpha.61": + version "2.0.0-alpha.61" + resolved "https://registry.yarnpkg.com/@docusaurus/plugin-google-gtag/-/plugin-google-gtag-2.0.0-alpha.61.tgz#9471a39b27425708b6e8cca3fca8bace7e459153" + integrity sha512-9l/CUNtBIZqTKY7vD0dOOTrLRpbViXSQPsIOlfYDilS2AQmpsoJVQf6CcCts+GaxWMu0pTw3zeCNnFtJfDV5pA== -"@docusaurus/plugin-sitemap@^2.0.0-alpha.56": - version "2.0.0-alpha.56" - resolved "https://registry.yarnpkg.com/@docusaurus/plugin-sitemap/-/plugin-sitemap-2.0.0-alpha.56.tgz#8ff96f24e26b72eafb3e909d6513319c56b7e6ff" - integrity sha512-A9gJuilowS/6bMBR7vobQUg1um5WL6eVohfHmhFsYPVko+7Al4Sya01A926R0OLviwQ9ItGA6wdCvYbmIAV6BQ== +"@docusaurus/plugin-sitemap@^2.0.0-alpha.61": + version "2.0.0-alpha.61" + resolved "https://registry.yarnpkg.com/@docusaurus/plugin-sitemap/-/plugin-sitemap-2.0.0-alpha.61.tgz#7b3d14951d834051b57223b3e9eb8ffb9bedeaaa" + integrity sha512-7nXJl/zsnr8Hlzxn3bm9NhpwP4sRFGXWwSCWCC4FMrIw9ihXWTtMGe9hDuJx4DqC8xufyQMw26VGauH7XAWdMg== dependencies: - "@docusaurus/types" "^2.0.0-alpha.56" + "@docusaurus/types" "^2.0.0-alpha.61" + "@hapi/joi" "17.1.1" + fs-extra "^8.1.0" sitemap "^3.2.2" -"@docusaurus/preset-classic@^2.0.0-alpha.56": - version "2.0.0-alpha.56" - resolved "https://registry.yarnpkg.com/@docusaurus/preset-classic/-/preset-classic-2.0.0-alpha.56.tgz#30d41cd04e4f212dd525e7049f7c562dd8923e71" - integrity sha512-/N+R0JiKiMNELDDTQk4/PFIM5jKR0wJFd5tj/P07YWmpquzMS9GI8SeA83sKTqol/6BaG3pQKbNl0pCBf1T63A== - dependencies: - "@docusaurus/plugin-content-blog" "^2.0.0-alpha.56" - "@docusaurus/plugin-content-docs" "^2.0.0-alpha.56" - "@docusaurus/plugin-content-pages" "^2.0.0-alpha.56" - "@docusaurus/plugin-google-analytics" "^2.0.0-alpha.56" - "@docusaurus/plugin-google-gtag" "^2.0.0-alpha.56" - "@docusaurus/plugin-sitemap" "^2.0.0-alpha.56" - "@docusaurus/theme-classic" "^2.0.0-alpha.56" - "@docusaurus/theme-search-algolia" "^2.0.0-alpha.56" - -"@docusaurus/theme-classic@^2.0.0-alpha.56": - version "2.0.0-alpha.56" - resolved "https://registry.yarnpkg.com/@docusaurus/theme-classic/-/theme-classic-2.0.0-alpha.56.tgz#62b12c640462bb0bcfdc8ea7cf6e7198975736f6" - integrity sha512-+gdlqrbmizLukbveGK3UA+uedScSAtKcJCEjfrR2J/PmmsDdtPB3E5mY1j0AUZWGDhERF9NVeAsZgOHBzTTkhw== - dependencies: +"@docusaurus/preset-classic@^2.0.0-alpha.61": + version "2.0.0-alpha.61" + resolved "https://registry.yarnpkg.com/@docusaurus/preset-classic/-/preset-classic-2.0.0-alpha.61.tgz#38f9a34d3e5092264cfa48d0242ab774d13aa534" + integrity sha512-/3HL468XiSZ1T4mdvqnfV6O80Qv4BxAseJGnmkBwS0u6+Q1VgkNxRxVk4B45OWPaurK/Dl+sCn4sAAUWUGRsZg== + dependencies: + "@docusaurus/plugin-content-blog" "^2.0.0-alpha.61" + "@docusaurus/plugin-content-docs" "^2.0.0-alpha.61" + "@docusaurus/plugin-content-pages" "^2.0.0-alpha.61" + "@docusaurus/plugin-debug" "^2.0.0-alpha.61" + "@docusaurus/plugin-google-analytics" "^2.0.0-alpha.61" + "@docusaurus/plugin-google-gtag" "^2.0.0-alpha.61" + "@docusaurus/plugin-sitemap" "^2.0.0-alpha.61" + "@docusaurus/theme-classic" "^2.0.0-alpha.61" + "@docusaurus/theme-search-algolia" "^2.0.0-alpha.61" + +"@docusaurus/theme-classic@^2.0.0-alpha.61": + version "2.0.0-alpha.61" + resolved "https://registry.yarnpkg.com/@docusaurus/theme-classic/-/theme-classic-2.0.0-alpha.61.tgz#1023603aa729efe4d929b5e2c3268af1b492b891" + integrity sha512-LPJwDi8iPzBe36+U65h4w5N5rXSuXuxPXWzBe/eF0/miR7VVCKydGSSubQLSMAXV0QWspGJIRSPnwuNH3DjJZg== + dependencies: + "@hapi/joi" "^17.1.1" "@mdx-js/mdx" "^1.5.8" "@mdx-js/react" "^1.5.8" - classnames "^2.2.6" - clipboard "^2.0.6" + clsx "^1.1.1" + copy-text-to-clipboard "^2.2.0" infima "0.2.0-alpha.12" + lodash "^4.17.19" parse-numeric-range "^0.0.2" prism-react-renderer "^1.1.0" prismjs "^1.20.0" @@ -1337,36 +1343,46 @@ react-router-dom "^5.1.2" react-toggle "^4.1.1" -"@docusaurus/theme-search-algolia@^2.0.0-alpha.56": - version "2.0.0-alpha.56" - resolved "https://registry.yarnpkg.com/@docusaurus/theme-search-algolia/-/theme-search-algolia-2.0.0-alpha.56.tgz#c9e961b39cf97637694f37e663f1bcbe171db3ce" - integrity sha512-0LFjM7eE8mu+4pNH42Y+pTuy6fHEgUSFrWjaS4eeJ97ervyXHhIYPYXv6z4+S0ZDu/hFk3ON5LZ+gUCsWKCnvw== +"@docusaurus/theme-search-algolia@^2.0.0-alpha.61": + version "2.0.0-alpha.61" + resolved "https://registry.yarnpkg.com/@docusaurus/theme-search-algolia/-/theme-search-algolia-2.0.0-alpha.61.tgz#f29811f6e1ecc829cb933f56b8e1498903b6bba3" + integrity sha512-B47SmuBdF2kguBo3Wkx8L/jhYgHXxgxEpcf9JCLPGzK0YiRJk111z43h6PLSwirEpxb4OE+sFqr5oPvnsgnwRw== dependencies: - algoliasearch "^3.24.5" + "@docsearch/react" "^1.0.0-alpha.25" + "@hapi/joi" "^17.1.1" + algoliasearch "^4.0.0" algoliasearch-helper "^3.1.1" - classnames "^2.2.6" - docsearch.js "^2.6.3" + clsx "^1.1.1" eta "^1.1.1" -"@docusaurus/types@^2.0.0-alpha.56": - version "2.0.0-alpha.56" - resolved "https://registry.yarnpkg.com/@docusaurus/types/-/types-2.0.0-alpha.56.tgz#a2d9f9c169764179a1e9c4b06cb6671dd493e833" - integrity sha512-N3IFESY+u9m4O9nDKatgO0hB8s5di5e8fZ6VmPTBtrOjG3ruruAGt3ho96UVDeLK2++DakKXnl9VCZ+CJ85wXg== +"@docusaurus/types@^2.0.0-alpha.61": + version "2.0.0-alpha.61" + resolved "https://registry.yarnpkg.com/@docusaurus/types/-/types-2.0.0-alpha.61.tgz#b2f5eaa18fb242100c0a8011edefe521b09e8375" + integrity sha512-x1fBiL/KNfREvA6B40CCTABjK9KP+kj/H/7mHfiwdtOYvVt9GJSgnjThkVD62lpVFbOhQ5C0togZsSzKlw6H/w== dependencies: "@types/webpack" "^4.41.0" commander "^4.0.1" querystring "0.2.0" + webpack-merge "^4.2.2" + +"@docusaurus/utils-validation@^2.0.0-alpha.61": + version "2.0.0-alpha.61" + resolved "https://registry.yarnpkg.com/@docusaurus/utils-validation/-/utils-validation-2.0.0-alpha.61.tgz#cc8ddbf4720f29b0cb1d630e7925ab338f9a5432" + integrity sha512-3QrJqZoR5eBz2XG0ijuTIp5AEOe1OHtuv7nkKArOCzFmjuBJLhUTRcECf0K+lcmdJ25zrRAWAYNgTvpVpBjaNg== + dependencies: + "@hapi/joi" "17.1.1" -"@docusaurus/utils@^2.0.0-alpha.56": - version "2.0.0-alpha.56" - resolved "https://registry.yarnpkg.com/@docusaurus/utils/-/utils-2.0.0-alpha.56.tgz#2fd1d070351cd86f3614240b63a915b2e121150e" - integrity sha512-CMII7BYMQ5Dg9sHcejbxbyHTCG4CHQc/uFasL8FNXkHn7crw5Pz2re+IutSklE2SEI5lOZtMl5Lt8HKDvHzG1g== +"@docusaurus/utils@^2.0.0-alpha.61": + version "2.0.0-alpha.61" + resolved "https://registry.yarnpkg.com/@docusaurus/utils/-/utils-2.0.0-alpha.61.tgz#bf7c7bd5a07419cafe9b67658f7f910b7fe71937" + integrity sha512-MHvR3Rq8Kk9W6skBR3x7mLsDaNrnp6Mmobyc0ZVql+eiLrjiN7SPunvrVJDE90bQ50HZFLLoAkfgfrvbX5mecg== dependencies: escape-string-regexp "^2.0.0" fs-extra "^8.1.0" gray-matter "^4.0.2" lodash.camelcase "^4.3.0" lodash.kebabcase "^4.1.1" + resolve-pathname "^3.0.0" "@endiliey/static-site-generator-webpack-plugin@^4.0.0": version "4.0.0" @@ -1379,21 +1395,59 @@ url "^0.11.0" webpack-sources "^1.4.3" +"@francoischalifour/autocomplete-core@^1.0.0-alpha.27": + version "1.0.0-alpha.27" + resolved "https://registry.yarnpkg.com/@francoischalifour/autocomplete-core/-/autocomplete-core-1.0.0-alpha.27.tgz#bd85058bf0ef02e9f9a57c7973c705edc2a25c41" + integrity sha512-kpKbtrjMt9l1HIFFmmH0u88633/1oBD+mEjKg1EIRJ1zQCeOBxlQvIXZ3X6GEoud79QjLVoc8HD4HN1OMRt+OA== + +"@francoischalifour/autocomplete-preset-algolia@^1.0.0-alpha.27": + version "1.0.0-alpha.27" + resolved "https://registry.yarnpkg.com/@francoischalifour/autocomplete-preset-algolia/-/autocomplete-preset-algolia-1.0.0-alpha.27.tgz#29de9939274887363f6e3f41078b2ee3e9c56493" + integrity sha512-Mp4lhlLd8vuLOCXtuw8UTUaJXGRrXYL7AN/ZmhaMwqyL9e9XSqLlcv82EWP0NAMcoz/I1E1C709h4jnbnN4llw== + "@hapi/address@2.x.x": version "2.1.4" resolved "https://registry.yarnpkg.com/@hapi/address/-/address-2.1.4.tgz#5d67ed43f3fd41a69d4b9ff7b56e7c0d1d0a81e5" integrity sha512-QD1PhQk+s31P1ixsX0H0Suoupp3VMXzIVMSwobR3F3MSUO2YCV0B7xqLcUw/Bh8yuvd3LhpyqLQWTNcRmp6IdQ== +"@hapi/address@^4.0.1": + version "4.1.0" + resolved "https://registry.yarnpkg.com/@hapi/address/-/address-4.1.0.tgz#d60c5c0d930e77456fdcde2598e77302e2955e1d" + integrity sha512-SkszZf13HVgGmChdHo/PxchnSaCJ6cetVqLzyciudzZRT0jcOouIF/Q93mgjw8cce+D+4F4C1Z/WrfFN+O3VHQ== + dependencies: + "@hapi/hoek" "^9.0.0" + "@hapi/bourne@1.x.x": version "1.3.2" resolved "https://registry.yarnpkg.com/@hapi/bourne/-/bourne-1.3.2.tgz#0a7095adea067243ce3283e1b56b8a8f453b242a" integrity sha512-1dVNHT76Uu5N3eJNTYcvxee+jzX4Z9lfciqRRHCU27ihbUcYi+iSc2iml5Ke1LXe1SyJCLA0+14Jh4tXJgOppA== +"@hapi/formula@^2.0.0": + version "2.0.0" + resolved "https://registry.yarnpkg.com/@hapi/formula/-/formula-2.0.0.tgz#edade0619ed58c8e4f164f233cda70211e787128" + integrity sha512-V87P8fv7PI0LH7LiVi8Lkf3x+KCO7pQozXRssAHNXXL9L1K+uyu4XypLXwxqVDKgyQai6qj3/KteNlrqDx4W5A== + "@hapi/hoek@8.x.x", "@hapi/hoek@^8.3.0": version "8.5.1" resolved "https://registry.yarnpkg.com/@hapi/hoek/-/hoek-8.5.1.tgz#fde96064ca446dec8c55a8c2f130957b070c6e06" integrity sha512-yN7kbciD87WzLGc5539Tn0sApjyiGHAJgKvG9W8C7O+6c7qmoQMfVs0W4bX17eqz6C78QJqqFrtgdK5EWf6Qow== +"@hapi/hoek@^9.0.0": + version "9.0.4" + resolved "https://registry.yarnpkg.com/@hapi/hoek/-/hoek-9.0.4.tgz#e80ad4e8e8d2adc6c77d985f698447e8628b6010" + integrity sha512-EwaJS7RjoXUZ2cXXKZZxZqieGtc7RbvQhUy8FwDoMQtxWVi14tFjeFCYPZAM1mBCpOpiBpyaZbb9NeHc7eGKgw== + +"@hapi/joi@17.1.1", "@hapi/joi@^17.1.1": + version "17.1.1" + resolved "https://registry.yarnpkg.com/@hapi/joi/-/joi-17.1.1.tgz#9cc8d7e2c2213d1e46708c6260184b447c661350" + integrity sha512-p4DKeZAoeZW4g3u7ZeRo+vCDuSDgSvtsB/NpfjXEHTUjSeINAi/RrVOWiVQ1isaoLzMvFEhe8n5065mQq1AdQg== + dependencies: + "@hapi/address" "^4.0.1" + "@hapi/formula" "^2.0.0" + "@hapi/hoek" "^9.0.0" + "@hapi/pinpoint" "^2.0.0" + "@hapi/topo" "^5.0.0" + "@hapi/joi@^15.1.0": version "15.1.1" resolved "https://registry.yarnpkg.com/@hapi/joi/-/joi-15.1.1.tgz#c675b8a71296f02833f8d6d243b34c57b8ce19d7" @@ -1404,6 +1458,11 @@ "@hapi/hoek" "8.x.x" "@hapi/topo" "3.x.x" +"@hapi/pinpoint@^2.0.0": + version "2.0.0" + resolved "https://registry.yarnpkg.com/@hapi/pinpoint/-/pinpoint-2.0.0.tgz#805b40d4dbec04fc116a73089494e00f073de8df" + integrity sha512-vzXR5MY7n4XeIvLpfl3HtE3coZYO4raKXW766R6DZw/6aLqR26iuZ109K7a0NtF2Db0jxqh7xz2AxkUwpUFybw== + "@hapi/topo@3.x.x": version "3.1.6" resolved "https://registry.yarnpkg.com/@hapi/topo/-/topo-3.1.6.tgz#68d935fa3eae7fdd5ab0d7f953f3205d8b2bfc29" @@ -1411,40 +1470,47 @@ dependencies: "@hapi/hoek" "^8.3.0" +"@hapi/topo@^5.0.0": + version "5.0.0" + resolved "https://registry.yarnpkg.com/@hapi/topo/-/topo-5.0.0.tgz#c19af8577fa393a06e9c77b60995af959be721e7" + integrity sha512-tFJlT47db0kMqVm3H4nQYgn6Pwg10GTZHb1pwmSiv1K4ks6drQOtfEF5ZnPjkvC+y4/bUPHK+bc87QvLcL+WMw== + dependencies: + "@hapi/hoek" "^9.0.0" + "@mdx-js/mdx@^1.5.8": - version "1.6.4" - resolved "https://registry.yarnpkg.com/@mdx-js/mdx/-/mdx-1.6.4.tgz#9c7be8430b15b18dad7bd48323eded92a01089f3" - integrity sha512-TuKjwVrp0bhuv++SnqHp3k7agawS4d29sSL9p1B6Wv6IxJTfkJPMD1rI+Ahek45qTNY0Sxh4Q6kox9a7cq1tag== + version "1.6.16" + resolved "https://registry.yarnpkg.com/@mdx-js/mdx/-/mdx-1.6.16.tgz#f01af0140539c1ce043d246259d8becd2153b2bb" + integrity sha512-jnYyJ0aCafCIehn3GjYcibIapaLBgs3YkoenNQBPcPFyyuUty7B3B07OE+pMllhJ6YkWeP/R5Ax19x0nqTzgJw== dependencies: - "@babel/core" "7.9.6" - "@babel/plugin-syntax-jsx" "7.8.3" + "@babel/core" "7.10.5" + "@babel/plugin-syntax-jsx" "7.10.4" "@babel/plugin-syntax-object-rest-spread" "7.8.3" - "@mdx-js/util" "^1.6.4" - babel-plugin-apply-mdx-type-prop "^1.6.4" - babel-plugin-extract-import-names "^1.6.4" + "@mdx-js/util" "1.6.16" + babel-plugin-apply-mdx-type-prop "1.6.16" + babel-plugin-extract-import-names "1.6.16" camelcase-css "2.0.1" detab "2.0.3" - hast-util-raw "5.0.2" + hast-util-raw "6.0.0" lodash.uniq "4.5.0" mdast-util-to-hast "9.1.0" remark-footnotes "1.0.0" - remark-mdx "^1.6.4" - remark-parse "8.0.2" + remark-mdx "1.6.16" + remark-parse "8.0.3" remark-squeeze-paragraphs "4.0.0" style-to-object "0.3.0" - unified "9.0.0" + unified "9.1.0" unist-builder "2.0.3" - unist-util-visit "2.0.2" + unist-util-visit "2.0.3" "@mdx-js/react@^1.5.8": - version "1.6.4" - resolved "https://registry.yarnpkg.com/@mdx-js/react/-/react-1.6.4.tgz#5e867921a1f0cfcf4ee756630115f1565845b628" - integrity sha512-3SwDgbr2Fc3i5LrOQnahRUTvx0x/wRf+i8+fJM1caGTeq1XwVb6OHztJzaYt3DSizJVzRsBZznReY+l39up5Pg== + version "1.6.16" + resolved "https://registry.yarnpkg.com/@mdx-js/react/-/react-1.6.16.tgz#538eb14473194d0b3c54020cb230e426174315cd" + integrity sha512-+FhuSVOPo7+4fZaRwWuCSRUcZkJOkZu0rfAbBKvoCg1LWb1Td8Vzi0DTLORdSvgWNbU6+EL40HIgwTOs00x2Jw== -"@mdx-js/util@^1.6.4": - version "1.6.4" - resolved "https://registry.yarnpkg.com/@mdx-js/util/-/util-1.6.4.tgz#ae31e83f2ccb30f122457ee436a015d654ac3c12" - integrity sha512-cVGZ68yZwyJnOMhARAdgD1IhZ0bsbsKCvsj6I/XnJcT9hNV/8WXErSV98zFfZwH3LmSRPde58l9hln+zXdK/mQ== +"@mdx-js/util@1.6.16": + version "1.6.16" + resolved "https://registry.yarnpkg.com/@mdx-js/util/-/util-1.6.16.tgz#07a7342f6b61ea1ecbfb31e6e23bf7a8c79b9b57" + integrity sha512-SFtLGIGZummuyMDPRL5KdmpgI8U19Ble28UjEWihPjGxF1Lgj8aDjLWY8KiaUy9eqb9CKiVCqEIrK9jbnANfkw== "@mrmlnc/readdir-enhanced@^2.2.1": version "2.2.1" @@ -1480,6 +1546,11 @@ "@nodelib/fs.scandir" "2.1.3" fastq "^1.6.0" +"@sindresorhus/is@^0.14.0": + version "0.14.0" + resolved "https://registry.yarnpkg.com/@sindresorhus/is/-/is-0.14.0.tgz#9fb3a3cf3132328151f353de4632e01e52102bea" + integrity sha512-9NET910DNaIPngYnLLPeg+Ogzqsi9uM4mSboU5y6p8S5DzMTVEsJZrawi+BoDNUVBa2DhJqQYUFvMDfgU062LQ== + "@svgr/babel-plugin-add-jsx-attribute@^5.4.0": version "5.4.0" resolved "https://registry.yarnpkg.com/@svgr/babel-plugin-add-jsx-attribute/-/babel-plugin-add-jsx-attribute-5.4.0.tgz#81ef61947bb268eb9d50523446f9c638fb355906" @@ -1583,6 +1654,13 @@ "@svgr/plugin-svgo" "^5.4.0" loader-utils "^2.0.0" +"@szmarczak/http-timer@^1.1.2": + version "1.1.2" + resolved "https://registry.yarnpkg.com/@szmarczak/http-timer/-/http-timer-1.1.2.tgz#b1665e2c461a2cd92f4c1bbf50d5454de0d4b421" + integrity sha512-XIB2XbzHTN6ieIjfIMV9hlVcfPU26s2vafYWQcZHWXHOxiaRZYEDKEwdl129Zyg50+foYV2jCgtrqSA6qNuNSA== + dependencies: + defer-to-connect "^1.0.1" + "@types/anymatch@*": version "1.3.1" resolved "https://registry.yarnpkg.com/@types/anymatch/-/anymatch-1.3.1.tgz#336badc1beecb9dacc38bea2cf32adf627a8421a" @@ -1593,25 +1671,31 @@ resolved "https://registry.yarnpkg.com/@types/color-name/-/color-name-1.1.1.tgz#1c1261bbeaa10a8055bbc5d8ab84b7b2afc846a0" integrity sha512-rr+OQyAjxze7GgWrSaJwydHStIhHq2lvY3BOC2Mj7KnzI7XK0Uw1TOOdI9lDoajEbSWLiYgoo4f1R51erQfhPQ== -"@types/events@*": - version "3.0.0" - resolved "https://registry.yarnpkg.com/@types/events/-/events-3.0.0.tgz#2862f3f58a9a7f7c3e78d79f130dd4d71c25c2a7" - integrity sha512-EaObqwIvayI5a8dCzhFrjKzVwKLxjoG9T6Ppd5CEo07LRKfQ8Yokw54r5+Wq7FaBQ+yXRvQAYPrHwya1/UFt9g== - "@types/glob@^7.1.1": - version "7.1.1" - resolved "https://registry.yarnpkg.com/@types/glob/-/glob-7.1.1.tgz#aa59a1c6e3fbc421e07ccd31a944c30eba521575" - integrity sha512-1Bh06cbWJUHMC97acuD6UMG29nMt0Aqz1vF3guLfG+kHHJhy3AyohZFFxYk2f7Q1SQIrNwvncxAE0N/9s70F2w== + version "7.1.3" + resolved "https://registry.yarnpkg.com/@types/glob/-/glob-7.1.3.tgz#e6ba80f36b7daad2c685acd9266382e68985c183" + integrity sha512-SEYeGAIQIQX8NN6LDKprLjbrd5dARM5EXsd8GI/A5l0apYI1fGMWgPHSe4ZKL4eozlAyI+doUE9XbYS4xCkQ1w== dependencies: - "@types/events" "*" "@types/minimatch" "*" "@types/node" "*" +"@types/hast@^2.0.0": + version "2.3.1" + resolved "https://registry.yarnpkg.com/@types/hast/-/hast-2.3.1.tgz#b16872f2a6144c7025f296fb9636a667ebb79cd9" + integrity sha512-viwwrB+6xGzw+G1eWpF9geV3fnsDgXqHG+cqgiHrvQfDUW5hzhCyV7Sy3UJxhfRFBsgky2SSW33qi/YrIkjX5Q== + dependencies: + "@types/unist" "*" + "@types/html-minifier-terser@^5.0.0": version "5.1.0" resolved "https://registry.yarnpkg.com/@types/html-minifier-terser/-/html-minifier-terser-5.1.0.tgz#551a4589b6ee2cc9c1dff08056128aec29b94880" integrity sha512-iYCgjm1dGPRuo12+BStjd1HiVQqhlRhWDOQigNxn023HcjnhsiFz9pc6CzJj4HwDCSQca9bxTL4PxJDbkdm3PA== +"@types/json-schema@^7.0.4": + version "7.0.5" + resolved "https://registry.yarnpkg.com/@types/json-schema/-/json-schema-7.0.5.tgz#dcce4430e64b443ba8945f0290fb564ad5bac6dd" + integrity sha512-7+2BITlgjgDhH0vvwZU/HZJVyk+2XUlvxXe8dFMedNX/aMkaOq++rMAFXc0tM7ij15QaWlbdQASBR9dihi+bDQ== + "@types/mdast@^3.0.0": version "3.0.3" resolved "https://registry.yarnpkg.com/@types/mdast/-/mdast-3.0.3.tgz#2d7d671b1cd1ea3deb306ea75036c2a0407d2deb" @@ -1625,19 +1709,24 @@ integrity sha512-tHq6qdbT9U1IRSGf14CL0pUlULksvY9OZ+5eEgl1N7t+OA3tGvNpxJCzuKQlsNgCVwbAs670L1vcVQi8j9HjnA== "@types/node@*": - version "13.11.1" - resolved "https://registry.yarnpkg.com/@types/node/-/node-13.11.1.tgz#49a2a83df9d26daacead30d0ccc8762b128d53c7" - integrity sha512-eWQGP3qtxwL8FGneRrC5DwrJLGN4/dH1clNTuLfN81HCrxVtxRjygDTUoZJ5ASlDEeo0ppYFQjQIlXhtXpOn6g== + version "14.6.0" + resolved "https://registry.yarnpkg.com/@types/node/-/node-14.6.0.tgz#7d4411bf5157339337d7cff864d9ff45f177b499" + integrity sha512-mikldZQitV94akrc4sCcSjtJfsTKt4p+e/s0AGscVA6XArQ9kFclP+ZiYUMnq987rc6QlYxXv/EivqlfSLxpKA== "@types/parse-json@^4.0.0": version "4.0.0" resolved "https://registry.yarnpkg.com/@types/parse-json/-/parse-json-4.0.0.tgz#2f8bb441434d163b35fb8ffdccd7138927ffb8c0" integrity sha512-//oorEZjL6sbPcKUaCdIGlIUeH26mgzimjBB77G6XRgnDl/L5wOnpyBGRe/Mmf5CVW3PwEBE1NjiMZ/ssFh4wA== +"@types/parse5@^5.0.0": + version "5.0.3" + resolved "https://registry.yarnpkg.com/@types/parse5/-/parse5-5.0.3.tgz#e7b5aebbac150f8b5fdd4a46e7f0bd8e65e19109" + integrity sha512-kUNnecmtkunAoQ3CnjmMkzNU/gtxG8guhi+Fk2U/kOpIKjIMKnXGp4IJCgQJrXSgMsWYimYG4TGjz/UzbGEBTw== + "@types/q@^1.5.1": - version "1.5.2" - resolved "https://registry.yarnpkg.com/@types/q/-/q-1.5.2.tgz#690a1475b84f2a884fd07cd797c00f5f31356ea8" - integrity sha512-ce5d3q03Ex0sy4R14722Rmt6MT07Ua+k4FwDfdcToYJcMKNtRVQvJ6JCAPdAmAnbRb6CsX6aYb9m96NGod9uTw== + version "1.5.4" + resolved "https://registry.yarnpkg.com/@types/q/-/q-1.5.4.tgz#15925414e0ad2cd765bfef58842f7e26a7accb24" + integrity sha512-1HcDas8SEj4z1Wc696tH56G8OlRaH/sqZOynNNB+HF0WOeXPaxTtbYzJY2oEfiUxjSKjhCKr+MvR7dCHcEelug== "@types/source-list-map@*": version "0.1.2" @@ -1645,14 +1734,14 @@ integrity sha512-K5K+yml8LTo9bWJI/rECfIPrGgxdpeNbj+d53lwN4QjW1MCwlkhUms+gtdzigTeUyBr09+u8BwOIY3MXvHdcsA== "@types/tapable@*", "@types/tapable@^1.0.5": - version "1.0.5" - resolved "https://registry.yarnpkg.com/@types/tapable/-/tapable-1.0.5.tgz#9adbc12950582aa65ead76bffdf39fe0c27a3c02" - integrity sha512-/gG2M/Imw7cQFp8PGvz/SwocNrmKFjFsm5Pb8HdbHkZ1K8pmuPzOX4VeVoiEecFCVf4CsN1r3/BRvx+6sNqwtQ== + version "1.0.6" + resolved "https://registry.yarnpkg.com/@types/tapable/-/tapable-1.0.6.tgz#a9ca4b70a18b270ccb2bc0aaafefd1d486b7ea74" + integrity sha512-W+bw9ds02rAQaMvaLYxAbJ6cvguW/iJXNT6lTssS1ps6QdrMKttqEAMEG/b5CR8TZl3/L7/lH0ZV5nNR1LXikA== "@types/uglify-js@*": - version "3.9.2" - resolved "https://registry.yarnpkg.com/@types/uglify-js/-/uglify-js-3.9.2.tgz#01992579debba674e1e359cd6bcb1a1d0ab2e02b" - integrity sha512-d6dIfpPbF+8B7WiCi2ELY7m0w1joD8cRW4ms88Emdb2w062NeEpbNCeWwVCgzLRpVG+5e74VFSg4rgJ2xXjEiQ== + version "3.9.3" + resolved "https://registry.yarnpkg.com/@types/uglify-js/-/uglify-js-3.9.3.tgz#d94ed608e295bc5424c9600e6b8565407b6b4b6b" + integrity sha512-KswB5C7Kwduwjj04Ykz+AjvPcfgv/37Za24O2EDzYNbwyzOo8+ydtvzUfZ5UMguiVu29Gx44l1A6VsPPcmYu9w== dependencies: source-map "^0.6.1" @@ -1662,18 +1751,18 @@ integrity sha512-FvUupuM3rlRsRtCN+fDudtmytGO6iHJuuRKS1Ss0pG5z8oX0diNEw94UEL7hgDbpN94rgaK5R7sWm6RrSkZuAQ== "@types/webpack-sources@*": - version "0.1.7" - resolved "https://registry.yarnpkg.com/@types/webpack-sources/-/webpack-sources-0.1.7.tgz#0a330a9456113410c74a5d64180af0cbca007141" - integrity sha512-XyaHrJILjK1VHVC4aVlKsdNN5KBTwufMb43cQs+flGxtPAf/1Qwl8+Q0tp5BwEGaI8D6XT1L+9bSWXckgkjTLw== + version "1.4.2" + resolved "https://registry.yarnpkg.com/@types/webpack-sources/-/webpack-sources-1.4.2.tgz#5d3d4dea04008a779a90135ff96fb5c0c9e6292c" + integrity sha512-77T++JyKow4BQB/m9O96n9d/UUHWLQHlcqXb9Vsf4F1+wKNrrlWNFPDLKNT92RJnCSL6CieTc+NDXtCVZswdTw== dependencies: "@types/node" "*" "@types/source-list-map" "*" - source-map "^0.6.1" + source-map "^0.7.3" "@types/webpack@^4.41.0", "@types/webpack@^4.41.8": - version "4.41.13" - resolved "https://registry.yarnpkg.com/@types/webpack/-/webpack-4.41.13.tgz#988d114c8913d039b8a0e0502a7fe4f1f84f3d5e" - integrity sha512-RYmIHOWSxnTTa765N6jJBVE45pd2SYNblEYshVDduLw6RhocazNmRzE5/ytvBD8IkDMH6DI+bcrqxh8NILimBA== + version "4.41.21" + resolved "https://registry.yarnpkg.com/@types/webpack/-/webpack-4.41.21.tgz#cc685b332c33f153bb2f5fc1fa3ac8adeb592dee" + integrity sha512-2j9WVnNrr/8PLAB5csW44xzQSJwS26aOnICsP3pSGCEdsu6KYtfQ6QJsVUKHWRnm1bL7HziJsfh5fHqth87yKA== dependencies: "@types/anymatch" "*" "@types/node" "*" @@ -1837,11 +1926,6 @@ resolved "https://registry.yarnpkg.com/@xtuc/long/-/long-4.2.2.tgz#d291c6a4e97989b5c61d9acf396ae4fe133a718d" integrity sha512-NuHqBY1PB/D8xU6s/thBgOAiAP7HOYDQ32+BFZILJ8ivkUkAHQnWfn6WhL79Owj1qmUnoN/YPhktdIoucipkAQ== -abbrev@1: - version "1.1.1" - resolved "https://registry.yarnpkg.com/abbrev/-/abbrev-1.1.1.tgz#f8f2c887ad10bf67f634f005b6987fed3179aac8" - integrity sha512-nne9/IiQ/hzIhY6pdDnbBtz7DjPTKrY00P/zvPSm5pOFkl6xuGrGnXn/VtTNNfNtAfZ9/1RtehkszU9qcTii0Q== - accepts@~1.3.4, accepts@~1.3.5, accepts@~1.3.7: version "1.3.7" resolved "https://registry.yarnpkg.com/accepts/-/accepts-1.3.7.tgz#531bc726517a3b2b41f850021c6cc15eaab507cd" @@ -1851,9 +1935,9 @@ accepts@~1.3.4, accepts@~1.3.5, accepts@~1.3.7: negotiator "0.6.2" acorn-walk@^7.1.1: - version "7.1.1" - resolved "https://registry.yarnpkg.com/acorn-walk/-/acorn-walk-7.1.1.tgz#345f0dffad5c735e7373d2fec9a1023e6a44b83e" - integrity sha512-wdlPY2tm/9XBr7QkKlq0WQVgiuGTX6YWPyRyBviSoScBuLfTVQhvwg6wJ369GJ/1nPfTLMfnrFIfjqVg6d+jQQ== + version "7.2.0" + resolved "https://registry.yarnpkg.com/acorn-walk/-/acorn-walk-7.2.0.tgz#0de889a601203909b0fbe07b8938dc21d2e967bc" + integrity sha512-OPdCF6GsMIP+Az+aWfAAOEt2/+iVDKE7oy6lJ098aoe59oAmK76qV6Gw60SbZ8jHuG2wH058GF4pLFbYamYrVA== acorn@^6.4.1: version "6.4.1" @@ -1861,24 +1945,19 @@ acorn@^6.4.1: integrity sha512-ZVA9k326Nwrj3Cj9jlh3wGFutC2ZornPNARZwsNYqQYgN0EsV2d53w5RN/co65Ohn4sUAUtb1rSUAOD6XN9idA== acorn@^7.1.1: - version "7.2.0" - resolved "https://registry.yarnpkg.com/acorn/-/acorn-7.2.0.tgz#17ea7e40d7c8640ff54a694c889c26f31704effe" - integrity sha512-apwXVmYVpQ34m/i71vrApRrRKCWQnZZF1+npOD0WV5xZFfwWOmKGQ2RWlfdy9vWITsenisM8M0Qeq8agcFHNiQ== + version "7.4.0" + resolved "https://registry.yarnpkg.com/acorn/-/acorn-7.4.0.tgz#e1ad486e6c54501634c6c397c5c121daa383607c" + integrity sha512-+G7P8jJmCHr+S+cLfQxygbWhXy+8YTVGzAkpEbcLo2mLoL7tij/VG41QSHACSf5QgYRhMZYHuNc6drJaO0Da+w== address@1.1.2, address@^1.0.1: version "1.1.2" resolved "https://registry.yarnpkg.com/address/-/address-1.1.2.tgz#bf1116c9c758c51b7a933d296b72c221ed9428b6" integrity sha512-aT6camzM4xEA54YVJYSqxz1kv4IHnQZRtThJJHhUMRExaU5spC7jX5ugSwTaTgJliIgs4VhZOk7htClvQ/LmRA== -agentkeepalive@^2.2.0: - version "2.2.0" - resolved "https://registry.yarnpkg.com/agentkeepalive/-/agentkeepalive-2.2.0.tgz#c5d1bd4b129008f1163f236f86e5faea2026e2ef" - integrity sha1-xdG9SxKQCPEWPyNvhuX66iAm4u8= - aggregate-error@^3.0.0: - version "3.0.1" - resolved "https://registry.yarnpkg.com/aggregate-error/-/aggregate-error-3.0.1.tgz#db2fe7246e536f40d9b5442a39e117d7dd6a24e0" - integrity sha512-quoaXsZ9/BLNae5yiNoUz+Nhkwz83GhWwtYFglcjEQB2NDHCIpApbqXxIFnm4Pq/Nvhrsq5sYJFyohrrxnTGAA== + version "3.1.0" + resolved "https://registry.yarnpkg.com/aggregate-error/-/aggregate-error-3.1.0.tgz#92670ff50f5359bdb7a3e0d40d0ec30c5737687a" + integrity sha512-4I7Td01quW/RpocfNayFdFVk1qSuoh0E7JrbRJ16nH01HhKFQ88INq9Sd+nd72zqRySlr9BmDA8xlEJ6vJMrYA== dependencies: clean-stack "^2.0.0" indent-string "^4.0.0" @@ -1889,24 +1968,14 @@ ajv-errors@^1.0.0: integrity sha512-DCRfO/4nQ+89p/RK43i8Ezd41EqdGIU4ld7nGF8OQ14oc/we5rEntLCUa7+jrn3nn83BosfwZA0wb4pon2o8iQ== ajv-keywords@^3.1.0, ajv-keywords@^3.4.1: - version "3.4.1" - resolved "https://registry.yarnpkg.com/ajv-keywords/-/ajv-keywords-3.4.1.tgz#ef916e271c64ac12171fd8384eaae6b2345854da" - integrity sha512-RO1ibKvd27e6FEShVFfPALuHI3WjSVNeK5FIsmme/LYRNxjKuNj+Dt7bucLa6NdSv3JcVTyMlm9kGR84z1XpaQ== - -ajv@^6.1.0, ajv@^6.10.2, ajv@^6.12.0: - version "6.12.2" - resolved "https://registry.yarnpkg.com/ajv/-/ajv-6.12.2.tgz#c629c5eced17baf314437918d2da88c99d5958cd" - integrity sha512-k+V+hzjm5q/Mr8ef/1Y9goCmlsK4I6Sm74teeyGvFk1XrOsbsKLjEdrvny42CZ+a8sXbk8KWpY/bDwS+FLL2UQ== - dependencies: - fast-deep-equal "^3.1.1" - fast-json-stable-stringify "^2.0.0" - json-schema-traverse "^0.4.1" - uri-js "^4.2.2" + version "3.5.2" + resolved "https://registry.yarnpkg.com/ajv-keywords/-/ajv-keywords-3.5.2.tgz#31f29da5ab6e00d1c2d329acf7b5929614d5014d" + integrity sha512-5p6WTN0DdTGVQk6VjcEju19IgaHudalcfabD7yhDGeA6bcQnmL+CpveLJq/3hvfwd1aof6L386Ougkx6RfyMIQ== -ajv@^6.5.5: - version "6.12.0" - resolved "https://registry.yarnpkg.com/ajv/-/ajv-6.12.0.tgz#06d60b96d87b8454a5adaba86e7854da629db4b7" - integrity sha512-D6gFiFA0RRLyUbvijN74DWAjXSFxWKaWP7mldxkVhyhAV3+SWA9HEJPHQ2c9soIeTFJqcSdFDGFgdqs1iUU2Hw== +ajv@^6.1.0, ajv@^6.10.2, ajv@^6.12.2: + version "6.12.4" + resolved "https://registry.yarnpkg.com/ajv/-/ajv-6.12.4.tgz#0614facc4522127fa713445c6bfd3ebd376e2234" + integrity sha512-eienB2c9qVQs2KWexhkrdMLVDoIQCz5KSeLxwg9Lzk4DOfBtIK9PQwwufcsn1jjGuf9WZmqPMbGxOzfcuphJCQ== dependencies: fast-deep-equal "^3.1.1" fast-json-stable-stringify "^2.0.0" @@ -1914,38 +1983,44 @@ ajv@^6.5.5: uri-js "^4.2.2" algoliasearch-helper@^3.1.1: - version "3.1.1" - resolved "https://registry.yarnpkg.com/algoliasearch-helper/-/algoliasearch-helper-3.1.1.tgz#4cdfbaed6670d82626ac1fae001ccbf53192f497" - integrity sha512-Jkqlp8jezQRixf7sbQ2zFXHpdaT41g9sHBqT6pztv5nfDmg94K+pwesAy6UbxRY78IL54LIaV1FLttMtT+IzzA== + version "3.2.2" + resolved "https://registry.yarnpkg.com/algoliasearch-helper/-/algoliasearch-helper-3.2.2.tgz#12451c8e368935348453c8879785b20e1788c33c" + integrity sha512-/3XvE33R+gQKaiPdy3nmHYqhF8hqIu8xnlOicVxb1fD6uMFmxW8rGLzzrRfsPfxgAfm+c1NslLb3TzQVIB8aVA== dependencies: events "^1.1.1" -algoliasearch@^3.24.5: - version "3.35.1" - resolved "https://registry.yarnpkg.com/algoliasearch/-/algoliasearch-3.35.1.tgz#297d15f534a3507cab2f5dfb996019cac7568f0c" - integrity sha512-K4yKVhaHkXfJ/xcUnil04xiSrB8B8yHZoFEhWNpXg23eiCnqvTZw1tn/SqvdsANlYHLJlKl0qi3I/Q2Sqo7LwQ== - dependencies: - agentkeepalive "^2.2.0" - debug "^2.6.9" - envify "^4.0.0" - es6-promise "^4.1.0" - events "^1.1.0" - foreach "^2.0.5" - global "^4.3.2" - inherits "^2.0.1" - isarray "^2.0.1" - load-script "^1.0.0" - object-keys "^1.0.11" - querystring-es3 "^0.2.1" - reduce "^1.0.1" - semver "^5.1.0" - tunnel-agent "^0.6.0" +algoliasearch@^4.0.0: + version "4.4.0" + resolved "https://registry.yarnpkg.com/algoliasearch/-/algoliasearch-4.4.0.tgz#25c356d8bdcf7e3f941633f61e1ac111ddcba404" + integrity sha512-Ag3wxe/nSodNl/1KbHibtkh7TNLptKE300/wnGVtszRjXivaWD6333nUpCumrYObHym/fHMHyLcmQYezXbAIWQ== + dependencies: + "@algolia/cache-browser-local-storage" "4.4.0" + "@algolia/cache-common" "4.4.0" + "@algolia/cache-in-memory" "4.4.0" + "@algolia/client-account" "4.4.0" + "@algolia/client-analytics" "4.4.0" + "@algolia/client-common" "4.4.0" + "@algolia/client-recommendation" "4.4.0" + "@algolia/client-search" "4.4.0" + "@algolia/logger-common" "4.4.0" + "@algolia/logger-console" "4.4.0" + "@algolia/requester-browser-xhr" "4.4.0" + "@algolia/requester-common" "4.4.0" + "@algolia/requester-node-http" "4.4.0" + "@algolia/transporter" "4.4.0" alphanum-sort@^1.0.0: version "1.0.2" resolved "https://registry.yarnpkg.com/alphanum-sort/-/alphanum-sort-1.0.2.tgz#97a1119649b211ad33691d9f9f486a8ec9fbe0a3" integrity sha1-l6ERlkmyEa0zaR2fn0hqjsn74KM= +ansi-align@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/ansi-align/-/ansi-align-3.0.0.tgz#b536b371cf687caaef236c18d3e21fe3797467cb" + integrity sha512-ZpClVKqXN3RGBmKibdfWzqCY4lnjEuoNzU5T0oEFpfd/z5qJHVarukridD4juLO2FXMiwUQxr9WqQtaYa8XRYw== + dependencies: + string-width "^3.0.0" + ansi-colors@^3.0.0: version "3.2.4" resolved "https://registry.yarnpkg.com/ansi-colors/-/ansi-colors-3.2.4.tgz#e3a3da4bfbae6c86a9c285625de124a234026fbf" @@ -2078,26 +2153,15 @@ arrify@^1.0.1: resolved "https://registry.yarnpkg.com/arrify/-/arrify-1.0.1.tgz#898508da2226f380df904728456849c1501a4b0d" integrity sha1-iYUI2iIm84DfkEcoRWhJwVAaSw0= -asn1.js@^4.0.0: - version "4.10.1" - resolved "https://registry.yarnpkg.com/asn1.js/-/asn1.js-4.10.1.tgz#b9c2bf5805f1e64aadeed6df3a2bfafb5a73f5a0" - integrity sha512-p32cOF5q0Zqs9uBiONKYLm6BClCoBCM5O9JfeUSlnQLBTxYdTK+pW+nXflm8UkKd2UYlEbYz5qEi0JuZR9ckSw== +asn1.js@^5.2.0: + version "5.4.1" + resolved "https://registry.yarnpkg.com/asn1.js/-/asn1.js-5.4.1.tgz#11a980b84ebb91781ce35b0fdc2ee294e3783f07" + integrity sha512-+I//4cYPccV8LdmBLiX8CYvf9Sp3vQsrqu2QNXRcrbiWvcx/UdlFiqUJJzxRQxgsZmvhXhn4cSKeSmoFjVdupA== dependencies: bn.js "^4.0.0" inherits "^2.0.1" minimalistic-assert "^1.0.0" - -asn1@~0.2.3: - version "0.2.4" - resolved "https://registry.yarnpkg.com/asn1/-/asn1-0.2.4.tgz#8d2475dfab553bb33e77b54e59e880bb8ce23136" - integrity sha512-jxwzQpLQjSmWXgwaCZE9Nz+glAG01yF1QnWgbhGwHI5A6FRIEY6IVqtHhIepHqI7/kyEyQEagBC5mBEFlIYvdg== - dependencies: - safer-buffer "~2.1.0" - -assert-plus@1.0.0, assert-plus@^1.0.0: - version "1.0.0" - resolved "https://registry.yarnpkg.com/assert-plus/-/assert-plus-1.0.0.tgz#f12e0f3c5d77b0b1cdd9146942e4e96c1e4dd525" - integrity sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU= + safer-buffer "^2.1.0" assert@^1.1.1: version "1.5.0" @@ -2129,46 +2193,24 @@ async@^2.6.2: dependencies: lodash "^4.17.14" -asynckit@^0.4.0: - version "0.4.0" - resolved "https://registry.yarnpkg.com/asynckit/-/asynckit-0.4.0.tgz#c79ed97f7f34cb8f2ba1bc9790bcc366474b4b79" - integrity sha1-x57Zf380y48robyXkLzDZkdLS3k= - atob@^2.1.2: version "2.1.2" resolved "https://registry.yarnpkg.com/atob/-/atob-2.1.2.tgz#6d9517eb9e030d2436666651e86bd9f6f13533c9" integrity sha512-Wm6ukoaOGJi/73p/cl2GvLjTI5JM1k/O14isD73YML8StrH/7/lRFgmg8nICZgD3bZZvjwCGxtMOD3wWNAu8cg== -autocomplete.js@0.36.0: - version "0.36.0" - resolved "https://registry.yarnpkg.com/autocomplete.js/-/autocomplete.js-0.36.0.tgz#94fe775fe64b6cd42e622d076dc7fd26bedd837b" - integrity sha512-jEwUXnVMeCHHutUt10i/8ZiRaCb0Wo+ZyKxeGsYwBDtw6EJHqEeDrq4UwZRD8YBSvp3g6klP678il2eeiVXN2Q== - dependencies: - immediate "^3.2.3" - autoprefixer@^9.6.1: - version "9.8.0" - resolved "https://registry.yarnpkg.com/autoprefixer/-/autoprefixer-9.8.0.tgz#68e2d2bef7ba4c3a65436f662d0a56a741e56511" - integrity sha512-D96ZiIHXbDmU02dBaemyAg53ez+6F5yZmapmgKcjm35yEe1uVDYI8hGW3VYoGRaG290ZFf91YxHrR518vC0u/A== + version "9.8.6" + resolved "https://registry.yarnpkg.com/autoprefixer/-/autoprefixer-9.8.6.tgz#3b73594ca1bf9266320c5acf1588d74dea74210f" + integrity sha512-XrvP4VVHdRBCdX1S3WXVD8+RyG9qeb1D5Sn1DeLiG2xfSpzellk5k54xbUERJ3M5DggQxes39UGOTP8CFrEGbg== dependencies: browserslist "^4.12.0" - caniuse-lite "^1.0.30001061" - chalk "^2.4.2" + caniuse-lite "^1.0.30001109" + colorette "^1.2.1" normalize-range "^0.1.2" num2fraction "^1.2.2" - postcss "^7.0.30" + postcss "^7.0.32" postcss-value-parser "^4.1.0" -aws-sign2@~0.7.0: - version "0.7.0" - resolved "https://registry.yarnpkg.com/aws-sign2/-/aws-sign2-0.7.0.tgz#b46e890934a9591f2d2f6f86d7e6a9f1b3fe76a8" - integrity sha1-tG6JCTSpWR8tL2+G1+ap8bP+dqg= - -aws4@^1.8.0: - version "1.9.1" - resolved "https://registry.yarnpkg.com/aws4/-/aws4-1.9.1.tgz#7e33d8f7d449b3f673cd72deb9abdc552dbe528e" - integrity sha512-wMHVg2EOHaMRxbzgFJ9gtjOOCrI80OHLG14rxi28XwOW8ux6IiEbRCGGGqCtdAIg4FQCbW20k9RsT4y3gJlFug== - babel-code-frame@^6.22.0: version "6.26.0" resolved "https://registry.yarnpkg.com/babel-code-frame/-/babel-code-frame-6.26.0.tgz#63fd43f7dc1e3bb7ce35947db8fe369a3f58c74b" @@ -2189,34 +2231,27 @@ babel-loader@^8.1.0: pify "^4.0.1" schema-utils "^2.6.5" -babel-plugin-apply-mdx-type-prop@^1.6.4: - version "1.6.4" - resolved "https://registry.yarnpkg.com/babel-plugin-apply-mdx-type-prop/-/babel-plugin-apply-mdx-type-prop-1.6.4.tgz#3336529fb1f5b97811449d995b82d13230878eb5" - integrity sha512-rVtztbgf3zmT1Is6vSNugfbdI2AG3mk/PUS8H71ss5V2XRNyYgeuFgTMX3h0bTDEJnbFG3ilRH566kVhZAkGWg== +babel-plugin-apply-mdx-type-prop@1.6.16: + version "1.6.16" + resolved "https://registry.yarnpkg.com/babel-plugin-apply-mdx-type-prop/-/babel-plugin-apply-mdx-type-prop-1.6.16.tgz#4becd65b3aa108f15c524a0b125ca7c81f3443d8" + integrity sha512-hjUd24Yhnr5NKtHpC2mcRBGjC6RUKGzSzjN9g5SdjT4WpL/JDlpmjyBf7vWsJJSXFvMIbzRyxF4lT9ukwOnj/w== dependencies: - "@babel/helper-plugin-utils" "7.8.3" - "@mdx-js/util" "^1.6.4" + "@babel/helper-plugin-utils" "7.10.4" + "@mdx-js/util" "1.6.16" -babel-plugin-dynamic-import-node@^2.3.0: - version "2.3.0" - resolved "https://registry.yarnpkg.com/babel-plugin-dynamic-import-node/-/babel-plugin-dynamic-import-node-2.3.0.tgz#f00f507bdaa3c3e3ff6e7e5e98d90a7acab96f7f" - integrity sha512-o6qFkpeQEBxcqt0XYlWzAVxNCSCZdUgcR8IRlhD/8DylxjjO4foPcvTW0GGKa/cVt3rvxZ7o5ippJ+/0nvLhlQ== - dependencies: - object.assign "^4.1.0" - -babel-plugin-dynamic-import-node@^2.3.3: +babel-plugin-dynamic-import-node@^2.3.0, babel-plugin-dynamic-import-node@^2.3.3: version "2.3.3" resolved "https://registry.yarnpkg.com/babel-plugin-dynamic-import-node/-/babel-plugin-dynamic-import-node-2.3.3.tgz#84fda19c976ec5c6defef57f9427b3def66e17a3" integrity sha512-jZVI+s9Zg3IqA/kdi0i6UDCybUI3aSBLnglhYbSSjKlV7yF1F/5LWv8MakQmvYpnbJDS6fcBL2KzHSxNCMtWSQ== dependencies: object.assign "^4.1.0" -babel-plugin-extract-import-names@^1.6.4: - version "1.6.4" - resolved "https://registry.yarnpkg.com/babel-plugin-extract-import-names/-/babel-plugin-extract-import-names-1.6.4.tgz#c38e50a2027df72cd9a960227243f528c4051956" - integrity sha512-oShDRQX9CGDkg61DnNJG7T/ROjIpgzyLTi3mGr3fwbNDP3kiJ6TousEPu6d090qNUm/XiUasQ1ESOnLAb7plqQ== +babel-plugin-extract-import-names@1.6.16: + version "1.6.16" + resolved "https://registry.yarnpkg.com/babel-plugin-extract-import-names/-/babel-plugin-extract-import-names-1.6.16.tgz#b964004e794bdd62534c525db67d9e890d5cc079" + integrity sha512-Da6Ra0sbA/1Iavli8LdMbTjyrsOPaxMm4lrKl8VJN4sJI5F64qy2EpLj3+5INLvNPfW4ddwpStbfP3Rf3jIgcw== dependencies: - "@babel/helper-plugin-utils" "7.8.3" + "@babel/helper-plugin-utils" "7.10.4" bail@^1.0.0: version "1.0.5" @@ -2251,13 +2286,6 @@ batch@0.6.1: resolved "https://registry.yarnpkg.com/batch/-/batch-0.6.1.tgz#dc34314f4e679318093fc760272525f94bf25c16" integrity sha1-3DQxT05nkxgJP8dgJyUl+UvyXBY= -bcrypt-pbkdf@^1.0.0: - version "1.0.2" - resolved "https://registry.yarnpkg.com/bcrypt-pbkdf/-/bcrypt-pbkdf-1.0.2.tgz#a4301d389b6a43f9b67ff3ca11a3f6637e360e9e" - integrity sha1-pDAdOJtqQ/m2f/PKEaP2Y342Dp4= - dependencies: - tweetnacl "^0.14.3" - bfj@^6.1.1: version "6.1.2" resolved "https://registry.yarnpkg.com/bfj/-/bfj-6.1.2.tgz#325c861a822bcb358a41c78a33b8e6e2086dde7f" @@ -2279,9 +2307,9 @@ binary-extensions@^1.0.0: integrity sha512-Un7MIEDdUC5gNpcGDV97op1Ywk748MpHcFTHoYs6qnj1Z3j7I53VG3nwZhKzoBZmbdRNnb6WRdFlwl7tSDuZGw== binary-extensions@^2.0.0: - version "2.0.0" - resolved "https://registry.yarnpkg.com/binary-extensions/-/binary-extensions-2.0.0.tgz#23c0df14f6a88077f5f986c0d167ec03c3d5537c" - integrity sha512-Phlt0plgpIIBOGTT/ehfFnbNlfsDEiqmzE2KRXoX1bLIlir4X/MR+zSyBEkL05ffWgnRSf/DXv+WrUAVr93/ow== + version "2.1.0" + resolved "https://registry.yarnpkg.com/binary-extensions/-/binary-extensions-2.1.0.tgz#30fa40c9e7fe07dbc895678cd287024dea241dd9" + integrity sha512-1Yj8h9Q+QDF5FzhMs/c9+6UntbD5MkRfRwac8DoEm9ZfUBZ7tZ55YcGVAzEe4bXsdQHEk+s9S5wsOKVdZrw0tQ== bindings@^1.5.0: version "1.5.0" @@ -2301,9 +2329,9 @@ bn.js@^4.0.0, bn.js@^4.1.0, bn.js@^4.4.0: integrity sha512-E6QoYqCKZfgatHTdHzs1RRKP7ip4vvm+EyRUeE2RF0NblwVvb0p6jSVeNTOFxPn26QXN2o6SMfNxKp6kU8zQaw== bn.js@^5.1.1: - version "5.1.2" - resolved "https://registry.yarnpkg.com/bn.js/-/bn.js-5.1.2.tgz#c9686902d3c9a27729f43ab10f9d79c2004da7b0" - integrity sha512-40rZaf3bUNKTVYu9sIeeEGOg7g14Yvnj9kH7b50EiwX0Q7A6umbvfI5tvHaOERH0XigqKkfLkFQxzb4e6CIXnA== + version "5.1.3" + resolved "https://registry.yarnpkg.com/bn.js/-/bn.js-5.1.3.tgz#beca005408f642ebebea80b042b4d18d2ac0ee6b" + integrity sha512-GkTiFpjFtUzU9CbMeJ5iazkCzGL3jrhzerzZIuqLABjbwRaFt33I9tUdSNryIptM+RxDet6OKm2WnLXzW51KsQ== body-parser@1.19.0: version "1.19.0" @@ -2338,6 +2366,20 @@ boolbase@^1.0.0, boolbase@~1.0.0: resolved "https://registry.yarnpkg.com/boolbase/-/boolbase-1.0.0.tgz#68dff5fbe60c51eb37725ea9e3ed310dcc1e776e" integrity sha1-aN/1++YMUes3cl6p4+0xDcwed24= +boxen@^4.2.0: + version "4.2.0" + resolved "https://registry.yarnpkg.com/boxen/-/boxen-4.2.0.tgz#e411b62357d6d6d36587c8ac3d5d974daa070e64" + integrity sha512-eB4uT9RGzg2odpER62bBwSLvUeGC+WbRjjyyFhGsKnc8wp/m0+hQsMUvUe3H2V0D5vw0nBdO1hCJoZo5mKeuIQ== + dependencies: + ansi-align "^3.0.0" + camelcase "^5.3.1" + chalk "^3.0.0" + cli-boxes "^2.2.0" + string-width "^4.1.0" + term-size "^2.1.0" + type-fest "^0.8.1" + widest-line "^3.1.0" + brace-expansion@^1.1.7: version "1.1.11" resolved "https://registry.yarnpkg.com/brace-expansion/-/brace-expansion-1.1.11.tgz#3c7fcbf529d87226f3d2f52b966ff5271eb441dd" @@ -2414,15 +2456,15 @@ browserify-rsa@^4.0.0, browserify-rsa@^4.0.1: randombytes "^2.0.1" browserify-sign@^4.0.0: - version "4.2.0" - resolved "https://registry.yarnpkg.com/browserify-sign/-/browserify-sign-4.2.0.tgz#545d0b1b07e6b2c99211082bf1b12cce7a0b0e11" - integrity sha512-hEZC1KEeYuoHRqhGhTy6gWrpJA3ZDjFWv0DE61643ZnOXAKJb3u7yWcrU0mMc9SwAqK1n7myPGndkp0dFG7NFA== + version "4.2.1" + resolved "https://registry.yarnpkg.com/browserify-sign/-/browserify-sign-4.2.1.tgz#eaf4add46dd54be3bb3b36c0cf15abbeba7956c3" + integrity sha512-/vrA5fguVAKKAVTNJjgSm1tRQDHUU6DbwO9IROu/0WAzC8PKhucDSh18J0RMvVeHAn5puMd+QHC2erPRNf8lmg== dependencies: bn.js "^5.1.1" browserify-rsa "^4.0.1" create-hash "^1.2.0" create-hmac "^1.1.7" - elliptic "^6.5.2" + elliptic "^6.5.3" inherits "^2.0.4" parse-asn1 "^5.1.5" readable-stream "^3.6.0" @@ -2445,25 +2487,15 @@ browserslist@4.10.0: node-releases "^1.1.52" pkg-up "^3.1.0" -browserslist@^4.0.0, browserslist@^4.8.3: - version "4.11.1" - resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.11.1.tgz#92f855ee88d6e050e7e7311d987992014f1a1f1b" - integrity sha512-DCTr3kDrKEYNw6Jb9HFxVLQNaue8z+0ZfRBRjmCunKDEXEBajKDj2Y+Uelg+Pi29OnvaSGwjOsnRyNEkXzHg5g== - dependencies: - caniuse-lite "^1.0.30001038" - electron-to-chromium "^1.3.390" - node-releases "^1.1.53" - pkg-up "^2.0.0" - -browserslist@^4.12.0, browserslist@^4.6.4: - version "4.12.0" - resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.12.0.tgz#06c6d5715a1ede6c51fc39ff67fd647f740b656d" - integrity sha512-UH2GkcEDSI0k/lRkuDSzFl9ZZ87skSy9w2XAn1MsZnL+4c4rqbBd3e82UWHbYDpztABrPBhZsTEeuxVfHppqDg== +browserslist@^4.0.0, browserslist@^4.12.0, browserslist@^4.6.4, browserslist@^4.8.5: + version "4.14.0" + resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.14.0.tgz#2908951abfe4ec98737b72f34c3bcedc8d43b000" + integrity sha512-pUsXKAF2lVwhmtpeA3LJrZ76jXuusrNyhduuQs7CDFf9foT4Y38aQOserd2lMe5DSSrjf3fx34oHwryuvxAUgQ== dependencies: - caniuse-lite "^1.0.30001043" - electron-to-chromium "^1.3.413" - node-releases "^1.1.53" - pkg-up "^2.0.0" + caniuse-lite "^1.0.30001111" + electron-to-chromium "^1.3.523" + escalade "^3.0.2" + node-releases "^1.1.60" buffer-from@^1.0.0: version "1.1.1" @@ -2581,6 +2613,19 @@ cache-loader@^4.1.0: neo-async "^2.6.1" schema-utils "^2.0.0" +cacheable-request@^6.0.0: + version "6.1.0" + resolved "https://registry.yarnpkg.com/cacheable-request/-/cacheable-request-6.1.0.tgz#20ffb8bd162ba4be11e9567d823db651052ca912" + integrity sha512-Oj3cAGPCqOZX7Rz64Uny2GYAZNliQSqfbePrgAQ1wKAihYmCUnraBtJtKcGR4xz7wF+LoJC+ssFZvv5BgF9Igg== + dependencies: + clone-response "^1.0.2" + get-stream "^5.1.0" + http-cache-semantics "^4.0.0" + keyv "^3.0.0" + lowercase-keys "^2.0.0" + normalize-url "^4.1.0" + responselike "^1.0.2" + call-me-maybe@^1.0.1: version "1.0.1" resolved "https://registry.yarnpkg.com/call-me-maybe/-/call-me-maybe-1.0.1.tgz#26d208ea89e37b5cbde60250a15f031c16a4d66b" @@ -2643,20 +2688,10 @@ caniuse-api@^3.0.0: lodash.memoize "^4.1.2" lodash.uniq "^4.5.0" -caniuse-lite@^1.0.0, caniuse-lite@^1.0.30001038: - version "1.0.30001040" - resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001040.tgz#103fc8e6eb1d7397e95134cd0e996743353d58ea" - integrity sha512-Ep0tEPeI5wCvmJNrXjE3etgfI+lkl1fTDU6Y3ZH1mhrjkPlVI9W4pcKbMo+BQLpEWKVYYp2EmYaRsqpPC3k7lQ== - -caniuse-lite@^1.0.30000981, caniuse-lite@^1.0.30001035, caniuse-lite@^1.0.30001043, caniuse-lite@^1.0.30001061: - version "1.0.30001066" - resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001066.tgz#0a8a58a10108f2b9bf38e7b65c237b12fd9c5f04" - integrity sha512-Gfj/WAastBtfxLws0RCh2sDbTK/8rJuSeZMecrSkNGYxPcv7EzblmDGfWQCFEQcSqYE2BRgQiJh8HOD07N5hIw== - -caseless@~0.12.0: - version "0.12.0" - resolved "https://registry.yarnpkg.com/caseless/-/caseless-0.12.0.tgz#1b681c21ff84033c826543090689420d187151dc" - integrity sha1-G2gcIf+EAzyCZUMJBolCDRhxUdw= +caniuse-lite@^1.0.0, caniuse-lite@^1.0.30000981, caniuse-lite@^1.0.30001035, caniuse-lite@^1.0.30001109, caniuse-lite@^1.0.30001111: + version "1.0.30001117" + resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001117.tgz#69a9fae5d480eaa9589f7641a83842ad396d17c4" + integrity sha512-4tY0Fatzdx59kYjQs+bNxUwZB03ZEBgVmJ1UkFPz/Q8OLiUUbjct2EdpnXj0fvFTPej2EkbPIG0w8BWsjAyk1Q== ccount@^1.0.0, ccount@^1.0.3: version "1.0.5" @@ -2691,6 +2726,14 @@ chalk@^3.0.0: ansi-styles "^4.1.0" supports-color "^7.1.0" +chalk@^4.1.0: + version "4.1.0" + resolved "https://registry.yarnpkg.com/chalk/-/chalk-4.1.0.tgz#4e14870a618d9e2edd97dd8345fd9d9dc315646a" + integrity sha512-qwx12AxXe2Q5xQ43Ac//I6v5aXTipYrSESdOgzrN+9XjgEpyjpKuvSGaN4qE93f7TQTlerQQ8S+EQ0EyDoVL1A== + dependencies: + ansi-styles "^4.1.0" + supports-color "^7.1.0" + character-entities-legacy@^1.0.0: version "1.1.4" resolved "https://registry.yarnpkg.com/character-entities-legacy/-/character-entities-legacy-1.1.4.tgz#94bc1845dce70a5bb9d2ecc748725661293d8fc1" @@ -2757,10 +2800,10 @@ chokidar@^2.1.8: optionalDependencies: fsevents "^1.2.7" -chokidar@^3.3.0, chokidar@^3.4.0: - version "3.4.0" - resolved "https://registry.yarnpkg.com/chokidar/-/chokidar-3.4.0.tgz#b30611423ce376357c765b9b8f904b9fba3c0be8" - integrity sha512-aXAaho2VJtisB/1fg1+3nlLJqGOuewTzQpd/Tz0yTg2R0e4IGtshYvtjowyEumcBv2z+y4+kc75Mz7j5xJskcQ== +chokidar@^3.3.0, chokidar@^3.4.1: + version "3.4.2" + resolved "https://registry.yarnpkg.com/chokidar/-/chokidar-3.4.2.tgz#38dc8e658dec3809741eb3ef7bb0a47fe424232d" + integrity sha512-IZHaDeBeI+sZJRX7lGcXsdzgvZqKv6sECqsbErJA4mHWfpRrD8B97kSFN4cQz6nGBGiuFia1MKR4d6c1o8Cv7A== dependencies: anymatch "~3.1.1" braces "~3.0.2" @@ -2789,6 +2832,11 @@ ci-info@^1.6.0: resolved "https://registry.yarnpkg.com/ci-info/-/ci-info-1.6.0.tgz#2ca20dbb9ceb32d4524a683303313f0304b1e497" integrity sha512-vsGdkwSCDpWmP80ncATX7iea5DWQemg1UgCW5J8tqjU3lYw4FBYuj89J0CTVomA7BEfvSZd84GmHko+MxFQU2A== +ci-info@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/ci-info/-/ci-info-2.0.0.tgz#67a9e964be31a51e15e5010d58e6f12834002f46" + integrity sha512-5tK7EtrZ0N+OLFMthtqOj4fI2Jeb88C4CAZPu25LDVUgXJ0A3Js4PMGqrn0JU1W0Mh1/Z8wZzYPxqUrXeBboCQ== + cipher-base@^1.0.0, cipher-base@^1.0.1, cipher-base@^1.0.3: version "1.0.4" resolved "https://registry.yarnpkg.com/cipher-base/-/cipher-base-1.0.4.tgz#8760e4ecc272f4c363532f926d874aae2c1397de" @@ -2824,6 +2872,11 @@ clean-stack@^2.0.0: resolved "https://registry.yarnpkg.com/clean-stack/-/clean-stack-2.2.0.tgz#ee8472dbb129e727b31e8a10a427dee9dfe4008b" integrity sha512-4diC9HaTE+KRAMWhDhrGOECgWZxoevMc5TlkObMqNSsVU62PYzXZ/SMTjzyGAFF1YusgxGcSWTEXBhp0CPwQ1A== +cli-boxes@^2.2.0: + version "2.2.0" + resolved "https://registry.yarnpkg.com/cli-boxes/-/cli-boxes-2.2.0.tgz#538ecae8f9c6ca508e3c3c95b453fe93cb4c168d" + integrity sha512-gpaBrMAizVEANOpfZp/EEUixTXDyGt7DFzdK5hU+UbWt/J0lB0w20ncZj59Z9a93xHb9u12zF5BS6i9RKbtg4w== + cli-cursor@^3.1.0: version "3.1.0" resolved "https://registry.yarnpkg.com/cli-cursor/-/cli-cursor-3.1.0.tgz#264305a7ae490d1d03bf0c9ba7c925d1753af307" @@ -2832,11 +2885,16 @@ cli-cursor@^3.1.0: restore-cursor "^3.1.0" cli-width@^2.0.0: - version "2.2.0" - resolved "https://registry.yarnpkg.com/cli-width/-/cli-width-2.2.0.tgz#ff19ede8a9a5e579324147b0c11f0fbcbabed639" - integrity sha1-/xnt6Kml5XkyQUewwR8PvLq+1jk= + version "2.2.1" + resolved "https://registry.yarnpkg.com/cli-width/-/cli-width-2.2.1.tgz#b0433d0b4e9c847ef18868a4ef16fd5fc8271c48" + integrity sha512-GRMWDxpOB6Dgk2E5Uo+3eEBvtOOlimMmpbFiKuLFnQzYDavtLFY3K5ona41jgN/WdRZtG7utuVSVTL4HbZHGkw== + +cli-width@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/cli-width/-/cli-width-3.0.0.tgz#a2f48437a2caa9a22436e794bf071ec9e61cedf6" + integrity sha512-FxqpkPPwu1HjuN93Omfm4h8uIanXofW0RxVEW3k5RKx+mJJYSthzNhp32Kzxxy3YAEZ/Dc/EWN1vZRY0+kOhbw== -clipboard@^2.0.0, clipboard@^2.0.6: +clipboard@^2.0.0: version "2.0.6" resolved "https://registry.yarnpkg.com/clipboard/-/clipboard-2.0.6.tgz#52921296eec0fdf77ead1749421b21c968647376" integrity sha512-g5zbiixBRk/wyKakSwCKd7vQXDjFnAMGHoEyBogG/bw9kTD9GvdAvaoRR1ALcEzt3pVKxZR0pViekPMIS0QyGg== @@ -2865,6 +2923,18 @@ clone-deep@^0.2.4: lazy-cache "^1.0.3" shallow-clone "^0.1.2" +clone-response@^1.0.2: + version "1.0.2" + resolved "https://registry.yarnpkg.com/clone-response/-/clone-response-1.0.2.tgz#d1dc973920314df67fbeb94223b4ee350239e96b" + integrity sha1-0dyXOSAxTfZ/vrlCI7TuNQI56Ws= + dependencies: + mimic-response "^1.0.0" + +clsx@^1.1.1: + version "1.1.1" + resolved "https://registry.yarnpkg.com/clsx/-/clsx-1.1.1.tgz#98b3134f9abbdf23b2663491ace13c5c03a73188" + integrity sha512-6/bPho624p3S2pMyvP5kKBPXnI3ufHLObBFCfgx+LkeR5lg2XYy2hqZqUf45ypD8COn2bhgGJSUE+l5dhNBieA== + coa@^2.0.2: version "2.0.2" resolved "https://registry.yarnpkg.com/coa/-/coa-2.0.2.tgz#43f6c21151b4ef2bf57187db0d73de229e3e7ec3" @@ -2927,12 +2997,10 @@ color@^3.0.0: color-convert "^1.9.1" color-string "^1.5.2" -combined-stream@^1.0.6, combined-stream@~1.0.6: - version "1.0.8" - resolved "https://registry.yarnpkg.com/combined-stream/-/combined-stream-1.0.8.tgz#c3d45a8b34fd730631a110a8a2520682b31d5a7f" - integrity sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg== - dependencies: - delayed-stream "~1.0.0" +colorette@^1.2.1: + version "1.2.1" + resolved "https://registry.yarnpkg.com/colorette/-/colorette-1.2.1.tgz#4d0b921325c14faf92633086a536db6e89564b1b" + integrity sha512-puCDz0CzydiSYOrnXpz/PKd69zRrribezjtE9yd4zvytoRc8+RY/KJPvtPFKZS3E3wP6neGyMe0vOTlHO5L3Pw== comma-separated-tokens@^1.0.0: version "1.0.8" @@ -2994,15 +3062,27 @@ concat-stream@^1.5.0: readable-stream "^2.2.2" typedarray "^0.0.6" +configstore@^5.0.1: + version "5.0.1" + resolved "https://registry.yarnpkg.com/configstore/-/configstore-5.0.1.tgz#d365021b5df4b98cdd187d6a3b0e3f6a7cc5ed96" + integrity sha512-aMKprgk5YhBNyH25hj8wGt2+D52Sw1DRRIzqBwLp2Ya9mFmY8KPvvtvmna8SxVR9JMZ4kzMD68N22vlaRpkeFA== + dependencies: + dot-prop "^5.2.0" + graceful-fs "^4.1.2" + make-dir "^3.0.0" + unique-string "^2.0.0" + write-file-atomic "^3.0.0" + xdg-basedir "^4.0.0" + connect-history-api-fallback@^1.6.0: version "1.6.0" resolved "https://registry.yarnpkg.com/connect-history-api-fallback/-/connect-history-api-fallback-1.6.0.tgz#8b32089359308d111115d81cad3fceab888f97bc" integrity sha512-e54B99q/OUoH64zYYRf3HBP5z24G38h5D3qXu23JGRoigpX5Ss4r9ZnDk3g0Z8uQC2x2lPaJ+UlWBc1ZWBWdLg== consola@^2.10.0: - version "2.12.2" - resolved "https://registry.yarnpkg.com/consola/-/consola-2.12.2.tgz#9610f158e7b0a9ecc8f8bb0c4fc8e7c52bf41d05" - integrity sha512-c9mzemrAk57s3UIjepn8KKkuEH5fauMdot5kFSJUnqHcnApVS9Db8Rbv5AZ1Iz6lXzaGe9z1crQXhJtGX4h/Og== + version "2.15.0" + resolved "https://registry.yarnpkg.com/consola/-/consola-2.15.0.tgz#40fc4eefa4d2f8ef2e2806147f056ea207fcc0e9" + integrity sha512-vlcSGgdYS26mPf7qNi+dCisbhiyDnrN1zaRbw3CSuc2wGOMEGGPsp46PdRG5gqXwgtJfjxDkxRNAgRPr1B77vQ== console-browserify@^1.1.0: version "1.2.0" @@ -3014,6 +3094,11 @@ constants-browserify@^1.0.0: resolved "https://registry.yarnpkg.com/constants-browserify/-/constants-browserify-1.0.0.tgz#c20b96d8c617748aaf1c16021760cd27fcb8cb75" integrity sha1-wguW2MYXdIqvHBYCF2DNJ/y4y3U= +content-disposition@0.5.2: + version "0.5.2" + resolved "https://registry.yarnpkg.com/content-disposition/-/content-disposition-0.5.2.tgz#0cf68bb9ddf5f2be7961c3a85178cb85dba78cb4" + integrity sha1-DPaLud318r55YcOoUXjLhdunjLQ= + content-disposition@0.5.3: version "0.5.3" resolved "https://registry.yarnpkg.com/content-disposition/-/content-disposition-0.5.3.tgz#e130caf7e7279087c5616c2007d0485698984fbd" @@ -3060,6 +3145,11 @@ copy-descriptor@^0.1.0: resolved "https://registry.yarnpkg.com/copy-descriptor/-/copy-descriptor-0.1.1.tgz#676f6eb3c39997c2ee1ac3a924fd6124748f578d" integrity sha1-Z29us8OZl8LuGsOpJP1hJHSPV40= +copy-text-to-clipboard@^2.2.0: + version "2.2.0" + resolved "https://registry.yarnpkg.com/copy-text-to-clipboard/-/copy-text-to-clipboard-2.2.0.tgz#329dd6daf8c42034c763ace567418401764579ae" + integrity sha512-WRvoIdnTs1rgPMkgA2pUOa/M4Enh2uzCwdKsOMYNAJiz/4ZvEJgmbF4OmninPmlFdAWisfeh0tH+Cpf7ni3RqQ== + copy-webpack-plugin@^5.0.5: version "5.1.1" resolved "https://registry.yarnpkg.com/copy-webpack-plugin/-/copy-webpack-plugin-5.1.1.tgz#5481a03dea1123d88a988c6ff8b78247214f0b88" @@ -3079,19 +3169,24 @@ copy-webpack-plugin@^5.0.5: webpack-log "^2.0.0" core-js-compat@^3.6.2: - version "3.6.4" - resolved "https://registry.yarnpkg.com/core-js-compat/-/core-js-compat-3.6.4.tgz#938476569ebb6cda80d339bcf199fae4f16fff17" - integrity sha512-zAa3IZPvsJ0slViBQ2z+vgyyTuhd3MFn1rBQjZSKVEgB0UMYhUkCj9jJUVPgGTGqWvsBVmfnruXgTcNyTlEiSA== + version "3.6.5" + resolved "https://registry.yarnpkg.com/core-js-compat/-/core-js-compat-3.6.5.tgz#2a51d9a4e25dfd6e690251aa81f99e3c05481f1c" + integrity sha512-7ItTKOhOZbznhXAQ2g/slGg1PJV5zDO/WdkTwi7UEOJmkvsE32PWvx6mKtDjiMpjnR2CNf6BAD6sSxIlv7ptng== dependencies: - browserslist "^4.8.3" + browserslist "^4.8.5" semver "7.0.0" +core-js-pure@^3.0.0: + version "3.6.5" + resolved "https://registry.yarnpkg.com/core-js-pure/-/core-js-pure-3.6.5.tgz#c79e75f5e38dbc85a662d91eea52b8256d53b813" + integrity sha512-lacdXOimsiD0QyNf9BC/mxivNJ/ybBGJXQFKzRekp1WTHoVUWsUHEn+2T8GJAzzIhyOuXA+gOxCVN3l+5PLPUA== + core-js@^2.6.5: version "2.6.11" resolved "https://registry.yarnpkg.com/core-js/-/core-js-2.6.11.tgz#38831469f9922bded8ee21c9dc46985e0399308c" integrity sha512-5wjnpaT/3dV+XB4borEsnAYQchn00XSgTAWKDkEqv+K8KevjbzmofK6hfJ9TZIlpj2N0xQpazy7PiRQiWHqzWg== -core-util-is@1.0.2, core-util-is@~1.0.0: +core-util-is@~1.0.0: version "1.0.2" resolved "https://registry.yarnpkg.com/core-util-is/-/core-util-is-1.0.2.tgz#b5fd54220aa2bc5ab57aab7140c940754503c1a7" integrity sha1-tf1UIgqivFq1eqtxQMlAdUUDwac= @@ -3118,12 +3213,12 @@ cosmiconfig@^6.0.0: yaml "^1.7.2" create-ecdh@^4.0.0: - version "4.0.3" - resolved "https://registry.yarnpkg.com/create-ecdh/-/create-ecdh-4.0.3.tgz#c9111b6f33045c4697f144787f9254cdc77c45ff" - integrity sha512-GbEHQPMOswGpKXM9kCWVrremUcBmjteUaQ01T9rkKCPDXfUHX0IoP9LpHYo2NPFampa4e+/pFDc3jQdxrxQLaw== + version "4.0.4" + resolved "https://registry.yarnpkg.com/create-ecdh/-/create-ecdh-4.0.4.tgz#d6e7f4bffa66736085a0762fd3a632684dabcc4e" + integrity sha512-mf+TCx8wWc9VpuxfP2ht0iSISLZnt0JgWlrOKZiNqyUZWnjIaCIVNQArMHnCZKfEYRg6IM7A+NeJoN8gf/Ws0A== dependencies: bn.js "^4.1.0" - elliptic "^6.0.0" + elliptic "^6.5.3" create-hash@^1.1.0, create-hash@^1.1.2, create-hash@^1.2.0: version "1.2.0" @@ -3194,6 +3289,11 @@ crypto-browserify@^3.11.0: randombytes "^2.0.0" randomfill "^1.0.3" +crypto-random-string@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/crypto-random-string/-/crypto-random-string-2.0.0.tgz#ef2a7a966ec11083388369baa02ebead229b30d5" + integrity sha512-v1plID3y9r/lPhviJ1wrXpLeyUIGAZ2SHNYTEapm7/8A9nLPoyvVp3RK/EPFqn5kEznyWgYZNsRtYYIWbuG8KA== + css-blank-pseudo@^0.1.4: version "0.1.4" resolved "https://registry.yarnpkg.com/css-blank-pseudo/-/css-blank-pseudo-0.1.4.tgz#dfdefd3254bf8a82027993674ccf35483bfcb3c5" @@ -3223,22 +3323,22 @@ css-has-pseudo@^0.10.0: postcss-selector-parser "^5.0.0-rc.4" css-loader@^3.4.2: - version "3.5.3" - resolved "https://registry.yarnpkg.com/css-loader/-/css-loader-3.5.3.tgz#95ac16468e1adcd95c844729e0bb167639eb0bcf" - integrity sha512-UEr9NH5Lmi7+dguAm+/JSPovNjYbm2k3TK58EiwQHzOHH5Jfq1Y+XoP2bQO6TMn7PptMd0opxxedAWcaSTRKHw== + version "3.6.0" + resolved "https://registry.yarnpkg.com/css-loader/-/css-loader-3.6.0.tgz#2e4b2c7e6e2d27f8c8f28f61bffcd2e6c91ef645" + integrity sha512-M5lSukoWi1If8dhQAUCvj4H8vUt3vOnwbQBH9DdTm/s4Ym2B/3dPMtYZeJmq7Q3S3Pa+I94DcZ7pc9bP14cWIQ== dependencies: camelcase "^5.3.1" cssesc "^3.0.0" icss-utils "^4.1.1" loader-utils "^1.2.3" normalize-path "^3.0.0" - postcss "^7.0.27" + postcss "^7.0.32" postcss-modules-extract-imports "^2.0.0" postcss-modules-local-by-default "^3.0.2" postcss-modules-scope "^2.2.0" postcss-modules-values "^3.0.0" - postcss-value-parser "^4.0.3" - schema-utils "^2.6.6" + postcss-value-parser "^4.1.0" + schema-utils "^2.7.0" semver "^6.3.0" css-prefers-color-scheme@^3.1.1: @@ -3295,9 +3395,9 @@ css-what@2.1: integrity sha512-a+EPoD+uZiNfh+5fxw2nO9QwFa6nJe2Or35fGY6Ipw1R3R4AGz1d1TEZrCegvw2YTmZ0jXirGYlzxxpYSHwpEg== css-what@^3.2.1: - version "3.2.1" - resolved "https://registry.yarnpkg.com/css-what/-/css-what-3.2.1.tgz#f4a8f12421064621b456755e34a03a2c22df5da1" - integrity sha512-WwOrosiQTvyms+Ti5ZC5vGEK0Vod3FTt1ca+payZqvKuGJF+dq7bG63DstxtN0dpm6FxY27a/zS3Wten+gEtGw== + version "3.3.0" + resolved "https://registry.yarnpkg.com/css-what/-/css-what-3.3.0.tgz#10fec696a9ece2e591ac772d759aacabac38cd39" + integrity sha512-pv9JPyatiPaQ6pf4OvD/dbfm0o5LviWmwxNWzblYf/1u9QZd0ihV+PMwy5jdQWQ3349kZmKEx9WXuSka2dM4cg== cssdb@^4.4.0: version "4.4.0" @@ -3394,21 +3494,14 @@ cyclist@^1.0.1: resolved "https://registry.yarnpkg.com/cyclist/-/cyclist-1.0.1.tgz#596e9698fd0c80e12038c2b82d6eb1b35b6224d9" integrity sha1-WW6WmP0MgOEgOMK4LW6xs1tiJNk= -dashdash@^1.12.0: - version "1.14.1" - resolved "https://registry.yarnpkg.com/dashdash/-/dashdash-1.14.1.tgz#853cfa0f7cbe2fed5de20326b8dd581035f6e2f0" - integrity sha1-hTz6D3y+L+1d4gMmuN1YEDX24vA= - dependencies: - assert-plus "^1.0.0" - -debug@2.6.9, debug@^2.2.0, debug@^2.3.3, debug@^2.6.0, debug@^2.6.9: +debug@2.6.9, debug@^2.2.0, debug@^2.3.3, debug@^2.6.0: version "2.6.9" resolved "https://registry.yarnpkg.com/debug/-/debug-2.6.9.tgz#5d128515df134ff327e90a4c93f4e077a536341f" integrity sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA== dependencies: ms "2.0.0" -debug@^3.0.0, debug@^3.1.1, debug@^3.2.5: +debug@^3.1.1, debug@^3.2.5: version "3.2.6" resolved "https://registry.yarnpkg.com/debug/-/debug-3.2.6.tgz#e83d17de16d8a7efb7717edbe5fb10135eee629b" integrity sha512-mel+jf7nrtEl5Pn1Qx46zARXKDpBbvzezse7p7LqINmdoIk8PYP5SySaxEmYv6TZ0JyEKA1hsCId6DIhgITtWQ== @@ -3432,6 +3525,13 @@ decode-uri-component@^0.2.0: resolved "https://registry.yarnpkg.com/decode-uri-component/-/decode-uri-component-0.2.0.tgz#eb3913333458775cb84cd1a1fae062106bb87545" integrity sha1-6zkTMzRYd1y4TNGh+uBiEGu4dUU= +decompress-response@^3.3.0: + version "3.3.0" + resolved "https://registry.yarnpkg.com/decompress-response/-/decompress-response-3.3.0.tgz#80a4dd323748384bfa248083622aedec982adff3" + integrity sha1-gKTdMjdIOEv6JICDYirt7Jgq3/M= + dependencies: + mimic-response "^1.0.0" + deep-equal@^1.0.1: version "1.1.1" resolved "https://registry.yarnpkg.com/deep-equal/-/deep-equal-1.1.1.tgz#b5c98c942ceffaf7cb051e24e1434a25a2e6076a" @@ -3444,6 +3544,11 @@ deep-equal@^1.0.1: object-keys "^1.1.1" regexp.prototype.flags "^1.2.0" +deep-extend@^0.6.0: + version "0.6.0" + resolved "https://registry.yarnpkg.com/deep-extend/-/deep-extend-0.6.0.tgz#c4fa7c95404a17a9c3e8ca7e1537312b736330ac" + integrity sha512-LOHxIOaPYdHlJRtCQfDIVZtfw/ufM8+rVj649RIHzcm/vGwQRXFt6OPqIFWsm2XEMrNIEtWR64sY1LEKD2vAOA== + default-gateway@^4.2.0: version "4.2.0" resolved "https://registry.yarnpkg.com/default-gateway/-/default-gateway-4.2.0.tgz#167104c7500c2115f6dd69b0a536bb8ed720552b" @@ -3452,6 +3557,11 @@ default-gateway@^4.2.0: execa "^1.0.0" ip-regex "^2.1.0" +defer-to-connect@^1.0.1: + version "1.1.3" + resolved "https://registry.yarnpkg.com/defer-to-connect/-/defer-to-connect-1.1.3.tgz#331ae050c08dcf789f8c83a7b81f0ed94f4ac591" + integrity sha512-0ISdNousHvZT2EiFlZeZAHBUvSxmKswVCEf8hW7KWgG4a8MVEu/3Vb6uWYozkjylyCxe0JBIiRB1jV45S70WVQ== + define-properties@^1.1.2, define-properties@^1.1.3: version "1.1.3" resolved "https://registry.yarnpkg.com/define-properties/-/define-properties-1.1.3.tgz#cf88da6cbee26fe6db7094f61d870cbd84cee9f1" @@ -3508,11 +3618,6 @@ del@^5.1.0: rimraf "^3.0.0" slash "^3.0.0" -delayed-stream@~1.0.0: - version "1.0.0" - resolved "https://registry.yarnpkg.com/delayed-stream/-/delayed-stream-1.0.0.tgz#df3ae199acadfb7d440aaae0b29e2272b24ec619" - integrity sha1-3zrhmayt+31ECqrgsp4icrJOxhk= - delegate@^3.1.2: version "3.2.0" resolved "https://registry.yarnpkg.com/delegate/-/delegate-3.2.0.tgz#b66b71c3158522e8ab5744f720d8ca0c2af59166" @@ -3556,6 +3661,14 @@ detect-port-alt@1.1.6: address "^1.0.1" debug "^2.6.0" +detect-port@^1.3.0: + version "1.3.0" + resolved "https://registry.yarnpkg.com/detect-port/-/detect-port-1.3.0.tgz#d9c40e9accadd4df5cac6a782aefd014d573d1f1" + integrity sha512-E+B1gzkl2gqxt1IhUzwjrxBKRqx1UzC3WLONHinn8S3T6lwV/agVCyitiFOsGJ/eYuEUBvD71MZHy3Pv1G9doQ== + dependencies: + address "^1.0.1" + debug "^2.6.0" + diffie-hellman@^5.0.0: version "5.0.3" resolved "https://registry.yarnpkg.com/diffie-hellman/-/diffie-hellman-5.0.3.tgz#40e8ee98f55a2149607146921c63e1ae5f3d2875" @@ -3607,19 +3720,6 @@ dns-txt@^2.0.2: dependencies: buffer-indexof "^1.0.0" -docsearch.js@^2.6.3: - version "2.6.3" - resolved "https://registry.yarnpkg.com/docsearch.js/-/docsearch.js-2.6.3.tgz#57cb4600d3b6553c677e7cbbe6a734593e38625d" - integrity sha512-GN+MBozuyz664ycpZY0ecdQE0ND/LSgJKhTLA0/v3arIS3S1Rpf2OJz6A35ReMsm91V5apcmzr5/kM84cvUg+A== - dependencies: - algoliasearch "^3.24.5" - autocomplete.js "0.36.0" - hogan.js "^3.0.2" - request "^2.87.0" - stack-utils "^1.0.1" - to-factory "^1.0.0" - zepto "^1.2.0" - dom-converter@^0.2: version "0.2.0" resolved "https://registry.yarnpkg.com/dom-converter/-/dom-converter-0.2.0.tgz#6721a9daee2e293682955b6afe416771627bb768" @@ -3643,11 +3743,6 @@ dom-serializer@~0.1.0: domelementtype "^1.3.0" entities "^1.1.1" -dom-walk@^0.1.0: - version "0.1.2" - resolved "https://registry.yarnpkg.com/dom-walk/-/dom-walk-0.1.2.tgz#0c548bef048f4d1f2a97249002236060daa3fd84" - integrity sha512-6QvTW9mrGeIegrFXdtQi9pk7O/nSK6lSdXW2eqUspN5LWD7UTji2Fqw5V2YLjBpHEoU9Xl/eUWNpDeZvoyOv2w== - domain-browser@^1.1.1: version "1.2.0" resolved "https://registry.yarnpkg.com/domain-browser/-/domain-browser-1.2.0.tgz#3d31f50191a6749dd1375a7f522e823d42e54eda" @@ -3701,10 +3796,15 @@ dot-prop@^5.2.0: dependencies: is-obj "^2.0.0" +duplexer3@^0.1.4: + version "0.1.4" + resolved "https://registry.yarnpkg.com/duplexer3/-/duplexer3-0.1.4.tgz#ee01dd1cac0ed3cbc7fdbea37dc0a8f1ce002ce2" + integrity sha1-7gHdHKwO08vH/b6jfcCo8c4ALOI= + duplexer@^0.1.1: - version "0.1.1" - resolved "https://registry.yarnpkg.com/duplexer/-/duplexer-0.1.1.tgz#ace6ff808c1ce66b57d1ebf97977acb02334cfc1" - integrity sha1-rOb/gIwc5mtX0ev5eXessCM0z8E= + version "0.1.2" + resolved "https://registry.yarnpkg.com/duplexer/-/duplexer-0.1.2.tgz#3abe43aef3835f8ae077d136ddce0f276b0400e6" + integrity sha512-jtD6YG370ZCIi/9GTaJKQxWTZD045+4R4hTk/x1UyoqadyJ9x9CgSi1RlVDQF8U2sxLLSnFkCaMihqljHIWgMg== duplexify@^3.4.2, duplexify@^3.6.0: version "3.7.1" @@ -3716,14 +3816,6 @@ duplexify@^3.4.2, duplexify@^3.6.0: readable-stream "^2.0.0" stream-shift "^1.0.0" -ecc-jsbn@~0.1.1: - version "0.1.2" - resolved "https://registry.yarnpkg.com/ecc-jsbn/-/ecc-jsbn-0.1.2.tgz#3a83a904e54353287874c564b7549386849a98c9" - integrity sha1-OoOpBOVDUyh4dMVkt1SThoSamMk= - dependencies: - jsbn "~0.1.0" - safer-buffer "^2.1.0" - ee-first@1.1.1: version "1.1.1" resolved "https://registry.yarnpkg.com/ee-first/-/ee-first-1.1.1.tgz#590c61156b0ae2f4f0255732a158b266bc56b21d" @@ -3734,17 +3826,12 @@ ejs@^2.6.1: resolved "https://registry.yarnpkg.com/ejs/-/ejs-2.7.4.tgz#48661287573dcc53e366c7a1ae52c3a120eec9ba" integrity sha512-7vmuyh5+kuUyJKePhQfRQBhXV5Ce+RnaeeQArKu1EAMpL3WbgMt5WG6uQZpEVvYSSsxMXRKOewtDk9RaTKXRlA== -electron-to-chromium@^1.3.378, electron-to-chromium@^1.3.413: - version "1.3.453" - resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.3.453.tgz#758a8565a64b7889b27132a51d2abb8b135c9d01" - integrity sha512-IQbCfjJR0NDDn/+vojTlq7fPSREcALtF8M1n01gw7nQghCtfFYrJ2dfhsp8APr8bANoFC8vRTFVXMOGpT0eetw== - -electron-to-chromium@^1.3.390: - version "1.3.402" - resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.3.402.tgz#9ad93c0c8ea2e571431739e0d76bd6bc9788a846" - integrity sha512-gaCDfX7IUH0s3JmBiHCDPrvVcdnTTP1r4WLJc2dHkYYbLmXZ2XHiJCcGQ9Balf91aKTvuCKCyu2JjJYRykoI1w== +electron-to-chromium@^1.3.378, electron-to-chromium@^1.3.523: + version "1.3.544" + resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.3.544.tgz#ac1f7d319f6060f3d6d122261d542ec77eb1427e" + integrity sha512-jx6H7M1db76Q/dI3MadZC4qwNTvpiq8tdYEJswxexrIm5bH+LKRdg+VAteMF1tJJbBLrcuogE9N3nxT3Dp1gag== -elliptic@^6.0.0, elliptic@^6.5.2: +elliptic@^6.5.3: version "6.5.3" resolved "https://registry.yarnpkg.com/elliptic/-/elliptic-6.5.3.tgz#cb59eb2efdaf73a0bd78ccd7015a62ad6e0f93d6" integrity sha512-IMqzv5wNQf+E6aHeIqATs0tOLeOTwj1QKbRcS3jBbYkl5oLAserA8yJTT7/VyHUYG91PRmPyeQDObKLPpeS4dw== @@ -3799,10 +3886,10 @@ end-of-stream@^1.0.0, end-of-stream@^1.1.0: dependencies: once "^1.4.0" -enhanced-resolve@^4.1.0: - version "4.1.1" - resolved "https://registry.yarnpkg.com/enhanced-resolve/-/enhanced-resolve-4.1.1.tgz#2937e2b8066cd0fe7ce0990a98f0d71a35189f66" - integrity sha512-98p2zE+rL7/g/DzMHMTF4zZlCgeVdJ7yr6xzEpJRYwFYrGi9ANdn5DnJURg6RpBkyk60XYDnWIv51VfIhfNGuA== +enhanced-resolve@^4.3.0: + version "4.3.0" + resolved "https://registry.yarnpkg.com/enhanced-resolve/-/enhanced-resolve-4.3.0.tgz#3b806f3bfafc1ec7de69551ef93cca46c1704126" + integrity sha512-3e87LvavsdxyoCfGusJnrZ5G8SLPOFeHSNpZI/ATL9a5leXo2k0w6MKnbqhdBad9qTobSfB20Ld7UmgoNbAZkQ== dependencies: graceful-fs "^4.1.2" memory-fs "^0.5.0" @@ -3814,17 +3901,9 @@ entities@^1.1.1, entities@~1.1.1: integrity sha512-f2LZMYl1Fzu7YSBKg+RoROelpOaNrcGmE9AZubeDfrCEia483oW4MI4VyFd5VNHIgQ/7qm1I0wUHK1eJnn2y2w== entities@^2.0.0: - version "2.0.0" - resolved "https://registry.yarnpkg.com/entities/-/entities-2.0.0.tgz#68d6084cab1b079767540d80e56a39b423e4abf4" - integrity sha512-D9f7V0JSRwIxlRI2mjMqufDrRDnx8p+eEOz7aUM9SuvF8gsBzra0/6tbjl1m8eQHrZlYj6PxqE00hZ1SAIKPLw== - -envify@^4.0.0: - version "4.1.0" - resolved "https://registry.yarnpkg.com/envify/-/envify-4.1.0.tgz#f39ad3db9d6801b4e6b478b61028d3f0b6819f7e" - integrity sha512-IKRVVoAYr4pIx4yIWNsz9mOsboxlNXiu7TNBnem/K/uTHdkyzXWDzHCK7UTolqBbgaBz0tQHsD3YNls0uIIjiw== - dependencies: - esprima "^4.0.0" - through "~2.3.4" + version "2.0.3" + resolved "https://registry.yarnpkg.com/entities/-/entities-2.0.3.tgz#5c487e5742ab93c15abb5da22759b8590ec03b7f" + integrity sha512-MyoZ0jgnLvB2X3Lg5HqpFmn1kybDiIfEQmKzTb5apr51Rb+T3KdmMiqa70T+bhGnyv7bQ6WMj2QMHpGMmlrUYQ== errno@^0.1.3, errno@~0.1.7: version "0.1.7" @@ -3841,21 +3920,21 @@ error-ex@^1.3.1: is-arrayish "^0.2.1" es-abstract@^1.17.0-next.1, es-abstract@^1.17.2, es-abstract@^1.17.5: - version "1.17.5" - resolved "https://registry.yarnpkg.com/es-abstract/-/es-abstract-1.17.5.tgz#d8c9d1d66c8981fb9200e2251d799eee92774ae9" - integrity sha512-BR9auzDbySxOcfog0tLECW8l28eRGpDpU3Dm3Hp4q/N+VtLTmyj4EUN088XZWQDW/hzj6sYRDXeOFsaAODKvpg== + version "1.17.6" + resolved "https://registry.yarnpkg.com/es-abstract/-/es-abstract-1.17.6.tgz#9142071707857b2cacc7b89ecb670316c3e2d52a" + integrity sha512-Fr89bON3WFyUi5EvAeI48QTWX0AyekGgLA8H+c+7fbfCkJwRWRMLd8CQedNEyJuoYYhmtEqY92pgte1FAhBlhw== dependencies: es-to-primitive "^1.2.1" function-bind "^1.1.1" has "^1.0.3" has-symbols "^1.0.1" - is-callable "^1.1.5" - is-regex "^1.0.5" + is-callable "^1.2.0" + is-regex "^1.1.0" object-inspect "^1.7.0" object-keys "^1.1.1" object.assign "^4.1.0" - string.prototype.trimleft "^2.1.1" - string.prototype.trimright "^2.1.1" + string.prototype.trimend "^1.0.1" + string.prototype.trimstart "^1.0.1" es-to-primitive@^1.2.1: version "1.2.1" @@ -3866,10 +3945,15 @@ es-to-primitive@^1.2.1: is-date-object "^1.0.1" is-symbol "^1.0.2" -es6-promise@^4.1.0: - version "4.2.8" - resolved "https://registry.yarnpkg.com/es6-promise/-/es6-promise-4.2.8.tgz#4eb21594c972bc40553d276e510539143db53e0a" - integrity sha512-HJDGx5daxeIvxdBxvG2cb9g4tEvwIk3i8+nhX0yGrYmZUzbkdg8QbDevheDB8gd0//uPj4c1EQua8Q+MViT0/w== +escalade@^3.0.2: + version "3.0.2" + resolved "https://registry.yarnpkg.com/escalade/-/escalade-3.0.2.tgz#6a580d70edb87880f22b4c91d0d56078df6962c4" + integrity sha512-gPYAU37hYCUhW5euPeR+Y74F7BL+IBsV93j5cvGriSaD1aG6MGsqsV1yamRdrWrb2j3aiZvb0X+UBOWpx3JWtQ== + +escape-goat@^2.0.0: + version "2.1.1" + resolved "https://registry.yarnpkg.com/escape-goat/-/escape-goat-2.1.1.tgz#1b2dc77003676c457ec760b2dc68edb648188675" + integrity sha512-8/uIhbG12Csjy2JEW7D9pHbreaVaS/OpN3ycnyvElTdwM5n6GY6W6e2IPemfvGZeUMqZ9A/3GqIZMgKnBhAw/Q== escape-html@^1.0.3, escape-html@~1.0.3: version "1.0.3" @@ -3917,9 +4001,9 @@ esutils@^2.0.2: integrity sha512-kVscqXk4OCp68SZ0dkgEKVi6/8ij300KBWTJq32P/dYeWTSwK41WyTxalN1eRmA5Z9UU/LX9D7FWSmV9SAYx6g== eta@^1.1.1: - version "1.1.1" - resolved "https://registry.yarnpkg.com/eta/-/eta-1.1.1.tgz#acd575025233488a66870b02223001d4cd467441" - integrity sha512-YRchTAXZZrrJVmlAwmLHuKmlHNJ2hO0uen8LsDqvH5kknRjh0ef+Y9kInENygCgvu7FQNJBpbyDChfMo8f5Qgw== + version "1.2.2" + resolved "https://registry.yarnpkg.com/eta/-/eta-1.2.2.tgz#9f182673738589281042641cb22f801dcabdf7bf" + integrity sha512-8H+zm3HfY2ELz5P4zzR3uJ1LQLnhTAe5gb0vR9ziKZGCLhQrRtqwIyzsOkf7pdBnH7gFPLRAaKZdv2nj9vu9cw== etag@~1.8.1: version "1.8.1" @@ -3934,19 +4018,19 @@ eval@^0.1.4: require-like ">= 0.1.1" eventemitter3@^4.0.0: - version "4.0.4" - resolved "https://registry.yarnpkg.com/eventemitter3/-/eventemitter3-4.0.4.tgz#b5463ace635a083d018bdc7c917b4c5f10a85384" - integrity sha512-rlaVLnVxtxvoyLsQQFBx53YmXHDxRIzzTLbdfxqi4yocpSjAxXwkU0cScM5JgSKMqEhrZpnvQ2D9gjylR0AimQ== + version "4.0.5" + resolved "https://registry.yarnpkg.com/eventemitter3/-/eventemitter3-4.0.5.tgz#51d81e4f1ccc8311a04f0c20121ea824377ea6d9" + integrity sha512-QR0rh0YiPuxuDQ6+T9GAO/xWTExXpxIes1Nl9RykNGTnE1HJmkuEfxJH9cubjIOQZ/GH4qNBR4u8VSHaKiWs4g== -events@^1.1.0, events@^1.1.1: +events@^1.1.1: version "1.1.1" resolved "https://registry.yarnpkg.com/events/-/events-1.1.1.tgz#9ebdb7635ad099c70dcc4c2a1f5004288e8bd924" integrity sha1-nr23Y1rQmccNzEwqH1AEKI6L2SQ= events@^3.0.0: - version "3.1.0" - resolved "https://registry.yarnpkg.com/events/-/events-3.1.0.tgz#84279af1b34cb75aa88bf5ff291f6d0bd9b31a59" - integrity sha512-Rv+u8MLHNOdMjTAFeT3nCjHn2aGlx435FP/sDHNaRhDEMwyI/aB22Kj2qIN8R0cw3z28psEQLYwxVKLsKrMgWg== + version "3.2.0" + resolved "https://registry.yarnpkg.com/events/-/events-3.2.0.tgz#93b87c18f8efcd4202a461aec4dfc0556b639379" + integrity sha512-/46HWwbfCX2xTawVfkKLGxMifJYQBWMwY1mjywRtb4c9x8l5NP3KoJtnIOiL1hfdRkIuYhETxQlo62IF8tcnlg== eventsource@^1.0.7: version "1.0.7" @@ -4056,7 +4140,7 @@ extend-shallow@^3.0.0, extend-shallow@^3.0.2: assign-symbols "^1.0.0" is-extendable "^1.0.1" -extend@^3.0.0, extend@~3.0.2: +extend@^3.0.0: version "3.0.2" resolved "https://registry.yarnpkg.com/extend/-/extend-3.0.2.tgz#f8b1136b4071fbd8eb140aff858b1019ec2915fa" integrity sha512-fjquC59cD7CyW6urNXK0FBufkZcoiGG80wTuPujX590cB5Ttln20E2UB4S/WARVqhXffZl2LNgS+gQdPIIim/g== @@ -4084,20 +4168,10 @@ extglob@^2.0.4: snapdragon "^0.8.1" to-regex "^3.0.1" -extsprintf@1.3.0: - version "1.3.0" - resolved "https://registry.yarnpkg.com/extsprintf/-/extsprintf-1.3.0.tgz#96918440e3041a7a414f8c52e3c574eb3c3e1e05" - integrity sha1-lpGEQOMEGnpBT4xS48V06zw+HgU= - -extsprintf@^1.2.0: - version "1.4.0" - resolved "https://registry.yarnpkg.com/extsprintf/-/extsprintf-1.4.0.tgz#e2689f8f356fad62cca65a3a91c5df5f9551692f" - integrity sha1-4mifjzVvrWLMplo6kcXfX5VRaS8= - fast-deep-equal@^3.1.1: - version "3.1.1" - resolved "https://registry.yarnpkg.com/fast-deep-equal/-/fast-deep-equal-3.1.1.tgz#545145077c501491e33b15ec408c294376e94ae4" - integrity sha512-8UEa58QDLauDNfpbrX55Q9jrGHThw2ZMdOky5Gl1CDtVeJDPVrG4Jxx1N8jw2gkWaff5UUuX1KJd+9zGe2B+ZA== + version "3.1.3" + resolved "https://registry.yarnpkg.com/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz#3a7d56b559d6cbc3eb512325244e619a65c6c525" + integrity sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q== fast-glob@^2.0.2: version "2.2.7" @@ -4112,9 +4186,9 @@ fast-glob@^2.0.2: micromatch "^3.1.10" fast-glob@^3.0.3: - version "3.2.2" - resolved "https://registry.yarnpkg.com/fast-glob/-/fast-glob-3.2.2.tgz#ade1a9d91148965d4bf7c51f72e1ca662d32e63d" - integrity sha512-UDV82o4uQyljznxwMxyVRJgZZt3O5wENYojjzbaGEGZgeOxkLFf+V4cnUD+krzb2F72E18RhamkMZ7AdeggF7A== + version "3.2.4" + resolved "https://registry.yarnpkg.com/fast-glob/-/fast-glob-3.2.4.tgz#d20aefbf99579383e7f3cc66529158c9b98554d3" + integrity sha512-kr/Oo6PX51265qeuCYsyGypiO5uJFgBS0jksyG7FUeCyQzNwYnzrNIMR1NXfkZXsMYXYLRAHgISHBz8gQcxKHQ== dependencies: "@nodelib/fs.stat" "^2.0.2" "@nodelib/fs.walk" "^1.2.3" @@ -4128,6 +4202,13 @@ fast-json-stable-stringify@^2.0.0: resolved "https://registry.yarnpkg.com/fast-json-stable-stringify/-/fast-json-stable-stringify-2.1.0.tgz#874bf69c6f404c2b5d99c481341399fd55892633" integrity sha512-lhd/wF+Lk98HZoTCtlVraHtfh5XYijIjalXck7saUtuanSDyLMxnHhSXEDJqHxD7msR8D0uCmqlkwjCV8xvwHw== +fast-url-parser@1.1.3: + version "1.1.3" + resolved "https://registry.yarnpkg.com/fast-url-parser/-/fast-url-parser-1.1.3.tgz#f4af3ea9f34d8a271cf58ad2b3759f431f0b318d" + integrity sha1-9K8+qfNNiicc9YrSs3WfQx8LMY0= + dependencies: + punycode "^1.3.2" + fastq@^1.6.0: version "1.8.0" resolved "https://registry.yarnpkg.com/fastq/-/fastq-1.8.0.tgz#550e1f9f59bbc65fe185cb6a9b4d95357107f481" @@ -4150,9 +4231,9 @@ faye-websocket@~0.11.1: websocket-driver ">=0.5.1" feed@^4.1.0: - version "4.2.0" - resolved "https://registry.yarnpkg.com/feed/-/feed-4.2.0.tgz#9f6dbc476f6a5925a6e040ef377c7fafbfbc2cf6" - integrity sha512-nLU4Fn+5TCJ1Zu9kBDqXPxsaTXaL/hZgZ3pmT87TUzS1kfaL91iIKJ+DFWygL8CrOeYw80z7QWxabkMV/x+g2g== + version "4.2.1" + resolved "https://registry.yarnpkg.com/feed/-/feed-4.2.1.tgz#b246ef891051c7dbf088ca203341d9fb0444baee" + integrity sha512-l28KKcK1J/u3iq5dRDmmoB2p7dtBfACC2NqJh4dI2kFptxH0asfjmOfcxqh5Sv8suAlVa73gZJ4REY5RrafVvg== dependencies: xml-js "^1.6.11" @@ -4168,6 +4249,14 @@ figures@^3.0.0: dependencies: escape-string-regexp "^1.0.5" +file-loader@^6.0.0: + version "6.0.0" + resolved "https://registry.yarnpkg.com/file-loader/-/file-loader-6.0.0.tgz#97bbfaab7a2460c07bcbd72d3a6922407f67649f" + integrity sha512-/aMOAYEFXDdjG0wytpTL5YQLfZnnTmLNjn+AIrJ/6HVnTfDqLsVKUUwkDf4I4kgex36BvjuXEn/TX9B/1ESyqQ== + dependencies: + loader-utils "^2.0.0" + schema-utils "^2.6.5" + file-uri-to-path@1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/file-uri-to-path/-/file-uri-to-path-1.0.0.tgz#553a7b8446ff6f684359c445f1e37a05dacc33dd" @@ -4239,13 +4328,6 @@ find-up@4.1.0, find-up@^4.0.0: locate-path "^5.0.0" path-exists "^4.0.0" -find-up@^2.1.0: - version "2.1.0" - resolved "https://registry.yarnpkg.com/find-up/-/find-up-2.1.0.tgz#45d1b7e506c717ddd482775a2b77920a3c0c57a7" - integrity sha1-RdG35QbHF93UgndaK3eSCjwMV6c= - dependencies: - locate-path "^2.0.0" - find-up@^3.0.0: version "3.0.0" resolved "https://registry.yarnpkg.com/find-up/-/find-up-3.0.0.tgz#49169f1d7993430646da61ecc5ae355c21c97b73" @@ -4267,11 +4349,9 @@ flush-write-stream@^1.0.0: readable-stream "^2.3.6" follow-redirects@^1.0.0: - version "1.11.0" - resolved "https://registry.yarnpkg.com/follow-redirects/-/follow-redirects-1.11.0.tgz#afa14f08ba12a52963140fe43212658897bc0ecb" - integrity sha512-KZm0V+ll8PfBrKwMzdo5D13b1bur9Iq9Zd/RMmAoQQcl2PxxFml8cxXPaaPYVbV0RjNjq1CU7zIzAOqtUPudmA== - dependencies: - debug "^3.0.0" + version "1.13.0" + resolved "https://registry.yarnpkg.com/follow-redirects/-/follow-redirects-1.13.0.tgz#b42e8d93a2a7eea5ed88633676d6597bc8e384db" + integrity sha512-aq6gF1BEKje4a9i9+5jimNFIpq4Q1WiwBToeRK5NvZBd/TRsmW8BsJfOEGkr76TbOyPVD3OVDN910EcUNtRYEA== for-in@^0.1.3: version "0.1.8" @@ -4290,16 +4370,6 @@ for-own@^0.1.3: dependencies: for-in "^1.0.1" -foreach@^2.0.5: - version "2.0.5" - resolved "https://registry.yarnpkg.com/foreach/-/foreach-2.0.5.tgz#0bee005018aeb260d0a3af3ae658dd0136ec1b99" - integrity sha1-C+4AUBiusmDQo6865ljdATbsG5k= - -forever-agent@~0.6.1: - version "0.6.1" - resolved "https://registry.yarnpkg.com/forever-agent/-/forever-agent-0.6.1.tgz#fbc71f0c41adeb37f96c577ad1ed42d8fdacca91" - integrity sha1-+8cfDEGt6zf5bFd60e1C2P2sypE= - fork-ts-checker-webpack-plugin@3.1.1: version "3.1.1" resolved "https://registry.yarnpkg.com/fork-ts-checker-webpack-plugin/-/fork-ts-checker-webpack-plugin-3.1.1.tgz#a1642c0d3e65f50c2cc1742e9c0a80f441f86b19" @@ -4314,15 +4384,6 @@ fork-ts-checker-webpack-plugin@3.1.1: tapable "^1.0.0" worker-rpc "^0.1.0" -form-data@~2.3.2: - version "2.3.3" - resolved "https://registry.yarnpkg.com/form-data/-/form-data-2.3.3.tgz#dcce52c05f644f298c6a7ab936bd724ceffbf3a6" - integrity sha512-1lLKB2Mu3aGP1Q/2eCOx0fNbRMe7XdwktwOruhfqqd0rIJWwN4Dh+E3hrPSlDCXnSR7UtZ1N38rVXm+6+MEhJQ== - dependencies: - asynckit "^0.4.0" - combined-stream "^1.0.6" - mime-types "^2.1.12" - forwarded@~0.1.2: version "0.1.2" resolved "https://registry.yarnpkg.com/forwarded/-/forwarded-0.1.2.tgz#98c23dab1175657b8c0573e8ceccd91b0ff18c84" @@ -4380,9 +4441,9 @@ fs.realpath@^1.0.0: integrity sha1-FQStJSMVjKpA20onh8sBQRmU6k8= fsevents@^1.2.7: - version "1.2.12" - resolved "https://registry.yarnpkg.com/fsevents/-/fsevents-1.2.12.tgz#db7e0d8ec3b0b45724fd4d83d43554a8f1f0de5c" - integrity sha512-Ggd/Ktt7E7I8pxZRbGIs7vwqAPscSESMrCSkx2FtWeqmheJgCo2R74fTsZFCifr0VTPwqRpPv17+6b8Zp7th0Q== + version "1.2.13" + resolved "https://registry.yarnpkg.com/fsevents/-/fsevents-1.2.13.tgz#f325cb0455592428bcf11b383370ef70e3bfcc38" + integrity sha512-oWb1Z6mkHIskLzEJ/XWX0srkpkTQ7vaopMQkyaEIoq0fmtFVxOthb8cCxeT+p3ynTdkk/RZwbgG4brR5BeWECw== dependencies: bindings "^1.5.0" nan "^2.12.1" @@ -4412,17 +4473,17 @@ get-own-enumerable-property-symbols@^3.0.0: resolved "https://registry.yarnpkg.com/get-own-enumerable-property-symbols/-/get-own-enumerable-property-symbols-3.0.2.tgz#b5fde77f22cbe35f390b4e089922c50bce6ef664" integrity sha512-I0UBV/XOz1XkIJHEUDMZAbzCThU/H8DxmSfmdGcKPnVhu2VfFqr34jr9777IyaTYvxjedWhqVIilEDsCdP5G6g== -get-stream@^4.0.0: +get-stream@^4.0.0, get-stream@^4.1.0: version "4.1.0" resolved "https://registry.yarnpkg.com/get-stream/-/get-stream-4.1.0.tgz#c1b255575f3dc21d59bfc79cd3d2b46b1c3a54b5" integrity sha512-GMat4EJ5161kIy2HevLlr4luNjBgvmj413KaQA7jt4V8B4RDsfpHk7WQ9GVqfYyyx8OS/L66Kox+rJRNklLK7w== dependencies: pump "^3.0.0" -get-stream@^5.0.0: - version "5.1.0" - resolved "https://registry.yarnpkg.com/get-stream/-/get-stream-5.1.0.tgz#01203cdc92597f9b909067c3e656cc1f4d3c4dc9" - integrity sha512-EXr1FOzrzTfGeL0gQdeFEvOMm2mzMOglyiOXSTpPC+iAjAKftbr3jpCMWynogwYnM+eSj9sHGc6wjIcDvYiygw== +get-stream@^5.0.0, get-stream@^5.1.0: + version "5.2.0" + resolved "https://registry.yarnpkg.com/get-stream/-/get-stream-5.2.0.tgz#4966a1795ee5ace65e706c4b7beb71257d6e22d3" + integrity sha512-nBF+F1rAZVCu/p7rjzgA+Yb4lfYXrpl7a6VmJrU8wF9I1CKvP/QwPNZHnOlwbTkY6dvtFIzFMSyQXbLoTQPRpA== dependencies: pump "^3.0.0" @@ -4431,13 +4492,6 @@ get-value@^2.0.3, get-value@^2.0.6: resolved "https://registry.yarnpkg.com/get-value/-/get-value-2.0.6.tgz#dc15ca1c672387ca76bd37ac0a395ba2042a2c28" integrity sha1-3BXKHGcjh8p2vTesCjlbogQqLCg= -getpass@^0.1.1: - version "0.1.7" - resolved "https://registry.yarnpkg.com/getpass/-/getpass-0.1.7.tgz#5eff8e3e684d569ae4cb2b1282604e8ba62149fa" - integrity sha1-Xv+OPmhNVprkyysSgmBOi6YhSfo= - dependencies: - assert-plus "^1.0.0" - github-slugger@^1.3.0: version "1.3.0" resolved "https://registry.yarnpkg.com/github-slugger/-/github-slugger-1.3.0.tgz#9bd0a95c5efdfc46005e82a906ef8e2a059124c9" @@ -4477,6 +4531,13 @@ glob@^7.0.0, glob@^7.0.3, glob@^7.1.2, glob@^7.1.3, glob@^7.1.4: once "^1.3.0" path-is-absolute "^1.0.0" +global-dirs@^2.0.1: + version "2.0.1" + resolved "https://registry.yarnpkg.com/global-dirs/-/global-dirs-2.0.1.tgz#acdf3bb6685bcd55cb35e8a052266569e9469201" + integrity sha512-5HqUqdhkEovj2Of/ms3IeS/EekcO54ytHRLV4PEY2rhRwrHXLQjeVEES0Lhka0xwNDtGYn58wyC4s5+MHsOO6A== + dependencies: + ini "^1.3.5" + global-modules@2.0.0: version "2.0.0" resolved "https://registry.yarnpkg.com/global-modules/-/global-modules-2.0.0.tgz#997605ad2345f27f51539bea26574421215c7780" @@ -4493,14 +4554,6 @@ global-prefix@^3.0.0: kind-of "^6.0.2" which "^1.3.1" -global@^4.3.2: - version "4.4.0" - resolved "https://registry.yarnpkg.com/global/-/global-4.4.0.tgz#3e7b105179006a323ed71aafca3e9c57a5cc6406" - integrity sha512-wv/LAoHdRE3BeTGz53FAamhGlPLhlssK45usmGFThIi4XqnBmjKQ16u+RNbP7WvigRZDxUsM0J3gcQ5yicaL0w== - dependencies: - min-document "^2.19.0" - process "^0.11.10" - globals@^11.1.0: version "11.12.0" resolved "https://registry.yarnpkg.com/globals/-/globals-11.12.0.tgz#ab8795338868a0babd8525758018c2a7eb95c42e" @@ -4563,12 +4616,24 @@ good-listener@^1.2.2: dependencies: delegate "^3.1.2" -graceful-fs@^4.1.11, graceful-fs@^4.1.2, graceful-fs@^4.1.6, graceful-fs@^4.2.0: - version "4.2.3" - resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.2.3.tgz#4a12ff1b60376ef09862c2093edd908328be8423" - integrity sha512-a30VEBm4PEdx1dRB7MFK7BejejvCvBronbLjht+sHuGYj8PHs7M/5Z+rt5lw551vZ7yfTCj4Vuyy3mSJytDWRQ== - -graceful-fs@^4.1.15, graceful-fs@^4.2.2: +got@^9.6.0: + version "9.6.0" + resolved "https://registry.yarnpkg.com/got/-/got-9.6.0.tgz#edf45e7d67f99545705de1f7bbeeeb121765ed85" + integrity sha512-R7eWptXuGYxwijs0eV+v3o6+XH1IqVK8dJOEecQfTmkncw9AV4dcw/Dhxi8MdlqPthxxpZyizMzyg8RTmEsG+Q== + dependencies: + "@sindresorhus/is" "^0.14.0" + "@szmarczak/http-timer" "^1.1.2" + cacheable-request "^6.0.0" + decompress-response "^3.3.0" + duplexer3 "^0.1.4" + get-stream "^4.1.0" + lowercase-keys "^1.0.1" + mimic-response "^1.0.1" + p-cancelable "^1.0.0" + to-readable-stream "^1.0.0" + url-parse-lax "^3.0.0" + +graceful-fs@^4.1.11, graceful-fs@^4.1.15, graceful-fs@^4.1.2, graceful-fs@^4.1.6, graceful-fs@^4.2.0, graceful-fs@^4.2.2: version "4.2.4" resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.2.4.tgz#2256bde14d3632958c465ebc96dc467ca07a29fb" integrity sha512-WjKPNJF79dtJAVniUlGGWHYGz2jWxT6VhN/4m1NdkbZ2nOsEF+cI1Edgql5zCRhs/VsQYRvrXctxktVXZUkixw== @@ -4596,19 +4661,6 @@ handle-thing@^2.0.0: resolved "https://registry.yarnpkg.com/handle-thing/-/handle-thing-2.0.1.tgz#857f79ce359580c340d43081cc648970d0bb234e" integrity sha512-9Qn4yBxelxoh2Ow62nP+Ka/kMnOXRi8BXnRaUwezLNhqelnN49xKz4F/dPP8OYLxLxq6JDtZb2i9XznUQbNPTg== -har-schema@^2.0.0: - version "2.0.0" - resolved "https://registry.yarnpkg.com/har-schema/-/har-schema-2.0.0.tgz#a94c2224ebcac04782a0d9035521f24735b7ec92" - integrity sha1-qUwiJOvKwEeCoNkDVSHyRzW37JI= - -har-validator@~5.1.3: - version "5.1.3" - resolved "https://registry.yarnpkg.com/har-validator/-/har-validator-5.1.3.tgz#1ef89ebd3e4996557675eed9893110dc350fa080" - integrity sha512-sNvOCzEQNr/qrvJgc3UG/kD4QtlHycrzwS+6mfTrrSq97BvaYcPZZI1ZSqGSPR73Cxn4LKTD4PttRwfU7jWq5g== - dependencies: - ajv "^6.5.5" - har-schema "^2.0.0" - has-ansi@^2.0.0: version "2.0.0" resolved "https://registry.yarnpkg.com/has-ansi/-/has-ansi-2.0.0.tgz#34f5049ce1ecdf2b0649af3ef24e45ed35416d91" @@ -4662,6 +4714,11 @@ has-values@^1.0.0: is-number "^3.0.0" kind-of "^4.0.0" +has-yarn@^2.1.0: + version "2.1.0" + resolved "https://registry.yarnpkg.com/has-yarn/-/has-yarn-2.1.0.tgz#137e11354a7b5bf11aa5cb649cf0c6f3ff2b2e77" + integrity sha512-UqBRqi4ju7T+TqGNdqAO0PaSVGsDGJUBQvk9eUWNGRY1CFGDzYhLWoM7JQEemnlvVcv/YEmc2wNW8BC24EnUsw== + has@^1.0.0, has@^1.0.3: version "1.0.3" resolved "https://registry.yarnpkg.com/has/-/has-1.0.3.tgz#722d7cbfc1f6aa8241f16dd814e011e1f41e8796" @@ -4686,17 +4743,18 @@ hash.js@^1.0.0, hash.js@^1.0.3: inherits "^2.0.3" minimalistic-assert "^1.0.1" -hast-to-hyperscript@^7.0.0: - version "7.0.4" - resolved "https://registry.yarnpkg.com/hast-to-hyperscript/-/hast-to-hyperscript-7.0.4.tgz#7c4c037d9a8ea19b0a3fdb676a26448ad922353d" - integrity sha512-vmwriQ2H0RPS9ho4Kkbf3n3lY436QKLq6VaGA1pzBh36hBi3tm1DO9bR+kaJIbpT10UqaANDkMjxvjVfr+cnOA== +hast-to-hyperscript@^9.0.0: + version "9.0.0" + resolved "https://registry.yarnpkg.com/hast-to-hyperscript/-/hast-to-hyperscript-9.0.0.tgz#768fb557765fe28749169c885056417342d71e83" + integrity sha512-NJvMYU3GlMLs7hN3CRbsNlMzusVNkYBogVWDGybsuuVQ336gFLiD+q9qtFZT2meSHzln3pNISZWTASWothMSMg== dependencies: + "@types/unist" "^2.0.3" comma-separated-tokens "^1.0.0" property-information "^5.3.0" space-separated-tokens "^1.0.0" - style-to-object "^0.2.1" - unist-util-is "^3.0.0" - web-namespaces "^1.1.2" + style-to-object "^0.3.0" + unist-util-is "^4.0.0" + web-namespaces "^1.0.0" hast-util-from-parse5@^5.0.0: version "5.0.3" @@ -4709,31 +4767,45 @@ hast-util-from-parse5@^5.0.0: web-namespaces "^1.1.2" xtend "^4.0.1" +hast-util-from-parse5@^6.0.0: + version "6.0.0" + resolved "https://registry.yarnpkg.com/hast-util-from-parse5/-/hast-util-from-parse5-6.0.0.tgz#b38793c81e1a99f5fd592a4a88fc2731dccd0f30" + integrity sha512-3ZYnfKenbbkhhNdmOQqgH10vnvPivTdsOJCri+APn0Kty+nRkDHArnaX9Hiaf8H+Ig+vkNptL+SRY/6RwWJk1Q== + dependencies: + "@types/parse5" "^5.0.0" + ccount "^1.0.0" + hastscript "^5.0.0" + property-information "^5.0.0" + vfile "^4.0.0" + web-namespaces "^1.0.0" + hast-util-parse-selector@^2.0.0: version "2.2.4" resolved "https://registry.yarnpkg.com/hast-util-parse-selector/-/hast-util-parse-selector-2.2.4.tgz#60c99d0b519e12ab4ed32e58f150ec3f61ed1974" integrity sha512-gW3sxfynIvZApL4L07wryYF4+C9VvH3AUi7LAnVXV4MneGEgwOByXvFo18BgmTWnm7oHAe874jKbIB1YhHSIzA== -hast-util-raw@5.0.2: - version "5.0.2" - resolved "https://registry.yarnpkg.com/hast-util-raw/-/hast-util-raw-5.0.2.tgz#62288f311ec2f35e066a30d5e0277f963ad43a67" - integrity sha512-3ReYQcIHmzSgMq8UrDZHFL0oGlbuVGdLKs8s/Fe8BfHFAyZDrdv1fy/AGn+Fim8ZuvAHcJ61NQhVMtyfHviT/g== +hast-util-raw@6.0.0: + version "6.0.0" + resolved "https://registry.yarnpkg.com/hast-util-raw/-/hast-util-raw-6.0.0.tgz#49a38f5107d483f83a139709f2f705f22e7e7d32" + integrity sha512-IQo6tv3bMMKxk53DljswliucCJOQxaZFCuKEJ7X80249dmJ1nA9LtOnnylsLlqTG98NjQ+iGcoLAYo9q5FRhRg== dependencies: - hast-util-from-parse5 "^5.0.0" - hast-util-to-parse5 "^5.0.0" + "@types/hast" "^2.0.0" + hast-util-from-parse5 "^6.0.0" + hast-util-to-parse5 "^6.0.0" html-void-elements "^1.0.0" - parse5 "^5.0.0" + parse5 "^6.0.0" unist-util-position "^3.0.0" + vfile "^4.0.0" web-namespaces "^1.0.0" xtend "^4.0.0" zwitch "^1.0.0" -hast-util-to-parse5@^5.0.0: - version "5.1.2" - resolved "https://registry.yarnpkg.com/hast-util-to-parse5/-/hast-util-to-parse5-5.1.2.tgz#09d27bee9ba9348ea05a6cfcc44e02f9083969b6" - integrity sha512-ZgYLJu9lYknMfsBY0rBV4TJn2xiwF1fXFFjbP6EE7S0s5mS8LIKBVWzhA1MeIs1SWW6GnnE4In6c3kPb+CWhog== +hast-util-to-parse5@^6.0.0: + version "6.0.0" + resolved "https://registry.yarnpkg.com/hast-util-to-parse5/-/hast-util-to-parse5-6.0.0.tgz#1ec44650b631d72952066cea9b1445df699f8479" + integrity sha512-Lu5m6Lgm/fWuz8eWnrKezHtVY83JeRGaNQ2kn9aJgqaxvVkFCZQBEhgodZUDUvoodgyROHDb3r5IxAEdl6suJQ== dependencies: - hast-to-hyperscript "^7.0.0" + hast-to-hyperscript "^9.0.0" property-information "^5.0.0" web-namespaces "^1.0.0" xtend "^4.0.0" @@ -4780,14 +4852,6 @@ hmac-drbg@^1.0.0: minimalistic-assert "^1.0.0" minimalistic-crypto-utils "^1.0.1" -hogan.js@^3.0.2: - version "3.0.2" - resolved "https://registry.yarnpkg.com/hogan.js/-/hogan.js-3.0.2.tgz#4cd9e1abd4294146e7679e41d7898732b02c7bfd" - integrity sha1-TNnhq9QpQUbnZ55B14mHMrAse/0= - dependencies: - mkdirp "0.3.0" - nopt "1.0.10" - hoist-non-react-statics@^3.1.0: version "3.3.2" resolved "https://registry.yarnpkg.com/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz#ece0acaf71d62c2969c2ec59feff42a4b1a85b45" @@ -4880,6 +4944,11 @@ htmlparser2@^3.3.0, htmlparser2@^3.9.1: inherits "^2.0.1" readable-stream "^3.1.1" +http-cache-semantics@^4.0.0: + version "4.1.0" + resolved "https://registry.yarnpkg.com/http-cache-semantics/-/http-cache-semantics-4.1.0.tgz#49e91c5cbf36c9b94bcfcd71c23d5249ec74e390" + integrity sha512-carPklcUh7ROWRK7Cv27RPtdhYhUsela/ue5/jKzjegVvXDqM2ILE9Q2BGn9JZJh1g87cp56su/FgQSzcWS8cQ== + http-deceiver@^1.2.7: version "1.2.7" resolved "https://registry.yarnpkg.com/http-deceiver/-/http-deceiver-1.2.7.tgz#fa7168944ab9a519d337cb0bec7284dc3e723d87" @@ -4917,10 +4986,10 @@ http-errors@~1.7.2: statuses ">= 1.5.0 < 2" toidentifier "1.0.0" -"http-parser-js@>=0.4.0 <0.4.11": - version "0.4.10" - resolved "https://registry.yarnpkg.com/http-parser-js/-/http-parser-js-0.4.10.tgz#92c9c1374c35085f75db359ec56cc257cbb93fa4" - integrity sha1-ksnBN0w1CF912zWexWzCV8u5P6Q= +http-parser-js@>=0.5.1: + version "0.5.2" + resolved "https://registry.yarnpkg.com/http-parser-js/-/http-parser-js-0.5.2.tgz#da2e31d237b393aae72ace43882dd7e270a8ff77" + integrity sha512-opCO9ASqg5Wy2FNo7A0sxy71yGbbkJJXLdgMK04Tcypw9jr2MgWbyubb0+WdmDmGnFflO7fRbqbaihh/ENDlRQ== http-proxy-middleware@0.19.1: version "0.19.1" @@ -4941,15 +5010,6 @@ http-proxy@^1.17.0: follow-redirects "^1.0.0" requires-port "^1.0.0" -http-signature@~1.2.0: - version "1.2.0" - resolved "https://registry.yarnpkg.com/http-signature/-/http-signature-1.2.0.tgz#9aecd925114772f3d95b65a60abb8f7c18fbace1" - integrity sha1-muzZJRFHcvPZW2WmCruPfBj7rOE= - dependencies: - assert-plus "^1.0.0" - jsprim "^1.2.2" - sshpk "^1.7.0" - https-browserify@^1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/https-browserify/-/https-browserify-1.0.0.tgz#ec06c10e0a34c0f2faf199f7fd7fc78fffd03c73" @@ -4990,14 +5050,9 @@ ignore@^3.3.5: integrity sha512-Pgs951kaMm5GXP7MOvxERINe3gsaVjUWFm+UZPSq9xYriQAksyhg0csnS0KXSNRD5NmNdapXEpjxG49+AKh/ug== ignore@^5.1.1: - version "5.1.6" - resolved "https://registry.yarnpkg.com/ignore/-/ignore-5.1.6.tgz#643194ad4bf2712f37852e386b6998eff0db2106" - integrity sha512-cgXgkypZBcCnOgSihyeqbo6gjIaIyDqPQB7Ra4vhE9m6kigdGoQDMHjviFhRZo3IMlRy6yElosoviMs5YxZXUA== - -immediate@^3.2.3: - version "3.2.3" - resolved "https://registry.yarnpkg.com/immediate/-/immediate-3.2.3.tgz#d140fa8f614659bd6541233097ddaac25cdd991c" - integrity sha1-0UD6j2FGWb1lQSMwl92qwlzdmRw= + version "5.1.8" + resolved "https://registry.yarnpkg.com/ignore/-/ignore-5.1.8.tgz#f150a8b50a34289b33e22f5889abd4d8016f0e57" + integrity sha512-BMpfD7PpiETpBl/A6S498BaIJ6Y/ABT93ETbby2fP00v4EbvPBXWEoaR1UBPKs3iR53pJY7EtZk5KACI57i1Uw== immer@1.10.0: version "1.10.0" @@ -5034,6 +5089,11 @@ import-from@^2.1.0: dependencies: resolve-from "^3.0.0" +import-lazy@^2.1.0: + version "2.1.0" + resolved "https://registry.yarnpkg.com/import-lazy/-/import-lazy-2.1.0.tgz#05698e3d45c88e8d7e9d92cb0584e77f096f3e43" + integrity sha1-BWmOPUXIjo1+nZLLBYTnfwlvPkM= + import-local@^2.0.0: version "2.0.0" resolved "https://registry.yarnpkg.com/import-local/-/import-local-2.0.0.tgz#55070be38a5993cf18ef6db7e961f5bee5c5a09d" @@ -5090,7 +5150,7 @@ inherits@2.0.3: resolved "https://registry.yarnpkg.com/inherits/-/inherits-2.0.3.tgz#633c2c83e3da42a502f52466022480f4208261de" integrity sha1-Yzwsg+PaQqUC9SRmAiSA9CCCYd4= -ini@^1.3.5: +ini@^1.3.5, ini@~1.3.0: version "1.3.5" resolved "https://registry.yarnpkg.com/ini/-/ini-1.3.5.tgz#eee25f56db1c9ec6085e0c22778083f596abf927" integrity sha512-RZY5huIKCMRWDUqZlEi72f/lmXKMvuszcMBduliQ3nnWbx9X/ZBQO7DijMEYS9EhHBb2qacRUMtC7svLwe0lcw== @@ -5119,6 +5179,25 @@ inquirer@7.0.4: strip-ansi "^5.1.0" through "^2.3.6" +inquirer@^7.2.0: + version "7.3.3" + resolved "https://registry.yarnpkg.com/inquirer/-/inquirer-7.3.3.tgz#04d176b2af04afc157a83fd7c100e98ee0aad003" + integrity sha512-JG3eIAj5V9CwcGvuOmoo6LB9kbAYT8HXffUl6memuszlwDC/qvFAJw49XJ5NROSFNPxp3iQg1GqkFhaY/CR0IA== + dependencies: + ansi-escapes "^4.2.1" + chalk "^4.1.0" + cli-cursor "^3.1.0" + cli-width "^3.0.0" + external-editor "^3.0.3" + figures "^3.0.0" + lodash "^4.17.19" + mute-stream "0.0.8" + run-async "^2.4.0" + rxjs "^6.6.0" + string-width "^4.1.0" + strip-ansi "^6.0.0" + through "^2.3.6" + internal-ip@^4.3.0: version "4.3.0" resolved "https://registry.yarnpkg.com/internal-ip/-/internal-ip-4.3.0.tgz#845452baad9d2ca3b69c635a137acb9a0dad0907" @@ -5128,9 +5207,9 @@ internal-ip@^4.3.0: ipaddr.js "^1.9.0" interpret@^1.0.0: - version "1.2.0" - resolved "https://registry.yarnpkg.com/interpret/-/interpret-1.2.0.tgz#d5061a6224be58e8083985f5014d844359576296" - integrity sha512-mT34yGKMNceBQUoVn7iCDKDntA7SC6gycMAWzGx1z/CMCTV7b2AAtXlo3nRyHZ1FelRkQbQjprHSYGwzLtkVbw== + version "1.4.0" + resolved "https://registry.yarnpkg.com/interpret/-/interpret-1.4.0.tgz#665ab8bc4da27a774a40584e812e3e0fa45b1a1e" + integrity sha512-agE4QfB2Lkp9uICn7BAqoscw4SZP9kTE2hxiFI3jBPmXJfdqiahTbUuKGsMoN2GtqL9AxhYioAcVvgsb1HvRbA== invariant@^2.2.2, invariant@^2.2.4: version "2.2.4" @@ -5230,10 +5309,17 @@ is-buffer@^2.0.0: resolved "https://registry.yarnpkg.com/is-buffer/-/is-buffer-2.0.4.tgz#3e572f23c8411a5cfd9557c849e3665e0b290623" integrity sha512-Kq1rokWXOPXWuaMAqZiJW4XxsmD9zGx9q4aePabbn3qCRGedtH7Cm+zV8WETitMfu1wdh+Rvd6w5egwSngUX2A== -is-callable@^1.1.4, is-callable@^1.1.5: - version "1.1.5" - resolved "https://registry.yarnpkg.com/is-callable/-/is-callable-1.1.5.tgz#f7e46b596890456db74e7f6e976cb3273d06faab" - integrity sha512-ESKv5sMCJB2jnHTWZ3O5itG+O128Hsus4K4Qh1h2/cgn2vbgnLSVqfV46AeJA9D5EeeLa9w81KUXMtn34zhX+Q== +is-callable@^1.1.4, is-callable@^1.2.0: + version "1.2.0" + resolved "https://registry.yarnpkg.com/is-callable/-/is-callable-1.2.0.tgz#83336560b54a38e35e3a2df7afd0454d691468bb" + integrity sha512-pyVD9AaGLxtg6srb2Ng6ynWJqkHU9bEM087AKck0w8QwDarTfNcpIYoU8x8Hv2Icm8u6kFJM18Dag8lyqGkviw== + +is-ci@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/is-ci/-/is-ci-2.0.0.tgz#6bc6334181810e04b5c22b3d589fdca55026404c" + integrity sha512-YfJT7rkpQB0updsdHLGWrvhBJfcfzNNawYDNIyQXJz0IViGf75O8EBPKSdvw2rF+LGCsX4FZ8tcr3b19LcZq4w== + dependencies: + ci-info "^2.0.0" is-color-stop@^1.0.0: version "1.1.0" @@ -5295,9 +5381,9 @@ is-directory@^0.3.1: integrity sha1-YTObbyR1/Hcv2cnYP1yFddwVSuE= is-docker@^2.0.0: - version "2.0.0" - resolved "https://registry.yarnpkg.com/is-docker/-/is-docker-2.0.0.tgz#2cb0df0e75e2d064fe1864c37cdeacb7b2dcf25b" - integrity sha512-pJEdRugimx4fBMra5z2/5iRdZ63OhYV0vr0Dwm5+xtW4D1FvRkB8hamMIhnWfyJeDdyr/aa7BDyNbtG38VxgoQ== + version "2.1.1" + resolved "https://registry.yarnpkg.com/is-docker/-/is-docker-2.1.1.tgz#4125a88e44e450d384e09047ede71adc2d144156" + integrity sha512-ZOoqiXfEwtGknTiuDEy8pN2CfE3TxMHprvNer1mXiqwkOT77Rw3YVrUQ52EqAOU3QAWDQ+bQdx7HJzrv7LS2Hw== is-extendable@^0.1.0, is-extendable@^0.1.1: version "0.1.1" @@ -5345,6 +5431,19 @@ is-hexadecimal@^1.0.0: resolved "https://registry.yarnpkg.com/is-hexadecimal/-/is-hexadecimal-1.0.4.tgz#cc35c97588da4bd49a8eedd6bc4082d44dcb23a7" integrity sha512-gyPJuv83bHMpocVYoqof5VDiZveEoGoFL8m3BXNb2VW8Xs+rz9kqO8LOQ5DH6EsuvilT1ApazU0pyl+ytbPtlw== +is-installed-globally@^0.3.1: + version "0.3.2" + resolved "https://registry.yarnpkg.com/is-installed-globally/-/is-installed-globally-0.3.2.tgz#fd3efa79ee670d1187233182d5b0a1dd00313141" + integrity sha512-wZ8x1js7Ia0kecP/CHM/3ABkAmujX7WPvQk6uu3Fly/Mk44pySulQpnHG46OMjHGXApINnV4QhY3SWnECO2z5g== + dependencies: + global-dirs "^2.0.1" + is-path-inside "^3.0.1" + +is-npm@^4.0.0: + version "4.0.0" + resolved "https://registry.yarnpkg.com/is-npm/-/is-npm-4.0.0.tgz#c90dd8380696df87a7a6d823c20d0b12bbe3c84d" + integrity sha512-96ECIfh9xtDDlPylNPXhzjsykHsMJZ18ASpaWzQyBr4YRTcVjUvzaHayDAES2oU/3KpljhHUjtSRNiDwi0F0ig== + is-number@^3.0.0: version "3.0.0" resolved "https://registry.yarnpkg.com/is-number/-/is-number-3.0.0.tgz#24fd6201a4782cf50561c810276afc7d12d71195" @@ -5408,17 +5507,12 @@ is-plain-object@^2.0.1, is-plain-object@^2.0.3, is-plain-object@^2.0.4: dependencies: isobject "^3.0.1" -is-promise@^2.1.0: - version "2.1.0" - resolved "https://registry.yarnpkg.com/is-promise/-/is-promise-2.1.0.tgz#79a2a9ece7f096e80f36d2b2f3bc16c1ff4bf3fa" - integrity sha1-eaKp7OfwlugPNtKy87wWwf9L8/o= - -is-regex@^1.0.4, is-regex@^1.0.5: - version "1.0.5" - resolved "https://registry.yarnpkg.com/is-regex/-/is-regex-1.0.5.tgz#39d589a358bf18967f726967120b8fc1aed74eae" - integrity sha512-vlKW17SNq44owv5AQR3Cq0bQPEb8+kF3UKZ2fiZNOWtztYE5i0CzCZxFDwO58qAOWtxdBRVO/V5Qin1wjCqFYQ== +is-regex@^1.0.4, is-regex@^1.1.0: + version "1.1.1" + resolved "https://registry.yarnpkg.com/is-regex/-/is-regex-1.1.1.tgz#c6f98aacc546f6cec5468a07b7b153ab564a57b9" + integrity sha512-1+QkEcxiLlB7VEyFtyBg94e08OAsvq7FUBgApTq/w2ymCLyKJgDPsybBENVtA7XCQEgEXxKPonG+mvYRxh/LIg== dependencies: - has "^1.0.3" + has-symbols "^1.0.1" is-regexp@^1.0.0: version "1.0.0" @@ -5430,7 +5524,7 @@ is-resolvable@^1.0.0: resolved "https://registry.yarnpkg.com/is-resolvable/-/is-resolvable-1.1.0.tgz#fb18f87ce1feb925169c9a407c19318a3206ed88" integrity sha512-qgDYXFSR5WvEfuS5dMj6oTMEbrrSaM0CrFk2Yiq/gXnBvD9pMa2jGXxyhGLfvhZpuMZe18CJpFxAt3CRs42NMg== -is-root@2.1.0: +is-root@2.1.0, is-root@^2.1.0: version "2.1.0" resolved "https://registry.yarnpkg.com/is-root/-/is-root-2.1.0.tgz#809e18129cf1129644302a4f8544035d51984a9c" integrity sha512-AGOriNp96vNBd3HtU+RzFEc75FfR5ymiYv8E553I71SCeXBiMsVDUtdio1OEFvrPyLIQ9tVR5RxXIFe5PUFjMg== @@ -5459,7 +5553,7 @@ is-symbol@^1.0.2: dependencies: has-symbols "^1.0.1" -is-typedarray@~1.0.0: +is-typedarray@^1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/is-typedarray/-/is-typedarray-1.0.0.tgz#e479c80858df0c1b11ddda6940f96011fcda4a9a" integrity sha1-5HnICFjfDBsR3dppQPlgEfzaSpo= @@ -5491,6 +5585,11 @@ is-wsl@^2.1.1: dependencies: is-docker "^2.0.0" +is-yarn-global@^0.3.0: + version "0.3.0" + resolved "https://registry.yarnpkg.com/is-yarn-global/-/is-yarn-global-0.3.0.tgz#d502d3382590ea3004893746754c89139973e232" + integrity sha512-VjSeb/lHmkoyd8ryPVIKvOCn4D1koMqY+vqyjjUfc3xyKtP4dYOxM44sZrnqQSzSds3xyOrUTLTC9LVCVgLngw== + isarray@0.0.1: version "0.0.1" resolved "https://registry.yarnpkg.com/isarray/-/isarray-0.0.1.tgz#8a18acfca9a8f4177e09abfc6038939b05d1eedf" @@ -5501,11 +5600,6 @@ isarray@1.0.0, isarray@^1.0.0, isarray@~1.0.0: resolved "https://registry.yarnpkg.com/isarray/-/isarray-1.0.0.tgz#bb935d48582cba168c06834957a54a3e07124f11" integrity sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE= -isarray@^2.0.1: - version "2.0.5" - resolved "https://registry.yarnpkg.com/isarray/-/isarray-2.0.5.tgz#8af1e4c1221244cc62459faf38940d4e644a5723" - integrity sha512-xHjhDr3cNBK0BzdUJSPXZntQUx/mwMS5Rw4A7lPJ90XGAO6ISP/ePDNuo0vhqOZU+UD5JoodwCAAoZQd3FeAKw== - isexe@^2.0.0: version "2.0.0" resolved "https://registry.yarnpkg.com/isexe/-/isexe-2.0.0.tgz#e8fbf374dc556ff8947a10dcb0572d633f2cfa10" @@ -5523,11 +5617,6 @@ isobject@^3.0.0, isobject@^3.0.1: resolved "https://registry.yarnpkg.com/isobject/-/isobject-3.0.1.tgz#4e431e92b11a9731636aa1f9c8d1ccbcfdab78df" integrity sha1-TkMekrEalzFjaqH5yNHMvP2reN8= -isstream@~0.1.2: - version "0.1.2" - resolved "https://registry.yarnpkg.com/isstream/-/isstream-0.1.2.tgz#47e63f7af55afa6f92e1500e690eb8b8529c099a" - integrity sha1-R+Y/evVa+m+S4VAOaQ64uFKcCZo= - jest-worker@^25.4.0: version "25.5.0" resolved "https://registry.yarnpkg.com/jest-worker/-/jest-worker-25.5.0.tgz#2611d071b79cea0f43ee57a3d118593ac1547db1" @@ -5546,7 +5635,7 @@ js-tokens@^3.0.2: resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-3.0.2.tgz#9866df395102130e38f7f996bceb65443209c25b" integrity sha1-mGbfOVECEw449/mWvOtlRDIJwls= -js-yaml@^3.11.0: +js-yaml@^3.11.0, js-yaml@^3.13.1: version "3.14.0" resolved "https://registry.yarnpkg.com/js-yaml/-/js-yaml-3.14.0.tgz#a7a34170f26a21bb162424d8adacb4113a69e482" integrity sha512-/4IbIeHcD9VMHFqDR/gQ7EdZdLimOvW2DdcxFjdyyZ9NsbS+ccrXqVWDtab/lRl5AlUqmpBx8EhPaWR+OtY17A== @@ -5554,19 +5643,6 @@ js-yaml@^3.11.0: argparse "^1.0.7" esprima "^4.0.0" -js-yaml@^3.13.1: - version "3.13.1" - resolved "https://registry.yarnpkg.com/js-yaml/-/js-yaml-3.13.1.tgz#aff151b30bfdfa8e49e05da22e7415e9dfa37847" - integrity sha512-YfbcO7jXDdyj0DGxYVSlSeQNHbD7XPWvrVWeVUujrQEoZzWJIRrCPoyk6kL6IAjAG2IolMK4T0hNUe0HOUs5Jw== - dependencies: - argparse "^1.0.7" - esprima "^4.0.0" - -jsbn@~0.1.0: - version "0.1.1" - resolved "https://registry.yarnpkg.com/jsbn/-/jsbn-0.1.1.tgz#a5e654c2e5a2deb5f201d96cefbca80c0ef2f513" - integrity sha1-peZUwuWi3rXyAdls77yoDA7y9RM= - jsesc@^2.5.1: version "2.5.2" resolved "https://registry.yarnpkg.com/jsesc/-/jsesc-2.5.2.tgz#80564d2e483dacf6e8ef209650a67df3f0c283a4" @@ -5577,26 +5653,26 @@ jsesc@~0.5.0: resolved "https://registry.yarnpkg.com/jsesc/-/jsesc-0.5.0.tgz#e7dee66e35d6fc16f710fe91d5cf69f70f08911d" integrity sha1-597mbjXW/Bb3EP6R1c9p9w8IkR0= +json-buffer@3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/json-buffer/-/json-buffer-3.0.0.tgz#5b1f397afc75d677bde8bcfc0e47e1f9a3d9a898" + integrity sha1-Wx85evx11ne96Lz8Dkfh+aPZqJg= + json-parse-better-errors@^1.0.1, json-parse-better-errors@^1.0.2: version "1.0.2" resolved "https://registry.yarnpkg.com/json-parse-better-errors/-/json-parse-better-errors-1.0.2.tgz#bb867cfb3450e69107c131d1c514bab3dc8bcaa9" integrity sha512-mrqyZKfX5EhL7hvqcV6WG1yYjnjeuYDzDhhcAAUrq8Po85NBQBJP+ZDUT75qZQ98IkUoBqdkExkukOU7Ts2wrw== +json-parse-even-better-errors@^2.3.0: + version "2.3.0" + resolved "https://registry.yarnpkg.com/json-parse-even-better-errors/-/json-parse-even-better-errors-2.3.0.tgz#371873c5ffa44304a6ba12419bcfa95f404ae081" + integrity sha512-o3aP+RsWDJZayj1SbHNQAI8x0v3T3SKiGoZlNYfbUP1S3omJQ6i9CnqADqkSPaOAxwua4/1YWx5CM7oiChJt2Q== + json-schema-traverse@^0.4.1: version "0.4.1" resolved "https://registry.yarnpkg.com/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz#69f6a87d9513ab8bb8fe63bdb0979c448e684660" integrity sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg== -json-schema@0.2.3: - version "0.2.3" - resolved "https://registry.yarnpkg.com/json-schema/-/json-schema-0.2.3.tgz#b480c892e59a2f05954ce727bd3f2a4e882f9e13" - integrity sha1-tIDIkuWaLwWVTOcnvT8qTogvnhM= - -json-stringify-safe@~5.0.1: - version "5.0.1" - resolved "https://registry.yarnpkg.com/json-stringify-safe/-/json-stringify-safe-5.0.1.tgz#1296a2d58fd45f19a0f6ce01d65701e2c735b6eb" - integrity sha1-Epai1Y/UXxmg9s4B1lcB4sc1tus= - json3@^3.3.2: version "3.3.3" resolved "https://registry.yarnpkg.com/json3/-/json3-3.3.3.tgz#7fc10e375fc5ae42c4705a5cc0aa6f62be305b81" @@ -5623,15 +5699,12 @@ jsonfile@^4.0.0: optionalDependencies: graceful-fs "^4.1.6" -jsprim@^1.2.2: - version "1.4.1" - resolved "https://registry.yarnpkg.com/jsprim/-/jsprim-1.4.1.tgz#313e66bc1e5cc06e438bc1b7499c2e5c56acb6a2" - integrity sha1-MT5mvB5cwG5Di8G3SZwuXFastqI= +keyv@^3.0.0: + version "3.1.0" + resolved "https://registry.yarnpkg.com/keyv/-/keyv-3.1.0.tgz#ecc228486f69991e49e9476485a5be1e8fc5c4d9" + integrity sha512-9ykJ/46SN/9KPM/sichzQ7OvXyGDYKGTaDlKMGCAlg2UK8KRy4jb0d8sFc+0Tt0YYnThq8X2RZgCg74RPxgcVA== dependencies: - assert-plus "1.0.0" - extsprintf "1.3.0" - json-schema "0.2.3" - verror "1.10.0" + json-buffer "3.0.0" killable@^1.0.1: version "1.0.1" @@ -5677,6 +5750,13 @@ last-call-webpack-plugin@^3.0.0: lodash "^4.17.5" webpack-sources "^1.1.0" +latest-version@^5.0.0: + version "5.1.0" + resolved "https://registry.yarnpkg.com/latest-version/-/latest-version-5.1.0.tgz#119dfe908fe38d15dfa43ecd13fa12ec8832face" + integrity sha512-weT+r0kTkRQdCdYCNtkMwWXQTMEswKrFBkm4ckQOMVhhqhIMI1UT2hMj+1iigIhgSZm5gTmrRXBNoGUgaTY1xA== + dependencies: + package-json "^6.3.0" + lazy-cache@^0.2.3: version "0.2.7" resolved "https://registry.yarnpkg.com/lazy-cache/-/lazy-cache-0.2.7.tgz#7feddf2dcb6edb77d11ef1d117ab5ffdf0ab1b65" @@ -5704,11 +5784,6 @@ lines-and-columns@^1.1.6: resolved "https://registry.yarnpkg.com/lines-and-columns/-/lines-and-columns-1.1.6.tgz#1c00c743b433cd0a4e80758f7b64a57440d9ff00" integrity sha1-HADHQ7QzzQpOgHWPe2SldEDZ/wA= -load-script@^1.0.0: - version "1.0.0" - resolved "https://registry.yarnpkg.com/load-script/-/load-script-1.0.0.tgz#0491939e0bee5643ee494a7e3da3d2bac70c6ca4" - integrity sha1-BJGTngvuVkPuSUp+PaPSuscMbKQ= - loader-runner@^2.4.0: version "2.4.0" resolved "https://registry.yarnpkg.com/loader-runner/-/loader-runner-2.4.0.tgz#ed47066bfe534d7e84c4c7b9998c2a75607d9357" @@ -5741,14 +5816,6 @@ loader-utils@^2.0.0: emojis-list "^3.0.0" json5 "^2.1.2" -locate-path@^2.0.0: - version "2.0.0" - resolved "https://registry.yarnpkg.com/locate-path/-/locate-path-2.0.0.tgz#2b568b265eec944c6d9c0de9c3dbbbca0354cd8e" - integrity sha1-K1aLJl7slExtnA3pw9u7ygNUzY4= - dependencies: - p-locate "^2.0.0" - path-exists "^3.0.0" - locate-path@^3.0.0: version "3.0.0" resolved "https://registry.yarnpkg.com/locate-path/-/locate-path-3.0.0.tgz#dbec3b3ab759758071b58fe59fc41871af21400e" @@ -5884,7 +5951,7 @@ lodash.some@^4.4.0: resolved "https://registry.yarnpkg.com/lodash.some/-/lodash.some-4.6.0.tgz#1bb9f314ef6b8baded13b549169b2a945eb68e4d" integrity sha1-G7nzFO9ri63tE7VJFpsqlF62jk0= -lodash.sortby@^4.7.0: +lodash.sortby@^4.6.0, lodash.sortby@^4.7.0: version "4.7.0" resolved "https://registry.yarnpkg.com/lodash.sortby/-/lodash.sortby-4.7.0.tgz#edd14c824e2cc9c1e0b0a1b42bb5210516a42438" integrity sha1-7dFMgk4sycHgsKG0K7UhBRakJDg= @@ -5914,10 +5981,10 @@ lodash.uniq@4.5.0, lodash.uniq@^4.5.0: resolved "https://registry.yarnpkg.com/lodash.uniq/-/lodash.uniq-4.5.0.tgz#d0225373aeb652adc1bc82e4945339a842754773" integrity sha1-0CJTc662Uq3BvILklFM5qEJ1R3M= -lodash@^4.17.11, lodash@^4.17.13, lodash@^4.17.14, lodash@^4.17.15, lodash@^4.17.5: - version "4.17.19" - resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.19.tgz#e48ddedbe30b3321783c5b4301fbd353bc1e4a4b" - integrity sha512-JNvd8XER9GQX0v2qJgsaN/mzFCNA5BRe/j8JN9d+tWyGLSodKQHKFicdwNYzWwI3wjRnaKPsGj1XkBjx/F96DQ== +lodash@^4.17.11, lodash@^4.17.14, lodash@^4.17.15, lodash@^4.17.19, lodash@^4.17.5, lodash@^4.5.2: + version "4.17.20" + resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.20.tgz#b44a9b6297bcb698f1c51a3545a2b3b368d59c52" + integrity sha512-PlhdFcillOINfeV7Ni6oF1TAEayyZBoZ8bcshTHqOYJYlrqzRK5hagpagky5o4HfCzzd1TRkXPMFq6cKk9rGmA== loglevel@^1.6.8: version "1.6.8" @@ -5938,6 +6005,16 @@ lower-case@^2.0.1: dependencies: tslib "^1.10.0" +lowercase-keys@^1.0.0, lowercase-keys@^1.0.1: + version "1.0.1" + resolved "https://registry.yarnpkg.com/lowercase-keys/-/lowercase-keys-1.0.1.tgz#6f9e30b47084d971a7c820ff15a6c5167b74c26f" + integrity sha512-G2Lj61tXDnVFFOi8VZds+SoQjtQC3dgokKdDG2mTm1tx4m50NUHBOZSBwQQHyy0V12A0JTG4icfZQH+xPyh8VA== + +lowercase-keys@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/lowercase-keys/-/lowercase-keys-2.0.0.tgz#2603e78b7b4b0006cbca2fbcc8a3202558ac9479" + integrity sha512-tqNXrS78oMOE73NMxK4EMLQsQowWf8jKooH9g7xPavRT706R6bkQJ6DY2Te7QukaZsulxa30wQ7bk0pm4XiHmA== + lru-cache@^5.1.1: version "5.1.1" resolved "https://registry.yarnpkg.com/lru-cache/-/lru-cache-5.1.1.tgz#1da27e6710271947695daf6848e847f01d84b920" @@ -5953,7 +6030,7 @@ make-dir@^2.0.0: pify "^4.0.1" semver "^5.6.0" -make-dir@^3.0.2: +make-dir@^3.0.0, make-dir@^3.0.2: version "3.1.0" resolved "https://registry.yarnpkg.com/make-dir/-/make-dir-3.1.0.tgz#415e967046b3a7f1d185277d84aa58203726a13f" integrity sha512-g3FeP20LNwhALb/6Cz6Dd4F2ngze0jz7tbzrD2wAV+o9FeNHe4rL+yK2md0J/fiSf1sa1ADhXqi5+oVwOM/eGw== @@ -6078,9 +6155,9 @@ merge-stream@^2.0.0: integrity sha512-abv/qOcuPfk3URPfDzmZU1LKmuw8kT+0nIHvKrKgFrwifol/doWcdA4ZqsWQ8ENrFKkd67Mfpo/LovbIUsbt3w== merge2@^1.2.3, merge2@^1.3.0: - version "1.3.0" - resolved "https://registry.yarnpkg.com/merge2/-/merge2-1.3.0.tgz#5b366ee83b2f1582c48f87e47cf1a9352103ca81" - integrity sha512-2j4DAdlBOkiSZIsaXk4mTE3sRS02yBHAtfy127xRV3bQUFqXkjHCHLW6Scv7DwNRbIWNHH8zpnz9zMaKXIdvYw== + version "1.4.1" + resolved "https://registry.yarnpkg.com/merge2/-/merge2-1.4.1.tgz#4368892f885e907455a6fd7dc55c0c9d404990ae" + integrity sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg== methods@~1.1.2: version "1.1.2" @@ -6127,24 +6204,24 @@ miller-rabin@^4.0.0: bn.js "^4.0.0" brorand "^1.0.1" -mime-db@1.43.0: - version "1.43.0" - resolved "https://registry.yarnpkg.com/mime-db/-/mime-db-1.43.0.tgz#0a12e0502650e473d735535050e7c8f4eb4fae58" - integrity sha512-+5dsGEEovYbT8UY9yD7eE4XTc4UwJ1jBYlgaQQF38ENsKR3wj/8q8RFZrF9WIZpB2V1ArTVFUva8sAul1NzRzQ== - mime-db@1.44.0, "mime-db@>= 1.43.0 < 2": version "1.44.0" resolved "https://registry.yarnpkg.com/mime-db/-/mime-db-1.44.0.tgz#fa11c5eb0aca1334b4233cb4d52f10c5a6272f92" integrity sha512-/NOTfLrsPBVeH7YtFPgsVWveuL+4SjjYxaQ1xtM1KMFj7HdxlBlxeyNLzhyJVx7r4rZGJAZ/6lkKCitSc/Nmpg== -mime-types@^2.1.12, mime-types@~2.1.19, mime-types@~2.1.24: - version "2.1.26" - resolved "https://registry.yarnpkg.com/mime-types/-/mime-types-2.1.26.tgz#9c921fc09b7e149a65dfdc0da4d20997200b0a06" - integrity sha512-01paPWYgLrkqAyrlDorC1uDwl2p3qZT7yl806vW7DvDoxwXi46jsjFbg+WdwotBIk6/MbEhO/dh5aZ5sNj/dWQ== +mime-db@~1.33.0: + version "1.33.0" + resolved "https://registry.yarnpkg.com/mime-db/-/mime-db-1.33.0.tgz#a3492050a5cb9b63450541e39d9788d2272783db" + integrity sha512-BHJ/EKruNIqJf/QahvxwQZXKygOQ256myeN/Ew+THcAa5q+PjyTTMMeNQC4DZw5AwfvelsUrA6B67NKMqXDbzQ== + +mime-types@2.1.18: + version "2.1.18" + resolved "https://registry.yarnpkg.com/mime-types/-/mime-types-2.1.18.tgz#6f323f60a83d11146f831ff11fd66e2fe5503bb8" + integrity sha512-lc/aahn+t4/SWV/qcmumYjymLsWfN3ELhpmVuUFjgsORruuZPVSwAQryq+HHGvO/SI2KVX26bx+En+zhM8g8hQ== dependencies: - mime-db "1.43.0" + mime-db "~1.33.0" -mime-types@~2.1.17: +mime-types@^2.1.26, mime-types@~2.1.17, mime-types@~2.1.24: version "2.1.27" resolved "https://registry.yarnpkg.com/mime-types/-/mime-types-2.1.27.tgz#47949f98e279ea53119f5722e0f34e529bec009f" integrity sha512-JIhqnCasI9yD+SsmkquHBxTSEuZdQX5BuQnS2Vc7puQQQ+8yiP5AY5uWhpdv4YL4VM5c6iliiYWPgJ/nJQLp7w== @@ -6166,12 +6243,10 @@ mimic-fn@^2.1.0: resolved "https://registry.yarnpkg.com/mimic-fn/-/mimic-fn-2.1.0.tgz#7ed2c2ccccaf84d3ffcb7a69b57711fc2083401b" integrity sha512-OqbOk5oEQeAZ8WXWydlu9HJjz9WVdEIvamMCcXmuqUYjTknH/sqsWvhQ3vgwKFRR1HpjvNBKQ37nbJgYzGqGcg== -min-document@^2.19.0: - version "2.19.0" - resolved "https://registry.yarnpkg.com/min-document/-/min-document-2.19.0.tgz#7bd282e3f5842ed295bb748cdd9f1ffa2c824685" - integrity sha1-e9KC4/WELtKVu3SM3Z8f+iyCRoU= - dependencies: - dom-walk "^0.1.0" +mimic-response@^1.0.0, mimic-response@^1.0.1: + version "1.0.1" + resolved "https://registry.yarnpkg.com/mimic-response/-/mimic-response-1.0.1.tgz#4923538878eef42063cb8a3e3b0798781487ab1b" + integrity sha512-j5EctnkH7amfV/q5Hgmoal1g2QHFJRraOtmx0JpIqkxhBhI/lJSl1nMpQ45hVarwNETOoWEimndZ4QK0RHxuxQ== mini-create-react-context@^0.4.0: version "0.4.0" @@ -6228,9 +6303,9 @@ minipass-flush@^1.0.5: minipass "^3.0.0" minipass-pipeline@^1.2.2: - version "1.2.3" - resolved "https://registry.yarnpkg.com/minipass-pipeline/-/minipass-pipeline-1.2.3.tgz#55f7839307d74859d6e8ada9c3ebe72cec216a34" - integrity sha512-cFOknTvng5vqnwOpDsZTWhNll6Jf8o2x+/diplafmxpuIymAjzoOolZG0VvQf3V2HgqzJNhnuKHYp2BqDgz8IQ== + version "1.2.4" + resolved "https://registry.yarnpkg.com/minipass-pipeline/-/minipass-pipeline-1.2.4.tgz#68472f79711c084657c067c5c6ad93cddea8214c" + integrity sha512-xuIq7cIOt09RPRJ19gdi4b+RiNvDFYe5JH+ggNvBqGqpQXcru3PcRmOZuHBKWK1Txf9+cQ+HMVN4d6z46LZP7A== dependencies: minipass "^3.0.0" @@ -6273,12 +6348,7 @@ mixin-object@^2.0.1: for-in "^0.1.3" is-extendable "^0.1.1" -mkdirp@0.3.0: - version "0.3.0" - resolved "https://registry.yarnpkg.com/mkdirp/-/mkdirp-0.3.0.tgz#1bbf5ab1ba827af23575143490426455f481fe1e" - integrity sha1-G79asbqCevI1dRQ0kEJkVfSB/h4= - -mkdirp@^0.5.1, mkdirp@^0.5.3, mkdirp@~0.5.1: +mkdirp@^0.5.1, mkdirp@^0.5.3, mkdirp@^0.5.5, mkdirp@~0.5.1: version "0.5.5" resolved "https://registry.yarnpkg.com/mkdirp/-/mkdirp-0.5.5.tgz#d91cefd62d1436ca0f41620e251288d420099def" integrity sha512-NKmAlESf6jMGym1++R0Ra7wvhV+wFW63FaSOFPwRahvea0gMUcGUhVeAg/0BC0wiv9ih5NYPB1Wn1UEI1/L+xQ== @@ -6331,9 +6401,9 @@ mute-stream@0.0.8: integrity sha512-nnbWWOkoWyUsTjKrhgD0dcz22mdkSnpYqbEjIm2nhwhuxlSkpywJmBo8h0ZqJdkp73mb90SssHkN4rsRaBAfAA== nan@^2.12.1: - version "2.14.0" - resolved "https://registry.yarnpkg.com/nan/-/nan-2.14.0.tgz#7818f722027b2459a86f0295d434d1fc2336c52c" - integrity sha512-INOFj37C7k3AfaNTtX8RhsTw7qRy7eLET14cROi9+5HAVbbHuIWUHEauBv5qT4Av2tWasiTY1Jw6puUNqRJXQg== + version "2.14.1" + resolved "https://registry.yarnpkg.com/nan/-/nan-2.14.1.tgz#d7be34dfa3105b91494c3147089315eff8874b01" + integrity sha512-isWHgVjnFjh2x2yuJ/tj3JbwoHu3UC2dX5G/88Cm24yB6YopVgxvBObDY7n5xW6ExmFhJpSEQqFPvq9zaXc8Jw== nanomatch@^1.2.9: version "1.2.13" @@ -6358,9 +6428,9 @@ negotiator@0.6.2: integrity sha512-hZXc7K2e+PgeI1eDBe/10Ard4ekbfrrqG8Ep+8Jmf4JID2bNg7NvCPOZN+kfF574pFQI7mum2AUqDidoKqcTOw== neo-async@^2.5.0, neo-async@^2.6.1: - version "2.6.1" - resolved "https://registry.yarnpkg.com/neo-async/-/neo-async-2.6.1.tgz#ac27ada66167fa8849a6addd837f6b189ad2081c" - integrity sha512-iyam8fBuCUpWeKPGpaNMetEocMt364qkCsfL9JuhjXX6dRnguRVOfk2GZaDpPjcOKiiXCPINZC1GczQ7iTq3Zw== + version "2.6.2" + resolved "https://registry.yarnpkg.com/neo-async/-/neo-async-2.6.2.tgz#b4aafb93e3aeb2d8174ca53cf163ab7d7308305f" + integrity sha512-Yd3UES5mWCSqR+qNT93S3UoYUkqAZ9lLg8a7g9rimsWmYGK8cVToA4/sF3RrshdyV3sAGMXVUmpMYOw+dLpOuw== nice-try@^1.0.4: version "1.0.5" @@ -6416,22 +6486,10 @@ node-libs-browser@^2.2.1: util "^0.11.0" vm-browserify "^1.0.1" -node-releases@^1.1.52: - version "1.1.57" - resolved "https://registry.yarnpkg.com/node-releases/-/node-releases-1.1.57.tgz#f6754ce225fad0611e61228df3e09232e017ea19" - integrity sha512-ZQmnWS7adi61A9JsllJ2gdj2PauElcjnOwTp2O011iGzoakTxUsDGSe+6vD7wXbKdqhSFymC0OSx35aAMhrSdw== - -node-releases@^1.1.53: - version "1.1.53" - resolved "https://registry.yarnpkg.com/node-releases/-/node-releases-1.1.53.tgz#2d821bfa499ed7c5dffc5e2f28c88e78a08ee3f4" - integrity sha512-wp8zyQVwef2hpZ/dJH7SfSrIPD6YoJz6BDQDpGEkcA0s3LpAQoxBIYmfIq6QAhC1DhwsyCgTaTTcONwX8qzCuQ== - -nopt@1.0.10: - version "1.0.10" - resolved "https://registry.yarnpkg.com/nopt/-/nopt-1.0.10.tgz#6ddd21bd2a31417b92727dd585f8a6f37608ebee" - integrity sha1-bd0hvSoxQXuScn3Vhfim83YI6+4= - dependencies: - abbrev "1" +node-releases@^1.1.52, node-releases@^1.1.60: + version "1.1.60" + resolved "https://registry.yarnpkg.com/node-releases/-/node-releases-1.1.60.tgz#6948bdfce8286f0b5d0e5a88e8384e954dfe7084" + integrity sha512-gsO4vjEdQaTusZAEebUWp2a5d7dF5DYoIpDG7WySnk7BuZDW+GPpHXoXXuYawRBr/9t5q54tirPz79kFIWg4dA== normalize-path@^2.1.1: version "2.1.1" @@ -6465,6 +6523,11 @@ normalize-url@^3.0.0: resolved "https://registry.yarnpkg.com/normalize-url/-/normalize-url-3.3.0.tgz#b2e1c4dc4f7c6d57743df733a4f5978d18650559" integrity sha512-U+JJi7duF1o+u2pynbp2zXDW2/PADgC30f0GsHZtRh+HOcXHnw137TrNlyxxRvWW5fjKd3bcLHPxofWuCjaeZg== +normalize-url@^4.1.0: + version "4.5.0" + resolved "https://registry.yarnpkg.com/normalize-url/-/normalize-url-4.5.0.tgz#453354087e6ca96957bd8f5baf753f5982142129" + integrity sha512-2s47yzUxdexf1OhyRi4Em83iQk0aPvwTddtFz4hnSSw9dCEsLEGf6SwIO8ss/19S9iBb5sJaOuTvTGDeZI00BQ== + npm-run-path@^2.0.0: version "2.0.2" resolved "https://registry.yarnpkg.com/npm-run-path/-/npm-run-path-2.0.2.tgz#35a9232dfa35d7067b4cb2ddf2357b1871536c5f" @@ -6504,11 +6567,6 @@ num2fraction@^1.2.2: resolved "https://registry.yarnpkg.com/num2fraction/-/num2fraction-1.2.2.tgz#6f682b6a027a4e9ddfa4564cd2589d1d4e669ede" integrity sha1-b2gragJ6Tp3fpFZM0lidHU5mnt4= -oauth-sign@~0.9.0: - version "0.9.0" - resolved "https://registry.yarnpkg.com/oauth-sign/-/oauth-sign-0.9.0.tgz#47a7b016baa68b5fa0ecf3dee08a85c679ac6455" - integrity sha512-fexhUFFPTGV8ybAtSIGbV6gOkSv8UtRbDBnAyLQw4QPKkgNlsH2ByPGtMUqdWkos6YCRmAqViwgZrJc/mRDzZQ== - object-assign@^4.0.1, object-assign@^4.1.0, object-assign@^4.1.1: version "4.1.1" resolved "https://registry.yarnpkg.com/object-assign/-/object-assign-4.1.1.tgz#2109adc7965887cfc05cbbd442cac8bfbb360863" @@ -6524,9 +6582,9 @@ object-copy@^0.1.0: kind-of "^3.0.3" object-inspect@^1.7.0: - version "1.7.0" - resolved "https://registry.yarnpkg.com/object-inspect/-/object-inspect-1.7.0.tgz#f4f6bd181ad77f006b5ece60bd0b6f398ff74a67" - integrity sha512-a7pEHdh1xKIAgTySUGgLMx/xwDZskN1Ud6egYYN3EdRW4ZMPNEDUTF+hwy2LUC+Bl+SyLXANnwz/jyh/qutKUw== + version "1.8.0" + resolved "https://registry.yarnpkg.com/object-inspect/-/object-inspect-1.8.0.tgz#df807e5ecf53a609cc6bfe93eac3cc7be5b3a9d0" + integrity sha512-jLdtEOB112fORuypAyl/50VRVIBIdVQOSUUGQHzJ4xBSbit81zRarz7GThkEFZy1RceYrWYcPcBFPQwHyAc1gA== object-is@^1.0.1: version "1.1.2" @@ -6536,7 +6594,7 @@ object-is@^1.0.1: define-properties "^1.1.3" es-abstract "^1.17.5" -object-keys@^1.0.11, object-keys@^1.0.12, object-keys@^1.1.0, object-keys@^1.1.1: +object-keys@^1.0.11, object-keys@^1.0.12, object-keys@^1.1.1: version "1.1.1" resolved "https://registry.yarnpkg.com/object-keys/-/object-keys-1.1.1.tgz#1c47f272df277f3b1daf061677d9c82e2322c60e" integrity sha512-NuAESUOUMrlIXOfHKzD6bpPu3tYt3xvjNdRIQ+FeT0lNb4K8WR70CaDxhuNguS2XG+GjkyMwOzsN5ZktImfhLA== @@ -6608,16 +6666,16 @@ once@^1.3.0, once@^1.3.1, once@^1.4.0: wrappy "1" onetime@^5.1.0: - version "5.1.0" - resolved "https://registry.yarnpkg.com/onetime/-/onetime-5.1.0.tgz#fff0f3c91617fe62bb50189636e99ac8a6df7be5" - integrity sha512-5NcSkPHhwTVFIQN+TUqXoS5+dlElHXdpAWu9I0HP20YOtIi+aZ0Ct82jdlILDxjLEAWwvm+qj1m6aEtsDVmm6Q== + version "5.1.2" + resolved "https://registry.yarnpkg.com/onetime/-/onetime-5.1.2.tgz#d0e96ebb56b07476df1dd9c4806e5237985ca45e" + integrity sha512-kbpaSSGJTWdAY5KPVeMOKXSrPtr8C8C7wodJbcsd51jRnmD+GZu8Y0VoU6Dm5Z4vWr0Ig/1NKuWRKf7j5aaYSg== dependencies: mimic-fn "^2.1.0" open@^7.0.2: - version "7.0.4" - resolved "https://registry.yarnpkg.com/open/-/open-7.0.4.tgz#c28a9d315e5c98340bf979fdcb2e58664aa10d83" - integrity sha512-brSA+/yq+b08Hsr4c8fsEW2CRzk1BmfN3SAK/5VCHQ9bdoZJ4qa/+AfR0xHjlbbZUyPkUHs1b8x1RqdyZdkVqQ== + version "7.2.0" + resolved "https://registry.yarnpkg.com/open/-/open-7.2.0.tgz#212959bd7b0ce2e8e3676adc76e3cf2f0a2498b4" + integrity sha512-4HeyhxCvBTI5uBePsAdi55C5fmqnWZ2e2MlmvWi5KW5tdH5rxoiv/aMtbeVxKZc3eWkT1GymMnLG8XC4Rq4TDQ== dependencies: is-docker "^2.0.0" is-wsl "^2.1.1" @@ -6659,6 +6717,11 @@ os-tmpdir@~1.0.2: resolved "https://registry.yarnpkg.com/os-tmpdir/-/os-tmpdir-1.0.2.tgz#bbe67406c79aa85c5cfec766fe5734555dfa1274" integrity sha1-u+Z0BseaqFxc/sdm/lc0VV36EnQ= +p-cancelable@^1.0.0: + version "1.1.0" + resolved "https://registry.yarnpkg.com/p-cancelable/-/p-cancelable-1.1.0.tgz#d078d15a3af409220c886f1d9a0ca2e441ab26cc" + integrity sha512-s73XxOZ4zpt1edZYZzvhqFa6uvQc1vwUa0K0BdtIZgQMAJj9IbebH+JkgKZc9h+B05PKHLOTl4ajG1BmNrVZlw== + p-finally@^1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/p-finally/-/p-finally-1.0.0.tgz#3fbcfb15b899a44123b34b6dcc18b724336a2cae" @@ -6669,13 +6732,6 @@ p-finally@^2.0.0: resolved "https://registry.yarnpkg.com/p-finally/-/p-finally-2.0.1.tgz#bd6fcaa9c559a096b680806f4d657b3f0f240561" integrity sha512-vpm09aKwq6H9phqRQzecoDpD8TmVyGw70qmWlyq5onxY7tqyTTFVvxMykxQSQKILBSFlbXpypIw2T1Ml7+DDtw== -p-limit@^1.1.0: - version "1.3.0" - resolved "https://registry.yarnpkg.com/p-limit/-/p-limit-1.3.0.tgz#b86bd5f0c25690911c7590fcbfc2010d54b3ccb8" - integrity sha512-vvcXsLAJ9Dr5rQOPk7toZQZJApBl2K4J6dANSsEuh6QI41JYcsS/qhTGa9ErIUUgK3WNQoJYvylxvjqmiqEA9Q== - dependencies: - p-try "^1.0.0" - p-limit@^2.0.0, p-limit@^2.2.0, p-limit@^2.2.1, p-limit@^2.3.0: version "2.3.0" resolved "https://registry.yarnpkg.com/p-limit/-/p-limit-2.3.0.tgz#3dd33c647a214fdfffd835933eb086da0dc21db1" @@ -6683,13 +6739,6 @@ p-limit@^2.0.0, p-limit@^2.2.0, p-limit@^2.2.1, p-limit@^2.3.0: dependencies: p-try "^2.0.0" -p-locate@^2.0.0: - version "2.0.0" - resolved "https://registry.yarnpkg.com/p-locate/-/p-locate-2.0.0.tgz#20a0103b222a70c8fd39cc2e580680f3dde5ec43" - integrity sha1-IKAQOyIqcMj9OcwuWAaA893l7EM= - dependencies: - p-limit "^1.1.0" - p-locate@^3.0.0: version "3.0.0" resolved "https://registry.yarnpkg.com/p-locate/-/p-locate-3.0.0.tgz#322d69a05c0264b25997d9f40cd8a891ab0064a4" @@ -6723,16 +6772,21 @@ p-retry@^3.0.1: dependencies: retry "^0.12.0" -p-try@^1.0.0: - version "1.0.0" - resolved "https://registry.yarnpkg.com/p-try/-/p-try-1.0.0.tgz#cbc79cdbaf8fd4228e13f621f2b1a237c1b207b3" - integrity sha1-y8ec26+P1CKOE/Yh8rGiN8GyB7M= - p-try@^2.0.0: version "2.2.0" resolved "https://registry.yarnpkg.com/p-try/-/p-try-2.2.0.tgz#cb2868540e313d61de58fafbe35ce9004d5540e6" integrity sha512-R4nPAVTAU0B9D35/Gk3uJf/7XYbQcyohSKdvAxIRSNghFl4e71hVoGnBNQz9cWaXxO2I10KTC+3jMdvvoKw6dQ== +package-json@^6.3.0: + version "6.5.0" + resolved "https://registry.yarnpkg.com/package-json/-/package-json-6.5.0.tgz#6feedaca35e75725876d0b0e64974697fed145b0" + integrity sha512-k3bdm2n25tkyxcjSKzB5x8kfVxlMdgsbPr0GkZcwHsLpba6cBjqCt1KlcChKEvxHIcTB1FVMuwoijZ26xex5MQ== + dependencies: + got "^9.6.0" + registry-auth-token "^4.0.0" + registry-url "^5.0.0" + semver "^6.2.0" + pako@~1.0.5: version "1.0.11" resolved "https://registry.yarnpkg.com/pako/-/pako-1.0.11.tgz#6c9599d340d54dfd3946380252a35705a6b992bf" @@ -6763,13 +6817,12 @@ parent-module@^1.0.0: callsites "^3.0.0" parse-asn1@^5.0.0, parse-asn1@^5.1.5: - version "5.1.5" - resolved "https://registry.yarnpkg.com/parse-asn1/-/parse-asn1-5.1.5.tgz#003271343da58dc94cace494faef3d2147ecea0e" - integrity sha512-jkMYn1dcJqF6d5CpU689bq7w/b5ALS9ROVSpQDPrZsqqesUJii9qutvoT5ltGedNXMO2e16YUWIghG9KxaViTQ== + version "5.1.6" + resolved "https://registry.yarnpkg.com/parse-asn1/-/parse-asn1-5.1.6.tgz#385080a3ec13cb62a62d39409cb3e88844cdaed4" + integrity sha512-RnZRo1EPU6JBnra2vGHj0yhp6ebyjBZpmUCLHWiFhxlzvBCCpAuZ7elsBp1PVAbQN0/04VD/19rfzlBSwLstMw== dependencies: - asn1.js "^4.0.0" + asn1.js "^5.2.0" browserify-aes "^1.0.0" - create-hash "^1.1.0" evp_bytestokey "^1.0.0" pbkdf2 "^3.0.3" safe-buffer "^5.1.1" @@ -6795,13 +6848,13 @@ parse-json@^4.0.0: json-parse-better-errors "^1.0.1" parse-json@^5.0.0: - version "5.0.0" - resolved "https://registry.yarnpkg.com/parse-json/-/parse-json-5.0.0.tgz#73e5114c986d143efa3712d4ea24db9a4266f60f" - integrity sha512-OOY5b7PAEFV0E2Fir1KOkxchnZNCdowAJgQ5NuxjpBKTRP3pQhwkrkxqQjeoKJ+fO7bCpmIZaogI4eZGDMEGOw== + version "5.1.0" + resolved "https://registry.yarnpkg.com/parse-json/-/parse-json-5.1.0.tgz#f96088cdf24a8faa9aea9a009f2d9d942c999646" + integrity sha512-+mi/lmVVNKFNVyLXV31ERiy2CY5E1/F6QtJFEzoChPRwwngMNXRDQ9GJ5WdE2Z2P4AujsOi0/+2qHID68KwfIQ== dependencies: "@babel/code-frame" "^7.0.0" error-ex "^1.3.1" - json-parse-better-errors "^1.0.1" + json-parse-even-better-errors "^2.3.0" lines-and-columns "^1.1.6" parse-numeric-range@^0.0.2: @@ -6814,6 +6867,11 @@ parse5@^5.0.0: resolved "https://registry.yarnpkg.com/parse5/-/parse5-5.1.1.tgz#f68e4e5ba1852ac2cadc00f4555fff6c2abb6178" integrity sha512-ugq4DFI0Ptb+WWjAdOK16+u/nHfiIrcE+sh8kZMaM0WllQKLI9rOUq6c2b7cwPkXdzfQESqvoqK6ug7U/Yyzug== +parse5@^6.0.0: + version "6.0.1" + resolved "https://registry.yarnpkg.com/parse5/-/parse5-6.0.1.tgz#e1a1c085c569b3dc08321184f19a39cc27f7c30b" + integrity sha512-Ofn/CTFzRGTTxwpNEs9PP93gXShHcTq255nzRYSKe8AkVpZY7e1fpmTfOyoIvjP5HG7Z2ZM7VS9PPhQGW2pOpw== + parseurl@~1.3.2, parseurl@~1.3.3: version "1.3.3" resolved "https://registry.yarnpkg.com/parseurl/-/parseurl-1.3.3.tgz#9da19e7bee8d12dff0513ed5b76957793bc2e8d4" @@ -6857,7 +6915,7 @@ path-is-absolute@^1.0.0: resolved "https://registry.yarnpkg.com/path-is-absolute/-/path-is-absolute-1.0.1.tgz#174b9268735534ffbc7ace6bf53a5a9e1b5c5f5f" integrity sha1-F0uSaHNVNP+8es5r9TpanhtcX18= -path-is-inside@^1.0.2: +path-is-inside@1.0.2, path-is-inside@^1.0.2: version "1.0.2" resolved "https://registry.yarnpkg.com/path-is-inside/-/path-is-inside-1.0.2.tgz#365417dede44430d1c11af61027facf074bdfc53" integrity sha1-NlQX3t5EQw0cEa9hAn+s8HS9/FM= @@ -6882,6 +6940,11 @@ path-to-regexp@0.1.7: resolved "https://registry.yarnpkg.com/path-to-regexp/-/path-to-regexp-0.1.7.tgz#df604178005f522f15eb4490e7247a1bfaa67f8c" integrity sha1-32BBeABfUi8V60SQ5yR6G/qmf4w= +path-to-regexp@2.2.1: + version "2.2.1" + resolved "https://registry.yarnpkg.com/path-to-regexp/-/path-to-regexp-2.2.1.tgz#90b617025a16381a879bc82a38d4e8bdeb2bcf45" + integrity sha512-gu9bD6Ta5bwGrrU8muHzVOBFFREpp2iRkVfhBJahwJ6p6Xw20SjT0MxLnwkjOibQmGSYhiUnf2FLe7k+jcFmGQ== + path-to-regexp@^1.7.0: version "1.8.0" resolved "https://registry.yarnpkg.com/path-to-regexp/-/path-to-regexp-1.8.0.tgz#887b3ba9d84393e87a0a0b9f4cb756198b53548a" @@ -6902,9 +6965,9 @@ path-type@^4.0.0: integrity sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw== pbkdf2@^3.0.3: - version "3.0.17" - resolved "https://registry.yarnpkg.com/pbkdf2/-/pbkdf2-3.0.17.tgz#976c206530617b14ebb32114239f7b09336e93a6" - integrity sha512-U/il5MsrZp7mGg3mSQfn742na2T+1/vHDCG5/iTI3X9MKUuYUZVLQhyRsg06mCgDBTd57TxzgZt7P+fYfjRLtA== + version "3.1.1" + resolved "https://registry.yarnpkg.com/pbkdf2/-/pbkdf2-3.1.1.tgz#cb8724b0fada984596856d1a6ebafd3584654b94" + integrity sha512-4Ejy1OPxi9f2tt1rRV7Go7zmfDQ+ZectEQz3VGUQhgq62HtIRPDyG/JtnwIxs6x3uNMwo2V7q1fMvKjb+Tnpqg== dependencies: create-hash "^1.1.2" create-hmac "^1.1.4" @@ -6912,11 +6975,6 @@ pbkdf2@^3.0.3: safe-buffer "^5.0.1" sha.js "^2.4.8" -performance-now@^2.1.0: - version "2.1.0" - resolved "https://registry.yarnpkg.com/performance-now/-/performance-now-2.1.0.tgz#6309f4e0e5fa913ec1c69307ae364b4b377c9e7b" - integrity sha1-Ywn04OX6kT7BxpMHrjZLSzd8nns= - picomatch@^2.0.4, picomatch@^2.0.5, picomatch@^2.2.1: version "2.2.2" resolved "https://registry.yarnpkg.com/picomatch/-/picomatch-2.2.2.tgz#21f333e9b6b8eaff02468f5146ea406d345f4dad" @@ -6970,13 +7028,6 @@ pkg-up@3.1.0, pkg-up@^3.1.0: dependencies: find-up "^3.0.0" -pkg-up@^2.0.0: - version "2.0.0" - resolved "https://registry.yarnpkg.com/pkg-up/-/pkg-up-2.0.0.tgz#c819ac728059a461cab1c3889a2be3c49a004d7f" - integrity sha1-yBmscoBZpGHKscOImivjxJoATX8= - dependencies: - find-up "^2.1.0" - pnp-webpack-plugin@^1.6.4: version "1.6.4" resolved "https://registry.yarnpkg.com/pnp-webpack-plugin/-/pnp-webpack-plugin-1.6.4.tgz#c9711ac4dc48a685dabafc86f8b6dd9f8df84149" @@ -6984,23 +7035,14 @@ pnp-webpack-plugin@^1.6.4: dependencies: ts-pnp "^1.1.6" -portfinder@^1.0.25: - version "1.0.25" - resolved "https://registry.yarnpkg.com/portfinder/-/portfinder-1.0.25.tgz#254fd337ffba869f4b9d37edc298059cb4d35eca" - integrity sha512-6ElJnHBbxVA1XSLgBp7G1FiCkQdlqGzuF7DswL5tcea+E8UpuvPU7beVAjjRwCioTS9ZluNbu+ZyRvgTsmqEBg== - dependencies: - async "^2.6.2" - debug "^3.1.1" - mkdirp "^0.5.1" - portfinder@^1.0.26: - version "1.0.26" - resolved "https://registry.yarnpkg.com/portfinder/-/portfinder-1.0.26.tgz#475658d56ca30bed72ac7f1378ed350bd1b64e70" - integrity sha512-Xi7mKxJHHMI3rIUrnm/jjUgwhbYMkp/XKEcZX3aG4BrumLpq3nmoQMX+ClYnDZnZ/New7IatC1no5RX0zo1vXQ== + version "1.0.28" + resolved "https://registry.yarnpkg.com/portfinder/-/portfinder-1.0.28.tgz#67c4622852bd5374dd1dd900f779f53462fac778" + integrity sha512-Se+2isanIcEqf2XMHjyUKskczxbPH7dQnlMjXX6+dybayyHvAf/TCgyMRlzf/B6QDhAEFOGes0pzRo3by4AbMA== dependencies: async "^2.6.2" debug "^3.1.1" - mkdirp "^0.5.1" + mkdirp "^0.5.5" posix-character-classes@^0.1.0: version "0.1.1" @@ -7016,9 +7058,9 @@ postcss-attribute-case-insensitive@^4.0.1: postcss-selector-parser "^6.0.2" postcss-calc@^7.0.1: - version "7.0.2" - resolved "https://registry.yarnpkg.com/postcss-calc/-/postcss-calc-7.0.2.tgz#504efcd008ca0273120568b0792b16cdcde8aac1" - integrity sha512-rofZFHUg6ZIrvRwPeFktv06GdbDYLcGqh9EwiMutZg+a0oePCCw1zHOEiji6LCpyRcjTREtPASuUqeAvYlEVvQ== + version "7.0.3" + resolved "https://registry.yarnpkg.com/postcss-calc/-/postcss-calc-7.0.3.tgz#d65cca92a3c52bf27ad37a5f732e0587b74f1623" + integrity sha512-IB/EAEmZhIMEIhG7Ov4x+l47UaXOS1n2f4FBUk/aKllQhtSCxWhTzn0nJgkqN7fo/jcWySvWTSB6Syk9L+31bA== dependencies: postcss "^7.0.27" postcss-selector-parser "^6.0.2" @@ -7315,14 +7357,14 @@ postcss-modules-extract-imports@^2.0.0: postcss "^7.0.5" postcss-modules-local-by-default@^3.0.2: - version "3.0.2" - resolved "https://registry.yarnpkg.com/postcss-modules-local-by-default/-/postcss-modules-local-by-default-3.0.2.tgz#e8a6561be914aaf3c052876377524ca90dbb7915" - integrity sha512-jM/V8eqM4oJ/22j0gx4jrp63GSvDH6v86OqyTHHUvk4/k1vceipZsaymiZ5PvocqZOl5SFHiFJqjs3la0wnfIQ== + version "3.0.3" + resolved "https://registry.yarnpkg.com/postcss-modules-local-by-default/-/postcss-modules-local-by-default-3.0.3.tgz#bb14e0cc78279d504dbdcbfd7e0ca28993ffbbb0" + integrity sha512-e3xDq+LotiGesympRlKNgaJ0PCzoUIdpH0dj47iWAui/kyTgh3CiAr1qP54uodmJhl6p9rN6BoNcdEDVJx9RDw== dependencies: icss-utils "^4.1.1" - postcss "^7.0.16" + postcss "^7.0.32" postcss-selector-parser "^6.0.2" - postcss-value-parser "^4.0.0" + postcss-value-parser "^4.1.0" postcss-modules-scope@^2.2.0: version "2.2.0" @@ -7604,16 +7646,11 @@ postcss-value-parser@^3.0.0: resolved "https://registry.yarnpkg.com/postcss-value-parser/-/postcss-value-parser-3.3.1.tgz#9ff822547e2893213cf1c30efa51ac5fd1ba8281" integrity sha512-pISE66AbVkp4fDQ7VHBwRNXzAAKJjw4Vw7nWI/+Q3vuly7SNfgYXvm6i5IgFylHGK5sP/xHAbB7N49OS4gWNyQ== -postcss-value-parser@^4.0.0, postcss-value-parser@^4.1.0: +postcss-value-parser@^4.0.2, postcss-value-parser@^4.1.0: version "4.1.0" resolved "https://registry.yarnpkg.com/postcss-value-parser/-/postcss-value-parser-4.1.0.tgz#443f6a20ced6481a2bda4fa8532a6e55d789a2cb" integrity sha512-97DXOFbQJhk71ne5/Mt6cOu6yxsSfM0QGQyl0L25Gca4yGWEGJaig7l7gbCX623VqTBNGLRLaVUCnNkcedlRSQ== -postcss-value-parser@^4.0.2, postcss-value-parser@^4.0.3: - version "4.0.3" - resolved "https://registry.yarnpkg.com/postcss-value-parser/-/postcss-value-parser-4.0.3.tgz#651ff4593aa9eda8d5d0d66593a2417aeaeb325d" - integrity sha512-N7h4pG+Nnu5BEIzyeaaIYWs0LI5XC40OrRh5L60z0QjFsqGWcHcbkBvpe1WYpcIS9yQ8sOi/vIPt1ejQCrMVrg== - postcss-values-parser@^2.0.0, postcss-values-parser@^2.0.1: version "2.0.1" resolved "https://registry.yarnpkg.com/postcss-values-parser/-/postcss-values-parser-2.0.1.tgz#da8b472d901da1e205b47bdc98637b9e9e550e5f" @@ -7623,19 +7660,10 @@ postcss-values-parser@^2.0.0, postcss-values-parser@^2.0.1: indexes-of "^1.0.1" uniq "^1.0.1" -postcss@^7.0.0, postcss@^7.0.1, postcss@^7.0.27: - version "7.0.27" - resolved "https://registry.yarnpkg.com/postcss/-/postcss-7.0.27.tgz#cc67cdc6b0daa375105b7c424a85567345fc54d9" - integrity sha512-WuQETPMcW9Uf1/22HWUWP9lgsIC+KEHg2kozMflKjbeUtw9ujvFX6QmIfozaErDkmLWS9WEnEdEe6Uo9/BNTdQ== - dependencies: - chalk "^2.4.2" - source-map "^0.6.1" - supports-color "^6.1.0" - -postcss@^7.0.14, postcss@^7.0.16, postcss@^7.0.17, postcss@^7.0.2, postcss@^7.0.30, postcss@^7.0.5, postcss@^7.0.6: - version "7.0.31" - resolved "https://registry.yarnpkg.com/postcss/-/postcss-7.0.31.tgz#332af45cb73e26c0ee2614d7c7fb02dfcc2bd6dd" - integrity sha512-a937VDHE1ftkjk+8/7nj/mrjtmkn69xxzJgRETXdAUU+IgOYPQNJF17haGWbeDxSyk++HA14UA98FurvPyBJOA== +postcss@^7.0.0, postcss@^7.0.1, postcss@^7.0.14, postcss@^7.0.17, postcss@^7.0.2, postcss@^7.0.27, postcss@^7.0.32, postcss@^7.0.5, postcss@^7.0.6: + version "7.0.32" + resolved "https://registry.yarnpkg.com/postcss/-/postcss-7.0.32.tgz#4310d6ee347053da3433db2be492883d62cec59d" + integrity sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw== dependencies: chalk "^2.4.2" source-map "^0.6.1" @@ -7646,6 +7674,11 @@ prepend-http@^1.0.0: resolved "https://registry.yarnpkg.com/prepend-http/-/prepend-http-1.0.4.tgz#d4f4562b0ce3696e41ac52d0e002e57a635dc6dc" integrity sha1-1PRWKwzjaW5BrFLQ4ALlemNdxtw= +prepend-http@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/prepend-http/-/prepend-http-2.0.0.tgz#e92434bfa5ea8c19f41cdfd401d741a3c819d897" + integrity sha1-6SQ0v6XqjBn0HN/UAddBo8gZ2Jc= + pretty-error@^2.1.1: version "2.1.1" resolved "https://registry.yarnpkg.com/pretty-error/-/pretty-error-2.1.1.tgz#5f4f87c8f91e5ae3f3ba87ab4cf5e03b1a17f1a3" @@ -7671,11 +7704,6 @@ prismjs@^1.20.0: optionalDependencies: clipboard "^2.0.0" -private@^0.1.8: - version "0.1.8" - resolved "https://registry.yarnpkg.com/private/-/private-0.1.8.tgz#2381edb3689f7a53d653190060fcf822d2f368ff" - integrity sha512-VvivMrbvd2nKkiG38qjULzlc+4Vx4wm/whI9pQD35YrARNnhxeiRktSOhSukRLFNlzg6Br/cJPet5J/u19r/mg== - process-nextick-args@~2.0.0: version "2.0.1" resolved "https://registry.yarnpkg.com/process-nextick-args/-/process-nextick-args-2.0.1.tgz#7820d9b16120cc55ca9ae7792680ae7dba6d7fe2" @@ -7720,11 +7748,6 @@ prr@~1.0.1: resolved "https://registry.yarnpkg.com/prr/-/prr-1.0.1.tgz#d3fc114ba06995a45ec6893f484ceb1d78f5f476" integrity sha1-0/wRS6BplaRexok/SEzrHXj19HY= -psl@^1.1.28: - version "1.8.0" - resolved "https://registry.yarnpkg.com/psl/-/psl-1.8.0.tgz#9326f8bcfb013adcc005fdff056acce020e51c24" - integrity sha512-RIdOzyoavK+hA18OGGWDqUTsCLhtA7IcZ/6NCs4fFJaHBDab+pDDmDIByWFRQJq2Cd7r1OoQxBGKOaztq+hjIQ== - public-encrypt@^4.0.0: version "4.0.3" resolved "https://registry.yarnpkg.com/public-encrypt/-/public-encrypt-4.0.3.tgz#4fcc9d77a07e48ba7527e7cbe0de33d0701331e0" @@ -7767,16 +7790,23 @@ punycode@1.3.2: resolved "https://registry.yarnpkg.com/punycode/-/punycode-1.3.2.tgz#9653a036fb7c1ee42342f2325cceefea3926c48d" integrity sha1-llOgNvt8HuQjQvIyXM7v6jkmxI0= -punycode@^1.2.4: +punycode@^1.2.4, punycode@^1.3.2: version "1.4.1" resolved "https://registry.yarnpkg.com/punycode/-/punycode-1.4.1.tgz#c0d5a63b2718800ad8e1eb0fa5269c84dd41845e" integrity sha1-wNWmOycYgArY4esPpSachN1BhF4= -punycode@^2.1.0, punycode@^2.1.1: +punycode@^2.1.0: version "2.1.1" resolved "https://registry.yarnpkg.com/punycode/-/punycode-2.1.1.tgz#b58b010ac40c22c5657616c8d2c2c02c7bf479ec" integrity sha512-XRsRjdf+j5ml+y/6GKHPZbrF/8p2Yga0JPtdqTIY2Xe5ohJPD9saDJJLPvp9+NSBprVvevdXZybnj2cv8OEd0A== +pupa@^2.0.1: + version "2.0.1" + resolved "https://registry.yarnpkg.com/pupa/-/pupa-2.0.1.tgz#dbdc9ff48ffbea4a26a069b6f9f7abb051008726" + integrity sha512-hEJH0s8PXLY/cdXh66tNEQGndDrIKNqNC5xmrysZy3i5C3oEoLna7YAOad+7u125+zH1HNXUmGEkrhb3c2VriA== + dependencies: + escape-goat "^2.0.0" + q@^1.1.2: version "1.5.1" resolved "https://registry.yarnpkg.com/q/-/q-1.5.1.tgz#7e32f75b41381291d04611f1bf14109ac00651d7" @@ -7787,11 +7817,6 @@ qs@6.7.0: resolved "https://registry.yarnpkg.com/qs/-/qs-6.7.0.tgz#41dc1a015e3d581f1621776be31afb2876a9b1bc" integrity sha512-VCdBRNFTX1fyE7Nb6FYoURo/SPe62QCaAyzJvUjwRaIsc+NePBEniHlvxFmmX56+HZphIGtV0XeCirBtpDrTyQ== -qs@~6.5.2: - version "6.5.2" - resolved "https://registry.yarnpkg.com/qs/-/qs-6.5.2.tgz#cb3ae806e8740444584ef154ce8ee98d403f3e36" - integrity sha512-N5ZAX4/LxJmF+7wN74pUD6qAh9/wnvdQcjq9TZjevvXzSUo7bfmw91saqMjzGS2xq91/odN2dW/WOl7qQHNDGA== - query-string@^4.1.0: version "4.3.4" resolved "https://registry.yarnpkg.com/query-string/-/query-string-4.3.4.tgz#bbb693b9ca915c232515b228b1a02b609043dbeb" @@ -7800,7 +7825,7 @@ query-string@^4.1.0: object-assign "^4.1.0" strict-uri-encode "^1.0.0" -querystring-es3@^0.2.0, querystring-es3@^0.2.1: +querystring-es3@^0.2.0: version "0.2.1" resolved "https://registry.yarnpkg.com/querystring-es3/-/querystring-es3-0.2.1.tgz#9ec61f79049875707d69414596fd907a4d711e73" integrity sha1-nsYfeQSYdXB9aUFFlv2Qek1xHnM= @@ -7811,9 +7836,9 @@ querystring@0.2.0: integrity sha1-sgmEkgO7Jd+CDadW50cAWHhSFiA= querystringify@^2.1.1: - version "2.1.1" - resolved "https://registry.yarnpkg.com/querystringify/-/querystringify-2.1.1.tgz#60e5a5fd64a7f8bfa4d2ab2ed6fdf4c85bad154e" - integrity sha512-w7fLxIRCRT7U8Qu53jQnJyPkYZIaR4n5151KMfcJlO/A9397Wxb1amJvROTK6TOnp7PfoAmg/qXiNHI+08jRfA== + version "2.2.0" + resolved "https://registry.yarnpkg.com/querystringify/-/querystringify-2.2.0.tgz#3345941b4153cb9d082d8eee4cda2016a9aef7f6" + integrity sha512-FIqgj2EUvTa7R50u0rGsyTftzjYmv/a3hO345bZNrqabNqjtgiDMgmo4mkUjd+nzU5oF3dClKqFIPUKybUyqoQ== randombytes@^2.0.0, randombytes@^2.0.1, randombytes@^2.0.5, randombytes@^2.1.0: version "2.1.0" @@ -7830,6 +7855,11 @@ randomfill@^1.0.3: randombytes "^2.0.5" safe-buffer "^5.1.0" +range-parser@1.2.0: + version "1.2.0" + resolved "https://registry.yarnpkg.com/range-parser/-/range-parser-1.2.0.tgz#f49be6b487894ddc40dcc94a322f611092e00d5e" + integrity sha1-9JvmtIeJTdxA3MlKMi9hEJLgDV4= + range-parser@^1.2.1, range-parser@~1.2.1: version "1.2.1" resolved "https://registry.yarnpkg.com/range-parser/-/range-parser-1.2.1.tgz#3cf37023d199e1c24d1a55b84800c2f3e6468031" @@ -7845,6 +7875,16 @@ raw-body@2.4.0: iconv-lite "0.4.24" unpipe "1.0.0" +rc@^1.2.8: + version "1.2.8" + resolved "https://registry.yarnpkg.com/rc/-/rc-1.2.8.tgz#cd924bf5200a075b83c188cd6b9e211b7fc0d3ed" + integrity sha512-y3bGgqKj3QBdxLbLkomlohkvsA8gdAiUQlSBJnBhfn+BPxg4bc62d8TcBW15wavDfgexCgccckhcZvywyQYPOw== + dependencies: + deep-extend "^0.6.0" + ini "~1.3.0" + minimist "^1.2.0" + strip-json-comments "~2.0.1" + react-dev-utils@^10.2.1: version "10.2.1" resolved "https://registry.yarnpkg.com/react-dev-utils/-/react-dev-utils-10.2.1.tgz#f6de325ae25fa4d546d09df4bb1befdc6dd19c19" @@ -7890,19 +7930,19 @@ react-error-overlay@^6.0.7: resolved "https://registry.yarnpkg.com/react-error-overlay/-/react-error-overlay-6.0.7.tgz#1dcfb459ab671d53f660a991513cb2f0a0553108" integrity sha512-TAv1KJFh3RhqxNvhzxj6LeT5NWklP6rDr2a0jaTfsZ5wSZWHOGeqQyejUp3xxLfPt2UpyJEcVQB/zyPcmonNFA== -react-fast-compare@^2.0.4: - version "2.0.4" - resolved "https://registry.yarnpkg.com/react-fast-compare/-/react-fast-compare-2.0.4.tgz#e84b4d455b0fec113e0402c329352715196f81f9" - integrity sha512-suNP+J1VU1MWFKcyt7RtjiSWUjvidmQSlqu+eHslq+342xCbGTYmC0mEhPCOHxlW0CywylOC1u2DFAT+bv4dBw== +react-fast-compare@^3.1.1: + version "3.2.0" + resolved "https://registry.yarnpkg.com/react-fast-compare/-/react-fast-compare-3.2.0.tgz#641a9da81b6a6320f270e89724fb45a0b39e43bb" + integrity sha512-rtGImPZ0YyLrscKI9xTpV8psd6I8VAtjKCzQDlzyDvqJA8XOW78TXYQwNRNd8g8JZnDu8q9Fu/1v4HPAVwVdHA== react-helmet@^6.0.0-beta: - version "6.0.0" - resolved "https://registry.yarnpkg.com/react-helmet/-/react-helmet-6.0.0.tgz#fcb93ebaca3ba562a686eb2f1f9d46093d83b5f8" - integrity sha512-My6S4sa0uHN/IuVUn0HFmasW5xj9clTkB9qmMngscVycQ5vVG51Qp44BEvLJ4lixupTwDlU9qX1/sCrMN4AEPg== + version "6.1.0" + resolved "https://registry.yarnpkg.com/react-helmet/-/react-helmet-6.1.0.tgz#a750d5165cb13cf213e44747502652e794468726" + integrity sha512-4uMzEY9nlDlgxr61NL3XbKRy1hEkXmKNXhjbAIOVw5vcFrsdYbH2FEwcNyWvWinl103nXgzYNlns9ca+8kFiWw== dependencies: object-assign "^4.1.1" prop-types "^15.7.2" - react-fast-compare "^2.0.4" + react-fast-compare "^3.1.1" react-side-effect "^2.1.0" react-is@^16.6.0, react-is@^16.7.0, react-is@^16.8.1: @@ -7910,10 +7950,10 @@ react-is@^16.6.0, react-is@^16.7.0, react-is@^16.8.1: resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4" integrity sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ== -react-loadable-ssr-addon@^0.2.0: - version "0.2.0" - resolved "https://registry.yarnpkg.com/react-loadable-ssr-addon/-/react-loadable-ssr-addon-0.2.0.tgz#fbf4ebfa9cfd6eadb3c346f0459e1cee01c9cae8" - integrity sha512-gTfPaxWZa5mHKeSOE61RpoLe7hyjcJHgNa5m0ZZGV3OCkWsOKlfYgoBxXzu9ENg/ePR/kFd5H3ncF4K5eyyNTQ== +react-loadable-ssr-addon@^0.2.3: + version "0.2.3" + resolved "https://registry.yarnpkg.com/react-loadable-ssr-addon/-/react-loadable-ssr-addon-0.2.3.tgz#55057abf95628d47727c68e966a6b3a53cde34e0" + integrity sha512-vPCqsmiafAMDcS9MLgXw3m4yMI40v1UeI8FTYJJkjf85LugKNnHf6D9yoDTzYwp8wEGF5viekwOD03ZPxSwnQQ== react-loadable@^5.5.0: version "5.5.0" @@ -8036,13 +8076,6 @@ recursive-readdir@2.2.2: dependencies: minimatch "3.0.4" -reduce@^1.0.1: - version "1.0.2" - resolved "https://registry.yarnpkg.com/reduce/-/reduce-1.0.2.tgz#0cd680ad3ffe0b060e57a5c68bdfce37168d361b" - integrity sha512-xX7Fxke/oHO5IfZSk77lvPa/7bjMh9BuCk4OOoX5XTXrM7s0Z+MkPfSDfz0q7r91BhhGSs8gii/VEN/7zhCPpQ== - dependencies: - object-keys "^1.1.0" - regenerate-unicode-properties@^8.2.0: version "8.2.0" resolved "https://registry.yarnpkg.com/regenerate-unicode-properties/-/regenerate-unicode-properties-8.2.0.tgz#e5de7111d655e7ba60c057dbe9ff37c87e65cdec" @@ -8051,22 +8084,21 @@ regenerate-unicode-properties@^8.2.0: regenerate "^1.4.0" regenerate@^1.4.0: - version "1.4.0" - resolved "https://registry.yarnpkg.com/regenerate/-/regenerate-1.4.0.tgz#4a856ec4b56e4077c557589cae85e7a4c8869a11" - integrity sha512-1G6jJVDWrt0rK99kBjvEtziZNCICAuvIPkSiUFIQxVP06RCVpq3dmDo2oi6ABpYaDYaTRr67BEhL8r1wgEZZKg== + version "1.4.1" + resolved "https://registry.yarnpkg.com/regenerate/-/regenerate-1.4.1.tgz#cad92ad8e6b591773485fbe05a485caf4f457e6f" + integrity sha512-j2+C8+NtXQgEKWk49MMP5P/u2GhnahTtVkRIHr5R5lVRlbKvmQ+oS+A5aLKWp2ma5VkT8sh6v+v4hbH0YHR66A== regenerator-runtime@^0.13.4: - version "0.13.5" - resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.13.5.tgz#d878a1d094b4306d10b9096484b33ebd55e26697" - integrity sha512-ZS5w8CpKFinUzOwW3c83oPeVXoNsrLsaCoLtJvAClH135j/R77RuymhiSErhm2lKcwSCIpmvIWSbDkIfAqKQlA== + version "0.13.7" + resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.13.7.tgz#cac2dacc8a1ea675feaabaeb8ae833898ae46f55" + integrity sha512-a54FxoJDIr27pgf7IgeQGxmqUNYrcV338lf/6gH456HZ/PhX+5BcwHXG9ajESmwe6WRO0tAzRUrRmNONWgkrew== regenerator-transform@^0.14.2: - version "0.14.4" - resolved "https://registry.yarnpkg.com/regenerator-transform/-/regenerator-transform-0.14.4.tgz#5266857896518d1616a78a0479337a30ea974cc7" - integrity sha512-EaJaKPBI9GvKpvUz2mz4fhx7WPgvwRLY9v3hlNHWmAuJHI13T4nwKnNvm5RWJzEdnI5g5UwtOww+S8IdoUC2bw== + version "0.14.5" + resolved "https://registry.yarnpkg.com/regenerator-transform/-/regenerator-transform-0.14.5.tgz#c98da154683671c9c4dcb16ece736517e1b7feb4" + integrity sha512-eOf6vka5IO151Jfsw2NO9WpGX58W6wWmefK3I1zEGr0lOD0u8rwPaNqQL1aRxUaxLeKO3ArNh3VYg1KbaD+FFw== dependencies: "@babel/runtime" "^7.8.4" - private "^0.1.8" regex-not@^1.0.0, regex-not@^1.0.2: version "1.0.2" @@ -8096,10 +8128,24 @@ regexpu-core@^4.7.0: unicode-match-property-ecmascript "^1.0.4" unicode-match-property-value-ecmascript "^1.2.0" +registry-auth-token@^4.0.0: + version "4.2.0" + resolved "https://registry.yarnpkg.com/registry-auth-token/-/registry-auth-token-4.2.0.tgz#1d37dffda72bbecd0f581e4715540213a65eb7da" + integrity sha512-P+lWzPrsgfN+UEpDS3U8AQKg/UjZX6mQSJueZj3EK+vNESoqBSpBUD3gmu4sF9lOsjXWjF11dQKUqemf3veq1w== + dependencies: + rc "^1.2.8" + +registry-url@^5.0.0: + version "5.1.0" + resolved "https://registry.yarnpkg.com/registry-url/-/registry-url-5.1.0.tgz#e98334b50d5434b81136b44ec638d9c2009c5009" + integrity sha512-8acYXXTI0AkQv6RAOjE3vOaIXZkT9wo4LOFbBKYQEEnnMNBpKqdUrI6S4NT0KPIo/WVvJ5tE/X5LF/TQUf0ekw== + dependencies: + rc "^1.2.8" + regjsgen@^0.5.1: - version "0.5.1" - resolved "https://registry.yarnpkg.com/regjsgen/-/regjsgen-0.5.1.tgz#48f0bf1a5ea205196929c0d9798b42d1ed98443c" - integrity sha512-5qxzGZjDs9w4tzT3TPhCJqWdCc3RLYwy9J2NB0nm5Lz+S273lvWcpjaTGHsT1dc6Hhfq41uSEOw8wBmxrKOuyg== + version "0.5.2" + resolved "https://registry.yarnpkg.com/regjsgen/-/regjsgen-0.5.2.tgz#92ff295fb1deecbf6ecdab2543d207e91aa33733" + integrity sha512-OFFT3MfrH90xIW8OOSyUrk6QHD5E9JOTeGodiJeBS3J6IwlgzJMNE/1bZklWz5oTg+9dCMyEetclvCVXOPoN3A== regjsparser@^0.6.4: version "0.6.4" @@ -8145,24 +8191,24 @@ remark-footnotes@1.0.0: resolved "https://registry.yarnpkg.com/remark-footnotes/-/remark-footnotes-1.0.0.tgz#9c7a97f9a89397858a50033373020b1ea2aad011" integrity sha512-X9Ncj4cj3/CIvLI2Z9IobHtVi8FVdUrdJkCNaL9kdX8ohfsi18DXHsCVd/A7ssARBdccdDb5ODnt62WuEWaM/g== -remark-mdx@^1.6.4: - version "1.6.4" - resolved "https://registry.yarnpkg.com/remark-mdx/-/remark-mdx-1.6.4.tgz#51c6eba0abb97591f0926c195e088bdb025c0b8a" - integrity sha512-tJ/CGNNLVC8nOm0C3EjDQH4Vl3YhawgR2f3J+RaalrMDrT4s5ZzOqoNesV1cnF/DsoOxKlYkExOpNSOa6rkAtQ== - dependencies: - "@babel/core" "7.9.6" - "@babel/helper-plugin-utils" "7.8.3" - "@babel/plugin-proposal-object-rest-spread" "7.9.6" - "@babel/plugin-syntax-jsx" "7.8.3" - "@mdx-js/util" "^1.6.4" +remark-mdx@1.6.16: + version "1.6.16" + resolved "https://registry.yarnpkg.com/remark-mdx/-/remark-mdx-1.6.16.tgz#13ee40ad0614a1cc179aca3604d7f1b79e498a2f" + integrity sha512-xqZhBQ4TonFiSFpVt6SnTLRnxstu7M6pcaOibKZhqzk4zMRVacVenD7iECjfESK+72LkPm/NW+0r5ahJAg7zlQ== + dependencies: + "@babel/core" "7.10.5" + "@babel/helper-plugin-utils" "7.10.4" + "@babel/plugin-proposal-object-rest-spread" "7.10.4" + "@babel/plugin-syntax-jsx" "7.10.4" + "@mdx-js/util" "1.6.16" is-alphabetical "1.0.4" - remark-parse "8.0.2" - unified "9.0.0" + remark-parse "8.0.3" + unified "9.1.0" -remark-parse@8.0.2: - version "8.0.2" - resolved "https://registry.yarnpkg.com/remark-parse/-/remark-parse-8.0.2.tgz#5999bc0b9c2e3edc038800a64ff103d0890b318b" - integrity sha512-eMI6kMRjsAGpMXXBAywJwiwAse+KNpmt+BK55Oofy4KvBZEqUDj6mWbGLJZrujoPIPPxDXzn3T9baRlpsm2jnQ== +remark-parse@8.0.3: + version "8.0.3" + resolved "https://registry.yarnpkg.com/remark-parse/-/remark-parse-8.0.3.tgz#9c62aa3b35b79a486454c690472906075f40c7e1" + integrity sha512-E1K9+QLGgggHxCQtLt++uXltxEprmWzNfg+MxpfHsZlrddKzZ/hZyWHDbK3/Ap8HJQqYJRXP+jHczdL6q6i85Q== dependencies: ccount "^1.0.0" collapse-white-space "^1.0.2" @@ -8219,32 +8265,6 @@ replace-ext@1.0.0: resolved "https://registry.yarnpkg.com/replace-ext/-/replace-ext-1.0.0.tgz#de63128373fcbf7c3ccfa4de5a480c45a67958eb" integrity sha1-3mMSg3P8v3w8z6TeWkgMRaZ5WOs= -request@^2.87.0: - version "2.88.2" - resolved "https://registry.yarnpkg.com/request/-/request-2.88.2.tgz#d73c918731cb5a87da047e207234146f664d12b3" - integrity sha512-MsvtOrfG9ZcrOwAW+Qi+F6HbD0CWXEh9ou77uOb7FM2WPhwT7smM833PzanhJLsgXjN89Ir6V2PczXNnMpwKhw== - dependencies: - aws-sign2 "~0.7.0" - aws4 "^1.8.0" - caseless "~0.12.0" - combined-stream "~1.0.6" - extend "~3.0.2" - forever-agent "~0.6.1" - form-data "~2.3.2" - har-validator "~5.1.3" - http-signature "~1.2.0" - is-typedarray "~1.0.0" - isstream "~0.1.2" - json-stringify-safe "~5.0.1" - mime-types "~2.1.19" - oauth-sign "~0.9.0" - performance-now "^2.1.0" - qs "~6.5.2" - safe-buffer "^5.1.2" - tough-cookie "~2.5.0" - tunnel-agent "^0.6.0" - uuid "^3.3.2" - require-directory@^2.1.1: version "2.1.1" resolved "https://registry.yarnpkg.com/require-directory/-/require-directory-2.1.1.tgz#8c64ad5fd30dab1c976e2344ffe7f792a6a6df42" @@ -8292,20 +8312,20 @@ resolve-url@^0.2.1: resolved "https://registry.yarnpkg.com/resolve-url/-/resolve-url-0.2.1.tgz#2c637fe77c893afd2a663fe21aa9080068e2052a" integrity sha1-LGN/53yJOv0qZj/iGqkIAGjiBSo= -resolve@^1.1.6, resolve@^1.3.2: - version "1.15.1" - resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.15.1.tgz#27bdcdeffeaf2d6244b95bb0f9f4b4653451f3e8" - integrity sha512-84oo6ZTtoTUpjgNEr5SJyzQhzL72gaRodsSfyxC/AXRvwu0Yse9H8eF9IpGo7b8YetZhlI6v7ZQ6bKBFV/6S7w== - dependencies: - path-parse "^1.0.6" - -resolve@^1.8.1: +resolve@^1.1.6, resolve@^1.3.2, resolve@^1.8.1: version "1.17.0" resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.17.0.tgz#b25941b54968231cc2d1bb76a79cb7f2c0bf8444" integrity sha512-ic+7JYiV8Vi2yzQGFWOkiZD5Z9z7O2Zhm9XMaTxdJExKasieFCr+yXZ/WmXsckHiKl12ar0y6XiXDx3m4RHn1w== dependencies: path-parse "^1.0.6" +responselike@^1.0.2: + version "1.0.2" + resolved "https://registry.yarnpkg.com/responselike/-/responselike-1.0.2.tgz#918720ef3b631c5642be068f15ade5a46f4ba1e7" + integrity sha1-kYcg7ztjHFZCvgaPFa3lpG9Loec= + dependencies: + lowercase-keys "^1.0.0" + restore-cursor@^3.1.0: version "3.1.0" resolved "https://registry.yarnpkg.com/restore-cursor/-/restore-cursor-3.1.0.tgz#39f67c54b3a7a58cea5236d95cf0034239631f7e" @@ -8361,12 +8381,10 @@ ripemd160@^2.0.0, ripemd160@^2.0.1: hash-base "^3.0.0" inherits "^2.0.1" -run-async@^2.2.0: - version "2.4.0" - resolved "https://registry.yarnpkg.com/run-async/-/run-async-2.4.0.tgz#e59054a5b86876cfae07f431d18cbaddc594f1e8" - integrity sha512-xJTbh/d7Lm7SBhc1tNvTpeCHaEzoyxPrqNlvSdMfBTYwaY++UJFyXUOxAtsRUXjlqOfj8luNaR9vjCh4KeV+pg== - dependencies: - is-promise "^2.1.0" +run-async@^2.2.0, run-async@^2.4.0: + version "2.4.1" + resolved "https://registry.yarnpkg.com/run-async/-/run-async-2.4.1.tgz#8440eccf99ea3e70bd409d49aab88e10c189a455" + integrity sha512-tvVnVv01b8c1RrA6Ep7JkStj85Guv/YrMcwqYQnwjsAS2cTmmPGBBjAjpCW7RrSodNSoE2/qg9O4bceNvUuDgQ== run-parallel@^1.1.9: version "1.1.9" @@ -8385,10 +8403,10 @@ rx@^4.1.0: resolved "https://registry.yarnpkg.com/rx/-/rx-4.1.0.tgz#a5f13ff79ef3b740fe30aa803fb09f98805d4782" integrity sha1-pfE/957zt0D+MKqAP7CfmIBdR4I= -rxjs@^6.5.3: - version "6.5.5" - resolved "https://registry.yarnpkg.com/rxjs/-/rxjs-6.5.5.tgz#c5c884e3094c8cfee31bf27eb87e54ccfc87f9ec" - integrity sha512-WfQI+1gohdf0Dai/Bbmk5L5ItH5tYqm3ki2c5GdWhKjalzjg93N3avFjVStyZZz+A2Em+ZxKH5bNghw9UeylGQ== +rxjs@^6.5.3, rxjs@^6.6.0: + version "6.6.2" + resolved "https://registry.yarnpkg.com/rxjs/-/rxjs-6.6.2.tgz#8096a7ac03f2cc4fe5860ef6e572810d9e01c0d2" + integrity sha512-BHdBMVoWC2sL26w//BCu3YzKT4s2jip/WhwsGEDmeKYBhKDZeYezVUnHatYB7L85v5xs0BAQmg6BEYJEKxBabg== dependencies: tslib "^1.9.0" @@ -8397,12 +8415,7 @@ safe-buffer@5.1.2, safe-buffer@~5.1.0, safe-buffer@~5.1.1: resolved "https://registry.yarnpkg.com/safe-buffer/-/safe-buffer-5.1.2.tgz#991ec69d296e0313747d59bdfd2b745c35f8828d" integrity sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g== -safe-buffer@>=5.1.0, safe-buffer@^5.0.1, safe-buffer@^5.1.1, safe-buffer@^5.1.2, safe-buffer@~5.2.0: - version "5.2.0" - resolved "https://registry.yarnpkg.com/safe-buffer/-/safe-buffer-5.2.0.tgz#b74daec49b1148f88c64b68d49b1e815c1f2f519" - integrity sha512-fZEwUGbVl7kouZs1jCdMLdt95hdIv0ZeHg6L7qPeciMZhZ+/gdesW4wgTARkrFWEpspjEATAzUGPG8N2jJiwbg== - -safe-buffer@^5.1.0, safe-buffer@^5.2.0: +safe-buffer@>=5.1.0, safe-buffer@^5.0.1, safe-buffer@^5.1.0, safe-buffer@^5.1.1, safe-buffer@^5.1.2, safe-buffer@^5.2.0, safe-buffer@~5.2.0: version "5.2.1" resolved "https://registry.yarnpkg.com/safe-buffer/-/safe-buffer-5.2.1.tgz#1eaf9fa9bdb1fdd4ec75f58f9cdb4e6b7827eec6" integrity sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ== @@ -8414,7 +8427,7 @@ safe-regex@^1.1.0: dependencies: ret "~0.1.10" -"safer-buffer@>= 2.1.2 < 3", safer-buffer@^2.0.2, safer-buffer@^2.1.0, safer-buffer@~2.1.0: +"safer-buffer@>= 2.1.2 < 3", safer-buffer@^2.1.0: version "2.1.2" resolved "https://registry.yarnpkg.com/safer-buffer/-/safer-buffer-2.1.2.tgz#44fa161b0187b9549dd84bb91802f9bd8385cd6a" integrity sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg== @@ -8441,12 +8454,13 @@ schema-utils@^1.0.0: ajv-errors "^1.0.0" ajv-keywords "^3.1.0" -schema-utils@^2.0.0, schema-utils@^2.6.5, schema-utils@^2.6.6: - version "2.6.6" - resolved "https://registry.yarnpkg.com/schema-utils/-/schema-utils-2.6.6.tgz#299fe6bd4a3365dc23d99fd446caff8f1d6c330c" - integrity sha512-wHutF/WPSbIi9x6ctjGGk2Hvl0VOz5l3EKEuKbjPlB30mKZUzb9A5k9yEXRX3pwyqVLPvpfZZEllaFq/M718hA== +schema-utils@^2.0.0, schema-utils@^2.6.5, schema-utils@^2.6.6, schema-utils@^2.7.0: + version "2.7.0" + resolved "https://registry.yarnpkg.com/schema-utils/-/schema-utils-2.7.0.tgz#17151f76d8eae67fbbf77960c33c676ad9f4efc7" + integrity sha512-0ilKFI6QQF5nxDZLFn2dMjvc4hjg/Wkg7rHd3jK6/A4a1Hl9VFdQWvgB1UMGoU94pad1P/8N7fMcEnLnSiju8A== dependencies: - ajv "^6.12.0" + "@types/json-schema" "^7.0.4" + ajv "^6.12.2" ajv-keywords "^3.4.1" section-matter@^1.0.0: @@ -8474,17 +8488,24 @@ selfsigned@^1.10.7: dependencies: node-forge "0.9.0" +semver-diff@^3.1.1: + version "3.1.1" + resolved "https://registry.yarnpkg.com/semver-diff/-/semver-diff-3.1.1.tgz#05f77ce59f325e00e2706afd67bb506ddb1ca32b" + integrity sha512-GX0Ix/CJcHyB8c4ykpHGIAvLyOwOobtM/8d+TQkAd81/bEjgPHrfba41Vpesr7jX/t8Uh+R3EX9eAS5be+jQYg== + dependencies: + semver "^6.3.0" + semver@7.0.0: version "7.0.0" resolved "https://registry.yarnpkg.com/semver/-/semver-7.0.0.tgz#5f3ca35761e47e05b206c6daff2cf814f0316b8e" integrity sha512-+GB6zVA9LWh6zovYQLALHwv5rb2PHGlJi3lfiqIHxR0uuwCgefcOJc59v9fv1w8GbStwxuuqqAjI9NMAOOgq1A== -semver@^5.1.0, semver@^5.4.1, semver@^5.5.0, semver@^5.5.1, semver@^5.6.0: +semver@^5.4.1, semver@^5.5.0, semver@^5.5.1, semver@^5.6.0: version "5.7.1" resolved "https://registry.yarnpkg.com/semver/-/semver-5.7.1.tgz#a954f931aeba508d307bbf069eff0c01c96116f7" integrity sha512-sauaDf/PZdVgrLTNYHRtpXa1iRiKcaebiKQ1BJdpQlWH2lCvexQdX55snPFyK7QzpudqbCI0qXFfOasHdyNDGQ== -semver@^6.0.0, semver@^6.3.0: +semver@^6.0.0, semver@^6.2.0, semver@^6.3.0: version "6.3.0" resolved "https://registry.yarnpkg.com/semver/-/semver-6.3.0.tgz#ee0a64c8af5e8ceea67687b133761e1becbd1d3d" integrity sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw== @@ -8513,13 +8534,27 @@ serialize-javascript@^2.1.2: resolved "https://registry.yarnpkg.com/serialize-javascript/-/serialize-javascript-2.1.2.tgz#ecec53b0e0317bdc95ef76ab7074b7384785fa61" integrity sha512-rs9OggEUF0V4jUSecXazOYsLfu7OGK2qIn3c7IPBiffz32XniEp/TX9Xmc9LQfK2nQ2QKHvZ2oygKUGU0lG4jQ== -serialize-javascript@^3.0.0: - version "3.1.0" - resolved "https://registry.yarnpkg.com/serialize-javascript/-/serialize-javascript-3.1.0.tgz#8bf3a9170712664ef2561b44b691eafe399214ea" - integrity sha512-JIJT1DGiWmIKhzRsG91aS6Ze4sFUrYbltlkg2onR5OrnNM02Kl/hnY/T4FN2omvyeBbQmMJv+K4cPOpGzOTFBg== +serialize-javascript@^4.0.0: + version "4.0.0" + resolved "https://registry.yarnpkg.com/serialize-javascript/-/serialize-javascript-4.0.0.tgz#b525e1238489a5ecfc42afacc3fe99e666f4b1aa" + integrity sha512-GaNA54380uFefWghODBWEGisLZFj00nS5ACs6yHa9nLqlLpVLO8ChDGeKRjZnV4Nh4n0Qi7nhYZD/9fCPzEqkw== dependencies: randombytes "^2.1.0" +serve-handler@^6.1.3: + version "6.1.3" + resolved "https://registry.yarnpkg.com/serve-handler/-/serve-handler-6.1.3.tgz#1bf8c5ae138712af55c758477533b9117f6435e8" + integrity sha512-FosMqFBNrLyeiIDvP1zgO6YoTzFYHxLDEIavhlmQ+knB2Z7l1t+kGLHkZIDN7UVWqQAmKI3D20A6F6jo3nDd4w== + dependencies: + bytes "3.0.0" + content-disposition "0.5.2" + fast-url-parser "1.1.3" + mime-types "2.1.18" + minimatch "3.0.4" + path-is-inside "1.0.2" + path-to-regexp "2.2.1" + range-parser "1.2.0" + serve-index@^1.9.1: version "1.9.1" resolved "https://registry.yarnpkg.com/serve-index/-/serve-index-1.9.1.tgz#d3768d69b1e7d82e5ce050fff5b453bea12a9239" @@ -8758,6 +8793,11 @@ source-map@^0.6.0, source-map@^0.6.1, source-map@~0.6.0, source-map@~0.6.1: resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.6.1.tgz#74722af32e9614e9c287a8d0bbde48b5e2f1a263" integrity sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g== +source-map@^0.7.3: + version "0.7.3" + resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.7.3.tgz#5302f8169031735226544092e64981f751750383" + integrity sha512-CkCj6giN3S+n9qrYiBTX5gystlENnRW5jZeNLHpe6aue+SrHcG5VYwujhW9s4dY31mEGsxBDrHR6oI69fTXsaQ== + space-separated-tokens@^1.0.0: version "1.1.5" resolved "https://registry.yarnpkg.com/space-separated-tokens/-/space-separated-tokens-1.1.5.tgz#85f32c3d10d9682007e917414ddc5c26d1aa6899" @@ -8798,21 +8838,6 @@ sprintf-js@~1.0.2: resolved "https://registry.yarnpkg.com/sprintf-js/-/sprintf-js-1.0.3.tgz#04e6926f662895354f3dd015203633b857297e2c" integrity sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw= -sshpk@^1.7.0: - version "1.16.1" - resolved "https://registry.yarnpkg.com/sshpk/-/sshpk-1.16.1.tgz#fb661c0bef29b39db40769ee39fa70093d6f6877" - integrity sha512-HXXqVUq7+pcKeLqqZj6mHFUMvXtOJt1uoUx09pFW6011inTMxqI8BA8PM95myrIyyKwdnzjdFjLiE6KBPVtJIg== - dependencies: - asn1 "~0.2.3" - assert-plus "^1.0.0" - bcrypt-pbkdf "^1.0.0" - dashdash "^1.12.0" - ecc-jsbn "~0.1.1" - getpass "^0.1.1" - jsbn "~0.1.0" - safer-buffer "^2.0.2" - tweetnacl "~0.14.0" - ssri@^6.0.1: version "6.0.1" resolved "https://registry.yarnpkg.com/ssri/-/ssri-6.0.1.tgz#2a3c41b28dd45b62b63676ecb74001265ae9edd8" @@ -8833,11 +8858,6 @@ stable@^0.1.8: resolved "https://registry.yarnpkg.com/stable/-/stable-0.1.8.tgz#836eb3c8382fe2936feaf544631017ce7d47a3cf" integrity sha512-ji9qxRnOVfcuLDySj9qzhGSEFVobyt1kIOSkj1qZzYLzq7Tos/oUUWvotUPQLlrsidqsK6tBH89Bc9kL5zHA6w== -stack-utils@^1.0.1: - version "1.0.2" - resolved "https://registry.yarnpkg.com/stack-utils/-/stack-utils-1.0.2.tgz#33eba3897788558bebfc2db059dc158ec36cebb8" - integrity sha512-MTX+MeG5U994cazkjd/9KNAapsHnibjMLnfXodlkXw76JEea0UiNzrqidzo1emMwk7w5Qhc9jd4Bn9TBb1MFwA== - state-toggle@^1.0.0: version "1.0.3" resolved "https://registry.yarnpkg.com/state-toggle/-/state-toggle-1.0.3.tgz#e123b16a88e143139b09c6852221bc9815917dfe" @@ -8909,7 +8929,7 @@ string-width@^3.0.0, string-width@^3.1.0: is-fullwidth-code-point "^2.0.0" strip-ansi "^5.1.0" -string-width@^4.1.0: +string-width@^4.0.0, string-width@^4.1.0: version "4.2.0" resolved "https://registry.yarnpkg.com/string-width/-/string-width-4.2.0.tgz#952182c46cc7b2c313d1596e623992bd163b72b5" integrity sha512-zUz5JD+tgqtuDjMhwIg5uFVV3dtqZ9yQJlZVfq4I01/K5Paj5UHj7VyrQOJvzawSVlKpObApbfD0Ed6yJc+1eg== @@ -8918,7 +8938,7 @@ string-width@^4.1.0: is-fullwidth-code-point "^3.0.0" strip-ansi "^6.0.0" -string.prototype.trimend@^1.0.0: +string.prototype.trimend@^1.0.1: version "1.0.1" resolved "https://registry.yarnpkg.com/string.prototype.trimend/-/string.prototype.trimend-1.0.1.tgz#85812a6b847ac002270f5808146064c995fb6913" integrity sha512-LRPxFUaTtpqYsTeNKaFOw3R4bxIzWOnbQ837QfBylo8jIxtcbK/A/sMV7Q+OAV/vWo+7s25pOE10KYSjaSO06g== @@ -8926,25 +8946,7 @@ string.prototype.trimend@^1.0.0: define-properties "^1.1.3" es-abstract "^1.17.5" -string.prototype.trimleft@^2.1.1: - version "2.1.2" - resolved "https://registry.yarnpkg.com/string.prototype.trimleft/-/string.prototype.trimleft-2.1.2.tgz#4408aa2e5d6ddd0c9a80739b087fbc067c03b3cc" - integrity sha512-gCA0tza1JBvqr3bfAIFJGqfdRTyPae82+KTnm3coDXkZN9wnuW3HjGgN386D7hfv5CHQYCI022/rJPVlqXyHSw== - dependencies: - define-properties "^1.1.3" - es-abstract "^1.17.5" - string.prototype.trimstart "^1.0.0" - -string.prototype.trimright@^2.1.1: - version "2.1.2" - resolved "https://registry.yarnpkg.com/string.prototype.trimright/-/string.prototype.trimright-2.1.2.tgz#c76f1cef30f21bbad8afeb8db1511496cfb0f2a3" - integrity sha512-ZNRQ7sY3KroTaYjRS6EbNiiHrOkjihL9aQE/8gfQ4DtAC/aEBRHFJa44OmoWxGGqXuJlfKkZW4WcXErGr+9ZFg== - dependencies: - define-properties "^1.1.3" - es-abstract "^1.17.5" - string.prototype.trimend "^1.0.0" - -string.prototype.trimstart@^1.0.0: +string.prototype.trimstart@^1.0.1: version "1.0.1" resolved "https://registry.yarnpkg.com/string.prototype.trimstart/-/string.prototype.trimstart-1.0.1.tgz#14af6d9f34b053f7cfc89b72f8f2ee14b9039a54" integrity sha512-XxZn+QpvrBI1FOcg6dIpxUPgWCPuNXvMD72aaRaUQv1eD4e/Qy8i/hFTe0BUmD60p/QA6bh1avmuPTfNjqVWRw== @@ -9011,20 +9013,18 @@ strip-final-newline@^2.0.0: resolved "https://registry.yarnpkg.com/strip-final-newline/-/strip-final-newline-2.0.0.tgz#89b852fb2fcbe936f6f4b3187afb0a12c1ab58ad" integrity sha512-BrpvfNAE3dcvq7ll3xVumzjKjZQ5tI1sEUIKr3Uoks0XUl45St3FlatVqef9prk4jRDzhW6WZg+3bk93y6pLjA== -style-to-object@0.3.0: +strip-json-comments@~2.0.1: + version "2.0.1" + resolved "https://registry.yarnpkg.com/strip-json-comments/-/strip-json-comments-2.0.1.tgz#3c531942e908c2697c0ec344858c286c7ca0a60a" + integrity sha1-PFMZQukIwml8DsNEhYwobHygpgo= + +style-to-object@0.3.0, style-to-object@^0.3.0: version "0.3.0" resolved "https://registry.yarnpkg.com/style-to-object/-/style-to-object-0.3.0.tgz#b1b790d205991cc783801967214979ee19a76e46" integrity sha512-CzFnRRXhzWIdItT3OmF8SQfWyahHhjq3HwcMNCNLn+N7klOOqPjMeG/4JSu77D7ypZdGvSzvkrbyeTMizz2VrA== dependencies: inline-style-parser "0.1.1" -style-to-object@^0.2.1: - version "0.2.3" - resolved "https://registry.yarnpkg.com/style-to-object/-/style-to-object-0.2.3.tgz#afcf42bc03846b1e311880c55632a26ad2780bcb" - integrity sha512-1d/k4EY2N7jVLOqf2j04dTc37TPOv/hHxZmvpg8Pdh8UYydxeu/C1W1U4vD8alzf5V2Gt7rLsmkr4dxAlDm9ng== - dependencies: - inline-style-parser "0.1.1" - stylehacks@^4.0.0: version "4.0.3" resolved "https://registry.yarnpkg.com/stylehacks/-/stylehacks-4.0.3.tgz#6718fcaf4d1e07d8a1318690881e8d96726a71d5" @@ -9089,40 +9089,45 @@ tapable@^1.0.0, tapable@^1.1.3: resolved "https://registry.yarnpkg.com/tapable/-/tapable-1.1.3.tgz#a1fccc06b58db61fd7a45da2da44f5f3a3e67ba2" integrity sha512-4WK/bYZmj8xLr+HUCODHGF1ZFzsYffasLUgEiMBY4fgtltdO6B4WJtlSbPaDTLpYTcGVwM2qLnFTICEcNxs3kA== +term-size@^2.1.0: + version "2.2.0" + resolved "https://registry.yarnpkg.com/term-size/-/term-size-2.2.0.tgz#1f16adedfe9bdc18800e1776821734086fcc6753" + integrity sha512-a6sumDlzyHVJWb8+YofY4TW112G6p2FCPEAFk+59gIYHv3XHRhm9ltVQ9kli4hNWeQBwSpe8cRN25x0ROunMOw== + terser-webpack-plugin@^1.4.3: - version "1.4.3" - resolved "https://registry.yarnpkg.com/terser-webpack-plugin/-/terser-webpack-plugin-1.4.3.tgz#5ecaf2dbdc5fb99745fd06791f46fc9ddb1c9a7c" - integrity sha512-QMxecFz/gHQwteWwSo5nTc6UaICqN1bMedC5sMtUc7y3Ha3Q8y6ZO0iCR8pq4RJC8Hjf0FEPEHZqcMB/+DFCrA== + version "1.4.5" + resolved "https://registry.yarnpkg.com/terser-webpack-plugin/-/terser-webpack-plugin-1.4.5.tgz#a217aefaea330e734ffacb6120ec1fa312d6040b" + integrity sha512-04Rfe496lN8EYruwi6oPQkG0vo8C+HT49X687FZnpPF0qMAIHONI6HEXYPKDOE8e5HjXTyKfqRd/agHtH0kOtw== dependencies: cacache "^12.0.2" find-cache-dir "^2.1.0" is-wsl "^1.1.0" schema-utils "^1.0.0" - serialize-javascript "^2.1.2" + serialize-javascript "^4.0.0" source-map "^0.6.1" terser "^4.1.2" webpack-sources "^1.4.0" worker-farm "^1.7.0" terser-webpack-plugin@^2.3.5: - version "2.3.6" - resolved "https://registry.yarnpkg.com/terser-webpack-plugin/-/terser-webpack-plugin-2.3.6.tgz#a4014b311a61f87c6a1b217ef4f5a75bd0665a69" - integrity sha512-I8IDsQwZrqjdmOicNeE8L/MhwatAap3mUrtcAKJuilsemUNcX+Hier/eAzwStVqhlCxq0aG3ni9bK/0BESXkTg== + version "2.3.8" + resolved "https://registry.yarnpkg.com/terser-webpack-plugin/-/terser-webpack-plugin-2.3.8.tgz#894764a19b0743f2f704e7c2a848c5283a696724" + integrity sha512-/fKw3R+hWyHfYx7Bv6oPqmk4HGQcrWLtV3X6ggvPuwPNHSnzvVV51z6OaaCOus4YLjutYGOz3pEpbhe6Up2s1w== dependencies: cacache "^13.0.1" find-cache-dir "^3.3.1" jest-worker "^25.4.0" p-limit "^2.3.0" schema-utils "^2.6.6" - serialize-javascript "^3.0.0" + serialize-javascript "^4.0.0" source-map "^0.6.1" terser "^4.6.12" webpack-sources "^1.4.3" terser@^4.1.2, terser@^4.6.12, terser@^4.6.3: - version "4.7.0" - resolved "https://registry.yarnpkg.com/terser/-/terser-4.7.0.tgz#15852cf1a08e3256a80428e865a2fa893ffba006" - integrity sha512-Lfb0RiZcjRDXCC3OSHJpEkxJ9Qeqs6mp2v4jf2MHfy8vGERmVDuvjXdd/EnP5Deme5F2yBRBymKmKHCBg2echw== + version "4.8.0" + resolved "https://registry.yarnpkg.com/terser/-/terser-4.8.0.tgz#63056343d7c70bb29f3af665865a46fe03a0df17" + integrity sha512-EAPipTNeWsb/3wLPeup1tVPaXfIaU68xMnVdPafIL1TV05OhASArYyIfFvnvJCNrR2NIOvDVNNTFRa+Re2MWyw== dependencies: commander "^2.20.0" source-map "~0.6.1" @@ -9141,7 +9146,7 @@ through2@^2.0.0: readable-stream "~2.3.6" xtend "~4.0.1" -through@^2.3.6, through@~2.3.4: +through@^2.3.6: version "2.3.8" resolved "https://registry.yarnpkg.com/through/-/through-2.3.8.tgz#0dd4c9ffaabc357960b1b724115d7e0e86a2e1f5" integrity sha1-DdTJ/6q8NXlgsbckEV1+Doai4fU= @@ -9190,11 +9195,6 @@ to-arraybuffer@^1.0.0: resolved "https://registry.yarnpkg.com/to-arraybuffer/-/to-arraybuffer-1.0.1.tgz#7d229b1fcc637e466ca081180836a7aabff83f43" integrity sha1-fSKbH8xjfkZsoIEYCDanqr/4P0M= -to-factory@^1.0.0: - version "1.0.0" - resolved "https://registry.yarnpkg.com/to-factory/-/to-factory-1.0.0.tgz#8738af8bd97120ad1d4047972ada5563bf9479b1" - integrity sha1-hzivi9lxIK0dQEeXKtpVY7+UebE= - to-fast-properties@^2.0.0: version "2.0.0" resolved "https://registry.yarnpkg.com/to-fast-properties/-/to-fast-properties-2.0.0.tgz#dc5e698cbd079265bc73e0377681a4e4e83f616e" @@ -9207,6 +9207,11 @@ to-object-path@^0.3.0: dependencies: kind-of "^3.0.2" +to-readable-stream@^1.0.0: + version "1.0.0" + resolved "https://registry.yarnpkg.com/to-readable-stream/-/to-readable-stream-1.0.0.tgz#ce0aa0c2f3df6adf852efb404a783e77c0475771" + integrity sha512-Iq25XBt6zD5npPhlLVXGFN3/gyR2/qODcKNNyTMd4vbm39HUaOiAM4PMq0eMVC/Tkxz+Zjdsc55g9yyz+Yq00Q== + to-regex-range@^2.1.0: version "2.1.1" resolved "https://registry.yarnpkg.com/to-regex-range/-/to-regex-range-2.1.1.tgz#7c80c17b9dfebe599e27367e0d4dd5590141db38" @@ -9237,14 +9242,6 @@ toidentifier@1.0.0: resolved "https://registry.yarnpkg.com/toidentifier/-/toidentifier-1.0.0.tgz#7e1be3470f1e77948bc43d94a3c8f4d7752ba553" integrity sha512-yaOH/Pk/VEhBWWTlhI+qXxDFXlejDGcQipMlyxda9nthulaxLZUNcUqFxokp0vcYnvteJln5FNQDRrxj3YcbVw== -tough-cookie@~2.5.0: - version "2.5.0" - resolved "https://registry.yarnpkg.com/tough-cookie/-/tough-cookie-2.5.0.tgz#cd9fb2a0aa1d5a12b473bd9fb96fa3dcff65ade2" - integrity sha512-nlLsUzgm1kfLXSXfRZMc1KLAugd4hqJHDTvc2hDIwS3mZAfMEuMbc03SujMF+GEcpaX/qboeycw6iO8JwVv2+g== - dependencies: - psl "^1.1.28" - punycode "^2.1.1" - tr46@^1.0.1: version "1.0.1" resolved "https://registry.yarnpkg.com/tr46/-/tr46-1.0.1.tgz#a8b13fd6bfd2489519674ccde55ba3693b706d09" @@ -9282,38 +9279,26 @@ ts-pnp@^1.1.6: resolved "https://registry.yarnpkg.com/ts-pnp/-/ts-pnp-1.2.0.tgz#a500ad084b0798f1c3071af391e65912c86bca92" integrity sha512-csd+vJOb/gkzvcCHgTGSChYpy5f1/XKNsmvBGO4JXS+z1v2HobugDz4s1IeFXM3wZB44uczs+eazB5Q/ccdhQw== -tslib@^1.10.0: +tslib@^1.10.0, tslib@^1.9.0: version "1.13.0" resolved "https://registry.yarnpkg.com/tslib/-/tslib-1.13.0.tgz#c881e13cc7015894ed914862d276436fa9a47043" integrity sha512-i/6DQjL8Xf3be4K/E6Wgpekn5Qasl1usyw++dAA35Ue5orEn65VIxOA+YvNNl9HV3qv70T7CNwjODHZrLwvd1Q== -tslib@^1.9.0: - version "1.11.1" - resolved "https://registry.yarnpkg.com/tslib/-/tslib-1.11.1.tgz#eb15d128827fbee2841549e171f45ed338ac7e35" - integrity sha512-aZW88SY8kQbU7gpV19lN24LtXh/yD4ZZg6qieAJDDg+YBsJcSmLGK9QpnUjAKVG/xefmvJGd1WUmfpT/g6AJGA== - tty-browserify@0.0.0: version "0.0.0" resolved "https://registry.yarnpkg.com/tty-browserify/-/tty-browserify-0.0.0.tgz#a157ba402da24e9bf957f9aa69d524eed42901a6" integrity sha1-oVe6QC2iTpv5V/mqadUk7tQpAaY= -tunnel-agent@^0.6.0: - version "0.6.0" - resolved "https://registry.yarnpkg.com/tunnel-agent/-/tunnel-agent-0.6.0.tgz#27a5dea06b36b04a0a9966774b290868f0fc40fd" - integrity sha1-J6XeoGs2sEoKmWZ3SykIaPD8QP0= - dependencies: - safe-buffer "^5.0.1" - -tweetnacl@^0.14.3, tweetnacl@~0.14.0: - version "0.14.5" - resolved "https://registry.yarnpkg.com/tweetnacl/-/tweetnacl-0.14.5.tgz#5ae68177f192d4456269d108afa93ff8743f4f64" - integrity sha1-WuaBd/GS1EViadEIr6k/+HQ/T2Q= - type-fest@^0.11.0: version "0.11.0" resolved "https://registry.yarnpkg.com/type-fest/-/type-fest-0.11.0.tgz#97abf0872310fed88a5c466b25681576145e33f1" integrity sha512-OdjXJxnCN1AvyLSzeKIgXTXxV+99ZuXl3Hpo9XpJAv9MBcHrrJOQ5kV7ypXOuQie+AmWG25hLbiKdwYTifzcfQ== +type-fest@^0.8.1: + version "0.8.1" + resolved "https://registry.yarnpkg.com/type-fest/-/type-fest-0.8.1.tgz#09e249ebde851d3b1e48d27c105444667f17b83d" + integrity sha512-4dbzIzqvjtgiM5rw1k5rEHtBANKmdudhGyBEajN01fEyhaAIhsoKNy6y7+IN93IfpFtwY9iqi7kD+xwKhQsNJA== + type-is@~1.6.17, type-is@~1.6.18: version "1.6.18" resolved "https://registry.yarnpkg.com/type-is/-/type-is-1.6.18.tgz#4e552cd05df09467dcbc4ef739de89f2cf37c131" @@ -9322,6 +9307,13 @@ type-is@~1.6.17, type-is@~1.6.18: media-typer "0.3.0" mime-types "~2.1.24" +typedarray-to-buffer@^3.1.5: + version "3.1.5" + resolved "https://registry.yarnpkg.com/typedarray-to-buffer/-/typedarray-to-buffer-3.1.5.tgz#a97ee7a9ff42691b9f783ff1bc5112fe3fca9080" + integrity sha512-zdu8XMNEDepKKR+XYOXAVPtWui0ly0NtohUscw+UmaHiAWT8hrV1rr//H6V+0DvJ3OQ19S979M0laLfX8rm82Q== + dependencies: + is-typedarray "^1.0.0" + typedarray@^0.0.6: version "0.0.6" resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777" @@ -9358,10 +9350,10 @@ unicode-property-aliases-ecmascript@^1.0.4: resolved "https://registry.yarnpkg.com/unicode-property-aliases-ecmascript/-/unicode-property-aliases-ecmascript-1.1.0.tgz#dd57a99f6207bedff4628abefb94c50db941c8f4" integrity sha512-PqSoPh/pWetQ2phoj5RLiaqIk4kCNwoV3CI+LfGmWLKI3rE3kl1h59XpX2BjgDrmbxD9ARtQobPGU1SguCYuQg== -unified@9.0.0: - version "9.0.0" - resolved "https://registry.yarnpkg.com/unified/-/unified-9.0.0.tgz#12b099f97ee8b36792dbad13d278ee2f696eed1d" - integrity sha512-ssFo33gljU3PdlWLjNp15Inqb77d6JnJSfyplGJPT/a+fNRNyCBeveBAYJdO5khKdF6WVHa/yYCC7Xl6BDwZUQ== +unified@9.1.0: + version "9.1.0" + resolved "https://registry.yarnpkg.com/unified/-/unified-9.1.0.tgz#7ba82e5db4740c47a04e688a9ca8335980547410" + integrity sha512-VXOv7Ic6twsKGJDeZQ2wwPqXs2hM0KNu5Hkg9WgAZbSD1pxhZ7p8swqg583nw1Je2fhwHy6U8aEjiI79x1gvag== dependencies: bail "^1.0.0" extend "^3.0.0" @@ -9415,6 +9407,13 @@ unique-slug@^2.0.0: dependencies: imurmurhash "^0.1.4" +unique-string@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/unique-string/-/unique-string-2.0.0.tgz#39c6451f81afb2749de2b233e3f7c5e8843bd89d" + integrity sha512-uNaeirEPvpZWSgzwsPGtU2zVSTrn/8L5q/IexZmH0eH6SA73CmAA5U4GwORTxQAZs95TAXLNqeLoPPNO5gZfWg== + dependencies: + crypto-random-string "^2.0.0" + unist-builder@2.0.3, unist-builder@^2.0.0: version "2.0.3" resolved "https://registry.yarnpkg.com/unist-builder/-/unist-builder-2.0.3.tgz#77648711b5d86af0942f334397a33c5e91516436" @@ -9425,11 +9424,6 @@ unist-util-generated@^1.0.0: resolved "https://registry.yarnpkg.com/unist-util-generated/-/unist-util-generated-1.1.5.tgz#1e903e68467931ebfaea386dae9ea253628acd42" integrity sha512-1TC+NxQa4N9pNdayCYA1EGUOCAO0Le3fVp7Jzns6lnua/mYgwHo0tz5WUAfrdpNch1RZLHc61VZ1SDgrtNXLSw== -unist-util-is@^3.0.0: - version "3.0.0" - resolved "https://registry.yarnpkg.com/unist-util-is/-/unist-util-is-3.0.0.tgz#d9e84381c2468e82629e4a5be9d7d05a2dd324cd" - integrity sha512-sVZZX3+kspVNmLWBPAB6r+7D9ZgAFPNWm66f7YNb420RlQSbn+n8rG8dGZSkrER7ZIXGQYNm5pqC3v3HopH24A== - unist-util-is@^4.0.0: version "4.0.2" resolved "https://registry.yarnpkg.com/unist-util-is/-/unist-util-is-4.0.2.tgz#c7d1341188aa9ce5b3cff538958de9895f14a5de" @@ -9462,17 +9456,17 @@ unist-util-stringify-position@^2.0.0: "@types/unist" "^2.0.2" unist-util-visit-parents@^3.0.0: - version "3.0.2" - resolved "https://registry.yarnpkg.com/unist-util-visit-parents/-/unist-util-visit-parents-3.0.2.tgz#d4076af3011739c71d2ce99d05de37d545f4351d" - integrity sha512-yJEfuZtzFpQmg1OSCyS9M5NJRrln/9FbYosH3iW0MG402QbdbaB8ZESwUv9RO6nRfLAKvWcMxCwdLWOov36x/g== + version "3.1.0" + resolved "https://registry.yarnpkg.com/unist-util-visit-parents/-/unist-util-visit-parents-3.1.0.tgz#4dd262fb9dcfe44f297d53e882fc6ff3421173d5" + integrity sha512-0g4wbluTF93npyPrp/ymd3tCDTMnP0yo2akFD2FIBAYXq/Sga3lwaU1D8OYKbtpioaI6CkDcQ6fsMnmtzt7htw== dependencies: "@types/unist" "^2.0.0" unist-util-is "^4.0.0" -unist-util-visit@2.0.2, unist-util-visit@^2.0.0, unist-util-visit@^2.0.1, unist-util-visit@^2.0.2: - version "2.0.2" - resolved "https://registry.yarnpkg.com/unist-util-visit/-/unist-util-visit-2.0.2.tgz#3843782a517de3d2357b4c193b24af2d9366afb7" - integrity sha512-HoHNhGnKj6y+Sq+7ASo2zpVdfdRifhTgX2KTU3B/sO/TTlZchp7E3S4vjRzDJ7L60KmrCPsQkVK3lEF3cz36XQ== +unist-util-visit@2.0.3, unist-util-visit@^2.0.0, unist-util-visit@^2.0.1, unist-util-visit@^2.0.2: + version "2.0.3" + resolved "https://registry.yarnpkg.com/unist-util-visit/-/unist-util-visit-2.0.3.tgz#c3703893146df47203bb8a9795af47d7b971208c" + integrity sha512-iJ4/RczbJMkD0712mGktuGpm/U4By4FfDonL7N/9tATGIF4imikjOuagyMY53tnZq3NP6BcmlrHhEKAfGWjh7Q== dependencies: "@types/unist" "^2.0.0" unist-util-is "^4.0.0" @@ -9506,6 +9500,25 @@ upath@^1.1.1: resolved "https://registry.yarnpkg.com/upath/-/upath-1.2.0.tgz#8f66dbcd55a883acdae4408af8b035a5044c1894" integrity sha512-aZwGpamFO61g3OlfT7OQCHqhGnW43ieH9WZeP7QxN/G/jS4jfqUkZxoryvJgVPEcrl5NL/ggHsSmLMHuH64Lhg== +update-notifier@^4.1.0: + version "4.1.1" + resolved "https://registry.yarnpkg.com/update-notifier/-/update-notifier-4.1.1.tgz#895fc8562bbe666179500f9f2cebac4f26323746" + integrity sha512-9y+Kds0+LoLG6yN802wVXoIfxYEwh3FlZwzMwpCZp62S2i1/Jzeqb9Eeeju3NSHccGGasfGlK5/vEHbAifYRDg== + dependencies: + boxen "^4.2.0" + chalk "^3.0.0" + configstore "^5.0.1" + has-yarn "^2.1.0" + import-lazy "^2.1.0" + is-ci "^2.0.0" + is-installed-globally "^0.3.1" + is-npm "^4.0.0" + is-yarn-global "^0.3.0" + latest-version "^5.0.0" + pupa "^2.0.1" + semver-diff "^3.1.1" + xdg-basedir "^4.0.0" + uri-js@^4.2.2: version "4.2.2" resolved "https://registry.yarnpkg.com/uri-js/-/uri-js-4.2.2.tgz#94c540e1ff772956e2299507c010aea6c8838eb0" @@ -9518,6 +9531,22 @@ urix@^0.1.0: resolved "https://registry.yarnpkg.com/urix/-/urix-0.1.0.tgz#da937f7a62e21fec1fd18d49b35c2935067a6c72" integrity sha1-2pN/emLiH+wf0Y1Js1wpNQZ6bHI= +url-loader@^4.1.0: + version "4.1.0" + resolved "https://registry.yarnpkg.com/url-loader/-/url-loader-4.1.0.tgz#c7d6b0d6b0fccd51ab3ffc58a78d32b8d89a7be2" + integrity sha512-IzgAAIC8wRrg6NYkFIJY09vtktQcsvU8V6HhtQj9PTefbYImzLB1hufqo4m+RyM5N3mLx5BqJKccgxJS+W3kqw== + dependencies: + loader-utils "^2.0.0" + mime-types "^2.1.26" + schema-utils "^2.6.5" + +url-parse-lax@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/url-parse-lax/-/url-parse-lax-3.0.0.tgz#16b5cafc07dbe3676c1b1999177823d6503acb0c" + integrity sha1-FrXK/Afb42dsGxmZF3gj1lA6yww= + dependencies: + prepend-http "^2.0.0" + url-parse@^1.4.3: version "1.4.7" resolved "https://registry.yarnpkg.com/url-parse/-/url-parse-1.4.7.tgz#a8a83535e8c00a316e403a5db4ac1b9b853ae278" @@ -9606,19 +9635,10 @@ vendors@^1.0.0: resolved "https://registry.yarnpkg.com/vendors/-/vendors-1.0.4.tgz#e2b800a53e7a29b93506c3cf41100d16c4c4ad8e" integrity sha512-/juG65kTL4Cy2su4P8HjtkTxk6VmJDiOPBufWniqQ6wknac6jNiXS9vU+hO3wgusiyqWlzTbVHi0dyJqRONg3w== -verror@1.10.0: - version "1.10.0" - resolved "https://registry.yarnpkg.com/verror/-/verror-1.10.0.tgz#3a105ca17053af55d6e270c1f8288682e18da400" - integrity sha1-OhBcoXBTr1XW4nDB+CiGguGNpAA= - dependencies: - assert-plus "^1.0.0" - core-util-is "1.0.2" - extsprintf "^1.2.0" - vfile-location@^3.0.0: - version "3.0.1" - resolved "https://registry.yarnpkg.com/vfile-location/-/vfile-location-3.0.1.tgz#d78677c3546de0f7cd977544c367266764d31bb3" - integrity sha512-yYBO06eeN/Ki6Kh1QAkgzYpWT1d3Qln+ZCtSbJqFExPl1S3y2qqotJQXoh6qEvl/jDlgpUJolBn3PItVnnZRqQ== + version "3.1.0" + resolved "https://registry.yarnpkg.com/vfile-location/-/vfile-location-3.1.0.tgz#81cd8a04b0ac935185f4fce16f270503fc2f692f" + integrity sha512-FCZ4AN9xMcjFIG1oGmZKo61PjwJHRVA+0/tPUP2ul4uIwjGGndIxavEMRpWn5p4xwm/ZsdXp9YNygf1ZyE4x8g== vfile-message@^2.0.0: version "2.0.4" @@ -9629,9 +9649,9 @@ vfile-message@^2.0.0: unist-util-stringify-position "^2.0.0" vfile@^4.0.0: - version "4.1.1" - resolved "https://registry.yarnpkg.com/vfile/-/vfile-4.1.1.tgz#282d28cebb609183ac51703001bc18b3e3f17de9" - integrity sha512-lRjkpyDGjVlBA7cDQhQ+gNcvB1BGaTHYuSOcY3S7OhDmBtnzX95FhtZZDecSTDm6aajFymyve6S5DN4ZHGezdQ== + version "4.2.0" + resolved "https://registry.yarnpkg.com/vfile/-/vfile-4.2.0.tgz#26c78ac92eb70816b01d4565e003b7e65a2a0e01" + integrity sha512-a/alcwCvtuc8OX92rqqo7PflxiCgXRFjdyoGVuYV+qbgCb0GgZJRvIgCD4+U/Kl1yhaRsaTwksF88xbPyGsgpw== dependencies: "@types/unist" "^2.0.0" is-buffer "^2.0.0" @@ -9660,15 +9680,15 @@ watchpack-chokidar2@^2.0.0: dependencies: chokidar "^2.1.8" -watchpack@^1.6.1: - version "1.7.2" - resolved "https://registry.yarnpkg.com/watchpack/-/watchpack-1.7.2.tgz#c02e4d4d49913c3e7e122c3325365af9d331e9aa" - integrity sha512-ymVbbQP40MFTp+cNMvpyBpBtygHnPzPkHqoIwRRj/0B8KhqQwV8LaKjtbaxF2lK4vl8zN9wCxS46IFCU5K4W0g== +watchpack@^1.7.4: + version "1.7.4" + resolved "https://registry.yarnpkg.com/watchpack/-/watchpack-1.7.4.tgz#6e9da53b3c80bb2d6508188f5b200410866cd30b" + integrity sha512-aWAgTW4MoSJzZPAicljkO1hsi1oKj/RRq/OJQh2PKI2UKL04c2Bs+MBOB+BBABHTXJpf9mCwHN7ANCvYsvY2sg== dependencies: graceful-fs "^4.1.2" neo-async "^2.5.0" optionalDependencies: - chokidar "^3.4.0" + chokidar "^3.4.1" watchpack-chokidar2 "^2.0.0" wbuf@^1.1.0, wbuf@^1.7.3: @@ -9781,9 +9801,9 @@ webpack-sources@^1.1.0, webpack-sources@^1.4.0, webpack-sources@^1.4.1, webpack- source-map "~0.6.1" webpack@^4.41.2: - version "4.43.0" - resolved "https://registry.yarnpkg.com/webpack/-/webpack-4.43.0.tgz#c48547b11d563224c561dad1172c8aa0b8a678e6" - integrity sha512-GW1LjnPipFW2Y78OOab8NJlCflB7EFskMih2AHdvjbpKMeDJqEgSx24cXXXiPS65+WSwVyxtDsJH6jGX2czy+g== + version "4.44.1" + resolved "https://registry.yarnpkg.com/webpack/-/webpack-4.44.1.tgz#17e69fff9f321b8f117d1fda714edfc0b939cc21" + integrity sha512-4UOGAohv/VGUNQJstzEywwNxqX417FnjZgZJpJQegddzPmTvph37eBIRbRTfdySXzVtJXLJfbMN3mMYhM6GdmQ== dependencies: "@webassemblyjs/ast" "1.9.0" "@webassemblyjs/helper-module-context" "1.9.0" @@ -9793,7 +9813,7 @@ webpack@^4.41.2: ajv "^6.10.2" ajv-keywords "^3.4.1" chrome-trace-event "^1.0.2" - enhanced-resolve "^4.1.0" + enhanced-resolve "^4.3.0" eslint-scope "^4.0.3" json-parse-better-errors "^1.0.2" loader-runner "^2.4.0" @@ -9806,7 +9826,7 @@ webpack@^4.41.2: schema-utils "^1.0.0" tapable "^1.1.3" terser-webpack-plugin "^1.4.3" - watchpack "^1.6.1" + watchpack "^1.7.4" webpack-sources "^1.4.1" webpackbar@^4.0.0: @@ -9831,11 +9851,11 @@ websocket-driver@0.6.5: websocket-extensions ">=0.1.1" websocket-driver@>=0.5.1: - version "0.7.3" - resolved "https://registry.yarnpkg.com/websocket-driver/-/websocket-driver-0.7.3.tgz#a2d4e0d4f4f116f1e6297eba58b05d430100e9f9" - integrity sha512-bpxWlvbbB459Mlipc5GBzzZwhoZgGEZLuqPaR0INBGnPAY1vdBX6hPnoFXiw+3yWxDuHyQjO2oXTMyS8A5haFg== + version "0.7.4" + resolved "https://registry.yarnpkg.com/websocket-driver/-/websocket-driver-0.7.4.tgz#89ad5295bbf64b480abcba31e4953aca706f5760" + integrity sha512-b17KeDIQVjvb0ssuSDF2cYXSg2iztliJ4B9WdsuB6J952qCPKmnVq4DyW5motImXHDC1cBT/1UezrJVsKw5zjg== dependencies: - http-parser-js ">=0.4.0 <0.4.11" + http-parser-js ">=0.5.1" safe-buffer ">=5.1.0" websocket-extensions ">=0.1.1" @@ -9872,6 +9892,13 @@ which@^2.0.1: dependencies: isexe "^2.0.0" +widest-line@^3.1.0: + version "3.1.0" + resolved "https://registry.yarnpkg.com/widest-line/-/widest-line-3.1.0.tgz#8292333bbf66cb45ff0de1603b136b7ae1496eca" + integrity sha512-NsmoXalsWVDMGupxZ5R08ka9flZjjiLvHVAWYOKtiKM8ujtZWr9cRffak+uSE48+Ob8ObalXpwyeUiyDD6QFgg== + dependencies: + string-width "^4.0.0" + worker-farm@^1.7.0: version "1.7.0" resolved "https://registry.yarnpkg.com/worker-farm/-/worker-farm-1.7.0.tgz#26a94c5391bbca926152002f69b84a4bf772e5a8" @@ -9909,6 +9936,16 @@ wrappy@1: resolved "https://registry.yarnpkg.com/wrappy/-/wrappy-1.0.2.tgz#b5243d8f3ec1aa35f1364605bc0d1036e30ab69f" integrity sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8= +write-file-atomic@^3.0.0: + version "3.0.3" + resolved "https://registry.yarnpkg.com/write-file-atomic/-/write-file-atomic-3.0.3.tgz#56bd5c5a5c70481cd19c571bd39ab965a5de56e8" + integrity sha512-AvHcyZ5JnSfq3ioSyjrBkH9yW4m7Ayk8/9My/DD9onKeu/94fwrMocemO2QAJFAlnnDN+ZDS+ZjAR5ua1/PV/Q== + dependencies: + imurmurhash "^0.1.4" + is-typedarray "^1.0.0" + signal-exit "^3.0.2" + typedarray-to-buffer "^3.1.5" + ws@^6.0.0, ws@^6.2.1: version "6.2.1" resolved "https://registry.yarnpkg.com/ws/-/ws-6.2.1.tgz#442fdf0a47ed64f59b6a5d8ff130f4748ed524fb" @@ -9916,6 +9953,11 @@ ws@^6.0.0, ws@^6.2.1: dependencies: async-limiter "~1.0.0" +xdg-basedir@^4.0.0: + version "4.0.0" + resolved "https://registry.yarnpkg.com/xdg-basedir/-/xdg-basedir-4.0.0.tgz#4bc8d9984403696225ef83a1573cbbcb4e79db13" + integrity sha512-PSNhEJDejZYV7h50BohL09Er9VaIefr2LMAf3OEmpCkjOi34eYyQYAXUTjEQtZJTKcF0E2UKTh+osDLsgNim9Q== + xml-js@^1.6.11: version "1.6.11" resolved "https://registry.yarnpkg.com/xml-js/-/xml-js-1.6.11.tgz#927d2f6947f7f1c19a316dd8eea3614e8b18f8e9" @@ -9977,11 +10019,6 @@ yargs@^13.3.2: y18n "^4.0.0" yargs-parser "^13.1.2" -zepto@^1.2.0: - version "1.2.0" - resolved "https://registry.yarnpkg.com/zepto/-/zepto-1.2.0.tgz#e127bd9e66fd846be5eab48c1394882f7c0e4f98" - integrity sha1-4Se9nmb9hGvl6rSME5SIL3wOT5g= - zwitch@^1.0.0: version "1.0.5" resolved "https://registry.yarnpkg.com/zwitch/-/zwitch-1.0.5.tgz#d11d7381ffed16b742f6af7b3f223d5cd9fe9920" From 4393e9009849bd01ed45192f146e996893f04726 Mon Sep 17 00:00:00 2001 From: swyx Date: Thu, 27 Aug 2020 21:14:16 +0800 Subject: [PATCH 040/456] Update ts-config.md --- docs/basic/troubleshooting/ts-config.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/docs/basic/troubleshooting/ts-config.md b/docs/basic/troubleshooting/ts-config.md index c530507d..25948ee4 100644 --- a/docs/basic/troubleshooting/ts-config.md +++ b/docs/basic/troubleshooting/ts-config.md @@ -38,6 +38,8 @@ You can find [all the Compiler options in the TypeScript docs](https://www.types } ``` +You can find more [recommended TS config here](https://github.com/tsconfig/bases). + Please open an issue and discuss if there are better recommended choices for React. Selected flags and why we like them: From 73eee4d936021438e73e87285d27846949be9947 Mon Sep 17 00:00:00 2001 From: swyx Date: Fri, 28 Aug 2020 06:02:36 +0800 Subject: [PATCH 041/456] Update from-js.md --- docs/migration/from-js.md | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/docs/migration/from-js.md b/docs/migration/from-js.md index 81fac039..b05ef320 100644 --- a/docs/migration/from-js.md +++ b/docs/migration/from-js.md @@ -75,7 +75,13 @@ Gradually add [more `strict` mode flags](https://www.typescriptlang.org/docs/han } ``` -**More resources** +## 3 Step Process + +![image](https://user-images.githubusercontent.com/6764957/91499410-f1399080-e8f3-11ea-86f8-431266af713b.png) + +https://speakerdeck.com/amhinson/convert-a-react-native-project-to-typescript-in-10-minutes?slide=23 + +## More resources - [Adopting TypeScript at Scale - AirBnB's conversion story and strategy](https://www.youtube.com/watch?v=P-J9Eg7hJwE) - their [ts-migrate tool here](https://medium.com/airbnb-engineering/ts-migrate-a-tool-for-migrating-to-typescript-at-scale-cd23bfeb5cc) - [Migrating a `create-react-app`/`react-scripts` app to TypeScript](https://facebook.github.io/create-react-app/docs/adding-typescript) - don't use `react-scripts-ts` From 4b7f372705e53e360f7e7a44f00369f6ccc9afd5 Mon Sep 17 00:00:00 2001 From: swyx Date: Fri, 28 Aug 2020 06:05:19 +0800 Subject: [PATCH 042/456] Update patterns_by_usecase.md --- docs/advanced/patterns_by_usecase.md | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/docs/advanced/patterns_by_usecase.md b/docs/advanced/patterns_by_usecase.md index f6fc881b..9ea6bd3a 100644 --- a/docs/advanced/patterns_by_usecase.md +++ b/docs/advanced/patterns_by_usecase.md @@ -140,7 +140,7 @@ _thanks [dmisdm](https://github.com/typescript-cheatsheets/react/issues/23)_ _TODO: check how this conflicts/merges/duplicates with the Troubleshooting Handbook "Types I need weren't Exported" advice_ -## Polymorphic Components +## Polymorphic Components (with `as` props) > "Polymorphic Components" = passing a component to be rendered, e.g. with `as` props @@ -158,8 +158,9 @@ For more info you can refer to these resources: - https://blog.andrewbran.ch/polymorphic-react-components/ - https://github.com/kripod/react-polymorphic-box +- https://stackoverflow.com/questions/58200824/generic-react-typescript-component-with-as-prop-able-to-render-any-valid-dom -[Thanks @eps1lon](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/pull/69) for this! +[Thanks @eps1lon](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/pull/69) and [@karol-majewski](https://github.com/typescript-cheatsheets/react/issues/151) for thoughts! ## Generic Components From 9e58de15faeda557fb648ffaa457ec4535b793dc Mon Sep 17 00:00:00 2001 From: swyx Date: Fri, 28 Aug 2020 06:32:05 +0800 Subject: [PATCH 043/456] Update patterns_by_usecase.md incorporate https://github.com/typescript-cheatsheets/react/issues/235 --- docs/advanced/patterns_by_usecase.md | 12 +++++++++++- 1 file changed, 11 insertions(+), 1 deletion(-) diff --git a/docs/advanced/patterns_by_usecase.md b/docs/advanced/patterns_by_usecase.md index 9ea6bd3a..0135a608 100644 --- a/docs/advanced/patterns_by_usecase.md +++ b/docs/advanced/patterns_by_usecase.md @@ -140,7 +140,7 @@ _thanks [dmisdm](https://github.com/typescript-cheatsheets/react/issues/23)_ _TODO: check how this conflicts/merges/duplicates with the Troubleshooting Handbook "Types I need weren't Exported" advice_ -## Polymorphic Components (with `as` props) +## Polymorphic Components (e.g. with `as` props) > "Polymorphic Components" = passing a component to be rendered, e.g. with `as` props @@ -154,6 +154,16 @@ function PassThrough(props: { as: React.ElementType }) { } ``` +You might also see this with React Router: + +```tsx +const PrivateRoute = ({ component: Component, ...rest }: PrivateRouteProps) => { + const { isLoggedIn } = useAuth(); + + return isLoggedIn ? : ; +}; +``` + For more info you can refer to these resources: - https://blog.andrewbran.ch/polymorphic-react-components/ From cf951851f7d7028783b79f74663291de40f51c98 Mon Sep 17 00:00:00 2001 From: swyx Date: Fri, 28 Aug 2020 06:33:49 +0800 Subject: [PATCH 044/456] Update js-docs.md incorporate https://github.com/typescript-cheatsheets/react/issues/142 --- docs/migration/js-docs.md | 1 + 1 file changed, 1 insertion(+) diff --git a/docs/migration/js-docs.md b/docs/migration/js-docs.md index 12e7fd45..db35fec2 100644 --- a/docs/migration/js-docs.md +++ b/docs/migration/js-docs.md @@ -5,6 +5,7 @@ title: JSDoc - https://github.com/Microsoft/TypeScript/wiki/JsDoc-support-in-JavaScript - webpack's codebase uses JSDoc with linting by TS https://twitter.com/TheLarkInn/status/984479953927327744 (some crazy hack: https://twitter.com/thelarkinn/status/996475530944823296) +- JSDoc can type check if using closure-compiler https://github.com/google/closure-compiler/wiki/Types-in-the-Closure-Type-System Problems to be aware of: From 4837cf19908cad51c29bc324739a05cae668aa90 Mon Sep 17 00:00:00 2001 From: swyx Date: Fri, 28 Aug 2020 06:49:18 +0800 Subject: [PATCH 045/456] Update misc-concerns.md --- docs/advanced/misc-concerns.md | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/docs/advanced/misc-concerns.md b/docs/advanced/misc-concerns.md index 3f775611..888a87a7 100644 --- a/docs/advanced/misc-concerns.md +++ b/docs/advanced/misc-concerns.md @@ -184,3 +184,13 @@ declare module "de-indent" { Any other tips? Please contribute on this topic! [We have an ongoing issue here with some references](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/issues/8). We have more discussion and examples [in our issue here](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/issues/12).
    + + +## Compilation Speed + +Compiling large TS projects can get slow. Here are some tips: + +- use [TS 3.0 Project references](https://react-typescript-cheatsheet.netlify.app/docs/advanced/patterns_by_version#typescript-30) +- Webpack ([see CRA diff](https://gist.github.com/jaredpalmer/d3016701589f14df8a3572df91a5754b)): + - set `output.pathinfo = false` + - set `optimization.splitChunks`, `optimization.removeAvailableModules`, `optimization.removeEmptyChunks` to `false` From df1de4a02e1a8c86f91968e7d695d0d0d567fe07 Mon Sep 17 00:00:00 2001 From: swyx Date: Fri, 28 Aug 2020 18:04:18 +0800 Subject: [PATCH 046/456] Update index.md --- docs/migration/index.md | 4 ---- 1 file changed, 4 deletions(-) diff --git a/docs/migration/index.md b/docs/migration/index.md index 72240341..4a7eee55 100644 --- a/docs/migration/index.md +++ b/docs/migration/index.md @@ -124,10 +124,6 @@ Open Source - Found incorrect function calls for [Tiny][tiny] - Found rarely used, buggy code that was untested for [Tiny][tiny] -[hootsuite]: https://medium.com/hootsuite-engineering/thoughts-on-migrating-to-typescript-5e1a04288202 "Thoughts on migrating to TypeScript" [clayallsop]: https://medium.com/@clayallsopp/incrementally-migrating-javascript-to-typescript-565020e49c88 "Incrementally Migrating JavaScript to TypeScript" [pleo]: https://medium.com/pleo/migrating-a-babel-project-to-typescript-af6cd0b451f4 "Migrating a Babel project to TypeScript" -[mstsreactconversionguide]: https://github.com/Microsoft/TypeScript-React-Conversion-Guide "TypeScript React Conversion Guide" -[entria]: https://medium.com/entria/incremental-migration-to-typescript-on-a-flowtype-codebase-515f6490d92d "Incremental Migration to TypeScript on a Flowtype codebase" -[coherentlabs]: https://hashnode.com/post/how-we-migrated-a-200k-loc-project-to-typescript-and-survived-to-tell-the-story-ciyzhikcc0001y253w00n11yb "How we migrated a 200K+ LOC project to TypeScript and survived to tell the story" [tiny]: https://go.tiny.cloud/blog/benefits-of-gradual-strong-typing-in-javascript/ "Benefits of gradual strong typing in JavaScript" From ae505abf7825c0c9785bbb002653879507d20418 Mon Sep 17 00:00:00 2001 From: swyx Date: Fri, 28 Aug 2020 18:05:03 +0800 Subject: [PATCH 047/456] Update from-flow.md --- docs/migration/from-flow.md | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/docs/migration/from-flow.md b/docs/migration/from-flow.md index 555d5877..e5b5e6ed 100644 --- a/docs/migration/from-flow.md +++ b/docs/migration/from-flow.md @@ -10,3 +10,7 @@ title: From Flow - Quick-n-dirty [Flow to TS Codemod](https://gist.github.com/skovhus/c57367ce6ecbc3f70bb7c80f25727a11) - [Ecobee's brief experience](https://mobile.twitter.com/alanhietala/status/1104450494754377728) - [Migrating a 50K SLOC Flow + React Native app to TypeScript](https://blog.usejournal.com/migrating-a-flow-react-native-app-to-typescript-c74c7bceae7d) + + + +[entria]: https://medium.com/entria/incremental-migration-to-typescript-on-a-flowtype-codebase-515f6490d92d "Incremental Migration to TypeScript on a Flowtype codebase" From 5dc51e2ddecda6a69020744ce331f92994f8054d Mon Sep 17 00:00:00 2001 From: swyx Date: Fri, 28 Aug 2020 18:06:48 +0800 Subject: [PATCH 048/456] Update index.md --- docs/migration/index.md | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/docs/migration/index.md b/docs/migration/index.md index 4a7eee55..4c4f8c58 100644 --- a/docs/migration/index.md +++ b/docs/migration/index.md @@ -127,3 +127,7 @@ Open Source [clayallsop]: https://medium.com/@clayallsopp/incrementally-migrating-javascript-to-typescript-565020e49c88 "Incrementally Migrating JavaScript to TypeScript" [pleo]: https://medium.com/pleo/migrating-a-babel-project-to-typescript-af6cd0b451f4 "Migrating a Babel project to TypeScript" [tiny]: https://go.tiny.cloud/blog/benefits-of-gradual-strong-typing-in-javascript/ "Benefits of gradual strong typing in JavaScript" +[entria]: https://medium.com/entria/incremental-migration-to-typescript-on-a-flowtype-codebase-515f6490d92d "Incremental Migration to TypeScript on a Flowtype codebase" +[mstsreactconversionguide]: https://github.com/Microsoft/TypeScript-React-Conversion-Guide "TypeScript React Conversion Guide" +[coherentlabs]: https://hashnode.com/post/how-we-migrated-a-200k-loc-project-to-typescript-and-survived-to-tell-the-story-ciyzhikcc0001y253w00n11yb "How we migrated a 200K+ LOC project to TypeScript and survived to tell the story" +[hootsuite]: https://medium.com/hootsuite-engineering/thoughts-on-migrating-to-typescript-5e1a04288202 "Thoughts on migrating to TypeScript" From 28b2d0e9aba498f9c46068c273eddcbb9bd78e8e Mon Sep 17 00:00:00 2001 From: swyx Date: Tue, 1 Sep 2020 07:38:21 +0800 Subject: [PATCH 049/456] fix usereducer example (#280) so that it is actually usable --- docs/basic/getting-started/hooks.md | 41 +++++++++++++++++------------ 1 file changed, 24 insertions(+), 17 deletions(-) diff --git a/docs/basic/getting-started/hooks.md b/docs/basic/getting-started/hooks.md index 04116d58..486279c0 100644 --- a/docs/basic/getting-started/hooks.md +++ b/docs/basic/getting-started/hooks.md @@ -29,30 +29,37 @@ setUser(newUser); You can use [Discriminated Unions](https://www.typescriptlang.org/docs/handbook/advanced-types.html#discriminated-unions) for reducer actions. Don't forget to define the return type of reducer, otherwise TypeScript will infer it. ```tsx -type AppState = {}; -type Action = - | { type: "SET_ONE"; payload: string } // typescript union types allow for leading |'s to have nicer layout - | { type: "SET_TWO"; payload: number }; +const initialState = {count: 0}; -export function reducer(state: AppState, action: Action): AppState { +type ACTIONTYPE = + | { type: 'increment', payload: number} + | { type: 'decrement', payload: string} + + +function reducer(state: typeof initialState, action: ACTIONTYPE) { switch (action.type) { - case "SET_ONE": - return { - ...state, - one: action.payload, // `payload` is string - }; - case "SET_TWO": - return { - ...state, - two: action.payload, // `payload` is number - }; + case 'increment': + return {count: state.count + action.payload}; + case 'decrement': + return {count: state.count - Number(action.payload)}; default: - return state; + throw new Error(); } } + +function Counter() { + const [state, dispatch] = React.useReducer(reducer, initialState); + return ( + <> + Count: {state.count} + + + + ); +} ``` -[View in the TypeScript Playground](https://www.typescriptlang.org/play/?jsx=2#code/C4TwDgpgBAgmYGVgENjQLxQN4F8CwAUKJLAMbACWA9gHZTqFRQA+2UxEAXFAEQICiAFQD6AeQBy-HgG4oYZCAA2VZABNuAZ2AAnCjQDmUfASass7cF14CRggOqiZchcrXcaAVwC2AIwjajaUJCCAAPMCptYCgAMw8acmo6bQhVD1J-AAotVCs4RBQ0ABooZETabhhymgBKSvgkXOxGKA0AdwpgUgALKEyyyloAOg4a5pMmKFJkDWg+ITFJHk4WyagU4A9tOixVtaghw5zivbXaKwGkofklFVUoAHoHqAADG9dVF6gKDVadPX0p0Ce2ms2sC3sjhWEzWGy2OyBTEOQ2OECKiPYbSo3Euw3ed0ezzeLjuXx+UE8vn8QJwQRhUFUEBiyA8imA0P26wgm22f1ydKYxhwQA) +[View in the TypeScript Playground](https://www.typescriptlang.org/play?#code/LAKFEsFsAcHsCcAuACAVMghgZ2QJQKYYDGKAZvLJMgOTyEnUDcooRsAdliuO+IuBgA2AZUQZE+ZAF5kAbzYBXdogBcyAAwBfZmBCIAntEkBBAMIAVAJIB5AHLmAmgAUAotOShkyAD5zkBozVqHiI6SHxlagAaZGgMfUFYDAATNXYFSAAjfHhNDxAvX1l-Q3wg5PxQ-HDImLiEpNTkLngeAHM8ll1SJRJwDmQ6ZIUiHIAKLnEykqNYUmQePgERMQkY4n4ONTMrO0dXAEo5T2aAdz4iAAtkMY3+9gA6APwj2ROvImxJYPYqmsRqCp3l5BvhEAp4Ow5IplGpJhIHjCUABqTB9DgPeqJFLaYGfLDfCp-CIAoEFEFeOjgyHQ2BKVTNVb4RF05TIAC0yFsGWy8Fu6MeWMaB1x5K8FVIGAUglUwK8iEuFFOyHY+GVLngFD5Bx0Xk0oH13V6myhplZEm1x3JbE4KAA2vD8DFkuAsHFEFcALruAgbB4KAkEYajPlDEY5GKLfhCURTHUnKkQqFjYEAHgAfHLkGb6WpZI6WfTDRSvKnMgpEIgBhxTIJwEQANZSWRjI5SdPIF1u8RXMayZ7lSphEnRWLxbFNagAVmomhF6fZqYA9OXKxxM2KQWWK1WoTW643m63pB2u+7e-3SkEQsPamOGik1FO55p08jl6vdxuKcvv8h4yAmhAA)
    From af7523e4ac88ee9bb16a7b4dcef8985b21aca4f4 Mon Sep 17 00:00:00 2001 From: swyx Date: Sat, 5 Sep 2020 17:18:04 +0800 Subject: [PATCH 050/456] Update utility-types.md --- docs/advanced/utility-types.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/docs/advanced/utility-types.md b/docs/advanced/utility-types.md index 38f4f795..aecdf713 100644 --- a/docs/advanced/utility-types.md +++ b/docs/advanced/utility-types.md @@ -7,3 +7,5 @@ sidebar_label: Utility Types We will assume knowledge of utility types covered in the sister project [`typescript-cheatsheets/utilities`](https://github.com/typescript-cheatsheets/utilities). Look up libraries included there as well for your typing needs. If you intend to maintain a large TS codebase/a nontrivial React+TS library, **we strongly recommend exploring these utilities** so that you don't reinvent the wheel and/or lose sanity trying to do so. Studying their code can also teach you a lot of advanced TS that is not covered here. + +I also recommend have a good working knowledge of how to construct the inbuilt utility types from scratch. See [Dr. Rasuchmeyer's guide](https://2ality.com/2020/06/computing-with-types.html) for a concise introduction. From 30da3f9ef5e6e2f572aaec14a9b1a24525e3d2ef Mon Sep 17 00:00:00 2001 From: Wei Gao Date: Mon, 7 Sep 2020 17:20:51 +0800 Subject: [PATCH 051/456] add link to DefinitelyTyped React source code (#281) Co-authored-by: swyx --- README.md | 1 + 1 file changed, 1 insertion(+) diff --git a/README.md b/README.md index 354f8049..cb4ecfdc 100644 --- a/README.md +++ b/README.md @@ -2380,6 +2380,7 @@ If you're looking for information on Prettier, check out the [Prettier](https:// - [Lyft's React-To-TypeScript conversion CLI](https://github.com/lyft/react-javascript-to-typescript-transform) - [Gustav Wengel's blogpost - converting a React codebase to TypeScript](http://www.gustavwengel.dk/converting-typescript-to-javascript-part-1) - [Microsoft React TypeScript conversion guide](https://github.com/Microsoft/TypeScript-React-Conversion-Guide#typescript-react-conversion-guide) +- [DefinitelyTyped React source code](https://github.com/DefinitelyTyped/DefinitelyTyped/tree/master/types/react) - [You?](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/issues/new). From 84bfa8198049a0c288aa61991d90e1d31fe9302c Mon Sep 17 00:00:00 2001 From: swyx Date: Wed, 9 Sep 2020 22:30:07 +0800 Subject: [PATCH 052/456] Update utility-types.md --- docs/advanced/utility-types.md | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/docs/advanced/utility-types.md b/docs/advanced/utility-types.md index aecdf713..cac5f634 100644 --- a/docs/advanced/utility-types.md +++ b/docs/advanced/utility-types.md @@ -9,3 +9,7 @@ We will assume knowledge of utility types covered in the sister project [`typesc If you intend to maintain a large TS codebase/a nontrivial React+TS library, **we strongly recommend exploring these utilities** so that you don't reinvent the wheel and/or lose sanity trying to do so. Studying their code can also teach you a lot of advanced TS that is not covered here. I also recommend have a good working knowledge of how to construct the inbuilt utility types from scratch. See [Dr. Rasuchmeyer's guide](https://2ality.com/2020/06/computing-with-types.html) for a concise introduction. + +A level of comfort with **generic types** is therefore required. Here are some helpful resources: + +- https://ts.chibicode.com/generics/ From 79a4e086cf982582d9134238d13c3010f4be309c Mon Sep 17 00:00:00 2001 From: Alexandru-Dan Pop Date: Fri, 11 Sep 2020 17:34:49 +0300 Subject: [PATCH 053/456] add docs for error boundaries (#284) --- .../basic/getting-started/error-boundaries.md | 47 ++++++++++++++++++- 1 file changed, 46 insertions(+), 1 deletion(-) diff --git a/docs/basic/getting-started/error-boundaries.md b/docs/basic/getting-started/error-boundaries.md index 57249249..602cd4f9 100644 --- a/docs/basic/getting-started/error-boundaries.md +++ b/docs/basic/getting-started/error-boundaries.md @@ -3,6 +3,51 @@ id: error_boundaries title: Error Boundaries --- -_Not written yet._ +### Option 1: Using react-error-boundary + +[React-error-boundary](https://github.com/bvaughn/react-error-boundary) - is a lightweight package ready to use for this scenario with TS support built-in. +This approach also lets you avoid class components that are not that popular anymore. + +### Options 2: Writing your custom error boundary component + +If you don't want to add a new npm package for this, you can also write your own `ErrorBoundary` component. + +```jsx +import React, { Component, ErrorInfo, ReactNode } from "react"; + +interface Props { + children: ReactNode; +} + +interface State { + hasError: boolean; +} + +class ErrorBoundary extends Component { + public state: State = { + hasError: false + }; + + public static getDerivedStateFromError(_: Error): State { + // Update state so the next render will show the fallback UI. + return { hasError: true }; + } + + public componentDidCatch(error: Error, errorInfo: ErrorInfo) { + console.error("Uncaught error:", error, errorInfo); + } + + public render() { + if (this.state.hasError) { + return

    Sorry.. there was an error

    ; + } + + return this.props.children; + } +} + +export default ErrorBoundary; + +``` [Something to add? File an issue](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/issues/new). From c38757a6cd70e61be81f4a8398d0f409b603b24e Mon Sep 17 00:00:00 2001 From: "allcontributors[bot]" <46447321+allcontributors[bot]@users.noreply.github.com> Date: Fri, 11 Sep 2020 14:35:24 +0000 Subject: [PATCH 054/456] docs: update CONTRIBUTORS.md [skip ci] --- CONTRIBUTORS.md | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/CONTRIBUTORS.md b/CONTRIBUTORS.md index 1161a203..6ca65b72 100644 --- a/CONTRIBUTORS.md +++ b/CONTRIBUTORS.md @@ -13,11 +13,13 @@
    Andreas
    💻 📖 🚇
    Arvind Srinivasan
    💻 🖋 📖 🚧 + +
    William R. J. Ribeiro
    🤔 + - Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)): From 4eedd15053464f7317f6c7a7850cdcddb61489bb Mon Sep 17 00:00:00 2001 From: "allcontributors[bot]" <46447321+allcontributors[bot]@users.noreply.github.com> Date: Fri, 11 Sep 2020 14:35:25 +0000 Subject: [PATCH 055/456] docs: update README.md [skip ci] From e78df0342c016e68994aeef2c3d64ac8a4669e37 Mon Sep 17 00:00:00 2001 From: "allcontributors[bot]" <46447321+allcontributors[bot]@users.noreply.github.com> Date: Fri, 11 Sep 2020 14:35:26 +0000 Subject: [PATCH 056/456] docs: update .all-contributorsrc [skip ci] --- .all-contributorsrc | 9 +++++++++ 1 file changed, 9 insertions(+) diff --git a/.all-contributorsrc b/.all-contributorsrc index abccff30..13450a8c 100644 --- a/.all-contributorsrc +++ b/.all-contributorsrc @@ -84,6 +84,15 @@ "doc", "maintenance" ] + }, + { + "login": "williamrjribeiro", + "name": "William R. J. Ribeiro", + "avatar_url": "https://avatars2.githubusercontent.com/u/1503499?v=4", + "profile": "http://www.williamrjribeiro.com", + "contributions": [ + "ideas" + ] } ], "contributorsPerLine": 7, From 1f2ff59381b7da00632d3f6109308a325544ace3 Mon Sep 17 00:00:00 2001 From: "allcontributors[bot]" <46447321+allcontributors[bot]@users.noreply.github.com> Date: Fri, 11 Sep 2020 22:36:05 +0800 Subject: [PATCH 057/456] docs: add alexandrudanpop as a contributor (#285) Co-authored-by: allcontributors[bot] <46447321+allcontributors[bot]@users.noreply.github.com> --- .all-contributorsrc | 9 +++++++++ CONTRIBUTORS.md | 4 +++- 2 files changed, 12 insertions(+), 1 deletion(-) diff --git a/.all-contributorsrc b/.all-contributorsrc index abccff30..7a22dcb3 100644 --- a/.all-contributorsrc +++ b/.all-contributorsrc @@ -84,6 +84,15 @@ "doc", "maintenance" ] + }, + { + "login": "alexandrudanpop", + "name": "Alexandru-Dan Pop", + "avatar_url": "https://avatars0.githubusercontent.com/u/15979292?v=4", + "profile": "https://alexandrudanpop.dev/", + "contributions": [ + "doc" + ] } ], "contributorsPerLine": 7, diff --git a/CONTRIBUTORS.md b/CONTRIBUTORS.md index 1161a203..b2c40b87 100644 --- a/CONTRIBUTORS.md +++ b/CONTRIBUTORS.md @@ -13,11 +13,13 @@
    Andreas
    💻 📖 🚇
    Arvind Srinivasan
    💻 🖋 📖 🚧 + +
    Alexandru-Dan Pop
    📖 + - Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)): From 02f799ad77d05b22bd900e2b78c04f586a513583 Mon Sep 17 00:00:00 2001 From: swyx Date: Fri, 11 Sep 2020 22:44:59 +0800 Subject: [PATCH 058/456] use official prettier action --- .github/workflows/main.yml | 25 ++++++++++++++++++------- 1 file changed, 18 insertions(+), 7 deletions(-) diff --git a/.github/workflows/main.yml b/.github/workflows/main.yml index 61f93eb5..918bee0c 100644 --- a/.github/workflows/main.yml +++ b/.github/workflows/main.yml @@ -1,15 +1,19 @@ name: FormatCodeAndShowDiff on: push: - branches: [master] + branches: [main] pull_request: - branches: [master] + branches: [main] jobs: prettier: runs-on: ubuntu-latest steps: - - uses: actions/checkout@v2 + - name: Checkout + uses: actions/checkout@v2 + with: + # Make sure the actual branch is checked out when running on pull requests + ref: ${{ github.head_ref }} - name: Get yarn cache directory id: yarn @@ -24,11 +28,18 @@ jobs: - name: Install dependencies run: yarn install --frozen-lockfile - - name: Format code - run: yarn format + - name: Prettify code + uses: creyD/prettier_action@v2.2 + with: + # This part is also where you can pass other options, for example: + prettier_options: --write **/*.md + + # old formatting code + #- name: Format code + # run: yarn format - - name: Format correct? - run: git diff --exit-code + #- name: Format correct? + # run: git diff --exit-code - name: Danger for Spell Checking run: | From 1de149a1e40654f7ad3c11fdece1732b66b55ef7 Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Sun, 13 Sep 2020 05:04:38 +0800 Subject: [PATCH 059/456] Bump node-fetch from 2.6.0 to 2.6.1 (#287) Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> --- yarn.lock | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/yarn.lock b/yarn.lock index 3bd20447..b6073b00 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2741,9 +2741,9 @@ node-cleanup@^2.1.2: integrity sha1-esGavSl+Caf3KnFUXZUbUX5N3iw= node-fetch@^2.3.0, node-fetch@^2.6.0: - version "2.6.0" - resolved "https://registry.yarnpkg.com/node-fetch/-/node-fetch-2.6.0.tgz#e633456386d4aa55863f676a7ab0daa8fdecb0fd" - integrity sha512-8dG4H5ujfvFiqDmVu9fQ5bOHUC15JMjMY/Zumv26oOvvVJjM67KF8koCWIabKQ1GJIa9r2mMZscBq/TbdOcmNA== + version "2.6.1" + resolved "https://registry.yarnpkg.com/node-fetch/-/node-fetch-2.6.1.tgz#045bd323631f76ed2e2b55573394416b639a0052" + integrity sha512-V4aYg89jEoVRxRb2fJdAg8FHvI7cEyYdVAh94HH0UIK8oJxUfkjlDQN9RbMx+bEjP7+ggMiFRprSti032Oipxw== npm-run-path@^2.0.0: version "2.0.2" From d01eb24586a049fa19eaf9260ec36de8891c825a Mon Sep 17 00:00:00 2001 From: swyx Date: Mon, 14 Sep 2020 22:19:57 +0800 Subject: [PATCH 060/456] format --- CONTRIBUTORS.md | 1 + docs/advanced/misc-concerns.md | 3 +-- docs/advanced/patterns_by_usecase.md | 4 ++-- docs/advanced/utility-types.md | 2 +- docs/basic/getting-started/hooks.md | 25 ++++++++++++++----------- docs/basic/troubleshooting/ts-config.md | 2 +- docs/migration/from-flow.md | 2 -- 7 files changed, 20 insertions(+), 19 deletions(-) diff --git a/CONTRIBUTORS.md b/CONTRIBUTORS.md index b2c40b87..b3448b79 100644 --- a/CONTRIBUTORS.md +++ b/CONTRIBUTORS.md @@ -20,6 +20,7 @@ + Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)): diff --git a/docs/advanced/misc-concerns.md b/docs/advanced/misc-concerns.md index 888a87a7..572d5f2f 100644 --- a/docs/advanced/misc-concerns.md +++ b/docs/advanced/misc-concerns.md @@ -185,7 +185,6 @@ Any other tips? Please contribute on this topic! [We have an ongoing issue here
    - ## Compilation Speed Compiling large TS projects can get slow. Here are some tips: @@ -193,4 +192,4 @@ Compiling large TS projects can get slow. Here are some tips: - use [TS 3.0 Project references](https://react-typescript-cheatsheet.netlify.app/docs/advanced/patterns_by_version#typescript-30) - Webpack ([see CRA diff](https://gist.github.com/jaredpalmer/d3016701589f14df8a3572df91a5754b)): - set `output.pathinfo = false` - - set `optimization.splitChunks`, `optimization.removeAvailableModules`, `optimization.removeEmptyChunks` to `false` + - set `optimization.splitChunks`, `optimization.removeAvailableModules`, `optimization.removeEmptyChunks` to `false` diff --git a/docs/advanced/patterns_by_usecase.md b/docs/advanced/patterns_by_usecase.md index 0135a608..0249d87f 100644 --- a/docs/advanced/patterns_by_usecase.md +++ b/docs/advanced/patterns_by_usecase.md @@ -158,9 +158,9 @@ You might also see this with React Router: ```tsx const PrivateRoute = ({ component: Component, ...rest }: PrivateRouteProps) => { - const { isLoggedIn } = useAuth(); + const { isLoggedIn } = useAuth(); - return isLoggedIn ? : ; + return isLoggedIn ? : ; }; ``` diff --git a/docs/advanced/utility-types.md b/docs/advanced/utility-types.md index cac5f634..825c79ac 100644 --- a/docs/advanced/utility-types.md +++ b/docs/advanced/utility-types.md @@ -8,7 +8,7 @@ We will assume knowledge of utility types covered in the sister project [`typesc If you intend to maintain a large TS codebase/a nontrivial React+TS library, **we strongly recommend exploring these utilities** so that you don't reinvent the wheel and/or lose sanity trying to do so. Studying their code can also teach you a lot of advanced TS that is not covered here. -I also recommend have a good working knowledge of how to construct the inbuilt utility types from scratch. See [Dr. Rasuchmeyer's guide](https://2ality.com/2020/06/computing-with-types.html) for a concise introduction. +I also recommend have a good working knowledge of how to construct the inbuilt utility types from scratch. See [Dr. Rasuchmeyer's guide](https://2ality.com/2020/06/computing-with-types.html) for a concise introduction. A level of comfort with **generic types** is therefore required. Here are some helpful resources: diff --git a/docs/basic/getting-started/hooks.md b/docs/basic/getting-started/hooks.md index 486279c0..7d252df4 100644 --- a/docs/basic/getting-started/hooks.md +++ b/docs/basic/getting-started/hooks.md @@ -29,19 +29,18 @@ setUser(newUser); You can use [Discriminated Unions](https://www.typescriptlang.org/docs/handbook/advanced-types.html#discriminated-unions) for reducer actions. Don't forget to define the return type of reducer, otherwise TypeScript will infer it. ```tsx -const initialState = {count: 0}; - -type ACTIONTYPE = - | { type: 'increment', payload: number} - | { type: 'decrement', payload: string} +const initialState = { count: 0 }; +type ACTIONTYPE = + | { type: "increment"; payload: number } + | { type: "decrement"; payload: string }; function reducer(state: typeof initialState, action: ACTIONTYPE) { switch (action.type) { - case 'increment': - return {count: state.count + action.payload}; - case 'decrement': - return {count: state.count - Number(action.payload)}; + case "increment": + return { count: state.count + action.payload }; + case "decrement": + return { count: state.count - Number(action.payload) }; default: throw new Error(); } @@ -52,8 +51,12 @@ function Counter() { return ( <> Count: {state.count} - - + + ); } diff --git a/docs/basic/troubleshooting/ts-config.md b/docs/basic/troubleshooting/ts-config.md index 25948ee4..4a6da705 100644 --- a/docs/basic/troubleshooting/ts-config.md +++ b/docs/basic/troubleshooting/ts-config.md @@ -38,7 +38,7 @@ You can find [all the Compiler options in the TypeScript docs](https://www.types } ``` -You can find more [recommended TS config here](https://github.com/tsconfig/bases). +You can find more [recommended TS config here](https://github.com/tsconfig/bases). Please open an issue and discuss if there are better recommended choices for React. diff --git a/docs/migration/from-flow.md b/docs/migration/from-flow.md index e5b5e6ed..2ed574d2 100644 --- a/docs/migration/from-flow.md +++ b/docs/migration/from-flow.md @@ -11,6 +11,4 @@ title: From Flow - [Ecobee's brief experience](https://mobile.twitter.com/alanhietala/status/1104450494754377728) - [Migrating a 50K SLOC Flow + React Native app to TypeScript](https://blog.usejournal.com/migrating-a-flow-react-native-app-to-typescript-c74c7bceae7d) - - [entria]: https://medium.com/entria/incremental-migration-to-typescript-on-a-flowtype-codebase-515f6490d92d "Incremental Migration to TypeScript on a Flowtype codebase" From 7f021057ce093e90298d80e829009aa889663611 Mon Sep 17 00:00:00 2001 From: "allcontributors[bot]" <46447321+allcontributors[bot]@users.noreply.github.com> Date: Mon, 14 Sep 2020 22:20:26 +0800 Subject: [PATCH 061/456] docs: add mastorm as a contributor (#289) Co-authored-by: allcontributors[bot] <46447321+allcontributors[bot]@users.noreply.github.com> --- .all-contributorsrc | 9 +++++++++ CONTRIBUTORS.md | 1 + 2 files changed, 10 insertions(+) diff --git a/.all-contributorsrc b/.all-contributorsrc index 7a22dcb3..a1bf188f 100644 --- a/.all-contributorsrc +++ b/.all-contributorsrc @@ -93,6 +93,15 @@ "contributions": [ "doc" ] + }, + { + "login": "mastorm", + "name": "Mathias Storm", + "avatar_url": "https://avatars1.githubusercontent.com/u/10759336?v=4", + "profile": "https://github.com/mastorm", + "contributions": [ + "doc" + ] } ], "contributorsPerLine": 7, diff --git a/CONTRIBUTORS.md b/CONTRIBUTORS.md index b3448b79..29e3e879 100644 --- a/CONTRIBUTORS.md +++ b/CONTRIBUTORS.md @@ -15,6 +15,7 @@
    Alexandru-Dan Pop
    📖 +
    Mathias Storm
    📖 From ff3e04e7f9b71ed22c2c54b63c41604dfb8690f4 Mon Sep 17 00:00:00 2001 From: Mathias Storm Date: Mon, 14 Sep 2020 16:26:05 +0200 Subject: [PATCH 062/456] change useState to infer undefined (#288) Its way cleaner this way. --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index cb4ecfdc..0507f08a 100644 --- a/README.md +++ b/README.md @@ -259,7 +259,7 @@ See also the [Using Inferred Types](#using-inferred-types) section if you need t However, many hooks are initialized with null-ish default values, and you may wonder how to provide types. Explicitly declare the type, and use a union type: ```tsx -const [user, setUser] = React.useState(null); +const [user, setUser] = React.useState(); // later... setUser(newUser); From 3a665fafcd4223d29177c3f8c312ca4fcae0a311 Mon Sep 17 00:00:00 2001 From: "Sung M. Kim" Date: Tue, 15 Sep 2020 15:23:45 -0400 Subject: [PATCH 063/456] Added a function component version of portals example (#291) Co-authored-by: swyx --- docs/basic/getting-started/portals.md | 63 +++++++++++++++++++++++++++ 1 file changed, 63 insertions(+) diff --git a/docs/basic/getting-started/portals.md b/docs/basic/getting-started/portals.md index 5010bd33..d1ac3b9d 100644 --- a/docs/basic/getting-started/portals.md +++ b/docs/basic/getting-started/portals.md @@ -28,6 +28,69 @@ export class Modal extends React.Component { [View in the TypeScript Playground](https://www.typescriptlang.org/play/?jsx=2#code/JYWwDg9gTgLgBAJQKYEMDG8BmUIjgcilQ3wFgAoUSWRYmAEQHkBZObXAo9GAWgBNcZchTQQAdgGd4ICHxQAbBBAjwAvHAFoAriCRiYAOgDmSGAFF5SXfoBCATwCSfABQAiGXPk8cK1wEo4FAk4AAkAFWYAGQsrPRgAbgoAeiTAiQkdYDEjOCy4OwgtKDgACxgQeTZgS1KgwI1gADc4AHdgGBLcvgIPBW9lGHxE4XIkAA9qeDR5IODmWQU4cZg9PmDkbgMAYVxIMTi4AG8KOCX5AC5QiOjLazUNCG07gzQuFZi7tz4m-2GTuFE4HEcXowD48y0+mcAWO5FOp16igGBhQYDAqy2JWqLg6wAkBiQ8j8w1OAF8KP9AXs4gB1aryACqYhkkJg0KO-wRCyRKgMRBkjSQmOxzlx+MJxP+5JGpyIYj4SCg7Nh8LgRBgRTEtG4TGYLzeSAACtAYApRVj8WAcGB8WgsfI+HKADRwMUEokkuDS0lAA) +
    + Using hooks + +Same as above but using hooks + +```tsx +import React, { useEffect, useRef } from "react"; +import { createPortal } from "react-dom"; + +const modalRoot = document.querySelector("#modal-root") as HTMLElement; + +const Modal: React.FC<{}> = ({ children }) => { + const el = useRef(document.createElement("div")); + + useEffect(() => { + // We assume `modalRoot` exists with '!' + modalRoot!.appendChild(el.current); + return () => void modalRoot!.removeChild(el.current); + }, []); + + return createPortal(children, el.current); +}; + +export default Modal; +``` + +[View in the TypeScript Playground](https://www.typescriptlang.org/play?#code/JYWwDg9gTgLgBAJQKYEMDG8BmUIjgcilQ3wFgAoUSWOAbzjSJRiQAVoYUAbOAXzmy4CTDAFoAJrjLkKAellwUAZyUBXEMAB2Aczha4ATwiqocABYwQPTMC5JzyxXHHAAbnADuwGGb3iCIBDi3KI4EDD4ANwUFGgQmkrwALJB3ABciMQwAHQAYgDCADy0vAB8cAC8cAAU9GhmtuJEmnwAlJXltBRwcPJwAKIgqlzM9j72aCMqDLiQmkiaEUp6CZyaaPauKFDAKABGdp7evihwRJjdM6twSDxVyOg5qkpIyJjVkmjqCzmMqCz9OwgH7VABELlcoNarWiMnIPQeGGyzyQ-UwmCQGGq1XaFU6lx6fQA6vZlGpgXAAAaBYJcBAQcKUm4AD2AiWWXh8BAAhNIej04tcadx6eFKs4IF9gYtsgBHVRIKAGADKt0xMGgYIAxMKuKEGTAoYplgAJAAqSQAMoCkNKYLD+XBdaKYNzsigwGAFuJ8g0uOJqrdsl8oM0YDCCWckDATC0cR04K4IMB-M6DW6iIFXEhfY1A1xgyYwxH4XwADRwADaAF0S5c+gBJVaofwQTBU26UivjK6cLSKvTLHuU86F0M-SmXIgxqAtP6jdiwbjVeqNZoVoMh4uw3iwuQKZ4obRIGLkTCqdYwYDxOAAQU98a6pcFiSrSjMEA8KVpFZeMGVH5fqkXDVuKiJPC8yqcCw1SYNwLwlj006xjUkaFBCpSRoSChGKoDAoC08EQHAYCqPAPhsishjGKYiTMMAaDmJY1i2CepaOuhbh+BUoK6vq4SgqUhSyBhWF0O+n7ftwcAAGQyah7GOnAhRSVwmGKUpykQmJmmJAYdgVLQT6aSZzhsmAIwGBkoLaDs4igmWOkmRZ6BIA2LAgEo1kbIsioOU5mlmEgwDaBY1kAIwAAyRa4Zj+RpplHOIPgZPgUUxWY+COQlpl7OgADWtnGJo4jWVA2h5dUkVltVtXZOFrTxYlSkAF5NuISDMhkACc3XZc1PS8LwAVwOpA1wA2+B4KcurcrQoJwKCw05UphR7GRGotHpBlGXlaCFTgF6lYtYAegYKAeA0YBLfw8T5FwDH5YZ8Z4nAf4AZJwGwfBSCtGUkwQC8wnrTAm1jYlwmiStwmqeDjp-WJa0bTed0Pftz24uU72Aap1QwFACp-aUEkeHAqnA8jmhw-yfREK+bbUSYiiemhIluODrQULwQA) + +
    + +Modal Component Usage Example: + +```tsx +function App() { + const [showModal, setShowModal] = React.useState(false); + return ( +
    + // you can also put this in your static html file + + {showModal && ( + +
    + I'm a modal!{" "} + +
    +     + )} + + // rest of your app +
    + ) +} +``` +
    Context of Example From 7cb3fdbc6f359ca18c495410de62a67fb3d295bb Mon Sep 17 00:00:00 2001 From: swyx Date: Wed, 16 Sep 2020 23:56:07 +0800 Subject: [PATCH 064/456] fixes for https://github.com/typescript-cheatsheets/react/issues/292 --- README.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/README.md b/README.md index 0507f08a..a8694c0f 100644 --- a/README.md +++ b/README.md @@ -2075,7 +2075,7 @@ This section needs writing, but you can probably find a good starting point with # Troubleshooting Handbook: tsconfig.json -You can find [all the Compiler options in the TypeScript docs](https://www.typescriptlang.org/docs/handbook/compiler-options.html). [The new TS docs also has per-flag annotations of what each does](https://www.typescriptlang.org/v2/en/tsconfig#allowSyntheticDefaultImports). This is the setup I roll with for APPS (not libraries - for libraries you may wish to see the settings we use in `tsdx`): +You can find [all the Compiler options in the TypeScript docs](https://www.typescriptlang.org/docs/handbook/compiler-options.html). [The new TS docs also has per-flag annotations of what each does](https://www.typescriptlang.org/tsconfig). This is the setup I roll with for APPS (not libraries - for libraries you may wish to see the settings we use in `tsdx`): ```json { @@ -2117,7 +2117,7 @@ Selected flags and why we like them: - `strict`: `strictPropertyInitialization` forces you to initialize class properties or explicitly declare that they can be undefined. You can opt out of this with a definite assignment assertion. - `"typeRoots": ["./typings", "./node_modules/@types"]`: By default, TypeScript looks in `node_modules/@types` and parent folders for third party type declarations. You may wish to override this default resolution so you can put all your global type declarations in a special `typings` folder. -Compilation speed grows linearly with size of codebase. For large projects, you will want to use [Project References](https://www.typescriptlang.org/docs/handbook/project-references.html). See our [ADVANCED](ADVANCED.md) cheatsheet for commentary. +Compilation speed grows linearly with size of codebase. For large projects, you will want to use [Project References](https://www.typescriptlang.org/docs/handbook/project-references.html). See our [ADVANCED](https://react-typescript-cheatsheet.netlify.app/docs/advanced/intro) cheatsheet for commentary. From 70240aafd3b796ffb229454d732cb43ac7163fd4 Mon Sep 17 00:00:00 2001 From: swyx Date: Thu, 17 Sep 2020 02:55:30 +0800 Subject: [PATCH 065/456] fix https://github.com/typescript-cheatsheets/react/issues/293 fix https://github.com/typescript-cheatsheets/react/issues/293 --- docs/basic/troubleshooting/official-typings-bugs.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/docs/basic/troubleshooting/official-typings-bugs.md b/docs/basic/troubleshooting/official-typings-bugs.md index 1f48a4bc..e538256f 100644 --- a/docs/basic/troubleshooting/official-typings-bugs.md +++ b/docs/basic/troubleshooting/official-typings-bugs.md @@ -1,7 +1,7 @@ --- id: official_typings_bugs -title: Getting Started -sidebar_label: Bugs in official typings +title: Fixing bugs in official typings +sidebar_label: Fixing bugs in official typings --- If you run into bugs with your library's official typings, you can copy them locally and tell TypeScript to use your local version using the "paths" field. In your `tsconfig.json`: From f0fbc5f559e5f47a2ed365d263fa723f168f67f1 Mon Sep 17 00:00:00 2001 From: swyx Date: Thu, 17 Sep 2020 02:57:28 +0800 Subject: [PATCH 066/456] Update full-example.md --- docs/hoc/full-example.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/hoc/full-example.md b/docs/hoc/full-example.md index 74e64860..d1c4a9b6 100644 --- a/docs/hoc/full-example.md +++ b/docs/hoc/full-example.md @@ -1,7 +1,7 @@ --- id: full_example sidebar_label: Full HOC Example -title: "Section 0: Full HOC Example" +title: "Full HOC Example" --- > This is an HOC example for you to copy and paste. If you certain pieces don't make sense for you, head to [Section 1](#section-1-react-hoc-docs-in-typescript) to get a detailed walkthrough via a complete translation of the React docs in TypeScript. From 0a35ef3d71948a9f3c5ec0956021decd5a56dadd Mon Sep 17 00:00:00 2001 From: swyx Date: Thu, 17 Sep 2020 02:57:40 +0800 Subject: [PATCH 067/456] Update utility-types.md --- docs/advanced/utility-types.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/advanced/utility-types.md b/docs/advanced/utility-types.md index 825c79ac..fd145299 100644 --- a/docs/advanced/utility-types.md +++ b/docs/advanced/utility-types.md @@ -1,6 +1,6 @@ --- id: utility_types -title: "Section 0: Utility Types" +title: "Utility Types" sidebar_label: Utility Types --- From c557a5a93cd73f238dd716c6b0d47249f1ba170e Mon Sep 17 00:00:00 2001 From: swyx Date: Thu, 17 Sep 2020 02:59:00 +0800 Subject: [PATCH 068/456] Update full-example.md --- docs/hoc/full-example.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/hoc/full-example.md b/docs/hoc/full-example.md index d1c4a9b6..ed02de70 100644 --- a/docs/hoc/full-example.md +++ b/docs/hoc/full-example.md @@ -4,7 +4,7 @@ sidebar_label: Full HOC Example title: "Full HOC Example" --- -> This is an HOC example for you to copy and paste. If you certain pieces don't make sense for you, head to [Section 1](#section-1-react-hoc-docs-in-typescript) to get a detailed walkthrough via a complete translation of the React docs in TypeScript. +> This is an HOC example for you to copy and paste. If you certain pieces don't make sense for you, head to [the React HOC Docs intro](https://react-typescript-cheatsheet.netlify.app/docs/hoc/react_hoc_docs/) to get a detailed walkthrough via a complete translation of the React docs in TypeScript. Sometimes you want a simple way to inject props from somewhere else (either a global store or a provider) and don't want to continually pass down the props for it. Context is great for it, but then the values from the context can only be used in your `render` function. A HoC will provide these values as props. From ffe767cdac8b8f7b3562bde67586d73ead08102d Mon Sep 17 00:00:00 2001 From: swyx Date: Thu, 17 Sep 2020 02:59:37 +0800 Subject: [PATCH 069/456] format --- docs/basic/getting-started/portals.md | 13 +++++++++---- 1 file changed, 9 insertions(+), 4 deletions(-) diff --git a/docs/basic/getting-started/portals.md b/docs/basic/getting-started/portals.md index d1ac3b9d..a66f18a6 100644 --- a/docs/basic/getting-started/portals.md +++ b/docs/basic/getting-started/portals.md @@ -58,7 +58,7 @@ export default Modal;
    -Modal Component Usage Example: +Modal Component Usage Example: ```tsx function App() { @@ -74,20 +74,25 @@ function App() { display: "grid", placeItems: "center", height: "100vh", - width: '100vh', + width: "100vh", background: "rgba(0,0,0,0.1)", zIndex: 99, }} > I'm a modal!{" "} - +

    )} // rest of your app
    - ) + ); } ``` From dbd7c107cfbd4e24439fb7ea3523ae6b671ae038 Mon Sep 17 00:00:00 2001 From: "allcontributors[bot]" <46447321+allcontributors[bot]@users.noreply.github.com> Date: Thu, 17 Sep 2020 03:07:01 +0800 Subject: [PATCH 070/456] docs: add dance2die as a contributor (#295) Co-authored-by: allcontributors[bot] <46447321+allcontributors[bot]@users.noreply.github.com> --- .all-contributorsrc | 10 ++++++++++ CONTRIBUTORS.md | 2 +- 2 files changed, 11 insertions(+), 1 deletion(-) diff --git a/.all-contributorsrc b/.all-contributorsrc index a1bf188f..6871dfdf 100644 --- a/.all-contributorsrc +++ b/.all-contributorsrc @@ -102,6 +102,16 @@ "contributions": [ "doc" ] + }, + { + "login": "dance2die", + "name": "Sung M. Kim", + "avatar_url": "https://avatars1.githubusercontent.com/u/8465237?v=4", + "profile": "https://twitter.com/dance2die", + "contributions": [ + "doc", + "ideas" + ] } ], "contributorsPerLine": 7, diff --git a/CONTRIBUTORS.md b/CONTRIBUTORS.md index 29e3e879..3f15ad76 100644 --- a/CONTRIBUTORS.md +++ b/CONTRIBUTORS.md @@ -16,12 +16,12 @@
    Alexandru-Dan Pop
    📖
    Mathias Storm
    📖 +
    Sung M. Kim
    📖 🤔 - Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)): From 509b1db312b6caf368cb2187b2e81de72639ca50 Mon Sep 17 00:00:00 2001 From: Ryota Murakami Date: Fri, 18 Sep 2020 01:26:39 +0900 Subject: [PATCH 071/456] examples.md: add cypress-realworld-app (#297) --- docs/basic/examples.md | 1 + 1 file changed, 1 insertion(+) diff --git a/docs/basic/examples.md b/docs/basic/examples.md index 0a94e128..9ede3b4b 100644 --- a/docs/basic/examples.md +++ b/docs/basic/examples.md @@ -6,3 +6,4 @@ sidebar_label: Examples - [Create React App TypeScript Todo Example 2020](https://github.com/laststance/create-react-app-typescript-todo-example-2020) - [Ben Awad's 14 hour Fullstack React/GraphQL/TypeScript Tutorial](https://www.youtube.com/watch?v=I6ypD7qv3Z8) +- [Cypress Realworld App](https://github.com/cypress-io/cypress-realworld-app) From 2df25e99a0961f91a092626459765859018d9e8c Mon Sep 17 00:00:00 2001 From: "allcontributors[bot]" <46447321+allcontributors[bot]@users.noreply.github.com> Date: Fri, 18 Sep 2020 00:38:42 +0800 Subject: [PATCH 072/456] docs: add ryota-murakami as a contributor (#298) Co-authored-by: allcontributors[bot] <46447321+allcontributors[bot]@users.noreply.github.com> --- .all-contributorsrc | 10 ++++++++++ CONTRIBUTORS.md | 1 + 2 files changed, 11 insertions(+) diff --git a/.all-contributorsrc b/.all-contributorsrc index 6871dfdf..436b4bc3 100644 --- a/.all-contributorsrc +++ b/.all-contributorsrc @@ -112,6 +112,16 @@ "doc", "ideas" ] + }, + { + "login": "ryota-murakami", + "name": "Ryota Murakami", + "avatar_url": "https://avatars2.githubusercontent.com/u/5501268?v=4", + "profile": "https://ryota-murakami.github.io/", + "contributions": [ + "example", + "doc" + ] } ], "contributorsPerLine": 7, diff --git a/CONTRIBUTORS.md b/CONTRIBUTORS.md index 3f15ad76..a3eb9555 100644 --- a/CONTRIBUTORS.md +++ b/CONTRIBUTORS.md @@ -17,6 +17,7 @@
    Alexandru-Dan Pop
    📖
    Mathias Storm
    📖
    Sung M. Kim
    📖 🤔 +
    Ryota Murakami
    💡 📖 From a3166946891a7f9035922e20d40070704a0eca41 Mon Sep 17 00:00:00 2001 From: "Sung M. Kim" Date: Sun, 20 Sep 2020 21:49:31 -0400 Subject: [PATCH 073/456] Fixed collapsible content indentation (#302) --- docs/advanced/types-react-ap.md | 121 ++++++++++++++++---------------- 1 file changed, 60 insertions(+), 61 deletions(-) diff --git a/docs/advanced/types-react-ap.md b/docs/advanced/types-react-ap.md index baa19e88..6ac5dd29 100644 --- a/docs/advanced/types-react-ap.md +++ b/docs/advanced/types-react-ap.md @@ -39,67 +39,66 @@ Not Commonly Used but Good to know - `ComponentPropsWithoutRef` - props of a component without its `ref` prop - `HTMLProps` and `HTMLAttributes` - these are the most generic versions, for global attributes (see a list of [attributes marked as "global attribute" on MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes)). In general, prefer `React.ComponentProps`, `JSX.IntrinsicElements`, or [specialized HTMLAttributes interfaces](https://github.com/DefinitelyTyped/DefinitelyTyped/blob/a2aa0406e7bf269eef01292fcb2b24dee89a7d2b/types/react/index.d.ts#L1914-L2625): -
    - - - List of specialized HTMLAttributes - - - Note that there are about 50 of these, which means there are some HTML elements which are not covered. - - - `AnchorHTMLAttributes` - - `AudioHTMLAttributes` - - `AreaHTMLAttributes` - - `BaseHTMLAttributes` - - `BlockquoteHTMLAttributes` - - `ButtonHTMLAttributes` - - `CanvasHTMLAttributes` - - `ColHTMLAttributes` - - `ColgroupHTMLAttributes` - - `DataHTMLAttributes` - - `DetailsHTMLAttributes` - - `DelHTMLAttributes` - - `DialogHTMLAttributes` - - `EmbedHTMLAttributes` - - `FieldsetHTMLAttributes` - - `FormHTMLAttributes` - - `HtmlHTMLAttributes` - - `IframeHTMLAttributes` - - `ImgHTMLAttributes` - - `InsHTMLAttributes` - - `InputHTMLAttributes` - - `KeygenHTMLAttributes` - - `LabelHTMLAttributes` - - `LiHTMLAttributes` - - `LinkHTMLAttributes` - - `MapHTMLAttributes` - - `MenuHTMLAttributes` - - `MediaHTMLAttributes` - - `MetaHTMLAttributes` - - `MeterHTMLAttributes` - - `QuoteHTMLAttributes` - - `ObjectHTMLAttributes` - - `OlHTMLAttributes` - - `OptgroupHTMLAttributes` - - `OptionHTMLAttributes` - - `OutputHTMLAttributes` - - `ParamHTMLAttributes` - - `ProgressHTMLAttributes` - - `SlotHTMLAttributes` - - `ScriptHTMLAttributes` - - `SelectHTMLAttributes` - - `SourceHTMLAttributes` - - `StyleHTMLAttributes` - - `TableHTMLAttributes` - - `TextareaHTMLAttributes` - - `TdHTMLAttributes` - - `ThHTMLAttributes` - - `TimeHTMLAttributes` - - `TrackHTMLAttributes` - - `VideoHTMLAttributes` - - `WebViewHTMLAttributes` - -
    +
    + + List of specialized HTMLAttributes + + +Note that there are about 50 of these, which means there are some HTML elements which are not covered. + +- `AnchorHTMLAttributes` +- `AudioHTMLAttributes` +- `AreaHTMLAttributes` +- `BaseHTMLAttributes` +- `BlockquoteHTMLAttributes` +- `ButtonHTMLAttributes` +- `CanvasHTMLAttributes` +- `ColHTMLAttributes` +- `ColgroupHTMLAttributes` +- `DataHTMLAttributes` +- `DetailsHTMLAttributes` +- `DelHTMLAttributes` +- `DialogHTMLAttributes` +- `EmbedHTMLAttributes` +- `FieldsetHTMLAttributes` +- `FormHTMLAttributes` +- `HtmlHTMLAttributes` +- `IframeHTMLAttributes` +- `ImgHTMLAttributes` +- `InsHTMLAttributes` +- `InputHTMLAttributes` +- `KeygenHTMLAttributes` +- `LabelHTMLAttributes` +- `LiHTMLAttributes` +- `LinkHTMLAttributes` +- `MapHTMLAttributes` +- `MenuHTMLAttributes` +- `MediaHTMLAttributes` +- `MetaHTMLAttributes` +- `MeterHTMLAttributes` +- `QuoteHTMLAttributes` +- `ObjectHTMLAttributes` +- `OlHTMLAttributes` +- `OptgroupHTMLAttributes` +- `OptionHTMLAttributes` +- `OutputHTMLAttributes` +- `ParamHTMLAttributes` +- `ProgressHTMLAttributes` +- `SlotHTMLAttributes` +- `ScriptHTMLAttributes` +- `SelectHTMLAttributes` +- `SourceHTMLAttributes` +- `StyleHTMLAttributes` +- `TableHTMLAttributes` +- `TextareaHTMLAttributes` +- `TdHTMLAttributes` +- `ThHTMLAttributes` +- `TimeHTMLAttributes` +- `TrackHTMLAttributes` +- `VideoHTMLAttributes` +- `WebViewHTMLAttributes` + +
    - all methods: `createElement`, `cloneElement`, ... are all public and reflect the React runtime API From 64b64cf06ab2b1bf5c5d29fc7bfe1783cd61acd5 Mon Sep 17 00:00:00 2001 From: swyx Date: Mon, 21 Sep 2020 12:25:06 +0800 Subject: [PATCH 074/456] fix anchor link in #using-inferred-types closes https://github.com/typescript-cheatsheets/react/issues/299 --- docs/basic/getting-started/hooks.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/basic/getting-started/hooks.md b/docs/basic/getting-started/hooks.md index 7d252df4..85c96df0 100644 --- a/docs/basic/getting-started/hooks.md +++ b/docs/basic/getting-started/hooks.md @@ -13,7 +13,7 @@ Type inference works very well most of the time: const [val, toggle] = React.useState(false); // `val` is inferred to be a boolean, `toggle` only takes booleans ``` -See also the [Using Inferred Types](#using-inferred-types) section if you need to use a complex type that you've relied on inference for. +See also the [Using Inferred Types](https://react-typescript-cheatsheet.netlify.app/docs/basic/troubleshooting/types/#using-inferred-types) section if you need to use a complex type that you've relied on inference for. However, many hooks are initialized with null-ish default values, and you may wonder how to provide types. Explicitly declare the type, and use a union type: From b0b327829c5ce7f522c7db902536dfb1b3bc2a6c Mon Sep 17 00:00:00 2001 From: swyx Date: Mon, 21 Sep 2020 21:57:15 +0800 Subject: [PATCH 075/456] format --- CONTRIBUTORS.md | 1 + 1 file changed, 1 insertion(+) diff --git a/CONTRIBUTORS.md b/CONTRIBUTORS.md index a3eb9555..9e76cc9f 100644 --- a/CONTRIBUTORS.md +++ b/CONTRIBUTORS.md @@ -23,6 +23,7 @@ + Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)): From e2ea170a80ea9eec39693e8a9b2eda3524865c0b Mon Sep 17 00:00:00 2001 From: Arvind Srinivasan Date: Mon, 21 Sep 2020 21:32:52 +0530 Subject: [PATCH 076/456] Quick fix: Manual correction of TOC (#304) Will review the code for this and make another PR later. --- README.md | 30 +++++++++++++++--------------- 1 file changed, 15 insertions(+), 15 deletions(-) diff --git a/README.md b/README.md index a8694c0f..1271df00 100644 --- a/README.md +++ b/README.md @@ -62,9 +62,9 @@ - [Section 1: Setup](#section-1-setup) - - [Prerequisites](#prerequisites) - - [React + TypeScript Starter Kits](#react--typescript-starter-kits) - - [Import React](#import-react) + - [Prerequisites](#prerequisites) + - [React + TypeScript Starter Kits](#react--typescript-starter-kits) + - [Import React](#import-react) - [Section 2: Getting Started](#section-2-getting-started) - [Function Components](#function-components) - [Hooks](#hooks) @@ -82,18 +82,18 @@ - [Concurrent React/React Suspense](#concurrent-reactreact-suspense) - [Basic Troubleshooting Handbook: Types](#basic-troubleshooting-handbook-types) - - [Union Types and Type Guarding](#union-types-and-type-guarding) - - [Optional Types](#optional-types) - - [Enum Types](#enum-types) - - [Type Assertion](#type-assertion) - - [Simulating Nominal Types](#simulating-nominal-types) - - [Intersection Types](#intersection-types) - - [Union Types](#union-types) - - [Overloading Function Types](#overloading-function-types) - - [Using Inferred Types](#using-inferred-types) - - [Using Partial Types](#using-partial-types) - - [The Types I need weren't exported!](#the-types-i-need-werent-exported) - - [The Types I need Don't Exist!](#the-types-i-need-dont-exist) + - [Union Types and Type Guarding](#union-types-and-type-guarding) + - [Optional Types](#optional-types) + - [Enum Types](#enum-types) + - [Type Assertion](#type-assertion) + - [Simulating Nominal Types](#simulating-nominal-types) + - [Intersection Types](#intersection-types) + - [Union Types](#union-types) + - [Overloading Function Types](#overloading-function-types) + - [Using Inferred Types](#using-inferred-types) + - [Using Partial Types](#using-partial-types) + - [The Types I need weren't exported!](#the-types-i-need-werent-exported) +- [The Types I need Don't Exist!](#the-types-i-need-dont-exist) - [Troubleshooting Handbook: Operators](#troubleshooting-handbook-operators) - [Troubleshooting Handbook: Utilties](#troubleshooting-handbook-utilities) - [Troubleshooting Handbook: tsconfig.json](#troubleshooting-handbook-tsconfigjson) From 756deb4ad854f64809d2e1bb64e908b8d57963e3 Mon Sep 17 00:00:00 2001 From: "Sung M. Kim" Date: Mon, 21 Sep 2020 22:12:39 -0400 Subject: [PATCH 077/456] Made the expandable content more prominent (#305) --- website/src/css/custom.css | 15 +++++++++++++++ 1 file changed, 15 insertions(+) diff --git a/website/src/css/custom.css b/website/src/css/custom.css index f63aec9c..d598605f 100644 --- a/website/src/css/custom.css +++ b/website/src/css/custom.css @@ -21,10 +21,25 @@ main details { margin-top: 1rem; margin-bottom: 1rem; + padding: 1rem 1rem 0; + border: 0.15rem solid var(--ifm-color-emphasis-300); + border-radius: var(--ifm-pagination-nav-border-radius); } main details summary { margin-bottom: 1rem; + outline: none; + /* Make it look like a link to notify user that it's clickable */ + text-decoration: underline; +} + +main details summary:hover { + cursor: pointer; + /* Hide the underline on hover */ + text-decoration: none; +} +main details:hover { + border-color: var(--ifm-pagination-nav-color-hover); } .homePageBtns { From 07983d6f17d7000a864699d4e300bdba1855aef2 Mon Sep 17 00:00:00 2001 From: swyx Date: Sat, 26 Sep 2020 16:01:51 +0800 Subject: [PATCH 078/456] Update editor-integration.md --- docs/basic/editor-integration.md | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/docs/basic/editor-integration.md b/docs/basic/editor-integration.md index 3d976dcb..dea7dd24 100644 --- a/docs/basic/editor-integration.md +++ b/docs/basic/editor-integration.md @@ -13,3 +13,11 @@ title: Editor Tooling and Integration - peitalin/vim-jsx-typescript - NeoVim: https://github.com/neoclide/coc.nvim - other discussion: https://mobile.twitter.com/ryanflorence/status/1085715595994095620 + +You are free to use this repo's TSX logo if you wish: + +[![https://user-images.githubusercontent.com/6764957/53868378-2b51fc80-3fb3-11e9-9cee-0277efe8a927.png](https://user-images.githubusercontent.com/6764957/53868378-2b51fc80-3fb3-11e9-9cee-0277efe8a927.png)](https://user-images.githubusercontent.com/6764957/53868378-2b51fc80-3fb3-11e9-9cee-0277efe8a927.png) + +You may also wish to use alternative logos - [jsx-tsx-logos](https://github.com/Protectator/jsx-tsx-logos) + +![https://github.com/Protectator/jsx-tsx-logos/raw/master/example.png](https://github.com/Protectator/jsx-tsx-logos/raw/master/example.png) From cae2f58af5b6c3ad042a631e4d5973aeafc2d47f Mon Sep 17 00:00:00 2001 From: "Sung M. Kim" Date: Sun, 27 Sep 2020 16:44:19 -0400 Subject: [PATCH 079/456] Prevent text selection on summary field (#310) --- website/src/css/custom.css | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/website/src/css/custom.css b/website/src/css/custom.css index d598605f..55785110 100644 --- a/website/src/css/custom.css +++ b/website/src/css/custom.css @@ -31,6 +31,12 @@ main details summary { outline: none; /* Make it look like a link to notify user that it's clickable */ text-decoration: underline; + + /* Refer to #309 */ + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; } main details summary:hover { From f62f4820749107799503a46398da2280bdf4ad73 Mon Sep 17 00:00:00 2001 From: sw-yx Date: Mon, 28 Sep 2020 04:44:50 +0800 Subject: [PATCH 080/456] format --- README.md | 28 ++++++++++++++-------------- 1 file changed, 14 insertions(+), 14 deletions(-) diff --git a/README.md b/README.md index 1271df00..82241b57 100644 --- a/README.md +++ b/README.md @@ -62,9 +62,9 @@ - [Section 1: Setup](#section-1-setup) - - [Prerequisites](#prerequisites) - - [React + TypeScript Starter Kits](#react--typescript-starter-kits) - - [Import React](#import-react) + - [Prerequisites](#prerequisites) + - [React + TypeScript Starter Kits](#react--typescript-starter-kits) + - [Import React](#import-react) - [Section 2: Getting Started](#section-2-getting-started) - [Function Components](#function-components) - [Hooks](#hooks) @@ -82,17 +82,17 @@ - [Concurrent React/React Suspense](#concurrent-reactreact-suspense) - [Basic Troubleshooting Handbook: Types](#basic-troubleshooting-handbook-types) - - [Union Types and Type Guarding](#union-types-and-type-guarding) - - [Optional Types](#optional-types) - - [Enum Types](#enum-types) - - [Type Assertion](#type-assertion) - - [Simulating Nominal Types](#simulating-nominal-types) - - [Intersection Types](#intersection-types) - - [Union Types](#union-types) - - [Overloading Function Types](#overloading-function-types) - - [Using Inferred Types](#using-inferred-types) - - [Using Partial Types](#using-partial-types) - - [The Types I need weren't exported!](#the-types-i-need-werent-exported) + - [Union Types and Type Guarding](#union-types-and-type-guarding) + - [Optional Types](#optional-types) + - [Enum Types](#enum-types) + - [Type Assertion](#type-assertion) + - [Simulating Nominal Types](#simulating-nominal-types) + - [Intersection Types](#intersection-types) + - [Union Types](#union-types) + - [Overloading Function Types](#overloading-function-types) + - [Using Inferred Types](#using-inferred-types) + - [Using Partial Types](#using-partial-types) + - [The Types I need weren't exported!](#the-types-i-need-werent-exported) - [The Types I need Don't Exist!](#the-types-i-need-dont-exist) - [Troubleshooting Handbook: Operators](#troubleshooting-handbook-operators) - [Troubleshooting Handbook: Utilties](#troubleshooting-handbook-utilities) From 59f74019649b42792efa09eff816bfeb2f727666 Mon Sep 17 00:00:00 2001 From: swyx Date: Mon, 28 Sep 2020 04:48:00 +0800 Subject: [PATCH 081/456] Update index.md --- docs/migration/index.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/docs/migration/index.md b/docs/migration/index.md index 4c4f8c58..798a8ae4 100644 --- a/docs/migration/index.md +++ b/docs/migration/index.md @@ -81,6 +81,8 @@ Special note on `ts-loader` and 3rd party libraries: https://twitter.com/acemark > Our central finding is that both static type systems find an important percentage of public bugs: both Flow 0.30 and TypeScript 2.0 successfully detect 15%! +see also [Things I was Wrong About: Types](https://v5.chriskrycho.com/journal/things-i-was-wrong-about/1-types/) + ## Misc migration stories by notable companies and open source - [Adopting TypeScript at Scale - AirBnB's conversion story and strategy](https://www.youtube.com/watch?v=P-J9Eg7hJwE) From ee08e8fd2808ecaab109d0229504fa95b379845c Mon Sep 17 00:00:00 2001 From: swyx Date: Mon, 28 Sep 2020 06:42:04 +0800 Subject: [PATCH 082/456] document extending window global https://github.com/typescript-cheatsheets/react/issues/257 --- docs/basic/troubleshooting/non-ts-files.md | 18 +++++++++++++++--- 1 file changed, 15 insertions(+), 3 deletions(-) diff --git a/docs/basic/troubleshooting/non-ts-files.md b/docs/basic/troubleshooting/non-ts-files.md index d6289f09..932b49fd 100644 --- a/docs/basic/troubleshooting/non-ts-files.md +++ b/docs/basic/troubleshooting/non-ts-files.md @@ -1,10 +1,22 @@ --- id: non_ts_files -title: "Troubleshooting Handbook: Images and other non-TS/TSX files" -sidebar_label: Images and other non-TS/TSX files +title: "Troubleshooting Handbook: Globals, Images and other non-TS files" +sidebar_label: Globals, Images and other non-TS files --- -Use [declaration merging](https://www.typescriptlang.org/docs/handbook/declaration-merging.html): +Use [declaration merging](https://www.typescriptlang.org/docs/handbook/declaration-merging.html). + +If, say, you are using a third party JS script that attaches on to the `window` global, you can extend `Window`: + +```ts +declare global { + interface Window { + MyVendorThing: MyVendorType + } +} +``` + +Likewise if you wish to "import" an image or other non TS/TSX file: ```ts // declaration.d.ts From 26caec0d7d53092c836bfbd4d3b642b1b9a2ec70 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C3=81rp=C3=A1d=20Illy=C3=A9s?= <13800404+arpi17@users.noreply.github.com> Date: Thu, 1 Oct 2020 00:18:09 +0200 Subject: [PATCH 083/456] Add edit URL to docs (#313) --- website/docusaurus.config.js | 2 ++ 1 file changed, 2 insertions(+) diff --git a/website/docusaurus.config.js b/website/docusaurus.config.js index 4f064557..e342b871 100644 --- a/website/docusaurus.config.js +++ b/website/docusaurus.config.js @@ -32,6 +32,8 @@ module.exports = { path: "../docs", // Sidebars file relative to website dir. sidebarPath: require.resolve("./sidebars.json"), + editUrl: + "https://github.com/typescript-cheatsheets/react/tree/main/docs", }, // ... }, From 4cadf500f20ad2d0bce963fd85d8037c3dead78a Mon Sep 17 00:00:00 2001 From: "allcontributors[bot]" <46447321+allcontributors[bot]@users.noreply.github.com> Date: Thu, 1 Oct 2020 09:28:16 +0800 Subject: [PATCH 084/456] docs: add arpi17 as a contributor (#314) Co-authored-by: allcontributors[bot] <46447321+allcontributors[bot]@users.noreply.github.com> --- .all-contributorsrc | 9 +++++++++ CONTRIBUTORS.md | 2 +- 2 files changed, 10 insertions(+), 1 deletion(-) diff --git a/.all-contributorsrc b/.all-contributorsrc index 4a98679c..436b1929 100644 --- a/.all-contributorsrc +++ b/.all-contributorsrc @@ -131,6 +131,15 @@ "example", "doc" ] + }, + { + "login": "arpi17", + "name": "Árpád Illyés", + "avatar_url": "https://avatars1.githubusercontent.com/u/13800404?v=4", + "profile": "https://github.com/arpi17", + "contributions": [ + "code" + ] } ], "contributorsPerLine": 7, diff --git a/CONTRIBUTORS.md b/CONTRIBUTORS.md index 9b6c3a74..32ea3f31 100644 --- a/CONTRIBUTORS.md +++ b/CONTRIBUTORS.md @@ -19,12 +19,12 @@
    Mathias Storm
    📖
    Sung M. Kim
    📖 🤔
    Ryota Murakami
    💡 📖 +
    Árpád Illyés
    💻 - Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)): From ee0358ee64ebe7b75a060a8c6b4141578fcf8fbb Mon Sep 17 00:00:00 2001 From: Arvind Srinivasan Date: Fri, 2 Oct 2020 12:05:33 +0530 Subject: [PATCH 085/456] Changed tab indent to whitespace indent Fixes issue #303 --- genReadme.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/genReadme.js b/genReadme.js index b2cbc5d4..189123af 100644 --- a/genReadme.js +++ b/genReadme.js @@ -263,7 +263,7 @@ function generateContentForSection(options) { let lines = section_options.content.toc.split("\n"); for (let i = 0, len = lines.length; i < len; i += 1) fenceContent += - "\t".repeat(section_options.tabLevel) + + " ".repeat(section_options.tabLevel) + lines[i] + (i !== len - 1 ? "\n" : ""); } else { From bb8536e967a56e6861bbf9afd5edd56ab4363f61 Mon Sep 17 00:00:00 2001 From: Arvind Srinivasan Date: Fri, 2 Oct 2020 13:41:16 +0530 Subject: [PATCH 086/456] Added Discriminated Unions with Hooks Example --- docs/advanced/patterns_by_usecase.md | 44 ++++++++++++++++++++++++++++ 1 file changed, 44 insertions(+) diff --git a/docs/advanced/patterns_by_usecase.md b/docs/advanced/patterns_by_usecase.md index 0249d87f..37a977aa 100644 --- a/docs/advanced/patterns_by_usecase.md +++ b/docs/advanced/patterns_by_usecase.md @@ -628,6 +628,50 @@ The above example does not work as we are not checking the value of `event.value +
    + + Discriminated Unions in Typescript can also work with hook dependencies in React. The type matched is automatically updated when the corresponding union member based on which a hook depends, changes. Expand more to see an example usecase. + + + ```tsx + import * as React from 'react'; +import { render } from 'react-dom'; +// Typescript discriminated union defined below +type Props = + | { + isArray: true; + value: string[]; + } + | { + isArray: false; + value: string; + }; +const X = (p: Props) => { + return React.useMemo( + () => ( +
    + value(s): + {p.isArray && p.value.join(',')} + {!p.isArray && p.value} +
    + ), + [p.isArray, p.value], // Typescript automatically matches the corresponding value type based on dependency change + ); +}; +function App() { + return ( +
    + + +
    + ); +} +const rootElement = document.getElementById('root'); +render(, rootElement); + ``` + In the above example, based on the `isArray` union member, the type of the `value` hook dependency changes. +
    + To streamline this you may also combine this with the concept of **User-Defined Type Guards**: ```ts From 4409f74d256e9886ca1123701e77ff77e12289ca Mon Sep 17 00:00:00 2001 From: Igor Strebezhev Date: Fri, 2 Oct 2020 11:11:49 +0300 Subject: [PATCH 087/456] Replace an image with a table (#316) That will help to keep the facts up to date. --- .../basic/getting-started/type-or-inteface.md | 24 ++++++++++++++++--- 1 file changed, 21 insertions(+), 3 deletions(-) diff --git a/docs/basic/getting-started/type-or-inteface.md b/docs/basic/getting-started/type-or-inteface.md index 51acb8c4..980a4d36 100644 --- a/docs/basic/getting-started/type-or-inteface.md +++ b/docs/basic/getting-started/type-or-inteface.md @@ -17,9 +17,27 @@ Types are useful for union types (e.g. `type MyType = TypeA | TypeB`) whereas In Useful table for Types vs Interfaces -It's a nuanced topic, don't get too hung up on it. Here's a handy graphic: - -![https://pbs.twimg.com/media/DwV-oOsXcAIct2q.jpg](https://pbs.twimg.com/media/DwV-oOsXcAIct2q.jpg) (source: [Karol Majewski](https://twitter.com/karoljmajewski/status/1082413696075382785)) +It's a nuanced topic, don't get too hung up on it. Here's a handy table: + +| Aspect | Type | Interface | +| ------ | :----: | :---------: | +| Can describe functions | ✅ | ✅ | +| Can describe constructors | ✅ | ✅ | +| Can describe tuples | ✅ | ✅ | +| Interfaces can extend it | ⚠️ | ✅ | +| Classes can extend it | 🚫 | ✅ | +| Classes can implement it (`implements`) | ⚠️ | ✅ | +| Can intersect another one of its kind | ✅ | ⚠️ | +| Can create a union with another one of its kind | ✅ | 🚫 | +| Can be used to create mapped types | ✅ | 🚫 | +| Can be mapped over with mapped types | ✅ | ✅ | +| Expands in error messages and logs | ✅ | 🚫 | +| Can be augmented | 🚫 | ✅ | +| Can be recursive | ⚠️ | ✅ | + +⚠️ In some cases + +(source: [Karol Majewski](https://twitter.com/karoljmajewski/status/1082413696075382785)) From 4e4dce196f5d3f8b52de865a00ac2091736e2308 Mon Sep 17 00:00:00 2001 From: Arvind Srinivasan Date: Fri, 2 Oct 2020 13:47:38 +0530 Subject: [PATCH 088/456] Change Typescript to TypeScript --- docs/advanced/patterns_by_usecase.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/docs/advanced/patterns_by_usecase.md b/docs/advanced/patterns_by_usecase.md index 37a977aa..d5347582 100644 --- a/docs/advanced/patterns_by_usecase.md +++ b/docs/advanced/patterns_by_usecase.md @@ -630,13 +630,13 @@ The above example does not work as we are not checking the value of `event.value
    - Discriminated Unions in Typescript can also work with hook dependencies in React. The type matched is automatically updated when the corresponding union member based on which a hook depends, changes. Expand more to see an example usecase. + Discriminated Unions in TypeScript can also work with hook dependencies in React. The type matched is automatically updated when the corresponding union member based on which a hook depends, changes. Expand more to see an example usecase. ```tsx import * as React from 'react'; import { render } from 'react-dom'; -// Typescript discriminated union defined below +// TypeScript discriminated union defined below type Props = | { isArray: true; @@ -655,7 +655,7 @@ const X = (p: Props) => { {!p.isArray && p.value}
    ), - [p.isArray, p.value], // Typescript automatically matches the corresponding value type based on dependency change + [p.isArray, p.value], // TypeScript automatically matches the corresponding value type based on dependency change ); }; function App() { From c414a863f5187b74db0bf8679e4ab8dee8f038ca Mon Sep 17 00:00:00 2001 From: Arvind Srinivasan Date: Fri, 2 Oct 2020 13:53:03 +0530 Subject: [PATCH 089/456] Corrected Discriminated Union Line termination --- docs/advanced/patterns_by_usecase.md | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/docs/advanced/patterns_by_usecase.md b/docs/advanced/patterns_by_usecase.md index d5347582..44529c10 100644 --- a/docs/advanced/patterns_by_usecase.md +++ b/docs/advanced/patterns_by_usecase.md @@ -639,12 +639,12 @@ import { render } from 'react-dom'; // TypeScript discriminated union defined below type Props = | { - isArray: true; - value: string[]; + isArray: true, + value: string[] } | { - isArray: false; - value: string; + isArray: false, + value: string }; const X = (p: Props) => { return React.useMemo( From e73763f36ccd8699b96ad8b7f17179c5d3a609de Mon Sep 17 00:00:00 2001 From: Arvind Srinivasan Date: Fri, 2 Oct 2020 14:00:27 +0530 Subject: [PATCH 090/456] Separated union into its own types --- docs/advanced/patterns_by_usecase.md | 18 +++++++++--------- 1 file changed, 9 insertions(+), 9 deletions(-) diff --git a/docs/advanced/patterns_by_usecase.md b/docs/advanced/patterns_by_usecase.md index 44529c10..b45c701c 100644 --- a/docs/advanced/patterns_by_usecase.md +++ b/docs/advanced/patterns_by_usecase.md @@ -633,19 +633,19 @@ The above example does not work as we are not checking the value of `event.value Discriminated Unions in TypeScript can also work with hook dependencies in React. The type matched is automatically updated when the corresponding union member based on which a hook depends, changes. Expand more to see an example usecase. - ```tsx + ```ts import * as React from 'react'; import { render } from 'react-dom'; // TypeScript discriminated union defined below -type Props = - | { - isArray: true, - value: string[] - } - | { - isArray: false, - value: string +type SingleElement = { + isArray: true; + value: string[]; }; +type MultiElement = { + isArray: false; + value: string; + }; +type Props = SingleElement | MultiElement; const X = (p: Props) => { return React.useMemo( () => ( From 1a0f6a444e6912162362b18d72959cf87a7c48cc Mon Sep 17 00:00:00 2001 From: Arvind Srinivasan Date: Fri, 2 Oct 2020 14:05:07 +0530 Subject: [PATCH 091/456] Update patterns_by_usecase.md --- docs/advanced/patterns_by_usecase.md | 17 ++++------------- 1 file changed, 4 insertions(+), 13 deletions(-) diff --git a/docs/advanced/patterns_by_usecase.md b/docs/advanced/patterns_by_usecase.md index b45c701c..f304a588 100644 --- a/docs/advanced/patterns_by_usecase.md +++ b/docs/advanced/patterns_by_usecase.md @@ -633,18 +633,11 @@ The above example does not work as we are not checking the value of `event.value Discriminated Unions in TypeScript can also work with hook dependencies in React. The type matched is automatically updated when the corresponding union member based on which a hook depends, changes. Expand more to see an example usecase. - ```ts + ```tsx import * as React from 'react'; import { render } from 'react-dom'; -// TypeScript discriminated union defined below -type SingleElement = { - isArray: true; - value: string[]; - }; -type MultiElement = { - isArray: false; - value: string; - }; +type SingleElement = { isArray: true; value: string[]; }; +type MultiElement = { isArray: false; value: string; }; type Props = SingleElement | MultiElement; const X = (p: Props) => { return React.useMemo( @@ -660,14 +653,12 @@ const X = (p: Props) => { }; function App() { return ( -
    +
    ); } -const rootElement = document.getElementById('root'); -render(, rootElement); ``` In the above example, based on the `isArray` union member, the type of the `value` hook dependency changes. From fb511828026c045bad8b0cf0851d079c30c6945e Mon Sep 17 00:00:00 2001 From: Arvind Srinivasan Date: Fri, 2 Oct 2020 14:11:27 +0530 Subject: [PATCH 092/456] Update patterns_by_usecase.md --- docs/advanced/patterns_by_usecase.md | 8 +++----- 1 file changed, 3 insertions(+), 5 deletions(-) diff --git a/docs/advanced/patterns_by_usecase.md b/docs/advanced/patterns_by_usecase.md index f304a588..b633f23e 100644 --- a/docs/advanced/patterns_by_usecase.md +++ b/docs/advanced/patterns_by_usecase.md @@ -634,12 +634,10 @@ The above example does not work as we are not checking the value of `event.value ```tsx - import * as React from 'react'; -import { render } from 'react-dom'; type SingleElement = { isArray: true; value: string[]; }; type MultiElement = { isArray: false; value: string; }; type Props = SingleElement | MultiElement; -const X = (p: Props) => { +function Sequence(p: Props) { return React.useMemo( () => (
    @@ -654,8 +652,8 @@ const X = (p: Props) => { function App() { return (
    - - + +
    ); } From 1df719630523aadaf3d0e203a8b17c7df0d3515e Mon Sep 17 00:00:00 2001 From: "allcontributors[bot]" <46447321+allcontributors[bot]@users.noreply.github.com> Date: Fri, 2 Oct 2020 16:43:56 +0800 Subject: [PATCH 093/456] docs: add xamgore as a contributor (#317) * docs: update CONTRIBUTORS.md [skip ci] * docs: update README.md [skip ci] * docs: update .all-contributorsrc [skip ci] Co-authored-by: allcontributors[bot] <46447321+allcontributors[bot]@users.noreply.github.com> --- .all-contributorsrc | 10 ++++++++++ CONTRIBUTORS.md | 1 + 2 files changed, 11 insertions(+) diff --git a/.all-contributorsrc b/.all-contributorsrc index 436b1929..320e4ba4 100644 --- a/.all-contributorsrc +++ b/.all-contributorsrc @@ -140,6 +140,16 @@ "contributions": [ "code" ] + }, + { + "login": "xamgore", + "name": "Igor Strebezhev", + "avatar_url": "https://avatars3.githubusercontent.com/u/4586392?v=4", + "profile": "https://twitter.com/xamgore", + "contributions": [ + "ideas", + "doc" + ] } ], "contributorsPerLine": 7, diff --git a/CONTRIBUTORS.md b/CONTRIBUTORS.md index 32ea3f31..111a797a 100644 --- a/CONTRIBUTORS.md +++ b/CONTRIBUTORS.md @@ -20,6 +20,7 @@
    Sung M. Kim
    📖 🤔
    Ryota Murakami
    💡 📖
    Árpád Illyés
    💻 +
    Igor Strebezhev
    🤔 📖 From 65aab0dce3a949b9ec0eccd96224ccad6d02901f Mon Sep 17 00:00:00 2001 From: Arvind Srinivasan Date: Fri, 2 Oct 2020 14:24:25 +0530 Subject: [PATCH 094/456] Update patterns_by_usecase.md --- docs/advanced/patterns_by_usecase.md | 10 ++++++++-- 1 file changed, 8 insertions(+), 2 deletions(-) diff --git a/docs/advanced/patterns_by_usecase.md b/docs/advanced/patterns_by_usecase.md index b633f23e..486e3fbf 100644 --- a/docs/advanced/patterns_by_usecase.md +++ b/docs/advanced/patterns_by_usecase.md @@ -634,8 +634,14 @@ The above example does not work as we are not checking the value of `event.value ```tsx -type SingleElement = { isArray: true; value: string[]; }; -type MultiElement = { isArray: false; value: string; }; +type SingleElement = { + isArray: true; + value: string[]; +}; +type MultiElement = { + isArray: false; + value: string; +}; type Props = SingleElement | MultiElement; function Sequence(p: Props) { return React.useMemo( From 65a10f8ae7f2440dc89420bb3be8ce129a8cb0bd Mon Sep 17 00:00:00 2001 From: swyx Date: Fri, 2 Oct 2020 17:40:03 +0800 Subject: [PATCH 095/456] stray whitespace --- docs/advanced/patterns_by_usecase.md | 32 +++++++++++++++------------- 1 file changed, 17 insertions(+), 15 deletions(-) diff --git a/docs/advanced/patterns_by_usecase.md b/docs/advanced/patterns_by_usecase.md index 486e3fbf..a1d344c2 100644 --- a/docs/advanced/patterns_by_usecase.md +++ b/docs/advanced/patterns_by_usecase.md @@ -632,15 +632,15 @@ The above example does not work as we are not checking the value of `event.value Discriminated Unions in TypeScript can also work with hook dependencies in React. The type matched is automatically updated when the corresponding union member based on which a hook depends, changes. Expand more to see an example usecase. - - ```tsx -type SingleElement = { - isArray: true; - value: string[]; + +```tsx +type SingleElement = { + isArray: true; + value: string[]; }; -type MultiElement = { - isArray: false; - value: string; +type MultiElement = { + isArray: false; + value: string; }; type Props = SingleElement | MultiElement; function Sequence(p: Props) { @@ -648,23 +648,25 @@ function Sequence(p: Props) { () => (
    value(s): - {p.isArray && p.value.join(',')} + {p.isArray && p.value.join(",")} {!p.isArray && p.value}
    ), - [p.isArray, p.value], // TypeScript automatically matches the corresponding value type based on dependency change + [p.isArray, p.value] // TypeScript automatically matches the corresponding value type based on dependency change ); -}; +} function App() { return (
    - - + +
    ); } - ``` - In the above example, based on the `isArray` union member, the type of the `value` hook dependency changes. +``` + +In the above example, based on the `isArray` union member, the type of the `value` hook dependency changes. + To streamline this you may also combine this with the concept of **User-Defined Type Guards**: From 411425bb37bccf5281e4c79cca533145876e37c8 Mon Sep 17 00:00:00 2001 From: swyx Date: Fri, 2 Oct 2020 17:41:24 +0800 Subject: [PATCH 096/456] format --- CONTRIBUTORS.md | 1 + docs/basic/troubleshooting/non-ts-files.md | 2 +- 2 files changed, 2 insertions(+), 1 deletion(-) diff --git a/CONTRIBUTORS.md b/CONTRIBUTORS.md index 32ea3f31..41ae4e09 100644 --- a/CONTRIBUTORS.md +++ b/CONTRIBUTORS.md @@ -25,6 +25,7 @@ + Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)): diff --git a/docs/basic/troubleshooting/non-ts-files.md b/docs/basic/troubleshooting/non-ts-files.md index 932b49fd..e5191edf 100644 --- a/docs/basic/troubleshooting/non-ts-files.md +++ b/docs/basic/troubleshooting/non-ts-files.md @@ -11,7 +11,7 @@ If, say, you are using a third party JS script that attaches on to the `window` ```ts declare global { interface Window { - MyVendorThing: MyVendorType + MyVendorThing: MyVendorType; } } ``` From dfd4559f60246a7abc6d6e0501d881ac503b0d10 Mon Sep 17 00:00:00 2001 From: Arvind Srinivasan Date: Fri, 2 Oct 2020 16:22:10 +0530 Subject: [PATCH 097/456] Added a TS Playground Link --- docs/advanced/patterns_by_usecase.md | 3 +++ 1 file changed, 3 insertions(+) diff --git a/docs/advanced/patterns_by_usecase.md b/docs/advanced/patterns_by_usecase.md index a1d344c2..3b38b17f 100644 --- a/docs/advanced/patterns_by_usecase.md +++ b/docs/advanced/patterns_by_usecase.md @@ -631,6 +631,7 @@ The above example does not work as we are not checking the value of `event.value
    Discriminated Unions in TypeScript can also work with hook dependencies in React. The type matched is automatically updated when the corresponding union member based on which a hook depends, changes. Expand more to see an example usecase. +

    ```tsx @@ -664,6 +665,8 @@ function App() { ); } ``` +See this in TS Playground + In the above example, based on the `isArray` union member, the type of the `value` hook dependency changes. From ef129ba9b786ac7e503910bb5418eb7468727668 Mon Sep 17 00:00:00 2001 From: swyx Date: Fri, 2 Oct 2020 22:47:05 +0800 Subject: [PATCH 098/456] Updated README on 2020-10-02T14:47:04.947Z --- README.md | 808 ++++++++++++++++++++++++++++++++---------------------- 1 file changed, 484 insertions(+), 324 deletions(-) diff --git a/README.md b/README.md index 82241b57..89b7d596 100644 --- a/README.md +++ b/README.md @@ -93,7 +93,11 @@ - [Using Inferred Types](#using-inferred-types) - [Using Partial Types](#using-partial-types) - [The Types I need weren't exported!](#the-types-i-need-werent-exported) -- [The Types I need Don't Exist!](#the-types-i-need-dont-exist) + - [The Types I need don't exist!](#the-types-i-need-dont-exist) + * [Slapping `any` on everything](#slapping-any-on-everything) + * [Autogenerate types](#autogenerate-types) + * [Typing Exported Hooks](#typing-exported-hooks) + * [Typing Exported Components](#typing-exported-components) - [Troubleshooting Handbook: Operators](#troubleshooting-handbook-operators) - [Troubleshooting Handbook: Utilties](#troubleshooting-handbook-utilities) - [Troubleshooting Handbook: tsconfig.json](#troubleshooting-handbook-tsconfigjson) @@ -109,7 +113,6 @@
    - # Section 1: Setup ## Prerequisites @@ -161,7 +164,6 @@ You should also check [the new TypeScript docs for official descriptions between # Section 2: Getting Started - ## Function Components These can be written as normal functions that take a `props` argument and return a JSX element. @@ -173,7 +175,7 @@ const App = ({ message }: AppProps) =>
    {message}
    ;
    -What about `React.FC`/`React.FunctionComponent`? +What about `React.FC`/`React.FunctionComponent`/`React.VoidFunctionComponent`? You can also write components with `React.FunctionComponent` (or the shorthand `React.FC` - they are the same): @@ -200,6 +202,44 @@ const Title: React.FunctionComponent<{ title: string }> = ({ }) =>
    {children}
    ; ``` +
    + + +As of [@types/react PR #46643](https://github.com/DefinitelyTyped/DefinitelyTyped/pull/46643) (TODO: update with @types/react version when merged), you can use a new `React.VoidFunctionComponent` or `React.VFC` type if you wish to declare the accepted `children` explicitly. This is an interim solution until FunctionComponent will accept no children by default (planned for React 18). + + + +```ts +type Props = { foo: string }; + +// OK now, in future, error +const FunctionComponent: React.FunctionComponent = ({ + foo, + children, +}: Props) => { + return ( +
    + {foo} {children} +
    + ); // OK +}; + +// Error now, in future, deprecated +const VoidFunctionComponent: React.VoidFunctionComponent = ({ + foo, + children, +}) => { + return ( +
    + {foo} + {children} +
    + ); +}; +``` + +
    + - _In the future_, it may automatically mark props as `readonly`, though that's a moot point if the props object is destructured in the parameter list. In most cases it makes very little difference which syntax is used, but you may prefer the more explicit nature of `React.FunctionComponent`. @@ -241,12 +281,11 @@ const MyArrayComponent = () => (Array(5).fill(
    ) as any) as JSX.Element; - ## Hooks Hooks are [supported in `@types/react` from v16.8 up](https://github.com/DefinitelyTyped/DefinitelyTyped/blob/a05cc538a42243c632f054e42eab483ebf1560ab/types/react/index.d.ts#L800-L1031). -**useState** +## useState Type inference works very well most of the time: @@ -254,48 +293,74 @@ Type inference works very well most of the time: const [val, toggle] = React.useState(false); // `val` is inferred to be a boolean, `toggle` only takes booleans ``` -See also the [Using Inferred Types](#using-inferred-types) section if you need to use a complex type that you've relied on inference for. +See also the [Using Inferred Types](https://react-typescript-cheatsheet.netlify.app/docs/basic/troubleshooting/types/#using-inferred-types) section if you need to use a complex type that you've relied on inference for. However, many hooks are initialized with null-ish default values, and you may wonder how to provide types. Explicitly declare the type, and use a union type: ```tsx -const [user, setUser] = React.useState(); +const [user, setUser] = React.useState(null); // later... setUser(newUser); ``` -**useRef** +## useReducer -When using `useRef`, you have two options when creating a ref container that does not have an initial value: +You can use [Discriminated Unions](https://www.typescriptlang.org/docs/handbook/advanced-types.html#discriminated-unions) for reducer actions. Don't forget to define the return type of reducer, otherwise TypeScript will infer it. -```ts -const ref1 = useRef(null!); -const ref2 = useRef(null); +```tsx +const initialState = { count: 0 }; + +type ACTIONTYPE = + | { type: "increment"; payload: number } + | { type: "decrement"; payload: string }; + +function reducer(state: typeof initialState, action: ACTIONTYPE) { + switch (action.type) { + case "increment": + return { count: state.count + action.payload }; + case "decrement": + return { count: state.count - Number(action.payload) }; + default: + throw new Error(); + } +} + +function Counter() { + const [state, dispatch] = React.useReducer(reducer, initialState); + return ( + <> + Count: {state.count} + + + + ); +} ``` -The first option will make `ref1.current` read-only, and is intended to be passed in to built-in `ref` attributes that React will manage (because React handles setting the `current` value for you). +[View in the TypeScript Playground](https://www.typescriptlang.org/play?#code/LAKFEsFsAcHsCcAuACAVMghgZ2QJQKYYDGKAZvLJMgOTyEnUDcooRsAdliuO+IuBgA2AZUQZE+ZAF5kAbzYBXdogBcyAAwBfZmBCIAntEkBBAMIAVAJIB5AHLmAmgAUAotOShkyAD5zkBozVqHiI6SHxlagAaZGgMfUFYDAATNXYFSAAjfHhNDxAvX1l-Q3wg5PxQ-HDImLiEpNTkLngeAHM8ll1SJRJwDmQ6ZIUiHIAKLnEykqNYUmQePgERMQkY4n4ONTMrO0dXAEo5T2aAdz4iAAtkMY3+9gA6APwj2ROvImxJYPYqmsRqCp3l5BvhEAp4Ow5IplGpJhIHjCUABqTB9DgPeqJFLaYGfLDfCp-CIAoEFEFeOjgyHQ2BKVTNVb4RF05TIAC0yFsGWy8Fu6MeWMaB1x5K8FVIGAUglUwK8iEuFFOyHY+GVLngFD5Bx0Xk0oH13V6myhplZEm1x3JbE4KAA2vD8DFkuAsHFEFcALruAgbB4KAkEYajPlDEY5GKLfhCURTHUnKkQqFjYEAHgAfHLkGb6WpZI6WfTDRSvKnMgpEIgBhxTIJwEQANZSWRjI5SdPIF1u8RXMayZ7lSphEnRWLxbFNagAVmomhF6fZqYA9OXKxxM2KQWWK1WoTW643m63pB2u+7e-3SkEQsPamOGik1FO55p08jl6vdxuKcvv8h4yAmhAA)
    - What is the ! at the end of null!? -`null!` is a non-null assertion operator (the `!`). It asserts that any expression before it is not `null` or `undefined`, so if you have `useRef(null!)` it means that you're instantiating the ref with a current value of `null` but lying to TypeScript that it's not `null`. +Usage with `Reducer` from `redux` -```ts -function MyComponent() { - const ref1 = useRef(null!); - useEffect(() => { - doSomethingWith(ref1.current); // TypeScript won't require null-check e.g. ref1 && ref1.current - }); - return
    etc
    ; -} +In case you use the [redux](https://github.com/reduxjs/redux) library to write reducer function, It provides a convenient helper of the format `Reducer` which takes care of the return type for you. + +So the above reducer example becomes: + +```tsx +import { Reducer } from 'redux'; + +export function reducer: Reducer() {} ```
    -The second option will make `ref2.current` mutable, and is intended for "instance variables" that you manage yourself. - -**useEffect** +## useEffect When using `useEffect`, take care not to return anything other than a function or `undefined`, otherwise both TypeScript and React will yell at you. This can be subtle when using arrow functions: @@ -314,7 +379,35 @@ function DelayedEffect(props: { timerMs: number }) { } ``` -**useRef** +## useRef + +When using `useRef`, you have two options when creating a ref container that does not have an initial value: + +```ts +const ref1 = useRef(null!); +const ref2 = useRef(null); +``` + +The first option will make `ref1.current` read-only, and is intended to be passed in to built-in `ref` attributes that React will manage (because React handles setting the `current` value for you). + +
    + What is the ! at the end of null!? + +`null!` is a non-null assertion operator (the `!`). It asserts that any expression before it is not `null` or `undefined`, so if you have `useRef(null!)` it means that you're instantiating the ref with a current value of `null` but lying to TypeScript that it's not `null`. + +```ts +function MyComponent() { + const ref1 = useRef(null!); + useEffect(() => { + doSomethingWith(ref1.current); // TypeScript won't require null-check e.g. ref1 && ref1.current + }); + return
    etc
    ; +} +``` + +
    + +The second option will make `ref2.current` mutable, and is intended for "instance variables" that you manage yourself. ```tsx function TextInputWithFocusButton() { @@ -342,64 +435,25 @@ function TextInputWithFocusButton() { example from [Stefan Baumgartner](https://fettblog.eu/typescript-react/hooks/#useref) -**useReducer** +## useImperativeHandle -You can use [Discriminated Unions](https://www.typescriptlang.org/docs/handbook/advanced-types.html#discriminated-unions) for reducer actions. Don't forget to define the return type of reducer, otherwise TypeScript will infer it. +_we dont have much here, but this is from [a discussion in our issues](https://github.com/typescript-cheatsheets/react/issues/106)_ ```tsx -type AppState = {}; -type Action = - | { type: "SET_ONE"; payload: string } // typescript union types allow for leading |'s to have nicer layout - | { type: "SET_TWO"; payload: number }; - -export function reducer(state: AppState, action: Action): AppState { - switch (action.type) { - case "SET_ONE": - return { - ...state, - one: action.payload, // `payload` is string - }; - case "SET_TWO": - return { - ...state, - two: action.payload, // `payload` is number - }; - default: - return state; - } -} -``` - -Setting the type for `dispatch` function: - -```jsx -import { Dispatch } from "react"; -import { Action } from "./reducer"; - -const handleClick = (dispatch: Dispatch) => { - dispatch({ type: "SET_ONE", payload: "some string" }); +type ListProps = { + items: ItemType[]; + innerRef?: React.Ref<{ scrollToItem(item: ItemType): void }>; }; -``` - -[View in the TypeScript Playground](https://www.typescriptlang.org/play/?jsx=2#code/C4TwDgpgBAgmYGVgENjQLxQN4F8CwAUKJLAMbACWA9gHZTqFRQA+2UxEAXFAEQICiAFQD6AeQBy-HgG4oYZCAA2VZABNuAZ2AAnCjQDmUfASass7cF14CRggOqiZchcrXcaAVwC2AIwjajaUJCCAAPMCptYCgAMw8acmo6bQhVD1J-AAotVCs4RBQ0ABooZETabhhymgBKSvgkXOxGKA0AdwpgUgALKEyyyloAOg4a5pMmKFJkDWg+ITFJHk4WyagU4A9tOixVtaghw5zivbXaKwGkofklFVUoAHoHqAADG9dVF6gKDVadPX0p0Ce2ms2sC3sjhWEzWGy2OyBTEOQ2OECKiPYbSo3Euw3ed0ezzeLjuXx+UE8vn8QJwQRhUFUEBiyA8imA0P26wgm22f1ydKYxhwQA) - -
    - -Usage with `Reducer` from `redux` - -In case you use the [redux](https://github.com/reduxjs/redux) library to write reducer function, It provides a convenient helper of the format `Reducer` which takes care of the return type for you. - -So the above reducer example becomes: -```tsx -import { Reducer } from 'redux'; - -export function reducer: Reducer() {} +function List(props: ListProps) { + useImperativeHandle(props.innerRef, () => ({ + scrollToItem() {}, + })); + return null; +} ``` -
    - -**Custom Hooks** +## Custom Hooks If you are returning an array in your Custom Hook, you will want to avoid type inference as TypeScript will infer a union type (when you actually want different types in each position of the array). Instead, use [TS 3.4 const assertions](https://devblogs.microsoft.com/typescript/announcing-typescript-3-4/#const-assertions): @@ -479,7 +533,6 @@ Example React Hooks + TypeScript Libraries: - ## Class Components Within TypeScript, `React.Component` is a generic type (aka `React.Component`), so you want to provide it with (optional) prop and state type parameters: @@ -590,26 +643,57 @@ class App extends React.Component<{ +## You May Not Need `defaultProps` + +As per [this tweet](https://twitter.com/dan_abramov/status/1133878326358171650), defaultProps will eventually be deprecated. You can check the discussions here: + +- https://twitter.com/hswolff/status/1133759319571345408 + +The consensus is to use object default values. + +Function Components: + +```tsx +type GreetProps = { age?: number }; + +const Greet = ({ age = 21 }: GreetProps) => // etc +``` + +Class Components: + +```tsx +type GreetProps = { + age?: number; +}; + +class Greet extends React.Component { + const { age = 21 } = this.props + /*...*/ +} + +let el = ; +``` -## Typing defaultProps +## Typing `defaultProps` -For TypeScript 3.0+, type inference [should work](https://www.typescriptlang.org/docs/handbook/release-notes/typescript-3-0.html), although [some edge cases are still problematic](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/issues/61). Just type your props like normal, except don't use `React.FC`. +Type inference improved greatly for `defaultProps` in [TypeScript 3.0+](https://www.typescriptlang.org/docs/handbook/release-notes/typescript-3-0.html), although [some edge cases are still problematic](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/issues/61). + +**Function Components** ```tsx -// //////////////// -// function components -// //////////////// type GreetProps = { age: number } & typeof defaultProps; const defaultProps = { age: 21, }; const Greet = (props: GreetProps) => { - /*...*/ + // etc }; Greet.defaultProps = defaultProps; ``` +_[See this in TS Playground](https://www.typescriptlang.org/play?#code/JYWwDg9gTgLgBAKjgQwM5wEoFNkGN4BmUEIcARFDvmQNwBQdMAnmFnAOKVYwAKxY6ALxwA3igDmWAFxwAdgFcQAIyxQ4AXzgAyOM1YQCcACZYCyeQBte-VPVwRZqeCbOXrEAXGEi6cCdLgAJgBGABo6dXo6e0d4TixuLzgACjAbGXjuPg9UAEovAD5RXzhKGHkoWTgAHiNgADcCkTScgDpkSTgAeiQFZVVELvVqrrrGiPpMmFaXcytsz2FZtwXbOiA)_ + For **Class components**, there are [a couple ways to do it](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/pull/103#issuecomment-481061483)(including using the `Pick` utility type) but the recommendation is to "reverse" the props definition: ```tsx @@ -629,42 +713,88 @@ let el = ; ```
    - An alternative approach + + + `JSX.LibraryManagedAttributes` nuance for library authors + + -As per [this tweet](https://twitter.com/dan_abramov/status/1133878326358171650), defaultProps will eventually be deprecated. You can check the discussions here: +The above implementations work fine for App creators, but sometimes you want to be able to export `GreetProps` so that others can consume it. The problem here is that the way `GreetProps` is defined, `age` is a required prop when it isn't because of `defaultProps`. -- https://twitter.com/hswolff/status/1133759319571345408 +The insight to have here is that [`GreetProps` is the _internal_ contract for your component, not the _external_, consumer facing contract](https://github.com/typescript-cheatsheets/react/issues/66#issuecomment-453878710). You could create a separate type specifically for export, or you could make use of the `JSX.LibraryManagedAttributes` utility: -The consensus is to use object default values. +```tsx +// internal contract, should not be exported out +type GreetProps = { + age?: number; +}; + +class Greet extends Component { + static defaultProps = { age: 21 }; +} + +// external contract +export type ApparentGreetProps = JSX.LibraryManagedAttributes< + typeof Greet, + GreetProps +>; +``` + +`` +This will work properly, although hovering over `ApparentGreetProps` may be a little intimidating. You can reduce this boilerplate with the `ComponentProps` utility detailed below. + +
    + +## Consuming Props of a Component with defaultProps + +A component with `defaultProps` may seem to have some required props that actually aren't. + +### Problem Statement + +Here's what you want to do: ```tsx -// //////////////// -// function components -// //////////////// -type GreetProps = { age: number }; +interface IProps { + name: string; +} +const defaultProps = { + age: 25, +}; +const GreetComponent = ({ name, age }: IProps & typeof defaultProps) => ( +
    {`Hello, my name is ${name}, ${age}`}
    +); +GreetComponent.defaultProps = defaultProps; -const Greet = ({ age = 21 }: GreetProps) => { - /*...*/ +const TestComponent = (props: React.ComponentProps) => { + return

    ; }; + +// Property 'age' is missing in type '{ name: string; }' but required in type '{ age: number; }' +const el = ; ``` +### Solution + +Define a utility that applies `JSX.LibraryManagedAttributes`: + ```tsx -// //////////////// -// class components -// //////////////// -type GreetProps = { - age: number; +type ComponentProps = T extends + | React.ComponentType + | React.Component + ? JSX.LibraryManagedAttributes + : never; + +const TestComponent = (props: ComponentProps) => { + return

    ; }; -class Greet extends React.Component { - const { age = 21 } = this.props - /*...*/ -} - -let el = ; +// No error +const el = ; ``` -

    +[_See this in TS Playground_](https://www.typescriptlang.org/play?#code/JYWwDg9gTgLgBAKjgQwM5wEoFNkGN4BmUEIcARFDvmQNwBQdMAnmFnAMImQB2W3MABWJhUAHgAqAPjgBeOOLhYAHjD4ATdNjwwAdJ3ARe-cSyyjg3AlihwB0gD6Yqu-Tz4xzl67cl04cAH44ACkAZQANHQAZYAAjKGQoJgBZZG5kAHMsNQBBGBgoOIBXVTFxABofPzgALjheADdrejoLVSgCPDYASSEIETgAb2r0kCw61AKLDPoAXzpcQ0m4NSxOooAbQWF0OWH-TPG4ACYAVnK6WfpF7mWAcUosGFdDd1k4AApB+uQxysO4LM6r0dnAAGRwZisCAEFZrZCbbb9VAASlk0g+1VEamADUkgwABgAJLAbDYQSogJg-MZwYDoAAkg1GWFmlSZh1mBNmogA9Di8XQUfQHlgni8jLpVustn0BnJpQjZTsWrzeXANsh2gwbstxFhJhK3nIPmAdnUjfw5WIoVgYXBReKuK9+JI0TJpPs4JQYEUoNw4KIABYARjgvN8VwYargADkIIooMQoAslvBSe8JAbns7JTSsDIyAQIBAyOHJDQgA) + +## Misc Discussions and Knowledge
    Why does React.FC break defaultProps? @@ -713,7 +843,7 @@ export class MyComponent extends React.Component { The problem with this approach is it causes complex issues with the type inference working with `JSX.LibraryManagedAttributes`. Basically it causes the compiler to think that when creating a JSX expression with that component, that all of its props are optional. -[See commentary by @ferdaber here](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/issues/57). +[See commentary by @ferdaber here](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/issues/57) and [here](https://github.com/typescript-cheatsheets/react/issues/61).
    @@ -722,7 +852,6 @@ The problem with this approach is it causes complex issues with the type inferen - ## Types or Interfaces? `interface`s are different from `type`s in TypeScript, but they can be used for very similar things as far as common React uses cases are concerned. Here's a helpful rule of thumb: @@ -739,9 +868,27 @@ Types are useful for union types (e.g. `type MyType = TypeA | TypeB`) whereas In Useful table for Types vs Interfaces -It's a nuanced topic, don't get too hung up on it. Here's a handy graphic: - -![https://pbs.twimg.com/media/DwV-oOsXcAIct2q.jpg](https://pbs.twimg.com/media/DwV-oOsXcAIct2q.jpg) (source: [Karol Majewski](https://twitter.com/karoljmajewski/status/1082413696075382785)) +It's a nuanced topic, don't get too hung up on it. Here's a handy table: + +| Aspect | Type | Interface | +| ------ | :----: | :---------: | +| Can describe functions | ✅ | ✅ | +| Can describe constructors | ✅ | ✅ | +| Can describe tuples | ✅ | ✅ | +| Interfaces can extend it | ⚠️ | ✅ | +| Classes can extend it | 🚫 | ✅ | +| Classes can implement it (`implements`) | ⚠️ | ✅ | +| Can intersect another one of its kind | ✅ | ⚠️ | +| Can create a union with another one of its kind | ✅ | 🚫 | +| Can be used to create mapped types | ✅ | 🚫 | +| Can be mapped over with mapped types | ✅ | ✅ | +| Expands in error messages and logs | ✅ | 🚫 | +| Can be augmented | 🚫 | ✅ | +| Can be recursive | ⚠️ | ✅ | + +⚠️ In some cases + +(source: [Karol Majewski](https://twitter.com/karoljmajewski/status/1082413696075382785)) @@ -750,7 +897,6 @@ It's a nuanced topic, don't get too hung up on it. Here's a handy graphic: - ## Basic Prop Types Examples ```tsx @@ -762,10 +908,10 @@ type AppProps = { names: string[]; /** string literals to specify exact string values, with a union type to join them together */ status: "waiting" | "success"; - /** any object as long as you dont use its properties (not common) */ + /** any object as long as you dont use its properties (NOT COMMON but useful as placeholder) */ obj: object; obj2: {}; // almost the same as `object`, exactly the same as `Object` - /** an object with defined properties (preferred) */ + /** an object with any number of properties (PREFERRED) */ obj3: { id: string; title: string; @@ -775,6 +921,11 @@ type AppProps = { id: string; title: string; }[]; + /** a dict object with any number of properties of the same type */ + dict1: { + [key: string]: MyTypeHere; + }; + dict2: Record; // equivalent to dict1 /** any function as long as you don't invoke it (not recommended) */ onSomething: Function; /** function that doesn't take or return anything (VERY COMMON) */ @@ -788,12 +939,11 @@ type AppProps = { }; ``` -Notice we have used the TSDoc `/** comment */` style here on each prop. You can and are encouraged to leave descriptive comments on reusable components. For a fuller example and discussion, see our [Commenting Components](/ADVANCED.md#commenting-components) section in the Advanced Cheatsheet. +Notice we have used the TSDoc `/** comment */` style here on each prop. You can and are encouraged to leave descriptive comments on reusable components. For a fuller example and discussion, see our [Commenting Components](https://react-typescript-cheatsheet.netlify.app/docs/advanced/misc_concerns/#commenting-components) section in the Advanced Cheatsheet. - ## Useful React Prop Type Examples ```tsx @@ -827,7 +977,6 @@ Quote [@ferdaber](https://github.com/typescript-cheatsheets/react-typescript-che - ## getDerivedStateFromProps Before you start using `getDerivedStateFromProps`, please go through the [documentation](https://reactjs.org/docs/react-component.html#static-getderivedstatefromprops) and [You Probably Don't Need Derived State](https://reactjs.org/blog/2018/06/07/you-probably-dont-need-derived-state.html). Derived State can be easily achieved using hooks which can also help set up memoization easily. @@ -895,7 +1044,6 @@ class Comp extends React.PureComponent { - ## Forms and Events If performance is not an issue, inlining handlers is easiest as you can just use [type inference and contextual typing](https://www.typescriptlang.org/docs/handbook/type-inference.html#contextual-typing): @@ -1000,9 +1148,52 @@ Of course, if you're making any sort of significant form, [you should use Formik - ## Context +## Basic Example + +```tsx +import * as React from "react"; + +interface AppContextInterface { + name: string; + author: string; + url: string; +} + +const AppCtx = React.createContext(null); + +// Provider in your app + +const sampleAppContext: AppContextInterface = { + name: "Using React Context in a Typescript App", + author: "thehappybug", + url: "http://www.example.com", +}; + +export const App = () => ( + ... +); + +// Consume in your app + +export const PostInfo = () => { + const appContext = React.useContext(AppCtx); + return ( +
    + Name: {appContext.name}, Author: {appContext.author}, Url:{" "} + {appContext.url} +
    + ); +}; +``` + +You can also use the [Class.contextType](https://reactjs.org/docs/context.html#classcontexttype) or [Context.Consumer](https://reactjs.org/docs/context.html#contextconsumer) API, let us know if you have trouble with that. + +_[Thanks to @AlvSovereign](https://github.com/typescript-cheatsheets/react/issues/97)_ + +## Extended Example + Using `React.createContext` with an empty object as default value. ```tsx @@ -1239,7 +1430,6 @@ const Consumer = Context.Consumer; - ## forwardRef/createRef Check the [Hooks section](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/blob/master/README.md#hooks) for `useRef`. @@ -1278,7 +1468,6 @@ You may also wish to do [Conditional Rendering with `forwardRef`](https://github - ## Portals Using `ReactDOM.createPortal`: @@ -1306,6 +1495,74 @@ export class Modal extends React.Component { [View in the TypeScript Playground](https://www.typescriptlang.org/play/?jsx=2#code/JYWwDg9gTgLgBAJQKYEMDG8BmUIjgcilQ3wFgAoUSWRYmAEQHkBZObXAo9GAWgBNcZchTQQAdgGd4ICHxQAbBBAjwAvHAFoAriCRiYAOgDmSGAFF5SXfoBCATwCSfABQAiGXPk8cK1wEo4FAk4AAkAFWYAGQsrPRgAbgoAeiTAiQkdYDEjOCy4OwgtKDgACxgQeTZgS1KgwI1gADc4AHdgGBLcvgIPBW9lGHxE4XIkAA9qeDR5IODmWQU4cZg9PmDkbgMAYVxIMTi4AG8KOCX5AC5QiOjLazUNCG07gzQuFZi7tz4m-2GTuFE4HEcXowD48y0+mcAWO5FOp16igGBhQYDAqy2JWqLg6wAkBiQ8j8w1OAF8KP9AXs4gB1aryACqYhkkJg0KO-wRCyRKgMRBkjSQmOxzlx+MJxP+5JGpyIYj4SCg7Nh8LgRBgRTEtG4TGYLzeSAACtAYApRVj8WAcGB8WgsfI+HKADRwMUEokkuDS0lAA) +
    + Using hooks + +Same as above but using hooks + +```tsx +import React, { useEffect, useRef } from "react"; +import { createPortal } from "react-dom"; + +const modalRoot = document.querySelector("#modal-root") as HTMLElement; + +const Modal: React.FC<{}> = ({ children }) => { + const el = useRef(document.createElement("div")); + + useEffect(() => { + // We assume `modalRoot` exists with '!' + modalRoot!.appendChild(el.current); + return () => void modalRoot!.removeChild(el.current); + }, []); + + return createPortal(children, el.current); +}; + +export default Modal; +``` + +[View in the TypeScript Playground](https://www.typescriptlang.org/play?#code/JYWwDg9gTgLgBAJQKYEMDG8BmUIjgcilQ3wFgAoUSWOAbzjSJRiQAVoYUAbOAXzmy4CTDAFoAJrjLkKAellwUAZyUBXEMAB2Aczha4ATwiqocABYwQPTMC5JzyxXHHAAbnADuwGGb3iCIBDi3KI4EDD4ANwUFGgQmkrwALJB3ABciMQwAHQAYgDCADy0vAB8cAC8cAAU9GhmtuJEmnwAlJXltBRwcPJwAKIgqlzM9j72aCMqDLiQmkiaEUp6CZyaaPauKFDAKABGdp7evihwRJjdM6twSDxVyOg5qkpIyJjVkmjqCzmMqCz9OwgH7VABELlcoNarWiMnIPQeGGyzyQ-UwmCQGGq1XaFU6lx6fQA6vZlGpgXAAAaBYJcBAQcKUm4AD2AiWWXh8BAAhNIej04tcadx6eFKs4IF9gYtsgBHVRIKAGADKt0xMGgYIAxMKuKEGTAoYplgAJAAqSQAMoCkNKYLD+XBdaKYNzsigwGAFuJ8g0uOJqrdsl8oM0YDCCWckDATC0cR04K4IMB-M6DW6iIFXEhfY1A1xgyYwxH4XwADRwADaAF0S5c+gBJVaofwQTBU26UivjK6cLSKvTLHuU86F0M-SmXIgxqAtP6jdiwbjVeqNZoVoMh4uw3iwuQKZ4obRIGLkTCqdYwYDxOAAQU98a6pcFiSrSjMEA8KVpFZeMGVH5fqkXDVuKiJPC8yqcCw1SYNwLwlj006xjUkaFBCpSRoSChGKoDAoC08EQHAYCqPAPhsishjGKYiTMMAaDmJY1i2CepaOuhbh+BUoK6vq4SgqUhSyBhWF0O+n7ftwcAAGQyah7GOnAhRSVwmGKUpykQmJmmJAYdgVLQT6aSZzhsmAIwGBkoLaDs4igmWOkmRZ6BIA2LAgEo1kbIsioOU5mlmEgwDaBY1kAIwAAyRa4Zj+RpplHOIPgZPgUUxWY+COQlpl7OgADWtnGJo4jWVA2h5dUkVltVtXZOFrTxYlSkAF5NuISDMhkACc3XZc1PS8LwAVwOpA1wA2+B4KcurcrQoJwKCw05UphR7GRGotHpBlGXlaCFTgF6lYtYAegYKAeA0YBLfw8T5FwDH5YZ8Z4nAf4AZJwGwfBSCtGUkwQC8wnrTAm1jYlwmiStwmqeDjp-WJa0bTed0Pftz24uU72Aap1QwFACp-aUEkeHAqnA8jmhw-yfREK+bbUSYiiemhIluODrQULwQA) + +
    + +Modal Component Usage Example: + +```tsx +function App() { + const [showModal, setShowModal] = React.useState(false); + return ( +
    + // you can also put this in your static html file + + {showModal && ( + +
    + I'm a modal!{" "} + +
    +     + )} + + // rest of your app +
    + ); +} +``` +
    Context of Example @@ -1317,17 +1574,60 @@ This example is based on the [Event Bubbling Through Portal](https://reactjs.org - ## Error Boundaries -_Not written yet._ +### Option 1: Using react-error-boundary + +[React-error-boundary](https://github.com/bvaughn/react-error-boundary) - is a lightweight package ready to use for this scenario with TS support built-in. +This approach also lets you avoid class components that are not that popular anymore. + +### Options 2: Writing your custom error boundary component + +If you don't want to add a new npm package for this, you can also write your own `ErrorBoundary` component. + +```jsx +import React, { Component, ErrorInfo, ReactNode } from "react"; + +interface Props { + children: ReactNode; +} + +interface State { + hasError: boolean; +} + +class ErrorBoundary extends Component { + public state: State = { + hasError: false + }; + + public static getDerivedStateFromError(_: Error): State { + // Update state so the next render will show the fallback UI. + return { hasError: true }; + } + + public componentDidCatch(error: Error, errorInfo: ErrorInfo) { + console.error("Uncaught error:", error, errorInfo); + } + + public render() { + if (this.state.hasError) { + return

    Sorry.. there was an error

    ; + } + + return this.props.children; + } +} + +export default ErrorBoundary; + +``` [Something to add? File an issue](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/issues/new). - ## Concurrent React/React Suspense _Not written yet._ watch for more on React Suspense and Time Slicing. @@ -1337,14 +1637,13 @@ _Not written yet._ watch for more o - # Troubleshooting Handbook: Types -> ⚠️ Have you read [the TypeScript FAQ](https://github.com/microsoft/TypeScript/wiki/FAQ)?) Your answer might be there! +> ⚠️ Have you read [the TypeScript FAQ](https://github.com/microsoft/TypeScript/wiki/FAQ?) Your answer might be there! Facing weird type errors? You aren't alone. This is the hardest part of using TypeScript with React. Be patient - you are learning a new language after all. However, the more you get good at this, the less time you'll be working _against_ the compiler and the more the compiler will be working _for_ you! -Try to avoid typing with `any` as much as possible to experience the full benefits of typescript. Instead, let's try to be familiar with some of the common strategies to solve these issues. +Try to avoid typing with `any` as much as possible to experience the full benefits of TypeScript. Instead, let's try to be familiar with some of the common strategies to solve these issues. ## Union Types and Type Guarding @@ -1708,8 +2007,12 @@ let baz2: SubIsntType2 = { What's more annoying than modules with unexported types? Modules that are **untyped**! +> Before you proceed - make sure you have checked that types don't exist in [DefinitelyTyped](https://github.com/DefinitelyTyped/DefinitelyTyped) or [TypeSearch](https://microsoft.github.io/TypeSearch/) + Fret not! There are more than a couple of ways in which you can solve this problem. +### Slapping `any` on everything + A **lazier** way would be to create a new type declaration file, say `typedec.d.ts`– if you don't already have one. Ensure that the path to file is resolvable by TypeScript by checking the `include` array in the `tsconfig.json` file at the root of your directory. ```json @@ -1734,162 +2037,18 @@ This one-liner alone is enough if you just need it to work without errors. A eve This solution works well as a workaround if you have less than a couple untyped modules. Anything more, you now have a ticking type-bomb in your hands. The only way of circumventing this problem would be to define the missing types for those untyped modules as explained in the following sections. -### Typing Exported Hooks - -Typing Hooks is just like typing pure functions. - -The following steps work under two assumptions: - -- You have already created a type declaration file as stated earlier in the section. -- You have access to the source code - specifically the code that directly exports the functions you will be using. In most cases, it would be housed in an `index.js` file. - Typically you need a minimum of **two** type declarations (one for **Input Prop** and the other for **Return Prop**) to define a hook completely. Suppose the hook you wish to type follows the following structure, - -```js -// ... -const useUntypedHook = (prop) => { - // some processing happens here - return { - /* ReturnProps */ - }; -}; -export default useUntypedHook; -``` - -then, your type declaration should most likely follow the following syntax. - -```ts -declare module 'use-untyped-hook' { - export interface InputProps { ... } // type declaration for prop - export interface ReturnProps { ... } // type declaration for return props - export default function useUntypedHook( - prop: InputProps - // ... - ): ReturnProps; -} -``` - -
    - - -For instance, the [useDarkMode hook](https://github.com/donavon/use-dark-mode) exports the functions that follows a similar structure. - - - -```js -// inside src/index.js -const useDarkMode = ( - initialValue = false, // -> input props / config props to be exported - { - // -> input props / config props to be exported - element, - classNameDark, - classNameLight, - onChange, - storageKey = "darkMode", - storageProvider, - global, - } = {} -) => { - // ... - return { - // -> return props to be exported - value: state, - enable: useCallback(() => setState(true), [setState]), - disable: useCallback(() => setState(false), [setState]), - toggle: useCallback(() => setState((current) => !current), [setState]), - }; -}; -export default useDarkMode; -``` - -As the comments suggest, exporting these config props and return props following the aforementioned structure will result in the following type export. - -```ts -declare module "use-dark-mode" { - /** - * A config object allowing you to specify certain aspects of `useDarkMode` - */ - export interface DarkModeConfig { - classNameDark?: string; // A className to set "dark mode". Default = "dark-mode". - classNameLight?: string; // A className to set "light mode". Default = "light-mode". - element?: HTMLElement; // The element to apply the className. Default = `document.body` - onChange?: (val?: boolean) => void; // Overide the default className handler with a custom callback. - storageKey?: string; // Specify the `localStorage` key. Default = "darkMode". Set to `null` to disable persistent storage. - storageProvider?: WindowLocalStorage; // A storage provider. Default = `localStorage`. - global?: Window; // The global object. Default = `window`. - } - /** - * An object returned from a call to `useDarkMode`. - */ - export interface DarkMode { - readonly value: boolean; - enable: () => void; - disable: () => void; - toggle: () => void; - } - /** - * A custom React Hook to help you implement a "dark mode" component for your application. - */ - export default function useDarkMode( - initialState?: boolean, - config?: DarkModeConfig - ): DarkMode; -} -``` - -
    - -### Typing Exported Components +### Autogenerate types -In case of typing untyped class components, there's almost no difference in approach except for the fact that after declaring the types, you export the extend the type using `class UntypedClassComponent extends React.Component {}` where `UntypedClassComponentProps` holds the type declaration. +You can use TypeScript with `--allowJs` and `--declaration` to see TypeScript's "best guess" at the types of the library. -For instance, [sw-yx's Gist on React Router 6 types](https://gist.github.com/sw-yx/37a6a3d248c2d4031801f0d568904df8) implemented a similar method for typing the then untyped RR6. +If this doesn't work well enough, use [`dts-gen`](https://github.com/Microsoft/dts-gen) to use the runtime shape of the object to accurately enumerate all available properties. This tends to be very accurate, BUT the tool does not yet support scraping JSDoc comments to populate additional types. -```ts -declare module "react-router-dom" { - import * as React from 'react'; - // ... - type NavigateProps = { - to: string | number, - replace?: boolean, - state?: T - } - //... - export class Navigate extends React.Component>{} - // ... +```bash +npm install -g dts-gen +dts-gen -m ``` -For more information on creating type definitions for class components, you can refer to this [post](https://templecoding.com/blog/2016/03/31/creating-typescript-typings-for-existing-react-components) for reference. - -# Troubleshooting Handbook: Images and other non-TS/TSX files - -What's more annoying than modules with unexported types? Modules that are **untyped**! - -Fret not! There are more than a couple of ways in which you can solve this problem. - -A **lazier** way would be to create a new type declaration file, say `typedec.d.ts`– if you don't already have one. Ensure that the path to file is resolvable by TypeScript by checking the `include` array in the `tsconfig.json` file at the root of your directory. - -```json -// inside tsconfig.json -{ - // ... - "include": [ - "src" // automatically resolves if the path to declaration is src/typedec.d.ts - ] - // ... -} -``` - -Within this file, add the `declare` syntax for your desired module, say `my-untyped-module`– to the declaration file: - -```ts -// inside typedec.d.ts -declare module "my-untyped-module"; -``` - -This one-liner alone is enough if you just need it to work without errors. A even hackier, write-once-and-forget way would be to use `"*"` instead which would then apply the `Any` type for all existing and future untyped modules. - -This solution works well as a workaround if you have less than a couple untyped modules. Anything more, you now have a ticking type-bomb in your hands. The only way of circumventing this problem would be to define the missing types for those untyped modules as explained in the following sections. +There are other automated JS to TS conversion tools and migration strategies - see [our MIGRATION cheatsheet](https://react-typescript-cheatsheet.netlify.app/docs/migration/from_js). ### Typing Exported Hooks @@ -2018,14 +2177,9 @@ declare module "react-router-dom" { For more information on creating type definitions for class components, you can refer to this [post](https://templecoding.com/blog/2016/03/31/creating-typescript-typings-for-existing-react-components) for reference. -# Troubleshooting Handbook: Images and other non-TS/TSX files - -Use [declaration merging](https://www.typescriptlang.org/docs/handbook/declaration-merging.html): - - # Troubleshooting Handbook: Operators - `typeof` and `instanceof`: type query used for refinement @@ -2048,7 +2202,6 @@ Conditional Types are a difficult topic to get around so here are some extra res - # Troubleshooting Handbook: Utilities these are all built in, [see source in es5.d.ts](https://github.com/microsoft/TypeScript/blob/2c458c0d1ccb96442bca9ce43aa987fb0becf8a9/src/lib/es5.d.ts#L1401-L1474): @@ -2072,10 +2225,9 @@ This section needs writing, but you can probably find a good starting point with - # Troubleshooting Handbook: tsconfig.json -You can find [all the Compiler options in the TypeScript docs](https://www.typescriptlang.org/docs/handbook/compiler-options.html). [The new TS docs also has per-flag annotations of what each does](https://www.typescriptlang.org/tsconfig). This is the setup I roll with for APPS (not libraries - for libraries you may wish to see the settings we use in `tsdx`): +You can find [all the Compiler options in the TypeScript docs](https://www.typescriptlang.org/docs/handbook/compiler-options.html). [The new TS docs also has per-flag annotations of what each does](https://www.typescriptlang.org/v2/en/tsconfig#allowSyntheticDefaultImports). This is the setup I roll with for APPS (not libraries - for libraries you may wish to see the settings we use in `tsdx`): ```json { @@ -2109,6 +2261,8 @@ You can find [all the Compiler options in the TypeScript docs](https://www.types } ``` +You can find more [recommended TS config here](https://github.com/tsconfig/bases). + Please open an issue and discuss if there are better recommended choices for React. Selected flags and why we like them: @@ -2117,13 +2271,12 @@ Selected flags and why we like them: - `strict`: `strictPropertyInitialization` forces you to initialize class properties or explicitly declare that they can be undefined. You can opt out of this with a definite assignment assertion. - `"typeRoots": ["./typings", "./node_modules/@types"]`: By default, TypeScript looks in `node_modules/@types` and parent folders for third party type declarations. You may wish to override this default resolution so you can put all your global type declarations in a special `typings` folder. -Compilation speed grows linearly with size of codebase. For large projects, you will want to use [Project References](https://www.typescriptlang.org/docs/handbook/project-references.html). See our [ADVANCED](https://react-typescript-cheatsheet.netlify.app/docs/advanced/intro) cheatsheet for commentary. +Compilation speed grows linearly with size of codebase. For large projects, you will want to use [Project References](https://www.typescriptlang.org/docs/handbook/project-references.html). See our [ADVANCED](https://react-typescript-cheatsheet.netlify.app/docs/advanced/) cheatsheet for commentary. - -# Troubleshooting Handbook: Bugs in official typings +# Troubleshooting Handbook: Fixing bugs in official typings If you run into bugs with your library's official typings, you can copy them locally and tell TypeScript to use your local version using the "paths" field. In your `tsconfig.json`: @@ -2189,10 +2342,21 @@ You can see examples of these included in the built in type declarations in the +# Troubleshooting Handbook: Globals, Images and other non-TS files -# Troubleshooting Handbook: Images and other non-TS/TSX files +Use [declaration merging](https://www.typescriptlang.org/docs/handbook/declaration-merging.html). -Use [declaration merging](https://www.typescriptlang.org/docs/handbook/declaration-merging.html): +If, say, you are using a third party JS script that attaches on to the `window` global, you can extend `Window`: + +```ts +declare global { + interface Window { + MyVendorThing: MyVendorType; + } +} +``` + +Likewise if you wish to "import" an image or other non TS/TSX file: ```ts // declaration.d.ts @@ -2210,37 +2374,27 @@ Related issue: https://github.com/Microsoft/TypeScript-React-Starter/issues/12 a +# Other React + TypeScript resources -# Recommended React + TypeScript codebases to learn from - -- https://github.com/jaredpalmer/formik -- https://github.com/jaredpalmer/react-fns -- https://github.com/palantir/blueprint -- https://github.com/Shopify/polaris -- https://github.com/NullVoxPopuli/react-vs-ember/tree/master/testing/react -- https://github.com/artsy/reaction -- https://github.com/benawad/codeponder (with [coding livestream!](https://www.youtube.com/watch?v=D8IJOwdNSkc&list=PLN3n1USn4xlnI6kwzI8WrNgSdG4Z6daCq)) -- https://github.com/artsy/emission (React Native) -- [@reach/ui's community typings](https://github.com/reach/reach-ui/pull/105) - -React Boilerplates: - -- https://github.com/rwieruch/nextjs-firebase-authentication: Next.js + Firebase Starter: styled, tested, typed, and authenticated -- [@jpavon/react-scripts-ts](https://github.com/jpavon/react-scripts-ts) alternative react-scripts with all TypeScript features using [ts-loader](https://github.com/TypeStrong/ts-loader) -- [webpack config tool](https://webpack.jakoblind.no/) is a visual tool for creating webpack projects with React and TypeScript -- ready to go template with [Material-UI](https://material-ui.com/), routing and Redux - -React Native Boilerplates: _contributed by [@spoeck](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/pull/20)_ - -- https://github.com/GeekyAnts/react-native-seed -- https://github.com/lopezjurip/ReactNativeTS -- https://github.com/emin93/react-native-template-typescript -- +- me! +- https://www.freecodecamp.org/news/how-to-build-a-todo-app-with-react-typescript-nodejs-and-mongodb/ +- - **HIGHLY HIGHLY RECOMMENDED**, i wrote this repo before knowing about this one, this has a lot of stuff I don't cover, including **REDUX** and **JEST**. +- [Ultimate React Component Patterns with TypeScript 2.8](https://levelup.gitconnected.com/ultimate-react-component-patterns-with-typescript-2-8-82990c516935) +- [Basarat's TypeScript gitbook has a React section](https://basarat.gitbook.io/typescript/tsx/react) with an [Egghead.io course](https://egghead.io/courses/use-typescript-to-develop-react-applications) as well. +- [Palmer Group's TypeScript + React Guidelines](https://github.com/palmerhq/typescript) as well as Jared's other work like [disco.chat](https://github.com/jaredpalmer/disco.chat) +- [Sindre Sorhus' TypeScript Style Guide](https://github.com/sindresorhus/typescript-definition-style-guide) +- [TypeScript React Starter Template by Microsoft](https://github.com/Microsoft/TypeScript-React-Starter) A starter template for TypeScript and React with a detailed README describing how to use the two together. Note: this doesnt seem to be frequently updated anymore. +- [Brian Holt's Intermediate React course on Frontend Masters (paid)](https://frontendmasters.com/courses/intermediate-react/converting-the-app-to-typescript/) - Converting App To TypeScript Section +- [TSX Guide](https://jenil.github.io/chota/) by [gojutin](https://github.com/gojutin/www.tsx.guide) +- TypeScript conversion: + - [Lyft's React-To-TypeScript conversion CLI](https://github.com/lyft/react-javascript-to-typescript-transform) + - [Gustav Wengel's blogpost - converting a React codebase to TypeScript](http://www.gustavwengel.dk/converting-typescript-to-javascript-part-1) + - [Microsoft React TypeScript conversion guide](https://github.com/Microsoft/TypeScript-React-Conversion-Guide#typescript-react-conversion-guide) +- [You?](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/issues/new). - # Editor Tooling and Integration - VSCode @@ -2254,10 +2408,17 @@ React Native Boilerplates: _contributed by [@spoeck](https://github.com/typescri - NeoVim: https://github.com/neoclide/coc.nvim - other discussion: https://mobile.twitter.com/ryanflorence/status/1085715595994095620 +You are free to use this repo's TSX logo if you wish: + +[![https://user-images.githubusercontent.com/6764957/53868378-2b51fc80-3fb3-11e9-9cee-0277efe8a927.png](https://user-images.githubusercontent.com/6764957/53868378-2b51fc80-3fb3-11e9-9cee-0277efe8a927.png)](https://user-images.githubusercontent.com/6764957/53868378-2b51fc80-3fb3-11e9-9cee-0277efe8a927.png) + +You may also wish to use alternative logos - [jsx-tsx-logos](https://github.com/Protectator/jsx-tsx-logos) + +![https://github.com/Protectator/jsx-tsx-logos/raw/master/example.png](https://github.com/Protectator/jsx-tsx-logos/raw/master/example.png) + - # Linting > ⚠️Note that [TSLint is now in maintenance and you should try to use ESLint instead](https://medium.com/palantir/tslint-in-2019-1a144c2317a9). If you are interested in TSLint tips, please check this PR from [@azdanov](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/pull/14). The rest of this section just focuses on ESLint. [You can convert TSlint to ESlint with this tool](https://github.com/typescript-eslint/tslint-to-eslint-config). @@ -2386,15 +2547,14 @@ If you're looking for information on Prettier, check out the [Prettier](https:// - # Recommended React + TypeScript talks - [Ultimate React Component Patterns with TypeScript](https://www.youtube.com/watch?v=_PBQ3if6Fmg), by Martin Hochel, GeeCon Prague 2018 - Please help contribute this new section! + - # Time to Really Learn TypeScript Believe it or not, we have only barely introduced TypeScript here in this cheatsheet. There is a whole world of generic type logic that you will eventually get into, however it becomes far less dealing with React than just getting good at TypeScript so it is out of scope here. But at least you can get productive in React now :) @@ -2406,16 +2566,16 @@ It is worth mentioning some resources to help you get started: - Marius Schultz: https://blog.mariusschulz.com/series/typescript-evolution with an [Egghead.io course](https://egghead.io/courses/advanced-static-types-in-typescript) - Basarat's Deep Dive: https://basarat.gitbook.io/typescript/ - Rares Matei: [Egghead.io course](https://egghead.io/courses/practical-advanced-typescript)'s advanced TypeScript course on Egghead.io is great for newer typescript features and practical type logic applications (e.g. recursively making all properties of a type `readonly`) -- Go through [Remo Jansen's TypeScript ladder](http://www.techladder.io/?tech=typescript) - Shu Uesugi: [TypeScript for Beginner Programmers](https://ts.chibicode.com/) - # Example App - [Create React App TypeScript Todo Example 2020](https://github.com/laststance/create-react-app-typescript-todo-example-2020) +- [Ben Awad's 14 hour Fullstack React/GraphQL/TypeScript Tutorial](https://www.youtube.com/watch?v=I6ypD7qv3Z8) +- [Cypress Realworld App](https://github.com/cypress-io/cypress-realworld-app) From d7a9f1c591ee87e2915530240512275afb9b3fb9 Mon Sep 17 00:00:00 2001 From: swyx Date: Fri, 2 Oct 2020 14:47:42 +0000 Subject: [PATCH 099/456] tweak genreadme --- genReadme.js | 23 ++++++++++++++--------- 1 file changed, 14 insertions(+), 9 deletions(-) diff --git a/genReadme.js b/genReadme.js index 189123af..6631733e 100644 --- a/genReadme.js +++ b/genReadme.js @@ -148,12 +148,6 @@ async function getReadme() { to: initialContent, headingLevel: 1, }); - initialContent = await updateSectionWith({ - name: "resources", - path: "docs/basic/recommended/resources.md", - to: initialContent, - headingLevel: 1, - }); initialContent = await updateSectionWith({ name: "editor-integration", path: "docs/basic/editor-integration.md", @@ -167,8 +161,8 @@ async function getReadme() { headingLevel: 1, }); initialContent = await updateSectionWith({ - name: "other-resources", - path: "docs/basic/recommended/other-resources.md", + name: "resources", + path: "docs/basic/recommended/resources.md", to: initialContent, headingLevel: 1, }); @@ -178,6 +172,12 @@ async function getReadme() { to: initialContent, headingLevel: 1, }); + initialContent = await updateSectionWith({ + name: "codebases", + path: "docs/basic/recommended/codebases.md", + to: initialContent, + headingLevel: 1, + }); initialContent = await updateSectionWith({ name: "learn-ts", path: "docs/basic/troubleshooting/learn-ts.md", @@ -197,13 +197,15 @@ async function getReadme() { path: "README.md", message: `Updated README on ${new Date().toISOString()}`, sha: readme.sha, - branch: "master", + branch: "main", }); } catch (err) { console.error( `🚨 You've encountered a ${err.name} ➜ ${err.message} \n` + `💡 ProTip ➜ Please ensure your credentials are up-to-date or the path to your file exists.` ); + console.error({ repo_details }); + console.error(err); } })(); async function updateSectionWith(options) { @@ -289,6 +291,9 @@ function getFenceForSection(readme, sectionName, isToc = false) { `🚨 You've encountered a ${err.name} ➜ ${err.message} \n` + `💡 ProTip ➜ Please ensure the comments exist and are separated by a newline.` ); + + console.error({ readme, sectionName }); + console.error(err); } } function getFence(sectionName, isToc = false) { From b6a57f896263c963fe3a70defa01dfc2c9ac6d06 Mon Sep 17 00:00:00 2001 From: Elit Altum <41413622+elit-altum@users.noreply.github.com> Date: Sat, 3 Oct 2020 21:38:28 +0530 Subject: [PATCH 100/456] update: discriminated unions reference link in hooks.md - I307 (#321) --- docs/basic/getting-started/hooks.md | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/docs/basic/getting-started/hooks.md b/docs/basic/getting-started/hooks.md index 85c96df0..8e784d81 100644 --- a/docs/basic/getting-started/hooks.md +++ b/docs/basic/getting-started/hooks.md @@ -26,7 +26,7 @@ setUser(newUser); ## useReducer -You can use [Discriminated Unions](https://www.typescriptlang.org/docs/handbook/advanced-types.html#discriminated-unions) for reducer actions. Don't forget to define the return type of reducer, otherwise TypeScript will infer it. +You can use [Discriminated Unions](https://www.typescriptlang.org/docs/handbook/typescript-in-5-minutes-func.html#discriminated-unions) for reducer actions. Don't forget to define the return type of reducer, otherwise TypeScript will infer it. ```tsx const initialState = { count: 0 }; @@ -237,15 +237,15 @@ Note that the React team recommends that custom hooks that return more than two More Hooks + TypeScript reading: -- https://medium.com/@jrwebdev/react-hooks-in-typescript-88fce7001d0d -- https://fettblog.eu/typescript-react/hooks/#useref +- +- If you are writing a React Hooks library, don't forget that you should also expose your types for users to use. Example React Hooks + TypeScript Libraries: -- https://github.com/mweststrate/use-st8 -- https://github.com/palmerhq/the-platform -- https://github.com/sw-yx/hooks +- +- +- [Something to add? File an issue](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/issues/new). From 5c22f90605654002ae31c26344a6ab2944be65c8 Mon Sep 17 00:00:00 2001 From: swyx Date: Sun, 4 Oct 2020 00:09:05 +0800 Subject: [PATCH 101/456] format --- docs/advanced/patterns_by_usecase.md | 1 + .../basic/getting-started/type-or-inteface.md | 30 +++++++++---------- 2 files changed, 16 insertions(+), 15 deletions(-) diff --git a/docs/advanced/patterns_by_usecase.md b/docs/advanced/patterns_by_usecase.md index 3b38b17f..e17ca22a 100644 --- a/docs/advanced/patterns_by_usecase.md +++ b/docs/advanced/patterns_by_usecase.md @@ -665,6 +665,7 @@ function App() { ); } ``` + See this in TS Playground diff --git a/docs/basic/getting-started/type-or-inteface.md b/docs/basic/getting-started/type-or-inteface.md index 980a4d36..88617cfd 100644 --- a/docs/basic/getting-started/type-or-inteface.md +++ b/docs/basic/getting-started/type-or-inteface.md @@ -19,21 +19,21 @@ Types are useful for union types (e.g. `type MyType = TypeA | TypeB`) whereas In It's a nuanced topic, don't get too hung up on it. Here's a handy table: -| Aspect | Type | Interface | -| ------ | :----: | :---------: | -| Can describe functions | ✅ | ✅ | -| Can describe constructors | ✅ | ✅ | -| Can describe tuples | ✅ | ✅ | -| Interfaces can extend it | ⚠️ | ✅ | -| Classes can extend it | 🚫 | ✅ | -| Classes can implement it (`implements`) | ⚠️ | ✅ | -| Can intersect another one of its kind | ✅ | ⚠️ | -| Can create a union with another one of its kind | ✅ | 🚫 | -| Can be used to create mapped types | ✅ | 🚫 | -| Can be mapped over with mapped types | ✅ | ✅ | -| Expands in error messages and logs | ✅ | 🚫 | -| Can be augmented | 🚫 | ✅ | -| Can be recursive | ⚠️ | ✅ | +| Aspect | Type | Interface | +| ----------------------------------------------- | :--: | :-------: | +| Can describe functions | ✅ | ✅ | +| Can describe constructors | ✅ | ✅ | +| Can describe tuples | ✅ | ✅ | +| Interfaces can extend it | ⚠️ | ✅ | +| Classes can extend it | 🚫 | ✅ | +| Classes can implement it (`implements`) | ⚠️ | ✅ | +| Can intersect another one of its kind | ✅ | ⚠️ | +| Can create a union with another one of its kind | ✅ | 🚫 | +| Can be used to create mapped types | ✅ | 🚫 | +| Can be mapped over with mapped types | ✅ | ✅ | +| Expands in error messages and logs | ✅ | 🚫 | +| Can be augmented | 🚫 | ✅ | +| Can be recursive | ⚠️ | ✅ | ⚠️ In some cases From efd959d1d12ea4f3f097428b9d7db4cebf03ebfa Mon Sep 17 00:00:00 2001 From: David Johnston Date: Sun, 4 Oct 2020 23:39:51 +1100 Subject: [PATCH 102/456] Add an arbitrary/generic example for a prop-injecting HOC. (#320) --- README.md | 3 +-- docs/basic/getting-started/default-props.md | 3 +-- docs/hoc/excluding-props.md | 20 ++++++++++++++++++++ 3 files changed, 22 insertions(+), 4 deletions(-) diff --git a/README.md b/README.md index 1f3fedff..b938bea7 100644 --- a/README.md +++ b/README.md @@ -745,8 +745,7 @@ export type ApparentGreetProps = JSX.LibraryManagedAttributes< >; ``` -`` -This will work properly, although hovering over `ApparentGreetProps` may be a little intimidating. You can reduce this boilerplate with the `ComponentProps` utility detailed below. +``This will work properly, although hovering over`ApparentGreetProps`may be a little intimidating. You can reduce this boilerplate with the`ComponentProps` utility detailed below.
    diff --git a/docs/basic/getting-started/default-props.md b/docs/basic/getting-started/default-props.md index 5a2ffdcd..2526bb95 100644 --- a/docs/basic/getting-started/default-props.md +++ b/docs/basic/getting-started/default-props.md @@ -100,8 +100,7 @@ export type ApparentGreetProps = JSX.LibraryManagedAttributes< >; ``` -`` -This will work properly, although hovering over `ApparentGreetProps` may be a little intimidating. You can reduce this boilerplate with the `ComponentProps` utility detailed below. +``This will work properly, although hovering over`ApparentGreetProps`may be a little intimidating. You can reduce this boilerplate with the`ComponentProps` utility detailed below. diff --git a/docs/hoc/excluding-props.md b/docs/hoc/excluding-props.md index f1aa4b52..ccd896e5 100644 --- a/docs/hoc/excluding-props.md +++ b/docs/hoc/excluding-props.md @@ -85,6 +85,26 @@ This is because TypeScript does not know that merging `Omit` and `{o [See this GitHub issue for more.](https://github.com/microsoft/TypeScript/issues/35858) +## Generic solution + +The above snippet can be modified to create a generic solution to inject any arbitary props; + +```typescript +function withInjectedProps>( + injectedProps: U +) { + return function (Component: React.ComponentType) { + return function (props: Omit): JSX.Element { + //A type coercion is neccessary because TypeScript doesn't know that the Omit + {...injectedProps} = T + const newProps = { ...props, ...injectedProps } as T; + return ; + }; + }; +} +``` + +(_[Link to TS Playground](https://www.typescriptlang.org/play?strictFunctionTypes=false&jsx=1#code/JYWwDg9gTgLgBAJQKYEMDG8BmUIjgIilQ3wG4AoczAVwDsNgJa4B3YGACwElaArJDEgAmABRxgAzgB4AqnCQAPGElpCJiAdCFSJMKMFoBzADRw6Aa1oQWtAHy24ACgP9Bo8RIBccGQEo4AN7kcHBEMNRQzDT0MIzMUgAq8koqaj62jsEhcADCuJC0KjDeyOgwAHR54ExFCQCeYEiJtln+QdmhSOGRcNEMTE5gHt4A8iDsiabmSHUQmOn+3gBSAMoAGuUAogA2SCBFgVkdAPTHAIJwMA1IcGgQSFBocXDA6oVoaEgSEihQdXAAIwEKGoEhu9UaKzQ+jA8CE9wktAA5PBLNZLhwUPBODcxhMEqZ8NZClB8A4ANSBYkPbzlOkAXzgAF44Akjtk7rRdHBCiwxBBJMzAnA6eUhgKJKZRS4BMp3BK4IyUOoEhQOiEwhF4lUCgcAqLefzJIzjrY1dl6ebLeR6ZQro1clijeoWe04NtgAA3L7eWjUEBAqDm6lQby6fRGCjWvqxAY5LGOALur1fUwhxXeeMwZ1tLKanqZDpSIRelrqwL4Ai28sAWSQ1m8AQ93ok9NMIxsNKpnag1eyUmOJc9ZbgvijduucBE2xQhWzHiFbtoKH2Yb0BkMpDgNsoMee09nXUTy-2jO8B7nOcOGq6Wqc7OLpbgjSgEiYbxXN1egRPSHpA6HEcx23W1yE5bkO0KIQsyFNhOB4Vw5WdRMQ28fAAQgAF8HpXxHCzYDKCkGDmy+JkAgATkZEMmXwCQWDqBRK1NLdTgxb8JA4CBqG2IRARuTADCQcgpEg4RiJTCQyMouBqNo+jGLgZjFOONj1A4rieLgTFvTgFBLmuTYoBwKBhNE6CsWTFspJNM1lNUuB1O43igV6QTKHA+AzIvLpYPYbg+FlYRkICVCCAwrCcMcbyYGA1jNgURo3HkIzoDgABaXTtk4LjDA4Ux2CRN4IHgMBfliNBuN+bZ-iIFAhBQAFdnKbcgA)_) + ## Learn More We will need to extract lessons from here in future but here they are: From 182cde92a689a233c5382ab1b4bd4353f2efb67f Mon Sep 17 00:00:00 2001 From: "allcontributors[bot]" <46447321+allcontributors[bot]@users.noreply.github.com> Date: Sun, 4 Oct 2020 23:47:32 +0800 Subject: [PATCH 103/456] docs: add dwjohnston as a contributor (#325) Co-authored-by: allcontributors[bot] <46447321+allcontributors[bot]@users.noreply.github.com> --- .all-contributorsrc | 9 +++++++++ CONTRIBUTORS.md | 4 +++- 2 files changed, 12 insertions(+), 1 deletion(-) diff --git a/.all-contributorsrc b/.all-contributorsrc index 320e4ba4..2a7053ba 100644 --- a/.all-contributorsrc +++ b/.all-contributorsrc @@ -150,6 +150,15 @@ "ideas", "doc" ] + }, + { + "login": "dwjohnston", + "name": "David Johnston", + "avatar_url": "https://avatars2.githubusercontent.com/u/2467377?v=4", + "profile": "https://geoplanets.io", + "contributions": [ + "doc" + ] } ], "contributorsPerLine": 7, diff --git a/CONTRIBUTORS.md b/CONTRIBUTORS.md index 7850bf9b..9d569dde 100644 --- a/CONTRIBUTORS.md +++ b/CONTRIBUTORS.md @@ -22,11 +22,13 @@
    Árpád Illyés
    💻
    Igor Strebezhev
    🤔 📖 + +
    David Johnston
    📖 + - Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)): From 3142bcff4b4be34149f67a1fbeb2886a46cb030d Mon Sep 17 00:00:00 2001 From: Elit Altum <41413622+elit-altum@users.noreply.github.com> Date: Mon, 5 Oct 2020 18:27:37 +0530 Subject: [PATCH 104/456] add: lockfiles to .gitignore (#329) --- .gitignore | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/.gitignore b/.gitignore index 36df2864..a8a20b77 100644 --- a/.gitignore +++ b/.gitignore @@ -128,3 +128,7 @@ website/.cache-loader # Local Netlify folder .netlify + +# Lock-files +package-lock.json +yarn.lock \ No newline at end of file From c778143b48f6ff85ac45dcae0b075d5f035441b3 Mon Sep 17 00:00:00 2001 From: swyx Date: Mon, 5 Oct 2020 22:19:00 +0800 Subject: [PATCH 105/456] update wrapping/mirroring recommendations with ComponentPropsWithoutRef (#324) * update wrapping/mirroring recommendations with ComponentPropsWithoutRef update wrapping/mirroring recommendations with ComponentPropsWithoutRef * Update docs/advanced/patterns_by_usecase.md --- docs/advanced/patterns_by_usecase.md | 57 ++++++++++++++++++++++++---- 1 file changed, 49 insertions(+), 8 deletions(-) diff --git a/docs/advanced/patterns_by_usecase.md b/docs/advanced/patterns_by_usecase.md index e17ca22a..132bef02 100644 --- a/docs/advanced/patterns_by_usecase.md +++ b/docs/advanced/patterns_by_usecase.md @@ -10,7 +10,7 @@ sidebar_label: Useful Patterns by Use Case Usecase: you want to make a ` +)); + +// second layer button, no need for forwardRef (TODO: doublecheck this) +export interface DoubleWrappedProps extends React.ComponentPropsWithRef { + specialProp?: string; +} +export function DoubleWrappedButton(props: DoubleWrappedProps) { + const { specialProp, ref, ...rest } = props; + return + ) + ); + ``` + + + + If you are grabbing the props of a component that forwards refs, use [`ComponentPropsWithRef`](https://github.com/DefinitelyTyped/DefinitelyTyped/blob/a05cc538a42243c632f054e42eab483ebf1560ab/types/react/index.d.ts#L770). More info: https://medium.com/@martin_hotell/react-refs-with-typescript-a32d56c4d315 From 7e4f663aa171389c096aeb9055a644f5a21a7c47 Mon Sep 17 00:00:00 2001 From: james glasgow Date: Mon, 5 Oct 2020 21:19:31 +0100 Subject: [PATCH 128/456] Update links (#331) --- docs/advanced/patterns_by_version.md | 2 +- docs/basic/linting.md | 2 +- docs/basic/setup.md | 2 +- docs/basic/troubleshooting/ts-config.md | 4 ++-- docs/migration/index.md | 2 +- 5 files changed, 6 insertions(+), 6 deletions(-) diff --git a/docs/advanced/patterns_by_version.md b/docs/advanced/patterns_by_version.md index 0cedc337..41feb2f0 100644 --- a/docs/advanced/patterns_by_version.md +++ b/docs/advanced/patterns_by_version.md @@ -454,4 +454,4 @@ Possibly in 4.1 https://github.com/Microsoft/TypeScript/wiki/Roadmap -Did you also know you can read the TypeScript spec online?? https://github.com/microsoft/TypeScript/blob/master/doc/spec.md +Did you also know you can read the TypeScript spec online?? https://github.com/microsoft/TypeScript/blob/master/doc/spec-ARCHIVED.md diff --git a/docs/basic/linting.md b/docs/basic/linting.md index 38314df0..2a1f3667 100644 --- a/docs/basic/linting.md +++ b/docs/basic/linting.md @@ -102,4 +102,4 @@ You can read a [fuller TypeScript + ESLint setup guide here](https://blog.matter Another great resource is ["Using ESLint and Prettier in a TypeScript Project"](https://dev.to/robertcoopercode/using-eslint-and-prettier-in-a-typescript-project-53jb) by @robertcoopercode. -If you're looking for information on Prettier, check out the [Prettier](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/blob/master/ADVANCED.md#prettier). +If you're looking for information on Prettier, check out the [Prettier](https://github.com/typescript-cheatsheets/react/blob/main/docs/advanced/misc-concerns.md#prettier). diff --git a/docs/basic/setup.md b/docs/basic/setup.md index 6cd727c1..7401fc4b 100644 --- a/docs/basic/setup.md +++ b/docs/basic/setup.md @@ -59,6 +59,6 @@ import ReactDOM from "react-dom"; Why `allowSyntheticDefaultImports` over `esModuleInterop`? [Daniel Rosenwasser](https://twitter.com/drosenwasser/status/1003097042653073408) has said that it's better for webpack/parcel. For more discussion check out -You should also check [the new TypeScript docs for official descriptions between each compiler flag](https://www.typescriptlang.org/v2/en/tsconfig#allowSyntheticDefaultImports)! +You should also check [the new TypeScript docs for official descriptions between each compiler flag](https://www.typescriptlang.org/tsconfig#allowSyntheticDefaultImports)! diff --git a/docs/basic/troubleshooting/ts-config.md b/docs/basic/troubleshooting/ts-config.md index 4a6da705..ac9efa5b 100644 --- a/docs/basic/troubleshooting/ts-config.md +++ b/docs/basic/troubleshooting/ts-config.md @@ -4,7 +4,7 @@ title: "Troubleshooting Handbook: tsconfig.json" sidebar_label: tsconfig.json --- -You can find [all the Compiler options in the TypeScript docs](https://www.typescriptlang.org/docs/handbook/compiler-options.html). [The new TS docs also has per-flag annotations of what each does](https://www.typescriptlang.org/v2/en/tsconfig#allowSyntheticDefaultImports). This is the setup I roll with for APPS (not libraries - for libraries you may wish to see the settings we use in `tsdx`): +You can find [all the Compiler options in the TypeScript docs](https://www.typescriptlang.org/docs/handbook/compiler-options.html). [The new TS docs also has per-flag annotations of what each does](https://www.typescriptlang.org/tsconfig#allowSyntheticDefaultImports). This is the setup I roll with for APPS (not libraries - for libraries you may wish to see the settings we use in `tsdx`): ```json { @@ -48,4 +48,4 @@ Selected flags and why we like them: - `strict`: `strictPropertyInitialization` forces you to initialize class properties or explicitly declare that they can be undefined. You can opt out of this with a definite assignment assertion. - `"typeRoots": ["./typings", "./node_modules/@types"]`: By default, TypeScript looks in `node_modules/@types` and parent folders for third party type declarations. You may wish to override this default resolution so you can put all your global type declarations in a special `typings` folder. -Compilation speed grows linearly with size of codebase. For large projects, you will want to use [Project References](https://www.typescriptlang.org/docs/handbook/project-references.html). See our [ADVANCED](https://react-typescript-cheatsheet.netlify.app/docs/advanced/) cheatsheet for commentary. +Compilation speed grows linearly with size of codebase. For large projects, you will want to use [Project References](https://www.typescriptlang.org/docs/handbook/project-references.html). See our [ADVANCED](https://react-typescript-cheatsheet.netlify.app/docs/advanced/intro/) cheatsheet for commentary. diff --git a/docs/migration/index.md b/docs/migration/index.md index 798a8ae4..d86fe93e 100644 --- a/docs/migration/index.md +++ b/docs/migration/index.md @@ -117,7 +117,7 @@ Open Source - [Theme-UI](https://github.com/system-ui/theme-ui/issues/668) - [Hasura Console](https://github.com/hasura/graphql-engine/issues/4314) - [Storybook](https://github.com/storybookjs/storybook/pulls?page=4&q=is%3Apr+sort%3Aupdated-desc+is%3Aclosed+typescript+label%3Atypescript) -- [Dojo 1 -> 2 migration](https://devchat.tv/js-jabber/jsj-277-dojo-2-dylan-schiemann-kitson-kelly/) +- [Dojo 1 -> 2 migration](https://devchat.tv/js-jabber/jsj-277-dojo-2-with-dylan-schiemann-and-kitson-kelly/) ## Migration Results From 07f092c80fc71cbcc588ccdf70ab62ed09230031 Mon Sep 17 00:00:00 2001 From: "allcontributors[bot]" <46447321+allcontributors[bot]@users.noreply.github.com> Date: Tue, 6 Oct 2020 04:20:31 +0800 Subject: [PATCH 129/456] docs: add glaschu1 as a contributor (#332) Co-authored-by: allcontributors[bot] <46447321+allcontributors[bot]@users.noreply.github.com> --- .all-contributorsrc | 9 +++++++++ CONTRIBUTORS.md | 2 +- 2 files changed, 10 insertions(+), 1 deletion(-) diff --git a/.all-contributorsrc b/.all-contributorsrc index 4e946101..aa2e58b4 100644 --- a/.all-contributorsrc +++ b/.all-contributorsrc @@ -168,6 +168,15 @@ "contributions": [ "doc" ] + }, + { + "login": "glaschu1", + "name": "james glasgow", + "avatar_url": "https://avatars3.githubusercontent.com/u/10838852?v=4", + "profile": "http://www.novusstudio.com/", + "contributions": [ + "doc" + ] } ], "contributorsPerLine": 7, diff --git a/CONTRIBUTORS.md b/CONTRIBUTORS.md index cd7b922e..25c9b14f 100644 --- a/CONTRIBUTORS.md +++ b/CONTRIBUTORS.md @@ -25,12 +25,12 @@
    David Johnston
    📖
    Kristóf Poduszló
    📖 +
    james glasgow
    📖 - Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)): From 1535a43bed35c250f17905f72c22872e400184ff Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" <41898282+github-actions[bot]@users.noreply.github.com> Date: Mon, 5 Oct 2020 20:20:36 +0000 Subject: [PATCH 130/456] Updated README on 2020-10-05T20:20:36.238Z --- README.md | 32 ++++++++++++++++++++++++++++---- 1 file changed, 28 insertions(+), 4 deletions(-) diff --git a/README.md b/README.md index 2e3b3dbb..72e82443 100644 --- a/README.md +++ b/README.md @@ -171,7 +171,7 @@ import ReactDOM from "react-dom"; Why `allowSyntheticDefaultImports` over `esModuleInterop`? [Daniel Rosenwasser](https://twitter.com/drosenwasser/status/1003097042653073408) has said that it's better for webpack/parcel. For more discussion check out -You should also check [the new TypeScript docs for official descriptions between each compiler flag](https://www.typescriptlang.org/v2/en/tsconfig#allowSyntheticDefaultImports)! +You should also check [the new TypeScript docs for official descriptions between each compiler flag](https://www.typescriptlang.org/tsconfig#allowSyntheticDefaultImports)! @@ -1474,6 +1474,30 @@ export const FancyButton = React.forwardRef((props, ref) => ( )); ``` +
    + + + Side note: the `ref` you get from `forwardRef` is mutable so you can assign to it if needed. + + + + This was done [on purpose](https://github.com/DefinitelyTyped/DefinitelyTyped/pull/43265/). You can make it immutable if you have to - assign `React.Ref` if you want to ensure nobody reassigns it: + + ```tsx + type Props = { children: React.ReactNode; type: "submit" | "button" }; + export type Ref = HTMLButtonElement; + export const FancyButton = React.forwardRef( + (props: Props, ref: React.Ref) => ( // <-- here! + + ) + ); + ``` + +
    + + If you are grabbing the props of a component that forwards refs, use [`ComponentPropsWithRef`](https://github.com/DefinitelyTyped/DefinitelyTyped/blob/a05cc538a42243c632f054e42eab483ebf1560ab/types/react/index.d.ts#L770). More info: https://medium.com/@martin_hotell/react-refs-with-typescript-a32d56c4d315 @@ -2244,7 +2268,7 @@ This section needs writing, but you can probably find a good starting point with # Troubleshooting Handbook: tsconfig.json -You can find [all the Compiler options in the TypeScript docs](https://www.typescriptlang.org/docs/handbook/compiler-options.html). [The new TS docs also has per-flag annotations of what each does](https://www.typescriptlang.org/v2/en/tsconfig#allowSyntheticDefaultImports). This is the setup I roll with for APPS (not libraries - for libraries you may wish to see the settings we use in `tsdx`): +You can find [all the Compiler options in the TypeScript docs](https://www.typescriptlang.org/docs/handbook/compiler-options.html). [The new TS docs also has per-flag annotations of what each does](https://www.typescriptlang.org/tsconfig#allowSyntheticDefaultImports). This is the setup I roll with for APPS (not libraries - for libraries you may wish to see the settings we use in `tsdx`): ```json { @@ -2288,7 +2312,7 @@ Selected flags and why we like them: - `strict`: `strictPropertyInitialization` forces you to initialize class properties or explicitly declare that they can be undefined. You can opt out of this with a definite assignment assertion. - `"typeRoots": ["./typings", "./node_modules/@types"]`: By default, TypeScript looks in `node_modules/@types` and parent folders for third party type declarations. You may wish to override this default resolution so you can put all your global type declarations in a special `typings` folder. -Compilation speed grows linearly with size of codebase. For large projects, you will want to use [Project References](https://www.typescriptlang.org/docs/handbook/project-references.html). See our [ADVANCED](https://react-typescript-cheatsheet.netlify.app/docs/advanced/) cheatsheet for commentary. +Compilation speed grows linearly with size of codebase. For large projects, you will want to use [Project References](https://www.typescriptlang.org/docs/handbook/project-references.html). See our [ADVANCED](https://react-typescript-cheatsheet.netlify.app/docs/advanced/intro/) cheatsheet for commentary. @@ -2537,7 +2561,7 @@ You can read a [fuller TypeScript + ESLint setup guide here](https://blog.matter Another great resource is ["Using ESLint and Prettier in a TypeScript Project"](https://dev.to/robertcoopercode/using-eslint-and-prettier-in-a-typescript-project-53jb) by @robertcoopercode. -If you're looking for information on Prettier, check out the [Prettier](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/blob/master/ADVANCED.md#prettier). +If you're looking for information on Prettier, check out the [Prettier](https://github.com/typescript-cheatsheets/react/blob/main/docs/advanced/misc-concerns.md#prettier). From 9256f5908b6336f57c3379dfa5de5e6c1cfe0191 Mon Sep 17 00:00:00 2001 From: swyx Date: Tue, 6 Oct 2020 11:57:16 +0800 Subject: [PATCH 131/456] Update setup.md --- docs/basic/setup.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/docs/basic/setup.md b/docs/basic/setup.md index 7401fc4b..8bde06cc 100644 --- a/docs/basic/setup.md +++ b/docs/basic/setup.md @@ -25,6 +25,8 @@ Local dev setups: - [Next.js](https://nextjs.org/docs/basic-features/typescript): `npx create-next-app -e with-typescript` will create in your current folder - [Create React App](https://facebook.github.io/create-react-app/docs/adding-typescript): `npx create-react-app name-of-app --template typescript` will create in new folder - [Meteor](https://guide.meteor.com/build-tool.html#typescript): `meteor create --typescript name-of-my-new-typescript-app` +- [Ignite](https://github.com/infinitered/ignite#use-ignite-andross-infinite-red-andross-boilerplate) for React Native: `ignite new myapp` +- TSDX for Creating React+TS libraries Less mature tools still worth checking out: From 7534a14f6a2b3f347d381b3fbcf913eb79fbb94a Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" <41898282+github-actions[bot]@users.noreply.github.com> Date: Tue, 6 Oct 2020 03:58:22 +0000 Subject: [PATCH 132/456] Updated README on 2020-10-06T03:58:22.695Z --- README.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/README.md b/README.md index 72e82443..c773a409 100644 --- a/README.md +++ b/README.md @@ -137,6 +137,8 @@ Local dev setups: - [Next.js](https://nextjs.org/docs/basic-features/typescript): `npx create-next-app -e with-typescript` will create in your current folder - [Create React App](https://facebook.github.io/create-react-app/docs/adding-typescript): `npx create-react-app name-of-app --template typescript` will create in new folder - [Meteor](https://guide.meteor.com/build-tool.html#typescript): `meteor create --typescript name-of-my-new-typescript-app` +- [Ignite](https://github.com/infinitered/ignite#use-ignite-andross-infinite-red-andross-boilerplate) for React Native: `ignite new myapp` +- TSDX for Creating React+TS libraries Less mature tools still worth checking out: From 28e7b65c318ca0b324ab2f88cb3ce62cb6266b91 Mon Sep 17 00:00:00 2001 From: Ivan Date: Wed, 7 Oct 2020 12:52:34 +0100 Subject: [PATCH 133/456] adding contributors page on website (#334) --- .gitignore | 4 ++++ copyFile.js | 40 ++++++++++++++++++++++++++++++++++++ website/docusaurus.config.js | 15 ++++++++++++++ website/package.json | 9 +++++--- 4 files changed, 65 insertions(+), 3 deletions(-) create mode 100644 copyFile.js diff --git a/.gitignore b/.gitignore index a8a20b77..d41dbcaa 100644 --- a/.gitignore +++ b/.gitignore @@ -126,6 +126,10 @@ website/build website/.docusaurus website/.cache-loader +# copy of contributors for the website +docs/contributors.md +docs/contributing.md + # Local Netlify folder .netlify diff --git a/copyFile.js b/copyFile.js new file mode 100644 index 00000000..1fb5907e --- /dev/null +++ b/copyFile.js @@ -0,0 +1,40 @@ +const fs = require("fs"); + +const src = process.argv[2]; +const dest = process.argv[3]; +const hideHeader = process.argv[4]; + +const generatingPageOptions = `--- +hide_title: true +--- + +`; + +function writeNewFile() { + const fileContent = fs.readFileSync(src).toString(); + const data = new Uint8Array(Buffer.from(generatingPageOptions + fileContent)); + + fs.writeFile(dest, data, (err) => { + if (err) { + console.log("Error Found:", err); + } else { + console.log("Files added"); + } + }); +} + +function copyFile() { + fs.copyFile(src, dest, (err) => { + if (err) { + console.log("Error Found:", err); + } else { + console.log("Files copied"); + } + }); +} + +if (hideHeader) { + writeNewFile(); +} else { + copyFile(); +} diff --git a/website/docusaurus.config.js b/website/docusaurus.config.js index e342b871..ca452655 100644 --- a/website/docusaurus.config.js +++ b/website/docusaurus.config.js @@ -9,6 +9,8 @@ const users = [ ]; const setupDoc = "docs/basic/setup"; +const contributorsDoc = "docs/contributors"; +const contributingDoc = "docs/contributing"; module.exports = { favicon: "img/icon.png", @@ -77,6 +79,11 @@ module.exports = { label: "Discord", position: "right", }, + { + to: contributorsDoc, + label: "Contributors", + position: "right", + }, // {to: 'blog', label: 'Blog', position: 'right'}, ], }, @@ -110,6 +117,10 @@ module.exports = { label: "Migrating", to: "docs/migration/intro", }, + { + label: "Contributing", + to: contributingDoc, + }, ], }, { @@ -127,6 +138,10 @@ module.exports = { label: "Help", to: "help", }, + { + label: "Contributors", + to: contributorsDoc, + }, ], }, { diff --git a/website/package.json b/website/package.json index 3b0072ee..1ee3b764 100644 --- a/website/package.json +++ b/website/package.json @@ -1,9 +1,12 @@ { "scripts": { - "start": "docusaurus start", - "build": "docusaurus build", + "add-contributors-on-site": "node ../copyFile.js ../CONTRIBUTORS.md ../docs/contributors.md true", + "add-contributing-on-site": "node ../copyFile.js ../CONTRIBUTING.md ../docs/contributing.md true", + "add-pages-on-site": "yarn add-contributors-on-site && yarn add-contributing-on-site", + "start": "yarn add-pages-on-site && docusaurus start", + "build": "yarn add-pages-on-site && docusaurus build", "swizzle": "docusaurus swizzle", - "deploy": "docusaurus deploy" + "deploy": "yarn add-pages-on-site && docusaurus deploy" }, "dependencies": { "@docusaurus/core": "^2.0.0-alpha.61", From 144a5be3fe665bb8f129fffbf6a33f51985929bc Mon Sep 17 00:00:00 2001 From: "allcontributors[bot]" <46447321+allcontributors[bot]@users.noreply.github.com> Date: Wed, 7 Oct 2020 20:00:07 +0800 Subject: [PATCH 134/456] docs: add Winner95 as a contributor (#335) Co-authored-by: allcontributors[bot] <46447321+allcontributors[bot]@users.noreply.github.com> --- .all-contributorsrc | 9 +++++++++ CONTRIBUTORS.md | 1 + 2 files changed, 10 insertions(+) diff --git a/.all-contributorsrc b/.all-contributorsrc index aa2e58b4..e05c1f89 100644 --- a/.all-contributorsrc +++ b/.all-contributorsrc @@ -177,6 +177,15 @@ "contributions": [ "doc" ] + }, + { + "login": "Winner95", + "name": "Ivan", + "avatar_url": "https://avatars0.githubusercontent.com/u/13730032?v=4", + "profile": "https://www.linkedin.com/in/iigrekov/", + "contributions": [ + "code" + ] } ], "contributorsPerLine": 7, diff --git a/CONTRIBUTORS.md b/CONTRIBUTORS.md index 25c9b14f..3adaf8d4 100644 --- a/CONTRIBUTORS.md +++ b/CONTRIBUTORS.md @@ -26,6 +26,7 @@
    David Johnston
    📖
    Kristóf Poduszló
    📖
    james glasgow
    📖 +
    Ivan
    💻 From 1cd64dd0cadca4cd6f9a26ec2281b8bfa14624de Mon Sep 17 00:00:00 2001 From: sweeta123 <63840245+sweeta123@users.noreply.github.com> Date: Thu, 8 Oct 2020 23:29:00 +0530 Subject: [PATCH 135/456] Added a validation before mapping the users array (#312) --- website/src/pages/users.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/website/src/pages/users.js b/website/src/pages/users.js index 2cf3fc3e..975f2411 100644 --- a/website/src/pages/users.js +++ b/website/src/pages/users.js @@ -16,7 +16,7 @@ export default function Users() {

    This project is used by many folks

    - {users.map((user) => ( + {users && users.length>0&& users.map((user) => ( Date: Fri, 9 Oct 2020 08:12:54 +0000 Subject: [PATCH 136/456] Updated README on 2020-10-09T08:12:54.398Z From 472a0e7197c04657989ff204e74e6aef5233ee31 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" <41898282+github-actions[bot]@users.noreply.github.com> Date: Fri, 9 Oct 2020 08:14:36 +0000 Subject: [PATCH 137/456] Updated README on 2020-10-09T08:14:35.887Z From 76b508228cdbe93457d68fd79d8392f4529ca01f Mon Sep 17 00:00:00 2001 From: swyx Date: Fri, 9 Oct 2020 17:35:39 +0800 Subject: [PATCH 138/456] Revert "add: github action for checking stale markdown links" (#348) This reverts commit 51751fc107111eb2f95f9a21940050bc6195ef87. --- .github/workflows/check-markdown-links.yml | 22 ---------------------- .github/workflows/mlc_config.json | 3 --- 2 files changed, 25 deletions(-) delete mode 100644 .github/workflows/check-markdown-links.yml delete mode 100644 .github/workflows/mlc_config.json diff --git a/.github/workflows/check-markdown-links.yml b/.github/workflows/check-markdown-links.yml deleted file mode 100644 index 08a48ed3..00000000 --- a/.github/workflows/check-markdown-links.yml +++ /dev/null @@ -1,22 +0,0 @@ -name: Check Markdown Links - -on: - push: - branches: - - main - pull_request: - branches: - - main - schedule: - - cron: "0 9 * * *" - -jobs: - markdown-link-check: - runs-on: ubuntu-latest - steps: - - uses: actions/checkout@master - - uses: gaurav-nelson/github-action-markdown-link-check@v1 - with: - use-quiet-mode: "yes" - use-verbose-mode: "yes" - config-file: ".github/workflows/mlc_config.json" diff --git a/.github/workflows/mlc_config.json b/.github/workflows/mlc_config.json deleted file mode 100644 index 52165915..00000000 --- a/.github/workflows/mlc_config.json +++ /dev/null @@ -1,3 +0,0 @@ -{ - "retryOn429": true -} From a5da5c096ce140bfa06afd8b12c558836c8f342c Mon Sep 17 00:00:00 2001 From: Ivan Date: Tue, 13 Oct 2020 14:00:22 +0100 Subject: [PATCH 139/456] Move package.json scripts into copyFile.js (#350) Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> --- copyFile.js | 32 +++++++++++++++++++++----------- website/package.json | 4 +--- 2 files changed, 22 insertions(+), 14 deletions(-) diff --git a/copyFile.js b/copyFile.js index 1fb5907e..1e29087a 100644 --- a/copyFile.js +++ b/copyFile.js @@ -1,8 +1,16 @@ const fs = require("fs"); - -const src = process.argv[2]; -const dest = process.argv[3]; -const hideHeader = process.argv[4]; +const filesTopCopy = [ + { + src: "../CONTRIBUTORS.md", + dest: "../docs/contributors.md", + hideHeader: true, + }, + { + src: "../CONTRIBUTING.md", + dest: "../docs/contributing.md", + hideHeader: true, + }, +]; const generatingPageOptions = `--- hide_title: true @@ -10,7 +18,7 @@ hide_title: true `; -function writeNewFile() { +function writeNewFile(src, dest) { const fileContent = fs.readFileSync(src).toString(); const data = new Uint8Array(Buffer.from(generatingPageOptions + fileContent)); @@ -23,7 +31,7 @@ function writeNewFile() { }); } -function copyFile() { +function copyFile(src, dest) { fs.copyFile(src, dest, (err) => { if (err) { console.log("Error Found:", err); @@ -33,8 +41,10 @@ function copyFile() { }); } -if (hideHeader) { - writeNewFile(); -} else { - copyFile(); -} +filesTopCopy.forEach(({ src, dest, hideHeader }) => { + if (hideHeader) { + writeNewFile(src, dest); + } else { + copyFile(src, dest); + } +}); diff --git a/website/package.json b/website/package.json index 1ee3b764..d29fd5be 100644 --- a/website/package.json +++ b/website/package.json @@ -1,8 +1,6 @@ { "scripts": { - "add-contributors-on-site": "node ../copyFile.js ../CONTRIBUTORS.md ../docs/contributors.md true", - "add-contributing-on-site": "node ../copyFile.js ../CONTRIBUTING.md ../docs/contributing.md true", - "add-pages-on-site": "yarn add-contributors-on-site && yarn add-contributing-on-site", + "add-pages-on-site": "node ../copyFile.js", "start": "yarn add-pages-on-site && docusaurus start", "build": "yarn add-pages-on-site && docusaurus build", "swizzle": "docusaurus swizzle", From 2aad668f894c6ee77e0078e64a410cf6992b780e Mon Sep 17 00:00:00 2001 From: Elit Altum <41413622+elit-altum@users.noreply.github.com> Date: Wed, 14 Oct 2020 22:25:44 +0530 Subject: [PATCH 140/456] add: url checker for markdown files (#351) --- .github/workflows/check-markdown-links.yml | 22 ++++++++++++++++++++++ .github/workflows/mlc_config.json | 3 +++ 2 files changed, 25 insertions(+) create mode 100644 .github/workflows/check-markdown-links.yml create mode 100644 .github/workflows/mlc_config.json diff --git a/.github/workflows/check-markdown-links.yml b/.github/workflows/check-markdown-links.yml new file mode 100644 index 00000000..08a48ed3 --- /dev/null +++ b/.github/workflows/check-markdown-links.yml @@ -0,0 +1,22 @@ +name: Check Markdown Links + +on: + push: + branches: + - main + pull_request: + branches: + - main + schedule: + - cron: "0 9 * * *" + +jobs: + markdown-link-check: + runs-on: ubuntu-latest + steps: + - uses: actions/checkout@master + - uses: gaurav-nelson/github-action-markdown-link-check@v1 + with: + use-quiet-mode: "yes" + use-verbose-mode: "yes" + config-file: ".github/workflows/mlc_config.json" diff --git a/.github/workflows/mlc_config.json b/.github/workflows/mlc_config.json new file mode 100644 index 00000000..05e1a42d --- /dev/null +++ b/.github/workflows/mlc_config.json @@ -0,0 +1,3 @@ +{ + "aliveStatusCodes": [200, 429] +} From 9b06ecfb11ab067ee4a1f820b4209f35d0bc8bb4 Mon Sep 17 00:00:00 2001 From: Sebastian Andil Date: Mon, 19 Oct 2020 16:34:33 +0200 Subject: [PATCH 141/456] Remove TODO & improve wording (#353) * Remove TODO & improve wording * Update README.md Co-authored-by: Sebastian Silbermann * Update function-components.md Co-authored-by: swyx Co-authored-by: Sebastian Silbermann --- README.md | 4 ++-- docs/basic/getting-started/function-components.md | 4 ++-- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/README.md b/README.md index c773a409..12e75308 100644 --- a/README.md +++ b/README.md @@ -211,7 +211,7 @@ Some differences from the "normal function" version: - Note that there are some known issues using `defaultProps` with `React.FunctionComponent`. See [this issue for details](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/issues/87). We maintain a separate `defaultProps` section you can also look up. -- It provides an implicit definition of `children` (see below) - however there are some issues with the implicit `children` type (e.g. [DefinitelyTyped#33006](https://github.com/DefinitelyTyped/DefinitelyTyped/issues/33006)), and it might considered better style to be explicit about components that consume `children`, anyway. +- It provides an implicit definition of `children` (see below) - however there are some issues with the implicit `children` type (e.g. [DefinitelyTyped#33006](https://github.com/DefinitelyTyped/DefinitelyTyped/issues/33006)), and it might be better to be explicit about components that consume `children`, anyway. ```tsx const Title: React.FunctionComponent<{ title: string }> = ({ @@ -223,7 +223,7 @@ const Title: React.FunctionComponent<{ title: string }> = ({
    -As of [@types/react PR #46643](https://github.com/DefinitelyTyped/DefinitelyTyped/pull/46643) (TODO: update with @types/react version when merged), you can use a new `React.VoidFunctionComponent` or `React.VFC` type if you wish to declare the accepted `children` explicitly. This is an interim solution until FunctionComponent will accept no children by default (planned for React 18). +You can also use `React.VoidFunctionComponent` or `React.VFC` type if you want to type `children` explicitly. This is an interim solution until `FunctionComponent` will accept no children by default (planned for `@types/react@^18.0.0`). diff --git a/docs/basic/getting-started/function-components.md b/docs/basic/getting-started/function-components.md index ff8662b0..810526e5 100644 --- a/docs/basic/getting-started/function-components.md +++ b/docs/basic/getting-started/function-components.md @@ -30,7 +30,7 @@ Some differences from the "normal function" version: - Note that there are some known issues using `defaultProps` with `React.FunctionComponent`. See [this issue for details](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/issues/87). We maintain a separate `defaultProps` section you can also look up. -- It provides an implicit definition of `children` (see below) - however there are some issues with the implicit `children` type (e.g. [DefinitelyTyped#33006](https://github.com/DefinitelyTyped/DefinitelyTyped/issues/33006)), and it might considered better style to be explicit about components that consume `children`, anyway. +- It provides an implicit definition of `children` (see below) - however there are some issues with the implicit `children` type (e.g. [DefinitelyTyped#33006](https://github.com/DefinitelyTyped/DefinitelyTyped/issues/33006)), and it might be better to be explicit about components that consume `children`, anyway. ```tsx const Title: React.FunctionComponent<{ title: string }> = ({ @@ -42,7 +42,7 @@ const Title: React.FunctionComponent<{ title: string }> = ({
    -As of [@types/react PR #46643](https://github.com/DefinitelyTyped/DefinitelyTyped/pull/46643) (TODO: update with @types/react version when merged), you can use a new `React.VoidFunctionComponent` or `React.VFC` type if you wish to declare the accepted `children` explicitly. This is an interim solution until FunctionComponent will accept no children by default (planned for React 18). +As of [@types/react 16.9.48](https://github.com/DefinitelyTyped/DefinitelyTyped/pull/46643), you can also use `React.VoidFunctionComponent` or `React.VFC` type if you want to type `children` explicitly. This is an interim solution until `FunctionComponent` will accept no children by default (planned for `@types/react@^18.0.0`). From f5beb66d47c631b532caf878cb859ce883fceb7b Mon Sep 17 00:00:00 2001 From: swyx Date: Mon, 19 Oct 2020 22:39:20 +0800 Subject: [PATCH 142/456] Create pull_request_template.md --- .github/pull_request_template.md | 3 +++ 1 file changed, 3 insertions(+) create mode 100644 .github/pull_request_template.md diff --git a/.github/pull_request_template.md b/.github/pull_request_template.md new file mode 100644 index 00000000..5368155b --- /dev/null +++ b/.github/pull_request_template.md @@ -0,0 +1,3 @@ +Thanks for contributing! If you are making a significant PR, please make sure to open an issue first, so we have a chance to give feedback before you do too much work. If you're just fixing typos or adding small notes, you don't need to open an issue first but a brief explanation of why you'd like to add it would be nice :) + +**If you are contributing to README.md, DON'T**. README.md is auto-generated from `/docs/basic`, in order to preserve the original Github-only reading experience this cheatsheet used to have. Please just make edits to the specific sources inside of `/docs/basic`. Sorry, we get that it is a slight pain. From ef74af39cdaf74e72dc62aafce3ba7a97aa18c83 Mon Sep 17 00:00:00 2001 From: "allcontributors[bot]" <46447321+allcontributors[bot]@users.noreply.github.com> Date: Tue, 20 Oct 2020 00:48:40 +0800 Subject: [PATCH 143/456] docs: add selrond as a contributor (#355) Co-authored-by: allcontributors[bot] <46447321+allcontributors[bot]@users.noreply.github.com> --- .all-contributorsrc | 9 +++++++++ CONTRIBUTORS.md | 1 + 2 files changed, 10 insertions(+) diff --git a/.all-contributorsrc b/.all-contributorsrc index e05c1f89..789ad20c 100644 --- a/.all-contributorsrc +++ b/.all-contributorsrc @@ -186,6 +186,15 @@ "contributions": [ "code" ] + }, + { + "login": "selrond", + "name": "Sebastian Andil", + "avatar_url": "https://avatars1.githubusercontent.com/u/6603389?v=4", + "profile": "http://sebastianandil.com", + "contributions": [ + "doc" + ] } ], "contributorsPerLine": 7, diff --git a/CONTRIBUTORS.md b/CONTRIBUTORS.md index 3adaf8d4..4dd6cc1c 100644 --- a/CONTRIBUTORS.md +++ b/CONTRIBUTORS.md @@ -27,6 +27,7 @@
    Kristóf Poduszló
    📖
    james glasgow
    📖
    Ivan
    💻 +
    Sebastian Andil
    📖 From fbea96a2e56bd2fe473fa66f1aa964cc3f20ecd2 Mon Sep 17 00:00:00 2001 From: Leonardo Salazar <42286051+lsalazarm99@users.noreply.github.com> Date: Mon, 19 Oct 2020 13:17:14 -0500 Subject: [PATCH 144/456] Default props - Destructuring assignment for class component example should be inside a function (#356) The default props example for class components is not clear about where to use it. Since it's declaring a `const` directly inside a function and even using `this` in a place where it doesn't exist, it throws an error. According to the issues that were used as inspiration for this change, it should be used inside functions. In this case, inside `render()` function. Might be obvious for some people, but it took me some time to realize this is a destructuring assignment and it cannot be used as a property of the class, but as an assignment inside a function of the class. --- docs/basic/getting-started/default-props.md | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/docs/basic/getting-started/default-props.md b/docs/basic/getting-started/default-props.md index 2526bb95..9c11f136 100644 --- a/docs/basic/getting-started/default-props.md +++ b/docs/basic/getting-started/default-props.md @@ -27,8 +27,10 @@ type GreetProps = { }; class Greet extends React.Component { - const { age = 21 } = this.props - /*...*/ + render() { + const { age = 21 } = this.props; + /*...*/ + } } let el = ; From 1ea694a18a7cb13e17de7eb9f79b1bddb1311920 Mon Sep 17 00:00:00 2001 From: swyx Date: Tue, 20 Oct 2020 02:27:26 +0800 Subject: [PATCH 145/456] format --- .github/pull_request_template.md | 2 +- CONTRIBUTORS.md | 1 + README.md | 61 +++++++++++++------ docs/basic/getting-started/default-props.md | 2 +- .../getting-started/forward-create-ref.md | 28 ++++----- 5 files changed, 61 insertions(+), 33 deletions(-) diff --git a/.github/pull_request_template.md b/.github/pull_request_template.md index 5368155b..33cf8714 100644 --- a/.github/pull_request_template.md +++ b/.github/pull_request_template.md @@ -1,3 +1,3 @@ -Thanks for contributing! If you are making a significant PR, please make sure to open an issue first, so we have a chance to give feedback before you do too much work. If you're just fixing typos or adding small notes, you don't need to open an issue first but a brief explanation of why you'd like to add it would be nice :) +Thanks for contributing! If you are making a significant PR, please make sure to open an issue first, so we have a chance to give feedback before you do too much work. If you're just fixing typos or adding small notes, you don't need to open an issue first but a brief explanation of why you'd like to add it would be nice :) **If you are contributing to README.md, DON'T**. README.md is auto-generated from `/docs/basic`, in order to preserve the original Github-only reading experience this cheatsheet used to have. Please just make edits to the specific sources inside of `/docs/basic`. Sorry, we get that it is a slight pain. diff --git a/CONTRIBUTORS.md b/CONTRIBUTORS.md index 4dd6cc1c..5d9ee12d 100644 --- a/CONTRIBUTORS.md +++ b/CONTRIBUTORS.md @@ -33,6 +33,7 @@ + Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)): diff --git a/README.md b/README.md index 12e75308..50457785 100644 --- a/README.md +++ b/README.md @@ -94,10 +94,10 @@ - [Using Partial Types](#using-partial-types) - [The Types I need weren't exported!](#the-types-i-need-werent-exported) - [The Types I need don't exist!](#the-types-i-need-dont-exist) - * [Slapping `any` on everything](#slapping-any-on-everything) - * [Autogenerate types](#autogenerate-types) - * [Typing Exported Hooks](#typing-exported-hooks) - * [Typing Exported Components](#typing-exported-components) + - [Slapping `any` on everything](#slapping-any-on-everything) + - [Autogenerate types](#autogenerate-types) + - [Typing Exported Hooks](#typing-exported-hooks) + - [Typing Exported Components](#typing-exported-components) - [Troubleshooting Handbook: Operators](#troubleshooting-handbook-operators) - [Troubleshooting Handbook: Utilties](#troubleshooting-handbook-utilities) - [Troubleshooting Handbook: tsconfig.json](#troubleshooting-handbook-tsconfigjson) @@ -113,6 +113,7 @@
    + # Section 1: Setup TypeScript with React ## Prerequisites @@ -182,6 +183,7 @@ You should also check [the new TypeScript docs for official descriptions between # Section 2: Getting Started + ## Function Components These can be written as normal functions that take a `props` argument and return a JSX element. @@ -299,6 +301,7 @@ const MyArrayComponent = () => (Array(5).fill(
    ) as any) as JSX.Element; + ## Hooks Hooks are [supported in `@types/react` from v16.8 up](https://github.com/DefinitelyTyped/DefinitelyTyped/blob/a05cc538a42243c632f054e42eab483ebf1560ab/types/react/index.d.ts#L800-L1031). @@ -551,6 +554,7 @@ Example React Hooks + TypeScript Libraries: + ## Class Components Within TypeScript, `React.Component` is a generic type (aka `React.Component`), so you want to provide it with (optional) prop and state type parameters: @@ -661,6 +665,7 @@ class App extends React.Component<{ + ## You May Not Need `defaultProps` As per [this tweet](https://twitter.com/dan_abramov/status/1133878326358171650), defaultProps will eventually be deprecated. You can check the discussions here: @@ -869,6 +874,7 @@ The problem with this approach is it causes complex issues with the type inferen + ## Types or Interfaces? `interface`s are different from `type`s in TypeScript, but they can be used for very similar things as far as common React uses cases are concerned. Here's a helpful rule of thumb: @@ -914,6 +920,7 @@ It's a nuanced topic, don't get too hung up on it. Here's a handy table: + ## Basic Prop Types Examples ```tsx @@ -961,6 +968,7 @@ Notice we have used the TSDoc `/** comment */` style here on each prop. You can + ## Useful React Prop Type Examples ```tsx @@ -996,6 +1004,7 @@ Quote [@ferdaber](https://github.com/typescript-cheatsheets/react-typescript-che + ## getDerivedStateFromProps Before you start using `getDerivedStateFromProps`, please go through the [documentation](https://reactjs.org/docs/react-component.html#static-getderivedstatefromprops) and [You Probably Don't Need Derived State](https://reactjs.org/blog/2018/06/07/you-probably-dont-need-derived-state.html). Derived State can be easily achieved using hooks which can also help set up memoization easily. @@ -1063,6 +1072,7 @@ class Comp extends React.PureComponent { + ## Forms and Events If performance is not an issue, inlining handlers is easiest as you can just use [type inference and contextual typing](https://www.typescriptlang.org/docs/handbook/type-inference.html#contextual-typing): @@ -1167,6 +1177,7 @@ Of course, if you're making any sort of significant form, [you should use Formik + ## Context ## Basic Example @@ -1449,6 +1460,7 @@ const Consumer = Context.Consumer; + ## forwardRef/createRef Check the [Hooks section](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/blob/master/README.md#hooks) for `useRef`. @@ -1483,23 +1495,23 @@ export const FancyButton = React.forwardRef((props, ref) => ( - This was done [on purpose](https://github.com/DefinitelyTyped/DefinitelyTyped/pull/43265/). You can make it immutable if you have to - assign `React.Ref` if you want to ensure nobody reassigns it: +This was done [on purpose](https://github.com/DefinitelyTyped/DefinitelyTyped/pull/43265/). You can make it immutable if you have to - assign `React.Ref` if you want to ensure nobody reassigns it: - ```tsx - type Props = { children: React.ReactNode; type: "submit" | "button" }; - export type Ref = HTMLButtonElement; - export const FancyButton = React.forwardRef( - (props: Props, ref: React.Ref) => ( // <-- here! - - ) - ); - ``` +```tsx +type Props = { children: React.ReactNode; type: "submit" | "button" }; +export type Ref = HTMLButtonElement; +export const FancyButton = React.forwardRef(( + props: Props, + ref: React.Ref // <-- here! +) => ( + +)); +```
    - If you are grabbing the props of a component that forwards refs, use [`ComponentPropsWithRef`](https://github.com/DefinitelyTyped/DefinitelyTyped/blob/a05cc538a42243c632f054e42eab483ebf1560ab/types/react/index.d.ts#L770). More info: https://medium.com/@martin_hotell/react-refs-with-typescript-a32d56c4d315 @@ -1511,6 +1523,7 @@ You may also wish to do [Conditional Rendering with `forwardRef`](https://github + ## Portals Using `ReactDOM.createPortal`: @@ -1617,6 +1630,7 @@ This example is based on the [Event Bubbling Through Portal](https://reactjs.org + ## Error Boundaries ### Option 1: Using react-error-boundary @@ -1671,6 +1685,7 @@ export default ErrorBoundary; + ## Concurrent React/React Suspense _Not written yet._ watch for more on React Suspense and Time Slicing. @@ -1680,6 +1695,7 @@ _Not written yet._ watch for more o + # Troubleshooting Handbook: Types > ⚠️ Have you read [the TypeScript FAQ](https://github.com/microsoft/TypeScript/wiki/FAQ?) Your answer might be there! @@ -2223,6 +2239,7 @@ For more information on creating type definitions for class components, you can + # Troubleshooting Handbook: Operators - `typeof` and `instanceof`: type query used for refinement @@ -2245,6 +2262,7 @@ Conditional Types are a difficult topic to get around so here are some extra res + # Troubleshooting Handbook: Utilities these are all built in, [see source in es5.d.ts](https://github.com/microsoft/TypeScript/blob/2c458c0d1ccb96442bca9ce43aa987fb0becf8a9/src/lib/es5.d.ts#L1401-L1474): @@ -2268,6 +2286,7 @@ This section needs writing, but you can probably find a good starting point with + # Troubleshooting Handbook: tsconfig.json You can find [all the Compiler options in the TypeScript docs](https://www.typescriptlang.org/docs/handbook/compiler-options.html). [The new TS docs also has per-flag annotations of what each does](https://www.typescriptlang.org/tsconfig#allowSyntheticDefaultImports). This is the setup I roll with for APPS (not libraries - for libraries you may wish to see the settings we use in `tsdx`): @@ -2319,6 +2338,7 @@ Compilation speed grows linearly with size of codebase. For large projects, you + # Troubleshooting Handbook: Fixing bugs in official typings If you run into bugs with your library's official typings, you can copy them locally and tell TypeScript to use your local version using the "paths" field. In your `tsconfig.json`: @@ -2385,6 +2405,7 @@ You can see examples of these included in the built in type declarations in the + # Troubleshooting Handbook: Globals, Images and other non-TS files Use [declaration merging](https://www.typescriptlang.org/docs/handbook/declaration-merging.html). @@ -2417,6 +2438,7 @@ Related issue: https://github.com/Microsoft/TypeScript-React-Starter/issues/12 a + # Other React + TypeScript resources - me! @@ -2438,6 +2460,7 @@ Related issue: https://github.com/Microsoft/TypeScript-React-Starter/issues/12 a + # Editor Tooling and Integration - VSCode @@ -2462,6 +2485,7 @@ You may also wish to use alternative logos - [jsx-tsx-logos](https://github.com/ + # Linting > ⚠️Note that [TSLint is now in maintenance and you should try to use ESLint instead](https://medium.com/palantir/tslint-in-2019-1a144c2317a9). If you are interested in TSLint tips, please check this PR from [@azdanov](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/pull/14). The rest of this section just focuses on ESLint. [You can convert TSlint to ESlint with this tool](https://github.com/typescript-eslint/tslint-to-eslint-config). @@ -2590,6 +2614,7 @@ If you're looking for information on Prettier, check out the [Prettier](https:// + # Recommended React + TypeScript talks - [Ultimate React Component Patterns with TypeScript](https://www.youtube.com/watch?v=_PBQ3if6Fmg), by Martin Hochel, GeeCon Prague 2018 @@ -2598,6 +2623,7 @@ If you're looking for information on Prettier, check out the [Prettier](https:// + # Time to Really Learn TypeScript Believe it or not, we have only barely introduced TypeScript here in this cheatsheet. There is a whole world of generic type logic that you will eventually get into, however it becomes far less dealing with React than just getting good at TypeScript so it is out of scope here. But at least you can get productive in React now :) @@ -2614,6 +2640,7 @@ It is worth mentioning some resources to help you get started: + # Example App - [Create React App TypeScript Todo Example 2020](https://github.com/laststance/create-react-app-typescript-todo-example-2020) diff --git a/docs/basic/getting-started/default-props.md b/docs/basic/getting-started/default-props.md index 9c11f136..e06a1923 100644 --- a/docs/basic/getting-started/default-props.md +++ b/docs/basic/getting-started/default-props.md @@ -22,7 +22,7 @@ const Greet = ({ age = 21 }: GreetProps) => // etc Class Components: ```tsx -type GreetProps = { +type GreetProps = { age?: number; }; diff --git a/docs/basic/getting-started/forward-create-ref.md b/docs/basic/getting-started/forward-create-ref.md index fe0d9f7a..27a0271e 100644 --- a/docs/basic/getting-started/forward-create-ref.md +++ b/docs/basic/getting-started/forward-create-ref.md @@ -35,22 +35,22 @@ export const FancyButton = React.forwardRef((props, ref) => ( - This was done [on purpose](https://github.com/DefinitelyTyped/DefinitelyTyped/pull/43265/). You can make it immutable if you have to - assign `React.Ref` if you want to ensure nobody reassigns it: - - ```tsx - type Props = { children: React.ReactNode; type: "submit" | "button" }; - export type Ref = HTMLButtonElement; - export const FancyButton = React.forwardRef( - (props: Props, ref: React.Ref) => ( // <-- here! - - ) - ); - ``` +This was done [on purpose](https://github.com/DefinitelyTyped/DefinitelyTyped/pull/43265/). You can make it immutable if you have to - assign `React.Ref` if you want to ensure nobody reassigns it: - +```tsx +type Props = { children: React.ReactNode; type: "submit" | "button" }; +export type Ref = HTMLButtonElement; +export const FancyButton = React.forwardRef(( + props: Props, + ref: React.Ref // <-- here! +) => ( + +)); +``` + If you are grabbing the props of a component that forwards refs, use [`ComponentPropsWithRef`](https://github.com/DefinitelyTyped/DefinitelyTyped/blob/a05cc538a42243c632f054e42eab483ebf1560ab/types/react/index.d.ts#L770). From 512472683d640e93b939614d5c09364e0a2ac8b9 Mon Sep 17 00:00:00 2001 From: swyx Date: Wed, 21 Oct 2020 06:04:07 +0800 Subject: [PATCH 146/456] adding new Useful Hooks category from @adnanhusain15 (#358) Co-authored-by: Adnan Husain <36721076+adnanhusain15@users.noreply.github.com> Co-authored-by: swyx --- docs/basic/useful-hooks.md | 233 +++++++++++++++++++++++++++++++++++++ genReadme.js | 6 + website/sidebars.json | 1 + 3 files changed, 240 insertions(+) create mode 100644 docs/basic/useful-hooks.md diff --git a/docs/basic/useful-hooks.md b/docs/basic/useful-hooks.md new file mode 100644 index 00000000..ab75a153 --- /dev/null +++ b/docs/basic/useful-hooks.md @@ -0,0 +1,233 @@ +--- +id: useful-hooks +title: Useful Hooks +--- + +Useful hooks to have with their TypeScript types :) + +> ⚠️ This is a VERY new document - contributions are welcome! + +Other useful resources: + +- https://usehooks.com/ + +## useLocalStorage + +
    +Persist useState in localstorage. + +```tsx +import { useState } from "react"; + +// Usage +function App() { + // Similar to useState but first arg is key to the value in local storage. + const [name, setName] = useLocalStorage("name", "Bob"); + + return ( +
    + setName(e.target.value)} + /> +
    + ); +} + +// Hook +function useLocalStorage(key: string, initialValue: T) { + // State to store our value + // Pass initial state function to useState so logic is only executed once + const [storedValue, setStoredValue] = useState(() => { + try { + // Get from local storage by key + const item = window.localStorage.getItem(key); + // Parse stored json or if none return initialValue + return item ? JSON.parse(item) : initialValue; + } catch (error) { + // If error also return initialValue + console.log(error); + return initialValue; + } + }); + + // Return a wrapped version of useState's setter function that ... + // ... persists the new value to localStorage. + const setValue = (value: T | ((val: T) => T)) => { + try { + // Allow value to be a function so we have same API as useState + const valueToStore = + value instanceof Function ? value(storedValue) : value; + // Save state + setStoredValue(valueToStore); + // Save to local storage + window.localStorage.setItem(key, JSON.stringify(valueToStore)); + } catch (error) { + // A more advanced implementation would handle the error case + console.log(error); + } + }; + + return [storedValue, setValue]; +} +``` + +
    + +## useMedia + +
    +Media queries in JS + +```tsx +import { useState, useEffect } from 'react'; + +function App() { + const columnCount = useMedia( + // Media queries + ['(min-width: 1500px)', '(min-width: 1000px)', '(min-width: 600px)'], + // Column counts (relates to above media queries by array index) + [5, 4, 3], + // Default column count + 2 + ); + + // Create array of column heights (start at 0) + let columnHeights = new Array(columnCount).fill(0); + + // Create array of arrays that will hold each column's items + let columns = new Array(columnCount).fill().map(() => []) as Array; + + (data as DataProps[]).forEach(item => { + // Get index of shortest column + const shortColumnIndex = columnHeights.indexOf(Math.min(...columnHeights)); + // Add item + columns[shortColumnIndex].push(item); + // Update height + columnHeights[shortColumnIndex] += item.height; + }); + + // Render columns and items + return ( +
    +
    + {columns.map(column => ( +
    + {column.map(item => ( +
    + +
    + ))} +
    + ))} +
    +
    + ); +} + +// Hook +const useMedia = (queries: string[], values: T[], defaultValue: T) => { + // Array containing a media query list for each query + const mediaQueryLists = queries.map(q => window.matchMedia(q)); + + // Function that gets value based on matching media query + const getValue = () => { + // Get index of first media query that matches + const index = mediaQueryLists.findIndex(mql => mql.matches); + // Return related value or defaultValue if none + return values?.[index] || defaultValue; + }; + + // State and setter for matched value + const [value, setValue] = useState(getValue); + + useEffect( + () => { + // Event listener callback + // Note: By defining getValue outside of useEffect we ensure that it has ... + // ... current values of hook args (as this hook callback is created once on mount). + const handler = () => setValue(getValue); + // Set a listener for each media query with above handler as callback. + mediaQueryLists.forEach(mql => mql.addListener(handler)); + // Remove listeners on cleanup + return () => mediaQueryLists.forEach(mql => mql.removeListener(handler)); + }, + [] // Empty array ensures effect is only run on mount and unmount + ); + + return value; +} +``` + +
    + +## useAsyncTask + +This Hook is designed for users to make async calls and also know the current state of the request. _thanks to [Adnan S Husain](https://github.com/adnanhusain15) for contributing_! + +
    + +Example implementation + + +```tsx +// Usage +const task = useAsyncTask(async (data: any) => await myApiRequest(data)); +task.run(data); +useEffect(() => { + console.log(task.status); // 'IDEAL' | 'PROCESSING' | 'ERROR' | 'SUCCESS'; +}, task.status); + +// Implementation + +import { useCallback, useState } from "react"; + +type TStatus = "IDEAL" | "PROCESSING" | "ERROR" | "SUCCESS"; + +function useAsyncTask( + task: (...args: T) => Promise +) { + const [status, setStatus] = useState("IDEAL"); + const [message, setMessage] = useState(""); + + const run = useCallback(async (...arg: T) => { + setStatus("PROCESSING"); + try { + const resp: R = await task(...arg); + setStatus("SUCCESS"); + return resp; + } catch (error) { + let message = error?.response?.data?.error?.message || error.message; + setMessage(message); + setStatus("ERROR"); + throw error; + } + }, []); + + const reset = useCallback(() => { + setMessage(""); + setStatus("IDEAL"); + }, []); + + return { + run, + status, + message, + reset, + }; +} + +export default useAsyncTask; +``` + +
    + +See also: [useAsync](https://usehooks.com/useAsync/). diff --git a/genReadme.js b/genReadme.js index 6631733e..aff5e265 100644 --- a/genReadme.js +++ b/genReadme.js @@ -148,6 +148,12 @@ async function getReadme() { to: initialContent, headingLevel: 1, }); + initialContent = await updateSectionWith({ + name: "useful-hooks", + path: "docs/basic/useful-hooks.md", + to: initialContent, + headingLevel: 1, + }); initialContent = await updateSectionWith({ name: "editor-integration", path: "docs/basic/editor-integration.md", diff --git a/website/sidebars.json b/website/sidebars.json index f81d6c30..dfcdd448 100644 --- a/website/sidebars.json +++ b/website/sidebars.json @@ -43,6 +43,7 @@ "basic/recommended/resources" ] }, + "basic/useful-hooks", "basic/editor_integration", "basic/linting", "basic/examples" From 05a4a925b114f0d3d3bd01eadcfad0c7bc5c0f27 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" <41898282+github-actions[bot]@users.noreply.github.com> Date: Tue, 20 Oct 2020 22:04:52 +0000 Subject: [PATCH 147/456] Updated README on 2020-10-20T22:04:52.552Z --- README.md | 45 ++++++++++----------------------------------- 1 file changed, 10 insertions(+), 35 deletions(-) diff --git a/README.md b/README.md index 50457785..e52b7306 100644 --- a/README.md +++ b/README.md @@ -94,10 +94,10 @@ - [Using Partial Types](#using-partial-types) - [The Types I need weren't exported!](#the-types-i-need-werent-exported) - [The Types I need don't exist!](#the-types-i-need-dont-exist) - - [Slapping `any` on everything](#slapping-any-on-everything) - - [Autogenerate types](#autogenerate-types) - - [Typing Exported Hooks](#typing-exported-hooks) - - [Typing Exported Components](#typing-exported-components) + * [Slapping `any` on everything](#slapping-any-on-everything) + * [Autogenerate types](#autogenerate-types) + * [Typing Exported Hooks](#typing-exported-hooks) + * [Typing Exported Components](#typing-exported-components) - [Troubleshooting Handbook: Operators](#troubleshooting-handbook-operators) - [Troubleshooting Handbook: Utilties](#troubleshooting-handbook-utilities) - [Troubleshooting Handbook: tsconfig.json](#troubleshooting-handbook-tsconfigjson) @@ -113,7 +113,6 @@ - # Section 1: Setup TypeScript with React ## Prerequisites @@ -183,7 +182,6 @@ You should also check [the new TypeScript docs for official descriptions between # Section 2: Getting Started - ## Function Components These can be written as normal functions that take a `props` argument and return a JSX element. @@ -225,7 +223,7 @@ const Title: React.FunctionComponent<{ title: string }> = ({
    -You can also use `React.VoidFunctionComponent` or `React.VFC` type if you want to type `children` explicitly. This is an interim solution until `FunctionComponent` will accept no children by default (planned for `@types/react@^18.0.0`). +As of [@types/react 16.9.48](https://github.com/DefinitelyTyped/DefinitelyTyped/pull/46643), you can also use `React.VoidFunctionComponent` or `React.VFC` type if you want to type `children` explicitly. This is an interim solution until `FunctionComponent` will accept no children by default (planned for `@types/react@^18.0.0`). @@ -301,7 +299,6 @@ const MyArrayComponent = () => (Array(5).fill(
    ) as any) as JSX.Element; - ## Hooks Hooks are [supported in `@types/react` from v16.8 up](https://github.com/DefinitelyTyped/DefinitelyTyped/blob/a05cc538a42243c632f054e42eab483ebf1560ab/types/react/index.d.ts#L800-L1031). @@ -554,7 +551,6 @@ Example React Hooks + TypeScript Libraries: - ## Class Components Within TypeScript, `React.Component` is a generic type (aka `React.Component`), so you want to provide it with (optional) prop and state type parameters: @@ -665,7 +661,6 @@ class App extends React.Component<{ - ## You May Not Need `defaultProps` As per [this tweet](https://twitter.com/dan_abramov/status/1133878326358171650), defaultProps will eventually be deprecated. You can check the discussions here: @@ -685,13 +680,15 @@ const Greet = ({ age = 21 }: GreetProps) => // etc Class Components: ```tsx -type GreetProps = { +type GreetProps = { age?: number; }; class Greet extends React.Component { - const { age = 21 } = this.props - /*...*/ + render() { + const { age = 21 } = this.props; + /*...*/ + } } let el = ; @@ -874,7 +871,6 @@ The problem with this approach is it causes complex issues with the type inferen - ## Types or Interfaces? `interface`s are different from `type`s in TypeScript, but they can be used for very similar things as far as common React uses cases are concerned. Here's a helpful rule of thumb: @@ -920,7 +916,6 @@ It's a nuanced topic, don't get too hung up on it. Here's a handy table: - ## Basic Prop Types Examples ```tsx @@ -968,7 +963,6 @@ Notice we have used the TSDoc `/** comment */` style here on each prop. You can - ## Useful React Prop Type Examples ```tsx @@ -1004,7 +998,6 @@ Quote [@ferdaber](https://github.com/typescript-cheatsheets/react-typescript-che - ## getDerivedStateFromProps Before you start using `getDerivedStateFromProps`, please go through the [documentation](https://reactjs.org/docs/react-component.html#static-getderivedstatefromprops) and [You Probably Don't Need Derived State](https://reactjs.org/blog/2018/06/07/you-probably-dont-need-derived-state.html). Derived State can be easily achieved using hooks which can also help set up memoization easily. @@ -1072,7 +1065,6 @@ class Comp extends React.PureComponent { - ## Forms and Events If performance is not an issue, inlining handlers is easiest as you can just use [type inference and contextual typing](https://www.typescriptlang.org/docs/handbook/type-inference.html#contextual-typing): @@ -1177,7 +1169,6 @@ Of course, if you're making any sort of significant form, [you should use Formik - ## Context ## Basic Example @@ -1460,7 +1451,6 @@ const Consumer = Context.Consumer; - ## forwardRef/createRef Check the [Hooks section](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/blob/master/README.md#hooks) for `useRef`. @@ -1523,7 +1513,6 @@ You may also wish to do [Conditional Rendering with `forwardRef`](https://github - ## Portals Using `ReactDOM.createPortal`: @@ -1630,7 +1619,6 @@ This example is based on the [Event Bubbling Through Portal](https://reactjs.org - ## Error Boundaries ### Option 1: Using react-error-boundary @@ -1685,7 +1673,6 @@ export default ErrorBoundary; - ## Concurrent React/React Suspense _Not written yet._ watch for more on React Suspense and Time Slicing. @@ -1695,7 +1682,6 @@ _Not written yet._ watch for more o - # Troubleshooting Handbook: Types > ⚠️ Have you read [the TypeScript FAQ](https://github.com/microsoft/TypeScript/wiki/FAQ?) Your answer might be there! @@ -2239,7 +2225,6 @@ For more information on creating type definitions for class components, you can - # Troubleshooting Handbook: Operators - `typeof` and `instanceof`: type query used for refinement @@ -2262,7 +2247,6 @@ Conditional Types are a difficult topic to get around so here are some extra res - # Troubleshooting Handbook: Utilities these are all built in, [see source in es5.d.ts](https://github.com/microsoft/TypeScript/blob/2c458c0d1ccb96442bca9ce43aa987fb0becf8a9/src/lib/es5.d.ts#L1401-L1474): @@ -2286,7 +2270,6 @@ This section needs writing, but you can probably find a good starting point with - # Troubleshooting Handbook: tsconfig.json You can find [all the Compiler options in the TypeScript docs](https://www.typescriptlang.org/docs/handbook/compiler-options.html). [The new TS docs also has per-flag annotations of what each does](https://www.typescriptlang.org/tsconfig#allowSyntheticDefaultImports). This is the setup I roll with for APPS (not libraries - for libraries you may wish to see the settings we use in `tsdx`): @@ -2338,7 +2321,6 @@ Compilation speed grows linearly with size of codebase. For large projects, you - # Troubleshooting Handbook: Fixing bugs in official typings If you run into bugs with your library's official typings, you can copy them locally and tell TypeScript to use your local version using the "paths" field. In your `tsconfig.json`: @@ -2405,7 +2387,6 @@ You can see examples of these included in the built in type declarations in the - # Troubleshooting Handbook: Globals, Images and other non-TS files Use [declaration merging](https://www.typescriptlang.org/docs/handbook/declaration-merging.html). @@ -2438,7 +2419,6 @@ Related issue: https://github.com/Microsoft/TypeScript-React-Starter/issues/12 a - # Other React + TypeScript resources - me! @@ -2460,7 +2440,6 @@ Related issue: https://github.com/Microsoft/TypeScript-React-Starter/issues/12 a - # Editor Tooling and Integration - VSCode @@ -2485,7 +2464,6 @@ You may also wish to use alternative logos - [jsx-tsx-logos](https://github.com/ - # Linting > ⚠️Note that [TSLint is now in maintenance and you should try to use ESLint instead](https://medium.com/palantir/tslint-in-2019-1a144c2317a9). If you are interested in TSLint tips, please check this PR from [@azdanov](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/pull/14). The rest of this section just focuses on ESLint. [You can convert TSlint to ESlint with this tool](https://github.com/typescript-eslint/tslint-to-eslint-config). @@ -2614,7 +2592,6 @@ If you're looking for information on Prettier, check out the [Prettier](https:// - # Recommended React + TypeScript talks - [Ultimate React Component Patterns with TypeScript](https://www.youtube.com/watch?v=_PBQ3if6Fmg), by Martin Hochel, GeeCon Prague 2018 @@ -2623,7 +2600,6 @@ If you're looking for information on Prettier, check out the [Prettier](https:// - # Time to Really Learn TypeScript Believe it or not, we have only barely introduced TypeScript here in this cheatsheet. There is a whole world of generic type logic that you will eventually get into, however it becomes far less dealing with React than just getting good at TypeScript so it is out of scope here. But at least you can get productive in React now :) @@ -2640,7 +2616,6 @@ It is worth mentioning some resources to help you get started: - # Example App - [Create React App TypeScript Todo Example 2020](https://github.com/laststance/create-react-app-typescript-todo-example-2020) From 1ee97d4beba8deb62ca71d6d04f058ddf6629869 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" <41898282+github-actions[bot]@users.noreply.github.com> Date: Tue, 20 Oct 2020 22:05:11 +0000 Subject: [PATCH 148/456] Updated README on 2020-10-20T22:05:10.907Z From e2eeaff379d4638d3060f0774d929a8b2bd4ba8c Mon Sep 17 00:00:00 2001 From: "allcontributors[bot]" <46447321+allcontributors[bot]@users.noreply.github.com> Date: Wed, 21 Oct 2020 06:05:23 +0800 Subject: [PATCH 149/456] docs: add adnanhusain15 as a contributor (#359) Co-authored-by: allcontributors[bot] <46447321+allcontributors[bot]@users.noreply.github.com> --- .all-contributorsrc | 9 +++++++++ CONTRIBUTORS.md | 2 +- 2 files changed, 10 insertions(+), 1 deletion(-) diff --git a/.all-contributorsrc b/.all-contributorsrc index 789ad20c..c1cee8e1 100644 --- a/.all-contributorsrc +++ b/.all-contributorsrc @@ -195,6 +195,15 @@ "contributions": [ "doc" ] + }, + { + "login": "adnanhusain15", + "name": "Adnan Husain", + "avatar_url": "https://avatars2.githubusercontent.com/u/36721076?v=4", + "profile": "https://github.com/adnanhusain15", + "contributions": [ + "doc" + ] } ], "contributorsPerLine": 7, diff --git a/CONTRIBUTORS.md b/CONTRIBUTORS.md index 5d9ee12d..a58705eb 100644 --- a/CONTRIBUTORS.md +++ b/CONTRIBUTORS.md @@ -28,12 +28,12 @@
    james glasgow
    📖
    Ivan
    💻
    Sebastian Andil
    📖 +
    Adnan Husain
    📖 - Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)): From f7dbf8f6b2ba1838bc7838e47380dd068c0a2781 Mon Sep 17 00:00:00 2001 From: swyx Date: Thu, 22 Oct 2020 02:45:55 +0800 Subject: [PATCH 150/456] closes HOC discussion on supporting defaultProps closes https://github.com/typescript-cheatsheets/react/issues/86 --- docs/hoc/full-example.md | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/docs/hoc/full-example.md b/docs/hoc/full-example.md index ed02de70..75a2b6e6 100644 --- a/docs/hoc/full-example.md +++ b/docs/hoc/full-example.md @@ -93,3 +93,7 @@ export function inject( ### Using `forwardRef` For "true" reusability you should also consider exposing a ref for your HOC. You can use `React.forwardRef` as documented in [the basic cheatsheet](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/blob/master/README.md#forwardrefcreateref), but we are interested in more real world examples. [Here is a nice example in practice](https://gist.github.com/OliverJAsh/d2f462b03b3e6c24f5588ca7915d010e) from @OliverJAsh (note - it still has some rough edges, we need help to test this out/document this). + +### Supporting `defaultProps` of Wrapped Component + +If this is something you need, please see [the stale discussion we had](https://github.com/typescript-cheatsheets/react/issues/86) and comment with your requirements. We will pick this up again if needed. From 4e1cb5d02996a45e6fe88d116347be72f43ee97f Mon Sep 17 00:00:00 2001 From: swyx Date: Thu, 22 Oct 2020 02:59:54 +0800 Subject: [PATCH 151/456] add ts codebases to study closes https://github.com/typescript-cheatsheets/react/issues/80 --- docs/basic/recommended/codebases.md | 25 ++++++++++++++++++++++++- 1 file changed, 24 insertions(+), 1 deletion(-) diff --git a/docs/basic/recommended/codebases.md b/docs/basic/recommended/codebases.md index 7070809d..25f1d609 100644 --- a/docs/basic/recommended/codebases.md +++ b/docs/basic/recommended/codebases.md @@ -4,7 +4,9 @@ title: Recommended React + TypeScript codebases to learn from sidebar_label: Codebases to learn from --- -- https://github.com/jaredpalmer/formik + +- https://github.com/devhubapp/devhub +- https://github.com/formium/formik/ - https://github.com/jaredpalmer/react-fns - https://github.com/palantir/blueprint - https://github.com/Shopify/polaris @@ -13,6 +15,12 @@ sidebar_label: Codebases to learn from - https://github.com/benawad/codeponder (with [coding livestream!](https://www.youtube.com/watch?v=D8IJOwdNSkc&list=PLN3n1USn4xlnI6kwzI8WrNgSdG4Z6daCq)) - https://github.com/artsy/emission (React Native) - [@reach/ui's community typings](https://github.com/reach/reach-ui/pull/105) +- https://github.com/pshrmn/curi/tree/master/packages/router + +Older but still worth checking: + +- https://bitbucket.org/atlassian/atlaskit-mk-2/src/master/ +- https://github.com/contiamo/operational-ui React Boilerplates: @@ -27,3 +35,18 @@ React Native Boilerplates: _contributed by [@spoeck](https://github.com/typescri - https://github.com/lopezjurip/ReactNativeTS - https://github.com/emin93/react-native-template-typescript - + +TS Library Codebases to study + +- https://github.com/Azure/azure-sdk-for-js +- https://github.com/sindresorhus/is +- https://github.com/probot/probot +- https://github.com/intuit/auto +- https://github.com/polymer/tools +- https://github.com/nteract/nteract +- https://github.com/pgilad/leasot +- https://github.com/JasonEtco/actions-toolkit +- https://github.com/ferdaber/typescript-bootstrap/ +- https://github.com/contiamo/operational-scripts +- https://github.com/nobrainr/morphism +- https://github.com/slackapi/node-slack-sdk From 1191c63ff1f8265f4505bce27a14d66c43cc5f9a Mon Sep 17 00:00:00 2001 From: torryt Date: Fri, 23 Oct 2020 14:57:59 +0200 Subject: [PATCH 152/456] Fix typo in useful-hooks.md (#360) IDEAL -> IDLE --- docs/basic/useful-hooks.md | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/docs/basic/useful-hooks.md b/docs/basic/useful-hooks.md index ab75a153..3d4de3f1 100644 --- a/docs/basic/useful-hooks.md +++ b/docs/basic/useful-hooks.md @@ -183,19 +183,19 @@ Example implementation const task = useAsyncTask(async (data: any) => await myApiRequest(data)); task.run(data); useEffect(() => { - console.log(task.status); // 'IDEAL' | 'PROCESSING' | 'ERROR' | 'SUCCESS'; + console.log(task.status); // 'IDLE' | 'PROCESSING' | 'ERROR' | 'SUCCESS'; }, task.status); // Implementation import { useCallback, useState } from "react"; -type TStatus = "IDEAL" | "PROCESSING" | "ERROR" | "SUCCESS"; +type TStatus = "IDLE" | "PROCESSING" | "ERROR" | "SUCCESS"; function useAsyncTask( task: (...args: T) => Promise ) { - const [status, setStatus] = useState("IDEAL"); + const [status, setStatus] = useState("IDLE"); const [message, setMessage] = useState(""); const run = useCallback(async (...arg: T) => { @@ -214,7 +214,7 @@ function useAsyncTask( const reset = useCallback(() => { setMessage(""); - setStatus("IDEAL"); + setStatus("IDLE"); }, []); return { From b80c34a12bf13d79cce54f60d3541172e6277a42 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" <41898282+github-actions[bot]@users.noreply.github.com> Date: Fri, 23 Oct 2020 12:59:15 +0000 Subject: [PATCH 153/456] Updated README on 2020-10-23T12:59:15.801Z From 41da83f09d6eaaf0d195fbbeb17ced61c155ceda Mon Sep 17 00:00:00 2001 From: swyx Date: Wed, 28 Oct 2020 18:23:06 +0800 Subject: [PATCH 154/456] format --- CONTRIBUTORS.md | 1 + README.md | 101 ++++++++++++++++++++++++++-- docs/basic/recommended/codebases.md | 1 - 3 files changed, 97 insertions(+), 6 deletions(-) diff --git a/CONTRIBUTORS.md b/CONTRIBUTORS.md index a58705eb..a553ae00 100644 --- a/CONTRIBUTORS.md +++ b/CONTRIBUTORS.md @@ -34,6 +34,7 @@ + Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)): diff --git a/README.md b/README.md index e52b7306..ce87c454 100644 --- a/README.md +++ b/README.md @@ -60,7 +60,71 @@ Expand Table of Contents -- [Section 1: Setup](#section-1-setup) +- [Section 1: Setup TypeScript with React](#section-1-setup-typescript-with-react) + - [Prerequisites](#prerequisites) + - [React + TypeScript Starter Kits](#react--typescript-starter-kits) + - [Import React](#import-react) +- [Section 2: Getting Started](#section-2-getting-started) + - [Function Components](#function-components) + - [Hooks](#hooks) + - [useState](#usestate) + - [useReducer](#usereducer) + - [useEffect](#useeffect) + - [useRef](#useref) + - [useImperativeHandle](#useimperativehandle) + - [Custom Hooks](#custom-hooks) + - [Class Components](#class-components) + - [You May Not Need `defaultProps`](#you-may-not-need-defaultprops) + - [Typing `defaultProps`](#typing-defaultprops) + - [Consuming Props of a Component with defaultProps](#consuming-props-of-a-component-with-defaultprops) + - [Problem Statement](#problem-statement) + - [Solution](#solution) + - [Misc Discussions and Knowledge](#misc-discussions-and-knowledge) + - [Types or Interfaces?](#types-or-interfaces) + - [Basic Prop Types Examples](#basic-prop-types-examples) + - [Useful React Prop Type Examples](#useful-react-prop-type-examples) + - [getDerivedStateFromProps](#getderivedstatefromprops) + - [Forms and Events](#forms-and-events) + - [Context](#context) + - [Basic Example](#basic-example) + - [Extended Example](#extended-example) + - [forwardRef/createRef](#forwardrefcreateref) + - [Portals](#portals) + - [Error Boundaries](#error-boundaries) + - [Option 1: Using react-error-boundary](#option-1-using-react-error-boundary) + - [Options 2: Writing your custom error boundary component](#options-2-writing-your-custom-error-boundary-component) + - [Concurrent React/React Suspense](#concurrent-reactreact-suspense) +- [Troubleshooting Handbook: Types](#troubleshooting-handbook-types) + - [Union Types and Type Guarding](#union-types-and-type-guarding) + - [Optional Types](#optional-types) + - [Enum Types](#enum-types) + - [Type Assertion](#type-assertion) + - [Simulating Nominal Types](#simulating-nominal-types) + - [Intersection Types](#intersection-types) + - [Union Types](#union-types) + - [Overloading Function Types](#overloading-function-types) + - [Using Inferred Types](#using-inferred-types) + - [Using Partial Types](#using-partial-types) + - [The Types I need weren't exported!](#the-types-i-need-werent-exported) + - [The Types I need don't exist!](#the-types-i-need-dont-exist) + - [Slapping `any` on everything](#slapping-any-on-everything) + - [Autogenerate types](#autogenerate-types) + - [Typing Exported Hooks](#typing-exported-hooks) + - [Typing Exported Components](#typing-exported-components) +- [Troubleshooting Handbook: Operators](#troubleshooting-handbook-operators) +- [Troubleshooting Handbook: Utilities](#troubleshooting-handbook-utilities) +- [Troubleshooting Handbook: tsconfig.json](#troubleshooting-handbook-tsconfigjson) +- [Troubleshooting Handbook: Fixing bugs in official typings](#troubleshooting-handbook-fixing-bugs-in-official-typings) +- [Troubleshooting Handbook: Globals, Images and other non-TS files](#troubleshooting-handbook-globals-images-and-other-non-ts-files) +- [Other React + TypeScript resources](#other-react--typescript-resources) +- [Editor Tooling and Integration](#editor-tooling-and-integration) +- [Linting](#linting) +- [Other React + TypeScript resources](#other-react--typescript-resources-1) +- [Recommended React + TypeScript talks](#recommended-react--typescript-talks) +- [Time to Really Learn TypeScript](#time-to-really-learn-typescript) +- [Example App](#example-app) +- [My question isn't answered here!](#my-question-isnt-answered-here) + - [Contributors](#contributors) - [Prerequisites](#prerequisites) - [React + TypeScript Starter Kits](#react--typescript-starter-kits) @@ -94,10 +158,10 @@ - [Using Partial Types](#using-partial-types) - [The Types I need weren't exported!](#the-types-i-need-werent-exported) - [The Types I need don't exist!](#the-types-i-need-dont-exist) - * [Slapping `any` on everything](#slapping-any-on-everything) - * [Autogenerate types](#autogenerate-types) - * [Typing Exported Hooks](#typing-exported-hooks) - * [Typing Exported Components](#typing-exported-components) + - [Slapping `any` on everything](#slapping-any-on-everything) + - [Autogenerate types](#autogenerate-types) + - [Typing Exported Hooks](#typing-exported-hooks) + - [Typing Exported Components](#typing-exported-components) - [Troubleshooting Handbook: Operators](#troubleshooting-handbook-operators) - [Troubleshooting Handbook: Utilties](#troubleshooting-handbook-utilities) - [Troubleshooting Handbook: tsconfig.json](#troubleshooting-handbook-tsconfigjson) @@ -113,6 +177,7 @@
    + # Section 1: Setup TypeScript with React ## Prerequisites @@ -182,6 +247,7 @@ You should also check [the new TypeScript docs for official descriptions between # Section 2: Getting Started + ## Function Components These can be written as normal functions that take a `props` argument and return a JSX element. @@ -299,6 +365,7 @@ const MyArrayComponent = () => (Array(5).fill(
    ) as any) as JSX.Element; + ## Hooks Hooks are [supported in `@types/react` from v16.8 up](https://github.com/DefinitelyTyped/DefinitelyTyped/blob/a05cc538a42243c632f054e42eab483ebf1560ab/types/react/index.d.ts#L800-L1031). @@ -551,6 +618,7 @@ Example React Hooks + TypeScript Libraries: + ## Class Components Within TypeScript, `React.Component` is a generic type (aka `React.Component`), so you want to provide it with (optional) prop and state type parameters: @@ -661,6 +729,7 @@ class App extends React.Component<{ + ## You May Not Need `defaultProps` As per [this tweet](https://twitter.com/dan_abramov/status/1133878326358171650), defaultProps will eventually be deprecated. You can check the discussions here: @@ -871,6 +940,7 @@ The problem with this approach is it causes complex issues with the type inferen + ## Types or Interfaces? `interface`s are different from `type`s in TypeScript, but they can be used for very similar things as far as common React uses cases are concerned. Here's a helpful rule of thumb: @@ -916,6 +986,7 @@ It's a nuanced topic, don't get too hung up on it. Here's a handy table: + ## Basic Prop Types Examples ```tsx @@ -963,6 +1034,7 @@ Notice we have used the TSDoc `/** comment */` style here on each prop. You can + ## Useful React Prop Type Examples ```tsx @@ -998,6 +1070,7 @@ Quote [@ferdaber](https://github.com/typescript-cheatsheets/react-typescript-che + ## getDerivedStateFromProps Before you start using `getDerivedStateFromProps`, please go through the [documentation](https://reactjs.org/docs/react-component.html#static-getderivedstatefromprops) and [You Probably Don't Need Derived State](https://reactjs.org/blog/2018/06/07/you-probably-dont-need-derived-state.html). Derived State can be easily achieved using hooks which can also help set up memoization easily. @@ -1065,6 +1138,7 @@ class Comp extends React.PureComponent { + ## Forms and Events If performance is not an issue, inlining handlers is easiest as you can just use [type inference and contextual typing](https://www.typescriptlang.org/docs/handbook/type-inference.html#contextual-typing): @@ -1169,6 +1243,7 @@ Of course, if you're making any sort of significant form, [you should use Formik + ## Context ## Basic Example @@ -1451,6 +1526,7 @@ const Consumer = Context.Consumer; + ## forwardRef/createRef Check the [Hooks section](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/blob/master/README.md#hooks) for `useRef`. @@ -1513,6 +1589,7 @@ You may also wish to do [Conditional Rendering with `forwardRef`](https://github + ## Portals Using `ReactDOM.createPortal`: @@ -1619,6 +1696,7 @@ This example is based on the [Event Bubbling Through Portal](https://reactjs.org + ## Error Boundaries ### Option 1: Using react-error-boundary @@ -1673,6 +1751,7 @@ export default ErrorBoundary; + ## Concurrent React/React Suspense _Not written yet._ watch for more on React Suspense and Time Slicing. @@ -1682,6 +1761,7 @@ _Not written yet._ watch for more o + # Troubleshooting Handbook: Types > ⚠️ Have you read [the TypeScript FAQ](https://github.com/microsoft/TypeScript/wiki/FAQ?) Your answer might be there! @@ -2225,6 +2305,7 @@ For more information on creating type definitions for class components, you can + # Troubleshooting Handbook: Operators - `typeof` and `instanceof`: type query used for refinement @@ -2247,6 +2328,7 @@ Conditional Types are a difficult topic to get around so here are some extra res + # Troubleshooting Handbook: Utilities these are all built in, [see source in es5.d.ts](https://github.com/microsoft/TypeScript/blob/2c458c0d1ccb96442bca9ce43aa987fb0becf8a9/src/lib/es5.d.ts#L1401-L1474): @@ -2270,6 +2352,7 @@ This section needs writing, but you can probably find a good starting point with + # Troubleshooting Handbook: tsconfig.json You can find [all the Compiler options in the TypeScript docs](https://www.typescriptlang.org/docs/handbook/compiler-options.html). [The new TS docs also has per-flag annotations of what each does](https://www.typescriptlang.org/tsconfig#allowSyntheticDefaultImports). This is the setup I roll with for APPS (not libraries - for libraries you may wish to see the settings we use in `tsdx`): @@ -2321,6 +2404,7 @@ Compilation speed grows linearly with size of codebase. For large projects, you + # Troubleshooting Handbook: Fixing bugs in official typings If you run into bugs with your library's official typings, you can copy them locally and tell TypeScript to use your local version using the "paths" field. In your `tsconfig.json`: @@ -2387,6 +2471,7 @@ You can see examples of these included in the built in type declarations in the + # Troubleshooting Handbook: Globals, Images and other non-TS files Use [declaration merging](https://www.typescriptlang.org/docs/handbook/declaration-merging.html). @@ -2419,6 +2504,7 @@ Related issue: https://github.com/Microsoft/TypeScript-React-Starter/issues/12 a + # Other React + TypeScript resources - me! @@ -2440,6 +2526,7 @@ Related issue: https://github.com/Microsoft/TypeScript-React-Starter/issues/12 a + # Editor Tooling and Integration - VSCode @@ -2464,6 +2551,7 @@ You may also wish to use alternative logos - [jsx-tsx-logos](https://github.com/ + # Linting > ⚠️Note that [TSLint is now in maintenance and you should try to use ESLint instead](https://medium.com/palantir/tslint-in-2019-1a144c2317a9). If you are interested in TSLint tips, please check this PR from [@azdanov](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/pull/14). The rest of this section just focuses on ESLint. [You can convert TSlint to ESlint with this tool](https://github.com/typescript-eslint/tslint-to-eslint-config). @@ -2592,6 +2680,7 @@ If you're looking for information on Prettier, check out the [Prettier](https:// + # Recommended React + TypeScript talks - [Ultimate React Component Patterns with TypeScript](https://www.youtube.com/watch?v=_PBQ3if6Fmg), by Martin Hochel, GeeCon Prague 2018 @@ -2600,6 +2689,7 @@ If you're looking for information on Prettier, check out the [Prettier](https:// + # Time to Really Learn TypeScript Believe it or not, we have only barely introduced TypeScript here in this cheatsheet. There is a whole world of generic type logic that you will eventually get into, however it becomes far less dealing with React than just getting good at TypeScript so it is out of scope here. But at least you can get productive in React now :) @@ -2616,6 +2706,7 @@ It is worth mentioning some resources to help you get started: + # Example App - [Create React App TypeScript Todo Example 2020](https://github.com/laststance/create-react-app-typescript-todo-example-2020) diff --git a/docs/basic/recommended/codebases.md b/docs/basic/recommended/codebases.md index 25f1d609..03356b6a 100644 --- a/docs/basic/recommended/codebases.md +++ b/docs/basic/recommended/codebases.md @@ -4,7 +4,6 @@ title: Recommended React + TypeScript codebases to learn from sidebar_label: Codebases to learn from --- - - https://github.com/devhubapp/devhub - https://github.com/formium/formik/ - https://github.com/jaredpalmer/react-fns From b674ae4bfe569bd4dd581383d0b87eb7b44ad213 Mon Sep 17 00:00:00 2001 From: swyx Date: Wed, 28 Oct 2020 21:27:13 +0800 Subject: [PATCH 155/456] Update patterns_by_version.md --- docs/advanced/patterns_by_version.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/advanced/patterns_by_version.md b/docs/advanced/patterns_by_version.md index 41feb2f0..d13d9069 100644 --- a/docs/advanced/patterns_by_version.md +++ b/docs/advanced/patterns_by_version.md @@ -6,7 +6,7 @@ sidebar_label: Useful Patterns by TypeScript Version TypeScript Versions often introduce new ways to do things; this section helps current users of React + TypeScript upgrade TypeScript versions and explore patterns commonly used by TypeScript + React apps and libraries. This may have duplications with other sections; if you spot any discrepancies, [file an issue](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/issues/new)! -_TypeScript version guides before 2.9 are unwritten, please feel free to send a PR!_ Apart from official TS team communication we also recommend [Marius Schulz's blog for version notes](https://mariusschulz.com/). For more TypeScript history, see [A Brief History of TypeScript Types](https://github.com/blakeembrey/a-brief-history-of-types-with-typescript) and [A Brief History of DefinitelyTyped](https://blog.johnnyreilly.com/2019/10/definitely-typed-movie.html) +_TypeScript version guides before 2.9 are unwritten, please feel free to send a PR!_ Apart from official TS team communication we also recommend [Marius Schulz's blog for version notes](https://mariusschulz.com/). For more TypeScript history, see [A Brief History of TypeScript Types](https://github.com/blakeembrey/a-brief-history-of-types-with-typescript) and [A Brief History of DefinitelyTyped](https://blog.johnnyreilly.com/2019/10/definitely-typed-movie.html). You may also wish to explore lesser known alternative typings of React like [prop-types](https://reactjs.org/docs/typechecking-with-proptypes.html), [om](https://github.com/omcljs/om), [reason-react](https://reasonml.github.io/reason-react/), and [typed-react](https://github.com/asana/typed-react). ## TypeScript 2.9 From 43cc7c793c9faff389b798d53a713b2bc63dc512 Mon Sep 17 00:00:00 2001 From: swyx Date: Mon, 9 Nov 2020 05:47:55 +0800 Subject: [PATCH 156/456] Update index.md --- docs/migration/index.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/docs/migration/index.md b/docs/migration/index.md index d86fe93e..b49db4ed 100644 --- a/docs/migration/index.md +++ b/docs/migration/index.md @@ -81,6 +81,8 @@ Special note on `ts-loader` and 3rd party libraries: https://twitter.com/acemark > Our central finding is that both static type systems find an important percentage of public bugs: both Flow 0.30 and TypeScript 2.0 successfully detect 15%! +- [Empirical study on the impact of static typing](https://www.researchgate.net/publication/259634489_An_empirical_study_on_the_impact_of_static_typing_on_software_maintainability) + see also [Things I was Wrong About: Types](https://v5.chriskrycho.com/journal/things-i-was-wrong-about/1-types/) ## Misc migration stories by notable companies and open source From 8e3de2a5ebb5ca1b8e59e483d39698c0da3d9158 Mon Sep 17 00:00:00 2001 From: martin Date: Wed, 11 Nov 2020 18:30:38 +1200 Subject: [PATCH 157/456] Update excluding-props.md (#363) To avoid coercion might be safer. --- docs/hoc/excluding-props.md | 17 +++++++++++++++++ 1 file changed, 17 insertions(+) diff --git a/docs/hoc/excluding-props.md b/docs/hoc/excluding-props.md index ccd896e5..1e0c766c 100644 --- a/docs/hoc/excluding-props.md +++ b/docs/hoc/excluding-props.md @@ -105,6 +105,23 @@ function withInjectedProps>( (_[Link to TS Playground](https://www.typescriptlang.org/play?strictFunctionTypes=false&jsx=1#code/JYWwDg9gTgLgBAJQKYEMDG8BmUIjgIilQ3wG4AoczAVwDsNgJa4B3YGACwElaArJDEgAmABRxgAzgB4AqnCQAPGElpCJiAdCFSJMKMFoBzADRw6Aa1oQWtAHy24ACgP9Bo8RIBccGQEo4AN7kcHBEMNRQzDT0MIzMUgAq8koqaj62jsEhcADCuJC0KjDeyOgwAHR54ExFCQCeYEiJtln+QdmhSOGRcNEMTE5gHt4A8iDsiabmSHUQmOn+3gBSAMoAGuUAogA2SCBFgVkdAPTHAIJwMA1IcGgQSFBocXDA6oVoaEgSEihQdXAAIwEKGoEhu9UaKzQ+jA8CE9wktAA5PBLNZLhwUPBODcxhMEqZ8NZClB8A4ANSBYkPbzlOkAXzgAF44Akjtk7rRdHBCiwxBBJMzAnA6eUhgKJKZRS4BMp3BK4IyUOoEhQOiEwhF4lUCgcAqLefzJIzjrY1dl6ebLeR6ZQro1clijeoWe04NtgAA3L7eWjUEBAqDm6lQby6fRGCjWvqxAY5LGOALur1fUwhxXeeMwZ1tLKanqZDpSIRelrqwL4Ai28sAWSQ1m8AQ93ok9NMIxsNKpnag1eyUmOJc9ZbgvijduucBE2xQhWzHiFbtoKH2Yb0BkMpDgNsoMee09nXUTy-2jO8B7nOcOGq6Wqc7OLpbgjSgEiYbxXN1egRPSHpA6HEcx23W1yE5bkO0KIQsyFNhOB4Vw5WdRMQ28fAAQgAF8HpXxHCzYDKCkGDmy+JkAgATkZEMmXwCQWDqBRK1NLdTgxb8JA4CBqG2IRARuTADCQcgpEg4RiJTCQyMouBqNo+jGLgZjFOONj1A4rieLgTFvTgFBLmuTYoBwKBhNE6CsWTFspJNM1lNUuB1O43igV6QTKHA+AzIvLpYPYbg+FlYRkICVCCAwrCcMcbyYGA1jNgURo3HkIzoDgABaXTtk4LjDA4Ux2CRN4IHgMBfliNBuN+bZ-iIFAhBQAFdnKbcgA)_) +## Without coercion + +```typescritpt +function withOwner(owner: string) { + return function ( + Component: React.ComponentType + ): React.ComponentType & {owner?: never}> { + return function (props) { + const newProps = { ...props, owner }; + return ; + }; + }; +} +``` + +(_[Link to TS Playground](https://www.typescriptlang.org/play?strictFunctionTypes=false&jsx=1#code/JYWwDg9gTgLgBAJQKYEMDG8BmUIjgIilQ3wG4AoczAVwDsNgJa4B3YGACwHkXakoAFBF78AXHADOMKMFoBzAJRwA3uThwiMalGY16MRswA8AFThIAHjCS0AJhJVxhfKOKkz5cAL4A+AWvU4AGFcSD5aGHFkdBgAOhDwJhsYEwBPMCRTHwCFKOI4hLDktIyjLhB2UwAaAmd+fB84ADIVOqgAfnE+ADd+XxUA9U1tXToGJjgBMBwwCSVVQMC0Jik4PhYABRmHAF5HWIPpiFmatu8KRaGkLR04I0KkiJUD2PWt44kvOAB6HwvArz-QHkLyUGDpJDBFAwd6zOB7BZwAA2wF6Ei61BAACN+P82m5pLI5BRgXpxswgtCBMpkaikBJTiIoN5xJSYdt5gFhrd-IsjLZUdlLip8ARQcKALJIYTiZQotFeGo8FyytriwJGb4C7pCuAKEmUZa0VbKpC2Nnw1jsbhMgT4CQsVIWfAKARs-WUe7Q2lonbKACcXzaO3tjudPz+P2+cE4wAcEg4EGoSNscBxcEwsiQ5DKInN3vl9L9gacTJDDqdot+pCjMY4cckieTqY4KF6cBQMYhAFEoDgoDnTfn4IWJMWvtXa7H402U2nIZm+JRyOCMnAACIQOSwhyI2goEBIAkeOQBfGSQnyEFUMYGCabuTU-eHxkuLziB87zlXG7GbWNAB1CAIEwWVnyQRU4FNVxWiZLxNX-a8jRNPMH0tNhOGgu0K2dV0Hw9T00PAkNM1sCBRWDUNKwjGtvmjadGyTOd00XbNcz4WwiIPJASOAMiKLLKjw0nOi6wbBMmJbNtIU7VckF7ftB1Qrc1m43j+Joqd6xnST5wzLMgA)_) + ## Learn More We will need to extract lessons from here in future but here they are: From 55e9eba4b922f8bce319846c13ab93274122beb1 Mon Sep 17 00:00:00 2001 From: "allcontributors[bot]" <46447321+allcontributors[bot]@users.noreply.github.com> Date: Wed, 11 Nov 2020 14:30:53 +0800 Subject: [PATCH 158/456] docs: add artola as a contributor (#364) * docs: update CONTRIBUTORS.md [skip ci] * docs: update README.md [skip ci] * docs: update .all-contributorsrc [skip ci] Co-authored-by: allcontributors[bot] <46447321+allcontributors[bot]@users.noreply.github.com> --- .all-contributorsrc | 9 +++++++++ CONTRIBUTORS.md | 2 +- 2 files changed, 10 insertions(+), 1 deletion(-) diff --git a/.all-contributorsrc b/.all-contributorsrc index c1cee8e1..6f8010f6 100644 --- a/.all-contributorsrc +++ b/.all-contributorsrc @@ -204,6 +204,15 @@ "contributions": [ "doc" ] + }, + { + "login": "artola", + "name": "martin", + "avatar_url": "https://avatars0.githubusercontent.com/u/11500763?v=4", + "profile": "https://github.com/artola", + "contributions": [ + "doc" + ] } ], "contributorsPerLine": 7, diff --git a/CONTRIBUTORS.md b/CONTRIBUTORS.md index a553ae00..86e8c1b2 100644 --- a/CONTRIBUTORS.md +++ b/CONTRIBUTORS.md @@ -29,12 +29,12 @@
    Ivan
    💻
    Sebastian Andil
    📖
    Adnan Husain
    📖 +
    martin
    📖 - Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)): From 54e71591aa9ea3e293492e4ee4789139e82c9fda Mon Sep 17 00:00:00 2001 From: swyx Date: Wed, 11 Nov 2020 15:29:23 +0800 Subject: [PATCH 159/456] run formatting --- ...-links.yml => disabled.check-markdown-links_yml} | 13 ++++++++----- CONTRIBUTORS.md | 1 + docs/migration/index.md | 2 +- 3 files changed, 10 insertions(+), 6 deletions(-) rename .github/workflows/{check-markdown-links.yml => disabled.check-markdown-links_yml} (74%) diff --git a/.github/workflows/check-markdown-links.yml b/.github/workflows/disabled.check-markdown-links_yml similarity index 74% rename from .github/workflows/check-markdown-links.yml rename to .github/workflows/disabled.check-markdown-links_yml index 08a48ed3..d67609b8 100644 --- a/.github/workflows/check-markdown-links.yml +++ b/.github/workflows/disabled.check-markdown-links_yml @@ -1,14 +1,17 @@ +## disabled for now +## too many 429's + name: Check Markdown Links on: push: branches: - main - pull_request: - branches: - - main - schedule: - - cron: "0 9 * * *" + # pull_request: + # branches: + # - main + # schedule: + # - cron: "0 9 * * *" jobs: markdown-link-check: diff --git a/CONTRIBUTORS.md b/CONTRIBUTORS.md index 86e8c1b2..221388b6 100644 --- a/CONTRIBUTORS.md +++ b/CONTRIBUTORS.md @@ -35,6 +35,7 @@ + Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)): diff --git a/docs/migration/index.md b/docs/migration/index.md index b49db4ed..998595ed 100644 --- a/docs/migration/index.md +++ b/docs/migration/index.md @@ -81,7 +81,7 @@ Special note on `ts-loader` and 3rd party libraries: https://twitter.com/acemark > Our central finding is that both static type systems find an important percentage of public bugs: both Flow 0.30 and TypeScript 2.0 successfully detect 15%! -- [Empirical study on the impact of static typing](https://www.researchgate.net/publication/259634489_An_empirical_study_on_the_impact_of_static_typing_on_software_maintainability) +- [Empirical study on the impact of static typing](https://www.researchgate.net/publication/259634489_An_empirical_study_on_the_impact_of_static_typing_on_software_maintainability) see also [Things I was Wrong About: Types](https://v5.chriskrycho.com/journal/things-i-was-wrong-about/1-types/) From b81283ff26f6730de1ad16e191c1730156f376fd Mon Sep 17 00:00:00 2001 From: martin Date: Thu, 12 Nov 2020 05:41:59 +1200 Subject: [PATCH 160/456] Update excluding-props.md (#365) --- docs/hoc/excluding-props.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/docs/hoc/excluding-props.md b/docs/hoc/excluding-props.md index 1e0c766c..004078e5 100644 --- a/docs/hoc/excluding-props.md +++ b/docs/hoc/excluding-props.md @@ -107,11 +107,11 @@ function withInjectedProps>( ## Without coercion -```typescritpt +```typescript function withOwner(owner: string) { return function ( Component: React.ComponentType - ): React.ComponentType & {owner?: never}> { + ): React.ComponentType & { owner?: never }> { return function (props) { const newProps = { ...props, owner }; return ; From 1d84a67ae593ee108735c36b0c72137b8f6fa2df Mon Sep 17 00:00:00 2001 From: swyx Date: Thu, 12 Nov 2020 14:44:09 +0800 Subject: [PATCH 161/456] Update index.md --- docs/migration/index.md | 1 + 1 file changed, 1 insertion(+) diff --git a/docs/migration/index.md b/docs/migration/index.md index 998595ed..4b82a6db 100644 --- a/docs/migration/index.md +++ b/docs/migration/index.md @@ -87,6 +87,7 @@ see also [Things I was Wrong About: Types](https://v5.chriskrycho.com/journal/th ## Misc migration stories by notable companies and open source +- [Bloomberg](https://www.techatbloomberg.com/blog/10-insights-adopting-typescript-at-scale/) - [Adopting TypeScript at Scale - AirBnB's conversion story and strategy](https://www.youtube.com/watch?v=P-J9Eg7hJwE) - [Lyft](https://eng.lyft.com/typescript-at-lyft-64f0702346ea) - [Google](http://neugierig.org/software/blog/2018/09/typescript-at-google.html) From dd135dfe3ba502da06f872f0ab263fb481e13daa Mon Sep 17 00:00:00 2001 From: swyx Date: Sun, 22 Nov 2020 01:17:42 +0800 Subject: [PATCH 162/456] Update resources.md --- docs/basic/recommended/resources.md | 1 + 1 file changed, 1 insertion(+) diff --git a/docs/basic/recommended/resources.md b/docs/basic/recommended/resources.md index 1831a9f3..7b8e37b3 100644 --- a/docs/basic/recommended/resources.md +++ b/docs/basic/recommended/resources.md @@ -13,6 +13,7 @@ sidebar_label: Other resources - [Sindre Sorhus' TypeScript Style Guide](https://github.com/sindresorhus/typescript-definition-style-guide) - [TypeScript React Starter Template by Microsoft](https://github.com/Microsoft/TypeScript-React-Starter) A starter template for TypeScript and React with a detailed README describing how to use the two together. Note: this doesnt seem to be frequently updated anymore. - [Brian Holt's Intermediate React course on Frontend Masters (paid)](https://frontendmasters.com/courses/intermediate-react/converting-the-app-to-typescript/) - Converting App To TypeScript Section +- [Mike North's Production TypeScript course on Frontend Masters (paid)](https://frontendmasters.com/courses/production-typescript/) - [TSX Guide](https://jenil.github.io/chota/) by [gojutin](https://github.com/gojutin/www.tsx.guide) - TypeScript conversion: - [Lyft's React-To-TypeScript conversion CLI](https://github.com/lyft/react-javascript-to-typescript-transform) From af7c2a894ea38d8e633d9fd58231f2e21d11b3e1 Mon Sep 17 00:00:00 2001 From: Sebastian Silbermann Date: Wed, 25 Nov 2020 11:04:25 +0100 Subject: [PATCH 163/456] Add format:check script (#370) --- .github/workflows/main.yml | 20 +++----------------- package.json | 1 + 2 files changed, 4 insertions(+), 17 deletions(-) diff --git a/.github/workflows/main.yml b/.github/workflows/main.yml index 918bee0c..5fd3ef1e 100644 --- a/.github/workflows/main.yml +++ b/.github/workflows/main.yml @@ -9,11 +9,7 @@ jobs: prettier: runs-on: ubuntu-latest steps: - - name: Checkout - uses: actions/checkout@v2 - with: - # Make sure the actual branch is checked out when running on pull requests - ref: ${{ github.head_ref }} + - uses: actions/checkout@v2 - name: Get yarn cache directory id: yarn @@ -28,18 +24,8 @@ jobs: - name: Install dependencies run: yarn install --frozen-lockfile - - name: Prettify code - uses: creyD/prettier_action@v2.2 - with: - # This part is also where you can pass other options, for example: - prettier_options: --write **/*.md - - # old formatting code - #- name: Format code - # run: yarn format - - #- name: Format correct? - # run: git diff --exit-code + - name: `yarn format` changes committed? + run: yarn format:check - name: Danger for Spell Checking run: | diff --git a/package.json b/package.json index 6dcd78a3..cf564565 100644 --- a/package.json +++ b/package.json @@ -21,6 +21,7 @@ "format-readme": "prettier --write \"README.md\"", "gen-readme": "node genReadme.js", "format": "prettier --write \"**/*.md\"", + "format:check": "prettier --check \"**/*.md\"", "postinstall": "cd website && yarn", "start": "yarn --cwd website start", "build": "yarn --cwd website build" From 408da8cf75ed61bf2ebbb96ccccf4d6ec61e0b1f Mon Sep 17 00:00:00 2001 From: Nick Ribal Date: Wed, 25 Nov 2020 17:15:04 +0700 Subject: [PATCH 164/456] Add TS performance wiki to compilation section (#369) --- docs/advanced/misc-concerns.md | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/docs/advanced/misc-concerns.md b/docs/advanced/misc-concerns.md index 572d5f2f..f056dc17 100644 --- a/docs/advanced/misc-concerns.md +++ b/docs/advanced/misc-concerns.md @@ -189,7 +189,8 @@ Any other tips? Please contribute on this topic! [We have an ongoing issue here Compiling large TS projects can get slow. Here are some tips: -- use [TS 3.0 Project references](https://react-typescript-cheatsheet.netlify.app/docs/advanced/patterns_by_version#typescript-30) +- Use [TS 3.0 Project references](https://react-typescript-cheatsheet.netlify.app/docs/advanced/patterns_by_version#typescript-30) +- Follow the official (TS performance wiki guidelines)[https://github.com/microsoft/TypeScript/wiki/Performance] - Webpack ([see CRA diff](https://gist.github.com/jaredpalmer/d3016701589f14df8a3572df91a5754b)): - set `output.pathinfo = false` - set `optimization.splitChunks`, `optimization.removeAvailableModules`, `optimization.removeEmptyChunks` to `false` From 635f4ccc6339d0ff1196e5baba4f438e09505735 Mon Sep 17 00:00:00 2001 From: swyx Date: Wed, 25 Nov 2020 18:16:20 +0800 Subject: [PATCH 165/456] Update misc-concerns.md --- docs/advanced/misc-concerns.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/advanced/misc-concerns.md b/docs/advanced/misc-concerns.md index f056dc17..d85b752c 100644 --- a/docs/advanced/misc-concerns.md +++ b/docs/advanced/misc-concerns.md @@ -190,7 +190,7 @@ Any other tips? Please contribute on this topic! [We have an ongoing issue here Compiling large TS projects can get slow. Here are some tips: - Use [TS 3.0 Project references](https://react-typescript-cheatsheet.netlify.app/docs/advanced/patterns_by_version#typescript-30) -- Follow the official (TS performance wiki guidelines)[https://github.com/microsoft/TypeScript/wiki/Performance] +- Check the official (TS performance wiki guidelines)[https://github.com/microsoft/TypeScript/wiki/Performance] - note that [Dan Rossenwasser says to take it with a grain of salt](https://news.ycombinator.com/item?id=25199070) - Webpack ([see CRA diff](https://gist.github.com/jaredpalmer/d3016701589f14df8a3572df91a5754b)): - set `output.pathinfo = false` - set `optimization.splitChunks`, `optimization.removeAvailableModules`, `optimization.removeEmptyChunks` to `false` From e346f9c888974c31b48610917847d4b4bece5c07 Mon Sep 17 00:00:00 2001 From: swyx Date: Wed, 25 Nov 2020 18:19:41 +0800 Subject: [PATCH 166/456] Delete disabled.check-markdown-links_yml --- .../disabled.check-markdown-links_yml | 25 ------------------- 1 file changed, 25 deletions(-) delete mode 100644 .github/workflows/disabled.check-markdown-links_yml diff --git a/.github/workflows/disabled.check-markdown-links_yml b/.github/workflows/disabled.check-markdown-links_yml deleted file mode 100644 index d67609b8..00000000 --- a/.github/workflows/disabled.check-markdown-links_yml +++ /dev/null @@ -1,25 +0,0 @@ -## disabled for now -## too many 429's - -name: Check Markdown Links - -on: - push: - branches: - - main - # pull_request: - # branches: - # - main - # schedule: - # - cron: "0 9 * * *" - -jobs: - markdown-link-check: - runs-on: ubuntu-latest - steps: - - uses: actions/checkout@master - - uses: gaurav-nelson/github-action-markdown-link-check@v1 - with: - use-quiet-mode: "yes" - use-verbose-mode: "yes" - config-file: ".github/workflows/mlc_config.json" From cb9ac72f1a74eb55c6be9ad4f2ede7a29c9c4e4d Mon Sep 17 00:00:00 2001 From: swyx Date: Wed, 25 Nov 2020 18:20:18 +0800 Subject: [PATCH 167/456] fix yarn format in backticks --- .github/workflows/main.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.github/workflows/main.yml b/.github/workflows/main.yml index 5fd3ef1e..da304457 100644 --- a/.github/workflows/main.yml +++ b/.github/workflows/main.yml @@ -24,7 +24,7 @@ jobs: - name: Install dependencies run: yarn install --frozen-lockfile - - name: `yarn format` changes committed? + - name: yarn format changes committed? run: yarn format:check - name: Danger for Spell Checking From 40b06d9c29901704ad40a322de146f3eaf4b151c Mon Sep 17 00:00:00 2001 From: Sebastian Silbermann Date: Wed, 25 Nov 2020 11:30:21 +0100 Subject: [PATCH 168/456] Fix gh actions not appearing in checks (#371) --- .github/workflows/main.yml | 13 +++++++++++-- docs/migration/index.md | 2 +- 2 files changed, 12 insertions(+), 3 deletions(-) diff --git a/.github/workflows/main.yml b/.github/workflows/main.yml index da304457..5f0c1c84 100644 --- a/.github/workflows/main.yml +++ b/.github/workflows/main.yml @@ -9,7 +9,16 @@ jobs: prettier: runs-on: ubuntu-latest steps: - - uses: actions/checkout@v2 + - name: Checkout commit + uses: actions/checkout@v2 + if: ${{ github.event_name == 'push' }} + + - name: Checkout Pull Request + uses: actions/checkout@v2 + with: + # TODO: Can we unify the checkout steps i.e. does this value resolve to "undefined" on `push`? + ref: ${{ github.event.pull_request.head.sha }} + if: ${{ github.event_name == 'pull_request' }} - name: Get yarn cache directory id: yarn @@ -24,7 +33,7 @@ jobs: - name: Install dependencies run: yarn install --frozen-lockfile - - name: yarn format changes committed? + - name: '`yarn format` changes committed?' run: yarn format:check - name: Danger for Spell Checking diff --git a/docs/migration/index.md b/docs/migration/index.md index 4b82a6db..8d30d1c1 100644 --- a/docs/migration/index.md +++ b/docs/migration/index.md @@ -87,7 +87,7 @@ see also [Things I was Wrong About: Types](https://v5.chriskrycho.com/journal/th ## Misc migration stories by notable companies and open source -- [Bloomberg](https://www.techatbloomberg.com/blog/10-insights-adopting-typescript-at-scale/) +- [Bloomberg](https://www.techatbloomberg.com/blog/10-insights-adopting-typescript-at-scale/) - [Adopting TypeScript at Scale - AirBnB's conversion story and strategy](https://www.youtube.com/watch?v=P-J9Eg7hJwE) - [Lyft](https://eng.lyft.com/typescript-at-lyft-64f0702346ea) - [Google](http://neugierig.org/software/blog/2018/09/typescript-at-google.html) From de530b0f7f2e3bd143c30fc530eba8d2e77daa13 Mon Sep 17 00:00:00 2001 From: Sebastian Silbermann Date: Wed, 25 Nov 2020 12:21:04 +0100 Subject: [PATCH 169/456] Use consistent TypeScript branding (#372) --- README.md | 2 +- docs/migration/index.md | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/README.md b/README.md index ce87c454..edbde73a 100644 --- a/README.md +++ b/README.md @@ -1262,7 +1262,7 @@ const AppCtx = React.createContext(null); // Provider in your app const sampleAppContext: AppContextInterface = { - name: "Using React Context in a Typescript App", + name: "Using React Context in a TypeScript App", author: "thehappybug", url: "http://www.example.com", }; diff --git a/docs/migration/index.md b/docs/migration/index.md index 8d30d1c1..f17ea8dd 100644 --- a/docs/migration/index.md +++ b/docs/migration/index.md @@ -97,7 +97,7 @@ see also [Things I was Wrong About: Types](https://v5.chriskrycho.com/journal/th - [Priceline](https://medium.com/priceline-labs/trying-out-typescript-part-1-15a5267215b9) - Dropbox - [Talk at React Loop](https://www.youtube.com/watch?v=veXkJq0Z2Qk) - - [Blogpost: The Great CoffeeScript to Typescript Migration of 2017](https://dropbox.tech/frontend/the-great-coffeescript-to-typescript-migration-of-2017) + - [Blogpost: The Great CoffeeScript to TypeScript Migration of 2017](https://dropbox.tech/frontend/the-great-coffeescript-to-typescript-migration-of-2017) - [Heap - How we failed, then succeeded, at migrating to TypeScript](https://heap.io/blog/analysis/migrating-to-typescript) Open Source From 06dfaed31c83625c26cf390730d6297e329ecf7b Mon Sep 17 00:00:00 2001 From: Renan Couto <230893+renancouto@users.noreply.github.com> Date: Wed, 2 Dec 2020 20:02:43 +0100 Subject: [PATCH 170/456] Fix inline code not showing (#373) --- docs/advanced/patterns_by_usecase.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/advanced/patterns_by_usecase.md b/docs/advanced/patterns_by_usecase.md index f64a23ee..38ba0f3b 100644 --- a/docs/advanced/patterns_by_usecase.md +++ b/docs/advanced/patterns_by_usecase.md @@ -459,7 +459,7 @@ Parent.propTypes = { The thing you cannot do is **specify which components** the children are, e.g. If you want to express the fact that "React Router `` can only have `` as children, nothing else is allowed" in TypeScript. -This is because when you write a JSX expression (const foo = ), the resultant type is blackboxed into a generic JSX.Element type. (_[thanks @ferdaber](https://github.com/typescript-cheatsheets/react/issues/271)_) +This is because when you write a JSX expression (`const foo = `), the resultant type is blackboxed into a generic JSX.Element type. (_[thanks @ferdaber](https://github.com/typescript-cheatsheets/react/issues/271)_) ## Type Narrowing based on Props From f29457f89dcb612dba58a1f52d23a03b1bfa5373 Mon Sep 17 00:00:00 2001 From: swyx Date: Thu, 3 Dec 2020 03:09:51 +0800 Subject: [PATCH 171/456] simplify extract props docs closes https://github.com/typescript-cheatsheets/react/issues/63 thanks to @marcelreis' suggestions. --- docs/advanced/patterns_by_usecase.md | 46 ++++++---------------------- 1 file changed, 10 insertions(+), 36 deletions(-) diff --git a/docs/advanced/patterns_by_usecase.md b/docs/advanced/patterns_by_usecase.md index 38ba0f3b..e598d9e5 100644 --- a/docs/advanced/patterns_by_usecase.md +++ b/docs/advanced/patterns_by_usecase.md @@ -873,47 +873,21 @@ As you can see from the Omit example above, you can write significant logic in y ## Props: Extracting Prop Types of a Component -There are a lot of places where you want to reuse some slices of props because of prop drilling, -so you can either export the props type as part of the module or extract them (either way works). +Sometimes you want the prop types of a component, but it isn't exported. -The advantage of extracting the prop types is that you won't need to export everything, and a refactor of the source of truth component will propagate to all consuming components. - -```ts -import { ComponentProps, JSXElementConstructor } from "react"; - -// goes one step further and resolves with propTypes and defaultProps properties -type ApparentComponentProps< - C extends keyof JSX.IntrinsicElements | JSXElementConstructor -> = C extends JSXElementConstructor - ? JSX.LibraryManagedAttributes - : ComponentProps; -``` - -You can also use them to strongly type custom event handlers if they're not written at the call sites themselves -(i.e. inlined with the JSX attribute): +A simple solution is to use `React.ComponentProps`: ```tsx -// my-inner-component.tsx -export function MyInnerComponent(props: { - onSomeEvent( - event: ComplexEventObj, - moreArgs: ComplexArgs - ): SomeWeirdReturnType; -}) { - /* ... */ -} - -// my-consuming-component.tsx -export function MyConsumingComponent() { - // event and moreArgs are contextually typed along with the return value - const theHandler: Props["onSomeEvent"] = ( - event, - moreArgs - ) => {}; - return ; -} +// a Modal component defined elsewhere +const defaultProps: React.ComponentProps = { + title: "Hello World", + visible: true, + onClick: jest.fn(), +}; ``` +There are advanced edge cases if you want to extract the prop types of a component taking into account internal props, `propTypes`, and `defaultProps` - [check our issue here for helper utilities that resolve these](https://github.com/typescript-cheatsheets/react/issues/63). + ## Props: Render Props > Advice: Where possible, you should try to use Hooks instead of Render Props. We include this merely for completeness. From 9ac9f5e03b595466aefbfa2889a7fede95acdafe Mon Sep 17 00:00:00 2001 From: swyx Date: Thu, 3 Dec 2020 03:27:55 +0800 Subject: [PATCH 172/456] format --- docs/advanced/patterns_by_usecase.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/docs/advanced/patterns_by_usecase.md b/docs/advanced/patterns_by_usecase.md index e598d9e5..9bc74604 100644 --- a/docs/advanced/patterns_by_usecase.md +++ b/docs/advanced/patterns_by_usecase.md @@ -880,9 +880,9 @@ A simple solution is to use `React.ComponentProps`: ```tsx // a Modal component defined elsewhere const defaultProps: React.ComponentProps = { - title: "Hello World", - visible: true, - onClick: jest.fn(), + title: "Hello World", + visible: true, + onClick: jest.fn(), }; ``` From b2912992f14f14c5eea06d1ed160ce2e4ce68b10 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" <41898282+github-actions[bot]@users.noreply.github.com> Date: Sat, 5 Dec 2020 23:39:20 +0000 Subject: [PATCH 173/456] Updated README on 2020-12-05T23:39:20.441Z --- README.md | 36 ++++++------------------------------ 1 file changed, 6 insertions(+), 30 deletions(-) diff --git a/README.md b/README.md index edbde73a..fbde6b83 100644 --- a/README.md +++ b/README.md @@ -158,10 +158,10 @@ - [Using Partial Types](#using-partial-types) - [The Types I need weren't exported!](#the-types-i-need-werent-exported) - [The Types I need don't exist!](#the-types-i-need-dont-exist) - - [Slapping `any` on everything](#slapping-any-on-everything) - - [Autogenerate types](#autogenerate-types) - - [Typing Exported Hooks](#typing-exported-hooks) - - [Typing Exported Components](#typing-exported-components) + * [Slapping `any` on everything](#slapping-any-on-everything) + * [Autogenerate types](#autogenerate-types) + * [Typing Exported Hooks](#typing-exported-hooks) + * [Typing Exported Components](#typing-exported-components) - [Troubleshooting Handbook: Operators](#troubleshooting-handbook-operators) - [Troubleshooting Handbook: Utilties](#troubleshooting-handbook-utilities) - [Troubleshooting Handbook: tsconfig.json](#troubleshooting-handbook-tsconfigjson) @@ -177,7 +177,6 @@ - # Section 1: Setup TypeScript with React ## Prerequisites @@ -247,7 +246,6 @@ You should also check [the new TypeScript docs for official descriptions between # Section 2: Getting Started - ## Function Components These can be written as normal functions that take a `props` argument and return a JSX element. @@ -365,7 +363,6 @@ const MyArrayComponent = () => (Array(5).fill(
    ) as any) as JSX.Element; - ## Hooks Hooks are [supported in `@types/react` from v16.8 up](https://github.com/DefinitelyTyped/DefinitelyTyped/blob/a05cc538a42243c632f054e42eab483ebf1560ab/types/react/index.d.ts#L800-L1031). @@ -618,7 +615,6 @@ Example React Hooks + TypeScript Libraries: - ## Class Components Within TypeScript, `React.Component` is a generic type (aka `React.Component`), so you want to provide it with (optional) prop and state type parameters: @@ -729,7 +725,6 @@ class App extends React.Component<{ - ## You May Not Need `defaultProps` As per [this tweet](https://twitter.com/dan_abramov/status/1133878326358171650), defaultProps will eventually be deprecated. You can check the discussions here: @@ -940,7 +935,6 @@ The problem with this approach is it causes complex issues with the type inferen - ## Types or Interfaces? `interface`s are different from `type`s in TypeScript, but they can be used for very similar things as far as common React uses cases are concerned. Here's a helpful rule of thumb: @@ -986,7 +980,6 @@ It's a nuanced topic, don't get too hung up on it. Here's a handy table: - ## Basic Prop Types Examples ```tsx @@ -1138,7 +1131,6 @@ class Comp extends React.PureComponent { - ## Forms and Events If performance is not an issue, inlining handlers is easiest as you can just use [type inference and contextual typing](https://www.typescriptlang.org/docs/handbook/type-inference.html#contextual-typing): @@ -1243,7 +1235,6 @@ Of course, if you're making any sort of significant form, [you should use Formik - ## Context ## Basic Example @@ -1262,7 +1253,7 @@ const AppCtx = React.createContext(null); // Provider in your app const sampleAppContext: AppContextInterface = { - name: "Using React Context in a TypeScript App", + name: "Using React Context in a Typescript App", author: "thehappybug", url: "http://www.example.com", }; @@ -1526,7 +1517,6 @@ const Consumer = Context.Consumer; - ## forwardRef/createRef Check the [Hooks section](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/blob/master/README.md#hooks) for `useRef`. @@ -1589,7 +1579,6 @@ You may also wish to do [Conditional Rendering with `forwardRef`](https://github - ## Portals Using `ReactDOM.createPortal`: @@ -1696,7 +1685,6 @@ This example is based on the [Event Bubbling Through Portal](https://reactjs.org - ## Error Boundaries ### Option 1: Using react-error-boundary @@ -1751,7 +1739,6 @@ export default ErrorBoundary; - ## Concurrent React/React Suspense _Not written yet._ watch for more on React Suspense and Time Slicing. @@ -1761,7 +1748,6 @@ _Not written yet._ watch for more o - # Troubleshooting Handbook: Types > ⚠️ Have you read [the TypeScript FAQ](https://github.com/microsoft/TypeScript/wiki/FAQ?) Your answer might be there! @@ -2305,7 +2291,6 @@ For more information on creating type definitions for class components, you can - # Troubleshooting Handbook: Operators - `typeof` and `instanceof`: type query used for refinement @@ -2328,7 +2313,6 @@ Conditional Types are a difficult topic to get around so here are some extra res - # Troubleshooting Handbook: Utilities these are all built in, [see source in es5.d.ts](https://github.com/microsoft/TypeScript/blob/2c458c0d1ccb96442bca9ce43aa987fb0becf8a9/src/lib/es5.d.ts#L1401-L1474): @@ -2352,7 +2336,6 @@ This section needs writing, but you can probably find a good starting point with - # Troubleshooting Handbook: tsconfig.json You can find [all the Compiler options in the TypeScript docs](https://www.typescriptlang.org/docs/handbook/compiler-options.html). [The new TS docs also has per-flag annotations of what each does](https://www.typescriptlang.org/tsconfig#allowSyntheticDefaultImports). This is the setup I roll with for APPS (not libraries - for libraries you may wish to see the settings we use in `tsdx`): @@ -2404,7 +2387,6 @@ Compilation speed grows linearly with size of codebase. For large projects, you - # Troubleshooting Handbook: Fixing bugs in official typings If you run into bugs with your library's official typings, you can copy them locally and tell TypeScript to use your local version using the "paths" field. In your `tsconfig.json`: @@ -2471,7 +2453,6 @@ You can see examples of these included in the built in type declarations in the - # Troubleshooting Handbook: Globals, Images and other non-TS files Use [declaration merging](https://www.typescriptlang.org/docs/handbook/declaration-merging.html). @@ -2504,7 +2485,6 @@ Related issue: https://github.com/Microsoft/TypeScript-React-Starter/issues/12 a - # Other React + TypeScript resources - me! @@ -2516,6 +2496,7 @@ Related issue: https://github.com/Microsoft/TypeScript-React-Starter/issues/12 a - [Sindre Sorhus' TypeScript Style Guide](https://github.com/sindresorhus/typescript-definition-style-guide) - [TypeScript React Starter Template by Microsoft](https://github.com/Microsoft/TypeScript-React-Starter) A starter template for TypeScript and React with a detailed README describing how to use the two together. Note: this doesnt seem to be frequently updated anymore. - [Brian Holt's Intermediate React course on Frontend Masters (paid)](https://frontendmasters.com/courses/intermediate-react/converting-the-app-to-typescript/) - Converting App To TypeScript Section +- [Mike North's Production TypeScript course on Frontend Masters (paid)](https://frontendmasters.com/courses/production-typescript/) - [TSX Guide](https://jenil.github.io/chota/) by [gojutin](https://github.com/gojutin/www.tsx.guide) - TypeScript conversion: - [Lyft's React-To-TypeScript conversion CLI](https://github.com/lyft/react-javascript-to-typescript-transform) @@ -2526,7 +2507,6 @@ Related issue: https://github.com/Microsoft/TypeScript-React-Starter/issues/12 a - # Editor Tooling and Integration - VSCode @@ -2551,7 +2531,6 @@ You may also wish to use alternative logos - [jsx-tsx-logos](https://github.com/ - # Linting > ⚠️Note that [TSLint is now in maintenance and you should try to use ESLint instead](https://medium.com/palantir/tslint-in-2019-1a144c2317a9). If you are interested in TSLint tips, please check this PR from [@azdanov](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/pull/14). The rest of this section just focuses on ESLint. [You can convert TSlint to ESlint with this tool](https://github.com/typescript-eslint/tslint-to-eslint-config). @@ -2680,7 +2659,6 @@ If you're looking for information on Prettier, check out the [Prettier](https:// - # Recommended React + TypeScript talks - [Ultimate React Component Patterns with TypeScript](https://www.youtube.com/watch?v=_PBQ3if6Fmg), by Martin Hochel, GeeCon Prague 2018 @@ -2689,7 +2667,6 @@ If you're looking for information on Prettier, check out the [Prettier](https:// - # Time to Really Learn TypeScript Believe it or not, we have only barely introduced TypeScript here in this cheatsheet. There is a whole world of generic type logic that you will eventually get into, however it becomes far less dealing with React than just getting good at TypeScript so it is out of scope here. But at least you can get productive in React now :) @@ -2706,7 +2683,6 @@ It is worth mentioning some resources to help you get started: - # Example App - [Create React App TypeScript Todo Example 2020](https://github.com/laststance/create-react-app-typescript-todo-example-2020) From 8da15ec595064ce0936bab2d86c47bed5b8d5ef1 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" <41898282+github-actions[bot]@users.noreply.github.com> Date: Sun, 6 Dec 2020 00:08:58 +0000 Subject: [PATCH 174/456] Updated README on 2020-12-06T00:08:58.702Z From 983192b0c9cc12087661f70e3dce24b20f32e495 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" <41898282+github-actions[bot]@users.noreply.github.com> Date: Sun, 6 Dec 2020 00:09:03 +0000 Subject: [PATCH 175/456] Updated README on 2020-12-06T00:09:02.660Z From 3a2be73130bc80057ed2e7deaad2e862d62be90f Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" <41898282+github-actions[bot]@users.noreply.github.com> Date: Sun, 6 Dec 2020 00:09:12 +0000 Subject: [PATCH 176/456] Updated README on 2020-12-06T00:09:11.910Z From cb92e90a41ff1c91e45e9b93a242d872929df15f Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" <41898282+github-actions[bot]@users.noreply.github.com> Date: Sun, 6 Dec 2020 00:10:20 +0000 Subject: [PATCH 177/456] Updated README on 2020-12-06T00:10:20.661Z From 97c1ea37e3ec3da0ce0f0227075c36f3a68b46b0 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" <41898282+github-actions[bot]@users.noreply.github.com> Date: Sun, 6 Dec 2020 00:11:31 +0000 Subject: [PATCH 178/456] Updated README on 2020-12-06T00:11:30.814Z From f45e5890cd4ae97cf5eebb3758055f63083e00f2 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" <41898282+github-actions[bot]@users.noreply.github.com> Date: Sun, 6 Dec 2020 00:20:00 +0000 Subject: [PATCH 179/456] Updated README on 2020-12-06T00:20:00.303Z From 050db547a8051d42753be1a9a8e751aacb3839cb Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" <41898282+github-actions[bot]@users.noreply.github.com> Date: Sun, 6 Dec 2020 00:50:33 +0000 Subject: [PATCH 180/456] Updated README on 2020-12-06T00:50:33.077Z --- README.md | 34 +++++++++------------------------- 1 file changed, 9 insertions(+), 25 deletions(-) diff --git a/README.md b/README.md index fbde6b83..5160f390 100644 --- a/README.md +++ b/README.md @@ -2453,34 +2453,18 @@ You can see examples of these included in the built in type declarations in the -# Troubleshooting Handbook: Globals, Images and other non-TS files +# Getting Started -Use [declaration merging](https://www.typescriptlang.org/docs/handbook/declaration-merging.html). - -If, say, you are using a third party JS script that attaches on to the `window` global, you can extend `Window`: - -```ts -declare global { - interface Window { - MyVendorThing: MyVendorType; - } -} -``` - -Likewise if you wish to "import" an image or other non TS/TSX file: - -```ts -// declaration.d.ts -// anywhere in your project, NOT the same name as any of your .ts/tsx files -declare module "*.png"; - -// importing in a tsx file -import * as logo from "./logo.png"; -``` +Believe it or not, we have only barely introduced TypeScript here in this cheatsheet. There is a whole world of generic type logic that you will eventually get into, however it becomes far less dealing with React than just getting good at TypeScript so it is out of scope here. But at least you can get productive in React now :) -Note that `tsc` cannot bundle these files for you, you will have to use Webpack or Parcel. +It is worth mentioning some resources to help you get started: -Related issue: https://github.com/Microsoft/TypeScript-React-Starter/issues/12 and [StackOverflow](https://stackoverflow.com/a/49715468/4216035) +- Step through the 40+ examples under [the playground's](http://www.typescriptlang.org/play/index.html) Examples section, written by @Orta +- Anders Hejlsberg's overview of TS: https://www.youtube.com/watch?v=ET4kT88JRXs +- Marius Schultz: https://blog.mariusschulz.com/series/typescript-evolution with an [Egghead.io course](https://egghead.io/courses/advanced-static-types-in-typescript) +- Basarat's Deep Dive: https://basarat.gitbook.io/typescript/ +- Rares Matei: [Egghead.io course](https://egghead.io/courses/practical-advanced-typescript)'s advanced TypeScript course on Egghead.io is great for newer typescript features and practical type logic applications (e.g. recursively making all properties of a type `readonly`) +- Shu Uesugi: [TypeScript for Beginner Programmers](https://ts.chibicode.com/) From f084ee0d022fac915b2f93b9cba546b469496ef9 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" <41898282+github-actions[bot]@users.noreply.github.com> Date: Sun, 6 Dec 2020 00:52:00 +0000 Subject: [PATCH 181/456] Updated README on 2020-12-06T00:52:00.749Z From 8256411bcac9e8575899c5fd468be96466ffcc9c Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" <41898282+github-actions[bot]@users.noreply.github.com> Date: Sun, 6 Dec 2020 01:00:43 +0000 Subject: [PATCH 182/456] Updated README on 2020-12-06T01:00:42.905Z From e48d49185b113398ea795afe2f0637544f3e99d3 Mon Sep 17 00:00:00 2001 From: swyx Date: Sun, 6 Dec 2020 09:01:08 +0800 Subject: [PATCH 183/456] minor swyx dec updates (#374) Co-authored-by: Sebastian Silbermann Co-authored-by: swyx --- .github/workflows/readme.js.yml | 6 +- .../getting-started/basic-type-examples.md | 86 ++++++++++++++++++- .../basic/getting-started/class-components.md | 64 ++++++++++++++ .../basic/getting-started/forms-and-events.md | 17 ++-- .../getting-started/function-components.md | 4 +- .../get-derived-state-from-props.md | 66 -------------- docs/basic/getting-started/hooks.md | 50 ++++++++--- .../react-prop-type-examples.md | 34 -------- .../basic/getting-started/type-or-inteface.md | 44 ---------- docs/basic/recommended/codebases.md | 2 +- docs/basic/setup.md | 13 ++- docs/basic/troubleshooting/learn-ts.md | 2 +- docs/basic/troubleshooting/utilities.md | 6 +- genReadme.js | 33 +++---- website/sidebars.json | 8 +- 15 files changed, 229 insertions(+), 206 deletions(-) delete mode 100644 docs/basic/getting-started/get-derived-state-from-props.md delete mode 100644 docs/basic/getting-started/react-prop-type-examples.md delete mode 100644 docs/basic/getting-started/type-or-inteface.md diff --git a/.github/workflows/readme.js.yml b/.github/workflows/readme.js.yml index c6336e59..8c14395b 100644 --- a/.github/workflows/readme.js.yml +++ b/.github/workflows/readme.js.yml @@ -2,17 +2,17 @@ name: Generate README on: workflow_dispatch: pull_request: - paths: 'docs/basic/*' + paths: "docs/basic/*" branches: [main] push: - paths: 'docs/basic/*' + paths: "docs/basic/*" branches: [main] jobs: build: runs-on: ubuntu-latest steps: - uses: actions/checkout@v2 - - uses: franzdiebold/github-env-vars-action@v1.0.0 + - uses: franzdiebold/github-env-vars-action@v2.1.0 - name: Setup Node.js Environment uses: actions/setup-node@v1 diff --git a/docs/basic/getting-started/basic-type-examples.md b/docs/basic/getting-started/basic-type-examples.md index b057acd3..a28f22e2 100644 --- a/docs/basic/getting-started/basic-type-examples.md +++ b/docs/basic/getting-started/basic-type-examples.md @@ -1,8 +1,14 @@ --- id: basic_type_example -title: Basic Prop Types Examples +title: Typing Component Props --- +This is intended as a basic orientation and reference for React developers familiarizing with TypeScript. + +## Basic Prop Types Examples + +A list of TypeScript types you will likely use in a React+TypeScript app: + ```tsx type AppProps = { message: string; @@ -44,3 +50,81 @@ type AppProps = { ``` Notice we have used the TSDoc `/** comment */` style here on each prop. You can and are encouraged to leave descriptive comments on reusable components. For a fuller example and discussion, see our [Commenting Components](https://react-typescript-cheatsheet.netlify.app/docs/advanced/misc_concerns/#commenting-components) section in the Advanced Cheatsheet. + +## Useful React Prop Type Examples + +Relevant for components that accept other React components as props. + +```tsx +export declare interface AppProps { + children1: JSX.Element; // bad, doesnt account for arrays + children2: JSX.Element | JSX.Element[]; // meh, doesn't accept strings + children3: React.ReactChildren; // despite the name, not at all an appropriate type; it is a utility + children4: React.ReactChild[]; // better + children: React.ReactNode; // best, accepts everything + functionChildren: (name: string) => React.ReactNode; // recommended function as a child render prop type + style?: React.CSSProperties; // to pass through style props + onChange?: React.FormEventHandler; // form events! the generic parameter is the type of event.target + // more info: https://react-typescript-cheatsheet.netlify.app/docs/advanced/patterns_by_usecase/#wrappingmirroring + props: Props & React.ComponentPropsWithoutRef<"button">; // to impersonate all the props of a button element and explicitly not forwarding its ref + props2: Props & React.ComponentPropsWithRef; // to impersonate all the props of MyButtonForwardedRef and explicitly forwarding its ref +} +``` + +
    + JSX.Element vs React.ReactNode? + +Quote [@ferdaber](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/issues/57): A more technical explanation is that a valid React node is not the same thing as what is returned by `React.createElement`. Regardless of what a component ends up rendering, `React.createElement` always returns an object, which is the `JSX.Element` interface, but `React.ReactNode` is the set of all possible return values of a component. + +- `JSX.Element` -> Return value of `React.createElement` +- `React.ReactNode` -> Return value of a component + +
    + +[More discussion: Where ReactNode does not overlap with JSX.Element](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/issues/129) + +[Something to add? File an issue](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/issues/new). + +## Types or Interfaces? + +You can use either Types or Interfaces to type Props and State, so naturally the question arises - which do you use? + +`interface`s are different from `type`s in TypeScript, but they can be used for very similar things as far as common React uses cases are concerned. Here's a helpful rule of thumb: + +- always use `interface` for public API's definition when authoring a library or 3rd party ambient type definitions, as this allows a consumer to extend them via _declaration merging_ if some definitions are missing. + +- consider using `type` for your React Component Props and State, for consistency and because it is more constrained. + +You can read more about the reasoning behind this rule of thumb in [Interface vs Type alias in TypeScript 2.7](https://medium.com/@martin_hotell/interface-vs-type-alias-in-typescript-2-7-2a8f1777af4c). + +Types are useful for union types (e.g. `type MyType = TypeA | TypeB`) whereas Interfaces are better for declaring dictionary shapes and then `implementing` or `extending` them. + +
    + + Useful table for Types vs Interfaces + +It's a nuanced topic, don't get too hung up on it. Here's a handy table: + +| Aspect | Type | Interface | +| ----------------------------------------------- | :--: | :-------: | +| Can describe functions | ✅ | ✅ | +| Can describe constructors | ✅ | ✅ | +| Can describe tuples | ✅ | ✅ | +| Interfaces can extend it | ⚠️ | ✅ | +| Classes can extend it | 🚫 | ✅ | +| Classes can implement it (`implements`) | ⚠️ | ✅ | +| Can intersect another one of its kind | ✅ | ⚠️ | +| Can create a union with another one of its kind | ✅ | 🚫 | +| Can be used to create mapped types | ✅ | 🚫 | +| Can be mapped over with mapped types | ✅ | ✅ | +| Expands in error messages and logs | ✅ | 🚫 | +| Can be augmented | 🚫 | ✅ | +| Can be recursive | ⚠️ | ✅ | + +⚠️ In some cases + +(source: [Karol Majewski](https://twitter.com/karoljmajewski/status/1082413696075382785)) + +
    + +[Something to add? File an issue](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/issues/new). diff --git a/docs/basic/getting-started/class-components.md b/docs/basic/getting-started/class-components.md index 1ba09abb..ff939567 100644 --- a/docs/basic/getting-started/class-components.md +++ b/docs/basic/getting-started/class-components.md @@ -107,3 +107,67 @@ class App extends React.Component<{ [View in the TypeScript Playground](https://www.typescriptlang.org/play/?jsx=2#code/JYWwDg9gTgLgBAJQKYEMDG8BmUIjgcilQ3wFgAoCtAGxQGc64BBMMOJADxiQDsATRsnQwAdAGFckHrxgAeAN4U4cEEgYoA5kgBccOjCjAeGgNwUAvgD44i8sshHuUXTwCuIAEZIoJuAHo-OGpgAGskOBgAC2A6JTg0SQhpHhgAEWA+AFkIVxSACgBKGzjlKJiRBxTvOABeOABmMzs4cziifm9C4ublIhhXKB44PJLlOFk+YAA3S1GxmzK6CpwwJdV1LXM4FH4F6KXKp1aesdk-SZnRgqblY-MgA) [Something to add? File an issue](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/issues/new). + +## Typing getDerivedStateFromProps + +Before you start using `getDerivedStateFromProps`, please go through the [documentation](https://reactjs.org/docs/react-component.html#static-getderivedstatefromprops) and [You Probably Don't Need Derived State](https://reactjs.org/blog/2018/06/07/you-probably-dont-need-derived-state.html). Derived State can be implemented using hooks which can also help set up memoization. + +Here are a few ways in which you can annotate `getDerivedStateFromProps` + +1. If you have explicitly typed your derived state and want to make sure that the return value from `getDerivedStateFromProps` conforms to it. + +```tsx +class Comp extends React.Component { + static getDerivedStateFromProps( + props: Props, + state: State + ): Partial | null { + // + } +} +``` + +2. When you want the function's return value to determine your state. + +```tsx +class Comp extends React.Component< + Props, + ReturnType +> { + static getDerivedStateFromProps(props: Props) {} +} +``` + +3. When you want derived state with other state fields and memoization + +```tsx +type CustomValue = any; +interface Props { + propA: CustomValue; +} +interface DefinedState { + otherStateField: string; +} +type State = DefinedState & ReturnType; +function transformPropsToState(props: Props) { + return { + savedPropA: props.propA, // save for memoization + derivedState: props.propA, + }; +} +class Comp extends React.PureComponent { + constructor(props: Props) { + super(props); + this.state = { + otherStateField: "123", + ...transformPropsToState(props), + }; + } + static getDerivedStateFromProps(props: Props, state: State) { + if (isEqual(props.propA, state.savedPropA)) return null; + return transformPropsToState(props); + } +} +``` + +[View in the TypeScript Playground](https://www.typescriptlang.org/play/?jsx=2#code/JYWwDg9gTgLgBAJQKYEMDG8BmUIjgcilQ3wFgAoUSWOYAZwFEBHAVxQBs5tcD2IATFHQAWAOnpJWHMuQowAnmCRwAwizoxcANQ4tlAXjgoAdvIDcFYMZhIomdMoAKOMHTgBvCnDhgXAQQAuVXVNEB12PQtyAF9La1t7NGUAESRMKyR+AGUYFBsPLzgIGGFbHLykADFgJHZ+II0oKwBzKNjyBSU4cvzDVPTjTJ7lADJEJBgWKGMAFUUkAB5OpAhMOBgoEzpMaBBnCFcZiGGAPijMFmMMYAhjdc3jbd39w+PcmwAKXwO6IJe6ACUBXI3iIk2mwO83joKAAbpkXoEfC46KJvmA-AAaOAAehxcBh8K40DgICQIAgwAAXnkbsZCt5+LZgPDsu8kEF0aj0X5CtE2hQ0OwhG4VLgwHAkAAPGzGfhuZDoGCiRxTJBi8C3JDWBb-bGnSFwNC3RosDDQL4ov4ooGeEFQugsJRQS0-AFRKHrYT0UQaCpwQx2z3eYqlKDDaq1epwABEAEYAEwAZhjmIZUNEmY2Wx2UD2KKOw1drgB6f5fMKfpgwDQcGaE1STVZEZw+Z+xd+cD1BPZQWGtvTwDWH3ozDY7A7aP82KrSF9cIR-gBQLBUzuxhY7HYHqhq4h2ceubbryLXPdFZiQA) diff --git a/docs/basic/getting-started/forms-and-events.md b/docs/basic/getting-started/forms-and-events.md index 97cacbc3..90526c63 100644 --- a/docs/basic/getting-started/forms-and-events.md +++ b/docs/basic/getting-started/forms-and-events.md @@ -3,13 +3,13 @@ id: forms_and_events title: Forms and Events --- -If performance is not an issue, inlining handlers is easiest as you can just use [type inference and contextual typing](https://www.typescriptlang.org/docs/handbook/type-inference.html#contextual-typing): +If performance is not an issue (and it usually isn't!), inlining handlers is easiest as you can just use [type inference and contextual typing](https://www.typescriptlang.org/docs/handbook/type-inference.html#contextual-typing): ```tsx const el = ( ; +} ``` +*Playground [here](https://www.typescriptlang.org/play?ssl=4&ssc=1&pln=12&pc=2#code/JYWwDg9gTgLgBAJQKYEMDG8BmUIjgcilQ3wFgAoCipAD0ljmADsYkpN0k4AFKUFKAE8AQgFcYMCE14QwAZzgBvCnDgAbFACMkagFxw5MPkwDmAbgoBfanWjw0Uwzz4gBI8ZKZwAvHAAUKnBgOPL6vPxCYhJSMvJwAGSIxDAAdFGeABIAKgCyADIAghJ8muJIcgA82fnpUgCiakggSCwAfBQAlD6tSoEA9H1wACYQcGiihrhwpdFMggYwopiYgUSLUF4VM55KKXvBsnKWPYoH8ika2mqWcBV921KtFuSWQA)* + You can also use Intersection Types to make reusable subsets of props for similar components: ```tsx From 8883edfd0688f5bbd63ff19589aad72e2d4d8c60 Mon Sep 17 00:00:00 2001 From: swyx Date: Mon, 22 Feb 2021 04:08:00 +0800 Subject: [PATCH 235/456] Update learn-ts.md --- docs/basic/troubleshooting/learn-ts.md | 1 + 1 file changed, 1 insertion(+) diff --git a/docs/basic/troubleshooting/learn-ts.md b/docs/basic/troubleshooting/learn-ts.md index cdd24fef..89cf12bb 100644 --- a/docs/basic/troubleshooting/learn-ts.md +++ b/docs/basic/troubleshooting/learn-ts.md @@ -14,6 +14,7 @@ It is worth mentioning some resources to help you get started: - Anders Hejlsberg's overview of TS: https://www.youtube.com/watch?v=ET4kT88JRXs - Marius Schultz: https://blog.mariusschulz.com/series/typescript-evolution with an [Egghead.io course](https://egghead.io/courses/advanced-static-types-in-typescript) - Basarat's Deep Dive: https://basarat.gitbook.io/typescript/ +- Axel Rauschmeyer's [Tackling TypeScript](https://exploringjs.com/tackling-ts/) - Rares Matei: [Egghead.io course](https://egghead.io/courses/practical-advanced-typescript)'s advanced TypeScript course on Egghead.io is great for newer typescript features and practical type logic applications (e.g. recursively making all properties of a type `readonly`) - Learn about [Generics, Conditional types and Mapped types](https://www.youtube.com/watch?v=PJjeHzvi_VQ&feature=youtu.be) - Shu Uesugi: [TypeScript for Beginner Programmers](https://ts.chibicode.com/) From 268e01ceb02536a86eb97aa4d12c547bfd4dd557 Mon Sep 17 00:00:00 2001 From: swyx Date: Mon, 22 Feb 2021 19:59:15 +0800 Subject: [PATCH 236/456] format --- docs/basic/troubleshooting/types.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/docs/basic/troubleshooting/types.md b/docs/basic/troubleshooting/types.md index 47cbd1cd..0b8af4ca 100644 --- a/docs/basic/troubleshooting/types.md +++ b/docs/basic/troubleshooting/types.md @@ -189,10 +189,10 @@ export const PrimaryButton = ( ) => { // do custom buttony stuff return ; -} +}; ``` -*Playground [here](https://www.typescriptlang.org/play?ssl=4&ssc=1&pln=12&pc=2#code/JYWwDg9gTgLgBAJQKYEMDG8BmUIjgcilQ3wFgAoCipAD0ljmADsYkpN0k4AFKUFKAE8AQgFcYMCE14QwAZzgBvCnDgAbFACMkagFxw5MPkwDmAbgoBfanWjw0Uwzz4gBI8ZKZwAvHAAUKnBgOPL6vPxCYhJSMvJwAGSIxDAAdFGeABIAKgCyADIAghJ8muJIcgA82fnpUgCiakggSCwAfBQAlD6tSoEA9H1wACYQcGiihrhwpdFMggYwopiYgUSLUF4VM55KKXvBsnKWPYoH8ika2mqWcBV921KtFuSWQA)* +_Playground [here](https://www.typescriptlang.org/play?ssl=4&ssc=1&pln=12&pc=2#code/JYWwDg9gTgLgBAJQKYEMDG8BmUIjgcilQ3wFgAoCipAD0ljmADsYkpN0k4AFKUFKAE8AQgFcYMCE14QwAZzgBvCnDgAbFACMkagFxw5MPkwDmAbgoBfanWjw0Uwzz4gBI8ZKZwAvHAAUKnBgOPL6vPxCYhJSMvJwAGSIxDAAdFGeABIAKgCyADIAghJ8muJIcgA82fnpUgCiakggSCwAfBQAlD6tSoEA9H1wACYQcGiihrhwpdFMggYwopiYgUSLUF4VM55KKXvBsnKWPYoH8ika2mqWcBV921KtFuSWQA)_ You can also use Intersection Types to make reusable subsets of props for similar components: From 275bfe637dbc0a300d11b0e96d1822df2e922808 Mon Sep 17 00:00:00 2001 From: David Lusby Date: Mon, 22 Feb 2021 20:47:41 +0000 Subject: [PATCH 237/456] docs: replace anchor with link to js-docs page (#392) --- docs/migration/index.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/migration/index.md b/docs/migration/index.md index 556852fd..77ccd599 100644 --- a/docs/migration/index.md +++ b/docs/migration/index.md @@ -15,7 +15,7 @@ Read [TypeScript's official Guide for migrating from JS](https://www.typescriptl ## General Conversion approaches - Level 0: Don't use TypeScript, use JSDoc - - See our [JSDoc section](#JSDoc) + - See our [JSDoc section](./js-docs.md) - Level 1A: Majority JavaScript, increasingly strict TypeScript - as recommended by [official TS guide](https://www.typescriptlang.org/docs/handbook/migrating-from-javascript.html) - use `allowJS` (Experiences: [clayallsop][clayallsop], [pleo][pleo]) From da572a1da639cf1805c55d7af13c0d6b5dfdc30a Mon Sep 17 00:00:00 2001 From: Zander Martineau Date: Wed, 10 Mar 2021 16:14:02 +0000 Subject: [PATCH 238/456] Add return type to Function Component example (#393) * Add return type to Function Component example * Update docs/basic/getting-started/function-components.md Co-authored-by: swyx --- docs/basic/getting-started/function-components.md | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/docs/basic/getting-started/function-components.md b/docs/basic/getting-started/function-components.md index ed8af665..291bc87a 100644 --- a/docs/basic/getting-started/function-components.md +++ b/docs/basic/getting-started/function-components.md @@ -7,7 +7,12 @@ These can be written as normal functions that take a `props` argument and return ```tsx type AppProps = { message: string }; /* could also use interface */ + +// Component const App = ({ message }: AppProps) =>
    {message}
    ; + +// you can also choose to annotate the return type +const App = ({ message }: AppProps): JSX.Element =>
    {message}
    ; ```
    From da87e5a60c4f7da6ef6ad6e97be079644b9046d5 Mon Sep 17 00:00:00 2001 From: swyx Date: Thu, 11 Mar 2021 00:14:25 +0800 Subject: [PATCH 239/456] format --- docs/basic/getting-started/function-components.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/basic/getting-started/function-components.md b/docs/basic/getting-started/function-components.md index 291bc87a..8f43792b 100644 --- a/docs/basic/getting-started/function-components.md +++ b/docs/basic/getting-started/function-components.md @@ -11,7 +11,7 @@ type AppProps = { message: string }; /* could also use interface */ // Component const App = ({ message }: AppProps) =>
    {message}
    ; -// you can also choose to annotate the return type +// you can also choose to annotate the return type const App = ({ message }: AppProps): JSX.Element =>
    {message}
    ; ``` From 988ebb25e4cdd36e0ad726c317a7e835a09450b8 Mon Sep 17 00:00:00 2001 From: swyx Date: Fri, 12 Mar 2021 00:56:56 +0800 Subject: [PATCH 240/456] Update function-components.md --- docs/basic/getting-started/function-components.md | 10 +++++++--- 1 file changed, 7 insertions(+), 3 deletions(-) diff --git a/docs/basic/getting-started/function-components.md b/docs/basic/getting-started/function-components.md index 8f43792b..2dd593e9 100644 --- a/docs/basic/getting-started/function-components.md +++ b/docs/basic/getting-started/function-components.md @@ -6,13 +6,17 @@ title: Function Components These can be written as normal functions that take a `props` argument and return a JSX element. ```tsx -type AppProps = { message: string }; /* could also use interface */ +// Declaring type of props - see "Typing Component Props" for more examples +type AppProps = { message: string }; /* use `interface` if exporting so that consumers can extend */ -// Component +// Easiest way to declare a Function Component; return type is inferred. const App = ({ message }: AppProps) =>
    {message}
    ; -// you can also choose to annotate the return type +// you can choose annotate the return type so an error is raised if you accidentally return some other type const App = ({ message }: AppProps): JSX.Element =>
    {message}
    ; + +// you can also inline the type declaration; eliminates naming the prop types, but looks repetitive +const App = ({ message }: { message: string }) =>
    {message}
    ; ```
    From 6f1d3b0a7eb719183240642f45562a59ce17680f Mon Sep 17 00:00:00 2001 From: eps1lon Date: Tue, 16 Mar 2021 08:35:16 +0100 Subject: [PATCH 241/456] chore: format --- docs/basic/getting-started/function-components.md | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/docs/basic/getting-started/function-components.md b/docs/basic/getting-started/function-components.md index 2dd593e9..efea33c1 100644 --- a/docs/basic/getting-started/function-components.md +++ b/docs/basic/getting-started/function-components.md @@ -7,7 +7,9 @@ These can be written as normal functions that take a `props` argument and return ```tsx // Declaring type of props - see "Typing Component Props" for more examples -type AppProps = { message: string }; /* use `interface` if exporting so that consumers can extend */ +type AppProps = { + message: string; +}; /* use `interface` if exporting so that consumers can extend */ // Easiest way to declare a Function Component; return type is inferred. const App = ({ message }: AppProps) =>
    {message}
    ; From b8b85989494d1baffba21cc0dcb56fb58a65d4cb Mon Sep 17 00:00:00 2001 From: maka Date: Tue, 16 Mar 2021 15:41:46 +0800 Subject: [PATCH 242/456] Fix a typo in hooks.md (#394) Co-authored-by: eps1lon --- docs/basic/getting-started/hooks.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/basic/getting-started/hooks.md b/docs/basic/getting-started/hooks.md index 1f4d7185..73c83e07 100644 --- a/docs/basic/getting-started/hooks.md +++ b/docs/basic/getting-started/hooks.md @@ -156,7 +156,7 @@ function MyComponent() {
    -The second option will infer a `RefObject` instead of a `MutableRefObject`. This means there will be a type error ifyou try to assign to `ref2.current`. +The second option will infer a `RefObject` instead of a `MutableRefObject`. This means there will be a type error if you try to assign to `ref2.current`. The third option will make `ref3.current` mutable, and is intended for "instance variables" that you manage yourself. From 0478cb9ff98bcf72d93a700dd39fdd76eb316aa1 Mon Sep 17 00:00:00 2001 From: Shirsh Zibbu Date: Wed, 17 Mar 2021 21:48:34 +0530 Subject: [PATCH 243/456] fix minor typo --- docs/basic/getting-started/default-props.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/basic/getting-started/default-props.md b/docs/basic/getting-started/default-props.md index e06a1923..76b96e6e 100644 --- a/docs/basic/getting-started/default-props.md +++ b/docs/basic/getting-started/default-props.md @@ -102,7 +102,7 @@ export type ApparentGreetProps = JSX.LibraryManagedAttributes< >; ``` -``This will work properly, although hovering over`ApparentGreetProps`may be a little intimidating. You can reduce this boilerplate with the`ComponentProps` utility detailed below. +This will work properly, although hovering over`ApparentGreetProps`may be a little intimidating. You can reduce this boilerplate with the`ComponentProps` utility detailed below.
    From 43bd48d7e123e0192cacdcee046aa3da5c36589c Mon Sep 17 00:00:00 2001 From: Sangsu Song Date: Fri, 26 Mar 2021 18:31:25 +0900 Subject: [PATCH 244/456] docs: Reduce whitespace (#398) --- docs/basic/getting-started/function-components.md | 6 +----- 1 file changed, 1 insertion(+), 5 deletions(-) diff --git a/docs/basic/getting-started/function-components.md b/docs/basic/getting-started/function-components.md index efea33c1..290efe91 100644 --- a/docs/basic/getting-started/function-components.md +++ b/docs/basic/getting-started/function-components.md @@ -53,11 +53,7 @@ const Title: React.FunctionComponent<{ title: string }> = ({ ```
    - - -Using `React.VoidFunctionComponent` or `React.VFC` instead - - +Using `React.VoidFunctionComponent` or `React.VFC` instead As of [@types/react 16.9.48](https://github.com/DefinitelyTyped/DefinitelyTyped/pull/46643), you can also use `React.VoidFunctionComponent` or `React.VFC` type if you want to type `children` explicitly. This is an interim solution until `FunctionComponent` will accept no children by default (planned for `@types/react@^18.0.0`). From f5550fc795a5139e9c773a0e01134de213b0dcd6 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" <41898282+github-actions[bot]@users.noreply.github.com> Date: Fri, 2 Apr 2021 14:21:24 +0000 Subject: [PATCH 245/456] Updated README on 2021-04-02T14:21:23.928Z --- README.md | 68 ++++++++++++++++++++++++------------------------------- 1 file changed, 29 insertions(+), 39 deletions(-) diff --git a/README.md b/README.md index 2a5a2d56..cb80c747 100644 --- a/README.md +++ b/README.md @@ -158,10 +158,10 @@ - [Using Partial Types](#using-partial-types) - [The Types I need weren't exported!](#the-types-i-need-werent-exported) - [The Types I need don't exist!](#the-types-i-need-dont-exist) - - [Slapping `any` on everything](#slapping-any-on-everything) - - [Autogenerate types](#autogenerate-types) - - [Typing Exported Hooks](#typing-exported-hooks) - - [Typing Exported Components](#typing-exported-components) + * [Slapping `any` on everything](#slapping-any-on-everything) + * [Autogenerate types](#autogenerate-types) + * [Typing Exported Hooks](#typing-exported-hooks) + * [Typing Exported Components](#typing-exported-components) - [Troubleshooting Handbook: Operators](#troubleshooting-handbook-operators) - [Troubleshooting Handbook: Utilties](#troubleshooting-handbook-utilities) - [Troubleshooting Handbook: tsconfig.json](#troubleshooting-handbook-tsconfigjson) @@ -177,7 +177,6 @@
    - # Section 1: Setup TypeScript with React ## Prerequisites @@ -255,14 +254,24 @@ You should also check [the new TypeScript docs for official descriptions between # Section 2: Getting Started - ## Function Components These can be written as normal functions that take a `props` argument and return a JSX element. ```tsx -type AppProps = { message: string }; /* could also use interface */ +// Declaring type of props - see "Typing Component Props" for more examples +type AppProps = { + message: string; +}; /* use `interface` if exporting so that consumers can extend */ + +// Easiest way to declare a Function Component; return type is inferred. const App = ({ message }: AppProps) =>
    {message}
    ; + +// you can choose annotate the return type so an error is raised if you accidentally return some other type +const App = ({ message }: AppProps): JSX.Element =>
    {message}
    ; + +// you can also inline the type declaration; eliminates naming the prop types, but looks repetitive +const App = ({ message }: { message: string }) =>
    {message}
    ; ```
    @@ -297,11 +306,7 @@ const Title: React.FunctionComponent<{ title: string }> = ({ ```
    - - -Using `React.VoidFunctionComponent` or `React.VFC` instead - - +Using `React.VoidFunctionComponent` or `React.VFC` instead As of [@types/react 16.9.48](https://github.com/DefinitelyTyped/DefinitelyTyped/pull/46643), you can also use `React.VoidFunctionComponent` or `React.VFC` type if you want to type `children` explicitly. This is an interim solution until `FunctionComponent` will accept no children by default (planned for `@types/react@^18.0.0`). @@ -377,7 +382,6 @@ const MyArrayComponent = () => (Array(5).fill(
    ) as any) as JSX.Element; - ## Hooks Hooks are [supported in `@types/react` from v16.8 up](https://github.com/DefinitelyTyped/DefinitelyTyped/blob/a05cc538a42243c632f054e42eab483ebf1560ab/types/react/index.d.ts#L800-L1031). @@ -533,7 +537,7 @@ function MyComponent() {
    -The second option will infer a `RefObject` instead of a `MutableRefObject`. This means there will be a type error ifyou try to assign to `ref2.current`. +The second option will infer a `RefObject` instead of a `MutableRefObject`. This means there will be a type error if you try to assign to `ref2.current`. The third option will make `ref3.current` mutable, and is intended for "instance variables" that you manage yourself. @@ -661,7 +665,6 @@ If you are writing a React Hooks library, don't forget that you should also expo - ## Class Components Within TypeScript, `React.Component` is a generic type (aka `React.Component`), so you want to provide it with (optional) prop and state type parameters: @@ -836,7 +839,6 @@ class Comp extends React.PureComponent { - ## You May Not Need `defaultProps` As per [this tweet](https://twitter.com/dan_abramov/status/1133878326358171650), defaultProps will eventually be deprecated. You can check the discussions here: @@ -936,7 +938,7 @@ export type ApparentGreetProps = JSX.LibraryManagedAttributes< >; ``` -``This will work properly, although hovering over`ApparentGreetProps`may be a little intimidating. You can reduce this boilerplate with the`ComponentProps` utility detailed below. +This will work properly, although hovering over`ApparentGreetProps`may be a little intimidating. You can reduce this boilerplate with the`ComponentProps` utility detailed below.
    @@ -1047,7 +1049,6 @@ The problem with this approach is it causes complex issues with the type inferen - ## Typing Component Props This is intended as a basic orientation and reference for React developers familiarizing with TypeScript. @@ -1279,7 +1280,6 @@ class Comp extends React.PureComponent { - ## Forms and Events If performance is not an issue (and it usually isn't!), inlining handlers is easiest as you can just use [type inference and contextual typing](https://www.typescriptlang.org/docs/handbook/type-inference.html#contextual-typing): @@ -1381,7 +1381,6 @@ Of course, if you're making any sort of significant form, [you should use Formik - ## Context ## Basic Example @@ -1664,7 +1663,6 @@ const Consumer = Context.Consumer; - ## forwardRef/createRef Check the [Hooks section](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/blob/master/README.md#hooks) for `useRef`. @@ -1727,7 +1725,6 @@ You may also wish to do [Conditional Rendering with `forwardRef`](https://github - ## Portals Using `ReactDOM.createPortal`: @@ -1837,7 +1834,6 @@ This example is based on the [Event Bubbling Through Portal](https://reactjs.org - ## Error Boundaries ### Option 1: Using react-error-boundary @@ -1892,7 +1888,6 @@ export default ErrorBoundary; - ## Concurrent React/React Suspense _Not written yet._ watch for more on React Suspense and Time Slicing. @@ -1902,7 +1897,6 @@ _Not written yet._ watch for more o - # Troubleshooting Handbook: Types > ⚠️ Have you read [the TypeScript FAQ](https://github.com/microsoft/TypeScript/wiki/FAQ?) Your answer might be there! @@ -2082,14 +2076,19 @@ In future you can use the `unique` keyword to brand. [See this PR](https://githu Adding two types together can be handy, for example when your component is supposed to mirror the props of a native component like a `button`: ```tsx -export interface Props { +export interface PrimaryButtonProps { label: string; } export const PrimaryButton = ( - props: Props & React.HTMLProps // adding my Props together with the @types/react button provided props -) => ; +}; ``` +_Playground [here](https://www.typescriptlang.org/play?ssl=4&ssc=1&pln=12&pc=2#code/JYWwDg9gTgLgBAJQKYEMDG8BmUIjgcilQ3wFgAoCipAD0ljmADsYkpN0k4AFKUFKAE8AQgFcYMCE14QwAZzgBvCnDgAbFACMkagFxw5MPkwDmAbgoBfanWjw0Uwzz4gBI8ZKZwAvHAAUKnBgOPL6vPxCYhJSMvJwAGSIxDAAdFGeABIAKgCyADIAghJ8muJIcgA82fnpUgCiakggSCwAfBQAlD6tSoEA9H1wACYQcGiihrhwpdFMggYwopiYgUSLUF4VM55KKXvBsnKWPYoH8ika2mqWcBV921KtFuSWQA)_ + You can also use Intersection Types to make reusable subsets of props for similar components: ```tsx @@ -2443,7 +2442,6 @@ For more information on creating type definitions for class components, you can - # Troubleshooting Handbook: Operators - `typeof` and `instanceof`: type query used for refinement @@ -2467,7 +2465,6 @@ Conditional Types are a difficult topic to get around so here are some extra res - # Troubleshooting Handbook: Utilities These are all built in, [see source in es5.d.ts](https://github.com/microsoft/TypeScript/blob/2c458c0d1ccb96442bca9ce43aa987fb0becf8a9/src/lib/es5.d.ts#L1401-L1474): @@ -2489,7 +2486,6 @@ These are all built in, [see source in es5.d.ts](https://github.com/microsoft/Ty - # Troubleshooting Handbook: tsconfig.json You can find [all the Compiler options in the TypeScript docs](https://www.typescriptlang.org/docs/handbook/compiler-options.html). [The new TS docs also has per-flag annotations of what each does](https://www.typescriptlang.org/tsconfig#allowSyntheticDefaultImports). This is the setup I roll with for APPS (not libraries - for libraries you may wish to see the settings we use in `tsdx`): @@ -2541,7 +2537,6 @@ Compilation speed grows linearly with size of codebase. For large projects, you - # Troubleshooting Handbook: Fixing bugs in official typings If you run into bugs with your library's official typings, you can copy them locally and tell TypeScript to use your local version using the "paths" field. In your `tsconfig.json`: @@ -2608,7 +2603,6 @@ You can see examples of these included in the built in type declarations in the - # Time to Really Learn TypeScript Believe it or not, we have only barely introduced TypeScript here in this cheatsheet. If you are still facing TypeScript troubleshooting issues, it is likely that your understanding of TS is still too superficial. @@ -2621,6 +2615,7 @@ It is worth mentioning some resources to help you get started: - Anders Hejlsberg's overview of TS: https://www.youtube.com/watch?v=ET4kT88JRXs - Marius Schultz: https://blog.mariusschulz.com/series/typescript-evolution with an [Egghead.io course](https://egghead.io/courses/advanced-static-types-in-typescript) - Basarat's Deep Dive: https://basarat.gitbook.io/typescript/ +- Axel Rauschmeyer's [Tackling TypeScript](https://exploringjs.com/tackling-ts/) - Rares Matei: [Egghead.io course](https://egghead.io/courses/practical-advanced-typescript)'s advanced TypeScript course on Egghead.io is great for newer typescript features and practical type logic applications (e.g. recursively making all properties of a type `readonly`) - Learn about [Generics, Conditional types and Mapped types](https://www.youtube.com/watch?v=PJjeHzvi_VQ&feature=youtu.be) - Shu Uesugi: [TypeScript for Beginner Programmers](https://ts.chibicode.com/) @@ -2629,7 +2624,6 @@ It is worth mentioning some resources to help you get started: - # Other React + TypeScript resources - me! @@ -2663,7 +2657,6 @@ It is worth mentioning some resources to help you get started: - # Editor Tooling and Integration - VSCode @@ -2688,7 +2681,6 @@ You may also wish to use alternative logos - [jsx-tsx-logos](https://github.com/ - # Linting > ⚠️Note that [TSLint is now in maintenance and you should try to use ESLint instead](https://medium.com/palantir/tslint-in-2019-1a144c2317a9). If you are interested in TSLint tips, please check this PR from [@azdanov](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/pull/14). The rest of this section just focuses on ESLint. [You can convert TSlint to ESlint with this tool](https://github.com/typescript-eslint/tslint-to-eslint-config). @@ -2819,7 +2811,6 @@ If you're looking for information on Prettier, check out the [Prettier](https:// - # Recommended React + TypeScript talks - [Ultimate React Component Patterns with TypeScript](https://www.youtube.com/watch?v=_PBQ3if6Fmg), by Martin Hochel, GeeCon Prague 2018 @@ -2828,7 +2819,6 @@ If you're looking for information on Prettier, check out the [Prettier](https:// - # Time to Really Learn TypeScript Believe it or not, we have only barely introduced TypeScript here in this cheatsheet. If you are still facing TypeScript troubleshooting issues, it is likely that your understanding of TS is still too superficial. @@ -2841,6 +2831,7 @@ It is worth mentioning some resources to help you get started: - Anders Hejlsberg's overview of TS: https://www.youtube.com/watch?v=ET4kT88JRXs - Marius Schultz: https://blog.mariusschulz.com/series/typescript-evolution with an [Egghead.io course](https://egghead.io/courses/advanced-static-types-in-typescript) - Basarat's Deep Dive: https://basarat.gitbook.io/typescript/ +- Axel Rauschmeyer's [Tackling TypeScript](https://exploringjs.com/tackling-ts/) - Rares Matei: [Egghead.io course](https://egghead.io/courses/practical-advanced-typescript)'s advanced TypeScript course on Egghead.io is great for newer typescript features and practical type logic applications (e.g. recursively making all properties of a type `readonly`) - Learn about [Generics, Conditional types and Mapped types](https://www.youtube.com/watch?v=PJjeHzvi_VQ&feature=youtu.be) - Shu Uesugi: [TypeScript for Beginner Programmers](https://ts.chibicode.com/) @@ -2849,7 +2840,6 @@ It is worth mentioning some resources to help you get started: - # Example App - [Create React App TypeScript Todo Example 2020](https://github.com/laststance/create-react-app-typescript-todo-example-2020) From 406b62b0265ed57c2efa5d69a9881c65ed9efb3f Mon Sep 17 00:00:00 2001 From: Denis LE Date: Sun, 4 Apr 2021 00:48:46 +0200 Subject: [PATCH 246/456] Fix missing parenthesis in troubleshooting types code example (#399) Co-authored-by: swyx --- docs/basic/troubleshooting/types.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/basic/troubleshooting/types.md b/docs/basic/troubleshooting/types.md index 0b8af4ca..e928d7bc 100644 --- a/docs/basic/troubleshooting/types.md +++ b/docs/basic/troubleshooting/types.md @@ -138,7 +138,7 @@ You can also assert a property is non-null, when accessing it: ```ts element.parentNode!.removeChild(element) // ! before the period -myFunction(document.getElementById(dialog.id!)! // ! after the property accessing +myFunction(document.getElementById(dialog.id!)!) // ! after the property accessing let userID!: string // definite assignment assertion... be careful! ``` From 0e2a0d9a038db491a0299110c072bee54069b7dd Mon Sep 17 00:00:00 2001 From: sw-yx Date: Sun, 4 Apr 2021 07:20:30 +0800 Subject: [PATCH 247/456] format --- README.md | 32 +++++++++++++++++++++++++---- docs/basic/troubleshooting/types.md | 6 +++--- 2 files changed, 31 insertions(+), 7 deletions(-) diff --git a/README.md b/README.md index cb80c747..a6056dca 100644 --- a/README.md +++ b/README.md @@ -158,10 +158,10 @@ - [Using Partial Types](#using-partial-types) - [The Types I need weren't exported!](#the-types-i-need-werent-exported) - [The Types I need don't exist!](#the-types-i-need-dont-exist) - * [Slapping `any` on everything](#slapping-any-on-everything) - * [Autogenerate types](#autogenerate-types) - * [Typing Exported Hooks](#typing-exported-hooks) - * [Typing Exported Components](#typing-exported-components) + - [Slapping `any` on everything](#slapping-any-on-everything) + - [Autogenerate types](#autogenerate-types) + - [Typing Exported Hooks](#typing-exported-hooks) + - [Typing Exported Components](#typing-exported-components) - [Troubleshooting Handbook: Operators](#troubleshooting-handbook-operators) - [Troubleshooting Handbook: Utilties](#troubleshooting-handbook-utilities) - [Troubleshooting Handbook: tsconfig.json](#troubleshooting-handbook-tsconfigjson) @@ -177,6 +177,7 @@ + # Section 1: Setup TypeScript with React ## Prerequisites @@ -254,6 +255,7 @@ You should also check [the new TypeScript docs for official descriptions between # Section 2: Getting Started + ## Function Components These can be written as normal functions that take a `props` argument and return a JSX element. @@ -382,6 +384,7 @@ const MyArrayComponent = () => (Array(5).fill(
    ) as any) as JSX.Element; + ## Hooks Hooks are [supported in `@types/react` from v16.8 up](https://github.com/DefinitelyTyped/DefinitelyTyped/blob/a05cc538a42243c632f054e42eab483ebf1560ab/types/react/index.d.ts#L800-L1031). @@ -665,6 +668,7 @@ If you are writing a React Hooks library, don't forget that you should also expo + ## Class Components Within TypeScript, `React.Component` is a generic type (aka `React.Component`), so you want to provide it with (optional) prop and state type parameters: @@ -839,6 +843,7 @@ class Comp extends React.PureComponent { + ## You May Not Need `defaultProps` As per [this tweet](https://twitter.com/dan_abramov/status/1133878326358171650), defaultProps will eventually be deprecated. You can check the discussions here: @@ -1049,6 +1054,7 @@ The problem with this approach is it causes complex issues with the type inferen + ## Typing Component Props This is intended as a basic orientation and reference for React developers familiarizing with TypeScript. @@ -1280,6 +1286,7 @@ class Comp extends React.PureComponent { + ## Forms and Events If performance is not an issue (and it usually isn't!), inlining handlers is easiest as you can just use [type inference and contextual typing](https://www.typescriptlang.org/docs/handbook/type-inference.html#contextual-typing): @@ -1381,6 +1388,7 @@ Of course, if you're making any sort of significant form, [you should use Formik + ## Context ## Basic Example @@ -1663,6 +1671,7 @@ const Consumer = Context.Consumer; + ## forwardRef/createRef Check the [Hooks section](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/blob/master/README.md#hooks) for `useRef`. @@ -1725,6 +1734,7 @@ You may also wish to do [Conditional Rendering with `forwardRef`](https://github + ## Portals Using `ReactDOM.createPortal`: @@ -1834,6 +1844,7 @@ This example is based on the [Event Bubbling Through Portal](https://reactjs.org + ## Error Boundaries ### Option 1: Using react-error-boundary @@ -1888,6 +1899,7 @@ export default ErrorBoundary; + ## Concurrent React/React Suspense _Not written yet._ watch for more on React Suspense and Time Slicing. @@ -1897,6 +1909,7 @@ _Not written yet._ watch for more o + # Troubleshooting Handbook: Types > ⚠️ Have you read [the TypeScript FAQ](https://github.com/microsoft/TypeScript/wiki/FAQ?) Your answer might be there! @@ -2442,6 +2455,7 @@ For more information on creating type definitions for class components, you can + # Troubleshooting Handbook: Operators - `typeof` and `instanceof`: type query used for refinement @@ -2465,6 +2479,7 @@ Conditional Types are a difficult topic to get around so here are some extra res + # Troubleshooting Handbook: Utilities These are all built in, [see source in es5.d.ts](https://github.com/microsoft/TypeScript/blob/2c458c0d1ccb96442bca9ce43aa987fb0becf8a9/src/lib/es5.d.ts#L1401-L1474): @@ -2486,6 +2501,7 @@ These are all built in, [see source in es5.d.ts](https://github.com/microsoft/Ty + # Troubleshooting Handbook: tsconfig.json You can find [all the Compiler options in the TypeScript docs](https://www.typescriptlang.org/docs/handbook/compiler-options.html). [The new TS docs also has per-flag annotations of what each does](https://www.typescriptlang.org/tsconfig#allowSyntheticDefaultImports). This is the setup I roll with for APPS (not libraries - for libraries you may wish to see the settings we use in `tsdx`): @@ -2537,6 +2553,7 @@ Compilation speed grows linearly with size of codebase. For large projects, you + # Troubleshooting Handbook: Fixing bugs in official typings If you run into bugs with your library's official typings, you can copy them locally and tell TypeScript to use your local version using the "paths" field. In your `tsconfig.json`: @@ -2603,6 +2620,7 @@ You can see examples of these included in the built in type declarations in the + # Time to Really Learn TypeScript Believe it or not, we have only barely introduced TypeScript here in this cheatsheet. If you are still facing TypeScript troubleshooting issues, it is likely that your understanding of TS is still too superficial. @@ -2624,6 +2642,7 @@ It is worth mentioning some resources to help you get started: + # Other React + TypeScript resources - me! @@ -2657,6 +2676,7 @@ It is worth mentioning some resources to help you get started: + # Editor Tooling and Integration - VSCode @@ -2681,6 +2701,7 @@ You may also wish to use alternative logos - [jsx-tsx-logos](https://github.com/ + # Linting > ⚠️Note that [TSLint is now in maintenance and you should try to use ESLint instead](https://medium.com/palantir/tslint-in-2019-1a144c2317a9). If you are interested in TSLint tips, please check this PR from [@azdanov](https://github.com/typescript-cheatsheets/react-typescript-cheatsheet/pull/14). The rest of this section just focuses on ESLint. [You can convert TSlint to ESlint with this tool](https://github.com/typescript-eslint/tslint-to-eslint-config). @@ -2811,6 +2832,7 @@ If you're looking for information on Prettier, check out the [Prettier](https:// + # Recommended React + TypeScript talks - [Ultimate React Component Patterns with TypeScript](https://www.youtube.com/watch?v=_PBQ3if6Fmg), by Martin Hochel, GeeCon Prague 2018 @@ -2819,6 +2841,7 @@ If you're looking for information on Prettier, check out the [Prettier](https:// + # Time to Really Learn TypeScript Believe it or not, we have only barely introduced TypeScript here in this cheatsheet. If you are still facing TypeScript troubleshooting issues, it is likely that your understanding of TS is still too superficial. @@ -2840,6 +2863,7 @@ It is worth mentioning some resources to help you get started: + # Example App - [Create React App TypeScript Todo Example 2020](https://github.com/laststance/create-react-app-typescript-todo-example-2020) diff --git a/docs/basic/troubleshooting/types.md b/docs/basic/troubleshooting/types.md index e928d7bc..f46da4c9 100644 --- a/docs/basic/troubleshooting/types.md +++ b/docs/basic/troubleshooting/types.md @@ -137,9 +137,9 @@ Note that you cannot assert your way to anything - basically it is only for refi You can also assert a property is non-null, when accessing it: ```ts -element.parentNode!.removeChild(element) // ! before the period -myFunction(document.getElementById(dialog.id!)!) // ! after the property accessing -let userID!: string // definite assignment assertion... be careful! +element.parentNode!.removeChild(element); // ! before the period +myFunction(document.getElementById(dialog.id!)!); // ! after the property accessing +let userID!: string; // definite assignment assertion... be careful! ``` Of course, try to actually handle the null case instead of asserting :) From e60954732ff6db83f95be0667a5cdcb20adb6fe1 Mon Sep 17 00:00:00 2001 From: Sebastian Silbermann Date: Mon, 5 Apr 2021 19:22:26 +0200 Subject: [PATCH 248/456] minor improvements to "adding non-standard attributes" (#400) --- docs/advanced/types-react-ap.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/docs/advanced/types-react-ap.md b/docs/advanced/types-react-ap.md index 6ac5dd29..30a98d6d 100644 --- a/docs/advanced/types-react-ap.md +++ b/docs/advanced/types-react-ap.md @@ -130,9 +130,9 @@ Anything not listed above is considered an internal type and not public. If you' ### Adding non-standard attributes The attributes allowed on host components such as `button` or `img` follow the -HTML living standard. New features that are not yet part of specification +[HTML living standard](https://html.spec.whatwg.org/). New features that are not yet part of the living standard or are only implemented by certain browsers will therefore cause a type error. If -you specifically write code for these browsers or polyfill this attributes you can +you specifically write code for these browsers or polyfill these attributes you can use [module augmentation](https://www.typescriptlang.org/docs/handbook/declaration-merging.html#module-augmentation) to still get those components type checked without having to use `any` or `@ts-ignore`. From e606e038531d7fd9bbb635a746ef8dde73780a15 Mon Sep 17 00:00:00 2001 From: Lars <32460418+advename@users.noreply.github.com> Date: Thu, 15 Apr 2021 01:50:25 +0200 Subject: [PATCH 249/456] Added event types and their descriptions (#402) * Added form types and their descriptions I was looking for a complete list of form types and couldn't find any anywhere. I went through the source code and extracted these with adding some description to them, either using MDN's description or some other website explanation. * Apply suggestions from code review Co-authored-by: swyx --- .../basic/getting-started/forms-and-events.md | 39 +++++++++++++++++++ 1 file changed, 39 insertions(+) diff --git a/docs/basic/getting-started/forms-and-events.md b/docs/basic/getting-started/forms-and-events.md index 90526c63..023b0604 100644 --- a/docs/basic/getting-started/forms-and-events.md +++ b/docs/basic/getting-started/forms-and-events.md @@ -98,3 +98,42 @@ If you don't quite care about the type of the event, you can just use React.Synt [View in the TypeScript Playground](https://www.typescriptlang.org/play/?jsx=2#code/JYWwDg9gTgLgBAJQKYEMDG8BmUIjgcilQ3wFgAoCtCAOwGctoRlM4BeRYmAOgFc6kLABQBKClVoM4AMSbs4o9gD4FFOHAA8mJmrhFMbAN7aozJJgC+u2gGVeAIxDAYRoUgBcndDxsBPGjAAFkgwwGgAogBuSAEiynCGuupI3GBE0QEAIuYovAA2MKIA3Elw1PTwMChQAOYh8ilVtfUodHAwvmBIEKyN1XXwAGQJpckgKMB5noZwkSh5vB5wDFDANDVwFiXk6rtwYK10AO7QACbTs-OLnitrG1ulDzu75VJI45PyTQPc7xN53DmCyQRTgAHowe1Okg0ME0ABrOgAQlKr3gBzoxzOX36IVShxOUFOgKuIPBkI6XVhMMRKOe6ghcBCaG4rN0Fis5CUug0p2AkW59M0eRQ9iQeUFe3U4Q+U1GmjWYF4lWhbAARH9Jmq4DQUCAkOrNXltWDJbsNGCRWKJTywXyBTz7Wb1BoreLnbsAAoEs7ueUaRXKqFddUYrFE7W6-Whn0R8Eei1um3PC1Ox38hOBlUhtV0BxOGDaoGLdUAGQgGzWJrNqYzFAtJhAgpEQA) Of course, if you're making any sort of significant form, [you should use Formik](https://jaredpalmer.com/formik) or [React Hook Form](https://react-hook-form.com/), which are written in TypeScript. + +### List of event types + + +| Event Type | Description | +| ---------------- | ----------------------------------------------------------------------------------------------------------------------------- | +| AnimationEvent | CSS Animations. | +| ChangeEvent | Changing the value of ``, `