@m4l/components 3.1.8 → 4.0.0

package/components/GridLayout/utils-CF3BArf2.js

@@ -0,0 +1,408 @@
+import { c as DEFAULT_ROW_HEIGHT } from "./constants-BOQgOrZA.js";
+const noop = () => {
+};
+function bottom(layout, colapsedHeight, rowHeight) {
+  let max = 0, bottomY;
+  for (let i = 0, len = layout.length; i < len; i++) {
+    bottomY = layout[i].y + getLayoutItemH(layout[i], colapsedHeight, rowHeight);
+    if (bottomY > max) max = bottomY;
+  }
+  return max;
+}
+function cloneLayoutItem(layoutItem, layoutItemReplaceProps) {
+  return {
+    w: layoutItem.w,
+    h: layoutItem.h,
+    x: layoutItem.x,
+    y: layoutItem.y,
+    i: layoutItem.i,
+    minW: layoutItem.minW,
+    maxW: layoutItem.maxW,
+    minH: layoutItem.minH,
+    maxH: layoutItem.maxH,
+    moved: Boolean(layoutItem.moved),
+    static: Boolean(layoutItem.static),
+    // These can be null/undefined
+    isDraggable: layoutItem.isDraggable,
+    isResizable: layoutItem.isResizable,
+    resizeHandles: layoutItem.resizeHandles,
+    isBounded: layoutItem.isBounded,
+    freeMove: layoutItem.freeMove,
+    colapsed: layoutItem.colapsed,
+    visible: layoutItem.visible,
+    ...layoutItemReplaceProps
+  };
+}
+function cloneLayout(layout, layoutItemReplaceProps) {
+  const newLayout = Array(layout.length);
+  for (let i = 0, len = layout.length; i < len; i++) {
+    newLayout[i] = cloneLayoutItem(layout[i], layoutItemReplaceProps);
+  }
+  return newLayout;
+}
+function collides(l1, l2, colapsedHeight, rowHeight) {
+  if (l1.i === l2.i) return false;
+  if (l1.x + l1.w <= l2.x) return false;
+  if (l1.x >= l2.x + l2.w) return false;
+  if (l1.y + getLayoutItemH(l1, colapsedHeight, rowHeight) <= l2.y) return false;
+  if (l1.y >= l2.y + getLayoutItemH(l2, colapsedHeight, rowHeight)) return false;
+  return true;
+}
+function compactItem(compareWith, l, compactType, cols, fullLayout, colapsedHeight, rowHeight, allowOverlap) {
+  const compactV = compactType === "vertical";
+  const compactH = compactType === "horizontal";
+  if (compactV) {
+    l.y = Math.min(bottom(compareWith, colapsedHeight, rowHeight), l.y);
+    while (l.y > 0 && !getFirstCollision(compareWith, l, colapsedHeight, rowHeight)) {
+      l.y--;
+    }
+  } else if (compactH) {
+    while (l.x > 0 && !getFirstCollision(compareWith, l, colapsedHeight, rowHeight)) {
+      l.x--;
+    }
+  }
+  let collidesItem;
+  while ((collidesItem = getFirstCollision(compareWith, l, colapsedHeight, rowHeight)) && !(compactType === null && allowOverlap)) {
+    if (compactH) {
+      resolveCompactionCollision(
+        fullLayout,
+        l,
+        collidesItem.x + collidesItem.w,
+        "x",
+        colapsedHeight,
+        rowHeight
+      );
+    } else {
+      resolveCompactionCollision(
+        fullLayout,
+        l,
+        collidesItem.y + getLayoutItemH(collidesItem, colapsedHeight, rowHeight),
+        "y",
+        colapsedHeight,
+        rowHeight
+      );
+    }
+    if (compactH && l.x + l.w > cols) {
+      l.x = cols - l.w;
+      l.y++;
+      while (l.x > 0 && !getFirstCollision(compareWith, l, colapsedHeight, rowHeight)) {
+        l.x--;
+      }
+    }
+  }
+  l.y = Math.max(l.y, 0);
+  l.x = Math.max(l.x, 0);
+  return l;
+}
+function compact(layout, compactType, cols, colapsedHeight, rowHeight, allowOverlap) {
+  const layoutToCompact = layout.filter((l) => !l.freeMove);
+  const layoutFreeMov = layout.filter((l) => l?.freeMove);
+  const compareWith = getStatics(layoutToCompact);
+  const sorted = sortLayoutItems(layoutToCompact, compactType);
+  const out = Array(layoutToCompact.length);
+  for (let i = 0, len = sorted.length; i < len; i++) {
+    let l = cloneLayoutItem(sorted[i]);
+    if (!l.static) {
+      l = compactItem(
+        compareWith,
+        l,
+        compactType,
+        cols,
+        sorted,
+        colapsedHeight,
+        rowHeight,
+        allowOverlap
+      );
+      compareWith.push(l);
+    }
+    out[layoutToCompact.indexOf(sorted[i])] = l;
+    l.moved = false;
+  }
+  return out.concat(layoutFreeMov);
+}
+function getLayoutItem(layout, id) {
+  for (let i = 0, len = layout.length; i < len; i++) {
+    if (layout[i].i === id) return layout[i];
+  }
+  return void 0;
+}
+function getStatics(layout) {
+  return layout.filter((l) => l.static);
+}
+function getAllCollisions(layout, layoutItem, colapsedHeight, rowHeight) {
+  return layout.filter((l) => collides(l, layoutItem, colapsedHeight, rowHeight));
+}
+function getFirstCollision(layout, layoutItem, colapsedHeight, rowHeight) {
+  for (let i = 0, len = layout.length; i < len; i++) {
+    if (collides(layout[i], layoutItem, colapsedHeight, rowHeight)) return layout[i];
+  }
+  return void 0;
+}
+function modifyLayout(layout, layoutItem) {
+  const newLayout = Array(layout.length);
+  for (let i = 0, len = layout.length; i < len; i++) {
+    if (layoutItem.i === layout[i].i) {
+      newLayout[i] = layoutItem;
+    } else {
+      newLayout[i] = layout[i];
+    }
+  }
+  return newLayout;
+}
+function moveElementAwayFromCollision(layout, collidesWith, itemToMove, isUserAction, compactType, cols, colapsedHeight, rowHeight) {
+  const compactH = compactType === "horizontal";
+  const compactV = compactType !== "horizontal";
+  const preventCollision = collidesWith.static;
+  if (isUserAction) {
+    isUserAction = false;
+    const fakeItem = {
+      x: compactH ? Math.max(collidesWith.x - itemToMove.w, 0) : itemToMove.x,
+      y: compactV ? Math.max(collidesWith.y - getLayoutItemH(itemToMove, colapsedHeight, rowHeight), 0) : itemToMove.y,
+      w: itemToMove.w,
+      h: getLayoutItemH(itemToMove, colapsedHeight, rowHeight),
+      i: "-1"
+    };
+    if (!getFirstCollision(layout, fakeItem, colapsedHeight, rowHeight)) {
+      return moveElement(
+        layout,
+        itemToMove,
+        compactH ? fakeItem.x : void 0,
+        compactV ? fakeItem.y : void 0,
+        isUserAction,
+        !!preventCollision,
+        compactType,
+        cols,
+        colapsedHeight,
+        rowHeight,
+        false
+      );
+    }
+  }
+  return moveElement(
+    layout,
+    itemToMove,
+    compactH ? itemToMove.x + 1 : void 0,
+    compactV ? itemToMove.y + 1 : void 0,
+    isUserAction,
+    !!preventCollision,
+    compactType,
+    cols,
+    colapsedHeight,
+    rowHeight,
+    false
+  );
+}
+function moveElement(layout, l, x, y, isUserAction, preventCollision, compactType, cols, colapsedHeight, rowHeight, allowOverlap) {
+  if (l.static && l.isDraggable !== true) return layout;
+  if (l.y === y && l.x === x) return layout;
+  const oldX = l.x;
+  const oldY = l.y;
+  if (typeof x === "number") l.x = x;
+  if (typeof y === "number") l.y = y;
+  l.moved = true;
+  let sorted = sortLayoutItems(layout, compactType);
+  const movingUp = compactType === "vertical" && typeof y === "number" ? oldY >= y : compactType === "horizontal" && typeof x === "number" ? oldX >= x : false;
+  if (movingUp) sorted = sorted.reverse();
+  const collisions = getAllCollisions(sorted, l, colapsedHeight, rowHeight);
+  const hasCollisions = collisions.length > 0;
+  if (hasCollisions && allowOverlap) {
+    return cloneLayout(layout);
+  } else if (hasCollisions && preventCollision) {
+    l.x = oldX;
+    l.y = oldY;
+    l.moved = false;
+    return layout;
+  }
+  for (let i = 0, len = collisions.length; i < len; i++) {
+    const collision = collisions[i];
+    if (collision.moved) continue;
+    if (collision.static) {
+      layout = moveElementAwayFromCollision(
+        layout,
+        collision,
+        l,
+        isUserAction,
+        compactType,
+        cols,
+        colapsedHeight,
+        rowHeight
+      );
+    } else {
+      layout = moveElementAwayFromCollision(
+        layout,
+        l,
+        collision,
+        isUserAction,
+        compactType,
+        cols,
+        colapsedHeight,
+        rowHeight
+      );
+    }
+  }
+  return layout;
+}
+function perc(num) {
+  return num * 100 + "%";
+}
+function resolveCompactionCollision(layout, item, moveToCoord, axis, colapsedHeight, rowHeight) {
+  item[axis] += 1;
+  const itemIndex = layout.map((layoutItem) => {
+    return layoutItem.i;
+  }).indexOf(item.i);
+  for (let i = itemIndex + 1; i < layout.length; i++) {
+    const otherItem = layout[i];
+    if (otherItem.static) continue;
+    if (otherItem.y > item.y + getLayoutItemH(item, colapsedHeight, rowHeight)) break;
+    if (collides(item, otherItem, colapsedHeight, rowHeight)) {
+      resolveCompactionCollision(
+        layout,
+        otherItem,
+        moveToCoord + (axis === "x" ? item.w : getLayoutItemH(item, colapsedHeight, rowHeight)),
+        axis,
+        colapsedHeight,
+        rowHeight
+      );
+    }
+  }
+  item[axis] = moveToCoord;
+}
+function setTransform({ top, left, width, height }) {
+  return {
+    /*  transform: translate,
+        WebkitTransform: translate,
+        MozTransform: translate,
+        msTransform: translate,
+        OTransform: translate, */
+    width: `${width}px`,
+    height: `${height}px`,
+    position: "absolute",
+    left,
+    top
+  };
+}
+function setTopLeft({ top, left, width, height }) {
+  return {
+    top: `${top}px`,
+    left: `${left}px`,
+    width: `${width}px`,
+    height: `${height}px`,
+    position: "absolute"
+  };
+}
+function sortLayoutItemsByRowCol(layout) {
+  return layout.slice(0).sort(function(a, b) {
+    if (a.y > b.y || a.y === b.y && a.x > b.x) {
+      return 1;
+    } else if (a.y === b.y && a.x === b.x) {
+      return 0;
+    }
+    return -1;
+  });
+}
+function sortLayoutItemsByColRow(layout) {
+  return layout.slice(0).sort(function(a, b) {
+    if (a.x > b.x || a.x === b.x && a.y > b.y) {
+      return 1;
+    }
+    return -1;
+  });
+}
+function sortLayoutItems(layout, compactType) {
+  if (compactType === "horizontal") return sortLayoutItemsByColRow(layout);
+  if (compactType === "vertical") return sortLayoutItemsByRowCol(layout);
+  else return layout;
+}
+function withLayoutItem(layout, itemKey, cb) {
+  let item = getLayoutItem(layout, itemKey);
+  if (!item) return [layout, void 0];
+  item = cb(cloneLayoutItem(item));
+  layout = modifyLayout(layout, item);
+  return [layout, item];
+}
+function correctBounds(layout, bounds, colapsedHeight, rowHeight) {
+  const collidesWith = getStatics(layout);
+  for (let i = 0, len = layout.length; i < len; i++) {
+    const l = layout[i];
+    if (l.x + l.w > bounds.cols) l.x = bounds.cols - l.w;
+    if (l.x < 0) {
+      l.x = 0;
+      l.w = bounds.cols;
+    }
+    if (!l.static) collidesWith.push(l);
+    else {
+      while (getFirstCollision(collidesWith, l, colapsedHeight, rowHeight)) {
+        l.y++;
+      }
+    }
+  }
+  return layout;
+}
+function getH(h, colapsedHeight, rowHeight, colapsed) {
+  if (colapsed) {
+    let ret;
+    if (rowHeight && rowHeight > 0) {
+      ret = colapsedHeight / rowHeight;
+    } else {
+      ret = colapsedHeight / DEFAULT_ROW_HEIGHT;
+    }
+    return ret;
+  }
+  return h;
+}
+function getLayoutItemH(layoutItem, colapsedHeight, rowHeight) {
+  return getH(layoutItem.h, colapsedHeight, rowHeight, layoutItem.colapsed);
+}
+function isEqualLayoutItem(layoutA, layoutB) {
+  if (layoutA.i !== layoutB.i) {
+    return false;
+  } else if (layoutA.x !== layoutB.x || layoutA.y !== layoutB.y || layoutA.w !== layoutB.w || layoutA.h !== layoutB.h || layoutA.colapsed !== layoutB.colapsed || layoutA.visible !== layoutB.visible || layoutA.freeMove !== layoutB.freeMove) {
+    return false;
+  }
+  return true;
+}
+function isEqualLayout(layoutA, layoutB) {
+  if (layoutA.length !== layoutB.length) {
+    return false;
+  }
+  for (let index = 0; index < layoutA.length; index++) {
+    if (!isEqualLayoutItem(layoutA[index], layoutB[index])) {
+      return false;
+    }
+  }
+  return true;
+}
+function isEqualLayouts(layoutsA, layoutsB) {
+  if (Object.keys(layoutsA).length !== Object.keys(layoutsB).length) {
+    return false;
+  }
+  for (const breakPoint in layoutsA) {
+    if (layoutsB[breakPoint]) {
+      if (!isEqualLayout(layoutsA[breakPoint], layoutsB[breakPoint])) {
+        return false;
+      }
+    } else {
+      return false;
+    }
+  }
+  return true;
+}
+export {
+  cloneLayoutItem as a,
+  getLayoutItemH as b,
+  cloneLayout as c,
+  compact as d,
+  bottom as e,
+  getAllCollisions as f,
+  getLayoutItem as g,
+  getH as h,
+  isEqualLayout as i,
+  setTopLeft as j,
+  isEqualLayouts as k,
+  correctBounds as l,
+  moveElement as m,
+  noop as n,
+  perc as p,
+  setTransform as s,
+  withLayoutItem as w
+};

