@m4l/components 0.1.23 → 0.1.25

package/components/hook-form/RHFUpload/index.56e2e277.js

@@ -1,239 +0,0 @@
-import { styled as y, FormHelperText as f } from "@mui/material";
-import { useCallback as x } from "react";
-import { useFormContext as v, Controller as C } from "react-hook-form";
-import w from "lodash/isString";
-import { useDropzone as b } from "react-dropzone";
-import { styled as o, alpha as I } from "@mui/material/styles";
-import { I as h } from "../../Image/index.c9da2d5a.js";
-import { useEnvironment as _, useModuleDictionary as R } from "@m4l/core";
-import { jsxs as a, Fragment as j, jsx as e } from "react/jsx-runtime";
-const D = o("div")(({
-  theme: t
-}) => ({
-  width: "inherit",
-  height: "100%",
-  minWidth: t.spacing(20),
-  margin: "auto",
-  borderRadius: t.spacing(1),
-  padding: t.spacing(1),
-  border: `1px dashed ${t.palette.grey[50032]}`
-})), S = o("div")(({
-  theme: t
-}) => ({
-  zIndex: 0,
-  width: "100%",
-  height: "100%",
-  outline: "none",
-  display: "flex",
-  overflow: "hidden",
-  borderRadius: t.spacing(1),
-  position: "relative",
-  alignItems: "center",
-  justifyContent: "center",
-  "& > *": {
-    width: "100%",
-    height: "100%"
-  },
-  "&:hover": {
-    cursor: "pointer",
-    "& .placeholder": {
-      zIndex: 9
-    }
-  }
-})), U = o("div")(({
-  theme: t
-}) => ({
-  "&:hover": {
-    opacity: 1
-  },
-  display: "flex",
-  justifyContent: "center",
-  position: "absolute",
-  zIndex: "2",
-  inset: "0",
-  transition: t.transitions.create("opacity", {
-    easing: t.transitions.easing.easeInOut,
-    duration: t.transitions.duration.shorter
-  }),
-  overflow: "auto"
-})), W = o("div")(({
-  theme: t
-}) => ({
-  padding: t.spacing(3, 5),
-  display: "flex",
-  flexWrap: "wrap",
-  justifyContent: "center",
-  width: "100%",
-  height: "100%",
-  gap: t.spacing(3)
-})), F = o("div")(({
-  theme: t
-}) => ({
-  display: "flex",
-  justifyContent: "center",
-  flexDirection: "column",
-  gap: t.spacing(3)
-})), z = o("span")(({
-  theme: t
-}) => ({
-  ...t.typography.subtitle2,
-  width: "fit-content"
-})), P = o("span")(({
-  theme: t
-}) => ({
-  ...t.typography.body2,
-  minWidth: t.spacing(20)
-})), $ = o("span")(({
-  theme: t
-}) => ({
-  ...t.typography.caption,
-  width: "fit-content"
-})), H = o("div")(({
-  theme: t
-}) => ({
-  display: "flex",
-  alignItems: "center",
-  maxWidth: t.spacing(20)
-}));
-o("div")(() => ({
-  width: "100%",
-  height: "100%",
-  position: "absolute",
-  inset: "0",
-  display: "flex",
-  justifyContent: "center",
-  alignItems: "center"
-}));
-function L({
-  error: t,
-  file: i,
-  helperText: s,
-  sx: l,
-  ...c
-}) {
-  const {
-    getRootProps: r,
-    getInputProps: n,
-    isDragActive: d,
-    isDragReject: g
-  } = b({
-    multiple: !1,
-    ...c
-  }), {
-    host_static_assets: u,
-    environment_assets: m
-  } = _(), {
-    getLabel: p
-  } = R();
-  return /* @__PURE__ */ a(j, {
-    children: [/* @__PURE__ */ e(D, {
-      id: "RootStyle",
-      sx: {
-        ...(g || t) && {
-          borderColor: "error.light"
-        },
-        ...l
-      },
-      children: /* @__PURE__ */ a(S, {
-        id: "DropZoneStyle",
-        ...r(),
-        sx: {
-          ...d && {
-            opacity: 0.72
-          }
-        },
-        children: [/* @__PURE__ */ e("input", {
-          ...n()
-        }), i && /* @__PURE__ */ e(h, {
-          alt: "avatar",
-          src: w(i) ? i : i.preview || "",
-          width: "100%"
-        }), /* @__PURE__ */ e(U, {
-          id: "PlaceholderStyle",
-          className: "placeholder",
-          sx: {
-            ...i ? {
-              bgcolor: I("#161C24", 0.72),
-              color: "common.white",
-              opacity: 0
-            } : {
-              opacity: 1
-            },
-            ...(g || t) && {
-              bgcolor: "error.lighter",
-              borderColor: "error.light",
-              color: "error.main"
-            }
-          },
-          children: /* @__PURE__ */ a(W, {
-            className: "ContainerUploadBody",
-            children: [/* @__PURE__ */ e(H, {
-              children: /* @__PURE__ */ e(h, {
-                src: `${u}/${m}/frontend/components/upload_image/assets/img/upload_image_illustration.svg`,
-                width: "100%",
-                height: "auto"
-              })
-            }), /* @__PURE__ */ a(F, {
-              children: [/* @__PURE__ */ e(z, {
-                children: p(i ? "upload_image.title_update" : "upload_image.title_upload")
-              }), /* @__PURE__ */ e(P, {
-                children: p("upload_image.description")
-              }), /* @__PURE__ */ e($, {
-                children: p("upload_image.conditions")
-              })]
-            })]
-          })
-        })]
-      })
-    }), s && s]
-  });
-}
-const O = y("div")(() => ({
-  width: "inherit",
-  height: "inherit",
-  padding: "1px"
-}));
-function q({
-  name: t,
-  ...i
-}) {
-  const {
-    control: s,
-    setValue: l
-  } = v(), c = x((r) => {
-    const n = r[0];
-    n && l(t, Object.assign(n, {
-      preview: URL.createObjectURL(n)
-    }));
-  }, [l]);
-  return /* @__PURE__ */ e(C, {
-    name: t,
-    control: s,
-    render: ({
-      field: r,
-      fieldState: {
-        error: n
-      }
-    }) => {
-      const d = !!n && !r.value;
-      return /* @__PURE__ */ a(O, {
-        children: [/* @__PURE__ */ e(L, {
-          onDrop: c,
-          error: d,
-          ...i,
-          file: r.value
-        }), d && /* @__PURE__ */ e(f, {
-          error: !0,
-          sx: {
-            px: 2,
-            textAlign: "center"
-          },
-          children: n.message
-        })]
-      });
-    }
-  });
-}
-export {
-  q as R
-};