@m4l/components 9.2.33 → 9.2.35

package/components/hook-form/RHFUpload/RHFUploadImage/subcomponents/UploadImage/UploadImage.js

@@ -0,0 +1,113 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useHostTools, useEnvironment, useModuleDictionary } from "@m4l/core";
+import isString from "lodash-es/isString";
+import { useDropzone } from "react-dropzone";
+import { g as getPropDataTestId } from "../../../../../../test/getNameDataTestId.js";
+import { I as Image } from "../../../../../Image/Image.js";
+import { R as RHF_UPLOAD_IMAGE_KEY_COMPONENT } from "../../constants.js";
+import { U as UploadImageSlots } from "../../slots/RHFUploadImageEnum.js";
+import { U as UploadImageRootStyled, C as ContentModuleLayoutStyled, a as ContainPreviewStyled, I as IconButtonRemoveStyled, b as ContentImageStyled, c as ContentImageTextStyled, T as TypographyStyled, d as ContentMessageStyled, D as DividerStyled, B as ButtonStyled } from "../../slots/RHFUploadImageSlots.js";
+import { g as getUploadImageDictionary, C as COMPONENTS_DICTIONARY_KEYS } from "./dictionary.js";
+import { u as useComponentSize } from "../../../../../../hooks/useComponentSize/useComponentSize.js";
+import { g as getComponentClasses } from "../../../../../../utils/getComponentSlotRoot.js";
+import { T as Typography } from "../../../../../mui_extended/Typography/Typography.js";
+const UploadImage = (props) => {
+  const { file, size, onDrop, onRemove, maxSize, dataTestId, error = false, multiple, ...other } = props;
+  const { currentSize } = useComponentSize(size);
+  const { toast } = useHostTools();
+  const adjustedSize = currentSize === "small" || currentSize === "medium" ? currentSize : "medium";
+  const { getInputProps, getRootProps, open, isDragReject, isDragAccept } = useDropzone({
+    multiple: false,
+    accept: { "image/png": [], "image/jpeg": [], "image/gif": [] },
+    onDrop,
+    /**
+     * onDropRejected es una función que se ejecuta cuando el archivo no es aceptado
+     */
+    onDropRejected: (fileReject) => {
+      fileReject.forEach((rejection) => {
+        toast(
+          { title: rejection.file.name, description: rejection.errors[0].message },
+          { type: "error" }
+        );
+      });
+    },
+    noClick: true,
+    maxSize,
+    ...other
+  });
+  const { host_static_assets, environment_assets } = useEnvironment();
+  const { getLabel } = useModuleDictionary();
+  const ownerState = {
+    isDragReject,
+    isDragAccept,
+    error
+  };
+  const classses = getComponentClasses(RHF_UPLOAD_IMAGE_KEY_COMPONENT, UploadImageSlots);
+  return /* @__PURE__ */ jsx(
+    UploadImageRootStyled,
+    {
+      className: classses.uploadImageRoot,
+      ownerState: { ...ownerState },
+      ...getPropDataTestId(RHF_UPLOAD_IMAGE_KEY_COMPONENT, UploadImageSlots.uploadImageRoot, dataTestId),
+      children: /* @__PURE__ */ jsxs(
+        ContentModuleLayoutStyled,
+        {
+          ...getPropDataTestId(RHF_UPLOAD_IMAGE_KEY_COMPONENT, UploadImageSlots.contentModuleLayout, dataTestId),
+          ...getRootProps(),
+          children: [
+            file ? /* @__PURE__ */ jsxs(ContainPreviewStyled, { ownerState: {}, children: [
+              /* @__PURE__ */ jsx(
+                IconButtonRemoveStyled,
+                {
+                  ownerState: {},
+                  variant: "contained",
+                  icon: `${host_static_assets}/${environment_assets}/frontend/components/chip/assets/icons/closeSmall.svg`,
+                  onClick: onRemove,
+                  size: adjustedSize
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                Image,
+                {
+                  src: isString(file) ? file : file.preview || "",
+                  enableIntersectionObserver: false
+                }
+              )
+            ] }) : /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column", justifyContent: "center", alignItems: "center" }, children: [
+              /* @__PURE__ */ jsx(
+                "input",
+                {
+                  ...getInputProps()
+                }
+              ),
+              /* @__PURE__ */ jsxs(ContentImageStyled, { ownerState: {}, children: [
+                /* @__PURE__ */ jsxs(ContentImageTextStyled, { ownerState: {}, children: [
+                  /* @__PURE__ */ jsx(
+                    Image,
+                    {
+                      height: 100,
+                      width: 100,
+                      sizes: size,
+                      src: `${host_static_assets}/${environment_assets}/frontend/components/RHFUploadImage/assets/icons/uploadImage.svg`
+                    }
+                  ),
+                  /* @__PURE__ */ jsx(Typography, { skeletonWidth: 100, variant: "bodyDens", size: adjustedSize, children: getLabel(getUploadImageDictionary(COMPONENTS_DICTIONARY_KEYS.title_upload)) })
+                ] }),
+                /* @__PURE__ */ jsx(TypographyStyled, { skeletonWidth: 200, skeletonRows: 2, ownerState: {}, variant: "body", size: adjustedSize, children: getLabel(getUploadImageDictionary(COMPONENTS_DICTIONARY_KEYS.description)) }),
+                /* @__PURE__ */ jsxs(ContentMessageStyled, { ownerState: {}, children: [
+                  /* @__PURE__ */ jsx(DividerStyled, { ownerState: {}, orientation: "horizontal", customVariant: "solid", size: adjustedSize }),
+                  /* @__PURE__ */ jsx(TypographyStyled, { skeletonWidth: 10, ownerState: {}, variant: "body", size: adjustedSize, children: getLabel(getUploadImageDictionary(COMPONENTS_DICTIONARY_KEYS.divider_text)) }),
+                  /* @__PURE__ */ jsx(DividerStyled, { ownerState: {}, orientation: "horizontal", customVariant: "solid", size: adjustedSize })
+                ] })
+              ] })
+            ] }),
+            !file ? /* @__PURE__ */ jsx(ButtonStyled, { ownerState: {}, variant: "contained", color: "primary", onClick: open, label: getLabel(getUploadImageDictionary(COMPONENTS_DICTIONARY_KEYS.click_button)), size: adjustedSize }) : null
+          ]
+        }
+      )
+    }
+  );
+};
+export {
+  UploadImage as U
+};