package/components/HelmetPage/index-CbpwSvMa.js

@@ -0,0 +1,21 @@
+import { jsxs, Fragment, jsx } from "react/jsx-runtime";
+import { Helmet } from "react-helmet-async";
+import { useLocales } from "@m4l/graphics";
+import { useModuleSkeleton } from "@m4l/core";
+const HelmetPage = (props) => {
+  const { children, title, meta, subtitle } = props;
+  const localeString = useLocales().currentLocale?.localeString;
+  const isSkeleton = useModuleSkeleton();
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    !isSkeleton && /* @__PURE__ */ jsxs(Helmet, { children: [
+      /* @__PURE__ */ jsx("title", { children: `${title}${subtitle ? ` | ${subtitle}` : ""} ` }),
+      /* @__PURE__ */ jsx("html", { lang: localeString }),
+      meta
+    ] }),
+    children
+  ] });
+};
+HelmetPage.displayName = "Page";
+export {
+  HelmetPage as H
+};

package/components/HelperText/index-DZCj76Dl.js

@@ -0,0 +1,20 @@
+import { jsx } from "react/jsx-runtime";
+import { H as HelperTextRoot } from "./styles-CQTg9ZuH.js";
+import { u as useUtilityClasses } from "./utils/Clases/index-BHBSnukJ.js";
+import { T as Typography } from "../mui_extended/Typography/Typography-C_rG8K21.js";
+const HelperText = (props) => {
+  const { message = "", skeletonWidth, skeletongHeight, variant } = props;
+  const ownerSate = {
+    variant
+  };
+  const classes = useUtilityClasses(ownerSate);
+  return (
+    /* ErrorLabelRoot: Contenedor principal del componente, es usado para aplicar los estilos css de los overrides
+        que provienen del objeto del tema. Se usa para garantizar de que estos estilos no se propaguen a otros
+        componentes de la plataforna web. */
+    /* @__PURE__ */ jsx(HelperTextRoot, { className: classes.root, children: /* @__PURE__ */ jsx(Typography, { variant: "body", skeletonWidth, skeletongHeight, children: message }) })
+  );
+};
+export {
+  HelperText as H
+};

