2023-08-01 19:44:33 +08:00
|
|
|
<script>
|
|
|
|
import { Meta, Template, Story } from "@storybook/addon-svelte-csf";
|
2023-08-18 23:33:07 +08:00
|
|
|
import Number from "./interactive";
|
2023-08-01 19:44:33 +08:00
|
|
|
</script>
|
|
|
|
|
|
|
|
<Meta title="Components/Number" component={Number} />
|
|
|
|
|
|
|
|
<Template let:args>
|
|
|
|
<Number {...args} />
|
|
|
|
</Template>
|
|
|
|
|
|
|
|
<Story
|
|
|
|
name="Number with min 0 and max 100"
|
|
|
|
args={{
|
|
|
|
minimum: 0,
|
2023-08-04 06:01:18 +08:00
|
|
|
maximum: 100
|
2023-08-01 19:44:33 +08:00
|
|
|
}}
|
|
|
|
/>
|
|
|
|
|
|
|
|
<Story
|
|
|
|
name="Number with step of 10"
|
|
|
|
args={{
|
2023-08-04 06:01:18 +08:00
|
|
|
step: 10
|
2023-08-01 19:44:33 +08:00
|
|
|
}}
|
|
|
|
/>
|
|
|
|
|
|
|
|
<Story
|
|
|
|
name="Number in disabled state"
|
|
|
|
args={{
|
2023-08-04 06:01:18 +08:00
|
|
|
mode: "static"
|
2023-08-01 19:44:33 +08:00
|
|
|
}}
|
|
|
|
/>
|
|
|
|
|
|
|
|
<Story
|
|
|
|
name="Number with hidden label"
|
|
|
|
args={{
|
2023-08-04 06:01:18 +08:00
|
|
|
show_label: false
|
2023-08-01 19:44:33 +08:00
|
|
|
}}
|
|
|
|
/>
|