@m4l/components 7.0.0 → 7.1.2

package/components/DynamicFilter/subcomponents/FieldTypes/SelectFilter/helpers.d.ts

@@ -1,21 +1,42 @@
 import { GetLabelType } from '@m4l/core';
 import { Formatters } from '@m4l/graphics';
-import type { IFieldType, YupSchema } from '../FieldTypeInterface';
-import type { DataTypeFilerLabels, Field, FilterFieldApplied, FilterValue, InitialFilterApplied, FormFilterValueSelect, FormOperandSelect } from '../../../types';
+import { IFieldType, YupSchema } from '../FieldTypeInterface';
+import { DataTypeFilerLabels, Field, FilterFieldApplied, FilterValue, InitialFilterApplied, FormFilterValueSelect, FormOperandSelect } from '../../../types';
 import { SelectFilter } from './index';
 /**
- * @description Filtra los valores de operandArray para que solo tengan valores validos
+ * Filtra los valores de operandArray para que solo tengan valores validos
  * @param operandsArray valores del OperandsArray
  * @param field Propiedades del field
  * @returns FormOperandSelect[] operandArray filtrado con valores validados
  */
-export declare function filterValidOperandsArraySelect(operandsArray: FormOperandSelect[] | FormOperandSelect, field: Field): FormOperandSelect[];
+export declare function filterValidOperandsArraySelect(operandsArray: FormOperandSelect[] | FormOperandSelect, field: Field): any[];
+/**
+ * TODO: Documentar
+ */
 export declare class SelectFilterHelpers implements IFieldType<FormFilterValueSelect> {
     getComponent(): typeof SelectFilter;
+    /**
+     * TODO: Documentar
+     */
     getDefaultFilter(field: Field, fixed: boolean): FilterFieldApplied;
+    /**
+     * TODO: Documentar
+     */
     getFormValue(field: Field, getLabel: GetLabelType, filterValueSelect?: FilterValue): FormFilterValueSelect;
+    /**
+     * TODO: Documentar
+     */
     getFilterFromFormValue(formFilterValue: FormFilterValueSelect): FilterValue;
+    /**
+     * TODO: Documentar
+     */
     getLabels(filter: FilterFieldApplied, getLabel: GetLabelType, _formatters: Formatters, field: Field): DataTypeFilerLabels;
+    /**
+     * TODO: Documentar
+     */
     getSchema(getLabel: GetLabelType): YupSchema;
+    /**
+     * TODO: Documentar
+     */
     verifyFilter(filter: InitialFilterApplied, field?: Field): boolean;
 }

package/components/DynamicFilter/subcomponents/FieldTypes/SelectFilter/helpers.js

