@m4l/components 9.4.6 → 9.4.7

package/components/datagrids/subcomponents/editors/EditLabelEditor/useColumnEditLabel.d.ts

@@ -0,0 +1,31 @@
+import { ColumnEditLabelFormatterProps } from './types';
+/**
+ * Hook que retorna el formatter, filter y customSort para columnas con etiquetas editables.
+ *
+ * Proporciona una configuración completa para columnas que necesitan:
+ * - Renderizado con EditLabelFormatter
+ * - Filtrado personalizado por el campo de etiqueta
+ * - Ordenamiento personalizado por el campo de etiqueta
+ * @param props.fieldLabel - Campo del objeto row a usar
+ * @param props.fieldWidth - Ancho del campo de edición
+ * @returns Objeto con formatter, customFilter y customSort
+ * @example
+ * ```tsx
+ * const { formatter, customFilter, customSort } = useColumnEditLabel({
+ *   fieldLabel: 'name',
+ *   fieldWidth: 200
+ * });
+ *
+ * const columns = [{
+ *   key: 'name',
+ *   renderCell: formatter,
+ *   customFilter,
+ *   customSort
+ * }];
+ * ```
+ */
+export declare const useColumnEditLabel: <TRow>(props: ColumnEditLabelFormatterProps<TRow>) => {
+    formatter: (renderProps: import('react-data-grid').RenderCellProps<TRow, unknown>) => import("react/jsx-runtime").JSX.Element;
+    customFilter: (row: TRow, value: string | number) => boolean;
+    customSort: (a: TRow, b: TRow) => 0 | 1 | -1;
+};

package/components/datagrids/subcomponents/editors/EditLabelEditor/useColumnEditLabel.test.d.ts

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

package/components/datagrids/subcomponents/editors/TextEditor/TextEditor.d.ts

@@ -0,0 +1,50 @@
+import { RenderEditCellProps } from 'react-data-grid';
+/**
+ * Editor para campos de texto en el DataGrid.
+ *
+ * Permite editar valores de texto inline con las siguientes características:
+ * - Auto-enfoque al abrir
+ * - Selección automática del texto existente
+ * - Cierra al perder el foco (onBlur)
+ * @param props.row - Fila actual del DataGrid
+ * @param props.column - Columna actual del DataGrid
+ * @param props.onRowChange - Función para actualizar la fila
+ * @param props.onClose - Función para cerrar el editor
+ * @example
+ * ```tsx
+ * const columns = [
+ *   {
+ *     key: 'name',
+ *     name: 'Nombre',
+ *     renderEditCell: TextEditor
+ *   }
+ * ];
+ * ```
+ */
+export declare function TextEditor<TRow, TSummaryRow>({ row, column, onRowChange, onClose, }: RenderEditCellProps<TRow, TSummaryRow>): import("react/jsx-runtime").JSX.Element;
+/**
+ * Editor para campos numéricos en el DataGrid.
+ *
+ * Permite editar valores numéricos inline con las siguientes características:
+ * - Auto-enfoque al abrir
+ * - Selección automática del texto existente
+ * - Navegación con flechas arriba/abajo cierra el editor
+ * - Enter cierra el editor guardando cambios
+ * - Convierte valores vacíos a string vacío
+ * @param props.row - Fila actual del DataGrid
+ * @param props.column - Columna actual del DataGrid
+ * @param props.onRowChange - Función para actualizar la fila
+ * @param props.onClose - Función para cerrar el editor
+ * @example
+ * ```tsx
+ * const columns = [
+ *   {
+ *     key: 'quantity',
+ *     name: 'Cantidad',
+ *     renderEditCell: NumberEditor
+ *   }
+ * ];
+ * ```
+ */
+export declare function NumberEditor<TRow, TSummaryRow>({ row, column, onRowChange, onClose, }: RenderEditCellProps<TRow, TSummaryRow>): import("react/jsx-runtime").JSX.Element;
+export default TextEditor;

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

@@ -1,5 +1,5 @@
 import { jsx } from "react/jsx-runtime";
