@wonderflow/react-components
Version:
UI components from Wonderflow's Wanda design system
18 lines (17 loc) • 915 B
JavaScript
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import { useState } from 'react';
import { Button, Stack } from '../..';
import { OverlayContainer } from './overlay-container';
const story = {
title: 'Layouts/Overlay container',
component: OverlayContainer,
args: {
obfuscate: true,
},
};
export default story;
const Template = ({ children, ...otherProps }) => {
const [isVisible, setIsVisible] = useState(false);
return (_jsxs(_Fragment, { children: [_jsx(Button, { onClick: () => setIsVisible(true), children: "Open Overlay" }), _jsx(OverlayContainer, { ...otherProps, children: isVisible && (_jsxs(Stack, { fill: false, hAlign: "center", vAlign: "center", children: ["I am over the top", _jsx(Button, { kind: "secondary", onClick: () => setIsVisible(false), children: "Close me" })] })) })] }));
};
export const Default = Template.bind({});