{"_id":"@caohenghu/colorpicker","_rev":"3-ca4eb2245075720d2c972a85a8e35b66","name":"@caohenghu/colorpicker","dist-tags":{"latest":"1.0.2"},"versions":{"1.0.0":{"name":"@caohenghu/colorpicker","version":"1.0.0","description":"Colorpicker with no dependency","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":["colorpicker","color"],"repository":{"type":"git","url":"git+https://github.com/caohenghu/colorpicker.git"},"author":{"name":"caohenghu","email":"caohenghu@gmail.com"},"license":"MIT","devDependencies":{"@babel/core":"^7.5.5","@babel/preset-env":"^7.5.5","autoprefixer":"^9.6.1","babel-eslint":"^10.0.2","babel-loader":"^8.0.6","clean-webpack-plugin":"^3.0.0","css-loader":"^3.2.0","eslint":"^6.2.1","file-loader":"^4.2.0","gh-pages":"^2.1.1","html-loader":"^0.5.5","html-webpack-plugin":"^3.2.0","node-sass":"^4.12.0","postcss-loader":"^3.0.0","sass-loader":"^7.2.0","style-loader":"^1.0.0","url-loader":"^2.1.0","webpack":"^4.39.2","webpack-cli":"^3.3.7","webpack-dev-server":"^3.8.0"},"gitHead":"6b058afc52199d1c4c33d8124c92e4874a32be1f","bugs":{"url":"https://github.com/caohenghu/colorpicker/issues"},"homepage":"https://github.com/caohenghu/colorpicker#readme","_id":"@caohenghu/colorpicker@1.0.0","_nodeVersion":"10.16.0","_npmVersion":"6.9.0","dist":{"integrity":"sha512-tKGDbIjrFw16QsllRtN8t5J2dLFSCl2yWsDyKyL+XgpEetINXuvMsOFHGf9NqbkJqgBe2gmXEMqtD+ALhbUiBg==","shasum":"09483884130e8ca3adba54e2c2360443d2aeb2d9","tarball":"https://registry.npmjs.org/@caohenghu/colorpicker/-/colorpicker-1.0.0.tgz","fileCount":45,"unpackedSize":160937,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdZ4ZkCRA9TVsSAnZWagAAECUP/jlknMJ2y/+RL05KLoE+\nQObvMDTeTusCdzbY9aSQEuSgjLmwpazReSe1IT3mp9s0Fl9bqJYOweGnPeUu\nKfzj+CZ0nL5jnHw3RskZ0E0M+V9S/9QA07t+WwixwMFIbgG404PDWFLq8dD8\nVF2mHbfPSkGwrn9j+Qa26tYXyoOHxc0cPxH45+hdcQ4T3xk49N5jW9QEY+rM\ngqpwXMlWLYhH4/+HiHkeHI5X0KjvGtpG5SER6ISgah2FydUlck7Zeo0xEOVv\ndq5T0wD9/RkWRMg0my0mvYk0ybw17qsca/VBEEnkB9Hr5F3346UPzS3vFcPY\n5wYWAciXK9kOew7vlHsmcjTHw5Y9/3dAXlzMrkyGbH5tx1NedWIsKlV0MfL8\nUh04wbpwd0zoFUCase7HgG6VQ3kc73Iaud0/v3LO056YBRmk40GSZlFPqOcs\nSXwtN/7q4e1CO0LmG/7VBfpmgLYMzw6aoGiEyEt9JvTPtxr9K/636XCJAFZG\nMuLJ1+D3Hm04UYwP3BdUuV+qqQYA/rBVZDsCYfc5+i4Y7iE3U36p8Cue0noX\nyT++WfiElBO/1T6dE3GG8TPfgDJT/w91kS++AlyuZumEZleQl8sEMVoIL12g\n4QtVmJxIDXsCQnuhNVkTd0Civ0WdUaXcDCnvMeusDajhwENDb3pz+zyyK6D1\ni8d5\r\n=+2Nl\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDxmKF1oLxL9E/ktNVX84inzwKYZUQM3anObikmblx8cwIgCr+1Z3ALV+Ut3KyDAvTbEm28JWCjA8QRjCkR0w24fQc="}]},"maintainers":[{"name":"caohenghu","email":"caohenghu@gmail.com"}],"_npmUser":{"name":"caohenghu","email":"caohenghu@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/colorpicker_1.0.0_1567065699805_0.43706954491258654"},"_hasShrinkwrap":false},"1.0.1":{"name":"@caohenghu/colorpicker","version":"1.0.1","description":"Colorpicker with no dependency","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":["colorpicker","color"],"repository":{"type":"git","url":"git+https://github.com/caohenghu/colorpicker.git"},"author":{"name":"caohenghu","email":"caohenghu@gmail.com"},"license":"MIT","devDependencies":{"@babel/core":"^7.5.5","@babel/preset-env":"^7.5.5","autoprefixer":"^9.6.1","babel-eslint":"^10.0.2","babel-loader":"^8.0.6","clean-webpack-plugin":"^3.0.0","css-loader":"^3.2.0","eslint":"^6.2.1","file-loader":"^4.2.0","gh-pages":"^2.1.1","html-loader":"^0.5.5","html-webpack-plugin":"^3.2.0","node-sass":"^4.12.0","postcss-loader":"^3.0.0","sass-loader":"^7.2.0","style-loader":"^1.0.0","url-loader":"^2.1.0","webpack":"^4.39.2","webpack-cli":"^3.3.7","webpack-dev-server":"^3.8.0"},"gitHead":"04e0b67f47744db9633d3da5701abcbbe8d2e3b9","bugs":{"url":"https://github.com/caohenghu/colorpicker/issues"},"homepage":"https://github.com/caohenghu/colorpicker#readme","_id":"@caohenghu/colorpicker@1.0.1","_nodeVersion":"10.16.0","_npmVersion":"6.9.0","dist":{"integrity":"sha512-dKqLe74i350GtPXfrFKpp7FOTFjZfN8pG1+aoNwMTG23W7WQwdG+g0ww4QfHloTz0k82KVs2X8zDteErtwj8yQ==","shasum":"ce736fdc3f1b5b5e0a533269d309d18d5952eea3","tarball":"https://registry.npmjs.org/@caohenghu/colorpicker/-/colorpicker-1.0.1.tgz","fileCount":45,"unpackedSize":161101,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdZ4loCRA9TVsSAnZWagAAL0sP/i//QzHsVFm4EDQbt77E\nUomo6CqeIULKzol7CKUrbLNWeAnhPcART2G4iUt73wYxEM+0Hb0aHcvWOE/I\n6p8TtPSYptkJm0JZUIXrOgOeld/CLmKUxTtrFjRNjVzALcBMhyyw0oZ0uLmX\n4TJfTEaASthHHcZiEbW1sQmCtRqHNxtKeCFt1HCyah7T2UuwwaiYfceW9vXa\ntU/HjmQp9g//B4KsiShCH5Pmqn/hf9MFHmG9+ashUtsOKIBD3xe8ajcobg46\nNEBp6yh+Esci+eugRIs09P/W6MBeW9GcEwzg7hUb2uA2JCxEdgS1K+tZerRR\nMfJF9llSjJW5P4jPmM4JBecEpQKqMrLFYeaimRN6cyXVeaEimrOTb0Ujo1nj\nZabhR1svmuGu9SFd3JvzYBFSiXzcCAM2PJ5SMay4Lb1IyLUGbCjMPG1sXZGz\nyYXeSavOOXnMUDTYgXS/cEPc23CQL9t7qB5Exs+abmqN1lyK+lgJMVF7cx7J\nBLWO6y58/rtZ2QPilFUVT04hEnOTT7ZKd/bgKu53I03N7REwD6+O+joSViXe\neoqm8khaTc5STvG+FWZo1QNQpgi1nMP1rTG+3sJW7tnMbhhNthw7XI3DHCOh\n2kzID+Zl0Oyj9S7QS7RjKl44VIYvJKQSkr/ht8BZ3cI2hBAgWON94LpruwQu\ncv9T\r\n=NoX3\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCQ1pAov/Mac1yd1bnLEyAnf3PbQzMm6VAJWTNv+fVFlwIhAPRxDeayAb5ZMGjvb2ICqT7utmZ7LKLxD79vkr9jnFK8"}]},"maintainers":[{"name":"caohenghu","email":"caohenghu@gmail.com"}],"_npmUser":{"name":"caohenghu","email":"caohenghu@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/colorpicker_1.0.1_1567066471860_0.07013069848307185"},"_hasShrinkwrap":false},"1.0.2":{"name":"@caohenghu/colorpicker","version":"1.0.2","description":"Colorpicker with no dependency","main":"src/index.js","scripts":{"hot":"webpack-dev-server --env.config local  --env.local","pro":"rm -rf dist && webpack --env.config pro --env.pro","gh":"node build/gh.js"},"keywords":["colorpicker","color"],"repository":{"type":"git","url":"git+https://github.com/caohenghu/colorpicker.git"},"author":{"name":"caohenghu","email":"caohenghu@gmail.com"},"license":"MIT","devDependencies":{"@babel/core":"^7.5.5","@babel/preset-env":"^7.5.5","autoprefixer":"^9.6.1","babel-eslint":"^10.0.2","babel-loader":"^8.0.6","css-loader":"^3.2.0","eslint":"^6.2.1","file-loader":"^4.2.0","gh-pages":"^2.1.1","html-loader":"^0.5.5","html-webpack-plugin":"^3.2.0","mini-css-extract-plugin":"^0.8.0","node-sass":"^4.12.0","optimize-css-assets-webpack-plugin":"^5.0.3","postcss-loader":"^3.0.0","sass-loader":"^7.2.0","style-loader":"^1.0.0","url-loader":"^2.1.0","webpack":"^4.41.6","webpack-cli":"^3.3.7","webpack-dev-server":"^3.8.0"},"gitHead":"f6bd55e9ab7e06126296354904b393fd2ae4828b","bugs":{"url":"https://github.com/caohenghu/colorpicker/issues"},"homepage":"https://github.com/caohenghu/colorpicker#readme","_id":"@caohenghu/colorpicker@1.0.2","_nodeVersion":"12.13.0","_npmVersion":"6.12.0","dist":{"integrity":"sha512-T/rI+bDzYPAtGORncb6QC8z/N2eLBaZDlDMyfq+jxp6VdwhwIPZQq7+/AmEtXmqWEsKPt6Pj+PcJueapwYrWsA==","shasum":"ce39de796db5a4786b7291cd8183473a471b502d","tarball":"https://registry.npmjs.org/@caohenghu/colorpicker/-/colorpicker-1.0.2.tgz","fileCount":29,"unpackedSize":79643,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeVNJOCRA9TVsSAnZWagAAqhAQAIw5V+1dQPZZSsDs9rTc\nhvXxPdp59g57+CUhWQ/Lld8lzvkORz6LsVRhf9YCYOelXgVM2wUNYjTd7QUa\nnbEGLrth0E4/lpBCGSEfJx9ilGcmdcuE0aHQBAr8n5OUtvApl/g3UewTEkb4\nI0cVJZWw0m+3jckQqnDcMTEQ/sJisWun0j74s4XZ2/tZ1+iUHzY7eI58DdtX\nwEQa9c4neYKK8z2f/Fnf5L1mFpcDIJz5CT1bncRJRlSwZr4TqUm+oBq2mhXF\nUEGQffJAq4SQik7ujUFubW//Ls2ZjvO/jIosboWIyxWm65yioa1WUO8A5PlY\nkOUN3eOZ3vyYPqBYkGFENhGtReXhQ8zq6E25vRI5zECjQPkuNoDe9QNFzuv8\ncvToc9LGfkR+vLObKMvahyJiQ/rvTGsXXxwo9VizSYt3fb12tVNxQWwCVJNo\nvg6l8yI2K88oCBk8FOGIaOVOOMO7MbP/RtJYqClQSSZaq1C4WkzHKSAXfh2q\n9ONa7fmgU5GsympHwN0X0N0KhTLMrvP9G+crIGuA+/QZEuouIp2BxANTbZVS\nZHOOVyjY71ZhuafmWlW/QaeOAr6Ku9NWw1jRdjZH8AES7EiwGZ7W/5IMYMlN\nO3Xfr+EfcPepDA7CzZPSeFwTfI6Ekljntu69SxU1esBIeZb8+VlUj+FhC6PH\n32Mn\r\n=mZ/P\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCj+f7+cTrIEkxVcR7Jd4xGicBqrp/yq4/n5vc62yOZjQIhANiESBWiKNemiqpU2SwLAgp7sVi+GRwvDbUH5womweLy"}]},"maintainers":[{"name":"caohenghu","email":"caohenghu@gmail.com"}],"_npmUser":{"name":"caohenghu","email":"caohenghu@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/colorpicker_1.0.2_1582617165793_0.4103784012964058"},"_hasShrinkwrap":false}},"time":{"created":"2019-08-29T08:01:39.581Z","1.0.0":"2019-08-29T08:01:39.990Z","modified":"2022-04-04T21:43:52.930Z","1.0.1":"2019-08-29T08:14:32.064Z","1.0.2":"2020-02-25T07:52:45.895Z"},"maintainers":[{"name":"caohenghu","email":"caohenghu@gmail.com"}],"description":"Colorpicker with no dependency","homepage":"https://github.com/caohenghu/colorpicker#readme","keywords":["colorpicker","color"],"repository":{"type":"git","url":"git+https://github.com/caohenghu/colorpicker.git"},"author":{"name":"caohenghu","email":"caohenghu@gmail.com"},"bugs":{"url":"https://github.com/caohenghu/colorpicker/issues"},"license":"MIT","readme":"# colorpicker\n\n## [LiveDemo](https://caohenghu.github.io/colorpicker/)\n\n![preview-dark](https://raw.githubusercontent.com/caohenghu/colorpicker/master/src/img/preview-dark.jpg)\n![preview-light](https://raw.githubusercontent.com/caohenghu/colorpicker/master/src/img/preview-light.jpg)\n\n## Install\n\n```bash\n$ yarn add @caohenghu/colorpicker\n```\n\n## Example\n\n```javascript\nimport ColorPicker from '@caohenghu/colorpicker'\n\nexport default class App {\n    constructor(props) {\n        super(props)\n        this.changeColor = this.changeColor.bind(this)\n        this.openSucker = this.openSucker.bind(this)\n        this.color = '#59c7f9'\n        this.$bg = null\n        this.$cover = null\n        this.suckerCanvas = null\n        this.colorpicker = new ColorPicker({\n            theme: '',\n            color: this.color,\n            suckerHide: false,\n            openSucker: this.openSucker,\n            changeColor: this.changeColor\n        })\n    }\n\n    render() {\n        this.$bg = document.querySelector('.bg')\n        this.$cover = document.querySelector('.cover')\n        this.$cover.appendChild(this.colorpicker.$el)\n        this.$bg.style.background = this.color\n    }\n\n    changeColor(color) {\n        const { r, g, b, a } = color.rgba\n        this.$bg.style.background = `rgba(${r},${g},${b},${a})`\n    }\n\n    openSucker(isOpen) {\n        if (isOpen) {\n            // ... canvas be created, and get the area of canvas\n            // this.colorpicker.canvasLoaded({\n            //     suckerCanvas: this.suckerCanvas,\n            //     suckerArea: [\n            //         coverRect.left,\n            //         coverRect.top,\n            //         coverRect.left + coverRect.width,\n            //         coverRect.top + coverRect.height\n            //     ]\n            // })\n        } else {\n            // this.suckerCanvas && this.suckerCanvas.remove()\n        }\n    }\n}\n```\n\n## new ColorPicker(options)\n\n### Options\n\n| Name             | Type     | Default/Args                                                                                                                                                                             | Description                        |\n| ---------------- | -------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------- |\n| theme            | String   | `dark`                                                                                                                                                                                   | `dark` or `light`                  |\n| color            | String   | `#000000`                                                                                                                                                                                | `rgba` or `hex`                    |\n| colorsDefault    | Array    | `['#000000', '#FFFFFF', '#FF1900', '#F47365', '#FFB243', '#FFE623', '#6EFF2A', '#1BC7B1', '#00BEFF', '#2E81FF', '#5D61FF', '#FF89CF', '#FC3CAD', '#BF3DCE', '#8E00A7', 'rgba(0,0,0,0)']` | like `['#ff00ff', '#0f0f0f', ...]` |\n| colorsHistoryKey | String   | `colorpicker-history`                                                                                                                                                                    |\n| suckerHide       | Boolean  | `true`                                                                                                                                                                                   | `true` or `false`                  |\n| changeColor      | Function | color                                                                                                                                                                                    | `{ rgba: {}, hsv: {}, hex: '' }`             |\n| openSucker       | Function | isOpen                                                                                                                                                                                   | `true` or `false`                  |\n\n> if you want to use sucker, then `openSucker`, `suckerHide` is necessary. and when `canvas` is ready, you can call function `colorpicker.canvasLoaded` width args `suckerCanvas` and `suckerArea`. when you click sucker button, you can click it again or press key of `esc` to exit.\n\n## colorpicker.canvasLoaded(options)\n\n### Options\n\n| Name         | Type              | Default | Description                             |\n| ------------ | ----------------- | ------- | --------------------------------------- |\n| suckerCanvas | HTMLCanvasElement | `null`  | like `document.createElement('canvas')` |\n| suckerArea   | Array             | `[]`    | like `[x1, y1, x2, y2]`                 |\n\n## colorpicker.close()\n\n> when you want to close colorpicker, you can call function `colorpicker.close()`, it can remember current color into history.\n","readmeFilename":"README.md"}