@m4l/components 9.3.28 → 9.3.29-JT19112025.beta.2

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

@@ -1,6 +1,10 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useState, useCallback } from "react";
-import { e as CardDetailContainerStyled, b as ContainerLabelValueColumnStyled, c as ContentWrapperColumnStyled, L as LabelHeaderColumnStyled, E as EditorCellWrapperStyled, V as ValueColumnStyled } from "../../../../slots/DataGridSlot.js";
+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 { 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";
 function CardDetails({
   row,
   columns,
@@ -10,6 +14,9 @@ function CardDetails({
 }) {
   const [editingColumnKey, setEditingColumnKey] = useState(null);
   const [refreshCounter, setRefreshCounter] = useState(0);
+  const { getLabel } = useModuleDictionary();
+  const { host_static_assets, environment_assets } = useEnvironment();
+  const { currentSize } = useComponentSize(size);
   const handleForceRefresh = useCallback(() => {
     setRefreshCounter((prev) => prev + 1);
   }, []);
@@ -17,10 +24,8 @@ function CardDetails({
     if (column.renderCell) {
       return {
         ...column,
-        // Agregar onAfterChange al objeto de la columna si no existe
-        ...!column.onAfterChange && {
-          onAfterChange: handleForceRefresh
-        }
+        // Agregar onAfterChange al objeto de la columna
+        onAfterChange: handleForceRefresh
       };
     }
     return column;
@@ -30,7 +35,8 @@ function CardDetails({
       (config) => config.key === modifiedColumn.key
     );
     const originalColumn = columns[index];
-    const columnKey = `${originalColumn.key}-${refreshCounter}`;
+    const hasInteractiveFormatter = !!modifiedColumn.onAfterChange;
+    const columnKey = hasInteractiveFormatter ? `${originalColumn.key}-${refreshCounter}` : `${originalColumn.key}`;
     const shouldShowTitle = configColumn?.showTitle !== false;
     return /* @__PURE__ */ jsx(ContainerLabelValueColumnStyled, { children: /* @__PURE__ */ jsxs(
       ContentWrapperColumnStyled,
@@ -66,7 +72,7 @@ function CardDetails({
             }
             if (modifiedColumn.renderCell) {
               const cellContent = modifiedColumn.renderCell({
-                column: originalColumn,
+                column: modifiedColumn,
                 row,
                 rowIdx: index,
                 isCellSelected: false,
@@ -85,7 +91,27 @@ function CardDetails({
               });
               return /* @__PURE__ */ jsx(ValueColumnStyled, { variant: "body", color: "text.primary", children: cellContent });
             }
-            return /* @__PURE__ */ jsx(ValueColumnStyled, { variant: "body", color: "text.primary", children: row[modifiedColumn.key] ?? "-" });
+            const rawValue = row[modifiedColumn.key];
+            const isEmpty = rawValue === null || rawValue === void 0 || rawValue === "";
+            const isEditable = !!modifiedColumn.renderEditCell;
+            if (isEmpty && isEditable) {
+              return /* @__PURE__ */ jsxs(EditablePlaceholderStyled, { children: [
+                /* @__PURE__ */ jsx(ValueColumnStyled, { variant: "body", color: "text.secondary", children: getLabel(DICTIONARY.EDIT_PLACEHOLDER) }),
+                /* @__PURE__ */ jsx(
+                  IconButtonEditStyled,
+                  {
+                    src: `${host_static_assets}/${environment_assets}/${pathIcons.edit}`,
+                    onClick: () => {
+                      setEditingColumnKey(modifiedColumn.key);
+                    },
+                    size: currentSize,
+                    role: "button",
+                    "aria-label": "Editar texto"
+                  }
+                )
+              ] });
+            }
+            return /* @__PURE__ */ jsx(ValueColumnStyled, { variant: "body", color: "text.primary", children: rawValue ?? "-" });
           })()
         ]
       }

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

@@ -2,7 +2,7 @@ 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 { f as CardHeaderStyled, g as CardHeaderLeftStyled, h as CardHeaderRightStyled } from "../../../../slots/DataGridSlot.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";

package/components/DataGrid/subcomponents/Cards/subcomponents/CardRow/index.d.ts

@@ -3,9 +3,9 @@ import { CardRowProps } from '../../types';
 /**
  * Componente que muestra una fila de tarjetas.
  */
-declare function CardRowComponent<TRow, TKey extends RowKey = RowKey>({ row, columns, originalColumns, rowKeyGetter, selectedRows, onSelectedRowsChange, onRowsChange, customRender, minHeight, isChecked, checkedRows, showCheckbox, onCheckedRowsChange, onOpenDetail, }: CardRowProps<TRow, TKey>): import("react/jsx-runtime").JSX.Element;
+declare function CardRowComponent<TRow, TKey extends RowKey = RowKey>({ row, rows, rowIndex, columns, originalColumns, rowKeyGetter, selectedRows, onSelectedRowsChange, onRowsChange, customRender, minHeight, isChecked, checkedRows, showCheckbox, onCheckedRowsChange, onOpenDetail, }: CardRowProps<TRow, TKey>): import("react/jsx-runtime").JSX.Element;
 /**
- *
+ * Componente que muestra CardRow
  */
 export declare const CardRow: typeof CardRowComponent;
 export {};

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

@@ -1,12 +1,14 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import React, { useMemo } from "react";
-import { i as CardContentWrapperStyled, j as CardContentStyled, k as CardStyled } from "../../../../slots/DataGridSlot.js";
+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 { deepEqual } from "fast-equals";
 function CardRowComponent({
   row,
+  rows,
+  rowIndex,
   columns,
   originalColumns,
   rowKeyGetter,
@@ -24,6 +26,8 @@ function CardRowComponent({
   const hasCustomRender = customRender !== void 0;
   const { cardContent } = useCardContent({
     row,
+    rows,
+    rowIndex,
     columns,
     onRowsChange
   });

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

@@ -78,6 +78,14 @@ export interface CardRowProps<TRow, TKey extends RowKey = RowKey> {
      * Fila que se mostrará en la tarjeta
      */
     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 la tarjeta (procesadas, filtradas por visibilidad)
      */

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

@@ -3,7 +3,7 @@ import { forwardRef, useContext } from "react";
 import { SelectCellFormatter } from "react-data-grid";
 import { C as CheckboxFormatter } from "../Table/subcomponents/CheckboxFormatter.js";
 import { a as DataGridContext } from "../../contexts/DataGridContext/index.js";
-import { l as CheckboxCellWrapperStyled } from "../../slots/DataGridSlot.js";
+import { m as CheckboxCellWrapperStyled } from "../../slots/DataGridSlot.js";
 const CheckboxCellAdapter = forwardRef(function CheckboxCellAdapter2(props, ref) {
   const {
     value,

package/components/DataGrid/subcomponents/ControlNavigate/ControlNavigate.js

@@ -1,6 +1,6 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { useIsMobile } from "@m4l/graphics";
-import { m as ControlNavigateStyled } from "../../slots/DataGridSlot.js";
+import { n as ControlNavigateStyled } from "../../slots/DataGridSlot.js";
 import { R as RowsCount } from "../HeaderActions/subcomponents/RowsCount/index.js";
 import { u as useComponentSize } from "../../../../hooks/useComponentSize/useComponentSize.js";
 import { P as Pager } from "../../../Pager/Pager.js";

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

@@ -6,7 +6,7 @@ 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, n as ActionsConfigContainerStyled, o as ContainerLeftActionsStyled, p as ContainerRightActionsStyled } from "../../slots/DataGridSlot.js";
+import { A as ActionsRootStyled, o as ActionsConfigContainerStyled, p as ContainerLeftActionsStyled, q as ContainerRightActionsStyled } from "../../slots/DataGridSlot.js";
 import { u as useComponentSize } from "../../../../hooks/useComponentSize/useComponentSize.js";
 function HeaderActions(props) {
   const {
@@ -29,7 +29,7 @@ function HeaderActions(props) {
   ] }) : /* @__PURE__ */ jsxs(ActionsConfigContainerStyled, { ownerState: { withPager }, children: [
     /* @__PURE__ */ jsxs(ContainerLeftActionsStyled, { children: [
       leftActions,
-      typeof rowHeights !== "number" && /* @__PURE__ */ jsx(Density, {}),
+      typeof rowHeights !== "number" && viewMode !== "cards" && /* @__PURE__ */ jsx(Density, {}),
       withLocalFilters && /* @__PURE__ */ jsx(Filter, {}),
       withSettings && !(viewMode === "cards" && cardsViewConfig?.customRender) && /* @__PURE__ */ jsx(Settings, { ...settingsProps, columns }),
       cardsViewConfig !== void 0 && /* @__PURE__ */ jsx(ViewMode, {})

package/components/DataGrid/subcomponents/HeaderActions/subcomponents/RowsCount/index.js

@@ -2,7 +2,7 @@ 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, q as RowsCountLabelStyled, r as RowsCountValueStyled } from "../../../../slots/DataGridSlot.js";
+import { R as RowsCountRootStyled, r as RowsCountLabelStyled, s as RowsCountValueStyled } from "../../../../slots/DataGridSlot.js";
 function RowsCount() {
   const { rowsCount, size } = useDataGrid();
   const { getLabel } = useModuleDictionary();

package/components/DataGrid/subcomponents/HeaderActions/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 { s as ColumnsConfigWrapperStyled, t as ColumnsConfigDataGridStyled, u as ColumnsConfigSelColumnsStyled, T as TableWrapperDataGridStyled, v as ColumnsConfigActiosStyled } from "../../../../../../slots/DataGridSlot.js";
+import { t as ColumnsConfigWrapperStyled, u as ColumnsConfigDataGridStyled, v as ColumnsConfigSelColumnsStyled, T as TableWrapperDataGridStyled, w as ColumnsConfigActiosStyled } from "../../../../../../slots/DataGridSlot.js";
 import { D as DICTIONARY } from "../../../../../../dictionary.js";
 import { C as ColumnInteractiveCheckFormatter } from "../../../../../../formatters/ColumnInteractiveCheckFormatter/formatter.js";
 function getRowsFromColumnsConfig(columnsConfig, columns) {

package/components/DataGrid/subcomponents/HeaderActions/subcomponents/Settings/subcomponents/ColumnsConfigCards/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 { s as ColumnsConfigWrapperStyled, t as ColumnsConfigDataGridStyled, u as ColumnsConfigSelColumnsStyled, T as TableWrapperDataGridStyled, v as ColumnsConfigActiosStyled } from "../../../../../../slots/DataGridSlot.js";
+import { t as ColumnsConfigWrapperStyled, u as ColumnsConfigDataGridStyled, v as ColumnsConfigSelColumnsStyled, T as TableWrapperDataGridStyled, w as ColumnsConfigActiosStyled } from "../../../../../../slots/DataGridSlot.js";
 import { D as DICTIONARY } from "../../../../../../dictionary.js";
 import { C as ColumnInteractiveCheckFormatter } from "../../../../../../formatters/ColumnInteractiveCheckFormatter/formatter.js";
 function getRowsFromColumnsConfigCards(columnsConfigCards, columns) {

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

@@ -6,7 +6,7 @@ import { I as IconButton } from "../../../../../mui_extended/IconButton/IconButt
 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 { w as ContainerToggleCardsStyled, x as CardToggleButtonStyled, y as TextToggleCardButtonStyled } from "../../../../slots/DataGridSlot.js";
+import { x as ContainerToggleCardsStyled, y as CardToggleButtonStyled, z as TextToggleCardButtonStyled } from "../../../../slots/DataGridSlot.js";
 import { I as Icon } from "../../../../../Icon/Icon.js";
 function ViewMode() {
   const { host_static_assets, environment_assets } = useEnvironment();

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

@@ -8,7 +8,7 @@ import { a 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 { z as TableContainerStyled, T as TableWrapperDataGridStyled } from "../../slots/DataGridSlot.js";
+import { B as TableContainerStyled, T as TableWrapperDataGridStyled } from "../../slots/DataGridSlot.js";
 import { u as useHeaderMenuActions } from "./hooks/useHeaderMenuActions.js";
 import { H as HeaderRenderClick } from "./subcomponents/HeaderRenderClick/HeaderRenderClick.js";
 function Table(props) {

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

@@ -12,6 +12,7 @@ const CheckboxFormatter = forwardRef(function CheckboxFormatter2({ onChange, che
       checked,
       size: "small",
       icon: /* @__PURE__ */ jsx(CheckboxIcon, {}),
+      disableRipple: true,
       checkedIcon: /* @__PURE__ */ jsx(CheckboxCheckedIcon, {}),
       indeterminateIcon: /* @__PURE__ */ jsx(CheckboxIndeterminateIcon, {}),
       onChange: handleChange,

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

@@ -1,22 +1,47 @@
-import { jsx, jsxs } from "react/jsx-runtime";
-import { SvgIcon } from "@mui/material";
+import { jsx } from "react/jsx-runtime";
+import { useEnvironment } from "@m4l/core";
+import "@mui/material";
+import { I as Icon } from "../../../../Icon/Icon.js";
 function CheckboxIcon(props) {
-  return /* @__PURE__ */ jsx(SvgIcon, { ...props, viewBox: "0 0 16 17", className: "checkbox-unChecked", children: /* @__PURE__ */ jsxs("svg", { width: "16", height: "17", viewBox: "0 0 16 17", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
-    /* @__PURE__ */ jsx("g", { "clip-path": "url(#clip0_13395_49048)", children: /* @__PURE__ */ jsx("path", { d: "M13.0156 2.5H3.01562C2.75041 2.5 2.49605 2.60536 2.30852 2.79289C2.12098 2.98043 2.01563 3.23478 2.01562 3.5V13.5C2.01563 13.7652 2.12098 14.0196 2.30852 14.2071C2.49605 14.3946 2.75041 14.5 3.01562 14.5H13.0156C13.2808 14.5 13.5352 14.3946 13.7227 14.2071C13.9103 14.0196 14.0156 13.7652 14.0156 13.5V3.5C14.0156 3.23478 13.9103 2.98043 13.7227 2.79289C13.5352 2.60536 13.2808 2.5 13.0156 2.5ZM3.01562 13.5V3.5H13.0156V13.5H3.01562Z", fill: "#323B3B" }) }),
-    /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsx("clipPath", { id: "clip0_13395_49048", children: /* @__PURE__ */ jsx("rect", { width: "16", height: "16", fill: "white", transform: "translate(0 0.5)" }) }) })
-  ] }) });
+  const { host_static_assets, environment_assets } = useEnvironment();
+  const uncheckedIconUrl = `${host_static_assets}/${environment_assets}/frontend/components/check_box/assets/icons/unchecked.svg`;
+  return /* @__PURE__ */ jsx(
+    Icon,
+    {
+      src: uncheckedIconUrl,
+      size: "small",
+      color: "text.primary",
+      className: "checkbox-unChecked",
+      ...props
+    }
+  );
 }
 function CheckboxCheckedIcon(props) {
-  return /* @__PURE__ */ jsxs(SvgIcon, { ...props, viewBox: "0 0 16 17", className: "checkbox-checked", children: [
-    /* @__PURE__ */ jsxs("g", { "clip-path": "url(#clip0_13395_49057)", children: [
-      /* @__PURE__ */ jsx("path", { d: "M13.4323 2H2.59896C2.31164 2 2.03609 2.11414 1.83293 2.3173C1.62976 2.52047 1.51563 2.79602 1.51562 3.08333V13.9167C1.51563 14.204 1.62976 14.4795 1.83293 14.6827C2.03609 14.8859 2.31164 15 2.59896 15H13.4323C13.7196 15 13.9952 14.8859 14.1983 14.6827C14.4015 14.4795 14.5156 14.204 14.5156 13.9167V3.08333C14.5156 2.79602 14.4015 2.52047 14.1983 2.3173C13.9952 2.11414 13.7196 2 13.4323 2Z", fill: "#323B3B" }),
-      /* @__PURE__ */ jsx("path", { d: "M6.92119 11.6245L4.10001 8.8274L4.99759 7.95696L6.92119 9.84467L11.1014 5.70001L11.9996 6.58993L6.92119 11.6245Z", fill: "#F3F5F7" })
-    ] }),
-    /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsx("clipPath", { id: "clip0_13395_49057", children: /* @__PURE__ */ jsx("rect", { width: "16", height: "16", fill: "white", transform: "translate(0 0.5)" }) }) })
-  ] });
+  const { host_static_assets, environment_assets } = useEnvironment();
+  const checkedIconUrl = `${host_static_assets}/${environment_assets}/frontend/components/check_box/assets/icons/checked.svg`;
+  return /* @__PURE__ */ jsx(
+    Icon,
+    {
+      src: checkedIconUrl,
+      size: "small",
+      color: "primary.enabled",
+      className: "checkbox-checked",
+      ...props
+    }
+  );
 }
 function CheckboxIndeterminateIcon(props) {
-  return /* @__PURE__ */ jsx(SvgIcon, { ...props, children: /* @__PURE__ */ jsx("path", { d: "M17 3a4 4 0 014 4v10a4 4 0 01-4 4H7a4 4 0 01-4-4V7a4 4 0 014-4h10zm-1.75 8h-6.5a.75.75 0 00-.75.75v.5c0 .414.336.75.75.75h6.5a.75.75 0 00.75-.75v-.5a.75.75 0 00-.75-.75z" }) });
+  const { host_static_assets, environment_assets } = useEnvironment();
+  const indeterminateIconUrl = `${host_static_assets}/${environment_assets}/frontend/components/check_box/assets/icons/indeterminate.svg`;
+  return /* @__PURE__ */ jsx(
+    Icon,
+    {
+      src: indeterminateIconUrl,
+      size: "small",
+      color: "primary.enabled",
+      ...props
+    }
+  );
 }
 export {
   CheckboxIndeterminateIcon as C,

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

@@ -5,7 +5,7 @@ import { useDrag, useDrop } from "react-dnd";
 import { renderHeaderCell } from "react-data-grid";
 import { u as useFocusRef } from "../hooks/useFocusRef.js";
 import { u as useFilters } from "../../../hooks/useFilters.js";
-import { N as NameColumnIconStyled, B as NameColumnStyled, I as IconColumnStyled, F as DraggableHeaderRootStyled, G as ButtonHeaderActionsStyled, H as DraggableWrapperInputBaseStyled, J as IconSearchStyled, K as HeaderInputBaseStyled } from "../../../slots/DataGridSlot.js";
+import { N as NameColumnIconStyled, F as NameColumnStyled, G as IconColumnStyled, H as DraggableHeaderRootStyled, J as ButtonHeaderActionsStyled, K as DraggableWrapperInputBaseStyled, M as IconSearchStyled, O as HeaderInputBaseStyled } from "../../../slots/DataGridSlot.js";
 import { p as pathIcons } from "../../../icons.js";
 import { u as useDataGrid } from "../../../hooks/useDataGrid.js";
 import { I as Icon } from "../../../../Icon/Icon.js";

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

@@ -2,7 +2,7 @@ import { jsx } from "react/jsx-runtime";
 import { useState, useMemo, useEffect, useCallback } from "react";
 import { useModuleDictionary } from "@m4l/core";
 import { M as MenuItem } from "../../../../../mui_extended/MenuItem/MenuItem.js";
-import { M as MenuListStyled, O as HeaderRenderClickStyled } from "../../../../slots/DataGridSlot.js";
+import { P as MenuListStyled, Q as HeaderRenderClickStyled } from "../../../../slots/DataGridSlot.js";
 import { M as MenuDivider } from "../../../../../mui_extended/MenuDivider/MenuDivider.js";
 import { P as Popover } from "../../../../../mui_extended/Popover/Popover.js";
 import { D as DICTIONARY } from "../../../../dictionary.js";

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

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

package/components/DataGrid/tests/helpers/generators.d.ts

@@ -0,0 +1,26 @@
+/**
+ * Generadores de datos aleatorios para el DataGrid
+ */
+/**
+ * Función para generar un estado aleatorio
+ */
+export declare const getStatus: (index: number) => string;
+/**
+ * Función para generar un tipo de usuario aleatorio
+ */
+export declare const getUserType: (index: number) => "superadmin" | "admin" | "user";
+/**
+ * Función para obtener código de carácter desde el índice
+ */
+export declare const getCharCode: (index: number) => string;
+/**
+ * Función para generar un color aleatorio en formato hexadecimal
+ */
+export declare const getRandomColor: (index: number) => string;
+/**
+ * Función para generar tags aleatorios
+ */
+export declare const getTags: (index: number) => {
+    label: string;
+    backgroundColor: string;
+}[];

package/components/DataGrid/tests/helpers/types.d.ts

@@ -28,6 +28,7 @@ export interface SeedProps {
     aligns?: Record<string, ColumnAlign>;
     names?: Record<string, string>;
     visibleColumns?: string[];
+    withColor?: boolean;
 }
 export type GetColumnsProps = Omit<SeedProps, 'quantity'>;
 export type ColumnType = 'string' | 'number' | 'boolean' | 'date' | 'custom';
@@ -67,6 +68,7 @@ export interface RowType {
         label: string;
         currentStatus: 'superadmin' | 'admin' | 'user';
     };
+    color?: string;
 }
 interface RangesUncertainty {
     cmcMin: number;

package/components/DataGrid/types.d.ts

@@ -252,6 +252,14 @@ export interface CardContentProps<TRow> {
     columns: readonly Column<TRow, any>[];
     originalColumns: readonly Column<TRow, any>[];
     onRowsChange?: Maybe<(rows: TRow[], data: RowsChangeData<TRow, any>) => void>;
+    /**
+     * 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;
 }
 /**
  * Configuración de densidad para el DataGrid.

package/components/DynamicFilter/subcomponents/DynamicFilterBase/DynamicFilterBase.js

@@ -1,5 +1,5 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import { g as getPropDataTestId } from "../../../../test/getNameDataTestId.js";
+import { a as getPropDataTestId } from "../../../../test/getNameDataTestId.js";
 import { a as getComponentSlotRoot } from "../../../../utils/getComponentSlotRoot.js";
 import { D as DYNAMIC_FILTER_KEY_COMPONENT } from "../../constants.js";
 import { u as useDynamicFilterBase } from "./useDynamicFilterBase.js";

package/components/DynamicSort/subcomponents/AppliedSorts/AppliedSorts.js

@@ -1,5 +1,5 @@
 import { jsx } from "react/jsx-runtime";
-import { g as getPropDataTestId } from "../../../../test/getNameDataTestId.js";
+import { a as getPropDataTestId } from "../../../../test/getNameDataTestId.js";
 import { D as DYNAMIC_SORT_KEY_COMPONENT } from "../../constants.js";
 import { D as DynamicSortSlots } from "../../slots/SlotsEnum.js";
 import { u as useDynamicSortBase } from "../DynamicSortBase/useDynamicSortBase.js";

package/components/DynamicSort/subcomponents/DynamicSortBase/DynamicSortBase.js

@@ -1,5 +1,5 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import { g as getPropDataTestId } from "../../../../test/getNameDataTestId.js";
+import { a as getPropDataTestId } from "../../../../test/getNameDataTestId.js";
 import { a as getComponentSlotRoot } from "../../../../utils/getComponentSlotRoot.js";
 import { D as DYNAMIC_SORT_KEY_COMPONENT } from "../../constants.js";
 import { u as useDynamicSortBase } from "./useDynamicSortBase.js";

package/components/Icon/Icon.js

@@ -1,7 +1,7 @@
 import { jsxs, Fragment, jsx } from "react/jsx-runtime";
 import { useModuleSkeleton } from "@m4l/core";
 import clsx from "clsx";
-import { g as getPropDataTestId } from "../../test/getNameDataTestId.js";
+import { a as getPropDataTestId } from "../../test/getNameDataTestId.js";
 import { I as ICON_PREFIX, a as ICON_KEY_COMPONENT } from "./constants.js";
 import { g as getComponentClasses, a as getComponentSlotRoot } from "../../utils/getComponentSlotRoot.js";
 import { u as useComponentSize } from "../../hooks/useComponentSize/useComponentSize.js";

package/components/Image/Image.js

@@ -4,7 +4,7 @@ import { useModuleSkeleton } from "@m4l/core";
 import clsx from "clsx";
 import { L as LazyLoadComponent } from "./subcomponents/LazyLoadComponent/index.js";
 import { D as DivContainerSkeletonStyled, I as ImgSkeleton, a as ImgStyled } from "./slots/ImageSlots.js";
-import { g as getPropDataTestId } from "../../test/getNameDataTestId.js";
+import { a as getPropDataTestId } from "../../test/getNameDataTestId.js";
 import { s as svgDataUriSkeleton, I as IMAGE_CLASSES, a as IMAGE_KEY_COMPONENT } from "./constant.js";
 import { I as ImageSlots } from "./slots/ImageEnum.js";
 function Image(props) {

package/components/Image/subcomponents/IntersectComponent/index.js

@@ -1,7 +1,7 @@
 import { jsx } from "react/jsx-runtime";
 import { forwardRef, useState, useRef, useImperativeHandle, useEffect } from "react";
 import { b as IntersectComponentStyled } from "../../slots/ImageSlots.js";
-import { g as getPropDataTestId } from "../../../../test/getNameDataTestId.js";
+import { a as getPropDataTestId } from "../../../../test/getNameDataTestId.js";
 import { a as IMAGE_KEY_COMPONENT } from "../../constant.js";
 import { I as ImageSlots } from "../../slots/ImageEnum.js";
 const checkIntersections = (entries) => {

package/components/ImageText/ImageText.js

@@ -4,7 +4,7 @@ import { I as ImageTextContainerRoot, a as ImageContainerStyled, b as ImgStyled,
 import { I as IMG_ALT, a as IMAGE_TEXT_CLASSES, b as IMAGE_TEXT_KEY_COMPONENT } from "./constants.js";
 import { clsx } from "clsx";
 import { useRef } from "react";
-import { g as getPropDataTestId } from "../../test/getNameDataTestId.js";
+import { a as getPropDataTestId } from "../../test/getNameDataTestId.js";
 import { u as useIsVisible } from "../../hooks/useIsVisible/useIsVisible.js";
 import { u as useComponentSize } from "../../hooks/useComponentSize/useComponentSize.js";
 const ImageText = (props) => {

package/components/LanguagePopover/LanguagePopover.js

@@ -2,7 +2,7 @@ import { jsx } from "react/jsx-runtime";
 import { useState, useEffect } from "react";
 import { useFirstRender, useLocales } from "@m4l/graphics";
 import { useEnvironment, useNetwork } from "@m4l/core";
-import { g as getPropDataTestId } from "../../test/getNameDataTestId.js";
+import { a as getPropDataTestId } from "../../test/getNameDataTestId.js";
 import { a as getComponentSlotRoot } from "../../utils/getComponentSlotRoot.js";
 import { I as Image } from "../Image/Image.js";
 import { L as LanguagePopoverRootStyled, P as PaperStyled } from "./slots/LanguagePopoverSlots.js";

package/components/LinearProgressIndeterminate/LinearProgressIndeterminate.js

@@ -1,5 +1,5 @@
 import { jsx } from "react/jsx-runtime";
-import { g as getPropDataTestId } from "../../test/getNameDataTestId.js";
+import { a as getPropDataTestId } from "../../test/getNameDataTestId.js";
 import clsx from "clsx";
 import { a as getComponentSlotRoot } from "../../utils/getComponentSlotRoot.js";
 import { L as LINEAR_PROGRESS_INDETERMINATE_KEY_COMPONENT } from "./constants.js";

package/components/LoadingError/LoadingError.js

@@ -2,7 +2,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { useEnvironment, useModuleDictionary } from "@m4l/core";
 import { L as LoadingErrorRootStyled, a as LoadingErrorStyled, b as LinearProgressIndeterminateStyled, c as LoadingErrorContainerStyled, d as LoadingErrorContentStyled, e as LoadingErrorImageStyled, f as LoadingErrorTextContainerStyled, g as LoadingErrorTitleDescriptionStyled, h as LoadingErrorDividerStyled, i as LoadingErrorButtonContainerStyled, j as LoadingErrorRecommendationTextStyled } from "./slots/LoadingErrorSlots.js";
 import { a as getComponentSlotRoot } from "../../utils/getComponentSlotRoot.js";
-import { g as getPropDataTestId } from "../../test/getNameDataTestId.js";
+import { a as getPropDataTestId } from "../../test/getNameDataTestId.js";
 import { L as LOADING_ERROR_KEY_COMPONENT } from "./constants.js";
 import clsx from "clsx";
 import { d as dictionary } from "./dictionary.js";

package/components/NumberInput/NumberInput.js

@@ -3,7 +3,7 @@ import clsx from "clsx";
 import { forwardRef } from "react";
 import { useEnvironment, useModuleSkeleton } from "@m4l/core";
 import { g as getComponentClasses } from "../../utils/getComponentSlotRoot.js";
-import { g as getPropDataTestId } from "../../test/getNameDataTestId.js";
+import { a as getPropDataTestId } from "../../test/getNameDataTestId.js";
 import { u as useNumberInput } from "./hooks/useNumberInput/useNumberInput.js";
 import { S as SkeletonStyled, R as RootStyled, I as InputStyled, C as ContainButtonsAdornmentStyled, a as ContainerButtonsStyled, b as IncrementButtonStyled, D as DecrementButtonStyled } from "./slots/NumberInputSlots.js";
 import { N as NUMBER_INPUT_KEY_COMPONENT } from "./constants.js";

package/components/ObjectLogs/subcomponents/ObjectLogsByM4L/ObjectLogsByM4L.js

@@ -6,7 +6,7 @@ import { C as ContainerWrapperStyled, G as GridWrapperStyled } from "../../slots
 import { usePaginate } from "@m4l/graphics";
 import { u as useObjectLogsColumns } from "../../hooks/useObjectLogsColumns.js";
 import { a as OBJECT_LOGS_M4L_END_POINT, O as OBJECT_LOGS_KEY_COMPONENT } from "../../constants.js";
-import { g as getPropDataTestId } from "../../../../test/getNameDataTestId.js";
+import { a as getPropDataTestId } from "../../../../test/getNameDataTestId.js";
 import { u as useFilterAndSort } from "../../hooks/useFilterAndSort.js";
 import { O as ObjectLogsSlots } from "../../slots/ObjectLogsEnum.js";
 function ObjectLogsByM4L(props) {

package/components/ObjectLogs/subcomponents/ObjectLogsByOthers/ObjectLogsByOthers.js

@@ -6,7 +6,7 @@ import { C as ContainerWrapperStyled, G as GridWrapperStyled } from "../../slots
 import { useRows } from "@m4l/graphics";
 import { u as useObjectLogsColumns } from "../../hooks/useObjectLogsColumns.js";
 import { b as OBJECT_LOGS_OTHERS_END_POINT, O as OBJECT_LOGS_KEY_COMPONENT } from "../../constants.js";
-import { g as getPropDataTestId } from "../../../../test/getNameDataTestId.js";
+import { a as getPropDataTestId } from "../../../../test/getNameDataTestId.js";
 import { u as useFilterAndSort } from "../../hooks/useFilterAndSort.js";
 import { O as ObjectLogsSlots } from "../../slots/ObjectLogsEnum.js";
 function ObjectLogsByOthers(props) {

package/components/PDFViewer/PDFViewer.js

@@ -1,6 +1,6 @@
 import { jsx } from "react/jsx-runtime";
 import { a as getComponentSlotRoot } from "../../utils/getComponentSlotRoot.js";
-import { g as getPropDataTestId } from "../../test/getNameDataTestId.js";
+import { a as getPropDataTestId } from "../../test/getNameDataTestId.js";
 import { P as PDFViewerRootStyled, a as PreviewPDFStyled } from "./slots/PDFViewerSlots.js";
 import { P as PDFViewerSlots } from "./slots/PDFViewerEnum.js";
 import { P as PDF_VIEWER_KEY_COMPONENT } from "./constants.js";

package/components/PrintingSystem/PrintingSystem.js

@@ -7,7 +7,7 @@ import { P as PrintingSystemRootStyled } from "./slots/PrintingSystemSlots.js";
 import { a as getComponentSlotRoot } from "../../utils/getComponentSlotRoot.js";
 import { P as PRINTING_SYSTEM_KEY_COMPONENT } from "./constants.js";
 import { P as PrintingSystemSlots } from "./slots/PrintingSystemEnum.js";
-import { g as getPropDataTestId } from "../../test/getNameDataTestId.js";
+import { a as getPropDataTestId } from "../../test/getNameDataTestId.js";
 import clsx from "clsx";
 const PrintingSystem = forwardRef((props, ref) => {
   const { templateData: nodeRoot, sourceData, size = "medium", variant = "body", className, dataTestId } = props;

package/components/PropertyValue/PropertyValue.js

@@ -3,7 +3,7 @@ import React, { useId } from "react";
 import clsx from "clsx";
 import { T as TEST_PROP_ID } from "../../test/constants_no_mock.js";
 import { T as TEST_PROPS_DATA, C as COMPONENT_PREFIX, P as PROPERTY_VALUE_KEY_COMPONENT } from "./constants.js";
-import { a as getNameDataTestId, g as getPropDataTestId } from "../../test/getNameDataTestId.js";
+import { g as getNameDataTestId, a as getPropDataTestId } from "../../test/getNameDataTestId.js";
 import { P as PropertyValueRootStyled, N as NameStyled, V as ValueStyled } from "./slots/PropertyValueSlots.js";
 import { a as getComponentSlotRoot } from "../../utils/getComponentSlotRoot.js";
 import { u as useComponentSize } from "../../hooks/useComponentSize/useComponentSize.js";

package/components/ToastContainer/ToastContainer.js

@@ -1,7 +1,7 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { ToastContainer as ToastContainer$1 } from "react-toastify";
 import { D as DEFAULT_CLOSE_TIME, T as TOAST_KEY_COMPONENT } from "./constants.js";
-import { g as getPropDataTestId } from "../../test/getNameDataTestId.js";
+import { a as getPropDataTestId } from "../../test/getNameDataTestId.js";
 import { ModuleSkeletonProvider } from "@m4l/core";
 import { R as RootStyled } from "./slots/toastContainerSlots.js";
 import { T as ToastContainerSlots } from "./slots/ToastContainerEnum.js";

package/components/WindowBase/WindowBase.js

@@ -1,7 +1,7 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { u as useComponentSize } from "../../hooks/useComponentSize/useComponentSize.js";
 import { A as AppearanceComponentProvider } from "../../contexts/AppearanceComponentContext/AppearanceComponentContext.js";
-import { g as getPropDataTestId } from "../../test/getNameDataTestId.js";
+import { a as getPropDataTestId } from "../../test/getNameDataTestId.js";
 import { W as WINDOW_BASE_KEY_COMPONENT } from "./constants.js";
 import { a as getComponentSlotRoot } from "../../utils/getComponentSlotRoot.js";
 import clsx from "clsx";

package/components/WindowConfirm/WindowConfirm.js

@@ -2,7 +2,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { u as useModal } from "../../hooks/useModal/index.js";
 import { useModuleDictionary, useEnvironment } from "@m4l/core";
 import { A as AppearanceComponentProvider } from "../../contexts/AppearanceComponentContext/AppearanceComponentContext.js";
-import { g as getPropDataTestId } from "../../test/getNameDataTestId.js";
+import { a as getPropDataTestId } from "../../test/getNameDataTestId.js";
 import { W as WINDOW_CONFIRM_KEY_COMPONENT } from "./constants.js";
 import { a as getComponentSlotRoot } from "../../utils/getComponentSlotRoot.js";
 import clsx from "clsx";

package/components/areas/components/AreasAdmin/AreasAdmin.js

@@ -12,7 +12,7 @@ import { A as AreasAdminRootStyled, a as AreasAdminContentStyled, b as AreasCont
 import { useIsMobile } from "@m4l/graphics";
 import { A as AREAS_ADMIN_KEY_COMPONENT } from "./constants.js";
 import { a as getComponentSlotRoot } from "../../../../utils/getComponentSlotRoot.js";
-import { g as getPropDataTestId } from "../../../../test/getNameDataTestId.js";
+import { a as getPropDataTestId } from "../../../../test/getNameDataTestId.js";
 import { u as useComponentSize } from "../../../../hooks/useComponentSize/useComponentSize.js";
 import { T as Typography } from "../../../mui_extended/Typography/Typography.js";
 import { M as MenuActions } from "../../../MenuActions/MenuActions.js";