Castlenine / svelte-qrcode

QR Code generator for Svelte & SvelteKit, with no dependencies
MIT License
20 stars 3 forks source link

Download QRCode #1

Closed juanjo closed 6 months ago

juanjo commented 7 months ago

Your library is working great, however I would like to give the option to the user to download the SVG of the QRCode. Is there a way to do so?

juanjo commented 7 months ago

I have created another component QrCodeLink.svelte to do so:

<script lang="ts">
  import { QRCode } from "./qrcode";
  import type { Options } from "./qrcode";

  export let content = "";

  export let backgroundColor = "#ffffff";
  export let color = "#000000";
  export let errorCorrection = "M";
  export let padding = 4;
  export let filename = "qr-code";
  export let downloadText = "Download";

  const opt: Options = {
    background: backgroundColor,
    color,
    container: "svg",
    content,
    ecl: errorCorrection,
    join: true,
    padding,
    typeNumber: 4,
    width: 600,
    height: 600,
  };

  const qrCode = new QRCode(opt);

  const blob = new Blob([qrCode?.svg()], { type: "image/svg+xml" });
  let downloadUrl = URL.createObjectURL(blob);
</script>

<a target="_blank" href={downloadUrl} download={filename}>{downloadText}</a>
Castlenine commented 7 months ago

Thank you for your feature request.

I'll conduct some testing and then proceed to publish an update including this feature

Castlenine commented 6 months ago

Updated to 1.2.0

This should satisfy your needs: https://github.com/Castlenine/svelte-qrcode?tab=readme-ov-file#downloading-the-qr-code

I also added the possibility of adding a logo in the center of the QR code

juanjo commented 6 months ago

Awesome <3 Than you!

Castlenine commented 6 months ago

I will lock this issue due to spam related to a cryptocurrency airdrop.

P.S.: I was tagged in the message, but I am NOT affiliated with this.