@m4l/components 4.1.4 → 4.1.6

package/components/DynamicFilter/store/DynamicFilterStore-5ObO5f3L.js

@@ -0,0 +1,171 @@
+import { createStore } from "zustand";
+import { devtools } from "zustand/middleware";
+import { immer } from "zustand/middleware/immer";
+import { g as getPurgedInitialFiltersApplied } from "../helpers/getPurgedInitialFiltersApplied-DE5OyFk8.js";
+function updateAvailableFields(state) {
+  state.availableFields = state.fields.filter((field) => {
+    if (field.multiple === void 0 || field.multiple) {
+      return true;
+    }
+    const appliedFilterNames = new Set(state.appliedFilters.map((f) => f.field.name));
+    return !appliedFilterNames.has(field.name);
+  });
+}
+function updateOwnerStateIsValid(state) {
+  state.ownerState.isValid = state.appliedFilters.every((filter) => filter.isSet);
+}
+const updateAutomatic = (state) => {
+  updateOwnerStateIsValid(state);
+  updateAvailableFields(state);
+  if (state.ownerState.isValid && state.automatic) {
+    state.ownerState.isDirty = false;
+    state.countOnChangeFiltersApplied++;
+  }
+};
+const createAreaStore = (initProps) => {
+  const startProps = {
+    countOnChangeFiltersApplied: 0,
+    appliedFilters: [],
+    availableFields: [],
+    fnAnchorEl: void 0,
+    popoverFilterData: void 0,
+    inputData: "",
+    ...initProps
+  };
+  return createStore(
+    devtools(
+      immer((set, get) => ({
+        ...startProps,
+        actions: {
+          init: (initialFiltersApplied) => {
+            set((state) => {
+              state.appliedFilters = getPurgedInitialFiltersApplied(
+                state.fields,
+                initialFiltersApplied,
+                state.actions.getFieldByName
+              );
+              state.ownerState.isEmpty = state.appliedFilters.length <= 0;
+              updateAutomatic(state);
+            });
+          },
+          getFieldByName: (name) => {
+            const field = (get().withAllField ? get().fields.concat(get().allField) : get().fields).find((f) => {
+              return f.name === name;
+            });
+            if (field) {
+              return field;
+            }
+            throw new Error("No exist field");
+          },
+          removeFilter: (id) => {
+            set((state) => {
+              const indexToRemoved = state.appliedFilters.findIndex((f) => id === f.id && !f.fixed);
+              if (indexToRemoved > -1) {
+                state.appliedFilters.splice(indexToRemoved, 1);
+                state.ownerState.isEmpty = state.appliedFilters.length === 0;
+                updateAutomatic(state);
+              }
+            });
+          },
+          showPopoverFilterForAdd: (anchorEl, field) => {
+            set((state) => {
+              state.fnAnchorEl = void 0;
+              state.inputData = "";
+              state.popoverFilterData = {
+                openFor: "add",
+                fnAnchorEl: () => anchorEl,
+                field
+              };
+            });
+            get().actions.setInEdition(true);
+          },
+          showPopoverFilterForEdit: (anchorEl, filterToEdit) => {
+            set((state) => {
+              state.popoverFilterData = {
+                openFor: "edit",
+                fnAnchorEl: () => anchorEl,
+                filter: filterToEdit,
+                field: filterToEdit.field
+              };
+            });
+            get().actions.setInEdition(true);
+          },
+          hidePopoverFilter: (stayInEdition) => {
+            set((state) => {
+              state.popoverFilterData = void 0;
+            });
+            get().actions.setInEdition(stayInEdition);
+          },
+          clearFilters: () => {
+            set((state) => {
+              state.appliedFilters = state.appliedFilters.filter((f) => f.fixed);
+              state.ownerState.isEmpty = state.appliedFilters.length === 0;
+              updateAvailableFields(state);
+            });
+          },
+          fireOnChangeFilters: () => {
+            set((state) => {
+              if (state.ownerState.isValid) {
+                state.ownerState.isDirty = false;
+                state.countOnChangeFiltersApplied++;
+              }
+            });
+          },
+          getNewId: () => {
+            return get().appliedFilters.reduce((prev, filterField) => {
+              return filterField.id > prev ? filterField.id : prev;
+            }, 0) + 1;
+          },
+          addFilter: (newFilter) => {
+            set((state) => {
+              state.appliedFilters.push(newFilter);
+              state.ownerState.isEmpty = state.appliedFilters.length === 0;
+              updateAutomatic(state);
+            });
+          },
+          updateFilter: (editFilter) => {
+            set((state) => {
+              const index = state.appliedFilters.findIndex(
+                (filterField) => filterField.id === editFilter.id
+              );
+              if (index > -1) {
+                state.appliedFilters[index] = editFilter;
+              }
+              updateAutomatic(state);
+            });
+          },
+          setInputData: (inputData) => {
+            set((state) => {
+              state.inputData = inputData;
+            });
+          },
+          setInEdition: (newInEdition) => {
+            set((state) => {
+              state.ownerState.inEdition = newInEdition;
+            });
+          },
+          setExternalState: (newExternalState) => {
+            set((state) => {
+              state.ownerState = { ...state.ownerState, ...newExternalState };
+            });
+          },
+          openPopoverMenuFields: (anchorEl) => {
+            set((state) => {
+              state.fnAnchorEl = () => anchorEl;
+            });
+          },
+          closePopoverMenuFields: (newInEdition) => {
+            set((state) => {
+              state.fnAnchorEl = void 0;
+              state.ownerState.inEdition = newInEdition || false;
+            });
+          }
+        }
+      })),
+      { name: `Dynamic filter` }
+    )
+  );
+};
+export {
+  createAreaStore as c
+};

