import { useState } from 'react';
import { Button, Toaster, useToaster } from '@pega/cosmos-react-core';
export default {
    title: 'Core/Toaster',
    component: Toaster
};
export const ToasterDemo = () => {
    const MakeToastButton = () => {
        const { push } = useToaster();
        const [count, setCount] = useState(0);
        const messages = [
            'This is a short toast message!',
            'This toast message is much longer and will need to be trimmed with an ellipsis in order to fit within the confines of the component.'
        ];
        const pushToaster = () => {
            setCount(curr => curr + 1);
            push({
                content: messages[count % 2]
            });
        };
        return <Button onClick={pushToaster}>Make some Toast</Button>;
    };
    return (<Toaster dismissAfter={5000}>
      <MakeToastButton />
    </Toaster>);
};
export const ToastWithLink = () => {
    const MakeToastButton = () => {
        const { push } = useToaster();
        const pushToaster = () => {
            push({
                id: `CASE-${Math.floor(Math.random() * 90000) + 10000}`,
                label: 'Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.',
                href: '/?path=/story/work-caseview--case-view-demo',
                onClick: () => {
                }
            });
        };
        return <Button onClick={pushToaster}>Create Toast</Button>;
    };
    return (<Toaster>
      <MakeToastButton />
    </Toaster>);
};
//# sourceMappingURL=Toaster.stories.jsx.map