@@ -0,0 +1,121 @@
+import * as Yup from "yup";
+import { g as getDynamicFilterDictionary } from "../../../dictionary.js";
+import { S as SelectFilter } from "./index.js";
+import { S as SELECT_OPERATORS } from "../../../constants.js";
+function filterValidOperandsArraySelect(operandsArray, field) {
+  const operandsArrayFormatted = Array.isArray(operandsArray) ? operandsArray : [operandsArray];
+  const getOptionId = field?.selectOptions?.getOptionId;
+  const getOptionLabel = field?.selectOptions?.getOptionLabel;
+  return operandsArrayFormatted?.filter((operand) => {
+    return typeof operand === "object" && getOptionId?.(operand) && getOptionLabel?.(operand);
+  });
+}
+class SelectFilterHelpers {
+  getComponent() {
+    return SelectFilter;
+  }
+  /**
+   * TODO: Documentar
+   */
+  getDefaultFilter(field, fixed) {
+    const defaultOperand = field.defaultOperandsArray;
+    const defaultFilter = {
+      id: 0,
+      fieldType: "select",
+      field,
+      fixed,
+      isSet: true,
+      operator: "in",
+      operandsArray: []
+    };
+    if (defaultOperand !== void 0 && Array.isArray(defaultOperand)) {
+      const validOperandsArray = filterValidOperandsArraySelect(defaultOperand, field);
+      defaultFilter.operandsArray = validOperandsArray || [];
+    }
+    return defaultFilter;
+  }
+  /**
+   * TODO: Documentar
+   */
+  getFormValue(field, getLabel, filterValueSelect) {
+    const filterValue = filterValueSelect ? filterValueSelect : void 0;
+    const isMultiple = field?.selectOptions?.multiple ?? false;
+    const formValueOperandsArray = isMultiple ? filterValueSelect?.operandsArray : filterValueSelect?.operandsArray?.[0] || filterValueSelect?.operandsArray;
+    const operator = filterValue ? filterValue.operator : field.defaultOperator ?? "in";
+    return {
+      fieldType: "select",
+      formValueOperator: {
+        id: operator,
+        label: getLabel(getDynamicFilterDictionary(`operator_${operator}`))
+      },
+      formValueOperandsArray
+    };
+  }
+  /**
+   * TODO: Documentar
+   */
+  getFilterFromFormValue(formFilterValue) {
+    const operator = formFilterValue.formValueOperator.id;
+    const operandsArray = Array.isArray(formFilterValue.formValueOperandsArray) ? formFilterValue.formValueOperandsArray : [formFilterValue.formValueOperandsArray];
+    return {
+      fieldType: "select",
+      operator,
+      operandsArray
+    };
+  }
+  /**
+   * TODO: Documentar
+   */
+  getLabels(filter, getLabel, _formatters, field) {
+    const operandsArray = filter.operandsArray;
+    const labelOperands = operandsArray?.reduce?.((label, operand) => {
+      const textLabel = field.selectOptions?.getOptionLabel?.(operand) || "";
+      return label ? `${label} | ${textLabel}` : textLabel;
+    }, "")?.toString() || "";
+    return {
+      labelField: filter.field.label ?? getLabel(filter.field.dictionaryId),
+      labelOperator: getLabel(getDynamicFilterDictionary(`operator_${filter.operator}`)),
+      labelOperands
+    };
+  }
+  /**
+   * TODO: Documentar
+   */
+  getSchema(getLabel) {
+    return Yup.object({
+      formValueOperator: Yup.object().nullable().required(getLabel(`dynamic_filter.error_operator_required`)),
+      formValueOperandsArray: Yup.lazy((value) => {
+        return Array.isArray(value) ? Yup.array().min(1, getLabel(`dynamic_filter.error_operand_required`)).of(Yup.object().nullable()).required(getLabel(`dynamic_filter.error_operand_required`)) : Yup.object().nullable().required(getLabel(`dynamic_filter.error_operand_required`));
+      })
+    });
+  }
+  /**
+   * TODO: Documentar
+   */
+  verifyFilter(filter, field) {
+    if (typeof filter.operator !== "string") {
+      return false;
+    }
+    if (!field) {
+      return false;
+    }
+    if (SELECT_OPERATORS.findIndex((f) => f === filter.operator) === -1) {
+      return false;
+    }
+    if (!filter.operandsArray || typeof filter.operandsArray !== "object") {
+      return false;
+    }
+    const validOperandsArray = filterValidOperandsArraySelect(
+      filter.operandsArray,
+      field
+    );
+    if (!validOperandsArray || validOperandsArray?.length === 0) {
+      return false;
+    }
+    return true;
+  }
+}
+export {
+  SelectFilterHelpers as S,
+  filterValidOperandsArraySelect as f
+};

package/components/DynamicFilter/subcomponents/FieldTypes/SelectFilter/index.d.ts

@@ -1,5 +1,5 @@
 /**
- * @description Subcomponente encargado de los filtros con el tipo de dato "boolean"
+ * Subcomponente encargado de los filtros con el tipo de dato "boolean"
  * @returns
  */
 export declare function SelectFilter(): import("react/jsx-runtime").JSX.Element;