package/components/DynamicFilter/store/useDynamicFilterStore-CdlJeQW2.js

@@ -0,0 +1,13 @@
+import { useContext } from "react";
+import { useStore } from "zustand";
+import { shallow } from "zustand/shallow";
+import { a as DynamicFilterContext } from "./DynamicFilterContext-C3Fm8yiC.js";
+function useDynamicFilterStore(selector, equalityFn) {
+  const store = useContext(DynamicFilterContext);
+  if (!store)
+    throw new Error("useDynamicFilterStore context must be use inside DynamicFilterContext");
+  return useStore(store, selector, shallow);
+}
+export {
+  useDynamicFilterStore as u
+};

package/components/DynamicFilter/subcomponents/AppliedFilterChip/AppliedFilterChip-Cyr5u1Y0.js

@@ -0,0 +1,28 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { u as useAppliedFilterChip } from "./useAppliedFilterChip-CLen7pbk.js";
+import { A as AppliedFilterChipStyled, a as AppliedFilterChipIconStyled, b as AppliedFilterChipInfoStyled, c as AppliedFilterChipInfoFieldNameStyled, d as AppliedFilterChipInfoOperatorStyled, e as AppliedFilterChipInfoOperandsStyled, f as AppliedFilterChipRemoveButtonStyled } from "../../slots/dynamicFilterSlots-X11BZr2l.js";
+function AppliedFilterChip(props) {
+  const { fixed } = props;
+  const { onEditFilter, onDelete, iconFieldUrl, removeIconUrl, labels } = useAppliedFilterChip(props);
+  return /* @__PURE__ */ jsxs(AppliedFilterChipStyled, { ownerState: {}, children: [
+    iconFieldUrl && /* @__PURE__ */ jsx(AppliedFilterChipIconStyled, { onClick: onEditFilter, src: iconFieldUrl, ownerState: {} }),
+    /* @__PURE__ */ jsxs(AppliedFilterChipInfoStyled, { onClick: onEditFilter, ownerState: {}, children: [
+      /* @__PURE__ */ jsx(AppliedFilterChipInfoFieldNameStyled, { ownerState: {}, children: labels.labelField }),
+      /* @__PURE__ */ jsx(AppliedFilterChipInfoOperatorStyled, { ownerState: {}, children: labels.labelOperator }),
+      /* @__PURE__ */ jsx(AppliedFilterChipInfoOperandsStyled, { ownerState: {}, children: labels.labelOperands })
+    ] }),
+    !fixed && /* @__PURE__ */ jsx(
+      AppliedFilterChipRemoveButtonStyled,
+      {
+        src: removeIconUrl,
+        size: "small",
+        dictionaryTooltipId: "dynamic_filter.tooltip_clear_filter",
+        onClick: onDelete,
+        ownerState: {}
+      }
+    )
+  ] });
+}
+export {
+  AppliedFilterChip as A
+};

