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

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

@@ -1,6 +1,6 @@
 /// <reference types="react" />
-import { ExcalidrawElement } from "../element/types";
-import { AppClassProperties, AppState } from "../types";
+import type { ExcalidrawElement, OrderedExcalidrawElement } from "../element/types";
+import type { AppClassProperties, AppState } from "../types";
 export declare const actionGroup: {
     name: "group";
     label: string;
@@ -8,10 +8,10 @@ export declare const actionGroup: {
     trackEvent: {
         category: "element";
     };
-    perform: (elements: readonly ExcalidrawElement[], appState: Readonly<AppState>, _: any, app: AppClassProperties) => {
+    perform: (elements: readonly OrderedExcalidrawElement[], appState: Readonly<AppState>, _: any, app: AppClassProperties) => {
         appState: Readonly<AppState>;
-        elements: readonly ExcalidrawElement[];
-        commitToHistory: false;
+        elements: readonly OrderedExcalidrawElement[];
+        storeAction: "none";
     } | {
         appState: {
             selectedElementIds: Readonly<{
@@ -73,6 +73,7 @@ export declare const actionGroup: {
             currentItemTextAlign: string;
             currentItemStartArrowhead: import("../element/types").Arrowhead | null;
             currentItemEndArrowhead: import("../element/types").Arrowhead | null;
+            currentHoveredFontFamily: number | null;
             currentItemRoundness: import("../element/types").StrokeRoundness;
             viewBackgroundColor: string;
             scrollX: number;
@@ -86,7 +87,7 @@ export declare const actionGroup: {
                 value: import("../types").NormalizedZoomValue;
             }>;
             openMenu: "canvas" | "shape" | null;
-            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | null;
+            openPopup: "fontFamily" | "canvasBackground" | "elementBackground" | "elementStroke" | null;
             openSidebar: {
                 name: string;
                 tab?: string | undefined;
@@ -144,7 +145,10 @@ export declare const actionGroup: {
                 isSpeaking?: boolean | undefined;
                 isMuted?: boolean | undefined;
             }>>;
-            showStats: boolean;
+            stats: {
+                open: boolean;
+                panels: number;
+            };
             currentChartType: import("../element/types").ChartType;
             pasteDialog: {
                 shown: false;
@@ -165,14 +169,14 @@ export declare const actionGroup: {
             userToFollow: import("../types").UserToFollow | null;
             followedBy: Set<import("../types").SocketId>;
         };
-        elements: ExcalidrawElement[];
-        commitToHistory: true;
+        elements: OrderedExcalidrawElement[];
+        storeAction: "capture";
     };
     predicate: (elements: readonly ExcalidrawElement[], appState: AppState, _: import("../types").ExcalidrawProps, app: AppClassProperties) => boolean;
-    keyTest: (event: import("react").KeyboardEvent<Element> | KeyboardEvent) => boolean;
+    keyTest: (event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean;
     PanelComponent: ({ elements, appState, updateData, app }: import("./types").PanelComponentProps) => JSX.Element;
 } & {
-    keyTest?: ((event: import("react").KeyboardEvent<Element> | KeyboardEvent) => boolean) | undefined;
+    keyTest?: ((event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean) | undefined;
 };
 export declare const actionUngroup: {
     name: "ungroup";
@@ -181,10 +185,10 @@ export declare const actionUngroup: {
     trackEvent: {
         category: "element";
     };
-    perform: (elements: readonly ExcalidrawElement[], appState: Readonly<AppState>, _: any, app: AppClassProperties) => {
+    perform: (elements: readonly OrderedExcalidrawElement[], appState: Readonly<AppState>, _: any, app: AppClassProperties) => {
         appState: Readonly<AppState>;
-        elements: readonly ExcalidrawElement[];
-        commitToHistory: false;
+        elements: readonly OrderedExcalidrawElement[];
+        storeAction: "none";
     } | {
         appState: {
             selectedElementIds: Readonly<{
@@ -246,6 +250,7 @@ export declare const actionUngroup: {
             currentItemTextAlign: string;
             currentItemStartArrowhead: import("../element/types").Arrowhead | null;
             currentItemEndArrowhead: import("../element/types").Arrowhead | null;
+            currentHoveredFontFamily: number | null;
             currentItemRoundness: import("../element/types").StrokeRoundness;
             viewBackgroundColor: string;
             scrollX: number;
@@ -259,7 +264,7 @@ export declare const actionUngroup: {
                 value: import("../types").NormalizedZoomValue;
             }>;
             openMenu: "canvas" | "shape" | null;
-            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | null;
+            openPopup: "fontFamily" | "canvasBackground" | "elementBackground" | "elementStroke" | null;
             openSidebar: {
                 name: string;
                 tab?: string | undefined;
@@ -317,7 +322,10 @@ export declare const actionUngroup: {
                 isSpeaking?: boolean | undefined;
                 isMuted?: boolean | undefined;
             }>>;
-            showStats: boolean;
+            stats: {
+                open: boolean;
+                panels: number;
+            };
             currentChartType: import("../element/types").ChartType;
             pasteDialog: {
                 shown: false;
@@ -338,12 +346,12 @@ export declare const actionUngroup: {
             userToFollow: import("../types").UserToFollow | null;
             followedBy: Set<import("../types").SocketId>;
         };
-        elements: ExcalidrawElement[];
-        commitToHistory: true;
+        elements: OrderedExcalidrawElement[];
+        storeAction: "capture";
     };
-    keyTest: (event: import("react").KeyboardEvent<Element> | KeyboardEvent) => boolean;
+    keyTest: (event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean;
     predicate: (elements: readonly ExcalidrawElement[], appState: AppState) => boolean;
     PanelComponent: ({ elements, appState, updateData }: import("./types").PanelComponentProps) => JSX.Element;
 } & {
-    keyTest?: ((event: import("react").KeyboardEvent<Element> | KeyboardEvent) => boolean) | undefined;
+    keyTest?: ((event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean) | undefined;
 };

package/dist/excalidraw/actions/actionGroup.js

@@ -12,6 +12,8 @@ import { randomId } from "../random";
 import { ToolButton } from "../components/ToolButton";
 import { isBoundToContainer } from "../element/typeChecks";
 import { getElementsInResizingFrame, getFrameLikeElements, groupByFrameLikes, removeElementsFromFrame, replaceAllElementsInFrame, } from "../frame";
+import { syncMovedIndices } from "../fractionalIndex";
+import { StoreAction } from "../store";
 const allElementsInSameGroup = (elements) => {
     if (elements.length >= 2) {
         const groupIds = elements[0].groupIds;
@@ -42,7 +44,7 @@ export const actionGroup = register({
         });
         if (selectedElements.length < 2) {
             // nothing to group
-            return { appState, elements, commitToHistory: false };
+            return { appState, elements, storeAction: StoreAction.NONE };
         }
         // if everything is already grouped into 1 group, there is nothing to do
         const selectedGroupIds = getSelectedGroupIds(appState);
@@ -56,7 +58,7 @@ export const actionGroup = register({
             ]);
             if (combinedSet.size === elementIdsInGroup.size) {
                 // no incremental ids in the selected ids
-                return { appState, elements, commitToHistory: false };
+                return { appState, elements, storeAction: StoreAction.NONE };
             }
         }
         let nextElements = [...elements];
@@ -90,18 +92,14 @@ export const actionGroup = register({
         const elementsBeforeGroup = nextElements
             .slice(0, lastGroupElementIndex)
             .filter((updatedElement) => !isElementInGroup(updatedElement, newGroupId));
-        nextElements = [
-            ...elementsBeforeGroup,
-            ...elementsInGroup,
-            ...elementsAfterGroup,
-        ];
+        const reorderedElements = syncMovedIndices([...elementsBeforeGroup, ...elementsInGroup, ...elementsAfterGroup], arrayToMap(elementsInGroup));
         return {
             appState: {
                 ...appState,
                 ...selectGroup(newGroupId, { ...appState, selectedGroupIds: {} }, getNonDeletedElements(nextElements)),
             },
-            elements: nextElements,
-            commitToHistory: true,
+            elements: reorderedElements,
+            storeAction: StoreAction.CAPTURE,
         };
     },
     predicate: (elements, appState, _, app) => enableActionGroup(elements, appState, app),
@@ -117,7 +115,7 @@ export const actionUngroup = register({
         const groupIds = getSelectedGroupIds(appState);
         const elementsMap = arrayToMap(elements);
         if (groupIds.length === 0) {
-            return { appState, elements, commitToHistory: false };
+            return { appState, elements, storeAction: StoreAction.NONE };
         }
         let nextElements = [...elements];
         const boundTextElementIds = [];
@@ -154,7 +152,7 @@ export const actionUngroup = register({
         return {
             appState: { ...appState, ...updateAppState },
             elements: nextElements,
-            commitToHistory: true,
+            storeAction: StoreAction.CAPTURE,
         };
     },
     keyTest: (event) => event.shiftKey &&

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

@@ -1,6 +1,7 @@
-import { Action } from "./types";
-import History from "../history";
-type ActionCreator = (history: History) => Action;
+import type { Action } from "./types";
+import type { History } from "../history";
+import type { Store } from "../store";
+type ActionCreator = (history: History, store: Store) => Action;
 export declare const createUndoAction: ActionCreator;
 export declare const createRedoAction: ActionCreator;
 export {};

package/dist/excalidraw/actions/actionHistory.js

@@ -2,62 +2,61 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { UndoIcon, RedoIcon } from "../components/icons";
 import { ToolButton } from "../components/ToolButton";
 import { t } from "../i18n";
+import { HistoryChangedEvent } from "../history";
 import { KEYS } from "../keys";
-import { newElementWith } from "../element/mutateElement";
-import { fixBindingsAfterDeletion } from "../element/binding";
 import { arrayToMap } from "../utils";
 import { isWindows } from "../constants";
-const writeData = (prevElements, appState, updater) => {
-    const commitToHistory = false;
+import { StoreAction } from "../store";
+import { useEmitter } from "../hooks/useEmitter";
+const writeData = (appState, updater) => {
     if (!appState.multiElement &&
         !appState.resizingElement &&
         !appState.editingElement &&
         !appState.draggingElement) {
-        const data = updater();
-        if (data === null) {
-            return { commitToHistory };
+        const result = updater();
+        if (!result) {
+            return { storeAction: StoreAction.NONE };
         }
-        const prevElementMap = arrayToMap(prevElements);
-        const nextElements = data.elements;
-        const nextElementMap = arrayToMap(nextElements);
-        const deletedElements = prevElements.filter((prevElement) => !nextElementMap.has(prevElement.id));
-        const elements = nextElements
-            .map((nextElement) => newElementWith(prevElementMap.get(nextElement.id) || nextElement, nextElement))
-            .concat(deletedElements.map((prevElement) => newElementWith(prevElement, { isDeleted: true })));
-        fixBindingsAfterDeletion(elements, deletedElements);
+        const [nextElementsMap, nextAppState] = result;
+        const nextElements = Array.from(nextElementsMap.values());
         return {
-            elements,
-            appState: { ...appState, ...data.appState },
-            commitToHistory,
-            syncHistory: true,
+            appState: nextAppState,
+            elements: nextElements,
+            storeAction: StoreAction.UPDATE,
         };
     }
-    return { commitToHistory };
+    return { storeAction: StoreAction.NONE };
 };
-export const createUndoAction = (history) => ({
+export const createUndoAction = (history, store) => ({
     name: "undo",
     label: "buttons.undo",
     icon: UndoIcon,
     trackEvent: { category: "history" },
     viewMode: false,
-    perform: (elements, appState) => writeData(elements, appState, () => history.undoOnce()),
+    perform: (elements, appState) => writeData(appState, () => history.undo(arrayToMap(elements), // TODO: #7348 refactor action manager to already include `SceneElementsMap`
+    appState, store.snapshot)),
     keyTest: (event) => event[KEYS.CTRL_OR_CMD] &&
         event.key.toLowerCase() === KEYS.Z &&
         !event.shiftKey,
-    PanelComponent: ({ updateData, data }) => (_jsx(ToolButton, { type: "button", icon: UndoIcon, "aria-label": t("buttons.undo"), onClick: updateData, size: data?.size || "medium" })),
-    commitToHistory: () => false,
+    PanelComponent: ({ updateData, data }) => {
+        const { isUndoStackEmpty } = useEmitter(history.onHistoryChangedEmitter, new HistoryChangedEvent(history.isUndoStackEmpty, history.isRedoStackEmpty));
+        return (_jsx(ToolButton, { type: "button", icon: UndoIcon, "aria-label": t("buttons.undo"), onClick: updateData, size: data?.size || "medium", disabled: isUndoStackEmpty, "data-testid": "button-undo" }));
+    },
 });
-export const createRedoAction = (history) => ({
+export const createRedoAction = (history, store) => ({
     name: "redo",
     label: "buttons.redo",
     icon: RedoIcon,
     trackEvent: { category: "history" },
     viewMode: false,
-    perform: (elements, appState) => writeData(elements, appState, () => history.redoOnce()),
+    perform: (elements, appState) => writeData(appState, () => history.redo(arrayToMap(elements), // TODO: #7348 refactor action manager to already include `SceneElementsMap`
+    appState, store.snapshot)),
     keyTest: (event) => (event[KEYS.CTRL_OR_CMD] &&
         event.shiftKey &&
         event.key.toLowerCase() === KEYS.Z) ||
         (isWindows && event.ctrlKey && !event.shiftKey && event.key === KEYS.Y),
-    PanelComponent: ({ updateData, data }) => (_jsx(ToolButton, { type: "button", icon: RedoIcon, "aria-label": t("buttons.redo"), onClick: updateData, size: data?.size || "medium" })),
-    commitToHistory: () => false,
+    PanelComponent: ({ updateData, data }) => {
+        const { isRedoStackEmpty } = useEmitter(history.onHistoryChangedEmitter, new HistoryChangedEvent(history.isUndoStackEmpty, history.isRedoStackEmpty));
+        return (_jsx(ToolButton, { type: "button", icon: RedoIcon, "aria-label": t("buttons.redo"), onClick: updateData, size: data?.size || "medium", disabled: isRedoStackEmpty, "data-testid": "button-redo" }));
+    },
 });

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

@@ -1,15 +1,16 @@
 /// <reference types="react" />
 import { LinearElementEditor } from "../element/linearElementEditor";
-import { ExcalidrawLinearElement } from "../element/types";
+import type { ExcalidrawLinearElement } from "../element/types";
 export declare const actionToggleLinearEditor: {
     name: "toggleLinearEditor";
     category: string;
-    label: (elements: readonly import("../element/types").ExcalidrawElement[], appState: Readonly<import("../types").AppState>, app: import("../types").AppClassProperties) => "labels.lineEditor.exit" | "labels.lineEditor.edit";
+    label: (elements: readonly import("../element/types").ExcalidrawElement[], appState: Readonly<import("../types").AppState>, app: import("../types").AppClassProperties) => "labels.lineEditor.editArrow" | "labels.lineEditor.edit";
+    keywords: string[];
     trackEvent: {
         category: "element";
     };
     predicate: (elements: readonly import("../element/types").ExcalidrawElement[], appState: import("../types").AppState, _: import("../types").ExcalidrawProps, app: import("../types").AppClassProperties) => boolean;
-    perform(elements: readonly import("../element/types").ExcalidrawElement[], appState: Readonly<import("../types").AppState>, _: any, app: import("../types").AppClassProperties): {
+    perform(elements: readonly import("../element/types").OrderedExcalidrawElement[], appState: Readonly<import("../types").AppState>, _: any, app: import("../types").AppClassProperties): {
         appState: {
             editingLinearElement: LinearElementEditor | null;
             contextMenu: {
@@ -63,6 +64,7 @@ export declare const actionToggleLinearEditor: {
             currentItemTextAlign: string;
             currentItemStartArrowhead: import("../element/types").Arrowhead | null;
             currentItemEndArrowhead: import("../element/types").Arrowhead | null;
+            currentHoveredFontFamily: number | null;
             currentItemRoundness: import("../element/types").StrokeRoundness;
             viewBackgroundColor: string;
             scrollX: number;
@@ -76,7 +78,7 @@ export declare const actionToggleLinearEditor: {
                 value: import("../types").NormalizedZoomValue;
             }>;
             openMenu: "canvas" | "shape" | null;
-            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | null;
+            openPopup: "fontFamily" | "canvasBackground" | "elementBackground" | "elementStroke" | null;
             openSidebar: {
                 name: string;
                 tab?: string | undefined;
@@ -141,7 +143,10 @@ export declare const actionToggleLinearEditor: {
                 isSpeaking?: boolean | undefined;
                 isMuted?: boolean | undefined;
             }>>;
-            showStats: boolean;
+            stats: {
+                open: boolean;
+                panels: number;
+            };
             currentChartType: import("../element/types").ChartType;
             pasteDialog: {
                 shown: false;
@@ -162,8 +167,9 @@ export declare const actionToggleLinearEditor: {
             userToFollow: import("../types").UserToFollow | null;
             followedBy: Set<import("../types").SocketId>;
         };
-        commitToHistory: false;
+        storeAction: "capture";
     };
+    PanelComponent: ({ appState, updateData, app }: import("./types").PanelComponentProps) => JSX.Element;
 } & {
     keyTest?: undefined;
 };

package/dist/excalidraw/actions/actionLinearEditor.js

@@ -1,25 +1,32 @@
+import { jsx as _jsx } from "react/jsx-runtime";
 import { DEFAULT_CATEGORIES } from "../components/CommandPalette/CommandPalette";
 import { LinearElementEditor } from "../element/linearElementEditor";
 import { isLinearElement } from "../element/typeChecks";
+import { StoreAction } from "../store";
 import { register } from "./register";
+import { ToolButton } from "../components/ToolButton";
+import { t } from "../i18n";
+import { lineEditorIcon } from "../components/icons";
 export const actionToggleLinearEditor = register({
     name: "toggleLinearEditor",
     category: DEFAULT_CATEGORIES.elements,
     label: (elements, appState, app) => {
         const selectedElement = app.scene.getSelectedElements({
             selectedElementIds: appState.selectedElementIds,
-            includeBoundTextElement: true,
         })[0];
-        return appState.editingLinearElement?.elementId === selectedElement?.id
-            ? "labels.lineEditor.exit"
+        return selectedElement?.type === "arrow"
+            ? "labels.lineEditor.editArrow"
             : "labels.lineEditor.edit";
     },
+    keywords: ["line"],
     trackEvent: {
         category: "element",
     },
     predicate: (elements, appState, _, app) => {
         const selectedElements = app.scene.getSelectedElements(appState);
-        if (selectedElements.length === 1 && isLinearElement(selectedElements[0])) {
+        if (!appState.editingLinearElement &&
+            selectedElements.length === 1 &&
+            isLinearElement(selectedElements[0])) {
             return true;
         }
         return false;
@@ -37,7 +44,16 @@ export const actionToggleLinearEditor = register({
                 ...appState,
                 editingLinearElement,
             },
-            commitToHistory: false,
+            storeAction: StoreAction.CAPTURE,
         };
     },
+    PanelComponent: ({ appState, updateData, app }) => {
+        const selectedElement = app.scene.getSelectedElements({
+            selectedElementIds: appState.selectedElementIds,
+        })[0];
+        const label = t(selectedElement.type === "arrow"
+            ? "labels.lineEditor.editArrow"
+            : "labels.lineEditor.edit");
+        return (_jsx(ToolButton, { type: "button", icon: lineEditorIcon, title: label, "aria-label": label, onClick: () => updateData(null) }));
+    },
 });

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

@@ -3,8 +3,8 @@ export declare const actionLink: {
     name: "hyperlink";
     label: (elements: readonly import("../element/types").ExcalidrawElement[], appState: Readonly<import("../types").AppState>) => "labels.link.editEmbed" | "labels.link.edit" | "labels.link.createEmbed" | "labels.link.create";
     icon: JSX.Element;
-    perform: (elements: readonly import("../element/types").ExcalidrawElement[], appState: Readonly<import("../types").AppState>) => false | {
-        elements: readonly import("../element/types").ExcalidrawElement[];
+    perform: (elements: readonly import("../element/types").OrderedExcalidrawElement[], appState: Readonly<import("../types").AppState>) => false | {
+        elements: readonly import("../element/types").OrderedExcalidrawElement[];
         appState: {
             showHyperlinkPopup: "editor";
             openMenu: null;
@@ -60,6 +60,7 @@ export declare const actionLink: {
             currentItemTextAlign: string;
             currentItemStartArrowhead: import("../element/types").Arrowhead | null;
             currentItemEndArrowhead: import("../element/types").Arrowhead | null;
+            currentHoveredFontFamily: number | null;
             currentItemRoundness: import("../element/types").StrokeRoundness;
             viewBackgroundColor: string;
             scrollX: number;
@@ -72,7 +73,7 @@ export declare const actionLink: {
             zoom: Readonly<{
                 value: import("../types").NormalizedZoomValue;
             }>;
-            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | null;
+            openPopup: "fontFamily" | "canvasBackground" | "elementBackground" | "elementStroke" | null;
             openSidebar: {
                 name: string;
                 tab?: string | undefined;
@@ -137,7 +138,10 @@ export declare const actionLink: {
                 isSpeaking?: boolean | undefined;
                 isMuted?: boolean | undefined;
             }>>;
-            showStats: boolean;
+            stats: {
+                open: boolean;
+                panels: number;
+            };
             currentChartType: import("../element/types").ChartType;
             pasteDialog: {
                 shown: false;
@@ -157,15 +161,15 @@ export declare const actionLink: {
             userToFollow: import("../types").UserToFollow | null;
             followedBy: Set<import("../types").SocketId>;
         };
-        commitToHistory: true;
+        storeAction: "capture";
     };
     trackEvent: {
         category: "hyperlink";
         action: string;
     };
-    keyTest: (event: import("react").KeyboardEvent<Element> | KeyboardEvent) => boolean;
+    keyTest: (event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean;
     predicate: (elements: readonly import("../element/types").ExcalidrawElement[], appState: import("../types").AppState) => boolean;
     PanelComponent: ({ elements, appState, updateData }: import("./types").PanelComponentProps) => JSX.Element;
 } & {
-    keyTest?: ((event: import("react").KeyboardEvent<Element> | KeyboardEvent) => boolean) | undefined;
+    keyTest?: ((event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean) | undefined;
 };

package/dist/excalidraw/actions/actionLink.js

@@ -6,6 +6,7 @@ import { isEmbeddableElement } from "../element/typeChecks";
 import { t } from "../i18n";
 import { KEYS } from "../keys";
 import { getSelectedElements } from "../scene";
+import { StoreAction } from "../store";
 import { getShortcutKey } from "../utils";
 import { register } from "./register";
 export const actionLink = register({
@@ -23,7 +24,7 @@ export const actionLink = register({
                 showHyperlinkPopup: "editor",
                 openMenu: null,
             },
-            commitToHistory: true,
+            storeAction: StoreAction.CAPTURE,
         };
     },
     trackEvent: { category: "hyperlink", action: "click" },

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

@@ -5,7 +5,7 @@ export declare const actionToggleCanvasMenu: {
     trackEvent: {
         category: "menu";
     };
-    perform: (_: readonly import("../element/types").ExcalidrawElement[], appState: Readonly<import("../types").AppState>) => {
+    perform: (_: readonly import("../element/types").OrderedExcalidrawElement[], appState: Readonly<import("../types").AppState>) => {
         appState: {
             openMenu: "canvas" | null;
             contextMenu: {
@@ -60,6 +60,7 @@ export declare const actionToggleCanvasMenu: {
             currentItemTextAlign: string;
             currentItemStartArrowhead: import("../element/types").Arrowhead | null;
             currentItemEndArrowhead: import("../element/types").Arrowhead | null;
+            currentHoveredFontFamily: number | null;
             currentItemRoundness: import("../element/types").StrokeRoundness;
             viewBackgroundColor: string;
             scrollX: number;
@@ -72,7 +73,7 @@ export declare const actionToggleCanvasMenu: {
             zoom: Readonly<{
                 value: import("../types").NormalizedZoomValue;
             }>;
-            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | null;
+            openPopup: "fontFamily" | "canvasBackground" | "elementBackground" | "elementStroke" | null;
             openSidebar: {
                 name: string;
                 tab?: string | undefined;
@@ -137,7 +138,10 @@ export declare const actionToggleCanvasMenu: {
                 isSpeaking?: boolean | undefined;
                 isMuted?: boolean | undefined;
             }>>;
-            showStats: boolean;
+            stats: {
+                open: boolean;
+                panels: number;
+            };
             currentChartType: import("../element/types").ChartType;
             pasteDialog: {
                 shown: false;
@@ -158,7 +162,7 @@ export declare const actionToggleCanvasMenu: {
             userToFollow: import("../types").UserToFollow | null;
             followedBy: Set<import("../types").SocketId>;
         };
-        commitToHistory: false;
+        storeAction: "none";
     };
     PanelComponent: ({ appState, updateData }: import("./types").PanelComponentProps) => JSX.Element;
 } & {
@@ -170,7 +174,7 @@ export declare const actionToggleEditMenu: {
     trackEvent: {
         category: "menu";
     };
-    perform: (_elements: readonly import("../element/types").ExcalidrawElement[], appState: Readonly<import("../types").AppState>) => {
+    perform: (_elements: readonly import("../element/types").OrderedExcalidrawElement[], appState: Readonly<import("../types").AppState>) => {
         appState: {
             openMenu: "shape" | null;
             contextMenu: {
@@ -225,6 +229,7 @@ export declare const actionToggleEditMenu: {
             currentItemTextAlign: string;
             currentItemStartArrowhead: import("../element/types").Arrowhead | null;
             currentItemEndArrowhead: import("../element/types").Arrowhead | null;
+            currentHoveredFontFamily: number | null;
             currentItemRoundness: import("../element/types").StrokeRoundness;
             viewBackgroundColor: string;
             scrollX: number;
@@ -237,7 +242,7 @@ export declare const actionToggleEditMenu: {
             zoom: Readonly<{
                 value: import("../types").NormalizedZoomValue;
             }>;
-            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | null;
+            openPopup: "fontFamily" | "canvasBackground" | "elementBackground" | "elementStroke" | null;
             openSidebar: {
                 name: string;
                 tab?: string | undefined;
@@ -302,7 +307,10 @@ export declare const actionToggleEditMenu: {
                 isSpeaking?: boolean | undefined;
                 isMuted?: boolean | undefined;
             }>>;
-            showStats: boolean;
+            stats: {
+                open: boolean;
+                panels: number;
+            };
             currentChartType: import("../element/types").ChartType;
             pasteDialog: {
                 shown: false;
@@ -323,7 +331,7 @@ export declare const actionToggleEditMenu: {
             userToFollow: import("../types").UserToFollow | null;
             followedBy: Set<import("../types").SocketId>;
         };
-        commitToHistory: false;
+        storeAction: "none";
     };
     PanelComponent: ({ elements, appState, updateData }: import("./types").PanelComponentProps) => JSX.Element;
 } & {
@@ -338,7 +346,7 @@ export declare const actionShortcuts: {
         category: "menu";
         action: string;
     };
-    perform: (_elements: readonly import("../element/types").ExcalidrawElement[], appState: Readonly<import("../types").AppState>, _: any, { focusContainer }: import("../types").AppClassProperties) => {
+    perform: (_elements: readonly import("../element/types").OrderedExcalidrawElement[], appState: Readonly<import("../types").AppState>, _: any, { focusContainer }: import("../types").AppClassProperties) => {
         appState: {
             openDialog: {
                 name: "help";
@@ -395,6 +403,7 @@ export declare const actionShortcuts: {
             currentItemTextAlign: string;
             currentItemStartArrowhead: import("../element/types").Arrowhead | null;
             currentItemEndArrowhead: import("../element/types").Arrowhead | null;
+            currentHoveredFontFamily: number | null;
             currentItemRoundness: import("../element/types").StrokeRoundness;
             viewBackgroundColor: string;
             scrollX: number;
@@ -408,7 +417,7 @@ export declare const actionShortcuts: {
                 value: import("../types").NormalizedZoomValue;
             }>;
             openMenu: "canvas" | "shape" | null;
-            openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | null;
+            openPopup: "fontFamily" | "canvasBackground" | "elementBackground" | "elementStroke" | null;
             openSidebar: {
                 name: string;
                 tab?: string | undefined;
@@ -461,7 +470,10 @@ export declare const actionShortcuts: {
                 isSpeaking?: boolean | undefined;
                 isMuted?: boolean | undefined;
             }>>;
-            showStats: boolean;
+            stats: {
+                open: boolean;
+                panels: number;
+            };
             currentChartType: import("../element/types").ChartType;
             pasteDialog: {
                 shown: false;
@@ -482,9 +494,9 @@ export declare const actionShortcuts: {
             userToFollow: import("../types").UserToFollow | null;
             followedBy: Set<import("../types").SocketId>;
         };
-        commitToHistory: false;
+        storeAction: "none";
     };
-    keyTest: (event: import("react").KeyboardEvent<Element> | KeyboardEvent) => boolean;
+    keyTest: (event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean;
 } & {
-    keyTest?: ((event: import("react").KeyboardEvent<Element> | KeyboardEvent) => boolean) | undefined;
+    keyTest?: ((event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean) | undefined;
 };