/
Coupon.stories.tsx
55 lines (47 loc) · 1.45 KB
/
Coupon.stories.tsx
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
import React from "react";
import { select, text } from "@storybook/addon-knobs";
import Text from "../Text";
import List, { ListItem } from "../List";
import { SIZES } from "../List/consts";
import Coupon from ".";
export default {
title: "Coupon",
};
export const Default = () => {
const content = text("content", "PROMOTIONCODE");
const size = select("Size", Object.values(SIZES), SIZES.SMALL);
return (
<List size={size}>
<ListItem>
<Text>
Lorem ipsum dolor sit amet, consectetuer <Coupon>{content}</Coupon> elit. Proin pede
metus, vulputate nec, fermentum fringilla, vehicula vitae, justo.
</Text>
</ListItem>
</List>
);
};
Default.story = {
parameters: {
info: "You can try all possible configurations of this component. However, check Orbit.Kiwi for more detailed design guidelines.",
},
};
export const Playground = () => {
const dataTest = text("dataTest", "test");
const id = text("id", "couponId");
const content = text("content", "CODE");
return (
<Text>
Lorem ipsum dolor sit amet, consectetuer{" "}
<Coupon dataTest={dataTest} id={id}>
{content}
</Coupon>{" "}
elit. Proin pede metus, vulputate nec, fermentum fringilla, vehicula vitae, justo.
</Text>
);
};
Playground.story = {
parameters: {
info: "You can try all possible configurations of this component. However, check Orbit.Kiwi for more detailed design guidelines.",
},
};