package/components/DynamicFilter/subcomponents/AppliedFilterChip/index-l0sNRNKZ.js

@@ -0,0 +1 @@
+

package/components/DynamicFilter/subcomponents/AppliedFilterChip/useAppliedFilterChip-CLen7pbk.js

@@ -0,0 +1,36 @@
+import { useMemo } from "react";
+import { useEnvironment, useModuleDictionary } from "@m4l/core";
+import { useFormatter } from "@m4l/graphics";
+import { u as useDynamicFilterStore } from "../../store/useDynamicFilterStore-CdlJeQW2.js";
+import { f as fieldFactory } from "../FieldTypes/fieldFactory-Dx9a03_M.js";
+function useAppliedFilterChip(filter) {
+  const { host_static_assets, environment_assets } = useEnvironment();
+  const { getLabel } = useModuleDictionary();
+  const formatters = useFormatter();
+  const { hidePopoverFilter, removeFilter, showPopoverFilterForEdit } = useDynamicFilterStore(
+    (state) => state.actions
+  );
+  const removeIconUrl = `${host_static_assets}/${environment_assets}/frontend/components/dynamic_filter/assets/icons/clear.svg`;
+  const labels = useMemo(() => {
+    return fieldFactory(filter.field.type).getLabels(filter, getLabel, formatters, filter.field);
+  }, [filter, getLabel]);
+  function onDelete() {
+    hidePopoverFilter(false);
+    removeFilter(filter.id);
+  }
+  function onEditFilter(event) {
+    hidePopoverFilter(false);
+    const currentTarget = event.currentTarget;
+    setTimeout(() => showPopoverFilterForEdit(currentTarget, filter), 10);
+  }
+  return {
+    onDelete,
+    onEditFilter,
+    removeIconUrl,
+    iconFieldUrl: filter.field?.urlIcon,
+    labels
+  };
+}
+export {
+  useAppliedFilterChip as u
+};

package/components/DynamicFilter/subcomponents/AppliedFilters/AppliedFilters-DaHLVmBH.js

@@ -0,0 +1,15 @@
+import { jsx } from "react/jsx-runtime";
+import { S as ScrollBar } from "../../../ScrollBar/index-1MJx3e_h.js";
+import { u as useAppliedFilters } from "./useAppliedFilters-ZXCTxj2y.js";
+import { g as AppliedFiltersStyled, h as AppliedFilterInnerContainerStyled } from "../../slots/dynamicFilterSlots-X11BZr2l.js";
+import { A as AppliedFilterChip } from "../AppliedFilterChip/AppliedFilterChip-Cyr5u1Y0.js";
+function AppliedFilters() {
+  const { appliedFiltersSorted, isSkeleton } = useAppliedFilters();
+  if (isSkeleton) {
+    return /* @__PURE__ */ jsx(AppliedFiltersStyled, { ownerState: {} });
+  }
+  return /* @__PURE__ */ jsx(AppliedFiltersStyled, { ownerState: {}, children: /* @__PURE__ */ jsx(ScrollBar, { children: /* @__PURE__ */ jsx(AppliedFilterInnerContainerStyled, { ownerState: {}, children: appliedFiltersSorted?.map((filter) => /* @__PURE__ */ jsx(AppliedFilterChip, { ...filter }, filter.id)) }) }) });
+}
+export {
+  AppliedFilters as A
+};

package/components/DynamicFilter/subcomponents/AppliedFilters/index-l0sNRNKZ.js

@@ -0,0 +1 @@
+

package/components/DynamicFilter/subcomponents/AppliedFilters/useAppliedFilters-ZXCTxj2y.js

@@ -0,0 +1,15 @@
+import { u as useDynamicFilterStore } from "../../store/useDynamicFilterStore-CdlJeQW2.js";
+function useAppliedFilters() {
+  const appliedFilter = useDynamicFilterStore((state) => state.appliedFilters);
+  const isSkeleton = useDynamicFilterStore((state) => state.ownerState.isSkeleton);
+  const appliedFiltersSorted = [...appliedFilter].sort(
+    (filterA, filterB) => filterA.isSet !== filterB.isSet ? Number(filterA.isSet) - Number(filterB.isSet) : filterB.id - filterA.id
+  );
+  return {
+    appliedFiltersSorted,
+    isSkeleton
+  };
+}
+export {
+  useAppliedFilters as u
+};

