svelte-qrcode-image
Advanced tools
svelte-qrcode-image - npm Package Compare versions
Comparing version 0.4.4 to 0.5.0
| { | ||
| "name": "svelte-qrcode-image", | ||
| "version": "0.4.4", | ||
| "version": "0.5.0", | ||
| "devDependencies": { | ||
@@ -5,0 +5,0 @@ "@sveltejs/adapter-auto": "next", |
@@ -12,2 +12,4 @@ import { SvelteComponentTyped } from "svelte"; | ||
| altText?: string | undefined; | ||
| displayID?: string | undefined; | ||
| displayClass?: string | undefined; | ||
| margin?: number | undefined; | ||
@@ -14,0 +16,0 @@ scale?: number | undefined; |
@@ -33,7 +33,8 @@ # Svelte-QRCode-Image | ||
| | text | string | what you want the QR Code to show; the QR Code will changed automatically if any changes in the variable binding to it | "Hello World" | | ||
| | displayWidth | number | pass to the `width` property of `<img>` tag | null - the final `<img>` element will not have this property | | ||
| | displayHeight | number | pass to the `height` property of `<img>` tag | null - the final `<img>` element will not have this property | | ||
| | displayStyle | string | pass to the `style` property of `<img>` tag | "" - the final `<img>` element will not have this property | | ||
| | displayStyle | string | pass to the `style` property of `<img>` tag | "" - the final `<img>` element will not have this property | | ||
| | altText | string | pass to the `alt` property of `<img>` tag | "QR Code" | | ||
| | displayWidth | number | pass to the `width` attribute of `<img>` or `<canvas> tag | null - the final `<img>` element will not have this property | | ||
| | displayHeight | number | pass to the `height` attribute of `<img>` or `<canvas> tag | null - the final `<img>` element will not have this property | | ||
| | displayStyle | string | pass to the `style` attribute of `<img>` or `<canvas>` tag | null - the final `<img>` element will not have this property | | ||
| | altText | string | pass to the `alt` attribute of `<img>` tag | "QR Code" | | ||
| | displayID | string | pass to the `id` attribute of `<img>` or `<canvas> tag | null - the final element will not have this property | | ||
| | displayClass | string | pass to the `class` attribute of `<img>` or `<canvas> tag | null - the final element will not have this property | | ||
| | margin | number | pass to `margin` to the options of [qrcode](https://www.npmjs.com/package/qrcode): Define how much wide the quiet zone should be | 4 | | ||
@@ -53,3 +54,7 @@ | scale | number | pass to `scale` to the options of [qrcode](https://www.npmjs.com/package/qrcode): A value of `1` means 1px per modules (black dots) | 4 | | ||
| ### Limitation | ||
| The QR Code might not be generated during SSR, will only have the `<img>` or `<canvas>` tag created, | ||
| as the actual work is done in [onMount](https://svelte.dev/docs#run-time-svelte-onmount) to prevent the undefined behavior of [bind:this](https://svelte.dev/docs#template-syntax-element-directives-bind-this) | ||
| ## Plans | ||
@@ -61,4 +66,6 @@ ### TODO | ||
| - [x] Website for demo | ||
| - [ ] Display the QR-Code as background image or canvas | ||
| - [x] Display the QR-Code as canvas | ||
| - [ ] Display the QR-Code as background image | ||
| - [ ] Option to use different "backend" to generate the image | ||
| - [ ] Automatic Testing | ||
@@ -65,0 +72,0 @@ |
Sorry, the diff of this file is not supported yet
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by11.55%
14806
- Number of package files
- increased by11.11%
10
- Lines of code
- increased by5.26%
40
- Number of lines in readme file
- increased by6.14%
121