For example i have some working select component. It's displays fine in Canvas tab of storybook but in Docs tab it's doesn't display the options

// some-select-component.stories.tsx

const options = [
    {
        id: 1,
        name: 'option 1',
    },
    {
        id: 2,
        name: 'option 2',
    },
    {
        id: 3,
        name: 'option 3',
    },
];

const Template: ComponentStory<typeof SomeSelectComponent> = args => {
    const [formikValue, setFormikValue] = useState({});

    return (
        <Formik initialValues={{} as any} onSubmit={setFormikValue} >
            <SomeSelectComponent name='name'>
                {options.map((option => (
                    <Option
                        key={option.id}
                        value={option.name}
                    >
                        {option.name}
                    </Option>
                )))}
            </SomeSelectComponent >
        </Formik>
    )
}

export const SimpleSelect = Template.bind({});

// docs.mdx file 

<Story id='some-select-component--simple-select' />

how should i handle this case? didn't find this kind of issues