diff --git a/src/element/linearElementEditor.ts b/src/element/linearElementEditor.ts index 906389f1..844d762c 100644 --- a/src/element/linearElementEditor.ts +++ b/src/element/linearElementEditor.ts @@ -12,7 +12,9 @@ import { SceneHistory } from "../history"; import { globalSceneState } from "../scene"; export class LinearElementEditor { - public elementId: ExcalidrawElement["id"]; + public elementId: ExcalidrawElement["id"] & { + _brand: "excalidrawLinearElementId"; + }; public activePointIndex: number | null; public draggingElementPointIndex: number | null; public lastUncommittedPoint: Point | null; @@ -20,7 +22,9 @@ export class LinearElementEditor { constructor(element: NonDeleted) { LinearElementEditor.normalizePoints(element); - this.elementId = element.id; + this.elementId = element.id as string & { + _brand: "excalidrawLinearElementId"; + }; this.activePointIndex = null; this.lastUncommittedPoint = null; this.draggingElementPointIndex = null; @@ -32,7 +36,11 @@ export class LinearElementEditor { static POINT_HANDLE_SIZE = 20; - static getElement(id: ExcalidrawElement["id"]) { + /** + * @param id the `elementId` from the instance of this class (so that we can + * statically guarantee this method returns an ExcalidrawLinearElement) + */ + static getElement(id: InstanceType["elementId"]) { const element = globalSceneState.getNonDeletedElement(id); if (element) { return element as NonDeleted; diff --git a/src/renderer/renderScene.ts b/src/renderer/renderScene.ts index 37ba97ea..12b74d03 100644 --- a/src/renderer/renderScene.ts +++ b/src/renderer/renderScene.ts @@ -30,7 +30,6 @@ import { getSelectedElements } from "../scene/selection"; import { renderElement, renderElementToSvg } from "./renderElement"; import { getClientColors } from "../clients"; -import { isLinearElement } from "../element/typeChecks"; import { LinearElementEditor } from "../element/linearElementEditor"; import { isSelectedViaGroup, @@ -220,14 +219,16 @@ export const renderScene = ( visibleElements.forEach((element) => { renderElement(element, rc, context, renderOptimizations, sceneState); - if ( - isLinearElement(element) && - appState.editingLinearElement && - appState.editingLinearElement.elementId === element.id - ) { + }); + + if (appState.editingLinearElement) { + const element = LinearElementEditor.getElement( + appState.editingLinearElement.elementId, + ); + if (element) { renderLinearPointHandles(context, appState, sceneState, element); } - }); + } // Paint selection element if (selectionElement) {