diff --git a/packages/excalidraw/actions/actionCropEditor.tsx b/packages/excalidraw/actions/actionCropEditor.tsx index ac4c0e31f2..9c1a7179d1 100644 --- a/packages/excalidraw/actions/actionCropEditor.tsx +++ b/packages/excalidraw/actions/actionCropEditor.tsx @@ -32,7 +32,7 @@ export const actionToggleCropEditor = register({ predicate: (elements, appState, _, app) => { const selectedElements = app.scene.getSelectedElements(appState); if ( - !appState.croppingElement && + !appState.croppingElementId && selectedElements.length === 1 && isImageElement(selectedElements[0]) ) { diff --git a/packages/excalidraw/appState.ts b/packages/excalidraw/appState.ts index 7c858e92a9..355bfe5063 100644 --- a/packages/excalidraw/appState.ts +++ b/packages/excalidraw/appState.ts @@ -117,7 +117,7 @@ export const getDefaultAppState = (): Omit< userToFollow: null, followedBy: new Set(), isCropping: false, - croppingElement: null, + croppingElementId: null, searchMatches: [], }; }; @@ -240,7 +240,7 @@ const APP_STATE_STORAGE_CONF = (< userToFollow: { browser: false, export: false, server: false }, followedBy: { browser: false, export: false, server: false }, isCropping: { browser: false, export: false, server: false }, - croppingElement: { browser: false, export: false, server: false }, + croppingElementId: { browser: false, export: false, server: false }, searchMatches: { browser: false, export: false, server: false }, }); diff --git a/packages/excalidraw/components/Actions.tsx b/packages/excalidraw/components/Actions.tsx index de813151c0..329be75015 100644 --- a/packages/excalidraw/components/Actions.tsx +++ b/packages/excalidraw/components/Actions.tsx @@ -129,7 +129,7 @@ export const SelectedShapeActions = ({ !isElbowArrow(targetElements[0]); const showCropEditorAction = - !appState.croppingElement && + !appState.croppingElementId && targetElements.length === 1 && isImageElement(targetElements[0]); diff --git a/packages/excalidraw/components/App.tsx b/packages/excalidraw/components/App.tsx index 319445dac0..2757300636 100644 --- a/packages/excalidraw/components/App.tsx +++ b/packages/excalidraw/components/App.tsx @@ -3939,7 +3939,7 @@ class App extends React.Component { if (!isInputLike(event.target)) { if ( (event.key === KEYS.ESCAPE || event.key === KEYS.ENTER) && - this.state.croppingElement + this.state.croppingElementId ) { this.finishImageCropping(); return; @@ -5174,13 +5174,13 @@ class App extends React.Component { private startImageCropping = (image: ExcalidrawImageElement) => { this.setState({ - croppingElement: image, + croppingElementId: image.id, }); }; private finishImageCropping = () => { this.setState({ - croppingElement: null, + croppingElementId: null, }); }; @@ -6797,7 +6797,7 @@ class App extends React.Component { }); pointerDownState.resize.handleType = elementWithTransformHandleType.transformHandleType; - } else if (this.state.croppingElement) { + } else if (this.state.croppingElementId) { pointerDownState.resize.handleType = elementWithTransformHandleType.transformHandleType; } else { @@ -6874,8 +6874,8 @@ class App extends React.Component { ); if ( - this.state.croppingElement && - pointerDownState.hit.element !== this.state.croppingElement + this.state.croppingElementId && + pointerDownState.hit.element?.id !== this.state.croppingElementId ) { this.finishImageCropping(); } @@ -7921,93 +7921,101 @@ class App extends React.Component { } // #region move crop region - const croppingElement = this.state.croppingElement; - if ( - croppingElement && - croppingElement.crop !== null && - pointerDownState.hit.element === croppingElement - ) { - const crop = croppingElement.crop; - const image = - isInitializedImageElement(croppingElement) && - this.imageCache.get(croppingElement.fileId)?.image; - - if (image && !(image instanceof Promise)) { - // scale the offset by at least a factor of 2 to improve ux - let instantDragOffset = vectorScale( - vector( - pointerCoords.x - lastPointerCoords.x, - pointerCoords.y - lastPointerCoords.y, - ), - Math.max(this.state.zoom.value, 2), - ); + if (this.state.croppingElementId) { + const croppingElement = this.scene + .getNonDeletedElementsMap() + .get(this.state.croppingElementId); - if (croppingElement.angle !== 0) { - const [x1, y1, x2, y2, cx, cy] = getElementAbsoluteCoords( - croppingElement, - elementsMap, - ); - - const topLeft = vectorFromPoint( - pointRotateRads( - pointFrom(x1, y1), - pointFrom(cx, cy), - croppingElement.angle, + if ( + croppingElement && + isImageElement(croppingElement) && + croppingElement.crop !== null && + pointerDownState.hit.element === croppingElement + ) { + const crop = croppingElement.crop; + const image = + isInitializedImageElement(croppingElement) && + this.imageCache.get(croppingElement.fileId)?.image; + + if (image && !(image instanceof Promise)) { + // scale the offset by at least a factor of 2 to improve ux + let instantDragOffset = vectorScale( + vector( + pointerCoords.x - lastPointerCoords.x, + pointerCoords.y - lastPointerCoords.y, ), + Math.max(this.state.zoom.value, 2), ); - const topRight = vectorFromPoint( - pointRotateRads( - pointFrom(x2, y1), - pointFrom(cx, cy), - croppingElement.angle, + + if (croppingElement.angle !== 0) { + const [x1, y1, x2, y2, cx, cy] = getElementAbsoluteCoords( + croppingElement, + elementsMap, + ); + + const topLeft = vectorFromPoint( + pointRotateRads( + pointFrom(x1, y1), + pointFrom(cx, cy), + croppingElement.angle, + ), + ); + const topRight = vectorFromPoint( + pointRotateRads( + pointFrom(x2, y1), + pointFrom(cx, cy), + croppingElement.angle, + ), + ); + const bottomLeft = vectorFromPoint( + pointRotateRads( + pointFrom(x1, y2), + pointFrom(cx, cy), + croppingElement.angle, + ), + ); + const topEdge = vectorNormalize( + vectorSubtract(topRight, topLeft), + ); + const leftEdge = vectorNormalize( + vectorSubtract(bottomLeft, topLeft), + ); + + /** + * project instantDrafOffset onto leftEdge and topEdge to decompose + */ + + instantDragOffset = vector( + vectorDot(instantDragOffset, topEdge), + vectorDot(instantDragOffset, leftEdge), + ); + } + + const nextCrop = { + ...crop, + x: clamp( + crop.x - + instantDragOffset[0] * + Math.sign(croppingElement.scale[0]), + 0, + image.naturalWidth - crop.width, ), - ); - const bottomLeft = vectorFromPoint( - pointRotateRads( - pointFrom(x1, y2), - pointFrom(cx, cy), - croppingElement.angle, + y: clamp( + crop.y - + instantDragOffset[1] * + Math.sign(croppingElement.scale[1]), + 0, + image.naturalHeight - crop.height, ), - ); - const topEdge = vectorNormalize( - vectorSubtract(topRight, topLeft), - ); - const leftEdge = vectorNormalize( - vectorSubtract(bottomLeft, topLeft), - ); + }; - /** - * project instantDrafOffset onto leftEdge and topEdge to decompose - */ + mutateElement(croppingElement, { + crop: nextCrop, + }); - instantDragOffset = vector( - vectorDot(instantDragOffset, topEdge), - vectorDot(instantDragOffset, leftEdge), - ); + return; } - - const nextCrop = { - ...crop, - x: clamp( - crop.x - - instantDragOffset[0] * Math.sign(croppingElement.scale[0]), - 0, - image.naturalWidth - crop.width, - ), - y: clamp( - crop.y - - instantDragOffset[1] * Math.sign(croppingElement.scale[1]), - 0, - image.naturalHeight - crop.height, - ), - }; - - mutateElement(croppingElement, { - crop: nextCrop, - }); } - - return; } // Snap cache *must* be synchronously popuplated before initial drag, @@ -8392,7 +8400,7 @@ class App extends React.Component { const { newElement, resizingElement, - croppingElement, + croppingElementId, multiElement, activeTool, isResizing, @@ -8897,16 +8905,16 @@ class App extends React.Component { } } - // click outside the cropping region to exit o0ol + // click outside the cropping region to exit if ( // not in the cropping mode at all - !croppingElement || + !croppingElementId || // in the cropping mode - (croppingElement && + (croppingElementId && // not cropping and no hit element ((!hitElement && !isCropping) || // hitting something else - (hitElement && hitElement !== croppingElement))) + (hitElement && hitElement.id !== croppingElementId))) ) { this.finishImageCropping(); } @@ -10136,7 +10144,7 @@ class App extends React.Component { event: MouseEvent | KeyboardEvent, ): boolean => { // to crop, we must already be in the cropping mode, where croppingElement has been set - if (!this.state.croppingElement) { + if (!this.state.croppingElementId) { return false; } @@ -10148,18 +10156,24 @@ class App extends React.Component { this.getEffectiveGridSize(), ); - const element = this.state.croppingElement; + const croppingElement = this.scene + .getNonDeletedElementsMap() + .get(this.state.croppingElementId); - if (transformHandleType) { + if ( + transformHandleType && + croppingElement && + isImageElement(croppingElement) + ) { const image = - isInitializedImageElement(element) && - this.imageCache.get(element.fileId)?.image; + isInitializedImageElement(croppingElement) && + this.imageCache.get(croppingElement.fileId)?.image; if (image && !(image instanceof Promise)) { mutateElement( - element, + croppingElement, cropElement( - element, + croppingElement, transformHandleType, image.naturalWidth, image.naturalHeight, @@ -10168,9 +10182,16 @@ class App extends React.Component { ), ); - updateBoundElements(element, this.scene.getNonDeletedElementsMap(), { - oldSize: { width: element.width, height: element.height }, - }); + updateBoundElements( + croppingElement, + this.scene.getNonDeletedElementsMap(), + { + oldSize: { + width: croppingElement.width, + height: croppingElement.height, + }, + }, + ); this.setState({ isCropping: transformHandleType && transformHandleType !== "rotation", @@ -10201,7 +10222,7 @@ class App extends React.Component { // Elbow arrows cannot be transformed (resized or rotated). (selectedElements.length === 1 && isElbowArrow(selectedElements[0])) || // Do not resize when in crop mode - this.state.croppingElement + this.state.croppingElementId ) { return false; } diff --git a/packages/excalidraw/components/HintViewer.tsx b/packages/excalidraw/components/HintViewer.tsx index c03ed99a94..f09f65852a 100644 --- a/packages/excalidraw/components/HintViewer.tsx +++ b/packages/excalidraw/components/HintViewer.tsx @@ -100,7 +100,7 @@ const getHints = ({ return t("hints.text_editing"); } - if (appState.croppingElement) { + if (appState.croppingElementId) { return t("hints.leaveCropEditor"); } diff --git a/packages/excalidraw/components/canvases/InteractiveCanvas.tsx b/packages/excalidraw/components/canvases/InteractiveCanvas.tsx index ae5118231b..c9ba8f3eb7 100644 --- a/packages/excalidraw/components/canvases/InteractiveCanvas.tsx +++ b/packages/excalidraw/components/canvases/InteractiveCanvas.tsx @@ -204,7 +204,7 @@ const getRelevantAppStateProps = ( zenModeEnabled: appState.zenModeEnabled, editingTextElement: appState.editingTextElement, isCropping: appState.isCropping, - croppingElement: appState.croppingElement, + croppingElementId: appState.croppingElementId, searchMatches: appState.searchMatches, }); diff --git a/packages/excalidraw/components/canvases/StaticCanvas.tsx b/packages/excalidraw/components/canvases/StaticCanvas.tsx index 02e697cac7..8ec38ac6bc 100644 --- a/packages/excalidraw/components/canvases/StaticCanvas.tsx +++ b/packages/excalidraw/components/canvases/StaticCanvas.tsx @@ -107,7 +107,7 @@ const getRelevantAppStateProps = ( frameToHighlight: appState.frameToHighlight, editingGroupId: appState.editingGroupId, currentHoveredFontFamily: appState.currentHoveredFontFamily, - croppingElement: appState.croppingElement, + croppingElementId: appState.croppingElementId, }); const areEqual = ( diff --git a/packages/excalidraw/renderer/interactiveScene.ts b/packages/excalidraw/renderer/interactiveScene.ts index 243d5d45a8..e7774893e1 100644 --- a/packages/excalidraw/renderer/interactiveScene.ts +++ b/packages/excalidraw/renderer/interactiveScene.ts @@ -54,6 +54,7 @@ import oc from "open-color"; import { isElbowArrow, isFrameLikeElement, + isImageElement, isLinearElement, isTextElement, } from "../element/typeChecks"; @@ -949,8 +950,7 @@ const _renderInteractiveScene = ({ activeEmbeddable: appState.activeEmbeddable?.element === element && appState.activeEmbeddable.state === "active", - padding: - element.id === appState.croppingElement?.id ? 0 : undefined, + padding: element.id === appState.croppingElementId ? 0 : undefined, }); } } @@ -1004,7 +1004,7 @@ const _renderInteractiveScene = ({ // do not show transform handles when text is being edited !isTextElement(appState.editingTextElement) && // do not show transform handles when image is being cropped - !appState.croppingElement + !appState.croppingElementId ) { renderTransformHandles( context, @@ -1015,14 +1015,18 @@ const _renderInteractiveScene = ({ ); } - if (appState.croppingElement && !appState.isCropping) { - renderCropHandles( - context, - renderConfig, - appState, - appState.croppingElement, - elementsMap, - ); + if (appState.croppingElementId && !appState.isCropping) { + const croppingElement = elementsMap.get(appState.croppingElementId); + + if (croppingElement && isImageElement(croppingElement)) { + renderCropHandles( + context, + renderConfig, + appState, + croppingElement, + elementsMap, + ); + } } } else if (selectedElements.length > 1 && !appState.isRotating) { const dashedLinePadding = diff --git a/packages/excalidraw/renderer/renderElement.ts b/packages/excalidraw/renderer/renderElement.ts index ebc5e5ac40..1c8eeee83a 100644 --- a/packages/excalidraw/renderer/renderElement.ts +++ b/packages/excalidraw/renderer/renderElement.ts @@ -440,9 +440,6 @@ const drawElementOnCanvas = ( // TODO: check why only croppingElement has the latest update const { x, y, width, height } = element.crop ? element.crop - : element === appState.croppingElement && - appState.croppingElement.crop - ? appState.croppingElement.crop : { x: 0, y: 0, @@ -942,7 +939,7 @@ export const renderElement = ( } if ( - element.id === appState.croppingElement?.id && + element.id === appState.croppingElementId && isImageElement(elementWithCanvas.element) && elementWithCanvas.element.crop !== null ) { diff --git a/packages/excalidraw/tests/__snapshots__/contextmenu.test.tsx.snap b/packages/excalidraw/tests/__snapshots__/contextmenu.test.tsx.snap index 21f4f3dc00..ad82985d7f 100644 --- a/packages/excalidraw/tests/__snapshots__/contextmenu.test.tsx.snap +++ b/packages/excalidraw/tests/__snapshots__/contextmenu.test.tsx.snap @@ -839,7 +839,7 @@ exports[`contextMenu element > right-clicking on a group should select whole gro "left": 30, "top": 40, }, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -1047,7 +1047,7 @@ exports[`contextMenu element > selecting 'Add to library' in context menu adds e }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -1265,7 +1265,7 @@ exports[`contextMenu element > selecting 'Bring forward' in context menu brings }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -1598,7 +1598,7 @@ exports[`contextMenu element > selecting 'Bring to front' in context menu brings }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -1931,7 +1931,7 @@ exports[`contextMenu element > selecting 'Copy styles' in context menu copies st }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -2149,7 +2149,7 @@ exports[`contextMenu element > selecting 'Delete' in context menu deletes elemen }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -2391,7 +2391,7 @@ exports[`contextMenu element > selecting 'Duplicate' in context menu duplicates }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -2694,7 +2694,7 @@ exports[`contextMenu element > selecting 'Group selection' in context menu group }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -3065,7 +3065,7 @@ exports[`contextMenu element > selecting 'Paste styles' in context menu pastes s }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -3542,7 +3542,7 @@ exports[`contextMenu element > selecting 'Send backward' in context menu sends e }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -3867,7 +3867,7 @@ exports[`contextMenu element > selecting 'Send to back' in context menu sends el }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -4192,7 +4192,7 @@ exports[`contextMenu element > selecting 'Ungroup selection' in context menu ung }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -5425,7 +5425,7 @@ exports[`contextMenu element > shows 'Group selection' in context menu for multi "left": -17, "top": -7, }, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -6599,7 +6599,7 @@ exports[`contextMenu element > shows 'Ungroup selection' in context menu for gro "left": -17, "top": -7, }, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -7536,7 +7536,7 @@ exports[`contextMenu element > shows context menu for canvas > [end of test] app "left": -19, "top": -9, }, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -8495,7 +8495,7 @@ exports[`contextMenu element > shows context menu for element > [end of test] ap "left": -17, "top": -7, }, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -9436,7 +9436,7 @@ exports[`contextMenu element > shows context menu for element > [end of test] ap "left": 80, "top": 90, }, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", diff --git a/packages/excalidraw/tests/__snapshots__/history.test.tsx.snap b/packages/excalidraw/tests/__snapshots__/history.test.tsx.snap index 592e92c6fe..4e843dc042 100644 --- a/packages/excalidraw/tests/__snapshots__/history.test.tsx.snap +++ b/packages/excalidraw/tests/__snapshots__/history.test.tsx.snap @@ -11,7 +11,7 @@ exports[`history > multiplayer undo/redo > conflicts in arrows and their bindabl }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -615,7 +615,7 @@ exports[`history > multiplayer undo/redo > conflicts in arrows and their bindabl }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -1123,7 +1123,7 @@ exports[`history > multiplayer undo/redo > conflicts in arrows and their bindabl }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -1493,7 +1493,7 @@ exports[`history > multiplayer undo/redo > conflicts in arrows and their bindabl }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -1864,7 +1864,7 @@ exports[`history > multiplayer undo/redo > conflicts in arrows and their bindabl }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -2133,7 +2133,7 @@ exports[`history > multiplayer undo/redo > conflicts in arrows and their bindabl }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -2575,7 +2575,7 @@ exports[`history > multiplayer undo/redo > conflicts in bound text elements and }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -2876,7 +2876,7 @@ exports[`history > multiplayer undo/redo > conflicts in bound text elements and }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -3162,7 +3162,7 @@ exports[`history > multiplayer undo/redo > conflicts in bound text elements and }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -3458,7 +3458,7 @@ exports[`history > multiplayer undo/redo > conflicts in bound text elements and }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -3746,7 +3746,7 @@ exports[`history > multiplayer undo/redo > conflicts in bound text elements and }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -3983,7 +3983,7 @@ exports[`history > multiplayer undo/redo > conflicts in bound text elements and }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -4244,7 +4244,7 @@ exports[`history > multiplayer undo/redo > conflicts in bound text elements and }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -4519,7 +4519,7 @@ exports[`history > multiplayer undo/redo > conflicts in bound text elements and }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -4752,7 +4752,7 @@ exports[`history > multiplayer undo/redo > conflicts in bound text elements and }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -4985,7 +4985,7 @@ exports[`history > multiplayer undo/redo > conflicts in bound text elements and }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -5216,7 +5216,7 @@ exports[`history > multiplayer undo/redo > conflicts in bound text elements and }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -5447,7 +5447,7 @@ exports[`history > multiplayer undo/redo > conflicts in frames and their childre }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -5708,7 +5708,7 @@ exports[`history > multiplayer undo/redo > should iterate through the history wh }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -6041,7 +6041,7 @@ exports[`history > multiplayer undo/redo > should iterate through the history wh }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -6468,7 +6468,7 @@ exports[`history > multiplayer undo/redo > should iterate through the history wh }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -6848,7 +6848,7 @@ exports[`history > multiplayer undo/redo > should iterate through the history wh }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -7169,7 +7169,7 @@ exports[`history > multiplayer undo/redo > should iterate through the history wh }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -7469,7 +7469,7 @@ exports[`history > multiplayer undo/redo > should iterate through the history wh }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -7700,7 +7700,7 @@ exports[`history > multiplayer undo/redo > should iterate through the history wh }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -8057,7 +8057,7 @@ exports[`history > multiplayer undo/redo > should iterate through the history wh }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -8414,7 +8414,7 @@ exports[`history > multiplayer undo/redo > should not let remote changes to inte }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -8820,7 +8820,7 @@ exports[`history > multiplayer undo/redo > should not let remote changes to inte }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -9109,7 +9109,7 @@ exports[`history > multiplayer undo/redo > should not let remote changes to inte }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -9376,7 +9376,7 @@ exports[`history > multiplayer undo/redo > should not override remote changes on }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -9642,7 +9642,7 @@ exports[`history > multiplayer undo/redo > should not override remote changes on }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -9875,7 +9875,7 @@ exports[`history > multiplayer undo/redo > should override remotely added groups }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -10178,7 +10178,7 @@ exports[`history > multiplayer undo/redo > should override remotely added points }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -10520,7 +10520,7 @@ exports[`history > multiplayer undo/redo > should redistribute deltas when eleme }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -10757,7 +10757,7 @@ exports[`history > multiplayer undo/redo > should redraw arrows on undo > [end o }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -11212,7 +11212,7 @@ exports[`history > multiplayer undo/redo > should update history entries after r }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -11468,7 +11468,7 @@ exports[`history > singleplayer undo/redo > remounting undo/redo buttons should }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -11709,7 +11709,7 @@ exports[`history > singleplayer undo/redo > should clear the redo stack on eleme }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -11952,7 +11952,7 @@ exports[`history > singleplayer undo/redo > should create entry when selecting f }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -12355,7 +12355,7 @@ exports[`history > singleplayer undo/redo > should create new history entry on s }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -12604,7 +12604,7 @@ exports[`history > singleplayer undo/redo > should disable undo/redo buttons whe }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -12847,7 +12847,7 @@ exports[`history > singleplayer undo/redo > should end up with no history entry }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -13090,7 +13090,7 @@ exports[`history > singleplayer undo/redo > should iterate through the history w }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -13339,7 +13339,7 @@ exports[`history > singleplayer undo/redo > should not clear the redo stack on s }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -13673,7 +13673,7 @@ exports[`history > singleplayer undo/redo > should not collapse when applying co }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -13847,7 +13847,7 @@ exports[`history > singleplayer undo/redo > should not end up with history entry }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -14137,7 +14137,7 @@ exports[`history > singleplayer undo/redo > should not end up with history entry }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -14406,7 +14406,7 @@ exports[`history > singleplayer undo/redo > should not override appstate changes }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -14683,7 +14683,7 @@ exports[`history > singleplayer undo/redo > should support appstate name or view }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -14846,7 +14846,7 @@ exports[`history > singleplayer undo/redo > should support bidirectional binding }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -15544,7 +15544,7 @@ exports[`history > singleplayer undo/redo > should support bidirectional binding }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -16166,7 +16166,7 @@ exports[`history > singleplayer undo/redo > should support bidirectional binding }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -16788,7 +16788,7 @@ exports[`history > singleplayer undo/redo > should support bidirectional binding }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -17502,7 +17502,7 @@ exports[`history > singleplayer undo/redo > should support bidirectional binding }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -18254,7 +18254,7 @@ exports[`history > singleplayer undo/redo > should support changes in elements' }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -18730,7 +18730,7 @@ exports[`history > singleplayer undo/redo > should support duplication of groups }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -19254,7 +19254,7 @@ exports[`history > singleplayer undo/redo > should support element creation, del }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -19712,7 +19712,7 @@ exports[`history > singleplayer undo/redo > should support linear element creati }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", diff --git a/packages/excalidraw/tests/__snapshots__/regressionTests.test.tsx.snap b/packages/excalidraw/tests/__snapshots__/regressionTests.test.tsx.snap index 5f69cdc64b..14c22a5202 100644 --- a/packages/excalidraw/tests/__snapshots__/regressionTests.test.tsx.snap +++ b/packages/excalidraw/tests/__snapshots__/regressionTests.test.tsx.snap @@ -11,7 +11,7 @@ exports[`given element A and group of elements B and given both are selected whe }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -425,7 +425,7 @@ exports[`given element A and group of elements B and given both are selected whe }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -830,7 +830,7 @@ exports[`regression tests > Cmd/Ctrl-click exclusively select element under poin }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -1374,7 +1374,7 @@ exports[`regression tests > Drags selected element when hitting only bounding bo }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -1577,7 +1577,7 @@ exports[`regression tests > adjusts z order when grouping > [end of test] appSta }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -1951,7 +1951,7 @@ exports[`regression tests > alt-drag duplicates an element > [end of test] appSt }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -2190,7 +2190,7 @@ exports[`regression tests > arrow keys > [end of test] appState 1`] = ` }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -2369,7 +2369,7 @@ exports[`regression tests > can drag element that covers another element, while }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -2688,7 +2688,7 @@ exports[`regression tests > change the properties of a shape > [end of test] app }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -2933,7 +2933,7 @@ exports[`regression tests > click on an element and drag it > [dragged] appState }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -3175,7 +3175,7 @@ exports[`regression tests > click on an element and drag it > [end of test] appS }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -3404,7 +3404,7 @@ exports[`regression tests > click to select a shape > [end of test] appState 1`] }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -3659,7 +3659,7 @@ exports[`regression tests > click-drag to select a group > [end of test] appStat }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -3969,7 +3969,7 @@ exports[`regression tests > deleting last but one element in editing group shoul }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -4382,7 +4382,7 @@ exports[`regression tests > deselects group of selected elements on pointer down }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -4664,7 +4664,7 @@ exports[`regression tests > deselects group of selected elements on pointer up w }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -4916,7 +4916,7 @@ exports[`regression tests > deselects selected element on pointer down when poin }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -5125,7 +5125,7 @@ exports[`regression tests > deselects selected element, on pointer up, when clic }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -5323,7 +5323,7 @@ exports[`regression tests > double click to edit a group > [end of test] appStat }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -5704,7 +5704,7 @@ exports[`regression tests > drags selected elements from point inside common bou }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -5993,7 +5993,7 @@ exports[`regression tests > draw every type of shape > [end of test] appState 1` }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -6800,7 +6800,7 @@ exports[`regression tests > given a group of selected elements with an element t }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -7129,7 +7129,7 @@ exports[`regression tests > given a selected element A and a not selected elemen }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -7404,7 +7404,7 @@ exports[`regression tests > given selected element A with lower z-index than uns }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -7637,7 +7637,7 @@ exports[`regression tests > given selected element A with lower z-index than uns }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -7873,7 +7873,7 @@ exports[`regression tests > key 2 selects rectangle tool > [end of test] appStat }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -8052,7 +8052,7 @@ exports[`regression tests > key 3 selects diamond tool > [end of test] appState }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -8231,7 +8231,7 @@ exports[`regression tests > key 4 selects ellipse tool > [end of test] appState }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -8410,7 +8410,7 @@ exports[`regression tests > key 5 selects arrow tool > [end of test] appState 1` }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -8632,7 +8632,7 @@ exports[`regression tests > key 6 selects line tool > [end of test] appState 1`] }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -8853,7 +8853,7 @@ exports[`regression tests > key 7 selects freedraw tool > [end of test] appState }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -9046,7 +9046,7 @@ exports[`regression tests > key a selects arrow tool > [end of test] appState 1` }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -9268,7 +9268,7 @@ exports[`regression tests > key d selects diamond tool > [end of test] appState }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -9447,7 +9447,7 @@ exports[`regression tests > key l selects line tool > [end of test] appState 1`] }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -9668,7 +9668,7 @@ exports[`regression tests > key o selects ellipse tool > [end of test] appState }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -9847,7 +9847,7 @@ exports[`regression tests > key p selects freedraw tool > [end of test] appState }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -10040,7 +10040,7 @@ exports[`regression tests > key r selects rectangle tool > [end of test] appStat }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -10219,7 +10219,7 @@ exports[`regression tests > make a group and duplicate it > [end of test] appSta }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -10732,7 +10732,7 @@ exports[`regression tests > noop interaction after undo shouldn't create history }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -11008,7 +11008,7 @@ exports[`regression tests > pinch-to-zoom works > [end of test] appState 1`] = ` }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -11133,7 +11133,7 @@ exports[`regression tests > shift click on selected element should deselect it o }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -11331,7 +11331,7 @@ exports[`regression tests > shift-click to multiselect, then drag > [end of test }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -11641,7 +11641,7 @@ exports[`regression tests > should group elements and ungroup them > [end of tes }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -12052,7 +12052,7 @@ exports[`regression tests > single-clicking on a subgroup of a selected group sh }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -12664,7 +12664,7 @@ exports[`regression tests > spacebar + drag scrolls the canvas > [end of test] a }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -12792,7 +12792,7 @@ exports[`regression tests > supports nested groups > [end of test] appState 1`] }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -13375,7 +13375,7 @@ exports[`regression tests > switches from group of selected elements to another }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -13712,7 +13712,7 @@ exports[`regression tests > switches selected element on pointer down > [end of }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -13976,7 +13976,7 @@ exports[`regression tests > two-finger scroll works > [end of test] appState 1`] }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -14101,7 +14101,7 @@ exports[`regression tests > undo/redo drawing an element > [end of test] appStat }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -14479,7 +14479,7 @@ exports[`regression tests > updates fontSize & fontFamily appState > [end of tes }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", @@ -14604,7 +14604,7 @@ exports[`regression tests > zoom hotkeys > [end of test] appState 1`] = ` }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round", diff --git a/packages/excalidraw/tests/cropElement.test.tsx b/packages/excalidraw/tests/cropElement.test.tsx index 2129b5c0be..702913a8ca 100644 --- a/packages/excalidraw/tests/cropElement.test.tsx +++ b/packages/excalidraw/tests/cropElement.test.tsx @@ -75,36 +75,36 @@ const compareCrops = (cropA: ImageCrop, cropB: ImageCrop) => { describe("Enter and leave the crop editor", () => { it("enter the editor by double clicking", () => { const image = h.elements[0]; - expect(h.state.croppingElement).toBe(null); + expect(h.state.croppingElementId).toBe(null); mouse.doubleClickOn(image); - expect(h.state.croppingElement).not.toBe(null); - expect(h.state.croppingElement?.id).toBe(image.id); + expect(h.state.croppingElementId).not.toBe(null); + expect(h.state.croppingElementId).toBe(image.id); }); it("enter the editor by pressing enter", () => { const image = h.elements[0]; - expect(h.state.croppingElement).toBe(null); + expect(h.state.croppingElementId).toBe(null); Keyboard.keyDown(KEYS.ENTER); - expect(h.state.croppingElement).not.toBe(null); - expect(h.state.croppingElement?.id).toBe(image.id); + expect(h.state.croppingElementId).not.toBe(null); + expect(h.state.croppingElementId).toBe(image.id); }); it("leave the editor by clicking outside", () => { const image = h.elements[0]; Keyboard.keyDown(KEYS.ENTER); - expect(h.state.croppingElement).not.toBe(null); + expect(h.state.croppingElementId).not.toBe(null); mouse.click(image.x - 20, image.y - 20); - expect(h.state.croppingElement).toBe(null); + expect(h.state.croppingElementId).toBe(null); }); it("leave the editor by pressing escape", () => { const image = h.elements[0]; mouse.doubleClickOn(image); - expect(h.state.croppingElement).not.toBe(null); + expect(h.state.croppingElementId).not.toBe(null); Keyboard.keyDown(KEYS.ESCAPE); - expect(h.state.croppingElement).toBe(null); + expect(h.state.croppingElementId).toBe(null); }); }); @@ -222,7 +222,7 @@ describe("Cropping and other features", async () => { generateRandomNaturalWidthAndHeight(image); mouse.doubleClickOn(image); - expect(h.state.croppingElement).not.toBe(null); + expect(h.state.croppingElementId).not.toBe(null); UI.crop(image, "nw", naturalWidth, naturalHeight, [ initialWidth / 2, initialHeight / 2, @@ -249,7 +249,7 @@ describe("Cropping and other features", async () => { generateRandomNaturalWidthAndHeight(image); mouse.doubleClickOn(image); - expect(h.state.croppingElement).not.toBe(null); + expect(h.state.croppingElementId).not.toBe(null); UI.crop(image, "nw", naturalWidth, naturalHeight, [ initialWidth / 2, initialHeight / 4, diff --git a/packages/excalidraw/types.ts b/packages/excalidraw/types.ts index d3643129f7..5a1044e913 100644 --- a/packages/excalidraw/types.ts +++ b/packages/excalidraw/types.ts @@ -177,7 +177,7 @@ export type StaticCanvasAppState = Readonly< frameRendering: AppState["frameRendering"]; currentHoveredFontFamily: AppState["currentHoveredFontFamily"]; // Cropping - croppingElement: AppState["croppingElement"]; + croppingElementId: AppState["croppingElementId"]; } >; @@ -202,7 +202,7 @@ export type InteractiveCanvasAppState = Readonly< editingTextElement: AppState["editingTextElement"]; // Cropping isCropping: AppState["isCropping"]; - croppingElement: AppState["croppingElement"]; + croppingElementId: AppState["croppingElementId"]; // Search matches searchMatches: AppState["searchMatches"]; } @@ -394,7 +394,7 @@ export interface AppState { /** image cropping */ isCropping: boolean; - croppingElement: ExcalidrawImageElement | null; + croppingElementId: ExcalidrawElement["id"] | null; searchMatches: readonly SearchMatch[]; } diff --git a/packages/utils/__snapshots__/export.test.ts.snap b/packages/utils/__snapshots__/export.test.ts.snap index c9c635398a..a9f98719c8 100644 --- a/packages/utils/__snapshots__/export.test.ts.snap +++ b/packages/utils/__snapshots__/export.test.ts.snap @@ -11,7 +11,7 @@ exports[`exportToSvg > with default arguments 1`] = ` }, "collaborators": Map {}, "contextMenu": null, - "croppingElement": null, + "croppingElementId": null, "currentChartType": "bar", "currentHoveredFontFamily": null, "currentItemArrowType": "round",