{"version":3,"file":"Toaster.stories.jsx","sourceRoot":"","sources":["../../../src/core/Toaster/Toaster.stories.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEjC,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAEtE,eAAe;IACb,KAAK,EAAE,cAAc;IACrB,SAAS,EAAE,OAAO;CACX,CAAC;AAEV,MAAM,CAAC,MAAM,WAAW,GAAY,GAAG,EAAE;IACvC,MAAM,eAAe,GAAG,GAAG,EAAE;QAC3B,MAAM,EAAE,IAAI,EAAE,GAAG,UAAU,EAAE,CAAC;QAC9B,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC;QAEtC,MAAM,QAAQ,GAAG;YACf,gCAAgC;YAChC,sIAAsI;SACvI,CAAC;QAEF,MAAM,WAAW,GAAG,GAAG,EAAE;YACvB,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,GAAG,CAAC,CAAC,CAAC;YAC3B,IAAI,CAAC;gBACH,OAAO,EAAE,QAAQ,CAAC,KAAK,GAAG,CAAC,CAAC;aAC7B,CAAC,CAAC;QACL,CAAC,CAAC;QAEF,OAAO,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,WAAW,CAAC,CAAC,eAAe,EAAE,MAAM,CAAC,CAAC;IAChE,CAAC,CAAC;IAEF,OAAO,CACL,CAAC,OAAO,CAAC,YAAY,CAAC,CAAC,IAAI,CAAC,CAC1B;MAAA,CAAC,eAAe,CAAC,AAAD,EAClB;IAAA,EAAE,OAAO,CAAC,CACX,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,aAAa,GAAY,GAAG,EAAE;IACzC,MAAM,eAAe,GAAG,GAAG,EAAE;QAC3B,MAAM,EAAE,IAAI,EAAE,GAAG,UAAU,EAAE,CAAC;QAE9B,MAAM,WAAW,GAAG,GAAG,EAAE;YACvB,IAAI,CAAC;gBACH,EAAE,EAAE,QAAQ,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,EAAE,GAAG,KAAK,CAAC,GAAG,KAAK,EAAE;gBACvD,KAAK,EACH,qPAAqP;gBACvP,IAAI,EAAE,6CAA6C;gBACnD,OAAO,EAAE,GAAG,EAAE;gBAEd,CAAC;aACF,CAAC,CAAC;QACL,CAAC,CAAC;QAEF,OAAO,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,WAAW,CAAC,CAAC,YAAY,EAAE,MAAM,CAAC,CAAC;IAC7D,CAAC,CAAC;IAEF,OAAO,CACL,CAAC,OAAO,CACN;MAAA,CAAC,eAAe,CAAC,AAAD,EAClB;IAAA,EAAE,OAAO,CAAC,CACX,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\nimport { useState } from 'react';\n\nimport { Button, Toaster, useToaster } from '@pega/cosmos-react-core';\n\nexport default {\n  title: 'Core/Toaster',\n  component: Toaster\n} as Meta;\n\nexport const ToasterDemo: StoryFn = () => {\n  const MakeToastButton = () => {\n    const { push } = useToaster();\n    const [count, setCount] = useState(0);\n\n    const messages = [\n      'This is a short toast message!',\n      '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.'\n    ];\n\n    const pushToaster = () => {\n      setCount(curr => curr + 1);\n      push({\n        content: messages[count % 2]\n      });\n    };\n\n    return <Button onClick={pushToaster}>Make some Toast</Button>;\n  };\n\n  return (\n    <Toaster dismissAfter={5000}>\n      <MakeToastButton />\n    </Toaster>\n  );\n};\n\nexport const ToastWithLink: StoryFn = () => {\n  const MakeToastButton = () => {\n    const { push } = useToaster();\n\n    const pushToaster = () => {\n      push({\n        id: `CASE-${Math.floor(Math.random() * 90000) + 10000}`,\n        label:\n          '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.',\n        href: '/?path=/story/work-caseview--case-view-demo',\n        onClick: () => {\n          // Handle client side routing here...\n        }\n      });\n    };\n\n    return <Button onClick={pushToaster}>Create Toast</Button>;\n  };\n\n  return (\n    <Toaster>\n      <MakeToastButton />\n    </Toaster>\n  );\n};\n"]}