@m4l/components 9.4.6 → 9.4.7-BE20260106-beta.1

package/components/datagrids/hooks/useColumnsWidth/types.d.ts

@@ -0,0 +1,16 @@
+import { Maybe } from '@m4l/core';
+import { RowKey, OnChangeConfig } from '../../types';
+export interface UseColumnsWidthParams {
+    /** Identificador único del DataGrid */
+    id: RowKey;
+    /** Callback para persistir cambios */
+    onChangeConfig?: OnChangeConfig;
+}
+export interface UseColumnsWidthReturn {
+    /** Mapa con el ancho de cada columna */
+    columnsWidths: Map<string, Maybe<string | number>>;
+    /** Función para establecer el mapa de anchos */
+    setColumnsWidths: React.Dispatch<React.SetStateAction<Map<string, Maybe<string | number>>>>;
+    /** Función para cambiar el ancho de una columna */
+    onChangeColumnWidth: (columnKey: string, width: number) => void;
+}

package/components/{DataGrid → datagrids}/hooks/useColumnsWidth/useColumnsWidth.d.ts

@@ -1,4 +1,4 @@
-import { UseColumnsWidthParams, UseColumnsWidthReturn } from '../../types.hooks';
+import { UseColumnsWidthParams, UseColumnsWidthReturn } from './types';
 /**
  * Hook para manejar el estado del ancho de las columnas del DataGrid.
  *

package/components/{DataGrid → datagrids}/hooks/useColumnsWidth/useColumnsWidth.js

@@ -1,5 +1,5 @@
 import { useState, useRef, useCallback } from "react";
-import { s as saveColumnsWidth } from "../../helpers/saveColumnsWidth/saveColumnsWidth.js";
+import { s as saveColumnsWidth } from "../../helpers/persistence/saveColumnsWidth/saveColumnsWidth.js";
 const useColumnsWidth = ({
   id,
   onChangeConfig

package/components/datagrids/hooks/useColumnsWidth/useColumnsWidth.test.d.ts

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

package/components/datagrids/hooks/useRowHeight/index.js

@@ -0,0 +1 @@
+

package/components/datagrids/hooks/useRowHeight/types.d.ts

@@ -0,0 +1,16 @@
+import { RowHeightVariants, RowHeights } from '../../types';
+import { RowHeightState } from '../../contexts/DataGridContext/types';
+export interface UseRowHeightParams {
+    /** Alturas de las filas (número fijo o array de 3 elementos) */
+    rowHeights: RowHeights;
+    /** Alturas de los headers (número fijo o array de 3 elementos) */
+    rowHeaderHeights: RowHeights;
+    /** Variant inicial de altura */
+    initialRowHeightVariant: RowHeightVariants;
+}
+export interface UseRowHeightReturn {
+    /** Estado actual de la altura de filas */
+    currentRowHeightVariant: RowHeightState;
+    /** Función para cambiar el variant de altura */
+    setRowHeightVariant: (newVariant: RowHeightVariants) => void;
+}

package/components/datagrids/hooks/useRowHeight/useRowHeight.d.ts

@@ -0,0 +1,11 @@
+import { UseRowHeightParams, UseRowHeightReturn } from './types';
+/**
+ * Hook para manejar el estado de la altura de las filas del DataGrid.
+ *
+ * Soporta dos modos:
+ * - **Modo fijo**: rowHeights y rowHeaderHeights son números fijos
+ * - **Modo variable**: rowHeights y rowHeaderHeights son arrays de 3 elementos [compact, standard, confortable]
+ * @param params - Parámetros del hook
+ * @returns Estado actual y función para cambiar el variant
+ */
+export declare const useRowHeight: ({ rowHeights, rowHeaderHeights, initialRowHeightVariant, }: UseRowHeightParams) => UseRowHeightReturn;

package/components/{DataGrid → datagrids}/hooks/useRowHeight/useRowHeight.js

@@ -1,5 +1,5 @@
 import { useState, useCallback } from "react";
