Aakansha Doshi 2 jaren geleden
bovenliggende
commit
15f19835fe

+ 2 - 2
src/element/newElement.ts

@@ -28,7 +28,7 @@ import {
   measureText,
   normalizeText,
   wrapText,
-  getContainerMaxWidth,
+  getBoundTextMaxWidth,
 } from "./textElement";
 import { VERTICAL_ALIGN } from "../constants";
 import { isArrowElement } from "./typeChecks";
@@ -261,7 +261,7 @@ export const refreshTextDimensions = (
     text = wrapText(
       text,
       getFontString(textElement),
-      getContainerMaxWidth(container),
+      getBoundTextMaxWidth(container),
     );
   }
   const dimensions = getAdjustedDimensions(textElement, text);

+ 4 - 4
src/element/resizeElements.ts

@@ -45,7 +45,7 @@ import {
   getBoundTextElementId,
   getContainerElement,
   handleBindTextResize,
-  getContainerMaxWidth,
+  getBoundTextMaxWidth,
 } from "./textElement";
 
 export const normalizeAngle = (angle: number): number => {
@@ -201,7 +201,7 @@ const measureFontSizeFromWidth = (
   if (hasContainer) {
     const container = getContainerElement(element);
     if (container) {
-      width = getContainerMaxWidth(container);
+      width = getBoundTextMaxWidth(container);
     }
   }
   const nextFontSize = element.fontSize * (nextWidth / width);
@@ -423,7 +423,7 @@ export const resizeSingleElement = (
 
       const nextFontSize = measureFontSizeFromWidth(
         boundTextElement,
-        getContainerMaxWidth(updatedElement),
+        getBoundTextMaxWidth(updatedElement),
       );
       if (nextFontSize === null) {
         return;
@@ -694,7 +694,7 @@ const resizeMultipleElements = (
       const fontSize = measureFontSizeFromWidth(
         boundTextElement ?? (element.orig as ExcalidrawTextElement),
         boundTextElement
-          ? getContainerMaxWidth(updatedElement)
+          ? getBoundTextMaxWidth(updatedElement)
           : updatedElement.width,
       );
 

+ 13 - 13
src/element/textElement.test.ts

@@ -3,8 +3,8 @@ import { API } from "../tests/helpers/api";
 import {
   computeContainerDimensionForBoundText,
   getContainerCoords,
-  getContainerMaxWidth,
-  getContainerMaxHeight,
+  getBoundTextMaxWidth,
+  getBoundTextMaxHeight,
   wrapText,
 } from "./textElement";
 import { ExcalidrawTextElementWithContainer, FontString } from "./types";
@@ -261,7 +261,7 @@ describe("Test measureText", () => {
     });
   });
 
-  describe("Test getContainerMaxWidth", () => {
+  describe("Test getBoundTextMaxWidth", () => {
     const params = {
       width: 178,
       height: 194,
@@ -269,17 +269,17 @@ describe("Test measureText", () => {
 
     it("should return max width when container is rectangle", () => {
       const container = API.createElement({ type: "rectangle", ...params });
-      expect(getContainerMaxWidth(container)).toBe(168);
+      expect(getBoundTextMaxWidth(container)).toBe(168);
     });
 
     it("should return max width when container is ellipse", () => {
       const container = API.createElement({ type: "ellipse", ...params });
-      expect(getContainerMaxWidth(container)).toBe(116);
+      expect(getBoundTextMaxWidth(container)).toBe(116);
     });
 
     it("should return max width when container is diamond", () => {
       const container = API.createElement({ type: "diamond", ...params });
-      expect(getContainerMaxWidth(container)).toBe(79);
+      expect(getBoundTextMaxWidth(container)).toBe(79);
     });
 
     it("should return max width when container is arrow", () => {
@@ -287,11 +287,11 @@ describe("Test measureText", () => {
         type: "arrow",
         ...params,
       });
-      expect(getContainerMaxWidth(container)).toBe(220);
+      expect(getBoundTextMaxWidth(container)).toBe(220);
     });
   });
 
-  describe("Test getContainerMaxHeight", () => {
+  describe("Test getBoundTextMaxHeight", () => {
     const params = {
       width: 178,
       height: 194,
@@ -315,17 +315,17 @@ describe("Test measureText", () => {
 
     it("should return max height when container is rectangle", () => {
       const container = API.createElement({ type: "rectangle", ...params });
-      expect(getContainerMaxHeight(container, boundTextElement)).toBe(184);
+      expect(getBoundTextMaxHeight(container, boundTextElement)).toBe(184);
     });
 
     it("should return max height when container is ellipse", () => {
       const container = API.createElement({ type: "ellipse", ...params });
-      expect(getContainerMaxHeight(container, boundTextElement)).toBe(127);
+      expect(getBoundTextMaxHeight(container, boundTextElement)).toBe(127);
     });
 
     it("should return max height when container is diamond", () => {
       const container = API.createElement({ type: "diamond", ...params });
-      expect(getContainerMaxHeight(container, boundTextElement)).toBe(87);
+      expect(getBoundTextMaxHeight(container, boundTextElement)).toBe(87);
     });
 
     it("should return max height when container is arrow", () => {
@@ -333,7 +333,7 @@ describe("Test measureText", () => {
         type: "arrow",
         ...params,
       });
-      expect(getContainerMaxHeight(container, boundTextElement)).toBe(194);
+      expect(getBoundTextMaxHeight(container, boundTextElement)).toBe(194);
     });
 
     it("should return max height when container is arrow and height is less than threshold", () => {
@@ -344,7 +344,7 @@ describe("Test measureText", () => {
         boundElements: [{ type: "text", id: "text-id" }],
       });
 
-      expect(getContainerMaxHeight(container, boundTextElement)).toBe(
+      expect(getBoundTextMaxHeight(container, boundTextElement)).toBe(
         boundTextElement.height,
       );
     });

+ 8 - 8
src/element/textElement.ts

@@ -56,7 +56,7 @@ export const redrawTextBoundingBox = (
   };
 
   if (container) {
-    maxWidth = getContainerMaxWidth(container);
+    maxWidth = getBoundTextMaxWidth(container);
     boundTextUpdates.text = wrapText(
       textElement.originalText,
       getFontString(textElement),
@@ -74,7 +74,7 @@ export const redrawTextBoundingBox = (
 
   if (container) {
     const containerDims = getContainerDims(container);
-    const maxContainerHeight = getContainerMaxHeight(
+    const maxContainerHeight = getBoundTextMaxHeight(
       container,
       textElement as ExcalidrawTextElementWithContainer,
     );
@@ -167,8 +167,8 @@ export const handleBindTextResize = (
     let nextHeight = textElement.height;
     let nextWidth = textElement.width;
     const containerDims = getContainerDims(container);
-    const maxWidth = getContainerMaxWidth(container);
-    const maxHeight = getContainerMaxHeight(
+    const maxWidth = getBoundTextMaxWidth(container);
+    const maxHeight = getBoundTextMaxHeight(
       container,
       textElement as ExcalidrawTextElementWithContainer,
     );
@@ -230,8 +230,8 @@ export const computeBoundTextPosition = (
   boundTextElement: ExcalidrawTextElementWithContainer,
 ) => {
   const containerCoords = getContainerCoords(container);
-  const maxContainerHeight = getContainerMaxHeight(container, boundTextElement);
-  const maxContainerWidth = getContainerMaxWidth(container);
+  const maxContainerHeight = getBoundTextMaxHeight(container, boundTextElement);
+  const maxContainerWidth = getBoundTextMaxWidth(container);
 
   let x;
   let y;
@@ -746,7 +746,7 @@ export const computeContainerDimensionForBoundText = (
   return dimension + padding;
 };
 
-export const getContainerMaxWidth = (container: ExcalidrawElement) => {
+export const getBoundTextMaxWidth = (container: ExcalidrawElement) => {
   const width = getContainerDims(container).width;
   if (isArrowElement(container)) {
     return width - BOUND_TEXT_PADDING * 8 * 2;
@@ -766,7 +766,7 @@ export const getContainerMaxWidth = (container: ExcalidrawElement) => {
   return width - BOUND_TEXT_PADDING * 2;
 };
 
-export const getContainerMaxHeight = (
+export const getBoundTextMaxHeight = (
   container: ExcalidrawElement,
   boundTextElement: ExcalidrawTextElementWithContainer,
 ) => {

+ 6 - 6
src/element/textWysiwyg.tsx

@@ -32,8 +32,8 @@ import {
   normalizeText,
   redrawTextBoundingBox,
   wrapText,
-  getContainerMaxHeight,
-  getContainerMaxWidth,
+  getBoundTextMaxHeight,
+  getBoundTextMaxWidth,
   computeBoundTextPosition,
   getTextHeight,
 } from "./textElement";
@@ -202,8 +202,8 @@ export const textWysiwyg = ({
           }
         }
 
-        maxWidth = getContainerMaxWidth(container);
-        maxHeight = getContainerMaxHeight(
+        maxWidth = getBoundTextMaxWidth(container);
+        maxHeight = getBoundTextMaxHeight(
           container,
           updatedTextElement as ExcalidrawTextElementWithContainer,
         );
@@ -348,7 +348,7 @@ export const textWysiwyg = ({
         const wrappedText = wrapText(
           `${editable.value}${data}`,
           font,
-          getContainerMaxWidth(container),
+          getBoundTextMaxWidth(container),
         );
         const width = getTextWidth(wrappedText, font);
         editable.style.width = `${width}px`;
@@ -365,7 +365,7 @@ export const textWysiwyg = ({
         const wrappedText = wrapText(
           normalizeText(editable.value),
           font,
-          getContainerMaxWidth(container!),
+          getBoundTextMaxWidth(container!),
         );
         const { width, height } = measureText(wrappedText, font);
         editable.style.width = `${width}px`;

+ 4 - 4
src/renderer/renderElement.ts

@@ -44,8 +44,8 @@ import {
   getBoundTextElement,
   getContainerCoords,
   getContainerElement,
-  getContainerMaxHeight,
-  getContainerMaxWidth,
+  getBoundTextMaxHeight,
+  getBoundTextMaxWidth,
 } from "../element/textElement";
 import { LinearElementEditor } from "../element/linearElementEditor";
 
@@ -829,8 +829,8 @@ const drawElementFromCanvas = (
       context.strokeRect(
         (coords.x + renderConfig.scrollX) * window.devicePixelRatio,
         (coords.y + renderConfig.scrollY) * window.devicePixelRatio,
-        getContainerMaxWidth(element) * window.devicePixelRatio,
-        getContainerMaxHeight(element, textElement) * window.devicePixelRatio,
+        getBoundTextMaxWidth(element) * window.devicePixelRatio,
+        getBoundTextMaxHeight(element, textElement) * window.devicePixelRatio,
       );
     }
   }

+ 4 - 4
src/tests/linearElementEditor.test.tsx

@@ -17,7 +17,7 @@ import { KEYS } from "../keys";
 import { LinearElementEditor } from "../element/linearElementEditor";
 import { queryByTestId, queryByText } from "@testing-library/react";
 import { resize, rotate } from "./utils";
-import { wrapText, getContainerMaxWidth } from "../element/textElement";
+import { wrapText, getBoundTextMaxWidth } from "../element/textElement";
 import * as textElementUtils from "../element/textElement";
 import { ROUNDNESS } from "../constants";
 
@@ -725,7 +725,7 @@ describe("Test Linear Elements", () => {
         type: "text",
         x: 0,
         y: 0,
-        text: wrapText(text, font, getContainerMaxWidth(container)),
+        text: wrapText(text, font, getBoundTextMaxWidth(container)),
         containerId: container.id,
         width: 30,
         height: 20,
@@ -1151,7 +1151,7 @@ describe("Test Linear Elements", () => {
       expect(rect.x).toBe(400);
       expect(rect.y).toBe(0);
       expect(
-        wrapText(textElement.originalText, font, getContainerMaxWidth(arrow)),
+        wrapText(textElement.originalText, font, getBoundTextMaxWidth(arrow)),
       ).toMatchInlineSnapshot(`
         "Online whiteboard collaboration
         made easy"
@@ -1174,7 +1174,7 @@ describe("Test Linear Elements", () => {
         false,
       );
       expect(
-        wrapText(textElement.originalText, font, getContainerMaxWidth(arrow)),
+        wrapText(textElement.originalText, font, getBoundTextMaxWidth(arrow)),
       ).toMatchInlineSnapshot(`
         "Online whiteboard 
         collaboration made