package/components/HelperText/styles-CQTg9ZuH.js

@@ -0,0 +1,7 @@
+import { styled } from "@mui/material/styles";
+const HelperTextRoot = styled("div")(({ theme }) => ({
+  ...theme.components?.M4LErrorLabel?.styleOverrides
+}));
+export {
+  HelperTextRoot as H
+};

package/components/HelperText/utils/Clases/constant-Cikvtg7M.js

@@ -0,0 +1,4 @@
+const componentName = "M4LHelperText";
+export {
+  componentName as c
+};

package/components/HelperText/utils/Clases/index-BHBSnukJ.js

@@ -0,0 +1,34 @@
+import { generateUtilityClasses, generateUtilityClass } from "@mui/material";
+import { unstable_composeClasses } from "@mui/base";
+import { c as componentName } from "./constant-Cikvtg7M.js";
+const errorLabelClasses = generateUtilityClasses(componentName, [
+  /* elements */
+  "root",
+  /* states or variants of elements */
+  "variantInfo",
+  "variantSuccess",
+  "variantWarning",
+  "variantError"
+]);
+function getHelperTextUtilityClass(slot) {
+  return generateUtilityClass(componentName, slot);
+}
+const useUtilityClasses = (ownerSate) => {
+  const slots = {
+    root: [
+      "root",
+      ownerSate.variant === "info" && "variantInfo",
+      ownerSate.variant === "success" && "variantSuccess",
+      ownerSate.variant === "warning" && "variantWarning",
+      ownerSate.variant === "error" && "variantError"
+    ]
+  };
+  const composedClasses = unstable_composeClasses(slots, getHelperTextUtilityClass, {});
+  return {
+    ...composedClasses
+  };
+};
+export {
+  errorLabelClasses as e,
+  useUtilityClasses as u
+};

