storybook/docs/snippets/svelte/my-component-story-configure-viewports.js.mdx
2021-11-09 01:41:54 +00:00

34 lines
790 B
Plaintext

```js
// MyComponent.stories.js
import { INITIAL_VIEWPORTS } from '@storybook/addon-viewport';
import MyComponent from './MyComponent.svelte';
export default {
/* 👇 The title prop is optional.
* See https://storybook.js.org/docs/svelte/configure/overview#configure-story-loading
* to learn how to generate automatic titles
*/
title: 'MyComponent',
component: MyComponent,
parameters: {
//👇 The viewports object from the Essentials addon
viewport: {
//👇 The viewports you want to use
viewports: INITIAL_VIEWPORTS,
//👇 Your own default viewport
defaultViewport: 'iphone6',
},
},
};
export const MyStory = () => ({
Component: MyComponent,
});
MyStory.parameters = {
viewport: {
defaultViewport: 'iphonex',
},
};
```