feat: add container to multiple text elements (#6428)

Co-authored-by: dwelle <luzar.david@gmail.com>
This commit is contained in:
Chinmay Mhatre 2023-04-07 19:20:36 +05:30 committed by GitHub
parent d61b3cf83d
commit 68692b9d4c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -23,6 +23,7 @@ import {
ExcalidrawTextElement,
} from "../element/types";
import { getSelectedElements } from "../scene";
import { AppState } from "../types";
import { getFontString } from "../utils";
import { register } from "./register";
@ -185,16 +186,19 @@ export const actionCreateContainerFromText = register({
trackEvent: { category: "element" },
predicate: (elements, appState) => {
const selectedElements = getSelectedElements(elements, appState);
return selectedElements.length === 1 && isTextElement(selectedElements[0]);
const areTextElements = selectedElements.every((el) => isTextElement(el));
return selectedElements.length > 0 && areTextElements;
},
perform: (elements, appState) => {
const selectedElements = getSelectedElements(
getNonDeletedElements(elements),
appState,
);
const updatedElements = elements.slice();
if (selectedElements.length === 1 && isTextElement(selectedElements[0])) {
const textElement = selectedElements[0];
let updatedElements: readonly ExcalidrawElement[] = elements.slice();
const containerIds: AppState["selectedElementIds"] = {};
for (const textElement of selectedElements) {
if (isTextElement(textElement)) {
const container = newElement({
type: "rectangle",
backgroundColor: appState.currentItemBackgroundColor,
@ -255,37 +259,37 @@ export const actionCreateContainerFromText = register({
}
if (startBinding || endBinding) {
mutateElement(ele, { startBinding, endBinding });
mutateElement(ele, { startBinding, endBinding }, false);
}
});
}
mutateElement(textElement, {
mutateElement(
textElement,
{
containerId: container.id,
verticalAlign: VERTICAL_ALIGN.MIDDLE,
boundElements: null,
});
},
false,
);
redrawTextBoundingBox(textElement, container);
return {
elements: pushContainerBelowText(
[...elements, container],
updatedElements = pushContainerBelowText(
[...updatedElements, container],
container,
textElement,
),
appState: {
...appState,
selectedElementIds: {
[container.id]: true,
[textElement.id]: false,
},
},
commitToHistory: true,
};
);
containerIds[container.id] = true;
}
}
return {
elements: updatedElements,
appState,
appState: {
...appState,
selectedElementIds: containerIds,
},
commitToHistory: true,
};
},