1
0
mirror of https://github.com/excalidraw/excalidraw.git synced 2025-02-18 13:29:36 +01:00

fix: show text properties button states correctly for bounded text (#4542)

* fix: show text properties button states correctly for bounded text

* rename
This commit is contained in:
Aakansha Doshi 2022-01-05 17:58:03 +05:30 committed by GitHub
parent cec92c1d17
commit 5f1616f2c5
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 45 additions and 3 deletions

@ -42,6 +42,7 @@ import {
redrawTextBoundingBox, redrawTextBoundingBox,
} from "../element"; } from "../element";
import { newElementWith } from "../element/mutateElement"; import { newElementWith } from "../element/mutateElement";
import { getBoundTextElement } from "../element/textElement";
import { isLinearElement, isLinearElementType } from "../element/typeChecks"; import { isLinearElement, isLinearElementType } from "../element/typeChecks";
import { import {
Arrowhead, Arrowhead,
@ -495,7 +496,16 @@ export const actionChangeFontSize = register({
value={getFormValue( value={getFormValue(
elements, elements,
appState, appState,
(element) => isTextElement(element) && element.fontSize, (element) => {
if (isTextElement(element)) {
return element.fontSize;
}
const boundTextElement = getBoundTextElement(element);
if (boundTextElement) {
return boundTextElement.fontSize;
}
return null;
},
appState.currentItemFontSize || DEFAULT_FONT_SIZE, appState.currentItemFontSize || DEFAULT_FONT_SIZE,
)} )}
onChange={(value) => updateData(value)} onChange={(value) => updateData(value)}
@ -567,7 +577,16 @@ export const actionChangeFontFamily = register({
value={getFormValue( value={getFormValue(
elements, elements,
appState, appState,
(element) => isTextElement(element) && element.fontFamily, (element) => {
if (isTextElement(element)) {
return element.fontFamily;
}
const boundTextElement = getBoundTextElement(element);
if (boundTextElement) {
return boundTextElement.fontFamily;
}
return null;
},
appState.currentItemFontFamily || DEFAULT_FONT_FAMILY, appState.currentItemFontFamily || DEFAULT_FONT_FAMILY,
)} )}
onChange={(value) => updateData(value)} onChange={(value) => updateData(value)}
@ -633,7 +652,16 @@ export const actionChangeTextAlign = register({
value={getFormValue( value={getFormValue(
elements, elements,
appState, appState,
(element) => isTextElement(element) && element.textAlign, (element) => {
if (isTextElement(element)) {
return element.textAlign;
}
const boundTextElement = getBoundTextElement(element);
if (boundTextElement) {
return boundTextElement.textAlign;
}
return null;
},
appState.currentItemTextAlign, appState.currentItemTextAlign,
)} )}
onChange={(value) => updateData(value)} onChange={(value) => updateData(value)}

@ -3,6 +3,7 @@ import {
ExcalidrawBindableElement, ExcalidrawBindableElement,
ExcalidrawElement, ExcalidrawElement,
ExcalidrawTextElement, ExcalidrawTextElement,
ExcalidrawTextElementWithContainer,
FontString, FontString,
NonDeletedExcalidrawElement, NonDeletedExcalidrawElement,
} from "./types"; } from "./types";
@ -408,3 +409,16 @@ export const getApproxCharsToFitInWidth = (font: FontString, width: number) => {
export const getBoundTextElementId = (container: ExcalidrawElement | null) => { export const getBoundTextElementId = (container: ExcalidrawElement | null) => {
return container?.boundElements?.filter((ele) => ele.type === "text")[0]?.id; return container?.boundElements?.filter((ele) => ele.type === "text")[0]?.id;
}; };
export const getBoundTextElement = (element: ExcalidrawElement | null) => {
if (!element) {
return null;
}
const boundTextElementId = getBoundTextElementId(element);
if (boundTextElementId) {
return Scene.getScene(element)!.getElement(
boundTextElementId,
) as ExcalidrawTextElementWithContainer;
}
return null;
};