{"_id":"@dhafitf/toast-it","_rev":"1-57338c1a04bade5c6f0708404f0cccb6","name":"@dhafitf/toast-it","dist-tags":{"latest":"1.0.1"},"versions":{"1.0.0":{"name":"@dhafitf/toast-it","description":"A simple toast library","version":"1.0.0","license":"MIT","author":{"name":"Dhafit Farenza"},"umd":"toastIt","main":"dist/toast-it.cjs","module":"dist/toast-it.js","browser":"dist/toast-it.umd.js","jsdelivr":"./dist/toast-it.umd.js","unpkg":"./dist/toast-it.umd.js","types":"dist/toast-it.d.ts","keywords":["toast","notification","alert"],"homepage":"https://github.com/dhafitf/toast-it#readme","repository":{"url":"git+https://github.com/dhafitf/toast-it.git"},"scripts":{"build":"tsup","lint":"tsc"},"dependencies":{"goober":"^2.1.14"},"devDependencies":{"@swc/core":"^1.4.17","esbuild-plugin-umd-wrapper":"^2.0.0","tsup":"^8.0.2","typescript":"^5.4.5"},"_id":"@dhafitf/toast-it@1.0.0","gitHead":"4eea82c4ffa592466cfc77931410f2cffccea2b4","bugs":{"url":"https://github.com/dhafitf/toast-it/issues"},"_nodeVersion":"20.10.0","_npmVersion":"10.2.3","dist":{"integrity":"sha512-3EmSGmwyypBWn+ZB35nTsZKiy98d1RiF/3o9wCb3px/HFCI9ByqxOqPppcVZ20nO2xbI+K9mAdns8H3lOLusEA==","shasum":"a979613c2c4e4210476a40caddbbcbf984a7d3d8","tarball":"https://registry.npmjs.org/@dhafitf/toast-it/-/toast-it-1.0.0.tgz","fileCount":18,"unpackedSize":136981,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIDV3RrERzWvlswWtiBjMkxcOZx/xE6Pv51jVYsqZZ4+KAiBFvDJianIvriJsTerYOuTQdCpBxQCGRoj9bVCFggHytQ=="}]},"_npmUser":{"name":"dhafitf","email":"dhafidfarenza@gmail.com"},"directories":{},"maintainers":[{"name":"dhafitf","email":"dhafidfarenza@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/toast-it_1.0.0_1714463361901_0.1782063963897791"},"_hasShrinkwrap":false},"1.0.1":{"name":"@dhafitf/toast-it","description":"A simple toast library","version":"1.0.1","license":"MIT","author":{"name":"Dhafit Farenza"},"umd":"toastIt","main":"dist/toast-it.cjs","module":"dist/toast-it.js","browser":"dist/toast-it.umd.js","jsdelivr":"./dist/toast-it.umd.js","unpkg":"./dist/toast-it.umd.js","types":"dist/toast-it.d.ts","keywords":["toast","notification","alert"],"homepage":"https://github.com/dhafitf/toast-it#readme","repository":{"url":"git+https://github.com/dhafitf/toast-it.git"},"scripts":{"build":"tsup","lint":"tsc"},"dependencies":{"goober":"^2.1.14"},"devDependencies":{"@swc/core":"^1.4.17","esbuild-plugin-umd-wrapper":"^2.0.0","tsup":"^8.0.2","typescript":"^5.4.5"},"_id":"@dhafitf/toast-it@1.0.1","gitHead":"e97544763eb480c1a3cb9a96ee77a3720321e0f2","bugs":{"url":"https://github.com/dhafitf/toast-it/issues"},"_nodeVersion":"20.10.0","_npmVersion":"10.2.3","dist":{"integrity":"sha512-7UKyPLFKlogLf50zDN1DFnAi+/99TlKJGnIPrKeoyWrGo/splJsEIBK06CFvSYc6rQHjQC0ZxRe89GZHj4Vz6A==","shasum":"e0d8921c61b0c55de7eb36907c90cf56d58ff37b","tarball":"https://registry.npmjs.org/@dhafitf/toast-it/-/toast-it-1.0.1.tgz","fileCount":18,"unpackedSize":137052,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIF/yhoK6XIt9kBLelWI+FsvoSfiwI/YTbg4wkDIzkLtcAiEA/+qLC91Z02oEcZU+jvR54A+kpBuLUipXc349ormjhYI="}]},"_npmUser":{"name":"dhafitf","email":"dhafidfarenza@gmail.com"},"directories":{},"maintainers":[{"name":"dhafitf","email":"dhafidfarenza@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/toast-it_1.0.1_1714465614861_0.875292961823172"},"_hasShrinkwrap":false}},"time":{"created":"2024-04-30T07:49:21.815Z","1.0.0":"2024-04-30T07:49:22.098Z","modified":"2024-04-30T08:26:55.160Z","1.0.1":"2024-04-30T08:26:54.987Z"},"maintainers":[{"name":"dhafitf","email":"dhafidfarenza@gmail.com"}],"description":"A simple toast library","homepage":"https://github.com/dhafitf/toast-it#readme","keywords":["toast","notification","alert"],"repository":{"url":"git+https://github.com/dhafitf/toast-it.git"},"author":{"name":"Dhafit Farenza"},"bugs":{"url":"https://github.com/dhafitf/toast-it/issues"},"license":"MIT","readme":"# Toast it\r\n\r\nToast notifications with a simple and easy-to-use.\r\n\r\n## Installation\r\n\r\n#### Adding toast-it via NPM.\r\n\r\n```bash\r\nnpm install @dhafitf/toast-it\r\n```\r\n\r\nor\r\n\r\n```bash\r\nyarn add @dhafitf/toast-it\r\n```\r\n\r\n#### Adding toast-it via CDN.\r\n\r\n```html\r\n<script src=\"https://cdn.jsdelivr.net/npm/@dhafitf/toast-it/dist/toast-it.umd.min.js\"></script>\r\n```\r\n\r\n> Files are delivered via the CDN service provided by [jsdelivr](https://www.jsdelivr.com/).\r\n\r\n## Basic Usage\r\n\r\nAdd a toast to page. The toast will be appended to the body element.\r\n\r\n```js\r\nconst toast = new ToastIt();\r\n\r\nconst notifyButton = document.getElementById(\"notify-btn\");\r\nnotifyButton.addEventListener(\"click\", () => {\r\n  toast.success(\"Hello, World!\");\r\n});\r\n```\r\n\r\n## Documentation\r\n\r\nCalling the `ToastIt` constructor will create a new instance of the toast notification. The constructor accepts an optional configuration object. This will be used to set the default options for the toast.\r\n\r\n```js\r\nconst toast = new ToastIt({\r\n  // Will auto close the toast after the duration. Set to false to disable\r\n  autoClose: true,\r\n  // Duration of the toast to be visible. Not applicable if autoClose is false\r\n  duration: 5000,\r\n  // Position of the toast\r\n  position: \"bottom-right\",\r\n  // Space between toasts\r\n  gutter: 8,\r\n});\r\n```\r\n\r\n### Creating a toast\r\n\r\n#### Success\r\n\r\n```js\r\ntoast.success(\"Hello, World!\");\r\n```\r\n\r\nCreates a notification with an animated checkmark.\r\n\r\n#### Error\r\n\r\n```js\r\ntoast.error(\"Hello, World!\");\r\n```\r\n\r\nCreates a notification with an animated error icon.\r\n\r\n#### Blank\r\n\r\n```js\r\ntoast.open({\r\n  type: \"blank\", // You can also use \"success\" or \"error\"\r\n  message: \"Hello, World!\",\r\n});\r\n```\r\n\r\n#### With options\r\n\r\nA toast can be created with options properties to override the default options.\r\n\r\n```js\r\ntoast.success(\"Hello, World!\", {\r\n  duration: 3000,\r\n  position: \"top-left\",\r\n});\r\n```\r\n\r\nor\r\n\r\n```js\r\ntoast.open({\r\n  type: \"success\",\r\n  message: \"Hello, World!\",\r\n  duration: 3000,\r\n  position: \"top-left\",\r\n});\r\n```\r\n\r\n### Utilities\r\n\r\n#### Dismiss Toasts Programatically\r\n\r\nYou can manually dismiss a notification with `toast.dismiss`. Toasts will auto-remove after 3 second by default.\r\n\r\n##### Dismiss a single toast\r\n\r\n```js\r\n// Generate a random id for the toast\r\nconst toastId = Math.random().toString(36).substring(2, 9);\r\n\r\nconst showButton = document.getElementById(\"show\");\r\nshowButton.addEventListener(\"click\", () => {\r\n  toast.success(\"Hello World!\", {\r\n    id: toastId, // Set the id of the toast\r\n    autoClose: false,\r\n    position: \"top-right\",\r\n  });\r\n});\r\n\r\nconst dismissButton = document.getElementById(\"dismiss\");\r\ndismissButton.addEventListener(\"click\", () => {\r\n  toast.dismiss(toastId); // Dismiss the toast with the given id\r\n});\r\n```\r\n\r\n##### Dismiss all toasts\r\n\r\n```js\r\ntoast.dismiss();\r\n```\r\n\r\n## Acknowledgements\r\n\r\nThis project is inspired by\r\n\r\n- [React Hot Toast](https://github.com/timolins/react-hot-toast)\r\n","readmeFilename":"README.md"}