@myoc/common 0.19.532 → 0.19.534

package/dist/types/excalidraw/actions/actionExport.d.ts

@@ -180,7 +180,7 @@ export declare const actionLoadScene: {
             isRotating: boolean;
             zoom: import("../types").Zoom;
             openMenu: "canvas" | null;
-            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | null;
+            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | "gifFrameGallery" | "gifSpeedPicker" | null;
             openSidebar: {
                 name: import("../types").SidebarName;
                 tab?: import("../types").SidebarTabName;
@@ -348,7 +348,7 @@ export declare const actionLoadScene: {
             isRotating: boolean;
             zoom: import("../types").Zoom;
             openMenu: "canvas" | null;
-            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | null;
+            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | "gifFrameGallery" | "gifSpeedPicker" | null;
             openSidebar: {
                 name: import("../types").SidebarName;
                 tab?: import("../types").SidebarTabName;

package/dist/types/excalidraw/actions/actionFrame.d.ts

@@ -102,7 +102,7 @@ export declare const actionSelectAllElementsInFrame: {
             isRotating: boolean;
             zoom: import("../types").Zoom;
             openMenu: "canvas" | null;
-            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | null;
+            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | "gifFrameGallery" | "gifSpeedPicker" | null;
             openSidebar: {
                 name: import("../types").SidebarName;
                 tab?: import("../types").SidebarTabName;
@@ -294,7 +294,7 @@ export declare const actionRemoveAllElementsFromFrame: {
             isRotating: boolean;
             zoom: import("../types").Zoom;
             openMenu: "canvas" | null;
-            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | null;
+            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | "gifFrameGallery" | "gifSpeedPicker" | null;
             openSidebar: {
                 name: import("../types").SidebarName;
                 tab?: import("../types").SidebarTabName;
@@ -484,7 +484,7 @@ export declare const actionupdateFrameRendering: {
             isRotating: boolean;
             zoom: import("../types").Zoom;
             openMenu: "canvas" | null;
-            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | null;
+            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | "gifFrameGallery" | "gifSpeedPicker" | null;
             openSidebar: {
                 name: import("../types").SidebarName;
                 tab?: import("../types").SidebarTabName;
@@ -863,6 +863,7 @@ export declare const actionWrapSelectionInFrame: {
             status: "pending" | "saved" | "error";
             scale: [number, number];
             crop: import("@excalidraw/element/types").ImageCrop | null;
+            gifPlayback: import("@excalidraw/element/types").ExcalidrawGifPlayback | null;
         }> & {
             index: import("@excalidraw/element/types").FractionalIndex;
         }) | (Readonly<{

package/dist/types/excalidraw/actions/actionGroup.d.ts

@@ -108,7 +108,7 @@ export declare const actionGroup: {
             isRotating: boolean;
             zoom: import("../types").Zoom;
             openMenu: "canvas" | null;
-            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | null;
+            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | "gifFrameGallery" | "gifSpeedPicker" | null;
             openSidebar: {
                 name: import("../types").SidebarName;
                 tab?: import("../types").SidebarTabName;
@@ -299,7 +299,7 @@ export declare const actionUngroup: {
             isRotating: boolean;
             zoom: import("../types").Zoom;
             openMenu: "canvas" | null;
-            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | null;
+            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | "gifFrameGallery" | "gifSpeedPicker" | null;
             openSidebar: {
                 name: import("../types").SidebarName;
                 tab?: import("../types").SidebarTabName;

package/dist/types/excalidraw/actions/actionLinearEditor.d.ts

@@ -135,7 +135,7 @@ export declare const actionToggleLinearEditor: {
             isRotating: boolean;
             zoom: import("../types").Zoom;
             openMenu: "canvas" | null;
-            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | null;
+            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | "gifFrameGallery" | "gifSpeedPicker" | null;
             openSidebar: {
                 name: import("../types").SidebarName;
                 tab?: import("../types").SidebarTabName;
@@ -515,6 +515,7 @@ export declare const actionTogglePolygon: {
             status: "pending" | "saved" | "error";
             scale: [number, number];
             crop: import("@excalidraw/element/types").ImageCrop | null;
+            gifPlayback: import("@excalidraw/element/types").ExcalidrawGifPlayback | null;
         }> & {
             index: import("@excalidraw/element/types").FractionalIndex;
         }) | (Readonly<{

package/dist/types/excalidraw/actions/actionLink.d.ts

@@ -98,7 +98,7 @@ export declare const actionLink: {
             isResizing: boolean;
             isRotating: boolean;
             zoom: import("../types").Zoom;
-            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | null;
+            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | "gifFrameGallery" | "gifSpeedPicker" | null;
             openSidebar: {
                 name: import("../types").SidebarName;
                 tab?: import("../types").SidebarTabName;

package/dist/types/excalidraw/actions/actionProperties.d.ts

@@ -139,7 +139,7 @@ export declare const actionDecreaseFontSize: {
             isRotating: boolean;
             zoom: import("../types").Zoom;
             openMenu: "canvas" | null;
-            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | null;
+            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | "gifFrameGallery" | "gifSpeedPicker" | null;
             openSidebar: {
                 name: import("../types").SidebarName;
                 tab?: import("../types").SidebarTabName;
@@ -326,7 +326,7 @@ export declare const actionIncreaseFontSize: {
             isRotating: boolean;
             zoom: import("../types").Zoom;
             openMenu: "canvas" | null;
-            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | null;
+            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | "gifFrameGallery" | "gifSpeedPicker" | null;
             openSidebar: {
                 name: import("../types").SidebarName;
                 tab?: import("../types").SidebarTabName;

package/dist/types/excalidraw/actions/actionSelectAll.d.ts

@@ -106,7 +106,7 @@ export declare const actionSelectAll: {
             isRotating: boolean;
             zoom: import("../types").Zoom;
             openMenu: "canvas" | null;
-            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | null;
+            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | "gifFrameGallery" | "gifSpeedPicker" | null;
             openSidebar: {
                 name: import("../types").SidebarName;
                 tab?: import("../types").SidebarTabName;

package/dist/types/excalidraw/actions/actionStyles.d.ts

@@ -104,7 +104,7 @@ export declare const actionCopyStyles: {
             isRotating: boolean;
             zoom: import("../types").Zoom;
             openMenu: "canvas" | null;
-            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | null;
+            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | "gifFrameGallery" | "gifSpeedPicker" | null;
             openSidebar: {
                 name: import("../types").SidebarName;
                 tab?: import("../types").SidebarTabName;

package/dist/types/excalidraw/actions/actionToggleArrowBinding.d.ts

@@ -100,7 +100,7 @@ export declare const actionToggleArrowBinding: {
             isRotating: boolean;
             zoom: import("../types").Zoom;
             openMenu: "canvas" | null;
-            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | null;
+            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | "gifFrameGallery" | "gifSpeedPicker" | null;
             openSidebar: {
                 name: import("../types").SidebarName;
                 tab?: import("../types").SidebarTabName;

package/dist/types/excalidraw/actions/actionToggleGridMode.d.ts

@@ -104,7 +104,7 @@ export declare const actionToggleGridMode: {
             isRotating: boolean;
             zoom: import("../types").Zoom;
             openMenu: "canvas" | null;
-            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | null;
+            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | "gifFrameGallery" | "gifSpeedPicker" | null;
             openSidebar: {
                 name: import("../types").SidebarName;
                 tab?: import("../types").SidebarTabName;

package/dist/types/excalidraw/actions/actionToggleMidpointSnapping.d.ts

@@ -100,7 +100,7 @@ export declare const actionToggleMidpointSnapping: {
             isRotating: boolean;
             zoom: import("../types").Zoom;
             openMenu: "canvas" | null;
-            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | null;
+            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | "gifFrameGallery" | "gifSpeedPicker" | null;
             openSidebar: {
                 name: import("../types").SidebarName;
                 tab?: import("../types").SidebarTabName;

package/dist/types/excalidraw/actions/actionToggleObjectsSnapMode.d.ts

@@ -103,7 +103,7 @@ export declare const actionToggleObjectsSnapMode: {
             isRotating: boolean;
             zoom: import("../types").Zoom;
             openMenu: "canvas" | null;
-            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | null;
+            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | "gifFrameGallery" | "gifSpeedPicker" | null;
             openSidebar: {
                 name: import("../types").SidebarName;
                 tab?: import("../types").SidebarTabName;

package/dist/types/excalidraw/actions/actionToggleSearchMenu.d.ts

@@ -108,7 +108,7 @@ export declare const actionToggleSearchMenu: {
             isRotating: boolean;
             zoom: import("../types").Zoom;
             openMenu: "canvas" | null;
-            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | null;
+            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | "gifFrameGallery" | "gifSpeedPicker" | null;
             defaultSidebarDockedPreference: boolean;
             lastPointerDownWith: import("@excalidraw/element/types").PointerType;
             selectedElementIds: Readonly<{

package/dist/types/excalidraw/actions/actionToggleStats.d.ts

@@ -105,7 +105,7 @@ export declare const actionToggleStats: {
             isRotating: boolean;
             zoom: import("../types").Zoom;
             openMenu: "canvas" | null;
-            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | null;
+            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | "gifFrameGallery" | "gifSpeedPicker" | null;
             openSidebar: {
                 name: import("../types").SidebarName;
                 tab?: import("../types").SidebarTabName;

package/dist/types/excalidraw/actions/actionToggleViewMode.d.ts

@@ -102,7 +102,7 @@ export declare const actionToggleViewMode: {
             isRotating: boolean;
             zoom: import("../types").Zoom;
             openMenu: "canvas" | null;
-            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | null;
+            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | "gifFrameGallery" | "gifSpeedPicker" | null;
             openSidebar: {
                 name: import("../types").SidebarName;
                 tab?: import("../types").SidebarTabName;

package/dist/types/excalidraw/components/App.d.ts

@@ -2,7 +2,7 @@ import React from "react";
 import { AppEventBus, type EXPORT_IMAGE_TYPES, Emitter, type EditorInterface, type StylesPanelMode } from "@excalidraw/common";
 import { LinearElementEditor, Scene, Store, type ElementUpdate, StoreDelta, type ApplyToOptions } from "@excalidraw/element";
 import type { LocalPoint, Radians } from "@excalidraw/math";
-import type { ExcalidrawElement, ExcalidrawTextElement, NonDeleted, FileId, NonDeletedExcalidrawElement, ExcalidrawTextContainer, ExcalidrawFrameLikeElement, ExcalidrawEmbeddableElement, Ordered, SceneElementsMap } from "@excalidraw/element/types";
+import type { ExcalidrawElement, ExcalidrawTextElement, NonDeleted, ExcalidrawImageElement, FileId, NonDeletedExcalidrawElement, ExcalidrawTextContainer, ExcalidrawFrameLikeElement, ExcalidrawEmbeddableElement, Ordered, SceneElementsMap } from "@excalidraw/element/types";
 import type { Mutable } from "@excalidraw/common/utility-types";
 import { ActionManager } from "../actions/manager";
 import { History } from "../history";
@@ -124,6 +124,7 @@ declare class App extends React.Component<AppProps, AppState> {
     bucketFill: AppBucketFill;
     flowchart: AppFlowchart;
     cursor: AppCursor;
+    private gifPlayback;
     private zDragZoom;
     arrowText: AppArrowText;
     viewport: AppViewport;
@@ -400,6 +401,7 @@ declare class App extends React.Component<AppProps, AppState> {
     dismissLinearEditor: () => void;
     syncActionResult: (actionResult: ActionResult) => void;
     scheduleCapture: () => void;
+    scheduleUpdate: () => void;
     private onBlur;
     private onUnload;
     private disableEvent;
@@ -890,7 +892,12 @@ declare class App extends React.Component<AppProps, AppState> {
     private getImageNaturalDimensions;
     /** updates image cache, refreshing updated elements and/or setting status
         to error for images that fail during <img> element creation */
+    private handleImageCacheUpdate;
     private updateImageCache;
+    ensureGifPlaybackLoop: () => void;
+    loadDeferredGif: (fileId: FileId) => Promise<void>;
+    getGifPlaybackFrameIndex: (element: ExcalidrawImageElement) => number | undefined;
+    setGifPlaybackFrameIndex: (element: ExcalidrawImageElement, frameIndex: number) => void;
     /** adds new images to imageCache and re-renders if needed */
     private addNewImagesToImageCache;
     /** generally you should use `addNewImagesToImageCache()` directly if you need

package/dist/types/excalidraw/components/App.gif.d.ts

@@ -0,0 +1,18 @@
+import type { ExcalidrawImageElement, FileId, InitializedExcalidrawImageElement, NonDeleted } from "@excalidraw/element/types";
+import type App from "./App";
+export declare class AppGifPlayback {
+    private app;
+    private playbackRaf;
+    private runtimeState;
+    constructor(app: App);
+    stop: () => void;
+    getFrameIndex: (element: ExcalidrawImageElement) => number | undefined;
+    setFrameIndex: (element: ExcalidrawImageElement, frameIndex: number) => void;
+    ensureLoop: () => void;
+    createPlaceholderDecodeState: (placeholderImageElement: ExcalidrawImageElement, imageFile: File) => FileId | null;
+    ensureElementPlaybackMetadata: (element: NonDeleted<InitializedExcalidrawImageElement>, opts?: {
+        playing?: boolean;
+    }) => NonDeleted<InitializedExcalidrawImageElement>;
+    removePlaceholderDecodeState: (placeholderGifFileId: FileId | null) => void;
+    private tick;
+}

package/dist/types/excalidraw/components/GifPlaybackControls.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+import "./GifPlaybackControls.scss";
+import type { AppClassProperties, AppState, BinaryFiles } from "../types";
+type GifPlaybackControlsProps = {
+    app: AppClassProperties;
+    files: BinaryFiles;
+    setAppState: React.Component<any, AppState>["setState"];
+};
+export declare const GifPlaybackControls: ({ app, files, setAppState, }: GifPlaybackControlsProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/types/excalidraw/components/icons.d.ts

@@ -9,6 +9,7 @@ type Opts = {
 export declare const createIcon: (d: string | React.ReactNode, opts?: number | Opts) => import("react/jsx-runtime").JSX.Element;
 export declare const PlusPromoIcon: import("react/jsx-runtime").JSX.Element;
 export declare const PlusIcon: import("react/jsx-runtime").JSX.Element;
+export declare const CirclePauseIcon: import("react/jsx-runtime").JSX.Element;
 export declare const DotsIcon: import("react/jsx-runtime").JSX.Element;
 export declare const DotsHorizontalIcon: import("react/jsx-runtime").JSX.Element;
 export declare const PinIcon: import("react/jsx-runtime").JSX.Element;
@@ -194,6 +195,9 @@ export declare const cutIcon: import("react/jsx-runtime").JSX.Element;
 export declare const helpIcon: import("react/jsx-runtime").JSX.Element;
 export declare const playerPlayIcon: import("react/jsx-runtime").JSX.Element;
 export declare const playerStopFilledIcon: import("react/jsx-runtime").JSX.Element;
+export declare const prevFrame: import("react/jsx-runtime").JSX.Element;
+export declare const nextFrame: import("react/jsx-runtime").JSX.Element;
+export declare const frames: import("react/jsx-runtime").JSX.Element;
 export declare const tablerCheckIcon: import("react/jsx-runtime").JSX.Element;
 export declare const alertTriangleIcon: import("react/jsx-runtime").JSX.Element;
 export declare const eyeDropperIconSvgPaths: readonly ["M4 16l11.7 -11.7a1 1 0 0 1 1.4 0l2.6 2.6a1 1 0 0 1 0 1.4l-11.7 11.7h-4v-4z", "M11 7l6 6"];

package/dist/types/excalidraw/data/blob.d.ts

@@ -4,7 +4,7 @@ import type { ExcalidrawElement, FileId } from "@excalidraw/element/types";
 import type { AppState, CompressImageFile, DataURL } from "../types";
 export declare const getMimeType: (blob: Blob | string) => string;
 export declare const getFileHandleType: (handle: FileSystemFileHandle | null) => string | null;
-export declare const isImageFileHandleType: (type: string | null) => type is "png" | "svg";
+export declare const isImageFileHandleType: (type: string | null) => type is "png" | "svg" | "gif";
 export declare const isImageFileHandle: (handle: FileSystemFileHandle | null) => handle is FileSystemFileHandle;
 export declare const isSupportedImageFileType: (type: string | null | undefined) => boolean;
 export declare const isSupportedImageFile: (blob: Blob | null | undefined) => blob is Blob & {
@@ -115,7 +115,7 @@ fileHandle?: FileSystemFileHandle | null) => Promise<{
         isRotating: boolean;
         zoom: import("../types").Zoom;
         openMenu: "canvas" | null;
-        openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | null;
+        openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | "gifFrameGallery" | "gifSpeedPicker" | null;
         openSidebar: {
             name: import("../types").SidebarName;
             tab?: import("../types").SidebarTabName;

package/dist/types/excalidraw/data/json.d.ts

@@ -116,7 +116,7 @@ export declare const loadFromJSON: (localAppState: AppState, localElements: read
         isRotating: boolean;
         zoom: import("../types").Zoom;
         openMenu: "canvas" | null;
-        openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | null;
+        openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | "gifFrameGallery" | "gifSpeedPicker" | null;
         openSidebar: {
             name: import("../types").SidebarName;
             tab?: import("../types").SidebarTabName;

package/dist/types/excalidraw/data/restoreGif.d.ts

@@ -0,0 +1,4 @@
+import type { ExcalidrawGifPlayback } from "@excalidraw/element/types";
+type RestorableGifPlayback = Partial<ExcalidrawGifPlayback> | null | undefined;
+export declare const restoreGifPlayback: (gifPlayback: RestorableGifPlayback) => ExcalidrawGifPlayback | null;
+export {};

package/dist/types/excalidraw/scene/Renderer.d.ts

@@ -276,6 +276,7 @@ export declare class Renderer {
             status: "pending" | "saved" | "error";
             scale: [number, number];
             crop: import("@excalidraw/element/types").ImageCrop | null;
+            gifPlayback: import("@excalidraw/element/types").ExcalidrawGifPlayback | null;
         }> & {
             isDeleted: false;
         }) | (Readonly<{

package/dist/types/excalidraw/scene/types.d.ts

@@ -1,5 +1,5 @@
 import type { UserIdleState, EditorInterface } from "@excalidraw/common";
-import type { ExcalidrawElement, NonDeletedElementsMap, NonDeletedExcalidrawElement, NonDeletedSceneElementsMap } from "@excalidraw/element/types";
+import type { ExcalidrawElement, ExcalidrawImageElement, NonDeletedElementsMap, NonDeletedExcalidrawElement, NonDeletedSceneElementsMap } from "@excalidraw/element/types";
 import type { MakeBrand } from "@excalidraw/common/utility-types";
 import type { AppClassProperties, AppState, EmbedsValidationStatus, ElementsPendingErasure, InteractiveCanvasAppState, StaticCanvasAppState, SocketId, PendingExcalidrawElements } from "../types";
 import type { RoughCanvas } from "roughjs/bin/canvas";
@@ -8,6 +8,7 @@ export type RenderableElementsMap = NonDeletedElementsMap & MakeBrand<"Renderabl
 export type StaticCanvasRenderConfig = {
     canvasBackgroundColor: AppState["viewBackgroundColor"];
     imageCache: AppClassProperties["imageCache"];
+    getGifFrameIndex?: (element: ExcalidrawImageElement) => number | undefined;
     imageTransitionDuration?: number;
     renderGrid: boolean;
     /** whether to render link icons on elements with links (never rendered

package/dist/types/excalidraw/types.d.ts

@@ -1,7 +1,7 @@
 import type { IMAGE_MIME_TYPES, UserIdleState, throttleRAF, MIME_TYPES, ColorTuple, EditorInterface, StrokeWidthKey } from "@excalidraw/common";
 import type { LinearElementEditor } from "@excalidraw/element";
 import type { MaybeTransformHandleType } from "@excalidraw/element";
-import type { PointerType, ExcalidrawLinearElement, NonDeletedExcalidrawElement, NonDeleted, TextAlign, ExcalidrawElement, GroupId, ExcalidrawBindableElement, ExcalidrawArrowElement, Arrowhead, FontFamilyValues, FileId, Theme, StrokeRoundness, ExcalidrawEmbeddableElement, ExcalidrawMagicFrameElement, ExcalidrawFrameLikeElement, ExcalidrawElementType, ExcalidrawIframeLikeElement, OrderedExcalidrawElement, ExcalidrawNonSelectionElement, ArrangeAlgorithms, BindMode, ExcalidrawTextElement, StrokeVariability } from "@excalidraw/element/types";
+import type { PointerType, ExcalidrawLinearElement, NonDeletedExcalidrawElement, NonDeleted, TextAlign, ExcalidrawElement, GroupId, ExcalidrawBindableElement, ExcalidrawArrowElement, Arrowhead, FontFamilyValues, FileId, Theme, StrokeRoundness, ExcalidrawEmbeddableElement, ExcalidrawMagicFrameElement, ExcalidrawFrameLikeElement, ExcalidrawElementType, ExcalidrawIframeLikeElement, OrderedExcalidrawElement, ExcalidrawNonSelectionElement, ArrangeAlgorithms, BindMode, ExcalidrawTextElement, StrokeVariability, ExcalidrawGifCache } from "@excalidraw/element/types";
 import type { Merge, MaybePromise, ValueOf, MakeBrand } from "@excalidraw/common/utility-types";
 import type { CaptureUpdateActionType, DurableIncrement, EphemeralIncrement } from "@excalidraw/element";
 import type { GlobalPoint } from "@excalidraw/math";
@@ -406,7 +406,7 @@ export interface AppState {
     isRotating: boolean;
     zoom: Zoom;
     openMenu: "canvas" | null;
-    openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | null;
+    openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | "gifFrameGallery" | "gifSpeedPicker" | null;
     openSidebar: {
         name: SidebarName;
         tab?: SidebarTabName;
@@ -913,6 +913,8 @@ export type ExportOpts = {
 export type ImageOptions = Partial<{
     maxWidthOrHeight: number;
     maxFileSizeBytes: number;
+    /** GIF files larger than this are inserted as static images until manually loaded */
+    gifAutoDecodeMaxFileSizeBytes: number;
     /** duration of the placeholder-to-full-image crossfade in milliseconds */
     placeholderTransitionDuration: number;
 }>;
@@ -973,6 +975,8 @@ export type AppClassProperties = {
         isPlaceholder?: boolean;
         placeholderImage?: HTMLImageElement;
         transitionStart?: number;
+        gifDecodeStatus?: "pending" | "success" | "error" | "deferred";
+        gif?: ExcalidrawGifCache;
     }>;
     imageLoadingProgress: App["imageLoadingProgress"];
     imageLoadingProgressEmitter: App["imageLoadingProgressEmitter"];
@@ -993,6 +997,12 @@ export type AppClassProperties = {
     scrollToViewport: App["scrollToViewport"];
     scrollToContent: App["scrollToContent"];
     addFiles: App["addFiles"];
+    scheduleCapture: App["scheduleCapture"];
+    scheduleUpdate: App["scheduleUpdate"];
+    ensureGifPlaybackLoop: App["ensureGifPlaybackLoop"];
+    loadDeferredGif: App["loadDeferredGif"];
+    getGifPlaybackFrameIndex: App["getGifPlaybackFrameIndex"];
+    setGifPlaybackFrameIndex: App["setGifPlaybackFrameIndex"];
     addElementsFromPaste: App["addElementsFromPaste"];
     togglePenMode: App["togglePenMode"];
     toggleLock: App["toggleLock"];

package/dist/types/excalidraw/viewport.d.ts

@@ -183,7 +183,7 @@ export declare const zoomToFitBounds: ({ bounds, appState, canvasOffsets, fit, m
         isResizing: boolean;
         isRotating: boolean;
         openMenu: "canvas" | null;
-        openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | null;
+        openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | "gifFrameGallery" | "gifSpeedPicker" | null;
         openSidebar: {
             name: import("./types").SidebarName;
             tab?: import("./types").SidebarTabName;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@myoc/common",
-  "version": "0.19.532",
+  "version": "0.19.534",
   "type": "module",
   "types": "./dist/types/common/src/index.d.ts",
   "main": "./dist/prod/index.js",