package/components/hook-form/RHFUpload/RHFUploadImage/subcomponents/UploadImage/dictionary.d.ts

@@ -0,0 +1,10 @@
+export declare const UPLOAD_IMAGE_DICTIONARY_ID = "rhf_uploadimage";
+export declare function getUploadImageComponentsDictionary(): string[];
+export declare const COMPONENTS_DICTIONARY_KEYS: {
+    readonly click_button: "click_button";
+    readonly description: "description";
+    readonly title_upload: "title_upload";
+    readonly divider_text: "divider_text";
+};
+export type TypeDictionary = typeof COMPONENTS_DICTIONARY_KEYS;
+export declare const getUploadImageDictionary: (key: keyof TypeDictionary) => string;

package/components/hook-form/RHFUpload/RHFUploadImage/subcomponents/UploadImage/dictionary.js

@@ -0,0 +1,14 @@
+const UPLOAD_IMAGE_DICTIONARY_ID = "rhf_uploadimage";
+const COMPONENTS_DICTIONARY_KEYS = {
+  click_button: "click_button",
+  description: "description",
+  title_upload: "title_upload",
+  divider_text: "divider_text"
+};
+const getUploadImageDictionary = (key) => {
+  return `${UPLOAD_IMAGE_DICTIONARY_ID}.${key}`;
+};
+export {
+  COMPONENTS_DICTIONARY_KEYS as C,
+  getUploadImageDictionary as g
+};

package/components/hook-form/RHFUpload/RHFUploadImage/subcomponents/UploadImage/tests/UploadImage.test.d.ts

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

