lawgic-dev-kit 0.12.0 → 0.12.6
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/_virtual/index7.js +2 -2
- package/dist/_virtual/index8.js +2 -2
- package/dist/components/molecules/CalendarSelector/CalendarSelector.js +164 -145
- package/dist/components/molecules/DateInput/DateInput.d.ts +2 -2
- package/dist/components/molecules/DateInput/DateInput.js +63 -50
- package/dist/components/molecules/FloatingMenu/FloatingMenu.js +17 -17
- package/dist/lawgic-dev-kit.umd.js +101 -101
- package/dist/node_modules/prop-types/node_modules/react-is/index.js +1 -1
- package/dist/node_modules/toposort/index.js +1 -1
- package/dist/src/components/molecules/DateInput/DateInput.d.ts +11 -0
- package/package.json +1 -1
- package/dist/src/components/atoms/SectionButton/desktop/SectionButton.d.ts +0 -3
- package/dist/src/components/atoms/SectionButton/desktop/SectionButton.styles.d.ts +0 -2
- package/dist/src/components/atoms/SectionButton/desktop/SectionButton.types.d.ts +0 -37
- package/dist/src/components/atoms/SectionButton/mobile/MobileSectionButton.styles.d.ts +0 -3
- package/dist/src/components/atoms/SectionButton/mobile/SectionButton.types.d.ts +0 -37
package/dist/_virtual/index7.js
CHANGED
package/dist/_virtual/index8.js
CHANGED
|
@@ -1,124 +1,143 @@
|
|
|
1
1
|
import { j as e } from "../../../_virtual/jsx-runtime.js";
|
|
2
|
-
import { faChevronRight as
|
|
3
|
-
import { faChevronLeft as
|
|
4
|
-
import { useState as
|
|
5
|
-
import { FontAwesomeIcon as
|
|
2
|
+
import { faChevronRight as oe } from "../../../node_modules/@fortawesome/free-solid-svg-icons/index.js";
|
|
3
|
+
import { faChevronLeft as ne } from "../../../node_modules/@fortawesome/pro-solid-svg-icons/index.js";
|
|
4
|
+
import { useState as p, useEffect as $, useRef as H } from "react";
|
|
5
|
+
import { FontAwesomeIcon as se } from "../../../node_modules/@fortawesome/react-fontawesome/index.es.js";
|
|
6
6
|
import "../../../_virtual/lodash.js";
|
|
7
|
-
import { useTheme as
|
|
8
|
-
import
|
|
9
|
-
import
|
|
10
|
-
import
|
|
11
|
-
import { faChevronDown as
|
|
7
|
+
import { useTheme as ae } from "../../../hooks/useTheme.js";
|
|
8
|
+
import Y from "../FloatingMenu/FloatingMenu.js";
|
|
9
|
+
import ie from "./PeriodToggle.js";
|
|
10
|
+
import le from "./TimeDisplay.js";
|
|
11
|
+
import { faChevronDown as ce } from "../../../node_modules/@fortawesome/pro-regular-svg-icons/index.js";
|
|
12
12
|
import "react-hook-form";
|
|
13
13
|
import "react-dom";
|
|
14
14
|
import "../../../constants/countries.js";
|
|
15
|
-
import
|
|
15
|
+
import I from "../../atoms/IconButton/IconButton.js";
|
|
16
16
|
import "../../atoms/ImageProfileInput/ImageProfileInput.validators.js";
|
|
17
|
-
import { AnimatePresence as
|
|
18
|
-
import { motion as
|
|
19
|
-
import { startOfWeek as
|
|
20
|
-
import { startOfMonth as
|
|
21
|
-
import { endOfWeek as
|
|
22
|
-
import { endOfMonth as
|
|
23
|
-
import { eachDayOfInterval as
|
|
24
|
-
import { isSameDay as
|
|
25
|
-
import { isSameMonth as
|
|
26
|
-
import { isToday as
|
|
27
|
-
import { subMonths as
|
|
28
|
-
import { addMonths as
|
|
29
|
-
import { setHours as
|
|
30
|
-
import { setMinutes as
|
|
31
|
-
import { setSeconds as
|
|
32
|
-
import { formatDate as
|
|
33
|
-
import { es as
|
|
34
|
-
const
|
|
35
|
-
date:
|
|
36
|
-
onDateChange:
|
|
37
|
-
showTimeSelector:
|
|
38
|
-
maxDate:
|
|
17
|
+
import { AnimatePresence as me } from "../../../node_modules/motion/dist/es/framer-motion/dist/es/components/AnimatePresence/index.js";
|
|
18
|
+
import { motion as B } from "../../../node_modules/motion/dist/es/framer-motion/dist/es/render/components/motion/proxy.js";
|
|
19
|
+
import { startOfWeek as de } from "../../../node_modules/date-fns/startOfWeek.js";
|
|
20
|
+
import { startOfMonth as pe } from "../../../node_modules/date-fns/startOfMonth.js";
|
|
21
|
+
import { endOfWeek as ue } from "../../../node_modules/date-fns/endOfWeek.js";
|
|
22
|
+
import { endOfMonth as fe } from "../../../node_modules/date-fns/endOfMonth.js";
|
|
23
|
+
import { eachDayOfInterval as xe } from "../../../node_modules/date-fns/eachDayOfInterval.js";
|
|
24
|
+
import { isSameDay as he } from "../../../node_modules/date-fns/isSameDay.js";
|
|
25
|
+
import { isSameMonth as ge } from "../../../node_modules/date-fns/isSameMonth.js";
|
|
26
|
+
import { isToday as Me } from "../../../node_modules/date-fns/isToday.js";
|
|
27
|
+
import { subMonths as ye } from "../../../node_modules/date-fns/subMonths.js";
|
|
28
|
+
import { addMonths as ve } from "../../../node_modules/date-fns/addMonths.js";
|
|
29
|
+
import { setHours as U } from "../../../node_modules/date-fns/setHours.js";
|
|
30
|
+
import { setMinutes as R } from "../../../node_modules/date-fns/setMinutes.js";
|
|
31
|
+
import { setSeconds as L } from "../../../node_modules/date-fns/setSeconds.js";
|
|
32
|
+
import { formatDate as u } from "../../../node_modules/date-fns/format.js";
|
|
33
|
+
import { es as h } from "../../../node_modules/date-fns/locale/es.js";
|
|
34
|
+
const tt = ({
|
|
35
|
+
date: c,
|
|
36
|
+
onDateChange: S,
|
|
37
|
+
showTimeSelector: _ = !0,
|
|
38
|
+
maxDate: g
|
|
39
39
|
}) => {
|
|
40
|
-
const [
|
|
41
|
-
|
|
42
|
-
), [
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
}, [
|
|
46
|
-
const
|
|
47
|
-
|
|
48
|
-
|
|
40
|
+
const [a, M] = p(c), [E, w] = p(c), [y, k] = p(c.getHours() % 12 || 12), [b, A] = p(
|
|
41
|
+
c.getHours() >= 12 ? "PM" : "AM"
|
|
42
|
+
), [C, O] = p(0), { t: W } = ae(), [P, j] = p(!1), [T, N] = p(!1);
|
|
43
|
+
$(() => {
|
|
44
|
+
M(c), w(c), k(c.getHours() % 12 || 12), A(c.getHours() >= 12 ? "PM" : "AM");
|
|
45
|
+
}, [c]);
|
|
46
|
+
const q = () => {
|
|
47
|
+
O(-1), setTimeout(() => {
|
|
48
|
+
M(ye(a));
|
|
49
49
|
}, 10);
|
|
50
|
-
},
|
|
51
|
-
|
|
52
|
-
|
|
50
|
+
}, z = () => {
|
|
51
|
+
O(1), setTimeout(() => {
|
|
52
|
+
M(ve(a, 1));
|
|
53
53
|
}, 10);
|
|
54
|
-
},
|
|
55
|
-
if (
|
|
54
|
+
}, G = (t) => {
|
|
55
|
+
if (g && t > g)
|
|
56
56
|
return;
|
|
57
|
-
const
|
|
58
|
-
|
|
59
|
-
|
|
57
|
+
const s = U(
|
|
58
|
+
R(L(t, 0), 0),
|
|
59
|
+
b === "AM" ? y % 12 : y % 12 + 12
|
|
60
60
|
);
|
|
61
|
-
|
|
62
|
-
},
|
|
63
|
-
|
|
64
|
-
const
|
|
65
|
-
|
|
66
|
-
|
|
61
|
+
w(s), S(s);
|
|
62
|
+
}, J = (t) => {
|
|
63
|
+
k(t);
|
|
64
|
+
const s = U(
|
|
65
|
+
R(L(E, 0), 0),
|
|
66
|
+
b === "AM" ? t % 12 : t % 12 + 12
|
|
67
67
|
);
|
|
68
|
-
|
|
69
|
-
},
|
|
70
|
-
|
|
71
|
-
},
|
|
72
|
-
const
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
),
|
|
80
|
-
index: s.getMonth(),
|
|
81
|
-
year: s.getFullYear(),
|
|
82
|
-
displayName: `${m(s, "MMMM", { locale: j }).replace(
|
|
68
|
+
w(s), S(s), j(!1);
|
|
69
|
+
}, K = (t) => {
|
|
70
|
+
A(t);
|
|
71
|
+
}, Q = () => {
|
|
72
|
+
const t = /* @__PURE__ */ new Date(), s = 20, m = 5, [n, D] = p(() => Array.from({ length: s + 1 }, (r, l) => {
|
|
73
|
+
const o = new Date(t.getFullYear(), t.getMonth() - l, 1);
|
|
74
|
+
return {
|
|
75
|
+
name: u(o, "MMMM", { locale: h }).replace(/^./, (f) => f.toUpperCase()),
|
|
76
|
+
index: o.getMonth(),
|
|
77
|
+
year: o.getFullYear(),
|
|
78
|
+
displayName: `${u(o, "MMMM", { locale: h }).replace(
|
|
83
79
|
/^./,
|
|
84
|
-
(
|
|
85
|
-
)} ${
|
|
86
|
-
}
|
|
87
|
-
}
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
80
|
+
(f) => f.toUpperCase()
|
|
81
|
+
)} ${o.getFullYear()}`
|
|
82
|
+
};
|
|
83
|
+
})), i = H(null), d = H(null);
|
|
84
|
+
$(() => {
|
|
85
|
+
i.current && i.current.disconnect(), i.current = new IntersectionObserver((r) => {
|
|
86
|
+
r[0].isIntersecting && D((l) => {
|
|
87
|
+
const o = l[l.length - 1], f = new Date(o.year, o.index - 1, 1), te = Array.from({ length: m }, (we, re) => {
|
|
88
|
+
const x = new Date(f.getFullYear(), f.getMonth() - re, 1);
|
|
89
|
+
return {
|
|
90
|
+
name: u(x, "MMMM", { locale: h }).replace(/^./, (F) => F.toUpperCase()),
|
|
91
|
+
index: x.getMonth(),
|
|
92
|
+
year: x.getFullYear(),
|
|
93
|
+
displayName: `${u(x, "MMMM", { locale: h }).replace(
|
|
94
|
+
/^./,
|
|
95
|
+
(F) => F.toUpperCase()
|
|
96
|
+
)} ${x.getFullYear()}`
|
|
97
|
+
};
|
|
98
|
+
});
|
|
99
|
+
return [...l, ...te];
|
|
100
|
+
});
|
|
101
|
+
}), d.current && i.current.observe(d.current);
|
|
102
|
+
}, [n]);
|
|
103
|
+
const v = (r, l) => {
|
|
104
|
+
const o = new Date(a);
|
|
105
|
+
o.setMonth(r), o.setFullYear(l), M(o), N(!1);
|
|
91
106
|
};
|
|
92
|
-
return /* @__PURE__ */ e.jsx("div", { className: "flex flex-col p-8 max-h-200 overflow-y-auto bg-light gap-4", children: n.map((
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
107
|
+
return /* @__PURE__ */ e.jsx("div", { className: "flex flex-col p-8 max-h-200 overflow-y-auto bg-light gap-4", children: n.map((r, l) => {
|
|
108
|
+
const o = l === n.length - 1;
|
|
109
|
+
return /* @__PURE__ */ e.jsx(
|
|
110
|
+
"button",
|
|
111
|
+
{
|
|
112
|
+
ref: o ? d : null,
|
|
113
|
+
onClick: () => v(r.index, r.year),
|
|
114
|
+
className: `text-start p-6 font-600 transition-all duration-100 rounded-lg hover:bg-gray-100 ${a.getMonth() === r.index && a.getFullYear() === r.year ? "bg-blue-100" : ""}`,
|
|
115
|
+
children: r.displayName
|
|
116
|
+
},
|
|
117
|
+
`${r.name}-${r.year}-${l}`
|
|
118
|
+
);
|
|
119
|
+
}) });
|
|
120
|
+
}, V = () => /* @__PURE__ */ e.jsxs("div", { className: "flex justify-between items-center mb-8", children: [
|
|
102
121
|
/* @__PURE__ */ e.jsx(
|
|
103
|
-
|
|
122
|
+
Y,
|
|
104
123
|
{
|
|
105
|
-
open:
|
|
106
|
-
onClose: () =>
|
|
107
|
-
component:
|
|
124
|
+
open: T,
|
|
125
|
+
onClose: () => N(!1),
|
|
126
|
+
component: Q,
|
|
108
127
|
placement: "bottom",
|
|
109
128
|
className: "!p-0 overflow-hidden bg-light",
|
|
110
129
|
strategy: "fixed",
|
|
111
130
|
children: /* @__PURE__ */ e.jsxs(
|
|
112
131
|
"button",
|
|
113
132
|
{
|
|
114
|
-
onClick: () =>
|
|
133
|
+
onClick: () => N(!T),
|
|
115
134
|
className: "hover:text-blue-500 transition-colors duration-150 flex gap-6 items-center",
|
|
116
135
|
children: [
|
|
117
|
-
/* @__PURE__ */ e.jsx("h4", { className: "text-header-4", children:
|
|
136
|
+
/* @__PURE__ */ e.jsx("h4", { className: "text-header-4", children: u(a, "MMMM yyyy", { locale: h }).replace(
|
|
118
137
|
/^./,
|
|
119
|
-
(
|
|
138
|
+
(t) => t.toUpperCase()
|
|
120
139
|
) }),
|
|
121
|
-
/* @__PURE__ */ e.jsx(
|
|
140
|
+
/* @__PURE__ */ e.jsx(se, { icon: ce, className: "w-12 h-12" })
|
|
122
141
|
]
|
|
123
142
|
}
|
|
124
143
|
)
|
|
@@ -126,41 +145,41 @@ const ze = ({
|
|
|
126
145
|
),
|
|
127
146
|
/* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-8", children: [
|
|
128
147
|
/* @__PURE__ */ e.jsx(
|
|
129
|
-
|
|
148
|
+
I,
|
|
130
149
|
{
|
|
131
150
|
variant: "transparent",
|
|
132
151
|
color: "gray",
|
|
133
|
-
icon:
|
|
134
|
-
onClick:
|
|
152
|
+
icon: ne,
|
|
153
|
+
onClick: q
|
|
135
154
|
}
|
|
136
155
|
),
|
|
137
156
|
/* @__PURE__ */ e.jsx(
|
|
138
|
-
|
|
157
|
+
I,
|
|
139
158
|
{
|
|
140
159
|
variant: "transparent",
|
|
141
160
|
color: "gray",
|
|
142
|
-
icon:
|
|
143
|
-
onClick:
|
|
161
|
+
icon: oe,
|
|
162
|
+
onClick: z
|
|
144
163
|
}
|
|
145
164
|
)
|
|
146
165
|
] })
|
|
147
|
-
] }),
|
|
148
|
-
const
|
|
149
|
-
return /* @__PURE__ */ e.jsx("div", { className: "grid grid-cols-7 gap-2", children:
|
|
150
|
-
const
|
|
166
|
+
] }), X = () => {
|
|
167
|
+
const t = de(pe(a)), s = ue(fe(a)), m = xe({ start: t, end: s });
|
|
168
|
+
return /* @__PURE__ */ e.jsx("div", { className: "grid grid-cols-7 gap-2", children: m.map((n, D) => {
|
|
169
|
+
const i = he(n, E), d = ge(n, a), v = Me(n), r = g ? n > g : !1;
|
|
151
170
|
return /* @__PURE__ */ e.jsx(
|
|
152
|
-
|
|
171
|
+
B.div,
|
|
153
172
|
{
|
|
154
173
|
className: `
|
|
155
174
|
p-2 text-center w-[40px] h-[40px] rounded-full flex items-center justify-center font-600 select-none
|
|
156
|
-
${!
|
|
157
|
-
${
|
|
175
|
+
${!d || r ? "text-gray-400 pointer-events-none" : "cursor-pointer"}
|
|
176
|
+
${v && !i ? "text-blue-600" : ""}
|
|
158
177
|
`,
|
|
159
|
-
onClick: () =>
|
|
178
|
+
onClick: () => G(n),
|
|
160
179
|
initial: !1,
|
|
161
180
|
animate: {
|
|
162
|
-
backgroundColor:
|
|
163
|
-
color:
|
|
181
|
+
backgroundColor: i ? "#93C5FD" : "transparent",
|
|
182
|
+
color: i ? "#FFFFFF" : v ? "#2563EB" : d && !r ? "#000000" : "#9CA3AF"
|
|
164
183
|
},
|
|
165
184
|
transition: {
|
|
166
185
|
duration: 0.2,
|
|
@@ -170,62 +189,62 @@ const ze = ({
|
|
|
170
189
|
ease: "easeOut"
|
|
171
190
|
}
|
|
172
191
|
},
|
|
173
|
-
whileHover:
|
|
192
|
+
whileHover: d && !i && !r ? {
|
|
174
193
|
backgroundColor: "#E5E7EB"
|
|
175
194
|
} : {},
|
|
176
|
-
whileTap:
|
|
177
|
-
backgroundColor:
|
|
195
|
+
whileTap: d && !r ? {
|
|
196
|
+
backgroundColor: i ? "#7AA5E0" : "#D1D5DB"
|
|
178
197
|
} : {},
|
|
179
|
-
children:
|
|
198
|
+
children: u(n, "d")
|
|
180
199
|
},
|
|
181
|
-
|
|
200
|
+
D
|
|
182
201
|
);
|
|
183
202
|
}) });
|
|
184
|
-
},
|
|
185
|
-
const
|
|
203
|
+
}, Z = () => {
|
|
204
|
+
const t = Array.from({ length: 12 }, (m, n) => n + 1), s = () => /* @__PURE__ */ e.jsx("div", { className: "bg-white rounded-lg shadow-lg w-80 max-h-[150px] overflow-y-auto p-4 flex flex-col gap-4", children: t.map((m) => /* @__PURE__ */ e.jsxs(
|
|
186
205
|
"button",
|
|
187
206
|
{
|
|
188
|
-
onClick: () =>
|
|
189
|
-
className: `w-full text-center py-2 transition-all duration-100 rounded-lg hover:bg-gray-100 ${
|
|
207
|
+
onClick: () => J(m),
|
|
208
|
+
className: `w-full text-center py-2 transition-all duration-100 rounded-lg hover:bg-gray-100 ${m === y ? "text-blue-500 font-medium" : ""}`,
|
|
190
209
|
children: [
|
|
191
|
-
String(
|
|
210
|
+
String(m).padStart(2, "0"),
|
|
192
211
|
":00"
|
|
193
212
|
]
|
|
194
213
|
},
|
|
195
|
-
|
|
214
|
+
m
|
|
196
215
|
)) });
|
|
197
216
|
return /* @__PURE__ */ e.jsxs("div", { className: "flex justify-between items-center mt-4 mb-4", children: [
|
|
198
|
-
/* @__PURE__ */ e.jsx("h4", { className: "text-body-m font-medium", children:
|
|
217
|
+
/* @__PURE__ */ e.jsx("h4", { className: "text-body-m font-medium", children: W("time") }),
|
|
199
218
|
/* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-6", children: [
|
|
200
219
|
/* @__PURE__ */ e.jsx(
|
|
201
|
-
|
|
220
|
+
Y,
|
|
202
221
|
{
|
|
203
|
-
open:
|
|
204
|
-
onClose: () =>
|
|
205
|
-
component:
|
|
222
|
+
open: P,
|
|
223
|
+
onClose: () => j(!1),
|
|
224
|
+
component: s,
|
|
206
225
|
placement: "bottom",
|
|
207
226
|
className: "!p-0 overflow-hidden",
|
|
208
227
|
strategy: "fixed",
|
|
209
228
|
children: /* @__PURE__ */ e.jsx(
|
|
210
|
-
|
|
229
|
+
le,
|
|
211
230
|
{
|
|
212
|
-
setHourMenuOpen:
|
|
213
|
-
hourMenuOpen:
|
|
214
|
-
selectedHour:
|
|
231
|
+
setHourMenuOpen: j,
|
|
232
|
+
hourMenuOpen: P,
|
|
233
|
+
selectedHour: y
|
|
215
234
|
}
|
|
216
235
|
)
|
|
217
236
|
}
|
|
218
237
|
),
|
|
219
238
|
/* @__PURE__ */ e.jsx(
|
|
220
|
-
|
|
239
|
+
ie,
|
|
221
240
|
{
|
|
222
|
-
selectedPeriod:
|
|
223
|
-
handlePeriodChange:
|
|
241
|
+
selectedPeriod: b,
|
|
242
|
+
handlePeriodChange: K
|
|
224
243
|
}
|
|
225
244
|
)
|
|
226
245
|
] })
|
|
227
246
|
] });
|
|
228
|
-
},
|
|
247
|
+
}, ee = {
|
|
229
248
|
slideNextEnter: {
|
|
230
249
|
x: 300,
|
|
231
250
|
opacity: 0
|
|
@@ -260,22 +279,22 @@ const ze = ({
|
|
|
260
279
|
}
|
|
261
280
|
};
|
|
262
281
|
return /* @__PURE__ */ e.jsxs("div", { className: "rounded-3xl max-w-[300px] mx-auto bg-white p-24 relative overflow-hidden", children: [
|
|
263
|
-
|
|
264
|
-
/* @__PURE__ */ e.jsx(
|
|
265
|
-
|
|
282
|
+
V(),
|
|
283
|
+
/* @__PURE__ */ e.jsx(me, { initial: !1, mode: "popLayout", children: /* @__PURE__ */ e.jsx(
|
|
284
|
+
B.div,
|
|
266
285
|
{
|
|
267
|
-
variants:
|
|
268
|
-
initial:
|
|
286
|
+
variants: ee,
|
|
287
|
+
initial: C === 1 ? "slideNextEnter" : C === -1 ? "slidePrevEnter" : !1,
|
|
269
288
|
animate: "center",
|
|
270
|
-
exit:
|
|
289
|
+
exit: C === 1 ? "slideNextExit" : "slidePrevExit",
|
|
271
290
|
className: "w-full",
|
|
272
|
-
children:
|
|
291
|
+
children: X()
|
|
273
292
|
},
|
|
274
|
-
|
|
293
|
+
u(a, "yyyy-MM")
|
|
275
294
|
) }),
|
|
276
|
-
|
|
295
|
+
_ && Z()
|
|
277
296
|
] });
|
|
278
297
|
};
|
|
279
298
|
export {
|
|
280
|
-
|
|
299
|
+
tt as default
|
|
281
300
|
};
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
import { default as React } from 'react';
|
|
2
1
|
import { Control, FieldValues, Path } from 'react-hook-form';
|
|
3
2
|
export type DateInputProps<T extends FieldValues = FieldValues> = {
|
|
4
3
|
control: Control<T>;
|
|
@@ -6,6 +5,7 @@ export type DateInputProps<T extends FieldValues = FieldValues> = {
|
|
|
6
5
|
label?: string;
|
|
7
6
|
placeholder?: string;
|
|
8
7
|
showTimeSelector?: boolean;
|
|
8
|
+
translateKey?: string;
|
|
9
9
|
};
|
|
10
|
-
declare const DateInput: <T extends FieldValues = FieldValues>({ control, name, showTimeSelector, label, placeholder }: DateInputProps<T>) => React.ReactElement;
|
|
10
|
+
declare const DateInput: <T extends FieldValues = FieldValues>({ control, name, showTimeSelector, label, translateKey, placeholder }: DateInputProps<T>) => React.ReactElement;
|
|
11
11
|
export default DateInput;
|
|
@@ -1,66 +1,79 @@
|
|
|
1
|
-
import { j as
|
|
2
|
-
import { useState as
|
|
3
|
-
import { useController as
|
|
4
|
-
import
|
|
5
|
-
import
|
|
6
|
-
import
|
|
7
|
-
import
|
|
8
|
-
import
|
|
9
|
-
import { useTheme as
|
|
10
|
-
import {
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
1
|
+
import { j as m } from "../../../_virtual/jsx-runtime.js";
|
|
2
|
+
import { useState as C, useEffect as F } from "react";
|
|
3
|
+
import { useController as M } from "react-hook-form";
|
|
4
|
+
import { faX as E } from "../../../node_modules/@fortawesome/free-solid-svg-icons/index.js";
|
|
5
|
+
import { FontAwesomeIcon as V } from "../../../node_modules/@fortawesome/react-fontawesome/index.es.js";
|
|
6
|
+
import k from "../FloatingMenu/FloatingMenu.js";
|
|
7
|
+
import A from "../CalendarSelector/CalendarSelector.js";
|
|
8
|
+
import B from "../../atoms/UncontrolledTextInput/UncontrolledTextInput.js";
|
|
9
|
+
import { useTheme as K } from "../../../hooks/useTheme.js";
|
|
10
|
+
import { formatDate as O } from "../../../node_modules/date-fns/format.js";
|
|
11
|
+
const D = (a) => O(a, "dd/MM/yyyy"), N = (a) => {
|
|
12
|
+
const [t, n, o] = a.split("/");
|
|
13
|
+
if ((t == null ? void 0 : t.length) === 2 && (n == null ? void 0 : n.length) === 2 && (o == null ? void 0 : o.length) === 4) {
|
|
14
|
+
const l = new Date(Number(o), Number(n) - 1, Number(t));
|
|
15
|
+
return isNaN(l.getTime()) ? null : l;
|
|
16
|
+
}
|
|
17
|
+
return null;
|
|
18
|
+
}, Q = ({ control: a, name: t, showTimeSelector: n = !1, label: o, translateKey: l = "", placeholder: j }) => {
|
|
16
19
|
const {
|
|
17
|
-
field: { value:
|
|
18
|
-
fieldState: { error:
|
|
19
|
-
} =
|
|
20
|
-
|
|
21
|
-
|
|
20
|
+
field: { value: i, onChange: p, onBlur: I },
|
|
21
|
+
fieldState: { error: u }
|
|
22
|
+
} = M({ name: t, control: a }), { t: g } = K(), b = g(t), S = g(l), [T, c] = C(!1), [h, r] = C("");
|
|
23
|
+
F(() => {
|
|
24
|
+
i instanceof Date && !isNaN(i.getTime()) ? r(D(i)) : r("");
|
|
25
|
+
}, [i]);
|
|
26
|
+
const x = N(h), v = (e) => {
|
|
27
|
+
const s = e.replace(/\D/g, "").slice(0, 8), f = [];
|
|
28
|
+
s.length > 0 && f.push(s.slice(0, 2)), s.length > 2 && f.push(s.slice(2, 4)), s.length > 4 && f.push(s.slice(4, 8));
|
|
29
|
+
const d = f.join("/");
|
|
30
|
+
if (r(d), c(!1), d.length === 10) {
|
|
31
|
+
const y = N(d);
|
|
32
|
+
p(y);
|
|
33
|
+
}
|
|
34
|
+
}, w = () => {
|
|
35
|
+
p(null), r("");
|
|
36
|
+
};
|
|
37
|
+
return /* @__PURE__ */ m.jsx(
|
|
38
|
+
k,
|
|
22
39
|
{
|
|
23
|
-
open:
|
|
40
|
+
open: T,
|
|
24
41
|
strategy: "fixed",
|
|
25
42
|
padding: 0,
|
|
26
43
|
offset: 0,
|
|
27
|
-
onClose: () =>
|
|
28
|
-
className: "
|
|
29
|
-
component: /* @__PURE__ */
|
|
30
|
-
|
|
44
|
+
onClose: () => c(!1),
|
|
45
|
+
className: "p-0!",
|
|
46
|
+
component: /* @__PURE__ */ m.jsx(
|
|
47
|
+
A,
|
|
31
48
|
{
|
|
32
|
-
date:
|
|
33
|
-
onDateChange: (
|
|
34
|
-
|
|
49
|
+
date: x || /* @__PURE__ */ new Date(),
|
|
50
|
+
onDateChange: (e) => {
|
|
51
|
+
r(D(e)), p(e), c(!1);
|
|
35
52
|
},
|
|
36
|
-
showTimeSelector:
|
|
53
|
+
showTimeSelector: n,
|
|
54
|
+
maxDate: /* @__PURE__ */ new Date()
|
|
37
55
|
}
|
|
38
56
|
),
|
|
39
|
-
children: /* @__PURE__ */
|
|
40
|
-
|
|
57
|
+
children: /* @__PURE__ */ m.jsx(
|
|
58
|
+
B,
|
|
41
59
|
{
|
|
42
|
-
onBlur:
|
|
43
|
-
name:
|
|
44
|
-
label:
|
|
45
|
-
|
|
46
|
-
|
|
60
|
+
onBlur: I,
|
|
61
|
+
name: S || b,
|
|
62
|
+
label: o,
|
|
63
|
+
value: h,
|
|
64
|
+
onFocus: (e) => {
|
|
65
|
+
e.preventDefault(), c(!0);
|
|
47
66
|
},
|
|
48
|
-
value: e && v(e) || "",
|
|
49
67
|
disabledInput: !0,
|
|
50
|
-
onChange: () =>
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
},
|
|
56
|
-
placeholder: i,
|
|
57
|
-
error: o == null ? void 0 : o.message,
|
|
58
|
-
rightSide: e && /* @__PURE__ */ t.jsx(
|
|
59
|
-
D,
|
|
68
|
+
onChange: (e) => v(e),
|
|
69
|
+
placeholder: j,
|
|
70
|
+
error: u == null ? void 0 : u.message,
|
|
71
|
+
rightSide: !!x && /* @__PURE__ */ m.jsx(
|
|
72
|
+
V,
|
|
60
73
|
{
|
|
61
|
-
icon:
|
|
74
|
+
icon: E,
|
|
62
75
|
className: "text-gray-500 cursor-pointer",
|
|
63
|
-
onClick:
|
|
76
|
+
onClick: w
|
|
64
77
|
}
|
|
65
78
|
)
|
|
66
79
|
}
|
|
@@ -69,5 +82,5 @@ const O = ({ control: l, name: n, showTimeSelector: m = !1, label: p, placeholde
|
|
|
69
82
|
);
|
|
70
83
|
};
|
|
71
84
|
export {
|
|
72
|
-
|
|
85
|
+
Q as default
|
|
73
86
|
};
|