Export QRCodeSVG and QRCodeCanvas directly.

This makes it possible to ship an ESM, potentially allowing Webpack to tree shake out the unused component.

It also removes a level of indirection and helps editors discover the propTypes for the components.

README.md

@@ -12,7 +12,7 @@ npm install qrcode.react
 
 ```js
 var React = require('react');
-var QRCode = require('qrcode.react');
+var QRCode = require('qrcode.react').QRCodeCanvas; // or QRCodeSVG
 
 React.render(
   <QRCode value="http://facebook.github.io/react/" />,

examples/demo.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var QRCode = require('..');
+var {QRCodeCanvas, QRCodeSVG} = require('..');
 var React = require('react');
 var ReactDOM = require('react-dom');
 
@@ -36,15 +36,16 @@ class Demo extends React.Component {
     excavate: ${this.state.imageExcavate},
   }}`
       : '';
-    var code = `<QRCode
+    var code = `<${this.state.renderAs === 'svg' ? 'QRCodeSVG' :  'QRCodeCanvas'}
   value={"${this.state.value}"}
   size={${this.state.size}}
   bgColor={"${this.state.bgColor}"}
   fgColor={"${this.state.fgColor}"}
   level={"${this.state.level}"}
-  includeMargin={${this.state.includeMargin}}
-  renderAs={"${this.state.renderAs}"}${imageSettingsCode}
+  includeMargin={${this.state.includeMargin}}${imageSettingsCode}
 />`;
+
+    const Component = this.state.renderAs === 'svg' ? QRCodeSVG :  QRCodeCanvas;
     return (
       <div>
         <div>
@@ -257,7 +258,7 @@ class Demo extends React.Component {
           </label>
         </div>
 
-        <QRCode
+        <Component
           value={this.state.value}
           size={this.state.size}
           fgColor={this.state.fgColor}

src/index.js

@@ -449,13 +449,4 @@ if (process.env.NODE_ENV !== 'production') {
   QRCodeSVG.propTypes = PROP_TYPES;
 }
 
-type RootProps = QRProps & {renderAs: 'svg' | 'canvas'};
-const QRCode = (props: RootProps): React.Node => {
-  const {renderAs, ...otherProps} = props;
-  const Component = renderAs === 'svg' ? QRCodeSVG : QRCodeCanvas;
-  return <Component {...otherProps} />;
-};
-
-QRCode.defaultProps = {renderAs: 'canvas', ...DEFAULT_PROPS};
-
-module.exports = QRCode;
+module.exports = {QRCodeSVG, QRCodeCanvas};