@fangzsx/component-library 0.0.37 → 0.0.38

package/dist/components/ImageUpload/index.d.ts

@@ -1,5 +1,3 @@
-import { default as React } from 'react';
-
 interface ImageUploadProps {
     label?: string;
     required?: boolean;
@@ -11,5 +9,5 @@ interface ImageUploadProps {
     disabled?: boolean;
     onChange?: (file: File | null, error: string) => void;
 }
-declare const ImageUpload: React.FC<ImageUploadProps>;
-export default ImageUpload;
+export declare function ImageUpload({ label, required, maxSizeMB, acceptedFormats, error, forceError, helperText, disabled, onChange, }: ImageUploadProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/ImageUpload/index.js

@@ -1,59 +1,70 @@
-import { jsx as e, jsxs as t } from "react/jsx-runtime";
+import { jsx as e, jsxs as n } from "react/jsx-runtime";
 import { C as H } from "../../Close-pjIlDyCW.js";
 import { c as M } from "../../createSvgIcon-C0YrvByi.js";
 import { FormControl as P, FormLabel as T, Box as i, Stack as U, Typography as l, IconButton as V, FormHelperText as E } from "@mui/material";
 import { useState as g, useRef as q, useCallback as G } from "react";
 const J = M(/* @__PURE__ */ e("path", {
   d: "M19 5v14H5V5zm0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2m-4.86 8.86-3 3.87L9 13.14 6 17h12z"
-}), "ImageOutlined"), K = (n) => {
-  const a = n.lastIndexOf(".");
-  return a <= 0 ? { baseName: n, extension: "" } : {
-    baseName: n.slice(0, a),
-    extension: n.slice(a)
+}), "ImageOutlined");
+function K(t) {
+  const a = t.lastIndexOf(".");
+  return a <= 0 ? { baseName: t, extension: "" } : {
+    baseName: t.slice(0, a),
+    extension: t.slice(a)
   };
-}, rr = ({
-  label: n = "Logo",
+}
+function rr({
+  label: t = "Logo",
   required: a = !0,
-  maxSizeMB: d = 2,
-  acceptedFormats: s = ["png", "jpg", "jpeg"],
+  maxSizeMB: u = 2,
+  acceptedFormats: c = ["png", "jpg", "jpeg"],
   error: x = "",
   forceError: y = !1,
   helperText: b,
   disabled: o = !1,
-  onChange: c
-}) => {
-  const [v, h] = g(!1), [p, k] = g(null), [O, D] = g(""), m = q(null), w = d * 1024 * 1024, R = s.map((r) => `.${r}`).join(","), C = s.map(
+  onChange: s
+}) {
+  const [v, f] = g(!1), [p, k] = g(null), [O, D] = g(""), d = q(null), w = u * 1024 * 1024, R = c.map((r) => `.${r}`).join(","), C = c.map(
     (r) => `image/${r === "jpg" ? "jpeg" : r}`
   ), j = G(
-    (r) => {
+    function(r) {
       if (!r) return;
-      if (!C.some((f) => r.type === f)) {
-        c?.(null, `Only ${s.join(", ")} files are supported`);
+      if (!C.some((h) => r.type === h)) {
+        s?.(null, `Only ${c.join(", ")} files are supported`);
         return;
       }
       if (r.size > w) {
-        c?.(null, `File size must be less than ${d}MB`);
+        s?.(null, `File size must be less than ${u}MB`);
         return;
       }
       const I = new FileReader();
-      I.onload = (f) => {
-        k(f.target?.result), D(r.name), c?.(r, "");
+      I.onload = function(h) {
+        k(h.target?.result), D(r.name), s?.(r, "");
       }, I.readAsDataURL(r);
     },
-    [C, w, d, s, c]
-  ), S = (r) => {
-    r.preventDefault(), !o && (h(!1), j(r.dataTransfer.files?.[0] ?? null));
-  }, F = (r) => {
-    r.preventDefault(), o || h(!0);
-  }, L = () => h(!1), W = () => {
-    o || m.current?.click();
-  }, z = (r) => {
+    [C, w, u, c, s]
+  );
+  function S(r) {
+    r.preventDefault(), !o && (f(!1), j(r.dataTransfer.files?.[0] ?? null));
+  }
+  function F(r) {
+    r.preventDefault(), o || f(!0);
+  }
+  function L() {
+    f(!1);
+  }
+  function W() {
+    o || d.current?.click();
+  }
+  function z(r) {
     j(r.target.files?.[0] ?? null);
-  }, N = (r) => {
-    r.stopPropagation(), k(null), D(""), c?.(null, ""), m.current && (m.current.value = "");
-  }, u = !!x || y && !p, B = x || (y && !p ? `${n} can't be empty` : ""), { baseName: $, extension: A } = K(O);
-  return /* @__PURE__ */ t(P, { fullWidth: !0, error: u, disabled: o, children: [
-    n && /* @__PURE__ */ e(
+  }
+  function N(r) {
+    r.stopPropagation(), k(null), D(""), s?.(null, ""), d.current && (d.current.value = "");
+  }
+  const m = !!x || y && !p, B = x || (y && !p ? `${t} can't be empty` : ""), { baseName: $, extension: A } = K(O);
+  return /* @__PURE__ */ n(P, { fullWidth: !0, error: m, disabled: o, children: [
+    t && /* @__PURE__ */ e(
       T,
       {
         required: a,
@@ -66,10 +77,10 @@ const J = M(/* @__PURE__ */ e("path", {
           "&.Mui-focused": { color: "text.primary" },
           "&.Mui-error": { color: "text.primary" }
         },
-        children: n
+        children: t
       }
     ),
-    /* @__PURE__ */ t(
+    /* @__PURE__ */ n(
       i,
       {
         onClick: W,
@@ -79,7 +90,7 @@ const J = M(/* @__PURE__ */ e("path", {
         sx: {
           border: 2,
           borderStyle: "dashed",
-          borderColor: u ? "error.main" : v ? "primary.main" : "grey.300",
+          borderColor: m ? "error.main" : v ? "primary.main" : "grey.300",
           borderRadius: 2,
           p: p ? 1.5 : 4,
           textAlign: "center",
@@ -88,7 +99,7 @@ const J = M(/* @__PURE__ */ e("path", {
           transition: "all 0.2s ease",
           opacity: o ? 0.6 : 1,
           "&:hover": o ? {} : {
-            borderColor: u ? "error.main" : "primary.main",
+            borderColor: m ? "error.main" : "primary.main",
             bgcolor: "primary.50"
           }
         },
@@ -96,7 +107,7 @@ const J = M(/* @__PURE__ */ e("path", {
           /* @__PURE__ */ e(
             "input",
             {
-              ref: m,
+              ref: d,
               type: "file",
               accept: R,
               onChange: z,
@@ -104,7 +115,7 @@ const J = M(/* @__PURE__ */ e("path", {
               disabled: o
             }
           ),
-          p ? /* @__PURE__ */ t(U, { direction: "row", alignItems: "center", spacing: 2, children: [
+          p ? /* @__PURE__ */ n(U, { direction: "row", alignItems: "center", spacing: 2, children: [
             /* @__PURE__ */ e(
               i,
               {
@@ -121,8 +132,8 @@ const J = M(/* @__PURE__ */ e("path", {
                 }
               }
             ),
-            /* @__PURE__ */ t(i, { sx: { flex: 1, minWidth: 0, textAlign: "left" }, children: [
-              /* @__PURE__ */ t(
+            /* @__PURE__ */ n(i, { sx: { flex: 1, minWidth: 0, textAlign: "left" }, children: [
+              /* @__PURE__ */ n(
                 l,
                 {
                   variant: "body2",
@@ -175,14 +186,14 @@ const J = M(/* @__PURE__ */ e("path", {
                 children: /* @__PURE__ */ e(H, { fontSize: "small" })
               }
             )
-          ] }) : /* @__PURE__ */ t(i, { children: [
+          ] }) : /* @__PURE__ */ n(i, { children: [
             /* @__PURE__ */ e(
               J,
               {
                 sx: { fontSize: 40, color: "primary.main", mb: 1.5 }
               }
             ),
-            /* @__PURE__ */ t(l, { variant: "body2", color: "text.secondary", gutterBottom: !0, children: [
+            /* @__PURE__ */ n(l, { variant: "body2", color: "text.secondary", gutterBottom: !0, children: [
               "Drop image here or",
               " ",
               /* @__PURE__ */ e(
@@ -197,22 +208,22 @@ const J = M(/* @__PURE__ */ e("path", {
                 }
               )
             ] }),
-            /* @__PURE__ */ t(l, { variant: "caption", color: "text.disabled", display: "block", children: [
+            /* @__PURE__ */ n(l, { variant: "caption", color: "text.disabled", display: "block", children: [
               "File size should be less than ",
-              d,
+              u,
               "MB"
             ] }),
-            /* @__PURE__ */ t(l, { variant: "caption", color: "text.disabled", display: "block", children: [
+            /* @__PURE__ */ n(l, { variant: "caption", color: "text.disabled", display: "block", children: [
               "Supports ",
-              s.join(", ")
+              c.join(", ")
             ] })
           ] })
         ]
       }
     ),
-    (u || b) && /* @__PURE__ */ e(E, { sx: { mt: 0.75, mx: 0 }, children: B || b })
+    (m || b) && /* @__PURE__ */ e(E, { sx: { mt: 0.75, mx: 0 }, children: B || b })
   ] });
-};
+}
 export {
-  rr as default
+  rr as ImageUpload
 };

package/dist/main.d.ts

@@ -7,6 +7,7 @@ export { CheckboxGroup } from './components/CheckboxGroup';
 export { Dropdown } from './components/Dropdown';
 export { DropdownOptions } from './components/DropdownOptions';
 export { FlatBanner } from './components/FlatBanner';
+export { ImageUpload } from './components/ImageUpload';
 export { Label } from './components/Label';
 export { LinearProgress } from './components/LinearProgress';
 export { MediaCardWithAction } from './components/MediaCardWithAction';

package/dist/main.js

@@ -1,38 +1,40 @@
 import { AppBarPublic as e } from "./components/AppBarPublic/index.js";
 import { Banner as p } from "./components/Banner/index.js";
 import { B as m } from "./index-Dnsx2wLn.js";
-import { CheckBox as n } from "./components/Checkbox/index.js";
-import { ScrollableDialog as i } from "./components/Dialog/index.js";
+import { CheckBox as a } from "./components/Checkbox/index.js";
+import { ScrollableDialog as d } from "./components/Dialog/index.js";
 import { CheckboxGroup as l } from "./components/CheckboxGroup/index.js";
 import { Dropdown as B } from "./components/Dropdown/index.js";
 import { DropdownOptions as s } from "./components/DropdownOptions/index.js";
 import { FlatBanner as D } from "./components/FlatBanner/index.js";
-import { Label as h } from "./components/Label/index.js";
-import { LinearProgress as g } from "./components/LinearProgress/index.js";
-import { MediaCardWithAction as A } from "./components/MediaCardWithAction/index.js";
-import { PhoneAndCountryDropdown as F } from "./components/PhoneAndCountryDropdown/index.js";
-import { PromoCode as L } from "./components/PromoCode/index.js";
-import { RadioButtonGroup as T } from "./components/RadioButtonGroup/index.js";
-import { Stepper as I } from "./components/Stepper/index.js";
-import { Text as O } from "./components/Text/index.js";
-import { TextFieldInput as W } from "./components/TextFieldInput/index.js";
+import { ImageUpload as g } from "./components/ImageUpload/index.js";
+import { Label as P } from "./components/Label/index.js";
+import { LinearProgress as A } from "./components/LinearProgress/index.js";
+import { MediaCardWithAction as F } from "./components/MediaCardWithAction/index.js";
+import { PhoneAndCountryDropdown as I } from "./components/PhoneAndCountryDropdown/index.js";
+import { PromoCode as S } from "./components/PromoCode/index.js";
+import { RadioButtonGroup as y } from "./components/RadioButtonGroup/index.js";
+import { Stepper as O } from "./components/Stepper/index.js";
+import { Text as U } from "./components/Text/index.js";
+import { TextFieldInput as j } from "./components/TextFieldInput/index.js";
 export {
   e as AppBarPublic,
   p as Banner,
   m as Button,
-  n as CheckBox,
+  a as CheckBox,
   l as CheckboxGroup,
-  i as Dialog,
+  d as Dialog,
   B as Dropdown,
   s as DropdownOptions,
   D as FlatBanner,
-  h as Label,
-  g as LinearProgress,
-  A as MediaCardWithAction,
-  F as PhoneAndCountryDropdown,
-  L as PromoCode,
-  T as RadioButtonGroup,
-  I as Stepper,
-  O as Text,
-  W as TextFieldInput
+  g as ImageUpload,
+  P as Label,
+  A as LinearProgress,
+  F as MediaCardWithAction,
+  I as PhoneAndCountryDropdown,
+  S as PromoCode,
+  y as RadioButtonGroup,
+  O as Stepper,
+  U as Text,
+  j as TextFieldInput
 };

package/package.json

@@ -2,7 +2,7 @@
   "name": "@fangzsx/component-library",
   "author": "Jay Gilbert Garzon",
   "private": false,
-  "version": "0.0.37",
+  "version": "0.0.38",
   "type": "module",
   "main": "dist/main.js",
   "types": "dist/main.d.ts",