@m4l/components 9.1.142 → 9.1.144

package/components/DataGrid/index.d.ts

@@ -1,9 +1,8 @@
-import { DataGridProps, RowKey } from './types';
-/**
- * DataGrid es un componente encargado de mostrar información en una tabla
- * con funcionalidades de paginación, filtros y acciones.
- * ### Dependencies:
- * - **`useResponsiveContainerStore:`** Hook que permite obtener el tamaño del contenedor.
- * - **`useModuleDictionary:`** Hook que permite manejar la internacionalización de los textos.
- */
-export declare function DataGrid<TRow, TSummaryRow, TKey extends RowKey = RowKey>(props: DataGridProps<TRow, TSummaryRow, TKey>): import("react/jsx-runtime").JSX.Element;
+export { DataGrid } from './DataGrid';
+export * from './formatters';
+export type { Column, EditorProps, FormatterProps } from 'react-data-grid';
+export type { RowKey, ChangeUserColumn } from './types';
+export { getDataGridComponentsDictionary } from './dictionary';
+export { TextEditor, NumberEditor } from './subcomponents/editors/TextEditor';
+export { getDataGridRowsFromSet } from './utils/getDataGridRowsFromSet';
+export type { IGridConfig } from './contexts/DataGridContext/types';

package/components/DataGrid/index.js

@@ -1,89 +1 @@
-import { jsx, jsxs } from "react/jsx-runtime";
-import { T as Table } from "./subcomponents/Table/index.js";
-import { A as Actions } from "./subcomponents/Actions/index.js";
-import { a as FilterProvider } from "./contexts/FilterContext/index.js";
-import { a as DataGridProvider } from "./contexts/DataGridContext/index.js";
-import { T as TEST_PROP_COLUMNS } from "./types.js";
-import { T as TEST_PROP_ID } from "../../test/constants_no_mock.js";
-import { a as getNameDataTestId } from "../../test/getNameDataTestId.js";
-import { D as DATAGRID_PREFIX_NAME } from "./constants.js";
-import { D as DataGridRootStyled } from "./slots/DataGridSlot.js";
-import { a as getComponentSlotRoot } from "../../utils/getComponentSlotRoot.js";
-import { useRef } from "react";
-function DataGrid(props) {
-  const {
-    id,
-    withActions = true,
-    rows,
-    columns,
-    actionsProps,
-    selectedRows,
-    onSelectedRowsChange,
-    rowKeyGetter,
-    rowActionsGetter,
-    onRowsChange,
-    rowHeaderHeights,
-    rowHeights,
-    initialRowHeightVariant,
-    checkedRows,
-    onCheckedRowsChange,
-    dataTestId = "",
-    defaultUserColumns,
-    onChangeUserColumns
-  } = props;
-  const refDataGrid = useRef(null);
-  const classRoot = getComponentSlotRoot(DATAGRID_PREFIX_NAME);
-  return /* @__PURE__ */ jsx(
-    DataGridRootStyled,
-    {
-      ref: refDataGrid,
-      className: classRoot,
-      ...process.env.NODE_ENV !== "production" ? {
-        [TEST_PROP_COLUMNS]: JSON.stringify(columns),
-        [TEST_PROP_ID]: getNameDataTestId(DATAGRID_PREFIX_NAME, "root", dataTestId)
-      } : {},
-      children: /* @__PURE__ */ jsx(
-        DataGridProvider,
-        {
-          id: props.id,
-          columns,
-          rowHeights,
-          rowHeaderHeights,
-          initialRowHeightVariant,
-          rowsCount: rows.length,
-          checkedRows,
-          rowActionsGetter,
-          onCheckedRowsChange,
-          rowKeyGetter,
-          rows,
-          onChangeUserColumns,
-          defaultUserColumns,
-          children: /* @__PURE__ */ jsxs(FilterProvider, { initialActiveFilters: false, children: [
-            withActions && actionsProps && /* @__PURE__ */ jsx(
-              Actions,
-              {
-                ...actionsProps
-              }
-            ),
-            /* @__PURE__ */ jsx(
-              Table,
-              {
-                id,
-                withActions,
-                columns,
-                rows,
-                selectedRows,
-                onSelectedRowsChange,
-                rowKeyGetter,
-                onRowsChange
-              }
-            )
-          ] })
-        }
-      )
-    }
-  );
-}
-export {
-  DataGrid as D
-};
+