package/components/Icon/Icon-_wceDYwV.js

@@ -0,0 +1,35 @@
+import { jsx } from "react/jsx-runtime";
+import { I as IconRoot, D as DivIcon } from "./styles-CYoc5wsG.js";
+import { u as useUtilityClasses } from "./classes/index-CpBgKs2U.js";
+import { T as TEST_PROP_ID } from "../../test/constants_no_mock-CF-669v-.js";
+import { g as getNameDataTestId } from "./tests/utils-BUwmUA2N.js";
+import clsx from "clsx";
+import { useResponsiveDesktop } from "@m4l/graphics";
+function Icon(props) {
+  const { src, size = "small", rotationAngle, className } = props;
+  const isDesktop = useResponsiveDesktop();
+  const ownerState = {
+    size: isDesktop ? size : "medium",
+    rotationAngle
+  };
+  const classes = useUtilityClasses(ownerState);
+  return /* @__PURE__ */ jsx(
+    IconRoot,
+    {
+      className: clsx(classes.root, className),
+      ...process.env.NODE_ENV !== "production" ? { [TEST_PROP_ID]: getNameDataTestId("root") } : {},
+      children: /* @__PURE__ */ jsx(
+        DivIcon,
+        {
+          className: classes.icon,
+          src,
+          rotationAngle,
+          ...process.env.NODE_ENV !== "production" ? { [TEST_PROP_ID]: getNameDataTestId("icon") } : {}
+        }
+      )
+    }
+  );
+}
+export {
+  Icon as I
+};

