Merge pull request #47 from no23reason/features/remove-size-prop

Remove 'size' prop
no23reason · Jun 20, 2017 · 3541f1c · 3541f1c
2 parents 52f16eb + f6fd89d
commit 3541f1c
Show file tree

Hide file tree

Showing 9 changed files with 23 additions and 34 deletions.
diff --git a/README.md b/README.md
@@ -50,7 +50,6 @@ The props available are (shown with default values):
 ```js
 {
     value: '', // The value to encode in the code
-    size: 256, // Size of the code in pixels. This is obsolete and will be removed in the next major version!
     level: 'L', // QR Error correction level
     bgColor: '#FFFFFF', // Color of the bright squares
     fgColor: '#000000', // Color of the dark squares

diff --git a/demo/Demo.jsx b/demo/Demo.jsx
@@ -6,21 +6,19 @@ class Demo extends React.Component {
     super(props, context);
     this.state = {
       value: 'Try changing the values and see the code update in real-time!',
-      size: 256,
       level: 'L',
       bgColor: '#FFFFFF',
       fgColor: '#000000',
     };
   }
 
   updateValue = e => this.setState({ ...this.state, value: e.target.value });
-  updateSize = e => this.setState({ ...this.state, size: +(e.target.value) });
   updateLevel = e => this.setState({ ...this.state, level: e.target.value });
   updateBgColor = e => this.setState({ ...this.state, bgColor: e.target.value });
   updateFgColor = e => this.setState({ ...this.state, fgColor: e.target.value });
 
   render() {
-    const { state, updateSize, updateValue, updateLevel, updateBgColor, updateFgColor } = this;
+    const { state, updateValue, updateLevel, updateBgColor, updateFgColor } = this;
     return (<div>
       <form className="pure-form pure-form-stacked">
         <fieldset>
@@ -29,26 +27,22 @@ class Demo extends React.Component {
               <label htmlFor="value">Value</label>
               <textarea className="pure-input-1" id="value" onChange={updateValue} type="text" value={state.value} />
             </div>
-            <div className="pure-u-1-4"><label htmlFor="level">Level</label>
+            <div className="pure-u-1-3"><label htmlFor="level">Level</label>
               <select id="level" onChange={updateLevel}>
                 <option value="L">L</option>
                 <option value="M">M</option>
                 <option value="Q">Q</option>
                 <option value="H">H</option>
               </select>
             </div>
-            <div className="pure-u-1-4">
+            <div className="pure-u-1-3">
               <label htmlFor="fgColor">Foregroud</label>
               <input id="fgColor" onChange={updateFgColor} type="color" value={state.fgColor} />
             </div>
-            <div className="pure-u-1-4">
+            <div className="pure-u-1-3">
               <label htmlFor="bgColor">Background</label>
               <input id="bgColor" onChange={updateBgColor} type="color" value={state.bgColor} />
             </div>
-            <div className="pure-u-1-4">
-              <label htmlFor="size">Size</label>
-              <input className="pure-input-1" id="size" onChange={updateSize} type="number" value={state.size} />
-            </div>
           </div>
         </fieldset>
       </form>
@@ -57,7 +51,7 @@ class Demo extends React.Component {
           bgColor={state.bgColor}
           fgColor={state.fgColor}
           level={state.level}
-          style={{ width: state.size }}
+          style={{ width: 500 }}
           value={state.value}
         />
       </div>

diff --git a/docs/app.5772cf807213db8998c7.js b/docs/app.5772cf807213db8998c7.js
diff --git a/docs/app.9f75ed5a44b04282b735.js b/docs/app.9f75ed5a44b04282b735.js
diff --git a/docs/index.html b/docs/index.html
@@ -47,5 +47,5 @@ <h1>react-qr-svg</h1>
         </section>
       </article>
     </div>
-  <script type="text/javascript" src="manifest.13035e058901d5ab0fde.js"></script><script type="text/javascript" src="vendors.f5af5a37821b3505a0eb.js"></script><script type="text/javascript" src="app.9f75ed5a44b04282b735.js"></script><script type="text/javascript" src="style.0f46ed9cbf5e2764169e.js"></script></body>
+  <script type="text/javascript" src="manifest.ed3ef8faf5a8845e0785.js"></script><script type="text/javascript" src="vendors.f5af5a37821b3505a0eb.js"></script><script type="text/javascript" src="app.5772cf807213db8998c7.js"></script><script type="text/javascript" src="style.0f46ed9cbf5e2764169e.js"></script></body>
 </html>
diff --git a/docs/manifest.13035e058901d5ab0fde.js b/docs/manifest.13035e058901d5ab0fde.js
diff --git a/docs/manifest.ed3ef8faf5a8845e0785.js b/docs/manifest.ed3ef8faf5a8845e0785.js
diff --git a/index.d.ts b/index.d.ts
@@ -5,10 +5,6 @@ interface QRCodeProps {
      * The value to encode in the code
      */
     value: string;
-    /**
-     * Size of the code in pixels
-     */
-    size?: number;
     /**
      * QR Error correction level
      */

diff --git a/tests/typescript/index.tsx b/tests/typescript/index.tsx
@@ -8,7 +8,7 @@ interface IDemoProps {
 class Demo extends React.Component<IDemoProps, {}> {
     render(): React.ReactElement<{}> {
         return <div>
-            <QRCode bgColor="#FFFFFF" fgColor="#000000" level="M" size={512} value={this.props.text} />
+            <QRCode bgColor="#FFFFFF" fgColor="#000000" level="M" value={this.props.text} />
             <QRCode value="Only value here" />
             <QRCode value="Style here" style={{ width: 250 }} />
         </div>;