playroom icon indicating copy to clipboard operation
playroom copied to clipboard

Props should be allowed to be sorted

Open bryce-larson opened this issue 4 years ago • 0 comments

Our components share a lot of props, so we follow best practices and try to extend interfaces where possible. In Playroom, we would like to display props in order of most importance, however the default order of props is currently the order of the given interface.

Add support for a sorting of props in the playroom config.

Ideas:

  • Allow support for a custom sorting function, this would need need access to the required prop from react-docgen-typescript.

  • Allow for a smart sorting option, in our case it would be required props, then optional props, then developer props, such as onXXXX(onClick, onFocus), id, data-XXXX, aria-XXXX, other dom props.

Adding a new option called propSortOrder that would except the following:

  • default - current implementation
  • required - required props followed by optional props, stable sort does not change order
  • requiredAlphabetical - required props followed by optional props, in alphabetical order
  • custom function - ({ componentName, propName, required }) => number, the number would determine the sort order for a given componentName, ties would be broken alphabetically

If you are interested, I could raise a PR.

bryce-larson avatar Jun 06 '20 06:06 bryce-larson