{"_id":"@dragndrop/vue-draggable","_rev":"4-1be43c1d3aae8a6e3846b42e414467b2","name":"@dragndrop/vue-draggable","dist-tags":{"latest":"0.0.4"},"versions":{"0.0.1":{"name":"@dragndrop/vue-draggable","version":"0.0.1","description":"Draggable component for VueJS","main":"./dist/vue-draggable.common.js","unpkg":"./dist/vue-draggable.umd.min.js","types":"src/index.d.ts","repository":{"type":"git","url":"git+https://github.com/lrembacz/vue-dragndrop.git","directory":"packages/draggable"},"keywords":["vue draggable","vue-draggable","draggable"],"author":{"name":"Łukasz Rembacz"},"license":"MIT","dependencies":{"@dragndrop/draggable":"0.1.4","@material/dom":"^4.0.0"},"publishConfig":{"access":"public"},"bugs":{"url":"https://github.com/lrembacz/vue-dragndrop/issues"},"homepage":"https://github.com/lrembacz/vue-dragndrop#readme","_id":"@dragndrop/vue-draggable@0.0.1","_nodeVersion":"9.5.0","_npmVersion":"6.8.0","dist":{"integrity":"sha512-2n6CcRPBQ86R7nnyK7y1pwwoe7dVcOv+aXje5Iw9ld2LjbiTEZxkG1cYGmPjpTTIXSOQkQDITBl3UgYGWyjy0w==","shasum":"02a13dc8dee075b63ba40c97b474b26e5391d921","tarball":"https://registry.npmjs.org/@dragndrop/vue-draggable/-/vue-draggable-0.0.1.tgz","fileCount":13,"unpackedSize":639476,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd5EBZCRA9TVsSAnZWagAAj50QAKGcGriFm4oVO3MX/vLF\nNJsrLnMPPuR3tJrJmyu/6+QCF5uFrj23dS8PiyFZ6qFd5XJSklxr8IvHctaN\nYfJHchI1awXqT5/uVGPHltF3yQRc0n9+7PD02+ts6Io/PBZvuYWXkGCX9DPW\n4i/qIjFydh15tsYsOFQjOlYSElLRtbZAMhCSno1CBE4mAD0APWhytUprvU86\nuYshCIkBecGKY0O+5nflBtXCRoQBU8f2itgy0rrewDLeGVFF+hANpGF6B3wH\nr/sROb3v1OMBl7pZ0FcDez4HvCjf+GUiNdkiEwbRhLvqlrUrMwuzDL2wAqE5\neJNuY62TLm2WsNVhnqHrq4Bc/fe8DKxspZdVzeU+vOq+F28X9IHHH9sqNAW5\noy3HtiVwdhITcckB1yZ0uUzyO4be61g8A9W/Uvn/a/KAQnNdQKLqPlBGA6CM\nwWPIv6E9lCNa0k3XTuL2yH+pZ4WWcsFZ7y3J9g1r5sv4FAvRoeh7T/xOzGpO\nmo31M70ebdqkEN+ec6BVt8WfiNQfBEHxadlxKrfO8K1aK8wwKbzuNJuCDpgV\nUhapM1eWURcFZWjedpUCViT3YB0bIaRBBOgsDgPjP3sfvPvYHiIgZAJCtXrD\n69nBNuMwq3w5O1qIY1b0AO8cpZU2mNF4F0J+s46rzo5QdO+R7v4blj+gkdMm\nH4Rg\r\n=vIU8\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIA4OmEogiFffp4+mVXYYpqMLe+nSBnmn+lT4c8FIiKZLAiAFPatdD379c/fuKSqxtKhqrGCwbcprOvyX4AsK9dKWmA=="}]},"maintainers":[{"name":"lrembacz","email":"qwester1213@op.pl"}],"_npmUser":{"name":"lrembacz","email":"qwester1213@op.pl"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-draggable_0.0.1_1575239769468_0.8192842607978756"},"_hasShrinkwrap":false},"0.0.2":{"name":"@dragndrop/vue-draggable","version":"0.0.2","description":"Draggable component for VueJS","main":"./dist/vue-draggable.common.js","unpkg":"./dist/vue-draggable.umd.min.js","types":"src/index.d.ts","repository":{"type":"git","url":"git+https://github.com/lrembacz/vue-dragndrop.git","directory":"packages/draggable"},"keywords":["vue draggable","vue-draggable","draggable"],"author":{"name":"Łukasz Rembacz"},"license":"MIT","dependencies":{"@dragndrop/draggable":"0.1.5","@material/dom":"^4.0.0"},"publishConfig":{"access":"public"},"bugs":{"url":"https://github.com/lrembacz/vue-dragndrop/issues"},"homepage":"https://github.com/lrembacz/vue-dragndrop#readme","_id":"@dragndrop/vue-draggable@0.0.2","_nodeVersion":"9.5.0","_npmVersion":"6.8.0","dist":{"integrity":"sha512-t8IJkzoL5naoBT7LaaQJRB3ioiUy+vWiioJH1KonNBIKjcm+nQfs9yftr2E+0wg/89sh3GsHX+PURM2JZuYCAQ==","shasum":"6b37bb365d20dfc1c904961ec47e958df6a0c5c6","tarball":"https://registry.npmjs.org/@dragndrop/vue-draggable/-/vue-draggable-0.0.2.tgz","fileCount":13,"unpackedSize":639491,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd7vFMCRA9TVsSAnZWagAAaSUP/1yvlNTDsGRpdXhdcUpe\n5d0rWGVZIP09M+RajsQtPUNedChVtnukD0rk0ZP6H/U4RF74Og5rBvD0D9QD\nJdXd1urpDXQriPvsaMeQd8m7hnmfTRXCXE4WiCRLC/iROaLne8QCUJMI9QSp\n50vl8HBOiwxZP/0EB0wZY75H7usI5AmpTV2fj7KYFTGjL/xmCmhF8C8z7jQb\nTXlEiQupSkEjGMmdBsq2CoDAyYmjOmkcZOjquW8ckJSAoZhXR87oYt2TpLD+\nR4ydN3fZ3BcT8DC+rvyOhTzOLUW4jUJZCo28x2FedY2JSyPb0/jICrHQNcd5\nk5Ez2x39f2KBA4oIgLoNLh72qQlL3bNpthKuy5fXTg/d3dIImaabXwTCuUnY\nIQWeTpkK0OHp9w/fFKyPRQSt3JFSlFAD0Tlu5Eog7K+21beusInCkMV2tDYo\nqel9Sa11xg3kf5sOPzfKXJS2zRUkoS4DBakVxbD8m2bR7Flq17/X/Z01N1ed\nrWSiPdbHXTzqhSziPd8zpsvD+hoVJJv7pJ6silhxT4ZRpJLmMVTq6plJeKh5\nfkKdc/YP/0poxT/PHvXONF6BEJM8vUOegwtt4DbDeQ1aozjMfVTe+8PHbRo0\n/H6RCBFOuJO+yyrXm4fBSNFzRT7u/R7/u0G0CV6C2IL7SfF6gVV/vBwPT0t8\nXsRA\r\n=NosH\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCCBcDlHg27F9JOzdKOQfSssXSEtbazMJO7h2pphvA3qwIgPubyVswWhgwsccWNNnRiZZ2uuyopJwezuRjLO5u4LII="}]},"maintainers":[{"name":"lrembacz","email":"qwester1213@op.pl"}],"_npmUser":{"name":"lrembacz","email":"qwester1213@op.pl"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-draggable_0.0.2_1575940427596_0.2178965336411145"},"_hasShrinkwrap":false},"0.0.3":{"name":"@dragndrop/vue-draggable","version":"0.0.3","description":"Draggable component for VueJS","main":"./dist/vue-draggable.common.js","unpkg":"./dist/vue-draggable.umd.min.js","types":"src/index.d.ts","repository":{"type":"git","url":"git+https://github.com/lrembacz/vue-dragndrop.git","directory":"packages/draggable"},"keywords":["vue draggable","vue-draggable","draggable"],"author":{"name":"Łukasz Rembacz"},"license":"MIT","dependencies":{"@dragndrop/draggable":"0.1.5","@material/dom":"^4.0.0"},"publishConfig":{"access":"public"},"bugs":{"url":"https://github.com/lrembacz/vue-dragndrop/issues"},"homepage":"https://github.com/lrembacz/vue-dragndrop#readme","_id":"@dragndrop/vue-draggable@0.0.3","_nodeVersion":"9.5.0","_npmVersion":"6.8.0","dist":{"integrity":"sha512-RJtBQNr1sP38RDOKIR3Alnqky56HqbQT1I1Qz1thK7sRKxt8f1U76nteq22uqcTgBYzcGETONhaesDPi2L3kbw==","shasum":"e4f38d0da8892eec7d62f231d2970faf4db81b40","tarball":"https://registry.npmjs.org/@dragndrop/vue-draggable/-/vue-draggable-0.0.3.tgz","fileCount":13,"unpackedSize":638609,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd9gKrCRA9TVsSAnZWagAA708P+gNa0JSXioK7woXpgb9n\nIWCpZvL3Omy0QZ9+HtcrmZu6djhSfxDbqIrv8ioBhm1ooW8NYldJECHtTzNH\nAm7YOA4iOMtJ3rWxpPyjO22CfCxBAUIvFFZRl56Cwb5y1AwHAPboIrBXwGOS\nsBixaU3TlE3Xjzbtb+mqs+hoP19NeM5rOR9RC1OZNCZE3mUppipm0tU6/lDw\nwX8a+FV+J4i53zAabxhUsQ6pAjnNxAjDHzFDtvDYulYq4NGsUmBEJtAuJtbN\nzZ2ug8BD9omM51ur6QHtR2b8c2D6+cDlRhPgTSEafBj1ZRYS+k4pdUtuPQtK\nuJnYbvAXxM3/MBRcpym93oMWmDqNgLRpQIo5SnFBEAC5I02dAm+rLXbu32gt\n+bS/BvDe9OiALsNCBX8iunZEN+qquCXwmZ/dVBlrXStjdPZiPE0XQE6XZllX\n9HgqcN6NDG2iLj7jra1VARQ7q6E3GTLvX7b+DUQ184u3sfp0EBT89wp8ClTh\n1N0HlvOIP6KHbNYhQoSw1/PLQ4HXiuFoa6GxWENr+Mh42KQ+FwpT6r3Hvq5j\nsgwvPb9ZIDX9LWz4Pqbp0sYNPWSWtXGxvWSXBHXtGYdvuEGQHjQQQMXmyysZ\nspFGp3HGU2b5IhmqaAJLN6wNHfU0clSgv2Rk/kgCcjhnc6BJouCl3GhLW/uG\ng+fP\r\n=S2i6\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIAE3FzTsa8FoDUEjc/DMfw2JSsK/SeazUQkYMZ9J5eCsAiEAtOzQVwPmbXmF+yZEy/5lwUXjgaA1lgx+0QojX3yCda0="}]},"maintainers":[{"name":"lrembacz","email":"qwester1213@op.pl"}],"_npmUser":{"name":"lrembacz","email":"qwester1213@op.pl"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-draggable_0.0.3_1576403626990_0.16168333070703178"},"_hasShrinkwrap":false},"0.0.4":{"name":"@dragndrop/vue-draggable","version":"0.0.4","description":"Draggable component for VueJS","main":"./dist/vue-draggable.common.js","unpkg":"./dist/vue-draggable.umd.min.js","types":"src/index.d.ts","repository":{"type":"git","url":"git+https://github.com/lrembacz/vue-dragndrop.git","directory":"packages/draggable"},"keywords":["vue draggable","vue-draggable","draggable"],"author":{"name":"Łukasz Rembacz"},"license":"MIT","dependencies":{"@dragndrop/draggable":"0.1.6","@material/dom":"^4.0.0"},"publishConfig":{"access":"public"},"bugs":{"url":"https://github.com/lrembacz/vue-dragndrop/issues"},"homepage":"https://github.com/lrembacz/vue-dragndrop#readme","_id":"@dragndrop/vue-draggable@0.0.4","_nodeVersion":"9.5.0","_npmVersion":"6.8.0","dist":{"integrity":"sha512-Ggq8ei6GazjnW8f9G0UgFYH5hqcgK54G6auZge2ZaRJn7IOfOyUYSnftE0IhthFkWN8V3ITOLThdl3q7/Q3dEw==","shasum":"39d3ae8922d7b9b91674b8e39b3ce69323e9baab","tarball":"https://registry.npmjs.org/@dragndrop/vue-draggable/-/vue-draggable-0.0.4.tgz","fileCount":13,"unpackedSize":638486,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd9/JuCRA9TVsSAnZWagAAdF4P/jP/S3iJqR1TClu4NIqN\nCKKmAnlWUoDzleD0vP2Fq1jQvLpHCtNR5P1XDxd6kOLDcBZlBGC+Frqe7aP5\n98lteAuneoN1emMifQLKUXs86pHSoJt7ZJ3/l6WTOdKmC3bQ+NDRgIlc/2fh\nxJPX/rVPjrK1brbANR/DV2lxus/G775TO7CxptTqkDzX7qvzrjvDUzTIa99Y\ntLNkLFqpcJ9/spuVdvF4O6LNb3B9zYW32d7Gs/TPqTB5WBYcTWn3l223fnXl\nYlJRwwmiycT3m800jTY8ZqReaySBXtIrZy58k7d9QYVbt4aQ2N18OPTYrjVl\nNISEFZvUtT4RGzmDlASHAuBdcdsXZq4XsmH6TvFDNzwxlo65TBoGDiKTDXbK\nR9LFd7+2BNyHBzOXsKODrl3Tbr/Dx9MSRaLqf4332s0Rhp9Zacqyz49CdDOn\nTeuQzUAhR+DSR3Mu+jAJ59SAtEztc98SR1t4LY9sQVVuNhVae0G7iZ3UC0vh\n1PWpDdML9yIieJS7iZAsx2d1VLrOODuewfNz9Pr0Kdl6aC6c9M7lT8lJQeXo\n3JY4y2c9NGr+yB4HGb42LbzfHSbNSLle3HH6GHTQs9Tek82AEQ3PLR5reYwJ\nypZlZR91KdoO/l1hW5+xrEESYuQWjE8640epRKn3Sxk42ShTAuaPHAP6TCXi\nb7eu\r\n=GXVP\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCocO8ixaTdtJAvt1TpYTgXMw3PoYIpRX42Aq4Pq5hxcgIgRvmgpNJEB0Wkps28/rAcaoruMwjAUF54cXrmScefF3Y="}]},"maintainers":[{"name":"lrembacz","email":"qwester1213@op.pl"}],"_npmUser":{"name":"lrembacz","email":"qwester1213@op.pl"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-draggable_0.0.4_1576530541649_0.2916804643031561"},"_hasShrinkwrap":false}},"time":{"created":"2019-12-01T22:36:09.267Z","0.0.1":"2019-12-01T22:36:09.626Z","modified":"2022-04-05T05:36:10.903Z","0.0.2":"2019-12-10T01:13:47.737Z","0.0.3":"2019-12-15T09:53:47.149Z","0.0.4":"2019-12-16T21:09:01.889Z"},"maintainers":[{"name":"lrembacz","email":"qwester1213@op.pl"}],"description":"Draggable component for VueJS","homepage":"https://github.com/lrembacz/vue-dragndrop#readme","keywords":["vue draggable","vue-draggable","draggable"],"repository":{"type":"git","url":"git+https://github.com/lrembacz/vue-dragndrop.git","directory":"packages/draggable"},"author":{"name":"Łukasz Rembacz"},"bugs":{"url":"https://github.com/lrembacz/vue-dragndrop/issues"},"license":"MIT","readme":"# Draggable\r\n\r\nDraggable component for VueJS 2+ which implements [@dragndrop/draggable](https://github.com/lrembacz/dragndrop/tree/master/packages/draggable) component. \r\n\r\n## Design & API Documentation\r\n\r\n- [Demos](https://dragndrop.lukaszrembacz.pl/examples/)\r\n\r\n## Installation\r\n\r\n```\r\nnpm install @dragndrop/vue-draggable\r\n```\r\n\r\n## Usage\r\n\r\nDraggable element can be used for different functionalities - from moving elements around to make sortable list or draggable grid elements.\r\n\r\n### Typescript support\r\n\r\nComponent has its declarations (*.d.ts) for Typescript available.\r\n\r\n### Registration\r\n\r\n```javascript\r\nimport {VueDraggable} from '@dragndrop/vue-draggable';\r\n\r\nVue.component('VueDraggable', VueDraggable);\r\n```\r\n\r\n### Registration as plugin\r\n\r\n```javascript\r\nimport Vue from 'vue';\r\nimport VueDraggable from '@dragndrop/vue-draggable';\r\n\r\nVue.use(VueDraggable);\r\n```\r\n\r\n### Simple example\r\n\r\n```vue\r\n<template>\r\n    <VueDraggable \r\n        :data=\"dataTransfer\"\r\n        :avatar=\"avatar\"\r\n        @onDrag=\"onDrag\"\r\n    >\r\n        <div>Example element</div>\r\n    </VueDraggable>\r\n</template>\r\n<script>\r\n    export default {\r\n        data() {\r\n            return {\r\n                dataTransfer: 'example data',\r\n                avatar: new Avatar.clone(),\r\n            }\r\n        },\r\n        methods: {\r\n            onDrag(event) {\r\n                console.log(event.dragInfo.data); // 'example data'\r\n            }\r\n        }\r\n    }\r\n</script>\r\n```\r\n\r\n### CSS Classes (they can be changed)\r\n\r\nCSS Class | Description\r\n--- | ---\r\n`draggable--dragging` | Sets this class to element when dragging\r\n`draggable--occurring` | Sets this class to body element when dragging\r\n\r\n### Shadow DOM\r\n\r\nIf you want to use dragndrop in Shadow DOM you need to add `draggable--retarget` attribute to your host element so events will be bubble through Shoadow DOM and recursive `elementFromPoint()` calls will work correctly. \r\n\r\n\r\n### Events\r\n\r\nEvents | Type | Data | Description\r\n--- | --- | --- | ---\r\n`onDragStart` | CustomEvent | {originalEvent, dragInfo, dropzoneElement} | Event dispatched when dragging starts\r\n`onDrag` | CustomEvent | {originalEvent, dragInfo, dropzoneElement} | Event dispatched when dragging\r\n`onDragEnd` | CustomEvent | {originalEvent, dragInfo, dropzoneElement} | Event dispatched when dragging ends\r\n\r\n### DragInfo\r\n            \r\nDragInfo | Type | Description\r\n--- | --- | ---\r\n`draggableId` | Number | Id of draggable element\r\n`element` | Element | Draggable element \r\n`data` | Type Generic | Data attached to draggable with data property\r\n`startPosition` | Point | Start position\r\n`avatar` | Avatar | Avatar attached to draggable with avatar property\r\n`axis` | Axis | Axis which dragging is handled 'horizontal', 'vertical' and 'both'\r\n`position` | Point | Current position of cursor\r\n`shift` | Point | Distance from start position to elements top-left corner\r\n\r\n### Props\r\n\r\nProperty | Value Type | Description\r\n--- | --- | ---\r\n`data` | Generic Type | Data which is attached to draggable\r\n`draggable` | Boolean | Turn on / off draggable functionality\r\n`avatar` | Avatar | Element which is rendered when element is dragging\r\n`axis` | Axis ('both', 'horizontal', 'vertical') | Axis the dragging is available for\r\n`handle` | String | Selector on which dragging is available (children of element are included)\r\n`cancel` | String | Selectors on which draggins is not available (children of element are included)\r\n`draggingClass` | String | Class which is set on element when dragging (`draggable--dragging` default)\r\n`draggingClassBody` | String | Class which is set on body element when dragging (`draggable--occurring` default)\r\n`minDragStartDistance` | number | Min distance to start dragStart state (`4` default)\r\n`touchAction` | String or null | Makes `touch-action` property set on element when drag is started (`undefined` default)\r\n`customScroll` | ((startPosition: Point, currentPosition: Point) => void) or boolean | Allows to specify customScroll behavior with function or when set with `false` prevents from custom scroll which is set by default \r\n\r\n### Methods\r\n\r\nMethod Signature | Description\r\n--- | ---\r\n`abort() => void` | Aborts current dragging\r\n`destroy() => void` | Clean up method. Is used on beforeDestroy hook.\r\n\r\n","readmeFilename":"README.md"}