package/components/DynamicFilter/subcomponents/FieldTypes/SelectFilter/index.js

@@ -0,0 +1,49 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useMemo } from "react";
+import { useModuleDictionary } from "@m4l/core";
+import { S as SELECT_OPERATORS } from "../../../constants.js";
+import { g as getDynamicFilterDictionary, D as DICCTIONARY } from "../../../dictionary.js";
+import { u as useDynamicFilterStore } from "../../../store/useDynamicFilterStore.js";
+import { R as RHFAutocomplete } from "../../../../hook-form/RHFAutocomplete/RHFAutocomplete.js";
+import { R as RHFAutocompleteAsync } from "../../../../hook-form/RHFAutocompleteAsync/RHFAutocompleteAsync.js";
+function SelectFilter() {
+  const { getLabel } = useModuleDictionary();
+  const field = useDynamicFilterStore((state) => state.popoverFilterData?.field);
+  if (!field?.selectOptions?.endPoint) {
+    throw new Error("El filtro tipo Select requiere la configuración del Endpoint");
+  }
+  const autocompleteProps = field?.selectOptions;
+  const operators = useMemo(
+    () => SELECT_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_select_operator))
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      RHFAutocompleteAsync,
+      {
+        ...autocompleteProps,
+        name: "formValueOperandsArray",
+        autoComplete: "off",
+        label: getLabel(getDynamicFilterDictionary(DICCTIONARY.label_select_operands_array))
+      }
+    )
+  ] });
+}
+export {
+  SelectFilter as S
+};

package/components/DynamicFilter/subcomponents/FieldTypes/StringFilter/helpers.d.ts

@@ -1,14 +1,35 @@
 import { GetLabelType } from '@m4l/core';
 import { Formatters } from '@m4l/graphics';
-import type { IFieldType, YupSchema } from '../FieldTypeInterface';
-import type { FilterFieldApplied, FormFilterValueString, Field, DataTypeFilerLabels, FilterValue, InitialFilterApplied } from '../../../types';
+import { IFieldType, YupSchema } from '../FieldTypeInterface';
+import { FilterFieldApplied, FormFilterValueString, Field, DataTypeFilerLabels, FilterValue, InitialFilterApplied } from '../../../types';
 import { StringFilter } from './index';
+/**
+ * TODO: Documentar
+ */
 export declare class StringFilterHelpers implements IFieldType<FormFilterValueString> {
     getComponent(): typeof StringFilter;
+    /**
+     * TODO: Documentar
+     */
     getDefaultFilter(field: Field, fixed: boolean): FilterFieldApplied;
+    /**
+     * TODO: Documentar
+     */
     getFilterFromFormValue(formFilterValue: FormFilterValueString): FilterValue;
+    /**
+     * TODO: Documentar
+     */
     getFormValue(field: Field, getLabel: GetLabelType, filterValue?: FilterValue): FormFilterValueString;
+    /**
+     * TODO: Documentar
+     */
     getLabels(filter: FilterFieldApplied, getLabel: GetLabelType, _formatters: Formatters, _field: Field): DataTypeFilerLabels;
+    /**
+     * TODO: Documentar
+     */
     getSchema(getLabel: GetLabelType): YupSchema;
+    /**
+     * TODO: Documentar
+     */
     verifyFilter(filter: InitialFilterApplied, _field?: Field): boolean;
 }

package/components/DynamicFilter/subcomponents/FieldTypes/StringFilter/helpers.js

