@myoc/excalidraw 0.19.544 → 0.19.545

package/dist/dev/index.js

@@ -65,10 +65,10 @@ import {
   serializeAsJSON,
   strokeRectWithRotation_simple,
   zoomToFitBounds
-} from "./chunk-DPY7NUSG.js";
+} from "./chunk-GWV63UBO.js";
 import {
   define_import_meta_env_default
-} from "./chunk-AKYL2SH7.js";
+} from "./chunk-CK7JCUHP.js";
 import {
   en_default
 } from "./chunk-35XUJXYN.js";
@@ -10437,11 +10437,36 @@ var serializeAsClipboardJSON = ({
   };
   return JSON.stringify(contents);
 };
+var convertImageFileToPNG = async (file2) => {
+  const bitmap = await createImageBitmap(file2);
+  try {
+    const canvas = document.createElement("canvas");
+    canvas.width = bitmap.width;
+    canvas.height = bitmap.height;
+    const context = canvas.getContext("2d");
+    if (!context) {
+      throw new Error("Could not create a canvas context for clipboard image");
+    }
+    context.drawImage(bitmap, 0, 0);
+    return await new Promise((resolve, reject) => {
+      canvas.toBlob((blob) => {
+        if (blob) {
+          resolve(blob);
+        } else {
+          reject(new Error("Could not encode clipboard image as PNG"));
+        }
+      }, MIME_TYPES2.png);
+    });
+  } finally {
+    bitmap.close();
+  }
+};
 var copyToClipboard = async (elements, files, clipboardEvent) => {
   const json = serializeAsClipboardJSON({ elements, files });
   const imageFile = elements.length === 1 && isInitializedImageElement(elements[0]) ? files?.[elements[0].fileId] : null;
   const clipboardFile = imageFile && isSupportedImageFileType(imageFile.mimeType) && imageFile.dataURL ? dataURLToFile(imageFile.dataURL, imageFile.fileName) : null;
   if (clipboardFile) {
+    const clipboardImagePNG = clipboardFile.type === MIME_TYPES2.png ? clipboardFile : convertImageFileToPNG(clipboardFile);
     if (supportsClipboardBlob()) {
       try {
         await navigator.clipboard.write([
@@ -10449,7 +10474,7 @@ var copyToClipboard = async (elements, files, clipboardEvent) => {
             [WEB_EXCALIDRAW_CLIPBOARD_MIME_TYPE]: new Blob([json], {
               type: MIME_TYPES2.excalidrawClipboard
             }),
-            [clipboardFile.type]: clipboardFile
+            [MIME_TYPES2.png]: clipboardImagePNG
           })
         ]);
         return;
@@ -10459,7 +10484,12 @@ var copyToClipboard = async (elements, files, clipboardEvent) => {
     }
     if (clipboardEvent?.clipboardData?.items) {
       try {
-        clipboardEvent.clipboardData.items.add(clipboardFile);
+        const clipboardImageFile = clipboardFile.type === MIME_TYPES2.png ? clipboardFile : new File(
+          [await clipboardImagePNG],
+          `${clipboardFile.name.replace(/\.[^/.]+$/, "") || "image"}.png`,
+          { type: MIME_TYPES2.png }
+        );
+        clipboardEvent.clipboardData.items.add(clipboardImageFile);
         await copyTextToSystemClipboard(
           { [MIME_TYPES2.excalidrawClipboard]: json },
           clipboardEvent
@@ -11014,7 +11044,7 @@ var exportCanvas = async (type, elements, appState, files, {
     let blob = canvasToBlob(tempCanvas);
     if (appState.exportEmbedScene) {
       blob = blob.then(
-        (blob2) => import("./data/image-AIHWJUYD.js").then(
+        (blob2) => import("./data/image-LHD6YZAK.js").then(
           ({ encodePngMetadata: encodePngMetadata2 }) => encodePngMetadata2({
             blob: blob2,
             metadata: serializeAsJSON(elements, appState, files, "local")
@@ -15250,7 +15280,12 @@ import { arrayToMap as arrayToMap23, findIndex, findLastIndex as findLastIndex2
 import { isFiniteNumber } from "@excalidraw/math";
 
 // ../element/src/gif.ts
-import { decode, decodeFrames } from "modern-gif";
+import { decodeAnimated } from "@discourse/gif";
+var GIF_WORKER_FILENAME = "gif.worker.js";
+var gifWorkerUrl = new URL(
+  GIF_WORKER_FILENAME,
+  import.meta.url
+).toString();
 
 // ../element/src/image.ts
 import {
@@ -31768,21 +31803,34 @@ var GifPlaybackControls = ({
       app.ensureGifPlaybackLoop();
     }
   };
-  const deferredGifBadges = app.scene.getNonDeletedElements().filter(
-    (element) => isInitializedImageElement4(element) && !liveAppState.selectedElementIds[element.id] && files[element.fileId]?.mimeType === MIME_TYPES10.gif && app.imageCache.get(element.fileId)?.gifDecodeStatus === "deferred"
-  ).map((element) => {
+  const deferredGifControls = app.scene.getNonDeletedElements().flatMap((element) => {
+    if (!isInitializedImageElement4(element) || files[element.fileId]?.mimeType !== MIME_TYPES10.gif || app.imageCache.get(element.fileId)?.gifDecodeStatus !== "deferred") {
+      return [];
+    }
     const position = getGifControlPosition(element, liveAppState);
-    return /* @__PURE__ */ jsx113(
-      "span",
-      {
-        className: "gif-playback-controls gif-playback-controls__deferred-badge",
-        role: "img",
-        "aria-label": "GIF paused",
-        style: position,
-        children: CirclePauseIcon
-      },
-      element.id
-    );
+    return [
+      /* @__PURE__ */ jsx113(
+        "div",
+        {
+          className: "gif-playback-controls gif-playback-controls--deferred",
+          style: position,
+          onPointerDown: (event) => event.stopPropagation(),
+          children: /* @__PURE__ */ jsx113(
+            "button",
+            {
+              type: "button",
+              className: "gif-playback-controls__load-large",
+              title: "Load Large GIF",
+              onClick: () => {
+                app.loadDeferredGif(element.fileId);
+              },
+              children: "Load Large GIF"
+            }
+          )
+        },
+        element.id
+      )
+    ];
   });
   const selectedElements = app.scene.getSelectedElements(liveAppState);
   const selectedElementControls = () => {
@@ -31813,29 +31861,6 @@ var GifPlaybackControls = ({
         leftTop.y - liveAppState.offsetTop + 16
       )
     );
-    if (cacheEntry?.gifDecodeStatus === "deferred") {
-      const position = getGifControlPosition(selectedElement, liveAppState);
-      return /* @__PURE__ */ jsx113(
-        "div",
-        {
-          className: "gif-playback-controls gif-playback-controls--deferred",
-          style: position,
-          onPointerDown: (event) => event.stopPropagation(),
-          children: /* @__PURE__ */ jsx113(
-            "button",
-            {
-              type: "button",
-              className: "gif-playback-controls__load-large",
-              title: "Load Large GIF",
-              onClick: () => {
-                app.loadDeferredGif(selectedElement.fileId);
-              },
-              children: "Load Large GIF"
-            }
-          )
-        }
-      );
-    }
     if (cacheEntry?.gifDecodeStatus === "pending") {
       return null;
     }
@@ -32182,7 +32207,7 @@ var GifPlaybackControls = ({
     );
   };
   return /* @__PURE__ */ jsxs59(Fragment18, { children: [
-    deferredGifBadges,
+    deferredGifControls,
     selectedElementControls()
   ] });
 };