@m4l/components 0.1.26 → 0.1.28

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.
Files changed (112) hide show
  1. package/assets/Logo/index.228dcb5a.js +42 -35
  2. package/commonjs.565e6834.js +5 -5
  3. package/components/CommonActions/components/ActionCancel/index.e498eeb2.js +17 -0
  4. package/components/CommonActions/components/ActionFormCancel/index.4ff0ad73.js +64 -0
  5. package/components/CommonActions/components/ActionFormIntro/index.ca4d2674.js +28 -22
  6. package/components/CommonActions/components/ActionIntro/index.60ef7bd7.js +18 -0
  7. package/components/CommonActions/components/Actions/index.0645e30f.js +867 -0
  8. package/components/DataGrid/index.76d8fd25.js +1075 -0
  9. package/components/DynamicFilter/index.342ba5fe.js +1577 -0
  10. package/components/ErrorLabel/index.c8615f16.js +13 -12
  11. package/components/Icon/index.619c31c4.js +96 -0
  12. package/components/Icon/types.d.ts +2 -1
  13. package/components/Image/index.93d5f37f.js +190 -0
  14. package/components/Loadable/index.f5518558.js +8 -8
  15. package/components/ModalDialog/index.9ea10764.js +184 -0
  16. package/components/NoItemSelected/{index.9609a7f7.js → index.46d2f632.js} +52 -41
  17. package/components/ObjectLogs/index.f941fb79.js +288 -0
  18. package/components/Page/index.4237c241.js +22 -20
  19. package/components/PaperForm/index.ec9cb8c9.js +112 -0
  20. package/components/Period/index.2941fbda.js +249 -0
  21. package/components/PropertyValue/index.dfcfe1ba.js +147 -0
  22. package/components/PropertyValue/styles.d.ts +2 -1
  23. package/components/PropertyValue/types.d.ts +3 -3
  24. package/components/Resizeable/index.45995d2b.js +19 -19
  25. package/components/ScrollBar/index.39eeb2de.js +26 -21
  26. package/components/ScrollToTop/index.e06f98f6.js +8 -7
  27. package/components/SplitLayout/index.4032673d.js +35 -33
  28. package/components/animate/LoadingScreen/index.1d0c4307.js +33 -33
  29. package/components/animate/MotionContainer/index.8d9f9d80.js +25 -22
  30. package/components/animate/MotionLazyContainer/index.572dd012.js +10 -10
  31. package/components/animate/features.0fbf41e1.js +3 -3
  32. package/components/animate/variants/bounce.784aaaaa.js +16 -13
  33. package/components/animate/variants/container.11f82b76.js +8 -6
  34. package/components/animate/variants/fade.b561c0fc.js +32 -28
  35. package/components/animate/variants/transition.bd46b9ce.js +17 -12
  36. package/components/formatters/BooleanFormatter/index.8da35c9c.js +55 -0
  37. package/components/formatters/DateFormatter/index.1b9baacc.js +69 -0
  38. package/components/formatters/index.689a8086.js +119 -0
  39. package/components/hook-form/RHFAutocomplete/index.59a68f9f.js +224 -0
  40. package/components/hook-form/RHFAutocompleteAsync/index.c3083062.js +87 -0
  41. package/components/hook-form/RHFCheckbox/index.6dcec9e2.js +49 -39
  42. package/components/hook-form/RHFDateTime/index.9231a7c7.js +69 -56
  43. package/components/hook-form/RHFMultiCheckbox/index.2680b3b6.js +23 -23
  44. package/components/hook-form/RHFPeriod/index.64a228d5.js +55 -0
  45. package/components/hook-form/RHFRadioGroup/index.b3335e13.js +29 -29
  46. package/components/hook-form/RHFSelect/index.b6ca8bb2.js +24 -24
  47. package/components/hook-form/RHFTextField/index.f9aaaa90.js +146 -0
  48. package/components/hook-form/RHFUpload/RHFUploadImage/{components → subcomponents}/UploadImage/index.d.ts +0 -0
  49. package/components/hook-form/RHFUpload/RHFUploadImage/{components → subcomponents}/UploadImage/styles.d.ts +4 -3
  50. package/components/hook-form/RHFUpload/RHFUploadImage/{components → subcomponents}/UploadImage/subcomponents/Skeleton/index.d.ts +0 -0
  51. package/components/hook-form/RHFUpload/RHFUploadImage/{components → subcomponents}/UploadImage/subcomponents/Skeleton/styles.d.ts +0 -0
  52. package/components/hook-form/RHFUpload/RHFUploadImage/{components → subcomponents}/UploadImage/types.d.ts +0 -0
  53. package/components/hook-form/RHFUpload/index.d5cc7c13.js +285 -0
  54. package/components/mui_extended/Accordion/index.a02ac6ae.js +107 -0
  55. package/components/mui_extended/Avatar/index.fe06afd7.js +51 -0
  56. package/components/mui_extended/BoxIcon/index.e638ecc8.js +10 -10
  57. package/components/mui_extended/Breadcrumbs/index.5e37d903.js +49 -44
  58. package/components/mui_extended/Button/index.53b56958.js +178 -0
  59. package/components/mui_extended/CircularProgress/index.ad569afd.js +8 -6
  60. package/components/mui_extended/IconButton/index.a321e5cb.js +120 -0
  61. package/components/mui_extended/IconButton/index.d.ts +1 -1
  62. package/components/mui_extended/LinkWithRoute/index.16436ab8.js +25 -21
  63. package/components/mui_extended/Pager/index.c0865b70.js +141 -0
  64. package/components/mui_extended/Popover/index.705275a4.js +278 -0
  65. package/components/mui_extended/Tab/index.e0653a0a.js +25 -21
  66. package/components/mui_extended/Typography/index.e5494696.js +25 -21
  67. package/contexts/ModalContext/index.b92fa565.js +153 -0
  68. package/contexts/ModalContext/{components → subcomponents}/ContentConfirm/index.d.ts +0 -0
  69. package/contexts/ModalContext/{components → subcomponents}/ContentConfirm/styles.d.ts +0 -0
  70. package/contexts/ModalContext/{components → subcomponents}/ContentConfirm/types.d.ts +0 -0
  71. package/contexts/RHFormContext/index.b142190a.js +63 -0
  72. package/hooks/useFormAddEdit/index.d4845f1a.js +40 -22
  73. package/hooks/useModal/index.5fee01a3.js +11 -0
  74. package/index.js +153 -153
  75. package/package.json +2 -1
  76. package/react-data-grid.d46d625e.js +2206 -1663
  77. package/react-draggable.20e95c61.js +800 -553
  78. package/react-json-view.f56a7f8e.js +2344 -2340
  79. package/react-resizable.5277deaf.js +470 -298
  80. package/react-splitter-layout.7810ac1b.js +130 -128
  81. package/utils/index.214d9542.js +500 -354
  82. package/components/CommonActions/components/ActionCancel/index.6736b782.js +0 -17
  83. package/components/CommonActions/components/ActionFormCancel/index.281ee166.js +0 -49
  84. package/components/CommonActions/components/ActionIntro/index.4665a611.js +0 -18
  85. package/components/CommonActions/components/Actions/index.cd7b2671.js +0 -742
  86. package/components/DataGrid/index.2caf6231.js +0 -894
  87. package/components/DynamicFilter/index.f2377369.js +0 -1157
  88. package/components/Icon/index.f569765b.js +0 -82
  89. package/components/Image/index.c9da2d5a.js +0 -152
  90. package/components/ModalDialog/index.bee344a5.js +0 -168
  91. package/components/ObjectLogs/index.6b6f95e6.js +0 -266
  92. package/components/PaperForm/index.3f8c7ef2.js +0 -105
  93. package/components/Period/index.a112ce37.js +0 -175
  94. package/components/PropertyValue/index.ab3dd7e9.js +0 -116
  95. package/components/contexts/RHFormContext/index.33dba822.js +0 -56
  96. package/components/formatters/BooleanFormatter/index.3ec56305.js +0 -42
  97. package/components/formatters/DateFormatter/index.08d8823b.js +0 -57
  98. package/components/formatters/index.6959c2de.js +0 -106
  99. package/components/hook-form/RHFAutocomplete/index.5eee9d7c.js +0 -174
  100. package/components/hook-form/RHFAutocompleteAsync/index.757b5080.js +0 -65
  101. package/components/hook-form/RHFPeriod/index.979d0898.js +0 -51
  102. package/components/hook-form/RHFTextField/index.ba2a8f67.js +0 -129
  103. package/components/hook-form/RHFUpload/index.6347159a.js +0 -258
  104. package/components/mui_extended/Accordion/index.49f5df8e.js +0 -103
  105. package/components/mui_extended/Avatar/index.dadb0528.js +0 -37
  106. package/components/mui_extended/Button/index.52d18aea.js +0 -144
  107. package/components/mui_extended/IconButton/index.4b5ce8b5.js +0 -103
  108. package/components/mui_extended/Pager/index.951b6975.js +0 -126
  109. package/components/mui_extended/Popover/index.4da8587a.js +0 -252
  110. package/contexts/ModalContext/index.5388dfd5.js +0 -136
  111. package/hooks/useModal/index.3b1ff084.js +0 -11
  112. package/node_modules.168cb897.js +0 -55
