adaptive handles

This commit is contained in:
Ryan Di
2024-04-18 17:15:18 +08:00
parent c453fa34f2
commit f57bde0fde
5 changed files with 219 additions and 194 deletions
+31 -22
View File
@@ -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;
}
}
}
@@ -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;
};
@@ -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,
@@ -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,
+1 -1
View File
@@ -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";