@excalidraw/excalidraw 0.17.1-550a388 → 0.17.1-62228e0

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

@@ -1,21 +1,21 @@
-import React from "react";
-import { ExcalidrawElement } from "../element/types";
-import { AppClassProperties, AppState, ExcalidrawProps, BinaryFiles, UIAppState } from "../types";
-import { MarkOptional } from "../utility-types";
+import type React from "react";
+import type { ExcalidrawElement, OrderedExcalidrawElement } from "../element/types";
+import type { AppClassProperties, AppState, ExcalidrawProps, BinaryFiles, UIAppState } from "../types";
+import type { MarkOptional } from "../utility-types";
+import type { StoreActionType } from "../store";
 export type ActionSource = "ui" | "keyboard" | "contextMenu" | "api" | "commandPalette";
 /** if false, the action should be prevented */
 export type ActionResult = {
     elements?: readonly ExcalidrawElement[] | null;
     appState?: MarkOptional<AppState, "offsetTop" | "offsetLeft" | "width" | "height"> | null;
     files?: BinaryFiles | null;
-    commitToHistory: boolean;
-    syncHistory?: boolean;
+    storeAction: StoreActionType;
     replaceFiles?: boolean;
 } | false;
-type ActionFn = (elements: readonly ExcalidrawElement[], appState: Readonly<AppState>, formData: any, app: AppClassProperties) => ActionResult | Promise<ActionResult>;
+type ActionFn = (elements: readonly OrderedExcalidrawElement[], appState: Readonly<AppState>, formData: any, 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" | "stats" | "changeStrokeColor" | "changeBackgroundColor" | "changeFillStyle" | "changeStrokeWidth" | "changeStrokeShape" | "changeSloppiness" | "changeStrokeStyle" | "changeArrowhead" | "changeOpacity" | "changeFontSize" | "toggleCanvasMenu" | "toggleEditMenu" | "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" | "viewMode" | "exportWithDarkMode" | "toggleTheme" | "increaseFontSize" | "decreaseFontSize" | "unbindText" | "hyperlink" | "bindText" | "unlockAllElements" | "toggleElementLock" | "toggleLinearEditor" | "toggleEraserTool" | "toggleHandTool" | "selectAllElementsInFrame" | "removeAllElementsFromFrame" | "updateFrameRendering" | "setFrameAsActiveTool" | "setEmbeddableAsActiveTool" | "createContainerFromText" | "wrapTextInContainer" | "commandPalette";
+export type ActionName = "copy" | "cut" | "paste" | "copyAsPng" | "copyAsSvg" | "copyText" | "sendBackward" | "bringForward" | "sendToBack" | "bringToFront" | "copyStyles" | "selectAll" | "pasteStyles" | "gridMode" | "zenMode" | "objectsSnapMode" | "stats" | "changeStrokeColor" | "changeBackgroundColor" | "changeFillStyle" | "changeStrokeWidth" | "changeStrokeShape" | "changeSloppiness" | "changeStrokeStyle" | "changeArrowhead" | "changeOpacity" | "changeFontSize" | "toggleCanvasMenu" | "toggleEditMenu" | "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" | "viewMode" | "exportWithDarkMode" | "toggleTheme" | "increaseFontSize" | "decreaseFontSize" | "unbindText" | "hyperlink" | "bindText" | "unlockAllElements" | "toggleElementLock" | "toggleLinearEditor" | "toggleEraserTool" | "toggleHandTool" | "selectAllElementsInFrame" | "removeAllElementsFromFrame" | "updateFrameRendering" | "setFrameAsActiveTool" | "setEmbeddableAsActiveTool" | "createContainerFromText" | "wrapTextInContainer" | "commandPalette" | "autoResize" | "elementStats";
 export type PanelComponentProps = {
     elements: readonly ExcalidrawElement[];
     appState: AppState;

package/dist/excalidraw/align.d.ts

@@ -1,4 +1,4 @@
-import { ElementsMap, ExcalidrawElement } from "./element/types";
+import type { ElementsMap, ExcalidrawElement } from "./element/types";
 export interface Alignment {
     position: "start" | "center" | "end";
     axis: "x" | "y";

package/dist/excalidraw/analytics.js

@@ -1,16 +1,18 @@
 // place here categories that you want to track. We want to track just a
 // small subset of categories at a given time.
-const ALLOWED_CATEGORIES_TO_TRACK = ["ai"];
+const ALLOWED_CATEGORIES_TO_TRACK = new Set(["command_palette"]);
 export const trackEvent = (category, action, label, value) => {
     try {
-        // prettier-ignore
-        if (typeof window === "undefined"
-            || import.meta.env.VITE_WORKER_ID
-            // comment out to debug locally
-            || import.meta.env.PROD) {
+        if (typeof window === "undefined" ||
+            import.meta.env.VITE_WORKER_ID ||
+            import.meta.env.VITE_APP_ENABLE_TRACKING !== "true") {
             return;
         }
-        if (!ALLOWED_CATEGORIES_TO_TRACK.includes(category)) {
+        if (!ALLOWED_CATEGORIES_TO_TRACK.has(category)) {
+            return;
+        }
+        if (import.meta.env.DEV) {
+            // comment out to debug in dev
             return;
         }
         if (!import.meta.env.PROD) {

package/dist/excalidraw/animated-trail.d.ts

@@ -1,5 +1,5 @@
-import { LaserPointerOptions } from "@excalidraw/laser-pointer";
-import { AnimationFrameHandler } from "./animation-frame-handler";
+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;

package/dist/excalidraw/appState.d.ts

@@ -1,6 +1,10 @@
-import { AppState, NormalizedZoomValue } from "./types";
+import type { AppState, NormalizedZoomValue } from "./types";
 export declare const getDefaultAppState: () => Omit<AppState, "offsetTop" | "offsetLeft" | "width" | "height">;
 export declare const clearAppStateForLocalStorage: (appState: Partial<AppState>) => {
+    zenModeEnabled?: boolean | undefined;
+    objectsSnapModeEnabled?: boolean | undefined;
+    theme?: import("./element/types").Theme | undefined;
+    name?: string | null | undefined;
     showWelcomeScreen?: boolean | undefined;
     activeTool?: ({
         lastActiveTool: import("./types").ActiveTool | null;
@@ -30,7 +34,6 @@ export declare const clearAppStateForLocalStorage: (appState: Partial<AppState>)
     scrollY?: number | undefined;
     cursorButton?: "up" | "down" | undefined;
     scrolledOutside?: boolean | undefined;
-    name?: string | null | undefined;
     zoom?: Readonly<{
         value: NormalizedZoomValue;
     }> | undefined;
@@ -48,17 +51,17 @@ export declare const clearAppStateForLocalStorage: (appState: Partial<AppState>)
         [id: string]: true;
     } | undefined;
     shouldCacheIgnoreZoom?: boolean | undefined;
-    zenModeEnabled?: boolean | undefined;
-    theme?: import("./element/types").Theme | undefined;
     gridSize?: number | null | undefined;
     selectedGroupIds?: {
         [groupId: string]: boolean;
     } | undefined;
     editingGroupId?: string | null | undefined;
-    showStats?: boolean | undefined;
+    stats?: {
+        open: boolean;
+        panels: number;
+    } | undefined;
     currentChartType?: import("./element/types").ChartType | undefined;
     selectedLinearElement?: import("./element/linearElementEditor").LinearElementEditor | null | undefined;
-    objectsSnapModeEnabled?: boolean | undefined;
 };
 export declare const cleanAppStateForExport: (appState: Partial<AppState>) => {
     viewBackgroundColor?: string | undefined;

package/dist/excalidraw/appState.js

@@ -1,5 +1,5 @@
 import { COLOR_PALETTE } from "./colors";
-import { DEFAULT_ELEMENT_PROPS, DEFAULT_FONT_FAMILY, DEFAULT_FONT_SIZE, DEFAULT_TEXT_ALIGN, EXPORT_SCALES, THEME, } from "./constants";
+import { DEFAULT_ELEMENT_PROPS, DEFAULT_FONT_FAMILY, DEFAULT_FONT_SIZE, DEFAULT_TEXT_ALIGN, EXPORT_SCALES, STATS_PANELS, THEME, } from "./constants";
 const defaultExportScale = EXPORT_SCALES.includes(devicePixelRatio)
     ? devicePixelRatio
     : 1;
@@ -22,6 +22,7 @@ export const getDefaultAppState = () => {
         currentItemStrokeStyle: DEFAULT_ELEMENT_PROPS.strokeStyle,
         currentItemStrokeWidth: DEFAULT_ELEMENT_PROPS.strokeWidth,
         currentItemTextAlign: DEFAULT_TEXT_ALIGN,
+        currentHoveredFontFamily: null,
         cursorButton: "up",
         activeEmbeddable: null,
         draggingElement: null,
@@ -67,7 +68,10 @@ export const getDefaultAppState = () => {
         selectedElementsAreBeingDragged: false,
         selectionElement: null,
         shouldCacheIgnoreZoom: false,
-        showStats: false,
+        stats: {
+            open: false,
+            panels: STATS_PANELS.generalStats | STATS_PANELS.elementProperties,
+        },
         startBoundElement: null,
         suggestedBindings: [],
         frameRendering: { enabled: true, clip: true, name: true, outline: true },
@@ -120,6 +124,7 @@ const APP_STATE_STORAGE_CONF = ((config) => config)({
     currentItemStrokeStyle: { browser: true, export: false, server: false },
     currentItemStrokeWidth: { browser: true, export: false, server: false },
     currentItemTextAlign: { browser: true, export: false, server: false },
+    currentHoveredFontFamily: { browser: false, export: false, server: false },
     cursorButton: { browser: true, export: false, server: false },
     activeEmbeddable: { browser: false, export: false, server: false },
     draggingElement: { browser: false, export: false, server: false },
@@ -171,7 +176,7 @@ const APP_STATE_STORAGE_CONF = ((config) => config)({
     },
     selectionElement: { browser: false, export: false, server: false },
     shouldCacheIgnoreZoom: { browser: true, export: false, server: false },
-    showStats: { browser: true, export: false, server: false },
+    stats: { browser: true, export: false, server: false },
     startBoundElement: { browser: false, export: false, server: false },
     suggestedBindings: { browser: false, export: false, server: false },
     frameRendering: { browser: false, export: false, server: false },

package/dist/excalidraw/change.d.ts

@@ -0,0 +1,191 @@
+import type { ElementUpdate } from "./element/mutateElement";
+import type { OrderedExcalidrawElement, SceneElementsMap } from "./element/types";
+import type { AppState, ObservedAppState } from "./types";
+import type { ValueOf } from "./utility-types";
+/**
+ * Represents the difference between two objects of the same type.
+ *
+ * Both `deleted` and `inserted` partials represent the same set of added, removed or updated properties, where:
+ * - `deleted` is a set of all the deleted values
+ * - `inserted` is a set of all the inserted (added, updated) values
+ *
+ * Keeping it as pure object (without transient state, side-effects, etc.), so we won't have to instantiate it on load.
+ */
+declare class Delta<T> {
+    readonly deleted: Partial<T>;
+    readonly inserted: Partial<T>;
+    private constructor();
+    static create<T>(deleted: Partial<T>, inserted: Partial<T>, modifier?: (delta: Partial<T>) => Partial<T>, modifierOptions?: "deleted" | "inserted"): Delta<T>;
+    /**
+     * Calculates the delta between two objects.
+     *
+     * @param prevObject - The previous state of the object.
+     * @param nextObject - The next state of the object.
+     *
+     * @returns new delta instance.
+     */
+    static calculate<T extends {
+        [key: string]: any;
+    }>(prevObject: T, nextObject: T, modifier?: (partial: Partial<T>) => Partial<T>, postProcess?: (deleted: Partial<T>, inserted: Partial<T>) => [Partial<T>, Partial<T>]): Delta<T>;
+    static empty(): Delta<unknown>;
+    static isEmpty<T>(delta: Delta<T>): boolean;
+    /**
+     * Merges deleted and inserted object partials.
+     */
+    static mergeObjects<T extends {
+        [key: string]: unknown;
+    }>(prev: T, added: T, removed: T): T;
+    /**
+     * Merges deleted and inserted array partials.
+     */
+    static mergeArrays<T>(prev: readonly T[] | null, added: readonly T[] | null | undefined, removed: readonly T[] | null | undefined, predicate?: (value: T) => string): T[];
+    /**
+     * Diff object partials as part of the `postProcess`.
+     */
+    static diffObjects<T, K extends keyof T, V extends ValueOf<T[K]>>(deleted: Partial<T>, inserted: Partial<T>, property: K, setValue: (prevValue: V | undefined) => V): void;
+    /**
+     * Diff array partials as part of the `postProcess`.
+     */
+    static diffArrays<T, K extends keyof T, V extends T[K]>(deleted: Partial<T>, inserted: Partial<T>, property: K, groupBy: (value: V extends ArrayLike<infer T> ? T : never) => string): void;
+    /**
+     * Compares if object1 contains any different value compared to the object2.
+     */
+    static isLeftDifferent<T extends {}>(object1: T, object2: T, skipShallowCompare?: boolean): boolean;
+    /**
+     * Compares if object2 contains any different value compared to the object1.
+     */
+    static isRightDifferent<T extends {}>(object1: T, object2: T, skipShallowCompare?: boolean): boolean;
+    /**
+     * Returns all the object1 keys that have distinct values.
+     */
+    static getLeftDifferences<T extends {}>(object1: T, object2: T, skipShallowCompare?: boolean): string[];
+    /**
+     * Returns all the object2 keys that have distinct values.
+     */
+    static getRightDifferences<T extends {}>(object1: T, object2: T, skipShallowCompare?: boolean): string[];
+    /**
+     * Iterator comparing values of object properties based on the passed joining strategy.
+     *
+     * @yields keys of properties with different values
+     *
+     * WARN: it's based on shallow compare performed only on the first level and doesn't go deeper than that.
+     */
+    private static distinctKeysIterator;
+}
+/**
+ * Encapsulates the modifications captured as `Delta`/s.
+ */
+interface Change<T> {
+    /**
+     * Inverses the `Delta`s inside while creating a new `Change`.
+     */
+    inverse(): Change<T>;
+    /**
+     * Applies the `Change` to the previous object.
+     *
+     * @returns a tuple of the next object `T` with applied change, and `boolean`, indicating whether the applied change resulted in a visible change.
+     */
+    applyTo(previous: T, ...options: unknown[]): [T, boolean];
+    /**
+     * Checks whether there are actually `Delta`s.
+     */
+    isEmpty(): boolean;
+}
+export declare class AppStateChange implements Change<AppState> {
+    private readonly delta;
+    private constructor();
+    static calculate<T extends ObservedAppState>(prevAppState: T, nextAppState: T): AppStateChange;
+    static empty(): AppStateChange;
+    inverse(): AppStateChange;
+    applyTo(appState: AppState, nextElements: SceneElementsMap): [AppState, boolean];
+    isEmpty(): boolean;
+    /**
+     * It is necessary to post process the partials in case of reference values,
+     * for which we need to calculate the real diff between `deleted` and `inserted`.
+     */
+    private static postProcess;
+    /**
+     * Mutates `nextAppState` be filtering out state related to deleted elements.
+     *
+     * @returns `true` if a visible change is found, `false` otherwise.
+     */
+    private filterInvisibleChanges;
+    private static convertToAppStateKey;
+    private static filterSelectedElements;
+    private static filterSelectedGroups;
+    private static stripElementsProps;
+    private static stripStandaloneProps;
+}
+type ElementPartial = Omit<ElementUpdate<OrderedExcalidrawElement>, "seed">;
+/**
+ * Elements change is a low level primitive to capture a change between two sets of elements.
+ * It does so by encapsulating forward and backward `Delta`s, allowing to time-travel in both directions.
+ */
+export declare class ElementsChange implements Change<SceneElementsMap> {
+    private readonly added;
+    private readonly removed;
+    private readonly updated;
+    private constructor();
+    static create(added: Map<string, Delta<ElementPartial>>, removed: Map<string, Delta<ElementPartial>>, updated: Map<string, Delta<ElementPartial>>, options?: {
+        shouldRedistribute: boolean;
+    }): ElementsChange;
+    private static satisfiesAddition;
+    private static satisfiesRemoval;
+    private static satisfiesUpdate;
+    private static validate;
+    /**
+     * Calculates the `Delta`s between the previous and next set of elements.
+     *
+     * @param prevElements - Map representing the previous state of elements.
+     * @param nextElements - Map representing the next state of elements.
+     *
+     * @returns `ElementsChange` instance representing the `Delta` changes between the two sets of elements.
+     */
+    static calculate<T extends OrderedExcalidrawElement>(prevElements: Map<string, T>, nextElements: Map<string, T>): ElementsChange;
+    static empty(): ElementsChange;
+    inverse(): ElementsChange;
+    isEmpty(): boolean;
+    /**
+     * Update delta/s based on the existing elements.
+     *
+     * @param elements current elements
+     * @param modifierOptions defines which of the delta (`deleted` or `inserted`) will be updated
+     * @returns new instance with modified delta/s
+     */
+    applyLatestChanges(elements: SceneElementsMap): ElementsChange;
+    applyTo(elements: SceneElementsMap, snapshot: Map<string, OrderedExcalidrawElement>): [SceneElementsMap, boolean];
+    private static createApplier;
+    private static createGetter;
+    private static applyDelta;
+    /**
+     * Check for visible changes regardless of whether they were removed, added or updated.
+     */
+    private static checkForVisibleDifference;
+    /**
+     * Resolves conflicts for all previously added, removed and updated elements.
+     * Updates the previous deltas with all the changes after conflict resolution.
+     *
+     * @returns all elements affected by the conflict resolution
+     */
+    private resolveConflicts;
+    /**
+     * Non deleted affected elements of removed elements (before and after applying delta),
+     * should be unbound ~ bindings should not point from non deleted into the deleted element/s.
+     */
+    private static unbindAffected;
+    /**
+     * Non deleted affected elements of added or updated element/s (before and after applying delta),
+     * should be rebound (if possible) with the current element ~ bindings should be bidirectional.
+     */
+    private static rebindAffected;
+    private static redrawTextBoundingBoxes;
+    private static redrawBoundArrows;
+    private static reorderElements;
+    /**
+     * It is necessary to post process the partials in case of reference values,
+     * for which we need to calculate the real diff between `deleted` and `inserted`.
+     */
+    private static postProcess;
+    private static stripIrrelevantProps;
+}
+export {};