Fix linter warnings. Fixes #77

s-yadav · Aug 28, 2017 · 934b717 · 934b717
1 parent 8ef8562
commit 934b717
Show file tree

Hide file tree

Showing 3 changed files with 26 additions and 17 deletions.
diff --git a/custom_formatters/card_expiry.js b/custom_formatters/card_expiry.js
@@ -21,8 +21,8 @@ function limit(val, max) {
 }
 
 export function cardExpiry(val) {
-  let month = limit(val.substring(0, 2), '12');
-  let date = limit(val.substring(2, 4), '31');
+  const month = limit(val.substring(0, 2), '12');
+  const date = limit(val.substring(2, 4), '31');
 
   return month + (date.length ? '/' + date : '');
 }
diff --git a/example/src/index.js b/example/src/index.js
@@ -20,28 +20,36 @@ class App extends React.Component {
           <h3>
             Prefix and thousand separator : Format currency as text
           </h3>
-          <NumberFormat value={2456981} displayType={'text'} thousandSeparator={true} prefix={'$'}/>
+          <NumberFormat value={2456981} displayType="text" thousandSeparator={true} prefix="$" />
         </div>
 
         <div className="example">
           <h3>
             Format with pattern : Format credit card as text
           </h3>
-          <NumberFormat value={4111111111111111} displayType={'text'} format="#### #### #### ####" />
+          <NumberFormat value={4111111111111111} displayType="text" format="#### #### #### ####" />
         </div>
 
         <div className="example">
           <h3>
             Prefix and thousand separator : Format currency in input
           </h3>
-          <NumberFormat thousandSeparator={'.'} decimalSeparator="," isAllowed={(values) => { return values.floatValue > 5}} value={this.state.test} prefix={'$'} decimalPrecision={3} onChange={(e, val) => this.setState({test: e.target.value})}/>
+          <NumberFormat
+            thousandSeparator="."
+            decimalSeparator=","
+            isAllowed={(values) => values.floatValue > 5}
+            value={this.state.test}
+            prefix="$"
+            decimalPrecision={3}
+            onChange={(e) => this.setState({test: e.target.value})}
+          />
         </div>
 
         <div className="example">
           <h3>
             Decimal precision : Format currency in input with decimal precision
           </h3>
-          <NumberFormat thousandSeparator={true} decimalPrecision={3} prefix={'$'}/>
+          <NumberFormat thousandSeparator={true} decimalPrecision={3} prefix="$" />
         </div>
 
 
@@ -53,14 +61,14 @@ class App extends React.Component {
             ThousandSeperator: '.', decimalSeparator=','
           </div>
           <div>
-            <NumberFormat thousandSeparator={"."} decimalSeparator={","} prefix={"$"} />
+            <NumberFormat thousandSeparator="." decimalSeparator="," prefix="$" />
           </div>
           <br/>
           <div>
             ThousandSeperator: ' ', decimalSeparator='.'
           </div>
           <div>
-            <NumberFormat thousandSeparator={" "} decimalSeparator={"."} prefix={"$"} />
+            <NumberFormat thousandSeparator=" " decimalSeparator="." prefix="$" />
           </div>
         </div>
 
@@ -72,14 +80,14 @@ class App extends React.Component {
             ThousandSeperator: ',', decimalSeparator='.', decimalPrecision:2
           </div>
           <div>
-            <NumberFormat thousandSeparator={","}  decimalSeparator={"."} decimalPrecision={2} />
+            <NumberFormat thousandSeparator=","  decimalSeparator="." decimalPrecision={2} />
           </div>
           <br/>
           <div>
             ThousandSeperator: '.', decimalSeparator=',', decimalPrecision:2
           </div>
           <div>
-            <NumberFormat thousandSeparator={"."}  decimalSeparator={","}  decimalPrecision={2} />
+            <NumberFormat thousandSeparator="."  decimalSeparator=","  decimalPrecision={2} />
           </div>
         </div>
 
@@ -94,21 +102,21 @@ class App extends React.Component {
           <h3>
             Format with mask : Format credit card in an input
           </h3>
-          <NumberFormat format="#### #### #### ####" mask="_"/>
+          <NumberFormat format="#### #### #### ####" mask="_" />
         </div>
 
         <div className="example">
           <h3>
             Custom format method  : Format credit card expiry time
           </h3>
-          <NumberFormat format={cardExpiry}/>
+          <NumberFormat format={cardExpiry} />
         </div>
 
         <div className="example">
           <h3>
             Custom input : Format credit card number
           </h3>
-          <NumberFormat customInput={TextField} format="#### #### #### ####"/>
+          <NumberFormat customInput={TextField} format="#### #### #### ####" />
         </div>
 
       </div>

diff --git a/src/number_format.js b/src/number_format.js
@@ -1,7 +1,7 @@
 import PropTypes from 'prop-types';
 import React from 'react';
 
-function noop(){};
+function noop(){}
 
 function escapeRegExp(str) {
   return str.replace(/[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g, "\\$&");
@@ -84,6 +84,7 @@ const defaultProps = {
   suffix: '',
   allowNegative: true,
   type: 'text',
+  value: '',
   onChange: noop,
   onKeyDown: noop,
   onMouseUp: noop,
@@ -128,7 +129,7 @@ class NumberFormat extends React.Component {
   getFloatString(num, props) {
     props = props || this.props;
     const {decimalSeparator, thousandSeparator} = this.getSeparators(props);
-    return num.replace(new RegExp(escapeRegExp(thousandSeparator || ''), 'g'), '').replace(decimalSeparator, '.');
+    return (num || '').replace(new RegExp(escapeRegExp(thousandSeparator || ''), 'g'), '').replace(decimalSeparator, '.');
   }
 
   getFloatValue(num, props) {
@@ -142,7 +143,7 @@ class NumberFormat extends React.Component {
 
     let {value} = props;
 
-    if (format || value === undefined || value === '') return value;
+    if (format || !(value || value === 0)) return value;
 
     const isNumber = typeof value === 'number';
 
@@ -407,7 +408,7 @@ class NumberFormat extends React.Component {
     const {state, props} = this;
     const {isAllowed} = props;
     const lastValue = state.value;
-    let {formattedValue, value} = this.formatInput(inputValue);
+    let {formattedValue, value} = this.formatInput(inputValue); // eslint-disable-line prefer-const
 
     /*Max of selectionStart and selectionEnd is taken for the patch of pixel and other mobile device caret bug*/
     const currentCaretPosition = Math.max(el.selectionStart, el.selectionEnd);