@orangecatai/adgen-canvas 0.0.23 → 0.0.24

package/dist/prod/locales/{en-5WIO63S4.js → en-ZZURI326.js}

@@ -1 +1 @@
-import{A,B,C,D,E,F,G,H,I,J,K,L,M,a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z}from"../chunk-TX6PVFUX.js";import"../chunk-SRAX5OIU.js";export{f as alerts,e as buttons,l as canvasError,G as chat,s as clearCanvasDialog,C as colorPicker,A as colors,K as commandPalette,v as confirmDialog,M as default,i as element,b as elementLink,x as encrypted,p as errorDialog,m as errorSplash,g as errors,q as exportDialog,I as fontList,j as headings,r as helpDialog,k as hints,w as imageExportDialog,L as keys,a as labels,c as library,E as mermaid,D as overwriteConfirm,t as publishDialog,u as publishSuccessDialog,H as quickSearch,o as roomDialog,d as search,n as shareDialog,y as stats,z as toast,h as toolBar,F as ttd,J as userList,B as welcomeScreen};
+import{A,B,C,D,E,F,G,H,I,J,K,L,M,a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z}from"../chunk-CLQPYXMS.js";import"../chunk-SRAX5OIU.js";export{f as alerts,e as buttons,l as canvasError,G as chat,s as clearCanvasDialog,C as colorPicker,A as colors,K as commandPalette,v as confirmDialog,M as default,i as element,b as elementLink,x as encrypted,p as errorDialog,m as errorSplash,g as errors,q as exportDialog,I as fontList,j as headings,r as helpDialog,k as hints,w as imageExportDialog,L as keys,a as labels,c as library,E as mermaid,D as overwriteConfirm,t as publishDialog,u as publishSuccessDialog,H as quickSearch,o as roomDialog,d as search,n as shareDialog,y as stats,z as toast,h as toolBar,F as ttd,J as userList,B as welcomeScreen};

package/dist/prod/subset-shared.chunk.js

@@ -1 +1 @@
-import{a,b,c,d}from"./chunk-Z5NKEFVG.js";import"./chunk-GOHSI4TL.js";import"./chunk-SRAX5OIU.js";export{a as Commands,b as subsetToBase64,c as subsetToBinary,d as toBase64};
+import{a,b,c,d}from"./chunk-Z5NKEFVG.js";import"./chunk-MFGXKFLH.js";import"./chunk-SRAX5OIU.js";export{a as Commands,b as subsetToBase64,c as subsetToBinary,d as toBase64};

package/dist/prod/subset-worker.chunk.js

@@ -1 +1 @@
-import{a as r,c as t}from"./chunk-Z5NKEFVG.js";import"./chunk-GOHSI4TL.js";import"./chunk-SRAX5OIU.js";var s=import.meta.url?new URL(import.meta.url):void 0;typeof window>"u"&&typeof self<"u"&&(self.onmessage=async e=>{switch(e.data.command){case r.Subset:let a=await t(e.data.arrayBuffer,e.data.codePoints);self.postMessage(a,{transfer:[a]});break}});export{s as WorkerUrl};
+import{a as r,c as t}from"./chunk-Z5NKEFVG.js";import"./chunk-MFGXKFLH.js";import"./chunk-SRAX5OIU.js";var s=import.meta.url?new URL(import.meta.url):void 0;typeof window>"u"&&typeof self<"u"&&(self.onmessage=async e=>{switch(e.data.command){case r.Subset:let a=await t(e.data.arrayBuffer,e.data.codePoints);self.postMessage(a,{transfer:[a]});break}});export{s as WorkerUrl};

package/dist/types/common/src/constants.d.ts

@@ -175,6 +175,10 @@ export declare const IMAGE_MIME_TYPES: {
     readonly avif: "image/avif";
     readonly jfif: "image/jfif";
 };
