lawgic-dev-kit 0.23.6 → 0.23.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/dist/components/atoms/CountryInput/CountryInput.js +37 -37
- package/dist/components/atoms/CountrySelectInput/CountryDropdown.js +21 -21
- package/dist/components/atoms/PasswordInput/PasswordInput.js +10 -10
- package/dist/components/atoms/PhoneInput/PhoneInput.js +43 -43
- package/dist/components/atoms/UncontrolledTextInput/UncontrolledTextInput.js +15 -15
- package/dist/lawgic-dev-kit.umd.js +22 -22
- package/package.json +1 -1
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { j as t } from "../../../_virtual/jsx-runtime.js";
|
|
2
|
-
import { useState as b, useRef as w, useEffect as
|
|
2
|
+
import { useState as b, useRef as w, useEffect as _ } from "react";
|
|
3
3
|
import { useController as se } from "react-hook-form";
|
|
4
4
|
import { useFloating as re, useClick as le, useDismiss as ne, useInteractions as ae, useTransitionStyles as ie } from "../../../node_modules/@floating-ui/react/dist/floating-ui.react.js";
|
|
5
5
|
import { useTheme as ce } from "../../../hooks/useTheme.js";
|
|
@@ -9,22 +9,22 @@ import { offset as ue, flip as me, shift as fe, size as xe, arrow as he } from "
|
|
|
9
9
|
const Le = ({
|
|
10
10
|
countries: v = de,
|
|
11
11
|
name: C,
|
|
12
|
-
control:
|
|
13
|
-
label:
|
|
14
|
-
placeholder:
|
|
12
|
+
control: z,
|
|
13
|
+
label: F = "select_a_country",
|
|
14
|
+
placeholder: M = "type_to_search",
|
|
15
15
|
language: p = "en",
|
|
16
|
-
className:
|
|
17
|
-
translateKey:
|
|
16
|
+
className: D = "",
|
|
17
|
+
translateKey: A
|
|
18
18
|
}) => {
|
|
19
|
-
var
|
|
20
|
-
const { t: r } = ce(), { field: l, fieldState:
|
|
19
|
+
var I, R, B;
|
|
20
|
+
const { t: r } = ce(), { field: l, fieldState: Y } = se({
|
|
21
21
|
name: C,
|
|
22
|
-
control:
|
|
22
|
+
control: z,
|
|
23
23
|
rules: { validate: {} },
|
|
24
24
|
defaultValue: null
|
|
25
25
|
}), [n, u] = b(!1), [c, j] = b(""), [o, S] = b(
|
|
26
26
|
l.value || null
|
|
27
|
-
), m = w(null), y = w(null), f = w(null), { x:
|
|
27
|
+
), m = w(null), y = w(null), f = w(null), { x: H, y: U, strategy: V, refs: N, context: x, placement: W, middlewareData: L } = re({
|
|
28
28
|
open: n,
|
|
29
29
|
onOpenChange: u,
|
|
30
30
|
middleware: [
|
|
@@ -43,10 +43,10 @@ const Le = ({
|
|
|
43
43
|
],
|
|
44
44
|
placement: "bottom-start",
|
|
45
45
|
whileElementsMounted: pe
|
|
46
|
-
}),
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
]), { isMounted: $, styles:
|
|
46
|
+
}), X = le(x), q = ne(x), { getReferenceProps: G, getFloatingProps: J } = ae([
|
|
47
|
+
X,
|
|
48
|
+
q
|
|
49
|
+
]), { isMounted: $, styles: K } = ie(x, {
|
|
50
50
|
duration: {
|
|
51
51
|
open: 200,
|
|
52
52
|
close: 150
|
|
@@ -59,21 +59,21 @@ const Le = ({
|
|
|
59
59
|
if (!c.trim()) return !0;
|
|
60
60
|
const s = p === "es" && e.labelES ? e.labelES.toLowerCase() : e.label.toLowerCase(), i = e.code ? e.code.toLowerCase() : "";
|
|
61
61
|
return s.includes(c.toLowerCase()) || i.includes(c.toLowerCase());
|
|
62
|
-
}),
|
|
62
|
+
}), Q = (e) => {
|
|
63
63
|
S(e), u(!1), j(""), l.onChange(e);
|
|
64
|
-
},
|
|
64
|
+
}, Z = () => {
|
|
65
65
|
u(!n), !n && m.current && setTimeout(() => {
|
|
66
66
|
var e;
|
|
67
67
|
(e = m.current) == null || e.focus();
|
|
68
68
|
}, 100);
|
|
69
|
-
},
|
|
69
|
+
}, ee = () => {
|
|
70
70
|
setTimeout(() => {
|
|
71
71
|
n || l.onBlur();
|
|
72
72
|
}, 200);
|
|
73
73
|
};
|
|
74
|
-
|
|
74
|
+
_(() => {
|
|
75
75
|
S(l.value);
|
|
76
|
-
}, [l.value]),
|
|
76
|
+
}, [l.value]), _(() => {
|
|
77
77
|
const e = (s) => {
|
|
78
78
|
f.current && !f.current.contains(s.target) && l.onBlur();
|
|
79
79
|
};
|
|
@@ -84,26 +84,26 @@ const Le = ({
|
|
|
84
84
|
const h = (e) => {
|
|
85
85
|
var s;
|
|
86
86
|
return e ? e.codeISO2 ? e.codeISO2.toLowerCase() : ((s = e.code) == null ? void 0 : s.toLowerCase()) || "" : "";
|
|
87
|
-
}, T = (
|
|
87
|
+
}, T = (I = L.arrow) == null ? void 0 : I.x, k = (R = L.arrow) == null ? void 0 : R.y, a = {
|
|
88
88
|
top: "bottom",
|
|
89
89
|
right: "left",
|
|
90
90
|
bottom: "top",
|
|
91
91
|
left: "right"
|
|
92
|
-
}[
|
|
93
|
-
onClick:
|
|
94
|
-
onBlur:
|
|
95
|
-
}),
|
|
92
|
+
}[W.split("-")[0]], te = G({
|
|
93
|
+
onClick: Z,
|
|
94
|
+
onBlur: ee
|
|
95
|
+
}), O = r(F), oe = r(M), d = (B = Y.error) == null ? void 0 : B.message;
|
|
96
96
|
return /* @__PURE__ */ t.jsxs(
|
|
97
97
|
"div",
|
|
98
98
|
{
|
|
99
99
|
ref: f,
|
|
100
|
-
className: `w-full relative flex flex-col gap-8 ${
|
|
100
|
+
className: `w-full relative flex flex-col gap-8 ${D}`,
|
|
101
101
|
children: [
|
|
102
|
-
/* @__PURE__ */ t.jsx(
|
|
102
|
+
O && /* @__PURE__ */ t.jsx(
|
|
103
103
|
"label",
|
|
104
104
|
{
|
|
105
105
|
className: `text-gray-600 font-600 group ${d && "!text-red-500"} text-label`,
|
|
106
|
-
children:
|
|
106
|
+
children: O
|
|
107
107
|
}
|
|
108
108
|
),
|
|
109
109
|
/* @__PURE__ */ t.jsxs(
|
|
@@ -111,7 +111,7 @@ const Le = ({
|
|
|
111
111
|
{
|
|
112
112
|
ref: N.setReference,
|
|
113
113
|
className: `flex items-center justify-between bg-light rounded-full p-16 cursor-pointer border transition-all duration-200 hover:border-blue-400 ${d && "border-red-500 hover:border-red-600"} ${$ ? "border-blue-400" : "border-blue-100"}`,
|
|
114
|
-
...
|
|
114
|
+
...te,
|
|
115
115
|
tabIndex: 0,
|
|
116
116
|
children: [
|
|
117
117
|
o != null && o.code ? /* @__PURE__ */ t.jsxs("div", { className: "flex items-center w-full gap-10", children: [
|
|
@@ -160,19 +160,19 @@ const Le = ({
|
|
|
160
160
|
]
|
|
161
161
|
}
|
|
162
162
|
),
|
|
163
|
-
d && /* @__PURE__ */ t.jsx("p", { className: "mt-1 text-sm text-red-600", children: r(d, { x: r(
|
|
163
|
+
d && /* @__PURE__ */ t.jsx("p", { className: "mt-1 text-sm text-red-600", children: r(d, { x: r(A || "") || r(C) }) }),
|
|
164
164
|
$ && /* @__PURE__ */ t.jsxs(
|
|
165
165
|
"div",
|
|
166
166
|
{
|
|
167
167
|
ref: N.setFloating,
|
|
168
168
|
style: {
|
|
169
|
-
position:
|
|
170
|
-
top:
|
|
171
|
-
left:
|
|
172
|
-
...
|
|
169
|
+
position: V,
|
|
170
|
+
top: U ?? 0,
|
|
171
|
+
left: H ?? 0,
|
|
172
|
+
...K
|
|
173
173
|
},
|
|
174
174
|
className: "z-10 w-full bg-white border border-blue-400 rounded-3xl shadow-lg overflow-auto",
|
|
175
|
-
...
|
|
175
|
+
...J(),
|
|
176
176
|
children: [
|
|
177
177
|
/* @__PURE__ */ t.jsx(
|
|
178
178
|
"div",
|
|
@@ -209,14 +209,14 @@ const Le = ({
|
|
|
209
209
|
}
|
|
210
210
|
) }),
|
|
211
211
|
/* @__PURE__ */ t.jsx("div", { children: E.length > 0 ? /* @__PURE__ */ t.jsx("ul", { className: "flex flex-col", children: E.map((e, s) => {
|
|
212
|
-
var
|
|
213
|
-
const i = e.codeISO2 ? e.codeISO2.toLowerCase() : ((
|
|
212
|
+
var P;
|
|
213
|
+
const i = e.codeISO2 ? e.codeISO2.toLowerCase() : ((P = e.code) == null ? void 0 : P.toLowerCase()) || "";
|
|
214
214
|
return /* @__PURE__ */ t.jsxs(
|
|
215
215
|
"li",
|
|
216
216
|
{
|
|
217
217
|
className: "flex items-center gap-10 px-16 py-8 transition-all duration-200 hover:bg-blue-100/50 cursor-pointer",
|
|
218
218
|
onClick: (g) => {
|
|
219
|
-
g.stopPropagation(),
|
|
219
|
+
g.stopPropagation(), Q(e);
|
|
220
220
|
},
|
|
221
221
|
children: [
|
|
222
222
|
i && /* @__PURE__ */ t.jsx(
|
|
@@ -8,26 +8,26 @@ import { offset as se, flip as re, shift as le, size as ne, arrow as ae } from "
|
|
|
8
8
|
const ge = ({
|
|
9
9
|
countries: p,
|
|
10
10
|
name: a,
|
|
11
|
-
control:
|
|
12
|
-
label:
|
|
11
|
+
control: x,
|
|
12
|
+
label: m = "select_a_country",
|
|
13
13
|
placeholder: g = "type_to_search",
|
|
14
14
|
language: i = "en",
|
|
15
15
|
className: l = ""
|
|
16
16
|
}) => {
|
|
17
|
-
const { t:
|
|
17
|
+
const { t: f } = D();
|
|
18
18
|
return /* @__PURE__ */ t.jsx(
|
|
19
19
|
K,
|
|
20
20
|
{
|
|
21
21
|
name: a,
|
|
22
|
-
control:
|
|
23
|
-
render: ({ field: { onChange:
|
|
22
|
+
control: x,
|
|
23
|
+
render: ({ field: { onChange: h, value: n }, fieldState: { error: r } }) => /* @__PURE__ */ t.jsx(
|
|
24
24
|
ie,
|
|
25
25
|
{
|
|
26
26
|
countries: p,
|
|
27
27
|
value: n,
|
|
28
|
-
onChange:
|
|
29
|
-
label: m
|
|
30
|
-
placeholder:
|
|
28
|
+
onChange: h,
|
|
29
|
+
label: f(m),
|
|
30
|
+
placeholder: f(g),
|
|
31
31
|
language: i,
|
|
32
32
|
error: r == null ? void 0 : r.message,
|
|
33
33
|
className: l
|
|
@@ -38,15 +38,15 @@ const ge = ({
|
|
|
38
38
|
}, ie = ({
|
|
39
39
|
countries: p,
|
|
40
40
|
value: a,
|
|
41
|
-
onChange:
|
|
42
|
-
label:
|
|
41
|
+
onChange: x,
|
|
42
|
+
label: m = "select_a_country",
|
|
43
43
|
placeholder: g = "type_to_search",
|
|
44
44
|
language: i = "en",
|
|
45
45
|
error: l,
|
|
46
|
-
className:
|
|
46
|
+
className: f = ""
|
|
47
47
|
}) => {
|
|
48
48
|
var _, I;
|
|
49
|
-
const { t:
|
|
49
|
+
const { t: h } = D(), [n, r] = S(!1), [u, y] = S(""), [o, N] = S(
|
|
50
50
|
a || null
|
|
51
51
|
), b = z(null), v = z(null), { x: F, y: P, strategy: M, refs: $, context: w, placement: A, middlewareData: L } = Q({
|
|
52
52
|
open: n,
|
|
@@ -80,11 +80,11 @@ const ge = ({
|
|
|
80
80
|
transform: "translateY(-4px)"
|
|
81
81
|
}
|
|
82
82
|
}), T = (Array.isArray(p) ? p : []).filter((e) => {
|
|
83
|
-
if (!
|
|
83
|
+
if (!u.trim()) return !0;
|
|
84
84
|
const s = i === "es" && e.labelES ? e.labelES.toLowerCase() : e.label.toLowerCase(), d = e.code ? e.code.toLowerCase() : "";
|
|
85
|
-
return s.includes(
|
|
85
|
+
return s.includes(u.toLowerCase()) || d.includes(u.toLowerCase());
|
|
86
86
|
}), X = (e) => {
|
|
87
|
-
N(e), r(!1), y(""),
|
|
87
|
+
N(e), r(!1), y(""), x(e);
|
|
88
88
|
}, q = () => {
|
|
89
89
|
r(!n), !n && b.current && setTimeout(() => {
|
|
90
90
|
var e;
|
|
@@ -105,12 +105,12 @@ const ge = ({
|
|
|
105
105
|
}[A.split("-")[0]], G = H({
|
|
106
106
|
onClick: q
|
|
107
107
|
});
|
|
108
|
-
return /* @__PURE__ */ t.jsxs("div", { className: `w-full relative flex flex-col gap-8 ${
|
|
109
|
-
/* @__PURE__ */ t.jsx(
|
|
108
|
+
return /* @__PURE__ */ t.jsxs("div", { className: `w-full relative flex flex-col gap-8 ${f}`, children: [
|
|
109
|
+
m && /* @__PURE__ */ t.jsx(
|
|
110
110
|
"label",
|
|
111
111
|
{
|
|
112
112
|
className: `text-gray-600 font-600 group ${l && "!text-red-500"} text-label`,
|
|
113
|
-
children:
|
|
113
|
+
children: m
|
|
114
114
|
}
|
|
115
115
|
),
|
|
116
116
|
/* @__PURE__ */ t.jsxs(
|
|
@@ -142,7 +142,7 @@ const ge = ({
|
|
|
142
142
|
),
|
|
143
143
|
/* @__PURE__ */ t.jsxs("span", { className: "flex-grow", children: [
|
|
144
144
|
i === "es" && o.labelES ? o.labelES : o.label,
|
|
145
|
-
o.code ? ` (${o.code})` :
|
|
145
|
+
o.code ? ` (${o.code})` : h("select_country")
|
|
146
146
|
] })
|
|
147
147
|
] }) : /* @__PURE__ */ t.jsx("span", { className: "text-gray-500", children: g }),
|
|
148
148
|
/* @__PURE__ */ t.jsx(
|
|
@@ -204,8 +204,8 @@ const ge = ({
|
|
|
204
204
|
ref: b,
|
|
205
205
|
type: "text",
|
|
206
206
|
className: "w-full p-16",
|
|
207
|
-
placeholder:
|
|
208
|
-
value:
|
|
207
|
+
placeholder: h("search") + "...",
|
|
208
|
+
value: u,
|
|
209
209
|
onChange: (e) => y(e.target.value),
|
|
210
210
|
onClick: (e) => e.stopPropagation(),
|
|
211
211
|
autoFocus: !0
|
|
@@ -5,19 +5,19 @@ import { FontAwesomeIcon as $ } from "../../../node_modules/@fortawesome/react-f
|
|
|
5
5
|
import { faEye as j, faEyeSlash as v } from "../../../node_modules/@fortawesome/pro-light-svg-icons/index.js";
|
|
6
6
|
import { useTheme as N } from "../../../hooks/useTheme.js";
|
|
7
7
|
const V = ({
|
|
8
|
-
label:
|
|
8
|
+
label: a,
|
|
9
9
|
control: c,
|
|
10
10
|
name: e,
|
|
11
11
|
placeholder: p,
|
|
12
12
|
className: x = "",
|
|
13
13
|
disabled: t = !1,
|
|
14
14
|
size: d = "md",
|
|
15
|
-
leftSide:
|
|
15
|
+
leftSide: n
|
|
16
16
|
}) => {
|
|
17
17
|
const {
|
|
18
|
-
field: { value:
|
|
18
|
+
field: { value: u = "", onChange: m, ref: g, onBlur: f },
|
|
19
19
|
fieldState: { error: o }
|
|
20
|
-
} = w({ name: e, control: c }), [s, h] = y(!1), { t:
|
|
20
|
+
} = w({ name: e, control: c }), [s, h] = y(!1), { t: i } = N(), l = {
|
|
21
21
|
sm: {
|
|
22
22
|
container: "px-16 py-8",
|
|
23
23
|
text: "text-sm",
|
|
@@ -39,11 +39,11 @@ const V = ({
|
|
|
39
39
|
className: `flex flex-col group select-none ${l.gap} ${t && "cursor-not-allowed"} ${x}`,
|
|
40
40
|
htmlFor: e,
|
|
41
41
|
children: [
|
|
42
|
-
/* @__PURE__ */ r.jsx(
|
|
42
|
+
a && /* @__PURE__ */ r.jsx(
|
|
43
43
|
"h6",
|
|
44
44
|
{
|
|
45
45
|
className: `text-gray-600 font-600 leading-none group ${o && "!text-red-500"} ${l.label} ${t && "text-gray-300"}`,
|
|
46
|
-
children:
|
|
46
|
+
children: a
|
|
47
47
|
}
|
|
48
48
|
),
|
|
49
49
|
/* @__PURE__ */ r.jsxs(
|
|
@@ -59,7 +59,7 @@ const V = ({
|
|
|
59
59
|
|
|
60
60
|
w-full h-full rounded-full border
|
|
61
61
|
|
|
62
|
-
${
|
|
62
|
+
${u && !t ? "border-blue-200" : "border-blue-100"}
|
|
63
63
|
${!t && "group-hover:border-blue-300"}
|
|
64
64
|
${t && "cursor-not-allowed"}
|
|
65
65
|
|
|
@@ -68,7 +68,7 @@ const V = ({
|
|
|
68
68
|
group-disabled:bg-gray-500
|
|
69
69
|
`,
|
|
70
70
|
children: [
|
|
71
|
-
|
|
71
|
+
n && n,
|
|
72
72
|
/* @__PURE__ */ r.jsx(
|
|
73
73
|
"input",
|
|
74
74
|
{
|
|
@@ -79,7 +79,7 @@ const V = ({
|
|
|
79
79
|
name: e,
|
|
80
80
|
disabled: t,
|
|
81
81
|
placeholder: p,
|
|
82
|
-
value:
|
|
82
|
+
value: u,
|
|
83
83
|
onChange: (b) => m(b.target.value),
|
|
84
84
|
onBlur: f,
|
|
85
85
|
ref: g,
|
|
@@ -97,7 +97,7 @@ const V = ({
|
|
|
97
97
|
]
|
|
98
98
|
}
|
|
99
99
|
),
|
|
100
|
-
(o == null ? void 0 : o.message) && /* @__PURE__ */ r.jsx("h4", { className: `font-500 text-red-500 leading-none ${l.error}`, children:
|
|
100
|
+
(o == null ? void 0 : o.message) && /* @__PURE__ */ r.jsx("h4", { className: `font-500 text-red-500 leading-none ${l.error}`, children: i(o.message, { x: i(e) }) })
|
|
101
101
|
]
|
|
102
102
|
}
|
|
103
103
|
);
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { j as t } from "../../../_virtual/jsx-runtime.js";
|
|
2
|
-
import { useState as f, useRef as h, useEffect as
|
|
2
|
+
import { useState as f, useRef as h, useEffect as H } from "react";
|
|
3
3
|
import { useController as xe } from "react-hook-form";
|
|
4
4
|
import { useFloating as be, useClick as we, useDismiss as Ce, useInteractions as ve, useTransitionStyles as ye } from "../../../node_modules/@floating-ui/react/dist/floating-ui.react.js";
|
|
5
5
|
import { FontAwesomeIcon as je } from "../../../node_modules/@fortawesome/react-fontawesome/index.es.js";
|
|
@@ -10,22 +10,22 @@ import { autoUpdate as Te } from "../../../node_modules/@floating-ui/dom/dist/fl
|
|
|
10
10
|
import { offset as Ie, flip as $e, shift as Ee, size as Oe, arrow as Pe } from "../../../node_modules/@floating-ui/react-dom/dist/floating-ui.react-dom.js";
|
|
11
11
|
const Ye = ({
|
|
12
12
|
name: v,
|
|
13
|
-
control:
|
|
14
|
-
label:
|
|
15
|
-
placeholder:
|
|
16
|
-
language:
|
|
17
|
-
className:
|
|
18
|
-
translateKey:
|
|
13
|
+
control: Y,
|
|
14
|
+
label: U = "phone_number",
|
|
15
|
+
placeholder: W = "enter_phone_number",
|
|
16
|
+
language: X = "en",
|
|
17
|
+
className: q = "",
|
|
18
|
+
translateKey: G,
|
|
19
19
|
countries: i = Le
|
|
20
20
|
}) => {
|
|
21
|
-
var
|
|
21
|
+
var F, D, V, A;
|
|
22
22
|
const { t: l } = Se(), { field: s, fieldState: y } = xe({
|
|
23
23
|
name: v,
|
|
24
|
-
control:
|
|
24
|
+
control: Y,
|
|
25
25
|
rules: { validate: {} }
|
|
26
|
-
}), j = ((
|
|
27
|
-
|
|
28
|
-
), [L, T] = f(
|
|
26
|
+
}), j = ((F = s.value) == null ? void 0 : F.split(" ")) || [], J = j[0] || null, K = j[1] || "", Q = i.find((e) => J === e.phone), [c, g] = f(!1), [d, N] = f(""), [r, S] = f(
|
|
27
|
+
Q || null
|
|
28
|
+
), [L, T] = f(K), [Z, I] = f(!1), x = h(null), $ = h(null), E = h(null), b = h(null), { x: ee, y: te, strategy: oe, refs: O, context: w, placement: ne, middlewareData: P } = be({
|
|
29
29
|
open: c,
|
|
30
30
|
onOpenChange: g,
|
|
31
31
|
middleware: [
|
|
@@ -44,10 +44,10 @@ const Ye = ({
|
|
|
44
44
|
],
|
|
45
45
|
placement: "bottom-start",
|
|
46
46
|
whileElementsMounted: Te
|
|
47
|
-
}),
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
]), { isMounted:
|
|
47
|
+
}), re = we(w), se = Ce(w), { getReferenceProps: le, getFloatingProps: ae } = ve([
|
|
48
|
+
re,
|
|
49
|
+
se
|
|
50
|
+
]), { isMounted: ie, styles: ce } = ye(w, {
|
|
51
51
|
duration: {
|
|
52
52
|
open: 200,
|
|
53
53
|
close: 150
|
|
@@ -58,22 +58,22 @@ const Ye = ({
|
|
|
58
58
|
}
|
|
59
59
|
}), R = (Array.isArray(i) ? i : []).filter((e) => {
|
|
60
60
|
if (!d.trim()) return !0;
|
|
61
|
-
const o =
|
|
61
|
+
const o = X === "es" && e.labelES ? e.labelES.toLowerCase() : e.label.toLowerCase(), n = e.code ? e.code.toLowerCase() : "", a = e.phone ? e.phone.toLowerCase() : "";
|
|
62
62
|
return o.includes(d.toLowerCase()) || n.includes(d.toLowerCase()) || a.includes(d.toLowerCase());
|
|
63
|
-
}),
|
|
63
|
+
}), de = (e) => {
|
|
64
64
|
S(e), g(!1), N("");
|
|
65
65
|
const o = `${e.phone} ${L}`;
|
|
66
66
|
s.onChange(o), setTimeout(() => {
|
|
67
67
|
var n;
|
|
68
68
|
(n = E.current) == null || n.focus();
|
|
69
69
|
}, 100);
|
|
70
|
-
},
|
|
70
|
+
}, ue = (e) => {
|
|
71
71
|
const o = e.target.value;
|
|
72
72
|
if (T(o), r) {
|
|
73
73
|
const n = `${r.phone} ${o}`;
|
|
74
74
|
s.onChange(n);
|
|
75
75
|
}
|
|
76
|
-
},
|
|
76
|
+
}, pe = () => {
|
|
77
77
|
g(!c), !c && x.current && setTimeout(() => {
|
|
78
78
|
var e;
|
|
79
79
|
(e = x.current) == null || e.focus();
|
|
@@ -82,19 +82,19 @@ const Ye = ({
|
|
|
82
82
|
setTimeout(() => {
|
|
83
83
|
c || s.onBlur();
|
|
84
84
|
}, 200);
|
|
85
|
-
}, pe = () => {
|
|
86
|
-
I(!0);
|
|
87
85
|
}, me = () => {
|
|
86
|
+
I(!0);
|
|
87
|
+
}, fe = () => {
|
|
88
88
|
I(!1);
|
|
89
89
|
};
|
|
90
|
-
|
|
90
|
+
H(() => {
|
|
91
91
|
if (s.value) {
|
|
92
92
|
const e = s.value.split(" "), o = e[0] || "", n = e[1] || "", a = i.find(
|
|
93
93
|
(m) => m.phone === o
|
|
94
94
|
);
|
|
95
95
|
a && S(a), T(n);
|
|
96
96
|
}
|
|
97
|
-
}, [s.value, i]),
|
|
97
|
+
}, [s.value, i]), H(() => {
|
|
98
98
|
const e = (o) => {
|
|
99
99
|
b.current && !b.current.contains(o.target) && s.onBlur();
|
|
100
100
|
};
|
|
@@ -105,21 +105,21 @@ const Ye = ({
|
|
|
105
105
|
const C = (e) => {
|
|
106
106
|
var o;
|
|
107
107
|
return e ? e.codeISO2 ? e.codeISO2.toLowerCase() : ((o = e.code) == null ? void 0 : o.toLowerCase()) || "" : "";
|
|
108
|
-
}, M = (
|
|
108
|
+
}, M = (D = P.arrow) == null ? void 0 : D.x, k = (V = P.arrow) == null ? void 0 : V.y, u = {
|
|
109
109
|
top: "bottom",
|
|
110
110
|
right: "left",
|
|
111
111
|
bottom: "top",
|
|
112
112
|
left: "right"
|
|
113
|
-
}[
|
|
114
|
-
onClick:
|
|
113
|
+
}[ne.split("-")[0]], he = le({
|
|
114
|
+
onClick: pe,
|
|
115
115
|
onBlur: B
|
|
116
|
-
}), _ = () => y.error ? "border-red-500" :
|
|
117
|
-
return /* @__PURE__ */ t.jsxs("div", { className: `w-full relative flex flex-col gap-8 ${
|
|
118
|
-
/* @__PURE__ */ t.jsx(
|
|
116
|
+
}), _ = () => y.error ? "border-red-500" : Z || c ? "border-blue-400" : "border-blue-100", z = l(U), ge = l(W), p = (A = y.error) == null ? void 0 : A.message;
|
|
117
|
+
return /* @__PURE__ */ t.jsxs("div", { className: `w-full relative flex flex-col gap-8 ${q}`, children: [
|
|
118
|
+
z && /* @__PURE__ */ t.jsx(
|
|
119
119
|
"label",
|
|
120
120
|
{
|
|
121
121
|
className: `text-gray-600 font-600 group ${p && "!text-red-500"} text-label`,
|
|
122
|
-
children:
|
|
122
|
+
children: z
|
|
123
123
|
}
|
|
124
124
|
),
|
|
125
125
|
/* @__PURE__ */ t.jsxs(
|
|
@@ -127,8 +127,8 @@ const Ye = ({
|
|
|
127
127
|
{
|
|
128
128
|
ref: b,
|
|
129
129
|
className: "flex items-center w-full",
|
|
130
|
-
onMouseEnter:
|
|
131
|
-
onMouseLeave:
|
|
130
|
+
onMouseEnter: me,
|
|
131
|
+
onMouseLeave: fe,
|
|
132
132
|
children: [
|
|
133
133
|
/* @__PURE__ */ t.jsxs(
|
|
134
134
|
"div",
|
|
@@ -136,7 +136,7 @@ const Ye = ({
|
|
|
136
136
|
ref: O.setReference,
|
|
137
137
|
className: `flex items-center justify-between text-lg max-w-120 font-600 bg-light rounded-l-full p-16 cursor-pointer border border-r-0 transition-all duration-200 ${p ? "border-red-500" : _()}`,
|
|
138
138
|
style: { minWidth: "140px" },
|
|
139
|
-
...
|
|
139
|
+
...he,
|
|
140
140
|
tabIndex: 0,
|
|
141
141
|
children: [
|
|
142
142
|
r != null && r.code ? /* @__PURE__ */ t.jsxs("div", { className: "flex items-center truncate", children: [
|
|
@@ -182,26 +182,26 @@ const Ye = ({
|
|
|
182
182
|
className: `placeholder:text-gray-400 flex-grow bg-light rounded-r-full font-600 text-body-m p-16 border transition-all duration-200 ${p ? "border-red-500" : _()}`,
|
|
183
183
|
placeholder: ge,
|
|
184
184
|
value: L,
|
|
185
|
-
onChange:
|
|
185
|
+
onChange: ue,
|
|
186
186
|
onBlur: B
|
|
187
187
|
}
|
|
188
188
|
)
|
|
189
189
|
]
|
|
190
190
|
}
|
|
191
191
|
),
|
|
192
|
-
p && /* @__PURE__ */ t.jsx("p", { className: "mt-1 text-sm text-red-600", children: l(p, { x: l(
|
|
193
|
-
|
|
192
|
+
p && /* @__PURE__ */ t.jsx("p", { className: "mt-1 text-sm text-red-600", children: l(p, { x: l(G || "") || v }) }),
|
|
193
|
+
ie && /* @__PURE__ */ t.jsxs(
|
|
194
194
|
"div",
|
|
195
195
|
{
|
|
196
196
|
ref: O.setFloating,
|
|
197
197
|
style: {
|
|
198
|
-
position:
|
|
199
|
-
top:
|
|
200
|
-
left:
|
|
201
|
-
...
|
|
198
|
+
position: oe,
|
|
199
|
+
top: te ?? 0,
|
|
200
|
+
left: ee ?? 0,
|
|
201
|
+
...ce
|
|
202
202
|
},
|
|
203
203
|
className: "z-10 w-fit bg-white border border-blue-400 rounded-3xl shadow-lg overflow-auto max-w-120",
|
|
204
|
-
...
|
|
204
|
+
...ae(),
|
|
205
205
|
children: [
|
|
206
206
|
/* @__PURE__ */ t.jsx(
|
|
207
207
|
"div",
|
|
@@ -245,7 +245,7 @@ const Ye = ({
|
|
|
245
245
|
{
|
|
246
246
|
className: "flex items-center justify-between gap-10 px-16 py-8 transition-all duration-200 hover:bg-blue-100/50 cursor-pointer",
|
|
247
247
|
onClick: (m) => {
|
|
248
|
-
m.stopPropagation(),
|
|
248
|
+
m.stopPropagation(), de(e);
|
|
249
249
|
},
|
|
250
250
|
children: [
|
|
251
251
|
n && /* @__PURE__ */ t.jsx(
|
|
@@ -2,21 +2,21 @@ import { j as o } from "../../../_virtual/jsx-runtime.js";
|
|
|
2
2
|
import { useTheme as h } from "../../../hooks/useTheme.js";
|
|
3
3
|
import "react";
|
|
4
4
|
const w = ({
|
|
5
|
-
label:
|
|
5
|
+
label: n,
|
|
6
6
|
onChange: p,
|
|
7
|
-
value:
|
|
7
|
+
value: s,
|
|
8
8
|
name: t,
|
|
9
9
|
error: l,
|
|
10
10
|
placeholder: i,
|
|
11
11
|
className: g = "",
|
|
12
12
|
disabled: e = !1,
|
|
13
|
-
disabledInput:
|
|
13
|
+
disabledInput: a = !1,
|
|
14
14
|
size: d = "md",
|
|
15
|
-
leftSide:
|
|
16
|
-
rightSide:
|
|
15
|
+
leftSide: c,
|
|
16
|
+
rightSide: x,
|
|
17
17
|
...b
|
|
18
18
|
}) => {
|
|
19
|
-
const { t:
|
|
19
|
+
const { t: u } = h(), r = {
|
|
20
20
|
sm: {
|
|
21
21
|
container: "px-16 py-8",
|
|
22
22
|
text: "text-sm",
|
|
@@ -38,11 +38,11 @@ const w = ({
|
|
|
38
38
|
className: `flex flex-col group select-none ${r.gap} ${e && "cursor-not-allowed"} ${g}`,
|
|
39
39
|
htmlFor: t,
|
|
40
40
|
children: [
|
|
41
|
-
/* @__PURE__ */ o.jsx(
|
|
41
|
+
n && /* @__PURE__ */ o.jsx(
|
|
42
42
|
"h6",
|
|
43
43
|
{
|
|
44
44
|
className: `text-gray-600 font-600 leading-none group ${l && "!text-red-500"} ${r.label} ${e && "text-gray-300"}`,
|
|
45
|
-
children:
|
|
45
|
+
children: n
|
|
46
46
|
}
|
|
47
47
|
),
|
|
48
48
|
/* @__PURE__ */ o.jsxs(
|
|
@@ -52,16 +52,16 @@ const w = ({
|
|
|
52
52
|
className: `
|
|
53
53
|
flex items-center justify-between gap-8 bg-light
|
|
54
54
|
${r.container} ${l && "!border-red-500"} rounded-full border
|
|
55
|
-
${
|
|
55
|
+
${s && !e ? "border-blue-200" : "border-blue-100"}
|
|
56
56
|
${!e && "group-hover:border-blue-300"}
|
|
57
57
|
${e && "cursor-not-allowed"}
|
|
58
58
|
|
|
59
59
|
group-focus-within:border-blue-500 transition-colors duration-200 ease-in-out
|
|
60
|
-
${
|
|
60
|
+
${a && "hover:!cursor-pointer"}
|
|
61
61
|
group-disabled:bg-gray-500
|
|
62
62
|
`,
|
|
63
63
|
children: [
|
|
64
|
-
|
|
64
|
+
c && c,
|
|
65
65
|
/* @__PURE__ */ o.jsx(
|
|
66
66
|
"input",
|
|
67
67
|
{
|
|
@@ -70,18 +70,18 @@ const w = ({
|
|
|
70
70
|
name: t,
|
|
71
71
|
disabled: e,
|
|
72
72
|
placeholder: i,
|
|
73
|
-
value:
|
|
73
|
+
value: s,
|
|
74
74
|
onChange: (f) => {
|
|
75
75
|
p(f.target.value);
|
|
76
76
|
},
|
|
77
|
-
className: `group bg-transparent w-full h-full font-600 placeholder:font-600 select-text ${r.text} disabled:text-gray-300 disabled:placeholder:text-gray-300 placeholder:text-gray-400 disabled:cursor-not-allowed overflow-visible outline-none ${
|
|
77
|
+
className: `group bg-transparent w-full h-full font-600 placeholder:font-600 select-text ${r.text} disabled:text-gray-300 disabled:placeholder:text-gray-300 placeholder:text-gray-400 disabled:cursor-not-allowed overflow-visible outline-none ${a && "pointer-events-none !select-none !caret-transparent"}`
|
|
78
78
|
}
|
|
79
79
|
),
|
|
80
|
-
|
|
80
|
+
x && x
|
|
81
81
|
]
|
|
82
82
|
}
|
|
83
83
|
),
|
|
84
|
-
l && /* @__PURE__ */ o.jsx("h4", { className: `font-500 text-red-500 leading-none ${r.error}`, children:
|
|
84
|
+
l && /* @__PURE__ */ o.jsx("h4", { className: `font-500 text-red-500 leading-none ${r.error}`, children: u(l, { x: u(t) }) })
|
|
85
85
|
]
|
|
86
86
|
}
|
|
87
87
|
);
|