smig/excalidraw
1
0
Fork 0
mirror of https://github.com/excalidraw/excalidraw.git synced 2025-05-03 10:00:07 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

PoC: Expose wysiwyg element to manipulate from outside (#1356)

Browse source 
* expose wysiwyg element to manipulate from outside

* keep focus after changing style

* update editingElement correctly

* remove mistake

* update text only

* proper check for element

* udpate snapshots

* add error log

* remove try catch handler

* remove blur event

* add proper types

* merge if condition

* simplify if condition

Co-Authored-By: Lipis <lipiridis@gmail.com>

Co-authored-by: dwelle <luzar.david@gmail.com>
Co-authored-by: Lipis <lipiridis@gmail.com>
Co-authored-by: Fausto95 <faustino.kialungila@gmail.com>
This commit is contained in:
Kostas Bariotis 2020-04-11 17:10:56 +01:00 • committed by GitHub
parent d2246bfb30
commit 5e2f164026
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
9 changed files with 134 additions and 11 deletions
Download patch file Download diff file Expand all files Collapse all files

26
src/components/App.tsx
View file

@ -25,6 +25,7 @@ import {
getElementWithResizeHandler,
canResizeMutlipleElements,
getResizeHandlerFromCoords,
isNonDeletedElement,
} from "../element";
import {
deleteSelectedElements,
@ -269,19 +270,31 @@ export class App extends React.Component<any, AppState> {
if (this.unmounted) {
return;
}
let editingElement: AppState["editingElement"] | null = null;
if (res.elements) {
res.elements.forEach((element) => {
if (
this.state.editingElement?.id === element.id &&
this.state.editingElement !== element &&
isNonDeletedElement(element)
) {
editingElement = element;
}
});
globalSceneState.replaceAllElements(res.elements);
if (res.commitToHistory) {
history.resumeRecording();
}
}
if (res.appState) {
if (res.appState || editingElement) {
if (res.commitToHistory) {
history.resumeRecording();
}
this.setState((state) => ({
...res.appState,
editingElement: editingElement || state.editingElement,
isCollaborating: state.isCollaborating,
collaborators: state.collaborators,
}));
@ -1186,9 +1199,6 @@ export class App extends React.Component<any, AppState> {
});
};
// deselect all other elements when inserting text
this.setState({ selectedElementIds: {} });
const deleteElement = () => {
globalSceneState.replaceAllElements([
...globalSceneState.getElementsIncludingDeleted().map((_element) => {
@ -1216,7 +1226,7 @@ export class App extends React.Component<any, AppState> {
]);
};
textWysiwyg({
const wysiwygElement = textWysiwyg({
x,
y,
initText: element.text,
@ -1236,6 +1246,7 @@ export class App extends React.Component<any, AppState> {
onSubmit: withBatchedUpdates((text) => {
updateElement(text);
this.setState((prevState) => ({
wysiwygElement: null,
selectedElementIds: {
...prevState.selectedElementIds,
[element.id]: true,
@ -1255,6 +1266,8 @@ export class App extends React.Component<any, AppState> {
resetSelection();
}),
});
// deselect all other elements when inserting text
this.setState({ selectedElementIds: {}, wysiwygElement });
// do an initial update to re-initialize element position since we were
// modifying element's x/y for sake of editor (case: syncing to remote)
@ -1564,6 +1577,9 @@ export class App extends React.Component<any, AppState> {
private handleCanvasPointerDown = (
event: React.PointerEvent<HTMLCanvasElement>,
) => {
if (this.state.wysiwygElement && this.state.wysiwygElement.submit) {
this.state.wysiwygElement.submit();
}
if (lastPointerUp !== null) {
// Unfortunately, sometimes we don't get a pointerup after a pointerdown,
// this can happen when a contextual menu or alert is triggered. In order to avoid