-import { g as getIndexRowHeightVariant } from "../../helpers/getIndexRowHeightVariant/getIndexRowHeightVariant.js";
+import { g as getIndexRowHeightVariant } from "../../helpers/shared/getIndexRowHeightVariant/getIndexRowHeightVariant.js";
 const useRowHeight = ({
   rowHeights,
   rowHeaderHeights,

package/components/datagrids/hooks/useRowHeight/useRowHeight.test.d.ts

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

package/components/datagrids/hooks/useViewConfig/index.js

@@ -0,0 +1 @@
+

package/components/datagrids/hooks/useViewConfig/types.d.ts

@@ -0,0 +1,9 @@
+import { IViewConfig, ViewMode } from '../../contexts/DataGridContext/types';
+export interface UseViewConfigReturn {
+    /** Estado de configuración por vista */
+    viewConfig: Record<ViewMode, IViewConfig<any, any>[]>;
+    /** Obtiene la configuración de columnas para una vista */
+    getConfigColumns: (viewMode: ViewMode) => IViewConfig<any, any>[];
+    /** Actualiza la configuración de columnas para una vista */
+    updateConfigColumns: (viewMode: ViewMode, config: IViewConfig<any, any>[]) => void;
+}

package/components/{DataGrid → datagrids}/hooks/useViewConfig/useViewConfig.d.ts

@@ -1,4 +1,4 @@
-import { UseViewConfigReturn } from '../../types.hooks';
+import { UseViewConfigReturn } from './types';
 /**
  * Hook para manejar el estado de la configuración de columnas por vista.
  *

package/components/datagrids/hooks/useViewConfig/useViewConfig.test.d.ts

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

package/components/datagrids/hooks/useViewMode/index.js

@@ -0,0 +1 @@
+

package/components/datagrids/hooks/useViewMode/types.d.ts

@@ -0,0 +1,22 @@
+import { RowKey, OnChangeConfig } from '../../types';
+import { ViewMode } from '../../contexts/DataGridContext/types';
+export interface UseViewModeParams {
+    /** Identificador único del DataGrid */
+    id: RowKey;
+    /** ViewMode controlado por el padre */
+    viewMode?: ViewMode;
+    /** ViewMode por defecto cuando no hay valor guardado */
+    defaultViewMode?: ViewMode;
+    /** Callback cuando cambia el viewMode */
+    onViewModeChange?: (viewMode: ViewMode) => void;
+    /** Callback para persistir cambios */
+    onChangeConfig?: OnChangeConfig;
+}
+export interface UseViewModeReturn {
+    /** Estado actual del viewMode */
+    viewModeState: ViewMode;
+    /** Función para establecer el viewMode */
+    setViewModeState: React.Dispatch<React.SetStateAction<ViewMode>>;
+    /** Función para cambiar el viewMode y persistirlo */
+    handleViewModeChange: (newViewMode: ViewMode) => void;
+}

package/components/{DataGrid → datagrids}/hooks/useViewMode/useViewMode.d.ts

@@ -1,4 +1,4 @@
-import { UseViewModeParams, UseViewModeReturn } from '../../types.hooks';
+import { UseViewModeParams, UseViewModeReturn } from './types';
 /**
  * Hook para manejar el estado del modo de visualización (table/cards).
  *
@@ -19,13 +19,5 @@ import { UseViewModeParams, UseViewModeReturn } from '../../types.hooks';
  *
  * - **Controlado**: Cuando se pasa `viewMode` prop, el padre controla el estado
  * - **No controlado**: El hook maneja internamente el estado y persiste
- * @param id - Identificador único del DataGrid
- * @param viewMode - ViewMode controlado por el padre (opcional)
- * @param defaultViewMode - ViewMode por defecto cuando no hay valor guardado
- * @param onViewModeChange - Callback cuando cambia el viewMode (opcional)
- * @param onChangeConfig - Callback para guardar en cookies de red (opcional)
- * @returns viewModeState - Estado actual del viewMode
- * @returns setViewModeState - Función para establecer el viewMode
- * @returns handleViewModeChange - Función para cambiar el viewMode y persistirlo
  */
 export declare const useViewMode: ({ id, viewMode, defaultViewMode, onViewModeChange, onChangeConfig, }: UseViewModeParams) => UseViewModeReturn;

package/components/{DataGrid → datagrids}/hooks/useViewMode/useViewMode.js

@@ -1,7 +1,7 @@
 import { useState, useCallback, useEffect } from "react";
 import { useIsMobile } from "@m4l/graphics";
-import { g as getViewMode } from "../../helpers/getViewMode/getViewMode.js";
-import { s as saveViewMode } from "../../helpers/saveViewMode/saveViewMode.js";
+import { g as getViewMode } from "../../helpers/persistence/getViewMode/getViewMode.js";
+import { s as saveViewMode } from "../../helpers/persistence/saveViewMode/saveViewMode.js";
 const useViewMode = ({
   id,
   viewMode,

package/components/datagrids/hooks/useViewMode/useViewMode.test.d.ts

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

package/components/{DataGrid → datagrids}/index.d.ts

@@ -1,10 +1,10 @@
-export { DataGrid } from './DataGrid';
+export { DataGrid } from './components/DataGridMain';
 export * from './formatters';
 export type { Column, RenderEditCellProps, RenderCellProps, } from 'react-data-grid';
 export type { RowKey, ChangeConfig, ChangeUserColumn, RowActionsGetter, RowKeyGetter, } from './types';
+export type { IGridConfigExtended, BaseConfigColumn, } from './contexts/DataGridContext/types';
+export type { IGridConfig } from './helpers/persistence/getColumnsWidth/types';
 export { getDataGridComponentsDictionary } from './dictionary';
 export { TextEditor, NumberEditor } from './subcomponents/editors/TextEditor';
-export { getDataGridRowsFromSet } from './utils/getDataGridRowsFromSet';
-export type { IGridConfigExtended, BaseConfigColumn, } from './contexts/DataGridContext/types';
+export { getDataGridRowsFromSet } from './helpers';
 export { DATAGRID_SEMANTIC_WIDTHS, DATAGRID_ROW_HEADER_HEIGHTS, DATAGRID_ROW_HEIGHTS, } from './constants';
-export * from './types.helpers';

package/components/datagrids/index.js

@@ -0,0 +1 @@
+

package/components/{DataGrid → datagrids}/slots/DataGridSlot.js

@@ -240,7 +240,7 @@ export {
   NameColumnStyled as F,
   IconColumnStyled as G,
   DraggableHeaderRootStyled as H,
-  IconButtonEditStyled as I,
+  InputTextEditorStyled as I,
   ButtonHeaderActionsStyled as J,
   DraggableWrapperInputBaseStyled as K,
   LabelHeaderColumnStyled as L,
@@ -250,34 +250,34 @@ export {
   MenuListStyled as P,
   HeaderRenderClickStyled as Q,
   RowsCountRootStyled as R,
-  InputTextEditorStyled as S,
-  TableWrapperDataGridStyled as T,
+  CheckboxCellWrapperStyled as S,
+  TextToggleCardButtonStyled as T,
   ValueColumnStyled as V,
   WrapperSkeletonStyled as W,
-  ContentModalSettingStyled as a,
-  ContainerLabelValueColumnStyled as b,
-  ContentWrapperColumnStyled as c,
-  EditablePlaceholderStyled as d,
-  CardsContainerStyled as e,
-  CardDetailContainerStyled as f,
-  CardHeaderStyled as g,
-  CardHeaderLeftStyled as h,
-  CardHeaderRightStyled as i,
-  CardContentWrapperStyled as j,
-  CardContentStyled as k,
-  CardStyled as l,
-  CheckboxCellWrapperStyled as m,
-  ControlNavigateStyled as n,
-  ActionsConfigContainerStyled as o,
-  ContainerLeftActionsStyled as p,
-  ContainerRightActionsStyled as q,
-  RowsCountLabelStyled as r,
-  RowsCountValueStyled as s,
-  ColumnsConfigWrapperStyled as t,
-  ColumnsConfigDataGridStyled as u,
-  ColumnsConfigSelColumnsStyled as v,
-  ColumnsConfigActiosStyled as w,
-  ContainerToggleCardsStyled as x,
-  CardToggleButtonStyled as y,
-  TextToggleCardButtonStyled as z
+  ControlNavigateStyled as a,
+  RowsCountLabelStyled as b,
+  RowsCountValueStyled as c,
+  ActionsConfigContainerStyled as d,
+  ContainerLeftActionsStyled as e,
+  ContainerRightActionsStyled as f,
+  ContainerToggleCardsStyled as g,
+  CardToggleButtonStyled as h,
+  CardsContainerStyled as i,
+  ContainerLabelValueColumnStyled as j,
+  ContentWrapperColumnStyled as k,
+  EditablePlaceholderStyled as l,
+  IconButtonEditStyled as m,
+  ContentModalSettingStyled as n,
+  CardDetailContainerStyled as o,
+  CardContentWrapperStyled as p,
+  CardContentStyled as q,
+  CardStyled as r,
+  CardHeaderStyled as s,
+  CardHeaderLeftStyled as t,
+  CardHeaderRightStyled as u,
+  ColumnsConfigWrapperStyled as v,
+  ColumnsConfigDataGridStyled as w,
+  ColumnsConfigSelColumnsStyled as x,
+  TableWrapperDataGridStyled as y,
+  ColumnsConfigActiosStyled as z
 };

package/components/datagrids/slots/index.d.ts

@@ -0,0 +1,2 @@
+export * from './DataGridEnum';
+export * from './DataGridSlot';

package/components/datagrids/subcomponents/ControlNavigate/ControlNavigate.d.ts

@@ -0,0 +1,25 @@
+import { ControlNavigateProps } from './types';
+/**
+ * Componente que renderiza el control de navegación del DataGrid.
+ *
+ * Muestra opciones de navegación y conteo de filas:
+ * - **RowsCount**: Muestra el total de filas (solo cuando no hay pager y no es móvil)
+ * - **Pager**: Componente de paginación con navegación entre páginas
+ * @param props.withRowsCount - Si muestra el contador de filas (default: true)
+ * @param props.withPager - Si muestra el paginador (default: true)
+ * @param props.pagerOptions - Opciones de configuración del paginador
+ * @param props.size - Tamaño del componente
+ * @example
+ * ```tsx
+ * <ControlNavigate
+ *   withPager
+ *   pagerOptions={{
+ *     totalRecords: 100,
+ *     pageSize: 10,
+ *     currentPage: 1,
+ *     onPageChange: (page) => setPage(page)
+ *   }}
+ * />
+ * ```
+ */
+export declare const ControlNavigate: (props: ControlNavigateProps) => import("react/jsx-runtime").JSX.Element;

package/components/{DataGrid → datagrids}/subcomponents/ControlNavigate/ControlNavigate.js

@@ -1,8 +1,8 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { useIsMobile } from "@m4l/graphics";
-import { n as ControlNavigateStyled } from "../../slots/DataGridSlot.js";
-import { R as RowsCount } from "../HeaderActions/subcomponents/RowsCount/index.js";
+import { a as ControlNavigateStyled } from "../../slots/DataGridSlot.js";
 import { u as useComponentSize } from "../../../../hooks/useComponentSize/useComponentSize.js";
+import { R as RowsCount } from "./subcomponents/RowsCount/RowsCount.js";
 import { P as Pager } from "../../../Pager/Pager.js";
 const ControlNavigate = (props) => {
   const {

package/components/datagrids/subcomponents/ControlNavigate/ControlNavigate.test.d.ts

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

package/components/{DataGrid → datagrids}/subcomponents/ControlNavigate/index.d.ts

@@ -1,2 +1,2 @@
 export { ControlNavigate } from './ControlNavigate';
-export type { ControlNavigateProps } from './types';
+export * from './types';

package/components/datagrids/subcomponents/ControlNavigate/index.js

@@ -0,0 +1 @@
+

package/components/datagrids/subcomponents/ControlNavigate/subcomponents/RowsCount/RowsCount.d.ts

@@ -0,0 +1,17 @@
+/**
+ * Componente que muestra el contador de filas del DataGrid.
+ *
+ * Muestra una etiqueta con el total de filas visibles en formato:
+ * "Filas: {count}"
+ *
+ * Características:
+ * - Muestra skeleton mientras se cargan los datos
+ * - Se adapta al tamaño configurado del DataGrid
+ * - Usa el diccionario para internacionalización
+ * @example
+ * ```tsx
+ * // Se usa internamente en ControlNavigate
+ * {withRowsCount && !withPager && !isMobile && <RowsCount />}
+ * ```
+ */
+export declare function RowsCount(): import("react/jsx-runtime").JSX.Element;

package/components/{DataGrid/subcomponents/HeaderActions/subcomponents/RowsCount/index.js → datagrids/subcomponents/ControlNavigate/subcomponents/RowsCount/RowsCount.js}

@@ -1,8 +1,8 @@
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 import { useModuleDictionary, useModuleSkeleton } from "@m4l/core";
 import { Skeleton } from "@mui/material";
-import { u as useDataGrid } from "../../../../hooks/useDataGrid.js";
-import { R as RowsCountRootStyled, r as RowsCountLabelStyled, s as RowsCountValueStyled } from "../../../../slots/DataGridSlot.js";
+import { R as RowsCountRootStyled, b as RowsCountLabelStyled, c as RowsCountValueStyled } from "../../../../slots/DataGridSlot.js";
+import { u as useDataGrid } from "../../../../hooks/shared/useDataGrid/useDataGrid.js";
 function RowsCount() {
   const { rowsCount, size } = useDataGrid();
   const { getLabel } = useModuleDictionary();

package/components/datagrids/subcomponents/ControlNavigate/subcomponents/RowsCount/RowsCount.test.d.ts

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

package/components/datagrids/subcomponents/ControlNavigate/subcomponents/RowsCount/index.d.ts

@@ -0,0 +1 @@
+export { RowsCount } from './RowsCount';

package/components/datagrids/subcomponents/ControlNavigate/subcomponents/RowsCount/index.js

@@ -0,0 +1 @@
+

package/components/datagrids/subcomponents/ControlNavigate/types.js

@@ -0,0 +1 @@
+

package/components/datagrids/subcomponents/HeaderActions/HeaderActions.d.ts

@@ -0,0 +1,13 @@
+import { HeaderActionsProps } from './types';
+/**
+ * Componente que renderiza las acciones del DataGrid.
+ *
+ * Incluye controles para:
+ * - Densidad de filas (compact, standard, confortable)
+ * - Filtros locales
+ * - Configuración de columnas (específica por vista)
+ * - Toggle de modo de vista (table/cards)
+ *
+ * En móviles, todas las acciones se consolidan en un menú desplegable.
+ */
+export declare function HeaderActions(props: HeaderActionsProps): import("react/jsx-runtime").JSX.Element;

package/components/{DataGrid/subcomponents/HeaderActions/index.js → datagrids/subcomponents/HeaderActions/HeaderActions.js}

@@ -1,13 +1,14 @@
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
-import { F as Filter } from "./subcomponents/Filter/index.js";
-import { S as Settings } from "./subcomponents/Settings/index.js";
-import { D as Density } from "./subcomponents/Density/index.js";
-import { V as ViewMode } from "./subcomponents/ViewMode/index.js";
-import { u as useDataGrid } from "../../hooks/useDataGrid.js";
 import { useIsMobile } from "@m4l/graphics";
-import { M as MobileMenuActions } from "./subcomponents/MobileMenuActions/index.js";
-import { A as ActionsRootStyled, o as ActionsConfigContainerStyled, p as ContainerLeftActionsStyled, q as ContainerRightActionsStyled } from "../../slots/DataGridSlot.js";
+import { A as ActionsRootStyled, d as ActionsConfigContainerStyled, e as ContainerLeftActionsStyled, f as ContainerRightActionsStyled } from "../../slots/DataGridSlot.js";
 import { u as useComponentSize } from "../../../../hooks/useComponentSize/useComponentSize.js";
+import { M as MobileMenuActions } from "./subcomponents/MobileMenuActions/MobileMenuActions.js";
+import { D as Density } from "./subcomponents/Density/Density.js";
+import { F as Filter } from "./subcomponents/Filter/Filter.js";
+import { V as ViewMode } from "./subcomponents/ViewMode/ViewMode.js";
+import { S as Settings } from "../../views/CardsView/subcomponents/Settings/Settings.js";
+import { S as Settings$1 } from "../../views/TableView/subcomponents/Settings/Settings.js";
+import { u as useDataGrid } from "../../hooks/shared/useDataGrid/useDataGrid.js";
 function HeaderActions(props) {
   const {
     withSettings = true,
@@ -22,6 +23,18 @@ function HeaderActions(props) {
   const isMobile = useIsMobile();
   const { rowHeights, viewMode, cardsViewConfig } = useDataGrid();
   const { currentSize } = useComponentSize(size);
+  const renderSettings = () => {
+    if (!withSettings) {
+      return null;
+    }
+    if (viewMode === "cards" && cardsViewConfig?.customRender) {
+      return null;
+    }
+    if (viewMode === "cards") {
+      return /* @__PURE__ */ jsx(Settings, { ...settingsProps, columns });
+    }
+    return /* @__PURE__ */ jsx(Settings$1, { ...settingsProps, columns });
+  };
   return /* @__PURE__ */ jsx(ActionsRootStyled, { ownerState: { size: currentSize }, children: isMobile ? /* @__PURE__ */ jsxs(Fragment, { children: [
     leftActions,
     /* @__PURE__ */ jsx(MobileMenuActions, { columns }),
@@ -31,7 +44,7 @@ function HeaderActions(props) {
       leftActions,
       typeof rowHeights !== "number" && viewMode !== "cards" && /* @__PURE__ */ jsx(Density, {}),
       withLocalFilters && /* @__PURE__ */ jsx(Filter, {}),
-      withSettings && !(viewMode === "cards" && cardsViewConfig?.customRender) && /* @__PURE__ */ jsx(Settings, { ...settingsProps, columns }),
+      renderSettings(),
       cardsViewConfig !== void 0 && /* @__PURE__ */ jsx(ViewMode, {})
     ] }),
     rightActions && /* @__PURE__ */ jsx(ContainerRightActionsStyled, { children: rightActions })

package/components/datagrids/subcomponents/HeaderActions/HeaderActions.test.d.ts

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

package/components/datagrids/subcomponents/HeaderActions/index.d.ts

@@ -0,0 +1,2 @@
+export { HeaderActions } from './HeaderActions';
+export * from './types';

package/components/datagrids/subcomponents/HeaderActions/index.js

@@ -0,0 +1 @@
+

package/components/datagrids/subcomponents/HeaderActions/subcomponents/Density/Density.d.ts

@@ -0,0 +1,19 @@
+/**
+ * Componente que permite cambiar la densidad (altura) de las filas del DataGrid.
+ *
+ * Muestra un menú desplegable con tres opciones de densidad:
+ * - **compact**: Filas compactas con menor altura
+ * - **standard**: Filas con altura estándar (default)
+ * - **confortable**: Filas con mayor altura para mejor legibilidad
+ *
+ * El componente solo se renderiza si `rowHeights` no es un número fijo,
+ * permitiendo al usuario personalizar la visualización de los datos.
+ * @example
+ * ```tsx
+ * // Se usa internamente en HeaderActions
+ * <HeaderActions>
+ *   <Density />
+ * </HeaderActions>
+ * ```
+ */
+export declare function Density(): import("react/jsx-runtime").JSX.Element;

package/components/{DataGrid/subcomponents/HeaderActions/subcomponents/Density/index.js → datagrids/subcomponents/HeaderActions/subcomponents/Density/Density.js}

@@ -2,9 +2,9 @@ import { jsx, Fragment } from "react/jsx-runtime";
 import { useMemo } from "react";
 import { useEnvironment, useModuleDictionary } from "@m4l/core";
 import { M as MenuActions } from "../../../../../MenuActions/MenuActions.js";
-import { u as useDataGrid } from "../../../../hooks/useDataGrid.js";
 import { p as pathIcons } from "../../../../icons.js";
 import { D as DICTIONARY } from "../../../../dictionary.js";
+import { u as useDataGrid } from "../../../../hooks/shared/useDataGrid/useDataGrid.js";
 function Density() {
   const { host_static_assets, environment_assets } = useEnvironment();
   const { rowHeights, currentRowHeightVariant, setRowHeightVariant } = useDataGrid();

package/components/datagrids/subcomponents/HeaderActions/subcomponents/Density/Density.test.d.ts

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

package/components/datagrids/subcomponents/HeaderActions/subcomponents/Density/index.d.ts

@@ -0,0 +1 @@
+export { Density } from './Density';

package/components/datagrids/subcomponents/HeaderActions/subcomponents/Density/index.js

@@ -0,0 +1 @@
+

package/components/datagrids/subcomponents/HeaderActions/subcomponents/Filter/Filter.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Componente que renderiza el botón de filtro en el DataGrid.
+ *
+ * Permite activar/desactivar los filtros locales de las columnas o,
+ * si existe `externalFilterSettings`, abre el popover de filtros externos.
+ * @example
+ * ```tsx
+ * // Se usa internamente en HeaderActions cuando withLocalFilters es true
+ * {withLocalFilters && <Filter />}
+ * ```
+ */
+export declare function Filter(): import("react/jsx-runtime").JSX.Element;

package/components/{DataGrid/subcomponents/HeaderActions/subcomponents/Filter/index.js → datagrids/subcomponents/HeaderActions/subcomponents/Filter/Filter.js}

@@ -1,10 +1,10 @@
 import { jsx } from "react/jsx-runtime";
 import { useEnvironment, useModuleDictionary } from "@m4l/core";
-import { u as useFilters } from "../../../../hooks/useFilters.js";
 import { I as IconButton } from "../../../../../mui_extended/IconButton/IconButton.js";
 import { p as pathIcons } from "../../../../icons.js";
 import { D as DICTIONARY } from "../../../../dictionary.js";
-import { u as useDataGrid } from "../../../../hooks/useDataGrid.js";
+import { u as useFilters } from "../../../../hooks/shared/useFilters/useFilters.js";
+import { u as useDataGrid } from "../../../../hooks/shared/useDataGrid/useDataGrid.js";
 function Filter() {
   const { activeFilters, setActiveFilters } = useFilters();
   const { host_static_assets, environment_assets } = useEnvironment();

package/components/datagrids/subcomponents/HeaderActions/subcomponents/Filter/Filter.test.d.ts

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

package/components/datagrids/subcomponents/HeaderActions/subcomponents/Filter/index.d.ts

@@ -0,0 +1 @@
+export { Filter } from './Filter';

package/components/datagrids/subcomponents/HeaderActions/subcomponents/Filter/index.js

@@ -0,0 +1 @@
+

package/components/datagrids/subcomponents/HeaderActions/subcomponents/MobileMenuActions/MobileMenuActions.d.ts

@@ -0,0 +1,19 @@
+import { Column } from 'react-data-grid';
+/**
+ * Componente que renderiza el menú de acciones en dispositivos móviles.
+ *
+ * Consolida todas las acciones del DataGrid en un único menú desplegable
+ * para optimizar el espacio en pantallas pequeñas:
+ * - Opciones de densidad (compact, standard, confortable)
+ * - Toggle de filtros
+ * - Configuración de columnas (específica según viewMode)
+ * @param props.columns - Columnas del DataGrid para la configuración
+ * @example
+ * ```tsx
+ * // Se usa internamente en HeaderActions cuando isMobile es true
+ * {isMobile && <MobileMenuActions columns={columns} />}
+ * ```
+ */
+export declare const MobileMenuActions: (props: {
+    columns: readonly Column<any, any>[];
+}) => import("react/jsx-runtime").JSX.Element;

package/components/{DataGrid/subcomponents/HeaderActions/subcomponents/MobileMenuActions/index.js → datagrids/subcomponents/HeaderActions/subcomponents/MobileMenuActions/MobileMenuActions.js}

@@ -1,17 +1,20 @@
 import { jsx } from "react/jsx-runtime";
 import { useModuleDictionary, useEnvironment } from "@m4l/core";
-import { u as useDataGrid } from "../../../../hooks/useDataGrid.js";
-import { u as useFilters } from "../../../../hooks/useFilters.js";
-import { u as useModalSettings } from "../hooks/useModalSettings/index.js";
 import { p as pathIcons } from "../../../../icons.js";
+import { u as useModalSettings } from "../../../../views/TableView/subcomponents/Settings/hooks/useModalSettings/useModalSettings.js";
+import { u as useModalSettings$1 } from "../../../../views/CardsView/subcomponents/Settings/hooks/useModalSettings/useModalSettings.js";
+import { u as useDataGrid } from "../../../../hooks/shared/useDataGrid/useDataGrid.js";
+import { u as useFilters } from "../../../../hooks/shared/useFilters/useFilters.js";
 import { M as MenuActions } from "../../../../../MenuActions/MenuActions.js";
 const MobileMenuActions = (props) => {
   const { columns } = props;
   const { getLabel } = useModuleDictionary();
   const { host_static_assets, environment_assets } = useEnvironment();
-  const { currentRowHeightVariant, setRowHeightVariant, size } = useDataGrid();
+  const { currentRowHeightVariant, setRowHeightVariant, size, viewMode } = useDataGrid();
   const { activeFilters, setActiveFilters } = useFilters();
-  const modalSettings = useModalSettings(size, columns);
+  const tableModalSettings = useModalSettings(size, columns);
+  const cardsModalSettings = useModalSettings$1(size, columns);
+  const modalSettings = viewMode === "cards" ? cardsModalSettings : tableModalSettings;
   const toggleIcon = () => {
     setActiveFilters(!activeFilters);
   };

package/components/datagrids/subcomponents/HeaderActions/subcomponents/MobileMenuActions/MobileMenuActions.test.d.ts

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

package/components/datagrids/subcomponents/HeaderActions/subcomponents/MobileMenuActions/index.d.ts

@@ -0,0 +1 @@
+export { MobileMenuActions } from './MobileMenuActions';

package/components/datagrids/subcomponents/HeaderActions/subcomponents/MobileMenuActions/index.js

@@ -0,0 +1 @@
+

package/components/datagrids/subcomponents/HeaderActions/subcomponents/ViewMode/ViewMode.d.ts

@@ -0,0 +1,16 @@
+/**
+ * Componente que permite cambiar entre los modos de vista del DataGrid.
+ *
+ * Muestra un popover con las opciones disponibles:
+ * - **table**: Vista de tabla tradicional con filas y columnas
+ * - **cards**: Vista de tarjetas para visualización más compacta
+ *
+ * El componente solo se renderiza cuando `cardsViewConfig` está definido,
+ * indicando que la vista de cards está habilitada.
+ * @example
+ * ```tsx
+ * // Se usa internamente en HeaderActions cuando cardsViewConfig existe
+ * {cardsViewConfig !== undefined && <ViewMode />}
+ * ```
+ */
+export declare function ViewMode(): import("react/jsx-runtime").JSX.Element;

package/components/{DataGrid/subcomponents/HeaderActions/subcomponents/ViewMode/index.js → datagrids/subcomponents/HeaderActions/subcomponents/ViewMode/ViewMode.js}

@@ -1,12 +1,12 @@
 import { jsxs, Fragment, jsx } from "react/jsx-runtime";
 import { useState, useMemo, useCallback } from "react";
 import { useEnvironment, useModuleDictionary } from "@m4l/core";
-import { u as useDataGrid } from "../../../../hooks/useDataGrid.js";
 import { I as IconButton } from "../../../../../mui_extended/IconButton/IconButton.js";
 import { P as Popover } from "../../../../../mui_extended/Popover/Popover.js";
 import { p as pathIcons } from "../../../../icons.js";
 import { D as DICTIONARY } from "../../../../dictionary.js";
-import { x as ContainerToggleCardsStyled, y as CardToggleButtonStyled, z as TextToggleCardButtonStyled } from "../../../../slots/DataGridSlot.js";
+import { g as ContainerToggleCardsStyled, h as CardToggleButtonStyled, T as TextToggleCardButtonStyled } from "../../../../slots/DataGridSlot.js";
+import { u as useDataGrid } from "../../../../hooks/shared/useDataGrid/useDataGrid.js";
 import { I as Icon } from "../../../../../Icon/Icon.js";
 function ViewMode() {
   const { host_static_assets, environment_assets } = useEnvironment();

package/components/datagrids/subcomponents/HeaderActions/subcomponents/ViewMode/ViewMode.test.d.ts

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

package/components/datagrids/subcomponents/HeaderActions/subcomponents/ViewMode/index.d.ts

@@ -0,0 +1 @@
+export { ViewMode } from './ViewMode';

package/components/datagrids/subcomponents/HeaderActions/subcomponents/ViewMode/index.js

@@ -0,0 +1 @@
+