@@ -0,0 +1,96 @@
+import * as Yup from "yup";
+import { g as getDynamicFilterDictionary, D as DICCTIONARY } from "../../../dictionary.js";
+import { b as STRING_OPERATORS } from "../../../constants.js";
+import { S as StringFilter } from "./index.js";
+class StringFilterHelpers {
+  getComponent() {
+    return StringFilter;
+  }
+  /**
+   * TODO: Documentar
+   */
+  getDefaultFilter(field, fixed) {
+    const defaultOperand1 = field.defaultOperand1;
+    const defaultFilter = {
+      id: 0,
+      fieldType: "string",
+      field,
+      fixed,
+      isSet: false,
+      operator: "c",
+      operand1: ""
+    };
+    if (defaultOperand1 !== void 0 && typeof defaultOperand1 === "string") {
+      defaultFilter.operand1 = defaultOperand1;
+    }
+    return defaultFilter;
+  }
+  /**
+   * TODO: Documentar
+   */
+  getFilterFromFormValue(formFilterValue) {
+    const operator = formFilterValue.formValueOperator.id;
+    const operand1 = formFilterValue.formValueOperand1;
+    return {
+      fieldType: "string",
+      operator,
+      operand1
+    };
+  }
+  /**
+   * TODO: Documentar
+   */
+  getFormValue(field, getLabel, filterValue) {
+    const filterValueString = filterValue;
+    const operator = filterValueString ? filterValueString.operator : field.defaultOperator ?? "c";
+    const formValueOperand1 = filterValueString ? filterValueString.operand1 : "";
+    return {
+      fieldType: "string",
+      formValueOperator: {
+        id: operator,
+        label: getLabel(getDynamicFilterDictionary(`operator_${operator}`))
+      },
+      formValueOperand1
+    };
+  }
+  /**
+   * TODO: Documentar
+   */
+  getLabels(filter, getLabel, _formatters, _field) {
+    const labelOperands = filter.operand1 !== void 0 ? filter.operand1 + "" : "";
+    return {
+      labelField: filter.field.label ?? getLabel(filter.field.dictionaryId),
+      labelOperator: getLabel(getDynamicFilterDictionary(`operator_${filter.operator}`)),
+      labelOperands
+    };
+  }
+  /**
+   * TODO: Documentar
+   */
+  getSchema(getLabel) {
+    return Yup.object({
+      formValueOperator: Yup.object().nullable().required(getLabel(getDynamicFilterDictionary(DICCTIONARY.operator_required))),
+      formValueOperand1: Yup.string().required(
+        getLabel(getDynamicFilterDictionary(DICCTIONARY.error_operand_required))
+      )
+    });
+  }
+  /**
+   * TODO: Documentar
+   */
+  verifyFilter(filter, _field) {
+    if (typeof filter.operator !== "string") {
+      return false;
+    }
+    if (STRING_OPERATORS.findIndex((f) => f === filter.operator) === -1) {
+      return false;
+    }
+    if (typeof filter.operand1 !== "string") {
+      return false;
+    }
+    return true;
+  }
+}
+export {
+  StringFilterHelpers as S
+};

package/components/DynamicFilter/subcomponents/FieldTypes/StringFilter/index.d.ts

@@ -1,5 +1,5 @@
 /**
- * @description Subcomponente encargado de los filtros con el tipo de dato "string"
+ * Subcomponente encargado de los filtros con el tipo de dato "string"
  * @returns JSX
  */
 export declare function StringFilter(): import("react/jsx-runtime").JSX.Element;

package/components/DynamicFilter/subcomponents/FieldTypes/StringFilter/index.js

@@ -0,0 +1,41 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useMemo } from "react";
+import { useModuleDictionary } from "@m4l/core";
+import { b as STRING_OPERATORS } from "../../../constants.js";
+import { g as getDynamicFilterDictionary, D as DICCTIONARY } from "../../../dictionary.js";
+import { R as RHFAutocomplete } from "../../../../hook-form/RHFAutocomplete/RHFAutocomplete.js";
+import { R as RHFTextField } from "../../../../hook-form/RHFTextField/RHFTextField.js";
+function StringFilter() {
+  const { getLabel } = useModuleDictionary();
+  const operators = useMemo(
+    () => STRING_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_string))
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      RHFTextField,
+      {
+        name: "formValueOperand1",
+        label: getLabel(getDynamicFilterDictionary(DICCTIONARY.label_operand1_string))
+      }
+    )
+  ] });
+}
+export {
+  StringFilter as S
+};

