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

package/dist/index.js

@@ -46,7 +46,7 @@ __export(src_exports, {
   Editor: () => Editor2,
   FileUpload: () => FileUpload,
   HorizontalBarChart: () => HorizontalBarChart,
-  Image: () => Image,
+  Image: () => Image2,
   LineChart: () => LineChart,
   MultipleSelectElement: () => MultipleSelectElement,
   Navbar: () => Navbar,
@@ -1029,7 +1029,7 @@ var DateRangePickerElement = (props) => {
 
 // src/Components/Image.tsx
 var import_react24 = __toESM(require("react"));
-var Image = (props) => {
+var Image2 = (props) => {
   return /* @__PURE__ */ import_react24.default.createElement("img", { className: props.className, src: props.img, alt: "image" });
 };
 
@@ -1122,6 +1122,7 @@ var FileUpload = (props) => {
   const [files, setFiles] = (0, import_react27.useState)(initialFiles);
   const handleChange = ({ fileList }) => {
     setFiles(fileList);
+    console.log(fileList);
     if (props.onChange) {
       props.onChange({
         name: props.name,
@@ -1137,6 +1138,22 @@ 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,
     {
@@ -1147,8 +1164,12 @@ var FileUpload = (props) => {
       multiple: props.multiple,
       fileList: files,
       onChange: handleChange,
-      showUploadList: true,
-      customRequest
+      showUploadList: {
+        showPreviewIcon: true,
+        showRemoveIcon: true
+      },
+      customRequest,
+      onPreview
     },
     /* @__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 Image = (props) => {
+var Image2 = (props) => {
   return /* @__PURE__ */ React23.createElement("img", { className: props.className, src: props.img, alt: "image" });
 };
 
@@ -1050,6 +1050,7 @@ var FileUpload = (props) => {
   const [files, setFiles] = useState8(initialFiles);
   const handleChange = ({ fileList }) => {
     setFiles(fileList);
+    console.log(fileList);
     if (props.onChange) {
       props.onChange({
         name: props.name,
@@ -1065,6 +1066,22 @@ 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,
     {
@@ -1075,8 +1092,12 @@ var FileUpload = (props) => {
       multiple: props.multiple,
       fileList: files,
       onChange: handleChange,
-      showUploadList: true,
-      customRequest
+      showUploadList: {
+        showPreviewIcon: true,
+        showRemoveIcon: true
+      },
+      customRequest,
+      onPreview
     },
     /* @__PURE__ */ React26.createElement("p", null, /* @__PURE__ */ React26.createElement(InboxOutlined, null)),
     /* @__PURE__ */ React26.createElement("p", null, "Click or drag file to upload")
@@ -1800,7 +1821,7 @@ export {
   Editor2 as Editor,
   FileUpload,
   HorizontalBarChart,
-  Image,
+  Image2 as Image,
   LineChart,
   MultipleSelectElement,
   Navbar,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@apexcura/ui-components",
-  "version": "0.0.16-Beta65",
+  "version": "0.0.16-Beta67",
   "description": "Apex cura React components library",
   "keywords": [
     "apex cura",
@@ -53,6 +53,7 @@
     "node": ">=18.0.0"
   },
   "dependencies": {
+    "@apexcura/core": "^0.0.17-Beta175",
     "@ckeditor/ckeditor5-build-classic": "^42.0.1",
     "@ckeditor/ckeditor5-react": "^8.0.0",
     "@tinymce/tinymce-react": "^5.0.1",