sales-frontend-components 2.0.3 → 2.0.4

package/dist/index.cjs.js

@@ -227,6 +227,18 @@ var _MessageEventManager = class _MessageEventManager2 {
 };
 __publicField(_MessageEventManager, "instance");
 var MessageEventManager = _MessageEventManager;
+function getCanvasExportFileInfo(imageUrl) {
+  const ext = imageUrl.split(".").pop()?.split("?")[0]?.toLowerCase();
+  switch (ext) {
+    case "jpg":
+    case "jpeg":
+      return { contentType: "image/jpeg", fileExt: "jpg" };
+    case "webp":
+      return { contentType: "image/webp", fileExt: "webp" };
+    default:
+      return { contentType: "image/png", fileExt: "png" };
+  }
+}
 function base64ToBlob(base64String, contentType = "") {
   const regex = /^data:([a-zA-Z0-9/+.-]+);base64,/;
   const matches = base64String.match(regex);
@@ -320,41 +332,46 @@ async function imageUrlToFileFetch(imageUrl) {
   const file = new File([blob], name, { type });
   return file;
 }
-async function imageUrlToFile(imageUrl) {
-  const fileConvertTypeCookieKey = "dsp-debug-mode-file-convert-type";
-  const fileConvertType = getCookie$1(fileConvertTypeCookieKey);
-  if (fileConvertType === "fetch") {
+async function imageUrlToFile(imageUrl, convertType) {
+  if (convertType === "fetch") {
     return await imageUrlToFileFetch(imageUrl);
   }
-  if (fileConvertType === "xhr") {
+  if (convertType === "xhr") {
     return await imageUrlToFileWithXMLHttpRequest(imageUrl);
   }
   return await imageUrlToFileWithCanvas(imageUrl);
 }
 async function imageUrlToFileWithCanvas(imageUrl) {
   const newImage = new Image();
-  newImage.src = imageUrl;
-  newImage.crossOrigin = "Anonymous";
   return new Promise((resolve, reject) => {
     newImage.onload = () => {
       const canvas = document.createElement("canvas");
       canvas.width = newImage.width;
       canvas.height = newImage.height;
       const ctx = canvas.getContext("2d");
-      if (ctx) {
+      if (!ctx) {
+        reject(new Error("Failed to get canvas 2d context."));
+        return;
+      }
+      try {
         ctx.drawImage(newImage, 0, 0);
-        canvas.toBlob((blob) => {
-          if (blob) {
-            const ext = getExt(imageUrl);
-            const file = new File([blob], `image.${ext}`, { type: blob.type });
-            resolve(file);
-          }
-        });
+        const { contentType, fileExt } = getCanvasExportFileInfo(imageUrl);
+        const dataUrl = canvas.toDataURL(contentType);
+        const blob = base64ToBlob(dataUrl, contentType);
+        resolve(blobToFile(blob, `image.${fileExt}`));
+      } catch (error) {
+        reject(
+          new Error(
+            `imageUrlToFileWithCanvas failed for "${imageUrl}". ${error instanceof Error ? error.message : "Unknown error"}`
+          )
+        );
       }
     };
     newImage.onerror = (e) => {
       reject(JSON.stringify(e));
     };
+    newImage.crossOrigin = "Anonymous";
+    newImage.src = imageUrl;
   });
 }
 async function imageUrlToFileWithXMLHttpRequest(imageUrl) {
@@ -4566,7 +4583,8 @@ function useCamera({
   buttonText,
   initData,
   useNativeCamera = false,
-  responseFileType
+  responseFileType,
+  convertType = "canvas"
 } = {}) {
   const convertedInitData = initData?.map((data, index) => ({ ...data, id: String(index + 1) }));
   const [attachedPhotos, setAttachedPhotos] = React9.useState(convertedInitData || []);
@@ -4590,7 +4608,7 @@ function useCamera({
   };
   const processImage = async (uri) => {
     if (responseFileType === "scheme") {
-      const file = await imageUrlToFile(uri);
+      const file = await imageUrlToFile(uri, convertType);
       await imageHandler(file);
     } else {
       const file = await base64ToFile(uri, "image.jpg");

package/dist/index.d.ts

@@ -118,6 +118,7 @@ interface cameraOptions {
     cameraOnly: boolean;
     buttonText?: string;
     responseFileType?: 'base64' | 'scheme';
+    convertType?: 'fetch' | 'xhr' | 'canvas';
     resize: {
         resizeRatio?: number;
         processType?: 'quality' | 'px' | 'mixed';
@@ -175,7 +176,7 @@ interface AddImageInfo {
  * responseFileType fetch로 이미지자원을 가져올때 ios이슈가 있어서,
  * scheme, base64 두가지 타입으로 설정가능하도록 변경됨
  */
-declare function useCamera({ onChange, resize: resizeOption, cameraOnly, onDelete, show, type, buttonText, initData, useNativeCamera, responseFileType }?: Partial<cameraOptions>): {
+declare function useCamera({ onChange, resize: resizeOption, cameraOnly, onDelete, show, type, buttonText, initData, useNativeCamera, responseFileType, convertType }?: Partial<cameraOptions>): {
     onClick: () => void;
     getImage: (imageId: string) => AttachedPhoto | undefined;
     deleteImage: (imageId: string) => void;

package/dist/index.esm.js

@@ -225,6 +225,18 @@ var _MessageEventManager = class _MessageEventManager2 {
 };
 __publicField(_MessageEventManager, "instance");
 var MessageEventManager = _MessageEventManager;
+function getCanvasExportFileInfo(imageUrl) {
+  const ext = imageUrl.split(".").pop()?.split("?")[0]?.toLowerCase();
+  switch (ext) {
+    case "jpg":
+    case "jpeg":
+      return { contentType: "image/jpeg", fileExt: "jpg" };
+    case "webp":
+      return { contentType: "image/webp", fileExt: "webp" };
+    default:
+      return { contentType: "image/png", fileExt: "png" };
+  }
+}
 function base64ToBlob(base64String, contentType = "") {
   const regex = /^data:([a-zA-Z0-9/+.-]+);base64,/;
   const matches = base64String.match(regex);
@@ -318,41 +330,46 @@ async function imageUrlToFileFetch(imageUrl) {
   const file = new File([blob], name, { type });
   return file;
 }
-async function imageUrlToFile(imageUrl) {
-  const fileConvertTypeCookieKey = "dsp-debug-mode-file-convert-type";
-  const fileConvertType = getCookie$1(fileConvertTypeCookieKey);
-  if (fileConvertType === "fetch") {
+async function imageUrlToFile(imageUrl, convertType) {
+  if (convertType === "fetch") {
     return await imageUrlToFileFetch(imageUrl);
   }
-  if (fileConvertType === "xhr") {
+  if (convertType === "xhr") {
     return await imageUrlToFileWithXMLHttpRequest(imageUrl);
   }
   return await imageUrlToFileWithCanvas(imageUrl);
 }
 async function imageUrlToFileWithCanvas(imageUrl) {
   const newImage = new Image();
-  newImage.src = imageUrl;
-  newImage.crossOrigin = "Anonymous";
   return new Promise((resolve, reject) => {
     newImage.onload = () => {
       const canvas = document.createElement("canvas");
       canvas.width = newImage.width;
       canvas.height = newImage.height;
       const ctx = canvas.getContext("2d");
-      if (ctx) {
+      if (!ctx) {
+        reject(new Error("Failed to get canvas 2d context."));
+        return;
+      }
+      try {
         ctx.drawImage(newImage, 0, 0);
-        canvas.toBlob((blob) => {
-          if (blob) {
-            const ext = getExt(imageUrl);
-            const file = new File([blob], `image.${ext}`, { type: blob.type });
-            resolve(file);
-          }
-        });
+        const { contentType, fileExt } = getCanvasExportFileInfo(imageUrl);
+        const dataUrl = canvas.toDataURL(contentType);
+        const blob = base64ToBlob(dataUrl, contentType);
+        resolve(blobToFile(blob, `image.${fileExt}`));
+      } catch (error) {
+        reject(
+          new Error(
+            `imageUrlToFileWithCanvas failed for "${imageUrl}". ${error instanceof Error ? error.message : "Unknown error"}`
+          )
+        );
       }
     };
     newImage.onerror = (e) => {
       reject(JSON.stringify(e));
     };
+    newImage.crossOrigin = "Anonymous";
+    newImage.src = imageUrl;
   });
 }
 async function imageUrlToFileWithXMLHttpRequest(imageUrl) {
@@ -4564,7 +4581,8 @@ function useCamera({
   buttonText,
   initData,
   useNativeCamera = false,
-  responseFileType
+  responseFileType,
+  convertType = "canvas"
 } = {}) {
   const convertedInitData = initData?.map((data, index) => ({ ...data, id: String(index + 1) }));
   const [attachedPhotos, setAttachedPhotos] = useState(convertedInitData || []);
@@ -4588,7 +4606,7 @@ function useCamera({
   };
   const processImage = async (uri) => {
     if (responseFileType === "scheme") {
-      const file = await imageUrlToFile(uri);
+      const file = await imageUrlToFile(uri, convertType);
       await imageHandler(file);
     } else {
       const file = await base64ToFile(uri, "image.jpg");

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sales-frontend-components",
-  "version": "2.0.3",
+  "version": "2.0.4",
   "private": false,
   "type": "module",
   "main": "dist/index.cjs.js",
@@ -45,12 +45,12 @@
     "sales-frontend-stores": "0.0.15",
     "sales-frontend-typescript-config": "0.0.2",
     "sales-frontend-assets": "0.0.27",
-    "sales-frontend-api": "0.0.178",
-    "sales-frontend-design-system": "0.2.2",
-    "sales-frontend-bridge": "0.0.118",
-    "sales-frontend-hooks": "0.0.179",
-    "sales-frontend-solution": "0.0.58",
-    "sales-frontend-debug": "0.0.76",
+    "sales-frontend-api": "0.0.179",
+    "sales-frontend-design-system": "0.2.3",
+    "sales-frontend-bridge": "0.0.119",
+    "sales-frontend-hooks": "0.0.180",
+    "sales-frontend-solution": "0.0.59",
+    "sales-frontend-debug": "0.0.77",
     "sales-frontend-vitest-config": "0.0.3"
   },
   "peerDependencies": {
@@ -58,19 +58,19 @@
     "react": ">=19.0.0",
     "react-dom": ">=19.0.0",
     "react-hook-form": "^7.58.1",
-    "sales-frontend-api": "0.0.178",
+    "sales-frontend-api": "0.0.179",
     "sales-frontend-assets": "0.0.27",
     "sales-frontend-stores": "0.0.15",
-    "sales-frontend-design-system": "0.2.2",
-    "sales-frontend-bridge": "0.0.118",
-    "sales-frontend-hooks": "0.0.179",
-    "sales-frontend-solution": "0.0.58"
+    "sales-frontend-design-system": "0.2.3",
+    "sales-frontend-bridge": "0.0.119",
+    "sales-frontend-hooks": "0.0.180",
+    "sales-frontend-solution": "0.0.59"
   },
   "dependencies": {
     "classnames": "^2.5.1",
     "dayjs": "^1.11.13",
-    "sales-frontend-utils": "0.0.70",
-    "sales-frontend-debug": "0.0.76"
+    "sales-frontend-utils": "0.0.71",
+    "sales-frontend-debug": "0.0.77"
   },
   "scripts": {
     "lint": "eslint . --max-warnings 0",