Skip to content

Conversation

@eps1lon
Copy link
Collaborator

@eps1lon eps1lon commented Apr 7, 2022

Allows restoring implicit children like we had with React 17. This should ease migration pain.

import * as React from 'react'

// include once via `tsconfig.json`
declare module 'react' {
    export interface ComponentTypeBaseProps {
        children?: React.ReactNode;
    }
}

// implicit children are back in every file!
const Component: React.FC = ({children}) => {
    return <div>Implicit children! {children}</div>
}

Playground Link

This also allows implicit children for React.forwardRef which was frequently requested ( #32785, #48420, #52604, #50436, #33602).

Need to test locally first. I don't think we can add automated tests since module augmentation is permanent.

* To restore that behavior you can augment `ComponentTypeBaseProps` with `children`:
* @link https://www.typescriptlang.org/play?#code/JYWwDg9gTgLgBAKjgQwM5wEoFNkGN4BmUEIcA5FDvmQFA0AmWuANspXCBPQK7NbmU8MMnADeNOJLhYAHpFhxgAOxhYoBPPwDCJSEqwqAKgE8wWAEJosABWJh04qU7i4AFsGb1KSgPwAuTCoYADpsIQA5LiwAbgkpAF8aRJpcCCVUeB1wNIMYALD8YIAxLTgAXjgAClE3Dy8DeIBKcoA+MTjJShhuKCU4AB56YAA3FoBJcGZgXGB4Ws9vAEIxefqleP6AeiHRpKA
*/
interface ComponentTypeBaseProps {}
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
interface ComponentTypeBaseProps {}
interface ComponentTypeCommonProps {}

@eps1lon eps1lon force-pushed the feat/react/baseprops-module-augmentation branch from 9363284 to 31771ff Compare April 9, 2022 08:14
@eps1lon eps1lon force-pushed the feat/react/baseprops-module-augmentation branch from 31771ff to d3875bd Compare April 9, 2022 17:59
htbkoo added a commit to htbkoo/personal-portfolio that referenced this pull request Apr 13, 2022
…owngrade `@types/react` and `@types/react-dom` back to `v17.x.x` because of the breaking changes in version 18 that could not be fixed until either material-ui is upgraded to v5 or this PR (DefinitelyTyped/DefinitelyTyped#59751) is merged

Note this codemod (https://github.com/eps1lon/types-react-codemod) would not help because the errors are caused by library (see this facebook/react#24304 (comment) for the details)

References:
1. https://stackoverflow.com/questions/71810438/compilation-issue-with-react-typescript-and-material-ui-4
2. DefinitelyTyped/DefinitelyTyped#56210 (comment)
3. facebook/react#24304 (comment)
4. https://classic.yarnpkg.com/lang/en/docs/selective-version-resolutions/
5. facebook/react#24304 (comment)
@eps1lon
Copy link
Collaborator Author

eps1lon commented Jun 16, 2022

This won't work since it disables excess prop checking.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant