@excalidraw/math 0.18.0-0457ac9 → 0.18.0-063e025

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

@@ -43,7 +43,7 @@ export declare const actionToggleObjectsSnapMode: {
                 clip: boolean;
             };
             editingFrame: string | null;
-            elementsToHighlight: import("@excalidraw/element/types").NonDeleted<import("@excalidraw/element/types").ExcalidrawElement>[] | null;
+            elementsToHighlight: readonly import("@excalidraw/element/types").NonDeletedExcalidrawElement[] | null;
             editingTextElement: import("@excalidraw/element/types").ExcalidrawTextElement | null;
             activeTool: {
                 lastActiveTool: import("../types").ActiveTool | null;
@@ -63,9 +63,10 @@ export declare const actionToggleObjectsSnapMode: {
             currentItemStrokeColor: string;
             currentItemBackgroundColor: string;
             currentItemFillStyle: import("@excalidraw/element/types").ExcalidrawElement["fillStyle"];
-            currentItemStrokeWidth: number;
+            currentItemStrokeWidthKey: import("@excalidraw/common").StrokeWidthKey;
             currentItemStrokeStyle: import("@excalidraw/element/types").ExcalidrawElement["strokeStyle"];
             currentItemRoughness: number;
+            currentItemStrokeVariability: import("@excalidraw/element/types").StrokeVariability;
             currentItemOpacity: number;
             currentItemFontFamily: import("@excalidraw/element/types").FontFamilyValues;
             currentItemFontSize: number;
@@ -78,6 +79,7 @@ export declare const actionToggleObjectsSnapMode: {
             viewBackgroundColor: string;
             scrollX: number;
             scrollY: number;
+            scrollConstraints: import("../types").ScrollConstraints | null;
             cursorButton: "up" | "down";
             scrolledOutside: boolean;
             name: string | null;
@@ -167,7 +169,7 @@ export declare const actionToggleObjectsSnapMode: {
         };
         captureUpdate: "EVENTUALLY";
     };
-    checked: (appState: Readonly<import("../types").AppState>) => boolean;
+    checked: (appState: Readonly<import("../types").UIAppState>) => boolean;
     predicate: (elements: readonly import("@excalidraw/element/types").ExcalidrawElement[], appState: import("../types").AppState, appProps: import("../types").ExcalidrawProps) => boolean;
     keyTest: (event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean;
 } & {

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

@@ -1,4 +1,3 @@
-import type { AppState } from "../types";
 export declare const actionToggleSearchMenu: {
     name: "searchMenu";
     icon: import("react/jsx-runtime").JSX.Element;
@@ -8,9 +7,9 @@ export declare const actionToggleSearchMenu: {
     trackEvent: {
         category: "search_menu";
         action: string;
-        predicate: (appState: Readonly<AppState>) => boolean;
+        predicate: (appState: Readonly<import("../types").AppState>) => boolean;
     };
-    perform(elements: readonly import("@excalidraw/element/types").OrderedExcalidrawElement[], appState: Readonly<AppState>, _: unknown, app: import("../types").AppClassProperties): false | {
+    perform(elements: readonly import("@excalidraw/element/types").OrderedExcalidrawElement[], appState: Readonly<import("../types").AppState>, _: unknown, app: import("../types").AppClassProperties): false | {
         appState: {
             openSidebar: {
                 name: "default";
@@ -49,7 +48,7 @@ export declare const actionToggleSearchMenu: {
                 clip: boolean;
             };
             editingFrame: string | null;
-            elementsToHighlight: import("@excalidraw/element/types").NonDeleted<import("@excalidraw/element/types").ExcalidrawElement>[] | null;
+            elementsToHighlight: readonly import("@excalidraw/element/types").NonDeletedExcalidrawElement[] | null;
             editingTextElement: import("@excalidraw/element/types").ExcalidrawTextElement | null;
             activeTool: {
                 lastActiveTool: import("../types").ActiveTool | null;
@@ -69,9 +68,10 @@ export declare const actionToggleSearchMenu: {
             currentItemStrokeColor: string;
             currentItemBackgroundColor: string;
             currentItemFillStyle: import("@excalidraw/element/types").ExcalidrawElement["fillStyle"];
-            currentItemStrokeWidth: number;
+            currentItemStrokeWidthKey: import("@excalidraw/common").StrokeWidthKey;
             currentItemStrokeStyle: import("@excalidraw/element/types").ExcalidrawElement["strokeStyle"];
             currentItemRoughness: number;
+            currentItemStrokeVariability: import("@excalidraw/element/types").StrokeVariability;
             currentItemOpacity: number;
             currentItemFontFamily: import("@excalidraw/element/types").FontFamilyValues;
             currentItemFontSize: number;
@@ -84,6 +84,7 @@ export declare const actionToggleSearchMenu: {
             viewBackgroundColor: string;
             scrollX: number;
             scrollY: number;
+            scrollConstraints: import("../types").ScrollConstraints | null;
             cursorButton: "up" | "down";
             scrolledOutside: boolean;
             name: string | null;
@@ -154,8 +155,8 @@ export declare const actionToggleSearchMenu: {
         };
         captureUpdate: "EVENTUALLY";
     };
-    checked: (appState: AppState) => boolean;
-    predicate: (element: readonly import("@excalidraw/element/types").ExcalidrawElement[], appState: AppState, props: import("../types").ExcalidrawProps) => boolean;
+    checked: (appState: Readonly<import("../types").UIAppState>) => boolean;
+    predicate: (element: readonly import("@excalidraw/element/types").ExcalidrawElement[], appState: import("../types").AppState, props: import("../types").ExcalidrawProps) => boolean;
     keyTest: (event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean;
 } & {
     keyTest?: ((event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean) | undefined;

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

@@ -12,7 +12,7 @@ export declare const actionToggleShapeSwitch: {
     perform(elements: readonly import("@excalidraw/element/types").OrderedExcalidrawElement[], appState: Readonly<import("../types").AppState>, _: unknown, app: import("../types").AppClassProperties): {
         captureUpdate: "NEVER";
     };
-    checked: (appState: Readonly<import("../types").AppState>) => boolean;
+    checked: (appState: Readonly<import("../types").UIAppState>) => boolean;
     predicate: (elements: readonly ExcalidrawElement[], appState: import("../types").AppState, props: import("../types").ExcalidrawProps) => boolean;
 } & {
     keyTest?: undefined;

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

@@ -45,7 +45,7 @@ export declare const actionToggleStats: {
                 clip: boolean;
             };
             editingFrame: string | null;
-            elementsToHighlight: import("@excalidraw/element/types").NonDeleted<import("@excalidraw/element/types").ExcalidrawElement>[] | null;
+            elementsToHighlight: readonly import("@excalidraw/element/types").NonDeletedExcalidrawElement[] | null;
             editingTextElement: import("@excalidraw/element/types").ExcalidrawTextElement | null;
             activeTool: {
                 lastActiveTool: import("../types").ActiveTool | null;
@@ -65,9 +65,10 @@ export declare const actionToggleStats: {
             currentItemStrokeColor: string;
             currentItemBackgroundColor: string;
             currentItemFillStyle: import("@excalidraw/element/types").ExcalidrawElement["fillStyle"];
-            currentItemStrokeWidth: number;
+            currentItemStrokeWidthKey: import("@excalidraw/common").StrokeWidthKey;
             currentItemStrokeStyle: import("@excalidraw/element/types").ExcalidrawElement["strokeStyle"];
             currentItemRoughness: number;
+            currentItemStrokeVariability: import("@excalidraw/element/types").StrokeVariability;
             currentItemOpacity: number;
             currentItemFontFamily: import("@excalidraw/element/types").FontFamilyValues;
             currentItemFontSize: number;
@@ -80,6 +81,7 @@ export declare const actionToggleStats: {
             viewBackgroundColor: string;
             scrollX: number;
             scrollY: number;
+            scrollConstraints: import("../types").ScrollConstraints | null;
             cursorButton: "up" | "down";
             scrolledOutside: boolean;
             name: string | null;
@@ -167,7 +169,7 @@ export declare const actionToggleStats: {
         };
         captureUpdate: "EVENTUALLY";
     };
-    checked: (appState: Readonly<import("../types").AppState>) => boolean;
+    checked: (appState: Readonly<import("../types").UIAppState>) => boolean;
     keyTest: (event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean;
 } & {
     keyTest?: ((event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean) | undefined;

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

@@ -42,7 +42,7 @@ export declare const actionToggleViewMode: {
                 clip: boolean;
             };
             editingFrame: string | null;
-            elementsToHighlight: import("@excalidraw/element/types").NonDeleted<import("@excalidraw/element/types").ExcalidrawElement>[] | null;
+            elementsToHighlight: readonly import("@excalidraw/element/types").NonDeletedExcalidrawElement[] | null;
             editingTextElement: import("@excalidraw/element/types").ExcalidrawTextElement | null;
             activeTool: {
                 lastActiveTool: import("../types").ActiveTool | null;
@@ -62,9 +62,10 @@ export declare const actionToggleViewMode: {
             currentItemStrokeColor: string;
             currentItemBackgroundColor: string;
             currentItemFillStyle: import("@excalidraw/element/types").ExcalidrawElement["fillStyle"];
-            currentItemStrokeWidth: number;
+            currentItemStrokeWidthKey: import("@excalidraw/common").StrokeWidthKey;
             currentItemStrokeStyle: import("@excalidraw/element/types").ExcalidrawElement["strokeStyle"];
             currentItemRoughness: number;
+            currentItemStrokeVariability: import("@excalidraw/element/types").StrokeVariability;
             currentItemOpacity: number;
             currentItemFontFamily: import("@excalidraw/element/types").FontFamilyValues;
             currentItemFontSize: number;
@@ -77,6 +78,7 @@ export declare const actionToggleViewMode: {
             viewBackgroundColor: string;
             scrollX: number;
             scrollY: number;
+            scrollConstraints: import("../types").ScrollConstraints | null;
             cursorButton: "up" | "down";
             scrolledOutside: boolean;
             name: string | null;
@@ -167,7 +169,7 @@ export declare const actionToggleViewMode: {
         };
         captureUpdate: "EVENTUALLY";
     };
-    checked: (appState: Readonly<import("../types").AppState>) => boolean;
+    checked: (appState: Readonly<import("../types").UIAppState>) => boolean;
     predicate: (elements: readonly import("@excalidraw/element/types").ExcalidrawElement[], appState: import("../types").AppState, appProps: import("../types").ExcalidrawProps) => boolean;
     keyTest: (event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean;
 } & {

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

@@ -42,7 +42,7 @@ export declare const actionToggleZenMode: {
                 clip: boolean;
             };
             editingFrame: string | null;
-            elementsToHighlight: import("@excalidraw/element/types").NonDeleted<import("@excalidraw/element/types").ExcalidrawElement>[] | null;
+            elementsToHighlight: readonly import("@excalidraw/element/types").NonDeletedExcalidrawElement[] | null;
             editingTextElement: import("@excalidraw/element/types").ExcalidrawTextElement | null;
             activeTool: {
                 lastActiveTool: import("../types").ActiveTool | null;
@@ -62,9 +62,10 @@ export declare const actionToggleZenMode: {
             currentItemStrokeColor: string;
             currentItemBackgroundColor: string;
             currentItemFillStyle: import("@excalidraw/element/types").ExcalidrawElement["fillStyle"];
-            currentItemStrokeWidth: number;
+            currentItemStrokeWidthKey: import("@excalidraw/common").StrokeWidthKey;
             currentItemStrokeStyle: import("@excalidraw/element/types").ExcalidrawElement["strokeStyle"];
             currentItemRoughness: number;
+            currentItemStrokeVariability: import("@excalidraw/element/types").StrokeVariability;
             currentItemOpacity: number;
             currentItemFontFamily: import("@excalidraw/element/types").FontFamilyValues;
             currentItemFontSize: number;
@@ -77,6 +78,7 @@ export declare const actionToggleZenMode: {
             viewBackgroundColor: string;
             scrollX: number;
             scrollY: number;
+            scrollConstraints: import("../types").ScrollConstraints | null;
             cursorButton: "up" | "down";
             scrolledOutside: boolean;
             name: string | null;
@@ -167,7 +169,7 @@ export declare const actionToggleZenMode: {
         };
         captureUpdate: "EVENTUALLY";
     };
-    checked: (appState: Readonly<import("../types").AppState>) => boolean;
+    checked: (appState: Readonly<import("../types").UIAppState>) => boolean;
     predicate: (elements: readonly import("@excalidraw/element/types").ExcalidrawElement[], appState: import("../types").AppState, appProps: import("../types").ExcalidrawProps, app: import("../types").AppClassProperties) => boolean;
     keyTest: (event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean;
 } & {

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

@@ -2,7 +2,7 @@ export { actionDeleteSelected } from "./actionDeleteSelected";
 export { actionBringForward, actionBringToFront, actionSendBackward, actionSendToBack, } from "./actionZindex";
 export { actionSelectAll } from "./actionSelectAll";
 export { actionDuplicateSelection } from "./actionDuplicateSelection";
-export { actionChangeStrokeColor, actionChangeBackgroundColor, actionChangeStrokeWidth, actionChangeFillStyle, actionChangeSloppiness, actionChangeOpacity, actionChangeFontSize, actionChangeFontFamily, actionChangeTextAlign, actionChangeVerticalAlign, actionChangeArrowProperties, } from "./actionProperties";
+export { actionChangeStrokeColor, actionChangeBackgroundColor, actionChangeStrokeWidth, actionChangeFillStyle, actionChangeSloppiness, actionChangeFreedrawMode, actionChangeOpacity, actionChangeFontSize, actionChangeFontFamily, actionChangeTextAlign, actionChangeVerticalAlign, actionChangeArrowProperties, } from "./actionProperties";
 export { actionChangeViewBackgroundColor, actionClearCanvas, actionZoomIn, actionZoomOut, actionResetZoom, actionZoomToFit, actionToggleTheme, } from "./actionCanvas";
 export { actionSetEmbeddableAsActiveTool } from "./actionEmbeddable";
 export { actionFinalize } from "./actionFinalize";

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

@@ -14,10 +14,10 @@ export type ActionResult = {
 type ActionFn<TData = any> = (elements: readonly OrderedExcalidrawElement[], appState: Readonly<AppState>, formData: TData | undefined, app: AppClassProperties) => ActionResult | Promise<ActionResult>;
 export type UpdaterFn = (res: ActionResult) => void;
 export type ActionFilterFn = (action: Action) => void;
-export type ActionName = "copy" | "cut" | "paste" | "copyAsPng" | "copyAsSvg" | "copyText" | "sendBackward" | "bringForward" | "sendToBack" | "bringToFront" | "copyStyles" | "selectAll" | "pasteStyles" | "gridMode" | "zenMode" | "objectsSnapMode" | "arrowBinding" | "midpointSnapping" | "stats" | "changeStrokeColor" | "changeBackgroundColor" | "changeFillStyle" | "changeStrokeWidth" | "changeStrokeShape" | "changeSloppiness" | "changeStrokeStyle" | "changeArrowhead" | "changeArrowType" | "changeArrowProperties" | "changeOpacity" | "changeFontSize" | "undo" | "redo" | "finalize" | "changeProjectName" | "changeExportBackground" | "changeExportEmbedScene" | "changeExportScale" | "saveToActiveFile" | "saveFileToDisk" | "loadScene" | "duplicateSelection" | "deleteSelectedElements" | "changeViewBackgroundColor" | "clearCanvas" | "zoomIn" | "zoomOut" | "resetZoom" | "zoomToFit" | "zoomToFitSelection" | "zoomToFitSelectionInViewport" | "changeFontFamily" | "changeTextAlign" | "changeVerticalAlign" | "toggleFullScreen" | "toggleShortcuts" | "group" | "ungroup" | "goToCollaborator" | "addToLibrary" | "changeRoundness" | "alignTop" | "alignBottom" | "alignLeft" | "alignRight" | "alignVerticallyCentered" | "alignHorizontallyCentered" | "distributeHorizontally" | "distributeVertically" | "flipHorizontal" | "flipVertical" | "deselect" | "viewMode" | "exportWithDarkMode" | "toggleTheme" | "increaseFontSize" | "decreaseFontSize" | "unbindText" | "hyperlink" | "bindText" | "unlockAllElements" | "toggleElementLock" | "toggleLinearEditor" | "toggleEraserTool" | "toggleHandTool" | "selectAllElementsInFrame" | "removeAllElementsFromFrame" | "updateFrameRendering" | "setFrameAsActiveTool" | "setEmbeddableAsActiveTool" | "createContainerFromText" | "wrapTextInContainer" | "commandPalette" | "autoResize" | "elementStats" | "searchMenu" | "copyElementLink" | "linkToElement" | "cropEditor" | "wrapSelectionInFrame" | "toggleLassoTool" | "toggleShapeSwitch" | "togglePolygon";
+export type ActionName = "copy" | "cut" | "paste" | "copyAsPng" | "copyAsSvg" | "copyText" | "sendBackward" | "bringForward" | "sendToBack" | "bringToFront" | "copyStyles" | "selectAll" | "pasteStyles" | "gridMode" | "zenMode" | "objectsSnapMode" | "arrowBinding" | "midpointSnapping" | "stats" | "changeStrokeColor" | "changeBackgroundColor" | "changeFillStyle" | "changeStrokeWidth" | "changeStrokeShape" | "changeSloppiness" | "changeFreedrawMode" | "changeStrokeStyle" | "changeArrowhead" | "changeArrowType" | "changeArrowProperties" | "changeOpacity" | "changeFontSize" | "undo" | "redo" | "finalize" | "changeProjectName" | "changeExportBackground" | "changeExportEmbedScene" | "changeExportScale" | "saveToActiveFile" | "saveFileToDisk" | "loadScene" | "duplicateSelection" | "deleteSelectedElements" | "changeViewBackgroundColor" | "clearCanvas" | "zoomIn" | "zoomOut" | "resetZoom" | "zoomToFit" | "zoomToFitSelection" | "zoomToFitSelectionInViewport" | "changeFontFamily" | "changeTextAlign" | "changeVerticalAlign" | "toggleFullScreen" | "toggleShortcuts" | "group" | "ungroup" | "goToCollaborator" | "addToLibrary" | "changeRoundness" | "alignTop" | "alignBottom" | "alignLeft" | "alignRight" | "alignVerticallyCentered" | "alignHorizontallyCentered" | "distributeHorizontally" | "distributeVertically" | "flipHorizontal" | "flipVertical" | "deselect" | "viewMode" | "exportWithDarkMode" | "toggleTheme" | "increaseFontSize" | "decreaseFontSize" | "unbindText" | "hyperlink" | "bindText" | "unlockAllElements" | "toggleElementLock" | "toggleLinearEditor" | "toggleEraserTool" | "toggleHandTool" | "selectAllElementsInFrame" | "removeAllElementsFromFrame" | "updateFrameRendering" | "setFrameAsActiveTool" | "setEmbeddableAsActiveTool" | "createContainerFromText" | "wrapTextInContainer" | "commandPalette" | "autoResize" | "elementStats" | "searchMenu" | "copyElementLink" | "linkToElement" | "cropEditor" | "wrapSelectionInFrame" | "toggleLassoTool" | "toggleShapeSwitch" | "togglePolygon";
 export type PanelComponentProps = {
     elements: readonly ExcalidrawElement[];
-    appState: AppState;
+    appState: UIAppState;
     updateData: <T = any>(formData?: T) => void;
     appProps: ExcalidrawProps;
     data?: Record<string, any>;
@@ -26,7 +26,7 @@ export type PanelComponentProps = {
 };
 export interface Action<TData = any> {
     name: ActionName;
-    label: string | ((elements: readonly ExcalidrawElement[], appState: Readonly<AppState>, app: AppClassProperties) => string);
+    label: string | ((elements: readonly ExcalidrawElement[], appState: Readonly<UIAppState>, app: AppClassProperties) => string);
     keywords?: string[];
     icon?: React.ReactNode | ((appState: UIAppState, elements: readonly ExcalidrawElement[]) => React.ReactNode);
     PanelComponent?: React.FC<PanelComponentProps>;
@@ -34,7 +34,7 @@ export interface Action<TData = any> {
     keyPriority?: number;
     keyTest?: (event: React.KeyboardEvent | KeyboardEvent, appState: AppState, elements: readonly ExcalidrawElement[], app: AppClassProperties) => boolean;
     predicate?: (elements: readonly ExcalidrawElement[], appState: AppState, appProps: ExcalidrawProps, app: AppClassProperties) => boolean;
-    checked?: (appState: Readonly<AppState>) => boolean;
+    checked?: (appState: Readonly<UIAppState>) => boolean;
     trackEvent: false | {
         category: "toolbar" | "element" | "canvas" | "export" | "history" | "menu" | "collab" | "hyperlink" | "search_menu" | "shape_switch";
         action?: string;

package/dist/types/excalidraw/{animated-trail.d.ts → animatedTrail.d.ts}

@@ -1,6 +1,5 @@
 import { LaserPointer } from "@excalidraw/laser-pointer";
 import type { LaserPointerOptions } from "@excalidraw/laser-pointer";
-import type { AnimationFrameHandler } from "./animation-frame-handler";
 import type App from "./components/App";
 export interface Trail {
     start(container: SVGSVGElement): void;
@@ -15,7 +14,6 @@ export interface AnimatedTrailOptions {
     animateTrail?: boolean;
 }
 export declare class AnimatedTrail implements Trail {
-    private animationFrameHandler;
     protected app: App;
     private options;
     private currentTrail?;
@@ -23,9 +21,12 @@ export declare class AnimatedTrail implements Trail {
     private container?;
     private trailElement;
     private trailAnimation?;
-    constructor(animationFrameHandler: AnimationFrameHandler, app: App, options: Partial<LaserPointerOptions> & Partial<AnimatedTrailOptions>);
+    private key;
+    private static counter;
+    constructor(app: App, options: Partial<LaserPointerOptions> & Partial<AnimatedTrailOptions>);
     get hasCurrentTrail(): boolean;
     hasLastPoint(x: number, y: number): boolean;
+    private cleanup;
     start(container?: SVGSVGElement): void;
     stop(): void;
     startPath(x: number, y: number): void;

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

@@ -45,9 +45,10 @@ export declare const clearAppStateForLocalStorage: (appState: Partial<AppState>)
     currentItemStrokeColor?: string | undefined;
     currentItemBackgroundColor?: string | undefined;
     currentItemFillStyle?: import("@excalidraw/element/types").FillStyle | undefined;
-    currentItemStrokeWidth?: number | undefined;
+    currentItemStrokeWidthKey?: import("@excalidraw/common").StrokeWidthKey | undefined;
     currentItemStrokeStyle?: import("@excalidraw/element/types").StrokeStyle | undefined;
     currentItemRoughness?: number | undefined;
+    currentItemStrokeVariability?: import("@excalidraw/element/types").StrokeVariability | undefined;
     currentItemOpacity?: number | undefined;
     currentItemFontFamily?: number | undefined;
     currentItemFontSize?: number | undefined;

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

@@ -1,6 +1,6 @@
 import type { ExcalidrawElement, NonDeletedElementsMap, NonDeletedSceneElementsMap } from "@excalidraw/element/types";
 import "./Actions.scss";
-import type { AppClassProperties, AppProps, UIAppState, Zoom, AppState } from "../types";
+import type { AppClassProperties, AppProps, UIAppState, AppState } from "../types";
 import type { ActionManager } from "../actions/manager";
 export declare const canChangeStrokeColor: (appState: UIAppState, targetElements: ExcalidrawElement[]) => boolean;
 export declare const canChangeBackgroundColor: (appState: UIAppState, targetElements: ExcalidrawElement[]) => boolean;
@@ -30,9 +30,8 @@ export declare const ShapesSwitcher: ({ activeTool, setAppState, app, UIOptions,
     app: AppClassProperties;
     UIOptions: AppProps["UIOptions"];
 }) => import("react/jsx-runtime").JSX.Element;
-export declare const ZoomActions: ({ renderAction, zoom, }: {
+export declare const ZoomActions: ({ renderAction, }: {
     renderAction: ActionManager["renderAction"];
-    zoom: Zoom;
 }) => import("react/jsx-runtime").JSX.Element;
 export declare const UndoRedoActions: ({ renderAction, className, }: {
     renderAction: ActionManager["renderAction"];

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

@@ -1,4 +1,4 @@
-export declare const activeConfirmDialogAtom: import("jotai/vanilla/atom").PrimitiveAtom<"clearCanvas" | null> & {
+export declare const activeConfirmDialogAtom: import("jotai").PrimitiveAtom<"clearCanvas" | null> & {
     init: "clearCanvas" | null;
 };
 export declare const ActiveConfirmDialog: () => import("react/jsx-runtime").JSX.Element | null;

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

@@ -4,18 +4,19 @@ import { LinearElementEditor, FlowChartCreator, Scene, Store, type ElementUpdate
 import type { ExcalidrawElement, NonDeleted, NonDeletedExcalidrawElement, ExcalidrawFrameLikeElement, ExcalidrawIframeElement, ExcalidrawEmbeddableElement, Ordered, SceneElementsMap } from "@excalidraw/element/types";
 import type { Mutable } from "@excalidraw/common/utility-types";
 import { ActionManager } from "../actions/manager";
-import { AnimationFrameHandler } from "../animation-frame-handler";
 import { History } from "../history";
 import { Fonts } from "../fonts";
 import { type WritableAtom } from "../editor-jotai";
 import { Renderer } from "../scene/Renderer";
-import { LaserTrails } from "../laser-trails";
+import { type SetViewportOptions } from "../viewport";
+import { LaserTrails } from "../laserTrails";
 import { isOverScrollBars } from "../scene/scrollbars";
 import { LassoTrail } from "../lasso";
 import { EraserTrail } from "../eraser";
+import { CursorHints } from "./CursorHint";
 import { type OnStateChange } from "./AppStateObserver";
 import type { ExportedElements } from "../data";
-import type { AppClassProperties, AppProps, AppState, ExcalidrawImperativeAPI, BinaryFiles, LibraryItems, SceneData, FrameNameBoundsCache, SidebarName, SidebarTabName, ToolType, OnUserFollowedPayload, ExcalidrawImperativeAPIEventMap, GenerateDiagramToCode, NullableGridSize, Offsets } from "../types";
+import type { AppClassProperties, AppProps, AppState, ExcalidrawImperativeAPI, BinaryFiles, LibraryItems, SceneData, FrameNameBoundsCache, SidebarName, SidebarTabName, ToolType, OnUserFollowedPayload, ExcalidrawImperativeAPIEventMap, GenerateDiagramToCode, NullableGridSize, Offsets, ViewportOffsetsOptions } from "../types";
 import type { RoughCanvas } from "roughjs/bin/canvas";
 import type { ActionResult } from "../actions/types";
 declare const editorLifecycleEventBehavior: {
@@ -73,11 +74,20 @@ declare class App extends React.Component<AppProps, AppState> {
     actionManager: ActionManager;
     editorInterface: EditorInterface;
     private stylesPanelMode;
+    /**
+     * Last-measured footprints of named viewport UI surfaces
+     * (`data-viewport-ui-name`), so `getViewportOffsets` can reserve space
+     * for them while they're hidden.
+     */
+    private viewportUILastMeasured;
     private excalidrawContainerRef;
     scene: Scene;
     fonts: Fonts;
     renderer: Renderer;
     visibleElements: readonly NonDeletedExcalidrawElement[];
+    /** whether the last render had any renderable elements (excludes e.g. the
+     * in-progress `newElement` and the edited text element) */
+    private hasRenderableElements;
     private resizeObserver;
     library: AppClassProperties["library"];
     libraryItemsFromStorage: LibraryItems | undefined;
@@ -121,6 +131,9 @@ declare class App extends React.Component<AppProps, AppState> {
         y: number;
     } | null;
     private lastCompletedCanvasClicks;
+    /** arrowheads removed via endpoint double-click toggle, so a subsequent
+     * toggle can restore the original arrowhead (keyed by `elementId:side`) */
+    private removedArrowheads;
     /** previous frame pointer coords */
     previousPointerMoveCoords: {
         x: number;
@@ -130,10 +143,10 @@ declare class App extends React.Component<AppProps, AppState> {
         x: number;
         y: number;
     };
-    animationFrameHandler: AnimationFrameHandler;
     laserTrails: LaserTrails;
     eraserTrail: EraserTrail;
     lassoTrail: LassoTrail;
+    cursorHints: CursorHints;
     onChangeEmitter: Emitter<[elements: readonly ExcalidrawElement[], appState: AppState, files: BinaryFiles]>;
     onPointerDownEmitter: Emitter<[activeTool: {
         lastActiveTool: import("../types").ActiveTool | null;
@@ -302,7 +315,7 @@ declare class App extends React.Component<AppProps, AppState> {
     getSceneElements: () => readonly Ordered<NonDeletedExcalidrawElement>[];
     onInsertElements: (elements: readonly ExcalidrawElement[]) => void;
     onExportImage: (type: keyof typeof EXPORT_IMAGE_TYPES, elements: ExportedElements, opts: {
-        exportingFrame: ExcalidrawFrameLikeElement | null;
+        exportingFrame: NonDeleted<ExcalidrawFrameLikeElement> | null;
     }) => Promise<void>;
     private magicGenerations;
     private updateMagicGeneration;
@@ -360,7 +373,7 @@ declare class App extends React.Component<AppProps, AppState> {
             clientY: number;
         } | "cursor" | "center";
         retainSeed?: boolean;
-        fitToContent?: boolean;
+        fit?: SetViewportOptions["fit"];
         preserveFrameChildrenOrder?: boolean;
     }) => void;
     private addElementsFromMixedContentPaste;
@@ -380,37 +393,36 @@ declare class App extends React.Component<AppProps, AppState> {
      * 1 = 100% zoom, 2 = 200% zoom, 0.5 = 50% zoom
      */
     value: number) => void;
-    private cancelInProgressAnimation;
-    scrollToContent: (
     /**
-     * target to scroll to
+     * Navigates the viewport to a target and, optionally, locks pan/zoom to it.
+     * The resolved target box drives both the navigation (pan + zoom per
+     * `fit`) and the lock: the operations chain — the viewport animates onto
+     * the target, then the lock is installed against the settled viewport.
      *
-     * - string - id of element or group, or url containing elementLink
-     * - ExcalidrawElement | ExcalidrawElement[] - element(s) objects
+     * Passing `null` clears any active lock without navigating.
      */
-    target?: string | ExcalidrawElement | readonly ExcalidrawElement[], opts?: ({
-        fitToContent?: boolean;
-        fitToViewport?: never;
-        viewportZoomFactor?: number;
-        animate?: boolean;
-        duration?: number;
-    } | {
-        fitToContent?: never;
-        fitToViewport?: boolean;
-        /** when fitToViewport=true, how much screen should the content cover,
-         * between 0.1 (10%) and 1 (100%)
-         */
-        viewportZoomFactor?: number;
-        animate?: boolean;
-        duration?: number;
-    }) & {
-        minZoom?: number;
-        maxZoom?: number;
-        canvasOffsets?: Offsets;
-    }) => void;
+    /**
+     * Resolves user-supplied viewport offsets ({@link ViewportOffsets}) into
+     * concrete per-side pixel values: static sides are used as-is, and when
+     * `ui` is set, the remaining sides are derived from the currently
+     * rendered editor UI (via `getViewportOffsets`).
+     *
+     * Must be called at the time the offsets are applied (not e.g. cached at
+     * props-definition time), so the UI-derived values reflect the actual
+     * rendered UI.
+     */
+    private resolveViewportOffsets;
+    setViewport: (opts: SetViewportOptions | null) => void;
     private maybeUnfollowRemoteUser;
     /** use when changing scrollX/scrollY/zoom based on user interaction */
     private translateCanvas;
+    /** clamps scroll/zoom back into `appState.scrollConstraints` (no-op when
+     * unconstrained). Runs as a queued update, so it sees the preceding change.
+     * `overscroll` (screen px) relaxes the bounds for rubberbanding. */
+    private constrainViewportToScrollConstraints;
+    /** animates an overscrolled viewport back inside the constraint box */
+    private snapBackToScrollConstraints;
+    private snapBackToScrollConstraintsDebounced;
     setToast: (toast: AppState["toast"]) => void;
     restoreFileFromShare: () => Promise<void>;
     /**
@@ -448,7 +460,17 @@ declare class App extends React.Component<AppProps, AppState> {
         force?: boolean;
     }) => boolean;
     private updateCurrentCursorPosition;
-    getEditorUIOffsets: () => Offsets;
+    /**
+     * top/right/bottom/left override the final offsets for those sides.
+     *
+     * Default side offsets are measured from the currently rendered UI
+     * surfaces marked with the `data-viewport-ui` attribute (see
+     * {@link ViewportUIDock}), plus padding.
+     *
+     * See {@link ViewportOffsetsOptions} for the individual options
+     * (padding, per-side overrides, reserving space for hidden surfaces).
+     */
+    getViewportOffsets: (opts?: ViewportOffsetsOptions) => Offsets;
     private onKeyDown;
     private onKeyUp;
     private isToolSupported;
@@ -491,6 +513,12 @@ declare class App extends React.Component<AppProps, AppState> {
     private startImageCropping;
     private finishImageCropping;
     private shouldHandleBrowserCanvasDoubleClick;
+    /**
+     * Toggles the arrowhead at the given endpoint between no arrowhead and the
+     * arrowhead it had before the last toggle (falling back to the current
+     * default arrowhead).
+     */
+    private toggleArrowheadAtEndpoint;
     private handleCanvasDoubleClick;
     private handleCanvasClick;
     private getElementLinkAtPosition;
@@ -545,6 +573,7 @@ declare class App extends React.Component<AppProps, AppState> {
     private newImagePlaceholder;
     private handleLinearElementOnPointerDown;
     private getCurrentItemRoundness;
+    private getCurrentItemStrokeWidth;
     private createGenericElementOnPointerDown;
     private createFrameElementOnPointerDown;
     private maybeCacheReferenceSnapPoints;

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

@@ -2,7 +2,7 @@ import type { ColorTuple, ColorPaletteCustom } from "@excalidraw/common";
 import type { ExcalidrawElement } from "@excalidraw/element/types";
 import "./ColorPicker.scss";
 import type { ColorPickerType } from "./colorPickerUtils";
-import type { AppState } from "../../types";
+import type { UIAppState } from "../../types";
 interface ColorPickerProps {
     type: ColorPickerType;
     /**
@@ -13,7 +13,7 @@ interface ColorPickerProps {
     onChange: (color: string) => void;
     label: string;
     elements: readonly ExcalidrawElement[];
-    appState: AppState;
+    appState: UIAppState;
     palette?: ColorPaletteCustom | null;
     topPicks?: ColorTuple;
     updateData: (formData?: any) => void;

package/dist/types/excalidraw/components/ColorPicker/colorPickerUtils.d.ts

@@ -14,7 +14,7 @@ export declare const isCustomColor: ({ color, palette, }: {
 }) => boolean;
 export declare const getMostUsedCustomColors: (elements: readonly ExcalidrawElement[], type: "elementBackground" | "elementStroke", palette: ColorPaletteCustom) => string[];
 export type ActiveColorPickerSectionAtomType = "custom" | "baseColors" | "shades" | "hex" | null;
-export declare const activeColorPickerSectionAtom: import("jotai/vanilla/atom").PrimitiveAtom<ActiveColorPickerSectionAtomType> & {
+export declare const activeColorPickerSectionAtom: import("jotai").PrimitiveAtom<ActiveColorPickerSectionAtomType> & {
     init: ActiveColorPickerSectionAtomType;
 };
 export type ColorPickerType = "canvasBackground" | "elementBackground" | "elementStroke";

package/dist/types/excalidraw/components/CommandPalette/defaultCommandPaletteItems.d.ts

@@ -1,2 +1 @@
-import type { CommandPaletteItem } from "./types";
-export declare const toggleTheme: CommandPaletteItem;
+export {};

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

@@ -2,7 +2,7 @@ import type { ConvertibleTypes, ExcalidrawElement, ExcalidrawTextContainer, Exca
 import type { Scene } from "@excalidraw/element";
 import "./ConvertElementTypePopup.scss";
 import type App from "./App";
-export declare const convertElementTypePopupAtom: import("jotai/vanilla/atom").PrimitiveAtom<{
+export declare const convertElementTypePopupAtom: import("jotai").PrimitiveAtom<{
     type: "panel";
 } | null> & {
     init: {
@@ -19,5 +19,5 @@ export declare const convertElementTypes: (app: App, { conversionType, nextType,
     nextType?: ConvertibleTypes;
     direction?: "left" | "right";
 }) => boolean;
-export declare const getConversionTypeFromElements: (elements: ExcalidrawElement[]) => ConversionType;
+export declare const getConversionTypeFromElements: (elements: readonly ExcalidrawElement[]) => ConversionType;
 export default ConvertElementTypePopup;

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

@@ -0,0 +1,46 @@
+import "./CursorHint.scss";
+import type { AppClassProperties, AppState } from "../types";
+/**
+ * While a recently shown hint is still fresh in memory, tool-switch hints
+ * are suppressed (repeatedly re-picking a tool you just used doesn't need
+ * the reminder). Cycling arrow types and numeric shortcuts bypass this.
+ */
+export declare const CURSOR_HINT_COOLDOWN: number;
+export declare const cursorHintAtom: import("jotai").PrimitiveAtom<{
+    content: React.ReactNode;
+    /** unique per trigger so a re-trigger restarts the hide timer */
+    nonce: number;
+} | null> & {
+    init: {
+        content: React.ReactNode;
+        /** unique per trigger so a re-trigger restarts the hide timer */
+        nonce: number;
+    } | null;
+};
+/**
+ * Owns the cursor-hint policy. App reports semantic interaction events
+ * (what the user did); all decisions about whether and what to show —
+ * cooldown, bypasses, hint content — are made here.
+ */
+export declare class CursorHints {
+    private app;
+    private lastShownAt;
+    constructor(app: AppClassProperties);
+    /**
+     * Shows a transient tooltip next to the cursor, hidden automatically
+     * after a short delay. Repeated calls replace the content and restart
+     * the timer.
+     */
+    show: (content: React.ReactNode) => void;
+    private isOnCooldown;
+    /** arrow type cycled via shortcut (arrow tool already active) */
+    onArrowTypeCycled: (arrowType: AppState["currentItemArrowType"]) => void;
+    /** arrow/line tool picked via keyboard shortcut */
+    onToolShortcut: (tool: "arrow" | "line", source: "letter" | "digit") => void;
+}
+/**
+ * Transient tooltip shown next to the cursor for added affordance after
+ * actions that have no other visual feedback near the pointer (e.g. cycling
+ * arrow types via shortcut). Trigger via `app.cursorHints`.
+ */
+export declare const CursorHint: () => import("react/jsx-runtime").JSX.Element | null;

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

@@ -13,7 +13,7 @@ export type EyeDropperProperties = {
      **/
     colorPickerType: ColorPickerType;
 };
-export declare const activeEyeDropperAtom: import("jotai/vanilla/atom").PrimitiveAtom<EyeDropperProperties | null> & {
+export declare const activeEyeDropperAtom: import("jotai").PrimitiveAtom<EyeDropperProperties | null> & {
     init: EyeDropperProperties | null;
 };
 export declare const EyeDropper: React.FC<{