package/components/Icon/classes/constants-BzUJxCsS.js

@@ -0,0 +1,4 @@
+const componentName = "M4LIcon";
+export {
+  componentName as c
+};

package/components/Icon/classes/index-CpBgKs2U.js

@@ -0,0 +1,48 @@
+import { generateUtilityClasses, generateUtilityClass } from "@mui/material";
+import { unstable_composeClasses } from "@mui/base";
+import { c as componentName } from "./constants-BzUJxCsS.js";
+generateUtilityClasses(componentName, [
+  /* elements */
+  "root",
+  "icon",
+  "variantSkeleton",
+  /* states or variants of elements */
+  "sizeExtraSmall",
+  "sizeSmall",
+  "sizeMedium",
+  "sizeLarge",
+  "sizeExtraLarge",
+  "rotationAngle"
+]);
+function getIconClassesUtilityClass(slot) {
+  return generateUtilityClass(componentName, slot);
+}
+const useUtilityClasses = (ownerState) => {
+  const slots = {
+    root: ["root"],
+    icon: [
+      "icon",
+      ownerState.size === "extraSmall" && "sizeExtraSmall",
+      ownerState.size === "small" && "sizeSmall",
+      ownerState.size === "medium" && "sizeMedium",
+      ownerState.size === "large" && "sizeLarge",
+      ownerState.size === "extraLarge" && "sizeExtraLarge",
+      ownerState.rotationAngle ? "rotationAngle" : ""
+    ],
+    variantSkeleton: [
+      "variantSkeleton",
+      ownerState.size === "extraSmall" && "sizeExtraSmall",
+      ownerState.size === "small" && "sizeSmall",
+      ownerState.size === "medium" && "sizeMedium",
+      ownerState.size === "large" && "sizeLarge",
+      ownerState.size === "extraLarge" && "sizeExtraLarge"
+    ]
+  };
+  const composedClasses = unstable_composeClasses(slots, getIconClassesUtilityClass, {});
+  return {
+    ...composedClasses
+  };
+};
+export {
+  useUtilityClasses as u
+};