-import { S as InputTextEditorStyled } from "../../../slots/DataGridSlot.js";
+import { I as InputTextEditorStyled } from "../../../slots/DataGridSlot.js";
 function autoFocusAndSelect(input) {
   input?.focus();
   input?.select();

package/components/datagrids/subcomponents/editors/TextEditor/TextEditor.test.d.ts

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

package/components/datagrids/subcomponents/editors/TextEditor/index.d.ts

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

package/components/datagrids/subcomponents/editors/TextEditor/index.js

@@ -0,0 +1 @@
+

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

@@ -0,0 +1,2 @@
+export { TextEditor, NumberEditor } from './TextEditor';
+export { ColumnEditLabelFormatter, useColumnEditLabel, type ColumnEditLabelFormatterProps, } from './EditLabelEditor';

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

@@ -0,0 +1,3 @@
+export { HeaderActions } from './HeaderActions';
+export { ControlNavigate } from './ControlNavigate';
+export * from './editors';

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

@@ -8,7 +8,7 @@ import { DATAGRID_PREFIX_NAME } from './constants';
 import { IGridConfigExtended, ViewMode } from './contexts/DataGridContext/types';
 import { Sizes } from '@m4l/styles';
 import { PagerProps } from '../Pager';
-import { SettingsProps } from './subcomponents/HeaderActions/subcomponents/Settings/types';
+import { SettingsProps } from './views/TableView/subcomponents/Settings/types';
 import { ReactNode } from 'react';
 export type GridFormatterPropss<T, SR> = RenderCellProps<T, SR>;
 export type { ColumnUncertaintyFormatter, ColumnPointsFormatter, ColumnNestedValueFormatter, } from './formatters';

package/components/datagrids/views/CardsView/CardsView.d.ts

@@ -0,0 +1,6 @@
+import { RowKey } from '../../types';
+import { CardsViewProps } from './types';
+/**
+ * Componente que muestra las filas del DataGrid en formato de tarjetas.
+ */
+export declare function CardsView<TRow, TSummaryRow, TKey extends RowKey = RowKey>(props: CardsViewProps<TRow, TSummaryRow, TKey>): import("react/jsx-runtime").JSX.Element | null;

package/components/{DataGrid/subcomponents/Cards/index.js → datagrids/views/CardsView/CardsView.js}

@@ -1,13 +1,13 @@
 import { jsx } from "react/jsx-runtime";
 import { useRef, useMemo, useEffect } from "react";
-import { e as CardsContainerStyled } from "../../slots/DataGridSlot.js";
-import { C as CardRow } from "./subcomponents/CardRow/index.js";
-import { u as useProcessedColumns } from "../../hooks/useProcessedColumns.js";
-import { c as calculateCardHeight } from "./helpers/calculateCardHeight.js";
-import { u as useModalDetail } from "../../hooks/useModalCardDetail.js";
-import { s as scrollToCardElement } from "./helpers/scrollToCardElement.js";
+import { i as CardsContainerStyled } from "../../slots/DataGridSlot.js";
+import { u as useProcessedColumns } from "./hooks/useProcessedColumns/useProcessedColumns.js";
+import { u as useModalDetail } from "./hooks/useModalDetail/useModalDetail.js";
+import { c as calculateCardHeight } from "./helpers/calculateCardHeight/calculateCardHeight.js";
+import { s as scrollToCardElement } from "./helpers/scrollToCardElement/scrollToCardElement.js";
 import { C as ContainerFlow } from "../../../ContainerFlow/ContainerFlow.js";
-function Cards(props) {
+import { C as CardRow } from "./subcomponents/CardRow/CardRow.js";
+function CardsView(props) {
   const {
     rows,
     columns,
@@ -28,7 +28,6 @@ function Cards(props) {
   });
   const handleOpenDetail = useModalDetail({
     columns: allProcessedColumns,
-    viewMode: "cards",
     onRowsChange,
     rows
   });
@@ -107,5 +106,5 @@ function Cards(props) {
   }) }) });
 }
 export {
-  Cards as C
+  CardsView as C
 };

package/components/datagrids/views/CardsView/CardsView.test.d.ts

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

package/components/{DataGrid/subcomponents/Cards/helpers → datagrids/views/CardsView/helpers/calculateCardHeight}/calculateCardHeight.d.ts

