```ts filename="MyComponent.stories.ts" renderer="angular" language="ts" import type { Meta, StoryObj } from '@storybook/angular/'; import { MyComponent } from './MyComponent.component'; // More on default export: https://storybook.js.org/docs/writing-stories/#default-export const meta: Meta = { component: MyComponent, }; export default meta; type Story = StoryObj; export const Example: Story = { parameters: { design: { type: 'figma', url: 'https://www.figma.com/file/Sample-File', }, }, }; ``` ```js filename="MyComponent.stories.js|jsx" renderer="react" language="js" import { MyComponent } from './MyComponent'; // More on default export: https://storybook.js.org/docs/writing-stories/#default-export export default { component: MyComponent, }; export const Example = { parameters: { design: { type: 'figma', url: 'https://www.figma.com/file/Sample-File', }, }, }; ``` ```ts filename="MyComponent.stories.ts|tsx" renderer="react" language="ts-4-9" import type { Meta, StoryObj } from '@storybook/react'; import { MyComponent } from './MyComponent'; // More on default export: https://storybook.js.org/docs/writing-stories/#default-export const meta = { component: MyComponent, } satisfies Meta; export default meta; type Story = StoryObj; export const Example: Story = { parameters: { design: { type: 'figma', url: 'https://www.figma.com/file/Sample-File', }, }, }; ``` ```ts filename="MyComponent.stories.ts|tsx" renderer="react" language="ts" import type { Meta, StoryObj } from '@storybook/react'; import { MyComponent } from './MyComponent'; // More on default export: https://storybook.js.org/docs/writing-stories/#default-export const meta: Meta = { component: MyComponent, }; export default meta; type Story = StoryObj; export const Example: Story = { parameters: { design: { type: 'figma', url: 'https://www.figma.com/file/Sample-File', }, }, }; ``` ```js filename="MyComponent.stories.js|jsx" renderer="solid" language="js" import { MyComponent } from './MyComponent'; export default { component: MyComponent, }; export const Example = { parameters: { design: { type: 'figma', url: 'https://www.figma.com/file/Sample-File', }, }, }; ``` ```tsx filename="MyComponent.stories.ts|tsx" renderer="solid" language="ts-4-9" import type { Meta, StoryObj } from 'storybook-solidjs'; import { MyComponent } from './MyComponent'; const meta = { component: MyComponent, } satisfies Meta; export default meta; type Story = StoryObj; export const Example: Story = { parameters: { design: { type: 'figma', url: 'https://www.figma.com/file/Sample-File', }, }, }; ``` ```tsx filename="MyComponent.stories.ts|tsx" renderer="solid" language="ts" import type { Meta, StoryObj } from 'storybook-solidjs'; import { MyComponent } from './MyComponent'; const meta: Meta = { component: MyComponent, }; export default meta; type Story = StoryObj; export const Example: Story = { parameters: { design: { type: 'figma', url: 'https://www.figma.com/file/Sample-File', }, }, }; ``` ```js filename="MyComponent.stories.js" renderer="svelte" language="js" import MyComponent from './MyComponent.svelte'; // More on default export: https://storybook.js.org/docs/writing-stories/#default-export export default { component: MyComponent, }; export const Example = { parameters: { design: { type: 'figma', url: 'https://www.figma.com/file/Sample-File', }, }, }; ``` ```ts filename="MyComponent.stories.ts" renderer="svelte" language="ts-4-9" import type { Meta, StoryObj } from '@storybook/svelte'; import MyComponent from './MyComponent.svelte'; // More on default export: https://storybook.js.org/docs/svelte/writing-stories/introduction#default-export const meta = { component: MyComponent, } satisfies Meta; export default meta; type Story = StoryObj; export const Example: Story = { parameters: { design: { type: 'figma', url: 'https://www.figma.com/file/Sample-File', }, }, }; ``` ```ts filename="MyComponent.stories.ts" renderer="svelte" language="ts" import type { Meta, StoryObj } from '@storybook/svelte'; import MyComponent from './MyComponent.svelte'; // More on default export: https://storybook.js.org/docs/svelte/writing-stories/introduction#default-export const meta: Meta = { component: MyComponent, }; export default meta; type Story = StoryObj; export const Example: Story = { parameters: { design: { type: 'figma', url: 'https://www.figma.com/file/Sample-File', }, }, }; ``` ```js filename="MyComponent.stories.js" renderer="vue" language="js" import MyComponent from './MyComponent.vue'; // More on default export: https://storybook.js.org/docs/writing-stories/#default-export export default { component: MyComponent, }; export const Example = { parameters: { design: { type: 'figma', url: 'https://www.figma.com/file/Sample-File', }, }, }; ``` ```ts filename="MyComponent.stories.ts" renderer="vue" language="ts-4-9" import type { Meta, StoryObj } from '@storybook/vue3'; import MyComponent from './MyComponent.vue'; // More on default export: https://storybook.js.org/docs/writing-stories/#default-export const meta = { component: MyComponent, } satisfies Meta; export default meta; type Story = StoryObj; export const Example: Story = { parameters: { design: { type: 'figma', url: 'https://www.figma.com/file/Sample-File', }, }, }; ``` ```ts filename="MyComponent.stories.ts" renderer="vue" language="ts" import type { Meta, StoryObj } from '@storybook/vue3'; import MyComponent from './MyComponent.vue'; // More on default export: https://storybook.js.org/docs/writing-stories/#default-export const meta: Meta = { component: MyComponent, }; export default meta; type Story = StoryObj; export const Example: Story = { parameters: { design: { type: 'figma', url: 'https://www.figma.com/file/Sample-File', }, }, }; ``` ```js filename="MyComponent.stories.js" renderer="web-components" language="js" export default { component: 'my-component', }; export const Example = { parameters: { design: { type: 'figma', url: 'https://www.figma.com/file/Sample-File', }, }, }; ``` ```ts filename="MyComponent.stories.ts" renderer="web-components" language="ts" import type { Meta, StoryObj } from '@storybook/web-components'; const meta: Meta = { component: 'my-component', }; export default meta; type Story = StoryObj; export const Example: Story = { parameters: { design: { type: 'figma', url: 'https://www.figma.com/file/Sample-File', }, }, }; ```