diff --git a/src/index.tsx b/src/index.tsx index b7898455..2ff0dc08 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -29,7 +29,8 @@ import { hasStroke, getElementAtPosition, createScene, - getElementContainingPosition + getElementContainingPosition, + hasText } from "./scene"; import { renderScene } from "./renderer"; @@ -252,6 +253,10 @@ export class App extends React.Component<{}, AppState> { element.fillStyle = pastedElement?.fillStyle; element.opacity = pastedElement?.opacity; element.roughness = pastedElement?.roughness; + if(isTextElement(element)) { + element.font = pastedElement?.font; + this.redrawTextBoundingBox(element); + } } }); this.forceUpdate(); @@ -324,6 +329,14 @@ export class App extends React.Component<{}, AppState> { } }; + private redrawTextBoundingBox = (element: ExcalidrawTextElement) => { + const metrics = measureText(element.text, element.font); + element.width = metrics.width; + element.height = metrics.height; + element.baseline = metrics.baseline; + this.forceUpdate(); + } + public render() { const canvasWidth = window.innerWidth - CANVAS_WINDOW_OFFSET_LEFT; const canvasHeight = window.innerHeight - CANVAS_WINDOW_OFFSET_TOP; @@ -452,6 +465,52 @@ export class App extends React.Component<{}, AppState> { > )} + {hasText(elements) && ( + <> +