+export declare const VIDEO_MIME_TYPES: {
+    readonly mp4: "video/mp4";
+    readonly mov: "video/quicktime";
+};
 export declare const STRING_MIME_TYPES: {
     readonly text: "text/plain";
     readonly html: "text/html";

package/dist/types/element/src/Scene.d.ts

@@ -70,7 +70,7 @@ export declare class Scene {
     getElementIndex(elementId: string): number;
     getContainerElement: (element: (ExcalidrawElement & {
         containerId: ExcalidrawElement["id"] | null;
-    }) | null) => import("@orangecatai/element/types").ExcalidrawLinearElement | import("@orangecatai/element/types").ExcalidrawSelectionElement | import("@orangecatai/element/types").ExcalidrawRectangleElement | import("@orangecatai/element/types").ExcalidrawDiamondElement | import("@orangecatai/element/types").ExcalidrawEllipseElement | import("@orangecatai/element/types").ExcalidrawEmbeddableElement | import("@orangecatai/element/types").ExcalidrawIframeElement | import("@orangecatai/element/types").ExcalidrawImageElement | import("@orangecatai/element/types").ExcalidrawFrameElement | import("@orangecatai/element/types").ExcalidrawMagicFrameElement | import("@orangecatai/element/types").ExcalidrawTextElement | import("@orangecatai/element/types").ExcalidrawFreeDrawElement | null;
+    }) | null) => import("@orangecatai/element/types").ExcalidrawLinearElement | import("@orangecatai/element/types").ExcalidrawSelectionElement | import("@orangecatai/element/types").ExcalidrawRectangleElement | import("@orangecatai/element/types").ExcalidrawDiamondElement | import("@orangecatai/element/types").ExcalidrawEllipseElement | import("@orangecatai/element/types").ExcalidrawEmbeddableElement | import("@orangecatai/element/types").ExcalidrawIframeElement | import("@orangecatai/element/types").ExcalidrawImageElement | import("@orangecatai/element/types").ExcalidrawVideoElement | import("@orangecatai/element/types").ExcalidrawFrameElement | import("@orangecatai/element/types").ExcalidrawMagicFrameElement | import("@orangecatai/element/types").ExcalidrawTextElement | import("@orangecatai/element/types").ExcalidrawFreeDrawElement | null;
     getElementsFromId: (id: string) => ExcalidrawElement[];
     mutateElement<TElement extends Mutable<ExcalidrawElement>>(element: TElement, updates: ElementUpdate<TElement>, options?: {
         informMutation: boolean;

package/dist/types/element/src/frame.d.ts

@@ -31,8 +31,8 @@ export declare const getFrameLikeElements: (allElements: ExcalidrawElementsInclu
  */
 export declare const getRootElements: (allElements: ExcalidrawElementsIncludingDeleted) => ExcalidrawElement[];
 export declare const getElementsInResizingFrame: (allElements: ExcalidrawElementsIncludingDeleted, frame: ExcalidrawFrameLikeElement, appState: AppState, elementsMap: ElementsMap) => ExcalidrawElement[];
-export declare const getElementsInNewFrame: (elements: ExcalidrawElementsIncludingDeleted, frame: ExcalidrawFrameLikeElement, elementsMap: ElementsMap) => (import("./types").ExcalidrawLinearElement | import("./types").ExcalidrawSelectionElement | import("./types").ExcalidrawRectangleElement | import("./types").ExcalidrawDiamondElement | import("./types").ExcalidrawEllipseElement | import("./types").ExcalidrawEmbeddableElement | import("./types").ExcalidrawIframeElement | import("./types").ExcalidrawImageElement | import("./types").ExcalidrawFrameElement | import("./types").ExcalidrawMagicFrameElement | import("./types").ExcalidrawTextElement | import("./types").ExcalidrawFreeDrawElement)[];
-export declare const omitPartialGroups: (elements: ExcalidrawElement[], frame: ExcalidrawFrameLikeElement, allElementsMap: ElementsMap) => (import("./types").ExcalidrawLinearElement | import("./types").ExcalidrawSelectionElement | import("./types").ExcalidrawRectangleElement | import("./types").ExcalidrawDiamondElement | import("./types").ExcalidrawEllipseElement | import("./types").ExcalidrawEmbeddableElement | import("./types").ExcalidrawIframeElement | import("./types").ExcalidrawImageElement | import("./types").ExcalidrawFrameElement | import("./types").ExcalidrawMagicFrameElement | import("./types").ExcalidrawTextElement | import("./types").ExcalidrawFreeDrawElement)[];
+export declare const getElementsInNewFrame: (elements: ExcalidrawElementsIncludingDeleted, frame: ExcalidrawFrameLikeElement, elementsMap: ElementsMap) => (import("./types").ExcalidrawLinearElement | import("./types").ExcalidrawSelectionElement | import("./types").ExcalidrawRectangleElement | import("./types").ExcalidrawDiamondElement | import("./types").ExcalidrawEllipseElement | import("./types").ExcalidrawEmbeddableElement | import("./types").ExcalidrawIframeElement | import("./types").ExcalidrawImageElement | import("./types").ExcalidrawVideoElement | import("./types").ExcalidrawFrameElement | import("./types").ExcalidrawMagicFrameElement | import("./types").ExcalidrawTextElement | import("./types").ExcalidrawFreeDrawElement)[];
+export declare const omitPartialGroups: (elements: ExcalidrawElement[], frame: ExcalidrawFrameLikeElement, allElementsMap: ElementsMap) => (import("./types").ExcalidrawLinearElement | import("./types").ExcalidrawSelectionElement | import("./types").ExcalidrawRectangleElement | import("./types").ExcalidrawDiamondElement | import("./types").ExcalidrawEllipseElement | import("./types").ExcalidrawEmbeddableElement | import("./types").ExcalidrawIframeElement | import("./types").ExcalidrawImageElement | import("./types").ExcalidrawVideoElement | import("./types").ExcalidrawFrameElement | import("./types").ExcalidrawMagicFrameElement | import("./types").ExcalidrawTextElement | import("./types").ExcalidrawFreeDrawElement)[];
 export declare const getContainingFrame: (element: ExcalidrawElement, elementsMap: ElementsMap) => ExcalidrawFrameLikeElement | null;
 /** */
 export declare const filterElementsEligibleAsFrameChildren: (elements: readonly ExcalidrawElement[], frame: ExcalidrawFrameLikeElement) => ExcalidrawElement[];

package/dist/types/element/src/newElement.d.ts

@@ -1,5 +1,5 @@
 import type { MarkOptional } from "@orangecatai/common/utility-types";
-import type { ExcalidrawImageElement, ExcalidrawTextElement, ExcalidrawLinearElement, ExcalidrawGenericElement, NonDeleted, TextAlign, VerticalAlign, Arrowhead, ExcalidrawFreeDrawElement, FontFamilyValues, ExcalidrawTextContainer, ExcalidrawFrameElement, ExcalidrawEmbeddableElement, ExcalidrawMagicFrameElement, ExcalidrawIframeElement, ElementsMap, ExcalidrawArrowElement, ExcalidrawElbowArrowElement, ExcalidrawLineElement } from "./types";
+import type { ExcalidrawImageElement, ExcalidrawVideoElement, ExcalidrawTextElement, ExcalidrawLinearElement, ExcalidrawGenericElement, NonDeleted, TextAlign, VerticalAlign, Arrowhead, ExcalidrawFreeDrawElement, FontFamilyValues, ExcalidrawTextContainer, ExcalidrawFrameElement, ExcalidrawEmbeddableElement, ExcalidrawMagicFrameElement, ExcalidrawIframeElement, ElementsMap, ExcalidrawArrowElement, ExcalidrawElbowArrowElement, ExcalidrawLineElement } from "./types";
 export type ElementConstructorOpts = MarkOptional<Omit<ExcalidrawGenericElement, "id" | "type" | "isDeleted" | "updated">, "width" | "height" | "angle" | "groupIds" | "frameId" | "index" | "boundElements" | "seed" | "version" | "versionNonce" | "link" | "strokeStyle" | "fillStyle" | "strokeColor" | "backgroundColor" | "roughness" | "strokeWidth" | "roundness" | "locked" | "opacity" | "customData">;
 export declare const newElement: (opts: {
     type: ExcalidrawGenericElement["type"];
@@ -60,3 +60,12 @@ export declare const newImageElement: (opts: {
     scale?: ExcalidrawImageElement["scale"];
     crop?: ExcalidrawImageElement["crop"];
 } & ElementConstructorOpts) => NonDeleted<ExcalidrawImageElement>;
+export declare const newVideoElement: (opts: {
+    status?: ExcalidrawVideoElement["status"];
+    videoUrl?: ExcalidrawVideoElement["videoUrl"];
+    mimeType?: ExcalidrawVideoElement["mimeType"];
+    thumbnailDataUrl?: ExcalidrawVideoElement["thumbnailDataUrl"];
+    duration?: ExcalidrawVideoElement["duration"];
+    naturalWidth?: ExcalidrawVideoElement["naturalWidth"];
+    naturalHeight?: ExcalidrawVideoElement["naturalHeight"];
+} & ElementConstructorOpts) => NonDeleted<ExcalidrawVideoElement>;

package/dist/types/element/src/typeChecks.d.ts

@@ -1,8 +1,9 @@
 import type { ElementOrToolType } from "@orangecatai/adgen-canvas/types";
 import type { MarkNonNullable } from "@orangecatai/common/utility-types";
-import type { ExcalidrawElement, ExcalidrawTextElement, ExcalidrawEmbeddableElement, ExcalidrawLinearElement, ExcalidrawBindableElement, ExcalidrawFreeDrawElement, InitializedExcalidrawImageElement, ExcalidrawImageElement, ExcalidrawTextElementWithContainer, ExcalidrawTextContainer, ExcalidrawFrameElement, RoundnessType, ExcalidrawFrameLikeElement, ExcalidrawElementType, ExcalidrawIframeElement, ExcalidrawIframeLikeElement, ExcalidrawMagicFrameElement, ExcalidrawArrowElement, ExcalidrawElbowArrowElement, ExcalidrawLineElement, ExcalidrawFlowchartNodeElement, ExcalidrawLinearElementSubType } from "./types";
+import type { ExcalidrawElement, ExcalidrawTextElement, ExcalidrawEmbeddableElement, ExcalidrawLinearElement, ExcalidrawBindableElement, ExcalidrawFreeDrawElement, InitializedExcalidrawImageElement, ExcalidrawImageElement, ExcalidrawTextElementWithContainer, ExcalidrawTextContainer, ExcalidrawFrameElement, RoundnessType, ExcalidrawFrameLikeElement, ExcalidrawElementType, ExcalidrawIframeElement, ExcalidrawIframeLikeElement, ExcalidrawMagicFrameElement, ExcalidrawArrowElement, ExcalidrawElbowArrowElement, ExcalidrawLineElement, ExcalidrawFlowchartNodeElement, ExcalidrawLinearElementSubType, ExcalidrawVideoElement } from "./types";
 export declare const isInitializedImageElement: (element: ExcalidrawElement | null) => element is InitializedExcalidrawImageElement;
 export declare const isImageElement: (element: ExcalidrawElement | null) => element is ExcalidrawImageElement;
+export declare const isVideoElement: (element: ExcalidrawElement | null | undefined) => element is ExcalidrawVideoElement;
 export declare const isEmbeddableElement: (element: ExcalidrawElement | null | undefined) => element is ExcalidrawEmbeddableElement;
 export declare const isIframeElement: (element: ExcalidrawElement | null) => element is ExcalidrawIframeElement;
 export declare const isIframeLikeElement: (element: ExcalidrawElement | null) => element is ExcalidrawIframeLikeElement;

package/dist/types/element/src/types.d.ts

@@ -137,6 +137,21 @@ export type ExcalidrawImageElement = _ExcalidrawElementBase & Readonly<{
     crop: ImageCrop | null;
 }>;
 export type InitializedExcalidrawImageElement = MarkNonNullable<ExcalidrawImageElement, "fileId">;
+export type ExcalidrawVideoElement = _ExcalidrawElementBase & Readonly<{
+    type: "video";
+    /** URL to host-stored video file (not DataURL — videos are too large for base64) */
+    videoUrl: string | null;
+    status: "idle" | "uploading" | "saved" | "error";
+    mimeType: "video/mp4" | "video/quicktime" | null;
+    /** JPEG data URL of the first frame, used as the static thumbnail on canvas */
+    thumbnailDataUrl: string | null;
+    /** Total duration in seconds */
+    duration: number;
+    /** Original video pixel width */
+    naturalWidth: number;
+    /** Original video pixel height */
+    naturalHeight: number;
+}>;
 export type ExcalidrawFrameElement = _ExcalidrawElementBase & {
     type: "frame";
     name: string | null;
@@ -151,13 +166,13 @@ export type ExcalidrawFrameLikeElement = ExcalidrawFrameElement | ExcalidrawMagi
  */
 export type ExcalidrawGenericElement = ExcalidrawSelectionElement | ExcalidrawRectangleElement | ExcalidrawDiamondElement | ExcalidrawEllipseElement;
 export type ExcalidrawFlowchartNodeElement = ExcalidrawRectangleElement | ExcalidrawDiamondElement | ExcalidrawEllipseElement;
-export type ExcalidrawRectanguloidElement = ExcalidrawRectangleElement | ExcalidrawImageElement | ExcalidrawTextElement | ExcalidrawFreeDrawElement | ExcalidrawIframeLikeElement | ExcalidrawFrameLikeElement | ExcalidrawEmbeddableElement | ExcalidrawSelectionElement;
+export type ExcalidrawRectanguloidElement = ExcalidrawRectangleElement | ExcalidrawImageElement | ExcalidrawVideoElement | ExcalidrawTextElement | ExcalidrawFreeDrawElement | ExcalidrawIframeLikeElement | ExcalidrawFrameLikeElement | ExcalidrawEmbeddableElement | ExcalidrawSelectionElement;
 /**
  * ExcalidrawElement should be JSON serializable and (eventually) contain
  * no computed data. The list of all ExcalidrawElements should be shareable
  * between peers and contain no state local to the peer.
  */
-export type ExcalidrawElement = ExcalidrawGenericElement | ExcalidrawTextElement | ExcalidrawLinearElement | ExcalidrawArrowElement | ExcalidrawFreeDrawElement | ExcalidrawImageElement | ExcalidrawFrameElement | ExcalidrawMagicFrameElement | ExcalidrawIframeElement | ExcalidrawEmbeddableElement;
+export type ExcalidrawElement = ExcalidrawGenericElement | ExcalidrawTextElement | ExcalidrawLinearElement | ExcalidrawArrowElement | ExcalidrawFreeDrawElement | ExcalidrawImageElement | ExcalidrawVideoElement | ExcalidrawFrameElement | ExcalidrawMagicFrameElement | ExcalidrawIframeElement | ExcalidrawEmbeddableElement;
 export type ExcalidrawNonSelectionElement = Exclude<ExcalidrawElement, ExcalidrawSelectionElement>;
 export type Ordered<TElement extends ExcalidrawElement> = TElement & {
     index: FractionalIndex;

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

@@ -1201,6 +1201,47 @@ export declare const actionWrapSelectionInFrame: {
             link: string | null;
             locked: boolean;
             customData?: Record<string, any>;
+        }> & Readonly<{
+            type: "video";
+            videoUrl: string | null;
+            status: "idle" | "uploading" | "saved" | "error";
+            mimeType: "video/mp4" | "video/quicktime" | null;
+            thumbnailDataUrl: string | null;
+            duration: number;
+            naturalWidth: number;
+            naturalHeight: number;
+        }> & {
+            index: import("@orangecatai/element/types").FractionalIndex;
+        }) | (Readonly<{
+            id: string;
+            x: number;
+            y: number;
+            strokeColor: string;
+            backgroundColor: string;
+            fillStyle: import("@orangecatai/element/types").FillStyle;
+            strokeWidth: number;
+            strokeStyle: import("@orangecatai/element/types").StrokeStyle;
+            roundness: null | {
+                type: import("@orangecatai/element/types").RoundnessType;
+                value?: number;
+            };
+            roughness: number;
+            opacity: number;
+            width: number;
+            height: number;
+            angle: import("@orangecatai/math").Radians;
+            seed: number;
+            version: number;
+            versionNonce: number;
+            index: import("@orangecatai/element/types").FractionalIndex | null;
+            isDeleted: boolean;
+            groupIds: readonly import("@orangecatai/element/types").GroupId[];
+            frameId: string | null;
+            boundElements: readonly import("@orangecatai/element/types").BoundElement[] | null;
+            updated: number;
+            link: string | null;
+            locked: boolean;
+            customData?: Record<string, any>;
         }> & {
             type: "frame";
             name: string | null;

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

@@ -531,6 +531,47 @@ export declare const actionTogglePolygon: {
             link: string | null;
             locked: boolean;
             customData?: Record<string, any>;
+        }> & Readonly<{
+            type: "video";
+            videoUrl: string | null;
+            status: "idle" | "uploading" | "saved" | "error";
+            mimeType: "video/mp4" | "video/quicktime" | null;
+            thumbnailDataUrl: string | null;
+            duration: number;
+            naturalWidth: number;
+            naturalHeight: number;
+        }> & {
+            index: import("@orangecatai/element/types").FractionalIndex;
+        }) | (Readonly<{
+            id: string;
+            x: number;
+            y: number;
+            strokeColor: string;
+            backgroundColor: string;
+            fillStyle: import("@orangecatai/element/types").FillStyle;
+            strokeWidth: number;
+            strokeStyle: import("@orangecatai/element/types").StrokeStyle;
+            roundness: null | {
+                type: import("@orangecatai/element/types").RoundnessType;
+                value?: number;
+            };
+            roughness: number;
+            opacity: number;
+            width: number;
+            height: number;
+            angle: import("@orangecatai/math").Radians;
+            seed: number;
+            version: number;
+            versionNonce: number;
+            index: import("@orangecatai/element/types").FractionalIndex | null;
+            isDeleted: boolean;
+            groupIds: readonly import("@orangecatai/element/types").GroupId[];
+            frameId: string | null;
+            boundElements: readonly import("@orangecatai/element/types").BoundElement[] | null;
+            updated: number;
+            link: string | null;
+            locked: boolean;
+            customData?: Record<string, any>;
         }> & {
             type: "frame";
             name: string | null;

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

@@ -258,6 +258,7 @@ declare class App extends React.Component<AppProps, AppState> {
     private updateEmbedValidationStatus;
     private updateEmbeddables;
     private renderEmbeddables;
+    private renderVideos;
     private getFrameNameDOMId;
     frameNameBoundsCache: FrameNameBoundsCache;
     private resetEditingFrame;
@@ -284,11 +285,17 @@ declare class App extends React.Component<AppProps, AppState> {
     private onIframeSrcCopy;
     onMagicframeToolSelect: () => void;
     onImageGeneratorSelect: () => void;
+    onVideoGeneratorSelect: () => void;
     /**
      * Inserts a generated image (base64 data URL) into a frame element,
      * sized to fill the frame exactly. Used by the image generator panel.
      */
     insertGeneratedImageIntoFrame: (dataURL: string, frameElement: import("@orangecatai/element/types").ExcalidrawFrameLikeElement & import("@orangecatai/element/types").NonDeletedExcalidrawElement) => Promise<void>;
+    /**
+     * Inserts a generated video (presigned/CDN URL) into a video-generator frame,
+     * replacing any previous video. The video element fills the frame exactly.
+     */
+    insertGeneratedVideoIntoFrame: (videoUrl: string, frameElement: import("@orangecatai/element/types").ExcalidrawFrameLikeElement & import("@orangecatai/element/types").NonDeletedExcalidrawElement) => void;
     /**
      * Inserts a generated image near a source element (≥ 25 px clearance).
      * Tries right → below → left → above; falls back to right if all collide.
@@ -532,6 +539,7 @@ declare class App extends React.Component<AppProps, AppState> {
      */
     private getLatestInitializedImageElement;
     private onImageToolbarButtonClick;
+    onVideoToolbarButtonClick: () => void;
     private getImageNaturalDimensions;
     /** updates image cache, refreshing updated elements and/or setting status
         to error for images that fail during <img> element creation */
@@ -545,6 +553,8 @@ declare class App extends React.Component<AppProps, AppState> {
     private clearSelection;
     private handleInteractiveCanvasRef;
     private insertImages;
+    private newVideoPlaceholder;
+    insertVideos: (videoFiles: File[], sceneX: number, sceneY: number) => Promise<void>;
     private handleAppOnDrop;
     loadFileToCanvas: (file: File, fileHandle: FileSystemHandle | null) => Promise<void>;
     private handleCanvasContextMenu;

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

@@ -16,6 +16,20 @@ export declare const MODEL_CONFIG: {
         readonly supportedResolutions: readonly ["0.5K", "1K", "2K", "4K"];
         readonly supportedRatios: readonly ["21:9", "16:9", "4:3", "3:2", "1:1", "9:16", "3:4", "2:3", "5:4", "4:5", "4:1", "1:4", "8:1", "1:8"];
     };
+    readonly "nano banana lite": {
+        readonly modelId: "google/gemini-3.1-flash-lite-image";
+        readonly textOutput: true;
+        readonly supportsImageSize: false;
+        readonly supportedResolutions: readonly ["0.5K", "1K", "2K", "4K"];
+        readonly supportedRatios: readonly ["21:9", "16:9", "4:3", "3:2", "1:1", "9:16", "3:4", "2:3", "5:4", "4:5", "4:1", "1:4", "8:1", "1:8"];
+    };
+    readonly "nano banana 2 lite": {
+        readonly modelId: "google/gemini-3.1-flash-lite-image";
+        readonly textOutput: true;
+        readonly supportsImageSize: false;
+        readonly supportedResolutions: readonly ["0.5K", "1K", "2K", "4K"];
+        readonly supportedRatios: readonly ["21:9", "16:9", "4:3", "3:2", "1:1", "9:16", "3:4", "2:3", "5:4", "4:5", "4:1", "1:4", "8:1", "1:8"];
+    };
     readonly "nano banana pro": {
         readonly modelId: "google/gemini-3-pro-image-preview";
         readonly textOutput: true;

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

@@ -0,0 +1,9 @@
+import type { ExcalidrawVideoElement } from "@orangecatai/element/types";
+import "./VideoElement.scss";
+interface VideoElementProps {
+    element: ExcalidrawVideoElement;
+    isActive: boolean;
+    videoDownloadProxyUrl?: string;
+}
+export declare const VideoElement: ({ element, videoDownloadProxyUrl }: VideoElementProps) => import("react/jsx-runtime").JSX.Element;
+export {};

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

@@ -0,0 +1,149 @@
+import "./VideoGeneratorPanel.scss";
+import type { ExcalidrawFrameLikeElement, NonDeletedExcalidrawElement } from "@orangecatai/element/types";
+import type { AppClassProperties } from "../types";
+declare const VIDEO_MODEL_CONFIG: {
+    readonly "veo 3.1 fast": {
+        readonly modelId: "google/veo-3.1-fast";
+        readonly supportsFirstFrame: true;
+        readonly supportsLastFrame: true;
+        readonly audioMode: "always-on";
+        readonly supportsDuration: true;
+        readonly durationMode: "choices";
+        readonly durationValues: readonly [4, 6, 8];
+        readonly supportsResolution: true;
+        readonly supportedResolutions: readonly ["720p", "1080p", "4K"];
+        readonly supportsNegativePrompt: false;
+        readonly supportedRatios: readonly ["16:9", "9:16"];
+        readonly frameInputMode: "dual-frame";
+        readonly supportsInputReferences: false;
+        readonly supportsSeed: true;
+    };
+    readonly "veo 3.1 lite": {
+        readonly modelId: "google/veo-3.1-lite";
+        readonly supportsFirstFrame: true;
+        readonly supportsLastFrame: true;
+        readonly audioMode: "always-on";
+        readonly supportsDuration: true;
+        readonly durationMode: "choices";
+        readonly durationValues: readonly [4, 6, 8];
+        readonly supportsResolution: true;
+        readonly supportedResolutions: readonly ["720p", "1080p"];
+        readonly supportsNegativePrompt: false;
+        readonly supportedRatios: readonly ["16:9", "9:16"];
+        readonly frameInputMode: "dual-frame";
+        readonly supportsInputReferences: false;
+        readonly supportsSeed: true;
+    };
+    readonly "kling v3 pro": {
+        readonly modelId: "kwaivgi/kling-v3.0-pro";
+        readonly supportsFirstFrame: true;
+        readonly supportsLastFrame: true;
+        readonly audioMode: "toggle";
+        readonly supportsDuration: true;
+        readonly durationMode: "slider";
+        readonly minDuration: 3;
+        readonly maxDuration: 15;
+        readonly supportsResolution: false;
+        readonly supportsNegativePrompt: true;
+        readonly supportedRatios: readonly ["16:9", "9:16", "1:1"];
+        readonly frameInputMode: "dual-frame";
+        readonly supportsInputReferences: false;
+        readonly supportsSeed: true;
+    };
+    readonly "kling v3 std": {
+        readonly modelId: "kwaivgi/kling-v3.0-std";
+        readonly supportsFirstFrame: true;
+        readonly supportsLastFrame: true;
+        readonly audioMode: "toggle";
+        readonly supportsDuration: true;
+        readonly durationMode: "slider";
+        readonly minDuration: 3;
+        readonly maxDuration: 15;
+        readonly supportsResolution: false;
+        readonly supportsNegativePrompt: true;
+        readonly supportedRatios: readonly ["16:9", "9:16", "1:1"];
+        readonly frameInputMode: "dual-frame";
+        readonly supportsInputReferences: false;
+        readonly supportsSeed: true;
+    };
+    readonly "seedance 2.0": {
+        readonly modelId: "bytedance/seedance-2.0";
+        readonly supportsFirstFrame: true;
+        readonly supportsLastFrame: true;
+        readonly audioMode: "always-on";
+        readonly supportsDuration: true;
+        readonly durationMode: "slider";
+        readonly minDuration: 4;
+        readonly maxDuration: 15;
+        readonly supportsResolution: true;
+        readonly supportedResolutions: readonly ["480p", "720p", "1080p", "4K"];
+        readonly supportsNegativePrompt: false;
+        readonly supportedRatios: readonly ["16:9", "9:16", "1:1", "4:3", "3:4", "21:9", "9:21"];
+        readonly frameInputMode: "dual-frame";
+        readonly supportsInputReferences: true;
+        readonly supportsSeed: true;
+    };
+    readonly "seedance 2.0 fast": {
+        readonly modelId: "bytedance/seedance-2.0-fast";
+        readonly supportsFirstFrame: true;
+        readonly supportsLastFrame: true;
+        readonly audioMode: "always-on";
+        readonly supportsDuration: true;
+        readonly durationMode: "slider";
+        readonly minDuration: 4;
+        readonly maxDuration: 15;
+        readonly supportsResolution: true;
+        readonly supportedResolutions: readonly ["480p", "720p"];
+        readonly supportsNegativePrompt: false;
+        readonly supportedRatios: readonly ["16:9", "9:16", "1:1", "4:3", "3:4", "21:9", "9:21"];
+        readonly frameInputMode: "dual-frame";
+        readonly supportsInputReferences: true;
+        readonly supportsSeed: true;
+    };
+    readonly "happyhorse 1.1": {
+        readonly modelId: "alibaba/happyhorse-1.1";
+        readonly supportsFirstFrame: true;
+        readonly supportsLastFrame: false;
+        readonly audioMode: "none";
+        readonly supportsDuration: true;
+        readonly durationMode: "slider";
+        readonly minDuration: 3;
+        readonly maxDuration: 15;
+        readonly supportsResolution: true;
+        readonly supportedResolutions: readonly ["720p", "1080p"];
+        readonly supportsNegativePrompt: false;
+        readonly supportedRatios: readonly ["16:9", "9:16", "1:1", "4:3", "3:4", "21:9", "9:21"];
+        readonly frameInputMode: "start-only";
+        readonly supportsInputReferences: false;
+        readonly supportsSeed: true;
+    };
+    readonly "grok video": {
+        readonly modelId: "x-ai/grok-imagine-video";
+        readonly supportsFirstFrame: true;
+        readonly supportsLastFrame: false;
+        readonly audioMode: "none";
+        readonly supportsDuration: true;
+        readonly durationMode: "slider";
+        readonly minDuration: 1;
+        readonly maxDuration: 15;
+        readonly supportsResolution: true;
+        readonly supportedResolutions: readonly ["480p", "720p"];
+        readonly supportsNegativePrompt: false;
+        readonly supportedRatios: readonly ["16:9", "9:16", "1:1", "4:3", "3:4", "3:2", "2:3"];
+        readonly frameInputMode: "start-only";
+        readonly supportsInputReferences: false;
+        readonly supportsSeed: true;
+    };
+};
+export type VideoModelName = keyof typeof VIDEO_MODEL_CONFIG;
+export declare const VIDEO_MODEL_NAMES: VideoModelName[];
+export declare const VideoGeneratorPanel: ({ element, app, onBeforeVideoGen, onAfterVideoGen, }: {
+    element: NonDeletedExcalidrawElement & ExcalidrawFrameLikeElement;
+    app: AppClassProperties;
+    onBeforeVideoGen?: () => Promise<{
+        allowed: boolean;
+        error?: string;
+    }>;
+    onAfterVideoGen?: () => void;
+}) => import("react/jsx-runtime").JSX.Element | null;
+export {};

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

@@ -33,6 +33,7 @@ export declare const FreedrawIcon: import("react/jsx-runtime").JSX.Element;
 export declare const TextIcon: import("react/jsx-runtime").JSX.Element;
 export declare const TextSizeIcon: import("react/jsx-runtime").JSX.Element;
 export declare const ImageIcon: import("react/jsx-runtime").JSX.Element;
+export declare const VideoIcon: import("react/jsx-runtime").JSX.Element;
 export declare const EraserIcon: import("react/jsx-runtime").JSX.Element;
 export declare const ZoomInIcon: import("react/jsx-runtime").JSX.Element;
 export declare const ZoomOutIcon: import("react/jsx-runtime").JSX.Element;
@@ -189,6 +190,7 @@ export declare const eyeDropperIcon: import("react/jsx-runtime").JSX.Element;
 export declare const extraToolsIcon: import("react/jsx-runtime").JSX.Element;
 export declare const frameToolIcon: import("react/jsx-runtime").JSX.Element;
 export declare const imageGeneratorToolIcon: import("react/jsx-runtime").JSX.Element;
+export declare const videoGeneratorToolIcon: import("react/jsx-runtime").JSX.Element;
 export declare const mermaidLogoIcon: import("react/jsx-runtime").JSX.Element;
 export declare const RetryIcon: import("react/jsx-runtime").JSX.Element;
 export declare const stackPushIcon: import("react/jsx-runtime").JSX.Element;

package/dist/types/excalidraw/components/main-menu/DefaultItems.d.ts

@@ -12,6 +12,10 @@ export declare const SaveAsImage: {
     (): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
+export declare const UploadVideo: {
+    (): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
 export declare const CommandPalette: {
     (opts?: {
         className?: string;

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

@@ -1,4 +1,4 @@
-import { IMAGE_MIME_TYPES, MIME_TYPES } from "@orangecatai/common";
+import { IMAGE_MIME_TYPES, VIDEO_MIME_TYPES, MIME_TYPES } from "@orangecatai/common";
 import type { ExcalidrawElement, FileId } from "@orangecatai/element/types";
 import type { ValueOf } from "@orangecatai/common/utility-types";
 import type { AppState, DataURL, LibraryItem } from "../types";
@@ -12,6 +12,9 @@ export declare const isSupportedImageFileType: (type: string | null | undefined)
 export declare const isSupportedImageFile: (blob: Blob | null | undefined) => blob is Blob & {
     type: ValueOf<typeof IMAGE_MIME_TYPES>;
 };
+export declare const isSupportedVideoFile: (blob: Blob | null | undefined) => blob is Blob & {
+    type: ValueOf<typeof VIDEO_MIME_TYPES>;
+};
 export declare const loadSceneOrLibraryFromBlob: (blob: Blob | File, 
 /** @see restore.localAppState */
 localAppState: AppState | null, localElements: readonly ExcalidrawElement[] | null, 

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

@@ -14,13 +14,14 @@ export declare const Excalidraw: React.MemoExoticComponent<(props: ExcalidrawPro
 export { getSceneVersion, hashElementsVersion, hashString, getNonDeletedElements, } from "@orangecatai/element";
 export { getTextFromElements } from "@orangecatai/element";
 export { isInvisiblySmallElement } from "@orangecatai/element";
-export { newImageElement, newTextElement, newFrameElement, } from "@orangecatai/element";
+export { newImageElement, newVideoElement, newTextElement, newFrameElement, } from "@orangecatai/element";
+export { isVideoElement } from "@orangecatai/element";
 export { defaultLang, useI18n, languages } from "./i18n";
 export { restoreAppState, restoreElement, restoreElements, restoreLibraryItems, } from "./data/restore";
 export { reconcileElements } from "./data/reconcile";
 export { exportToCanvas, exportToBlob, exportToSvg, exportToClipboard, } from "@orangecatai/utils/export";
 export { serializeAsJSON, serializeLibraryAsJSON } from "./data/json";
-export { loadFromBlob, loadSceneOrLibraryFromBlob, loadLibraryFromBlob, } from "./data/blob";
+export { loadFromBlob, loadSceneOrLibraryFromBlob, loadLibraryFromBlob, isSupportedVideoFile, } from "./data/blob";
 export { mergeLibraryItems, getLibraryItemsHash } from "./data/library";
 export { isLinearElement } from "@orangecatai/element";
 export { FONT_FAMILY, THEME, MIME_TYPES, ROUNDNESS, DEFAULT_LASER_COLOR, UserIdleState, normalizeLink, sceneCoordsToViewportCoords, viewportCoordsToSceneCoords, getFormFactor, } from "@orangecatai/common";
@@ -53,7 +54,7 @@ export { AIChatPanel } from "./components/AIChatPanel";
 export type { AIChatPanelProps, AIChatPanelRef, ChatMessage, ChatSession, } from "./components/AIChatPanel";
 export type { ExcalidrawImperativeAPI } from "./types";
 export type { AppState, BinaryFiles, BinaryFileData, ExcalidrawProps, ExcalidrawInitialDataState, LibraryItem, LibraryItems, SceneData, UnsubscribeCallback, } from "./types";
-export type { ExcalidrawElement, NonDeletedExcalidrawElement, NonDeleted, OrderedExcalidrawElement, ExcalidrawElementType, } from "@orangecatai/element/types";
+export type { ExcalidrawElement, NonDeletedExcalidrawElement, NonDeleted, OrderedExcalidrawElement, ExcalidrawElementType, ExcalidrawVideoElement, } from "@orangecatai/element/types";
 export type { ImageEditToolbarCallbacks } from "./components/ImageEditToolbar";
 export type { CustomFontSpec, BrandContext } from "./types";
 export type { ReviewerFeedback, ReviewIssue, } from "./components/ai-chat/reviewerAgent";

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

@@ -132,6 +132,7 @@ export type ElementShapes = {
     line: Drawable[];
     text: null;
     image: null;
+    video: Drawable;
     frame: null;
     magicframe: null;
 };

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

@@ -619,6 +619,35 @@ export interface ExcalidrawProps {
      * Called after a successful image generation from any panel or agent tool.
      */
     onAfterImageGen?: () => void;
+    /**
+     * Host proxy URL for video uploads. The SDK POSTs multipart/form-data with
+     * a `file` field; the host stores the video and returns `{ url: string }`.
+     * Without this prop, video upload via drag-and-drop is silently ignored.
+     */
+    videoUploadUrl?: string;
+    /**
+     * Called before a video upload begins. Return `{ allowed: false }` to block
+     * (e.g. quota exceeded). Host uses this for credit gating.
+     */
+    onBeforeVideoUpload?: () => Promise<{
+        allowed: boolean;
+        error?: string;
+    }>;
+    /** Called after a video is successfully uploaded and placed on the canvas. */
+    onAfterVideoUpload?: () => void;
+    /** Host proxy URL for video generation jobs (POST). */
+    videoGenUrl?: string;
+    /** Host proxy URL for polling video generation job status (GET {url}/{jobId}). */
+    videoGenStatusUrl?: string;
+    /** Called before a video generation job is submitted (credit gate). */
+    onBeforeVideoGen?: () => Promise<{
+        allowed: boolean;
+        error?: string;
+    }>;
+    /** Called after a video is successfully generated and inserted into the canvas. */
+    onAfterVideoGen?: () => void;
+    /** Host proxy URL for video downloads — works around S3 CORS / presigned-URL expiry. */
+    videoDownloadProxyUrl?: string;
     /**
      * Called before a background removal is run (deduct credits, check quota).
      * Return `{ allowed: false, error: "..." }` to block the operation.
@@ -822,8 +851,10 @@ export type AppClassProperties = {
     insertEmbeddableElement: App["insertEmbeddableElement"];
     onMagicframeToolSelect: App["onMagicframeToolSelect"];
     onImageGeneratorSelect: App["onImageGeneratorSelect"];
+    onVideoGeneratorSelect: App["onVideoGeneratorSelect"];
     insertGeneratedImageIntoFrame: App["insertGeneratedImageIntoFrame"];
     insertGeneratedImageNearElement: App["insertGeneratedImageNearElement"];
+    insertGeneratedVideoIntoFrame: App["insertGeneratedVideoIntoFrame"];
     getName: App["getName"];
     dismissLinearEditor: App["dismissLinearEditor"];
     flowChartCreator: App["flowChartCreator"];
@@ -844,6 +875,8 @@ export type AppClassProperties = {
     refreshEditorInterface: App["refreshEditorInterface"];
     lassoTrail: App["lassoTrail"];
     toggleSidebar: App["toggleSidebar"];
+    insertVideos: App["insertVideos"];
+    onVideoToolbarButtonClick: App["onVideoToolbarButtonClick"];
 };
 export type PointerDownState = Readonly<{
     origin: Readonly<{

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

@@ -0,0 +1,30 @@
+export interface VideoJobParams {
+    model: string;
+    prompt: string;
+    aspectRatio: string;
+    duration?: number;
+    resolution?: string;
+    firstFrameDataUrl?: string;
+    lastFrameDataUrl?: string;
+    audio?: boolean;
+    negativePrompt?: string;
+    inputReferences?: string[];
+    seed?: number;
+}
+export interface VideoJobResult {
+    videoPresignedUrl: string;
+}
+/**
+ * Submit a video generation job to the host proxy.
+ * Returns { jobId } immediately — the job runs async on OpenRouter.
+ */
+export declare function submitVideoJob(params: VideoJobParams, videoGenUrl: string): Promise<{
+    jobId: string;
+}>;
+/**
+ * Poll the host status endpoint until the job is done or failed.
+ * onProgress is called with values 0–1 as they arrive.
+ * Resolves with { videoPresignedUrl } on success.
+ * Rejects with an Error on failure or abort.
+ */
+export declare function pollVideoJob(jobId: string, videoGenStatusUrl: string, onProgress: (progress: number) => void, signal?: AbortSignal): Promise<VideoJobResult>;