@m4l/components 9.2.5 → 9.2.6

package/@types/types.d.ts

@@ -144,6 +144,7 @@ import { AreasViewerOwnerState, AreasViewerType } from '../components/areas/comp
 import { TimePickerOwnerState,TimePickerSlotsType } from '../components/mui_extended/TimePicker/types';
 import { DataGridOwnerState, DataGridSlotsType } from '../components/DataGrid/types';
 import { DynamicFilterAndSortOwnerState, DynamicFilterAndSortSlotsType } from '../hooks/useDynamicFilterAndSort/types';
+import { ChipStatusFormatterSlotsType } from '../components/formatters/ChipStatusFormatter/types';
 
 declare module '@mui/material/styles' {
   // Define the slots in the theme
@@ -217,6 +218,7 @@ declare module '@mui/material/styles' {
     M4LTimePicker: TimePickerSlotsType
     M4LDataGrid: DataGridSlotsType;
     M4LDynamicFilterAndSort: DynamicFilterAndSortSlotsType;
+    M4LChipStatusFormatter: ChipStatusFormatterSlotsType;
   }
   interface ComponentsPropsList {
     // Extend ComponentsProps or ComponentsOwnerState(this extend ComponentProps)
@@ -289,6 +291,7 @@ declare module '@mui/material/styles' {
     M4LTimePicker: Partial<TimePickerOwnerState>;
     M4LDataGrid: Partial<DataGridOwnerState>;
     M4LDynamicFilterAndSort: Partial<DynamicFilterAndSortOwnerState>;
+    M4LChipStatusFormatter: Partial<ChipStatusFormatterOwnerState>;
   }
   interface Components {
     M4LDynamicFilter?: {
@@ -646,5 +649,10 @@ declare module '@mui/material/styles' {
       styleOverrides?: ComponentsOverrides<Theme>['M4LDynamicFilterAndSort'];
       variants?: ComponentsVariants['M4LDynamicFilterAndSort'];
     };
+    M4LChipStatusFormatter?: {
+      defaultProps?: ComponentsPropsList['M4LChipStatusFormatter'];
+      styleOverrides?: ComponentsOverrides<Theme>['M4LChipStatusFormatter'];
+      variants?: ComponentsVariants['M4LChipStatusFormatter'];
+    };
    }
 }

package/components/DataGrid/formatters/ColumnBooleanFormatter/types.d.ts

@@ -3,4 +3,5 @@ export interface ColumnBooleanFormatterProps {
     Component?: React.ElementType;
     presentationType: PresentationType;
     fieldValue: string;
+    opacity?: boolean;
 }

package/components/DataGrid/formatters/ColumnChipStatusFormatter/ColumnChipStatusFormatter.d.ts

@@ -0,0 +1,7 @@
+import { ColumnChipStatusFormatterProps } from './types';
+/**
+ * Formatter para mostrar un chip de estado en una columna de un DataGrid
+ * @param props - Propiedades del formatter
+ * @returns Componente ChipStatusFormatter
+ */
+export declare const ColumnChipStatusFormatter: (props: ColumnChipStatusFormatterProps<any>) => (obProps: any) => import("react/jsx-runtime").JSX.Element;

package/components/DataGrid/formatters/ColumnChipStatusFormatter/ColumnChipStatusFormatter.js

@@ -0,0 +1,24 @@
+import { jsx } from "react/jsx-runtime";
+import { getPropertyByString } from "@m4l/core";
+import { C as ChipStatusFormatter } from "../../../formatters/ChipStatusFormatter/ChipStatusFormatter.js";
+const ColumnChipStatusFormatter = (props) => {
+  const { uriStatus, uriLabel, component, statusesColors, fallbackColor, opacity } = props;
+  return (obProps) => {
+    const label = typeof uriLabel === "string" ? getPropertyByString(obProps, uriStatus.toString()) : uriLabel(obProps, uriStatus);
+    const status = getPropertyByString(obProps, uriStatus.toString());
+    return /* @__PURE__ */ jsx(
+      ChipStatusFormatter,
+      {
+        label,
+        status,
+        statusesColors,
+        Component: component,
+        fallbackColor,
+        opacity
+      }
+    );
+  };
+};
+export {
+  ColumnChipStatusFormatter as C
+};

package/components/DataGrid/formatters/ColumnChipStatusFormatter/index.d.ts

@@ -0,0 +1,3 @@
+export { ColumnChipStatusFormatter } from './ColumnChipStatusFormatter';
+export { useColumnChipStatus as useColumnChipStatusFormatter } from './useColumnChipStatusFormatter';
+export type { ColumnChipStatusFormatterProps } from './types';

package/components/DataGrid/formatters/ColumnChipStatusFormatter/types.d.ts

@@ -0,0 +1,6 @@
+import { ChipStatusKey, ChipStatusFormatterProps } from '../../../formatters/ChipStatusFormatter/types';
+export interface ColumnChipStatusFormatterProps<Row> extends Pick<ChipStatusFormatterProps, 'statusesColors' | 'fallbackColor' | 'opacity'> {
+    uriStatus: string | number;
+    uriLabel: string | ((row: Row, status: ChipStatusKey) => string);
+    component?: React.ElementType;
+}

package/components/DataGrid/formatters/ColumnChipStatusFormatter/useColumnChipStatusFormatter.d.ts

@@ -0,0 +1,9 @@
+import { ColumnChipStatusFormatterProps } from './types';
+/**
+ * Funcion helper que retorna el formatter, filter y customSort de la columna concatenada.
+ */
+export declare const useColumnChipStatus: <TRow>(props: ColumnChipStatusFormatterProps<TRow>) => {
+    formatter: (obProps: any) => import("react/jsx-runtime").JSX.Element;
+    customFilter: (row: TRow, value: string | number) => boolean;
+    customSort: (a: TRow, b: TRow) => 0 | 1 | -1;
+};

package/components/DataGrid/formatters/ColumnChipStatusFormatter/useColumnChipStatusFormatter.js

@@ -0,0 +1,27 @@
+import { getPropertyByString } from "@m4l/core";
+import { C as ColumnChipStatusFormatter } from "./ColumnChipStatusFormatter.js";
+import { g as getColumnKey } from "../../helpers/getColumnKey.js";
+const getCustomChipStatusFilter = (props) => {
+  const { uriLabel } = props;
+  return (row, value) => {
+    const valueMaybeString = typeof uriLabel === "string" ? getPropertyByString(row, getColumnKey(uriLabel)) : uriLabel(row, props.uriStatus);
+    return valueMaybeString.includes(value.toString());
+  };
+};
+const getCustomChipStatusSort = (props) => {
+  return (a, b) => {
+    const valueA = typeof props.uriLabel === "string" ? getPropertyByString(a, getColumnKey(props.uriLabel)) : props.uriLabel(a, props.uriStatus);
+    const valueB = typeof props.uriLabel === "string" ? getPropertyByString(b, getColumnKey(props.uriLabel)) : props.uriLabel(b, props.uriStatus);
+    return valueA > valueB ? 1 : valueA < valueB ? -1 : 0;
+  };
+};
+const useColumnChipStatus = (props) => {
+  return {
+    formatter: ColumnChipStatusFormatter(props),
+    customFilter: getCustomChipStatusFilter(props),
+    customSort: getCustomChipStatusSort(props)
+  };
+};
+export {
+  useColumnChipStatus as u
+};

package/components/DataGrid/formatters/index.d.ts

@@ -10,6 +10,7 @@ export { ColumnSetCheckFormatter } from './ColumnSetCheckFormatter';
 export type { ColumnUncertaintyFormatterProps } from './ColumnUncertaintyFormatter/types';
 export { ColumnIconFormatter } from './ColumnIconFormatter';
 export { useColumnBoolean } from './ColumnBooleanFormatter/useColumnBoolean';
+export { useColumnChipStatus as useColumnChipStatusFormatter } from './ColumnChipStatusFormatter/useColumnChipStatusFormatter';
 export { useColumnConcatenatedValue } from './ColumnConcatenatedValueFormatter/useColumnConcatenatedValue';
 export { useColumnDate } from './ColumnDateFormatter/useColumnDate';
 export { useColumnNestedValue } from './ColumnNestedValueFormatter/useColumnNestedValue';

package/components/formatters/ChipStatusFormatter/ChipStatusFormatter.d.ts

@@ -0,0 +1,5 @@
+import { ChipStatusFormatterProps } from './types';
+/**
+ * Formatter para mostrar un chip en función del estado determinado por el status
+ */
+export declare const ChipStatusFormatter: (props: ChipStatusFormatterProps) => import("react/jsx-runtime").JSX.Element;

package/components/formatters/ChipStatusFormatter/ChipStatusFormatter.js

@@ -0,0 +1,37 @@
+import { jsx } from "react/jsx-runtime";
+import React from "react";
+import clsx from "clsx";
+import { C as ChipStatusFormatterRootStyled } from "./slots/ChipStatusFormatterSlots.js";
+import { C as CHIP_STATUS_FORMATTER_CLASSES } from "./constants.js";
+import { u as useComponentSize } from "../../../hooks/useComponentSize/useComponentSize.js";
+const ChipStatusFormatter = (props) => {
+  const {
+    label,
+    status,
+    className,
+    statusesColors,
+    Component = React.Fragment,
+    fallbackColor,
+    opacity = false,
+    size = "medium",
+    dataTestid
+  } = props;
+  const color = statusesColors[status ? status : fallbackColor];
+  const { currentSize } = useComponentSize(size);
+  const adjustedSize = currentSize === "small" || currentSize === "medium" ? currentSize : "medium";
+  return /* @__PURE__ */ jsx(Component, { children: /* @__PURE__ */ jsx(
+    ChipStatusFormatterRootStyled,
+    {
+      className: clsx(className, CHIP_STATUS_FORMATTER_CLASSES.root),
+      ownerState: {},
+      label,
+      color,
+      opacity,
+      size: adjustedSize,
+      dataTestid
+    }
+  ) });
+};
+export {
+  ChipStatusFormatter as C
+};

package/components/formatters/ChipStatusFormatter/ChipStatusFormatter.styles.d.ts

@@ -0,0 +1,2 @@
+import { ChipStatusFormatterStyles } from './types';
+export declare const chipStatusFormatterStyles: ChipStatusFormatterStyles;

package/components/formatters/ChipStatusFormatter/ChipStatusFormatter.styles.js

@@ -0,0 +1,6 @@
+const chipStatusFormatterStyles = {
+  root: {}
+};
+export {
+  chipStatusFormatterStyles as c
+};

package/components/formatters/ChipStatusFormatter/constants.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Clave del componente ChipStatusFormatter
+ */
+export declare const CHIP_STATUS_FORMATTER_KEY_COMPONENT = "M4LChipStatusFormatter";
+export declare const CHIP_STATUS_FORMATTER_CLASSES: Record<string, string>;

package/components/formatters/ChipStatusFormatter/constants.js

@@ -0,0 +1,8 @@
+import { g as getComponentClasses } from "../../../utils/getComponentSlotRoot.js";
+import { C as ChipStatusFormatterSlots } from "./slots/ChipStatusFormatterEnum.js";
+const CHIP_STATUS_FORMATTER_KEY_COMPONENT = "M4LChipStatusFormatter";
+const CHIP_STATUS_FORMATTER_CLASSES = getComponentClasses(CHIP_STATUS_FORMATTER_KEY_COMPONENT, ChipStatusFormatterSlots);
+export {
+  CHIP_STATUS_FORMATTER_CLASSES as C,
+  CHIP_STATUS_FORMATTER_KEY_COMPONENT as a
+};

package/components/formatters/ChipStatusFormatter/index.d.ts

@@ -0,0 +1,2 @@
+export { ChipStatusFormatter } from './ChipStatusFormatter';
+export type { ChipStatusFormatterProps } from './types';

package/components/formatters/ChipStatusFormatter/index.js

@@ -0,0 +1 @@
+

package/components/formatters/ChipStatusFormatter/slots/ChipStatusFormatterEnum.d.ts

@@ -0,0 +1,3 @@
+export declare enum ChipStatusFormatterSlots {
+    root = "root"
+}

package/components/formatters/ChipStatusFormatter/slots/ChipStatusFormatterEnum.js

@@ -0,0 +1,7 @@
+var ChipStatusFormatterSlots = /* @__PURE__ */ ((ChipStatusFormatterSlots2) => {
+  ChipStatusFormatterSlots2["root"] = "root";
+  return ChipStatusFormatterSlots2;
+})(ChipStatusFormatterSlots || {});
+export {
+  ChipStatusFormatterSlots as C
+};

package/components/formatters/ChipStatusFormatter/slots/ChipStatusFormatterSlots.d.ts

@@ -0,0 +1,6 @@
+/**
+ * componente root del ChipStatusFormatter
+ */
+export declare const ChipStatusFormatterRootStyled: import('@emotion/styled').StyledComponent<Pick<import('../../../Chip').ChipProps & import('react').RefAttributes<HTMLDivElement>, keyof import('react').RefAttributes<HTMLDivElement> | keyof import('../../../Chip').ChipProps> & import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & Record<string, unknown> & {
+    ownerState: any;
+}, {}, {}>;

package/components/formatters/ChipStatusFormatter/slots/ChipStatusFormatterSlots.js

@@ -0,0 +1,12 @@
+import { styled } from "@mui/material";
+import { c as chipStatusFormatterStyles } from "../ChipStatusFormatter.styles.js";
+import { C as ChipStatusFormatterSlots } from "./ChipStatusFormatterEnum.js";
+import { a as CHIP_STATUS_FORMATTER_KEY_COMPONENT } from "../constants.js";
+import { C as Chip } from "../../../Chip/Chip.js";
+const ChipStatusFormatterRootStyled = styled(Chip, {
+  name: CHIP_STATUS_FORMATTER_KEY_COMPONENT,
+  slot: ChipStatusFormatterSlots.root
+})(chipStatusFormatterStyles.root);
+export {
+  ChipStatusFormatterRootStyled as C
+};

package/components/formatters/ChipStatusFormatter/test/chipStatusFormatter.test.d.ts

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

package/components/formatters/ChipStatusFormatter/types.d.ts

@@ -0,0 +1,47 @@
+import { ChipColorOptions, Sizes } from '@m4l/styles';
+import { M4LOverridesStyleRules } from '../../../@types/augmentations';
+import { CHIP_STATUS_FORMATTER_KEY_COMPONENT } from './constants';
+import { ChipStatusFormatterSlots as Slots } from './slots/ChipStatusFormatterEnum';
+import { Theme } from '@mui/material';
+export type ChipStatusKey = string | number;
+export interface ChipStatusFormatterProps {
+    /**
+     * Etiqueta del chip
+     */
+    label: string;
+    /**
+     * Estado del chip
+     */
+    status: string | number;
+    /**
+     * Conjuntos de colores para los estados del chip
+     */
+    statusesColors: Record<ChipStatusKey, ChipColorOptions>;
+    /**
+     * Color por defecto
+     */
+    fallbackColor: Extract<ChipColorOptions, 'default'>;
+    /**
+     * Componente personalizado
+     */
+    Component?: React.ElementType;
+    /**
+     * Opacidad del chip
+     */
+    opacity?: boolean;
+    /**
+     * Tamaño del chip
+     */
+    size?: Extract<Sizes, 'small' | 'medium'>;
+    /**
+     * Clase CSS del componente root
+     */
+    className?: string;
+    /**
+     * ID de prueba del componente
+     */
+    dataTestid?: string;
+}
+export type ChipStatusFormatterOwnerState = {};
+export type ChipStatusFormatterSlotsType = keyof typeof Slots;
+export type ChipStatusFormatterStyles = M4LOverridesStyleRules<keyof typeof Slots, typeof CHIP_STATUS_FORMATTER_KEY_COMPONENT, Theme>;

package/components/formatters/index.d.ts

@@ -1,4 +1,5 @@
 export { BooleanFormatter } from './BooleanFormatter/BooleanFormatter';
+export { ChipStatusFormatter } from './ChipStatusFormatter';
 export { getFormatDate, DateFormatter } from './DateFormatter/DateFormatter';
 export { UncertaintyFormatter, getUncertaintyFormat } from './UncertaintyFormatter/UncertaintyFormatter';
 export { PointsFormatter, getFormatPoints } from './PointsFormatter/PointsFormatter';

package/index.js

@@ -46,14 +46,15 @@ import { C as C9 } from "./components/DataGrid/formatters/ColumnInteractiveCheck
 import { C as C10 } from "./components/DataGrid/formatters/ColumnSetCheckFormatter/index.js";
 import { C as C11 } from "./components/DataGrid/formatters/ColumnIconFormatter/index.js";
 import { u as u3 } from "./components/DataGrid/formatters/ColumnBooleanFormatter/useColumnBoolean.js";
-import { u as u4 } from "./components/DataGrid/formatters/ColumnConcatenatedValueFormatter/useColumnConcatenatedValue.js";
-import { u as u5 } from "./components/DataGrid/formatters/ColumnDateFormatter/useColumnDate.js";
-import { u as u6 } from "./components/DataGrid/formatters/ColumnNestedValueFormatter/useColumnNestedValue.js";
-import { u as u7 } from "./components/DataGrid/formatters/ColumnPriceFormatter/useColumnPrice.js";
-import { u as u8 } from "./components/DataGrid/formatters/ColumnUncertaintyFormatter/useColumnUncertainty.js";
-import { u as u9 } from "./components/DataGrid/formatters/ColumnPointsFormatter/useColumnPoints.js";
-import { u as u10 } from "./components/DataGrid/formatters/ColumnInteractiveCheckFormatter/useColumnInteractiveCheck.js";
-import { u as u11 } from "./components/DataGrid/formatters/ColumnSetCheckFormatter/useColumnSetCheck.js";
+import { u as u4 } from "./components/DataGrid/formatters/ColumnChipStatusFormatter/useColumnChipStatusFormatter.js";
+import { u as u5 } from "./components/DataGrid/formatters/ColumnConcatenatedValueFormatter/useColumnConcatenatedValue.js";
+import { u as u6 } from "./components/DataGrid/formatters/ColumnDateFormatter/useColumnDate.js";
+import { u as u7 } from "./components/DataGrid/formatters/ColumnNestedValueFormatter/useColumnNestedValue.js";
+import { u as u8 } from "./components/DataGrid/formatters/ColumnPriceFormatter/useColumnPrice.js";
+import { u as u9 } from "./components/DataGrid/formatters/ColumnUncertaintyFormatter/useColumnUncertainty.js";
+import { u as u10 } from "./components/DataGrid/formatters/ColumnPointsFormatter/useColumnPoints.js";
+import { u as u11 } from "./components/DataGrid/formatters/ColumnInteractiveCheckFormatter/useColumnInteractiveCheck.js";
+import { u as u12 } from "./components/DataGrid/formatters/ColumnSetCheckFormatter/useColumnSetCheck.js";
 import { D as D3 } from "./components/DragResizeWindow/DragResizeWindow.js";
 import { d as d2 } from "./components/DragResizeWindow/classes/index.js";
 import { D as D4 } from "./components/DragResizeWindowRND/DragResizeWindowRND.js";
@@ -71,11 +72,12 @@ import { P } from "./components/extended/React-Spinners/PropagateLoaderSpinner/P
 import { F } from "./components/extended/React-Window/FixedSizeList/FixedSizeList.js";
 import { V } from "./components/extended/React-Window/VariableSizeList/VariableSizeList.js";
 import { B as B2 } from "./components/formatters/BooleanFormatter/BooleanFormatter.js";
+import { C as C12 } from "./components/formatters/ChipStatusFormatter/ChipStatusFormatter.js";
 import { D as D7, g as g8 } from "./components/formatters/DateFormatter/DateFormatter.js";
 import { U, g as g9 } from "./components/formatters/UncertaintyFormatter/UncertaintyFormatter.js";
 import { P as P2, g as g10 } from "./components/formatters/PointsFormatter/PointsFormatter.js";
-import { C as C12, g as g11 } from "./components/formatters/ConcatenatedFormatter/ConcatenatedFormatter.js";
-import { P as P3, u as u12 } from "./components/formatters/PeriodFormatter/PeriodFormatter.js";
+import { C as C13, g as g11 } from "./components/formatters/ConcatenatedFormatter/ConcatenatedFormatter.js";
+import { P as P3, u as u13 } from "./components/formatters/PeriodFormatter/PeriodFormatter.js";
 import { P as P4, g as g12 } from "./components/formatters/PriceFormatter/PriceFormatter.js";
 import { g as g13 } from "./components/formatters/DistanceToNowFormatter/dictionary.js";
 import { D as D8 } from "./components/formatters/DistanceToNowFormatter/DistanceToNowFormatter.js";
@@ -126,7 +128,7 @@ import { A as A14 } from "./components/mui_extended/Accordion/Accordion.js";
 import { A as A15 } from "./components/mui_extended/Avatar/Avatar.js";
 import { B as B3 } from "./components/mui_extended/BoxIcon/index.js";
 import { B as B4 } from "./components/mui_extended/Breadcrumbs/index.js";
-import { C as C13 } from "./components/mui_extended/CircularProgress/CircularProgress.js";
+import { C as C14 } from "./components/mui_extended/CircularProgress/CircularProgress.js";
 import { B as B5 } from "./components/mui_extended/Badge/Badge.js";
 import { L as L8 } from "./components/mui_extended/LinearProgress/index.js";
 import { L as L9 } from "./components/mui_extended/LinkWithRoute/index.js";
@@ -137,7 +139,7 @@ import { T as T4 } from "./components/mui_extended/Tab/Tab.js";
 import { T as T5 } from "./components/mui_extended/Tooltip/Tooltip.js";
 import { I as I4 } from "./components/mui_extended/IconButton/IconButton.js";
 import { B as B6 } from "./components/mui_extended/Button/Button.js";
-import { C as C14 } from "./components/mui_extended/CheckBox/CheckBox.js";
+import { C as C15 } from "./components/mui_extended/CheckBox/CheckBox.js";
 import { I as I5 } from "./components/mui_extended/ImageButton/ImageButton.js";
 import { P as P7 } from "./components/mui_extended/Popover/Popover.js";
 import { S as S6 } from "./components/mui_extended/Skeleton/Skeleton.js";
@@ -164,7 +166,7 @@ import { O } from "./components/ObjectLogs/index.js";
 import { d as d5, g as g22 } from "./components/ObjectLogs/dictionary.js";
 import { P as P8 } from "./components/PaperForm/PaperForm.js";
 import { P as P9 } from "./components/PDFViewer/PDFViewer.js";
-import { u as u13 } from "./components/popups/components/PopupsProvider/hooks/usePopupsStore.js";
+import { u as u14 } from "./components/popups/components/PopupsProvider/hooks/usePopupsStore.js";
 import { a as a9, P as P10 } from "./components/popups/components/PopupsProvider/contexts/PopupsContext/PopupsContext.js";
 import { P as P11 } from "./components/popups/components/PopupsViewer/PopupsViewer.js";
 import { P as P12 } from "./components/PrintingSystem/PrintingSystem.js";
@@ -174,32 +176,32 @@ import { S as S9 } from "./components/SideBar/SideBar.js";
 import { T as T18 } from "./components/ToastContainer/ToastContainer.js";
 import { T as T19 } from "./components/ToastContainer/subcomponents/ToastMessage/ToastMessage.js";
 import { W } from "./components/WindowBase/WindowBase.js";
-import { u as u14 } from "./components/WindowBase/hooks/useWindowToolsMF/index.js";
-import { a as a10, u as u15 } from "./components/WindowBase/hooks/useDynamicMFParameters/index.js";
+import { u as u15 } from "./components/WindowBase/hooks/useWindowToolsMF/index.js";
+import { a as a10, u as u16 } from "./components/WindowBase/hooks/useDynamicMFParameters/index.js";
 import { M as M6, W as W2, a as a11 } from "./components/WindowBase/contexts/WindowToolsMFContext/WindowToolsMFContext.js";
 import { c as c3 } from "./components/WindowBase/contexts/DynamicMFParmsContext/store.js";
 import { D as D10, a as a12, M as M7 } from "./components/WindowBase/contexts/DynamicMFParmsContext/DynamicMFParmsContext.js";
 import { W as W3 } from "./components/WindowConfirm/WindowConfirm.js";
 import { a as a13, g as g23 } from "./components/ModalDialog/dictionary.js";
 import { M as M8 } from "./components/ModalDialog/ModalDialog.js";
-import { F as F2, R as R22, u as u16 } from "./components/hook-form/RHFormContext/index.js";
+import { F as F2, R as R22, u as u17 } from "./components/hook-form/RHFormContext/index.js";
 import { g as g24 } from "./components/hook-form/RHFormContext/dictionary.js";
-import { u as u17 } from "./contexts/AppearanceComponentContext/useAppearanceComponentStore.js";
+import { u as u18 } from "./contexts/AppearanceComponentContext/useAppearanceComponentStore.js";
 import { A as A16 } from "./contexts/AppearanceComponentContext/AppearanceComponentContext.js";
 import { a as a14, M as M9 } from "./contexts/ModalContext/index.js";
-import { u as u18 } from "./hooks/useFormAddEdit/index.js";
-import { u as u19 } from "./hooks/useModal/index.js";
-import { u as u20 } from "./hooks/useTab/index.js";
+import { u as u19 } from "./hooks/useFormAddEdit/index.js";
+import { u as u20 } from "./hooks/useModal/index.js";
+import { u as u21 } from "./hooks/useTab/index.js";
 import { g as g25 } from "./hooks/useFormAddEdit/dictionary.js";
-import { u as u21 } from "./hooks/useFormFocus/index.js";
-import { u as u22 } from "./hooks/useInterval/index.js";
-import { u as u23 } from "./hooks/useComponentSize/useComponentSize.js";
-import { u as u24 } from "./hooks/useFormReadyForUpdate/index.js";
-import { u as u25 } from "./hooks/useStateRef/index.js";
+import { u as u22 } from "./hooks/useFormFocus/index.js";
+import { u as u23 } from "./hooks/useInterval/index.js";
+import { u as u24 } from "./hooks/useComponentSize/useComponentSize.js";
+import { u as u25 } from "./hooks/useFormReadyForUpdate/index.js";
+import { u as u26 } from "./hooks/useStateRef/index.js";
 import { a as a15 } from "./hooks/useSvgColor/constants.js";
-import { u as u26 } from "./hooks/useSvgColor/useSvgColor.js";
-import { u as u27 } from "./hooks/useDynamicFilterAndSort/useDynamicFilterAndSort.js";
-import { u as u28 } from "./hooks/useDataGridPersistence/useDataGridPersistence.js";
+import { u as u27 } from "./hooks/useSvgColor/useSvgColor.js";
+import { u as u28 } from "./hooks/useDynamicFilterAndSort/useDynamicFilterAndSort.js";
+import { u as u29 } from "./hooks/useDataGridPersistence/useDataGridPersistence.js";
 import { c as c4 } from "./utils/capitalizeFirstLetter.js";
 import { i as i2 } from "./utils/isValidDate.js";
 import { g as g26 } from "./utils/getComponentUtilityClass.js";
@@ -236,9 +238,10 @@ export {
   B3 as BoxIcon,
   B4 as Breadcrumbs,
   B6 as Button,
-  C14 as CheckBox,
+  C15 as CheckBox,
   C as Chip,
-  C13 as CircularProgress,
+  C12 as ChipStatusFormatter,
+  C14 as CircularProgress,
   C5 as ColumnBooleanFormatter,
   C7 as ColumnConcatenatedValueFormatter,
   C6 as ColumnDateFormatter,
@@ -249,7 +252,7 @@ export {
   C8 as ColumnPriceFormatter,
   C10 as ColumnSetCheckFormatter,
   C2 as ColumnUncertaintyFormatter,
-  C12 as ConcatenatedFormatter,
+  C13 as ConcatenatedFormatter,
   D as DICTIONARY,
   D2 as DataGrid,
   D7 as DateFormatter,
@@ -426,35 +429,36 @@ export {
   r as rhfPeriodStyles,
   t as toggleButtonStyles,
   t2 as toggleIconButtonStyles,
-  u17 as useAppearanceComponentStore,
+  u18 as useAppearanceComponentStore,
   u2 as useAreasStore,
   u3 as useColumnBoolean,
-  u8 as useColumnCertanity,
-  u4 as useColumnConcatenatedValue,
-  u5 as useColumnDate,
-  u10 as useColumnInteractiveCheck,
-  u6 as useColumnNestedValue,
-  u9 as useColumnPoints,
-  u7 as useColumnPrice,
-  u11 as useColumnSetCheck,
-  u23 as useComponentSize,
-  u16 as useCustomForm,
-  u28 as useDataGridPersistence,
-  u27 as useDynamicFilterAndSort,
+  u9 as useColumnCertanity,
+  u4 as useColumnChipStatusFormatter,
+  u5 as useColumnConcatenatedValue,
+  u6 as useColumnDate,
+  u11 as useColumnInteractiveCheck,
+  u7 as useColumnNestedValue,
+  u10 as useColumnPoints,
+  u8 as useColumnPrice,
+  u12 as useColumnSetCheck,
+  u24 as useComponentSize,
+  u17 as useCustomForm,
+  u29 as useDataGridPersistence,
+  u28 as useDynamicFilterAndSort,
   a10 as useDynamicMFParameters,
-  u15 as useDynamicMFParametersStore,
-  u18 as useFormAddEdit,
-  u21 as useFormFocus,
-  u24 as useFormReadyForUpdate,
-  u12 as useFormatPeriod,
-  u22 as useInterval,
-  u19 as useModal,
-  u13 as usePopupsStore,
+  u16 as useDynamicMFParametersStore,
+  u19 as useFormAddEdit,
+  u22 as useFormFocus,
+  u25 as useFormReadyForUpdate,
+  u13 as useFormatPeriod,
+  u23 as useInterval,
+  u20 as useModal,
+  u14 as usePopupsStore,
   u as useSetWindowsTitle,
-  u25 as useStateRef,
-  u26 as useSvgColor,
-  u20 as useTab,
-  u14 as useWindowToolsMF,
+  u26 as useStateRef,
+  u27 as useSvgColor,
+  u21 as useTab,
+  u15 as useWindowToolsMF,
   v2 as varBounce,
   v3 as varContainer,
   v as varFade,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@m4l/components",
-  "version": "9.2.5",
+  "version": "9.2.6",
   "license": "UNLICENSED",
   "lint-staged": {
     "*.{js,ts,tsx}": "eslint --fix --max-warnings 0  --no-warn-ignored"

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

@@ -1,4 +1,5 @@
 import { HeaderRendererProps } from 'react-data-grid';
+import { ChipStatusFormatterProps } from '../../../../src/components/formatters/ChipStatusFormatter/types';
 export interface SeedProps {
     quantity: number;
     withBoolean?: boolean;
@@ -11,6 +12,8 @@ export interface SeedProps {
     withPrice?: boolean;
     withUncertainty?: boolean;
     withSetCheck?: boolean;
+    withCesar?: boolean;
+    withChipStatus?: boolean;
 }
 export type GetColumnsProps = Omit<SeedProps, 'quantity'>;
 export type ColumnType = 'string' | 'number' | 'boolean' | 'date' | 'custom';
@@ -38,6 +41,11 @@ export interface RowType {
         unit: string;
     };
     setCheck?: boolean;
+    cesar?: string;
+    status?: {
+        label: string;
+        currentStatus: ChipStatusFormatterProps['status'];
+    };
 }
 interface RangesUncertanty {
     cmc_min: number;

package/storybook/components/formatters/ChipStatusFormatter/ChipStatusFormatter.stories.d.ts

@@ -0,0 +1,13 @@
+import { Meta, StoryObj } from '@storybook/react';
+import { ChipStatusFormatter } from '../../../../src/components/formatters/ChipStatusFormatter';
+declare const meta: Meta<typeof ChipStatusFormatter>;
+export default meta;
+type Story = StoryObj<typeof ChipStatusFormatter>;
+/**
+ * Historia predeterminada para el componente.
+ */
+export declare const Base: Story;
+/**
+ * Historia con un esqueleto de carga.
+ */
+export declare const Skeleton: Story;