From f57bde0fde7aa5b67f0673b6996946fe173f3443 Mon Sep 17 00:00:00 2001 From: Ryan Di Date: Thu, 18 Apr 2024 17:15:18 +0800 Subject: [PATCH] adaptive handles --- packages/excalidraw/element/resizeTest.ts | 53 +-- .../excalidraw/element/transformHandles.ts | 16 + .../__snapshots__/contextmenu.test.tsx.snap | 326 +++++++++--------- .../tests/linearElementEditor.test.tsx | 16 +- packages/excalidraw/tests/resize.test.tsx | 2 +- 5 files changed, 219 insertions(+), 194 deletions(-) diff --git a/packages/excalidraw/element/resizeTest.ts b/packages/excalidraw/element/resizeTest.ts index c33fa4ec4..5170a3941 100644 --- a/packages/excalidraw/element/resizeTest.ts +++ b/packages/excalidraw/element/resizeTest.ts @@ -12,6 +12,7 @@ import { TransformHandleType, TransformHandle, MaybeTransformHandleType, + showAllTransformHandles, } from "./transformHandles"; import { AppState, Zoom } from "../types"; import { Bounds, getElementAbsoluteCoords } from "./bounds"; @@ -23,7 +24,7 @@ import { } from "../../utils/geometry/geometry"; import { Line, Point } from "../../utils/geometry/shape"; -const SIDE_RESIZING_SPACING = DEFAULT_TRANSFORM_HANDLE_SPACING * 3; +const SIDE_RESIZING_SPACING = DEFAULT_TRANSFORM_HANDLE_SPACING * 4.5; const isInsideTransformHandle = ( transformHandle: TransformHandle, @@ -73,16 +74,22 @@ export const resizeTest = ( // Resize an element from the sides. // Note that for a text element, when "resized" from the side - // we souldmake it wrap/unwrap - if (element.type !== "text") { - const [x1, y1, x2, y2, cx, cy] = getElementAbsoluteCoords( - element, - elementsMap, - ); + // we should make it wrap/unwrap + + const [x1, y1, x2, y2, cx, cy] = getElementAbsoluteCoords( + element, + elementsMap, + ); + + if ( + element.type !== "text" && + showAllTransformHandles(Math.abs(x2 - x1), Math.abs(y2 - y1), zoom) + ) { const SPACING = SIDE_RESIZING_SPACING / zoom.value; + const HALF = DEFAULT_TRANSFORM_HANDLE_SPACING / zoom.value / 2; const sides = getSelectionBorders( - [x1 - SPACING, y1 - SPACING], - [x2 + SPACING, y2 + SPACING], + [x1 - HALF, y1 - HALF], + [x2 + HALF, y2 + HALF], [cx, cy], angleToDegrees(element.angle), ); @@ -153,21 +160,23 @@ export const getTransformHandleTypeFromCoords = ( } // check sides - const cx = (x1 + x2) / 2; - const cy = (y1 + y2) / 2; + if (showAllTransformHandles(Math.abs(x2 - x1), Math.abs(y2 - y1), zoom)) { + const cx = (x1 + x2) / 2; + const cy = (y1 + y2) / 2; - const SPACING = SIDE_RESIZING_SPACING / zoom.value; - const sides = getSelectionBorders( - [x1 - SPACING, y1 - SPACING], - [x2 + SPACING, y2 + SPACING], - [cx, cy], - angleToDegrees(0), - ); + const SPACING = SIDE_RESIZING_SPACING / zoom.value; + const sides = getSelectionBorders( + [x1 - SPACING, y1 - SPACING], + [x2 + SPACING, y2 + SPACING], + [cx, cy], + angleToDegrees(0), + ); - for (const [dir, side] of Object.entries(sides)) { - // test to see if x, y are on the line segment - if (pointOnLine([scenePointerX, scenePointerY], side as Line, SPACING)) { - return dir as TransformHandleType; + for (const [dir, side] of Object.entries(sides)) { + // test to see if x, y are on the line segment + if (pointOnLine([scenePointerX, scenePointerY], side as Line, SPACING)) { + return dir as TransformHandleType; + } } } diff --git a/packages/excalidraw/element/transformHandles.ts b/packages/excalidraw/element/transformHandles.ts index 25d65c9db..51826b43b 100644 --- a/packages/excalidraw/element/transformHandles.ts +++ b/packages/excalidraw/element/transformHandles.ts @@ -96,6 +96,16 @@ const generateTransformHandle = ( return [xx - width / 2, yy - height / 2, width, height]; }; +export const showAllTransformHandles = ( + width: number, + height: number, + zoom: Zoom, +) => { + // Note: we render using "mouse" size so we should also use "mouse" size for this check + const minSizeForAllHandles = (4 * transformHandleSizes.mouse) / zoom.value; + return width > minSizeForAllHandles && height > minSizeForAllHandles; +}; + export const getTransformHandlesFromCoords = ( [x1, y1, x2, y2, cx, cy]: [number, number, number, number, number, number], angle: number, @@ -232,6 +242,12 @@ export const getTransformHandlesFromCoords = ( } } + // We only want to show complete handles above a certain size + if (!showAllTransformHandles(width, height, zoom)) { + transformHandles.ne = undefined; + transformHandles.sw = undefined; + } + return transformHandles; }; diff --git a/packages/excalidraw/tests/__snapshots__/contextmenu.test.tsx.snap b/packages/excalidraw/tests/__snapshots__/contextmenu.test.tsx.snap index 151b365a0..78891d350 100644 --- a/packages/excalidraw/tests/__snapshots__/contextmenu.test.tsx.snap +++ b/packages/excalidraw/tests/__snapshots__/contextmenu.test.tsx.snap @@ -2315,14 +2315,14 @@ exports[`contextMenu element > selecting 'Delete' in context menu deletes elemen "roundness": { "type": 3, }, - "seed": 449462985, + "seed": 1278240551, "strokeColor": "#1e1e1e", "strokeStyle": "solid", "strokeWidth": 2, "type": "rectangle", "updated": 1, "version": 4, - "versionNonce": 238820263, + "versionNonce": 1150084233, "width": 20, "x": -10, "y": 0, @@ -2376,14 +2376,14 @@ exports[`contextMenu element > selecting 'Delete' in context menu deletes elemen "roundness": { "type": 3, }, - "seed": 449462985, + "seed": 1278240551, "strokeColor": "#1e1e1e", "strokeStyle": "solid", "strokeWidth": 2, "type": "rectangle", "updated": 1, "version": 3, - "versionNonce": 1150084233, + "versionNonce": 401146281, "width": 20, "x": -10, "y": 0, @@ -2419,14 +2419,14 @@ exports[`contextMenu element > selecting 'Delete' in context menu deletes elemen "roundness": { "type": 3, }, - "seed": 449462985, + "seed": 1278240551, "strokeColor": "#1e1e1e", "strokeStyle": "solid", "strokeWidth": 2, "type": "rectangle", "updated": 1, "version": 4, - "versionNonce": 238820263, + "versionNonce": 1150084233, "width": 20, "x": -10, "y": 0, @@ -2564,14 +2564,14 @@ exports[`contextMenu element > selecting 'Duplicate' in context menu duplicates "roundness": { "type": 3, }, - "seed": 449462985, + "seed": 1278240551, "strokeColor": "#1e1e1e", "strokeStyle": "solid", "strokeWidth": 2, "type": "rectangle", "updated": 1, "version": 3, - "versionNonce": 1150084233, + "versionNonce": 401146281, "width": 20, "x": -10, "y": 0, @@ -2598,14 +2598,14 @@ exports[`contextMenu element > selecting 'Duplicate' in context menu duplicates "roundness": { "type": 3, }, - "seed": 238820263, + "seed": 1150084233, "strokeColor": "#1e1e1e", "strokeStyle": "solid", "strokeWidth": 2, "type": "rectangle", "updated": 1, "version": 4, - "versionNonce": 400692809, + "versionNonce": 1116226695, "width": 20, "x": 0, "y": 10, @@ -2659,14 +2659,14 @@ exports[`contextMenu element > selecting 'Duplicate' in context menu duplicates "roundness": { "type": 3, }, - "seed": 449462985, + "seed": 1278240551, "strokeColor": "#1e1e1e", "strokeStyle": "solid", "strokeWidth": 2, "type": "rectangle", "updated": 1, "version": 3, - "versionNonce": 1150084233, + "versionNonce": 401146281, "width": 20, "x": -10, "y": 0, @@ -2704,14 +2704,14 @@ exports[`contextMenu element > selecting 'Duplicate' in context menu duplicates "roundness": { "type": 3, }, - "seed": 449462985, + "seed": 1278240551, "strokeColor": "#1e1e1e", "strokeStyle": "solid", "strokeWidth": 2, "type": "rectangle", "updated": 1, "version": 3, - "versionNonce": 1150084233, + "versionNonce": 401146281, "width": 20, "x": -10, "y": 0, @@ -2735,14 +2735,14 @@ exports[`contextMenu element > selecting 'Duplicate' in context menu duplicates "roundness": { "type": 3, }, - "seed": 238820263, + "seed": 1150084233, "strokeColor": "#1e1e1e", "strokeStyle": "solid", "strokeWidth": 2, "type": "rectangle", "updated": 1, "version": 4, - "versionNonce": 400692809, + "versionNonce": 1116226695, "width": 20, "x": 0, "y": 10, @@ -2887,14 +2887,14 @@ exports[`contextMenu element > selecting 'Group selection' in context menu group "roundness": { "type": 3, }, - "seed": 449462985, + "seed": 1278240551, "strokeColor": "#1e1e1e", "strokeStyle": "solid", "strokeWidth": 2, "type": "rectangle", "updated": 1, "version": 4, - "versionNonce": 915032327, + "versionNonce": 1505387817, "width": 20, "x": -10, "y": 0, @@ -2923,14 +2923,14 @@ exports[`contextMenu element > selecting 'Group selection' in context menu group "roundness": { "type": 3, }, - "seed": 238820263, + "seed": 1150084233, "strokeColor": "#1e1e1e", "strokeStyle": "solid", "strokeWidth": 2, "type": "rectangle", "updated": 1, "version": 4, - "versionNonce": 81784553, + "versionNonce": 23633383, "width": 20, "x": 20, "y": 30, @@ -2984,14 +2984,14 @@ exports[`contextMenu element > selecting 'Group selection' in context menu group "roundness": { "type": 3, }, - "seed": 449462985, + "seed": 1278240551, "strokeColor": "#1e1e1e", "strokeStyle": "solid", "strokeWidth": 2, "type": "rectangle", "updated": 1, "version": 3, - "versionNonce": 1150084233, + "versionNonce": 401146281, "width": 20, "x": -10, "y": 0, @@ -3029,14 +3029,14 @@ exports[`contextMenu element > selecting 'Group selection' in context menu group "roundness": { "type": 3, }, - "seed": 449462985, + "seed": 1278240551, "strokeColor": "#1e1e1e", "strokeStyle": "solid", "strokeWidth": 2, "type": "rectangle", "updated": 1, "version": 3, - "versionNonce": 1150084233, + "versionNonce": 401146281, "width": 20, "x": -10, "y": 0, @@ -3060,14 +3060,14 @@ exports[`contextMenu element > selecting 'Group selection' in context menu group "roundness": { "type": 3, }, - "seed": 238820263, + "seed": 1150084233, "strokeColor": "#1e1e1e", "strokeStyle": "solid", "strokeWidth": 2, "type": "rectangle", "updated": 1, "version": 3, - "versionNonce": 1505387817, + "versionNonce": 238820263, "width": 20, "x": 20, "y": 30, @@ -3110,14 +3110,14 @@ exports[`contextMenu element > selecting 'Group selection' in context menu group "roundness": { "type": 3, }, - "seed": 449462985, + "seed": 1278240551, "strokeColor": "#1e1e1e", "strokeStyle": "solid", "strokeWidth": 2, "type": "rectangle", "updated": 1, "version": 4, - "versionNonce": 915032327, + "versionNonce": 1505387817, "width": 20, "x": -10, "y": 0, @@ -3143,14 +3143,14 @@ exports[`contextMenu element > selecting 'Group selection' in context menu group "roundness": { "type": 3, }, - "seed": 238820263, + "seed": 1150084233, "strokeColor": "#1e1e1e", "strokeStyle": "solid", "strokeWidth": 2, "type": "rectangle", "updated": 1, "version": 4, - "versionNonce": 81784553, + "versionNonce": 23633383, "width": 20, "x": 20, "y": 30, @@ -3290,14 +3290,14 @@ exports[`contextMenu element > selecting 'Paste styles' in context menu pastes s "roundness": { "type": 3, }, - "seed": 449462985, + "seed": 1278240551, "strokeColor": "#e03131", "strokeStyle": "dotted", "strokeWidth": 2, "type": "rectangle", "updated": 1, "version": 4, - "versionNonce": 908564423, + "versionNonce": 640725609, "width": 20, "x": -10, "y": 0, @@ -3324,14 +3324,14 @@ exports[`contextMenu element > selecting 'Paste styles' in context menu pastes s "roundness": { "type": 3, }, - "seed": 1315507081, + "seed": 760410951, "strokeColor": "#e03131", "strokeStyle": "dotted", "strokeWidth": 2, "type": "rectangle", "updated": 1, "version": 9, - "versionNonce": 406373543, + "versionNonce": 1315507081, "width": 20, "x": 20, "y": 30, @@ -3385,14 +3385,14 @@ exports[`contextMenu element > selecting 'Paste styles' in context menu pastes s "roundness": { "type": 3, }, - "seed": 449462985, + "seed": 1278240551, "strokeColor": "#1e1e1e", "strokeStyle": "solid", "strokeWidth": 2, "type": "rectangle", "updated": 1, "version": 3, - "versionNonce": 1150084233, + "versionNonce": 401146281, "width": 20, "x": -10, "y": 0, @@ -3430,14 +3430,14 @@ exports[`contextMenu element > selecting 'Paste styles' in context menu pastes s "roundness": { "type": 3, }, - "seed": 449462985, + "seed": 1278240551, "strokeColor": "#1e1e1e", "strokeStyle": "solid", "strokeWidth": 2, "type": "rectangle", "updated": 1, "version": 3, - "versionNonce": 1150084233, + "versionNonce": 401146281, "width": 20, "x": -10, "y": 0, @@ -3461,14 +3461,14 @@ exports[`contextMenu element > selecting 'Paste styles' in context menu pastes s "roundness": { "type": 3, }, - "seed": 238820263, + "seed": 1150084233, "strokeColor": "#1e1e1e", "strokeStyle": "solid", "strokeWidth": 2, "type": "rectangle", "updated": 1, "version": 3, - "versionNonce": 1505387817, + "versionNonce": 238820263, "width": 20, "x": 20, "y": 30, @@ -3506,14 +3506,14 @@ exports[`contextMenu element > selecting 'Paste styles' in context menu pastes s "roundness": { "type": 3, }, - "seed": 449462985, + "seed": 1278240551, "strokeColor": "#1e1e1e", "strokeStyle": "solid", "strokeWidth": 2, "type": "rectangle", "updated": 1, "version": 3, - "versionNonce": 1150084233, + "versionNonce": 401146281, "width": 20, "x": -10, "y": 0, @@ -3537,14 +3537,14 @@ exports[`contextMenu element > selecting 'Paste styles' in context menu pastes s "roundness": { "type": 3, }, - "seed": 238820263, + "seed": 1150084233, "strokeColor": "#e03131", "strokeStyle": "solid", "strokeWidth": 2, "type": "rectangle", "updated": 1, "version": 4, - "versionNonce": 493213705, + "versionNonce": 1604849351, "width": 20, "x": 20, "y": 30, @@ -3582,14 +3582,14 @@ exports[`contextMenu element > selecting 'Paste styles' in context menu pastes s "roundness": { "type": 3, }, - "seed": 449462985, + "seed": 1278240551, "strokeColor": "#1e1e1e", "strokeStyle": "solid", "strokeWidth": 2, "type": "rectangle", "updated": 1, "version": 3, - "versionNonce": 1150084233, + "versionNonce": 401146281, "width": 20, "x": -10, "y": 0, @@ -3613,14 +3613,14 @@ exports[`contextMenu element > selecting 'Paste styles' in context menu pastes s "roundness": { "type": 3, }, - "seed": 238820263, + "seed": 1150084233, "strokeColor": "#e03131", "strokeStyle": "solid", "strokeWidth": 2, "type": "rectangle", "updated": 1, "version": 5, - "versionNonce": 81784553, + "versionNonce": 23633383, "width": 20, "x": 20, "y": 30, @@ -3658,14 +3658,14 @@ exports[`contextMenu element > selecting 'Paste styles' in context menu pastes s "roundness": { "type": 3, }, - "seed": 449462985, + "seed": 1278240551, "strokeColor": "#1e1e1e", "strokeStyle": "solid", "strokeWidth": 2, "type": "rectangle", "updated": 1, "version": 3, - "versionNonce": 1150084233, + "versionNonce": 401146281, "width": 20, "x": -10, "y": 0, @@ -3689,14 +3689,14 @@ exports[`contextMenu element > selecting 'Paste styles' in context menu pastes s "roundness": { "type": 3, }, - "seed": 238820263, + "seed": 1150084233, "strokeColor": "#e03131", "strokeStyle": "solid", "strokeWidth": 2, "type": "rectangle", "updated": 1, "version": 6, - "versionNonce": 1723083209, + "versionNonce": 915032327, "width": 20, "x": 20, "y": 30, @@ -3734,14 +3734,14 @@ exports[`contextMenu element > selecting 'Paste styles' in context menu pastes s "roundness": { "type": 3, }, - "seed": 449462985, + "seed": 1278240551, "strokeColor": "#1e1e1e", "strokeStyle": "solid", "strokeWidth": 2, "type": "rectangle", "updated": 1, "version": 3, - "versionNonce": 1150084233, + "versionNonce": 401146281, "width": 20, "x": -10, "y": 0, @@ -3765,13 +3765,89 @@ exports[`contextMenu element > selecting 'Paste styles' in context menu pastes s "roundness": { "type": 3, }, - "seed": 238820263, + "seed": 1150084233, "strokeColor": "#e03131", "strokeStyle": "dotted", "strokeWidth": 2, "type": "rectangle", "updated": 1, "version": 7, + "versionNonce": 747212839, + "width": 20, + "x": 20, + "y": 30, + }, + ], + }, + { + "appState": { + "editingGroupId": null, + "editingLinearElement": null, + "name": "Untitled-201933152653", + "selectedElementIds": { + "id1": true, + }, + "selectedGroupIds": {}, + "viewBackgroundColor": "#ffffff", + }, + "elements": [ + { + "angle": 0, + "backgroundColor": "transparent", + "boundElements": null, + "customData": undefined, + "fillStyle": "solid", + "frameId": null, + "groupIds": [], + "height": 20, + "id": "id0", + "index": "a0", + "isDeleted": false, + "link": null, + "locked": false, + "opacity": 100, + "roughness": 1, + "roundness": { + "type": 3, + }, + "seed": 1278240551, + "strokeColor": "#1e1e1e", + "strokeStyle": "solid", + "strokeWidth": 2, + "type": "rectangle", + "updated": 1, + "version": 3, + "versionNonce": 401146281, + "width": 20, + "x": -10, + "y": 0, + }, + { + "angle": 0, + "backgroundColor": "#a5d8ff", + "boundElements": null, + "customData": undefined, + "fillStyle": "cross-hatch", + "frameId": null, + "groupIds": [], + "height": 20, + "id": "id1", + "index": "a1", + "isDeleted": false, + "link": null, + "locked": false, + "opacity": 100, + "roughness": 2, + "roundness": { + "type": 3, + }, + "seed": 760410951, + "strokeColor": "#e03131", + "strokeStyle": "dotted", + "strokeWidth": 2, + "type": "rectangle", + "updated": 1, + "version": 8, "versionNonce": 1006504105, "width": 20, "x": 20, @@ -3810,90 +3886,14 @@ exports[`contextMenu element > selecting 'Paste styles' in context menu pastes s "roundness": { "type": 3, }, - "seed": 449462985, + "seed": 1278240551, "strokeColor": "#1e1e1e", "strokeStyle": "solid", "strokeWidth": 2, "type": "rectangle", "updated": 1, "version": 3, - "versionNonce": 1150084233, - "width": 20, - "x": -10, - "y": 0, - }, - { - "angle": 0, - "backgroundColor": "#a5d8ff", - "boundElements": null, - "customData": undefined, - "fillStyle": "cross-hatch", - "frameId": null, - "groupIds": [], - "height": 20, - "id": "id1", - "index": "a1", - "isDeleted": false, - "link": null, - "locked": false, - "opacity": 100, - "roughness": 2, - "roundness": { - "type": 3, - }, - "seed": 1315507081, - "strokeColor": "#e03131", - "strokeStyle": "dotted", - "strokeWidth": 2, - "type": "rectangle", - "updated": 1, - "version": 8, - "versionNonce": 1898319239, - "width": 20, - "x": 20, - "y": 30, - }, - ], - }, - { - "appState": { - "editingGroupId": null, - "editingLinearElement": null, - "name": "Untitled-201933152653", - "selectedElementIds": { - "id1": true, - }, - "selectedGroupIds": {}, - "viewBackgroundColor": "#ffffff", - }, - "elements": [ - { - "angle": 0, - "backgroundColor": "transparent", - "boundElements": null, - "customData": undefined, - "fillStyle": "solid", - "frameId": null, - "groupIds": [], - "height": 20, - "id": "id0", - "index": "a0", - "isDeleted": false, - "link": null, - "locked": false, - "opacity": 100, - "roughness": 1, - "roundness": { - "type": 3, - }, - "seed": 449462985, - "strokeColor": "#1e1e1e", - "strokeStyle": "solid", - "strokeWidth": 2, - "type": "rectangle", - "updated": 1, - "version": 3, - "versionNonce": 1150084233, + "versionNonce": 401146281, "width": 20, "x": -10, "y": 0, @@ -3917,14 +3917,14 @@ exports[`contextMenu element > selecting 'Paste styles' in context menu pastes s "roundness": { "type": 3, }, - "seed": 1315507081, + "seed": 760410951, "strokeColor": "#e03131", "strokeStyle": "dotted", "strokeWidth": 2, "type": "rectangle", "updated": 1, "version": 9, - "versionNonce": 406373543, + "versionNonce": 1315507081, "width": 20, "x": 20, "y": 30, @@ -3962,14 +3962,14 @@ exports[`contextMenu element > selecting 'Paste styles' in context menu pastes s "roundness": { "type": 3, }, - "seed": 449462985, + "seed": 1278240551, "strokeColor": "#e03131", "strokeStyle": "dotted", "strokeWidth": 2, "type": "rectangle", "updated": 1, "version": 4, - "versionNonce": 908564423, + "versionNonce": 640725609, "width": 20, "x": -10, "y": 0, @@ -3993,14 +3993,14 @@ exports[`contextMenu element > selecting 'Paste styles' in context menu pastes s "roundness": { "type": 3, }, - "seed": 1315507081, + "seed": 760410951, "strokeColor": "#e03131", "strokeStyle": "dotted", "strokeWidth": 2, "type": "rectangle", "updated": 1, "version": 9, - "versionNonce": 406373543, + "versionNonce": 1315507081, "width": 20, "x": 20, "y": 30, @@ -4530,14 +4530,14 @@ exports[`contextMenu element > selecting 'Send to back' in context menu sends el "roundness": { "type": 3, }, - "seed": 238820263, + "seed": 1150084233, "strokeColor": "#1e1e1e", "strokeStyle": "solid", "strokeWidth": 2, "type": "rectangle", "updated": 1, "version": 4, - "versionNonce": 493213705, + "versionNonce": 1604849351, "width": 20, "x": 20, "y": 30, @@ -4564,14 +4564,14 @@ exports[`contextMenu element > selecting 'Send to back' in context menu sends el "roundness": { "type": 3, }, - "seed": 449462985, + "seed": 1278240551, "strokeColor": "#1e1e1e", "strokeStyle": "solid", "strokeWidth": 2, "type": "rectangle", "updated": 1, "version": 3, - "versionNonce": 1150084233, + "versionNonce": 401146281, "width": 20, "x": -10, "y": 0, @@ -4625,14 +4625,14 @@ exports[`contextMenu element > selecting 'Send to back' in context menu sends el "roundness": { "type": 3, }, - "seed": 449462985, + "seed": 1278240551, "strokeColor": "#1e1e1e", "strokeStyle": "solid", "strokeWidth": 2, "type": "rectangle", "updated": 1, "version": 3, - "versionNonce": 1150084233, + "versionNonce": 401146281, "width": 20, "x": -10, "y": 0, @@ -4670,14 +4670,14 @@ exports[`contextMenu element > selecting 'Send to back' in context menu sends el "roundness": { "type": 3, }, - "seed": 449462985, + "seed": 1278240551, "strokeColor": "#1e1e1e", "strokeStyle": "solid", "strokeWidth": 2, "type": "rectangle", "updated": 1, "version": 3, - "versionNonce": 1150084233, + "versionNonce": 401146281, "width": 20, "x": -10, "y": 0, @@ -4701,14 +4701,14 @@ exports[`contextMenu element > selecting 'Send to back' in context menu sends el "roundness": { "type": 3, }, - "seed": 238820263, + "seed": 1150084233, "strokeColor": "#1e1e1e", "strokeStyle": "solid", "strokeWidth": 2, "type": "rectangle", "updated": 1, "version": 3, - "versionNonce": 1505387817, + "versionNonce": 238820263, "width": 20, "x": 20, "y": 30, @@ -4746,14 +4746,14 @@ exports[`contextMenu element > selecting 'Send to back' in context menu sends el "roundness": { "type": 3, }, - "seed": 238820263, + "seed": 1150084233, "strokeColor": "#1e1e1e", "strokeStyle": "solid", "strokeWidth": 2, "type": "rectangle", "updated": 1, "version": 4, - "versionNonce": 493213705, + "versionNonce": 1604849351, "width": 20, "x": 20, "y": 30, @@ -4777,14 +4777,14 @@ exports[`contextMenu element > selecting 'Send to back' in context menu sends el "roundness": { "type": 3, }, - "seed": 449462985, + "seed": 1278240551, "strokeColor": "#1e1e1e", "strokeStyle": "solid", "strokeWidth": 2, "type": "rectangle", "updated": 1, "version": 3, - "versionNonce": 1150084233, + "versionNonce": 401146281, "width": 20, "x": -10, "y": 0, @@ -6193,14 +6193,14 @@ exports[`contextMenu element > shows 'Group selection' in context menu for multi "roundness": { "type": 3, }, - "seed": 453191, + "seed": 449462985, "strokeColor": "#1e1e1e", "strokeStyle": "solid", "strokeWidth": 2, "type": "rectangle", "updated": 1, "version": 3, - "versionNonce": 1014066025, + "versionNonce": 1150084233, "width": 10, "x": -10, "y": 0, @@ -6227,14 +6227,14 @@ exports[`contextMenu element > shows 'Group selection' in context menu for multi "roundness": { "type": 3, }, - "seed": 1604849351, + "seed": 1014066025, "strokeColor": "#1e1e1e", "strokeStyle": "solid", "strokeWidth": 2, "type": "rectangle", "updated": 1, "version": 3, - "versionNonce": 493213705, + "versionNonce": 1604849351, "width": 10, "x": 12, "y": 0, @@ -6288,14 +6288,14 @@ exports[`contextMenu element > shows 'Group selection' in context menu for multi "roundness": { "type": 3, }, - "seed": 453191, + "seed": 449462985, "strokeColor": "#1e1e1e", "strokeStyle": "solid", "strokeWidth": 2, "type": "rectangle", "updated": 1, "version": 3, - "versionNonce": 1014066025, + "versionNonce": 1150084233, "width": 10, "x": -10, "y": 0, @@ -6333,14 +6333,14 @@ exports[`contextMenu element > shows 'Group selection' in context menu for multi "roundness": { "type": 3, }, - "seed": 453191, + "seed": 449462985, "strokeColor": "#1e1e1e", "strokeStyle": "solid", "strokeWidth": 2, "type": "rectangle", "updated": 1, "version": 3, - "versionNonce": 1014066025, + "versionNonce": 1150084233, "width": 10, "x": -10, "y": 0, @@ -6364,14 +6364,14 @@ exports[`contextMenu element > shows 'Group selection' in context menu for multi "roundness": { "type": 3, }, - "seed": 1604849351, + "seed": 1014066025, "strokeColor": "#1e1e1e", "strokeStyle": "solid", "strokeWidth": 2, "type": "rectangle", "updated": 1, "version": 3, - "versionNonce": 493213705, + "versionNonce": 1604849351, "width": 10, "x": 12, "y": 0, diff --git a/packages/excalidraw/tests/linearElementEditor.test.tsx b/packages/excalidraw/tests/linearElementEditor.test.tsx index 51bc70a4a..4f11bc0ca 100644 --- a/packages/excalidraw/tests/linearElementEditor.test.tsx +++ b/packages/excalidraw/tests/linearElementEditor.test.tsx @@ -323,7 +323,7 @@ describe("Test Linear Elements", () => { expect(renderInteractiveScene.mock.calls.length).toMatchInlineSnapshot( `9`, ); - expect(renderStaticScene.mock.calls.length).toMatchInlineSnapshot(`7`); + expect(renderStaticScene.mock.calls.length).toMatchInlineSnapshot(`8`); const midPointsWithRoundEdge = LinearElementEditor.getEditorMidPoints( h.elements[0] as ExcalidrawLinearElement, @@ -381,7 +381,7 @@ describe("Test Linear Elements", () => { expect(renderInteractiveScene.mock.calls.length).toMatchInlineSnapshot( `12`, ); - expect(renderStaticScene.mock.calls.length).toMatchInlineSnapshot(`8`); + expect(renderStaticScene.mock.calls.length).toMatchInlineSnapshot(`9`); expect([line.x, line.y]).toEqual([ points[0][0] + deltaX, @@ -443,7 +443,7 @@ describe("Test Linear Elements", () => { expect(renderInteractiveScene.mock.calls.length).toMatchInlineSnapshot( `16`, ); - expect(renderStaticScene.mock.calls.length).toMatchInlineSnapshot(`8`); + expect(renderStaticScene.mock.calls.length).toMatchInlineSnapshot(`9`); expect(line.points.length).toEqual(5); @@ -494,7 +494,7 @@ describe("Test Linear Elements", () => { expect(renderInteractiveScene.mock.calls.length).toMatchInlineSnapshot( `12`, ); - expect(renderStaticScene.mock.calls.length).toMatchInlineSnapshot(`7`); + expect(renderStaticScene.mock.calls.length).toMatchInlineSnapshot(`8`); const newPoints = LinearElementEditor.getPointsGlobalCoordinates( line, @@ -535,7 +535,7 @@ describe("Test Linear Elements", () => { expect(renderInteractiveScene.mock.calls.length).toMatchInlineSnapshot( `12`, ); - expect(renderStaticScene.mock.calls.length).toMatchInlineSnapshot(`7`); + expect(renderStaticScene.mock.calls.length).toMatchInlineSnapshot(`8`); const newPoints = LinearElementEditor.getPointsGlobalCoordinates( line, @@ -583,7 +583,7 @@ describe("Test Linear Elements", () => { expect(renderInteractiveScene.mock.calls.length).toMatchInlineSnapshot( `18`, ); - expect(renderStaticScene.mock.calls.length).toMatchInlineSnapshot(`8`); + expect(renderStaticScene.mock.calls.length).toMatchInlineSnapshot(`9`); const newMidPoints = LinearElementEditor.getEditorMidPoints( line, @@ -633,7 +633,7 @@ describe("Test Linear Elements", () => { expect(renderInteractiveScene.mock.calls.length).toMatchInlineSnapshot( `16`, ); - expect(renderStaticScene.mock.calls.length).toMatchInlineSnapshot(`8`); + expect(renderStaticScene.mock.calls.length).toMatchInlineSnapshot(`9`); expect(line.points.length).toEqual(5); expect((h.elements[0] as ExcalidrawLinearElement).points) @@ -731,7 +731,7 @@ describe("Test Linear Elements", () => { expect(renderInteractiveScene.mock.calls.length).toMatchInlineSnapshot( `12`, ); - expect(renderStaticScene.mock.calls.length).toMatchInlineSnapshot(`7`); + expect(renderStaticScene.mock.calls.length).toMatchInlineSnapshot(`8`); const newPoints = LinearElementEditor.getPointsGlobalCoordinates( line, diff --git a/packages/excalidraw/tests/resize.test.tsx b/packages/excalidraw/tests/resize.test.tsx index 3a39db4d0..00dc3c4a4 100644 --- a/packages/excalidraw/tests/resize.test.tsx +++ b/packages/excalidraw/tests/resize.test.tsx @@ -6,7 +6,7 @@ import type { ExcalidrawFreeDrawElement, ExcalidrawLinearElement, } from "../element/types"; -import type { Point } from "../types"; +import type { Point, Zoom } from "../types"; import { Bounds, getElementPointsCoords } from "../element/bounds"; import { Excalidraw } from "../index"; import { API } from "./helpers/api";