Usage in Alpine.js

npm install @iamsabbir/nanotoast

yarn add @iamsabbir/nanotoast

<!-- Add the javascript -->
<script src="https://unpkg.com/@iamsabbir/nanotoast/dist/nanotoast.js"></script>
<!-- Or if you want esm module -->
<script src="https://unpkg.com/@iamsabbir/nanotoast/dist/nanotoast.esm.js"></script>

<!-- Add the css -->
<link rel="stylesheet" href="https://unpkg.com/@iamsabbir/nanotoast/dist/nanotoast.css">

<button x-data @click="toast.success('Hello from Alpine.js!')">Show Toast</button>

toast.success("Alpine.js is awesome!");
toast.error("Alpine.js is not awesome!");
toast.warning("Alpine.js is okay!");
toast.info("Alpine.js is great!");