package/components/hook-form/RHFUpload/RHFUploadImage/subcomponents/UploadImage/types.d.ts

@@ -1,16 +1,32 @@
-import { ReactNode } from 'react';
-import { DropzoneOptions } from 'react-dropzone';
+import { Sizes } from '@m4l/styles';
 import { SxProps } from '@mui/material';
 import { Theme } from '@mui/material/styles';
+import { DropzoneOptions } from 'react-dropzone';
 import { CustomFile } from '../../../types';
 export interface UploadImageProps extends DropzoneOptions {
     error?: boolean;
+    /**
+     * file para mostrar la imagen
+     */
     file: CustomFile | string | null;
-    helperText?: ReactNode;
+    /**
+     * sx para el componente
+     */
     sx?: SxProps<Theme>;
-}
-export interface OwnerState {
-    isDragReject?: boolean;
-    isDragActive?: boolean;
-    hasFile: string | CustomFile | null;
+    /**
+     * Tamaño del componente
+     */
+    size?: Extract<Sizes, 'small' | 'medium'>;
+    /**
+     * onRemove es una función que se ejecuta cuando se elimina la imagen
+     */
+    onRemove: () => void;
+    /**
+     * isDragActive es una propiedad booleana que indica si el componente está en estado de arrastre
+     */
+    isDragAccept?: boolean;
+    /**
+     * dataTestId
+     */
+    dataTestId?: string;
 }

package/components/hook-form/RHFUpload/RHFUploadImage/tests/RHFUploadImage.test.d.ts

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

package/components/hook-form/RHFUpload/RHFUploadImage/types.d.ts

@@ -1,14 +1,16 @@
-import { ReactNode } from 'react';
-import { DropzoneOptions } from 'react-dropzone';
-import { CustomFile } from '../types';
-import { SxProps } from '@mui/material';
 import { Theme } from '@mui/material/styles';
