@arche-mc2/arche-controls
Version:
We know that there are a ton of react UI library projects to choose from. Our hope with this one is to provide the next generation of react components that you can use to bootstrap your next project, or as a reference for building a UIKit. Read on to get
64 lines • 3.38 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var React = require("react");
var theming_1 = require("../../../Common/theming");
var ThemeProvider_1 = require("../../../Common/theming/ThemeProvider");
var addon_knobs_1 = require("@storybook/addon-knobs");
var UpToast_1 = require("./UpToast");
var UpButton_1 = require("../../Inputs/Button/UpButton");
var stories_1 = require("../../../Common/stories");
var Ligne_1 = require("../../Display/Ligne");
exports.default = {
title: 'Components/Display/UpToast',
decorators: [
addon_knobs_1.withKnobs,
stories_1.getRootContainer('UpToast'),
function (UpToast) { return (React.createElement("div", { style: { height: '40vh' } },
React.createElement(ThemeProvider_1.ThemeProvider, { theme: theming_1.default },
React.createElement(UpToast, null)))); }
],
component: UpToast_1.UpToast
};
var useShowButton = function () {
var _a = React.useState(5000), duration = _a[0], resetDuration = _a[1];
var newDuration = new Number(duration);
var Button = (React.createElement(UpButton_1.default, { intent: 'primary', onClick: function () {
resetDuration(newDuration);
} }, "Show toast"));
return [newDuration, Button];
};
exports.General = function () {
var _a = useShowButton(), duration = _a[0], Button = _a[1];
return (React.createElement(React.Fragment, null,
Button,
React.createElement(UpToast_1.default, { intent: 'info', message: 'Infos', duration: duration, autoDismissable: true })));
};
exports.ToastWithTitle = function () {
var _a = useShowButton(), duration = _a[0], Button = _a[1];
return (React.createElement(React.Fragment, null,
Button,
React.createElement(UpToast_1.default, { intent: 'success', title: 'Opération', autoDismissable: true, message: 'Succès', duration: duration })));
};
exports.FalsyAutoDismissable = function () {
var _a = useShowButton(), duration = _a[0], Button = _a[1];
return (React.createElement(React.Fragment, null,
Button,
React.createElement(UpToast_1.default, { intent: 'danger', autoDismissable: false, message: 'Danger', duration: duration })));
};
exports.FalsyAutoDismissable.storyName = 'Close Manually If Falsy AutoDismissable';
exports.OnCloseCallBack = function () {
var _a = useShowButton(), duration = _a[0], Button = _a[1];
return (React.createElement(React.Fragment, null,
Button,
React.createElement(UpToast_1.default, { intent: 'primary', autoDismissable: true, message: 'A message is displayed in the console once UpToast is closed', duration: duration, onClose: function () { return console.log('UpToast is closed'); } })));
};
exports.OnCloseCallBack.storyName = 'Call OnClose CallBack When UpToast Closed';
exports.MultiLines = function () {
var _a = useShowButton(), duration = _a[0], Button = _a[1];
return (React.createElement(React.Fragment, null,
Button,
React.createElement(UpToast_1.default, { intent: 'success', autoDismissable: true, duration: duration },
React.createElement(Ligne_1.default, null, 'Message 1 \n Message 2'))));
};
exports.MultiLines.storyName = 'Add Line Breaks Between Messages';
//# sourceMappingURL=index.stories.js.map