@@ -1,4 +1,4 @@
-import { CalculateCardHeightProps } from '../types';
+import { CalculateCardHeightProps } from '../../types';
 /**
  * Calcula la altura estimada de una card basándose en el número de columnas visibles.
  * @param visibleColumnsCount - Número de columnas visibles en la card

package/components/{DataGrid/subcomponents/Cards/helpers → datagrids/views/CardsView/helpers/calculateCardHeight}/calculateCardHeight.js

@@ -1,4 +1,4 @@
-import { C as CARD_HEIGHT } from "../../../constants.js";
+import { C as CARD_HEIGHT } from "../../../../constants.js";
 function calculateCardHeight(props) {
   const { visibleColumnsCount, customMinHeight } = props;
   if (customMinHeight !== void 0) {

package/components/datagrids/views/CardsView/helpers/calculateCardHeight/calculateCardHeight.test.d.ts

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

package/components/datagrids/views/CardsView/helpers/calculateCardHeight/index.d.ts

@@ -0,0 +1 @@
+export * from './calculateCardHeight';

package/components/datagrids/views/CardsView/helpers/calculateCardHeight/index.js

@@ -0,0 +1 @@
+

package/components/datagrids/views/CardsView/helpers/scrollToCardElement/index.d.ts

@@ -0,0 +1 @@
+export * from './scrollToCardElement';

package/components/datagrids/views/CardsView/helpers/scrollToCardElement/index.js

@@ -0,0 +1 @@
+

package/components/datagrids/views/CardsView/helpers/scrollToCardElement/scrollToCardElement.test.d.ts

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

package/components/datagrids/views/CardsView/hooks/useCardContent/index.d.ts

@@ -0,0 +1 @@
+export * from './useCardContent';

package/components/datagrids/views/CardsView/hooks/useCardContent/index.js

@@ -0,0 +1 @@
+

package/components/{DataGrid/subcomponents/Cards/hooks → datagrids/views/CardsView/hooks/useCardContent}/useCardContent.d.ts

@@ -1,4 +1,4 @@
-import { CardContentProps } from '../../../types';
+import { CardContentProps } from '../../../../types';
 /**
  * Hook que encapsula toda la lógica de renderizado del contenido de una Card
  */

package/components/{DataGrid/subcomponents/Cards/hooks → datagrids/views/CardsView/hooks/useCardContent}/useCardContent.js

@@ -1,11 +1,11 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useState } from "react";
-import { u as useDataGrid } from "../../../hooks/useDataGrid.js";
-import { b as ContainerLabelValueColumnStyled, c as ContentWrapperColumnStyled, L as LabelHeaderColumnStyled, E as EditorCellWrapperStyled, V as ValueColumnStyled, d as EditablePlaceholderStyled, I as IconButtonEditStyled } from "../../../slots/DataGridSlot.js";
-import { D as DICTIONARY } from "../../../dictionary.js";
+import { j as ContainerLabelValueColumnStyled, k as ContentWrapperColumnStyled, L as LabelHeaderColumnStyled, E as EditorCellWrapperStyled, V as ValueColumnStyled, l as EditablePlaceholderStyled, m as IconButtonEditStyled } from "../../../../slots/DataGridSlot.js";
+import { D as DICTIONARY } from "../../../../dictionary.js";
 import { useModuleDictionary, useEnvironment } from "@m4l/core";