@@ -0,0 +1,1577 @@
1
+ import { S as ScrollBar } from "../ScrollBar/index.39eeb2de.js";
2
+ import { styled } from "@mui/material/styles";
3
+ import { useRef, useState, useMemo, useCallback, useEffect, createContext, useContext } from "react";
4
+ import { useModuleDictionary, useHostTools, useEnvironment, voidFunction, useFlagsPresent } from "@m4l/core";
5
+ import * as Yup from "yup";
6
+ import { useFormContext, useWatch } from "react-hook-form";
7
+ import { R as RHFAutocomplete } from "../hook-form/RHFAutocomplete/index.59a68f9f.js";
8
+ import "lodash/debounce";
9
+ import { jsx, jsxs, Fragment } from "react/jsx-runtime";
10
+ import "../hook-form/RHFCheckbox/index.6dcec9e2.js";
11
+ import { alpha, styled as styled$1, Skeleton, MenuItem, useTheme, Popper } from "@mui/material";
12
+ import "@mui/x-date-pickers";
13
+ import { R as RHFDateTime } from "../hook-form/RHFDateTime/index.9231a7c7.js";
14
+ import { R as RHFTextField } from "../hook-form/RHFTextField/index.f9aaaa90.js";
15
+ import { I as Icon } from "../Icon/index.619c31c4.js";
16
+ import "../hook-form/RHFPeriod/index.64a228d5.js";
17
+ import "../ErrorLabel/index.c8615f16.js";
18
+ import "../Period/index.2941fbda.js";
19
+ import { L as LabelMemuItem, b as Actions, g as getCommonActionsDictionary } from "../CommonActions/components/Actions/index.0645e30f.js";
20
+ import "@mui/material/Button";
21
+ import "react-router-dom";
22
+ import "../../contexts/ModalContext/index.b92fa565.js";
23
+ import "@mui/lab";
24
+ import "lodash/isString";
25
+ import "react-dropzone";
26
+ import "../Image/index.93d5f37f.js";
27
+ import "../hook-form/RHFUpload/index.d5cc7c13.js";
28
+ import { I as IconButton } from "../mui_extended/IconButton/index.a321e5cb.js";
29
+ import "simplebar/dist/simplebar.min.css";
30
+ import { F as FilterButton } from "../mui_extended/Button/index.53b56958.js";
31
+ import { P as Popover } from "../mui_extended/Popover/index.705275a4.js";
32
+ import { R as RHFormProvider } from "../../contexts/RHFormContext/index.b142190a.js";
33
+ import { A as ActionCancel } from "../CommonActions/components/ActionCancel/index.e498eeb2.js";
34
+ import { A as ActionIntro } from "../CommonActions/components/ActionIntro/index.60ef7bd7.js";
35
+ import { useResponsiveDesktop } from "@m4l/graphics";
36
+ const WrapperApplyedFilters = styled("div")(({
37
+ theme
38
+ }) => ({
39
+ width: "100%",
40
+ margin: theme.spacing(0, 1),
41
+ paddingLeft: theme.spacing(1),
42
+ borderLeft: `1px solid ${theme.palette.divider}`
43
+ }));
44
+ const ContainerApplyedFilters = styled("div")(({
45
+ theme
46
+ }) => ({
47
+ width: "100%",
48
+ display: "flex",
49
+ justifyContent: "flex-start",
50
+ alignItems: "center",
51
+ height: "auto",
52
+ gap: theme.spacing(1.5)
53
+ }));
54
+ const STRING_OPERATORS = ["c", "nc"];
55
+ const NUMBER_OPERATORS = ["b", "e", "ne", "gt", "gte", "lt", "lte"];
56
+ const BOOLEAN_OPERATORS = ["e", "ne"];
57
+ const DATE_TIME_OPERATORS = [
58
+ "b",
59
+ "e",
60
+ "ne",
61
+ "gt",
62
+ "gte",
63
+ "lt",
64
+ "lte"
65
+ ];
66
+ const ALL_FIELDS = {
67
+ name: "all",
68
+ label: "dynamic_filter.all_fields",
69
+ urlIcon: "",
70
+ type: "string",
71
+ multiple: true,
72
+ presence: "optional"
73
+ };
74
+ const WrapperStringFilter$1 = styled("div")(({
75
+ theme
76
+ }) => ({
77
+ display: "flex",
78
+ flexDirection: "column",
79
+ justifyContent: "center",
80
+ alignItems: "center",
81
+ width: "100%",
82
+ minWidth: theme.spacing(3.75),
83
+ padding: theme.spacing(3, 0),
84
+ gap: theme.spacing(3)
85
+ }));
86
+ const WrapperAutoComplete$3 = styled("div")(() => ({
87
+ width: "100%"
88
+ }));
89
+ const getDefaultStringFilter = (field, fixed, getLabel) => {
90
+ const dfop1 = field.defaultOperand1;
91
+ const defaultFilter = {
92
+ id: 0,
93
+ n: field.name,
94
+ fixed,
95
+ isSetted: false,
96
+ o: "c",
97
+ labelOperator: "",
98
+ o1: "",
99
+ o2: "",
100
+ labelOperands: ""
101
+ };
102
+ if (dfop1 !== void 0 && typeof dfop1 === "string") {
103
+ defaultFilter.o1 = dfop1;
104
+ }
105
+ defaultFilter.labelOperands = defaultFilter.o1 + "";
106
+ defaultFilter.labelOperator = getLabel(`dynamic_filter.operator_${defaultFilter.o}`);
107
+ return defaultFilter;
108
+ };
109
+ function StringFilter() {
110
+ const {
111
+ popupData: {
112
+ filter,
113
+ field
114
+ },
115
+ setPoupEditValidationSchema,
116
+ setFnTransformFormValuesIntoValues: setTransformFunctionFormValuesToValues,
117
+ getLabelOperator
118
+ } = useBase();
119
+ const {
120
+ getLabel
121
+ } = useModuleDictionary();
122
+ const inputRef = useRef(null);
123
+ const {
124
+ setValue
125
+ } = useFormContext();
126
+ const [isLoaded, setIsLoaded] = useState(false);
127
+ const options = useMemo(() => STRING_OPERATORS.map((o) => ({
128
+ id: o,
129
+ label: getLabelOperator(o)
130
+ })), [getLabelOperator]);
131
+ const transformFunctionFormValuesToValues = useCallback((data) => {
132
+ if (!filter || !field)
133
+ return void 0;
134
+ const newFilter = {
135
+ id: filter.id,
136
+ n: field.name,
137
+ fixed: filter.fixed,
138
+ isSetted: true,
139
+ o: data.valueOperator.id,
140
+ labelOperator: data.valueOperator.label,
141
+ o1: data.valueOperand1,
142
+ labelOperands: data.valueOperand1
143
+ };
144
+ return newFilter;
145
+ }, []);
146
+ useEffect(() => {
147
+ if (!isLoaded) {
148
+ setPoupEditValidationSchema({
149
+ valueOperator: Yup.object().nullable().required(getLabel(`operator_required`)),
150
+ valueOperand1: Yup.string().required(getLabel(`operand_required`))
151
+ });
152
+ }
153
+ setTransformFunctionFormValuesToValues(transformFunctionFormValuesToValues);
154
+ if (filter && field) {
155
+ setValue("valueOperand1", filter.o1, {
156
+ shouldTouch: false,
157
+ shouldValidate: false
158
+ });
159
+ }
160
+ setIsLoaded(true);
161
+ }, [getLabel, filter, field]);
162
+ useEffect(() => {
163
+ inputRef.current?.focus();
164
+ }, [isLoaded]);
165
+ return /* @__PURE__ */ jsx(WrapperStringFilter$1, {
166
+ children: isLoaded && /* @__PURE__ */ jsxs(Fragment, {
167
+ children: [/* @__PURE__ */ jsx(WrapperAutoComplete$3, {
168
+ children: /* @__PURE__ */ jsx(RHFAutocomplete, {
169
+ name: "valueOperator",
170
+ autoComplete: "off",
171
+ options,
172
+ getOptionLabel: (option) => option.label,
173
+ isOptionEqualToValue: (option, value) => option.id === value.id,
174
+ label: ""
175
+ })
176
+ }), /* @__PURE__ */ jsx(RHFTextField, {
177
+ name: "valueOperand1",
178
+ ref: inputRef,
179
+ focused: true
180
+ })]
181
+ })
182
+ });
183
+ }
184
+ const WrapperAllFieldsFilter$1 = styled("div")(({
185
+ theme
186
+ }) => ({
187
+ display: "flex",
188
+ flexDirection: "column",
189
+ justifyContent: "center",
190
+ alignItems: "center",
191
+ width: "100%",
192
+ minWidth: theme.spacing(3.75),
193
+ height: "100%",
194
+ padding: theme.spacing(3, 0),
195
+ gap: theme.spacing(3)
196
+ }));
197
+ const WrapperAutoComplete$2 = styled("div")(() => ({
198
+ width: "100%"
199
+ }));
200
+ const getDefaultBooleanFilter = (field, fixed, getLabel) => {
201
+ const dfop1 = field.defaultOperand1;
202
+ const defaultFilter = {
203
+ id: 0,
204
+ n: field.name,
205
+ fixed,
206
+ isSetted: true,
207
+ o: "e",
208
+ labelOperator: "",
209
+ o1: true,
210
+ o2: "",
211
+ labelOperands: ""
212
+ };
213
+ defaultFilter.labelOperator = getLabel(`dynamic_filter.operator_${defaultFilter.o}`);
214
+ if (dfop1 !== void 0 && typeof dfop1 === "boolean") {
215
+ defaultFilter.o1 = dfop1;
216
+ }
217
+ defaultFilter.labelOperands = getLabel(`dynamic_filter.operand_${defaultFilter.o1}`);
218
+ return defaultFilter;
219
+ };
220
+ function BooleanFilter() {
221
+ const {
222
+ setPoupEditValidationSchema,
223
+ setFnTransformFormValuesIntoValues: setTransformFunctionFormValuesToValues,
224
+ getLabelOperator
225
+ } = useBase();
226
+ const {
227
+ getLabel
228
+ } = useModuleDictionary();
229
+ const {
230
+ popupData: {
231
+ filter,
232
+ field
233
+ }
234
+ } = useBase();
235
+ const {
236
+ setValue
237
+ } = useFormContext();
238
+ const [isLoaded, setIsLoaded] = useState(false);
239
+ const operators = useMemo(() => BOOLEAN_OPERATORS.map((o) => ({
240
+ id: o,
241
+ label: getLabelOperator(o)
242
+ })), [getLabelOperator]);
243
+ const optionsYesNo = useMemo(() => [{
244
+ value: true,
245
+ label: getLabel("dynamic_filter.operand_true")
246
+ }, {
247
+ value: false,
248
+ label: getLabel("dynamic_filter.operand_false")
249
+ }], [getLabel]);
250
+ const transformFunctionFormValuesToValues = useCallback((data) => {
251
+ if (!filter || !field)
252
+ return void 0;
253
+ const newFilter = {
254
+ id: filter.id,
255
+ n: field.name,
256
+ fixed: filter.fixed,
257
+ isSetted: true,
258
+ o: data.valueOperator.id,
259
+ labelOperator: data.valueOperator.label,
260
+ o1: data.valueOperand1.value,
261
+ labelOperands: data.valueOperand1.label
262
+ };
263
+ return newFilter;
264
+ }, []);
265
+ useEffect(() => {
266
+ if (!isLoaded) {
267
+ setPoupEditValidationSchema({
268
+ valueOperator: Yup.object().nullable().required(getLabel(`error_operator_required`)),
269
+ valueOperand1: Yup.object().nullable().required(getLabel(`error_operand_required`))
270
+ });
271
+ }
272
+ setTransformFunctionFormValuesToValues(transformFunctionFormValuesToValues);
273
+ if (filter && field) {
274
+ setValue("valueOperand1", {
275
+ value: filter.o1,
276
+ label: getLabel(`dynamic_filter.operand_${filter.o1}`)
277
+ }, {
278
+ shouldTouch: false,
279
+ shouldValidate: false
280
+ });
281
+ }
282
+ setIsLoaded(true);
283
+ }, [getLabel]);
284
+ return /* @__PURE__ */ jsx(WrapperAllFieldsFilter$1, {
285
+ id: "WrapperAllFieldsFilter",
286
+ children: isLoaded && /* @__PURE__ */ jsxs(Fragment, {
287
+ children: [/* @__PURE__ */ jsx(WrapperAutoComplete$2, {
288
+ children: /* @__PURE__ */ jsx(RHFAutocomplete, {
289
+ name: "valueOperator",
290
+ autoComplete: "off",
291
+ options: operators,
292
+ getOptionLabel: (option) => option.label,
293
+ isOptionEqualToValue: (option, value) => option.id === value.id,
294
+ label: ""
295
+ })
296
+ }), /* @__PURE__ */ jsx(WrapperAutoComplete$2, {
297
+ children: /* @__PURE__ */ jsx(RHFAutocomplete, {
298
+ name: "valueOperand1",
299
+ autoComplete: "off",
300
+ options: optionsYesNo,
301
+ getOptionLabel: (option) => option.label,
302
+ isOptionEqualToValue: (option, value) => option.value === value.value,
303
+ label: ""
304
+ })
305
+ })]
306
+ })
307
+ });
308
+ }
309
+ const WrapperAllFieldsFilter = styled("div")(({
310
+ theme
311
+ }) => ({
312
+ display: "flex",
313
+ flexDirection: "column",
314
+ justifyContent: "center",
315
+ alignItems: "center",
316
+ width: "100%",
317
+ minWidth: theme.spacing(3.75),
318
+ padding: theme.spacing(3, 0),
319
+ gap: theme.spacing(3)
320
+ }));
321
+ const WrapperAutoComplete$1 = styled("div")(() => ({
322
+ width: "100%"
323
+ }));
324
+ function isValidDate(d) {
325
+ return d && d instanceof Date;
326
+ }
327
+ const verifyStringFilter = (filter) => {
328
+ if (typeof filter.o !== "string") {
329
+ return false;
330
+ }
331
+ if (STRING_OPERATORS.findIndex((f) => f === filter.o) === -1) {
332
+ return false;
333
+ }
334
+ if (typeof filter.o1 !== "string") {
335
+ return false;
336
+ }
337
+ return true;
338
+ };
339
+ const verifyNumberFilter = (filter) => {
340
+ if (typeof filter.o !== "number") {
341
+ return false;
342
+ }
343
+ if (NUMBER_OPERATORS.findIndex((f) => f === filter.o) === -1) {
344
+ return false;
345
+ }
346
+ if (typeof filter.o1 !== "number") {
347
+ return false;
348
+ }
349
+ if (filter.o === "b" && typeof filter.o2 !== "number") {
350
+ return false;
351
+ }
352
+ return true;
353
+ };
354
+ const verifyBooleanFilter = (filter) => {
355
+ if (typeof filter.o !== "string") {
356
+ return false;
357
+ }
358
+ if (BOOLEAN_OPERATORS.findIndex((f) => f === filter.o) === -1) {
359
+ return false;
360
+ }
361
+ if (typeof filter.o1 !== "boolean") {
362
+ return false;
363
+ }
364
+ return true;
365
+ };
366
+ const verifyDateTime = (filter) => {
367
+ if (typeof filter.o !== "string") {
368
+ return false;
369
+ }
370
+ if (DATE_TIME_OPERATORS.findIndex((f) => f === filter.o) === -1) {
371
+ return false;
372
+ }
373
+ if (typeof filter.o1 !== "string") {
374
+ return false;
375
+ }
376
+ if (filter.o === "b" && typeof filter.o2 !== "string") {
377
+ return false;
378
+ }
379
+ return true;
380
+ };
381
+ const getDefaultDateTimeFilter = (field, fixed, getLabel, hostTools) => {
382
+ const defaultStartDate = new Date();
383
+ const defaultEndDate = new Date();
384
+ let dfop1 = field.defaultOperand1;
385
+ let dfop2 = field.defaultOperand2;
386
+ const defaultFilter = {
387
+ id: 0,
388
+ n: field.name,
389
+ fixed,
390
+ isSetted: true,
391
+ o: "b",
392
+ labelOperator: "",
393
+ o1: dfop1,
394
+ o2: dfop2,
395
+ labelOperands: ""
396
+ };
397
+ if (dfop1) {
398
+ if (isValidDate(dfop1)) {
399
+ defaultStartDate.setDate(dfop1.getDate());
400
+ } else {
401
+ dfop1 = void 0;
402
+ }
403
+ }
404
+ if (dfop1 === void 0) {
405
+ defaultStartDate.setHours(0, 0, 0, 0);
406
+ }
407
+ if (dfop2) {
408
+ if (isValidDate(dfop2)) {
409
+ defaultEndDate.setDate(dfop2.getDate());
410
+ } else {
411
+ dfop2 = void 0;
412
+ }
413
+ }
414
+ if (dfop2 === void 0) {
415
+ defaultEndDate.setHours(23, 59, 59, 999);
416
+ }
417
+ defaultFilter.o1 = defaultStartDate.toISOString();
418
+ defaultFilter.o2 = defaultEndDate.toISOString();
419
+ defaultFilter.labelOperands = `${hostTools.formatDate(defaultStartDate, "yyyy-MM-dd HH:mm:ss")} - ${hostTools.formatDate(defaultEndDate, "yyyy-MM-dd HH:mm:ss")}`;
420
+ defaultFilter.labelOperator = getLabel(`dynamic_filter.operator_${defaultFilter.o}`);
421
+ return defaultFilter;
422
+ };
423
+ function DateTimeFilter() {
424
+ const {
425
+ setPoupEditValidationSchema,
426
+ setFnTransformFormValuesIntoValues: setTransformFunctionFormValuesToValues,
427
+ getLabelOperator
428
+ } = useBase();
429
+ const {
430
+ getLabel
431
+ } = useModuleDictionary();
432
+ const {
433
+ formatDate
434
+ } = useHostTools();
435
+ const {
436
+ dfnsFormat: {
437
+ datetime_format
438
+ }
439
+ } = useEnvironment();
440
+ const {
441
+ popupData: {
442
+ filter,
443
+ field
444
+ }
445
+ } = useBase();
446
+ const {
447
+ control,
448
+ setValue
449
+ } = useFormContext();
450
+ const operator = useWatch({
451
+ control,
452
+ name: "valueOperator"
453
+ });
454
+ const [isLoaded, setIsLoaded] = useState(false);
455
+ const options = useMemo(() => DATE_TIME_OPERATORS.map((o) => ({
456
+ id: o,
457
+ label: getLabelOperator(o)
458
+ })), [getLabelOperator]);
459
+ const transformFunctionFormValuesToValues = useCallback((data) => {
460
+ if (!filter || !field)
461
+ return void 0;
462
+ const newFilter = {
463
+ id: filter.id,
464
+ n: field.name,
465
+ fixed: filter.fixed,
466
+ isSetted: true,
467
+ o: data.valueOperator.id,
468
+ o1: data.valueOperand1.toISOString(),
469
+ labelOperator: data.valueOperator.label,
470
+ labelOperands: ""
471
+ };
472
+ if (data.valueOperator.id === "b") {
473
+ newFilter.o2 = data.valueOperand2.toISOString();
474
+ newFilter.labelOperands = `${formatDate(data.valueOperand1, datetime_format)} - ${formatDate(data.valueOperand2, datetime_format)}`;
475
+ } else {
476
+ newFilter.o2 = newFilter.o2 ? newFilter.o2 : newFilter.o1;
477
+ newFilter.labelOperands = formatDate(data.valueOperand1, datetime_format);
478
+ }
479
+ return newFilter;
480
+ }, []);
481
+ useEffect(() => {
482
+ if (!isLoaded) {
483
+ setPoupEditValidationSchema({
484
+ valueOperator: Yup.object().nullable().required(getLabel(`operator_required`)),
485
+ valueOperand1: Yup.date().test("valueOperand1", getLabel(`dynamic_filter.error_invalid_date`), (value) => {
486
+ return Boolean(value);
487
+ }),
488
+ valueOperand2: Yup.date().when(["valueOperator.id"], {
489
+ is: "b",
490
+ then: Yup.date().test("DOB", getLabel(`dynamic_filter.error_invalid_date`), (value) => {
491
+ return Boolean(value);
492
+ })
493
+ })
494
+ });
495
+ }
496
+ if (filter && field) {
497
+ setValue("valueOperand1", new Date(filter.o1), {
498
+ shouldTouch: false,
499
+ shouldValidate: false
500
+ });
501
+ setValue("valueOperand2", new Date(filter.o2), {
502
+ shouldTouch: false,
503
+ shouldValidate: false
504
+ });
505
+ }
506
+ setTransformFunctionFormValuesToValues(transformFunctionFormValuesToValues);
507
+ setIsLoaded(true);
508
+ }, [getLabel, filter, field]);
509
+ return /* @__PURE__ */ jsx(WrapperAllFieldsFilter, {
510
+ children: isLoaded && /* @__PURE__ */ jsxs(Fragment, {
511
+ children: [/* @__PURE__ */ jsx(WrapperAutoComplete$1, {
512
+ children: /* @__PURE__ */ jsx(RHFAutocomplete, {
513
+ name: "valueOperator",
514
+ autoComplete: "off",
515
+ options,
516
+ getOptionLabel: (option) => option.label,
517
+ isOptionEqualToValue: (option, value) => option.id === value.id,
518
+ label: ""
519
+ })
520
+ }), /* @__PURE__ */ jsx(RHFDateTime, {
521
+ name: "valueOperand1",
522
+ autoComplete: "off",
523
+ label: "",
524
+ focused: true
525
+ }), operator && operator.id === "b" && /* @__PURE__ */ jsx(RHFDateTime, {
526
+ name: "valueOperand2",
527
+ autoComplete: "off",
528
+ label: ""
529
+ })]
530
+ })
531
+ });
532
+ }
533
+ const WrapperStringFilter = styled("div")(({
534
+ theme
535
+ }) => ({
536
+ display: "flex",
537
+ flexDirection: "column",
538
+ justifyContent: "center",
539
+ alignItems: "center",
540
+ width: "100%",
541
+ minWidth: theme.spacing(3.75),
542
+ padding: theme.spacing(3, 0),
543
+ gap: theme.spacing(3)
544
+ }));
545
+ const WrapperAutoComplete = styled("div")(() => ({
546
+ width: "100%"
547
+ }));
548
+ const getDefaultNumberFilter = (field, fixed, getLabel) => {
549
+ const dfop1 = field.defaultOperand1;
550
+ const dfop2 = field.defaultOperand2;
551
+ const defaultFilter = {
552
+ id: 0,
553
+ n: field.name,
554
+ fixed,
555
+ isSetted: false,
556
+ o: "e",
557
+ labelOperator: "",
558
+ o1: "",
559
+ o2: "",
560
+ labelOperands: ""
561
+ };
562
+ if (dfop1 !== void 0 && typeof dfop1 === "number") {
563
+ defaultFilter.o1 = dfop1;
564
+ defaultFilter.labelOperands = defaultFilter.o1;
565
+ }
566
+ if (dfop2 !== void 0 && typeof dfop2 === "number") {
567
+ defaultFilter.o2 = dfop2;
568
+ }
569
+ defaultFilter.labelOperator = getLabel(`dynamic_filter.operator_${defaultFilter.o}`);
570
+ return defaultFilter;
571
+ };
572
+ function NumberFilter() {
573
+ const {
574
+ popupData: {
575
+ filter,
576
+ field
577
+ },
578
+ setPoupEditValidationSchema,
579
+ setFnTransformFormValuesIntoValues: setTransformFunctionFormValuesToValues,
580
+ getLabelOperator
581
+ } = useBase();
582
+ const {
583
+ getLabel
584
+ } = useModuleDictionary();
585
+ const inputRef = useRef(null);
586
+ const {
587
+ control,
588
+ setValue
589
+ } = useFormContext();
590
+ const [isLoaded, setIsLoaded] = useState(false);
591
+ const operator = useWatch({
592
+ control,
593
+ name: "valueOperator"
594
+ });
595
+ const options = useMemo(() => NUMBER_OPERATORS.map((o) => ({
596
+ id: o,
597
+ label: getLabelOperator(o)
598
+ })), [getLabelOperator]);
599
+ const transformFunctionFormValuesToValues = useCallback((data) => {
600
+ if (!filter || !field)
601
+ return void 0;
602
+ const newFilter = {
603
+ id: filter.id,
604
+ n: field.name,
605
+ fixed: filter.fixed,
606
+ isSetted: true,
607
+ o: data.valueOperator.id,
608
+ o1: Number(data.valueOperand1),
609
+ o2: data.valueOperand2,
610
+ labelOperator: data.valueOperator.label,
611
+ labelOperands: data.valueOperand1
612
+ };
613
+ if (data.valueOperator.id === "b") {
614
+ newFilter.labelOperands = `${data.valueOperand1} - ${data.valueOperand2}`;
615
+ newFilter.o2 = Number(data.valueOperand2);
616
+ } else {
617
+ newFilter.o2 = void 0;
618
+ }
619
+ return newFilter;
620
+ }, []);
621
+ useEffect(() => {
622
+ if (!isLoaded) {
623
+ setPoupEditValidationSchema({
624
+ valueOperator: Yup.object().nullable().required(getLabel(`dynamic_filter.error_operator_required`)),
625
+ valueOperand1: Yup.number().typeError(getLabel(`dynamic_filter.error_operand_mustbe_number`)),
626
+ valueOperand2: Yup.string().when("valueOperator", {
627
+ is: (o) => {
628
+ return o.id === "b";
629
+ },
630
+ then: Yup.string().test("DOB", getLabel(`dynamic_filter.error_operand_mustbe_number`), (value) => {
631
+ if (value === "")
632
+ return false;
633
+ return !isNaN(Number(value));
634
+ })
635
+ })
636
+ });
637
+ }
638
+ setTransformFunctionFormValuesToValues(transformFunctionFormValuesToValues);
639
+ if (filter && field) {
640
+ setValue("valueOperand1", filter.o1, {
641
+ shouldTouch: false,
642
+ shouldValidate: false
643
+ });
644
+ setValue("valueOperand2", filter.o2, {
645
+ shouldTouch: false,
646
+ shouldValidate: false
647
+ });
648
+ }
649
+ setIsLoaded(true);
650
+ }, [getLabel, filter, field]);
651
+ useEffect(() => {
652
+ inputRef.current?.focus();
653
+ }, [isLoaded]);
654
+ return /* @__PURE__ */ jsxs(WrapperStringFilter, {
655
+ children: [isLoaded && /* @__PURE__ */ jsxs(Fragment, {
656
+ children: [/* @__PURE__ */ jsx(WrapperAutoComplete, {
657
+ children: /* @__PURE__ */ jsx(RHFAutocomplete, {
658
+ name: "valueOperator",
659
+ autoComplete: "off",
660
+ options,
661
+ getOptionLabel: (option) => option.label,
662
+ isOptionEqualToValue: (option, value) => option.id === value.id,
663
+ label: ""
664
+ })
665
+ }), /* @__PURE__ */ jsx(RHFTextField, {
666
+ name: "valueOperand1",
667
+ ref: inputRef,
668
+ focused: true
669
+ }), operator && operator.id === "b" && /* @__PURE__ */ jsx(RHFTextField, {
670
+ name: "valueOperand2",
671
+ ref: inputRef
672
+ })]
673
+ }), "x"]
674
+ });
675
+ }
676
+ const strategiesDefaultFilterValues = {
677
+ string: getDefaultStringFilter,
678
+ number: getDefaultNumberFilter,
679
+ boolean: getDefaultBooleanFilter,
680
+ datetime: getDefaultDateTimeFilter,
681
+ __default__: () => {
682
+ throw new Error("Type no defined");
683
+ }
684
+ };
685
+ const getDefaultFilterValues = (field, fixed, getLabel, hostTools) => {
686
+ const transformer = strategiesDefaultFilterValues[field.type] ?? strategiesDefaultFilterValues.__default__;
687
+ return transformer(field, fixed, getLabel, hostTools);
688
+ };
689
+ const strategiesEditFilterComponent = {
690
+ string: StringFilter,
691
+ number: NumberFilter,
692
+ boolean: BooleanFilter,
693
+ datetime: DateTimeFilter,
694
+ __default__: /* @__PURE__ */ jsx(Fragment, {})
695
+ };
696
+ const PopupEditFilterComponent = (props) => {
697
+ const {
698
+ getFieldByName
699
+ } = useBase();
700
+ const field = getFieldByName(props.filter.n);
701
+ if (!field)
702
+ return /* @__PURE__ */ jsx(Fragment, {});
703
+ const Component = strategiesEditFilterComponent[field.type] ?? strategiesEditFilterComponent.__default__;
704
+ return /* @__PURE__ */ jsx(Component, {});
705
+ };
706
+ const initialState = {
707
+ fields: [],
708
+ withAllField: true,
709
+ isDirty: false,
710
+ isValid: true,
711
+ automatic: false,
712
+ availableFields: [],
713
+ getFieldByName: () => void 0,
714
+ getLabelOperator: () => "",
715
+ applyedFilters: [],
716
+ addFilter: voidFunction,
717
+ updateFilter: voidFunction,
718
+ removeFilter: voidFunction,
719
+ clearFilters: voidFunction,
720
+ fireOnChangeFilters: voidFunction,
721
+ openAnchorEl: null,
722
+ openMenuFields: voidFunction,
723
+ closeMenuFields: voidFunction,
724
+ popupData: {
725
+ popupAnchorEl: null,
726
+ filter: null,
727
+ field: null
728
+ },
729
+ popupValidationSchema: {},
730
+ setPoupEditValidationSchema: voidFunction,
731
+ showPopupForAddFilter: voidFunction,
732
+ showPopupForEditFilter: voidFunction,
733
+ hidePopupEdit: voidFunction,
734
+ setInEdition: voidFunction,
735
+ inEdition: false,
736
+ setFnTransformFormValuesIntoValues: voidFunction,
737
+ fnTransformFormValuesIntoRawValues: () => void 0
738
+ };
739
+ const BaseContext = createContext(initialState);
740
+ const getMaxId = (applyedFilters) => {
741
+ return applyedFilters.reduce((prev, n) => {
742
+ return n.id > prev ? n.id : prev;
743
+ }, 0);
744
+ };
745
+ const getFilterById = (id, applyedFilters) => {
746
+ return applyedFilters.findIndex((f) => f.id === id);
747
+ };
748
+ const formatToInitialFilters = (applyedFilter) => {
749
+ return applyedFilter.map((af) => ({
750
+ n: af.n,
751
+ o: af.o,
752
+ labelOperands: af.labelOperands,
753
+ o1: af.o1,
754
+ o2: af.o2
755
+ }));
756
+ };
757
+ const formatToRawFilter = (applyedFilter) => {
758
+ return applyedFilter.map((af) => ({
759
+ n: af.n,
760
+ o: af.o,
761
+ o1: af.o1,
762
+ o2: af.o2
763
+ }));
764
+ };
765
+ const getInitialFilters = (fields, filters, getFieldByName, getLabel, hostTools) => {
766
+ const newFilters = [];
767
+ const fixedFields = [];
768
+ for (let index = 0; index < filters.length; index++) {
769
+ let add;
770
+ const filter = {
771
+ ...filters[index],
772
+ id: 0,
773
+ isSetted: true,
774
+ fixed: false,
775
+ labelOperator: ""
776
+ };
777
+ const field = getFieldByName(filter.n);
778
+ if (!field)
779
+ continue;
780
+ switch (field.type) {
781
+ case "string":
782
+ add = verifyStringFilter(filter);
783
+ break;
784
+ case "number":
785
+ add = verifyNumberFilter(filter);
786
+ break;
787
+ case "boolean":
788
+ add = verifyBooleanFilter(filter);
789
+ break;
790
+ case "datetime":
791
+ add = verifyDateTime(filter);
792
+ break;
793
+ default:
794
+ add = false;
795
+ }
796
+ if (add) {
797
+ if (field.presence === "fixed") {
798
+ if (fixedFields.findIndex((f) => f === field.name) === -1) {
799
+ filter.fixed = true;
800
+ fixedFields.push(field.name);
801
+ } else {
802
+ filter.fixed = false;
803
+ }
804
+ }
805
+ filter.isSetted = true;
806
+ filter.id = newFilters.length + 1;
807
+ filter.labelOperator = getLabel(`dynamic_filter.operator_${filter.o}`);
808
+ newFilters.push(filter);
809
+ }
810
+ }
811
+ for (let index = 0; index < fields.length; index++) {
812
+ const field = fields[index];
813
+ if (field.presence === "initialized" || field.presence === "fixed") {
814
+ if (!filters.find((f) => f.n === field.name)) {
815
+ const newFilter = getDefaultFilterValues(field, field.presence === "fixed", getLabel, hostTools);
816
+ newFilter.id = newFilters.length + 1;
817
+ newFilters.push(newFilter);
818
+ }
819
+ }
820
+ }
821
+ return newFilters;
822
+ };
823
+ function BaseProvider(props) {
824
+ const {
825
+ isSkeleton = false,
826
+ fields,
827
+ initialFilters = [],
828
+ withAllField = true,
829
+ onChangeFilter,
830
+ automatic = true,
831
+ children
832
+ } = props;
833
+ const [openAnchorEl, setOpenAnchorEl] = useState(null);
834
+ const [popupData, setPopupData] = useState({
835
+ popupAnchorEl: null,
836
+ filter: null,
837
+ field: null
838
+ });
839
+ const {
840
+ getLabel
841
+ } = useModuleDictionary();
842
+ const [popupValidationSchema, setInternalPopupValidationSchema] = useState(Yup.object().shape({}));
843
+ const [fnTransformFormValuesIntoRawValues, setInternalfnTransormFormValuesIntoRawValues] = useState(() => void 0);
844
+ const {
845
+ host_static_assets,
846
+ environment_assets
847
+ } = useEnvironment();
848
+ const hostTools = useHostTools();
849
+ const all_fields = useMemo(() => {
850
+ return {
851
+ ...ALL_FIELDS,
852
+ label: getLabel("dynamic_filter.all_fields"),
853
+ urlIcon: `${host_static_assets}/${environment_assets}/frontend/components/dynamic_filter/assets/icons/all_fields.svg`
854
+ };
855
+ }, [getLabel, host_static_assets, environment_assets]);
856
+ const [inEdition, setInEdition] = useState(false);
857
+ const [isDirty, setIsDirty] = useState(!automatic);
858
+ const [isValid, setIsValid] = useState(false);
859
+ const {
860
+ toast
861
+ } = useHostTools();
862
+ const getFieldByName = useCallback((name) => {
863
+ return fields.concat(all_fields).find((f) => {
864
+ return f.name === name;
865
+ });
866
+ }, [fields, all_fields]);
867
+ const getLabelOperator = useCallback((operator) => {
868
+ return getLabel(`dynamic_filter.operator_${operator}`);
869
+ }, [getLabel]);
870
+ const [applyedFilters, setApplyedFilters] = useState(getInitialFilters(fields, initialFilters, getFieldByName, getLabel, hostTools));
871
+ const availableFields = useMemo(() => {
872
+ const newFields = [];
873
+ for (let index = 0; index < fields.length; index++) {
874
+ let add;
875
+ const field = fields[index];
876
+ add = true;
877
+ if (field.multiple !== void 0 && field.multiple === false) {
878
+ const fIndx = applyedFilters.findIndex((f) => f.n === field.name);
879
+ if (fIndx > -1) {
880
+ add = false;
881
+ }
882
+ }
883
+ if (add) {
884
+ newFields.push(field);
885
+ }
886
+ }
887
+ return newFields;
888
+ }, [fields, applyedFilters]);
889
+ const fireOnChangeFilters = useCallback(() => {
890
+ if (isValid) {
891
+ if (!automatic)
892
+ setIsDirty(false);
893
+ onChangeFilter(formatToInitialFilters(applyedFilters), formatToRawFilter(applyedFilters));
894
+ } else {
895
+ toast(getLabel("dynamic_filter.error_filters_no_setted"), {
896
+ type: "error",
897
+ autoClose: 1e4
898
+ });
899
+ }
900
+ }, [isValid, applyedFilters, onChangeFilter]);
901
+ useEffect(() => {
902
+ const NoValid = applyedFilters.findIndex((f) => !f.isSetted) > -1;
903
+ if (NoValid) {
904
+ setIsValid(false);
905
+ } else {
906
+ setIsValid(true);
907
+ }
908
+ if (!automatic) {
909
+ setIsDirty(true);
910
+ return;
911
+ }
912
+ if (!NoValid) {
913
+ setIsDirty(false);
914
+ onChangeFilter(formatToInitialFilters(applyedFilters), formatToRawFilter(applyedFilters));
915
+ }
916
+ }, [applyedFilters]);
917
+ const addFilter = useCallback((newFilter) => {
918
+ setApplyedFilters((lastApplyedFilters) => {
919
+ const newArray = [...lastApplyedFilters];
920
+ const newFilterFull = {
921
+ ...newFilter,
922
+ id: getMaxId(lastApplyedFilters) + 1,
923
+ labelOperator: getLabelOperator(newFilter.o)
924
+ };
925
+ newArray.push(newFilterFull);
926
+ return newArray;
927
+ });
928
+ }, []);
929
+ const updateFilter = useCallback((newFilter) => {
930
+ setApplyedFilters((lastApplyedFilters) => {
931
+ const newArray = [...lastApplyedFilters];
932
+ const findedFilter = getFilterById(newFilter.id, newArray);
933
+ if (findedFilter > -1) {
934
+ newArray.splice(findedFilter, 1, {
935
+ ...newFilter,
936
+ labelOperator: getLabelOperator(newFilter.o)
937
+ });
938
+ }
939
+ return newArray;
940
+ });
941
+ }, []);
942
+ const clearFilters = useCallback(() => {
943
+ setApplyedFilters((lastFilters) => {
944
+ const newFilters = [];
945
+ for (let index = 0; index < lastFilters.length; index++) {
946
+ const filter = lastFilters[index];
947
+ if (filter.fixed) {
948
+ newFilters.push(filter);
949
+ }
950
+ }
951
+ return newFilters;
952
+ });
953
+ }, []);
954
+ const openMenuFields = useCallback((anchorEl) => {
955
+ setOpenAnchorEl(anchorEl);
956
+ setInEdition(true);
957
+ }, [applyedFilters]);
958
+ const closeMenuFields = useCallback(() => {
959
+ setOpenAnchorEl(null);
960
+ setInEdition(false);
961
+ }, []);
962
+ const hidePopupEdit = useCallback((stayInEditon) => {
963
+ if (popupData.popupAnchorEl) {
964
+ setPopupData({
965
+ popupAnchorEl: null,
966
+ filter: null,
967
+ field: null
968
+ });
969
+ }
970
+ if (!stayInEditon && inEdition) {
971
+ setInEdition(false);
972
+ }
973
+ }, [popupData, inEdition]);
974
+ const showPopupForAddFilter = useCallback((anchorEl, field) => {
975
+ setPopupData({
976
+ popupAnchorEl: anchorEl,
977
+ filter: getDefaultFilterValues(field, false, getLabel, hostTools),
978
+ field
979
+ });
980
+ setInEdition(true);
981
+ }, []);
982
+ const showPopupForEditFilter = useCallback((anchorEl, filterToEdit) => {
983
+ setPopupData({
984
+ popupAnchorEl: anchorEl,
985
+ filter: filterToEdit,
986
+ field: getFieldByName(filterToEdit.n)
987
+ });
988
+ setInEdition(true);
989
+ }, []);
990
+ const removeFilter = useCallback((id) => {
991
+ setApplyedFilters((lastApplyedFilters) => {
992
+ const newArray = [...lastApplyedFilters];
993
+ const index_to_remove = lastApplyedFilters.findIndex((filter) => id === filter.id);
994
+ if (index_to_remove > -1) {
995
+ if (!newArray[index_to_remove].fixed) {
996
+ newArray.splice(index_to_remove, 1);
997
+ }
998
+ }
999
+ return newArray;
1000
+ });
1001
+ }, []);
1002
+ const setPoupEditValidationSchema = useCallback((validationSchema) => {
1003
+ setInternalPopupValidationSchema(Yup.object().shape({
1004
+ ...validationSchema
1005
+ }));
1006
+ }, []);
1007
+ const setFnTransformFormValuesIntoValues = useCallback((fn) => {
1008
+ setInternalfnTransormFormValuesIntoRawValues(() => fn);
1009
+ }, []);
1010
+ return /* @__PURE__ */ jsx(BaseContext.Provider, {
1011
+ value: {
1012
+ isSkeleton,
1013
+ inEdition,
1014
+ automatic,
1015
+ isDirty,
1016
+ isValid,
1017
+ withAllField,
1018
+ fields,
1019
+ availableFields,
1020
+ getFieldByName,
1021
+ getLabelOperator,
1022
+ applyedFilters,
1023
+ addFilter,
1024
+ updateFilter,
1025
+ removeFilter,
1026
+ clearFilters,
1027
+ fireOnChangeFilters,
1028
+ openAnchorEl,
1029
+ openMenuFields,
1030
+ closeMenuFields,
1031
+ popupData,
1032
+ popupValidationSchema,
1033
+ showPopupForAddFilter,
1034
+ showPopupForEditFilter,
1035
+ hidePopupEdit,
1036
+ setInEdition,
1037
+ setPoupEditValidationSchema,
1038
+ fnTransformFormValuesIntoRawValues,
1039
+ setFnTransformFormValuesIntoValues
1040
+ },
1041
+ children
1042
+ });
1043
+ }
1044
+ const useBase = () => useContext(BaseContext);
1045
+ const WrapperApplyedFilter = styled("div")(({
1046
+ theme
1047
+ }) => ({
1048
+ width: "auto",
1049
+ display: "flex",
1050
+ justifyContent: "center",
1051
+ alignItems: "center",
1052
+ height: "100%",
1053
+ minHeight: theme.spacing(3),
1054
+ paddingLeft: theme.spacing(1),
1055
+ backgroundColor: theme.palette.grid?.sectionHeader,
1056
+ border: "1px solid",
1057
+ borderColor: alpha(`${theme.palette.divider}`, 0.1),
1058
+ overflow: "visible",
1059
+ borderRadius: theme.spacing(1),
1060
+ "&.waf_no_setted": {
1061
+ border: `1px solid ${theme.palette.error.main}`
1062
+ }
1063
+ }));
1064
+ const AplyedFilterStyled = styled("div")(({
1065
+ theme
1066
+ }) => ({
1067
+ ...theme.typography.body2,
1068
+ display: "flex",
1069
+ justifyContent: "center",
1070
+ alignItems: "center",
1071
+ width: "auto",
1072
+ height: "100%",
1073
+ marginRight: theme.spacing(1),
1074
+ marginLeft: theme.spacing(1),
1075
+ whiteSpace: "nowrap"
1076
+ }));
1077
+ const ContainerField = styled("span")(({
1078
+ theme
1079
+ }) => ({
1080
+ ...theme.typography.subtitle2
1081
+ }));
1082
+ const ContainerOperator = styled("span")(({
1083
+ theme
1084
+ }) => ({
1085
+ ...theme.typography.body2,
1086
+ marginLeft: theme.spacing(1.5),
1087
+ fontStyle: "italic"
1088
+ }));
1089
+ const ContainerOperands = styled("span")(({
1090
+ theme
1091
+ }) => ({
1092
+ ...theme.typography.body2,
1093
+ marginLeft: theme.spacing(1.5)
1094
+ }));
1095
+ function ApplyedFilter(props) {
1096
+ const {
1097
+ n: fieldName,
1098
+ id,
1099
+ isSetted,
1100
+ fixed,
1101
+ labelOperator,
1102
+ labelOperands
1103
+ } = props;
1104
+ const {
1105
+ removeFilter,
1106
+ showPopupForEditFilter,
1107
+ hidePopupEdit,
1108
+ getFieldByName
1109
+ } = useBase();
1110
+ const {
1111
+ host_static_assets,
1112
+ environment_assets
1113
+ } = useEnvironment();
1114
+ const field = useMemo(() => {
1115
+ return getFieldByName(fieldName);
1116
+ }, [getFieldByName]);
1117
+ const urlIcon = useMemo(() => {
1118
+ if (!field)
1119
+ return;
1120
+ if (field && field.urlIcon !== "") {
1121
+ return field.urlIcon;
1122
+ }
1123
+ return "";
1124
+ }, [field]);
1125
+ const onDelete = () => {
1126
+ hidePopupEdit(false);
1127
+ removeFilter(id);
1128
+ };
1129
+ const onClick = (event) => {
1130
+ showPopupForEditFilter(event.currentTarget, props);
1131
+ };
1132
+ if (!field) {
1133
+ return /* @__PURE__ */ jsx(Fragment, {});
1134
+ }
1135
+ return /* @__PURE__ */ jsxs(WrapperApplyedFilter, {
1136
+ id: "WrapperApplyedFilter",
1137
+ className: !isSetted ? "waf_no_setted" : "",
1138
+ children: [urlIcon && /* @__PURE__ */ jsx(IconButton, {
1139
+ src: urlIcon,
1140
+ onClick
1141
+ }), /* @__PURE__ */ jsxs(AplyedFilterStyled, {
1142
+ onClick,
1143
+ children: [/* @__PURE__ */ jsx(ContainerField, {
1144
+ children: field.label
1145
+ }), /* @__PURE__ */ jsx(ContainerOperator, {
1146
+ children: labelOperator
1147
+ }), /* @__PURE__ */ jsx(ContainerOperands, {
1148
+ children: labelOperands
1149
+ })]
1150
+ }), !fixed && /* @__PURE__ */ jsx(IconButton, {
1151
+ size: "small",
1152
+ src: `${host_static_assets}/${environment_assets}/frontend/components/dynamic_filter/assets/icons/clear.svg`,
1153
+ onClick: onDelete,
1154
+ dictionaryTooltip: "dynamic_filter.tooltip_clear_filter"
1155
+ })]
1156
+ });
1157
+ }
1158
+ function ApplyedFilters() {
1159
+ const {
1160
+ applyedFilters,
1161
+ isSkeleton
1162
+ } = useBase();
1163
+ if (isSkeleton) {
1164
+ return /* @__PURE__ */ jsx(WrapperApplyedFilters, {
1165
+ id: "WrapperApplyedFilters"
1166
+ });
1167
+ }
1168
+ return /* @__PURE__ */ jsx(WrapperApplyedFilters, {
1169
+ className: "WrapperApplyedFilters",
1170
+ children: /* @__PURE__ */ jsx(ScrollBar, {
1171
+ children: /* @__PURE__ */ jsx(ContainerApplyedFilters, {
1172
+ id: "WrapperApplyedFilters",
1173
+ children: [...applyedFilters].sort((a, b) => a.isSetted === b.isSetted ? 0 : a.isSetted ? -1 : 1).reverse().map((filter) => /* @__PURE__ */ jsx(ApplyedFilter, {
1174
+ ...filter
1175
+ }, filter.id))
1176
+ })
1177
+ })
1178
+ });
1179
+ }
1180
+ const SKTClearFilters = styled$1("div")(({
1181
+ theme
1182
+ }) => ({
1183
+ display: "flex",
1184
+ justifyContent: "center",
1185
+ alignItems: "center",
1186
+ minWidth: theme.spacing(3.75),
1187
+ height: theme.spacing(3.75)
1188
+ }));
1189
+ const WrapperClearFilters = styled$1("div")(({
1190
+ theme
1191
+ }) => ({
1192
+ paddingLeft: theme.spacing(0.5),
1193
+ borderLeft: `1px solid ${theme.palette.divider}`
1194
+ }));
1195
+ const ClearFilters = () => {
1196
+ const {
1197
+ host_static_assets,
1198
+ environment_assets
1199
+ } = useEnvironment();
1200
+ const {
1201
+ clearFilters,
1202
+ isSkeleton,
1203
+ applyedFilters
1204
+ } = useBase();
1205
+ if (isSkeleton) {
1206
+ return /* @__PURE__ */ jsx(SKTClearFilters, {
1207
+ children: /* @__PURE__ */ jsx(Skeleton, {
1208
+ variant: "circular",
1209
+ width: "20px",
1210
+ height: "20px"
1211
+ })
1212
+ });
1213
+ }
1214
+ if (applyedFilters.findIndex((f) => f.fixed == false) > -1) {
1215
+ return /* @__PURE__ */ jsx(WrapperClearFilters, {
1216
+ children: /* @__PURE__ */ jsx(IconButton, {
1217
+ src: `${host_static_assets}/${environment_assets}/frontend/components/dynamic_filter/assets/icons/clear.svg`,
1218
+ onClick: clearFilters,
1219
+ dictionaryTooltip: "dynamic_filter.tooltip_clear_filters"
1220
+ })
1221
+ });
1222
+ }
1223
+ return /* @__PURE__ */ jsx(Fragment, {});
1224
+ };
1225
+ const WrapperInputFilter = styled("div")(({
1226
+ theme
1227
+ }) => ({
1228
+ display: "flex",
1229
+ justifyContent: "center",
1230
+ alignItems: "center",
1231
+ width: "100%",
1232
+ height: theme.spacing(3),
1233
+ borderLeft: `1px solid ${theme.palette.divider}`,
1234
+ paddingLeft: theme.spacing(1),
1235
+ marginLeft: theme.spacing(1),
1236
+ [theme.breakpoints.up("sm")]: {
1237
+ width: theme.spacing(25)
1238
+ }
1239
+ }));
1240
+ const StyledInputFilter = styled("input")(({
1241
+ theme
1242
+ }) => ({
1243
+ background: "transparent",
1244
+ display: "flex",
1245
+ justifyContent: "center",
1246
+ alignItems: "center",
1247
+ minWidth: theme.spacing(3.75),
1248
+ width: "100%",
1249
+ "&": {
1250
+ outline: "none",
1251
+ border: "none"
1252
+ },
1253
+ [theme.breakpoints.up("sm")]: {
1254
+ width: "auto"
1255
+ }
1256
+ }));
1257
+ function InputFilter() {
1258
+ const {
1259
+ isSkeleton,
1260
+ withAllField,
1261
+ availableFields,
1262
+ showPopupForAddFilter,
1263
+ addFilter,
1264
+ openAnchorEl,
1265
+ openMenuFields,
1266
+ closeMenuFields,
1267
+ hidePopupEdit
1268
+ } = useBase();
1269
+ const [valueFilter, setValueFilter] = useState("");
1270
+ const finalFields = useMemo(() => {
1271
+ if (!openAnchorEl) {
1272
+ return [];
1273
+ }
1274
+ return availableFields.filter((field) => field.label.includes(valueFilter));
1275
+ }, [valueFilter, openAnchorEl]);
1276
+ if (isSkeleton) {
1277
+ return /* @__PURE__ */ jsx(WrapperInputFilter, {
1278
+ id: "SKTWrapperInputFilter",
1279
+ children: /* @__PURE__ */ jsx(Skeleton, {
1280
+ variant: "text",
1281
+ width: "100%",
1282
+ height: 24
1283
+ })
1284
+ });
1285
+ }
1286
+ const handleClose = () => {
1287
+ closeMenuFields();
1288
+ };
1289
+ const handleClickItem = (field) => {
1290
+ closeMenuFields();
1291
+ showPopupForAddFilter(openAnchorEl, field);
1292
+ };
1293
+ const onClickFilter = (event) => {
1294
+ openMenuFields(event.currentTarget);
1295
+ };
1296
+ const onChangeFilter = (event) => {
1297
+ setValueFilter(event.target.value);
1298
+ if (!openAnchorEl) {
1299
+ openMenuFields(event.currentTarget);
1300
+ }
1301
+ hidePopupEdit(true);
1302
+ };
1303
+ const handleKeyPressMenu = (event) => {
1304
+ if (event.key !== "Enter")
1305
+ return;
1306
+ if (valueFilter.trim() === "") {
1307
+ closeMenuFields();
1308
+ return;
1309
+ }
1310
+ if (withAllField) {
1311
+ addFilter({
1312
+ n: ALL_FIELDS.name,
1313
+ isSetted: true,
1314
+ fixed: false,
1315
+ o: "c",
1316
+ o1: valueFilter,
1317
+ labelOperands: valueFilter
1318
+ });
1319
+ setValueFilter("");
1320
+ closeMenuFields();
1321
+ }
1322
+ };
1323
+ if (!withAllField && availableFields.length == 0) {
1324
+ return /* @__PURE__ */ jsx(Fragment, {});
1325
+ }
1326
+ return /* @__PURE__ */ jsxs(WrapperInputFilter, {
1327
+ id: "WrapperInputFilter",
1328
+ children: [/* @__PURE__ */ jsx(StyledInputFilter, {
1329
+ type: "text",
1330
+ value: valueFilter,
1331
+ placeholder: "filter",
1332
+ onClick: onClickFilter,
1333
+ onChange: onChangeFilter,
1334
+ onKeyPress: handleKeyPressMenu
1335
+ }), availableFields.length > 0 && /* @__PURE__ */ jsx(Popover, {
1336
+ id: "Popover",
1337
+ open: Boolean(openAnchorEl),
1338
+ anchorEl: openAnchorEl,
1339
+ onClose: handleClose,
1340
+ disableAutoFocus: true,
1341
+ arrowType: "right-top",
1342
+ sx: {
1343
+ "& .MuiMenuItem-root": {
1344
+ px: 1,
1345
+ typography: "body2",
1346
+ borderRadius: 0.75
1347
+ }
1348
+ },
1349
+ children: Boolean(openAnchorEl) && finalFields.map((field, index) => /* @__PURE__ */ jsxs(MenuItem, {
1350
+ dense: true,
1351
+ onClick: () => handleClickItem(field),
1352
+ children: [/* @__PURE__ */ jsx(Icon, {
1353
+ src: field.urlIcon
1354
+ }), /* @__PURE__ */ jsx(LabelMemuItem, {
1355
+ children: field.label
1356
+ })]
1357
+ }, `menu_action_${index}`))
1358
+ })]
1359
+ });
1360
+ }
1361
+ const WrapperPopupEditFilter = styled("div")(({
1362
+ theme
1363
+ }) => ({
1364
+ display: "flex",
1365
+ flexDirection: "column",
1366
+ justifyContent: "center",
1367
+ alignItems: "center",
1368
+ padding: theme.spacing(1.4, 3, 3, 3),
1369
+ backgroundColor: theme.palette.background.default,
1370
+ borderRadius: theme.spacing(1)
1371
+ }));
1372
+ styled("div")(({
1373
+ theme
1374
+ }) => ({
1375
+ display: "flex",
1376
+ justifyContent: "center",
1377
+ gap: theme.spacing(3),
1378
+ paddingTop: theme.spacing(3)
1379
+ }));
1380
+ const TitleContainer = styled("div")(({
1381
+ theme
1382
+ }) => ({
1383
+ ...theme.typography.subtitle2,
1384
+ width: "100%",
1385
+ display: "flex",
1386
+ justifyContent: "flex-start",
1387
+ alignItems: "center",
1388
+ padding: theme.spacing(2, 0),
1389
+ marginLeft: theme.spacing(1.5)
1390
+ }));
1391
+ const HeaderContainer = styled("div")(({
1392
+ theme
1393
+ }) => ({
1394
+ width: "100%",
1395
+ display: "flex",
1396
+ justifyContent: "flex-start",
1397
+ alignItems: "center",
1398
+ borderBottom: `1px solid ${theme.palette.divider}`
1399
+ }));
1400
+ const PopupEditFilter = () => {
1401
+ const {
1402
+ popupValidationSchema,
1403
+ popupData: {
1404
+ popupAnchorEl,
1405
+ filter,
1406
+ field
1407
+ },
1408
+ hidePopupEdit,
1409
+ addFilter,
1410
+ updateFilter,
1411
+ getLabelOperator,
1412
+ fnTransformFormValuesIntoRawValues
1413
+ } = useBase();
1414
+ const theme = useTheme();
1415
+ const {
1416
+ getLabel
1417
+ } = useModuleDictionary();
1418
+ const values = useMemo(() => {
1419
+ if (!filter || !field)
1420
+ return {};
1421
+ const valuesFilter = {
1422
+ ...filter,
1423
+ valueOperator: {
1424
+ id: filter.o,
1425
+ label: getLabelOperator(filter.o)
1426
+ }
1427
+ };
1428
+ return valuesFilter;
1429
+ }, [filter, field, getLabelOperator, getLabel]);
1430
+ const onSubmit = async (data) => {
1431
+ if (!filter || !field)
1432
+ return;
1433
+ const newFilter = fnTransformFormValuesIntoRawValues(data);
1434
+ if (!newFilter)
1435
+ return;
1436
+ if (filter.id === 0) {
1437
+ addFilter(newFilter);
1438
+ } else {
1439
+ updateFilter(newFilter);
1440
+ }
1441
+ hidePopupEdit(false);
1442
+ };
1443
+ const onClose = () => {
1444
+ hidePopupEdit(false);
1445
+ };
1446
+ return /* @__PURE__ */ jsx(Popper, {
1447
+ id: "Popover",
1448
+ open: Boolean(popupAnchorEl),
1449
+ anchorEl: popupAnchorEl,
1450
+ sx: {
1451
+ boxShadow: theme.customShadows.dropdown,
1452
+ borderRadius: 1
1453
+ },
1454
+ children: /* @__PURE__ */ jsx(Fragment, {
1455
+ children: filter && /* @__PURE__ */ jsx(RHFormProvider, {
1456
+ onSubmit,
1457
+ values,
1458
+ validationSchema: popupValidationSchema,
1459
+ children: /* @__PURE__ */ jsxs(WrapperPopupEditFilter, {
1460
+ children: [/* @__PURE__ */ jsxs(HeaderContainer, {
1461
+ children: [field?.urlIcon && /* @__PURE__ */ jsx(Icon, {
1462
+ src: field.urlIcon
1463
+ }), /* @__PURE__ */ jsx(TitleContainer, {
1464
+ children: field?.label
1465
+ })]
1466
+ }), /* @__PURE__ */ jsx(PopupEditFilterComponent, {
1467
+ filter
1468
+ }), /* @__PURE__ */ jsxs(Actions, {
1469
+ children: [/* @__PURE__ */ jsx(ActionCancel, {
1470
+ onClick: onClose
1471
+ }), /* @__PURE__ */ jsx(ActionIntro, {})]
1472
+ })]
1473
+ })
1474
+ })
1475
+ })
1476
+ });
1477
+ };
1478
+ const WrapperFilter = styled("div", {
1479
+ shouldForwardProp: (prop) => prop !== "inEdition"
1480
+ })(({
1481
+ theme,
1482
+ inEdition
1483
+ }) => ({
1484
+ display: "flex",
1485
+ alignItems: "center",
1486
+ justifyContent: "flex-start",
1487
+ height: "auto",
1488
+ width: "100%",
1489
+ padding: theme.spacing(0.5),
1490
+ borderRadius: theme.spacing(1),
1491
+ border: inEdition ? `1px solid ${theme.palette.primary.main}` : `1px solid ${theme.palette.divider}`
1492
+ }));
1493
+ const WrapperFilterMobile = styled("div", {
1494
+ shouldForwardProp: (prop) => prop !== "inEdition"
1495
+ })(({
1496
+ theme,
1497
+ inEdition
1498
+ }) => ({
1499
+ display: "flex",
1500
+ flexDirection: "column",
1501
+ alignItems: "center",
1502
+ justifyContent: "space-between",
1503
+ minWidth: theme.spacing(25),
1504
+ height: "auto",
1505
+ width: "100%",
1506
+ padding: theme.spacing(0.5),
1507
+ borderRadius: theme.spacing(1),
1508
+ border: inEdition ? `1px solid ${theme.palette.primary.main}` : `1px solid ${theme.palette.divider}`,
1509
+ gap: theme.spacing(0.75),
1510
+ "& .WrapperApplyedFilters": {
1511
+ margin: "0px",
1512
+ padding: "0px",
1513
+ border: "0px"
1514
+ }
1515
+ }));
1516
+ const ContainerFistRow = styled("div")(() => ({
1517
+ width: "100%",
1518
+ display: "flex",
1519
+ justifyContent: "space-between"
1520
+ }));
1521
+ const DynamicFilter = (props) => {
1522
+ const isDesktop = useResponsiveDesktop();
1523
+ const render = useFlagsPresent(["dictionary_loaded"]);
1524
+ if (!render) {
1525
+ return /* @__PURE__ */ jsx(Fragment, {});
1526
+ }
1527
+ return /* @__PURE__ */ jsx(BaseProvider, {
1528
+ ...props,
1529
+ children: /* @__PURE__ */ jsx(BaseContext.Consumer, {
1530
+ children: ({
1531
+ inEdition
1532
+ }) => isDesktop ? /* @__PURE__ */ jsxs(WrapperFilter, {
1533
+ id: "WrapperFilter",
1534
+ inEdition,
1535
+ children: [/* @__PURE__ */ jsx(FilterButton, {}), /* @__PURE__ */ jsx(InputFilter, {}), /* @__PURE__ */ jsx(ApplyedFilters, {}), /* @__PURE__ */ jsx(PopupEditFilter, {}), /* @__PURE__ */ jsx(ClearFilters, {})]
1536
+ }) : /* @__PURE__ */ jsxs(WrapperFilterMobile, {
1537
+ id: "WrapperFilterMobile",
1538
+ inEdition,
1539
+ children: [/* @__PURE__ */ jsxs(ContainerFistRow, {
1540
+ id: "ContainerFistRow",
1541
+ children: [/* @__PURE__ */ jsx(FilterButton, {}), /* @__PURE__ */ jsx(InputFilter, {}), /* @__PURE__ */ jsx(ClearFilters, {})]
1542
+ }), /* @__PURE__ */ jsx(ApplyedFilters, {}), /* @__PURE__ */ jsx(PopupEditFilter, {})]
1543
+ })
1544
+ })
1545
+ });
1546
+ };
1547
+ function getDynamicFilterComponentsDictionary() {
1548
+ return ["dynamic_filter"].concat(getCommonActionsDictionary());
1549
+ }
1550
+ const defaultDynamicFilterDictionary = {
1551
+ dynamic_filter: {
1552
+ filter_tooltip: "Search",
1553
+ operator_b: "between",
1554
+ operator_e: "=",
1555
+ operator_ne: "!=",
1556
+ operator_gt: ">",
1557
+ operator_gte: ">=",
1558
+ operator_lt: "<",
1559
+ operator_lte: "<=",
1560
+ operator_c: "contains",
1561
+ operator_nc: "not contains",
1562
+ all_fields: "all_fields",
1563
+ operand_true: "true",
1564
+ operand_false: "false",
1565
+ error_operator_required: "Operator required",
1566
+ error_operand_required: "Operand required",
1567
+ error_invalid_date: "Invalid date",
1568
+ error_operand_mustbe_number: "Invalid number",
1569
+ error_filters_no_setted: "Filters not yet set"
1570
+ }
1571
+ };
1572
+ export {
1573
+ DynamicFilter as D,
1574
+ defaultDynamicFilterDictionary as d,
1575
+ getDynamicFilterComponentsDictionary as g,
1576
+ useBase as u
1577
+ };