react-radio: add migration guide#22719
Conversation
Adds a migration guide from v8 ChoiceGroup to v9 RadioGroup. This migration guide provides two examples plus prop tables that show how props from v8 map to v9 props and/or concepts like slots.
|
This pull request is automatically built and testable in CodeSandbox. To see build info of the built libraries, click here or the icon next to each commit SHA. Latest deployment of this branch, based on commit dd2d7d4:
|
📊 Bundle size report🤖 This report was generated against faf92d23bc6c2e21f1769e5ce210e17c7ebc9587 |
Asset size changesSize Auditor did not detect a change in bundle size for any component! Baseline commit: faf92d23bc6c2e21f1769e5ce210e17c7ebc9587 (build) |
|
|
||
| This table maps v8 `ChoiceGroup` props to the v9 `RadioGroup` equivalent. | ||
|
|
||
| | Purpose | v8 | v9 | Details | |
There was a problem hiding this comment.
Consider combining the v9 column and the details column to more concisely describe the replacement. (When we did the documentation scrub, Levi asked us to make the documentation as minimal as possible to convey understanding without re-documenting things. For example, re-documenting that in v9 className should be populated with style from Griffel wouldn't be called out everywhere we mention className).
There was a problem hiding this comment.
I like this. It wasn't too much to write here and since I don't see it changing I wasn't worried about it but less is definitely preferable.
There was a problem hiding this comment.
I ending up dropping the purpose column and changing "details" to "notes". I like the visual separation keeping this last column gives the props from any supporting info.
| Pick One | ||
| </Label> | ||
| <RadioGroup aria-labelledby={labelId} defaultValue="B"> | ||
| <Radio value="A" label="A" /> |
There was a problem hiding this comment.
A small nitpick, but if the v8 option has text: 'Option A', then the equivalent v9 <Radio> should have label="Option A" too
There was a problem hiding this comment.
Additionally, since the v8 example uses required, I think the v9 radio example should probably set it too.
|
|
||
| This table maps v8 `IChoiceGroupOption` props to the v9 `Radio` equivalent. | ||
|
|
||
| | v8 | v9 | Notes | |
There was a problem hiding this comment.
This table is missing native HTML props like required, checked, and name. It's also missing some other props like focused, hasImage, etc. Were these left intentionally, or referenced somewhere else?
|
|
||
| This table maps v8 `ChoiceGroup` props to the v9 `RadioGroup` equivalent. | ||
|
|
||
| | v8 | v9 | Notes | |
There was a problem hiding this comment.
The parent ChoiceGroup props extends React.InputHTMLAttributes<HTMLElement | HTMLInputElement>, which means it previously supported setting required or disabled directly on the <ChoiceGroup> wrapper. Is it worth calling out here that those should now be set directly on the <Radio> components?
* react-radio: add v8 to v9 migration guide Adds a migration guide from v8 ChoiceGroup to v9 RadioGroup. This migration guide provides two examples plus prop tables that show how props from v8 map to v9 props and/or concepts like slots. * react-radio: update v8->v9 migration guide based on feedback. * react-radio: minor v8->v9 migration guide updates * react-radio: add v0->v9 migration guide
7 participants
Current Behavior
No migration guide from v8/v0 to v9 for Radio/RadioGroup.
New Behavior
Migration guide from v8/v0 to Radio/RadioGroup
Related Issue(s)
Fixes #22678