@m4l/components 9.3.36 → 9.3.37-JT20251128-beta.2

package/components/DataGrid/hooks/useChangeColumnsConfig/index.d.ts

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

package/components/DataGrid/hooks/useChangeColumnsConfig/index.js

@@ -0,0 +1 @@
+

package/components/DataGrid/hooks/useChangeColumnsConfig/useChangeColumnsConfig.d.ts

@@ -0,0 +1,9 @@
+import { UseChangeColumnsConfigParams, UseChangeColumnsConfigReturn } from '../../types.hooks';
+/**
+ * Hook para manejar el cambio de configuración de columnas.
+ *
+ * Guarda la configuración en localStorage y actualiza el estado.
+ * @param params - Parámetros del hook
+ * @returns Función para cambiar la configuración de columnas
+ */
+export declare const useChangeColumnsConfig: ({ id, onChangeUserColumns, updateConfigColumns, }: UseChangeColumnsConfigParams) => UseChangeColumnsConfigReturn;

package/components/DataGrid/hooks/useChangeColumnsConfig/useChangeColumnsConfig.js

@@ -0,0 +1,27 @@
+import { useCallback } from "react";
+import { s as saveViewConfig } from "../../helpers/saveViewConfig/saveViewConfig.js";
+import { g as getViewSuffix } from "../../helpers/getViewSuffix/getViewSuffix.js";
+const useChangeColumnsConfig = ({
+  id,
+  onChangeUserColumns,
+  updateConfigColumns
+}) => {
+  const onChangeColumnsConfig = useCallback(
+    (viewModeParam, newConfig) => {
+      saveViewConfig(
+        id,
+        getViewSuffix(viewModeParam),
+        newConfig,
+        onChangeUserColumns
+      );
+      updateConfigColumns(viewModeParam, newConfig);
+    },
+    [id, onChangeUserColumns, updateConfigColumns]
+  );
+  return {
+    onChangeColumnsConfig
+  };
+};
+export {
+  useChangeColumnsConfig as u
+};

package/components/DataGrid/hooks/useChangeColumnsConfig/useChangeColumnsConfig.test.d.ts

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

package/components/DataGrid/hooks/useChangeColumnsOrder/index.d.ts

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

package/components/DataGrid/hooks/useChangeColumnsOrder/index.js

@@ -0,0 +1 @@
+

package/components/DataGrid/hooks/useChangeColumnsOrder/useChangeColumnsOrder.d.ts

@@ -0,0 +1,10 @@
+import { UseChangeColumnsOrderParams, UseChangeColumnsOrderReturn } from '../../types.hooks';
+/**
+ * Hook para manejar el cambio de orden de columnas.
+ *
+ * Reordena las columnas y llama a onChangeColumnsConfig para persistir.
+ * @param getConfigColumns Función para obtener la configuración de columnas
+ * @param onChangeColumnsConfig Función para cambiar la configuración de columnas
+ * @returns Función para cambiar el orden de columnas
+ */
+export declare const useChangeColumnsOrder: ({ getConfigColumns, onChangeColumnsConfig, }: UseChangeColumnsOrderParams) => UseChangeColumnsOrderReturn;

package/components/DataGrid/hooks/useChangeColumnsOrder/useChangeColumnsOrder.js

@@ -0,0 +1,34 @@
+import { useCallback } from "react";
+const useChangeColumnsOrder = ({
+  getConfigColumns,
+  onChangeColumnsConfig
+}) => {
+  const onChangeColumnsOrder = useCallback(
+    (viewModeParam, sourceKey, targetKey) => {
+      if (sourceKey === targetKey) {
+        return;
+      }
+      const currentConfig = getConfigColumns(viewModeParam);
+      const sourceColumnIndex = currentConfig.findIndex(
+        (c) => c.key === sourceKey
+      );
+      const targetColumnIndex = currentConfig.findIndex(
+        (c) => c.key === targetKey
+      );
+      const reorderedConfig = [...currentConfig];
+      reorderedConfig.splice(
+        targetColumnIndex,
+        0,
+        reorderedConfig.splice(sourceColumnIndex, 1)[0]
+      );
+      onChangeColumnsConfig(viewModeParam, reorderedConfig);
+    },
+    [getConfigColumns, onChangeColumnsConfig]
+  );
+  return {
+    onChangeColumnsOrder
+  };
+};
+export {
+  useChangeColumnsOrder as u
+};

