diff --git a/packages/common/src/constants.ts b/packages/common/src/constants.ts index 7eb36d5d9..7e8c49ea1 100644 --- a/packages/common/src/constants.ts +++ b/packages/common/src/constants.ts @@ -112,7 +112,6 @@ export const YOUTUBE_STATES = { export const ENV = { TEST: "test", DEVELOPMENT: "development", - PRODUCTION: "production", }; export const CLASSES = { diff --git a/packages/common/src/utils.ts b/packages/common/src/utils.ts index b6e9fdd78..54eaa67cc 100644 --- a/packages/common/src/utils.ts +++ b/packages/common/src/utils.ts @@ -739,8 +739,6 @@ export const isTestEnv = () => import.meta.env.MODE === ENV.TEST; export const isDevEnv = () => import.meta.env.MODE === ENV.DEVELOPMENT; -export const isProdEnv = () => import.meta.env.MODE === ENV.PRODUCTION; - export const isServerEnv = () => typeof process !== "undefined" && !!process?.env?.NODE_ENV; diff --git a/packages/element/src/elbowArrow.ts b/packages/element/src/elbowArrow.ts index 02cc4da67..b9c602b9b 100644 --- a/packages/element/src/elbowArrow.ts +++ b/packages/element/src/elbowArrow.ts @@ -123,7 +123,17 @@ const calculatePadding = ( return size > 75 ? 40 - : Math.min(Math.max(Math.min(width / 2 - 1, height / 2 - 1), 10), 40); + : Math.min( + Math.max( + headingIsHorizontal(startHeading) ? width / 2 - 1 : height / 2 - 1, + 10, + ), + Math.max( + headingIsHorizontal(endHeading) ? width / 2 - 1 : height / 2 - 1, + 10, + ), + 40, + ); }; const handleSegmentRenormalization = ( diff --git a/packages/element/src/textElement.ts b/packages/element/src/textElement.ts index 55c3f692c..ea27c318f 100644 --- a/packages/element/src/textElement.ts +++ b/packages/element/src/textElement.ts @@ -6,8 +6,6 @@ import { TEXT_ALIGN, VERTICAL_ALIGN, getFontString, - isProdEnv, - invariant, } from "@excalidraw/common"; import type { AppState } from "@excalidraw/excalidraw/types"; @@ -28,8 +26,6 @@ import { isTextElement, } from "./typeChecks"; -import type { Radians } from "../../math/src"; - import type { MaybeTransformHandleType } from "./transformHandles"; import type { ElementsMap, @@ -48,25 +44,13 @@ export const redrawTextBoundingBox = ( informMutation = true, ) => { let maxWidth = undefined; - - if (!isProdEnv()) { - invariant( - !container || !isArrowElement(container) || textElement.angle === 0, - "text element angle must be 0 if bound to arrow container", - ); - } - const boundTextUpdates = { x: textElement.x, y: textElement.y, text: textElement.text, width: textElement.width, height: textElement.height, - angle: (container - ? isArrowElement(container) - ? 0 - : container.angle - : textElement.angle) as Radians, + angle: container?.angle ?? textElement.angle, }; boundTextUpdates.text = textElement.text; @@ -351,10 +335,7 @@ export const getTextElementAngle = ( textElement: ExcalidrawTextElement, container: ExcalidrawTextContainer | null, ) => { - if (isArrowElement(container)) { - return 0; - } - if (!container) { + if (!container || isArrowElement(container)) { return textElement.angle; } return container.angle; diff --git a/packages/excalidraw/actions/actionBoundText.tsx b/packages/excalidraw/actions/actionBoundText.tsx index d08ad341e..ae18c0d98 100644 --- a/packages/excalidraw/actions/actionBoundText.tsx +++ b/packages/excalidraw/actions/actionBoundText.tsx @@ -21,7 +21,6 @@ import { import { hasBoundTextElement, - isArrowElement, isTextBindableContainer, isTextElement, isUsingAdaptiveRadius, @@ -47,8 +46,6 @@ import { CaptureUpdateAction } from "../store"; import { register } from "./register"; -import type { Radians } from "../../math/src"; - import type { AppState } from "../types"; export const actionUnbindText = register({ @@ -158,7 +155,6 @@ export const actionBindText = register({ verticalAlign: VERTICAL_ALIGN.MIDDLE, textAlign: TEXT_ALIGN.CENTER, autoResize: true, - angle: (isArrowElement(container) ? 0 : container?.angle ?? 0) as Radians, }); mutateElement(container, { boundElements: (container.boundElements || []).concat({ diff --git a/packages/excalidraw/components/App.tsx b/packages/excalidraw/components/App.tsx index 976abfd76..276cde027 100644 --- a/packages/excalidraw/components/App.tsx +++ b/packages/excalidraw/components/App.tsx @@ -5352,37 +5352,37 @@ class App extends React.Component { y: sceneY, }); - const element = - existingTextElement || - newTextElement({ - x: parentCenterPosition ? parentCenterPosition.elementCenterX : sceneX, - y: parentCenterPosition ? parentCenterPosition.elementCenterY : sceneY, - strokeColor: this.state.currentItemStrokeColor, - backgroundColor: this.state.currentItemBackgroundColor, - fillStyle: this.state.currentItemFillStyle, - strokeWidth: this.state.currentItemStrokeWidth, - strokeStyle: this.state.currentItemStrokeStyle, - roughness: this.state.currentItemRoughness, - opacity: this.state.currentItemOpacity, - text: "", - fontSize, - fontFamily, - textAlign: parentCenterPosition - ? "center" - : this.state.currentItemTextAlign, - verticalAlign: parentCenterPosition - ? VERTICAL_ALIGN.MIDDLE - : DEFAULT_VERTICAL_ALIGN, - containerId: shouldBindToContainer ? container?.id : undefined, - groupIds: container?.groupIds ?? [], - lineHeight, - angle: container - ? isArrowElement(container) - ? (0 as Radians) - : container.angle - : (0 as Radians), - frameId: topLayerFrame ? topLayerFrame.id : null, - }); + const element = existingTextElement + ? existingTextElement + : newTextElement({ + x: parentCenterPosition + ? parentCenterPosition.elementCenterX + : sceneX, + y: parentCenterPosition + ? parentCenterPosition.elementCenterY + : sceneY, + strokeColor: this.state.currentItemStrokeColor, + backgroundColor: this.state.currentItemBackgroundColor, + fillStyle: this.state.currentItemFillStyle, + strokeWidth: this.state.currentItemStrokeWidth, + strokeStyle: this.state.currentItemStrokeStyle, + roughness: this.state.currentItemRoughness, + opacity: this.state.currentItemOpacity, + text: "", + fontSize, + fontFamily, + textAlign: parentCenterPosition + ? "center" + : this.state.currentItemTextAlign, + verticalAlign: parentCenterPosition + ? VERTICAL_ALIGN.MIDDLE + : DEFAULT_VERTICAL_ALIGN, + containerId: shouldBindToContainer ? container?.id : undefined, + groupIds: container?.groupIds ?? [], + lineHeight, + angle: container?.angle ?? (0 as Radians), + frameId: topLayerFrame ? topLayerFrame.id : null, + }); if (!existingTextElement && shouldBindToContainer && container) { mutateElement(container, { diff --git a/packages/excalidraw/data/restore.ts b/packages/excalidraw/data/restore.ts index 1811cbb57..4f050c922 100644 --- a/packages/excalidraw/data/restore.ts +++ b/packages/excalidraw/data/restore.ts @@ -439,7 +439,7 @@ const repairContainerElement = ( // if defined, lest boundElements is stale !boundElement.containerId ) { - (boundElement as Mutable).containerId = + (boundElement as Mutable).containerId = container.id; } } @@ -464,10 +464,6 @@ const repairBoundElement = ( ? elementsMap.get(boundElement.containerId) : null; - (boundElement as Mutable).angle = ( - isArrowElement(container) ? 0 : container?.angle ?? 0 - ) as Radians; - if (!container) { boundElement.containerId = null; return; diff --git a/packages/excalidraw/tests/__snapshots__/history.test.tsx.snap b/packages/excalidraw/tests/__snapshots__/history.test.tsx.snap index cf7f059ae..9ffb97128 100644 --- a/packages/excalidraw/tests/__snapshots__/history.test.tsx.snap +++ b/packages/excalidraw/tests/__snapshots__/history.test.tsx.snap @@ -926,12 +926,11 @@ History { ], ], "startBinding": null, - "y": 0, }, "inserted": { "endBinding": { "elementId": "id166", - "focus": "-0.00000", + "focus": -0, "gap": 1, }, "points": [ @@ -946,10 +945,9 @@ History { ], "startBinding": { "elementId": "id165", - "focus": "0.00000", + "focus": 0, "gap": 1, }, - "y": "-0.00000", }, }, }, diff --git a/packages/excalidraw/wysiwyg/textWysiwyg.test.tsx b/packages/excalidraw/wysiwyg/textWysiwyg.test.tsx index 0ba1960d6..959c5a012 100644 --- a/packages/excalidraw/wysiwyg/textWysiwyg.test.tsx +++ b/packages/excalidraw/wysiwyg/textWysiwyg.test.tsx @@ -31,7 +31,6 @@ import { mockBoundingClientRect, restoreOriginalGetBoundingClientRect, } from "../tests/test-utils"; -import { actionBindText } from "../actions"; unmountComponent(); @@ -1569,101 +1568,5 @@ describe("textWysiwyg", () => { expect(text.containerId).toBe(null); expect(text.text).toBe("Excalidraw"); }); - - it("should reset the text element angle to the container's when binding to rotated non-arrow container", async () => { - const text = API.createElement({ - type: "text", - text: "Hello World!", - angle: 45, - }); - const rectangle = API.createElement({ - type: "rectangle", - width: 90, - height: 75, - angle: 30, - }); - - API.setElements([rectangle, text]); - - API.setSelectedElements([rectangle, text]); - - h.app.actionManager.executeAction(actionBindText); - - expect(text.angle).toBe(30); - expect(rectangle.angle).toBe(30); - }); - - it("should reset the text element angle to 0 when binding to rotated arrow container", async () => { - const text = API.createElement({ - type: "text", - text: "Hello World!", - angle: 45, - }); - const arrow = API.createElement({ - type: "arrow", - width: 90, - height: 75, - angle: 30, - }); - - API.setElements([arrow, text]); - - API.setSelectedElements([arrow, text]); - - h.app.actionManager.executeAction(actionBindText); - - expect(text.angle).toBe(0); - expect(arrow.angle).toBe(30); - }); - - it("should keep the text label at 0 degrees when used as an arrow label", async () => { - const arrow = API.createElement({ - type: "arrow", - width: 90, - height: 75, - angle: 30, - }); - - API.setElements([arrow]); - API.setSelectedElements([arrow]); - - mouse.doubleClickAt( - arrow.x + arrow.width / 2, - arrow.y + arrow.height / 2, - ); - - const editor = await getTextEditor(textEditorSelector, true); - - updateTextEditor(editor, "Hello World!"); - - Keyboard.exitTextEditor(editor); - - expect(h.elements[1].angle).toBe(0); - }); - - it("should keep the text label at the same degrees when used as a non-arrow label", async () => { - const rectangle = API.createElement({ - type: "rectangle", - width: 90, - height: 75, - angle: 30, - }); - - API.setElements([rectangle]); - API.setSelectedElements([rectangle]); - - mouse.doubleClickAt( - rectangle.x + rectangle.width / 2, - rectangle.y + rectangle.height / 2, - ); - - const editor = await getTextEditor(textEditorSelector, true); - - updateTextEditor(editor, "Hello World!"); - - Keyboard.exitTextEditor(editor); - - expect(h.elements[1].angle).toBe(30); - }); }); });