package/components/DynamicFilter/subcomponents/DynamicFilterBase/DynamicFilterBase-C3Nc7ie6.js

@@ -0,0 +1,35 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { u as useDynamicFilterBase } from "./useDynamicFilterBase-sYj1gbd-.js";
+import { a as getPropDataTestId } from "../../../../test/getNameDataTestId-BaBTWhBr.js";
+import { R as RootStyled, I as InnerContainerStyled } from "../../slots/dynamicFilterSlots-X11BZr2l.js";
+import { D as DynamicFilterSlots } from "../../slots/SlotsEnum-cawFeNzx.js";
+import { I as InputFilter } from "../InputFilter/InputFilter-BeSpLzoZ.js";
+import { A as AppliedFilters } from "../AppliedFilters/AppliedFilters-DaHLVmBH.js";
+import { F as FilterActions } from "../FilterActions/FilterActions-j4YCmYGj.js";
+import { P as PopoverFilter } from "../PopoverFilter/PopoverFilter-COjduZb0.js";
+function DynamicFilterBase() {
+  const { ownerState, dataTestId } = useDynamicFilterBase();
+  return /* @__PURE__ */ jsx(
+    RootStyled,
+    {
+      ownerState: { ...ownerState },
+      ...getPropDataTestId(dataTestId, DynamicFilterSlots.root),
+      children: /* @__PURE__ */ jsxs(
+        InnerContainerStyled,
+        {
+          ownerState: { ...ownerState },
+          ...getPropDataTestId(dataTestId, DynamicFilterSlots.innerContainer),
+          children: [
+            /* @__PURE__ */ jsx(InputFilter, {}),
+            /* @__PURE__ */ jsx(AppliedFilters, {}),
+            /* @__PURE__ */ jsx(FilterActions, {}),
+            /* @__PURE__ */ jsx(PopoverFilter, {})
+          ]
+        }
+      )
+    }
+  );
+}
+export {
+  DynamicFilterBase as D
+};

package/components/DynamicFilter/subcomponents/DynamicFilterBase/index-l0sNRNKZ.js

@@ -0,0 +1 @@
+

package/components/DynamicFilter/subcomponents/DynamicFilterBase/useDynamicFilterBase-sYj1gbd-.js

@@ -0,0 +1,9 @@
+import { u as useDynamicFilterStore } from "../../store/useDynamicFilterStore-CdlJeQW2.js";
+function useDynamicFilterBase() {
+  const ownerState = useDynamicFilterStore((state) => state.ownerState);
+  const dataTestId = useDynamicFilterStore((state) => state.dataTestId);
+  return { ownerState, dataTestId };
+}
+export {
+  useDynamicFilterBase as u
+};

package/components/DynamicFilter/subcomponents/FieldTypes/BooleanFilter/helpers-B-hZ7Bgy.js