package/components/DataGrid/slots/DataGridEnum.d.ts

@@ -1,5 +1,6 @@
 export declare enum DataGridSlots {
-    datagridRoot = "datagridRoot"
+    datagridRoot = "datagridRoot",
+    customHeader = "customHeader"
 }
 export declare enum ActionsSlots {
     actionsRoot = "actionsRoot",

package/components/DataGrid/slots/DataGridEnum.js

@@ -1,5 +1,6 @@
 var DataGridSlots = /* @__PURE__ */ ((DataGridSlots2) => {
   DataGridSlots2["datagridRoot"] = "datagridRoot";
+  DataGridSlots2["customHeader"] = "customHeader";
   return DataGridSlots2;
 })(DataGridSlots || {});
 var ActionsSlots = /* @__PURE__ */ ((ActionsSlots2) => {

package/components/DataGrid/slots/DataGridSlot.d.ts

@@ -3,46 +3,47 @@
  * Slots DataGrid
  * ****************
  */
-export declare const DataGridRootStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
+export declare const DataGridRootStyled: import('@emotion/styled').StyledComponent<any, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
+export declare const CustomHeaderStyled: import('@emotion/styled').StyledComponent<any, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
 /**
  * ****************
  * Slots Actions
  * ****************
  */
-export declare const ActionsRootStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
-export declare const ActionsConfigContainerStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
+export declare const ActionsRootStyled: import('@emotion/styled').StyledComponent<any, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
+export declare const ActionsConfigContainerStyled: import('@emotion/styled').StyledComponent<any, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
 /**
  * ****************
  * Slots RowsCount
  * ****************
  */
-export declare const RowsCountRootStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
-export declare const RowsCountLabelStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
-export declare const RowsCountValueStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
+export declare const RowsCountRootStyled: import('@emotion/styled').StyledComponent<any, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
+export declare const RowsCountLabelStyled: import('@emotion/styled').StyledComponent<any, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
+export declare const RowsCountValueStyled: import('@emotion/styled').StyledComponent<any, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
 /**
  * ****************
  * Slots ColumnsConfig
  * ****************
  */
-export declare const ColumnsConfigWrapperStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
-export declare const ColumnsConfigSelColumnsStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
-export declare const ColumnsConfigDataGridStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
-export declare const ColumnsConfigActiosStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
+export declare const ColumnsConfigWrapperStyled: import('@emotion/styled').StyledComponent<any, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
+export declare const ColumnsConfigSelColumnsStyled: import('@emotion/styled').StyledComponent<any, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
+export declare const ColumnsConfigDataGridStyled: import('@emotion/styled').StyledComponent<any, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
+export declare const ColumnsConfigActiosStyled: import('@emotion/styled').StyledComponent<any, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
 /**
  * ****************
  * Slots Table
  * ****************
  */
-export declare const TableContainerStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
-export declare const TableWrapperDataGridStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
-export declare const DraggableHeaderRootStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
-export declare const DraggableWrapperInputBaseStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
-export declare const HeaderInputBaseStyled: import('@emotion/styled').StyledComponent<Pick<import('@mui/material').InputBaseProps, keyof import('@mui/material').InputBaseProps> & import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown>, {}, {}>;
-export declare const WrapperSkeletonStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
-export declare const ContentModalSettingStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
+export declare const TableContainerStyled: import('@emotion/styled').StyledComponent<any, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
+export declare const TableWrapperDataGridStyled: import('@emotion/styled').StyledComponent<any, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
+export declare const DraggableHeaderRootStyled: import('@emotion/styled').StyledComponent<any, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
+export declare const DraggableWrapperInputBaseStyled: import('@emotion/styled').StyledComponent<any, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
+export declare const HeaderInputBaseStyled: import('@emotion/styled').StyledComponent<any, {}, {}>;
+export declare const WrapperSkeletonStyled: import('@emotion/styled').StyledComponent<any, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
+export declare const ContentModalSettingStyled: import('@emotion/styled').StyledComponent<any, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
 /**
  * ****************
  * Slots TextEditor
  * ****************
  */
-export declare const InputTextEditorStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown>, Pick<import('react').DetailedHTMLProps<import('react').InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, keyof import('react').ClassAttributes<HTMLInputElement> | keyof import('react').InputHTMLAttributes<HTMLInputElement>>, {}>;
+export declare const InputTextEditorStyled: import('@emotion/styled').StyledComponent<any, Pick<import('react').DetailedHTMLProps<import('react').InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, keyof import('react').ClassAttributes<HTMLInputElement> | keyof import('react').InputHTMLAttributes<HTMLInputElement>>, {}>;

package/components/DataGrid/slots/DataGridSlot.js

@@ -7,6 +7,10 @@ const DataGridRootStyled = styled("div", {
   name: DATAGRID_PREFIX_NAME,
   slot: DataGridSlots.datagridRoot
 })(dataGridStyles.datagridRoot);
+const CustomHeaderStyled = styled("div", {
+  name: DATAGRID_PREFIX_NAME,
+  slot: DataGridSlots.customHeader
+})(dataGridStyles.customHeader);
 const ActionsRootStyled = styled("div", {
   name: DATAGRID_PREFIX_NAME,
   slot: ActionsSlots.actionsRoot
@@ -77,7 +81,7 @@ const InputTextEditorStyled = styled("input", {
 })(dataGridStyles.inputTexEditor);
 export {
   ActionsRootStyled as A,
-  ColumnsConfigWrapperStyled as C,
+  CustomHeaderStyled as C,
   DataGridRootStyled as D,
   HeaderInputBaseStyled as H,
   InputTextEditorStyled as I,
@@ -87,11 +91,12 @@ export {
   ActionsConfigContainerStyled as a,
   RowsCountLabelStyled as b,
   RowsCountValueStyled as c,
-  ColumnsConfigSelColumnsStyled as d,
-  ColumnsConfigDataGridStyled as e,
-  ColumnsConfigActiosStyled as f,
-  ContentModalSettingStyled as g,
-  TableContainerStyled as h,
-  DraggableHeaderRootStyled as i,
-  DraggableWrapperInputBaseStyled as j
+  ColumnsConfigWrapperStyled as d,
+  ColumnsConfigSelColumnsStyled as e,
+  ColumnsConfigDataGridStyled as f,
+  ColumnsConfigActiosStyled as g,
+  ContentModalSettingStyled as h,
+  TableContainerStyled as i,
+  DraggableHeaderRootStyled as j,
+  DraggableWrapperInputBaseStyled as k
 };

package/components/DataGrid/styles.js

@@ -20,7 +20,7 @@ const dataGridStyles = {
     border: theme.vars.size.borderStroke.container,
     borderColor: theme.vars.palette?.border.default,
     position: "relative",
-    gap: theme.vars.size.baseSpacings.sp1,
+    gap: theme.vars.size.baseSpacings.sp3,
     height: "100%",
     width: "100%",
     "& .rdg .MuiCheckbox-root": {
@@ -49,6 +49,9 @@ const dataGridStyles = {
       //Se utiliza directamente el valor porque no está tokenizado
     }
   }),
+  customHeader: ({ ownerState }) => ({
+    display: ownerState.visibleCustomHeader ? "block" : "none"
+  }),
   /**
    * Estilos del contenedor de las acciones
    */
@@ -63,14 +66,15 @@ const dataGridStyles = {
     gap: theme.vars.size.baseSpacings.sp2,
     height: theme.vars.size.baseSpacings.sp8,
     justifyContent: "space-between",
-    left: theme.vars.size.baseSpacings.sp0,
     lineHeight: theme.vars.size.baseSpacings.sp4,
     minHeight: theme.vars.size.baseSpacings.sp8,
     padding: `${theme.vars.size.baseSpacings.sp1} ${theme.vars.size.baseSpacings.sp2}`,
-    position: "absolute",
     right: theme.vars.size.baseSpacings.sp0,
     top: theme.vars.size.baseSpacings.sp0,
     fontsize: getTypographyStyles(theme.generalSettings.isMobile, "medium", "body").fontSize,
+    '& [class*="M4LPager-root"]': {
+      flexGrow: 1
+    },
     "@container main (max-width: 600px)": {
       height: theme.vars.size.baseSpacings.sp11
     }
@@ -82,6 +86,7 @@ const dataGridStyles = {
     display: "flex",
     flexDirection: "row",
     gap: theme.vars.size.baseSpacings.sp2,
+    alignItems: "center",
     marginLeft: theme.vars.size.baseSpacings.sp3,
     "& .M4LIconButton-root": {
       background: theme.vars.palette.background.default
@@ -197,11 +202,8 @@ const dataGridStyles = {
   tableContaniner: ({ theme }) => ({
     display: "flex",
     flexDirection: "column",
-    position: "absolute",
-    top: theme.vars.size.baseSpacings.sp8,
-    bottom: theme.vars.size.baseSpacings.sp0,
-    left: theme.vars.size.baseSpacings.sp0,
-    right: theme.vars.size.baseSpacings.sp0,
+    position: "relative",
+    flexGrow: 1,
     overflow: "hidden",
     padding: `${theme.vars.size.baseSpacings.sp0} ${theme.vars.size.baseSpacings.sp1}`,
     borderRadius: theme.vars.size.baseSpacings.sp1,

package/components/DataGrid/subcomponents/Actions/index.js

@@ -1,42 +1,45 @@
-import { jsxs, jsx } from "react/jsx-runtime";
-import { P as Pager } from "../../../Pager/Pager.js";
+import { jsxs, jsx, Fragment } from "react/jsx-runtime";
 import { F as Filter } from "./subcomponents/Filter/index.js";
 import { S as Settings } from "./subcomponents/Settings/index.js";
 import { R as RowsCount } from "./subcomponents/RowsCount/index.js";
 import { D as Density } from "./subcomponents/Density/index.js";
 import { u as useDataGrid } from "../../hooks/useDataGrid.js";
 import { useIsMobile } from "@m4l/graphics";
-import { useModuleDictionary } from "@m4l/core";
-import { d as dictionary } from "../../dictionary.js";
 import { M as MobileMenuActions } from "./subcomponents/MobileMenuActions/index.js";
 import { A as ActionsRootStyled, a as ActionsConfigContainerStyled } from "../../slots/DataGridSlot.js";
+import { P as Pager } from "../../../Pager/Pager.js";
 function Actions(props) {
   const isMobile = useIsMobile();
   const { rowHeights } = useDataGrid();
-  const { getLabel } = useModuleDictionary();
   const {
     withRowsCount = true,
     withPager = true,
     pagerOptions,
     withSettings = true,
     settingsProps,
-    withLocalFilters
+    withLocalFilters,
+    leftActions: LeftActions,
+    rightActions: RightActions
   } = props;
   return /* @__PURE__ */ jsxs(ActionsRootStyled, { children: [
-    withRowsCount && !isMobile && /* @__PURE__ */ jsx(RowsCount, {}),
+    withRowsCount && !withPager && !isMobile && /* @__PURE__ */ jsx(RowsCount, {}),
     withPager && pagerOptions && /* @__PURE__ */ jsx(
       Pager,
       {
         ...pagerOptions,
-        totalRecords: pagerOptions.totalRecords,
-        labelRows: getLabel(dictionary.LABEL_ROWS_PER_PAGE),
-        labelOf: getLabel(dictionary.LABEL_OF)
+        totalRecords: pagerOptions.totalRecords
       }
     ),
-    isMobile ? /* @__PURE__ */ jsx(MobileMenuActions, {}) : /* @__PURE__ */ jsxs(ActionsConfigContainerStyled, { children: [
+    isMobile ? /* @__PURE__ */ jsxs(Fragment, { children: [
+      LeftActions,
+      /* @__PURE__ */ jsx(MobileMenuActions, {}),
+      RightActions
+    ] }) : /* @__PURE__ */ jsxs(ActionsConfigContainerStyled, { children: [
+      LeftActions,
       typeof rowHeights !== "number" && /* @__PURE__ */ jsx(Density, {}),
       withLocalFilters && /* @__PURE__ */ jsx(Filter, {}),
-      withSettings && /* @__PURE__ */ jsx(Settings, { ...settingsProps })
+      withSettings && /* @__PURE__ */ jsx(Settings, { ...settingsProps }),
+      RightActions
     ] })
   ] });
 }

package/components/DataGrid/subcomponents/Actions/subcomponents/Settings/subcomponents/ColumnsConfig/index.js

@@ -4,7 +4,7 @@ import { useModuleDictionary, useEnvironment } from "@m4l/core";
 import DataGrid from "react-data-grid";
 import { I as IconButton } from "../../../../../../../mui_extended/IconButton/IconButton.js";
 import { p as pathIcons } from "../../../../../../icons.js";
-import { C as ColumnsConfigWrapperStyled, d as ColumnsConfigSelColumnsStyled, e as ColumnsConfigDataGridStyled, T as TableWrapperDataGridStyled, f as ColumnsConfigActiosStyled } from "../../../../../../slots/DataGridSlot.js";
+import { d as ColumnsConfigWrapperStyled, e as ColumnsConfigSelColumnsStyled, f as ColumnsConfigDataGridStyled, T as TableWrapperDataGridStyled, g as ColumnsConfigActiosStyled } from "../../../../../../slots/DataGridSlot.js";
 import { d as dictionary } from "../../../../../../dictionary.js";
 import { C as ColumnInteractiveCheckFormatter } from "../../../../../../formatters/ColumnInteractiveCheckFormatter/index.js";
 function getRowsFromColumnsConfig(columnsConfig) {

package/components/DataGrid/subcomponents/Actions/subcomponents/hooks/useModalSettings/index.js

@@ -5,7 +5,7 @@ import { useRef, useCallback } from "react";
 import { u as useDataGrid } from "../../../../../hooks/useDataGrid.js";
 import { u as useModal } from "../../../../../../../hooks/useModal/index.js";
 import { C as ColumnsConfig } from "../../Settings/subcomponents/ColumnsConfig/index.js";
-import { g as ContentModalSettingStyled, D as DataGridRootStyled, h as TableContainerStyled, T as TableWrapperDataGridStyled } from "../../../../../slots/DataGridSlot.js";
+import { h as ContentModalSettingStyled, D as DataGridRootStyled, i as TableContainerStyled, T as TableWrapperDataGridStyled } from "../../../../../slots/DataGridSlot.js";
 import { p as pathIcons } from "../../../../../icons.js";
 import { A as ActionsContainer } from "../../../../../../CommonActions/components/ActionsContainer/ActionsContainer.js";
 import { W as WindowBase } from "../../../../../../WindowBase/WindowBase.js";

package/components/DataGrid/subcomponents/Actions/types.d.ts

@@ -7,5 +7,7 @@ export interface ActionsProps {
     withPager?: boolean;
     pagerOptions?: PagerProps;
     withLocalFilters?: boolean;
+    leftActions?: React.ReactNode;
+    rightActions?: React.ReactNode;
 }
 export type InternalActionsProps = ActionsProps;

package/components/DataGrid/subcomponents/Table/index.js

@@ -8,7 +8,7 @@ import { f as filterHeight } from "./subcomponents/SelectColumn.js";
 import { u as useSortColumnsRows } from "./hooks/useSortColumnsRows.js";
 import { u as useFilters } from "../../hooks/useFilters.js";
 import { u as useDataGrid } from "../../hooks/useDataGrid.js";
-import { h as TableContainerStyled, T as TableWrapperDataGridStyled } from "../../slots/DataGridSlot.js";
+import { i as TableContainerStyled, T as TableWrapperDataGridStyled } from "../../slots/DataGridSlot.js";
 function Table(props) {
   const { columns, rows, onRowsChange, rowKeyGetter, selectedRows, onSelectedRowsChange } = props;
   const { finalColumns, sortColumns, setSortColumns, finalRows } = useSortColumnsRows(

package/components/DataGrid/subcomponents/Table/subcomponents/DraggableHeaderRenderer.js

@@ -5,7 +5,7 @@ import { useDrag, useDrop } from "react-dnd";
 import { HeaderRenderer } from "react-data-grid";
 import { u as useFocusRef } from "../hooks/useFocusRef.js";
 import { u as useFilters } from "../../../hooks/useFilters.js";
-import { i as DraggableHeaderRootStyled, j as DraggableWrapperInputBaseStyled, H as HeaderInputBaseStyled } from "../../../slots/DataGridSlot.js";
+import { j as DraggableHeaderRootStyled, k as DraggableWrapperInputBaseStyled, H as HeaderInputBaseStyled } from "../../../slots/DataGridSlot.js";
 function DraggableHeaderRenderer(props) {
   const { onColumnsReorder, column, isCellSelected, ...others } = props;
   const { ref, tabIndex } = useFocusRef(isCellSelected);

package/components/DataGrid/types.d.ts

@@ -54,11 +54,11 @@ export interface ColumnConfig {
     frozen?: Maybe<boolean>;
 }
 type KeyUserColumns = keyof IGridConfig;
-export interface ChangeUserColumn<TRow extends KeyUserColumns = KeyUserColumns> {
-    reason: TRow;
-    userConfig: IGridConfig[TRow];
+export interface ChangeUserColumn<T extends KeyUserColumns = KeyUserColumns> {
+    reason: T;
+    userConfig: IGridConfig[T];
 }
-export type typeOnChangeUserColumns = (props: ChangeUserColumn) => void;
+export type OnChangeUserColumns = (props: ChangeUserColumn) => void;
 export interface GridProps<TRow, TSummaryRow, TKey extends RowKey = RowKey> {
     id: string;
     withActions?: boolean;
@@ -82,7 +82,7 @@ export interface GridProps<TRow, TSummaryRow, TKey extends RowKey = RowKey> {
      * Propiedad que recibe la función que se ejecuta cuando se cambian
      * las configuraciones de las columnas.
      */
-    onChangeUserColumns?: typeOnChangeUserColumns;
+    onChangeUserColumns?: OnChangeUserColumns;
 }
 export declare const DATAGRID_TEST_ID = "m4ldatagrid";
 export declare const PREFIX_TEST_ATTRIBUTE = "data-testid";
@@ -90,13 +90,9 @@ export declare const TEST_PROP_COLUMNS = "data-testid-m4ldatagrid-columns";
 export declare interface DataGridProps<TRow, TSummaryRow, TKey extends RowKey = RowKey> extends GridProps<TRow, TSummaryRow, TKey> {
     actionsProps: ActionsProps;
     dataTestId?: string;
+    customHeader?: React.ReactNode;
+    visibleCustomHeader?: boolean;
 }
-/**
- * OwnerState:
- * Define el objeto de propiedades necesarias para conocer el estado del componente y en función de esta información construir el inventario de clases css dinámicas.
- */
-export interface OwnerState extends WithActionsProps {
-    actionsProps: ActionsProps;
-}
+export type DataGridOwnerState<TRow, TSummaryRow, TKey extends RowKey = RowKey> = Pick<DataGridProps<TRow, TSummaryRow, TKey>, 'visibleCustomHeader'>;
 export type DataGridSlotsType = DataGridSlots | TextEditorSlots | ActionsSlots | RowsCountSlots | ColumnsConfigSlots | TableSlots;
 export type DataGridStyles = OverridesStyleRules<DataGridSlotsType, typeof DATAGRID_PREFIX_NAME, Theme>;

package/components/DragResizeWindow/slots/DragResizeWindowSlots.d.ts

@@ -1,6 +1,6 @@
 export declare const RootStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Partial<import('../types').DragResizeWindowOwnerState> & Record<string, unknown> & {
     ownerState: Partial<import('../types').DragResizeWindowOwnerState> & Record<string, unknown>;
-}, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
+}, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;
 export declare const IconResizeFormatterStyled: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme> & Partial<import('../types').DragResizeWindowOwnerState> & Record<string, unknown> & {
     ownerState: Partial<import('../types').DragResizeWindowOwnerState> & Record<string, unknown>;
-}, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;
+}, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').ClassAttributes<HTMLDivElement> | keyof import('react').HTMLAttributes<HTMLDivElement>>, {}>;

package/components/DynamicFilter/__tests__/fronEndHelpers.test.d.ts

@@ -0,0 +1 @@
+export {};

package/components/DynamicFilter/helpers/frontEndHelpers.d.ts

@@ -0,0 +1,12 @@
+import { RawFilterFieldApply } from '../types';
+type ObjectData = Record<any, any>;
+/**
+ * Función que verifica si el objectData cumple con todos los filtros de DynamicFilter
+ * Para usar en el frontEnd, y no atraves de la API
+ */
+export declare const getIsIfInDynamicFilter: (objectData: ObjectData, groupedFields: Record<string, RawFilterFieldApply[]>) => boolean;
+/**
+ * getFilterGroupFieldsByName agrupa los campos por nombre, para procesarlos en una OR
+ */
+export declare function getFilterGroupFieldsByName(fields: RawFilterFieldApply[]): Record<string, RawFilterFieldApply[]>;
+export {};