{"_id":"@chaos-synthesis/react-color-picker","_rev":"5-2d959d2104732a82802fe612a3420617","name":"@chaos-synthesis/react-color-picker","dist-tags":{"latest":"0.5.6"},"versions":{"0.5.0":{"name":"@chaos-synthesis/react-color-picker","version":"0.5.0","description":"An easy to use color picker for React.js","repository":{"type":"git","url":"git+https://github.com/chaos-synthesis/react-color-picker.git"},"keywords":["react","color","picker","react.js","tool","editor"],"author":{"name":"Dmitriy Prilipko"},"sideEffects":false,"exports":{"import":"./dist/esm/index.js","require":"./dist/cjs/index.js"},"main":"dist/cjs/index.js","module":"dist/esm/index.js","types":"dist/esm/index.d.ts","scripts":{"build":"NODE_ENV=production rollup -c","build:storybook":"build-storybook","changeset":"changeset","lint":"eslint . --ext .ts,.tsx,.js,.jsx","prepare":"husky install","release":"changeset publish","storybook":"start-storybook -p 6006 --quiet","test":"NODE_ENV=test jest","test:coverage":"NODE_ENV=test jest --coverage","test:watch":"NODE_ENV=test jest --watch"},"lint-staged":{"*.{js,jsx,ts,tsx}":["eslint --fix","prettier --write"],"*.{md,mdx,yml,json}":["prettier --write"]},"browserslist":["> 1%","not dead","not edge <= 18","not ie 11","not op_mini all"],"dependencies":{"@babel/runtime":"^7","@types/tinycolor2":"^1.4.3","tinycolor2":"^1.6.0"},"devDependencies":{"@babel/core":"^7.20.12","@babel/plugin-transform-runtime":"^7.19.6","@babel/preset-env":"^7.20.2","@babel/preset-react":"^7.18.6","@changesets/cli":"^2.26.0","@commitlint/cli":"^17.4.1","@commitlint/config-conventional":"^17.4.0","@emotion/babel-plugin":"^11.10.5","@emotion/react":"^11.10.5","@emotion/styled":"^11.10.5","@mdx-js/react":"^1.6.22","@rollup/plugin-babel":"^6.0.3","@rollup/plugin-commonjs":"^24.0.0","@rollup/plugin-node-resolve":"^15.0.1","@rollup/plugin-terser":"^0.3.0","@storybook/addon-a11y":"^6.5.15","@storybook/addon-actions":"^6.5.15","@storybook/addon-essentials":"^6.5.15","@storybook/addon-interactions":"^6.5.15","@storybook/addon-links":"^6.5.15","@storybook/builder-webpack5":"^6.5.15","@storybook/manager-webpack5":"^6.5.15","@storybook/react":"^6.5.15","@storybook/testing-library":"^0.0.13","@testing-library/jest-dom":"^5.16.5","@testing-library/react":"^13.4.0","@testing-library/user-event":"^14.4.3","@trivago/prettier-plugin-sort-imports":"^4.0.0","@types/jest":"^29.2.5","@types/node":"^18.11.18","@types/react":"^18.0.26","@types/react-dom":"^18.0.10","@types/styled-components":"^5.1.26","@types/testing-library__jest-dom":"^5.14.5","@typescript-eslint/eslint-plugin":"^5.48.1","@typescript-eslint/parser":"^5.48.1","@zerollup/ts-transform-paths":"^1.7.18","babel-loader":"^9.1.2","eslint":"8.31.0","eslint-config-prettier":"^8.6.0","eslint-plugin-jsx-a11y":"^6.7.1","eslint-plugin-prettier":"^4.2.1","eslint-plugin-react":"^7.32.0","eslint-plugin-react-hooks":"^4.6.0","eslint-plugin-testing-library":"^5.9.1","husky":"^8.0.3","jest":"^29.3.1","jest-environment-jsdom":"^29.3.1","jest-transform-stub":"^2.0.0","lint-staged":"^13.1.0","prettier":"^2.8.2","react":"^18.2.0","react-dom":"^18.2.0","rollup":"^2.79.1","rollup-plugin-delete":"^2.0.0","rollup-plugin-peer-deps-external":"^2.2.4","rollup-plugin-typescript2":"^0.34.1","ts-jest":"^29.0.4","tslib":"^2.4.1","ttypescript":"^1.5.15","typescript":"^4.9.4","typescript-transform-paths":"^3.4.6","webpack":"^5.75.0","webpack-cli":"^5.0.1"},"peerDependencies":{"@emotion/react":"^11","@emotion/styled":"^11","react":">= 16.8 || 18.0.0"},"engines":{"node":">=16"},"bugs":{"url":"https://github.com/chaos-synthesis/react-color-picker/issues"},"homepage":"https://github.com/chaos-synthesis/react-color-picker#readme","_id":"@chaos-synthesis/react-color-picker@0.5.0","_nodeVersion":"16.18.1","_npmVersion":"8.19.2","dist":{"integrity":"sha512-82xRKslDsnPvh+h8TPrV6SqI+lDhbWfFzQHnJecniaPHC4XUkwxIjiv+NV1FVsr0lwu1LUQKp9mXjBPfnT9A5g==","shasum":"6cca433a24437dd124726a9f7bffacd7fe8a6a09","tarball":"https://registry.npmjs.org/@chaos-synthesis/react-color-picker/-/react-color-picker-0.5.0.tgz","fileCount":97,"unpackedSize":390074,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCZVRRivQCzdiaPP2En6RtkMh5fl6XMI3YhO4SHYv+L7gIgd7I9n4i0Zp+/pHjoPsis/AeqbtpjV04hwmuP+5neRJI="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJkNZohACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmr44Q/+OPV5nhHt5s0BPW/NanRl1v+sJIOaVWjO40ZOczHlzUGgd+ag\r\nlsDixuC2RulhbvGQB6yd8qK7l9S7fb0KaXIghqKdCouk2JFm258ee6Ld+Onu\r\n+l/+HZp7d3Wft785WNxUGqV9vNRMdkQW30caZTFZNrXr6YyfIw8hPlT+EV0a\r\nRNoVF06rZ8ZP4yE0h916Srh0i9vDY6N+LoGsmMLASYLb9CjuJRoiMAHNooLM\r\nhTJ6D0OhqMhxTPypQ8kQYaxNuhr8bvhmKVhhLD3B5zpnABNXH6N+LX3MV1pg\r\n96fUjA1IeZcPWOue4VXlEAPSuQxGNX8zIgIu02onmnLEnfEmGyzdwIWXyudt\r\n4E0GbMoQVGJPt1NM7iBBKEbhyL7jkOrs4aizzoqVQOFRrz0absxbR8JwiWk7\r\nycFjlRFLxCWVR7TsO8DublZtm6VykYwcsXIgigyfcT3zf2mdzlzD0Z+UTnz2\r\n0FgwHXeoFL1SIvKB25opNHnk+LRmwr2QYPnw70eEQm7txSHMlZia18nt6Od4\r\npuKhwoZvVr12EDjf7HgW0h+nVVkS835iUNgbpzPwPJBaeOA6V3/Tk/R1EnGa\r\nMaxoqGwEvRIrEJPsT5Os8jCTFWrNoeDWqcLpBONDRF6Py4PBFbU+qqlxFIyI\r\nuTCvfHX77DOVn2YX/yfUsU6EIvlslKqxXsY=\r\n=Xr4J\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"chaos-synthesis","email":"vedmakw5@gmail.com"},"directories":{},"maintainers":[{"name":"chaos-synthesis","email":"vedmakw5@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-color-picker_0.5.0_1681234465315_0.6496947402128586"},"_hasShrinkwrap":false},"0.5.1":{"name":"@chaos-synthesis/react-color-picker","version":"0.5.1","description":"An easy to use color picker for React.js","repository":{"type":"git","url":"git+https://github.com/chaos-synthesis/react-color-picker.git"},"keywords":["react","color","picker","react.js","tool","editor"],"author":{"name":"Dmitriy Prilipko"},"sideEffects":false,"exports":{"import":"./dist/esm/index.js","require":"./dist/cjs/index.js"},"main":"dist/cjs/index.js","module":"dist/esm/index.js","types":"dist/esm/index.d.ts","scripts":{"build":"NODE_ENV=production rollup -c","build:storybook":"build-storybook","changeset":"changeset","lint":"eslint . --ext .ts,.tsx,.js,.jsx","prepare":"husky install","release":"changeset publish","storybook":"start-storybook -p 6006 --quiet","test":"NODE_ENV=test jest","test:coverage":"NODE_ENV=test jest --coverage","test:watch":"NODE_ENV=test jest --watch"},"lint-staged":{"*.{js,jsx,ts,tsx}":["eslint --fix","prettier --write"],"*.{md,mdx,yml,json}":["prettier --write"]},"browserslist":["> 1%","not dead","not edge <= 18","not ie 11","not op_mini all"],"dependencies":{"@babel/runtime":"^7","@types/tinycolor2":"^1.4.3","tinycolor2":"^1.6.0"},"devDependencies":{"@babel/core":"^7.20.12","@babel/plugin-transform-runtime":"^7.19.6","@babel/preset-env":"^7.20.2","@babel/preset-react":"^7.18.6","@changesets/cli":"^2.26.0","@commitlint/cli":"^17.4.1","@commitlint/config-conventional":"^17.4.0","@emotion/babel-plugin":"^11.10.5","@emotion/react":"^11.10.5","@emotion/styled":"^11.10.5","@mdx-js/react":"^1.6.22","@rollup/plugin-babel":"^6.0.3","@rollup/plugin-commonjs":"^24.0.0","@rollup/plugin-node-resolve":"^15.0.1","@rollup/plugin-terser":"^0.3.0","@storybook/addon-a11y":"^6.5.15","@storybook/addon-actions":"^6.5.15","@storybook/addon-essentials":"^6.5.15","@storybook/addon-interactions":"^6.5.15","@storybook/addon-links":"^6.5.15","@storybook/builder-webpack5":"^6.5.15","@storybook/manager-webpack5":"^6.5.15","@storybook/react":"^6.5.15","@storybook/testing-library":"^0.0.13","@testing-library/jest-dom":"^5.16.5","@testing-library/react":"^13.4.0","@testing-library/user-event":"^14.4.3","@trivago/prettier-plugin-sort-imports":"^4.0.0","@types/jest":"^29.2.5","@types/node":"^18.11.18","@types/react":"^18.0.26","@types/react-dom":"^18.0.10","@types/styled-components":"^5.1.26","@types/testing-library__jest-dom":"^5.14.5","@typescript-eslint/eslint-plugin":"^5.48.1","@typescript-eslint/parser":"^5.48.1","@zerollup/ts-transform-paths":"^1.7.18","babel-loader":"^9.1.2","eslint":"8.31.0","eslint-config-prettier":"^8.6.0","eslint-plugin-jsx-a11y":"^6.7.1","eslint-plugin-prettier":"^4.2.1","eslint-plugin-react":"^7.32.0","eslint-plugin-react-hooks":"^4.6.0","eslint-plugin-testing-library":"^5.9.1","husky":"^8.0.3","jest":"^29.3.1","jest-environment-jsdom":"^29.3.1","jest-transform-stub":"^2.0.0","lint-staged":"^13.1.0","prettier":"^2.8.2","react":"^18.2.0","react-dom":"^18.2.0","rollup":"^2.79.1","rollup-plugin-delete":"^2.0.0","rollup-plugin-peer-deps-external":"^2.2.4","rollup-plugin-typescript2":"^0.34.1","ts-jest":"^29.0.4","tslib":"^2.4.1","ttypescript":"^1.5.15","typescript":"^4.9.4","typescript-transform-paths":"^3.4.6","webpack":"^5.75.0","webpack-cli":"^5.0.1"},"peerDependencies":{"@emotion/react":"^11","@emotion/styled":"^11","react":">= 16.8 || 18.0.0"},"engines":{"node":">=16"},"bugs":{"url":"https://github.com/chaos-synthesis/react-color-picker/issues"},"homepage":"https://github.com/chaos-synthesis/react-color-picker#readme","_id":"@chaos-synthesis/react-color-picker@0.5.1","_nodeVersion":"16.18.1","_npmVersion":"8.19.2","dist":{"integrity":"sha512-wXvkhFpxPaMoXwYPR6cnhHRBkax1sltK1chmN3LIv2MD/xN7SVJrglDOYmETxTAlfyxxOSgVgvkQPSNaaanhzw==","shasum":"4e96738180579a11aa76a3c9752d675106e750c4","tarball":"https://registry.npmjs.org/@chaos-synthesis/react-color-picker/-/react-color-picker-0.5.1.tgz","fileCount":97,"unpackedSize":233214,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIENYJDBm2y4f6ekIvwz+0eIgWWzOk0pnNVgX6TQV2ENUAiBP9NX+NjU0oS9TDD19H16zE23AuqxSQ0/9dKEGLRWG7w=="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJkNohTACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqzCQ//WAbTdpwD6XI9ogTyBPR+jWYMWuCl5Kd1320pXQdHkGeFHR3W\r\n5WbXLCZc5rSKYZ2BS+L5F9ZysH9tR7NPmNLywfahrMYWybr5lo9Qze0XJtwF\r\nbpepYGju5BUjEze8G4FP34t/kAjZ56QeN805ERRUsa0qqLfKnn/AOQ1OlNBd\r\natf+Uh8R1DKp/CsUO4IUhnZ3H5AJZPupGSa7KlWTRJ4o5GlLSC5qrzw01BPX\r\nl+SEEBXg/ZeyZO3PlS7wREb/YThtdYZjbMba/Z+74YHxUrPTPzviqOYiToAl\r\njby+qk+IS2zuZElaXHc/7G3FKuIyRQwGJyVdHKpRjf1dvA3SwMMKDuWR37NE\r\nID7fGBNwmBqRe/CukuC76zIqyVsiZGM6nuT6KvSTXF5vRYpCjauBnHbAA+2u\r\nwTfQbr44tiQS7IdVkOmwt5HMSE1i8d3ysAPBzFZ9lznHdqkpDRA4nstXHfq4\r\nHAUhQV7/tpj3o0oqqlzoY8mLzoOks9IjHXt16ax0IyBXrAPKfYqnX5RMQvrx\r\neLjMPLB8idi81Pyd0pPqQgR8H6kZAA/Tshz5Jyvd395Gfj1vFq1eGg8ebks2\r\nJfuOtEwIVfL2org45ycAGSJJ9AYR3LA5v42XoRXR5EeVqdQKat/li+3LvnR0\r\nibpo2FE1pQgreyhAdTCANvjkRJMI8q1IwkE=\r\n=x+58\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"chaos-synthesis","email":"vedmakw5@gmail.com"},"directories":{},"maintainers":[{"name":"chaos-synthesis","email":"vedmakw5@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-color-picker_0.5.1_1681295443696_0.38154861813319796"},"_hasShrinkwrap":false},"0.5.3":{"name":"@chaos-synthesis/react-color-picker","version":"0.5.3","description":"An easy to use color picker for React.js","repository":{"type":"git","url":"git+https://github.com/chaos-synthesis/react-color-picker.git"},"keywords":["react","color","picker","react.js","tool","editor"],"author":{"name":"Dmitriy Prilipko"},"sideEffects":false,"exports":{"import":"./dist/esm/index.js","require":"./dist/cjs/index.js"},"main":"dist/cjs/index.js","module":"dist/esm/index.js","types":"dist/esm/index.d.ts","scripts":{"build":"NODE_ENV=production rollup -c","build:storybook":"build-storybook","changeset":"changeset","lint":"eslint . --ext .ts,.tsx,.js,.jsx","prepare":"husky install","release":"changeset publish","storybook":"start-storybook -p 6006 --quiet","test":"NODE_ENV=test jest","test:coverage":"NODE_ENV=test jest --coverage","test:watch":"NODE_ENV=test jest --watch"},"lint-staged":{"*.{js,jsx,ts,tsx}":["eslint --fix","prettier --write"],"*.{md,mdx,yml,json}":["prettier --write"]},"browserslist":["> 1%","not dead","not edge <= 18","not ie 11","not op_mini all"],"dependencies":{"@babel/runtime":"^7","@types/tinycolor2":"^1.4.3","tinycolor2":"^1.6.0"},"devDependencies":{"@babel/core":"^7.20.12","@babel/plugin-transform-runtime":"^7.19.6","@babel/preset-env":"^7.20.2","@babel/preset-react":"^7.18.6","@changesets/cli":"^2.26.0","@commitlint/cli":"^17.4.1","@commitlint/config-conventional":"^17.4.0","@emotion/babel-plugin":"^11.10.5","@emotion/react":"^11.10.5","@emotion/styled":"^11.10.5","@mdx-js/react":"^1.6.22","@rollup/plugin-babel":"^6.0.3","@rollup/plugin-commonjs":"^24.0.0","@rollup/plugin-node-resolve":"^15.0.1","@rollup/plugin-terser":"^0.3.0","@storybook/addon-a11y":"^6.5.15","@storybook/addon-actions":"^6.5.15","@storybook/addon-essentials":"^6.5.15","@storybook/addon-interactions":"^6.5.15","@storybook/addon-links":"^6.5.15","@storybook/builder-webpack5":"^6.5.15","@storybook/manager-webpack5":"^6.5.15","@storybook/react":"^6.5.15","@storybook/testing-library":"^0.0.13","@testing-library/jest-dom":"^5.16.5","@testing-library/react":"^13.4.0","@testing-library/user-event":"^14.4.3","@trivago/prettier-plugin-sort-imports":"^4.0.0","@types/jest":"^29.2.5","@types/node":"^18.11.18","@types/react":"^18.0.26","@types/react-dom":"^18.0.10","@types/styled-components":"^5.1.26","@types/testing-library__jest-dom":"^5.14.5","@typescript-eslint/eslint-plugin":"^5.48.1","@typescript-eslint/parser":"^5.48.1","@zerollup/ts-transform-paths":"^1.7.18","babel-loader":"^9.1.2","eslint":"8.31.0","eslint-config-prettier":"^8.6.0","eslint-plugin-jsx-a11y":"^6.7.1","eslint-plugin-prettier":"^4.2.1","eslint-plugin-react":"^7.32.0","eslint-plugin-react-hooks":"^4.6.0","eslint-plugin-testing-library":"^5.9.1","husky":"^8.0.3","jest":"^29.3.1","jest-environment-jsdom":"^29.3.1","jest-transform-stub":"^2.0.0","lint-staged":"^13.1.0","prettier":"^2.8.2","react":"^18.2.0","react-dom":"^18.2.0","rollup":"^2.79.1","rollup-plugin-delete":"^2.0.0","rollup-plugin-peer-deps-external":"^2.2.4","rollup-plugin-typescript2":"^0.34.1","ts-jest":"^29.0.4","tslib":"^2.4.1","ttypescript":"^1.5.15","typescript":"^4.9.4","typescript-transform-paths":"^3.4.6","webpack":"^5.75.0","webpack-cli":"^5.0.1"},"peerDependencies":{"@emotion/react":"^11","@emotion/styled":"^11","react":">= 16.8 || 18.0.0"},"engines":{"node":">=16"},"bugs":{"url":"https://github.com/chaos-synthesis/react-color-picker/issues"},"homepage":"https://github.com/chaos-synthesis/react-color-picker#readme","_id":"@chaos-synthesis/react-color-picker@0.5.3","_nodeVersion":"16.18.1","_npmVersion":"8.19.2","dist":{"integrity":"sha512-ZzGfYzUI4lNGqK/zeAJgWd3IwW1zL2gl0JpemKLCDMKYDkfbUvpETt3aowdHbHUGb3Fpk+7anKy20U0WvoYmJg==","shasum":"5d741cf837fb038f4ccda5672d449510b678aa9a","tarball":"https://registry.npmjs.org/@chaos-synthesis/react-color-picker/-/react-color-picker-0.5.3.tgz","fileCount":97,"unpackedSize":234524,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCeSOJ6jpbP1eQQ459zQ5hmW5xggbyS1nJcWKsJ4mq6NQIhAJhK7ShjLc5wf+tFZO3MJKhKzjmvG3Sg66Br3RyAT4F8"}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJkNpqUACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmolAw//RNK2G2CqPhvQSdpwHQ+1UjTv467J1z19pxmXMKB2D/PiXf6A\r\nTWJgx/R/gw307onST3791v64ZFijBAChWav/3jJlXMMmJRFjJwrGpUOnY9I8\r\nxr7kIbN5kpzBd/TK+nG4CbzsJbwxKuxT7pK5K29zP9YnUcCOtE+KlpnBGQRl\r\nrVfY/u6+1LJE9fINxoMwB/AhRXOfhvtFXEFKxi/8RJPQ1LnLSpMU0A3p1EHC\r\neRukfioJLo/MVVQLyuiRXucZ2hdz5PxAAjYBNjuj6qcXkLE6WUFn8EC0WSuX\r\nW/52yBRy6w0rQJ3rv8HWR1IOdqmWYj4gmU1jN+ZlJXnc4mz//iB7YqknnpQi\r\nA/aVGsLof0HgGrcISx490+2eHmx4frpiu9zLlKT90mOvDUgfEP1l5/OhaqrB\r\n9J6Iv0Jva0+A9AKmk5lz3/5WDyBfezM21ORmvjBeueHo6xaODsE0F0awxu/a\r\n/QalM3U6soMs682pxMmU7ZDwOnbwl7Af2fAEZeUBzWBrP6+NQRRIVQRQg6J9\r\nFBrB7mv74bpNCsPYpK5EBiQzwCAHUpMsbZHsMSXstYzyHlEwANJOyFXoq/4W\r\nW2+DvRKdEk/t+O0uqPJtctBUkeVf8pxHUJqB/d82SbsOk4pM1zpSgrBj0i2w\r\nD6onHrufFQSiqgQnUmS4BkTpxLedj1USrrQ=\r\n=Vxjy\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"chaos-synthesis","email":"vedmakw5@gmail.com"},"directories":{},"maintainers":[{"name":"chaos-synthesis","email":"vedmakw5@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-color-picker_0.5.3_1681300115962_0.1137766116682506"},"_hasShrinkwrap":false},"0.5.4":{"name":"@chaos-synthesis/react-color-picker","version":"0.5.4","description":"An easy to use color picker for React.js","repository":{"type":"git","url":"git+https://github.com/chaos-synthesis/react-color-picker.git"},"keywords":["react","color","picker","react.js","tool","editor"],"author":{"name":"Dmitriy Prilipko"},"sideEffects":false,"exports":{"import":"./dist/esm/index.js","require":"./dist/cjs/index.js"},"main":"dist/cjs/index.js","module":"dist/esm/index.js","types":"dist/esm/index.d.ts","scripts":{"build":"NODE_ENV=production rollup -c","build:storybook":"build-storybook","changeset":"changeset","lint":"eslint . --ext .ts,.tsx,.js,.jsx","prepare":"husky install","release":"changeset publish","storybook":"start-storybook -p 6006 --quiet","test":"NODE_ENV=test jest","test:coverage":"NODE_ENV=test jest --coverage","test:watch":"NODE_ENV=test jest --watch"},"lint-staged":{"*.{js,jsx,ts,tsx}":["eslint --fix","prettier --write"],"*.{md,mdx,yml,json}":["prettier --write"]},"browserslist":["> 1%","not dead","not edge <= 18","not ie 11","not op_mini all"],"dependencies":{"@babel/runtime":"^7","@types/tinycolor2":"^1.4.3","tinycolor2":"^1.6.0"},"devDependencies":{"@babel/core":"^7.20.12","@babel/plugin-transform-runtime":"^7.19.6","@babel/preset-env":"^7.20.2","@babel/preset-react":"^7.18.6","@changesets/cli":"^2.26.0","@commitlint/cli":"^17.4.1","@commitlint/config-conventional":"^17.4.0","@emotion/babel-plugin":"^11.10.5","@emotion/react":"^11.10.5","@emotion/styled":"^11.10.5","@mdx-js/react":"^1.6.22","@rollup/plugin-babel":"^6.0.3","@rollup/plugin-commonjs":"^24.0.0","@rollup/plugin-node-resolve":"^15.0.1","@rollup/plugin-terser":"^0.3.0","@storybook/addon-a11y":"^6.5.15","@storybook/addon-actions":"^6.5.15","@storybook/addon-essentials":"^6.5.15","@storybook/addon-interactions":"^6.5.15","@storybook/addon-links":"^6.5.15","@storybook/builder-webpack5":"^6.5.15","@storybook/manager-webpack5":"^6.5.15","@storybook/react":"^6.5.15","@storybook/testing-library":"^0.0.13","@testing-library/jest-dom":"^5.16.5","@testing-library/react":"^13.4.0","@testing-library/user-event":"^14.4.3","@trivago/prettier-plugin-sort-imports":"^4.0.0","@types/jest":"^29.2.5","@types/node":"^18.11.18","@types/react":"^18.0.26","@types/react-dom":"^18.0.10","@types/styled-components":"^5.1.26","@types/testing-library__jest-dom":"^5.14.5","@typescript-eslint/eslint-plugin":"^5.48.1","@typescript-eslint/parser":"^5.48.1","@zerollup/ts-transform-paths":"^1.7.18","babel-loader":"^9.1.2","eslint":"8.31.0","eslint-config-prettier":"^8.6.0","eslint-plugin-jsx-a11y":"^6.7.1","eslint-plugin-prettier":"^4.2.1","eslint-plugin-react":"^7.32.0","eslint-plugin-react-hooks":"^4.6.0","eslint-plugin-testing-library":"^5.9.1","husky":"^8.0.3","jest":"^29.3.1","jest-environment-jsdom":"^29.3.1","jest-transform-stub":"^2.0.0","lint-staged":"^13.1.0","prettier":"^2.8.2","react":"^18.2.0","react-dom":"^18.2.0","rollup":"^2.79.1","rollup-plugin-delete":"^2.0.0","rollup-plugin-peer-deps-external":"^2.2.4","rollup-plugin-typescript2":"^0.34.1","ts-jest":"^29.0.4","tslib":"^2.4.1","ttypescript":"^1.5.15","typescript":"^4.9.4","typescript-transform-paths":"^3.4.6","webpack":"^5.75.0","webpack-cli":"^5.0.1"},"peerDependencies":{"@emotion/react":"^11","@emotion/styled":"^11","react":">= 16.8 || 18.0.0"},"engines":{"node":">=16"},"bugs":{"url":"https://github.com/chaos-synthesis/react-color-picker/issues"},"homepage":"https://github.com/chaos-synthesis/react-color-picker#readme","_id":"@chaos-synthesis/react-color-picker@0.5.4","_nodeVersion":"16.18.1","_npmVersion":"8.19.2","dist":{"integrity":"sha512-ywWw0AJUBKiqWbiBTjuEq7lgS4uy+5XQGQXDyIMs7+2Es8qxI1bo803RwluqV8BAVFPv9SF54FrOH9nrUI75kQ==","shasum":"a246f53f1e746cdb8f5231f91c2898b990af2290","tarball":"https://registry.npmjs.org/@chaos-synthesis/react-color-picker/-/react-color-picker-0.5.4.tgz","fileCount":97,"unpackedSize":233606,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIEFikQy1PcqdlGCkhPfKR2WYQQ7jTo5XsgE3uFeC1NIzAiBZAm+gpwmZII207IBK1zulCowGWDJuMEMYNaaRHEQKHQ=="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJkNqI5ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmqr2RAAgcgdcDvHJI2hNU4qxwb5uKrKoao8Ouh1xRUxfjMZREpCB509\r\nWLhxTqMn3wOxIc6fzIGJBUX9cuT37YM5/5ViGVlrFz36PBxGec5cgQmwycpS\r\n3QsuprY42Y9trFJ10KBl/Ch0ojUMThMtfB3KPVR0JHWKPjDj4Fre/NHDK9uh\r\npXHe7Wz1ybJ9FoRNrRRyPBaW15QcAStR84j5qA6ioPNqfSN8mpoQaFYSlVr6\r\nCeBl6mdPlQEgEmmDlj+11/JeIcqSJ5HTWsmmdD2fHtLN+MO6gw40HoKY0nwq\r\nGtNq9FbV02R5nklrlaWil54ac5PYmIp6uDPMkF6dGi7ojr3A64n39TMM8rx4\r\n30mt5uv2zle6wXO3FAWNLMDbF9/m9ztCjanqe+hXPhIWlHS6/hGnRhFMTdlZ\r\n1dbrRH+zXZQ04FpN0letRMpZg+3Yj24qIEEeQUz+c+mEC4DQZKVG5lc2mcOV\r\nrTU2a7DkE+LTDbQTqjrVApt81JiDRZeuLT48yJ4W93QZFye+N4/s30ceJYo8\r\n+bK6W2IcZ6B87DhpbjSnTBM+m7YknBNHbR7in0y5Nixzpy17dawhFzoaGsEt\r\n8XeLmt0xmrNPce358PqTmdXCASWBVRekGogkqmpuSr+fhorSArRXE3Iaa37e\r\nORzdnkQoypH5l0s5JgfEW7a0gXD7DoSEOMw=\r\n=O0Ok\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"chaos-synthesis","email":"vedmakw5@gmail.com"},"directories":{},"maintainers":[{"name":"chaos-synthesis","email":"vedmakw5@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-color-picker_0.5.4_1681302072993_0.9402255788419831"},"_hasShrinkwrap":false},"0.5.5":{"name":"@chaos-synthesis/react-color-picker","version":"0.5.5","description":"An easy to use color picker for React.js","repository":{"type":"git","url":"git+https://github.com/chaos-synthesis/react-color-picker.git"},"keywords":["react","color","picker","react.js","tool","editor"],"author":{"name":"Dmitriy Prilipko"},"sideEffects":false,"exports":{"import":"./dist/esm/index.js","require":"./dist/cjs/index.js"},"main":"dist/cjs/index.js","module":"dist/esm/index.js","types":"dist/esm/index.d.ts","scripts":{"build":"NODE_ENV=production rollup -c","build:storybook":"build-storybook","changeset":"changeset","lint":"eslint . --ext .ts,.tsx,.js,.jsx","prepare":"husky install","release":"changeset publish","storybook":"start-storybook -p 6006 --quiet","test":"NODE_ENV=test jest","test:coverage":"NODE_ENV=test jest --coverage","test:watch":"NODE_ENV=test jest --watch"},"lint-staged":{"*.{js,jsx,ts,tsx}":["eslint --fix","prettier --write"],"*.{md,mdx,yml,json}":["prettier --write"]},"browserslist":["> 1%","not dead","not edge <= 18","not ie 11","not op_mini all"],"dependencies":{"@babel/runtime":"^7","@types/tinycolor2":"^1.4.3","tinycolor2":"^1.6.0"},"devDependencies":{"@babel/core":"^7.20.12","@babel/plugin-transform-runtime":"^7.19.6","@babel/preset-env":"^7.20.2","@babel/preset-react":"^7.18.6","@changesets/cli":"^2.26.0","@commitlint/cli":"^17.4.1","@commitlint/config-conventional":"^17.4.0","@emotion/babel-plugin":"^11.10.5","@emotion/react":"^11.10.5","@emotion/styled":"^11.10.5","@mdx-js/react":"^1.6.22","@rollup/plugin-babel":"^6.0.3","@rollup/plugin-commonjs":"^24.0.0","@rollup/plugin-node-resolve":"^15.0.1","@rollup/plugin-terser":"^0.3.0","@storybook/addon-a11y":"^6.5.15","@storybook/addon-actions":"^6.5.15","@storybook/addon-essentials":"^6.5.15","@storybook/addon-interactions":"^6.5.15","@storybook/addon-links":"^6.5.15","@storybook/builder-webpack5":"^6.5.15","@storybook/manager-webpack5":"^6.5.15","@storybook/react":"^6.5.15","@storybook/testing-library":"^0.0.13","@testing-library/jest-dom":"^5.16.5","@testing-library/react":"^13.4.0","@testing-library/user-event":"^14.4.3","@trivago/prettier-plugin-sort-imports":"^4.0.0","@types/jest":"^29.2.5","@types/node":"^18.11.18","@types/react":"^18.0.26","@types/react-dom":"^18.0.10","@types/styled-components":"^5.1.26","@types/testing-library__jest-dom":"^5.14.5","@typescript-eslint/eslint-plugin":"^5.48.1","@typescript-eslint/parser":"^5.48.1","@zerollup/ts-transform-paths":"^1.7.18","babel-loader":"^9.1.2","eslint":"8.31.0","eslint-config-prettier":"^8.6.0","eslint-plugin-jsx-a11y":"^6.7.1","eslint-plugin-prettier":"^4.2.1","eslint-plugin-react":"^7.32.0","eslint-plugin-react-hooks":"^4.6.0","eslint-plugin-testing-library":"^5.9.1","husky":"^8.0.3","jest":"^29.3.1","jest-environment-jsdom":"^29.3.1","jest-transform-stub":"^2.0.0","lint-staged":"^13.1.0","prettier":"^2.8.2","react":"^18.2.0","react-dom":"^18.2.0","rollup":"^2.79.1","rollup-plugin-delete":"^2.0.0","rollup-plugin-peer-deps-external":"^2.2.4","rollup-plugin-typescript2":"^0.34.1","ts-jest":"^29.0.4","tslib":"^2.4.1","ttypescript":"^1.5.15","typescript":"^4.9.4","typescript-transform-paths":"^3.4.6","webpack":"^5.75.0","webpack-cli":"^5.0.1"},"peerDependencies":{"@emotion/react":"^11","@emotion/styled":"^11","react":">= 16.8 || 18.0.0"},"engines":{"node":">=16"},"gitHead":"df7aab624d5c25472d25f166a1f652efb8da6b0c","bugs":{"url":"https://github.com/chaos-synthesis/react-color-picker/issues"},"homepage":"https://github.com/chaos-synthesis/react-color-picker#readme","_id":"@chaos-synthesis/react-color-picker@0.5.5","_nodeVersion":"16.18.1","_npmVersion":"8.19.2","dist":{"integrity":"sha512-io8h/VF4xvT2iG4sHAN+lSSC6sEY3RflStDboIxNvEPV4oRqQW3hXj7BFCwidH1DZoPh9RN7hOupmtcF/trNxQ==","shasum":"4b2ab428a9c2e362e8b73b5665b4de6aa48759a0","tarball":"https://registry.npmjs.org/@chaos-synthesis/react-color-picker/-/react-color-picker-0.5.5.tgz","fileCount":97,"unpackedSize":237221,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCICntoEh5CkArjblwh1krB5jap4Q9nFdIdWPaduKUM+e9AiEA0zJLLNJVphi7wO/+jhgZjMpf3X9eUbRJAoZAOxFUh6w="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJkPr6iACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqC8w/+KV4LaIsw/77wtOAWMiRSOgY5yK1EaEV093FqiuMm5y48zoeM\r\ngEY5TwQnOOoEzdPTOyLaiqhxKcsx3xb6utvdxdDO/IqWPKJY/pGJL7f/Uhb9\r\nJVARjI5IK4MpthTJf7cbI//OMCr+AcXgx4Utck5vaa8TF18HgrjjOBuuBNgj\r\nmrZeBMOntOLGycGlx/bLpxTUXlTlwcx8wEotjSdbrpFeEuQ96YqvLd3jVLSG\r\nauzT2pI0vGeqRw+kNvFCnkyiMlhNZ8Tt37iSRJ/QzF3HdiSiN3AbAfnzrU7G\r\n20WSXgoOZPdlByBeJCviW8McZJNBPORW5pBKvAoewFXgKZDmC0+PveRjm3+0\r\nRywxSTYW1eH2WSA/mmElROCrYCAwYl3ir8I4+yCQUIoDLN/90yEDWo+TSf8S\r\n082OVvnCx4ShYcLkdvUrE6htROjUzGr/WUS+xPZMAeDbgWzV3l6mqOeKVMqj\r\n0aOKGTXJCGtdF8MRwLn41rwdlYp6bHW3O4zNAtti1dU6Yy0GgHgN3Qh/ZoRP\r\nScyKyx2wjSgP1zmVCCc7jS80nk/PQWAiAvcUY4sc2rXdi7xP+KfCKVQRLTMW\r\nxT/KePOJ2AAJ7IG7ntKv2K+hS3wM2IFWT22uKd/AnFQIikyYvld5u+yiAU4o\r\n0EClNSZHULJ+PHZ5DmoEF2Q3Tsufc2V9cO4=\r\n=OaZw\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"chaos-synthesis","email":"vedmakw5@gmail.com"},"directories":{},"maintainers":[{"name":"chaos-synthesis","email":"vedmakw5@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-color-picker_0.5.5_1681833633914_0.6015870362049587"},"_hasShrinkwrap":false},"0.5.6":{"name":"@chaos-synthesis/react-color-picker","version":"0.5.6","description":"An easy to use color picker for React.js","homepage":"https://chaos-synthesis.github.io/react-color-picker/","repository":{"type":"git","url":"git+https://github.com/chaos-synthesis/react-color-picker.git"},"keywords":["react","color","picker","react.js","tool","editor"],"author":{"name":"Dmitriy Prilipko"},"license":"MIT","sideEffects":false,"exports":{"import":"./dist/esm/index.js","require":"./dist/cjs/index.js"},"main":"dist/cjs/index.js","module":"dist/esm/index.js","types":"dist/esm/index.d.ts","scripts":{"build":"NODE_ENV=production rollup -c","build:storybook":"build-storybook","changeset":"changeset","lint":"eslint . --ext .ts,.tsx,.js,.jsx","prepare":"husky install","release":"changeset publish","storybook":"start-storybook -p 6006 --quiet","test":"NODE_ENV=test jest --passWithNoTests","test:coverage":"NODE_ENV=test jest --coverage","test:watch":"NODE_ENV=test jest --watch"},"lint-staged":{"*.{js,jsx,ts,tsx}":["eslint --fix","prettier --write"],"*.{md,mdx,yml,json}":["prettier --write"]},"browserslist":["> 1%","not dead","not edge <= 18","not ie 11","not op_mini all"],"dependencies":{"@babel/runtime":"^7","@types/tinycolor2":"^1.4.3","tinycolor2":"^1.6.0"},"devDependencies":{"@babel/core":"^7.20.12","@babel/plugin-transform-runtime":"^7.19.6","@babel/preset-env":"^7.20.2","@babel/preset-react":"^7.18.6","@changesets/cli":"^2.26.0","@commitlint/cli":"^17.4.1","@commitlint/config-conventional":"^17.4.0","@emotion/babel-plugin":"^11.10.5","@emotion/react":"^11.10.5","@emotion/styled":"^11.10.5","@mdx-js/react":"^1.6.22","@rollup/plugin-babel":"^6.0.3","@rollup/plugin-commonjs":"^24.0.0","@rollup/plugin-node-resolve":"^15.0.1","@rollup/plugin-terser":"^0.3.0","@storybook/addon-a11y":"^6.5.15","@storybook/addon-actions":"^6.5.15","@storybook/addon-essentials":"^6.5.15","@storybook/addon-interactions":"^6.5.15","@storybook/addon-links":"^6.5.15","@storybook/builder-webpack5":"^6.5.15","@storybook/manager-webpack5":"^6.5.15","@storybook/react":"^6.5.15","@storybook/testing-library":"^0.0.13","@testing-library/jest-dom":"^5.16.5","@testing-library/react":"^13.4.0","@testing-library/user-event":"^14.4.3","@trivago/prettier-plugin-sort-imports":"^4.0.0","@types/jest":"^29.2.5","@types/node":"^18.11.18","@types/react":"^18.0.26","@types/react-dom":"^18.0.10","@types/styled-components":"^5.1.26","@types/testing-library__jest-dom":"^5.14.5","@typescript-eslint/eslint-plugin":"^5.48.1","@typescript-eslint/parser":"^5.48.1","@zerollup/ts-transform-paths":"^1.7.18","babel-loader":"^9.1.2","eslint":"8.31.0","eslint-config-prettier":"^8.6.0","eslint-plugin-jsx-a11y":"^6.7.1","eslint-plugin-prettier":"^4.2.1","eslint-plugin-react":"^7.32.0","eslint-plugin-react-hooks":"^4.6.0","eslint-plugin-testing-library":"^5.9.1","husky":"^8.0.3","jest":"^29.3.1","jest-environment-jsdom":"^29.3.1","jest-transform-stub":"^2.0.0","lint-staged":"^13.1.0","prettier":"^2.8.2","react":"^18.2.0","react-dom":"^18.2.0","rollup":"^2.79.1","rollup-plugin-delete":"^2.0.0","rollup-plugin-peer-deps-external":"^2.2.4","rollup-plugin-typescript2":"^0.34.1","ts-jest":"^29.0.4","tslib":"^2.4.1","ttypescript":"^1.5.15","typescript":"^4.9.4","typescript-transform-paths":"^3.4.6","webpack":"^5.75.0","webpack-cli":"^5.0.1"},"peerDependencies":{"@emotion/react":"^11","@emotion/styled":"^11","react":">= 16.8 || 18.0.0"},"engines":{"node":">=16"},"gitHead":"69cd22f9fde9fbaf5e52018f940be974270ce83b","bugs":{"url":"https://github.com/chaos-synthesis/react-color-picker/issues"},"_id":"@chaos-synthesis/react-color-picker@0.5.6","_nodeVersion":"16.20.0","_npmVersion":"8.19.4","dist":{"integrity":"sha512-9gEtRgz2fukRvzJMEgCzKXyS9c1QKnkCScRSVzNIQaSdNblzi1tZ/kCN5IH721Mu5osJJC7szdZb6UFil2ZHiw==","shasum":"28eef04bf282d8f89ac666cd564abcfe1310849b","tarball":"https://registry.npmjs.org/@chaos-synthesis/react-color-picker/-/react-color-picker-0.5.6.tgz","fileCount":97,"unpackedSize":237328,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIGMwByGl+CUgO677E2iRxbesfD31dJYy4W1ElMj4ABDCAiBJ9SDuELDZMMdahfFQYK2HQnR0+IyRW6pp4HhAuEXXig=="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJkPs+KACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmp5RQ/+JCH1gYdOwxp6tmqB74Dy7EfZkPhHYF54Key8XAX5Rl9ETqZQ\r\nHJXFsSSJTVg7KxVt/pJyOcJdaAL1zvfgoTeBAdctnhkSrDXzNZWonxVRmyqf\r\nZ5WguD/T5tQ9laI2SwCcKvZAuvF6zMF4GYquDLk5J9VZk5XGNLWIxjGJqUTR\r\n3DZRvSidlJJmCsTXnIWdO4TUeq5G7GYiRL7mhh7CGHyMFhqdBUhkriyhMGgP\r\n4HI+Yn4Cx9/kbhxEso8JtGEh+fCE3KdeAgqOJEfjO/H06JW9JAezEwR7js1e\r\nDNy47Ea0lRsfPpj5jK/a68Gcec7gKOpQLgLzgxFhMAGhybnkL0OuRa8HEGqT\r\nVTocYDK656avYiRM42LZy3vdrp/NsvXeTny8vlUhQ36k/yEyfEM3uHURg+pO\r\nvY2bu7NlGdkEDjEIZqKnrGPkt42I6HEKrDn3N0pVUDtYHfM4uN68UYt6Pi0X\r\n3qiCO99JhRY5W+/wON9vUccB2caDzqTET6R5oRDyv2fGjUbVqBGxvqbsQVut\r\n5dc1/QNi8Um4xo1/zMZuIE9fK1O0bQ++mDBkxM4oqrNPsomchzpGTdnPcia/\r\nj50gKCltIMcyNWN6F4RDrREMnj1zWRFmj1u8k/1lkYvR7IdehrJdLy7/NkBV\r\nL6+XEmNwm+fx663q9XqbblyZGj4M0ptEyiU=\r\n=9+wg\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"chaos-synthesis","email":"vedmakw5@gmail.com"},"directories":{},"maintainers":[{"name":"chaos-synthesis","email":"vedmakw5@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-color-picker_0.5.6_1681837962758_0.22196005961195464"},"_hasShrinkwrap":false}},"time":{"created":"2023-04-11T17:34:25.252Z","0.5.0":"2023-04-11T17:34:25.524Z","modified":"2023-04-18T17:12:43.054Z","0.5.1":"2023-04-12T10:30:43.878Z","0.5.3":"2023-04-12T11:48:36.105Z","0.5.4":"2023-04-12T12:21:13.181Z","0.5.5":"2023-04-18T16:00:34.113Z","0.5.6":"2023-04-18T17:12:42.934Z"},"maintainers":[{"name":"chaos-synthesis","email":"vedmakw5@gmail.com"}],"description":"An easy to use color picker for React.js","homepage":"https://chaos-synthesis.github.io/react-color-picker/","keywords":["react","color","picker","react.js","tool","editor"],"repository":{"type":"git","url":"git+https://github.com/chaos-synthesis/react-color-picker.git"},"author":{"name":"Dmitriy Prilipko"},"bugs":{"url":"https://github.com/chaos-synthesis/react-color-picker/issues"},"readme":"# @chaos-synthesis/react-color-picker\n\n[![Npm Version](https://img.shields.io/npm/v/@chaos-synthesis/react-color-picker.svg?style=flat-square)](https://www.npmjs.com/package/@chaos-synthesis/react-color-picker)\n[![Downloads](https://img.shields.io/npm/dm/@chaos-synthesis/react-color-picker.svg?style=flat-square)](https://www.npmjs.com/package/@chaos-synthesis/react-color-picker)\n[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)][license-url]\n\nCustomizable, easy to use color picker for React.js.\n\n<br />\n\n## Table of contents\n\n- [Install](#install)\n- [Basic usage](#basic-usage)\n- [Customize layout](#customize-layout)\n- [Customize components](#customize-components)\n- [Misc](#misc)\n- [License](#license)\n\n## Install\n\n```\nnpm install @chaos-synthesis/react-color-picker\n```\n\n```\nyarn add @chaos-synthesis/react-color-picker\n```\n\n## Basic usage\n\n```js\nimport { ColorPicker } from '@chaos-synthesis/react-color-picker'\nimport { useState } from 'react'\n\nfunction MyApp() {\n  // color value can be any valid Tinycolor2 constructor argument\n  const [color, setColor] = useState('rgba(255,255,255,1)')\n\n  // onChange callback will receive a Tinycolor2 instance\n  return <ColorPicker value={color} onChange={(tc) => setColor(tc.toRgbString())} presets={['rgba(100,255,150,1)']} />\n}\n```\n\n## Customize layout\n\nUsing `ColorPickerProvider` to wrap your custom layout and ready to use components:\n\n```js\nimport {\n  ChannelInputs,\n  ColorBox,\n  ColorPickerProvider,\n  EyeDropper,\n  HueSlider,\n  OpacitySlider,\n  Presets,\n} from '@chaos-synthesis/react-color-picker'\nimport { useState } from 'react'\n\nconst presets = [\n  'rgba(255,0,0,1)', // Red\n  'rgba(0,255,0,1)', // Green\n  'rgba(0,0,255,1)', // Blue\n]\nconst WIDTH = 300\n\nfunction CustomColorPicker() {\n  const [color, setColor] = useState('#CC00CC9F')\n\n  return (\n    <ColorPickerProvider color={color} onChange={setColor}>\n      <div style={{ width: WIDTH, margin: '0 auto' }}>\n        <ColorBox width={WIDTH} height={WIDTH} />\n\n        <div style={{ display: 'flex' }}>\n          <EyeDropper size={24} />\n\n          <div style={{ margin: '14px 0', flexGrow: 1 }}>\n            <HueSlider style={{ marginBottom: 12 }} />\n            <OpacitySlider />\n          </div>\n        </div>\n\n        <ChannelInputs inputType=\"rgb\" />\n\n        <Presets items={presets} />\n      </div>\n    </ColorPickerProvider>\n  )\n}\n```\n\nCheck storybook for more component examples.\n\n## Customize components\n\nCreate your own components by using hooks:\n\n```js\nimport { useAlphaChannel, useHexStringColor } from '@chaos-synthesis/react-color-picker'\n\nfunction CustomOpacitySlider() {\n  const [value, setValue] = useAlphaChannel()\n  const [background] = useHexStringColor()\n\n  return (\n    <input\n      type=\"range\"\n      min=\"0\"\n      max=\"100\"\n      step=\"1\"\n      value={value}\n      onChange={(e) => setValue(+e.target.value)}\n      style={{ backgroundColor: background }}\n    />\n  )\n}\n```\n\n**Note:** You should wrap your custom components with `ColorPickerProvider` to make them work. See [Customize layout](#customize-layout) for example.\n\n## Misc\n\nStarted from [@boilertown/react-ui-boilerplate](https://github.com/boilertown/react-ui-boilerplate). Uses [tinycolor2](https://www.npmjs.com/package/tinycolor2) for color manipulation.\n\n## License\n\nCode released under the [MIT][license-url] license.\n\n[license-url]: https://github.com/chaos-synthesis/react-color-picker/blob/main/LICENSE\n","readmeFilename":"README.md","license":"MIT"}