package/components/DynamicFilter/subcomponents/FieldTypes/fieldFactory.d.ts

@@ -1,7 +1,10 @@
-import type { FieldType } from '../../types';
+import { FieldType } from '../../types';
 import { BooleanFilterHelpers } from './BooleanFilter/helpers';
 import { StringFilterHelpers } from './StringFilter/helpers';
 import { DateTimeFilterHelpers } from './DateTimeFilter/helpers';
 import { NumberFilterHelpers } from './NumberFilter/helpers';
 import { SelectFilterHelpers } from './SelectFilter/helpers';
-export declare function fieldFactory(type: FieldType): BooleanFilterHelpers | StringFilterHelpers | NumberFilterHelpers | DateTimeFilterHelpers | SelectFilterHelpers;
+/**
+ * TODO: Documentar
+ */
+export declare function fieldFactory(type: FieldType): BooleanFilterHelpers | StringFilterHelpers | DateTimeFilterHelpers | NumberFilterHelpers | SelectFilterHelpers;

package/components/DynamicFilter/subcomponents/FieldTypes/fieldFactory.js

@@ -0,0 +1,25 @@
+import { B as BooleanFilterHelpers } from "./BooleanFilter/helpers.js";
+import { S as StringFilterHelpers } from "./StringFilter/helpers.js";
+import { D as DateTimeFilterHelpers } from "./DateTimeFilter/helpers.js";
+import { N as NumberFilterHelpers } from "./NumberFilter/helpers.js";
+import { S as SelectFilterHelpers } from "./SelectFilter/helpers.js";
+const helpersStrategies = {
+  boolean: new BooleanFilterHelpers(),
+  string: new StringFilterHelpers(),
+  number: new NumberFilterHelpers(),
+  datetime: new DateTimeFilterHelpers(),
+  select: new SelectFilterHelpers(),
+  __default__: () => {
+    throw new Error("Type no defined");
+  }
+};
+function fieldFactory(type) {
+  const selectedHelper = helpersStrategies?.[type];
+  if (!selectedHelper) {
+    return helpersStrategies.__default__();
+  }
+  return selectedHelper;
+}
+export {
+  fieldFactory as f
+};

package/components/DynamicFilter/subcomponents/FilterActions/FilterActions.d.ts

@@ -1,2 +1,5 @@
+/**
+ * TODO: Documentar
+ */
 declare function FilterActions(): import("react/jsx-runtime").JSX.Element;
 export default FilterActions;

package/components/DynamicFilter/subcomponents/FilterActions/FilterActions.js

