@dgshahr/ui-kit 0.0.39 → 0.0.40
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/dist/Drawer/index.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { CSSProperties, FC,
|
|
2
|
-
interface DrawerProps {
|
|
1
|
+
import { CSSProperties, FC, ReactNode } from 'react';
|
|
2
|
+
export interface DrawerProps {
|
|
3
3
|
open: boolean;
|
|
4
4
|
onClose: () => void;
|
|
5
5
|
persist?: boolean;
|
|
@@ -20,7 +20,8 @@ interface DrawerProps {
|
|
|
20
20
|
element?: ReactNode;
|
|
21
21
|
containerClassName?: string;
|
|
22
22
|
};
|
|
23
|
+
children?: ReactNode | undefined;
|
|
23
24
|
}
|
|
24
|
-
declare const Drawer: FC<
|
|
25
|
+
declare const Drawer: FC<DrawerProps>;
|
|
25
26
|
export default Drawer;
|
|
26
27
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/Drawer/index.tsx"],"names":[],"mappings":"AAGA,OAAO,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/Drawer/index.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAuB,KAAK,aAAa,EAAE,KAAK,EAAE,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AACzF,OAAO,kBAAkB,CAAC;AAM1B,MAAM,WAAW,WAAW;IAC1B,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,QAAQ,GAAG,KAAK,GAAG,OAAO,GAAG,MAAM,CAAC;IAC/C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,KAAK,CAAC,EAAE,aAAa,CAAC,OAAO,CAAC,CAAC;IAC/B,MAAM,CAAC,EAAE;QACP,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,WAAW,CAAC,EAAE,MAAM,CAAC;QACrB,aAAa,CAAC,EAAE,OAAO,CAAC;QACxB,aAAa,CAAC,EAAE,SAAS,CAAC;QAC1B,kBAAkB,CAAC,EAAE,MAAM,CAAC;KAC7B,CAAC;IACF,MAAM,CAAC,EAAE;QACP,OAAO,CAAC,EAAE,SAAS,CAAC;QACpB,kBAAkB,CAAC,EAAE,MAAM,CAAC;KAC7B,CAAC;IACF,QAAQ,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;CAClC;AAoBD,QAAA,MAAM,MAAM,EAAE,EAAE,CAAC,WAAW,CAmI3B,CAAC;AAEF,eAAe,MAAM,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";"use strict";require('../../assets/styles.css');const l=require("react/jsx-runtime"),
|
|
1
|
+
"use client";"use strict";require('../../assets/styles.css');const l=require("react/jsx-runtime"),d=require("../../clsx-C11secjj.cjs"),q=require("react"),E=require("../Input/index.cjs"),h=require("../../TextFieldWrapper-BbzQMKCb.cjs");;/* empty css */const I=k=>{const{inputsNumber:u=4,onChange:a,onEnd:r,className:m,inputsContainerClassName:y,labelContent:p,hintMessage:f,errorMessage:c,isError:j,value:n}=k;function o(s){const e=document.getElementById(`dgs-ui-kit-otp-input-${s}`);e?.focus(),e?.select()}function C(s,e){const t=[s.code,s.key];if(t.includes("Backspace")||t.includes("Delete")){const i=n.split("");i[e]="",e!==0&&(i[e-1]="",o(e-1)),a(i.join(""))}else t.includes("ArrowLeft")?o(e-1):t.includes("ArrowRight")&&o(e+1)}function w(s,e){const t=s.currentTarget.value,i=n.split("");t.length>1?t.split("").forEach((N,g)=>{g<u&&(i[g]=N)}):i[e]=t,a(i.join("")),e+1!==u&&t&&o(e+1)}return q.useEffect(()=>{n.length===u&&typeof r=="function"&&r(n)},[n,u,r]),l.jsxs("div",{className:d.clsx("dgs-ui-kit-space-y-2",m),children:[p?l.jsx(h.FieldLabel,{labelContent:p}):null,l.jsx("div",{className:d.clsx("dgs-ui-kit-flex dgs-ui-kit-items-center dgs-ui-kit-gap-2 [direction:ltr]",y),children:Array.from(Array(u).keys()).map((s,e)=>l.jsx(E,{containerClassName:"dgs-ui-kit-w-12 dgs-ui-kit-h-12 dgs-ui-kit-p-0",className:"dgs-ui-kit-w-full dgs-ui-kit-h-full !dgs-ui-kit-text-center placeholder:!dgs-ui-kit-text-center",placeholder:"-",type:"tel",autoFocus:e===0,onChange:t=>w(t,e),onKeyUp:t=>C(t,e),id:`dgs-ui-kit-otp-input-${e}`,value:n[e]||"",showMaxLength:!1,isError:!!c||j,autoComplete:"off",maxLength:1},s))}),c||f?l.jsx(h.FieldBottomInfo,{errorMessage:c,hintMessage:f}):null]})};module.exports=I;
|
|
@@ -2,11 +2,11 @@ import { FC } from 'react';
|
|
|
2
2
|
import { TextFieldBaseProps } from '../Wrappers/TextFieldWrapper/TextFieldWrapper';
|
|
3
3
|
export interface OtpInputProps extends Pick<TextFieldBaseProps, 'labelContent' | 'errorMessage' | 'isError' | 'hintMessage'> {
|
|
4
4
|
inputsNumber?: number;
|
|
5
|
-
onChange
|
|
5
|
+
onChange: (value: string) => void;
|
|
6
6
|
onEnd?: (value: string) => void;
|
|
7
7
|
className?: string;
|
|
8
8
|
inputsContainerClassName?: string;
|
|
9
|
-
value
|
|
9
|
+
value: string;
|
|
10
10
|
}
|
|
11
11
|
declare const OtpInput: FC<OtpInputProps>;
|
|
12
12
|
export default OtpInput;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Form/OtpInput/index.tsx"],"names":[],"mappings":"AAEA,OAAO,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Form/OtpInput/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAA+B,KAAK,EAAE,EAAsB,MAAM,OAAO,CAAC;AAIjF,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,+CAA+C,CAAC;AACxF,OAAO,kBAAkB,CAAC;AAE1B,MAAM,WAAW,aACf,SAAQ,IAAI,CAAC,kBAAkB,EAAE,cAAc,GAAG,cAAc,GAAG,SAAS,GAAG,aAAa,CAAC;IAC7F,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,KAAK,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,wBAAwB,CAAC,EAAE,MAAM,CAAC;IAClC,KAAK,EAAE,MAAM,CAAC;CACf;AAED,QAAA,MAAM,QAAQ,EAAE,EAAE,CAAC,aAAa,CAoG/B,CAAC;AAEF,eAAe,QAAQ,CAAC"}
|
|
@@ -1,57 +1,53 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import { jsxs as E, jsx as
|
|
3
|
-
import { c as
|
|
4
|
-
import {
|
|
5
|
-
import
|
|
6
|
-
import { F, a as A } from "../../TextFieldWrapper-D9d-4wo1.js";
|
|
2
|
+
import { jsxs as E, jsx as u } from "react/jsx-runtime";
|
|
3
|
+
import { c as m } from "../../clsx-OuTLNxxd.js";
|
|
4
|
+
import { useEffect as I } from "react";
|
|
5
|
+
import v from "../Input/index.js";
|
|
6
|
+
import { F as j, a as A } from "../../TextFieldWrapper-D9d-4wo1.js";
|
|
7
7
|
import '../../assets/styles.css';/* empty css */
|
|
8
|
-
const
|
|
8
|
+
const K = (d) => {
|
|
9
9
|
const {
|
|
10
|
-
inputsNumber:
|
|
11
|
-
onChange:
|
|
10
|
+
inputsNumber: n = 4,
|
|
11
|
+
onChange: c,
|
|
12
12
|
onEnd: a,
|
|
13
|
-
className:
|
|
14
|
-
inputsContainerClassName:
|
|
15
|
-
labelContent:
|
|
16
|
-
hintMessage:
|
|
17
|
-
errorMessage:
|
|
18
|
-
isError:
|
|
13
|
+
className: h,
|
|
14
|
+
inputsContainerClassName: k,
|
|
15
|
+
labelContent: p,
|
|
16
|
+
hintMessage: f,
|
|
17
|
+
errorMessage: r,
|
|
18
|
+
isError: y,
|
|
19
19
|
value: o
|
|
20
|
-
} =
|
|
21
|
-
function
|
|
22
|
-
const t = document.getElementById(`dgs-ui-kit-otp-input-${
|
|
20
|
+
} = d;
|
|
21
|
+
function l(s) {
|
|
22
|
+
const t = document.getElementById(`dgs-ui-kit-otp-input-${s}`);
|
|
23
23
|
t?.focus(), t?.select();
|
|
24
24
|
}
|
|
25
|
-
function
|
|
26
|
-
const e = [
|
|
25
|
+
function C(s, t) {
|
|
26
|
+
const e = [s.code, s.key];
|
|
27
27
|
if (e.includes("Backspace") || e.includes("Delete")) {
|
|
28
|
-
const
|
|
29
|
-
|
|
30
|
-
} else e.includes("ArrowLeft") ?
|
|
31
|
-
e.includes(c[t]) && n(t);
|
|
28
|
+
const i = o.split("");
|
|
29
|
+
i[t] = "", t !== 0 && (i[t - 1] = "", l(t - 1)), c(i.join(""));
|
|
30
|
+
} else e.includes("ArrowLeft") ? l(t - 1) : e.includes("ArrowRight") && l(t + 1);
|
|
32
31
|
}
|
|
33
|
-
function w(
|
|
34
|
-
const e =
|
|
35
|
-
e.length > 1 ? e.split("").forEach((
|
|
32
|
+
function w(s, t) {
|
|
33
|
+
const e = s.currentTarget.value, i = o.split("");
|
|
34
|
+
e.length > 1 ? e.split("").forEach((N, g) => {
|
|
35
|
+
g < n && (i[g] = N);
|
|
36
|
+
}) : i[t] = e, c(i.join("")), t + 1 !== n && e && l(t + 1);
|
|
36
37
|
}
|
|
37
|
-
return
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
n(o.length), t && typeof a == "function" && a(o);
|
|
43
|
-
}
|
|
44
|
-
}, [o]), /* @__PURE__ */ E("div", { className: h("dgs-ui-kit-space-y-2", y), children: [
|
|
45
|
-
m ? /* @__PURE__ */ r(F, { labelContent: m }) : null,
|
|
46
|
-
/* @__PURE__ */ r(
|
|
38
|
+
return I(() => {
|
|
39
|
+
o.length === n && typeof a == "function" && a(o);
|
|
40
|
+
}, [o, n, a]), /* @__PURE__ */ E("div", { className: m("dgs-ui-kit-space-y-2", h), children: [
|
|
41
|
+
p ? /* @__PURE__ */ u(j, { labelContent: p }) : null,
|
|
42
|
+
/* @__PURE__ */ u(
|
|
47
43
|
"div",
|
|
48
44
|
{
|
|
49
|
-
className:
|
|
45
|
+
className: m(
|
|
50
46
|
"dgs-ui-kit-flex dgs-ui-kit-items-center dgs-ui-kit-gap-2 [direction:ltr]",
|
|
51
|
-
|
|
47
|
+
k
|
|
52
48
|
),
|
|
53
|
-
children: Array.from(Array(
|
|
54
|
-
|
|
49
|
+
children: Array.from(Array(n).keys()).map((s, t) => /* @__PURE__ */ u(
|
|
50
|
+
v,
|
|
55
51
|
{
|
|
56
52
|
containerClassName: "dgs-ui-kit-w-12 dgs-ui-kit-h-12 dgs-ui-kit-p-0",
|
|
57
53
|
className: "dgs-ui-kit-w-full dgs-ui-kit-h-full !dgs-ui-kit-text-center placeholder:!dgs-ui-kit-text-center",
|
|
@@ -59,27 +55,27 @@ const U = (k) => {
|
|
|
59
55
|
type: "tel",
|
|
60
56
|
autoFocus: t === 0,
|
|
61
57
|
onChange: (e) => w(e, t),
|
|
62
|
-
onKeyUp: (e) =>
|
|
58
|
+
onKeyUp: (e) => C(e, t),
|
|
63
59
|
id: `dgs-ui-kit-otp-input-${t}`,
|
|
64
|
-
value:
|
|
60
|
+
value: o[t] || "",
|
|
65
61
|
showMaxLength: !1,
|
|
66
|
-
isError: !!
|
|
62
|
+
isError: !!r || y,
|
|
67
63
|
autoComplete: "off",
|
|
68
64
|
maxLength: 1
|
|
69
65
|
},
|
|
70
|
-
|
|
66
|
+
s
|
|
71
67
|
))
|
|
72
68
|
}
|
|
73
69
|
),
|
|
74
|
-
|
|
70
|
+
r || f ? /* @__PURE__ */ u(
|
|
75
71
|
A,
|
|
76
72
|
{
|
|
77
|
-
errorMessage:
|
|
78
|
-
hintMessage:
|
|
73
|
+
errorMessage: r,
|
|
74
|
+
hintMessage: f
|
|
79
75
|
}
|
|
80
76
|
) : null
|
|
81
77
|
] });
|
|
82
78
|
};
|
|
83
79
|
export {
|
|
84
|
-
|
|
80
|
+
K as default
|
|
85
81
|
};
|