custom-simple-otp 0.0.6 → 0.0.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +12 -1
- package/dist/index.d.ts +10 -10
- package/dist/index.js +2 -2
- package/dist/index.mjs +2 -2
- package/package.json +28 -28
package/README.md
CHANGED
|
@@ -1,6 +1,17 @@
|
|
|
1
1
|
# React OTP Input Component
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
# React OTP Input Component
|
|
4
|
+
|
|
5
|
+
<div align="center">
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
[](https://www.npmjs.com/package/custom-simple-otp)
|
|
10
|
+
[](https://bundlephobia.com/package/custom-simple-otp)
|
|
11
|
+
[](https://opensource.org/licenses/MIT)
|
|
12
|
+
[](https://www.typescriptlang.org/)
|
|
13
|
+
|
|
14
|
+
</div>
|
|
4
15
|
|
|
5
16
|
|
|
6
17
|
|
package/dist/index.d.ts
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
|
|
3
|
-
interface IOtp {
|
|
4
|
-
length: number;
|
|
5
|
-
onSubmit: (data: number) => void;
|
|
6
|
-
isDisable?: boolean;
|
|
7
|
-
}
|
|
8
|
-
declare const Otp: React.FC<IOtp>;
|
|
9
|
-
|
|
10
|
-
export { Otp };
|
|
1
|
+
import React from 'react';
|
|
2
|
+
|
|
3
|
+
interface IOtp {
|
|
4
|
+
length: number;
|
|
5
|
+
onSubmit: (data: number) => void;
|
|
6
|
+
isDisable?: boolean;
|
|
7
|
+
}
|
|
8
|
+
declare const Otp: React.FC<IOtp>;
|
|
9
|
+
|
|
10
|
+
export { Otp };
|
package/dist/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var r=require("react/jsx-runtime"),e=require("react");"function"==typeof SuppressedError&&SuppressedError;exports.Otp=function(n){var t=n.length,u=void 0===t?4:t,i=n.isDisable,o=n.onSubmit,c=e.useState(new Array(u).fill("")),l=c[0],a=c[1],s=e.useRef([]),f=function(r,e){var n,t=function(r,e,n){if(n||2===arguments.length)for(var t,u=0,i=e.length;u<i;u++)!t&&u in e||(t||(t=Array.prototype.slice.call(e,0,u)),t[u]=e[u]);return r.concat(t||Array.prototype.slice.call(e))}([],l,!0),i=r.target.value;if(!isNaN(Number(i))){t[e]=i.substring(i.length-1),a(t);var c=t.indexOf("");i&&e+1<u&&s.current[e+1]&&(null===(n=s.current[e+c===-1?1:c])||void 0===n||n.focus());var f=t.join("");f.length===u&&o(Number(f))}};return e.useEffect(function(){s.current[0]&&s.current[0].focus()},[]),r.jsx("div",{className:"otp-container",children:null==l?void 0:l.map(function(e,n){return r.jsx("input",{className:"otp-input-field",ref:function(r){s.current[n]=r},value:e,onChange:function(r){return f(r,n)},onClick:function(){return function(r){s.current[r]&&s.current[r].setSelectionRange(1,1)}(n)},onKeyDown:function(r){return function(r,e){var n,t,i;"Backspace"===r.key&&!l[e]&&e<u?null===(n=s.current[e-1])||void 0===n||n.focus():"ArrowRight"===r.key?null===(t=s.current[e+1])||void 0===t||t.focus():"ArrowLeft"===r.key&&(null===(i=s.current[e-1])||void 0===i||i.focus(),setTimeout(function(){var r;null===(r=s.current[e-1])||void 0===r||r.setSelectionRange(1,1)},0))}(r,n)},disabled:i},n)})})};
|
|
2
|
-
//# sourceMappingURL=index.js.map
|
|
1
|
+
"use strict";var r=require("react/jsx-runtime"),e=require("react");"function"==typeof SuppressedError&&SuppressedError;exports.Otp=function(n){var t=n.length,u=void 0===t?4:t,i=n.isDisable,o=n.onSubmit,c=e.useState(new Array(u).fill("")),l=c[0],a=c[1],s=e.useRef([]),f=function(r,e){var n,t=function(r,e,n){if(n||2===arguments.length)for(var t,u=0,i=e.length;u<i;u++)!t&&u in e||(t||(t=Array.prototype.slice.call(e,0,u)),t[u]=e[u]);return r.concat(t||Array.prototype.slice.call(e))}([],l,!0),i=r.target.value;if(!isNaN(Number(i))){t[e]=i.substring(i.length-1),a(t);var c=t.indexOf("");i&&e+1<u&&s.current[e+1]&&(null===(n=s.current[e+c===-1?1:c])||void 0===n||n.focus());var f=t.join("");f.length===u&&o(Number(f))}};return e.useEffect(function(){s.current[0]&&s.current[0].focus()},[]),r.jsx("div",{className:"otp-container",children:null==l?void 0:l.map(function(e,n){return r.jsx("input",{className:"otp-input-field",ref:function(r){s.current[n]=r},value:e,onChange:function(r){return f(r,n)},onClick:function(){return function(r){s.current[r]&&s.current[r].setSelectionRange(1,1)}(n)},onKeyDown:function(r){return function(r,e){var n,t,i;"Backspace"===r.key&&!l[e]&&e<u?null===(n=s.current[e-1])||void 0===n||n.focus():"ArrowRight"===r.key?null===(t=s.current[e+1])||void 0===t||t.focus():"ArrowLeft"===r.key&&(null===(i=s.current[e-1])||void 0===i||i.focus(),setTimeout(function(){var r;null===(r=s.current[e-1])||void 0===r||r.setSelectionRange(1,1)},0))}(r,n)},disabled:i},n)})})};
|
|
2
|
+
//# sourceMappingURL=index.js.map
|
package/dist/index.mjs
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsx as r}from"react/jsx-runtime";import{useState as n,useRef as e,useEffect as t}from"react";"function"==typeof SuppressedError&&SuppressedError;var o=function(o){var u=o.length,i=void 0===u?4:u,c=o.isDisable,l=o.onSubmit,a=n(new Array(i).fill("")),f=a[0],s=a[1],p=e([]),v=function(r,n){var e,t=function(r,n,e){if(e||2===arguments.length)for(var t,o=0,u=n.length;o<u;o++)!t&&o in n||(t||(t=Array.prototype.slice.call(n,0,o)),t[o]=n[o]);return r.concat(t||Array.prototype.slice.call(n))}([],f,!0),o=r.target.value;if(!isNaN(Number(o))){t[n]=o.substring(o.length-1),s(t);var u=t.indexOf("");o&&n+1<i&&p.current[n+1]&&(null===(e=p.current[n+u===-1?1:u])||void 0===e||e.focus());var c=t.join("");c.length===i&&l(Number(c))}};return t(function(){p.current[0]&&p.current[0].focus()},[]),r("div",{className:"otp-container",children:null==f?void 0:f.map(function(n,e){return r("input",{className:"otp-input-field",ref:function(r){p.current[e]=r},value:n,onChange:function(r){return v(r,e)},onClick:function(){return function(r){p.current[r]&&p.current[r].setSelectionRange(1,1)}(e)},onKeyDown:function(r){return function(r,n){var e,t,o;"Backspace"===r.key&&!f[n]&&n<i?null===(e=p.current[n-1])||void 0===e||e.focus():"ArrowRight"===r.key?null===(t=p.current[n+1])||void 0===t||t.focus():"ArrowLeft"===r.key&&(null===(o=p.current[n-1])||void 0===o||o.focus(),setTimeout(function(){var r;null===(r=p.current[n-1])||void 0===r||r.setSelectionRange(1,1)},0))}(r,e)},disabled:c},e)})})};export{o as Otp};
|
|
2
|
-
//# sourceMappingURL=index.mjs.map
|
|
1
|
+
import{jsx as r}from"react/jsx-runtime";import{useState as n,useRef as e,useEffect as t}from"react";"function"==typeof SuppressedError&&SuppressedError;var o=function(o){var u=o.length,i=void 0===u?4:u,c=o.isDisable,l=o.onSubmit,a=n(new Array(i).fill("")),f=a[0],s=a[1],p=e([]),v=function(r,n){var e,t=function(r,n,e){if(e||2===arguments.length)for(var t,o=0,u=n.length;o<u;o++)!t&&o in n||(t||(t=Array.prototype.slice.call(n,0,o)),t[o]=n[o]);return r.concat(t||Array.prototype.slice.call(n))}([],f,!0),o=r.target.value;if(!isNaN(Number(o))){t[n]=o.substring(o.length-1),s(t);var u=t.indexOf("");o&&n+1<i&&p.current[n+1]&&(null===(e=p.current[n+u===-1?1:u])||void 0===e||e.focus());var c=t.join("");c.length===i&&l(Number(c))}};return t(function(){p.current[0]&&p.current[0].focus()},[]),r("div",{className:"otp-container",children:null==f?void 0:f.map(function(n,e){return r("input",{className:"otp-input-field",ref:function(r){p.current[e]=r},value:n,onChange:function(r){return v(r,e)},onClick:function(){return function(r){p.current[r]&&p.current[r].setSelectionRange(1,1)}(e)},onKeyDown:function(r){return function(r,n){var e,t,o;"Backspace"===r.key&&!f[n]&&n<i?null===(e=p.current[n-1])||void 0===e||e.focus():"ArrowRight"===r.key?null===(t=p.current[n+1])||void 0===t||t.focus():"ArrowLeft"===r.key&&(null===(o=p.current[n-1])||void 0===o||o.focus(),setTimeout(function(){var r;null===(r=p.current[n-1])||void 0===r||r.setSelectionRange(1,1)},0))}(r,e)},disabled:c},e)})})};export{o as Otp};
|
|
2
|
+
//# sourceMappingURL=index.mjs.map
|
package/package.json
CHANGED
|
@@ -1,28 +1,28 @@
|
|
|
1
|
-
{
|
|
2
|
-
"name": "custom-simple-otp",
|
|
3
|
-
"version": "0.0.
|
|
4
|
-
"description": "custom multi input otp",
|
|
5
|
-
"main": "dist/index.js",
|
|
6
|
-
"module": "dist/index.mjs",
|
|
7
|
-
"types": "dist/index.d.ts",
|
|
8
|
-
"scripts": {
|
|
9
|
-
"test": "echo \"Error: no test specified\" && exit 1",
|
|
10
|
-
"rollup": "rollup -c --bundleConfigAsCjs"
|
|
11
|
-
},
|
|
12
|
-
"author": "",
|
|
13
|
-
"license": "ISC",
|
|
14
|
-
"devDependencies": {
|
|
15
|
-
"tslib": "^2.8.1",
|
|
16
|
-
"typescript": "^5.9.3"
|
|
17
|
-
},
|
|
18
|
-
"dependencies": {
|
|
19
|
-
"@rollup/plugin-commonjs": "^29.0.0",
|
|
20
|
-
"@rollup/plugin-node-resolve": "^16.0.3",
|
|
21
|
-
"@rollup/plugin-terser": "^0.4.4",
|
|
22
|
-
"@rollup/plugin-typescript": "^12.3.0",
|
|
23
|
-
"@types/react": "^19.2.9",
|
|
24
|
-
"rollup-plugin-dts": "^6.3.0",
|
|
25
|
-
"rollup-plugin-peer-deps-external": "^2.2.4",
|
|
26
|
-
"rollup-plugin-postcss": "^4.0.2"
|
|
27
|
-
}
|
|
28
|
-
}
|
|
1
|
+
{
|
|
2
|
+
"name": "custom-simple-otp",
|
|
3
|
+
"version": "0.0.8",
|
|
4
|
+
"description": "custom multi input otp",
|
|
5
|
+
"main": "dist/index.js",
|
|
6
|
+
"module": "dist/index.mjs",
|
|
7
|
+
"types": "dist/index.d.ts",
|
|
8
|
+
"scripts": {
|
|
9
|
+
"test": "echo \"Error: no test specified\" && exit 1",
|
|
10
|
+
"rollup": "rollup -c --bundleConfigAsCjs"
|
|
11
|
+
},
|
|
12
|
+
"author": "",
|
|
13
|
+
"license": "ISC",
|
|
14
|
+
"devDependencies": {
|
|
15
|
+
"tslib": "^2.8.1",
|
|
16
|
+
"typescript": "^5.9.3"
|
|
17
|
+
},
|
|
18
|
+
"dependencies": {
|
|
19
|
+
"@rollup/plugin-commonjs": "^29.0.0",
|
|
20
|
+
"@rollup/plugin-node-resolve": "^16.0.3",
|
|
21
|
+
"@rollup/plugin-terser": "^0.4.4",
|
|
22
|
+
"@rollup/plugin-typescript": "^12.3.0",
|
|
23
|
+
"@types/react": "^19.2.9",
|
|
24
|
+
"rollup-plugin-dts": "^6.3.0",
|
|
25
|
+
"rollup-plugin-peer-deps-external": "^2.2.4",
|
|
26
|
+
"rollup-plugin-postcss": "^4.0.2"
|
|
27
|
+
}
|
|
28
|
+
}
|