{"_id":"@cs09g/vue-colorpicker","_rev":"4-21fbda4da93688af8fcddec6fed49e60","name":"@cs09g/vue-colorpicker","dist-tags":{"latest":"1.0.3"},"versions":{"1.0.0":{"name":"@cs09g/vue-colorpicker","version":"1.0.0","description":"Fork from Colorpicker of Vue Components @caohenghu/vue-colorpicker","main":"src/main.js","scripts":{"hot":"webpack-dev-server --env.config local --env.local","pro":"webpack --env.config pro --env.pro","gh":"node build/gh.js"},"keywords":["vue","colorpicker","color"],"repository":{"type":"git","url":"git+https://github.com/cs09g/vue-colorpicker.git"},"author":{"name":"cs09g","email":"cs09g@gmail.com"},"license":"MIT","devDependencies":{"clean-webpack-plugin":"^3.0.0","css-loader":"^3.2.0","eslint":"^6.2.2","eslint-plugin-vue":"^6.1.2","file-loader":"^4.2.0","gh-pages":"^2.0.1","html-webpack-plugin":"^3.2.0","node-sass":"^4.11.0","sass-loader":"^7.1.0","url-loader":"^2.1.0","vue-loader":"^15.5.1","vue-template-compiler":"^2.5.22","webpack":"^4.41.6","webpack-cli":"^3.2.1","webpack-dev-server":"^3.1.14"},"gitHead":"aef71008c75d516f9f6cd9855c40da8b8ea39f6e","bugs":{"url":"https://github.com/cs09g/vue-colorpicker/issues"},"homepage":"https://github.com/cs09g/vue-colorpicker#readme","_id":"@cs09g/vue-colorpicker@1.0.0","_npmVersion":"6.4.1","_nodeVersion":"10.13.0","_npmUser":{"name":"cs09g","email":"cs09gi@gmail.com"},"dist":{"integrity":"sha512-wrrl3pmq8vXoHpiy0SyUpP9B/CX9+XhIVxdWERvKfzXU9by6AatR/MzE4R2OcrzFbRbyyFM9GygGXkwwZK/xrg==","shasum":"f70452473266d11b455146c560b922c6fa4172d2","tarball":"https://registry.npmjs.org/@cs09g/vue-colorpicker/-/vue-colorpicker-1.0.0.tgz","fileCount":27,"unpackedSize":410238,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeU5OICRA9TVsSAnZWagAA4mAP/AwXMcMb+urEjQ2xeKTf\n6LpYoPhZsRL39MUi9bG26D9/zHZntG7as9YP1ixgerhg/HjCZfY/2ZPMBmNZ\njQlt3we+PyN5Bau8ufJ6rXcTbapnTkQCQdyJkp3fVjfLJzKpDSqrLHr2lymG\nBfHhI1+uZw6i52Y4viRZStK7HjS6b1iZFHj4D72Q42jdt+m46mW4XsH4+5fk\nrXgw92VWYAZ0apK28HBDqazMRtEWUiZzG1hWPVcFhBj2RIJ85Vjj4igmHxxX\n5Pi8+JyUKJv+KrZdvbJhsxdYKMUVJBjkV7LFiwfh6PVNW2bdH4z1bLI6gxh2\n2hCkC5RXGDZEqYGbOnIZcMyon77JR7ZV6jhCl/PDoOVxifAjlh8Z6MQ/F6y8\nqaiaWXgC+c/g4v5AGJXzqfjUEHqAL8Lsz/f2g8kuXEyA1xTUPOMh3uHqXx5f\nblohIVMy4VickrjrkJnpVWRKgjlrLAwzk7X8d8wR8fPVSA7aJbsir4RnOs0v\na/uG5dO7iE/P9bw5q+CDOVZIgkClEUWce0iVOQKB1HwQJMxnG3ZqQcXtc42N\nygQSvlbMdh039Z36FRDWEBFSj9pfuA3WZ7CHNml6TreFC22p5QWFIPkDy634\nmPgTpUATDHBzjnjn7N8FgCD2Pfu6orh/XYVwDFUyKpD+KjW5/ejmpsHKnoCy\nXVhy\r\n=2v9C\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDFyYPI7s29ddS37pgvU2Gz/gxiJWs2H40Rl2lRtSdsfAIhAOaoVbo2xqt2RLYLq9JfJvnmMZL+A/r/AsiqsXZNMy98"}]},"maintainers":[{"name":"cs09g","email":"cs09gi@gmail.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-colorpicker_1.0.0_1582535559633_0.1623644558125623"},"_hasShrinkwrap":false},"1.0.1":{"name":"@cs09g/vue-colorpicker","version":"1.0.1","description":"Fork from Colorpicker of Vue Components @caohenghu/vue-colorpicker","main":"src/main.js","scripts":{"hot":"webpack-dev-server --env.config local --env.local","pro":"webpack --env.config pro --env.pro","gh":"node build/gh.js"},"keywords":["vue","colorpicker","color"],"repository":{"type":"git","url":"git+https://github.com/cs09g/vue-colorpicker.git"},"author":{"name":"cs09g","email":"cs09g@gmail.com"},"license":"MIT","devDependencies":{"clean-webpack-plugin":"^3.0.0","css-loader":"^3.2.0","eslint":"^6.2.2","eslint-plugin-vue":"^6.1.2","file-loader":"^4.2.0","gh-pages":"^2.0.1","html-webpack-plugin":"^3.2.0","node-sass":"^4.11.0","sass-loader":"^7.1.0","url-loader":"^2.1.0","vue-loader":"^15.5.1","vue-template-compiler":"^2.5.22","webpack":"^4.41.6","webpack-cli":"^3.2.1","webpack-dev-server":"^3.1.14"},"gitHead":"aef71008c75d516f9f6cd9855c40da8b8ea39f6e","bugs":{"url":"https://github.com/cs09g/vue-colorpicker/issues"},"homepage":"https://github.com/cs09g/vue-colorpicker#readme","_id":"@cs09g/vue-colorpicker@1.0.1","_npmVersion":"6.4.1","_nodeVersion":"10.13.0","_npmUser":{"name":"cs09g","email":"cs09gi@gmail.com"},"dist":{"integrity":"sha512-Mzp2004TW/CZK2UTijmQTTsHMOKsC902gDyTdlX9O8Oh/VMXfFcoSBFAP7x5bbwb9jC/IyB5A6xTS2KzfT+SBA==","shasum":"ea69f8fc6e348677fef7230f6d60fa8c3555e66e","tarball":"https://registry.npmjs.org/@cs09g/vue-colorpicker/-/vue-colorpicker-1.0.1.tgz","fileCount":27,"unpackedSize":409691,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeU5VSCRA9TVsSAnZWagAAXG0P/A24tufBsJN8f8F4t+/9\nxZPjsilT3FGe8O+U9LhqWRLShN+wTSSXhLgtv3vRT/C+g6uP3SOZ5lk07MNp\n7ZwvX465FJVjyFboCsa84MM6pRL2MrpLvW/upzDrCwjGBBXPNgQFcO15QyAk\n6SiVL/V49++kXI18/Z4mLxU+pv3sEYgaS3ziwoeNDa2BSq2xwdZD8rOL2HCF\nzB1wWc1FJ3BH6LwNjRlM8DlvsmDIER+0hW2VdXhke2lyU3ogmekHUaC7kKzF\n59uxeHl4faiFK/fAoWgvujuMDg1+kuTNdMcI9qeKCO/j1LrSP759m7zEXLli\nj9GWwQTPs2/vZrimW1/+dEs+9CeSO+8QN+zt26O2uNEGaDPGSZmNxqwdNprd\nkKmjLzcO7f7BS1Nwrrre5k0qV6HV0Loy7TMqc5vp7TPhqSpTDDxNanoYmIV1\nwkuUtw9E0+wE7GQ30LdYjZzChGRVfQaXMoMLxZQ1rnkIk20+1jpaky2eLM5d\neBmQUPOlhaMP37qCudRLbxv6P/rMbBOvpFYZVmLObvS0eSPBdiFDkbbNNKXE\nWT04UwZGWaSIuzDzZMmffDDjYfxbn6jYuH+ZlftkxHWUYf+3W6rXmo+WQpEb\n8JYxeoRFVPW38aLDk3yNz8ift2tAZ2DVmFvo7HOechM2pJETHD6yNqmAy3cc\nM80p\r\n=wRS2\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCtBAiRd9VT0rLBOTdGk02IOaIdUalDT/q/Q+Mp8xW21wIgCFOAaU2L41HgEWoFWSP/0Xv/If/C4cP8KM+ypUzmEd8="}]},"maintainers":[{"name":"cs09g","email":"cs09gi@gmail.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-colorpicker_1.0.1_1582536017603_0.6960318480539613"},"_hasShrinkwrap":false},"1.0.2":{"name":"@cs09g/vue-colorpicker","version":"1.0.2","description":"Fork from Colorpicker of Vue Components @caohenghu/vue-colorpicker","main":"src/main.js","scripts":{"hot":"webpack-dev-server --env.config local --env.local","pro":"webpack --env.config pro --env.pro","gh":"node build/gh.js"},"keywords":["vue","colorpicker","color"],"repository":{"type":"git","url":"git+https://github.com/cs09g/vue-colorpicker.git"},"author":{"name":"cs09g","email":"cs09g@gmail.com"},"license":"MIT","devDependencies":{"clean-webpack-plugin":"^3.0.0","css-loader":"^3.2.0","eslint":"^6.2.2","eslint-plugin-vue":"^6.1.2","file-loader":"^4.2.0","gh-pages":"^2.0.1","html-webpack-plugin":"^3.2.0","node-sass":"^4.11.0","sass-loader":"^7.1.0","url-loader":"^2.1.0","vue-loader":"^15.5.1","vue-template-compiler":"^2.5.22","webpack":"^4.41.6","webpack-cli":"^3.2.1","webpack-dev-server":"^3.1.14"},"gitHead":"aef71008c75d516f9f6cd9855c40da8b8ea39f6e","bugs":{"url":"https://github.com/cs09g/vue-colorpicker/issues"},"homepage":"https://github.com/cs09g/vue-colorpicker#readme","_id":"@cs09g/vue-colorpicker@1.0.2","_npmVersion":"6.4.1","_nodeVersion":"10.13.0","_npmUser":{"name":"cs09g","email":"cs09gi@gmail.com"},"dist":{"integrity":"sha512-Fu46h7/wWW758YbeumHnH+3zMj23G2jeB4JVAQ5fA+WwpHeznKh/BAwJpidItfhYw8BMuKfVbp0ePIR67WkaTw==","shasum":"001a304a9ff3ab2dbb3f6558c6d364fe2740e50c","tarball":"https://registry.npmjs.org/@cs09g/vue-colorpicker/-/vue-colorpicker-1.0.2.tgz","fileCount":27,"unpackedSize":409691,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeU5ZQCRA9TVsSAnZWagAAbs0P/2y50NezP+q5/0yxcgNu\n88hmrYTJUmXQ/6/MOLn1l8gWU6BLJ3oqsWcVtDrU9DUnFxdiCXWOM/HpguLi\nrrRX4zshB7/zNSVPWtyVRSiGzxjpB7/J9MLwJJ6PAb6H+N/RbdC7HP13esST\nHQZ8mWaCxD01AQLuWIRfnSe+BvE83/omDnNIIsnnUbtWDC+2SkVlqv/zA7Gl\nFOKjaMQY6FeA+ZaQ1lJhbYD+ElF3Cz94iof4h5KAa8yqqj91Fne6YXUq72rl\nOvpNmE/aV3YY9QP6FnyzdnyhpHM6rFepcXLG/z2iNbXwfwzonZGzLWq2FCfE\n8vIqlKFLeOlfsyZ8a4gcoTHoYVGhhtS8WAVmGmFyBP/G9TbD8svrhG8mvGT5\nKVmDfyhw64e8xRPaxG9lH/rO2KEEYprn4kGUFHP4ToXKX4yEvp1lf+JmK14+\nB4cYrVR0wXRnDzRLG1kGnKddGAKpbUbfhaih2d9Dbqcgfhbp5nltxNF+5Usq\nEAk9p6E5bvXfm289EGj9Tl5CkampworI19Z6Y3o09GXlVTHbpj1vnmTHF7WA\nezDZpR8qKI08er1lUEmHRK0OY4MLXcEb5heh4FXSDI4/CgIt4/+EdB43RHAb\n5X/yKzZYzIpH1Py23RHElUmR9cxTg3DsWUAs55Rek3+++9wwxSpptba6w2KO\nVVXu\r\n=HsIN\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCcus2lD3ixaoTlK9t7w4C0xNtdWk4dAH0ws1xTuH0xYgIhAJcGSaG77tCz6/0H8u6MpaL3x3r5u2Aom+NZe3r1rXa9"}]},"maintainers":[{"name":"cs09g","email":"cs09gi@gmail.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-colorpicker_1.0.2_1582536271630_0.19600113508480055"},"_hasShrinkwrap":false},"1.0.3":{"name":"@cs09g/vue-colorpicker","version":"1.0.3","description":"Fork from Colorpicker of Vue Components @caohenghu/vue-colorpicker","main":"src/main.js","scripts":{"hot":"webpack-dev-server --env.config local --env.local","pro":"webpack --env.config pro --env.pro","gh":"node build/gh.js"},"keywords":["vue","colorpicker","color"],"repository":{"type":"git","url":"git+https://github.com/cs09g/vue-colorpicker.git"},"author":{"name":"cs09g","email":"cs09g@gmail.com"},"license":"MIT","devDependencies":{"clean-webpack-plugin":"^3.0.0","css-loader":"^3.2.0","eslint":"^6.2.2","eslint-plugin-vue":"^6.1.2","file-loader":"^4.2.0","gh-pages":"^2.0.1","html-webpack-plugin":"^3.2.0","node-sass":"^4.11.0","sass-loader":"^7.1.0","url-loader":"^2.1.0","vue-loader":"^15.5.1","vue-template-compiler":"^2.5.22","webpack":"^4.41.6","webpack-cli":"^3.2.1","webpack-dev-server":"^3.1.14"},"gitHead":"0736b898177dd411828f4446c43ed87467ae36d8","bugs":{"url":"https://github.com/cs09g/vue-colorpicker/issues"},"homepage":"https://github.com/cs09g/vue-colorpicker#readme","_id":"@cs09g/vue-colorpicker@1.0.3","_npmVersion":"6.4.1","_nodeVersion":"10.13.0","_npmUser":{"name":"cs09g","email":"cs09gi@gmail.com"},"dist":{"integrity":"sha512-fygfq2Dgi04LaTK+zl1vJkZiDvIMUiEwEokjBtCvmKWSqFPHPp7Q8VNfTuSHW3GFzywxvnRA4XYhBaYmPkN5+Q==","shasum":"e7ea198eb6042f383c66be5f008c1db48fd6259e","tarball":"https://registry.npmjs.org/@cs09g/vue-colorpicker/-/vue-colorpicker-1.0.3.tgz","fileCount":27,"unpackedSize":409691,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeU5igCRA9TVsSAnZWagAAjvIP/1vl+mQNF3wazdeX0e/A\nMBE+P27oSIm/uYa11GL5qIRK1NlyPiVzgYYEGFiaIn1Zrpgn/eiEhRn98wv3\n/NN+UrmkYIueSJyDZ7+jnqT3+hP6T/QztoW7510lUYC+Wfn9NqeCd5PH9p46\n4GNqJB998cZQg89wC7GVeHLoJwpxqtxdMwK9H4JTuj8/qx9tzuaOhrW5M+TR\nIp8+OMJucAcoIpz9k4NuI0QhnhrFypaWSsZERaGoJtT0m2Ll4OTzvqMKHKNo\nis3sOrpBdoEjTm1iNpnQZhClc1Fp4cpnKtjkHrkSy9lySoiviuDZnmB0OezH\nJkrQXKPmtWKJHdLj62+nCA8xQ2aONNS1GAwqxcDsqv41dvrH72iPLQLQMWdA\n5r+XdTgBT1OEZM68VpOyB1upo3+SFbRgHUJ+N3KkoJL0Ck2knJfW4C1eTS7y\nIyjpZsJghwJU7LeTlFdW5jx/msKE+9Mc/Abs6saBOoAUuQouNRgfJQDSFZUk\naEPRxO+fP25hlLfCvKGqGRWZIDflznpoTw0OdqPC+RCCjTh3N1HotgNYPjEA\ng2ks8d6+pxoEIYqP+cbEU7/xdyZ3ID69j7fNqTCpevNl22oWnf/jr7eQldrA\nQgv5+KTSHHmvpCJDE2WY1n4FJxE+WMrD1N0dh9j7uiQZahbPjNVEiS8/yFDO\nMfjX\r\n=qeNd\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDFisT/ryRIen8wcE7I3tRG2xMLOW3lQdP+Inscy3pEiAIgF31FmNbomFMPubGs8rfO9NUf+s/SRsWK1ANM48dLjgA="}]},"maintainers":[{"name":"cs09g","email":"cs09gi@gmail.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-colorpicker_1.0.3_1582536863770_0.051752681051877136"},"_hasShrinkwrap":false}},"time":{"created":"2020-02-24T09:12:39.604Z","1.0.0":"2020-02-24T09:12:39.846Z","modified":"2022-04-05T02:01:15.184Z","1.0.1":"2020-02-24T09:20:17.852Z","1.0.2":"2020-02-24T09:24:31.783Z","1.0.3":"2020-02-24T09:34:23.944Z"},"maintainers":[{"name":"cs09g","email":"cs09gi@gmail.com"}],"description":"Fork from Colorpicker of Vue Components @caohenghu/vue-colorpicker","homepage":"https://github.com/cs09g/vue-colorpicker#readme","keywords":["vue","colorpicker","color"],"repository":{"type":"git","url":"git+https://github.com/cs09g/vue-colorpicker.git"},"author":{"name":"cs09g","email":"cs09g@gmail.com"},"bugs":{"url":"https://github.com/cs09g/vue-colorpicker/issues"},"license":"MIT","readme":"# vue-colorpicker\r\n\r\n## [LiveDemo](https://cs09g.github.io/vue-colorpicker/)\r\n\r\n![preview-dark](https://raw.githubusercontent.com/cs09g/vue-colorpicker/master/src/img/preview-dark.jpg)\r\n![preview-light](https://raw.githubusercontent.com/cs09g/vue-colorpicker/master/src/img/preview-light.jpg)\r\n\r\n## Install\r\n\r\n```bash\r\n$ yarn add @cs09g/vue-colorpicker\r\n```\r\n\r\n## Example\r\n\r\n```html\r\n<template>\r\n    <div :style=\"{background: color}\">\r\n        <color-picker\r\n            theme=\"light\"\r\n            :color=\"color\"\r\n            :sucker-hide=\"false\"\r\n            :sucker-canvas=\"suckerCanvas\"\r\n            :sucker-area=\"suckerArea\"\r\n            @changeColor=\"changeColor\"\r\n            @openSucker=\"openSucker\"\r\n        />\r\n    </div>\r\n</template>\r\n\r\n<script>\r\n    import colorPicker from '@cs09g/vue-colorpicker'\r\n\r\n    export default {\r\n        components: {\r\n            colorPicker\r\n        },\r\n        data() {\r\n            return {\r\n                color: '#59c7f9',\r\n                suckerCanvas: null,\r\n                suckerArea: [],\r\n                isSucking: false\r\n            }\r\n        },\r\n        methods: {\r\n            changeColor(color) {\r\n                const { r, g, b, a } = color.rgba\r\n                this.color = `rgba(${r}, ${g}, ${b}, ${a})`\r\n            },\r\n            openSucker(isOpen) {\r\n                if (isOpen) {\r\n                    // ... canvas be created\r\n                    // this.suckerCanvas = canvas\r\n                    // this.suckerArea = [x1, y1, x2, y2]\r\n                } else {\r\n                    // this.suckerCanvas && this.suckerCanvas.remove\r\n                }\r\n            }\r\n        }\r\n    }\r\n</script>\r\n```\r\n\r\n## Options\r\n\r\n| Name               | Type              | Default                                                                                                                                                                                  | Description                             |\r\n| ------------------ | ----------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------- |\r\n| theme              | String            | `dark`                                                                                                                                                                                   | `dark` or `light`                       |\r\n| color              | String            | `#000000`                                                                                                                                                                                | `rgba` or `hex`                         |\r\n| colors-default     | Array             | `['#000000', '#FFFFFF', '#FF1900', '#F47365', '#FFB243', '#FFE623', '#6EFF2A', '#1BC7B1', '#00BEFF', '#2E81FF', '#5D61FF', '#FF89CF', '#FC3CAD', '#BF3DCE', '#8E00A7', 'rgba(0,0,0,0)']` | like `['#ff00ff', '#0f0f0f', ...]`      |\r\n| colors-history-key | String            | `vue-colorpicker-history`                                                                                                                                                                |\r\n| sucker-hide        | Boolean           | `true`                                                                                                                                                                                   | `true` or `false`                       |\r\n| sucker-canvas      | HTMLCanvasElement | `null`                                                                                                                                                                                   | like `document.createElement('canvas')` |\r\n| sucker-area        | Array             | `[]`                                                                                                                                                                                     | like `[x1, y1, x2, y2]`                 |\r\n\r\n> `color` is one-way data flow, so you can't use `v-model`. why? because you'll listen `changeColor` event do more things, so i think it's not necessary here.\r\n\r\n## Events\r\n\r\n| Name        | Type     | Args   | Description            |\r\n| ----------- | -------- | ------ | ---------------------- |\r\n| changeColor | Function | color  | `{ rgba: {}, hsv: {}, hex: String}` |\r\n| openSucker  | Function | isOpen | `true` or `false`      |\r\n\r\n> if you want use sucker, then `openSucker`, `sucker-hide`, `sucker-canvas`, `sucker-area` is necessary. when you click sucker button, you can click it again or press key of `esc` to exit.\r\n","readmeFilename":"README.md"}