blob: d90156e92794552f3a80a3d7fbd174c893b1f3f3 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
|
import { ArgTypes, Canvas, Meta, Primary } from '@storybook/blocks';
import * as ButtonStories from './button.stories';
<Meta of={ButtonStories} />
# Button
<Primary />
## Kind
The button appearance can change depending on its kind.
### Primary
<Canvas of={ButtonStories.Primary} />
### Secondary (default)
<Canvas of={ButtonStories.Secondary} />
### Tertiary
<Canvas of={ButtonStories.Tertiary} />
### Neutral
<Canvas of={ButtonStories.Neutral} />
## States
It can either:
* be enabled,
* be disabled
* indicate a loading state,
* indicate a pressed state.
### Enabled (default)
<Canvas of={ButtonStories.Enabled} />
### Disabled
<Canvas of={ButtonStories.Disabled} />
### Loading
<Canvas of={ButtonStories.Loading} />
### Pressed
<Canvas of={ButtonStories.Pressed} />
## Shapes
It can either:
* be a circle,
* be a rectangle
* be a square,
* or conserves its initial shape.
### Circle
<Canvas of={ButtonStories.Circle} />
### Rectangle (default)
<Canvas of={ButtonStories.Rectangle} />
### Square
<Canvas of={ButtonStories.Square} />
### Initial
<Canvas of={ButtonStories.Initial} />
## Props
<ArgTypes of={ButtonStories} />
|
