{"id":13515156,"url":"https://github.com/educastellano/qr-code","last_synced_at":"2025-05-14T15:10:56.878Z","repository":{"id":10681187,"uuid":"12919709","full_name":"educastellano/qr-code","owner":"educastellano","description":"Web Component for generating QR codes","archived":false,"fork":false,"pushed_at":"2025-01-08T23:30:48.000Z","size":879,"stargazers_count":517,"open_issues_count":1,"forks_count":83,"subscribers_count":17,"default_branch":"gh-pages","last_synced_at":"2025-05-13T20:10:41.227Z","etag":null,"topics":["customelements","html","javascript","qr","qr-code","qrcode","webcomponent"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":"icanzilb/SwiftSpinner","license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/educastellano.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2013-09-18T09:59:26.000Z","updated_at":"2025-04-26T11:33:09.000Z","dependencies_parsed_at":"2025-01-26T05:00:53.955Z","dependency_job_id":"b45254fd-39b6-420a-ab6f-9a5055dfc170","html_url":"https://github.com/educastellano/qr-code","commit_stats":{"total_commits":88,"total_committers":6,"mean_commits":"14.666666666666666","dds":0.09090909090909094,"last_synced_commit":"42f777fb2db7d89395f6ba5972d5eea40a62ab4d"},"previous_names":[],"tags_count":22,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/educastellano%2Fqr-code","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/educastellano%2Fqr-code/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/educastellano%2Fqr-code/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/educastellano%2Fqr-code/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/educastellano","download_url":"https://codeload.github.com/educastellano/qr-code/tar.gz/refs/heads/gh-pages","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":254170056,"owners_count":22026219,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["customelements","html","javascript","qr","qr-code","qrcode","webcomponent"],"created_at":"2024-08-01T05:01:06.903Z","updated_at":"2025-05-14T15:10:56.822Z","avatar_url":"https://github.com/educastellano.png","language":"JavaScript","readme":"[![Published on webcomponents.org](https://img.shields.io/badge/webcomponents.org-published-blue.svg)](https://www.webcomponents.org/element/webcomponent-qr-code)\n\n# \u0026lt;qr-code\u0026gt;\n\nWeb Component for generating QR Codes, using (a [fork](https://github.com/educastellano/qr.js) of) [qr.js](https://github.com/lifthrasiir/qr.js) lib.\n\n## Demo\n\n\u003e [Check it live](http://educastellano.github.io/qr-code/demo).\n\n## Install\n\n```sh\nnpm install webcomponent-qr-code\n```\n\n## Usage\n\n```js\nimport 'webcomponent-qr-code'\n```\n\n\u003c!--\n```\n\u003ccustom-element-demo\u003e\n  \u003ctemplate\u003e\n    \u003cscript src=\"demo/webcomponents-lite.js\"\u003e\u003c/script\u003e\n    \u003cscript src=\"index.js\"\u003e\u003c/script\u003e\n    \u003cnext-code-block\u003e\u003c/next-code-block\u003e\n  \u003c/template\u003e\n\u003c/custom-element-demo\u003e\n```\n--\u003e\n```html\n\u003cqr-code data=\"hello world!\"\u003e\u003c/qr-code\u003e\n```\n\n**Custom element name**\n\n```js\nimport QRCode from 'webcomponent-qr-code/qr-code'\n\ncustomElements.define('myapp-qrcode', QRCode)\n```\n\n```html\n\u003cmyapp-qrcode data=\"hello world!\"\u003e\u003c/myapp-qrcode\u003e\n```\n\n**Custom styles**\n\nUse the `part` pseudo-element to style shadow DOM elements:\n\n```css\n/* format=\"png\" */\nqr-code::part(img) {}\n\n/* format=\"html\" */\nqr-code::part(table) {}\n\n/* format=\"svg\" */\nqr-code::part(svg) {}\n```\n\n\n## Options\n\nAttribute       | Type                      | Default             | Description\n---             | ---                       | ---                 | ---\n`data`          | *string*                  | `null`              | The information encoded by the QR code.\n`format`        | *string*: `png`, `html`, `svg` | `png`     | Format of the QR code rendered inside the component.\n`modulesize`    | *int*                     | `5`                 | Size of the modules in *pixels*.\n`margin`        | *int*                     | `4`                 | Margin of the QR code in *modules*.\n`unit`          | *string*                  | `px`                | CSS units of the `modulesize` (**Supported for HTML generation only**)\n`ratio`         | *int*                     | `1`                 | Multiplier for the `modulesize`. Example: if `units` is `rem` and the `ratio` is `0.0625`, a modulesize of `5px` will be translated to `0.3125rem`. (**Supported for HTML generation only**)\n`ecclevel`      | *string*: `L`, `M`, `Q`, `H`, | `L`             | Error correction level\n\n\n## Contributing\n\n1. Fork it!\n2. Create your feature branch: `git checkout -b my-new-feature`\n3. Commit your changes: `git commit -m 'Add some feature'`\n4. Push to the branch: `git push origin my-new-feature`\n5. Submit a pull request :D\n\n## Changelog\n\n* v1.3.0 January 9, 2025\n    * Support to configure error correction level (ECC).\n* v1.2.0 July 12, 2023\n    * Support for any CSS unit in HTML generated codes.\n* v1.1.0 November 15, 2022\n    * Support for custom styles with the `::part` CSS pseudo-element\n* v1.0.0 July 13, 2018\n    * Use new API customElements.define\n    * Support for a custom element name\n    * Keep support for document.register() in /qr-code.es5.js\n* v0.1.9 December 9, 2016\n    * Updated docs\n* v0.1.7 April 11, 2015\n    * Support for SVG\n* v0.1.6 April 10, 2015\n    * Default attributes\n    * qr.js removed and used as a dependency\n    * Available in NPM\n* v0.1.1 March 31, 2015\n    * Framework-agnostic webcomponent (no use of Polymer)\n    * Available in Bower\n* v0.0.1 September 18, 2013\n    * Started project using [boilerplate-element](https://github.com/customelements/boilerplate-element)\n\n## License\n\n[MIT License](http://opensource.org/licenses/MIT)\n","funding_links":[],"categories":["JavaScript"],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Feducastellano%2Fqr-code","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Feducastellano%2Fqr-code","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Feducastellano%2Fqr-code/lists"}