@@ -0,0 +1,77 @@
+import * as Yup from "yup";
+import { g as getDynamicFilterDictionary } from "../../../dictionary-CNZO5wD-.js";
+import { B as BOOLEAN_OPERATORS } from "../../../constants-ByqmFATV.js";
+import { B as BooleanFilter } from "./index-BYMShlon.js";
+class BooleanFilterHelpers {
+  getComponent() {
+    return BooleanFilter;
+  }
+  getDefaultFilter(field, fixed) {
+    const defaultOperand1 = field.defaultOperand1;
+    const defaultFilter = {
+      id: 0,
+      fieldType: "boolean",
+      field,
+      fixed,
+      isSet: true,
+      operator: "e",
+      operand1: true
+    };
+    if (defaultOperand1 !== void 0 && typeof defaultOperand1 === "boolean") {
+      defaultFilter.operand1 = defaultOperand1;
+    }
+    return defaultFilter;
+  }
+  getFilterFromFormValue(formFilterValue) {
+    const operator = formFilterValue.formValueOperator.id;
+    const operand1 = formFilterValue.formValueOperand1?.value || false;
+    return {
+      fieldType: "boolean",
+      operator,
+      operand1
+    };
+  }
+  getFormValue(field, getLabel, filterValue) {
+    const filterValueBoolean = filterValue ? filterValue : void 0;
+    const operator = filterValueBoolean ? filterValueBoolean.operator : field.defaultOperator ?? "e";
+    const formValueOperand1 = filterValueBoolean ? {
+      value: filterValueBoolean.operand1,
+      label: getLabel(getDynamicFilterDictionary(`operand_${filterValueBoolean.operand1}`))
+    } : null;
+    return {
+      fieldType: "boolean",
+      formValueOperator: {
+        id: operator,
+        label: getLabel(getDynamicFilterDictionary(`operator_${operator}`))
+      },
+      formValueOperand1
+    };
+  }
+  getLabels(filter, getLabel, _formatters, _field) {
+    const labelOperands = filter.operand1 ? getLabel(getDynamicFilterDictionary("operand_true")) : getLabel(getDynamicFilterDictionary("operand_false"));
+    return {
+      labelField: filter.field.label ?? getLabel(filter.field.dictionaryId),
+      labelOperator: getLabel(getDynamicFilterDictionary(`operator_${filter.operator}`)),
+      labelOperands
+    };
+  }
+  getSchema(getLabel) {
+    return Yup.object({
+      formValueOperator: Yup.object().nullable().required(getLabel(`dynamic_filter.error_operator_required`)),
+      formValueOperand1: Yup.object().nullable().required(getLabel(`dynamic_filter.error_operand_required`))
+    });
+  }
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  verifyFilter(filter, _field) {
+    if (typeof filter.operator !== "string") {
+      return false;
+    }
+    if (BOOLEAN_OPERATORS.findIndex((f) => f === filter.operator) === -1) {
+      return false;
+    }
+    return typeof filter.operand1 === "boolean";
+  }
+}
+export {
+  BooleanFilterHelpers as B
+};

package/components/DynamicFilter/subcomponents/FieldTypes/BooleanFilter/index-BYMShlon.js

