{"_id":"@arnellebalane/vue-intersect","_rev":"4-42908e65209bce5913ac6235141e9f71","name":"@arnellebalane/vue-intersect","dist-tags":{"latest":"2.0.0"},"versions":{"1.0.0":{"name":"@arnellebalane/vue-intersect","version":"1.0.0","description":"VueJS plugin that reports element intersections using the IntersectionObserver API","main":"vue-intersect.js","scripts":{"build":"parcel build vue-intersect.js --global VueIntersect"},"keywords":["vuejs","plugin","intersection-observer"],"files":["dist","vue-intersect.js"],"author":{"name":"Arnelle Balane","email":"arnellebalane@gmail.com","url":"https://arnellebalane.com/"},"license":"MIT","devDependencies":{"parcel-bundler":"1.8.1"},"gitHead":"84e3a390af8d765421be76340d0719e9f12f0800","_id":"@arnellebalane/vue-intersect@1.0.0","_npmVersion":"6.1.0","_nodeVersion":"8.11.1","_npmUser":{"name":"arnellebalane","email":"arnellebalane@gmail.com"},"dist":{"integrity":"sha512-2wH+TQBXaHimcPUSvkoGtBliAS6Nw3MlyfsBhKKE9ishzHCSp1P4piWNZawt0dNSEyU25gJm0kkl+kZY3OsgLw==","shasum":"302408475f31488085f7c18fed94f42327f0d769","tarball":"https://registry.npmjs.org/@arnellebalane/vue-intersect/-/vue-intersect-1.0.0.tgz","fileCount":6,"unpackedSize":9118,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJbEl7ECRA9TVsSAnZWagAAV4cP/21qAZwB+bVLDki7+6aW\n/Z21rvmxj0ArwtXSa39kO0lBlChFiZLVbMk/OR8Aja/PUAQqKmyvkOoMpokZ\n6SdocbwUJoEtgDiOhTtDrHRSK2DHkRKR5wFqzPBjxkb/59AAHVuBV84NEKO4\ni/djy9hxm6Yo1NKYncmJpyYekFJav1BrD1WIPEvkNAt1cse06kpWBAPN4wKI\n6pFItsss7c4rkJPe6mfjk25n909YQooGQGR+QikeiP9UAOSO5lTGloimycQp\nxwDQt2sKbaqnwwj32Pjz63Rc3oI+iFN3l916gXXCbsgcz+ADMvDor8R6rCOR\nnciIFH0jVoY5QQ/COUkVPZEJy27cHifvC637+waVVMHmuKNLpEDZFXag+J0G\nryHKYeDZHoE6+XHCQlOgAGq8Sepy+qKL8HqRaJBcXsxWRQ2eTrvzQUpg7lWN\n/ske5Vmcn5Jf1SgJkMl7qvYSxECvR0Ycwt41otCmDTUuefulBUdJMkCxM6ts\n1pO6zuBM19dU9I+xegXzpiGabZNqXd4F3gGuQcF0dUfSOBk/ZW0zdmrO00B1\nCG+N3DS3tlcTsi7JqtBxqX5lKaE7o8VJ6xdGklPs1GKc1yLZqggWNskh+cq8\nW4ntagZt5tVAhxS85Q3LDghEprtXf5bdYYBsqaimHJUyLhMSqUmHXSBP4fVM\nK7yf\r\n=ERkN\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIBKx0HMObzZaS19KLCMtireIOA362gmAs0Mr3GhvqB+JAiEArKPl70RckbZNbpMRf9RhFkKnbsKHnP/zDWFczRHywUo="}]},"maintainers":[{"name":"arnellebalane","email":"arnellebalane@gmail.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-intersect_1.0.0_1527930563317_0.9476378846993081"},"_hasShrinkwrap":false},"1.1.0":{"name":"@arnellebalane/vue-intersect","version":"1.1.0","description":"VueJS plugin that reports element intersections using the IntersectionObserver API","main":"vue-intersect.js","scripts":{"build":"parcel build vue-intersect.js --global VueIntersect"},"keywords":["vuejs","plugin","intersection-observer"],"files":["dist","vue-intersect.js"],"author":{"name":"Arnelle Balane","email":"arnellebalane@gmail.com","url":"https://arnellebalane.com/"},"license":"MIT","devDependencies":{"parcel-bundler":"1.8.1"},"dependencies":{"intersection-observer":"0.5.0"},"gitHead":"114857628e162c769017804a5c5f99574d3540c5","_id":"@arnellebalane/vue-intersect@1.1.0","_npmVersion":"6.1.0","_nodeVersion":"8.11.1","_npmUser":{"name":"arnellebalane","email":"arnellebalane@gmail.com"},"dist":{"integrity":"sha512-TETQElQdIwDC1zFivbRsjrPSC+skEhdVnx1wNHdRfU4Xl5eII+9+Kz518MSJq4tWDifo4P2cd2BXjMNivx0jBA==","shasum":"b6eeccb6e71e068741dc7332d5008ed88d5e5ac3","tarball":"https://registry.npmjs.org/@arnellebalane/vue-intersect/-/vue-intersect-1.1.0.tgz","fileCount":6,"unpackedSize":9213,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJbEl9MCRA9TVsSAnZWagAAaxoP/1hpFeN0p273qJZoQLeL\nk7MZvd5Gfc78FUxOPXkNbmT8O+fKIcGOXNqET1tlrlihCsdtFg6xRMq6QJGj\nm6hXF9Acn9DGWNAy0YEOuOXEqbr8tJdUrf4q9c/9tlHD6xFHMSdVKgFhcKUE\nc8wQGG7/R7/48j+l33wOnSxtXSdew/iLBHW3w3CMjboRiyo8kY6JCPTOXht0\nZaXnpbe4YKszoyHwhnJKQbdgWGGNszSbOiNDc1D5WHO3ox7SnYJmimIYgMek\nQ5lh7M5HGTQZCTJmALiegN3NPOyqr3br1bCbDxMdkDw2wG4IEiIbwuJSDFaT\nI4kPxg8Xrgvj9SGVOh7YPNBdXo503hyQ4Jg/7v4VWtkHkLXyziWikA/F7V2z\nu4WbaKDObdsgY9zu1/EEwr83cqk9NEPQUG4vHnwfYYcsHkIwZz9yM+Ra0HkF\nNfs2y0LCZ2Gh5Lz9BMcitp7fPisQiaHxIApZnSL8h/Cbkjp2kznx62Q2z6LF\nz58pQ65A/Vl8LtyS5PfqRQnDlbtsmeONVKNqw/NxtXrNjHuHjXSBCktXO0H2\n+rTxkVm9kz4OKzK1qrlMDXOyqA7E422ZiW5N32mHmWiPnUXUcYIEv84e4GbP\n4QcvmFtyEKHvExPnHaG1DduOKzd+LDbts/dmO2/eH2NWn7SuAAWONe4HGDNG\nF14t\r\n=qCk2\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDGrAkPIU4WX6fHWweJYRVHoEsBEfKf2Ztj+wqbWzF34gIhAI5O04d6Dzg8dxkB7kB6MSi4hUyW5Eil19lrKkrCgsQP"}]},"maintainers":[{"name":"arnellebalane","email":"arnellebalane@gmail.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-intersect_1.1.0_1527930699568_0.9726068240344572"},"_hasShrinkwrap":false},"1.2.0":{"name":"@arnellebalane/vue-intersect","version":"1.2.0","description":"VueJS plugin that reports element intersections using the IntersectionObserver API","main":"dist/vue-intersect.js","source":"vue-intersect.js","scripts":{"clean":"rm -rf dist","prebuild":"npm run clean","build":"microbundle --name VueIntersect --external none","build:watch":"npm run build -- --watch"},"keywords":["vuejs","plugin","intersection-observer"],"author":{"name":"Arnelle Balane","email":"arnellebalane@gmail.com","url":"https://arnellebalane.com/"},"license":"MIT","devDependencies":{"microbundle":"0.7.0"},"dependencies":{"intersection-observer":"0.5.0"},"gitHead":"08a539a078a07a4d6bf5664aaf4ed53397269fbb","_id":"@arnellebalane/vue-intersect@1.2.0","_npmVersion":"6.4.1","_nodeVersion":"8.11.3","_npmUser":{"name":"arnellebalane","email":"arnellebalane@gmail.com"},"dist":{"integrity":"sha512-0i2CjbzLjOZIPUGq9XEa1epjO/ffo1+IC6k/G7i1SYOhwQ7XS69Ous5QpPQNFuM8tbOef+u5l8DT3pw7qJP0tw==","shasum":"930e58492a27535040d605cb7809407cac3be549","tarball":"https://registry.npmjs.org/@arnellebalane/vue-intersect/-/vue-intersect-1.2.0.tgz","fileCount":10,"unpackedSize":126877,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJb005fCRA9TVsSAnZWagAAy5wP/RbVLggyqg+rnrC3eGHd\nk1y4GdoqtFaTbUus2Q7Bnz3fYDwo59yODt1RydPkXDswpn6XW8RUY+MI8OUz\n5U+MRb5krkfVxjvEZpTEcEjCR3WH8dx2BWeNT4fIMfhtq8wPr17DMqTykDLN\n1VYZTxWMaB7woyPDdeLVn6belj29iZjNV1qQymchczdwzK0GmoFTceOmi49I\nCLGPoT2fkGBSPBihJmnevBr/nEEvcLsVC2TwTeN42+6kPqsnS8NX7hf2EYqF\nyzNoCRsC8I8qzvCWovn18ijG1OKd1kKD9ZLczOreLSqIsJS1DczT9oh8zRr5\nXgqClDShVf4506993C+GAi5fEIc4iMHRaLRxGmhMGlfCferJSIZIvxTYIxy7\n6Igono1wkceMSUYWQHuuxwt4Gau4k0+cEMhkjvF+q1q1JkhbIbQ9LXCB5Dix\nd5cf5+x/cTah9BU9z3W/ilie/gjWXxL3qSzYi3ogIb6JrzfuVHiGq1DH3wsr\nRVhQXfYAa4In16dmgPaf8hXtY11K7x3OtnRKZ99mNoSfr+dB1w9CdQLNVgya\n/pdks3vV2ZU4gXnx2HaYFDNe26MSz3gE2G91OUgkOm2qsU29V8I5UpmkTS8T\nbImZ7x7KkLGHlO8mKl5LjRe7hQdDm4gWeiaQbEfkey6Z1inpFa5VNNplfytv\nPfH8\r\n=8md+\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDdpaHw7i0UQ5fWs9EdqOtZgIMNBaDheyU6XJNMdqbSuAIhAKu+9uNWZC5SRCo9EXqtIc8AewrFRuCZUznWfOKVXCAQ"}]},"maintainers":[{"name":"arnellebalane","email":"arnellebalane@gmail.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-intersect_1.2.0_1540574814932_0.44904467694282957"},"_hasShrinkwrap":false},"2.0.0":{"name":"@arnellebalane/vue-intersect","version":"2.0.0","description":"VueJS plugin that reports element intersections using the IntersectionObserver API","main":"dist/vue-intersect.js","source":"vue-intersect.js","scripts":{"clean":"rm -rf dist","prebuild":"npm run clean","build":"microbundle --name VueIntersect --external none","build:watch":"npm run build -- --watch"},"keywords":["vuejs","plugin","intersection-observer"],"author":{"name":"Arnelle Balane","email":"arnellebalane@gmail.com","url":"https://arnellebalane.com/"},"license":"MIT","devDependencies":{"microbundle":"0.7.0"},"gitHead":"5b0dfd22bf151da6577f51ef1b7d87b4134cd2f3","_id":"@arnellebalane/vue-intersect@2.0.0","_npmVersion":"6.4.1","_nodeVersion":"8.11.3","_npmUser":{"name":"arnellebalane","email":"arnellebalane@gmail.com"},"dist":{"integrity":"sha512-oR03GtgEVpXTZPTc4DITxV+HjvW8OmlNWCyKqcG0dmTyzy/VbU6d60s9mkC2RD4yfK2yu2OCNYR7uWQfPyyaOw==","shasum":"8432a4d58868667c84b9ca89f4b7e76943c1f78d","tarball":"https://registry.npmjs.org/@arnellebalane/vue-intersect/-/vue-intersect-2.0.0.tgz","fileCount":10,"unpackedSize":12740,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJb1oWZCRA9TVsSAnZWagAAqPcQAJx5crRus7idDhD0t9uZ\ndtOQuk95KiMqNYuC4SScQ8bbZzq/rA5ZLZkHI2yviNNPfoJwm4LDTPBPwrq6\nM38UrFmFTg4WLN32v6fCSqdEfzhb5u/mKq1Osw/P7b4UJ+vzWG+vt9K34hDR\nLmHYvGHsMfOEC6iEFRUto5MdA2+nxb4umd5IV/dlzm5yq3ir0BFHVaUmH1so\nfiFBh3UU0vyOnjhaPRjKrfB84rKolXsNY8mF9w4+rK/Ol2DTnmtRk/uTvae7\nU1V6D9l0gCpbGnZBbV+FjielmXKCd6niYFJFaavgdafwMGNTyxTZcky82SkS\nQHKkvLj/ADqbyTmE7s/ITuYkz6MdrY/GIap70SghA1TRVKvFiVi9OoPlCdtn\nzOFQGid0rixm0YnOzcjzWbaUNOdcrBnMdmw6drG0IJG29gzq4//s69p1SiR1\nGggPe6pCXKhhQz+scCgAISIaziWyZc256RuzGxhENfUTbl9K2c8ANd0DAxyT\n2WiJLmqccqJvYHb0C+sZWAgexAcbQtUvc1eXHBjLfsoTxNreEmd5Legc1Ogd\n2r5ENCTdScCWpfepd9e3M07wOWZVyB7XRJSuUqPCh9/I8hG3LBjMcoi5gndL\nRl4bHcFGqn0cbrFeupU+Br7jWA7G7hUonjP3e5PIXZC3z7KiWZZdJeOBMEcJ\nGJU1\r\n=xeb+\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCICw69mirVXKgGNz8Lqj1pQRSUbVbLpMb+i8gPpa5WG/xAiB93dMu5M8QV3n+fMhiXK00FTegiIvyAJbO4sRTxsk1Jw=="}]},"maintainers":[{"name":"arnellebalane","email":"arnellebalane@gmail.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-intersect_2.0.0_1540785560543_0.39047277151552007"},"_hasShrinkwrap":false}},"time":{"created":"2018-06-02T09:09:22.826Z","1.0.0":"2018-06-02T09:09:23.391Z","modified":"2022-04-04T15:33:49.651Z","1.1.0":"2018-06-02T09:11:39.783Z","1.2.0":"2018-10-26T17:26:55.189Z","2.0.0":"2018-10-29T03:59:20.666Z"},"maintainers":[{"name":"arnellebalane","email":"arnellebalane@gmail.com"}],"description":"VueJS plugin that reports element intersections using the IntersectionObserver API","keywords":["vuejs","plugin","intersection-observer"],"author":{"name":"Arnelle Balane","email":"arnellebalane@gmail.com","url":"https://arnellebalane.com/"},"license":"MIT","readme":"# vue-intersect\n\nVueJS plugin that reports element intersections using the [IntersectionObserver API][1].\n\n\n## Installation\n\nVia npm:\n\n```bash\n$ npm install @arnellebalane/vue-intersect\n```\n\nVia yarn:\n\n```bash\n$ yarn add @arnellebalane/vue-intersect\n```\n\n\n## Usage\n\nFirst, load the plugin. Depending on the environment, you have several options:\n\n```js\n// ES6\nimport VueIntersect from '@arnellebalane/vue-intersect';\n\n// AMD, e.g. RequireJS\nrequire(['path/to/vue-intersect/dist/vue-intersect.js'], (VueIntersect) => { /**/ });\n```\n\n```html\n<!-- <script>, exposed as `VueIntersect`. -->\n<script src=\"path/to/vue-intersect/dist/vue-intersect.js\"></script>\n\n<!-- or if you wanna load it via CDN (unpkg) -->\n<script src=\"https://unpkg.com/@arnellebalane/vue-intersect@latest/dist/vue-intersect.umd.js\"></script>\n```\n\nThen, tell Vue to use the plugin:\n\n```js\nVue.use(VueIntersect);\n```\n\nThen, add the `v-intersect` directive on the element whose intersection you\nwant to observe:\n\n```vue\n<div v-intersect=\"onIntersect\"></div>\n\nexport default {\n    methods: {\n        onIntersect(entry) {\n            // Do something...\n        }\n    }\n};\n```\n\nThe value passed to the `v-intersect` directive is described in the\n[**API**](#api) section.\n\n\n### IntersectionObserver Polyfill\n\nThis plugin uses the IntersectionObserver API under the hood. If a target\nbrowser does not support the API, we can use a polyfill for it.\n\nHowever, as of v2.0.0 of this plugin, the polyfill for the IntersectionObserver\nAPI is not bundled anymore. This means that if you want to support browsers\nthat don't natively support the API, you'd have to load the polyfill yourself.\n\nThis keeps the package size of this plugin very small and also keeps users from\nhaving to unnecessarily download the polyfill even when their browsers already\nsupport the IntersectionObserver API natively.\n\nYou may check out [intersection-observer][4] for steps on how to use the polyfill.\n\n\n## API\n\nThe `v-intersect` accepts either a `Function` or an `Object`.\n\nIf a `Function` is given, it will be used as the callback function which gets\ncalled whenever the element's intersection changes. The callback function is\npassed an [`IntersectionObserverEntry`][2] object, from which you can get the\nintersection ratio and other properties.\n\nPassing a `Function` creates an `IntersectionObserver` using the default\nconfigurations. If you want to specify custom configurations, you should pass\nan `Object` to the `v-intersect` directive, which can contain the following keys:\n\n- `callback`: `Function`. Required.\n- `threshold`: `Number` or `Array`. Optional, defaults to `0`.\n- `root`: `HTMLElement`. Optional, defaults to `null`, which corresponds to the\n    viewport itself.\n- `rootMargin`: `String`. Optional, defaults to `0px`.\n\nI wrote [an article][3] explaning what the IntersectionObserver API and its\nterminologies.\n\n\n## License\n\nMIT License\n\n[1]: https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API\n[2]: https://developer.mozilla.org/en-US/docs/Web/API/IntersectionObserverEntry\n[3]: https://blog.arnellebalane.com/the-intersection-observer-api-d441be0b088d\n[4]: https://www.npmjs.com/package/intersection-observer\n","readmeFilename":"readme.md"}