{"_id":"vue-confetti-explosion","_rev":"4-9741594bea8987224f53f78fdc81a555","name":"vue-confetti-explosion","dist-tags":{"latest":"1.0.2"},"versions":{"0.1.0":{"name":"vue-confetti-explosion","version":"0.1.0","description":"","main":"dist/confetti-explosion.ssr.js","browser":"dist/confetti-explosion.esm.js","module":"dist/confetti-explosion.esm.js","unpkg":"dist/confetti-explosion.min.js","types":"dist/types/src/entry.esm.d.ts","sideEffects":false,"scripts":{"serve":"vue-cli-service serve dev/serve.ts","prebuild":"rimraf ./dist","build":"cross-env NODE_ENV=production rollup --config build/rollup.config.js","build:ssr":"cross-env NODE_ENV=production rollup --config build/rollup.config.js --format cjs","build:es":"cross-env NODE_ENV=production rollup --config build/rollup.config.js --format es","build:unpkg":"cross-env NODE_ENV=production rollup --config build/rollup.config.js --format iife","postbuild":"rimraf ./dist/types/dev ./dist/types/src/entry.d.ts"},"dependencies":{},"devDependencies":{"@babel/core":"^7.14.6","@babel/preset-env":"^7.14.7","@babel/preset-typescript":"^7.14.5","@rollup/plugin-alias":"^3.1.2","@rollup/plugin-babel":"^5.3.0","@rollup/plugin-commonjs":"^14.0.0","@rollup/plugin-node-resolve":"^9.0.0","@rollup/plugin-replace":"^2.4.2","@vue/cli-plugin-babel":"^4.5.13","@vue/cli-plugin-typescript":"^4.5.13","@vue/cli-service":"^4.5.13","@vue/compiler-sfc":"^3.0.11","@zerollup/ts-transform-paths":"^1.7.18","cross-env":"^7.0.3","minimist":"^1.2.5","postcss":"^8.2.10","rimraf":"^3.0.2","rollup":"^2.52.8","rollup-plugin-postcss":"^4.0.0","rollup-plugin-terser":"^7.0.2","rollup-plugin-vue":"^6.0.0","rollup-plugin-typescript2":"^0.30.0","ttypescript":"^1.5.12","typescript":"^4.0.3","vue":"^3.2.22"},"peerDependencies":{"vue":"^3.0.5"},"engines":{"node":">=12"},"gitHead":"a4d1b092b2d1316c9e23c95cc0b0ed348cea9d38","_id":"vue-confetti-explosion@0.1.0","_nodeVersion":"14.17.5","_npmVersion":"6.14.14","dist":{"integrity":"sha512-LRE0pB5cfA7FoauE9T8kqWcscNiNzJoxe9DVpLIzPa/dh8Cz4WlLOFifi6FJzGRC+8dZDjbkmYYqX7rPVehl0A==","shasum":"d774a0d478ee39c0d6db80a5e1fcc97d4f245d79","tarball":"https://registry.npmjs.org/vue-confetti-explosion/-/vue-confetti-explosion-0.1.0.tgz","fileCount":8,"unpackedSize":49773,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhnq0iCRA9TVsSAnZWagAA8rsP/RaA0N+sGsVaJQSpTftP\ncEicIhST3mWVDxnjelYb/DpNPeFsIPOfRwmcP8hgF0ZU9Lf06V/E380U2jTi\nb45xXU5OYLF87QdhZ+NnA16a1zIhqUkU6v9AThCOsPp9uYwbus/eZjMM+p5x\nRD/ZwAhfCF3+dUKH/CfRoJeNGxXVWFGNn6Nm8uB070Ux87DDlqNKYF9O4Ekp\n/lTbagnnJDtwr9u8z3D5j6dfHTBI9H0bInZNBvwVbaK3iQNcQnmVkO2QycJp\nBrQaYKePY3hilpZd2AaLCOKpdlfW0v65VcZc8Z11h+4Ai0N+ET3OpgaCFXSl\nxO4zrQ6Od7+LHV/NbQefLNM59ew9qltrgHcuRFBUiXCE6e9WBjofiozCrL4B\nWACiAZOqUuoASIt0NUJ1qoQNv3zc89J9VR/z9awOpwkQyNuK6+BeI+tDYc3S\nMt1RHu7yItV54NX3bKe3aJFMX526Af4mLYa/o26htZJhfR5IWYiRVwPZkmZ7\nSuLAYWIH0FiezakxvFQ4RjCGs4sm9vTWXO4cVNQYYVp6jB62Rs7c0p/JN7gX\n9stNR52XoojZocvEqLl0h7fMa8qOndxLbZ4qTYp+eI0h6yNYALuZAwXCis50\nBcDh6CM4H+AUeKFOwkdf+YIhmHN99iPov/DOiC/jAeoqaGdB12OL5HA20Hl8\nREvS\r\n=zIzD\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIAwb8QLHzQ/4ue5eQOprjG5ASNCMHI/DdGZVcwPIsXe9AiEAzxGsnjxKWCBmcTifPQdCt8TqfYFgZUrAax9hILebp9k="}]},"_npmUser":{"name":"valgeirb","email":"valgeirb@gmail.com"},"directories":{},"maintainers":[{"name":"valgeirb","email":"valgeirb@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-confetti-explosion_0.1.0_1637788962201_0.139138319366648"},"_hasShrinkwrap":false},"1.0.0":{"name":"vue-confetti-explosion","version":"1.0.0","description":"> This library is the Vue 3 port of [svelte-confetti-explosion](https://www.npmjs.com/package/svelte-confetti-explosion) which in turn is ported from the [@reonomy/react-confetti-explosion](https://www.npmjs.com/package/@reonomy/react-confetti-explosion) ","main":"dist/confetti-explosion.ssr.js","browser":"dist/confetti-explosion.esm.js","module":"dist/confetti-explosion.esm.js","unpkg":"dist/confetti-explosion.min.js","types":"dist/types/src/entry.esm.d.ts","sideEffects":false,"scripts":{"serve":"vue-cli-service serve dev/serve.ts","prebuild":"rimraf ./dist","build":"cross-env NODE_ENV=production rollup --config build/rollup.config.js","build:ssr":"cross-env NODE_ENV=production rollup --config build/rollup.config.js --format cjs","build:es":"cross-env NODE_ENV=production rollup --config build/rollup.config.js --format es","build:unpkg":"cross-env NODE_ENV=production rollup --config build/rollup.config.js --format iife","postbuild":"rimraf ./dist/types/dev ./dist/types/src/entry.d.ts"},"dependencies":{},"devDependencies":{"@babel/core":"^7.14.6","@babel/preset-env":"^7.14.7","@babel/preset-typescript":"^7.14.5","@rollup/plugin-alias":"^3.1.2","@rollup/plugin-babel":"^5.3.0","@rollup/plugin-commonjs":"^14.0.0","@rollup/plugin-node-resolve":"^9.0.0","@rollup/plugin-replace":"^2.4.2","@vue/cli-plugin-babel":"^4.5.13","@vue/cli-plugin-typescript":"^4.5.13","@vue/cli-service":"^4.5.13","@vue/compiler-sfc":"^3.0.11","@zerollup/ts-transform-paths":"^1.7.18","cross-env":"^7.0.3","minimist":"^1.2.5","postcss":"^8.2.10","rimraf":"^3.0.2","rollup":"^2.52.8","rollup-plugin-postcss":"^4.0.0","rollup-plugin-terser":"^7.0.2","rollup-plugin-vue":"^6.0.0","rollup-plugin-typescript2":"^0.30.0","ttypescript":"^1.5.12","typescript":"^4.0.3","vue":"^3.2.22"},"peerDependencies":{"vue":"^3.0.5"},"engines":{"node":">=12"},"gitHead":"986780f45f4b277ae6db5fcd22d287858d3d98be","_id":"vue-confetti-explosion@1.0.0","_nodeVersion":"14.17.5","_npmVersion":"6.14.14","dist":{"integrity":"sha512-kefT0V17mYjMGXJ01yYrvQFpFtilo//jECaJDWupjCIBogipHBkNKFIU5y5POu+0ZPkNhoTjn69haUNENvkevA==","shasum":"9417477df257ab27ed823edafc40fd01fc9b6d08","tarball":"https://registry.npmjs.org/vue-confetti-explosion/-/vue-confetti-explosion-1.0.0.tgz","fileCount":9,"unpackedSize":54320,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhnrYLCRA9TVsSAnZWagAA7XUP/At03sVywuaqqh55aAVD\nhsga4HYsIzVD/i7jAV3Q+fj1ryo02wH6UWFfKsgJWHEk7CCmBhvRgidUheXw\ngXjExHO4HrhDDe6R3Snm/5kEOi6nRRAlCXUAL1Lu+0GreclHIbYoEZRsBSDf\nlCNBUI6GnFGsqtxnViORFKZuPB7Q4UhjOpOmF1WO1ADWdrQs/Cg6oPGkoRlF\nLhzD3Kly/7bcmnn8kD1sVri1761dfgXzjEbIR+J2c4a0pXTI7m5pLb2kNyUT\nGQHxMvv5N9rQZUsKoMDHkiHaIx/CqtLqAQmU6ofGg1+gmd+1oHV0ebz0klpE\nlrS2HqKdw9Uqz04SxrZWLKkVyD+JAWlyPcKDq6CPIYVLw8MnK+taBFbGjeaA\npaRmjgJF5OCd7LymZb7TfZLSPGbq+CLZw21FnJvJJ39TXYrNxYumKLcrrYLd\n//uUk4dJDiL3ZOD28GpDfBNyrabM1zrCh1l7XrYgl35Mn2B3L2jVQ7FE89mk\nrY58u3ktUCqOLA3gUK9U3QhfPFTdZrVBZQ8KkXE85TIDoiTspXejU2agYrhK\n5fXiv0aYKF81LJqlyjFw5lN2//m5UCaPVMqgetjDk/l9/KbJAI61RdS3Gryk\nYbSqnDK2M32ptW6aYdygsVLpk/Vc9qkfysA5H1uaqyNhPoTRN9901JrgWlMI\n+TH8\r\n=NwWf\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDcOJlj1xmAIpQ3axbUkxYZX22YyWvCbv9sBZuRuNKthAIhAI9EgvBX4Mc7C/ivCFsEz1wURMKYnXbOqFPvuqLOF5Hq"}]},"_npmUser":{"name":"valgeirb","email":"valgeirb@gmail.com"},"directories":{},"maintainers":[{"name":"valgeirb","email":"valgeirb@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-confetti-explosion_1.0.0_1637791243101_0.5762216034238945"},"_hasShrinkwrap":false},"1.0.1":{"name":"vue-confetti-explosion","version":"1.0.1","description":"Confetti explosion in Vue 3 🎉🎊","author":{"name":"Valgeir Björnsson","email":"valgeir@hey.com","url":"https://github.com/valgeirb"},"repository":{"type":"git","url":"git+https://github.com/valgeirb/vue-confetti-explosion.git"},"keywords":["confetti","party","fun","badass","badassery","vue","vue3","small","tiny","performant"],"main":"dist/confetti-explosion.ssr.js","browser":"dist/confetti-explosion.esm.js","module":"dist/confetti-explosion.esm.js","unpkg":"dist/confetti-explosion.min.js","types":"dist/types/src/entry.esm.d.ts","sideEffects":false,"scripts":{"serve":"vue-cli-service serve dev/serve.ts","prebuild":"rimraf ./dist","build":"cross-env NODE_ENV=production rollup --config build/rollup.config.js","build:ssr":"cross-env NODE_ENV=production rollup --config build/rollup.config.js --format cjs","build:es":"cross-env NODE_ENV=production rollup --config build/rollup.config.js --format es","build:unpkg":"cross-env NODE_ENV=production rollup --config build/rollup.config.js --format iife","postbuild":"rimraf ./dist/types/dev ./dist/types/src/entry.d.ts"},"dependencies":{},"devDependencies":{"@babel/core":"^7.14.6","@babel/preset-env":"^7.14.7","@babel/preset-typescript":"^7.14.5","@rollup/plugin-alias":"^3.1.2","@rollup/plugin-babel":"^5.3.0","@rollup/plugin-commonjs":"^14.0.0","@rollup/plugin-node-resolve":"^9.0.0","@rollup/plugin-replace":"^2.4.2","@vue/cli-plugin-babel":"^4.5.13","@vue/cli-plugin-typescript":"^4.5.13","@vue/cli-service":"^4.5.13","@vue/compiler-sfc":"^3.0.11","@zerollup/ts-transform-paths":"^1.7.18","cross-env":"^7.0.3","minimist":"^1.2.5","postcss":"^8.2.10","rimraf":"^3.0.2","rollup":"^2.52.8","rollup-plugin-postcss":"^4.0.0","rollup-plugin-terser":"^7.0.2","rollup-plugin-vue":"^6.0.0","rollup-plugin-typescript2":"^0.30.0","ttypescript":"^1.5.12","typescript":"^4.0.3","vue":"^3.2.22"},"peerDependencies":{"vue":"^3.0.5"},"engines":{"node":">=12"},"gitHead":"0ca58f01c48870d2ec1d4f74ec62d698a2db74e2","bugs":{"url":"https://github.com/valgeirb/vue-confetti-explosion/issues"},"homepage":"https://github.com/valgeirb/vue-confetti-explosion#readme","_id":"vue-confetti-explosion@1.0.1","_nodeVersion":"14.17.5","_npmVersion":"6.14.14","dist":{"integrity":"sha512-xQ42/XJtFElKBgZQ01XzPHO8dtrrAWlccdnC3YmE/rewiXObNmlLE2YZXo2wrdj0pU+SD8Q+VZ33hygcvZu9dg==","shasum":"55eeb7cee4fca6d38d6549fd87d262baf83ea097","tarball":"https://registry.npmjs.org/vue-confetti-explosion/-/vue-confetti-explosion-1.0.1.tgz","fileCount":9,"unpackedSize":54697,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhnrwZCRA9TVsSAnZWagAAHVkP/R37fwS7tMmP2Pu7abv3\nNrtcAGxu8bS5Apinb26Pz2yAikxvF6OclGAdjsowjWTwdOiFE+L/D2ot1M1M\noSv4E8P5V1R5E0GTJZfO2iv8i8iV9qqrKzCYFIEi8Z/s1Zcrnfa4tluxKRJC\nONtUQX5xp8OoMcsZTHEC9JmHkivSm66P6TC0Xg5jdoc9spNuuEe8J4jzT9vk\nIUC9jubdHqsbAoygjxRzebEqIe7o6GZFWWQPnmYlC6QkaNx/g8bLTQsUBImv\nnkDz8mZJGJyLDU6eFPQtjlHlWNkZrwHRmryV8uFWuBjridEl+xkq0Y3Q4dLD\nnFgKqe8nn89qL9KTORj1UDyNiA6BmZMB49OXW8OblXikSHAs/SuqU0EM0LQp\n1pJHSZSrru/21YCjU8RTU+Xj9RM17f6gxZlrmqn73AQFSrRfRN88dx3PqYYA\njmf5CMxeGXCtzlcgusToJa1JiD3ldFaPJbRE9vQHI9AS8lMosVc0iJXooCt3\nceLBucYLhAMo5f+d61m58rbBhBYtUu9Wx5NbsY6aLws+2Hxjzj55R7BOHO39\nceIxPwoJ6X4wD6Hnuy5FHWNoYDrNEpexByRQA5rgKxurqLFN33C48jgj/tVq\ntITxPoiotdF8LpJAVuHbDFuQu+XUte9v2uuNJAvrUAT9C+k2DukOQ1FmUOSt\nyvDs\r\n=dpxB\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIAYiq0apzXMLUlRm5ioibtUpE6zkyZbXQBoWL6dvWYNNAiEAk/Zjm++XUJv3pyVOeFuOUCNsR3JkKnvMPG+3mTDr320="}]},"_npmUser":{"name":"valgeirb","email":"valgeirb@gmail.com"},"directories":{},"maintainers":[{"name":"valgeirb","email":"valgeirb@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-confetti-explosion_1.0.1_1637792793624_0.6638204912095214"},"_hasShrinkwrap":false},"1.0.2":{"name":"vue-confetti-explosion","version":"1.0.2","description":"Confetti explosion in Vue 3 🎉🎊","author":{"name":"Valgeir Björnsson","email":"valgeir@hey.com","url":"https://github.com/valgeirb"},"repository":{"type":"git","url":"git+https://github.com/valgeirb/vue-confetti-explosion.git"},"keywords":["confetti","party","fun","badass","badassery","vue","vue3","small","tiny","performant"],"main":"dist/confetti-explosion.ssr.js","browser":"dist/confetti-explosion.esm.js","module":"dist/confetti-explosion.esm.js","unpkg":"dist/confetti-explosion.min.js","types":"dist/types/src/entry.esm.d.ts","sideEffects":false,"scripts":{"serve":"vue-cli-service serve dev/serve.ts","prebuild":"rimraf ./dist","build":"cross-env NODE_ENV=production rollup --config build/rollup.config.js","build:ssr":"cross-env NODE_ENV=production rollup --config build/rollup.config.js --format cjs","build:es":"cross-env NODE_ENV=production rollup --config build/rollup.config.js --format es","build:unpkg":"cross-env NODE_ENV=production rollup --config build/rollup.config.js --format iife","postbuild":"rimraf ./dist/types/dev ./dist/types/src/entry.d.ts"},"dependencies":{},"devDependencies":{"@babel/core":"^7.14.6","@babel/preset-env":"^7.14.7","@babel/preset-typescript":"^7.14.5","@rollup/plugin-alias":"^3.1.2","@rollup/plugin-babel":"^5.3.0","@rollup/plugin-commonjs":"^14.0.0","@rollup/plugin-node-resolve":"^9.0.0","@rollup/plugin-replace":"^2.4.2","@vue/cli-plugin-babel":"^4.5.13","@vue/cli-plugin-typescript":"^4.5.13","@vue/cli-service":"^4.5.13","@vue/compiler-sfc":"^3.0.11","@zerollup/ts-transform-paths":"^1.7.18","cross-env":"^7.0.3","minimist":"^1.2.5","postcss":"^8.2.10","rimraf":"^3.0.2","rollup":"^2.52.8","rollup-plugin-postcss":"^4.0.0","rollup-plugin-terser":"^7.0.2","rollup-plugin-vue":"^6.0.0","rollup-plugin-typescript2":"^0.30.0","ttypescript":"^1.5.12","typescript":"^4.0.3","vue":"^3.2.22"},"peerDependencies":{"vue":"^3.0.5"},"engines":{"node":">=12"},"gitHead":"2e5ac842397043c42a03e98eca59fc6f2f92fd91","bugs":{"url":"https://github.com/valgeirb/vue-confetti-explosion/issues"},"homepage":"https://github.com/valgeirb/vue-confetti-explosion#readme","_id":"vue-confetti-explosion@1.0.2","_nodeVersion":"16.14.2","_npmVersion":"8.5.0","dist":{"integrity":"sha512-80OboM3/6BItIoZ6DpNcZFqGpF607kjIVc5af56oKgtFmt5yWehvJeoYhkzYlqxrqdBe0Ko4Ie3bWrmLau+dJw==","shasum":"84b873d400cf0301814bdd71329daa1ac741fd86","tarball":"https://registry.npmjs.org/vue-confetti-explosion/-/vue-confetti-explosion-1.0.2.tgz","fileCount":9,"unpackedSize":55482,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCXCOndVKBxKIvRaQDJXzqZCq4WIVqHnOAU/jneOFKhVgIhAO7cFuhrMyWpdlv3P9fm+6CvEkC2u06WJBK7qb3HAoEQ"}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJjhhg8ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpMTxAAihcqHPqr1pR8a5qeQCBYxpu1ZAVhpwn8KmLlVkv0UqBOpdEP\r\n1IjSMW7FvDiOb7E1r1FxR/zxJ+TCXNwo5Ongws1sYwE3Y8aJgQ0cdEYsjVE/\r\nj3rcA72mFnjMZmeDQ23z1dB2lTmtdyAdQulnPJ9nYRVcRJ72dqVlTcIoDkLU\r\n0fi2lsxZZzdkb+d4B0k8q0lZ9XspjifRhKdEyzF6+rJ5Ziv7ORJyuwvz7wxB\r\n/WLkPZFKnKk6G+Yf5snYr1W6QXan0SW2G2sweflU3wNjFs+abwSAfVW4+9eZ\r\nKVI4jTSU8wNuHQwbIDJR0TG3czlqAoxa4iHoJ11iaD4FBGGIWCW+7dvWN1cZ\r\nzugaArwVp9F8iM/X+2a6PnWAIXo3wDSkD7MRtFYLsoqyHGGiiVpbwEtYo8/V\r\nODrQWCsZQ4B42IExqx9Qc4VN73PnOplO1cJlE/QWTec8kySRnxQNJK/WngTo\r\nxFWz/uLM6WOQOjWjXxBXwIzR6Hl50wrNHblW1Aq21TcuZ77C1V5iHV5SToMD\r\nYUcuwmbO8W4uUzhC7n7X+5bAKqCblded8UYvCy6vGCXrbM1ggREmVV/6W+Iv\r\ncaxuQylJHa1/Tl3tDcULNu+dd2SJfDOMoa9uUzTY1IXXev1src5ItIzG42LR\r\n3EYOkm99yd9QotQ1Yz/p5WpUM83Aot71j3w=\r\n=2ERd\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"valgeirb","email":"valgeirb@gmail.com"},"directories":{},"maintainers":[{"name":"valgeirb","email":"valgeirb@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-confetti-explosion_1.0.2_1669732412735_0.9683777851784567"},"_hasShrinkwrap":false}},"time":{"created":"2021-11-24T21:22:42.201Z","0.1.0":"2021-11-24T21:22:42.580Z","modified":"2022-11-29T14:33:32.994Z","1.0.0":"2021-11-24T22:00:43.279Z","1.0.1":"2021-11-24T22:26:33.849Z","1.0.2":"2022-11-29T14:33:32.892Z"},"maintainers":[{"name":"valgeirb","email":"valgeirb@gmail.com"}],"readme":"# vue-confetti-explosion\n\n> This library is the Vue 3 port of [svelte-confetti-explosion](https://www.npmjs.com/package/svelte-confetti-explosion) which in turn is ported from the [@reonomy/react-confetti-explosion](https://www.npmjs.com/package/@reonomy/react-confetti-explosion) package.\n\n![confetti-large-edit](https://user-images.githubusercontent.com/5460067/111782964-0c6bed80-8890-11eb-8a8b-0a4fdbc30cbd.gif)\n\n## Installing\n\n```bash\n# pnpm\npnpm add vue-confetti-explosion\n\n# npm\nnpm install vue-confetti-explosion\n\n# yarn\nyarn add vue-confetti-explosion\n```\n\n## Usage\n\nBasic usage:\n\n```html\n<script setup>\n  import ConfettiExplosion from \"vue-confetti-explosion\";\n</script>\n\n<template>\n  <ConfettiExplosion />\n</template>\n```\n\nCustomizing behavior with options:\n\n```html\n<ConfettiExplosion :particleCount=\"200\" :force=\"0.3\" />\n```\n\n## Props\n\nThere's tons of options available for this package. All of them are already documented within the code itself, so you'll never have to leave the code editor.\n\n### particleCount\n\nNumber of confetti particles to create.\n\n**type:** `number`\n\n**Default value:** 150\n\n**Example:**\n\n```html\n<ConfettiExplosion :particleCount=\"200\" />\n```\n\n### particleSize\n\nSize of the confetti particles in pixels\n\n**type:** `number`\n\n**Default value:** 12\n\n**Example:**\n\n```html\n<ConfettiExplosion :particleSize=\"20\" />\n```\n\n### duration\n\nDuration of the animation in milliseconds\n\n**type:** `number`\n\n**Default value:** 3500\n\n**Example:**\n\n```html\n<ConfettiExplosion :duration=\"5000\" />\n```\n\n### colors\n\nColors to use for the confetti particles. Pass string array of colors. Can use hex colors, named colors, CSS Variables, literally anything valid in plain CSS.\n\n**type:** `Array<string>`\n\n**Default value:** `['#FFC700', '#FF0000', '#2E3191', '#41BBC7']`\n\n**Example:**\n\n```html\n<ConfettiExplosion :colors=['var(--yellow)', 'var(--red)', '#2E3191', '#41BBC7']\n/>\n```\n\n### force\n\nForce of the confetti particles. Between 0 and 1. 0 is no force, 1 is maximum force. Will error out if you pass a value outside of this range.\n\n**type:** `number`\n\n**Default value:** 0.5\n\n**Example:**\n\n```html\n<ConfettiExplosion :force=\"0.3\" />\n```\n\n### stageHeight\n\nHeight of the stage in pixels. Confetti will only fall within this height.\n\n**type:** `number`\n\n**Default value:** 800\n\n**Example:**\n\n```html\n<ConfettiExplosion :stageHeight=\"500\" />\n```\n\n### stageWidth\n\nWidth of the stage in pixels. Confetti will only fall within this width.\n\n**type:** `number`\n\n**Default value:** 1600\n\n**Example:**\n\n```html\n<ConfettiExplosion :stageWidth=\"500\" />\n```\n\n### shouldDestroyAfterDone\n\nWhether or not destroy all confetti nodes after the `duration` period has passed. By default it destroys all nodes, to free up memory.\n\n**type:** `boolean`\n\n**Default value:** `true`\n\n**Example:**\n\n```html\n<ConfettiExplosion :shouldDestroyAfterDone=\"false\" />\n```\n\n~~## Style Props~~\n\n> This is Svelte specific, still not implemented for this Vue 3 component\n\n~~You can specify two style props on the component: `--x` and `--y`. These will shift the confetti particles on the x and y axis. by how much you specify, These can be in `px`, `em`, `rem`, `vh`, `vw`, literally any valid CSS unit.~~\n\n~~**USAGE:**~~\n\n```html\n<ConfettiExplosion --x=\"10px\" --y=\"10px\" />\n```\n\n## Examples\n\n```html\n<script setup>\n  import { nextTick, ref } from \"vue\";\n  import ConfettiExplosion from \"vue-confetti-explosion\";\n\n  const visible = ref(false);\n\n  const explode = async () => {\n    visible.value = false;\n    await nextTick();\n    visible.value = true;\n  };\n</script>\n\n<template>\n  <div>\n    <button @click=\"explode\">Show confetti</button>\n    <ConfettiExplosion v-if=\"visible\" />\n  </div>\n</template>\n```\n\n## Potential gotchas\n\n- Your container must be `overflow: visible` in order to allow elements to fully spread across area.\n- If your `floorHeight` is too small, particles may visibly land on the floor instead of disappearing off-screen.\n\n## Performance\n\nThis library functions by creating 2 DOM nodes for every single confetti. By default, if the `particlesCount` is set to 150, it will create 300 nodes. This is a lot of nodes. For most devices, these many nodes are not a big issue, but I recommend checking your target devices' performance if you choose to go with a higher number, like 400 or 500.\n\nAlso, after the specified `duration`, all the confetti DOM nodes will be destroyed. This is to free up memory. If you wish to keep them around, set `shouldDestroyAfterDone` to `false`.\n\n## License\n\nMIT License\n© [Valgeir Björnsson](https://valgeir.dev/)\n","readmeFilename":"README.md","description":"Confetti explosion in Vue 3 🎉🎊","homepage":"https://github.com/valgeirb/vue-confetti-explosion#readme","keywords":["confetti","party","fun","badass","badassery","vue","vue3","small","tiny","performant"],"repository":{"type":"git","url":"git+https://github.com/valgeirb/vue-confetti-explosion.git"},"author":{"name":"Valgeir Björnsson","email":"valgeir@hey.com","url":"https://github.com/valgeirb"},"bugs":{"url":"https://github.com/valgeirb/vue-confetti-explosion/issues"}}