UNPKG

@suolun/verification-code

Version:
10 lines (8 loc) 2.41 kB
/** * Bundle of @suolun/verification-code * Generated: 2019-11-20 * Version: 1.0.6 * License: MIT * Author: sauron */ !function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t(require("react")):"function"==typeof define&&define.amd?define(["react"],t):(e=e||self).VerificationCode=t(e.React)}(this,function(h){"use strict";var x="default"in h?h.default:h;function g(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){if(Symbol.iterator in Object(e)||"[object Arguments]"===Object.prototype.toString.call(e)){var n=[],r=!0,u=!1,a=void 0;try{for(var o,i=e[Symbol.iterator]();!(r=(o=i.next()).done)&&(n.push(o.value),!t||n.length!==t);r=!0);}catch(e){u=!0,a=e}finally{try{r||null==i.return||i.return()}finally{if(u)throw a}}return n}}(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance")}()}function C(e){var u=e.onChange,t=e.isFocus,n=e.index,r=e.type,a=void 0===r?"text":r,o=e.value,i=void 0===o?"":o,c=h.useRef(null),l=g(h.useState(""),2),f=l[0],s=l[1];return h.useEffect(function(){t&&c.current&&c.current.focus()}),x.createElement(x.Fragment,null,x.createElement("input",{autoComplete:"new-password",autoFocus:t,ref:c,value:i,className:"active-code-input",type:a,onFocus:function(e,t){var n=t.target.value.replace(/[\W]/,"");u({handleType:"focus",index:e,value:n})}.bind(null,n),onChange:function(e,t){c.current&&c.current.blur();var n=t.target.value,r=t.target.value=n.replace(f,"").replace(/[\W]/,"").substring(0,1);r&&u({handleType:"next",index:e,value:r}),s(r)}.bind(null,n),onKeyDown:function(e){"Backspace"===e.key&&u({handleType:"clear",index:n})},onPaste:function(e){e.preventDefault()}}))}return function(e){var t=e.onGetVerifationCode,n=e.len,r=void 0===n?4:n,u=e.autoFocus,a=void 0===u||u,o=e.type,i=void 0===o?"text":o,c=e.defaultValue,l=void 0===c?"":c,f=function(e){var t=[];return t.length=e,t.fill(" ").join("")}(r),s=g(h.useState(l),2),d=s[0],v=s[1],p=g(h.useState(a?0:-1),2),y=p[0],m=p[1],b=h.useCallback(function(e){var t=e.index,n=e.handleType,r=e.value;"clear"===n&&0!==t?(m(t-1),v(d.substr(0,t))):"focus"===n?m(t):"next"===n&&(m(t+1),v(d.substr(0,t)+r+d.substr(t+1)))},[d]);return h.useEffect(function(){d&&t(d)},[t,d]),x.createElement("div",{className:"active-store"},f.split("").map(function(e,t){return x.createElement(C,{isFocus:y===t,index:t,value:d[t],key:t,onChange:b,type:i})}))}});