Storybook: [addon-docs mdx] Props: include option (to not get overwhelmingly large prop tables)

[kasperpihl]

Is your feature request related to a problem? Please describe.
When I use Typescript and export a component and it extends the standard props of fx HTMLButtonElement, the prop table gets populated with ALL the props that a button can take (I mainly just want the ones I explicitly extend with. Quick example/reproduction

Button.tsx

import React, { DetailedHTMLProps, ButtonHTMLAttributes } from 'react'

export interface ButtonProps
  extends DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement> {
  kind: 'primary' | 'secondary',
  size: 'small' | 'large'
}

export function Button({ kind, size, ...buttonProps }: ButtonProps) {
  return (
    <button {...buttonProps}/>
  )
}

Button.stories.mdx

import { Meta, Props } from '@storybook/addon-docs/blocks'
import { Button } from './Button'

<Meta title="Button" component={Button} />

Props

<Props of={Button} />

Describe the solution you'd like
I'd like an include prop for the Props component so I can do this

<Props include=['kind', 'size'] of={Button} />

Describe alternatives you've considered
A "Show all props" button on the PropsTable, and then only show the first 5 fx with an option to tweak that number.

Are you able to assist bring the feature to reality?
yes, I can help with a PR, if assisted on where I should start
I've made an implementation of the include already, see
https://github.com/storybookjs/storybook/compare/next...kasperpihl:props-include?expand=1

Additional context
Add any other context or screenshots about the feature request here.

*EDIT: Fixing code mistakes *

[beckerei]

It's ugly but you can filter these props by specifying loader options like

{
  loader: require.resolve('react-docgen-typescript-loader'),
  options: {
    propFilter: prop => {
      if (prop.parent == null) {
        return true;
      }
      // Filter out props which type definition is placed in react package
       return (prop.parent.fileName.indexOf('node_modules/@types/react') < 0);
    },
  },
},

[kasperpihl]

Super hacky, but it did the job @beckerei.
Thanks a lot for the creative solution 🙌

[shilman]

It's a reasonable request!

There's also this PR which should help a lot: https://github.com/storybookjs/storybook/pull/9110