Compare commits
1
Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
b92f585ce7 |
@@ -1,4 +1,4 @@
|
|||||||
FROM node:24-bullseye
|
FROM node:18-bullseye
|
||||||
|
|
||||||
# Vite wants to open the browser using `open`, so we
|
# Vite wants to open the browser using `open`, so we
|
||||||
# need to install those utils.
|
# need to install those utils.
|
||||||
|
|||||||
@@ -11,7 +11,7 @@ jobs:
|
|||||||
runs-on: ubuntu-latest
|
runs-on: ubuntu-latest
|
||||||
timeout-minutes: 3
|
timeout-minutes: 3
|
||||||
steps:
|
steps:
|
||||||
- uses: styfle/cancel-workflow-action@ce177499ccf9fd2aded3b0426c97e5434c2e8a73 # 0.6.0
|
- uses: styfle/cancel-workflow-action@0.6.0
|
||||||
with:
|
with:
|
||||||
workflow_id: 400555, 400556, 905313, 1451724, 1710116, 3185001, 3438604
|
workflow_id: 400555, 400556, 905313, 1451724, 1710116, 3185001, 3438604
|
||||||
access_token: ${{ secrets.GITHUB_TOKEN }}
|
access_token: ${{ secrets.GITHUB_TOKEN }}
|
||||||
|
|||||||
@@ -40,7 +40,7 @@ jobs:
|
|||||||
echo ::set-output name=body::$body
|
echo ::set-output name=body::$body
|
||||||
|
|
||||||
- name: Update description with coverage
|
- name: Update description with coverage
|
||||||
uses: kt3k/update-pr-description@1b35a6dcd84d81aa0bc1889610efdcde7f37b0c0 # v1.0.1
|
uses: kt3k/update-pr-description@v1.0.1
|
||||||
with:
|
with:
|
||||||
pr_body: ${{ steps.getCommentBody.outputs.body }}
|
pr_body: ${{ steps.getCommentBody.outputs.body }}
|
||||||
pr_title: "chore: Update translations from Crowdin"
|
pr_title: "chore: Update translations from Crowdin"
|
||||||
|
|||||||
@@ -13,16 +13,16 @@ jobs:
|
|||||||
- name: Checkout repository
|
- name: Checkout repository
|
||||||
uses: actions/checkout@v3
|
uses: actions/checkout@v3
|
||||||
- name: Login to DockerHub
|
- name: Login to DockerHub
|
||||||
uses: docker/login-action@465a07811f14bebb1938fbed4728c6a1ff8901fc # v2
|
uses: docker/login-action@v2
|
||||||
with:
|
with:
|
||||||
username: ${{ secrets.DOCKER_USERNAME }}
|
username: ${{ secrets.DOCKER_USERNAME }}
|
||||||
password: ${{ secrets.DOCKER_PASSWORD }}
|
password: ${{ secrets.DOCKER_PASSWORD }}
|
||||||
- name: Set up QEMU
|
- name: Set up QEMU
|
||||||
uses: docker/setup-qemu-action@c7c53464625b32c7a7e944ae62b3e17d2b600130 # v3
|
uses: docker/setup-qemu-action@v3
|
||||||
- name: Set up Docker Buildx
|
- name: Set up Docker Buildx
|
||||||
uses: docker/setup-buildx-action@8d2750c68a42422c14e847fe6c8ac0403b4cbd6f # v3
|
uses: docker/setup-buildx-action@v3
|
||||||
- name: Build and push
|
- name: Build and push
|
||||||
uses: docker/build-push-action@ca052bb54ab0790a636c9b5f226502c73d547a25 # v5
|
uses: docker/build-push-action@v5
|
||||||
with:
|
with:
|
||||||
context: .
|
context: .
|
||||||
push: true
|
push: true
|
||||||
|
|||||||
@@ -11,6 +11,6 @@ jobs:
|
|||||||
semantic:
|
semantic:
|
||||||
runs-on: ubuntu-latest
|
runs-on: ubuntu-latest
|
||||||
steps:
|
steps:
|
||||||
- uses: amannn/action-semantic-pull-request@e32d7e603df1aa1ba07e981f2a23455dee596825 # v5
|
- uses: amannn/action-semantic-pull-request@v5
|
||||||
env:
|
env:
|
||||||
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
|
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
|
||||||
|
|||||||
@@ -20,7 +20,7 @@ jobs:
|
|||||||
working-directory: packages/excalidraw
|
working-directory: packages/excalidraw
|
||||||
env:
|
env:
|
||||||
CI: true
|
CI: true
|
||||||
- uses: andresz1/size-limit-action@e7493a72a44b113341c0cf6186ab49c17c4b65c1 # v1
|
- uses: andresz1/size-limit-action@v1
|
||||||
with:
|
with:
|
||||||
github_token: ${{ secrets.GITHUB_TOKEN }}
|
github_token: ${{ secrets.GITHUB_TOKEN }}
|
||||||
build_script: build:esm
|
build_script: build:esm
|
||||||
|
|||||||
@@ -21,6 +21,6 @@ jobs:
|
|||||||
run: yarn test:coverage
|
run: yarn test:coverage
|
||||||
- name: "Report Coverage"
|
- name: "Report Coverage"
|
||||||
if: always() # Also generate the report if tests are failing
|
if: always() # Also generate the report if tests are failing
|
||||||
uses: davelosert/vitest-coverage-report-action@2500dafcee7dd64f85ab689c0b83798a8359770e # v2
|
uses: davelosert/vitest-coverage-report-action@v2
|
||||||
with:
|
with:
|
||||||
github-token: ${{ secrets.GITHUB_TOKEN }}
|
github-token: ${{ secrets.GITHUB_TOKEN }}
|
||||||
|
|||||||
+2
-2
@@ -1,4 +1,4 @@
|
|||||||
FROM --platform=${BUILDPLATFORM} node:24 AS build
|
FROM --platform=${BUILDPLATFORM} node:18 AS build
|
||||||
|
|
||||||
WORKDIR /opt/node_app
|
WORKDIR /opt/node_app
|
||||||
|
|
||||||
@@ -13,7 +13,7 @@ ARG NODE_ENV=production
|
|||||||
|
|
||||||
RUN npm_config_target_arch=${TARGETARCH} yarn build:app:docker
|
RUN npm_config_target_arch=${TARGETARCH} yarn build:app:docker
|
||||||
|
|
||||||
FROM nginx:1.27-alpine
|
FROM --platform=${TARGETPLATFORM} nginx:1.27-alpine
|
||||||
|
|
||||||
COPY --from=build /opt/node_app/excalidraw-app/build /usr/share/nginx/html
|
COPY --from=build /opt/node_app/excalidraw-app/build /usr/share/nginx/html
|
||||||
|
|
||||||
|
|||||||
@@ -29,7 +29,7 @@
|
|||||||
<a href="https://docs.excalidraw.com/docs/introduction/contributing">
|
<a href="https://docs.excalidraw.com/docs/introduction/contributing">
|
||||||
<img alt="PRs welcome!" src="https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat" /></a>
|
<img alt="PRs welcome!" src="https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat" /></a>
|
||||||
<a href="https://discord.gg/UexuTaE">
|
<a href="https://discord.gg/UexuTaE">
|
||||||
<img alt="Chat on Discord" src="https://img.shields.io/discord/723672430744174682?color=738ad6&label=Chat%20on%20Discord&logo=discord&logoColor=ffffff&widget=false"/></a>
|
<img alt="Chat on Discord" src="https://img.shields.io/discord/723672430744174682?color=738ad6&label=Chat%20on%20Discord&logo=discord&logoColor=ffffff&widge=false"/></a>
|
||||||
<a href="https://deepwiki.com/excalidraw/excalidraw">
|
<a href="https://deepwiki.com/excalidraw/excalidraw">
|
||||||
<img alt="Ask DeepWiki" src="https://deepwiki.com/badge.svg" /></a>
|
<img alt="Ask DeepWiki" src="https://deepwiki.com/badge.svg" /></a>
|
||||||
<a href="https://twitter.com/excalidraw">
|
<a href="https://twitter.com/excalidraw">
|
||||||
|
|||||||
@@ -97,8 +97,8 @@ const config = {
|
|||||||
href: "https://discord.gg/UexuTaE",
|
href: "https://discord.gg/UexuTaE",
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: "𝕏",
|
label: "Twitter",
|
||||||
href: "https://x.com/excalidraw",
|
href: "https://twitter.com/excalidraw",
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: "Linkedin",
|
label: "Linkedin",
|
||||||
|
|||||||
@@ -1943,9 +1943,9 @@ export const calculateFixedPointForElbowArrowBinding = (
|
|||||||
return {
|
return {
|
||||||
fixedPoint: normalizeFixedPoint([
|
fixedPoint: normalizeFixedPoint([
|
||||||
(nonRotatedSnappedGlobalPoint[0] - hoveredElement.x) /
|
(nonRotatedSnappedGlobalPoint[0] - hoveredElement.x) /
|
||||||
Math.max(hoveredElement.width, PRECISION),
|
hoveredElement.width,
|
||||||
(nonRotatedSnappedGlobalPoint[1] - hoveredElement.y) /
|
(nonRotatedSnappedGlobalPoint[1] - hoveredElement.y) /
|
||||||
Math.max(hoveredElement.height, PRECISION),
|
hoveredElement.height,
|
||||||
]),
|
]),
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
@@ -1976,11 +1976,9 @@ export const calculateFixedPointForNonElbowArrowBinding = (
|
|||||||
|
|
||||||
// Calculate the ratio relative to the element's bounds
|
// Calculate the ratio relative to the element's bounds
|
||||||
const fixedPointX =
|
const fixedPointX =
|
||||||
(nonRotatedPoint[0] - hoveredElement.x) /
|
(nonRotatedPoint[0] - hoveredElement.x) / hoveredElement.width;
|
||||||
Math.max(hoveredElement.width, PRECISION);
|
|
||||||
const fixedPointY =
|
const fixedPointY =
|
||||||
(nonRotatedPoint[1] - hoveredElement.y) /
|
(nonRotatedPoint[1] - hoveredElement.y) / hoveredElement.height;
|
||||||
Math.max(hoveredElement.height, PRECISION);
|
|
||||||
|
|
||||||
return {
|
return {
|
||||||
fixedPoint: normalizeFixedPoint([fixedPointX, fixedPointY]),
|
fixedPoint: normalizeFixedPoint([fixedPointX, fixedPointY]),
|
||||||
|
|||||||
@@ -680,9 +680,8 @@ export const getMinMaxXYFromCurvePathOps = (
|
|||||||
return [minX, minY, maxX, maxY];
|
return [minX, minY, maxX, maxY];
|
||||||
};
|
};
|
||||||
|
|
||||||
export const getBoundsFromPoints = <P extends GlobalPoint | LocalPoint>(
|
export const getBoundsFromPoints = (
|
||||||
points: readonly P[],
|
points: ExcalidrawFreeDrawElement["points"],
|
||||||
padding: number = 0,
|
|
||||||
): Bounds => {
|
): Bounds => {
|
||||||
let minX = Infinity;
|
let minX = Infinity;
|
||||||
let minY = Infinity;
|
let minY = Infinity;
|
||||||
@@ -696,7 +695,7 @@ export const getBoundsFromPoints = <P extends GlobalPoint | LocalPoint>(
|
|||||||
maxY = Math.max(maxY, y);
|
maxY = Math.max(maxY, y);
|
||||||
}
|
}
|
||||||
|
|
||||||
return [minX - padding, minY - padding, maxX + padding, maxY + padding];
|
return [minX, minY, maxX, maxY];
|
||||||
};
|
};
|
||||||
|
|
||||||
const getFreeDrawElementAbsoluteCoords = (
|
const getFreeDrawElementAbsoluteCoords = (
|
||||||
@@ -1262,17 +1261,6 @@ export const pointInsideBounds = <P extends GlobalPoint | LocalPoint>(
|
|||||||
): boolean =>
|
): boolean =>
|
||||||
p[0] > bounds[0] && p[0] < bounds[2] && p[1] > bounds[1] && p[1] < bounds[3];
|
p[0] > bounds[0] && p[0] < bounds[2] && p[1] > bounds[1] && p[1] < bounds[3];
|
||||||
|
|
||||||
// TODO make pointInsideBounds inclusive and remove this function once we
|
|
||||||
// test nothing is breaking
|
|
||||||
export const pointInsideBoundsInclusive = <P extends GlobalPoint | LocalPoint>(
|
|
||||||
p: P,
|
|
||||||
bounds: Bounds,
|
|
||||||
): boolean =>
|
|
||||||
p[0] >= bounds[0] &&
|
|
||||||
p[0] <= bounds[2] &&
|
|
||||||
p[1] >= bounds[1] &&
|
|
||||||
p[1] <= bounds[3];
|
|
||||||
|
|
||||||
export const doBoundsIntersect = (
|
export const doBoundsIntersect = (
|
||||||
bounds1: Bounds | null,
|
bounds1: Bounds | null,
|
||||||
bounds2: Bounds | null,
|
bounds2: Bounds | null,
|
||||||
@@ -1287,21 +1275,13 @@ export const doBoundsIntersect = (
|
|||||||
return minX1 < maxX2 && maxX1 > minX2 && minY1 < maxY2 && maxY1 > minY2;
|
return minX1 < maxX2 && maxX1 > minX2 && minY1 < maxY2 && maxY1 > minY2;
|
||||||
};
|
};
|
||||||
|
|
||||||
export const boundsContainBounds = (outerBounds: Bounds, innerBounds: Bounds) =>
|
|
||||||
[
|
|
||||||
pointFrom<GlobalPoint>(innerBounds[0], innerBounds[1]),
|
|
||||||
pointFrom<GlobalPoint>(innerBounds[0], innerBounds[3]),
|
|
||||||
pointFrom<GlobalPoint>(innerBounds[2], innerBounds[1]),
|
|
||||||
pointFrom<GlobalPoint>(innerBounds[2], innerBounds[3]),
|
|
||||||
].every((point) => pointInsideBoundsInclusive(point, outerBounds));
|
|
||||||
|
|
||||||
export const elementCenterPoint = (
|
export const elementCenterPoint = (
|
||||||
element: ExcalidrawElement,
|
element: ExcalidrawElement,
|
||||||
elementsMap: ElementsMap,
|
elementsMap: ElementsMap,
|
||||||
xOffset: number = 0,
|
xOffset: number = 0,
|
||||||
yOffset: number = 0,
|
yOffset: number = 0,
|
||||||
) => {
|
) => {
|
||||||
if (isLinearElement(element) || isFreeDrawElement(element)) {
|
if (isLinearElement(element)) {
|
||||||
const [x1, y1, x2, y2] = getElementAbsoluteCoords(element, elementsMap);
|
const [x1, y1, x2, y2] = getElementAbsoluteCoords(element, elementsMap);
|
||||||
const [x, y] = pointFrom<GlobalPoint>((x1 + x2) / 2, (y1 + y2) / 2);
|
const [x, y] = pointFrom<GlobalPoint>((x1 + x2) / 2, (y1 + y2) / 2);
|
||||||
|
|
||||||
|
|||||||
@@ -154,11 +154,14 @@ export const hitElementItself = ({
|
|||||||
|
|
||||||
// Hit test against the extended, rotated bounding box of the element first
|
// Hit test against the extended, rotated bounding box of the element first
|
||||||
const bounds = getElementBounds(element, elementsMap, true);
|
const bounds = getElementBounds(element, elementsMap, true);
|
||||||
const hitBounds = isPointInRotatedBounds(
|
const hitBounds = isPointWithinBounds(
|
||||||
point,
|
pointFrom(bounds[0] - threshold, bounds[1] - threshold),
|
||||||
bounds,
|
pointRotateRads(
|
||||||
element.angle,
|
point,
|
||||||
threshold,
|
getCenterForBounds(bounds),
|
||||||
|
-element.angle as Radians,
|
||||||
|
),
|
||||||
|
pointFrom(bounds[2] + threshold, bounds[3] + threshold),
|
||||||
);
|
);
|
||||||
|
|
||||||
// PERF: Bail out early if the point is not even in the
|
// PERF: Bail out early if the point is not even in the
|
||||||
@@ -189,32 +192,18 @@ export const hitElementItself = ({
|
|||||||
return result;
|
return result;
|
||||||
};
|
};
|
||||||
|
|
||||||
const isPointInRotatedBounds = (
|
|
||||||
point: GlobalPoint,
|
|
||||||
bounds: Bounds,
|
|
||||||
angle: Radians,
|
|
||||||
tolerance = 0,
|
|
||||||
) => {
|
|
||||||
const adjustedPoint =
|
|
||||||
angle === 0
|
|
||||||
? point
|
|
||||||
: pointRotateRads(point, getCenterForBounds(bounds), -angle as Radians);
|
|
||||||
|
|
||||||
return isPointWithinBounds(
|
|
||||||
pointFrom(bounds[0] - tolerance, bounds[1] - tolerance),
|
|
||||||
adjustedPoint,
|
|
||||||
pointFrom(bounds[2] + tolerance, bounds[3] + tolerance),
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
export const hitElementBoundingBox = (
|
export const hitElementBoundingBox = (
|
||||||
point: GlobalPoint,
|
point: GlobalPoint,
|
||||||
element: ExcalidrawElement,
|
element: ExcalidrawElement,
|
||||||
elementsMap: ElementsMap,
|
elementsMap: ElementsMap,
|
||||||
tolerance = 0,
|
tolerance = 0,
|
||||||
) => {
|
) => {
|
||||||
const bounds = getElementBounds(element, elementsMap, true);
|
let [x1, y1, x2, y2] = getElementBounds(element, elementsMap);
|
||||||
return isPointInRotatedBounds(point, bounds, element.angle, tolerance);
|
x1 -= tolerance;
|
||||||
|
y1 -= tolerance;
|
||||||
|
x2 += tolerance;
|
||||||
|
y2 += tolerance;
|
||||||
|
return isPointWithinBounds(pointFrom(x1, y1), point, pointFrom(x2, y2));
|
||||||
};
|
};
|
||||||
|
|
||||||
export const hitElementBoundingBoxOnly = (
|
export const hitElementBoundingBoxOnly = (
|
||||||
@@ -584,9 +573,7 @@ const intersectLinearOrFreeDrawWithLineSegment = (
|
|||||||
continue;
|
continue;
|
||||||
}
|
}
|
||||||
|
|
||||||
const hits = curveIntersectLineSegment(c, segment, {
|
const hits = curveIntersectLineSegment(c, segment);
|
||||||
iterLimit: 10,
|
|
||||||
});
|
|
||||||
|
|
||||||
if (hits.length > 0) {
|
if (hits.length > 0) {
|
||||||
intersections.push(...hits);
|
intersections.push(...hits);
|
||||||
|
|||||||
@@ -2124,8 +2124,8 @@ const normalizeArrowElementUpdate = (
|
|||||||
offsetY < -MAX_POS ||
|
offsetY < -MAX_POS ||
|
||||||
offsetY > MAX_POS ||
|
offsetY > MAX_POS ||
|
||||||
offsetX + points[points.length - 1][0] < -MAX_POS ||
|
offsetX + points[points.length - 1][0] < -MAX_POS ||
|
||||||
offsetX + points[points.length - 1][0] > MAX_POS ||
|
offsetY + points[points.length - 1][0] > MAX_POS ||
|
||||||
offsetY + points[points.length - 1][1] < -MAX_POS ||
|
offsetX + points[points.length - 1][1] < -MAX_POS ||
|
||||||
offsetY + points[points.length - 1][1] > MAX_POS
|
offsetY + points[points.length - 1][1] > MAX_POS
|
||||||
) {
|
) {
|
||||||
console.error(
|
console.error(
|
||||||
|
|||||||
@@ -1,6 +1,7 @@
|
|||||||
import { arrayToMap } from "@excalidraw/common";
|
import { arrayToMap } from "@excalidraw/common";
|
||||||
import { isPointWithinBounds, pointFrom } from "@excalidraw/math";
|
import { isPointWithinBounds, pointFrom } from "@excalidraw/math";
|
||||||
import { doLineSegmentsIntersect } from "@excalidraw/utils/bbox";
|
import { doLineSegmentsIntersect } from "@excalidraw/utils/bbox";
|
||||||
|
import { elementsOverlappingBBox } from "@excalidraw/utils/withinBounds";
|
||||||
|
|
||||||
import type {
|
import type {
|
||||||
AppClassProperties,
|
AppClassProperties,
|
||||||
@@ -17,8 +18,6 @@ import {
|
|||||||
getElementLineSegments,
|
getElementLineSegments,
|
||||||
getCommonBounds,
|
getCommonBounds,
|
||||||
getElementAbsoluteCoords,
|
getElementAbsoluteCoords,
|
||||||
doBoundsIntersect,
|
|
||||||
getElementBounds,
|
|
||||||
} from "./bounds";
|
} from "./bounds";
|
||||||
import { mutateElement } from "./mutateElement";
|
import { mutateElement } from "./mutateElement";
|
||||||
import { getBoundTextElement, getContainerElement } from "./textElement";
|
import { getBoundTextElement, getContainerElement } from "./textElement";
|
||||||
@@ -921,17 +920,16 @@ export const getFrameLikeTitle = (element: ExcalidrawFrameLikeElement) => {
|
|||||||
export const getElementsOverlappingFrame = (
|
export const getElementsOverlappingFrame = (
|
||||||
elements: readonly ExcalidrawElement[],
|
elements: readonly ExcalidrawElement[],
|
||||||
frame: ExcalidrawFrameLikeElement,
|
frame: ExcalidrawFrameLikeElement,
|
||||||
elementsMap: ElementsMap,
|
|
||||||
) => {
|
) => {
|
||||||
return elements.filter(
|
return (
|
||||||
(el) =>
|
elementsOverlappingBBox({
|
||||||
// exclude elements which are overlapping, but are in a different frame,
|
elements,
|
||||||
|
bounds: frame,
|
||||||
|
type: "overlap",
|
||||||
|
})
|
||||||
|
// removes elements who are overlapping, but are in a different frame,
|
||||||
// and thus invisible in target frame
|
// and thus invisible in target frame
|
||||||
(!el.frameId || el.frameId === frame.id) &&
|
.filter((el) => !el.frameId || el.frameId === frame.id)
|
||||||
doBoundsIntersect(
|
|
||||||
getElementBounds(el, elementsMap),
|
|
||||||
getElementBounds(frame, elementsMap),
|
|
||||||
),
|
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|||||||
@@ -1,32 +1,15 @@
|
|||||||
import { arrayToMap, isShallowEqual, type Bounds } from "@excalidraw/common";
|
import { arrayToMap, isShallowEqual } from "@excalidraw/common";
|
||||||
import {
|
|
||||||
lineSegment,
|
|
||||||
pointFrom,
|
|
||||||
pointRotateRads,
|
|
||||||
type GlobalPoint,
|
|
||||||
} from "@excalidraw/math";
|
|
||||||
|
|
||||||
import type {
|
import type {
|
||||||
AppState,
|
AppState,
|
||||||
BoxSelectionMode,
|
|
||||||
InteractiveCanvasAppState,
|
InteractiveCanvasAppState,
|
||||||
} from "@excalidraw/excalidraw/types";
|
} from "@excalidraw/excalidraw/types";
|
||||||
|
|
||||||
import {
|
import { getElementAbsoluteCoords, getElementBounds } from "./bounds";
|
||||||
boundsContainBounds,
|
|
||||||
doBoundsIntersect,
|
|
||||||
elementCenterPoint,
|
|
||||||
getElementAbsoluteCoords,
|
|
||||||
getElementBounds,
|
|
||||||
pointInsideBounds,
|
|
||||||
} from "./bounds";
|
|
||||||
import { intersectElementWithLineSegment } from "./collision";
|
|
||||||
import { isElementInViewport } from "./sizeHelpers";
|
import { isElementInViewport } from "./sizeHelpers";
|
||||||
import {
|
import {
|
||||||
isArrowElement,
|
|
||||||
isBoundToContainer,
|
isBoundToContainer,
|
||||||
isFrameLikeElement,
|
isFrameLikeElement,
|
||||||
isFreeDrawElement,
|
|
||||||
isLinearElement,
|
isLinearElement,
|
||||||
isTextElement,
|
isTextElement,
|
||||||
} from "./typeChecks";
|
} from "./typeChecks";
|
||||||
@@ -34,38 +17,19 @@ import {
|
|||||||
elementOverlapsWithFrame,
|
elementOverlapsWithFrame,
|
||||||
getContainingFrame,
|
getContainingFrame,
|
||||||
getFrameChildren,
|
getFrameChildren,
|
||||||
isElementIntersectingFrame,
|
|
||||||
} from "./frame";
|
} from "./frame";
|
||||||
|
|
||||||
import { LinearElementEditor } from "./linearElementEditor";
|
import { LinearElementEditor } from "./linearElementEditor";
|
||||||
import { selectGroupsForSelectedElements } from "./groups";
|
import { selectGroupsForSelectedElements } from "./groups";
|
||||||
import { getBoundTextElement } from "./textElement";
|
|
||||||
|
|
||||||
import type {
|
import type {
|
||||||
ElementsMap,
|
ElementsMap,
|
||||||
ElementsMapOrArray,
|
ElementsMapOrArray,
|
||||||
ExcalidrawElement,
|
ExcalidrawElement,
|
||||||
ExcalidrawFrameLikeElement,
|
|
||||||
NonDeleted,
|
NonDeleted,
|
||||||
NonDeletedExcalidrawElement,
|
NonDeletedExcalidrawElement,
|
||||||
} from "./types";
|
} from "./types";
|
||||||
|
|
||||||
const shouldIgnoreElementFromSelection = (
|
|
||||||
element: NonDeletedExcalidrawElement,
|
|
||||||
) => element.locked || isBoundToContainer(element);
|
|
||||||
|
|
||||||
const excludeElementsFromFrames = <T extends ExcalidrawElement>(
|
|
||||||
selectedElements: readonly T[],
|
|
||||||
framesInSelection: Set<ExcalidrawFrameLikeElement["id"]>,
|
|
||||||
) => {
|
|
||||||
return selectedElements.filter((element) => {
|
|
||||||
if (element.frameId && framesInSelection.has(element.frameId)) {
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
return true;
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Frames and their containing elements are not to be selected at the same time.
|
* Frames and their containing elements are not to be selected at the same time.
|
||||||
* Given an array of selected elements, if there are frames and their containing elements
|
* Given an array of selected elements, if there are frames and their containing elements
|
||||||
@@ -85,243 +49,55 @@ export const excludeElementsInFramesFromSelection = <
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
return excludeElementsFromFrames(selectedElements, framesInSelection);
|
return selectedElements.filter((element) => {
|
||||||
|
if (element.frameId && framesInSelection.has(element.frameId)) {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
return true;
|
||||||
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
export const getElementsWithinSelection = (
|
export const getElementsWithinSelection = (
|
||||||
elements: readonly NonDeletedExcalidrawElement[],
|
elements: readonly NonDeletedExcalidrawElement[],
|
||||||
selection: NonDeletedExcalidrawElement,
|
selection: NonDeletedExcalidrawElement,
|
||||||
elementsMap: ElementsMap,
|
elementsMap: ElementsMap,
|
||||||
// TODO remove (this flag is effectively unused AFAIK)
|
|
||||||
excludeElementsInFrames: boolean = true,
|
excludeElementsInFrames: boolean = true,
|
||||||
boxSelectionMode: BoxSelectionMode = "contain",
|
) => {
|
||||||
): NonDeletedExcalidrawElement[] => {
|
const [selectionX1, selectionY1, selectionX2, selectionY2] =
|
||||||
const [selectionStartX, selectionStartY, selectionEndX, selectionEndY] =
|
|
||||||
getElementAbsoluteCoords(selection, elementsMap);
|
getElementAbsoluteCoords(selection, elementsMap);
|
||||||
const selectionX1 = Math.min(selectionStartX, selectionEndX);
|
|
||||||
const selectionY1 = Math.min(selectionStartY, selectionEndY);
|
|
||||||
const selectionX2 = Math.max(selectionStartX, selectionEndX);
|
|
||||||
const selectionY2 = Math.max(selectionStartY, selectionEndY);
|
|
||||||
const selectionBounds = [
|
|
||||||
selectionX1,
|
|
||||||
selectionY1,
|
|
||||||
selectionX2,
|
|
||||||
selectionY2,
|
|
||||||
] as Bounds;
|
|
||||||
const selectionEdges = [
|
|
||||||
lineSegment<GlobalPoint>(
|
|
||||||
pointFrom(selectionX1, selectionY1),
|
|
||||||
pointFrom(selectionX2, selectionY1),
|
|
||||||
),
|
|
||||||
lineSegment<GlobalPoint>(
|
|
||||||
pointFrom(selectionX2, selectionY1),
|
|
||||||
pointFrom(selectionX2, selectionY2),
|
|
||||||
),
|
|
||||||
lineSegment<GlobalPoint>(
|
|
||||||
pointFrom(selectionX2, selectionY2),
|
|
||||||
pointFrom(selectionX1, selectionY2),
|
|
||||||
),
|
|
||||||
lineSegment<GlobalPoint>(
|
|
||||||
pointFrom(selectionX1, selectionY2),
|
|
||||||
pointFrom(selectionX1, selectionY1),
|
|
||||||
),
|
|
||||||
];
|
|
||||||
|
|
||||||
const framesInSelection = excludeElementsInFrames
|
let elementsInSelection = elements.filter((element) => {
|
||||||
? new Set<NonDeletedExcalidrawElement["id"]>()
|
let [elementX1, elementY1, elementX2, elementY2] = getElementBounds(
|
||||||
: null;
|
element,
|
||||||
let elementsInSelection: NonDeletedExcalidrawElement[] = [];
|
elementsMap,
|
||||||
|
);
|
||||||
|
|
||||||
for (const element of elements) {
|
const containingFrame = getContainingFrame(element, elementsMap);
|
||||||
if (shouldIgnoreElementFromSelection(element)) {
|
if (containingFrame) {
|
||||||
continue;
|
const [fx1, fy1, fx2, fy2] = getElementBounds(
|
||||||
}
|
containingFrame,
|
||||||
|
|
||||||
const strokeWidth = element.strokeWidth;
|
|
||||||
let labelAABB: Bounds | null = null;
|
|
||||||
let elementAABB = getElementBounds(element, elementsMap);
|
|
||||||
|
|
||||||
elementAABB = [
|
|
||||||
elementAABB[0] - strokeWidth / 2,
|
|
||||||
elementAABB[1] - strokeWidth / 2,
|
|
||||||
elementAABB[2] + strokeWidth / 2,
|
|
||||||
elementAABB[3] + strokeWidth / 2,
|
|
||||||
] as Bounds;
|
|
||||||
|
|
||||||
// Whether the element bounds should include the bound text element bounds
|
|
||||||
const boundTextElement =
|
|
||||||
isArrowElement(element) && getBoundTextElement(element, elementsMap);
|
|
||||||
if (boundTextElement) {
|
|
||||||
const { x, y } = LinearElementEditor.getBoundTextElementPosition(
|
|
||||||
element,
|
|
||||||
boundTextElement,
|
|
||||||
elementsMap,
|
elementsMap,
|
||||||
);
|
);
|
||||||
labelAABB = [
|
|
||||||
x,
|
elementX1 = Math.max(fx1, elementX1);
|
||||||
y,
|
elementY1 = Math.max(fy1, elementY1);
|
||||||
x + boundTextElement.width,
|
elementX2 = Math.min(fx2, elementX2);
|
||||||
y + boundTextElement.height,
|
elementY2 = Math.min(fy2, elementY2);
|
||||||
] as Bounds;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// Clip element bounds by its containing frame (if any), since only the
|
return (
|
||||||
// visible (frame-clipped) portion of the element is relevant for selection.
|
element.locked === false &&
|
||||||
const associatedFrame = getContainingFrame(element, elementsMap);
|
element.type !== "selection" &&
|
||||||
if (
|
!isBoundToContainer(element) &&
|
||||||
associatedFrame &&
|
selectionX1 <= elementX1 &&
|
||||||
isElementIntersectingFrame(element, associatedFrame, elementsMap)
|
selectionY1 <= elementY1 &&
|
||||||
) {
|
selectionX2 >= elementX2 &&
|
||||||
const frameAABB = getElementBounds(associatedFrame, elementsMap);
|
selectionY2 >= elementY2
|
||||||
elementAABB = [
|
);
|
||||||
Math.max(elementAABB[0], frameAABB[0]),
|
});
|
||||||
Math.max(elementAABB[1], frameAABB[1]),
|
|
||||||
Math.min(elementAABB[2], frameAABB[2]),
|
|
||||||
Math.min(elementAABB[3], frameAABB[3]),
|
|
||||||
] as Bounds;
|
|
||||||
|
|
||||||
labelAABB = labelAABB
|
elementsInSelection = excludeElementsInFrames
|
||||||
? ([
|
? excludeElementsInFramesFromSelection(elementsInSelection)
|
||||||
Math.max(labelAABB[0], frameAABB[0]),
|
|
||||||
Math.max(labelAABB[1], frameAABB[1]),
|
|
||||||
Math.min(labelAABB[2], frameAABB[2]),
|
|
||||||
Math.min(labelAABB[3], frameAABB[3]),
|
|
||||||
] as Bounds)
|
|
||||||
: null;
|
|
||||||
}
|
|
||||||
|
|
||||||
const commonAABB = labelAABB
|
|
||||||
? ([
|
|
||||||
Math.min(labelAABB[0], elementAABB[0]),
|
|
||||||
Math.min(labelAABB[1], elementAABB[1]),
|
|
||||||
Math.max(labelAABB[2], elementAABB[2]),
|
|
||||||
Math.max(labelAABB[3], elementAABB[3]),
|
|
||||||
] as Bounds)
|
|
||||||
: elementAABB;
|
|
||||||
|
|
||||||
// ============== Evaluation ==============
|
|
||||||
|
|
||||||
// 1. If the selection box WRAPs the element's AABB, then add it to the
|
|
||||||
// selection and move on, regardless of the selection mode.
|
|
||||||
//
|
|
||||||
// PERF: This trick only works with axis-aligned box selection and the
|
|
||||||
// current convex element shapes!
|
|
||||||
if (boundsContainBounds(selectionBounds, commonAABB)) {
|
|
||||||
if (framesInSelection && isFrameLikeElement(element)) {
|
|
||||||
framesInSelection.add(element.id);
|
|
||||||
} else {
|
|
||||||
elementsInSelection.push(element);
|
|
||||||
continue;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// 2. Handle the case where the label is overlapped by the selection box
|
|
||||||
if (
|
|
||||||
boxSelectionMode === "overlap" &&
|
|
||||||
labelAABB &&
|
|
||||||
doBoundsIntersect(selectionBounds, labelAABB)
|
|
||||||
) {
|
|
||||||
elementsInSelection.push(element);
|
|
||||||
continue;
|
|
||||||
}
|
|
||||||
|
|
||||||
// 3. Handle the case where the selection is not wrapping the element, but
|
|
||||||
// it does intersect the element's outline (non-AABB).
|
|
||||||
if (
|
|
||||||
boxSelectionMode === "overlap" &&
|
|
||||||
doBoundsIntersect(selectionBounds, elementAABB)
|
|
||||||
) {
|
|
||||||
let hasIntersection = false;
|
|
||||||
|
|
||||||
// Preliminary check potential intersection imprecision
|
|
||||||
if (isLinearElement(element) || isFreeDrawElement(element)) {
|
|
||||||
const center = elementCenterPoint(element, elementsMap);
|
|
||||||
hasIntersection = element.points.some((point) => {
|
|
||||||
const rotatedPoint = pointRotateRads(
|
|
||||||
pointFrom<GlobalPoint>(element.x + point[0], element.y + point[1]),
|
|
||||||
center,
|
|
||||||
element.angle,
|
|
||||||
);
|
|
||||||
|
|
||||||
return pointInsideBounds(rotatedPoint, selectionBounds);
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
const nonRotatedElementBounds = getElementBounds(
|
|
||||||
element,
|
|
||||||
elementsMap,
|
|
||||||
true,
|
|
||||||
);
|
|
||||||
const center = elementCenterPoint(element, elementsMap);
|
|
||||||
hasIntersection = [
|
|
||||||
pointRotateRads(
|
|
||||||
pointFrom<GlobalPoint>(
|
|
||||||
(nonRotatedElementBounds[0] + nonRotatedElementBounds[2]) / 2,
|
|
||||||
nonRotatedElementBounds[1],
|
|
||||||
),
|
|
||||||
center,
|
|
||||||
element.angle,
|
|
||||||
),
|
|
||||||
pointRotateRads(
|
|
||||||
pointFrom<GlobalPoint>(
|
|
||||||
nonRotatedElementBounds[2],
|
|
||||||
(nonRotatedElementBounds[1] + nonRotatedElementBounds[3]) / 2,
|
|
||||||
),
|
|
||||||
center,
|
|
||||||
element.angle,
|
|
||||||
),
|
|
||||||
pointRotateRads(
|
|
||||||
pointFrom<GlobalPoint>(
|
|
||||||
(nonRotatedElementBounds[0] + nonRotatedElementBounds[2]) / 2,
|
|
||||||
nonRotatedElementBounds[3],
|
|
||||||
),
|
|
||||||
center,
|
|
||||||
element.angle,
|
|
||||||
),
|
|
||||||
pointRotateRads(
|
|
||||||
pointFrom<GlobalPoint>(
|
|
||||||
nonRotatedElementBounds[0],
|
|
||||||
(nonRotatedElementBounds[1] + nonRotatedElementBounds[3]) / 2,
|
|
||||||
),
|
|
||||||
center,
|
|
||||||
element.angle,
|
|
||||||
),
|
|
||||||
].some((point) => {
|
|
||||||
return pointInsideBounds(
|
|
||||||
pointRotateRads(point, center, element.angle),
|
|
||||||
selectionBounds,
|
|
||||||
);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!hasIntersection) {
|
|
||||||
hasIntersection = selectionEdges.some(
|
|
||||||
(selectionEdge) =>
|
|
||||||
intersectElementWithLineSegment(
|
|
||||||
element,
|
|
||||||
elementsMap,
|
|
||||||
selectionEdge,
|
|
||||||
strokeWidth / 2,
|
|
||||||
true, // Stop at first hit for better performance
|
|
||||||
).length > 0,
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
if (hasIntersection) {
|
|
||||||
if (framesInSelection && isFrameLikeElement(element)) {
|
|
||||||
framesInSelection.add(element.id);
|
|
||||||
}
|
|
||||||
|
|
||||||
elementsInSelection.push(element);
|
|
||||||
continue;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// 4. We don't need to handle when the selection is inside the element
|
|
||||||
// as it is separately handled in App.
|
|
||||||
}
|
|
||||||
|
|
||||||
elementsInSelection = framesInSelection
|
|
||||||
? excludeElementsFromFrames(elementsInSelection, framesInSelection)
|
|
||||||
: elementsInSelection;
|
: elementsInSelection;
|
||||||
|
|
||||||
elementsInSelection = elementsInSelection.filter((element) => {
|
elementsInSelection = elementsInSelection.filter((element) => {
|
||||||
|
|||||||
@@ -1,8 +1,7 @@
|
|||||||
import { arrayToMap, reseed } from "@excalidraw/common";
|
import { arrayToMap, ROUNDNESS } from "@excalidraw/common";
|
||||||
import { type GlobalPoint, type LocalPoint, pointFrom } from "@excalidraw/math";
|
import { type GlobalPoint, type LocalPoint, pointFrom } from "@excalidraw/math";
|
||||||
import { Excalidraw } from "@excalidraw/excalidraw";
|
import { Excalidraw } from "@excalidraw/excalidraw";
|
||||||
import { API } from "@excalidraw/excalidraw/tests/helpers/api";
|
import { API } from "@excalidraw/excalidraw/tests/helpers/api";
|
||||||
import { UI } from "@excalidraw/excalidraw/tests/helpers/ui";
|
|
||||||
import "@excalidraw/utils/test-utils";
|
import "@excalidraw/utils/test-utils";
|
||||||
import { render } from "@excalidraw/excalidraw/tests/test-utils";
|
import { render } from "@excalidraw/excalidraw/tests/test-utils";
|
||||||
|
|
||||||
@@ -10,30 +9,29 @@ import * as distance from "../src/distance";
|
|||||||
import { hitElementItself } from "../src/collision";
|
import { hitElementItself } from "../src/collision";
|
||||||
|
|
||||||
describe("check rotated elements can be hit:", () => {
|
describe("check rotated elements can be hit:", () => {
|
||||||
beforeEach(async () => {
|
|
||||||
localStorage.clear();
|
|
||||||
reseed(7);
|
|
||||||
await render(<Excalidraw handleKeyboardGlobally={true} />);
|
|
||||||
});
|
|
||||||
|
|
||||||
it("arrow", () => {
|
it("arrow", () => {
|
||||||
UI.createElement("arrow", {
|
const element = API.createElement({
|
||||||
|
type: "arrow",
|
||||||
x: 0,
|
x: 0,
|
||||||
y: 0,
|
y: 0,
|
||||||
width: 124,
|
width: 124,
|
||||||
height: 302,
|
height: 302,
|
||||||
angle: 1.8700426423973724,
|
angle: 1.8700426423973724,
|
||||||
|
roundness: { type: ROUNDNESS.PROPORTIONAL_RADIUS },
|
||||||
|
endArrowhead: "arrow",
|
||||||
points: [
|
points: [
|
||||||
[0, 0],
|
[0, 0],
|
||||||
[120, -198],
|
[120, -198],
|
||||||
[-4, -302],
|
[-4, -302],
|
||||||
] as LocalPoint[],
|
] as LocalPoint[],
|
||||||
});
|
});
|
||||||
|
const elementsMap = arrayToMap([element]);
|
||||||
|
|
||||||
const hit = hitElementItself({
|
const hit = hitElementItself({
|
||||||
point: pointFrom<GlobalPoint>(88, -68),
|
point: pointFrom<GlobalPoint>(88, -68),
|
||||||
element: window.h.elements[0],
|
element,
|
||||||
threshold: 10,
|
threshold: 10,
|
||||||
elementsMap: window.h.scene.getNonDeletedElementsMap(),
|
elementsMap,
|
||||||
});
|
});
|
||||||
expect(hit).toBe(true);
|
expect(hit).toBe(true);
|
||||||
});
|
});
|
||||||
@@ -57,7 +55,6 @@ describe("hitElementItself cache", () => {
|
|||||||
});
|
});
|
||||||
|
|
||||||
localStorage.clear();
|
localStorage.clear();
|
||||||
reseed(7);
|
|
||||||
await render(<Excalidraw handleKeyboardGlobally={true} />);
|
await render(<Excalidraw handleKeyboardGlobally={true} />);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
@@ -128,7 +128,6 @@ export const getDefaultAppState = (): Omit<
|
|||||||
lockedMultiSelections: {},
|
lockedMultiSelections: {},
|
||||||
activeLockedId: null,
|
activeLockedId: null,
|
||||||
bindMode: "orbit",
|
bindMode: "orbit",
|
||||||
boxSelectionMode: "contain",
|
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
|
||||||
@@ -194,7 +193,6 @@ const APP_STATE_STORAGE_CONF = (<
|
|||||||
gridModeEnabled: { browser: true, export: true, server: true },
|
gridModeEnabled: { browser: true, export: true, server: true },
|
||||||
height: { browser: false, export: false, server: false },
|
height: { browser: false, export: false, server: false },
|
||||||
isBindingEnabled: { browser: true, export: false, server: false },
|
isBindingEnabled: { browser: true, export: false, server: false },
|
||||||
boxSelectionMode: { browser: true, export: false, server: false },
|
|
||||||
bindingPreference: { browser: true, export: false, server: false },
|
bindingPreference: { browser: true, export: false, server: false },
|
||||||
isMidpointSnappingEnabled: { browser: true, export: false, server: false },
|
isMidpointSnappingEnabled: { browser: true, export: false, server: false },
|
||||||
defaultSidebarDockedPreference: {
|
defaultSidebarDockedPreference: {
|
||||||
|
|||||||
@@ -27,7 +27,6 @@ import {
|
|||||||
KEYS,
|
KEYS,
|
||||||
APP_NAME,
|
APP_NAME,
|
||||||
CURSOR_TYPE,
|
CURSOR_TYPE,
|
||||||
DEFAULT_TRANSFORM_HANDLE_SPACING,
|
|
||||||
DEFAULT_MAX_IMAGE_WIDTH_OR_HEIGHT,
|
DEFAULT_MAX_IMAGE_WIDTH_OR_HEIGHT,
|
||||||
DEFAULT_VERTICAL_ALIGN,
|
DEFAULT_VERTICAL_ALIGN,
|
||||||
DRAGGING_THRESHOLD,
|
DRAGGING_THRESHOLD,
|
||||||
@@ -603,55 +602,6 @@ const YOUTUBE_VIDEO_STATES = new Map<
|
|||||||
ValueOf<typeof YOUTUBE_STATES>
|
ValueOf<typeof YOUTUBE_STATES>
|
||||||
>();
|
>();
|
||||||
|
|
||||||
const isGoogleDrivePreviewLink = (link: string | null | undefined) => {
|
|
||||||
if (!link) {
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
|
|
||||||
try {
|
|
||||||
const url = new URL(link);
|
|
||||||
return (
|
|
||||||
url.hostname === "drive.google.com" &&
|
|
||||||
/^\/file\/d\/[^/]+\/preview\/?$/.test(url.pathname)
|
|
||||||
);
|
|
||||||
} catch {
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
const isGoogleDriveEmbeddableElement = (
|
|
||||||
element: ExcalidrawElement | null | undefined,
|
|
||||||
) => {
|
|
||||||
if (!isEmbeddableElement(element)) {
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
|
|
||||||
const embedLink = getEmbedLink(toValidURL(element.link || ""));
|
|
||||||
return (
|
|
||||||
embedLink?.type === "video" && isGoogleDrivePreviewLink(embedLink.link)
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
const EMBEDDABLE_CANVAS_GUARD_CLASS = "excalidraw__embeddable-canvas-guard";
|
|
||||||
const EMBEDDABLE_CANVAS_GUARDS = [
|
|
||||||
{
|
|
||||||
key: "top",
|
|
||||||
style: { top: 0, left: 0, right: 0, height: "33.333%" },
|
|
||||||
},
|
|
||||||
{
|
|
||||||
key: "bottom",
|
|
||||||
style: { bottom: 0, left: 0, right: 0, height: "33.333%" },
|
|
||||||
},
|
|
||||||
{
|
|
||||||
key: "left",
|
|
||||||
style: { top: "33.333%", bottom: "33.333%", left: 0, width: "33.333%" },
|
|
||||||
},
|
|
||||||
{
|
|
||||||
key: "right",
|
|
||||||
style: { top: "33.333%", bottom: "33.333%", right: 0, width: "33.333%" },
|
|
||||||
},
|
|
||||||
] as const;
|
|
||||||
|
|
||||||
let IS_PLAIN_PASTE = false;
|
let IS_PLAIN_PASTE = false;
|
||||||
let IS_PLAIN_PASTE_TIMER = 0;
|
let IS_PLAIN_PASTE_TIMER = 0;
|
||||||
let PLAIN_PASTE_TOAST_SHOWN = false;
|
let PLAIN_PASTE_TOAST_SHOWN = false;
|
||||||
@@ -1332,46 +1282,6 @@ class App extends React.Component<AppProps, AppState> {
|
|||||||
return this.iFrameRefs.get(element.id);
|
return this.iFrameRefs.get(element.id);
|
||||||
}
|
}
|
||||||
|
|
||||||
private deactivateActiveEmbeddable = () => {
|
|
||||||
if (this.state.activeEmbeddable) {
|
|
||||||
flushSync(() => {
|
|
||||||
this.setState({ activeEmbeddable: null });
|
|
||||||
});
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
private handleEmbeddableCanvasGuardPointerDown = (
|
|
||||||
event: React.PointerEvent<HTMLDivElement>,
|
|
||||||
) => {
|
|
||||||
this.deactivateActiveEmbeddable();
|
|
||||||
this.handleCanvasPointerDown(event);
|
|
||||||
};
|
|
||||||
|
|
||||||
private handleEmbeddableCanvasGuardPointerMove = (
|
|
||||||
event: React.PointerEvent<HTMLDivElement>,
|
|
||||||
) => {
|
|
||||||
this.lastViewportPosition.x = event.clientX;
|
|
||||||
this.lastViewportPosition.y = event.clientY;
|
|
||||||
this.deactivateActiveEmbeddable();
|
|
||||||
};
|
|
||||||
|
|
||||||
private handleEmbeddableCanvasGuardTouchStart = (
|
|
||||||
event: React.TouchEvent<HTMLDivElement>,
|
|
||||||
) => {
|
|
||||||
if (event.touches.length >= 2) {
|
|
||||||
this.deactivateActiveEmbeddable();
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
private handleEmbeddableCanvasGuardWheel = (
|
|
||||||
event: React.WheelEvent<HTMLDivElement>,
|
|
||||||
) => {
|
|
||||||
this.lastViewportPosition.x = event.clientX;
|
|
||||||
this.lastViewportPosition.y = event.clientY;
|
|
||||||
this.deactivateActiveEmbeddable();
|
|
||||||
this.handleWheel(event);
|
|
||||||
};
|
|
||||||
|
|
||||||
private handleIframeLikeElementHover = ({
|
private handleIframeLikeElementHover = ({
|
||||||
hitElement,
|
hitElement,
|
||||||
scenePointer,
|
scenePointer,
|
||||||
@@ -1394,25 +1304,12 @@ class App extends React.Component<AppProps, AppState> {
|
|||||||
))
|
))
|
||||||
) {
|
) {
|
||||||
setCursor(this.interactiveCanvas, CURSOR_TYPE.POINTER);
|
setCursor(this.interactiveCanvas, CURSOR_TYPE.POINTER);
|
||||||
const isDriveEmbedActivating =
|
|
||||||
(this.state.viewModeEnabled ||
|
|
||||||
this.state.activeTool.type === "selection") &&
|
|
||||||
isGoogleDriveEmbeddableElement(hitElement);
|
|
||||||
this.setState({
|
this.setState({
|
||||||
activeEmbeddable: {
|
activeEmbeddable: { element: hitElement, state: "hover" },
|
||||||
element: hitElement,
|
|
||||||
state: isDriveEmbedActivating ? "active" : "hover",
|
|
||||||
},
|
|
||||||
});
|
});
|
||||||
return true;
|
return true;
|
||||||
} else if (this.state.activeEmbeddable?.state === "hover") {
|
} else if (this.state.activeEmbeddable?.state === "hover") {
|
||||||
this.setState({ activeEmbeddable: null });
|
this.setState({ activeEmbeddable: null });
|
||||||
} else if (
|
|
||||||
this.state.activeEmbeddable?.state === "active" &&
|
|
||||||
isGoogleDriveEmbeddableElement(this.state.activeEmbeddable.element) &&
|
|
||||||
this.state.activeEmbeddable.element !== hitElement
|
|
||||||
) {
|
|
||||||
this.setState({ activeEmbeddable: null });
|
|
||||||
}
|
}
|
||||||
return false;
|
return false;
|
||||||
};
|
};
|
||||||
@@ -1836,8 +1733,6 @@ class App extends React.Component<AppProps, AppState> {
|
|||||||
const isHovered =
|
const isHovered =
|
||||||
this.state.activeEmbeddable?.element === el &&
|
this.state.activeEmbeddable?.element === el &&
|
||||||
this.state.activeEmbeddable?.state === "hover";
|
this.state.activeEmbeddable?.state === "hover";
|
||||||
const shouldConstrainDriveInteraction =
|
|
||||||
isActive && isGoogleDriveEmbeddableElement(el);
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
@@ -1889,7 +1784,6 @@ class App extends React.Component<AppProps, AppState> {
|
|||||||
width: isVisible ? `${el.width}px` : 0,
|
width: isVisible ? `${el.width}px` : 0,
|
||||||
height: isVisible ? `${el.height}px` : 0,
|
height: isVisible ? `${el.height}px` : 0,
|
||||||
transform: isVisible ? `rotate(${el.angle}rad)` : "none",
|
transform: isVisible ? `rotate(${el.angle}rad)` : "none",
|
||||||
position: "relative",
|
|
||||||
pointerEvents: isActive
|
pointerEvents: isActive
|
||||||
? POINTER_EVENTS.enabled
|
? POINTER_EVENTS.enabled
|
||||||
: POINTER_EVENTS.disabled,
|
: POINTER_EVENTS.disabled,
|
||||||
@@ -1932,26 +1826,6 @@ class App extends React.Component<AppProps, AppState> {
|
|||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
{shouldConstrainDriveInteraction &&
|
|
||||||
EMBEDDABLE_CANVAS_GUARDS.map(({ key, style }) => (
|
|
||||||
<div
|
|
||||||
key={key}
|
|
||||||
className={EMBEDDABLE_CANVAS_GUARD_CLASS}
|
|
||||||
onPointerDown={
|
|
||||||
this.handleEmbeddableCanvasGuardPointerDown
|
|
||||||
}
|
|
||||||
onPointerMove={
|
|
||||||
this.handleEmbeddableCanvasGuardPointerMove
|
|
||||||
}
|
|
||||||
onTouchStart={this.handleEmbeddableCanvasGuardTouchStart}
|
|
||||||
onWheel={this.handleEmbeddableCanvasGuardWheel}
|
|
||||||
style={{
|
|
||||||
position: "absolute",
|
|
||||||
zIndex: 2,
|
|
||||||
...style,
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
))}
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
@@ -2650,7 +2524,6 @@ class App extends React.Component<AppProps, AppState> {
|
|||||||
const magicFrameChildren = getElementsOverlappingFrame(
|
const magicFrameChildren = getElementsOverlappingFrame(
|
||||||
this.scene.getNonDeletedElements(),
|
this.scene.getNonDeletedElements(),
|
||||||
magicFrame,
|
magicFrame,
|
||||||
this.scene.getNonDeletedElementsMap(),
|
|
||||||
).filter((el) => !isMagicFrameElement(el));
|
).filter((el) => !isMagicFrameElement(el));
|
||||||
|
|
||||||
if (!magicFrameChildren.length) {
|
if (!magicFrameChildren.length) {
|
||||||
@@ -4858,16 +4731,6 @@ class App extends React.Component<AppProps, AppState> {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
if (
|
|
||||||
this.state.activeEmbeddable &&
|
|
||||||
(event.ctrlKey ||
|
|
||||||
event.metaKey ||
|
|
||||||
event.key === "Control" ||
|
|
||||||
event.key === "Meta")
|
|
||||||
) {
|
|
||||||
this.setState({ activeEmbeddable: null });
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!isInputLike(event.target)) {
|
if (!isInputLike(event.target)) {
|
||||||
if (
|
if (
|
||||||
(event.key === KEYS.ESCAPE || event.key === KEYS.ENTER) &&
|
(event.key === KEYS.ESCAPE || event.key === KEYS.ENTER) &&
|
||||||
@@ -5746,10 +5609,6 @@ class App extends React.Component<AppProps, AppState> {
|
|||||||
selectedElementIds: makeNextSelectedElementIds({}, this.state),
|
selectedElementIds: makeNextSelectedElementIds({}, this.state),
|
||||||
activeEmbeddable: null,
|
activeEmbeddable: null,
|
||||||
});
|
});
|
||||||
} else if (this.state.activeEmbeddable) {
|
|
||||||
this.setState({
|
|
||||||
activeEmbeddable: null,
|
|
||||||
});
|
|
||||||
}
|
}
|
||||||
gesture.initialScale = this.state.zoom.value;
|
gesture.initialScale = this.state.zoom.value;
|
||||||
});
|
});
|
||||||
@@ -7380,14 +7239,6 @@ class App extends React.Component<AppProps, AppState> {
|
|||||||
this.interactiveCanvas,
|
this.interactiveCanvas,
|
||||||
isTextElement(hitElement) ? CURSOR_TYPE.TEXT : CURSOR_TYPE.CROSSHAIR,
|
isTextElement(hitElement) ? CURSOR_TYPE.TEXT : CURSOR_TYPE.CROSSHAIR,
|
||||||
);
|
);
|
||||||
} else if (
|
|
||||||
!event[KEYS.CTRL_OR_CMD] &&
|
|
||||||
this.isHittingCommonBoundingBoxOfSelectedElements(
|
|
||||||
scenePointer,
|
|
||||||
selectedElements,
|
|
||||||
)
|
|
||||||
) {
|
|
||||||
setCursor(this.interactiveCanvas, CURSOR_TYPE.MOVE);
|
|
||||||
} else if (this.state.viewModeEnabled) {
|
} else if (this.state.viewModeEnabled) {
|
||||||
setCursor(this.interactiveCanvas, CURSOR_TYPE.GRAB);
|
setCursor(this.interactiveCanvas, CURSOR_TYPE.GRAB);
|
||||||
} else if (this.state.openDialog?.name === "elementLinkSelector") {
|
} else if (this.state.openDialog?.name === "elementLinkSelector") {
|
||||||
@@ -7879,24 +7730,17 @@ class App extends React.Component<AppProps, AppState> {
|
|||||||
const hitSelectedElement =
|
const hitSelectedElement =
|
||||||
pointerDownState.hit.element &&
|
pointerDownState.hit.element &&
|
||||||
this.isASelectedElement(pointerDownState.hit.element);
|
this.isASelectedElement(pointerDownState.hit.element);
|
||||||
const shouldForceLassoReselect =
|
|
||||||
event.altKey &&
|
|
||||||
event[KEYS.CTRL_OR_CMD] &&
|
|
||||||
!pointerDownState.resize.handleType;
|
|
||||||
const shouldStartLassoSelection =
|
|
||||||
shouldForceLassoReselect ||
|
|
||||||
(!pointerDownState.hit.hasHitCommonBoundingBoxOfSelectedElements &&
|
|
||||||
!pointerDownState.resize.handleType &&
|
|
||||||
!hitSelectedElement);
|
|
||||||
|
|
||||||
if (shouldStartLassoSelection) {
|
if (
|
||||||
if (!this.lassoTrail.hasCurrentTrail) {
|
!pointerDownState.hit.hasHitCommonBoundingBoxOfSelectedElements &&
|
||||||
this.lassoTrail.startPath(
|
!pointerDownState.resize.handleType &&
|
||||||
pointerDownState.origin.x,
|
!hitSelectedElement
|
||||||
pointerDownState.origin.y,
|
) {
|
||||||
event.shiftKey,
|
this.lassoTrail.startPath(
|
||||||
);
|
pointerDownState.origin.x,
|
||||||
}
|
pointerDownState.origin.y,
|
||||||
|
event.shiftKey,
|
||||||
|
);
|
||||||
|
|
||||||
// block dragging after lasso selection on PCs until the next pointer down
|
// block dragging after lasso selection on PCs until the next pointer down
|
||||||
// (on mobile or tablet, we want to allow user to drag immediately)
|
// (on mobile or tablet, we want to allow user to drag immediately)
|
||||||
@@ -8304,10 +8148,6 @@ class App extends React.Component<AppProps, AppState> {
|
|||||||
y: event.clientY,
|
y: event.clientY,
|
||||||
});
|
});
|
||||||
|
|
||||||
if (gesture.pointers.size >= 2 && this.state.activeEmbeddable) {
|
|
||||||
this.setState({ activeEmbeddable: null });
|
|
||||||
}
|
|
||||||
|
|
||||||
if (gesture.pointers.size === 2) {
|
if (gesture.pointers.size === 2) {
|
||||||
gesture.lastCenter = getCenter(gesture.pointers);
|
gesture.lastCenter = getCenter(gesture.pointers);
|
||||||
gesture.initialScale = this.state.zoom.value;
|
gesture.initialScale = this.state.zoom.value;
|
||||||
@@ -8889,14 +8729,12 @@ class App extends React.Component<AppProps, AppState> {
|
|||||||
DEFAULT_COLLISION_THRESHOLD / this.state.zoom.value,
|
DEFAULT_COLLISION_THRESHOLD / this.state.zoom.value,
|
||||||
1,
|
1,
|
||||||
);
|
);
|
||||||
const boundsPadding =
|
|
||||||
(DEFAULT_TRANSFORM_HANDLE_SPACING * 2) / this.state.zoom.value;
|
|
||||||
const [x1, y1, x2, y2] = getCommonBounds(selectedElements);
|
const [x1, y1, x2, y2] = getCommonBounds(selectedElements);
|
||||||
return (
|
return (
|
||||||
point.x > x1 - boundsPadding - threshold &&
|
point.x > x1 - threshold &&
|
||||||
point.x < x2 + boundsPadding + threshold &&
|
point.x < x2 + threshold &&
|
||||||
point.y > y1 - boundsPadding - threshold &&
|
point.y > y1 - threshold &&
|
||||||
point.y < y2 + boundsPadding + threshold
|
point.y < y2 + threshold
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -10429,7 +10267,6 @@ class App extends React.Component<AppProps, AppState> {
|
|||||||
this.state.selectionElement,
|
this.state.selectionElement,
|
||||||
this.scene.getNonDeletedElementsMap(),
|
this.scene.getNonDeletedElementsMap(),
|
||||||
false,
|
false,
|
||||||
this.state.boxSelectionMode,
|
|
||||||
)
|
)
|
||||||
: [];
|
: [];
|
||||||
|
|
||||||
@@ -12727,8 +12564,7 @@ class App extends React.Component<AppProps, AppState> {
|
|||||||
event.target instanceof HTMLTextAreaElement ||
|
event.target instanceof HTMLTextAreaElement ||
|
||||||
event.target instanceof HTMLIFrameElement ||
|
event.target instanceof HTMLIFrameElement ||
|
||||||
(event.target instanceof HTMLElement &&
|
(event.target instanceof HTMLElement &&
|
||||||
(event.target.classList.contains(CLASSES.FRAME_NAME) ||
|
event.target.classList.contains(CLASSES.FRAME_NAME))
|
||||||
event.target.classList.contains(EMBEDDABLE_CANVAS_GUARD_CLASS)))
|
|
||||||
)
|
)
|
||||||
) {
|
) {
|
||||||
// prevent zooming the browser (but allow scrolling DOM)
|
// prevent zooming the browser (but allow scrolling DOM)
|
||||||
|
|||||||
@@ -26,16 +26,13 @@
|
|||||||
background: var(--RadioGroup-background);
|
background: var(--RadioGroup-background);
|
||||||
border: 1px solid var(--RadioGroup-border);
|
border: 1px solid var(--RadioGroup-border);
|
||||||
|
|
||||||
gap: 2px;
|
|
||||||
|
|
||||||
&__choice {
|
&__choice {
|
||||||
position: relative;
|
position: relative;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
min-width: 20px;
|
width: 32px;
|
||||||
height: 24px;
|
height: 24px;
|
||||||
padding: 0 0.375rem;
|
|
||||||
|
|
||||||
color: var(--RadioGroup-choice-color-off);
|
color: var(--RadioGroup-choice-color-off);
|
||||||
background: var(--RadioGroup-choice-background-off);
|
background: var(--RadioGroup-choice-background-off);
|
||||||
|
|||||||
@@ -750,7 +750,7 @@ describe("frame resizing behavior", () => {
|
|||||||
x: 0,
|
x: 0,
|
||||||
y: 0,
|
y: 0,
|
||||||
width: 100,
|
width: 100,
|
||||||
height: 103,
|
height: 100,
|
||||||
});
|
});
|
||||||
|
|
||||||
// Create a rectangle outside the frame
|
// Create a rectangle outside the frame
|
||||||
|
|||||||
@@ -2,7 +2,7 @@
|
|||||||
|
|
||||||
.excalidraw {
|
.excalidraw {
|
||||||
.dropdown-menu {
|
.dropdown-menu {
|
||||||
max-width: 20rem;
|
max-width: 16rem;
|
||||||
z-index: 1;
|
z-index: 1;
|
||||||
|
|
||||||
&--placement-top {
|
&--placement-top {
|
||||||
|
|||||||
@@ -1,5 +1,4 @@
|
|||||||
import { useEditorInterface } from "../App";
|
import { useEditorInterface } from "../App";
|
||||||
import { Ellipsify } from "../Ellipsify";
|
|
||||||
import { RadioGroup } from "../RadioGroup";
|
import { RadioGroup } from "../RadioGroup";
|
||||||
|
|
||||||
type Props<T> = {
|
type Props<T> = {
|
||||||
@@ -13,7 +12,6 @@ type Props<T> = {
|
|||||||
onChange: (value: T) => void;
|
onChange: (value: T) => void;
|
||||||
children: React.ReactNode;
|
children: React.ReactNode;
|
||||||
name: string;
|
name: string;
|
||||||
icon?: React.ReactNode;
|
|
||||||
};
|
};
|
||||||
|
|
||||||
const DropdownMenuItemContentRadio = <T,>({
|
const DropdownMenuItemContentRadio = <T,>({
|
||||||
@@ -23,17 +21,13 @@ const DropdownMenuItemContentRadio = <T,>({
|
|||||||
choices,
|
choices,
|
||||||
children,
|
children,
|
||||||
name,
|
name,
|
||||||
icon,
|
|
||||||
}: Props<T>) => {
|
}: Props<T>) => {
|
||||||
const editorInterface = useEditorInterface();
|
const editorInterface = useEditorInterface();
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<div className="dropdown-menu-item-base dropdown-menu-item-bare">
|
<div className="dropdown-menu-item-base dropdown-menu-item-bare">
|
||||||
{icon && <div className="dropdown-menu-item__icon">{icon}</div>}
|
<label className="dropdown-menu-item__text">{children}</label>
|
||||||
<label className="dropdown-menu-item__text">
|
|
||||||
<Ellipsify>{children}</Ellipsify>
|
|
||||||
</label>
|
|
||||||
<RadioGroup
|
<RadioGroup
|
||||||
name={name}
|
name={name}
|
||||||
value={value}
|
value={value}
|
||||||
|
|||||||
@@ -39,13 +39,7 @@ import DropdownMenuItemCheckbox from "../dropdownMenu/DropdownMenuItemCheckbox";
|
|||||||
import DropdownMenuItemContentRadio from "../dropdownMenu/DropdownMenuItemContentRadio";
|
import DropdownMenuItemContentRadio from "../dropdownMenu/DropdownMenuItemContentRadio";
|
||||||
import DropdownMenuItemLink from "../dropdownMenu/DropdownMenuItemLink";
|
import DropdownMenuItemLink from "../dropdownMenu/DropdownMenuItemLink";
|
||||||
import DropdownMenuSub from "../dropdownMenu/DropdownMenuSub";
|
import DropdownMenuSub from "../dropdownMenu/DropdownMenuSub";
|
||||||
import {
|
import { GithubIcon, DiscordIcon, XBrandIcon, settingsIcon } from "../icons";
|
||||||
GithubIcon,
|
|
||||||
DiscordIcon,
|
|
||||||
XBrandIcon,
|
|
||||||
settingsIcon,
|
|
||||||
emptyIcon,
|
|
||||||
} from "../icons";
|
|
||||||
import {
|
import {
|
||||||
boltIcon,
|
boltIcon,
|
||||||
DeviceDesktopIcon,
|
DeviceDesktopIcon,
|
||||||
@@ -433,39 +427,6 @@ const PreferencesToggleToolLockItem = () => {
|
|||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
const PreferencesBoxSelectionModeItem = () => {
|
|
||||||
const { t } = useI18n();
|
|
||||||
const appState = useUIAppState();
|
|
||||||
const setAppState = useExcalidrawSetAppState();
|
|
||||||
|
|
||||||
return (
|
|
||||||
<DropdownMenuItemContentRadio<"contain" | "overlap">
|
|
||||||
name="boxSelectionMode"
|
|
||||||
icon={emptyIcon}
|
|
||||||
value={appState.boxSelectionMode}
|
|
||||||
onChange={(value) => {
|
|
||||||
setAppState({
|
|
||||||
boxSelectionMode: value,
|
|
||||||
});
|
|
||||||
}}
|
|
||||||
choices={[
|
|
||||||
{
|
|
||||||
value: "contain",
|
|
||||||
label: t("labels.boxSelectionContain"),
|
|
||||||
ariaLabel: t("labels.boxSelectionContain"),
|
|
||||||
},
|
|
||||||
{
|
|
||||||
value: "overlap",
|
|
||||||
label: t("labels.boxSelectionOverlap"),
|
|
||||||
ariaLabel: t("labels.boxSelectionOverlap"),
|
|
||||||
},
|
|
||||||
]}
|
|
||||||
>
|
|
||||||
{t("labels.boxSelectionMode")}
|
|
||||||
</DropdownMenuItemContentRadio>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
const PreferencesToggleSnapModeItem = () => {
|
const PreferencesToggleSnapModeItem = () => {
|
||||||
const { t } = useI18n();
|
const { t } = useI18n();
|
||||||
const actionManager = useExcalidrawActionManager();
|
const actionManager = useExcalidrawActionManager();
|
||||||
@@ -607,7 +568,6 @@ export const Preferences = ({
|
|||||||
<DropdownMenuSub.Content className="excalidraw-main-menu-preferences-submenu">
|
<DropdownMenuSub.Content className="excalidraw-main-menu-preferences-submenu">
|
||||||
{children || (
|
{children || (
|
||||||
<>
|
<>
|
||||||
<PreferencesBoxSelectionModeItem />
|
|
||||||
<PreferencesToggleToolLockItem />
|
<PreferencesToggleToolLockItem />
|
||||||
<PreferencesToggleSnapModeItem />
|
<PreferencesToggleSnapModeItem />
|
||||||
<PreferencesToggleGridModeItem />
|
<PreferencesToggleGridModeItem />
|
||||||
@@ -625,7 +585,6 @@ export const Preferences = ({
|
|||||||
};
|
};
|
||||||
|
|
||||||
Preferences.ToggleToolLock = PreferencesToggleToolLockItem;
|
Preferences.ToggleToolLock = PreferencesToggleToolLockItem;
|
||||||
Preferences.BoxSelectionMode = PreferencesBoxSelectionModeItem;
|
|
||||||
Preferences.ToggleSnapMode = PreferencesToggleSnapModeItem;
|
Preferences.ToggleSnapMode = PreferencesToggleSnapModeItem;
|
||||||
Preferences.ToggleArrowBinding = PreferencesToggleArrowBindingItem;
|
Preferences.ToggleArrowBinding = PreferencesToggleArrowBindingItem;
|
||||||
Preferences.ToggleMidpointSnapping = PreferencesToggleMidpointSnappingItem;
|
Preferences.ToggleMidpointSnapping = PreferencesToggleMidpointSnappingItem;
|
||||||
|
|||||||
@@ -6,7 +6,6 @@ import {
|
|||||||
MIME_TYPES,
|
MIME_TYPES,
|
||||||
cloneJSON,
|
cloneJSON,
|
||||||
SVG_DOCUMENT_PREAMBLE,
|
SVG_DOCUMENT_PREAMBLE,
|
||||||
arrayToMap,
|
|
||||||
} from "@excalidraw/common";
|
} from "@excalidraw/common";
|
||||||
|
|
||||||
import { getNonDeletedElements } from "@excalidraw/element";
|
import { getNonDeletedElements } from "@excalidraw/element";
|
||||||
@@ -50,7 +49,6 @@ export const prepareElementsForExport = (
|
|||||||
exportSelectionOnly: boolean,
|
exportSelectionOnly: boolean,
|
||||||
) => {
|
) => {
|
||||||
elements = getNonDeletedElements(elements);
|
elements = getNonDeletedElements(elements);
|
||||||
const elementsMap = arrayToMap(elements);
|
|
||||||
|
|
||||||
const isExportingSelection =
|
const isExportingSelection =
|
||||||
exportSelectionOnly &&
|
exportSelectionOnly &&
|
||||||
@@ -73,11 +71,7 @@ export const prepareElementsForExport = (
|
|||||||
isFrameLikeElement(exportedElements[0])
|
isFrameLikeElement(exportedElements[0])
|
||||||
) {
|
) {
|
||||||
exportingFrame = exportedElements[0];
|
exportingFrame = exportedElements[0];
|
||||||
exportedElements = getElementsOverlappingFrame(
|
exportedElements = getElementsOverlappingFrame(elements, exportingFrame);
|
||||||
elements,
|
|
||||||
exportingFrame,
|
|
||||||
elementsMap,
|
|
||||||
);
|
|
||||||
} else if (exportedElements.length > 1) {
|
} else if (exportedElements.length > 1) {
|
||||||
exportedElements = getSelectedElements(
|
exportedElements = getSelectedElements(
|
||||||
elements,
|
elements,
|
||||||
|
|||||||
@@ -96,8 +96,6 @@ type RestoredAppState = Omit<
|
|||||||
"offsetTop" | "offsetLeft" | "width" | "height"
|
"offsetTop" | "offsetLeft" | "width" | "height"
|
||||||
>;
|
>;
|
||||||
|
|
||||||
const MAX_ARROW_PX = 75_000;
|
|
||||||
|
|
||||||
export const AllowedExcalidrawActiveTools: Record<
|
export const AllowedExcalidrawActiveTools: Record<
|
||||||
AppState["activeTool"]["type"],
|
AppState["activeTool"]["type"],
|
||||||
boolean
|
boolean
|
||||||
@@ -469,8 +467,8 @@ export const restoreElement = (
|
|||||||
element.endArrowhead === undefined
|
element.endArrowhead === undefined
|
||||||
? "arrow"
|
? "arrow"
|
||||||
: normalizeArrowhead(element.endArrowhead);
|
: normalizeArrowhead(element.endArrowhead);
|
||||||
const x = element.x as number | undefined;
|
const x: number | undefined = element.x;
|
||||||
const y = element.y as number | undefined;
|
const y: number | undefined = element.y;
|
||||||
const points: readonly LocalPoint[] | undefined = // migrate old arrow model to new one
|
const points: readonly LocalPoint[] | undefined = // migrate old arrow model to new one
|
||||||
!Array.isArray(element.points) || element.points.length < 2
|
!Array.isArray(element.points) || element.points.length < 2
|
||||||
? [pointFrom(0, 0), pointFrom(element.width, element.height)]
|
? [pointFrom(0, 0), pointFrom(element.width, element.height)]
|
||||||
@@ -495,8 +493,8 @@ export const restoreElement = (
|
|||||||
startArrowhead,
|
startArrowhead,
|
||||||
endArrowhead,
|
endArrowhead,
|
||||||
points,
|
points,
|
||||||
x: x ?? 0,
|
x,
|
||||||
y: y ?? 0,
|
y,
|
||||||
elbowed: (element as ExcalidrawArrowElement).elbowed,
|
elbowed: (element as ExcalidrawArrowElement).elbowed,
|
||||||
...getSizeFromPoints(points),
|
...getSizeFromPoints(points),
|
||||||
};
|
};
|
||||||
@@ -515,44 +513,12 @@ export const restoreElement = (
|
|||||||
})
|
})
|
||||||
: restoreElementWithProperties(element as ExcalidrawArrowElement, base);
|
: restoreElementWithProperties(element as ExcalidrawArrowElement, base);
|
||||||
|
|
||||||
const normalizedRestoredElement = {
|
return {
|
||||||
...restoredElement,
|
...restoredElement,
|
||||||
...LinearElementEditor.getNormalizeElementPointsAndCoords(
|
...LinearElementEditor.getNormalizeElementPointsAndCoords(
|
||||||
restoredElement,
|
restoredElement,
|
||||||
),
|
),
|
||||||
};
|
};
|
||||||
|
|
||||||
// Last resort fix for extremely large arrows
|
|
||||||
if (
|
|
||||||
normalizedRestoredElement.width > MAX_ARROW_PX ||
|
|
||||||
normalizedRestoredElement.height > MAX_ARROW_PX
|
|
||||||
) {
|
|
||||||
console.error(
|
|
||||||
`Removing extremely large arrow ${
|
|
||||||
normalizedRestoredElement.id
|
|
||||||
} (type: ${
|
|
||||||
isElbowArrow(normalizedRestoredElement) ? "elbow" : "simple"
|
|
||||||
}, width: ${normalizedRestoredElement.width}, height: ${
|
|
||||||
normalizedRestoredElement.height
|
|
||||||
}, x: ${normalizedRestoredElement.x}, y: ${
|
|
||||||
normalizedRestoredElement.y
|
|
||||||
})`,
|
|
||||||
);
|
|
||||||
return {
|
|
||||||
...normalizedRestoredElement,
|
|
||||||
x: 0,
|
|
||||||
y: 0,
|
|
||||||
width: 100,
|
|
||||||
height: 100,
|
|
||||||
points: [
|
|
||||||
pointFrom<LocalPoint>(0, 0),
|
|
||||||
pointFrom<LocalPoint>(100, 100),
|
|
||||||
],
|
|
||||||
isDeleted: true,
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
return normalizedRestoredElement;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// generic elements
|
// generic elements
|
||||||
@@ -700,7 +666,6 @@ export const restoreElements = <T extends ExcalidrawElement>(
|
|||||||
const existingElementsMap = existingElements
|
const existingElementsMap = existingElements
|
||||||
? arrayToMap(existingElements)
|
? arrayToMap(existingElements)
|
||||||
: null;
|
: null;
|
||||||
|
|
||||||
const restoredElements = syncInvalidIndices(
|
const restoredElements = syncInvalidIndices(
|
||||||
(targetElements || []).reduce((elements, element) => {
|
(targetElements || []).reduce((elements, element) => {
|
||||||
// filtering out selection, which is legacy, no longer kept in elements,
|
// filtering out selection, which is legacy, no longer kept in elements,
|
||||||
@@ -797,7 +762,7 @@ export const restoreElements = <T extends ExcalidrawElement>(
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// NOTE (mtolmacs): Temporary fix for invalid/self-bound elbow arrows
|
// NOTE (mtolmacs): Temporary fix for extremely large arrows
|
||||||
// Need to iterate again so we have attached text nodes in elementsMap
|
// Need to iterate again so we have attached text nodes in elementsMap
|
||||||
return restoredElements.map((element) => {
|
return restoredElements.map((element) => {
|
||||||
if (
|
if (
|
||||||
@@ -971,12 +936,6 @@ export const restoreAppState = (
|
|||||||
: defaultValue;
|
: defaultValue;
|
||||||
}
|
}
|
||||||
|
|
||||||
const boxSelectionMode =
|
|
||||||
appState.boxSelectionMode ?? localAppState?.boxSelectionMode;
|
|
||||||
if (boxSelectionMode !== undefined) {
|
|
||||||
nextAppState.boxSelectionMode = boxSelectionMode;
|
|
||||||
}
|
|
||||||
|
|
||||||
return {
|
return {
|
||||||
...nextAppState,
|
...nextAppState,
|
||||||
cursorButton: localAppState?.cursorButton || "up",
|
cursorButton: localAppState?.cursorButton || "up",
|
||||||
|
|||||||
@@ -185,9 +185,6 @@
|
|||||||
"shapeSwitch": "Switch shape",
|
"shapeSwitch": "Switch shape",
|
||||||
"preferences": "Preferences",
|
"preferences": "Preferences",
|
||||||
"preferences_toolLock": "Tool lock",
|
"preferences_toolLock": "Tool lock",
|
||||||
"boxSelectionMode": "Select on",
|
|
||||||
"boxSelectionContain": "Wrap",
|
|
||||||
"boxSelectionOverlap": "Overlap",
|
|
||||||
"arrowBinding": "Arrow binding",
|
"arrowBinding": "Arrow binding",
|
||||||
"midpointSnapping": "Snap to midpoints"
|
"midpointSnapping": "Snap to midpoints"
|
||||||
},
|
},
|
||||||
|
|||||||
@@ -157,11 +157,7 @@ const prepareElementsForRender = ({
|
|||||||
let nextElements: readonly ExcalidrawElement[];
|
let nextElements: readonly ExcalidrawElement[];
|
||||||
|
|
||||||
if (exportingFrame) {
|
if (exportingFrame) {
|
||||||
nextElements = getElementsOverlappingFrame(
|
nextElements = getElementsOverlappingFrame(elements, exportingFrame);
|
||||||
elements,
|
|
||||||
exportingFrame,
|
|
||||||
arrayToMap(elements),
|
|
||||||
);
|
|
||||||
} else if (frameRendering.enabled && frameRendering.name) {
|
} else if (frameRendering.enabled && frameRendering.name) {
|
||||||
nextElements = addFrameLabelsAsTextElements(elements, {
|
nextElements = addFrameLabelsAsTextElements(elements, {
|
||||||
exportWithDarkMode,
|
exportWithDarkMode,
|
||||||
|
|||||||
@@ -13,7 +13,6 @@ exports[`contextMenu element > right-clicking on a group should select whole gro
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": {
|
"contextMenu": {
|
||||||
"items": [
|
"items": [
|
||||||
@@ -1087,7 +1086,6 @@ exports[`contextMenu element > selecting 'Add to library' in context menu adds e
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -1302,7 +1300,6 @@ exports[`contextMenu element > selecting 'Bring forward' in context menu brings
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -1634,7 +1631,6 @@ exports[`contextMenu element > selecting 'Bring to front' in context menu brings
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -1966,7 +1962,6 @@ exports[`contextMenu element > selecting 'Copy styles' in context menu copies st
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -2181,7 +2176,6 @@ exports[`contextMenu element > selecting 'Delete' in context menu deletes elemen
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -2423,7 +2417,6 @@ exports[`contextMenu element > selecting 'Duplicate' in context menu duplicates
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -2722,7 +2715,6 @@ exports[`contextMenu element > selecting 'Group selection' in context menu group
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -3095,7 +3087,6 @@ exports[`contextMenu element > selecting 'Paste styles' in context menu pastes s
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -3589,7 +3580,6 @@ exports[`contextMenu element > selecting 'Send backward' in context menu sends e
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -3913,7 +3903,6 @@ exports[`contextMenu element > selecting 'Send to back' in context menu sends el
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -4237,7 +4226,6 @@ exports[`contextMenu element > selecting 'Ungroup selection' in context menu ung
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -4370,7 +4358,7 @@ exports[`contextMenu element > selecting 'Ungroup selection' in context menu ung
|
|||||||
"type": "rectangle",
|
"type": "rectangle",
|
||||||
"updated": 1,
|
"updated": 1,
|
||||||
"version": 5,
|
"version": 5,
|
||||||
"versionNonce": 1006504105,
|
"versionNonce": 760410951,
|
||||||
"width": 20,
|
"width": 20,
|
||||||
"x": -10,
|
"x": -10,
|
||||||
"y": 0,
|
"y": 0,
|
||||||
@@ -4395,14 +4383,14 @@ exports[`contextMenu element > selecting 'Ungroup selection' in context menu ung
|
|||||||
"opacity": 100,
|
"opacity": 100,
|
||||||
"roughness": 1,
|
"roughness": 1,
|
||||||
"roundness": null,
|
"roundness": null,
|
||||||
"seed": 400692809,
|
"seed": 238820263,
|
||||||
"strokeColor": "#1e1e1e",
|
"strokeColor": "#1e1e1e",
|
||||||
"strokeStyle": "solid",
|
"strokeStyle": "solid",
|
||||||
"strokeWidth": 2,
|
"strokeWidth": 2,
|
||||||
"type": "rectangle",
|
"type": "rectangle",
|
||||||
"updated": 1,
|
"updated": 1,
|
||||||
"version": 5,
|
"version": 5,
|
||||||
"versionNonce": 289600103,
|
"versionNonce": 1006504105,
|
||||||
"width": 20,
|
"width": 20,
|
||||||
"x": 20,
|
"x": 20,
|
||||||
"y": 30,
|
"y": 30,
|
||||||
@@ -4649,7 +4637,6 @@ exports[`contextMenu element > shows 'Group selection' in context menu for multi
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": {
|
"contextMenu": {
|
||||||
"items": [
|
"items": [
|
||||||
@@ -5867,7 +5854,6 @@ exports[`contextMenu element > shows 'Ungroup selection' in context menu for gro
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": {
|
"contextMenu": {
|
||||||
"items": [
|
"items": [
|
||||||
@@ -6878,7 +6864,7 @@ exports[`contextMenu element > shows 'Ungroup selection' in context menu for gro
|
|||||||
"type": "rectangle",
|
"type": "rectangle",
|
||||||
"updated": 1,
|
"updated": 1,
|
||||||
"version": 4,
|
"version": 4,
|
||||||
"versionNonce": 1723083209,
|
"versionNonce": 747212839,
|
||||||
"width": 10,
|
"width": 10,
|
||||||
"x": -10,
|
"x": -10,
|
||||||
"y": 0,
|
"y": 0,
|
||||||
@@ -6905,14 +6891,14 @@ exports[`contextMenu element > shows 'Ungroup selection' in context menu for gro
|
|||||||
"opacity": 100,
|
"opacity": 100,
|
||||||
"roughness": 1,
|
"roughness": 1,
|
||||||
"roundness": null,
|
"roundness": null,
|
||||||
"seed": 400692809,
|
"seed": 238820263,
|
||||||
"strokeColor": "#1e1e1e",
|
"strokeColor": "#1e1e1e",
|
||||||
"strokeStyle": "solid",
|
"strokeStyle": "solid",
|
||||||
"strokeWidth": 2,
|
"strokeWidth": 2,
|
||||||
"type": "rectangle",
|
"type": "rectangle",
|
||||||
"updated": 1,
|
"updated": 1,
|
||||||
"version": 4,
|
"version": 4,
|
||||||
"versionNonce": 760410951,
|
"versionNonce": 1723083209,
|
||||||
"width": 10,
|
"width": 10,
|
||||||
"x": 12,
|
"x": 12,
|
||||||
"y": 0,
|
"y": 0,
|
||||||
@@ -7136,7 +7122,6 @@ exports[`contextMenu element > shows context menu for canvas > [end of test] app
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": {
|
"contextMenu": {
|
||||||
"items": [
|
"items": [
|
||||||
@@ -7826,7 +7811,6 @@ exports[`contextMenu element > shows context menu for element > [end of test] ap
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": {
|
"contextMenu": {
|
||||||
"items": [
|
"items": [
|
||||||
@@ -8818,7 +8802,6 @@ exports[`contextMenu element > shows context menu for element > [end of test] ap
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": {
|
"contextMenu": {
|
||||||
"items": [
|
"items": [
|
||||||
|
|||||||
@@ -13,7 +13,6 @@ exports[`history > multiplayer undo/redo > conflicts in arrows and their bindabl
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -647,7 +646,6 @@ exports[`history > multiplayer undo/redo > conflicts in arrows and their bindabl
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -1209,7 +1207,6 @@ exports[`history > multiplayer undo/redo > conflicts in arrows and their bindabl
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -1570,7 +1567,6 @@ exports[`history > multiplayer undo/redo > conflicts in arrows and their bindabl
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -1933,7 +1929,6 @@ exports[`history > multiplayer undo/redo > conflicts in arrows and their bindabl
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -2197,7 +2192,6 @@ exports[`history > multiplayer undo/redo > conflicts in arrows and their bindabl
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -2651,7 +2645,6 @@ exports[`history > multiplayer undo/redo > conflicts in bound text elements and
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -2955,7 +2948,6 @@ exports[`history > multiplayer undo/redo > conflicts in bound text elements and
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -3275,7 +3267,6 @@ exports[`history > multiplayer undo/redo > conflicts in bound text elements and
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -3570,7 +3561,6 @@ exports[`history > multiplayer undo/redo > conflicts in bound text elements and
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -3857,7 +3847,6 @@ exports[`history > multiplayer undo/redo > conflicts in bound text elements and
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -4093,7 +4082,6 @@ exports[`history > multiplayer undo/redo > conflicts in bound text elements and
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -4351,7 +4339,6 @@ exports[`history > multiplayer undo/redo > conflicts in bound text elements and
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -4623,7 +4610,6 @@ exports[`history > multiplayer undo/redo > conflicts in bound text elements and
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -4853,7 +4839,6 @@ exports[`history > multiplayer undo/redo > conflicts in bound text elements and
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -5083,7 +5068,6 @@ exports[`history > multiplayer undo/redo > conflicts in bound text elements and
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -5331,7 +5315,6 @@ exports[`history > multiplayer undo/redo > conflicts in bound text elements and
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -5588,7 +5571,6 @@ exports[`history > multiplayer undo/redo > conflicts in frames and their childre
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -5847,7 +5829,6 @@ exports[`history > multiplayer undo/redo > should iterate through the history wh
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -6177,7 +6158,6 @@ exports[`history > multiplayer undo/redo > should iterate through the history wh
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -6605,7 +6585,6 @@ exports[`history > multiplayer undo/redo > should iterate through the history wh
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -6980,7 +6959,6 @@ exports[`history > multiplayer undo/redo > should iterate through the history wh
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -7293,7 +7271,6 @@ exports[`history > multiplayer undo/redo > should iterate through the history wh
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -7586,7 +7563,6 @@ exports[`history > multiplayer undo/redo > should iterate through the history wh
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -7817,7 +7793,6 @@ exports[`history > multiplayer undo/redo > should iterate through the history wh
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -8170,7 +8145,6 @@ exports[`history > multiplayer undo/redo > should iterate through the history wh
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -8523,7 +8497,6 @@ exports[`history > multiplayer undo/redo > should not let remote changes to inte
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -8930,7 +8903,6 @@ exports[`history > multiplayer undo/redo > should not let remote changes to inte
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -9210,7 +9182,6 @@ exports[`history > multiplayer undo/redo > should not let remote changes to inte
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -9475,7 +9446,6 @@ exports[`history > multiplayer undo/redo > should not override remote changes on
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -9741,7 +9711,6 @@ exports[`history > multiplayer undo/redo > should not override remote changes on
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -9974,7 +9943,6 @@ exports[`history > multiplayer undo/redo > should override remotely added groups
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -10272,7 +10240,6 @@ exports[`history > multiplayer undo/redo > should override remotely added points
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -10590,7 +10557,6 @@ exports[`history > multiplayer undo/redo > should redistribute deltas when eleme
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -10827,7 +10793,6 @@ exports[`history > multiplayer undo/redo > should redraw arrows on undo > [end o
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -11753,7 +11718,6 @@ exports[`history > multiplayer undo/redo > should update history entries after r
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -12014,7 +11978,6 @@ exports[`history > singleplayer undo/redo > remounting undo/redo buttons should
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -12250,7 +12213,6 @@ exports[`history > singleplayer undo/redo > should clear the redo stack on eleme
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -12488,7 +12450,6 @@ exports[`history > singleplayer undo/redo > should create entry when selecting f
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -12880,7 +12841,6 @@ exports[`history > singleplayer undo/redo > should create new history entry on e
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -13091,7 +13051,6 @@ exports[`history > singleplayer undo/redo > should create new history entry on e
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -13299,7 +13258,6 @@ exports[`history > singleplayer undo/redo > should create new history entry on i
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -13601,7 +13559,6 @@ exports[`history > singleplayer undo/redo > should create new history entry on i
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -13900,7 +13857,6 @@ exports[`history > singleplayer undo/redo > should create new history entry on s
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -14146,7 +14102,6 @@ exports[`history > singleplayer undo/redo > should disable undo/redo buttons whe
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -14384,7 +14339,6 @@ exports[`history > singleplayer undo/redo > should end up with no history entry
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -14622,7 +14576,6 @@ exports[`history > singleplayer undo/redo > should iterate through the history w
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -14870,7 +14823,6 @@ exports[`history > singleplayer undo/redo > should not clear the redo stack on s
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -15202,7 +15154,6 @@ exports[`history > singleplayer undo/redo > should not collapse when applying co
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -15373,7 +15324,6 @@ exports[`history > singleplayer undo/redo > should not end up with history entry
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -15658,7 +15608,6 @@ exports[`history > singleplayer undo/redo > should not end up with history entry
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -15922,7 +15871,6 @@ exports[`history > singleplayer undo/redo > should not modify anything on unrela
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -16076,7 +16024,6 @@ exports[`history > singleplayer undo/redo > should not override appstate changes
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -16359,7 +16306,6 @@ exports[`history > singleplayer undo/redo > should support appstate name or view
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -16522,7 +16468,6 @@ exports[`history > singleplayer undo/redo > should support bidirectional binding
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -17271,7 +17216,6 @@ exports[`history > singleplayer undo/redo > should support bidirectional binding
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -17918,7 +17862,6 @@ exports[`history > singleplayer undo/redo > should support bidirectional binding
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -18565,7 +18508,6 @@ exports[`history > singleplayer undo/redo > should support bidirectional binding
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -19315,7 +19257,6 @@ exports[`history > singleplayer undo/redo > should support bidirectional binding
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -20084,7 +20025,6 @@ exports[`history > singleplayer undo/redo > should support changes in elements'
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -20565,7 +20505,6 @@ exports[`history > singleplayer undo/redo > should support duplication of groups
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -21077,7 +21016,6 @@ exports[`history > singleplayer undo/redo > should support element creation, del
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -21537,7 +21475,6 @@ exports[`history > singleplayer undo/redo > should support linear element creati
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
|
|||||||
@@ -13,7 +13,6 @@ exports[`given element A and group of elements B and given both are selected whe
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -440,7 +439,6 @@ exports[`given element A and group of elements B and given both are selected whe
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -857,7 +855,6 @@ exports[`regression tests > Cmd/Ctrl-click exclusively select element under poin
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -1424,7 +1421,6 @@ exports[`regression tests > Drags selected element when hitting only bounding bo
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -1632,7 +1628,6 @@ exports[`regression tests > adjusts z order when grouping > [end of test] appSta
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -2017,7 +2012,6 @@ exports[`regression tests > alt-drag duplicates an element > [end of test] appSt
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -2263,7 +2257,6 @@ exports[`regression tests > arrow keys > [end of test] appState 1`] = `
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -2444,7 +2437,6 @@ exports[`regression tests > can drag element that covers another element, while
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -2770,7 +2762,6 @@ exports[`regression tests > change the properties of a shape > [end of test] app
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -3026,7 +3017,6 @@ exports[`regression tests > click on an element and drag it > [dragged] appState
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -3268,7 +3258,6 @@ exports[`regression tests > click on an element and drag it > [end of test] appS
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -3505,7 +3494,6 @@ exports[`regression tests > click to select a shape > [end of test] appState 1`]
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -3764,7 +3752,6 @@ exports[`regression tests > click-drag to select a group > [end of test] appStat
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -4079,7 +4066,6 @@ exports[`regression tests > deleting last but one element in editing group shoul
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -4516,7 +4502,6 @@ exports[`regression tests > deselects group of selected elements on pointer down
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -4800,7 +4785,6 @@ exports[`regression tests > deselects group of selected elements on pointer up w
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -5077,7 +5061,6 @@ exports[`regression tests > deselects selected element on pointer down when poin
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -5286,7 +5269,6 @@ exports[`regression tests > deselects selected element, on pointer up, when clic
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -5487,7 +5469,6 @@ exports[`regression tests > double click to edit a group > [end of test] appStat
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -5881,7 +5862,6 @@ exports[`regression tests > drags selected elements from point inside common bou
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -6179,7 +6159,6 @@ exports[`regression tests > draw every type of shape > [end of test] appState 1`
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -6968,7 +6947,6 @@ exports[`regression tests > given a group of selected elements with an element t
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -7303,7 +7281,6 @@ exports[`regression tests > given a selected element A and a not selected elemen
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -7583,7 +7560,6 @@ exports[`regression tests > given selected element A with lower z-index than uns
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -7819,7 +7795,6 @@ exports[`regression tests > given selected element A with lower z-index than uns
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -8060,7 +8035,6 @@ exports[`regression tests > key 2 selects rectangle tool > [end of test] appStat
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -8241,7 +8215,6 @@ exports[`regression tests > key 3 selects diamond tool > [end of test] appState
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -8422,7 +8395,6 @@ exports[`regression tests > key 4 selects ellipse tool > [end of test] appState
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -8603,7 +8575,6 @@ exports[`regression tests > key 5 selects arrow tool > [end of test] appState 1`
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -8836,7 +8807,6 @@ exports[`regression tests > key 6 selects line tool > [end of test] appState 1`]
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -9067,7 +9037,6 @@ exports[`regression tests > key 7 selects freedraw tool > [end of test] appState
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -9260,7 +9229,6 @@ exports[`regression tests > key a selects arrow tool > [end of test] appState 1`
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -9493,7 +9461,6 @@ exports[`regression tests > key d selects diamond tool > [end of test] appState
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -9674,7 +9641,6 @@ exports[`regression tests > key l selects line tool > [end of test] appState 1`]
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -9905,7 +9871,6 @@ exports[`regression tests > key o selects ellipse tool > [end of test] appState
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -10086,7 +10051,6 @@ exports[`regression tests > key p selects freedraw tool > [end of test] appState
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -10279,7 +10243,6 @@ exports[`regression tests > key r selects rectangle tool > [end of test] appStat
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -10460,7 +10423,6 @@ exports[`regression tests > make a group and duplicate it > [end of test] appSta
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -10992,7 +10954,6 @@ exports[`regression tests > noop interaction after undo shouldn't create history
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -11273,7 +11234,6 @@ exports[`regression tests > pinch-to-zoom works > [end of test] appState 1`] = `
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -11397,7 +11357,6 @@ exports[`regression tests > shift click on selected element should deselect it o
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -11598,7 +11557,6 @@ exports[`regression tests > shift-click to multiselect, then drag > [end of test
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -11918,7 +11876,6 @@ exports[`regression tests > should group elements and ungroup them > [end of tes
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -12348,7 +12305,6 @@ exports[`regression tests > single-clicking on a subgroup of a selected group sh
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -12989,7 +12945,6 @@ exports[`regression tests > spacebar + drag scrolls the canvas > [end of test] a
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -13116,7 +13071,6 @@ exports[`regression tests > supports nested groups > [end of test] appState 1`]
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -13748,7 +13702,6 @@ exports[`regression tests > switches from group of selected elements to another
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -14088,7 +14041,6 @@ exports[`regression tests > switches selected element on pointer down > [end of
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -14353,7 +14305,6 @@ exports[`regression tests > two-finger scroll works > [end of test] appState 1`]
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -14477,7 +14428,6 @@ exports[`regression tests > undo/redo drawing an element > [end of test] appStat
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -14842,7 +14792,6 @@ exports[`regression tests > updates fontSize & fontFamily appState > [end of tes
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
@@ -14966,7 +14915,6 @@ exports[`regression tests > zoom hotkeys > [end of test] appState 1`] = `
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
|
|||||||
@@ -1,315 +0,0 @@
|
|||||||
import { Excalidraw } from "../index";
|
|
||||||
|
|
||||||
import { Pointer } from "./helpers/ui";
|
|
||||||
import { act, fireEvent, GlobalTestState, render, waitFor } from "./test-utils";
|
|
||||||
|
|
||||||
import type { ExcalidrawProps } from "../types";
|
|
||||||
|
|
||||||
describe("embeddable interactions", () => {
|
|
||||||
const h = window.h;
|
|
||||||
const mouse = new Pointer("mouse");
|
|
||||||
|
|
||||||
const renderGoogleDriveEmbeddable = async (
|
|
||||||
excalidrawProps: Partial<ExcalidrawProps> = {},
|
|
||||||
) => {
|
|
||||||
const renderResult = await render(<Excalidraw {...excalidrawProps} />);
|
|
||||||
const fileId = "1AbCdEfGhIjKlMnOpQrStUvWxYz123456";
|
|
||||||
const src = `https://drive.google.com/file/d/${fileId}/preview`;
|
|
||||||
let embeddable!: NonNullable<
|
|
||||||
ReturnType<typeof h.app.insertEmbeddableElement>
|
|
||||||
>;
|
|
||||||
|
|
||||||
act(() => {
|
|
||||||
const insertedEmbeddable = h.app.insertEmbeddableElement({
|
|
||||||
sceneX: 40,
|
|
||||||
sceneY: 40,
|
|
||||||
link: `https://drive.google.com/file/d/${fileId}/view?usp=sharing`,
|
|
||||||
});
|
|
||||||
|
|
||||||
if (!insertedEmbeddable) {
|
|
||||||
throw new Error("Google Drive embeddable not inserted");
|
|
||||||
}
|
|
||||||
|
|
||||||
embeddable = insertedEmbeddable;
|
|
||||||
});
|
|
||||||
|
|
||||||
(
|
|
||||||
h.app as unknown as {
|
|
||||||
embedsValidationStatus: Map<string, boolean>;
|
|
||||||
}
|
|
||||||
).embedsValidationStatus.set(embeddable.id, true);
|
|
||||||
|
|
||||||
act(() => {
|
|
||||||
h.setState({ width: 1000, height: 1000 });
|
|
||||||
h.app.scene.triggerUpdate();
|
|
||||||
});
|
|
||||||
|
|
||||||
const getIframe = () => {
|
|
||||||
const iframe = renderResult.container.querySelector<HTMLIFrameElement>(
|
|
||||||
"iframe.excalidraw__embeddable",
|
|
||||||
);
|
|
||||||
|
|
||||||
if (!iframe) {
|
|
||||||
throw new Error("Google Drive iframe not rendered");
|
|
||||||
}
|
|
||||||
|
|
||||||
return iframe;
|
|
||||||
};
|
|
||||||
|
|
||||||
await waitFor(() => {
|
|
||||||
expect(getIframe().src).toBe(src);
|
|
||||||
});
|
|
||||||
|
|
||||||
return {
|
|
||||||
...renderResult,
|
|
||||||
embeddable,
|
|
||||||
getIframe,
|
|
||||||
src,
|
|
||||||
};
|
|
||||||
};
|
|
||||||
|
|
||||||
const renderYouTubeEmbeddable = async (
|
|
||||||
excalidrawProps: Partial<ExcalidrawProps> = {},
|
|
||||||
) => {
|
|
||||||
const renderResult = await render(<Excalidraw {...excalidrawProps} />);
|
|
||||||
let embeddable!: NonNullable<
|
|
||||||
ReturnType<typeof h.app.insertEmbeddableElement>
|
|
||||||
>;
|
|
||||||
|
|
||||||
act(() => {
|
|
||||||
const insertedEmbeddable = h.app.insertEmbeddableElement({
|
|
||||||
sceneX: 40,
|
|
||||||
sceneY: 40,
|
|
||||||
link: "https://www.youtube.com/watch?v=gkGMXY0wekg",
|
|
||||||
});
|
|
||||||
|
|
||||||
if (!insertedEmbeddable) {
|
|
||||||
throw new Error("YouTube embeddable not inserted");
|
|
||||||
}
|
|
||||||
|
|
||||||
embeddable = insertedEmbeddable;
|
|
||||||
});
|
|
||||||
|
|
||||||
(
|
|
||||||
h.app as unknown as {
|
|
||||||
embedsValidationStatus: Map<string, boolean>;
|
|
||||||
}
|
|
||||||
).embedsValidationStatus.set(embeddable.id, true);
|
|
||||||
|
|
||||||
act(() => {
|
|
||||||
h.setState({ width: 1000, height: 1000 });
|
|
||||||
h.app.scene.triggerUpdate();
|
|
||||||
});
|
|
||||||
|
|
||||||
await waitFor(() => {
|
|
||||||
expect(
|
|
||||||
renderResult.container.querySelector("iframe.excalidraw__embeddable"),
|
|
||||||
).not.toBeNull();
|
|
||||||
});
|
|
||||||
|
|
||||||
return {
|
|
||||||
...renderResult,
|
|
||||||
embeddable,
|
|
||||||
};
|
|
||||||
};
|
|
||||||
|
|
||||||
const setActiveEmbeddable = (
|
|
||||||
embeddable: NonNullable<ReturnType<typeof h.app.insertEmbeddableElement>>,
|
|
||||||
) => {
|
|
||||||
act(() => {
|
|
||||||
h.setState({
|
|
||||||
activeEmbeddable: { element: embeddable, state: "active" },
|
|
||||||
});
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
it("lets the initial Google Drive video click land in the iframe center", async () => {
|
|
||||||
const { container, embeddable, getIframe, src } =
|
|
||||||
await renderGoogleDriveEmbeddable();
|
|
||||||
|
|
||||||
mouse.moveTo(
|
|
||||||
embeddable.x + embeddable.width / 2,
|
|
||||||
embeddable.y + embeddable.height / 2,
|
|
||||||
);
|
|
||||||
|
|
||||||
await waitFor(() => {
|
|
||||||
expect(
|
|
||||||
container.querySelector<HTMLElement>(
|
|
||||||
".excalidraw__embeddable-container__inner",
|
|
||||||
)?.style.pointerEvents,
|
|
||||||
).toBe("all");
|
|
||||||
expect(h.state.activeEmbeddable?.element.id).toBe(embeddable.id);
|
|
||||||
expect(h.state.activeEmbeddable?.state).toBe("active");
|
|
||||||
expect(
|
|
||||||
container.querySelectorAll(".excalidraw__embeddable-canvas-guard"),
|
|
||||||
).toHaveLength(4);
|
|
||||||
expect(
|
|
||||||
container.querySelector(".excalidraw__embeddable-hint"),
|
|
||||||
).toBeNull();
|
|
||||||
expect(getIframe().src).toBe(src);
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
it("returns Drive embeddable edge interactions to the canvas", async () => {
|
|
||||||
const { container, embeddable } = await renderGoogleDriveEmbeddable();
|
|
||||||
|
|
||||||
act(() => {
|
|
||||||
h.setState({
|
|
||||||
activeEmbeddable: { element: embeddable, state: "active" },
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
const guard = container.querySelector<HTMLElement>(
|
|
||||||
".excalidraw__embeddable-canvas-guard",
|
|
||||||
);
|
|
||||||
expect(guard).not.toBeNull();
|
|
||||||
|
|
||||||
fireEvent.pointerMove(guard!, {
|
|
||||||
clientX: embeddable.x + 1,
|
|
||||||
clientY: embeddable.y + 1,
|
|
||||||
});
|
|
||||||
|
|
||||||
await waitFor(() => {
|
|
||||||
expect(h.state.activeEmbeddable).toBeNull();
|
|
||||||
expect(
|
|
||||||
container.querySelector<HTMLElement>(
|
|
||||||
".excalidraw__embeddable-container__inner",
|
|
||||||
)?.style.pointerEvents,
|
|
||||||
).toBe("none");
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
it("deactivates an interactive embeddable on Ctrl/Cmd keydown", async () => {
|
|
||||||
const { embeddable } = await renderGoogleDriveEmbeddable({
|
|
||||||
handleKeyboardGlobally: true,
|
|
||||||
});
|
|
||||||
|
|
||||||
mouse.moveTo(
|
|
||||||
embeddable.x + embeddable.width / 2,
|
|
||||||
embeddable.y + embeddable.height / 2,
|
|
||||||
);
|
|
||||||
|
|
||||||
await waitFor(() => {
|
|
||||||
expect(h.state.activeEmbeddable?.state).toBe("active");
|
|
||||||
});
|
|
||||||
|
|
||||||
fireEvent.keyDown(document, {
|
|
||||||
key: "Control",
|
|
||||||
ctrlKey: true,
|
|
||||||
});
|
|
||||||
|
|
||||||
await waitFor(() => {
|
|
||||||
expect(h.state.activeEmbeddable).toBeNull();
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
it("handles Ctrl/Cmd wheel on Drive embeddable guards", async () => {
|
|
||||||
const { container, embeddable } = await renderGoogleDriveEmbeddable();
|
|
||||||
|
|
||||||
act(() => {
|
|
||||||
h.setState({
|
|
||||||
activeEmbeddable: { element: embeddable, state: "active" },
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
const guard = container.querySelector<HTMLElement>(
|
|
||||||
".excalidraw__embeddable-canvas-guard",
|
|
||||||
);
|
|
||||||
expect(guard).not.toBeNull();
|
|
||||||
|
|
||||||
const prevZoom = h.state.zoom.value;
|
|
||||||
|
|
||||||
fireEvent.wheel(guard!, {
|
|
||||||
clientX: embeddable.x + 1,
|
|
||||||
clientY: embeddable.y + 1,
|
|
||||||
ctrlKey: true,
|
|
||||||
deltaY: -100,
|
|
||||||
});
|
|
||||||
|
|
||||||
await waitFor(() => {
|
|
||||||
expect(h.state.activeEmbeddable).toBeNull();
|
|
||||||
expect(h.state.zoom.value).toBeGreaterThan(prevZoom);
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
it("deactivates a non-Drive interactive embeddable on Ctrl/Cmd keydown", async () => {
|
|
||||||
const { container, embeddable } = await renderYouTubeEmbeddable({
|
|
||||||
handleKeyboardGlobally: true,
|
|
||||||
});
|
|
||||||
|
|
||||||
setActiveEmbeddable(embeddable);
|
|
||||||
|
|
||||||
await waitFor(() => {
|
|
||||||
expect(
|
|
||||||
container.querySelector<HTMLElement>(
|
|
||||||
".excalidraw__embeddable-container__inner",
|
|
||||||
)?.style.pointerEvents,
|
|
||||||
).toBe("all");
|
|
||||||
expect(
|
|
||||||
container.querySelectorAll(".excalidraw__embeddable-canvas-guard"),
|
|
||||||
).toHaveLength(0);
|
|
||||||
});
|
|
||||||
|
|
||||||
fireEvent.keyDown(document, {
|
|
||||||
key: "Control",
|
|
||||||
ctrlKey: true,
|
|
||||||
});
|
|
||||||
|
|
||||||
await waitFor(() => {
|
|
||||||
expect(h.state.activeEmbeddable).toBeNull();
|
|
||||||
expect(
|
|
||||||
container.querySelector<HTMLElement>(
|
|
||||||
".excalidraw__embeddable-container__inner",
|
|
||||||
)?.style.pointerEvents,
|
|
||||||
).toBe("none");
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
it("deactivates a non-Drive interactive embeddable on parent-observed pinch", async () => {
|
|
||||||
const { embeddable } = await renderYouTubeEmbeddable();
|
|
||||||
|
|
||||||
setActiveEmbeddable(embeddable);
|
|
||||||
|
|
||||||
fireEvent.pointerDown(GlobalTestState.interactiveCanvas, {
|
|
||||||
clientX: embeddable.x + 10,
|
|
||||||
clientY: embeddable.y + 10,
|
|
||||||
pointerId: 1,
|
|
||||||
pointerType: "touch",
|
|
||||||
});
|
|
||||||
fireEvent.pointerDown(GlobalTestState.interactiveCanvas, {
|
|
||||||
clientX: embeddable.x + 30,
|
|
||||||
clientY: embeddable.y + 30,
|
|
||||||
pointerId: 2,
|
|
||||||
pointerType: "touch",
|
|
||||||
});
|
|
||||||
|
|
||||||
await waitFor(() => {
|
|
||||||
expect(h.state.activeEmbeddable).toBeNull();
|
|
||||||
});
|
|
||||||
|
|
||||||
fireEvent.pointerUp(GlobalTestState.interactiveCanvas, {
|
|
||||||
pointerId: 1,
|
|
||||||
pointerType: "touch",
|
|
||||||
});
|
|
||||||
fireEvent.pointerUp(GlobalTestState.interactiveCanvas, {
|
|
||||||
pointerId: 2,
|
|
||||||
pointerType: "touch",
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
it("deactivates a non-Drive interactive embeddable on Safari gesturestart", async () => {
|
|
||||||
const { embeddable } = await renderYouTubeEmbeddable();
|
|
||||||
|
|
||||||
setActiveEmbeddable(embeddable);
|
|
||||||
|
|
||||||
act(() => {
|
|
||||||
document.dispatchEvent(
|
|
||||||
new Event("gesturestart", { bubbles: true, cancelable: true }),
|
|
||||||
);
|
|
||||||
});
|
|
||||||
|
|
||||||
await waitFor(() => {
|
|
||||||
expect(h.state.activeEmbeddable).toBeNull();
|
|
||||||
});
|
|
||||||
});
|
|
||||||
});
|
|
||||||
@@ -314,7 +314,7 @@ describe("history", () => {
|
|||||||
expect.objectContaining({ id: rect2.id, isDeleted: true }),
|
expect.objectContaining({ id: rect2.id, isDeleted: true }),
|
||||||
]);
|
]);
|
||||||
|
|
||||||
mouse.downAt(-10, -10);
|
mouse.downAt(0, 0);
|
||||||
mouse.moveTo(25, 25);
|
mouse.moveTo(25, 25);
|
||||||
mouse.moveTo(50, 50);
|
mouse.moveTo(50, 50);
|
||||||
mouse.upAt(50, 50);
|
mouse.upAt(50, 50);
|
||||||
|
|||||||
@@ -468,7 +468,7 @@ describe("regression tests", () => {
|
|||||||
mouse.reset();
|
mouse.reset();
|
||||||
mouse.down();
|
mouse.down();
|
||||||
mouse.move(-1000, -1000);
|
mouse.move(-1000, -1000);
|
||||||
mouse.restorePosition(end[0] + 3, end[1] + 3);
|
mouse.restorePosition(...end);
|
||||||
mouse.up();
|
mouse.up();
|
||||||
|
|
||||||
expect(h.elements.length).toBe(3);
|
expect(h.elements.length).toBe(3);
|
||||||
@@ -519,7 +519,7 @@ describe("regression tests", () => {
|
|||||||
mouse.reset();
|
mouse.reset();
|
||||||
mouse.down();
|
mouse.down();
|
||||||
mouse.move(-1000, -1000);
|
mouse.move(-1000, -1000);
|
||||||
mouse.restorePosition(end[0] + 3, end[1] + 3);
|
mouse.restorePosition(...end);
|
||||||
mouse.up();
|
mouse.up();
|
||||||
|
|
||||||
for (const element of h.elements) {
|
for (const element of h.elements) {
|
||||||
@@ -537,7 +537,7 @@ describe("regression tests", () => {
|
|||||||
mouse.moveTo(-10, -10); // the NW resizing handle is at [0, 0], so moving further
|
mouse.moveTo(-10, -10); // the NW resizing handle is at [0, 0], so moving further
|
||||||
mouse.down();
|
mouse.down();
|
||||||
mouse.move(-1000, -1000);
|
mouse.move(-1000, -1000);
|
||||||
mouse.restorePosition(end[0] + 3, end[1] + 3);
|
mouse.restorePosition(...end);
|
||||||
mouse.up();
|
mouse.up();
|
||||||
|
|
||||||
Keyboard.withModifierKeys({ ctrl: true, shift: true }, () => {
|
Keyboard.withModifierKeys({ ctrl: true, shift: true }, () => {
|
||||||
|
|||||||
@@ -1,9 +1,7 @@
|
|||||||
import React from "react";
|
import React from "react";
|
||||||
import { vi } from "vitest";
|
import { vi } from "vitest";
|
||||||
|
|
||||||
import { KEYS, ROUNDNESS, reseed } from "@excalidraw/common";
|
import { KEYS, reseed } from "@excalidraw/common";
|
||||||
import { getElementBounds, getElementLineSegments } from "@excalidraw/element";
|
|
||||||
import { pointFrom, pointRotateRads, type LocalPoint } from "@excalidraw/math";
|
|
||||||
|
|
||||||
import { SHAPES } from "../components/shapes";
|
import { SHAPES } from "../components/shapes";
|
||||||
|
|
||||||
@@ -14,7 +12,6 @@ import * as StaticScene from "../renderer/staticScene";
|
|||||||
import { API } from "./helpers/api";
|
import { API } from "./helpers/api";
|
||||||
import { Keyboard, Pointer, UI } from "./helpers/ui";
|
import { Keyboard, Pointer, UI } from "./helpers/ui";
|
||||||
import {
|
import {
|
||||||
act,
|
|
||||||
render,
|
render,
|
||||||
fireEvent,
|
fireEvent,
|
||||||
mockBoundingClientRect,
|
mockBoundingClientRect,
|
||||||
@@ -42,19 +39,6 @@ const { h } = window;
|
|||||||
|
|
||||||
const mouse = new Pointer("mouse");
|
const mouse = new Pointer("mouse");
|
||||||
|
|
||||||
const getOutlineBounds = (element: ReturnType<typeof API.createElement>) => {
|
|
||||||
const sceneElement = API.getElement(element);
|
|
||||||
const elementsMap = h.scene.getNonDeletedElementsMap();
|
|
||||||
const points = getElementLineSegments(sceneElement, elementsMap).flat();
|
|
||||||
|
|
||||||
return [
|
|
||||||
Math.min(...points.map((point) => point[0])),
|
|
||||||
Math.min(...points.map((point) => point[1])),
|
|
||||||
Math.max(...points.map((point) => point[0])),
|
|
||||||
Math.max(...points.map((point) => point[1])),
|
|
||||||
] as const;
|
|
||||||
};
|
|
||||||
|
|
||||||
describe("box-selection", () => {
|
describe("box-selection", () => {
|
||||||
beforeEach(async () => {
|
beforeEach(async () => {
|
||||||
await render(<Excalidraw />);
|
await render(<Excalidraw />);
|
||||||
@@ -124,497 +108,6 @@ describe("box-selection", () => {
|
|||||||
|
|
||||||
assertSelectedElements([]);
|
assertSelectedElements([]);
|
||||||
});
|
});
|
||||||
|
|
||||||
it("should not select an element when the selection box only partially overlaps it", () => {
|
|
||||||
const rect1 = API.createElement({
|
|
||||||
type: "rectangle",
|
|
||||||
x: 0,
|
|
||||||
y: 0,
|
|
||||||
width: 50,
|
|
||||||
height: 50,
|
|
||||||
backgroundColor: "red",
|
|
||||||
fillStyle: "solid",
|
|
||||||
});
|
|
||||||
|
|
||||||
API.setElements([rect1]);
|
|
||||||
|
|
||||||
mouse.downAt(25, -20);
|
|
||||||
mouse.move(-1000, -1000);
|
|
||||||
mouse.moveTo(75, 70);
|
|
||||||
mouse.up();
|
|
||||||
|
|
||||||
assertSelectedElements([]);
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
describe("lasso reselection", () => {
|
|
||||||
beforeEach(async () => {
|
|
||||||
await render(<Excalidraw />);
|
|
||||||
});
|
|
||||||
|
|
||||||
it("should allow ctrl+alt lasso reselection when starting inside the active common bounds", () => {
|
|
||||||
const rectA = API.createElement({
|
|
||||||
type: "rectangle",
|
|
||||||
x: 0,
|
|
||||||
y: 0,
|
|
||||||
width: 100,
|
|
||||||
height: 100,
|
|
||||||
backgroundColor: "red",
|
|
||||||
fillStyle: "solid",
|
|
||||||
});
|
|
||||||
const rectB = API.createElement({
|
|
||||||
type: "rectangle",
|
|
||||||
x: 220,
|
|
||||||
y: 0,
|
|
||||||
width: 100,
|
|
||||||
height: 100,
|
|
||||||
backgroundColor: "blue",
|
|
||||||
fillStyle: "solid",
|
|
||||||
});
|
|
||||||
|
|
||||||
API.setElements([rectA, rectB]);
|
|
||||||
mouse.select([rectA, rectB]);
|
|
||||||
act(() => {
|
|
||||||
h.app.setActiveTool({ type: "lasso" });
|
|
||||||
});
|
|
||||||
|
|
||||||
Keyboard.withModifierKeys({ ctrl: true, alt: true }, () => {
|
|
||||||
mouse.downAt(110, 50);
|
|
||||||
mouse.moveTo(50, -20);
|
|
||||||
|
|
||||||
expect(h.app.lassoTrail.hasCurrentTrail).toBe(true);
|
|
||||||
|
|
||||||
mouse.moveTo(-20, 50);
|
|
||||||
mouse.moveTo(50, 120);
|
|
||||||
mouse.moveTo(110, 50);
|
|
||||||
mouse.up();
|
|
||||||
});
|
|
||||||
|
|
||||||
assertSelectedElements([rectA.id]);
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
describe("box-selection overlap mode", () => {
|
|
||||||
const boxSelect = (
|
|
||||||
startX: number,
|
|
||||||
startY: number,
|
|
||||||
endX: number,
|
|
||||||
endY: number,
|
|
||||||
) => {
|
|
||||||
mouse.downAt(startX, startY);
|
|
||||||
mouse.move(-1000, -1000);
|
|
||||||
mouse.moveTo(endX, endY);
|
|
||||||
mouse.up();
|
|
||||||
};
|
|
||||||
|
|
||||||
const boxSelectTopLeftAabbCorner = (
|
|
||||||
element: ReturnType<typeof API.createElement>,
|
|
||||||
) => {
|
|
||||||
const sceneElement = API.getElement(element);
|
|
||||||
const elementsMap = h.scene.getNonDeletedElementsMap();
|
|
||||||
const [x1, y1] = getElementBounds(sceneElement, elementsMap);
|
|
||||||
|
|
||||||
boxSelect(x1 + 2, y1 + 2, x1 + 12, y1 + 12);
|
|
||||||
};
|
|
||||||
|
|
||||||
const boxSelectTopRightAabbCorner = (
|
|
||||||
element: ReturnType<typeof API.createElement>,
|
|
||||||
) => {
|
|
||||||
const sceneElement = API.getElement(element);
|
|
||||||
const elementsMap = h.scene.getNonDeletedElementsMap();
|
|
||||||
const [, y1, x2] = getElementBounds(sceneElement, elementsMap);
|
|
||||||
|
|
||||||
boxSelect(x2 - 12, y1 + 2, x2 - 2, y1 + 12);
|
|
||||||
};
|
|
||||||
|
|
||||||
const boxSelectTopLeftRotatedLocalBoundsCorner = (
|
|
||||||
element: ReturnType<typeof API.createElement>,
|
|
||||||
) => {
|
|
||||||
const sceneElement = API.getElement(element);
|
|
||||||
const elementsMap = h.scene.getNonDeletedElementsMap();
|
|
||||||
const [x1, y1, x2, y2] = getElementBounds(sceneElement, elementsMap, true);
|
|
||||||
const center = pointFrom((x1 + x2) / 2, (y1 + y2) / 2);
|
|
||||||
const [cornerX, cornerY] = pointRotateRads(
|
|
||||||
pointFrom(x1, y1),
|
|
||||||
center,
|
|
||||||
sceneElement.angle,
|
|
||||||
);
|
|
||||||
|
|
||||||
boxSelect(cornerX - 4, cornerY - 4, cornerX + 4, cornerY + 4);
|
|
||||||
};
|
|
||||||
|
|
||||||
beforeEach(async () => {
|
|
||||||
await render(
|
|
||||||
<Excalidraw
|
|
||||||
initialData={{ appState: { boxSelectionMode: "overlap" } }}
|
|
||||||
/>,
|
|
||||||
);
|
|
||||||
});
|
|
||||||
|
|
||||||
it("should select an element when the selection box partially overlaps it", () => {
|
|
||||||
const rect1 = API.createElement({
|
|
||||||
type: "rectangle",
|
|
||||||
x: 0,
|
|
||||||
y: 0,
|
|
||||||
width: 50,
|
|
||||||
height: 50,
|
|
||||||
backgroundColor: "red",
|
|
||||||
fillStyle: "solid",
|
|
||||||
});
|
|
||||||
|
|
||||||
API.setElements([rect1]);
|
|
||||||
|
|
||||||
boxSelect(25, -20, 75, 70);
|
|
||||||
|
|
||||||
assertSelectedElements([rect1.id]);
|
|
||||||
});
|
|
||||||
|
|
||||||
it("should not select a transparent rectangle when the selection box stays inside it", () => {
|
|
||||||
const rect1 = API.createElement({
|
|
||||||
type: "rectangle",
|
|
||||||
x: 0,
|
|
||||||
y: 0,
|
|
||||||
width: 100,
|
|
||||||
height: 100,
|
|
||||||
backgroundColor: "transparent",
|
|
||||||
fillStyle: "solid",
|
|
||||||
});
|
|
||||||
|
|
||||||
API.setElements([rect1]);
|
|
||||||
|
|
||||||
boxSelect(25, 25, 75, 75);
|
|
||||||
|
|
||||||
assertSelectedElements([]);
|
|
||||||
});
|
|
||||||
|
|
||||||
it("should select a transparent rectangle when the selection box crosses its outline", () => {
|
|
||||||
const rect1 = API.createElement({
|
|
||||||
type: "rectangle",
|
|
||||||
x: 0,
|
|
||||||
y: 0,
|
|
||||||
width: 100,
|
|
||||||
height: 100,
|
|
||||||
backgroundColor: "transparent",
|
|
||||||
fillStyle: "solid",
|
|
||||||
});
|
|
||||||
|
|
||||||
API.setElements([rect1]);
|
|
||||||
|
|
||||||
boxSelect(25, 25, 125, 75);
|
|
||||||
|
|
||||||
assertSelectedElements([rect1.id]);
|
|
||||||
});
|
|
||||||
|
|
||||||
it("should not select a rotated transparent rectangle when the selection box stays inside it", () => {
|
|
||||||
const rect1 = API.createElement({
|
|
||||||
type: "rectangle",
|
|
||||||
x: 0,
|
|
||||||
y: 0,
|
|
||||||
width: 100,
|
|
||||||
height: 100,
|
|
||||||
angle: Math.PI / 4,
|
|
||||||
backgroundColor: "transparent",
|
|
||||||
fillStyle: "solid",
|
|
||||||
});
|
|
||||||
|
|
||||||
API.setElements([rect1]);
|
|
||||||
|
|
||||||
boxSelect(40, 40, 60, 60);
|
|
||||||
|
|
||||||
assertSelectedElements([]);
|
|
||||||
});
|
|
||||||
|
|
||||||
it("should select a rotated rounded rectangle when the selection box contains its outline but not its bounds", () => {
|
|
||||||
const rect = API.createElement({
|
|
||||||
type: "rectangle",
|
|
||||||
x: 0,
|
|
||||||
y: 0,
|
|
||||||
width: 100,
|
|
||||||
height: 180,
|
|
||||||
angle: Math.PI / 6,
|
|
||||||
backgroundColor: "transparent",
|
|
||||||
fillStyle: "solid",
|
|
||||||
roundness: { type: ROUNDNESS.ADAPTIVE_RADIUS },
|
|
||||||
roughness: 0,
|
|
||||||
});
|
|
||||||
|
|
||||||
API.setElements([rect]);
|
|
||||||
|
|
||||||
const sceneRect = API.getElement(rect);
|
|
||||||
const elementsMap = h.scene.getNonDeletedElementsMap();
|
|
||||||
const [boundsX1, boundsY1, boundsX2, boundsY2] = getElementBounds(
|
|
||||||
sceneRect,
|
|
||||||
elementsMap,
|
|
||||||
);
|
|
||||||
const [outlineX1, outlineY1, outlineX2, outlineY2] = getOutlineBounds(rect);
|
|
||||||
|
|
||||||
expect(outlineX1).toBeGreaterThan(boundsX1 - 1);
|
|
||||||
expect(outlineY1).toBeGreaterThan(boundsY1 - 1);
|
|
||||||
expect(outlineX2).toBeLessThan(boundsX2 + 1);
|
|
||||||
expect(outlineY2).toBeLessThan(boundsY2 + 1);
|
|
||||||
|
|
||||||
boxSelect(
|
|
||||||
outlineX1 - (outlineX1 - boundsX1) / 2,
|
|
||||||
outlineY1 - (outlineY1 - boundsY1) / 2,
|
|
||||||
outlineX2 + (boundsX2 - outlineX2) / 2,
|
|
||||||
outlineY2 + (boundsY2 - outlineY2) / 2,
|
|
||||||
);
|
|
||||||
|
|
||||||
assertSelectedElements([rect.id]);
|
|
||||||
});
|
|
||||||
|
|
||||||
it("should not select a filled rotated rectangle when the selection box only overlaps its axis-aligned bounds", () => {
|
|
||||||
const rect = API.createElement({
|
|
||||||
type: "rectangle",
|
|
||||||
x: 0,
|
|
||||||
y: 0,
|
|
||||||
width: 100,
|
|
||||||
height: 100,
|
|
||||||
angle: Math.PI / 4,
|
|
||||||
backgroundColor: "red",
|
|
||||||
fillStyle: "solid",
|
|
||||||
});
|
|
||||||
|
|
||||||
API.setElements([rect]);
|
|
||||||
|
|
||||||
boxSelectTopLeftAabbCorner(rect);
|
|
||||||
|
|
||||||
assertSelectedElements([]);
|
|
||||||
});
|
|
||||||
|
|
||||||
it("should not select a filled ellipse when the selection box only overlaps its bounds corner", () => {
|
|
||||||
const ellipse = API.createElement({
|
|
||||||
type: "ellipse",
|
|
||||||
x: 0,
|
|
||||||
y: 0,
|
|
||||||
width: 100,
|
|
||||||
height: 100,
|
|
||||||
backgroundColor: "red",
|
|
||||||
fillStyle: "solid",
|
|
||||||
});
|
|
||||||
|
|
||||||
API.setElements([ellipse]);
|
|
||||||
|
|
||||||
boxSelectTopRightAabbCorner(ellipse);
|
|
||||||
|
|
||||||
assertSelectedElements([]);
|
|
||||||
});
|
|
||||||
|
|
||||||
it("should not select a filled diamond when the selection box only overlaps its bounds corner", () => {
|
|
||||||
const diamond = API.createElement({
|
|
||||||
type: "diamond",
|
|
||||||
x: 0,
|
|
||||||
y: 0,
|
|
||||||
width: 100,
|
|
||||||
height: 100,
|
|
||||||
backgroundColor: "red",
|
|
||||||
fillStyle: "solid",
|
|
||||||
});
|
|
||||||
|
|
||||||
API.setElements([diamond]);
|
|
||||||
|
|
||||||
boxSelectTopRightAabbCorner(diamond);
|
|
||||||
|
|
||||||
assertSelectedElements([]);
|
|
||||||
});
|
|
||||||
|
|
||||||
it("should not select a filled rotated ellipse when the selection box only overlaps its axis-aligned bounds", () => {
|
|
||||||
const ellipse = API.createElement({
|
|
||||||
type: "ellipse",
|
|
||||||
x: 0,
|
|
||||||
y: 0,
|
|
||||||
width: 100,
|
|
||||||
height: 100,
|
|
||||||
angle: Math.PI / 4,
|
|
||||||
backgroundColor: "red",
|
|
||||||
fillStyle: "solid",
|
|
||||||
});
|
|
||||||
|
|
||||||
API.setElements([ellipse]);
|
|
||||||
|
|
||||||
boxSelectTopLeftRotatedLocalBoundsCorner(ellipse);
|
|
||||||
|
|
||||||
assertSelectedElements([]);
|
|
||||||
});
|
|
||||||
|
|
||||||
it("should not select a filled rotated diamond when the selection box only overlaps its rotated local bounds", () => {
|
|
||||||
const diamond = API.createElement({
|
|
||||||
type: "diamond",
|
|
||||||
x: 0,
|
|
||||||
y: 0,
|
|
||||||
width: 100,
|
|
||||||
height: 100,
|
|
||||||
angle: Math.PI / 4,
|
|
||||||
backgroundColor: "red",
|
|
||||||
fillStyle: "solid",
|
|
||||||
});
|
|
||||||
|
|
||||||
API.setElements([diamond]);
|
|
||||||
|
|
||||||
boxSelectTopLeftRotatedLocalBoundsCorner(diamond);
|
|
||||||
|
|
||||||
assertSelectedElements([]);
|
|
||||||
});
|
|
||||||
|
|
||||||
it("should not select rotated text when the selection box only overlaps its axis-aligned bounds", () => {
|
|
||||||
const text = API.createElement({
|
|
||||||
type: "text",
|
|
||||||
x: 0,
|
|
||||||
y: 0,
|
|
||||||
width: 100,
|
|
||||||
height: 100,
|
|
||||||
angle: Math.PI / 4,
|
|
||||||
text: "test",
|
|
||||||
});
|
|
||||||
|
|
||||||
API.setElements([text]);
|
|
||||||
|
|
||||||
boxSelect(-18, -18, -8, -8);
|
|
||||||
|
|
||||||
assertSelectedElements([]);
|
|
||||||
});
|
|
||||||
|
|
||||||
it("should not select rotated image when the selection box only overlaps its axis-aligned bounds", () => {
|
|
||||||
const image = API.createElement({
|
|
||||||
type: "image",
|
|
||||||
x: 0,
|
|
||||||
y: 0,
|
|
||||||
width: 100,
|
|
||||||
height: 100,
|
|
||||||
angle: Math.PI / 4,
|
|
||||||
fileId: "file_A",
|
|
||||||
status: "saved",
|
|
||||||
});
|
|
||||||
|
|
||||||
API.setElements([image]);
|
|
||||||
|
|
||||||
boxSelect(-18, -18, -8, -8);
|
|
||||||
|
|
||||||
assertSelectedElements([]);
|
|
||||||
});
|
|
||||||
|
|
||||||
it("should deselect a selected rotated rectangle when clicking in the empty corner of its axis-aligned bounds", () => {
|
|
||||||
const rect = API.createElement({
|
|
||||||
type: "rectangle",
|
|
||||||
x: 0,
|
|
||||||
y: 0,
|
|
||||||
width: 100,
|
|
||||||
height: 100,
|
|
||||||
angle: Math.PI / 4,
|
|
||||||
backgroundColor: "red",
|
|
||||||
fillStyle: "solid",
|
|
||||||
});
|
|
||||||
|
|
||||||
API.setElements([rect]);
|
|
||||||
|
|
||||||
mouse.clickAt(50, 50);
|
|
||||||
assertSelectedElements([rect.id]);
|
|
||||||
|
|
||||||
const sceneRect = API.getElement(rect);
|
|
||||||
const elementsMap = h.scene.getNonDeletedElementsMap();
|
|
||||||
const [x1, y1] = getElementBounds(sceneRect, elementsMap);
|
|
||||||
|
|
||||||
mouse.clickAt(x1 + 2, y1 + 2);
|
|
||||||
|
|
||||||
assertSelectedElements([]);
|
|
||||||
});
|
|
||||||
|
|
||||||
it("should not select a line when the selection box only overlaps its bounds", () => {
|
|
||||||
const line = API.createElement({
|
|
||||||
type: "line",
|
|
||||||
x: 0,
|
|
||||||
y: 0,
|
|
||||||
width: 100,
|
|
||||||
height: 100,
|
|
||||||
backgroundColor: "transparent",
|
|
||||||
points: [pointFrom<LocalPoint>(0, 0), pointFrom<LocalPoint>(100, 100)],
|
|
||||||
});
|
|
||||||
|
|
||||||
API.setElements([line]);
|
|
||||||
|
|
||||||
boxSelect(20, 50, 30, 60);
|
|
||||||
|
|
||||||
assertSelectedElements([]);
|
|
||||||
});
|
|
||||||
|
|
||||||
it("should not click-select rotated freedraw in the corner of its axis-aligned bounds", () => {
|
|
||||||
const freedraw = API.createElement({
|
|
||||||
type: "freedraw",
|
|
||||||
x: 0,
|
|
||||||
y: 0,
|
|
||||||
width: 100,
|
|
||||||
height: 100,
|
|
||||||
angle: Math.PI / 4,
|
|
||||||
backgroundColor: "transparent",
|
|
||||||
points: [
|
|
||||||
pointFrom<LocalPoint>(0, 0),
|
|
||||||
pointFrom<LocalPoint>(100, 0),
|
|
||||||
pointFrom<LocalPoint>(100, 100),
|
|
||||||
pointFrom<LocalPoint>(0, 100),
|
|
||||||
pointFrom<LocalPoint>(0, 0),
|
|
||||||
],
|
|
||||||
});
|
|
||||||
|
|
||||||
API.setElements([freedraw]);
|
|
||||||
|
|
||||||
const sceneFreedraw = API.getElement(freedraw);
|
|
||||||
const elementsMap = h.scene.getNonDeletedElementsMap();
|
|
||||||
const [x1, y1] = getElementBounds(sceneFreedraw, elementsMap);
|
|
||||||
|
|
||||||
mouse.clickAt(x1 + 2, y1 + 2);
|
|
||||||
|
|
||||||
assertSelectedElements([]);
|
|
||||||
});
|
|
||||||
|
|
||||||
it("should not select a freedraw when the selection box only overlaps its bounds", () => {
|
|
||||||
const freedraw = API.createElement({
|
|
||||||
type: "freedraw",
|
|
||||||
x: 0,
|
|
||||||
y: 0,
|
|
||||||
width: 100,
|
|
||||||
height: 100,
|
|
||||||
backgroundColor: "transparent",
|
|
||||||
points: [
|
|
||||||
pointFrom<LocalPoint>(0, 0),
|
|
||||||
pointFrom<LocalPoint>(50, 50),
|
|
||||||
pointFrom<LocalPoint>(100, 100),
|
|
||||||
],
|
|
||||||
});
|
|
||||||
|
|
||||||
API.setElements([freedraw]);
|
|
||||||
|
|
||||||
boxSelect(20, 50, 30, 60);
|
|
||||||
|
|
||||||
assertSelectedElements([]);
|
|
||||||
});
|
|
||||||
|
|
||||||
it("should not select a transparent framed element when the selection box stays inside its clipped bounds", () => {
|
|
||||||
const frame = API.createElement({
|
|
||||||
type: "frame",
|
|
||||||
x: 0,
|
|
||||||
y: 0,
|
|
||||||
width: 100,
|
|
||||||
height: 100,
|
|
||||||
backgroundColor: "transparent",
|
|
||||||
fillStyle: "solid",
|
|
||||||
});
|
|
||||||
const rect1 = API.createElement({
|
|
||||||
type: "rectangle",
|
|
||||||
x: 50,
|
|
||||||
y: 10,
|
|
||||||
width: 100,
|
|
||||||
height: 80,
|
|
||||||
frameId: frame.id,
|
|
||||||
backgroundColor: "transparent",
|
|
||||||
fillStyle: "solid",
|
|
||||||
});
|
|
||||||
|
|
||||||
API.setElements([frame, rect1]);
|
|
||||||
|
|
||||||
boxSelect(60, 20, 90, 60);
|
|
||||||
|
|
||||||
assertSelectedElements([]);
|
|
||||||
});
|
|
||||||
});
|
});
|
||||||
|
|
||||||
describe("inner box-selection", () => {
|
describe("inner box-selection", () => {
|
||||||
|
|||||||
@@ -269,8 +269,6 @@ export type ObservedElementsAppState = {
|
|||||||
activeLockedId: AppState["activeLockedId"];
|
activeLockedId: AppState["activeLockedId"];
|
||||||
};
|
};
|
||||||
|
|
||||||
export type BoxSelectionMode = "contain" | "overlap";
|
|
||||||
|
|
||||||
export interface AppState {
|
export interface AppState {
|
||||||
contextMenu: {
|
contextMenu: {
|
||||||
items: ContextMenuItems;
|
items: ContextMenuItems;
|
||||||
@@ -309,8 +307,6 @@ export interface AppState {
|
|||||||
* `bindingPreference` and keyboard modifiers (ctrl/alt)
|
* `bindingPreference` and keyboard modifiers (ctrl/alt)
|
||||||
*/
|
*/
|
||||||
isBindingEnabled: boolean;
|
isBindingEnabled: boolean;
|
||||||
/** user box selection preference; defaults to "contain" when unset */
|
|
||||||
boxSelectionMode: BoxSelectionMode;
|
|
||||||
/** user arrow binding preference */
|
/** user arrow binding preference */
|
||||||
bindingPreference: "enabled" | "disabled";
|
bindingPreference: "enabled" | "disabled";
|
||||||
/** user preference whether arrow snap to midpoints while binding */
|
/** user preference whether arrow snap to midpoints while binding */
|
||||||
|
|||||||
@@ -1,3 +1,5 @@
|
|||||||
|
export const PRECISION = 10e-5;
|
||||||
|
|
||||||
// Legendre-Gauss abscissae (x values) and weights for n=24
|
// Legendre-Gauss abscissae (x values) and weights for n=24
|
||||||
// Refeerence: https://pomax.github.io/bezierinfo/legendre-gauss.html
|
// Refeerence: https://pomax.github.io/bezierinfo/legendre-gauss.html
|
||||||
export const LegendreGaussN24TValues = [
|
export const LegendreGaussN24TValues = [
|
||||||
|
|||||||
@@ -137,17 +137,8 @@ const calculate = <Point extends GlobalPoint | LocalPoint>(
|
|||||||
[t0, s0]: [number, number],
|
[t0, s0]: [number, number],
|
||||||
l: LineSegment<Point>,
|
l: LineSegment<Point>,
|
||||||
c: Curve<Point>,
|
c: Curve<Point>,
|
||||||
tolerance: number = 1e-2,
|
|
||||||
iterLimit: number = 4,
|
|
||||||
) => {
|
) => {
|
||||||
const solution = solveWithAnalyticalJacobian(
|
const solution = solveWithAnalyticalJacobian(c, l, t0, s0, 1e-2, 4);
|
||||||
c,
|
|
||||||
l,
|
|
||||||
t0,
|
|
||||||
s0,
|
|
||||||
tolerance,
|
|
||||||
iterLimit,
|
|
||||||
);
|
|
||||||
|
|
||||||
if (!solution) {
|
if (!solution) {
|
||||||
return null;
|
return null;
|
||||||
@@ -167,43 +158,18 @@ const calculate = <Point extends GlobalPoint | LocalPoint>(
|
|||||||
*/
|
*/
|
||||||
export function curveIntersectLineSegment<
|
export function curveIntersectLineSegment<
|
||||||
Point extends GlobalPoint | LocalPoint,
|
Point extends GlobalPoint | LocalPoint,
|
||||||
>(
|
>(c: Curve<Point>, l: LineSegment<Point>): Point[] {
|
||||||
c: Curve<Point>,
|
let solution = calculate(initial_guesses[0], l, c);
|
||||||
l: LineSegment<Point>,
|
|
||||||
opts?: {
|
|
||||||
tolerance?: number;
|
|
||||||
iterLimit?: number;
|
|
||||||
},
|
|
||||||
): Point[] {
|
|
||||||
let solution = calculate(
|
|
||||||
initial_guesses[0],
|
|
||||||
l,
|
|
||||||
c,
|
|
||||||
opts?.tolerance,
|
|
||||||
opts?.iterLimit,
|
|
||||||
);
|
|
||||||
if (solution) {
|
if (solution) {
|
||||||
return [solution];
|
return [solution];
|
||||||
}
|
}
|
||||||
|
|
||||||
solution = calculate(
|
solution = calculate(initial_guesses[1], l, c);
|
||||||
initial_guesses[1],
|
|
||||||
l,
|
|
||||||
c,
|
|
||||||
opts?.tolerance,
|
|
||||||
opts?.iterLimit,
|
|
||||||
);
|
|
||||||
if (solution) {
|
if (solution) {
|
||||||
return [solution];
|
return [solution];
|
||||||
}
|
}
|
||||||
|
|
||||||
solution = calculate(
|
solution = calculate(initial_guesses[2], l, c);
|
||||||
initial_guesses[2],
|
|
||||||
l,
|
|
||||||
c,
|
|
||||||
opts?.tolerance,
|
|
||||||
opts?.iterLimit,
|
|
||||||
);
|
|
||||||
if (solution) {
|
if (solution) {
|
||||||
return [solution];
|
return [solution];
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -13,7 +13,6 @@ exports[`exportToSvg > with default arguments 1`] = `
|
|||||||
},
|
},
|
||||||
"bindMode": "orbit",
|
"bindMode": "orbit",
|
||||||
"bindingPreference": "enabled",
|
"bindingPreference": "enabled",
|
||||||
"boxSelectionMode": "contain",
|
|
||||||
"collaborators": Map {},
|
"collaborators": Map {},
|
||||||
"contextMenu": null,
|
"contextMenu": null,
|
||||||
"croppingElementId": null,
|
"croppingElementId": null,
|
||||||
|
|||||||
@@ -90,13 +90,6 @@ module.exports.woff2BrowserPlugin = () => {
|
|||||||
type="font/woff2"
|
type="font/woff2"
|
||||||
crossorigin="anonymous"
|
crossorigin="anonymous"
|
||||||
/>
|
/>
|
||||||
<link
|
|
||||||
rel="preload"
|
|
||||||
href="${OSS_FONTS_CDN}fonts/Assistant/Assistant-SemiBold.woff2"
|
|
||||||
as="font"
|
|
||||||
type="font/woff2"
|
|
||||||
crossorigin="anonymous"
|
|
||||||
/>
|
|
||||||
<link
|
<link
|
||||||
rel="preload"
|
rel="preload"
|
||||||
href="${OSS_FONTS_CDN}fonts/ComicShanns/ComicShanns-Regular-279a7b317d12eb88de06167bd672b4b4.woff2"
|
href="${OSS_FONTS_CDN}fonts/ComicShanns/ComicShanns-Regular-279a7b317d12eb88de06167bd672b4b4.woff2"
|
||||||
|
|||||||
Reference in New Issue
Block a user