{"_id":"@aicadev/toast-message","_rev":"4-e4fad80978e1bbb790c2f92e4a570be6","name":"@aicadev/toast-message","dist-tags":{"latest":"1.0.3"},"versions":{"1.0.0":{"name":"@aicadev/toast-message","version":"1.0.0","keywords":["toast","notification","web-component","custom-element","javascript","ui","component"],"author":{"name":"aicadev"},"license":"MIT","_id":"@aicadev/toast-message@1.0.0","maintainers":[{"name":"aicadev","email":"aitor.cachero@gmail.com"}],"homepage":"https://github.com/aicadev/toast-message#readme","bugs":{"url":"https://github.com/aicadev/toast-message/issues"},"dist":{"shasum":"56b3d0f6cd9c96a84238d12345d16a12161c1762","tarball":"https://registry.npmjs.org/@aicadev/toast-message/-/toast-message-1.0.0.tgz","fileCount":5,"integrity":"sha512-mNPe+7fPZzC3Rld8Tw2Mld3TejKyc3w9PaVBdidwgkJQOYTLpyRBSky0fnWm/VJr7ZRqpXNk1aX1QxjEkAi/Ug==","signatures":[{"sig":"MEUCIQDxGGKTnCmGSzbWvNzSnggQtp4rogLPSFakdKI2qo06qwIgeE0Cbpk6NcjoaPYoc9ZuTYOn7bDQjB05ztMa0SA0QdY=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":13164},"main":"dist/toast-message.js","type":"module","module":"dist/toast-message.js","gitHead":"7086597b3f4059df032dc530b019bc2403be4a2d","scripts":{"dev":"vite","build":"vite build","preview":"vite preview"},"_npmUser":{"name":"aicadev","email":"aitor.cachero@gmail.com"},"repository":{"url":"git+https://github.com/aicadev/toast-message.git","type":"git"},"_npmVersion":"11.3.0","description":"🔔 Lightweight and framework-agnostic Web Component for toast notifications","directories":{},"_nodeVersion":"22.15.0","_hasShrinkwrap":false,"devDependencies":{"vite":"^6.3.5"},"_npmOperationalInternal":{"tmp":"tmp/toast-message_1.0.0_1747905598891_0.7202809359111417","host":"s3://npm-registry-packages-npm-production"}},"1.0.1":{"name":"@aicadev/toast-message","version":"1.0.1","keywords":["toast","notification","web-component","custom-element","javascript","ui","component"],"author":{"name":"aicadev"},"license":"MIT","_id":"@aicadev/toast-message@1.0.1","maintainers":[{"name":"aicadev","email":"aitor.cachero@gmail.com"}],"homepage":"https://github.com/aicadev/toast-message#readme","bugs":{"url":"https://github.com/aicadev/toast-message/issues"},"dist":{"shasum":"98d43393474d49bada67ecc01bd562ad1f91c492","tarball":"https://registry.npmjs.org/@aicadev/toast-message/-/toast-message-1.0.1.tgz","fileCount":2,"integrity":"sha512-lP/YiKsN7MuJHCv/g7goZ4Cj7QkGUqpAm9IhHuBX5PBRz4s2LTGpWZ8gqXxEWKdUgAWQJNqzZuoQtIaSXLWz5A==","signatures":[{"sig":"MEQCIDpimAw7Hfbge+YNrxQElPlHmLNk0zCKIFXpjjFh28+NAiA0lHWsKr5yXind2CDdfjf0W7mmJDvF9/ytTE5RijREIQ==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":4891},"main":"dist/toast-message.js","type":"module","module":"dist/toast-message.js","exports":{".":{"import":"./dist/toast-message.js","require":"./dist/toast-message.js"}},"gitHead":"b4bd1e7e995e691f9c45c1d7117a9ef40767d48c","scripts":{"dev":"vite","build":"vite build","preview":"vite preview"},"_npmUser":{"name":"aicadev","email":"aitor.cachero@gmail.com"},"repository":{"url":"git+https://github.com/aicadev/toast-message.git","type":"git"},"_npmVersion":"11.3.0","description":"🔔 Lightweight and framework-agnostic Web Component for toast notifications","directories":{},"_nodeVersion":"22.15.0","_hasShrinkwrap":false,"devDependencies":{"vite":"^6.3.5"},"_npmOperationalInternal":{"tmp":"tmp/toast-message_1.0.1_1747905732722_0.8313908909164136","host":"s3://npm-registry-packages-npm-production"}},"1.0.2":{"name":"@aicadev/toast-message","version":"1.0.2","keywords":["toast","notification","web-component","custom-element","javascript","ui","component"],"author":{"name":"aicadev"},"license":"MIT","_id":"@aicadev/toast-message@1.0.2","maintainers":[{"name":"aicadev","email":"aitor.cachero@gmail.com"}],"homepage":"https://aitorcachero.github.io/aicadev-toast-message/","bugs":{"url":"https://github.com/aicadev/toast-message/issues"},"dist":{"shasum":"ea778086786a977afd7610180471b0cff24fe7f9","tarball":"https://registry.npmjs.org/@aicadev/toast-message/-/toast-message-1.0.2.tgz","fileCount":2,"integrity":"sha512-4NUq7bMw9/Znq5DoipopBiYzmUu2H+lKzW70WsOi84C/vjDyUbTL7Hmbk3nPZRIUf3I1F558IkoWdkWKVUy0ig==","signatures":[{"sig":"MEQCIGjGQgJg+CFUhZegO3VtfUcuIunfqtjL1SigLTUhs2TIAiAIbRoz1r6xghDvLjdfTQ5BnGnurCrVui7URDUDH+7Eew==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":4960},"main":"dist/toast-message.js","type":"module","module":"dist/toast-message.js","exports":{".":{"import":"./dist/toast-message.js","require":"./dist/toast-message.js"}},"gitHead":"9d5912ba99385b106f5ee58f4b1595c703743f66","scripts":{"dev":"vite","build":"vite build","preview":"vite preview"},"_npmUser":{"name":"aicadev","email":"aitor.cachero@gmail.com"},"repository":{"url":"git+https://github.com/aicadev/toast-message.git","type":"git"},"_npmVersion":"11.3.0","description":"🔔 Lightweight and framework-agnostic Web Component for toast notifications","directories":{},"_nodeVersion":"22.15.0","_hasShrinkwrap":false,"devDependencies":{"vite":"^6.3.5"},"_npmOperationalInternal":{"tmp":"tmp/toast-message_1.0.2_1747905956112_0.6653057940906841","host":"s3://npm-registry-packages-npm-production"}},"1.0.3":{"name":"@aicadev/toast-message","version":"1.0.3","type":"module","description":"🔔 Lightweight and framework-agnostic Web Component for toast notifications","main":"dist/toast-message.js","module":"dist/toast-message.js","exports":{".":{"import":"./dist/toast-message.js","require":"./dist/toast-message.js"}},"scripts":{"dev":"vite","build":"vite build","preview":"vite preview"},"keywords":["toast","notification","web-component","custom-element","javascript","ui","component"],"author":{"name":"aicadev"},"license":"MIT","repository":{"type":"git","url":"git+https://github.com/aicadev/toast-message.git"},"bugs":{"url":"https://github.com/aicadev/toast-message/issues"},"homepage":"https://aitorcachero.github.io/aicadev-toast-message/","devDependencies":{"vite":"^6.3.5"},"_id":"@aicadev/toast-message@1.0.3","gitHead":"b60f23ea0f1c69b0b5e72440cead4a945e47cb39","_nodeVersion":"22.15.0","_npmVersion":"11.3.0","dist":{"integrity":"sha512-CHXhI0LzxSkUNFXb1OIbPl0PMsE2m4HjU802wQk8cO3CZqDWjfxEiNbSSnFGsONzvxrX/xXyXEZY9IvfTIYvNQ==","shasum":"23c0cd9a9787894a4d499730e5f0856638971401","tarball":"https://registry.npmjs.org/@aicadev/toast-message/-/toast-message-1.0.3.tgz","fileCount":2,"unpackedSize":4960,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIQDmIg0Yhd4su4cZO+MwE8vY+CD8uEeogs+hX8x/PGsx+AIgXc69+RoLvUHZcKrW/MXwpUMfr8w+drgg4h43DG+U/mQ="}]},"_npmUser":{"name":"aicadev","email":"aitor.cachero@gmail.com"},"directories":{},"maintainers":[{"name":"aicadev","email":"aitor.cachero@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/toast-message_1.0.3_1747928849488_0.7342685991472884"},"_hasShrinkwrap":false}},"time":{"created":"2025-05-22T09:19:58.809Z","modified":"2025-05-22T15:47:29.817Z","1.0.0":"2025-05-22T09:19:59.062Z","1.0.1":"2025-05-22T09:22:12.895Z","1.0.2":"2025-05-22T09:25:56.300Z","1.0.3":"2025-05-22T15:47:29.659Z"},"bugs":{"url":"https://github.com/aicadev/toast-message/issues"},"author":{"name":"aicadev"},"license":"MIT","homepage":"https://aitorcachero.github.io/aicadev-toast-message/","keywords":["toast","notification","web-component","custom-element","javascript","ui","component"],"repository":{"type":"git","url":"git+https://github.com/aicadev/toast-message.git"},"description":"🔔 Lightweight and framework-agnostic Web Component for toast notifications","maintainers":[{"name":"aicadev","email":"aitor.cachero@gmail.com"}],"readme":"# @aicadev/toast-message\r\n\r\n> 🔔 Lightweight and framework-agnostic Web Component for toast notifications.\r\n\r\nThis package provides a simple, customizable `<toast-message>` Web Component that works with any frontend stack (Vanilla JS, React, Vue, Astro, etc.).\r\n\r\nDemo: https://aitorcachero.github.io/aicadev-toast-message/\r\n\r\n---\r\n\r\n## ✨ Features\r\n\r\n- ✅ **No dependencies**\r\n- ✅ **Highly customizable** with multiple attributes\r\n- ✅ **Works with any framework** (or none)\r\n- ✅ **Lightweight and fast**\r\n- ✅ **Easy to style or extend**\r\n- ✅ **Built with Web Standards**\r\n- ✅ **HTML support in messages**\r\n- ✅ **Flexible positioning**\r\n- ✅ **Accessible**\r\n- ✅ **Smooth animations**\r\n\r\n---\r\n\r\n## 🚀 Installation\r\n\r\n```bash\r\nnpm install @aicadev/toast-message\r\n```\r\n\r\n---\r\n\r\n## 🧪 Basic Usage\r\n\r\nImport the component in your project:\r\n\r\n```js\r\nimport '@aicadev/toast-message';\r\n```\r\n\r\nThen use it like this:\r\n\r\n```js\r\n// Create and show a toast\r\nfunction showToast(\r\n  message,\r\n  type = 'info',\r\n  duration = 3000,\r\n  position = 'top-right',\r\n  closeable = false\r\n) {\r\n  const toast = document.createElement('toast-message');\r\n  toast.innerHTML = message;\r\n  toast.setAttribute('type', type);\r\n  toast.setAttribute('duration', duration);\r\n  toast.setAttribute('position', position);\r\n  if (closeable) {\r\n    toast.setAttribute('closeable', '');\r\n  }\r\n  document.body.appendChild(toast);\r\n}\r\n\r\n// Usage examples\r\nshowToast('Operation successful!', 'success');\r\nshowToast(\r\n  '<strong>Error:</strong> Something went wrong',\r\n  'error',\r\n  5000,\r\n  'bottom-center',\r\n  true\r\n);\r\n```\r\n\r\n---\r\n\r\n## 🛠 Attributes\r\n\r\n| Attribute   | Type    | Default     | Description                                                    |\r\n| ----------- | ------- | ----------- | -------------------------------------------------------------- |\r\n| `type`      | string  | `info`      | Defines the toast style: `info`, `success`, `error`, `warning` |\r\n| `duration`  | number  | `3000`      | Time in milliseconds before toast disappears                   |\r\n| `position`  | string  | `top-right` | Position of the toast on the screen                            |\r\n| `closeable` | boolean | false       | Shows a button to manually close the toast                     |\r\n\r\nAvailable Positions\r\n\r\n- top-right\r\n- top-left\r\n- top-center\r\n- bottom-right\r\n- bottom-left\r\n- bottom-center\r\n\r\n---\r\n\r\n## 📦 Build & Development (for contributors)\r\n\r\n```bash\r\ngit clone https://github.com/your-username/toast-message.git\r\ncd toast-message\r\nnpm install\r\nnpm run dev        # Start dev server\r\nnpm run build      # Output build to /dist\r\n```\r\n\r\nBuilt using [Vite](https://vitejs.dev/). Output is bundled as an ES Module ready for direct use.\r\n\r\n---\r\n\r\n## 📤 Publishing\r\n\r\nIf you're the package maintainer:\r\n\r\n```bash\r\nnpm login\r\nnpm run build\r\nnpm publish --access public\r\n```\r\n\r\n---\r\n\r\n## 🔧 Example in React (or other frameworks)\r\n\r\n```jsx\r\nimport '@aicadev/toast-message';\r\n\r\nfunction App() {\r\n  const handleClick = () => {\r\n    const toast = document.createElement('toast-message');\r\n    toast.innerHTML = '<strong>React</strong> triggered this!';\r\n    toast.setAttribute('type', 'success');\r\n    toast.setAttribute('duration', '4000');\r\n    toast.setAttribute('position', 'top-center');\r\n    toast.setAttribute('closeable', '');\r\n    document.body.appendChild(toast);\r\n  };\r\n\r\n  return <button onClick={handleClick}>Show Toast</button>;\r\n}\r\n```\r\n\r\n---\r\n\r\n## 🎨 ## Customization\r\n\r\nThe component is encapsulated with Shadow DOM, but you can fork or extend the component easily to change:\r\n\r\n- Animations\r\n- Colors\r\n- Icons\r\n- Styles\r\n- Positions\r\n- Behavior\r\n\r\n---\r\n\r\n## 🪪 License\r\n\r\nMIT License — Copyright © 2025 [@aicadev](https://www.npmjs.com/~aicadev)\r\n\r\n---\r\n\r\n## 💬 Support / Feedback\r\n\r\nIf you find any bugs or want improvements, feel free to [open an issue](https://github.com/your-username/toast-message/issues) or contribute via pull request.\r\n","readmeFilename":"readme.MD"}