@excalidraw/excalidraw 0.17.1-7441-0269e5a → 0.17.1-7441-4c9a6f4

package/dist/packages/excalidraw/actions/actionFinalize.js

@@ -0,0 +1,150 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { KEYS } from "../keys";
+import { isInvisiblySmallElement } from "../element";
+import { updateActiveTool } from "../utils";
+import { ToolButton } from "../components/ToolButton";
+import { done } from "../components/icons";
+import { t } from "../i18n";
+import { register } from "./register";
+import { mutateElement } from "../element/mutateElement";
+import { isPathALoop } from "../math";
+import { LinearElementEditor } from "../element/linearElementEditor";
+import Scene from "../scene/Scene";
+import { maybeBindLinearElement, bindOrUnbindLinearElement, } from "../element/binding";
+import { isBindingElement, isLinearElement } from "../element/typeChecks";
+import { resetCursor } from "../cursor";
+export const actionFinalize = register({
+    name: "finalize",
+    trackEvent: false,
+    perform: (elements, appState, _, { interactiveCanvas, focusContainer, scene }) => {
+        if (appState.editingLinearElement) {
+            const { elementId, startBindingElement, endBindingElement } = appState.editingLinearElement;
+            const element = LinearElementEditor.getElement(elementId);
+            if (element) {
+                if (isBindingElement(element)) {
+                    bindOrUnbindLinearElement(element, startBindingElement, endBindingElement);
+                }
+                return {
+                    elements: element.points.length < 2 || isInvisiblySmallElement(element)
+                        ? elements.filter((el) => el.id !== element.id)
+                        : undefined,
+                    appState: {
+                        ...appState,
+                        cursorButton: "up",
+                        editingLinearElement: null,
+                    },
+                    commitToHistory: true,
+                };
+            }
+        }
+        let newElements = elements;
+        const pendingImageElement = appState.pendingImageElementId &&
+            scene.getElement(appState.pendingImageElementId);
+        if (pendingImageElement) {
+            mutateElement(pendingImageElement, { isDeleted: true }, false);
+        }
+        if (window.document.activeElement instanceof HTMLElement) {
+            focusContainer();
+        }
+        const multiPointElement = appState.multiElement
+            ? appState.multiElement
+            : appState.editingElement?.type === "freedraw"
+                ? appState.editingElement
+                : null;
+        if (multiPointElement) {
+            // pen and mouse have hover
+            if (multiPointElement.type !== "freedraw" &&
+                appState.lastPointerDownWith !== "touch") {
+                const { points, lastCommittedPoint } = multiPointElement;
+                if (!lastCommittedPoint ||
+                    points[points.length - 1] !== lastCommittedPoint) {
+                    mutateElement(multiPointElement, {
+                        points: multiPointElement.points.slice(0, -1),
+                    });
+                }
+            }
+            if (isInvisiblySmallElement(multiPointElement)) {
+                newElements = newElements.filter((el) => el.id !== multiPointElement.id);
+            }
+            // If the multi point line closes the loop,
+            // set the last point to first point.
+            // This ensures that loop remains closed at different scales.
+            const isLoop = isPathALoop(multiPointElement.points, appState.zoom.value);
+            if (multiPointElement.type === "line" ||
+                multiPointElement.type === "freedraw") {
+                if (isLoop) {
+                    const linePoints = multiPointElement.points;
+                    const firstPoint = linePoints[0];
+                    mutateElement(multiPointElement, {
+                        points: linePoints.map((point, index) => index === linePoints.length - 1
+                            ? [firstPoint[0], firstPoint[1]]
+                            : point),
+                    });
+                }
+            }
+            if (isBindingElement(multiPointElement) &&
+                !isLoop &&
+                multiPointElement.points.length > 1) {
+                const [x, y] = LinearElementEditor.getPointAtIndexGlobalCoordinates(multiPointElement, -1);
+                maybeBindLinearElement(multiPointElement, appState, Scene.getScene(multiPointElement), { x, y });
+            }
+        }
+        if ((!appState.activeTool.locked &&
+            appState.activeTool.type !== "freedraw") ||
+            !multiPointElement) {
+            resetCursor(interactiveCanvas);
+        }
+        let activeTool;
+        if (appState.activeTool.type === "eraser") {
+            activeTool = updateActiveTool(appState, {
+                ...(appState.activeTool.lastActiveTool || {
+                    type: "selection",
+                }),
+                lastActiveToolBeforeEraser: null,
+            });
+        }
+        else {
+            activeTool = updateActiveTool(appState, {
+                type: "selection",
+            });
+        }
+        return {
+            elements: newElements,
+            appState: {
+                ...appState,
+                cursorButton: "up",
+                activeTool: (appState.activeTool.locked ||
+                    appState.activeTool.type === "freedraw") &&
+                    multiPointElement
+                    ? appState.activeTool
+                    : activeTool,
+                activeEmbeddable: null,
+                draggingElement: null,
+                multiElement: null,
+                editingElement: null,
+                startBoundElement: null,
+                suggestedBindings: [],
+                selectedElementIds: multiPointElement &&
+                    !appState.activeTool.locked &&
+                    appState.activeTool.type !== "freedraw"
+                    ? {
+                        ...appState.selectedElementIds,
+                        [multiPointElement.id]: true,
+                    }
+                    : appState.selectedElementIds,
+                // To select the linear element when user has finished mutipoint editing
+                selectedLinearElement: multiPointElement && isLinearElement(multiPointElement)
+                    ? new LinearElementEditor(multiPointElement, scene)
+                    : appState.selectedLinearElement,
+                pendingImageElementId: null,
+            },
+            commitToHistory: appState.activeTool.type === "freedraw",
+        };
+    },
+    keyTest: (event, appState) => (event.key === KEYS.ESCAPE &&
+        (appState.editingLinearElement !== null ||
+            (!appState.draggingElement && appState.multiElement === null))) ||
+        ((event.key === KEYS.ESCAPE || event.key === KEYS.ENTER) &&
+            appState.multiElement !== null),
+    PanelComponent: ({ appState, updateData, data }) => (_jsx(ToolButton, { type: "button", icon: done, title: t("buttons.done"), "aria-label": t("buttons.done"), onClick: updateData, visible: appState.multiElement != null, size: data?.size || "medium" })),
+});

