{"_id":"iro-transparency-plugin","_rev":"3-d14d41909f372c8757de7f74ea63ce6c","name":"iro-transparency-plugin","dist-tags":{"latest":"1.0.2"},"versions":{"1.0.0":{"name":"iro-transparency-plugin","version":"1.0.0","description":"Adds comprehensive transparency support to iro.js","main":"dist/iro-transparency-plugin.js","scripts":{"start":"cross-env DEV_SERVER=true webpack-dev-server","dev":"cross-env NODE_ENV=development webpack","build":"npm run dev && cross-env NODE_ENV=production webpack","test":"echo \"Error: no test specified\" && exit 1"},"repository":{"type":"git","url":"git+https://github.com/jaames/iro-transparency-plugin.git"},"author":{"name":"James Daniel","email":"james@rakujira.jp"},"license":"MPL-2.0","bugs":{"url":"https://github.com/jaames/iro-transparency-plugin/issues"},"homepage":"https://github.com/jaames/iro-transparency-plugin#readme","devDependencies":{"@babel/core":"^7.2.2","@babel/preset-env":"^7.3.1","@jaames/iro":"^4.1.0","babel-loader":"^8.0.5","cross-env":"^5.2.0","html-webpack-plugin":"^3.2.0","webpack":"^4.29.0","webpack-cli":"^3.2.1","webpack-dev-server":"^3.1.14"},"dependencies":{"@babel/plugin-transform-react-jsx":"^7.3.0"},"gitHead":"053f60df1de5607e8a2a9c66aef559af4a0bc3f4","_id":"iro-transparency-plugin@1.0.0","_nodeVersion":"9.11.1","_npmVersion":"6.7.0","dist":{"integrity":"sha512-vvi3owjcSwdpc/15AtDGtPL5sqF787SOkGX0/p/nimieFjzSCRXq1WhMCrnVzatPOcsxrYEFczYY/iL5W+YgoA==","shasum":"5f4b3bcc0cd8a1fc724c18a4c6f9eda2532636aa","tarball":"https://registry.npmjs.org/iro-transparency-plugin/-/iro-transparency-plugin-1.0.0.tgz","fileCount":7,"unpackedSize":96243,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJcgX9NCRA9TVsSAnZWagAAx6EP/3Es7gq7/g0BjJD1U+Y0\nwHkBu1VhYqudnFt4r7DI7xVJf7AlRuOHN7P0FFy3XuaiLonpRZgt2X5SrlVw\nM5ptNTWC6fM5tJIpf1Pv+mG9wXNVOGQvSat76cDFbKzhjhVMG6T0WHHpqdDj\nLzJAe+LftD2Yq2FPZN1DDmaZjARfQj878+hf0q+cDSAQw3yOpKHCE4nM6IEI\nNQlMDKXUbFeeVBeNK1JdPWVV+E7w9OPy8SOEWiDxkn87u1qwo4KHfA865wlk\nyGem246rf2zuM9IPF+Bxl79tLSai0021hlBv1HXPI3XpPF5cMcG7rGsqUzTE\nSjW0hLCUHj6scR+aDF3CMJHD+QPzC5x0a1G4vqEEw1f0eypv4HZTbPlgYY54\nmgXCD+IC/p59liJGiChV/j84oJnajcQrWDgfyiM8fsRNLKTovSFfbizD+XjD\nKgC1cjP3Xb9pzUjit2BBWSR3CLAJkgc9xiYnnolt5cbh+KjFf/oO4el4chRf\n144pl4kJL3KW00Q2mVqeCgwQf9Db9//t92ZQlTIh+CpYkyf4+pzqwzBJcT7x\nWBYqfKu5W7DXZqNt8SfhCPinB8eibJkIMmC2mg9B4c7438xitEpsRb6uXSdD\nKlytnqTHcq1+zgkDxAl0BREE4RtJOS4hQvo8KivphOClLy8yFLGACvrF1ors\nM2OZ\r\n=lxcP\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDFtHkbrzvLEBCcUDKWZ9W9MLwW1pHWvk0+RS0PhbNNVwIhAL0PRecmiJvh9vFHWL1vzBqM0ZjJndWGIIFqSCe/I9F7"}]},"maintainers":[{"name":"jaames","email":"jamesdaniel2197@gmail.com"}],"_npmUser":{"name":"jaames","email":"jamesdaniel2197@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/iro-transparency-plugin_1.0.0_1551990604240_0.5094409803642379"},"_hasShrinkwrap":false},"1.0.1":{"name":"iro-transparency-plugin","version":"1.0.1","description":"Adds comprehensive transparency support to iro.js","main":"dist/iro-transparency-plugin.js","scripts":{"start":"cross-env DEV_SERVER=true webpack-dev-server","dev":"cross-env NODE_ENV=development webpack","build":"npm run dev && cross-env NODE_ENV=production webpack","test":"echo \"Error: no test specified\" && exit 1"},"repository":{"type":"git","url":"git+https://github.com/jaames/iro-transparency-plugin.git"},"author":{"name":"James Daniel","email":"james@rakujira.jp"},"license":"MPL-2.0","bugs":{"url":"https://github.com/jaames/iro-transparency-plugin/issues"},"homepage":"https://github.com/jaames/iro-transparency-plugin#readme","devDependencies":{"@babel/core":"^7.2.2","@babel/preset-env":"^7.3.1","@jaames/iro":"^4.1.0","babel-loader":"^8.0.5","cross-env":"^5.2.0","html-webpack-plugin":"^3.2.0","webpack":"^4.29.0","webpack-cli":"^3.2.1","webpack-dev-server":"^3.1.14"},"dependencies":{"@babel/plugin-transform-react-jsx":"^7.3.0"},"gitHead":"562018d2cb61a0417f1afb0ffceb8c966695c432","_id":"iro-transparency-plugin@1.0.1","_nodeVersion":"9.11.1","_npmVersion":"6.7.0","dist":{"integrity":"sha512-dLGoDJpWdLGksog+th0VWevvMM59nyEcPr5km6m5YtpVlGtOtT5how9A+Y/bx24I+vtaj9aYRh8vtFpB9Xgmqw==","shasum":"6b38ab7d79e17f2375af23629e6329512bcd0584","tarball":"https://registry.npmjs.org/iro-transparency-plugin/-/iro-transparency-plugin-1.0.1.tgz","fileCount":7,"unpackedSize":96293,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJcgYqgCRA9TVsSAnZWagAAxU0P+QHh1HN08X/sQP4/E4xv\nXbxnxxbJyceyWh/aT3CiWJtp3/4JF58KL+QqbpDkfuYB1OokaLDwVBx30/iI\n9Gohkxt6CCaKZF7wRn+/SF1MZZ1ha5kv7g6n01fMxhx0hJBp/mA+FSP8QWbq\nReMNVJ0I+zLOdkaSUBYUUes4yQ1CpLvpQk9Yk9iuqGkT6F789N/qvg6oCvKA\nCOe76/5cAQXwX9Qi3Dx+wTDxd5houWdKITUS1xZ1if82iTKgbpr9Xuk/kKCg\nkTDjMl2ipSkFZS1iM0UM4zaj9OfKrpE4LO2BoDjsq9W7FWAQwyBcpr7VUjZ/\n+TjYwY/oqZ5hbQYvrYEYmJaB3Uld6XdMfXpuOlPM2ZM0+PwxsBKtD0t/fVGP\nvUvn4y+L2LbM3TznMPrcC21/L8poR1q2xVaQfZ6VFKwP5n5McFOJyHNzcbJH\nhP3Dr9EaZQDJuY2cOrI+3hnrSDXxSnclPK0nPufpbQDyaiU9mSReug8dY/9c\nRbhgCXrvflDaDiZBzwNF9DASA+EcXyBp9UZvH2Dww8oSSJAxUN7wt5XiiMBS\n81odSm0hMIrQvCWPpzaoMEBbx9/AuJGmRJ+G1gr5ERY1rXnVTvsNd8uXrIkg\naqPAH6FqshxC8Uh1nWfl52g5sgb+Ug8EsQiA3DX77Y/91gHs5taPHjid13pH\n1lyk\r\n=Qtu6\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIHzkWF5ZlLGYyWAivlswCGJIjgGvXxqfV9zAZXhnZv4pAiBiS+ND0X6x5AzYDEk2TaWp9sZl92cvVUIBlt3dlvDQPg=="}]},"maintainers":[{"name":"jaames","email":"jamesdaniel2197@gmail.com"}],"_npmUser":{"name":"jaames","email":"jamesdaniel2197@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/iro-transparency-plugin_1.0.1_1551993503981_0.5081027869005639"},"_hasShrinkwrap":false},"1.0.2":{"name":"iro-transparency-plugin","version":"1.0.2","description":"Adds comprehensive transparency support to iro.js","main":"dist/iro-transparency-plugin.js","scripts":{"start":"cross-env DEV_SERVER=true webpack-dev-server","dev":"cross-env NODE_ENV=development webpack","build":"npm run dev && cross-env NODE_ENV=production webpack","test":"echo \"Error: no test specified\" && exit 1"},"repository":{"type":"git","url":"git+https://github.com/jaames/iro-transparency-plugin.git"},"author":{"name":"James Daniel","email":"james@rakujira.jp"},"license":"MPL-2.0","bugs":{"url":"https://github.com/jaames/iro-transparency-plugin/issues"},"homepage":"https://github.com/jaames/iro-transparency-plugin#readme","devDependencies":{"@babel/core":"^7.2.2","@babel/preset-env":"^7.3.1","@babel/plugin-transform-react-jsx":"^7.3.0","@jaames/iro":"^4.3.1","babel-loader":"^8.0.5","cross-env":"^5.2.0","html-webpack-plugin":"^3.2.0","webpack":"^4.29.0","webpack-cli":"^3.2.1","webpack-dev-server":"^3.1.14"},"gitHead":"0f9926a356676340fec366d2b5ae3982fbd30f1b","_id":"iro-transparency-plugin@1.0.2","_nodeVersion":"9.11.1","_npmVersion":"6.7.0","dist":{"integrity":"sha512-DBxSURdgW2fYL0K7x56y6C3Pu3eTIoXyE/oadUZEwRD5JrPyhKXlTOkJNFizdteYaZ79RyOpHk7LNaIhG1kwAw==","shasum":"e55a16e6acc641738c9ee24ada895afd247242a4","tarball":"https://registry.npmjs.org/iro-transparency-plugin/-/iro-transparency-plugin-1.0.2.tgz","fileCount":7,"unpackedSize":82032,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJcq1suCRA9TVsSAnZWagAAhIUP/iEmitG54ch0VlxE+eu5\nwUL1mnDJmp89TQini2eKbVCrscz6JiGf1IGOu7FYXHZY+wqt4nFFc38Ll7eQ\ncwMtpJJhcp0ScxwKJSdTLJ/wkndAh2LUUOQLENZQzDLN6G5ILOAyeB/JNW+j\nsR2cpQ+LYtuu2kgaSyrvC+uOxAM3aNl7LybHZeZldr5zlaJqYaVJTsli8NoA\n1D2zWGFjqJu4JmVulZpK8iUw9b1dX3Ug+m16o0UyPLQwuFdLJZfNV+tbuw5F\nMyvNbkCh7bGMrLhmuxs3oGIKfzBU8w+miJ9/BjUyQefDp+OpYdA3kq9ff92N\ndPr5SPEfg7lczei4H/N8iPQ0vq/Zmg0YnwGnTtLFzQ7osvMBFpbJOApagbf9\nFcBm0gkGz4Z/ozmC6m69dl9xuLu2J/59g+AU0R0cfJ80DviJmxTo1Bjwi08l\nHQMF/wEjMCN6CJKoDsh1E7aNKV8s65EDaVwQnJsCJYrnT9ndpzT+OO81AsEf\naGET0Sh4R0luYueffXrKJtKFqJvvWl95BTxpsI16Q7LZo1I5yQ8gKpfbw4qy\n5x/2lZde4V6h6AOX2ZR5nGPxmHU638KMhGVGNY8jhsubAYT3brvDEBZVB9hd\n7CkB2jvbzUjGKUFe7LfR3poGDnKMvjYeGus6+OwbdVBXbxW3sqa6ZBYpr4yq\nL3ZA\r\n=0P5t\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIHXnL296cm9R3nla7e1aklchNPnOxzNb2Jn0oEJqaGAkAiEA5GtCWBrqayLRXeFhoakjeuAeH3hKcVoT4bm72RUxXA0="}]},"maintainers":[{"name":"jaames","email":"jamesdaniel2197@gmail.com"}],"_npmUser":{"name":"jaames","email":"jamesdaniel2197@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/iro-transparency-plugin_1.0.2_1554733869676_0.5561168823229266"},"_hasShrinkwrap":false}},"time":{"created":"2019-03-07T20:30:04.238Z","1.0.0":"2019-03-07T20:30:04.448Z","modified":"2022-05-06T04:14:40.075Z","1.0.1":"2019-03-07T21:18:24.087Z","1.0.2":"2019-04-08T14:31:09.910Z"},"maintainers":[{"name":"jaames","email":"jamesdaniel2197@gmail.com"}],"description":"Adds comprehensive transparency support to iro.js","homepage":"https://github.com/jaames/iro-transparency-plugin#readme","repository":{"type":"git","url":"git+https://github.com/jaames/iro-transparency-plugin.git"},"author":{"name":"James Daniel","email":"james@rakujira.jp"},"bugs":{"url":"https://github.com/jaames/iro-transparency-plugin/issues"},"license":"MPL-2.0","readme":"<h1 align=\"center\"><img height=\"330\" src=\"https://raw.githubusercontent.com/jaames/iro-transparency-plugin/master/assets/screenshot.png\"/><br/>iro-transparency-plugin</h1>\n\n<p align=\"center\">\n  <b>Adds comprehensive transparency support to <a href=\"https://github.com/jaames/iro.js\">iro.js</a></b>\n</p>\n\n<p align=\"center\">\n  <a href=\"https://github.com/jaames/iro-transparency-plugin/blob/master/LICENSE.txt\">\n    <img src=\"https://badgen.net/github/license/jaames/iro-transparency-plugin\" alt=\"license\" />\n  </a>\n  <a href=\"https://npmjs.org/package/iro-transparency-plugin\">\n    <img src=\"https://badgen.net/npm/v/iro-transparency-plugin?color\" alt=\"version\" />\n  </a>\n  <a href=\"https://npmjs.org/package/iro-transparency-plugin\">\n    <img src=\"https://badgen.net/npm/dt/iro-transparency-plugin?color\" alt=\"downloads\" />\n  </a>\n  <a href=\"https://bundlephobia.com/result?p=iro-transparency-plugin\">\n    <img src=\"https://badgen.net/bundlephobia/minzip/iro-transparency-plugin?color\" alt=\"minzip size\" />\n  </a>\n  <a href=\"https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=XS9R3QTLZYAXQ&source=url\">\n    <img src=\"https://badgen.net/badge/donate/paypal/ED5151\" alt=\"donate\" />\n  </a>\n</p>\n\n<p align=\"center\">\n  <a href=\"#features\">Features</a> | <a href=\"#installation\">Installation</a> | <a href=\"#usage\">Usage</a> | <a href=\"#color-api-extras\">Color API Extras</a>\n</p>\n\n<br/>\n\n## Features\n\n* Color picker transparency slider\n* Extends iro.js color API to add support for hsva, hsla, rgba, hex8 and hex4 colors\n* 7kb minified, or less than 2kB minified + gzipped\n\n<br/>\n\n## Installation\n\n### Install with NPM\n\n```bash\n$ npm install iro-transparency-plugin --save\n```\n\nIf you are using a module bundler like Webpack or Rollup, import iro-transparency-plugin into your project **after iro.js**: \n\n**Using ES6 modules**:\n\n```js\nimport iro from '@jaames/iro';\nimport iroTransparencyPlugin from 'iro-transparency-plugin';\n```\n\n**Using CommonJS modules**:\n\n```js\nconst iro = require('@jaames/iro');\nconst iroTransparencyPlugin = require('iro-transparency-plugin');\n```\n\n### Download and host yourself\n\n**[Development version](https://raw.githubusercontent.com/jaames/iro-transparency-plugin/master/dist/iro-transparency-plugin.js)**<br/>\nUncompressed at around 20kB, with source comments included\n\n**[Production version](https://raw.githubusercontent.com/jaames/iro-transparency-plugin/master/dist/iro-transparency-plugin.min.js)**<br/>\nMinified to 8kB\n\nThen add it to the `<head>` of your page with a `<script>` tag **after iro.js**:\n\n```html\n<html>\n  <head>\n    <!-- ... -->\n    <script src=\"./path/to/iro.min.js\"></script>\n    <script src=\"./path/to/iro-transparency-plugin.min.js\"></script>\n  </head>\n  <!-- ... -->\n</html>\n```\n\n### Using the jsDelivr CDN\n\n```html\n<script src=\"https://cdn.jsdelivr.net/npm/iro-transparency-plugin/dist/iro-transparency-plugin.min.js\"></script>\n```\n\n<br/>\n\n## Usage\n\n### Register Plugin\n\nAfter both [**iro.js**](https://github.com/jaames/iro.js) and **iro-transparency-plugin** have been imported/downloaded, the plugin needs to be registered with `iro.use`:\n\n```js\niro.use(iroTransparencyPlugin);\n```\n\n### ColorPicker Setup\n\nThe plugin adds a new `transparency` config option to `iro.ColorPicker`. If set to `true`, a transparency slider will be added to the color picker. \n\n```js\nvar colorPicker = new iro.ColorPicker({\n  width: 320,\n  color: {r: 255, g: 100, b: 100, a: 1},\n  transparency: true\n})\n```\n\n### Color API Extras\n\nThere are also additional [color properties](https://github.com/jaames/iro.js#color-properties) for getting / setting the selected color from various color-with-alpha formats. Note that the alpha value should always be between 0 and 1 here.\n\nAll of these formats are also supported by the `set` method and the color picker's `color` option.\n\n| Property     | Example Format     |\n|:-------------|:-------------------|\n| `alpha`      | `0.5` |\n| `hex8String` | `\"#ff0000ff\"` |\n| `rgba`       | `{ r: 255, g: 0, b: 0, a: 0.5 }` |\n| `rgbaString` | `\"rgba(255, 0, 0, 0.5)\"` |\n| `hsla`       | `{ h: 360, s: 100, l: 50, a: 0.5 }` |\n| `hslaString` | `\"hsla(360, 100%, 50%, 0.5)\"` |\n| `hsva`       | `{ h: 360, s: 100, v: 100, a: 0.5 }` |\n\n© [James Daniel](https://github.com/jaames)","readmeFilename":"readme.md"}