@zsviczian/excalidraw 0.18.0-51 → 0.18.0-53

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zsviczian/excalidraw",
-  "version": "0.18.0-51",
+  "version": "0.18.0-53",
   "main": "main.js",
   "module": "./dist/prod/index.js",
   "source": "./index.tsx",

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

@@ -87,6 +87,7 @@ export declare const CLASSES: {
     SEARCH_MENU_INPUT_WRAPPER: string;
     CONVERT_ELEMENT_TYPE_POPUP: string;
     SHAPE_ACTIONS_THEME_SCOPE: string;
+    FRAME_NAME: string;
 };
 export declare const CJK_HAND_DRAWN_FALLBACK_FONT = "Xiaolai";
 export declare const WINDOWS_EMOJI_FALLBACK_FONT = "Segoe UI Emoji";

package/types/common/src/editorInterface.d.ts

@@ -26,9 +26,9 @@ export declare const isChrome: boolean;
 export declare const isSafari: boolean;
 export declare const isIOS: boolean;
 export declare const isBrave: () => boolean;
-export declare const isMobileBreakpoint: (width: number, height: number) => boolean;
+export declare const isMobileBreakpoint: (width: number, height: number, allowMobile: boolean) => boolean;
 export declare const isTabletBreakpoint: (editorWidth: number, editorHeight: number) => boolean;
-export declare const getFormFactor: (editorWidth: number, editorHeight: number) => EditorInterface["formFactor"];
+export declare const getFormFactor: (editorWidth: number, editorHeight: number, allowMobile: boolean) => EditorInterface["formFactor"];
 export declare const deriveStylesPanelMode: (editorInterface: EditorInterface) => StylesPanelMode;
 export declare const createUserAgentDescriptor: (userAgentString: string) => EditorInterface["userAgent"];
 export declare const loadDesktopUIModePreference: () => any;

package/types/common/src/index.d.ts

@@ -10,4 +10,5 @@ export * from "./random";
 export * from "./url";
 export * from "./utils";
 export * from "./emitter";
+export * from "./visualdebug";
 export * from "./editorInterface";

package/types/common/src/visualdebug.d.ts

@@ -0,0 +1,41 @@
+import { type GlobalPoint, type LocalPoint } from "@excalidraw/math";
+import type { Curve } from "@excalidraw/math";
+import type { LineSegment } from "@excalidraw/utils";
+import type { Bounds } from "@excalidraw/element";
+declare global {
+    interface Window {
+        visualDebug?: {
+            data: DebugElement[][];
+            currentFrame?: number;
+        };
+    }
+}
+export type DebugElement = {
+    color: string;
+    data: LineSegment<GlobalPoint> | Curve<GlobalPoint>;
+    permanent: boolean;
+};
+export declare const debugDrawCubicBezier: (c: Curve<GlobalPoint>, opts?: {
+    color?: string;
+    permanent?: boolean;
+}) => void;
+export declare const debugDrawLine: (segment: LineSegment<GlobalPoint> | LineSegment<GlobalPoint>[], opts?: {
+    color?: string;
+    permanent?: boolean;
+}) => void;
+export declare const debugDrawPoint: (p: GlobalPoint, opts?: {
+    color?: string;
+    permanent?: boolean;
+    fuzzy?: boolean;
+}) => void;
+export declare const debugDrawBounds: (box: Bounds | Bounds[], opts?: {
+    color?: string;
+    permanent?: boolean;
+}) => void;
+export declare const debugDrawPoints: ({ x, y, points, }: {
+    x: number;
+    y: number;
+    points: LocalPoint[];
+}, options?: any) => void;
+export declare const debugCloseFrame: () => void;
+export declare const debugClear: () => void;

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

