aboutsummaryrefslogtreecommitdiffstats
path: root/packages/excalidraw/actions/actionLinearEditor.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'packages/excalidraw/actions/actionLinearEditor.tsx')
-rw-r--r--packages/excalidraw/actions/actionLinearEditor.tsx77
1 files changed, 77 insertions, 0 deletions
diff --git a/packages/excalidraw/actions/actionLinearEditor.tsx b/packages/excalidraw/actions/actionLinearEditor.tsx
new file mode 100644
index 0000000..1f05755
--- /dev/null
+++ b/packages/excalidraw/actions/actionLinearEditor.tsx
@@ -0,0 +1,77 @@
+import { DEFAULT_CATEGORIES } from "../components/CommandPalette/CommandPalette";
+import { LinearElementEditor } from "../element/linearElementEditor";
+import { isElbowArrow, isLinearElement } from "../element/typeChecks";
+import type { ExcalidrawLinearElement } from "../element/types";
+import { CaptureUpdateAction } 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,
+ })[0] as ExcalidrawLinearElement | undefined;
+
+ 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 (
+ !appState.editingLinearElement &&
+ selectedElements.length === 1 &&
+ isLinearElement(selectedElements[0]) &&
+ !isElbowArrow(selectedElements[0])
+ ) {
+ return true;
+ }
+ return false;
+ },
+ perform(elements, appState, _, app) {
+ const selectedElement = app.scene.getSelectedElements({
+ selectedElementIds: appState.selectedElementIds,
+ includeBoundTextElement: true,
+ })[0] as ExcalidrawLinearElement;
+
+ const editingLinearElement =
+ appState.editingLinearElement?.elementId === selectedElement.id
+ ? null
+ : new LinearElementEditor(selectedElement);
+ return {
+ appState: {
+ ...appState,
+ editingLinearElement,
+ },
+ captureUpdate: CaptureUpdateAction.IMMEDIATELY,
+ };
+ },
+ PanelComponent: ({ appState, updateData, app }) => {
+ const selectedElement = app.scene.getSelectedElements({
+ selectedElementIds: appState.selectedElementIds,
+ })[0] as ExcalidrawLinearElement;
+
+ const label = t(
+ selectedElement.type === "arrow"
+ ? "labels.lineEditor.editArrow"
+ : "labels.lineEditor.edit",
+ );
+ return (
+ <ToolButton
+ type="button"
+ icon={lineEditorIcon}
+ title={label}
+ aria-label={label}
+ onClick={() => updateData(null)}
+ />
+ );
+ },
+});