package/dist/packages/excalidraw/actions/actionFlip.js

@@ -0,0 +1,52 @@
+import { register } from "./register";
+import { getSelectedElements } from "../scene";
+import { getNonDeletedElements } from "../element";
+import { resizeMultipleElements } from "../element/resizeElements";
+import { arrayToMap } from "../utils";
+import { CODES, KEYS } from "../keys";
+import { getCommonBoundingBox } from "../element/bounds";
+import { bindOrUnbindSelectedElements, isBindingEnabled, unbindLinearElements, } from "../element/binding";
+import { updateFrameMembershipOfSelectedElements } from "../frame";
+export const actionFlipHorizontal = register({
+    name: "flipHorizontal",
+    trackEvent: { category: "element" },
+    perform: (elements, appState, _, app) => {
+        return {
+            elements: updateFrameMembershipOfSelectedElements(flipSelectedElements(elements, appState, "horizontal"), appState, app),
+            appState,
+            commitToHistory: true,
+        };
+    },
+    keyTest: (event) => event.shiftKey && event.code === CODES.H,
+    contextItemLabel: "labels.flipHorizontal",
+});
+export const actionFlipVertical = register({
+    name: "flipVertical",
+    trackEvent: { category: "element" },
+    perform: (elements, appState, _, app) => {
+        return {
+            elements: updateFrameMembershipOfSelectedElements(flipSelectedElements(elements, appState, "vertical"), appState, app),
+            appState,
+            commitToHistory: true,
+        };
+    },
+    keyTest: (event) => event.shiftKey && event.code === CODES.V && !event[KEYS.CTRL_OR_CMD],
+    contextItemLabel: "labels.flipVertical",
+});
+const flipSelectedElements = (elements, appState, flipDirection) => {
+    const selectedElements = getSelectedElements(getNonDeletedElements(elements), appState, {
+        includeBoundTextElement: true,
+        includeElementsInFrames: true,
+    });
+    const updatedElements = flipElements(selectedElements, appState, flipDirection);
+    const updatedElementsMap = arrayToMap(updatedElements);
+    return elements.map((element) => updatedElementsMap.get(element.id) || element);
+};
+const flipElements = (elements, appState, flipDirection) => {
+    const { minX, minY, maxX, maxY } = getCommonBoundingBox(elements);
+    resizeMultipleElements({ originalElements: arrayToMap(elements) }, elements, "nw", true, flipDirection === "horizontal" ? maxX : minX, flipDirection === "horizontal" ? minY : maxY);
+    (isBindingEnabled(appState)
+        ? bindOrUnbindSelectedElements
+        : unbindLinearElements)(elements);
+    return elements;
+};

