|
<script> |
|
import { Meta, Template, Story } from "@storybook/addon-svelte-csf"; |
|
import Multiselect from "./shared/Multiselect.svelte"; |
|
import { format } from "svelte-i18n"; |
|
import { get } from "svelte/store"; |
|
</script> |
|
|
|
<Meta |
|
title="Components/Multiselect" |
|
component={Multiselect} |
|
argTypes={{ |
|
multiselect: { |
|
control: [true, false], |
|
name: "multiselect", |
|
value: false |
|
} |
|
}} |
|
/> |
|
|
|
<Template let:args> |
|
<Multiselect {...args} i18n={get(format)} /> |
|
</Template> |
|
|
|
<Story |
|
name="Multiselect Interactive" |
|
args={{ |
|
value: ["swim", "run"], |
|
choices: [ |
|
["run", "run"], |
|
["swim", "swim"], |
|
["jump", "jump"] |
|
], |
|
label: "Multiselect Dropdown" |
|
}} |
|
/> |
|
<Story |
|
name="Multiselect Static" |
|
args={{ |
|
value: ["swim", "run"], |
|
choices: [ |
|
["run", "run"], |
|
["swim", "swim"], |
|
["jump", "jump"] |
|
], |
|
label: "Multiselect Dropdown", |
|
disabled: true |
|
}} |
|
/> |
|
|