@@ -0,0 +1,43 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { u as useFilterActions } from "./useFilterActions.js";
+import { F as FilterActionsSkeleton } from "./FilterActionsSkeleton.js";
+import { i as ActionsStyled, j as ActionsClearButtonStyled, k as ActionsSubmitButtonStyled } from "../../slots/dynamicFilterSlots.js";
+function FilterActions() {
+  const {
+    isSkeleton,
+    filterIconUrl,
+    clearIconUrl,
+    canShowRemoveAction,
+    onClickClearFilters,
+    onClickFilter,
+    filterButtonDictionaryTooltip,
+    ownerState
+  } = useFilterActions();
+  if (isSkeleton) {
+    return /* @__PURE__ */ jsx(ActionsStyled, { ownerState: {}, children: /* @__PURE__ */ jsx(FilterActionsSkeleton, {}) });
+  }
+  return /* @__PURE__ */ jsxs(ActionsStyled, { ownerState: {}, children: [
+    canShowRemoveAction && /* @__PURE__ */ jsx(
+      ActionsClearButtonStyled,
+      {
+        src: clearIconUrl,
+        onClick: onClickClearFilters,
+        dictionaryTooltipId: "dynamic_filter.tooltip_clear_filters",
+        ownerState: {}
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      ActionsSubmitButtonStyled,
+      {
+        src: filterIconUrl,
+        "aria-label": "settings",
+        dictionaryTooltipId: filterButtonDictionaryTooltip,
+        onClick: onClickFilter,
+        ownerState: { ...ownerState }
+      }
+    )
+  ] });
+}
+export {
+  FilterActions as F
+};

package/components/DynamicFilter/subcomponents/FilterActions/FilterActionsSkeleton.d.ts

@@ -1,2 +1,5 @@
+/**
+ * TODO: Documentar
+ */
 declare function FilterActionsSkeleton(): import("react/jsx-runtime").JSX.Element;
 export default FilterActionsSkeleton;

package/components/DynamicFilter/subcomponents/FilterActions/FilterActionsSkeleton.js

@@ -0,0 +1,12 @@
+import { jsxs, Fragment, jsx } from "react/jsx-runtime";
+import { Skeleton } from "@mui/material";
+import { l as ActionsSkeletonButtonStyled } from "../../slots/dynamicFilterSlots.js";
+function FilterActionsSkeleton() {
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(ActionsSkeletonButtonStyled, { ownerState: {}, children: /* @__PURE__ */ jsx(Skeleton, { variant: "circular", width: "16px", height: "16px" }) }),
+    /* @__PURE__ */ jsx(ActionsSkeletonButtonStyled, { ownerState: {}, children: /* @__PURE__ */ jsx(Skeleton, { variant: "circular", width: "16px", height: "16px" }) })
+  ] });
+}
+export {
+  FilterActionsSkeleton as F
+};

package/components/DynamicFilter/subcomponents/FilterActions/index.js

@@ -0,0 +1 @@
+

package/components/DynamicFilter/subcomponents/FilterActions/useFilterActions.d.ts

@@ -3,6 +3,9 @@ export declare const ASSETS: {
     readonly refresh: "restart.svg";
     readonly search: "search.svg";
 };
