react-components docs: Controls

[PeterDraex]

We use Storybook Controls in react-components documentation to provide a playground for the component and an API reference table. These are automatically generated.

In proposed Button documentation (#19298), it has the following issues:

• Default values are not generated for some components (e.g. Button) storybook: @default is ignored for story doc table rendering since 6.3 #19292
• Some props are missing from controls - for example disabled in Button
• Props specific to the component are mixed together with general props - like as and className
• It’s not clear from the automatically generated type what it actually contains - for example icon in Button
• No UI is provided for setting ShorthandProps (icon on Button) - the user has to write an object by hand
• "Set boolean" / "Set string" /... buttons are impractical, because a) You need to click a button button before true/false radio buttons are shown. b) There’s no way to go back to the default value.

Playground of Base Web library can serve as an inspiration.

[Hotell]

Default values are not generated for some components (e.g. Button) storybook: @default is ignored for story doc table rendering since 6.3 #19292

temporarily fixed by #19321

[Hotell]

Some props are missing from controls - for example disabled in Button

props from whole inheritance chain are omitted on purpose - if particular native props really need to be rendered in our arg docs you'll need to add them to component Prop interface

[Hotell]

• It’s not clear from the automatically generated type what it actually contains - for example icon in Button
• No UI is provided for setting ShorthandProps (icon on Button) - the user has to write an object by hand

for those complex scenarios we will need to adopt customized controls -https://storybook.js.org/docs/react/essentials/controls#fully-custom-args

It would be nice to bring this issues up in front of bigger quorum so we can come to agreement which approach we'd like to adopt

[PeterDraex]

Some props are missing from controls - for example disabled in Button

props from whole inheritance chain are omitted on purpose - if particular native props really need to be rendered in our arg docs you'll need to add them to component Prop interface

disabled is a part of Prop interface, but still isn't being rendered

[Hotell]

Some props are missing from controls - for example disabled in Button

props from whole inheritance chain are omitted on purpose - if particular native props really need to be rendered in our arg docs you'll need to add them to component Prop interface

'disabled' is part of Prop interface, but still isn't being rendered

you should try latest master - if that's still a case, I'd be nice to do proper research if that's known issue on storybook repo and document it within our repo. ty!

[msft-fluent-ui-bot]

Because this issue has not had activity for over 180 days, we're automatically closing it for house-keeping purposes.

Still require assistance? Please, create a new issue with up-to date details.