-export interface UploadImageProps extends DropzoneOptions {
-    error?: boolean;
-    file: CustomFile | string | null;
-    helperText?: ReactNode;
-    sx?: SxProps<Theme>;
-}
-export interface RHFUploadImageProps extends Omit<UploadImageProps, 'file' | 'onDrop'> {
+import { OverridesStyleRules } from '@mui/material/styles/overrides';
+import { LabelProps } from 'src/components/Label';
+import { RHF_UPLOAD_IMAGE_KEY_COMPONENT } from './constants';
+import { UploadImageSlots as Slots } from './slots/RHFUploadImageEnum';
+import { UploadImageProps } from './subcomponents/UploadImage/types';
+export interface RHFUploadImageProps extends Omit<UploadImageProps, 'file' | 'onDrop' | 'onRemove'>, Omit<LabelProps, 'size' | 'error' | 'disabled' | 'children'> {
     name: string;
 }
+export type RHFUploadImageSlotsType = keyof typeof Slots;
+export type RHFUploadImageOwnerState = {
+    isDragAccept: boolean;
+    isDragReject: boolean;
+    error: boolean;
+};
+export type RHFUploadImageStyles = OverridesStyleRules<RHFUploadImageSlotsType, typeof RHF_UPLOAD_IMAGE_KEY_COMPONENT, Theme>;

package/components/mui_extended/Divider/Divider.js

@@ -0,0 +1,38 @@
+import { jsx } from "react/jsx-runtime";
+import clsx from "clsx";
+import { D as DividerRootStyled, a as DividerStyled } from "./slots/DividerSlots.js";
+import { u as useComponentSize } from "../../../hooks/useComponentSize/useComponentSize.js";
+const Divider = (props) => {
+  const {
+    className,
+    size = "medium",
+    orientation = "vertical",
+    customVariant = "dash",
+    ...other
+  } = props;
+  const { currentSize } = useComponentSize(size);
+  const normalizedSize = currentSize === "large" ? "medium" : currentSize;
+  const ownerState = {
+    orientation,
+    customVariant,
+    size: normalizedSize
+  };
+  return /* @__PURE__ */ jsx(
+    DividerRootStyled,
+    {
+      ownerState: { ...ownerState },
+      className: clsx(className),
+      children: /* @__PURE__ */ jsx(
+        DividerStyled,
+        {
+          ownerState: { ...ownerState },
+          orientation,
+          ...other
+        }
+      )
+    }
+  );
+};
+export {
+  Divider as D
+};

package/components/mui_extended/Divider/Divider.styles.js

@@ -0,0 +1,51 @@
+import { a as getHeightSizeStyles } from "../../../utils/getSizeStyles/getSizeStyles.js";
+const dividerStyles = {
+  /**
+   * 🧮 Estilos para el Root del componente `Divider`. 🧮
+   */
+  root: ({ theme, ownerState }) => ({
+    display: "flex",
+    justifyContent: "center",
+    alignItems: "center",
+    position: "relative",
+    ...getHeightSizeStyles(
+      theme.generalSettings.isMobile,
+      ownerState.size || "medium",
+      "action",
+      (dynamicSize) => ({
+        ...ownerState.orientation === "horizontal" && {
+          height: dynamicSize,
+          width: "100%"
+        },
+        ...ownerState.orientation === "vertical" && {
+          width: dynamicSize,
+          height: "100%"
+        }
+      })
+    )
+  }),
+  /**
+   * Divider Styles
+   */
+  /*
+  * ➗ Estilos del Divider ➗ */
+  /**
+   * Styles for the Divider component.
+   * @param {object} ownerState - The state of the owner component.
+   * @param {object} theme - The theme object.
+   * @returns {object} The styles for the Divider component.
+   */
+  divider: ({ ownerState, theme }) => ({
+    position: "absolute",
+    top: ownerState.orientation === "horizontal" ? "50%" : "0",
+    left: ownerState.orientation === "vertical" ? "50%" : "0",
+    transform: ownerState.orientation === "horizontal" ? "translateY(-50%)" : "translateX(0%)",
+    width: ownerState.orientation === "horizontal" ? "100%" : "1px",
+    height: ownerState.orientation === "vertical" ? "100%" : "1px",
+    borderColor: theme.vars.palette.border.secondary,
+    borderStyle: ownerState.customVariant === "dash" ? "dashed" : "solid"
+  })
+};
+export {
+  dividerStyles as d
+};

package/components/mui_extended/Divider/constants.js

@@ -0,0 +1,4 @@
+const DIVIDER_KEY_COMPONENT = "M4LDivider";
+export {
+  DIVIDER_KEY_COMPONENT as D
+};

package/components/mui_extended/Divider/slots/DividerEnum.js

@@ -0,0 +1,8 @@
+var DividerSlots = /* @__PURE__ */ ((DividerSlots2) => {
+  DividerSlots2["root"] = "root";
+  DividerSlots2["divider"] = "divider";
+  return DividerSlots2;
+})(DividerSlots || {});
+export {
+  DividerSlots as D
+};

package/components/mui_extended/Divider/slots/DividerSlots.js

@@ -0,0 +1,17 @@
+import { styled } from "@mui/material/styles";
+import { Divider } from "@mui/material";
+import { D as DIVIDER_KEY_COMPONENT } from "../constants.js";
+import { d as dividerStyles } from "../Divider.styles.js";
+import { D as DividerSlots } from "./DividerEnum.js";
+const DividerRootStyled = styled("div", {
+  name: DIVIDER_KEY_COMPONENT,
+  slot: DividerSlots.root
+})(dividerStyles?.root);
+const DividerStyled = styled(Divider, {
+  name: DIVIDER_KEY_COMPONENT,
+  slot: DividerSlots.divider
+})(dividerStyles?.divider);
+export {
+  DividerRootStyled as D,
+  DividerStyled as a
+};

package/package.json

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

package/storybook/hook-form/RHFUploadImage/RHFUploadImage.stories.d.ts

@@ -0,0 +1,8 @@
+import { Meta, StoryObj } from '@storybook/react';
+import { RHFUploadImage } from '../../../src/components/hook-form/RHFUpload/RHFUploadImage';
+declare const meta: Meta<typeof RHFUploadImage>;
+type Story = StoryObj<typeof RHFUploadImage>;
+export default meta;
+export declare const RHFUploadImageDefault: Story;
+export declare const RHFUploadImageWithError: Story;
+export declare const Skeleton: Story;

package/components/hook-form/RHFUpload/RHFUploadImage/classes/constants.d.ts

@@ -1 +0,0 @@
-export declare const componentName = "M4LRHFUploadImage";

package/components/hook-form/RHFUpload/RHFUploadImage/classes/constants.js

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

package/components/hook-form/RHFUpload/RHFUploadImage/classes/index.d.ts

@@ -1,22 +0,0 @@
-import { RHFUploadImageClassesType } from './types';
-import { OwnerState } from '../subcomponents/UploadImage/types';
-export declare const RHFUploadImageClasses: RHFUploadImageClassesType;
-export declare function getRHFUploadImagebUtilityClass(slot: string): string;
-/**
- * TODO: Documentar
- */
-export declare const RHFUploadImageUtilityClasses: (ownerState: OwnerState) => {
-    skeleton: string;
-    root: string;
-    dropZoneStyle: string;
-    containerFileImage: string;
-    placeHolder: string;
-    containerUploadBoddy: string;
-    containerBodyImage: string;
-    containerMessage: string;
-    containerTitle: string;
-    containerDescription: string;
-    containerConditions: string;
-    containerUploadImage: string;
-    inputDropZone: string;
-};

package/components/hook-form/RHFUpload/RHFUploadImage/classes/index.js

@@ -1,57 +0,0 @@
-import { generateUtilityClasses, generateUtilityClass } from "@mui/material";
-import { unstable_composeClasses } from "@mui/base";
-import { c as componentName } from "./constants.js";
-generateUtilityClasses(
-  componentName,
-  [
-    /* elements */
-    "root",
-    "dropZoneStyle",
-    "containerFileImage",
-    "placeHolder",
-    "containerUploadBoddy",
-    "containerBodyImage",
-    "containerMessage",
-    "containerTitle",
-    "containerDescription",
-    "containerConditions",
-    "containerUploadImage",
-    "string",
-    "skeleton",
-    "inputDropZone",
-    /* states or variants of elements */
-    "stateError"
-  ]
-);
-function getRHFUploadImagebUtilityClass(slot) {
-  return generateUtilityClass(componentName, slot);
-}
-const RHFUploadImageUtilityClasses = (ownerState) => {
-  const slots = {
-    root: [
-      "root",
-      ownerState.isDragReject && "stateError",
-      ownerState.isDragActive && "stateActive",
-      ownerState.hasFile && "hasFile"
-    ],
-    dropZoneStyle: ["dropZoneStyle"],
-    containerFileImage: ["containerFileImage"],
-    placeHolder: ["placeHolder"],
-    containerUploadBoddy: ["containerUploadBoddy"],
-    containerBodyImage: ["containerBodyImage"],
-    containerMessage: ["containerMessage"],
-    containerTitle: ["containerTitle"],
-    containerDescription: ["containerDescription"],
-    containerConditions: ["containerConditions"],
-    containerUploadImage: ["containerUploadImage"],
-    skeleton: ["skeleton"],
-    inputDropZone: ["inputDropZone"]
-  };
-  const composedClasses = unstable_composeClasses(slots, getRHFUploadImagebUtilityClass, {});
-  return {
-    ...composedClasses
-  };
-};
-export {
-  RHFUploadImageUtilityClasses as R
-};

package/components/hook-form/RHFUpload/RHFUploadImage/classes/types.d.ts

@@ -1,18 +0,0 @@
-import { RHFUploadImageUtilityClasses } from '.';
-export interface RHFUploadImageClassesType {
-    root: string;
-    dropZoneStyle: string;
-    containerFileImage: string;
-    placeHolder: string;
-    containerUploadBoddy: string;
-    containerBodyImage: string;
-    containerMessage: string;
-    containerTitle: string;
-    containerDescription: string;
-    containerConditions: string;
-    containerUploadImage: string;
-    skeleton: string;
-    inputDropZone: string;
-}
-export type RHFUploadImageClassesKey = keyof RHFUploadImageClassesType;
-export type Classes = ReturnType<typeof RHFUploadImageUtilityClasses>;

package/components/hook-form/RHFUpload/RHFUploadImage/styles.d.ts

@@ -1 +0,0 @@
-export declare const WrapperRHFUploadImage: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/components/hook-form/RHFUpload/RHFUploadImage/styles.js

@@ -1,9 +0,0 @@
-import { styled } from "@mui/material";
-const WrapperRHFUploadImage = styled("div")(() => ({
-  width: "inherit",
-  height: "inherit",
-  padding: "1px"
-}));
-export {
-  WrapperRHFUploadImage as W
-};

package/components/hook-form/RHFUpload/RHFUploadImage/subcomponents/UploadImage/index.d.ts

@@ -1,5 +0,0 @@
-import { UploadImageProps } from './types';
-/**
- * TODO: Documentar
- */
-export default function UploadImage({ error, file, helperText, sx, ...other }: UploadImageProps): import("react/jsx-runtime").JSX.Element;

package/components/hook-form/RHFUpload/RHFUploadImage/subcomponents/UploadImage/index.js

@@ -1,146 +0,0 @@
-import { jsx, jsxs, Fragment } from "react/jsx-runtime";
-import isString from "lodash-es/isString";
-import { useDropzone } from "react-dropzone";
-import { I as Image } from "../../../../../Image/Image.js";
-import { useEnvironment, useModuleDictionary, useModuleSkeleton } from "@m4l/core";
-import { U as UploadImageRoot } from "./styles.js";
-import { S as SkeletonUploadImage } from "./subcomponents/Skeleton/index.js";
-import { R as RHFUploadImageUtilityClasses } from "../../classes/index.js";
-import { g as getNameRHFUploadImageDataTestId } from "../../tests/utils.js";
-import { T as TEST_PROP_ID } from "../../../../../../test/constants_no_mock.js";
-import { T as Typography } from "../../../../../mui_extended/Typography/Typography.js";
-import { B as Button } from "../../../../../mui_extended/Button/Button.js";
-function UploadImage({ error, file, helperText, sx, ...other }) {
-  const { getRootProps, getInputProps, isDragActive, isDragReject, open } = useDropzone({
-    multiple: false,
-    ...other
-  });
-  const { host_static_assets, environment_assets } = useEnvironment();
-  const { getLabel } = useModuleDictionary();
-  const isSkeleton = useModuleSkeleton();
-  const ownerSate = {
-    isDragReject: isDragReject || error,
-    isDragActive,
-    hasFile: file
-  };
-  const classes = RHFUploadImageUtilityClasses(ownerSate);
-  return /* @__PURE__ */ jsx(
-    UploadImageRoot,
-    {
-      className: classes.root,
-      ...process.env.NODE_ENV !== "production" ? { [TEST_PROP_ID]: getNameRHFUploadImageDataTestId("root") } : {},
-      children: !isSkeleton ? /* @__PURE__ */ jsxs(Fragment, { children: [
-        "está sin skeleton",
-        /* @__PURE__ */ jsx(
-          "div",
-          {
-            className: classes.containerUploadImage,
-            ...process.env.NODE_ENV !== "production" ? {
-              [TEST_PROP_ID]: getNameRHFUploadImageDataTestId("containerUploadImage")
-            } : {},
-            children: /* @__PURE__ */ jsxs(
-              "div",
-              {
-                className: classes.dropZoneStyle,
-                ...getRootProps(),
-                ...process.env.NODE_ENV !== "production" ? {
-                  [TEST_PROP_ID]: getNameRHFUploadImageDataTestId("dropZoneStyle")
-                } : {},
-                children: [
-                  /* @__PURE__ */ jsx(
-                    "input",
-                    {
-                      ...getInputProps(),
-                      className: classes.inputDropZone,
-                      ...process.env.NODE_ENV !== "production" ? {
-                        [TEST_PROP_ID]: getNameRHFUploadImageDataTestId("inputDropZone")
-                      } : {}
-                    }
-                  ),
-                  file && /* @__PURE__ */ jsx(
-                    "div",
-                    {
-                      className: classes.containerFileImage,
-                      ...process.env.NODE_ENV !== "production" ? {
-                        [TEST_PROP_ID]: getNameRHFUploadImageDataTestId("containerFileImage")
-                      } : {},
-                      children: /* @__PURE__ */ jsx(
-                        Image,
-                        {
-                          alt: "bgImageUploadImage",
-                          src: isString(file) ? file : file.preview || ""
-                        }
-                      )
-                    }
-                  ),
-                  /* @__PURE__ */ jsx(
-                    "div",
-                    {
-                      className: classes.placeHolder,
-                      ...process.env.NODE_ENV !== "production" ? {
-                        [TEST_PROP_ID]: getNameRHFUploadImageDataTestId("placeHolder")
-                      } : {},
-                      children: /* @__PURE__ */ jsxs(
-                        "div",
-                        {
-                          className: classes.containerUploadBoddy,
-                          ...process.env.NODE_ENV !== "production" ? {
-                            [TEST_PROP_ID]: getNameRHFUploadImageDataTestId("containerUploadBoddy")
-                          } : {},
-                          children: [
-                            /* @__PURE__ */ jsx(
-                              "div",
-                              {
-                                className: classes.containerBodyImage,
-                                ...process.env.NODE_ENV !== "production" ? {
-                                  [TEST_PROP_ID]: getNameRHFUploadImageDataTestId("containerBodyImage")
-                                } : {},
-                                children: /* @__PURE__ */ jsx(
-                                  Image,
-                                  {
-                                    src: `${host_static_assets}/${environment_assets}/frontend/components/upload_image/assets/img/upload_image_illustration.svg`
-                                  }
-                                )
-                              }
-                            ),
-                            /* @__PURE__ */ jsxs(
-                              "div",
-                              {
-                                className: classes.containerMessage,
-                                ...process.env.NODE_ENV !== "production" ? {
-                                  [TEST_PROP_ID]: getNameRHFUploadImageDataTestId("containerMessage")
-                                } : {},
-                                children: [
-                                  /* @__PURE__ */ jsx(
-                                    Typography,
-                                    {
-                                      className: classes.containerTitle,
-                                      variant: "subtitle",
-                                      skeletonWidth: "150px",
-                                      children: getLabel("upload_image.title_upload")
-                                    }
-                                  ),
-                                  /* @__PURE__ */ jsx(Typography, { className: classes.containerDescription, variant: "body", children: getLabel("upload_image.description") }),
-                                  /* @__PURE__ */ jsx(Typography, { className: classes.containerConditions, variant: "body", children: getLabel("upload_image.conditions") }),
-                                  /* @__PURE__ */ jsx(Button, { onClick: open, label: getLabel("upload_image.label_button") })
-                                ]
-                              }
-                            )
-                          ]
-                        }
-                      )
-                    }
-                  )
-                ]
-              }
-            )
-          }
-        ),
-        helperText && helperText
-      ] }) : /* @__PURE__ */ jsx(SkeletonUploadImage, { classes: classes.skeleton })
-    }
-  );
-}
-export {
-  UploadImage as U
-};

package/components/hook-form/RHFUpload/RHFUploadImage/subcomponents/UploadImage/styles.d.ts

@@ -1 +0,0 @@
-export declare const UploadImageRoot: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material/styles').Theme>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/components/hook-form/RHFUpload/RHFUploadImage/subcomponents/UploadImage/styles.js

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

package/components/hook-form/RHFUpload/RHFUploadImage/subcomponents/UploadImage/subcomponents/Skeleton/index.d.ts

@@ -1,5 +0,0 @@
-import { SkeletonUploadImageProps } from './types';
-/**
- * TODO: Documentar
- */
-export declare const SkeletonUploadImage: (props: SkeletonUploadImageProps) => import("react/jsx-runtime").JSX.Element;