Describe the bug
When I set the parameter for controls to disabled, the Controls tab disappears, but controls are still present on the docsPage.
To Reproduce
Steps to reproduce the behavior:
*.stories.js file (maybe MDX too, but I have only verified this on *.stories.js), set the export default as such:export default {
title: 'Components/MyNiceComponent',
component: MyNiceComponent,
parameters: {
controls: {
disabled: true,
}
}
}
MyGreatComponentControls tab is no longer visible.Docs tab.Expected behavior
When I disable controls for a component, I expect both the controls tab to disappear AND the controls column on the docsPage to disappear, as well.
System:
System:
OS: macOS 10.15.6
CPU: (8) x64 Intel(R) Core(TM) i7-8569U CPU @ 2.80GHz
Binaries:
Node: 12.18.3 - /usr/local/bin/node
Yarn: 1.22.4 - /usr/local/bin/yarn
npm: 6.14.6 - /usr/local/bin/npm
Browsers:
Chrome: 85.0.4183.83
Firefox: 80.0
Safari: 13.1.2
How to completely hide control for prop from Controls pane?
How can we hide a property from the controls page?
disabling a single row foo from showing up in the table:
export default {
title: ...,
component: ...,
argTypes: {
foo: { table: { disable: true } }
},
}
cc @jonniebigodes
How to disable controls for a story in MDX?
For a component:
<Meta
title=...
component={...}
argTypes={{
foo: { table: { disable: true } }
}}
/>
For a story:
<Story
name=...
argTypes={{
foo: { table: { disable: true } }
}}
>
...
</Story>
Is it possible to do the opposite? I mean, I set the controls to hide by default and then enable what I want to see?
In MDX the ArgsTable block has an include prop that does what you want. But not for the other use case unfortunately @FilipMessa
An addition to this, is there a way to disable the controls, but still have them shown? I have a boolean I always want to be true in a curtain state and I want to show its supposed to be true when displaying this component.
Most helpful comment
disabling a single row
foofrom showing up in the table:cc @jonniebigodes