storybook
storybook copied to clipboard
[Bug]: sort in controls doesn't work
Describe the bug
The sort option is very limited (alpha
or requiredFirst
) and it would be nice to see more options (like alpha
and requiredFirst
or any custom sort funtion).
Anyways, even with only those 2 options, it doesn't seem to work (see reporoduction link) - unsorted order is maintained even when changing the sort option.
To Reproduce
https://stackblitz.com/edit/github-fjyc54?file=src%2Fstories%2FButton.stories.ts&preset=node
System
Storybook Environment Info:
System:
OS: Linux 5.0 undefined
CPU: (8) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz
Shell: 1.0 - /bin/jsh
Binaries:
Node: 18.18.0 - /usr/local/bin/node
Yarn: 1.22.19 - /usr/local/bin/yarn
npm: 9.4.2 - /usr/local/bin/npm <----- active
pnpm: 8.10.5 - /usr/local/bin/pnpm
npmPackages:
@storybook/addon-essentials: ^8.0.0-alpha.5 => 8.0.0-alpha.5
@storybook/addon-interactions: ^8.0.0-alpha.5 => 8.0.0-alpha.5
@storybook/addon-links: ^8.0.0-alpha.5 => 8.0.0-alpha.5
@storybook/addon-onboarding: ^1.0.10 => 1.0.10
@storybook/blocks: ^8.0.0-alpha.5 => 8.0.0-alpha.5
@storybook/react: ^8.0.0-alpha.5 => 8.0.0-alpha.5
@storybook/react-vite: ^8.0.0-alpha.5 => 8.0.0-alpha.5
@storybook/test: ^8.0.0-alpha.5 => 8.0.0-alpha.5
storybook: ^8.0.0-alpha.5 => 8.0.0-alpha.5
Additional context
No response
@herzaso thanks so much for raising this!
@JReinhold @jonniebigodes it looks like the 7.0 docs work made it so that controls sorting is determined by docs.controls.sort
. However, the docs still say it's controls.sort
I'm not sure if this is a bug in the code or in the documentation, but it should be an easy fix one way or the other. WDYT?
@shilman thanks for putting this on my radar, I'll check this and follow up with a pull request if it's a documentation issue and loop either you or @JReinhold for a follow-up.
This fix is working for me in Documentation, but not in the stories control table. Is that expected?
@herzaso thanks so much for raising this!
@JReinhold @jonniebigodes it looks like the 7.0 docs work made it so that controls sorting is determined by
docs.controls.sort
. However, the docs still say it'scontrols.sort
I'm not sure if this is a bug in the code or in the documentation, but it should be an easy fix one way or the other. WDYT?
This fix is working for me in Documentation, but not in the stories control table. Is that expected?
This makes sense @shilman, controls addon reads from parameters.controls.sort
while the Controls doc block reads from parameters.docs.controls.sort
. I don't think that makes sense, they should do the same thing. Is this a special case where we want the doc block to read from parameters.controls.sort ?? parameters.docs.controls.sort
, the latter only being an option for consistency with the other doc blocks? We could even deprecate/remove the latter to make the API less confusing.
@JReinhold I think we can use your suggestion as a short-term fix. Long term I'd actually like to go the other way where (1) every doc block has its own standalone addon (e.g. Source
addon replaces Storysource
and uses the doc block under the hood), and (2) the parameters are hoisted up so docs.source.x
=> source.x
. Because it feels like a needless extra level of nesting. WDYT? (Maybe we are saying the same thing if I parsed your comment correctly)
That sounds reasonable to me, move the parameters up one level for any block that is both an addon and a doc block.