-
Notifications
You must be signed in to change notification settings - Fork 5
/
Label.story.js
41 lines (39 loc) · 1.07 KB
/
Label.story.js
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
import React from "react";
import { storiesOf } from "@storybook/react";
import { POSITIONS } from "@crave/farmblocks-tooltip";
import Label from ".";
storiesOf("Label", "module")
.add("Default", () => <Label>Default Label</Label>)
.add("Focused", () => <Label focused>Focused Label</Label>)
.add("Invalid", () => <Label invalid>Invalid Label</Label>)
.add("Disabled", () => <Label disabled>Disabled Label</Label>)
.add("Protected and disabled", () => (
<Label disabled protected>
Protected Label
</Label>
))
.add("With more info", () => (
<Label moreInfoContent="More info content">Default Label</Label>
))
.add("With more info right aligned", () => (
<Label
moreInfoContent="More info content"
moreInfoTooltipProps={{ positionX: POSITIONS.X.RIGHT }}
>
Default Label
</Label>
))
.add("extended style", () => (
<Label
css="
border: dotted 4px sienna;
::after {
display: block;
content: '';
clear: both;
}
"
>
Default Label
</Label>
));