+/**
+ * TODO: Documentar
+ */
 declare function useFilterActions(): {
     isSkeleton: boolean;
     filterIconUrl: string;

package/components/DynamicFilter/subcomponents/FilterActions/useFilterActions.js

@@ -0,0 +1,43 @@
+import { useEnvironment } from "@m4l/core";
+import { u as useDynamicFilterStore } from "../../store/useDynamicFilterStore.js";
+import { g as getDynamicFilterDictionary, D as DICCTIONARY } from "../../dictionary.js";
+const ASSETS_URL = "frontend/components/dynamic_filter/assets/icons";
+const ASSETS = {
+  refresh: "restart.svg",
+  search: "search.svg"
+};
+function useFilterActions() {
+  const { host_static_assets, environment_assets } = useEnvironment();
+  const automatic = useDynamicFilterStore((state) => state.automatic);
+  const isSkeleton = useDynamicFilterStore((state) => state.ownerState.isSkeleton);
+  const isValid = useDynamicFilterStore((state) => state.ownerState.isValid);
+  const isDirty = useDynamicFilterStore((state) => state.ownerState.isDirty);
+  const appliedFilters = useDynamicFilterStore((state) => state.appliedFilters);
+  const { hidePopoverFilter, clearFilters, fireOnChangeFilters } = useDynamicFilterStore(
+    (state) => state.actions
+  );
+  function onClickClearFilters() {
+    hidePopoverFilter(false);
+    clearFilters();
+    fireOnChangeFilters();
+  }
+  const filterIconUrl = `${host_static_assets}/${environment_assets}/${ASSETS_URL}/${automatic ? ASSETS.refresh : ASSETS.search}`;
+  const clearIconUrl = `${host_static_assets}/${environment_assets}/frontend/components/dynamic_filter/assets/icons/close.svg`;
+  const canShowRemoveAction = appliedFilters.findIndex((f) => !f.fixed) > -1;
+  const filterButtonDictionaryTooltip = getDynamicFilterDictionary(
+    isValid ? isDirty ? DICCTIONARY.filter_tooltip_dirty : DICCTIONARY.filter_tooltip_refresh : DICCTIONARY.filter_tooltip_invalid
+  );
+  return {
+    isSkeleton,
+    filterIconUrl,
+    clearIconUrl,
+    canShowRemoveAction,
+    onClickClearFilters,
+    onClickFilter: fireOnChangeFilters,
+    filterButtonDictionaryTooltip,
+    ownerState: { isValid }
+  };
+}
+export {
+  useFilterActions as u
+};

package/components/DynamicFilter/subcomponents/InputFilter/InputFilter.d.ts

@@ -1,2 +1,5 @@
+/**
+ * TODO: Documentar
+ */
 declare const InputFilter: () => import("react/jsx-runtime").JSX.Element | null;
 export default InputFilter;

package/components/DynamicFilter/subcomponents/InputFilter/InputFilter.js

@@ -0,0 +1,40 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { u as useInputFilter } from "./useInputFilter.js";
+import { I as InputFilterSkeleton } from "./InputFilterSkeleton.js";
+import { m as InputFilterStyled, n as InputFilterIconStyled, o as InputFilterInputStyled } from "../../slots/dynamicFilterSlots.js";
+import { P as PopoverMenuFields } from "../PopoverMenuFields/PopoverMenuFields.js";
+const InputFilter = () => {
+  const {
+    iconUrl,
+    isSkeleton,
+    inputPlaceHolder,
+    inputData,
+    inputHandlersProps,
+    canRender,
+    filteredFields,
+    selectedFieldIndex
+  } = useInputFilter();
+  if (!canRender) {
+    return null;
+  }
+  if (isSkeleton) {
+    return /* @__PURE__ */ jsx(InputFilterStyled, { ownerState: {}, children: /* @__PURE__ */ jsx(InputFilterSkeleton, {}) });
+  }
+  return /* @__PURE__ */ jsxs(InputFilterStyled, { ownerState: {}, children: [
+    /* @__PURE__ */ jsx(InputFilterIconStyled, { src: iconUrl, ownerState: {} }),
+    /* @__PURE__ */ jsx(
+      InputFilterInputStyled,
+      {
+        type: "text",
+        value: inputData,
+        placeholder: inputPlaceHolder,
+        ownerState: {},
+        ...inputHandlersProps
+      }
+    ),
+    /* @__PURE__ */ jsx(PopoverMenuFields, { fields: filteredFields, selectFieldIndex: selectedFieldIndex })
+  ] });
+};
+export {
+  InputFilter as I
+};

package/components/DynamicFilter/subcomponents/InputFilter/InputFilterSkeleton.d.ts

@@ -1,2 +1,5 @@
+/**
+ * TODO: Documentar
+ */
 declare function InputFilterSkeleton(): import("react/jsx-runtime").JSX.Element;
 export default InputFilterSkeleton;

package/components/DynamicFilter/subcomponents/InputFilter/InputFilterSkeleton.js

@@ -0,0 +1,19 @@
+import { jsxs, Fragment, jsx } from "react/jsx-runtime";
+import { Skeleton } from "@mui/material";
+function InputFilterSkeleton() {
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      Skeleton,
+      {
+        variant: "circular",
+        width: "16px",
+        height: "16px",
+        sx: { minWidth: "16px", minHeight: "16px" }
+      }
+    ),
+    /* @__PURE__ */ jsx(Skeleton, { variant: "text", width: "100%", height: "16px", sx: { minWidth: "80px" } })
+  ] });
+}
+export {
+  InputFilterSkeleton as I
+};

package/components/DynamicFilter/subcomponents/InputFilter/index.js

@@ -0,0 +1 @@
+