v4.0.0

[zpao]

Added

• Added proper support for ref, enabling direct access for underlying canvas or svg nodes. This also resulted in much more accurate type defitions. (Pass down ref to SVG/Canvas element #202)
• Added support for marginSize prop, replacing the now deprecated includeMargin. This enables margins of any value, not just 0 or 4. (Add new marginSize prop #281)
• Added Support for Setting Image Opacity via imageSettings.opacity (Add Image Opacity #292)
• Added minVersion prop to give better control over QR Code generated (Add minVersion prop to give better control over QR Code generated #323)
• Added support for specifying cross-origin for embedded images via imageSettings.crossOrigin. (Image add crossOrigin settings (#143) #324)

Changed

• Improved accessibility for QRCodeSVG by rendering a <title> node instead of setting a title attribute. (Fix issue (#283) with NVDA screen reader and SVG #284)
• Improved accessibility with explicit role set on rendered SVG and Canvas. (Add role=img to rendered canvas & svg #321)
• Improved documentation (###)
• Used better types in TypeScript for ErrorCorrectionLevel, resulting in better developer experience. (Create ErrorCorrectionLevel type #291)

Deprecated

• The includeMargin prop has been deprecated in favor of marginSize. (Add new marginSize prop #281)

Removed

• Removed default export which was deprecated in v3. (Remove default export #208)
• Remove explicit style prop. This still works identically as it was passed through and the type definitions are unaffected as they were improved via the ref changes (Remove explicit style prop #357)

Fixed

• Improved support for dual publishing of ESM/CJS modules for better compatibility with tools. (Better support for dual ESM/CJS #301)
• Set explicit display names for improved debugging experience. (Ensure displayName is correct. #304)
• Improved SVG compatibility by using href in place of xlink:href for embedded images. (Add href attribute for QRCodeSVG #336)
• Mitigated warnings when using QRCodeSVG in server components (Mitigate warnings when using QRCodeSVG in server components #352)

---

This discussion was created from the release v4.0.0.

[VincentVW]

@zpao might be nice to mention in the release notes how to upgrade with the removal of the default export. It saves some time for the library users by not having to look into the PR details. If I interpreted the PR that's mentioned correctly, it comes down to:

The default import can be replaced with importing QRCodeCanvas, unless you were using the renderAs prop to render the QR code as svg, then it can be replaced with QRCodeSVG.

[zpao]

Totally agree that some migration docs would be good! I'd sat with the change for so long that I'd forgotten. I'll pull something together and put it into the repo for easy linking.

I may publish another release in the 3.y range with a @deprecated for TS to pick up, which may help a few folks too.

[IRediTOTO]

4.0 and error :| Why? Attempted import error: 'qrcode.react' does not contain a default export (imported as 'QRCode').
I changed as follow your new upgrade, but it still error