sales-frontend-components 0.0.38 → 0.0.40

package/dist/index.d.ts

@@ -126,7 +126,7 @@ interface StepIndicatorProps {
 
 declare const StepIndicator: ({ items, onClickItem, currentIndex, defaultValue, dotCount }: StepIndicatorProps) => react_jsx_runtime.JSX.Element;
 
-interface AttachedPhoto$1 {
+interface AttachedPhoto {
     id: string;
     src: string;
     name?: string;
@@ -147,7 +147,7 @@ interface cameraOptions {
 
 declare function useCamera({ onChange, resize: resizeOption, cameraOnly, onDelete, show, type }?: Partial<cameraOptions>): {
     onClick: () => void;
-    getImage: (imageId: string) => any;
+    getImage: (imageId: string) => AttachedPhoto | undefined;
     deleteImage: (imageId: string) => void;
     attachedPhotos: AttachedPhoto[];
     Attachment: () => react_jsx_runtime.JSX.Element;
@@ -175,13 +175,13 @@ declare function useCamera({ onChange, resize: resizeOption, cameraOnly, onDelet
 declare function resize<T extends string | File>(image: T, options?: cameraOptions['resize']): Promise<T>;
 
 interface AttachmentProps {
-    photos: AttachedPhoto$1[];
+    photos: AttachedPhoto[];
     onAddPhoto: () => void;
     onRemovePhoto: (id: string) => void;
     show: boolean;
     type?: 'single' | 'multiple';
 }
-declare function Attachement({ photos, onAddPhoto, onRemovePhoto, show, type }: AttachmentProps): react_jsx_runtime.JSX.Element | null;
+declare function Attachment({ photos, onAddPhoto, onRemovePhoto, show, type }: AttachmentProps): react_jsx_runtime.JSX.Element | null;
 
-export { Attachement, DataTable, FormDatePicker, FormSegmentGroup, FormSignature, FormTextField, StepIndicator, resize, useCamera, useFormSignature, useTable };
-export type { AttachedPhoto$1 as AttachedPhoto, AttachmentProps, DataTableProps, FormSignatureProps, FormSignatureRef, SignatureData, StepIndicatorProps, StepItem, cameraOptions };
+export { Attachment, DataTable, FormDatePicker, FormSegmentGroup, FormSignature, FormTextField, StepIndicator, resize, useCamera, useFormSignature, useTable };
+export type { AttachedPhoto, AttachmentProps, DataTableProps, FormSignatureProps, FormSignatureRef, SignatureData, StepIndicatorProps, StepItem, cameraOptions };

package/dist/index.esm.js

@@ -1,7 +1,7 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { flexRender, useReactTable, getSortedRowModel, getCoreRowModel, getPaginationRowModel } from '@tanstack/react-table';
-import styles from './data-table/data-table.module.scss';
 import { Table, DatePicker, SegmentGroup, FormField, Button, Icon } from 'sales-frontend-design-system';
+import styles from './data-table/data-table.module.scss';
 import React, { useState, useRef, useEffect, useCallback, useImperativeHandle } from 'react';
 import { useController } from 'react-hook-form';
 import styles$1 from './form/form-signautre/form-signature.module.scss';
@@ -324,9 +324,13 @@ const FormSignature = ({
   const [currentStrokeLength, setCurrentStrokeLength] = useState(0);
   useEffect(() => {
     const canvas = canvasRef.current;
-    if (!canvas) return;
+    if (!canvas) {
+      return;
+    }
     const ctx = canvas.getContext("2d");
-    if (!ctx) return;
+    if (!ctx) {
+      return;
+    }
     ctx.strokeStyle = "#000000";
     ctx.lineWidth = Math.max(1, canvasWidth / 400);
     ctx.lineCap = "round";
@@ -346,7 +350,9 @@ const FormSignature = ({
   }, [isDrawing]);
   const getCanvasCoordinates = useCallback((e) => {
     const canvas = canvasRef.current;
-    if (!canvas) return { x: 0, y: 0 };
+    if (!canvas) {
+      return { x: 0, y: 0 };
+    }
     const rect = canvas.getBoundingClientRect();
     const scaleX = canvas.width / rect.width;
     const scaleY = canvas.height / rect.height;
@@ -361,9 +367,13 @@ const FormSignature = ({
   const startDrawing = useCallback(
     (e) => {
       const canvas = canvasRef.current;
-      if (!canvas) return;
+      if (!canvas) {
+        return;
+      }
       const ctx = canvas.getContext("2d");
-      if (!ctx) return;
+      if (!ctx) {
+        return;
+      }
       const { x, y } = getCanvasCoordinates(e);
       setIsDrawing(true);
       setIsMousePressed(true);
@@ -377,11 +387,17 @@ const FormSignature = ({
   );
   const draw = useCallback(
     (e) => {
-      if (!isDrawing) return;
+      if (!isDrawing) {
+        return;
+      }
       const canvas = canvasRef.current;
-      if (!canvas) return;
+      if (!canvas) {
+        return;
+      }
       const ctx = canvas.getContext("2d");
-      if (!ctx) return;
+      if (!ctx) {
+        return;
+      }
       const { x, y } = getCanvasCoordinates(e);
       const currentPoint = { x, y };
       if (lastPoint) {
@@ -411,9 +427,13 @@ const FormSignature = ({
     (e) => {
       if (isMousePressed && !isDrawing) {
         const canvas = canvasRef.current;
-        if (!canvas) return;
+        if (!canvas) {
+          return;
+        }
         const ctx = canvas.getContext("2d");
-        if (!ctx) return;
+        if (!ctx) {
+          return;
+        }
         const { x, y } = getCanvasCoordinates(e);
         setIsDrawing(true);
         setLastPoint({ x, y });
@@ -431,9 +451,13 @@ const FormSignature = ({
   }, [isDrawing]);
   const clearSignature = useCallback(() => {
     const canvas = canvasRef.current;
-    if (!canvas) return;
+    if (!canvas) {
+      return;
+    }
     const ctx = canvas.getContext("2d");
-    if (!ctx) return;
+    if (!ctx) {
+      return;
+    }
     ctx.clearRect(0, 0, canvasWidth, canvasHeight);
     setIsEmpty(true);
     setSignatureData("");
@@ -491,7 +515,9 @@ const FormSignature = ({
     };
   }, [signatureData, isEmpty, totalLineLength, strokeLengths]);
   const handleSubmit = useCallback(() => {
-    if (!validateForm()) return;
+    if (!validateForm()) {
+      return;
+    }
     const data = getSignatureDataObject();
     if (data) {
       console.log("\uC81C\uCD9C\uB41C \uB370\uC774\uD130:", data);
@@ -503,7 +529,9 @@ const FormSignature = ({
     onReset?.();
   }, [clearSignature, onReset]);
   const handleRecentSignatureLoad = useCallback(async () => {
-    if (!onRecentSignatureLoad) return;
+    if (!onRecentSignatureLoad) {
+      return;
+    }
     try {
       setIsLoadingSignature(true);
       const loadedSignature = await onRecentSignatureLoad();
@@ -640,10 +668,16 @@ const useFormSignature = ({ onSubmit, onError, onClear, minLength = 100 } = {})
   }, []);
   const isValid = useCallback(() => {
     const basicValid = signatureRef.current?.isValid() ?? false;
-    if (!basicValid) return false;
+    if (!basicValid) {
+      return false;
+    }
     const data = signatureRef.current?.getSignatureData();
-    if (!data) return false;
-    if (isLoadedFromRecent) return true;
+    if (!data) {
+      return false;
+    }
+    if (isLoadedFromRecent) {
+      return true;
+    }
     return data.totalLineLength >= minLength;
   }, [minLength, isLoadedFromRecent]);
   const getSignatureData = useCallback(() => {
@@ -720,7 +754,7 @@ const StepIndicator = ({
 };
 
 const cx = classNames.bind(styles$3);
-function Attachement({ photos, onAddPhoto, onRemovePhoto, show, type = "multiple" }) {
+function Attachment({ photos, onAddPhoto, onRemovePhoto, show, type = "multiple" }) {
   const handleAddPhoto = () => {
     onAddPhoto();
   };
@@ -745,7 +779,7 @@ function Attachement({ photos, onAddPhoto, onRemovePhoto, show, type = "multiple
     if (photos.length < maxPhotos) {
       gridItems.push(
         /* @__PURE__ */ jsx("div", { className: cx("photo-item", "add-photo-item"), children: /* @__PURE__ */ jsxs("button", { className: cx("add-photo-button"), onClick: handleAddPhoto, children: [
-          /* @__PURE__ */ jsx(Icon, { name: "camera", src: `${IMG_PREFIX}/dsp/assets/icons/illust/camera.svg` }),
+          /* @__PURE__ */ jsx(Icon, { name: "illust/camera" }),
           /* @__PURE__ */ jsx("span", { children: "\uCCA8\uBD80\uD558\uAE30" }),
           /* @__PURE__ */ jsxs("span", { className: cx("photo-count"), children: [
             "(",
@@ -829,7 +863,7 @@ function resize(image, options = { ext: "jpeg", filesize: maxImageSize }) {
               return;
             }
             const mimeType = ext === "png" ? "image/png" : "image/jpeg";
-            const fileName = image.name ? image.name.replace(/\.[^/.]+$/, "") + "." + ext : "resized." + ext;
+            const fileName = image.name ? `${image.name.replace(/\.[^/.]+$/, "")}.${ext}` : `resized.${ext}`;
             const resizedFile = new File([blob], fileName, { type: mimeType });
             resolve(resizedFile);
           },
@@ -882,7 +916,7 @@ function useCamera({
     }
     input.addEventListener("change", async (event) => {
       const target = event.target;
-      const files = target.files;
+      const { files } = target;
       if (files && files.length > 0) {
         const file = files[0];
         if (file) {
@@ -906,14 +940,12 @@ function useCamera({
     const imageIndex = attachedPhotos.findIndex((image) => image.id === imageId);
     if (imageIndex > -1) {
       const item = attachedPhotos.splice(imageIndex, 1);
-      URL.revokeObjectURL(item[0].src);
+      URL.revokeObjectURL(item[0] ? item[0].src : "");
       setAttachedPhotos([...attachedPhotos]);
       onDelete && onDelete(imageId);
     }
   };
-  const CameraComponent = useCallback(() => {
-    return /* @__PURE__ */ jsx(Attachement, { show: true, onAddPhoto: onClick, onRemovePhoto: deleteImage, photos: attachedPhotos, type });
-  }, [attachedPhotos, onClick, deleteImage, show]);
+  const CameraComponent = () => /* @__PURE__ */ jsx(Attachment, { show: !!show, onAddPhoto: onClick, onRemovePhoto: deleteImage, photos: attachedPhotos, type });
   useEffect(() => {
     return () => {
       attachedPhotos.forEach((image) => {
@@ -930,5 +962,5 @@ function useCamera({
   };
 }
 
-export { Attachement, DataTable, FormDatePicker, FormSegmentGroup, FormSignature, FormTextField, StepIndicator, resize, useCamera, useFormSignature, useTable };
+export { Attachment, DataTable, FormDatePicker, FormSegmentGroup, FormSignature, FormTextField, StepIndicator, resize, useCamera, useFormSignature, useTable };
 //# sourceMappingURL=index.esm.js.map