This notification has a headline and more text than the previous one.
\",\n delay: 20000\n})\ntoast.element.querySelector(\".btn-primary\").addEventListener(\"click\", () => {\n bootstrap.showToast({\n body: \"Thank you for clicking\", direction: \"append\", \n toastClass: \"text-bg-success\", closeButtonClass: \"btn-close-white\"\n })\n})\n\n// type secondary and sticky\nbootstrap.showToast({\n body: \"This notification will stay\", \n toastClass: \"text-bg-secondary\", closeButtonClass: \"btn-close-white\", \n delay: Infinity // delay of `Infinity` to make it sticky\n})\n```\n\n## Props (defaults)\n\n```js\nthis.props = {\n header: \"\", // the header text\n headerSmall: \"\", // additional text in the header, aligns right\n body: \"\", // the body text of the toast\n closeButton: true, // show a close button\n closeButtonLabel: \"close\", // the label of the close button\n closeButtonClass: \"\", // set to \"btn-close-white\" for dark backgrounds\n toastClass: \"\", // the appearance\n animation: true, // apply a CSS fade transition to the toast\n delay: 5000, //\tdelay in milliseconds before hiding the toast, set delay to `Infinity` to make it sticky\n position: \"top-0 end-0\", // top right\n direction: \"append\", // or \"prepend\", the stack direction\n ariaLive: \"assertive\"\n}\n```\n\n---\n\nFind more high quality modules from [shaack.com](https://shaack.com)\non [our projects page](https://shaack.com/works).\n","readmeFilename":"README.md"}