antd-input-otp/dist/index.cjs.js

An OTP Input Component based on Ant Design Component Library for React.

"use strict";var e=require("react/jsx-runtime"),t=require("react"),n=require("antd"),r=function(){return r=Object.assign||function(e){for(var t,n=1,r=arguments.length;n<r;n++)for(var a in t=arguments[n])Object.prototype.hasOwnProperty.call(t,a)&&(e[a]=t[a]);return e},r.apply(this,arguments)};function a(e,t){var n={};for(var r in e)Object.prototype.hasOwnProperty.call(e,r)&&t.indexOf(r)<0&&(n[r]=e[r]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var a=0;for(r=Object.getOwnPropertySymbols(e);a<r.length;a++)t.indexOf(r[a])<0&&Object.prototype.propertyIsEnumerable.call(e,r[a])&&(n[r[a]]=e[r[a]])}return n}function l(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e}"function"==typeof SuppressedError&&SuppressedError;var u,i={exports:{}};
/*!
	Copyright (c) 2018 Jed Watson.
	Licensed under the MIT License (MIT), see
	http://jedwatson.github.io/classnames
*/u=i,function(){var e={}.hasOwnProperty;function t(){for(var n=[],r=0;r<arguments.length;r++){var a=arguments[r];if(a){var l=typeof a;if("string"===l||"number"===l)n.push(a);else if(Array.isArray(a)){if(a.length){var u=t.apply(null,a);u&&n.push(u)}}else if("object"===l){if(a.toString!==Object.prototype.toString&&!a.toString.toString().includes("[native code]")){n.push(a.toString());continue}for(var i in a)e.call(a,i)&&a[i]&&n.push(i)}}}return n.join(" ")}u.exports?(t.default=t,u.exports=t):window.classNames=t}();var o=l(i.exports),s={alphabet:/[^A-Za-z]/,"alphabet-numeric":/[\W_]/,"alphabet-symbol":/[\d]|[^\S]/,numeric:/\D/,"numeric-symbol":/[A-Za-z]|[^\S]/,symbol:/[^\W_]|[^\S]/},p=function(e){var t=e.currentTarget;return{nextTarget:t.nextElementSibling,prevTarget:t.previousElementSibling}},c=function(e){var t=null==e?void 0:e.target;return Array.from(null==t?void 0:t.parentNode.children)},d=function(e){var t=null==e?void 0:e.target;return c(e).indexOf(t)},f=function(e){var t=e.inputType,n=e.inputRegex,r=e.value,a="string"==typeof n?new RegExp(n):n,l="custom"===t&&n&&!a.test(r),u="all"!==t&&"custom"!==t&&s[t].test(r);return Boolean(l||u)},v=function(e,t){var n;(n=e)&&"submit"in n?e.submit():null==e||e(t)},y=function(e){e.currentTarget.select()},h=function(e){var n=e.autoSubmit,r=e.fieldLength,a=e.inputRegex,l=e.inputType,u=e.isPreserveFocus,i=e.onChange,o=e.value,s=t.useState([]),h=s[0],g=s[1],m=t.useCallback((function(e,t){var n=i?o:h,r=d(e),a=function(e,t,n){if(n||2===arguments.length)for(var r,a=0,l=t.length;a<l;a++)!r&&a in t||(r||(r=Array.prototype.slice.call(t,0,a)),r[a]=t[a]);return e.concat(r||Array.prototype.slice.call(t))}([],null!=n?n:[],!0);return a[r]=e.currentTarget.value,(!n||n.join("").length<1)&&g([]),null==t||t(a),i?i(a):g(a),a}),[i,h,o]),b=t.useCallback((function(e){var t=p(e),a=t.nextTarget,l=t.prevTarget,i=e.currentTarget,o=m(e),s=o.join("").length===r,c=e.nativeEvent.inputType,d="insertText"===c,f=d&&!a;return f&&n&&s&&v(n,o),f&&!u?i.blur():d?null==a?void 0:a.select():"deleteContentBackward"===c?null==l?void 0:l.select():void 0}),[n,r,m,u]),x=t.useCallback((function(e){if("Enter"!==(null==e?void 0:e.key)&&!(null==e?void 0:e.metaKey))return f({inputRegex:a,inputType:l,value:null==e?void 0:e.key})?e.preventDefault():void 0}),[a,l]),w=t.useCallback((function(e){var t=p(e),n=t.nextTarget,r=t.prevTarget;switch(e.key){case"Backspace":if(e.currentTarget.value)break;case"ArrowLeft":e.preventDefault(),null==r||r.select();break;case"ArrowRight":e.preventDefault(),null==n||n.select()}}),[]),S=t.useCallback((function(e){e.preventDefault();var t=d(e),u=c(e),i=e.clipboardData.getData("text");if(!f({inputRegex:a,inputType:l,value:i})){var o=i.split("").slice(0,r-t),s=m(e,function(e,t,n){return function(r){(!r||r.length<1)&&(r=Array(n).fill(""));for(var a=0;a<n;a++)t[a]&&(r[a+e]=t[a]);return r}}(t,o,r)),p=o.length+t,y=u[p]||u[p-1];y&&(p===t?y.select():y.focus());var h=s.join("").length===r;n&&h&&v(n,s)}}),[a,l,r,m,n]);return{handleFocus:y,handleInput:b,handleKeyDown:w,handleKeyPress:x,handlePaste:S,otp:h}};!function(e,t){void 0===t&&(t={});var n=t.insertAt;if(e&&"undefined"!=typeof document){var r=document.head||document.getElementsByTagName("head")[0],a=document.createElement("style");a.type="text/css","top"===n&&r.firstChild?r.insertBefore(a,r.firstChild):r.appendChild(a),a.styleSheet?a.styleSheet.cssText=e:a.appendChild(document.createTextNode(e))}}(".input-otp{display:flex;gap:1em;justify-content:center}.input-otp__field{font-size:20px;font-weight:700;height:64px;max-width:44px;text-align:center;width:100%}");var g=t.memo(t.forwardRef((function(t,l){var u=t.className,i=a(t,["className"]);return e.jsx(n.Input,r({className:o("input-otp__field",u),ref:l,maxLength:1},i))}))),m=t.forwardRef((function(t,n){var l=t.autoFocus,u=void 0!==l&&l,i=t.autoSubmit,s=void 0===i?null:i,p=t.disabled,c=t.id,d=t.inputClassName,f=t.inputRef,v=void 0===f?null:f,y=t.inputRegex,m=t.inputStyle,b=t.inputType,x=void 0===b?"all":b,w=t.isPreserveFocus,S=void 0!==w&&w,T=t.length,j=void 0===T?6:T,C=t.placeholder,O=void 0===C?"":C,P=t.onChange,N=t.value,R=t.wrapperClassName,k=t.wrapperStyle,A=a(t,["autoFocus","autoSubmit","disabled","id","inputClassName","inputRef","inputRegex","inputStyle","inputType","isPreserveFocus","length","placeholder","onChange","value","wrapperClassName","wrapperStyle"]),D=function(e){return e<2?2:e>16?16:e}(j),E=h({autoSubmit:s,fieldLength:D,inputRegex:y,inputType:x,isPreserveFocus:S,onChange:P,value:N}),F=E.handleFocus,_=E.handleInput,K=E.handleKeyDown,I=E.handleKeyPress,B=E.handlePaste,L=E.otp;return e.jsx("div",{className:o("input-otp",R),id:c,ref:n,style:k,children:Array(D).fill(null).map((function(t,n){return e.jsx(g,r({autoFocus:u&&0===n,className:d,disabled:p,onFocus:F,onInput:_,onKeyDown:K,onKeyPress:I,onPaste:B,ref:function(e){v&&(null===v.current&&(v.current=[]),v.current[n]=e)},style:m,value:(null==N?void 0:N[n])||(null==L?void 0:L[n]),placeholder:1===(null==O?void 0:O.length)?O:null==O?void 0:O[n]},A),"input-otp-".concat(n))}))})}));exports.InputOTP=m;
//# sourceMappingURL=index.cjs.js.map