Addon-Docs：Custom Props table

Is your feature request related to a problem? Please describe. No

Describe the solution you’d like I can pass a parameter to control the props table,

• Pass a array to define which item should we display
• Can use custom item name, like I want to display Chinese th like ['姓名', '类型', '默认值','描述'] but not ['name', 'type', 'default', 'description']

So I want to display name, type, default, description when I pass a parameter

[
  {
    key: 'name',
    label: '姓名',
  },
  {
    key: 'type',
    label: '类型',
  },
  {
    key: 'default',
    label: '默认值',
  },
  {
    key: 'description',
    label: '描述',
  }
]

Are you able to assist bring the feature to reality?

https://github.com/storybookjs/storybook/blob/bf1b95564053aacc8d4b00479485beb655ef21b4/lib/components/src/blocks/PropsTable/PropsTable.tsx

Seems it really a feature need to add -_-, I really want to do contribution

[fgaleano]

Semi-documented here for 6.0 here: https://github.com/storybookjs/storybook/blob/next/addons/docs/docs/props-tables.md#customizing-argtypes

@shilman How can this customizations be applied to subcomponents used in story?

This works great for the main component’s props table, but when I have multiple subcomponents with their own props table, I can’t figure out how to configure those props tables. I’m talking about this:

export default {
    title: 'Header',
    component: Header,
    subcomponents: { 
        Navigation,
        NavigationItem, 
        SecondaryNav: null, 
        SecondaryNavItem: null, 
    },
    parameters: { docs: { description: { component: readme } } },
    args: {
        useSparkPanel: false,
    },
    argTypes: {
        useSparkPanel: {
            table: {
                disable: true
            }
        },
        children: {
            table: {
                type: { 
                    summary: 'instace of <Header.Nav>', 
                    detail: 'Expects instance of <Header.Nav> with collection of <Header.NavItem>.' 
                },
            },
            control: {
                type: null,
            },
        },
        secondaryNav: {
            table: {
                type: { 
                    summary: 'instace of <SecondaryNav>', 
                    detail: 'Expects instance of <Header.SecondaryNav> with collection of <Header.SecondaryNavItem>' 
                },
            },
            control: {
                type: null,
            },
        }
    }
};

I need to add some custom type values to some of those subcomponents. Can it be done with the current APIs available?

Thanks!

[shilman]

@Smolations good news. 6.0 props are super configurable, using a completely different mechanism. Will try to get your use case across when I write that part of the documentation.