55 lines
1.5 KiB
JavaScript
55 lines
1.5 KiB
JavaScript
import React from "react";
|
|
import { storiesOf } from "@storybook/react";
|
|
import Toast from ".";
|
|
import toastr from "./toastr";
|
|
import Readme from "./README.md";
|
|
import {
|
|
text,
|
|
boolean,
|
|
withKnobs,
|
|
select,
|
|
number,
|
|
} from "@storybook/addon-knobs/react";
|
|
import withReadme from "storybook-readme/with-readme";
|
|
import Section from "../../../.storybook/decorators/section";
|
|
|
|
const typeToast = ["success", "error", "warning", "info"];
|
|
|
|
storiesOf("Components|Toast", module)
|
|
.addDecorator(withKnobs)
|
|
.addDecorator(withReadme(Readme))
|
|
.add("base", () => {
|
|
const type = `${select("type", typeToast, "success")}`;
|
|
const data = `${text("data", "Demo text for Toast")}`;
|
|
const title = `${text("title", "Demo title")}`;
|
|
const withCross = boolean("withCross", false);
|
|
const timeout = number("timeout", "5000");
|
|
return (
|
|
<>
|
|
<Toast />
|
|
<Section>
|
|
<button
|
|
onClick={() => {
|
|
switch (type) {
|
|
case "error":
|
|
toastr.error(data, title, timeout, withCross);
|
|
break;
|
|
case "warning":
|
|
toastr.warning(data, title, timeout, withCross);
|
|
break;
|
|
case "info":
|
|
toastr.info(data, title, timeout, withCross);
|
|
break;
|
|
default:
|
|
toastr.success(data, title, timeout, withCross);
|
|
break;
|
|
}
|
|
}}
|
|
>
|
|
Show toast
|
|
</button>
|
|
</Section>
|
|
</>
|
|
);
|
|
});
|