package/dist/packages/excalidraw/actions/actionFrame.js

@@ -0,0 +1,113 @@
+import { getNonDeletedElements } from "../element";
+import { removeAllElementsFromFrame } from "../frame";
+import { getFrameChildren } from "../frame";
+import { KEYS } from "../keys";
+import { updateActiveTool } from "../utils";
+import { setCursorForShape } from "../cursor";
+import { register } from "./register";
+import { isFrameLikeElement } from "../element/typeChecks";
+const isSingleFrameSelected = (appState, app) => {
+    const selectedElements = app.scene.getSelectedElements(appState);
+    return (selectedElements.length === 1 && isFrameLikeElement(selectedElements[0]));
+};
+export const actionSelectAllElementsInFrame = register({
+    name: "selectAllElementsInFrame",
+    trackEvent: { category: "canvas" },
+    perform: (elements, appState, _, app) => {
+        const selectedElement = app.scene.getSelectedElements(appState).at(0) || null;
+        if (isFrameLikeElement(selectedElement)) {
+            const elementsInFrame = getFrameChildren(getNonDeletedElements(elements), selectedElement.id).filter((element) => !(element.type === "text" && element.containerId));
+            return {
+                elements,
+                appState: {
+                    ...appState,
+                    selectedElementIds: elementsInFrame.reduce((acc, element) => {
+                        acc[element.id] = true;
+                        return acc;
+                    }, {}),
+                },
+                commitToHistory: false,
+            };
+        }
+        return {
+            elements,
+            appState,
+            commitToHistory: false,
+        };
+    },
+    contextItemLabel: "labels.selectAllElementsInFrame",
+    predicate: (elements, appState, _, app) => isSingleFrameSelected(appState, app),
+});
+export const actionRemoveAllElementsFromFrame = register({
+    name: "removeAllElementsFromFrame",
+    trackEvent: { category: "history" },
+    perform: (elements, appState, _, app) => {
+        const selectedElement = app.scene.getSelectedElements(appState).at(0) || null;
+        if (isFrameLikeElement(selectedElement)) {
+            return {
+                elements: removeAllElementsFromFrame(elements, selectedElement, appState),
+                appState: {
+                    ...appState,
+                    selectedElementIds: {
+                        [selectedElement.id]: true,
+                    },
+                },
+                commitToHistory: true,
+            };
+        }
+        return {
+            elements,
+            appState,
+            commitToHistory: false,
+        };
+    },
+    contextItemLabel: "labels.removeAllElementsFromFrame",
+    predicate: (elements, appState, _, app) => isSingleFrameSelected(appState, app),
+});
+export const actionupdateFrameRendering = register({
+    name: "updateFrameRendering",
+    viewMode: true,
+    trackEvent: { category: "canvas" },
+    perform: (elements, appState) => {
+        return {
+            elements,
+            appState: {
+                ...appState,
+                frameRendering: {
+                    ...appState.frameRendering,
+                    enabled: !appState.frameRendering.enabled,
+                },
+            },
+            commitToHistory: false,
+        };
+    },
+    contextItemLabel: "labels.updateFrameRendering",
+    checked: (appState) => appState.frameRendering.enabled,
+});
+export const actionSetFrameAsActiveTool = register({
+    name: "setFrameAsActiveTool",
+    trackEvent: { category: "toolbar" },
+    perform: (elements, appState, _, app) => {
+        const nextActiveTool = updateActiveTool(appState, {
+            type: "frame",
+        });
+        setCursorForShape(app.interactiveCanvas, {
+            ...appState,
+            activeTool: nextActiveTool,
+        });
+        return {
+            elements,
+            appState: {
+                ...appState,
+                activeTool: updateActiveTool(appState, {
+                    type: "frame",
+                }),
+            },
+            commitToHistory: false,
+        };
+    },
+    keyTest: (event) => !event[KEYS.CTRL_OR_CMD] &&
+        !event.shiftKey &&
+        !event.altKey &&
+        event.key.toLocaleLowerCase() === KEYS.F,
+});

package/dist/packages/excalidraw/actions/actionGroup.js

