{"_id":"@eldrago891/vue3-colorpicker","_rev":"1-3e82168715e8a715b1f827c86079fb7d","name":"@eldrago891/vue3-colorpicker","dist-tags":{"latest":"1.0.1"},"versions":{"1.0.0":{"name":"@eldrago891/vue3-colorpicker","version":"1.0.0","main":"dist/index.es.js","types":"dist/types/index.d.ts","author":{"name":"aesoper"},"license":"MIT","scripts":{"dev":"vite","build":"rimraf dist && vue-tsc --noEmit && vite build","build:lib":"rimraf dist && vite build --config ./vite.config.lib.ts","serve":"vite preview","lint:lint-staged":"lint-staged -c ./.husky/lintstagedrc.js","lint:pretty":"pretty-quick --staged","prepare":"husky install","clean:dist":"rimraf dist","pub":"cd dist && npm publish --registry=https://registry.npmjs.org --access public && cd ..","unpub":"npm unpublish @eldrago891/vue3-colorpicker --force --registry=https://registry.npmjs.org","prelink":"cd dist && yarn link && cd .. && yarn link vue3-colorpicker","deploy":"gh-pages -d storybook-static","storybook":"storybook dev","build-storybook":"rimraf storybook-static && storybook build","reinstall":"rimraf node_modules && yarn install"},"dependencies":{"@aesoper/normal-utils":"^0.1.5","@popperjs/core":"^2.11.8","@vueuse/core":"^10.1.2","gradient-parser":"^1.0.2","lodash-es":"^4.17.21","tinycolor2":"^1.4.2","vue":"^3.3.4","vue-types":"^4.1.0"},"devDependencies":{"@babel/core":"^7.16.0","@commitlint/cli":"^14.1.0","@commitlint/config-conventional":"^14.1.0","@storybook/addon-actions":"^7.0.18","@storybook/addon-docs":"^7.0.18","@storybook/addon-essentials":"^7.0.18","@storybook/addon-links":"^7.0.18","@storybook/addon-storysource":"^7.0.18","@storybook/cli":"^7.0.27","@storybook/vue3":"^7.0.27","@storybook/vue3-vite":"^7.0.18","@types/gradient-parser":"^0.1.2","@types/jest":"^27.0.1","@types/lodash-es":"^4.17.4","@types/node":"^16.7.13","@types/tinycolor2":"^1.4.3","@typescript-eslint/eslint-plugin":"^4.22.0","@typescript-eslint/parser":"^4.22.0","@vitejs/plugin-vue":"^1.6.1","@vitejs/plugin-vue-jsx":"^1.1.8","@vue/compiler-sfc":"^3.2.6","@vue/eslint-config-prettier":"^6.0.0","@vue/eslint-config-typescript":"^7.0.0","babel-loader":"^8.2.3","conventional-changelog-cli":"^2.1.1","eslint":"^7.16.0","eslint-plugin-jest":"^24.3.6","eslint-plugin-prettier":"^3.4.0","eslint-plugin-storybook":"^0.6.12","eslint-plugin-vue":"^7.9.0","gh-pages":"^3.2.3","husky":"^6.0.0","jest":"^27.1.1","lint-staged":"^11.0.0","postcss":"^8.3.11","postcss-flexbugs-fixes":"^5.0.2","prettier":"^2.2.1","pretty-quick":"^3.1.1","react":"^18.2.0","react-dom":"^18.2.0","rimraf":"^3.0.2","sass":"^1.39.0","storybook":"^7.0.18","stylelint":"^13.13.1","stylelint-config-prettier":"^8.0.2","stylelint-config-standard":"^22.0.0","stylelint-no-unsupported-browser-features":"^5.0.1","stylelint-order":"^4.1.0","typescript":"^4.3.2","vite":"^4.0.4","vite-plugin-dts":"^0.9.3","vue-loader":"^16.8.3","vue-tsc":"^0.2.2"},"_id":"@eldrago891/vue3-colorpicker@1.0.0","gitHead":"4712bca6d298013e12a2fb28e091547135ff0222","description":"A very beautiful color picker, supports input and output of multiple color formats, and supports gradient color selection.","_nodeVersion":"21.6.0","_npmVersion":"10.2.4","dist":{"integrity":"sha512-1yGaAvnv8D+46YTv8/mf8WBA4eFWOPiaqRET04KtbogVrzyVych+yHyCgitm5OlXfgUfdICAmpcJZGzw6yumZg==","shasum":"38f33453c187177f769fd1d31cf8648ab5e6c027","tarball":"https://registry.npmjs.org/@eldrago891/vue3-colorpicker/-/vue3-colorpicker-1.0.0.tgz","fileCount":31,"unpackedSize":184080,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCsHxDsRnIYYMWYa3Qa4u+IkwuRIWtcpwpE6dlAHfkfEwIgOWyVt6WZPHuE48z04sNsKvRw/Jdo5xKWPis5b0+zebc="}]},"_npmUser":{"name":"elder891","email":"rohit@comet.rocks"},"directories":{},"maintainers":[{"name":"elder891","email":"rohit@comet.rocks"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue3-colorpicker_1.0.0_1706772097138_0.040614735716642425"},"_hasShrinkwrap":false},"1.0.1":{"name":"@eldrago891/vue3-colorpicker","version":"1.0.1","main":"dist/index.es.js","types":"dist/types/index.d.ts","author":{"name":"aesoper"},"license":"MIT","scripts":{"dev":"vite","build":"rimraf dist && vue-tsc --noEmit && vite build","build:lib":"rimraf dist && vite build --config ./vite.config.lib.ts","serve":"vite preview","lint:lint-staged":"lint-staged -c ./.husky/lintstagedrc.js","lint:pretty":"pretty-quick --staged","prepare":"husky install","clean:dist":"rimraf dist","pub":"cd dist && npm publish --registry=https://registry.npmjs.org --access public && cd ..","unpub":"npm unpublish @eldrago891/vue3-colorpicker --force --registry=https://registry.npmjs.org","prelink":"cd dist && yarn link && cd .. && yarn link vue3-colorpicker","deploy":"gh-pages -d storybook-static","storybook":"storybook dev","build-storybook":"rimraf storybook-static && storybook build","reinstall":"rimraf node_modules && yarn install"},"dependencies":{"@aesoper/normal-utils":"^0.1.5","@popperjs/core":"^2.11.8","@vueuse/core":"^10.1.2","gradient-parser":"^1.0.2","lodash-es":"^4.17.21","tinycolor2":"^1.4.2","vue":"^3.3.4","vue-types":"^4.1.0"},"devDependencies":{"@babel/core":"^7.16.0","@commitlint/cli":"^14.1.0","@commitlint/config-conventional":"^14.1.0","@storybook/addon-actions":"^7.0.18","@storybook/addon-docs":"^7.0.18","@storybook/addon-essentials":"^7.0.18","@storybook/addon-links":"^7.0.18","@storybook/addon-storysource":"^7.0.18","@storybook/cli":"^7.0.27","@storybook/vue3":"^7.0.27","@storybook/vue3-vite":"^7.0.18","@types/gradient-parser":"^0.1.2","@types/jest":"^27.0.1","@types/lodash-es":"^4.17.4","@types/node":"^16.7.13","@types/tinycolor2":"^1.4.3","@typescript-eslint/eslint-plugin":"^4.22.0","@typescript-eslint/parser":"^4.22.0","@vitejs/plugin-vue":"^1.6.1","@vitejs/plugin-vue-jsx":"^1.1.8","@vue/compiler-sfc":"^3.2.6","@vue/eslint-config-prettier":"^6.0.0","@vue/eslint-config-typescript":"^7.0.0","babel-loader":"^8.2.3","conventional-changelog-cli":"^2.1.1","eslint":"^7.16.0","eslint-plugin-jest":"^24.3.6","eslint-plugin-prettier":"^3.4.0","eslint-plugin-storybook":"^0.6.12","eslint-plugin-vue":"^7.9.0","gh-pages":"^3.2.3","husky":"^6.0.0","jest":"^27.1.1","lint-staged":"^11.0.0","postcss":"^8.3.11","postcss-flexbugs-fixes":"^5.0.2","prettier":"^2.2.1","pretty-quick":"^3.1.1","react":"^18.2.0","react-dom":"^18.2.0","rimraf":"^3.0.2","sass":"^1.39.0","storybook":"^7.0.18","stylelint":"^13.13.1","stylelint-config-prettier":"^8.0.2","stylelint-config-standard":"^22.0.0","stylelint-no-unsupported-browser-features":"^5.0.1","stylelint-order":"^4.1.0","typescript":"^4.3.2","vite":"^4.0.4","vite-plugin-dts":"^0.9.3","vue-loader":"^16.8.3","vue-tsc":"^0.2.2"},"_id":"@eldrago891/vue3-colorpicker@1.0.1","gitHead":"64940d9eb5f6124db5bc6fcc1529afc3b130c199","description":"A very beautiful color picker, supports input and output of multiple color formats, and supports gradient color selection.","_nodeVersion":"21.6.0","_npmVersion":"10.2.4","dist":{"integrity":"sha512-+W4En1dH15e+BXSyw4Y8wJXqcoRvUOPplBZsrnituvV1G8nxNGJFEu89oeWkEGZpdrvv9W/0ljwuvsAaIYktzA==","shasum":"c4dbca52c095781c94195337bcc0c21025a6232b","tarball":"https://registry.npmjs.org/@eldrago891/vue3-colorpicker/-/vue3-colorpicker-1.0.1.tgz","fileCount":31,"unpackedSize":184083,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCti4XEOGsv3sY2b5rVyK5/WhzhSKkAjtIOZyGXpM8vAgIgSl+zOlHJhNjxZ0OkXF7AUPmKOTN+ti3Au1q8CfuBBWk="}]},"_npmUser":{"name":"elder891","email":"rohit@comet.rocks"},"directories":{},"maintainers":[{"name":"elder891","email":"rohit@comet.rocks"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue3-colorpicker_1.0.1_1706773386285_0.31365813188000624"},"_hasShrinkwrap":false}},"time":{"created":"2024-02-01T07:21:37.075Z","1.0.0":"2024-02-01T07:21:37.368Z","modified":"2024-02-01T07:43:06.662Z","1.0.1":"2024-02-01T07:43:06.467Z"},"maintainers":[{"name":"elder891","email":"rohit@comet.rocks"}],"description":"A very beautiful color picker, supports input and output of multiple color formats, and supports gradient color selection.","author":{"name":"aesoper"},"license":"MIT","readme":"# colorpicker\n\nA very beautiful color picker, supports input and output of multiple color formats, and supports gradient color selection.\n\nNote: This document is for Vue3ColorPicker v2. If you are looking for an older versions, refer to the v1 branches.The v2 version is a destructive update, and some functions in v1 are no longer supported. Please use it with caution\n\n[Live Demo](https://aesoper101.github.io/vue3-colorpicker/)\n\n[中文文档](https://github.com/aesoper101/vue3-colorpicker/blob/main/README.ZH-cn.md)\n\n![Vue3-colorpicker](https://raw.githubusercontent.com/aesoper101/vue3-colorpicker/main/src/assets/example.jpg?raw=true)\n\n## Installation\n\n```\nyarn add vue3-colorpicker\n```\n\nOR\n\n```\nnpm install vue3-colorpicker\n```\n\n## How to use\n\n### The first step is global registration\n\n```\nimport Vue3ColorPicker from \"vue3-colorpicker\";\nimport \"vue3-colorpicker/style.css\";\n\ncreateApp(App)\n  .use(router)\n  .use(Vue3ColorPicker)\n  .mount(\"#app\");\n```\n\nOR\n\n```vue3\nimport { ColorPicker } from \"vue3-colorpicker\";\nimport \"vue3-colorpicker/style.css\";\n\nexport default defineComponent({\ncomponents: { ColorPicker },\n});\n```\n\n### Usage\n\n```vue3\n<template>\n  <div>\n     <color-picker v-model:pureColor=\"pureColor\" v-model:gradientColor=\"gradientColor\"/>\n  </div>\n</template>\n<script lang=\"ts\">\n  import { ref } from \"vue\";\n  import { ColorInputWithoutInstance } from \"tinycolor2\";\n\n  export default defineComponent({\n     setup() {\n       const pureColor = ref<ColorInputWithoutInstance>(\"red\");\n       const gradientColor = ref(\"linear-gradient(0deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 100%)\");\n\n       return { pureColor, gradientColor }\n     }\n  });\n</script>\n\n```\n\n[Live Demo](https://aesoper101.github.io/vue3-colorpicker/)\n","readmeFilename":"README.md"}