package/components/DataGrid/hooks/useChangeColumnsOrder/useChangeColumnsOrder.test.d.ts

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

package/components/DataGrid/hooks/useColumnsWidth/index.d.ts

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

package/components/DataGrid/hooks/useColumnsWidth/index.js

@@ -0,0 +1 @@
+

package/components/DataGrid/hooks/useColumnsWidth/useColumnsWidth.d.ts

@@ -0,0 +1,11 @@
+import { UseColumnsWidthParams, UseColumnsWidthReturn } from '../../types.hooks';
+/**
+ * Hook para manejar el estado del ancho de las columnas del DataGrid.
+ *
+ * Maneja:
+ * - Estado del ancho de cada columna
+ * - Guardado con debounce de 500ms al cambiar el ancho
+ * @param params - Parámetros del hook
+ * @returns Estado y función para cambiar el ancho de columnas
+ */
+export declare const useColumnsWidth: ({ id, onChangeUserColumns, }: UseColumnsWidthParams) => UseColumnsWidthReturn;

package/components/DataGrid/hooks/useColumnsWidth/useColumnsWidth.js

@@ -0,0 +1,29 @@
+import { useState, useRef, useCallback } from "react";
+import { s as saveColumnsWidth } from "../../helpers/saveColumnsWidth/saveColumnsWidth.js";
+const useColumnsWidth = ({
+  id,
+  onChangeUserColumns
+}) => {
+  const [columnsWidths, setColumnsWidths] = useState(/* @__PURE__ */ new Map());
+  const timerRef = useRef(null);
+  const onChangeColumnWidth = useCallback(
+    (columnKey, width) => {
+      columnsWidths.set(columnKey, Math.round(width));
+      if (timerRef.current) {
+        clearTimeout(timerRef.current);
+      }
+      timerRef.current = setTimeout(() => {
+        saveColumnsWidth(id, columnsWidths, onChangeUserColumns);
+      }, 500);
+    },
+    [id, columnsWidths, onChangeUserColumns]
+  );
+  return {
+    columnsWidths,
+    setColumnsWidths,
+    onChangeColumnWidth
+  };
+};
+export {
+  useColumnsWidth as u
+};

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

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

package/components/DataGrid/hooks/useRowHeight/index.d.ts

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

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

@@ -0,0 +1 @@
+

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

@@ -0,0 +1,28 @@
+import { UseRowHeightParams, UseRowHeightReturn } from '../../types.hooks';
+/**
+ * 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
+ * @throws Error si rowHeights y rowHeaderHeights no son del mismo tipo
+ * @throws Error si los arrays no tienen exactamente 3 elementos
+ * @throws Error si se intenta cambiar el variant en modo fijo
+ * @example
+ * // Modo variable (permite cambiar variant)
+ * const { currentRowHeightVariant, setRowHeightVariant } = useRowHeight({
+ *   rowHeights: [32, 40, 48],
+ *   rowHeaderHeights: [36, 44, 52],
+ *   initialRowHeightVariant: 'standard',
+ * });
+ *
+ * // Modo fijo (altura constante)
+ * const { currentRowHeightVariant } = useRowHeight({
+ *   rowHeights: 40,
+ *   rowHeaderHeights: 44,
+ *   initialRowHeightVariant: 'standard',
+ * });
+ */
+export declare const useRowHeight: ({ rowHeights, rowHeaderHeights, initialRowHeightVariant, }: UseRowHeightParams) => UseRowHeightReturn;