@@ -0,0 +1,162 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { KEYS } from "../keys";
+import { t } from "../i18n";
+import { arrayToMap, getShortcutKey } from "../utils";
+import { register } from "./register";
+import { UngroupIcon, GroupIcon } from "../components/icons";
+import { newElementWith } from "../element/mutateElement";
+import { isSomeElementSelected } from "../scene";
+import { getSelectedGroupIds, selectGroup, selectGroupsForSelectedElements, getElementsInGroup, addToGroup, removeFromSelectedGroups, isElementInGroup, } from "../groups";
+import { getNonDeletedElements } from "../element";
+import { randomId } from "../random";
+import { ToolButton } from "../components/ToolButton";
+import { isBoundToContainer } from "../element/typeChecks";
+import { getElementsInResizingFrame, getFrameLikeElements, groupByFrameLikes, removeElementsFromFrame, replaceAllElementsInFrame, } from "../frame";
+const allElementsInSameGroup = (elements) => {
+    if (elements.length >= 2) {
+        const groupIds = elements[0].groupIds;
+        for (const groupId of groupIds) {
+            if (elements.reduce((acc, element) => acc && isElementInGroup(element, groupId), true)) {
+                return true;
+            }
+        }
+    }
+    return false;
+};
+const enableActionGroup = (elements, appState, app) => {
+    const selectedElements = app.scene.getSelectedElements({
+        selectedElementIds: appState.selectedElementIds,
+        includeBoundTextElement: true,
+    });
+    return (selectedElements.length >= 2 && !allElementsInSameGroup(selectedElements));
+};
+export const actionGroup = register({
+    name: "group",
+    trackEvent: { category: "element" },
+    perform: (elements, appState, _, app) => {
+        const selectedElements = app.scene.getSelectedElements({
+            selectedElementIds: appState.selectedElementIds,
+            includeBoundTextElement: true,
+        });
+        if (selectedElements.length < 2) {
+            // nothing to group
+            return { appState, elements, commitToHistory: false };
+        }
+        // if everything is already grouped into 1 group, there is nothing to do
+        const selectedGroupIds = getSelectedGroupIds(appState);
+        if (selectedGroupIds.length === 1) {
+            const selectedGroupId = selectedGroupIds[0];
+            const elementIdsInGroup = new Set(getElementsInGroup(elements, selectedGroupId).map((element) => element.id));
+            const selectedElementIds = new Set(selectedElements.map((element) => element.id));
+            const combinedSet = new Set([
+                ...Array.from(elementIdsInGroup),
+                ...Array.from(selectedElementIds),
+            ]);
+            if (combinedSet.size === elementIdsInGroup.size) {
+                // no incremental ids in the selected ids
+                return { appState, elements, commitToHistory: false };
+            }
+        }
+        let nextElements = [...elements];
+        // this includes the case where we are grouping elements inside a frame
+        // and elements outside that frame
+        const groupingElementsFromDifferentFrames = new Set(selectedElements.map((element) => element.frameId)).size > 1;
+        // when it happens, we want to remove elements that are in the frame
+        // and are going to be grouped from the frame (mouthful, I know)
+        if (groupingElementsFromDifferentFrames) {
+            const frameElementsMap = groupByFrameLikes(selectedElements);
+            frameElementsMap.forEach((elementsInFrame, frameId) => {
+                nextElements = removeElementsFromFrame(nextElements, elementsInFrame, appState);
+            });
+        }
+        const newGroupId = randomId();
+        const selectElementIds = arrayToMap(selectedElements);
+        nextElements = nextElements.map((element) => {
+            if (!selectElementIds.get(element.id)) {
+                return element;
+            }
+            return newElementWith(element, {
+                groupIds: addToGroup(element.groupIds, newGroupId, appState.editingGroupId),
+            });
+        });
+        // keep the z order within the group the same, but move them
+        // to the z order of the highest element in the layer stack
+        const elementsInGroup = getElementsInGroup(nextElements, newGroupId);
+        const lastElementInGroup = elementsInGroup[elementsInGroup.length - 1];
+        const lastGroupElementIndex = nextElements.lastIndexOf(lastElementInGroup);
+        const elementsAfterGroup = nextElements.slice(lastGroupElementIndex + 1);
+        const elementsBeforeGroup = nextElements
+            .slice(0, lastGroupElementIndex)
+            .filter((updatedElement) => !isElementInGroup(updatedElement, newGroupId));
+        nextElements = [
+            ...elementsBeforeGroup,
+            ...elementsInGroup,
+            ...elementsAfterGroup,
+        ];
+        return {
+            appState: {
+                ...appState,
+                ...selectGroup(newGroupId, { ...appState, selectedGroupIds: {} }, getNonDeletedElements(nextElements)),
+            },
+            elements: nextElements,
+            commitToHistory: true,
+        };
+    },
+    contextItemLabel: "labels.group",
+    predicate: (elements, appState, _, app) => enableActionGroup(elements, appState, app),
+    keyTest: (event) => !event.shiftKey && event[KEYS.CTRL_OR_CMD] && event.key === KEYS.G,
+    PanelComponent: ({ elements, appState, updateData, app }) => (_jsx(ToolButton, { hidden: !enableActionGroup(elements, appState, app), type: "button", icon: _jsx(GroupIcon, { theme: appState.theme }), onClick: () => updateData(null), title: `${t("labels.group")} — ${getShortcutKey("CtrlOrCmd+G")}`, "aria-label": t("labels.group"), visible: isSomeElementSelected(getNonDeletedElements(elements), appState) })),
+});
+export const actionUngroup = register({
+    name: "ungroup",
+    trackEvent: { category: "element" },
+    perform: (elements, appState, _, app) => {
+        const groupIds = getSelectedGroupIds(appState);
+        if (groupIds.length === 0) {
+            return { appState, elements, commitToHistory: false };
+        }
+        let nextElements = [...elements];
+        const boundTextElementIds = [];
+        nextElements = nextElements.map((element) => {
+            if (isBoundToContainer(element)) {
+                boundTextElementIds.push(element.id);
+            }
+            const nextGroupIds = removeFromSelectedGroups(element.groupIds, appState.selectedGroupIds);
+            if (nextGroupIds.length === element.groupIds.length) {
+                return element;
+            }
+            return newElementWith(element, {
+                groupIds: nextGroupIds,
+            });
+        });
+        const updateAppState = selectGroupsForSelectedElements(appState, getNonDeletedElements(nextElements), appState, null);
+        const selectedElements = app.scene.getSelectedElements(appState);
+        const selectedElementFrameIds = new Set(selectedElements
+            .filter((element) => element.frameId)
+            .map((element) => element.frameId));
+        const targetFrames = getFrameLikeElements(elements).filter((frame) => selectedElementFrameIds.has(frame.id));
+        targetFrames.forEach((frame) => {
+            if (frame) {
+                nextElements = replaceAllElementsInFrame(nextElements, getElementsInResizingFrame(nextElements, frame, appState), frame, appState);
+            }
+        });
+        // remove binded text elements from selection
+        updateAppState.selectedElementIds = Object.entries(updateAppState.selectedElementIds).reduce((acc, [id, selected]) => {
+            if (selected && !boundTextElementIds.includes(id)) {
+                acc[id] = true;
+            }
+            return acc;
+        }, {});
+        return {
+            appState: { ...appState, ...updateAppState },
+            elements: nextElements,
+            commitToHistory: true,
+        };
+    },
+    keyTest: (event) => event.shiftKey &&
+        event[KEYS.CTRL_OR_CMD] &&
+        event.key === KEYS.G.toUpperCase(),
+    contextItemLabel: "labels.ungroup",
+    predicate: (elements, appState) => getSelectedGroupIds(appState).length > 0,
+    PanelComponent: ({ elements, appState, updateData }) => (_jsx(ToolButton, { type: "button", hidden: getSelectedGroupIds(appState).length === 0, icon: _jsx(UngroupIcon, { theme: appState.theme }), onClick: () => updateData(null), title: `${t("labels.ungroup")} — ${getShortcutKey("CtrlOrCmd+Shift+G")}`, "aria-label": t("labels.ungroup"), visible: isSomeElementSelected(getNonDeletedElements(elements), appState) })),
+});