@@ -0,0 +1,58 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useMemo } from "react";
+import { useModuleDictionary } from "@m4l/core";
+import { B as BOOLEAN_OPERATORS } from "../../../constants-ByqmFATV.js";
+import { g as getDynamicFilterDictionary, D as DICCTIONARY } from "../../../dictionary-CNZO5wD-.js";
+import { R as RHFAutocomplete } from "../../../../hook-form/RHFAutocomplete/RHFAutocomplete-8IcWz7CO.js";
+function BooleanFilter() {
+  const { getLabel } = useModuleDictionary();
+  const operators = useMemo(
+    () => BOOLEAN_OPERATORS.map((o) => ({
+      id: o,
+      label: getLabel(getDynamicFilterDictionary(`operator_${o}`))
+    })),
+    [getLabel]
+  );
+  const optionsYesNo = useMemo(
+    () => [
+      {
+        value: true,
+        label: getLabel(getDynamicFilterDictionary(DICCTIONARY.operand_true))
+      },
+      {
+        value: false,
+        label: getLabel(getDynamicFilterDictionary(DICCTIONARY.operand_false))
+      }
+    ],
+    [getLabel]
+  );
+  return /* @__PURE__ */ jsxs("div", { children: [
+    /* @__PURE__ */ jsx(
+      RHFAutocomplete,
+      {
+        type: "text",
+        name: "formValueOperator",
+        autoComplete: "off",
+        options: operators,
+        getOptionLabel: (option) => option.label,
+        isOptionEqualToValue: (option, value) => option.id === value.id,
+        label: getLabel(getDynamicFilterDictionary(DICCTIONARY.label_boolean_operator))
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      RHFAutocomplete,
+      {
+        type: "text",
+        name: "formValueOperand1",
+        autoComplete: "off",
+        options: optionsYesNo,
+        getOptionLabel: (option) => option.label,
+        isOptionEqualToValue: (option, value) => option.value === value.value,
+        label: getLabel(getDynamicFilterDictionary(DICCTIONARY.label_boolean_operand1))
+      }
+    )
+  ] });
+}
+export {
+  BooleanFilter as B
+};

package/components/DynamicFilter/subcomponents/FieldTypes/DataTypeComponent-Lwo9WmLE.js

@@ -0,0 +1,16 @@
+import { jsx } from "react/jsx-runtime";
+import { useEffect } from "react";
+import { useFormContext } from "react-hook-form";
+import { f as fieldFactory } from "./fieldFactory-Dx9a03_M.js";
+function DataTypeComponent(props) {
+  const { formFilter, statusLoad } = props;
+  const { setFocus } = useFormContext();
+  const Component = fieldFactory(formFilter.field.type).getComponent();
+  useEffect(() => {
+    setTimeout(() => setFocus("formValueOperand1"), 100);
+  }, [statusLoad]);
+  return /* @__PURE__ */ jsx(Component, {});
+}
+export {
+  DataTypeComponent as D
+};

package/components/DynamicFilter/subcomponents/FieldTypes/DateTimeFilter/helpers-gvsB_E9w.js

@@ -0,0 +1,123 @@
+import * as Yup from "yup";
+import { g as getDynamicFilterDictionary, D as DICCTIONARY } from "../../../dictionary-CNZO5wD-.js";
+import { a as DATE_TIME_OPERATORS } from "../../../constants-ByqmFATV.js";
+import { D as DateTimeFilter } from "./index-nnVSHJ6T.js";
+import { i as isValidDate } from "../../../../../utils/index-WXiWKKyo.js";
+class DateTimeFilterHelpers {
+  getComponent() {
+    return DateTimeFilter;
+  }
+  getDefaultFilter(field, fixed) {
+    const defaultStartDate = /* @__PURE__ */ new Date();
+    const defaultEndDate = /* @__PURE__ */ new Date();
+    defaultStartDate.setHours(0, 0, 0, 0);
+    defaultEndDate.setHours(23, 59, 59, 999);
+    const defaultOperand1 = field.defaultOperand1 && field.defaultOperand1 instanceof Date ? field.defaultOperand1 : defaultStartDate;
+    const defaultOperand2 = field.defaultOperand2 && field.defaultOperand2 instanceof Date ? field.defaultOperand2 : defaultEndDate;
+    return {
+      id: 0,
+      fieldType: "datetime",
+      field,
+      fixed,
+      isSet: true,
+      operator: "b",
+      operand1: defaultOperand1,
+      operand2: defaultOperand2
+    };
+  }
+  getFormValue(field, getLabel, filterValueDateTime) {
+    const filterValue = filterValueDateTime;
+    const operator = filterValue ? filterValue.operator : field.defaultOperator ?? "b";
+    const defaultStartDate = /* @__PURE__ */ new Date();
+    const defaultEndDate = /* @__PURE__ */ new Date();
+    const defaultOperand1 = field.defaultOperand1 && field.defaultOperand1 instanceof Date ? field.defaultOperand1 : defaultStartDate;
+    const defaultOperand2 = field.defaultOperand2 && field.defaultOperand2 instanceof Date ? field.defaultOperand2 : defaultEndDate;
+    const formValueOperand1 = filterValue ? filterValue.operand1 : defaultOperand1;
+    const formValueOperand2 = filterValue && filterValue.operator === "b" ? filterValue.operand2 : defaultOperand2;
+    return {
+      fieldType: "datetime",
+      formValueOperator: {
+        id: operator,
+        label: getLabel(getDynamicFilterDictionary(`operator_${operator}`))
+      },
+      formValueOperand1,
+      formValueOperand2
+    };
+  }
+  getFilterFromFormValue(formFilterValue) {
+    const operator = formFilterValue.formValueOperator.id;
+    const operand1 = formFilterValue.formValueOperand1;
+    if (operator === "b") {
+      const operand2 = formFilterValue.formValueOperand2;
+      return {
+        fieldType: "datetime",
+        operator,
+        operand1,
+        operand2
+      };
+    } else {
+      return {
+        fieldType: "datetime",
+        operator,
+        operand1
+      };
+    }
+  }
+  getLabels(filter, getLabel, formatters, _field) {
+    const { dateFormatter } = formatters;
+    let labelOperands;
+    if (filter.operator === "b") {
+      labelOperands = filter.operand1 && filter.operand2 ? `${dateFormatter.formatDate(
+        filter.operand1,
+        dateFormatter.datetimeFormat
+      )} - ${dateFormatter.formatDate(filter.operand2, dateFormatter.datetimeFormat)}` : "";
+    } else {
+      labelOperands = filter.operand1 ? dateFormatter.formatDate(filter.operand1, dateFormatter.datetimeFormat) : "";
+    }
+    return {
+      labelField: filter.field.label ?? getLabel(filter.field.dictionaryId),
+      labelOperator: getLabel(getDynamicFilterDictionary(`operator_${filter.operator}`)),
+      labelOperands
+    };
+  }
+  getSchema(getLabel) {
+    return Yup.object({
+      formValueOperator: Yup.object().nullable().required(getLabel(getDynamicFilterDictionary(DICCTIONARY.operator_required))),
+      formValueOperand1: Yup.date().required(getLabel(getDynamicFilterDictionary(DICCTIONARY.error_invalid_date))).typeError(getLabel(getDynamicFilterDictionary(DICCTIONARY.error_invalid_date))),
+      formValueOperand2: Yup.mixed().when(["formValueOperator.id"], {
+        is: "b",
+        then: Yup.date().typeError(getLabel(getDynamicFilterDictionary(DICCTIONARY.error_invalid_date))).min(
+          Yup.ref("formValueOperand1"),
+          getLabel(getDynamicFilterDictionary(DICCTIONARY.error_invalid_date))
+        )
+      })
+    });
+  }
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  verifyFilter(filter, _field) {
+    if (typeof filter.operator !== "string") {
+      return false;
+    }
+    if (DATE_TIME_OPERATORS.findIndex((f) => f === filter.operator) === -1) {
+      return false;
+    }
+    if (typeof filter.operand1 !== "string") {
+      return false;
+    }
+    if (!isValidDate(new Date(filter.operand1))) {
+      return false;
+    }
+    if (filter.operator === "b") {
+      if (typeof filter.operand2 !== "string") {
+        return false;
+      }
+      if (!isValidDate(new Date(filter.operand1))) {
+        return false;
+      }
+    }
+    return true;
+  }
+}
+export {
+  DateTimeFilterHelpers as D
+};

package/components/DynamicFilter/subcomponents/FieldTypes/DateTimeFilter/index-nnVSHJ6T.js

@@ -0,0 +1,54 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useMemo } from "react";
+import { useFormContext, useWatch } from "react-hook-form";
+import { useModuleDictionary } from "@m4l/core";
+import { a as DATE_TIME_OPERATORS } from "../../../constants-ByqmFATV.js";
+import { g as getDynamicFilterDictionary, D as DICCTIONARY } from "../../../dictionary-CNZO5wD-.js";
+import { R as RHFAutocomplete } from "../../../../hook-form/RHFAutocomplete/RHFAutocomplete-8IcWz7CO.js";
+import { R as RHFDateTime } from "../../../../hook-form/RHFDateTime/RHFDateTime-BPlsWlzn.js";
+function DateTimeFilter() {
+  const { getLabel } = useModuleDictionary();
+  const { control } = useFormContext();
+  const operator = useWatch({
+    control,
+    name: "formValueOperator"
+  });
+  const operators = useMemo(
+    () => DATE_TIME_OPERATORS.map((o) => ({
+      id: o,
+      label: getLabel(getDynamicFilterDictionary(`operator_${o}`))
+    })),
+    [getLabel]
+  );
+  return /* @__PURE__ */ jsxs("div", { children: [
+    /* @__PURE__ */ jsx(
+      RHFAutocomplete,
+      {
+        type: "text",
+        name: "formValueOperator",
+        autoComplete: "off",
+        options: operators,
+        getOptionLabel: (option) => option.label,
+        isOptionEqualToValue: (option, value) => option.id === value.id,
+        label: getLabel(getDynamicFilterDictionary(DICCTIONARY.label_operator_date_time))
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      RHFDateTime,
+      {
+        name: "formValueOperand1",
+        label: getLabel(getDynamicFilterDictionary(DICCTIONARY.label_operand1_date_time))
+      }
+    ),
+    operator && operator.id === "b" && /* @__PURE__ */ jsx(
+      RHFDateTime,
+      {
+        name: "formValueOperand2",
+        label: getLabel(getDynamicFilterDictionary(DICCTIONARY.label_operand2_date_time))
+      }
+    )
+  ] });
+}
+export {
+  DateTimeFilter as D
+};