@m4l/components 9.3.20 → 9.3.21-JAEBeta.0

package/@types/types.d.ts

@@ -38,7 +38,7 @@ import {
   TextFieldOwnerState,
   TextFieldSlotsType,
 } from '../components/mui_extended/TextField/types';
-type Theme = Omit<MuiTheme, 'components'>;
+// type Theme = Omit<MuiTheme, 'components'>;
 import {
   TooltipOwnerState,
   TooltipSlotsType,

package/components/Chip/Chip.js

@@ -23,6 +23,7 @@ const Chip = forwardRef((props, ref) => {
     className,
     dataTestId,
     disabledDeleteButton,
+    ellipsis = false,
     ...others
   } = props;
   const { currentSize } = useComponentSize(size);
@@ -34,8 +35,9 @@ const Chip = forwardRef((props, ref) => {
     variant,
     color,
     opacity,
-    externalColor
-  }), [currentSize, variant, color, opacity, externalColor, onClick]);
+    externalColor,
+    ellipsis
+  }), [onClick, currentSize, variant, color, opacity, externalColor, ellipsis]);
   const renderIcon = useMemo(() => (icon, instaceDataTestId) => {
     if (!icon) {
       return null;
@@ -46,7 +48,7 @@ const Chip = forwardRef((props, ref) => {
       return /* @__PURE__ */ jsx(
         IconStyled,
         {
-          ownerState: { ...ownerState },
+          ownerState,
           src: icon,
           size: currentSize,
           instaceDataTestId
@@ -60,7 +62,7 @@ const Chip = forwardRef((props, ref) => {
       {
         "data-testid": "SkeletonButton",
         width: skeletonWidth,
-        ownerState: { ...ownerState }
+        ownerState
       }
     );
   }
@@ -75,7 +77,7 @@ const Chip = forwardRef((props, ref) => {
       role: "button-chip",
       size: currentSize,
       onClick,
-      ownerState: { ...ownerState },
+      ownerState,
       className: clsx(className, CHIP_CLASSES.root),
       ref,
       ...process.env.NODE_ENV !== "production" ? { [TEST_PROP_ID]: dataTestId } : {},
@@ -83,7 +85,7 @@ const Chip = forwardRef((props, ref) => {
       ...others,
       children: [
         renderIcon(startIcon, "ChipStartIcon"),
-        /* @__PURE__ */ jsx(TextChipStyled, { size: currentSize, ownerState: { ...ownerState }, color, children: label }),
+        /* @__PURE__ */ jsx(TextChipStyled, { size: currentSize, ownerState: { ...ownerState }, color, ellipsis, children: label }),
         renderIcon(endIcon, "ChipEndIcon"),
         onDeleted && /* @__PURE__ */ jsx(
           IconButtonStyled,
@@ -91,7 +93,7 @@ const Chip = forwardRef((props, ref) => {
             ...iconButtonProps,
             src: iconClose,
             size: currentSize,
-            ownerState: { ...ownerState },
+            ownerState,
             onClick: handleDelete,
             disabled: disabledDeleteButton,
             className: CHIP_CLASSES.closeIcon

package/components/Chip/ChipStyles.js

@@ -1,35 +1,5 @@
 import { g as getSizeStyles } from "../../utils/getSizeStyles/getSizeStyles.js";
-import { darken, lighten } from "@mui/material/styles";
-const getExternalColor = (externalColor) => {
-  try {
-    return {
-      color: externalColor.color,
-      backgroundColor: lighten(externalColor.backgroundColor, 0.5),
-      backgroundHover: lighten(externalColor.backgroundColor, 0.3),
-      backgroundActive: lighten(externalColor.backgroundColor, 0.7),
-      colorTone: lighten(externalColor.color, 1),
-      backgroundColorTone: externalColor.backgroundColor,
-      backgroundHoverTone: lighten(externalColor.backgroundColor, 0.2),
-      backgroundActiveTone: darken(externalColor.backgroundColor, 0.2)
-    };
-  } catch (_error) {
-    return {
-      color: "",
-      backgroundColor: "",
-      backgroundHover: "",
-      backgroundActive: "",
-      colorTone: "",
-      backgroundColorTone: "",
-      backgroundHoverTone: "",
-      backgroundActiveTone: ""
-    };
-  }
-};
-const getColors = (theme, ownerState) => {
-  const finalPalette = ownerState?.externalColor ? getExternalColor(ownerState?.externalColor) : theme.vars.palette.chips[ownerState?.color ?? "default"][ownerState?.variant || "contained"];
-  const color = ownerState?.opacity ? finalPalette.color : finalPalette.colorTone;
-  return { color, finalPalette };
-};
+import { g as getColors } from "./helpers.js";
 const chipStyles = {
   /**
    * Styles for the root element of the chip.
@@ -46,6 +16,9 @@ const chipStyles = {
       borderRadius: theme.vars.size.borderRadius["r1-5"],
       gap: theme.vars.size.baseSpacings["sp0-5"],
       width: "max-content",
+      ...ownerState?.ellipsis && {
+        maxWidth: "100%"
+      },
       cursor: "pointer",
       color,
       backgroundColor: !(ownerState?.variant === "outlined") ? bgColor : "transparent",

package/components/Chip/helpers.d.ts

@@ -0,0 +1,10 @@
+import { ChipColor } from '@m4l/styles';
+import { Theme } from '@mui/material/styles';
+import { ChipOwnerState } from './types';
+/**
+ * Obtiene los colores del chip
+ */
+export declare const getColors: (theme: Theme, ownerState: ChipOwnerState) => {
+    color: string;
+    finalPalette: ChipColor;
+};

package/components/Chip/helpers.js

@@ -0,0 +1,34 @@
+import { darken, lighten } from "@mui/material/styles";
+const getExternalColor = (externalColor) => {
+  try {
+    return {
+      color: externalColor.color,
+      backgroundColor: lighten(externalColor.backgroundColor, 0.5),
+      backgroundHover: lighten(externalColor.backgroundColor, 0.3),
+      backgroundActive: lighten(externalColor.backgroundColor, 0.7),
+      colorTone: lighten(externalColor.color, 1),
+      backgroundColorTone: externalColor.backgroundColor,
+      backgroundHoverTone: lighten(externalColor.backgroundColor, 0.2),
+      backgroundActiveTone: darken(externalColor.backgroundColor, 0.2)
+    };
+  } catch (_error) {
+    return {
+      color: "",
+      backgroundColor: "",
+      backgroundHover: "",
+      backgroundActive: "",
+      colorTone: "",
+      backgroundColorTone: "",
+      backgroundHoverTone: "",
+      backgroundActiveTone: ""
+    };
+  }
+};
+const getColors = (theme, ownerState) => {
+  const finalPalette = ownerState?.externalColor ? getExternalColor(ownerState?.externalColor) : theme.vars.palette.chips[ownerState?.color ?? "default"][ownerState?.variant || "contained"];
+  const color = ownerState?.opacity ? finalPalette.color : finalPalette.colorTone;
+  return { color, finalPalette };
+};
+export {
+  getColors as g
+};

package/components/Chip/types.d.ts

@@ -78,12 +78,18 @@ export interface ChipProps {
      * If the `Chip` delete button is disabled.
      */
     disabledDeleteButton?: boolean;
+    /**
+     * If the `Chip` is ellipsis.
+     */
+    ellipsis?: boolean;
 }
 /**
  * Owner state of the `Chip` used to define internal style and behavior properties.
  */
 export interface ChipOwnerState extends Pick<ChipProps, 'variant' | 'externalColor' | 'opacity' | 'size' | 'color'> {
     interactive: boolean;
+    ellipsis: boolean;
+    [key: string]: unknown;
 }
 /**
  * Defines the types of Slots available for the `Chip`.

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

@@ -42,7 +42,7 @@ const useModalSettings = (size, columns) => {
           onClose: closeModal,
           className: "settings-modal",
           variant: "outlined",
-          type: "modal",
+          emergeType: "modal",
           children: /* @__PURE__ */ jsxs(ContentModalSettingStyled, { classes: classes?.contentModalSetting, children: [
             /* @__PURE__ */ jsx(DataGridRootStyled, { children: /* @__PURE__ */ jsx(
               ColumnsConfig,

package/components/DragResizeWindowRND/DragResizeWindowRND.js

@@ -44,7 +44,7 @@ const DragResizeWindowRND = forwardRef((props, ref) => {
     ...others
   } = props;
   const [currentState, setCurrentState] = useState(
-    () => getInitialSize(containerSize, defaultPosition, containerElement, allowHeightResizeContainer, allowWidthResizeContainer)
+    () => getInitialSize(containerSize, bounds, defaultPosition, containerElement, allowHeightResizeContainer, allowWidthResizeContainer)
   );
   const minConstraints = useMemo(() => [minWidth, minHeight], [minWidth, minHeight]);
   const stateRef = useRef({
@@ -56,7 +56,9 @@ const DragResizeWindowRND = forwardRef((props, ref) => {
     y: currentState.y,
     width: currentState.width,
     height: currentState.height,
-    minConstraints
+    minConstraints,
+    magnetizeRight: currentState.magnetizeRight,
+    magnetizeBottom: currentState.magnetizeBottom
   });
   if (containerSize && (stateRef.current.containerSize?.containerWidth !== containerSize.containerWidth || stateRef.current.containerSize?.containerHeight !== containerSize.containerHeight)) {
     stateRef.current.containerSize = { ...containerSize };
@@ -165,6 +167,7 @@ const DragResizeWindowRND = forwardRef((props, ref) => {
   if (!containerElement) {
     return null;
   }
+  const marginResize = `5px`;
   return /* @__PURE__ */ jsx(
     RndStyled,
     {
@@ -186,15 +189,16 @@ const DragResizeWindowRND = forwardRef((props, ref) => {
       className: classNameFinal,
       enableUserSelectHack: true,
       resizeHandleStyles: {
+        zIndex: 1,
         //Se debe mover lo handler de resize para queden dentro de la ventana, o genería un scroll innecesario.
-        bottom: { bottom: "0px" },
-        right: { right: "0px" },
-        top: { top: "0px" },
-        left: { left: "0px" },
-        bottomRight: { bottom: "0px", right: "0px", height: "10px", width: "10px" },
-        bottomLeft: { bottom: "0px", left: "0px", height: "10px", width: "10px" },
-        topRight: { top: "0px", right: "0px", height: "10px", width: "10px" },
-        topLeft: { top: "0px", left: "0px", height: "10px", width: "10px" }
+        bottom: { bottom: "0px", zIndex: 1, height: marginResize },
+        right: { right: "0px", zIndex: 1, width: marginResize },
+        top: { top: "0px", zIndex: 1, height: marginResize },
+        left: { left: "0px", zIndex: 1, width: marginResize },
+        bottomRight: { bottom: "0px", right: "0px", zIndex: 1 },
+        bottomLeft: { bottom: "0px", left: "0px", zIndex: 1 },
+        topRight: { top: "0px", right: "0px", zIndex: 1 },
+        topLeft: { top: "0px", left: "0px", zIndex: 1 }
       },
       resizeHandleClasses: {
         left: "resize-handle-left",

package/components/DragResizeWindowRND/helpers/expandingParentContainer.d.ts

@@ -9,4 +9,4 @@ import { CurrentState, DraggableWindowBounds } from '../types';
  *    se borran los flags que indican que hay que recuperar el ancho y alto, o el left y top.
  *    (shrinkLeftTopAt, overflowDimensionAt)
  */
-export declare const expandingParentContainer: (newState: CurrentState, containerDimension: number, dimension: "Width" | "Height", bounds?: DraggableWindowBounds) => void;
+export declare const expandingParentContainer: (newState: CurrentState, containerDimension: number, dimension: "Width" | "Height", value: number, bounds?: DraggableWindowBounds) => void;

package/components/DragResizeWindowRND/helpers/expandingParentContainer.js

@@ -1,29 +1,34 @@
-const expandingParentContainer = (newState, containerDimension, dimension, bounds) => {
+const expandingParentContainer = (newState, containerDimension, dimension, value, bounds) => {
   const lDimension = dimension === "Width" ? "width" : "height";
   const leftTop = dimension === "Width" ? "x" : "y";
   const shrinkLeftTopAt = dimension === "Width" ? "shrinkLeftAt" : "shrinkTopAt";
   const overflowDimensionAt = dimension === "Width" ? "overflowWidthAt" : "overflowHeightAt";
-  const boundsLefTop = dimension === "Width" ? 0 : 0;
-  const initialPosition = dimension === "Width" ? 0 : 0;
+  const boundsLefTop = dimension === "Width" ? bounds?.left || 0 : bounds?.top || 0;
+  const initialPosition = dimension === "Width" ? bounds?.right || 0 : bounds?.bottom || 0;
   const maxDimensionElement = containerDimension - boundsLefTop + initialPosition;
-  const valOverflowDimensionAt = newState[overflowDimensionAt];
-  if (valOverflowDimensionAt) {
-    if (valOverflowDimensionAt > maxDimensionElement) {
-      newState[lDimension] = maxDimensionElement;
-    } else {
-      newState[lDimension] = valOverflowDimensionAt;
-      newState[overflowDimensionAt] = void 0;
+  const magnetize = dimension === "Width" ? newState.magnetizeRight : newState.magnetizeBottom;
+  if (!magnetize) {
+    const valOverflowDimensionAt = newState[overflowDimensionAt];
+    if (valOverflowDimensionAt) {
+      if (valOverflowDimensionAt > maxDimensionElement) {
+        newState[lDimension] = maxDimensionElement;
+      } else {
+        newState[lDimension] = valOverflowDimensionAt;
+        newState[overflowDimensionAt] = void 0;
+      }
     }
-  }
-  const valShrinkLeftTopAt = newState[shrinkLeftTopAt];
-  if (valShrinkLeftTopAt && !newState[overflowDimensionAt]) {
-    const dimensionAvailable = containerDimension - boundsLefTop - newState[lDimension] + initialPosition;
-    if (valShrinkLeftTopAt <= dimensionAvailable) {
-      newState[leftTop] = valShrinkLeftTopAt;
-      newState[shrinkLeftTopAt] = void 0;
-    } else {
-      newState[leftTop] = dimensionAvailable;
+    const valShrinkLeftTopAt = newState[shrinkLeftTopAt];
+    if (valShrinkLeftTopAt && !newState[overflowDimensionAt]) {
+      const dimensionAvailable = containerDimension - boundsLefTop - newState[lDimension] + initialPosition;
+      if (valShrinkLeftTopAt <= dimensionAvailable) {
+        newState[leftTop] = valShrinkLeftTopAt;
+        newState[shrinkLeftTopAt] = void 0;
+      } else {
+        newState[leftTop] = dimensionAvailable;
+      }
     }
+  } else {
+    newState[leftTop] = newState[leftTop] + value;
   }
 };
 export {

package/components/DragResizeWindowRND/helpers/getInitialSize.d.ts

@@ -1,5 +1,5 @@
 import { ContainerSize } from '../../../utils/types';
-import { CurrentState, DefaultPosition } from '../types';
+import { CurrentState, DraggableWindowBounds, RNDDefaultPosition } from '../types';
 /**
  * Calculates the initial size and position of an element based on the provided container size
  * and default position values.
@@ -9,7 +9,7 @@ import { CurrentState, DefaultPosition } from '../types';
  * are provided instead of `top` and `left`, the function calculates the starting position based
  * on the container dimensions, ensuring that the element is correctly positioned.
  * @param {ContainerSize | undefined} containerSize - Object containing `containerHeight` and `containerWidth`. Defaults to 200 for both if not provided.
- * @param {DefaultPosition} defaultPosition - Object defining the default vertical and horizontal positions (`top`, `bottom`, `height`, `left`, `right`, `width`).
+ * @param {RNDDefaultPosition} defaultPosition - Object defining the default vertical and horizontal positions (`top`, `bottom`, `height`, `left`, `right`, `width`).
  * @returns {CurrentState} - The initial size and position of the element with `top`, `left`, `width`, and `height` properties.
  */
-export declare const getInitialSize: (containerSize: ContainerSize | undefined, defaultPosition: DefaultPosition, containerElement: HTMLElement | undefined, allowHeightResizeContainer: boolean, allowWidthResizeContainer: boolean) => CurrentState;
+export declare const getInitialSize: (containerSize: ContainerSize | undefined, bounds: DraggableWindowBounds | undefined, defaultPosition: RNDDefaultPosition, containerElement: HTMLElement | undefined, allowHeightResizeContainer: boolean, allowWidthResizeContainer: boolean) => CurrentState;

package/components/DragResizeWindowRND/helpers/getInitialSize.js

@@ -1,11 +1,18 @@
-const getInitialSize = (containerSize, defaultPosition, containerElement, allowHeightResizeContainer, allowWidthResizeContainer) => {
+const getInitialSize = (containerSize, bounds, defaultPosition, containerElement, allowHeightResizeContainer, allowWidthResizeContainer) => {
   let top;
   let bottom;
   let height;
   let left;
   let right;
   let width;
-  const LIMIT_PX = 20;
+  let magnetizeBottom = false;
+  let magnetizeRight = false;
+  if ("magnetize" in defaultPosition.vertical) {
+    magnetizeBottom = defaultPosition.vertical.magnetize || false;
+  }
+  if ("magnetize" in defaultPosition.horizontal) {
+    magnetizeRight = defaultPosition.horizontal.magnetize || false;
+  }
   const containerHeight = containerSize?.containerHeight || 200;
   const containerWidth = containerSize?.containerWidth || 200;
   const scrollTop = containerElement?.scrollTop || 0;
@@ -49,25 +56,21 @@ const getInitialSize = (containerSize, defaultPosition, containerElement, allowH
     y: Math.round(top ?? (bottom !== void 0 ? containerHeight + bottom - (height || 0) : 0)),
     height: Math.round(height ?? containerHeight - (top || 0) - (bottom || 0)),
     x: Math.round(left ?? (right !== void 0 ? containerWidth + right - (width || 0) : 0)),
-    width: Math.round(width ?? containerWidth - (left || 0) - (right || 0))
+    width: Math.round(width ?? containerWidth - (left || 0) - (right || 0)),
+    magnetizeBottom,
+    magnetizeRight
   };
   if (!allowHeightResizeContainer) {
-    const boundTop = 0 + LIMIT_PX;
-    const boundBottom = Math.max(containerHeight - LIMIT_PX - (height || 0), LIMIT_PX);
+    const boundTop = bounds?.top || 0;
+    const boundBottom = bounds?.bottom || 0;
     initialSize.y = Math.max(initialSize.y, boundTop);
-    initialSize.height = Math.min(initialSize.height, containerHeight - LIMIT_PX);
-    if (initialSize.y > boundBottom) {
-      initialSize.y = boundBottom;
-    }
+    initialSize.height = Math.min(initialSize.height, containerHeight - boundTop + boundBottom);
   }
   if (!allowWidthResizeContainer) {
-    const boundLeft = 0 + LIMIT_PX;
-    const boundRight = Math.max(containerWidth - LIMIT_PX - (width || 0), LIMIT_PX);
+    const boundLeft = bounds?.left || 0;
+    const boundRight = bounds?.right || 0;
     initialSize.x = Math.max(initialSize.x, boundLeft);
-    initialSize.width = Math.min(initialSize.width, containerWidth - LIMIT_PX);
-    if (initialSize.x > boundRight) {
-      initialSize.x = boundRight;
-    }
+    initialSize.width = Math.min(initialSize.width, containerWidth - boundLeft + boundRight);
   }
   return initialSize;
 };

package/components/DragResizeWindowRND/helpers/shrinkingParentContainer.d.ts

@@ -3,4 +3,4 @@ import { CurrentState, DraggableWindowBounds } from '../types';
  * "shrinkingParentContainer": Encargada de manejar la contracción de la ventana padre
  * 1. Si el ancho o alto de la ventana cuando se va compactando toca
  */
-export declare const shrinkingParentContainer: (newState: CurrentState, cState: CurrentState, containerDimension: number, divRoot: HTMLElement, dimension: "Width" | "Height", allowResizeContainer: boolean | undefined, minWindowWidth: number, minWindowHeight: number, bounds?: DraggableWindowBounds) => void;
+export declare const shrinkingParentContainer: (newState: CurrentState, cState: CurrentState, containerDimension: number, divRoot: HTMLElement, dimension: "Width" | "Height", allowResizeContainer: boolean | undefined, minWindowWidth: number, minWindowHeight: number, value: number, bounds?: DraggableWindowBounds) => void;

package/components/DragResizeWindowRND/helpers/shrinkingParentContainer.js

@@ -1,21 +1,26 @@
-const shrinkingParentContainer = (newState, cState, containerDimension, divRoot, dimension, allowResizeContainer = false, minWindowWidth, minWindowHeight, bounds) => {
+const shrinkingParentContainer = (newState, cState, containerDimension, divRoot, dimension, allowResizeContainer = false, minWindowWidth, minWindowHeight, value, bounds) => {
   const lDimension = dimension === "Width" ? "width" : "height";
-  const xOrY = dimension === "Width" ? "x" : "y";
+  const leftTop = dimension === "Width" ? "x" : "y";
   const shrinkLeftTopAt = dimension === "Width" ? "shrinkLeftAt" : "shrinkTopAt";
   const overflowDimensionAt = dimension === "Width" ? "overflowWidthAt" : "overflowHeightAt";
   const boundsLefTop = dimension === "Width" ? bounds?.left || 0 : bounds?.top || 0;
   const boundsRightBottom = dimension === "Width" ? bounds?.right || 0 : bounds?.bottom || 0;
   const minWindowDimension = dimension === "Width" ? minWindowWidth : minWindowHeight;
   const minDimension = containerDimension - boundsLefTop + boundsRightBottom > minWindowDimension ? containerDimension - boundsLefTop + boundsRightBottom : minWindowDimension;
-  let maxDimensionElement = containerDimension - cState[xOrY] + boundsRightBottom;
+  const magnetize = dimension === "Width" ? newState.magnetizeRight : newState.magnetizeBottom;
+  let maxDimensionElement = containerDimension - cState[leftTop] + boundsRightBottom;
   if (divRoot[`client${dimension}`] > maxDimensionElement && !allowResizeContainer) {
     const shrunkenPixels = divRoot[`client${dimension}`] - maxDimensionElement;
-    if (shrunkenPixels < cState[xOrY] - boundsLefTop) {
-      newState[xOrY] = newState[xOrY] - shrunkenPixels;
-      newState[shrinkLeftTopAt] = newState[shrinkLeftTopAt] || cState[xOrY];
-    } else if (shrunkenPixels > cState[xOrY] - boundsLefTop) {
-      newState[xOrY] = boundsLefTop;
-      newState[shrinkLeftTopAt] = newState[shrinkLeftTopAt] || cState[xOrY];
+    if (shrunkenPixels < cState[leftTop] - boundsLefTop) {
+      if (!magnetize) {
+        newState[leftTop] = newState[leftTop] - shrunkenPixels;
+        newState[shrinkLeftTopAt] = newState[shrinkLeftTopAt] || cState[leftTop];
+      } else {
+        newState[leftTop] = newState[leftTop] + value;
+      }
+    } else if (shrunkenPixels > cState[leftTop] - boundsLefTop) {
+      newState[leftTop] = boundsLefTop;
+      newState[shrinkLeftTopAt] = newState[shrinkLeftTopAt] || cState[leftTop];
       maxDimensionElement = containerDimension - boundsLefTop + boundsRightBottom;
       if (divRoot[`client${dimension}`] > maxDimensionElement) {
         newState[lDimension] = maxDimensionElement;
@@ -26,6 +31,9 @@ const shrinkingParentContainer = (newState, cState, containerDimension, divRoot,
       }
     }
   } else {
+    if (magnetize) {
+      newState[leftTop] = newState[leftTop] + value;
+    }
     return;
   }
 };

package/components/DragResizeWindowRND/hooks/useRNDDimensionEffects.js

@@ -47,7 +47,9 @@ const useRNDDimensionEffects = (props) => {
           expandingParentContainer(
             newState,
             containerSizeValue,
-            dimension
+            dimension,
+            containerSizeValue - previousContainerSizeValue,
+            bounds
           );
         } else if (containerSizeValue < previousContainerSizeValue) {
           shrinkingParentContainer(
@@ -59,6 +61,7 @@ const useRNDDimensionEffects = (props) => {
             allowResizeContainer,
             minWindowWidth,
             minWindowHeight,
+            containerSizeValue - previousContainerSizeValue,
             bounds
           );
         }

package/components/DragResizeWindowRND/index.d.ts

@@ -1,3 +1,4 @@
 export { DragResizeWindowRND } from './DragResizeWindowRND';
 export { dragResizeWindowRNDClasses } from './classes/index';
 export { WINDOW_SIZES } from './constants';
+export type { RNDDefaultPosition } from './types';

package/components/DragResizeWindowRND/types.d.ts

@@ -78,6 +78,14 @@ export interface CurrentState extends Position {
      * "minConstraints" Indica los límites mínimos de la ventana
      */
     minConstraints?: [number, number];
+    /**
+     * "magnetizeBottom" Indica si se debe magnetizar la ventana a la top ante un resize, conserve el mismo top
+     */
+    magnetizeBottom?: boolean;
+    /**
+     * "magnetizeRight" Indica si se debe magnetizar la ventana a la derecha ante un resize, conserve el mismo rigth
+     */
+    magnetizeRight?: boolean;
 }
 /**
  * Representa una posición parcial, solo incluye las propiedades left y top.
@@ -122,7 +130,7 @@ export type DraggableWindowRefProps = {
 /**
  * Tipo que representa las posiciones predeterminadas (vertical y horizontal) de la ventana.
  */
-export interface DefaultPosition {
+export interface RNDDefaultPosition {
     vertical: {
         top: number;
         bottom: number;
@@ -134,6 +142,7 @@ export interface DefaultPosition {
     } | {
         bottom: number;
         height: number;
+        magnetize?: boolean;
     } | {
         percent: number;
     };
@@ -146,6 +155,7 @@ export interface DefaultPosition {
     } | {
         right: number;
         width: number;
+        magnetize?: boolean;
     } | {
         percent: number;
     } | {
@@ -177,7 +187,7 @@ export interface DragResizeWindowPropsRND extends Partial<Omit<RndProps, 'handle
      * defaultPosition permite definir la posición inicial de la ventana
      * TODO: Debe también recibir anchorEl y anchorPosition y calcular la posición en base a este
      */
-    defaultPosition?: DefaultPosition;
+    defaultPosition?: RNDDefaultPosition;
     /**
      * "bounds" permite definir los limites de movimiento de la ventana
      */

package/components/DynamicFilter/DynamicFilter.js

@@ -4,11 +4,12 @@ import { forwardRef } from "react";
 import { D as DynamicFilterProvider } from "./store/DynamicFilterContext.js";
 import { D as DynamicFilterBase } from "./subcomponents/DynamicFilterBase/DynamicFilterBase.js";
 const DynamicFilter = forwardRef((props, ref) => {
+  const { className, ...others } = props;
   const hasPresentFlags = useFlagsPresent([CommonFlags.FLAG_DICTIONARY_LOADED]);
   if (!hasPresentFlags) {
     return null;
   }
-  return /* @__PURE__ */ jsx(DynamicFilterProvider, { ...props, ref, children: /* @__PURE__ */ jsx(DynamicFilterBase, {}) });
+  return /* @__PURE__ */ jsx(DynamicFilterProvider, { ...others, ref, children: /* @__PURE__ */ jsx(DynamicFilterBase, { className }) });
 });
 export {
   DynamicFilter as D

package/components/DynamicFilter/helpers/frontEndHelpers.d.ts

@@ -1,10 +1,10 @@
-import { RawFilterFieldApply } from '../types';
+import { FilterField, RawFilterFieldApply } from '../types';
 type ObjectData = Record<any, any>;
 /**
  * Función que verifica si el objectData cumple con todos los filtros de DynamicFilter
  * Para usar en el frontEnd, y no atraves de la API
  */
-export declare const getIsIfInDynamicFilter: (objectData: ObjectData, groupedFields: Record<string, RawFilterFieldApply[]>) => boolean;
+export declare const getIsIfInDynamicFilter: (filterFields: Array<FilterField>, objectData: ObjectData, groupedFields: Record<string, RawFilterFieldApply[]>) => boolean;
 /**
  * getFilterGroupFieldsByName agrupa los campos por nombre, para procesarlos en una OR
  */

package/components/DynamicFilter/helpers/frontEndHelpers.js

@@ -16,7 +16,7 @@ const isInBooleanFilter = (objectData, field) => {
   }
   return true;
 };
-const isInStringFilter = (objectData, field) => {
+const isInStringFilter = (objectData, field, defaultUndefinedValue = true) => {
   const objectDataValue = getPropertyByString(objectData, field.n, void 0);
   if (typeof field.o1 !== "string") {
     return true;
@@ -31,19 +31,19 @@ const isInStringFilter = (objectData, field) => {
         return true;
       }
     } else if (field.o === "c") {
-      if (objectDataValue.includes(field.o1)) {
+      if (objectDataValue.toLocaleLowerCase().includes(field.o1.toLocaleLowerCase())) {
         return true;
       }
     } else if (field.o === "nc") {
-      if (!objectDataValue.includes(field.o1)) {
+      if (!objectDataValue.toLocaleLowerCase().includes(field.o1.toLocaleLowerCase())) {
         return true;
       }
     }
     return false;
   }
-  return true;
+  return defaultUndefinedValue;
 };
-const isInNumberFilter = (objectData, field) => {
+const isInNumberFilter = (objectData, field, defaultUndefinedValue = true) => {
   const objectDataValue = getPropertyByString(objectData, field.n, void 0);
   if (typeof field.o1 !== "number") {
     return true;
@@ -83,7 +83,7 @@ const isInNumberFilter = (objectData, field) => {
     }
     return false;
   }
-  return true;
+  return defaultUndefinedValue;
 };
 const isInDateTimeFilter = (objectData, field) => {
   const objectDataValueString = getPropertyByString(objectData, field.n, void 0);
@@ -169,13 +169,34 @@ const isInSelectFilter = (objectData, field) => {
   }
   return false;
 };
-const getIsIfInDynamicFilter = (objectData, groupedFields) => {
+const getIsIfInDynamicFilter = (filterFields, objectData, groupedFields) => {
   let InAllFilters = true;
   for (const fieldName of Object.keys(groupedFields)) {
     const fieldGroup = groupedFields[fieldName];
     let inFilter = false;
     fieldGroup.forEach((field) => {
-      if (field.ft === "boolean") {
+      if (field.n === "all") {
+        filterFields.forEach((filterField) => {
+          const isNumber = !isNaN(Number(field.o1));
+          const artificialField = {
+            n: filterField.name,
+            o: "c",
+            o1: field.o1,
+            ft: filterField.type
+          };
+          if (filterField.type === "string") {
+            const isInString = isInStringFilter(objectData, artificialField, false);
+            inFilter = inFilter || isInString;
+          }
+          if (isNumber && filterField.type === "number") {
+            inFilter = inFilter || isInNumberFilter(objectData, {
+              ...artificialField,
+              o: "e",
+              o1: Number(field.o1)
+            }, false);
+          }
+        });
+      } else if (field.ft === "boolean") {
         inFilter = inFilter || isInBooleanFilter(objectData, field);
       } else if (field.ft === "string") {
         inFilter = inFilter || isInStringFilter(objectData, field);
@@ -199,13 +220,14 @@ const getIsIfInDynamicFilter = (objectData, groupedFields) => {
   return InAllFilters;
 };
 function getFilterGroupFieldsByName(fields) {
-  return fields.reduce((acc, field) => {
+  const result = fields.reduce((acc, field) => {
     if (!acc[field.n]) {
       acc[field.n] = [];
     }
     acc[field.n].push(field);
     return acc;
   }, {});
+  return result;
 }
 export {
   getFilterGroupFieldsByName as a,

package/components/DynamicFilter/subcomponents/DynamicFilterBase/DynamicFilterBase.d.ts

@@ -1,5 +1,6 @@
+import { DynamicFilterBaseProps } from './types';
 /**
  * DynamicFilterBase: Componente base del DynamicFilter.
  */
-declare function DynamicFilterBase(): import("react/jsx-runtime").JSX.Element;
+declare function DynamicFilterBase(props: DynamicFilterBaseProps): import("react/jsx-runtime").JSX.Element;
 export default DynamicFilterBase;