@mmcodemark/fuselage-toastbar
Version:
Fuselage ToastBar component
55 lines • 2.47 kB
JavaScript
;
var __assign = (this && this.__assign) || function () {
__assign = Object.assign || function(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.ToastBarWithData = void 0;
var jsx_runtime_1 = require("react/jsx-runtime");
var fuselage_1 = require("@mmcodemark/fuselage");
var react_1 = require("react");
var ToastBarContext_1 = require("./ToastBarContext");
exports.default = {
title: 'view/ToastBar',
parameters: {
layout: 'fullscreen',
actions: { argTypesRegex: '^on.*' },
},
};
var ToastBarWithData = function () {
var _a = (0, react_1.useState)(0), counter = _a[0], setCounter = _a[1];
var dispatchToastMessage = (0, ToastBarContext_1.useToastBarDispatch)();
var messageArray = [
'Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ipsam nihi Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ipsam nihi',
'Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ipsam nihi Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ipsam nihi',
'Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ipsam nihi Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ipsam nihi',
'Lorem Ipsum',
'Lorem ipsum dolor, sit amet consectetur adipisicing elit.',
];
var handleToast = function () {
dispatchToastMessage({
type: 'success',
message: messageArray[counter],
});
dispatchToastMessage({
type: 'error',
message: messageArray[counter],
time: 10,
position: 'bottom-start',
});
if (counter === messageArray.length - 1) {
return setCounter(0);
}
return setCounter(function (prevState) { return prevState + 1; });
};
return ((0, jsx_runtime_1.jsx)(fuselage_1.Box, __assign({ display: 'flex', alignItems: 'center', justifyContent: 'center', height: '100vh' }, { children: (0, jsx_runtime_1.jsx)(fuselage_1.Button, __assign({ primary: true, onClick: handleToast }, { children: "Dispatch ToastBar" })) })));
};
exports.ToastBarWithData = ToastBarWithData;
//# sourceMappingURL=stories.js.map