@charlesgomes/leafcode-shared-lib-react 1.0.57 → 1.0.59
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/index.css +5 -5
- package/dist/index.d.mts +168 -3
- package/dist/index.d.ts +168 -3
- package/dist/index.js +803 -130
- package/dist/index.mjs +803 -124
- package/dist/styles/base.css +20 -0
- package/dist/styles/button.css +41 -47
- package/dist/styles/input.css +246 -0
- package/dist/styles/modalBase.css +99 -0
- package/dist/styles/table.css +5 -5
- package/package.json +10 -2
package/dist/index.mjs
CHANGED
|
@@ -1,5 +1,89 @@
|
|
|
1
|
+
// src/provider/ThemeProvider.tsx
|
|
2
|
+
import merge from "lodash.merge";
|
|
3
|
+
import { createContext, useContext } from "react";
|
|
4
|
+
|
|
5
|
+
// src/provider/defaultTheme.ts
|
|
6
|
+
var defaultTheme = {
|
|
7
|
+
colors: {
|
|
8
|
+
primary: "#00875F",
|
|
9
|
+
danger: "#ED202E",
|
|
10
|
+
border: "#D4D4D8",
|
|
11
|
+
text: "#18181B",
|
|
12
|
+
light: "#FFFFFF",
|
|
13
|
+
background: "#FFFFFF"
|
|
14
|
+
},
|
|
15
|
+
fonts: {
|
|
16
|
+
body: "Roboto, sans-serif",
|
|
17
|
+
heading: "Roboto, sans-serif"
|
|
18
|
+
},
|
|
19
|
+
radius: {
|
|
20
|
+
sm: "4px",
|
|
21
|
+
md: "6px",
|
|
22
|
+
lg: "10px"
|
|
23
|
+
},
|
|
24
|
+
components: {
|
|
25
|
+
input: {
|
|
26
|
+
colors: {
|
|
27
|
+
border: "#D4D4D8",
|
|
28
|
+
focusBorder: "#00875F",
|
|
29
|
+
errorBorder: "#ED202E",
|
|
30
|
+
background: "#FFFFFF",
|
|
31
|
+
text: "#18181B",
|
|
32
|
+
placeholder: "#71717A",
|
|
33
|
+
passwordToggle: "#71717A"
|
|
34
|
+
},
|
|
35
|
+
fonts: {
|
|
36
|
+
label: "Roboto, sans-serif",
|
|
37
|
+
input: "Roboto, sans-serif",
|
|
38
|
+
labelSize: "12px",
|
|
39
|
+
inputSize: "14px",
|
|
40
|
+
labelWeight: 600,
|
|
41
|
+
inputWeight: 400
|
|
42
|
+
},
|
|
43
|
+
sizes: {
|
|
44
|
+
height: "44px",
|
|
45
|
+
heightTextArea: "6rem",
|
|
46
|
+
radius: "6px"
|
|
47
|
+
}
|
|
48
|
+
},
|
|
49
|
+
button: {
|
|
50
|
+
colors: {
|
|
51
|
+
text: "#FFFFFF",
|
|
52
|
+
primaryBg: "#6366f1",
|
|
53
|
+
primaryHoverBg: "#4f46e5",
|
|
54
|
+
secondaryBg: "#bf1717",
|
|
55
|
+
secondaryHoverBg: "#f35353",
|
|
56
|
+
disabledBorder: "#a1a1aa",
|
|
57
|
+
disabledBg: "#d4d4d8"
|
|
58
|
+
},
|
|
59
|
+
fonts: {
|
|
60
|
+
family: '"Roboto", sans-serif',
|
|
61
|
+
weight: 600,
|
|
62
|
+
size: "13px"
|
|
63
|
+
},
|
|
64
|
+
sizes: {
|
|
65
|
+
height: "2.5rem",
|
|
66
|
+
minWidth: "8rem",
|
|
67
|
+
radius: "6px"
|
|
68
|
+
}
|
|
69
|
+
}
|
|
70
|
+
}
|
|
71
|
+
};
|
|
72
|
+
|
|
73
|
+
// src/provider/ThemeProvider.tsx
|
|
74
|
+
import { jsx } from "react/jsx-runtime";
|
|
75
|
+
var ThemeContext = createContext(defaultTheme);
|
|
76
|
+
var LeafcodeThemeProvider = ({
|
|
77
|
+
children,
|
|
78
|
+
theme
|
|
79
|
+
}) => {
|
|
80
|
+
const mergedTheme = merge({}, defaultTheme, theme);
|
|
81
|
+
return /* @__PURE__ */ jsx(ThemeContext.Provider, { value: mergedTheme, children });
|
|
82
|
+
};
|
|
83
|
+
var useLeafcodeTheme = () => useContext(ThemeContext);
|
|
84
|
+
|
|
1
85
|
// src/components/Button/Button.tsx
|
|
2
|
-
import { jsx, jsxs } from "react/jsx-runtime";
|
|
86
|
+
import { jsx as jsx2, jsxs } from "react/jsx-runtime";
|
|
3
87
|
function Button({
|
|
4
88
|
disabled,
|
|
5
89
|
loading,
|
|
@@ -9,15 +93,32 @@ function Button({
|
|
|
9
93
|
title,
|
|
10
94
|
...rest
|
|
11
95
|
}) {
|
|
12
|
-
|
|
96
|
+
const theme = useLeafcodeTheme();
|
|
97
|
+
const styleVars = {
|
|
98
|
+
"--button-font-family": theme.components.button.fonts.family,
|
|
99
|
+
"--button-font-weight": theme.components.button.fonts.weight,
|
|
100
|
+
"--button-font-size": theme.components.button.fonts.size,
|
|
101
|
+
"--button-text-color": theme.components.button.colors.text,
|
|
102
|
+
"--button-primary-bg": theme.components.button.colors.primaryBg,
|
|
103
|
+
"--button-primary-hover-bg": theme.components.button.colors.primaryHoverBg,
|
|
104
|
+
"--button-secondary-bg": theme.components.button.colors.secondaryBg,
|
|
105
|
+
"--button-secondary-hover-bg": theme.components.button.colors.secondaryHoverBg,
|
|
106
|
+
"--button-disabled-bg": theme.components.button.colors.disabledBg,
|
|
107
|
+
"--button-disabled-border": theme.components.button.colors.disabledBorder,
|
|
108
|
+
"--button-height": theme.components.button.sizes.height,
|
|
109
|
+
"--button-min-width": theme.components.button.sizes.minWidth,
|
|
110
|
+
"--button-border-radius": theme.components.button.sizes.radius
|
|
111
|
+
};
|
|
112
|
+
return /* @__PURE__ */ jsx2(
|
|
13
113
|
"button",
|
|
14
114
|
{
|
|
15
115
|
type,
|
|
16
|
-
|
|
116
|
+
style: styleVars,
|
|
117
|
+
className: `box-button ${disabled || loading ? "button-disabled" : color === "danger" ? "button-secundary" : "button-primary"}`,
|
|
17
118
|
onClick: !loading ? onClick : void 0,
|
|
18
119
|
disabled: disabled || loading,
|
|
19
120
|
...rest,
|
|
20
|
-
children: loading ? /* @__PURE__ */
|
|
121
|
+
children: loading ? /* @__PURE__ */ jsx2("span", { className: "box-loading", children: /* @__PURE__ */ jsxs(
|
|
21
122
|
"svg",
|
|
22
123
|
{
|
|
23
124
|
className: "animate-spin",
|
|
@@ -25,7 +126,7 @@ function Button({
|
|
|
25
126
|
fill: "none",
|
|
26
127
|
viewBox: "0 0 24 24",
|
|
27
128
|
children: [
|
|
28
|
-
/* @__PURE__ */
|
|
129
|
+
/* @__PURE__ */ jsx2(
|
|
29
130
|
"circle",
|
|
30
131
|
{
|
|
31
132
|
className: "opacity-01",
|
|
@@ -36,7 +137,7 @@ function Button({
|
|
|
36
137
|
strokeWidth: "4"
|
|
37
138
|
}
|
|
38
139
|
),
|
|
39
|
-
/* @__PURE__ */
|
|
140
|
+
/* @__PURE__ */ jsx2(
|
|
40
141
|
"path",
|
|
41
142
|
{
|
|
42
143
|
className: "opacity-02",
|
|
@@ -46,23 +147,400 @@ function Button({
|
|
|
46
147
|
)
|
|
47
148
|
]
|
|
48
149
|
}
|
|
49
|
-
) }) : /* @__PURE__ */
|
|
150
|
+
) }) : /* @__PURE__ */ jsx2("span", { children: title })
|
|
151
|
+
}
|
|
152
|
+
);
|
|
153
|
+
}
|
|
154
|
+
|
|
155
|
+
// src/components/Input/Input.tsx
|
|
156
|
+
import {
|
|
157
|
+
forwardRef,
|
|
158
|
+
useState as useState2
|
|
159
|
+
} from "react";
|
|
160
|
+
|
|
161
|
+
// src/components/Tooltips/TooltipErrorInput.tsx
|
|
162
|
+
import { WarningCircle, X } from "@phosphor-icons/react";
|
|
163
|
+
import { useEffect, useState } from "react";
|
|
164
|
+
import { Tooltip } from "react-tooltip";
|
|
165
|
+
import { Fragment, jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
166
|
+
function TooltipErrorInput({
|
|
167
|
+
error,
|
|
168
|
+
name,
|
|
169
|
+
isSelect = false,
|
|
170
|
+
isInvalid = false
|
|
171
|
+
}) {
|
|
172
|
+
const [isTooltipOpen, setIsTooltipOpen] = useState(true);
|
|
173
|
+
const handleClose = () => setIsTooltipOpen(false);
|
|
174
|
+
useEffect(() => {
|
|
175
|
+
setIsTooltipOpen(true);
|
|
176
|
+
}, [error]);
|
|
177
|
+
return /* @__PURE__ */ jsx3(
|
|
178
|
+
"div",
|
|
179
|
+
{
|
|
180
|
+
className: `absolute ${isSelect ? isInvalid ? "right-[4.5rem]" : "right-11" : "right-2"} top-1/2 transform -translate-y-1/2 cursor-pointer z-20`,
|
|
181
|
+
children: /* @__PURE__ */ jsx3(Fragment, { children: error?.message && /* @__PURE__ */ jsxs2(Fragment, { children: [
|
|
182
|
+
/* @__PURE__ */ jsx3(
|
|
183
|
+
"a",
|
|
184
|
+
{
|
|
185
|
+
"data-tooltip-id": name,
|
|
186
|
+
"data-tooltip-content": "",
|
|
187
|
+
"data-tooltip-place": "top-end",
|
|
188
|
+
onClick: () => setIsTooltipOpen(true),
|
|
189
|
+
children: /* @__PURE__ */ jsx3(WarningCircle, { size: 22, className: "text-red-400" })
|
|
190
|
+
}
|
|
191
|
+
),
|
|
192
|
+
/* @__PURE__ */ jsx3(
|
|
193
|
+
Tooltip,
|
|
194
|
+
{
|
|
195
|
+
className: "max-w-[15rem] relative z-50 tooltip-content cursor-default",
|
|
196
|
+
id: name,
|
|
197
|
+
style: {
|
|
198
|
+
backgroundColor: "#f87171",
|
|
199
|
+
color: "#fff",
|
|
200
|
+
padding: "8px 14px"
|
|
201
|
+
},
|
|
202
|
+
opacity: 1,
|
|
203
|
+
delayShow: 300,
|
|
204
|
+
delayHide: 150,
|
|
205
|
+
clickable: true,
|
|
206
|
+
openOnClick: true,
|
|
207
|
+
isOpen: isTooltipOpen,
|
|
208
|
+
children: isTooltipOpen && /* @__PURE__ */ jsxs2("div", { className: "flex justify-between gap-1 items-center font-Roboto text-[13px] leading-[125%] transition-all", children: [
|
|
209
|
+
/* @__PURE__ */ jsx3("span", { children: error?.message }),
|
|
210
|
+
/* @__PURE__ */ jsx3(
|
|
211
|
+
"button",
|
|
212
|
+
{
|
|
213
|
+
onClick: handleClose,
|
|
214
|
+
className: "text-white hover:text-black",
|
|
215
|
+
style: {
|
|
216
|
+
border: "none",
|
|
217
|
+
background: "transparent",
|
|
218
|
+
cursor: "pointer"
|
|
219
|
+
},
|
|
220
|
+
children: /* @__PURE__ */ jsx3(X, { size: 16, weight: "bold" })
|
|
221
|
+
}
|
|
222
|
+
)
|
|
223
|
+
] })
|
|
224
|
+
}
|
|
225
|
+
)
|
|
226
|
+
] }) })
|
|
50
227
|
}
|
|
51
228
|
);
|
|
52
229
|
}
|
|
53
230
|
|
|
231
|
+
// src/components/Input/Input.tsx
|
|
232
|
+
import { Eye, EyeSlash } from "@phosphor-icons/react";
|
|
233
|
+
import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
|
|
234
|
+
var InputBase = ({
|
|
235
|
+
name,
|
|
236
|
+
label,
|
|
237
|
+
placeholder,
|
|
238
|
+
onFocus,
|
|
239
|
+
error = null,
|
|
240
|
+
disabled,
|
|
241
|
+
isUppercaseLabel = true,
|
|
242
|
+
isUppercaseText = false,
|
|
243
|
+
validationMode = "default",
|
|
244
|
+
showPasswordToggle = false,
|
|
245
|
+
onChange,
|
|
246
|
+
value,
|
|
247
|
+
...rest
|
|
248
|
+
}, ref) => {
|
|
249
|
+
const theme = useLeafcodeTheme();
|
|
250
|
+
const styleVars = {
|
|
251
|
+
// Fonts
|
|
252
|
+
"--label-font-family": theme.components.input.fonts.label,
|
|
253
|
+
"--label-font-weight": theme.components.input.fonts.labelWeight,
|
|
254
|
+
"--label-font-size": theme.components.input.fonts.labelSize,
|
|
255
|
+
"--input-font-family": theme.components.input.fonts.input,
|
|
256
|
+
"--input-font-weight": theme.components.input.fonts.inputWeight,
|
|
257
|
+
"--input-font-size": theme.components.input.fonts.inputSize,
|
|
258
|
+
// Colors
|
|
259
|
+
"--label-color": theme.components.input.colors.text,
|
|
260
|
+
"--input-border": theme.components.input.colors.border,
|
|
261
|
+
"--input-bg": theme.components.input.colors.background,
|
|
262
|
+
"--input-text-color": theme.components.input.colors.text,
|
|
263
|
+
"--input-placeholder": theme.components.input.colors.placeholder,
|
|
264
|
+
"--input-focus-border": theme.components.input.colors.focusBorder,
|
|
265
|
+
"--input-error-border": theme.components.input.colors.errorBorder,
|
|
266
|
+
"--color-password-toggle": theme.components.input.colors.passwordToggle,
|
|
267
|
+
// Sizes
|
|
268
|
+
"--input-height": theme.components.input.sizes.height,
|
|
269
|
+
"--input-border-radius": theme.components.input.sizes.radius
|
|
270
|
+
};
|
|
271
|
+
const handleChange = (e) => {
|
|
272
|
+
let val = e.target.value;
|
|
273
|
+
if (validationMode === "restricted") {
|
|
274
|
+
val = val.replace(/[^a-zA-Z0-9_.-]/g, "");
|
|
275
|
+
val = val.replace(/^\.+/, "");
|
|
276
|
+
val = val.replace(/\.+$/, "");
|
|
277
|
+
val = val.replace(/\s+/g, "");
|
|
278
|
+
}
|
|
279
|
+
e.target.value = val;
|
|
280
|
+
onChange?.(e);
|
|
281
|
+
};
|
|
282
|
+
const [show, setShow] = useState2(false);
|
|
283
|
+
const handleClick = () => setShow(!show);
|
|
284
|
+
return /* @__PURE__ */ jsxs3(
|
|
285
|
+
"div",
|
|
286
|
+
{
|
|
287
|
+
className: `input-wrapper ${disabled ? "is-disabled" : ""}`,
|
|
288
|
+
style: styleVars,
|
|
289
|
+
children: [
|
|
290
|
+
!!label && /* @__PURE__ */ jsx4(
|
|
291
|
+
"label",
|
|
292
|
+
{
|
|
293
|
+
className: `label-input ${isUppercaseLabel && "is-uppercase"}`,
|
|
294
|
+
htmlFor: name,
|
|
295
|
+
children: label
|
|
296
|
+
}
|
|
297
|
+
),
|
|
298
|
+
/* @__PURE__ */ jsxs3("div", { style: { position: "relative", width: "100%" }, children: [
|
|
299
|
+
/* @__PURE__ */ jsx4(
|
|
300
|
+
"input",
|
|
301
|
+
{
|
|
302
|
+
id: name,
|
|
303
|
+
name,
|
|
304
|
+
disabled,
|
|
305
|
+
type: show ? "text" : "password",
|
|
306
|
+
className: `input ${error && "input-error"} ${isUppercaseText && "is-uppercase"}`,
|
|
307
|
+
placeholder,
|
|
308
|
+
onFocus,
|
|
309
|
+
onChange: handleChange,
|
|
310
|
+
value,
|
|
311
|
+
ref,
|
|
312
|
+
...rest
|
|
313
|
+
}
|
|
314
|
+
),
|
|
315
|
+
showPasswordToggle && /* @__PURE__ */ jsx4(
|
|
316
|
+
"div",
|
|
317
|
+
{
|
|
318
|
+
onClick: handleClick,
|
|
319
|
+
className: `password-toggle ${error ? "error" : "no-error"}`,
|
|
320
|
+
children: show ? /* @__PURE__ */ jsx4(Eye, { size: 21 }) : /* @__PURE__ */ jsx4(EyeSlash, { size: 21 })
|
|
321
|
+
}
|
|
322
|
+
)
|
|
323
|
+
] }),
|
|
324
|
+
/* @__PURE__ */ jsx4(TooltipErrorInput, { error, name })
|
|
325
|
+
]
|
|
326
|
+
}
|
|
327
|
+
);
|
|
328
|
+
};
|
|
329
|
+
var Input = forwardRef(InputBase);
|
|
330
|
+
|
|
331
|
+
// src/components/Input/TextArea.tsx
|
|
332
|
+
import { forwardRef as forwardRef2 } from "react";
|
|
333
|
+
import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
|
|
334
|
+
var TextAreaBase = ({
|
|
335
|
+
name,
|
|
336
|
+
label,
|
|
337
|
+
placeholder,
|
|
338
|
+
isUppercaseText = false,
|
|
339
|
+
isUppercaseLabel = true,
|
|
340
|
+
disabled,
|
|
341
|
+
onFocus,
|
|
342
|
+
error,
|
|
343
|
+
...rest
|
|
344
|
+
}, ref) => {
|
|
345
|
+
const theme = useLeafcodeTheme();
|
|
346
|
+
const styleVars = {
|
|
347
|
+
// Fonts
|
|
348
|
+
"--label-font-family": theme.components.input.fonts.label,
|
|
349
|
+
"--label-font-weight": theme.components.input.fonts.labelWeight,
|
|
350
|
+
"--label-font-size": theme.components.input.fonts.labelSize,
|
|
351
|
+
"--input-font-family": theme.components.input.fonts.input,
|
|
352
|
+
"--input-font-weight": theme.components.input.fonts.inputWeight,
|
|
353
|
+
"--input-font-size": theme.components.input.fonts.inputSize,
|
|
354
|
+
// Colors
|
|
355
|
+
"--label-color": theme.components.input.colors.text,
|
|
356
|
+
"--input-border": theme.components.input.colors.border,
|
|
357
|
+
"--input-bg": theme.components.input.colors.background,
|
|
358
|
+
"--input-text-color": theme.components.input.colors.text,
|
|
359
|
+
"--input-placeholder": theme.components.input.colors.placeholder,
|
|
360
|
+
"--input-focus-border": theme.components.input.colors.focusBorder,
|
|
361
|
+
"--input-error-border": theme.components.input.colors.errorBorder,
|
|
362
|
+
"--color-password-toggle": theme.components.input.colors.passwordToggle,
|
|
363
|
+
// Sizes
|
|
364
|
+
"--input-height-text-area": theme.components.input.sizes.heightTextArea,
|
|
365
|
+
"--input-border-radius": theme.components.input.sizes.radius
|
|
366
|
+
};
|
|
367
|
+
return /* @__PURE__ */ jsxs4(
|
|
368
|
+
"div",
|
|
369
|
+
{
|
|
370
|
+
className: `input-wrapper ${disabled ? "is-disabled" : ""}`,
|
|
371
|
+
style: styleVars,
|
|
372
|
+
children: [
|
|
373
|
+
!!label && /* @__PURE__ */ jsx5(
|
|
374
|
+
"label",
|
|
375
|
+
{
|
|
376
|
+
className: `label-input ${isUppercaseLabel ? "is-uppercase" : ""}`,
|
|
377
|
+
htmlFor: name,
|
|
378
|
+
children: label
|
|
379
|
+
}
|
|
380
|
+
),
|
|
381
|
+
/* @__PURE__ */ jsxs4("div", { style: { position: "relative", width: "100%" }, children: [
|
|
382
|
+
/* @__PURE__ */ jsx5(
|
|
383
|
+
"textarea",
|
|
384
|
+
{
|
|
385
|
+
ref,
|
|
386
|
+
id: name,
|
|
387
|
+
name,
|
|
388
|
+
disabled,
|
|
389
|
+
className: `input textArea ${error ? "input-error" : ""} ${isUppercaseText ? "is-uppercase" : ""}`,
|
|
390
|
+
placeholder,
|
|
391
|
+
onFocus,
|
|
392
|
+
...rest
|
|
393
|
+
}
|
|
394
|
+
),
|
|
395
|
+
/* @__PURE__ */ jsx5("div", { className: "absolute top-6 right-1", children: /* @__PURE__ */ jsx5(TooltipErrorInput, { error, name }) })
|
|
396
|
+
] })
|
|
397
|
+
]
|
|
398
|
+
}
|
|
399
|
+
);
|
|
400
|
+
};
|
|
401
|
+
var TextArea = forwardRef2(
|
|
402
|
+
TextAreaBase
|
|
403
|
+
);
|
|
404
|
+
|
|
405
|
+
// src/components/Input/InputSelect.tsx
|
|
406
|
+
import {
|
|
407
|
+
forwardRef as forwardRef3,
|
|
408
|
+
useEffect as useEffect2,
|
|
409
|
+
useState as useState3
|
|
410
|
+
} from "react";
|
|
411
|
+
import { Controller } from "react-hook-form";
|
|
412
|
+
import Select, { components } from "react-select";
|
|
413
|
+
import { Fragment as Fragment2, jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
|
|
414
|
+
var NoOptionsMessage = (props) => {
|
|
415
|
+
return /* @__PURE__ */ jsx6(components.NoOptionsMessage, { ...props, children: /* @__PURE__ */ jsx6("span", { className: "", children: "Nenhuma op\xE7\xE3o" }) });
|
|
416
|
+
};
|
|
417
|
+
var InputBase2 = ({
|
|
418
|
+
name,
|
|
419
|
+
control,
|
|
420
|
+
options,
|
|
421
|
+
isMulti,
|
|
422
|
+
closeMenuOnSelect,
|
|
423
|
+
isClearable = true,
|
|
424
|
+
label,
|
|
425
|
+
placeholder,
|
|
426
|
+
error = null,
|
|
427
|
+
disabled,
|
|
428
|
+
onSelect,
|
|
429
|
+
isUppercaseLabel = true
|
|
430
|
+
}, ref) => {
|
|
431
|
+
const theme = useLeafcodeTheme();
|
|
432
|
+
const styleVars = {
|
|
433
|
+
// Fonts
|
|
434
|
+
"--label-font-family": theme.components.input.fonts.label,
|
|
435
|
+
"--label-font-weight": theme.components.input.fonts.labelWeight,
|
|
436
|
+
"--label-font-size": theme.components.input.fonts.labelSize,
|
|
437
|
+
"--input-font-family": theme.components.input.fonts.input,
|
|
438
|
+
"--input-font-weight": theme.components.input.fonts.inputWeight,
|
|
439
|
+
"--input-font-size": theme.components.input.fonts.inputSize,
|
|
440
|
+
// Colors
|
|
441
|
+
"--label-color": theme.components.input.colors.text,
|
|
442
|
+
"--input-border": theme.components.input.colors.border,
|
|
443
|
+
"--input-bg": theme.components.input.colors.background,
|
|
444
|
+
"--input-text-color": theme.colors.light,
|
|
445
|
+
"--input-placeholder": theme.components.input.colors.placeholder,
|
|
446
|
+
"--input-focus-border": theme.components.input.colors.focusBorder,
|
|
447
|
+
"--input-error-border": theme.components.input.colors.errorBorder,
|
|
448
|
+
"--color-password-toggle": theme.components.input.colors.passwordToggle,
|
|
449
|
+
// Sizes
|
|
450
|
+
"--input-height": theme.components.input.sizes.height,
|
|
451
|
+
"--input-border-radius": theme.components.input.sizes.radius
|
|
452
|
+
};
|
|
453
|
+
const [menuPortalTarget, setMenuPortalTarget] = useState3(
|
|
454
|
+
null
|
|
455
|
+
);
|
|
456
|
+
useEffect2(() => {
|
|
457
|
+
setMenuPortalTarget(document.body);
|
|
458
|
+
}, []);
|
|
459
|
+
return /* @__PURE__ */ jsxs5("div", { className: "input-wrapper", style: styleVars, children: [
|
|
460
|
+
!!label && /* @__PURE__ */ jsx6(
|
|
461
|
+
"label",
|
|
462
|
+
{
|
|
463
|
+
className: `label-input ${isUppercaseLabel && "is-uppercase"}`,
|
|
464
|
+
htmlFor: name,
|
|
465
|
+
children: label
|
|
466
|
+
}
|
|
467
|
+
),
|
|
468
|
+
/* @__PURE__ */ jsx6(
|
|
469
|
+
Controller,
|
|
470
|
+
{
|
|
471
|
+
name,
|
|
472
|
+
control,
|
|
473
|
+
render: ({ field: { onChange, ref: ref2, value } }) => {
|
|
474
|
+
const selectedOption = options.find(
|
|
475
|
+
(option) => option.value === value
|
|
476
|
+
);
|
|
477
|
+
const displayValue = value?.label ? value : selectedOption || { label: value, value };
|
|
478
|
+
return /* @__PURE__ */ jsxs5(Fragment2, { children: [
|
|
479
|
+
/* @__PURE__ */ jsx6(
|
|
480
|
+
Select,
|
|
481
|
+
{
|
|
482
|
+
ref: ref2,
|
|
483
|
+
id: "long-value-select",
|
|
484
|
+
instanceId: "long-value-select",
|
|
485
|
+
placeholder,
|
|
486
|
+
isClearable,
|
|
487
|
+
closeMenuOnSelect,
|
|
488
|
+
menuPortalTarget,
|
|
489
|
+
isMulti,
|
|
490
|
+
isSearchable: false,
|
|
491
|
+
menuPlacement: "auto",
|
|
492
|
+
className: "react-select-container",
|
|
493
|
+
components: { NoOptionsMessage },
|
|
494
|
+
classNamePrefix: "react-select",
|
|
495
|
+
isDisabled: disabled,
|
|
496
|
+
options,
|
|
497
|
+
value: displayValue.label !== null && displayValue.label !== void 0 ? displayValue : null,
|
|
498
|
+
onChange: (e) => {
|
|
499
|
+
onChange(e);
|
|
500
|
+
onSelect && onSelect();
|
|
501
|
+
},
|
|
502
|
+
styles: {
|
|
503
|
+
control: (baseStyles) => ({
|
|
504
|
+
...baseStyles,
|
|
505
|
+
boxShadow: "none"
|
|
506
|
+
}),
|
|
507
|
+
menuPortal: (base) => ({
|
|
508
|
+
...base,
|
|
509
|
+
zIndex: 99,
|
|
510
|
+
...styleVars
|
|
511
|
+
})
|
|
512
|
+
}
|
|
513
|
+
}
|
|
514
|
+
),
|
|
515
|
+
/* @__PURE__ */ jsx6(
|
|
516
|
+
TooltipErrorInput,
|
|
517
|
+
{
|
|
518
|
+
error,
|
|
519
|
+
name,
|
|
520
|
+
isSelect: true,
|
|
521
|
+
isInvalid: value && error?.message
|
|
522
|
+
}
|
|
523
|
+
)
|
|
524
|
+
] });
|
|
525
|
+
}
|
|
526
|
+
}
|
|
527
|
+
)
|
|
528
|
+
] });
|
|
529
|
+
};
|
|
530
|
+
var InputSelect = forwardRef3(InputBase2);
|
|
531
|
+
|
|
54
532
|
// src/components/ModalBase/ModalBase.tsx
|
|
55
|
-
import { X } from "@phosphor-icons/react";
|
|
533
|
+
import { X as X2 } from "@phosphor-icons/react";
|
|
56
534
|
|
|
57
535
|
// src/components/ModalBase/FooterButtons.tsx
|
|
58
|
-
import { jsx as
|
|
536
|
+
import { jsx as jsx7 } from "react/jsx-runtime";
|
|
59
537
|
function FooterButtons({ children }) {
|
|
60
|
-
return /* @__PURE__ */
|
|
538
|
+
return /* @__PURE__ */ jsx7("div", { className: "modal-footer", children });
|
|
61
539
|
}
|
|
62
540
|
|
|
63
541
|
// src/components/ModalBase/ModalBase.tsx
|
|
64
|
-
import { useEffect } from "react";
|
|
65
|
-
import { Fragment, jsx as
|
|
542
|
+
import { useEffect as useEffect3 } from "react";
|
|
543
|
+
import { Fragment as Fragment3, jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
|
|
66
544
|
function ModalBase({
|
|
67
545
|
show,
|
|
68
546
|
onHide,
|
|
@@ -72,9 +550,25 @@ function ModalBase({
|
|
|
72
550
|
loading,
|
|
73
551
|
btnCancel = "Cancel",
|
|
74
552
|
btnSuccess = "Save",
|
|
75
|
-
|
|
553
|
+
type = "button",
|
|
554
|
+
disabledBtnSuccess,
|
|
555
|
+
colors,
|
|
556
|
+
fonts,
|
|
557
|
+
modalMaxWidth
|
|
76
558
|
}) {
|
|
77
|
-
|
|
559
|
+
const styleVars = {
|
|
560
|
+
"--modal-title-font-weight": fonts?.modalTitleFontWeight,
|
|
561
|
+
"--modal-title-font-size": fonts?.modalTitleFontSize,
|
|
562
|
+
"--modal-title-font-family": fonts?.modalTitleFontFamily,
|
|
563
|
+
"--modal-body-font-family": fonts?.modalBodyFontFamily,
|
|
564
|
+
"--modal-body-font-size": fonts?.modalBodyFontSize,
|
|
565
|
+
"--modal-bg-color": colors?.modalBgColor,
|
|
566
|
+
"--modal-title-color": colors?.modalTitleColor,
|
|
567
|
+
"--modal-body-color": colors?.modalBodyColor,
|
|
568
|
+
"--modal-close-color": colors?.modalCloseColor,
|
|
569
|
+
"--modal-max-width": modalMaxWidth?.modalMaxWidth
|
|
570
|
+
};
|
|
571
|
+
useEffect3(() => {
|
|
78
572
|
const handleKeyDown = (event) => {
|
|
79
573
|
if (event.key === "Escape") {
|
|
80
574
|
onHide();
|
|
@@ -85,22 +579,15 @@ function ModalBase({
|
|
|
85
579
|
document.removeEventListener("keydown", handleKeyDown);
|
|
86
580
|
};
|
|
87
581
|
}, [onHide]);
|
|
88
|
-
return /* @__PURE__ */
|
|
89
|
-
/* @__PURE__ */
|
|
90
|
-
/* @__PURE__ */
|
|
91
|
-
/* @__PURE__ */
|
|
92
|
-
/* @__PURE__ */
|
|
93
|
-
"button",
|
|
94
|
-
{
|
|
95
|
-
className: "p-1 ml-auto mr-1 cursor-pointer",
|
|
96
|
-
onClick: onHide,
|
|
97
|
-
children: /* @__PURE__ */ jsx3(X, { size: 18, color: "#ffffff" })
|
|
98
|
-
}
|
|
99
|
-
)
|
|
582
|
+
return /* @__PURE__ */ jsx8(Fragment3, { children: show ? /* @__PURE__ */ jsxs6(Fragment3, { children: [
|
|
583
|
+
/* @__PURE__ */ jsx8("div", { className: "modal-overlay", style: styleVars, children: /* @__PURE__ */ jsx8("div", { className: "modal-wrapper", children: /* @__PURE__ */ jsxs6("div", { className: "modal-content", children: [
|
|
584
|
+
/* @__PURE__ */ jsxs6("div", { className: "modal-header", children: [
|
|
585
|
+
/* @__PURE__ */ jsx8("h3", { className: "modal-title", children: title }),
|
|
586
|
+
/* @__PURE__ */ jsx8("button", { className: "modal-close", type: "button", onClick: onHide, children: /* @__PURE__ */ jsx8(X2, { size: 18, className: "button-close" }) })
|
|
100
587
|
] }),
|
|
101
|
-
/* @__PURE__ */
|
|
102
|
-
/* @__PURE__ */
|
|
103
|
-
/* @__PURE__ */
|
|
588
|
+
/* @__PURE__ */ jsx8("div", { className: "modal-body", children }),
|
|
589
|
+
/* @__PURE__ */ jsxs6(FooterButtons, { children: [
|
|
590
|
+
/* @__PURE__ */ jsx8(
|
|
104
591
|
Button,
|
|
105
592
|
{
|
|
106
593
|
color: "danger",
|
|
@@ -109,10 +596,10 @@ function ModalBase({
|
|
|
109
596
|
onClick: onHide
|
|
110
597
|
}
|
|
111
598
|
),
|
|
112
|
-
/* @__PURE__ */
|
|
599
|
+
/* @__PURE__ */ jsx8(
|
|
113
600
|
Button,
|
|
114
601
|
{
|
|
115
|
-
type
|
|
602
|
+
type,
|
|
116
603
|
title: btnSuccess,
|
|
117
604
|
onClick: onAction,
|
|
118
605
|
loading,
|
|
@@ -121,16 +608,202 @@ function ModalBase({
|
|
|
121
608
|
)
|
|
122
609
|
] })
|
|
123
610
|
] }) }) }),
|
|
124
|
-
/* @__PURE__ */
|
|
611
|
+
/* @__PURE__ */ jsx8("div", { className: "modal-backdrop" })
|
|
125
612
|
] }) : null });
|
|
126
613
|
}
|
|
127
614
|
|
|
615
|
+
// src/components/Input/InputAutocomplete.tsx
|
|
616
|
+
import { X as X3 } from "@phosphor-icons/react";
|
|
617
|
+
import _ from "lodash";
|
|
618
|
+
import {
|
|
619
|
+
forwardRef as forwardRef4,
|
|
620
|
+
useEffect as useEffect4,
|
|
621
|
+
useRef,
|
|
622
|
+
useState as useState4
|
|
623
|
+
} from "react";
|
|
624
|
+
import { useQuery } from "@tanstack/react-query";
|
|
625
|
+
|
|
626
|
+
// src/components/Loading/Loading.tsx
|
|
627
|
+
import { memo } from "react";
|
|
628
|
+
import { jsx as jsx9 } from "react/jsx-runtime";
|
|
629
|
+
var LoadingSpinner = memo(
|
|
630
|
+
({ size = 24, color = "#00875F" }) => {
|
|
631
|
+
return /* @__PURE__ */ jsx9(
|
|
632
|
+
"span",
|
|
633
|
+
{
|
|
634
|
+
style: {
|
|
635
|
+
width: size,
|
|
636
|
+
height: size,
|
|
637
|
+
border: `3px solid ${color}33`,
|
|
638
|
+
borderTopColor: color,
|
|
639
|
+
borderRadius: "50%",
|
|
640
|
+
display: "inline-block",
|
|
641
|
+
animation: "leafcode-spin 0.8s linear infinite"
|
|
642
|
+
},
|
|
643
|
+
"aria-label": "Carregando"
|
|
644
|
+
}
|
|
645
|
+
);
|
|
646
|
+
}
|
|
647
|
+
);
|
|
648
|
+
LoadingSpinner.displayName = "LoadingSpinner";
|
|
649
|
+
|
|
650
|
+
// src/components/Input/InputAutocomplete.tsx
|
|
651
|
+
import { jsx as jsx10, jsxs as jsxs7 } from "react/jsx-runtime";
|
|
652
|
+
var PAGE_SIZE = 10;
|
|
653
|
+
var InputBase3 = ({
|
|
654
|
+
name,
|
|
655
|
+
label,
|
|
656
|
+
error,
|
|
657
|
+
onSelect,
|
|
658
|
+
defaultValue,
|
|
659
|
+
inputAutocompleteActive,
|
|
660
|
+
queryKey,
|
|
661
|
+
mutationFn,
|
|
662
|
+
renderOption,
|
|
663
|
+
disabled,
|
|
664
|
+
placeholder,
|
|
665
|
+
isUppercaseLabel = true,
|
|
666
|
+
...rest
|
|
667
|
+
}, ref) => {
|
|
668
|
+
const theme = useLeafcodeTheme();
|
|
669
|
+
const styleVars = {
|
|
670
|
+
"--label-font-family": theme.components.input.fonts.label,
|
|
671
|
+
"--label-font-weight": theme.components.input.fonts.labelWeight,
|
|
672
|
+
"--label-font-size": theme.components.input.fonts.labelSize,
|
|
673
|
+
"--dropdown-empty-color": theme.components.input.colors.text,
|
|
674
|
+
"--dropdown-item-hover-bg-color": theme.colors.primary,
|
|
675
|
+
"--label-color": theme.components.input.colors.text,
|
|
676
|
+
"--input-border": theme.components.input.colors.border,
|
|
677
|
+
"--input-bg": theme.components.input.colors.background,
|
|
678
|
+
"--input-text-color": theme.components.input.colors.text,
|
|
679
|
+
"--input-focus-border": theme.components.input.colors.focusBorder,
|
|
680
|
+
"--dropdown-item-hover-color": theme.colors.light,
|
|
681
|
+
"--input-height": theme.components.input.sizes.height,
|
|
682
|
+
"--input-border-radius": theme.components.input.sizes.radius
|
|
683
|
+
};
|
|
684
|
+
const [value, setValue] = useState4("");
|
|
685
|
+
const [items, setItems] = useState4([]);
|
|
686
|
+
const [pageNumber, setPageNumber] = useState4(1);
|
|
687
|
+
const [search, setSearch] = useState4("");
|
|
688
|
+
const [isOpen, setIsOpen] = useState4(false);
|
|
689
|
+
const listRef = useRef(null);
|
|
690
|
+
const { data, isLoading } = useQuery({
|
|
691
|
+
queryKey: [queryKey, pageNumber, search],
|
|
692
|
+
queryFn: () => mutationFn(pageNumber, PAGE_SIZE, search),
|
|
693
|
+
enabled: isOpen
|
|
694
|
+
});
|
|
695
|
+
useEffect4(() => {
|
|
696
|
+
if (!data?.items) return;
|
|
697
|
+
setItems(
|
|
698
|
+
(prev) => pageNumber === 1 ? data.items : [...prev, ...data.items]
|
|
699
|
+
);
|
|
700
|
+
}, [data, pageNumber]);
|
|
701
|
+
useEffect4(() => {
|
|
702
|
+
const debounced = _.debounce(() => {
|
|
703
|
+
setPageNumber(1);
|
|
704
|
+
setItems([]);
|
|
705
|
+
setSearch(value);
|
|
706
|
+
}, 600);
|
|
707
|
+
debounced();
|
|
708
|
+
return () => debounced.cancel();
|
|
709
|
+
}, [value]);
|
|
710
|
+
useEffect4(() => {
|
|
711
|
+
if (!defaultValue) return;
|
|
712
|
+
setValue(defaultValue.label ?? defaultValue);
|
|
713
|
+
}, [defaultValue]);
|
|
714
|
+
const handleScroll = () => {
|
|
715
|
+
if (!listRef.current || !data) return;
|
|
716
|
+
const { scrollTop, clientHeight, scrollHeight } = listRef.current;
|
|
717
|
+
if (scrollTop + clientHeight >= scrollHeight - 10 && pageNumber < data.totalPages && !isLoading) {
|
|
718
|
+
setPageNumber((prev) => prev + 1);
|
|
719
|
+
}
|
|
720
|
+
};
|
|
721
|
+
const handleSelect = (item) => {
|
|
722
|
+
setValue(item.nome);
|
|
723
|
+
setIsOpen(false);
|
|
724
|
+
onSelect(item);
|
|
725
|
+
};
|
|
726
|
+
const renderDropdown = () => {
|
|
727
|
+
if (!isOpen) return null;
|
|
728
|
+
return /* @__PURE__ */ jsx10("div", { className: "dropdown-container", style: styleVars, children: /* @__PURE__ */ jsxs7("ul", { ref: listRef, onScroll: handleScroll, className: "dropdown-list", children: [
|
|
729
|
+
items.map((item) => /* @__PURE__ */ jsx10(
|
|
730
|
+
"li",
|
|
731
|
+
{
|
|
732
|
+
onClick: () => handleSelect(item),
|
|
733
|
+
className: "dropdown-item",
|
|
734
|
+
children: renderOption(item)
|
|
735
|
+
},
|
|
736
|
+
item.id
|
|
737
|
+
)),
|
|
738
|
+
isLoading && /* @__PURE__ */ jsx10("li", { className: "dropdown-loading", children: /* @__PURE__ */ jsx10(LoadingSpinner, { size: 24 }) }),
|
|
739
|
+
!isLoading && items.length === 0 && /* @__PURE__ */ jsx10("li", { className: "dropdown-empty", children: "N\xE3o encontrado" })
|
|
740
|
+
] }) });
|
|
741
|
+
};
|
|
742
|
+
return /* @__PURE__ */ jsxs7(
|
|
743
|
+
"div",
|
|
744
|
+
{
|
|
745
|
+
className: "input-wrapper",
|
|
746
|
+
style: styleVars,
|
|
747
|
+
tabIndex: -1,
|
|
748
|
+
onBlur: (e) => e.relatedTarget === null && setIsOpen(false),
|
|
749
|
+
children: [
|
|
750
|
+
label && /* @__PURE__ */ jsx10(
|
|
751
|
+
"label",
|
|
752
|
+
{
|
|
753
|
+
htmlFor: name,
|
|
754
|
+
className: `label-input ${isUppercaseLabel && "is-uppercase"}`,
|
|
755
|
+
children: label
|
|
756
|
+
}
|
|
757
|
+
),
|
|
758
|
+
/* @__PURE__ */ jsxs7("div", { style: { position: "relative", width: "100%" }, children: [
|
|
759
|
+
/* @__PURE__ */ jsx10(
|
|
760
|
+
"input",
|
|
761
|
+
{
|
|
762
|
+
ref,
|
|
763
|
+
id: name,
|
|
764
|
+
name,
|
|
765
|
+
disabled,
|
|
766
|
+
placeholder,
|
|
767
|
+
autoComplete: "off",
|
|
768
|
+
className: "input",
|
|
769
|
+
value,
|
|
770
|
+
onChange: (e) => {
|
|
771
|
+
setValue(e.target.value);
|
|
772
|
+
setIsOpen(true);
|
|
773
|
+
},
|
|
774
|
+
onFocus: () => setIsOpen(true),
|
|
775
|
+
...rest
|
|
776
|
+
}
|
|
777
|
+
),
|
|
778
|
+
value && /* @__PURE__ */ jsx10(
|
|
779
|
+
"button",
|
|
780
|
+
{
|
|
781
|
+
type: "button",
|
|
782
|
+
onClick: () => {
|
|
783
|
+
setValue("");
|
|
784
|
+
setItems([]);
|
|
785
|
+
setPageNumber(1);
|
|
786
|
+
onSelect(null);
|
|
787
|
+
},
|
|
788
|
+
className: "dropdown-clear",
|
|
789
|
+
children: /* @__PURE__ */ jsx10(X3, { size: 16, className: "icone-clear" })
|
|
790
|
+
}
|
|
791
|
+
),
|
|
792
|
+
renderDropdown()
|
|
793
|
+
] }),
|
|
794
|
+
!value && !isOpen && /* @__PURE__ */ jsx10(TooltipErrorInput, { error, name })
|
|
795
|
+
]
|
|
796
|
+
}
|
|
797
|
+
);
|
|
798
|
+
};
|
|
799
|
+
var InputAutoComplete = forwardRef4(InputBase3);
|
|
800
|
+
|
|
128
801
|
// src/components/DataTableAdvancedFilter/DataTableAdvancedFilter.tsx
|
|
129
|
-
import { useEffect as
|
|
802
|
+
import { useEffect as useEffect7, useState as useState7 } from "react";
|
|
130
803
|
|
|
131
804
|
// src/components/DataTableAdvancedFilter/DataTableAdvancedFilterWrapper.tsx
|
|
132
|
-
import { useEffect as
|
|
133
|
-
import { useQuery } from "@tanstack/react-query";
|
|
805
|
+
import { useEffect as useEffect6, useMemo, useState as useState6 } from "react";
|
|
806
|
+
import { useQuery as useQuery2 } from "@tanstack/react-query";
|
|
134
807
|
|
|
135
808
|
// src/primereact-compat.ts
|
|
136
809
|
import { DataTable } from "primereact/datatable";
|
|
@@ -141,8 +814,8 @@ import { Calendar } from "primereact/calendar";
|
|
|
141
814
|
import { FilterMatchMode } from "primereact/api";
|
|
142
815
|
|
|
143
816
|
// src/components/DataTableAdvancedFilter/TableHeader.tsx
|
|
144
|
-
import { X as
|
|
145
|
-
import { jsx as
|
|
817
|
+
import { X as X4 } from "@phosphor-icons/react";
|
|
818
|
+
import { jsx as jsx11, jsxs as jsxs8 } from "react/jsx-runtime";
|
|
146
819
|
var TableHeader = ({
|
|
147
820
|
globalFilterValue,
|
|
148
821
|
onGlobalFilterChange,
|
|
@@ -153,8 +826,8 @@ var TableHeader = ({
|
|
|
153
826
|
target: { value: "" }
|
|
154
827
|
});
|
|
155
828
|
};
|
|
156
|
-
return /* @__PURE__ */
|
|
157
|
-
/* @__PURE__ */
|
|
829
|
+
return /* @__PURE__ */ jsxs8("div", { style: { position: "relative" }, children: [
|
|
830
|
+
/* @__PURE__ */ jsx11(
|
|
158
831
|
InputText,
|
|
159
832
|
{
|
|
160
833
|
value: globalFilterValue,
|
|
@@ -163,7 +836,7 @@ var TableHeader = ({
|
|
|
163
836
|
className: "custom-input input-search"
|
|
164
837
|
}
|
|
165
838
|
),
|
|
166
|
-
/* @__PURE__ */
|
|
839
|
+
/* @__PURE__ */ jsx11(X4, { size: 16, className: "close-search", onClick: limparCampo })
|
|
167
840
|
] });
|
|
168
841
|
};
|
|
169
842
|
var TableHeader_default = TableHeader;
|
|
@@ -191,20 +864,20 @@ function centsToReal(value) {
|
|
|
191
864
|
}
|
|
192
865
|
|
|
193
866
|
// src/components/TooltipCustom.tsx
|
|
194
|
-
import { Tooltip } from "react-tooltip";
|
|
867
|
+
import { Tooltip as Tooltip2 } from "react-tooltip";
|
|
195
868
|
import { createPortal } from "react-dom";
|
|
196
|
-
import { jsx as
|
|
869
|
+
import { jsx as jsx12 } from "react/jsx-runtime";
|
|
197
870
|
function TooltipCustom({ label, id }) {
|
|
198
871
|
return createPortal(
|
|
199
|
-
/* @__PURE__ */
|
|
200
|
-
|
|
872
|
+
/* @__PURE__ */ jsx12(
|
|
873
|
+
Tooltip2,
|
|
201
874
|
{
|
|
202
875
|
anchorSelect: `#${id}`,
|
|
203
876
|
place: "top",
|
|
204
877
|
positionStrategy: "fixed",
|
|
205
878
|
className: "tooltip-icone",
|
|
206
879
|
style: { zIndex: 13 },
|
|
207
|
-
children: /* @__PURE__ */
|
|
880
|
+
children: /* @__PURE__ */ jsx12("div", { className: "tooltip-custom", children: label })
|
|
208
881
|
}
|
|
209
882
|
),
|
|
210
883
|
document.body
|
|
@@ -212,7 +885,7 @@ function TooltipCustom({ label, id }) {
|
|
|
212
885
|
}
|
|
213
886
|
|
|
214
887
|
// src/components/DataTableAdvancedFilter/TableActions.tsx
|
|
215
|
-
import { Fragment as
|
|
888
|
+
import { Fragment as Fragment4, jsx as jsx13, jsxs as jsxs9 } from "react/jsx-runtime";
|
|
216
889
|
function TableActions({
|
|
217
890
|
onNew,
|
|
218
891
|
onEdit,
|
|
@@ -224,9 +897,9 @@ function TableActions({
|
|
|
224
897
|
const disableButtonsNotMultiplesSelecteds = selectedRows?.length !== 1 ? true : false;
|
|
225
898
|
const enableButtonsNotMultiplesSelecteds = selectedRows?.length > 0 ? true : false;
|
|
226
899
|
const resolvedCustomActions = typeof customActions === "function" ? customActions(selectedRows) : customActions;
|
|
227
|
-
return /* @__PURE__ */
|
|
228
|
-
onNew && /* @__PURE__ */
|
|
229
|
-
/* @__PURE__ */
|
|
900
|
+
return /* @__PURE__ */ jsxs9("div", { className: "box-icones-table-actions", children: [
|
|
901
|
+
onNew && /* @__PURE__ */ jsxs9(Fragment4, { children: [
|
|
902
|
+
/* @__PURE__ */ jsx13(
|
|
230
903
|
"button",
|
|
231
904
|
{
|
|
232
905
|
id: "add",
|
|
@@ -237,10 +910,10 @@ function TableActions({
|
|
|
237
910
|
enableButtonsNotMultiplesSelecteds && "disable-button-table-actions"
|
|
238
911
|
),
|
|
239
912
|
disabled: enableButtonsNotMultiplesSelecteds,
|
|
240
|
-
children: /* @__PURE__ */
|
|
913
|
+
children: /* @__PURE__ */ jsx13(Plus, { size: 18 })
|
|
241
914
|
}
|
|
242
915
|
),
|
|
243
|
-
/* @__PURE__ */
|
|
916
|
+
/* @__PURE__ */ jsx13(
|
|
244
917
|
TooltipCustom,
|
|
245
918
|
{
|
|
246
919
|
id: "add",
|
|
@@ -248,7 +921,7 @@ function TableActions({
|
|
|
248
921
|
}
|
|
249
922
|
)
|
|
250
923
|
] }),
|
|
251
|
-
onEdit && /* @__PURE__ */
|
|
924
|
+
onEdit && /* @__PURE__ */ jsx13(Fragment4, { children: /* @__PURE__ */ jsxs9(
|
|
252
925
|
"button",
|
|
253
926
|
{
|
|
254
927
|
id: "edit",
|
|
@@ -260,8 +933,8 @@ function TableActions({
|
|
|
260
933
|
),
|
|
261
934
|
disabled: disableButtonsNotMultiplesSelecteds,
|
|
262
935
|
children: [
|
|
263
|
-
/* @__PURE__ */
|
|
264
|
-
/* @__PURE__ */
|
|
936
|
+
/* @__PURE__ */ jsx13(PencilSimple, { size: 18 }),
|
|
937
|
+
/* @__PURE__ */ jsx13(
|
|
265
938
|
TooltipCustom,
|
|
266
939
|
{
|
|
267
940
|
id: "edit",
|
|
@@ -271,7 +944,7 @@ function TableActions({
|
|
|
271
944
|
]
|
|
272
945
|
}
|
|
273
946
|
) }),
|
|
274
|
-
onDelete && /* @__PURE__ */
|
|
947
|
+
onDelete && /* @__PURE__ */ jsx13(Fragment4, { children: /* @__PURE__ */ jsxs9(
|
|
275
948
|
"button",
|
|
276
949
|
{
|
|
277
950
|
id: "delete",
|
|
@@ -283,8 +956,8 @@ function TableActions({
|
|
|
283
956
|
),
|
|
284
957
|
disabled: !enableButtonsNotMultiplesSelecteds,
|
|
285
958
|
children: [
|
|
286
|
-
/* @__PURE__ */
|
|
287
|
-
/* @__PURE__ */
|
|
959
|
+
/* @__PURE__ */ jsx13(Trash, { size: 18 }),
|
|
960
|
+
/* @__PURE__ */ jsx13(
|
|
288
961
|
TooltipCustom,
|
|
289
962
|
{
|
|
290
963
|
id: "delete",
|
|
@@ -296,7 +969,7 @@ function TableActions({
|
|
|
296
969
|
) }),
|
|
297
970
|
resolvedCustomActions?.map((action) => {
|
|
298
971
|
const id = `action-table${phraseToId(action.label)}`;
|
|
299
|
-
return /* @__PURE__ */
|
|
972
|
+
return /* @__PURE__ */ jsxs9(
|
|
300
973
|
"button",
|
|
301
974
|
{
|
|
302
975
|
id,
|
|
@@ -305,7 +978,7 @@ function TableActions({
|
|
|
305
978
|
className: cn("enable-button-table-actions", action.className),
|
|
306
979
|
children: [
|
|
307
980
|
action.icon,
|
|
308
|
-
/* @__PURE__ */
|
|
981
|
+
/* @__PURE__ */ jsx13(TooltipCustom, { id, label: action.label })
|
|
309
982
|
]
|
|
310
983
|
},
|
|
311
984
|
id
|
|
@@ -316,7 +989,7 @@ function TableActions({
|
|
|
316
989
|
|
|
317
990
|
// src/components/DataTableAdvancedFilter/ActionsColumn.tsx
|
|
318
991
|
import { PencilSimple as PencilSimple2, Trash as Trash2 } from "@phosphor-icons/react";
|
|
319
|
-
import { Fragment as
|
|
992
|
+
import { Fragment as Fragment5, jsx as jsx14, jsxs as jsxs10 } from "react/jsx-runtime";
|
|
320
993
|
function ActionsColumn({
|
|
321
994
|
row,
|
|
322
995
|
onEdit,
|
|
@@ -325,8 +998,8 @@ function ActionsColumn({
|
|
|
325
998
|
isLanguagePtBr
|
|
326
999
|
}) {
|
|
327
1000
|
const resolvedCustomActions = typeof customActionsColums === "function" ? customActionsColums(row) : customActionsColums;
|
|
328
|
-
return /* @__PURE__ */
|
|
329
|
-
onEdit && /* @__PURE__ */
|
|
1001
|
+
return /* @__PURE__ */ jsxs10("div", { className: "box-icones-actions-column", children: [
|
|
1002
|
+
onEdit && /* @__PURE__ */ jsx14(Fragment5, { children: /* @__PURE__ */ jsxs10(
|
|
330
1003
|
"button",
|
|
331
1004
|
{
|
|
332
1005
|
id: "edit-column",
|
|
@@ -336,8 +1009,8 @@ function ActionsColumn({
|
|
|
336
1009
|
onEdit && onEdit([row]);
|
|
337
1010
|
},
|
|
338
1011
|
children: [
|
|
339
|
-
/* @__PURE__ */
|
|
340
|
-
/* @__PURE__ */
|
|
1012
|
+
/* @__PURE__ */ jsx14(PencilSimple2, { size: 17, weight: "regular" }),
|
|
1013
|
+
/* @__PURE__ */ jsx14(
|
|
341
1014
|
TooltipCustom,
|
|
342
1015
|
{
|
|
343
1016
|
id: "edit-column",
|
|
@@ -347,7 +1020,7 @@ function ActionsColumn({
|
|
|
347
1020
|
]
|
|
348
1021
|
}
|
|
349
1022
|
) }),
|
|
350
|
-
onDelete && /* @__PURE__ */
|
|
1023
|
+
onDelete && /* @__PURE__ */ jsx14(Fragment5, { children: /* @__PURE__ */ jsxs10(
|
|
351
1024
|
"button",
|
|
352
1025
|
{
|
|
353
1026
|
id: "delete-column",
|
|
@@ -357,8 +1030,8 @@ function ActionsColumn({
|
|
|
357
1030
|
onDelete && onDelete([row]);
|
|
358
1031
|
},
|
|
359
1032
|
children: [
|
|
360
|
-
/* @__PURE__ */
|
|
361
|
-
/* @__PURE__ */
|
|
1033
|
+
/* @__PURE__ */ jsx14(Trash2, { size: 17, weight: "regular" }),
|
|
1034
|
+
/* @__PURE__ */ jsx14(
|
|
362
1035
|
TooltipCustom,
|
|
363
1036
|
{
|
|
364
1037
|
id: "delete-column",
|
|
@@ -370,7 +1043,7 @@ function ActionsColumn({
|
|
|
370
1043
|
) }),
|
|
371
1044
|
resolvedCustomActions?.map((action) => {
|
|
372
1045
|
const id = `action-colunm-${phraseToId(action.label)}`;
|
|
373
|
-
return /* @__PURE__ */
|
|
1046
|
+
return /* @__PURE__ */ jsxs10(
|
|
374
1047
|
"button",
|
|
375
1048
|
{
|
|
376
1049
|
id,
|
|
@@ -379,7 +1052,7 @@ function ActionsColumn({
|
|
|
379
1052
|
className: cn("btn-icone-actions-column", action.className),
|
|
380
1053
|
children: [
|
|
381
1054
|
action.icon,
|
|
382
|
-
/* @__PURE__ */
|
|
1055
|
+
/* @__PURE__ */ jsx14(TooltipCustom, { id, label: action.label })
|
|
383
1056
|
]
|
|
384
1057
|
},
|
|
385
1058
|
id
|
|
@@ -389,7 +1062,7 @@ function ActionsColumn({
|
|
|
389
1062
|
}
|
|
390
1063
|
|
|
391
1064
|
// src/components/DataTableAdvancedFilter/DynamicColumns.tsx
|
|
392
|
-
import { jsx as
|
|
1065
|
+
import { jsx as jsx15 } from "react/jsx-runtime";
|
|
393
1066
|
function DynamicColumns({
|
|
394
1067
|
columns,
|
|
395
1068
|
isMultiSelectionMode = true,
|
|
@@ -401,7 +1074,7 @@ function DynamicColumns({
|
|
|
401
1074
|
const array = [];
|
|
402
1075
|
if (isMultiSelectionMode) {
|
|
403
1076
|
array.push(
|
|
404
|
-
/* @__PURE__ */
|
|
1077
|
+
/* @__PURE__ */ jsx15(
|
|
405
1078
|
Column,
|
|
406
1079
|
{
|
|
407
1080
|
selectionMode: "multiple",
|
|
@@ -418,7 +1091,7 @@ function DynamicColumns({
|
|
|
418
1091
|
const width = isActionsCol && col?.size ? col.size + "rem" : "6rem";
|
|
419
1092
|
const placeholder = isLanguagePtBr ? "Procurar" : "Search";
|
|
420
1093
|
array.push(
|
|
421
|
-
/* @__PURE__ */
|
|
1094
|
+
/* @__PURE__ */ jsx15(
|
|
422
1095
|
Column,
|
|
423
1096
|
{
|
|
424
1097
|
field: isActionsCol ? void 0 : col.field,
|
|
@@ -436,7 +1109,7 @@ function DynamicColumns({
|
|
|
436
1109
|
resizeable: col.enableResizeable ?? true
|
|
437
1110
|
},
|
|
438
1111
|
style: isActionsCol ? { width, minWidth: width, position: "relative" } : {},
|
|
439
|
-
body: (rowData) => isActionsCol ? /* @__PURE__ */
|
|
1112
|
+
body: (rowData) => isActionsCol ? /* @__PURE__ */ jsx15(
|
|
440
1113
|
ActionsColumn,
|
|
441
1114
|
{
|
|
442
1115
|
row: rowData,
|
|
@@ -445,7 +1118,7 @@ function DynamicColumns({
|
|
|
445
1118
|
customActionsColums,
|
|
446
1119
|
isLanguagePtBr
|
|
447
1120
|
}
|
|
448
|
-
) : col.body ? col.body(rowData) : /* @__PURE__ */
|
|
1121
|
+
) : col.body ? col.body(rowData) : /* @__PURE__ */ jsx15("span", { children: String(rowData[col.field]) }),
|
|
449
1122
|
sortable: !isActionsCol ? col.enableSorting ?? true : false
|
|
450
1123
|
},
|
|
451
1124
|
`${String(col.field)}-${idx}`
|
|
@@ -456,10 +1129,10 @@ function DynamicColumns({
|
|
|
456
1129
|
}
|
|
457
1130
|
|
|
458
1131
|
// src/hooks/use-debounce.ts
|
|
459
|
-
import { useEffect as
|
|
1132
|
+
import { useEffect as useEffect5, useState as useState5 } from "react";
|
|
460
1133
|
var useDebounce = (value, delay) => {
|
|
461
|
-
const [debouncedValue, setDebouncedValue] =
|
|
462
|
-
|
|
1134
|
+
const [debouncedValue, setDebouncedValue] = useState5(value);
|
|
1135
|
+
useEffect5(() => {
|
|
463
1136
|
const timer = setTimeout(() => {
|
|
464
1137
|
setDebouncedValue(value);
|
|
465
1138
|
}, delay || 500);
|
|
@@ -471,7 +1144,7 @@ var useDebounce = (value, delay) => {
|
|
|
471
1144
|
};
|
|
472
1145
|
|
|
473
1146
|
// src/components/DataTableAdvancedFilter/DataTableAdvancedFilterWrapper.tsx
|
|
474
|
-
import { Fragment as
|
|
1147
|
+
import { Fragment as Fragment6, jsx as jsx16, jsxs as jsxs11 } from "react/jsx-runtime";
|
|
475
1148
|
function DataTableAdvancedFilterWrapper({
|
|
476
1149
|
queryKey,
|
|
477
1150
|
mutationFn,
|
|
@@ -491,8 +1164,8 @@ function DataTableAdvancedFilterWrapper({
|
|
|
491
1164
|
state,
|
|
492
1165
|
onStateChange
|
|
493
1166
|
}) {
|
|
494
|
-
const [isClient, setIsClient] =
|
|
495
|
-
|
|
1167
|
+
const [isClient, setIsClient] = useState6(false);
|
|
1168
|
+
useEffect6(() => {
|
|
496
1169
|
setIsClient(true);
|
|
497
1170
|
}, []);
|
|
498
1171
|
const initialState = state ?? {
|
|
@@ -502,17 +1175,17 @@ function DataTableAdvancedFilterWrapper({
|
|
|
502
1175
|
sortOrder: sortOrderInitial,
|
|
503
1176
|
filter: ""
|
|
504
1177
|
};
|
|
505
|
-
const [page, setPage] =
|
|
506
|
-
const [rows, setRows] =
|
|
507
|
-
const [first, setFirst] =
|
|
508
|
-
const [sortField, setSortField] =
|
|
509
|
-
const [sortOrder, setSortOrder] =
|
|
510
|
-
const [searchText, setSearchText] =
|
|
511
|
-
const [filters, setFilters] =
|
|
1178
|
+
const [page, setPage] = useState6(initialState.page);
|
|
1179
|
+
const [rows, setRows] = useState6(initialState.rows);
|
|
1180
|
+
const [first, setFirst] = useState6((initialState.page - 1) * initialState.rows);
|
|
1181
|
+
const [sortField, setSortField] = useState6(initialState.sortField);
|
|
1182
|
+
const [sortOrder, setSortOrder] = useState6(initialState.sortOrder ?? 1);
|
|
1183
|
+
const [searchText, setSearchText] = useState6(initialState.filter ?? "");
|
|
1184
|
+
const [filters, setFilters] = useState6({
|
|
512
1185
|
...initFilters,
|
|
513
1186
|
global: { value: initialState.filter, matchMode: "contains" }
|
|
514
1187
|
});
|
|
515
|
-
const [selectedRowsData, setSelectedRowsData] =
|
|
1188
|
+
const [selectedRowsData, setSelectedRowsData] = useState6([]);
|
|
516
1189
|
const debouncedSearch = useDebounce(searchText, 500);
|
|
517
1190
|
const debouncedFilters = useMemo(() => {
|
|
518
1191
|
const f = { ...filters };
|
|
@@ -526,7 +1199,7 @@ function DataTableAdvancedFilterWrapper({
|
|
|
526
1199
|
(col) => col.filterGlobal === true && (col.field !== "acoes" || col.field !== "actions")
|
|
527
1200
|
).map((col) => col.field) ?? [];
|
|
528
1201
|
}, [columns]);
|
|
529
|
-
const { data: customers, isLoading } =
|
|
1202
|
+
const { data: customers, isLoading } = useQuery2({
|
|
530
1203
|
queryKey: [queryKey, { page, rows, sortField, sortOrder, filtersKey }],
|
|
531
1204
|
queryFn: () => mutationFn(
|
|
532
1205
|
page,
|
|
@@ -537,7 +1210,7 @@ function DataTableAdvancedFilterWrapper({
|
|
|
537
1210
|
globalFilterFields
|
|
538
1211
|
)
|
|
539
1212
|
});
|
|
540
|
-
|
|
1213
|
+
useEffect6(() => {
|
|
541
1214
|
if (!state) return;
|
|
542
1215
|
setPage(state.page);
|
|
543
1216
|
setRows(state.rows);
|
|
@@ -593,7 +1266,7 @@ function DataTableAdvancedFilterWrapper({
|
|
|
593
1266
|
filter: searchText
|
|
594
1267
|
});
|
|
595
1268
|
};
|
|
596
|
-
|
|
1269
|
+
useEffect6(() => {
|
|
597
1270
|
emitStateChange({
|
|
598
1271
|
page: 1,
|
|
599
1272
|
rows,
|
|
@@ -602,7 +1275,7 @@ function DataTableAdvancedFilterWrapper({
|
|
|
602
1275
|
filter: debouncedSearch
|
|
603
1276
|
});
|
|
604
1277
|
}, [debouncedSearch]);
|
|
605
|
-
|
|
1278
|
+
useEffect6(() => {
|
|
606
1279
|
if (customers?.items && selectedRowsData.length > 0) {
|
|
607
1280
|
const currentIds = new Set(customers.items.map((item) => item.id));
|
|
608
1281
|
const filteredSelection = selectedRowsData.filter(
|
|
@@ -614,8 +1287,8 @@ function DataTableAdvancedFilterWrapper({
|
|
|
614
1287
|
}
|
|
615
1288
|
}, [customers?.items, selectedRowsData]);
|
|
616
1289
|
const TableHeaderAndTableActions = useMemo(
|
|
617
|
-
() => /* @__PURE__ */
|
|
618
|
-
globalFilterFields.length > 0 && /* @__PURE__ */
|
|
1290
|
+
() => /* @__PURE__ */ jsxs11(Fragment6, { children: [
|
|
1291
|
+
globalFilterFields.length > 0 && /* @__PURE__ */ jsx16(
|
|
619
1292
|
TableHeader_default,
|
|
620
1293
|
{
|
|
621
1294
|
isLanguagePtBr,
|
|
@@ -623,7 +1296,7 @@ function DataTableAdvancedFilterWrapper({
|
|
|
623
1296
|
onGlobalFilterChange
|
|
624
1297
|
}
|
|
625
1298
|
),
|
|
626
|
-
/* @__PURE__ */
|
|
1299
|
+
/* @__PURE__ */ jsx16(
|
|
627
1300
|
TableActions,
|
|
628
1301
|
{
|
|
629
1302
|
selectedRows: selectedRowsData,
|
|
@@ -646,9 +1319,9 @@ function DataTableAdvancedFilterWrapper({
|
|
|
646
1319
|
customActions
|
|
647
1320
|
]
|
|
648
1321
|
);
|
|
649
|
-
return /* @__PURE__ */
|
|
650
|
-
disablePagination && /* @__PURE__ */
|
|
651
|
-
/* @__PURE__ */
|
|
1322
|
+
return /* @__PURE__ */ jsx16(Fragment6, { children: isClient && /* @__PURE__ */ jsxs11("div", { children: [
|
|
1323
|
+
disablePagination && /* @__PURE__ */ jsx16("div", { className: "disablePagination", children: TableHeaderAndTableActions }),
|
|
1324
|
+
/* @__PURE__ */ jsxs11(
|
|
652
1325
|
DataTable,
|
|
653
1326
|
{
|
|
654
1327
|
value: customers?.items ?? [],
|
|
@@ -674,7 +1347,7 @@ function DataTableAdvancedFilterWrapper({
|
|
|
674
1347
|
sortOrder,
|
|
675
1348
|
paginatorTemplate: {
|
|
676
1349
|
layout: "RowsPerPageDropdown PrevPageLink CurrentPageReport NextPageLink",
|
|
677
|
-
RowsPerPageDropdown: (options) => /* @__PURE__ */
|
|
1350
|
+
RowsPerPageDropdown: (options) => /* @__PURE__ */ jsx16(
|
|
678
1351
|
"select",
|
|
679
1352
|
{
|
|
680
1353
|
value: options.value,
|
|
@@ -683,20 +1356,20 @@ function DataTableAdvancedFilterWrapper({
|
|
|
683
1356
|
value: Number(e.target.value)
|
|
684
1357
|
}),
|
|
685
1358
|
className: "custom-input custom-select",
|
|
686
|
-
children: options.options.map((opt) => /* @__PURE__ */
|
|
1359
|
+
children: options.options.map((opt) => /* @__PURE__ */ jsx16("option", { value: opt.value, children: opt.label }, opt.value))
|
|
687
1360
|
}
|
|
688
1361
|
),
|
|
689
|
-
PrevPageLink: (options) => /* @__PURE__ */
|
|
1362
|
+
PrevPageLink: (options) => /* @__PURE__ */ jsx16(
|
|
690
1363
|
"button",
|
|
691
1364
|
{
|
|
692
1365
|
type: "button",
|
|
693
1366
|
onClick: options.onClick,
|
|
694
1367
|
disabled: options.disabled,
|
|
695
1368
|
className: `PrevPage ${options.disabled ? "PrevPageDisabled" : "PrevPageEnabled"}`,
|
|
696
|
-
children: /* @__PURE__ */
|
|
1369
|
+
children: /* @__PURE__ */ jsx16(CaretLeft, { size: 18, color: "#fff" })
|
|
697
1370
|
}
|
|
698
1371
|
),
|
|
699
|
-
CurrentPageReport: (options) => /* @__PURE__ */
|
|
1372
|
+
CurrentPageReport: (options) => /* @__PURE__ */ jsxs11("span", { className: "pageReport", children: [
|
|
700
1373
|
isLanguagePtBr ? "Mostrando" : "Showing",
|
|
701
1374
|
" ",
|
|
702
1375
|
options.first,
|
|
@@ -709,21 +1382,21 @@ function DataTableAdvancedFilterWrapper({
|
|
|
709
1382
|
" ",
|
|
710
1383
|
options.totalRecords
|
|
711
1384
|
] }),
|
|
712
|
-
NextPageLink: (options) => /* @__PURE__ */
|
|
1385
|
+
NextPageLink: (options) => /* @__PURE__ */ jsx16(
|
|
713
1386
|
"button",
|
|
714
1387
|
{
|
|
715
1388
|
type: "button",
|
|
716
1389
|
onClick: options.onClick,
|
|
717
1390
|
disabled: options.disabled,
|
|
718
1391
|
className: `NextPage ${options.disabled ? "NextPageDisabled" : "NextPageEnabled"}`,
|
|
719
|
-
children: /* @__PURE__ */
|
|
1392
|
+
children: /* @__PURE__ */ jsx16(CaretRight, { size: 18, color: "#fff" })
|
|
720
1393
|
}
|
|
721
1394
|
)
|
|
722
1395
|
},
|
|
723
1396
|
paginatorPosition: "top",
|
|
724
|
-
paginatorLeft: /* @__PURE__ */
|
|
1397
|
+
paginatorLeft: /* @__PURE__ */ jsx16("div", { className: "paginatorLeft", children: TableHeaderAndTableActions }),
|
|
725
1398
|
currentPageReportTemplate: "Mostrando {first} a {last} de {totalRecords}",
|
|
726
|
-
emptyMessage: /* @__PURE__ */
|
|
1399
|
+
emptyMessage: /* @__PURE__ */ jsx16("div", { className: "mensagem-nenhum-dado", children: /* @__PURE__ */ jsx16("p", { children: isLanguagePtBr ? "Nenhum dado encontrado" : "No data found" }) }),
|
|
727
1400
|
onFilter: (e) => {
|
|
728
1401
|
const newFilters = { ...e.filters };
|
|
729
1402
|
Object.keys(filters).forEach((key) => {
|
|
@@ -922,7 +1595,7 @@ var localePtBr = {
|
|
|
922
1595
|
};
|
|
923
1596
|
|
|
924
1597
|
// src/components/DataTableAdvancedFilter/DataTableAdvancedFilter.tsx
|
|
925
|
-
import { Fragment as
|
|
1598
|
+
import { Fragment as Fragment7, jsx as jsx17 } from "react/jsx-runtime";
|
|
926
1599
|
function DataTableAdvancedFilter({
|
|
927
1600
|
queryKey,
|
|
928
1601
|
mutationFn,
|
|
@@ -942,21 +1615,21 @@ function DataTableAdvancedFilter({
|
|
|
942
1615
|
state,
|
|
943
1616
|
onStateChange
|
|
944
1617
|
}) {
|
|
945
|
-
const [isClient, setIsClient] =
|
|
946
|
-
|
|
1618
|
+
const [isClient, setIsClient] = useState7(false);
|
|
1619
|
+
useEffect7(() => {
|
|
947
1620
|
addLocale("pt", localePtBr);
|
|
948
1621
|
}, []);
|
|
949
|
-
|
|
1622
|
+
useEffect7(() => {
|
|
950
1623
|
locale(isLanguagePtBr ? "pt" : "en");
|
|
951
1624
|
}, [isLanguagePtBr]);
|
|
952
|
-
|
|
1625
|
+
useEffect7(() => {
|
|
953
1626
|
setIsClient(true);
|
|
954
1627
|
}, []);
|
|
955
|
-
return /* @__PURE__ */
|
|
1628
|
+
return /* @__PURE__ */ jsx17(Fragment7, { children: isClient && /* @__PURE__ */ jsx17(
|
|
956
1629
|
PrimeReactProvider,
|
|
957
1630
|
{
|
|
958
1631
|
value: isLanguagePtBr ? { locale: "pt" } : { locale: "en" },
|
|
959
|
-
children: /* @__PURE__ */
|
|
1632
|
+
children: /* @__PURE__ */ jsx17(
|
|
960
1633
|
DataTableAdvancedFilterWrapper,
|
|
961
1634
|
{
|
|
962
1635
|
rowsPerPageOptions,
|
|
@@ -983,13 +1656,13 @@ function DataTableAdvancedFilter({
|
|
|
983
1656
|
}
|
|
984
1657
|
|
|
985
1658
|
// src/components/DataTableAdvancedFilter/FilterTemplates.tsx
|
|
986
|
-
import
|
|
1659
|
+
import Select2 from "react-select";
|
|
987
1660
|
import { Dropdown } from "primereact/dropdown";
|
|
988
1661
|
import moment2 from "moment";
|
|
989
|
-
import { jsx as
|
|
1662
|
+
import { jsx as jsx18, jsxs as jsxs12 } from "react/jsx-runtime";
|
|
990
1663
|
var DateFilterTemplate = (options, mask) => {
|
|
991
1664
|
const parsedValue = options.value && typeof options.value === "string" ? /* @__PURE__ */ new Date(options.value + "T00:00:00") : options.value;
|
|
992
|
-
return /* @__PURE__ */
|
|
1665
|
+
return /* @__PURE__ */ jsx18(
|
|
993
1666
|
Calendar,
|
|
994
1667
|
{
|
|
995
1668
|
value: parsedValue,
|
|
@@ -1014,7 +1687,7 @@ var DateFilterTemplate = (options, mask) => {
|
|
|
1014
1687
|
};
|
|
1015
1688
|
var DateTimeFilterTemplate = (options, mask) => {
|
|
1016
1689
|
const value = typeof options.value === "string" ? moment2(options.value).toDate() : options.value ?? null;
|
|
1017
|
-
return /* @__PURE__ */
|
|
1690
|
+
return /* @__PURE__ */ jsx18(
|
|
1018
1691
|
Calendar,
|
|
1019
1692
|
{
|
|
1020
1693
|
value,
|
|
@@ -1048,7 +1721,7 @@ var ValueFilterTemplate = (options, mask) => {
|
|
|
1048
1721
|
const valueToFilter = mask ? mask(rawValue) : rawValue;
|
|
1049
1722
|
options.filterCallback(valueToFilter, options.index);
|
|
1050
1723
|
};
|
|
1051
|
-
return /* @__PURE__ */
|
|
1724
|
+
return /* @__PURE__ */ jsx18(
|
|
1052
1725
|
InputNumber,
|
|
1053
1726
|
{
|
|
1054
1727
|
value: parsedValue,
|
|
@@ -1067,8 +1740,8 @@ var SelectFilterTemplate = (options, isLanguagePtBr = true, items = []) => {
|
|
|
1067
1740
|
{ label: isLanguagePtBr ? "N\xE3o" : "No", value: false }
|
|
1068
1741
|
];
|
|
1069
1742
|
const currentValue = selectOptions.find((opt) => opt.value === options.value) || null;
|
|
1070
|
-
return /* @__PURE__ */
|
|
1071
|
-
|
|
1743
|
+
return /* @__PURE__ */ jsx18(
|
|
1744
|
+
Select2,
|
|
1072
1745
|
{
|
|
1073
1746
|
options: selectOptions,
|
|
1074
1747
|
value: currentValue,
|
|
@@ -1126,7 +1799,7 @@ var CustomFilterElement = (options, isLanguagePtBr = true, items) => {
|
|
|
1126
1799
|
const currentMatchMode = rawFilter.matchMode ?? "contains";
|
|
1127
1800
|
const currentValue = typeof rawFilter.text === "string" ? rawFilter.text : "";
|
|
1128
1801
|
const isSpecial = currentMatchMode === customMatchModes.empty || currentMatchMode === customMatchModes.notEmpty;
|
|
1129
|
-
return /* @__PURE__ */
|
|
1802
|
+
return /* @__PURE__ */ jsxs12(
|
|
1130
1803
|
"div",
|
|
1131
1804
|
{
|
|
1132
1805
|
className: "filter-wrapper",
|
|
@@ -1137,7 +1810,7 @@ var CustomFilterElement = (options, isLanguagePtBr = true, items) => {
|
|
|
1137
1810
|
minWidth: "200px"
|
|
1138
1811
|
},
|
|
1139
1812
|
children: [
|
|
1140
|
-
/* @__PURE__ */
|
|
1813
|
+
/* @__PURE__ */ jsx18(
|
|
1141
1814
|
Dropdown,
|
|
1142
1815
|
{
|
|
1143
1816
|
value: currentMatchMode,
|
|
@@ -1163,7 +1836,7 @@ var CustomFilterElement = (options, isLanguagePtBr = true, items) => {
|
|
|
1163
1836
|
}
|
|
1164
1837
|
}
|
|
1165
1838
|
),
|
|
1166
|
-
!isSpecial && /* @__PURE__ */
|
|
1839
|
+
!isSpecial && /* @__PURE__ */ jsx18(
|
|
1167
1840
|
InputText,
|
|
1168
1841
|
{
|
|
1169
1842
|
value: currentValue,
|
|
@@ -1582,12 +2255,18 @@ export {
|
|
|
1582
2255
|
DateTimeFilterTemplate,
|
|
1583
2256
|
FilterMatchMode5 as FilterMatchMode,
|
|
1584
2257
|
FilterOperator2 as FilterOperator,
|
|
2258
|
+
Input,
|
|
2259
|
+
InputAutoComplete,
|
|
2260
|
+
InputSelect,
|
|
2261
|
+
LeafcodeThemeProvider,
|
|
1585
2262
|
ModalBase,
|
|
1586
2263
|
SelectFilterTemplate,
|
|
2264
|
+
TextArea,
|
|
1587
2265
|
ValueFilterTemplate,
|
|
1588
2266
|
buildDynamicCampoFilters,
|
|
1589
2267
|
buildSortingWithFilters,
|
|
1590
2268
|
customMatchModes,
|
|
2269
|
+
defaultTheme,
|
|
1591
2270
|
getDefaultFilterMatchOptionsDate,
|
|
1592
2271
|
getDefaultFilterMatchOptionsEnum,
|
|
1593
2272
|
getDefaultFilterMatchOptionsEnumNotNullable,
|