@@ -401,6 +401,7 @@ declare class App extends React.Component<AppProps, AppState> {
      * NOTE if file already exists in editor state, the file data is not updated
      * */
     addFiles: ExcalidrawImperativeAPI["addFiles"];
+    setMobileModeAllowed: (allow: boolean) => void;
     private debounceClearHighlightSearchResults;
     selectElements: ExcalidrawImperativeAPI["selectElements"];
     bringToFront: ExcalidrawImperativeAPI["bringToFront"];

package/types/excalidraw/components/canvases/InteractiveCanvas.d.ts

@@ -1,8 +1,8 @@
 import React from "react";
 import { type EditorInterface } from "@excalidraw/common";
+import type { RenderableElementsMap, RenderInteractiveSceneCallback } from "@excalidraw/excalidraw/scene/types";
 import type { NonDeletedExcalidrawElement, NonDeletedSceneElementsMap } from "@excalidraw/element/types";
-import type { RenderableElementsMap, RenderInteractiveSceneCallback } from "../../scene/types";
-import type { InteractiveCanvasAppState } from "../../types";
+import type { AppClassProperties, InteractiveCanvasAppState } from "../../types";
 import type { DOMAttributes } from "react";
 type InteractiveCanvasProps = {
     containerRef: React.RefObject<HTMLDivElement | null>;
@@ -17,6 +17,7 @@ type InteractiveCanvasProps = {
     appState: InteractiveCanvasAppState;
     renderScrollbars: boolean;
     editorInterface: EditorInterface;
+    app: AppClassProperties;
     renderInteractiveSceneCallback: (data: RenderInteractiveSceneCallback) => void;
     handleCanvasRef: (canvas: HTMLCanvasElement | null) => void;
     onContextMenu: Exclude<DOMAttributes<HTMLCanvasElement | HTMLDivElement>["onContextMenu"], undefined>;
@@ -27,5 +28,6 @@ type InteractiveCanvasProps = {
     onPointerDown: Exclude<DOMAttributes<HTMLCanvasElement>["onPointerDown"], undefined>;
     onDoubleClick: Exclude<DOMAttributes<HTMLCanvasElement>["onDoubleClick"], undefined>;
 };
+export declare const INTERACTIVE_SCENE_ANIMATION_KEY = "animateInteractiveScene";
 declare const _default: React.MemoExoticComponent<(props: InteractiveCanvasProps) => import("react/jsx-runtime").JSX.Element>;
 export default _default;

package/types/excalidraw/renderer/animation.d.ts

@@ -0,0 +1,12 @@
+export type Animation<R extends object> = (params: {
+    deltaTime: number;
+    state?: R;
+}) => R | null | undefined;
+export declare class AnimationController {
+    private static isRunning;
+    private static animations;
+    static start<R extends object>(key: string, animation: Animation<R>): void;
+    private static tick;
+    static running(key: string): boolean;
+    static cancel(key: string): void;
+}

package/types/excalidraw/renderer/interactiveScene.d.ts

@@ -1,20 +1,12 @@
+import { getScrollBars } from "../scene/scrollbars";
 import type { InteractiveSceneRenderConfig, RenderableElementsMap } from "../scene/types";
-/** throttled to animation framerate */
-export declare const renderInteractiveSceneThrottled: {
-    (config: InteractiveSceneRenderConfig): void;
-    flush(): void;
-    cancel(): void;
-};
 /**
  * Interactive scene is the ui-canvas where we render bounding boxes, selections
  * and other ui stuff.
  */
-export declare const renderInteractiveScene: <U extends ({ canvas, elementsMap, visibleElements, selectedElements, allElementsMap, scale, appState, renderConfig, editorInterface, }: InteractiveSceneRenderConfig) => {
+export declare const renderInteractiveScene: <U extends ({ canvas, elementsMap, visibleElements, selectedElements, allElementsMap, scale, appState, renderConfig, editorInterface, animationState, deltaTime, }: InteractiveSceneRenderConfig) => {
+    scrollBars?: import("../scene/types").ScrollBars | undefined;
     atLeastOneVisibleElement: boolean;
     elementsMap: RenderableElementsMap;
-    scrollBars?: undefined;
-} | {
-    scrollBars: import("../scene/types").ScrollBars | undefined;
-    atLeastOneVisibleElement: boolean;
-    elementsMap: RenderableElementsMap;
-}, T extends boolean = false>(renderConfig: InteractiveSceneRenderConfig, throttle?: T | undefined) => T extends true ? void : ReturnType<U>;
+    animationState?: import("../scene/types").InteractiveSceneRenderAnimationState | undefined;
+}>(renderConfig: InteractiveSceneRenderConfig) => ReturnType<U>;

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

@@ -62,7 +62,13 @@ export type StaticSceneRenderConfig = {
     appState: StaticCanvasAppState;
     renderConfig: StaticCanvasRenderConfig;
 };
+export type InteractiveSceneRenderAnimationState = {
+    bindingHighlight: {
+        runtime: number;
+    } | undefined;
+};
 export type InteractiveSceneRenderConfig = {
+    app: AppClassProperties;
     canvas: HTMLCanvasElement | null;
     elementsMap: RenderableElementsMap;
     visibleElements: readonly NonDeletedExcalidrawElement[];
@@ -73,6 +79,8 @@ export type InteractiveSceneRenderConfig = {
     renderConfig: InteractiveCanvasRenderConfig;
     editorInterface: EditorInterface;
     callback: (data: RenderInteractiveSceneCallback) => void;
+    animationState?: InteractiveSceneRenderAnimationState;
+    deltaTime: number;
 };
 export type NewElementSceneRenderConfig = {
     canvas: HTMLCanvasElement | null;

package/types/excalidraw/types.d.ts

@@ -709,6 +709,7 @@ export interface ExcalidrawImperativeAPI {
     isTouchScreen: InstanceType<typeof App>["isTouchScreen"];
     setTrayModeEnabled: InstanceType<typeof App>["setTrayModeEnabled"];
     setDesktopUIMode: InstanceType<typeof App>["setDesktopUIMode"];
+    setMobileModeAllowed: InstanceType<typeof App>["setMobileModeAllowed"];
     isTrayModeEnabled: InstanceType<typeof App>["isTrayModeEnabled"];
     getColorAtScenePoint: InstanceType<typeof App>["getColorAtScenePoint"];
     startLineEditor: InstanceType<typeof App>["startLineEditor"];