-import { p as pathIcons } from "../../../icons.js";
-import { u as useComponentSize } from "../../../../../hooks/useComponentSize/useComponentSize.js";
+import { p as pathIcons } from "../../../../icons.js";
+import { u as useComponentSize } from "../../../../../../hooks/useComponentSize/useComponentSize.js";
+import { u as useDataGrid } from "../../../../hooks/shared/useDataGrid/useDataGrid.js";
 function useCardContent({
   row,
   rows,

package/components/datagrids/views/CardsView/hooks/useCardContent/useCardContent.test.d.ts

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

package/components/datagrids/views/CardsView/hooks/useModalDetail/index.d.ts

@@ -0,0 +1,2 @@
+export * from './useModalDetail';
+export * from './types';

package/components/datagrids/views/CardsView/hooks/useModalDetail/index.js

@@ -0,0 +1 @@
+

package/components/datagrids/views/CardsView/hooks/useModalDetail/types.d.ts

@@ -0,0 +1,19 @@
+import { Column, RowsChangeData } from 'react-data-grid';
+import { Maybe } from '@m4l/core';
+/**
+ * Props para el hook useModalDetail
+ */
+export interface UseModalDetailProps<TRow> {
+    /**
+     * Columnas a mostrar en el modal de detalle
+     */
+    columns: readonly Column<TRow, any>[];
+    /**
+     * Función para manejar cambios en las filas (para editores)
+     */
+    onRowsChange?: Maybe<(rows: TRow[], data: RowsChangeData<TRow, any>) => void>;
+    /**
+     * Array completo de todas las filas (necesario para reconstruir el array al editar en el modal)
+     */
+    rows: readonly TRow[];
+}

package/components/datagrids/views/CardsView/hooks/useModalDetail/types.js

@@ -0,0 +1 @@
+

package/components/datagrids/views/CardsView/hooks/useModalDetail/useModalDetail.d.ts

@@ -0,0 +1,6 @@
+import { UseModalDetailProps } from './types';
+/**
+ * Hook que renderiza el modal de detalle para cualquier vista
+ * mostrando TODAS las columnas sin excepción
+ */
+export declare const useModalDetail: <TRow>({ columns, onRowsChange, rows, }: UseModalDetailProps<TRow>) => (row: TRow) => void;

package/components/{DataGrid/hooks/useModalCardDetail.js → datagrids/views/CardsView/hooks/useModalDetail/useModalDetail.js}

@@ -2,18 +2,17 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { useModuleDictionary, useEnvironment } from "@m4l/core";
 import { useIsMobile } from "@m4l/graphics";
 import { useCallback } from "react";
-import { u as useModal } from "../../../hooks/useModal/index.js";
-import { a as ContentModalSettingStyled, D as DataGridRootStyled } from "../slots/DataGridSlot.js";
-import { p as pathIcons } from "../icons.js";
-import { C as CardDetails } from "../subcomponents/Cards/subcomponents/CardDetails/index.js";
-import { D as DICTIONARY } from "../dictionary.js";
-import { u as useDataGrid } from "./useDataGrid.js";
-import { A as ActionsContainer } from "../../CommonActions/components/ActionsContainer/ActionsContainer.js";
-import { W as WindowBase } from "../../WindowBase/WindowBase.js";
-import { A as ActionCancel } from "../../CommonActions/components/ActionCancel/ActionCancel.js";
+import { u as useModal } from "../../../../../../hooks/useModal/index.js";
+import { n as ContentModalSettingStyled, D as DataGridRootStyled } from "../../../../slots/DataGridSlot.js";
+import { p as pathIcons } from "../../../../icons.js";
+import { D as DICTIONARY } from "../../../../dictionary.js";
+import { C as CardDetails } from "../../subcomponents/CardDetails/CardDetails.js";
+import { A as ActionsContainer } from "../../../../../CommonActions/components/ActionsContainer/ActionsContainer.js";
+import { u as useDataGrid } from "../../../../hooks/shared/useDataGrid/useDataGrid.js";
+import { W as WindowBase } from "../../../../../WindowBase/WindowBase.js";
+import { A as ActionCancel } from "../../../../../CommonActions/components/ActionCancel/ActionCancel.js";
 const useModalDetail = ({
   columns,
-  viewMode,
   onRowsChange,
   rows
 }) => {
@@ -24,7 +23,7 @@ const useModalDetail = ({
   const isMobile = useIsMobile();
   const handleOpenDetail = useCallback(
     (row) => {
-      const viewColumnsConfig = getConfigColumns(viewMode);
+      const viewColumnsConfig = getConfigColumns("cards");
       const rowIndex = rows.findIndex((r) => r === row);
       openModal({
         initialWidth: 500,
@@ -69,8 +68,7 @@ const useModalDetail = ({
       getLabel,
       host_static_assets,
       environment_assets,
-      isMobile,
-      viewMode
+      isMobile
     ]
   );
   return handleOpenDetail;

package/components/datagrids/views/CardsView/hooks/useModalDetail/useModalDetail.test.d.ts

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

package/components/datagrids/views/CardsView/hooks/useProcessedColumns/index.d.ts

@@ -0,0 +1,2 @@
+export * from './useProcessedColumns';
+export * from './types';

package/components/datagrids/views/CardsView/hooks/useProcessedColumns/index.js

@@ -0,0 +1 @@
+

package/components/datagrids/views/CardsView/hooks/useProcessedColumns/types.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Opciones para el hook useProcessedColumns
+ */
+export interface ProcessedColumnsOptions {
+    /**
+     * Si es true, aplica el filtro de visibilidad según la configuración.
+     * Si es false, muestra todas las columnas (útil para el modal de detalle).
+     * @default true
+     */
+    applyVisibilityFilter?: boolean;
+}

package/components/datagrids/views/CardsView/hooks/useProcessedColumns/types.js

@@ -0,0 +1 @@
+

package/components/{DataGrid/hooks → datagrids/views/CardsView/hooks/useProcessedColumns}/useProcessedColumns.d.ts

@@ -1,5 +1,5 @@
 import { Column } from 'react-data-grid';
-import { ProcessedColumnsOptions } from '../types';
+import { ProcessedColumnsOptions } from './types';
 /**
  * Hook que procesa columnas para cualquier vista que no sea Table.
  * - Aplica configuración de visibilidad y orden (opcional)
@@ -38,8 +38,8 @@ export declare function useProcessedColumns<TRow, TSummaryRow>(columns: readonly
     visible?: boolean;
     hidden?: boolean;
     fixed?: boolean;
-    type: import('../types').ColumnType;
-    align?: import('../types').ColumnAlign;
+    type: import('../../../../types').ColumnType;
+    align?: import('../../../../types').ColumnAlign;
     isDraggable?: boolean;
     withFilter?: boolean;
     withinHeaderRenderer?: import('react').FunctionComponent<import('react-data-grid').RenderHeaderCellProps<TRow, TSummaryRow>> | undefined;

package/components/{DataGrid/hooks → datagrids/views/CardsView/hooks/useProcessedColumns}/useProcessedColumns.js

@@ -1,6 +1,6 @@
 import { useMemo } from "react";
-import { u as useDataGrid } from "./useDataGrid.js";
-import { d as DATAGRID_SELECT_COLUMN_KEY, e as DATAGRID_ACTIONS_COLUMN_KEY } from "../constants.js";
+import { d as DATAGRID_SELECT_COLUMN_KEY, e as DATAGRID_ACTIONS_COLUMN_KEY } from "../../../../constants.js";
+import { u as useDataGrid } from "../../../../hooks/shared/useDataGrid/useDataGrid.js";
 function useProcessedColumns(columns, options = {}) {
   const { applyVisibilityFilter = true } = options;
   const { getConfigColumns, viewMode } = useDataGrid();

package/components/datagrids/views/CardsView/hooks/useProcessedColumns/useProcessedColumns.test.d.ts

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

package/components/datagrids/views/CardsView/index.d.ts

@@ -0,0 +1,2 @@
+export * from './CardsView';
+export * from './types';

package/components/datagrids/views/CardsView/index.js

@@ -0,0 +1 @@
+

package/components/{DataGrid/subcomponents/Cards/subcomponents/CardDetails/index.d.ts → datagrids/views/CardsView/subcomponents/CardDetails/CardDetails.d.ts}

@@ -1,4 +1,4 @@
-import { CardDetailsProps } from '../../types';
+import { CardDetailsProps } from './types';
 /**
  * Componente genérico que renderiza TODAS las columnas de una fila
  * en formato detalle dentro del modal.

package/components/{DataGrid/subcomponents/Cards/subcomponents/CardDetails/index.js → datagrids/views/CardsView/subcomponents/CardDetails/CardDetails.js}

@@ -1,6 +1,6 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useState, useCallback } from "react";
-import { f as CardDetailContainerStyled, b as ContainerLabelValueColumnStyled, c as ContentWrapperColumnStyled, L as LabelHeaderColumnStyled, E as EditorCellWrapperStyled, V as ValueColumnStyled, d as EditablePlaceholderStyled, I as IconButtonEditStyled } from "../../../../slots/DataGridSlot.js";
+import { o as CardDetailContainerStyled, j as ContainerLabelValueColumnStyled, k as ContentWrapperColumnStyled, L as LabelHeaderColumnStyled, E as EditorCellWrapperStyled, V as ValueColumnStyled, l as EditablePlaceholderStyled, m as IconButtonEditStyled } from "../../../../slots/DataGridSlot.js";
 import { D as DICTIONARY } from "../../../../dictionary.js";
 import { useModuleDictionary, useEnvironment } from "@m4l/core";
 import { p as pathIcons } from "../../../../icons.js";

package/components/datagrids/views/CardsView/subcomponents/CardDetails/CardDetails.test.d.ts

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

package/components/datagrids/views/CardsView/subcomponents/CardDetails/index.d.ts

@@ -0,0 +1,2 @@
+export * from './CardDetails';
+export * from './types';

package/components/datagrids/views/CardsView/subcomponents/CardDetails/index.js

@@ -0,0 +1 @@
+

package/components/datagrids/views/CardsView/subcomponents/CardDetails/types.d.ts

@@ -0,0 +1,38 @@
+import { Column, RowsChangeData } from 'react-data-grid';
+import { Maybe } from '@m4l/core';
+import { IViewConfig } from '../../../../contexts/DataGridContext/types';
+import { Sizes } from '@m4l/styles';
+/**
+ * Props para el componente CardDetails
+ */
+export interface CardDetailsProps<TRow> {
+    /**
+     * Fila que se mostrará en el detalle
+     */
+    row: TRow;
+    /**
+     * Array completo de todas las filas (necesario para reconstruir el array al editar)
+     */
+    rows: readonly TRow[];
+    /**
+     * Índice de la fila actual en el array de filas
+     */
+    rowIndex: number;
+    /**
+     * Columnas que se mostrarán en el detalle
+     */
+    columns: readonly Column<TRow, any>[];
+    /**
+     * Configuración de las columnas de la vista
+     */
+    viewColumnsConfig: IViewConfig<any, any>[];
+    /**
+     * Función para manejar cambios en las filas (para editores)
+     */
+    onRowsChange?: Maybe<(rows: TRow[], data: RowsChangeData<TRow, any>) => void>;
+    /**
+     * Tamaño del componente
+     * @default 'medium'
+     */
+    size?: Extract<Sizes, 'small' | 'medium'>;
+}

package/components/datagrids/views/CardsView/subcomponents/CardDetails/types.js

@@ -0,0 +1 @@
+

package/components/{DataGrid/subcomponents/Cards/subcomponents/CardRow/index.d.ts → datagrids/views/CardsView/subcomponents/CardRow/CardRow.d.ts}

@@ -1,5 +1,5 @@
 import { RowKey } from '../../../../types';
-import { CardRowProps } from '../../types';
+import { CardRowProps } from './types';
 /**
  * Componente que muestra una fila de tarjetas.
  */

package/components/{DataGrid/subcomponents/Cards/subcomponents/CardRow/index.js → datagrids/views/CardsView/subcomponents/CardRow/CardRow.js}

@@ -1,10 +1,10 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import React, { useMemo } from "react";
-import { j as CardContentWrapperStyled, k as CardContentStyled, l as CardStyled } from "../../../../slots/DataGridSlot.js";
-import { L as LazyLoadCard } from "../LazyLoadCard/index.js";
-import { u as useCardContent } from "../../hooks/useCardContent.js";
-import { C as CardHeader } from "../CardHeader/index.js";
+import { p as CardContentWrapperStyled, q as CardContentStyled, r as CardStyled } from "../../../../slots/DataGridSlot.js";
 import { deepEqual } from "fast-equals";
+import { u as useCardContent } from "../../hooks/useCardContent/useCardContent.js";
+import { C as CardHeader } from "./subcomponents/CardHeader/CardHeader.js";
+import { L as LazyLoadCard } from "./subcomponents/LazyLoadCard/LazyLoadCard.js";
 function CardRowComponent({
   row,
   rows,
@@ -75,29 +75,21 @@ function CardRowComponent({
       onSelectedRowsChange(mySet);
     }
   };
-  return /* @__PURE__ */ jsx(
-    LazyLoadCard,
+  return /* @__PURE__ */ jsx(LazyLoadCard, { threshold: 200, minHeight, rowKey: rowKeyGetter(row), children: /* @__PURE__ */ jsx(
+    CardStyled,
     {
-      threshold: 200,
-      minHeight,
-      rowKey: rowKeyGetter(row),
-      children: /* @__PURE__ */ jsx(
-        CardStyled,
-        {
-          variant: "outlined",
-          selected: selectedRows?.has(rowKeyGetter(row)),
-          ownerState: {
-            checked: isChecked,
-            selected: selectedRows?.has(rowKeyGetter(row))
-          },
-          onClick: onCardClick,
-          "data-testid": "data-grid-card",
-          "data-row-key": rowKeyGetter(row),
-          children: content
-        }
-      )
+      variant: "outlined",
+      selected: selectedRows?.has(rowKeyGetter(row)),
+      ownerState: {
+        checked: isChecked,
+        selected: selectedRows?.has(rowKeyGetter(row))
+      },
+      onClick: onCardClick,
+      "data-testid": "data-grid-card",
+      "data-row-key": rowKeyGetter(row),
+      children: content
     }
-  );
+  ) });
 }
 const CardRow = React.memo(CardRowComponent, (prevProps, nextProps) => {
   return deepEqual(prevProps, nextProps);

package/components/datagrids/views/CardsView/subcomponents/CardRow/CardRow.test.d.ts

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

package/components/datagrids/views/CardsView/subcomponents/CardRow/index.d.ts

@@ -0,0 +1,2 @@
+export * from './CardRow';
+export * from './types';

package/components/datagrids/views/CardsView/subcomponents/CardRow/index.js

@@ -0,0 +1 @@
+

package/components/{DataGrid/subcomponents/Cards/subcomponents/CardHeader/index.d.ts → datagrids/views/CardsView/subcomponents/CardRow/subcomponents/CardHeader/CardHeader.d.ts}

@@ -1,4 +1,4 @@
-import { CardHeaderProps } from '../../types';
+import { CardHeaderProps } from './types';
 /**
  * Componente CardHeader que renderiza el header de cada card con:
  * - Checkbox en el lado izquierdo (solo si existen checkedRows/onCheckedRowsChange)

package/components/{DataGrid/subcomponents/Cards/subcomponents/CardHeader/index.js → datagrids/views/CardsView/subcomponents/CardRow/subcomponents/CardHeader/CardHeader.js}

@@ -1,12 +1,12 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { useMemo, useCallback } from "react";
 import { useEnvironment } from "@m4l/core";
-import { u as useDataGrid } from "../../../../hooks/useDataGrid.js";
-import { g as CardHeaderStyled, h as CardHeaderLeftStyled, i as CardHeaderRightStyled } from "../../../../slots/DataGridSlot.js";
-import { p as pathIcons } from "../../../../icons.js";
-import { C as CheckboxCellAdapter } from "../../../CheckboxCellAdapter/index.js";
-import { I as IconButton } from "../../../../../mui_extended/IconButton/IconButton.js";
-import { M as MenuActions } from "../../../../../MenuActions/MenuActions.js";
+import { s as CardHeaderStyled, t as CardHeaderLeftStyled, u as CardHeaderRightStyled } from "../../../../../../slots/DataGridSlot.js";
+import { p as pathIcons } from "../../../../../../icons.js";
+import { C as CheckboxCellAdapter } from "../../../../../adapters/CheckboxCellAdapter/CheckboxCellAdapter.js";
+import { I as IconButton } from "../../../../../../../mui_extended/IconButton/IconButton.js";
+import { u as useDataGrid } from "../../../../../../hooks/shared/useDataGrid/useDataGrid.js";
+import { M as MenuActions } from "../../../../../../../MenuActions/MenuActions.js";
 function CardHeader({
   row,
   onOpenDetail,

package/components/datagrids/views/CardsView/subcomponents/CardRow/subcomponents/CardHeader/CardHeader.test.d.ts

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

package/components/datagrids/views/CardsView/subcomponents/CardRow/subcomponents/CardHeader/index.d.ts

@@ -0,0 +1,2 @@
+export * from './CardHeader';
+export * from './types';

package/components/datagrids/views/CardsView/subcomponents/CardRow/subcomponents/CardHeader/index.js

@@ -0,0 +1 @@
+

package/components/datagrids/views/CardsView/subcomponents/CardRow/subcomponents/CardHeader/types.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Props para el componente CardHeader
+ */
+export interface CardHeaderProps<TRow> {
+    row: TRow;
+    onOpenDetail: (row: TRow) => void;
+    isChecked?: boolean;
+    showCheckbox?: boolean;
+    checkedRows?: ReadonlySet<any>;
+    onCheckedRowsChange?: (rows: ReadonlySet<any>) => void;
+}

package/components/datagrids/views/CardsView/subcomponents/CardRow/subcomponents/CardHeader/types.js

@@ -0,0 +1 @@
+

package/components/{DataGrid/subcomponents/Cards/subcomponents/LazyLoadCard/index.d.ts → datagrids/views/CardsView/subcomponents/CardRow/subcomponents/LazyLoadCard/LazyLoadCard.d.ts}

@@ -1,4 +1,4 @@
-import { LazyLoadCardProps } from '../../types';
+import { LazyLoadCardProps } from './types';
 /**
  * Componente wrapper que implementa lazy loading para cards del DataGrid.
  *