@apexcura/ui-components 0.0.16-Beta67 → 0.0.16-Beta69

package/dist/index.js

@@ -46,7 +46,7 @@ __export(src_exports, {
   Editor: () => Editor2,
   FileUpload: () => FileUpload,
   HorizontalBarChart: () => HorizontalBarChart,
-  Image: () => Image2,
+  Image: () => Image,
   LineChart: () => LineChart,
   MultipleSelectElement: () => MultipleSelectElement,
   Navbar: () => Navbar,
@@ -1029,7 +1029,7 @@ var DateRangePickerElement = (props) => {
 
 // src/Components/Image.tsx
 var import_react24 = __toESM(require("react"));
-var Image2 = (props) => {
+var Image = (props) => {
   return /* @__PURE__ */ import_react24.default.createElement("img", { className: props.className, src: props.img, alt: "image" });
 };
 
@@ -1120,16 +1120,26 @@ var FileUpload = (props) => {
   const { Dragger } = import_antd18.Upload;
   const initialFiles = Array.isArray(props.value) ? props.value : [];
   const [files, setFiles] = (0, import_react27.useState)(initialFiles);
-  const handleChange = ({ fileList }) => {
-    setFiles(fileList);
-    console.log(fileList);
-    if (props.onChange) {
-      props.onChange({
-        name: props.name,
-        value: fileList
-      });
-    }
+  function getBase64(file, callback) {
+    const reader = new FileReader();
+    reader.addEventListener("load", () => callback(reader.result));
+    reader.readAsDataURL(file);
+  }
+  const beforeUpload = (file) => {
+    getBase64(file, (imageUrl) => {
+      const newFile = {
+        uid: file.uid,
+        name: file.name,
+        status: "done",
+        url: imageUrl,
+        thumbUrl: imageUrl,
+        originalFile: file
+      };
+      setFiles((prevFileList) => [...prevFileList, newFile]);
+    });
+    return false;
   };
+  console.log(files);
   const customRequest = (options) => {
     const { onSuccess } = options;
     setTimeout(() => {
@@ -1138,22 +1148,6 @@ var FileUpload = (props) => {
       }
     }, 0);
   };
-  const onPreview = async (file) => {
-    let src = file.url;
-    if (!src) {
-      src = await new Promise((resolve) => {
-        const reader = new FileReader();
-        reader.readAsDataURL(file.originFileObj);
-        reader.onload = () => resolve(reader.result);
-      });
-    }
-    const image = new Image();
-    image.src = src;
-    const imgWindow = window.open(src);
-    if (imgWindow) {
-      imgWindow.document.write(image.outerHTML);
-    }
-  };
   return /* @__PURE__ */ import_react27.default.createElement("div", null, /* @__PURE__ */ import_react27.default.createElement(
     Dragger,
     {
@@ -1163,13 +1157,9 @@ var FileUpload = (props) => {
       maxCount: props.max_count,
       multiple: props.multiple,
       fileList: files,
-      onChange: handleChange,
-      showUploadList: {
-        showPreviewIcon: true,
-        showRemoveIcon: true
-      },
-      customRequest,
-      onPreview
+      beforeUpload,
+      showUploadList: true,
+      customRequest
     },
     /* @__PURE__ */ import_react27.default.createElement("p", null, /* @__PURE__ */ import_react27.default.createElement(import_icons5.InboxOutlined, null)),
     /* @__PURE__ */ import_react27.default.createElement("p", null, "Click or drag file to upload")

package/dist/index.mjs

@@ -957,7 +957,7 @@ var DateRangePickerElement = (props) => {
 
 // src/Components/Image.tsx
 import React23 from "react";
-var Image2 = (props) => {
+var Image = (props) => {
   return /* @__PURE__ */ React23.createElement("img", { className: props.className, src: props.img, alt: "image" });
 };
 
@@ -1048,16 +1048,26 @@ var FileUpload = (props) => {
   const { Dragger } = Upload;
   const initialFiles = Array.isArray(props.value) ? props.value : [];
   const [files, setFiles] = useState8(initialFiles);
-  const handleChange = ({ fileList }) => {
-    setFiles(fileList);
-    console.log(fileList);
-    if (props.onChange) {
-      props.onChange({
-        name: props.name,
-        value: fileList
-      });
-    }
+  function getBase64(file, callback) {
+    const reader = new FileReader();
+    reader.addEventListener("load", () => callback(reader.result));
+    reader.readAsDataURL(file);
+  }
+  const beforeUpload = (file) => {
+    getBase64(file, (imageUrl) => {
+      const newFile = {
+        uid: file.uid,
+        name: file.name,
+        status: "done",
+        url: imageUrl,
+        thumbUrl: imageUrl,
+        originalFile: file
+      };
+      setFiles((prevFileList) => [...prevFileList, newFile]);
+    });
+    return false;
   };
+  console.log(files);
   const customRequest = (options) => {
     const { onSuccess } = options;
     setTimeout(() => {
@@ -1066,22 +1076,6 @@ var FileUpload = (props) => {
       }
     }, 0);
   };
-  const onPreview = async (file) => {
-    let src = file.url;
-    if (!src) {
-      src = await new Promise((resolve) => {
-        const reader = new FileReader();
-        reader.readAsDataURL(file.originFileObj);
-        reader.onload = () => resolve(reader.result);
-      });
-    }
-    const image = new Image();
-    image.src = src;
-    const imgWindow = window.open(src);
-    if (imgWindow) {
-      imgWindow.document.write(image.outerHTML);
-    }
-  };
   return /* @__PURE__ */ React26.createElement("div", null, /* @__PURE__ */ React26.createElement(
     Dragger,
     {
@@ -1091,13 +1085,9 @@ var FileUpload = (props) => {
       maxCount: props.max_count,
       multiple: props.multiple,
       fileList: files,
-      onChange: handleChange,
-      showUploadList: {
-        showPreviewIcon: true,
-        showRemoveIcon: true
-      },
-      customRequest,
-      onPreview
+      beforeUpload,
+      showUploadList: true,
+      customRequest
     },
     /* @__PURE__ */ React26.createElement("p", null, /* @__PURE__ */ React26.createElement(InboxOutlined, null)),
     /* @__PURE__ */ React26.createElement("p", null, "Click or drag file to upload")
@@ -1821,7 +1811,7 @@ export {
   Editor2 as Editor,
   FileUpload,
   HorizontalBarChart,
-  Image2 as Image,
+  Image,
   LineChart,
   MultipleSelectElement,
   Navbar,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@apexcura/ui-components",
-  "version": "0.0.16-Beta67",
+  "version": "0.0.16-Beta69",
   "description": "Apex cura React components library",
   "keywords": [
     "apex cura",