package/components/DataGrid/hooks/useRowHeight/useRowHeight.js

@@ -0,0 +1,51 @@
+import { useState, useCallback } from "react";
+import { g as getIndexRowHeightVariant } from "../../helpers/getIndexRowHeightVariant/getIndexRowHeightVariant.js";
+const useRowHeight = ({
+  rowHeights,
+  rowHeaderHeights,
+  initialRowHeightVariant
+}) => {
+  const [currentRowHeightVariant, setCurrentRowHeightVariant] = useState(() => {
+    if (typeof rowHeights !== typeof rowHeaderHeights) {
+      throw new Error("Must be same type rowheights and rowHeaderTypes");
+    }
+    if (typeof rowHeights === "number" && typeof rowHeaderHeights === "number") {
+      return {
+        rowHVariant: "compact",
+        rowHeight: rowHeights,
+        rowHeaderHeight: rowHeaderHeights
+      };
+    }
+    if (typeof rowHeights !== "number" && rowHeights.length !== 3) {
+      throw new Error("Must be 3 heights");
+    }
+    if (typeof rowHeaderHeights !== "number" && rowHeaderHeights.length !== 3) {
+      throw new Error("Must be 3 HeaderHeights");
+    }
+    return {
+      rowHVariant: initialRowHeightVariant,
+      rowHeight: typeof rowHeights !== "number" ? rowHeights[getIndexRowHeightVariant(initialRowHeightVariant)] : rowHeights,
+      rowHeaderHeight: typeof rowHeaderHeights !== "number" ? rowHeaderHeights[getIndexRowHeightVariant(initialRowHeightVariant)] : rowHeaderHeights
+    };
+  });
+  const setRowHeightVariant = useCallback(
+    (newVariant) => {
+      if (typeof rowHeights === "number" || typeof rowHeaderHeights === "number") {
+        throw new Error("Only use setCurrentRowHeight with vector rowHeights");
+      }
+      setCurrentRowHeightVariant({
+        rowHVariant: newVariant,
+        rowHeight: rowHeights[getIndexRowHeightVariant(newVariant)],
+        rowHeaderHeight: rowHeaderHeights[getIndexRowHeightVariant(newVariant)]
+      });
+    },
+    [rowHeights, rowHeaderHeights]
+  );
+  return {
+    currentRowHeightVariant,
+    setRowHeightVariant
+  };
+};
+export {
+  useRowHeight as u
+};

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

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

package/components/DataGrid/hooks/useViewConfig/index.d.ts

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

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

@@ -0,0 +1 @@
+

package/components/DataGrid/hooks/useViewConfig/useViewConfig.d.ts

@@ -0,0 +1,9 @@
+import { UseViewConfigReturn } from '../../types.hooks';
+/**
+ * Hook para manejar el estado de la configuración de columnas por vista.
+ *
+ * Maneja un estado genérico unificado para las configuraciones de TODAS las vistas
+ * (table, cards, etc).
+ * @returns Estado y funciones para manejar la configuración de vistas
+ */
+export declare const useViewConfig: () => UseViewConfigReturn;

package/components/DataGrid/hooks/useViewConfig/useViewConfig.js

@@ -0,0 +1,30 @@
+import { useState, useCallback } from "react";
+const useViewConfig = () => {
+  const [viewConfig, setViewConfig] = useState(() => ({
+    table: [],
+    cards: []
+  }));
+  const getConfigColumns = useCallback(
+    (viewModeParam) => {
+      return viewConfig[viewModeParam];
+    },
+    [viewConfig]
+  );
+  const updateConfigColumns = useCallback(
+    (viewModeParam, config) => {
+      setViewConfig((prev) => ({
+        ...prev,
+        [viewModeParam]: config
+      }));
+    },
+    []
+  );
+  return {
+    viewConfig,
+    getConfigColumns,
+    updateConfigColumns
+  };
+};
+export {
+  useViewConfig as u
+};

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

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

