@dgshahr/ui-kit 1.0.8 → 1.0.9
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.
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";"use strict";require('../../assets/styles.css');const l=require("react/jsx-runtime"),m=require("../../clsx-C11secjj.cjs"),k=require("react"),
|
|
1
|
+
"use client";"use strict";require('../../assets/styles.css');const l=require("react/jsx-runtime"),m=require("../../clsx-C11secjj.cjs"),k=require("react"),q=require("../../FieldBottomInfo-CSd_EdIe.cjs"),v=require("../../TextFieldWrapper-DA0qiI_m.cjs"),w=require("../../index-BCqGGELs.cjs");;/* empty css */const F=o=>o.replace(/[۰-۹]/g,r=>String("۰۱۲۳۴۵۶۷۸۹".indexOf(r))),T=o=>{const{inputsNumber:r=4,onChange:c,onEnd:p,className:y,inputsContainerClassName:N,labelContent:g,hintMessage:d,errorMessage:a,isError:I,value:n,...j}=o,f=k.useRef(!1);function i(u){document.getElementById(`dgsuikit:otp-input-${u}`)?.focus()}function C(u,e){const t=[u.code,u.key];if(n[e]&&t.includes(n[e])){i(e+1);return}if(t.includes("Backspace")||t.includes("Delete")){const s=n.split("");s[e]="",e!==0&&i(e-1),c(s.join(""))}else t.includes("ArrowLeft")?i(e-1):t.includes("ArrowRight")&&i(e+1)}function E(u,e){const t=F(u.currentTarget.value),s=n.split("");t.length>1?t.split("").forEach((b,h)=>{h<r&&(s[h]=b)}):s[e]=t,c(s.join("")),e+1!==r&&t&&i(e+1)}return k.useEffect(()=>{n.length===r&&f.current?(f.current=!1,typeof p=="function"&&p(n)):n.length<r&&(f.current=!0)},[n]),l.jsxs("div",{className:m.clsx("dgsuikit:space-y-2",y),children:[g?l.jsx(v.FieldLabel,{labelContent:g}):null,l.jsx("div",{className:m.clsx("dgsuikit:flex dgsuikit:items-center dgsuikit:gap-2 dgsuikit:[direction:ltr]",N),children:Array.from(Array(r).keys()).map((u,e)=>l.jsx(w.Input,{containerClassName:"dgsuikit:w-12 dgsuikit:h-12 dgsuikit:p-0",className:"dgsuikit:w-full dgsuikit:h-full dgsuikit:!text-center dgsuikit:placeholder:!text-center",placeholder:"-",autoFocus:e===0,onChange:t=>E(t,e),onKeyUp:t=>C(t,e),onFocus:t=>t.currentTarget.select(),id:`dgsuikit:otp-input-${e}`,value:n[e]||"",showMaxLength:!1,isError:!!a||I,autoComplete:"off",maxLength:e===0&&!Number(n.split("")[0])?r:1,onPaste:t=>{const s=t.clipboardData.getData("text");Number(s)&&c(s)},onInput:t=>{const s=t.currentTarget;return!!(Number(s.value)&&s.value.length>1)},...j},u))}),a||d?l.jsx(q.FieldBottomInfo,{errorMessage:a,hintMessage:d}):null]})};module.exports=T;
|
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import { jsxs as
|
|
2
|
+
import { jsxs as v, jsx as o } from "react/jsx-runtime";
|
|
3
3
|
import { c as h } from "../../clsx-OuTLNxxd.js";
|
|
4
4
|
import { useRef as w, useEffect as F } from "react";
|
|
5
5
|
import { F as T } from "../../FieldBottomInfo-C_QkvgNP.js";
|
|
6
6
|
import { F as j } from "../../TextFieldWrapper-DAv2s5vj.js";
|
|
7
7
|
import { I as A } from "../../index-Cj_9z9UD.js";
|
|
8
8
|
import '../../assets/styles.css';/* empty css */
|
|
9
|
-
const B = (l) => l.replace(/[۰-۹]/g, (
|
|
9
|
+
const B = (l) => l.replace(/[۰-۹]/g, (r) => String("۰۱۲۳۴۵۶۷۸۹".indexOf(r))), U = (l) => {
|
|
10
10
|
const {
|
|
11
|
-
inputsNumber:
|
|
11
|
+
inputsNumber: r = 4,
|
|
12
12
|
onChange: a,
|
|
13
13
|
onEnd: p,
|
|
14
14
|
className: k,
|
|
@@ -18,13 +18,13 @@ const B = (l) => l.replace(/[۰-۹]/g, (i) => String("۰۱۲۳۴۵۶۷۸۹".inde
|
|
|
18
18
|
errorMessage: c,
|
|
19
19
|
isError: N,
|
|
20
20
|
value: n,
|
|
21
|
-
...
|
|
21
|
+
...C
|
|
22
22
|
} = l, f = w(!1);
|
|
23
|
-
function u(
|
|
24
|
-
document.getElementById(`dgsuikit:otp-input-${
|
|
23
|
+
function u(i) {
|
|
24
|
+
document.getElementById(`dgsuikit:otp-input-${i}`)?.focus();
|
|
25
25
|
}
|
|
26
|
-
function
|
|
27
|
-
const t = [
|
|
26
|
+
function E(i, e) {
|
|
27
|
+
const t = [i.code, i.key];
|
|
28
28
|
if (n[e] && t.includes(n[e])) {
|
|
29
29
|
u(e + 1);
|
|
30
30
|
return;
|
|
@@ -34,15 +34,15 @@ const B = (l) => l.replace(/[۰-۹]/g, (i) => String("۰۱۲۳۴۵۶۷۸۹".inde
|
|
|
34
34
|
s[e] = "", e !== 0 && u(e - 1), a(s.join(""));
|
|
35
35
|
} else t.includes("ArrowLeft") ? u(e - 1) : t.includes("ArrowRight") && u(e + 1);
|
|
36
36
|
}
|
|
37
|
-
function
|
|
38
|
-
const t = B(
|
|
39
|
-
t.length > 1 ? t.split("").forEach((
|
|
40
|
-
d <
|
|
41
|
-
}) : s[e] = t, a(s.join("")), e + 1 !==
|
|
37
|
+
function I(i, e) {
|
|
38
|
+
const t = B(i.currentTarget.value), s = n.split("");
|
|
39
|
+
t.length > 1 ? t.split("").forEach((b, d) => {
|
|
40
|
+
d < r && (s[d] = b);
|
|
41
|
+
}) : s[e] = t, a(s.join("")), e + 1 !== r && t && u(e + 1);
|
|
42
42
|
}
|
|
43
43
|
return F(() => {
|
|
44
|
-
n.length ===
|
|
45
|
-
}, [n]), /* @__PURE__ */
|
|
44
|
+
n.length === r && f.current ? (f.current = !1, typeof p == "function" && p(n)) : n.length < r && (f.current = !0);
|
|
45
|
+
}, [n]), /* @__PURE__ */ v("div", { className: h("dgsuikit:space-y-2", k), children: [
|
|
46
46
|
g ? /* @__PURE__ */ o(j, { labelContent: g }) : null,
|
|
47
47
|
/* @__PURE__ */ o(
|
|
48
48
|
"div",
|
|
@@ -51,22 +51,22 @@ const B = (l) => l.replace(/[۰-۹]/g, (i) => String("۰۱۲۳۴۵۶۷۸۹".inde
|
|
|
51
51
|
"dgsuikit:flex dgsuikit:items-center dgsuikit:gap-2 dgsuikit:[direction:ltr]",
|
|
52
52
|
y
|
|
53
53
|
),
|
|
54
|
-
children: Array.from(Array(
|
|
54
|
+
children: Array.from(Array(r).keys()).map((i, e) => /* @__PURE__ */ o(
|
|
55
55
|
A,
|
|
56
56
|
{
|
|
57
57
|
containerClassName: "dgsuikit:w-12 dgsuikit:h-12 dgsuikit:p-0",
|
|
58
58
|
className: "dgsuikit:w-full dgsuikit:h-full dgsuikit:!text-center dgsuikit:placeholder:!text-center",
|
|
59
59
|
placeholder: "-",
|
|
60
60
|
autoFocus: e === 0,
|
|
61
|
-
onChange: (t) =>
|
|
62
|
-
onKeyUp: (t) =>
|
|
61
|
+
onChange: (t) => I(t, e),
|
|
62
|
+
onKeyUp: (t) => E(t, e),
|
|
63
63
|
onFocus: (t) => t.currentTarget.select(),
|
|
64
64
|
id: `dgsuikit:otp-input-${e}`,
|
|
65
65
|
value: n[e] || "",
|
|
66
66
|
showMaxLength: !1,
|
|
67
67
|
isError: !!c || N,
|
|
68
68
|
autoComplete: "off",
|
|
69
|
-
maxLength: e === 0 && !Number(n.split("")[0]) ?
|
|
69
|
+
maxLength: e === 0 && !Number(n.split("")[0]) ? r : 1,
|
|
70
70
|
onPaste: (t) => {
|
|
71
71
|
const s = t.clipboardData.getData("text");
|
|
72
72
|
Number(s) && a(s);
|
|
@@ -75,9 +75,9 @@ const B = (l) => l.replace(/[۰-۹]/g, (i) => String("۰۱۲۳۴۵۶۷۸۹".inde
|
|
|
75
75
|
const s = t.currentTarget;
|
|
76
76
|
return !!(Number(s.value) && s.value.length > 1);
|
|
77
77
|
},
|
|
78
|
-
...
|
|
78
|
+
...C
|
|
79
79
|
},
|
|
80
|
-
|
|
80
|
+
i
|
|
81
81
|
))
|
|
82
82
|
}
|
|
83
83
|
),
|