fix: compute dimensions of container correctly when text pasted on container (#5845)

* fix: compute dimensions of container correctly when text pasted on container

* add test

* remove only
This commit is contained in:
Aakansha Doshi 2022-11-08 19:50:41 +05:30 committed by GitHub
parent e1c5c706c6
commit e201e79cd0
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 71 additions and 7 deletions

View file

@ -20,6 +20,7 @@ import {
getBoundTextElementId,
getContainerDims,
getContainerElement,
measureText,
wrapText,
} from "./textElement";
import {
@ -29,6 +30,7 @@ import {
import { actionZoomIn, actionZoomOut } from "../actions/actionCanvas";
import App from "../components/App";
import { getMaxContainerWidth } from "./newElement";
import { parseClipboard } from "../clipboard";
const normalizeText = (text: string) => {
return (
@ -275,6 +277,31 @@ export const textWysiwyg = ({
updateWysiwygStyle();
if (onChange) {
editable.onpaste = async (event) => {
event.preventDefault();
const clipboardData = await parseClipboard(event);
if (!clipboardData.text) {
return;
}
const data = normalizeText(clipboardData.text);
const container = getContainerElement(element);
const font = getFontString({
fontSize: app.state.currentItemFontSize,
fontFamily: app.state.currentItemFontFamily,
});
const wrappedText = wrapText(
data,
font,
getMaxContainerWidth(container!),
);
const dimensions = measureText(wrappedText, font);
editable.style.height = `${dimensions.height}px`;
if (data) {
onChange(wrappedText);
}
};
editable.oninput = () => {
const updatedTextElement = Scene.getScene(element)?.getElement(
id,