package/components/DataGrid/hooks/useViewMode/index.d.ts

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

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

@@ -0,0 +1 @@
+

package/components/DataGrid/hooks/useViewMode/useViewMode.d.ts

@@ -0,0 +1,31 @@
+import { UseViewModeParams, UseViewModeReturn } from '../../types.hooks';
+/**
+ * Hook para manejar el estado del modo de visualización (table/cards).
+ *
+ * ## Inicialización del viewMode
+ *
+ * El viewMode se inicializa siguiendo esta jerarquía de precedencia:
+ * 1. viewMode prop (modo controlado)
+ * 2. localStorage (configuración guardada localmente)
+ * 3. defaultViewMode (valor por defecto del desarrollador)
+ * 4. Fallback según dispositivo (mobile: 'cards', desktop: 'table')
+ *
+ * ## Persistencia del viewMode
+ *
+ * - Si `onChangeUserColumns` está definido → Guarda en backend (cookies de red)
+ * - Si no está definido → Fallback a localStorage
+ *
+ * ## Modo controlado vs no controlado
+ *
+ * - **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 onChangeUserColumns - Callback para guardar en backend (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, onChangeUserColumns, }: UseViewModeParams) => UseViewModeReturn;

package/components/DataGrid/hooks/useViewMode/useViewMode.js

@@ -0,0 +1,44 @@
+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";
+const useViewMode = ({
+  id,
+  viewMode,
+  defaultViewMode,
+  onViewModeChange,
+  onChangeUserColumns
+}) => {
+  const isMobile = useIsMobile();
+  const [viewModeState, setViewModeState] = useState(() => {
+    if (viewMode) {
+      return viewMode;
+    }
+    const savedViewMode = getViewMode(id, null, defaultViewMode);
+    if (savedViewMode) {
+      return savedViewMode;
+    }
+    return isMobile ? "cards" : "table";
+  });
+  const handleViewModeChange = useCallback(
+    (newViewMode) => {
+      setViewModeState(newViewMode);
+      saveViewMode(id, newViewMode, onChangeUserColumns);
+      onViewModeChange?.(newViewMode);
+    },
+    [id, onViewModeChange, onChangeUserColumns]
+  );
+  useEffect(() => {
+    if (viewMode !== void 0) {
+      setViewModeState(viewMode);
+    }
+  }, [viewMode]);
+  return {
+    viewModeState,
+    setViewModeState,
+    handleViewModeChange
+  };
+};
+export {
+  useViewMode as u
+};

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

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

package/components/DataGrid/index.d.ts

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

package/components/DataGrid/subcomponents/Cards/subcomponents/CardHeader/index.js

@@ -15,7 +15,7 @@ function CardHeader({
   checkedRows,
   onCheckedRowsChange
 }) {
-  const { rowKeyGetter, rowActionsGetter, size } = useDataGrid();
+  const { rowKeyGetter, rowActionsGetter, size, checkedRowsMultiple } = useDataGrid();
   const { host_static_assets, environment_assets } = useEnvironment();
   const rowKey = useMemo(() => rowKeyGetter(row), [rowKeyGetter, row]);
   const onChange = useCallback(
@@ -23,15 +23,23 @@ function CardHeader({
       if (!onCheckedRowsChange || !checkedRows) {
         return;
       }
-      const newCheckedRows = new Set(checkedRows);
-      if (checked) {
-        newCheckedRows.add(rowKey);
+      if (checkedRowsMultiple === false) {
+        if (checked) {
+          onCheckedRowsChange(/* @__PURE__ */ new Set([rowKey]));
+        } else {
+          onCheckedRowsChange(/* @__PURE__ */ new Set());
+        }
       } else {
-        newCheckedRows.delete(rowKey);
+        const newCheckedRows = new Set(checkedRows);
+        if (checked) {
+          newCheckedRows.add(rowKey);
+        } else {
+          newCheckedRows.delete(rowKey);
+        }
+        onCheckedRowsChange(newCheckedRows);
       }