package/dist/packages/excalidraw/actions/actionHistory.js

@@ -0,0 +1,57 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { UndoIcon, RedoIcon } from "../components/icons";
+import { ToolButton } from "../components/ToolButton";
+import { t } from "../i18n";
+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;
+    if (!appState.multiElement &&
+        !appState.resizingElement &&
+        !appState.editingElement &&
+        !appState.draggingElement) {
+        const data = updater();
+        if (data === null) {
+            return { commitToHistory };
+        }
+        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);
+        return {
+            elements,
+            appState: { ...appState, ...data.appState },
+            commitToHistory,
+            syncHistory: true,
+        };
+    }
+    return { commitToHistory };
+};
+export const createUndoAction = (history) => ({
+    name: "undo",
+    trackEvent: { category: "history" },
+    perform: (elements, appState) => writeData(elements, appState, () => history.undoOnce()),
+    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,
+});
+export const createRedoAction = (history) => ({
+    name: "redo",
+    trackEvent: { category: "history" },
+    perform: (elements, appState) => writeData(elements, appState, () => history.redoOnce()),
+    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,
+});

package/dist/packages/excalidraw/actions/actionLinearEditor.js

@@ -0,0 +1,41 @@
+import { LinearElementEditor } from "../element/linearElementEditor";
+import { isLinearElement } from "../element/typeChecks";
+import { register } from "./register";
+export const actionToggleLinearEditor = register({
+    name: "toggleLinearEditor",
+    trackEvent: {
+        category: "element",
+    },
+    predicate: (elements, appState, _, app) => {
+        const selectedElements = app.scene.getSelectedElements(appState);
+        if (selectedElements.length === 1 && isLinearElement(selectedElements[0])) {
+            return true;
+        }
+        return false;
+    },
+    perform(elements, appState, _, app) {
+        const selectedElement = app.scene.getSelectedElements({
+            selectedElementIds: appState.selectedElementIds,
+            includeBoundTextElement: true,
+        })[0];
+        const editingLinearElement = appState.editingLinearElement?.elementId === selectedElement.id
+            ? null
+            : new LinearElementEditor(selectedElement, app.scene);
+        return {
+            appState: {
+                ...appState,
+                editingLinearElement,
+            },
+            commitToHistory: false,
+        };
+    },
+    contextItemLabel: (elements, appState, app) => {
+        const selectedElement = app.scene.getSelectedElements({
+            selectedElementIds: appState.selectedElementIds,
+            includeBoundTextElement: true,
+        })[0];
+        return appState.editingLinearElement?.elementId === selectedElement.id
+            ? "labels.lineEditor.exit"
+            : "labels.lineEditor.edit";
+    },
+});

