Socket
Socket
Sign inDemoInstall

react-verification-input

Package Overview
Dependencies
Maintainers
1
Versions
55
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

react-verification-input - npm Package Compare versions

Comparing version 4.0.0-beta.0 to 4.0.0-beta.1

2

lib/index.js
/*! For license information please see index.js.LICENSE.txt */
(()=>{var e={184:(e,t)=>{var n;!function(){"use strict";var r={}.hasOwnProperty;function o(){for(var e=[],t=0;t<arguments.length;t++){var n=arguments[t];if(n){var a=typeof n;if("string"===a||"number"===a)e.push(n);else if(Array.isArray(n)){if(n.length){var i=o.apply(null,n);i&&e.push(i)}}else if("object"===a){if(n.toString!==Object.prototype.toString&&!n.toString.toString().includes("[native code]")){e.push(n.toString());continue}for(var c in n)r.call(n,c)&&n[c]&&e.push(c)}}}return e.join(" ")}e.exports?(o.default=o,e.exports=o):void 0===(n=function(){return o}.apply(t,[]))||(e.exports=n)}()},28:(e,t,n)=>{"use strict";n.d(t,{Z:()=>c});var r=n(81),o=n.n(r),a=n(645),i=n.n(a)()(o());i.push([e.id,".vi {\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n box-sizing: border-box;\n position: absolute;\n color: transparent;\n background: transparent;\n caret-color: transparent;\n outline: none;\n border: 0 none transparent;\n}\n\n.vi::-ms-reveal,\n.vi::-ms-clear {\n display: none;\n}\n\n.vi::selection {\n background: transparent;\n}\n\n/* :where() gives the styles specificity 0, which makes them overridable */\n:where(.vi__container) {\n position: relative;\n display: flex;\n gap: 8px;\n height: 50px;\n width: 300px;\n}\n\n:where(.vi__character) {\n height: 100%;\n flex-grow: 1;\n flex-basis: 0;\n text-align: center;\n font-size: 36px;\n line-height: 50px;\n border: 1px solid black;\n cursor: default;\n user-select: none;\n box-sizing: border-box;\n}\n\n:where(.vi__character--inactive) {\n color: dimgray;\n background-color: lightgray;\n}\n\n:where(.vi__character--selected) {\n outline: 2px solid cornflowerblue;\n color: cornflowerblue;\n}\n",""]);const c=i},645:e=>{"use strict";e.exports=function(e){var t=[];return t.toString=function(){return this.map((function(t){var n="",r=void 0!==t[5];return t[4]&&(n+="@supports (".concat(t[4],") {")),t[2]&&(n+="@media ".concat(t[2]," {")),r&&(n+="@layer".concat(t[5].length>0?" ".concat(t[5]):""," {")),n+=e(t),r&&(n+="}"),t[2]&&(n+="}"),t[4]&&(n+="}"),n})).join("")},t.i=function(e,n,r,o,a){"string"==typeof e&&(e=[[null,e,void 0]]);var i={};if(r)for(var c=0;c<this.length;c++){var l=this[c][0];null!=l&&(i[l]=!0)}for(var u=0;u<e.length;u++){var s=[].concat(e[u]);r&&i[s[0]]||(void 0!==a&&(void 0===s[5]||(s[1]="@layer".concat(s[5].length>0?" ".concat(s[5]):""," {").concat(s[1],"}")),s[5]=a),n&&(s[2]?(s[1]="@media ".concat(s[2]," {").concat(s[1],"}"),s[2]=n):s[2]=n),o&&(s[4]?(s[1]="@supports (".concat(s[4],") {").concat(s[1],"}"),s[4]=o):s[4]="".concat(o)),t.push(s))}},t}},81:e=>{"use strict";e.exports=function(e){return e[1]}},703:(e,t,n)=>{"use strict";var r=n(414);function o(){}function a(){}a.resetWarningCache=o,e.exports=function(){function e(e,t,n,o,a,i){if(i!==r){var c=new Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types");throw c.name="Invariant Violation",c}}function t(){return e}e.isRequired=e;var n={array:e,bigint:e,bool:e,func:e,number:e,object:e,string:e,symbol:e,any:e,arrayOf:t,element:e,elementType:e,instanceOf:t,node:e,objectOf:t,oneOf:t,oneOfType:t,shape:t,exact:t,checkPropTypes:a,resetWarningCache:o};return n.PropTypes=n,n}},697:(e,t,n)=>{e.exports=n(703)()},414:e=>{"use strict";e.exports="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED"}},t={};function n(r){var o=t[r];if(void 0!==o)return o.exports;var a=t[r]={id:r,exports:{}};return e[r](a,a.exports,n),a.exports}n.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return n.d(t,{a:t}),t},n.d=(e,t)=>{for(var r in t)n.o(t,r)&&!n.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:t[r]})},n.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),n.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var r={};(()=>{"use strict";n.r(r),n.d(r,{default:()=>m});const e=require("react");var t=n.n(e),o=n(184),a=n.n(o),i=n(697),c=n.n(i),l=n(28);function u(e){return u="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},u(e)}var s=["className","type"],p=["className"];function f(e,t,n){return(t=function(e){var t=function(e,t){if("object"!==u(e)||null===e)return e;var n=e[Symbol.toPrimitive];if(void 0!==n){var r=n.call(e,"string");if("object"!==u(r))return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return String(e)}(e);return"symbol"===u(t)?t:String(t)}(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function y(){return y=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},y.apply(this,arguments)}function v(e,t){if(null==e)return{};var n,r,o=function(e,t){if(null==e)return{};var n,r,o={},a=Object.keys(e);for(r=0;r<a.length;r++)n=a[r],t.indexOf(n)>=0||(o[n]=e[n]);return o}(e,t);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(r=0;r<a.length;r++)n=a[r],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}function h(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var r,o,a,i,c=[],l=!0,u=!1;try{if(a=(n=n.call(e)).next,0===t){if(Object(n)!==n)return;l=!1}else for(;!(l=(r=a.call(n)).done)&&(c.push(r.value),c.length!==t);l=!0);}catch(e){u=!0,o=e}finally{try{if(!l&&null!=n.return&&(i=n.return(),Object(i)!==i))return}finally{if(u)throw o}}return c}}(e,t)||d(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function d(e,t){if(e){if("string"==typeof e)return g(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?g(e,t):void 0}}function g(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}var b=(0,e.forwardRef)((function(n,r){var o=n.value,i=n.length,c=n.validChars,u=n.placeholder,b=n.autoFocus,m=n.passwordMode,S=n.inputProps,w=n.containerProps,_=n.classNames,O=n.onChange,x=n.onFocus,j=n.onBlur,P=n.onComplete,A=h((0,e.useState)(""),2),T=A[0],C=A[1],E=h((0,e.useState)(!1),2),k=E[0],I=E[1],N=(0,e.useRef)(null);(0,e.useEffect)((function(){b&&N.current.focus()}),[b]);var R,M=function(){N.current.focus()},F=function(){return null!=o?o:T},D=S.className,z=S.type,B=v(S,s),L=w.className,U=v(w,p);return t().createElement(t().Fragment,null,t().createElement("div",y({"data-testid":"container",className:a()("vi__container",_.container,L),onClick:function(){return N.current.focus()}},U),t().createElement("input",y({"aria-label":"verification input",spellCheck:!1,value:F(),onChange:function(e){var t=e.target.value.replace(/\s/g,"");RegExp("^[".concat(c,"]{0,").concat(i,"}$")).test(t)&&(O&&(null==O||O(t)),C(t),t.length===i&&(null==P||P(t)))},ref:function(e){N.current=e,"function"==typeof r?r(e):r&&(r.current=e)},className:a()("vi",D),onKeyDown:function(e){["ArrowLeft","ArrowRight","ArrowUp","ArrowDown"].includes(e.key)&&e.preventDefault()},onFocus:function(){I(!0),null==x||x()},onBlur:function(){I(!1),null==j||j()},onSelect:function(e){var t=e.target.value;e.target.setSelectionRange(t.length,t.length)},type:m?"password":z},B)),(R=Array(i),function(e){if(Array.isArray(e))return g(e)}(R)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(R)||d(R)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()).map((function(e,n){var r;return t().createElement("div",{className:a()("vi__character",_.character,(r={"vi__character--selected":(F().length===n||F().length===n+1&&i===n+1)&&k},f(r,_.characterSelected,(F().length===n||F().length===n+1&&i===n+1)&&k),f(r,"vi__character--inactive",F().length<n),f(r,_.characterInactive,F().length<n),r)),onClick:M,id:"field-".concat(n),"data-testid":"character-".concat(n),key:n},m&&F()[n]?"*":F()[n]||u)}))),t().createElement("style",{dangerouslySetInnerHTML:{__html:l.Z}}))}));b.displayName="VerificationInput",b.propTypes={value:c().string,length:c().number,validChars:c().string,placeholder:c().string,autoFocus:c().bool,passwordMode:c().bool,inputProps:c().object,containerProps:c().object,classNames:c().shape({container:c().string,character:c().string,characterInactive:c().string,characterSelected:c().string}),onChange:c().func,onFocus:c().func,onBlur:c().func,onComplete:c().func},b.defaultProps={length:6,validChars:"A-Za-z0-9",placeholder:"·",autoFocus:!1,inputProps:{},containerProps:{},classNames:{}};const m=b})();var o=exports;for(var a in r)o[a]=r[a];r.__esModule&&Object.defineProperty(o,"__esModule",{value:!0})})();
(()=>{var e={184:(e,n)=>{var t;!function(){"use strict";var r={}.hasOwnProperty;function o(){for(var e=[],n=0;n<arguments.length;n++){var t=arguments[n];if(t){var a=typeof t;if("string"===a||"number"===a)e.push(t);else if(Array.isArray(t)){if(t.length){var c=o.apply(null,t);c&&e.push(c)}}else if("object"===a){if(t.toString!==Object.prototype.toString&&!t.toString.toString().includes("[native code]")){e.push(t.toString());continue}for(var i in t)r.call(t,i)&&t[i]&&e.push(i)}}}return e.join(" ")}e.exports?(o.default=o,e.exports=o):void 0===(t=function(){return o}.apply(n,[]))||(e.exports=t)}()},28:(e,n,t)=>{"use strict";t.d(n,{Z:()=>i});var r=t(81),o=t.n(r),a=t(645),c=t.n(a)()(o());c.push([e.id,".vi {\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n box-sizing: border-box;\n position: absolute;\n color: transparent;\n background: transparent;\n caret-color: transparent;\n outline: none;\n border: 0 none transparent;\n}\n\n.vi::-ms-reveal,\n.vi::-ms-clear {\n display: none;\n}\n\n.vi::selection {\n background: transparent;\n}\n\n/* :where() gives the styles specificity 0, which makes them overridable */\n:where(.vi__container) {\n position: relative;\n display: flex;\n gap: 8px;\n height: 50px;\n width: 300px;\n}\n\n:where(.vi__character) {\n height: 100%;\n flex-grow: 1;\n flex-basis: 0;\n text-align: center;\n font-size: 36px;\n line-height: 50px;\n color: black;\n background-color: white;\n border: 1px solid black;\n cursor: default;\n user-select: none;\n box-sizing: border-box;\n}\n\n:where(.vi__character--inactive) {\n color: dimgray;\n background-color: lightgray;\n}\n\n:where(.vi__character--selected) {\n outline: 2px solid cornflowerblue;\n color: cornflowerblue;\n}\n",""]);const i=c},645:e=>{"use strict";e.exports=function(e){var n=[];return n.toString=function(){return this.map((function(n){var t="",r=void 0!==n[5];return n[4]&&(t+="@supports (".concat(n[4],") {")),n[2]&&(t+="@media ".concat(n[2]," {")),r&&(t+="@layer".concat(n[5].length>0?" ".concat(n[5]):""," {")),t+=e(n),r&&(t+="}"),n[2]&&(t+="}"),n[4]&&(t+="}"),t})).join("")},n.i=function(e,t,r,o,a){"string"==typeof e&&(e=[[null,e,void 0]]);var c={};if(r)for(var i=0;i<this.length;i++){var l=this[i][0];null!=l&&(c[l]=!0)}for(var s=0;s<e.length;s++){var u=[].concat(e[s]);r&&c[u[0]]||(void 0!==a&&(void 0===u[5]||(u[1]="@layer".concat(u[5].length>0?" ".concat(u[5]):""," {").concat(u[1],"}")),u[5]=a),t&&(u[2]?(u[1]="@media ".concat(u[2]," {").concat(u[1],"}"),u[2]=t):u[2]=t),o&&(u[4]?(u[1]="@supports (".concat(u[4],") {").concat(u[1],"}"),u[4]=o):u[4]="".concat(o)),n.push(u))}},n}},81:e=>{"use strict";e.exports=function(e){return e[1]}},703:(e,n,t)=>{"use strict";var r=t(414);function o(){}function a(){}a.resetWarningCache=o,e.exports=function(){function e(e,n,t,o,a,c){if(c!==r){var i=new Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types");throw i.name="Invariant Violation",i}}function n(){return e}e.isRequired=e;var t={array:e,bigint:e,bool:e,func:e,number:e,object:e,string:e,symbol:e,any:e,arrayOf:n,element:e,elementType:e,instanceOf:n,node:e,objectOf:n,oneOf:n,oneOfType:n,shape:n,exact:n,checkPropTypes:a,resetWarningCache:o};return t.PropTypes=t,t}},697:(e,n,t)=>{e.exports=t(703)()},414:e=>{"use strict";e.exports="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED"}},n={};function t(r){var o=n[r];if(void 0!==o)return o.exports;var a=n[r]={id:r,exports:{}};return e[r](a,a.exports,t),a.exports}t.n=e=>{var n=e&&e.__esModule?()=>e.default:()=>e;return t.d(n,{a:n}),n},t.d=(e,n)=>{for(var r in n)t.o(n,r)&&!t.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:n[r]})},t.o=(e,n)=>Object.prototype.hasOwnProperty.call(e,n),t.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var r={};(()=>{"use strict";t.r(r),t.d(r,{default:()=>g});const e=require("react");var n=t.n(e),o=t(184),a=t.n(o),c=t(697),i=t.n(c),l=t(28),s=["className","type"],u=["className"];function p(){return p=Object.assign?Object.assign.bind():function(e){for(var n=1;n<arguments.length;n++){var t=arguments[n];for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&(e[r]=t[r])}return e},p.apply(this,arguments)}function f(e,n){if(null==e)return{};var t,r,o=function(e,n){if(null==e)return{};var t,r,o={},a=Object.keys(e);for(r=0;r<a.length;r++)t=a[r],n.indexOf(t)>=0||(o[t]=e[t]);return o}(e,n);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(r=0;r<a.length;r++)t=a[r],n.indexOf(t)>=0||Object.prototype.propertyIsEnumerable.call(e,t)&&(o[t]=e[t])}return o}function d(e,n){return function(e){if(Array.isArray(e))return e}(e)||function(e,n){var t=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=t){var r,o,a,c,i=[],l=!0,s=!1;try{if(a=(t=t.call(e)).next,0===n){if(Object(t)!==t)return;l=!1}else for(;!(l=(r=a.call(t)).done)&&(i.push(r.value),i.length!==n);l=!0);}catch(e){s=!0,o=e}finally{try{if(!l&&null!=t.return&&(c=t.return(),Object(c)!==c))return}finally{if(s)throw o}}return i}}(e,n)||h(e,n)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function h(e,n){if(e){if("string"==typeof e)return v(e,n);var t=Object.prototype.toString.call(e).slice(8,-1);return"Object"===t&&e.constructor&&(t=e.constructor.name),"Map"===t||"Set"===t?Array.from(e):"Arguments"===t||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t)?v(e,n):void 0}}function v(e,n){(null==n||n>e.length)&&(n=e.length);for(var t=0,r=new Array(n);t<n;t++)r[t]=e[t];return r}var y=(0,e.forwardRef)((function(t,r){var o=t.value,c=t.length,i=t.validChars,y=t.placeholder,g=t.autoFocus,b=t.passwordMode,m=t.inputProps,_=t.containerProps,w=t.classNames,x=t.onChange,O=t.onFocus,S=t.onBlur,j=t.onComplete,P=d((0,e.useState)(""),2),A=P[0],k=P[1],C=d((0,e.useState)(!1),2),T=C[0],E=C[1],I=(0,e.useRef)(null);(0,e.useEffect)((function(){g&&I.current.focus()}),[g]);var N,R=function(){I.current.focus()},M=function(){return null!=o?o:A},F=function(e){var n=M();return(n.length===e||n.length===e+1&&c===e+1)&&T},D=function(e){return M().length<e},z=m.className,B=m.type,L=f(m,s),U=_.className,W=f(_,u);return n().createElement(n().Fragment,null,n().createElement("div",p({"data-testid":"container",className:a()("vi__container",w.container,U),onClick:function(){return I.current.focus()}},W),n().createElement("input",p({"aria-label":"verification input",spellCheck:!1,value:M(),onChange:function(e){var n=e.target.value.replace(/\s/g,"");RegExp("^[".concat(i,"]{0,").concat(c,"}$")).test(n)&&(x&&(null==x||x(n)),k(n),n.length===c&&(null==j||j(n)))},ref:function(e){I.current=e,"function"==typeof r?r(e):r&&(r.current=e)},className:a()("vi",z),onKeyDown:function(e){["ArrowLeft","ArrowRight","ArrowUp","ArrowDown"].includes(e.key)&&e.preventDefault()},onFocus:function(){E(!0),null==O||O()},onBlur:function(){E(!1),null==S||S()},onSelect:function(e){var n=e.target.value;e.target.setSelectionRange(n.length,n.length)},type:b?"password":B},L)),(N=Array(c),function(e){if(Array.isArray(e))return v(e)}(N)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(N)||h(N)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()).map((function(e,t){return n().createElement("div",{className:a()("vi__character",w.character,{"vi__character--selected":F(t),"vi__character--inactive":D(t)},F(t)&&w.characterSelected,D(t)&&w.characterInactive),onClick:R,id:"field-".concat(t),"data-testid":"character-".concat(t),key:t},b&&M()[t]?"*":M()[t]||y)}))),n().createElement("style",{dangerouslySetInnerHTML:{__html:l.Z}}))}));y.displayName="VerificationInput",y.propTypes={value:i().string,length:i().number,validChars:i().string,placeholder:i().string,autoFocus:i().bool,passwordMode:i().bool,inputProps:i().object,containerProps:i().object,classNames:i().shape({container:i().string,character:i().string,characterInactive:i().string,characterSelected:i().string}),onChange:i().func,onFocus:i().func,onBlur:i().func,onComplete:i().func},y.defaultProps={length:6,validChars:"A-Za-z0-9",placeholder:"·",autoFocus:!1,inputProps:{},containerProps:{},classNames:{}};const g=y})();var o=exports;for(var a in r)o[a]=r[a];r.__esModule&&Object.defineProperty(o,"__esModule",{value:!0})})();
{
"name": "react-verification-input",
"version": "4.0.0-beta.0",
"version": "4.0.0-beta.1",
"main": "lib/index.js",

@@ -5,0 +5,0 @@ "types": "lib/index.d.ts",

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc