docs/snippets/react/your-component.ts.mdx
```ts
// YourComponent.stories.ts|tsx
import React from 'react';
import { ComponentStory, ComponentMeta } from '@storybook/react';
import { YourComponent } from './YourComponent';
//π This default export determines where your story goes in the story list
export default {
/* π The title prop is optional.
* See https://storybook.js.org/docs/react/configure/overview#configure-story-loading
* to learn how to generate automatic titles
*/
title: 'YourComponent',
component: YourComponent,
} as ComponentMeta<typeof YourComponent>;
//π We create a βtemplateβ of how args map to rendering
const Template: ComponentStory<typeof YourComponent> = (args) => <YourComponent {...args} />;
export const FirstStory = Template.bind({});
FirstStory.args = {
/*π The args you need here will depend on your component */
};
```