feat : update

components/public/guide-image-export.tsx

@@ -20,12 +20,16 @@ export function GuideImageExport({
   fileName,
   width = EXPORT_WIDTH,
   height,
+  format = "png",
+  disabled = false,
   captureClassName,
 }: {
   children: ReactNode;
   fileName: string;
   width?: number;
   height?: number;
+  format?: "png" | "webp";
+  disabled?: boolean;
   captureClassName?: string;
 }) {
   const captureRef = useRef<HTMLDivElement>(null);
@@ -45,6 +49,7 @@ export function GuideImageExport({
         await Promise.all([document.fonts.ready, waitUntilLoad(node)]);
         const blob = await domToBlob(node, {
           backgroundColor: getComputedStyle(node).backgroundColor,
+          type: `image/${format}`,
           scale: 1,
           width,
           height,
@@ -70,7 +75,7 @@ export function GuideImageExport({
     return () => {
       cancelled = true;
     };
-  }, [capturing, fileName, height, width]);
+  }, [capturing, fileName, format, height, width]);
 
   return (
     <>
@@ -78,7 +83,7 @@ export function GuideImageExport({
         type="button"
         variant="outline"
         size="sm"
-        disabled={capturing}
+        disabled={capturing || disabled}
         onClick={() => setCapturing(true)}
       >
         {capturing ? (