package/components/Icon/index-l0sNRNKZ.js

@@ -0,0 +1 @@
+

package/components/Icon/styles-CYoc5wsG.js

@@ -0,0 +1,26 @@
+import { styled } from "@mui/material/styles";
+const IconRoot = styled("div")(({ theme }) => ({
+  ...theme.components?.M4LIcon?.styleOverrides
+}));
+const DivIcon = styled("div", {
+  shouldForwardProp: (props) => props !== "src" && props !== "rotationAngle"
+})(({ src, rotationAngle }) => ({
+  maskPosition: "center",
+  maskRepeat: "no-repeat",
+  maskSize: "cover",
+  WebkitMaskRepeat: "no-repeat",
+  mask: `url(${src})`,
+  WebkitMask: `url(${src})`,
+  WebkitMaskSize: "cover",
+  ...rotationAngle && {
+    transform: `rotate(${rotationAngle}deg)`
+  }
+  /*  ...(angleTransition &&
+        rotationAngle && {
+            transition: `transform ${angleTransition}s ease-in-out`,
+        }), */
+}));
+export {
+  DivIcon as D,
+  IconRoot as I
+};

package/components/Icon/tests/constants-C7QTHvgZ.js

@@ -0,0 +1,4 @@
+const ICON_PREFIX = "Icon";
+export {
+  ICON_PREFIX as I
+};

package/components/Icon/tests/utils-BUwmUA2N.js

@@ -0,0 +1,7 @@
+import { I as ICON_PREFIX } from "./constants-C7QTHvgZ.js";
+const getNameDataTestId = (KEY) => {
+  return `${ICON_PREFIX}-${KEY}`;
+};
+export {
+  getNameDataTestId as g
+};

package/components/Icon/types-l0sNRNKZ.js

@@ -0,0 +1 @@
+

package/components/Image/Image-BjqOt3pz.js

@@ -0,0 +1,38 @@
+import { jsx } from "react/jsx-runtime";
+import { I as ImageRoot } from "./styles-BicLK1dh.js";
+import { g as getRatioValues } from "./utils/getRatioValues-Cyvn3Ee3.js";
+import { T as TEST_PROP_ID } from "../../test/constants_no_mock-CF-669v-.js";
+import { g as getNameDataTestId } from "./tests/utils-BCQiWwtM.js";
+import clsx from "clsx";
+import { u as useUtilityClasses } from "./classes/index-1OpZlCW5.js";
+function Image(props) {
+  const { src, alt, width, height, ratio = "1:1", className } = props;
+  const ratioImage = getRatioValues(ratio);
+  const classes = useUtilityClasses();
+  return (
+    /* BaseProvider: Es el contexto de valores propio del componente, se usa para propagar información dentro de su estructura evitando así implementar
+        una asignación por propiedades. */
+    /* @__PURE__ */ jsx(
+      ImageRoot,
+      {
+        className: clsx(classes.root, className),
+        ...process.env.NODE_ENV !== "production" ? { [TEST_PROP_ID]: getNameDataTestId("root") } : {},
+        style: width && height ? { minWidth: width, minHeight: height, width, height } : { width: "100%", height: "100%" },
+        children: /* @__PURE__ */ jsx(
+          "img",
+          {
+            alt,
+            src,
+            className: classes.img,
+            width: !width ? "100%" : ratioImage.width,
+            height: !height ? "100%" : ratioImage.height,
+            ...process.env.NODE_ENV !== "production" ? { [TEST_PROP_ID]: getNameDataTestId("img") } : {}
+          }
+        )
+      }
+    )
+  );
+}
+export {
+  Image as I
+};

package/components/Image/classes/constant-D4zChr5r.js

@@ -0,0 +1,4 @@
+const componentName = "M4LImage";
+export {
+  componentName as c
+};