From 0ebfdad3881534b329ab8805241172bfe569e4a1 Mon Sep 17 00:00:00 2001 From: Max Huang Date: Sat, 8 Jul 2017 15:25:58 +1000 Subject: [PATCH] [Issue-173] Fix reactjs onBlur, onFocus rawValue issue --- bower.json | 2 +- dist/cleave-angular.min.js | 2 +- dist/cleave-react.js | 67 ++++++++++++++++++++++++++++---------- dist/cleave-react.min.js | 4 +-- dist/cleave.min.js | 2 +- package.json | 2 +- src/Cleave.react.js | 61 ++++++++++++++++++++++++---------- 7 files changed, 100 insertions(+), 40 deletions(-) diff --git a/bower.json b/bower.json index 5e4df9f3..9523f7c6 100644 --- a/bower.json +++ b/bower.json @@ -8,7 +8,7 @@ "form", "input" ], - "version": "0.7.23", + "version": "0.8.0", "author": { "name": "Max Huang", "email": "risonhuang@gmail.com", diff --git a/dist/cleave-angular.min.js b/dist/cleave-angular.min.js index a4d03e75..6b63a983 100644 --- a/dist/cleave-angular.min.js +++ b/dist/cleave-angular.min.js @@ -1,5 +1,5 @@ /*! - * cleave.js - 0.7.23 + * cleave.js - 0.8.0 * https://github.com/nosir/cleave.js * Apache License Version 2.0 * diff --git a/dist/cleave-react.js b/dist/cleave-react.js index 421ed752..d7f06b99 100644 --- a/dist/cleave-react.js +++ b/dist/cleave-react.js @@ -104,12 +104,16 @@ return /******/ (function(modules) { // webpackBootstrap var options = _owner$props.options; var onKeyDown = _owner$props.onKeyDown; var onChange = _owner$props.onChange; + var onFocus = _owner$props.onFocus; + var onBlur = _owner$props.onBlur; var onInit = _owner$props.onInit; owner.registeredEvents = { onInit: onInit || Util.noop, onChange: onChange || Util.noop, + onFocus: onFocus || Util.noop, + onBlur: onBlur || Util.noop, onKeyDown: onKeyDown || Util.noop }; @@ -199,6 +203,24 @@ return /******/ (function(modules) { // webpackBootstrap owner.onChange({ target: { value: value } }); }, + getRawValue: function getRawValue() { + var owner = this, + pps = owner.properties, + rawValue = pps.result; + + if (pps.rawValueTrimPrefix) { + rawValue = Util.getPrefixStrippedValue(rawValue, pps.prefix, pps.prefixLength); + } + + if (pps.numeral) { + rawValue = pps.numeralFormatter.getRawValue(rawValue); + } else { + rawValue = Util.stripDelimiters(rawValue, pps.delimiter, pps.delimiters); + } + + return rawValue; + }, + onInit: function onInit(owner) { return owner; }, @@ -218,26 +240,33 @@ return /******/ (function(modules) { // webpackBootstrap owner.registeredEvents.onKeyDown(event); }, - onChange: function onChange(event) { + onFocus: function onFocus(event) { var owner = this, - pps = owner.properties, - rawValue; + pps = owner.properties; - owner.onInput(event.target.value); + event.target.rawValue = owner.getRawValue(); + event.target.value = pps.result; - rawValue = pps.result; + owner.registeredEvents.onFocus(event); + }, - if (pps.rawValueTrimPrefix) { - rawValue = Util.getPrefixStrippedValue(rawValue, pps.prefix, pps.prefixLength); - } + onBlur: function onBlur(event) { + var owner = this, + pps = owner.properties; - if (pps.numeral) { - rawValue = pps.numeralFormatter.getRawValue(rawValue); - } else { - rawValue = Util.stripDelimiters(rawValue, pps.delimiter, pps.delimiters); - } + event.target.rawValue = owner.getRawValue(); + event.target.value = pps.result; + + owner.registeredEvents.onBlur(event); + }, + + onChange: function onChange(event) { + var owner = this, + pps = owner.properties; + + owner.onInput(event.target.value); - event.target.rawValue = rawValue; + event.target.rawValue = owner.getRawValue(); event.target.value = pps.result; owner.registeredEvents.onChange(event); @@ -368,20 +397,24 @@ return /******/ (function(modules) { // webpackBootstrap var value = _owner$props2.value; var options = _owner$props2.options; var onKeyDown = _owner$props2.onKeyDown; + var onFocus = _owner$props2.onFocus; + var onBlur = _owner$props2.onBlur; var onChange = _owner$props2.onChange; var onInit = _owner$props2.onInit; var htmlRef = _owner$props2.htmlRef; - var propsToTransfer = _objectWithoutProperties(_owner$props2, ['value', 'options', 'onKeyDown', 'onChange', 'onInit', 'htmlRef']); + var propsToTransfer = _objectWithoutProperties(_owner$props2, ['value', 'options', 'onKeyDown', 'onFocus', 'onBlur', 'onChange', 'onInit', 'htmlRef']); return React.createElement('input', _extends({ type: 'text', ref: htmlRef, value: owner.state.value, onKeyDown: owner.onKeyDown, - onChange: owner.onChange + onChange: owner.onChange, + onFocus: owner.onFocus, + onBlur: owner.onBlur }, propsToTransfer, { - 'data-cleave-ignore': [value, options, onKeyDown, onChange, onInit, htmlRef] + 'data-cleave-ignore': [value, options, onFocus, onBlur, onKeyDown, onChange, onInit, htmlRef] })); } }); diff --git a/dist/cleave-react.min.js b/dist/cleave-react.min.js index 13e405ed..4dc020f2 100644 --- a/dist/cleave-react.min.js +++ b/dist/cleave-react.min.js @@ -1,8 +1,8 @@ /*! - * cleave.js - 0.7.23 + * cleave.js - 0.8.0 * https://github.com/nosir/cleave.js * Apache License Version 2.0 * * Copyright (C) 2012-2017 Max Huang https://github.com/nosir/ */ -!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("react")):"function"==typeof define&&define.amd?define(["react"],t):"object"==typeof exports?exports.Cleave=t(require("react")):e.Cleave=t(e.React)}(this,function(e){return function(e){function t(r){if(n[r])return n[r].exports;var o=n[r]={exports:{},id:r,loaded:!1};return e[r].call(o.exports,o,o.exports,t),o.loaded=!0,o.exports}var n={};return t.m=e,t.c=n,t.p="",t(0)}([function(e,t,n){"use strict";function r(e,t){var n={};for(var r in e)t.indexOf(r)>=0||Object.prototype.hasOwnProperty.call(e,r)&&(n[r]=e[r]);return n}var o=Object.assign||function(e){for(var t=1;t0?p.headStr(e,n.maxLength):e,n.result=p.getFormattedValue(e,n.blocks,n.blocksLength,n.delimiter,n.delimiters),void(r===n.result&&r!==n.prefix||t.updateValueState())))},updateCreditCardPropsByValue:function(e){var t,n=this,r=n.properties;p.headStr(r.result,4)!==p.headStr(e,4)&&(t=u.getInfo(e,r.creditCardStrictMode),r.blocks=t.blocks,r.blocksLength=r.blocks.length,r.maxLength=p.getMaxLength(r.blocks),r.creditCardType!==t.type&&(r.creditCardType=t.type,r.onCreditCardTypeChanged.call(n,r.creditCardType)))},updateValueState:function(){var e=this;return e.isAndroid?void window.setTimeout(function(){e.setState({value:e.properties.result})},1):void e.setState({value:e.properties.result})},render:function(){var e=this,t=e.props,n=t.value,a=t.options,s=t.onKeyDown,c=t.onChange,l=t.onInit,u=t.htmlRef,p=r(t,["value","options","onKeyDown","onChange","onInit","htmlRef"]);return i.createElement("input",o({type:"text",ref:u,value:e.state.value,onKeyDown:e.onKeyDown,onChange:e.onChange},p,{"data-cleave-ignore":[n,a,s,c,l,u]}))}});e.exports=m},function(t,n){t.exports=e},function(e,t,n){"use strict";var r=n(1),o=n(3),i=(new r.Component).updater;e.exports=o(r.Component,r.isValidElement,i)},function(e,t,n){(function(t){"use strict";function r(e){return e}function o(e,n,o){function p(e,n,r){for(var o in n)n.hasOwnProperty(o)&&("production"!==t.env.NODE_ENV?c("function"==typeof n[o],"%s: %s type `%s` is invalid; it must be a function, usually from React.PropTypes.",e.displayName||"ReactClass",l[r],o):void 0)}function d(e,t){var n=N.hasOwnProperty(t)?N[t]:null;_.hasOwnProperty(t)&&s("OVERRIDE_BASE"===n,"ReactClassInterface: You are attempting to override `%s` from your class specification. Ensure that your method names do not overlap with React methods.",t),e&&s("DEFINE_MANY"===n||"DEFINE_MANY_MERGED"===n,"ReactClassInterface: You are attempting to define `%s` on your component more than once. This conflict may be due to a mixin.",t)}function m(e,r){if(r){s("function"!=typeof r,"ReactClass: You're attempting to use a component class or function as a mixin. Instead, just use a regular object."),s(!n(r),"ReactClass: You're attempting to use a component as a mixin. Instead, just use a regular object.");var o=e.prototype,i=o.__reactAutoBindPairs;r.hasOwnProperty(u)&&x.mixins(e,r.mixins);for(var a in r)if(r.hasOwnProperty(a)&&a!==u){var l=r[a],p=o.hasOwnProperty(a);if(d(p,a),x.hasOwnProperty(a))x[a](e,l);else{var m=N.hasOwnProperty(a),f="function"==typeof l,h=f&&!m&&!p&&r.autobind!==!1;if(h)i.push(a,l),o[a]=l;else if(p){var v=N[a];s(m&&("DEFINE_MANY_MERGED"===v||"DEFINE_MANY"===v),"ReactClass: Unexpected spec policy %s for key %s when mixing in component specs.",v,a),"DEFINE_MANY_MERGED"===v?o[a]=g(o[a],l):"DEFINE_MANY"===v&&(o[a]=y(o[a],l))}else o[a]=l,"production"!==t.env.NODE_ENV&&"function"==typeof l&&r.displayName&&(o[a].displayName=r.displayName+"_"+a)}}}else if("production"!==t.env.NODE_ENV){var E=typeof r,b="object"===E&&null!==r;"production"!==t.env.NODE_ENV?c(b,"%s: You're attempting to include a mixin that is either null or not an object. Check the mixins included by the component, as well as any mixins they include themselves. Expected object but got %s.",e.displayName||"ReactClass",null===r?null:E):void 0}}function f(e,t){if(t)for(var n in t){var r=t[n];if(t.hasOwnProperty(n)){var o=n in x;s(!o,'ReactClass: You are attempting to define a reserved property, `%s`, that shouldn\'t be on the "statics" key. Define it as an instance property instead; it will still be accessible on the constructor.',n);var i=n in e;s(!i,"ReactClass: You are attempting to define `%s` on your component more than once. This conflict may be due to a mixin.",n),e[n]=r}}}function h(e,t){s(e&&t&&"object"==typeof e&&"object"==typeof t,"mergeIntoWithNoDuplicateKeys(): Cannot merge non-objects.");for(var n in t)t.hasOwnProperty(n)&&(s(void 0===e[n],"mergeIntoWithNoDuplicateKeys(): Tried to merge two objects with the same key: `%s`. This conflict may be due to a mixin; in particular, this may be caused by two getInitialState() or getDefaultProps() methods returning objects with clashing keys.",n),e[n]=t[n]);return e}function g(e,t){return function(){var n=e.apply(this,arguments),r=t.apply(this,arguments);if(null==n)return r;if(null==r)return n;var o={};return h(o,n),h(o,r),o}}function y(e,t){return function(){e.apply(this,arguments),t.apply(this,arguments)}}function v(e,n){var r=n.bind(e);if("production"!==t.env.NODE_ENV){r.__reactBoundContext=e,r.__reactBoundMethod=n,r.__reactBoundArguments=null;var o=e.constructor.displayName,i=r.bind;r.bind=function(a){for(var s=arguments.length,l=Array(s>1?s-1:0),u=1;s>u;u++)l[u-1]=arguments[u];if(a!==e&&null!==a)"production"!==t.env.NODE_ENV?c(!1,"bind(): React component methods may only be bound to the component instance. See %s",o):void 0;else if(!l.length)return"production"!==t.env.NODE_ENV?c(!1,"bind(): You are binding a component method to the component. React does this for you automatically in a high-performance way, so you can safely remove this call. See %s",o):void 0,r;var p=i.apply(r,arguments);return p.__reactBoundContext=e,p.__reactBoundMethod=n,p.__reactBoundArguments=l,p}}return r}function E(e){for(var t=e.__reactAutoBindPairs,n=0;n1)for(var n=1;nn;n++)t["_"+String.fromCharCode(n)]=n;var r=Object.getOwnPropertyNames(t).map(function(e){return t[e]});if("0123456789"!==r.join(""))return!1;var o={};return"abcdefghijklmnopqrst".split("").forEach(function(e){o[e]=e}),"abcdefghijklmnopqrst"===Object.keys(Object.assign({},o)).join("")}catch(i){return!1}}var o=Object.getOwnPropertySymbols,i=Object.prototype.hasOwnProperty,a=Object.prototype.propertyIsEnumerable;e.exports=r()?Object.assign:function(e,t){for(var r,s,c=n(e),l=1;l1?t-1:0),r=1;t>r;r++)n[r-1]=arguments[r];var o=0,i="Warning: "+e.replace(/%s/g,function(){return n[o++]});"undefined"!=typeof console&&console.error(i);try{throw new Error(i)}catch(a){}};o=function(t,n){if(void 0===n)throw new Error("`warning(condition, format, ...args)` requires a warning message argument");if(0!==n.indexOf("Failed Composite propType: ")&&!t){for(var r=arguments.length,o=Array(r>2?r-2:0),i=2;r>i;i++)o[i-2]=arguments[i];e.apply(void 0,[n].concat(o))}}}(),e.exports=o}).call(t,n(4))},function(e,t){"use strict";function n(e){return function(){return e}}var r=function(){};r.thatReturns=n,r.thatReturnsFalse=n(!1),r.thatReturnsTrue=n(!0),r.thatReturnsNull=n(null),r.thatReturnsThis=function(){return this},r.thatReturnsArgument=function(e){return e},e.exports=r},function(e,t){"use strict";var n=function r(e,t,n,o,i,a){var s=this;s.numeralDecimalMark=e||".",s.numeralIntegerScale=t>=0?t:10,s.numeralDecimalScale=n>=0?n:2,s.numeralThousandsGroupStyle=o||r.groupStyle.thousand,s.numeralPositiveOnly=!!i,s.delimiter=a||""===a?a:",",s.delimiterRE=a?new RegExp("\\"+a,"g"):""};n.groupStyle={thousand:"thousand",lakh:"lakh",wan:"wan"},n.prototype={getRawValue:function(e){return e.replace(this.delimiterRE,"").replace(this.numeralDecimalMark,".")},format:function(e){var t,r,o=this,i="";switch(e=e.replace(/[A-Za-z]/g,"").replace(o.numeralDecimalMark,"M").replace(/[^\dM-]/g,"").replace(/^\-/,"N").replace(/\-/g,"").replace("N",o.numeralPositiveOnly?"":"-").replace("M",o.numeralDecimalMark).replace(/^(-)?0+(?=\d)/,"$1"),r=e,e.indexOf(o.numeralDecimalMark)>=0&&(t=e.split(o.numeralDecimalMark),r=t[0],i=o.numeralDecimalMark+t[1].slice(0,o.numeralDecimalScale)),o.numeralIntegerScale>0&&(r=r.slice(0,o.numeralIntegerScale+("-"===e.slice(0,1)?1:0))),o.numeralThousandsGroupStyle){case n.groupStyle.lakh:r=r.replace(/(\d)(?=(\d\d)+\d$)/g,"$1"+o.delimiter);break;case n.groupStyle.wan:r=r.replace(/(\d)(?=(\d{4})+$)/g,"$1"+o.delimiter);break;default:r=r.replace(/(\d)(?=(\d{3})+$)/g,"$1"+o.delimiter)}return r.toString()+(o.numeralDecimalScale>0?i.toString():"")}},e.exports=n},function(e,t){"use strict";var n=function(e){var t=this;t.blocks=[],t.datePattern=e,t.initBlocks()};n.prototype={initBlocks:function(){var e=this;e.datePattern.forEach(function(t){"Y"===t?e.blocks.push(4):e.blocks.push(2)})},getBlocks:function(){return this.blocks},getValidatedDate:function(e){var t=this,n="";return e=e.replace(/[^\d]/g,""),t.blocks.forEach(function(r,o){if(e.length>0){var i=e.slice(0,r),a=i.slice(0,1),s=e.slice(r);switch(t.datePattern[o]){case"d":"00"===i?i="01":parseInt(a,10)>3?i="0"+a:parseInt(i,10)>31&&(i="31");break;case"m":"00"===i?i="01":parseInt(a,10)>1?i="0"+a:parseInt(i,10)>12&&(i="12")}n+=i,e=s}}),n}},e.exports=n},function(e,t){"use strict";var n=function(e,t){var n=this;n.delimiter=t||""===t?t:" ",n.delimiterRE=t?new RegExp("\\"+t,"g"):"",n.formatter=e};n.prototype={setFormatter:function(e){this.formatter=e},format:function(e){var t=this;t.formatter.clear(),e=e.replace(/[^\d+]/g,""),e=e.replace(t.delimiterRE,"");for(var n,r="",o=!1,i=0,a=e.length;a>i;i++)n=t.formatter.inputDigit(e.charAt(i)),/[\s()-]/g.test(n)?(r=n,o=!0):o||(r=n);return r=r.replace(/[()]/g,""),r=r.replace(/[\s-]/g,t.delimiter)}},e.exports=n},function(e,t){"use strict";var n={blocks:{uatp:[4,5,6],amex:[4,6,5],diners:[4,6,4],discover:[4,4,4,4],mastercard:[4,4,4,4],dankort:[4,4,4,4],instapayment:[4,4,4,4],jcb:[4,4,4,4],maestro:[4,4,4,4],visa:[4,4,4,4],general:[4,4,4,4],generalStrict:[4,4,4,7]},re:{uatp:/^(?!1800)1\d{0,14}/,amex:/^3[47]\d{0,13}/,discover:/^(?:6011|65\d{0,2}|64[4-9]\d?)\d{0,12}/,diners:/^3(?:0([0-5]|9)|[689]\d?)\d{0,11}/,mastercard:/^(5[1-5]|2[2-7])\d{0,14}/,dankort:/^(5019|4175|4571)\d{0,12}/,instapayment:/^63[7-9]\d{0,13}/,jcb:/^(?:2131|1800|35\d{0,2})\d{0,12}/,maestro:/^(?:5[0678]\d{0,2}|6304|67\d{0,2})\d{0,12}/,visa:/^4\d{0,15}/},getInfo:function(e,t){var r=n.blocks,o=n.re;return t=!!t,o.amex.test(e)?{type:"amex",blocks:r.amex}:o.uatp.test(e)?{type:"uatp",blocks:r.uatp}:o.diners.test(e)?{type:"diners",blocks:r.diners}:o.discover.test(e)?{type:"discover",blocks:t?r.generalStrict:r.discover}:o.mastercard.test(e)?{type:"mastercard",blocks:r.mastercard}:o.dankort.test(e)?{type:"dankort",blocks:r.dankort}:o.instapayment.test(e)?{type:"instapayment",blocks:r.instapayment}:o.jcb.test(e)?{type:"jcb",blocks:r.jcb}:o.maestro.test(e)?{type:"maestro",blocks:t?r.generalStrict:r.maestro}:o.visa.test(e)?{type:"visa",blocks:t?r.generalStrict:r.visa}:{type:"unknown",blocks:t?r.generalStrict:r.general}}};e.exports=n},function(e,t){"use strict";var n={noop:function(){},strip:function(e,t){return e.replace(t,"")},isDelimiter:function(e,t,n){return 0===n.length?e===t:n.some(function(t){return e===t?!0:void 0})},getDelimiterREByDelimiter:function(e){return new RegExp(e.replace(/([.?*+^$[\]\\(){}|-])/g,"\\$1"),"g")},stripDelimiters:function(e,t,n){var r=this;if(0===n.length){var o=t?r.getDelimiterREByDelimiter(t):"";return e.replace(o,"")}return n.forEach(function(t){e=e.replace(r.getDelimiterREByDelimiter(t),"")}),e},headStr:function(e,t){return e.slice(0,t)},getMaxLength:function(e){return e.reduce(function(e,t){return e+t},0)},getPrefixStrippedValue:function(e,t,n){if(e.slice(0,n)!==t){var r=this.getFirstDiffIndex(t,e.slice(0,n));e=t+e.slice(r,r+1)+e.slice(n+1)}return e.slice(n)},getFirstDiffIndex:function(e,t){for(var n=0;e.charAt(n)===t.charAt(n);)if(""===e.charAt(n++))return-1;return n},getFormattedValue:function(e,t,n,r,o){var i,a="",s=o.length>0;return 0===n?e:(t.forEach(function(t,c){if(e.length>0){var l=e.slice(0,t),u=e.slice(t);a+=l,i=s?o[c]||i:r,l.length===t&&n-1>c&&(a+=i),e=u}}),a)},isAndroid:function(){return!(!navigator||!/android/i.test(navigator.userAgent))},isAndroidBackspaceKeydown:function(e,t){return this.isAndroid()?t===e.slice(0,-1):!1}};e.exports=n},function(e,t){(function(t){"use strict";var n="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol?"symbol":typeof e},r={assign:function(e,r){return e=e||{},r=r||{},e.creditCard=!!r.creditCard,e.creditCardStrictMode=!!r.creditCardStrictMode,e.creditCardType="",e.onCreditCardTypeChanged=r.onCreditCardTypeChanged||function(){},e.phone=!!r.phone,e.phoneRegionCode=r.phoneRegionCode||"AU",e.phoneFormatter={},e.date=!!r.date,e.datePattern=r.datePattern||["d","m","Y"],e.dateFormatter={},e.numeral=!!r.numeral,e.numeralIntegerScale=r.numeralIntegerScale>=0?r.numeralIntegerScale:10,e.numeralDecimalScale=r.numeralDecimalScale>=0?r.numeralDecimalScale:2,e.numeralDecimalMark=r.numeralDecimalMark||".",e.numeralThousandsGroupStyle=r.numeralThousandsGroupStyle||"thousand",e.numeralPositiveOnly=!!r.numeralPositiveOnly,e.numericOnly=e.creditCard||e.date||!!r.numericOnly,e.uppercase=!!r.uppercase,e.lowercase=!!r.lowercase,e.prefix=e.creditCard||e.phone||e.date?"":r.prefix||"",e.prefixLength=e.prefix.length,e.rawValueTrimPrefix=!!r.rawValueTrimPrefix,e.copyDelimiter=!!r.copyDelimiter,e.initValue=void 0===r.initValue?"":r.initValue.toString(),e.delimiter=r.delimiter||""===r.delimiter?r.delimiter:r.date?"/":r.numeral?",":(r.phone," "),e.delimiterLength=e.delimiter.length,e.delimiters=r.delimiters||[],e.blocks=r.blocks||[],e.blocksLength=e.blocks.length,e.root="object"===("undefined"==typeof t?"undefined":n(t))&&t?t:window,e.maxLength=0,e.backspace=!1,e.result="",e}};e.exports=r}).call(t,function(){return this}())}])}); \ No newline at end of file +!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("react")):"function"==typeof define&&define.amd?define(["react"],t):"object"==typeof exports?exports.Cleave=t(require("react")):e.Cleave=t(e.React)}(this,function(e){return function(e){function t(r){if(n[r])return n[r].exports;var o=n[r]={exports:{},id:r,loaded:!1};return e[r].call(o.exports,o,o.exports,t),o.loaded=!0,o.exports}var n={};return t.m=e,t.c=n,t.p="",t(0)}([function(e,t,n){"use strict";function r(e,t){var n={};for(var r in e)t.indexOf(r)>=0||Object.prototype.hasOwnProperty.call(e,r)&&(n[r]=e[r]);return n}var o=Object.assign||function(e){for(var t=1;t0?p.headStr(e,n.maxLength):e,n.result=p.getFormattedValue(e,n.blocks,n.blocksLength,n.delimiter,n.delimiters),void(r===n.result&&r!==n.prefix||t.updateValueState())))},updateCreditCardPropsByValue:function(e){var t,n=this,r=n.properties;p.headStr(r.result,4)!==p.headStr(e,4)&&(t=l.getInfo(e,r.creditCardStrictMode),r.blocks=t.blocks,r.blocksLength=r.blocks.length,r.maxLength=p.getMaxLength(r.blocks),r.creditCardType!==t.type&&(r.creditCardType=t.type,r.onCreditCardTypeChanged.call(n,r.creditCardType)))},updateValueState:function(){var e=this;return e.isAndroid?void window.setTimeout(function(){e.setState({value:e.properties.result})},1):void e.setState({value:e.properties.result})},render:function(){var e=this,t=e.props,n=t.value,a=t.options,s=t.onKeyDown,c=t.onFocus,u=t.onBlur,l=t.onChange,p=t.onInit,d=t.htmlRef,m=r(t,["value","options","onKeyDown","onFocus","onBlur","onChange","onInit","htmlRef"]);return i.createElement("input",o({type:"text",ref:d,value:e.state.value,onKeyDown:e.onKeyDown,onChange:e.onChange,onFocus:e.onFocus,onBlur:e.onBlur},m,{"data-cleave-ignore":[n,a,c,u,s,l,p,d]}))}});e.exports=m},function(t,n){t.exports=e},function(e,t,n){"use strict";var r=n(1),o=n(3),i=(new r.Component).updater;e.exports=o(r.Component,r.isValidElement,i)},function(e,t,n){(function(t){"use strict";function r(e){return e}function o(e,n,o){function p(e,n,r){for(var o in n)n.hasOwnProperty(o)&&("production"!==t.env.NODE_ENV?c("function"==typeof n[o],"%s: %s type `%s` is invalid; it must be a function, usually from React.PropTypes.",e.displayName||"ReactClass",u[r],o):void 0)}function d(e,t){var n=N.hasOwnProperty(t)?N[t]:null;_.hasOwnProperty(t)&&s("OVERRIDE_BASE"===n,"ReactClassInterface: You are attempting to override `%s` from your class specification. Ensure that your method names do not overlap with React methods.",t),e&&s("DEFINE_MANY"===n||"DEFINE_MANY_MERGED"===n,"ReactClassInterface: You are attempting to define `%s` on your component more than once. This conflict may be due to a mixin.",t)}function m(e,r){if(r){s("function"!=typeof r,"ReactClass: You're attempting to use a component class or function as a mixin. Instead, just use a regular object."),s(!n(r),"ReactClass: You're attempting to use a component as a mixin. Instead, just use a regular object.");var o=e.prototype,i=o.__reactAutoBindPairs;r.hasOwnProperty(l)&&x.mixins(e,r.mixins);for(var a in r)if(r.hasOwnProperty(a)&&a!==l){var u=r[a],p=o.hasOwnProperty(a);if(d(p,a),x.hasOwnProperty(a))x[a](e,u);else{var m=N.hasOwnProperty(a),f="function"==typeof u,h=f&&!m&&!p&&r.autobind!==!1;if(h)i.push(a,u),o[a]=u;else if(p){var y=N[a];s(m&&("DEFINE_MANY_MERGED"===y||"DEFINE_MANY"===y),"ReactClass: Unexpected spec policy %s for key %s when mixing in component specs.",y,a),"DEFINE_MANY_MERGED"===y?o[a]=g(o[a],u):"DEFINE_MANY"===y&&(o[a]=v(o[a],u))}else o[a]=u,"production"!==t.env.NODE_ENV&&"function"==typeof u&&r.displayName&&(o[a].displayName=r.displayName+"_"+a)}}}else if("production"!==t.env.NODE_ENV){var E=typeof r,b="object"===E&&null!==r;"production"!==t.env.NODE_ENV?c(b,"%s: You're attempting to include a mixin that is either null or not an object. Check the mixins included by the component, as well as any mixins they include themselves. Expected object but got %s.",e.displayName||"ReactClass",null===r?null:E):void 0}}function f(e,t){if(t)for(var n in t){var r=t[n];if(t.hasOwnProperty(n)){var o=n in x;s(!o,'ReactClass: You are attempting to define a reserved property, `%s`, that shouldn\'t be on the "statics" key. Define it as an instance property instead; it will still be accessible on the constructor.',n);var i=n in e;s(!i,"ReactClass: You are attempting to define `%s` on your component more than once. This conflict may be due to a mixin.",n),e[n]=r}}}function h(e,t){s(e&&t&&"object"==typeof e&&"object"==typeof t,"mergeIntoWithNoDuplicateKeys(): Cannot merge non-objects.");for(var n in t)t.hasOwnProperty(n)&&(s(void 0===e[n],"mergeIntoWithNoDuplicateKeys(): Tried to merge two objects with the same key: `%s`. This conflict may be due to a mixin; in particular, this may be caused by two getInitialState() or getDefaultProps() methods returning objects with clashing keys.",n),e[n]=t[n]);return e}function g(e,t){return function(){var n=e.apply(this,arguments),r=t.apply(this,arguments);if(null==n)return r;if(null==r)return n;var o={};return h(o,n),h(o,r),o}}function v(e,t){return function(){e.apply(this,arguments),t.apply(this,arguments)}}function y(e,n){var r=n.bind(e);if("production"!==t.env.NODE_ENV){r.__reactBoundContext=e,r.__reactBoundMethod=n,r.__reactBoundArguments=null;var o=e.constructor.displayName,i=r.bind;r.bind=function(a){for(var s=arguments.length,u=Array(s>1?s-1:0),l=1;s>l;l++)u[l-1]=arguments[l];if(a!==e&&null!==a)"production"!==t.env.NODE_ENV?c(!1,"bind(): React component methods may only be bound to the component instance. See %s",o):void 0;else if(!u.length)return"production"!==t.env.NODE_ENV?c(!1,"bind(): You are binding a component method to the component. React does this for you automatically in a high-performance way, so you can safely remove this call. See %s",o):void 0,r;var p=i.apply(r,arguments);return p.__reactBoundContext=e,p.__reactBoundMethod=n,p.__reactBoundArguments=u,p}}return r}function E(e){for(var t=e.__reactAutoBindPairs,n=0;n1)for(var n=1;nn;n++)t["_"+String.fromCharCode(n)]=n;var r=Object.getOwnPropertyNames(t).map(function(e){return t[e]});if("0123456789"!==r.join(""))return!1;var o={};return"abcdefghijklmnopqrst".split("").forEach(function(e){o[e]=e}),"abcdefghijklmnopqrst"===Object.keys(Object.assign({},o)).join("")}catch(i){return!1}}var o=Object.getOwnPropertySymbols,i=Object.prototype.hasOwnProperty,a=Object.prototype.propertyIsEnumerable;e.exports=r()?Object.assign:function(e,t){for(var r,s,c=n(e),u=1;u1?t-1:0),r=1;t>r;r++)n[r-1]=arguments[r];var o=0,i="Warning: "+e.replace(/%s/g,function(){return n[o++]});"undefined"!=typeof console&&console.error(i);try{throw new Error(i)}catch(a){}};o=function(t,n){if(void 0===n)throw new Error("`warning(condition, format, ...args)` requires a warning message argument");if(0!==n.indexOf("Failed Composite propType: ")&&!t){for(var r=arguments.length,o=Array(r>2?r-2:0),i=2;r>i;i++)o[i-2]=arguments[i];e.apply(void 0,[n].concat(o))}}}(),e.exports=o}).call(t,n(4))},function(e,t){"use strict";function n(e){return function(){return e}}var r=function(){};r.thatReturns=n,r.thatReturnsFalse=n(!1),r.thatReturnsTrue=n(!0),r.thatReturnsNull=n(null),r.thatReturnsThis=function(){return this},r.thatReturnsArgument=function(e){return e},e.exports=r},function(e,t){"use strict";var n=function r(e,t,n,o,i,a){var s=this;s.numeralDecimalMark=e||".",s.numeralIntegerScale=t>=0?t:10,s.numeralDecimalScale=n>=0?n:2,s.numeralThousandsGroupStyle=o||r.groupStyle.thousand,s.numeralPositiveOnly=!!i,s.delimiter=a||""===a?a:",",s.delimiterRE=a?new RegExp("\\"+a,"g"):""};n.groupStyle={thousand:"thousand",lakh:"lakh",wan:"wan"},n.prototype={getRawValue:function(e){return e.replace(this.delimiterRE,"").replace(this.numeralDecimalMark,".")},format:function(e){var t,r,o=this,i="";switch(e=e.replace(/[A-Za-z]/g,"").replace(o.numeralDecimalMark,"M").replace(/[^\dM-]/g,"").replace(/^\-/,"N").replace(/\-/g,"").replace("N",o.numeralPositiveOnly?"":"-").replace("M",o.numeralDecimalMark).replace(/^(-)?0+(?=\d)/,"$1"),r=e,e.indexOf(o.numeralDecimalMark)>=0&&(t=e.split(o.numeralDecimalMark),r=t[0],i=o.numeralDecimalMark+t[1].slice(0,o.numeralDecimalScale)),o.numeralIntegerScale>0&&(r=r.slice(0,o.numeralIntegerScale+("-"===e.slice(0,1)?1:0))),o.numeralThousandsGroupStyle){case n.groupStyle.lakh:r=r.replace(/(\d)(?=(\d\d)+\d$)/g,"$1"+o.delimiter);break;case n.groupStyle.wan:r=r.replace(/(\d)(?=(\d{4})+$)/g,"$1"+o.delimiter);break;default:r=r.replace(/(\d)(?=(\d{3})+$)/g,"$1"+o.delimiter)}return r.toString()+(o.numeralDecimalScale>0?i.toString():"")}},e.exports=n},function(e,t){"use strict";var n=function(e){var t=this;t.blocks=[],t.datePattern=e,t.initBlocks()};n.prototype={initBlocks:function(){var e=this;e.datePattern.forEach(function(t){"Y"===t?e.blocks.push(4):e.blocks.push(2)})},getBlocks:function(){return this.blocks},getValidatedDate:function(e){var t=this,n="";return e=e.replace(/[^\d]/g,""),t.blocks.forEach(function(r,o){if(e.length>0){var i=e.slice(0,r),a=i.slice(0,1),s=e.slice(r);switch(t.datePattern[o]){case"d":"00"===i?i="01":parseInt(a,10)>3?i="0"+a:parseInt(i,10)>31&&(i="31");break;case"m":"00"===i?i="01":parseInt(a,10)>1?i="0"+a:parseInt(i,10)>12&&(i="12")}n+=i,e=s}}),n}},e.exports=n},function(e,t){"use strict";var n=function(e,t){var n=this;n.delimiter=t||""===t?t:" ",n.delimiterRE=t?new RegExp("\\"+t,"g"):"",n.formatter=e};n.prototype={setFormatter:function(e){this.formatter=e},format:function(e){var t=this;t.formatter.clear(),e=e.replace(/[^\d+]/g,""),e=e.replace(t.delimiterRE,"");for(var n,r="",o=!1,i=0,a=e.length;a>i;i++)n=t.formatter.inputDigit(e.charAt(i)),/[\s()-]/g.test(n)?(r=n,o=!0):o||(r=n);return r=r.replace(/[()]/g,""),r=r.replace(/[\s-]/g,t.delimiter)}},e.exports=n},function(e,t){"use strict";var n={blocks:{uatp:[4,5,6],amex:[4,6,5],diners:[4,6,4],discover:[4,4,4,4],mastercard:[4,4,4,4],dankort:[4,4,4,4],instapayment:[4,4,4,4],jcb:[4,4,4,4],maestro:[4,4,4,4],visa:[4,4,4,4],general:[4,4,4,4],generalStrict:[4,4,4,7]},re:{uatp:/^(?!1800)1\d{0,14}/,amex:/^3[47]\d{0,13}/,discover:/^(?:6011|65\d{0,2}|64[4-9]\d?)\d{0,12}/,diners:/^3(?:0([0-5]|9)|[689]\d?)\d{0,11}/,mastercard:/^(5[1-5]|2[2-7])\d{0,14}/,dankort:/^(5019|4175|4571)\d{0,12}/,instapayment:/^63[7-9]\d{0,13}/,jcb:/^(?:2131|1800|35\d{0,2})\d{0,12}/,maestro:/^(?:5[0678]\d{0,2}|6304|67\d{0,2})\d{0,12}/,visa:/^4\d{0,15}/},getInfo:function(e,t){var r=n.blocks,o=n.re;return t=!!t,o.amex.test(e)?{type:"amex",blocks:r.amex}:o.uatp.test(e)?{type:"uatp",blocks:r.uatp}:o.diners.test(e)?{type:"diners",blocks:r.diners}:o.discover.test(e)?{type:"discover",blocks:t?r.generalStrict:r.discover}:o.mastercard.test(e)?{type:"mastercard",blocks:r.mastercard}:o.dankort.test(e)?{type:"dankort",blocks:r.dankort}:o.instapayment.test(e)?{type:"instapayment",blocks:r.instapayment}:o.jcb.test(e)?{type:"jcb",blocks:r.jcb}:o.maestro.test(e)?{type:"maestro",blocks:t?r.generalStrict:r.maestro}:o.visa.test(e)?{type:"visa",blocks:t?r.generalStrict:r.visa}:{type:"unknown",blocks:t?r.generalStrict:r.general}}};e.exports=n},function(e,t){"use strict";var n={noop:function(){},strip:function(e,t){return e.replace(t,"")},isDelimiter:function(e,t,n){return 0===n.length?e===t:n.some(function(t){return e===t?!0:void 0})},getDelimiterREByDelimiter:function(e){return new RegExp(e.replace(/([.?*+^$[\]\\(){}|-])/g,"\\$1"),"g")},stripDelimiters:function(e,t,n){var r=this;if(0===n.length){var o=t?r.getDelimiterREByDelimiter(t):"";return e.replace(o,"")}return n.forEach(function(t){e=e.replace(r.getDelimiterREByDelimiter(t),"")}),e},headStr:function(e,t){return e.slice(0,t)},getMaxLength:function(e){return e.reduce(function(e,t){return e+t},0)},getPrefixStrippedValue:function(e,t,n){if(e.slice(0,n)!==t){var r=this.getFirstDiffIndex(t,e.slice(0,n));e=t+e.slice(r,r+1)+e.slice(n+1)}return e.slice(n)},getFirstDiffIndex:function(e,t){for(var n=0;e.charAt(n)===t.charAt(n);)if(""===e.charAt(n++))return-1;return n},getFormattedValue:function(e,t,n,r,o){var i,a="",s=o.length>0;return 0===n?e:(t.forEach(function(t,c){if(e.length>0){var u=e.slice(0,t),l=e.slice(t);a+=u,i=s?o[c]||i:r,u.length===t&&n-1>c&&(a+=i),e=l}}),a)},isAndroid:function(){return!(!navigator||!/android/i.test(navigator.userAgent))},isAndroidBackspaceKeydown:function(e,t){return this.isAndroid()?t===e.slice(0,-1):!1}};e.exports=n},function(e,t){(function(t){"use strict";var n="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol?"symbol":typeof e},r={assign:function(e,r){return e=e||{},r=r||{},e.creditCard=!!r.creditCard,e.creditCardStrictMode=!!r.creditCardStrictMode,e.creditCardType="",e.onCreditCardTypeChanged=r.onCreditCardTypeChanged||function(){},e.phone=!!r.phone,e.phoneRegionCode=r.phoneRegionCode||"AU",e.phoneFormatter={},e.date=!!r.date,e.datePattern=r.datePattern||["d","m","Y"],e.dateFormatter={},e.numeral=!!r.numeral,e.numeralIntegerScale=r.numeralIntegerScale>=0?r.numeralIntegerScale:10,e.numeralDecimalScale=r.numeralDecimalScale>=0?r.numeralDecimalScale:2,e.numeralDecimalMark=r.numeralDecimalMark||".",e.numeralThousandsGroupStyle=r.numeralThousandsGroupStyle||"thousand",e.numeralPositiveOnly=!!r.numeralPositiveOnly,e.numericOnly=e.creditCard||e.date||!!r.numericOnly,e.uppercase=!!r.uppercase,e.lowercase=!!r.lowercase,e.prefix=e.creditCard||e.phone||e.date?"":r.prefix||"",e.prefixLength=e.prefix.length,e.rawValueTrimPrefix=!!r.rawValueTrimPrefix,e.copyDelimiter=!!r.copyDelimiter,e.initValue=void 0===r.initValue?"":r.initValue.toString(),e.delimiter=r.delimiter||""===r.delimiter?r.delimiter:r.date?"/":r.numeral?",":(r.phone," "),e.delimiterLength=e.delimiter.length,e.delimiters=r.delimiters||[],e.blocks=r.blocks||[],e.blocksLength=e.blocks.length,e.root="object"===("undefined"==typeof t?"undefined":n(t))&&t?t:window,e.maxLength=0,e.backspace=!1,e.result="",e}};e.exports=r}).call(t,function(){return this}())}])}); \ No newline at end of file diff --git a/dist/cleave.min.js b/dist/cleave.min.js index 2d708e34..87d18e1c 100644 --- a/dist/cleave.min.js +++ b/dist/cleave.min.js @@ -1,5 +1,5 @@ /*! - * cleave.js - 0.7.23 + * cleave.js - 0.8.0 * https://github.com/nosir/cleave.js * Apache License Version 2.0 * diff --git a/package.json b/package.json index 8bd0ec69..29f9374a 100644 --- a/package.json +++ b/package.json @@ -10,7 +10,7 @@ "form", "input" ], - "version": "0.7.23", + "version": "0.8.0", "author": { "name": "Max Huang", "url": "http://github.com/nosir", diff --git a/src/Cleave.react.js b/src/Cleave.react.js index 9b279358..cf9bd707 100644 --- a/src/Cleave.react.js +++ b/src/Cleave.react.js @@ -39,11 +39,13 @@ var Cleave = CreateReactClass({ getInitialState: function () { var owner = this, - { value, options, onKeyDown, onChange, onInit } = owner.props; + { value, options, onKeyDown, onChange, onFocus, onBlur, onInit } = owner.props; owner.registeredEvents = { onInit: onInit || Util.noop, onChange: onChange || Util.noop, + onFocus: onFocus || Util.noop, + onBlur: onBlur || Util.noop, onKeyDown: onKeyDown || Util.noop }; @@ -143,6 +145,23 @@ var Cleave = CreateReactClass({ owner.onChange({target: {value: value}}); }, + getRawValue: function () { + var owner = this, pps = owner.properties, + rawValue = pps.result; + + if (pps.rawValueTrimPrefix) { + rawValue = Util.getPrefixStrippedValue(rawValue, pps.prefix, pps.prefixLength); + } + + if (pps.numeral) { + rawValue = pps.numeralFormatter.getRawValue(rawValue); + } else { + rawValue = Util.stripDelimiters(rawValue, pps.delimiter, pps.delimiters); + } + + return rawValue; + }, + onInit: function (owner) { return owner; }, @@ -162,25 +181,31 @@ var Cleave = CreateReactClass({ owner.registeredEvents.onKeyDown(event); }, - onChange: function (event) { - var owner = this, pps = owner.properties, - rawValue; + onFocus: function (event) { + var owner = this, pps = owner.properties; - owner.onInput(event.target.value); + event.target.rawValue = owner.getRawValue(); + event.target.value = pps.result; - rawValue = pps.result; + owner.registeredEvents.onFocus(event); + }, - if (pps.rawValueTrimPrefix) { - rawValue = Util.getPrefixStrippedValue(rawValue, pps.prefix, pps.prefixLength); - } + onBlur: function (event) { + var owner = this, pps = owner.properties; - if (pps.numeral) { - rawValue = pps.numeralFormatter.getRawValue(rawValue); - } else { - rawValue = Util.stripDelimiters(rawValue, pps.delimiter, pps.delimiters); - } + event.target.rawValue = owner.getRawValue(); + event.target.value = pps.result; + + owner.registeredEvents.onBlur(event); + }, + + + onChange: function (event) { + var owner = this, pps = owner.properties; + + owner.onInput(event.target.value); - event.target.rawValue = rawValue; + event.target.rawValue = owner.getRawValue(); event.target.value = pps.result; owner.registeredEvents.onChange(event); @@ -305,7 +330,7 @@ var Cleave = CreateReactClass({ render: function () { var owner = this, - { value, options, onKeyDown, onChange, onInit, htmlRef, ...propsToTransfer } = owner.props; + { value, options, onKeyDown, onFocus, onBlur, onChange, onInit, htmlRef, ...propsToTransfer } = owner.props; return ( ); }