Dashicon: refactor to TypeScript#45924
Conversation
|
|
| @@ -7,12 +7,23 @@ | |||
| */ | |||
| /** @typedef {import('react').ComponentPropsWithoutRef<'span'> & OwnProps} Props */ | |||
There was a problem hiding this comment.
These JSDocs can be removed as well, although we like to move the prop descriptions (e.g. "Icon name", "Size of the icon") to inline JSDocs in the types.ts file (example). This way we can see the descriptions in IntelliSense, docgens, etc.
There was a problem hiding this comment.
We can remove these @typedefs, now that the descriptions are moved to the types.ts file 👍
| /** | ||
| * @param {Props} props | ||
| * @return {JSX.Element} Element | ||
| */ |
There was a problem hiding this comment.
Looks like we can remove these JSDocs.
| size = 20, | ||
| style = {}, | ||
| ...extraProps | ||
| }: DashiconProps ) { |
There was a problem hiding this comment.
You don't have to go through the entire TS migration guide because Dashicon component is really simple and doesn't have any stories/tests. But it might help to see item vi of bullet point 7, where it describes how we use the WordPressComponentProps utility type for cases like this, instead of ComponentPropsWithoutRef.
You can see some usage examples in other components, for example:
So here that would look like:
| }: DashiconProps ) { | |
| }: WordPressComponentProps< DashiconProps, 'span', false > ) { |
|
Thanks, @mirka! |
| @@ -7,12 +7,23 @@ | |||
| */ | |||
| /** @typedef {import('react').ComponentPropsWithoutRef<'span'> & OwnProps} Props */ | |||
There was a problem hiding this comment.
We can remove these @typedefs, now that the descriptions are moved to the types.ts file 👍
|
@mirka |
mirka
left a comment
mirka
left a comment
There was a problem hiding this comment.
Nice, thanks again for contributing! 🚢
* Dashicon: refactor to TypeScript * chore: fix the type definision on the Dashicon component * chore: remove unuse typedef on the Dashicon component * chore: update the changelog on packages/components
2 participants
What?
Refactor the Dashicon component to TypeScript
Ref: #35744
Why?
To contribute to this issue: #35744
How?
Replace the
Dashiconcomponent file with tsx, and put the type definitionTesting Instructions