54 lines
1018 B
TypeScript
54 lines
1018 B
TypeScript
import preview from "#.storybook/preview";
|
|
|
|
import { Bar } from "../../src/ts/components/common/Bar";
|
|
|
|
const meta = preview.meta({
|
|
title: "Common/Bar",
|
|
component: Bar,
|
|
parameters: {
|
|
layout: "padded",
|
|
},
|
|
tags: ["autodocs"],
|
|
argTypes: {
|
|
percent: { control: { type: "range", min: 0, max: 100 } },
|
|
fill: { control: "select", options: ["main", "text"] },
|
|
bg: { control: "select", options: ["bg", "sub-alt"] },
|
|
showPercentageOnHover: { control: "boolean" },
|
|
animationDuration: { control: "number" },
|
|
},
|
|
});
|
|
|
|
export const Default = meta.story({
|
|
args: {
|
|
percent: 50,
|
|
fill: "main",
|
|
bg: "sub-alt",
|
|
},
|
|
});
|
|
|
|
export const Full = meta.story({
|
|
args: {
|
|
percent: 100,
|
|
fill: "main",
|
|
bg: "sub-alt",
|
|
},
|
|
});
|
|
|
|
export const HalfWithHover = meta.story({
|
|
args: {
|
|
percent: 50,
|
|
fill: "main",
|
|
bg: "sub-alt",
|
|
|
|
showPercentageOnHover: true,
|
|
},
|
|
});
|
|
|
|
export const TextFill = meta.story({
|
|
args: {
|
|
percent: 75,
|
|
fill: "text",
|
|
bg: "sub-alt",
|
|
},
|
|
});
|