-      onCheckedRowsChange(newCheckedRows);
     },
-    [checkedRows, onCheckedRowsChange, rowKey]
+    [checkedRows, onCheckedRowsChange, rowKey, checkedRowsMultiple]
   );
   const anchorOrigin = useMemo(
     () => ({

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

@@ -2,6 +2,7 @@ import { jsx } from "react/jsx-runtime";
 import { forwardRef, useContext } from "react";
 import { SelectCellFormatter } from "react-data-grid";
 import { C as CheckboxFormatter } from "../Table/subcomponents/CheckboxFormatter.js";
+import { R as RadioButtonFormatter } from "../Table/subcomponents/RadioButtonFormatter.js";
 import { a as DataGridContext } from "../../contexts/DataGridContext/index.js";
 import { l as CheckboxCellWrapperStyled } from "../../slots/DataGridSlot.js";
 const CheckboxCellAdapter = forwardRef(function CheckboxCellAdapter2(props, ref) {
@@ -14,12 +15,14 @@ const CheckboxCellAdapter = forwardRef(function CheckboxCellAdapter2(props, ref)
   } = props;
   const context = useContext(DataGridContext);
   const viewMode = context?.viewMode ?? "cards";
+  const checkedRowsMultiple = context?.checkedRowsMultiple;
   if (viewMode !== "table") {
     const handleClick = (e) => {
       e.stopPropagation();
     };
+    const FormatterComponent = checkedRowsMultiple === false ? RadioButtonFormatter : CheckboxFormatter;
     return /* @__PURE__ */ jsx(CheckboxCellWrapperStyled, { onClick: handleClick, children: /* @__PURE__ */ jsx(
-      CheckboxFormatter,
+      FormatterComponent,
       {
         ref,
         checked: value,

package/components/DataGrid/subcomponents/Table/hooks/useSortColumnsRows.js

@@ -2,6 +2,7 @@ import { useState, useEffect, useMemo } from "react";
 import { g as getDragHeaderRenderer } from "./getDragHeaderRenderer.js";
 import { A as ActionsColumn } from "../subcomponents/ActionsColumn.js";
 import { f as filterColumnClassName, S as SelectColumn } from "../subcomponents/SelectColumn.js";
+import { R as RadioSelectColumn } from "../subcomponents/RadioSelectColumn.js";
 import { useModuleSkeleton, getPropertyByString } from "@m4l/core";
 import { u as useFilters } from "../../../hooks/useFilters.js";
 import { u as useDataGrid } from "../../../hooks/useDataGrid.js";
@@ -38,7 +39,7 @@ function getComparator(columns, sortColumn) {
   }
 }
 const getColumIndex = (key, columnsConfig) => columnsConfig.findIndex((columnConfig) => columnConfig.key === key);
-const getInOrderColumns = (columns, hasCheckedRows, columnsConfig, columnsWidths, rowActionsGetter) => {
+const getInOrderColumns = (columns, hasCheckedRows, checkedRowsMultiple, columnsConfig, columnsWidths, rowActionsGetter) => {
   let filteredSortedColumns = columns.filter((column) => {
     const columnConfigIndex = getColumIndex(column.key, columnsConfig);
     const visible = columnConfigIndex > -1 ? columnsConfig[columnConfigIndex].visible : true;
@@ -64,7 +65,8 @@ const getInOrderColumns = (columns, hasCheckedRows, columnsConfig, columnsWidths
     filteredSortedColumns = [ActionsColumn, ...filteredSortedColumns];
   }
   if (hasCheckedRows) {
-    filteredSortedColumns = [SelectColumn, ...filteredSortedColumns];
+    const selectionColumn = checkedRowsMultiple === false ? RadioSelectColumn : SelectColumn;
+    filteredSortedColumns = [selectionColumn, ...filteredSortedColumns];
   }
   return filteredSortedColumns;
 };
@@ -89,6 +91,7 @@ const useSortColumnsRows = (sourceColumns, sourceRows, popoverHandlers) => {
     rowActionsGetter,
     checkedRows,
     onCheckedRowsChange,
+    checkedRowsMultiple,
     sortColumns,
     setSortColumns
   } = useDataGrid();
@@ -109,6 +112,7 @@ const useSortColumnsRows = (sourceColumns, sourceRows, popoverHandlers) => {
         sourceColumns,
         !!checkedRows && !!onCheckedRowsChange,
         //Si están seteados se habilita el múltipe
+        checkedRowsMultiple,
         columnsConfig,
         columnsWidths,
         rowActionsGetter

package/components/DataGrid/subcomponents/Table/subcomponents/RadioButtonFormatter.d.ts

@@ -0,0 +1,6 @@
+import { RenderCheckboxProps } from 'react-data-grid';
+/**
+ * Componente visual del RadioButton que se renderiza dentro de cada celda del DataGrid.
+ * ¿Para que sirve? Es un wrapper alrededor del componente Radio del MUI que adapta las props de react-data-grid
+ */
+export declare const RadioButtonFormatter: import('react').ForwardRefExoticComponent<RenderCheckboxProps & import('react').RefAttributes<HTMLInputElement>>;

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

@@ -0,0 +1,12 @@
+import { jsx } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import { R as RadioButton } from "../../../../mui_extended/RadioButton/RadioButton.js";
+const RadioButtonFormatter = forwardRef(function RadioFormatter({ onChange, checked, ...props }, _ref) {
+  function handleChange(e) {
+    onChange(e.target.checked, e.nativeEvent.shiftKey);
+  }
+  return /* @__PURE__ */ jsx(RadioButton, { checked, onChange: handleChange, ...props });
+});
+export {
+  RadioButtonFormatter as R
+};

package/components/DataGrid/subcomponents/Table/subcomponents/RadioSelectColumn.d.ts

@@ -0,0 +1,64 @@
+import { Column, RenderCellProps, RenderGroupCellProps, RenderHeaderCellProps } from 'react-data-grid';
+export declare const filterColumnClassName = "filter-cell";
+export declare const filterHeight = 35;
+/**
+ * Formateador para la celda de selección con radio button en filas agrupadas.
+ *
+ * **Nota:** Para radio buttons (selección única), no tiene sentido seleccionar grupos completos,
+ * por lo que este formateador retorna `null` y no renderiza ningún control.
+ * @param _props - Propiedades para renderizar la celda de grupo (no utilizadas).
+ * @returns `null` - No se renderiza ningún control de selección en grupos.
+ * @example
+ * // En un DataGrid con grupos, las filas de grupo no tendrán radio button
+ * // Solo las filas individuales tendrán radio buttons
+ */
+export declare function RadioSelectGroupFormatter(_props: RenderGroupCellProps<unknown>): null;
+/**
+ * Formateador para la celda de selección con radio button en filas individuales.
+ *
+ * Este componente maneja la lógica de **selección única**: cuando el usuario hace click
+ * en un radio button, se REEMPLAZA completamente la selección anterior con solo la fila actual.
+ *
+ * **Comportamiento:**
+ * - Si `checked` es `true`: El Set de `checkedRows` se reemplaza con `[rowKey actual]`
+ * - Si `checked` es `false`: El Set de `checkedRows` se vacía (deselección)
+ * @param props - Propiedades para renderizar la celda, incluyendo la fila actual.
+ * @returns Un componente `SelectCellFormatter` configurado como radio button.
+ * @example
+ * // Cuando el usuario hace click en el radio de la fila con ID=5:
+ * // checkedRows antes: Set([3])
+ * // checkedRows después: Set([5])  ← Reemplaza, no agrega
+ */
+export declare function RadioSelectFormatter(props: RenderCellProps<any, any>): import("react/jsx-runtime").JSX.Element;
+/**
+ * Renderizador para la celda de cabecera (header) de la columna de selección con radio buttons.
+ *
+ * **Nota:** A diferencia de los checkboxes, los radio buttons NO tienen funcionalidad de
+ * "Seleccionar Todo", ya que solo se puede seleccionar una fila a la vez. Por lo tanto,
+ * este renderizador retorna `null` y no muestra ningún control en el header.
+ * @param _props - Propiedades para renderizar la celda de cabecera (no utilizadas).
+ * @returns `null` - No se renderiza ningún control en la cabecera.
+ * @example
+ * // La cabecera de la columna estará vacía (sin checkbox "Select All")
+ */
+export declare function RadioSelectColumnHeaderRenderer(_props: RenderHeaderCellProps<any, any>): null;
+/**
+ * Definición de la columna de selección con radio buttons para el DataGrid.
+ *
+ * Esta columna permite **selección única** de filas mediante radio buttons.
+ *
+ * **Características:**
+ * - **Ancho fijo:** 32px (igual que la columna de checkboxes)
+ * - **No redimensionable:** `resizable: false`
+ * - **No draggable:** `isDraggable: false`
+ * - **No sortable:** `sortable: false`
+ * - **Congelada:** `frozen: true` (siempre visible al hacer scroll horizontal)
+ * - **Header vacío:** No tiene control "Select All"
+ * - **Selección única:** Solo una fila puede estar seleccionada a la vez
+ * @example
+ * // En useSortColumnsRows.tsx:
+ * const selectionColumn = checkedRowsMultiple === false
+ *   ? RadioSelectColumn   // ← Selección única con radio buttons
+ *   : SelectColumn;       // ← Selección múltiple con checkboxes
+ */
+export declare const RadioSelectColumn: Column<any, any>;

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

@@ -0,0 +1,46 @@
+import { jsx } from "react/jsx-runtime";
+import { u as useDataGrid } from "../../../hooks/useDataGrid.js";
+import { d as DATAGRID_SELECT_COLUMN_KEY } from "../../../constants.js";
+import { R as RadioButtonFormatter } from "./RadioButtonFormatter.js";
+function RadioSelectGroupFormatter(_props) {
+  return null;
+}
+function RadioSelectFormatter(props) {
+  const { checkedRows, onCheckedRowsChange, rowKeyGetter } = useDataGrid();
+  const onChange = (checked, _isShiftClick) => {
+    if (checked) {
+      onCheckedRowsChange && onCheckedRowsChange(/* @__PURE__ */ new Set([rowKeyGetter(props.row)]));
+    } else {
+      onCheckedRowsChange && onCheckedRowsChange(/* @__PURE__ */ new Set());
+    }
+  };
+  return /* @__PURE__ */ jsx(
+    RadioButtonFormatter,
+    {
+      checked: checkedRows?.has(rowKeyGetter(props.row)) || false,
+      tabIndex: props.tabIndex,
+      onChange,
+      "aria-label": "Select"
+    }
+  );
+}
+function RadioSelectColumnHeaderRenderer(_props) {
+  return null;
+}
+const RadioSelectColumn = {
+  key: DATAGRID_SELECT_COLUMN_KEY,
+  name: "",
+  width: 32,
+  minWidth: 32,
+  isDraggable: false,
+  resizable: false,
+  sortable: false,
+  frozen: true,
+  type: "boolean",
+  renderHeaderCell: RadioSelectColumnHeaderRenderer,
+  renderCell: RadioSelectFormatter,
+  renderGroupCell: RadioSelectGroupFormatter
+};
+export {
+  RadioSelectColumn as R
+};

package/components/DataGrid/tests/table/subcomponents/RadioButtonFormatter.test.d.ts

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

package/components/DataGrid/tests/table/subcomponents/RadioSelectColumn.test.d.ts

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