docs/snippets/svelte/button-story-using-args.native-format.mdx
```html
<!-- Button.stories.svelte -->
<script>
import { Meta, Template, Story } from '@storybook/addon-svelte-csf';
import Button from './Button.svelte';
</script>
<Meta
title="Button"
component={Button}
argTypes={{
label: { control: 'text' },
primary: { control: 'boolean' },
}}
/>
<!-- π We create a βtemplateβ of how args map to rendering -->
<Template let:args>
<Button {...args} />
</Template>
<!-- π Each story then reuses that template -->
<Story
name="Primary"
args={{
background: '#ff0',
label: 'Button'
}}
/>
<Story
name="Secondary"
args={{
background: '#ff0',
label: 'ππππ―'
}}
/>
<Story
name="Tertiary"
args={{
background: '#ff0',
label: 'ππππ€'
}}
/>
```