gitscope
← marzneshin / v0.7.3 / dashboard/src/common/components/ui/button/button.stories.tsx
https://dev.kronoz.win/r/marzneshin.git
dashboard/src/common/components/ui/button/button.stories.tsx · TypeScript
Blame Raw
 1import { Button } from './index'
 2import { action } from "@storybook/addon-actions";
 3import type { Meta, StoryObj } from "@storybook/react";
 4
 5
 6const meta: Meta<typeof Button> = {
 7    title: "Components/UI/Button",
 8    component: Button,
 9    tags: ["autodocs"]
10};
11
12export default meta;
13
14type Story = StoryObj<typeof Button>;
15
16
17export const Primary: Story = {
18    args: {
19        variant: "default",
20        size: "default",
21        onMouseDown: action('clicked'),
22        children: 'Primary'
23    }
24}
25
26export const Secondary: Story = {
27    args: {
28        onMouseDown: action('clicked'),
29        variant: 'secondary',
30        children: 'Secondary'
31    }
32}
33
34export const Destructive: Story = {
35    args: {
36        onMouseDown: action('clicked'),
37        variant: 'destructive',
38        children: 'Destructive'
39    }
40}
41
42export const Success: Story = {
43    args: {
44        onMouseDown: action('clicked'),
45        variant: 'success',
46        children: 'Success'
47    }
48}
49
50export const Ghost: Story = {
51    args: {
52        onMouseDown: action('clicked'),
53        variant: 'ghost',
54        children: 'Ghost'
55    }
56}
57
58export const Link: Story = {
59    args: {
60        onMouseDown: action('clicked'),
61        variant: 'link',
62        children: 'Ghost'
63    }
64}
65
66export const SmallSize: Story = {
67    args: {
68        onMouseDown: action('clicked'),
69        children: 'Small',
70        size: 'sm'
71    }
72}
73
74export const DefaultSize: Story = {
75    args: {
76        onMouseDown: action('clicked'),
77        children: 'Default',
78        size: 'sm'
79    }
80}
81
82export const LargeSize: Story = {
83    args: {
84        onMouseDown: action('clicked'),
85        children: 'Large',
86        size: 'lg'
87    }
88}
89
90export const IconSize: Story = {
91    args: {
92        onMouseDown: action('clicked'),
93        children: 'I',
94        size: 'icon'
95    }
96}
97