{"_id":"@alvearium/react-bubble-toast","_rev":"4-2cb4be5ba4cbc76a9d8386dd07d00f53","name":"@alvearium/react-bubble-toast","dist-tags":{"latest":"0.0.7"},"versions":{"0.0.4":{"name":"@alvearium/react-bubble-toast","version":"0.0.4","keywords":["react","toast","notifications","alvearium","react-js","reactjs","frontend","ui","snackbar"],"author":{"name":"alvearium"},"license":"MIT","_id":"@alvearium/react-bubble-toast@0.0.4","maintainers":[{"name":"thigo","email":"thiagooliveracorreo@gmail.com"}],"dist":{"shasum":"0986d08450bd857a78877152a33313608c9739a8","tarball":"https://registry.npmjs.org/@alvearium/react-bubble-toast/-/react-bubble-toast-0.0.4.tgz","fileCount":7,"integrity":"sha512-CmyHmIsjFe05GazKaUpcdY4m/DGHEsOZ30Cs5Wg52XessGvnbmV51QxZhmjTdZtxPI2pUbwcdgH7Wczrq0EDeg==","signatures":[{"sig":"MEUCICDkGnVSXp8zFlJbFHgWEY1q0Wa5K6UirgTh39W/InkZAiEAxLDjOECxQfQcfB799f5s7PNI2MOUR8f4BovSpvFHuIE=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":65883},"main":"./dist/index.js","types":"./dist/index.d.ts","module":"./dist/index.mjs","scripts":{"dev":"vite","test":"echo \"Error: no test specified\" && exit 1","build":"rollup -c --bundleConfigAsCjs"},"_npmUser":{"name":"thigo","email":"thiagooliveracorreo@gmail.com"},"_npmVersion":"11.12.1","description":"Librería de prueba React","directories":{},"_nodeVersion":"22.22.1","dependencies":{"goober":"^2.1.18"},"_hasShrinkwrap":false,"devDependencies":{"vite":"^8.0.1","tslib":"^2.8.1","eslint":"^9.39.4","csstype":"^3.2.3","globals":"^17.4.0","@eslint/js":"^9.39.4","typescript":"^6.0.2","@types/node":"^24.12.0","@types/react":"^19.2.14","@types/react-dom":"^19.2.3","rollup-plugin-dts":"^6.4.1","typescript-eslint":"^8.57.0","@vitejs/plugin-react":"^6.0.1","@rollup/plugin-terser":"^1.0.0","rollup-plugin-postcss":"^4.0.2","@rollup/plugin-commonjs":"^29.0.2","@rollup/plugin-typescript":"^12.3.0","eslint-plugin-react-hooks":"^7.0.1","@rollup/plugin-node-resolve":"^16.0.3","eslint-plugin-react-refresh":"^0.5.2","rollup-plugin-peer-deps-external":"^2.2.4"},"peerDependencies":{"react":"^18.0.0","react-dom":"^18.0.0"},"_npmOperationalInternal":{"tmp":"tmp/react-bubble-toast_0.0.4_1775100668296_0.8657904210873646","host":"s3://npm-registry-packages-npm-production"}},"0.0.5":{"name":"@alvearium/react-bubble-toast","version":"0.0.5","keywords":["react","toast","notifications","alvearium","react-js","reactjs","frontend","ui","snackbar"],"author":{"name":"alvearium"},"license":"MIT","_id":"@alvearium/react-bubble-toast@0.0.5","maintainers":[{"name":"thigo","email":"thiagooliveracorreo@gmail.com"}],"dist":{"shasum":"30f238533f11cabfa1535ab57f5fcee7b5427774","tarball":"https://registry.npmjs.org/@alvearium/react-bubble-toast/-/react-bubble-toast-0.0.5.tgz","fileCount":7,"integrity":"sha512-9i4FdsLaWnFhpaKEECqDbx+LO2p9GFqyEs/TxWRy72gOYXyX29Dbjp5jFEq4gtn5D8DLKk29YFpD6UyVXnChKg==","signatures":[{"sig":"MEQCIDpFi9lZdEonoZPC4lLA2HKX/7d5xDFndANkgojbALM/AiAUiIZT0IjBw47lCUA3mrSDnIWlQZnzwV8eYlppp3TWZA==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":65914},"main":"./dist/index.js","types":"./dist/index.d.ts","module":"./dist/index.mjs","scripts":{"dev":"vite","test":"echo \"Error: no test specified\" && exit 1","build":"rollup -c --bundleConfigAsCjs"},"_npmUser":{"name":"thigo","email":"thiagooliveracorreo@gmail.com"},"_npmVersion":"11.12.1","description":"A tool to add notifications to your ReactJS application.","directories":{},"_nodeVersion":"22.22.1","dependencies":{"goober":"^2.1.18"},"_hasShrinkwrap":false,"devDependencies":{"vite":"^8.0.1","tslib":"^2.8.1","eslint":"^9.39.4","csstype":"^3.2.3","globals":"^17.4.0","@eslint/js":"^9.39.4","typescript":"^6.0.2","@types/node":"^24.12.0","@types/react":"^19.2.14","@types/react-dom":"^19.2.3","rollup-plugin-dts":"^6.4.1","typescript-eslint":"^8.57.0","@vitejs/plugin-react":"^6.0.1","@rollup/plugin-terser":"^1.0.0","rollup-plugin-postcss":"^4.0.2","@rollup/plugin-commonjs":"^29.0.2","@rollup/plugin-typescript":"^12.3.0","eslint-plugin-react-hooks":"^7.0.1","@rollup/plugin-node-resolve":"^16.0.3","eslint-plugin-react-refresh":"^0.5.2","rollup-plugin-peer-deps-external":"^2.2.4"},"peerDependencies":{"react":"^18.0.0","react-dom":"^18.0.0"},"_npmOperationalInternal":{"tmp":"tmp/react-bubble-toast_0.0.5_1775100787965_0.6541560154509403","host":"s3://npm-registry-packages-npm-production"}},"0.0.6":{"name":"@alvearium/react-bubble-toast","version":"0.0.6","keywords":["react","toast","notifications","alvearium","react-js","reactjs","frontend","ui","snackbar"],"author":{"name":"alvearium"},"license":"MIT","_id":"@alvearium/react-bubble-toast@0.0.6","maintainers":[{"name":"thigo","email":"thiagooliveracorreo@gmail.com"}],"dist":{"shasum":"317269fa0ce6b8dbb00e8004b9288f228841afeb","tarball":"https://registry.npmjs.org/@alvearium/react-bubble-toast/-/react-bubble-toast-0.0.6.tgz","fileCount":7,"integrity":"sha512-dOeMb/nqcPvLfo9QpkgiTALB4ib4m3v8RS6qc2blG7UFuIW+ihZTqYGJTQJ28Qk8xEjAzSkNGVesXuRVKOODNA==","signatures":[{"sig":"MEUCIQDqXyQG9BPCsiIpcfkkWHqQuLdxZq3058FIWFK3KfcITAIgViBqnl/053wcteKvgG89rz5GsYMkaqBwseaYK4CP6GA=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":65903},"main":"./dist/index.js","types":"./dist/index.d.ts","module":"./dist/index.mjs","scripts":{"dev":"vite","test":"echo \"Error: no test specified\" && exit 1","build":"rollup -c --bundleConfigAsCjs"},"_npmUser":{"name":"thigo","email":"thiagooliveracorreo@gmail.com"},"_npmVersion":"11.12.1","description":"A tool to add notifications to your ReactJS application.","directories":{},"_nodeVersion":"22.22.1","dependencies":{"goober":"^2.1.18"},"_hasShrinkwrap":false,"devDependencies":{"vite":"^8.0.1","tslib":"^2.8.1","eslint":"^9.39.4","csstype":"^3.2.3","globals":"^17.4.0","@eslint/js":"^9.39.4","typescript":"^6.0.2","@types/node":"^24.12.0","@types/react":"^19.2.14","@types/react-dom":"^19.2.3","rollup-plugin-dts":"^6.4.1","typescript-eslint":"^8.57.0","@vitejs/plugin-react":"^6.0.1","@rollup/plugin-terser":"^1.0.0","rollup-plugin-postcss":"^4.0.2","@rollup/plugin-commonjs":"^29.0.2","@rollup/plugin-typescript":"^12.3.0","eslint-plugin-react-hooks":"^7.0.1","@rollup/plugin-node-resolve":"^16.0.3","eslint-plugin-react-refresh":"^0.5.2","rollup-plugin-peer-deps-external":"^2.2.4"},"peerDependencies":{"react":"^18.0.0","react-dom":"^18.0.0"},"_npmOperationalInternal":{"tmp":"tmp/react-bubble-toast_0.0.6_1775101488935_0.8101578350017813","host":"s3://npm-registry-packages-npm-production"}},"0.0.7":{"name":"@alvearium/react-bubble-toast","version":"0.0.7","description":"A tool to add notifications to your ReactJS application.","main":"./dist/index.js","module":"./dist/index.mjs","types":"./dist/index.d.ts","scripts":{"build":"rollup -c --bundleConfigAsCjs","dev":"vite","test":"echo \"Error: no test specified\" && exit 1"},"author":{"name":"alvearium"},"license":"MIT","peerDependencies":{"react":"^18.0.0","react-dom":"^18.0.0"},"dependencies":{"goober":"^2.1.18"},"keywords":["react","toast","notifications","alvearium","react-js","reactjs","frontend","ui","snackbar"],"devDependencies":{"@eslint/js":"^9.39.4","@rollup/plugin-commonjs":"^29.0.2","@rollup/plugin-node-resolve":"^16.0.3","@rollup/plugin-terser":"^1.0.0","@rollup/plugin-typescript":"^12.3.0","@types/node":"^24.12.0","@types/react":"^19.2.14","@types/react-dom":"^19.2.3","@vitejs/plugin-react":"^6.0.1","eslint":"^9.39.4","eslint-plugin-react-hooks":"^7.0.1","eslint-plugin-react-refresh":"^0.5.2","globals":"^17.4.0","rollup-plugin-dts":"^6.4.1","rollup-plugin-peer-deps-external":"^2.2.4","tslib":"^2.8.1","typescript":"^6.0.2","typescript-eslint":"^8.57.0","csstype":"^3.2.3","vite":"^8.0.1","rollup-plugin-postcss":"^4.0.2"},"_id":"@alvearium/react-bubble-toast@0.0.7","_nodeVersion":"22.22.1","_npmVersion":"11.12.0","dist":{"integrity":"sha512-5cPJgoU8LGglu7BVX2AuSPD7MgO6oThSgF/klS2iERVc1sA9bDwmjPq+TV9pzIqfHlPeCYnRXfE2YJ4p03YOZw==","shasum":"ace6825425769e8f74812b396c241a483b289af7","tarball":"https://registry.npmjs.org/@alvearium/react-bubble-toast/-/react-bubble-toast-0.0.7.tgz","fileCount":5,"unpackedSize":18094,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIQD2qYX1NluCHzPdI79R5u3ygp83enY9mDwI04ibk13FyQIgc4iFn0O5DrDF/Mx1hSczCyKnksrD/gBbOOQB8T7RxZo="}]},"_npmUser":{"name":"thigo","email":"thiagooliveracorreo@gmail.com"},"directories":{},"maintainers":[{"name":"thigo","email":"thiagooliveracorreo@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/react-bubble-toast_0.0.7_1775157880014_0.9783772112440652"},"_hasShrinkwrap":false}},"time":{"created":"2026-04-02T03:31:08.157Z","modified":"2026-04-02T19:24:40.301Z","0.0.4":"2026-04-02T03:31:08.440Z","0.0.5":"2026-04-02T03:33:08.142Z","0.0.6":"2026-04-02T03:44:49.100Z","0.0.7":"2026-04-02T19:24:40.171Z"},"author":{"name":"alvearium"},"license":"MIT","keywords":["react","toast","notifications","alvearium","react-js","reactjs","frontend","ui","snackbar"],"description":"A tool to add notifications to your ReactJS application.","maintainers":[{"name":"thigo","email":"thiagooliveracorreo@gmail.com"}],"readme":"\r\n# react-bubble-toast\r\nA tool to add notifications to your ReactJS application.\r\n\r\n# Installation\r\n```\r\n$ pnpm i react-bubble-toast\r\n$ npm i --save react-bubble-toast\r\n```\r\n```jsx\r\n// Layout.tsx\r\nimport { Bubbler } from 'react-bubble-toast';\r\n\r\nfunction Layout() {\r\n\r\n    return (\r\n        <>\r\n            <Bubbler />\r\n        </>\r\n    )\r\n}\r\n\r\nexport default Layout;\r\n```\r\n\r\n# What to call a bubble\r\n```jsx\r\nimport { bubble } from 'react-bubble-toast';\r\n\r\nfunction Page() {\r\n    return (\r\n        <div>\r\n            <button\r\n            onClick={() => {\r\n                bubble('Your message here', {\r\n                    style: {\r\n                        borderRadius: 9999\r\n                    }\r\n                })\r\n            }}\r\n            >Push Toast</button>\r\n        </div>\r\n    )\r\n}\r\n```\r\n# API Reference\r\n```jsx \r\n<Bubbler position toastBar options={}/>\r\n```\r\n|Prop|Type| Default|\r\n|--|--|--|\r\n|`position`|`'bottom-left'  ,  'bottom-right',  'bottom-center',  'bottom-top',  'top-left',  'top-right',  'top-center'`|`bottom-right`|\r\n|`toastBar`|`CustomContainer`|`null`\r\n|`options`|`{ duration?: number; overlay?: boolean; containerClassName?: string; containerStyle?: React.CSSProperties; reverseOrder?: boolean }`|`undefined`|\r\n# How to create your own bubble\r\n\r\n```jsx\r\n// App.tsx\r\nimport { Bubbler, type CustomContainer } from 'react-bubble-toast';\r\n\r\nfunction App() {\r\n\r\n    return (\r\n        <>\r\n            <Bubbler\r\n            toastBar={(t: CustomContainer) => (\r\n                <div className={`${t.visible ? 'animation-in' : 'animation-out'} bg-white rounded-lg p-2 shadow-sm shadow-[rgba(0, 0, 0, 0.26)] text-center font-geist cursor-pointer text-black dark`}>\r\n                    {t.value}\r\n                </div>\r\n            )}\r\n            />\r\n        </>\r\n    )\r\n}\r\nexport default App;\r\n```\r\n","readmeFilename":"readme.md"}