Addon-controls: Custom sort function

👋 great stuff! huge fan. love the automatic-ness of the new features in v6, especially with typescript. it’s the documentalist’s dream!

Is your feature request related to a problem? Please describe. I use Storybook with React and Typescript. The ordering of props in the ArgsTable seems somewhat based on declaration in the interface with a healthy does of “why are you here.” This is quite confusing for a long list of props.

I would like to sort them all alphabetically, but I can’t seem to find an option to do this.

Describe the solution you’d like

// preview.js
export const parameters = {
  controls: { alphabetize: true },
};

just like https://storybook.js.org/docs/react/essentials/controls#show-full-documentation-for-each-property

Describe alternatives you’ve considered I’ve looked through all the docs and react-docgen-typescript and can’t find anything to control the actual ordering of the controls.

Are you able to assist bring the feature to reality? yes, with guidance / directions in the codebase.

Additional context current state of things (this isn’t even the full list):

[astorije]

Hey stale bot, I think this would still be very valuable! Especially when using auto-generated controls: when doing so, manually configuring some controls will always position these at the top, even if the configuration is simply to disable the controls, so all auto-generated controls we disabled appear at the top.

[stale[bot]]

Hi everyone! Seems like there hasn’t been much going on in this issue lately. If there are still questions, comments, or bugs, please feel free to continue the discussion. Unfortunately, we don’t have time to get to every issue. We are always open to contributions so please send us a pull request if you would like to help. Inactive issues will be closed after 30 days. Thanks!