{"_id":"@cicciosgamino/color-scheme-button","_rev":"6-46a1b460abc9e642b9ab9ad925e13dac","name":"@cicciosgamino/color-scheme-button","dist-tags":{"latest":"2.0.0"},"versions":{"1.0.0":{"name":"@cicciosgamino/color-scheme-button","version":"1.0.0","description":"Simple button to handle the color-scheme auto / light / dark / dim","main":"color-scheme-button.js","type":"module","module":"color-scheme-button.js","scripts":{"dev":"web-dev-server --node-resolve --app-index examples/index.html --watch --open","test":"echo \"Error: no test specified\" && exit 1"},"repository":{"type":"git","url":"git+https://github.com/CICCIOSGAMINO/color-scheme-button.git"},"keywords":["Color Scheme","Light","Dark","Auto","Dimmer","CustomElement","Lit"],"author":{"name":"@cicciosgamino"},"license":"GPL-3.0","private":false,"bugs":{"url":"https://github.com/CICCIOSGAMINO/color-scheme-button/issues"},"homepage":"https://github.com/CICCIOSGAMINO/color-scheme-button#readme","dependencies":{"lit":"*"},"devDependencies":{"@web/dev-server":"^0.1.24"},"directories":{"example":"examples"},"gitHead":"b29b450cbe20e46cb690db5572a5287ded4d7c65","_id":"@cicciosgamino/color-scheme-button@1.0.0","_nodeVersion":"16.4.0","_npmVersion":"7.19.0","dist":{"integrity":"sha512-MW5hgtThcWTR9xLLidU1gf2a3a3xSNgNHVe05sNdjsGJBpvfSVKEwRLzmpLEViUbDljAyodlXSBlXBe7b0ySbQ==","shasum":"350ae7eaf7e41f5c94c74b4a5b5860ea41ef6b81","tarball":"https://registry.npmjs.org/@cicciosgamino/color-scheme-button/-/color-scheme-button-1.0.0.tgz","fileCount":6,"unpackedSize":50015,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIBOnYq9iGR50H/PcyeQewPEj1baEt9qeJk1QkWbosMg/AiEAyifT9m8MDZZWBoesBhTkNwhvWTfIpjkhsI7F1wlhbM8="}]},"_npmUser":{"name":"cicciosgamino","email":"marco.canali@gmail.com"},"maintainers":[{"name":"cicciosgamino","email":"marco.canali@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/color-scheme-button_1.0.0_1633357683450_0.9453270158720453"},"_hasShrinkwrap":false},"1.0.1":{"name":"@cicciosgamino/color-scheme-button","version":"1.0.1","description":"Simple button to handle the color-scheme auto / light / dark / dim","main":"color-scheme-button.js","type":"module","module":"color-scheme-button.js","scripts":{"dev":"web-dev-server --node-resolve --app-index examples/index.html --watch --open","test":"echo \"Error: no test specified\" && exit 1"},"repository":{"type":"git","url":"git+https://github.com/CICCIOSGAMINO/color-scheme-button.git"},"keywords":["Color Scheme","Light","Dark","Auto","Dimmer","CustomElement","Lit"],"author":{"name":"@cicciosgamino"},"license":"GPL-3.0","private":false,"bugs":{"url":"https://github.com/CICCIOSGAMINO/color-scheme-button/issues"},"homepage":"https://github.com/CICCIOSGAMINO/color-scheme-button#readme","dependencies":{"lit":"*"},"devDependencies":{"@web/dev-server":"^0.1.24"},"directories":{"example":"examples"},"gitHead":"fa400fe30d460c1202683822340fbde8063881dd","_id":"@cicciosgamino/color-scheme-button@1.0.1","_nodeVersion":"16.4.0","_npmVersion":"7.19.0","dist":{"integrity":"sha512-H6lbN7fNdDr5B1eIP8+7jOqXCswpqyCU25JeNg0iCDF07v9YQ+9JAPEK46VgumcOhma+Q+fNnz9LPtO+72b2hg==","shasum":"6f556878669369289963773b0c0ef8659a2f8308","tarball":"https://registry.npmjs.org/@cicciosgamino/color-scheme-button/-/color-scheme-button-1.0.1.tgz","fileCount":6,"unpackedSize":50103,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCID1W+69cBYnzt2QgiKgJj7iB0EHjskLF5fLEiF/eKjJyAiB9O0Xsh02LMW21tHvnJClTuQaI8sbO5h3fm/Ld+jFDOg=="}]},"_npmUser":{"name":"cicciosgamino","email":"marco.canali@gmail.com"},"maintainers":[{"name":"cicciosgamino","email":"marco.canali@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/color-scheme-button_1.0.1_1633358323994_0.7715425676853449"},"_hasShrinkwrap":false},"1.0.2":{"name":"@cicciosgamino/color-scheme-button","version":"1.0.2","description":"Simple button to handle the color-scheme auto / light / dark / dim","main":"color-scheme-button.js","type":"module","module":"color-scheme-button.js","scripts":{"dev":"web-dev-server --node-resolve --app-index examples/index.html --watch --open","test":"echo \"Error: no test specified\" && exit 1"},"repository":{"type":"git","url":"git+https://github.com/CICCIOSGAMINO/color-scheme-button.git"},"keywords":["Color Scheme","Light","Dark","Auto","Dimmer","CustomElement","Lit"],"author":{"name":"@cicciosgamino"},"license":"GPL-3.0","private":false,"bugs":{"url":"https://github.com/CICCIOSGAMINO/color-scheme-button/issues"},"homepage":"https://github.com/CICCIOSGAMINO/color-scheme-button#readme","dependencies":{"lit":"*"},"devDependencies":{"@web/dev-server":"^0.1.24"},"directories":{"example":"examples"},"gitHead":"7ba1fa1a99838439a960163b9445ecf422903964","_id":"@cicciosgamino/color-scheme-button@1.0.2","_nodeVersion":"16.4.0","_npmVersion":"7.19.0","dist":{"integrity":"sha512-o98XAWYKf8PS8IicqzfVtp89sSF4M/08AveF9aYKbXtlS13iEO0IDdZJUOBPcrHH5bqxp74jd9AATqWjP0XZYw==","shasum":"db78672876e5234c4e7e3c1a776e38b92e9ffe40","tarball":"https://registry.npmjs.org/@cicciosgamino/color-scheme-button/-/color-scheme-button-1.0.2.tgz","fileCount":6,"unpackedSize":50559,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCxSbpXpweHPfhFTnhrwwjLhROI6/7iAYXgcmSGQB0o7AIgFrOpdSHMNdmr5IHZkhBt/XkB5zweKWRKDZvdAPMy+TI="}]},"_npmUser":{"name":"cicciosgamino","email":"marco.canali@gmail.com"},"maintainers":[{"name":"cicciosgamino","email":"marco.canali@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/color-scheme-button_1.0.2_1633360102737_0.756589296771029"},"_hasShrinkwrap":false},"1.1.0":{"name":"@cicciosgamino/color-scheme-button","version":"1.1.0","description":"Simple button to handle the color-scheme auto / light / dark / dim","main":"color-scheme-button.js","type":"module","module":"color-scheme-button.js","scripts":{"dev":"web-dev-server --node-resolve --app-index examples/index.html --watch --open","test":"echo \"Error: no test specified\" && exit 1"},"repository":{"type":"git","url":"git+https://github.com/CICCIOSGAMINO/color-scheme-button.git"},"keywords":["Color Scheme","Light","Dark","Auto","Dimmer","CustomElement","Lit"],"author":{"name":"@cicciosgamino"},"license":"GPL-3.0","private":false,"bugs":{"url":"https://github.com/CICCIOSGAMINO/color-scheme-button/issues"},"homepage":"https://github.com/CICCIOSGAMINO/color-scheme-button#readme","dependencies":{"lit":"*"},"devDependencies":{"@web/dev-server":"^0.1.24"},"directories":{"example":"examples"},"gitHead":"be52560a654a10b45e3cd5b03fd0e42e4109b958","_id":"@cicciosgamino/color-scheme-button@1.1.0","_nodeVersion":"16.4.0","_npmVersion":"7.19.0","dist":{"integrity":"sha512-E4qJJTSiuNgle8VTXIyo4XFiqPvQoVlvAY+Zm84DpjfXw6JlOP8udWeUbX4vNYdzBufIx5CiiVYiQBXtDtzpVw==","shasum":"99ecfcff358d65113c413aaa5a5651685be0ca33","tarball":"https://registry.npmjs.org/@cicciosgamino/color-scheme-button/-/color-scheme-button-1.1.0.tgz","fileCount":6,"unpackedSize":50680,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDnOLv5fy0vsHRNcZB/eM3B79dx3jTRp4B3wstSBE1ERQIhAOUhLe1v/NpOaEnYoh8Lu9/m7C27offClyROVKk8H0Ee"}]},"_npmUser":{"name":"cicciosgamino","email":"marco.canali@gmail.com"},"maintainers":[{"name":"cicciosgamino","email":"marco.canali@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/color-scheme-button_1.1.0_1633507804524_0.2043065279859182"},"_hasShrinkwrap":false},"2.0.0":{"name":"@cicciosgamino/color-scheme-button","version":"2.0.0","description":"Simple button to handle the color-scheme auto / light / dark / dim","main":"color-scheme-button.js","type":"module","module":"color-scheme-button.js","scripts":{"dev":"web-dev-server --node-resolve --app-index examples/index.html --watch --open","test":"echo \"Error: no test specified\" && exit 1"},"repository":{"type":"git","url":"git+https://github.com/CICCIOSGAMINO/color-scheme-button.git"},"keywords":["Color Scheme","Light","Dark","Dimmer","CustomElement","Lit"],"author":{"name":"@cicciosgamino"},"license":"GPL-3.0","private":false,"bugs":{"url":"https://github.com/CICCIOSGAMINO/color-scheme-button/issues"},"homepage":"https://github.com/CICCIOSGAMINO/color-scheme-button#readme","dependencies":{"lit":"*"},"devDependencies":{"@web/dev-server":"^0.1.25"},"directories":{"example":"examples"},"gitHead":"9253444c278fd77d18768afc26d1ec72c0bdf466","_id":"@cicciosgamino/color-scheme-button@2.0.0","_nodeVersion":"17.0.1","_npmVersion":"8.1.0","dist":{"integrity":"sha512-em7mGYHSC4aG8TvvfY4u8ToZrzwDm5eOu2zfQgTvLPyOpRJOJ9JFPJS3ARMW/4pWCEoFScvNvnJxCuogNuWmNQ==","shasum":"aba80273c64b758448d66648387ec6336541289c","tarball":"https://registry.npmjs.org/@cicciosgamino/color-scheme-button/-/color-scheme-button-2.0.0.tgz","fileCount":6,"unpackedSize":51621,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh2Cu8CRA9TVsSAnZWagAAtcwP/1q7YxKABTTgqQHNmHYM\nUXXuuhGKskpR5mnqEdIr+nswm7GiBTWbje1wo4ovQyDeTRfc5edSEApPgE6e\ndpgPnQoERSTCQbYGf9AyOlB9IKA5XIJ8AE6v3FGqd2TMvgJ12YGISpwvmW7C\njpYuTYlkctrwQfW8UY+XwQc/fWPQUHBf/MgxSzo4HkNQu0UDLMV6JhlCxIK4\nd/D4fHsIftbGdGUmIgDlog9WCkeN+HdU9nosYAxh/1AGyyfsKsqv7ec+dkQB\nTk65xaszZ8Yf39hGZHsfdzSLhwZBYFBXRbRk2aw21pgwwixF3LfSOg7KCUQq\nYT66QbHa5HlIMnv78BiPsNpEDrCNZWt2SG2bSgCBsb5NpQFiIWlT4n0LTqCS\n/3RpJ++k9v88vvsOIDTa78U3KbF824Sb/AFJhJuOx5Pnth23x+MPtolXzCgV\n07MMFjawrqLun4dvXC+REaFt2C491SrH4iR3pk0zkVQ22ua0+dVwVFvImUEa\n97FX+8qIzLiOqMKZTuGkb4a/2VdBNsW3kC6wNmJtRvkp3tSDit92Q0GoTrxO\ncoQTijlAMED8/s+ib7s4XJf6OkDxBaoVmFAnBF2L11aO/VLRaUHqOpuI69B2\nLidfYMqFCYn0PbBpRwqjULGbNXTL1u6cu+F5P95LAAJt9M/D5YBZfEQlywJw\nOdsY\r\n=V2Dd\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQC/99PL9o6FhdS3r3mgerEXX2IuwVqOHj0c9HJB61TvxAIhAKzvO6qqvp8awSLP7vz+t2cAyjRRALwiWahvaIorUO89"}]},"_npmUser":{"name":"cicciosgamino","email":"marco.canali@gmail.com"},"maintainers":[{"name":"cicciosgamino","email":"marco.canali@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/color-scheme-button_2.0.0_1635350104723_0.4739742611450617"},"_hasShrinkwrap":false}},"time":{"created":"2021-10-04T14:28:03.397Z","1.0.0":"2021-10-04T14:28:03.636Z","modified":"2022-04-04T22:58:23.729Z","1.0.1":"2021-10-04T14:38:44.106Z","1.0.2":"2021-10-04T15:08:22.945Z","1.1.0":"2021-10-06T08:10:04.667Z","2.0.0":"2021-10-27T15:55:04.914Z"},"maintainers":[{"name":"cicciosgamino","email":"marco.canali@gmail.com"}],"description":"Simple button to handle the color-scheme auto / light / dark / dim","homepage":"https://github.com/CICCIOSGAMINO/color-scheme-button#readme","keywords":["Color Scheme","Light","Dark","Dimmer","CustomElement","Lit"],"repository":{"type":"git","url":"git+https://github.com/CICCIOSGAMINO/color-scheme-button.git"},"author":{"name":"@cicciosgamino"},"bugs":{"url":"https://github.com/CICCIOSGAMINO/color-scheme-button/issues"},"license":"GPL-3.0","readme":"![GitHub issues](https://img.shields.io/github/issues/CICCIOSGAMINO/color-scheme-button)\n[![npm version](https://badgen.net/npm/v/@cicciosgamino/progress-ring)](https://www.npmjs.com/package/@cicciosgamino/color-scheme-button)\n[![Published on webcomponents.org](https://img.shields.io/badge/webcomponents.org-published-blue.svg)](https://www.webcomponents.org/element/cicciosgamino/color-scheme-button)\n\n# ☀️ \\\n\nSimple button to handle the color-scheme auto / light / dark / dim . This custom elment it's a button with 4 SVG icons each for schema (auto, light, dark, dim). Dim schema it about orchestrating lightness and saturation, need to have enough saturation to still have a hue visible, but also just barely pass contrast scores. Check the very well done Adam Argyle intro about the shema / theme.\n\nLittle animation when button:hover and button:focus\n\nhttps://web.dev/building-a-color-scheme/\n \n

\n examples •\n usage •\n api •\n accessibility •\n todo •\n

\n\n# 🕹️ Examples\n\n![Color Scheme Button](https://raw.githubusercontent.com/CICCIOSGAMINO/web.cicciosgamino.github.io/master/public/images/exampleSchemaButton.gif)\n\n```html\n\n\n\n\n```\n\n\n# 🚀 Usage\n\n1. Install package\n```bash\nnpm install --save @cicciosgamino/color-scheme-button\n```\n\n2. Import\n```html\n\n\n```\n\n3. Place in your HTML\n```html\n\n\n```\n\n# 🐝 API\n\n## 📒 Properties/Attributes\n\n| Name | Type | Default | Description\n| ----------- | ------- | -------- | --------------\n| title | String | `''` | Button title\n| ariaLabel | String | `''` | Button aria-label\n\n## Methods\n*None*\n\n## Events\n*None* events dispatched by default but you can uncomment the code to dispatch the *schema-event*. This event is dispateched with both, bubble and composed. In the *detail.schema* field you can retrieve the value of the schema.\n\n| Event Name | Target | Detail | Description\n| ------------ | -------------- | ------------ | --------------\n| schema-event | color-schema-button | `{ schema: 'auto | light | dark | dim' }` | Fired when button clicked\n\n## 🧁 CSS Custom Properties\n\n| Name | Default | Description\n| --------------- | ------- | --------------------\n| `--icon-color` | `#000` | SVG fill attribute\n\n## 💪 Accessibility\nAcessibility is guaranted with the use of a button with the *title* and *aria-label* set on it.SVG icons inside the inner button are set *role=img*,*aria-hidden=\"true\"*,*focusable=\"false\"* .\n\n## 🔧 TODO\n- [ ] Better Documentation\n- [ ] More Examples\n\n## 🧑‍💻 Author\n| [![@cicciosgamino](https://raw.githubusercontent.com/CICCIOSGAMINO/cicciosgamino.github.io/master/images/justme%40412x412_round.png)](https://www.linkedin.com/in/marco-canali-859b6a52/) \t|\n|:------------------------------------------------------------------------------------------:\t|\n| **@cicciosgamino** \t|\n\n## Support\nReach out to me at one of the following places:\n\n- [Github](https://github.com/CICCIOSGAMINO)\n- [Twitter](https://twitter.com/cicciosgamino)\n\n## Donate\nDonate help and contibutions!\n\n## License\n[GNU General Public License v3.0](https://github.com/CICCIOSGAMINO/init/blob/master/LICENSE)\n\nMade 🧑‍💻 by [@cicciosgamino](https://cicciosgamino.web.app)\n","readmeFilename":"README.md"}