package/dist/packages/excalidraw/actions/actionMenu.js

@@ -0,0 +1,53 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { HamburgerMenuIcon, palette } from "../components/icons";
+import { ToolButton } from "../components/ToolButton";
+import { t } from "../i18n";
+import { showSelectedShapeActions, getNonDeletedElements } from "../element";
+import { register } from "./register";
+import { KEYS } from "../keys";
+export const actionToggleCanvasMenu = register({
+    name: "toggleCanvasMenu",
+    trackEvent: { category: "menu" },
+    perform: (_, appState) => ({
+        appState: {
+            ...appState,
+            openMenu: appState.openMenu === "canvas" ? null : "canvas",
+        },
+        commitToHistory: false,
+    }),
+    PanelComponent: ({ appState, updateData }) => (_jsx(ToolButton, { type: "button", icon: HamburgerMenuIcon, "aria-label": t("buttons.menu"), onClick: updateData, selected: appState.openMenu === "canvas" })),
+});
+export const actionToggleEditMenu = register({
+    name: "toggleEditMenu",
+    trackEvent: { category: "menu" },
+    perform: (_elements, appState) => ({
+        appState: {
+            ...appState,
+            openMenu: appState.openMenu === "shape" ? null : "shape",
+        },
+        commitToHistory: false,
+    }),
+    PanelComponent: ({ elements, appState, updateData }) => (_jsx(ToolButton, { visible: showSelectedShapeActions(appState, getNonDeletedElements(elements)), type: "button", icon: palette, "aria-label": t("buttons.edit"), onClick: updateData, selected: appState.openMenu === "shape" })),
+});
+export const actionShortcuts = register({
+    name: "toggleShortcuts",
+    viewMode: true,
+    trackEvent: { category: "menu", action: "toggleHelpDialog" },
+    perform: (_elements, appState, _, { focusContainer }) => {
+        if (appState.openDialog?.name === "help") {
+            focusContainer();
+        }
+        return {
+            appState: {
+                ...appState,
+                openDialog: appState.openDialog?.name === "help"
+                    ? null
+                    : {
+                        name: "help",
+                    },
+            },
+            commitToHistory: false,
+        };
+    },
+    keyTest: (event) => event.key === KEYS.QUESTION_MARK,
+});